|  |  |  | 
|---|
|  |  |  | <div class="container"> | 
|---|
|  |  |  | <authheader :items="menuTips"></authheader> | 
|---|
|  |  |  | <a-card ref="account" class="general-card"> | 
|---|
|  |  |  | <a-row> | 
|---|
|  |  |  | <div class="table-page-search-wrapper"> | 
|---|
|  |  |  | <div class="search-wrapper"> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <a-input | 
|---|
|  |  |  | v-model="formModel.name" | 
|---|
|  |  |  | :style="{ width: '320px' }" | 
|---|
|  |  |  | :placeholder="$t('请输入')" | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <a-button | 
|---|
|  |  |  | type="primary" | 
|---|
|  |  |  | @click="search" | 
|---|
|  |  |  | style="margin-right: 20px; margin-left: 10px" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <template #icon> | 
|---|
|  |  |  | <icon-search /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | {{ $t('searchTable.form.search') }} | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | <a-button @click="reset"> | 
|---|
|  |  |  | <template #icon> | 
|---|
|  |  |  | <icon-refresh /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | {{ $t('searchTable.form.reset') }} | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <div class="search-wrapper"> | 
|---|
|  |  |  | <div> | 
|---|
|  |  |  | <a-space> | 
|---|
|  |  |  | <a-button type="primary" :align="'right'" @click="operation(0)" | 
|---|
|  |  |  | >+ 新建账户</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | </a-space></div | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <div class="wrapper-icon"> | 
|---|
|  |  |  | <a-tooltip :content="$t('searchTable.actions.refresh')"> | 
|---|
|  |  |  | <div class="action-icon" @click="search"> | 
|---|
|  |  |  | <icon-refresh size="18" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </a-tooltip> | 
|---|
|  |  |  | <a-dropdown @select="handleSelectDensity"> | 
|---|
|  |  |  | <a-tooltip :content="$t('searchTable.actions.density')"> | 
|---|
|  |  |  | <div class="action-icon"> | 
|---|
|  |  |  | <icon-line-height size="18" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </a-tooltip> | 
|---|
|  |  |  | <template #content> | 
|---|
|  |  |  | <a-doption | 
|---|
|  |  |  | v-for="item in densityList" | 
|---|
|  |  |  | :key="item.value" | 
|---|
|  |  |  | :value="item.value" | 
|---|
|  |  |  | :class="{ active: item.value === size }" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <span>{{ item.name }}</span> | 
|---|
|  |  |  | </a-doption> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </a-dropdown> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | <!-- <a-row> | 
|---|
|  |  |  | <a-col :flex="2"></a-col> | 
|---|
|  |  |  | <a-col :flex="1"> | 
|---|
|  |  |  | <a-form :model="formModel"  style="margin-top: 30px"> | 
|---|
|  |  |  | <a-form :model="formModel" style="margin-top: 30px"> | 
|---|
|  |  |  | <a-form-item field="name"> | 
|---|
|  |  |  | <a-input | 
|---|
|  |  |  | v-model="formModel.name" | 
|---|
|  |  |  | 
|---|
|  |  |  | </a-form-item> | 
|---|
|  |  |  | </a-form> | 
|---|
|  |  |  | </a-col> | 
|---|
|  |  |  | <a-col :flex="'200px'" style="text-align: right;margin-top: 30px"> | 
|---|
|  |  |  | <a-button @click="reset" style="margin-right: 20px"> | 
|---|
|  |  |  | <template #icon> | 
|---|
|  |  |  | <icon-refresh /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | {{ $t('searchTable.form.reset') }} | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | <a-button type="primary" @click="search"> | 
|---|
|  |  |  | <a-col :flex="'200px'" style="text-align: right; margin-top: 30px"> | 
|---|
|  |  |  | <a-button type="primary" @click="search" style="margin-right: 20px"> | 
|---|
|  |  |  | <template #icon> | 
|---|
|  |  |  | <icon-search /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | {{ $t('searchTable.form.search') }} | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | <a-button @click="reset"> | 
|---|
|  |  |  | <template #icon> | 
|---|
|  |  |  | <icon-refresh /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | {{ $t('searchTable.form.reset') }} | 
|---|
|  |  |  | </a-button> | 
|---|
|  |  |  | </a-col> | 
|---|
|  |  |  | </a-row> | 
|---|
|  |  |  | <a-divider style="margin-top: 0" /> | 
|---|
|  |  |  | </a-row> --> | 
|---|
|  |  |  | <!-- <a-divider style="margin-top: 0" /> | 
|---|
|  |  |  | <a-row style="margin-bottom: 16px"> | 
|---|
|  |  |  | <a-col :span="12"> | 
|---|
|  |  |  | <a-space> | 
|---|
|  |  |  | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </a-dropdown> | 
|---|
|  |  |  | </a-col> | 
|---|
|  |  |  | </a-row> | 
|---|
|  |  |  | </a-row> --> | 
|---|
|  |  |  | <a-table | 
|---|
|  |  |  | row-key="id" | 
|---|
|  |  |  | :loading="loading" | 
|---|
|  |  |  | 
|---|
|  |  |  | /> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <template #operations="{ record }"> | 
|---|
|  |  |  | <a-button type="outline" @click="operation(1, record)" | 
|---|
|  |  |  | >重置密码</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button type="outline" @click="operation(2, record)">编辑</a-button> | 
|---|
|  |  |  | <a-popconfirm | 
|---|
|  |  |  | content="Are you sure you want to delete?" | 
|---|
|  |  |  | type="success" | 
|---|
|  |  |  | @ok="operation(3, record)" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button type="outline">删除</a-button> | 
|---|
|  |  |  | </a-popconfirm> | 
|---|
|  |  |  | <a-button type="outline" @click="operation(4, record)" | 
|---|
|  |  |  | >权限配置</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button type="outline" @click="operation(5, record)" | 
|---|
|  |  |  | >部门配置</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-space> | 
|---|
|  |  |  | <a-button | 
|---|
|  |  |  | type="outline" | 
|---|
|  |  |  | status="success" | 
|---|
|  |  |  | @click="operation(1, record)" | 
|---|
|  |  |  | >重置密码</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button type="outline" @click="operation(2, record)" | 
|---|
|  |  |  | >编辑</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-popconfirm | 
|---|
|  |  |  | content="Are you sure you want to delete?" | 
|---|
|  |  |  | type="success" | 
|---|
|  |  |  | @ok="operation(3, record)" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button type="outline" status="danger">删除</a-button> | 
|---|
|  |  |  | </a-popconfirm> | 
|---|
|  |  |  | <a-button | 
|---|
|  |  |  | type="dashed" | 
|---|
|  |  |  | status="warning" | 
|---|
|  |  |  | @click="operation(4, record)" | 
|---|
|  |  |  | >权限配置</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <a-button status="success" @click="operation(5, record)" | 
|---|
|  |  |  | >部门配置</a-button | 
|---|
|  |  |  | > | 
|---|
|  |  |  | </a-space> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | </a-table> | 
|---|
|  |  |  | </a-card> | 
|---|
|  |  |  | 
|---|
|  |  |  | let editform = ref<User>({ | 
|---|
|  |  |  | createTime: '', | 
|---|
|  |  |  | dept: undefined, | 
|---|
|  |  |  | deptName: '', | 
|---|
|  |  |  | email: '', | 
|---|
|  |  |  | nickName: '', | 
|---|
|  |  |  | phoneNumber: '', | 
|---|
|  |  |  | 
|---|
|  |  |  | slotName: 'index', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: t('用户名'), | 
|---|
|  |  |  | dataIndex: 'userName', | 
|---|
|  |  |  | title: t('登录名'), | 
|---|
|  |  |  | dataIndex: 'email', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: t('创建时间'), | 
|---|
|  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: t('所属部门'), | 
|---|
|  |  |  | dataIndex: 'dept', | 
|---|
|  |  |  | slotName: 'dept', | 
|---|
|  |  |  | dataIndex: 'deptName', | 
|---|
|  |  |  | slotName: 'deptName', | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | { | 
|---|
|  |  |  | title: t('状态'), | 
|---|
|  |  |  | 
|---|
|  |  |  | //删除 | 
|---|
|  |  |  | if (t == 3) { | 
|---|
|  |  |  | await UserDelete(record.userId).then((res) => { | 
|---|
|  |  |  | if (res.code == 20000) { | 
|---|
|  |  |  | if (res.code == 200) { | 
|---|
|  |  |  | fetchData(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | 
|---|
|  |  |  | checkStrictlyDialog.value = []; | 
|---|
|  |  |  | checkedKeysDialog.value = []; | 
|---|
|  |  |  | selectUser.value = record; | 
|---|
|  |  |  | record.resources.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyMenu.value.push({ | 
|---|
|  |  |  | menuId: val.menuId, | 
|---|
|  |  |  | menuName: val.menuName, | 
|---|
|  |  |  | if (record.resources) { | 
|---|
|  |  |  | record.resources.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyMenu.value.push({ | 
|---|
|  |  |  | menuId: val.menuId, | 
|---|
|  |  |  | menuName: val.menuName, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysMenu.value.push(val.menuId); | 
|---|
|  |  |  | expandKdysMenu.value.push(val.menuId); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysMenu.value.push(val.menuId); | 
|---|
|  |  |  | expandKdysMenu.value.push(val.menuId); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | record.knowledges.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyKnowledge.value.push({ | 
|---|
|  |  |  | knowledgeId: val.id, | 
|---|
|  |  |  | knowledgeName: val.name, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (record.knowledges) { | 
|---|
|  |  |  | record.knowledges.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyKnowledge.value.push({ | 
|---|
|  |  |  | knowledgeId: val.id, | 
|---|
|  |  |  | knowledgeName: val.name, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysKnowledge.value.push(val.id); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysKnowledge.value.push(val.id); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | record.dialogs.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyDialog.value.push({ | 
|---|
|  |  |  | dialogId: val.id, | 
|---|
|  |  |  | dialogName: val.name, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (record.dialogs) { | 
|---|
|  |  |  | record.dialogs.forEach((val) => { | 
|---|
|  |  |  | checkStrictlyDialog.value.push({ | 
|---|
|  |  |  | dialogId: val.id, | 
|---|
|  |  |  | dialogName: val.name, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysDialog.value.push(val.id); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeysDialog.value.push(val.id); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | //机构 | 
|---|
|  |  |  | if (t == 5) { | 
|---|
|  |  |  | 
|---|
|  |  |  | checkStrictly.value = []; | 
|---|
|  |  |  | selectUser.value = record; | 
|---|
|  |  |  | expandKdys.value.push('0'); | 
|---|
|  |  |  | record.dept.forEach((val) => { | 
|---|
|  |  |  | checkStrictly.value.push({ | 
|---|
|  |  |  | deptId: val.deptId, | 
|---|
|  |  |  | deptName: val.deptName, | 
|---|
|  |  |  | if (record.dept) { | 
|---|
|  |  |  | record.dept.forEach((val) => { | 
|---|
|  |  |  | checkStrictly.value.push({ | 
|---|
|  |  |  | deptId: val.deptId, | 
|---|
|  |  |  | deptName: val.deptName, | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeys.value.push(val.deptId); | 
|---|
|  |  |  | expandKdys.value.push(val.deptId); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | checkedKeys.value.push(val.deptId); | 
|---|
|  |  |  | expandKdys.value.push(val.deptId); | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | setLoading(true); | 
|---|
|  |  |  | try { | 
|---|
|  |  |  | await UserList(params).then((res) => { | 
|---|
|  |  |  | for (const user of res.rows) { | 
|---|
|  |  |  | if (user.dept) { | 
|---|
|  |  |  | for (const d of user.dept) { | 
|---|
|  |  |  | if (user.deptName) { | 
|---|
|  |  |  | user.deptName += d.deptName + ','; | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | user.deptName = d.deptName + ','; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | renderData.value = res.rows; | 
|---|
|  |  |  | console.log(renderData); | 
|---|
|  |  |  | pagination.current = params.current; | 
|---|
|  |  |  | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <style scoped> | 
|---|
|  |  |  | <style scoped lang="less"> | 
|---|
|  |  |  | .card-demo { | 
|---|
|  |  |  | width: 460px; | 
|---|
|  |  |  | margin-left: 24px; | 
|---|
|  |  |  | 
|---|
|  |  |  | .card-demo:hover { | 
|---|
|  |  |  | transform: translateY(-4px); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .table-page-search-wrapper { | 
|---|
|  |  |  | padding-top: 20px; | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | justify-content: space-between; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | margin-bottom: 20px; | 
|---|
|  |  |  | padding-bottom: 20px; | 
|---|
|  |  |  | border-bottom: 1px solid #e8e8e8; | 
|---|
|  |  |  | .search-wrapper { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | .wrapper-icon { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | margin-left: 40px; | 
|---|
|  |  |  | // margin-right: 40px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <style lang="less"> | 
|---|
|  |  |  | .ant-table-wrapper { | 
|---|
|  |  |  | .ant-table-tbody { | 
|---|
|  |  |  | tr { | 
|---|
|  |  |  | td { | 
|---|
|  |  |  | .ant-table-row-cell-break-word { | 
|---|
|  |  |  | .ant-table-column-sorter { | 
|---|
|  |  |  | display: none; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .search-wrapper { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | .wrapper-icon { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | align-items: center; | 
|---|
|  |  |  | margin-left: 40px; | 
|---|
|  |  |  | // margin-right: 40px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <style lang="less"> | 
|---|
|  |  |  | .ant-table-wrapper { | 
|---|
|  |  |  | .ant-table-tbody { | 
|---|
|  |  |  | tr { | 
|---|
|  |  |  | td { | 
|---|
|  |  |  | .ant-table-row-cell-break-word { | 
|---|
|  |  |  | .ant-table-column-sorter { | 
|---|
|  |  |  | display: none; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  | <style lang="less" scoped> | 
|---|
|  |  |  | .table-page-search-wrapper { | 
|---|
|  |  |  | .ant-form-inline { | 
|---|
|  |  |  | :deep(.ant-form-item) { | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|