[修改账变]

pages/account/account.js

@@ -11,7 +11,7 @@ Page({
         blockeds    : '',       //待发放余额
         page        : {},       //分页信息
         lodingStats : false,    //加载状态
-        screenArray: [
+        screenArray : [
             {
                 channel: 'all',
                 name: '全部'
@@ -24,8 +24,9 @@ Page({
                 channel: 'out',
                 name: '出账'
             }
-        ],                   //账变记录筛选数组
-        screenIndex: 0       //账变记录筛选index
+        ],                      //账变记录筛选数组
+        screenChannel: '',  //账变记录筛选数组标识
+        screenIndex  : 0       //账变记录筛选index
     },
 
     /**
@@ -38,6 +39,7 @@ Page({
     },
 
     onShow() {
+        console.log(this.data.screenChannel)
         // 获取账变记录
         this.accountInfo();
     },
@@ -46,7 +48,7 @@ Page({
      * 账变记录
      */
     accountInfo(page) {
-        wx.$api.user.logs(this.data.type, page).then(res=>{
+        wx.$api.user.logs(this.data.type, this.data.screenChannel, page).then(res=>{
             //判断金卡、银卡、钻石卡
             let number
             if(this.data.type == "silver") {
@@ -73,6 +75,19 @@ Page({
         })
     },
 
+    /**
+     * 筛选账变记录-条件
+     */
+    screenBind(e) {
+        this.setData({
+            screenIndex  : e.detail.value,
+            screenChannel: this.data.screenArray[e.detail.value].channel
+        })
+
+        // 获取账变记录
+        this.accountInfo();
+    },
+
     /**
      * 页面相关事件处理函数--监听用户下拉动作
      */

pages/account/account.wxml

@@ -23,7 +23,7 @@
 	<view class="integra-cont-title">
 		<view class="integra-cont-name">账变记录</view>
 		<view class="integra-cont-picker">
-			<picker bindchange="screenBind" value="{{screenArray[screenIndex].channel}}" range="{{screenArray}}">
+			<picker bindchange="screenBind" value="{{screenIndex}}" range-key="name" range="{{screenArray}}">
 				{{screenArray[screenIndex].name}}
 			</picker>
 			<image class="integra-cont-icon" src="/static/icon/arrow_down.png"></image>
@@ -33,16 +33,19 @@
 	<view class="integra-list" wx:for="{{accounts}}" wx:key="integras">
 		<view class="integra-text">
 			<view class="integra-title">
-				{{item.title}}
+				<view class="integra-title-tips {{item.channel == 'in' ? 'active' : ''}}">{{item.channel == 'in' ? '入' : '出'}}</view>{{item.title}}
 			</view>
-			<view class="integra-oints">
+			<view class="integra-oints {{item.channel == 'in' ? 'active' : ''}}">
 				{{item.variable}}
 			</view>
 		</view>
+		<view class="integra-remark">
+			{{item.remark}}
+		</view>
 		<view class="integra-date">
 			<view class="integra-time">
-				<text>有效期：</text>
-				{{item.created_at}} 至 {{item.expired_at}}
+				<text>{{item.channel == 'in' ? '有效期：' : '扣除时间：'}}</text>
+				{{item.created_at}}{{item.channel == 'in' ? ' 至 ' + item.expired_at : ''}}
 			</view>
 			<!-- <view class="integra-time">
 				<text>到期时间：</text>

pages/account/account.wxss

@@ -43,6 +43,24 @@
 
 .integra-title {
     margin-bottom: 20rpx;
+    display: flex;
+}
+
+.integra-title-tips {
+    background-color: green;
+    color: #fff;
+    width: 40rpx;
+    height: 40rpx;
+    line-height: 38rpx;
+    text-align: center;
+    border-radius: 50%;
+    margin-right: 10rpx;
+    font-size: 24rpx;
+    transform: scale(0.8);
+}
+
+.integra-title-tips.active {
+    background-color: red;
 }
 
 .integra-number {
@@ -136,23 +154,39 @@
     margin-bottom: 20rpx;
 }
 
-.integra-title {
+.integra-list .integra-title {
     flex: 1;
     font-size: 30rpx;
     display: flex;
+    margin: 0;
 }
 
-.integra-title text {
+/* .integra-title text {
     flex: 1;
-}
+} */
 
 .integra-title image {
     width: 36rpx;
     height: 36rpx;
+    margin: 4rpx 0 0 10rpx;
 }
 
 .integra-oints {
-    color: #f0a479;
+    color: green;
+}
+
+.integra-oints.active {
+    color: red;
+}
+
+.integra-remark {
+    margin-bottom: 20rpx;
+    font-size: 26rpx;
+    color: #4e4e4e;
+    background: #f5f5f5;
+    display: inline-block;
+    padding: 6rpx 20rpx;
+    border-radius: 50rpx;
 }
 
 .integra-date {
@@ -168,6 +202,6 @@
     font-size: 28rpx;
 }
 
-.integra-time text {
+/* .integra-time text {
     color: #000;
-}
+} */