fix: 修改表格

src/components/ProForm/index.vue

@@ -142,7 +142,7 @@ props.itemsOptions.forEach(async item => {
 })
 const emits = defineEmits<EmitEvent>()
 // 监听itemsOptions变化
-watch(props.itemsOptions, () => {
+watch(props, () => {
   // 处理表单项需要的参数
   props.itemsOptions.forEach(async item => {
     await setEnumMap(item)

src/components/ProTable/index.vue

@@ -113,7 +113,6 @@ const props = withDefaults(defineProps<ProTableProps>(), {
   pagination: true,
   initParam: {},
   border: true,
-  data: () => [],
   toolButton: true,
   isShowSearch: true,
   rowKey: 'id',

src/views/db/database/index.vue

@@ -15,7 +15,7 @@
     <div class="table-box card content-box-c">
       <div class="table-container">
         <span>当前表：{{ currentNode.schemaName }} / {{ currentNode.tableName }}</span>
-        <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
+        <el-tabs v-model="activeName" class="demo-tabs">
           <el-tab-pane label="基本信息" name="1">
             <el-descriptions title="元数据" size="small" :column="1" colon border>
               <el-descriptions-item label="表名称">{{ tableMeta.tableName }}</el-descriptions-item>
@@ -46,12 +46,13 @@
             </ProTable>
           </el-tab-pane>
           <el-tab-pane label="取样数据" name="4">
-            <ProTable :pagination="false" :is-show-search="false" :tool-button="false" :columns="dataColumns" :data="sampleData?.rows || []">
-              <!-- 表格操作 -->
+            <el-table :data="sampleData?.rows" border>
               <template #empty>
-                <span>单击左侧展开"数据源"来查看表的元数据记录</span>
+                <span>单击左侧展开"数据源导航树"来查看表的数据记录</span>
               </template>
-            </ProTable>
+              <el-table-column v-for="(item, index) in sampleData?.columns" :prop="item" :label="item" :key="index" show-overflow-tooltip>
+              </el-table-column>
+            </el-table>
           </el-tab-pane>
         </el-tabs>
       </div>
@@ -60,11 +61,11 @@
 </template>
 
 <script setup lang="tsx" name="UserManage">
-import { ref, reactive, computed } from 'vue'
+import { ref, reactive } from 'vue'
 // import TreeFilter from '@/components/TreeFilter/index.vue'
 import { getNameListApi } from '@/api/modules/db/connection'
 import { getSchemasApi, getTablesApi, getTablesMetaApi, getTablesDataApi } from '@/api/modules/db/metadata'
-import type { TabsPaneContext } from 'element-plus'
+// import type { TabsPaneContext } from 'element-plus'
 import ProTable from '@/components/ProTable/index.vue'
 import { ColumnProps } from '@/components/ProTable/interface'
 const activeName = ref('1')
@@ -85,9 +86,9 @@ const currentNode = ref({
 
 let sampleData = ref<any>()
 
-const handleClick = (tab: TabsPaneContext, event: Event) => {
-  console.log(tab, event)
-}
+// const handleClick = (tab: TabsPaneContext, event: Event) => {
+//   console.log(tab, event)
+// }
 const loadNode = (node, resolve) => {
   if (node.level === 0) {
     const rootNode = [{ label: '数据源导航树', value: 0, hasChild: true, children: 'child' }]
@@ -183,8 +184,7 @@ const renderContent = (h, { node, data }) => {
     return (
       <div class="custom-tree-node">
         <i class={icon_pic}></i>
-        <el-tooltip class="item" effect="light" placement="left">
-          <div slot="content">{node.label}</div>
+        <el-tooltip class="item" content={node.label} effect="light" placement="left">
           <span>{data.label}</span>
         </el-tooltip>
       </div>
@@ -210,19 +210,6 @@ const indexColumns = reactive<ColumnProps<any>[]>([
   { prop: 'indexName', label: '索引名称' },
   { prop: 'indexFields', label: '索引字段' }
 ])
-const dataColumns = computed(() => {
-  if (activeName.value === '4') {
-    const columns = sampleData.value.columns.map(item => {
-      return {
-        prop: item,
-        label: item
-      }
-    })
-    return columns
-  } else {
-    return []
-  }
-})
 </script>
 <style scoped lang="scss">
 @import './index.scss';