admin/lcb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(score/exchange): 更新积分兑换页面样式和功能

Browse Source 
- 优化日期选择器样式和默认值
- 重新设计优惠券卡片样式
- 添加加载状态和空状态处理
- 更新项目配置和小程序基础库版本
This commit is contained in:
maclien
2025-06-24 23:13:19 +08:00
parent ce2289a1b0
commit eed73239ab
9 changed files with 122 additions and 141 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pages/customer/score/exchange.js
+6 -3
View File
@@ -1,11 +1,11 @@
// pages/customer/score/exchange.js // pages/customer/score/exchange.js 20250624
Page({ Page({
/** /**
* 页面的初始数据 * 页面的初始数据
*/ */
data: { data: {
startDate: '2025-05-18', startDate: '',
endDate: '', endDate: '',
orderList: [ orderList: [
{ {
@@ -30,7 +30,10 @@ Page({
validityPeriod: '2025-01-01~2025-12-12', validityPeriod: '2025-01-01~2025-12-12',
orderTime: '2025-05-10 19:13' orderTime: '2025-05-10 19:13'
} }
] ],
loading: true,
end: false,
noData: false
}, },
/** /**
pages/customer/score/exchange.wxml
+39 -34
View File
@@ -1,24 +1,24 @@
<!--pages/customer/score/exchange.wxml--> <!--pages/customer/score/exchange.wxml 20250624 -->
<view class="container"> <view class="container">
<!-- 日期选择区域 --> <!-- 日期选择区域 -->
<view class="date-section"> <view class="date-section">
<view class="date-picker"> <view class="date-picker">
<picker mode="date" value="{{startDate}}" bindchange="onStartDateChange"> <picker mode="date" value="{{startDate}}" bindchange="onStartDateChange">
<view class="date-input"> <view class="date-input bg-f8 ulib-r750 font-24">
<text class="date-icon">📅</text> <text class="date-icon font-20 mr5" style="filter: grayscale(100%);">📅</text>
<text class="date-text">{{startDate || '2025.05.18 12'}}</text> <text class="date-text">{{startDate || '请选择开始时间'}}</text>
</view> </view>
</picker> </picker>
<text class="date-separator">-</text> <text class="date-separator">-</text>
<picker mode="date" value="{{endDate}}" bindchange="onEndDateChange"> <picker mode="date" value="{{endDate}}" bindchange="onEndDateChange">
<view class="date-input"> <view class="date-input bg-f8 ulib-r750 font-24">
<text class="date-icon">📅</text> <text class="date-icon font-20 mr5" style="filter: grayscale(100%);">📅</text>
<text class="date-text">{{endDate || '请选择结束时间'}}</text> <text class="date-text">{{endDate || '请选择结束时间'}}</text>
</view> </view>
</picker> </picker>
</view> </view>
<view class="search-btn" bindtap="onSearch"> <view class="btn bg-36afa2 color-fff font-26 ulib-r750 pl40 pr40 pt10 pb10" bindtap="onSearch">
<text>搜索</text> <text>搜索</text>
</view> </view>
</view> </view>
@@ -27,44 +27,49 @@
<view class="order-list"> <view class="order-list">
<view class="order-item" wx:for="{{orderList}}" wx:key="id"> <view class="order-item" wx:for="{{orderList}}" wx:key="id">
<!-- 订单编号和详情按钮 --> <!-- 订单编号和详情按钮 -->
<view class="order-header"> <view class="order-header font-26 color-36afa2 pt20 pb20 pl30 pr30">
<text class="order-number">订单编号 {{item.orderNumber}}</text> <text class="order-number">订单编号 {{item.orderNumber}}</text>
<view class="order-detail-btn" bindtap="viewOrderDetail" data-id="{{item.id}}"> <view class="order-detail-btn" bindtap="viewOrderDetail" data-id="{{item.id}}">
<text>订单详情 ></text> <text>订单详情 ></text>
</view> </view>
</view> </view>
<view class="inner30">
<!-- 客户信息 --> <!-- 客户信息 -->
<view class="customer-info"> <view class="customer-info">
<text class="customer-name">{{item.customerName}}</text> <text class="customer-name">{{item.customerName}}</text>
<text class="customer-phone">({{item.customerPhone}})</text> <text class="customer-phone">({{item.customerPhone}})</text>
<view class="points-info"> <view class="points-info">
<text class="points-label">消耗积分:</text> <text class="points-label">消耗积分:</text>
<text class="points-value">{{item.points}}</text> <text class="points-value">{{item.points}}</text>
</view>
</view>
<!-- 优惠券信息 -->
<view class="coupon-card">
<view class="coupon-left">
<text class="coupon-amount">{{item.couponAmount}}</text>
<text class="coupon-unit">元</text>
<view class="coupon-rules" bindtap="viewCouponRules">
<text>使用规则 ></text>
</view> </view>
</view> </view>
<view class="coupon-divider"></view>
<view class="coupon-right"> <!-- 优惠券信息 -->
<text class="coupon-title">{{item.couponTitle}}</text> <view class="coupon-card">
<text class="coupon-validity">时限 {{item.validityPeriod}}</text> <view class="coupon-left text-center">
<view >
<text class="coupon-amount">{{item.couponAmount}}</text>
<text class="coupon-unit">元</text>
</view>
<view class="coupon-rules mt10 font-22" bindtap="viewCouponRules">
<text>使用规则 ></text>
</view>
</view>
<view class="coupon-divider"></view>
<view class="coupon-right">
<text class="coupon-title text-italic text-bold"><text>购车</text><text style="color:#f84803;">补贴</text></text>
<text class="coupon-validity font-22">时限 {{item.validityPeriod}}</text>
</view>
</view>
<!-- 下单时间 -->
<view class="order-time font-24 color-666">
<text>下单时间: {{item.orderTime}}</text>
</view> </view>
</view> </view>
<!-- 下单时间 -->
<view class="order-time">
<text>下单时间: {{item.orderTime}}</text>
</view>
</view> </view>
<lcb-listmore isLoading='{{loading}}' isEnd='{{end}}' isNoData='{{noData}}'></lcb-listmore>
</view> </view>
<!-- 空状态 --> <!-- 空状态 -->
pages/customer/score/exchange.wxss
+33 -53
View File
@@ -70,25 +70,26 @@
flex: 1; flex: 1;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 5px;
} }
.date-input { .date-input {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 5px; /* gap: 5px; */
padding: 8px 12px; padding: 10rpx 15rpx;
border: 1px solid #ddd; /* border: 1px solid #ddd; */
border-radius: 4px; /* border-radius: 4px; */
background-color: #fff; /* background-color: #fff; */
width: 210rpx;
} }
.date-icon { .date-icon {
font-size: 16px; /* font-size: 16px; */
} }
.date-text { .date-text {
font-size: 14px; /* font-size: 14px; */
color: #333; color: #333;
} }
@@ -112,9 +113,9 @@
.order-item { .order-item {
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 16rpx;
margin-bottom: 15px; margin-bottom: 30rpx;
padding: 15px; /* padding: 15px; */
box-shadow: 0 2px 4px rgba(0,0,0,0.1); box-shadow: 0 2px 4px rgba(0,0,0,0.1);
} }
@@ -123,17 +124,17 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
margin-bottom: 15px; background-color: #ebf7f5;
overflow: hidden;
} }
.order-number { .order-number {
font-size: 14px; /* font-size: 28rpx; */
color: #4CAF50;
} }
.order-detail-btn { .order-detail-btn {
color: #4CAF50; /* color: #4CAF50;
font-size: 14px; font-size: 14px; */
} }
/* 客户信息 */ /* 客户信息 */
@@ -176,25 +177,30 @@
/* 优惠券卡片 */ /* 优惠券卡片 */
.coupon-card { .coupon-card {
display: flex; display: flex;
background: linear-gradient(135deg, #ffebee 0%, #fff 100%); background-image: url('https://img.liche.cn/lichebao/coupon-red.png');
border-radius: 8px; width: 650rpx;
overflow: hidden; height: 174rpx;
background-size: 100% 100%;
background-repeat: no-repeat;
/* background: linear-gradient(135deg, #ffebee 0%, #fff 100%); */
/* border-radius: 8px;
overflow: hidden; */
margin-bottom: 15px; margin-bottom: 15px;
position: relative; position: relative;
} }
.coupon-left { .coupon-left {
padding: 20px; /* padding: 20px; */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-width: 120px; min-width: 120px;
background-color: #ffebee; /* background-color: #ffebee; */
} }
.coupon-amount { .coupon-amount {
font-size: 32px; font-size: 50rpx;
font-weight: bold; font-weight: bold;
color: #ff4444; color: #ff4444;
line-height: 1; line-height: 1;
@@ -207,40 +213,21 @@
} }
.coupon-rules { .coupon-rules {
font-size: 12px; color: #ae5151;
color: #666;
} }
.coupon-divider { .coupon-divider {
width: 2px; width: 2px;
background: repeating-linear-gradient( /* background: repeating-linear-gradient(
to bottom, to bottom,
transparent 0px, transparent 0px,
transparent 5px, transparent 5px,
#ddd 5px, #ddd 5px,
#ddd 10px #ddd 10px
); ); */
position: relative; position: relative;
} }
.coupon-divider::before,
.coupon-divider::after {
content: '';
position: absolute;
width: 12px;
height: 12px;
background-color: #f5f5f5;
border-radius: 50%;
left: -5px;
}
.coupon-divider::before {
top: -6px;
}
.coupon-divider::after {
bottom: -6px;
}
.coupon-right { .coupon-right {
flex: 1; flex: 1;
@@ -252,21 +239,14 @@
.coupon-title { .coupon-title {
font-size: 18px; font-size: 18px;
font-weight: 500;
color: #333; color: #333;
margin-bottom: 8px; margin-bottom: 15rpx;
} }
.coupon-validity { .coupon-validity {
font-size: 14px; color: #ae5151;
color: #666;
} }
/* 下单时间 */
.order-time {
font-size: 12px;
color: #999;
}
/* 空状态 */ /* 空状态 */
.empty-state { .empty-state {
pages/customer/score/index.js
+1 -1
View File
@@ -1,4 +1,4 @@
// pages/customer/score/index.js // pages/customer/score/index.js 20250624
import _ from '../../../commons/js/commons' import _ from '../../../commons/js/commons'
const app = getApp() const app = getApp()
Page({ Page({
pages/customer/score/index.wxml
+1 -1
View File
@@ -1,4 +1,4 @@
<!--pages/customer/score/index.wxml--> <!--pages/customer/score/index.wxml 20250624-->
<view class="container" style="min-height:100vh; overflow:hidden;"> <view class="container" style="min-height:100vh; overflow:hidden;">
<view class="text-center pt50 pb50"> <view class="text-center pt50 pb50">
<view class="font-60 text-bold text-italic color-ff0000">8082</view> <view class="font-60 text-bold text-italic color-ff0000">8082</view>
pages/customer/score/recharge.js
+1 -1
View File
@@ -1,4 +1,4 @@
// pages/customer/score/recharge.js // pages/customer/score/recharge.js 20250624
Page({ Page({
/** /**
pages/customer/score/recharge.wxml
+1 -1
View File
@@ -1,4 +1,4 @@
<!-- pages/customer/score/recharge.wxml --> <!-- pages/customer/score/recharge.wxml 20250624-->
<view class="container" style="min-height:100vh; overflow:hidden;"> <view class="container" style="min-height:100vh; overflow:hidden;">
<view class="inner30"> <view class="inner30">
<view class="box-shadow-000-10-10 ulib-r20 inner30"> <view class="box-shadow-000-10-10 ulib-r20 inner30">
project.config.json
+16 -3
View File
@@ -1,7 +1,7 @@
{ {
"appid": "wx4733380c110313ec", "appid": "wx4733380c110313ec",
"compileType": "miniprogram", "compileType": "miniprogram",
"libVersion": "3.5.0", "libVersion": "3.8.9",
"packOptions": { "packOptions": {
"ignore": [], "ignore": [],
"include": [] "include": []
@@ -19,11 +19,24 @@
"disablePlugins": [], "disablePlugins": [],
"outputPath": "" "outputPath": ""
}, },
"condition": false "condition": false,
"compileWorklet": false,
"uglifyFileName": false,
"uploadWithSourceMap": true,
"packNpmManually": false,
"minifyWXSS": true,
"minifyWXML": true,
"localPlugins": false,
"disableUseStrict": false,
"useCompilerPlugins": false,
"swc": false,
"disableSWC": true
}, },
"condition": {}, "condition": {},
"editorSetting": { "editorSetting": {
"tabIndent": "insertSpaces", "tabIndent": "insertSpaces",
"tabSize": 2 "tabSize": 2
} },
"projectname": "lcb",
"simulatorPluginLibVersion": {}
} }
project.private.config.json
+24 -44
View File
@@ -1,56 +1,36 @@
{ {
"description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html", "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
"projectname": "lcb",
"setting": {
"compileHotReLoad": true,
"urlCheck": true
},
"condition": { "condition": {
"miniprogram": { "miniprogram": {
"list": [ "list": [
{ {
"name": "pages/signup/index", "name": "pages/customer/index",
"pathName": "pages/signup/index", "pathName": "pages/customer/score/exchange",
"query": "scene=25lzwSFJ3QcXvMLR6WIE2",
"launchMode": "default",
"scene": 1047
},
{
"name": "待跟进客户",
"pathName": "pages/customer/filterList/index",
"query": "status=1&visit=1&title=待跟进客户",
"launchMode": "default",
"scene": null
},
{
"name": "建卡",
"pathName": "pages/customer/addCard/index",
"query": "status=0",
"launchMode": "default",
"scene": null
},
{
"name": "门店",
"pathName": "pages/index/index",
"query": "biz_id=1",
"launchMode": "default",
"scene": null
},
{
"name": "签到",
"pathName": "pages/signup/index",
"query": "key=9hPReOz0vYQ2qFHG4Nipj",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "pages/login/index",
"query": "", "query": "",
"launchMode": "default", "scene": null,
"scene": null "launchMode": "default"
} }
] ]
} }
},
"libVersion": "3.8.9",
"projectname": "lcb",
"setting": {
"urlCheck": true,
"coverView": true,
"lazyloadPlaceholderEnable": false,
"skylineRenderEnable": false,
"preloadBackgroundData": false,
"autoAudits": false,
"useApiHook": true,
"useApiHostProcess": true,
"showShadowRootInWxmlPanel": true,
"useStaticServer": false,
"useLanDebug": false,
"showES6CompileOption": false,
"compileHotReLoad": true,
"checkInvalidKey": true,
"ignoreDevUnusedFiles": true,
"bigPackageSizeSupport": false
} }
} }