n20-common-lib 1.3.5 → 1.3.8

package/src/components/NstcG6Components/NstcForm/SelectAndDialog/NstcSelectAndDialog.vue

@@ -1,382 +0,0 @@
-<!--
- * @Author: your name
- * @Date: 2022-01-13 11:06:47
- * @LastEditTime: 2022-02-15 14:01:35
- * @LastEditors: Please set LastEditors
- * @Description: 下拉+弹框
- * @FilePath: SelectAndDialog.vue
--->
-<template>
-  <div class="dialog-select">
-    <div
-      style="position: relative"
-      @mouseenter="hovering = true"
-      @mouseleave="hovering = false"
-    >
-      <el-select
-        v-model="selectValue"
-        v-nstc-lazy-load="lazyLoadAction"
-        filterable
-        remote
-        :loading="loading"
-        :remote-method="filterOptions"
-        :placeholder="chMapper.plcSelect"
-        :disabled="disabled"
-        @change="selectOpt"
-        @blur="selectBlur"
-        @focus="selectFocus"
-        v-bind="$attrs"
-        v-on="$listeners"
-      >
-        <el-option
-          v-for="item in options"
-          :key="item[valueKey]"
-          :label="item[labelKey]"
-          :value="item[valueKey]"
-        ></el-option>
-      </el-select>
-      <i
-        v-if="!showClose"
-        class="search-btn el-input__icon el-icon-search"
-        @click="onSearchIconClick"
-      >
-      </i>
-      <i
-        v-if="showClose"
-        class="search-btn el-select__caret el-input__icon el-icon-circle-close"
-        @click="onClearIconClick"
-      ></i>
-    </div>
-
-    <DialogTable
-      v-model="showDialog"
-      ref="dialog"
-      v-bind="dialogProps"
-      @comfirm="onComfirm"
-    >
-      <template slot="form">
-        <slot></slot>
-      </template>
-    </DialogTable>
-  </div>
-</template>
-
-<script>
-import axios from "../../../../utils/axios";
-import DialogTable from "../../NstcDialogTable/NstcDialogTable";
-export default {
-  name: "NstcSelectAndDialog",
-  components: { DialogTable },
-  props: {
-    value: String,
-    columns: Array,
-    url: String,
-    httpMethod: {
-      type: String,
-      default: "GET",
-    },
-    query: {
-      type: String,
-      default: "label",
-    },
-    params: {
-      type: Object,
-      default: () => ({
-        isEnable: 1,
-      }),
-    },
-    rowKey: {
-      type: String,
-      default: "id",
-    },
-    formatData: {
-      type: Function,
-      default: (d) => d,
-    },
-    formatParams: {
-      type: Function,
-      default: (d) => d,
-    },
-    tableForm: {
-      type: Object,
-      default: () => {},
-    },
-    valueKey: {
-      type: String,
-      default: "value",
-    },
-    labelKey: {
-      type: String,
-      default: "label",
-    },
-    appendToBody: {
-      type: Boolean,
-      default: true,
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    chMapper: {
-      type: Object,
-      default: () => ({
-        title: "选择xx",
-        noselectmsg: "请选择xx",
-        plcInput: "请输入",
-        plcSelect: "请选择",
-      }),
-    },
-    // 是否添加懒加载
-    lazyLoad: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  directives: {
-    "nstc-lazy-load": {
-      bind(el, binding) {
-        const SELECTWRAP_DOM = el.querySelector(
-          ".el-select-dropdown .el-select-dropdown__wrap"
-        );
-        SELECTWRAP_DOM.addEventListener("scroll", function () {
-          const condition =
-            this.scrollHeight - this.scrollTop - 2 <= this.clientHeight;
-          console.log("condition", condition);
-          if (condition) {
-            binding.value();
-          }
-        });
-      },
-    },
-  },
-  data() {
-    return {
-      showDialog: false,
-      options: [],
-      allData: [],
-      hovering: false,
-      loading: false,
-      remoteQuery: "",
-      dialogProps: {},
-      paginationObj: {
-        current: 1,
-        size: 20,
-      },
-      lazyLoadLocal: false,
-
-    };
-  },
-  beforeDestroy() {
-    this.$bus.$off("nstc_custom_form_config_update");
-  },
-  computed: {
-    showClose() {
-      let hasValue =
-        this.value !== undefined && this.value !== null && this.value !== "";
-      return this.hovering && hasValue;
-    },
-    selectValue: {
-      set(val) {
-        this.$emit("input", val);
-      },
-      get() {
-        console.log(this.value);
-        return this.value;
-      },
-    },
-  },
-  created() {
-    let props = {
-      title: this.chMapper.title,
-      warning: this.chMapper.noselectmsg,
-      single: true,
-      columns: this.columns,
-      rowKey: this.rowKey,
-      queryApi: this.queryApi,
-      formatParams: this.beforeFormatParams,
-      formatData: this.formatData,
-      appendToBody: this.appendToBody,
-    };
-    this.dialogProps = props;
-    this.$bus.$on("nstc_custom_form_config_update", (formData) => {
-      console.log("监听到的全局事件", formData);
-    });
-  },
-  mounted() {
-    this.editSetOptions();
-    this.lazyLoadLocal = this.lazyLoad;
-  },
-  methods: {
-    /**
-     * 懒加载
-     */
-    lazyLoadAction() {
-      if (this.lazyLoadLocal) {
-        this.paginationObj.current++;
-        this.queryAllData();
-      }
-    },
-    async queryAllData() {
-      let param = this.lazyLoadLocal
-        ? this.beforeFormatParams(this.paginationObj, "init")
-        : this.beforeFormatParams({ size: 100, current: 1 }, "init");
-      this.lazyLoadLocal ? param.quickSearch = this.remoteQuery : ""
-      let res = await this.queryApi(param);
-
-      if (!this.lazyLoadLocal && res && res.total && res.total > 100) {
-        param = this.beforeFormatParams(
-          { size: res.total, current: 1 },
-          "init"
-        );
-        let resAll = await this.queryApi(param);
-        res = resAll;
-      }
-      console.log('数据====', res)
-      let { data } = this.formatData(res || []);
-      this.allData = this.lazyLoadLocal ? this.allData.concat(data) : data;
-      // this.allData = data;
-      console.log(this.allData);
-      this.lazyLoadLocal ? this.setOptions(this.allData) : this.setOptions(data);
-      
-    },
-
-    beforeFormatParams(pageParam, mode) {
-      const { size, current } = pageParam;
-      let defaultParam = this.params;
-      let page = this.formatPageParam(size, current);
-      let params;
-      if (mode != "init") {
-        let param = this.queryFormData || {};
-        params = { ...defaultParam, ...param, ...page };
-      } else {
-        params = { ...defaultParam, ...page };
-      }
-      return this.formatParams(params);
-    },
-
-    formatPageParam(size, current) {
-      let page = { "page.size": size, "page.current": current };
-      let method = this.httpMethod.toUpperCase();
-      if (method == "POST") {
-        page = { page: { size, current } };
-      }
-      return page;
-    },
-
-    queryApi(param) {
-      const { url, httpMethod } = this;
-      let body = httpMethod.toUpperCase() === "POST" ? "data" : "params";
-      let reqConf = { url, method: httpMethod };
-      reqConf[body] = param;
-      return axios(reqConf);
-    },
-
-    setOptions(data) {
-      // let opts = [];
-      // let value = this.value;
-      // let valueKey = this.valueKey;
-      // if (value) {
-      //   let row = data.find((item) => item[valueKey] == value);
-      //   if (row) {
-      //     let filters = data.filter((item) => item[valueKey] != value);
-      //     opts = [row].concat(filters.slice(0, 9));
-      //   } else {
-      //     opts = data.slice(0, 10);
-      //   }
-      // } else {
-      //   opts = data.slice(0, 10);
-      // }
-      this.options = data;
-    },
-
-    filterOptions(query) {
-      this.remoteQuery = query;
-      if (this.lazyLoad) {
-        this.allData = [];
-        this.queryAllData();
-        return
-      }
-      if (query) {
-        let opts = this.allData.filter((item) => {
-          return item[this.labelKey].indexOf(query) > -1;
-        });
-        this.options = opts.slice(0, 10);
-      } else {
-        this.options = this.allData.slice(0, 10);
-      }
-    },
-
-    updateOptions(value) {
-      let allData = this.allData || [];
-      let options = this.options || [];
-      let row = allData.find((item) => item[this.valueKey] == value);
-      let hasRow = options.find((item) => item[this.valueKey] == value);
-      if (row && !hasRow) {
-        let opts = [row].concat(options);
-        this.options = opts;
-      }
-      console.log(this.options);
-    },
-
-    // 编辑回显
-    editSetOptions() {
-      if (this.value) {
-        this.queryAllData();
-      }
-    },
-
-    // 显示弹窗
-    onSearchIconClick(event) {
-      this.$emit("show-dialog");
-      this.queryAllData();
-      this.showDialog = true;
-      this.$nextTick(() => {
-        this.queryTableData();
-      });
-    },
-
-    onClearIconClick() {
-      this.options = this.allData.slice(0, 10);
-      this.$emit("input", "");
-    },
-
-    queryTableData() {
-      this.queryFormData = Object.assign({}, this.tableForm);
-      this.$refs.dialog.queryData("searchbtn");
-    },
-
-    selectOpt(val) {
-      let row = this.allData.find((item) => item[this.valueKey] == val);
-      console.log(val,row,this.valueKey,this.allData);
-      this.$emit("comfirm", [val], row);
-    },
-
-    selectFocus() {
-      this.allData = []
-      this.queryAllData();
-    },
-    selectBlur() {
-      if(this.lazyLoadLocal) {
-        this.paginationObj = { size: 20, current: 1 };
-      }
-      return;
-    },
-
-    onComfirm(values, row) {
-      let value = row[this.valueKey];
-      this.updateOptions(value);
-      this.$emit("input", value);
-      this.$emit("comfirm", values, row);
-    },
-  },
-};
-</script>
-
-<style scoped>
-.search-btn {
-  color: #c0c4cc;
-  position: absolute;
-  right: 7px;
-  top: -1px;
-}
-</style>

package/src/components/NstcG6Components/NstcForm/SelectCashFlow/NstcSelectCashFlow.vue

@@ -1,123 +0,0 @@
-<!--
- * @Author: your name
- * @Date: 2022-01-13 11:06:47
- * @LastEditTime: 2022-02-14 09:47:37
- * @LastEditors: Please set LastEditors
- * @Description: 现金流选择
- * @FilePath: NstcSelectCashFlow.vue
--->
-<template>
-  <SelectAndDialog v-model="_value" ref="select" v-bind="bindProps" :table-form="formSearch" :format-data="formatData" @show-dialog="onShowDialog">
-    <div class="form-wrap">
-      <el-form inline :model="formSearch">
-        <el-form-item :label="chMapper.flowNoLabel">
-          <el-input :placeholder="chMapper.plcInput" v-model="formSearch.flowNoLike" maxlength="60" clearable></el-input>
-        </el-form-item>
-        <el-form-item :label="chMapper.flowNameLabel">
-          <el-input :placeholder="chMapper.plcInput" v-model="formSearch.flowName" maxlength="60" clearable></el-input>
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="searchClick">查询</el-button>
-          <el-button class="nstc-g6-common-btn-3" @click="queryReset">重置</el-button>
-        </el-form-item>
-      </el-form>
-    </div>
-  </SelectAndDialog>
-</template>
-
-<script>
-import SelectAndDialog from "../SelectAndDialog/NstcSelectAndDialog.vue";
-export default {
-  name: "NstcSelectCashFlow",
-  components: { SelectAndDialog },
-  props: {
-    value: String,
-    queryConf: {
-      type: Object,
-      default: () => {}
-    },
-    chMapper: {
-      type: Object,
-      default: () => ({
-        title: "选择现金流",
-        plcInput: "请输入",
-        plcSelect: "请选择",
-        noselectmsg: "请选择现金流",
-        flowNoLabel: "现金流编号",
-        flowNameLabel: "现金流名称"
-      })
-    }
-  },
-  data() {
-    return {
-      formSearch: {
-        flowNoLike: "",
-        flowName: ""
-      },
-      bindProps: {}
-    };
-  },
-  computed: {
-    _value: {
-      set(val) {
-        this.$emit("input", val);
-      },
-      get() {
-        return this.value;
-      }
-    }
-  },
-  created() {
-    let url = "/api/nstc-mdm/1.0/cashflow"
-    let props = {
-      columns: [
-        { prop: "flowNo", label: this.chMapper.flowNoLabel },
-        { prop: "flowName", label: this.chMapper.flowNameLabel }
-      ],
-      url: this.queryConf.url || url,
-      params: this.queryConf.defaultParam || { resultType: 0, lastNode: 1 },
-      rowKey: "flowNo",
-      valueKey: "flowNo",
-      labelKey: "flowName",
-      chMapper: this.chMapper
-    };
-    this.bindProps = props;
-  },
-  mounted() {},
-  methods: {
-    formatData(res) {
-      let data = [],
-        total = 0;
-      if (res && !res.total && Array.isArray(res)) {
-        data = res;
-        total = res.length;
-      } else if (res && res.total && res.list) {
-        data = res.list || [];
-        total = res.total;
-      }
-      data = data.map((item) => {
-        return {
-          flowNo: item.flowNo,
-          flowName: item.flowName
-        };
-      });
-      return { data, total };
-    },
-
-    onShowDialog() {
-      this.queryReset();
-    },
-
-    searchClick() {
-      this.$refs.select.queryTableData();
-    },
-
-    queryReset() {
-      this.formSearch = {
-        flowNoLike: "",
-        flowName: ""
-      };
-    }
-  }
-};
-</script>