Files
xk-client-wx/pages/index/index.vue

489 lines
13 KiB
Vue

<template>
<view class="content safe-area-inset-bottom">
<!-- 标题 -->
<view class="title">
<text>全部消息</text>
<view class="clear" @click="getClearInfo">
<text class="iconfont icon-qingchu"></text>
清除未读
</view>
</view>
<!-- 消息列表 -->
<view class="list" @click="goSystem">
<!-- 头像 -->
<view class="avator">
<view class="img">
<image src="/static/xx/xt.png" mode=""></image>
</view>
<u-badge size="default" v-if="system.num>=0" :count="system.num" :is-dot="system.num==0?true:false"
type="error" :offset="system.num>0?[-4,-8]:[0,0]"></u-badge>
</view>
<!-- 描述 -->
<view class="info">
<view class="infos_title">
<text class="infos">系统消息</text>
<text class="time">{{ system.time }}</text>
</view>
<view class="preview" v-if="system.num >0">
您有{{ system.num }}条未读信息
</view>
<view class="preview" v-if="system.num==undefined">
暂无新消息
</view>
</view>
</view>
<view class="list" @click="goOrder">
<!-- 头像 -->
<view class="avator">
<view class="img">
<image src="/static/xx/cp.png" mode=""></image>
</view>
<u-badge size="default" v-if="order.num>=0" :count="order.num" :is-dot="order.num==0?true:false"
type="error" :offset="order.num>0?[-4,-8]:[0,0]"></u-badge>
</view>
<!-- 描述 -->
<view class="info">
<view class="infos_title">
<text class="infos">产品订单</text>
<text class="time">{{ order.time }}</text>
</view>
<view class="preview" v-if="order.num>0">
您有{{ order.num }}条未读信息
</view>
<view class="preview" v-if="order.num==undefined">
暂无新消息
</view>
</view>
</view>
<view class="list" @click="goDoctor">
<!-- 头像 -->
<view class="avator">
<view class="img">
<image src="/static/xx/ysxx.png" mode=""></image>
</view>
<u-badge size="default" v-if="doctor.num>=0" :count="doctor.num" :is-dot="doctor.num==0?true:false"
type="error" :offset="doctor.num>0?[-4,-8]:[0,0]"></u-badge>
</view>
<!-- 描述 -->
<view class="info">
<view class="infos_title">
<text class="infos">医生消息</text>
<text class="time">{{ doctor.time }}</text>
</view>
<view class="preview" v-if="doctor.num>0">
您有{{ doctor.num }}条新的消息
</view>
<view class="preview" v-if="doctor.num==undefined">
暂无新消息
</view>
</view>
</view>
<!-- 在线问诊-->
<view class="list" @click="goChat">
<!-- 头像 -->
<view class="avator">
<view class="img">
<image src="/static/xx/ysxx.png" mode=""></image>
</view>
<u-badge size="default" v-if="doctor.num>=0" :count="doctor.num" :is-dot="doctor.num==0?true:false"
type="error" :offset="doctor.num>0?[-4,-8]:[0,0]"></u-badge>
</view>
<!-- 描述 -->
<view class="info">
<view class="infos_title">
<text class="infos">在线问诊</text>
<text class="time">{{ doctor.time }}</text>
</view>
<view class="preview" v-if="doctor.num>0">
您有{{ doctor.num }}条新的消息
</view>
<view class="preview" v-if="doctor.num==undefined">
暂无新消息
</view>
</view>
</view>
<!-- 模拟<u-divider>在线问诊</u-divider>效果-->
<!-- 标题 -->
<view class="title">
<text>在线问诊</text>
<!-- <view class="clear" @click="getClearInfo">-->
<!-- <text class="iconfont icon-qingchu"></text>-->
<!-- 清除未读-->
<!-- </view>-->
</view>
<!-- 在线问诊 - 用户-->
<view v-for="item in imChat" :key="item.id" class="list" @click="goChat(item)">
<!-- 头像 -->
<view class="avator">
<view class="img">
<image :src="item.avatar" mode=""></image>
</view>
<u-badge size="default" v-if="item.un_read_num>=0" :count="item.un_read_num"
:is-dot="item.un_read_num==0?true:false"
type="error" :offset="item.un_read_num>0?[-4,-8]:[0,0]"></u-badge>
</view>
<!-- 描述 -->
<view class="info">
<view class="infos_title">
<text class="infos">{{ item.nick_name }}</text>
<text class="time">{{ item.last_message_time }}</text>
</view>
<view class="preview">
<p>{{ item.last_message }}</p>
<!-- <p v-if="item.un_read_num>0">您有{{item.un_read_num}}条新的消息</p>-->
</view>
<view class="preview" v-if="item.last_message===''">
暂无新消息
</view>
</view>
</view>
</view>
</template>
<script>
import {
getseesionInfo,
getseesionRead
} from '../../request/api/api'
export default {
data() {
return {
order: [],
system: [],
doctor: [],
imChat: [
{
id: 'doctor-39',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '李二狗',
avatar: 'https://xiaokang88.oss-cn-hangzhou.aliyuncs.com/xk_upload_20250108/29bdb9560340373bb3096394a845afa5.jpg',
un_read_num: 99,
last_message: '多喝水即可',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-2',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王三三',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[图片]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-3',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王五五',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[图片]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-4',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[图片]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-5',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六1',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[音频]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-6',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六2',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[视频]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-7',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六3',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[文件]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-8',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[图片]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-9',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六1',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[音频]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-10',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六2',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[视频]',
last_message_time: '2021-07-05 09:05:05'
},
{
id: 'doctor-11',
room_id: 'xk_chat_room_68786b4fd071233eb15dfa3e62c1',
nick_name: '王六六3',
avatar: '/static/xx/ysxx.png',
un_read_num: 0,
last_message: '[文件]',
last_message_time: '2021-07-05 09:05:05'
},
],
type: ""
}
},
onLoad() {
},
methods: {
// 清除未读信息
getClearInfo() {
getseesionRead({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || 11001,
type: "all"
}
}).then((res) => {
// console.log(res, 'res');
uni.showToast({
title: '清除成功',
duration: 2000,
icon: "success"
});
this.getInfo()
})
},
// 系统信息
goSystem() {
uni.navigateTo({
url: '/pages/index/system'
})
getseesionRead({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || 11001,
type: "system"
}
}).then((res) => {
// console.log(res, 'res');
})
},
// 详情
goOrder() {
uni.navigateTo({
url: '/pages/index/order-info'
})
getseesionRead({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || 11001,
type: "order"
}
}).then((res) => {
// console.log(res, 'res');
})
},
goDoctor() {
uni.navigateTo({
url: '/pages/index/doctor-info'
})
getseesionRead({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || 11001,
type: "doctor_news"
}
}).then((res) => {
// console.log(res, 'res');
})
},
goChat(item) {
uni.navigateTo({
url: `/subPackages/chat/chat?room_id=${item.room_id}&nick_name=${item.nick_name}&user_id=${item.id}&avatar=${item.avatar}`
})
// getseesionRead({
// method: "post",
// data: {
// store_id: uni.getStorageSync('store_id') || 11001,
// type: "doctor_news"
// }
// }).then((res) => {
// // console.log(res, 'res');
// })
},
//
getInfo() {
getseesionInfo({
method: "get",
data: {
store_id: uni.getStorageSync('store_id') || 11001,
}
}).then((res) => {
// console.log(res, 'info');
this.order = res.data.data.order
this.system = res.data.data.system
this.doctor = res.data.data.doctor_news
})
}
},
mounted() {
this.getInfo()
},
onShow() {
this.order = []
this.system = []
this.doctor = []
this.getInfo()
}
}
</script>
<style lang="scss" scoped>
.content {
width: 750rpx;
max-height: 100%;
min-height: 100vh;
padding-bottom: env(safe-area-inset-bottom);
background: #F5F5F5;
.title {
padding: 32rpx;
display: flex;
align-items: center;
justify-content: space-between;
text {
height: 50rpx;
font-size: 36rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #0F172A;
}
.clear {
height: 40rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #536DFE;
line-height: 33rpx;
.iconfont {
color: #536DFE;
margin-right: 8rpx;
vertical-align: text-top;
}
}
}
.list {
width: 750rpx;
display: flex;
padding: 32rpx 38rpx;
justify-content: space-between;
background: #fff;
.avator {
position: relative;
.img {
width: 84rpx;
height: 84rpx;
line-height: 84rpx;
text-align: center;
border-radius: 50%;
background: #E6EAFF;
image {
width: 100%;
height: 100%;
}
}
}
.info {
width: 570rpx;
height: 94rpx;
font-family: PingFang SC-Medium, PingFang SC;
.infos_title {
width: 570rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 8rpx;
.doctor {
.name {
height: 42rpx;
font-size: 32rpx;
font-weight: 500;
color: #1E293B;
}
.infos {
height: 42rpx;
font-size: 28rpx;
font-weight: 500;
color: #475569;
}
}
.time {
font-size: 24rpx;
font-weight: 400;
color: #94A3B8;
}
}
.preview {
width: 570rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #475569;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
}
}
}
}
</style>