| | |
| | | <template> |
| | | <div class="container"> |
| | | <authheader :items="menuTips"></authheader> |
| | | <a-card ref="account" class="general-card" :title="$t('menu.user.title')"> |
| | | <a-row> |
| | | <a-card ref="account" class="general-card"> |
| | | <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"> |
| | | <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-divider style="height: 40px" direction="vertical" /> |
| | | <a-col :flex="'200px'" style="text-align: right"> |
| | | <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: '', |
| | |
| | | |
| | | const basePagination: Pagination = { |
| | | current: 1, |
| | | pageSize: 20, |
| | | pageSize: 15, |
| | | }; |
| | | const pagination = reactive({ |
| | | ...basePagination, |
| | |
| | | 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: 10px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | margin-bottom: 20px; |
| | | padding-bottom: 10px; |
| | | 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> |