cnhis-design-vue 0.3.8-beta → 0.3.9-beta

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

@@ -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 = () => {
@@ -103,6 +106,7 @@ export default defineComponent({
     return () => [
       <NSelect
         class="form-select-table"
+        placeholder='请选择'
         options={[]}
         consistentMenuWidth={false}
         clearable

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/useTableParse.ts

@@ -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/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/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/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;