集成mybatisplus
查看 | 历史 | 提交 | 提交对比
wujian
2024-02-22 268beb4ebc1e5b8d4ad715b71cd64a0944073a87
提交 | 用户 | 时间
268beb 1 <template>
W 2   <div class="app-container">
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="设备编号" prop="equipmentNo">
6             <el-input
7               v-model="queryParams.equipmentNo"
8               placeholder="请输入设备编号"
9               clearable
10               @keyup.enter.native="handleQuery"
11             />
12           </el-form-item>
13           <el-form-item label="设备名称" prop="equipmentName">
14             <el-input
15               v-model="queryParams.equipmentName"
16               placeholder="请输入设备名称"
17               clearable
18               @keyup.enter.native="handleQuery"
19             />
20           </el-form-item>
21 <!--          <el-form-item label="车间编号" prop="workshopCode">-->
22 <!--            <el-input-->
23 <!--              v-model="queryParams.workshopCode"-->
24 <!--              placeholder="请输入车间编号"-->
25 <!--              clearable-->
26 <!--              @keyup.enter.native="handleQuery"-->
27 <!--            />-->
28 <!--          </el-form-item>-->
29 <!--          <el-form-item label="产线编号" prop="productionLineCode">-->
30 <!--            <el-input-->
31 <!--              v-model="queryParams.productionLineCode"-->
32 <!--              placeholder="请输入产线编号"-->
33 <!--              clearable-->
34 <!--              @keyup.enter.native="handleQuery"-->
35 <!--            />-->
36 <!--          </el-form-item>-->
37           <el-form-item label="工序编号" prop="processesCode">
38             <el-input
39               v-model="queryParams.processesCode"
40               placeholder="请输入工序编号"
41               clearable
42               @keyup.enter.native="handleQuery"
43             />
44           </el-form-item>
45 <!--          <el-form-item label="设备状态(1运转2待机3故障)" prop="eqStatus">-->
46 <!--            <el-select v-model="queryParams.eqStatus" placeholder="请选择设备状态(1运转2待机3故障)" clearable>-->
47 <!--              <el-option-->
48 <!--                v-for="dict in dict.type.${dictType}"-->
49 <!--                :key="dict.value"-->
50 <!--                :label="dict.label"-->
51 <!--                :value="dict.value"-->
52 <!--              />-->
53 <!--            </el-select>-->
54 <!--          </el-form-item>-->
55           <el-form-item style="float: right">
56             <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
57             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
58           </el-form-item>
59         </el-form>
60     </el-card>
61
62     <el-card style="margin-top: 10px" class="box-card">
63         <el-row :gutter="10" class="mb8">
64           <el-col :span="1.5">
65             <el-button
66               type="primary"
67               plain
68               icon="el-icon-plus"
69               size="mini"
70               @click="handleAdd"
71               v-hasPermi="['em:equipmentStatus:add']"
72             >新增</el-button>
73           </el-col>
74           <el-col :span="1.5">
75             <el-button
76               type="success"
77               plain
78               icon="el-icon-edit"
79               size="mini"
80               :disabled="single"
81               @click="handleUpdate"
82               v-hasPermi="['em:equipmentStatus:edit']"
83             >修改</el-button>
84           </el-col>
85           <el-col :span="1.5">
86             <el-button
87               type="danger"
88               plain
89               icon="el-icon-delete"
90               size="mini"
91               :disabled="multiple"
92               @click="handleDelete"
93               v-hasPermi="['em:equipmentStatus:remove']"
94             >删除</el-button>
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="['em:equipmentStatus:export']"
104             >导出</el-button>
105           </el-col>
106           <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
107         </el-row>
108
109         <el-table border v-loading="loading" :data="equipmentStatusList" @selection-change="handleSelectionChange">
110           <el-table-column type="selection" width="55" align="center" />
111           <el-table-column label="ID" align="center" prop="id" />
112           <el-table-column label="设备编号" align="center" prop="equipmentNo">
113           </el-table-column>
114           <el-table-column label="设备名称" align="center" prop="equipmentName">
115           </el-table-column>
116           <el-table-column label="车间编号" align="center" prop="workshopCode">
117           </el-table-column>
118           <el-table-column label="产线编号" align="center" prop="productionLineCode">
119           </el-table-column>
120           <el-table-column label="工序编号" align="center" prop="processesCode">
121           </el-table-column>
122           <el-table-column label="设备状态(1运转2待机3故障)" align="center" prop="eqStatus">
123           </el-table-column>
124           <el-table-column label="备注" align="center" prop="remarks">
125           </el-table-column>
126           <el-table-column label="更新时间" align="center" prop="updateTime">
127           </el-table-column>
128           <el-table-column fixed="right" width="200" label="操作" align="center" class-name="small-padding fixed-width">
129             <template slot-scope="scope">
130               <el-button
131                 size="mini"
132                 type="success"
133                 plain
134                 style="width: 72px"
135                 icon="el-icon-edit"
136                 @click="handleUpdate(scope.row)"
137                 v-hasPermi="['em:equipmentStatus:edit']"
138               >修改</el-button>
139               <el-button
140                 size="mini"
141                 type="danger"
142                 plain
143                 style="width: 72px"
144                 icon="el-icon-delete"
145                 @click="handleDelete(scope.row)"
146                 v-hasPermi="['em:equipmentStatus:remove']"
147               >删除</el-button>
148             </template>
149           </el-table-column>
150         </el-table>
151     </el-card>
152
153     <pagination
154       v-show="total>0"
155       :total="total"
156       :page.sync="queryParams.pageNum"
157       :limit.sync="queryParams.pageSize"
158       @pagination="getList"
159     />
160
161     <!-- 添加或修改设备状态对话框 -->
162     <el-dialog v-dialogpop-up :title="title" :visible.sync="open" width="500px" append-to-body>
163       <span slot="title">
164         <i class="el-icon-s-order"></i>
165         {{titleName}}
166       </span>
167       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
168         <el-form-item label="设备编号" prop="equipmentNo">
169           <el-input v-model="form.equipmentNo" placeholder="请输入设备编号" />
170         </el-form-item>
171         <el-form-item label="设备名称" prop="equipmentName">
172           <el-input v-model="form.equipmentName" placeholder="请输入设备名称" />
173         </el-form-item>
174         <el-form-item label="车间编号" prop="workshopCode">
175           <el-input v-model="form.workshopCode" placeholder="请输入车间编号" />
176         </el-form-item>
177         <el-form-item label="产线编号" prop="productionLineCode">
178           <el-input v-model="form.productionLineCode" placeholder="请输入产线编号" />
179         </el-form-item>
180         <el-form-item label="工序编号" prop="processesCode">
181           <el-input v-model="form.processesCode" placeholder="请输入工序编号" />
182         </el-form-item>
183 <!--        <el-form-item label="设备状态(1运转2待机3故障)" prop="eqStatus">-->
184 <!--          <el-radio-group v-model="form.eqStatus">-->
185 <!--            <el-radio-->
186 <!--              v-for="dict in dict.type.${dictType}"-->
187 <!--              :key="dict.value"-->
188 <!--              :label="dict.value"-->
189 <!--            >{{dict.label}}</el-radio>-->
190 <!--          </el-radio-group>-->
191 <!--        </el-form-item>-->
192         <el-form-item label="备注" prop="remarks">
193           <el-input v-model="form.remarks" placeholder="请输入备注" />
194         </el-form-item>
195       </el-form>
196       <div slot="footer" class="dialog-footer">
197         <el-button type="primary" @click="submitForm">确 定</el-button>
198         <el-button @click="cancel">取 消</el-button>
199       </div>
200     </el-dialog>
201   </div>
202 </template>
203
204 <script>
205 import { listEquipmentStatus, getEquipmentStatus, delEquipmentStatus, addEquipmentStatus, updateEquipmentStatus } from "@/api/main/em/equipmentStatus/equipmentStatus";
206
207 export default {
208   name: "EquipmentStatus",
209   data() {
210     return {
211       // 遮罩层
212       loading: true,
213       titleName: "",
214       // 选中数组
215       ids: [],
216       // 非单个禁用
217       single: true,
218       // 非多个禁用
219       multiple: true,
220       // 显示搜索条件
221       showSearch: true,
222       // 总条数
223       total: 0,
224       // 设备状态表格数据
225       equipmentStatusList: [],
226       // 弹出层标题
227       title: "",
228       // 是否显示弹出层
229       open: false,
230       // 查询参数
231       queryParams: {
232         pageNum: 1,
233         pageSize: 10,
234         equipmentNo: null,
235         equipmentName: null,
236         workshopCode: null,
237         productionLineCode: null,
238         processesCode: null,
239         eqStatus: null,
240       },
241       // 表单参数
242       form: {},
243       // 表单校验
244       rules: {
245         id: [
246           { required: true, message: "ID不能为空", trigger: "blur" }
247         ],
248       }
249     };
250   },
251   created() {
252     this.getList();
253   },
254   methods: {
255     /** 查询设备状态列表 */
256     getList() {
257       this.loading = true;
258       listEquipmentStatus(this.queryParams).then(response => {
259         this.equipmentStatusList = response.rows;
260         this.total = response.total;
261         this.loading = false;
262       });
263     },
264     // 取消按钮
265     cancel() {
266       this.open = false;
267       this.reset();
268     },
269     // 表单重置
270     reset() {
271       this.form = {
272         id: null,
273         equipmentNo: null,
274         equipmentName: null,
275         workshopCode: null,
276         productionLineCode: null,
277         processesCode: null,
278         eqStatus: null,
279         spareField1: null,
280         spareField2: null,
281         remarks: null,
282         updateTime: null
283       };
284       this.resetForm("form");
285     },
286     /** 搜索按钮操作 */
287     handleQuery() {
288       this.queryParams.pageNum = 1;
289       this.getList();
290     },
291     /** 重置按钮操作 */
292     resetQuery() {
293       this.resetForm("queryForm");
294       this.handleQuery();
295     },
296     // 多选框选中数据
297     handleSelectionChange(selection) {
298       this.ids = selection.map(item => item.id)
299       this.single = selection.length!==1
300       this.multiple = !selection.length
301     },
302     /** 新增按钮操作 */
303     handleAdd() {
304       this.reset();
305       this.open = true;
306       this.titleName = "添加设备状态";
307     },
308     /** 修改按钮操作 */
309     handleUpdate(row) {
310       this.reset();
311       const id = row.id || this.ids
312       getEquipmentStatus(id).then(response => {
313         this.form = response.data;
314         this.open = true;
315         this.titleName = "修改设备状态";
316       });
317     },
318     /** 提交按钮 */
319     submitForm() {
320       this.$refs["form"].validate(valid => {
321         if (valid) {
322           if (this.form.id != null) {
323             updateEquipmentStatus(this.form).then(response => {
324               this.$modal.msgSuccess("修改成功");
325               this.open = false;
326               this.getList();
327             });
328           } else {
329             addEquipmentStatus(this.form).then(response => {
330               this.$modal.msgSuccess("新增成功");
331               this.open = false;
332               this.getList();
333             });
334           }
335         }
336       });
337     },
338     /** 删除按钮操作 */
339     handleDelete(row) {
340       const ids = row.id || this.ids;
341       this.$modal.confirm('是否确认删除设备状态编号为"' + ids + '"的数据项？').then(function() {
342         return delEquipmentStatus(ids);
343       }).then(() => {
344         this.getList();
345         this.$modal.msgSuccess("删除成功");
346       }).catch(() => {});
347     },
348     /** 导出按钮操作 */
349     handleExport() {
350       this.download('em/equipmentStatus/export', {
351         ...this.queryParams
352       }, `equipmentStatus_${new Date().getTime()}.xlsx`)
353     }
354   }
355 };
356 </script>