优化产品的选择

pages.config.ts

@@ -47,6 +47,14 @@ export default defineUniPages({
         { path: 'audit/list', style: { navigationBarTitleText: '审核列表' } },
         { path: 'audit/detail', style: { navigationBarTitleText: '审核详情' } },
         { path: 'customer/list', style: { navigationBarTitleText: '客户管理' } },
+        { path: 'customer/detail', style: { navigationBarTitleText: '客户详情' } },
+        { path: 'customer/transaction-list', style: { navigationBarTitleText: '交易记录' } },
+        { path: 'customer/withdraw-list', style: { navigationBarTitleText: '提现记录' } },
+        { path: 'report/list', style: { navigationBarTitleText: '报表列表' } },
+        { path: 'report/download', style: { navigationBarTitleText: '报表下载' } },
+        { path: 'visit/list', style: { navigationBarTitleText: '拜访计划' } },
+        { path: 'visit/create', style: { navigationBarTitleText: '创建拜访' } },
+        { path: 'visit/detail', style: { navigationBarTitleText: '拜访详情' } },
         { path: 'me/index', style: { navigationBarTitleText: '银行中心' } },
       ],
     },

src/pagesBank/visit/create.vue

@@ -69,6 +69,20 @@ function toggleProduct(productId: string) {
   }
 }
 
+// 获取产品名称
+function getProductName(productId: string): string {
+  const product = products.value.find(p => p.id === productId)
+  return product?.name || ''
+}
+
+// 移除产品
+function removeProduct(productId: string) {
+  const index = formData.value.productIds.indexOf(productId)
+  if (index > -1) {
+    formData.value.productIds.splice(index, 1)
+  }
+}
+
 // 表单验证
 function validateForm(): boolean {
   if (!formData.value.date) {
@@ -154,13 +168,22 @@ onMounted(() => {
       </view>
 
       <!-- 营销产品 -->
-      <view class="form-item" @click="showProductPicker = true">
+      <view class="form-item">
         <view class="label">营销产品</view>
-        <view class="value-input">
-          <text :class="{ placeholder: formData.productIds.length === 0 }">
-            {{ formData.productIds.length > 0 ? `已选${formData.productIds.length}个` : '请选择' }}
-          </text>
-          <text class="i-carbon-chevron-right"></text>
+        <view class="product-tags-container" @click="showProductPicker = true">
+          <view v-if="formData.productIds.length === 0" class="placeholder">请选择</view>
+          <view v-else class="product-tags">
+            <view
+              v-for="productId in formData.productIds"
+              :key="productId"
+              class="product-tag"
+              @click.stop="removeProduct(productId)"
+            >
+              <text class="tag-name">{{ getProductName(productId) }}</text>
+              <text class="tag-close i-carbon-close"></text>
+            </view>
+          </view>
+          <text class="i-carbon-chevron-right picker-icon"></text>
         </view>
       </view>
 
@@ -293,6 +316,65 @@ onMounted(() => {
     }
   }
   
+  .product-tags-container {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    min-height: 40rpx;
+    
+    .placeholder {
+      color: #adb5bd;
+      font-size: 28rpx;
+    }
+    
+    .product-tags {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 12rpx;
+      flex: 1;
+      margin-right: 16rpx;
+      
+      .product-tag {
+        display: inline-flex;
+        align-items: center;
+        background: linear-gradient(135deg, #e6f7ff 0%, #f0f9ff 100%);
+        border: 1rpx solid #bae7ff;
+        border-radius: 8rpx;
+        padding: 8rpx 16rpx;
+        font-size: 24rpx;
+        color: #0050b3;
+        
+        .tag-name {
+          margin-right: 8rpx;
+        }
+        
+        .tag-close {
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 28rpx;
+          height: 28rpx;
+          border-radius: 50%;
+          background: rgba(0, 80, 179, 0.1);
+          color: #0050b3;
+          font-size: 20rpx;
+          transition: all 0.2s;
+          
+          &:active {
+            background: rgba(0, 80, 179, 0.2);
+            transform: scale(0.9);
+          }
+        }
+      }
+    }
+    
+    .picker-icon {
+      color: #adb5bd;
+      font-size: 32rpx;
+      flex-shrink: 0;
+    }
+  }
+  
   .input {
     width: 100%;
     font-size: 28rpx;