centaline-data-driven 1.6.44 → 1.6.45

package/src/centaline/dynamicTagsNew/src/dynamicTagsNew.vue

@@ -0,0 +1,336 @@
+<template>
+  <div class="field-top-noimportant">
+    <div class="ccai ct-tags" style="width:100%;display:flex">
+      <div style="flex:1;display:flex;margin-right: 5px;" :class="[(focus || showDrop)?'isfocus':'',model.attrs.size?'ct-tags-'+model.attrs.size:''
+    ]" @mouseover="mouseOverHandle" @mouseout="mouseOutHandle">
+        <div style="flex:1;position: relative;" :class="[model.showLabel?'el-input-group el-input-group--prepend':'',!valid?'inputError':'']">
+          <div v-if="model.showLabel && model.label" class="el-input-group__prepend" :class="[model.labelClass]">
+            {{model.label}}
+          </div>
+          <el-select ref="refselect" :key="model.itemKey" v-model="model.value" :no-data-text="nodatatext"
+            :disabled="model.locked" :placeholder="soPlaceholder" :clearable="model.clearable" style="width:100%"
+            :filter-method="getOptions" :filterable="model.filterable" :multiple="model.multiple" 
+            @change="tagsChange" @clear="clearClickHandle" @focus="clickHandle" @visible-change="visibleChange"
+            @compositionstart="handleCompositionStart" @compositionend="handleCompositionEnd">
+            <el-option v-for="item in model.options" :key="item.code" :label="item.name" :value="item.code">
+              <el-tooltip :disabled="!item.toolTip" :content="item.toolTip" placement="right">
+                <span v-html="item.displayName || item.name"></span>
+              </el-tooltip>
+            </el-option>
+          </el-select>
+        </div>
+        <span v-show="!valid" class="errorMessage">
+          {{validMessage}}
+        </span>
+      </div>
+
+      <div v-if="model.popupSearchListType === 1 && !model.lock">
+        <el-button v-if="!model.moreActionBtnName" class="h26" size="mini" type="primary" icon="el-icon-search" @click="popupSearchListHandle"></el-button>
+        <el-button v-else size="mini" type="primary" class="h26" @click="popupSearchListHandle">{{model.moreActionBtnName}}</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import dynamicElement from '../../mixins/dynamicElement'
+  export default {
+    name: 'ct-tagsNew',
+    mixins: [dynamicElement],
+    components: {
+    },
+    props: {
+      api: String,
+      vmodel: Object,
+      popShow: {
+        type: Boolean,
+        default: true
+      }
+    },
+    data() {
+      return {
+        focus: false,
+        showDrop: false,
+        showClear: false,
+        nodatatext:'    ',
+        open:false,
+        isComposing: false,
+      }
+    },
+    created() {
+      if (typeof this.vmodel === 'undefined') {
+        this.model = this.loaderObj.TagsNew(this.source);
+      }
+      else {
+        this.model = this.vmodel;
+      }
+      this.model.$self=this;
+      this.showPrefix();
+    },
+    destroyed (){
+      this.model = null;
+      this.$el = null;
+    },
+    computed: {
+      soPlaceholder: {
+        get: function () {
+          if (this.model.value.length > 0) {
+            return '';
+          }
+          else {
+            return this.model.label;
+          }
+        },
+        set: function (v) {
+
+        }
+      },
+    },
+    mounted() {
+    },
+    methods: {
+      getOptions: function (query) {
+        if(!this.isComposing){
+          this.model.getOptions(this.api, query);
+        }
+      },
+      handleCompositionStart() {
+        this.isComposing = true;
+      },
+      handleCompositionEnd() {
+        this.isComposing = false;
+      },
+      visibleChange() {
+        if (this.model.popupSearchListType === 1){
+          this.$refs.refselect.popperElm.hidden = true
+        }
+      },
+      showPrefix(){
+        if(this.$refs.refselect && this.$refs.refselect.$refs.tags 
+          && this.model.isList 
+          && this.model.attrs.placeholder 
+          && this.model.displayLabelAfterSelected 
+        ){
+          if(this.model.value && this.model.value.length>0){
+            if(!this.model.isShowPrefix){
+              const newElement = document.createElement('span');
+              newElement.textContent = '楼盘名称:';
+              newElement.style.fontSize='small';
+              this.$refs.refselect.$refs.tags.prepend(newElement);
+              this.model.isShowPrefix=true;
+            }
+          }
+          else{
+            this.$refs.refselect.$refs.tags.firstChild.remove();
+            this.model.isShowPrefix=false;
+          }
+        }
+      },
+      tagsChange: function () {
+        this.model.setCode();
+        this.showPrefix();
+        
+        this.inputHandler(this.model.value);
+        this.changeHandler(this.model.value);
+        if(this.model.autoSearch) this.$emit('click');
+      },
+      focusHandle: function () {
+        this.$set(this, 'focus', true);
+      },
+      blurHandle: function () {
+        this.$set(this, 'focus', false);
+      },
+      clickHandle: function () {
+        if (this.model.lock) {
+          return false;
+        }        
+        if (this.model.paramName) {
+          this.$set(this, 'showDrop', !this.showDrop);
+          if (this.showDrop) {
+            this.getOptions();
+          }
+          this.focusHandle();
+        }
+        else if(this.model.popupSearchListType === 1) {
+          this.popupSearchListHandle();
+        }
+        else if ((this.model.popupSearchListType === 0)) {
+          this.$message({
+            message: "请配置参数paramName1",
+            type: 'warning',
+            showClose:true,
+          });
+        }
+      },
+      popupSearchListHandle: function () {
+        var self = this;
+        self.showDrop=false;
+        self.$emit('popupSearchList', false, self.model, self.model.moreActionRouter, (optionArr) => {
+          self.selectOptionArr(optionArr);
+        });
+      },
+      resize() {
+      },
+      deleteOption(value, event) {
+        var self = this;
+        this.model.value.splice(
+          this.model.value.findIndex(
+            (v) => {
+              return v === value;
+            }
+          )
+          , 1);
+        self.resize();
+        if (event) {
+          event.stopPropagation();
+        }
+        this.tagsChange();
+        this.$emit('input', this.model.value);
+      },
+      selectOption(value) {
+        if (this.model.value.find((v) => { return v === value })) {
+          if(this.model.lockedValue && this.model.lockedValue.length>0 && this.model.lockedValue.includes(value)){
+          }
+          else{
+            this.deleteOption(value);
+          }
+        }
+        else {
+          this.model.value.push(value);
+        }
+        this.resize();
+        this.tagsChange();
+        this.$emit('input', this.model.value);
+      },
+      selectOptionArr(optionArr) {
+        var self = this;
+        optionArr.forEach((s) => {
+          if (!self.model.value.find((v) => { return v === s.code })) {
+            let op={};
+            op.code=s.code;
+            op.name=s.name;
+            op.rowID='';
+            op.flagDeleted=false;
+            self.model.options.push(op);
+            self.model.value.push(s.code);
+          }
+        });
+
+        self.resize();
+        self.tagsChange();
+        self.$emit('input', self.model.value);
+      },
+      mouseOverHandle: function () {
+        if (this.model.value.length > 0 && this.model.clearable) {
+          this.$set(this, 'showClear', true);
+        }
+      },
+      mouseOutHandle: function () {
+        this.$set(this, 'showClear', false);
+      },
+      clearClickHandle: function (event) {
+        var self =this;
+        this.model.reset();
+        if(this.model.lockedValue.length>0){
+          this.model.lockedValue.forEach((v) => {
+            self.model.value.push(v);
+          });          
+        }
+        this.resize();
+        this.tagsChange();
+        this.$emit('input', this.model.value);
+      },
+    },
+    watch: {
+      popShow: function (newV, oldV) {
+        this.resize();
+      }
+    }
+  }
+</script>
+<style>
+      .ct-tags .ct-input_inner::-webkit-input-placeholder {
+        color: var(--bagGray);
+      }
+
+      .ct-tags .ct-input_inner::-moz-placeholder {
+        color: var(--bagGray);
+      }
+
+      .ct-tags .ct-input_inner:-ms-input-placeholder {
+        color: var(--bagGray);
+      }
+
+      .ct-tags .ct-input_inner:hover {
+        border-color: var(--bagGray); /*border-color:var(--bagGray)*/
+      }
+
+    .ct-tags.isfocus .ct-input_inner:hover {
+      border-color: var(--centalineBlue); /*border-color:var(--bagGray)*/
+    }
+
+    .ct-tags.isfocus .ct-input_inner {
+      border-color: var(--centalineBlue);
+    }
+
+    .ct-tags .el-input__suffix {
+      right: 10px;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .ct-tags .el-select__caret {
+      color: #BBBBBB;
+      font-size: inherit;
+      -webkit-transition: -webkit-transform .3s;
+      transition: -webkit-transform .3s;
+      transition: transform .3s;
+      transition: transform .3s, -webkit-transform .3s;
+      transition: transform .3s,-webkit-transform .3s;
+      -webkit-transform: rotateZ(180deg);
+      transform: rotateZ(180deg);
+      cursor: pointer;
+    }
+
+    .ct-tags .is-reverse {
+      -webkit-transform: rotateZ(0deg);
+      transform: rotateZ(0deg);
+    }
+
+    .ct-tags .el-tag {
+      -webkit-box-sizing: border-box;
+      box-sizing: border-box;
+      border-color: transparent;
+      margin: 2px 0 2px 1px;
+      background-color: #f0f2f5;
+    }
+
+    .ct-tags.ct-tags-mini {
+      font-size: 12px;
+    }
+
+    .ct-tags.ct-tags-small {
+      font-size: 13px;
+    }
+
+    .ct-tags.ct-tags-medium {
+      font-size: 14px;
+    }
+
+  .ct-option {
+    margin: 5px;
+    cursor:pointer;
+  }
+  .ct-tags .ct-close > .el-select__caret.is-show-close:hover {
+    color: var(--centalineMediumGray);
+  }
+  .ct-tags-value-label {
+    /* padding-left: 15px; */
+    font-size: small;
+  }
+  .h26{
+  height: 26px;
+}
+</style>

package/src/centaline/loader/src/ctl/Form.js

@@ -262,6 +262,21 @@ const Form = function (source, callBack, apiParam, failCallBack, isFormList) {
             }
 
             rtn1.source[attrKey] = attrValue;
+            if (rtn1.source.controlType === 23) {
+              if (rtn1["options"].length == 0) {
+                rtn1["options"] = [{ code: '', name: '', value: '', label: '' }];
+              }
+              if (attrKey == 'code1') {
+                rtn1["value"] = attrValue;
+                rtn1["options"][0]["code"] = attrValue
+                rtn1["options"][0]["value"] = attrValue
+              }
+              if (attrKey == 'name1') {
+                rtn1["options"][0]["name"] = attrValue
+                rtn1["options"][0]["label"] = rtn1.prefix+attrValue
+              }
+              if (rtn1.itemKey) rtn1.itemKey = Math.random()
+            }
             this.form.hatchHandle(id, attrKey, attrValue, rtn1);
 
             //用于处理源数据改动,强制更新视图数据 todo

package/src/centaline/loader/src/ctl/SosNew.js

@@ -0,0 +1,101 @@
+import base from '../../index';
+import Base from './Base';
+import valid from '../../../validate/index';
+import Axios from 'axios';
+import common from '../../../common';
+import Vue from 'vue';
+const SosNew = function (source, moreActionRouter) {
+  var rtn = {
+    itemKey : Math.random(),
+    options: [{ code: source.code1, name: source.name1, value: source.code1, label: (source.isList && source.placeholder1 && source.displayLabelAfterSelected && source.code1?source.placeholder1 + ":":'')+source.name1 }],
+    get filterable() {
+        return true;
+    },
+    get multiple() {
+      return false;
+    },
+    get prefix() {
+      if (source.isList && source.placeholder1 && source.displayLabelAfterSelected && rtn.value) {
+        return source.placeholder1 + ":";
+      }
+      return '';
+    },
+   
+    get parentName() {
+      return source.parentField;
+    },
+    defaultText: source.defaultName1,
+    get labelValue() {
+      if (source.name1) {
+        return source.name1;
+      }
+      else {
+        return '';
+      }
+    },
+    optionAttrs: {
+      value: 'code',
+      label: 'name',
+      displayLabel:'displayName',
+      actionType: 'actionType',
+      flagDeleted: 'flagDeleted'
+    },
+    get clearable() {
+      if (typeof source.clear === 'undefined') {
+        return true;
+      }
+      if (source.clear) {
+        return true;
+      }
+      else {
+        return false;
+      }
+    },
+    set clearable(v) {
+      source.clear = v;
+    },
+    getOptions(paramsAction,key) {
+      var self = this;
+      var apiAddrs = paramsAction || this.api;
+      var params = {
+        action: apiAddrs,
+        para: {
+          paramName: self.paramName,
+          parentValue: rtn.getFormParentFieldPara(),
+          key: key,
+          extraData: rtn.getFormRefFieldPara()
+        }
+      };
+      Vue.prototype.$api.postHandler(common.globalUri(), params).then((response) => {
+        if (response.rtnCode === 200) {
+          self.options = response.content;
+          self.options.forEach(item => {
+            item.value=item.code;
+            item.label=self.prefix +item.name;
+          });
+        }
+      });
+    },
+    moreActionRouter: moreActionRouter,//更多高级查询
+    //弹出SearchList类型，0不弹框，1点按钮弹框，2直接点搜索框弹框
+    get popupSearchListType() {
+      if (moreActionRouter) {
+        return 1;
+      }
+
+      return 0;
+    },
+    get moreActionBtnName() {
+      if (moreActionRouter) {
+        return moreActionRouter.label;
+      }
+
+      return null;
+    },
+  };
+  rtn = base.copy(Base(source), rtn);
+  rtn = base.copy(rtn, valid.Init(rtn));
+  return rtn;
+}
+
+export default SosNew;

package/src/centaline/loader/src/ctl/TagsNew.js

@@ -0,0 +1,222 @@
+import base from '../../index';
+import Base from './Base';
+import valid from '../../../validate/index';
+import common from '../../../common';
+import Vue from 'vue';
+import Enum from './lib/Enum';
+const TagsNew = function (source, moreActionRouter) {
+  var rtn = {
+    itemKey : Math.random(),
+    isShowPrefix : false,
+    get filterable() {
+      return true;
+    },
+    get multiple() {
+      return true;
+    },
+    options: source.code1 === '' ? [] : [].concat(JSON.parse(source.code1)),
+    _lockedValue: null,
+    _value: null,
+    get value() {
+      if (this._value !== null) {
+        return this._value;
+      }
+      else {
+        this._value = [];
+        if(source.code1){
+          JSON.parse(source.code1).forEach((v) => {
+            if (v.flagDeleted !== 1) {
+              if(v.flagDeleted!=undefined && v.flagDeleted==true){
+              }
+              else{
+                this._value.push(v.code);
+              }
+            }
+          });
+        }
+        return this._value;
+      }
+    },
+    set value(v) {
+      this._value = v;
+    },    
+    get labelValue() {
+      if (source.code1 && rtn.multiple) {
+        let rtnLabelValue = [];
+        JSON.parse(source.code1).forEach((op) => {
+            if (op.flagDeleted !== 1) {
+              if (op.flagDeleted != undefined && op.flagDeleted == true) {
+              }
+              else {
+                rtnLabelValue.push(op)
+              }
+            }
+        });
+        return rtnLabelValue;
+      }
+      else {
+        return [];
+      }
+    },
+   //初始数据
+    get globalOptions() {
+      if (rtn.multiple) {
+          if (source.code1 === '') {
+              return []
+          }
+          else {
+              return [].concat(JSON.parse(source.code1));
+          }
+      }
+      return []
+    },
+    //重新赋值code1
+    setCode() {
+      let currentOptions = this.labelValue.filter((v) => {
+          return this.value.indexOf(v['code']) > -1;
+      });
+      let currentOptions1 = this.options.filter((v) => {
+          return this.value.indexOf(v['code']) > -1;
+      });
+      currentOptions1.forEach((v) => {
+        let item = currentOptions.find((v1) => {
+          return v1.code === v.code;
+        });
+        if (!item) {
+          currentOptions.push(v)
+        }
+      });
+
+      if (source.code1 != '') {
+        let checked = JSON.parse(source.code1 || '[]')
+        checked.forEach((v) => {
+          let item = rtn.globalOptions.find((v1) => {
+              return v1.code === v.code;
+          });
+          if (item && this.value.indexOf(v['code']) < 0) {
+              if (!item.locked) {
+                  v['flagDeleted'] = true;
+              }
+          }
+          else {
+              return
+          }
+          currentOptions.push(v)
+        });
+        source.code1 = JSON.stringify(currentOptions);
+      }
+      else {
+        source.code1 = JSON.stringify(currentOptions);
+      }
+
+      this.labelValue = currentOptions.filter((v) => {
+          return !v.flagDeleted;
+      });
+    },
+
+
+    get valueLabel() {
+      if (source.isList && this.value.length > 0 && rtn.attrs.placeholder) {
+        return rtn.attrs.placeholder + ":";
+      }
+      return '';
+    },
+    get parentName() {
+      return source.parentField;
+    },
+    attrs: {
+      style: {
+        width: '100%'
+      },
+      clearable: true
+    },
+    apiParams: {
+      paramName: 'k',
+      parentName: 'pk',
+      parentValue: 'pv',
+      search: 't'
+    },
+    get defaultValue() {
+      var rtnArr = [];
+      if (this.defaultText !== '') {
+        [].concat(JSON.parse(this.defaultText)).forEach((v) => {
+          rtnArr.push(v.code);
+        });
+      }
+      return rtnArr;
+    },
+    defaultText: source.code1,
+    get clearable() {
+      if (typeof source.clear === 'undefined') {
+        return true;
+      }
+      if (source.clear) {
+        return true;
+      }
+      else {
+        return false;
+      }
+    },
+    set clearable(v) {
+      source.clear = v;
+    },
+    get searchTick() {
+      return parseInt(source.searchTick) || 250;
+    },
+    set searchTick(v) {
+      source.searchTick = v;
+    },
+    getOptions(paramsAction, key) {
+      var self = this;
+      var apiAddrs = paramsAction || this.api;
+      var params = {
+        action: apiAddrs,
+        para: {
+          paramName: self.paramName,
+          parentValue: rtn.getFormParentFieldPara(),
+          key: key,
+          extraData: rtn.getFormRefFieldPara()
+        }
+      };
+      Vue.prototype.$api.postHandler(common.globalUri(), params).then((response) => {
+        if (response.rtnCode === Enum.ReturnCode.Successful) {
+          self.options = response.content;
+        }
+      });
+    },
+    moreActionRouter: moreActionRouter,//更多高级查询
+    //弹出SearchList类型，0不弹框，1点按钮弹框，2直接点搜索框弹框
+    get popupSearchListType() {
+      if (moreActionRouter) {
+        return 1;
+      }
+
+      return 0;
+    },
+    get moreActionBtnName() {
+      if (moreActionRouter) {
+        return moreActionRouter.label;
+      }
+
+      return null;
+    },
+    get lockedValue() {
+      if (this._lockedValue !== null) {
+        return this._lockedValue;
+      }
+      else {
+        this._lockedValue = [];
+        this.options.forEach((v) => {
+          if(v.locked){
+            this._lockedValue.push(v.code);
+          }
+        });
+        return this._lockedValue;
+      }
+    },
+  };
+  rtn = base.copy(Base(source), rtn);
+  rtn = base.copy(rtn, valid.Init(rtn));
+  return rtn;
+}
+export default TagsNew;