w-ui-v1 1.0.44 → 1.0.45

package/index.ts

@@ -14,6 +14,7 @@ import WSelectTable from './w-select-table/w-select-table.vue'
 import WFormMessageBox from './w-form-message-box/w-form-message-box.vue'
 import WAudio from './w-audio/w-audio.vue'
 import WReportTable from './w-report-table/w-report-table.vue'
+import {menu} from './utils/apis/menu'
 const coms: any[] = [
   wTest,
   wLogin,
@@ -37,5 +38,7 @@ function install(Vue: App) {
     Vue.component(com.name, com)
   })
 }
-
+export const api={
+	menu
+}
 export default install // 这个方法以后再使用的时候可以被vue.use调用

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "w-ui-v1",
-  "version": "1.0.44",
+  "version": "1.0.45",
   "description": "w-ui",
   "author": "wgxshh",
   "license": "ISC",

package/w-report-table/w-report-table.vue

@@ -62,13 +62,14 @@
                 <template v-for="(childCol, childIndex) in col.children" :key="childIndex">
                   <view 
                     :class="['body-cell', childCol.className]"
-                    :style="{
-                      flex: childCol.width || 1,
-                      'text-align': childCol.align || 'center',
-                      display: getRowSpan(row, childCol) === 0 ? 'none' : 'flex'
-                    }"
-                    :rowspan="getRowSpan(row, childCol)"
-                    :colspan="getColSpan(row, childCol)"
+                  :style="{
+                    width: childCol.width || 'auto',
+                    'min-width': childCol.width || 'auto',
+                    'text-align': childCol.align || 'center',
+                    display: getRowSpan(row, childCol) === 0 ? 'none' : 'block'
+                  }"
+                  :rowspan="getRowSpan(row, childCol) > 1 ? getRowSpan(row, childCol) : null"
+                  :colspan="getColSpan(row, childCol) > 1 ? getColSpan(row, childCol) : null"
                   >
                     {{ row[childCol.key] }}
                   </view>
@@ -78,12 +79,13 @@
                 <view 
                   :class="['body-cell', col.className]"
                   :style="{
-                    flex: col.width || 1,
+                    width: col.width || 'auto',
+                    'min-width': col.width || 'auto',
                     'text-align': col.align || 'center',
-                    display: getRowSpan(row, col) === 0 ? 'none' : 'flex'
+                    display: getRowSpan(row, col) === 0 ? 'none' : 'block'
                   }"
-                  :rowspan="getRowSpan(row, col)"
-                  :colspan="getColSpan(row, col)"
+                  :rowspan="getRowSpan(row, col) > 1 ? getRowSpan(row, col) : null"
+                  :colspan="getColSpan(row, col) > 1 ? getColSpan(row, col) : null"
                 >
                   {{ row[col.key] }}
                 </view>
@@ -103,15 +105,18 @@
         <!-- 合计行 -->
         <view v-if="showSummary" class="table-footer">
           <view class="table-row summary-row">
-            <view v-if="showCheckbox" class="checkbox-col"></view>
+            <view v-if="showCheckbox" class="checkbox-col summary-cell" style="width: 50px;"></view>
             <template v-for="(col, colIndex) in columns" :key="colIndex">
               <template v-if="col.children">
                 <template v-for="(childCol, childIndex) in col.children" :key="childIndex">
                   <view 
+                    v-if="!childCol.mergeRule || childCol.mergeRule(paginatedData[0], 0)"
                     :class="['summary-cell', childCol.className]"
                     :style="{
-                      flex: childCol.width || 1,
-                      'text-align': childCol.align || 'center'
+                      width: childCol.width || 'auto',
+                      'min-width': childCol.width || 'auto',
+                      'text-align': childCol.align || 'center',
+                      'flex': childCol.width || 1
                     }"
                   >
                     {{ getSummary(childCol) }}
@@ -120,17 +125,20 @@
               </template>
               <template v-else>
                 <view 
+                  v-if="!col.mergeRule || col.mergeRule(paginatedData[0], 0)"
                   :class="['summary-cell', col.className]"
                   :style="{
-                    flex: col.width || 1,
-                    'text-align': col.align || 'center'
+                    width: col.width || 'auto',
+                    'min-width': col.width || 'auto',
+                    'text-align': col.align || 'center',
+                    'flex': col.width || 1
                   }"
                 >
                   {{ getSummary(col) }}
                 </view>
               </template>
             </template>
-            <view v-if="showAction"></view>
+            <view v-if="showAction" class="action-col summary-cell" style="width: 120px; flex: 0 0 120px;"></view>
           </view>
         </view>
       </scroll-view>
@@ -274,22 +282,26 @@ const getRowSpan = (row: any, col: Column) => {
   if (!col.mergeRule) return 1
   
   const index = props.data.indexOf(row)
+  // 如果当前行不需要合并，返回1
   if (!col.mergeRule(row, index)) return 1
   
-  // 计算相同内容的连续行数
-  let span = 1
-  const currentValue = row[col.key]
-  
-  for (let i = index + 1; i < props.data.length; i++) {
-    if (props.data[i][col.key] === currentValue && 
-        (!col.mergeRule || col.mergeRule(props.data[i], i))) {
-      span++
-    } else {
-      break
+  // 如果是第一行或与前一行不同，则开始合并
+  if (index === 0 || props.data[index-1][col.key] !== row[col.key]) {
+    let span = 1
+    // 计算相同内容的连续行数
+    for (let i = index + 1; i < props.data.length; i++) {
+      if (props.data[i][col.key] === row[col.key] && 
+          col.mergeRule(props.data[i], i)) {
+        span++
+      } else {
+        break
+      }
     }
+    return span
   }
   
-  return span
+  // 如果与前一行相同，则返回0表示不显示
+  return 0
 }
 
 const getColSpan = (row: any, col: Column) => {
@@ -348,19 +360,23 @@ const handleAction = (action: Action, row: any) => {
   
   .table-container {
     width: 100%;
-    overflow: hidden;
+    overflow: auto;
+    border: 1px solid #ebeef5;
     
     .table-body {
-      width: 100%;
+      width: max-content;
+      min-width: 100%;
       height: 100%;
       
       .table-header, .table-body, .table-footer {
-        width: 100%;
+        width: max-content;
+        min-width: 100%;
       }
       
       .table-row {
         display: flex;
-        width: 100%;
+        width: max-content;
+        min-width: 100%;
         border-bottom: 1px solid #ebeef5;
       }
       
@@ -371,6 +387,13 @@ const handleAction = (action: Action, row: any) => {
         display: flex;
         align-items: center;
         justify-content: center;
+        box-sizing: border-box;
+        flex-shrink: 0;
+        min-width: 0;
+      }
+      
+      .summary-cell {
+        flex: none !important;
       }
       
       .group-header {
@@ -426,29 +449,48 @@ const handleAction = (action: Action, row: any) => {
     justify-content: space-between;
     align-items: center;
     margin-top: 16px;
-    padding: 8px 16px;
+    padding: 12px 16px;
     background-color: #f5f7fa;
+    border-radius: 4px;
     
     .page-controls {
       display: flex;
       align-items: center;
+      gap: 12px;
       
       button {
-        margin: 0 8px;
-        padding: 4px 12px;
+        padding: 6px 16px;
+        font-size: 12px;
         background-color: #fff;
         border: 1px solid #dcdfe6;
         border-radius: 4px;
         cursor: pointer;
+        transition: all 0.3s;
+        color: #606266;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
+        display: flex;
+        align-items: center;
+        gap: 4px;
+        
+        &:hover {
+          color: #409eff;
+          border-color: #c6e2ff;
+          background-color: #ecf5ff;
+          box-shadow: 0 1px 6px rgba(32, 160, 255, 0.2);
+        }
         
         &:disabled {
           color: #c0c4cc;
           cursor: not-allowed;
+          background-color: #f5f7fa;
+          border-color: #e4e7ed;
+          box-shadow: none;
         }
       }
       
       .page-current {
-        margin: 0 8px;
+        color: #606266;
+        font-weight: 500;
       }
     }
   }