feat(home): 添加侧边栏宽度拖拽调整功能

- 新增侧边栏拖拽手柄，支持在200px至350px范围内调整宽度
- 优化菜单项文本显示，添加标题提示并启用文本溢出省略
- 调整滚动条样式，提升视觉体验
- 拖拽时禁用过渡动画以解决卡顿问题，优化交互流畅度

package-lock.json

@@ -116,6 +116,7 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.26.10.tgz",
       "integrity": "sha512-vMqyb7XCDMPvJFFOaT9kxtiRh42GwlZEg1/uIgtZshS5a/8OaduUfCi7kynKgc3Tw/6Uo2D+db9qBttghhmxwQ==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "@ampproject/remapping": "^2.2.0",
         "@babel/code-frame": "^7.26.2",
@@ -2019,6 +2020,7 @@
       "version": "6.7.2",
       "resolved": "https://registry.npmmirror.com/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-6.7.2.tgz",
       "integrity": "sha512-yxtOBWDrdi5DD5o1pmVdq3WMCvnobT0LU6R8RyyVXPvFRd2o79/0NCuQoCjNTeZz9EzA9xS3JxNWfv54RIHFEA==",
+      "peer": true,
       "dependencies": {
         "@fortawesome/fontawesome-common-types": "6.7.2"
       },
@@ -2791,6 +2793,7 @@
       "resolved": "https://mirrors.huaweicloud.com/repository/npm/@types/lodash-es/-/lodash-es-4.17.12.tgz",
       "integrity": "sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/lodash": "*"
       }
@@ -2801,6 +2804,7 @@
       "integrity": "sha512-F8Q+SeGimwOo86fiovQh8qiXfFEh2/ocYv7tU5pJ3EXMSSxk1Joj5wefpFK2fHTf/N6HKGSxIDBT9f3gCxXPkQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~6.20.0"
       }
@@ -3337,6 +3341,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "caniuse-lite": "^1.0.30001688",
         "electron-to-chromium": "^1.5.73",
@@ -4241,13 +4246,15 @@
       "version": "4.17.21",
       "resolved": "https://mirrors.huaweicloud.com/repository/npm/lodash/-/lodash-4.17.21.tgz",
       "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/lodash-es": {
       "version": "4.17.21",
       "resolved": "https://mirrors.huaweicloud.com/repository/npm/lodash-es/-/lodash-es-4.17.21.tgz",
       "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/lodash-unified": {
       "version": "1.0.3",
@@ -4717,6 +4724,7 @@
       "integrity": "sha512-wc2cBWqJgkU3Iz5oztRkQbfVkbxoz5EhnCGOrnJvnLnQ7O0WhQUYyv18qQI79O8L7DdHrrlJNeCHd4VGpnaXKQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.6"
       },
@@ -4794,6 +4802,7 @@
       "resolved": "https://registry.npmmirror.com/sass/-/sass-1.86.3.tgz",
       "integrity": "sha512-iGtg8kus4GrsGLRDLRBRHY9dNVA78ZaS7xr01cWnS7PEMQyFtTqBiyCrfpTYTZXRWM94akzckYjh8oADfFNTzw==",
       "dev": true,
+      "peer": true,
       "dependencies": {
         "chokidar": "^4.0.0",
         "immutable": "^5.0.2",
@@ -4940,6 +4949,7 @@
       "integrity": "sha512-GWANVlPM/ZfYzuPHjq0nxT+EbOEDDN3Jwhwdg1D8TU8oSkktp8w64Uq4auuGLxFSoNTRDncTq2hQHX1Ld9KHkA==",
       "dev": true,
       "license": "BSD-2-Clause",
+      "peer": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
         "acorn": "^8.8.2",
@@ -4993,6 +5003,7 @@
       "integrity": "sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==",
       "devOptional": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -5085,6 +5096,7 @@
       "integrity": "sha512-RjjMipCKVoR4hVfPY6GQTgveinjNuyLw+qruksLDvA5ktI1150VmcMBKmQaEWJhg/j6Uaf6dNCNA0AfdzUb/hQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.24.2",
         "postcss": "^8.5.1",
@@ -5176,6 +5188,7 @@
       "resolved": "https://mirrors.huaweicloud.com/repository/npm/vue/-/vue-3.5.13.tgz",
       "integrity": "sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@vue/compiler-dom": "3.5.13",
         "@vue/compiler-sfc": "3.5.13",

src/components/locales/lang/en.js

@@ -518,7 +518,7 @@ export default {
     payAmount: "Pay Amount",
     receiveCurrency: "Rcv Currency",
     receiveAmount: "Rcv Amount",
-    toSupply: "Pending",
+    toSupply: "Incomplete",
     pending: "Pending",
     fee: "Fee",
     transferVoucher: "Transfer IMG",

src/views/activityManage/activity.vue

@@ -1,31 +1,33 @@
 <template>
     <el-card class="card1" style="margin-bottom: 1vh;">
         <div class="condition">
-            <div class="condition-item1">
-                <el-text size="large">{{ t('common.activityName') }}：</el-text>
-                <el-input v-model="searchForm.activityName" style="width: 10vw" :placeholder="t('common.activityNamePlaceholder')" clearable />
+            <div class="condition-item">
+                <el-text size="large" class="label-text">{{ t('common.activityName') }}：</el-text>
+                <el-input v-model="searchForm.activityName" class="input-width" :placeholder="t('common.activityNamePlaceholder')" clearable />
             </div>
-            <div class="condition-item1">
-                <el-text size="large">{{ t('common.type') }}：</el-text>
+            <div class="condition-item">
+                <el-text size="large" class="label-text">{{ t('common.type') }}：</el-text>
                 <!-- <el-cascader v-model="searchForm.businessBelong" :options="marketOptions" placeholder="请选择所属地区" clearable
                 style="width: 10vw" /> -->
-                <el-select v-model="searchForm.businessBelong" :placeholder="t('common.typePlaceholder')" style="width: 10vw" clearable>
+                <el-select v-model="searchForm.businessBelong" :placeholder="t('common.typePlaceholder')" class="input-width" clearable>
                     <el-option :label="t('common.customerBelong')" value="客户归属地" />
                     <el-option :label="t('common.activityBelong')" value="活动归属地" />
                 </el-select>
             </div>
-            <div class="condition-item2">
-                <el-text size="large">{{ t('common.startTime') }}：</el-text>
+            <div class="condition-item">
+                <el-text size="large" class="label-text">{{ t('common.startTime') }}：</el-text>
                 <el-date-picker v-model="searchForm.startTime" type="datetime" :placeholder="t('common.startTime')"
-                    format="YYYY-MM-DD HH:mm:ss" :default-time="defaultStartTime" clearable />
+                    format="YYYY-MM-DD HH:mm:ss" :default-time="defaultStartTime" class="input-width" clearable />
             </div>
-            <div class="condition-item2">
-                <el-text size="large">{{ t('common.endTime') }}：</el-text>
+            <div class="condition-item">
+                <el-text size="large" class="label-text">{{ t('common.endTime') }}：</el-text>
                 <el-date-picker v-model="searchForm.endTime" type="datetime" :placeholder="t('common.endTime')"
-                    format="YYYY-MM-DD HH:mm:ss" :default-time="defaultEndTime" clearable />
+                    format="YYYY-MM-DD HH:mm:ss" :default-time="defaultEndTime" class="input-width" clearable />
+            </div>
+            <div class="condition-buttons">
+                <el-button type="primary" @click="getActivity">{{ t('common.search') }}</el-button>
+                <el-button type="success" @click="reset">{{ t('common.reset') }}</el-button>
             </div>
-            <el-button type="primary" @click="getActivity">{{ t('common.search') }}</el-button>
-            <el-button type="success" @click="reset">{{ t('common.reset') }}</el-button>
         </div>
     </el-card>
 
@@ -514,31 +516,42 @@ onMounted(() => {
 .condition {
     display: flex;
     align-items: center;
+    flex-wrap: wrap;
+    gap: 10px;
 }
 
-.condition-item1 {
+.condition-item {
     display: flex;
     align-items: center;
-    width: 15vw;
+    margin-right: 10px;
+}
+
+.label-text {
+    white-space: nowrap;
+}
+
+.input-width {
+    width: 160px;
 }
 
-.condition-item2 {
+.condition-buttons {
     display: flex;
     align-items: center;
-    width: 17vw;
+    gap: 10px;
+    margin-left: 10px;
 }
 
 .add-item {
     display: flex;
     align-items: center;
-    width: 17vw;
     margin-bottom: 1vh;
+    /* 去掉固定宽度以适应英文文本 */
 }
 
 .edit-item {
     display: flex;
     align-items: center;
-    width: 17vw;
     margin-bottom: 1vh;
+    /* 去掉固定宽度以适应英文文本 */
 }
 </style>

src/views/home.vue

@@ -309,6 +309,44 @@ const getPathByQueryId = (queryId) => {
   return matchedRoutes[0]?.path || null
 }
 
+// ------------------ 侧边栏拖拽调整宽度 ------------------
+const sidebarWidth = ref(230) // 默认宽度
+const isResizing = ref(false)
+
+const startResize = (e) => {
+  // 阻止浏览器默认行为（如文本选择），解决"拖动前几像素无反应"的延迟问题
+  e.preventDefault()
+  
+  isResizing.value = true
+  // 记录初始X坐标
+  const startX = e.clientX
+  const startWidth = sidebarWidth.value
+  
+  // 动态添加全局事件监听，确保拖拽流畅
+  const doDrag = (e) => {
+    if (!isResizing.value) return
+    // 计算新宽度 = 初始宽度 + (当前鼠标X - 初始鼠标X)
+    const newWidth = startWidth + (e.clientX - startX)
+    // 限制最小最大宽度
+    if (newWidth >= 200 && newWidth <= 350) {
+      sidebarWidth.value = newWidth
+    }
+  }
+  
+  const stopDrag = () => {
+    isResizing.value = false
+    document.removeEventListener('mousemove', doDrag)
+    document.removeEventListener('mouseup', stopDrag)
+    document.body.style.cursor = '' // 恢复鼠标样式
+    document.body.style.userSelect = '' // 恢复文字选择
+  }
+  
+  document.addEventListener('mousemove', doDrag)
+  document.addEventListener('mouseup', stopDrag)
+  document.body.style.cursor = 'col-resize' // 强制鼠标样式
+  document.body.style.userSelect = 'none' // 禁止文字选中
+}
+
 // 点击消息 → 已读 + 跳转
 const handleMessageClick = async (item) => {
   const res = await API({
@@ -350,7 +388,10 @@ onMounted(() => getMessage())
     <div class="background-glass">
       <!-- 侧边栏 -->
       <div class="sidebar-container">
-        <el-aside class="sidebar-layout">
+        <el-aside class="sidebar-layout" :class="{ 'no-transition': isResizing }" :style="{ width: sidebarWidth + 'px' }">
+          <!-- 拖拽手柄 -->
+          <div class="resize-handle" @mousedown="startResize"></div>
+
           <div class="logo">
             <img src="../assets/logo.png" alt="logo" style="width: 9vh; height: 9vh"/>
           </div>
@@ -368,7 +409,7 @@ onMounted(() => getMessage())
                         style="width: 4vh; height: 4vh; margin-right: 4px;"
                     >
 
-                    <span class="menu-item-text">{{ menu.menuName }}</span>
+                    <span class="menu-item-text" :title="menu.menuName">{{ menu.menuName }}</span>
                   </template>
                   <!-- 子菜单 -->
                   <template v-for="child in menu.children" :key="child.id">
@@ -377,7 +418,7 @@ onMounted(() => getMessage())
                       <el-icon style="margin-right: 4px;">
                         <Folder/>
                       </el-icon>
-                      <span class="menu-item-text">{{ child.menuName }}</span>
+                      <span class="menu-item-text" :title="child.menuName">{{ child.menuName }}</span>
                     </el-menu-item>
 
                     <!-- 子菜单有下级 -->
@@ -386,7 +427,7 @@ onMounted(() => getMessage())
                         <el-icon style="margin-right: 4px;">
                           <Folder/>
                         </el-icon>
-                        <span class="menu-item-text">{{ child.menuName }}</span>
+                        <span class="menu-item-text" :title="child.menuName">{{ child.menuName }}</span>
                       </template>
                       <!-- 递归 下一级-->
                       <template v-for="grandChild in child.children" :key="grandChild.id">
@@ -394,7 +435,7 @@ onMounted(() => getMessage())
                           <el-icon style="margin-right: 4px;">
                             <Folder/>
                           </el-icon>
-                          <span class="menu-item-text">{{ grandChild.menuName }}</span>
+                          <span class="menu-item-text" :title="grandChild.menuName">{{ grandChild.menuName }}</span>
                         </el-menu-item>
                       </template>
                     </el-sub-menu>
@@ -408,7 +449,7 @@ onMounted(() => getMessage())
                       :alt="`${menu.menuName}图标`"
                       style="width: 4vh; height: 4vh; margin-right: 4px;"
                   >
-                  <span class="menu-item-text">{{ menu.menuName }}</span>
+                  <span class="menu-item-text" :title="menu.menuName">{{ menu.menuName }}</span>
                 </el-menu-item>
               </template>
             </el-menu>
@@ -639,19 +680,21 @@ onMounted(() => getMessage())
 /* 菜单项文字样式 */
 .menu-item-text {
   display: inline-block;
-  max-width: 120px; /* 设置最大宽度 */
-  min-width: 80px; /* 设置最小宽度 */
-  /* overflow: hidden; */
-  /* text-overflow: ellipsis;  */
+  /* max-width: 120px;  移除固定最大宽度，使其随容器自适应 */
+  /* min-width: 80px; */
+  overflow: hidden;
+  text-overflow: ellipsis;
   white-space: nowrap; /* 不换行 */
   flex: 1; /* 自动填充剩余空间 */
   text-align: left; /* 文字左对齐 */
+  margin-right: 10px; /* 增加右侧间距，防止紧贴箭头 */
 }
 
 /* 中间可滚动菜单容器 */
 .menu-scroll-container {
   flex: 1;
   overflow-y: auto;
+  overflow-x: hidden;
   padding: 10px 0;
 }
 
@@ -679,6 +722,7 @@ onMounted(() => getMessage())
 
 .sidebar-layout {
   width: 16vw;
+  min-width: 230px; /* 设置最小宽度，防止内容被压缩 */
   height: 100%;
   background: #E7F4FD; /* 浅蓝色背景 */
   /* backdrop-filter: blur(5px); 毛玻璃效果 --消耗性能 */
@@ -687,7 +731,30 @@ onMounted(() => getMessage())
   display: flex;
   flex-direction: column;
   position: relative;
-  transition: all 0.3s ease;
+  transition: width 0.3s ease; /* 恢复原本的平滑过渡，仅在非拖拽时生效 */
+}
+
+/* 拖拽时禁用过渡动画，解决卡顿 */
+.sidebar-layout.no-transition {
+  transition: none !important;
+}
+
+/* 拖拽手柄样式 */
+.resize-handle {
+  position: absolute;
+  top: 0;
+  right: 0;
+  width: 5px;
+  height: 100%;
+  cursor: col-resize;
+  z-index: 10;
+  background: transparent;
+  transition: background 0.2s;
+}
+
+.resize-handle:hover,
+.resize-handle:active {
+  background: rgba(64, 158, 255, 0.5); /* 悬停或拖拽时显示蓝色 */
 }
 
 /* 内容区域容器 */
@@ -789,7 +856,7 @@ onMounted(() => getMessage())
 
 /* 消息中心整体容器 */
 .message-container {
-  padding: 10px 50px 10px 50px; /* 上，右， 下，左 */
+  padding: 10px 20px 10px 10px; /* 上，右， 下，左 - 减小内边距 */
   display: flex;
   align-items: center; /* 垂直居中 */
 }
@@ -897,4 +964,18 @@ display: flex;
   padding: 8px;
 }
 
+/* 滚动条美化 */
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: rgba(0, 0, 0, 0.2);
+  border-radius: 3px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
 </style>

src/views/moneyManage/executor/executor.vue

@@ -111,7 +111,7 @@
           </div>
         </template>
       </el-table-column>
-      <el-table-column prop="status" :label="t('common_list.orderStatus')" width="120">
+      <el-table-column prop="status" :label="t('common_list.orderStatus')" width="130">
         <template #default="scope">
           {{ scope.row.status === 41 ? t('common_list.refundSuccess') : t('common_list.pending') }}
         </template>

src/views/moneyManage/receiveDetail/receiveFinance.vue

@@ -122,7 +122,7 @@
                         </el-table-column>
                         <el-table-column fixed="left" prop="jwcode" label="Homily ID" width="110px" />
                         <el-table-column fixed="left" prop="name" :label="t('common_list.name')" width="110px" />
-                        <el-table-column prop="marketName" :label="t('common_list.market')" width="80px" />
+                        <el-table-column prop="marketName" :label="t('common_list.market')" width="110px" />
                         <el-table-column prop="activity" :label="t('common_list.activity')" width="120px"
                             show-overflow-tooltip />
                         <el-table-column prop="goodsName" :label="t('common_list.productName')" width="120px" />

src/views/moneyManage/receiveDetail/receiveManage.vue

@@ -122,7 +122,7 @@
                         </el-table-column>
                         <el-table-column fixed="left" prop="jwcode" label="Homily ID" width="110px" />
                         <el-table-column fixed="left" prop="name" :label="t('common_list.name')" width="110px" />
-                        <el-table-column prop="marketName" :label="t('common_list.market')" width="80px" />
+                        <el-table-column prop="marketName" :label="t('common_list.market')" width="110px" />
                         <el-table-column prop="activity" :label="t('common_list.activity')" width="120px"
                             show-overflow-tooltip />
                         <el-table-column prop="goodsName" :label="t('common_list.productName')" width="120px" />

src/views/moneyManage/refundDetail/refundCharge.vue

@@ -72,7 +72,7 @@
             <el-table-column prop="refundReason" :label="t('common_list.refundReason')" width="120"
                 show-overflow-tooltip />
             <el-table-column prop="remark" :label="t('common_list.remark')" width="150" show-overflow-tooltip />
-            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="120">
+            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="130">
                 <template #default="scope">
                     {{
                         [20].includes(scope.row.status) ? t('cash.statusList.pending') :

src/views/moneyManage/refundDetail/refundFinance.vue

@@ -66,7 +66,7 @@
             <el-table-column prop="submitter" :label="t('common_list.submitter')" width="120" />
             <el-table-column prop="refundReason" :label="t('common_list.refundReason')" width="120" show-overflow-tooltip />
             <el-table-column prop="remark" :label="t('common_list.remark')" width="150" show-overflow-tooltip />
-            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="120">
+            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="130">
                 <template #default="scope">
                     {{
                         [10].includes(scope.row.status) ? t('cash.statusList.pending') :

src/views/moneyManage/refundDetail/refundHeader.vue

@@ -66,7 +66,7 @@
             <el-table-column prop="submitter" :label="t('common_list.submitter')" width="120" />
             <el-table-column prop="refundReason" :label="t('common_list.refundReason')" width="120" show-overflow-tooltip />
             <el-table-column prop="remark" :label="t('common_list.remark')" width="150" show-overflow-tooltip />
-            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="120">
+            <el-table-column prop="status" :label="t('common_list.orderStatus')" width="130">
                 <template #default="scope">
                     {{
                         [30].includes(scope.row.status) ? t('cash.statusList.pending') :