权限配置课程增加全选功能

src/modules/roles/components/Permissions.vue

@@ -15,6 +15,9 @@
         </div>
       </el-form-item>
       <el-form-item label="课程列表">
+        <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">
+          全选
+        </el-checkbox>
         <el-checkbox-group v-model="form.course_ids">
           <div v-for="item in courses" :key="item.id">
             <el-checkbox :label="item.id">{{ item.course_name }}</el-checkbox>
@@ -53,12 +56,21 @@ export default {
         // { name: '教师端', system_tag: 2, permissions: [], value: [] },
         { name: '学生端', system_tag: 3, permissions: [], value: [] }
       ],
-      courses: [] // 所有课程
+      courses: [], // 所有课程
+      checkAll: false
+    }
+  },
+  watch: {
+    'form.course_ids'(ids) {
+      this.checkAll = ids.length === this.courses.length
     }
   },
   computed: {
     activeProject() {
       return this.$store.state.activeProject || {}
+    },
+    isIndeterminate() {
+      return this.form.course_ids.length > 0 && this.form.course_ids.length < this.courses.length
     }
   },
   async beforeMount() {
@@ -171,6 +183,10 @@ export default {
     // ID去重
     uniqueIds(ids) {
       return Array.from(new Set(ids))
+    },
+    // 全选
+    handleCheckAllChange() {
+      this.form.course_ids = this.checkAll ? this.courses.map(item => item.id) : []
     }
   }
 }