wangyifang
/
yikangyang-wx
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

陪诊

Browse Source
master
lion 1 year ago
parent 87fd336485
commit 91c48c233b
9 changed files with 2254 additions and 1571 deletions
Show Stats Download Patch File Download Diff File

8
common/config.js
Unescape View File

@ -1,14 +1,14 @@
const mode = 'devOnline'; //devLocal：本地测试、devOnline：线上测试、production：生产环境
let ROOTPATH = ''; //域名
let ROOTPATH = 'http://yikangyang.ali251.langye.net'; //域名
switch (mode) {
case 'devLocal':
ROOTPATH = "http://yikangyang.ali251.langye.net"
ROOTPATH = ROOTPATH
break;
case 'devOnline':
ROOTPATH = "http://yikangyang.ali251.langye.net"
ROOTPATH = ROOTPATH
break;
case 'production':
ROOTPATH = "https://xxxxx.cn"
ROOTPATH = ROOTPATH
break;
default:
throw new Error('未配置环境');

145
common/http.api.js
Unescape View File

@ -1,26 +1,121 @@
//api集合
let apiApp = {
login: '/api/mobile/user/applet-login',
userInfo: '/api/mobile/user/get-user-info',
}
// 此处第二个参数vm，就是我们在页面使用的this，你可以通过vm获取vuex等操作
const install = (Vue, vm) => {
//api方法
//
const login = (params = {}) => vm.$u.get(apiApp.login, params)
const getUserInfo = () => vm.$u.get(apiApp.userInfo)
// end
//api集合
let apiApp = {
// 用户
login: '/api/mobile/user/applet-login',
userInfo: '/api/mobile/user/get-user-info',
updateUser: '/api/mobile/user/update-user',
getMobile: '/api/mobile/user/mobile',
// 用户订单
accompanyOrders: '/api/mobile/user/accompany-orders',
accompanyOrdersDetail: '/api​/mobile​/user​/accompany-orders-detail',
// 医院 陪护下单
listHospital: '/api/mobile/hospital/hospital',
detailHospital: '/api/mobile/hospital/hospital-detail',
accompanyProduct: '/api/mobile/hospital/accompany-product',
accompanyProductDetail: '/api/mobile/hospital/accompany-product-detail',
accompanyProductOrder: '/api/mobile/hospital/accompany-order',
accompanyPay: '/api/mobile/hospital/accompany-pay',
// 服务对象
userArchive: '/api/mobile/user-archive/index',
userArchiveShow: '/api/mobile/user-archive/show',
userArchiveSave: '/api/mobile/user-archive/save',
userArchiveDestroy: '/api/mobile/user-archive/destroy',
// 其他
otherBanner: '/api/mobile/other/banner',
otherSite: '/api/mobile/other/site',
otherArticleType: '/api/mobile/other/article-type',
otherArticle: '/api/mobile/other/article',
otherArticleDetail: '/api/mobile/other/article-detail',
otherUpload: '/api/mobile/upload-file',
//商城
productCategory: '/api/mobile/product/product-category',
productList: '/api/mobile/product/product',
productDetail: '/api/mobile/product/product-detail',
productOrder: '/api/mobile/product/order',
productPay: '/api/mobile/product/pay',
// 收货地址
userAddress: '/api/mobile/user-address/index',
userAddressShow: '/api/mobile/user-address/show',
userAddressSave: '/api/mobile/user-address/save',
userAddressDestroy: '/api/mobile/user-address/destroy',
// 用户商城订单
userOrders: '/api/mobile/user/orders',
userOrdersDetail: '/api/mobile/user/orders-detail',
}
// 此处第二个参数vm，就是我们在页面使用的this，你可以通过vm获取vuex等操作
const install = (Vue, vm) => {
//api方法
//
const login = (params = {}) => vm.$u.get(apiApp.login, params)
const getUserInfo = () => vm.$u.get(apiApp.userInfo)
const updateUser = (params = {}) => vm.$u.post(apiApp.updateUser, params)
const getMobile = (params = {}) => vm.$u.get(apiApp.getMobile, params)
// 用户订单
const accompanyOrders = (params = {}) => vm.$u.get(apiApp.accompanyOrders, params)
const accompanyOrdersDetail = (params = {}) => vm.$u.get(apiApp.accompanyOrdersDetail, params)
// 医院 陪护下单
const listHospital = (params = {}) => vm.$u.get(apiApp.listHospital, params)
const detailHospital = (params = {}) => vm.$u.get(apiApp.detailHospital, params)
const accompanyProduct = (params = {}) => vm.$u.get(apiApp.accompanyProduct, params)
const accompanyProductDetail = (params = {}) => vm.$u.get(apiApp.accompanyProductDetail, params)
const accompanyProductOrder = (params = {}) => vm.$u.post(apiApp.accompanyProductOrder, params)
const accompanyPay = (params = {}) => vm.$u.post(apiApp.accompanyPay, params)
// 服务对象
const userArchive = (params = {}) => vm.$u.get(apiApp.userArchive, params)
const userArchiveShow = (params = {}) => vm.$u.get(apiApp.userArchiveShow, params)
const userArchiveSave = (params = {}) => vm.$u.post(apiApp.userArchiveSave, params)
const userArchiveDestroy = (params = {}) => vm.$u.get(apiApp.userArchiveDestroy, params)
// 其他
const otherBanner = (params = {}) => vm.$u.get(apiApp.otherBanner, params)
const otherSite = (params = {}) => vm.$u.get(apiApp.otherSite, params)
const otherArticleType = (params = {}) => vm.$u.get(apiApp.otherArticleType, params)
const otherArticle = (params = {}) => vm.$u.get(apiApp.otherArticle, params)
const otherArticleDetail = (params = {}) => vm.$u.get(apiApp.otherArticleDetail, params)
const otherUpload = (params = {}) => vm.$u.post(apiApp.accompanyPay, params)
// 商城
const productCategory = (params = {}) => vm.$u.get(apiApp.productCategory, params)
const productList = (params = {}) => vm.$u.get(apiApp.productList, params)
const productDetail = (params = {}) => vm.$u.get(apiApp.productDetail, params)
const productOrder = (params = {}) => vm.$u.get(apiApp.productOrder, params)
const productPay = (params = {}) => vm.$u.get(apiApp.productPay, params)
// 收货地址
const userAddress = (params = {}) => vm.$u.get(apiApp.userAddress, params)
const userAddressShow = (params = {}) => vm.$u.get(apiApp.userAddressShow, params)
const userAddressSave = (params = {}) => vm.$u.post(apiApp.userAddressSave, params)
const userAddressDestroy = (params = {}) => vm.$u.get(apiApp.userAddressDestroy, params)
// 用户商城订单
const userOrders = (params = {}) => vm.$u.get(apiApp.userOrders, params)
const userOrdersDetail = (params = {}) => vm.$u.get(apiApp.userOrdersDetail, params)
// end
vm.$u.api = {
login,
getUserInfo
};
}
export default {
install
}
// 用户
login,getUserInfo,updateUser,getMobile,
//用户订单
accompanyOrders,accompanyOrdersDetail,
// 医院 陪护下单
listHospital,detailHospital,accompanyProduct,accompanyProductDetail,accompanyProductOrder,accompanyPay,
// 服务对象
userArchive,userArchiveShow,userArchiveSave,userArchiveDestroy,
// other
otherBanner,otherSite,otherArticleType,otherArticle,otherArticleDetail,otherUpload,
// 商城
productCategory,productList,productDetail,productOrder,productPay,
// 收货地址
userAddress,userAddressShow,userAddressSave,userAddressDestroy,
// 用户商城订单
userOrders,userOrdersDetail,
};
}
export default {
install
}

2
common/http.interceptor.js
Unescape View File

@ -50,7 +50,7 @@ const install = (Vue, vm) => {
} else {
uni.showToast({
icon: "none",
title: "系统错误"
title: res.errmsg||"系统错误"
})
return false
}

195
component/serviceArchive/service-archive.vue
Unescape View File

@ -0,0 +1,195 @@
<template>
<view class="container" v-show="isShow">
<u-popup v-model="isShow" mode="bottom" safe-area-inset-bottom :border-radius="0" height="100%">
<view style="padding:34rpx 44rpx">
<u-form :model="form" :rules="rules" ref="uForm1" label-width="140"
:error-type="['toast']">
<u-form-item label="姓名" prop="name" required>
<u-input v-model="form.name" placeholder="请输入姓名"/>
</u-form-item>
<u-form-item label="身份证号" prop="idcard" required>
<u-input v-model="form.idcard" placeholder="请输入身份证号" type="idcard" />
</u-form-item>
<u-form-item label="手机号" prop="mobile" required>
<u-input v-model="form.mobile" placeholder="请输入手机号" type="number" />
</u-form-item>
<u-form-item label="有无行动能力" prop="is_move">
<u-radio-group v-model="form.is_move" slot="right" active-color="#c20d12">
<u-radio :name="1">有</u-radio>
<u-radio :name="0">无</u-radio>
</u-radio-group>
</u-form-item>
<u-form-item label="地址" prop="address" required>
<u-input v-model="form.address" placeholder="请输入地址" />
</u-form-item>
<u-form-item label="备注" prop="remark">
<u-input v-model="form.remark" placeholder="请输入备注" />
</u-form-item>
</u-form>
</view>
<view class="archive-btn">
<u-button shape="circle" ripple :custom-style="btnStyle1" @click="cancel">取消</u-button>
<u-button shape="circle" ripple :custom-style="btnStyle" @click="save">确认</u-button>
</view>
</u-popup>
</view>
</template>
<script>
export default {
data() {
return {
btnStyle: {
'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
'font-weight': '500',
'font-size': '28rpx',
'color': '#fff',
'width': '436rpx',
'margin': '0 auto',
'letter-spacing': '2rpx',
'width':'80%'
},
btnStyle1: {
'background-image': 'linear-gradient(-90deg, #ddd 0%, #ccc 94%, #eee 100%)',
'font-weight': '500',
'font-size': '28rpx',
'color': '#fff',
'width': '436rpx',
'margin': '0 auto',
'letter-spacing': '2rpx',
'width':'80%'
},
isShow: false,
form: {
name: '',
idcard:'',
mobile:'',
is_move:1,
address:'',
remark:''
},
rules: {
name: [{
required: true,
message: '请输入姓名',
trigger: ['blur', 'change']
}],
idcard: [{
required: true,
message: '请输入身份证号',
trigger: ['blur', 'change']
}, {
// 自定义验证函数，见上说明
validator: (rule, value, callback) => {
return this.$u.test.idCard(value);
},
message: '身份证号不正确',
// 触发器可以同时用blur和change
trigger: ['change', 'blur'],
}],
mobile: [{
required: true,
message: '请输入手机号',
trigger: ['blur', 'change']
}, {
// 自定义验证函数，见上说明
validator: (rule, value, callback) => {
return this.$u.test.mobile(value);
},
message: '手机号码不正确',
// 触发器可以同时用blur和change
trigger: ['change', 'blur'],
}],
address: [{
required: true,
message: '请输入地址',
trigger: ['blur', 'change']
}]
}
};
},
onReady() {
this.$refs.uForm1.setRules(this.rules);
},
methods: {
save() {
this.$refs.uForm1.validate(valid => {
let that = this
if (valid) {
console.log('验证通过');
console.log("form",this.form)
console.log("that.$u.api.userArchiveSave",that.$u.api.userArchiveSave)
console.log("this.$u.api.userArchiveSave",this.$u.api.userArchiveSave)
this.$u.api.userArchiveSave({
...that.form
}).then(res=>{
uni.showToast({
title:"创建成功",
icon:'none',
success() {
that.isShow = false
that.$emit("addSuccess",true)
}
})
}).then(err=>{
console.log("err",err)
})
} else {
console.log('验证失败');
}
});
},
cancel(){
this.$refs.uForm1.resetFields()
this.form = {
name: '',
idcard:'',
mobile:'',
is_move:1,
address:'',
remark:''
}
this.isShow = false
}
}
}
</script>
<style lang="scss">
page {
background: #fff;
}
</style>
<style lang="scss" scoped>
.container {
// padding: 34rpx 44rpx;
// margin: 34rpx 25rpx 95rpx;
// border-radius: 10rpx;
filter: drop-shadow(0 0 10rpx rgba(211, 211, 214, 0.3));
background-color: #ffffff;
height: 100vh;
width: 100vw;
position: fixed;
top: 0;
left: 0;
z-index: 99999;
::v-deep .u-input__input {
text-align: right;
}
.archive-btn{
display: flex;
align-items: center;
justify-content: center;
u-button{
width:50%;
}
}
}
</style>

2081
package_sub/pages/AddOrder/AddOrder.vue
View File

File diff suppressed because it is too large Load Diff

884
package_sub/pages/ServiceDetail/ServiceDetail.vue
Unescape View File

@ -1,412 +1,472 @@
<template>
<view class="page safe-area-inset-bottom">
<image class="bkg" src="~@/package_sub/static/ServiceDetail/bkg.png" mode="aspectFill"></image>
<view class="container">
<view class="card detail">
<view class="detail__text">
全程1对1陪同就医，代取号、代排队、代跑腿、打印报告等服务。患者可以更加灵活安排时间，不但解决无人陪同难题，以及排队费时、环境
</view>
<view class="detail__price">
<text class="detail__price--number">600</text>
<text class="detail__price--text">元/次</text>
</view>
</view>
<view class="tab">
<view v-for="(item, index) in ['服务内容','预约须知']"
:key="index"
class="tab-item"
:class="{ 'is-active': index === currentTab }"
@click="$u.throttle(() => currentTab = index)">
{{ item }}
</view>
</view>
<view v-show="currentTab === 0">
<view class="card for-people">
<view class="card__title">
适用人群
</view>
<view class="for-people__content block">
<view class="block-item" v-for="i in 10" :key="i">
<image class="block-item__img" src="~@/static/index/honor-title.png" mode="aspectFit"></image>
<view class="block-item__text">老年人对医院环境设设备不熟悉。</view>
</view>
</view>
</view>
<view class="service-flow card">
<view class="card__title">
服务流程
</view>
<view class="service-flow__content" v-for="i in 5" :key="i">
<view class="dot-line" />
<view class="content-panel">
<image class="db-arrow-down" src="~@/package_sub/static/ServiceDetail/db-arrow-down.png" mode="aspectFit"></image>
<view class="content-panel__section">
请至少提前2小时预约，以便平台安排合适的陪诊师;
</view>
<view class="content-panel__section">
提交预约申请后，请添加客服专员，以便及时与您沟通服务进展;
</view>
</view>
</view>
</view>
<view class="cost-description card">
<view class="card__title">
费用说明
</view>
<ul class="cost-description__content">
<li v-for="i in 7" :key="i">
本服务含医院内半天(不超过4小时)陪诊服务，仅限单个医院不含治疗检查、饮食、交通等费用;
</li>
</ul>
</view>
</view>
<u-button class="btn" shape="circle" ripple :custom-style="orderBtnStyle">立即预约</u-button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
currentTab: 0,
orderBtnStyle: {
'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
'font-weight': '500',
'font-size': '28rpx',
'color': '#fff',
'width': '436rpx',
'margin-top': '32rpx'
}
};
},
onLoad(option) {
uni.setNavigationBarTitle({
title: option.title ?? "服务项目"
});
},
mounted() {
},
}
</script>
<style>
page {
background: #f4efee;
}
</style>
<style lang="scss" scoped>
.page {
.bkg {
height: 316rpx;
width: 100vw;
z-index: 0;
position: absolute;
top: 0;
left: 0;
}
.container {
z-index: 1;
position: relative;
padding-top: 250rpx;
.card {
border-radius: 10rpx;
filter: drop-shadow(2.192px 4.494px 5px rgba(33,32,32,0.15));
background-color: #ffffff;
&__title {
display: inline-block;
font-size: 28rpx;
color: #ca2328;
font-weight: bold;
position: relative;
left: 50%;
transform: translateX(-50%);
&::before {
content: '';
position: absolute;
width: 139rpx;
height: 5rpx;
border-radius: 3px;
left: -28rpx;
top: 50%;
transform: translate(-100%, -50%);
background: linear-gradient(to left,#ca2328,#ffffff00);
}
&::after {
content: '';
position: absolute;
width: 139rpx;
height: 5rpx;
border-radius: 3px;
right: -28rpx;
top: 50%;
transform: translate(100%, -50%);
background: linear-gradient(to right,#ca2328,#ffffff00);
}
}
}
.detail {
margin: 0 24rpx;
padding: 26rpx 22rpx;
&__text {
text-indent: 48rpx;
font-size: 24rpx;
line-height: 1.5;
color: #929196;
font-weight: 500;
}
&__price {
margin-top: 24rpx;
color: #c20d12;
padding-left: 16rpx;
&--number {
font-weight: 500;
font-size: 40rpx;
}
&--text {
font-size: 24rpx;
}
}
}
.tab {
display: flex;
align-items: center;
padding: 0 60rpx;
margin-top: 38rpx;
&-item {
font-size: 28rpx;
color: #666;
transition: all .1s;
}
.tab-item + .tab-item {
margin-left: 60rpx;
}
.is-active {
color: #000;
font-weight: 600;
font-size: 32rpx;
position: relative;
&::after {
content: '';
position: absolute;
bottom: -20rpx;
left: 50%;
transform: translateX(-50%);
width: 58rpx;
height: 4rpx;
border-radius: 2rpx;
background-color: #ca2328;
}
}
}
.for-people {
margin: 54rpx 24rpx 0;
padding: 46rpx 30rpx;
&__content {
margin-top: 46rpx;
}
.block {
display: flex;
flex-wrap: wrap;
&-item {
display: flex;
align-items: center;
margin-bottom: 60rpx;
flex-basis: calc((100% - 64rpx) / 2);
&__img {
width: 62rpx;
height: 70rpx;
}
&__text {
font-size: 24rpx;
color: #666666;
font-weight: 500;
margin-left: 16rpx;
text-align: left;
}
}
.block-item:nth-child(2n) {
margin-left: 64rpx;
}
.block-item:nth-last-child(1) {
margin-bottom: 0;
}
.block-item:nth-last-child(2) {
margin-bottom: 0;
}
}
}
.service-flow {
margin: 34rpx 24rpx 0;
padding: 45rpx 20rpx 34rpx 28rpx;
&__content {
margin-top: 18rpx;
$dot-bkgs:
linear-gradient(0deg, #ebb6b6 0%, #f7d8ba 99%, #f7d8ba 100%),
linear-gradient(0deg, #edbd97 0%, #e4de9f 100%, #e4de9f 100%),
linear-gradient(0deg, #8fa9e3 0%, #a3d9fb 100%),
linear-gradient(0deg, #e3c2f7 0%, #e3c2f7 1%, #c7ccfb 100%),
linear-gradient(0deg, #f99ea2 0%, #f4d4fa 100%);
$dot-border: #f7d8ba,#e4de9f,#a3d9fb,#c7ccfb,#f4d4fa;
$panel-bkgs:
linear-gradient(0deg, #fde5e5b3 0%, #fdf7f1b3 100%),
linear-gradient(0deg, #fdede1b3 0%, #fbfbefb3 100%),
linear-gradient(0deg, #e5e7f7b3 0%, #f3fbfdb3 100%),
linear-gradient(0deg, #f5e7fdb3 0%, #f0f1fcb3 100%),
linear-gradient(0deg, #fde5e5b3 0%, #f9f4fcb3 100%);
.dot-line {
float: left;
width: 16rpx;
height: 16rpx;
border-radius: 100%;
z-index: 2;
position: relative;
top: 8rpx;
left: 8rpx;
&::after {
content: '';
width: 22rpx;
height: 22rpx;
box-sizing: border-box;
border-radius: 100%;
border: 2rpx solid;
z-index: 2;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
@for $index from 1 through length($dot-bkgs) {
&:nth-child(#{$index+1}n) .dot-line {
background: nth($dot-bkgs, $index);
&::after {
border-color: nth($dot-border, $index);
}
}
&:nth-child(#{$index+1}n) .content-panel {
background: nth($panel-bkgs, $index);
}
}
&:nth-child(2) .content-panel:before {
top: 10rpx !important;
}
.content-panel {
border-radius: 5px;
margin-left: 40rpx;
padding: 24rpx 8rpx 24rpx 32rpx;
color: #666666;
font-weight: 500;
position: relative;
&::before {
content: '';
width: 2rpx;
opacity: .2;
background-color: #666666;
z-index: 1;
position: absolute;
top: -18rpx;
left: calc(-40rpx + 15rpx);
bottom: 0;
}
.db-arrow-down {
width: 98rpx;
height: 103rpx;
position: absolute;
right: 20rpx;
bottom: 24rpx;
}
&__section {
font-size: 24rpx;
line-height: 40rpx;
position: relative;
&::before {
content: '';
position: absolute;
width: 8rpx;
height: 8rpx;
border-radius: 100%;
background-color: #7a7a7a;
top: 16rpx;
left: -16rpx;
}
}
}
}
}
.cost-description {
margin: 22rpx 24rpx 0;
padding: 45rpx 20rpx 34rpx 28rpx;
&__content {
margin-top: 50rpx;
font-size: 24rpx;
line-height: 40rpx;
color: #666666;
font-weight: 500;
position: relative;
& > li {
margin-left: 36rpx;
position: relative;
&::before {
content: '';
width: 8rpx;
height: 8rpx;
border-radius: 100%;
background-color: #7a7a7a;
position: absolute;
left: -26rpx;
top: calc(20rpx - 4rpx);
}
}
& > li + li {
margin-top: 10rpx;
}
}
}
.btn {
margin: 32rpx auto 0;
}
}
}
</style>
<template>
<view class="page safe-area-inset-bottom">
<!-- <image class="bkg" src="~@/package_sub/static/ServiceDetail/bkg.png" mode="aspectFill"></image> -->
<view class="bkg">
<u-swiper :height="316" img-mode="scaleToFill" mode="none" border-radius="0" :list="info.images" name="url"></u-swiper>
</view>
<view class="container">
<view class="card detail">
<view class="detail__text">
{{info.introduce}}
</view>
<view class="detail__price">
<text class="detail__price--number">{{info.price}}</text>
<text class="detail__price--text">元/次</text>
</view>
</view>
<view class="tab">
<view v-for="(item, index) in ['服务内容','预约须知']" :key="index" class="tab-item"
:class="{ 'is-active': index === currentTab }" @click="$u.throttle(() => currentTab = index)">
{{ item }}
</view>
</view>
<view v-show="currentTab === 0">
<view class="card for-people">
<view class="card__title">
适用人群
</view>
<view class="for-people__content block">
<view class="block-item">
<!-- <image class="block-item__img" src="~@/static/index/honor-title.png" mode="aspectFit">
</image> -->
<view class="block-item__text">
<u-parse :html="info.content"></u-parse>
</view>
</view>
</view>
</view>
<view class="service-flow card">
<view class="card__title">
服务流程
</view>
<view class="service-flow__content">
<u-parse :html="info.flow_content"></u-parse>
<!-- <view class="dot-line" />
<view class="content-panel">
<image class="db-arrow-down" src="~@/package_sub/static/ServiceDetail/db-arrow-down.png" mode="aspectFit"></image>
<view class="content-panel__section">
请至少提前2小时预约，以便平台安排合适的陪诊师;
</view>
<view class="content-panel__section">
提交预约申请后，请添加客服专员，以便及时与您沟通服务进展;
</view>
</view> -->
</view>
</view>
<view class="cost-description card">
<view class="card__title">
费用说明
</view>
<ul class="cost-description__content">
<u-parse :html="info.price_content"></u-parse>
<!-- <li v-for="i in 7" :key="i">
本服务含医院内半天(不超过4小时)陪诊服务，仅限单个医院不含治疗检查、饮食、交通等费用;
</li> -->
</ul>
</view>
</view>
<view v-show="currentTab === 1">
<view class="card for-people">
<view class="for-people__content block">
<view class="block-item">
<!-- <image class="block-item__img" src="~@/static/index/honor-title.png" mode="aspectFit">
</image> -->
<view class="block-item__text">
<u-parse :html="info.appoint_content"></u-parse>
</view>
</view>
</view>
</view>
</view>
<u-button class="btn" shape="circle" ripple @click="toOrder(info)" :custom-style="orderBtnStyle">立即预约</u-button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
id: '',
currentTab: 0,
info: {},
orderBtnStyle: {
'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
'font-weight': '500',
'font-size': '28rpx',
'color': '#fff',
'width': '436rpx',
'margin-top': '32rpx'
}
};
},
onLoad(option) {
uni.setNavigationBarTitle({
title: option.title ?? "服务项目"
});
this.id = option.id ? option.id : ''
this.getDetail(this.id)
},
mounted() {
},
methods: {
async getDetail(id) {
await this.$u.api.accompanyProductDetail({
id: id
}).then(res=>{
console.log("res", res)
this.info = res
})
},
toOrder(info) {
this.$u.route({
url: '/package_sub/pages/AddOrder/AddOrder?id='+info.id+'&site_id='+info.site_id+'&type='+info.type
})
},
}
}
</script>
<style>
page {
background: #f4efee;
}
</style>
<style lang="scss" scoped>
.page {
.bkg {
height: 316rpx;
width: 100vw;
z-index: 0;
position: absolute;
top: 0;
left: 0;
}
.container {
z-index: 1;
position: relative;
padding-top: 250rpx;
.card {
border-radius: 10rpx;
filter: drop-shadow(2.192px 4.494px 5px rgba(33, 32, 32, 0.15));
background-color: #ffffff;
&__title {
display: inline-block;
font-size: 28rpx;
color: #ca2328;
font-weight: bold;
position: relative;
left: 50%;
transform: translateX(-50%);
&::before {
content: '';
position: absolute;
width: 139rpx;
height: 5rpx;
border-radius: 3px;
left: -28rpx;
top: 50%;
transform: translate(-100%, -50%);
background: linear-gradient(to left, #ca2328, #ffffff00);
}
&::after {
content: '';
position: absolute;
width: 139rpx;
height: 5rpx;
border-radius: 3px;
right: -28rpx;
top: 50%;
transform: translate(100%, -50%);
background: linear-gradient(to right, #ca2328, #ffffff00);
}
}
}
.detail {
margin: 0 24rpx;
padding: 26rpx 22rpx;
&__text {
text-indent: 48rpx;
font-size: 24rpx;
line-height: 1.5;
color: #929196;
font-weight: 500;
}
&__price {
margin-top: 24rpx;
color: #c20d12;
padding-left: 16rpx;
&--number {
font-weight: 500;
font-size: 40rpx;
}
&--text {
font-size: 24rpx;
}
}
}
.tab {
display: flex;
align-items: center;
padding: 0 60rpx;
margin-top: 38rpx;
&-item {
font-size: 28rpx;
color: #666;
transition: all .1s;
}
.tab-item+.tab-item {
margin-left: 60rpx;
}
.is-active {
color: #000;
font-weight: 600;
font-size: 32rpx;
position: relative;
&::after {
content: '';
position: absolute;
bottom: -20rpx;
left: 50%;
transform: translateX(-50%);
width: 58rpx;
height: 4rpx;
border-radius: 2rpx;
background-color: #ca2328;
}
}
}
.for-people {
margin: 54rpx 24rpx 0;
padding: 46rpx 30rpx;
&__content {
margin-top: 46rpx;
}
.block {
display: flex;
flex-wrap: wrap;
&-item {
display: flex;
align-items: center;
margin-bottom: 60rpx;
flex-basis: calc((100% - 64rpx) / 2);
&__img {
width: 62rpx;
height: 70rpx;
}
&__text {
font-size: 24rpx;
color: #666666;
font-weight: 500;
margin-left: 16rpx;
text-align: left;
}
}
.block-item:nth-child(2n) {
margin-left: 64rpx;
}
.block-item:nth-last-child(1) {
margin-bottom: 0;
}
.block-item:nth-last-child(2) {
margin-bottom: 0;
}
}
}
.service-flow {
margin: 34rpx 24rpx 0;
padding: 45rpx 20rpx 34rpx 28rpx;
&__content {
margin-top: 18rpx;
$dot-bkgs: linear-gradient(0deg, #ebb6b6 0%, #f7d8ba 99%, #f7d8ba 100%),
linear-gradient(0deg, #edbd97 0%, #e4de9f 100%, #e4de9f 100%),
linear-gradient(0deg, #8fa9e3 0%, #a3d9fb 100%),
linear-gradient(0deg, #e3c2f7 0%, #e3c2f7 1%, #c7ccfb 100%),
linear-gradient(0deg, #f99ea2 0%, #f4d4fa 100%);
$dot-border: #f7d8ba,
#e4de9f,
#a3d9fb,
#c7ccfb,
#f4d4fa;
$panel-bkgs: linear-gradient(0deg, #fde5e5b3 0%, #fdf7f1b3 100%),
linear-gradient(0deg, #fdede1b3 0%, #fbfbefb3 100%),
linear-gradient(0deg, #e5e7f7b3 0%, #f3fbfdb3 100%),
linear-gradient(0deg, #f5e7fdb3 0%, #f0f1fcb3 100%),
linear-gradient(0deg, #fde5e5b3 0%, #f9f4fcb3 100%);
.dot-line {
float: left;
width: 16rpx;
height: 16rpx;
border-radius: 100%;
z-index: 2;
position: relative;
top: 8rpx;
left: 8rpx;
&::after {
content: '';
width: 22rpx;
height: 22rpx;
box-sizing: border-box;
border-radius: 100%;
border: 2rpx solid;
z-index: 2;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
@for $index from 1 through length($dot-bkgs) {
&:nth-child(#{$index+1}n) .dot-line {
background: nth($dot-bkgs, $index);
&::after {
border-color: nth($dot-border, $index);
}
}
&:nth-child(#{$index+1}n) .content-panel {
background: nth($panel-bkgs, $index);
}
}
&:nth-child(2) .content-panel:before {
top: 10rpx !important;
}
.content-panel {
border-radius: 5px;
margin-left: 40rpx;
padding: 24rpx 8rpx 24rpx 32rpx;
color: #666666;
font-weight: 500;
position: relative;
&::before {
content: '';
width: 2rpx;
opacity: .2;
background-color: #666666;
z-index: 1;
position: absolute;
top: -18rpx;
left: calc(-40rpx + 15rpx);
bottom: 0;
}
.db-arrow-down {
width: 98rpx;
height: 103rpx;
position: absolute;
right: 20rpx;
bottom: 24rpx;
}
&__section {
font-size: 24rpx;
line-height: 40rpx;
position: relative;
&::before {
content: '';
position: absolute;
width: 8rpx;
height: 8rpx;
border-radius: 100%;
background-color: #7a7a7a;
top: 16rpx;
left: -16rpx;
}
}
}
}
}
.cost-description {
margin: 22rpx 24rpx 0;
padding: 45rpx 20rpx 34rpx 28rpx;
&__content {
margin-top: 50rpx;
font-size: 24rpx;
line-height: 40rpx;
color: #666666;
font-weight: 500;
position: relative;
&>li {
margin-left: 36rpx;
position: relative;
&::before {
content: '';
width: 8rpx;
height: 8rpx;
border-radius: 100%;
background-color: #7a7a7a;
position: absolute;
left: -26rpx;
top: calc(20rpx - 4rpx);
}
}
&>li+li {
margin-top: 10rpx;
}
}
}
.btn {
margin: 32rpx auto 0;
}
}
}
</style>

431
package_sub/pages/ServiceList/ServiceList.vue
Unescape View File

@ -1,175 +1,256 @@
<template>
<view class="page">
<view class="top">
<view class="position" @click="$u.route({ url: '/pages/CitySelect/CitySelect' })">
<u-icon name="map-fill"></u-icon>
<text>{{ vuex_location.city.replace(/(市|区|县)/,'') }}</text>
<u-icon name="arrow-down" size="22"></u-icon>
</view>
</view>
<view class="container">
<image class="bkg" src="~@/package_sub/static/ServiceList/bkg.png" mode="aspectFill"></image>
<view class="list">
<view class="list-item" v-for="(i) in 20" :key="i">
<view class="left">
<view class="list-item__icon">
<u-icon name="integral" size="60"></u-icon>
</view>
</view>
<view class="center">
<view class="list-item__title">
尊享VIP陪诊
</view>
<view class="list-item__sub-title">尊享VIP体验，车接车送</view>
<view class="list-item__price">
<text class="list-item__price--unit">¥</text>
<text class="list-item__price--number">600</text>
<text class="list-item__price--text">元/次</text>
</view>
</view>
<view class="right">
<u-button shape="circle" ripple :custom-style="orderBtnStyle" @click="toOrder(i)">预约</u-button>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
orderBtnStyle: {
'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
'font-weight': '500',
'font-size': '27rpx',
'color': '#fff',
'width': '130rpx',
'height': '60rpx',
'line-height': '60rpx'
},
};
},
mounted() {
if (this.$store.state.vuex_location !== 2) {
this.$store.dispatch('getLocation')
}
},
methods: {
toOrder(item) {
this.$u.route({
url: '/package_sub/pages/AddOrder/AddOrder'
})
}
}
}
</script>
<style lang="scss">
.page {
position: relative;
}
.top {
width: 100vw;
background: #fff;
padding: 26rpx 28rpx;
z-index: 4;
position: sticky;
top: 0;
.position {
color: #000;
font-size: 30rpx;
letter-spacing: 3rpx;
font-weight: 500;
& > text {
padding: 0 13rpx;
}
}
}
.container {
padding-bottom: 20rpx;
padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
position: relative;
z-index: 1;
.bkg {
height: 316rpx;
width: 100vw;
position: absolute;
}
.list {
padding: 252rpx 25rpx 20rpx;
position: relative;
z-index: 3;
&-item {
border-radius: 10rpx;
filter: drop-shadow(2.192rpx 4.494rpx 5rpx rgba(33,32,32,0.15));
background-color: #ffffff;
display: flex;
align-items: center;
padding: 34rpx 45rpx 34rpx 26rpx;
&__icon {
background-color: #f9f5e9;
height: 128rpx;
width: 152rpx;
display: flex;
align-items: center;
justify-content: center;
}
.center {
flex: 1;
margin-left: 18rpx;
}
.right {
margin-left: 12rpx;
}
&__title {
max-width: 300rpx;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 28rpx;
color: #000;
font-weight: bold;
}
&__sub-title {
padding-top: 20rpx;
font-size: 22rpx;
color: #929196;
font-weight: 500;
max-width: 304rpx;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&__price {
padding-top: 16rpx;
color: #c20d12;
font-size: 22rpx;
&--unit {
}
&--number {
font-size: 36rpx;
font-weight: 500;
}
}
}
.list-item + .list-item {
margin-top: 28rpx;
}
}
}
</style>
<template>
<view class="page">
<view class="top">
<!-- <view class="position" @click="$u.route({ url: '/pages/CitySelect/CitySelect' })"> -->
<view class="position" @click="isShowSite = true">
<u-icon name="map-fill"></u-icon>
<!-- <text>{{ vuex_location.city.replace(/(市|区|县)/,'') }}</text> -->
<text>{{select.site_name}}</text>
<u-icon name="arrow-down" size="22"></u-icon>
</view>
</view>
<view class="container">
<scroll-view scroll-y style="height: 100%;width: 100%;" @scrolltolower="reachBottom">
<image class="bkg" src="~@/package_sub/static/ServiceList/bkg.png" mode="aspectFill"></image>
<view v-if="list.length>0">
<view class="list">
<view class="list-item" v-for="(item,i) in list" :key="i" @click="toDetail(item)">
<view class="left">
<view class="list-item__icon">
<image style="width:152rpx;height:128rpx" :src="item.cover.url"></image>
</view>
</view>
<view class="center">
<view class="list-item__title">
{{item.name}}
</view>
<view class="list-item__sub-title">{{item.introduce?item.introduce:''}}</view>
<view class="list-item__price">
<text class="list-item__price--unit">¥</text>
<text class="list-item__price--number">{{item.price}}</text>
<text class="list-item__price--text">元/次</text>
</view>
</view>
<view class="right">
<u-button shape="circle" ripple :custom-style="orderBtnStyle"
@click.stop="toOrder(item)">预约</u-button>
</view>
</view>
<u-loadmore :margin-top="20" :status="loadStatus" bgColor="#f2f2f2"></u-loadmore>
</view>
</view>
<view v-else style="height: 100%;" class="d-flex ai-center jc-center">
<u-empty mode="list"></u-empty>
</view>
</scroll-view>
</view>
<!-- 选择站点 -->
<u-select v-model="isShowSite" value-name="id" @confirm="confirmSite" label-name="name"
:list="list_site"></u-select>
</view>
</template>
<script>
export default {
data() {
return {
orderBtnStyle: {
'background-image': 'linear-gradient(-90deg, #e26165 0%, #c10d12 94%, #c10d12 100%)',
'font-weight': '500',
'font-size': '27rpx',
'color': '#fff',
'width': '130rpx',
'height': '60rpx',
'line-height': '60rpx'
},
last_page:1,
select: {
page: 1,
page_size: 5,
type: '',
site_id: '',
site_name: '全部站点'
},
list: [],
loadStatus: 'loadmore',
isShowSite: false,
list_site: [{
id: '',
name: '全部站点'
}],
};
},
mounted() {
if (this.$store.state.vuex_location !== 2) {
this.$store.dispatch('getLocation')
}
},
onLoad(options) {
this.select.type = options.type ? options.type : ''
this.getSiteList()
this.getList()
},
methods: {
async getSiteList() {
const res = await this.$u.api.otherSite()
this.list_site.push(...res)
},
async getList() {
const res = await this.$u.api.accompanyProduct({
...this.select
})
this.last_page = res.last_page
this.loadStatus = this.select.page >= this.last_page ?'nomore':'loadmore'
this.list.push(...res.data)
console.log(this.select.page,this.last_page)
},
reachBottom() {
if (this.select.page > this.last_page) {
this.loadStatus = 'nomore'
return
}
this.loadStatus = 'loading'
this.select.page++
this.getList()
},
confirmSite(e) {
this.select.site_name = e[0].label
this.select.site_id = e[0].value
this.list = []
this.select.page = 1
this.getList()
},
toOrder(item) {
this.$u.route({
url: '/package_sub/pages/AddOrder/AddOrder?id=' + item.id + '&title=' + item.name +
'&site_id=' + item.site_id + '&type=' + item.type
})
},
toDetail(item) {
this.$u.route({
url: '/package_sub/pages/ServiceDetail/ServiceDetail?id=' + item.id
})
}
}
}
</script>
<style lang="scss">
.page {
position: relative;
}
.top {
width: 100vw;
background: #fff;
padding: 26rpx 28rpx;
z-index: 4;
position: sticky;
top: 0;
height: 94rpx;
.position {
color: #000;
font-size: 30rpx;
letter-spacing: 3rpx;
font-weight: 500;
&>text {
padding: 0 13rpx;
}
}
}
.container {
padding-bottom: 40rpx;
// padding-bottom: calc(constant(safe-area-inset-bottom) + 20rpx);
// padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx);
position: relative;
z-index: 1;
height: calc(100vh - 94rpx);
.bkg {
height: 316rpx;
width: 100vw;
position: absolute;
}
.list {
padding: 252rpx 25rpx 20rpx;
position: relative;
z-index: 3;
&-item {
border-radius: 10rpx;
filter: drop-shadow(2.192rpx 4.494rpx 5rpx rgba(33, 32, 32, 0.15));
background-color: #ffffff;
display: flex;
align-items: center;
padding: 34rpx 45rpx 34rpx 26rpx;
&__icon {
// background-color: #f9f5e9;
height: 128rpx;
width: 152rpx;
display: flex;
align-items: center;
justify-content: center;
}
.center {
flex: 1;
margin-left: 18rpx;
}
.right {
margin-left: 12rpx;
}
&__title {
max-width: 300rpx;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 28rpx;
color: #000;
font-weight: bold;
}
&__sub-title {
padding-top: 20rpx;
font-size: 22rpx;
color: #929196;
font-weight: 500;
max-width: 304rpx;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&__price {
padding-top: 16rpx;
color: #c20d12;
font-size: 22rpx;
&--unit {}
&--number {
font-size: 36rpx;
font-weight: 500;
}
}
}
.list-item+.list-item {
margin-top: 28rpx;
}
}
}
</style>

52
pages/index/index.vue
Unescape View File

@ -55,7 +55,7 @@
</view>
<view class="swiper">
<u-swiper :list="list"></u-swiper>
<u-swiper :list="list" name="url"></u-swiper>
</view>
<view class="links">
@ -82,28 +82,28 @@
<view class="hospitals__title">热门医院</view>
<view class="hospitals__content">
<view class="hospitals__content__item" v-for="item in 3" :key="item">
<view class="hospitals__content__item" v-for="(item,index) in list_hospital" :key="index">
<view class="left">
<image
src="https://sstt.115.langye.net/storage/files/172760356266f9236a22e58.png"
:src="item.cover?item.cover.url:''"
alt=""
mode="aspectFit"
mode="scaleToFill"
></image>
</view>
<view class="right">
<view class="title">苏州大学附属第一医院</view>
<view class="title">{{item.name}}</view>
<view class="tag">
<view class="tag__item">三甲</view>
<view class="tag__item">综合医院</view>
</view>
<view class="description"> 内科、外科、五官科、其他 </view>
<view class="description"> {{item.good_at}} </view>
</view>
</view>
</view>
</view>
<view class="statistics">
<view class="block1" @click="toPage('/package_sub/pages/AddOrder/AddOrder')">
<view class="block1" @click="toPage('/package_sub/pages/ServiceList/ServiceList?type=1')">
<view class="text1">陪诊团队介绍</view>
<view class="text2">让就医体验更美好</view>
<view class="order">预约陪诊</view>
@ -178,25 +178,13 @@ export default {
select: {
keyword: "",
},
list: [
{
image: "https://cdn.uviewui.com/uview/swiper/1.jpg",
title: "昨夜星辰昨夜风，画楼西畔桂堂东",
},
{
image: "https://cdn.uviewui.com/uview/swiper/2.jpg",
title: "身无彩凤双飞翼，心有灵犀一点通",
},
{
image: "https://cdn.uviewui.com/uview/swiper/3.jpg",
title: "谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳",
},
],
list: [],
list_hospital:[],
links: [
{
text: "陪诊服务",
icon: "/static/index/peizhenfuwu.png",
to: "/package_sub/pages/ServiceList/ServiceList"
to: "/package_sub/pages/ServiceList/ServiceList?type=1"
},
{
text: "就医服务",
@ -205,6 +193,7 @@ export default {
{
text: "居家照护",
icon: "/static/index/jujiazhaohu.png",
to: "/package_sub/pages/ServiceList/ServiceList?type=2"
},
{
text: "医院陪护",
@ -235,6 +224,8 @@ export default {
this.isShowSticky = e.scrollTop > this.scrollTop
},
onLoad() {
this.getBanners()
this.getHospital()
},
computed: {
navbarHeight() {
@ -250,6 +241,23 @@ export default {
}
}).exec()
},
async getBanners(){
const res = await this.$u.api.otherBanner({
position:1
})
res.map(item=>{
item.url = item.image.url
})
this.list = res
},
async getHospital(){
const res = await this.$u.api.listHospital({
page:1,
page_size:3
})
this.list_hospital = res.data
},
searchInput(e) {},
toPage (url, type='page') {

27
pages/order/order.vue
Unescape View File

@ -130,24 +130,30 @@ export default {
},
tabs: [
{
name: '全部'
name: '全部',
id:''
},
{
name: '待支付'
name: '待支付',
id:0
},
{
name: '待评价'
// name: '待评价',
name: '已支付',
id:1
},
{
name: '服务中',
id:2,
count: 12
},
{
name: '已完成'
name: '已完成',
id:3
},
{
name: '已取消'
}
// {
// name: '已取消'
// }
],
current: 0,
swiperCurrent: 0,
@ -188,7 +194,12 @@ export default {
this.$refs.tabs.setFinishCurrent(current);
this.swiperCurrent = current;
this.current = current;
}
},
async getOrder(){
const res = await this.$u.api.accompanyOrders({
pay_status:1
})
},
}
};
</script>

Write Preview
Loading…
Cancel
Save