功能调整

src/components/GroupSelector/index.vue

@@ -1,37 +1,46 @@
 <script lang="ts" setup name="GroupSelector">
-import { getGroupCatByList } from '@/api/system/groupCatApi'
+import { getGroupByList } from '@/api/system/groupApi'
+import { packageTreeData } from '@/utils/tool'
+
 const emit = defineEmits(['update:modelValue'])
-interface Group {
-  groupCatId: number
-  groupCatTitle: number
+interface TreeNode {
+  label: string
+  groupId: number
+  children?: TreeNode[]
 }
+
 const state = reactive({
   loading: false,
-  groupCatId: 0,
-  dataList: [] as Group[],
+  groupId: 0,
+  dataList: [] as TreeNode[],
 })
 
 const getData = async () => {
   state.loading = true
-  const { data } = await getGroupCatByList()
-  state.loading = false
-  state.dataList = data
-}
-const onChange = () => {
-  emit('update:modelValue', state.groupCatId)
+  const { data } = await getGroupByList()
+
+  state.dataList = packageTreeData({
+    data,
+    id: 'groupId',
+  })
 }
+
+watch(() => state.groupId, (newValue) => {
+  emit('update:modelValue', newValue)
+})
+
 onMounted(() => {
   getData ()
 })
 </script>
 
 <template>
-  <el-select v-model="state.groupCatId" v-loading="state.loading" style="width: 100%" filterable placeholder="请选择部门类别" value-key="groupCatId" @change="onChange">
-    <el-option
-      v-for="item in state.dataList"
-      :key="item.groupCatId"
-      :label="item.groupCatTitle"
-      :value="item.groupCatId"
-    />
-  </el-select>
+  <el-tree-select
+    v-model="state.groupId"
+    :data="state.dataList"
+    style="width: 100%"
+    filterable
+    placeholder="请选择部门"
+    :render-after-expand="false"
+  />
 </template>

src/components/PositionSelector/index.vue

@@ -1,24 +1,24 @@
 <script lang="ts" setup name="PositionSelector">
-import { getGroupCatByList } from '@/api/system/groupCatApi'
+import { getPositionByList } from '@/api/system/positionApi'
 const emit = defineEmits(['update:modelValue'])
-interface Group {
-  groupCatId: number
-  groupCatTitle: number
+interface Position {
+  positionId: number
+  positionName: string
 }
 const state = reactive({
   loading: false,
-  groupCatId: 0,
-  dataList: [] as Group[],
+  positionId: 0,
+  dataList: [] as Position[],
 })
 
 const getData = async () => {
   state.loading = true
-  const { data } = await getGroupCatByList()
+  const { data } = await getPositionByList({})
   state.loading = false
   state.dataList = data
 }
 const onChange = () => {
-  emit('update:modelValue', state.groupCatId)
+  emit('update:modelValue', state.positionId)
 }
 onMounted(() => {
   getData ()
@@ -26,12 +26,12 @@ onMounted(() => {
 </script>
 
 <template>
-  <el-select v-model="state.groupCatId" v-loading="state.loading" style="width: 100%" filterable placeholder="请选择部门类别" value-key="groupCatId" @change="onChange">
+  <el-select v-model="state.positionId" v-loading="state.loading" style="width: 100%" filterable placeholder="请选择部门类别" value-key="positionId" @change="onChange">
     <el-option
       v-for="item in state.dataList"
-      :key="item.groupCatId"
-      :label="item.groupCatTitle"
-      :value="item.groupCatId"
+      :key="item.positionId"
+      :label="item.positionName"
+      :value="item.positionId"
     />
   </el-select>
 </template>

src/views/system/group/components/User.vue

@@ -148,7 +148,7 @@ defineExpose({
             <el-input v-model="state.formData.accountStaffNo" max="11" placeholder="输入工号" />
           </el-form-item>
 
-          <el-form-item v-show="state.viewData.isFixed !== 1" label="岗位" prop="positionId">
+          <el-form-item v-show="state.formData.isFixed !== 1" label="岗位" prop="positionId">
             <position-selector v-model="state.formData.positionId" />
           </el-form-item>