@sy-common/organize-select-help 1.0.0-beta.10 → 1.0.0-beta.14

package/src/index.vue

@@ -1,34 +1,51 @@
 <template>
   <Modal
-    title=""
-    v-model="modal"
-    @on-ok="confirm"
-    @on-visible-change="visibleChange	"
-    width="1180"
-    :mask-closable="false"
-    class="modal-tree"
+      title=""
+      v-model="modal"
+      @on-ok="confirm"
+      @on-visible-change="visibleChange	"
+      width="1180"
+      :mask-closable="false"
+      class="modal-tree"
   >
     <div slot="header" class="header-text"><Icon type="md-information" class="icon-tip" />人员选择</div>
     <div class="content-container">
       <div class="tree-orig">
         <div class="tab-content">
-          <Tabs :value="tabName">
-            <TabPane label="选择组织节点" name="org">
+          <Tabs :value="tabName"  @input="handleTabChange">
+            <TabPane label="组织选择" name="org" v-if="name.includes('org')">
               <div class="tab">
-                <Select v-model="orgSearch" filterable :remote-method="getOrgListBySearch" @on-change="getOrgOption" :loading="loadingOrg" placeholder="选择组织节点" clearable>
-                    <Option v-for="(option, index) in orgSearchList" :value="option.orgUnitId" :key="index">{{option.name}}</Option>
+                <span>组织搜索：</span>
+                <Select v-model="orgSearch" filterable :remote-method="getOrgListBySearch" @on-change="getOrgOption" :loading="loadingOrg" placeholder="请输入组织名称" style="width: 600px;" clearable>
+                  <Option v-for="(option, index) in orgSearchList" :value="option.orgUnitId" :key="index">{{option.name}}</Option>
                 </Select>
-                <div class="tag-content">
+                <div class="tag-content" v-if="isQuickOpen && orgTagList.length > 0">
                   <span>快捷选择：</span>
-                  <div class="tag-list">
-                    <span :class="['tag', item.checked && 'active']" v-for="item in tagList" :key="item.key" @click="fastChedkOrg(item)">{{item.v}}</span>
+                  <div class="custom-select-wrapper">
+                    <Select
+                        v-model="selectedOrgTagKey"
+                        placeholder="请选择快捷标签"
+                        transfer
+                        clearable
+                        @on-change="handleOrgTagSelect"
+                        @on-clear="handleOrgTagClear"
+                        style="width: 600px;"
+                        :disabled="!orgTagList.length"
+                    >
+                      <Option
+                          v-for="item in orgTagList"
+                          :value="item.quickPickKey"
+                          :key="item.quickPickKey"
+                          :class="{ 'active-option': item.checked }"
+                      >
+                        {{ item.quickPickName }}
+                      </Option>
+                      <!-- 无数据提示 -->
+                      <Option value="" v-if="!postTagList.length" disabled>
+                        暂无快捷标签
+                      </Option>
+                    </Select>
                   </div>
-                  <Poptip content="content" placement="right-end">
-                    <div slot="content" class="pop-content">
-                      <span :class="['tag', item.checked && 'active']" v-for="item in tagList" :key="item.key" @click="fastChedkOrg(item)">{{item.v}}</span>
-                    </div>
-                        <Icon type="ios-arrow-down" />
-                  </Poptip>
                 </div>
                 <div class="tree">
                   <organizeTree @handleChange="getOrgList" ref="orgTree" :treeList="orgTree"></organizeTree>
@@ -43,23 +60,43 @@
                 </div>
               </div>
             </TabPane>
-            <TabPane label="选择岗位" name="post">
+            <TabPane label="岗位选择" name="post" v-if="name.includes('post')">
               <div class="tab post">
                 <div class="left">
-                  <div v-for="item in positiontList" :class="[item.checked&&'active']" :key="item.positionId" @click="getPosionId(item)">{{ item.positionName }}</div>
+                  <div v-for="item in positiontList" :class="[selectedPositionId === item.positionId ? 'active' : '']" :key="item.positionId" @click="getPosionId(item)">{{ item.positionName }}</div>
                 </div>
                 <div class="right">
-                  <Select v-model="postSearch" filterable :remote-method="getPostListBySearch" @on-change="getPostOption" placeholder="选择组织节点" :loading="loadingPost" clearable>
-                      <Option v-for="(option, index) in postSearchList" :value="option.orgUnitId" :key="index">{{option.name}}</Option>
+                  <span>组织搜索：</span>
+                  <Select v-model="postSearch" filterable :remote-method="getPostListBySearch" @on-change="getPostOption" placeholder="组织选择" :loading="loadingPost" clearable @on-clear="handlePostSearchClear" style="width: 365px;">
+                    <Option v-for="(option, index) in postSearchList" :value="option.orgUnitId" :key="index">{{option.name}}</Option>
                   </Select>
-                  <div class="tag-content">
+                  <div class="tag-content" v-if="isQuickOpen && postTagList.length > 0">
                     <span>快捷选择：</span>
-                    <div class="tag-list">
-                      <span class="tag" v-for="item in tagList" :key="item.key">{{item.v}}</span>
+                    <div class="custom-select-wrapper">
+                      <Select
+                          v-model="selectedPostTagKey"
+                          placeholder="请选择快捷标签"
+                          transfer
+                          clearable
+                          @on-change="handlePostTagSelect"
+                          @on-clear="handlePostTagClear"
+                      style="width: 365px;"
+                      :disabled="!postTagList.length"
+                      >
+                      <Option
+                          v-for="item in postTagList"
+                          :value="item.quickPickKey"
+                          :key="item.quickPickKey"
+                          :class="{ 'active-option': item.checked }"
+                      >
+                        {{ item.quickPickName }}
+                      </Option>
+                      <!-- 无数据提示 -->
+                      <Option value="" v-if="!postTagList.length" disabled>
+                        暂无快捷标签
+                      </Option>
+                      </Select>
                     </div>
-                    <Poptip title="Title" content="content">
-                        <Icon type="ios-arrow-down" />
-                    </Poptip>
                   </div>
                   <div class="tree">
                     <organizeTree @handleChange="getPostList" ref="postTree" :treeList="postTree"></organizeTree>
@@ -75,36 +112,40 @@
                 </div>
               </div>
             </TabPane>
-            <TabPane label="选择人员" name="staff">
+            <TabPane label="选择人员" name="staff" v-if="name.includes('staff')">
               <div class="tab">
-                <Input v-model="staffSearch"	 @on-enter="searchStaff" @on-search="searchStaff"	search	placeholder="搜索人员"/>
+                <Input v-model="staffSearch" @on-enter="searchStaff" @on-search="searchStaff" search placeholder="搜索人员"/>
                 <div style="position:relative;">
                   <div class="tree staff-content" @scroll="handleScroll">
-                    <div :class="['gust-item',item.checked && 'staff-active']" v-for="item in staffAllList" :key="item.id"  @click="handlestaff(item)">
-                      <div class="left-panel">{{item.name && item.name.slice(0,1) || ''}}</div>
-                      <div class="right-panel">
-                        <p>{{item.name}}</p>
-                        <p>{{item.orgNodeName}}</p>
-                      </div>
-                      <div class="checked-icon" v-show="item.checked">✔</div>
+                    <!-- 关键修改：用“index + 下划线 + item.id”做key，确保唯一且不影响数据 -->
+                    <div :class="['gust-item',item.checked && 'staff-active']"
+                         v-for="(item, index) in staffAllList"
+                         :key="`staff_${index}_${item.id}`"
+                    @click="handlestaff(item)">
+                    <div class="left-panel">{{item.name && item.name.slice(0,1) || ''}}</div>
+                    <div class="right-panel">
+                      <p>{{item.name}}</p>
+                      <p>{{item.orgNodeName || item.orgUnitName}}</p>
                     </div>
-                    <p v-if="staffEnding" style="color:#CCCCCC;text-align: center">---我也是有底线的---</p>
+                    <div class="checked-icon" v-show="item.checked">✔</div>
                   </div>
-                  <Spin v-if="loadingStaff" size="large" fix />
-                </div>
-                <div class="bottom-select">
-                  <div>当前已选择 <span class="num">{{getCheckedStaff}}</span>人</div>
-                  <Button type="primary" icon="md-add" @click="addStaffList">添加人员</Button>
+                  <p v-if="staffEnding" style="color:#CCCCCC;text-align: center">---我也是有底线的---</p>
                 </div>
+                <Spin v-if="loadingStaff" size="large" fix />
               </div>
-            </TabPane>
+              <div class="bottom-select">
+                <div>当前已选择 <span class="num">{{getCheckedStaff}}</span>人</div>
+                <Button type="primary" icon="md-add" @click="addStaffList">添加人员</Button>
+              </div>
+        </div>
+        </TabPane>
           </Tabs>
         </div>
         <div class="form-content">
-          <p>已选择条件 <span class="num">（{{getCheckTypenum}}）</span></p>
+          <p v-if="name.length > 1">已选择条件 <span class="num">（{{getCheckTypenum}}）</span></p>
           <div class="node-list">
             <!--              组织节点条件：-->
-            <div>
+            <div v-if="name.includes('org')">
               <div class="group-box flex-r-bt">
                 <div>组织节点条件：</div>
                 <div class="clear-btn" @click="clearGroup">清除全部</div>
@@ -118,7 +159,7 @@
               </div>
             </div>
             <!--              组织节点+岗位条件：//-->
-            <div>
+            <div v-if="name.includes('post')">
               <div class="group-box flex-r-bt">
                 <div>岗位条件+组织节点：</div>
                 <div class="clear-btn" @click="clearPost">清除全部</div>
@@ -132,7 +173,7 @@
               </div>
             </div>
             <!--              直接选择人员：-->
-            <div>
+            <div v-if="name.includes('staff')">
               <div class="group-box flex-r-bt">
                 <div>直接选择人员：</div>
                 <div class="clear-btn" @click="clearStaff">清除全部</div>
@@ -152,11 +193,9 @@
   </Modal>
 </template>
 <script>
-import { Icon } from '@lambo-design/core'
 import organizeTree from './organize-tree.vue'
 import { deepCopy } from '@lambo-design/core/src/utils/assist'
 import ajax from '@lambo-design/shared/utils/ajax'
-import { debounce } from '@sy-common/core/src/utils/assits'
 export default {
   components: { organizeTree },
   props: {
@@ -166,17 +205,21 @@ export default {
     },
     data:{
       type:Object,
-      default:{}
+      default:()=>{}
     },
     name:{
-      value:String,
-      default:"org"
+      type:Array ,
+      default(){return ['org','post','staff']}
+    },
+    isQuickOpen:{
+      type: Boolean,
+      default: false
     }
   },
   data(){
     return {
-      tabName:this.name,
-      modal:false,
+      tabName:this.name[0],
+      modal:true,
       dialogOpen:false,
       orgSearch:'',
       //组织--right-form
@@ -203,38 +246,109 @@ export default {
       lastLoadingTime:0,
       offset:0,
       staffEnding:false,
-      tagList:[{
-        v:'所选市公司所有部门',
-        checked:false,
-        key:'07'
-      },{
-        v:'所有市公司',
-        checked:false,
-        key:'08'
-      },{
-        v:'所有市公司',
-        checked:false,
-        key:'9'
-      },{
-        v:'所有市公司',
-        checked:false,
-        key:'10'
-      },{
-        v:'所有市公司',
-        checked:false,
-        key:'11'
-      },{
-        v:'所有市公司',
-        checked:false,
-        key:'12'
-      }],
+      parentOrgList: [],
+      orgTagList:[],
+      postTagList:[],
+      selectedPositionId: null, // 新增：岗位单选的选中状态存储
+      selectedOrgTagKey: '', // 存储选中标签的唯一标识
+      selectedPostTagKey: '', // 存储选中标签的唯一标识
     }
   },
   mounted() {
+    this.queryTagList()
     this.queryPositionList()
     this.loadMore()
   },
   methods:{
+    handlePostTagSelect(quickPickKey) {
+      // 清空暂存列表
+      this.proPostList = [];
+      // 找到选中的标签对象
+      const selectedItem = this.postTagList.find(
+          item => item.quickPickKey === quickPickKey
+      );
+
+      if (selectedItem) {
+        // 重置其他标签的选中状态
+        this.postTagList.forEach(tag => tag.checked = false);
+        // 触发原有的处理方法
+        this.fastChedkPost(selectedItem);
+        // 清空搜索框绑定的值
+        this.postSearch = '';
+        // 清空搜索结果列表
+        this.postSearchList = [];
+      }
+    },
+    handleOrgTagSelect(quickPickKey) {
+      // 清空暂存列表
+      this.proOrgList = [];
+      // 找到选中的标签对象
+      const selectedItem = this.orgTagList.find(
+          item => item.quickPickKey === quickPickKey
+      );
+
+      if (selectedItem) {
+        // 重置其他标签的选中状态
+        this.orgTagList.forEach(tag => tag.checked = false);
+        // 触发原有的处理方法
+        this.fastChedkOrg(selectedItem);
+        // 清空搜索框绑定的值
+        this.orgSearch = '';
+        // 清空搜索结果列表
+        this.orgSearchList = [];
+      }
+    },
+    handleOrgTagClear() {
+      this.selectedOrgTagKey = '';
+      // 重置所有标签的选中状态
+      this.orgTagList.forEach(tag => {
+        tag.checked = false;
+      });
+
+      // 3. 清空树选择状态和暂存列表
+      if (this.$refs.orgTree && this.orgSearchList) {
+        this.$refs.orgTree.initData();
+      }
+      // 4. 可选：添加清空提示
+      this.$Message.info("已清空快捷标签选择");
+    },
+    // 修正清空逻辑方法（与事件名称对应）
+    handlePostTagClear() {
+      // 1. 重置选中的标签key
+      this.selectedPostTagKey = '';
+
+      // 2. 重置所有标签的选中状态
+      this.postTagList.forEach(tag => {
+        tag.checked = false;
+      });
+
+      // 3. 清空树选择状态和暂存列表
+      if (this.$refs.postTree) {
+        this.$refs.postTree.initData();
+        this.proPostList = [];
+      }
+
+      // 4. 可选：添加清空提示
+      this.$Message.info("已清空快捷标签选择");
+    },
+    handlePostSearchClear() {
+      // 清空搜索框绑定的值
+      this.postSearch = '';
+
+      // 清空搜索结果列表
+      this.postSearchList = [];
+
+      // 重置树组件状态（与原有逻辑保持一致）
+      if (this.$refs.postTree) {
+        this.$refs.postTree.initData();
+      }
+
+      // 清空暂存列表
+      this.proPostList = [];
+
+      // 可选：添加清空提示
+      this.$Message.info("已清空组织选择搜索");
+    },
     queryPositionList(){
       ajax.get('/pub-manage-server/pub/personHelpBox/q/queryPositionList').then((res)=>{
         if(res.data.code === 1){
@@ -248,64 +362,120 @@ export default {
       if (query !== '') {
         this.loadingOrg = true;
         this.getOrgUnitBySearchTerm(query,(res)=>{
-            this.loadingOrg = false
-            if(res.data.code === 1){
-              let resp = res.data.data?.items??[]
-              this.orgSearchList = resp
-            }else{
-              this.orgSearchList = []
-              this.$Message.error("获取组织节点列表失败！")
-            }
+          this.loadingOrg = false
+          if(res.data.code === 1){
+            let resp = res.data.data?.items??[]
+            this.orgSearchList = resp
+          }else{
+            this.orgSearchList = []
+            this.$Message.error("获取组织节点列表失败！")
+          }
         })
       }else{
         this.orgSearchList = [];
       }
     },
-    getPostListBySearch(query){
+    getPostListBySearch(query) {
       if (query !== '') {
         this.loadingPost = true;
-        this.getOrgUnitBySearchTerm(query,(res)=>{
-            this.loadingPost = false
-            if(res.data.code === 1){
-              let resp = res.data.data?.items??[]
-              this.postSearchList = resp
-            }else{
-              this.postSearchList = []
-              this.$Message.error("获取组织节点列表失败！")
-            }
-        })
-      }else{
-        this.$refs.postTree.initData()
+        this.getOrgUnitBySearchTerm(query, (res) => {
+          this.loadingPost = false;
+          if (res.data.code === 1) {
+            let resp = res.data.data?.items ?? [];
+            // 修复：岗位搜索结果深拷贝，避免引用污染
+            this.postSearchList = this.safeDeepCopy(resp);
+          } else {
+            this.postSearchList = [];
+            this.$Message.error("获取组织节点列表失败！");
+          }
+        });
+      } else {
+        // 修复：清空搜索时，同时清空树数据和暂存列表（与组织Tab一致）
         this.postSearchList = [];
+        if (this.$refs.postTree) {
+          this.$refs.postTree.initData();
+        }
+        this.proPostList = []; // 清空岗位暂存列表
+        this.$set(this, 'postTree', []); // 清空岗位树数据
       }
     },
     getOrgUnitBySearchTerm(query,callback){
-        ajax.get('/pub-manage-server/pub/personHelpBox/q/getOrgUnitBySearchTerm?searchTerm='+query).then((res)=>{callback(res)})
+      ajax.get('/pub-manage-server/pub/personHelpBox/q/getOrgUnitBySearchTerm?searchTerm='+query).then((res)=>{callback(res)})
     },
-    async getOrgOption(val){
+    async getOrgOption(val) {
+      this.selectedOrgTagKey = '';
+      this.orgTagList.forEach(tag => {
+        tag.checked = false;
+      });
+      this.proOrgList = [];
       if(!val) return this.$refs.orgTree.initData();
-      let item = this.orgSearchList.filter((item)=> {return item.orgUnitId === val}).shift();
+      let item = this.orgSearchList.filter((item)=> item.orgUnitId === val).shift();
+      if (!item) return;
+
       const leafNode = await this.judgeNodeLeafe(item.orgUnitId);
-      const ftem = {...item,orgNodeName:item.name,parentOrgUnitId:item.parentId,leafNode:leafNode}
+      const ftem = this.safeDeepCopy({
+        ...item,
+        orgNodeName: item.name,
+        parentOrgUnitId: item.parentId,
+        leafNode: leafNode
+      });
+
       try{
-        let parentsList = await this.getParentOrgNodesByOrgUnitId(val)
-        let tree = this.buildTree([...parentsList,ftem])
-        this.orgTree = tree
+        let parentsList = await this.getParentOrgNodesByOrgUnitId(val);
+        // 对父节点列表进行安全拷贝
+        const safeParents = this.safeDeepCopy(parentsList);
+        let tree = this.buildTree([...safeParents, ftem]);
+        this.orgTree = this.safeDeepCopy(tree);
       }catch(e){
-        this.$Message.error("获取组织节点列表失败！")
+        this.$Message.error("获取组织节点列表失败！");
       }
     },
-    async getPostOption(val){
-      if(!val) return this.$refs.postTree.initData();
-      let item = this.postSearchList.filter((item)=> {return item.orgUnitId === val}).shift();
+    async getPostOption(val) {
+      // 1. 重置选中的标签key
+      this.selectedPostTagKey = '';
+
+      // 2. 重置所有标签的选中状态
+      this.postTagList.forEach(tag => {
+        tag.checked = false;
+      });
+      if (!val) {
+        // 修复：岗位树清空时，同时清空暂存列表和搜索框
+        if (this.$refs.postTree) {
+          this.$refs.postTree.initData();
+        }
+        this.proPostList = []; // 清空岗位暂存列表（与组织Tab保持一致）
+        this.postSearch = ''; // 清空搜索框
+        return;
+      }
+
+      let item = this.postSearchList.filter(item => item.orgUnitId === val).shift();
+      if (!item) return;
+
       const leafNode = await this.judgeNodeLeafe(item.orgUnitId);
-      const ftem = {...item,orgNodeName:item.name,parentOrgUnitId:item.parentId,leafNode:leafNode}
-      try{
-        let parentsList = await this.getParentOrgNodesByOrgUnitId(val)
-        let tree = this.buildTree([...parentsList,ftem])
-        this.postTree = tree
-      }catch(e){
-        this.$Message.error("获取组织节点列表失败！")
+      // 修复：岗位节点深拷贝，避免引用污染
+      const ftem = this.safeDeepCopy({
+        ...item,
+        orgNodeName: item.name || `未命名组织(${item.orgUnitId})`,
+        parentOrgUnitId: item.parentId,
+        leafNode: leafNode
+      });
+
+      try {
+        let parentsList = await this.getParentOrgNodesByOrgUnitId(val);
+        const safeParents = this.safeDeepCopy(parentsList);
+        let tree = this.buildTree([...safeParents, ftem]);
+        // 修复：用$set确保岗位树数据响应式更新
+        this.$set(this, 'postTree', this.safeDeepCopy(tree));
+
+        // 修复：设置节点展开和选中（与组织Tab逻辑一致）
+        this.$nextTick(() => {
+          if (this.$refs.postTree && this.$refs.postTree.setCheckedNodes) {
+            this.$refs.postTree.setCheckedNodes([val]); // 选中当前节点
+            this.proPostList = [ftem]; // 同步暂存列表
+          }
+        });
+      } catch (e) {
+        this.$Message.error("获取组织节点列表失败！");
       }
     },
     getParentOrgNodesByOrgUnitId(val){
@@ -341,27 +511,28 @@ export default {
       })
     },
     buildTree(items) {
-      // 创建一个映射表，用于快速查找节点
       const map = {};
       const roots = [];
-      
-      // 初始化所有节点，添加children属性
-      items.forEach(item => {
-        map[item.orgUnitId] = { ...item, orgChildrenList: [] };
+      // 对输入数据进行安全拷贝
+      const copiedItems = this.safeDeepCopy(items);
+
+      copiedItems.forEach(item => {
+        if (!item.orgUnitId) return; // 过滤无效节点
+        map[item.orgUnitId] = this.safeDeepCopy({
+          ...item,
+          orgChildrenList: []
+        });
       });
-      
-      // 构建树形结构
-      items.forEach(item => {
+
+      copiedItems.forEach(item => {
+        if (!item.orgUnitId || !map[item.orgUnitId]) return;
+
         const node = map[item.orgUnitId];
-        if (item.parentOrgUnitId === null) {
-          // 根节点
+        if (!item.parentOrgUnitId || !map[item.parentOrgUnitId]) {
           roots.push(node);
         } else {
-          // 子节点，找到父节点并添加到其children中
           const parent = map[item.parentOrgUnitId];
-          if (parent) {
-            parent.orgChildrenList.push(node);
-          }
+          parent.orgChildrenList.push(node);
         }
       });
       return roots;
@@ -420,12 +591,21 @@ export default {
       }
     },
     getOrgList(data){
-      this.proOrgList = data
+      if (this.proOrgList){
+        this.proOrgList = this.proOrgList.concat(data)
+      }else {
+        this.proOrgList = data
+      }
+
     },
     getPostList(data){
-      this.proPostList = data
+      if (this.proPostList){
+        this.proPostList = this.proPostList.concat(data)
+      }else {
+        this.proPostList = data
+      }
     },
-    addOrgList(){
+    addOrgList() {
       if(!this.proOrgList.length) return this.$Message.error("请先选择组织节点！")
       let proOrgList = deepCopy(this.proOrgList)
       proOrgList.forEach(item=>{
@@ -435,11 +615,18 @@ export default {
       })
       let list = this.orgList.concat(proOrgList)
       let uniqueArray = list.filter((item, index, self) =>
-          index === self.findIndex(t => (
-            t.id === item.id // 基于id属性去重
-          ))
+              index === self.findIndex(t => (
+                  t.id === item.id // 基于id属性去重
+              ))
       );
       this.orgList = uniqueArray
+
+      // 新增：清空组织树节点选中状态（关键优化）
+      if (this.$refs.orgTree && this.$refs.orgTree.clearAllChecked) {
+        this.$refs.orgTree.clearAllChecked(this.$refs.orgTree.data);
+        this.$refs.orgTree.$emit('handleChange', []); // 通知父组件清空暂存列表
+      }
+
       this.$refs.orgTree.upDataTree()
       this.proOrgList = []
     },
@@ -451,36 +638,44 @@ export default {
     },
     //岗位
     getPosionId(item){
-      item.checked = !item.checked;
+      // item.checked = !item.checked;
+      this.selectedPositionId = item.positionId
     },
-    addPostList(){
+    addPostList() {
       if(!this.proPostList.length) return this.$Message.error("请选择组织节点！")
       let proPostList = deepCopy(this.proPostList)
-      let checkedPosition = this.positiontList.filter((item)=>item.checked === true)
-      if(!checkedPosition.length){return this.$Message.error("请选择岗位！！")}
-      //summary data
+      let checkedPosition = this.positiontList.find(item => item.positionId === this.selectedPositionId);
+      if(!checkedPosition){return this.$Message.error("请选择岗位！！")}
+      // summary data
       let totalList = []
-      for(let it of checkedPosition){
-        proPostList.forEach(item=>{
-          totalList.push({
-            ...item,
-            ...it,
-            title:`${this.includeLevelPost.length?(item.orgNodeName+'（包含下级组织节点）'):item.orgNodeName}`,
-            includeLevel:this.includeLevelPost.includes('01'),
-            id:this.includeLevelPost.includes('01')?('01'+'-'+it.positionId + '-' + item.orgUnitId):('00'+'-'+it.positionId + '-' + item.orgUnitId),
-          })
+      proPostList.forEach(item=>{
+        totalList.push({
+          ...item,
+          ...checkedPosition,
+          title:`${this.includeLevelPost.length?(item.orgNodeName+'（包含下级组织节点）'):item.orgNodeName}`,
+          includeLevel:this.includeLevelPost.includes('01'),
+          id:this.includeLevelPost.includes('01')?('01'+'-'+checkedPosition.positionId + '-' + item.orgUnitId):('00'+'-'+checkedPosition.positionId + '-' + item.orgUnitId),
         })
-      }
+      })
       let list = this.postList.concat(totalList)
       let uniqueArray = list.filter((item, index, self) =>
-          index === self.findIndex(t => (
-            t.id === item.id // 基于id属性去重
-          ))
+              index === self.findIndex(t => (
+                  t.id === item.id // 基于id属性去重
+              ))
       );
       this.postList = uniqueArray
+
+      // 新增：清空岗位树节点选中状态（关键优化）
+      if (this.$refs.postTree && this.$refs.postTree.clearAllChecked) {
+        this.$refs.postTree.clearAllChecked(this.$refs.postTree.data);
+        this.$refs.postTree.$emit('handleChange', []); // 通知父组件清空暂存列表
+      }
+
       this.$refs.postTree.upDataTree()
       this.proPostList = []
-      this.positiontList.map((item)=>{item.checked=false})
+      this.selectedPositionId = null; // 清空岗位单选状态
+      this.$refs.postTree.initData()
+      this.selectedPostTagKey = '';
     },
     clearPost(){
       this.postList= []
@@ -490,15 +685,16 @@ export default {
     },
     //staff
     addStaffList(){
-      let staffList = this.staffAllList.filter((item)=>item.checked===true)
-      let list = this.staffList.concat(staffList)
-      let uniqueArray = list.filter((item, index, self) =>
-          index === self.findIndex(t => (
-            t.id === item.id // 基于id属性去重
-          ))
+      let staffList = this.staffAllList.filter((item)=>item.checked===true);
+      // 关键优化：基于item.id去重，不修改原数据字段，仅过滤重复项
+      let uniqueStaffList = staffList.filter(newItem =>
+          // 检查右侧条件区域（staffList）是否已有该人员，避免重复添加
+          !this.staffList.some(existItem => existItem.id === newItem.id)
       );
-      this.staffList = uniqueArray
-      this.staffAllList.map((item)=>item.checked=false)
+      // 合并去重后的列表，右侧条件区域数据结构完全不变
+      this.staffList = this.staffList.concat(uniqueStaffList);
+      // 清空选中状态（保持原有逻辑）
+      this.staffAllList.forEach(item => item.checked = false);
     },
     handlestaff(item){
       item.checked=!item.checked
@@ -520,9 +716,537 @@ export default {
     visibleChange(val){
       this.$emit('input',val);
     },
-    fastChedkOrg(item){
-      item.checked = !item.checked
+    // 处理Tab切换，同步更新tabName
+    handleTabChange(tabName) {
+      this.tabName = tabName;
+      // 可选：切换到岗位Tab时，初始化岗位树选中状态（避免残留组织Tab数据）
+      if (tabName === 'post' && this.$refs.postTree && this.proPostList.length === 0) {
+        this.proPostList = [];
+        this.$refs.postTree.initData();
+      }
+    },
+    async fastChedkOrg(item) {
+      // 1. 改用组织 Tab 专属标签列表判断
+      if (!this.orgTagList.length) {
+        this.$Message.warning("快捷选择标签正在加载中，请稍后");
+        return;
+      }
+      const treeRef = this.$refs.orgTree;
+      const proListKey = 'proOrgList';
+      const treeDataKey = 'orgTree';
+      this[proListKey] = [];
+      if (treeRef) await treeRef.initData();
+      if (!treeRef) {
+        this.$Message.error("组织树组件未初始化，请稍后再试");
+        item.checked = !item.checked;
+        return;
+      }
+
+      // 2. 清空组织 Tab 标签选中状态（仅操作 orgTagList）
+      this.orgTagList.forEach(tag => {
+        tag.checked = false;
+      });
+
+      // 3. 后续逻辑保持不变，仅操作当前 item（属于 orgTagList）
+      const isCurrentlyChecked = item.checked;
+      if (!isCurrentlyChecked) {
+        item.checked = true;
+      }
+
+      if (!item.checked) {
+        this.$Message.info("已取消该快捷选择");
+        return;
+      }
+
+      try {
+        await this.querySpecificParam(item, true, treeRef, proListKey, treeDataKey);
+      } catch (error) {
+        this.$Message.error(`快捷选择处理失败：${error.message.slice(0, 50)}`);
+        item.checked = !item.checked;
+      }
+    },
+    async fastChedkPost(item) {
+      // 1. 改用岗位 Tab 专属标签列表判断
+      if (!this.postTagList.length) {
+        this.$Message.warning("快捷选择标签正在加载中，请稍后");
+        return;
+      }
+
+      const isOrgTab = this.tabName === 'org';
+      const treeRef = isOrgTab ? this.$refs.orgTree : this.$refs.postTree;
+      const proListKey = isOrgTab ? 'proOrgList' : 'proPostList';
+      const treeDataKey = isOrgTab ? 'orgTree' : 'postTree';
+
+      this[proListKey] = [];
+      const isCurrentlyChecked = item.checked;
+      if (treeRef) await treeRef.initData();
+
+      // 2. 清空岗位 Tab 标签选中状态（仅操作 postTagList）
+      this.postTagList.forEach(tag => {
+        tag.checked = false;
+      });
+
+      // 3. 后续逻辑保持不变，仅操作当前 item（属于 postTagList）
+      if (!isCurrentlyChecked) {
+        item.checked = true;
+      }
+
+      if (!item.checked) {
+        this.$Message.info("已取消该快捷选择");
+        return;
+      }
+
+      try {
+        await this.querySpecificParam(item, isOrgTab, treeRef, proListKey, treeDataKey);
+      } catch (error) {
+        this.$Message.error(`快捷选择处理失败：${error.message.slice(0, 50)}`);
+        item.checked = !item.checked;
+      }
     },
+    queryTagList() {
+      ajax.get('/pub-manage-server/pub/helpBoxTag/q/queryQuickPickTags').then((res) => {
+        if (res.data.code === 1) {
+          let baseTagList = res.data.data || [];
+          // 组织 Tab 标签：深拷贝并初始化选中状态
+          this.orgTagList = this.safeDeepCopy(baseTagList).map(item => ({
+            ...item,
+            checked: false // 独立选中状态
+          }));
+          // 岗位 Tab 标签：深拷贝并初始化选中状态（与组织 Tab 完全独立）
+          this.postTagList = this.safeDeepCopy(baseTagList).map(item => ({
+            ...item,
+            checked: false // 独立选中状态
+          }));
+        }
+      });
+    },
+
+    querySpecificParam: function (item, isOrgTab, treeRef, proListKey, treeDataKey) {
+      return new Promise((resolve, reject) => {
+        // 取消选中时处理（仅当手动点击已选中的标签时触发）
+        if (!item.checked) {
+          if (treeRef && treeRef.initData) {
+            treeRef.initData(); // 清空对应树组件
+          }
+          this[proListKey] = []; // 清空对应暂存列表
+          this.$Message.info("已取消该快捷选择");
+          resolve();
+          return;
+        }
+
+        // 请求快捷选择对应的orgUnitId列表
+        ajax.get(`/pub-manage-server/pub/helpBoxTag/q/querySpecificParam?quickPickKey=${item.quickPickKey}`)
+            .then(async (res) => {
+              if (res.data.code !== 1) {
+                this.$Message.error("获取快捷选择配置失败");
+                item.checked = !item.checked;
+                reject(new Error("获取配置失败"));
+                return;
+              }
+
+              const orgUnitIds = res.data.data?.param || [];
+              const safeOrgUnitIds = Array.isArray(orgUnitIds) ? orgUnitIds : [];
+              if (safeOrgUnitIds.length === 0) {
+                this.$Message.warning("该快捷选择未配置任何组织节点");
+                item.checked = !item.checked;
+                reject(new Error("无配置节点"));
+                return;
+              }
+
+              // 校验树组件是否存在（通用校验）
+              if (!treeRef) {
+                this.$Message.error("树组件未初始化");
+                item.checked = !item.checked;
+                reject(new Error("树组件不存在"));
+                return;
+              }
+              const originalTreeData = treeRef.data && treeRef.data.length ? this.safeDeepCopy(treeRef.data) : [];
+              const matchedNodes = [];
+
+              // 批量处理每个orgUnitId（循环逻辑不变，通用处理）
+              for (const orgUnitId of safeOrgUnitIds) {
+                try {
+                  // 节点详情查询（复用原有方法）
+                  let currentNode = await this.queryOrgNodeDetail(orgUnitId);
+                  if (!currentNode || !currentNode.orgUnitId) {
+                    this.$Message.warning(`节点【${orgUnitId}】数据异常，跳过处理`);
+                    continue;
+                  }
+
+                  // 循环引用检测与处理（复用原有方法）
+                  const cycle = this.detectCircularReferences(currentNode);
+                  if (cycle) {
+                    this.$Message.warning(`节点【${orgUnitId}】存在循环引用，已自动修复`);
+                    currentNode = this.safeDeepCopy(currentNode);
+                  }
+
+                  // 节点名称默认值处理（复用原有逻辑）
+                  currentNode.orgNodeName = currentNode.orgNodeName || currentNode.orgUnitName || `未命名组织(${orgUnitId})`;
+                  currentNode.orgUnitName = currentNode.orgNodeName;
+
+                  // 节点是否已在树中检测（复用原有方法）
+                  const nodeInTree = this.findNodeInTree(originalTreeData, orgUnitId);
+                  if (nodeInTree) {
+                    if (this.detectCircularReferences(nodeInTree)) {
+                      this.$Message.warning(`树中节点【${orgUnitId}】存在循环引用，已跳过`);
+                      continue;
+                    }
+                    matchedNodes.push(nodeInTree);
+                    continue;
+                  }
+
+                  // 父节点追溯与节点链挂载（修复：使用当前Tab的树数据originalTreeData，而非固定orgTree）
+                  let targetParent = null;
+                  let nodeChain = [currentNode];
+                  const MAX_DEPTH = 8;
+                  let depth = 0;
+                  let lastParentId = '';
+
+                  while (!targetParent && depth < MAX_DEPTH) {
+                    const parentId = currentNode.parentOrgUnitId;
+                    if (!parentId || typeof parentId !== 'string' || parentId === lastParentId) {
+                      break;
+                    }
+                    lastParentId = parentId;
+
+                    const parentNode = await this.queryOrgNodeDetail(parentId);
+                    if (!parentNode || !parentNode.orgUnitId) {
+                      break;
+                    }
+
+                    if (this.detectCircularReferences(parentNode)) {
+                      this.$Message.warning(`父节点【${parentId}】存在循环引用，已跳过`);
+                      break;
+                    }
+
+                    parentNode.orgNodeName = parentNode.orgNodeName || parentNode.orgUnitName || `未命名组织(${parentId})`;
+                    // 修复：查询父节点是否在当前Tab的树数据中（originalTreeData），而非固定orgTree
+                    const parentInTree = this.findNodeInTree(originalTreeData, parentNode.orgUnitId);
+
+                    if (parentInTree) {
+                      targetParent = parentInTree;
+                      break;
+                    }
+
+                    nodeChain.unshift(parentNode);
+                    currentNode = parentNode;
+                    depth++;
+                  }
+
+                  // 节点链挂载（复用原有方法）
+                  if (targetParent) {
+                    let currentMountParent = targetParent;
+                    for (const node of nodeChain) {
+                      const formattedNode = this.safeDeepCopy({
+                        ...node,
+                        leafNode: await this.judgeNodeLeafe(node.orgUnitId),
+                        expand: true,
+                        checked: false,
+                        orgChildrenList: [],
+                        children: []
+                      });
+
+                      if (!Array.isArray(currentMountParent.orgChildrenList)) {
+                        currentMountParent.orgChildrenList = [];
+                        currentMountParent.children = [];
+                      }
+
+                      const isDuplicate = currentMountParent.orgChildrenList.some(
+                          child => child.orgUnitId === formattedNode.orgUnitId
+                      );
+                      if (!isDuplicate) {
+                        currentMountParent.orgChildrenList.push(formattedNode);
+                        currentMountParent.leafNode = false;
+                      }
+
+                      currentMountParent = currentMountParent.orgChildrenList.find(
+                          child => child.orgUnitId === formattedNode.orgUnitId
+                      ) || formattedNode;
+                    }
+
+                    const mountedTarget = this.findNodeInTree(originalTreeData, orgUnitId);
+                    if (mountedTarget) {
+                      matchedNodes.push(mountedTarget);
+                    }
+                  }
+
+                } catch (error) {
+                  this.$Message.error(`处理节点【${orgUnitId}】失败：${error.message.slice(0, 50)}`);
+                  continue;
+                }
+              }
+
+              // 最终数据赋值（根据Tab类型区分，核心统一逻辑）
+
+              if (matchedNodes.length > 0) {
+                // 同步暂存列表（组织proOrgList/岗位proPostList）
+                this[proListKey] = matchedNodes;
+                const finalTreeData = this.safeDeepCopy(originalTreeData);
+                // 响应式更新对应树数据（组织orgTree/岗位postTree）
+                this.$set(this, treeDataKey, finalTreeData);
+
+                await this.$nextTick(async () => {
+                  // 更新树组件数据（通用逻辑）
+                  if (treeRef.updateTreeData) {
+                    treeRef.updateTreeData(this.safeDeepCopy(finalTreeData));
+                  } else {
+                    treeRef.data = this.safeDeepCopy(finalTreeData);
+                  }
+
+                  // 设置树选中状态（通用逻辑）
+                  const safeNodeIds = matchedNodes.map(node => node.orgUnitId);
+                  if (treeRef.setCheckedNodes) {
+                    treeRef.setCheckedNodes([]);
+                    treeRef.setCheckedNodes(safeNodeIds);
+                    treeRef.handleChange(matchedNodes); // 触发子组件选中事件
+                  } else {
+                    this.updateTreeNodesStatus(
+                        finalTreeData,
+                        new Set(safeNodeIds),
+                        new Set(safeNodeIds)
+                    );
+                    treeRef.handleChange(matchedNodes);
+                  }
+
+                  // 提示信息（通用逻辑）
+                  this.$Message.success(`成功选中${matchedNodes.length}个组织节点`);
+                });
+              } else {
+                this.$Message.warning("未找到任何可匹配的组织节点");
+                item.checked = !item.checked;
+              }
+              resolve();
+            })
+            .catch((error) => {
+              const errMsg = error.message || '网络异常';
+              this.$Message.error(`快捷选择失败：${errMsg.slice(0, 50)}`);
+              item.checked = !item.checked;
+              reject(error);
+            });
+      });
+    },
+
+    // 新增：移除树数据中的 parent 引用，避免子组件处理时形成循环
+    removeParentReferences(treeData) {
+      if (!Array.isArray(treeData)) return;
+      treeData.forEach(node => {
+        // 删除可能存在的 parent 引用（如果节点有此属性）
+        if (node.parent) delete node.parent;
+        // 递归处理子节点
+        if (Array.isArray(node.orgChildrenList)) {
+          this.removeParentReferences(node.orgChildrenList);
+        }
+        if (Array.isArray(node.children)) {
+          this.removeParentReferences(node.children);
+        }
+      });
+    },
+    // 在 methods 中添加循环引用检测工具函数
+    detectCircularReferences(obj, path = [], visited = new Map()) {
+      if (obj === null || typeof obj !== 'object') return null;
+
+      if (visited.has(obj)) {
+        return { path: [...path, visited.get(obj)], node: obj };
+      }
+
+      visited.set(obj, Array.isArray(obj) ? 'Array' : `Object(${obj.orgUnitId || 'unknown'})`);
+
+      const keys = Array.isArray(obj) ? obj.map((_, i) => i) : Object.keys(obj);
+      for (const key of keys) {
+        const value = obj[key];
+        const newPath = [...path, key];
+        if (value && typeof value === 'object') {
+          const cycle = this.detectCircularReferences(value, newPath, visited);
+          if (cycle) return cycle;
+        }
+      }
+
+      visited.delete(obj);
+      return null;
+    },
+
+    // 增强安全深拷贝，主动移除循环引用字段
+    safeDeepCopy(obj, hash = new WeakMap()) {
+      if (obj === null || typeof obj !== 'object') {
+        return obj;
+      }
+
+      // 检测到循环引用时，仅保留基础字段
+      if (hash.has(obj)) {
+        const safeObj = { orgUnitId: obj.orgUnitId, name: obj.name || obj.orgNodeName };
+        hash.set(obj, safeObj);
+        return safeObj;
+      }
+
+      let copy;
+      if (obj instanceof Array) {
+        copy = [];
+        hash.set(obj, copy);
+        for (let i = 0; i < obj.length; i++) {
+          copy[i] = this.safeDeepCopy(obj[i], hash);
+        }
+      } else if (obj instanceof Object) {
+        copy = {};
+        hash.set(obj, copy);
+        for (let key in obj) {
+          if (obj.hasOwnProperty(key)) {
+            // 严格过滤可能导致循环的字段
+            if (['parent', '__parent', 'parentNode', '__vue__', '__ob__', '$parent'].includes(key)) {
+              continue;
+            }
+            // 对子节点数组进行特殊处理
+            if (['orgChildrenList', 'children'].includes(key) && Array.isArray(obj[key])) {
+              copy[key] = obj[key].map(child => this.safeDeepCopy(child, hash));
+            } else {
+              copy[key] = this.safeDeepCopy(obj[key], hash);
+            }
+          }
+        }
+      } else {
+        copy = obj;
+      }
+      return copy;
+    },
+
+    /**
+     * 查询单个节点的原生详情（适配后端接口，返回原生字段）
+     * @param {string} orgUnitId - 节点ID（如11510101）
+     * @returns {Promise<Object|null>} 原生节点详情（无数据返回null）
+     */
+    getOrgNodeDetail(orgUnitId) {
+      return new Promise((resolve) => {
+        ajax.get(`/pub-manage-server/pub/organ/q/queryOrg`, {
+          params: { orgUnitId: orgUnitId }
+        }).then((res) => {
+          if (res.data.code === 1 && res.data.data) {
+            // 仅保留原生树结构必需字段（过滤业务冗余字段）
+            const { orgUnitId, parentOrgUnitId, orgNodeName, orgChildrenList } = res.data.data;
+            resolve({
+              orgUnitId,
+              parentOrgUnitId,
+              orgNodeName,
+              orgChildrenList: orgChildrenList || [] // 兼容接口返回空的情况
+            });
+          } else {
+            resolve(null);
+          }
+        }).catch(() => {
+          this.$Message.error(`查询节点【${orgUnitId}】详情失败`);
+          resolve(null);
+        });
+      });
+    },
+
+    /**
+     * 迭代查找节点（替代递归，避免栈溢出）
+     * @param {Array} treeData - 树形数据
+     * @param {string} targetOrgUnitId - 目标节点ID
+     * @returns {Object|null} 找到的节点
+     */
+    findNodeInTree(treeData, targetOrgUnitId) {
+      if (!Array.isArray(treeData) || !targetOrgUnitId || typeof targetOrgUnitId !== 'string') {
+        return null;
+      }
+
+      // 用队列实现广度优先搜索（BFS），避免递归栈溢出
+      const queue = [...treeData];
+      while (queue.length > 0) {
+        const currentNode = queue.shift(); // 取出队列头部节点
+        // 找到目标节点，直接返回
+        if (currentNode.orgUnitId === targetOrgUnitId) {
+          return currentNode;
+        }
+        // 将当前节点的子节点加入队列（继续查找）
+        if (Array.isArray(currentNode.orgChildrenList) && currentNode.orgChildrenList.length > 0) {
+          queue.push(...currentNode.orgChildrenList);
+        }
+        // 兼容子组件可能使用的children字段
+        if (Array.isArray(currentNode.children) && currentNode.children.length > 0 && !currentNode.orgChildrenList) {
+          queue.push(...currentNode.children);
+        }
+      }
+
+      // 遍历完所有节点未找到
+      return null;
+    },
+
+    /**
+     * 辅助方法：查询单个orgUnitId的节点详情
+     * @param {string} orgUnitId - 组织节点ID
+     * @returns {Promise<Object|null>} 节点详情
+     */
+    queryOrgNodeDetail(orgUnitId) {
+      return new Promise((resolve) => {
+        // 前置校验：避免无效请求
+        if (!orgUnitId || typeof orgUnitId !== 'string') {
+          resolve(null);
+          return;
+        }
+
+        ajax.get(`/pub-manage-server/pub/organ/q/queryOrg?orgUnitId=${orgUnitId}`)
+            .then((res) => {
+              if (res.data.code === 1 && res.data.data && res.data.data.orgUnitId) {
+                // 深拷贝并清理无效字段
+                const node = this.safeDeepCopy(res.data.data);
+                // 核心修复：确保节点名称有默认值，避免空显示
+                const nodeName = node.orgNodeName || node.orgUnitName || node.name || `未命名组织(${orgUnitId})`;
+                node.orgNodeName = nodeName;
+                node.orgUnitName = nodeName; // 同步更新orgUnitName，确保所有使用场景都有值
+                // 确保关键字段存在
+                node.parentOrgUnitId = node.parentOrgUnitId || null;
+                node.orgChildrenList = node.orgChildrenList || [];
+                resolve(node);
+              } else {
+                // 接口返回空时，返回默认结构避免报错
+                resolve({
+                  orgUnitId,
+                  orgNodeName: `未命名组织(${orgUnitId})`,
+                  orgUnitName: `未命名组织(${orgUnitId})`,
+                  parentOrgUnitId: null,
+                  orgChildrenList: []
+                });
+              }
+            })
+            .catch(() => {
+              // 请求失败时，返回默认结构避免报错
+              resolve({
+                orgUnitId,
+                orgNodeName: `未命名组织(${orgUnitId})`,
+                orgUnitName: `未命名组织(${orgUnitId})`,
+                parentOrgUnitId: null,
+                orgChildrenList: []
+              });
+            });
+      });
+    },
+
+
+    /**
+     * 手动更新树节点状态（如果树组件没有提供update方法）
+     * @param {Array} nodeList - 节点列表
+     * @param {Set} expandIds - 需要展开的节点ID集合
+     * @param {Set} checkedIds - 需要选中的节点ID集合
+     */
+    updateTreeNodesStatus(nodeList, expandIds, checkedIds) {
+      nodeList.forEach(node => {
+        // 更新展开状态
+        if (expandIds.has(node.orgUnitId)) {
+          node.expand = true;
+        }
+
+        // 更新选中状态
+        if (checkedIds.has(node.orgUnitId)) {
+          node.checked = true;
+        }
+
+        // 递归处理子节点
+        const children = node.children || node.orgChildrenList;
+        if (children && children.length > 0) {
+          this.updateTreeNodesStatus(children, expandIds, checkedIds);
+        }
+      });
+    }
+
   },
   computed:{
     getCheckedStaff(){
@@ -541,6 +1265,7 @@ export default {
     },
     data:{
       handler(val){
+        if(!val) return
         let map = deepCopy(val)
         let orgList = map.orgList || []
         orgList.forEach(item=>{
@@ -563,6 +1288,64 @@ export default {
 }
 </script>
 <style lang="less" scoped>
+.custom-select-wrapper {
+  position: relative;
+
+  /* 优化清空按钮样式 */
+  /deep/ .ivu-select-clear {
+    right: 32px;  /* 调整位置，避免与下拉箭头重叠 */
+    color: #999;
+    font-size: 16px;
+    opacity: 1 !important;  /* 始终显示（有值时） */
+    transition: all 0.2s ease;
+
+    &:hover {
+      color: #ff4d4f;  /* hover时变红 */
+      transform: scale(1.1);  /* 轻微放大效果 */
+    }
+  }
+
+  /* 调整下拉箭头位置 */
+  /deep/ .ivu-select-arrow {
+    right: 12px;
+  }
+
+  /* 优化输入框内边距，避免文字被按钮遮挡 */
+  /deep/ .ivu-select-input {
+    padding-right: 45px !important;
+  }
+
+  /* 选中选项样式 */
+  /deep/ .active-option {
+    background-color: #f2f8ff;
+    color: var(--primary-color);
+  }
+
+  /* 无数据选项样式 */
+  /deep/ .ivu-select-option-disabled {
+    color: #ccc !important;
+    background: #f5f5f5 !important;
+  }
+}
+.tag-select-container {
+  margin-left: 10px;
+
+  /deep/ .ivu-select-dropdown {
+    max-height: 200px;
+    overflow-y: auto;
+  }
+
+  /deep/ .active-option {
+    background-color: #f2f8ff;
+    color: var(--primary-color);
+  }
+
+  /deep/ .ivu-select-selected-value {
+    max-width: 150px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
 .modal-tree{
   .header-text{
     font-weight: bold;
@@ -653,10 +1436,10 @@ export default {
         .tag{
           margin-top: 10px;
           &.active{
-          background: var(--primary-color);
-          border-radius: 4px;
-          color: #fff;
-        }
+            background: var(--primary-color);
+            border-radius: 4px;
+            color: #fff;
+          }
         }
       }
       .post{