fix: 批量分配人数判断逻辑 & 成员选择交互优化

project/src/components/assembly/screen/customerService.vue

@@ -3,51 +3,61 @@
     <label class="common-screen-label" v-if="title && title != ''" :style="labelWidth ? 'width:' + labelWidth : ''">{{
         title
     }}</label>
-    <el-popover append-to-body placement="bottom" trigger="click" v-model="visible" :disabled="disabled">
-      <div :style="width ? 'width:' + width : ''" :class="['common-screen-self-box',
-      'common-input-select',
-      final_result && final_result.length != 0 && clearable && !disabled ? 'common-input-select-hover' : '',
-      disabled ? 'pointer-drop' : '']" slot="reference">
+    <!-- trigger="manual" || trigger="click" -->
+    <el-popover append-to-body placement="bottom" trigger="manual" v-model="visible" :disabled="disabled">
+      <div
+        :style="width ? 'width:' + width : ''"
+        :class="[
+          'common-screen-self-box',
+          'common-input-select',
+          final_result && final_result.length != 0 && clearable && !disabled ? 'common-input-select-hover' : '',
+          disabled ? 'pointer-drop' : ''
+        ]"
+        slot="reference"
+        @click="visible = true"
+      >
         <div :class="['common-screen-self-con',
         !final_result || final_result.length == 0 ? 'common-screen-self-placeholder' : '']">
           <div class="common-screen-self-con-div">
             <span v-if="!final_result || final_result.length == 0">请选择{{ source == 'chatGroup' ? '群主' : '成员' }}</span>
             <template v-else>
-              <span v-for="(item, index) in final_result" :key="index">{{ item.name }}{{ index == final_result.length -
-                  1 ? '' : ','
-              }}</span>
+              <span
+                v-for="(item, index) in final_result"
+                :key="index"
+              >{{ item.name }}{{ index == final_result.length - 1 ? '' : ',' }}</span>
             </template>
           </div>
-          <i class="el-icon-circle-close other-icon" @click.stop="clear"></i>
+          <i class="el-icon-circle-close other-icon" @click.stop="clear" />
         </div>
         <div class="common-screen-self-icon">
-          <i class="el-icon-arrow-down"></i>
+          <i class="el-icon-arrow-down" />
         </div>
       </div>
       <div class="flex" style="padding:10px">
         <div class="propoverItem">
           <self-input :reset='resetFlag' :hasLabel="false" label_name="成员名称" :inputFlag='true'
-            @inputChange='(val) => { input_keyword = val; userSearch() }' width="270px" style="margin-top:0">
-          </self-input>
+            @inputChange='(val) => { input_keyword = val; userSearch() }' width="270px" style="margin-top:0" />
           <!-- <self-input :reset='resetFlag' :hasLabel="false" @inputChange='(val)=>{input_keyword = val;init("userSearch")}' width="270px" style="margin-top:0"></self-input> -->
           <div class="allMember">全部{{ source == 'chatGroup' ? '群主' : '成员' }}({{ userTotal }}):</div>
           <div class="memberBoxBig self-scrollbar-3">
             <template v-for="(item, index) in userList">
               <div class="memberBox" :key="index + 'userList' + item.department_id">
-                <i :class="['el-icon-caret-bottom', item.is_open ? 'reversalAnimation' : '']"
-                  @click="openEvent(index)"></i>
+                <i :class="['el-icon-caret-bottom', item.is_open ? 'reversalAnimation' : '']" @click="openEvent(index)" />
                 <div class="meberList">
                   <div class="department" @click="selectUserEvent('all', index)">
                     <div class="flex" style="align-items: flex-start;">
-                      <i class="el-icon-s-cooperation" style="margin-top:3px"></i>
+                      <i class="el-icon-s-cooperation" style="margin-top:3px" />
                       <span>{{ item.department_name ? item.department_name : '部门' + (index + 1) }}</span>
                     </div>
-                    <div :class="['checkbox', item.is_select ? 'checkbox_active' : '']"><i class="el-icon-check"></i>
-                    </div>
+                    <div :class="['checkbox', item.is_select ? 'checkbox_active' : '']"><i class="el-icon-check" /></div>
                   </div>
-                  <div class="memberItem" :style="item.is_open ? 'display:none' : ''"
-                    v-for="(item1, user_index) in item.user_list" :key="item1.user_id"
-                    @click="selectUserEvent('user', index, user_index)">
+                  <div
+                    v-for="(item1, user_index) in item.user_list"
+                    :key="item1.user_id"
+                    :style="item.is_open ? 'display:none' : ''"
+                    class="memberItem"
+                    @click="selectUserEvent('user', index, user_index)"
+                  >
                     <div class="flex" style="flex:1">
                       <img class="memberImg" :src="item1.avatar" alt="">
                       <div class="memberInfo">
@@ -55,8 +65,7 @@
                         <div class="other">部门：{{ item1.department_list && item1.department_list.join(',') }}</div>
                       </div>
                     </div>
-                    <div :class="['checkbox', item1.is_select ? 'checkbox_active' : '']"><i class="el-icon-check"></i>
-                    </div>
+                    <div :class="['checkbox', item1.is_select ? 'checkbox_active' : '']"><i class="el-icon-check" /></div>
                   </div>
                 </div>
               </div>
@@ -79,7 +88,7 @@
                   <div class="other">部门：{{ item.department_list && item.department_list.join(',') }}</div>
                 </div>
               </div>
-              <i class="el-icon-close" style="margin-left:10px" @click="closeUser(index)"></i>
+              <i class="el-icon-close" style="margin-left:10px" @click="closeUser(index)" />
             </div>
           </div>
           <div class="buttons">
@@ -154,7 +163,6 @@ export default {
       this.changeSelect()
       this.afferent_init()
     }
-
   },
   methods: {
     // 执行一遍组件的created方法(拓展组件 群活码详情用)

project/src/components/manage/memberComp/batchAssign.vue

@@ -12,22 +12,19 @@
       <div class="flex" style="padding:10px">
         <div class="propoverItem">
           <self-input :reset='resetFlag' :hasLabel="false" label_name="成员名称" :inputFlag='true'
-            @inputChange='(val) => { input_keyword = val; userSearch() }' width="270px" style="margin-top:0">
-          </self-input>
+            @inputChange='(val) => { input_keyword = val; userSearch() }' width="270px" style="margin-top:0" />
           <div class="allMember">全部成员({{ userTotal }}):</div>
           <div class="memberBoxBig self-scrollbar-3">
             <template v-for="(item, index) in userList">
               <div class="memberBox" :key="index + 'userList' + item.department_id">
-                <i :class="['el-icon-caret-bottom', item.is_open ? 'reversalAnimation' : '']"
-                  @click="openEvent(index)"></i>
+                <i :class="['el-icon-caret-bottom', item.is_open ? 'reversalAnimation' : '']" @click="openEvent(index)" />
                 <div class="meberList">
                   <div class="department" @click="selectUserEvent('all', index)">
                     <div class="flex" style="align-items: flex-start;">
-                      <i class="el-icon-s-cooperation" style="margin-top:3px"></i>
+                      <i class="el-icon-s-cooperation" style="margin-top:3px" />
                       <span>{{ item.department_name ? item.department_name : '部门' + (index + 1) }}</span>
                     </div>
-                    <div :class="['checkbox', item.is_select ? 'checkbox_active' : '']"><i class="el-icon-check"></i>
-                    </div>
+                    <div :class="['checkbox', item.is_select ? 'checkbox_active' : '']"><i class="el-icon-check" /></div>
                   </div>
                   <div
                     v-for="(item1, user_index) in item.user_list"
@@ -43,15 +40,14 @@
                         <div class="other">部门：{{ item1.department_list && item1.department_list.join(',') }}</div>
                       </div>
                     </div>
-                    <div :class="['checkbox', item1.is_select ? 'checkbox_active' : '']"><i class="el-icon-check"></i>
-                    </div>
+                    <div :class="['checkbox', item1.is_select ? 'checkbox_active' : '']"><i class="el-icon-check" /></div>
                   </div>
                 </div>
               </div>
             </template>
           </div>
         </div>
-        <div class="line"></div>
+        <div class="line" />
         <div class="propoverItem" style="padding-left:20px">
           <div class="title">已选择的成员</div>
           <div class="choice_result_top">
@@ -67,7 +63,7 @@
                   <div class="other">部门：{{ item.department_list && item.department_list.join(',') }}</div>
                 </div>
               </div>
-              <i class="el-icon-close" style="margin-left:10px" @click="closeUser(index)"></i>
+              <i class="el-icon-close" style="margin-left:10px" @click="closeUser(index)" />
             </div>
           </div>
           <div class="buttons">
@@ -341,12 +337,13 @@ export default {
         return list
       }, []);
 
+      selectUser = selectUser.filter(item => item.is_active != 1) // 过滤已分配成员
+
       if (selectUser && (selectUser.length > this.waitForAssignNum)) { // 不能超过“待分配许可人数”
         const msg = this.waitForAssignNum == 0 ? '暂无待分配许可' : `最多可选${this.waitForAssignNum}名成员`
         this.$message.warning(msg)
         return false
       }
-      selectUser = selectUser.filter(item => item.is_active != 1) // 过滤已分配成员
 
       this.selectUser = selectUser
       this.$set(this.userList, main_index, user_arr)