hldy_app/pages/NursingNew/component/nurse/index.vue

2159 lines
62 KiB
Vue
Raw Normal View History

2025-07-23 17:34:48 +08:00
<!-- 护嘱 -->
<template>
<!-- click是让抖动停止 -->
<view class="right-container" :style="isshow?{opacity: `1`}:{opacity: `0`}"
@click="bottomisShaking=false;shakyTable = false">
<!-- 轮盘 -->
2025-08-21 16:51:53 +08:00
<!-- <joystick @movecard="movecard" :getblue="getblue" :moveleft="-300" /> -->
2025-07-23 17:34:48 +08:00
<view class="right-container-title-nav">
2025-07-31 17:26:06 +08:00
<text style="margin-left: 30rpx;">
NUID2508000001
2025-07-23 17:34:48 +08:00
</text>
2025-07-31 17:26:06 +08:00
<text class="new-weight">
护理单元01
2025-07-23 17:34:48 +08:00
</text>
<view class="right-icons">
2025-08-21 16:51:53 +08:00
<view style="display: flex;align-items: center;margin-right: 25rpx;padding: 0 15rpx;"
:class="!topindex&&!bodystatus&&!facestatus?'firsttarget':''">
<view class="mark">
<view style="margin-right: 15rpx;">
体型标签:
</view>
<view class="mark-bgc" v-show="openbody" :style="{opacity:bodydonghua?1:0}">
<view style="margin-top: 40rpx;margin-bottom: 30rpx;;margin-left: 50rpx;font-size: 32rpx;">
<view>
体型标签
</view>
</view>
<view style="display: flex;flex-wrap: wrap;">
<view v-for="(item,index) in nameArray.slice(0,5)" :key="index" @click="addbody(index)">
<view class="tags-father" :class="bodystatustarget===index?'secondtarget':''">
<image class="tags-img"
:src="bodytarget.includes(index)?`/static/index/tagNames/${index}1.png`: `/static/index/tagNames/${index}0.png`" />
<view class="tags-font"
:style="bodytarget.includes(index)?{color:`rgb(54, 159, 239)`}:{}">{{item}}
</view>
</view>
</view>
</view>
</view>
</view>
<view class="marknone" @click="openbody=!openbody;openface=false">
<view v-if="!bodytarget.length" style="margin-top: -3rpx;">
未选择
</view>
<view v-for="(item,index) in bodytarget" :key="index">
<image class="tags-img" style="width: 40rpx;height: 40rpx;margin: 0 10rpx;"
:src="`/static/index/tagNames/${item}0.png`" />
</view>
</view>
<view class="tri-down" @click="openbody=!openbody;openface=false"></view>
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
<view style="display: flex;align-items: center;margin-right: 15rpx;padding: 0 15rpx;"
:class="topindex===1&&!bodystatus&&!facestatus?'firsttarget':''">
<view class="mark">
情绪标签
<view class="mark-bgc" v-show="openface" :style="{opacity:facedonghua?1:0}">
<view style="margin-top: 40rpx;margin-bottom: 30rpx;;margin-left: 50rpx;font-size: 32rpx;">
<view>
情绪标签
</view>
</view>
<view style="display: flex;flex-wrap: wrap;">
<view v-for="(item,index) in nameArray.slice(5,12)" :key="index"
@click="addface(index)">
<view class="tags-father" :class="facestatustarget===index?'secondtarget':''">
<image class="tags-img"
:src="facetarget.includes(index)?`/static/index/tagNames/${index+5}1.png`: `/static/index/tagNames/${index+5}0.png`" />
<view class="tags-font"
:style="facetarget.includes(index)?{color:`rgb(54, 159, 239)`}:{}">{{item}}
</view>
</view>
</view>
</view>
</view>
</view>
<view class="marknone" @click="openface=!openface;openbody=false">
<view v-if="!facetarget.length" style="margin-top: -3rpx;">
未选择
</view>
<view v-for="(item,index) in facetarget" :key="index">
<image class="tags-img" style="width: 40rpx;height: 40rpx;margin: 0 10rpx;"
:src="`/static/index/tagNames/${item+5}0.png`" />
</view>
</view>
<view class="tri-down" @click="openface=!openface;openbody=false"></view>
</view>
<view class="white-button" :class="topindex===2?'firsttarget':''" @click="routerPush">
2025-08-13 17:19:40 +08:00
<image class="white-img" :src="`/static/index/newruler/yulan.png`" />
2025-07-31 17:26:06 +08:00
预览
</view>
2025-08-21 16:51:53 +08:00
<view class="white-button" :class="topindex===3?'firsttarget':''" @click="shareToWeixin">
2025-08-13 17:19:40 +08:00
<image class="white-img" :src="`/static/index/newruler/fenxiang.png`" />
2025-07-31 17:26:06 +08:00
分享
</view>
2025-08-21 16:51:53 +08:00
2025-07-23 17:34:48 +08:00
</view>
</view>
<view class="doctorsay-container-view">
<view class="doctorsay-container-container">
<view class="super-card">
<view class="boom-father">
<view class="boom">
<view :style="{ marginTop: `-${2 *moveDownNumber}rpx` }">
<view v-for="(item,index) in timearr[0].children" :key="index">
2025-08-13 17:19:40 +08:00
<view class="boom-son" v-show="item.typeName">
<text class="boom-text">
{{item.typeName}}
</text>
2025-07-23 17:34:48 +08:00
</view>
</view>
</view>
</view>
</view>
<view class="super-card-container">
2025-08-13 17:19:40 +08:00
<scroll-view style="height: 1330rpx;width: 100%;border: 2rpx solid balck;"
:scroll-left="cardLeft" scroll-x @scroll="handleTop" :show-scrollbar="false">
<view style="display: flex;width:4824rpx;">
2025-07-31 17:26:06 +08:00
<view v-for="(item0,index0) in timearr" :key="index0">
<view class="super-card-time">
{{(item0.positioning.length == 1 ? ('0' + item0.positioning) : item0.positioning) + ":00"}}
2025-07-23 17:34:48 +08:00
</view>
</view>
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
<view style="display: flex;height: calc(100% - 80rpx);position: relative;">
<view class="xian-bian"></view>
2025-08-13 17:19:40 +08:00
<scroll-view style="height: 100%;width:6744rpx;" :scroll-top="scrollTop"
:scroll-y="true" @scroll="handleScrolltime" :show-scrollbar="false">
2025-07-31 17:26:06 +08:00
<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;"
2025-08-13 17:19:40 +08:00
@click="rulerTouchClick(item1,index0,index1)"
2025-07-31 17:26:06 +08:00
@touchstart="rulerTouchStart(item1,index0,index1,$event)"
@touchmove="rulerTouchMove" @touchend="rulerTouchEnd()"
:data-index0="index0" :data-index1="index1">
2025-08-21 16:51:53 +08:00
<view class="time-button-orange-spe"
:style="{left:flyNumber.index0?`-130rpx`:`0`}"
2025-07-31 17:26:06 +08:00
v-if="flyNumber.index0 === index0 && flyNumber.index1 === index1 && index1==0">
请选择服务指令迁移的目标单元格
2025-08-13 17:19:40 +08:00
<!-- <view class="under-button-three"></view> -->
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
<view class="time-button-orange"
:style="{left:flyNumber.index0?`-130rpx`:`0`}"
2025-07-31 17:26:06 +08:00
v-if="flyNumber.index0 === index0 && flyNumber.index1 === index1 && index1">
请选择服务指令迁移的目标单元格
2025-08-13 17:19:40 +08:00
<!-- <view class="under-button-three"></view> -->
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
<view class="time-button-black-spe"
:style="{left:saveEditIndex.index0?`-220rpx`:`0`}"
2025-07-31 17:26:06 +08:00
v-if="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1 && index1==0 && isDelete">
是否确认删除该服务指令
2025-08-13 17:19:40 +08:00
<!-- <view class="under-button-three"></view> -->
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
<view class="time-button-black"
:style="{left:saveEditIndex.index0?`-220rpx`:`0`}"
2025-07-31 17:26:06 +08:00
v-if="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1 && index1 && isDelete">
是否确认删除该服务指令
2025-08-13 17:19:40 +08:00
<!-- <view class="under-button-three"></view> -->
2025-07-31 17:26:06 +08:00
</view>
<view class="title-time-blue"
2025-08-21 16:51:53 +08:00
v-show="saveEditIndex.index0 == index0 && saveEditIndex.index1 == index1 && isRule">
2025-07-31 17:26:06 +08:00
</view>
2025-08-21 16:51:53 +08:00
2025-07-31 17:26:06 +08:00
<view :class="getClass(item1,index0,index1)"
style="font-size: 30rpx;overflow: hidden;"
:style="{ animationDelay:`-${computeDelay(index0, index1).toFixed(2)}s` }">
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
<view class="title-time" v-if="item1.startTime"
v-show=" liang.index0 !== index0 || liang.index1 !== index1 || canmove"
2025-08-13 17:19:40 +08:00
style="flex-direction: column;">
<image v-show="item1.startTime"
style="width: 60rpx;height: 60rpx;margin: 0 auto;margin-top: 30rpx"
src="/static/index/tu.png" />
<view class="title-time-time" style="font-size: 30rpx;">
2025-07-31 17:26:06 +08:00
{{item1.startTime + `-` + item1.endTime}}
2025-07-23 17:34:48 +08:00
</view>
2025-07-31 17:26:06 +08:00
<image class="title-time-button"
2025-08-13 17:19:40 +08:00
style="width: 80rpx;height: 48rpx;"
v-if="item1.cycleType!='日常'"
src="/static/index/newruler/jiao.png" />
<view class="title-time-font"
style="right: 10rpx;top: 5rpx;font-size: 23rpx;"
v-if="item1.cycleType!='日常'">
2025-07-31 17:26:06 +08:00
{{item1.cycleType}}
2025-07-23 17:34:48 +08:00
</view>
2025-07-31 17:26:06 +08:00
</view>
<view v-if="item1.startTime" class="title-time-font-rel">
{{splitString(item1.directiveName)[0]}}
</view>
2025-07-23 17:34:48 +08:00
</view>
</view>
</view>
</view>
</view>
2025-07-31 17:26:06 +08:00
</view>
</scroll-view>
2025-07-23 17:34:48 +08:00
</view>
2025-07-31 17:26:06 +08:00
</scroll-view>
2025-07-23 17:34:48 +08:00
</view>
<view class="right-cards">
2025-08-13 17:19:40 +08:00
<view style="margin-top: 60rpx;margin-left: 30rpx;">
<view class="">
即时指令
</view>
<view
style="width: 30rpx;height: 6rpx;background-color: black;margin-left: 40rpx;margin-top: 3rpx;border-radius: 20rpx;">
</view>
</view>
2025-07-23 17:34:48 +08:00
<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`}">
<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" />
2025-08-13 17:19:40 +08:00
<view class="right-box-font">{{item.name}}</view>
2025-07-23 17:34:48 +08:00
</view>
<view class="super-end-items-father-close-father" v-show="bottomisShaking"
@click.stop="bottomItems.splice(index, 1)">
-
</view>
</view>
</view>
</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"
2025-08-13 17:19:40 +08:00
:style="thirdmenuIndex==index?{border: `2rpx solid rgb(229, 233, 249)`,backgroundColor:`#fff`}:{border: `2rpx solid rgb(229, 233, 249)`}">
<view class="title-time-button-font" v-show="item.cycleType ==='周期护理'">
周期
</view>
<view class="title-time-button-font" v-show="item.cycleType ==='即时护理'">
即时
</view>
2025-07-23 17:34:48 +08:00
<image class="title-time-button" v-show="item.cycleType ==='周期护理'"
2025-08-13 17:19:40 +08:00
src="/static/index/newruler/jiao.png" />
2025-07-23 17:34:48 +08:00
<image class="title-time-button" v-show="item.cycleType ==='即时护理'"
2025-08-13 17:19:40 +08:00
src="/static/index/newruler/jiao.png" />
2025-07-23 17:34:48 +08:00
<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>
2025-08-13 17:19:40 +08:00
<!-- <view class="right-box-items" style="margin-top: 10rpx;">
<image class="right-box-items-button"
src="/static/index/newruler/m1.png" />
<image class="right-box-items-button"
style="width: 30rpx;height: 30rpx;"
src="/static/index/tagNames/0.png" />
<image class="right-box-items-button"
style="width: 30rpx;height: 30rpx;"
src="/static/index/tagNames/1.png" />
<image class="right-box-items-button"
src="/static/index/newruler/m2.png" />
</view> -->
2025-07-23 17:34:48 +08:00
</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">
2025-08-13 17:19:40 +08:00
<view v-for="(item,index) in downList" :key="index">
<view :class="downdonghua==index? `downList-box-target` : `downList-box`"
@click="secondContant(index)">
<!-- <image class="downList-box-img" style="width: 70rpx;height: 70rpx;"
src="/static/index/tu.png" /> -->
2025-08-21 16:51:53 +08:00
<donghua :width="`55rpx`" :height="`55rpx`" :links="item.url"
:playing="downdonghua==index" :interval="120" />
2025-07-23 17:34:48 +08:00
<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)">
2025-08-21 16:51:53 +08:00
<view class="doctorsay-container-card">
2025-08-13 17:19:40 +08:00
<donghua :width="`55rpx`" :height="`55rpx`" :links="item.url"
:playing="index === upmenuIndex" :interval="120" />
2025-07-23 17:34:48 +08:00
<view
:class="(index === upmenuIndex) ? `doctorsay-container-card-font-dark`:`doctorsay-container-card-font`">
{{ item.name }}
</view>
</view>
</view>
</view>
</view>
<view class="under-button">
2025-08-13 17:19:40 +08:00
<view class="under-button-black" v-if="isop">
2025-07-23 17:34:48 +08:00
不能重复添加相同的即时服务指令
2025-08-13 17:19:40 +08:00
<!-- <view class="under-button-three"></view> -->
2025-07-23 17:34:48 +08:00
</view>
<view class="white-circle" @click="changecard">
2025-08-13 17:19:40 +08:00
<image class="white-circle-img"
:src="`/static/index/keyimg/movebutton${isMove ? 'blue' : ''}.png`" />
2025-07-23 17:34:48 +08:00
</view>
<view class="white-circle" @click="openDelete">
2025-08-13 17:19:40 +08:00
<image class="white-circle-img"
:src="`/static/index/keyimg/deletebutton${isDelete ? 'blue' : ''}.png`" />
2025-07-23 17:34:48 +08:00
</view>
<view class="white-circle" @click="opensay">
2025-08-13 17:19:40 +08:00
<image class="white-circle-img"
:src="`/static/index/keyimg/notebutton${sayisopen ? 'blue' : ''}.png`" />
2025-07-23 17:34:48 +08:00
</view>
2025-08-13 17:19:40 +08:00
<view class="white-circle" @click="open = !open">
<image class="white-circle-img"
:src="`/static/index/keyimg/open${open ? 'blue' : ''}.png`" />
</view>
<view style="position: relative;">
2025-08-21 16:51:53 +08:00
<view ref="btnRef" class="white-circle-click-father"
:style="{color:buttonBlue?`#fff`:``}" :class="{ anim: buttonBlue }"
@click="addnewbutton">
2025-08-13 17:19:40 +08:00
<view style="z-index: 999;">
确定
</view>
</view>
2025-08-21 16:51:53 +08:00
<view class="white-circle-click-father-spec" @click="changLeft(5)">
<view class="other-father">
<image style="width: 55rpx;height: 55rpx;"
src="/static/index/newruler/monitor_1.png" />
<view style="z-index: 999;font-size: 25rpx;">
监控
</view>
2025-08-13 17:19:40 +08:00
</view>
2025-08-21 16:51:53 +08:00
2025-07-23 17:34:48 +08:00
</view>
</view>
2025-08-21 16:51:53 +08:00
2025-07-23 17:34:48 +08:00
</view>
</view>
</view>
</view>
</view>
<!-- 点击的弹出层 -->
2025-08-21 16:51:53 +08:00
<view v-show="isopen" class="popup-overlay" @click="isopen=false;flyNumber.index0=999;touchindex1=-1">
2025-08-13 17:19:40 +08:00
<view class="popup-overlay-content" :class="getjiao"
:style="{ top: (2*openY - 350) + 'rpx',left: (2*openX - 780) + 'rpx',opacity: isopacity ? 1 : 0 }"
2025-07-23 17:34:48 +08:00
@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>
2025-08-13 17:19:40 +08:00
<view style="margin-top: 20rpx;margin-bottom: 20rpx;;margin-left: 30rpx;font-size: 32rpx;">
<view>
体型标签
</view>
2025-07-23 17:34:48 +08:00
</view>
2025-08-13 17:19:40 +08:00
<view style="display: flex;flex-wrap: wrap;">
2025-08-21 16:51:53 +08:00
<view v-for="(item,index) in nameArray.slice(0,5)" :key="index">
2025-07-23 17:34:48 +08:00
<view class="tags-father">
2025-08-21 16:51:53 +08:00
<image class="tags-img" :src="`/static/index/tagNames/${index}0.png`" />
2025-07-23 17:34:48 +08:00
<view class="tags-font">{{item}}</view>
</view>
</view>
</view>
2025-08-13 17:19:40 +08:00
<view style="margin-top: 40rpx;margin-bottom: 20rpx;;margin-left: 30rpx;font-size: 32rpx;">
<view>
情绪标签
</view>
2025-07-23 17:34:48 +08:00
</view>
<view style="display: flex;flex-wrap: wrap;">
2025-08-21 16:51:53 +08:00
<view v-for="(item,index) in nameArray.slice(5,12)" :key="index">
2025-07-23 17:34:48 +08:00
<view class="tags-father">
2025-08-21 16:51:53 +08:00
<image class="tags-img" :src="`/static/index/tagNames/${index+5}0.png`" />
2025-07-23 17:34:48 +08:00
<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>
2025-08-21 16:51:53 +08:00
<!-- <view class="share-button" @click="clickshare">
分享
</view> -->
<!-- <image class="share-bgc" src="/static/index/sharebgc.png" /> -->
<view class="share-other">
<view class="share-title">
<image style="width: 50rpx;height: 50rpx;" src="/static/index/sharelogo.png" />
<view style="font-weight: 600;margin-left: 15rpx;">
护理单元
</view>
</view>
<view class="share-others">
<!-- <image class="other-img" src="/static/index/blue.png" />
<view style="margin-left: 50rpx;">
<view style="font-weight: 600;margin-bottom: 20rpx;font-size: 33rpx;">
护理日程分享
</view>
<view style="color: #999999;font-size: 32rpx;">
久泰护理日程分享测试
</view>
</view> -->
<view style="font-weight: 600;font-size: 45rpx;">
护理流程
</view>
<view style="margin-top: 30rpx;">
护理单元01
<text style="color: #1083F8;">
王金凤
</text>
</view>
<view class="blue-button">
分享
</view>
</view>
</view>
<!-- <view class="popup-share-title">
2025-07-23 17:34:48 +08:00
护理日程分享
<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>
2025-08-21 16:51:53 +08:00
</view> -->
2025-07-23 17:34:48 +08:00
</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 { myArray } from './yaoshandiao.js';
2025-08-21 16:51:53 +08:00
// import joystick from '@/component/public/newgame/joysticknew.vue';
2025-08-13 17:19:40 +08:00
2025-07-23 17:34:48 +08:00
const props = defineProps({
isshow: {
type: Boolean,
required: true,
},
darkFans: {
type: Boolean,
},
canmove: {
type: Boolean,
},
liang: {
type: Object,
},
isold: {
type: Boolean,
required: true,
2025-08-21 16:51:53 +08:00
},
propsmove: {
type: Number
},
isMain: {
type: Boolean
2025-07-23 17:34:48 +08:00
}
});
2025-08-21 16:51:53 +08:00
watch(
() => props.isMain,
(newVal, oldVal) => {
// 仅在 isShow 为 true 时生效
if (!props.isshow) return
if (oldVal === true && newVal === false) {
saveEditIndex.value.index0 = 8
saveEditIndex.value.index1 = 0
isRule.value = true
} else if (oldVal === false && newVal === true) {
saveEditIndex.value.index0 = -1
saveEditIndex.value.index1 = -1
}
}
)
2025-07-23 17:34:48 +08:00
watch(
() => props.isold,
() => {
if (props.isold) {
2025-08-21 16:51:53 +08:00
// saveEditIndex.value.index0 = 9;
// saveEditIndex.value.index1 = 0;
2025-07-31 17:26:06 +08:00
centerCell();
2025-07-23 17:34:48 +08:00
cardLeft.value = 1;
scrollTop.value = 1;
nextTick(() => {
scrollTop.value = 0;
2025-08-21 16:51:53 +08:00
cardLeft.value = 700
2025-07-23 17:34:48 +08:00
2025-07-31 17:26:06 +08:00
})
2025-07-23 17:34:48 +08:00
}
})
watch(
() => props.canmove,
() => {
bottomisShaking.value = false;
})
watch(
() => props.isshow,
2025-07-31 17:26:06 +08:00
(newVal, oldVal) => {
// 只有当新旧值不相同时才执行
if (newVal !== oldVal) {
bottomisShaking.value = false
shakyTable.value = false
2025-08-13 17:19:40 +08:00
if (solveWatch.value) {
solveWatch.value--
} else {
2025-08-21 16:51:53 +08:00
// saveEditIndex.value.index0 = 8
// saveEditIndex.value.index1 = 0
2025-07-31 17:26:06 +08:00
centerCell();
cardLeft.value = 1
scrollTop.value = 1
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
nextTick(() => {
scrollTop.value = 0
2025-08-21 16:51:53 +08:00
cardLeft.value = 775
2025-07-31 17:26:06 +08:00
})
}
2025-08-13 17:19:40 +08:00
upmenuIndex.value = 0
getblue.value = !getblue.value
2025-07-31 17:26:06 +08:00
}
}
)
2025-08-21 16:51:53 +08:00
const bodystatus = ref(false);
const bodystatustarget = ref(-1);
const facestatus = ref(false);
const facestatustarget = ref(-1);
watch(
() => props.propsmove,
() => {
if (facestatus.value) {
switch (props.propsmove) {
case 0:
if (facestatustarget.value - 3 > 0) {
facestatustarget.value = facestatustarget.value - 3
} else {
facestatustarget.value = 0
}
break;
case 1:
if (facestatustarget.value > 5) {
} else {
facestatustarget.value++
}
break;
case 2:
if (facestatustarget.value + 3 > 5) {
facestatustarget.value = 6
} else {
facestatustarget.value = facestatustarget.value + 3
}
break;
case 3:
if (facestatustarget.value) {
facestatustarget.value--
}
break;
case 4:
addface(facestatustarget.value)
break;
case 5:
openbody.value = false;
openface.value = false;
facestatus.value = false;
bodystatus.value = false;
topindex.value = 1
break;
}
return
}
if (bodystatus.value) {
switch (props.propsmove) {
case 0:
if (bodystatustarget.value - 3 > 0) {
bodystatustarget.value = bodystatustarget.value - 3
} else {
bodystatustarget.value = 0
}
break;
case 1:
if (bodystatustarget.value > 3) {
} else {
bodystatustarget.value++
}
break;
case 2:
if (bodystatustarget.value + 3 > 3) {
bodystatustarget.value = 4
} else {
bodystatustarget.value = bodystatustarget.value + 3
}
break;
case 3:
if (bodystatustarget.value) {
bodystatustarget.value--
}
break;
case 4:
addbody(bodystatustarget.value)
break;
case 5:
openbody.value = false;
openface.value = false;
facestatus.value = false;
bodystatus.value = false;
topindex.value = 0
break;
}
return
}
if (props.propsmove === 4) {
// if(facestatus.value){
// addface(facestatustarget.value)
// return
// }
// if(bodystatus.value){
// addbody(bodystatustarget.value)
// return
// }
if (!isRule.value) {
switch (topindex.value) {
case 0:
openface.value = false
openbody.value = !openbody.value
bodystatus.value = true;
bodystatustarget.value = 0
break;
case 1:
openbody.value = false
openface.value = !openface.value
facestatus.value = true;
facestatustarget.value = 0
break;
case 2:
routerPush()
break;
default:
shareToWeixin()
break;
}
} else {
addnewbutton()
}
} else {
if (isRule.value) {
movecard(props.propsmove)
} else {
movetop(props.propsmove)
}
}
}
)
const bodydonghua = ref(false)
const openbody = ref(false)
const openface = ref(false)
watch(
() => openbody.value,
() => {
setTimeout(() => {
bodydonghua.value = openbody.value
emit('vip', bodydonghua.value)
}, 50)
}
)
const facedonghua = ref(false)
watch(
() => openface.value,
() => {
setTimeout(() => {
facedonghua.value = openface.value
emit('vip', facedonghua.value)
}, 50)
}
)
const bodytarget = ref([]);
const facetarget = ref([]);
const addbody = (index : number) => {
if (bodytarget.value.includes(index)) {
bodytarget.value = bodytarget.value.filter(item => item !== index)
} else {
if (bodytarget.value.length > 1) {
uni.showToast({
title: "标签最多只能添加两个",
icon: 'none',
duration: 2000
})
// return
} else {
bodytarget.value.push(index)
}
}
}
const addface = (index : number) => {
if (facetarget.value.includes(index)) {
facetarget.value = facetarget.value.filter(item => item !== index)
} else {
if (facetarget.value.length > 1) {
uni.showToast({
title: "标签最多只能添加两个",
icon: 'none',
duration: 2000
})
// return
} else {
facetarget.value.push(index)
}
}
}
2025-08-13 17:19:40 +08:00
const open = ref(false);
const getblue = ref(false);
2025-08-21 16:51:53 +08:00
2025-07-23 17:34:48 +08:00
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 = [
2025-08-21 16:51:53 +08:00
`标准`,
`超重`,
`强直`,
`偏瘫`,
`佝偻`,
`稳定`,
`焦虑`,
`抑郁`,
`暴力`,
`恐惧`,
`烦躁`,
2025-08-13 17:19:40 +08:00
`易怒`,
2025-08-21 16:51:53 +08:00
`臆想`,
2025-07-23 17:34:48 +08:00
]
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 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);
2025-08-21 16:51:53 +08:00
2025-08-13 17:19:40 +08:00
const getjiao = computed(() => {
2025-08-21 16:51:53 +08:00
if (jiao.value[0] && jiao.value[1]) {
2025-08-13 17:19:40 +08:00
return "left-bottom"
2025-08-21 16:51:53 +08:00
} else if (!jiao.value[0] && jiao.value[1]) {
2025-08-13 17:19:40 +08:00
return "right-bottom"
2025-08-21 16:51:53 +08:00
} else if (jiao.value[0] && !jiao.value[1]) {
return "left-top"
} else {
2025-08-13 17:19:40 +08:00
return "right-top"
}
2025-08-21 16:51:53 +08:00
2025-08-13 17:19:40 +08:00
})
2025-08-21 16:51:53 +08:00
2025-07-31 17:26:06 +08:00
onMounted(() => {
2025-08-21 16:51:53 +08:00
downdonghua.value = 0;
2025-07-31 17:26:06 +08:00
})
2025-07-23 17:34:48 +08:00
// 上次点击时间
const lastTap = ref(0)
// 双击的最大间隔ms可根据体验调整
const DOUBLE_TAP_DELAY = 300
function onTap(e) {
const now = Date.now()
2025-08-13 17:19:40 +08:00
thirdmenuIndex.value = e
// console.log("????",thirdmenuIndex.value)
2025-07-23 17:34:48 +08:00
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) {
2025-08-13 17:19:40 +08:00
uni.navigateTo({
url: `/pages/watch/index`
})
2025-07-23 17:34:48 +08:00
return
}
iszhouqi.value = false;
weekIndex.value = -1;
monthIndex.value = -1;
weekValue.value = "";
monthValue.value = "";
secondtop.value = 1
firsttop.value = 1
2025-08-13 17:19:40 +08:00
//这个东西完全是为了给动画用的因为downmenuIndex这个吊东西其他地方在用所以需要再整一个属性。
downdonghua.value = -1;
2025-08-21 16:51:53 +08:00
2025-07-23 17:34:48 +08:00
nextTick(() => {
secondtop.value = 0
firsttop.value = 0
2025-08-13 17:19:40 +08:00
downdonghua.value = 0;
2025-07-23 17:34:48 +08:00
})
2025-08-13 17:19:40 +08:00
downmenuIndex.value = 0;
2025-07-23 17:34:48 +08:00
upmenuIndex.value = index
downList.value = bigArray.value[index].children
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);
2025-08-21 16:51:53 +08:00
const isRule = ref(false);
const savemoved = ref(-1);
2025-07-23 17:34:48 +08:00
const movecard = (where : number) => {
isDelete.value = false;
switch (where) {
case 0:
if (saveEditIndex.value.index1) {
saveEditIndex.value.index1--
2025-07-31 17:26:06 +08:00
centerCell();
2025-08-13 17:19:40 +08:00
isopen.value = false;
if (open.value) {
setTimeout(() => {
rulerTouchClick(timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1], saveEditIndex.value.index0, saveEditIndex.value.index1)
}, 50)
}
2025-08-21 16:51:53 +08:00
} else {
topindex.value = 0
savemoved.value = saveEditIndex.value.index0
isRule.value = false;
2025-07-23 17:34:48 +08:00
}
break
case 1:
if (saveEditIndex.value.index0 == 23) {
return
}
saveEditIndex.value.index0++
2025-07-31 17:26:06 +08:00
centerCell();
2025-08-13 17:19:40 +08:00
isopen.value = false;
if (open.value) {
setTimeout(() => {
rulerTouchClick(timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1], saveEditIndex.value.index0, saveEditIndex.value.index1)
}, 50)
}
2025-07-23 17:34:48 +08:00
break
case 2:
if (saveEditIndex.value.index1 == 11) {
return
}
saveEditIndex.value.index1++
2025-07-31 17:26:06 +08:00
centerCell();
2025-08-13 17:19:40 +08:00
isopen.value = false;
if (open.value) {
setTimeout(() => {
rulerTouchClick(timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1], saveEditIndex.value.index0, saveEditIndex.value.index1)
}, 50)
}
2025-07-23 17:34:48 +08:00
break
case 3:
if (saveEditIndex.value.index0 == 0) {
return
}
saveEditIndex.value.index0--
2025-07-31 17:26:06 +08:00
centerCell();
2025-08-13 17:19:40 +08:00
isopen.value = false;
if (open.value) {
setTimeout(() => {
rulerTouchClick(timearr.value[saveEditIndex.value.index0].children[saveEditIndex.value.index1], saveEditIndex.value.index0, saveEditIndex.value.index1)
}, 50)
}
2025-07-23 17:34:48 +08:00
break
}
}
2025-08-21 16:51:53 +08:00
const topindex = ref(-1)
const movetop = (where : number) => {
isDelete.value = false;
switch (where) {
case 0:
// savemoved.value
break
case 1:
if (topindex.value < 3) {
topindex.value++
}
break
case 2:
openbody.value = false
openface.value = false
topindex.value = -1
saveEditIndex.value.index0 = savemoved.value
isRule.value = true;
break
case 3:
if (topindex.value) {
topindex.value--
}
break
}
}
2025-07-23 17:34:48 +08:00
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 = () => {
2025-08-13 17:19:40 +08:00
flyNumber.value.index0 = -1
flyNumber.value.index1 = -1
isMove.value = false;
2025-07-23 17:34:48 +08:00
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';
}
2025-08-13 17:19:40 +08:00
// 通用的生成函数
function genPaths(base, prefix, count, ext = 'png', startIndex = 0, pad = false) {
return Array.from({ length: count }, (_, i) => {
const idx = pad
? String(i + startIndex).padStart(2, '0')
: i + startIndex
return `${base}/${prefix}${idx}.${ext}`
})
}
2025-07-23 17:34:48 +08:00
// 初始化下面侧单列表
2025-08-13 17:19:40 +08:00
const doctorsayList = ref([
{
url: genPaths(
'/static/index/newruler',
'daily_',
6, // 张数
'png',
1, // 起始索引
false // 不补零
), name: '日常'
},
{
url: genPaths(
'/static/index/newruler',
'clean_',
8, // 张数
'png',
1, // 起始索引
false // 不补零
), name: '清洁'
},
{
url: genPaths(
'/static/index/newruler',
'diet_',
7, // 张数
'png',
1, // 起始索引
false // 不补零
), name: '饮食'
},
{
url: genPaths(
'/static/index/newruler',
'sleep_',
5, // 张数
'png',
1, // 起始索引
false // 不补零
), name: '睡眠'
},
{
url: genPaths(
'/static/index/newruler',
'defecate_',
5, // 张数
'png',
1, // 起始索引
false // 不补零
), name: '排泻'
},
// {
// url: genPaths(
// '/static/index/newruler/monitor_4',
// 'monitor_',
// 4, // 张数
// 'png',
// 1, // 起始索引
// false // 不补零
// ), name: '影像'
// },
2025-07-23 17:34:48 +08:00
]);
2025-08-13 17:19:40 +08:00
// 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: '影像' },
// ]);
2025-07-23 17:34:48 +08:00
// 当前选中的菜单索引
2025-08-13 17:19:40 +08:00
const upmenuIndex = ref<number>(1);
2025-07-23 17:34:48 +08:00
const downmenuIndex = ref<number>(0);
2025-08-13 17:19:40 +08:00
const downdonghua = ref(-1);
2025-07-23 17:34:48 +08:00
const thirdmenuIndex = ref<number>(0);
// 暗黑模式
const underFans = ref<boolean>(false);
// 当前选中的菜单索引
const roomTar = ref<number[]>([]);
2025-08-21 16:51:53 +08:00
const emit = defineEmits(['vip', 'changeold']);
2025-07-23 17:34:48 +08:00
const isEdit = ref(false);
// const isLunpan = ref(false);
2025-07-31 17:26:06 +08:00
const saveEditIndex = ref({
2025-08-21 16:51:53 +08:00
index0: -1,
index1: -1
2025-07-31 17:26:06 +08:00
})
2025-07-23 17:34:48 +08:00
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;
2025-08-13 17:19:40 +08:00
downdonghua.value = index;
2025-07-23 17:34:48 +08:00
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:");
}
});
}
2025-08-21 16:51:53 +08:00
const jiao = ref([false, false])
2025-07-23 17:34:48 +08:00
//表格点击开始
2025-08-13 17:19:40 +08:00
const rulerTouchClick = (item : any, index0 : number, index1 : number) => {
2025-07-23 17:34:48 +08:00
if (item.directiveName) {
touchindex1.value = index1;
const query = uni.createSelectorQuery()
query
.selectAll('.super-card-time-card')
.boundingClientRect((data : any) => {
data.forEach(async (res : any) => {
// 根据你的条件筛选元素
2025-08-13 17:19:40 +08:00
if (res.left > 100 && res.left < 1067 && res.top < 670 && res.top > 50 && res.dataset.index0 == index0 && res.dataset.index1 == index1) {
2025-07-23 17:34:48 +08:00
if (res.left > 100 && res.left < 500) {
// 表格太靠左侧,修改到右面
2025-08-21 16:51:53 +08:00
openX.value = Math.floor(res.left) + 528;
2025-08-13 17:19:40 +08:00
jiao.value[0] = true
2025-07-23 17:34:48 +08:00
} else {
2025-08-21 16:51:53 +08:00
openX.value = Math.floor(res.left) - 18
2025-08-13 17:19:40 +08:00
jiao.value[0] = false
2025-07-23 17:34:48 +08:00
}
2025-08-21 16:51:53 +08:00
if (res.top > 500) {
2025-07-23 17:34:48 +08:00
// 表格太靠上侧,修改到下面
2025-08-13 17:19:40 +08:00
openY.value = Math.floor(res.top) + 100;
jiao.value[1] = true
2025-07-23 17:34:48 +08:00
} else {
2025-08-13 17:19:40 +08:00
openY.value = Math.floor(res.top) + 180
jiao.value[1] = false
2025-07-23 17:34:48 +08:00
}
// 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;
}
}
2025-07-31 17:26:06 +08:00
2025-07-23 17:34:48 +08:00
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 有值
}
}
const scrollContainer = ref(null)
const opensay = () => {
sayisopacity.value = false;
sayisopen.value = true;
setTimeout(() => {
sayisopacity.value = true
}, 50)
}
2025-08-13 17:19:40 +08:00
const buttonBlue = ref(false)
let animTimer = null
async function addnewbutton() {
// 清定时器(防止残留)
if (animTimer) {
clearTimeout(animTimer)
animTimer = null
}
2025-08-21 16:51:53 +08:00
2025-08-13 17:19:40 +08:00
// 先把状态设为 false等待 DOM 更新后再设为 true —— 达到重启动画的效果
buttonBlue.value = false
await nextTick() // 等待下一帧,确保样式被移除
// 重新打开动画
buttonBlue.value = true
addnew()
// 1s 后还原(与动画时长保持一致)
animTimer = setTimeout(() => {
buttonBlue.value = false
animTimer = null
}, 1000)
}
onBeforeUnmount(() => {
if (animTimer) clearTimeout(animTimer)
})
2025-07-23 17:34:48 +08:00
const addnew = () => {
2025-08-21 16:51:53 +08:00
if (saveEditIndex.value.index1 === -1 && saveEditIndex.value.index0 === -1) {
return
}
2025-07-23 17:34:48 +08:00
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;
2025-08-13 17:19:40 +08:00
if (bottomItems.value.length && bottomItems.value[0].target === "#03a4ff") {
2025-07-23 17:34:48 +08:00
bottomItems.value[0].target = "#fff"
clearTimeout(cleansettimeout.value);
}
bottomItems.value.unshift({
name: allobject.title,
url: "/static/index/ou.png",
2025-08-13 17:19:40 +08:00
target: `#03a4ff`,
2025-07-23 17:34:48 +08:00
id: allobject.id
})
// 实现即时指令动画
cleansettimeout.value = setTimeout(() => {
bottomItems.value[0].target = `#fff`;
}, 1500)
} else {
clearTimeout(cleansettimeoutrel.value);
isop.value = true;
cleansettimeoutrel.value = setTimeout(() => {
isop.value = false;
2025-08-13 17:19:40 +08:00
}, 1500)
2025-07-23 17:34:48 +08:00
}
})
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;
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
})
2025-07-31 17:26:06 +08:00
const solveWatch = ref(0)
2025-07-23 17:34:48 +08:00
const whereEvent = (data : any) => {
2025-07-31 17:26:06 +08:00
saveEditIndex.value.index0 = data.index0;
saveEditIndex.value.index1 = data.index1;
centerCell();
2025-07-23 17:34:48 +08:00
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 个
2025-07-31 17:26:06 +08:00
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
}))
}))
)
2025-07-23 17:34:48 +08:00
onShow(() => {
bigArray.value = myArray
downList.value = bigArray.value[0].children
2025-07-31 17:26:06 +08:00
uni.$on('where', findback);
2025-07-23 17:34:48 +08:00
})
onHide(() => {
2025-07-31 17:26:06 +08:00
uni.$off('where', findback);
2025-07-23 17:34:48 +08:00
});
2025-08-13 17:19:40 +08:00
function findback(data : any) {
2025-07-31 17:26:06 +08:00
solveWatch.value = 3;
whereEvent(data)
}
2025-07-23 17:34:48 +08:00
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;
}
2025-07-31 17:26:06 +08:00
const totalColumns = 24; // 总列数
const totalRows = 11; // 总行数
2025-08-21 16:51:53 +08:00
const visibleWidth = 1300; // 可视区域宽度 (rpx),基于 scalcType * widthType ≈ 2220
2025-08-13 17:19:40 +08:00
const visibleHeight = 500; // 可视区域高度 (rpx)假设显示约5行时 heightType = 102.5
2025-07-31 17:26:06 +08:00
function centerCell() {
if (saveEditIndex.value.index0 >= 0 && saveEditIndex.value.index0 <= totalColumns && saveEditIndex.value.index1 >= 0 && saveEditIndex.value.index1 <= totalRows) {
// 计算点击格子的中心位置 (rpx)
2025-08-21 16:51:53 +08:00
const cellCenterX = (saveEditIndex.value.index0 + 0.5) * 259;
2025-08-13 17:19:40 +08:00
const cellCenterY = (saveEditIndex.value.index1 - 1) * 250.5;
2025-07-31 17:26:06 +08:00
// 计算 scrollLeft 和 scrollTop使格子中心位于可视区域中心
cardLeft.value = cellCenterX - visibleWidth / 2;
scrollTop.value = cellCenterY - visibleHeight / 2;
// 计算网格总宽高
2025-08-21 16:51:53 +08:00
const totalWidth = totalColumns * 259;
2025-08-13 17:19:40 +08:00
const totalHeight = totalRows * 250.5;
2025-07-31 17:26:06 +08:00
// 限制 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;
}
}
2025-07-23 17:34:48 +08:00
</script>
<style lang="less" scoped>
// 主页的css
@import './index';
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
.right-container-title-nav {
margin-top: 60rpx;
display: flex;
align-items: center;
height: 60rpx;
position: relative;
font-size: 28rpx;
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
.new-weight {
margin-left: 30rpx;
font-weight: 600;
}
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
.right-icons {
position: absolute;
right: 0;
2025-08-13 17:19:40 +08:00
top: 0;
2025-07-31 17:26:06 +08:00
display: flex;
align-items: center;
2025-08-13 17:19:40 +08:00
margin-top: 10rpx;
2025-07-31 17:26:06 +08:00
}
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
.doctorsay-container-share {
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
color: #fff;
display: flex;
justify-content: center;
align-items: center;
padding: 10rpx 20rpx;
border-radius: 20rpx;
font-size: 27rpx;
margin-left: 10rpx;
}
2025-08-13 17:19:40 +08:00
2025-07-31 17:26:06 +08:00
.doctorsay-container-juzhen {
background: linear-gradient(to right bottom, #00c9ff, #0076ff);
color: #fff;
display: flex;
justify-content: center;
align-items: center;
padding: 10rpx 20rpx;
border-radius: 20rpx;
font-size: 27rpx;
margin: 0 20rpx;
}
2025-07-23 17:34:48 +08:00
}
2025-08-13 17:19:40 +08:00
.balck-icon {
width: 50rpx;
height: 50rpx;
margin-top: 10rpx;
// opacity: 0.5;
margin-right: 20rpx;
// background-color: #fff;
border-radius: 50%;
}
.white-button {
width: 160rpx;
height: 70rpx;
border-radius: 40rpx;
background-color: #E6E7EB;
margin-left: 20rpx;
margin-top: 10rpx;
display: flex;
justify-content: center;
align-items: center;
.white-img {
width: 35rpx;
height: 35rpx;
margin-right: 10rpx;
}
}
2025-08-21 16:51:53 +08:00
.left-top {
border-top-left-radius: 0 !important;
}
.right-top {
border-top-right-radius: 0 !important;
}
.left-bottom {
border-bottom-left-radius: 0 !important
}
.right-bottom {
border-bottom-right-radius: 0 !important;
}
.mark {
font-size: 29rpx;
position: relative;
}
.marknone {
font-size: 29rpx;
// margin-top: 8rpx;
color: #999;
display: flex;
// align-items: center;
margin-top: 5rpx;
}
.tri-down {
width: 0;
height: 0;
border-left: 10rpx solid transparent;
/* s/2 */
border-right: 10rpx solid transparent;
/* s/2 */
border-top: 17.32rpx solid #999;
/* 0.866 * s */
margin: 0rpx 0rpx 0 15rpx;
2025-08-13 17:19:40 +08:00
}
2025-08-21 16:51:53 +08:00
.mark-bgc {
position: absolute;
top: 50rpx;
left: 0;
width: 450rpx;
background-color: #fff;
z-index: 999;
border-radius: 30rpx;
padding-bottom: 30rpx;
transition: opacity 0.3s ease;
2025-08-13 17:19:40 +08:00
}
2025-08-21 16:51:53 +08:00
.blue-button {
margin-top: 60rpx;
width: 150rpx;
height: 70rpx;
border-radius: 40rpx;
display: flex;
justify-content: center;
align-items: center;
color: #007CFF;
font-size: 30rpx;
background: linear-gradient(to bottom, #e7f4ff, #c5e5ff);
border: 2rpx solid #9AD1FF;
2025-08-13 17:19:40 +08:00
}
2025-08-21 16:51:53 +08:00
.zerotarget {
--color: #99C9FD;
--thick: 2px;
--radius: 50rpx;
--outline-offset: 0rpx;
/* 外扩多少 */
/* 内层虚线(你现在用的) */
border-radius: var(--radius);
background-color: white;
/* 内部背景 */
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
/* 外层虚线:放在 outline不会影响元素尺寸 */
outline: var(--thick) dashed var(--color);
outline-offset: var(--outline-offset);
/* 保证文本 / 子元素在最上层 */
position: relative;
z-index: 0;
}
.firsttarget {
--color: #99C9FD;
--thick: 2px;
--radius: 50rpx;
--outline-offset: 10rpx;
/* 外扩多少 */
/* 内层虚线(你现在用的) */
border-radius: var(--radius);
// background-color: white;
/* 内部背景 */
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
/* 外层虚线:放在 outline不会影响元素尺寸 */
outline: var(--thick) dashed var(--color);
outline-offset: var(--outline-offset);
/* 保证文本 / 子元素在最上层 */
position: relative;
z-index: 0;
z-index: 999;
}
.secondtarget {
--color: #99C9FD;
--thick: 2px;
--radius: 10rpx;
--outline-offset: 0rpx;
/* 外扩多少 */
/* 内层虚线(你现在用的) */
border-radius: var(--radius);
// background-color: white;
/* 内部背景 */
animation: scalePulse 360ms cubic-bezier(.2, .8, .2, 1);
/* 外层虚线:放在 outline不会影响元素尺寸 */
outline: var(--thick) dashed var(--color);
outline-offset: var(--outline-offset);
/* 保证文本 / 子元素在最上层 */
position: relative;
z-index: 0;
z-index: 999;
}
.xian-bian {
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 999;
border-right: 1rpx solid transparent;
border-image: repeating-linear-gradient(180deg, #A9ACB1 0px, #A9ACB1 6rpx, transparent 6rpx, transparent 12rpx) 1;
2025-08-13 17:19:40 +08:00
}
2025-07-23 17:34:48 +08:00
</style>