first commit
This commit is contained in:
@@ -0,0 +1,251 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
.list-card {
|
||||
background: #FFFFFF;
|
||||
width: 92%;
|
||||
margin: 0px auto 20px;
|
||||
box-shadow: 0 2px 10px rgb(125 126 128 / 16%);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.van-dropdown-menu__bar {
|
||||
display: -webkit-box;
|
||||
}
|
||||
|
||||
.card-head {
|
||||
line-height: 30px;
|
||||
padding: 8px 16px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.state-text {
|
||||
position: absolute;
|
||||
right: 16px;
|
||||
}
|
||||
|
||||
.cancel-button {
|
||||
text-align: right;
|
||||
padding: 10px 16px;
|
||||
}
|
||||
|
||||
.cancel-button .van-button {
|
||||
height: 27px !important;
|
||||
padding: 0 18px !important;
|
||||
}
|
||||
|
||||
.apply_pop {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #f6f7f9;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.van-doc-card {
|
||||
background-color: #fff;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 8px 12px #ebedf0;
|
||||
line-height: 20px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.van-card-header {
|
||||
padding: 14px 20px;
|
||||
border-bottom: 1px solid #ebeef5;
|
||||
box-sizing: border-box;
|
||||
color: #0e78c5;
|
||||
font-weight: bold;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.van-card-body {
|
||||
padding: 0px 10px 0px 10px
|
||||
}
|
||||
|
||||
.van-doc-card > div:first-child {
|
||||
border: 2px #0e78c5 solid;
|
||||
width: 26px;
|
||||
border-radius: 6px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar
|
||||
title="我的预约记录"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="window.history.back()"
|
||||
></van-nav-bar>
|
||||
|
||||
<div class="search-fixed">
|
||||
<van-dropdown-menu>
|
||||
<van-dropdown-item v-model="pageForm.year" :options="yearList"
|
||||
@change="doSearch"></van-dropdown-item>
|
||||
<van-dropdown-item v-model="pageForm.stateId" :options="stateList"
|
||||
@change="doSearch"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</div>
|
||||
|
||||
<div style="margin: 60px auto 0 auto">
|
||||
<van-list v-model="loading"
|
||||
:finished="finished"
|
||||
:finished-text="tableData.length>0?'没有更多了':''"
|
||||
:immediate-check="false"
|
||||
@load="pageData">
|
||||
<div v-for="o in tableData" class="list-card" @click="viewInfo(o)">
|
||||
<div class="card-head">
|
||||
心理咨询预约
|
||||
<span class="state-text">
|
||||
<van-tag size="medium" v-if="o.stateId===2300" type="success">{{o.stateName}}</van-tag>
|
||||
<van-tag size="medium" v-if="o.stateId===2200" type="error">{{o.stateName}}</van-tag>
|
||||
<van-tag size="medium" v-if="o.stateId===2100" type="warning">{{o.stateName}}</van-tag>
|
||||
</span>
|
||||
</div>
|
||||
<van-cell-group inset>
|
||||
<van-cell :border="false" title="预约人">{{o.appointmentUserName}}</van-cell>
|
||||
<van-cell :border="false" title="开始时间">{{o.startTime}}</van-cell>
|
||||
<van-cell :border="false" title="结束时间">{{o.endTime}}</van-cell>
|
||||
</van-cell-group>
|
||||
<div class="cancel-button">
|
||||
<van-button v-if="moment().unix() < moment(o.startTime).unix()" @click.stop="doCancel(o.id)" round
|
||||
size="small" color="#1867b0">取消预约
|
||||
</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-list>
|
||||
</div>
|
||||
|
||||
<van-empty v-if="mLoading==false&&tableData.length==0" class="custom-image" image="/none.svg"
|
||||
description="暂无数据">
|
||||
</van-empty>
|
||||
|
||||
<van-popup v-model="show" class="apply_pop" position="right">
|
||||
<van-nav-bar
|
||||
title="预约详细信息"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="show = false"
|
||||
safe-area-inset-top></van-nav-bar>
|
||||
|
||||
<div class="van-doc-card" style="margin: 16px">
|
||||
<div></div>
|
||||
<div class="van-card-header">
|
||||
预约时间段
|
||||
</div>
|
||||
<div class="van-card-body">
|
||||
<van-cell-group>
|
||||
<van-cell title="开始时间">{{ viewData.startTime }}</van-cell>
|
||||
<van-cell title="结束时间">{{ viewData.endTime }}</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="van-doc-card" style="margin: 16px">
|
||||
<div></div>
|
||||
<div class="van-card-header">
|
||||
预约人信息
|
||||
</div>
|
||||
<div class="van-card-body">
|
||||
<van-cell-group>
|
||||
<van-cell title="姓名">{{ viewData.appointmentUserName }}</van-cell>
|
||||
<van-cell title="工号">{{ viewData.appointmentLoginName }}</van-cell>
|
||||
<van-cell title="单位">{{ viewData.appointmentUnitName }}</van-cell>
|
||||
<van-cell title="电话">{{ viewData.appointmentMobile }}</van-cell>
|
||||
<van-cell title="预约备注">{{ viewData.appointmentUserNote }}</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="van-doc-card" style="margin: 16px">
|
||||
<div></div>
|
||||
<div class="van-card-header">
|
||||
咨询师信息
|
||||
</div>
|
||||
<div class="van-card-body">
|
||||
<van-cell-group>
|
||||
<van-cell title="姓名">{{ viewData.doctorUserName || '暂无'}}</van-cell>
|
||||
<van-cell title="单位">{{ viewData.doctorUnitName || '暂无'}}</van-cell>
|
||||
<van-cell title="职称">{{ viewData.doctorJobTitle || '暂无'}}</van-cell>
|
||||
<van-cell title="电话">{{ viewData.doctorMobile || '暂无'}}</van-cell>
|
||||
<van-cell title="个人简介">{{ viewData.doctorIntroduce || '暂无'}}</van-cell>
|
||||
</van-cell-group>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</van-popup>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [mobileMixins],
|
||||
data() {
|
||||
return {
|
||||
stateList: [
|
||||
{text: '全部预约状态', value: null},
|
||||
{text: '预约中', value: 2100},
|
||||
{text: '预约成功', value: 2300},
|
||||
{text: '预约失败', value: 2200}
|
||||
],
|
||||
show: false,
|
||||
viewData: {},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async pageData() {
|
||||
this.loading = true
|
||||
const {data} = await $.get('/mobile/psychologyPro/MyPageData', this.pageForm)
|
||||
setTimeout(() => {
|
||||
this.tableData = this.tableData.concat(data.list)
|
||||
if (this.tableData.length === data.totalCount) {
|
||||
this.finished = true
|
||||
} else {
|
||||
this.pageForm.pageNumber++
|
||||
}
|
||||
this.loading = false
|
||||
this.pageForm.totalCount = data.totalCount
|
||||
}, 300)
|
||||
},
|
||||
doSearch() {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
viewInfo(o) {
|
||||
this.viewData = o
|
||||
this.show = true
|
||||
},
|
||||
async doCancel(id) {
|
||||
const confirm = await vant.Dialog.confirm({
|
||||
title: '提示',
|
||||
message: '您确定取消此次预约吗?',
|
||||
confirmButtonColor: '#1867b0'
|
||||
})
|
||||
if (confirm === 'confirm') {
|
||||
const resp = await $.post('/mobile/psychologyPro/doCancel', {id})
|
||||
if (resp.code === 0) {
|
||||
vant.Toast.success('取消成功')
|
||||
this.doSearch()
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.pageForm.year = this.yearList[0].value
|
||||
this.pageForm.stateId = null
|
||||
this.pageData()
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user