feat(subscription): 添加订阅功能并优化过期处理逻辑

- 扩展 trialExpiredType 类型，新增 'subscribe' 状态以支持主动订阅场景
- 新增 openSubscriptionDialog 方法，用于处理 VIP 状态点击事件
- 优化 VIP 状态卡片 UI，添加悬停与点击效果，提升交互体验
- 调整过期状态样式，保持水平布局并移除冗余按钮样式
- 在 Rakuten 组件中引入请求中断机制，提升任务控制灵活性- 更新 TrialExpiredDialog 组件，支持订阅类型提示与微信复制反馈- 修复部分 API 调用未传递 signal 参数的问题，增强请求管理能力
- 切换 Ruoyi 服务地址至生产环境配置，确保接口通信正常
- 移除部分无用代码与样式，精简组件结构

electron-vue-template/src/renderer/App.vue

@@ -84,7 +84,7 @@ const showSettingsDialog = ref(false)
 
 // 试用期过期对话框
 const showTrialExpiredDialog = ref(false)
-const trialExpiredType = ref<'device' | 'account' | 'both'>('device')
+const trialExpiredType = ref<'device' | 'account' | 'both' | 'subscribe'>('device')
 
 // 菜单配置 - 复刻ERP客户端格式
 const menuConfig = [
@@ -310,7 +310,7 @@ async function refreshVipStatus() {
 }
 
 // 判断过期类型
-function checkExpiredType(): 'device' | 'account' | 'both' {
+function checkExpiredType(): 'device' | 'account' | 'both' | 'subscribe' {
   const accountExpired = vipExpireTime.value && new Date() > vipExpireTime.value
   const deviceExpired = deviceTrialExpired.value
   
@@ -320,6 +320,17 @@ function checkExpiredType(): 'device' | 'account' | 'both' {
   return 'account' // 默认
 }
 
+// 打开订阅对话框
+function openSubscriptionDialog() {
+  // 如果VIP有效，显示订阅/续费提示；如果已过期，显示过期提示
+  if (vipStatus.value.isVip) {
+    trialExpiredType.value = 'subscribe'
+  } else {
+    trialExpiredType.value = checkExpiredType()
+  }
+  showTrialExpiredDialog.value = true
+}
+
 // 提供给子组件使用
 provide('refreshVipStatus', refreshVipStatus)
 provide('checkExpiredType', checkExpiredType)
@@ -519,22 +530,18 @@ onUnmounted(() => {
           </ul>
 
           <!-- VIP状态卡片 -->
-          <div v-if="isAuthenticated" class="vip-status-card" :class="'vip-' + vipStatus.status">
+          <div v-if="isAuthenticated" class="vip-status-card" :class="'vip-' + vipStatus.status" @click="openSubscriptionDialog">
             <div class="vip-info">
               <div class="vip-status-text">
                 <template v-if="vipStatus.isVip">
                   <span v-if="vipStatus.status === 'warning'">即将到期</span>
                   <span v-else>订阅中</span>
                 </template>
-                <template v-else>
-                  <span>已过期</span>
-                </template>
               </div>
               <div class="vip-expire-date" v-if="vipExpireTime">
                 有效期至：{{ vipExpireTime ? new Date(vipExpireTime).toLocaleDateString('zh-CN', { year: 'numeric', month: 'long', day: 'numeric' }) : '-' }}
               </div>
             </div>
-
           </div>
 
         </div>
@@ -924,6 +931,17 @@ onUnmounted(() => {
   box-shadow: 0 2px 8px rgba(255, 215, 0, 0.15);
   transition: all 0.3s ease;
   position: relative;
+  cursor: pointer;
+  user-select: none;
+}
+
+.vip-status-card:hover {
+  box-shadow: 0 3px 10px rgba(255, 215, 0, 0.25);
+  transform: translateY(-1px);
+}
+
+.vip-status-card:active {
+  transform: translateY(0);
 }
 
 /* 正常状态和警告状态 - 统一温暖金色渐变 */
@@ -934,15 +952,10 @@ onUnmounted(() => {
   box-shadow: 0 2px 8px rgba(255, 215, 0, 0.15);
 }
 
-/* 过期状态 - 灰色，垂直布局 */
+/* 过期状态 - 灰色，保持水平布局 */
 .vip-status-card.vip-expired {
   background: linear-gradient(135deg, #FAFAFA 0%, #E8E8E8 100%);
   box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
-  flex-direction: column;
-  justify-content: space-between;
-  align-items: stretch;
-  padding: 10px;
-  gap: 8px;
 }
 
 .vip-info {
@@ -970,33 +983,6 @@ onUnmounted(() => {
   opacity: 0.9;
 }
 
-/* 右侧徽章按钮 */
-.vip-badge {
-  padding: 5px 10px;
-  border-radius: 5px;
-  font-size: 11px;
-  font-weight: 600;
-  white-space: nowrap;
-  flex-shrink: 0;
-  background: linear-gradient(135deg, #4A90E2 0%, #357ABD 100%);
-  color: white;
-  box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
-}
-
-/* 过期状态续费按钮 - 置底 */
-.vip-renew-btn {
-  padding: 7px 0;
-  text-align: center;
-  background: linear-gradient(135deg, #4A90E2 0%, #357ABD 100%);
-  color: white;
-  border-radius: 5px;
-  font-size: 11px;
-  font-weight: 600;
-  width: 100%;
-  flex-shrink: 0;
-  box-shadow: 0 2px 6px rgba(74, 144, 226, 0.3);
-}
-
 .vip-status-card.vip-expired .vip-info {
   align-items: flex-start;
 }

electron-vue-template/src/renderer/api/http.ts

@@ -2,9 +2,9 @@ export type HttpMethod = 'GET' | 'POST' | 'DELETE';
 
 export const CONFIG = {
   CLIENT_BASE: 'http://localhost:8081',
-  //RUOYI_BASE: 'http://8.138.23.49:8085',
+  RUOYI_BASE: 'http://8.138.23.49:8085',
-  RUOYI_BASE: 'http://192.168.1.89:8085',
+  //RUOYI_BASE: 'http://192.168.1.89:8085',
-  SSE_URL: 'http://192.168.1.89:8085/monitor/account/events'
+  SSE_URL: 'http://8.138.23.49:8085/monitor/account/events'
 } as const;
 
 function resolveBase(path: string): string {

electron-vue-template/src/renderer/api/rakuten.ts

@@ -1,18 +1,18 @@
 import { http } from './http'
 
 export const rakutenApi = {
-  getProducts(params: { file?: File; shopName?: string; batchId?: string }) {
+  getProducts(params: { file?: File; shopName?: string; batchId?: string }, signal?: AbortSignal) {
     const formData = new FormData()
     if (params.file) formData.append('file', params.file)
     if (params.batchId) formData.append('batchId', params.batchId)
     if (params.shopName) formData.append('shopName', params.shopName)
-    return http.upload('/api/rakuten/products', formData)
+    return http.upload('/api/rakuten/products', formData, signal)
   },
 
-  search1688(imageUrl: string, sessionId?: string) {
+  search1688(imageUrl: string, sessionId?: string, signal?: AbortSignal) {
     const payload: Record<string, unknown> = { imageUrl }
     if (sessionId) payload.sessionId = sessionId
-    return http.post('/api/rakuten/search1688', payload)
+    return http.post('/api/rakuten/search1688', payload, signal)
   },
 
   getLatestProducts() {

electron-vue-template/src/renderer/components/amazon/AmazonDashboard.vue

@@ -32,9 +32,9 @@ const dragActive = ref(false)
 
 // 试用期过期弹框
 const showTrialExpiredDialog = ref(false)
-const trialExpiredType = ref<'device' | 'account' | 'both'>('account')
+const trialExpiredType = ref<'device' | 'account' | 'both' | 'subscribe'>('account')
 
-const checkExpiredType = inject<() => 'device' | 'account' | 'both'>('checkExpiredType')
+const checkExpiredType = inject<() => 'device' | 'account' | 'both' | 'subscribe'>('checkExpiredType')
 
 // 计算属性 - 当前页数据
 const paginatedData = computed(() => {

electron-vue-template/src/renderer/components/common/TrialExpiredDialog.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 import { computed } from 'vue'
+import { ElMessage } from 'element-plus'
 
 interface Props {
   modelValue: boolean
-  expiredType: 'device' | 'account' | 'both' // 设备过期、账号过期、都过期
+  expiredType: 'device' | 'account' | 'both' | 'subscribe' // 设备过期、账号过期、都过期、主动订阅
 }
 
 interface Emits {
@@ -19,12 +20,14 @@ const visible = computed({
 })
 
 const titleText = computed(() => {
+  if (props.expiredType === 'subscribe') return '订阅服务'
   if (props.expiredType === 'both') return '试用已到期'
   if (props.expiredType === 'account') return '账号试用已到期'
   return '设备试用已到期'
 })
 
 const subtitleText = computed(() => {
+  if (props.expiredType === 'subscribe') return '联系客服订阅或续费，享受完整服务'
   if (props.expiredType === 'both') return '试用已到期，请联系客服订阅以获取完整服务'
   if (props.expiredType === 'account') return '账号试用已到期，请联系客服订阅'
   return '当前设备试用已到期，请更换新设备体验或联系客服订阅'
@@ -35,8 +38,11 @@ function handleConfirm() {
 }
 
 function copyWechat() {
-  navigator.clipboard.writeText('_linhong')
+  navigator.clipboard.writeText('_linhong').then(() => {
-  // ElMessage.success('微信号已复制')
+    ElMessage.success('微信号已复制')
+  }).catch(() => {
+    ElMessage.error('复制失败，请手动复制')
+  })
 }
 </script>
 
@@ -71,6 +77,7 @@ function copyWechat() {
           <div class="wechat-label">客服微信</div>
           <div class="wechat-id">_linhong</div>
         </div>
+        <div class="copy-icon">📋</div>
       </div>
 
       <!-- 按钮 -->
@@ -137,11 +144,13 @@ function copyWechat() {
   margin-bottom: 20px;
   width: 90%;
   cursor: pointer;
-  transition: background 0.3s;
+  transition: all 0.3s;
+  position: relative;
 }
 
 .wechat-card:hover {
-  background: #ebebeb;
+  background: #e8f5e9;
+  box-shadow: 0 2px 8px rgba(9, 187, 7, 0.15);
 }
 
 .wechat-icon {
@@ -170,6 +179,18 @@ function copyWechat() {
   color: #1f1f1f;
 }
 
+.copy-icon {
+  margin-left: auto;
+  font-size: 16px;
+  opacity: 0.5;
+  transition: all 0.3s;
+}
+
+.wechat-card:hover .copy-icon {
+  opacity: 1;
+  transform: scale(1.1);
+}
+
 .confirm-btn {
   height: 40px;
   font-size: 14px;

electron-vue-template/src/renderer/components/rakuten/RakutenDashboard.vue

@@ -20,6 +20,7 @@ const tableLoading = ref(false)
 const exportLoading = ref(false)
 const statusMessage = ref('')
 const statusType = ref<'info' | 'success' | 'warning' | 'error'>('info')
+let abortController: AbortController | null = null
 
 // 查询与上传
 const singleShopName = ref('')
@@ -55,9 +56,9 @@ const activeStep = computed(() => {
 
 // 试用期过期弹框
 const showTrialExpiredDialog = ref(false)
-const trialExpiredType = ref<'device' | 'account' | 'both'>('account')
+const trialExpiredType = ref<'device' | 'account' | 'both' | 'subscribe'>('account')
 
-const checkExpiredType = inject<() => 'device' | 'account' | 'both'>('checkExpiredType')
+const checkExpiredType = inject<() => 'device' | 'account' | 'both' | 'subscribe'>('checkExpiredType')
 
 // 左侧：上传文件名与地区
 const selectedFileName = ref('')
@@ -153,7 +154,7 @@ async function searchProductInternal(product: any) {
     showTrialExpiredDialog.value = true
     return false
   }
-  const res: any = await rakutenApi.search1688(product.imgUrl, currentBatchId.value)
+  const res: any = await rakutenApi.search1688(product.imgUrl, currentBatchId.value, abortController?.signal)
   const data = res.data
   if (!hasValid1688Data(data)) return false
   const skuJson = data.skuPriceJson || data.skuPrice
@@ -176,7 +177,8 @@ async function searchProductWithRetry(product: any, maxRetry = 2) {
     try {
       const ok = await searchProductInternal(product)
       if (ok) return true
-    } catch (e) {
+    } catch (e: any) {
+      if (e.name === 'AbortError') return false
       console.warn('search1688 failed', e)
     }
     if (attempt < maxRetry) await delay(600)
@@ -244,6 +246,8 @@ async function handleStartSearch() {
     return
   }
 
+  abortController = new AbortController()
+
   if (pendingFile.value) {
     try {
       loading.value = true
@@ -255,7 +259,7 @@ async function handleStartSearch() {
       progressPercentage.value = 0
       totalProducts.value = 0
       processedProducts.value = 0
-        const resp: any = await rakutenApi.getProducts({file: pendingFile.value, batchId: currentBatchId.value})
+        const resp: any = await rakutenApi.getProducts({file: pendingFile.value, batchId: currentBatchId.value}, abortController?.signal)
         const products = (resp.data.products || []).map((p: any) => ({...p, skuPrices: parseSkuPrices(p)}))
         
         if (products.length === 0) {
@@ -264,9 +268,11 @@ async function handleStartSearch() {
         
         allProducts.value = products
         pendingFile.value = null
-    } catch (e) {
+    } catch (e: any) {
-      statusType.value = 'error'
+      if (e.name !== 'AbortError') {
-      statusMessage.value = '解析失败，请重试'
+        statusType.value = 'error'
+        statusMessage.value = '解析失败，请重试'
+      }
     } finally {
       loading.value = false
       tableLoading.value = false
@@ -280,17 +286,21 @@ async function handleStartSearch() {
     progressPercentage.value = 100
     statusType.value = 'success'
     statusMessage.value = ''
+    abortController = null
     return
   }
   if (items.length === 0) {
     statusType.value = 'warning'
     statusMessage.value = '没有可处理的商品，请先导入或查询店铺'
+    abortController = null
     return
   }
   await startBatch1688Search(items)
 }
 
 function stopTask() {
+  abortController?.abort()
+  abortController = null
   loading.value = false
   tableLoading.value = false
   statusType.value = 'warning'
@@ -305,6 +315,7 @@ async function startBatch1688Search(products: any[]) {
     progressPercentage.value = 100
     statusType.value = 'success'
     statusMessage.value = '所有商品都已获取1688数据！'
+    abortController = null
     return
   }
   loading.value = true
@@ -323,6 +334,7 @@ async function startBatch1688Search(products: any[]) {
     statusMessage.value = ''
   }
   loading.value = false
+  abortController = null
 }
 
 async function serialSearch1688(products: any[]) {

electron-vue-template/src/renderer/components/zebra/ZebraDashboard.vue

@@ -6,26 +6,19 @@ import AccountManager from '../common/AccountManager.vue'
 import { batchConvertImages } from '../../utils/imageProxy'
 import { handlePlatformFileExport } from '../../utils/settings'
 import { getUsernameFromToken } from '../../utils/token'
-
 const TrialExpiredDialog = defineAsyncComponent(() => import('../common/TrialExpiredDialog.vue'))
-
 const refreshVipStatus = inject<() => Promise<boolean>>('refreshVipStatus')
-
 // 接收VIP状态
 const props = defineProps<{
   isVip: boolean
 }>()
-
 type Shop = { id: string; shopName: string }
-
 const accounts = ref<BanmaAccount[]>([])
 const accountId = ref<number>()
 // 收起功能移除
-
 const shopList = ref<Shop[]>([])
 const selectedShops = ref<string[]>([])
 const dateRange = ref<string[]>([])
-
 const loading = ref(false)
 const exportLoading = ref(false)
 const progressPercentage = ref(0)
@@ -44,9 +37,8 @@ let abortController: AbortController | null = null
 
 // 试用期过期弹框
 const showTrialExpiredDialog = ref(false)
-const trialExpiredType = ref<'device' | 'account' | 'both'>('account')
+const trialExpiredType = ref<'device' | 'account' | 'both' | 'subscribe'>('account')
-
+const checkExpiredType = inject<() => 'device' | 'account' | 'both' | 'subscribe'>('checkExpiredType')
-const checkExpiredType = inject<() => 'device' | 'account' | 'both'>('checkExpiredType')
 function selectAccount(id: number) {
   accountId.value = id
   loadShops()
@@ -106,7 +98,6 @@ async function fetchData() {
 
   // 刷新VIP状态
   if (refreshVipStatus) await refreshVipStatus()
-
   // VIP检查
   if (!props.isVip) {
     if (checkExpiredType) trialExpiredType.value = checkExpiredType()
@@ -123,14 +114,11 @@ async function fetchData() {
   fetchCurrentPage.value = 1
   fetchTotalItems.value = 0
   currentBatchId.value = `ZEBRA_${Date.now()}`
-
   const [startDate = '', endDate = ''] = dateRange.value || []
   await fetchPageData(startDate, endDate)
 }
-
 async function fetchPageData(startDate: string, endDate: string) {
   if (!isFetching.value) return
-
   try {
     const response = await zebraApi.getOrders({
       accountId: Number(accountId.value) || undefined,
@@ -145,10 +133,8 @@ async function fetchPageData(startDate: string, endDate: string) {
     const data = (response as any)?.data || response
     const orders = data.orders || []
     allOrderData.value = [...allOrderData.value, ...orders]
-
     fetchTotalPages.value = data.totalPages || 0
     fetchTotalItems.value = data.total || 0
-
     if (fetchCurrentPage.value < fetchTotalPages.value && isFetching.value) {
       progressPercentage.value = Math.round((fetchCurrentPage.value / fetchTotalPages.value) * 100)
       fetchCurrentPage.value++

erp_client_sb/src/main/resources/application.yml

@@ -39,7 +39,6 @@ spring:
 server:
   port: 8081
   address: 127.0.0.1
-
 # 外部API服务配置
 api:
   server:
@@ -61,7 +60,6 @@ project:
   version: @project.version@
   build:
     time: @maven.build.timestamp@
-
 logging:
   level:
     com.tashow.erp: INFO

ruoyi-admin/src/main/java/com/ruoyi/web/controller/system/ClientDeviceController.java

@@ -11,7 +11,6 @@ import org.springframework.web.bind.annotation.*;
 import javax.servlet.http.HttpServletRequest;
 import java.util.List;
 import java.util.Map;
-
 @RestController
 @RequestMapping("/monitor/device")
 @Anonymous