refactor: 移动端升级 Vue3 + uView Plus

将 lilishop-uniapp 从 Vue2/uView 1.6 迁移到 Vue3/uview-plus，优先支持 H5/微商城与微信小程序；移除 vendored uview-ui，改用 npm 依赖、Vuex4 与迁移脚本/补丁，并补充 VUE3_MIGRATION.md 回归清单。

Co-authored-by: Cursor <cursoragent@cursor.com>

pages/order/afterSales/afterSales.vue

@@ -54,7 +54,7 @@
               <view class="goods-title u-line-2">{{ sku.name }}</view>
               <!-- 如果商品多个则不显示每个商品价格-->
               <view class="goods-price" v-if="order.orderItems.length <= 1">
-                ￥{{ order.flowPrice | unitPrice }}
+                ￥{{unitPrice(order.flowPrice) }}
               </view>
             </view>
             <view class="goods-num">
@@ -89,31 +89,31 @@
                 class="cannot_apply not_center"
                 v-if="order.serviceType == 'RETURN_GOODS'"
               >
-                退货处理-{{ order.serviceStatus | serviceStatusList }}</view
+                退货处理-{{serviceStatusList(order.serviceStatus) }}</view
               >
               <view
                 class="cannot_apply not_center"
                 v-if="order.serviceType == 'SUPPLY_AGAIN_GOODS'"
               >
-                补发商品-{{ order.serviceStatus | serviceStatusList }}</view
+                补发商品-{{serviceStatusList(order.serviceStatus) }}</view
               >
               <view
                 class="cannot_apply not_center"
                 v-if="order.serviceType == 'RETURN_MONEY'"
               >
-                退款-{{ order.serviceStatus | serviceStatusList }}</view
+                退款-{{serviceStatusList(order.serviceStatus) }}</view
               >
               <view
                 class="cannot_apply not_center"
                 v-if="order.serviceType == 'EXCHANGE_GOODS'"
               >
-                换货-{{ order.serviceStatus | serviceStatusList }}</view
+                换货-{{serviceStatusList(order.serviceStatus) }}</view
               >
               <view
                 class="cannot_apply not_center"
                 v-if="order.serviceType == 'CANCEL'"
               >
-                取消订单-{{ order.serviceStatus | serviceStatusList }}</view
+                取消订单-{{serviceStatusList(order.serviceStatus) }}</view
               >
             </div>
 
@@ -177,7 +177,7 @@
           <!-- 多个商品显示订单总价格 -->
           <view class="cannot_apply">
             订单总金额:<span class="countMoney"
-              >￥{{ order.flowPrice | unitPrice }}</span
+              >￥{{unitPrice(order.flowPrice) }}</span
             >
           </view>
         </view>
@@ -187,11 +187,11 @@
     <u-modal
       show-cancel-button
       @confirm="closeService"
-      v-model="cancelShow"
+      v-model:show="cancelShow"
       content="确认取消售后"
     ></u-modal>
     <u-modal
-      v-model="tipsShow"
+      v-model:show="tipsShow"
       content="当订单未确认收货|已过售后服务有效期|已申请售后服务时，不能申请售后"
     ></u-modal>
   </view>

pages/order/afterSales/afterSalesDetail.vue

@@ -10,7 +10,8 @@
           </view>
         </view>
         <view>
-          <view class="goods-item-view" v-for="(item,index) in sku.orderItems" v-if="item.sn == sn"
+          <template v-for="(item,index) in sku.orderItems" :key="index">
+          <view class="goods-item-view" v-if="item.sn == sn"
             @click="gotoGoodsDetail(sku.goods_id)">
             <view class="goods-img">
               <u-image border-radius="6" width="131rpx" height="131rpx" :src="item.image"></u-image>
@@ -24,6 +25,7 @@
               </view>
             </view>
           </view>
+          </template>
         </view>
         <view class="after-num">
           <view>申请数量</view>
@@ -49,8 +51,8 @@
         <view class="opt-view">
           <view class="img-title">上传凭证（最多5张）</view>
           <view class="images-view">
-            <u-upload :header=" { accessToken: storage.getAccessToken() }" :action="action" width="150"
-              @on-uploaded="onUploaded" :max-count="5" :show-progress="false"></u-upload>
+            <u-upload :file-list="fileList" :auto-upload="false" width="150"
+              @afterRead="onUploadAfterRead" :max-count="5"></u-upload>
           </view>
         </view>
 
@@ -87,10 +89,10 @@
       <u-button type="primary" ripple shape="circle" v-if="applyInfo.refundWay" :custom-style="customStyle"
         @click="onSubmit">提交申请</u-button>
     </view>
-    <u-select mode="single-column" :list="reasonList" v-model="reasonSelectShow" @confirm="reasonSelectConfirm">
+    <u-select mode="single-column" :list="reasonList" v-model:show="reasonSelectShow" @confirm="reasonSelectConfirm">
     </u-select>
-    <u-select mode="single-column" :list="typeList" v-model="typeSelectShow" @confirm="typeSelectConfirm"></u-select>
-    <u-select mode="single-column" :list="returnList" v-model="returnSelectShow" @confirm="returnSelectConfirm">
+    <u-select mode="single-column" :list="typeList" v-model:show="typeSelectShow" @confirm="typeSelectConfirm"></u-select>
+    <u-select mode="single-column" :list="returnList" v-model:show="returnSelectShow" @confirm="returnSelectConfirm">
     </u-select>
     <u-toast ref="uToast" />
   </view>
@@ -104,7 +106,7 @@ import {
 } from "@/api/after-sale";
 
 import city from "@/components/m-city/m-city";
-import { upload } from "@/api/common.js";
+import { handleUploadAfterRead } from "@/utils/uploadHelper.js";
 import { checkBankno } from "@/utils/Foundation";
 import storage from "@/utils/storage.js";
 export default {
@@ -115,7 +117,6 @@ export default {
     return {
       storage,
       list: [{ id: "", localName: "请选择", children: [] }],
-      action: upload, //图片上传数据
       fileList: [],
       sn: "",
       sku: {},
@@ -263,14 +264,10 @@ export default {
     valChange(e) {
       this.form.num = e.value;
     },
-    //图片上传
-    onUploaded(lists) {
-      let images = [];
-
-      lists.forEach((item) => {
-        images.push(item.response.result);
+    onUploadAfterRead(event) {
+      handleUploadAfterRead(event, this.fileList, (urls) => {
+        this.form.images = urls;
       });
-      this.form.images = images;
     },
     //提交申请
     onSubmit() {

pages/order/afterSales/afterSalesDetailExpress.vue

@@ -17,7 +17,7 @@
             <view class="goods-info">
               <view class="goods-title u-line-2">{{ sku.name }}</view>
               <view class="goods-price">
-                <span>￥{{ sku.price | unitPrice }}</span>
+                <span>￥{{unitPrice(sku.price) }}</span>
                 <span class="num">购买数量: {{ sku.num }} </span>
               </view>
             </view>
@@ -55,9 +55,9 @@
         </u-button>
       </view>
     </u-form>
-    <u-select mode="single-column" :list="companyList" v-model="companySelectShow"
+    <u-select mode="single-column" :list="companyList" v-model:show="companySelectShow"
               @confirm="companySelectConfirm"></u-select>
-    <u-calendar v-model="timeshow" :mode="'date'" @change="onTimeChange"></u-calendar>
+    <u-calendar v-model:show="timeshow" :mode="'date'" @change="onTimeChange"></u-calendar>
     <u-toast ref="uToast"/>
   </view>
 </template>

pages/order/afterSales/afterSalesSelect.vue

@@ -9,7 +9,8 @@
         </view>
       </view>
       <view>
-        <view class="goods-item-view" :key="index" v-for="(item,index) in sku.orderItems" v-if="item.sn == sn" @click="navigateToGoodsDetail(sku.skuId)">
+        <template v-for="(item,index) in sku.orderItems" :key="index">
+        <view class="goods-item-view" v-if="item.sn == sn" @click="navigateToGoodsDetail(sku.skuId)">
           <view class="goods-img">
             <u-image border-radius="6" width="131rpx" height="131rpx" :src="item.image"></u-image>
           </view>
@@ -22,6 +23,7 @@
             </view>
           </view>
         </view>
+        </template>
       </view>
     </view>
 

pages/order/afterSales/applyDetail.vue

@@ -11,12 +11,10 @@
       <view class="apply-info-view">
         <view class="status-info">
           <view class="status-info-box">
-            <view class="status-val">{{
-            serviceDetail.serviceStatus | serviceStatusList
+            <view class="status-val">{{serviceStatusList(serviceDetail.serviceStatus)
             }}</view>
 
-            <view class="status-tip">{{
-              serviceDetail.serviceStatus | statusFilter
+            <view class="status-tip">{{statusFilter(serviceDetail.serviceStatus)
             }}</view>
           </view>
         </view>
@@ -43,7 +41,7 @@
               }}</view>
 
               <view class="goods-price">
-                <view class="price"> ￥{{ serviceDetail.flowPrice | unitPrice }}</view>
+                <view class="price"> ￥{{unitPrice(serviceDetail.flowPrice) }}</view>
                 <view>
                   <view>申请售后数量：{{ serviceDetail.num }}</view>
                 </view>
@@ -116,44 +114,40 @@
         v-if="serviceDetail.serviceType != 'RETURN_MONEY'  && serviceDetail.serviceStatus != 'APPLY'">
         <view class="title">联系方式:</view>
         <view class="value">{{
-          storeAfterSaleAddress.salesConsigneeMobile || "" | secrecyMobile
+          storeAfterSaleAddress.salesConsigneeMobile
+            ? secrecyMobile(storeAfterSaleAddress.salesConsigneeMobile)
+            : ''
         }}</view>
       </view>
       <view v-if="refundShow">
         <view class="detail-item">
           <view class="title">退款金额:</view>
-          <view class="value">{{
-            serviceDetail.flowPrice | unitPrice("￥")
+          <view class="value">{{unitPrice(serviceDetail.flowPrice, "￥")
           }}</view>
         </view>
         <view class="detail-item" v-if="serviceDetail.agree_price">
           <view class="title">同意退款:</view>
-          <view class="value">{{
-            serviceDetail.agree_price | unitPrice("￥")
+          <view class="value">{{unitPrice(serviceDetail.agree_price, "￥")
           }}</view>
         </view>
         <view class="detail-item" v-if="serviceDetail.actual_price">
           <view class="title">实际退款:</view>
-          <view class="value">{{
-            serviceDetail.actual_price | unitPrice("￥")
+          <view class="value">{{unitPrice(serviceDetail.actual_price, "￥")
           }}</view>
         </view>
         <view class="detail-item" v-if="serviceDetail.actual_price">
           <view class="title">退款时间:</view>
-          <view class="value">{{
-            serviceDetail.refund_time | unixToDate
+          <view class="value">{{unixToDate(serviceDetail.refund_time)
           }}</view>
         </view>
         <view class="detail-item" v-if="serviceDetail.refund_price !== 0">
           <view class="title">退款方式:</view>
-          <view class="value">{{
-            serviceDetail.refundWay | refundWayFilter
+          <view class="value">{{refundWayFilter(serviceDetail.refundWay)
           }}</view>
         </view>
         <view class="detail-item" v-if="accountShow && serviceDetail.refund_price != 0">
           <view class="title">账户类型:</view>
-          <view class="value">{{
-            serviceDetail.accountType | accountTypeFilter
+          <view class="value">{{accountTypeFilter(serviceDetail.accountType)
           }}</view>
         </view>
         <view class="detail-item" v-if="
@@ -232,10 +226,7 @@ export default {
     this.getAddress();
     this.getLog(options.sn);
   },
-  filters: {
-    /**
-     * 售后状态信息
-     */
+  methods: {
     statusFilter(val) {
       switch (val) {
         case "APPLY":
@@ -264,25 +255,16 @@ export default {
           return "";
       }
     },
-
-    /**
-     * 退款信息
-     */
     refundWayFilter(val) {
       switch (val) {
         case "OFFLINE":
           return "账户退款";
-        case "OFFLINE":
-          return "线下退款";
         case "ORIGINAL":
           return "原路退回";
         default:
           return "";
       }
     },
-    /**
-     * 账户信息
-     */
     accountTypeFilter(val) {
       switch (val) {
         case "WEIXINPAY":
@@ -295,8 +277,6 @@ export default {
           return "";
       }
     },
-  },
-  methods: {
     /**
      * 点击图片放大或保存
      */

pages/order/afterSales/applyProgress.vue

@@ -18,12 +18,11 @@
     <view class="info-view">
       <view>
         <u-time-line v-if="logList.length != 0">
-          <u-time-line-item>
-            <!-- 此处没有自定义左边的内容，会默认显示一个点 -->
-            <template v-slot:content>
-              <view v-for="(time,index) in logList" :key="index">
-                <view class="u-order-desc">{{time.message}}</view>
-                <view class="u-order-time">{{time.createTime}}</view>
+          <u-time-line-item v-for="(time, index) in logList" :key="index">
+            <template #content>
+              <view>
+                <view class="u-order-desc">{{ time.message }}</view>
+                <view class="u-order-time">{{ time.createTime }}</view>
               </view>
             </template>
           </u-time-line-item>