first commit
This commit is contained in:
@@ -0,0 +1,259 @@
|
||||
<!--#
|
||||
layout("/mobile/platform.html"){
|
||||
#-->
|
||||
|
||||
<style>
|
||||
|
||||
/*.info {*/
|
||||
/* position: relative;*/
|
||||
/* width: 88%;*/
|
||||
/* margin: 20px auto;*/
|
||||
/* font-size: 14px;*/
|
||||
/* box-shadow: 0 2px 10px rgb(125 126 128 / 16%);*/
|
||||
/* padding: 12px;*/
|
||||
/* border-radius: 10px;*/
|
||||
/* background-color: white;*/
|
||||
/*}*/
|
||||
|
||||
/*.avatar {*/
|
||||
/* width: 28%;*/
|
||||
/*}*/
|
||||
|
||||
/*.other_info {*/
|
||||
/* width: 72%;*/
|
||||
/* line-height: 22px;*/
|
||||
/* display: flex;*/
|
||||
/* flex-direction: column;*/
|
||||
/* justify-content: space-between;*/
|
||||
/*}*/
|
||||
|
||||
/*.desc {*/
|
||||
/* overflow: hidden;*/
|
||||
/* white-space: nowrap;*/
|
||||
/* text-overflow: ellipsis;*/
|
||||
/*}*/
|
||||
|
||||
/*img {*/
|
||||
/* border-radius: 10px;*/
|
||||
/*}*/
|
||||
|
||||
/*.van-dropdown-menu__item {*/
|
||||
/* flex: auto;*/
|
||||
/*}*/
|
||||
|
||||
</style>
|
||||
|
||||
<style>
|
||||
.therapist-card {
|
||||
background: white;
|
||||
margin: 16px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
padding: 16px;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #f1f3f5;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
border: 2px solid #f8f9fa;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-size: 17px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 4px;
|
||||
color: #212529;
|
||||
}
|
||||
|
||||
.meta {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.gender {
|
||||
font-size: 13px;
|
||||
color: #868e96;
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.unit {
|
||||
font-size: 13px;
|
||||
color: #868e96;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.section {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #495057;
|
||||
margin-bottom: 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.section-title i {
|
||||
margin-right: 8px;
|
||||
color: #adb5bd;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.section-content {
|
||||
font-size: 14px;
|
||||
color: #495057;
|
||||
line-height: 1.7;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar
|
||||
title="心理咨询师列表"
|
||||
left-arrow
|
||||
placeholder
|
||||
fixed
|
||||
@click-left="window.history.back()">
|
||||
</van-nav-bar>
|
||||
|
||||
<van-dropdown-menu>
|
||||
<van-dropdown-item v-model="pageForm.typeId" :options="typeList"
|
||||
@change="doSearch"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
|
||||
<div style="height: calc(100vh - 50px - 46px - 50px );overflow-y: auto">
|
||||
<div class="therapist-card" v-for="item in tableData" :key="item.id" @click="toApply(item)">
|
||||
<div class="card-header">
|
||||
<img :src="CREATE_PREVIEW_URL(item.avatar)" alt="任瑞" class="avatar"
|
||||
onerror="this.src='https://via.placeholder.com/80'">
|
||||
<div class="info">
|
||||
<div class="name">{{item.username}}</div>
|
||||
<div>
|
||||
<span class="gender female"><i class="fa fa-venus"></i> {{item.sex}}</span>
|
||||
</div>
|
||||
<div class="unit">{{item.unitName}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body">
|
||||
<div class="section">
|
||||
<div class="section-title"><i class="fa fa-graduation-cap"></i>简介</div>
|
||||
<div class="section-content">
|
||||
{{item.introduce}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="section">
|
||||
<div class="section-title"><i class="fa fa-heart"></i>擅长领域</div>
|
||||
<div class="section-content">{{item.specialty}}</div>
|
||||
</div>
|
||||
|
||||
<div class="section" v-if="item.workingIdeal">
|
||||
<div class="section-title"><i class="fa fa-quote-left"></i>工作理念</div>
|
||||
<div class="section-content">{{item.workingIdeal}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!--咨询师列表-->
|
||||
<!-- <div class="info" @click="toApply(item)" v-for="item in tableData" style="margin-bottom: 20px">-->
|
||||
<!-- <div style="display: flex;">-->
|
||||
<!-- <!–头像–>-->
|
||||
<!-- <div class="avatar">-->
|
||||
<!-- <van-image width="80" :src="CREATE_PREVIEW_URL(item.avatar)"></van-image>-->
|
||||
<!-- </div>-->
|
||||
<!-- <!–其他信息–>-->
|
||||
<!-- <div class="other_info">-->
|
||||
<!-- <div>-->
|
||||
<!-- <span style="font-size: 20px">{{item.username}} </span>-->
|
||||
<!-- <span style="color: grey">{{item.sex}} </span> -->
|
||||
<!-- </div>-->
|
||||
<!-- <div>-->
|
||||
<!-- <!– <div>-->
|
||||
<!-- <span style="color: grey">职称：</span>{{item.jobTitle}}-->
|
||||
<!-- </div>–>-->
|
||||
|
||||
<!-- <div class="desc">-->
|
||||
<!-- <span style="color: grey">擅长方向：</span>{{item.specialty}}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div>-->
|
||||
<!-- <span style="color: grey">简介：</span>{{item.introduce}}-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <van-empty v-if="tableData.length==0" class="custom-image" image="/none.svg"-->
|
||||
<!-- description="暂无数据">-->
|
||||
<!-- </van-empty>-->
|
||||
|
||||
<div>
|
||||
<van-tabbar v-model="tarBarActive">
|
||||
<van-tabbar-item icon="home-o" replace url="/mobile/psychologyPro/entrance">心理咨询预约</van-tabbar-item>
|
||||
<van-tabbar-item icon="manager-o" replace url="/mobile/psychologyPro/myApplyList">我的预约</van-tabbar-item>
|
||||
</van-tabbar>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const vue = new Vue({
|
||||
el: '#app',
|
||||
mixins: [mobileMixins],
|
||||
data() {
|
||||
return {
|
||||
tarBarActive: 0,
|
||||
typeList: [
|
||||
{text: '时间不限', value: 'no'},
|
||||
{text: '本周', value: 'thisWeek'},
|
||||
{text: '下周', value: 'nextWeek'},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doSearch() {
|
||||
this.tableData = []
|
||||
this.pageData()
|
||||
},
|
||||
async pageData() {
|
||||
const resp = await $.post('/mobile/psychologyPro/pageData', this.pageForm)
|
||||
if (resp.code === 0) {
|
||||
this.tableData = resp.data
|
||||
}
|
||||
},
|
||||
toApply(o) {
|
||||
location.href = '/mobile/psychologyPro/apply?doctorId=' + o.userid + '&typeId=' + this.pageForm.typeId
|
||||
}
|
||||
},
|
||||
async created() {
|
||||
this.$set(this.pageForm, "typeId", this.typeList[0].value)
|
||||
await this.pageData()
|
||||
},
|
||||
})
|
||||
</script>
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user