feat: 选人选组织组件 限制范围参数添加

src/components/Form/src/components/SelectDepartmentTreeV2.vue

@@ -14,6 +14,7 @@
 <script lang="ts" setup>
 import { ref, watch, onMounted } from 'vue';
 import { getDepartmentTrees } from '/@/api/system/department';
+import { useUserStore } from '/@/store/modules/user';
 const props = defineProps({
   multiple: {
     type: Boolean,
@@ -35,6 +36,10 @@ const props = defineProps({
     type: Boolean,
     default: false
   },
+  defaultDepts: { // 仅在登录用户公司范围内筛选
+      type: String,
+      default: ''
+  },
 });
 const emit = defineEmits(['change-value', 'query-completed', 'select']);
 const expandedKeys = ref([]);
@@ -46,7 +51,9 @@ const params = ref({
   id: '',
   code: '',
   name: '',
-  parentNode: false
+  parentNode: false,
+  excludeDeptTypes: props.justCompany ? '0' : '',
+  ids: props.defaultDepts
 })
 onMounted(() => {
   getList()
@@ -61,7 +68,9 @@ const loadData = (node) => {
       id: node.id,
       code: '',
       name: '',
-      parentNode: false
+      parentNode: false,
+      excludeDeptTypes: props.justCompany ? '0' : '',
+      ids: props.defaultDepts
     }
     let list = resetTreeList(await getDepartmentTrees(param))
     node.dataRef.children = list[0].children

src/components/Form/src/components/SelectDepartmentV2.vue

@@ -12,7 +12,7 @@
             <div class="choose-dep-box">
                 <div class="choose-dep">
                     <a-spin :spinning="loading" class="loading-box" />
-                    <SelectDepartmentTreeV2 v-if="visible" :multiple="multiple" :isArray="isArray" :parentNode="parentNode" :selectedNodes="selectedNodes" @changeValue="departChange" @queryCompleted="queryCompleted"></SelectDepartmentTreeV2>
+                    <SelectDepartmentTreeV2 v-if="visible" :multiple="multiple" :isArray="isArray" :parentNode="parentNode" :selectedNodes="selectedNodes" @changeValue="departChange" @queryCompleted="queryCompleted" :defaultDepts="defaultDepts"></SelectDepartmentTreeV2>
                 </div>
                 <div class="choosen-dep">
                     <div v-for="item in selectedNodes" class="choosen-item">
@@ -35,6 +35,7 @@
     import { getDepartmentTrees } from '/@/api/system/department';
     import { CloseOutlined } from '@ant-design/icons-vue';
     import { camelCaseString } from '/@/utils/stringUtil';
+    import { useUserStore } from '/@/store/modules/user';
 
     const visible = ref(false);
     const departNames = ref();
@@ -68,13 +69,26 @@
             default: {}
         },
         sepTextField: '', // 将文字描述存在独立字段，增加首次渲染速度
-        row: Object
+        row: Object,
+        onlyUserCompany: { // 仅在登录用户公司范围内筛选
+            type: Boolean,
+            default: false
+        },
+        defaultDeptField: { // 默认选择公司范围key值
+            type: String,
+            default: ''
+        },
     });
     const selectedNodes = ref([]);
     const loading = ref(true);
 
     // Embedded in the form, just use the hook binding to perform form verification
-
+    const defaultDepts = ref('')
+    if(props.onlyUserCompany) {
+        const userStore = useUserStore();
+        const userInfo = userStore.getUserInfo;
+        defaultDepts.value = userInfo.departmentId
+    }
     onMounted(() => {
     });
 
@@ -88,6 +102,9 @@
                 } else {
                     getDefaultList(ids);
                 }
+            } else {
+                departNames.value = ''
+                selectedNodes.value = []
             }
         },
         {
@@ -156,6 +173,9 @@
     function show() {
         visible.value = true;
         loading.value = true;
+        if(props.defaultDeptField) {
+            defaultDepts.value = props.row[props.defaultDeptField]
+        }
         if (props.value) {
             if(props.isArray && !props.value.length) {
                 return

src/components/Form/src/components/SelectUserListV2.vue

@@ -1,8 +1,11 @@
 <template>
 	<div class="user-select-list">
 		<div class="user-select-item" v-for="item in data" @click="selectItem(item)">
-			<div class="user-select-item-left">
+			<div class="user-select-item-left" v-if="showDep && item.departmentPathName">
-				{{ item.name }}
+				{{ `${item.name}（${item.departmentPathName}）` }}
+			</div>
+			<div class="user-select-item-left" v-else>	
+				{{ `${item.name}` }}
 			</div>
 			<div class="user-select-item-right">
 				<div class="select-circle" :class="item.selected ? 'selected' : ''" v-if="!viewList">
@@ -51,6 +54,10 @@ const props = defineProps({
 		type: Boolean,
 		default: false
 	},
+	showDep: {
+		type: Boolean,
+		default: false
+	},
 })
 function selectItem(item) {
 	emits('selectId', item.id)
@@ -92,6 +99,9 @@ function delItem(item) {
 		.user-select-item-left {
 			display: flex;
 			align-items: center;
+			overflow: hidden;  //超出隐藏
+			text-overflow: ellipsis; //文本超出时显示省略号
+			white-space: nowrap; //设置文本不换行
 		}
 
 		.user-select-item-right {

src/components/Form/src/components/SelectUserV2.vue

@@ -25,7 +25,7 @@
                         <div class="department-tree">
                             <a-spin :spinning="treeLoading" class="loading-box" />
                             <div class="department-tree-box">
-                                <SelectDepartmentTreeV2 v-if="visible && activeKey === 'department'" class="tree-select" @changeValue="departChange" @queryCompleted="departCompleted"></SelectDepartmentTreeV2>
+                                <SelectDepartmentTreeV2 v-if="visible && activeKey === 'department'" class="tree-select" @changeValue="departChange" @queryCompleted="departCompleted" :defaultDepts="defaultDepts"></SelectDepartmentTreeV2>
                             </div>
                         </div>
                         <div class="user-select-box">
@@ -36,7 +36,7 @@
                         </div>
                     </div>
                     <div v-show="activeKey === 'allPerson'" class="all-user-select-box">
-                        <SelectUserListV2 :multiple="multiple" :data="searchAllMemberList" @selectId="changeMemberSelect"></SelectUserListV2>
+                        <SelectUserListV2 :multiple="multiple" :data="searchAllMemberList" @selectId="changeMemberSelect" show-dep></SelectUserListV2>
                         <div v-if="searchAllMemberTotal > 25" class="all-user-select-pagination">
                             <a-form-item label="" name="pagination">
                                 <a-pagination
@@ -73,6 +73,7 @@
     import SelectDepartmentTreeV2 from '/@/components/Form/src/components/SelectDepartmentTreeV2.vue';
     import SelectUserListV2 from '/@/components/Form/src/components/SelectUserListV2.vue';
     import { camelCaseString } from '/@/utils/stringUtil';
+    import { useUserStore } from '/@/store/modules/user';
 
     const emits = defineEmits(['update:value', 'selectedId', 'change']);
     const { t } = useI18n();
@@ -101,14 +102,28 @@
         },
         row: Object, // 行数据，在表格里用的到
         sepTextField: String, // 将文本表示存储在独立字段
+        onlyUserCompany: { // 仅在登录用户公司范围内筛选
+            type: Boolean,
+            default: false
+        },
         buttonShow: {
             type: Boolean,
             default: false
-        }
+        },
+        defaultDeptField: { // 默认选择公司范围key值
+            type: String,
+            default: ''
+        },
     });
     let timeoutId = null;
     let resetMemberList = [];
     const searchPlaceholder = '请输入姓名或工号搜索';
+    const defaultDepts = ref('')
+    if(props.onlyUserCompany) {
+        const userStore = useUserStore();
+        const userInfo = userStore.getUserInfo;
+        defaultDepts.value = userInfo.departmentId
+    }
 
     function updateSepTextField(v) {
         if (!props.sepTextField || !props.row) {
@@ -150,7 +165,8 @@
         async () => {
             if (props.value && !valChanged.value && props.sepTextField) {
                 const idArr = props.value.split(',');
-                const valStr = props.row[camelCaseString(props.sepTextField)];
+                let valStr = props.row[camelCaseString(props.sepTextField)];
+                valStr = valStr ? valStr : idArr ? idArr.reduce((a, b) => a + ',' + b) : '';
                 const valArr = valStr.split(',');
                 userNames.value = valStr;
                 const initValue = idArr.map((id, index) => {
@@ -172,6 +188,10 @@
                 });
                 userNames.value = nameList.join(',');
             }
+            if(!props.value) {
+                userNames.value = ''
+                selectedMemberList.value = []
+            }
         },
         {
             immediate: true
@@ -180,7 +200,8 @@
     const searchDepartMemberParams = ref({
         limit: 1,
         size: 10000,
-        departmentId: ''
+        departmentId: '',
+        departmentIds: defaultDepts.value
     });
     const searchDepartMemberTotal = ref(0);
     const searchDepartMemberList = ref([]);
@@ -188,7 +209,8 @@
         limit: 1,
         size: 25,
         isSearchAll: true,
-        keyword: ''
+        keyword: '',
+        departmentIds: defaultDepts.value
     });
     const searchAllMemberTotal = ref(0);
     const searchAllMemberList = ref([]);
@@ -275,6 +297,10 @@
     }
 
     function show() {
+        if(props.defaultDeptField) {
+            defaultDepts.value = props.row[props.defaultDeptField]
+        }
+        if (props.disabled) return
         visible.value = true;
         treeLoading.value = true;
     }