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