未完善 先提交, 防止文件丢失

packages/layout/src/layout-query-form.vue

@@ -23,12 +23,64 @@
         v-model="params[item.field]"
         type="date"
         :placeholder="item.placeholder"/>
+<!--      级联组件-->
+      <el-cascader
+        v-else-if="item.type === 'cascader'"
+        v-model="params[item.field]"
+        :options="item.options"
+        @change="item.change"
+        clearable
+        :props="{
+          checkStrictly:item.checkStrictly,
+          multiple:item.multiple,//多选
+          expandTrigger:item.expandTrigger,
+          lazy:item.lazy?item.lazy:false,//懒加载
+          lazyLoad :(node, resolve)=>network().lazyLoad(node, resolve,item)//懒加载方法
+        }"
+        />
+<!--      树形组件-->
+      <el-tree
+        class="filter-tree"
+        v-else-if="item.type === 'tree'"
+        :data="item.data"
+        :load="(node, resolve)=>network().loadNode(node, resolve,item)"
+        :show-checkbox="item.showcheckbox"
+        :props="item.props"
+        :lazy="item.lazy"
+        :accordion="item.accordion"
+        :filter-node-method="filterNode(filterText,item.data)"
+        ref="tree"
+        @node-click="item.handleNodeClick"/>
+<!--      单选组件-->
+      <el-radio
+        v-else-if="item.type === 'radio'"
+        v-model="params[item.field]"
+        :disabled="item.disabled"
+        :border="item.border"
+        :label="item.label">
+        {{ '' }}
+       </el-radio>
+      <el-radio-group
+        v-else-if="item.type === 'radioGroup'"
+        v-model="radioGroup">
+      </el-radio-group>
+      <el-checkbox
+        v-else-if="item.type === 'checkbox'"
+        v-model="params[item.field]"
+        :disabled="item.disabled"
+        :border="item.border"
+        :label="item.label">
+        {{ '' }}
+      </el-checkbox>
+
+
       <el-input
         v-else
         v-model="params[item.field]"
         :placeholder="item.placeholder === null ? '请输入...' : item.placeholder "
         clearable
         @change="item.change"
+        @input="getValue(params[item.field])"
         @keyup.enter.native="() => handler().query()"
       />
     </el-form-item>
@@ -41,6 +93,8 @@
 
 <script>
 import { getDicts } from '@/api/system/dict/data'
+import { getToken } from '@/utils/auth' // 验权
+import request from '@/utils/request'
 export default {
   props: {
     props: {
@@ -49,17 +103,24 @@ export default {
         return {}
       },
     },
+
   },
   dicts: [],
   data() {
     return {
+      loadUrl:undefined,
       params: {},
+      filterText:'',
     }
   },
   watch: {
     props() {
       this.init().params(this.props)
     },
+    filterText(val) {
+      console.log( this.$refs.tree,123456)
+      this.$refs.tree.filter(val);
+    }
   },
   computed: {
     formItem() {
@@ -74,6 +135,30 @@ export default {
     this.init().params(this.props)
   },
   methods: {
+    getValue(value){
+       this.filterText=value
+      console.log( this.filterText,888888)
+    },
+
+
+    /**
+     * 节点过滤
+     * @param value
+     * @param data
+     * @returns {boolean}
+     */
+    /*filterNode(value, data) {
+      console.log(value,1236)
+      if (!value) return true;
+      return data.label.indexOf(value) !== -1;
+
+    },*/
+    filterNode ( value, data ) {
+      console.log(value,1236)
+      console.log(data,7777)
+      if ( !value ) return true
+      return data.label.indexOf( value ) !== -1
+    },
     init() {
       return {
         // 初始化参数
@@ -99,6 +184,7 @@ export default {
           })
           this.params = params
         },
+
       }
     },
     handler() {
@@ -114,6 +200,65 @@ export default {
         },
       }
     },
+    network(){
+      return{
+        /**
+         * 级联选择器懒加载
+         * @param node
+         * @param resolve
+         * @param item
+         */
+        lazyLoad: (node, resolve,item) =>{
+          request({
+            url:  item.loadUrl+node.value,
+            method: 'get',
+            params: {}
+          }).then((res)=>{
+              resolve(res)
+            }
+          )
+        },
+        /**
+         * 树形组件 懒加载
+         * @param node
+         * @param resolve
+         * @param item
+         */
+        loadNode:(node, resolve, item) =>{
+          request({
+            url: item.loadUrl + node.data.value,
+            method: 'get',
+            params: {}
+          }).then((response) => {
+              let data=[]
+              let res=[]
+              res=response;
+              for (let i = 0; i < res.length; i++) {
+                if (res[i].isLeaf) {
+                  let param={
+                    'value':res[i].value,
+                    'label':res[i].label,
+                    'isLeaf':res[i].isLeaf
+                  }
+                  data.push(param)
+                }else {
+                  let param={
+                    'value':res[i].value,
+                    'label':res[i].label,
+                    'isLeaf':res[i].isLeaf,
+                    'children':res[i].children
+                  }
+                  data.push(param)
+                }
+              }
+              resolve(data);
+            }
+          )
+        },
+
+
+      }
+    }
   },
 }
-</script>
\ No newline at end of file
+</script>