From fd18675883525106788bcfd9b0d16fbdbfc09225 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E5=AE=B6=E8=AE=AD?=
 <zhangjiaxun-xf@bestpay.com.cn>
Date: Tue, 20 Oct 2026 18:48:37 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B7=E5=BC=8F:=20=E7=94=A8=E6=88=B7?=
 =?UTF-8?q?=E7=AE=A1=E7=90=86=E9=A1=B5=E6=98=B5=E7=A7=B0=E5=88=97=E5=A4=B4?=
 =?UTF-8?q?=E5=83=8F=E6=94=B9=E4=B8=BA=E4=B8=BB=E8=89=B2=E6=B8=90=E5=8F=98?=
 =?UTF-8?q?=EF=BC=8C=E4=B8=8E=E5=8F=B3=E4=B8=8A=E8=A7=92=E5=A4=B4=E5=83=8F?=
 =?UTF-8?q?=E4=B8=80=E8=87=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/view/sys/sys-user.vue | 737 +++++++++++++++++++-------------------
 1 file changed, 370 insertions(+), 367 deletions(-)

diff --git a/src/view/sys/sys-user.vue b/src/view/sys/sys-user.vue
index df59f30..7c2e692 100644
--- a/src/view/sys/sys-user.vue
+++ b/src/view/sys/sys-user.vue
@@ -118,382 +118,385 @@
 </template>
 
 <script>
-  import { getDataList, add, update, remove, getExcelTemplate, resetPassword } from '@/api/sys/sys-user'
-  import { getRoleSelectList } from '@/api/sys/sys-role'
-  import { nginxPath } from "@/common/js/common";
-  import { objectUtil, utils, exportExcel } from "@/common/js/util";
+import { getDataList, add, update, remove, getExcelTemplate, resetPassword } from '@/api/sys/sys-user'
+import { getRoleSelectList } from '@/api/sys/sys-role'
+import { nginxPath } from '@/common/js/common'
+import { objectUtil, exportExcel } from '@/common/js/util'
 
-  export default {
-    name: "sso-user",
-    data() {
-      return {
-        fixedHeader: true,// 高度自适应
-        autoHeight: `${window.innerHeight} ` * 0.58,// 获取当前可视高度-定义Table高度
-        search: {
-          username: ''
-        },
-        listColumns: [
-          {
-            title: "#",
-            type: 'index',
-            width: 60,
-            align: 'center',
-            indexMethod: (row) => {
-              return (row._index + 1) + ((this.pageParam.pageNum - 1) * this.pageParam.pageSize);
-            }
-          },
-          {
-            title: '登录账号',
-            key: 'username',
-            width: 150
-          },
-          {
-            title: '用户昵称',
-            key: 'nickname',
-            minWidth: 200,
-            render: (h, params) => {
-              const row = params.row
-              const text = (row.nickname || row.username || 'U').trim().charAt(0)
-              return h('div',
-                [
-                  h('Avatar',
-                    {
-                      props: {
-                        shape: 'square',
-                        src: row.avatar || ''
-                      },
-                      style: {
-                        marginRight: '8px',
-                        verticalAlign: 'middle',
-                        backgroundColor: '#2d8cf0'
-                      }
-                    },
-                    text
-                  ),
-                  h('span', row.nickname)
-                ]
-              )
-            }
-          },
-          {
-            title: '用户类型',
-            key: 'userType',
-            width: 120,
-            render: (h, params) => {
-              return h('div', this.transformUserType(params.row.userType))
-            }
-          },
-          {
-            title: '联系电话',
-            key: 'phone',
-            width: 150,
-          },
-          {
-            title: '电子邮箱',
-            key: 'email',
-            width: 180,
-          },
-          {
-            title: '状态',
-            key: 'status',
-            fixed: 'right',
-            align: 'center',
-            width: 120,
-            render: (h, params) => {
-              let temp = this.transformStatus(params.row.status)
-              return h("Tag", {
-                  props: {
-                    color: temp.color
-                  }
-                }, temp.text
-              )
-            }
-          },
-          {
-            title: '操作区',
-            slot: 'action',
-            width: 300,
-            fixed: 'right',
-            align: 'center'
+export default {
+  name: 'sso-user',
+  data () {
+    return {
+      fixedHeader: true, // 高度自适应
+      autoHeight: `${window.innerHeight} ` * 0.58, // 获取当前可视高度-定义Table高度
+      search: {
+        username: ''
+      },
+      listColumns: [
+        {
+          title: '#',
+          type: 'index',
+          width: 60,
+          align: 'center',
+          indexMethod: (row) => {
+            return (row._index + 1) + ((this.pageParam.pageNum - 1) * this.pageParam.pageSize)
           }
-        ],
-        exportColumns: [
-          {
-            title: '登录账号',
-            key: 'username'
-          },
-          {
-            title: '用户类型',
-            key: 'userType',
-            callback: (value) => {
-              return this.transformUserType(value)
+        },
+        {
+          title: '登录账号',
+          key: 'username',
+          width: 150
+        },
+        {
+          title: '用户昵称',
+          key: 'nickname',
+          minWidth: 200,
+          render: (h, params) => {
+            const row = params.row
+            const text = (row.nickname || row.username || 'U').trim().charAt(0)
+            return h('div',
+              [
+                h('Avatar',
+                  {
+                    props: {
+                      shape: 'square',
+                      src: row.avatar || ''
+                    },
+                    style: {
+                      marginRight: '8px',
+                      verticalAlign: 'middle',
+                      // 与右上角用户头像同款渐变，无图时显示白色首字
+                      background: 'linear-gradient(135deg, #4f6ef7, #7c5cf0)',
+                      color: '#fff',
+                      fontWeight: 500
+                    }
+                  },
+                  text
+                ),
+                h('span', row.nickname)
+              ]
+            )
+          }
+        },
+        {
+          title: '用户类型',
+          key: 'userType',
+          width: 120,
+          render: (h, params) => {
+            return h('div', this.transformUserType(params.row.userType))
+          }
+        },
+        {
+          title: '联系电话',
+          key: 'phone',
+          width: 150
+        },
+        {
+          title: '电子邮箱',
+          key: 'email',
+          width: 180
+        },
+        {
+          title: '状态',
+          key: 'status',
+          fixed: 'right',
+          align: 'center',
+          width: 120,
+          render: (h, params) => {
+            let temp = this.transformStatus(params.row.status)
+            return h('Tag', {
+              props: {
+                color: temp.color
+              }
+            }, temp.text
+            )
+          }
+        },
+        {
+          title: '操作区',
+          slot: 'action',
+          width: 300,
+          fixed: 'right',
+          align: 'center'
+        }
+      ],
+      exportColumns: [
+        {
+          title: '登录账号',
+          key: 'username'
+        },
+        {
+          title: '用户类型',
+          key: 'userType',
+          callback: (value) => {
+            return this.transformUserType(value)
+          }
+        },
+        {
+          title: '联系电话',
+          key: 'phone'
+        },
+        {
+          title: '状态',
+          key: 'status',
+          callback: (value) => {
+            let temp = this.transformStatus(value)
+            return temp.text
+          }
+        }
+      ],
+      roleSelectList: [], // 角色列表
+      isDefaultRoleId: [],
+      dataList: [],
+      tableLoading: false,
+      pageTotal: 0, // 总页数
+      pageSize: 10, // 每页显示条数
+      pageCurrent: 1, // 当前页
+      pageParam: { // 调用时候的分页参数
+        pageNum: 1,
+        pageSize: 10
+      },
+      modal: false,
+      modalTitle: '',
+      addModal: false, // 添加
+      editModal: false, // 编辑
+      submitLoading: false,
+      formItem: {
+        id: '',
+        username: '',
+        userType: 'userType001',
+        nickname: '',
+        phone: '',
+        email: '',
+        roleIds: [],
+        status: 0
+      },
+      ruleCustom: {
+        username: [{
+          required: true, message: '请输入登录账号', trigger: 'blur'
+        }],
+        userType: [{
+          required: true, message: '请选择用户类型', trigger: 'blur'
+        }],
+        nickname: [{
+          required: true, message: '请输入用户昵称', trigger: 'blur'
+        }],
+        phone: [{
+          required: true, message: '请输入联系电话', trigger: 'blur'
+        }],
+        email: [{
+          required: true, message: '请输入电子邮箱', trigger: 'blur'
+        }],
+        roleIds: [{
+          required: true, type: 'array', message: '请选择角色权限', trigger: 'blur'
+        }]
+      }
+    }
+  },
+  methods: {
+    getDataList () {
+      let temp = JSON.parse(JSON.stringify(this.pageParam))
+      let data = objectUtil.trimJoin(temp, this.search)
+      this.tableLoading = true
+      getDataList(data).then(res => {
+        let page = res.data.data
+        this.pageTotal = page.total
+        this.dataList = page.records
+        // 延迟300毫秒，给它更流畅的感觉
+        setTimeout(() => {
+          this.tableLoading = false
+        }, 300)
+      })
+    },
+    getRoleSelectList () {
+      // 加载角色下拉列表
+      getRoleSelectList().then(res => {
+        let roleSelectList = res.data.data || []
+        this.roleSelectList = roleSelectList
+        this.isDefaultRoleId = roleSelectList.length > 0 ? [roleSelectList[0].value] : []
+        this.formItem.roleIds = this.isDefaultRoleId
+      })
+    },
+    toAdd () {
+      this.formItem.roleIds = this.isDefaultRoleId
+      this.modalTitle = '添加'
+      this.modal = true
+
+      this.addModal = true
+      this.editModal = false
+    },
+    toEdit (index) {
+      this.modalTitle = '编辑'
+      let temp = this.dataList[index]
+
+      this.addModal = false
+      this.editModal = true
+      this.modal = true
+
+      this.$nextTick(() => {
+        // 清除上次校验状态，避免编辑回显报红
+        if (this.$refs.formItem) {
+          this.$refs.formItem.resetFields()
+        }
+        this.formItem.id = temp.id
+        this.formItem.username = temp.username
+        this.formItem.nickname = temp.nickname
+        this.formItem.userType = temp.userType
+        this.formItem.phone = temp.phone
+        this.formItem.email = temp.email
+        if (temp.roleIds != null && temp.roleIds !== '') {
+          this.formItem.roleIds = temp.roleIds.split(',')
+        } else {
+          this.formItem.roleIds = []
+        }
+      })
+    },
+    submit (formItem) {
+      // modal 提交
+      this.$refs[formItem].validate((valid) => {
+        if (valid) {
+          let roleIdArr = this.formItem.roleIds
+          let userAndRoleArr = []
+          for (let i = 0; i < roleIdArr.length; i++) {
+            let roleAndMenu = {
+              userId: this.formItem.id,
+              roleId: roleIdArr[i]
             }
-          },
-          {
-            title: '联系电话',
-            key: 'phone'
-          },
-          {
-            title: '状态',
-            key: 'status',
-            callback: (value) => {
-              let temp = this.transformStatus(value)
-              return temp.text
-            }
-          },
-        ],
-        roleSelectList: [],          //角色列表
-        isDefaultRoleId: [],
-        dataList: [],
-        tableLoading: false,
-        pageTotal: 0,          // 总页数
-        pageSize: 10,          // 每页显示条数
-        pageCurrent: 1,        // 当前页
-        pageParam: {           // 调用时候的分页参数
-          pageNum: 1,
-          pageSize: 10
-        },
-        modal: false,
-        modalTitle: '',
-        addModal: false,        // 添加
-        editModal: false,       // 编辑
-        submitLoading: false,
-        formItem: {
-          id: '',
-          username: '',
-          userType: 'userType001',
-          nickname: '',
-          phone: '',
-          email: '',
-          roleIds: [],
-          status: 0,
-        },
-        ruleCustom: {
-          username: [{
-            required: true, message: '请输入登录账号', trigger: 'blur'
-          }],
-          userType: [{
-            required: true, message: '请选择用户类型', trigger: 'blur'
-          }],
-          nickname: [{
-            required: true, message: '请输入用户昵称', trigger: 'blur'
-          }],
-          phone: [{
-            required: true, message: '请输入联系电话', trigger: 'blur'
-          }],
-          email: [{
-            required: true, message: '请输入电子邮箱', trigger: 'blur'
-          }],
-          roleIds: [{
-            required: true, type: 'array', message: '请选择角色权限', trigger: 'blur'
-          }],
-        },
+            userAndRoleArr.push(roleAndMenu)
+          }
+          let temp = JSON.parse(JSON.stringify(this.formItem))
+          let data = objectUtil.trimJoin(temp, {
+            userRoleStr: JSON.stringify(userAndRoleArr).toString()
+          })
+
+          if (this.addModal) { // 添加
+            add(data).then(res => {
+              this.getDataList()
+              this.$Message.success('添加成功!')
+            })
+          } else { // 编辑
+            update(data).then(res => {
+              this.getDataList()
+              this.$Message.success('编辑成功!')
+            })
+          }
+          this.cancel()
+        }
+      })
+    },
+    toResetPassword (index) {
+      let temp = this.dataList[index]
+      resetPassword({ id: temp.id }).then(res => {
+        setTimeout(() => {
+          this.$Message.success('重置密码成功！')
+        }, 300)
+      })
+    },
+    cancel () {
+      // Modal cancel
+      this.modal = false
+      this.refresh()
+    },
+    toDelete (index) {
+      let temp = this.dataList[index]
+      if (temp.username === 'admin' && temp.userType === 'userType001') {
+        this.$Message.warning('系统内置管理员账号不可删除！')
+        return
+      }
+
+      let data = {
+        id: temp.id
+      }
+      remove(data).then(res => {
+        this.refresh()
+        this.getDataList()
+        this.$Message.success('删除成功!')
+      })
+    },
+    refresh () {
+      this.pageParam = {
+        pageNum: 1,
+        pageSize: 10
+      }
+      this.search = {
+        username: ''
+      }
+      this.formItem = {
+        id: '',
+        username: '',
+        userType: 'userType001',
+        nickname: '',
+        phone: '',
+        email: '',
+        roleIds: [],
+        status: 0
       }
     },
-    methods: {
-      getDataList() {
-        let temp = JSON.parse(JSON.stringify(this.pageParam))
-        let data = objectUtil.trimJoin(temp, this.search)
-        this.tableLoading = true
-        getDataList(data).then(res => {
-          let page = res.data.data;
-          this.pageTotal = page.total
-          this.dataList = page.records
-          // 延迟300毫秒，给它更流畅的感觉
-          setTimeout(() => {
-            this.tableLoading = false
-          }, 300)
-        })
-      },
-      getRoleSelectList() {
-        // 加载角色下拉列表
-        getRoleSelectList().then(res => {
-          let roleSelectList = res.data.data || []
-          this.roleSelectList = roleSelectList
-          this.isDefaultRoleId = roleSelectList.length > 0 ? [roleSelectList[0].value] : []
-          this.formItem.roleIds = this.isDefaultRoleId
-        })
-      },
-      toAdd() {
-        this.formItem.roleIds = this.isDefaultRoleId
-        this.modalTitle = "添加"
-        this.modal = true
-
-        this.addModal = true
-        this.editModal = false
-      },
-      toEdit(index) {
-        this.modalTitle = "编辑"
-        let temp = this.dataList[index]
-
-        this.addModal = false
-        this.editModal = true
-        this.modal = true
-
-        this.$nextTick(() => {
-          // 清除上次校验状态，避免编辑回显报红
-          if (this.$refs.formItem) {
-            this.$refs.formItem.resetFields()
-          }
-          this.formItem.id = temp.id
-          this.formItem.username = temp.username
-          this.formItem.nickname = temp.nickname
-          this.formItem.userType = temp.userType
-          this.formItem.phone = temp.phone
-          this.formItem.email = temp.email
-          if (temp.roleIds != null && temp.roleIds !== '') {
-            this.formItem.roleIds = temp.roleIds.split(',')
-          } else {
-            this.formItem.roleIds = []
-          }
-        })
-      },
-      submit(formItem) {
-        // modal 提交
-        this.$refs[formItem].validate((valid) => {
-          if (valid) {
-            let roleIdArr = this.formItem.roleIds
-            let userAndRoleArr = []
-            for (let i = 0; i < roleIdArr.length; i++) {
-              let roleAndMenu = {
-                userId: this.formItem.id,
-                roleId: roleIdArr[i]
-              }
-              userAndRoleArr.push(roleAndMenu)
-            }
-            let temp = JSON.parse(JSON.stringify(this.formItem))
-            let data = objectUtil.trimJoin(temp, {
-              userRoleStr: JSON.stringify(userAndRoleArr).toString()
-            })
-
-            if (this.addModal) {//添加
-              add(data).then(res => {
-                this.getDataList()
-                this.$Message.success("添加成功!")
-              })
-            } else {//编辑
-              update(data).then(res => {
-                this.getDataList()
-                this.$Message.success("编辑成功!")
-              })
-            }
-            this.cancel()
-          }
-        })
-      },
-      toResetPassword(index) {
-        let temp = this.dataList[index]
-        resetPassword( {id: temp.id} ).then(res => {
-          setTimeout(() => {
-            this.$Message.success("重置密码成功！")
-          }, 300)
-        })
-      },
-      cancel() {
-        // Modal cancel
-        this.modal = false
-        this.refresh()
-      },
-      toDelete(index) {
-        let temp = this.dataList[index]
-        if (temp.username === 'admin' && temp.userType === 'userType001') {
-          this.$Message.warning("系统内置管理员账号不可删除！")
-          return
-        }
-
-        let data = {
-          id: temp.id
-        }
-        remove(data).then(res => {
-          this.refresh()
-          this.getDataList()
-          this.$Message.success("删除成功!")
-        })
-      },
-      refresh() {
-        this.pageParam = {
-          pageNum: 1,
-          pageSize: 10
-        };
-        this.search = {
-          username: '',
-        };
-        this.formItem = {
-          id: '',
-          username: '',
-          userType: 'userType001',
-          nickname: '',
-          phone: '',
-          email: '',
-          roleIds: [],
-          status: 0,
-        };
-      },
-      changePage(index) {
-        // 需要显示开始数据的index,(因为数据是从0开始的，页码是从1开始的，需要-1)
-        this.pageParam.pageNum = index;
-        this.getDataList();
-      },
-      changePageSize(page) {
-        // 切换分页条数
-        this.pageParam.pageNum = 1;
-        this.pageParam.pageSize = page;
-        this.getDataList();
-      },
-      transformStatus(status) {
-        let object = {}
-        switch (status) {
-          case 0 :
-            object.color = "blue"
-            object.text = "正常"
-            break;
-          case 9 :
-            object.color = "red"
-            object.text = "已注销"
-            break;
-        }
-        return object;
-      },
-      transformUserType(userType) {
-        // userType 转换
-        switch (userType) {
-          case 'userType001':
-            userType = "超级管理员"
-            break;
-          case 'userType002':
-            userType = "普通用户"
-            break;
-          default:
-            userType = "-"
-            break;
-        }
-        return userType;
-      },
-      toExport() {
-        // 导出到Excel
-        getDataList({pageNum: 1, pageSize: this.pageTotal || 1000}).then(res => {
-          let page = res.data.data
-          let data = (page && page.records) ? page.records : this.dataList
-          exportExcel(this.exportColumns, data, "用户数据")
-        })
-      },
-      toDownload() {
-        // 下载Excel模板
-        getExcelTemplate().then((res) => {
-          let a = document.createElement('a');
-          a.href = nginxPath + "/excelTemplate" + res.data.data.fileSuffix;
-          a.click();
-        })
-      },
-    },
-    created() {
+    changePage (index) {
+      // 需要显示开始数据的index,(因为数据是从0开始的，页码是从1开始的，需要-1)
+      this.pageParam.pageNum = index
       this.getDataList()
-      this.getRoleSelectList()
     },
-    mounted() {
-      //this.getDataList()
+    changePageSize (page) {
+      // 切换分页条数
+      this.pageParam.pageNum = 1
+      this.pageParam.pageSize = page
+      this.getDataList()
+    },
+    transformStatus (status) {
+      let object = {}
+      switch (status) {
+        case 0 :
+          object.color = 'blue'
+          object.text = '正常'
+          break
+        case 9 :
+          object.color = 'red'
+          object.text = '已注销'
+          break
+      }
+      return object
+    },
+    transformUserType (userType) {
+      // userType 转换
+      switch (userType) {
+        case 'userType001':
+          userType = '超级管理员'
+          break
+        case 'userType002':
+          userType = '普通用户'
+          break
+        default:
+          userType = '-'
+          break
+      }
+      return userType
+    },
+    toExport () {
+      // 导出到Excel
+      getDataList({ pageNum: 1, pageSize: this.pageTotal || 1000 }).then(res => {
+        let page = res.data.data
+        let data = (page && page.records) ? page.records : this.dataList
+        exportExcel(this.exportColumns, data, '用户数据')
+      })
+    },
+    toDownload () {
+      // 下载Excel模板
+      getExcelTemplate().then((res) => {
+        let a = document.createElement('a')
+        a.href = nginxPath + '/excelTemplate' + res.data.data.fileSuffix
+        a.click()
+      })
     }
+  },
+  created () {
+    this.getDataList()
+    this.getRoleSelectList()
+  },
+  mounted () {
+    // this.getDataList()
   }
+}
 </script>
 
 <style lang="less" scoped>