xinelu-applet-ui/pagesB/ProjectDetails/ProjectDetails.vue
2024-07-01 18:02:26 +08:00

251 lines
7.7 KiB
Vue

<template>
<view class="app">
<!-- 轮播图 -->
<swiper :indicator-dots="true" indicator-color='#fff' indicator-active-color='#0086d6' :autoplay="autoplay"
:interval="3000" :duration="1500" class="swiper-box" :circular='true' @change="swiperChange">
<swiper-item v-for="(item ,index) in lbinfo" :key="index">
<view class="swiper-item" v-show="!splits(item)" wx-if="{item}" @tap='goswiper(item)'>
<image v-if="item" :src="item" mode="widthFix"></image>
</view>
<view class="swiper-item" v-show="splits(item)" v-if="item">
<video :id="'myVideo'+index" :autoplay="false" :src="item" controls show-fullscreen-btn
object-fit="fill" @play="play" @pause="pause" @ended="ended" auto-pause-if-navigate
show-play-btn :enable-progress-gesture='true' :show-center-play-btn='true' enable-play-gesture
auto-pause-if-open-native show-mute-btn></video>
</view>
</swiper-item>
</swiper>
<!-- <u-swiper v-if="lbinfo" :list="lbinfo" height="350" style='background-size: 100%;' mode='none'></u-swiper> -->
<view class="item">
<view class="text" v-if='list.nurseItemName'>
{{list.nurseItemName||'暂无'}}
</view>
<!-- <view class="pingfen">
<u-rate :count="5" value="2"></u-rate>
</view> -->
</view>
<!-- <view class="Consumablespackage" v-if='list.itemConsumableList'>耗材包详情:
<span>¥{{list.consumableTotalPrice==null?'0':list.consumableTotalPrice}}</span>
<view class="detail" v-for='(item,index) in list.itemConsumableList' :key="index">
·{{item.consumableDetail}}
<span>{{item.consumableCount}}{{item.consumableUnit}}/{{item.consumablePrice}}</span>
</view>
</view> -->
<view class="detailtitle">
<view class="Introduction">服务详情:</view>
<!-- <u-parse :html="list.nurseItemContent"></u-parse> -->
<u-parse :html="list.nurseItemContent"></u-parse>
<!-- <view class="textInfo" v-if="list.nurseItemContent" v-html="list.nurseItemContent">
</view> -->
</view>
<view class="bottomcontent">
<view class="appoinprice" v-if="list.nurseItemPrice">
¥{{list.nurseItemPrice}}
</view>
<view class="appointment" @tap.stop='goappointments(item)'>立即预约</view>
</view>
<u-toast ref="uToast" />
<u-mask :show="usershow" class='mask'>
<view class="information">
<image :src="require('@/pagesC/images/information.png')" mode=""></image>
<view class="title">
请完善个人信息
</view>
<view class="cancel" @tap='usershow=false'>
取消
</view>
<view class="determine" @tap='goinformation'>
去完善
</view>
</view>
</u-mask>
</view>
</template>
<script>
import {
AppIdentification
} from '@/api/pagesB/AppIdentification/index.js'
import baseurl from '@/api/baseurl.js'
import {
getAppStationItemInfo
} from '@/api/pagesB/ProjectDetails/index.js'
export default {
data() {
return {
swiperImglink: [], //sweiper跳转link
lbinfo: [], //轮播
autoplay: true, //自动切换轮播图
videoContext: '',
baseurl: '',
orderNo: '',
usershow: false, //完善信息开关
list: {}, //护理站list
timer: null,
stationId: null,
stationItemId: null,
stationItemPriceId: null,
nurseStationId: null,
}
},
onLoad(options) {
this.stationId = options.stationId
this.stationItemId = options.stationItemId
this.stationItemPriceId = options.stationItemPriceId
this.nurseStationId = options.nurseStationId
},
onShow() {
this.baseurl = baseurl
this.usershow = false
// 耗材包详情方法调用
this.getlist(this.stationId, this.stationItemId, this.stationItemPriceId)
},
methods: {
//跳转swiper
goswiper(item) {
this.swiperImglink.forEach(e => {
e.image = baseurl + e.posterPictureUrl
if (e.image == item) {
if (e.jumpLink == '/pages/medicalservice/medicalservice' || e.jumpLink ==
'/pages/myinformation/myinformation') {
uni.switchTab({
url: e.jumpLink
})
} else {
uni.navigateTo({
url: e.jumpLink
})
}
}
})
},
swiperChange(e) {
let {
current,
source
} = e.detail
this.videoContext = uni.createVideoContext('myVideo' + (current - 1));
//只有手动切换时开始轮播,并且上一页视频暂停
if (source === 'touch') {
this.videoContext.pause(); //暂停
this.autoplay = true
}
},
// 获取数据
GetBanner() {},
// 处理banner返回的是是视频还是图片
splits(url) {
if (url.indexOf('.') != -1) {
var ext = url.substring(url.lastIndexOf('.') + 1);
return ['mp4', 'webm', 'mpeg4', 'ogg'].indexOf(ext) != -1
}
},
// 点击开始/继续播放
play() {
this.autoplay = false
// this.videoContext.requestFullScreen()
},
// 视频暂停
pause() {
this.autoplay = true
},
// 视频结束
ended() {
this.autoplay = true
},
//预约
goappointments() {
let that = this
const value = uni.getStorageSync('openid');
const value2 = uni.getStorageSync('userinfo');
if (value && value2) {
const patientid = value2.id
AppIdentification(patientid).then(res => {
if (res.code == 200) {
if (res.data.loginFlag) {
that.usershow = false
// const scenenurseStationId = uni.getStorageSync('scenenurseStationId');
// if (that.nurseStationId == scenenurseStationId) {
// uni.navigateTo({
// url: `/pagesB/hospitalcare/hospitalcare?stationId=${this.stationId}&stationItemId=${this.stationItemId}&stationItemPriceId=${this.stationItemPriceId}`,
// })
// } else {
uni.navigateTo({
url: `/pagesB/appointmenttime/appointmenttime?stationId=${this.stationId}&stationItemId=${this.stationItemId}&stationItemPriceId=${this.stationItemPriceId}`,
})
// }
} else {
that.usershow = true
}
} else if (res.code == 9999) {} else {
that.$refs.uToast.show({
title: res.msg,
type: 'error',
url: '/pagesB/login/login'
})
}
})
} else {
that.$refs.uToast.show({
title: '未登录,请先登录',
type: 'error',
url: '/pagesB/login/login'
})
}
},
//跳转完善页面
goinformation() {
this.usershow = false
uni.navigateTo({
url: '/pagesB/information/information'
})
},
// 信息
getlist(stationId, stationItemId, stationItemPriceId) {
this.lbinfo = []
getAppStationItemInfo(stationId, stationItemId, stationItemPriceId).then(res => {
if (res.data.nurseItemContent) {
res.data.nurseItemContent = res.data.nurseItemContent.replace(/\<img/gi,
"<br/> <img class='richPic'")
}
if (res.data.poserInfoList.length >= 1) {
this.swiperImglink = res.data.poserInfoList
res.data.poserInfoList.forEach(e => {
e.image = baseurl + e.posterPictureUrl
this.lbinfo.push(e.image)
})
if (res.data.poserInfoList[0].posterVideoUrl) {
res.data.poserInfoList[0].video = baseurl + res.data.poserInfoList[0].posterVideoUrl
this.lbinfo.push(res.data.poserInfoList[0].video)
}
} else {
this.lbinfo.push(this.baseurl + res.data.itemPictureUrl)
}
this.list = res.data
})
},
},
//1.分享给朋友
onShareAppMessage(res) {
let pages = getCurrentPages();
let url = pages[pages.length - 1].$page.fullPath
return {
title: '新医路健康服务平台',
path: url,
}
},
//2.分享到朋友圈
onShareTimeline(res) {
let pages = getCurrentPages();
let url = pages[pages.length - 1].$page.fullPath
return {
title: '新医路健康服务平台',
path: url,
}
},
}
</script>
<style lang="scss">
@import './ProjectDetails.scss';
</style>