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({
/**
* 页面的初始数据
*/
data: {
startDate: '2025-05-18',
startDate: '',
endDate: '',
orderList: [
{
@@ -30,7 +30,10 @@ Page({
validityPeriod: '2025-01-01~2025-12-12',
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="date-section">
<view class="date-picker">
<picker mode="date" value="{{startDate}}" bindchange="onStartDateChange">
<view class="date-input">
<text class="date-icon">📅</text>
<text class="date-text">{{startDate || '2025.05.18 12'}}</text>
<view class="date-input bg-f8 ulib-r750 font-24">
<text class="date-icon font-20 mr5" style="filter: grayscale(100%);">📅</text>
<text class="date-text">{{startDate || '请选择开始时间'}}</text>
</view>
</picker>
<text class="date-separator">-</text>
<picker mode="date" value="{{endDate}}" bindchange="onEndDateChange">
<view class="date-input">
<text class="date-icon">📅</text>
<view class="date-input bg-f8 ulib-r750 font-24">
<text class="date-icon font-20 mr5" style="filter: grayscale(100%);">📅</text>
<text class="date-text">{{endDate || '请选择结束时间'}}</text>
</view>
</picker>
</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>
</view>
</view>
@@ -27,44 +27,49 @@
<view class="order-list">
<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>
<view class="order-detail-btn" bindtap="viewOrderDetail" data-id="{{item.id}}">
<text>订单详情 ></text>
</view>
</view>
<!-- 客户信息 -->
<view class="customer-info">
<text class="customer-name">{{item.customerName}}</text>
<text class="customer-phone">({{item.customerPhone}})</text>
<view class="points-info">
<text class="points-label">消耗积分:</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 class="inner30">
<!-- 客户信息 -->
<view class="customer-info">
<text class="customer-name">{{item.customerName}}</text>
<text class="customer-phone">({{item.customerPhone}})</text>
<view class="points-info">
<text class="points-label">消耗积分:</text>
<text class="points-value">{{item.points}}</text>
</view>
</view>
<view class="coupon-divider"></view>
<view class="coupon-right">
<text class="coupon-title">{{item.couponTitle}}</text>
<text class="coupon-validity">时限 {{item.validityPeriod}}</text>
<!-- 优惠券信息 -->
<view class="coupon-card">
<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 class="order-time">
<text>下单时间: {{item.orderTime}}</text>
</view>
</view>
<lcb-listmore isLoading='{{loading}}' isEnd='{{end}}' isNoData='{{noData}}'></lcb-listmore>
</view>
<!-- 空状态 -->
pages/customer/score/exchange.wxss
+33 -53
View File
@@ -70,25 +70,26 @@
flex: 1;
display: flex;
align-items: center;
gap: 10px;
gap: 5px;
}
.date-input {
display: flex;
align-items: center;
gap: 5px;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
background-color: #fff;
/* gap: 5px; */
padding: 10rpx 15rpx;
/* border: 1px solid #ddd; */
/* border-radius: 4px; */
/* background-color: #fff; */
width: 210rpx;
}
.date-icon {
font-size: 16px;
/* font-size: 16px; */
}
.date-text {
font-size: 14px;
/* font-size: 14px; */
color: #333;
}
@@ -112,9 +113,9 @@
.order-item {
background-color: #fff;
border-radius: 8px;
margin-bottom: 15px;
padding: 15px;
border-radius: 16rpx;
margin-bottom: 30rpx;
/* padding: 15px; */
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
@@ -123,17 +124,17 @@
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
background-color: #ebf7f5;
overflow: hidden;
}
.order-number {
font-size: 14px;
color: #4CAF50;
/* font-size: 28rpx; */
}
.order-detail-btn {
color: #4CAF50;
font-size: 14px;
/* color: #4CAF50;
font-size: 14px; */
}
/* 客户信息 */
@@ -176,25 +177,30 @@
/* 优惠券卡片 */
.coupon-card {
display: flex;
background: linear-gradient(135deg, #ffebee 0%, #fff 100%);
border-radius: 8px;
overflow: hidden;
background-image: url('https://img.liche.cn/lichebao/coupon-red.png');
width: 650rpx;
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;
position: relative;
}
.coupon-left {
padding: 20px;
/* padding: 20px; */
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-width: 120px;
background-color: #ffebee;
/* background-color: #ffebee; */
}
.coupon-amount {
font-size: 32px;
font-size: 50rpx;
font-weight: bold;
color: #ff4444;
line-height: 1;
@@ -207,40 +213,21 @@
}
.coupon-rules {
font-size: 12px;
color: #666;
color: #ae5151;
}
.coupon-divider {
width: 2px;
background: repeating-linear-gradient(
/* background: repeating-linear-gradient(
to bottom,
transparent 0px,
transparent 5px,
#ddd 5px,
#ddd 10px
);
); */
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 {
flex: 1;
@@ -252,21 +239,14 @@
.coupon-title {
font-size: 18px;
font-weight: 500;
color: #333;
margin-bottom: 8px;
margin-bottom: 15rpx;
}
.coupon-validity {
font-size: 14px;
color: #666;
color: #ae5151;
}
/* 下单时间 */
.order-time {
font-size: 12px;
color: #999;
}
/* 空状态 */
.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'
const app = getApp()
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="text-center pt50 pb50">
<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({
/**
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="inner30">
<view class="box-shadow-000-10-10 ulib-r20 inner30">
project.config.json
+16 -3
View File
@@ -1,7 +1,7 @@
{
"appid": "wx4733380c110313ec",
"compileType": "miniprogram",
"libVersion": "3.5.0",
"libVersion": "3.8.9",
"packOptions": {
"ignore": [],
"include": []
@@ -19,11 +19,24 @@
"disablePlugins": [],
"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": {},
"editorSetting": {
"tabIndent": "insertSpaces",
"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",
"projectname": "lcb",
"setting": {
"compileHotReLoad": true,
"urlCheck": true
},
"condition": {
"miniprogram": {
"list": [
{
"name": "pages/signup/index",
"pathName": "pages/signup/index",
"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",
"name": "pages/customer/index",
"pathName": "pages/customer/score/exchange",
"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
}
}