From b607dd1a19c8d06f8e4071dd14680211d4312165 Mon Sep 17 00:00:00 2001
From: zhangdongxue <zhangdongxue@uz.cn>
Date: Sat, 25 Sep 2021 16:05:23 +0800
Subject: [PATCH] =?UTF-8?q?'=E7=A2=8E=E7=89=87=E8=AE=B0=E5=BD=95'?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                  |  12 +-
 pages/user/index.vue        |   4 +-
 pages/wallet/extract.vue    |  16 +-
 pages/wallet/fragment.vue   | 336 ++++++++++++++++++++++++++++++++++++
 pages/wallet/property.vue   |  15 +-
 scss/globa.scss             |   2 +-
 static/imgs/account-bg.png  | Bin 0 -> 2921 bytes
 static/imgs/record-icon.png | Bin 0 -> 1071 bytes
 8 files changed, 365 insertions(+), 20 deletions(-)
 create mode 100644 pages/wallet/fragment.vue
 create mode 100644 static/imgs/account-bg.png
 create mode 100644 static/imgs/record-icon.png

diff --git a/pages.json b/pages.json
index 4c6acb9..0fccc91 100644
--- a/pages.json
+++ b/pages.json
@@ -184,7 +184,17 @@
 			"navigationBarTextStyle": "white"
 		},
 		"name": "ResetPassword"
-	} ],
+	},{
+		"path": "pages/wallet/fragment",
+		"style": {
+			"navigationBarTitleText": "能量碎片记录",
+			"enablePullDownRefresh": false,
+			"navigationBarBackgroundColor": "#774ffd",
+			"navigationBarTextStyle": "white"
+		},
+		"name": "Fragment"
+	}
+	],
 	"globalStyle": {
 		"navigationStyle": "custom",
 		"backgroundColor": "#F5F5F5"
diff --git a/pages/user/index.vue b/pages/user/index.vue
index c996934..453afb5 100644
--- a/pages/user/index.vue
+++ b/pages/user/index.vue
@@ -135,8 +135,8 @@
                             <view class="assets-label-name">能量球钱包<image @click.stop="showHelp('wallet')" class="assets-label-icon" src="/static/user/userAssets_tips.png"></image></view>
                             <view class="assets-label-number">{{userData.account.coins || 0}}</view>
                         </view>
-                        <view class="assets-label">
-                            <view class="assets-label-name">能量碎片<image @click="showHelp('chip')" class="assets-label-icon" src="/static/user/userAssets_tips.png"></image></view>
+                        <view class="assets-label" @click="$Router.push({name:'Fragment'})">
+                            <view class="assets-label-name">能量碎片<image @click.stop="showHelp('chip')" class="assets-label-icon" src="/static/user/userAssets_tips.png"></image></view>
                             <view class="assets-label-number">{{userData.account.score || 0}}</view>
                         </view>
                     </view>
diff --git a/pages/wallet/extract.vue b/pages/wallet/extract.vue
index 1823bf8..afd839a 100644
--- a/pages/wallet/extract.vue
+++ b/pages/wallet/extract.vue
@@ -1,7 +1,7 @@
 <template>
   <view class="WithdrawingCoin ">
     <view class="withdrawing-content">
-      <view class="item-name">账户能量球将提现到银行卡</view>
+      <view class="item-name">能量球提现至银行卡</view>
       <view class="item">
         <view style="flex: 1;">
           <input class="input_num" v-model="withdraw_input" @input='inputNum' type="number"
@@ -254,7 +254,7 @@
   }
 
   .all {
-    color: $mian-color;
+    color: $text-price;
     width: 160rpx;
     text-align: center;
   }
@@ -264,8 +264,8 @@
     background-color: #fff;
     box-shadow: 0 0 30rpx 1rpx rgba($color: #000000, $alpha: 0.2);
     margin: $margin*1.4;
-    border-radius: $radius*1.5;
-    padding: $padding*1.4;
+    border-radius: 20rpx;
+    padding: $padding*1.4 ;
     font-size: $title-size-m;
 
     .item-name {
@@ -274,7 +274,7 @@
       color: #303030;
       font-weight: bold;
       margin-bottom: $margin;
-      font-size: $title-size *1.4;
+      font-size: $title-size *1.2;
     }
 
     .item {
@@ -305,7 +305,7 @@
       flex-direction: row;
       align-items: center;
       justify-content: space-between;
-      padding: $padding*2 0 0 0;
+      padding: $padding*1 0 0 0;
       color: #3a3a3a;
 
       .total {
@@ -331,9 +331,9 @@
     // background-color: $text-price;
 	background-image: linear-gradient(to right, $text-price, $mian-color);
     color: #fff;
-    border-radius: 50rpx;
+    border-radius: 20rpx;
     text-align: center;
-    padding: $padding ;
+    padding: $padding * .7 ;
     margin: $margin * 2;
     font-size: $title-size;
     font-weight: bold;
diff --git a/pages/wallet/fragment.vue b/pages/wallet/fragment.vue
new file mode 100644
index 0000000..c6a780d
--- /dev/null
+++ b/pages/wallet/fragment.vue
@@ -0,0 +1,336 @@
+<template>
+	<view class="Record">
+		<view class="record-top">
+			<image src="/static/imgs/account-bg.png" mode="widthFix" class="record-bg" />
+			<view class="record-top-nav">
+				<view :class="['record-top-item',type==='year'?'selectTopItem':'']" 
+				@click="selectType('year')">年账单</view>
+				<view :class="['record-top-item',type==='month'?'selectTopItem':'']" 
+				@click="selectType('month')">月账单</view>
+				<view :class="['record-top-item',type==='day'?'selectTopItem':'']" 
+				@click="selectType('day')">日账单</view>
+			</view>
+			<view class="record-mouth-year">
+				<view class="record-type-right">
+					<view class="record-title">碎片个数</view>
+					<view class="record-money">{{account || '0.00'}} <span>个</span> </view>
+				</view>
+				<view class="record-type-left">
+					<u-picker mode="time" v-model="show" :params="params" 
+					@confirm ='confirm' title ='筛选日期' start-year='2021' :end-year='currentYear'/>
+					<view @click="show = true">
+						{{date?date:'选择日期'}}
+						<uni-icons type="arrowdown" color="#fff" size="12" />
+					</view>
+				</view>
+			</view>
+			<!-- <view class="record-title">碎片个数</view>
+			<view class="record-money"><span>￥</span>{{account || '0.00'}}</view> -->
+		</view>
+		
+		<!-- 列表。。。 -->
+		<view class="record-list" v-if="lists.length>0">
+			<view class="record-list-item" v-for="(item,index) in lists" :key='index'>
+				<image src="/static/imgs/record-icon.png" mode="widthFix" class="record-icon" />
+				<view class="">
+					<view class="record-list-item-top">
+						<view class="title ellipsis-1">完成任务获得碎片完成任务获得碎片完成任务获得碎片完成任务获得碎片完成任务获得碎片完成任务获得碎片</view>
+						<view class="money" >{{cointype==='in'?'+':'-'}}5</view>
+					</view>
+					<view class="record-list-item-date">2021-12-22 12:12:12</view>
+				</view>
+			</view>
+		</view>
+		<!-- 无列表 -->
+		<no-list v-if="lists.length === 0" name='no-record' txt="没有任何碎片记录 ~ " />
+		
+		<!-- <u-toast ref="uToast" /> -->
+		<u-toast ref="uToast" />
+	</view>
+</template>
+
+<script>
+	import {chaineb} from '@/apis/interfaces/mine';
+	export default {
+		data() {
+			return {
+				lists:[1,1.1,1,1],
+				has_next_page:true,
+				page:1,
+				type:'year', // 统计类型day日，month月，year年
+				cointype:'in',// in 收入 out 支出
+				date:new Date().toISOString().slice(0,4), // 日：Y-m-d，月Y-m，年Y
+				params: {
+					year: true,
+					month: false,
+					day: false
+				},
+				show: false, // 显示
+				currentDay:new Date().toISOString().slice(0,10),
+				currentMonth:new Date().toISOString().slice(0,7),
+				currentYear:new Date().toISOString().slice(0,4),
+				account:''
+			}
+		},
+		onLoad(){
+			this.getList()
+		},
+		onReachBottom(){
+			if (this.has_next_page) {
+			  this.page = this.page + 1
+			  this.getList()
+			} else {
+			  this.$refs.uToast.show({
+			    title: '吼吼吼~我是有底的~',
+			    type: 'primary',
+			    duration: 3000
+			  })
+			}
+		},
+		methods: {
+			// 获取列表
+			getList(){
+				let data = {
+					page:this.page,
+					type:this.type,
+					date:this.date,
+					cointype:this.cointype
+				}
+				chaineb(data).then(res => {
+					this.account = res.account
+					this.lists = this.lists.concat(res.lists)
+					this.has_next_page = res.has_next_page
+				}).catch(err => {
+					this.$refs.uToast.show({
+						title: err.message,
+						type: 'primary',
+						duration: 3000
+					})
+				})
+			},
+			selectCoinType(type){
+				if(this.cointype !== type){
+					this.cointype = type
+					this.reset()
+				}
+			},
+			// 重置
+			reset(){
+				this.page = 1
+				this.lists = []
+				this.has_next_page = true
+				this.getList()
+			},
+			// 选择 年  月  日 切换要重置数据
+			selectType(type){
+				if(this.type !== type){
+					switch(type){
+						case 'year':
+							this.type = type
+							this.params= {
+								year: true,
+								month: false,
+								day: false
+							}
+							this.date = this.currentYear
+							this.reset()
+							break;
+						case 'month':
+							this.type = type
+							this.params= {
+								year: true,
+								month: true,
+								day: false
+							}
+							this.date = this.currentMonth
+							this.reset()
+							break;
+						case 'day':
+							this.type = type
+							this.params= {
+								year: true,
+								month: false,
+								day: false
+							}
+							this.date = this.currentDay
+							this.reset()
+							break;
+					}
+				}
+			},
+			// 点击确认按钮
+			confirm(e){
+				let type = this.type
+				switch(type){
+					case 'year':
+						this.date = e.year
+						this.reset()
+						break;
+					case 'month':
+						this.date = e.year + '-' + e.month
+						this.reset()
+						break;
+					case 'day':
+						this.date = e.year + '-' + e.month + '-' + e.day
+						this.reset()
+						break;
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.Record {
+		width: 100%;
+		height: 100vh;
+		padding-top: 30rpx;
+		background-color: #fff;
+	}
+
+	.record-top {
+		width: calc(100% - 60rpx);
+		height: 360rpx;
+		background-image: linear-gradient(to right, #7c52fc, #976dff);
+		box-shadow: 0 10rpx 20rpx 0rpx rgba($color: #976dff, $alpha: 0.4);
+		margin: 0 30rpx;
+		border-radius: 20rpx;
+		box-sizing: border-box;
+		position: relative;
+		padding: 10rpx 50rpx 20rpx 50rpx;
+		z-index: 1;
+
+		.record-bg {
+			position: absolute;
+			width: 100%;
+			bottom: 0;
+			right: 0;
+			z-index: 1;
+		}
+
+		.record-top-nav {
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+			justify-content: center;
+			box-sizing: border-box;
+
+			.record-top-item {
+				margin: 40rpx 20rpx;
+				font-size: 30rpx;
+				font-weight: 500;
+				color: #fff;
+			}
+			.selectTopItem{
+				border-bottom: solid 4rpx #fff;
+			}
+		}
+
+		.record-mouth-year {
+			display: flex;
+			flex-direction: row;
+			align-items: flex-start;
+			justify-content: space-between;
+			box-sizing: border-box;
+			position: relative;
+			z-index: 2;
+			color: #fff;
+			font-size: 30rpx;
+			margin-top: 20rpx;
+
+			.record-type-left {
+				display: flex;
+				flex-direction: row;
+				align-items: center;
+				justify-content: flex-start;
+				box-sizing: border-box;
+
+				uni-icons {
+					margin-left: 4rpx;
+				}
+			}
+
+			.record-type-right {
+				display: flex;
+				flex-direction: column;
+				align-items: flex-start;
+				justify-content: flex-start;
+				box-sizing: border-box;
+				font-size: 24rpx;
+				flex: 1;
+
+				.pay_type_item {
+					margin: 0 10rpx;
+					padding: 2rpx 20rpx;
+					border-radius: 30rpx;
+					border: solid 1rpx rgba($color: #000000, $alpha: 0);
+				}
+				.pay_type_item_select{
+					border: solid 1rpx #f7f7f7;
+				}
+			}
+		}
+
+		.record-title {
+			font-size: 28rpx;
+			color: #fff;
+			padding:0 0 20rpx 0;
+		}
+
+		.record-money {
+			color: #fff;
+			font-size: 60rpx; 
+			font-weight: bold;
+
+			span {
+				font-size: 24rpx;
+				font-weight: 400;
+				padding-left: 20rpx;
+				margin-right: 4rpx;
+			}
+		}
+	}
+
+	.record-list {
+		padding: 20rpx 30rpx;
+
+		.record-list-item {
+			padding: 20rpx 0;
+			border-bottom: solid 1rpx #f7f7f7;
+			display: flex;
+			flex-direction: row;
+			align-items: flex-start;
+			justify-content: flex-start;
+			box-sizing: border-box;
+			.record-icon{
+				width: 60rpx;
+				margin-right: 20rpx;
+			}
+			.record-list-item-top {
+				display: flex;
+				flex-direction: row;
+				align-items: center;
+				justify-content: space-between;
+				box-sizing: border-box;
+				width: 600rpx;
+
+				.title {
+					font-size: 30rpx;
+					width: 600rpx;
+				}
+
+				.money {
+					color: #ee4c47;
+					font-size: 32rpx;
+					font-weight: bold;
+				}
+			}
+
+			.record-list-item-date {
+				font-size: 24rpx;
+				color: #a6a6a6;
+				margin-top: 10rpx;
+			}
+		}
+	}
+</style>
diff --git a/pages/wallet/property.vue b/pages/wallet/property.vue
index 5583158..25d426d 100644
--- a/pages/wallet/property.vue
+++ b/pages/wallet/property.vue
@@ -266,8 +266,8 @@
 			}
 
 			.balance {
-				font-size: $title-size * 2;
-				padding: ($padding / 2) 0;
+				font-size: $title-size * 2.5;
+				padding: $padding 0;
 				color: white;
 			}
 
@@ -275,18 +275,17 @@
 				background: rgba($color: #000000, $alpha: .1);
 				color: rgba($color: white, $alpha: .7);
 				display: inline-block;
-				padding: 0 $padding;
-				font-size: $title-size-m;
-				height: 50rpx;
-				line-height: 50rpx;
+				font-size: 24rpx;
+				padding: 6rpx $padding;
 				border-radius: $radius-m;
 				border: solid 1rpx rgba($color: white, $alpha: .4)
+				
 			}
 
 			.balance-flex {
 				display: flex;
 				justify-content: center;
-				margin-top: $margin * 3;
+				margin-top: $margin * 2;
 
 				.balance-flex-item {
 					background-color: white;
@@ -296,7 +295,7 @@
 					color: $text-price;
 					margin: 0 $margin;
 					border-radius: $radius-m;
-					font-size: $title-size;
+					font-size: 28rpx;
 				}
 			}
 		}
diff --git a/scss/globa.scss b/scss/globa.scss
index f63b05f..e4906a3 100644
--- a/scss/globa.scss
+++ b/scss/globa.scss
@@ -76,7 +76,7 @@ $padding: 30rpx;
 	-webkit-line-clamp: 2;
 }
 
-.ellipsis {
+.ellipsis-1 {
 	overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
diff --git a/static/imgs/account-bg.png b/static/imgs/account-bg.png
new file mode 100644
index 0000000000000000000000000000000000000000..166699cf2c24b180582e03d09d049d39f3aeec51
GIT binary patch
literal 2921
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
Q5eA%fbUXd(RM5@;0Q&yWSpWb4

literal 0
HcmV?d00001

diff --git a/static/imgs/record-icon.png b/static/imgs/record-icon.png
new file mode 100644
index 0000000000000000000000000000000000000000..4480415394419c9f833560fe9e45d01e9273298f
GIT binary patch
literal 1071
zcmV+~1kn45P)<h;3K|Lk000e1NJLTq004jh004jp0{{R3^x%>C0000*P)t-s0001k
zMBs));DbWpg+k$lL*Ru&;e|utghJtkL*a!(;Dtlsg+t(lL*a!(;Dkftf<@wmL*a%&
z;e|uthC$$jL*Ru&;EX6@w*UYD7IachQvg4|e~d@m$Wmdp=&sZ7B@=QpqaB-^P}$@F
z00V<bL_t(|+TEMmwxb{nK!aQq@Lrq$|I}HlJ!|DmTU!#fab`c9rykith=>71j3&BN
zcOmzPeGXlnTr?wm2V<*@FUgfPa4g;?{6MlE4#K;DMFi&$Y+c8pNysKOuotmH5mnr$
z`5ML4+ZE;(H_^_p35%PtAg8Hu2kK_y?Q3<y(Bf{igP{8Z?nr3F-LEtZSKOT|Fi3a+
z35x0P5IQKN$Ajphh>VAkp@0exq=Jt)JQSzYKH((!=X)8c!7tFjDnr085C&MI#jnsR
z1pr|c0-z)eYFy_MXDDa!Q;+YcxdSi(m!;+o!i=i~kl^qgGiL@2AR@D7LX@R0c~*<%
z5jca8juD3u*8wRPMi*4?7E)4T`O=_y`$H+FJR2nqfkeObs3Cx!a)yooEsg?Ppcx+8
zYDT_5pb_8-)QI*WjaF;{8Ux1_ur!Zp!W+JTD;R+{x90zPlg)x22s8ra0yJ&&@T+~a
zTmiZV%NJO>TaFxQ04;C@=)Wqa09`vhwa*ZsYa>^H^8A(B7YQJR084-d?&mK^1$@C`
zy!yC{V?iunDFj$~;6}nb_6{=-(8V)XV8GW*0)Y%LB3EF-*R%ow9Ko;!%#J;P1|nMk
zri?GREE0hTjx9huO#!}ugQP2vpw<<rp%VxU=FUyP{2&wPAn*m+l}kwk0%W$pyyrB`
z(6a^nT0lz#dJyccURJ_MB7lq@AeQ}tu!mlE8upNN1u_I(fxt{e&)X_~n?ScI6%RdL
zU~4K)0s&%yjRHyfI3~6}j-#$X1fwfp1dGyTa<8yPA}|V;<pEb{_ySq*V&ZX)i|ob3
zY6@8Tna&X0;$~YA5?=Uv4oPPk(q^gE6R;FjIs%@eN<|>ZHYyia{lblM0Vmq39iDDO
zEZ`-Z)z2|IO9g^#yMDq4MyY@kez2&YUPy!jUi!(VvA>WnO4FG>T0!+)f#>VS?+e7z
zPqzW2Oq>#eh^vf;e7cS0pYII_$*e+_SyBfmuV9!tB^(n-SlD$m^}bQi6-FS@>{-O(
zdqFjqeWQG_-V_sEi|?>!E#=ZLW>YWc(=TWQxZ=TF6^g2vX|=-x={6Kr{|}|r83>Ky
z>T1)IbUO|})xiB*M?CZox#%DB(Ld;Pf}>vghuuza+)w|&;|Y#@p5V~y36A}q;NbHe
pZ>x_3Z#^7~UqAdVX<YsI{~srV5emHv^&J2J002ovPDHLkV1hgO-$?)f

literal 0
HcmV?d00001