vue-mes
查看 | 历史 | 提交 | 提交对比
懒羊羊
2023-12-14 03bb7a267ef4daa31ee435b4e540df385053d198
提交 | 用户 | 时间
83806e 1 <template>
懒 2   <div class="app-container">
79a2ad 3     <el-card class="box-card">
懒 4       <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
5         <el-form-item label-width="120" label="工艺流程编码" prop="routeCode">
6           <el-input
7             v-model="queryParams.routeCode"
8             placeholder="请输入工艺流程编码"
9             clearable
10             @keyup.enter.native="handleQuery"
11           />
12         </el-form-item>
13         <el-form-item label-width="120" label="工艺流程名称" prop="routeName">
14           <el-input
15             v-model="queryParams.routeName"
16             placeholder="请输入工艺流程名称"
17             clearable
18             @keyup.enter.native="handleQuery"
19           />
20         </el-form-item>
21         <el-form-item label="产品编码" prop="productCode">
22           <el-input
23             v-model="queryParams.productCode"
24             placeholder="请输入产品编码"
25             clearable
26             @keyup.enter.native="handleQuery"
27           />
28         </el-form-item>
29         <el-form-item label="产品名称" prop="productName">
30           <el-input
31             v-model="queryParams.productName"
32             placeholder="请输入产品名称"
33             clearable
34             @keyup.enter.native="handleQuery"
35           />
36         </el-form-item>
37   <!--      <el-form-item label="状态(字典)" prop="status">-->
38   <!--        <el-select v-model="queryParams.status" placeholder="请选择状态(字典)" clearable>-->
39   <!--          <el-option-->
40   <!--            v-for="dict in dict.type.${dictType}"-->
41   <!--            :key="dict.value"-->
42   <!--            :label="dict.label"-->
43   <!--            :value="dict.value"-->
44   <!--          />-->
45   <!--        </el-select>-->
46   <!--      </el-form-item>-->
10bfb5 47         <el-form-item style="float: right">
79a2ad 48           <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
懒 49           <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
50         </el-form-item>
10bfb5 51 <!--        <el-form-item label="数据来源" prop="dataSource">-->
懒 52 <!--          <el-input-->
53 <!--            v-model="queryParams.dataSource"-->
54 <!--            placeholder="请输入数据来源"-->
55 <!--            clearable-->
56 <!--            @keyup.enter.native="handleQuery"-->
57 <!--          />-->
58 <!--        </el-form-item>-->
79a2ad 59       </el-form>
懒 60     </el-card>
83806e 61
79a2ad 62     <el-card style="margin-top: 10px" class="box-card">
懒 63       <el-row :gutter="10" class="mb8">
64         <el-col :span="1.5">
83806e 65           <el-button
79a2ad 66             type="primary"
懒 67             plain
68             icon="el-icon-plus"
83806e 69             size="mini"
79a2ad 70             @click="handleAdd"
懒 71             v-hasPermi="['bs:technologyRoute:add']"
72           >新增</el-button>
73         </el-col>
74         <el-col :span="1.5">
75           <el-button
76             type="success"
77             plain
83806e 78             icon="el-icon-edit"
79a2ad 79             size="mini"
懒 80             :disabled="single"
81             @click="handleUpdate"
83806e 82             v-hasPermi="['bs:technologyRoute:edit']"
懒 83           >修改</el-button>
79a2ad 84         </el-col>
懒 85         <el-col :span="1.5">
83806e 86           <el-button
79a2ad 87             type="danger"
懒 88             plain
83806e 89             icon="el-icon-delete"
79a2ad 90             size="mini"
懒 91             :disabled="multiple"
92             @click="handleDelete"
83806e 93             v-hasPermi="['bs:technologyRoute:remove']"
懒 94           >删除</el-button>
79a2ad 95         </el-col>
懒 96         <el-col :span="1.5">
97           <el-button
98             type="warning"
99             plain
100             icon="el-icon-download"
101             size="mini"
102             @click="handleExport"
103             v-hasPermi="['bs:technologyRoute:export']"
104           >导出</el-button>
105         </el-col>
106         <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
107       </el-row>
108
a04319 109       <el-table border v-loading="loading" :data="technologyRouteList" @selection-change="handleSelectionChange" v-if="technologyRouteList.length > 0">
79a2ad 110         <el-table-column type="selection" width="55" align="center" />
10bfb5 111         <el-table-column label="工艺流程编码" width="130" align="center">
79a2ad 112           <template slot-scope="scope">
03bb7a 113             <router-link :to="{path: '/main/route-data/index/', query: {routeCode: scope.row.routeCode,routeId: scope.row.id} }" class="link-type">
79a2ad 114               <span>{{ scope.row.routeCode }}</span>
懒 115             </router-link>
116           </template>
117         </el-table-column>
effa74 118         <el-table-column  :show-overflow-tooltip='true' label="工艺流程名称" width="130" align="center" prop="routeName">
79a2ad 119         </el-table-column>
10bfb5 120         <el-table-column label="产品编码" width="130" align="center" prop="productCode">
79a2ad 121         </el-table-column>
10bfb5 122         <el-table-column label="产品名称" width="160" align="center" prop="productName">
79a2ad 123         </el-table-column>
900ee1 124         <el-table-column label="版本" align="center" prop="version">
79a2ad 125         </el-table-column>
10bfb5 126         <el-table-column label="状态" align="center" prop="status">
懒 127           <template slot-scope="scope">
128             <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
129           </template>
79a2ad 130         </el-table-column>
懒 131         <el-table-column label="数据来源" align="center" prop="dataSource">
132         </el-table-column>
133         <el-table-column label="备注" align="center" prop="remark">
134         </el-table-column>
135         <el-table-column label="创建用户" align="center" prop="createUser">
136         </el-table-column>
10bfb5 137         <el-table-column label="创建时间" width="160" align="center" prop="createTime">
79a2ad 138         </el-table-column>
懒 139         <el-table-column label="更改用户" align="center" prop="updateUser">
140         </el-table-column>
10bfb5 141         <el-table-column label="更改时间" width="160" align="center" prop="updateTime">
79a2ad 142         </el-table-column>
03bb7a 143         <el-table-column fixed="right" label="操作" width="200" align="center" class-name="small-padding fixed-width">
79a2ad 144           <template slot-scope="scope">
懒 145             <el-button
146               size="mini"
a04319 147               type="success"
H 148               plain
149               style="width: 72px"
79a2ad 150               icon="el-icon-edit"
懒 151               @click="handleUpdate(scope.row)"
152               v-hasPermi="['bs:technologyRoute:edit']"
153             >修改</el-button>
154             <el-button
155               size="mini"
a04319 156               plain
H 157               style="width: 72px"
158               type="danger"
79a2ad 159               icon="el-icon-delete"
懒 160               @click="handleDelete(scope.row)"
161               v-hasPermi="['bs:technologyRoute:remove']"
162             >删除</el-button>
163           </template>
164         </el-table-column>
165       </el-table>
a04319 166       <el-empty v-else>
H 167         <span slot="description">暂无数据</span>
168       </el-empty>
79a2ad 169     </el-card>
83806e 170
懒 171     <pagination
172       v-show="total>0"
173       :total="total"
174       :page.sync="queryParams.pageNum"
175       :limit.sync="queryParams.pageSize"
176       @pagination="getList"
177     />
178
179     <!-- 添加或修改工艺流程对话框 -->
180     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
a04319 181       <span slot="title">
H 182         <i class="el-icon-s-order"></i>
183         {{titleName}}
184       </span>
83806e 185       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
懒 186         <el-form-item label="工艺流程编码" prop="routeCode">
187           <el-input v-model="form.routeCode" placeholder="请输入工艺流程编码" />
188         </el-form-item>
189         <el-form-item label="工艺流程名称" prop="routeName">
190           <el-input v-model="form.routeName" placeholder="请输入工艺流程名称" />
191         </el-form-item>
192         <el-form-item label="产品编码" prop="productCode">
193           <el-input v-model="form.productCode" placeholder="请输入产品编码" />
194         </el-form-item>
195         <el-form-item label="产品名称" prop="productName">
196           <el-input v-model="form.productName" placeholder="请输入产品名称" />
197         </el-form-item>
10bfb5 198         <el-form-item label="状态" prop="status">
懒 199           <el-radio-group v-model="form.status">
200             <el-radio
201               v-for="dict in dict.type.sys_normal_disable"
202               :key="dict.value"
203               :label="dict.value"
204             >{{dict.label}}</el-radio>
205           </el-radio-group>
206         </el-form-item>
83806e 207         <el-form-item label="版本" prop="version">
懒 208           <el-input v-model="form.version" placeholder="请输入版本" />
209         </el-form-item>
210         <el-form-item label="备注" prop="remark">
211           <el-input v-model="form.remark" placeholder="请输入备注" />
212         </el-form-item>
213       </el-form>
214       <div slot="footer" class="dialog-footer">
215         <el-button type="primary" @click="submitForm">确 定</el-button>
216         <el-button @click="cancel">取 消</el-button>
217       </div>
218     </el-dialog>
219   </div>
220 </template>
221
222 <script>
03bb7a 223 import { updateTechnologyRouteAndChild, listTechnologyRoute, getTechnologyRoute, delTechnologyRoute, addTechnologyRoute, updateTechnologyRoute } from "@/api/main/bs/technologyRoute/technologyRoute";
83806e 224
懒 225 export default {
226   name: "TechnologyRoute",
10bfb5 227   dicts: ['sys_normal_disable'],
懒 228
83806e 229   data() {
懒 230     return {
231       // 遮罩层
232       loading: true,
a04319 233       titleName: 'test',
83806e 234       // 选中数组
懒 235       ids: [],
236       // 非单个禁用
237       single: true,
238       // 非多个禁用
239       multiple: true,
240       // 显示搜索条件
241       showSearch: true,
242       // 总条数
243       total: 0,
244       // 工艺流程表格数据
245       technologyRouteList: [],
246       // 弹出层标题
247       title: "",
248       // 是否显示弹出层
249       open: false,
250       // 查询参数
251       queryParams: {
252         pageNum: 1,
253         pageSize: 10,
254         routeCode: null,
255         routeName: null,
256         productCode: null,
257         productName: null,
258         status: null,
259         dataSource: null,
260       },
261       // 表单参数
262       form: {},
263       // 表单校验
264       rules: {
265         id: [
266           { required: true, message: "主键id不能为空", trigger: "blur" }
267         ],
268         routeCode: [
269           { required: true, message: "工艺流程编码不能为空", trigger: "blur" }
270         ],
271         productCode: [
272           { required: true, message: "产品编码不能为空", trigger: "blur" }
273         ],
274       }
275     };
276   },
277   created() {
278     this.getList();
279   },
280   methods: {
281     /** 查询工艺流程列表 */
282     getList() {
283       this.loading = true;
284       listTechnologyRoute(this.queryParams).then(response => {
5d5153 285         console.log(response.rows)
83806e 286         this.technologyRouteList = response.rows;
懒 287         console.log(this.technologyRouteList)
288         this.total = response.total;
289         this.loading = false;
290       });
291     },
292     // 取消按钮
293     cancel() {
294       this.open = false;
295       this.reset();
296     },
297     // 表单重置
298     reset() {
299       this.form = {
300         id: null,
301         routeCode: null,
302         routeName: null,
303         productCode: null,
304         productName: null,
305         version: null,
10bfb5 306         status: "0",
83806e 307         dataSource: null,
懒 308         remark: null,
309         createUser: null,
310         createTime: null,
311         updateUser: null,
312         updateTime: null,
313         spareField1: null,
314         spareField2: null,
315         spareField3: null,
316         spareField4: null
317       };
318       this.resetForm("form");
319     },
320     /** 搜索按钮操作 */
321     handleQuery() {
322       this.queryParams.pageNum = 1;
323       this.getList();
324     },
325     /** 重置按钮操作 */
326     resetQuery() {
327       this.resetForm("queryForm");
328       this.handleQuery();
329     },
330     // 多选框选中数据
331     handleSelectionChange(selection) {
332       this.ids = selection.map(item => item.id)
333       this.single = selection.length!==1
334       this.multiple = !selection.length
335     },
336     /** 新增按钮操作 */
337     handleAdd() {
338       this.reset();
339       this.open = true;
a04319 340       this.titleName = "添加工艺流程";
83806e 341     },
懒 342     /** 修改按钮操作 */
343     handleUpdate(row) {
344       this.reset();
345       const id = row.id || this.ids
346       getTechnologyRoute(id).then(response => {
347         this.form = response.data;
348         this.open = true;
a04319 349         this.titleName = "修改工艺流程";
83806e 350       });
懒 351     },
352     /** 提交按钮 */
353     submitForm() {
354       this.$refs["form"].validate(valid => {
355         if (valid) {
356           if (this.form.id != null) {
03bb7a 357             // updateTechnologyRoute(this.form).then(response => {
懒 358             updateTechnologyRouteAndChild(this.form).then(response => {
83806e 359               this.$modal.msgSuccess("修改成功");
懒 360               this.open = false;
361               this.getList();
362             });
363           } else {
364             addTechnologyRoute(this.form).then(response => {
365               this.$modal.msgSuccess("新增成功");
366               this.open = false;
367               this.getList();
368             });
369           }
370         }
371       });
372     },
373     /** 删除按钮操作 */
374     handleDelete(row) {
375       const ids = row.id || this.ids;
376       this.$modal.confirm('是否确认删除工艺流程编号为"' + ids + '"的数据项？').then(function() {
377         return delTechnologyRoute(ids);
378       }).then(() => {
379         this.getList();
380         this.$modal.msgSuccess("删除成功");
381       }).catch(() => {});
382     },
383     /** 导出按钮操作 */
384     handleExport() {
385       this.download('main/technologyRoute/export', {
386         ...this.queryParams
387       }, `technologyRoute_${new Date().getTime()}.xlsx`)
388     }
389   }
390 };
391 </script>
a04319 392 <style>
H 393 .el-dialog__header{
394   /*background-color: #f8f8f8;*/
395   background-color: #f8f8f9;
396 }
397 </style>