n20-common-lib 1.2.43 → 1.3.0

package/src/components/NstcG6Components/NstcForm/List.vue

@@ -0,0 +1,146 @@
+<template>
+  <div class="form-base-wrapper">
+    <template v-for="(item, idx) in config">
+      <template v-if="Array.isArray(item)">
+        <div
+          :key="'inlineItem' + idx"
+          class="form-group"
+        >
+          <template v-for="(iItem, index) in item">
+            <BaseItem
+              v-if="iItem.renderable !== false"
+
+              :key="iItem.mold + '-' + (iItem.prop ? iItem.prop : (idx + '-' + index))"
+
+              v-model="value"
+              :formData="formData"
+
+              :class="[
+                'form-item',
+                `form-item-${iItem.mold}`,
+                {
+                  'form-item-link': iItem.link && ((Array.isArray(iItem.link) && iItem.link.some(link => link.mold)) || iItem.link.mold)
+                },
+                `form-item-${iItem.mold}-${iItem.prop ? iItem.prop : idx + '-' + index}`
+              ]"
+
+              :popper-class="popperClass"
+
+              :item="iItem"
+              :resets.sync="resets"
+              :disableds="disableds"
+
+              :loading="loading"
+              :show-mode="showMode"
+
+              @after-leave="val => $emit('after-leave', val)"
+              @query-click="$emit('query-click')"
+              @add-click="$emit('add-click')"
+              @other-click="$emit('other-click')"
+              @enter-click="$emit('enter-click')"
+              @tree-node-click="(data, node) => $emit('tree-node-click', iItem.queryKey, data, node)"
+            />
+          </template>
+        </div>
+      </template>
+
+      <template v-else>
+        <BaseItem
+          v-if="item.renderable !== false"
+
+          :key="item.mold + '-' + (item.prop ? item.prop : idx)"
+
+          v-model="value"
+          :formData="formData"
+
+          :class="[
+            'form-item',
+            `form-item-${item.mold}`,
+            {
+              'form-item-link': item.link && ((Array.isArray(item.link) && item.link.some(link => link.mold)) || item.link.mold)
+            },
+            `form-item-${item.mold}-${item.prop ? item.prop : idx}`
+          ]"
+
+          :popper-class="popperClass"
+
+          :item="item"
+          :resets.sync="resets"
+          :disableds="disableds"
+
+          :loading="loading"
+
+          :from="from"
+          :show-mode="showMode"
+
+          @after-leave="val => $emit('after-leave', val)"
+          @query-click="$emit('query-click')"
+          @add-click="$emit('add-click')"
+          @other-click="$emit('other-click')"
+          @enter-click="$emit('enter-click')"
+          @tree-node-click="(data, node) => $emit('tree-node-click', iItem.queryKey, data, node)"
+        />
+      </template>
+    </template>
+  </div>
+</template>
+
+<script>
+
+import BaseItem from './Item'
+
+export default {
+  name: 'FormCustomBaseList',
+
+  components: {
+    BaseItem
+  },
+
+  inheritAttrs: false,
+
+  props: {
+    formData: {
+      type: Object,
+      default: () => ({})
+    },
+    from: {
+      type: String,
+      default: null,
+    },
+    config: {
+      type: Array,
+      default: () => ([])
+    },
+
+    loading: {
+      default: false,
+      type: Boolean
+    },
+    popperClass: {
+      type: String,
+      default: ''
+    },
+
+    resets: {
+      default: () => ({}),
+      type: Object
+    },
+
+    disableds: {
+      default: () => ({}),
+      type: Object
+    },
+
+    value: {
+      default: () => ({}),
+      type: Object
+    },
+
+    // 显示模式
+    showMode: {
+      type: String,
+      default: ''
+    }
+  },
+}
+</script>

package/src/components/NstcG6Components/NstcForm/ListSecond.vue

@@ -0,0 +1,130 @@
+<template>
+  <div class="form-base-wrapper">
+    <template v-for="(item, idx) in config">
+      <template v-if="Array.isArray(item)">
+        <div
+          :key="'inlineItem' + idx"
+          class="form-group"
+        >
+          <template v-for="(iItem, index) in item">
+            <BaseItem
+              v-if="iItem.renderable !== false"
+
+              :key="iItem.mold + '-' + (iItem.prop ? iItem.prop : (idx + '-' + index))"
+
+              v-model="value"
+
+              :class="[
+                'form-item',
+                `form-item-${iItem.mold}`,
+                {
+                  'form-item-link': iItem.link && ((Array.isArray(iItem.link) && iItem.link.some(link => link.mold)) || iItem.link.mold)
+                },
+                `form-item-${iItem.mold}-${iItem.prop ? iItem.prop : idx + '-' + index}`
+              ]"
+
+              :popper-class="popperClass"
+
+              :item="iItem"
+              :resets.sync="resets"
+              :disableds="disableds"
+
+              :loading="loading"
+
+              @after-leave="val => $emit('after-leave', val)"
+              @query-click="$emit('query-click')"
+              @add-click="$emit('add-click')"
+              @other-click="$emit('other-click')"
+              @enter-click="$emit('enter-click')"
+            />
+          </template>
+        </div>
+      </template>
+
+      <template v-else>
+        <BaseItem
+          v-if="item.renderable !== false"
+
+          :key="item.mold + '-' + (item.prop ? item.prop : idx)"
+
+          v-model="value"
+
+          :class="[
+            'form-item',
+            `form-item-${item.mold}`,
+            {
+              'form-item-link': item.link && ((Array.isArray(item.link) && item.link.some(link => link.mold)) || item.link.mold)
+            },
+            `form-item-${item.mold}-${item.prop ? item.prop : idx}`
+          ]"
+
+          :popper-class="popperClass"
+
+          :item="item"
+          :resets.sync="resets"
+          :disableds="disableds"
+
+          :loading="loading"
+
+          :from="from"
+
+          @after-leave="val => $emit('after-leave', val)"
+          @query-click="$emit('query-click')"
+          @add-click="$emit('add-click')"
+          @other-click="$emit('other-click')"
+          @enter-click="$emit('enter-click')"
+        />
+      </template>
+    </template>
+  </div>
+</template>
+
+<script>
+
+import BaseItem from './ItemSecond'
+
+export default {
+  name: 'FormCustomBaseList',
+
+  components: {
+    BaseItem
+  },
+
+  inheritAttrs: false,
+
+  props: {
+    from: {
+      type: String,
+      default: null,
+    },
+    config: {
+      type: Array,
+      default: () => ([])
+    },
+
+    loading: {
+      default: false,
+      type: Boolean
+    },
+    popperClass: {
+      type: String,
+      default: ''
+    },
+
+    resets: {
+      default: () => ({}),
+      type: Object
+    },
+
+    disableds: {
+      default: () => ({}),
+      type: Object
+    },
+
+    value: {
+      default: () => ({}),
+      type: Object
+    }
+  }
+}
+</script>

package/src/components/NstcG6Components/NstcForm/RadioCustom/index.vue

@@ -0,0 +1,73 @@
+<template>
+  <el-radio-group
+    v-model="_value"
+    v-bind="$attrs"
+    :style="{width:parseFloat(width) + 'px'}"
+    v-on="$listeners"
+  >
+    <template v-for="item in options">
+      <el-radio-button
+        v-if="type === 'button'"
+        :key="item.value"
+        :label="item.value"
+        :disabled="item.disabled"
+      >
+        {{ item.label }}
+      </el-radio-button>
+      <el-radio
+        v-else
+        :key="item.value"
+        :label="item.value"
+        :disabled="item.disabled"
+        :border="type === 'border'"
+      >
+        {{ item.label }}
+      </el-radio>
+    </template>
+  </el-radio-group>
+</template>
+
+<script>
+export default {
+  name: 'RadioCustom',
+
+  props: {
+    value: {
+      type: [Boolean, String, Number, Array],
+      default: null
+    },
+
+    type: {
+      default: 'normal',
+      validator: function(val) {
+        return ['normal', 'border', 'button'].includes(val)
+      }
+    },
+
+    width: {
+      type: [String, Number],
+      default: ''
+    },
+
+    options: {
+      type: Array,
+      default: () => []
+    }
+  },
+
+  computed: {
+    _value: {
+      get() {
+        return this.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

package/src/components/NstcG6Components/NstcForm/SelectAccount/NstcSelectAccount.vue

@@ -0,0 +1,334 @@
+<!--
+ * @Author: your name
+ * @Date: 2022-01-13 11:06:47
+ * @LastEditTime: 2022-02-21 14:24:07
+ * @LastEditors: Please set LastEditors
+ * @Description: 选择账户
+ * @FilePath: NstcSelectCashFlow.vue
+-->
+<template>
+  <SelectAndDialog
+    ref="select"
+    v-model="_value"
+    v-bind="bindProps"
+    :lazy-load="true"
+    :table-form="formSearch"
+    :format-data="formatData"
+    :format-params="formatParams"
+    @show-dialog="onShowDialog"
+    @comfirm="selectOption"
+  >
+    <div class="form-wrap">
+      <el-form inline :model="formSearch" :label-width="labelWidth">
+        <el-row>
+          <el-col :span="8">
+            <el-form-item :label="chMapper.accountAgencyLabel">
+              <el-select
+                v-model="formSearch.brNo"
+                class="input-w"
+                :placeholder="chMapper.plcSelect"
+                filterable
+                clearable
+                :disabled="queryConf.defaultParam.diabledValue ? true : false"
+              >
+                <el-option
+                  v-for="item in agencyOptionsArr"
+                  :key="item.orgNo"
+                  :label="item.orgName"
+                  :value="item.orgNo"
+                />
+              </el-select>
+            </el-form-item>
+          </el-col>
+          <el-col :span="8">
+            <el-form-item :label="chMapper.accountLabel">
+              <el-input
+                v-model="formSearch.accountNo"
+                :placeholder="chMapper.plcInput"
+                maxlength="64"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="20">
+            <el-form-item :label="chMapper.accountNameLabel">
+              <el-input
+                v-model="formSearch.accountName"
+                :placeholder="chMapper.plcInput"
+                maxlength="64"
+                clearable
+              />
+            </el-form-item>
+          </el-col>
+          <el-col :span="4">
+            <div class="search-btn">
+              <el-button
+                type="primary"
+                class="nstc-g6-common-btn-1"
+                @click="searchClick"
+                >查询</el-button
+              >
+              <el-button
+                class="nstc-g6-common-btn-3"
+                style="margin-left: 8px"
+                @click="queryReset"
+                >重置</el-button
+              >
+            </div>
+          </el-col>
+        </el-row>
+      </el-form>
+    </div>
+  </SelectAndDialog>
+</template>
+
+<script>
+import axios from '@/utils/axios'
+import SelectAndDialog from '../SelectAndDialog/NstcSelectAndDialog.vue'
+export default {
+  name: 'NstcSelectAccount',
+  components: { SelectAndDialog },
+  props: {
+    value: String,
+    queryConf: {
+      type: Object,
+      default: () => {}
+    },
+    agencyOptionsConf: {
+      type: Object,
+      default: () => {}
+    },
+    filterData: {
+      type: Function,
+      default: (d) => d
+    },
+    valueKey: {
+      type: String,
+      default: 'accountNo'
+    },
+    labelKey: {
+      type: String,
+      default: 'accountNo'
+    },
+    rowKey: {
+      type: String,
+      default: 'accountId'
+    },
+    optionKey: {
+      type: String,
+      default: 'subjectNo'
+    },
+    labelWidth: {
+      type: String,
+      default: '80px'
+    },
+    chMapper: {
+      type: Object,
+      default: () => ({
+        title: '选择账号',
+        plcInput: '请输入',
+        plcSelect: '请输入或选择',
+        noselectmsg: '请选择账号',
+        accountAgencyLabel: '开户机构',
+        accountLabel: '账号',
+        accountNameLabel: '账户名',
+        accountNameTableLabel: '户名'
+      })
+    },
+
+    // 重新查询下拉数据
+    requery: {
+      default: false,
+      type: Boolean
+    }
+  },
+  data() {
+    return {
+      formSearch: {
+        brNo: '',
+        accountNo: '',
+        accountName: ''
+      },
+      showDialog: false,
+      inputHovering: false,
+      columns: [],
+      options: [],
+      remoteQuery: '',
+      searchObj: {
+        brNo: '',
+        accountNo: '',
+        accountName: ''
+      },
+      bindProps: {},
+      agencyOptionsArr: []
+    }
+  },
+  computed: {
+    _value: {
+      set(val) {
+        this.$emit('input', val)
+      },
+      get() {
+        return this.value
+      }
+    }
+  },
+
+  watch: {
+    // requery(val) {
+    //   if (val) {
+    //     this.$refs.select.queryAllData();
+    //   }
+    // },
+    // 'queryConf.defaultParam':{
+    //   handler:function(data) {
+    //     console.log(data,'------------')
+    //     this.$refs.select.queryAllData();
+    //   },
+    //   deep:true
+    // }
+  },
+
+  created() {
+    let url = '/api/nstc-tss/1.0/settle/account/list'
+    let props = {
+      columns: [
+        {
+          prop: 'accountNo',
+          label: this.chMapper.accountLabel,
+          align: 'center'
+        },
+        {
+          prop: 'accountName',
+          label: this.chMapper.accountNameTableLabel,
+          align: 'center'
+        },
+        {
+          prop: 'brName',
+          label: this.chMapper.accountAgencyLabel,
+          align: 'center'
+        }
+      ],
+      url: this.queryConf.url || url,
+      params: this.queryConf.defaultParam || {},
+      httpMethod: this.queryConf.httpMethod || 'POST',
+      rowKey: this.rowKey,
+      valueKey: this.valueKey,
+      labelKey: this.labelKey,
+      chMapper: this.chMapper
+    }
+    this.bindProps = props
+  },
+
+  methods: {
+    async agencyOptions() {
+      let defaultParam = this.agencyOptionsConf.defaultParam
+      let res = await this.queryOptionsApi(defaultParam)
+      this.agencyOptionsArr = res
+    },
+
+    queryOptionsApi(param) {
+      const { url, method } = this.agencyOptionsConf
+      let body = method === 'POST' ? 'data' : 'params'
+      let reqConf = { url, method }
+      reqConf[body] = param
+      return axios(reqConf)
+    },
+
+    // formatParams(pageParam) {
+    //   const { size, current } = pageParam;
+    //   let defaultParam = this.quryMergeConf.defaultParam;
+    //   let param = this.searchObj;
+    //   let page = { "pageSize": size, "pageNo": current };
+    //   if (this.queryConf.method == "POST") {
+    //     page = { page: { size, current } };
+    //   }
+    //   return { ...param,...defaultParam, ...page };
+    // },
+    formatParams(params) {
+      console.log(params, '----------params')
+      let size = 20
+      let current = 1
+      if (params['page.size']) {
+        size = params['page.size']
+        current = params['page.current']
+      }
+      if (params.page && params.page.size) {
+        size = params.page.size
+        current = params.page.current
+      }
+      let page = { pageSize: size, pageNo: current }
+      if (params.diabledValue && !params.brNo) {
+        params.brNo = params.diabledValue
+      }
+      return { ...params, ...page }
+    },
+
+    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
+      }
+      return this.filterData({ data, total })
+    },
+
+    searchBtnClick(event) {
+      this.queryReset()
+      this.showDialog = true
+      this.$nextTick(() => {
+        this.searchClick()
+      })
+    },
+
+    // searchClick() {
+    //   let formSearch = this.formSearch
+    //   this.searchObj = JSON.parse(JSON.stringify(formSearch));
+    //   this.$refs.dialog.queryData("searchbtn");
+    // },
+
+    onShowDialog() {
+      this.queryReset()
+      this.agencyOptions()
+    },
+
+    searchClick() {
+      this.$refs.select.queryTableData()
+    },
+
+    // 返回选中对象
+    selectOption(values, opt) {
+      if (this.$attrs.selectOpt) {
+        this.$emit('confirm', opt)
+        this.$attrs.selectOpt['item'] = opt
+      }
+    },
+
+    queryReset() {
+      this.formSearch = {
+        brNo: this.queryConf.defaultParam.diabledValue,
+        accountNo: '',
+        accountName: ''
+      }
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.search-btn {
+  color: #c0c4cc;
+  position: absolute;
+  right: 5px;
+  top: 0px;
+}
+.form-wrap ::v-deep .el-input__suffix-inner .el-input__icon {
+  line-height: 32px;
+}
+</style>