| | |
| | | <template> |
| | | <avue-input-tree :props="props" :lazy="lazy" :tree-load="treeLoad" :leaf-only="!referConfig.onlyLeaf" :multiple="isMuti" v-model="value" :placeholder="placeholder" :dic="treeData"></avue-input-tree> |
| | | <avue-input-tree ref="referTree" :props="props" :disabled="disabled" :lazy="lazy" :tree-load="treeLoad" :node-click="nodeClick" :checked="checked" :blur="valueChange" :leaf-only="referConfig.onlyLeaf" :multiple="isMuti" v-model="value" :placeholder="title" :dic="treeData"></avue-input-tree> |
| | | </template> |
| | | |
| | | <script> |
| | | import {getTree,getLazyTree} from "@/api/refer/tree"; |
| | | import {validatenull} from "@/util/validate"; |
| | | |
| | | export default { |
| | | name: "vciWebReferTree", |
| | | props:["referConfig","value"], |
| | | props:["referConfig","value","text","title","disabled"], |
| | | data() { |
| | | return { |
| | | options: this.referConfig.options, |
| | | lazy: this.referConfig.options.loadType == 'node', |
| | | isMuti: this.referConfig.isMuti, |
| | | placeholder: this.referConfig.placeholder || '请选择内容', |
| | | isMuti:("true" == this.referConfig.options.isMuti || this.referConfig.options.isMuti == true || this.referConfig.options.muti == true) ? true : false, |
| | | props: { |
| | | value: this.referConfig.valueField || this.referConfig.options.valueField || 'oid', |
| | | label: this.referConfig.textField || this.referConfig.options.textField || "name" |
| | | //value:"value", |
| | | //label:"title" |
| | | value: 'oid', |
| | | label: "name" |
| | | }, |
| | | treeUrl: this.referConfig.options.url || '',//'/api/ubcs-code/codeClassify/treeCodeClassify', |
| | | config:{ |
| | | valueField: this.referConfig.valueField || this.referConfig.options.valueField || 'oid', |
| | | textField:this.referConfig.textField || this.referConfig.options.textField || "name", |
| | | textSep:this.referConfig.textSep || ' ' |
| | | }, |
| | | treeUrl: this.referConfig.options.url || '/api/ubcs-code/mdmEngineController/defaultReferTree', |
| | | treeData: [], |
| | | checkedData:[], |
| | | currentNode:{}, |
| | | params: {}, |
| | | loadType: {'all': 'all', 'node': 'node'}, |
| | | copyParam: ['btmType', 'lnType', 'toBtmType', 'textField', 'valueField', 'parentFieldName', 'parentValue', 'sort', 'order', 'isDirection', 'whereSql', 'isMuti', 'queryScheme', 'isQueryAllColumn', 'queryColumn', 'split', 'loadType', 'onlyLeaf', 'onlyLeafText', 'parentUsedField'] |
| | |
| | | } |
| | | } |
| | | }, |
| | | computed:{}, |
| | | methods: { |
| | | getParams:function (){ |
| | | var queryParams = {}; |
| | | debugger; |
| | | if(this.options.extraParams){ |
| | | queryParams = this.options.extraParams; |
| | | } |
| | |
| | | } |
| | | } |
| | | queryParams['referBo'] = this.options['referBo'] || this.options['referType']; |
| | | queryParams['referType']= queryParams['referBo'] |
| | | queryParams['selectAllLevel'] = (this.options.loadType == this.loadType.all?true:false);//true时后台会报错 |
| | | if(queryParams.isMuti =="true"){ |
| | | queryParams.muti =true; |
| | | } |
| | | |
| | | queryParams.muti =this.isMuti; |
| | | if(queryParams.isQueryAllColumn =="true"){ |
| | | queryParams.isQueryAllColumn = true; |
| | | } |
| | |
| | | queryParams['loadType'] = this.options.loadType; |
| | | queryParams['multipleSelect'] = this.isMuti; |
| | | queryParams['isMuti'] = queryParams['multipleSelect']; |
| | | if (this.options.remoteSort && this.options.initSort) { |
| | | if (this.options.initSort) { |
| | | queryParams['order'] = this.options.initSort.type;//方法 |
| | | queryParams['sort'] = this.options.initSort.field;//字段 |
| | | } |
| | | if(this.options.sortField){ |
| | | queryParams['sort'] = this.options.sortField;//字段 |
| | | } |
| | | if(this.options.sortType){ |
| | | queryParams['order'] = this.options.sortType;//方法 |
| | | } |
| | | if (this.options.rootParams) { |
| | | for (var key in this.options.rootParams) { |
| | |
| | | this.params=queryParams; |
| | | |
| | | }, |
| | | getTree(){ |
| | | getTree(this.params,this.treeUrl).then(res => { |
| | | this.treeData=res.data |
| | | getTree() { |
| | | getTree(this.params, this.treeUrl).then(res => { |
| | | res.data.map(item => { |
| | | if (!item.attribute) { |
| | | item.attribute = { |
| | | data: {} |
| | | } |
| | | } else { |
| | | item.attribute.data = item.attribute.data || {} |
| | | } |
| | | return { |
| | | ...item, |
| | | leaf: !item.hasChildren |
| | | } |
| | | }) |
| | | this.treeData = res.data |
| | | }) |
| | | }, |
| | | treeLoad: function (treeNode, resolve) { |
| | | const parentOid = (treeNode.level === 0) ? 0 : treeNode.data.oid; |
| | |
| | | } |
| | | getLazyTree(this.params,this.treeUrl).then(res => { |
| | | resolve(res.data.data.map(item => { |
| | | if(!item.attribute){ |
| | | item.attribute={ |
| | | data:{} |
| | | } |
| | | }else{ |
| | | item.attribute.data=item.attribute.data || {} |
| | | } |
| | | return { |
| | | ...item, |
| | | leaf: !item.hasChildren |
| | | } |
| | | })) |
| | | }); |
| | | } |
| | | }, |
| | | nodeClick(data, node, nodeComp){ |
| | | if(!this.isMuti) { |
| | | this.setValue({checkedNodes:[data]}) |
| | | } |
| | | }, |
| | | checked(checkedNode, checkedData) { |
| | | this.checkedData=checkedData |
| | | }, |
| | | valueChange(){ |
| | | if(this.isMuti){ |
| | | // this.setValue(this.checkedData) |
| | | } |
| | | }, |
| | | setValue:function (checkedData){ |
| | | var value = []; |
| | | var text = []; |
| | | const textSep =this.config.textSep; |
| | | for(var j =0;j<checkedData.checkedNodes.length;j++){ |
| | | const item=checkedData.checkedNodes[j]; |
| | | var v=this.config.valueField.indexOf("attribute.")>=0?(item.attributes[this.config.valueField.replace("attribute.","")] || item.attributes.data[this.config.valueField.replace("attribute.","")]):(item.attributes[this.config.valueField] || item[this.config.valueField] || item.attributes.data[this.config.valueField]) |
| | | value.push(v); |
| | | var tempRaw = []; |
| | | var textFieldArray = this.config.textField.split(","); |
| | | for (var i = 0; i < textFieldArray.length; i++) {//显示的字段可能有多个 |
| | | if (!validatenull(textFieldArray[i])) { |
| | | var t=textFieldArray[i].indexOf("attribute.")>=0?(item.attributes[textFieldArray[i].replace("attribute.","")] ||item.attributes.data[textFieldArray[i].replace("attribute.","")]):(item.attributes[textFieldArray[i]] || item[textFieldArray[i]] || item.attributes.data[textFieldArray[i]]) |
| | | tempRaw.push(t); |
| | | } |
| | | } |
| | | text.push(tempRaw.join(textSep)); |
| | | } |
| | | let mapFields =this.referConfig.fieldMap || {}; |
| | | try { |
| | | if(!validatenull(this.options.mapFields)){ |
| | | mapFields =Object.assign(this.referConfig.fieldMap,JSON.parse(this.options.mapFields)) ; |
| | | } |
| | | }catch (e) { |
| | | |
| | | } |
| | | } |
| | | this.value = value.join(','); |
| | | this.text = text.join(','); |
| | | this.$emit("setValue", { |
| | | field: this.referConfig.field, |
| | | showField: this.referConfig.showField, |
| | | value: this.value, |
| | | text: this.text || '', |
| | | isTreeMuti:this.isMuti, |
| | | rawData: checkedData.checkedNodes, |
| | | fieldMap:mapFields |
| | | }); |
| | | } |
| | | }, |
| | | watch:{} |
| | | } |
| | | </script> |
| | | |