xinelu-doctor-app/pages/homepage/homepage.vue
2023-11-08 09:10:38 +08:00

595 lines
13 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="app">
<u-tabs :list="tabslist" :is-scroll="false" :current="tabscurrent" @change="tabschange" inactive-color='#fff'
active-color='#fff'></u-tabs>
<view class="">
<view class="top" v-if="tabscurrent==0">
<u-dropdown active-color='#26A888'>
<u-dropdown-item v-model="optionindex" :title="optionname" :options="options"
@change='dropitemchange'></u-dropdown-item>
</u-dropdown>
<view class="inputs"></view>
</view>
<view class="items" v-if="missionlist.length>0">
<view class="item" v-for="(item,index) in missionlist" @click.stop='gotaskDetails(item)'>
<view class="title" :style="tabscurrent==1?'border:none':''">
<view class="text">
专家咨询({{item.patientName}}
</view>
<view class="image">
<image src="../../static/jinbi.png" mode=""></image>
<span v-if="item.orderCommissionAmount&&item.orderCommissionAmount>=0">
+ {{item.orderCommissionAmount}}
</span>
<span v-else>
+ 0
</span>
</view>
</view>
<view class="time" v-if="tabscurrent!=1">
预约时间:
<span>{{item.appointmentDate}}
</span>
<span
v-if="item.appointmentStartTime && item.appointmentEndTime ">{{' '+item.appointmentStartTime}}{{'-'+item.appointmentEndTime}}</span>
</span>
</view>
<view class="time" style="line-height: 40rpx;" v-if="tabscurrent!=1">
问题简述:
<span>{{item.problemDescription}}</span>
</view>
<view class="tabscurrent" v-if="tabscurrent ==1">
<view class="time">
姓名:
<span>{{item.patientName}}</span>
</view>
<view class="time">
性别:
<span>{{item.sex}}</span>
</view>
<view class="time">
身份证号:
<span>{{item.cardNo}}</span>
</view>
<view class="time">
手机号码:
<span>{{item.phone}}</span>
</view>
<view class="time">
家庭住址:
<span>{{item.address}}</span>
</view>
<view class="time">
预约时间:
<span>{{item.appointmentDate}}{{' '+item.appointmentStartTime}}{{'-'+item.appointmentEndTime}}</span>
</view>
<view class="time" style="line-height: 40rpx;">
问题简述:
<span>{{item.problemDescription}}</span>
</view>
</view>
<view class="btns">
<view class="text" v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'">
待接单
</view>
<view class="text" v-if="item.orderStatus=='RECEIVED_GOODS'">
待服务
</view>
<view class="text" v-if="item.orderStatus=='COMPLETED'" style="color: #9D9D9D;">
已完成
</view>
<view class="btnreturn" @click.stop='gotaskReturn(item)'
v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'">
退回
</view>
<view class="btnaccept" @click.stop='Receivingorders(item)'
v-if="item.orderStatus=='WAIT_RECEIVED_GOODS'">
接单
</view>
<view class="btnreturn" @click.stop='goconfirmCompletion(item)'
style="background-color:#18CBB3;color: #fff;" v-if="item.orderStatus=='RECEIVED_GOODS'">
完成
</view>
<view class="btnaccept" @click.stop='govideo(item)' v-if="item.orderStatus=='RECEIVED_GOODS'">
视频通话
</view>
</view>
</view>
</view>
<view v-else class="" style="margin-top: 100rpx;">
<u-empty text="暂无工单" mode="list" icon-size='240' font-size='32'></u-empty>
</view>
</view>
<!-- <view class="">
<view class="inputs" style="width: 90%;height: 60rpx;transform: none;margin: 20rpx auto;">
<i class="icon"></i>
<input type="text" name="" id="" class="input" placeholder="搜索" v-model="formdata.name">
</view>
<view class="lists" v-if="listinfo">
<view class="item" v-for="item in listinfo" @tap='goseekadvicefrom(item)'>
<image src="../../static/headsculpture.png" mode=""></image>
<view class="name">
{{item.patientName}}
</view>
<view class="text">
{{item.content}}
</view>
<view class="count" v-if="item.messageCount>0">
{{item.messageCount}}
</view>
</view>
</view>
</view> -->
<u-toast ref="uToast" />
</view>
</template>
<script>
import {
getList,
updateStatus,
closeHealthConsultationOrder,
consultationInfolist,
getUserSig,
consultation,
} from '@/api/homepage/index.js'
import {
getSex
} from '@/utils/conversion.js'
export default {
data() {
return {
tabslist: [{
name: '全部工单',
value: '',
}, {
name: '我的工单',
value: 'RECEIVED_GOODS',
}, {
name: '已完成工单',
value: 'COMPLETED',
}],
tabscurrent: 0,
optionindex: 0,
optionname: '全部',
options: [{
label: '全部',
value: '',
}, {
label: '待接单',
value: 'WAIT_RECEIVED_GOODS',
}, {
label: '待服务',
value: 'RECEIVED_GOODS',
}, {
label: '已完成',
value: 'COMPLETED',
}],
query: {
hospitalPersonId: uni.getStorageSync("id"),
orderStatus: '',
orderType: '',
pageNum: 1,
pageSize: 10,
},
missionlist: [],
missiontotal: 0,
remark: '',
formdata: {
pageNum: 1,
pageSize: 10,
doctorId: uni.getStorageSync("id"),
consultationType: 'IMAGE_TEXT_CONSULTATION',
status: '',
},
listinfo: [],
listtotal: 0,
}
},
onShow() {
this.info();
},
methods: {
//前往聊天
goseekadvicefrom(item) {
uni.navigateTo({
url: `/pages/seekadvicefrom/seekadvicefrom?item=${JSON.stringify(item)}`
})
},
//详情
gotaskDetails(item) {
uni.navigateTo({
url: `/pages/taskDetails/taskDetails?id=${item.consultationInfoId}&title=${item.orderStatus}`
})
},
//完成
goconfirmCompletion(item) {
var obj = {
"goodsOrderId": item.goodsOrderId,
"orderStatus": "COMPLETED",
}
updateStatus(obj).then(res => {
if (res.code == 200) {
this.$refs.uToast.show({
title: '工单已成功',
type: 'success',
duration: '1500'
})
this.info();
}
})
},
//任务退回
gotaskReturn(item) {
uni.navigateTo({
url: `/pages/taskReturn/taskReturn?item=${JSON.stringify(item)}`
})
},
//接单
Receivingorders(item) {
var obj = {
"goodsOrderId": item.goodsOrderId,
"orderStatus": "RECEIVED_GOODS",
}
updateStatus(obj).then(res => {
if (res.code == 200) {
this.$refs.uToast.show({
title: '接单成功',
type: 'success',
duration: '1500'
})
this.info();
}
})
},
// 视频通话
govideo(item) {
uni.navigateTo({
url: `/pages/Industrialbutler/Industrialbutler?item=${JSON.stringify(item)}`
})
},
info() {
this.query.pageNum = 1
getList(this.query).then(res => {
res.rows.forEach(e => {
e.sex = getSex(e.cardNo)
})
this.missionlist = res.rows
this.missiontotal = res.total
})
// consultationInfolist(this.formdata).then(res => {
// this.listinfo = res.rows
// this.listtotal = res.rows
// })
},
tabschange(index) {
this.tabscurrent = index;
this.query.orderStatus = this.tabslist[index].value
this.optionname = '全部'
this.optionindex = 0
this.info();
},
dropitemchange(e) {
this.optionname = this.options.find(m => m.value === e).label
this.query.orderStatus = this.options.find(m => m.value === e).value
this.info();
},
},
onReachBottom() { //下滑加载
if (this.missionlist.length >= this.missiontotal) {} else {
this.query.pageNum++
getList(this.query).then(
res => {
res.rows.forEach(e => {
e.sex = getSex(e.cardNo)
this.missionlist.push(e)
})
})
}
},
onPullDownRefresh() { //下拉刷新
this.info();
setTimeout(function() {
uni.stopPullDownRefresh();
}, 1000);
},
}
</script>
<style lang="scss">
page {
background-color: #fff;
}
.app {
width: 100%;
// margin: 20rpx auto;
padding: 0 0 100rpx 0;
background-color: #fff;
font-size: 24rpx;
.lists {
width: 96%;
margin: 0 auto;
.item {
position: relative;
height: 180rpx;
.count {
position: absolute;
right: 10rpx;
bottom: 50rpx;
width: 28rpx;
height: 28rpx;
background: #FF0000;
border-radius: 50%;
text-align: center;
line-height: 28rpx;
color: #fff;
font-weight: 400;
color: #FFFFFF;
}
.text {
font-size: 24rpx;
font-weight: 400;
color: #999999;
position: absolute;
left: 160rpx;
bottom: 50rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: calc(100% - 220rpx);
}
.name {
position: absolute;
left: 160rpx;
top: 40rpx;
font-size: 28rpx;
font-weight: 400;
color: #333333;
}
image {
position: absolute;
top: 50%;
left: 20rpx;
transform: translateY(-50%);
width: 110rpx;
height: 110rpx;
border-radius: 50%;
}
}
}
.inputs {
background-color: #fff;
width: 65%;
// height: 60rpx;
// border: 1px solid #F6F6F6;
height: 0rpx;
border-radius: 5rpx;
background-color: #ffffff;
z-index: 999;
position: relative;
top: 50%;
transform: translateY(-50%);
background: #F6F6F6;
border-radius: 38rpx;
.input {
margin: 0 auto;
position: absolute;
height: 60rpx;
// top: 8%;
left: 13%;
width: 80%;
font-size: 26rpx;
color: #000000;
}
.icon {
background: url(@/static/sousuo.png) no-repeat;
width: 30rpx;
height: 28rpx;
background-size: cover;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 3%;
}
}
.btnss {
display: flex;
text-align: center;
border-top: 1rpx solid #f6f6f6;
font-size: 32rpx;
line-height: 100rpx;
width: 100%;
position: absolute;
bottom: 0;
.cancel {
width: 50%;
height: 100rpx;
border-right: 0.5rpx solid #f6f6f6;
}
.Rescind {
width: 50%;
height: 100rpx;
color: #18CBB3;
border-left: 0.5rpx solid #f6f6f6;
}
}
.items {
width: 96%;
margin: 0 auto;
.item {
margin: 15rpx auto;
background-color: #fff;
box-shadow: 0rpx 9rpx 31rpx 9rpx rgba(0, 0, 0, 0.03);
border-radius: 5rpx;
padding: 3%;
width: 100%;
position: relative;
color: #333333;
font-size: 30rpx;
padding-bottom: 60rpx;
.tabscurrent {
width: 100%;
padding: 30rpx;
margin: 0 auto;
background: #F7F9F8;
border-radius: 14rpx;
}
.btns {
margin-top: 60rpx;
display: flex;
position: relative;
height: 30rpx;
.text {
// width: 82rpx;
height: 27rpx;
font-size: 28rpx;
font-weight: 500;
color: #E57726;
line-height: 55rpx;
}
.btnaccept,
.btnreturn {
width: 170rpx;
height: 60rpx;
text-align: center;
line-height: 55rpx;
border-radius: 50rpx;
border: 1px solid #18CBB3;
position: absolute;
}
.btnaccept {
right: 24rpx;
color: #fff;
background-color: #18CBB3;
}
.btnreturn {
right: 220rpx;
color: #18CBB3;
background: #FFFFFF;
}
}
.time {
line-height: 60rpx;
font-size: 24rpx;
font-weight: 400;
color: #333333;
span {
word-break: break-all;
padding-left: 10rpx;
}
}
.itemimg {
position: absolute;
right: 15rpx;
top: 18rpx;
width: 140rpx;
height: 120rpx;
}
.title {
font-size: 32rpx;
line-height: 100rpx;
border-bottom: 1rpx solid #E6E6E6;
color: #333333;
position: relative;
height: 100rpx;
.text {
height: 100%;
overflow: hidden; //超出的文本隐藏
display: -webkit-box;
-webkit-line-clamp: 1; // 超出多少行
-webkit-box-orient: vertical;
width: 50%;
}
.image {
position: absolute;
right: 0%;
top: 50%;
transform: translateY(-50%);
display: inline-block;
font-size: 30rpx;
color: #EA706A;
image {
// vertical-align: middle;
transform: translateY(20%);
width: 40rpx;
height: 40rpx;
padding-right: 10rpx;
}
}
}
}
}
::v-deep .u-tabs {
background-color: #18CBB3 !important;
}
.top {
width: 82%;
margin: 0 auto;
display: flex;
height: 84rpx;
justify-content: space-around;
::v-deep .u-flex {
width: 100% !important;
}
::v-deep .u-dropdown__content {
overflow-y: scroll !important;
height: 500rpx;
.u-flex {
width: 0 !important;
}
}
::v-deep .u-dropdown__content__mask {
background: none !important;
}
::v-deep .u-dropdown__menu__item {
width: 100% !important;
}
::v-deep .u-cell__value {
flex: 0;
}
::v-deep .u-dropdown {
:v-deep .u-dropdown__menu {}
}
::v-deep .u-cell-box {}
}
}
</style>