jianghu-ui 1.0.2 → 1.0.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jianghu-ui",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "JianghuJS UI Component Library with Storybook, Vue 2, and Vuetify 2",
   "main": "src/index.js",
   "scripts": {
@@ -9,7 +9,10 @@
     "build": "webpack --config webpack.config.js",
     "build:watch": "webpack --config webpack.config.js --watch",
     "serve-storybook": "npx http-server storybook-static",
-    "deploy": "npm run build && npm run build-storybook && npx gh-pages -d storybook-static"
+    "deploy": "npm run build && npm run build-storybook && npx gh-pages -d storybook-static",
+    "release:patch": "npm version patch && npm run build && npm publish",
+    "release:minor": "npm version minor && npm run build && npm publish",
+    "release:major": "npm version major && npm run build && npm publish"
   },
   "keywords": [
     "jianghujs",

package/src/components/JhTable/JhTable.vue

@@ -117,6 +117,17 @@
           clearable
         ></v-text-field>
 
+        <!-- 导出按钮 -->
+        <v-btn
+          v-if="toolbarConfig.export"
+          icon
+          small
+          @click="handleExport"
+          title="导出"
+        >
+          <v-icon>mdi-export-variant</v-icon>
+        </v-btn>
+
         <!-- 刷新按钮 -->
         <v-btn
           v-if="toolbarConfig.refresh"
@@ -244,7 +255,7 @@
       :single-select="singleSelectComputed"
       :value="selectedItems"
       :item-key="rowKey"
-      :dense="dense"
+      :dense="tableDense"
       :multi-sort="multiSort"
       :must-sort="mustSort"
       :sort-by="internalSortBy"
@@ -964,6 +975,7 @@ export default {
           setting: true,
           density: true,
           fullscreen: false,
+          export: false, // Default to false, can be enabled via prop
           ...this.toolbar
         };
       }
@@ -972,7 +984,8 @@ export default {
         refresh: true,
         setting: true,
         density: true,
-        fullscreen: false
+        fullscreen: false,
+        export: false // Default to false
       };
     },
     // 可见的表头
@@ -992,6 +1005,15 @@ export default {
         }
       ];
     },
+    tableDense() {
+      if (this.currentDensity === 'compact') {
+        return true;
+      }
+      // For 'medium' and 'default', we don't use the dense prop, but a custom class.
+      // But we still respect the component's `dense` prop as a baseline.
+      return this.dense;
+    },
+
     // 密度样式类
     densityClass() {
       return {
@@ -1156,6 +1178,12 @@ export default {
         this.$nextTick(() => this.applySelectionState());
       }
     },
+    actionColumn: {
+      handler() {
+        this.initColumns(this.headers);
+      },
+      deep: true
+    },
     columnsState: {
       deep: true,
       handler(newVal) {
@@ -1194,10 +1222,31 @@ export default {
   methods: {
     // 初始化列配置
     initColumns(headers) {
+      const processedHeaders = [...(headers || [])];
+
+      if (this.actionColumn) {
+        const hasActionColumn = processedHeaders.some(h => h.value === 'action');
+
+        if (!hasActionColumn) {
+          const actionColumnConfig = {
+            text: '操作', value: 'action', sortable: false, width: 120, align: 'center', class: 'fixed', cellClass: 'fixed'
+          };
+
+          if (typeof this.actionColumn === 'object' && this.actionColumn !== null) {
+            const { title, ...restOfActionColumn } = this.actionColumn;
+            Object.assign(actionColumnConfig, restOfActionColumn);
+            if (title) {
+              actionColumnConfig.text = title;
+            }
+          }
+          processedHeaders.push(actionColumnConfig);
+        }
+      }
+
       const persistedState = this.getPersistedColumnState();
       const externalState = this.columnsState?.value;
       const defaultVisible = this.columnsState?.defaultVisible;
-      this.internalColumns = headers.map(h => {
+      this.internalColumns = processedHeaders.map(h => {
         const value = h.value || h.dataIndex || h.key;
         const baseVisible = h.visible !== false;
         const visible = this.resolveColumnVisible({
@@ -1463,6 +1512,10 @@ export default {
       this.emitColumnStateChange();
       this.$forceUpdate();
     },
+    // 导出表格
+    handleExport() {
+      this.$emit('export');
+    },
     // 刷新表格
     async handleRefresh() {
       this.$emit('refresh');
@@ -2000,6 +2053,16 @@ export default {
   flex: 1;
 }
 
+/* --- 密度调整 --- */
+/* 中等密度 */
+.jh-pro-table ::v-deep .jh-table-medium.v-data-table > .v-data-table__wrapper > table > thead > tr > th {
+  height: 40px;
+}
+.jh-pro-table ::v-deep .jh-table-medium.v-data-table > .v-data-table__wrapper > table > tbody > tr > td {
+  height: 40px;
+}
+
+
 .jh-pro-table-header-right {
   display: flex;
   align-items: center;