cnhis-design-vue 0.2.63-beta → 0.3.1-beta

package/packages/table-filter/src/components/c-tree-select/tree-select.vue

@@ -1,336 +0,0 @@
-<template>
-  <a-tree-select
-    v-model="item.value"
-    dropdownClassName="c-a-tree-select-container"
-    @select="treeSelect"
-    @change="change"
-    :maxTagCount="handleMaxTagCount(item)"
-    :maxTagPlaceholder="handleMaxTag"
-    showSearch
-    multiple
-    style="width: 160px"
-    :class="[!showRemoveIcon && 'c-a-tree-select-show-hide-icon','c-a-quick-input-tree-mul']"
-    :dropdown-style="{ maxHeight: '292px', overflow: 'auto' }"
-    :tree-data="treeData"
-    :allowClear="item.explicitRequired != 1"
-    treeNodeFilterProp="title"
-    ref="quickInputSelect"
-    :placeholder="`请选择${item.alias || item.title}`"
-  >
-    <a-icon slot="suffixIcon" type="smile" />
-    <span class="init-key-loading" v-if="key === '_init_key_'" slot="title" slot-scope="{ key, value }" style="color: #08c">
-      <span v-show="false">{{ value }}</span>
-      <a-spin :tip="`加载中...`" />
-    </span>
-  </a-tree-select>
-</template>
-
-<script>
-import { TreeSelect, Spin, Icon } from 'ant-design-vue';
-import vexutils from '@/utils/vexutils';
-export default {
-  name: 'cTreeSelect',
-  data() {
-    return {
-      treeData: [
-        {
-          // title: "_init_key_",
-          value: '_init_key_',
-          key: '_init_key_',
-          selectable: false,
-          scopedSlots: {
-            title: 'title'
-          }
-        }
-      ]
-    };
-  },
-  props: {
-    item: {
-      type: Object,
-      default: () => ({ value: [] })
-    },
-    handleGetConfigApi: {
-      type: Function,
-      default: () => {}
-    },
-    outFilterChange: {
-      type: Function,
-      default: () => {}
-    }
-  },
-  computed: {
-    handleMaxTagCount() {
-      return function(item) {
-        let len = this.maxTagPlaceholder(item);
-        if (len <= 1) return 1;
-        return 0;
-      };
-    },
-    // handleMaxTag() {
-    //   return function(item) {
-    //     let len = this.maxTagPlaceholder(item);
-    //     if (len <= 1) return '';
-    //     return `已选${this.maxTagPlaceholder(item)}个${item.alias || item.title}`;
-    //   };
-    // },
-
-    showRemoveIcon() {
-      let v = this.item.value;
-       let f = 1 == this?.item?.filterExplicit
-      if (Array.isArray(v) && f) {
-        let l = v.length;
-        if (this.item.explicitRequired == 1) {
-          return l > 1;
-        }
-      }
-      return true;
-    }
-  },
-  watch: {
-    'item.value': {
-      immediate: true,
-      deep: true,
-      handler() {
-        // if (this.showRemoveIcon) return;
-        this.handleDisabledTreeData(this.treeData,{showRemoveIcon: this.showRemoveIcon});
-        this.$forceUpdate();
-      }
-    }
-  },
-  beforeCreate() {},
-  created() {},
-  beforeMount() {},
-  mounted() {
-    this.init();
-    this.createSuffixIcon();
-  },
-  beforeUpdate() {},
-  updated() {},
-  beforeDestroy() {},
-  destroyed() {},
-  activated() {},
-  methods: {
-    async init() {
-      try {
-        let res = await this.handleRequestedOptions(this.item);
-        let { result, map } = res.data;
-        if (result !== 'SUCCESS') {
-          this.treeData = [];
-          return;
-        }
-        let rows = map.rows || [];
-        if (rows) {
-          this.handleInitTreeData(rows, this.item);
-          this.treeData = rows;
-        }
-      } catch (error) {
-        console.log(error);
-        this.treeData = [];
-      } finally {
-        this.hanldeSetTreeDef();
-      }
-    },
-    handleMaxTag() {
-        let item = this.item;
-        let len = this.maxTagPlaceholder(item);
-        if (len <= 1) return '';
-        return `已选${this.maxTagPlaceholder(item)}个${item.alias || item.title}`;
-      },
-    async handleRequestedOptions(item = {}) {
-      let params = this.getSearchDefParams(item);
-      let res = await this.handleGetConfigApi(params, 'requestGetWordbookData', { fields: item });
-      return res;
-    },
-
-    getSearchDefParams(item = {}) {
-      let obj = {};
-      let { params = [], autograph, filterKeys, id, wordbookType } = item?.settingObj?.wordbook || {};
-      if (params) {
-        params.forEach(item => {
-          obj[item.p_name] = item.p_value;
-        });
-      }
-      if (autograph) {
-        obj.autograph = autograph;
-      }
-      let resFieldKeys = Array.isArray(filterKeys) ? JSON.stringify(filterKeys) : filterKeys;
-      let res = {
-        wordbookId: id,
-        fieldKeys: resFieldKeys,
-        wordbookType: wordbookType || 'WORDBOOK',
-        isLevelLazyLoad: false,
-        ...obj
-      };
-
-      return res;
-    },
-
-    /* 解析下拉选择接口返回字段 */
-    formatField(value, key) {
-      let res = value;
-      try {
-        if (res && typeof res == 'string' && res.startsWith('###')) {
-          res = res.slice(3);
-          res = JSON.parse(res);
-          res = res.change_text;
-        }
-
-        return res || '';
-      } catch (error) {
-        return '';
-      }
-    },
-
-    hanldeGetCascadelabel(v = [], k = {}) {
-      if (Array.isArray(v) && v.length) {
-        const l = [];
-        v.forEach(i => {
-          let res = this.formatField(k[i]);
-          l.push(res);
-        });
-        if (l.length == 0) {
-          return '';
-        }
-        return l.join(' ');
-      }
-      return '';
-    },
-
-    handleInitTreeData(list = [], config = {}) {
-      let { showKeys = [], field_key } = config?.setting?.wordbook || {};
-      list.forEach((item, i) => {
-        let val = vexutils.stringToValue(item[field_key], 'value');
-        item.myLabel = this.hanldeGetCascadelabel(showKeys, item) || val;
-        item.key = item.theUniqueKey;
-        item.title = item.myLabel;
-        // 避免接口配置的value 不知唯一值，导致前端页面卡死
-        item.value = `${val}<&=&>${i}<&=&>${item.key}`;
-        // item.scopedSlots = {
-        //   title: "title"
-        // };
-
-        if (item.children && item.children.length) {
-          this.handleInitTreeData(item.children, config);
-        }
-      });
-    },
-
-    hanldeSetTreeDef() {
-      let f = 1 == this?.item?.filterExplicit
-      let df = this?.item?.explicitDefaultVal || '';
-      if (df === 'firstOption' && f) {
-        let [v] = this.treeData;
-        this.item.value = v?.value ? [v.value] : [];
-        if (typeof this.outFilterChange === 'function') {
-          this.outFilterChange({type: 'outSearchInit'});
-        }
-      }
-    },
-
-    maxTagPlaceholder(item) {
-      if (Array.isArray(item.value)) {
-        return item.value.length;
-      } else {
-        return 1;
-      }
-    },
-
-    treeSelect(key, vnode) {
-    },
-
-    change(){
-    },
-
-    handleDisabledTreeData(list = [], config = {}) {
-      list.forEach((item, i) => {
-        let k = config.showRemoveIcon? false: this.item.value.includes(item.value);
-        this.$set(item, 'disabled', k);
-        if (item.children && item.children.length) {
-          this.handleDisabledTreeData(item.children, config);
-        }
-      });
-    },
-
-    createSuffixIcon() {
-      let refDom = this.$refs.quickInputSelect;
-      if (!refDom) return;
-      let selectDom = refDom.$el;
-      if(!selectDom) return;
-
-      let pDom = selectDom.querySelector('.ant-select-selection--multiple');
-      let hasTag = pDom.querySelector('.quick-input-select-span');
-      if (!hasTag) {
-        let tag = document.createElement('span');
-        tag.className = 'quick-input-select-span';
-        let icon = `<i aria-label="图标: down" class="anticon anticon-down ant-select-arrow-icon"><svg viewBox="64 64 896 896" data-icon="down" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class=""><path d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"></path></svg></i>`;
-        tag.innerHTML = icon;
-        pDom.appendChild(tag);
-      }
-    },
-  },
-  components: {
-    [TreeSelect.name]: TreeSelect,
-    [Spin.name]: Spin,
-    [Icon.name]: Icon
-  }
-};
-</script>
-
-<style lang="less">
-.c-a-tree-select-container {
-  .ant-select-tree-title {
-    display: inline-block;
-    width: 100%;
-  }
-
-  .init-key-loading {
-    display: flex;
-    justify-content: center;
-    width: 100%;
-  }
-
-  .ant-select-tree {
-    li.filter-node {
-      > span {
-        font-weight: 600;
-      }
-    }
-  }
-}
-
-.c-a-quick-input-tree-mul {
-    .ant-select-selection--multiple {
-      max-height: unset !important;
-    }
-    .ant-select-selection__rendered {
-      height: 32px !important;
-      overflow: hidden;
-    }
-    .ant-select-selection--multiple {
-      position: relative;
-      max-height: 32px !important;
-      .quick-input-select-span {
-        position: absolute;
-        right: 2px;
-        top: 4px;
-        top: 50%;
-        right: 11px;
-        transform-origin: 50% 50%;
-        margin-top: -7px;
-        line-height: 1;
-        .quick-input-select-icon {
-          font-size: 12px;
-        }
-      }
-  }
-}
-
-
-
-.c-a-tree-select-show-hide-icon {
-  .ant-select-selection__choice__remove {
-    display: none!important;
-  }
-}
-</style>

package/packages/table-filter/src/components/drop-button/drop-button.vue

@@ -1,224 +0,0 @@
-<script>
-import getBtnIcon from "./head-btn-icon";
-const BTNOBJ = {
-  // 按钮icon 映射
-  copy: "copy",
-  pencil: "edit",
-  delete: "delete",
-  add: "plus-circle",
-  download: "download",
-  label: "tag",
-  queding: "check",
-  del: "close"
-};
-export default {
-  name: "drop-botton",
-  data() {
-    return {};
-  },
-  props: {
-    buttonList: {
-      type: Array,
-      default: () => []
-    },
-    currentTempId: {
-      type: [String, Number],
-      default: "0"
-    },
-    isInlineOperating: {
-      type: Boolean,
-      default: false
-    },
-    type: {
-      type: String,
-      default: "default" // classify
-    },
-    rowFoldHideBtnListObj: {
-      type: Object,
-      default: () => ({})
-    },
-    showButtonTop: {
-      type: [String, Number]
-    },
-    filtershowTop: {
-      type: Boolean,
-      default: false
-    },
-    showFilter: Function
-  },
-  computed: {},
-  watch: {},
-  beforeCreate() {},
-  created() {},
-  beforeMount() {},
-  mounted() {},
-  beforeUpdate() {},
-  updated() {},
-  beforeDestroy() {},
-  destroyed() {},
-  activated() {},
-  render(h) {
-    const res = this.handleFilter(this.buttonList);
-    const dd = this.type == "default";
-
-    const obj = this.rowFoldHideBtnListObj;
-    const keys = Object.keys(obj || {});
-
-    const hasShowFilter = typeof this.showFilter === "function";
-    const dropItem = (v = {}, i) => {
-      let style = {};
-      if (hasShowFilter) {
-        if (!this.showFilter(v)) {
-          style = {
-            display: "none"
-          };
-        } else {
-          style = {};
-        }
-      }
-      return h(
-        "a-menu-item",
-        {
-          class: {
-            "dropdown-btn": true
-          },
-          style: { ...style },
-          on: {
-            click: e => {
-              this.handleBtnOnclick(v, i);
-            }
-          },
-          key: v.sid || i
-        },
-        [
-          h("get-btn-icon", {
-            props: {
-              data: v,
-              btnObj: BTNOBJ
-            }
-          }),
-          v.showStyle === "only_icon" ? "" : v.alias || v.name
-        ]
-      );
-    };
-
-    const groupItem = (g = {}, i) => {
-      const res =
-        Array.isArray(g.list) && g.list.length > 0 ? [g.list.map((v, j) => dropItem(v, j))] : [];
-      if (res.length === 0) return null;
-      return h(
-        "a-menu-item-group",
-        {
-          key: i
-        },
-        [
-          h("span", {
-            slot: "title"
-          }),
-          ...res
-        ]
-      );
-    };
-
-    return h(
-      "a-dropdown",
-      {
-        props: {
-          overlayClassName: dd ? "" : "rowFoldHideBtnList-dropdown"
-        }
-      },
-      [
-        h(
-          "a-menu",
-          {
-            slot: "overlay"
-          },
-          dd ? [res.map((v, i) => dropItem(v, i))] : [keys.map(v => groupItem(obj[v], v))]
-        ),
-        h(
-          "a-button",
-          {
-            class: {
-              "dropdown-button": true,
-              ml12: true
-            }
-          },
-          [
-            this.$t("1.1.8.1.6"),
-            h("a-icon", {
-              props: {
-                type: "down"
-              }
-            })
-          ]
-        )
-      ]
-    );
-  },
-  methods: {
-    handleFilter(list) {
-      const { showButtonTop, currentTempId, filtershowTop } = this;
-      if (Array.isArray(list)) {
-        let tt = filtershowTop ? showButtonTop == 1 : true;
-        return list.filter(
-          v => v.type == "ADD" || (tt && v.type != "LINK" && currentTempId == "0")
-        );
-      }
-      return [];
-    },
-
-  visibleBtn(btn) {
-      if (!btn.isVisible) return false;
-      if (this.isInlineOperating) return false;
-
-      return true;
-    },
-
-    handleBtnOnclick(...arg) {
-      this.$emit("handleBtnOnclick", ...arg);
-    }
-  },
-  components: {
-    getBtnIcon
-  }
-};
-</script>
-<style scoped lang="less">
-.dropdown-button {
-  color: #212121;
-  border-color: #d5d5d5 !important;
-  margin-left: 8px;
-  margin-bottom: 8px;
-  /deep/ .svg-icon {
-    margin-right: 4px;
-  }
-  &.ant-dropdown-trigger {
-    i.anticon.anticon-down {
-      color: #969696;
-      font-size: 14px;
-    }
-  }
-}
-
-.ml12 {
-  margin-left: 12px;
-  margin-bottom: 8px;
-}
-</style>
-<style lang="less">
-.rowFoldHideBtnList-dropdown {
-  .ant-dropdown-menu {
-    overflow-y: auto;
-    max-height: 99vh;
-  }
-  .ant-dropdown-menu-item-group {
-    .ant-dropdown-menu-item-group-title {
-      display: none;
-    }
-    border-bottom: 1px solid #d5d5d5;
-    &:last-child {
-      border-color: transparent;
-    }
-  }
-}
-</style>

package/packages/table-filter/src/components/drop-button/head-btn-icon.js

@@ -1,33 +0,0 @@
-export default {
-  props: ["data", "btnObj"],
-  functional: true,
-  render: function(createElement, context) {
-    var data = context.props.data || {};
-    var btnObj = context.props.data || {};
-    if (data.icon) {
-      return data.showStyle !== "only_icon" && btnObj[data.icon]
-        ? createElement("a-icon", {
-            props: {
-              type: btnObj[data.icon]
-            }
-          })
-        : createElement("svg-icon", {
-            props: {
-              iconClass: data.icon,
-              style: {
-                marginRight: "8px"
-              }
-            }
-          });
-    } else if (data.iconSetting) {
-      return createElement("svg-icon", {
-        props: {
-          iconClass: JSON.parse(data.iconSetting).icon,
-          style: {
-            marginRight: "8px"
-          }
-        }
-      });
-    }
-  }
-};

package/packages/table-filter/src/components/drop-view/drop-view.vue

@@ -1,89 +0,0 @@
-<template functional>
-  <a-dropdown overlayClassName="t_h_viewList-dropdown">
-    <a-button class="viewList-button">
-      <svg-icon :icon-class="'anniuqiehuanmoshi'" style="font-size: 22px"></svg-icon>
-    </a-button>
-    <a-menu slot="overlay">
-      <a-menu-item
-        v-for="(item, index) in props.viewList"
-        :value="item.id"
-        :key="index"
-        @click="props.handlerSelectTemp(item.id)"
-        :class="{ 'menu-active': props.currentTempId === item.id }"
-      >
-        <span>{{ item.name }}</span>
-      </a-menu-item>
-    </a-menu>
-  </a-dropdown>
-</template>
-
-<script>
-export default {
-  name: "drop-view",
-  data() {
-    return {};
-  },
-  props: {
-    viewList: {
-      type: Array,
-      default: () => []
-    },
-    currentTempId: {
-      type: String,
-      default: ""
-    },
-
-    handlerSelectTemp: {
-      type: Function,
-      default: () => {}
-    }
-  },
-  computed: {},
-  watch: {},
-  beforeCreate() {},
-  created() {},
-  beforeMount() {},
-  mounted() {},
-  beforeUpdate() {},
-  updated() {},
-  beforeDestroy() {},
-  destroyed() {},
-  activated() {},
-  methods: {},
-  components: {}
-};
-</script>
-
-<style lang="less" scoped>
-.viewList-button {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding: 0 12px;
-}
-</style>
-<style lang="less">
-.t_h_viewList-dropdown {
-  min-width: 120px;
-  .ant-dropdown-menu-item {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    color: #2e2e2e;
-    margin: 1px 0;
-    &:hover {
-      background: #f2f2f2;
-    }
-    > span {
-      display: inline;
-      width: 85%;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      overflow: hidden;
-    }
-  }
-  .ant-dropdown-menu-item.menu-active {
-    color: #2d7aff;
-  }
-}
-</style>