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