You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

325 lines
7.7 KiB

<template>
<view class='add-visitor-page'>
<view class="header block flex line40" @click="addVisitor">
<img :src="cssUrl+'add.svg'">增加就诊人
</view>
<view class="list-wrapper" v-if="type == 1">
<view :class="'item block'+(item.select?' active':'')" v-for="(item,key) in visitUsers" @click="chooseVisitor(item, key)">
<view class="top flex">
<view class="name PfScSemibold">{{item.real_name}}</view>
<view class="aam_times" v-if="item.aam_times">剩余{{item.aam_times}}次</view>
</view>
<view class="bot line36">
身份证尾号:{{item.id_no}}
</view>
<img class="status" :src="cssUrl+'visitor_select_active.svg'">
<img class="bg" :src="cssUrl+'visitor_list__bg.svg'">
</view>
</view>
<view class="submit" v-if="type == 1" @click="toPrebook">
<view class="bot primary btn btn2 submitbtn" hover-class="hover">
确认预约(已选{{selectCount}}位)
</view>
<view class="tip height40">请确保预约就诊前在门诊先挂号</view>
</view>
<view class="list-wrapper2" v-if="type == 2">
<view class="item block" v-for="(item,key) in visitUsers">
<view class="top flex">
<view class="PfScSemibold">{{item.name}}</view>
<view>身份证尾号:{{item.id_no}}</view>
</view>
<view class="bt">
<view class="bt-item flex">
<view class="left flex"><view class="over3">广安门中医医院西单门诊部</view><view class="status2">10周未看病</view></view>
<view class="more right" v-if="res">剩余<text>2</text>次</view>
<view class="owe right" v-else>超<text>10</text>次</view>
</view>
<view class="bt-item flex">
<view class="left flex"><view class="over3">顺天德中医医院</view><view class="status2">停诊</view></view>
<view class="more right" v-if="res">剩余<text>20</text>次</view>
<view class="owe right" v-else>超<text>10</text>次</view>
</view>
</view>
</view>
<view class="item block">
<view class="top flex">
<view class="PfScSemibold">上官梓涵</view>
<view>身份证尾号:9000</view>
</view>
<view class="bt">
<view class="bt-item flex">
<view class="left flex"><view class="over3">广安门中医医院西单门诊部</view></view>
<view class="owe right"><text>10</text></view>
</view>
</view>
</view>
</view>
<pop
ref="popcom"
:content="popContent"
:title="popTitle"
:showCancel='popShowCancel'
@confirm="popConfirm"
@cancel="popCancel"
></pop>
</view>
</template>
<script>
import pop from '@/components/pop.vue';
export default {
data() {
return {
cssUrl:this.cssUrl,
type:1,
res:true,
popContent:'删除张杨明后,就诊记录还可以查到,确定删除吗?',
popTitle:'确认删除',
popShowCancel:true,
visitUsers:false,
selectCount:0
}
},
components:{
pop
},
onLoad(option) {
if(option.type) this.type = option.type
this.getVisitors()
},
methods: {
chooseVisitor(info, key){
this.selectCount = 0
this.visitUsers[key].select = !this.visitUsers[key].select
this.$set(this.visitUsers, key, this.visitUsers[key])
for (let i = 0; i < this.visitUsers.length; i++) {
if(this.visitUsers[i].select) ++this.selectCount
}
},
getVisitors() {
var param = new Object()
param.page = 1
param.limit = 10000
this.$http.req('client/user/visit_user/', param, 'GET').then(data=>{
if(data == -1) return
this.visitUsers = data.data
for (var i = 0; i < this.visitUsers.length; i++) {
this.visitUsers[i].select = false
}
});
},
showPopCom() {
this.$refs.popcom.open()
},
popConfirm(e){
},
popCancel(e){
},
addVisitor(){
uni.navigateTo({
url:"/pages/modify_visitor/modify_visitor"
})
},
toPrebook(){
if(this.selectCount <= 0){
this.$pop.modelShow('请选择就诊人')
return
}
uni.navigateTo({
url:"/pages/prebook/prebook"
})
}
}
}
</script>
<style lang="scss" scoped>
.add-visitor-page{
overflow: hidden;
.block{
width: 714rpx;
background: #FFFFFF;
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0,0,0,0.03);
border-radius: 8rpx;
margin: 20rpx auto 0;
}
.header{
justify-content: center;
height: 96rpx;
align-items: center;
font-size: 28rpx;
color: #666666;
img{
width: 44rpx;
height: 44rpx;
margin-right: 16rpx;
}
}
.list-wrapper{
height: 70vh;
padding-bottom: 20rpx;
overflow-y: auto;
box-sizing: border-box;
.item{
padding: 34rpx 24rpx;
box-sizing: border-box;
height: 196rpx;
position: relative;
.top{
line-height: 50rpx;
height: 50rpx;
align-items: center;
.name{
font-size: 38rpx;
color: #333333;
letter-spacing: 3rpx;
}
.aam_times{
min-width: 134rpx;
color: #79624A;
text-align: center;
font-size: 28rpx;
background: rgba(254, 232, 198, 0.66);
border-radius: 6rpx;
height: 44rpx;
padding: 0 10rpx;
line-height: 44rpx;
margin-left: 56rpx;
}
}
.bot{
margin-top: 32rpx;
font-size: 30rpx;
color: #949699;
}
img{
position: absolute;
}
&.active{
border: 2rpx solid #39D067;
.status{
display: block;
}
}
.status{
right: 0;
top: 0;
width: 98rpx;
height: 98rpx;
display: none;
}
.bg{
bottom: 0;
right: 0;
width: 162rpx;
height: 78rpx;
}
}
}
.submit{
position: fixed;
width: 100%;
top: 82.41%;
.submitbtn{
width: 646rpx;
margin: 0 auto;
}
.tip{
text-align: center;
font-size: 28rpx;
color: #B3B4BC;
margin-top: 33rpx;
}
}
.list-wrapper2{
.item{
.top{
background: #5CD378;
width: 100%;
height: 118rpx;
line-height: 118rpx;
box-sizing: border-box;
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0,0,0,0.03), 0rpx 2rpx 24rpx 0rpx rgba(0,0,0,0.03);
border-radius: 8rpx 8rpx 0rpx 0rpx;
padding: 0 24rpx 0 24rpx;
justify-content: space-between;
color: #FFFFFF;
view:first-of-type{
font-size: 38rpx;
letter-spacing: 3rpx;
}
view:last-of-type{
font-size: 28rpx;
letter-spacing: 2rpx;
}
}
.bt{
padding: 30rpx;
min-height: 118rpx;
box-sizing: border-box;
.bt-item{
min-height: 55rpx;
align-items: flex-end;
align-items:center;
margin-bottom: 24rpx;
.left{
max-width: 580rpx;
align-items:center;
view:first-of-type{
min-height: 40rpx;
line-height: 40rpx;
font-size: 28rpx;
color: #949699;
letter-spacing: 2rpx;
max-width: 250rpx;
align-items: flex-end;
}
.status2{
height: 38rpx;
background: #FFE9E9;
line-height: 38rpx;
padding: 0 7rpx;
font-size: 28rpx;
color: #FD0000;
margin-left: 8rpx;
}
}
.right{
flex-grow: 1;
&.more{
font-size: 28rpx;
color: #949699;
letter-spacing: 2rpx;
text-align: right;
text{
font-size: 52rpx;
color: #000000;
letter-spacing: 3rpx;
}
}
&.owe{
text-align: right;
font-size: 28rpx;
color: #FD0000;
letter-spacing: 2rpx;
line-height: 52rpx;
text{
font-size: 52rpx;
color: #FD0000;
line-height: 52rpx;
letter-spacing: 3rpx;
}
}
}
}
}
}
}
}
</style>