BJ_ZTEITS-Developers / parking-cloud-yudao

Commit c19fec2cf8f23b132c292bb783ff7c309b5c5a96

Authored by RuoYi
1 parent 669c4279

格式化代码

Inline Side-by-side
Showing 1 changed file with 223 additions and 105 deletions
ruoyi-ui/src/views/system/user/index.vue
  View file @c19fec2
... ... @@ -4,28 +4,77 @@
4 4 <!--部门数据-->
5 5 <el-col :span="4" :xs="24">
6 6 <div class="head-container">
7   - <el-input v-model="deptName" placeholder="请输入部门名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
  7 + <el-input
  8 + v-model="deptName"
  9 + placeholder="请输入部门名称"
  10 + clearable
  11 + size="small"
  12 + prefix-icon="el-icon-search"
  13 + style="margin-bottom: 20px"
  14 + />
8 15 </div>
9 16 <div class="head-container">
10   - <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" default-expand-all @node-click="handleNodeClick" />
  17 + <el-tree
  18 + :data="deptOptions"
  19 + :props="defaultProps"
  20 + :expand-on-click-node="false"
  21 + :filter-node-method="filterNode"
  22 + ref="tree"
  23 + default-expand-all
  24 + @node-click="handleNodeClick"
  25 + />
11 26 </div>
12 27 </el-col>
13 28 <!--用户数据-->
14 29 <el-col :span="20" :xs="24">
15 30 <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
16 31 <el-form-item label="用户名称" prop="userName">
17   - <el-input v-model="queryParams.userName" placeholder="请输入用户名称" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery" />
  32 + <el-input
  33 + v-model="queryParams.userName"
  34 + placeholder="请输入用户名称"
  35 + clearable
  36 + size="small"
  37 + style="width: 240px"
  38 + @keyup.enter.native="handleQuery"
  39 + />
18 40 </el-form-item>
19 41 <el-form-item label="手机号码" prop="phonenumber">
20   - <el-input v-model="queryParams.phonenumber" placeholder="请输入手机号码" clearable size="small" style="width: 240px" @keyup.enter.native="handleQuery" />
  42 + <el-input
  43 + v-model="queryParams.phonenumber"
  44 + placeholder="请输入手机号码"
  45 + clearable
  46 + size="small"
  47 + style="width: 240px"
  48 + @keyup.enter.native="handleQuery"
  49 + />
21 50 </el-form-item>
22 51 <el-form-item label="状态" prop="status">
23   - <el-select v-model="queryParams.status" placeholder="用户状态" clearable size="small" style="width: 240px">
24   - <el-option v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue" />
  52 + <el-select
  53 + v-model="queryParams.status"
  54 + placeholder="用户状态"
  55 + clearable
  56 + size="small"
  57 + style="width: 240px"
  58 + >
  59 + <el-option
  60 + v-for="dict in statusOptions"
  61 + :key="dict.dictValue"
  62 + :label="dict.dictLabel"
  63 + :value="dict.dictValue"
  64 + />
25 65 </el-select>
26 66 </el-form-item>
27 67 <el-form-item label="创建时间">
28   - <el-date-picker v-model="dateRange" size="small" style="width: 240px" value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker>
  68 + <el-date-picker
  69 + v-model="dateRange"
  70 + size="small"
  71 + style="width: 240px"
  72 + value-format="yyyy-MM-dd"
  73 + type="daterange"
  74 + range-separator="-"
  75 + start-placeholder="开始日期"
  76 + end-placeholder="结束日期"
  77 + ></el-date-picker>
29 78 </el-form-item>
30 79 <el-form-item>
31 80 <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
... ... @@ -35,19 +84,51 @@
35 84  
36 85 <el-row :gutter="10" class="mb8">
37 86 <el-col :span="1.5">
38   - <el-button type="primary" icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['system:user:add']">新增</el-button>
  87 + <el-button
  88 + type="primary"
  89 + icon="el-icon-plus"
  90 + size="mini"
  91 + @click="handleAdd"
  92 + v-hasPermi="['system:user:add']"
  93 + >新增</el-button>
39 94 </el-col>
40 95 <el-col :span="1.5">
41   - <el-button type="success" icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" v-hasPermi="['system:user:edit']">修改</el-button>
  96 + <el-button
  97 + type="success"
  98 + icon="el-icon-edit"
  99 + size="mini"
  100 + :disabled="single"
  101 + @click="handleUpdate"
  102 + v-hasPermi="['system:user:edit']"
  103 + >修改</el-button>
42 104 </el-col>
43 105 <el-col :span="1.5">
44   - <el-button type="danger" icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:user:remove']">删除</el-button>
  106 + <el-button
  107 + type="danger"
  108 + icon="el-icon-delete"
  109 + size="mini"
  110 + :disabled="multiple"
  111 + @click="handleDelete"
  112 + v-hasPermi="['system:user:remove']"
  113 + >删除</el-button>
45 114 </el-col>
46 115 <el-col :span="1.5">
47   - <el-button type="info" icon="el-icon-upload2" size="mini" @click="handleImport" v-hasPermi="['system:user:import']">导入</el-button>
  116 + <el-button
  117 + type="info"
  118 + icon="el-icon-upload2"
  119 + size="mini"
  120 + @click="handleImport"
  121 + v-hasPermi="['system:user:import']"
  122 + >导入</el-button>
48 123 </el-col>
49 124 <el-col :span="1.5">
50   - <el-button type="warning" icon="el-icon-download" size="mini" @click="handleExport" v-hasPermi="['system:user:export']">导出</el-button>
  125 + <el-button
  126 + type="warning"
  127 + icon="el-icon-download"
  128 + size="mini"
  129 + @click="handleExport"
  130 + v-hasPermi="['system:user:export']"
  131 + >导出</el-button>
51 132 </el-col>
52 133 <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
53 134 </el-row>
... ... @@ -61,7 +142,12 @@
61 142 <el-table-column label="手机号码" align="center" prop="phonenumber" width="120" />
62 143 <el-table-column label="状态" align="center">
63 144 <template slot-scope="scope">
64   - <el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch>
  145 + <el-switch
  146 + v-model="scope.row.status"
  147 + active-value="0"
  148 + inactive-value="1"
  149 + @change="handleStatusChange(scope.row)"
  150 + ></el-switch>
65 151 </template>
66 152 </el-table-column>
67 153 <el-table-column label="创建时间" align="center" prop="createTime" width="160">
... ... @@ -69,16 +155,46 @@
69 155 <span>{{ parseTime(scope.row.createTime) }}</span>
70 156 </template>
71 157 </el-table-column>
72   - <el-table-column label="操作" align="center" width="160" class-name="small-padding fixed-width">
  158 + <el-table-column
  159 + label="操作"
  160 + align="center"
  161 + width="160"
  162 + class-name="small-padding fixed-width"
  163 + >
73 164 <template slot-scope="scope">
74   - <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:user:edit']">修改</el-button>
75   - <el-button v-if="scope.row.userId !== 1" size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['system:user:remove']">删除</el-button>
76   - <el-button size="mini" type="text" icon="el-icon-key" @click="handleResetPwd(scope.row)" v-hasPermi="['system:user:resetPwd']">重置</el-button>
  165 + <el-button
  166 + size="mini"
  167 + type="text"
  168 + icon="el-icon-edit"
  169 + @click="handleUpdate(scope.row)"
  170 + v-hasPermi="['system:user:edit']"
  171 + >修改</el-button>
  172 + <el-button
  173 + v-if="scope.row.userId !== 1"
  174 + size="mini"
  175 + type="text"
  176 + icon="el-icon-delete"
  177 + @click="handleDelete(scope.row)"
  178 + v-hasPermi="['system:user:remove']"
  179 + >删除</el-button>
  180 + <el-button
  181 + size="mini"
  182 + type="text"
  183 + icon="el-icon-key"
  184 + @click="handleResetPwd(scope.row)"
  185 + v-hasPermi="['system:user:resetPwd']"
  186 + >重置</el-button>
77 187 </template>
78 188 </el-table-column>
79 189 </el-table>
80 190  
81   - <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
  191 + <pagination
  192 + v-show="total>0"
  193 + :total="total"
  194 + :page.sync="queryParams.pageNum"
  195 + :limit.sync="queryParams.pageSize"
  196 + @pagination="getList"
  197 + />
82 198 </el-col>
83 199 </el-row>
84 200  
... ... @@ -125,14 +241,23 @@
125 241 <el-col :span="12">
126 242 <el-form-item label="用户性别">
127 243 <el-select v-model="form.sex" placeholder="请选择">
128   - <el-option v-for="dict in sexOptions" :key="dict.dictValue" :label="dict.dictLabel" :value="dict.dictValue"></el-option>
  244 + <el-option
  245 + v-for="dict in sexOptions"
  246 + :key="dict.dictValue"
  247 + :label="dict.dictLabel"
  248 + :value="dict.dictValue"
  249 + ></el-option>
129 250 </el-select>
130 251 </el-form-item>
131 252 </el-col>
132 253 <el-col :span="12">
133 254 <el-form-item label="状态">
134 255 <el-radio-group v-model="form.status">
135   - <el-radio v-for="dict in statusOptions" :key="dict.dictValue" :label="dict.dictValue">{{dict.dictLabel}}</el-radio>
  256 + <el-radio
  257 + v-for="dict in statusOptions"
  258 + :key="dict.dictValue"
  259 + :label="dict.dictValue"
  260 + >{{dict.dictLabel}}</el-radio>
136 261 </el-radio-group>
137 262 </el-form-item>
138 263 </el-col>
... ... @@ -141,14 +266,26 @@
141 266 <el-col :span="12">
142 267 <el-form-item label="岗位">
143 268 <el-select v-model="form.postIds" multiple placeholder="请选择">
144   - <el-option v-for="item in postOptions" :key="item.postId" :label="item.postName" :value="item.postId" :disabled="item.status == 1"></el-option>
  269 + <el-option
  270 + v-for="item in postOptions"
  271 + :key="item.postId"
  272 + :label="item.postName"
  273 + :value="item.postId"
  274 + :disabled="item.status == 1"
  275 + ></el-option>
145 276 </el-select>
146 277 </el-form-item>
147 278 </el-col>
148 279 <el-col :span="12">
149 280 <el-form-item label="角色">
150 281 <el-select v-model="form.roleIds" multiple placeholder="请选择">
151   - <el-option v-for="item in roleOptions" :key="item.roleId" :label="item.roleName" :value="item.roleId" :disabled="item.status == 1"></el-option>
  282 + <el-option
  283 + v-for="item in roleOptions"
  284 + :key="item.roleId"
  285 + :label="item.roleName"
  286 + :value="item.roleId"
  287 + :disabled="item.status == 1"
  288 + ></el-option>
152 289 </el-select>
153 290 </el-form-item>
154 291 </el-col>
... ... @@ -169,7 +306,18 @@
169 306  
170 307 <!-- 用户导入对话框 -->
171 308 <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
172   - <el-upload ref="upload" :limit="1" accept=".xlsx, .xls" :headers="upload.headers" :action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading" :on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
  309 + <el-upload
  310 + ref="upload"
  311 + :limit="1"
  312 + accept=".xlsx, .xls"
  313 + :headers="upload.headers"
  314 + :action="upload.url + '?updateSupport=' + upload.updateSupport"
  315 + :disabled="upload.isUploading"
  316 + :on-progress="handleFileUploadProgress"
  317 + :on-success="handleFileSuccess"
  318 + :auto-upload="false"
  319 + drag
  320 + >
173 321 <i class="el-icon-upload"></i>
174 322 <div class="el-upload__text">
175 323 将文件拖到此处，或
... ... @@ -190,17 +338,7 @@
190 338 </template>
191 339  
192 340 <script>
193   -import {
194   - listUser,
195   - getUser,
196   - delUser,
197   - addUser,
198   - updateUser,
199   - exportUser,
200   - resetUserPwd,
201   - changeUserStatus,
202   - importTemplate,
203   -} from "@/api/system/user";
  341 +import { listUser, getUser, delUser, addUser, updateUser, exportUser, resetUserPwd, changeUserStatus, importTemplate } from "@/api/system/user";
204 342 import { getToken } from "@/utils/auth";
205 343 import { treeselect } from "@/api/system/dept";
206 344 import Treeselect from "@riophae/vue-treeselect";
... ... @@ -249,7 +387,7 @@ export default {
249 387 form: {},
250 388 defaultProps: {
251 389 children: "children",
252   - label: "label",
  390 + label: "label"
253 391 },
254 392 // 用户导入参数
255 393 upload: {
... ... @@ -264,7 +402,7 @@ export default {
264 402 // 设置上传的请求头部
265 403 headers: { Authorization: "Bearer " + getToken() },
266 404 // 上传的地址
267   - url: process.env.VUE_APP_BASE_API + "/system/user/importData",
  405 + url: process.env.VUE_APP_BASE_API + "/system/user/importData"
268 406 },
269 407 // 查询参数
270 408 queryParams: {
... ... @@ -273,57 +411,57 @@ export default {
273 411 userName: undefined,
274 412 phonenumber: undefined,
275 413 status: undefined,
276   - deptId: undefined,
  414 + deptId: undefined
277 415 },
278 416 // 表单校验
279 417 rules: {
280 418 userName: [
281   - { required: true, message: "用户名称不能为空", trigger: "blur" },
  419 + { required: true, message: "用户名称不能为空", trigger: "blur" }
282 420 ],
283 421 nickName: [
284   - { required: true, message: "用户昵称不能为空", trigger: "blur" },
  422 + { required: true, message: "用户昵称不能为空", trigger: "blur" }
285 423 ],
286 424 deptId: [
287   - { required: true, message: "归属部门不能为空", trigger: "blur" },
  425 + { required: true, message: "归属部门不能为空", trigger: "blur" }
288 426 ],
289 427 password: [
290   - { required: true, message: "用户密码不能为空", trigger: "blur" },
  428 + { required: true, message: "用户密码不能为空", trigger: "blur" }
291 429 ],
292 430 email: [
293 431 { required: true, message: "邮箱地址不能为空", trigger: "blur" },
294 432 {
295 433 type: "email",
296 434 message: "'请输入正确的邮箱地址",
297   - trigger: ["blur", "change"],
298   - },
  435 + trigger: ["blur", "change"]
  436 + }
299 437 ],
300 438 phonenumber: [
301 439 { required: true, message: "手机号码不能为空", trigger: "blur" },
302 440 {
303 441 pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
304 442 message: "请输入正确的手机号码",
305   - trigger: "blur",
306   - },
307   - ],
308   - },
  443 + trigger: "blur"
  444 + }
  445 + ]
  446 + }
309 447 };
310 448 },
311 449 watch: {
312 450 // 根据名称筛选部门树
313 451 deptName(val) {
314 452 this.$refs.tree.filter(val);
315   - },
  453 + }
316 454 },
317 455 created() {
318 456 this.getList();
319 457 this.getTreeselect();
320   - this.getDicts("sys_normal_disable").then((response) => {
  458 + this.getDicts("sys_normal_disable").then(response => {
321 459 this.statusOptions = response.data;
322 460 });
323   - this.getDicts("sys_user_sex").then((response) => {
  461 + this.getDicts("sys_user_sex").then(response => {
324 462 this.sexOptions = response.data;
325 463 });
326   - this.getConfigKey("sys.user.initPassword").then((response) => {
  464 + this.getConfigKey("sys.user.initPassword").then(response => {
327 465 this.initPassword = response.msg;
328 466 });
329 467 },
... ... @@ -331,8 +469,7 @@ export default {
331 469 /** 查询用户列表 */
332 470 getList() {
333 471 this.loading = true;
334   - listUser(this.addDateRange(this.queryParams, this.dateRange)).then(
335   - (response) => {
  472 + listUser(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
336 473 this.userList = response.rows;
337 474 this.total = response.total;
338 475 this.loading = false;
... ... @@ -341,7 +478,7 @@ export default {
341 478 },
342 479 /** 查询部门下拉树结构 */
343 480 getTreeselect() {
344   - treeselect().then((response) => {
  481 + treeselect().then(response => {
345 482 this.deptOptions = response.data;
346 483 });
347 484 },
... ... @@ -358,22 +495,15 @@ export default {
358 495 // 用户状态修改
359 496 handleStatusChange(row) {
360 497 let text = row.status === "0" ? "启用" : "停用";
361   - this.$confirm(
362   - '确认要"' + text + '""' + row.userName + '"用户吗?',
363   - "警告",
364   - {
  498 + this.$confirm('确认要"' + text + '""' + row.userName + '"用户吗?', "警告", {
365 499 confirmButtonText: "确定",
366 500 cancelButtonText: "取消",
367   - type: "warning",
368   - }
369   - )
370   - .then(function () {
  501 + type: "warning"
  502 + }).then(function() {
371 503 return changeUserStatus(row.userId, row.status);
372   - })
373   - .then(() => {
  504 + }).then(() => {
374 505 this.msgSuccess(text + "成功");
375   - })
376   - .catch(function () {
  506 + }).catch(function() {
377 507 row.status = row.status === "0" ? "1" : "0";
378 508 });
379 509 },
... ... @@ -396,7 +526,7 @@ export default {
396 526 status: "0",
397 527 remark: undefined,
398 528 postIds: [],
399   - roleIds: [],
  529 + roleIds: []
400 530 };
401 531 this.resetForm("form");
402 532 },
... ... @@ -413,7 +543,7 @@ export default {
413 543 },
414 544 // 多选框选中数据
415 545 handleSelectionChange(selection) {
416   - this.ids = selection.map((item) => item.userId);
  546 + this.ids = selection.map(item => item.userId);
417 547 this.single = selection.length != 1;
418 548 this.multiple = !selection.length;
419 549 },
... ... @@ -421,7 +551,7 @@ export default {
421 551 handleAdd() {
422 552 this.reset();
423 553 this.getTreeselect();
424   - getUser().then((response) => {
  554 + getUser().then(response => {
425 555 this.postOptions = response.posts;
426 556 this.roleOptions = response.roles;
427 557 this.open = true;
... ... @@ -434,7 +564,7 @@ export default {
434 564 this.reset();
435 565 this.getTreeselect();
436 566 const userId = row.userId || this.ids;
437   - getUser(userId).then((response) => {
  567 + getUser(userId).then(response => {
438 568 this.form = response.data;
439 569 this.postOptions = response.posts;
440 570 this.roleOptions = response.roles;
... ... @@ -449,23 +579,21 @@ export default {
449 579 handleResetPwd(row) {
450 580 this.$prompt('请输入"' + row.userName + '"的新密码', "提示", {
451 581 confirmButtonText: "确定",
452   - cancelButtonText: "取消",
453   - })
454   - .then(({ value }) => {
455   - resetUserPwd(row.userId, value).then((response) => {
  582 + cancelButtonText: "取消"
  583 + }).then(({ value }) => {
  584 + resetUserPwd(row.userId, value).then(response => {
456 585 if (response.code === 200) {
457 586 this.msgSuccess("修改成功，新密码是：" + value);
458 587 }
459 588 });
460   - })
461   - .catch(() => {});
  589 + }).catch(() => {});
462 590 },
463 591 /** 提交按钮 */
464   - submitForm: function () {
465   - this.$refs["form"].validate((valid) => {
  592 + submitForm: function() {
  593 + this.$refs["form"].validate(valid => {
466 594 if (valid) {
467 595 if (this.form.userId != undefined) {
468   - updateUser(this.form).then((response) => {
  596 + updateUser(this.form).then(response => {
469 597 if (response.code === 200) {
470 598 this.msgSuccess("修改成功");
471 599 this.open = false;
... ... @@ -473,7 +601,7 @@ export default {
473 601 }
474 602 });
475 603 } else {
476   - addUser(this.form).then((response) => {
  604 + addUser(this.form).then(response => {
477 605 if (response.code === 200) {
478 606 this.msgSuccess("新增成功");
479 607 this.open = false;
... ... @@ -487,39 +615,29 @@ export default {
487 615 /** 删除按钮操作 */
488 616 handleDelete(row) {
489 617 const userIds = row.userId || this.ids;
490   - this.$confirm(
491   - '是否确认删除用户编号为"' + userIds + '"的数据项?',
492   - "警告",
493   - {
  618 + this.$confirm('是否确认删除用户编号为"' + userIds + '"的数据项?', "警告", {
494 619 confirmButtonText: "确定",
495 620 cancelButtonText: "取消",
496   - type: "warning",
497   - }
498   - )
499   - .then(function () {
  621 + type: "warning"
  622 + }).then(function() {
500 623 return delUser(userIds);
501   - })
502   - .then(() => {
  624 + }).then(() => {
503 625 this.getList();
504 626 this.msgSuccess("删除成功");
505   - })
506   - .catch(function () {});
  627 + }).catch(function() {});
507 628 },
508 629 /** 导出按钮操作 */
509 630 handleExport() {
510 631 const queryParams = this.queryParams;
511   - this.$confirm("是否确认导出所有用户数据项?", "警告", {
512   - confirmButtonText: "确定",
513   - cancelButtonText: "取消",
514   - type: "warning",
515   - })
516   - .then(function () {
  632 + this.$confirm('是否确认导出所有用户数据项?', "警告", {
  633 + confirmButtonText: "确定",
  634 + cancelButtonText: "取消",
  635 + type: "warning"
  636 + }).then(function() {
517 637 return exportUser(queryParams);
518   - })
519   - .then((response) => {
  638 + }).then(response => {
520 639 this.download(response.msg);
521   - })
522   - .catch(function () {});
  640 + }).catch(function() {});
523 641 },
524 642 /** 导入按钮操作 */
525 643 handleImport() {
... ... @@ -528,7 +646,7 @@ export default {
528 646 },
529 647 /** 下载模板操作 */
530 648 importTemplate() {
531   - importTemplate().then((response) => {
  649 + importTemplate().then(response => {
532 650 this.download(response.msg);
533 651 });
534 652 },
... ... @@ -547,7 +665,7 @@ export default {
547 665 // 提交上传文件
548 666 submitFileForm() {
549 667 this.$refs.upload.submit();
550   - },
551   - },
  668 + }
  669 + }
552 670 };
553 671 </script>
554 672 \ No newline at end of file
... ...