feat(client):新增我的钱包界面

src/PageMine/myWallet/index.vue

@@ -0,0 +1,106 @@
+<template>
+  <view class="myWallet">
+    <view class="wallet-bg">
+      <u--image src="/static/pageMine/wallet-bj.png" width="100%" height="550rpx"></u--image>
+    </view>
+    <page-navbar :hasBack="true" bgColor="transparent" title="我的钱包"></page-navbar>
+
+    <view class="wallet-main">
+      <view class="wallet-card">
+        <view class="fl-flex-item wallet-secure">
+          <view class="f-s-32 text-333 text-bold">*烊的钱包</view>
+          <view class="fl-flex">
+            <u--image src="/static/pageMine/secure.png" width="32rpx" height="32rpx"></u--image>
+            <view class="f-s-24 text-33 u-m-l-4">安全保障中</view>
+          </view>
+        </view>
+        <view class="u-m-b-40">
+          <view class="f-s-28 text-66 u-m-b-16"> 我的资产(元)</view>
+          <view class="f-s-56 color-primary text-bold"> 3453.2</view>
+        </view>
+        <view class="fl-flex immediately">
+          <view>立即提现</view>
+          <u-icon name="arrow-right" color="#fff" size="16" top="2" />
+        </view>
+        <view class="fl-flex-item">
+          <view class="fl-flex" v-for="(item, index) in 4" :key="index">
+            <view class="direction">
+              <view class="f-s-24 text-666 u-m-b-4">总收益</view>
+              <view class="f-s-28 text-333">7794.0</view>
+            </view>
+            <view v-if="index !== 3" class="wallet-card-line"></view>
+          </view>
+        </view>
+      </view>
+
+      <view class="fl-flex-item u-m-t-26 u-m-b-26">
+        <view class="f-s-32 text-primary text-bold">余额明细</view>
+        <view class="fl-flex" @tap="$Router.push('/PageMine/myWallet/walletDetail')">
+          <view class="f-s-24 text-999 u-m-r-8">查看全部</view>
+          <u-icon name="arrow-right" color="#999" size="12" />
+        </view>
+      </view>
+      <wallet-item></wallet-item>
+    </view>
+  </view>
+</template>
+
+<script>
+import WalletItem from './walletItem.vue';
+export default {
+  name: 'myWallet',
+  components: { WalletItem },
+};
+</script>
+
+<style lang="scss" scoped>
+.myWallet {
+  height: 100%;
+  position: relative;
+  .wallet-bg {
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    top: 0;
+    z-index: -99;
+  }
+  .wallet-main {
+    padding: 20rpx 32rpx;
+    .wallet-card {
+      height: 400rpx;
+      padding: 32rpx;
+      background-color: #fff;
+      box-sizing: border-box;
+      border-radius: 16rpx;
+      position: relative;
+      .wallet-secure {
+        padding-bottom: 32rpx;
+        border-bottom: 1px solid #eaebeb;
+        margin-bottom: 32rpx;
+      }
+      .immediately {
+        width: 194rpx;
+        height: 66rpx;
+        color: #fff;
+        background: #215ebe;
+        border-radius: 524rpx 0rpx 0rpx 524rpx;
+        align-items: center;
+        justify-content: center;
+        font-size: 28rpx;
+        position: absolute;
+        right: 0;
+        top: 160rpx;
+        box-sizing: border-box;
+        padding-left: 30rpx;
+      }
+      .wallet-card-line {
+        height: 60rpx;
+        width: 2rpx;
+        background-color: #ebebeb;
+        margin-left: 50rpx;
+      }
+    }
+  }
+}
+</style>

src/PageMine/myWallet/walletDetail.vue

@@ -0,0 +1,21 @@
+<template>
+  <view class="wallet-detail">
+    <page-navbar :hasBack="true" bgColor="#fff" title="余额明细"></page-navbar>
+    <view class="f-s-34 text-center u-m-b-12">时间待处理</view>
+    <wallet-item></wallet-item>
+  </view>
+</template>
+
+<script>
+import WalletItem from './walletItem.vue';
+export default {
+  name: 'wallet-detail',
+  components: { WalletItem },
+};
+</script>
+
+<style lang="scss" scoped>
+.wallet-detail {
+  padding: 20rpx 32rpx;
+}
+</style>

src/PageMine/myWallet/walletItem.vue

@@ -0,0 +1,31 @@
+<template>
+  <view>
+    <base-card padding="16rpx 34rpx" marginBottom="24rpx" v-for="(item, index) in 6" :key="index">
+      <view class="fl-flex-item">
+        <view>
+          <view class="fl-flex">
+            <view class="f-s-28 text-333 u-m-r-8" style="line-height: 48rpx">提现</view>
+            <view class="u-m-t-8">
+              <base-text text="待处理" borderColor="#215EBE"></base-text>
+              <!-- <base-text
+                text="已打款"
+                borderColor="#39BD66"
+                color="#39BD66"
+                background="#ebf8ef"
+              ></base-text> -->
+            </view>
+          </view>
+          <view class="f-s-24 u-m-b-16 u-m-t-8" style="color: #616570">2024-05-25 14:01:12</view>
+        </view>
+        <view class="f-s-30 text-333">-60.00</view>
+      </view>
+    </base-card>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'wallet-item',
+};
+</script>
+

src/PageMine/profit/index.vue

@@ -1,188 +0,0 @@
-<template>
-  <view class="container">
-    <view class="item-box">
-      <view class="item" :key="item" v-for="item of price_list">
-        <view class="item-text">{{ item.name }}</view>
-        <view class="item-price">{{ item.price }}</view>
-      </view>
-    </view>
-
-    <view class="item-box">
-      <view class="item" :key="item" v-for="item of price_list1">
-        <view class="item-text">{{ item.name }}</view>
-        <view class="item-price">{{ item.price }}</view>
-      </view>
-    </view>
-
-    <view class="item-box2">
-      <view class="item" :key="item" v-for="item of price_list2">
-        <view class="item-text">{{ item.name }}</view>
-        <view class="item-price">{{ item.price }}</view>
-      </view>
-    </view>
-
-    <view class="item-box3">
-      <view class="item">
-        <view class="item-text">可提现金额</view>
-        <view class="item-price">150.00</view>
-      </view>
-      <view class="btn-box">
-        <button class="btn" @click="handlerWithdrawFunds">提现</button>
-      </view>
-    </view>
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      price_list: [
-        {
-          name: '钱包余额(元)',
-          price: '258.00',
-        },
-        {
-          name: '总收益(元)',
-          price: '258.00',
-        },
-        {
-          name: '待转入(元)',
-          price: '258.00',
-        },
-      ],
-      price_list1: [
-        {
-          name: '总收益(元)',
-          price: '258.00',
-        },
-        {
-          name: '已提现(元)',
-          price: '258.00',
-        },
-        {
-          name: '待总结(元)',
-          price: '258.00',
-        },
-      ],
-      price_list2: [
-        {
-          name: '已提现',
-          price: '150.00',
-        },
-        {
-          name: '待结算',
-          price: '108.00',
-        },
-        {
-          name: '已失效',
-          price: '10.00',
-        },
-      ],
-    };
-  },
-  methods: {
-    // 点击提现
-    handlerWithdrawFunds() {
-      uni.navigateTo({
-        url: '/PageMine/profit/withdraw',
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.container {
-  margin-top: 25rpx;
-  background-color: #efefef;
-  min-height: calc(100vh - 10rpx);
-  .item-box,
-  .item-box2 {
-    width: 90%;
-    padding: 20rpx;
-    background-color: #347caf;
-    border-radius: 20rpx;
-    margin: 10rpx auto 0;
-    display: flex;
-    justify-content: space-around;
-    .item {
-      color: #fff;
-      text-align: center;
-      .item-text {
-        font-size: 28rpx;
-      }
-      .item-price {
-        font-size: 36rpx;
-        font-weight: bold;
-        margin-top: 20rpx;
-      }
-    }
-  }
-  .item-box2 {
-    margin-top: 20rpx;
-  }
-  .item-box3 {
-    width: 90%;
-    padding: 20rpx;
-    background-color: #347caf;
-    border-radius: 20rpx;
-    color: #fff;
-    margin: 20rpx auto;
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-    .btn {
-      width: 260rpx;
-      height: 80rpx;
-      border-radius: 60rpx;
-    }
-    .item {
-      color: #fff;
-      text-align: center;
-      .item-text {
-        font-size: 28rpx;
-      }
-      .item-price {
-        font-size: 36rpx;
-        font-weight: bold;
-        margin-top: 20rpx;
-      }
-    }
-  }
-
-  .footer-item {
-    width: 95%;
-    background-color: #347caf;
-    border-radius: 20rpx;
-    color: #fff;
-    margin: 20rpx auto;
-    .img {
-      width: 100%;
-    }
-  }
-  .item-box4 {
-    display: flex;
-    justify-content: space-around;
-    align-items: center;
-    padding: 20rpx;
-    .btn {
-      width: 260rpx;
-      height: 80rpx;
-      border-radius: 60rpx;
-    }
-    .item {
-      color: #fff;
-      text-align: center;
-      .item-text {
-        font-size: 28rpx;
-      }
-      .item-price {
-        font-size: 36rpx;
-        font-weight: bold;
-        margin-top: 20rpx;
-      }
-    }
-  }
-}
-</style>

src/PageMine/profit/withdraw.vue

@@ -1,112 +0,0 @@
-<template>
-  <view class="container">
-    <view class="draw-box">
-      <span class="title">提现金额</span>
-      <view class="draw">
-        <span class="draw-span">￥</span>
-        <u--input type="number " placeholder="请输入提现金额" border="bottom" clearable></u--input>
-      </view>
-      <view class="draw-footer">
-        <view class="footer-l">可提现余额￥0.00</view>
-        <view class="footer-r" @click="handlerWidthDrawBtn">全部提现</view>
-      </view>
-    </view>
-
-    <view class="draw-box margin-box item-box2">
-      <view class="item-l">
-        <view class="l-title">预估收益</view>
-        <view class="l-text">2021年4月1日 - 2021年4月30日</view>
-      </view>
-      <view class="item-t">234.56</view>
-    </view>
-
-    <view class="draw-box margin-box item-box2">
-      <view class="item-l">
-        <view class="l-title">已提现收益</view>
-        <view class="l-text">2021年1月1日 - 2021年3月30日</view>
-      </view>
-      <view class="item-t">500.56</view>
-    </view>
-  </view>
-</template>
-
-<script>
-export default {
-  data() {
-    return {};
-  },
-  methods: {
-    // 点击提现
-    handlerWidthDrawBtn() {
-      uni.showToast({
-        title: '没钱',
-        icon: 'none',
-      });
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-.container {
-  background-color: #efefef;
-  padding: 20rpx;
-  min-height: calc(100vh - 40rpx);
-  .draw-box {
-    padding: 20rpx;
-    background-color: #fff;
-    border-radius: 20rpx;
-    .title {
-      font-size: 36rpx;
-      font-weight: bold;
-    }
-    .draw {
-      display: flex;
-      align-items: center;
-      margin: 40rpx 0 20rpx;
-      .draw-span {
-        font-size: 36rpx;
-        font-weight: bold;
-      }
-    }
-    .draw-footer {
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-      .footer-l {
-        font-size: 40rpx;
-        color: #9ca3af;
-      }
-      .footer-r {
-        color: #000;
-        font-size: 28rpx;
-      }
-    }
-  }
-
-  .margin-box {
-    margin: 20rpx 0;
-  }
-
-  .item-box2 {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    .item-l {
-      font-size: 28rpx;
-      .l-title {
-        color: #000;
-      }
-      .l-text {
-        color: #9ca3af;
-        margin-top: 20rpx;
-      }
-    }
-    .item-t {
-      font-size: 28rpx;
-      font-weight: bold;
-      color: #9ca3af;
-    }
-  }
-}
-</style>

src/components/base-button/base-button.vue

@@ -1,3 +1,9 @@
+<!--
+ ****--@date 2024-06-08 14:13:53
+ ****--@author yizhiyang
+ ****--@description base-button
+-->
+
 <template>
   <view class="base-button">
     <u-button

src/components/base-text/base-text.vue

@@ -1,6 +1,6 @@
 <template>
   <view class="base-text">
-    <view :style="textStyle">{{ text }}</view>
+    <view :style="[textStyle]">{{ text }}</view>
   </view>
 </template>
 
@@ -14,40 +14,45 @@ export default {
     },
     width: {
       type: String,
-      default: '62px',
+      default: '80rpx',
     },
     height: {
       type: String,
-      default: '26px',
+      default: '32rpx',
     },
     fontSize: {
       type: String,
-      default: '14px',
+      default: '20rpx',
     },
     color: {
       type: String,
-      default: '',
+      default: '#215EBE',
     },
     background: {
       type: String,
-      default: '',
+      default: '#F0F5FE',
     },
     borderRadius: {
       type: String,
-      default: '4px',
+      default: '8rpx',
     },
     textAlign: {
       type: String,
       default: 'center',
     },
+    borderColor: {
+      type: String,
+      default: '',
+    },
   },
+
   data() {
     return {};
   },
   computed: {
     textStyle() {
-      const { width, height, fontSize, color, background, borderRadius, textAlign } = this;
-
+      const { width, height, fontSize, borderColor, color, background, borderRadius, textAlign } =
+        this;
       return {
         width,
         height,
@@ -57,6 +62,7 @@ export default {
         borderRadius,
         textAlign,
         lineHeight: height,
+        border: ` 2rpx solid ${borderColor} `,
       };
     },
   },

src/design/common.css

@@ -103,7 +103,7 @@
   text-align: right;
 }
 
-.text-black {
+.text-333 {
   color: #333333;
 }
 
@@ -121,4 +121,12 @@
 
 .text-primary {
   color: #0C1223
+}
+
+.color-primary {
+  color: #215ebe;
+}
+
+.bg-primary {
+  background-color: #215ebe;
 }

src/pages.json

@@ -284,15 +284,15 @@
           }
         },
         {
-          "path": "profit/index",
+          "path": "myWallet/index",
           "style": {
-            "navigationBarTitleText": "提现"
+            "navigationStyle": "custom"
           }
         },
         {
-          "path": "profit/withdraw",
+          "path": "myWallet/walletDetail",
           "style": {
-            "navigationBarTitleText": "提现"
+            "navigationStyle": "custom"
           }
         }
       ]

src/pages/tabbar/mine/index.vue

@@ -9,7 +9,7 @@
 
       <view class="fl-flex fl-align-center fl-justify-between">
         <view class="fl-flex fl-align-center">
-          <u-avatar :src="avatar" size="50" @click="handlerReviewImg" />
+          <u-avatar :src="avatar" size="60" @click="handlerReviewImg" />
           <view class="f-s-36 u-font-600 u-m-l-30"> {{ nickname }} </view>
         </view>
         <u--image
@@ -143,7 +143,7 @@ export default {
     /* 钱包 */
     handlerWallet() {
       uni.navigateTo({
-        url: '/PageMine/profit/index',
+        url: '/PageMine/myWallet/index',
       });
     },
     handleCell(item) {
@@ -235,7 +235,7 @@ export default {
     .mine-wallet {
       padding: 16rpx 16rpx 10rpx 16rpx;
       box-sizing: border-box;
-      border-bottom: 1rpx solid #d8d8d8;
+      border-bottom: 1rpx solid #ebebeb;
     }
 
     .wallet-data {
@@ -251,6 +251,6 @@ export default {
   }
 }
 ::v-deep .u-cell__title-text {
-  line-height: 60rpx !important;
+  line-height: 50rpx !important;
 }
 </style>

src/pagesMessage/commentNotify.vue

@@ -10,7 +10,7 @@
           />
           <view>
             <view class="text-bold f-s-28" style="margin-bottom: 10rpx">易只烊</view>
-            <view class="f-s-22 text-black">2024年2月5日</view>
+            <view class="f-s-22 text-333">2024年2月5日</view>
           </view>
         </view>
         <u-icon name="arrow-right" color="#efefef" size="15" />
@@ -40,31 +40,31 @@
 </template>
 
 <script>
-  import { getOrderCommentInform , clearInformFlag } from '@/api/client/message.js';
+import { getOrderCommentInform, clearInformFlag } from '@/api/client/message.js';
 export default {
-  data(){
-    return{
-      queryParams:{
-        paging:'1,10',
-        counting:true
-      }
-    }
+  data() {
+    return {
+      queryParams: {
+        paging: '1,10',
+        counting: true,
+      },
+    };
   },
-  mounted(){
-    this.handlerInitList()
+  mounted() {
+    this.handlerInitList();
   },
-  
-  onShow(){
-  	clearInformFlag({type:'COMMENT'}).then(res=>{
-  		console.log("@@@res",res)
-  	})
+
+  onShow() {
+    clearInformFlag({ type: 'COMMENT' }).then(res => {
+      console.log('@@@res', res);
+    });
   },
   methods: {
-    handlerInitList(){
-      getOrderCommentInform(this.queryParams).then(res=>{
-        console.log("@@@@res",res)
-      })
-    }
+    handlerInitList() {
+      getOrderCommentInform(this.queryParams).then(res => {
+        console.log('@@@@res', res);
+      });
+    },
   },
 };
 </script>

src/pagesMessage/orderNotify.vue

@@ -1,16 +1,18 @@
 <template>
   <view class="orderNotice">
-    <view class="order-list" v-for="(item,index) in init_list" :key="index">
-     <view class="fl-flex-item order-top">
+    <view class="order-list" v-for="(item, index) in init_list" :key="index">
+      <view class="fl-flex-item order-top">
         <view class="fl-flex chelvc-chelvc-align-center">
           <image :src="item.orderDetailDTO.orderItemList[0].goodsPic" mode="scaleToFill" />
-          <view class="f-s-28 margin-left-xs">{{ item.orderDetailDTO.orderItemList[0].goodsName }}</view>
+          <view class="f-s-28 margin-left-xs">
+            {{ item.orderDetailDTO.orderItemList[0].goodsName }}
+          </view>
         </view>
         <u-icon name="arrow-right" color="#cbcbcb" size="15" />
       </view>
       <view>
         <view class="fl-flex-item title">
-          <view class="text-bold text-black">订单{{ item.orderType }}</view>
+          <view class="text-bold text-333">订单{{ item.orderType }}</view>
           <view class="f-s-20 text-gray">{{ item.createTimeText }}</view>
         </view>
         <view class="fl-flex content">
@@ -27,58 +29,56 @@
 </template>
 			<!-- 0->待付款；1-已付款；2->待发货；3->已发货；4->已完成；5->已关闭；6->无效订单 -->
 <script>
-  import { getOrderInform , clearInformFlag } from '@/api/client/message.js';
+import { getOrderInform, clearInformFlag } from '@/api/client/message.js';
 export default {
   data() {
     return {
-      queryParams:{
-		paging:'1,10',
-        counting:true
+      queryParams: {
+        paging: '1,10',
+        counting: true,
       },
-	  current:1,
-	  size:10,
-	  init_list:[],
-	  typeEnum:[
-		  { type:0 , name:'待付款' },
-		  { type:1 , name:'已付款' },
-		  { type:2 , name:'待发货' },
-		  { type:3 , name:'已发货' },
-		  { type:4 , name:'已完成' },
-		  { type:5 , name:'已关闭' },
-		  { type:6 , name:'无效订单' },
-	  ]
+      current: 1,
+      size: 10,
+      init_list: [],
+      typeEnum: [
+        { type: 0, name: '待付款' },
+        { type: 1, name: '已付款' },
+        { type: 2, name: '待发货' },
+        { type: 3, name: '已发货' },
+        { type: 4, name: '已完成' },
+        { type: 5, name: '已关闭' },
+        { type: 6, name: '无效订单' },
+      ],
     };
   },
-  mounted(){
-    this.handlerInitList()
+  mounted() {
+    this.handlerInitList();
   },
-  onShow(){
-	  // 已读消息
-	clearInformFlag({type:'ORDER'}).then(res=>{
-	})
+  onShow() {
+    // 已读消息
+    clearInformFlag({ type: 'ORDER' }).then(res => {});
   },
   methods: {
-    handlerInitList(){
-      getOrderInform(this.queryParams).then(res=>{
-		this.init_list = res.data.records
-		this.init_list.map(rs=>{
-			 this.typeEnum.map(rc=>{
-				 if(rs.orderStatus == rc.type){
-					 rs.orderType = rc.name
-				 }
-			 })
-		})
-		this.init_list.map(rs=>{
-			rs.createTimeText = uni.$u.timeFormat(rs.createTime, 'yyyy-mm-dd');
-		})
-      })
-    }
+    handlerInitList() {
+      getOrderInform(this.queryParams).then(res => {
+        this.init_list = res.data.records;
+        this.init_list.map(rs => {
+          this.typeEnum.map(rc => {
+            if (rs.orderStatus == rc.type) {
+              rs.orderType = rc.name;
+            }
+          });
+        });
+        this.init_list.map(rs => {
+          rs.createTimeText = uni.$u.timeFormat(rs.createTime, 'yyyy-mm-dd');
+        });
+      });
+    },
   },
 };
 </script>
 
 <style lang="scss" scoped>
-
 .apostrophe {
   display: -webkit-box;
   overflow: hidden;
@@ -96,7 +96,7 @@ export default {
     border-radius: 20rpx;
     padding: 20rpx;
     margin-bottom: 20rpx;
-	box-shadow: 0 0 15rpx 0 rgba(0,0,0,0.2);
+    box-shadow: 0 0 15rpx 0 rgba(0, 0, 0, 0.2);
     .order-top {
       height: 50rpx;
       border-bottom: 2rpx solid #fbfbfb;