tmp
This commit is contained in:
124
pages/escort/agreement.js
Normal file
124
pages/escort/agreement.js
Normal file
@@ -0,0 +1,124 @@
|
||||
const app = getApp()
|
||||
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
agreement: null,
|
||||
loading: true
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
const agreement = app.globalData.agreement
|
||||
if (agreement) {
|
||||
this.setData({
|
||||
agreement: agreement,
|
||||
loading: false
|
||||
})
|
||||
} else {
|
||||
this.setData({ loading: false })
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
return {
|
||||
title: '暖橙陪诊服务协议',
|
||||
path: '/pages/escort/agreement'
|
||||
}
|
||||
},
|
||||
|
||||
// 复制客服邮箱
|
||||
onCopyEmail() {
|
||||
wx.setClipboardData({
|
||||
data: 'service@huashengtec.com',
|
||||
success: () => {
|
||||
wx.showToast({
|
||||
title: '邮箱已复制',
|
||||
icon: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
},
|
||||
fail: () => {
|
||||
wx.showToast({
|
||||
title: '复制失败',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 拨打客服电话
|
||||
onCallPhone() {
|
||||
wx.makePhoneCall({
|
||||
phoneNumber: '18618162956',
|
||||
fail: () => {
|
||||
wx.showToast({
|
||||
title: '拨号失败',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
// 处理联系人行点击
|
||||
onContactTap(e) {
|
||||
const action = e.currentTarget.dataset.action
|
||||
if (action === 'copyEmail') {
|
||||
this.onCopyEmail()
|
||||
} else if (action === 'callPhone') {
|
||||
this.onCallPhone()
|
||||
}
|
||||
}
|
||||
})
|
||||
6
pages/escort/agreement.json
Normal file
6
pages/escort/agreement.json
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"navigationBarTitleText": "陪诊服务协议",
|
||||
"usingComponents": {
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
}
|
||||
}
|
||||
62
pages/escort/agreement.wxml
Normal file
62
pages/escort/agreement.wxml
Normal file
@@ -0,0 +1,62 @@
|
||||
<!--pages/escort/agreement.wxml-->
|
||||
<view class="container">
|
||||
<view wx:if="{{loading}}" class="loading">加载中...</view>
|
||||
<block wx:if="{{!loading && agreement}}">
|
||||
<view class="header-section">
|
||||
<view class="header-icon-wrap">
|
||||
<t-icon name="file-1" size="48rpx" class="header-icon" />
|
||||
</view>
|
||||
<text class="header-title">{{agreement.title}}</text>
|
||||
<text class="header-subtitle">{{agreement.subtitle}}</text>
|
||||
</view>
|
||||
|
||||
<view class="agreement-card">
|
||||
<view wx:for="{{agreement.sections}}" wx:key="number" class="section">
|
||||
<view class="section-title">
|
||||
<view class="section-number">{{item.number}}</view>
|
||||
<text>{{item.title}}</text>
|
||||
</view>
|
||||
<view class="section-content">
|
||||
<!-- list / mixed 类型的 items -->
|
||||
<block wx:if="{{item.type === 'list' || item.type === 'mixed'}}">
|
||||
<view wx:for="{{item.items}}" wx:for-item="subItem" wx:for-index="subIdx" wx:key="subIdx" class="list-item">
|
||||
<view class="list-dot"></view>
|
||||
<text class="list-text">{{subItem}}</text>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- mixed 类型下的表格 -->
|
||||
<block wx:if="{{item.type === 'mixed' && item.table}}">
|
||||
<view class="refund-table">
|
||||
<view class="table-row header">
|
||||
<text wx:for="{{item.table.headers}}" wx:for-item="h" wx:key="*this" class="table-cell">{{h}}</text>
|
||||
</view>
|
||||
<view wx:for="{{item.table.rows}}" wx:for-item="row" wx:key="*this" class="table-row">
|
||||
<text wx:for="{{row}}" wx:for-item="cell" wx:key="*this" class="table-cell">{{cell}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- paragraph 类型 -->
|
||||
<block wx:if="{{item.type === 'paragraph'}}">
|
||||
<text class="paragraph">{{item.content}}</text>
|
||||
</block>
|
||||
|
||||
<!-- contact 类型 -->
|
||||
<block wx:if="{{item.type === 'contact'}}">
|
||||
<view class="contact-info">
|
||||
<view wx:for="{{item.contacts}}" wx:for-item="contact" wx:key="text" class="contact-row" bindtap="onContactTap" data-action="{{contact.action}}">
|
||||
<t-icon name="{{contact.icon}}" size="28rpx" class="contact-icon" />
|
||||
<text class="contact-text">{{contact.text}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="footer-section">
|
||||
<text wx:for="{{agreement.footer}}" wx:key="*this" class="footer-text">{{item}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
264
pages/escort/agreement.wxss
Normal file
264
pages/escort/agreement.wxss
Normal file
@@ -0,0 +1,264 @@
|
||||
/* pages/escort/agreement.wxss */
|
||||
page {
|
||||
background-color: #FAF6F1;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
padding-bottom: 48rpx;
|
||||
}
|
||||
|
||||
/* 顶部标题区 */
|
||||
.header-section {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #FFF8F0 100%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 48rpx 32rpx 40rpx;
|
||||
}
|
||||
|
||||
.header-icon-wrap {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
box-shadow: 0 8rpx 24rpx rgba(212, 168, 83, 0.25);
|
||||
}
|
||||
|
||||
.header-icon {
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
font-size: 40rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
|
||||
.header-subtitle {
|
||||
font-size: 26rpx;
|
||||
color: #9CA3AF;
|
||||
margin-top: 12rpx;
|
||||
}
|
||||
|
||||
/* 协议内容卡片 */
|
||||
.agreement-card {
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
/* 章节 */
|
||||
.section {
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.section:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #1F2937;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.section-number {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: 16rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.section-content {
|
||||
padding-left: 36rpx;
|
||||
}
|
||||
|
||||
.paragraph {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #4B5563;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* 列表项 */
|
||||
.list-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.list-item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.list-dot {
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
background: #D4A853;
|
||||
border-radius: 50%;
|
||||
margin-top: 14rpx;
|
||||
margin-right: 16rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.list-text {
|
||||
font-size: 28rpx;
|
||||
color: #4B5563;
|
||||
line-height: 1.7;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
/* 流程步骤 */
|
||||
.flow-steps {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flow-step {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.step-badge {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.step-info {
|
||||
flex: 1;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.step-title {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
color: #1F2937;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
|
||||
.step-desc {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #6B7280;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.step-line {
|
||||
width: 2rpx;
|
||||
height: 40rpx;
|
||||
background: #E5E7EB;
|
||||
margin-left: 21rpx;
|
||||
margin-top: 4rpx;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
|
||||
/* 联系信息 */
|
||||
.contact-info {
|
||||
margin-top: 20rpx;
|
||||
background: #FAF6F1;
|
||||
border-radius: 16rpx;
|
||||
padding: 24rpx;
|
||||
}
|
||||
|
||||
.contact-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.contact-row:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.contact-icon {
|
||||
color: #D4A853;
|
||||
margin-right: 12rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.contact-text {
|
||||
font-size: 28rpx;
|
||||
color: #4B5563;
|
||||
}
|
||||
|
||||
/* 退订违约金表格 */
|
||||
.refund-table {
|
||||
margin-top: 20rpx;
|
||||
background: #FAF6F1;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
border: 1rpx solid #F0E6D8;
|
||||
}
|
||||
|
||||
.table-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 24rpx;
|
||||
border-bottom: 1rpx solid #F0E6D8;
|
||||
}
|
||||
|
||||
.table-row:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.table-row.header {
|
||||
background: #FFF8F0;
|
||||
}
|
||||
|
||||
.table-row.header .table-cell {
|
||||
font-weight: 600;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
.table-cell {
|
||||
flex: 1;
|
||||
font-size: 26rpx;
|
||||
color: #4B5563;
|
||||
line-height: 1.5;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.table-cell:first-child {
|
||||
flex: 1.2;
|
||||
}
|
||||
|
||||
/* 底部信息 */
|
||||
.footer-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: 16rpx;
|
||||
padding: 0 32rpx;
|
||||
}
|
||||
|
||||
.footer-text {
|
||||
font-size: 24rpx;
|
||||
color: #9CA3AF;
|
||||
line-height: 1.6;
|
||||
}
|
||||
@@ -2,5 +2,5 @@
|
||||
"usingComponents": {
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
},
|
||||
"navigationBarTitleText": "服务详情"
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
<text class="total-label">合计：</text>
|
||||
<text class="total-price">¥{{totalPrice}}</text>
|
||||
</view>
|
||||
<button class="order-btn" bindtap="openOrderPopup">立即下单</button>
|
||||
<button class="order-btn" bindtap="openOrderPopup">预 约</button>
|
||||
</view>
|
||||
|
||||
<!-- 下单弹窗遮罩 -->
|
||||
@@ -80,7 +80,7 @@
|
||||
<!-- 下单弹窗 -->
|
||||
<view class="popup-content {{showOrderPopup ? 'show' : ''}}">
|
||||
<view class="popup-header">
|
||||
<text class="popup-title">确认订单</text>
|
||||
<text class="popup-title">确认预约信息</text>
|
||||
<view class="popup-close" bindtap="closeOrderPopup">
|
||||
<t-icon name="close" size="40rpx" />
|
||||
</view>
|
||||
@@ -173,7 +173,7 @@
|
||||
<text class="popup-price-label">合计：</text>
|
||||
<text class="popup-price-value">¥{{totalPrice}}</text>
|
||||
</view>
|
||||
<button class="popup-submit-btn" bindtap="submitOrder">提交订单</button>
|
||||
<button class="popup-submit-btn" bindtap="submitOrder">提交预约</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -52,7 +52,7 @@ page {
|
||||
}
|
||||
|
||||
.service-tag {
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 22rpx;
|
||||
padding: 4rpx 16rpx;
|
||||
@@ -66,13 +66,13 @@ page {
|
||||
|
||||
.price-symbol {
|
||||
font-size: 28rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.service-price {
|
||||
font-size: 44rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@@ -107,7 +107,7 @@ page {
|
||||
}
|
||||
|
||||
.card-icon {
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
|
||||
@@ -137,7 +137,7 @@ page {
|
||||
.flow-number {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
@@ -183,7 +183,7 @@ page {
|
||||
.notice-dot {
|
||||
width: 12rpx;
|
||||
height: 12rpx;
|
||||
background: #FF9B33;
|
||||
background: #D4A853;
|
||||
border-radius: 50%;
|
||||
margin-top: 12rpx;
|
||||
flex-shrink: 0;
|
||||
@@ -230,17 +230,17 @@ page {
|
||||
|
||||
.total-price {
|
||||
font-size: 40rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.order-btn {
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
padding: 24rpx 56rpx;
|
||||
border-radius: 40rpx;
|
||||
border-radius: 20rpx;
|
||||
border: none;
|
||||
line-height: 1.5;
|
||||
}
|
||||
@@ -352,7 +352,7 @@ page {
|
||||
.order-service-price {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
@@ -475,12 +475,12 @@ page {
|
||||
|
||||
.popup-price-value {
|
||||
font-size: 40rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.popup-submit-btn {
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
|
||||
@@ -1,66 +1,32 @@
|
||||
// pages/escort/itemlist.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
services: []
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
|
||||
const app = getApp()
|
||||
this.setData({
|
||||
services: app.globalData.services
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
goToDetail(e) {
|
||||
const id = e.currentTarget.dataset.id;
|
||||
wx.navigateTo({
|
||||
url: `/pages/escort/itemdetail?id=${id}`
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
onBook(e) {
|
||||
const id = e.currentTarget.dataset.id;
|
||||
wx.navigateTo({
|
||||
url: `/pages/escort/itemdetail?id=${id}`
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
goToAgreement() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/escort/agreement'
|
||||
});
|
||||
}
|
||||
})
|
||||
});
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "助诊服务"
|
||||
}
|
||||
@@ -1,2 +1,54 @@
|
||||
<!--pages/escort/itemlist.wxml-->
|
||||
<text>pages/escort/itemlist.wxml</text>
|
||||
<view class="container">
|
||||
|
||||
<!-- 页面头部 -->
|
||||
<view class="page-header">
|
||||
<view class="header-title-wrap">
|
||||
<view class="header-accent"></view>
|
||||
<text class="header-title">陪诊服务</text>
|
||||
</view>
|
||||
<text class="header-subtitle">专业 · 贴心 · 安心</text>
|
||||
|
||||
<view class="intro-card">
|
||||
<view class="intro-content">
|
||||
<view class="intro-desc">
|
||||
<text>全国范围内的陪诊服务，全程陪同就医，让就诊更轻松、更安心。请认真阅读</text>
|
||||
<text class="link-text" bindtap="goToAgreement">《用户协议》</text>
|
||||
<text>。</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 服务列表 -->
|
||||
<view class="service-list">
|
||||
<view class="section-title-wrap">
|
||||
<t-icon name="system-3" size="36rpx" color="#D4A853" />
|
||||
<text class="section-title">服务列表</text>
|
||||
</view>
|
||||
|
||||
<view class="service-item" wx:for="{{ services }}" wx:key="id" bindtap="goToDetail" data-id="{{ item.id }}">
|
||||
<view class="service-main">
|
||||
<view class="service-title-row">
|
||||
<view class="title-wrap">
|
||||
<view class="title-accent"></view>
|
||||
<text class="service-title">{{ item.title }}</text>
|
||||
</view>
|
||||
<view class="service-tag" wx:if="{{ item.tag }}">{{ item.tag }}</view>
|
||||
</view>
|
||||
<view class="subtitle-wrap">
|
||||
<text class="service-subtitle">{{ item.subtitle }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="service-footer">
|
||||
<view class="price-wrap">
|
||||
<text class="price-symbol">¥</text>
|
||||
<text class="service-price">{{ item.price }}</text>
|
||||
</view>
|
||||
<view class="btn-book" catchtap="onBook" data-id="{{ item.id }}">
|
||||
<text>立即预约</text>
|
||||
<t-icon name="chevron-right" size="24rpx" color="#FFFFFF" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -1 +1,217 @@
|
||||
/* pages/escort/itemlist.wxss */
|
||||
page {
|
||||
background-color: #F5F7F6;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
padding-bottom: calc(32rpx + env(safe-area-inset-bottom));
|
||||
}
|
||||
|
||||
/* 页面头部 */
|
||||
.page-header {
|
||||
background: #FFFFFF;
|
||||
padding: 48rpx 32rpx 32rpx;
|
||||
}
|
||||
|
||||
.header-title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.header-accent {
|
||||
width: 8rpx;
|
||||
height: 40rpx;
|
||||
background: #2D6A4F;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
font-size: 40rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
letter-spacing: 2rpx;
|
||||
}
|
||||
|
||||
.header-subtitle {
|
||||
font-size: 26rpx;
|
||||
color: #6B8E7B;
|
||||
margin-left: 24rpx;
|
||||
letter-spacing: 4rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.intro-card {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
background: #FAFAFA;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.intro-icon-wrap {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #6B8E7B;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.intro-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.intro-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.intro-desc {
|
||||
font-size: 26rpx;
|
||||
color: #6B7280;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.link-text {
|
||||
color: #D4A853;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 服务列表 */
|
||||
.service-list {
|
||||
padding: 32rpx 12rpx;
|
||||
}
|
||||
|
||||
.section-title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
.service-item {
|
||||
background: #FFFFFF;
|
||||
border-radius: 20rpx;
|
||||
padding: 32rpx 32rpx 22rpx 32rpx;
|
||||
margin-bottom: 24rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04);
|
||||
transition: transform 0.2s, box-shadow 0.2s;
|
||||
}
|
||||
|
||||
.service-item:active {
|
||||
transform: translateY(2rpx);
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.service-main {
|
||||
margin-bottom: 24rpx;
|
||||
}
|
||||
|
||||
.service-title-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12rpx;
|
||||
}
|
||||
|
||||
.title-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.title-accent {
|
||||
width: 6rpx;
|
||||
height: 32rpx;
|
||||
background: #2D6A4F;
|
||||
border-radius: 3rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.service-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
.service-tag {
|
||||
background: #D4A853;
|
||||
color: #FFFFFF;
|
||||
font-size: 22rpx;
|
||||
padding: 6rpx 16rpx;
|
||||
border-radius: 8rpx;
|
||||
font-weight: 500;
|
||||
flex-shrink: 0;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.subtitle-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12rpx;
|
||||
}
|
||||
|
||||
.service-subtitle {
|
||||
font-size: 26rpx;
|
||||
color: #6B7280;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.service-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding-top: 14rpx;
|
||||
border-top: 1rpx solid #F3F4F6;
|
||||
}
|
||||
|
||||
.price-wrap {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
.price-symbol {
|
||||
font-size: 28rpx;
|
||||
color: #D4A853;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.service-price {
|
||||
font-size: 32rpx;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
|
||||
.btn-book {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
background: #2D6A4F;
|
||||
color: #FFFFFF;
|
||||
font-size: 26rpx;
|
||||
padding: 16rpx 28rpx;
|
||||
border-radius: 20rpx;
|
||||
font-weight: 500;
|
||||
transition: transform 0.2s;
|
||||
}
|
||||
|
||||
.btn-book:active {
|
||||
transform: scale(0.96);
|
||||
}
|
||||
|
||||
@@ -36,7 +36,7 @@ page {
|
||||
|
||||
.tab-item.active {
|
||||
color: #FFFFFF;
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
background: linear-gradient(135deg, #D4A853 0%, #D4A853 100%);
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@@ -136,7 +136,7 @@ page {
|
||||
|
||||
.fee-value {
|
||||
font-size: 32rpx;
|
||||
color: #FF9B33;
|
||||
color: #D4A853;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user