vxe

src/components/HColSet/components/tableColDrag.vue

@@ -11,7 +11,7 @@
         <a-button
           v-for="(item, index) in colData"
           :key="`${item.value}--${index}`"
-          :type="btnType(item.data)"
+          :type="btnType(item.data || item.dataIndex)"
           :draggable="true"
           v-show="item.show !== false"
           @click="chooseCol(item)"
@@ -21,11 +21,11 @@
           @dragend="handleDragEnd($event, item)"
         >
           <a-checkbox v-model:checked="item.visible" class="mr10" @click="$event.stopPropagation()" />
-          {{ item.title }}
+          {{ item.title || item.customTitle }}
         </a-button>
       </transition-group>
     </div>
-    <a-form ref="form" :model="formData" :rules="rules" layout="vertical">
+    <a-form v-if="tbType == 'excel'" ref="form" :model="formData" :rules="rules" layout="vertical">
       <a-row :gutter="15">
         <a-col :span="6">
           <a-form-item label="列头标题（中文）" name="title">
@@ -47,6 +47,28 @@
         </a-col>
       </a-row>
     </a-form>
+    <a-form v-else ref="form" :model="formData" :rules="rules" layout="vertical">
+      <a-row :gutter="15">
+        <a-col :span="6">
+          <a-form-item label="列头标题（中文）" name="title">
+            <a-input v-model:value="formData.customTitle" :disabled="formDisable" />
+          </a-form-item>
+        </a-col>
+        <a-col :span="6">
+          <a-form-item label="列头标题（英文）" name="enTitle">
+            <a-input v-model:value="formData.enTitle" :disabled="formDisable" />
+          </a-form-item>
+        </a-col>
+        <a-col :span="6">
+          <a-form-item label="列宽">
+            <a-input
+              v-model:value="formData.width"
+              :disabled="formDisable"
+            />
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </a-form>
   </div>
 </template>
 
@@ -84,11 +106,11 @@
   }
   // 列按钮点击事件
   const chooseCol = (item) => {
-    if (colName.value && colName.value === item.data) {
+    if (colName.value && colName.value === (item.data || item.dataIndex)) {
       colName.value = null
       formData.value = {}
     } else {
-      colName.value = item.data
+      colName.value = item.data || item.dataIndex
       formData.value = item
     }
   }
@@ -111,7 +133,7 @@
   }
   // 拖动结束处理数据
   const handleDragEnd = () => {
-    if (ending.data === dragging.data) {
+    if ((ending.data === dragging.data) || (ending.dataIndex === dragging.dataIndex)) {
       return
     }
     // 新的数组
@@ -122,12 +144,14 @@
     const dst = newItems.indexOf(ending)
     newItems.splice(src, 1, ...newItems.splice(dst, 1, newItems[src]))
     colData.value = newItems
-    console.log(colData.value)
   }
   const getColList = () => {
     return colData.value
   }
-  const init = (list) => {
+  // 当前表格类型
+  const tbType = ref('excel')
+  const init = (list, type) => {
+    if (type) tbType.value = type
     colData.value = list
   }
   defineExpose({

src/components/HColSet/index.vue

@@ -69,7 +69,7 @@
       type: [String, Number],
       default: null
     },
-    // 表格类型(正常的vxe表格、handsontable)
+    // 表格类型(正常的vxe表格、handsontable): 默认handsontable
     type: {
       type: String,
       defalult: 'excel'
@@ -83,30 +83,34 @@
   const init = () => {
     visible.value = true
     nextTick(() => {
-      console.log(colData.value)
-      TableColDragRef.value.init(colData.value)
+      TableColDragRef.value.init(colData.value, props.type)
     })
   }
   onMounted(() => {
-    console.log(props.columns)
     if (props.type == 'excel') {
       colData.value = props.columns.data
     } else {
-      colData.value = props.columns
+      colData.value = JSON.parse(JSON.stringify(props.columns))
     }
   })
   const handleOk = (b) => {
-    const content = JSON.stringify(TableColDragRef.value.getColList())
-    EditCustomColumnSet({
-      customTableCode: props.code,
-      templateName: props.code,
-      content,
-      id: props.columns?.id || 0
-    }).then(res => {
-      createMessage.success(res.message)
-      emits('updateCol', TableColDragRef.value.getColList())
-      if (!b) visible.value = false
-    })
+    if (props.type == 'excel') {
+      // handsontable设置
+      const content = JSON.stringify(TableColDragRef.value.getColList())
+      EditCustomColumnSet({
+        customTableCode: props.code,
+        templateName: props.code,
+        content,
+        id: props.columns?.id || 0
+      }).then(res => {
+        createMessage.success(res.message)
+        emits('updateCol', TableColDragRef.value.getColList())
+        if (!b) visible.value = false
+      })
+    } else {
+      // vxe设置
+
+    }
   }
   watch(
     () => props.columns,

src/components/Table/src/BasicTable.vue

@@ -18,7 +18,7 @@
         <HColSet
           :code="getBindValues.id"
           :columns="columns"
-          type="normal"
+          type="vxe"
         />
       </div>
     </div>

src/components/Table/src/hooks/useColumns.ts

@@ -145,6 +145,7 @@ export function useColumns(
 
   const getViewColumns = computed(() => {
     const viewColumns = sortFixedColumn(unref(getColumnsRef))
+    console.log(getColumnsRef)
 
     const mapFn = (column) => {
       const { slots, customRender, format, edit, editRow, flag } = column
@@ -165,7 +166,6 @@ export function useColumns(
       if ((edit || editRow) && !isDefaultAction) {
         column.customRender = renderEditCell(column)
       }
-      console.log(reactive(column))
       return reactive(column)
     }
 

src/views/operation/seaexport/index.vue

@@ -423,6 +423,7 @@ const calcColumns = [
     width: 120,
   }
 ]
+console.log(columns)
 // 只调用一次设置列接口
 const fieldFlag = ref(true)
 // 合计数据
@@ -501,7 +502,7 @@ const [registerTable, { reload, getVxeSelectRows, setLoading, setColumns }] = us
   useSearchForm: true,
   showTableSetting: true,
   bordered: true,
-  showIndexColumn: true,
+  showIndexColumn: false,
   indexColumnProps: {
     width: 60,
   },