主题色

src/components/auction/asset.vue

@@ -486,7 +486,7 @@ export default {
         width: 94px;
         height: 32px;
         color: #000;
-        background: linear-gradient(48deg, @prim 0%, @warn 100%);
+        background: linear-gradient(48deg, var(--prim) 0%, @warn 100%);
         border-radius: 4px;
         &.prim {
             background: #202122;
@@ -526,9 +526,9 @@ export default {
         .name2 {
             font-size: @font2;
             font-weight: 400;
-            color: @prim;
+            color: var(--prim);
             line-height: 24px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: linear-gradient(135deg, var(--prim) 0%, @warn 100%);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
         }
@@ -536,7 +536,7 @@ export default {
     .price {
         font-size: 36px;
         font-family: OSP;
-        color: @prim;
+        color: var(--prim);
         line-height: 36px;
         transform: translateY(3px);
 
@@ -593,11 +593,11 @@ export default {
                     display: inline-block;
                     padding: 0 12px;
                     &:first-child {
-                        background-color: @prim;
+                        background-color: var(--prim);
                         color: #fff;
                     }
                     &:last-child {
-                        color: @prim;
+                        color: var(--prim);
                         background-color: #27272b;
                     }
                 }
@@ -635,9 +635,9 @@ export default {
         }
         .van-button {
             font-size: @font2;
-            color: @prim;
+            color: var(--prim);
             line-height: 24px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: linear-gradient(135deg, var(--prim) 0%, @warn 100%);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
             border-width: 0px;
@@ -753,7 +753,7 @@ export default {
             }
         }
         .text4 {
-            color: @prim;
+            color: var(--prim);
             &.prim {
                 color: @text3;
             }
@@ -770,16 +770,16 @@ export default {
     width: 100%;
     display: block;
     height: 52px;
-    background: linear-gradient(135deg, @prim 0%, @warn 100%);
+    background: linear-gradient(135deg, var(--prim) 0%, @warn 100%);
     border-radius: 8px;
     border-width: 0;
     color: #000;
     &:hover {
-        background: linear-gradient(135deg, darken(@prim, 10%), darken(@warn, 10%));
+        background: var(--darkPrim);
     }
 
     &.used {
-        background: linear-gradient(135deg, darken(@prim, 50%), darken(@warn, 50%));
+        background: var(--darkPrim);
         color: @text3;
     }
 }
@@ -812,7 +812,7 @@ export default {
 }
 .qiaohua {
     border-radius: 4px;
-    background: linear-gradient(45deg, @prim, @warn);
+    background: linear-gradient(45deg, var(--prim), @warn);
     position: relative;
     width: 94px;
     display: flex;
@@ -827,7 +827,7 @@ export default {
         z-index: 1;
     }
     .text4 {
-        color: @prim;
+        color: var(--prim);
         &.prim {
             color: @text3;
         }
@@ -871,7 +871,7 @@ export default {
     justify-content: center;
     flex-direction: column;
     position: relative;
-    background: linear-gradient(135deg, @prim, @warn);
+    background: linear-gradient(135deg, var(--prim), @warn);
     margin-right: 20px;
     box-sizing: border-box;
     min-width: 94px;
@@ -947,7 +947,7 @@ export default {
         position: relative;
         min-height: 38px;
         .van-button--primary {
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: linear-gradient(135deg, var(--prim) 0%, @warn 100%);
             color: @btnText;
             font-size: @font2;
             border-width: 0px;
@@ -1067,7 +1067,7 @@ export default {
     .price {
         font-size: 32px;
         font-family: OSP-DIN, OSP;
-        color: @prim;
+        color: var(--prim);
         line-height: 26px;
         display: flex;
         align-items: center;
@@ -1118,7 +1118,7 @@ export default {
     width: 94px;
     height: 30px;
     border-radius: 4px;
-    background: linear-gradient(135deg, @prim, @warn);
+    background: linear-gradient(135deg, var(--prim), @warn);
     font-size: @font1;
     color: #ffffff;
     line-height: 30px;
@@ -1152,7 +1152,7 @@ export default {
     font-size: @font1;
     height: 42px;
     .text1 {
-        color: @prim;
+        color: var(--prim);
         width: 64px;
         margin-right: 10px;
         flex-basis: 0;

src/components/product/SaleInfo.vue

@@ -3,7 +3,7 @@
         <div class="sale-info">
             <div class="text1">当前寄售最低价格</div>
             <div class="text2">
-                <img src="../../assets/jiage_huang.png" alt="" />
+                <van-icon class-prefix="font_family" name="icon-icon_jiage" />
                 <span>{{ showInfo.price }}</span>
             </div>
         </div>
@@ -197,10 +197,14 @@ export default {
         .text2 {
             font-size: 20px;
             font-weight: bold;
-            color: @prim;
+            color: var(--prim);
             line-height: 28px;
             .flex();
             align-items: flex-end;
+            .font_family {
+                margin-bottom: 7px;
+                margin-right: 1px;
+            }
             img {
                 width: 8px;
                 height: 8px;

src/components/product/productInfo.vue

@@ -9,7 +9,8 @@
             </div>
             <div class="price-content" v-if="info.salable">
                 <div class="price">
-                    <img src="@assets/jiage_huang.png" alt="" />
+                    <!-- <img src="@assets/jiage_huang.png" alt="" /> -->
+                    <van-icon class-prefix="font_family" name="icon-icon_jiage" />
                     <span>{{ info.price }}</span>
                 </div>
                 <div class="flex1"></div>
@@ -153,13 +154,13 @@ export default {
         .price {
             font-size: @font4;
             font-family: OSP;
-            color: @prim;
+            color: var(--prim);
             line-height: 18px;
             padding: 12px 0;
-
-            img {
-                display: inline-block;
-                width: 8px;
+            .flex();
+            align-items: flex-end;
+            .font_family {
+                margin-bottom: 3px;
             }
         }
         .status {
@@ -195,7 +196,7 @@ export default {
         }
 
         .price {
-            color: #43ce00;
+            color: var(--prim);
         }
     }
 }
@@ -258,7 +259,7 @@ export default {
     top: 16px;
     left: 16px;
     font-size: @font1;
-    color: @prim;
+    color: var(--prim);
     display: flex;
     align-items: center;
     // border-radius: 13px !important;

src/components/product/productLarge.vue

@@ -142,7 +142,7 @@ export default {
     width: calc(100vw - 32px);
     margin: 8px 16px;
     position: relative;
-    background-color: #373b3e;
+    background-color: var(--bglight);
     display: inline-block;
     border-radius: 30px;
     overflow: hidden;
@@ -205,11 +205,11 @@ export default {
                 height: 20px;
                 display: inline-block;
                 &.sales-fir {
-                    background: @prim;
+                    background: var(--prim);
                     color: #000000;
                 }
-                background-color: fade(#3ab200, 16);
-                color: @prim;
+                background-color: var(--fadePrim);
+                color: var(--prim);
             }
         }
         .sales + .sales {

src/components/product/productSmall.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="product" @click="goNext(info)">
-        <van-image width="100%" height="140px" :radius="30" :src="getImg(info.pic)" fit="cover" />
+        <van-image width="100%" height="100%" :radius="30" :src="getImg(info.pic)" fit="cover" />
 
         <!-- <div class="content">
             <div class="name van-ellipsis">
@@ -37,6 +37,7 @@ export default {
     display: inline-block;
     border-radius: 30px;
     overflow: hidden;
+    height: 100%;
 
     .van-image {
         overflow: hidden;

src/main.js

@@ -5,6 +5,7 @@ import store from './store';
 import Vant from 'vant';
 import { ConfigProvider } from 'vant';
 import 'vant/lib/index.css';
+import './styles/theme.less';
 import './styles/app.less';
 import './styles/font.less';
 import http from './plugins/http';
@@ -30,7 +31,6 @@ import { Toast, Dialog } from 'vant';
 import smoothscroll from 'smoothscroll-polyfill';
 import { useCssVar } from '@vueuse/core';
 import { watch, watchEffect, computed } from 'vue';
-import './styles/theme.less';
 
 smoothscroll.polyfill();
 const appHeight = useCssVar('--app-height', document.documentElement);

src/store/index.js

@@ -21,7 +21,7 @@ export default createStore({
         bankCard: null,
         showRoomId: null,
         platform: '',
-        theme: 'theme2'
+        theme: 'theme3'
     },
     mutations: {
         setFinished(state, finished) {

src/styles/app.less

@@ -1,5 +1,5 @@
 :root {
-    --van-primary-color: @prim;
+    --van-primary-color: var(--prim);
     --van-tabbar-item-active-background-color: transparent;
     --van-tabbar-background-color: @bg;
     --van-nav-bar-background-color: @bg;
@@ -7,15 +7,15 @@
     --van-text-color: @text0;
     --van-gray-6: @text3;
     --van-gray-3: @bg3;
-    --van-tabbar-item-active-color: @textP;
+    --van-tabbar-item-active-color: var(--prim);
     --van-button-plain-background-color: transparent;
     --van-grid-item-content-background-color: transparent;
     --van-button-mini-height: 26px;
     --van-button-mini-font-size: 14px;
     --van-tabs-nav-background-color: @bg;
-    --van-tabs-default-color: @prim;
-    --van-tabs-bottom-bar-color: @prim;
-    --van-tab-active-text-color: @prim;
+    --van-tabs-default-color: var(--prim);
+    --van-tabs-bottom-bar-color: var(--prim);
+    --van-tab-active-text-color: var(--prim);
     --van-tab-disabled-text-color: #fff;
     --van-cell-border-color: @bg3;
     --van-cell-background-color: transparent;
@@ -24,7 +24,7 @@
     --van-divider-border-color: #939599;
     --van-divider-text-color: @tabBorder;
     --van-divider-margin: 0;
-    --van-field-error-message-color: @prim;
+    --van-field-error-message-color: var(--prim);
     --van-action-sheet-item-text-color: #000;
     --van-uploader-upload-active-color: transparent;
     --van-uploader-upload-background-color: transparent;
@@ -43,6 +43,7 @@
     --sab: env(safe-area-inset-bottom);
     --sal: env(safe-area-inset-left);
     --van-button-default-color: #626366;
+    --van-cell-active-color: #272B2E;
 }
 
 [contenteditable='true'],
@@ -146,10 +147,10 @@ input:-webkit-autofill {
 }
 
 .van-tab {
-    color: @text3 !important;
+    // color: @text3 !important;
     font-size: @font2;
     &.van-tab--active {
-        color: @prim !important;
+        // color: @prim !important;
         font-weight: bold;
     }
     padding: 0 0 !important;
@@ -179,7 +180,7 @@ input:-webkit-autofill {
     &.asc {
         .tab {
             .van-icon-arrow-up {
-                color: @prim;
+                color: var(--prim);
             }
             .van-icon-arrow-down {
                 color: #646566;
@@ -274,17 +275,17 @@ input:-webkit-autofill {
     }
 }
 
-.darkTabs {
-    background-color: #222426;
-    .van-tab.van-tab--active {
-        color: #43ce00 !important;
-    }
-    .van-tabs__line {
-        background-color: #43ce00 !important;
-        width: 16px;
-        height: 2px;
-    }
-}
+// .darkTabs {
+//     background-color: #222426;
+//     .van-tab.van-tab--active {
+//         color: #43ce00 !important;
+//     }
+//     .van-tabs__line {
+//         background-color: #43ce00 !important;
+//         width: 16px;
+//         height: 2px;
+//     }
+// }
 
 .van-action-sheet {
     .van-action-sheet__header {

src/styles/font.less

@@ -25,6 +25,26 @@
     -moz-osx-font-smoothing: grayscale;
 }
 
+.font_family-icon-tabbar_icon_02:before {
+    content: '\e646';
+    font-size: 28px;
+}
+
+.font_family-icon-tabbar_icon_04:before {
+    content: '\e647';
+    font-size: 28px;
+}
+
+.font_family-icon-tabbar_icon_03:before {
+    content: '\e648';
+    font-size: 28px;
+}
+
+.font_family-icon-tabbar_icon_01:before {
+    content: '\e649';
+    font-size: 28px;
+}
+
 .icon-png-u-weixuanzhong:before {
     content: '\e640';
 }
@@ -65,11 +85,21 @@
 .icon-icon_inter:before {
     content: '\e631';
 }
-
+.font_family-icon-icon_jiage {
+    display: inline-block;
+    font-size: 8px;
+    line-height: 8px;
+}
+.font_family-icon-icon_jiage:before {
+    content: '\e632';
+    font-size: 8px;
+    line-height: 8px;
+}
 .icon-icon_jiage:before {
     content: '\e632';
+    font-size: 8px;
+    line-height: 8px;
 }
-
 .icon-a-icon-dianzan2:before {
     content: '\e633';
 }

src/styles/theme.less

@@ -1,6 +1,42 @@
+:root {
+    --prim: #43ce00;
+    --fadePrim: #43ce0020;
+    --darkPrim: #256e00;
+    --primlight: #3ab200;
+    --btnText: #fff;
+    --bglight:#373b3e;
+}
+
 .theme2 {
-    @prim: #ffe196;
-    .sales span.sales-fir {
-        background: @prim !important;
-    }
+    --prim: #ffe196;
+    --fadePrim: #ffe19620;
+    --darkPrim: #ffd876;
+    --primlight: #f5ab23;
+    --btnText: #000;
+    --bglight:#2F2519;
+    --van-primary-color: var(--prim);
+    --van-tabbar-item-active-color: var(--prim);
+    --van-tabs-default-color: var(--prim);
+    --van-tabs-bottom-bar-color: var(--prim);
+    --van-tab-active-text-color: var(--prim);
+    --van-field-error-message-color: var(--prim);
+    --van-button-primary-background-color: var(--prim);
+    --van-button-primary-border-color: var(--prim);
+}
+
+.theme3 {
+    --prim: #979DFF;
+    --fadePrim: #979DFF20;
+    --darkPrim: #7f83cf;
+    --primlight: #979DFF;
+    --btnText: #000;
+    --bglight:#3C3766;
+    --van-primary-color: var(--prim);
+    --van-tabbar-item-active-color: var(--prim);
+    --van-tabs-default-color: var(--prim);
+    --van-tabs-bottom-bar-color: var(--prim);
+    --van-tab-active-text-color: var(--prim);
+    --van-field-error-message-color: var(--prim);
+    --van-button-primary-background-color: var(--prim);
+    --van-button-primary-border-color: var(--prim);
 }

src/views/Home.vue

@@ -8,6 +8,7 @@
         @refresh="onRefresh"
         pageType="light"
     >
+        <img src="@assets/png-shouye-guang.png" alt="" v-if="theme === 'theme2'" class="theme2-bg" />
         <div class="filter-bg" :style="{ backgroundImage: `url(${bgImg})` }"></div>
         <div class="welcom">
             <div class="left">
@@ -23,7 +24,17 @@
             ></van-image>
         </div>
 
-        <swiper pagination :space-between="16" class="mySwiper" :autoplay="{ delay: 3500 }" v-if="banners.length > 0">
+        <swiper
+            pagination
+            @slideChange="changeMySwiper"
+            :space-between="theme === 'theme2' || theme === 'theme3' ? 8 : 16"
+            class="mySwiper"
+            :class="[`swiper-${theme}`]"
+            :autoplay="{ delay: 5000, disableOnInteraction: false }"
+            v-if="banners.length > 0"
+            slidesPerView="auto"
+            centeredSlides
+        >
             <swiper-slide v-for="item in banners" :key="item.id">
                 <product-small :info="item"></product-small>
             </swiper-slide>
@@ -41,23 +52,6 @@
                 :type="item.type"
             ></product-large>
         </div>
-        <swiper class="listSwiper" autoHeight @swiper="setSwiperRef" @slideChange="changeSwiper">
-            <swiper-slide> </swiper-slide>
-            <swiper-slide>
-                <news-small
-                    v-for="(item, index) in news"
-                    :key="index"
-                    v-model:info="news[index].obj"
-                    type="light"
-                ></news-small>
-                <!-- <product-large
-                    v-for="(item, index) in news"
-                    :key="index"
-                    v-model:info="news[index].obj"
-                    :type="item.type"
-                ></product-large> -->
-            </swiper-slide>
-        </swiper>
     </van-pull-refresh>
     <van-dialog v-model:show="riskShow" theme="round-button" className="risk">
         <div class="risk-box">
@@ -94,8 +88,6 @@ import banner from '../mixins/banner';
 import ProductLarge from '../components/product/productLarge.vue';
 import ProductSmall from '../components/product/productSmall.vue';
 import { mapState } from 'vuex';
-import NewsInfo from '../components/product/NewsInfo';
-import NewsSmall from '../components/product/NewsSmall.vue';
 
 export default {
     name: 'home',
@@ -105,11 +97,10 @@ export default {
         Swiper,
         SwiperSlide,
         ProductLarge,
-        ProductSmall,
-        NewsSmall
+        ProductSmall
     },
     computed: {
-        ...mapState(['userInfo']),
+        ...mapState(['userInfo', 'theme']),
         isNewCollections() {
             let products = [...this.products];
             let flag = false;
@@ -148,7 +139,8 @@ export default {
             bgImg: '',
             swiperRef: null,
             scrollTop: 0,
-            riskShow: false
+            riskShow: false,
+            activeIndex: 0
         };
     },
     mounted() {
@@ -175,6 +167,9 @@ export default {
             console.log(this.swiperRef.activeIndex);
             this.active = this.swiperRef.activeIndex;
         },
+        changeMySwiper(swiper) {
+            this.activeIndex = swiper.activeIndex;
+        },
         showTips() {
             let inApp = /#cordova#/i.test(navigator.userAgent);
             let inIos = /iPhone|iPad|iPod/i.test(navigator.userAgent);
@@ -423,6 +418,14 @@ export default {
 .darkBg {
     background-color: #181818;
 }
+.theme2-bg {
+    width: 221px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: auto;
+    z-index: -1;
+}
 .top {
     display: flex;
     padding: 9px 16px;
@@ -464,10 +467,16 @@ export default {
 ::v-deep(.mySwiper) {
     // height: 255px;
     padding: 16px 0;
-    margin: 0 16px;
+    // margin: 0 16px;
     box-sizing: border-box;
     // padding-bottom: 35px;
 
+    .swiper-slide {
+        height: 140px;
+        padding: 0 16px;
+        box-sizing: border-box;
+    }
+
     .swiper-pagination {
         bottom: 30px;
     }
@@ -482,7 +491,27 @@ export default {
     }
 
     .swiper-pagination-bullet-active {
-        background: @prim;
+        background: var(--prim);
+    }
+}
+::v-deep(.swiper-theme2),
+::v-deep(.swiper-theme3) {
+    .swiper-slide {
+        width: calc(100vw - 32px);
+        height: 414px;
+        padding: 0 0;
+        display: flex;
+        align-items: center;
+        .product {
+            width: calc(100vw - 32px);
+            height: 394px;
+            transition: height ease-in-out 0.3s;
+        }
+        &.swiper-slide-active {
+            .product {
+                height: 414px;
+            }
+        }
     }
 }
 // .swiper-slide {

src/views/Index.vue

@@ -17,7 +17,8 @@
             <van-tabbar-item replace v-for="item in menus" :name="item.name" :to="`/${item.name}`" :key="item.name">
                 <span>{{ item.title }}</span>
                 <template #icon="props">
-                    <img :src="props.active ? item.preIcon : item.icon" />
+                    <van-icon v-if="props.active" class-prefix="font_family" :name="item.preIcon" />
+                    <img v-else style="height: 28px" :src="item.icon" />
                 </template>
             </van-tabbar-item>
         </van-tabbar>
@@ -33,25 +34,25 @@ export default {
                     name: 'home',
                     title: '首页',
                     icon: require('@assets/tabbar_icon_01.png'),
-                    preIcon: require('@assets/tabbar_icon_01_pre.png')
+                    preIcon: 'icon-tabbar_icon_01'
                 },
                 {
                     name: 'discover',
                     title: '发现',
                     icon: require('@assets/tabbar_icon_02.png'),
-                    preIcon: require('@assets/tabbar_icon_02_pre.png')
+                    preIcon: 'icon-tabbar_icon_02'
                 },
                 {
                     name: 'store',
                     title: '藏品室',
                     icon: require('@assets/tabbar_icon_03.png'),
-                    preIcon: require('@assets/tabbar_icon_03_pre.png')
+                    preIcon: 'icon-tabbar_icon_03'
                 },
                 {
                     name: 'mine',
                     title: '我的',
                     icon: require('@assets/tabbar_icon_04.png'),
-                    preIcon: require('@assets/tabbar_icon_04_pre.png')
+                    preIcon: 'icon-tabbar_icon_04'
                 }
             ];
             if (this.$store.state.hopeMarket) {
@@ -101,7 +102,7 @@ export default {
 }
 
 .index {
-    background-color: @bg3;
+    background-color: #272b2e;
     .flex-col();
     padding-top: 0 !important;
 }

src/views/Store.vue

@@ -202,11 +202,6 @@ export default {
                             value: '',
                             type: ''
                         },
-                        {
-                            label: '拍卖中',
-                            value: 'paimai',
-                            type: ''
-                        },
                         {
                             label: '寄售',
                             value: 'ON_SALE',
@@ -261,11 +256,6 @@ export default {
                         label: '市场交易',
                         value: 'TRANSFERRED',
                         type: ''
-                    },
-                    {
-                        label: '拍卖',
-                        value: 'AUCTIONED',
-                        type: ''
                     }
                     // {
                     //     label: '价格',
@@ -636,7 +626,7 @@ export default {
             color: #fff;
 
             &.active {
-                color: @prim2;
+                color: var(--prim);
                 font-size: @font3;
                 font-weight: bold;
             }

src/views/Submit.vue

@@ -37,15 +37,12 @@
         <div class="bottom van-safe-area-bottom" ref="bottom">
             <div class="bottom-content">
                 <span class="text">总计</span>
-                <span class="price"> <img src="@assets/jiage_huang.png" alt="" />{{ money }} </span>
+                <span class="price">
+                    <van-icon class-prefix="font_family" name="icon-icon_jiage" />
+                    {{ money }}
+                </span>
                 <div class="btn">
-                    <van-button
-                        round
-                        :color="`linear-gradient(135deg, ${$colors.prim} 0%, ${$colors.warn} 100%)`"
-                        @click="submit"
-                    >
-                        立即支付
-                    </van-button>
+                    <van-button type="primary" round @click="submit"> 立即支付 </van-button>
                 </div>
                 <a id="pay" :href="payUrlScheme"></a>
                 <!-- <wx-open-launch-weapp id="launch-btn" :username="launchName" :path="launchPath"> </wx-open-launch-weapp> -->
@@ -527,7 +524,7 @@ export default {
     .text2 {
         font-size: @font2;
         font-weight: bold;
-        color: @prim;
+        color: var(--primlight);
         line-height: 24px;
     }
 
@@ -653,6 +650,8 @@ export default {
             flex-grow: 1;
             color: @btnText !important;
             max-width: 132px;
+            --van-button-primary-background-color: var(--primlight);
+            --van-button-primary-border-color: var(--primlight);
         }
         .text {
             font-size: 14px;
@@ -665,15 +664,19 @@ export default {
             font-size: 34px;
             font-family: OSP;
             font-weight: normal;
-            color: @prim;
+            color: var(--primlight);
             line-height: 30px;
             display: flex;
-            align-items: center;
+            align-items: flex-end;
 
             // flex-grow: 1;
             margin: 0 6px;
             .font_family {
                 font-size: 10px;
+                margin-bottom: 6px;
+                &::before {
+                    font-size: 10px;
+                }
             }
 
             img {

src/views/asset/Detail.vue

@@ -944,7 +944,7 @@ export default {
         destroyCartridgeConfirm() {
             this.transactionShow = true;
             this.destroyCartridge = false;
-            this.transactionPassword = ''
+            this.transactionPassword = '';
         },
         // 藏品销毁
         bind() {
@@ -1028,7 +1028,6 @@ export default {
 </script>
 
 <style lang="less" scoped>
-@prim: #43ce00;
 .detail {
     padding-bottom: 150px;
     background-color: @bgProductDetail;
@@ -1114,7 +1113,7 @@ export default {
     .price {
         font-size: 32px;
         font-family: OSP;
-        color: @prim;
+        color: var(--prim);
         line-height: 32px;
         transform: translateY(3px);
         .flex();
@@ -1218,9 +1217,9 @@ export default {
         }
         .van-button {
             font-size: @font1;
-            color: @prim;
+            color: var(--prim);
             line-height: 24px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             -webkit-background-clip: text;
             background-clip: text;
             -webkit-text-fill-color: transparent;
@@ -1473,7 +1472,7 @@ export default {
         .text2 {
             width: 94px;
             height: 32px;
-            background: linear-gradient(135deg, @prim, @warn);
+            background: var(--prim);
             border-radius: 4px;
             margin-left: 14px;
             line-height: 30px;
@@ -1517,7 +1516,7 @@ export default {
         .text4 {
             color: #ffffff;
             line-height: 22px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             -webkit-background-clip: text;
             background-clip: text;
             -webkit-text-fill-color: transparent;
@@ -1557,7 +1556,7 @@ export default {
         width: 94px;
         height: 32px;
         color: @btnText;
-        background: linear-gradient(48deg, @prim 0%, @warn 100%);
+        background: var(--prim);
         border-radius: 4px;
         &.prim {
             background: #202122;
@@ -1614,7 +1613,7 @@ export default {
     justify-content: center;
     flex-direction: column;
     position: relative;
-    background: linear-gradient(135deg, @prim, @warn);
+    background: var(--prim);
     margin-right: 20px;
     box-sizing: border-box;
     min-width: 94px;
@@ -1694,7 +1693,7 @@ export default {
             font-weight: 500;
             color: @text3;
             line-height: 17px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             -webkit-background-clip: text;
             background-clip: text;
             -webkit-text-fill-color: transparent;
@@ -1705,8 +1704,8 @@ export default {
         }
     }
     .van-button {
-        background: linear-gradient(135deg, @prim 0%, @warn 100%);
-        color: @btnText;
+        background: var(--prim);
+        color: var(--btnText);
         font-size: @font2;
         border-width: 0px;
     }
@@ -1723,7 +1722,7 @@ export default {
 .status {
     font-size: 16px;
     font-weight: bold;
-    color: @prim;
+    color: var(--prim);
     line-height: 24px;
 }
 
@@ -1991,7 +1990,7 @@ export default {
     font-size: @font1;
     height: 42px;
     .text1 {
-        color: @prim;
+        color: var(--prim);
         width: 48px;
         flex-shrink: 0;
         margin-right: 20px;
@@ -2137,7 +2136,7 @@ export default {
         }
 
         /deep/.van-key--blue {
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             color: @btnText;
         }
     }

src/views/product/Detail.vue

@@ -887,7 +887,7 @@ export default {
         width: 94px;
         height: 32px;
         color: #000;
-        background: linear-gradient(48deg, @prim 0%, @warn 100%);
+        background: var(--prim);
         border-radius: 4px;
         &.prim {
             background: #202122;
@@ -1007,9 +1007,9 @@ export default {
         .name2 {
             font-size: @font2;
             font-weight: 400;
-            color: @prim;
+            color: var(--prim);
             line-height: 24px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
         }
@@ -1017,7 +1017,7 @@ export default {
     .price {
         font-size: 36px;
         font-family: OSP;
-        color: @prim;
+        color: var(--prim);
         line-height: 36px;
         transform: translateY(3px);
 
@@ -1074,11 +1074,11 @@ export default {
                     display: inline-block;
                     padding: 0 12px;
                     &:first-child {
-                        background-color: @prim;
-                        color: #fff;
+                        background-color: var(--prim);
+                        color: #000000;
                     }
                     &:last-child {
-                        color: @prim;
+                        color: var(--prim);
                         background-color: #27272b;
                     }
                 }
@@ -1116,9 +1116,9 @@ export default {
         }
         .van-button {
             font-size: @font2;
-            color: @prim;
+            color: var(--prim);
             line-height: 24px;
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
+            background: var(--prim);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
             border-width: 0px;
@@ -1234,7 +1234,7 @@ export default {
             }
         }
         .text4 {
-            color: @prim;
+            color: var(--prim);
             &.prim {
                 color: @text3;
             }
@@ -1251,16 +1251,16 @@ export default {
     width: 100%;
     display: block;
     height: 52px;
-    background: linear-gradient(135deg, @prim 0%, @warn 100%);
+    background: var(--prim);
     border-radius: 8px;
     border-width: 0;
     color: #000;
     &:hover {
-        background: linear-gradient(135deg, darken(@prim, 10%), darken(@warn, 10%));
+        background: var(--darkPrim);
     }
 
     &.used {
-        background: linear-gradient(135deg, darken(@prim, 50%), darken(@warn, 50%));
+        background: var(--darkPrim);
         color: @text3;
     }
 }
@@ -1293,7 +1293,7 @@ export default {
 }
 .qiaohua {
     border-radius: 4px;
-    background: linear-gradient(45deg, @prim, @warn);
+    background: var(--prim);
     position: relative;
     width: 94px;
     display: flex;
@@ -1308,7 +1308,7 @@ export default {
         z-index: 1;
     }
     .text4 {
-        color: @prim;
+        color: var(--prim);
         &.prim {
             color: @text3;
         }
@@ -1352,7 +1352,7 @@ export default {
     justify-content: center;
     flex-direction: column;
     position: relative;
-    background: linear-gradient(135deg, @prim, @warn);
+    background: linear-gradient(135deg, var(--prim), @warn);
     margin-right: 20px;
     box-sizing: border-box;
     min-width: 94px;
@@ -1401,6 +1401,9 @@ export default {
 
     &.btn-only {
         padding: 9px 48px;
+        .van-button--primary {
+            color: var(--btnText);
+        }
     }
 }
 .btn {
@@ -1435,8 +1438,8 @@ export default {
         min-height: 38px;
         margin: auto;
         .van-button--primary {
-            background: linear-gradient(135deg, @prim 0%, @warn 100%);
-            color: @btnText;
+            background: var(--prim);
+            color: var(--btnText);
             font-size: @font2;
             border-width: 0px;
         }
@@ -1561,7 +1564,7 @@ export default {
     .price {
         font-size: 32px;
         font-family: OSP-DIN, OSP;
-        color: @prim;
+        color: var(--prim);
         line-height: 26px;
         display: flex;
         align-items: center;
@@ -1612,7 +1615,7 @@ export default {
     width: 94px;
     height: 30px;
     border-radius: 4px;
-    background: linear-gradient(135deg, @prim, @warn);
+    background: var(--prim);
     font-size: @font1;
     color: #ffffff;
     line-height: 30px;
@@ -1646,7 +1649,7 @@ export default {
     font-size: @font1;
     height: 42px;
     .text1 {
-        color: @prim;
+        color: var(--prim);
         width: 64px;
         margin-right: 10px;
         flex-basis: 0;

src/views/product/Search.vue

@@ -125,7 +125,7 @@
                 </div>
             </div>
 
-            <swiper @swiper="setSwiperRef" slides-per-view="auto" :space-between="16" class="mySwiper">
+            <!-- <swiper @swiper="setSwiperRef" slides-per-view="auto" :space-between="16" class="mySwiper">
                 <swiper-slide class="tab-slide" v-for="item in tabs" :key="item.id">
                     <div class="tab-top">
                         <img src="@assets/png-sosuo-bg.png" alt="" />
@@ -149,7 +149,7 @@
                         <div>上滑显示更多</div>
                     </div>
                 </swiper-slide>
-            </swiper>
+            </swiper> -->
         </div>
     </div>
 </template>
@@ -165,7 +165,7 @@ import 'swiper/swiper.min.css';
 import 'swiper/swiper-bundle.min.css';
 export default {
     name: 'productSearch',
-    components: { ProductInfo, Swiper, SwiperSlide },
+    components: { ProductInfo },
     inject: ['bar', 'setKeeps', 'scrollWrapper', 'changeScroll'],
     mixins: [product, list, search],
     setup() {
@@ -284,37 +284,6 @@ export default {
                 this.showHall = false;
             });
 
-        this.$http
-            .post('/setting/byFlag', { flag: 1 })
-            .then(res => {
-                this.settings = res;
-                this.$http
-                    .post(
-                        '/banner/all',
-                        {
-                            query: {
-                                type: 'MARKET',
-                                del: false
-                            },
-                            size: 999,
-                            sort: 'sort,asc;createdAt,desc'
-                        },
-                        { body: 'json' }
-                    )
-                    .then(res => {
-                        this.banners = res.content;
-                        this.$nextTick(() => {
-                            if (this.swiperRef) {
-                                this.swiperRef.update();
-                            }
-                        });
-                    });
-            })
-            .catch(e => {
-                console.log(e);
-                this.$message.error(e.error);
-            });
-
         this.emitter.on('updateList', info => {
             let list = [...this.list];
             list.forEach((item, index) => {