tmp
This commit is contained in:
@@ -1,43 +1,47 @@
|
||||
Page({
|
||||
data: {
|
||||
contact: {
|
||||
icon: 'logo-wechat-stroke',
|
||||
phone: '18618162956'
|
||||
},
|
||||
services: {},
|
||||
assistServices: [
|
||||
{ id: 1, name: '陪诊', icon: 'user-vip', iconColor: '#2D6A4F' },
|
||||
{ id: 2, name: '代办问诊', icon: 'chat', iconColor: '#2D6A4F' },
|
||||
{ id: 3, name: '代办买药', icon: 'cart', iconColor: '#2D6A4F' },
|
||||
{ id: 4, name: '代取结果', icon: 'file-paste', iconColor: '#2D6A4F' },
|
||||
{ id: 5, name: '检查预约', icon: 'calendar', iconColor: '#2D6A4F' },
|
||||
{ id: 6, name: '出入院办理', icon: 'chart-bar', iconColor: '#2D6A4F' },
|
||||
{ id: 7, name: 'vip陪诊', icon: 'user-star', iconColor: '#2D6A4F' },
|
||||
{ id: 8, name: '其他服务', icon: 'app', iconColor: '#2D6A4F' }
|
||||
],
|
||||
otherServices: [
|
||||
{ id: 1, name: '代办问诊', icon: 'heart', iconColor: '#D4A853' },
|
||||
{ id: 2, name: '代办买药', icon: 'cart', iconColor: '#D4A853' },
|
||||
{ id: 3, name: '代取结果', icon: 'ai-article', iconColor: '#D4A853' },
|
||||
]
|
||||
},
|
||||
|
||||
async onLoad() {
|
||||
const app = getApp()
|
||||
const services = await app.globalData.servicesReady
|
||||
this.setData({
|
||||
services: services.sort((a, b) => parseFloat(a.price) - parseFloat(b.price))
|
||||
},
|
||||
|
||||
goToEscort() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/escort/itemlist'
|
||||
});
|
||||
},
|
||||
|
||||
makePhoneCall() {
|
||||
const phoneNumber = this.data.contact.phone;
|
||||
wx.makePhoneCall({
|
||||
phoneNumber: phoneNumber,
|
||||
success: () => {
|
||||
console.log('拨打电话成功');
|
||||
},
|
||||
fail: () => {
|
||||
console.log('拨打电话失败');
|
||||
}
|
||||
goToVipEscort() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/escort/itemlist?type=vip'
|
||||
});
|
||||
},
|
||||
|
||||
goToDetail(e) {
|
||||
goToServiceList() {
|
||||
wx.navigateTo({
|
||||
url: '/pages/escort/itemlist'
|
||||
});
|
||||
},
|
||||
|
||||
goToAssistDetail(e) {
|
||||
const id = e.currentTarget.dataset.id;
|
||||
wx.navigateTo({
|
||||
url: `/pages/escort/itemdetail?id=${id}`
|
||||
});
|
||||
},
|
||||
|
||||
goToAIChat() {
|
||||
wx.switchTab({
|
||||
url: '/pages/ai/aichat'
|
||||
url: `/pages/escort/itemlist?assistId=${id}`
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
{
|
||||
"navigationBarTitleText": "暖橙陪诊",
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "优医优诊",
|
||||
"usingComponents": {
|
||||
"t-icon": "tdesign-miniprogram/icon/icon"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,73 +1,59 @@
|
||||
<view class="container">
|
||||
<view class="header-section">
|
||||
<image class="header-bg" src="/images/background.jpg" mode="aspectFill"></image>
|
||||
<view class="user-info">
|
||||
<image class="avatar" src="/images/home-active2.png" mode="aspectFill"></image>
|
||||
<view class="welcome-text">
|
||||
<text class="user-name">专业陪诊</text>
|
||||
<text class="welcome-subtitle">让就医更简单,让客户更安心</text>
|
||||
<!-- 顶部导航栏 -->
|
||||
<view class="nav-bar">
|
||||
<view class="nav-logo">
|
||||
<image class="logo-icon" src="/images/home-active.png" mode="aspectFit"></image>
|
||||
<text class="logo-text">暖橙陪诊</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Banner区域 -->
|
||||
<view class="banner-section">
|
||||
<view class="banner-card">
|
||||
<image class="banner-bg" src="/images/banner.jpg" mode="aspectFill"></image>
|
||||
<view class="banner-text">
|
||||
<text class="banner-title">专业陪诊</text>
|
||||
<text class="banner-subtitle"></text>
|
||||
<text class="banner-en">让就医更简单,让客户更安心</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="services-section">
|
||||
<view class="service-item">
|
||||
<view class="service-icon-wrap blue">
|
||||
<image class="service-icon" src="/images/home-w.png" mode="aspectFill"></image>
|
||||
<!-- 服务卡片 -->
|
||||
<view class="service-cards">
|
||||
<view class="service-card" bindtap="goToEscort">
|
||||
<image class="card-img" src="/images/ai-active.png" mode="aspectFit"></image>
|
||||
<view class="card-info">
|
||||
<text class="card-title">客服咨询</text>
|
||||
<text class="card-en">AI Customer service</text>
|
||||
</view>
|
||||
<text class="service-name">陪诊</text>
|
||||
</view>
|
||||
<view class="service-item" bindtap="goToAIChat">
|
||||
<view class="service-icon-wrap blue">
|
||||
<image class="service-icon" src="/images/zixun-w.png" mode="aspectFill"></image>
|
||||
<view class="service-card vip" bindtap="goToVipEscort">
|
||||
<view class="card-info">
|
||||
<text class="card-title">联系我们</text>
|
||||
<text class="card-en">Contact us anytime</text>
|
||||
</view>
|
||||
<text class="service-name">AI客服</text>
|
||||
</view>
|
||||
<view class="service-item" bindtap="goToAIChat">
|
||||
<view class="service-icon-wrap blue">
|
||||
<image class="service-icon" src="/images/team-w.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<text class="service-name">商务合作</text>
|
||||
</view>
|
||||
|
||||
<view class="service-item" bindtap="makePhoneCall">
|
||||
<view class="service-icon-wrap blue">
|
||||
<image class="service-icon" src="/images/call-w.png" mode="aspectFill"></image>
|
||||
</view>
|
||||
<text class="service-name">电话联系</text>
|
||||
<image class="card-img" src="/images/call.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="articles-section">
|
||||
<!-- 助诊服务 -->
|
||||
<view class="assist-section">
|
||||
<view class="section-header">
|
||||
<view class="section-title-wrap">
|
||||
<t-icon name="view-list" class="section-icon" />
|
||||
<text class="section-title">陪诊项目</text>
|
||||
<t-icon name="user-vip" class="section-icon" size="40rpx" color="#2D6A4F" />
|
||||
<text class="section-title">助诊服务</text>
|
||||
</view>
|
||||
<text class="section-more"></text>
|
||||
<text class="section-more" bindtap="goToServiceList">全部 >></text>
|
||||
</view>
|
||||
|
||||
<view class="article-list">
|
||||
<view class="article-item" wx:for="{{ services }}" wx:key="id" bindtap="goToDetail" data-id="{{ item.id }}">
|
||||
<image class="article-image" src="{{ item.image }}" mode="aspectFill"></image>
|
||||
<view class="article-content">
|
||||
<text class="article-title">{{ item.title }}</text>
|
||||
<view class="article-meta">
|
||||
<text class="article-date">{{ item.subtitle }}</text>
|
||||
<text class="article-time">{{ item.readTime }}</text>
|
||||
</view>
|
||||
<view class="assist-grid">
|
||||
<view class="assist-item" wx:for="{{ assistServices }}" wx:key="id" bindtap="goToAssistDetail" data-id="{{ item.id }}">
|
||||
<view class="assist-icon-circle">
|
||||
<t-icon name="{{ item.icon }}" class="assist-icon" style="color: #2D6A4F;" />
|
||||
</view>
|
||||
<text class="article-price">¥{{ item.price }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="contact-section">
|
||||
<view class="contact-box">
|
||||
<t-icon name="{{ contact.icon }}" class="contact-icon" />
|
||||
<text class="contact-phone">18618162956</text>
|
||||
<button class="contact-btn" bindtap="makePhoneCall">打电话 </button>
|
||||
<text class="assist-name">{{ item.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
@@ -1,181 +1,190 @@
|
||||
page {
|
||||
background-color: #FAF6F1;
|
||||
background-color: #F5F7F6;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
|
||||
}
|
||||
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.header-section {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 360rpx;
|
||||
overflow: hidden;
|
||||
padding-top: 10rpx;
|
||||
/* 顶部导航栏 */
|
||||
.nav-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 120rpx 32rpx 20rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.header-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.header-blur-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.doctor-image {
|
||||
position: absolute;
|
||||
right: -60rpx;
|
||||
bottom: 0;
|
||||
width: 380rpx;
|
||||
height: 420rpx;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
position: relative;
|
||||
z-index: 10;
|
||||
padding: 100rpx 40rpx 40rpx;
|
||||
.nav-logo {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
.logo-icon {
|
||||
width: 56rpx;
|
||||
height: 56rpx;
|
||||
border-radius: 16rpx;
|
||||
background: #FFFFFF;
|
||||
padding: 4rpx;
|
||||
}
|
||||
|
||||
.welcome-text {
|
||||
margin-left: 24rpx;
|
||||
}
|
||||
|
||||
.welcome-title {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: #FFFFFF;
|
||||
opacity: 0.9;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.user-name {
|
||||
display: block;
|
||||
font-size: 40rpx;
|
||||
.logo-text {
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
color: #FFFFFF;
|
||||
margin-bottom: 8rpx;
|
||||
color: #1F2937;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.welcome-subtitle {
|
||||
display: block;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.contact-section {
|
||||
padding: 0 32rpx;
|
||||
margin-top: 40rpx;
|
||||
position: relative;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.contact-box {
|
||||
background: #FFFFFF;
|
||||
border-radius: 10rpx;
|
||||
padding: 34rpx 32rpx;
|
||||
.nav-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 20rpx;
|
||||
}
|
||||
|
||||
.contact-icon {
|
||||
font-size: 38rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.contact-text {
|
||||
font-size: 30rpx;
|
||||
color: #9CA3AF;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.contact-phone {
|
||||
font-size: 28rpx;
|
||||
color: #1F2937;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.contact-btn {
|
||||
background: linear-gradient(135deg, #FF9B33 0%, #FF8500 100%);
|
||||
color: #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
padding: 26rpx 6rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.services-section {
|
||||
padding: 36rpx 32rpx;
|
||||
.nav-more {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
background: #FFFFFF;
|
||||
margin: 30rpx 0rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.04);
|
||||
align-items: center;
|
||||
gap: 6rpx;
|
||||
}
|
||||
|
||||
.service-item {
|
||||
.nav-more .dot {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 50%;
|
||||
background: #1F2937;
|
||||
}
|
||||
|
||||
.nav-circle {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid #1F2937;
|
||||
}
|
||||
|
||||
/* Banner区域 */
|
||||
.banner-section {
|
||||
padding: 24rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.banner-card {
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
padding: 20rpx 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
min-height: 280rpx;
|
||||
}
|
||||
|
||||
.banner-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.banner-text {
|
||||
flex: 1;
|
||||
z-index: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.service-icon-wrap {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
border-radius: 50%;
|
||||
.banner-title {
|
||||
font-size: 52rpx;
|
||||
font-weight: 800;
|
||||
color: #D4A853;
|
||||
letter-spacing: 4rpx;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.banner-subtitle {
|
||||
font-size: 52rpx;
|
||||
font-weight: 800;
|
||||
color: #2D6A4F;
|
||||
letter-spacing: 4rpx;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.banner-en {
|
||||
font-size: 26rpx;
|
||||
color: #6B8E7B;
|
||||
letter-spacing: 6rpx;
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 服务卡片 */
|
||||
.service-cards {
|
||||
display: flex;
|
||||
gap: 20rpx;
|
||||
padding: 24rpx 32rpx;
|
||||
/*margin-top: 18rpx;*/
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.service-card {
|
||||
flex: 1;
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 16rpx;
|
||||
justify-content: space-between;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||||
border: 2rpx solid #F0F0F0;
|
||||
}
|
||||
|
||||
.service-icon-wrap.blue {
|
||||
background-color: #FF9B33;
|
||||
.card-img {
|
||||
width: 90rpx;
|
||||
height: 90rpx;
|
||||
}
|
||||
|
||||
.service-icon {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
color: #FF9B33;
|
||||
.card-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
|
||||
.service-name {
|
||||
font-size: 28rpx;
|
||||
color: #374151;
|
||||
font-weight: 600;
|
||||
.service-card.vip .card-info {
|
||||
margin-left: 0;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.articles-section {
|
||||
padding: 10rpx 0rpx;
|
||||
.card-title {
|
||||
font-size: 30rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.card-en {
|
||||
font-size: 20rpx;
|
||||
color: #9CA3AF;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
/* 助诊服务 */
|
||||
.assist-section {
|
||||
background: #FFFFFF;
|
||||
padding: 50rpx 32rpx;
|
||||
}
|
||||
|
||||
.section-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.section-icon {
|
||||
font-size: 36rpx;
|
||||
margin-right: 12rpx;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 32rpx;
|
||||
padding: 0rpx 30rpx;
|
||||
}
|
||||
|
||||
.section-title-wrap {
|
||||
@@ -183,86 +192,53 @@ page {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.section-more {
|
||||
margin-left: auto;
|
||||
.section-icon {
|
||||
margin-right: 12rpx;
|
||||
color: #2D6A4F;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
font-size: 34rpx;
|
||||
font-weight: 700;
|
||||
color: #1F2937;
|
||||
}
|
||||
|
||||
.section-more {
|
||||
font-size: 26rpx;
|
||||
color: #FF9B33;
|
||||
font-weight: 500;
|
||||
color: #2D6A4F;
|
||||
}
|
||||
|
||||
.article-list {
|
||||
.assist-grid {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.assist-item {
|
||||
width: 25%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 20rpx;
|
||||
align-items: center;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.article-item {
|
||||
.assist-icon-circle {
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
border-radius: 50%;
|
||||
border: 2rpx solid #E8F0EC;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-bottom: 16rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0rpx;
|
||||
padding: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.article-image {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 10rpx;
|
||||
flex-shrink: 0;
|
||||
.assist-icon {
|
||||
font-size: 44rpx;
|
||||
}
|
||||
|
||||
.article-content {
|
||||
flex: 1;
|
||||
margin-left: 20rpx;
|
||||
padding-right: 16rpx;
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.article-title {
|
||||
display: block;
|
||||
font-size: 30rpx;
|
||||
font-weight: 600;
|
||||
color: #1F2937;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 22rpx;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.article-meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16rpx;
|
||||
}
|
||||
|
||||
.article-date {
|
||||
font-size: 26rpx;
|
||||
color: #6c6c6c;
|
||||
}
|
||||
|
||||
.article-time {
|
||||
font-size: 22rpx;
|
||||
color: #9CA3AF;
|
||||
}
|
||||
|
||||
.article-price {
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
color: #FF9B33;
|
||||
align-self: flex-start;
|
||||
margin-left: auto;
|
||||
flex-shrink: 0;
|
||||
.assist-name {
|
||||
font-size: 28rpx;
|
||||
color: #6B7280;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user