cnhis-design-vue 0.2.64-beta → 0.3.2-beta

package/packages/scale-view/formitem/r-choice.vue

@@ -1,534 +0,0 @@
-<template>
-  <div class="r-choice">
-    <a-radio-group
-      v-model="curvalue"
-      v-if="item.type == 'RADIO_BLOCK' || item.type === 'EVALUATE_RADIO_BLOCK'"
-      @change="radioChange"
-      class="choice-wrap"
-      :class="['choice-wrap-' + (item.setting.chooseStyleSetting || 1)]"
-    >
-      <a-radio
-        v-for="(o, i) in curOptions"
-        class="choice-radio"
-        :value="o.value"
-        :key="o.value + i"
-        :class="{ 'block-radio': !item.setting.isHorizontal }"
-        :disabled="isLock"
-        :style="{ color: choiceColor(o) }"
-      >
-        <!-- <text-over-tooltip
-          :refName="'chooseValue' + curIndex + i"
-          class="choose-value"
-          :content="o.label"
-          :textColor="choiceColor(o)"
-        ></text-over-tooltip> -->
-        <!-- <a-tooltip :title="o.label">
-          {{ o.label }}
-        </a-tooltip> -->
-         {{ o.label }}
-
-        <a-input
-          v-model="othersText"
-          :disabled="isLock"
-          v-if="o.importability"
-          @change="inputChange"
-          :style="{ color: choiceColor(o) }"
-        />
-      </a-radio>
-    </a-radio-group>
-    <a-checkbox-group
-      v-else-if="item.type == 'CHECKBOX_BLOCK' || item.type === 'EVALUATE_CHECKBOX_BLOCK'"
-      @change="checkboxChange"
-      v-model="curCheckboxValue"
-      class="choice-wrap"
-      :class="['choice-wrap-' + (item.setting.chooseStyleSetting || 1)]"
-    >
-      <a-checkbox
-        class="choice-checkbox"
-        v-for="(o) in curOptions"
-        :key="o.value"
-        :value="o.value"
-        :class="{ 'block-checkbox': !item.setting.isHorizontal }"
-        :disabled="isLock"
-      >
-        <!-- <a-tooltip :title="o.label">
-          {{ o.label }}
-        </a-tooltip> -->
-        <span style="white-space: initial;">
-          {{ o.label }}
-        </span>
-        <!-- <text-over-tooltip
-          :refName="'chooseValue' + curIndex + i"
-          class="choose-value"
-          :content="o.label"
-        ></text-over-tooltip> -->
-        <a-input
-          v-model="othersText"
-          :disabled="isLock"
-          v-if="o.importability"
-          @change="inputCheckboxChange"
-        />
-      </a-checkbox>
-    </a-checkbox-group>
-    <a-select
-      v-else-if="cloneItem.type == 'SELECT' || item.type === 'EVALUATE_SELECT'"
-      v-model="choiceValue"
-      placeholder="请选择"
-      show-search
-      :mode="cloneItem.setting.isMultiple ? 'multiple' : 'default'"
-      :disabled="isLock"
-      @search="handleSearch"
-      @change="handleSelectChange"
-      :getPopupContainer="getPopupContainer"
-      :filterOption="filterOption"
-      :notFoundContent="fetching ? undefined : '暂无数据'"
-    >
-    <a-spin v-if="fetching" slot="notFoundContent" size="small" />
-      <a-select-option v-for="(v, i) in curOptions" :key="i" :value="v.value">
-        {{ v[showField] }}
-      </a-select-option>
-    </a-select>
-    <a-cascader
-      v-else-if="cloneItem.type == 'SEARCH_CASCADE'"
-      v-model="choiceValue"
-      class="m-cascader"
-      placeholder="请选择"
-      :options="curOptions"
-      :disabled="isLock"
-      change-on-select
-    />
-  </div>
-</template>
-
-<script>
-/**
- *  getSelectOptions 获取下拉框数据的 function
- *  getSearchOptions 关键字检索的 function
- *  getCascadeOptions 获取级联数据的 furnction
- */
-import { Select, Input, Radio, Checkbox, Cascader } from "ant-design-vue";
-import { judgeTypes } from "../mixin/judgeTypes";
-// import format from "@/components/table/mixins/format";
-// import TextOverTooltip from "./text-over-tooltip/TextOverTooltip.vue";
-import utils from "@/utils/utils-map";
-import axios from 'axios';
-export default {
-  mixins: [judgeTypes],
-  props: {
-    value: { default: undefined, type: [String, Array, Number] },
-    item: { type: Object, default: () => {} },
-    isLock: { type: Boolean, default: false },
-    curIndex: Number,
-    getSelectOptions: {
-      type: Function,
-      default: () => Promise.resolve([])
-    },
-    getSearchOptions: {
-      type: Function,
-      default: () => Promise.resolve([])
-    },
-    getCascadeOptions: {
-      type: Function,
-      default: () => Promise.resolve([])
-    },
-    openType: { type: String, default: "" }
-  },
-  components: {
-    // TextOverTooltip,
-    [Input.name]: Input,
-    [Cascader.name]: Cascader,
-    [Checkbox.name]: Checkbox,
-    [Checkbox.Group.name]: Checkbox.Group,
-    [Radio.name]: Radio,
-    [Radio.Group.name]: Radio.Group,
-    [Select.name]: Select,
-    [Select.Option.name]: Select.Option,
-  },
-  computed: {
-    choiceValue: {
-      get() {
-        return this.value ? this.value : undefined;
-      },
-      set(val) {
-        this.$emit("input", val);
-      }
-    },
-    choiceColor() {
-      return function(p) {
-        if (this.item.type != "RADIO_BLOCK") return "rgba(0, 0, 0, 0.65)";
-        return p.color || "rgba(0, 0, 0, 0.65)";
-      };
-    }
-  },
-  watch: {
-    item: {
-      immediate: true,
-      deep: true,
-      handler(value) {
-        if (!value || !Object.keys(value).length) return;
-        let options = value.options || [];
-        if (this.isEvaluation(value.type)) {
-          options = value.scoreConfigs?.scoreRules || [];
-        }
-        if (value.type === "RADIO_BLOCK" || value.type === "EVALUATE_RADIO_BLOCK") {
-          const defVal = value.dbValue || value.setting.defaultValue;
-          this.handleRadioDef(value, defVal, options);
-          return;
-        }
-        if (value.type === "CHECKBOX_BLOCK" || value.type === "EVALUATE_CHECKBOX_BLOCK") {
-          let defVal = [];
-          if (utils.isJSON(value.setting.defaultValue)) {
-            defVal = JSON.parse(value.setting.defaultValue);
-          }
-          this.handleCheckboxDef(value, value.dbValue || defVal, options);
-          return;
-        }
-        if (
-          value.type == "SELECT" ||
-          value.type == "SEARCH_CASCADE" ||
-          value.type === "EVALUATE_SELECT"
-        ) {
-          this.cloneItem = JSON.parse(JSON.stringify(value));
-          let options = this.cloneItem.options || [];
-          if (this.isEvaluation(value.type)) {
-            options = this.cloneItem.scoreConfigs?.scoreRules || [];
-          }
-          this.curOptions = options;
-          this.initSelectOptions();
-        }
-      }
-    }
-  },
-  data() {
-    return {
-      selectParams: { tableType: "TABLE_LIST", pageSize: 20, page: 1 },
-      cascaderParams: { tableType: "TABLE_LIST" },
-      cloneItem: {},
-      columnName: "", // 取值字段
-      showField: "", // 显示字段
-      curvalue: "",
-      curCheckboxValue: [],
-      othersText: "",
-      curOptions: [],
-      fieldList: [],
-      buttonList: [],
-      source: "guageChoice",
-      fetching: false
-    };
-  },
-  methods: {
-    handleRadioDef(item, curValue, options) {
-      this.curOptions = options.filter(v => v.label);
-      if (!options.length || !curValue) return;
-      this.curvalue = curValue;
-      let hasOther = options.find(v => v.value === curValue);
-      if (!hasOther) {
-        this.othersText = curValue;
-        this.curvalue = "其他";
-      }
-    },
-    async handleCheckboxDef(item, curValue, options) {
-      this.curOptions = options.filter(v => v.label);
-      if (!options.length || !curValue || !curValue.length) return;
-      this.curCheckboxValue = curValue;
-      let op = options.map(v => v.value);
-      let minus = curValue.filter(x => op.indexOf(x) == -1) || [];
-      if (minus.length) {
-        let tempValue = minus[0];
-        let valueIndex = curValue.findIndex(v => v === tempValue);
-        this.othersText = tempValue;
-        this.curCheckboxValue[valueIndex] = "其他";
-      }
-    },
-    radioChange() {
-      if (this.curvalue === "其他") {
-        this.$emit("radioChange", this.othersText || this.curvalue, this.item);
-      } else {
-        this.$emit("radioChange", this.curvalue, this.item);
-      }
-    },
-    checkboxChange() {
-      this.handleCheckboxOther(true);
-    },
-    inputChange() {
-      if (this.curvalue === "其他") {
-        this.$emit("radioChange", this.othersText || "其他", this.item);
-      }
-    },
-    inputCheckboxChange() {
-      this.handleCheckboxOther();
-    },
-    handleCheckboxOther(isContinue = false) {
-      let hasOther = this.curCheckboxValue?.some(v => v === "其他") || false;
-      if (hasOther) {
-        let otherIndex = this.curCheckboxValue.findIndex(v => v === "其他");
-        let temp = JSON.parse(JSON.stringify(this.curCheckboxValue));
-        temp[otherIndex] = this.othersText || "其他";
-        this.$emit("checkboxChange", temp, this.item);
-      } else {
-        isContinue && this.$emit("checkboxChange", this.curCheckboxValue, this.item);
-      }
-    },
-    async initSelectOptions() {
-      // 分享链接的量表用 optionType 1：静态，2：动态，3：动态转静态
-      const { targetSource, type, options = [], optionType = 1 } = this.cloneItem;
-      this.showField = "label";
-      if (!targetSource?.target_id) return;
-      // 动态数据源转静态数据
-      if (type == "SELECT" && (options.length || optionType == 3)) {
-        this.curOptions = options;
-        return;
-      }
-      if(type === "SELECT") {
-        this.fetching = true;
-        this.curOptions = await this.getSelectOptions(this.cloneItem);
-        this.fetching = false;
-      } else {
-        this.curOptions = await this.getCascadeOptions(this.cloneItem);
-      }
-      this.columnName = targetSource?.values;
-      this.showField = targetSource?.showField || targetSource?.values;
-      // this.findDetails(targetSource).then(obj => {
-      //   if (type == "SEARCH_CASCADE") {
-      //     this.findCascader(obj);
-      //   } else if (type == "SELECT") {
-      //     this.findTableData(obj);
-      //   }
-      // });
-    },
-    // 下拉组件查询列表数据配置
-    findDetails({ target_id, values, primaryField, relationField, showField }) {
-      const url = "/tableList/getDetail";
-      const params = {
-        tableId: target_id,
-        tableType: "TABLE_LIST"
-      };
-      this.columnName = values;
-      this.showField = showField || values;
-      return axios.get(url, { params }).then(({ data }) => {
-        const { detailAutograph, tableId, fieldList = [], buttonList = [] } = data.map;
-        const { type } = this.cloneItem;
-        fieldList.forEach(item => {
-          item.attrType = (item.settingObj && item.settingObj.attr) || "";
-        });
-        this.fieldList = fieldList;
-        this.buttonList = buttonList;
-        if (type == "SELECT") {
-          Object.assign(this.selectParams, {
-            autograph: detailAutograph,
-            tableId
-          });
-        } else if (type == "SEARCH_CASCADE") {
-          Object.assign(this.cascaderParams, {
-            autograph: detailAutograph,
-            tableId,
-            primaryKey: primaryField,
-            levelKey: relationField
-          });
-        }
-        return { values, showField: this.showField };
-      });
-    },
-    // 下拉组件查询列表字段值
-    findTableData({ values, keyword }) {
-      const url = "/tableReader/getTableData";
-      delete this.selectParams.keyword;
-      if (keyword) {
-        Object.assign(this.selectParams, { keyword });
-      }
-      return axios.post(url, this.$qs.stringify(this.selectParams)).then(({ data }) => {
-        const { rows } = data.map;
-        const options = rows.map(row => {
-          return Object.assign(row, {
-            // label: row[showField],
-            value: row[values]
-          });
-        });
-        let optionsList = this.uniqArrObj(options, "value");
-        optionsList = this.formatData({
-          tableList: optionsList,
-          fieldList: this.fieldList,
-          btnList: this.buttonList,
-          oldtableData: optionsList,
-          showButtonTop: 0
-        });
-        this.curOptions = optionsList;
-      });
-    },
-    // 级联组件查询列表数据
-    findCascader({ values }) {
-      const url = "/tableReader/getTableData";
-      return axios.post(url, this.$qs.stringify(this.cascaderParams)).then(({ data }) => {
-        const { rows } = data.map;
-        this.curOptions = this.initTreeData(rows, values);
-      });
-    },
-    // 初始化树
-    initTreeData(rows, values) {
-      return rows.map(row => {
-        const valObj = { label: row[values], value: row[values], id: row.id };
-        if (row.parent_id) {
-          Object.assign(valObj, { parent_id: row.parent_id });
-        }
-        if (row.children) {
-          Object.assign(valObj, {
-            children: this.initTreeData(row.children, values)
-          });
-        }
-        return valObj;
-      });
-    },
-    // 数组对象去重
-    uniqArrObj(arr, name) {
-      let obj = {};
-      return arr.reduce((cur, next) => {
-        obj[next[name]] ? "" : (obj[next[name]] = true && cur.push(next));
-        return cur;
-      }, []);
-    },
-    // 下拉组件搜索
-   async handleSearch(value) {
-     try {
-      this.curOptions = await this.getSearchOptions({
-        values: this.columnName,
-        showField: this.showField,
-        keyword: value
-      }, this.cloneItem);
-      console.log(this.curOptions,'curOptions')
-     } catch (error) {
-       console.log(error)
-     }
-    },
-    // 下拉组件选值
-    handleSelectChange(value) {
-      let res = {
-        value: "",
-        list: []
-      };
-      let matchItem;
-      if (Array.isArray(value)) {
-        res.value = value;
-        if (!value.length) {
-          res.list = [];
-        } else {
-          value.forEach(item => {
-            matchItem = this.curOptions.find(v => v.value === item);
-            if (matchItem) {
-              res.list.push(matchItem);
-            }
-          });
-        }
-      } else {
-        res.value = value;
-        matchItem = this.curOptions.find(v => v.value === value);
-        if (matchItem) {
-          res.list.push(matchItem);
-        }
-      }
-      this.$emit("change", res);
-    },
-    filterOption(input, option) {
-      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
-    },
-    getPopupContainer(triggerNode) {
-      if(this.openType == 'formIframe') {
-        return document.body;
-      }
-      return triggerNode.parentNode;
-    }
-  }
-};
-</script>
-
-<style lang="less" scoped>
-.r-choice {
-  /deep/ .ant-radio-group {
-    width: 100%;
-  }
-  /deep/ .choice-radio,
-  /deep/ .choice-checkbox {
-    display: inline-flex;
-    align-items: flex-start;
-    margin-bottom: 5px;
-    margin-right: 8px;
-    margin-left: 0px;
-    span {
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      overflow: hidden;
-      vertical-align: middle;
-    }
-    span:last-child {
-      flex: 1;
-      display: inline-flex;
-      align-items: center;
-      word-break: break-all;
-      input {
-        margin-left: 4px;
-        width: 300px;
-        max-width: calc(100% - 40px);
-      }
-    }
-  }
-
-  /deep/ .block-radio,
-  /deep/ .block-checkbox {
-    display: flex;
-    margin-left: 8px;
-  }
-  /deep/ .ant-select {
-    min-width: 160px;
-  }
-  /deep/ .ant-select ~ div {
-    position: relative !important;
-  }
-  /deep/.ant-select-dropdown {
-    top: 0px !important;
-    left: 1px !important;
-  }
-  .choice-wrap {
-    display: flex;
-    flex-wrap: wrap;
-    /deep/ .choose-value .el-tooltip.ellipsis {
-      color: rgba(0, 0, 0, 0.65);
-      font-size: 14px;
-    }
-    label {
-      margin: 0;
-    }
-    /deep/.ant-radio-wrapper span.ant-radio + * {
-      display: inline-flex;
-      align-items: center;
-      white-space: initial;
-    }
-    &.choice-wrap-1 label {
-      width: 100%;
-    }
-    &.choice-wrap-2 label {
-      width: 50%;
-    }
-    &.choice-wrap-3 label {
-      width: 33%;
-    }
-    &.choice-wrap-4 label {
-      width: 25%;
-    }
-    /deep/ .ant-checkbox {
-      // margin-top: -0.2em;
-      margin-top: 5px;
-    }
-    /deep/ .ant-checkbox-inner {
-      vertical-align: top;
-    }
-  }
-  /deep/.choice-radio span,
-  /deep/.choice-checkbox span {
-    &:last-child {
-      display: inline-block;
-      text-overflow: ellipsis;
-      word-break: break-all;
-      max-width: 100%;
-    }
-  }
-}
-</style>

package/packages/scale-view/formitem/r-input.vue

@@ -1,96 +0,0 @@
-<template>
-  <div class="my-input">
-    <!-- <a-input
-      :type="type"
-      :disabled="isLock"
-      placeholder="请输入"
-      v-if="eleType == 'INPUT'"
-      v-model="inputValue"
-      @keydown="keydown"
-      :rows="row"
-      style="resize: none;"
-      autocomplete="off"
-    /> -->
-    <!-- inputmode="numeric" -->
-    <a-textarea
-      :disabled="isLock"
-      :placeholder="defaultPlaceHolder"
-      v-if="eleType == 'INPUT' || eleType == 'EVALUATE_INPUT'"
-      v-model="inputValue"
-      @input="changeTextarea"
-      @keydown="keydown"
-      :rows="row"
-      style="resize: none;"
-      autocomplete="off"
-    />
-    <a-input
-      :type="type"
-      :disabled="isLock"
-      placeholder="请输入"
-      v-if="eleType == 'ID_CARD'"
-      v-model="inputValue"
-      @keydown="keydown"
-    />
-    <a-input
-      :type="type"
-      :disabled="isLock"
-      placeholder="请输入"
-      v-if="eleType == 'MOBILE'"
-      v-model="inputValue"
-      @keydown="keydown"
-    />
-  </div>
-</template>
-
-<script>
-import { Input, } from "ant-design-vue";
-export default {
-  props: {
-    value: { default: "" },
-    type: { default: "" },
-    eleType: { default: "INPUT", type: String },
-    isLock: { type: Boolean, default: false },
-    row: { type: Number, default: 1 },
-    defaultPlaceHolder: String
-  },
-  computed: {
-    inputValue: {
-      get() {
-        return this.value;
-      },
-      set(val) {
-        this.$emit("input", val);
-      }
-    }
-  },
-  methods: {
-    keydown(e) {
-      let key = e.key;
-      if (key === "e" || key === "E" || key === "+" || key === "-") {
-        e.returnValue = false;
-      } else {
-        e.returnValue = true;
-      }
-    },
-    changeTextarea(e) {
-      let { value } = e?.target || {};
-      if (value && this.type === "number") {
-        this.inputValue = value.replace(/[^\d.]/gi, "");
-      }
-    }
-  },
-  components:{
-    [Input.name]: Input,
-    [Input.TextArea.name]: Input.TextArea,
-  }
-};
-</script>
-
-<style lang="less" scoped>
-.my-input {
-  input::-webkit-outer-spin-button,
-  input::-webkit-inner-spin-button {
-    -webkit-appearance: none;
-  }
-}
-</style>

package/packages/scale-view/formitem/r-prompt.vue

@@ -1,52 +0,0 @@
-<template>
-  <div class="prompt-message" :class="className">
-    <a-icon v-if="options.promptType === 'strong'" class="prompt-icon" type="exclamation-circle" />
-    <div class="prompt-message-content ">
-      {{ options.promptMsg || "" }}
-    </div>
-  </div>
-</template>
-<script>
-import { Icon } from "ant-design-vue";
-export default {
-  props: {
-    options: {
-      type: Object
-    }
-  },
-  computed: {
-    className() {
-      const type = this.options.promptType;
-      return type ? `is-${type}` : "";
-    }
-  },
-  components:{
-    [Icon.name]: Icon,
-  }
-};
-</script>
-<style lang="less" scoped>
-.prompt-message {
-  color: #666;
-  position: relative;
-  &.is-weak {
-    color: #999;
-  }
-  &.is-strong {
-    color: #ff1818;
-    padding: 1px 0 0 35px;
-  }
-  .prompt-icon {
-    width: 24px;
-    height: 24px;
-    font-size: 18px;
-    position: absolute;
-    left: 0;
-    top: 0;
-  }
-  .prompt-message-content {
-    line-height: 16px;
-    font-size: 14px;
-  }
-}
-</style>