插件修改

src/components/common/tree.vue

 <template>
   <q-card style="width: 360px;">
-    <q-select ref="select" v-model="chooseArray" size="small" :clearable="true" :multiple="multiple" :label="tipText"
-      @click.native="isShowSelect = !isShowSelect" option-value="value" option-label="label" :options="options"
-      :dense="false">
-    </q-select>
+    <q-input ref="selectTree" standout="bg-primary text-white" v-model="showMsg" :label="tipText"
+      @click.native="isShowSelect = !isShowSelect"  />
     <q-tree v-if="isShowSelect"
       style="width:100%;height:250px;overflow-y: scroll;position:absolute;z-index:99999;background:#fff;border:1px solid rgba(0, 0, 0, 0.12);"
       :nodes="treeData" :node-key="nodeKey" :label-key="labelKey" :children-key="childrenKey" tick-strategy="strict"
@@ -56,74 +54,103 @@
       return {
         //是否显示树状选择器
         isShowSelect: false,
-        options: [],
-        showValueTmp: '',
+        selectList: [],
         defaultProps: {
           children: 'children',
           label: 'label'
         },
-        chooseArray: []
+        showMsg: "",
+        chooseArray: [],
+        resultObj: {},
       }
     },
     watch: {
       isShowSelect(val) {
-        // 隐藏select自带的下拉框
-        this.$refs.select.blur();
+        //隐藏select自带的下拉框
+        this.$refs.selectTree.blur();
         if (val) {
           // 下拉面板展开-选中节点-展开节点
-          this.setTreeCheckNode(this.chooseArray);
+          this.setTreeCheckNode();
         }
       },
       chooseArray(val) {
-        if (this.multiple) {
-          this.$emit('update:id', this.chooseArray)
-        } else {
-          this.$emit('update:id', this.chooseArray[0])
+        if (!this.multiple && this.chooseArray && this.chooseArray.length > 1) {
+          var lastItem = this.chooseArray[this.chooseArray.length - 1];
+          this.chooseArray = [lastItem];
         }
         this.setTreeCheckNode()
       }
     },
     mounted() {
       // 把传进来的参数转成数组处理
-      if (this.multiple && Array.isArray(this.id)) {
-        this.chooseArray = this.id
-      } else {
-        this.chooseArray.push(this.id)
+      if (this.id) {
+        if (this.multiple && Array.isArray(this.id)) {
+          this.chooseArray = this.id
+        } else {
+          if (this.id != '') {
+            this.chooseArray.push(this.id)
+          }
+        }
       }
       this.setTreeCheckNode();
     },
     methods: {
-      //设置节点下拉框选择
+      //设置下拉框选择
       setTreeCheckNode() {
-        this.options = []
-        this.chooseArray.forEach(id => {
-          if (id != '') {
-            var tempStr = this.findTreeNode(this.treeData, id)
-            this.options.push({
-              value: id,
-              label: tempStr
-            });
-            console.log("this.options",this.options)
+        var that = this;
+        this.selectList = [];
+        if (this.multiple) {
+          this.resultObj = [];
+        } else {
+          this.resultObj = "";
+        }
+        this.showMsg = "";
+        var tempStr = "";
+        var nodes = this.findTreeNode(this.treeData);
+        if (this.chooseArray && this.chooseArray.length > 0 && nodes && nodes.length > 0) {
+          this.chooseArray.forEach(id => {
+            nodes.forEach((item, index) => {
+              if (item.value == id) {
+                this.selectList.push({
+                  value: item.value,
+                  label: item.label
+                });
+                tempStr += "," + item.label;
+                if (this.multiple) {
+                  this.resultObj.push(item.value);
+                } else {
+                  this.resultObj = item.value;
+                }
+              }
+            })
+          })
+          if (tempStr && tempStr != '') {
+            this.showMsg = tempStr.substring(1, tempStr.length);
           }
-        })
+        }
       },
-      //递归查询树形节点
-      findTreeNode(tree, id) {
-        if (tree && tree.length > 0) {
-            console.log("111")
-          for (var i = 0; i < tree.length; i++) {
-              console.log("222")
-            if (tree[i][this.nodeKey] === id) {
-                console.log("tree",tree[i][this.nodeKey]);
-                console.log("id",id);
-              return tree[i][this.labelKey]
-            } else if (tree[i][this.childrenKey] != null && tree[i][this.childrenKey].length > 0) {
-              return this.findTreeNode(tree[i][this.childrenKey], id)
+      //获取所有节点
+      findTreeNode(tree) {
+        var temp = [];
+        var that = this;
+        //获取子节点
+        var getChildNodes = function (tree) {
+          if (tree && tree.length > 0) {
+            for (var i = 0; i < tree.length; i++) {
+              var item = tree[i];
+              temp.push({
+                label: tree[i][that.labelKey],
+                value: tree[i][that.nodeKey]
+              });
+              if (tree[i][that.childrenKey]) {
+                getChildNodes(tree[i][that.childrenKey]);
+              }
             }
           }
-        }
-        return "";
-      },
+        };
+        getChildNodes(tree);
+        return temp;
+      }
     }
   }
 

src/pages/course/course.vue

@@ -8,7 +8,8 @@
         </div>
         <div class="col-3">
           <select-tree v-if="TreeCategoryList&&TreeCategoryList.length>0" :treeData='TreeCategoryList'
-            :id.sync="returnString" nodeKey="CateId" labelKey="CateName" childrenKey="ChildList"></select-tree>
+            :id.sync="returnString" nodeKey="CateId" :multiple="true" labelKey="CateName" childrenKey="ChildList"
+            tipText="课程分类"></select-tree>
         </div>
         <div class="col-3">
           <q-select @input="resetSearch" standout="bg-primary text-white" v-model="msg.Status" :options="ShowOpts"
@@ -171,9 +172,7 @@
         this.TreeCategoryList = [];
         var qMsg = {}
         queryCourseCategoryTree(qMsg).then(res => {
-
           this.TreeCategoryList = res.Data;
-
         })
       },
       //重新查询