Merge remote-tracking branch 'origin/hqpt_vue' into hqpt_vue
正在显示
3 个修改的文件
包含
965 行增加
和
2 行删除
@@ -10,6 +10,8 @@ import PreManifest from './views/agent/PreManifest.vue' | @@ -10,6 +10,8 @@ import PreManifest from './views/agent/PreManifest.vue' | ||
10 | import Company from './views/nav1/company.vue' | 10 | import Company from './views/nav1/company.vue' |
11 | import Department from './views/nav1/department.vue' | 11 | import Department from './views/nav1/department.vue' |
12 | import Group from './views/nav1/groupcompany.vue' | 12 | import Group from './views/nav1/groupcompany.vue' |
13 | +import Process from './views/hqpt/Process.vue' | ||
14 | +import Job from './views/hqpt/Job.vue' | ||
13 | // import Form from './views/nav1/Form.vue' | 15 | // import Form from './views/nav1/Form.vue' |
14 | 16 | ||
15 | import User from './views/nav1/user.vue' | 17 | import User from './views/nav1/user.vue' |
@@ -64,6 +66,16 @@ let routes = [ | @@ -64,6 +66,16 @@ let routes = [ | ||
64 | ] | 66 | ] |
65 | }, | 67 | }, |
66 | { | 68 | { |
69 | + path: '/guestService', | ||
70 | + component: Home, | ||
71 | + name: '客服系统', | ||
72 | + iconCls: 'fa fa-id-card-o', | ||
73 | + children: [ | ||
74 | + { path: '/process', component: Process, name: '工单管理' }, | ||
75 | + { path: '/job', component: Job, name: '任务管理' } | ||
76 | + ] | ||
77 | + }, | ||
78 | + { | ||
67 | path: '/satff', | 79 | path: '/satff', |
68 | component: Home, | 80 | component: Home, |
69 | name: '生活保障部门', | 81 | name: '生活保障部门', |
@@ -72,8 +84,6 @@ let routes = [ | @@ -72,8 +84,6 @@ let routes = [ | ||
72 | { path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' }, | 84 | { path: '/security_inspection', component: SecrityInspection, name: '职工公寓安全巡视管理' }, |
73 | { path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' }, | 85 | { path: '/key', component: Key, name: '职工公寓备用钥匙使用登记管理' }, |
74 | { path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' }, | 86 | { path: '/maintain', component: Maintain, name: '职工公寓设施设备维修记录管理' }, |
75 | - { path: '/come_car', component: ComeCar, name: '职工公寓外来人员车辆登记管理' }, | ||
76 | - { path: '/on_duty', component: OnDuty, name: '职工公寓值班巡视记录管理' }, | ||
77 | ] | 87 | ] |
78 | }, | 88 | }, |
79 | { | 89 | { |
src/views/hqpt/Job.vue
0 → 100644
1 | +<template> | ||
2 | + <section> | ||
3 | + <el-dialog | ||
4 | + :data="dialogData" | ||
5 | + title="执行过程" | ||
6 | + :visible.sync="centerDialogVisible" | ||
7 | + width="30%" | ||
8 | + center> | ||
9 | + <span>{{dialogData.coment}}</span> | ||
10 | + <span slot="footer" class="dialog-footer"> | ||
11 | + <el-button @click="centerDialogVisible = false">取 消</el-button> | ||
12 | + <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button> | ||
13 | + </span> | ||
14 | + </el-dialog> | ||
15 | + <!--工具条--> | ||
16 | + <el-col :span="24" class="toolbar" style="padding-bottom: 0px;"> | ||
17 | + <el-form :inline="true" :model="filters"> | ||
18 | + <el-form-item> | ||
19 | + <el-input v-model="filters.processName" placeholder="工单名称"></el-input> | ||
20 | + </el-form-item> | ||
21 | + <el-form-item> | ||
22 | + <el-button type="primary" v-on:click="getProcessList()">查询</el-button> | ||
23 | + </el-form-item> | ||
24 | + <el-form-item> | ||
25 | + <el-button type="primary" @click="handleAdd()">新增</el-button> | ||
26 | + </el-form-item> | ||
27 | + </el-form> | ||
28 | + </el-col> | ||
29 | + | ||
30 | + <!--列表--> | ||
31 | + <el-table :data="processList" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;"> | ||
32 | + <el-table-column type="selection" width="55"> | ||
33 | + </el-table-column> | ||
34 | + <el-table-column type="index" width="60"> | ||
35 | + </el-table-column> | ||
36 | + <el-table-column prop="process.processname" label="工单名称" width="100"> | ||
37 | + </el-table-column> | ||
38 | + <el-table-column prop="user.realname" label="执行者" min-width="100" sortable> | ||
39 | + </el-table-column> | ||
40 | + <el-table-column prop="auditresuld" label="执行状态" min-width="80" :formatter="formatType" sortable> | ||
41 | + </el-table-column> | ||
42 | + <el-table-column label="操作" min-width="260"> | ||
43 | + <template slot-scope="scope"> | ||
44 | + <el-button size="small" @click="setPerm(scope.$index, scope.row)">开始执行</el-button> | ||
45 | + <el-button size="small" @click="setPerm(scope.$index, scope.row)">完成任务</el-button> | ||
46 | + <el-button size="small" @click="setPerm(scope.$index, scope.row)">任务转交</el-button> | ||
47 | + <el-button size="small" @click="shwoDialog(scope.$index, scope.row)">工单内容</el-button> | ||
48 | + <el-button size="small" @click="shwoDialog(scope.$index, scope.row)">任务内容</el-button> | ||
49 | + <el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button> | ||
50 | + </template> | ||
51 | + </el-table-column> | ||
52 | + </el-table> | ||
53 | + | ||
54 | + <!--工具条--> | ||
55 | + <el-col :span="24" class="toolbar"> | ||
56 | + <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button> | ||
57 | + <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="5" :total="total" style="float:right;"> | ||
58 | + </el-pagination> | ||
59 | + </el-col> | ||
60 | + | ||
61 | + <!--编辑界面--> | ||
62 | + <el-dialog title="编辑" :visible.sync="editFormVisible" :close-on-click-modal="false"> | ||
63 | + <el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm"> | ||
64 | + <el-form-item label="ID"> | ||
65 | + <span>{{editForm.roleId}}</span> | ||
66 | + </el-form-item> | ||
67 | + <el-form-item label="岗位名称"> | ||
68 | + <el-input v-model="editForm.roleName" auto-complete="off" placeholder="请输入岗位/角色名称:例如:ROLE_name"></el-input> | ||
69 | + </el-form-item> | ||
70 | + <el-form-item label="岗位描述"> | ||
71 | + <el-input v-model="editForm.description" auto-complete="off" placeholder="请输入岗位/角色描述:例如:用户管理员"></el-input> | ||
72 | + </el-form-item> | ||
73 | + <el-form-item label="部门名称"> | ||
74 | + <el-select v-model="editForm.departmentId" placeholder="请选择"> | ||
75 | + <el-option | ||
76 | + v-for="item in departmentNameList" | ||
77 | + :key="item.departmentId" | ||
78 | + :label="item.departmentName" | ||
79 | + :value="item.departmentId"> | ||
80 | + </el-option> | ||
81 | + </el-select> | ||
82 | + </el-form-item> | ||
83 | + </el-form> | ||
84 | + <div slot="footer" class="dialog-footer"> | ||
85 | + <el-button @click.native="editFormVisible = false">取消</el-button> | ||
86 | + <el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button> | ||
87 | + </div> | ||
88 | + </el-dialog> | ||
89 | + | ||
90 | + <!--新增界面--> | ||
91 | + <el-dialog title="新增" :visible.sync="addFormVisible" width="60%"> | ||
92 | + <el-form :model="addForm" label-width="80px" :rules="addFormRules" ref="addForm"> | ||
93 | + <el-form-item label="工单名称" prop="processname"> | ||
94 | + <el-input v-model="addForm.processname" auto-complete="off" placeholder="请输入工单标题:"></el-input> | ||
95 | + </el-form-item> | ||
96 | + <el-form-item label="开始日期" prop="begindate"> | ||
97 | + <el-date-picker :picker-options="pickerOptions" value-format="yyyy-MM-dd" placeholder="选择时间" v-model="addForm.begindate" style="width: 100%;"></el-date-picker> | ||
98 | + </el-form-item> | ||
99 | + <el-form-item label="结束日期" prop="enddate"> | ||
100 | + <el-date-picker :picker-options="pickerOptions" value-format="yyyy-MM-dd" placeholder="选择时间" v-model="addForm.enddate" style="width: 100%;"></el-date-picker> | ||
101 | + </el-form-item> | ||
102 | + <el-form-item label="工单类型" prop="vacationtype"> | ||
103 | + <el-select v-model="addForm.vacationtype" placeholder="请选择"> | ||
104 | + <el-option label="运维检查" value="0"></el-option> | ||
105 | + <el-option label="设备故障" value="1"></el-option> | ||
106 | + <el-option label="电话报修" value="3"></el-option> | ||
107 | + </el-select> | ||
108 | + </el-form-item> | ||
109 | + <el-form-item label="工单内容" prop="reason"> | ||
110 | + <el-input type="textarea" v-model="addForm.reason"></el-input> | ||
111 | + </el-form-item> | ||
112 | + <el-form-item> | ||
113 | + <el-cascader-panel | ||
114 | + :options="options" | ||
115 | + v-model="jodUserId" | ||
116 | + @change="cascaderhandleChange" | ||
117 | + ></el-cascader-panel> | ||
118 | + </el-form-item> | ||
119 | + </el-form> | ||
120 | + <div slot="footer" class="dialog-footer"> | ||
121 | + <el-button @click.native="addFormVisible = false">取消</el-button> | ||
122 | + <el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button> | ||
123 | + </div> | ||
124 | + </el-dialog> | ||
125 | + </section> | ||
126 | +</template> | ||
127 | + | ||
128 | +<script> | ||
129 | + import util from '../../common/js/util' | ||
130 | + import NProgress from 'nprogress' | ||
131 | + import { getList,add} from '@/api/job_api'; | ||
132 | + import moment from 'moment' | ||
133 | + import parseTime from '@/utils' | ||
134 | + import loginUserInfo from '@/api/base' | ||
135 | + import ElFormItem from "../../../node_modules/element-ui/packages/form/src/form-item.vue"; | ||
136 | + export default { | ||
137 | + components: {ElFormItem}, | ||
138 | + data() { | ||
139 | + return { | ||
140 | + filters: { | ||
141 | + processName: '', | ||
142 | + parseTime: parseTime | ||
143 | + }, | ||
144 | + departmentNameList:[], | ||
145 | + processList: [], | ||
146 | + permissons: [], | ||
147 | + permIds: [], | ||
148 | + total: 0, | ||
149 | + pageNum: 1, | ||
150 | + pageSize: 5, | ||
151 | + listLoading: false, | ||
152 | + sels: [],//列表选中列 | ||
153 | + //编辑界面是否显示 | ||
154 | + editFormVisible: false, | ||
155 | + editLoading: false, | ||
156 | + editFormRules: { | ||
157 | + roleName: [ | ||
158 | + { required: true, message: '请输入岗位/角色名称', trigger: 'blur' } | ||
159 | + ] | ||
160 | + }, | ||
161 | + //编辑界面数据 | ||
162 | + editForm: { | ||
163 | + roleId: 1, | ||
164 | + description: '', | ||
165 | + roleName: '', | ||
166 | + roleSign: 1, | ||
167 | + departmentId:'' | ||
168 | + }, | ||
169 | + //用户ID | ||
170 | + | ||
171 | + //执行任务人ID | ||
172 | + jodUserId: 0, | ||
173 | + //新增界面是否显示 | ||
174 | + addFormVisible: false, | ||
175 | + //设置权限界面是否显示 | ||
176 | + PermFormVisible: false, | ||
177 | + addLoading: false, | ||
178 | + addFormRules: { | ||
179 | + roleName: [ | ||
180 | + { required: true, message: '请输入岗位/角色名称', trigger: 'blur' } | ||
181 | + ], | ||
182 | + description: [ | ||
183 | + { required: true, message: '请输入岗位/角色描述', trigger: 'blur' } | ||
184 | + ] | ||
185 | + }, | ||
186 | + //新增界面数据 | ||
187 | + addForm: { | ||
188 | + processname: '', | ||
189 | + begindate: '', | ||
190 | + enddate: '', | ||
191 | + vacationtype:'', | ||
192 | + reason: '', | ||
193 | + userId: '' | ||
194 | + }, | ||
195 | + permForm: { | ||
196 | + roleId: 1, | ||
197 | + description: '', | ||
198 | + roleName: '', | ||
199 | + roleSign: 1, | ||
200 | + permissions: [] | ||
201 | + }, | ||
202 | + centerDialogVisible: false, | ||
203 | + dialogData:{}, | ||
204 | + pickerOptions: { | ||
205 | + disabledDate(time) { | ||
206 | + return time.getTime() < Date.now(); | ||
207 | + }, | ||
208 | + shortcuts: [{ | ||
209 | + text: '今天', | ||
210 | + onClick(picker) { | ||
211 | + picker.$emit('pick', new Date()); | ||
212 | + } | ||
213 | + }, { | ||
214 | + text: '昨天', | ||
215 | + onClick(picker) { | ||
216 | + const date = new Date(); | ||
217 | + date.setTime(date.getTime() - 3600 * 1000 * 24); | ||
218 | + picker.$emit('pick', date); | ||
219 | + } | ||
220 | + }, { | ||
221 | + text: '一周前', | ||
222 | + onClick(picker) { | ||
223 | + const date = new Date(); | ||
224 | + date.setTime(date.getTime() - 3600 * 1000 * 24 * 7); | ||
225 | + picker.$emit('pick', date); | ||
226 | + } | ||
227 | + }] | ||
228 | + }, | ||
229 | + options:[{ | ||
230 | + value: '1', | ||
231 | + label: '测试公司', | ||
232 | + children: [{ | ||
233 | + value: '2', | ||
234 | + label: '测试部门一', | ||
235 | + children: [{ | ||
236 | + value: '1', | ||
237 | + label: '测试岗位1', | ||
238 | + children: [{ | ||
239 | + value: '1', | ||
240 | + label: '测试人员1' | ||
241 | + }] | ||
242 | + }] | ||
243 | + }, { | ||
244 | + value: '3', | ||
245 | + label: '测试部门二', | ||
246 | + children: [{ | ||
247 | + value: '2', | ||
248 | + label: '测试岗位2', | ||
249 | + children: [{ | ||
250 | + value: '1', | ||
251 | + label: '测试人员2' | ||
252 | + }] | ||
253 | + }, { | ||
254 | + value: '3', | ||
255 | + label: '测试岗位3', | ||
256 | + children: [{ | ||
257 | + value: '1', | ||
258 | + label: '测试人员3' | ||
259 | + }] | ||
260 | + }] | ||
261 | + }] | ||
262 | + }], | ||
263 | + } | ||
264 | + }, | ||
265 | + methods: { | ||
266 | + //性别显示转换 | ||
267 | + formatType: function (row, column) { | ||
268 | + let msg = '未知'; | ||
269 | + switch (row.auditresuld){ | ||
270 | + case 0: | ||
271 | + msg='未执行'; | ||
272 | + break; | ||
273 | + case 1: | ||
274 | + msg='执行中'; | ||
275 | + break; | ||
276 | + case 2: | ||
277 | + msg='执行完毕'; | ||
278 | + break; | ||
279 | + case 3: | ||
280 | + msg='任务转交'; | ||
281 | + break; | ||
282 | + } | ||
283 | + return msg; | ||
284 | + }, | ||
285 | + formatState: function (row, column) { | ||
286 | + let msg = '未知'; | ||
287 | + switch (row.processstatus){ | ||
288 | + case 0: | ||
289 | + msg='未分配'; | ||
290 | + break; | ||
291 | + case 1: | ||
292 | + msg='已分配'; | ||
293 | + break; | ||
294 | + case 2: | ||
295 | + msg='执行中'; | ||
296 | + break; | ||
297 | + case 3: | ||
298 | + msg='已完成'; | ||
299 | + break; | ||
300 | + } | ||
301 | + return msg; | ||
302 | + }, | ||
303 | + handleCurrentChange(val) { | ||
304 | + this.pageNum = val; | ||
305 | + }, | ||
306 | + //获取工单列表 | ||
307 | + getProcessList() { | ||
308 | + let para = { | ||
309 | + pageNum: this.pageNum, | ||
310 | + pageSize: this.pageSize, | ||
311 | + roleName: this.filters.processName | ||
312 | + }; | ||
313 | + this.listLoading = true; | ||
314 | + //NProgress.start(); | ||
315 | + getList(para).then((res) => { | ||
316 | + let resData = res.data.data; | ||
317 | + this.total = resData.total; | ||
318 | + this.processList = resData.list; | ||
319 | + this.listLoading = false; | ||
320 | + //NProgress.done(); | ||
321 | + }).catch((error) => { | ||
322 | + this.listLoading = false; | ||
323 | + if(null!= error.response && error.response!==undefined){ | ||
324 | + let status= error.response.status; | ||
325 | + let msg = error.response.statusText; | ||
326 | + alert(status+msg); | ||
327 | + }else { | ||
328 | + alert(error); | ||
329 | + } | ||
330 | + | ||
331 | + }); | ||
332 | + | ||
333 | + }, | ||
334 | + //删除 | ||
335 | + handleDel: function (index, row) { | ||
336 | + this.$confirm('确认删除该记录吗?', '提示', { | ||
337 | + type: 'warning' | ||
338 | + }).then(() => { | ||
339 | + this.listLoading = true; | ||
340 | + //NProgress.start(); | ||
341 | + let para = { roleId: row.roleId }; | ||
342 | + remove(para).then((res) => { | ||
343 | + this.listLoading = false; | ||
344 | + //NProgress.done(); | ||
345 | + this.$message({ | ||
346 | + message: '删除成功', | ||
347 | + type: 'success' | ||
348 | + }); | ||
349 | + }).catch((error) => { | ||
350 | + this.listLoading = false; | ||
351 | + alert(error); | ||
352 | + }); | ||
353 | + }).catch(); | ||
354 | + }, | ||
355 | + /** | ||
356 | + * 显示编辑界面 | ||
357 | + * @param index | ||
358 | + * @param row 为这行的数据对象 | ||
359 | + */ | ||
360 | + handleEdit: function (index, row) { | ||
361 | + this.editFormVisible = true; | ||
362 | + this.editForm = Object.assign({}, row); | ||
363 | + this.getdepartmentNames(); | ||
364 | + }, | ||
365 | + //显示新增界面,每次点开初始化数据 | ||
366 | + handleAdd: function () { | ||
367 | + this.addFormVisible = true; | ||
368 | + this.addForm = { | ||
369 | + processname: '', | ||
370 | + begindate: '', | ||
371 | + enddate: '', | ||
372 | + vacationtype:'', | ||
373 | + reason: '', | ||
374 | + userid: loginUserInfo.userId | ||
375 | + } | ||
376 | + }, | ||
377 | + //编辑 | ||
378 | + editSubmit: function () { | ||
379 | + this.$refs.editForm.validate((valid) => { | ||
380 | + if (valid) { | ||
381 | + this.$confirm('确认提交吗?', '提示', {}).then(() => { | ||
382 | + this.editLoading = true; | ||
383 | + //NProgress.start(); | ||
384 | + let para = Object.assign({}, this.editForm); | ||
385 | + //不需要提交的 去掉,后端不好接收 | ||
386 | + para.authorities = null; | ||
387 | + para.permissions = null; | ||
388 | + para.roles = null; | ||
389 | +// para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd'); | ||
390 | + /* | ||
391 | + 查询之后格式this.filters.column.create_start_date中日期发生变化; | ||
392 | + Wed Aug 09 2017 00:00:00 GMT+0800 (中国标准时间) 变成了 "2017-08-08T16:00:00.000Z"; | ||
393 | + 所以使用 moment 日期格式化插件将时间转换成 [ Wed Aug 09 2017 00:00:00 GMT+0800 (中国标准时间) ] 格 | ||
394 | + 式; | ||
395 | + */ | ||
396 | + /*moment 安装 npm install moment --save*/ | ||
397 | + para.creattime = moment(para.creattime).format('YYYY-MM-DD HH:mm:ss'); | ||
398 | + this.editLoading = false; | ||
399 | + edit(para).then((res) => { | ||
400 | + | ||
401 | + //NProgress.done(); | ||
402 | + this.$message({ | ||
403 | + message: '提交成功', | ||
404 | + type: 'success' | ||
405 | + }); | ||
406 | + this.$refs['editForm'].resetFields(); | ||
407 | + this.editFormVisible = false; | ||
408 | + }).catch(error => alert(error)); | ||
409 | + }); | ||
410 | + } | ||
411 | + }); | ||
412 | + }, | ||
413 | + //新增 | ||
414 | + addSubmit: function () { | ||
415 | + this.$refs.addForm.validate((valid) => { | ||
416 | + if (valid) { | ||
417 | + this.$confirm('确认提交吗?', '提示', {}).then(() => { | ||
418 | + this.addLoading = true; | ||
419 | + //NProgress.start(); | ||
420 | + let para = Object.assign({}, this.addForm); | ||
421 | + add(para).then((res) => { | ||
422 | + this.addLoading = false; | ||
423 | + if (res.status ===200) { | ||
424 | + this.$message({ | ||
425 | + message: '提交成功', | ||
426 | + type: 'success' | ||
427 | + }); | ||
428 | + this.$refs['permForm'].resetFields(); | ||
429 | + this.addFormVisible = false; | ||
430 | + this.getProcessList(); | ||
431 | + } | ||
432 | + }).catch(error => alert(error)); | ||
433 | + }); | ||
434 | + } | ||
435 | + }); | ||
436 | + }, | ||
437 | + selsChange: function (sels) { | ||
438 | + this.sels = sels; | ||
439 | + }, | ||
440 | + //批量删除 | ||
441 | + batchRemove: function () { | ||
442 | + var ids = this.sels.map(item => item.roleId).toString(); | ||
443 | + this.$confirm('确认删除选中记录吗?', '提示', { | ||
444 | + type: 'warning' | ||
445 | + }).then(() => { | ||
446 | + this.listLoading = true; | ||
447 | + //NProgress.start(); | ||
448 | + let para = { ids: ids }; | ||
449 | + batchRemove(para).then((res) => { | ||
450 | + this.listLoading = false; | ||
451 | + //NProgress.done(); | ||
452 | + this.$message({ | ||
453 | + message: '删除成功', | ||
454 | + type: 'success' | ||
455 | + }) | ||
456 | + }); | ||
457 | + }).catch(() => { | ||
458 | + | ||
459 | + }); | ||
460 | + }, | ||
461 | + shwoDialog(index,row) { | ||
462 | + this.dialogData = Object.assign({}, row); | ||
463 | + this.centerDialogVisible = true; | ||
464 | + }, | ||
465 | + cascaderhandleChange:function (value) { | ||
466 | + let defaultvalue = ["0","0","0","0"]; | ||
467 | + defaultvalue = value; | ||
468 | + console.log(defaultvalue); | ||
469 | + this.jodUserId = defaultvalue[3]; | ||
470 | + } | ||
471 | + }, | ||
472 | + mounted() { | ||
473 | + this.getProcessList(); | ||
474 | + } | ||
475 | + } | ||
476 | + | ||
477 | +</script> | ||
478 | + | ||
479 | +<style scoped> | ||
480 | + | ||
481 | +</style> |
src/views/hqpt/Process.vue
0 → 100644
1 | +<template> | ||
2 | + <section> | ||
3 | + <el-dialog | ||
4 | + :data="dialogData" | ||
5 | + title="提示" | ||
6 | + :visible.sync="centerDialogVisible" | ||
7 | + width="30%" | ||
8 | + center> | ||
9 | + <span>{{dialogData.reason}}</span> | ||
10 | + <span slot="footer" class="dialog-footer"> | ||
11 | + <el-button @click="centerDialogVisible = false">取 消</el-button> | ||
12 | + <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button> | ||
13 | + </span> | ||
14 | + </el-dialog> | ||
15 | + <!--工具条--> | ||
16 | + <el-col :span="24" class="toolbar" style="padding-bottom: 0px;"> | ||
17 | + <el-form :inline="true" :model="filters"> | ||
18 | + <el-form-item> | ||
19 | + <el-input v-model="filters.processName" placeholder="工单名称"></el-input> | ||
20 | + </el-form-item> | ||
21 | + <el-form-item> | ||
22 | + <el-button type="primary" v-on:click="getProcessList()">查询</el-button> | ||
23 | + </el-form-item> | ||
24 | + <el-form-item> | ||
25 | + <el-button type="primary" @click="handleAdd()">新增</el-button> | ||
26 | + </el-form-item> | ||
27 | + </el-form> | ||
28 | + </el-col> | ||
29 | + | ||
30 | + <!--列表--> | ||
31 | + <el-table :data="processList" highlight-current-row v-loading="listLoading" @selection-change="selsChange" style="width: 100%;"> | ||
32 | + <el-table-column type="selection" width="55"> | ||
33 | + </el-table-column> | ||
34 | + <el-table-column type="index" width="60"> | ||
35 | + </el-table-column> | ||
36 | + <el-table-column prop="processname" label="工单名称" width="100"> | ||
37 | + </el-table-column> | ||
38 | + <el-table-column prop="user.realname" label="添加者" min-width="100" sortable> | ||
39 | + </el-table-column> | ||
40 | + <el-table-column label="开始日期" width="200px" align="center" sortable> | ||
41 | + <template slot-scope="scope"> | ||
42 | + <span>{{ scope.row.begindate}}</span> | ||
43 | + </template> | ||
44 | + </el-table-column> | ||
45 | + <el-table-column label="结束日期" width="200px" align="center" sortable> | ||
46 | + <template slot-scope="scope"> | ||
47 | + <span>{{ scope.row.enddate}}</span> | ||
48 | + </template> | ||
49 | + </el-table-column> | ||
50 | + <el-table-column prop="vacationtype" label="工单类型" min-width="80" :formatter="formatType" sortable> | ||
51 | + </el-table-column> | ||
52 | + <el-table-column prop="processstatus" label="工单状态" min-width="80" :formatter="formatState" sortable> | ||
53 | + </el-table-column> | ||
54 | + <el-table-column label="操作" min-width="260"> | ||
55 | + <template slot-scope="scope"> | ||
56 | + <!--<el-button size="small" @click="setPerm(scope.$index, scope.row)">分配工单</el-button>--> | ||
57 | + <el-button size="small" @click="shwoDialog(scope.$index, scope.row)">查看内容</el-button> | ||
58 | + <el-button size="small" @click="handleEdit(scope.$index, scope.row)">编辑</el-button> | ||
59 | + <el-button type="danger" size="small" @click="handleDel(scope.$index, scope.row)">删除</el-button> | ||
60 | + </template> | ||
61 | + </el-table-column> | ||
62 | + </el-table> | ||
63 | + | ||
64 | + <!--工具条--> | ||
65 | + <el-col :span="24" class="toolbar"> | ||
66 | + <el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button> | ||
67 | + <el-pagination layout="prev, pager, next" @current-change="handleCurrentChange" :page-size="5" :total="total" style="float:right;"> | ||
68 | + </el-pagination> | ||
69 | + </el-col> | ||
70 | + | ||
71 | + <!--编辑界面--> | ||
72 | + <el-dialog title="编辑" :visible.sync="editFormVisible" :close-on-click-modal="false"> | ||
73 | + <el-form :model="editForm" label-width="80px" :rules="editFormRules" ref="editForm"> | ||
74 | + <el-form-item label="ID"> | ||
75 | + <span>{{editForm.roleId}}</span> | ||
76 | + </el-form-item> | ||
77 | + <el-form-item label="岗位名称"> | ||
78 | + <el-input v-model="editForm.roleName" auto-complete="off" placeholder="请输入岗位/角色名称:例如:ROLE_name"></el-input> | ||
79 | + </el-form-item> | ||
80 | + <el-form-item label="岗位描述"> | ||
81 | + <el-input v-model="editForm.description" auto-complete="off" placeholder="请输入岗位/角色描述:例如:用户管理员"></el-input> | ||
82 | + </el-form-item> | ||
83 | + <el-form-item label="部门名称"> | ||
84 | + <el-select v-model="editForm.departmentId" placeholder="请选择"> | ||
85 | + <el-option | ||
86 | + v-for="item in departmentNameList" | ||
87 | + :key="item.departmentId" | ||
88 | + :label="item.departmentName" | ||
89 | + :value="item.departmentId"> | ||
90 | + </el-option> | ||
91 | + </el-select> | ||
92 | + </el-form-item> | ||
93 | + </el-form> | ||
94 | + <div slot="footer" class="dialog-footer"> | ||
95 | + <el-button @click.native="editFormVisible = false">取消</el-button> | ||
96 | + <el-button type="primary" @click.native="editSubmit" :loading="editLoading">提交</el-button> | ||
97 | + </div> | ||
98 | + </el-dialog> | ||
99 | + | ||
100 | + <!--新增界面--> | ||
101 | + <el-dialog title="新增" :visible.sync="addFormVisible" width="60%"> | ||
102 | + <el-form :model="addForm" label-width="80px" :rules="addFormRules" ref="addForm"> | ||
103 | + <el-form-item label="工单名称" prop="processname"> | ||
104 | + <el-input v-model="addForm.processname" auto-complete="off" placeholder="请输入工单标题:"></el-input> | ||
105 | + </el-form-item> | ||
106 | + <el-form-item label="开始日期" prop="begindate"> | ||
107 | + <el-date-picker :picker-options="pickerOptions" value-format="yyyy-MM-dd" placeholder="选择时间" v-model="addForm.begindate" style="width: 100%;"></el-date-picker> | ||
108 | + </el-form-item> | ||
109 | + <el-form-item label="结束日期" prop="enddate"> | ||
110 | + <el-date-picker :picker-options="pickerOptions" value-format="yyyy-MM-dd" placeholder="选择时间" v-model="addForm.enddate" style="width: 100%;"></el-date-picker> | ||
111 | + </el-form-item> | ||
112 | + <el-form-item label="工单类型" prop="vacationtype"> | ||
113 | + <el-select v-model="addForm.vacationtype" placeholder="请选择"> | ||
114 | + <el-option label="运维检查" value="0"></el-option> | ||
115 | + <el-option label="设备故障" value="1"></el-option> | ||
116 | + <el-option label="电话报修" value="3"></el-option> | ||
117 | + </el-select> | ||
118 | + </el-form-item> | ||
119 | + <el-form-item label="工单内容" prop="reason"> | ||
120 | + <el-input type="textarea" v-model="addForm.reason"></el-input> | ||
121 | + </el-form-item> | ||
122 | + <el-form-item> | ||
123 | + <el-cascader-panel | ||
124 | + :options="options" | ||
125 | + v-model="addForm.jobuserid" | ||
126 | + @change="cascaderhandleChange" | ||
127 | + ></el-cascader-panel> | ||
128 | + </el-form-item> | ||
129 | + </el-form> | ||
130 | + <div slot="footer" class="dialog-footer"> | ||
131 | + <el-button @click.native="addFormVisible = false">取消</el-button> | ||
132 | + <el-button type="primary" @click.native="addSubmit" :loading="addLoading">提交</el-button> | ||
133 | + </div> | ||
134 | + </el-dialog> | ||
135 | + </section> | ||
136 | +</template> | ||
137 | + | ||
138 | +<script> | ||
139 | + import util from '../../common/js/util' | ||
140 | + import NProgress from 'nprogress' | ||
141 | + import { getList,add} from '@/api/process_api'; | ||
142 | + import moment from 'moment' | ||
143 | + import parseTime from '@/utils' | ||
144 | + import loginUserInfo from '@/api/base' | ||
145 | + import ElFormItem from "../../../node_modules/element-ui/packages/form/src/form-item.vue"; | ||
146 | + export default { | ||
147 | + components: {ElFormItem}, | ||
148 | + data() { | ||
149 | + return { | ||
150 | + filters: { | ||
151 | + processName: '', | ||
152 | + parseTime: parseTime | ||
153 | + }, | ||
154 | + departmentNameList:[], | ||
155 | + processList: [], | ||
156 | + permissons: [], | ||
157 | + permIds: [], | ||
158 | + total: 0, | ||
159 | + pageNum: 1, | ||
160 | + pageSize: 5, | ||
161 | + listLoading: false, | ||
162 | + sels: [],//列表选中列 | ||
163 | + //编辑界面是否显示 | ||
164 | + editFormVisible: false, | ||
165 | + editLoading: false, | ||
166 | + editFormRules: { | ||
167 | + roleName: [ | ||
168 | + { required: true, message: '请输入岗位/角色名称', trigger: 'blur' } | ||
169 | + ] | ||
170 | + }, | ||
171 | + //编辑界面数据 | ||
172 | + editForm: { | ||
173 | + roleId: 1, | ||
174 | + description: '', | ||
175 | + roleName: '', | ||
176 | + roleSign: 1, | ||
177 | + departmentId:'' | ||
178 | + }, | ||
179 | + //新增界面是否显示 | ||
180 | + addFormVisible: false, | ||
181 | + //设置权限界面是否显示 | ||
182 | + PermFormVisible: false, | ||
183 | + addLoading: false, | ||
184 | + addFormRules: { | ||
185 | + roleName: [ | ||
186 | + { required: true, message: '请输入岗位/角色名称', trigger: 'blur' } | ||
187 | + ], | ||
188 | + description: [ | ||
189 | + { required: true, message: '请输入岗位/角色描述', trigger: 'blur' } | ||
190 | + ] | ||
191 | + }, | ||
192 | + //新增界面数据 | ||
193 | + addForm: { | ||
194 | + processname: '', | ||
195 | + begindate: '', | ||
196 | + enddate: '', | ||
197 | + vacationtype:'', | ||
198 | + reason: '', | ||
199 | + userId: '', | ||
200 | + jobuserid: 0 | ||
201 | + }, | ||
202 | + jobForm: { | ||
203 | + taskid: 1, | ||
204 | + userid: 1, | ||
205 | + auditresuld: '' | ||
206 | + }, | ||
207 | + centerDialogVisible: false, | ||
208 | + dialogData:{}, | ||
209 | + options:[{ | ||
210 | + value: '1', | ||
211 | + label: '测试公司', | ||
212 | + children: [{ | ||
213 | + value: '2', | ||
214 | + label: '测试部门一', | ||
215 | + children: [{ | ||
216 | + value: '1', | ||
217 | + label: '测试岗位1', | ||
218 | + children: [{ | ||
219 | + value: '1', | ||
220 | + label: '测试人员1' | ||
221 | + }] | ||
222 | + }] | ||
223 | + }, { | ||
224 | + value: '3', | ||
225 | + label: '测试部门二', | ||
226 | + children: [{ | ||
227 | + value: '2', | ||
228 | + label: '测试岗位2', | ||
229 | + children: [{ | ||
230 | + value: '1', | ||
231 | + label: '测试人员2' | ||
232 | + }] | ||
233 | + }, { | ||
234 | + value: '3', | ||
235 | + label: '测试岗位3', | ||
236 | + children: [{ | ||
237 | + value: '1', | ||
238 | + label: '测试人员3' | ||
239 | + }] | ||
240 | + }] | ||
241 | + }] | ||
242 | + }], | ||
243 | + pickerOptions: { | ||
244 | + disabledDate(time) { | ||
245 | + return time.getTime() < Date.now(); | ||
246 | + }, | ||
247 | + shortcuts: [{ | ||
248 | + text: '今天', | ||
249 | + onClick(picker) { | ||
250 | + picker.$emit('pick', new Date()); | ||
251 | + } | ||
252 | + }, { | ||
253 | + text: '昨天', | ||
254 | + onClick(picker) { | ||
255 | + const date = new Date(); | ||
256 | + date.setTime(date.getTime() - 3600 * 1000 * 24); | ||
257 | + picker.$emit('pick', date); | ||
258 | + } | ||
259 | + }, { | ||
260 | + text: '一周前', | ||
261 | + onClick(picker) { | ||
262 | + const date = new Date(); | ||
263 | + date.setTime(date.getTime() - 3600 * 1000 * 24 * 7); | ||
264 | + picker.$emit('pick', date); | ||
265 | + } | ||
266 | + }] | ||
267 | + } | ||
268 | + } | ||
269 | + }, | ||
270 | + methods: { | ||
271 | + //性别显示转换 | ||
272 | + formatType: function (row, column) { | ||
273 | + return row.vacationtype == 1 ? '运维检查' : row.vacationtype == 0 ? '设备故障' : '电话报修'; | ||
274 | + }, | ||
275 | + formatState: function (row, column) { | ||
276 | + let msg = '未知'; | ||
277 | + switch (row.processstatus){ | ||
278 | + case 0: | ||
279 | + msg='未分配'; | ||
280 | + break; | ||
281 | + case 1: | ||
282 | + msg='已分配'; | ||
283 | + break; | ||
284 | + case 2: | ||
285 | + msg='执行中'; | ||
286 | + break; | ||
287 | + case 3: | ||
288 | + msg='已完成'; | ||
289 | + break; | ||
290 | + } | ||
291 | + return msg; | ||
292 | + }, | ||
293 | + handleCurrentChange(val) { | ||
294 | + this.pageNum = val; | ||
295 | + }, | ||
296 | + //获取工单列表 | ||
297 | + getProcessList() { | ||
298 | + let para = { | ||
299 | + pageNum: this.pageNum, | ||
300 | + pageSize: this.pageSize, | ||
301 | + roleName: this.filters.processName | ||
302 | + }; | ||
303 | + this.listLoading = true; | ||
304 | + //NProgress.start(); | ||
305 | + getList(para).then((res) => { | ||
306 | + let resData = res.data.data; | ||
307 | + this.total = resData.total; | ||
308 | + this.processList = resData.list; | ||
309 | + this.listLoading = false; | ||
310 | + //NProgress.done(); | ||
311 | + }).catch((error) => { | ||
312 | + this.listLoading = false; | ||
313 | + if(null!= error.response && error.response!==undefined){ | ||
314 | + let status= error.response.status; | ||
315 | + let msg = error.response.statusText; | ||
316 | + alert(status+msg); | ||
317 | + }else { | ||
318 | + alert(error); | ||
319 | + } | ||
320 | + | ||
321 | + }); | ||
322 | + | ||
323 | + }, | ||
324 | + //删除 | ||
325 | + handleDel: function (index, row) { | ||
326 | + this.$confirm('确认删除该记录吗?', '提示', { | ||
327 | + type: 'warning' | ||
328 | + }).then(() => { | ||
329 | + this.listLoading = true; | ||
330 | + //NProgress.start(); | ||
331 | + let para = { roleId: row.roleId }; | ||
332 | + remove(para).then((res) => { | ||
333 | + this.listLoading = false; | ||
334 | + //NProgress.done(); | ||
335 | + this.$message({ | ||
336 | + message: '删除成功', | ||
337 | + type: 'success' | ||
338 | + }); | ||
339 | + }).catch((error) => { | ||
340 | + this.listLoading = false; | ||
341 | + alert(error); | ||
342 | + }); | ||
343 | + }).catch(); | ||
344 | + }, | ||
345 | + /** | ||
346 | + * 显示编辑界面 | ||
347 | + * @param index | ||
348 | + * @param row 为这行的数据对象 | ||
349 | + */ | ||
350 | + handleEdit: function (index, row) { | ||
351 | + this.editFormVisible = true; | ||
352 | + this.editForm = Object.assign({}, row); | ||
353 | + this.getdepartmentNames(); | ||
354 | + }, | ||
355 | + //显示新增界面,每次点开初始化数据 | ||
356 | + handleAdd: function () { | ||
357 | + this.addFormVisible = true; | ||
358 | + this.addForm = { | ||
359 | + processname: '', | ||
360 | + begindate: '', | ||
361 | + enddate: '', | ||
362 | + vacationtype:'', | ||
363 | + reason: '', | ||
364 | + userid: loginUserInfo.userId, | ||
365 | + jobuserid: 0 | ||
366 | + } | ||
367 | + }, | ||
368 | + //编辑 | ||
369 | + editSubmit: function () { | ||
370 | + this.$refs.editForm.validate((valid) => { | ||
371 | + if (valid) { | ||
372 | + this.$confirm('确认提交吗?', '提示', {}).then(() => { | ||
373 | + this.editLoading = true; | ||
374 | + //NProgress.start(); | ||
375 | + let para = Object.assign({}, this.editForm); | ||
376 | + //不需要提交的 去掉,后端不好接收 | ||
377 | + para.authorities = null; | ||
378 | + para.permissions = null; | ||
379 | + para.roles = null; | ||
380 | +// para.birth = (!para.birth || para.birth == '') ? '' : util.formatDate.format(new Date(para.birth), 'yyyy-MM-dd'); | ||
381 | + /* | ||
382 | + 查询之后格式this.filters.column.create_start_date中日期发生变化; | ||
383 | + Wed Aug 09 2017 00:00:00 GMT+0800 (中国标准时间) 变成了 "2017-08-08T16:00:00.000Z"; | ||
384 | + 所以使用 moment 日期格式化插件将时间转换成 [ Wed Aug 09 2017 00:00:00 GMT+0800 (中国标准时间) ] 格 | ||
385 | + 式; | ||
386 | + */ | ||
387 | + /*moment 安装 npm install moment --save*/ | ||
388 | + para.creattime = moment(para.creattime).format('YYYY-MM-DD HH:mm:ss'); | ||
389 | + this.editLoading = false; | ||
390 | + edit(para).then((res) => { | ||
391 | + | ||
392 | + //NProgress.done(); | ||
393 | + this.$message({ | ||
394 | + message: '提交成功', | ||
395 | + type: 'success' | ||
396 | + }); | ||
397 | + this.$refs['editForm'].resetFields(); | ||
398 | + this.editFormVisible = false; | ||
399 | + }).catch(error => alert(error)); | ||
400 | + }); | ||
401 | + } | ||
402 | + }); | ||
403 | + }, | ||
404 | + //新增 | ||
405 | + addSubmit: function () { | ||
406 | + this.$refs.addForm.validate((valid) => { | ||
407 | + if (valid) { | ||
408 | + this.$confirm('确认提交吗?', '提示', {}).then(() => { | ||
409 | + this.addLoading = true; | ||
410 | + //NProgress.start(); | ||
411 | + let para = Object.assign({}, this.addForm); | ||
412 | + add(para).then((res) => { | ||
413 | + this.addLoading = false; | ||
414 | + if (res.status ===200) { | ||
415 | + this.$message({ | ||
416 | + message: '提交成功', | ||
417 | + type: 'success' | ||
418 | + }); | ||
419 | + this.$refs['jobForm'].resetFields(); | ||
420 | + this.addFormVisible = false; | ||
421 | + this.getProcessList(); | ||
422 | + } | ||
423 | + }).catch(error => alert(error)); | ||
424 | + }); | ||
425 | + } | ||
426 | + }); | ||
427 | + }, | ||
428 | + selsChange: function (sels) { | ||
429 | + this.sels = sels; | ||
430 | + }, | ||
431 | + //批量删除 | ||
432 | + batchRemove: function () { | ||
433 | + var ids = this.sels.map(item => item.roleId).toString(); | ||
434 | + this.$confirm('确认删除选中记录吗?', '提示', { | ||
435 | + type: 'warning' | ||
436 | + }).then(() => { | ||
437 | + this.listLoading = true; | ||
438 | + //NProgress.start(); | ||
439 | + let para = { ids: ids }; | ||
440 | + batchRemove(para).then((res) => { | ||
441 | + this.listLoading = false; | ||
442 | + //NProgress.done(); | ||
443 | + this.$message({ | ||
444 | + message: '删除成功', | ||
445 | + type: 'success' | ||
446 | + }) | ||
447 | + }); | ||
448 | + }).catch(() => { | ||
449 | + | ||
450 | + }); | ||
451 | + }, | ||
452 | + shwoDialog(index,row) { | ||
453 | + this.dialogData = Object.assign({}, row); | ||
454 | + this.centerDialogVisible = true; | ||
455 | + }, | ||
456 | + cascaderhandleChange:function (value) { | ||
457 | + let defaultvalue = ["0","0","0","0"]; | ||
458 | + defaultvalue = value; | ||
459 | + console.log(defaultvalue); | ||
460 | + this.addForm.jobuserid = defaultvalue[3]; | ||
461 | + } | ||
462 | + }, | ||
463 | + mounted() { | ||
464 | + this.getProcessList(); | ||
465 | + } | ||
466 | + } | ||
467 | + | ||
468 | +</script> | ||
469 | + | ||
470 | +<style scoped> | ||
471 | + | ||
472 | +</style> |
-
请 注册 或 登录 后发表评论