新增下拉树组件

src/benyun/components/byForm/byForm.vue

@@ -124,6 +124,18 @@ export default class ByForm extends VueViews {
     return (this as any).$lodash.cloneDeep(this.value);
   }
 
+  setConfigAfter(){
+    if(this.columns.length > 0){
+      for(const itemData of this.columns){
+        for(const item of itemData){
+          if(this.$refs[item.prop+'Comp'] && (this.$refs[item.prop+'Comp'] as any)[0] && (this.$refs[item.prop+'Comp'] as any)[0].setConfig){
+            (this.$refs[item.prop+'Comp'] as any)[0].setConfig(item.compConfig)
+          }
+        }
+      }
+    }
+  }
+
   //清除下级组件组件值
   clearChildrenComp(){
     for(const key in this.$refs){
@@ -148,14 +160,23 @@ export default class ByForm extends VueViews {
   //表单数据变化
   onChange(v:any,config:any){
     let code = config.prop;
-    if(this.value[code]){
-      this.value[code] = v;
+    if (v && (v as any).constructor === Object){
+      for(const key in v){
+        this.changeSetValue(key,v[key])
+      }
     }else{
-      Vue.set(this.value, code, v);
+      this.changeSetValue(code,v)
     }
+    
     this.$emit('formChange',{value:v,code:code})
   }
-
+  changeSetValue(code:string,v:any){
+    if(this.value[code]){
+      this.value[code] = v;
+      }else{
+        Vue.set(this.value, code, v);
+      }
+  }
   //表单验证
   validate():Promise<any>{
     return new Promise((resolve:Function, reject:Function) => {

src/benyun/components/selectTree/selectTree.vue

@@ -0,0 +1,117 @@
+<template>
+  <el-popover
+    :placement="attrs.placement?attrs.placement:'bottom-start'"
+    :width="attrs.width?attrs.width:'300'"
+    trigger="click"
+    >
+    <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" highlight-current node-key="id"></el-tree>
+    <el-input v-model="value" slot="reference" readonly :placeholder="attrs.placeholder?attrs.placeholder:'请选择'" :clearable="attrs.clearable" suffix-icon="el-icon-arrow-down"></el-input>
+  </el-popover>
+</template>
+
+<script lang="ts">
+/*
+  配置说明
+  config:{
+    attrs:{
+      retConfig:{
+        retLabel:'name'  //返回的值(示例)
+        retValue:'id'  //返回的值(示例)
+      }
+      width：''  //宽度
+      placement:'' //方向
+      clearable：true/false  //是否清空
+      placeholder：''  //占位符
+      label:''  //标签
+      children:'' //下一级
+    },
+    request:{}
+  }
+*/
+import { Component, Prop, Vue, Watch } from "vue-property-decorator";
+import VueViews from '@/benyun/compVue/VueViews'
+@Component
+export default class SelectTree extends VueViews {
+  data:Array<any>=[]
+
+  get defaultProps(){
+    let c:any={
+      children: 'children',
+      label: 'label'
+    }
+    if(this.attrs.label){
+      c.label = this.attrs.label
+    }
+    if(this.attrs.children){
+      c.children = this.attrs.children
+    }
+    return c;
+  }
+
+  created(){
+    if(this.propConfig){
+      this.setConfig(this.propConfig)
+    }
+    if(this.propValue){
+      this.setValue(this.propConfig)
+    }
+  }
+
+  mounted(){
+    this.$nextTick(()=>{
+      if(this.requestConfig){
+        this.request();
+      }else if(this.attrs.data){
+        this.setData(this.attrs.data)
+      }
+    })
+  }
+
+  setData(data:Array<any>){
+    this.data = data;
+  }
+
+  setValue(v:any){
+    this.value = v;
+  }
+
+  getValue(){
+    return this.value;
+  }
+
+  handleNodeClick(data:any){
+    this.value = data[this.defaultProps.label];
+    let obj:any = {};
+    try{
+      if(this.attrs.retConfig){
+        for(const key in this.attrs.retConfig){
+          obj[key] = data[this.attrs.retConfig[key]]
+        }
+      }
+    }catch(e){
+      console.log('selectTree:retConfig报错！')
+    }
+    this.$emit('onChange',obj);
+    this.$emit('handleNodeClick',data);
+  }
+
+   //请求url
+   request(){
+    if(!this.requestConfig || !this.requestConfig.url){
+      return
+    }
+    let parame = (this as any).$lodash.cloneDeep(this.requestConfig);
+    parame.success = (res:any) => {
+      if(res.data){
+        this.setData(res.data);
+      }
+    }
+    parame.fail = (err:any) => {}
+    this.requestHandle(parame);
+  }
+}
+</script>
+
+<style lang="sass" scoped>
+
+</style>

src/benyun/plugins/componentRegister.ts

@@ -35,6 +35,10 @@ const comps: Array<ComBase> = [
     name: "byBill",
     component: () => import("@/benyun/components/byBill/byBill.vue"),
   },
+  {
+    name: "selectTree",
+    component: () => import("@/benyun/components/selectTree/selectTree.vue"),
+  },
 ];
 
 const install = function (Vue: any) {

src/views/demo/form.vue

@@ -103,6 +103,24 @@ export default class DemoForm extends Vue {
         labelWidth:'0px',
         slot:true,
         prop:'slotField',
+      }],
+      [{
+        span:6,
+        label:'树形',
+        prop:'tree',
+        component:'select-tree',
+        compConfig:{
+          attr:{
+            label:'name',
+            retConfig:{
+              treeName:'name',
+              treeId:'id'
+            }
+          },
+          request:{
+            url:'/maindata/maindataMaterialOrganizationCategory/treeList'
+          }
+        }
       }]
     ]
   }