评价数据 科目配置弹窗添加全选操作

src/views/reviewManagement/stepComponent/step1Component/Step1Component.vue

@@ -176,22 +176,35 @@
                   <span v-if="currentOpenType == 'subject'" class="operation" @click="HandleAddCustomSubject">+ 新增科目</span>
                 </div>
 
-                <div class="tree">
-                  <TreeList 
-                    v-model:treeRef="optionalSubjetTreeDom"
-                    :defaultTreeData="allTreeData" 
-                    :showCheckBox="true"
-                    :operation="currentOpenType == 'subject' ? 'all' : ''"
-                    operationFlagKey="custom"
-                    v-model:editItemKey="optionalTreeEditItemKey"
-                    v-model:editTaskName="optionalTreeEditTaskName"
-                    :showAddOperation="false"
-                    @updateSelectedTreeNode="UpdataCheckedSubject"  
-                    @updateTreeName="HandleSaveCustomSubject"
-                    @deleteTreeNode="DeleteCustomSubject"
-                  >
-                  </TreeList>
+                <div class="optional_tree_option">
+                  <div class="select_all">
+                    <el-checkbox
+                        v-model="isSelectAllSubject"
+                        :indeterminate="(selectedTreeData?.length < allTreeData?.length && selectedTreeData?.length !== 0) ?  true :false"
+                        @change="SelectAllDataOrNot"
+                    >
+                        全选
+                    </el-checkbox>
+                  </div>
+
+                  <div class="tree">
+                    <TreeList 
+                      v-model:treeRef="optionalSubjetTreeDom"
+                      :defaultTreeData="allTreeData" 
+                      :showCheckBox="true"
+                      :operation="currentOpenType == 'subject' ? 'all' : ''"
+                      operationFlagKey="custom"
+                      v-model:editItemKey="optionalTreeEditItemKey"
+                      v-model:editTaskName="optionalTreeEditTaskName"
+                      :showAddOperation="false"
+                      @updateSelectedTreeNode="UpdataCheckedSubject"  
+                      @updateTreeName="HandleSaveCustomSubject"
+                      @deleteTreeNode="DeleteCustomSubject"
+                    >
+                    </TreeList>
+                  </div>
                 </div>
+
               </div>
               
               <div class="subject_selected_list">
@@ -410,6 +423,7 @@ const RenderOptionalAndSubjectTree = async (type,row)=>{
         id:selectedItm.id
       }
     }) || []
+    isSelectAllSubject.value =  allTreeData.value?.length === selectedTreeData.value?.length && selectedTreeData.value?.length !== 0
   }
 }
 
@@ -449,9 +463,25 @@ const CloseAddSubjectForm = () => {
 
   selectedSubjectIds.value = []
   addSubjectDialogLoading.value = false
+};
 
 
-};
+// 勾选全部科目/或者取消全部科目
+const isSelectAllSubject = ref(false)
+const SelectAllDataOrNot = (val)=>{
+  if(val){
+    selectedTreeData.value =  allTreeData.value
+    // 勾选所有
+  }else{
+    // 取消所有
+    selectedTreeData.value = []
+  }
+   selectedSubjectIds.value = selectedTreeData.value?.map(item=>{
+      return item.id
+    }) || []
+    optionalSubjetTreeDom.value.setCheckedKeys(selectedSubjectIds.value)
+}
+
 
 // 更新勾选的 可选科目
 const UpdataCheckedSubject = async (params)=>{
@@ -460,6 +490,7 @@ const UpdataCheckedSubject = async (params)=>{
     return item.id
   }) || []
   selectedTreeData.value = params
+  isSelectAllSubject.value =  allTreeData.value?.length === selectedTreeData.value?.length && selectedTreeData.value?.length !== 0
 }
 
 // 删除勾选的可选科目 
@@ -473,6 +504,7 @@ const DeleteCheckedSubject = async (param)=>{
     return item.id
   }) || []
   optionalSubjetTreeDom.value.setCheckedKeys(selectedSubjectIds.value)
+  isSelectAllSubject.value =  allTreeData.value?.length === selectedTreeData.value?.length && selectedTreeData.value?.length !== 0
 }
 
 // 新增自定义科目，显示可编辑输入框
@@ -762,13 +794,7 @@ onMounted(async() => {
             padding:0 10px;
             font-size: 12px;
           }
-        }
-
-
-
-
-        
-        
+        }        
       }
     }
   }
@@ -805,7 +831,14 @@ onMounted(async() => {
         } 
       }
 
-      >.tree{
+      .select_all{
+        border:solid #E4E7ED 1px;
+        border-bottom: none;
+        padding-left: 24px;
+        
+      }
+      .tree{
+        flex:1 1;
         border:solid #E4E7ED 1px;
       }
     }