Merge branch 'main' of http://47.115.223.229:8888/yangjun/hldy_app_mini
This commit is contained in:
commit
061528a711
|
|
@ -7,10 +7,14 @@
|
|||
{{ Math.floor(bottomTime / 60) }}
|
||||
</view>
|
||||
<view class="flip_back child text" :style="backZindex&&transformInfomin ? { zIndex: backZindex } : {}" id="flip_back" >
|
||||
{{ Math.floor(topTime / 60) }}
|
||||
{{ Math.floor(topTime / 60) }}
|
||||
<text>MIN</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom child text" id="bottom" >
|
||||
{{ Math.floor(bottomTime / 60) }}
|
||||
<text>MIN</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom child text" id="bottom" >{{ Math.floor(bottomTime / 60) }}</view>
|
||||
</view>
|
||||
:
|
||||
<view class="box" id="box_minute" :class="!isDown?'red':''">
|
||||
|
|
@ -21,9 +25,13 @@
|
|||
</view>
|
||||
<view class="flip_back child text" :style="backZindex ? { zIndex: backZindex } : {}" id="flip_back" >
|
||||
{{ (topTime % 60)<10?'0'+(topTime % 60) : (topTime % 60) }}
|
||||
<text >SEC</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom child text" id="bottom">{{ (bottomTime % 60)<10? '0'+(bottomTime % 60) : (bottomTime % 60) }}</view>
|
||||
<view class="bottom child text" id="bottom">
|
||||
{{ (bottomTime % 60)<10? '0'+(bottomTime % 60) : (bottomTime % 60) }}
|
||||
<text >SEC</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -36,21 +44,21 @@ export default {
|
|||
type: Number,
|
||||
default:185,
|
||||
},
|
||||
// isDown: {
|
||||
// // 是否是倒计时
|
||||
// type: Boolean,
|
||||
// default: true,
|
||||
// },
|
||||
threshold: {
|
||||
// 阈值
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
timeoutDuration:{
|
||||
// 超时时间多少停止
|
||||
type: Number,
|
||||
default: 0,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
topTime: this.initTime,
|
||||
bottomTime: this.initTime,
|
||||
topTime: Math.abs(this.initTime),
|
||||
bottomTime: Math.abs(this.initTime),
|
||||
faceZindex: 1,
|
||||
backZindex: 0,
|
||||
transformInfo: "perspective(500rpx) rotateX(0deg)",
|
||||
|
|
@ -85,12 +93,11 @@ export default {
|
|||
clearInterval(this.timer);
|
||||
return;
|
||||
}
|
||||
|
||||
if (num === 1) {
|
||||
if (this.isDown) {
|
||||
this.topTime = n - 1 < this.threshold ? n : n - 1; // 60 和 0 在时间里,其实是一样的
|
||||
this.mintime = Math.floor(this.topTime / 60)
|
||||
if(minutes != this.mintime ){
|
||||
if(minutes != this.mintime &&!this.transformInfomin){
|
||||
this.transformInfomin = true;
|
||||
}else{
|
||||
this.transformInfomin = false;
|
||||
|
|
@ -98,7 +105,7 @@ export default {
|
|||
} else {
|
||||
this.topTime = n + 1 > this.threshold ? n : n + 1;
|
||||
this.mintime = Math.floor(this.topTime / 60)
|
||||
if(minutes != this.mintime ){
|
||||
if(minutes != this.mintime &&!this.transformInfomin){
|
||||
this.transformInfomin = true;
|
||||
}else{
|
||||
this.transformInfomin = false;
|
||||
|
|
@ -106,16 +113,17 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
this.faceZindex = num <= 10 ? 1 : 0;
|
||||
this.backZindex = num <= 10 ? 0 : 1;
|
||||
this.faceZindex = num <= 25? 1 : 0;
|
||||
this.backZindex = num <= 25? 0 : 1;
|
||||
|
||||
this.transformInfo = `perspective(500rpx) rotateX(-${(180 * num) / 50}deg)`;
|
||||
|
||||
},5); // 将一秒钟分成50份。
|
||||
},10); // 将一秒钟分成50份。
|
||||
},
|
||||
cycle() {
|
||||
let minutes = Math.floor(this.initTime / 60);
|
||||
let time = this.initTime;
|
||||
this.isDown = this.initTime>0?true:false
|
||||
let time = Math.abs(this.initTime);
|
||||
// console.log(minutes,time)
|
||||
this.timerTwo = setInterval(() => {
|
||||
const flag = this.isDown ? time - 1 : time + 1;
|
||||
|
|
@ -124,6 +132,11 @@ export default {
|
|||
// clearInterval(this.timerTwo);
|
||||
// clearInterval(this.timer);
|
||||
}
|
||||
if(flag == this.timeoutDuration){
|
||||
clearInterval(this.timerTwo);
|
||||
clearInterval(this.timer);
|
||||
this.$emit('timeend')
|
||||
}
|
||||
this.OneCycle(time);
|
||||
this.isDown ? time-- : time++;
|
||||
}, 1000);
|
||||
|
|
@ -145,14 +158,14 @@ export default {
|
|||
}
|
||||
|
||||
.box .child {
|
||||
width: 3.4vw;
|
||||
height: 1.6vw;
|
||||
min-width: 3.4vw;
|
||||
height: 2vw;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.box > .top {
|
||||
background-color: #DCDCDC;
|
||||
line-height: 3.2vw;
|
||||
line-height: 4vw;
|
||||
border-bottom: 2rpx solid #fff;
|
||||
border-radius: 4rpx 4rpx 0 0;
|
||||
}
|
||||
|
|
@ -168,7 +181,7 @@ export default {
|
|||
.box .flip .flip_face {
|
||||
position: absolute;
|
||||
background-color: #DCDCDC;
|
||||
line-height: 3.2vw;
|
||||
line-height: 4vw;
|
||||
z-index: 1;
|
||||
border-bottom: 2rpx solid #fff;
|
||||
}
|
||||
|
|
@ -193,5 +206,15 @@ export default {
|
|||
font-size: 2.2vw;
|
||||
font-weight: 900;
|
||||
color: #666;
|
||||
position: relative;
|
||||
>text{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
bottom: 0vw;
|
||||
line-height:1vw;
|
||||
left: 0;
|
||||
font-size: 0.3vw;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,149 +1,212 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="fixed-card" :style="openleft?{}:{right:`-34vw`}" >
|
||||
<view class="fixed-card-left">
|
||||
<image class="card-left-img"
|
||||
:src="qcobj?.previewFile? serverUrl + qcobj?.previewFile: `/static/index/newindex/wendu/2.png`" mode="aspectFill"/>
|
||||
<view class="">
|
||||
{{qcobj.directiveName}}
|
||||
</view>
|
||||
<view v-if="flag">
|
||||
<view class="fixed-card" :style="openleft?{}:{right:`-34vw`}">
|
||||
<view class="btn les" @click="swip(-1)" v-if="plsbuy.length>1" >
|
||||
<image class="pao-img" :src="`/static/index/newindex/states/ris.png`"
|
||||
style="transform: rotate(180deg);" />
|
||||
</view>
|
||||
<view style="height: 78%;">
|
||||
<view class="big-time">
|
||||
<view>
|
||||
{{qcobj.startTime?.slice(11, 16) }}
|
||||
<!-- - {{qcobj.endTime?.slice(11, 16) }} -->
|
||||
</view>
|
||||
<view>
|
||||
<timeing></timeing>
|
||||
</view>
|
||||
</view>
|
||||
<view class="names">
|
||||
{{ qcobj?.directiveName }}
|
||||
</view>
|
||||
<view class="icon-people">
|
||||
<image class="people-img" src="/static/index/newindex/leftmenu/iconleft.png" />
|
||||
<text v-if="qcobj.optType == 1" style="white-space: nowrap;">单人执行</text>
|
||||
<text v-if="qcobj.optType == 2" style="white-space: nowrap;">协助执行</text>
|
||||
|
||||
<image style="margin-left: 1vw;" class="people-img"
|
||||
src="/static/index/newindex/leftmenu/iconright.png" />
|
||||
|
||||
<text v-if="qcobj.optType == 1">{{qcobj.employeeName}}</text>
|
||||
<text v-if="qcobj.optType == 2">{{qcobj.optNames}}</text>
|
||||
</view>
|
||||
<view class="icon-button">
|
||||
<view class="" :class="qcobj.izStart=='N'?'button-right':'button-left'" @click="start()">
|
||||
开始服务
|
||||
</view>
|
||||
<view :class="(qcobj.izFinish=='N'&&qcobj.izStart=='Y')?'button-right':'button-left'" @click="end()">
|
||||
结束服务
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn ris" @click="swip(1)"v-if="plsbuy.length>1" >
|
||||
<image class="pao-img" :src="`/static/index/newindex/states/ris.png`" />
|
||||
</view>
|
||||
<view class="bots" v-if="plsbuy.length>1" >
|
||||
<view v-for="(v,i) in plsbuy" :key='i' :class="current==i?'dot':''"></view>
|
||||
</view>
|
||||
<swiper class="swiper" :circular="true" :indicator-dots="false" easing-function="easeInOutCubic"
|
||||
:autoplay="false" :interval="3000" :duration="500" :current="current" @change="change">
|
||||
<swiper-item v-for="(qcobj,i) in plsbuy" :key="i" class="swper">
|
||||
<view class="fixed-card-left">
|
||||
<image class="card-left-img" v-if="qcobj.izPackage=='Y' "src="/static/zlb.png" mode="aspectFill" />
|
||||
<image class="card-left-img" v-if="qcobj.izPackage=='N'" :src="qcobj?.previewFile? serverUrl + qcobj?.previewFile: `/static/index/newindex/wendu/2.png`"
|
||||
mode="aspectFill" />
|
||||
<view >
|
||||
{{qcobj.directiveName}}
|
||||
</view>
|
||||
</view>
|
||||
<view style="height: 78%;">
|
||||
<view class="big-time">
|
||||
<view>
|
||||
{{qcobj.startTime?.slice(11, 16) }}
|
||||
<!-- - {{qcobj.endTime?.slice(11, 16) }} -->
|
||||
</view>
|
||||
<view>
|
||||
<timeing v-if="current==i&&qcobj?.izStart=='Y'" :initTime="djstinme" :timeoutDuration="Number(qcobj.timeoutDuration)" @timeend="timeend"></timeing>
|
||||
</view>
|
||||
</view>
|
||||
<view class="names">
|
||||
{{ qcobj?.directiveName }}
|
||||
</view>
|
||||
<view class="icon-people">
|
||||
<image class="people-img" src="/static/index/newindex/leftmenu/iconleft.png" />
|
||||
<text v-if="qcobj.optType == 1" style="white-space: nowrap;">单人执行</text>
|
||||
<text v-if="qcobj.optType == 2" style="white-space: nowrap;">协助执行</text>
|
||||
|
||||
<image style="margin-left: 1vw;" class="people-img"
|
||||
src="/static/index/newindex/leftmenu/iconright.png" />
|
||||
|
||||
<text v-if="qcobj.optType == 1">{{qcobj.employeeName}}</text>
|
||||
<text v-if="qcobj.optType == 2">{{qcobj.optNames}}</text>
|
||||
</view>
|
||||
<view class="icon-button">
|
||||
<view class="" :class="qcobj.izStart=='N'?'button-right':'button-left'" @click="start()">
|
||||
开始服务
|
||||
</view>
|
||||
<view :class="(qcobj.izFinish=='N'&&qcobj.izStart=='Y')?'button-right':'button-left'"
|
||||
@click="end()">
|
||||
结束服务
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="left-open" @click="openleft = !openleft">
|
||||
<image :style="openleft?{}:{transform: `rotate(180deg)`}" class="open-img"
|
||||
src="/static/index/newindex/leftmenu/openleft.png" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<tanchuang :show="open>0" font="是否结束服务指令?" @back="open = 0" @right="ends()"> </tanchuang>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent,watch } from 'vue';
|
||||
import { queryOrderlist,startDirectiveServe,finishDirectiveServe,queryOrderInfoList } from '@/pages/procurement/api/lunpan.js'
|
||||
import { startOrder,endOrder,editSubPicPath,editSubMp4,queryEmpList,transferOrder,assistOrder} from '@/pages/NursingNew/component/doctorask/api/api.js'
|
||||
import timeing from './newgame/sxy-Timeing.vue'
|
||||
const qcobj = ref({})
|
||||
const openleft = ref(true)
|
||||
const open = ref(0);
|
||||
const zdcont = ref('');
|
||||
const serverUrl = ref(uni.getStorageSync('imagebase'))
|
||||
const emit = defineEmits([ 'start' ,'end'])
|
||||
const form = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
employeeId:uni.getStorageSync('userInfo').employessId,
|
||||
nuId:uni.getStorageSync('nuId'),
|
||||
workType:2
|
||||
})
|
||||
onMounted(()=>{
|
||||
firstgetqueryCgdList()
|
||||
})
|
||||
const firstgetqueryCgdList = () => {
|
||||
queryOrderlist(form).then(res => {
|
||||
if(res.result.records.length>0){
|
||||
qcobj.value = res.result.records[0];
|
||||
openleft.value = qcobj.value.izStart=='Y'?true:false;
|
||||
// clickLeftMenu(0,res.result.records[0])
|
||||
}else{
|
||||
qcobj.value = {};
|
||||
}
|
||||
})
|
||||
}
|
||||
const clickLeftMenu = (index : any, item : object) => {
|
||||
queryOrderInfoList({ mainId: item.id }).then(res => {
|
||||
if(res.result.length>0){
|
||||
qcobj.value = res.result[0];
|
||||
openleft.value = qcobj.value.izStart=='Y'?true:false;
|
||||
}else{
|
||||
qcobj.value = {};
|
||||
}
|
||||
})
|
||||
}
|
||||
const start = () => {
|
||||
if(qcobj.value.izStart!='N'){return}
|
||||
startOrder({ id: qcobj.value.id }).then(res => {
|
||||
if (res.success) {
|
||||
qcobj.value.izStart = 'Y';
|
||||
clickLeftMenu(0,{id:qcobj.value.mainId})
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res.message
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
// const end = () => {
|
||||
// if(qcobj.value.izFinish!='N'&&qcobj.value.izStart!='Y'){return}
|
||||
// finishDirectiveServe({ id: qcobj.value.id }).then(res => {
|
||||
// if (res.success) {
|
||||
// qcobj.value.izFinish = 'Y';
|
||||
// firstgetqueryCgdList()
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// icon: 'none',
|
||||
// title: res.message
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
const end = ()=>{
|
||||
if(qcobj.value.izStart=='Y'&& qcobj.value.izFinish=='N'){
|
||||
open.value=3;
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, watch } from 'vue';
|
||||
import { queryOrderlist, startDirectiveServe, finishDirectiveServe, queryOrderInfoList } from '@/pages/procurement/api/lunpan.js'
|
||||
import { startOrder, endOrder, editSubPicPath, editSubMp4, queryEmpList, transferOrder, assistOrder } from '@/pages/NursingNew/component/doctorask/api/api.js'
|
||||
import timeing from './newgame/sxy-Timeing.vue'
|
||||
const flag = ref(false)
|
||||
const qcobj = ref({})
|
||||
const openleft = ref(true)
|
||||
const open = ref(0);
|
||||
const zdcont = ref('');
|
||||
const serverUrl = ref(uni.getStorageSync('imagebase'))
|
||||
const emit = defineEmits(['start', 'end'])
|
||||
const form = reactive({
|
||||
pageNo: 1,
|
||||
pageSize: 10,
|
||||
employeeId: uni.getStorageSync('userInfo').employessId,
|
||||
nuId: uni.getStorageSync('nuId'),
|
||||
workType: 2
|
||||
})
|
||||
onMounted(() => {
|
||||
firstgetqueryCgdList()
|
||||
})
|
||||
const swip = (e) => {
|
||||
if (current.value == 0 && e == -1) {
|
||||
current.value = 4
|
||||
return
|
||||
}
|
||||
if (current.value == 4 && e == 1) {
|
||||
current.value = 0
|
||||
return
|
||||
}
|
||||
current.value += e;
|
||||
}
|
||||
const ends = ()=>{
|
||||
endOrder({id:qcobj.value.id}).then(res=>{
|
||||
if(res.success){
|
||||
open.value=0;
|
||||
firstgetqueryCgdList()
|
||||
}else{
|
||||
|
||||
const current = ref(0)
|
||||
const change = (e) => {
|
||||
current.value = e.detail.current;
|
||||
plsbuy.value.forEach((v, i) => {
|
||||
if (i != current.value && v.izPackage == 'Y') {
|
||||
v.flag = false
|
||||
}
|
||||
})
|
||||
|
||||
if (plsbuy.value[current.value].izStart == 'Y' && plsbuy.value[current.value].izFinish == 'N') {
|
||||
timeacde()
|
||||
}
|
||||
}
|
||||
const timeend = () =>{
|
||||
// 结束超时
|
||||
firstgetqueryCgdList()
|
||||
}
|
||||
const djstinme = ref(0)
|
||||
const timeacde = () => {
|
||||
let obj = plsbuy.value[current.value];
|
||||
let timestampMs = new Date(obj.endTime).getTime();
|
||||
let times = new Date().getTime();
|
||||
let djs = timestampMs - times;
|
||||
// let timeendamp = timestampMs + (Number(plsbuy.value[current.value].timeoutDuration)*60);
|
||||
console.log(timestampMs, '结束时间戳')
|
||||
console.log(times, '当前时间戳')
|
||||
console.log(Math.round(djs / 1000), '倒计时时间戳')
|
||||
djstinme.value = Math.round(djs / 1000)
|
||||
}
|
||||
const plsbuy = ref([])
|
||||
const firstgetqueryCgdList = () => {
|
||||
queryOrderlist(form).then(res => {
|
||||
plsbuy.value = res.result.records
|
||||
plsbuy.value.forEach((item, i) => {
|
||||
console.log(item)
|
||||
if (item.izStart == 'Y'&&flag.value == false) {
|
||||
openleft.value = true;
|
||||
flag.value = true;
|
||||
current.value = i;
|
||||
change({detail:{current:current.value}})
|
||||
}
|
||||
})
|
||||
// clickLeftMenu(0,res.result.records[0])
|
||||
})
|
||||
}
|
||||
const clickLeftMenu = (index : any, item : object) => {
|
||||
queryOrderInfoList({ mainId: item.id }).then(res => {
|
||||
if (res.result.length > 0) {
|
||||
qcobj.value = res.result[0];
|
||||
openleft.value = qcobj.value.izStart == 'Y' ? true : false;
|
||||
} else {
|
||||
qcobj.value = {};
|
||||
}
|
||||
})
|
||||
}
|
||||
const start = () => {
|
||||
if (qcobj.value.izStart != 'N') { return }
|
||||
startOrder({ id: qcobj.value.id }).then(res => {
|
||||
if (res.success) {
|
||||
qcobj.value.izStart = 'Y';
|
||||
clickLeftMenu(0, { id: qcobj.value.mainId })
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res.message
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
// const end = () => {
|
||||
// if(qcobj.value.izFinish!='N'&&qcobj.value.izStart!='Y'){return}
|
||||
// finishDirectiveServe({ id: qcobj.value.id }).then(res => {
|
||||
// if (res.success) {
|
||||
// qcobj.value.izFinish = 'Y';
|
||||
// firstgetqueryCgdList()
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// icon: 'none',
|
||||
// title: res.message
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
const end = () => {
|
||||
if (qcobj.value.izStart == 'Y' && qcobj.value.izFinish == 'N') {
|
||||
open.value = 3;
|
||||
}
|
||||
}
|
||||
const ends = () => {
|
||||
endOrder({ id: qcobj.value.id }).then(res => {
|
||||
if (res.success) {
|
||||
open.value = 0;
|
||||
firstgetqueryCgdList()
|
||||
} else {
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
defineExpose({
|
||||
firstgetqueryCgdList
|
||||
firstgetqueryCgdList
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.left-open {
|
||||
.left-open {
|
||||
position: absolute;
|
||||
left: -1.5vw;
|
||||
top: 50%;
|
||||
|
|
@ -158,58 +221,120 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
transition: all 0.5s ease;
|
||||
|
||||
|
||||
.open-img {
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-card {
|
||||
position: fixed;
|
||||
right: 1vw;
|
||||
top: 2vh;
|
||||
width: 35vw;
|
||||
height: 28vh;
|
||||
height: 17.5vw;
|
||||
background-color: rgba(239, 246, 255, 0.95);
|
||||
border-radius: 1.5vw;
|
||||
border: 1rpx solid #638DFF;
|
||||
box-shadow: 0 2rpx 6rpx #A0B9FF;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: all 0.5s ease;
|
||||
z-index: 999;
|
||||
|
||||
.bots {
|
||||
width: 60%;
|
||||
position: absolute;
|
||||
height: 30rpx;
|
||||
bottom: 2.2vw;
|
||||
left: 20%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
view {
|
||||
width: 1.3vw;
|
||||
height: 0.6vw;
|
||||
background: #DCDCDC;
|
||||
border-radius: 0.2vw;
|
||||
margin: 0.7vw;
|
||||
}
|
||||
|
||||
.dot {
|
||||
background: #0193F4;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 2.4vw;
|
||||
height: 2.4vw;
|
||||
background: #F8F8F8;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top:6.4vw;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 99;
|
||||
|
||||
image {
|
||||
width: 60%;
|
||||
height: 60%;
|
||||
}
|
||||
}
|
||||
|
||||
.les {
|
||||
left: 0.5vw;
|
||||
}
|
||||
|
||||
.ris {
|
||||
right: 0.5vw;
|
||||
}
|
||||
.swiper{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.swper{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.fixed-card-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin: 0 2vw;
|
||||
|
||||
.card-left-img {
|
||||
width: 12vw;
|
||||
height: 8vw;
|
||||
width: 9vw;
|
||||
height: 8.7vw;
|
||||
margin-bottom: 0.5vw;
|
||||
}
|
||||
}
|
||||
.names{
|
||||
|
||||
.names {
|
||||
font-weight: 400;
|
||||
font-size: 1.5vw;
|
||||
color: #333333;
|
||||
margin-top: 1.4vw;
|
||||
padding-left: 1vw;
|
||||
}
|
||||
|
||||
.big-time {
|
||||
font-weight: 600;
|
||||
font-size: 2.3vw;
|
||||
font-weight: 800;
|
||||
font-size: 2.6vw;
|
||||
padding-left: 1vw;
|
||||
width: 18vw;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
>view{
|
||||
|
||||
>view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.icon-people {
|
||||
display: flex;
|
||||
margin: 0.3vw 0;
|
||||
|
|
@ -217,6 +342,7 @@
|
|||
width: 18vw;
|
||||
padding-left: 1vw;
|
||||
white-space: nowrap;
|
||||
|
||||
.people-img {
|
||||
width: 1.5vw;
|
||||
height: 1.5vw;
|
||||
|
|
@ -224,14 +350,14 @@
|
|||
margin-top: 0.1vw;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.icon-button {
|
||||
display: flex;
|
||||
margin-top: 1vw;
|
||||
font-size: 1.5vw;
|
||||
width: 18vw;
|
||||
justify-content: space-around;
|
||||
|
||||
|
||||
.button-left {
|
||||
width: 8vw;
|
||||
height: 3.3vw;
|
||||
|
|
@ -242,21 +368,19 @@
|
|||
border-radius: 1.2vw;
|
||||
border: 1rpx solid #C7D2E4;
|
||||
color: #333333;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
.button-right {
|
||||
width: 8vw;
|
||||
height: 3.3vw;
|
||||
background-color: #fff;
|
||||
background: linear-gradient(to bottom, #009DEF, #0076FF);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 1.2vw;
|
||||
border: 1rpx solid #5AAEFF;
|
||||
color: #249BFA;
|
||||
background: linear-gradient(to bottom, #fff, #D1EAFF);
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
@ -17,17 +17,19 @@
|
|||
<view class="photo-father">
|
||||
<!-- {filter: `grayscale(60%)`} -->
|
||||
<view class="juzhong" :style="indexmessage?.startTime?{}:''">
|
||||
<donghua :width="`1300rpx`" :height="`900rpx`" :links="blueArray" :playing="photoplay"
|
||||
<donghua :width="`1000rpx`" :height="`700rpx`" :links="blueArray" :playing="current==i"
|
||||
:loop="true" :interval="120" />
|
||||
</view>
|
||||
<view class="timedjs">
|
||||
<text>服务倒计时</text>
|
||||
<timeing></timeing>
|
||||
<timeing v-if="current==i&&indexmessage?.izStart=='Y'" :initTime="djstinme" :timeoutDuration="Number(indexmessage.timeoutDuration)" @timeend="timeend"></timeing>
|
||||
</view>
|
||||
<view class="weight-time">
|
||||
<view>
|
||||
{{ indexmessage?.startTime.slice(11, 16) }}
|
||||
<text style="font-size: 1.5vw;font-weight: 400;">| 30分钟</text>
|
||||
<text style="font-size: 1.8vw;font-weight: 500;" v-if="indexmessage?.serviceDuration">
|
||||
| {{indexmessage?.serviceDuration}}分钟
|
||||
</text>
|
||||
</view>
|
||||
<view style="height: 4vw;"> </view>
|
||||
<view class="pao-father">
|
||||
|
|
@ -98,28 +100,28 @@
|
|||
<view class="left-menu">
|
||||
<view @click="errmsgclk(0,1,indexmessage)">
|
||||
<view class="left-ball"
|
||||
:style="indexmessage?.serviceContent!=''?' ':'opacity: 0.5'">
|
||||
:style="indexmessage?.serviceContent!=''?' ':'opacity: 0.4'">
|
||||
<image class="left-menu-img"
|
||||
:src="'/static/index/newindex/leftmenu/left'+0+'.png'" />
|
||||
</view>
|
||||
</view>
|
||||
<view @click="errmsgclk(1,1,indexmessage)">
|
||||
<view class="left-ball"
|
||||
:style="indexmessage?.mp3File!=''?' ':'opacity: 0.5'">
|
||||
:style="indexmessage?.mp3File!=''?' ':'opacity: 0.4'">
|
||||
<image class="left-menu-img"
|
||||
:src="'/static/index/newindex/leftmenu/left'+1+'.png'" />
|
||||
</view>
|
||||
</view>
|
||||
<view @click="errmsgclk(2,1,indexmessage)" >
|
||||
<view class="left-ball"
|
||||
:style="indexmessage?.mp4File!=''?' ':'opacity: 0.5'">
|
||||
:style="indexmessage?.mp4File!=''?' ':'opacity: 0.4'">
|
||||
<image class="left-menu-img"
|
||||
:src="'/static/index/newindex/leftmenu/left'+2+'.png'" />
|
||||
</view>
|
||||
</view>
|
||||
<view v-for="(item,index) in [3,4]" :key="index" @click="errmsgclk(item,2,indexmessage)">
|
||||
<view class="left-ball"
|
||||
:style="indexmessage?.izStart=='Y'?' ':'opacity: 0.5'">
|
||||
:style="indexmessage?.izStart=='Y'?' ':'opacity: 0.4'">
|
||||
<image class="left-menu-img"
|
||||
:src="'/static/index/newindex/leftmenu/left'+item+'.png'" />
|
||||
</view>
|
||||
|
|
@ -128,11 +130,10 @@
|
|||
<view class="right-menu">
|
||||
<view class="zhezhao-top"></view>
|
||||
<view class="zhezhao-bottom"></view>
|
||||
<image class="top-img" :src="`/static/index/newindex/rightmenu/top.png`" />
|
||||
<!-- <image class="top-img" :src="`/static/index/newindex/rightmenu/top.png`" /> -->
|
||||
<view class="right-scroll">
|
||||
<view style="margin:1.5vw 0;width: 4vw;margin-left: 20rpx;" @click="zhixing(1,indexmessage)">
|
||||
<view class="white-circle"
|
||||
:style="indexmessage?.izStart=='Y'?'opacity: 0.7' : ''">
|
||||
<view class="white-circle" :style="indexmessage?.izStart=='Y'?'opacity: 0.4' : ''">
|
||||
<image class="right-menu-img" :src="'/static/index/newindex/rightmenu/1.png'" />
|
||||
<view class="right-menu-name">
|
||||
转单执行
|
||||
|
|
@ -148,7 +149,7 @@
|
|||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<image class="top-img" :src="`/static/index/newindex/rightmenu/bottom.png`" />
|
||||
<!-- <image class="top-img" :src="`/static/index/newindex/rightmenu/bottom.png`" /> -->
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
|
@ -264,7 +265,7 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
import { onBackPress, onShow, onHide } from "@dcloudio/uni-app"
|
||||
import timeing from '@/component/public/newgame/sxy-Timeing.vue'
|
||||
import timeing from './sxy-Timeing.vue'
|
||||
import { queryOrderList, queryOrderInfoList, startOrder, endOrder, editSubPicPath, editSubMp4, queryEmpList, transferOrder, assistOrder, generateInstant } from '../../component/doctorask/api/api.js'
|
||||
const open = ref(0)
|
||||
const donghuaopo = ref(false);
|
||||
|
|
@ -284,12 +285,31 @@
|
|||
init
|
||||
})
|
||||
const change = (e) => {
|
||||
current.value = e.detail.current
|
||||
current.value = e.detail.current;
|
||||
plsbuy.value.forEach((v,i)=>{
|
||||
if(i!=current.value&&v.izPackage=='Y'){
|
||||
v.flag = false
|
||||
}
|
||||
})
|
||||
if(plsbuy.value[current.value].izStart=='Y'&&plsbuy.value[current.value].izFinish=='N'){
|
||||
timeacde()
|
||||
}
|
||||
}
|
||||
const djstinme = ref(0)
|
||||
const timeacde = ()=>{
|
||||
let obj = plsbuy.value[current.value];
|
||||
let timestampMs = new Date(obj.endTime).getTime();
|
||||
let times = new Date().getTime();
|
||||
let djs = timestampMs - times;
|
||||
// let timeendamp = timestampMs + (Number(plsbuy.value[current.value].timeoutDuration)*60);
|
||||
console.log(timestampMs,'结束时间戳')
|
||||
console.log(times,'当前时间戳')
|
||||
console.log(Math.round(djs/1000),'倒计时时间戳')
|
||||
djstinme.value = Math.round(djs/1000)
|
||||
}
|
||||
const timeend = () =>{
|
||||
// 结束超时
|
||||
firstgetqueryCgdList(form.nuId)
|
||||
}
|
||||
const swip = (e) => {
|
||||
if (current.value == 0 && e == -1) {
|
||||
|
|
@ -431,11 +451,13 @@
|
|||
const firstgetqueryCgdList = (nuId) => {
|
||||
form.nuId = nuId;
|
||||
queryOrderList(form).then(res => {
|
||||
console.log(res.result.records)
|
||||
if (res.result.records.length > 0) {
|
||||
res.result.records.forEach(item=>{
|
||||
item.flag = false
|
||||
})
|
||||
plsbuy.value = res.result.records
|
||||
plsbuy.value = res.result.records;
|
||||
change({detail:{current:current.value}})
|
||||
// indexmessage.value = res.result.records[0]
|
||||
// clickLeftMenu(0,res.result.records[0])
|
||||
} else {
|
||||
|
|
@ -794,7 +816,7 @@
|
|||
.btn {
|
||||
width: 2.4vw;
|
||||
height: 2.4vw;
|
||||
background: #E9EAED;
|
||||
background: #F8F8F8;
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
top: 36vh;
|
||||
|
|
@ -876,7 +898,7 @@
|
|||
.timedjs {
|
||||
position: absolute;
|
||||
width: 7vw;
|
||||
right: 4vw;
|
||||
right: 5.2vw;
|
||||
top: 0vw;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
|
@ -892,9 +914,9 @@
|
|||
|
||||
.juzhong {
|
||||
position: absolute;
|
||||
top: 0%;
|
||||
top: 15%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -20%);
|
||||
transform: translate(-50%, -25%);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
|
|
@ -902,7 +924,7 @@
|
|||
width: 40vw;
|
||||
height: 30vh;
|
||||
position: relative;
|
||||
top: -5vh;
|
||||
top: -3vh;
|
||||
z-index: 55;
|
||||
left: 2vw;
|
||||
|
||||
|
|
@ -1053,8 +1075,8 @@
|
|||
|
||||
.pao-father {
|
||||
position: absolute;
|
||||
top: -20rpx;
|
||||
right: -110rpx;
|
||||
top: -12rpx;
|
||||
right: -99rpx;
|
||||
font-size: 22rpx;
|
||||
width: 100rpx;
|
||||
height: 50rpx;
|
||||
|
|
@ -1072,14 +1094,13 @@
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
.left-menu {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left:6vw;
|
||||
top: 37%;
|
||||
left:5.3vw;
|
||||
transform: translateY(-50%);
|
||||
>view{
|
||||
margin: 1.1vw 0;
|
||||
margin: 0.8vw 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1090,8 +1111,8 @@
|
|||
}
|
||||
|
||||
.left-ball {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
width: 3.6vw;
|
||||
height: 3.6vw;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -1107,7 +1128,7 @@
|
|||
|
||||
.right-menu {
|
||||
position: absolute;
|
||||
top: 43%;
|
||||
top: 40%;
|
||||
right: 6vw;
|
||||
transform: translateY(-50%);
|
||||
display: flex;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,225 @@
|
|||
<template>
|
||||
<view style="display: flex;align-items: center;" :class="!isDown?'red':''">
|
||||
<view class="box" id="box_minute" @click="chongzhi()">
|
||||
<view class="top child text" id="top" >{{ Math.floor(topTime / 60) }}</view>
|
||||
<view class="flip child" id="flip" :style="{ transform: transformInfomin?transformInfo:'' }">
|
||||
<view class="flip_face child text" :style="{ zIndex: faceZindexmin || 0 }" id="flip_face" >
|
||||
{{ Math.floor(bottomTime / 60) }}
|
||||
</view>
|
||||
<view class="flip_back child text" :style="backZindex&&transformInfomin ? { zIndex: backZindex } : {}" id="flip_back" >
|
||||
{{ Math.floor(topTime / 60) }}
|
||||
<text>MIN</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom child text" id="bottom" >
|
||||
{{ Math.floor(bottomTime / 60) }}
|
||||
<text>MIN</text>
|
||||
</view>
|
||||
</view>
|
||||
<text style="color: #959595;font-size: 1.9vw;padding: 0 5rpx;">:</text>
|
||||
<view class="box" id="box_minute" :class="!isDown?'red':''">
|
||||
<view class="top child text" id="top">{{ (topTime % 60)<10?'0'+(topTime % 60) : (topTime % 60) }}</view>
|
||||
<view class="flip child" id="flip" :style="{ transform: transformInfo }" >
|
||||
<view class="flip_face child text" :style="{ zIndex: faceZindex || 0 }" id="flip_face" >
|
||||
{{ (bottomTime % 60)<10? '0'+(bottomTime % 60) : (bottomTime % 60)}}
|
||||
</view>
|
||||
<view class="flip_back child text" :style="backZindex ? { zIndex: backZindex } : {}" id="flip_back" >
|
||||
{{ (topTime % 60)<10?'0'+(topTime % 60) : (topTime % 60) }}
|
||||
<text >SEC</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom child text" id="bottom">
|
||||
{{ (bottomTime % 60)<10? '0'+(bottomTime % 60) : (bottomTime % 60) }}
|
||||
<text >SEC</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
initTime: {
|
||||
// 初始时间
|
||||
type: Number,
|
||||
default:185,
|
||||
},
|
||||
// isDown: {
|
||||
// // 是否是倒计时
|
||||
// type: Boolean,
|
||||
// default: true,
|
||||
// },
|
||||
threshold: {
|
||||
// 阈值
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
timeoutDuration:{
|
||||
// 超时时间多少停止
|
||||
type: Number,
|
||||
default: 0,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
topTime: Math.abs(this.initTime),
|
||||
bottomTime: Math.abs(this.initTime),
|
||||
faceZindex: 1,
|
||||
backZindex: 0,
|
||||
transformInfo: "perspective(500rpx) rotateX(0deg)",
|
||||
transformInfomin: false,
|
||||
faceZindexmin: 1,
|
||||
backZindexmin: 0,
|
||||
mintime:0,
|
||||
timer: null,
|
||||
timerTwo: null,
|
||||
isDown:true
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.cycle();
|
||||
},
|
||||
methods: {
|
||||
OneCycle(n) {
|
||||
// 一次翻页的周期
|
||||
let num = 0;
|
||||
this.transformInfo = "perspective(500rpx) rotateX(0deg)";
|
||||
this.faceZindex = 1;
|
||||
this.backZindex = 0;
|
||||
this.bottomTime = this.isDown? n : n-1;
|
||||
let minutes = Math.floor(n / 60);
|
||||
if (this.timer) {
|
||||
clearInterval(this.timer);
|
||||
}
|
||||
this.timer = setInterval(() => {
|
||||
num++;
|
||||
if (num > 50) {
|
||||
num = 0;
|
||||
clearInterval(this.timer);
|
||||
return;
|
||||
}
|
||||
if (num === 1) {
|
||||
if (this.isDown) {
|
||||
this.topTime = n - 1 < this.threshold ? n : n - 1; // 60 和 0 在时间里,其实是一样的
|
||||
this.mintime = Math.floor(this.topTime / 60)
|
||||
if(minutes != this.mintime &&!this.transformInfomin){
|
||||
this.transformInfomin = true;
|
||||
}else{
|
||||
this.transformInfomin = false;
|
||||
}
|
||||
} else {
|
||||
this.topTime = n + 1 > this.threshold ? n : n + 1;
|
||||
this.mintime = Math.floor(this.topTime / 60)
|
||||
if(minutes != this.mintime &&!this.transformInfomin){
|
||||
this.transformInfomin = true;
|
||||
}else{
|
||||
this.transformInfomin = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
this.faceZindex = num <= 25? 1 : 0;
|
||||
this.backZindex = num <= 25? 0 : 1;
|
||||
|
||||
this.transformInfo = `perspective(500rpx) rotateX(-${(180 * num) / 50}deg)`;
|
||||
|
||||
},10); // 将一秒钟分成50份。
|
||||
},
|
||||
cycle() {
|
||||
let minutes = Math.floor(this.initTime / 60);
|
||||
this.isDown = this.initTime>0?true:false
|
||||
let time = Math.abs(this.initTime);
|
||||
// console.log(minutes,time)
|
||||
this.timerTwo = setInterval(() => {
|
||||
const flag = this.isDown ? time - 1 : time + 1;
|
||||
if (flag === this.threshold) {
|
||||
this.isDown = false
|
||||
// clearInterval(this.timerTwo);
|
||||
// clearInterval(this.timer);
|
||||
}
|
||||
if(flag == this.timeoutDuration&&this.isDown == false){
|
||||
clearInterval(this.timerTwo);
|
||||
clearInterval(this.timer);
|
||||
this.$emit('timeend')
|
||||
}
|
||||
this.OneCycle(time);
|
||||
this.isDown ? time-- : time++;
|
||||
}, 1000);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.red{
|
||||
color: red !important;
|
||||
view{
|
||||
color: red !important;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.box .child {
|
||||
min-width: 5.1vw;
|
||||
height: 2.5vw;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.box > .top {
|
||||
background-color: #eaeaea;
|
||||
line-height: 5vw;
|
||||
border-bottom: 2rpx solid #fff;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
|
||||
.box .flip {
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
z-index: 1;
|
||||
transform-origin: bottom;
|
||||
border-radius: 4rpx 4rpx 0 0;
|
||||
}
|
||||
|
||||
.box .flip .flip_face {
|
||||
position: absolute;
|
||||
background: #eaeaea;
|
||||
line-height: 5vw;
|
||||
z-index: 1;
|
||||
border-bottom: 2rpx solid #fff;
|
||||
}
|
||||
|
||||
.box .flip .flip_back {
|
||||
position: absolute;
|
||||
background-color: #eaeaea;
|
||||
line-height: 0rpx;
|
||||
transform: perspective(500rpx) rotateX(0deg) rotateY(-180deg) rotate(180deg);
|
||||
border-top: 2rpx solid #fff;
|
||||
}
|
||||
|
||||
.box .bottom {
|
||||
background-color: #f4f4f4;
|
||||
line-height: 0rpx;
|
||||
border-top: 1rpx solid #fff;
|
||||
border-radius: 0 0 4px 4px;
|
||||
}
|
||||
|
||||
.text {
|
||||
text-align: center;
|
||||
font-size: 3.4vw;
|
||||
font-weight: 900;
|
||||
color: #666;
|
||||
position: relative;
|
||||
>text{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
bottom: 0vw;
|
||||
line-height:1vw;
|
||||
left: 0;
|
||||
font-size: 0.7vw;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -527,7 +527,7 @@
|
|||
height: 100vh;
|
||||
overflow: hidden;
|
||||
z-index: 99;
|
||||
background-color: #F2F3F8;
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
|
||||
.nomessageclass {
|
||||
|
|
|
|||
Loading…
Reference in New Issue