hldy_app/component/rightItemssecondrelnew/index.vue

1491 lines
48 KiB
Vue
Raw Permalink 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>
<!-- click是让抖动停止 -->
<view class="right-container" :style="isshow?{opacity: `1`}:{opacity: `0`}"
@click="bottomisShaking=false;shakyTable = false">
<!-- 轮盘 -->
<joystick @movecard="movecard" />
<view class="right-container-title-nav">
<text :class="darkFans?`right-container-title-no-dark`:`right-container-title-no`">
ID12345678
</text>
<text :class="darkFans?`right-container-title-no-dark`:`right-container-title-no`">
名称未命名01
</text>
<view class="right-icons">
<image class="right-icons-img" :src="`/static/index/undericons/man.png`" />
<view :class="darkFans?`right-icons-font-dark`: `right-icons-font` ">王金福</view>
<image class="right-icons-img-icon"
:src="darkFans?`/static/index/undericons/face.png`:`/static/index/undericons/facelight.png`" />
<image class="right-icons-img-icon"
:src="darkFans?`/static/index/undericons/hand.png`:`/static/index/undericons/handlight.png`" />
<image class="right-icons-img-icon"
:src="darkFans?`/static/index/undericons/out.png`:`/static/index/undericons/outlight.png`" />
</view>
<view class="right-container-title-class-anhei-button-wrong" @click="newchange(0)">
<text class="right-container-title-class-anhei">
拖动模式
</text>
</view>
<!-- <view class="right-container-title-class-anhei-button-wrong" @click="newchange(1)">
<text class="right-container-title-class-anhei">
手柄模式1
</text>
</view> -->
<view class="right-container-title-class-anhei-button">
<text class="right-container-title-class-anhei">
手柄模式
</text>
</view>
</view>
<view class="doctorsay-container-view">
<view class="doctorsay-container-container">
<view class="doctorsay-container-title">
<view class="doctorsay-container-left">
<view class="doctorsay-container-left-gun"></view>
<view class="doctorsay-container-left-font">护理流程</view>
<view class="doctorsay-container-share" @click="shareToWeixin">
分享
</view>
<view class="doctorsay-container-share">
立即生效
</view>
</view>
<view class="doctorsay-container-right">
<view class="doctorsay-container-right-kuai-cheng"></view>
<view class="doctorsay-container-kuai-font">日常</view>
<view class="doctorsay-container-right-kuai-zi"></view>
<view class="doctorsay-container-kuai-font">周期</view>
<view class="doctorsay-container-juzhen" @click="routerPush">
预览
</view>
</view>
</view>
<view class="super-card">
<view class="boom-title">
<view class="boom-title-left">
</view>
<view class="boom-title-right">
</view>
</view>
<view class="boom-father">
<view class="boom">
<view :style="{ marginTop: `-${2 *moveDownNumber}rpx` }">
<view v-for="(item,index) in timearr[0].children" :key="index">
<view
:class="touchindex1 === index ||(liang.index1 === index && !canmove) || (flyNumber.index1 === index && shakyTable) ? `boom-son-target`: `boom-son`"
v-show="item.typeName">
{{item.typeName}}
</view>
</view>
</view>
</view>
</view>
<view class="super-card-container">
<scroll-view style="height: 920rpx;width: 100%;" :scroll-left="cardLeft" scroll-x
@scroll="handleTop" :show-scrollbar="false">
<view
style="display: flex;box-shadow: 10rpx 10rpx 20rpx rgba(0, 0, 0, 0.1);width:5610rpx;background: linear-gradient(to right, #c4dbf4,#c9c2ef, #c6dcf3);">
<view v-for="(item0,index0) in timearr" :key="index0">
<view class="super-card-time">
{{(item0.positioning.length == 1 ? ('0' + item0.positioning) : item0.positioning) + ":00"}}
</view>
</view>
</view>
<view style="display: flex;height: calc(100% - 80rpx);">
<scroll-view style="height: 100%;width:5610rpx" :scroll-top="scrollTop"
:scroll-y="canmove && !shakyTable" @scroll="handleScrolltime"
:show-scrollbar="false">
<view style="display: flex;height: 100%;">
<view v-for="(item0,index0) in timearr" :key="index0">
<view class="super-card-time-und">
<view v-for="(item1,index1) in item0.children" style="width: 100%;"
:key="index1">
<view
:class=" targetRuler.index0 === index0 && targetRuler.index1 === index1 ? targetRuler.index1 ?`title-time-border-big`:`title-time-border-big-top` : `super-card-time-card` "
:style="!targetRuler.bordershow && saveRulerTime.index0 === index0 && saveRulerTime.index1 === index1 ? {zIndex:999} : {borderBottom: '1rpx solid transparent'}"
:id="`a${index0}_${index1}`" style="position: relative;"
@click="rulerTouchClick(item1,index0,index1,$event)"
@touchstart="rulerTouchStart(item1,index0,index1,$event)"
@touchmove="rulerTouchMove" @touchend="rulerTouchEnd()"
:data-index0="index0" :data-index1="index1">
<view class="time-button-orange-spe"
v-if="flyNumber.index0 === index0 && flyNumber.index1 === index1 && index1==0">
请选择服务指令迁移的目标单元格
<view class="under-button-three"></view>
</view>
<view class="time-button-orange"
v-if="flyNumber.index0 === index0 && flyNumber.index1 === index1 && index1">
请选择服务指令迁移的目标单元格
<view class="under-button-three"></view>
</view>
<view class="time-button-black-spe"
v-if="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1 && index1==0 && isDelete">
是否确认删除该服务指令
<view class="under-button-three"></view>
</view>
<view class="time-button-black"
v-if="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1 && index1 && isDelete">
是否确认删除该服务指令
<view class="under-button-three"></view>
</view>
<view class="title-time-blue"
v-show="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1">
<image class="title-time-blue-img"
:src="isMove?`/static/index/movemode/targetcheng.png`: `/static/index/movemode/target.png`" />
</view>
<view :class="getClass(item1,index0,index1)"
style="font-size: 30rpx;overflow: hidden;"
:style="{ animationDelay:`-${computeDelay(index0, index1).toFixed(2)}s` }">
<view class="title-time" v-if="item1.startTime"
v-show=" liang.index0 !== index0 || liang.index1 !== index1 || canmove"
style="margin-top: 5rpx;">
<view class="title-time-time" style="font-size: 25rpx;">
{{item1.startTime + `-` + item1.endTime}}
</view>
<image class="title-time-button"
:src="item1.cycleType=='日常'?`/static/index/yellowbian.png`:`/static/index/puoplebian.png`" />
<view class="title-time-font">
{{item1.cycleType}}
</view>
</view>
<image v-if="item1.startTime" class="title-time-img"
src="/static/index/tu.png" />
<view v-if="item1.startTime" class="title-time-font-rel">
{{splitString(item1.directiveName)[0]}}
</view>
<view v-if="item1.startTime" class="title-time-items">
<image class="right-box-items-button"
src="/static/index/ku.png" />
<image class="right-box-items-button"
src="/static/index/ren.png" />
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
</scroll-view>
<view class="scroll-bottom-bgc"></view>
</view>
<view class="right-cards">
<scroll-view scroll-x class="scroll-box" :scroll-left="scrollLeft">
<view class="right-box">
<view v-for="(item,index) in bottomItems" :key="index">
<view class="right-box-item" @touchstart="bottomTouchStart"
@touchmove="bottomTouchMove" @touchend="bottomTouchEnd"
:style="item.target?{background: item.target,transition:`all 1.5s ease-in-out`}:{transition:`all 1.5s ease-in-out`}">
<image class="title-time-button" src="/static/index/redbian.png" />
<view class="title-time-font">
即时
</view>
<view :style="{ animationDelay:`-${index * 0.1}s` }"
:class="bottomisShaking?`super-end-items-img-father-active`:`super-end-items-img-father`">
<image class="right-box-img" :src="item.url" />
</view>
<view class="right-box-font">{{item.name}}</view>
<view class="right-box-items">
<image class="right-box-items-button" src="/static/index/ku.png" />
<image class="right-box-items-button" src="/static/index/ren.png" />
</view>
<view class="super-end-items-father-close-father" v-show="bottomisShaking"
@click.stop="bottomItems.splice(index, 1)">
-
</view>
</view>
</view>
</view>
<!-- <view style="width: 20rpx;"></view> -->
</scroll-view>
<view class="middle-box">
<view class="middle-left-box">
<view class="first-contant">
<view class="time-father" v-show="iszhouqi">
<view class="time-button" v-show="isweek">
<view class="time-button-month">周</view>
<view class="time-button-week"
@click="isweek=false;weekIndex = -1;weekValue = ''">月</view>
</view>
<view class="time-button" v-show="!isweek">
<view class="time-button-month-target"
@click="isweek=true;monthIndex = -1;monthValue = ''">周</view>
<view class="time-button-week-target">月</view>
</view>
<scroll-view scroll-y style="width: 100%;height: 600rpx;"
:show-scrollbar="false" :scroll-top="firsttop">
<view v-for="(item,index) in weekDays" :key="index"
@click="clickWeek(item,index)" v-if="isweek">
<view :class="weekIndex===index?`items-card-target`:`items-card`">
{{item}}
</view>
</view>
<view v-for="(item,index) in days" :key="index"
@click="clickMonth(item,index)" v-if="!isweek">
<view :class="monthIndex===index?`items-card-target`:`items-card`">
{{item}}
</view>
</view>
<view style="height: 40rpx;"></view>
</scroll-view>
</view>
<scroll-view scroll-y style="height: 100%;width:100%;" :show-scrollbar="false"
:scroll-top="firsttop" v-show="!iszhouqi">
<view
v-for="(item,index) in bigArray[upmenuIndex].children[downmenuIndex].children"
:key="index" @click="onTap(index)">
<view class="right-box-item"
:style="thirdmenuIndex==index?{border: `2rpx solid rgb(54, 159, 239)`,backgroundColor:`#fff`}:{border: `2rpx solid rgb(229, 233, 249)`}">
<image class="title-time-button" v-show="item.cycleType ==='日常护理'"
src="/static/index/ri.png" />
<image class="title-time-button" v-show="item.cycleType ==='周期护理'"
src="/static/index/zhou.png" />
<image class="title-time-button" v-show="item.cycleType ==='即时护理'"
src="/static/index/ji.png" />
<image class="right-box-img" src="/static/index/tu.png" />
<view class="right-box-font"
:style="thirdmenuIndex==index?{color:`rgb(54, 159, 239)`}:{}">
{{item.title}}
</view>
<view class="right-box-items">
<image class="right-box-items-button" src="/static/index/ku.png" />
<image class="right-box-items-button" src="/static/index/ren.png" />
</view>
</view>
</view>
<view style="height: 20rpx;"></view>
</scroll-view>
</view>
<view class="second-contant">
<scroll-view scroll-y style="height: 100%;width:100%;" :show-scrollbar="false"
:scroll-top="secondtop">
<view v-for="(item,index) in downList" :key="index"
@click="secondContant(index)">
<view :class="downmenuIndex==index? `downList-box-target` : `downList-box`">
<image class="downList-box-img" src="/static/index/tu.png" />
<view class="downList-box-text">
{{ item.title }}
</view>
</view>
</view>
<view style="height: 20rpx;"></view> <!-- 空白元素 -->
</scroll-view>
</view>
</view>
<view class="middle-right-box">
<view v-for="(item,index) in doctorsayList" :key="index" @click="changLeft(index)">
<view
:class="index === upmenuIndex ? `doctorsay-container-card-target`:`doctorsay-container-card`">
<image class="doctorsay-container-card-img"
:src="index === upmenuIndex ? item.targetUrl : item.url" />
<view
:class="(index === upmenuIndex) ? `doctorsay-container-card-font-dark`:`doctorsay-container-card-font`">
{{ item.name }}
</view>
<view class="bad-circle-up" v-show="index === upmenuIndex && index">
</view>
<view class="bad-circle-down" v-show="index === upmenuIndex && index!==5">
</view>
</view>
</view>
</view>
</view>
<view class="under-button">
<view class="under-button-black" :style="isop?{opacity: 1}:{opacity: 0}">
不能重复添加相同的即时服务指令
<view class="under-button-three"></view>
</view>
<view class="white-circle" @click="changecard">
<image class="white-circle-img" src="/static/index/keyimg/movebutton.png" />
</view>
<view class="white-circle" @click="openDelete">
<image class="white-circle-img" src="/static/index/keyimg/deletebutton.png" />
</view>
<view class="white-circle" @click="opensay">
<image class="white-circle-img" src="/static/index/keyimg/notebutton.png" />
</view>
<view class="white-circle-click-father" @click="addnew">
<image class="white-circle-click" src="/static/index/keyimg/okbutton.png" />
<view class="white-circle-font">
确定
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 点击的弹出层 -->
<view v-show="isopen" class="popup-overlay" @click="isopen=false;flyNumber.index0=999;touchindex1=-1">
<view class="popup-overlay-content"
:style="{ top: (2*openY - 350) + 'rpx',left: (2*openX - 780) + 'rpx',opacity: isopacity ? 1 : 0,backgroundColor:timearr[flyNumber.index0]?.children[flyNumber.index1]?.type==='日常'? '#fffcf6':'rgb(246, 244, 254)' }"
@click.stop>
<view class="popup-overlay-content-left">
<image class="popup-overlay-content-left-img" :src="`/static/index/teeth.png`" />
<text class="popup-overlay-content-left-font">
{{ timearr[flyNumber.index0]?.children[flyNumber.index1]?.value }}
</text>
</view>
<view class="popup-overlay-content-right">
<view class="time-font">
10:00 - 10:10
</view>
<view class="time-text">
为老人提供口腔清洁器具,牙膏、牙刷及水杯,看护完成
</view>
</view>
</view>
</view>
<!-- 替换表格的的弹出层 -->
<view v-show="sayisopen" class="popup-say" @click="sayisopen=false">
<view class="popup-say-content" style="padding-top: 30rpx;" :style="{ opacity: sayisopacity ? 1 : 0 }"
@click.stop>
<view class="popup-say-content-flex">
<view class="popup-say-content-gun"></view>
<view class="popup-say-content-font">情绪标签</view>
</view>
<view style="display: flex;">
<view v-for="(item,index) in nameArray.slice(0,2)" :key="index">
<view class="tags-father">
<image class="tags-img" :src="`/static/index/tagNames/${index}.png`" />
<view class="tags-font">{{item}}</view>
</view>
</view>
</view>
<view class="popup-say-content-flex" style="margin-top: 25rpx;">
<view class="popup-say-content-gun"></view>
<view class="popup-say-content-font">体型标签</view>
</view>
<view style="display: flex;flex-wrap: wrap;">
<view v-for="(item,index) in nameArray.slice(2,11)" :key="index">
<view class="tags-father">
<image class="tags-img" :src="`/static/index/tagNames/${index+2}.png`" />
<view class="tags-font">{{item}}</view>
</view>
</view>
</view>
<view class="popup-say-three"></view>
</view>
</view>
<!-- 分享的弹出层 -->
<view v-show="shareShow" class="popup-share" @click="shareShow=false">
<view class="popup-share-content" :style="{ opacity: deletedownisopacity ? 1 : 0 }" @click.stop>
<view class="popup-share-title">
护理日程分享
<image class="popup-share-img" src="/static/index/NU.png" />
</view>
<view class="popup-share-upcontent">
<view class="popup-share-font">久泰护理日程分享测试</view>
</view>
<view class="popup-share-gray"></view>
<view class="popup-share-downcontent">
<view class="popup-share-downcontent-left">
<image class="popup-downcontent-img" src="/static/index/NU.png" />
<view class="popup-downcontent-font">久泰护理</view>
</view>
<view class="popup-share-downcontent-button" @click="clickshare">
分享
</view>
</view>
</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, defineEmits, watch } from 'vue';
import { onShow, onHide } from '@dcloudio/uni-app';
import type { roomBtttonType } from "./index";
import { getServiceTree, getNclist, addBatch } from "./api.js";
import index from '../../request';
import { myArray } from './yaoshandiao.js';
import joystick from '@/component/public/newgame/joysticknew.vue';
import skill from '@/component/public/game/skill.vue';
import skilladd from '@/component/public/game/skilladd.vue'
import skillmove from '@/component/public/game/skilmove.vue'
import skilmovedelete from '@/component/public/game/skilmovedelete.vue'
const props = defineProps({
isshow: {
type: Boolean,
required: true,
},
darkFans: {
type: Boolean,
required: true,
},
canmove: {
type: Boolean,
required: true,
},
liang: {
type: Object,
},
isold: {
type: Boolean,
required: true,
}
});
watch(
() => props.isold,
() => {
if (props.isold) {
saveEditIndex.value.index0 = 9;
saveEditIndex.value.index1 = 0;
cardLeft.value = 1;
scrollTop.value = 1;
nextTick(() => {
scrollTop.value = 0;
cardLeft.value = saveleft.value * 117;
})
}
})
watch(
() => props.canmove,
() => {
bottomisShaking.value = false;
})
watch(
() => props.isshow,
() => {
bottomisShaking.value = false
shakyTable.value = false;
cardLeft.value = 1;
nextTick(() => {
cardLeft.value = 702;
})
})
const bottomItems = ref([
{
name: '纸尿裤',
url: "/static/index/niao.png",
target: "#fff",
id: -1
},
{
name: '呕吐',
url: "/static/index/tu.png",
target: "#fff",
id: -1
},
{
name: '吸痰',
url: "/static/index/ou.png",
target: "#fff",
id: -1
},
{
name: '大便',
url: "/static/index/baba.png",
target: "#fff",
id: -1
},
{
name: '纸尿裤',
url: "/static/index/niao.png",
target: "#fff",
id: -1
},
{
name: '呕吐',
url: "/static/index/tu.png",
target: "#fff",
id: -1
},
{
name: '吸痰',
url: "/static/index/ou.png",
target: "#fff",
id: -1
},
{
name: '大便',
url: "/static/index/baba.png",
target: "#fff",
id: -1
},
])
const nameArray = [
`狂躁`,
`正常`,
`大体重`,
`口腔`,
`小体重`,
`头部`,
`面部`,
`躯干`,
`四肢`,
`修甲`,
`颅骨缺损`
]
const timeArray = [
`00`, `05`, `10`, `15`, `20`, `25`, `30`, `35`, `40`, `45`, `50`, `55`
];
const weekDays = ["周一", "周二", "周三", "周四", "周五", "周六", "周日"];
const days = Array.from({ length: 31 }, (_, i) => (i + 1).toString().padStart(2, "0"));
const isweek = ref(true);
// 是否周期
const iszhouqi = ref(false);
//高度回到最高
const firsttop = ref(0);
const secondtop = ref(0);
// const containerRef = ref(null);
const scrollLeft = ref(0);
const cardLeft = ref(678);
//移动表格
const scrollTop = ref(0)
//左下的数组
const downList = ref<any>()
//左下的数组
const rightList = ref<String[]>([
// "三分段",
// "四分段",
])
const isop = ref(false);
const bigArray = ref([]);
const isopen = ref(false)
const songisopen = ref(false)
const isopacity = ref(false)
const songisopacity = ref(false)
// 删除表格弹窗
const deleteisopen = ref(false);
const deletename = ref("")
const deleteisopacity = ref(false)
// 解释图标弹窗
const sayisopen = ref(false);
const sayname = ref("")
const sayisopacity = ref(false)
//第几套表格
const currentNumber = ref(0);
const scrollKey = ref(0);
const saveleft = ref(6);
const saveright = ref(11);
const savetop = ref(0);
const savebottom = ref(3);
const isMove = ref(false);
// 上次点击时间
const lastTap = ref(0)
// 双击的最大间隔ms可根据体验调整
const DOUBLE_TAP_DELAY = 300
function onTap(e) {
const now = Date.now()
if (now - lastTap.value < DOUBLE_TAP_DELAY) {
// 双击成立
thirdmenuIndex.value = e
addnew()
// 重置,避免多次触发
lastTap.value = 0
} else {
thirdmenuIndex.value = e
// 记录本次时间,等待下次点击
lastTap.value = now
}
}
// 替换新的
const getNew = () => {
let object = JSON.parse(JSON.stringify(timearr.value[flyNumber.value.index0].children[flyNumber.value.index1]))
indexsave.value = [saveEditIndex.value.index0, saveEditIndex.value.index1]
// 旧的typeName保存了
let typeName = timearr.value[flyNumber.value.index0].children[flyNumber.value.index1].typeName
timearr.value[flyNumber.value.index0].children[flyNumber.value.index1] = { directiveName: '', typeName: typeName }
//然后保存新的
let newtypeName = timearr.value[indexsave.value[0]].children[indexsave.value[1]].typeName
timearr.value[indexsave.value[0]].children[indexsave.value[1]] = object
timearr.value[indexsave.value[0]].children[indexsave.value[1]].typeName = newtypeName
let startTime = timearr.value[indexsave.value[0]].children[indexsave.value[1]].startTime;
let endTime = timearr.value[indexsave.value[0]].children[indexsave.value[1]].endTime;
let positioning = timearr.value[indexsave.value[0]].positioning
const rest = startTime.split(":")[1]; // ":20"
const rest0 = endTime.split(":")[1];; // ":20"
let many = Number(rest0) - Number(rest);
let start = newtypeName
let end = Number(start) + many
// 用 positioning 替换原来的小时部分
timearr.value[indexsave.value[0]].children[indexsave.value[1]].startTime = positioning + ":" + start.padStart(2, '0'); // "9:20"
timearr.value[indexsave.value[0]].children[indexsave.value[1]].endTime = positioning + ":" + String(end % 60).padStart(2, '0'); // "9:20"
flyNumber.value.index0 = -1;
flyNumber.value.index1 = -1;
isMove.value = false;
let data = {
index0: saveEditIndex.value.index0,
index1: saveEditIndex.value.index1
}
whereEvent(data);
// isHave()
}
//变更左侧菜单
const changLeft = (index : number) => {
if (index === 5) {
return
}
iszhouqi.value = false;
weekIndex.value = -1;
monthIndex.value = -1;
weekValue.value = "";
monthValue.value = "";
secondtop.value = 1
firsttop.value = 1
nextTick(() => {
secondtop.value = 0
firsttop.value = 0
})
upmenuIndex.value = index
downList.value = bigArray.value[index].children
downmenuIndex.value = 0;
thirdmenuIndex.value = 0;
}
const changecard = () => {
isDelete.value = false;
if (isMove.value) {
getNew()
} else {
if (timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].directiveName) {
flyNumber.value.index0 = saveEditIndex.value.index0;
flyNumber.value.index1 = saveEditIndex.value.index1;
isMove.value = true
}
}
}
function dosomesave() {
cardsumit.value.op.name = secondopenValue.value[cardsumit.value.op.index[2]].relName
switch (secondopenValue.value[cardsumit.value.op.index[2]].cycleType) {
case `日常护理`:
openOp.value = 0
break;
case `周期护理`:
openOp.value = 1
break;
case `即时护理`:
openOp.value = 2
break;
default:
break;
}
}
const selectType = ref(true);
const deleteButton = ref(false);
// 给摇杆用的
//看完迷糊不,我都迷糊了
//0上1右2下3左
// songisopen.value是弹窗打没打开
// clickstauts.value是弹窗的第几步
// selectType.value是选择周和月的状态
const movecard = (where : number) => {
isDelete.value = false;
// console.log("?????",leftIn.value,saveleft.value*117)
// if (((saveleft.value * 117 - leftIn.value) > 5) || ((leftIn.value - saveleft.value * 117) > 0)) {
// cardLeft.value = 1;
// nextTick(() => {
// cardLeft.value = saveleft.value * 117;
// })
// }
// if (((savetop.value * 104.5 - topIn.value) > 5) || ((topIn.value - savetop.value * 104.5) > 0)) {
// scrollTop.value = 1;
// nextTick(() => {
// scrollTop.value = savetop.value * 104.5;
// })
// }
switch (where) {
case 0:
if (saveEditIndex.value.index1) {
saveEditIndex.value.index1--
}
// if (saveEditIndex.value.index1 < savetop.value) {
// savetop.value = saveEditIndex.value.index1;
// savebottom.value = saveEditIndex.value.index1 + 3
// scrollTop.value = saveEditIndex.value.index1 * 104.5;
// }
// isHave()
break
case 1:
if (saveEditIndex.value.index0 == 23) {
return
}
saveEditIndex.value.index0++
// if (saveEditIndex.value.index0 > saveright.value) {
// saveleft.value = saveEditIndex.value.index0 - 5;
// saveright.value = saveEditIndex.value.index0
// cardLeft.value = saveleft.value * 117;
// }
// isHave()
break
case 2:
if (saveEditIndex.value.index1 == 11) {
return
}
saveEditIndex.value.index1++
// if (saveEditIndex.value.index1 > savebottom.value) {
// savetop.value = saveEditIndex.value.index1 - 3;
// savebottom.value = saveEditIndex.value.index1;
// scrollTop.value = savetop.value * 104.5;
// }
// isHave()
break
case 3:
if (saveEditIndex.value.index0 == 0) {
return
}
saveEditIndex.value.index0--
// if (saveEditIndex.value.index0 < saveleft.value) {
// saveleft.value = saveEditIndex.value.index0;
// saveright.value = saveEditIndex.value.index0 + 5;
// cardLeft.value = saveleft.value * 117;
// }
// isHave()
break
}
}
const weekValue = ref("");
const weekIndex = ref(-1);
const monthValue = ref("");
const monthIndex = ref(-1);
const clickWeek = (item, index) => {
const now = Date.now()
if (now - lastTap.value < DOUBLE_TAP_DELAY) {
// 双击成立
weekValue.value = item;
weekIndex.value = index;
addnew()
// 重置,避免多次触发
lastTap.value = 0
} else {
weekValue.value = item;
weekIndex.value = index;
// 记录本次时间,等待下次点击
lastTap.value = now
}
}
const clickMonth = (item, index) => {
const now = Date.now()
if (now - lastTap.value < DOUBLE_TAP_DELAY) {
// 双击成立
monthValue.value = item;
monthIndex.value = index;
addnew()
// 重置,避免多次触发
lastTap.value = 0
} else {
monthValue.value = item;
monthIndex.value = index;
// 记录本次时间,等待下次点击
lastTap.value = now
}
}
const isDelete = ref(false);
const openDelete = () => {
if (timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].directiveName) {
if (!isDelete.value) {
isDelete.value = true;
} else {
isDelete.value = false;
deleteRuler(saveEditIndex.value.index0, saveEditIndex.value.index1);
}
}
}
const haveName = ref(false);
const isHave = () => {
if (timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].directiveName) {
haveName.value = true;
} else {
haveName.value = false;
}
}
// 给抖动用的
function pseudoRandom(index0, index1) {
const seed = index0 * 55.9898 + index1 * 78.233;
// 产生一个伪随机数,取小数部分
return Math.abs(Math.sin(seed) * 43758.5453) % 1;
}
function computeDelay(index0, index1) {
const range = 2; // 延迟范围 0 ~ 2 秒
return pseudoRandom(index0, index1) * range;
}
// 在作用域中声明一个定时器变量
let throttleTimer = null;
//监听拖拽
const dragOffset = ref(0);
const topIn = ref(0)
const moveDownNumber = ref(0)
function handleScrolltime(e) {
let num = e.detail.scrollTop
topIn.value = e.detail.scrollTop
let formattedNum = parseFloat(num.toFixed(2));
moveDownNumber.value = formattedNum
}
const leftIn = ref(0)
function handleTop(e) {
leftIn.value = e.detail.scrollLeft
}
const changeBug = ref(true);
// 方法:根据条件返回不同的类名
const getClass = (item, index0, index1) => {
if (item.cycleType === '日常') {
if (flyNumber.value.index0 === (index0) && flyNumber.value.index1 === index1) {
return 'title-time-border-yellow-active-transparent';
} else if (shakyTable.value) {
return 'title-time-border-yellow-active';
} else {
return 'title-time-border-yellow';
}
} else if (item.cycleType) {
//为啥这么写,是因为动画写行内无效!!!
if (flyNumber.value.index0 === (index0) && flyNumber.value.index1 === index1) {
return 'title-time-border-pouple-active-transparent';
}
else if (shakyTable.value) {
return 'title-time-border-pouple-active';
} else {
return 'title-time-border-pouple';
}
}
return 'title-time-border';
}
// 初始化下面侧单列表
const doctorsayList = ref<roomBtttonType[]>([
{ url: '/static/index/firstTags/30.png', targetUrl: '/static/index/firstTags/21.png', name: '日常' },
{ url: '/static/index/firstTags/10.png', targetUrl: '/static/index/firstTags/99.png', name: '清洁' },
{ url: '/static/index/firstTags/40.png', targetUrl: '/static/index/firstTags/31.png', name: '饮食' },
{ url: '/static/index/firstTags/00.png', targetUrl: '/static/index/firstTags/01.png', name: '睡眠' },
{ url: '/static/index/firstTags/20.png', targetUrl: '/static/index/firstTags/11.png', name: '排泻' },
{ url: '/static/index/firstTags/50.png', targetUrl: '/static/index/firstTags/41.png', name: '影像' },
]);
// 当前选中的菜单索引
const upmenuIndex = ref<number>(0);
const downmenuIndex = ref<number>(0);
const thirdmenuIndex = ref<number>(0);
// 暗黑模式
const underFans = ref<boolean>(false);
// 当前选中的菜单索引
const roomTar = ref<number[]>([]);
const emit = defineEmits(['darkchange', 'savename', 'saveruler', 'closename', 'changefangkuang', 'changeold']);
const isEdit = ref(false);
// const isLunpan = ref(false);
const saveEditIndex = ref({
index0: 9,
index1: 0
})
const clickstauts = ref(0)
const secondopenValue = ref([]);
const secondContant = (index : number) => {
iszhouqi.value = false;
weekIndex.value = -1;
monthIndex.value = -1;
weekValue.value = "";
monthValue.value = "";
downmenuIndex.value = index;
thirdmenuIndex.value = 0;
firsttop.value = 1;
nextTick(() => {
firsttop.value = 0;
})
}
const newchange = (type : number) => {
emit('changeold', type)
}
const timer = ref(null);//计时器
const elementsInfo = ref({})//所有表格的信息
const moveX = ref(0)
const moveY = ref(0)
const openX = ref(0)
const openY = ref(0)
const flyNumber = ref({
index0: 999,
index1: 999,
typeName: ''
})
const deletebottomindex = ref(-1);
const deletedownisopen = ref(false);
const deletedownisopacity = ref(false);
const deletebottom = (index : number, name : string) => {
bottomisShaking.value = false;
deletebottomindex.value = index;
shakyTable.value = false;
deletedownisopacity.value = false;
deletedownisopen.value = true;
deletename.value = name;
setTimeout(() => {
deletedownisopacity.value = true
}, 100)
}
const touchindex1 = ref(-1);
// 分享矩阵到微信
const shareShow = ref(false);
const shareToWeixin = () => {
shareShow.value = true;
deletedownisopacity.value = false;
setTimeout(() => {
deletedownisopacity.value = true
}, 100)
}
const clickshare = () => {
uni.share({
provider: "weixin",
scene: "WXSceneSession",
type: 0,
href: "http://192.168.2.31:3101/daytoday",
title: "护理日程分享",
summary: "九泰护理日程测试",
imageUrl: "https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni@2x.png",
success: function (res) {
console.log("success:");
},
fail: function (err) {
console.log("fail:");
}
});
}
//表格点击开始
const rulerTouchClick = (item : any, index0 : number, index1 : number, e : any) => {
if (item.directiveName) {
touchindex1.value = index1;
const query = uni.createSelectorQuery()
query
.selectAll('.super-card-time-card')
.boundingClientRect((data : any) => {
data.forEach(async (res : any) => {
// 根据你的条件筛选元素
if (res.left > 100 && res.left < 1067 && res.top < 570 && res.top > 140 && res.dataset.index0 == index0 && res.dataset.index1 == index1) {
if (res.left > 100 && res.left < 500) {
// 表格太靠左侧,修改到右面
openX.value = Math.floor(res.left) + 520;
} else {
openX.value = Math.floor(res.left)
}
if (res.top > 140 && res.top < 300) {
// 表格太靠上侧,修改到下面
openY.value = Math.floor(res.top) + 250;
} else {
openY.value = Math.floor(res.top)
}
// openY.value = Math.floor(res.top);
await nextTick()
isopen.value = true;
isopacity.value = false;
//加动画
setTimeout(() => {
isopacity.value = true;
}, 100)
}
})
})
.exec()
}
}
const shakyTable = ref(false);
const reldata = ref([]);
//表格长按开始
const rulerTouchStart = (item : any, index0 : number, index1 : number, e : any) => {
}
const rulerTouchMove = (e : any) => {
const moveXa = Math.floor(e.touches[0].pageX);
const moveYa = Math.floor(e.touches[0].pageY);
// 计算移动距离
if (
Math.abs(moveXa - moveX.value) > 0 ||
Math.abs(moveYa - moveY.value) > 0
) {
// 移动时取消长按计时器
if (timer.value) {
clearTimeout(timer.value);
timer.value = null;
}
}
}
//表格长按结束
const rulerTouchEnd = () => {
isTuoing.value = false;
if (timer.value) {
clearTimeout(timer.value);
timer.value = null;
}
}
const deleteRuler = (index0 : number, index1 : number) => {
let typeName = timearr.value[index0].children[index1].typeName
timearr.value[index0].children[index1] = { directiveName: "", typeName: typeName };
}
const longPressTimer = ref(null);
const isScrolling = ref(false)
//长按计时器
let scrollTimeout = null
function handleScroll(e) {
isScrolling.value = true
// 清除之前的定时器
if (scrollTimeout) clearTimeout(scrollTimeout)
// 设置新的定时器
scrollTimeout = setTimeout(() => {
isScrolling.value = false;
}, 400)
}
const isBack = ref(false)
const saveX = ref(0);
const saveY = ref(0);
const isTuoing = ref(false);
// 存储菜单的id
const saveId = ref("");
const saveTagName = ref("");
function isblue() {
if (openOp.value !== -1) {
return true
} else {
return false
}
}
const bottomTimer = ref(null);
const bottomisShaking = ref(false);
const bottomTouchStart = (e) => {
saveX.value = Math.floor(e.touches[0].pageX);
saveY.value = Math.floor(e.touches[0].pageY);
// 2秒后触发抖动效果
bottomTimer.value = setTimeout(() => {
bottomisShaking.value = true
}, 500)
}
const bottomTouchMove = (e) => {
const moveX = Math.floor(e.touches[0].pageX);
const moveY = Math.floor(e.touches[0].pageY);
// 计算移动距离
if (
Math.abs(moveX - saveX.value) > 0 ||
Math.abs(moveY - saveY.value) > 0
) {
if (bottomTimer.value) {
clearTimeout(bottomTimer.value)
bottomTimer.value = null
}
}
}
const bottomTouchEnd = () => {
if (bottomTimer.value) {
clearTimeout(bottomTimer.value)
bottomTimer.value = null
}
}
const openValue = ref({
time: "",
minute: "",
array: []
})
const cardsumit = ref({
op: {
name: "",
index: [-1, -1, -1],
},
startTime: "",
weekTimeNumber: -1,
monthTimeNumber: -1,
monthTime: "",
weekTime: ""
})
const openOp = ref(0);
const clickOp = (index : number, item : any) => {
saveId.value = item.id;
saveTagName.value = item.tagName
cardsumit.value.op.index[2] = index
cardsumit.value.op.name = item.relName
switch (item.cycleType) {
case `日常护理`:
openOp.value = 0
break;
case `周期护理`:
openOp.value = 1
break;
case `即时护理`:
openOp.value = 2
break;
default:
break;
}
// if (cardsumit.value.op.index[2] === index) {
// cardsumit.value.op.index[2] = -1;
// cardsumit.value.op.name = ""
// openOp.value = -1
// } else {
// cardsumit.value.op.index[2] = index
// cardsumit.value.op.name = item.relName
// switch (item.cycleType) {
// case `日常护理`:
// openOp.value = 0
// break;
// case `周期护理`:
// openOp.value = 1
// break;
// case `即时护理`:
// openOp.value = 2
// break;
// default:
// break;
// }
// }
}
// const clickweek = (index : string) => {
// cardsumit.value.weekTime = index
// }
// const clickmonth = (index : string) => {
// cardsumit.value.monthTime = index
// }
const indexsave = ref([-1, -1]);
// (长按表格后)表格拖动结束
const rulerMoveEnd = (object : any) => {
if (props.liang.index0 !== 999 && object.cycleType) {
indexsave.value = [props.liang.index0, props.liang.index1]
// 旧的typeName保存了
let typeName = timearr.value[flyNumber.value.index0].children[flyNumber.value.index1].typeName
timearr.value[flyNumber.value.index0].children[flyNumber.value.index1] = { directiveName: '', typeName: typeName }
//然后保存新的
let newtypeName = timearr.value[indexsave.value[0]].children[indexsave.value[1]].typeName
timearr.value[indexsave.value[0]].children[indexsave.value[1]] = object
timearr.value[indexsave.value[0]].children[indexsave.value[1]].typeName = newtypeName
let startTime = timearr.value[indexsave.value[0]].children[indexsave.value[1]].startTime;
let endTime = timearr.value[indexsave.value[0]].children[indexsave.value[1]].endTime;
let positioning = timearr.value[indexsave.value[0]].positioning
const rest = startTime.split(":")[1]; // ":20"
const rest0 = endTime.split(":")[1];; // ":20"
let many = Number(rest0) - Number(rest);
let start = newtypeName
let end = Number(start) + many
// 用 positioning 替换原来的小时部分
timearr.value[indexsave.value[0]].children[indexsave.value[1]].startTime = positioning + ":" + start.padStart(2, '0'); // "9:20"
timearr.value[indexsave.value[0]].children[indexsave.value[1]].endTime = positioning + ":" + String(end % 60).padStart(2, '0'); // "9:20"
// 检查是否有任意一个对象的 children 数组最后一个对象的 value 有值
// saveAll()
}
}
const scrollContainer = ref(null)
const opensay = () => {
sayisopacity.value = false;
sayisopen.value = true;
setTimeout(() => {
sayisopacity.value = true
}, 50)
}
const addnew = () => {
if (isDelete.value) {
isDelete.value = false;
deleteRuler(saveEditIndex.value.index0, saveEditIndex.value.index1);
return
}
if (isMove.value) {
getNew()
return
}
flyNumber.value.index0 = -1;
flyNumber.value.index1 = -1;
isMove.value = false;
let stopIt = false;
let allobject = bigArray.value[upmenuIndex.value].children[downmenuIndex.value].children[thirdmenuIndex.value]
if (allobject.cycleType === "即时护理") {
scrollLeft.value = 1;
bottomItems.value.forEach((element : any, index : number) => {
if (element.id === allobject.id) {
stopIt = true
}
})
nextTick(() => {
if (!stopIt) {
scrollLeft.value = 0;
if (bottomItems.value.length && bottomItems.value[0].target === "#00a8ff") {
bottomItems.value[0].target = "#fff"
clearTimeout(cleansettimeout.value);
}
bottomItems.value.unshift({
name: allobject.title,
url: "/static/index/ou.png",
target: `#00a8ff`,
id: allobject.id
})
console.log("!!!!", bottomItems.value)
// 实现即时指令动画
cleansettimeout.value = setTimeout(() => {
bottomItems.value[0].target = `#fff`;
}, 1500)
} else {
clearTimeout(cleansettimeoutrel.value);
isop.value = true;
cleansettimeoutrel.value = setTimeout(() => {
isop.value = false;
}, 1000)
}
})
return
}
if (allobject.cycleType === "周期护理" && iszhouqi.value && weekIndex.value == -1 && monthIndex.value == -1) {
return
}
else if (allobject.cycleType === "周期护理" && !iszhouqi.value) {
iszhouqi.value = true
return
}
let cycleType = ""
if (allobject.cycleType === "日常护理") {
cycleType = "日常"
} else {
if (weekIndex.value !== -1) {
cycleType = weekValue.value
} else {
cycleType = monthValue.value + "号"
}
iszhouqi.value = false;
weekIndex.value = -1;
monthIndex.value = -1;
weekValue.value = "";
monthValue.value = "";
}
const startHour = Number(saveEditIndex.value.index0)
const startMinute = Number(timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].typeName)
const endMinute = startMinute + 10
const endHour = startHour + Math.floor(endMinute / 60)
const formattedStart = `${String(startHour)}:${String(startMinute).padStart(2, '0')}`
const formattedEnd = `${String(endHour)}:${String(endMinute % 60).padStart(2, '0')}`
timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].startTime = formattedStart
timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].endTime = formattedEnd
let param = {
directiveId: allobject.id,
directiveName: allobject.title,
startTime: formattedStart,
endTime: formattedEnd,
positioning: saveEditIndex.value.index0.toString(),
positioningLong: saveEditIndex.value.index1.toString(),
tagName: allobject.tagName,
cycleType: cycleType,
nuId: "1",
customerId: "1",
id: "",
typeName: timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1].typeName,
}
//给表格赋值
timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1] = param;
// movecard(1)
let data = {
index0: saveEditIndex.value.index0,
index1: saveEditIndex.value.index1
}
whereEvent(data);
saveAll()
}
const cleansettimeout = ref(null);
const cleansettimeoutrel = ref(null);
const saveAll = () => {
//给后端编译一下
let postArray = [];
timearr.value.forEach((element0, index0) => {
element0.children.forEach((element1, index1) => {
let saveTypeName = ""
if (!element1.directiveName && !element1.id) {
let array = {};
if (element1.typeName) {
saveTypeName = element1.typeName
}
array = JSON.parse(JSON.stringify(moBan.value))
saveTypeName ? array.typeName = saveTypeName : ""
array.positioning = index0
array.positioningLong = index1
postArray.push(array)
} else {
element1.positioning = index0;
element1.positioningLong = index1;
postArray.push(element1)
}
})
})
}
const routerPush = () => {
uni.setStorage({
key: 'myArray',
data: timearr.value,
success: function () {
uni.navigateTo({
url: `/pages/timeMatrix/indexnew`
})
},
});
}
// 暂存器
const saveRulerTime = ref({
index0: -1,
index1: -1
})
const targetRuler = ref({
index0: -1,
index1: -1,
current: -1,
bordershow: true
})
const whereEvent = (data : any) => {
targetRuler.value.index0 = data.index0;
targetRuler.value.index1 = data.index1;
saveRulerTime.value.index0 = targetRuler.value.index0;
saveRulerTime.value.index1 = targetRuler.value.index1;
targetRuler.value.bordershow = false;
setTimeout(() => {
targetRuler.value.index0 = -1;
targetRuler.value.index1 = -1;
targetRuler.value.current = -1
}, 400)
setTimeout(() => {
targetRuler.value.bordershow = true;
saveRulerTime.value.index0 = -1;
saveRulerTime.value.index1 = -1;
}, 1000)
}
// 定义每小时中的分钟数组,表示每 5 分钟一个时间段,总共 12 个
const minuteArr = ['00', '05', '10', '15', '20', '25', '30', '35', '40', '45', '50', '55']
const timearr = ref(
Array.from({ length: 24 }, (_, hour) => ({
positioning: hour.toString(),
children: minuteArr.map(time => ({
typeName: time, // 表示分钟,如 '00', '05' 等
directiveName: '' // 默认的 directiveName
}))
}))
)
onShow(() => {
bigArray.value = myArray
downList.value = bigArray.value[0].children
uni.$on('where', whereEvent);
console.log("???",saveEditIndex.value)
})
onHide(() => {
uni.$off('where', whereEvent);
});
defineExpose({
rulerMoveEnd,
})
const moveNumber = ref({
index0: 999,
index1: 999
})
const moBan = ref({
directiveId: "",
directiveName: "",
startTime: "",
endTime: "",
positioning: "",
positioningLong: "",
tagName: "",
cycleType: "",
nuId: "1",
customerId: "1",
id: "",
typeName: ""
})
// 切割bigArray
function splitString(str) {
// 使用正则表达式找到所有括号的内容
let result = [];
let remainingStr = str;
// 正则匹配最外层括号(支持全角和半角)
let regex = /([^(]*)[(]([^)]+)[)]/;
while (regex.test(remainingStr)) {
let match = remainingStr.match(regex);
if (match) {
// 添加括号前的部分(去掉空白)
if (match[1].trim()) {
result.push(match[1].trim());
}
// 添加括号内的内容
if (match[2].trim()) {
result.push(match[2].trim());
}
// 更新剩余的字符串
remainingStr = remainingStr.replace(match[0], '').trim();
}
}
// 如果最后还有剩余部分,也加入结果
if (remainingStr.trim()) {
result.push(remainingStr.trim());
}
return result;
}
watch(
[() => saveEditIndex.value.index0, () => saveEditIndex.value.index1],
() => {
centerCell();
}
);
const totalColumns = 24; // 总列数
const totalRows = 11; // 总行数
const visibleWidth = 1405; // 可视区域宽度 (rpx),基于 scalcType * widthType ≈ 2220
const visibleHeight = 480; // 可视区域高度 (rpx)假设显示约5行时 heightType = 102.5
function centerCell() {
if (saveEditIndex.value.index0 >= 0 && saveEditIndex.value.index0 <= totalColumns && saveEditIndex.value.index1 >= 0 && saveEditIndex.value.index1 <= totalRows) {
// 计算点击格子的中心位置 (rpx)
const cellCenterX = (saveEditIndex.value.index0 ) * 234;
const cellCenterY = (saveEditIndex.value.index1 ) * 210;
console.log("!!!!",saveEditIndex.value.index0)
// 计算 scrollLeft 和 scrollTop使格子中心位于可视区域中心
cardLeft.value = cellCenterX - visibleWidth / 2;
scrollTop.value = cellCenterY - visibleHeight / 2;
// 计算网格总宽高
const totalWidth = totalColumns * 234;
const totalHeight = totalRows * 210;
// 限制 scrollLeft 和 scrollTop 在有效范围内
cardLeft.value = Math.max(0, Math.min(cardLeft.value, totalWidth - visibleWidth)) /2;
// scrollTop.value = 0
scrollTop.value = Math.max(0, Math.min(scrollTop.value, totalHeight - visibleHeight)) /2;
console.log("????",cardLeft.value,scrollTop.value)
// console.log("????",scrollLeft.value,scrollTop.value,rpx2px)
}
}
</script>
<style lang="less" scoped>
// 主页的css
@import './index';
</style>