cnhis-design-vue 0.3.8-beta → 3.0.0

package/packages/big-table/src/components/edit-form/edit-select-table.vue

@@ -1,8 +1,8 @@
 <script lang="tsx">
 import { defineComponent, ref, reactive } from 'vue'
 import { NSelect, NPagination, NEmpty, NSpin, NSpace } from 'naive-ui'
-import CGrid from '~/grid'
-import vexutils from '@/utils/vexutils'
+import CGrid from '~/grid/index.ts'
+import vexutils from '@/utils/vexutils.js'
 
 export default defineComponent({
   name: 'EditSelectTable',
@@ -29,7 +29,7 @@ export default defineComponent({
       default: ''
     }
   },
-  emits: ['update:value'],
+  emits: ['update:value', 'clickSelectTable'],
   setup (props, { attrs, slots, emit }) {
     const state = reactive({
       value: props.value,
@@ -62,11 +62,12 @@ export default defineComponent({
       state.loading = false
     }
     let selectTableSearch = (value: string) => {
-      console.log('keyword', value)
       state.keyword = value
       querySelectTableList()
     }
     selectTableSearch = vexutils.debounce(selectTableSearch, 800)
+    // 初始化搜索
+    selectTableSearch('')
     const getSelectTableGrid = () => {
       const config = {
         border: 'outer',
@@ -86,7 +87,9 @@ export default defineComponent({
       }}</CGrid>
     }
     const onCellClick = (data: any) => {
-      emit('update:value', data.row?.[props.col.columnName]);
+      const { row } = data
+      // emit('update:value', data.row?.[props.col.columnName])
+      emit('clickSelectTable', row)
       state.show = false
     }
     const getPagination = () => {
@@ -97,12 +100,15 @@ export default defineComponent({
           onUpdatePage={(page: number) => querySelectTableList()}
         />
       }
-      return <NSpace justify="space-between" align="center" style="margin-top: 5px">{[`共${state.pageCount}条`, pagination()]}</NSpace>
+      return <NSpace justify="space-between" align="center" style="margin-top: 5px">{{
+        default: () => [`共${state.pageCount}条`, pagination()]
+      }}</NSpace>
     }
     
     return () => [
       <NSelect
         class="form-select-table"
+        placeholder='请选择'
         options={[]}
         consistentMenuWidth={false}
         clearable
@@ -114,7 +120,7 @@ export default defineComponent({
         onBlur={() => state.show = false}
         onSearch={selectTableSearch}
       >{{
-        action: () => state.loading ? <NSpace justify="center"><NSpin class="spin" size="small" /></NSpace> : [getSelectTableGrid(), state.pageCount ? getPagination() : null]
+        action: () => state.loading ? <NSpace justify="center">{{ default: () => <NSpin class="spin" size="small" /> }}</NSpace> : [getSelectTableGrid(), state.pageCount ? getPagination() : null]
       }}</NSelect>
     ]
   }

package/packages/big-table/src/components/edit-form/edit-select.vue

@@ -11,14 +11,35 @@ export default defineComponent({
   props: {
     col: {
       type: Object,
-      default: {}
+      default: () => {}
+    },
+    row: {
+      type: Object,
+      default: () => {}
     }
   },
+  emits: ['setOptions'],
   setup (props, { attrs, slots, emit }) {
+    
     const state = reactive({
-      options: JSON.parse(JSON.stringify(props.col.options || []))
+      options: [] as any
     })
-    
+    const setOptions = async () => {
+      if (props.col.options) {
+        state.options = JSON.parse(JSON.stringify(props.col.options))
+      } else {
+        // 此处需要缓存第一次请求到的options,不需要每次都请求,
+        // 此处的row参数应当是selectTable的row
+        const optionsName = `${props.col.columnName}_options`
+        state.options = props.row[optionsName] || await props.col.queryOptions(props.row.row)
+        if (!props.row[optionsName]) {
+          emit('setOptions', state.options)
+        }
+      }
+    }
+
+    setOptions()
+
     return () => [
       <NSelect
         {...attrs} 

package/packages/big-table/src/hooks/useEdit.ts

@@ -0,0 +1,73 @@
+import { computed, ref, reactive, watch, onMounted } from 'vue'
+
+export const useEdit = (props: any, state: any, emit: any, xGrid: any) => {
+  const initEditTable = async () => {
+    const { isEdit, fieldList } = props.columnConfig
+    if (!isEdit) return
+    const hasSelectTable = fieldList.find((v: any) => v.formType === 'selectTable')
+    if (!hasSelectTable) return
+    const record: any = {
+      initRow: true
+    }
+    props.columnConfig.fieldList.forEach((col: any) => {
+      if (col.columnName !== 'operatorColumn') {
+        record[col.columnName] = undefined
+      }
+    })
+    await xGrid.value.insertAt(record, -1)
+  }
+
+  const deleteRow = (row: any) => {
+    xGrid.value.remove(row)
+  }
+
+  const activeMethod = ({ row, rowIndex, column, columnIndex }: { row: any, rowIndex: number, column: any, columnIndex: number }) => {
+    const { isEdit, fieldList } = props.columnConfig
+    // console.log('activeMethod->', row, column)
+    if (isEdit) {
+      const selectTableObj = fieldList.find((v: any) => v.formType === 'selectTable')
+      const isEditCol = fieldList.find((v: any) => v.columnName === column.field)?.isEdit || false
+      if (selectTableObj) {
+        // const isOtherEditCol = Object.keys(row).some(v => v !== selectTableObj.columnName && v !== 'checked' && !!row[v])
+        if (isEditCol && ((column.field === selectTableObj.columnName && !row[column.field]) || (column.field !== selectTableObj.columnName && !row.initRow))) {
+          return true
+        } else {
+          return false
+        }
+      } else {
+        if (isEditCol) {
+          return true
+        } else {
+          return false
+        }
+      }
+    } else {
+      return false
+    }
+  }
+  
+  const onClickSelectTable = async (row: any) => {
+    const record: any = {
+      initRow: false,
+      row: JSON.parse(JSON.stringify(row))
+    }
+    props.columnConfig.fieldList.forEach((col: any) => {
+      if (col.columnName !== 'operatorColumn') {
+        record[col.columnName] = undefined
+        if (Object.keys(row).includes(col.columnName)) {
+          record[col.columnName] = row[col.columnName]
+        }
+      }
+    })
+    const getInsertRecords = xGrid.value.getInsertRecords()
+    await xGrid.value.insertAt(record, getInsertRecords.at(-1))
+    xGrid.value.clearActived()
+  }
+  
+  return {
+    initEditTable,
+    activeMethod,
+    deleteRow,
+    onClickSelectTable
+  }
+}

package/packages/big-table/src/hooks/useFormat.ts

@@ -1,4 +1,4 @@
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 interface Idata {
   tableList: any[];
   fieldList: any[];

package/packages/big-table/src/hooks/useNestTable.ts

@@ -1,5 +1,5 @@
 import { computed, ref, reactive, watch, onMounted } from 'vue'
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 
 export const useNestTable = (props: any, state: any, emit: any) => {
 

package/packages/big-table/src/hooks/useTableParse.ts

@@ -1,4 +1,4 @@
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 
 export const useTableParse = (formatData: Function) => {
   // DURATION - 解析时长类型
@@ -90,8 +90,8 @@ export const useTableParse = (formatData: Function) => {
       return "";
     }
 
-    const { mergedFeildExpression } = field.settingObj;
-    if (mergedFeildExpression) {
+    if (field.settingObj?.mergedFeildExpression) {
+      const { mergedFeildExpression } = field.settingObj
       const passList: any = [];
 
       // 合并字段

package/packages/big-table/src/utils.ts

@@ -1,5 +1,5 @@
 import { nextTick } from 'vue';
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 import xb_small from './assets/img/xb_small.png';
 
 const isJSON = (str: any) => {

package/packages/button-print/index.ts

@@ -2,14 +2,14 @@ import type { App } from "vue";
 // 导入组件
 import ButtonPrint from "./src/ButtonPrint.vue"
 
-type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
+// type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
 
 // 为组件提供 install 安装方法，供按需引入
 ButtonPrint.install = function(app: App) {
   app.component(ButtonPrint.name, ButtonPrint);
 };
 
-const CButtonPrint: SFCWithInstall<typeof ButtonPrint> = ButtonPrint; // 增加类型
+// const CButtonPrint: SFCWithInstall<typeof ButtonPrint> = ButtonPrint; // 增加类型
 
 // 默认导出组件
-export default CButtonPrint;
+export default ButtonPrint;

package/packages/button-print/src/ButtonPrint.vue

@@ -34,7 +34,7 @@
 </template>
 
 <script lang="ts">
-import create from '@/core/create';
+import create from '@/core/create.js';
 export default create({
   name: "ButtonPrint"
 })
@@ -48,7 +48,7 @@ import { useMessage } from 'naive-ui'
 import type { DropdownOption } from 'naive-ui'
 import Print from './utils/print.es.min.js';
 // import vClickoutside from '@/utils/clickoutside';
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 // import type { Props } from './interfaces'
 import IdentityVerification from './components/IdentityVerification.vue';
 import axios from 'axios'

package/packages/button-print/src/components/IdentityVerification.vue

@@ -36,7 +36,7 @@ import { ref, reactive, computed, watch, onMounted, nextTick } from 'vue'
 import { NButton, NModal, NForm, NFormItem, NInput, FormRules, FormInst } from 'naive-ui'
 import { useMessage } from 'naive-ui'
 import axios from 'axios';
-import crypto from '../utils/crypto.js';
+import crypto from '@/utils/crypto.js';
 // const crypto:any = import.meta.globEager('./utils/crypto.js');
 
 (window as any).$message = useMessage()

package/packages/drag-layout/index.ts

@@ -2,14 +2,14 @@ import type { App } from "vue";
 // 导入组件
 import DragLayout from "./src/DragLayout.vue"
 
-type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
+// type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
 
 // 为组件提供 install 安装方法，供按需引入
 DragLayout.install = function(app: App) {
   app.component(DragLayout.name, DragLayout);
 };
 
-const CDragLayout: SFCWithInstall<typeof DragLayout> = DragLayout; // 增加类型
+// const CDragLayout: SFCWithInstall<typeof DragLayout> = DragLayout; // 增加类型
 
 // 默认导出组件
-export default CDragLayout;
+export default DragLayout;

package/packages/drag-layout/src/DragLayout.vue

@@ -245,7 +245,7 @@
 </template>
 
 <script lang="ts">
-import create from '@/core/create';
+import create from '@/core/create.js';
 export default create({
   name: "DragLayout"
 })
@@ -257,7 +257,7 @@ import { NGrid, NGridItem, NFormItemGi, NButton, NModal, NForm, NFormItem, NInpu
 import draggable from "vuedraggable";
 import DragFormLeftItem from "./DragFormLeftItem.vue";
 import DragFormRightItem from "./DragFormRightItem.vue";
-import vexutils from '@/utils/vexutils';
+import vexutils from '@/utils/vexutils.js';
 
 const dragLayoutContainer: any = ref(null)
 const textArea: any = ref(null)

package/packages/grid/index.ts

@@ -3,7 +3,7 @@ import type { App } from "vue";
 // 导入组件
 import Grid, { VXETable } from "./src/Grid"
 
-type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
+// type SFCWithInstall<T> = T & { install(app: App): void }; // vue 安装
 
 // 为组件提供 install 安装方法，供按需引入
 Grid.install = function(app: App) {
@@ -11,7 +11,7 @@ Grid.install = function(app: App) {
   app.use(VXETable);
 };
 
-const CGrid: SFCWithInstall<typeof Grid> = Grid; // 增加类型
+// const CGrid: SFCWithInstall<typeof Grid> = Grid; // 增加类型
 
 // 默认导出组件
-export default CGrid;
+export default Grid;

package/packages/grid/src/Grid.tsx

@@ -2,7 +2,7 @@ import { defineComponent } from "vue"
 import 'xe-utils'
 import VXETable, { Grid } from 'vxe-table'
 import 'vxe-table/lib/style.css'
-import create from '@/core/create';
+import create from '@/core/create.js';
 import { useMethods } from './hooks'
 
 export { VXETable }

package/src/core/{create.ts → create.js}

@@ -1,5 +1,5 @@
 import { KEY_COMPONENT_NAME } from '../global/variable';
-export default function(vm: any) {
+export default function(vm) {
   vm.name = KEY_COMPONENT_NAME + (vm.name || '');
   return vm;
 }

package/src/utils/{vexutils.ts → vexutils.js}

@@ -2,7 +2,7 @@ import XEUtils from 'xe-utils';
 import moment from 'moment';
 // com内容来源于老项目
 const com = {
-  parseCondition: function(conList: any, data: any, fieldList: any) {
+  parseCondition: function(conList, data, fieldList) {
     if (conList && conList.length > 0 && data && data.table) {
       for (let i = 0; i < conList.length; i++) {
         let conObj = conList[i];
@@ -19,7 +19,7 @@ const com = {
     }
     return true;
   },
-  getFieldByKey: function(fieldKey: any, fieldList: any) {
+  getFieldByKey: function(fieldKey, fieldList) {
     if (fieldList && fieldList.length > 0) {
       for (let i = 0; i < fieldList.length; i++) {
         let fobj = fieldList[i];
@@ -29,7 +29,7 @@ const com = {
       }
     }
   },
-  getConnection: function(cObj: any, fVal: any, field: any) {
+  getConnection: function(cObj, fVal, field) {
     let con = cObj.con;
     let value = cObj.value;
     // 修改 #['NULL','NOT_NULL'] 的判断:  value => fval    2020-09-15.
@@ -340,7 +340,7 @@ const com = {
     }
     return true;
   },
-  getBetween: function(value: any, type: any, comVal: any) {
+  getBetween: function(value, type, comVal) {
     if (value && value.indexOf('~') != -1 && value.split('~').length == 2) {
       let start = value.split('~')[0];
       let end = value.split('~')[1];
@@ -351,7 +351,7 @@ const com = {
       }
     }
   },
-  convertDate: function(str: string) {
+  convertDate: function(str) {
     if (str) {
       if (str.indexOf('-') != -1) {
         str = str = str.replace(/-/g, '/');
@@ -371,7 +371,7 @@ const com = {
       }
     }
   },
-  addDate: function(tempDate: any, days: any, unit: any) {
+  addDate: function(tempDate, days, unit) {
     let date = tempDate;
     if (['D', 'H', 'W'].includes(unit)) {
       if (tempDate && XEUtils.isValidDate(tempDate)) {
@@ -398,9 +398,9 @@ const com = {
       return new Date(date + days * 3600 * 1000);
     }
   },
-  addDiDate: function(curDate: any, count: any, unit = 'day', type: any) {
-    let useTime: any,
-      res: any = {};
+  addDiDate: function(curDate, count, unit = 'day', type) {
+    let useTime,
+      res = {};
     let getUnit = unit.toLowerCase();
     let useUnit = getUnit + 's';
     if (type == 'add') {
@@ -427,7 +427,7 @@ const com = {
       return new Date(year + '/10/01');
     }
   },
-  isNumber: function(val: any) {
+  isNumber: function(val) {
     try {
       let i = val * 1 + 100;
       if (i > 0 || i < 0 || i == 0) {
@@ -438,7 +438,7 @@ const com = {
     }
     return false;
   },
-  isDate: function(data: any) {
+  isDate: function(data) {
     if (isNaN(data) && !isNaN(Date.parse(data))) {
       return true;
     }
@@ -447,7 +447,7 @@ const com = {
 };
 XEUtils.mixin({
   ...com,
-  isJSON(str: any) {
+  isJSON(str) {
     if (typeof str == 'string') {
       try {
         let obj = JSON.parse(str);
@@ -466,7 +466,7 @@ XEUtils.mixin({
    * 获取按钮自定义颜色
    * @param {string} v
    */
-  getBtnStyle(v: any) {
+  getBtnStyle(v) {
     // custom_bg， white_bg， none_bg
     if (v.showStyle == 'white_bg') {
       return {
@@ -490,8 +490,8 @@ XEUtils.mixin({
     };
   },
 
-  oldColorMap(str: string) {
-    let oldMap: any = {
+  oldColorMap(str) {
+    let oldMap = {
       blue: 'blue',
       sky: 'skyblue',
       azure: 'azure',
@@ -510,24 +510,24 @@ XEUtils.mixin({
     return oldMap[str];
   },
 
-  validateBirthday(val: string, title: string, type: string) {
+  validateBirthday(val, title, type) {
     let res = true;
     if (!type) return false;
-    let regObj: any = {
+    let regObj = {
       DAYReg: /^([0-9]|[1-9][0-9]|[1-2][0-9][0-9]|[3][0-5][0-9]|(360|361|363|362|364|365))$/,
       MONTHReg: /^(?:[0-9]|1[0-2])$/,
       YEARReg: /^(?:[1-9]?\d|100)$/
     };
     let testReg = `${type}Reg`;
     if (!regObj[testReg].test(+val)) {
-      (window as any).$message.warning(`${title}${this.$t('1.9.40')}`, 2);
+      window.$message.warning(`${title}${this.$t('1.9.40')}`, 2);
       res = false;
     }
     return res;
   },
 
-  handleImageSize(item: any, defaultHeight: any) {
-    let res: any = {
+  handleImageSize(item, defaultHeight) {
+    let res = {
       display: 'inline-block',
       height: defaultHeight
     };
@@ -546,17 +546,17 @@ XEUtils.mixin({
    * @param {*} size 每次操作的数据量
    * @returns {Array}
    */
-  handleBigArrayCopy(arr: any, size = 1000) {
+  handleBigArrayCopy(arr, size = 1000) {
     if (!Array.isArray(arr)) return arr;
     let cSize = size || 1000;
-    const list: any = XEUtils.chunk(arr, cSize);
+    const list = XEUtils.chunk(arr, cSize);
 
     const copyFunc = (list = [], type = 'json') => {
-      const obj: any = {
-        json: (v: any) => JSON.parse(JSON.stringify(v)),
-        clone: (v: any) => XEUtils.clone(v, true)
+      const obj = {
+        json: (v) => JSON.parse(JSON.stringify(v)),
+        clone: (v) => XEUtils.clone(v, true)
       };
-      let copyList: any[] = [];
+      let copyList = [];
       list.forEach(v => {
         let rs = obj[type](v);
         copyList.push(rs);
@@ -574,7 +574,7 @@ XEUtils.mixin({
   },
 
   // color 获取 alpha
-  getAlphafloat(a?: number, alpha?: number) {
+  getAlphafloat(a, alpha) {
     if (typeof a !== 'undefined') {
       return parseFloat((a / 256).toFixed(2));
     }
@@ -590,11 +590,11 @@ XEUtils.mixin({
   },
 
   // hex 转 rgba
-  hexToRGBA(hex: any, alpha: any) {
-    const isValidHex = (hex: any) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
-    const getChunksFromString = (st: string, chunkSize: number) => st.match(new RegExp(`.{${chunkSize}}`, 'g'));
+  hexToRGBA(hex, alpha) {
+    const isValidHex = (hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex);
+    const getChunksFromString = (st, chunkSize) => st.match(new RegExp(`.{${chunkSize}}`, 'g'));
 
-    const convertHexUnitTo256 = (hexStr: any) => parseInt(hexStr.repeat(2 / hexStr.length), 16);
+    const convertHexUnitTo256 = (hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16);
 
     if (!isValidHex(hex)) {
       console.log('Invalid HEX');
@@ -602,7 +602,7 @@ XEUtils.mixin({
     }
     const chunkSize = Math.floor((hex.length - 1) / 3);
     const hexArr = getChunksFromString(hex.slice(1), chunkSize);
-    const [r, g, b, a] = (hexArr as any).map(convertHexUnitTo256);
+    const [r, g, b, a] = hexArr.map(convertHexUnitTo256);
     return {
       r: r,
       g: g,
@@ -617,7 +617,7 @@ XEUtils.mixin({
    * @param {type} type 时间戳类型
    * @param {time} time 时间戳
    */
-  formatTime(type: string, time: string) {
+  formatTime(type, time) {
     let format = '';
     if (!time) return '';
     switch (type) {
@@ -647,7 +647,7 @@ XEUtils.mixin({
     }
     return XEUtils.toDateString(time, format);
   },
-  formatDate(date: any, isShowYear: boolean = false) {
+  formatDate(date, isShowYear = false) {
     const today = new Date();
     const curDate = date || today.getTime();
 
@@ -670,7 +670,7 @@ XEUtils.mixin({
       return XEUtils.formatTime('MOUTHTIME', curDate);
     }
   },
-  imgs2imgArr(imgs?: string) {
+  imgs2imgArr(imgs) {
     if (!imgs) return [];
 
     return imgs
@@ -679,14 +679,14 @@ XEUtils.mixin({
       })
       .split('|');
   },
-  filterOption(input: string, option: any) {
+  filterOption(input, option) {
     try {
       let text = option.componentOptions.children[0].text;
       let lowText = text.toLowerCase();
       let lowInput = input.toLowerCase();
       let flag = false;
       var reg = /^[a-zA-Z]+$/;
-      if (typeof text === 'string' && reg.test(input) && ('' as any)._toPinYin) {
+      if (typeof text === 'string' && reg.test(input) && ''._toPinYin) {
         flag = lowText._toPinYin().indexOf(lowInput) >= 0;
       }
       return flag || lowText.indexOf(lowInput) >= 0;
@@ -701,7 +701,7 @@ XEUtils.mixin({
    * @param {*} k key
    * @returns
    */
-   stringToValue(item: any, k = "value") {
+   stringToValue(item, k = "value") {
       if (XEUtils.isString(item)) {
         if (item && item.startsWith("###{")) {
           let temp = JSON.parse(item.replace("###", ""));
@@ -711,7 +711,7 @@ XEUtils.mixin({
     return item;
   },
 
-  notEmpty(text: any) {
+  notEmpty(text) {
     return XEUtils.isBoolean(text) || String(text) === "0" || !!text;
   },
 
@@ -721,16 +721,16 @@ XEUtils.mixin({
    * @param {object} obj
    * @param {string | number} noval // 没有值，默认赋值
    */
-     handleSysParams(str: any, obj = {}, noval = "") {
+     handleSysParams(str, obj = {}, noval = "") {
       let p = {
         ...obj
       };
       const that = this;
       // 解析变量
       const getValList = (plsList = [], obj = {}) => {
-        var l: any[] = [];
+        var l = [];
         var o = obj;
-        plsList.forEach((v: any) => {
+        plsList.forEach(v => {
           let c = v;
           // xx.xx
           if (v.includes(".")) {
@@ -747,7 +747,7 @@ XEUtils.mixin({
         });
         return l;
       };
-      const getVal = (t: any, r: any, k: any) => {
+      const getVal = (t, r, k) => {
         return t.replace(r, function() {
           var pKey = arguments[1];
           // 切割
@@ -786,7 +786,7 @@ export default XEUtils;
 
 export { moment };
 
-export function formatReleaseTime(type: string, time: any) {
+export function formatReleaseTime(type, time) {
   if (time < 0) {
     return '';
   }

package/tsconfig.node.json

@@ -1,8 +1,8 @@
-{
-  "compilerOptions": {
-    "composite": true,
-    "module": "esnext",
-    "moduleResolution": "node"
-  },
-  "include": ["vite.config.ts"]
-}
+{
+  "compilerOptions": {
+    "composite": true,
+    "module": "esnext",
+    "moduleResolution": "node"
+  },
+  "include": ["vite.config.ts"]
+}