feat(score): 添加积分页面功能及样式
- 新增积分页面布局和交互逻辑 - 添加自定义图标样式文件 - 实现月份选择器和标签切换功能 - 增加文本斜体样式
This commit is contained in:
@@ -11,4 +11,5 @@
|
||||
.text-shadow{text-shadow:1rpx 3rpx 3rpx rgba(0,0,0,.8);}
|
||||
.text-spacing-10{letter-spacing:10rpx}
|
||||
.space-nowrap{white-space:nowrap;}
|
||||
.space-normal{white-space:normal;}
|
||||
.space-normal{white-space:normal;}
|
||||
.text-italic{font-style: italic;}
|
||||
@@ -11,3 +11,4 @@
|
||||
@import "base/padding.wxss";
|
||||
@import "base/radius.wxss";
|
||||
@import "base/animate.wxss";
|
||||
@import "custom/customIcon.wxss";
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
|
||||
.custom-icon{
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
.custom-icon-filtersearch{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
background-image: url('https://img.liche.cn/lichebao/icon-filtersearch.png');
|
||||
}
|
||||
.custom-icon-logout{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
background-image: url('https://img.liche.cn/lichebao/icon-logout.png');
|
||||
}
|
||||
.custom-icon-scancode{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
background-image: url('https://img.liche.cn/lichebao/icon-scancode.png');
|
||||
}
|
||||
@@ -1,11 +1,33 @@
|
||||
// pages/customer/score/index.js
|
||||
import _ from '../../../commons/js/commons'
|
||||
const app = getApp()
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
imgUrl: _.config.imgUrl,
|
||||
cur_month: '',
|
||||
cur_tab_index: 0,
|
||||
tab_list: [
|
||||
{
|
||||
name: '全部',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
name: '充值',
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
name: '消耗',
|
||||
id: 3
|
||||
}
|
||||
],
|
||||
list: [],
|
||||
loading: true,
|
||||
end: false,
|
||||
noData: false
|
||||
},
|
||||
|
||||
/**
|
||||
@@ -62,5 +84,11 @@ Page({
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
},
|
||||
|
||||
bindDateChange(e){
|
||||
this.setData({
|
||||
cur_month: e.detail.value
|
||||
})
|
||||
}
|
||||
})
|
||||
@@ -1,2 +1,52 @@
|
||||
<!--pages/customer/score/index.wxml-->
|
||||
<text>pages/customer/score/index.wxml</text>
|
||||
<view class="container" style="min-height:100vh; overflow:hidden;">
|
||||
<view class="text-center pt50 pb50">
|
||||
<view class="font-60 text-bold text-italic color-ff0000">8082</view>
|
||||
<view class="color-444 font-28 mt-20">余额</view>
|
||||
</view>
|
||||
<view class="ml30 mr30 pb40">
|
||||
<view class="bg-fff ulib-r10 box-shadow-000-10-10 pb30">
|
||||
<view class="relative fn-flex text-center">
|
||||
<view class="fn-flex-item pt30 pb30">
|
||||
<view class="font-40">8593</view>
|
||||
<view class="font-26 color-666 mt5">充值</view>
|
||||
</view>
|
||||
<view class="fn-flex-item pt30 pb30">
|
||||
<view class="font-40">8593</view>
|
||||
<view class="font-26 color-666 mt5">消耗</view>
|
||||
</view>
|
||||
<view
|
||||
class="bg-picker absolute top-0 box-center bg-no-repeat bg-size-cover bg-pos-cente font-26"
|
||||
style="width:230rpx;height:50rpx;line-height:50rpx;"
|
||||
>
|
||||
<picker mode="date" fields="month" value="{{cur_month}}" start="2015-09" end="2026-09" bindchange="bindDateChange">
|
||||
<view class="color-666"><text class="iconfont icon-qianhetong"></text><text class="ml10">{{cur_month||'请选择月份'}}</text></view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="pl30 pr30 pt30">
|
||||
<view class="fn-flex font-28">
|
||||
<block wx:for="{{tab_list}}" wx:key="index">
|
||||
<view class="pl10 pr10 pt5 pb5 ulib-r10 mr25 transition-all {{index==cur_tab_index?'bg-333 color-fff':'bg-f8 color-333'}}">{{item.name}}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="mt20">
|
||||
<block wx:for="{{10}}" wx:key="index">
|
||||
<view class="bbs-1-eb pt20 pb20 fn-flex font-26">
|
||||
<view class="wp25 color-ff0000 color-36afa2">{{'+40'}}</view>
|
||||
<view class="fn-flex-item text-center">{{'L:138****1234'}}</view>
|
||||
<view class="wp40 text-right">{{'2025.02.25'}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<lcb-listmore isLoading='{{loading}}' isEnd='{{end}}' isNoData='{{noData}}'></lcb-listmore>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
@@ -1 +1,4 @@
|
||||
/* pages/customer/score/index.wxss */
|
||||
/* pages/customer/score/index.wxss */
|
||||
.bg-picker{
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user