Commit 40c92a9ea2269e9b34b305d9663419004aaa5dfa
1 parent
7d3c59af
perf: dept
Showing
4 changed files
with
42 additions
and
17 deletions
yudao-ui-admin-vue3/src/api/system/dept/types.ts
yudao-ui-admin-vue3/src/views/system/dept/dept.data.ts
| ... | ... | @@ -17,7 +17,7 @@ export const modelSchema = reactive<FormSchema[]>([ |
| 17 | 17 | }, |
| 18 | 18 | { |
| 19 | 19 | label: '负责人', |
| 20 | - field: 'email', | |
| 20 | + field: 'leaderUserId', | |
| 21 | 21 | component: 'Input' |
| 22 | 22 | }, |
| 23 | 23 | { |
| ... | ... | @@ -33,7 +33,7 @@ export const modelSchema = reactive<FormSchema[]>([ |
| 33 | 33 | { |
| 34 | 34 | label: '显示排序', |
| 35 | 35 | field: 'sort', |
| 36 | - component: 'Input' | |
| 36 | + component: 'InputNumber' | |
| 37 | 37 | }, |
| 38 | 38 | { |
| 39 | 39 | label: '状态', | ... | ... |
yudao-ui-admin-vue3/src/views/system/dept/index.vue
| 1 | 1 | <script setup lang="ts"> |
| 2 | 2 | import { useI18n } from '@/hooks/web/useI18n' |
| 3 | -import { ElInput, ElCard, ElTree, ElTreeSelect } from 'element-plus' | |
| 3 | +import { ElInput, ElCard, ElTree, ElTreeSelect, ElSelect, ElOption } from 'element-plus' | |
| 4 | 4 | import { handleTree } from '@/utils/tree' |
| 5 | 5 | import { onMounted, ref, unref, watch } from 'vue' |
| 6 | 6 | import * as DeptApi from '@/api/system/dept' |
| ... | ... | @@ -8,6 +8,7 @@ import { Form, FormExpose } from '@/components/Form' |
| 8 | 8 | import { modelSchema } from './dept.data' |
| 9 | 9 | import { DeptVO } from '@/api/system/dept/types' |
| 10 | 10 | import { useMessage } from '@/hooks/web/useMessage' |
| 11 | +import { getListSimpleUsersApi } from '@/api/system/user' | |
| 11 | 12 | const message = useMessage() |
| 12 | 13 | interface Tree { |
| 13 | 14 | id: number |
| ... | ... | @@ -34,7 +35,7 @@ const filterText = ref('') |
| 34 | 35 | const deptOptions = ref() // 树形结构 |
| 35 | 36 | const treeRef = ref<InstanceType<typeof ElTree>>() |
| 36 | 37 | const getTree = async () => { |
| 37 | - const res = await DeptApi.getDeptPageApi(null) | |
| 38 | + const res = await DeptApi.listSimpleDeptApi() | |
| 38 | 39 | deptOptions.value = handleTree(res) |
| 39 | 40 | } |
| 40 | 41 | const filterNode = (value: string, data: Tree) => { |
| ... | ... | @@ -44,6 +45,13 @@ const filterNode = (value: string, data: Tree) => { |
| 44 | 45 | watch(filterText, (val) => { |
| 45 | 46 | treeRef.value!.filter(val) |
| 46 | 47 | }) |
| 48 | +// 用户列表 | |
| 49 | +const userOption = ref() | |
| 50 | +const leaderUserId = ref() | |
| 51 | +const getUserList = async () => { | |
| 52 | + const res = await getListSimpleUsersApi() | |
| 53 | + userOption.value = res | |
| 54 | +} | |
| 47 | 55 | // 新增 |
| 48 | 56 | const handleAdd = (data: { id: number }) => { |
| 49 | 57 | // 重置表单 |
| ... | ... | @@ -54,11 +62,12 @@ const handleAdd = (data: { id: number }) => { |
| 54 | 62 | } |
| 55 | 63 | // 编辑 |
| 56 | 64 | const handleUpdate = async (data: { id: number }) => { |
| 57 | - showForm.value = true | |
| 58 | 65 | const res = await DeptApi.getDeptApi(data.id) |
| 59 | 66 | formTitle.value = '修改- ' + res?.name |
| 60 | 67 | deptParentId.value = res.parentId |
| 68 | + leaderUserId.value = res.leaderUserId | |
| 61 | 69 | unref(formRef)?.setValues(res) |
| 70 | + showForm.value = true | |
| 62 | 71 | } |
| 63 | 72 | // 删除 |
| 64 | 73 | const handleDelete = async (data: { id: number }) => { |
| ... | ... | @@ -78,7 +87,7 @@ const submitForm = async () => { |
| 78 | 87 | try { |
| 79 | 88 | const data = unref(formRef)?.formModel as DeptVO |
| 80 | 89 | data.parentId = deptParentId.value |
| 81 | - // TODO: 表单提交待完善 | |
| 90 | + data.leaderUserId = leaderUserId.value | |
| 82 | 91 | if (formTitle.value.startsWith('新增')) { |
| 83 | 92 | await DeptApi.createDeptApi(data) |
| 84 | 93 | } else if (formTitle.value.startsWith('修改')) { |
| ... | ... | @@ -92,6 +101,7 @@ const submitForm = async () => { |
| 92 | 101 | } |
| 93 | 102 | onMounted(async () => { |
| 94 | 103 | await getTree() |
| 104 | + await getUserList() | |
| 95 | 105 | }) |
| 96 | 106 | </script> |
| 97 | 107 | <template> |
| ... | ... | @@ -159,6 +169,16 @@ onMounted(async () => { |
| 159 | 169 | check-strictly |
| 160 | 170 | /> |
| 161 | 171 | </template> |
| 172 | + <template #leaderUserId> | |
| 173 | + <el-select v-model="leaderUserId"> | |
| 174 | + <el-option | |
| 175 | + v-for="item in userOption" | |
| 176 | + :key="parseInt(item.id)" | |
| 177 | + :label="item.nickname" | |
| 178 | + :value="parseInt(item.id)" | |
| 179 | + /> | |
| 180 | + </el-select> | |
| 181 | + </template> | |
| 162 | 182 | </Form> |
| 163 | 183 | <!-- 操作按钮 --> |
| 164 | 184 | <el-button | ... | ... |
yudao-ui-admin-vue3/src/views/system/user/index.vue
| ... | ... | @@ -9,6 +9,7 @@ import { |
| 9 | 9 | ElTreeSelect, |
| 10 | 10 | ElSelect, |
| 11 | 11 | ElOption, |
| 12 | + ElTransfer, | |
| 12 | 13 | ElForm, |
| 13 | 14 | ElFormItem, |
| 14 | 15 | ElUpload, |
| ... | ... | @@ -482,7 +483,7 @@ getList() |
| 482 | 483 | </template> |
| 483 | 484 | </Dialog> |
| 484 | 485 | <!-- 分配用户角色 --> |
| 485 | - <Dialog v-model="roleDialogVisible" title="分配角色"> | |
| 486 | + <Dialog v-model="roleDialogVisible" title="分配角色" maxHeight="450px"> | |
| 486 | 487 | <el-form :model="userRole" label-width="80px"> |
| 487 | 488 | <el-form-item label="用户名称"> |
| 488 | 489 | <el-input v-model="userRole.username" :disabled="true" /> |
| ... | ... | @@ -491,14 +492,15 @@ getList() |
| 491 | 492 | <el-input v-model="userRole.nickname" :disabled="true" /> |
| 492 | 493 | </el-form-item> |
| 493 | 494 | <el-form-item label="角色"> |
| 494 | - <el-select v-model="userRole.roleIds" multiple> | |
| 495 | - <el-option | |
| 496 | - v-for="item in roleOptions" | |
| 497 | - :key="parseInt(item.id)" | |
| 498 | - :label="item.name" | |
| 499 | - :value="parseInt(item.id)" | |
| 500 | - /> | |
| 501 | - </el-select> | |
| 495 | + <el-transfer | |
| 496 | + v-model="userRole.roleIds" | |
| 497 | + :titles="['角色列表', '已选择']" | |
| 498 | + :props="{ | |
| 499 | + key: 'id', | |
| 500 | + label: 'name' | |
| 501 | + }" | |
| 502 | + :data="roleOptions" | |
| 503 | + /> | |
| 502 | 504 | </el-form-item> |
| 503 | 505 | </el-form> |
| 504 | 506 | <!-- 操作按钮 --> | ... | ... |