作者 卢胜

底部修改

  1 +
1 <template> 2 <template>
2 </template> 3 </template>
3 4
  1 +<<<<<<< HEAD
1 <template> 2 <template>
2 <Botton :flag="2"></Botton> 3 <Botton :flag="2"></Botton>
3 </template> 4 </template>
@@ -14,8 +15,250 @@ @@ -14,8 +15,250 @@
14 15
15 } 16 }
16 } 17 }
  18 +=======
  19 +<template>
  20 + <view class="">
  21 + <view class="absTop"></view>
  22 + <view class="mainBox">
  23 + <view class="exit flexA">
  24 + <image src="/static/exit.png" mode=""></image>
  25 + 退出登录
  26 + </view>
  27 + <view class="topInfo flexA">
  28 + <image src="/static/logo.png" mode=""></image>
  29 + <view class="right">
  30 + <view class="">张小萌</view>
  31 + <view class="">15664000180</view>
  32 + </view>
  33 + </view>
  34 + <view class="money">
  35 + <view class="item">
  36 + <view class="qian"><text style="font-size: 32rpx;">¥</text>600</view>
  37 + <view class="yue">账户余额</view>
  38 + <view class="tixian flexC" @click="totackMoney(1)">提现</view>
  39 + </view>
  40 + <view class="item">
  41 + <view class="qian"><text style="font-size: 32rpx;">¥</text>600</view>
  42 + <view class="yue">保证金</view>
  43 + <view class="tixian flexC" @click="totackMoney(2)">提现</view>
  44 + </view>
  45 + <view class="item">
  46 + <image src="/static/bill.png" mode=""></image>
  47 + <view class="tixian flexC">提现</view>
  48 + </view>
  49 + </view>
  50 + </view>
  51 + <view style="height: 462rpx;"></view>
  52 + <view class="cenBox">
  53 + <view class="item">
  54 + <image src="/static/center1.png" mode=""></image>
  55 + 我买入的
  56 + </view>
  57 + <view class="item">
  58 + <image src="/static/center2.png" mode=""></image>
  59 + 我卖出的
  60 + </view>
  61 + <view class="item">
  62 + <image src="/static/center3.png" mode=""></image>
  63 + 我的发布
  64 + </view>
  65 + <view class="item">
  66 + <image src="/static/center4.png" mode=""></image>
  67 + 我的收藏
  68 + </view>
  69 + </view>
  70 + <view class="botBox">
  71 + <view class="title">更多服务</view>
  72 + <view class="group">
  73 + <view class="item" v-for="(item,idx) in serviceList" :key="idx">
  74 + <image :src="`/static/bot${idx+1}.png`" mode=""></image>
  75 + 我买入的
  76 + </view>
  77 + </view>
  78 + </view>
  79 + <Botton></Botton>
  80 + <!-- <u-modal :show="showCancel" @confirm="confirmCancel" @cancel="showCancel=false" content='您确定要退出登录吗' -->
  81 + </view>
  82 +</template>
  83 +
  84 +<script>
  85 + import Botton from "@/components/Botton.vue"
  86 + export default {
  87 + components: {
  88 + Botton
  89 + },
  90 + data() {
  91 + return {
  92 + serviceList : [
  93 + {name:'联系客服'},
  94 + {name:'品牌入驻'},
  95 + {name:'意见反馈'},
  96 + {name:'常见问题'},
  97 + {name:'我的任务'},
  98 + {name:'我的点赞'},
  99 + {name:'历史记录'},
  100 + {name:'常用地址'},
  101 + ]
  102 + }
  103 + },
  104 + methods: {
  105 + totackMoney(type) {
  106 + uni.navigateTo({
  107 + url:'/pages/mine/withdrawal?type='+type
  108 + })
  109 + }
  110 + },
  111 +>>>>>>> ac29e6eb0d250c1be6656b3a92c39410ed46065d
17 } 112 }
18 </script> 113 </script>
19 114
20 -<style> 115 +<style lang="less">
  116 + page {
  117 + background: rgba(246,246,246,1);
  118 + }
  119 + .absTop {
  120 + position: absolute;
  121 + left: 0;
  122 + top: 0;
  123 + width: 100%;
  124 + height: 306rpx;
  125 + opacity: 1;
  126 + background: linear-gradient(180deg, rgba(255,249,221,1) 0%, rgba(255,249,221,0) 100%);
  127 + z-index: 0;
  128 + }
  129 + .mainBox {
  130 + position: absolute;
  131 + left: 0;
  132 + top: 0;
  133 + padding: 28rpx 32rpx;
  134 + box-sizing: border-box;
  135 + .exit {
  136 + justify-content: flex-end;
  137 + image {
  138 + width: 40rpx;
  139 + height: 40rpx;
  140 + }
  141 + color: rgba(0,0,0,1);
  142 + font-size: 24rpx;
  143 + font-weight: 400;
  144 + }
  145 + .topInfo {
  146 + image {
  147 + margin-right: 24rpx;
  148 + width: 108rpx;
  149 + height: 108rpx;
  150 + border-radius: 50%;
  151 + }
  152 + view:nth-child(1){
  153 + margin: 8rpx 0;
  154 + font-size: 32rpx;
  155 + font-weight: 700;
  156 + }
  157 + view:nth-child(2){
  158 + color: rgba(0,0,0,0.9);
  159 + font-size: 28rpx;
  160 + }
  161 + }
  162 + .money {
  163 + display: flex;
  164 + justify-content: space-around;
  165 + margin: 32rpx auto 24rpx;
  166 + width: 702rpx;
  167 + height: 250rpx;
  168 + border-radius: 24rpx;
  169 + opacity: 1;
  170 + background: rgba(255,255,255,1);
  171 + .item {
  172 + padding: 32rpx 0;
  173 + width: 144rpx;
  174 + position: relative;
  175 + image {
  176 + width: 80.74rpx;
  177 + height: 75.09rpx;
  178 + }
  179 + display: flex;
  180 + flex-direction: column;
  181 + align-items: center;
  182 + .qian {
  183 + color: rgba(248,83,23,1);
  184 + font-size: 44rpx;
  185 + }
  186 + .yue {
  187 + margin-top: 18rpx;
  188 + color: rgba(0,0,0,0.9);
  189 + font-size: 24rpx;
  190 + }
  191 + .tixian {
  192 + position: absolute;
  193 + left: 0;
  194 + bottom: 32rpx;
  195 + width: 144rpx;
  196 + height: 56rpx;
  197 + border-radius: 50rpx;
  198 + opacity: 1;
  199 + background: rgba(254,208,0,1);
  200 + color: rgba(0,0,0,0.9);
  201 + font-size: 24rpx;
  202 + font-weight: 700;
  203 + }
  204 + }
  205 + }
  206 + }
  207 + .cenBox {
  208 + display: flex;
  209 + justify-content: space-evenly;
  210 + align-items: center;
  211 + margin: 24rpx auto 24rpx;
  212 + width: 702rpx;
  213 + height: 184rpx;
  214 + border-radius: 24rpx;
  215 + background: rgba(255,255,255,1);
  216 + .item {
  217 + display: flex;
  218 + align-items: center;
  219 + flex-direction: column;
  220 + image {
  221 + width: 64rpx;
  222 + height: 64rpx;
  223 + margin-bottom: 16rpx;
  224 + }
  225 + color: rgba(100,101,102,1);
  226 + font-size: 26rpx;
  227 + }
  228 + }
  229 + .botBox {
  230 + margin: 0 auto;
  231 + padding: 32rpx 0;
  232 + box-sizing: border-box;
  233 + width: 702rpx;
  234 + height: 464rpx;
  235 + border-radius: 24rpx;
  236 + opacity: 1;
  237 + background: rgba(255,255,255,1);
  238 + .group {
  239 + display: flex;
  240 + align-items: center;
  241 + flex-wrap: wrap;
  242 + .item {
  243 + width: 176rpx;
  244 + height: 184rpx;
  245 + display: flex;
  246 + align-items: center;
  247 + flex-direction: column;
  248 + }
  249 + image {
  250 + width: 64rpx;
  251 + height: 64rpx;
  252 + margin-bottom: 16rpx;
  253 + }
  254 + color: rgba(100,101,102,1);
  255 + font-size: 26rpx;
  256 + }
  257 + .title {
  258 + margin: 0 0 56rpx 32rpx;
  259 + color: rgba(50,50,51,1);
  260 + font-size: 28rpx;
  261 + font-weight: 700;
  262 + }
  263 + }
21 </style> 264 </style>
1 -<template> 1 +<template>
  2 + <view class="">
  3 + <image class="bg" src="/static/takeMoneyBg.png" mode=""></image>
  4 + <view class="top">
  5 + <view >账户余额:</view>
  6 + <view > <text style="32rpx">¥</text> 600.00</view>
  7 + </view>
  8 + <view class="center">
  9 + <view class="title">提现金额</view>
  10 + <view class="inputPrice">
  11 + <view class="">
  12 + ¥<input type="text" value="" />
  13 + </view>
  14 + <view class="right">全部提现</view>
  15 + </view>
  16 + <view class="title" style="margin-top: 30rpx;">提现方式</view>
  17 + </view>
  18 + </view>
2 </template> 19 </template>
3 20
4 <script> 21 <script>
5 </script> 22 </script>
6 23
7 -<style> 24 +<style lang="less">
  25 + page {
  26 + background: #f6f6f6;
  27 + }
  28 + .bg {
  29 + overflow: hidden;
  30 + position: absolute;
  31 + left: 0;
  32 + top: 0;
  33 + width: 100%;
  34 + height: 366rpx;
  35 + }
  36 + .top {
  37 + position: absolute;
  38 + left: 32rpx;
  39 + top: 64rpx;
  40 + view:nth-child(1) {
  41 + color: rgba(0,0,0,0.4);
  42 + font-size: 28rpx;
  43 + }
  44 + view:nth-child(2) {
  45 + color: rgba(0,0,0,0.9);
  46 + font-size: 64rpx;
  47 + font-weight: 700;
  48 + }
  49 + }
  50 + .center {
  51 + position: absolute;
  52 + width: 686rpx;
  53 + left: 50%;
  54 + top: 220rpx;
  55 + border-radius: 24rpx;
  56 + padding: 40rpx 32rpx;
  57 + transform: translateX(-50%);
  58 + background: #fff;
  59 + box-sizing: border-box;
  60 + .title {
  61 + font-weight: 700;
  62 + margin-bottom: 32rpx;
  63 + font-weight: 700;
  64 + }
  65 + .inputPrice {
  66 + display: flex;
  67 + justify-content: space-between;
  68 + align-items: center;
  69 + view {
  70 + font-weight: 700;
  71 + display: flex;
  72 + align-items: center;
  73 + font-size: 52rpx;
  74 + input {
  75 + margin-left: 20rpx;
  76 + font-weight: 400;
  77 + }
  78 + }
  79 + .right {
  80 + color: rgba(33,83,212,1);
  81 + font-size: 28rpx;
  82 + font-weight: 400;
  83 + }
  84 + }
  85 + }
8 </style> 86 </style>