Files
xk-client-wx/pages/home/index.vue
2026-01-12 12:36:50 +08:00

638 lines
14 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="content safe-area-inset-bottom">
<MessageNotification />
<view class="head" @click="gologin">
<!-- 门店 -->
<view class="store">
{{info.name || ''}}
<text class="iconfont icon-mendian"></text>
</view>
<!-- 定位 -->
<view class="area">
<view class="place">
<text class="iconfont icon-dizhi"></text>
{{info.position || ''}}
</view>
<!-- <view class="place">
<text class="iconfont icon-saoyisao" style="font-size: 30rpx;"></text>
扫一扫
</view> -->
</view>
</view>
<!-- 图片展示 -->
<view class="section" @click="gologin">
<u-swiper :list="list" :img-mode="aspectFill" :height="300" :interval="4000"></u-swiper>
<!-- <image class="banner" mode="aspectFill" src="/static/home/banner.png"></image> -->
</view>
<!-- 导航栏 -->
<view class="nav" v-if="isShow_envVersion==false">
<view class="nav_service" @click="gologin">
<view class="nav_service_img">
<image src="../../static/home/bg1.png" mode=""></image>
</view>
<view class="nav_service_title">
到店挂号
</view>
</view>
<view class="nav_service" @click="gologin">
<view class="nav_service_img">
<image src="../../static/home/bg2.png" mode=""></image>
</view>
<view class="nav_service_title">
预约购药
</view>
</view>
</view>
<view class="doctor_list" v-if="isShow_envVersion==false" @click="gologin">
医生列表
<view class="info">
更多 <text class="iconfont icon-jiantou1"></text>
</view>
</view>
<!-- <view class="doctor_list" v-if="isShow_envVersion" @click="gologin">-->
<!-- 商品列表-->
<!-- <view class="info">-->
<!-- 更多 <text class="iconfont icon-jiantou1"></text>-->
<!-- </view>-->
<!-- </view>-->
<!-- 医生列表 -->
<!-- <view class="list" @click="gologin" v-if="isShow_envVersion">-->
<!-- &lt;!&ndash; 图片部分 &ndash;&gt;-->
<!-- <view class="list_info">-->
<!-- <view class="list_left">-->
<!-- <image src="https://p3.maiyaole.com/img/971/971752/org_org.jpg?v=1" mode=""></image>-->
<!-- <view class="it">-->
<!-- <view class="it_name">日康对乙酰氨基酚片0.3g*12*2/</view>-->
<!-- <view class="it_info">清热解毒,咽喉肿痛,牙痛</view>-->
<!-- <view class="it_price">-->
<!-- <text>34.00</text>-->
<!-- <text class="num">x1</text>-->
<!-- </view>-->
<!-- </view>-->
<!-- </view>-->
<!-- </view>-->
<!-- </view>-->
<!-- <view class="list" @click="gologin" v-if="isShow_envVersion">
&lt;!&ndash; 图片部分 &ndash;&gt;
<view class="list_info">
<view class="list_left">
<image src="https://p2.maiyaole.com/img/item/202210/24/202210241042513.jpg" mode=""></image>
<view class="it">
<view class="it_name">同仁堂 六味地黄丸(浓缩丸) 200/</view>
<view class="it_info">滋阴补肾用于阴肾亏损头晕耳鸣腰膝酸软骨蒸潮热盗汗遗精</view>
<view class="it_price">
<text>22.00</text>
<text class="num">x1</text>
</view>
</view>
</view>
</view>
</view>-->
<view class="" v-if="isShow_envVersion==false">
<view class="lists" @click="gologin" v-for="(item,index) in doctorList" :key="item.id">
<!-- 图片部分 -->
<view class="list_infos">
<view class="list_lefts">
<image :src="item.avatar || '/static/mine/avatar_1.png'" mode="医生头像"></image>
<!-- 医生 -->
<view class="list_title">
<view class="titles_name">
<text class="doctor_name">{{item.name}}</text>
<text class="doctors">{{item.title}}</text>
</view>
<!-- 职称 -->
<view class="list_yard">
{{item.store}} &nbsp; {{item.depart}}
</view>
</view>
</view>
</view>
<!-- 文字部分 -->
<view class="cards">
<!-- 擅长 -->
<view class="list_going">
擅长{{item.good_at}}
</view>
<!-- 接诊率 -->
<view class="list_nums">
<view class="txt">问诊量 <text>{{item.inquiry_num }}</text></view>
<view class="txt">接诊率 <text>{{item.accept_percent}}</text></view>
<view class="txt">综合评分 <text>{{item.overall_score}}</text></view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {
doctorList,
getBanner,
getOpen
} from '../../request/api/api'
import { isGuestMode } from '@/common/utils/auth.js'
export default {
data() {
return {
show: true,
doctorList: [],
list: [
// '/static/home/banner.png',
// '/static/home/banner.png',
// '/static/home/banner.png'
],
info:[],
isShow_envVersion: true
}
},
onLoad() {
setInterval(() => {
this.isShow_envVersion = uni.getStorageSync('isShow_envVersion')
})
},
created() {
// 如果有token存着就跳转到home
if (uni.getStorageSync('token')) {
// 如果有token存着就跳转到home
uni.reLaunch({
url: "/pages/home/home",
success() {
uni.hideLoading();
}
})
}
},
methods: {
gologin() {
uni.removeStorageSync('token')
uni.removeStorageSync('userinfo')
uni.removeStorageSync('token_h5')
uni.removeStorageSync('user_id')
uni.navigateTo({
url: '/pages/login/login?type=' + 2
})
},
getShow() {
getOpen({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || '11001',
}
}).then((res) => {
// console.log(res, 'open');
this.show = res.data.data.open_issue
})
},
// 医生列表
getList() {
doctorList({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || '11001',
}
}).then((res) => {
// console.log(res, 'list');
// 使用 guest_mode 判断 + code/errcode 双重保险
const isGuest = isGuestMode();
const isNewFormat = isGuest && (res.data.code === 0 || res.data.code === '0');
const isOldFormat = !isGuest && (res.data.errcode === 0 || res.data.errcode === '0');
if (isNewFormat || isOldFormat) {
// 新接口格式:从 result 取值
// 老接口格式:从 data 取值
const responseData = isGuest && res.data.result ? res.data.result : res.data.data;
this.doctorList = (responseData.list || []).slice(0, 3)
}
})
this.getBannered()
},
// 门店详情--轮播图
getBannered() {
getBanner({
method: "post",
data: {
store_id: uni.getStorageSync('store_id') || '11001',
}
}).then((res) => {
if (res.data.errcode == 0) {
this.info = res.data.data
this.list = (res.data.data.nav).map((item) => {
return item.pic
})
}
})
},
},
mounted() {
this.getShow()
this.getList()
}
}
</script>
<style lang="scss" scoped>
.content {
background-color: #fff;
width: 750rpx;
max-height: 100%;
min-height: 100vh;
padding-bottom: env(safe-area-inset-bottom);
.lists {
width: 710rpx;
background: linear-gradient(180deg, #E2F1FF 0%, #FBFDFF 54%, #FFFFFF 100%);
border-radius: 16rpx;
padding: 12rpx 30rpx 22rpx;
margin: 32rpx auto 52rpx;
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08);
.list_infos {
display: flex;
justify-content: space-between;
.list_lefts {
height: 96rpx;
display: flex;
align-items: center;
justify-content: space-around;
image {
width: 96rpx;
height: 96rpx;
border-radius: 50%;
margin: 0 16rpx 0 0;
vertical-align: middle;
}
.list_title {
display: flex;
flex-direction: column;
.titles_name {
margin: 16rpx 0;
.doctor_name {
height: 40rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #232323;
line-height: 40rpx;
margin-right: 16rpx;
}
.doctors {
height: 40rpx;
font-size: 20rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #232323;
line-height: 40rpx;
}
}
.list_yard {
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
}
}
}
.list_rights {
width: 88rpx;
height: 50rpx;
line-height: 50rpx;
text-align: center;
background: #4175EE;
border-radius: 26rpx 26rpx 26rpx 26rpx;
font-size: 24rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
.cards {
.list_nums {
height: 34rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 500;
color: #666666;
margin: 18rpx 0 24rpx;
display: flex;
align-items: center;
.txt {
margin-right: 30rpx;
text {
font-size: 28rpx;
color: #FEA54C;
margin: 0 10rpx;
}
}
}
.list_going {
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #232323;
line-height: 44rpx;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
margin: 16rpx auto;
}
.list_prices {
display: flex;
align-items: center;
.picture {
width: 140rpx;
height: 60rpx;
line-height: 58rpx;
text-align: center;
border-radius: 4rpx 4rpx 4rpx 4rpx;
border: 2rpx solid #4175EE;
font-size: 24rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #4175EE;
margin: 0 30rpx 0 0;
}
}
}
}
.head {
width: 750rpx;
height: 390rpx;
padding: 20rpx;
background: linear-gradient(180deg, #298DFF 0%, #9ECBFF 70%, #FFFFFF 100%);
.search {
width: 710rpx;
margin: 20rpx auto 0;
}
.store {
width: 700rpx;
height: 78rpx;
line-height: 78rpx;
font-size: 28rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
margin: 0rpx auto 0rpx;
.iconfont {
font-size: 30rpx;
color: #fff;
margin-left: 12rpx;
}
}
.area {
width: 700rpx;
height: 64rpx;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0rpx auto;
.place {
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 500;
color: #FFFFFF;
.iconfont {
font-size: 25rpx;
color: #FFFFFF;
margin-right: 10rpx;
}
}
}
}
.section {
width: 710rpx;
margin: -170rpx auto 30rpx;
height: 300rpx;
.banner {
width: 100%;
height: 100%;
}
}
.nav {
width: 710rpx;
background: #FFFFFF;
border-radius: 8rpx;
display: flex;
align-items: center;
justify-content: space-between;
margin: 30rpx auto;
.nav_service {
width: 348rpx;
height: 178rpx;
display: flex;
align-items: center;
justify-content: space-around;
background: url('/static/home/bg01.png') no-repeat;
background-size: 100% 100%;
.nav_service_img {
width: 116rpx;
height: 116rpx;
vertical-align: middle;
image {
width: 100%;
height: 100%;
}
}
.nav_service_title {
font-size: 40rpx;
font-family: PingFang SC-Heavy, PingFang SC;
font-weight: 800;
color: #FFFFFF;
}
}
.nav_service:last-child {
background: url('/static/home/bg02.png') no-repeat;
background-size: 100% 100%;
}
}
.doctor_list {
width: 710rpx;
font-size: 36rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #232323;
margin: 44rpx auto 24rpx;
display: flex;
justify-content: space-between;
align-items: center;
.info {
font-size: 28rpx;
font-weight: 500;
color: #666666;
}
}
.list {
width: 710rpx;
background: linear-gradient(180deg, #E2F1FF 0%, #FBFDFF 54%, #FFFFFF 100%);
border-radius: 16rpx;
padding: 30rpx;
margin: 32rpx auto 52rpx;
box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.08);
.list_left {
display: flex;
justify-content: space-around;
margin-bottom: 22rpx;
image {
width: 200rpx;
height: 200rpx;
margin-right: 20rpx;
}
.it {
width: 450rpx;
font-family: PingFang SC-Regular, PingFang SC;
.it_name {
height: 80rpx;
font-size: 28rpx;
font-weight: bold;
color: #232323;
}
.it_info {
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
font-size: 24rpx;
font-weight: 400;
color: #999999;
margin: 12rpx 0 34rpx 0;
}
.it_price {
display: flex;
justify-content: space-between;
align-items: center;
text {
font-size: 28rpx;
font-weight: bold;
color: #232323;
}
.num {
font-size: 28rpx;
font-weight: 400;
color: #232323;
}
}
}
}
.card {
.list_nums {
height: 34rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 500;
color: #666666;
margin: 18rpx 0 24rpx;
display: flex;
align-items: center;
.txt {
margin-right: 30rpx;
text {
font-size: 28rpx;
color: #FEA54C;
margin: 0 10rpx;
}
}
}
.list_going {
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #232323;
line-height: 44rpx;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
text-overflow: ellipsis;
overflow: hidden;
margin: 16rpx auto;
}
.list_price {
display: flex;
align-items: center;
.picture {
width: 140rpx;
height: 60rpx;
line-height: 58rpx;
text-align: center;
border-radius: 4rpx 4rpx 4rpx 4rpx;
border: 2rpx solid #4175EE;
font-size: 24rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #4175EE;
margin: 0 30rpx 0 0;
}
}
}
}
}
</style>