updates

src/components/base/QuestionTypeTreeselect.vue

+<template>
+  <el-select
+    value-key="id"
+    :multiple="multiple"
+    :value="selectValue"
+    clearable
+    @clear="handleClear"
+    @remove-tag="handleRemoveTag"
+    ref="select"
+  >
+    <el-tree
+      node-key="id"
+      show-checkbox
+      :data="options"
+      :defaultExpandedKeys="defaultExpandedKeys"
+      :props="defaultProps"
+      :check-strictly="checkStrictly"
+      @check-change="handleChange"
+      v-bind="$attrs"
+      v-on="$listeners"
+      ref="tree"
+    ></el-tree>
+  </el-select>
+</template>
+
+<script>
+import { getQuestionCategory } from '@/api/base.js'
+export default {
+  props: {
+    value: [String, Array],
+    multiple: { type: Boolean, default: false },
+    checkStrictly: { type: Boolean, default: true }
+  },
+  data() {
+    return {
+      selectValue: [],
+      options: [],
+      defaultExpandedKeys: []
+    }
+  },
+  watch: {
+    value: {
+      immediate: true,
+      handler() {
+        this.setChecked()
+      }
+    }
+  },
+  computed: {
+    activeProject() {
+      return this.$store.state.activeProject || {}
+    },
+    defaultProps() {
+      return { label: 'category_name', value: 'id' }
+    }
+  },
+  beforeMount() {
+    this.getQuestionCategory()
+  },
+  methods: {
+    getQuestionCategory() {
+      getQuestionCategory({ project_prefix: this.activeProject.tag }).then(res => {
+        this.$refs.select.options = res.data
+        this.options = res.data
+        this.$nextTick(this.setChecked)
+      })
+    },
+    setChecked() {
+      const RefTree = this.$refs.tree
+      if (!RefTree) {
+        return
+      }
+      const value = this.multiple && Array.isArray(this.value) ? this.value : [this.value]
+      // 设置选中项
+      RefTree.setCheckedKeys(value)
+      // 默认展开选中项
+      this.defaultExpandedKeys = value
+      // selectValue
+      const nodes = RefTree.getCheckedNodes()
+      const options = nodes.map(item => ({ value: item, currentLabel: item.category_name }))
+      if (this.$refs.select) {
+        this.$refs.select.cachedOptions = options
+      }
+      this.selectValue = this.multiple ? nodes : nodes.map(item => item.category_name)
+    },
+    handleChange(data, checked) {
+      const RefTree = this.$refs.tree
+      if (!this.multiple && checked) {
+        // 单选
+        RefTree.setCheckedNodes([data])
+      }
+      const checkedKeys = RefTree.getCheckedKeys()
+      this.handleUpdate(this.multiple ? checkedKeys : checkedKeys[0])
+    },
+    // 清除
+    handleClear() {
+      this.handleUpdate(this.multiple ? [] : '')
+    },
+    handleRemoveTag(data) {
+      const value = this.value.filter(id => id !== data.id)
+      this.handleUpdate(value)
+    },
+    handleUpdate(value) {
+      this.$emit('input', value)
+      this.$emit('change', value)
+    }
+  }
+}
+</script>

src/modules/paper/components/AutomaticPaper.vue

@@ -40,10 +40,11 @@
 
             <el-table-column align="center" label="题目类别">
               <template slot-scope="{ row, $index }">
-                <question-type-cascader
+                <question-type-treeselect
+                  multiple
                   v-model="row.question_categories"
                   @change="getQuestionMaxCount($index, row)"
-                ></question-type-cascader>
+                ></question-type-treeselect>
               </template>
             </el-table-column>
 
@@ -120,13 +121,13 @@
 </template>
 
 <script>
-import QuestionTypeCascader from '@/components/base/QuestionTypeCascader.vue'
+import QuestionTypeTreeselect from '@/components/base/QuestionTypeTreeselect.vue'
 import { getQuestionCount, updatePaperRules } from '../api.js'
 export default {
   props: {
     data: { type: Object, default: () => ({}) }
   },
-  components: { QuestionTypeCascader },
+  components: { QuestionTypeTreeselect },
   data() {
     const questionTypeMap = [
       { value: '1', label: '单选题' },
@@ -147,7 +148,7 @@ export default {
       question_difficulty: '',
       question_num: '',
       question_score: '',
-      question_categories: '',
+      question_categories: [],
       edit: true,
       max_question_num: 0
     }
@@ -230,7 +231,7 @@ export default {
     },
     // 新增
     handleAdd(index, row) {
-      if (!row.question_categories || !row.question_difficulty || !row.question_type) {
+      if (!row.question_categories.length || !row.question_difficulty || !row.question_type) {
         this.$message({
           message: '试题规则不能为空！',
           type: 'warning'
@@ -251,7 +252,7 @@ export default {
     handleSubmit() {
       const rules = []
       this.questionList.forEach(question => {
-        rules.push(Object.assign({}, question, { question_categories: [question.question_categories] }))
+        rules.push(Object.assign({}, question))
       })
       const parmas = { id: this.data.id, permission: this.form.permission, rules }
       updatePaperRules(parmas).then(res => {
@@ -263,10 +264,11 @@ export default {
     // 获取试题最大数量
     getQuestionMaxCount(index, row) {
       const params = Object.assign({}, this.form, row)
-      if (!row.question_categories || !row.question_difficulty || !row.question_type) {
+      if (!row.question_categories.length || !row.question_difficulty || !row.question_type) {
+        row.max_question_num = 0
+        row.question_num = row.max_question_num
         return
       }
-      params.question_categories = [row.question_categories]
       getQuestionCount(params).then(res => {
         row.max_question_num = res.data.count
         if (row.question_num > row.max_question_num) {

src/modules/paper/views/List.vue

@@ -8,7 +8,7 @@
         >
       </div>
       <template v-slot:filter-category="{ params }">
-        <question-type-cascader v-model="params.paper_category" @change="refetchList"></question-type-cascader>
+        <question-type-treeselect v-model="params.paper_category" @change="refetchList"></question-type-treeselect>
       </template>
       <template v-slot:table-x="{ row }">
         <el-button type="text" @click="handleUpdate(row)">编辑</el-button>
@@ -21,7 +21,7 @@
 
 <script>
 import { getPaperList, batchDeletePaper } from '../api'
-import QuestionTypeCascader from '@/components/base/QuestionTypeCascader.vue'
+import QuestionTypeTreeselect from '@/components/base/QuestionTypeTreeselect.vue'
 
 const paperType = [
   { label: '选题组卷', value: 1 },
@@ -29,7 +29,7 @@ const paperType = [
 ]
 
 export default {
-  components: { QuestionTypeCascader },
+  components: { QuestionTypeTreeselect },
   data() {
     return {
       multipleSelection: [] // 选择项

src/modules/paper/views/Update.vue

@@ -27,7 +27,7 @@
       <el-row>
         <el-col :span="12">
           <el-form-item label="试卷分类" prop="paper_category">
-            <question-type-cascader v-model="form.paper_category"></question-type-cascader>
+            <question-type-treeselect v-model="form.paper_category"></question-type-treeselect>
           </el-form-item>
         </el-col>
       </el-row>
@@ -134,11 +134,11 @@
 
 <script>
 import { getPaper, createPaper, updatePaper } from '../api'
-import QuestionTypeCascader from '@/components/base/QuestionTypeCascader.vue'
+import QuestionTypeTreeselect from '@/components/base/QuestionTypeTreeselect.vue'
 
 export default {
   props: { id: { type: String } },
-  components: { QuestionTypeCascader },
+  components: { QuestionTypeTreeselect },
   data() {
     return {
       form: {