懒羊羊
2024-03-09 38b15031cc02a746bef74993da828ec441b040d5
提交 | 用户 | 时间
38b150 1 <template>
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="planCode">
6             <el-input
7               v-model="queryParams.planCode"
8               placeholder="请输入计划编号"
9               clearable
10               @keyup.enter.native="handleQuery"
11             />
12           </el-form-item>
13           <el-form-item label="计划名称" prop="planName">
14             <el-input
15               v-model="queryParams.planName"
16               placeholder="请输入计划名称"
17               clearable
18               @keyup.enter.native="handleQuery"
19             />
20           </el-form-item>
21 <!--          <el-form-item label="计划类型" prop="planType">-->
22 <!--            <el-select v-model="queryParams.planType" placeholder="请选择计划类型" clearable>-->
23 <!--              <el-option-->
24 <!--                v-for="dict in dict.type.${dictType}"-->
25 <!--                :key="dict.value"-->
26 <!--                :label="dict.label"-->
27 <!--                :value="dict.value"-->
28 <!--              />-->
29 <!--            </el-select>-->
30 <!--          </el-form-item>-->
31           <el-form-item label="状态" prop="state">
32             <el-input
33               v-model="queryParams.state"
34               placeholder="请输入状态"
35               clearable
36               @keyup.enter.native="handleQuery"
37             />
38           </el-form-item>
39           <el-form-item label="频率" prop="frequency">
40             <el-input
41               v-model="queryParams.frequency"
42               placeholder="请输入频率"
43               clearable
44               @keyup.enter.native="handleQuery"
45             />
46           </el-form-item>
47           <el-form-item label="维度" prop="dimension">
48             <el-input
49               v-model="queryParams.dimension"
50               placeholder="请输入维度"
51               clearable
52               @keyup.enter.native="handleQuery"
53             />
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:inspectionPlan: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:inspectionPlan: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:inspectionPlan: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:inspectionPlan: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="inspectionPlanList" @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="planCode">
113           </el-table-column>
114           <el-table-column label="计划名称" align="center" prop="planName">
115           </el-table-column>
116           <el-table-column label="计划类型" align="center" prop="planType">
117           </el-table-column>
118           <el-table-column label="状态" align="center" prop="state">
119           </el-table-column>
120           <el-table-column label="频率" align="center" prop="frequency">
121           </el-table-column>
122           <el-table-column label="维度" align="center" prop="dimension">
123           </el-table-column>
124           <el-table-column label="上次生成时间" align="center" prop="lastGenerationTime">
125           </el-table-column>
126           <el-table-column label="开始时间" align="center" prop="startTime">
127           </el-table-column>
128           <el-table-column label="结束时间" align="center" prop="endTime">
129           </el-table-column>
130           <el-table-column label="备注" align="center" prop="remarks">
131           </el-table-column>
132           <el-table-column label="创建时间" align="center" prop="createTime">
133           </el-table-column>
134           <el-table-column label="创建人" align="center" prop="createUser">
135           </el-table-column>
136           <el-table-column label="修改时间" align="center" prop="updateTime">
137           </el-table-column>
138           <el-table-column label="修改人" align="center" prop="updateUser">
139           </el-table-column>
140           <el-table-column fixed="right" width="200" label="操作" align="center" class-name="small-padding fixed-width">
141             <template slot-scope="scope">
142               <el-button
143                 size="mini"
144                 type="success"
145                 plain
146                 style="width: 72px"
147                 icon="el-icon-edit"
148                 @click="handleUpdate(scope.row)"
149                 v-hasPermi="['em:inspectionPlan:edit']"
150               >修改</el-button>
151               <el-button
152                 size="mini"
153                 type="danger"
154                 plain
155                 style="width: 72px"
156                 icon="el-icon-delete"
157                 @click="handleDelete(scope.row)"
158                 v-hasPermi="['em:inspectionPlan:remove']"
159               >删除</el-button>
160             </template>
161           </el-table-column>
162         </el-table>
163     </el-card>
164
165     <pagination
166       v-show="total>0"
167       :total="total"
168       :page.sync="queryParams.pageNum"
169       :limit.sync="queryParams.pageSize"
170       @pagination="getList"
171     />
172
173     <!-- 添加或修改点检保养计划对话框 -->
174     <el-dialog v-dialogpop-up :title="title" :visible.sync="open" width="500px" append-to-body>
175       <span slot="title">
176         <i class="el-icon-s-order"></i>
177         {{titleName}}
178       </span>
179       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
180         <el-form-item label="计划编号" prop="planCode">
181           <el-input v-model="form.planCode" placeholder="请输入计划编号" />
182         </el-form-item>
183         <el-form-item label="计划名称" prop="planName">
184           <el-input v-model="form.planName" placeholder="请输入计划名称" />
185         </el-form-item>
186 <!--        <el-form-item label="计划类型" prop="planType">-->
187 <!--          <el-select v-model="form.planType" placeholder="请选择计划类型">-->
188 <!--            <el-option-->
189 <!--              v-for="dict in dict.type.${dictType}"-->
190 <!--              :key="dict.value"-->
191 <!--              :label="dict.label"-->
192 <!--              :value="dict.value"-->
193 <!--            ></el-option>-->
194 <!--          </el-select>-->
195 <!--        </el-form-item>-->
196         <el-form-item label="状态" prop="state">
197           <el-input v-model="form.state" placeholder="请输入状态" />
198         </el-form-item>
199         <el-form-item label="频率" prop="frequency">
200           <el-input v-model="form.frequency" placeholder="请输入频率" />
201         </el-form-item>
202         <el-form-item label="维度" prop="dimension">
203           <el-input v-model="form.dimension" placeholder="请输入维度" />
204         </el-form-item>
205         <el-form-item label="备注" prop="remarks">
206           <el-input v-model="form.remarks" placeholder="请输入备注" />
207         </el-form-item>
208       </el-form>
209       <div slot="footer" class="dialog-footer">
210         <el-button type="primary" @click="submitForm">确 定</el-button>
211         <el-button @click="cancel">取 消</el-button>
212       </div>
213     </el-dialog>
214   </div>
215 </template>
216
217 <script>
218 import { listInspectionPlan, getInspectionPlan, delInspectionPlan, addInspectionPlan, updateInspectionPlan } from "@/api/main/em/inspectionPlan/inspectionPlan";
219
220 export default {
221   name: "InspectionPlan",
222   data() {
223     return {
224       // 遮罩层
225       loading: true,
226       titleName: "",
227       // 选中数组
228       ids: [],
229       // 非单个禁用
230       single: true,
231       // 非多个禁用
232       multiple: true,
233       // 显示搜索条件
234       showSearch: true,
235       // 总条数
236       total: 0,
237       // 点检保养计划表格数据
238       inspectionPlanList: [],
239       // 弹出层标题
240       title: "",
241       // 是否显示弹出层
242       open: false,
243       // 查询参数
244       queryParams: {
245         pageNum: 1,
246         pageSize: 10,
247         planCode: null,
248         planName: null,
249         planType: null,
250         state: null,
251         frequency: null,
252         dimension: null,
253         startTime: null,
254         endTime: null,
255       },
256       // 表单参数
257       form: {},
258       // 表单校验
259       rules: {
260         id: [
261           { required: true, message: "ID不能为空", trigger: "blur" }
262         ],
263       }
264     };
265   },
266   created() {
267     this.getList();
268   },
269   methods: {
270     /** 查询点检保养计划列表 */
271     getList() {
272       this.loading = true;
273       listInspectionPlan(this.queryParams).then(response => {
274         this.inspectionPlanList = response.rows;
275         this.total = response.total;
276         this.loading = false;
277       });
278     },
279     // 取消按钮
280     cancel() {
281       this.open = false;
282       this.reset();
283     },
284     // 表单重置
285     reset() {
286       this.form = {
287         id: null,
288         planCode: null,
289         planName: null,
290         planType: null,
291         state: null,
292         frequency: null,
293         dimension: null,
294         lastGenerationTime: null,
295         startTime: null,
296         endTime: null,
297         devices: null,
298         inspectionItems: null,
299         remarks: null,
300         createTime: null,
301         createUser: null,
302         updateTime: null,
303         updateUser: null,
304         spareField1: null,
305         spareField2: null,
306         spareField3: null,
307         spareField4: null
308       };
309       this.resetForm("form");
310     },
311     /** 搜索按钮操作 */
312     handleQuery() {
313       this.queryParams.pageNum = 1;
314       this.getList();
315     },
316     /** 重置按钮操作 */
317     resetQuery() {
318       this.resetForm("queryForm");
319       this.handleQuery();
320     },
321     // 多选框选中数据
322     handleSelectionChange(selection) {
323       this.ids = selection.map(item => item.id)
324       this.single = selection.length!==1
325       this.multiple = !selection.length
326     },
327     /** 新增按钮操作 */
328     handleAdd() {
329       this.reset();
330       this.open = true;
331       this.titleName = "添加点检保养计划";
332     },
333     /** 修改按钮操作 */
334     handleUpdate(row) {
335       this.reset();
336       const id = row.id || this.ids
337       getInspectionPlan(id).then(response => {
338         this.form = response.data;
339         this.open = true;
340         this.titleName = "修改点检保养计划";
341       });
342     },
343     /** 提交按钮 */
344     submitForm() {
345       this.$refs["form"].validate(valid => {
346         if (valid) {
347           if (this.form.id != null) {
348             updateInspectionPlan(this.form).then(response => {
349               this.$modal.msgSuccess("修改成功");
350               this.open = false;
351               this.getList();
352             });
353           } else {
354             addInspectionPlan(this.form).then(response => {
355               this.$modal.msgSuccess("新增成功");
356               this.open = false;
357               this.getList();
358             });
359           }
360         }
361       });
362     },
363     /** 删除按钮操作 */
364     handleDelete(row) {
365       const ids = row.id || this.ids;
366       this.$modal.confirm('是否确认删除点检保养计划编号为"' + ids + '"的数据项?').then(function() {
367         return delInspectionPlan(ids);
368       }).then(() => {
369         this.getList();
370         this.$modal.msgSuccess("删除成功");
371       }).catch(() => {});
372     },
373     /** 导出按钮操作 */
374     handleExport() {
375       this.download('em/inspectionPlan/export', {
376         ...this.queryParams
377       }, `inspectionPlan_${new Date().getTime()}.xlsx`)
378     }
379   }
380 };
381 </script>