Bläddra i källkod

feat(collect): 收藏页面的修改

yizhiyang 1 år sedan
förälder
incheckning
8371c82d42
4 ändrade filer med 216 tillägg och 71 borttagningar
  1. 6 6
      src/pages.json
  2. 132 51
      src/pages/my/collect/index.vue
  3. 0 0
      src/pages/my/score/index.vue
  4. 78 14
      src/pages/tabbar/mine/index.vue

+ 6 - 6
src/pages.json

@@ -71,12 +71,6 @@
             "navigationBarTitleText": "个人中心"
           }
         },
-        {
-          "path": "score/index",
-          "style": {
-            "navigationBarTitleText": "我的积分"
-          }
-        },
         {
           "path": "checkIn/index",
           "style": {
@@ -280,6 +274,12 @@
           "style": {
             "navigationBarTitleText": "询价"
           }
+        },
+        {
+          "path": "score/index",
+          "style": {
+            "navigationBarTitleText": "我的积分"
+          }
         }
       ]
     }

+ 132 - 51
src/pages/my/collect/index.vue

@@ -1,73 +1,104 @@
 <template>
   <view class="collect">
-    <view class="text">以下是您收藏的店铺</view>
+    <view class="text">以下是您收藏的商品服务</view>
 
-    <!-- 收藏列表 -->
-    <view class="collect-item">
+    <!-- 收藏的服务 -->
+    <view class="list" @click="$Router.push('/pages/business/service/index')">
       <Image src="https://cdn.uviewui.com/uview/album/1.jpg"></Image>
       <view>
-        <view class="item-text">途虎养车洗车机(贵州省贵阳市云岩区)</view>
+        <view class="item-text"
+          >【养车】标题标题标题标题标题标题标题标题……</view
+        >
         <view class="item-flex">
           <view class="star">
-            <u-rate :count="count" v-model="value" />
+            <u-rate :count="count" v-model="value" :size="14" />
             <text class="line">|</text>
+            <text class="points">4.93分</text>
           </view>
           <view>989单</view>
         </view>
-        <view class="address-flex">
-          <view>宝安中心区美容洗车</view>
-          <view>2.7km</view>
-        </view>
-      </view>
-    </view>
-    <view class="collect-item">
-      <Image src="https://cdn.uviewui.com/uview/album/1.jpg"></Image>
-      <view>
-        <view class="item-text">途虎养车洗车机(贵州省贵阳市云岩区)</view>
-        <view class="item-flex">
-          <view class="star">
-            <u-rate :count="count" v-model="value" />
-            <text class="line">|</text>
+        <view class="list-item">
+          <view>
+            <view class="price"
+              >券后价
+              <text class="price-item">¥</text>
+              <text class="price-count">19</text>
+            </view>
+            <view class="gate-rate">
+              <text>门市价</text>
+              <text class="gate-rate-item">¥30</text>
+            </view>
+          </view>
+          <view class="appoint">
+            <text class="appoint-item">预约</text>
+            <text class="Buy">购买</text>
           </view>
-          <view>989单</view>
-        </view>
-        <view class="address-flex">
-          <view>宝安中心区美容洗车</view>
-          <view>2.7km</view>
         </view>
       </view>
     </view>
-    <view class="collect-item">
+    <view class="list" @click="$Router.push('/pages/business/service/index')">
       <Image src="https://cdn.uviewui.com/uview/album/1.jpg"></Image>
       <view>
-        <view class="item-text">途虎养车洗车机(贵州省贵阳市云岩区)</view>
+        <view class="item-text"
+          >【养车】标题标题标题标题标题标题标题标题……</view
+        >
         <view class="item-flex">
           <view class="star">
-            <u-rate :count="count" v-model="value" />
+            <u-rate :count="count" v-model="value" :size="14" />
             <text class="line">|</text>
+            <text class="points">4.93分</text>
           </view>
           <view>989单</view>
         </view>
-        <view class="address-flex">
-          <view>宝安中心区美容洗车</view>
-          <view>2.7km</view>
+        <view class="list-item">
+          <view>
+            <view class="price"
+              >券后价
+              <text class="price-item">¥</text>
+              <text class="price-count">19</text>
+            </view>
+            <view class="gate-rate">
+              <text>门市价</text>
+              <text class="gate-rate-item">¥30</text>
+            </view>
+          </view>
+          <view class="appoint">
+            <text class="appoint-item">预约</text>
+            <text class="Buy">购买</text>
+          </view>
         </view>
       </view>
     </view>
-    <view class="collect-item">
+    <view class="list" @click="$Router.push('/pages/business/service/index')">
       <Image src="https://cdn.uviewui.com/uview/album/1.jpg"></Image>
       <view>
-        <view class="item-text">途虎养车洗车机(贵州省贵阳市云岩区)</view>
+        <view class="item-text"
+          >【养车】标题标题标题标题标题标题标题标题……</view
+        >
         <view class="item-flex">
           <view class="star">
-            <u-rate :count="count" v-model="value" />
+            <u-rate :count="count" v-model="value" :size="14" />
             <text class="line">|</text>
+            <text class="points">4.93分</text>
           </view>
           <view>989单</view>
         </view>
-        <view class="address-flex">
-          <view>宝安中心区美容洗车</view>
-          <view>2.7km</view>
+        <view class="list-item">
+          <view>
+            <view class="price"
+              >券后价
+              <text class="price-item">¥</text>
+              <text class="price-count">19</text>
+            </view>
+            <view class="gate-rate">
+              <text>门市价</text>
+              <text class="gate-rate-item">¥30</text>
+            </view>
+          </view>
+          <view class="appoint">
+            <text class="appoint-item">预约</text>
+            <text class="Buy">购买</text>
+          </view>
         </view>
       </view>
     </view>
@@ -82,9 +113,9 @@ export default {
       value: 4,
     };
   },
-  onLoad() { },
+  onLoad() {},
   methods: {},
-}
+};
 </script>
 
 <style lang="scss" scoped>
@@ -98,15 +129,15 @@ export default {
     color: #999;
   }
 
-  .collect-item {
-    height: 220rpx;
+  .list {
+    height: 250rpx;
     background-color: #fff;
     padding: 0 20rpx;
     margin-bottom: 20rpx;
     display: flex;
 
     Image {
-      width: 120px;
+      width: 180px;
       height: calc(100% - 20rpx);
       margin: 10rpx 20rpx 10rpx 0;
     }
@@ -120,28 +151,78 @@ export default {
     .item-flex {
       display: flex;
       justify-content: space-between;
-      font-size: 14px;
-      margin: 0 20rpx 30rpx 0;
+      font-size: 28rpx;
+      margin: 0 20rpx 10rpx 0;
       color: #0d0d0d66;
 
       .star {
         display: flex;
 
         .line {
-          margin-left: 18rpx;
+          margin-left: 16rpx;
           margin-top: 5rpx;
-          font-size: 24rpx;
+          font-size: 22rpx;
+        }
+
+        .points {
+          color: #ff4b04;
+          font-size: 22rpx;
+          margin-top: 6rpx;
+          margin-left: 10rpx;
         }
       }
     }
-
-    .address-flex {
+    .list-item {
       display: flex;
       justify-content: space-between;
-      font-size: 12px;
-      color: #999;
-      margin-right: 20rpx;
+      .price {
+        font-size: 32rpx;
+        font-weight: bold;
+        color: #fa3534;
+        .price-item {
+          font-size: 24rpx;
+          margin-left: 10rpx;
+        }
+        .price-count {
+          font-size: 44rpx;
+        }
+      }
+      .gate-rate {
+        color: #c9c9c9;
+        font-size: 26rpx;
+        margin: 16rpx 0 0 40rpx;
+        .gate-rate-item {
+          text-decoration: line-through;
+        }
+      }
+      .appoint {
+        width: 80px;
+        height: 32px;
+        display: flex;
+        margin-top: 20px;
+        font-size: 14px;
+        .appoint-item {
+          width: 40px;
+          height: 32px;
+          line-height: 32px;
+          text-align: center;
+          display: inline-block;
+          box-sizing: border-box;
+          border-radius: 16px 0 0 16px;
+          border: 1px solid #ec5729;
+        }
+        .Buy {
+          width: 40px;
+          height: 32px;
+          color: #fff;
+          line-height: 32px;
+          text-align: center;
+          display: inline-block;
+          border-radius: 0 16px 16px 0;
+          background-color: #ec5729;
+        }
+      }
     }
   }
 }
-</style>
+</style>

+ 0 - 0
src/pages/client/score/index.vue → src/pages/my/score/index.vue


+ 78 - 14
src/pages/tabbar/mine/index.vue

@@ -2,7 +2,10 @@
   <view class="container">
     <view class="head-wrap">
       <view class="content">
-        <view class="avatar-wrap" @tap="$Router.push('/pages/client/personalCenter/index')">
+        <view
+          class="avatar-wrap"
+          @tap="$Router.push('/pages/client/personalCenter/index')"
+        >
           <u-avatar :src="user_info.avatar" size="80"></u-avatar>
         </view>
         <view>
@@ -10,13 +13,21 @@
           <view class="user-base" v-if="user_info.nickname">
             <view class="user-nickname">{{ user_info.nickname }}</view>
             <view class="btn-wrap">
-              <view class="btn-content" @tap="$Router.push('/pages/client/settings/index')">设置</view>
+              <view
+                class="btn-content"
+                @tap="$Router.push('/pages/client/settings/index')"
+                >设置</view
+              >
               <view class="btn-content">认证</view>
             </view>
           </view>
 
           <!-- 未登录 -->
-          <view class="clickLogin" v-else @tap="$Router.push('/pages/login/index')">
+          <view
+            class="clickLogin"
+            v-else
+            @tap="$Router.push('/pages/login/index')"
+          >
             点击登录
           </view>
         </view>
@@ -25,8 +36,17 @@
       <!-- 收藏 -->
       <view class="Collect">
         <u-grid :border="false" col="4">
-          <u-grid-item v-for="(listItem, listIndex) in list1" :key="listIndex" @tap="$Router.push(listItem.url)">
-            <u-icon :customStyle="{ paddingTop: 20 + 'rpx' }" :name="listItem.name" :size="24" color="#fff" />
+          <u-grid-item
+            v-for="(listItem, listIndex) in list1"
+            :key="listIndex"
+            @tap="$Router.push(listItem.url)"
+          >
+            <u-icon
+              :customStyle="{ paddingTop: 20 + 'rpx' }"
+              :name="listItem.name"
+              :size="24"
+              color="#fff"
+            />
             <text class="grid-text">{{ listItem.title }}</text>
           </u-grid-item>
         </u-grid>
@@ -36,8 +56,15 @@
       <view class="order-out-box">
         <view class="order-inner-box">
           <u-grid :border="false" col="4" style="background-color: #fff">
-            <u-grid-item v-for="(listItem, listIndex) in list2" :key="listIndex">
-              <u-icon :customStyle="{ paddingTop: 20 + 'rpx' }" :name="listItem.name" :size="34"></u-icon>
+            <u-grid-item
+              v-for="(listItem, listIndex) in list2"
+              :key="listIndex"
+            >
+              <u-icon
+                :customStyle="{ paddingTop: 20 + 'rpx' }"
+                :name="listItem.name"
+                :size="34"
+              ></u-icon>
               <text class="grid-text">{{ listItem.title }}</text>
             </u-grid-item>
           </u-grid>
@@ -54,7 +81,10 @@
         </view>
         <view class="income-content">
           <u-grid :border="false" col="4" bgColor="#fff">
-            <u-grid-item v-for="(listItem, listIndex) in incomeList" :key="listIndex">
+            <u-grid-item
+              v-for="(listItem, listIndex) in incomeList"
+              :key="listIndex"
+            >
               <view class="num-box">{{ listItem.num }}元</view>
               <view class="num-title">{{ listItem.title }}</view>
             </u-grid-item>
@@ -65,16 +95,49 @@
 
     <!-- 预约列表 -->
     <view class="appointList">
-      <u-cell icon="setting-fill" title="预约列表" isLink url="/pages/componentsB/tag/tag" />
+      <u-cell
+        icon="setting-fill"
+        title="预约列表"
+        isLink
+        url="/pages/componentsB/tag/tag"
+      />
     </view>
 
     <view class="other-out-box">
       <view class="other-inner-box">
         <u-cell-group :border="false">
-          <u-cell size="large" :border="false" icon="setting-fill" title="我的团队" isLink url=""></u-cell>
-          <u-cell size="large" :border="false" icon="setting-fill" title="关于我们" isLink url=""></u-cell>
-          <u-cell size="large" :border="false" icon="setting-fill" title="隐私条款" isLink url=""></u-cell>
-          <u-cell size="large" :border="false" icon="setting-fill" title="客服中心" isLink url=""></u-cell>
+          <u-cell
+            size="large"
+            :border="false"
+            icon="setting-fill"
+            title="我的团队"
+            isLink
+            url=""
+          ></u-cell>
+          <u-cell
+            size="large"
+            :border="false"
+            icon="setting-fill"
+            title="关于我们"
+            isLink
+            url=""
+          ></u-cell>
+          <u-cell
+            size="large"
+            :border="false"
+            icon="setting-fill"
+            title="隐私条款"
+            isLink
+            url=""
+          ></u-cell>
+          <u-cell
+            size="large"
+            :border="false"
+            icon="setting-fill"
+            title="客服中心"
+            isLink
+            url=""
+          ></u-cell>
         </u-cell-group>
       </view>
     </view>
@@ -95,11 +158,12 @@ export default {
         {
           name: 'lock',
           title: '积分',
-          url: '/pages/client/score/index',
+          url: '/pages/my/score/index',
         },
         {
           name: 'star',
           title: '询价记录',
+          url: '/pages/my/inquiry/index',
         },
         {
           name: 'hourglass',