refactor: 统一组件导入与消息提示方式

- 将多个组件中的 require 替换为 import，提升代码一致性。
- 更新消息提示方式，使用统一的 Message 和 Modal 组件，增强用户体验。
- 调整部分组件的样式和逻辑，确保界面一致性与可读性。

buyer/package.json

@@ -23,10 +23,8 @@
     "qs": "^6.9.4",
     "sass": "^1.63.6",
     "sass-loader": "^10.4.1",
-    "swiper": "^5.4.5",
     "uuid": "^8.3.2",
     "vue": "^3.5.35",
-    "vue-awesome-swiper": "^4.1.1",
     "vue-qr": "^5.0.3",
     "vue-router": "^4.6.4",
     "vuex": "^4.1.0"

buyer/src/components/addressManage/index.vue

@@ -44,6 +44,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import multipleMap from "@/components/map/multiple-map";
 import {
   newMemberAddress,
@@ -96,7 +97,7 @@ export default {
             editMemberAddress(params).then((res) => {
               this.loading = false;
               if (res.success) {
-                this.$Message.success('编辑地址成功');
+                Message.success('编辑地址成功');
                 this.$emit('change', true);
                 this.hide();
               }
@@ -105,7 +106,7 @@ export default {
             newMemberAddress(params).then((res) => {
               this.loading = false;
               if (res.success) {
-                this.$Message.success('新增地址成功');
+                Message.success('新增地址成功');
                 this.$emit('change', true);
                 this.hide();
               }

buyer/src/components/drawer/Drawer.vue

@@ -79,6 +79,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import { Delete } from '@element-plus/icons-vue';
 import {cartGoodsAll, delCartGoods, addCartGoods, cartCount} from '@/api/cart.js'
 import { getOrderList } from '@/api/order';
@@ -165,14 +166,14 @@ export default {
     delGoods (id) {
       delCartGoods({ skuIds: id }).then((res) => {
         if (res.success) {
-          this.$Message.success('删除成功');
+          Message.success('删除成功');
           this.getCartList();
           cartCount().then(res => {
             this.$store.commit('SET_CARTNUM', res.result)
             this.Cookies.setItem('cartNum', res.result)
           })
         } else {
-          this.$Message.error(res.message);
+          Message.error(res.message);
         }
       });
     },
@@ -183,7 +184,7 @@ export default {
     receive (item) { // 领取优惠券
       receiveCoupon(item.id).then(res => {
         if (res.success) {
-          this.$Modal.confirm({
+          Modal.confirm({
             title: '领取优惠券',
             content: '<p>优惠券领取成功，可到我的优惠券页面查看</p>',
             okText: '我的优惠券',
@@ -232,9 +233,9 @@ export default {
       addCartGoods(params).then(res => {
         this.loading = false;
         if (res.success) {
-          this.$Message.success('商品已成功添加到购物车')
+          Message.success('商品已成功添加到购物车')
         } else {
-          this.$Message.warning(res.message);
+          Message.warning(res.message);
         }
       }).catch(() => { this.loading = false });
     },
@@ -280,7 +281,7 @@ export default {
     cancelCollect (id) { // 取消商品收藏
       cancelCollect('GOODS', id).then(res => {
         if (res.success) {
-          this.$Message.success('取消收藏成功')
+          Message.success('取消收藏成功')
           this.getCollectList();
         }
       })

buyer/src/components/drawer/Main.vue

@@ -13,7 +13,7 @@
       </div>
 
     </div>
-    <el-drawer width="300" class="popup" :title="drawerData.title" :mask="resetConfig.mask" :closable="resetConfig.closable"
+    <el-drawer width="300" class="popup" :title="drawerData.title" :modal="resetConfig.mask" :show-close="resetConfig.closable"
       v-model="handleDrawer">
       <drawerPage :title="drawerData.title" />
     </el-drawer>
@@ -21,6 +21,7 @@
 </template>
 
 <script>
+import { Modal } from "@/utils/message";
 import Storage from '@/plugins/storage.js';
 import Configuration from './config';
 import drawerPage from './Drawer'
@@ -55,7 +56,7 @@ export default {
     },
     clickBar (val) { // tabbar点击操作
       if (!this.userInfo) {
-        this.$Modal.confirm({
+        Modal.confirm({
           title: '请登录',
           content: '请登录后执行此操作',
           okText: '立即登录',

buyer/src/components/fixed/index.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="shadow-box">
         <div class="shadow-item flex flex-a-c flex-j-c" v-for="(item,index) in iconList" @click="handleClickIcon(item)" :key="index">
-          <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
+          <img class="icon" :src="getIconUrl(item.icon)">
           <div class="shadow-label">{{item.label}}</div>
           <div class="line" v-if="iconList.length-1 !=index"></div>
         </div>
@@ -9,6 +9,8 @@
 </template>
 
 <script>
+import { getIconUrl } from "@/assets/iconfont/iconMap";
+
 export default {
   name: "fixed-index",
   data(){
@@ -58,6 +60,7 @@ export default {
 
   },
   methods:{
+    getIconUrl,
     scrollToTop() {
       const c = document.documentElement.scrollTop || document.body.scrollTop;
       if (c > 0) {

buyer/src/components/footer/Footer.vue

@@ -69,12 +69,13 @@
 </template>
 
 <script>
+import config from '@/config';
 
 export default {
   name: "Footer",
   data() {
     return {
-      config:require('@/config'),
+      config,
       guideArr: [
         // 导航链接
         ["购物指南", "购物流程", "会员介绍", "生活旅行", "常见问题"],

buyer/src/components/goodsDetail/ShowGoods.vue

@@ -120,7 +120,7 @@
             </div>
             <!-- 优惠券展示 -->
             <div class="item-price-coupon-row" v-if="promotionMap['COUPON'].length">
-              <p class="Ellipsis">
+              <div class="Ellipsis">
                 <span class="item-price-title">优 惠 券</span>
                 <span>
                   <span
@@ -156,7 +156,7 @@
                       </span>
                     </div>
                   </div>
-              </p>
+              </div>
             </div>
             <!-- 满减展示 -->
             <div class="item-price-row" v-if="promotionMap['FULL_DISCOUNT']">
@@ -238,7 +238,7 @@
                   :precision="0"
                   @blur="changeCount"
                 ></el-input-number>
-                <span class="inventory">&nbsp&nbsp库存{{ skuDetail.quantity }}</span>
+                <span class="inventory">&nbsp;&nbsp;库存{{ skuDetail.quantity }}</span>
               </div>
             </div>
           </div>
@@ -293,7 +293,7 @@
                   >立即购买</el-button
                 >
                 <el-tooltip content="观看视频" v-if="skuDetail.goodsVideo">
-                  <img class="view-video" @click="showGoodsVideo = true" :src="require('@/assets/iconfont/play.svg')" alt="">
+                  <img class="view-video" @click="showGoodsVideo = true" :src="playIcon" alt="">
                 </el-tooltip>
               </div>
             </div>
@@ -308,6 +308,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { StarFilled } from '@element-plus/icons-vue';
 import Promotion from "./Promotion.vue";
 import DPlayer from "dplayer";
@@ -318,6 +319,7 @@ import {
   cancelCollect,
 } from "@/api/member.js";
 import { addCartGoods } from "@/api/cart.js";
+import playIcon from "@/assets/iconfont/play.svg";
 
 export default {
   name: "ShowGoods",
@@ -348,6 +350,7 @@ export default {
   },
   data() {
     return {
+      playIcon,
       showGoodsVideo:false,
       goodsVideo:"",
       wholesaleList: [],
@@ -440,7 +443,7 @@ export default {
     changeCount(val) {
       if (this.wholesaleList && this.wholesaleList.length > 0) {
         if (this.count <= this.wholesaleList[0].num) {
-          this.$Message.warning("批发商品购买数量不能小于起批数量");
+          Message.warning("批发商品购买数量不能小于起批数量");
           this.count = this.wholesaleList[0].num;
         }
       }
@@ -480,10 +483,16 @@ export default {
           if (res.success) {
             this.$router.push({
               path: "/shoppingCart",
-              query: { detail: this.skuDetail, count: this.count },
+              query: {
+                skuId: this.skuDetail.id,
+                goodsId: this.skuDetail.goodsId,
+                thumbnail: this.skuDetail.thumbnail,
+                goodsName: this.skuDetail.goodsName,
+                count: this.count,
+              },
             });
           } else {
-            this.$Message.warning(res.message);
+            Message.warning(res.message);
           }
         })
         .catch(() => {
@@ -511,7 +520,7 @@ export default {
               query: { way: params.cartType },
             });
           } else {
-            this.$Message.warning(res.message);
+            Message.warning(res.message);
           }
         })
         .catch(() => {
@@ -523,14 +532,14 @@ export default {
       if (this.isCollected) {
         let cancel = await cancelCollect("GOODS", this.skuDetail.id);
         if (cancel.success) {
-          this.$Message.success("取消收藏成功");
+          Message.success("取消收藏成功");
           this.isCollected = false;
         }
       } else {
         let collect = await collectGoods("GOODS", this.skuDetail.id);
         if (collect.code === 200) {
           this.isCollected = true;
-          this.$Message.success("收藏商品成功,可以前往个人中心我的收藏查看");
+          Message.success("收藏商品成功,可以前往个人中心我的收藏查看");
         }
       }
     },
@@ -586,9 +595,9 @@ export default {
       // 领取优惠券
       receiveCoupon(id).then((res) => {
         if (res.success) {
-          this.$Message.success("优惠券领取成功");
+          Message.success("优惠券领取成功");
         } else {
-          this.$Message.warning(res.message);
+          Message.warning(res.message);
         }
       });
     },

buyer/src/components/goodsDetail/ShowGoodsDetail.vue

@@ -85,10 +85,10 @@
                   </div>
                 </div>
                 <div class="remarks-page">
-                  <el-pagination :total="commentTotal" small
+                  <el-pagination v-model:current-page="commentParams.pageNumber" v-model:page-size="commentParams.pageSize"
+                    :total="commentTotal" small
                     @current-change="changePageNum"
                     @size-change="changePageSize"
-                    :page-size="commentParams.pageSize"
                      layout="prev, pager, next"></el-pagination>
                 </div>
               </div>
@@ -368,7 +368,7 @@ export default {
   box-sizing: border-box;
   padding: 0 30px;
   min-height: 300px;
-  :deep img{
+  :deep(img){
     margin:0 auto;
   }
 }

buyer/src/components/header/Header.vue

@@ -91,11 +91,12 @@
 </template>
 
 <script>
+import { Modal } from "@/utils/message";
 import { ShoppingCart } from '@element-plus/icons-vue';
 import storage from '@/plugins/storage.js';
 import {cartGoodsAll} from '@/api/cart.js';
 import {logout} from '@/api/account.js';
-
+import config from '@/config';
 
 export default {
   components: { ShoppingCart },
@@ -108,7 +109,7 @@ export default {
 
   data() {
     return {
-      config: require('@/config'),
+      config,
       userInfo: {}, // 用户信息
       shoppingCart: [], // 购物车
       cartLoading: false,
@@ -150,7 +151,7 @@ export default {
       if (this.userInfo.username) {
         this.$router.push({path: path});
       } else {
-        this.$Modal.confirm({
+        Modal.confirm({
           title: '请登录',
           content: '请登录后执行此操作',
           okText: '立即登录',

buyer/src/components/indexDecorate/ModelFormItem.vue

@@ -49,8 +49,7 @@
         <div
           class="discountAdvert"
           :style="{
-            backgroundImage:
+            backgroundImage: 'url(' + decorateImg + ')',
-              'url(' + require('@/assets/images/decorate.png') + ')',
           }"
         >
           <div>
@@ -153,7 +152,7 @@ import goodsAndType from "./modelList/goodsAndType.vue";
 import onlyGoodsModel from "./modelList/onlyGoodsModel.vue";
 import mixModel from "./modelList/mixModel.vue";
 import forYour from "./modelList/forYour.vue";
-
+import decorateImg from "@/assets/images/decorate.png";
 
 export default {
   name: "modelFormItem",
@@ -175,6 +174,7 @@ export default {
   },
   data() {
     return {
+      decorateImg,
       showModal: false, // 控制模态框显隐
       selected: {}, // 已选数据
     };

buyer/src/components/indexDecorate/modelList/Carousel.vue

@@ -51,18 +51,14 @@
             </div> -->
           </div>
           <div v-else class="flex flex-a-c ">
-            <div class="btns" @click="$router.push('login')" shape="circle"
+            <div class="btns" @click="$router.push('login')">登录</div>
-            >登录</div
+            <div class="btns sign-up" @click="$router.push('signUp')">注册</div>
-            >
-            <div class="btns sign-up" @click="$router.push('signUp')" shape="circle"
-            >注册</div
-            >
           </div>
 
           <div class="gray-line"></div>
           <div class="icon-list flex flex-j-sb" >
             <div class="icon-item" @click="entryControl(item)" :key="index" v-for="(item, index) in entranceList">
-              <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
+              <img class="icon" :src="getIconUrl(item.icon)">
               <div>
                 {{ item.label }}
               </div>
@@ -70,7 +66,7 @@
           </div>
           <div class="icon-list flex flex-j-sb" >
             <div class="icon-item" :key="index"  @click="entryControl(item)" v-for="(item, index) in appendList">
-              <img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
+              <img class="icon" :src="getIconUrl(item.icon)">
               <div>
                 {{ item.label }}
               </div>
@@ -89,6 +85,9 @@
 <script>
 
 import storage from "@/plugins/storage";
+import config from "@/config";
+import defaultAvatar from "@/assets/images/default.png";
+import { getIconUrl } from "@/assets/iconfont/iconMap";
 export default {
   name: "modelCarousel",
   props: ["data"],
@@ -102,8 +101,8 @@ export default {
   },
   data() {
     return {
-      config: require("@/config"),
+      config,
-      defaultAvatar: require("@/assets/images/default.png"),
+      defaultAvatar,
       userInfo: {}, // 用户信息
       entranceList: [
         {
@@ -170,6 +169,7 @@ export default {
     };
   },
   methods: {
+    getIconUrl,
     carouselItemKey(item, index) {
       return item?.img || item?.url || `slide-${index}`;
     },

buyer/src/components/indexDecorate/modelList/Carousel2.vue

@@ -34,10 +34,10 @@
           <el-avatar v-else :size="80" class="mb_10"><el-icon><User /></el-icon></el-avatar>
           <div>Hi，{{ $filters.secrecyMobile(userInfo.nickName || `欢迎来到${config.title}`) }}</div>
           <div v-if="userInfo.id">
-            <el-button type="danger" shape="circle">会员中心</el-button>
+            <el-button type="danger">会员中心</el-button>
           </div>
           <div v-else>
-            <el-button type="danger" shape="circle">请登录</el-button>
+            <el-button type="danger">请登录</el-button>
           </div>
         </div>
         <div class="shop-msg">
@@ -60,13 +60,14 @@
 import {articleList} from '@/api/common.js'
 import storage from '@/plugins/storage';
 import { User } from '@element-plus/icons-vue';
+import config from '@/config';
 export default {
   components: { User },
   name: 'modelCarousel2',
   props: ['data'],
   data () {
     return {
-      config:require('@/config'),
+      config,
       userInfo: {}, // 用户信息
       articleList: [], // 常见问题
       params: { // 请求常见问题参数

buyer/src/components/invoiceModal/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="invoice-modal">
-    <el-dialog v-model="invoiceAvailable" width="640" footer-hide>
+    <el-dialog v-model="invoiceAvailable" width="640">
       <template #header><p>
         <span>发票信息</span>
       </p></template>

buyer/src/components/map/index.vue

@@ -19,10 +19,11 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import AMapLoader from "@amap/amap-jsapi-loader";
 import { handleRegion } from "@/api/address.js";
+import config from "@/config/index";
 
-const config = require('@/config/index')
 export default {
   name: "map",
   data() {
@@ -62,7 +63,7 @@ export default {
           }
         });
       } else {
-        this.$Message.error('未获取到坐标信息！请查看高德API配置是否正确')
+        Message.error('未获取到坐标信息！请查看高德API配置是否正确')
       }
 
     },
@@ -133,7 +134,7 @@ export default {
     selectAddr(location) {
       // 选择坐标
       if (!location) {
-        this.$Message.warning("请选择正确点位");
+        Message.warning("请选择正确点位");
         return false;
       }
       const lnglat = [location.lng, location.lat];

buyer/src/components/map/multiple-map.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-dialog width="800" footer-hide v-model="enableMap">
+  <el-dialog width="800" v-model="enableMap">
     <el-radio-group @change="changeMap" v-model="mapDefault" type="button">
       <el-radio label="select">级联选择</el-radio>
       <el-radio label="map" v-if="aMapSwitch">高德地图</el-radio>
@@ -27,6 +27,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { aMapSwitch } from '@/config/index'
 import mapping from "@/components/map/index.vue";
 import * as API_Setup from "@/api/common.js";
@@ -101,7 +102,7 @@ export default {
     // 选择完成
     finished() {
       if(!this.chiosend[0]){
-        this.$Message.error("请选择地址")
+        Message.error("请选择地址")
         return
       }
       const params = this.chiosend.filter((item) => item!=="" && item.value !== "");

buyer/src/components/mixes/talkIm.vue

@@ -3,6 +3,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { getIMDetail } from "@/api/common";
 import Storage from "@/plugins/storage";
 import { getMemberMsg } from "@/api/login";
@@ -34,7 +35,7 @@ export default {
         }
 
       } else {
-        this.$Message.error("请登录后再联系客服");
+        Message.error("请登录后再联系客服");
         return;
       }
     },

buyer/src/components/nav/CateNav.vue

@@ -167,7 +167,7 @@ export default {
         return;
       }
       this.cateList = JSON.parse(localStorage.getItem("category"));
-      // this.$Message.info(cateList)
+      // Message.info(cateList)
       }
     },
     getCate() {

buyer/src/components/verify/index.vue

@@ -15,6 +15,7 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import { Refresh, ArrowRight } from '@element-plus/icons-vue';
 import { getVerifyImg, postVerifyImg } from './verify.js';
 export default {
@@ -110,7 +111,7 @@ export default {
           this.data = res.result;
           this.show = true;
         } else {
-          this.$Message.warning('请求失败请重试！')
+          Message.warning('请求失败请重试！')
         }
       });
     }

buyer/src/main.js

@@ -12,8 +12,9 @@ import * as filters from "./plugins/filters";
 import storage from "@/plugins/storage";
 import { fetchAndApplyTheme } from "@/utils/theme";
 import { getThemeSetting } from "@/api/common.js";
+import config from "@/config";
 
-const { aMapSecurityJsCode, inputMaxLength } = require("@/config");
+const { aMapSecurityJsCode, inputMaxLength } = config;
 
 if (aMapSecurityJsCode) {
   window._AMapSecurityConfig = {

buyer/src/pages/Cart.vue

@@ -242,6 +242,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import Promotion from "@/components/goodsDetail/Promotion";
 import Search from "@/components/Search";
 import * as APICart from "@/api/cart";
@@ -289,13 +290,13 @@ export default {
     },
     // 收藏商品
     collectGoods(id) {
-      this.$Modal.confirm({
+      Modal.confirm({
         title: "收藏",
         content: "商品收藏后可在个人中心我的收藏查看",
         onOk: () => {
           APIMember.collectGoods("GOODS", id).then((res) => {
             if (res.success) {
-              this.$Message.success("收藏商品成功");
+              Message.success("收藏商品成功");
               this.getCartList();
             }
           });
@@ -318,16 +319,16 @@ export default {
       } else {
         idArr.push(id);
       }
-      this.$Modal.confirm({
+      Modal.confirm({
         title: "删除",
         content: "确定要删除该商品吗？",
         onOk: () => {
           APICart.delCartGoods({ skuIds: idArr.toString() }).then((res) => {
             if (res.success) {
-              this.$Message.success("删除成功");
+              Message.success("删除成功");
               this.getCartList();
             } else {
-              this.$Message.error(res.message);
+              Message.error(res.message);
             }
           });
         },
@@ -335,16 +336,16 @@ export default {
     },
     // 清空购物车
     clearCart() {
-      this.$Modal.confirm({
+      Modal.confirm({
         title: "提示",
         content: "确定要清空购物车吗？清空后不可恢复",
         onOk: () => {
           APICart.clearCart().then((res) => {
             if (res.success) {
-              this.$Message.success("清空购物车成功");
+              Message.success("清空购物车成功");
               this.getCartList();
             } else {
-              this.$Message.error(res.message);
+              Message.error(res.message);
             }
           });
         },
@@ -355,7 +356,7 @@ export default {
       if (this.checkedNum) {
         this.$router.push({ path: "/pay", query: { way: "CART" } });
       } else {
-        this.$Message.warning("请至少选择一件商品");
+        Message.warning("请至少选择一件商品");
       }
     },
     // 展示优惠券
@@ -393,9 +394,9 @@ export default {
       let res = await APIMember.receiveCoupon(item.id);
       if (res.success) {
         item["disabled"] = true;
-        this.$Message.success("领取成功");
+        Message.success("领取成功");
       } else {
-        this.$Message.error(res.message);
+        Message.error(res.message);
       }
     },
     // 购物车列表

buyer/src/pages/CouponCenter.vue

@@ -43,11 +43,12 @@
             <i class="circle-bottom"></i>
           </li>
         </ul>
-        <el-pagination           :total="total"
+        <el-pagination           v-model:current-page="params.pageNumber"
+          v-model:page-size="params.pageSize"
+          :total="total"
           @current-change="changePageNum"
           class="pageration"
           @size-change="changePageSize"
-          :page-size="params.pageSize"
          layout="total, sizes, prev, pager, next"></el-pagination>
       </div>
     </div>
@@ -55,6 +56,7 @@
   </div>
 </template>
 <script>
+import { Modal } from "@/utils/message";
 import { couponList, receiveCoupon } from "@/api/member.js";
 export default {
   data() {
@@ -116,7 +118,7 @@ export default {
       receiveCoupon(item.id)
         .then((res) => {
           if (!res || !res.success) return;
-          this.$Modal.confirm({
+          Modal.confirm({
             title: "领取优惠券",
             content: "优惠券领取成功，可到我的优惠券页面查看",
             okText: "我的优惠券",

buyer/src/pages/ForgetPassword.vue

@@ -105,18 +105,20 @@
 
 <script>
 
+import { Message } from "@/utils/message";
 import * as RegExp from '@/plugins/RegExp.js';
 import { md5 } from '@/plugins/md5.js';
 import * as apiLogin from '@/api/login.js';
 import { sendSms } from '@/api/common.js';
 import Verify from '@/components/verify';
 import { Lock, Iphone, Document } from '@element-plus/icons-vue';
+import config from '@/config';
 export default {
   name: 'ForgetPassword',
   components: { Verify, Lock, Iphone, Document },
   data () {
     return {
-      config:require('@/config'),
+      config,
       loading: false, // 加载状态
       loading1: false, // 第二步加载状态
       formFirst: { // 手机验证码表单
@@ -163,10 +165,10 @@ export default {
           apiLogin.validateCode(data).then((res) => {
             this.loading = false;
             if (res.success) {
-            //   this.$Message.success('');
+            //   Message.success('');
               this.step = 1;
             } else {
-              this.$Message.warning(res.message);
+              Message.warning(res.message);
             }
           }).catch(() => { this.loading = false; });
         } else {}
@@ -177,7 +179,7 @@ export default {
         if (valid) {
           let params = JSON.parse(JSON.stringify(this.form));
           if (params.password !== params.oncePasd) {
-            this.$Message.warning('两次输入密码不一致');
+            Message.warning('两次输入密码不一致');
             return;
           };
           params.mobile = this.formFirst.mobile;
@@ -189,7 +191,7 @@ export default {
             this.loading1 = false;
             console.log(res);
             if (res.success) {
-              this.$Message.success('修改密码成功');
+              Message.success('修改密码成功');
               this.$router.push('login');
             }
           }).catch(() => { this.loading = false; });
@@ -199,11 +201,11 @@ export default {
     sendCode () { // 发送验证码
       if (this.time === 60) {
         if (this.formFirst.mobile === '') {
-          this.$Message.warning('请先填写手机号');
+          Message.warning('请先填写手机号');
           return;
         }
         if (!this.verifyStatus) {
-          this.$Message.warning('请先完成安全验证');
+          Message.warning('请先完成安全验证');
           return;
         }
         let params = {
@@ -212,7 +214,7 @@ export default {
         };
         sendSms(params).then(res => {
           if (res.success) {
-            this.$Message.success('验证码发送成功');
+            Message.success('验证码发送成功');
             let that = this;
             this.interval = setInterval(() => {
               that.time--;
@@ -226,7 +228,7 @@ export default {
               }
             }, 1000);
           } else {
-            this.$Message.warning(res.message);
+            Message.warning(res.message);
           }
         });
       }

buyer/src/pages/GoodsDetail.vue

@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { StarFilled } from '@element-plus/icons-vue';
 import Search from "@/components/Search";
 
@@ -154,7 +155,7 @@ export default {
               });
             }
           } else {
-            this.$Message.error(res.message);
+            Message.error(res.message);
             this.isLoading = false
           }
         })
@@ -182,21 +183,21 @@ export default {
         return;
       }
       if (!this.Cookies.getItem("userInfo")) {
-        this.$Message.warning("请先登录");
+        Message.warning("请先登录");
         this.$router.push("/login");
         return;
       }
       if (this.storeCollected) {
         let cancel = await cancelStoreCollect("STORE", storeId);
         if (cancel.success) {
-          this.$Message.success("已取消收藏");
+          Message.success("已取消收藏");
           this.storeCollected = false;
         }
       } else {
         let collect = await collectStore("STORE", storeId);
         if (collect.code === 200) {
           this.storeCollected = true;
-          this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
+          Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
         }
       }
     },

buyer/src/pages/GoodsList.vue

@@ -99,10 +99,11 @@
       </div>
       <div class="goods-page">
         <el-pagination
+          v-model:current-page="params.pageNumber"
+          v-model:page-size="params.pageSize"
           @current-change="changePageNum"
           @size-change="changePageSize"
           :total="total"
-          :page-size="params.pageSize"
           layout="total, prev, pager, next, sizes"
         ></el-pagination>
       </div>
@@ -113,6 +114,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { ArrowDown, ArrowUp } from '@element-plus/icons-vue';
 import GoodsClassNav from "@/components/nav/GoodsClassNav";
 import * as apiGoods from "@/api/goods";
@@ -201,7 +203,7 @@ export default {
     },
     goShopPage(id) {
       if (!id) {
-        this.$Message.warning("店铺信息不存在");
+        Message.warning("店铺信息不存在");
         return;
       }
       const routeUrl = this.$router.resolve({

buyer/src/pages/Login.vue

@@ -154,6 +154,7 @@
 
 <script>
 
+import { Message, Spin } from "@/utils/message";
 import * as RegExp from "@/plugins/RegExp.js";
 import { md5 } from "@/plugins/md5.js";
 import * as apiLogin from "@/api/login.js";
@@ -163,6 +164,7 @@ import storage from "@/plugins/storage.js";
 import verify from "@/components/verify";
 import vueQr from "vue-qr";
 import { User, Lock, Document } from "@element-plus/icons-vue";
+import config from "@/config";
 
 export default {
   name: "Login",
@@ -182,7 +184,7 @@ export default {
       scannerCodeLoginFLag: false,
       scannerCodeLoginStatus: 0,
       qrCodeTimer:null,
-      config: require('@/config'),
+      config,
       type: true, // true 账号登录  false 验证码登录
       formData: {
         // 登录表单
@@ -239,7 +241,7 @@ export default {
             apiLogin.smsLogin(data).then((res) => {
               this.hideVerify();
               if (res.success) {
-                this.$Message.success("登录成功");
+                Message.success("登录成功");
                 storage.setItem("accessToken", res.result.accessToken);
                 storage.setItem("refreshToken", res.result.refreshToken);
                 storage.setItem('getTimes',0)
@@ -258,7 +260,7 @@ export default {
                   }
                 });
               } else {
-                this.$Message.error(res.message);
+                Message.error(res.message);
               }
             });
           }
@@ -269,11 +271,11 @@ export default {
     sendCode() {
       if (this.time === 60) {
         if (this.formSms.mobile === "") {
-          this.$Message.warning("请先填写手机号");
+          Message.warning("请先填写手机号");
           return;
         }
         if (!this.verifyStatus) {
-          this.$Message.warning("请先完成安全验证");
+          Message.warning("请先完成安全验证");
           return;
         }
         let params = {
@@ -282,7 +284,7 @@ export default {
         };
         sendSms(params).then((res) => {
           if (res.success) {
-            this.$Message.success("验证码发送成功");
+            Message.success("验证码发送成功");
             let that = this;
             this.interval = setInterval(() => {
               that.time--;
@@ -296,7 +298,7 @@ export default {
               }
             }, 1000);
           } else {
-            this.$Message.warning(res.message);
+            Message.warning(res.message);
           }
         });
       }
@@ -310,19 +312,19 @@ export default {
         let data = JSON.parse(JSON.stringify(this.formData));
         data.password = md5(data.password);
         this.hideVerify();
-        this.$Spin.show();
+        Spin.show();
         apiLogin
           .login(data)
           .then((res) => {
             if (res.success) {
               this.loginSuccess(res.result.accessToken,res.result.refreshToken);
             } else {
-              this.$Spin.hide();
+              Spin.hide();
-              this.$Message.error(res.message);
+              Message.error(res.message);
             }
           })
           .catch(() => {
-            this.$Spin.hide();
+            Spin.hide();
           });
       } else {
         this.verifyStatus = true;
@@ -340,11 +342,11 @@ export default {
       webLogin(type);
     },
     loginSuccess(accessToken,refreshToken){
-      this.$Message.success("登录成功");
+      Message.success("登录成功");
       storage.setItem("accessToken", accessToken);
       storage.setItem("refreshToken", refreshToken);
       apiLogin.getMemberMsg().then((res) => {
-        this.$Spin.hide();
+        Spin.hide();
         if (res.success) {
           storage.setItem("userInfo", res.result);
           let query = this.$route.query;

buyer/src/pages/Merchant.vue

@@ -100,7 +100,8 @@
         </div>
       </div>
       <div class="goods-page">
-        <el-pagination           :page-size="params.pageSize"
+        <el-pagination           v-model:current-page="params.pageNumber"
+          v-model:page-size="params.pageSize"
           :total="total"
           @current-change="changePageNum"
           @size-change="changePageSize"
@@ -116,6 +117,7 @@
 
 <script>
 
+import { Message } from "@/utils/message";
 import { ArrowDown, StarFilled } from '@element-plus/icons-vue';
 import {getCateById, getDetailById} from "@/api/shopentry";
 import {
@@ -247,7 +249,7 @@ export default {
     getStoreMsg() {
       const storeId = this.$route.query.id;
       if (!storeId) {
-        this.$Message.warning("店铺不存在");
+        Message.warning("店铺不存在");
         return;
       }
       getDetailById(storeId)
@@ -330,7 +332,7 @@ export default {
         return;
       }
       if (!this.Cookies.getItem("userInfo")) {
-        this.$Message.warning("请先登录");
+        Message.warning("请先登录");
         this.$router.push("/login");
         return;
       }
@@ -338,14 +340,14 @@ export default {
         if (this.storeCollected) {
           const cancel = await cancelStoreCollect("STORE", storeId);
           if (cancel.success) {
-            this.$Message.success("已取消收藏");
+            Message.success("已取消收藏");
             this.storeCollected = false;
           }
         } else {
           const collect = await collectStore("STORE", storeId);
           if (collect.success || collect.code === 200) {
             this.storeCollected = true;
-            this.$Message.success(
+            Message.success(
               "收藏店铺成功,可以前往个人中心我的收藏查看"
             );
           }

buyer/src/pages/ShoppingCart.vue

@@ -13,7 +13,7 @@
           </div>
           <div class="add-info-box-row">
             <div class="add-info-img">
-              <img :src="this.detail.thumbnail" alt="">
+              <img :src="detail.thumbnail" alt="">
             </div>
             <div class="add-info-intro">
               <p>{{detail.goodsName}}</p>
@@ -24,7 +24,7 @@
         <div class="car-btn-group">
           <div></div>
           <div class="car-btn-row">
-            <router-link :to="`/goodsDetail?skuId=${detail.id}&goodsId=${detail.goodsId}`">
+            <router-link :to="{ path: '/goodsDetail', query: { skuId: detail.skuId, goodsId: detail.goodsId } }">
               <button class="btn-car hover-pointer btn-car-to-detail">查看商品详情</button>
             </router-link>
             <router-link to="/cart">
@@ -51,8 +51,13 @@ export default {
     };
   },
   mounted () {
-    let detail = this.$route.query.detail;
+    const { skuId, goodsId, thumbnail, goodsName } = this.$route.query;
-    if (detail) this.detail = detail;
+    this.detail = {
+      skuId,
+      goodsId,
+      thumbnail,
+      goodsName
+    };
   }
 };
 </script>

buyer/src/pages/SignUp.vue

@@ -94,18 +94,20 @@
 
 <script>
 
+import { Message } from "@/utils/message";
 import * as RegExp from '@/plugins/RegExp.js';
 import { md5 } from '@/plugins/md5.js';
 import * as apiLogin from '@/api/login.js';
 import { sendSms } from '@/api/common.js';
 import Verify from '@/components/verify';
 import { User, Lock, Iphone, Document } from '@element-plus/icons-vue';
+import config from '@/config';
 export default {
   name: 'SignUp',
   components: { Verify, User, Lock, Iphone, Document },
   data () {
     return {
-      config:require('@/config'),
+      config,
       year: new Date().getFullYear(),
       formRegist: {
         // 注册表单
@@ -152,10 +154,10 @@ export default {
         data.password = md5(data.password);
         apiLogin.regist(data).then((res) => {
           if (res.success) {
-            this.$Message.success('注册成功!');
+            Message.success('注册成功!');
             this.$router.push('login');
           } else {
-            this.$Message.warning(res.message || '注册失败');
+            Message.warning(res.message || '注册失败');
           }
         }).catch(() => {});
       }).catch(() => {});
@@ -164,11 +166,11 @@ export default {
     sendCode () {
       if (this.time === 60) {
         if (this.formRegist.mobilePhone === '') {
-          this.$Message.warning('请先填写手机号');
+          Message.warning('请先填写手机号');
           return;
         }
         if (!this.verifyStatus) {
-          this.$Message.warning('请先完成安全验证');
+          Message.warning('请先完成安全验证');
           return;
         }
         let params = {
@@ -177,7 +179,7 @@ export default {
         };
         sendSms(params).then(res => {
           if (res.success) {
-            this.$Message.success('验证码发送成功');
+            Message.success('验证码发送成功');
             let that = this;
             this.interval = setInterval(() => {
               that.time--;
@@ -191,7 +193,7 @@ export default {
               }
             }, 1000);
           } else {
-            this.$Message.warning(res.message || '验证码发送失败');
+            Message.warning(res.message || '验证码发送失败');
           }
         }).catch(() => {});
       }

buyer/src/pages/article/detail.vue

@@ -12,7 +12,7 @@
 
 <script>
 import { articleDetail } from "@/api/common.js";
-const config = require("@/config/index");
+import config from "@/config/index";
 export default {
   data() {
     return {

buyer/src/pages/home/memberCenter/AccountSafe.vue

@@ -48,11 +48,7 @@
       v-model="bindModalVisible"
       title="绑定第三方账户"
       :close-on-click-modal="false"
-      :footer-hide="bindForm.type === 'WECHAT'"
+      @closed="resetBindForm"
-      :ok-text="bindModalOkText"
-      :loading="bindSubmitLoading"
-      @ok="submitBind"
-      @cancel="resetBindForm"
     >
       <el-form label-width="110px">
         <el-form-item label="类型">
@@ -67,8 +63,8 @@
               <div v-else class="wechatQrEmpty">二维码获取失败，请刷新重试</div>
             </div>
             <div class="wechatQrActions">
-              <el-button @click="fetchWechatQrCode">刷新二维码</el-button>
+              <el-button :loading="qrCodeLoading" @click="fetchWechatQrCode">刷新二维码</el-button>
-              <el-button type="primary" @click="submitBind">我已完成绑定</el-button>
+              <el-button type="primary" :loading="bindSubmitLoading" @click="submitBind">我已完成绑定</el-button>
             </div>
             <div class="wechatQrTip">请使用微信扫码关注/授权，完成后点击“我已完成绑定”检测绑定状态</div>
           </div>
@@ -78,11 +74,19 @@
           <el-input v-model="bindForm.unionID" placeholder="请输入 OpenID/UnionID" />
         </el-form-item>
       </el-form>
+
+      <template v-if="bindForm.type !== 'WECHAT'" #footer>
+        <el-button @click="bindModalVisible = false">取消</el-button>
+        <el-button type="primary" :loading="bindSubmitLoading" @click="submitBind">
+          {{ bindModalOkText }}
+        </el-button>
+      </template>
     </el-dialog>
   </div>
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import { Key, Link } from '@element-plus/icons-vue';
 // import { getPwdStatus } from '@/api/account';
 import storage from '@/plugins/storage'
@@ -186,7 +190,7 @@ export default {
       const userId = userInfo && userInfo.id ? String(userInfo.id) : ''
       if (!userId) {
         this.qrCodeBase64 = ''
-        this.$Message.error('未获取到当前用户ID，请重新登录后重试')
+        Message.error('未获取到当前用户ID，请重新登录后重试')
         return
       }
       this.qrCodeLoading = true
@@ -197,7 +201,7 @@ export default {
             return
           }
           this.qrCodeBase64 = ''
-          this.$Message.error((res && res.message) || '二维码获取失败')
+          Message.error((res && res.message) || '二维码获取失败')
         })
         .catch(() => {
           this.qrCodeBase64 = ''
@@ -213,12 +217,12 @@ export default {
         this.refreshConnectBinds()
           .then(() => {
             if (this.isBound(this.bindForm.type)) {
-              this.$Message.success('绑定成功')
+              Message.success('绑定成功')
               this.bindModalVisible = false
               this.resetBindForm()
               return
             }
-            this.$Message.warning('暂未检测到绑定，请扫码后重试')
+            Message.warning('暂未检测到绑定，请扫码后重试')
             this.$nextTick(() => {
               this.bindModalVisible = true
             })
@@ -229,11 +233,11 @@ export default {
         return
       }
       if (!this.bindForm.type) {
-        this.$Message.error('绑定类型不能为空')
+        Message.error('绑定类型不能为空')
         return
       }
       if (!this.bindForm.unionID) {
-        this.$Message.error('OpenID/UnionID 不能为空')
+        Message.error('OpenID/UnionID 不能为空')
         this.$nextTick(() => {
           this.bindModalVisible = true
         })
@@ -243,7 +247,7 @@ export default {
       this.bindSubmitLoading = true
       bindThirdAccount({ unionID: this.bindForm.unionID, type: this.bindForm.type })
         .then(() => {
-          this.$Message.success('绑定成功')
+          Message.success('绑定成功')
           this.bindModalVisible = false
           this.resetBindForm()
           this.refreshConnectBinds()
@@ -253,12 +257,12 @@ export default {
         })
     },
     confirmUnbind (item) {
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '解绑确认',
         content: `<p>确定解绑 ${item.label} 吗？</p>`,
         onOk: () => {
           unbindThirdAccount({ type: item.type }).then(() => {
-            this.$Message.success('解绑成功')
+            Message.success('解绑成功')
             this.refreshConnectBinds()
           })
         }

buyer/src/pages/home/memberCenter/CommentList.vue

@@ -5,11 +5,11 @@
     <div class="order">
       <div class="order-title">
         <div class="order-row title">
-          <div span="10" class="order-detail-title">订单详情</div>
+          <div class="order-detail-title col-10">订单详情</div>
-          <div span="4">收货人</div>
+          <div class="col-4">收货人</div>
-          <div span="4">评价等级</div>
+          <div class="col-4">评价等级</div>
-          <div span="4">评价内容</div>
+          <div class="col-4">评价内容</div>
-          <div span="2"></div>
+          <div class="col-2"></div>
         </div>
       </div>
       <empty v-if="list.length === 0" />
@@ -22,7 +22,7 @@
             <span class="hover-pointer fontsize_12 eval-detail" @click="evaluateDetail(item.id)">评价详情</span>
           </div>
           <div class="order-item-view">
-            <div span="10" class="item-view-name">
+            <div class="item-view-name col-10">
               <div class="order-img hover-color" @click="linkTo(`/goodsDetail?goodsId=${item.goodsId}&skuId=${item.skuId}`)">
                 <img :src="item.goodsImage" alt="" />
               </div>
@@ -30,11 +30,11 @@
                 {{item.goodsName}}
               </div>
             </div>
-            <div span="4">{{ $filters.secrecyMobile(item.createBy ) }}</div>
+            <div class="col-4">{{ $filters.secrecyMobile(item.createBy ) }}</div>
-            <div span="4">
+            <div class="col-4">
               {{item.grade==='GOOD'?'好评' : item.grade === 'WORSE'?'差评' : '中评'}}
             </div>
-            <div span="4">
+            <div class="col-4">
               <el-tooltip>
                   <div class="content">{{item.content}}</div>
                   <template #content>
@@ -44,7 +44,7 @@
                   </template>
               </el-tooltip>
             </div>
-            <div span="2"></div>
+            <div class="col-2"></div>
           </div>
         </div>
       </div>
@@ -52,9 +52,9 @@
     </div>
     <!-- 分页 -->
     <div class="page-size">
-      <el-pagination :total="total" @current-change="changePageNum"
+      <el-pagination v-model:current-page="params.pageNumber" v-model:page-size="params.pageSize"
-        @size-change="changePageSize"
+        :total="total" @current-change="changePageNum"
-        :page-size="params.pageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
+        @size-change="changePageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
     </div>
     </UserCenterLayout>
   </div>
@@ -151,32 +151,32 @@ export default {
   display: flex;
   align-items: center;
 
-  > [span] {
+  > [class*='col-'] {
     box-sizing: border-box;
     padding: 0 8px;
   }
 
-  > [span='12'] {
+  > .col-12 {
     flex: 0 0 50%;
     max-width: 50%;
   }
 
-  > [span='10'] {
+  > .col-10 {
     flex: 0 0 41.666667%;
     max-width: 41.666667%;
   }
 
-  > [span='4'] {
+  > .col-4 {
     flex: 0 0 16.666667%;
     max-width: 16.666667%;
   }
 
-  > [span='2'] {
+  > .col-2 {
     flex: 0 0 8.333333%;
     max-width: 8.333333%;
   }
 
-  > [span='6'] {
+  > .col-6 {
     flex: 0 0 25%;
     max-width: 25%;
   }

buyer/src/pages/home/memberCenter/ComplainDetail.vue

@@ -122,6 +122,7 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import { View } from '@element-plus/icons-vue';
 import {getComplainDetail} from '@/api/member.js';
 import {communication} from '@/api/order';
@@ -170,7 +171,7 @@ export default {
     // 回复消息
     handleSubmit () {
       if (this.params.content === '') {
-        this.$Message.error('请填写对话内容');
+        Message.error('请填写对话内容');
         return;
       }
       this.submitLoading = true;
@@ -178,7 +179,7 @@ export default {
       communication(this.params).then((res) => {
         this.submitLoading = false;
         if (res.success) {
-          this.$Message.success('对话成功');
+          Message.success('对话成功');
           this.params.content = '';
           this.getDetail();
         }

buyer/src/pages/home/memberCenter/ComplainList.vue

@@ -5,11 +5,11 @@
     <div class="order">
       <div class="order-title">
         <div class="order-row title">
-          <div span="10" class="order-detail-title">商品信息</div>
+          <div class="order-detail-title col-10">商品信息</div>
-          <div span="4">投诉状态</div>
+          <div class="col-4">投诉状态</div>
-          <div span="4">投诉主题</div>
+          <div class="col-4">投诉主题</div>
-          <div span="4">投诉内容</div>
+          <div class="col-4">投诉内容</div>
-          <div span="2"></div>
+          <div class="col-2"></div>
         </div>
       </div>
       <empty v-if="list.length === 0" />
@@ -23,7 +23,7 @@
             <span class="hover-pointer fontsize_12 eval-detail" style="right: 90px" v-if="item.complainStatus === 'APPLYING' || item.complainStatus === 'NEW'" @click="cancel(item.id)">取消投诉</span>
           </div>
           <div class="order-item-view">
-            <div span="10" class="item-view-name">
+            <div class="item-view-name col-10">
               <div class="order-img hover-color" @click="linkTo(`/goodsDetail?goodsId=${item.goodsId}&skuId=${item.skuId}`)">
                 <img :src="item.goodsImage" alt="" />
               </div>
@@ -31,11 +31,11 @@
                 {{item.goodsName}}
               </div>
             </div>
-            <div span="4">{{statusLabel[item.complainStatus]}}</div>
+            <div class="col-4">{{statusLabel[item.complainStatus]}}</div>
-            <div span="4">
+            <div class="col-4">
               <div class="content">{{item.complainTopic}}</div>
             </div>
-            <div span="4">
+            <div class="col-4">
               <el-tooltip>
                 <div class="content">{{item.content}}</div>
                 <template #content>
@@ -45,7 +45,7 @@
                 </template>
               </el-tooltip>
             </div>
-            <div span="2"></div>
+            <div class="col-2"></div>
           </div>
         </div>
       </div>
@@ -53,15 +53,16 @@
     </div>
     <!-- 分页 -->
     <div class="page-size">
-      <el-pagination :total="total" @current-change="changePageNum"
+      <el-pagination v-model:current-page="params.pageNumber" v-model:page-size="params.pageSize"
-        @size-change="changePageSize"
+        :total="total" @current-change="changePageNum"
-        :page-size="params.pageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
+        @size-change="changePageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
     </div>
     </UserCenterLayout>
   </div>
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import {complainList, clearComplain} from '@/api/member.js';
 export default {
   name: 'ComplainList',
@@ -107,13 +108,13 @@ export default {
       this.getList()
     },
     cancel (id) { // 取消投诉
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '取消投诉',
         content: '确定取消投诉吗？',
         onOk: () => {
           clearComplain(id).then((res) => {
             if (res.success) {
-              this.$Message.success('取消投诉成功');
+              Message.success('取消投诉成功');
               this.getList();
             }
           });
@@ -167,22 +168,22 @@ export default {
   display: flex;
   align-items: center;
 
-  > [span] {
+  > [class*='col-'] {
     box-sizing: border-box;
     padding: 0 8px;
   }
 
-  > [span='10'] {
+  > .col-10 {
     flex: 0 0 41.666667%;
     max-width: 41.666667%;
   }
 
-  > [span='4'] {
+  > .col-4 {
     flex: 0 0 16.666667%;
     max-width: 16.666667%;
   }
 
-  > [span='2'] {
+  > .col-2 {
     flex: 0 0 8.333333%;
     max-width: 8.333333%;
   }

buyer/src/pages/home/memberCenter/Distribution.vue

@@ -99,11 +99,13 @@
             </el-table-column>
           </el-table>
           <div class="page-size">
-            <el-pagination               :current-page="params.pageNumber"
+            <el-pagination               v-model:current-page="params.pageNumber"
               :total="goodsData.total"
-              :page-size="params.pageSize"
+              v-model:page-size="params.pageSize"
+              :page-sizes="[10, 20, 50]"
               @current-change="changePage"
-             layout="total, prev, pager, next, jumper"></el-pagination>
+              @size-change="changePageSize"
+             layout="total, sizes, prev, pager, next, jumper"></el-pagination>
           </div>
         </el-tab-pane>
         <el-tab-pane label="未选商品" name="goodsUncheck">
@@ -136,11 +138,13 @@
             </el-table-column>
           </el-table>
           <div class="page-size">
-            <el-pagination               :current-page="params.pageNumber"
+            <el-pagination               v-model:current-page="params.pageNumber"
               :total="goodsData.total"
-              :page-size="params.pageSize"
+              v-model:page-size="params.pageSize"
+              :page-sizes="[10, 20, 50]"
               @current-change="changePage"
-             layout="total, prev, pager, next, jumper"></el-pagination>
+              @size-change="changePageSize"
+             layout="total, sizes, prev, pager, next, jumper"></el-pagination>
           </div>
         </el-tab-pane>
         <el-tab-pane label="提现记录" name="log">
@@ -172,11 +176,13 @@
             </el-table-column>
           </el-table>
           <div class="page-size">
-            <el-pagination               :current-page="logParams.pageNumber"
+            <el-pagination               v-model:current-page="logParams.pageNumber"
               :total="logData.total"
-              :page-size="logParams.pageSize"
+              v-model:page-size="logParams.pageSize"
+              :page-sizes="[10, 20, 50]"
               @current-change="changePageLog"
-             layout="total, prev, pager, next, jumper"></el-pagination>
+              @size-change="changePageSizeLog"
+             layout="total, sizes, prev, pager, next, jumper"></el-pagination>
           </div>
         </el-tab-pane>
       </el-tabs>
@@ -256,6 +262,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { Edit } from '@element-plus/icons-vue';
 import {
   distribution,
@@ -268,12 +275,13 @@ import {
 import { IDCard } from "@/plugins/RegExp.js";
 import { checkBankno } from "@/plugins/Foundation";
 import vueQr from "vue-qr";
+import config from "@/config";
 export default {
   name: "Distribution",
   components: { vueQr, Edit },
   data() {
     return {
-      config:require('@/config'),
+      config,
       status: 0, // 申请状态，0为未申请 1 申请中 2 申请完成 3 功能暂未开启
       applyForm: {}, // 申请表单
       rules: {
@@ -320,18 +328,18 @@ export default {
       params: {
         // 商品请求参数
         pageNumber: 1,
-        pageSize: 20,
+        pageSize: 10,
         checked: true,
       },
       orderParams: {
         // 订单商品请求参数
         pageNumber: 1,
-        pageSize: 20,
+        pageSize: 10,
       },
       logParams: {
         // 日志参数
         pageNumber: 1,
-        pageSize: 20,
+        pageSize: 10,
         sort: "createTime",
         order: "desc",
       },
@@ -355,7 +363,7 @@ export default {
           applyDistribution(this.applyForm).then((res) => {
             this.applyLoading = false;
             if (res.success) {
-              this.$Message.success("申请已提交，请等待管理员审核");
+              Message.success("申请已提交，请等待管理员审核");
               this.status = 1;
             }
           });
@@ -377,21 +385,21 @@ export default {
     withdraw() {
       const price = Number(this.withdrawPrice);
       if (!price || price < 1) {
-        this.$Message.error('提现金额单次最少提现金额为1元');
+        Message.error('提现金额单次最少提现金额为1元');
         return;
       }
       distCash({ price: this.withdrawPrice }).then((res) => {
         if (res.success) {
           this.withdrawApplyModal = false;
           this.withdrawPrice = 0;
-          this.$Message.success('申请已提交，请等待审核');
+          Message.success('申请已提交，请等待审核');
           this.distribution();
           this.getLog();
         } else {
-          this.$Message.error(this.normalizeWithdrawError(res.message));
+          Message.error(this.normalizeWithdrawError(res.message));
         }
       }).catch((err) => {
-        this.$Message.error(this.normalizeWithdrawError(err?.message || err?.data?.message));
+        Message.error(this.normalizeWithdrawError(err?.message || err?.data?.message));
       });
     },
     qrcodeData(data64) {
@@ -437,11 +445,23 @@ export default {
       this.params.pageNumber = val;
       this.getGoodsData();
     },
+    changePageSize(val) {
+      // 修改每页条数
+      this.params.pageNumber = 1;
+      this.params.pageSize = val;
+      this.getGoodsData();
+    },
     changePageLog(val) {
       // 修改页码 日志
       this.logParams.pageNumber = val;
       this.getLog();
     },
+    changePageSizeLog(val) {
+      // 修改每页条数 日志
+      this.logParams.pageNumber = 1;
+      this.logParams.pageSize = val;
+      this.getLog();
+    },
     selectGoods(id, checked) {
       // 选择商品
       let params = {
@@ -450,7 +470,7 @@ export default {
       };
       selectDistGoods(params).then((res) => {
         if (res.success) {
-          this.$Message.success("操作成功！");
+          Message.success("操作成功！");
           this.getGoodsData();
         }
       });
@@ -479,7 +499,7 @@ export default {
       applyDistribution().then((res) => {
         this.applyLoading = false;
         if (res.success) {
-          this.$Message.success("申诉已提交，请等待管理员审核");
+          Message.success("申诉已提交，请等待管理员审核");
           // this.status = 1;
         }
       });

buyer/src/pages/home/memberCenter/Favorites.vue

@@ -79,6 +79,7 @@
 </template>
 
 <script>
+import { Modal } from "@/utils/message";
 import { collectList, cancelCollect, storeCollectList, cancelStoreCollect } from '@/api/member.js'
 export default {
   name: 'Favorites',
@@ -145,7 +146,7 @@ export default {
     },
     cancel(id) { // 取消收藏
       let typeName = this.params.type === 'GOODS' ? '商品' : '店铺'
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '取消收藏',
         content: `确定取消收藏该${typeName}吗？`,
         onOk: () => {
@@ -159,7 +160,7 @@ export default {
     },
     cancelStore(id) { // 取消收藏
       let typeName = this.params.type === 'GOODS' ? '商品' : '店铺'
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '取消收藏',
         content: `确定取消收藏该${typeName}吗？`,
         onOk: () => {

buyer/src/pages/home/memberCenter/MemberGrade.vue

@@ -67,9 +67,9 @@
         </el-table>
         <div class="grade-pagination">
           <el-pagination
-            :current-page="params.pageNumber"
+            v-model:current-page="params.pageNumber"
+            v-model:page-size="params.pageSize"
             :total="experienceLogs.total || 0"
-            :page-size="params.pageSize"
             @current-change="changePage"
             @size-change="changePageSize"
             :page-sizes="[10, 20, 50]"

buyer/src/pages/home/memberCenter/ModifyPwd.vue

@@ -74,6 +74,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { Lock } from '@element-plus/icons-vue';
 import {
   setPwd,
@@ -152,7 +153,7 @@ export default {
         if (valid) {
           const {newPassword, againPassword, password} = this.formRegister
           if (newPassword !== againPassword) {
-            this.$Message.error({
+            Message.error({
               content: '新密码和确认密码不一致'
             });
             return
@@ -162,13 +163,13 @@ export default {
           params.password = md5(password)
           editPwd(params).then(res => {
             if (res.success && res.result) {
-              this.$Message.success('修改密码成功');
+              Message.success('修改密码成功');
               this.$router.push('/home')
             } else {
-              this.$Message.error(this.normalizePwdError(res.message));
+              Message.error(this.normalizePwdError(res.message));
             }
           }).catch((err) => {
-            this.$Message.error(this.normalizePwdError(err?.message || err?.data?.message));
+            Message.error(this.normalizePwdError(err?.message || err?.data?.message));
           });
         }
       })
@@ -187,13 +188,13 @@ export default {
         if (valid) {
           const {newPassword, againPassword} = this.formDataUpdate
           if (newPassword === '') {
-            this.$Message.error({
+            Message.error({
               content: '请输入密码'
             });
             return
           }
           if (newPassword !== againPassword) {
-            this.$Message.error({
+            Message.error({
               content: '新密码和确认密码不一致'
             });
             return
@@ -202,7 +203,7 @@ export default {
           params.password = md5(newPassword)
           setPwd(params).then(res => {
             if (res.message === 'success' && res.result) {
-              this.$Message.success('支付密码设置成功');
+              Message.success('支付密码设置成功');
               this.$router.push('/home')
             }
           });

buyer/src/pages/home/memberCenter/Point.vue

@@ -20,9 +20,9 @@
     <!-- 分页 -->
     <div class="point-pagination">
       <el-pagination
-        :current-page="params.pageNumber"
+        v-model:current-page="params.pageNumber"
+        v-model:page-size="params.pageSize"
         :total="logData.total"
-        :page-size="params.pageSize"
         @current-change="changePage"
         @size-change="changePageSize"
         :page-sizes="[10, 20, 50]"

buyer/src/pages/home/memberCenter/Profile.vue

@@ -45,6 +45,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import { editMemberInfo } from '@/api/account.js';
 import { commonUrl } from '@/plugins/request.js';
 import storage from '@/plugins/storage.js';
@@ -104,7 +105,7 @@ export default {
           }
           editMemberInfo(params).then(res => {
             if (res.success) {
-              this.$Message.success('修改个人资料成功')
+              Message.success('修改个人资料成功')
               storage.setItem('userInfo', res.result)
               this.$router.go(0)
             }

buyer/src/pages/home/memberCenter/evaluation/AddEval.vue

@@ -75,6 +75,7 @@
   </div>
 </template>
 <script>
+import { Message, Notice } from "@/utils/message";
 import { Camera, Delete, View } from '@element-plus/icons-vue';
 import { orderDetail } from '@/api/order.js';
 import { addEvaluation } from '@/api/member.js';
@@ -109,17 +110,17 @@ export default {
     },
     save () { // 保存评价
       if (!this.form.serviceScore || !this.form.deliveryScore) {
-        this.$Message.warning('物流服务评价不能为空')
+        Message.warning('物流服务评价不能为空')
         return false;
       }
 
       if (!this.form.descriptionScore) {
-        this.$Message.warning('描述评价不能为空')
+        Message.warning('描述评价不能为空')
         return false;
       }
 
       if (!this.orderGoods.content || !String(this.orderGoods.content).trim()) {
-        this.$Message.warning('评论内容不能为空')
+        Message.warning('评论内容不能为空')
         return false;
       }
 
@@ -139,14 +140,14 @@ export default {
       addEvaluation(params).then(res => {
         this.loading = false
         if (res.success) {
-          this.$Message.success('评价成功')
+          Message.success('评价成功')
           this.$router.push('/home/CommentList')
         } else {
-          this.$Message.error(res.message || '评价失败，请稍后重试')
+          Message.error(res.message || '评价失败，请稍后重试')
         }
       }).catch((err) => {
         this.loading = false;
-        this.$Message.error(err?.message || '评价失败，请稍后重试')
+        Message.error(err?.message || '评价失败，请稍后重试')
       })
     },
     goGoodsDetail (skuId, goodsId) { // 跳转商品详情
@@ -171,7 +172,7 @@ export default {
     handleBeforeUpload () { // 上传之前钩子
       const check = this.orderGoods.uploadList.length < 9;
       if (!check) {
-        this.$Notice.warning({
+        Notice.warning({
           title: '最多可以上传九张图片'
         });
         return check;

buyer/src/pages/home/memberCenter/memberMsg/MsgList.vue

@@ -31,9 +31,9 @@
       </el-table>
       <div class="msg-pagination">
         <el-pagination
-          :current-page="params.pageNumber"
+          v-model:current-page="params.pageNumber"
+          v-model:page-size="params.pageSize"
           :total="messageData.total"
-          :page-size="params.pageSize"
           @current-change="changePage"
           @size-change="changePageSize"
           :page-sizes="[10, 20, 50]"
@@ -44,6 +44,7 @@
   </div>
 </template>
 <script>
+import { Message, Modal } from "@/utils/message";
 import {memberMsgList, readMemberMsg, delMemberMsg} from '@/api/member.js'
 export default {
   data() {
@@ -94,19 +95,17 @@ export default {
       })
     },
     removeMessage (id) {
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '确认删除',
         content: '确认要删除此消息?',
         loading: true,
-        onOk: () => {
+        onOk: () =>
           delMemberMsg(id).then((res) => {
-            this.$Modal.remove();
             if (res.success) {
-              this.$Message.success('消息已成功放入回收站');
+              Message.success('消息已成功放入回收站');
               this.getList();
             }
-          });
+          }),
-        },
       });
     }
   },

buyer/src/pages/home/orderCenter/AfterSale.vue

@@ -70,9 +70,9 @@
     </div>
     <!-- 分页 -->
     <div class="page-size">
-      <el-pagination :total="total" @current-change="changePageNum"
+      <el-pagination v-model:current-page="params.pageNumber" v-model:page-size="params.pageSize"
-            @size-change="changePageSize"
+        :total="total" @current-change="changePageNum"
-            :page-size="params.pageSize" layout="sizes, prev, pager, next, jumper"></el-pagination>
+            @size-change="changePageSize" layout="sizes, prev, pager, next, jumper"></el-pagination>
     </div>
     </UserCenterLayout>
     <el-dialog v-model="logisticsShow" width="530">
@@ -123,6 +123,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import {afterSaleList, cancelAfterSale} from '@/api/member.js';
 import {afterSaleDelivery, getLogisticsCompany} from '@/api/order.js';
 import {afterSaleStatusList} from '../enumeration.js'
@@ -171,13 +172,13 @@ export default {
       })
     },
     cancel(sn) { // 取消售后申请
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '取消',
         content: '确定取消此次售后申请吗？',
         onOk: () => {
           cancelAfterSale(sn).then(res => {
             if (res.success) {
-              this.$Message.success('取消售后申请成功')
+              Message.success('取消售后申请成功')
               this.getList()
             }
           })
@@ -244,7 +245,7 @@ export default {
         afterSaleDelivery(this.form).then(res => {
           if (res.success) {
             this.logisticsShow = false;
-            this.$Message.success('提交成功');
+            Message.success('提交成功');
             this.getList();
           }
           this.submitLoading = false;

buyer/src/pages/home/orderCenter/AfterSaleDetail.vue

@@ -114,6 +114,7 @@
   </div>
 </template>
 <script>
+import { Message, Modal } from "@/utils/message";
 import { afterSaleDetail, afterSaleLog, afterSaleReason, cancelAfterSale } from '@/api/member.js';
 import { afterSaleDelivery, getLogisticsCompany } from '@/api/order.js';
 import { afterSaleStatusList } from '../enumeration.js'
@@ -182,13 +183,13 @@ export default {
       window.open(img, '_blank')
     },
     cancel (sn) { // 取消售后申请
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '取消',
         content: '<p>确定取消此次售后申请吗？</p>',
         onOk: () => {
           cancelAfterSale(sn).then(res => {
             if (res.success) {
-              this.$Message.success('取消售后申请成功')
+              Message.success('取消售后申请成功')
               this.getDetail()
             }
           })
@@ -210,7 +211,7 @@ export default {
       afterSaleDelivery(this.form).then(res => {
         if (res.success) {
           this.logisticsShow = false;
-          this.$Message.success('提交成功')
+          Message.success('提交成功')
           this.getDetail()
         }
         this.submitLoading = false

buyer/src/pages/home/orderCenter/ApplyAfterSale.vue

@@ -102,6 +102,7 @@
   </div>
 </template>
 <script>
+import { Message, Notice } from "@/utils/message";
 import { Camera, Delete, View } from '@element-plus/icons-vue';
 import { afterSaleReason, afterSaleInfo, applyAfterSale } from '@/api/member.js'
 import { commonUrl } from '@/plugins/request.js';
@@ -186,7 +187,7 @@ export default {
           params.reason = this.reasonList.find(item => item.id == params.reason).reason
           applyAfterSale(params).then(res => {
             if (res.success) {
-              this.$Message.success('售后申请提交成功，请到售后订单查看！')
+              Message.success('售后申请提交成功，请到售后订单查看！')
               this.$router.push({name: 'AfterSale'})
             }
           })
@@ -208,7 +209,7 @@ export default {
     handleBeforeUpload () { // 上传之前钩子函数
       const check = this.uploadList.length < 6;
       if (!check) {
-        this.$Notice.warning({
+        Notice.warning({
           title: '最多可以上传5张图片'
         });
         return check;

buyer/src/pages/home/orderCenter/Complain.vue

@@ -62,6 +62,7 @@
   </div>
 </template>
 <script>
+import { Message, Notice } from "@/utils/message";
 import { Camera, Delete, View } from '@element-plus/icons-vue';
 import { orderDetail } from '@/api/order.js';
 import { afterSaleReason, handleComplain } from '@/api/member.js';
@@ -111,7 +112,7 @@ export default {
       }
       handleComplain(params).then(res => {
         if (res.success) {
-          this.$Message.success('投诉申请已提交，感谢您的反馈')
+          Message.success('投诉申请已提交，感谢您的反馈')
           this.$router.push({name: 'ComplainList'})
         }
       })
@@ -138,7 +139,7 @@ export default {
     handleBeforeUpload () { // 上传之前钩子函数
       const check = this.orderGoods.uploadList.length < 6;
       if (!check) {
-        this.$Notice.warning({
+        Notice.warning({
           title: '最多可以上传五张图片'
         });
         return check;

buyer/src/pages/home/orderCenter/MyAddress.vue

@@ -36,6 +36,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import { Delete, Edit } from '@element-plus/icons-vue';
 import { memberAddress, delMemberAddress } from '@/api/address.js';
 
@@ -58,19 +59,19 @@ export default {
     },
     del (id) {
       // 删除地址
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '提示',
         content: '你确定删除这个收货地址',
         onOk: () => {
           delMemberAddress(id).then((res) => {
             if (res.success) {
-              this.$Message.success('删除成功');
+              Message.success('删除成功');
               this.getAddrList();
             }
           });
         },
         onCancel: () => {
-          this.$Message.info('取消删除');
+          Message.info('取消删除');
         }
       });
     },

buyer/src/pages/home/orderCenter/MyOrder.vue

@@ -83,9 +83,9 @@
 
       <!-- 分页 -->
       <div class="page-size">
-        <el-pagination :total="total" @current-change="changePageNum"
+        <el-pagination v-model:current-page="params.pageNumber" v-model:page-size="params.pageSize"
-          @size-change="changePageSize"
+          :total="total" @current-change="changePageNum"
-          :page-size="params.pageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
+          @size-change="changePageSize" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
       </div>
     </UserCenterLayout>
 
@@ -176,6 +176,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import { getOrderList, sureReceived, cancelOrder, delOrder } from '@/api/order';
 import { afterSaleReason } from '@/api/member';
 import { orderStatusList } from '../enumeration.js'
@@ -276,7 +277,7 @@ export default {
     received (sn) { // 确认收货
       sureReceived(sn).then(res => {
         if (res.success) {
-          this.$Message.success('确认收货成功')
+          Message.success('确认收货成功')
           this.getList()
         }
       })
@@ -309,13 +310,13 @@ export default {
       this.$router.push({name: 'Complain', query: {sn, index: goodsIndex}})
     },
     delOrder (sn) { // 删除订单
-      this.$Modal.confirm({
+      Modal.confirm({
         title: '删除订单',
         content: '<p>确认删除当前订单吗？</p>',
         onOk: () => {
           delOrder(sn).then(res => {
             if (res.success) {
-              this.$Message.success('删除成功');
+              Message.success('删除成功');
               this.getList()
             }
           })
@@ -360,7 +361,7 @@ export default {
     sureCancel () { // 确定取消
       cancelOrder(this.cancelParams).then(res => {
         if (res.success) {
-          this.$Message.success('取消订单成功')
+          Message.success('取消订单成功')
           this.getList()
           this.cancelAvail = false
         }

buyer/src/pages/home/orderCenter/OrderDetail.vue

@@ -264,7 +264,8 @@
           <dd><div class="text-box">{{ order.order.sn }}</div></dd>
         </dl>
       </div>
-      <div v-if="orderPackage.length > 0" v-for="(packageItem, packageIndex) in orderPackage" :key="packageIndex">
+      <template v-if="orderPackage.length > 0">
+      <div v-for="(packageItem, packageIndex) in orderPackage" :key="packageIndex">
         <div class="layui-layer-wrap">
           <dl><dt>物流公司：</dt>
             <dd><div class="text-box">{{ packageItem.logisticsName }}</div></dd>
@@ -292,6 +293,7 @@
           </div>
         </div>
       </div>
+      </template>
       <div v-if = "orderPackage.length == 0 && logistics">
         <div class="layui-layer-wrap">
           <dl>
@@ -322,6 +324,7 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import {
   orderDetail,
   getTraces,
@@ -390,7 +393,7 @@ export default {
     viewReceiptInvoice (receipt) {
       const invoiceAddress = this.getInvoiceAddress(receipt);
       if (!invoiceAddress) {
-        this.$Message.warning("暂无发票附件");
+        Message.warning("暂无发票附件");
         return;
       }
       window.open(invoiceAddress, "_blank");
@@ -477,7 +480,7 @@ export default {
       // 确认收货
       sureReceived(sn).then((res) => {
         if (res.success) {
-          this.$Message.success("确认收货成功");
+          Message.success("确认收货成功");
           this.getDetail();
         }
       });
@@ -519,7 +522,7 @@ export default {
       // 确定取消
       cancelOrder(this.cancelParams).then((res) => {
         if (res.success) {
-          this.$Message.success("取消订单成功");
+          Message.success("取消订单成功");
           this.getDetail();
           this.cancelAvail = false;
         }
@@ -695,15 +698,15 @@ table {
 .layui-layer-wrap > .div-express-log {
   max-height: 300px;
 }
-:deep .layui-layer-wrap > .div-express-log::-webkit-scrollbar{
+:deep(.layui-layer-wrap > .div-express-log::-webkit-scrollbar){
   width: 1px;
   height: 5px;
 }
-:deep .layui-layer-wrap > .div-express-log::-webkit-scrollbar-thumb{
+:deep(.layui-layer-wrap > .div-express-log::-webkit-scrollbar-thumb){
   border-radius: 1em;
   background-color: rgba(50,50,50,.3);
 }
-:deep .layui-layer-wrap > .div-express-log::-webkit-scrollbar-track{
+:deep(.layui-layer-wrap > .div-express-log::-webkit-scrollbar-track){
   border-radius: 1em;
   background-color: rgba(50,50,50,.1);
 }
@@ -727,7 +730,6 @@ table {
 
   .time {
     width: 30%;
-    display: inline-block;
     float: left;
   }
 

buyer/src/pages/home/userCenter/Coupons.vue

@@ -37,10 +37,11 @@
       </ul>
       <div class="pageration">
         <el-pagination
+          v-model:current-page="params.pageNumber"
+          v-model:page-size="params.pageSize"
           :total="total"
           @current-change="changePageNum"
           @size-change="changePageSize"
-          :page-size="params.pageSize"
           layout="total, sizes, prev, pager, next, jumper"
         />
       </div>

buyer/src/pages/home/userCenter/MoneyManagement.vue

@@ -102,8 +102,8 @@
         </el-table>
         <!-- 分页 -->
         <div class="page-size">
-          <el-pagination             :current-page="walletForm.pageNumber"
+          <el-pagination             v-model:current-page="walletForm.pageNumber"
-            :page-size="walletForm.pageSize"
+            v-model:page-size="walletForm.pageSize"
             :page-sizes="[10, 20, 50]"
             :total="logColumnsData.total"
             @current-change="changePage"
@@ -140,8 +140,8 @@
         </el-table>
         <!-- 分页 -->
         <div class="page-size">
-          <el-pagination             :current-page="rechargeForm.pageNumber"
+          <el-pagination             v-model:current-page="rechargeForm.pageNumber"
-            :page-size="rechargeForm.pageSize"
+            v-model:page-size="rechargeForm.pageSize"
             :page-sizes="[10, 20, 50]"
             :total="rechargeListData.total"
             @current-change="rechargeChangePage"
@@ -174,8 +174,8 @@
         </el-table>
         <!-- 分页 -->
         <div class="page-size">
-          <el-pagination             :current-page="withdrawApplyForm.pageNumber"
+          <el-pagination             v-model:current-page="withdrawApplyForm.pageNumber"
-            :page-size="withdrawApplyForm.pageSize"
+            v-model:page-size="withdrawApplyForm.pageSize"
             :page-sizes="[10, 20, 50]"
             :total="withdrawApplyColumnsListData.total"
             @current-change="withdrawChangePage"
@@ -189,6 +189,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import {getDepositLog, getMembersWallet, getRecharge, getWithdrawApply, recharge, withdrawalApply} from '@/api/member';
 import {withdrawalSettingVO} from "@/api/pay";
 import { Edit } from '@element-plus/icons-vue';
@@ -398,7 +399,7 @@ export default {
         if (valid) {
           withdrawalApply(this.withdrawApplyFormData).then((res) => {
             if (res && res.success) {
-              this.$Message.success('提现申请成功，关注提现状态');
+              Message.success('提现申请成功，关注提现状态');
               this.withdrawApplyModal = false;
               this.init(); // 余额查询
               this.getWithdrawApplyData(); // 提现记录

buyer/src/pages/home/userCenter/MyGiftCards.vue

@@ -73,8 +73,8 @@
     </div>
 
     <div class="page-size">
-      <el-pagination         :current-page="params.pageNumber"
+      <el-pagination         v-model:current-page="params.pageNumber"
-        :page-size="params.pageSize"
+        v-model:page-size="params.pageSize"
         :page-sizes="[10, 20, 50]"
         :total="total"
         @current-change="changePage"
@@ -82,7 +82,7 @@
        layout="total, sizes, prev, pager, next, jumper" />
     </div>
 
-    <el-dialog v-model="noticeModal" title="使用须知" footer-hide width="520">
+    <el-dialog v-model="noticeModal" title="使用须知" width="520">
       <p class="gcc-notice-text">
         请在有效期内使用本礼品卡；消费时将优先使用卡内余额。具体使用范围以活动规则为准。如有疑问请联系客服。
       </p>
@@ -94,6 +94,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import {
   getGiftCardCashMemberCardPage,
   bindGiftCardCashMemberCard,
@@ -231,7 +232,7 @@ export default {
           .then((res) => {
             this.bindSubmitting = false;
             if (res.success) {
-              this.$Message.success(res.message || "兑换成功");
+              Message.success(res.message || "兑换成功");
               this.resetBindForm();
               this.params.pageNumber = 1;
               this.getList();
@@ -249,14 +250,14 @@ export default {
       if (this.statusTab === "PENDING_ACTIVATION") {
         const memberCardId = this.resolveMemberCardId(item);
         if (!memberCardId) {
-          this.$Message.error("卡片信息异常，无法激活");
+          Message.error("卡片信息异常，无法激活");
           return;
         }
         this.activatingId = memberCardId;
         activateGiftCardCashMemberCard(memberCardId)
           .then((res) => {
             if (res.success) {
-              this.$Message.success(res.message || "激活成功");
+              Message.success(res.message || "激活成功");
               this.getList();
             }
           })

buyer/src/pages/home/userCenter/MyTracks.vue

@@ -23,9 +23,9 @@
     <!-- 分页 -->
     <div class="page-size">
       <el-pagination
+        v-model:current-page="params.pageNumber"
+        v-model:page-size="params.pageSize"
         :total="total"
-        :current-page="params.pageNumber"
-        :page-size="params.pageSize"
         :page-sizes="[10, 20, 30, 40, 50, 100]"
         layout="sizes, prev, pager, next, jumper"
         @current-change="changePageNum"
@@ -37,6 +37,7 @@
 </template>
 
 <script>
+import { Message, Modal } from "@/utils/message";
 import { Delete } from '@element-plus/icons-vue';
 import { tracksList, clearTracks, clearTracksById } from "@/api/member";
 export default {
@@ -77,13 +78,13 @@ export default {
     },
     clearAll() {
       // 清除全部足迹
-      this.$Modal.confirm({
+      Modal.confirm({
         title: "删除",
         content: "<p>确定要删除全部足迹吗？</p>",
         onOk: () => {
           clearTracks().then((res) => {
             if (res.success) {
-              this.$Message.success("删除成功");
+              Message.success("删除成功");
               this.getList();
             }
           });
@@ -95,7 +96,7 @@ export default {
       // 清除全部足迹
       clearTracksById(id).then((res) => {
         if (res.success) {
-          this.$Message.success("删除成功");
+          Message.success("删除成功");
           this.getList();
         }
       });

buyer/src/pages/payment/Pay.vue

@@ -299,7 +299,7 @@
     <invoice-modal ref="invModal" :invoiceData="invoiceData" @change="getInvMsg" />
     <!-- 选择地址模态框 -->
     <address-manage ref="address" :id="addrId" @change="addrChange"></address-manage>
-    <el-dialog v-model="giftCardNoticeModal" title="礼品卡使用说明" footer-hide width="520">
+    <el-dialog v-model="giftCardNoticeModal" title="礼品卡使用说明" width="520">
       <p class="pay-gcc-notice-p">
         请在礼品卡有效期内使用；结算时勾选礼品卡即可按规则抵扣订单金额，可与优惠券等活动叠加规则以平台说明为准。放弃勾选或取消抵扣将恢复对应余额。
       </p>
@@ -310,6 +310,7 @@
 </template>
 
 <script>
+import { Message, Modal, Spin } from "@/utils/message";
 import { ArrowDown, ArrowUp, Check, Help, Plus, Warning } from '@element-plus/icons-vue';
 import invoiceModal from "@/components/invoiceModal";
 import addressManage from "@/components/addressManage";
@@ -487,17 +488,17 @@ export default {
     },
     getGoodsDetail() {
       // 订单商品详情
-      this.$Spin.show();
+      Spin.show();
       cartGoodsPay({ way: this.$route.query.way })
         .then((res) => {
-          this.$Spin.hide();
+          Spin.hide();
           if (res.success) {
             if (
               !res.result.checkedSkuList ||
               res.result.checkedSkuList.length === 0
             ) {
               if (res.result.skuList && res.result.skuList[0]) {
-                this.$Modal.warning({
+                Modal.warning({
                   title: "购物车存在无效商品！",
                   content:
                     "[" +
@@ -545,7 +546,7 @@ export default {
                 title = e.errorMessage;
                 content.push(e.goodsSku.goodsName);
               });
-              this.$Modal.warning({
+              Modal.warning({
                 title: "以下商品超出配送区域" || title,
                 content: content.toString(),
               });
@@ -587,7 +588,7 @@ export default {
           }
         })
         .catch(() => {
-          this.$Spin.hide();
+          Spin.hide();
         });
     },
     syncGiftCardSelectionFromCart(result) {
@@ -727,7 +728,7 @@ export default {
       };
       selectAddr(params).then((res) => {
         if (res.success) {
-          this.$Message.success("选择配送方式成功");
+          Message.success("选择配送方式成功");
           this.selectMethod = item;
           this.getGoodsDetail();
         }
@@ -739,7 +740,7 @@ export default {
       // 选择自提地址
       setStoreAddressId(item.id,this.$route.query.way).then((res) => {
         if (res.success) {
-          this.$Message.success("选择自提地址成功");
+          Message.success("选择自提地址成功");
           this.selectedStoreAddress = item;
           this.getGoodsDetail();
         }
@@ -768,13 +769,13 @@ export default {
     },
     delAddress(item) {
       // 删除地址
-      this.$Modal.confirm({
+      Modal.confirm({
         title: "提示",
         content: "你确定删除这个收货地址",
         onOk: () => {
           delMemberAddress(item.id).then((res) => {
             if (res.success) {
-              this.$Message.success("删除成功");
+              Message.success("删除成功");
               this.getAddress();
             }
           });
@@ -839,10 +840,10 @@ export default {
 
       if (!params.remark.length) delete params.remark;
 
-      this.$Spin.show();
+      Spin.show();
       createTrade(params)
         .then((res) => {
-          this.$Spin.hide();
+          Spin.hide();
           if (res.success) {
             if (params.way === "POINTS") {
               // 积分支付不需要跳转支付页面
@@ -856,7 +857,7 @@ export default {
           }
         })
         .catch(() => {
-          this.$Spin.hide();
+          Spin.hide();
         });
     },
     // 优惠券可用范围

buyer/src/pages/payment/PayMent.vue

@@ -38,7 +38,7 @@
 <script>
 
 import {tradeDetail, pay} from '@/api/pay.js';
-import { Message } from '@/utils/message';
+import { Message, Modal } from "@/utils/message";
 
 export default {
   data () {
@@ -98,16 +98,16 @@ export default {
       params.paymentClient = 'NATIVE';
       params.price = this.payDetail.price;
       if (way === 'WALLET') {
-        this.$Modal.confirm({
+        Modal.confirm({
           title: '支付确认',
           content: '确认使用余额支付吗？',
           onOk: () => {
             pay(params).then(res => {
               if (res.success) {
-                this.$Message.success(res.message)
+                Message.success(res.message)
                 this.$router.push('/payDone');
               } else {
-                this.$Message.warning(res.message)
+                Message.warning(res.message)
               }
             })
           }

buyer/src/pages/payment/ThirdPay.vue

@@ -33,6 +33,7 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import { Iphone } from '@element-plus/icons-vue';
 import vueQr from 'vue-qr';
 import { payCallback, pay } from '@/api/pay.js';
@@ -56,7 +57,7 @@ export default {
           this.num = 0;
           this.interval = setInterval(this.callback, 5000);
         } else {
-          this.$Message.error(res.message)
+          Message.error(res.message)
         }
       });
     },

buyer/src/pages/promotion/PointGoodsDetail.vue

@@ -85,6 +85,7 @@
 </template>
 
 <script>
+import { Message } from "@/utils/message";
 import Search from '@/components/Search';
 import { addCartGoods } from '@/api/cart.js';
 import { pointGoodsDetail } from '@/api/promotion';
@@ -121,7 +122,7 @@ export default {
           this.goodsMsg = res.result;
           this.goodsSku = res.result.goodsSku
         } else {
-          this.$Message.error(res.message)
+          Message.error(res.message)
           this.$router.push('/')
         }
       }).catch(() => {
@@ -140,7 +141,7 @@ export default {
         if (res.success) {
           this.$router.push({path: '/pay', query: {way: params.cartType}});
         } else {
-          this.$Message.warning(res.message);
+          Message.warning(res.message);
         }
       }).catch(() => {
         this.loading = false;

buyer/src/pages/promotion/PointMall.vue

@@ -37,9 +37,9 @@
       </div>
     </div>
     <div class="page-size">
-      <el-pagination :total="total" @current-change="changePageNum"
+      <el-pagination v-model:current-page="params.pageNumber" v-model:page-size="params.pageSize"
-        @size-change="changePageSize"
+        :total="total" @current-change="changePageNum"
-        :page-size="params.pageSize" layout="total, sizes, prev, pager, next"></el-pagination>
+        @size-change="changePageSize" layout="total, sizes, prev, pager, next"></el-pagination>
     </div>
     <BaseFooter></BaseFooter>
   </div>

buyer/src/pages/shopEntry/FirstApply.vue

@@ -191,6 +191,7 @@
   </div>
 </template>
 <script>
+import { Message, Notice } from "@/utils/message";
 import { Delete, View } from '@element-plus/icons-vue';
 import { applyFirst } from '@/api/shopentry';
 import * as RegExp from '@/plugins/RegExp.js';
@@ -320,7 +321,7 @@ export default {
     beforeUpload (file) {
       this.uploadLoading = true;
       if (this.form.licencePhoto.length >= 1) {
-        this.$Message.warning('最多上传一张图片')
+        Message.warning('最多上传一张图片')
         this.uploadLoading = false;
         return false;
       }
@@ -330,7 +331,7 @@ export default {
     beforeUpload1 (file) {
       this.uploadLoading1 = true;
       if (this.form.legalPhoto.length >= 2) {
-        this.$Message.warning('最多上传两张图片')
+        Message.warning('最多上传两张图片')
         this.uploadLoading1 = false;
         return false;
       }
@@ -343,13 +344,13 @@ export default {
       if (!isAllowedType) {
         this.uploadLoading = false;
         this.uploadLoading1 = false;
-        this.$Message.warning('上传文件格式不正确');
+        Message.warning('上传文件格式不正确');
         return false;
       }
       if (!isLt2M) {
         this.uploadLoading = false;
         this.uploadLoading1 = false;
-        this.$Message.warning('文件大小不能超过2M');
+        Message.warning('文件大小不能超过2M');
         return false;
       }
       return true;
@@ -373,7 +374,7 @@ export default {
     handleFormatError (file) {
       this.uploadLoading = false;
       this.uploadLoading1 = false;
-      this.$Notice.warning({
+      Notice.warning({
         title: 'The file format is incorrect',
         desc: '上传文件格式不正确'
       });
@@ -382,7 +383,7 @@ export default {
     handleMaxSize (file) {
       this.uploadLoading = false;
       this.uploadLoading1 = false;
-      this.$Notice.warning({
+      Notice.warning({
         title: 'Exceeding file size limit',
         desc: '文件大小不能超过2M'
       });

buyer/src/pages/shopEntry/ShopEntry.vue

@@ -42,7 +42,7 @@
         v-if="storeDisable === 'REFUSED' && currentIndex === 3">重新申请</el-button>
     </div>
 
-    <el-dialog title="店铺入驻协议" v-model="showAgreement" width="1200" :closable="false" :close-on-click-modal="false">
+    <el-dialog title="店铺入驻协议" v-model="showAgreement" width="1200" :show-close="false" :close-on-click-modal="false">
       <div class="agreement-scroll">
         <div class="agreeent-con" v-html="agreementCon"></div>
       </div>
@@ -211,7 +211,7 @@ export default {
 }
 .agreeent-con {
   max-height: 500px;
-  :deep img{
+  :deep(img){
     max-width: 100%;
 
   }

buyer/src/pages/shopEntry/ThirdApply.vue

@@ -93,6 +93,7 @@
   </div>
 </template>
 <script>
+import { Message } from "@/utils/message";
 import { Delete, View } from '@element-plus/icons-vue';
 import { applyThird } from '@/api/shopentry';
 import { getCategory } from '@/api/goods';
@@ -153,7 +154,6 @@ export default {
             .then((res) => {
               this.loading = false;
               if (res.success) this.$emit('change', 3);
-              this.$parent.getData('next');
             })
             .catch(() => {
               this.loading = false;
@@ -167,7 +167,7 @@ export default {
     beforeUpload (file) {
       this.uploadLoading = true;
       if (this.form.storeLogo.length >= 1) {
-        this.$Message.warning('最多上传一张图片')
+        Message.warning('最多上传一张图片')
         this.uploadLoading = false;
         return false;
       }
@@ -179,12 +179,12 @@ export default {
       const isLt2M = file.size / 1024 / 1024 < 2;
       if (!isAllowedType) {
         this.uploadLoading = false;
-        this.$Message.warning('上传文件格式不正确');
+        Message.warning('上传文件格式不正确');
         return false;
       }
       if (!isLt2M) {
         this.uploadLoading = false;
-        this.$Message.warning('文件大小不能超过2M');
+        Message.warning('文件大小不能超过2M');
         return false;
       }
       return true;

buyer/src/router/index.js

@@ -2,6 +2,7 @@ import { createRouter, createWebHistory } from "vue-router";
 import NProgress from "nprogress";
 import "nprogress/nprogress.css";
 import Index from "@/pages/Index";
+import config from "@/config";
 
 const Login = () => import("@/pages/Login");
 const SignUp = () => import("@/pages/SignUp");
@@ -55,7 +56,7 @@ const Merchant = () => import("@/pages/Merchant");
 const topic = () => import("@/pages/Topic");
 const ShopEntry = () => import("@/pages/shopEntry/ShopEntry");
 
-const { title } = require("@/config");
+const { title } = config;
 
 NProgress.configure({ showSpinner: false });
 

buyer/src/utils/message.js

@@ -63,11 +63,42 @@ export const Notice = {
 export const Modal = {
   confirm(options = {}) {
     const content = options.content || options.title || "确认操作？";
-    return ElMessageBox.confirm(content, options.title || "提示", {
+    const title = options.title || "提示";
+    const boxOptions = {
       confirmButtonText: options.okText || "确定",
       cancelButtonText: options.cancelText || "取消",
       type: options.type || "warning",
-    })
+    };
+
+    if (options.loading) {
+      return ElMessageBox.confirm(content, title, {
+        ...boxOptions,
+        beforeClose: (action, instance, done) => {
+          if (action !== "confirm") {
+            if (typeof options.onCancel === "function") {
+              options.onCancel();
+            }
+            done();
+            return;
+          }
+          if (typeof options.onOk !== "function") {
+            done();
+            return;
+          }
+          instance.confirmButtonLoading = true;
+          Promise.resolve(options.onOk())
+            .then(() => {
+              instance.confirmButtonLoading = false;
+              done();
+            })
+            .catch(() => {
+              instance.confirmButtonLoading = false;
+            });
+        },
+      });
+    }
+
+    return ElMessageBox.confirm(content, title, boxOptions)
       .then(() => {
         if (typeof options.onOk === "function") {
           return options.onOk();

buyer/src/vuex/store.js

@@ -1,15 +1,14 @@
 import { createStore } from "vuex";
 import * as actions from "./actions";
 import * as mutations from "./mutations";
-import * as getters from "./getters";
 import storage from "@/plugins/storage.js";
+import defaultLogo from "@/assets/images/logo2.png";
 
 export default createStore({
   state: {
     navList: [],
     cartNum: storage.getItem("cartNum") || 0,
-    logoImg:
+    logoImg: storage.getItem("logoImg") || defaultLogo,
-      storage.getItem("logoImg") || require("@/assets/images/logo2.png"),
     siteName: storage.getItem("siteName") || "lilishop",
     hotWordsList: storage.getItem("hotWordsList"),
     category: (() => {
@@ -21,7 +20,6 @@ export default createStore({
       }
     })(),
   },
-  getters,
   actions,
   mutations,
 });