Compare commits
2 Commits
541c53ab4e
...
ca4dadee94
| Author | SHA1 | Date |
|---|---|---|
|
|
ca4dadee94 | |
|
|
94568a397f |
|
|
@ -1,18 +0,0 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/request/index.js'
|
||||
|
||||
|
||||
//获得列表
|
||||
export const getCardList = () => {
|
||||
return request({
|
||||
url: `${uni.getStorageSync('serverUrl')}/api/pad/baseInfo/queryPadPageList?token=${uni.getStorageSync('token')}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
// 根据nuid获得卡片
|
||||
export const getqueryinfoByBuId = (nuId) => {
|
||||
return request({
|
||||
url: `${uni.getStorageSync('serverUrl')}/api/pad/baseInfo/queryinfoByBuId?nuId=${nuId}`,
|
||||
method: 'get',
|
||||
})
|
||||
}
|
||||
|
|
@ -1,176 +0,0 @@
|
|||
<template>
|
||||
<view class="index-content-other" v-show="isShow" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="index-content-right">
|
||||
<view class="index-content-title">
|
||||
<view class="shu"></view>
|
||||
<view class="shu-font">长春市朝阳区久泰开运养老服务有限公司</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="saomiao">
|
||||
<view class="big-ball">
|
||||
<view class="ball">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<image class="left-img" src="@/static/click.png" />
|
||||
<input class="saoma-input" :password="false" v-model="uuid" placeholder="请手动录入NUID" />
|
||||
<image v-show="uuid" class="right-img" src="@/static/x.png" @click="uuid=''" />
|
||||
<view class="blue-button">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="index-content-down">
|
||||
长春市朝阳区久泰开运养老服务有限公司
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
// getqueryinfoByBuId
|
||||
|
||||
const emit = defineEmits(['nav'])
|
||||
const props = defineProps({ isShow: { type: Boolean, required: true } })
|
||||
|
||||
const transition = ref(true)
|
||||
const uuid = ref("")
|
||||
|
||||
// 区分首次渲染与动态添加
|
||||
watch(
|
||||
() => props.isShow,
|
||||
(newVal, oldVal) => {
|
||||
if (!oldVal && newVal) {
|
||||
transition.value = false
|
||||
setTimeout(() => (transition.value = true), 50)
|
||||
|
||||
}
|
||||
}
|
||||
)
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.index-content-other {
|
||||
width: calc(100% - 170rpx);
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-content-down {
|
||||
width: calc(100% - 60rpx);
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.index-content-right {
|
||||
// height: calc(100% - 100rpx);
|
||||
height: calc(100% - 30rpx);
|
||||
width: calc(100% - 60rpx);
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
background-image: url('/static/index/leida/bgc.png');
|
||||
background-position: 30% 70%;
|
||||
border-radius: 50rpx;
|
||||
// box-shadow: 4rpx 8rpx 16rpx 4rpx rgba(0, 0, 0, 0.3);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.index-content-title {
|
||||
position: absolute;
|
||||
top: 60rpx;
|
||||
left: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.shu {
|
||||
width: 20rpx;
|
||||
height: 50rpx;
|
||||
background: linear-gradient(to right, #0052C2, #00B4FF);
|
||||
border-radius: 20rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.shu-font {
|
||||
color: #415273;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.saomiao {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
display: flex;
|
||||
|
||||
.saoma-input {
|
||||
background-color: #fff;
|
||||
width: 550rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 30rpx;
|
||||
padding-left: 100rpx;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.left-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 30rpx;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.right-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 220rpx;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
.blue-button {
|
||||
// margin-top: 20rpx;
|
||||
margin-left: 30rpx;
|
||||
width: 170rpx;
|
||||
height: 90rpx;
|
||||
border-radius: 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
||||
}
|
||||
|
||||
.big-ball {
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: -55rpx;
|
||||
transform: translateY(-50%);
|
||||
border-radius: 50%;
|
||||
background-color: rgb(219, 228, 246);
|
||||
|
||||
.ball {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: 50%;
|
||||
background-color: rgb(207,221,241);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,567 +0,0 @@
|
|||
<template>
|
||||
<view class="index-content-other" v-show="isShow" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="index-content-right">
|
||||
<view class="index-content-title">
|
||||
<view class="shu"></view>
|
||||
<view class="shu-font">长春市朝阳区久泰开运养老服务有限公司</view>
|
||||
</view>
|
||||
|
||||
<view class="leida">
|
||||
<view class="kutong-father">
|
||||
<image class="kutong-img" src="@/static/index/leida/leidabgc.png" />
|
||||
<image class="kutong-shan" :class="progress < 1 ? 'spin-anim' : 'no-anim'"
|
||||
src="@/static/index/leida/shan.png" />
|
||||
<view class="huan">
|
||||
<view class="quarter-ring" :class="progress < 1 ? 'spin-anim-spec' : 'no-anim-spec'" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="jindutiao">
|
||||
<view class="progress-fill" :style="{ transform: `scaleX(${progress})` }" />
|
||||
</view>
|
||||
<view class="color-font" style="margin-top: 80rpx;">
|
||||
{{ progress >= 1 ? "扫描完成。" : "正在使用雷达区域扫描护理机构," }}
|
||||
</view>
|
||||
<view class="color-font">{{ progress >= 1 ? "" : "请稍后..." }}</view>
|
||||
<view class="agagin-button" @click="again">重新扫描</view>
|
||||
</view>
|
||||
|
||||
<view class="other">
|
||||
<scroll-view ref="scrollViewRef" scroll-y class="other-father" :scroll-top="scrollTop">
|
||||
<view class="card-father">
|
||||
<view class="card" v-for="(allitem, allindex) in cardarray" :key="allindex"
|
||||
:class="{ 'fade-in': allitem.isNew }" @animationend="onAnimEnd(allitem)">
|
||||
<view class="card-title">
|
||||
<view style="font-size: 25rpx;">NUID:{{allitem.nuId}}</view>
|
||||
<view class="right-box">护理单元</view>
|
||||
</view>
|
||||
<view class="card-middle">
|
||||
<view class="video-box" @click="renamenummber=-1">
|
||||
<image class="video-box-img" src="@/static/index/leida/video.png" />
|
||||
</view>
|
||||
<view>
|
||||
<view v-for="(item,index) in allitem.menu" :key="index"
|
||||
@click="item.target=!item.target;renamenummber=-1">
|
||||
<view class="small-menu">
|
||||
<image class="small-img" :src="item.target?item.targetUrl:item.url" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-bottom">
|
||||
{{allitem.nuName}}
|
||||
<image class="bottom-img" src="@/static/index/leida/rename.png"
|
||||
@click="renamenummber=allindex;savevalue=allitem.nuName" />
|
||||
</view>
|
||||
<view class="rename-father" v-if="renamenummber==allindex">
|
||||
<view class="rename-title">
|
||||
重命名
|
||||
</view>
|
||||
<view class="rename-gray">
|
||||
NUID:20241001001
|
||||
</view>
|
||||
<view class="rename-input">
|
||||
<image class="left-img" src="@/static/index/click.png" />
|
||||
<input class="uni-input" placeholder="请重新命名" v-model="savevalue" />
|
||||
<image v-show="savevalue" class="right-img" src="@/static/index/quxiao.png"
|
||||
@click="savevalue=``" />
|
||||
</view>
|
||||
<view class="blue-button" @click="changename(savevalue,allindex)">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="index-content-down">
|
||||
长春市朝阳区久泰开运养老服务有限公司
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
import { getCardList } from "./api.js"
|
||||
// import { throttle } from '@/component/public/throttle.js'
|
||||
|
||||
// const getCardListThrottled = throttle(getCardList(), 1000)
|
||||
const emit = defineEmits(['nav'])
|
||||
const props = defineProps({ isShow: { type: Boolean, required: true } })
|
||||
const savevalue = ref("");
|
||||
|
||||
const renamenummber = ref(-1)
|
||||
const transition = ref(true)
|
||||
const progress = ref(1)
|
||||
const scrollTop = ref(0)
|
||||
const scrollViewRef = ref(null)
|
||||
const rightbutton = ref([
|
||||
{ url: '/static/index/leida/00.png', targetUrl: '/static/index/leida/01.png', target: false },
|
||||
{ url: '/static/index/leida/10.png', targetUrl: '/static/index/leida/11.png', target: false },
|
||||
{ url: '/static/index/leida/20.png', targetUrl: '/static/index/leida/21.png', target: false },
|
||||
{ url: '/static/index/leida/30.png', targetUrl: '/static/index/leida/31.png', target: false }
|
||||
])
|
||||
const cardarray = ref<Array<{ menu : any; isNew : boolean; nuName : string }>>([])
|
||||
const relArray = ref([]);
|
||||
|
||||
// 区分首次渲染与动态添加
|
||||
watch(
|
||||
() => props.isShow,
|
||||
(newVal, oldVal) => {
|
||||
if (!oldVal && newVal) {
|
||||
transition.value = false
|
||||
setTimeout(() => (transition.value = true), 50)
|
||||
getCardList().then(res => {
|
||||
res.result.records.forEach((element : any) => {
|
||||
element.menu = JSON.parse(JSON.stringify(rightbutton.value))
|
||||
element.isNew = true
|
||||
})
|
||||
relArray.value = res.result.records
|
||||
console.log("????", relArray.value)
|
||||
again()
|
||||
})
|
||||
}
|
||||
}
|
||||
)
|
||||
|
||||
// 随机生成并逐个添加卡片
|
||||
function suiji() {
|
||||
const n = relArray.value.length
|
||||
// console.log("?????",relArray.value)
|
||||
cardarray.value = []
|
||||
const randomWeights = Array.from({ length: n }, () => Math.random())
|
||||
const totalWeight = randomWeights.reduce((a, b) => a + b, 0)
|
||||
const intervals = randomWeights.map((w) => (w / totalWeight) * 5000)
|
||||
let cumulative = 0
|
||||
for (let i = 0; i < n; i++) {
|
||||
cumulative += intervals[i]
|
||||
setTimeout(async () => {
|
||||
cardarray.value.push(relArray.value[i])
|
||||
// 当卡片总数为 5,7,9,... 时滚动到底部
|
||||
const len = cardarray.value.length
|
||||
if (len >= 5 && len % 2 === 1) {
|
||||
scrollTop.value = 999
|
||||
await nextTick()
|
||||
scrollTop.value = 99999
|
||||
}
|
||||
}, cumulative)
|
||||
}
|
||||
}
|
||||
|
||||
function again() {
|
||||
if(progress.value == 1){
|
||||
renamenummber.value = -1
|
||||
suiji()
|
||||
progress.value = 0
|
||||
const timer = setInterval(() => {
|
||||
progress.value += 0.01
|
||||
if (progress.value >= 1) {
|
||||
progress.value = 1
|
||||
clearInterval(timer)
|
||||
}
|
||||
|
||||
|
||||
}, 50)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// 监听动画结束,清除标记
|
||||
function onAnimEnd(item : { isNew : boolean }) {
|
||||
item.isNew = false
|
||||
}
|
||||
|
||||
const changename = (name, index) => {
|
||||
if (name) {
|
||||
cardarray.value[index].nuName = name;
|
||||
}
|
||||
renamenummber.value = -1
|
||||
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.index-content-other {
|
||||
width: calc(100% - 170rpx);
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-content-down {
|
||||
width: calc(100% - 60rpx);
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.index-content-right {
|
||||
// height: calc(100% - 100rpx);
|
||||
height: calc(100% - 30rpx);
|
||||
width: calc(100% - 60rpx);
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
background-image: url('/static/index/leida/bgc.png');
|
||||
background-position: 30% 70%;
|
||||
border-radius: 50rpx;
|
||||
// box-shadow: 4rpx 8rpx 16rpx 4rpx rgba(0, 0, 0, 0.3);
|
||||
display: flex;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.leida {
|
||||
margin-top: 30rpx;
|
||||
height: 100%;
|
||||
width: 35%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.kutong-father {
|
||||
width: 300rpx;
|
||||
height: 450rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.kutong-img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
}
|
||||
|
||||
.kutong-shan {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 150rpx;
|
||||
height: 206rpx;
|
||||
transform-origin: 100% 73%;
|
||||
}
|
||||
|
||||
.spin-anim {
|
||||
animation: spin 2s linear infinite;
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
.no-anim {
|
||||
animation: spin 2s linear infinite;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.spin-anim-spec {
|
||||
animation: spinx 2s linear infinite;
|
||||
animation-play-state: running;
|
||||
}
|
||||
|
||||
.no-anim-spec {
|
||||
animation: spinx 2s linear infinite;
|
||||
animation-play-state: paused;
|
||||
}
|
||||
|
||||
.huan {
|
||||
position: absolute;
|
||||
top: -65rpx;
|
||||
left: -65rpx;
|
||||
width: 430rpx;
|
||||
height: 430rpx;
|
||||
border: 20rpx solid rgb(206, 220, 245);
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.quarter-ring {
|
||||
position: absolute;
|
||||
top: -5%;
|
||||
left: -5%;
|
||||
width: 110%;
|
||||
height: 110%;
|
||||
box-sizing: border-box;
|
||||
border: 20rpx solid transparent;
|
||||
border-top-color: rgb(3, 169, 255);
|
||||
border-radius: 50%;
|
||||
transform: rotate(0deg);
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.jindutiao {
|
||||
width: 400rpx;
|
||||
border-radius: 20rpx;
|
||||
height: 20rpx;
|
||||
background-color: #a6c9fa;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.progress-fill {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
||||
transform-origin: left center;
|
||||
will-change: transform;
|
||||
transition: transform 0.05s linear;
|
||||
}
|
||||
|
||||
.color-font {
|
||||
color: #415273;
|
||||
margin-top: 20rpx;
|
||||
height: 20rpx;
|
||||
}
|
||||
|
||||
.agagin-button {
|
||||
width: 240rpx;
|
||||
height: 90rpx;
|
||||
margin-top: 80rpx;
|
||||
border-radius: 35rpx;
|
||||
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.other {
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.other-father {
|
||||
margin-top: 150rpx;
|
||||
height: calc(100% - 150rpx);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.card-father {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.card {
|
||||
width: 45%;
|
||||
margin-left: 3%;
|
||||
height: 530rpx;
|
||||
box-shadow: 2rpx 4rpx 8rpx 2rpx rgba(0, 0, 0, 0.3);
|
||||
background-color: #fff;
|
||||
border-radius: 30rpx;
|
||||
margin-bottom: 35rpx;
|
||||
padding: 0 25rpx;
|
||||
position: relative;
|
||||
|
||||
.rename-father {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 550rpx;
|
||||
height: 350rpx;
|
||||
border-radius: 30rpx;
|
||||
box-shadow: 2rpx 4rpx 8rpx 2rpx rgba(0, 0, 0, 0.3);
|
||||
background-color: #fff;
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 30rpx;
|
||||
|
||||
.rename-title {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
border-bottom: 2rpx solid rgb(245, 245, 245);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rename-gray {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
// justify-content: center;
|
||||
color: rgb(167, 167, 167);
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rename-input {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
display: flex;
|
||||
background-color: rgb(245, 246, 250);
|
||||
border-radius: 20rpx;
|
||||
color: rgb(167, 167, 167);
|
||||
align-items: center;
|
||||
padding: 0 20rpx;
|
||||
position: relative;
|
||||
|
||||
.uni-input {
|
||||
font-size: 25rpx;
|
||||
}
|
||||
|
||||
.left-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
margin-right: 15rpx;
|
||||
}
|
||||
|
||||
.right-img {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-title {
|
||||
width: 100%;
|
||||
height: 130rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.card-middle {
|
||||
width: 100%;
|
||||
height: 320rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.video-box {
|
||||
width: 82%;
|
||||
height: 320rpx;
|
||||
background-color: #E5ECFA;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
|
||||
.video-box-img {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
/* 旋转动画 */
|
||||
@keyframes spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spinx {
|
||||
from {
|
||||
transform: rotate(-70deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(290deg);
|
||||
}
|
||||
}
|
||||
|
||||
/* 新卡片淡入动画 */
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(10rpx);
|
||||
}
|
||||
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.fade-in {
|
||||
animation: fadeIn 0.4s ease-out forwards;
|
||||
}
|
||||
|
||||
.index-content-title {
|
||||
position: absolute;
|
||||
top: 60rpx;
|
||||
left: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.shu {
|
||||
width: 20rpx;
|
||||
height: 50rpx;
|
||||
background: linear-gradient(to right, #0052C2, #00B4FF);
|
||||
border-radius: 20rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.shu-font {
|
||||
color: #415273;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.right-box {
|
||||
background: rgb(0, 171, 255);
|
||||
width: 160rpx;
|
||||
height: 65rpx;
|
||||
border-radius: 20rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.small-menu {
|
||||
width: 75rpx;
|
||||
height: 73rpx;
|
||||
border-radius: 20rpx;
|
||||
background-color: #E7ECFA;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 10rpx;
|
||||
|
||||
.small-img {
|
||||
height: 50rpx;
|
||||
width: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.card-bottom {
|
||||
margin-top: 17rpx;
|
||||
margin-left: 10rpx;
|
||||
display: flex;
|
||||
|
||||
.bottom-img {
|
||||
width: 38rpx;
|
||||
height: 38rpx;
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.blue-button {
|
||||
margin-top: 20rpx;
|
||||
width: 180rpx;
|
||||
height: 70rpx;
|
||||
border-radius: 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
background: linear-gradient(to bottom, #00C9FF, #0076FF);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,187 +0,0 @@
|
|||
<template>
|
||||
<view class="index-content-other" v-show="isShow" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="index-content-right">
|
||||
<view class="index-content-title">
|
||||
<view class="shu"></view>
|
||||
<view class="shu-font">长春市朝阳区久泰开运养老服务有限公司</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="saomiao" @click="onScan">
|
||||
<view class="saomiao-son">
|
||||
<view class="saomiao-son-son">
|
||||
<view class="saomiao-son-son-img">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
|
||||
const emit = defineEmits(['nav'])
|
||||
const props = defineProps({ isShow: { type: Boolean, required: true } })
|
||||
|
||||
const transition = ref(true)
|
||||
|
||||
|
||||
// 区分首次渲染与动态添加
|
||||
watch(
|
||||
() => props.isShow,
|
||||
(newVal, oldVal) => {
|
||||
if (!oldVal && newVal) {
|
||||
transition.value = false
|
||||
setTimeout(() => (transition.value = true), 50)
|
||||
|
||||
}
|
||||
}
|
||||
)
|
||||
function onScan() {
|
||||
uni.scanCode({
|
||||
// 仅使用相机扫码,设置为 false 则可以从相册选择图片扫码(部分平台可能不支持)
|
||||
onlyFromCamera: true,
|
||||
scanType: ['qrCode', 'barCode'],
|
||||
success(res) {
|
||||
},
|
||||
fail(err) {
|
||||
uni.showToast({ title: '扫码失败:' + err.errMsg, icon: 'none' })
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.index-content-other {
|
||||
width: calc(100% - 170rpx);
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-content-down {
|
||||
width: calc(100% - 60rpx);
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.index-content-right {
|
||||
// height: calc(100% - 100rpx);
|
||||
height: calc(100% - 30rpx);
|
||||
width: calc(100% - 60rpx);
|
||||
background-color: rgba(255, 255, 255, 0.8);
|
||||
background-image: url('/static/index/leida/bgc.png');
|
||||
background-position: 30% 70%;
|
||||
border-radius: 50rpx;
|
||||
// box-shadow: 4rpx 8rpx 16rpx 4rpx rgba(0, 0, 0, 0.3);
|
||||
display: flex;
|
||||
position: relative;
|
||||
|
||||
.index-content-title {
|
||||
position: absolute;
|
||||
top: 60rpx;
|
||||
left: 60rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.shu {
|
||||
width: 20rpx;
|
||||
height: 50rpx;
|
||||
background: linear-gradient(to right, #0052C2, #00B4FF);
|
||||
border-radius: 20rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.shu-font {
|
||||
color: #415273;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.saomiao {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 400rpx;
|
||||
height: 400rpx;
|
||||
background-image: url("@/static/index/leida/fourjiao.png");
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
// height: 4rpx;
|
||||
// background-color: #05AAFE;
|
||||
/* 初始给个向下的阴影(扫描线起点在顶部) */
|
||||
// box-shadow: 0 5rpx 8rpx #9EBFEF;
|
||||
animation: scanMove 1.3s ease-in-out infinite;
|
||||
z-index: 1001;
|
||||
height: 80rpx; // 尾巴长度
|
||||
background: linear-gradient(to bottom,
|
||||
rgba(5, 170, 254, 0.6),
|
||||
rgba(5, 170, 254, 0.1),
|
||||
transparent);
|
||||
will-change: transform;
|
||||
}
|
||||
|
||||
.saomiao-son {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 360rpx;
|
||||
height: 360rpx;
|
||||
border-radius: 50rpx;
|
||||
background-color: rgb(218, 228, 248);
|
||||
|
||||
.saomiao-son-son {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 320rpx;
|
||||
height: 320rpx;
|
||||
border-radius: 50rpx;
|
||||
background-color: rgb(208, 224, 246);
|
||||
|
||||
.saomiao-son-son-img {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 250rpx;
|
||||
height: 250rpx;
|
||||
border-radius: 30rpx;
|
||||
background-image: url("@/static/index/leida/QR.png");
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 扫描动画关键帧
|
||||
@keyframes scanMove {
|
||||
0% {
|
||||
top: 10%;
|
||||
}
|
||||
|
||||
|
||||
100% {
|
||||
top: 80%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,272 +0,0 @@
|
|||
<template>
|
||||
<view class="index-content-other" v-show="isShow" :style="transition?{opacity: `1`}:{opacity: `0`}">
|
||||
<view class="index-content-right">
|
||||
<view style="margin-right: 40rpx;">长春市朝阳区久泰开运养老服务有限公司</view>
|
||||
</view>
|
||||
<view class="array-father">
|
||||
<view v-for="(item,index) in iconsArray.slice(0,3)" :key="index" class="item" @click="jumpToTarget(index)">
|
||||
<view class="left-item">
|
||||
<image class="left-icon" :src="`/static/index/settings/${index}.png`" />
|
||||
<view class="left-font">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="right-item">
|
||||
<image class="right-icon" :src="`/static/index/settings/00.png`" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="array-father" style="margin: 30rpx 0;">
|
||||
<view v-for="(item,index) in iconsArray.slice(3,5)" :key="index" class="item"
|
||||
@click="jumpToTarget(index+3)">
|
||||
<view class="left-item">
|
||||
<image class="left-icon" :src="`/static/index/settings/${index+3}.png`" />
|
||||
<view class="left-font">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="right-item">
|
||||
<image class="right-icon" :src="`/static/index/settings/00.png`" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="array-father">
|
||||
<view v-for="(item,index) in iconsArray.slice(5,8)" :key="index" class="item"
|
||||
@click="jumpToTarget(index+5)">
|
||||
<view class="left-item">
|
||||
<image class="left-icon" :src="`/static/index/settings/${index+5}.png`" />
|
||||
<view class="left-font">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="right-item">
|
||||
<image class="right-icon" :src="`/static/index/settings/00.png`" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom-button" @click="exitshow=true">
|
||||
注销登录
|
||||
</view>
|
||||
<exit :show="exitshow" @close="exitshow=false" />
|
||||
<reset :show="resetshow" @close="resetshow=false" />
|
||||
<zy-update ref="zyupgrade" :noticeflag="true" theme="blue" :h5preview="false" oldversion="1.0.0"
|
||||
:appstoreflag="true" :autocheckupdate="true" @showupdateTips="noNeed"></zy-update>
|
||||
<!-- 弹出层 -->
|
||||
<view v-if="openany" class="popup-any" :style="animation?{opacity:1}:{opacity:0}">
|
||||
<view class="mask" @click="openany=false"></view>
|
||||
<view class="box-any">
|
||||
<view class="title-left">
|
||||
<image class="back-img" src="/static/left.png" @click="openany=false"></image>
|
||||
<view v-if="!opentype" class="back-font">NU护理单元隐私信息保护政策</view>
|
||||
<view v-if="opentype" class="back-font">NU护理单元用户服务协议</view>
|
||||
</view>
|
||||
<twoseven v-if="!opentype" />
|
||||
<oneseven v-if="opentype" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
import exit from "@/component/public/exit.vue"
|
||||
import reset from "@/component/public/reset.vue"
|
||||
import ZyUpdate from '@/component/zy-upgrade/zy-upgrade.vue'
|
||||
import oneseven from '@/pages/login/oneseven.vue'
|
||||
import twoseven from '@/pages/login/twoseven.vue'
|
||||
|
||||
const zyupgrade = ref(null);
|
||||
const issay = ref(false)
|
||||
const openany = ref(false);
|
||||
const opentype = ref(false);
|
||||
const exitshow = ref(false);
|
||||
const resetshow = ref(false);
|
||||
const emit = defineEmits(['jump'])
|
||||
const props = defineProps({ isShow: { type: Boolean, required: true } })
|
||||
const iconsArray = ref(["雷达扫描", "扫码添加", "手动录入", "修改密码", "切换机构", "检查更新", "用户协议", "隐私政策"])
|
||||
|
||||
const transition = ref(true)
|
||||
const uuid = ref("")
|
||||
|
||||
// 区分首次渲染与动态添加
|
||||
watch(
|
||||
() => props.isShow,
|
||||
(newVal, oldVal) => {
|
||||
if (!oldVal && newVal) {
|
||||
transition.value = false
|
||||
setTimeout(() => (transition.value = true), 50)
|
||||
|
||||
}
|
||||
}
|
||||
)
|
||||
const animation = ref(false)
|
||||
const jumpToTarget = (index : number) => {
|
||||
switch (index) {
|
||||
case 0:
|
||||
emit("jump", index)
|
||||
break
|
||||
case 1:
|
||||
emit("jump", index)
|
||||
break
|
||||
case 2:
|
||||
emit("jump", index)
|
||||
break
|
||||
case 3:
|
||||
resetshow.value = true
|
||||
break
|
||||
case 4:
|
||||
|
||||
break
|
||||
case 5:
|
||||
issay.value = true;
|
||||
zyupgrade.value?.check_update()
|
||||
break
|
||||
case 6:
|
||||
openany.value = true;
|
||||
opentype.value = true;
|
||||
animation.value = false;
|
||||
setTimeout(() => {
|
||||
animation.value = true;
|
||||
}, 50)
|
||||
break
|
||||
case 7:
|
||||
openany.value = true;
|
||||
opentype.value = false;
|
||||
animation.value = false;
|
||||
setTimeout(() => {
|
||||
animation.value = true;
|
||||
}, 50)
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
const noNeed = () => {
|
||||
if (props.isShow && issay.value) {
|
||||
uni.showToast({
|
||||
title: '已经是最新版了',
|
||||
icon: 'none', // 无图标,仅文字
|
||||
duration: 2000 // 显示时长,单位毫秒
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.index-content-other {
|
||||
width: calc(100% - 170rpx);
|
||||
height: 100%;
|
||||
transition: opacity 1s ease;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.index-content-right {
|
||||
width: 100%;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
height: 120rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
height: 130rpx;
|
||||
|
||||
.left-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 20rpx;
|
||||
|
||||
.left-icon {
|
||||
margin: 0 20rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.left-item {}
|
||||
}
|
||||
|
||||
.right-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 50rpx;
|
||||
|
||||
.right-icon {
|
||||
// margin: 0 20rpx;
|
||||
width: 15rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.array-father {
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
width: 98.2%;
|
||||
border-radius: 30rpx;
|
||||
}
|
||||
|
||||
.bottom-button {
|
||||
margin-top: 30rpx;
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
width: 98.2%;
|
||||
border-radius: 30rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 30rpx;
|
||||
height: 100rpx;
|
||||
color: #0174D3;
|
||||
}
|
||||
|
||||
.popup-any {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 999;
|
||||
/* 初始透明度 */
|
||||
opacity: 0;
|
||||
/* 播放动画:名称 fadeIn,时长 0.5s,缓动函数 ease,保持最后状态 */
|
||||
transition: opacity 0.5s ease;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.mask {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
}
|
||||
|
||||
.box-any {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
width: 1000rpx;
|
||||
height: 1500rpx;
|
||||
background: #fff;
|
||||
border-radius: 50rpx;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 65rpx 40rpx;
|
||||
}
|
||||
|
||||
.title-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.back-img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
|
||||
.back-font {
|
||||
font-size: 35rpx;
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -20,7 +20,6 @@
|
|||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
defineProps,
|
||||
computed
|
||||
} from 'vue'
|
||||
|
||||
|
|
|
|||
|
|
@ -1,72 +0,0 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<scroll-view
|
||||
scroll-y
|
||||
class="scroll"
|
||||
:scroll-top="scrollTop"
|
||||
@scroll="onScroll"
|
||||
:scroll-with-animation="false"
|
||||
>
|
||||
<view
|
||||
v-for="(item, index) in renderList"
|
||||
:key="index"
|
||||
class="item"
|
||||
>
|
||||
{{ item }}
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, nextTick } from 'vue'
|
||||
|
||||
// 原始数据
|
||||
const baseList = Array.from({ length: 10 }, (_, i) => `第 ${i + 1} 项`)
|
||||
const renderList = ref([]) // 显示的3倍数据
|
||||
const itemHeight = 100 // 每项高度(rpx)需与你样式保持一致
|
||||
const scrollTop = ref(0)
|
||||
const totalHeight = baseList.length * itemHeight * 3
|
||||
|
||||
onMounted(() => {
|
||||
// 三倍复制数据(上下留出空间)
|
||||
renderList.value = [...baseList, ...baseList, ...baseList]
|
||||
|
||||
// 滚动到中间(第二组开头)
|
||||
nextTick(() => {
|
||||
scrollTop.value = baseList.length * itemHeight
|
||||
})
|
||||
})
|
||||
|
||||
function onScroll(e) {
|
||||
const currentTop = e.detail.scrollTop
|
||||
|
||||
const singleHeight = baseList.length * itemHeight
|
||||
const threshold = 20 // 触发回跳的阈值(rpx)
|
||||
|
||||
// 回到中间,形成无缝循环
|
||||
if (currentTop <= threshold) {
|
||||
scrollTop.value = singleHeight + currentTop
|
||||
} else if (currentTop >= singleHeight * 2 - threshold) {
|
||||
scrollTop.value = currentTop - singleHeight
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.container {
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
.scroll {
|
||||
height: 100%;
|
||||
}
|
||||
.item {
|
||||
height: 100rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-bottom: 1px solid #eee;
|
||||
background: #fff;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,149 +0,0 @@
|
|||
<template>
|
||||
<view class="move-circle">
|
||||
<image v-show="key === 0" src="/static/index/keyimg/where10.png" class="container-img-up" />
|
||||
<image v-show="key === 2" src="/static/index/keyimg/where10.png" class="container-img-down" />
|
||||
<image v-show="key === 3" src="/static/index/keyimg/where10.png" class="container-img-left" />
|
||||
<image v-show="key === 1" src="/static/index/keyimg/where10.png" class="container-img-right" />
|
||||
<!-- 上 -->
|
||||
<view class="up-container" @click="handleClick(0)">
|
||||
<image :src="icons.up" class="container-img" />
|
||||
</view>
|
||||
<!-- 右 -->
|
||||
<view class="right-container" @click="handleClick(1)">
|
||||
<image :src="icons.right" class="container-img-shu" />
|
||||
</view>
|
||||
<!-- 下 -->
|
||||
<view class="down-container" @click="handleClick(2)">
|
||||
<image :src="icons.down" class="container-img" />
|
||||
</view>
|
||||
<!-- 左 -->
|
||||
<view class="left-container" @click="handleClick(3)">
|
||||
<image :src="icons.left" class="container-img-shu" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from 'vue'
|
||||
const emit = defineEmits(['movecard'])
|
||||
|
||||
const icons = reactive({
|
||||
up: '/static/index/keyimg/up1.png',
|
||||
right: '/static/index/keyimg/where2.png',
|
||||
down: '/static/index/keyimg/down1.png',
|
||||
left: '/static/index/keyimg/where1.png'
|
||||
})
|
||||
const key = ref(-1)
|
||||
|
||||
// 保存当前定时器 ID
|
||||
let resetTimer = null
|
||||
|
||||
function handleClick(dir: number) {
|
||||
// 清除上一次定时器
|
||||
if (resetTimer !== null) {
|
||||
clearTimeout(resetTimer)
|
||||
}
|
||||
|
||||
// 显示当前方向
|
||||
key.value = dir
|
||||
emit('movecard', dir)
|
||||
|
||||
// 重新开启 800ms 定时器
|
||||
resetTimer = setTimeout(() => {
|
||||
key.value = -1
|
||||
resetTimer = null
|
||||
}, 500)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
.move-circle {
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
left: 0;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(circle at center,
|
||||
/* 圆形渐变,中心点在元素正中 */
|
||||
rgba(110, 149, 217, 0.2) 0%,
|
||||
/* 中心处纯色 */
|
||||
rgba(149, 177, 227, 0.2) 100%
|
||||
/* 边缘颜色 */
|
||||
);
|
||||
border: 5rpx rgba(148, 181, 229, 0.5) solid;
|
||||
// opacity: 0.1;
|
||||
z-index: 9999;
|
||||
}
|
||||
|
||||
.container-img-up {
|
||||
position: absolute;
|
||||
top: -48rpx;
|
||||
left: 50rpx;
|
||||
width: 220rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
|
||||
.container-img-down {
|
||||
position: absolute;
|
||||
bottom: -48rpx;
|
||||
left: 50rpx;
|
||||
transform: rotate(180deg);
|
||||
width: 220rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
|
||||
.container-img-left {
|
||||
position: absolute;
|
||||
left: -97rpx;
|
||||
top: 95rpx;
|
||||
transform: rotate(270deg);
|
||||
width: 220rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
|
||||
.container-img-right {
|
||||
position: absolute;
|
||||
right: -97rpx;
|
||||
transform: rotate(90deg);
|
||||
top: 95rpx;
|
||||
width: 220rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
|
||||
.container-img {
|
||||
width: 170rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
|
||||
.container-img-shu {
|
||||
width: 70rpx;
|
||||
height: 170rpx;
|
||||
}
|
||||
|
||||
.up-container {
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
|
||||
.down-container {
|
||||
position: absolute;
|
||||
bottom: 30rpx;
|
||||
left: 75rpx;
|
||||
}
|
||||
|
||||
.right-container {
|
||||
position: absolute;
|
||||
top: 75rpx;
|
||||
right: 30rpx;
|
||||
}
|
||||
|
||||
.left-container {
|
||||
position: absolute;
|
||||
top: 75rpx;
|
||||
left: 30rpx;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,112 +0,0 @@
|
|||
<template>
|
||||
<view class="move-circle" :style="containerStyle">
|
||||
<image src="/static/index/keyimg/lunpan.png" class="move-circle-all" />
|
||||
<view class="click-box-top" @click="handleClick(0)" />
|
||||
<view class="click-box-right" @click="handleClick(3)" />
|
||||
<view class="click-box-bottom" @click="handleClick(2)" />
|
||||
<view class="click-box-right" @click="handleClick(1)" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, computed } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
/**
|
||||
* 水平位置,单位 rpx
|
||||
*/
|
||||
right: {
|
||||
type: Number,
|
||||
default: 200
|
||||
},
|
||||
/**
|
||||
* 垂直位置,单位 rpx
|
||||
* 优先使用 bottom,如果同时传入 top 和 bottom,则以 top 为准
|
||||
*/
|
||||
bottom: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
top: {
|
||||
type: Number,
|
||||
default: undefined
|
||||
}
|
||||
})
|
||||
const emit = defineEmits<{
|
||||
(e: 'movecard', dir: number): void
|
||||
}>()
|
||||
|
||||
const key = ref(-1)
|
||||
let resetTimer: number | null = null
|
||||
|
||||
// 计算容器样式
|
||||
const containerStyle = computed(() => {
|
||||
const style: Record<string, string> = {
|
||||
right: `${props.right}rpx`
|
||||
}
|
||||
if (props.top !== undefined) {
|
||||
style.top = `${props.top}rpx`
|
||||
} else {
|
||||
style.bottom = `${props.bottom}rpx`
|
||||
}
|
||||
return style
|
||||
})
|
||||
|
||||
function handleClick(dir: number) {
|
||||
if (resetTimer !== null) {
|
||||
clearTimeout(resetTimer)
|
||||
}
|
||||
key.value = dir
|
||||
emit('movecard', dir)
|
||||
// 500ms 后复位
|
||||
resetTimer = setTimeout(() => {
|
||||
key.value = -1
|
||||
resetTimer = null
|
||||
}, 500)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.move-circle {
|
||||
position: absolute;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 9999;
|
||||
}
|
||||
.move-circle-all {
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
}
|
||||
.click-box-top {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 100rpx;
|
||||
width: 130rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
.click-box-bottom {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 100rpx;
|
||||
width: 130rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
.click-box-right {
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
right: 0;
|
||||
width: 98rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
.click-box-right {
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
right: 0;
|
||||
width: 98rpx;
|
||||
height: 120rpx;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,74 +0,0 @@
|
|||
<template>
|
||||
<view class="all-circle">
|
||||
<view class="move-circle" >
|
||||
移动
|
||||
</view>
|
||||
<view class="delete-circle" >
|
||||
删除
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
const emit = defineEmits(['click']);
|
||||
const isAdd = ref(false);
|
||||
const openAdd = () =>{
|
||||
isAdd.value = !isAdd.value
|
||||
}
|
||||
const addClass = (type: number) => {
|
||||
switch (type) {
|
||||
case 0:
|
||||
return 'add-circle';
|
||||
case 1:
|
||||
return 'add-circle-active';
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.all-circle{
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
right: 50rpx;
|
||||
width: 500rpx;
|
||||
height: 500rpx;
|
||||
}
|
||||
.move-circle{
|
||||
position: absolute;
|
||||
bottom: 200rpx;
|
||||
right: 60rpx;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(to top, #0DA0B1, #04D3AF);
|
||||
opacity:0.5;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
font-size: 35rpx;
|
||||
justify-content: center;
|
||||
}
|
||||
.delete-circle{
|
||||
position: absolute;
|
||||
bottom: 50rpx;
|
||||
right: 200rpx;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(to top, #0DA0B1, #04D3AF);
|
||||
opacity:0.5;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #fff;
|
||||
font-size: 35rpx;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,131 +0,0 @@
|
|||
<template>
|
||||
<view class="all-circle">
|
||||
<view class="circle-rightup">
|
||||
<view @click="clickCircle(`rightup`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/white.png`: `/static/index/keyimg/white.png`" />
|
||||
<view class="circle-font">
|
||||
确认
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-leftbottom">
|
||||
<view @click="clickCircle(`leftbottom`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/back.png`" />
|
||||
<view class="circle-font">
|
||||
返回
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
const emit = defineEmits(['clickcircle']);
|
||||
const upmenuIndex = ref(-1)
|
||||
|
||||
const isClick = ref(true);
|
||||
const clickCircle = (type : string) => {
|
||||
if (isClick.value) {
|
||||
switch (type) {
|
||||
case "rightup":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickcircle',0)
|
||||
}, 0)
|
||||
break;
|
||||
case "leftbottom":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickcircle',1)
|
||||
}, 0)
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.all-circle {
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
right: 80rpx;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 50%;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
|
||||
.circle-rightup {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
right: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgb(197, 220, 255);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-leftbottom {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
left: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgb(197, 220, 255);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-up-target {
|
||||
position: absolute;
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
top: -60rpx;
|
||||
left: 89rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.circle-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.circle-img-target {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.circle-font {
|
||||
position: absolute;
|
||||
bottom: 25rpx;
|
||||
left: 45rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.solveclick {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,222 +0,0 @@
|
|||
<template>
|
||||
<view class="all-circle">
|
||||
<view class="circle-up">
|
||||
<view @click="clickCircle(`up`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/key1-1.png`" />
|
||||
<view class="circle-font">
|
||||
睡眠
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-leftup">
|
||||
<view @click="clickCircle(`leftup`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/key5-1.png`" />
|
||||
<view class="circle-font">
|
||||
饮食
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-rightup">
|
||||
<view @click="clickCircle(`rightup`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/key4-1.png`" />
|
||||
<view class="circle-font">
|
||||
清洁
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-leftbottom">
|
||||
<view @click="clickCircle(`leftbottom`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/key3-1.png`" />
|
||||
<view class="circle-font">
|
||||
排泄
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-rightbottom">
|
||||
<view @click="clickCircle(`rightbottom`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/key2-2.png`" />
|
||||
<view class="circle-font">
|
||||
日常
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
const emit = defineEmits(['getDownListIndex']);
|
||||
const upmenuIndex = ref(-1)
|
||||
const isClick = ref(true);
|
||||
const clickCircle = (type : string) => {
|
||||
if (isClick.value) {
|
||||
switch (type) {
|
||||
case 'up':
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('getDownListIndex', 3)
|
||||
}, 0)
|
||||
break;
|
||||
case 'leftup':
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('getDownListIndex', 2)
|
||||
}, 0)
|
||||
break;
|
||||
case "rightup":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('getDownListIndex', 1)
|
||||
}, 0)
|
||||
break;
|
||||
case "leftbottom":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('getDownListIndex', 4)
|
||||
}, 0)
|
||||
break;
|
||||
case "rightbottom":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('getDownListIndex', 0)
|
||||
}, 0)
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.all-circle {
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
right: 80rpx;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
background-color: rgba(110, 149, 217, 0.1);
|
||||
border-radius: 50%;
|
||||
z-index: 999;
|
||||
display: flex;
|
||||
border: 1rpx solid #d5d5d5;
|
||||
|
||||
.circle-up {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
top: -60rpx;
|
||||
left: 89rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-leftup {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
left: -60rpx;
|
||||
top: 40rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-rightup {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
right: -60rpx;
|
||||
top: 40rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-leftbottom {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
left: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-rightbottom {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
right: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-up-target {
|
||||
position: absolute;
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
top: -60rpx;
|
||||
left: 89rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.circle-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.circle-img-target {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.circle-font {
|
||||
position: absolute;
|
||||
bottom: 25rpx;
|
||||
left: 45rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.solveclick {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,138 +0,0 @@
|
|||
|
||||
<template>
|
||||
<view class="all-circle">
|
||||
<view class="circle-rightup">
|
||||
<view @click="clickCircle(`rightup`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="ismove?`/static/index/keyimg/white.png`: `/static/index/keyimg/move.png`" />
|
||||
<view class="circle-font">
|
||||
{{ismove? `确定`:`移动`}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-leftbottom">
|
||||
<view @click="clickCircle(`leftbottom`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="ismove?`/static/index/keyimg/back.png`: `/static/index/keyimg/delete.png`" />
|
||||
<view class="circle-font">
|
||||
{{ismove? `取消`:`删除`}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
const emit = defineEmits(['clickcard']);
|
||||
const upmenuIndex = ref(-1)
|
||||
const props = defineProps({
|
||||
ismove: {
|
||||
type: Boolean,
|
||||
required: true,
|
||||
},
|
||||
|
||||
});
|
||||
const isClick = ref(true);
|
||||
const clickCircle = (type : string) => {
|
||||
if (isClick.value) {
|
||||
switch (type) {
|
||||
case "rightup":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickcard',0)
|
||||
}, 0)
|
||||
break;
|
||||
case "leftbottom":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickcard',1)
|
||||
}, 0)
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.all-circle {
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
right: 80rpx;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 50%;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
|
||||
.circle-rightup {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
right: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-leftbottom {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
left: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-up-target {
|
||||
position: absolute;
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
top: -60rpx;
|
||||
left: 89rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.circle-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.circle-img-target {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.circle-font {
|
||||
position: absolute;
|
||||
bottom: 25rpx;
|
||||
left: 45rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.solveclick {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,133 +0,0 @@
|
|||
<template>
|
||||
<view class="all-circle">
|
||||
<view class="circle-rightup">
|
||||
<view @click="clickCircle(`rightup`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/white.png`" />
|
||||
<view class="circle-font">
|
||||
确认
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="circle-leftbottom">
|
||||
<view @click="clickCircle(`leftbottom`)" class="solveclick">
|
||||
<image :class="upmenuIndex==0?`circle-img-target` :`circle-img`"
|
||||
:src="upmenuIndex==0?`/static/index/keyimg/key1.png`: `/static/index/keyimg/back.png`" />
|
||||
<view class="circle-font">
|
||||
取消
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import {
|
||||
ref
|
||||
} from 'vue'
|
||||
const emit = defineEmits(['clickdelete']);
|
||||
const upmenuIndex = ref(-1)
|
||||
|
||||
const isClick = ref(true);
|
||||
const clickCircle = (type : string) => {
|
||||
if (isClick.value) {
|
||||
switch (type) {
|
||||
case "rightup":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickdelete',0)
|
||||
}, 0)
|
||||
break;
|
||||
case "leftbottom":
|
||||
isClick.value = false;
|
||||
setTimeout(() => {
|
||||
upmenuIndex.value = -1;
|
||||
isClick.value = true;
|
||||
emit('clickdelete',1)
|
||||
}, 0)
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.all-circle {
|
||||
position: absolute;
|
||||
bottom: 300rpx;
|
||||
right: 80rpx;
|
||||
width: 330rpx;
|
||||
height: 330rpx;
|
||||
border-radius: 50%;
|
||||
z-index: 9999;
|
||||
display: flex;
|
||||
|
||||
.circle-rightup {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
right: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgb(197, 220, 255);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.circle-leftbottom {
|
||||
position: absolute;
|
||||
width: 155rpx;
|
||||
height: 155rpx;
|
||||
left: 0rpx;
|
||||
bottom: -30rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgb(197, 220, 255);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.circle-up-target {
|
||||
position: absolute;
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
top: -60rpx;
|
||||
left: 89rpx;
|
||||
border-radius: 50%;
|
||||
border: 4rpx solid rgba(110, 149, 217, 0.2);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.circle-img {
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
}
|
||||
|
||||
.circle-img-target {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
|
||||
.circle-font {
|
||||
position: absolute;
|
||||
bottom: 25rpx;
|
||||
left: 45rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.solveclick {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -16,7 +16,6 @@
|
|||
<script setup lang="ts">
|
||||
import {
|
||||
ref,
|
||||
defineProps,
|
||||
computed,
|
||||
onMounted
|
||||
} from 'vue'
|
||||
|
|
|
|||
|
|
@ -1,532 +0,0 @@
|
|||
<template>
|
||||
<view v-if="visible" class="overlay">
|
||||
<view class="box" :style="boxStyle" >
|
||||
<view class="header" ref="headerRef">
|
||||
<view class="title">{{ title }}</view>
|
||||
<view class="actions">
|
||||
<button class="btn" @click="cancel">取消</button>
|
||||
<button class="btn" @click="confirm">确定</button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<picker-view class="picker-view" :style="{
|
||||
height: pickerHeight + 'px',
|
||||
'--item-h': ITEM_H + 'px',
|
||||
'--cols': displayColumns.length || 1
|
||||
}" :value="normalizedSelectedIndexes" @change="onPickerChange">
|
||||
<picker-view-column class="picker-view-column" v-for="(col, ci) in displayColumns" :key="ci">
|
||||
<view v-for="(item, i) in col" :key="i" class="picker-item">{{ item }}</view>
|
||||
<!-- :style="{ height: ITEM_H + 'px', lineHeight: ITEM_H + 'px' }" -->
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
|
||||
<view class="resize-handle" @touchstart.stop.prevent="onResizeStartTouch"
|
||||
@mousedown.stop.prevent="onResizeStartMouse">
|
||||
<view class="grip"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
watch,
|
||||
onMounted,
|
||||
onBeforeUnmount,
|
||||
nextTick
|
||||
} from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: '请选择'
|
||||
},
|
||||
initLeft: {
|
||||
type: Number,
|
||||
default: 50
|
||||
},
|
||||
initTop: {
|
||||
type: Number,
|
||||
default: 100
|
||||
},
|
||||
initWidth: {
|
||||
type: Number,
|
||||
default: 320
|
||||
},
|
||||
initHeight: {
|
||||
type: Number,
|
||||
default: 320
|
||||
},
|
||||
minWidth: {
|
||||
type: Number,
|
||||
default: 180
|
||||
},
|
||||
minHeight: {
|
||||
type: Number,
|
||||
default: 200
|
||||
},
|
||||
maxWidth: {
|
||||
type: Number,
|
||||
default: 1000
|
||||
},
|
||||
maxHeight: {
|
||||
type: Number,
|
||||
default: 1200
|
||||
},
|
||||
columns: {
|
||||
type: Array,
|
||||
default: () => [
|
||||
[]
|
||||
]
|
||||
},
|
||||
nameKey: {
|
||||
type: [String, Array],
|
||||
default: 'name'
|
||||
},
|
||||
value: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
});
|
||||
const emit = defineEmits(['update:modelValue', 'confirm', 'change', 'update:position', 'update:size','close']);
|
||||
|
||||
/* ========== 基本可见性 / 同步 ========== */
|
||||
const visible = ref(props.modelValue);
|
||||
watch(() => props.modelValue, v => visible.value = v);
|
||||
watch(visible, v => emit('update:modelValue', v));
|
||||
|
||||
/* ========== 位置 / 尺寸 ========== */
|
||||
const left = ref(props.initLeft);
|
||||
const top = ref(props.initTop);
|
||||
const width = ref(props.initWidth);
|
||||
const height = ref(props.initHeight);
|
||||
|
||||
/* ========== 固定行高(关键:整数像素) ========== */
|
||||
const ITEM_H = 44; // 行高(px),保持整数像素
|
||||
const HEADER_H = 44; // header 高度(px),与你样式一致
|
||||
|
||||
/* ========== selectedIndexes 初始值 & 正规化 ========== */
|
||||
const selectedIndexes = ref(
|
||||
(props.value && props.value.length) ? props.value.map(v => Number(v || 0)) : (Array.isArray(props.columns) ?
|
||||
props.columns.map(() => 0) : [])
|
||||
);
|
||||
watch(() => props.value, v => {
|
||||
if (v && v.length) {
|
||||
selectedIndexes.value = v.map(x => Number(x || 0));
|
||||
clampSelectedIndexes();
|
||||
}
|
||||
});
|
||||
const normalizedSelectedIndexes = computed(() => selectedIndexes.value.map(v => Number(v || 0)));
|
||||
|
||||
/* ========== columns -> displayColumns(显示文本) ========== */
|
||||
function getByPath(obj, path) {
|
||||
if (obj == null) return undefined;
|
||||
if (!path) return obj;
|
||||
const parts = path.split('.');
|
||||
let cur = obj;
|
||||
for (let p of parts) {
|
||||
if (cur == null) return undefined;
|
||||
cur = cur[p];
|
||||
}
|
||||
return cur;
|
||||
}
|
||||
const displayColumns = computed(() => {
|
||||
const raw = props.columns || [];
|
||||
const nk = props.nameKey;
|
||||
return raw.map((col, ci) => {
|
||||
if (!Array.isArray(col)) return [];
|
||||
return col.map(item => {
|
||||
if (item == null) return '';
|
||||
if (typeof item === 'object') {
|
||||
let keyToUse = Array.isArray(nk) ? (nk[ci] !== undefined ? nk[ci] : nk[0]) :
|
||||
nk;
|
||||
if (!keyToUse) {
|
||||
return item.name ?? item.label ?? item.title ?? String(item);
|
||||
}
|
||||
const val = getByPath(item, keyToUse);
|
||||
return (val === undefined || val === null) ? (item.name ?? item.label ?? item
|
||||
.title ?? String(item)) : String(val);
|
||||
} else {
|
||||
return String(item);
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
const rawColumns = computed(() => (props.columns || []).map(col => Array.isArray(col) ? col : []));
|
||||
|
||||
/* ========== 屏幕信息(只用 uni.getSystemInfoSync,App/H5/小程序 均可用) ========== */
|
||||
let screenW = 800,
|
||||
screenH = 600; // 安全默认值(不会访问 window)
|
||||
onMounted(() => {
|
||||
try {
|
||||
const info = uni.getSystemInfoSync();
|
||||
// uni.getSystemInfoSync 在 App/H5/小程序 都可用,优先使用
|
||||
screenW = info.windowWidth || info.screenWidth || screenW;
|
||||
screenH = info.windowHeight || info.screenHeight || screenH;
|
||||
} catch (e) {
|
||||
// 若异常,不尝试访问 window,保留默认值
|
||||
screenW = screenW;
|
||||
screenH = screenH;
|
||||
}
|
||||
});
|
||||
|
||||
/* ========== 拖拽 / 缩放(保持原逻辑) ========== */
|
||||
let dragging = false;
|
||||
let dragStart = {
|
||||
x: 0,
|
||||
y: 0,
|
||||
left: 0,
|
||||
top: 0
|
||||
};
|
||||
let resizing = false;
|
||||
let resizeStart = {
|
||||
x: 0,
|
||||
y: 0,
|
||||
w: 0,
|
||||
h: 0
|
||||
};
|
||||
|
||||
function onDragStartTouch(e) {
|
||||
const t = e.touches && e.touches[0];
|
||||
if (t) startDrag(t.clientX, t.clientY);
|
||||
}
|
||||
|
||||
function onDragStartMouse(e) {
|
||||
startDrag(e.clientX, e.clientY);
|
||||
}
|
||||
|
||||
function startDrag(cx, cy) {
|
||||
dragging = true;
|
||||
dragStart.x = cx;
|
||||
dragStart.y = cy;
|
||||
dragStart.left = left.value;
|
||||
dragStart.top = top.value;
|
||||
}
|
||||
|
||||
function onResizeStartTouch(e) {
|
||||
const t = e.touches && e.touches[0];
|
||||
if (t) startResize(t.clientX, t.clientY);
|
||||
}
|
||||
|
||||
function onResizeStartMouse(e) {
|
||||
startResize(e.clientX, e.clientY);
|
||||
}
|
||||
|
||||
function startResize(cx, cy) {
|
||||
resizing = true;
|
||||
resizeStart.x = cx;
|
||||
resizeStart.y = cy;
|
||||
resizeStart.w = width.value;
|
||||
resizeStart.h = height.value;
|
||||
}
|
||||
|
||||
function onTouchMove(e) {
|
||||
if (!dragging && !resizing) return;
|
||||
const t = e.touches && e.touches[0];
|
||||
if (t) handleMove(t.clientX, t.clientY, e);
|
||||
}
|
||||
|
||||
function onMouseMove(e) {
|
||||
if (!dragging && !resizing) return;
|
||||
handleMove(e.clientX, e.clientY, e);
|
||||
}
|
||||
|
||||
function handleMove(cx, cy, e) {
|
||||
if (dragging) {
|
||||
const dx = cx - dragStart.x;
|
||||
const dy = cy - dragStart.y;
|
||||
left.value = Math.min(Math.max(0, dragStart.left + dx), Math.max(0, screenW - width.value));
|
||||
top.value = Math.min(Math.max(0, dragStart.top + dy), Math.max(0, screenH - height.value));
|
||||
emit('update:position', {
|
||||
left: left.value,
|
||||
top: top.value
|
||||
});
|
||||
} else if (resizing) {
|
||||
const dx = cx - resizeStart.x;
|
||||
const dy = cy - resizeStart.y;
|
||||
let nw = Math.min(props.maxWidth, Math.max(props.minWidth, Math.round(resizeStart.w + dx)));
|
||||
let nh = Math.min(props.maxHeight, Math.max(props.minHeight, Math.round(resizeStart.h + dy)));
|
||||
if (left.value + nw > screenW) nw = screenW - left.value;
|
||||
if (top.value + nh > screenH) nh = screenH - top.value;
|
||||
width.value = nw;
|
||||
height.value = nh;
|
||||
emit('update:size', {
|
||||
width: width.value,
|
||||
height: height.value
|
||||
});
|
||||
}
|
||||
if (e && e.preventDefault) e.preventDefault();
|
||||
}
|
||||
|
||||
function onMouseUp() {
|
||||
if (dragging) dragging = false;
|
||||
if (resizing) resizing = false;
|
||||
}
|
||||
|
||||
function onTouchEnd() {
|
||||
if (dragging) dragging = false;
|
||||
if (resizing) resizing = false;
|
||||
}
|
||||
|
||||
/* ========== picker 行数 / 高度 计算(关键) ========== */
|
||||
const pickerHeight = computed(() => {
|
||||
const avail = Math.max(0, Math.round(height.value) - HEADER_H);
|
||||
let rows = Math.floor(avail / ITEM_H);
|
||||
if (rows < 1) rows = 1;
|
||||
if (rows % 2 === 0) rows = rows - 1 > 0 ? rows - 1 : 1;
|
||||
return rows * ITEM_H;
|
||||
});
|
||||
|
||||
/* ========== clamp helper ========== */
|
||||
function clampSelectedIndexes() {
|
||||
const colsArr = rawColumns.value || [];
|
||||
if (selectedIndexes.value.length !== colsArr.length) {
|
||||
selectedIndexes.value = Array.from({
|
||||
length: colsArr.length
|
||||
}, (_, i) => selectedIndexes.value[i] ?? 0);
|
||||
}
|
||||
selectedIndexes.value = selectedIndexes.value.map((idx, ci) => {
|
||||
const col = Array.isArray(colsArr[ci]) ? colsArr[ci] : [];
|
||||
const maxIdx = Math.max(0, col.length - 1);
|
||||
return col.length ? Math.min(Math.max(0, Number(idx) || 0), maxIdx) : 0;
|
||||
});
|
||||
}
|
||||
|
||||
/* ========== 对齐重置逻辑(核心) ========== */
|
||||
let resetTimer = null;
|
||||
|
||||
function resetPickerAlign(delay = 40) {
|
||||
if (resetTimer) clearTimeout(resetTimer);
|
||||
resetTimer = setTimeout(() => {
|
||||
nextTick(() => {
|
||||
clampSelectedIndexes();
|
||||
selectedIndexes.value = selectedIndexes.value.map(v => Number(v || 0));
|
||||
});
|
||||
resetTimer = null;
|
||||
}, delay);
|
||||
}
|
||||
|
||||
/* 在关键变化上调用重置:columns / visible / pickerHeight */
|
||||
watch(() => props.columns, () => {
|
||||
clampSelectedIndexes();
|
||||
resetPickerAlign(30);
|
||||
}, {
|
||||
deep: true,
|
||||
immediate: true
|
||||
});
|
||||
|
||||
watch(() => visible.value, (v) => {
|
||||
if (v) {
|
||||
resetPickerAlign(60);
|
||||
setTimeout(() => resetPickerAlign(40), 120);
|
||||
}
|
||||
});
|
||||
|
||||
watch(() => pickerHeight.value, () => {
|
||||
resetPickerAlign(30);
|
||||
});
|
||||
|
||||
/* ========== picker change / confirm / cancel ========== */
|
||||
function onPickerChange(e) {
|
||||
const val = (e && e.detail && e.detail.value) ? e.detail.value : e;
|
||||
if (Array.isArray(val)) {
|
||||
selectedIndexes.value = val.map((v, ci) => {
|
||||
const col = rawColumns.value[ci] || [];
|
||||
const max = Math.max(0, col.length - 1);
|
||||
const num = Number(v) || 0;
|
||||
return col.length ? Math.min(Math.max(0, num), max) : 0;
|
||||
});
|
||||
}
|
||||
emit('change', selectedIndexes.value.slice());
|
||||
resetPickerAlign(80);
|
||||
}
|
||||
|
||||
function confirm() {
|
||||
console.log("111")
|
||||
const result = selectedIndexes.value.map((idx, ci) => {
|
||||
const col = rawColumns.value[ci] || [];
|
||||
const display = (displayColumns.value[ci] && displayColumns.value[ci][idx] !== undefined) ?
|
||||
displayColumns.value[ci][idx] : (col[idx] !== undefined ? String(col[idx]) : '');
|
||||
const val = col[idx] !== undefined ? col[idx] : (display || null);
|
||||
return {
|
||||
index: idx,
|
||||
value: val,
|
||||
display
|
||||
};
|
||||
});
|
||||
|
||||
emit('confirm', result);
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
function cancel() {
|
||||
visible.value = false;
|
||||
emit('close');
|
||||
}
|
||||
|
||||
/* ========== boxStyle ========== */
|
||||
const boxStyle = computed(() => ({
|
||||
position: 'fixed',
|
||||
left: `${Math.round(left.value)}px`,
|
||||
top: `${Math.round(top.value)}px`,
|
||||
width: `${Math.round(width.value)}px`,
|
||||
height: `${Math.round(height.value)}px`,
|
||||
zIndex: 1000,
|
||||
background: '#fff',
|
||||
borderRadius: '8px',
|
||||
boxShadow: '0 8px 24px rgba(0,0,0,0.12)',
|
||||
overflow: 'hidden',
|
||||
transform: 'translateZ(0)'
|
||||
}));
|
||||
|
||||
/* ========== 全局事件监听(更稳健的平台检测) ========== */
|
||||
/* 我们优先使用 window/document(H5 环境),如果都不可用(如原生 App),则不添加全局监听,
|
||||
因为原生 App 的触摸事件通常在组件内部就能处理(touchstart/touchmove/touchend) */
|
||||
let globalEventTarget = null;
|
||||
if (typeof window !== 'undefined' && window && typeof window.addEventListener === 'function') {
|
||||
globalEventTarget = window;
|
||||
} else if (typeof document !== 'undefined' && document && typeof document.addEventListener === 'function') {
|
||||
globalEventTarget = document;
|
||||
} else {
|
||||
globalEventTarget = null; // 在原生 App(非 H5)中通常为 null
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
if (globalEventTarget) {
|
||||
try {
|
||||
globalEventTarget.addEventListener('mousemove', onMouseMove);
|
||||
globalEventTarget.addEventListener('mouseup', onMouseUp);
|
||||
// touchmove 需要 passive:false 以阻止默认行为
|
||||
globalEventTarget.addEventListener('touchmove', onTouchMove, {
|
||||
passive: false
|
||||
});
|
||||
globalEventTarget.addEventListener('touchend', onTouchEnd);
|
||||
} catch (e) {
|
||||
// 如果某些环境不支持 options 参数,用 fallback
|
||||
try {
|
||||
globalEventTarget.addEventListener('touchmove', onTouchMove);
|
||||
globalEventTarget.addEventListener('touchend', onTouchEnd);
|
||||
} catch (err) {
|
||||
// 忽略
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
if (globalEventTarget) {
|
||||
try {
|
||||
globalEventTarget.removeEventListener('mousemove', onMouseMove);
|
||||
globalEventTarget.removeEventListener('mouseup', onMouseUp);
|
||||
globalEventTarget.removeEventListener('touchmove', onTouchMove);
|
||||
globalEventTarget.removeEventListener('touchend', onTouchEnd);
|
||||
} catch (e) {
|
||||
// 忽略
|
||||
}
|
||||
}
|
||||
if (resetTimer) {
|
||||
clearTimeout(resetTimer);
|
||||
resetTimer = null;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.overlay {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
z-index: 900;
|
||||
background: rgba(0, 0, 0, 0.35);
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.box {
|
||||
background: #fff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
transform: translateZ(0);
|
||||
}
|
||||
|
||||
.header {
|
||||
height: 44px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 8px;
|
||||
border-bottom: 1px solid #eee;
|
||||
background: linear-gradient(90deg, #fff, #fafafa);
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 6px 8px;
|
||||
border-radius: 6px;
|
||||
background: #f5f5f5;
|
||||
}
|
||||
|
||||
.picker-view {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.picker-view-column {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
width: calc(100% / var(--cols, 1));
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.picker-item {
|
||||
display: block;
|
||||
/* height: var(--item-h);
|
||||
line-height: var(--item-h); */
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.resize-handle {
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
bottom: 6px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
.grip {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 4px;
|
||||
border: 1px dashed #bbb;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
4
main.js
|
|
@ -19,14 +19,14 @@ import {
|
|||
createSSRApp
|
||||
} from 'vue'
|
||||
import donghua from '@/component/public/donghua.vue'
|
||||
import arrowkeys from '@/component/public/newgame/arrowkeys.vue'
|
||||
// import arrowkeys from '@/component/public/newgame/arrowkeys.vue'
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App)
|
||||
|
||||
// 使用 uView UI
|
||||
app.use(uView)
|
||||
app.component('donghua', donghua)
|
||||
app.component('arrowkeys', arrowkeys)
|
||||
// app.component('arrowkeys', arrowkeys)
|
||||
return {
|
||||
app
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,8 +2,8 @@
|
|||
"name" : "护理单元",
|
||||
"appid" : "__UNI__FB2D473",
|
||||
"description" : "护理单元",
|
||||
"versionName" : "1.0.012",
|
||||
"versionCode" : 10012,
|
||||
"versionName" : "1.0.013",
|
||||
"versionCode" : 10013,
|
||||
"transformPx" : false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus" : {
|
||||
|
|
|
|||
18
pages.json
|
|
@ -1,12 +1,14 @@
|
|||
{
|
||||
"pages": [{
|
||||
"pages": [
|
||||
// 登录
|
||||
{
|
||||
"path": "pages/login/login",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 主页,下面的子窗口是引入摄像头nvue的方法,因为安卓只能连接nvue页面
|
||||
{
|
||||
"path": "pages/watch/index",
|
||||
"style": {
|
||||
|
|
@ -27,6 +29,7 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
// 全屏查看摄像头,下面的子窗口是引入摄像头nvue的方法,因为安卓只能连接nvue页面
|
||||
{
|
||||
"path": "pages/watch/full",
|
||||
"style": {
|
||||
|
|
@ -87,6 +90,7 @@
|
|||
}
|
||||
|
||||
},
|
||||
// 护理单元
|
||||
{
|
||||
"path": "pages/NursingNew/index",
|
||||
"style": {
|
||||
|
|
@ -96,13 +100,6 @@
|
|||
},
|
||||
|
||||
// 护理表格预览
|
||||
{
|
||||
"path": "pages/timeMatrix/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
|
||||
},
|
||||
{
|
||||
"path": "pages/timeMatrix/indexnew",
|
||||
"style": {
|
||||
|
|
@ -110,6 +107,7 @@
|
|||
}
|
||||
|
||||
},
|
||||
// 仓库的拣货
|
||||
{
|
||||
"path": "pages/Warehouse/picking",
|
||||
"style": {
|
||||
|
|
@ -117,6 +115,7 @@
|
|||
}
|
||||
|
||||
},
|
||||
// 仓库的完结
|
||||
{
|
||||
"path": "pages/Warehouse/finish",
|
||||
"style": {
|
||||
|
|
@ -124,6 +123,7 @@
|
|||
}
|
||||
|
||||
},
|
||||
|
||||
{
|
||||
"path": "pages/procurement/purchaseorder",
|
||||
"style": {
|
||||
|
|
|
|||
|
|
@ -554,7 +554,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, onUnmounted } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, onUnmounted } from 'vue';
|
||||
import {
|
||||
electricityMeterlist, electricityMetereleReset, electricityMetereleControl, electricityMeterbaoxiu, electricityMeteleRead,
|
||||
waterwaterReset, waterwaterControl, waterbaoxiu, waterwaterRead, humidDevicebaoxiu, updateDeviceRealTime, cameraInfobaoxiu,
|
||||
|
|
|
|||
|
|
@ -140,7 +140,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
|
|
|
|||
|
|
@ -1171,7 +1171,7 @@
|
|||
|
||||
.button-father {
|
||||
height: 200rpx;
|
||||
width: calc(100%-80rpx);
|
||||
width: calc(100% - 80rpx);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
|
|
|||
|
|
@ -575,7 +575,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, defineEmits, watch } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
import { onShow, onHide } from '@dcloudio/uni-app';
|
||||
import type { roomBtttonType } from "./index";
|
||||
import { getNclist, addBatch, addDirective, addInstant, addElderTag, deleteDirective, deleteInstant, deleteElderTag, editDirective } from "./api.js";
|
||||
|
|
|
|||
|
|
@ -30,8 +30,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import defaultr from './default.vue'
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
const props = defineProps({
|
||||
Material:{
|
||||
type:Array,
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
type: Array,
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, watch } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
import { getMaterialTreeData,getTreeDataWlnum} from '../api/api.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
const scroll = reactive({ scrolltop1: 0, scrolltop2: 0, scrolltop3: 0, act1: -1, act2: -1, act3: -1 });
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
const props = defineProps({
|
||||
objtake: {
|
||||
type: Object,
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
const props = defineProps({
|
||||
objtake: {
|
||||
type: Object,
|
||||
|
|
|
|||
|
|
@ -188,7 +188,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import { queryCgdList } from '@/pages/Warehouse/api/lunpan.js'
|
||||
|
||||
|
|
@ -305,6 +305,10 @@
|
|||
// serverUrl.value = uni.getStorageSync('serverUrl') + '/sys/common/static/';
|
||||
// getSelectList();
|
||||
})
|
||||
// const emit = defineEmits(['changePageNumber']) // 也可以用类型签名(见下面)
|
||||
// const changePage = () => {
|
||||
// emit('changePageNumber', 0)
|
||||
// }
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<view class="boxtwo flexend">
|
||||
<view class="qlthbtn">
|
||||
<image src="/static/index/requestform/ql0.png" mode="aspectFill"></image>
|
||||
<view class="shx-font">
|
||||
<view class="shx-font" @click="changePage()">
|
||||
请领单
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -52,8 +52,8 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { queryInvoicingList,wlzd,queryGwcInfo,addGwc } from '../api/api.js'
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
import { queryInvoicingList,wlzd } from '../api/api.js'
|
||||
import addwl from '../common/addwl.vue';
|
||||
import carditem from '../common/carditem.vue';
|
||||
import takeing from '../common/takeing.vue';
|
||||
|
|
@ -194,6 +194,10 @@
|
|||
classication.value.qingkong();
|
||||
classication.value.config();
|
||||
}
|
||||
const emit = defineEmits(['changePageNumber']) // 也可以用类型签名(见下面)
|
||||
const changePage = () => {
|
||||
emit('changePageNumber', 1)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
|
|
|||
|
|
@ -10,17 +10,17 @@
|
|||
<view class="right-icons">
|
||||
<image class="right-icons-img" src="/static/index/requestform/touxiang.png" />
|
||||
<view>{{uni.getStorageSync('realname')}}</view>
|
||||
<image class="right-icons-img-back" src="/static/index/requestform/back.png" v-if="hometype>0"/>
|
||||
<view v-if="hometype>0">返回</view>
|
||||
<image class="right-icons-img-back" src="/static/index/requestform/back.png" v-if="hometype>0" @click="hometype=0" />
|
||||
<view v-if="hometype>0" @click="hometype=0">返回</view>
|
||||
</view>
|
||||
</view>
|
||||
<takehomep v-if="hometype==0"></takehomep>
|
||||
<takehomep v-if="hometype==0" @changePageNumber="changehometype" ></takehomep>
|
||||
<requestformView v-if="hometype==1" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps, watch, reactive } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, watch, reactive } from 'vue';
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import { queryCgdList } from '@/pages/Warehouse/api/lunpan.js'
|
||||
import requestformView from './component/requestform.vue'
|
||||
|
|
@ -48,7 +48,9 @@
|
|||
|
||||
}
|
||||
)
|
||||
|
||||
const changehometype = (index:number) => {
|
||||
hometype.value = index
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick, defineProps } from 'vue';
|
||||
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||
const darkFans = ref(false);
|
||||
const getblue = ref(false);
|
||||
|
||||
|
|
|
|||
|
|
@ -1019,7 +1019,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, onUnmounted } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, onUnmounted } from 'vue';
|
||||
import { queryInvoicingList, getCgdMaterialTreeData, queryNuInfoByNuId, updateKfstatus, queryCgdList, queryCgdInfoList, queryWlInfoByWlId, voidedCgdMain } from './api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
|
||||
|
|
|
|||
|
|
@ -1067,11 +1067,10 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, onUnmounted } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, onUnmounted } from 'vue';
|
||||
import { editIzNew, queryPickingRecordList, queryJhzpList, addSxd, querySxdList, queryInvoicingList, getCgdMaterialTreeData, queryNuInfoByNuId, updateKfstatus, queryCgdList, queryCgdInfoList, queryWlInfoByWlId, voidedCgdMain, getCgrLis, getGysList, upload, editPrice, pickingInfo } from './api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import calendar from '@/component/public/calendar.vue'
|
||||
import superpicker from '@/component/public/superpicker.vue'
|
||||
import nomessageimge from '@/pages/procurement/components/nomessage.vue';
|
||||
import tanchuang from '@/pages/procurement/components/tanchuang.vue';
|
||||
|
||||
|
|
|
|||
|
|
@ -361,7 +361,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||
import { queryInvoicingList, getCgdMaterialTreeData, queryNuInfoByNuId, updateKfstatus, queryCgdList, queryCgdInfoList, queryWlInfoByWlId, voidedCgdMain } from './api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
|
||||
|
|
|
|||
|
|
@ -46,7 +46,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick } from 'vue';
|
||||
|
||||
const housedex = ref(0);
|
||||
const lastTap = ref(0)
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps ,defineComponent} from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick ,defineComponent} from 'vue';
|
||||
import { queryInvoicingList,queryWlInfoByWlId,addShoppingCartList,queryShoppingCartList } from '../api/lunpan.js'
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, defineComponent } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
type: Array,
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, defineComponent } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent } from 'vue';
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
type: Array,
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, watch } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
import { getMaterialTreeData, getTreeDataWlnum, getGysList, getGwcTreeDataWlnum, getGwcMaterialTreeData ,getCgdMaterialTreeData ,getCgdTreeDataWlnum} from '../api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
const scroll = reactive({ scrolltop1: 0, scrolltop2: 0, scrolltop3: 0, act1: -1, act2: -1, act3: -1 });
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, watch } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, watch } from 'vue';
|
||||
import { getMaterialTreeData, getTreeDataWlnum, getGysList, getGwcTreeDataWlnum, getGwcMaterialTreeData ,getCgdMaterialTreeData ,getCgdTreeDataWlnum} from '../api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
const scroll = reactive({ scrolltop1: 0, scrolltop2: 0, scrolltop3: 0, act1: -1, act2: -1, act3: -1 });
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps ,defineComponent,watch} from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent,watch} from 'vue';
|
||||
import { queryInvoicingList,queryWlInfoByWlId,addShoppingCartList,queryShoppingCartList } from '../api/lunpan.js'
|
||||
const props = defineProps({
|
||||
InvoicingList: {
|
||||
|
|
|
|||
|
|
@ -163,7 +163,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, defineComponent, watch } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, watch } from 'vue';
|
||||
import { generatedPurchaseViewOrder, generatedPurchaseOrder } from '../api/lunpan.js'
|
||||
const emit = defineEmits(['cloe', 'config'])
|
||||
const leftscrolltop = ref(0);
|
||||
|
|
|
|||
|
|
@ -121,7 +121,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps, defineComponent, inject } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent, inject } from 'vue';
|
||||
import { queryInvoicingList, queryWlInfoByWlId, addShoppingCartList, queryShoppingCartList } from './api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import calculator from './components/calculator.vue'
|
||||
|
|
@ -230,7 +230,7 @@
|
|||
qb.value = !qb.value;
|
||||
moredex.value = 0;
|
||||
// 这么写是解决这个组件的响应丢失的bug
|
||||
scrollleft.value = savescrollleft.value + 95
|
||||
scrollleft.value = savescrollleft.value + 95.99
|
||||
setTimeout(() => {
|
||||
scrollleft.value = savescrollleft.value + 96
|
||||
}, 50)
|
||||
|
|
@ -238,7 +238,7 @@
|
|||
if (diff > 60 && qb.value) { // 👉 60px 阈值,随便改
|
||||
qb.value = !qb.value;
|
||||
moredex.value = 0;
|
||||
scrollleft.value = savescrollleft.value - 95
|
||||
scrollleft.value = savescrollleft.value - 95.99
|
||||
setTimeout(() => {
|
||||
scrollleft.value = savescrollleft.value - 96
|
||||
}, 50)
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps ,defineComponent} from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineComponent} from 'vue';
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import {generatedPurchaseViewOrder,eddShoppingCartList, queryShoppingCartList, getGwcMaterialTreeData, queryNuInfoByNuId, updateKfstatus,deleteQgInfoById,emptiedQgInfo ,queryWlInfoByWlId,generatedPurchaseOrder } from './api/lunpan.js'
|
||||
import carlist from './components/carlist.vue';
|
||||
|
|
|
|||
|
|
@ -395,7 +395,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick, defineProps } from 'vue';
|
||||
import { ref, onMounted, reactive, onBeforeUnmount, computed, nextTick} from 'vue';
|
||||
import { editIzNew, queryInvoicingList, getCgdMaterialTreeData, queryNuInfoByNuId, updateKfstatus, queryCgdList, queryCgdInfoList, queryWlInfoByWlId, voidedCgdMain, getShareUrlByCode, editShareInfo } from './api/lunpan.js'
|
||||
import { onShow, onLoad, onHide, onPageScroll } from "@dcloudio/uni-app"
|
||||
import classification from './components/cgdclass.vue'
|
||||
|
|
|
|||
|
|
@ -1,627 +0,0 @@
|
|||
<template>
|
||||
<div class="center-column" :style="{ height: isshow ? '675px' : '0px' }">
|
||||
<!-- 视频播放组件 -->
|
||||
<MonitorView ref="monitor" init="5" style="width: 675px;height: 475px;" @onTel="handleTelEvent"
|
||||
@onSnapShot="handleSnapShotEvent" @onRecord="handleRecordEvent" @onTalkStatus="handleTalkEvent" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phoneNumber: "1234567890",
|
||||
initnumber: 5,
|
||||
isAlarming: false,
|
||||
isRecording: false, // 录屏状态
|
||||
isTalking: false, // 对讲状态
|
||||
_pendingRequests: {
|
||||
snapshot: [],
|
||||
record: [],
|
||||
talk: []
|
||||
},
|
||||
suo: true,
|
||||
isshow: false,
|
||||
globalEvent: ''
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
console.log("???加载")
|
||||
// 保留你的 globalEvent 监听
|
||||
this.globalEvent = uni.requireNativePlugin && uni.requireNativePlugin("globalEvent");
|
||||
if (this.globalEvent && this.globalEvent.addEventListener) {
|
||||
this.globalEvent.addEventListener("myEvent", (e) => {
|
||||
// console.log(e)
|
||||
|
||||
if (e.recordUrl) {
|
||||
uni.showToast({
|
||||
title: '录屏成功',
|
||||
icon: 'success', // 'success' | 'loading' | 'none'
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
if (e.snapShotUrl) {
|
||||
uni.showToast({
|
||||
title: '截屏成功',
|
||||
icon: 'success', // 'success' | 'loading' | 'none'
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
// console.log("00000",e.onVolumeChange)
|
||||
if (this.suo && e.onVolumeChange) {
|
||||
if (e.onVolumeChange) {
|
||||
this.toggleVolume();
|
||||
}
|
||||
this.suo = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
uni.setStorageSync('saveinit', 5);
|
||||
uni.$on('smallmonitor:changeinit', (number) => {
|
||||
this.$refs.monitor.initAutoPlay(number)
|
||||
uni.setStorageSync('saveinit', number);
|
||||
console.log("saveinit", number)
|
||||
});
|
||||
uni.$on('smallmonitor:isshow', (bool) => {
|
||||
this.isshow = bool;
|
||||
})
|
||||
uni.$on('smallmonitor:killView', this.killView);
|
||||
// 在页面生命周期注册 uni.$on 事件,暴露给其他页面调用
|
||||
uni.$on('smallmonitor:doSnapshot', this.doSnapshot);
|
||||
uni.$on('smallmonitor:startRecord', this.doStartRecord);
|
||||
uni.$on('smallmonitor:stopRecord', this.doStopRecord);
|
||||
uni.$on('smallmonitor:openTalk', this.doOpenTalk);
|
||||
uni.$on('smallmonitor:stopTalk', this.doStopTalk);
|
||||
|
||||
uni.$on('smallmonitor:switchDisplay', (payload) => this.switchDisplay(payload));
|
||||
uni.$on('smallmonitor:startAlarm', this.startAlarm);
|
||||
uni.$on('smallmonitor:stopAlarm', this.stopAlarm);
|
||||
uni.$on('smallmonitor:flipImage', (payload) => this.flipImage(payload));
|
||||
uni.$on('smallmonitor:resumeOrPause', this.resumeOrPause);
|
||||
uni.$on('smallmonitor:changeQuality', this.changeQuality);
|
||||
uni.$on('smallmonitor:toggleVolume', this.toggleVolume);
|
||||
uni.$on('smallmonitor:test', this.test);
|
||||
},
|
||||
onUnload() {
|
||||
console.log('fullcamera 卸载,清理事件');
|
||||
|
||||
// 确保 globalEvent 有才清除
|
||||
if (this.globalEvent && this.globalEvent.removeEventListener) {
|
||||
this.globalEvent.removeEventListener("myEvent");
|
||||
}
|
||||
|
||||
const events = [
|
||||
'smallmonitor:killView',
|
||||
'smallmonitor:changeinit',
|
||||
'smallmonitor:isshow',
|
||||
'smallmonitor:doSnapshot',
|
||||
'smallmonitor:startRecord',
|
||||
'smallmonitor:stopRecord',
|
||||
'smallmonitor:openTalk',
|
||||
'smallmonitor:stopTalk',
|
||||
'smallmonitor:switchDisplay',
|
||||
'smallmonitor:startAlarm',
|
||||
'smallmonitor:stopAlarm',
|
||||
'smallmonitor:flipImage',
|
||||
'smallmonitor:resumeOrPause',
|
||||
'smallmonitor:changeQuality',
|
||||
'smallmonitor:toggleVolume',
|
||||
'smallmonitor:test'
|
||||
];
|
||||
|
||||
events.forEach(ev => uni.$off(ev)); // 💥这样会解绑当前页面注册的所有监听
|
||||
},
|
||||
methods: {
|
||||
/* ------------------ 原有功能 ------------------ */
|
||||
handleTelEvent(event) {
|
||||
console.log("Tel event detail:", event.detail);
|
||||
// 如果需要解析电话事件,在这里处理
|
||||
},
|
||||
killView() {
|
||||
|
||||
this.$refs.monitor.killView && this.$refs.monitor.killView();
|
||||
},
|
||||
switchDisplay(mode) {
|
||||
console.log("zzzzz", mode)
|
||||
this.$refs.monitor && this.$refs.monitor.switchDisplayModeFragment(mode);
|
||||
},
|
||||
|
||||
startAlarm() {
|
||||
this.isAlarming = true;
|
||||
this.$refs.monitor.startOrStopManualAlarm(this.isAlarming, (res) => {
|
||||
console.log("startAlarm callback:", res);
|
||||
});
|
||||
},
|
||||
stopAlarm() {
|
||||
this.isAlarming = false;
|
||||
this.$refs.monitor.startOrStopManualAlarm(this.isAlarming, (res) => {
|
||||
console.log("stopAlarm callback:", res);
|
||||
});
|
||||
},
|
||||
|
||||
flipImage(type) {
|
||||
this.$refs.monitor.changeImageSwitch(type, (res) => {
|
||||
console.log("flipImage callback:", res);
|
||||
});
|
||||
},
|
||||
|
||||
resumeOrPause() {
|
||||
this.$refs.monitor.resumeOrPause && this.$refs.monitor.resumeOrPause();
|
||||
},
|
||||
|
||||
changeQuality() {
|
||||
this.$refs.monitor.changeQuality && this.$refs.monitor.changeQuality();
|
||||
},
|
||||
toggleVolume() {
|
||||
this.$refs.monitor.toggleVolume && this.$refs.monitor.toggleVolume();
|
||||
},
|
||||
test() {
|
||||
this.$refs.monitor && this.$refs.monitor.test && this.$refs.monitor.test();
|
||||
},
|
||||
|
||||
/* ------------------ 新增:截图/录屏/对讲 调用方法(支持 payload.reqId) ------------------ */
|
||||
|
||||
// 1. 截图(调用)
|
||||
// payload 可选:{ reqId: number }
|
||||
doSnapshot(payload = {}) {
|
||||
if (!this.$refs.monitor || !this.$refs.monitor.snapShot) {
|
||||
uni.showToast({
|
||||
title: "组件不支持 snapShot()",
|
||||
icon: "none"
|
||||
});
|
||||
// 直接给请求方回错
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'snapShot_not_supported'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果 caller 传了 reqId,就把 reqId 放入 pending(以备 native 事件回调时匹配)
|
||||
if (payload.reqId) {
|
||||
this._pendingRequests.snapshot.push(payload.reqId);
|
||||
}
|
||||
|
||||
try {
|
||||
this.$refs.monitor.snapShot((res) => {
|
||||
// 这个 callback 优先使用,直接回传结果给请求方(如果有)
|
||||
console.log("snapShot callback:", res);
|
||||
this._handleSnapshotResultFromNative(res, payload.reqId);
|
||||
});
|
||||
uni.showToast({
|
||||
title: "正在截屏...",
|
||||
icon: "none",
|
||||
duration: 800
|
||||
});
|
||||
} catch (err) {
|
||||
console.error("snapShot 调用失败", err);
|
||||
uni.showToast({
|
||||
title: "snapShot 调用失败",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'snapShot_call_failed',
|
||||
detail: String(err)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 2. 开始录屏(调用)
|
||||
// payload 可选:{ reqId: number }
|
||||
doStartRecord(payload = {}) {
|
||||
if (!this.$refs.monitor || !this.$refs.monitor.startRecord) {
|
||||
uni.showToast({
|
||||
title: "组件不支持 startRecord()",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'startRecord_not_supported'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
try {
|
||||
this.$refs.monitor.startRecord((res) => {
|
||||
console.log("startRecord callback:", res);
|
||||
// 有些实现会在 start 的 callback 里返回启动结果;如果 caller 传了 reqId 则回传
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: true,
|
||||
res
|
||||
});
|
||||
}
|
||||
});
|
||||
this.isRecording = true;
|
||||
uni.showToast({
|
||||
title: "录屏已开始",
|
||||
icon: "none"
|
||||
});
|
||||
} catch (err) {
|
||||
console.error("startRecord 调用失败", err);
|
||||
uni.showToast({
|
||||
title: "startRecord 调用失败",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'startRecord_call_failed',
|
||||
detail: String(err)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 3. 停止录屏(调用)
|
||||
// payload 可选:{ reqId: number }
|
||||
doStopRecord(payload = {}) {
|
||||
if (!this.$refs.monitor || !this.$refs.monitor.stopRecord) {
|
||||
uni.showToast({
|
||||
title: "组件不支持 stopRecord()",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'stopRecord_not_supported'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// 记录 pending(以便 native 的 onRecord 事件回传可匹配)
|
||||
if (payload.reqId) {
|
||||
this._pendingRequests.record.push(payload.reqId);
|
||||
}
|
||||
|
||||
try {
|
||||
this.$refs.monitor.stopRecord((res) => {
|
||||
console.log("stopRecord callback:", res);
|
||||
this._handleRecordResultFromNative(res, payload.reqId);
|
||||
});
|
||||
// 状态会在回调或事件里最终设置
|
||||
} catch (err) {
|
||||
console.error("stopRecord 调用失败", err);
|
||||
uni.showToast({
|
||||
title: "stopRecord 调用失败",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'stopRecord_call_failed',
|
||||
detail: String(err)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 4. 开始对讲(调用)
|
||||
// payload 可选:{ reqId: number }
|
||||
doOpenTalk(payload = {}) {
|
||||
if (!this.$refs.monitor || !this.$refs.monitor.openTalk) {
|
||||
uni.showToast({
|
||||
title: "组件不支持 openTalk()",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'openTalk_not_supported'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
// pending 用于当 native 发来 talk 状态事件时回传
|
||||
if (payload.reqId) {
|
||||
this._pendingRequests.talk.push(payload.reqId);
|
||||
}
|
||||
try {
|
||||
this.$refs.monitor.openTalk((res) => {
|
||||
console.log("openTalk callback:", res);
|
||||
// 如果 callback 里有最终状态可以直接回传
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: true,
|
||||
res
|
||||
});
|
||||
}
|
||||
});
|
||||
this.isTalking = true;
|
||||
uni.showToast({
|
||||
title: "尝试建立对讲连接...",
|
||||
icon: "none"
|
||||
});
|
||||
} catch (err) {
|
||||
console.error("openTalk 调用失败", err);
|
||||
uni.showToast({
|
||||
title: "openTalk 调用失败",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'openTalk_call_failed',
|
||||
detail: String(err)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// 5. 停止对讲(调用)
|
||||
// payload 可选:{ reqId: number }
|
||||
doStopTalk(payload = {}) {
|
||||
if (!this.$refs.monitor || !this.$refs.monitor.stopTalk) {
|
||||
uni.showToast({
|
||||
title: "组件不支持 stopTalk()",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'stopTalk_not_supported'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
try {
|
||||
this.$refs.monitor.stopTalk((res) => {
|
||||
console.log("stopTalk callback:", res);
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: true,
|
||||
res
|
||||
});
|
||||
}
|
||||
});
|
||||
this.isTalking = false;
|
||||
} catch (err) {
|
||||
console.error("stopTalk 调用失败", err);
|
||||
uni.showToast({
|
||||
title: "stopTalk 调用失败",
|
||||
icon: "none"
|
||||
});
|
||||
if (payload.reqId) {
|
||||
uni.$emit(`smallmonitor:response:${payload.reqId}`, {
|
||||
ok: false,
|
||||
error: 'stopTalk_call_failed',
|
||||
detail: String(err)
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/* ------------------ 事件回调处理(来自原生推送的事件) ------------------ */
|
||||
|
||||
// 处理来自模板 @onSnapShot 的事件(event.detail)
|
||||
handleSnapShotEvent(event) {
|
||||
const payload = event && event.detail ? event.detail : event;
|
||||
console.log("onSnapShot event:", payload);
|
||||
// 统一处理并尝试把结果回给 pending 请求者
|
||||
this._handleSnapshotResultFromNative(payload);
|
||||
},
|
||||
|
||||
// 处理来自模板 @onRecord 的事件(event.detail)
|
||||
handleRecordEvent(event) {
|
||||
const payload = event && event.detail ? event.detail : event;
|
||||
console.log("onRecord event:", payload);
|
||||
this._handleRecordResultFromNative(payload);
|
||||
},
|
||||
|
||||
// 处理来自模板 @onTalkStatus 的事件
|
||||
handleTalkEvent(event) {
|
||||
const payload = event && event.detail ? event.detail : event;
|
||||
console.log("onTalkStatus event:", payload);
|
||||
|
||||
const status = payload && payload.talkStatus;
|
||||
const tips = payload && payload.tips;
|
||||
|
||||
// 通知调用方(通用事件)
|
||||
uni.$emit('smallmonitor:talk:status', payload);
|
||||
|
||||
// 如果有 pending talk 请求,回传结果
|
||||
if (this._pendingRequests.talk && this._pendingRequests.talk.length) {
|
||||
while (this._pendingRequests.talk.length) {
|
||||
const reqId = this._pendingRequests.talk.shift();
|
||||
uni.$emit(`smallmonitor:response:${reqId}`, {
|
||||
ok: true,
|
||||
payload
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
switch ((status || "").toLowerCase()) {
|
||||
case "loading":
|
||||
uni.showToast({
|
||||
title: tips || "对讲连接中...",
|
||||
icon: "none"
|
||||
});
|
||||
this.isTalking = true;
|
||||
break;
|
||||
case "playing":
|
||||
uni.showToast({
|
||||
title: tips || "对讲已连接",
|
||||
icon: "none"
|
||||
});
|
||||
this.isTalking = true;
|
||||
break;
|
||||
case "stopped":
|
||||
uni.showToast({
|
||||
title: tips || "对讲已停止",
|
||||
icon: "none"
|
||||
});
|
||||
this.isTalking = false;
|
||||
break;
|
||||
case "failed":
|
||||
uni.showToast({
|
||||
title: tips || "对讲失败",
|
||||
icon: "none"
|
||||
});
|
||||
this.isTalking = false;
|
||||
break;
|
||||
default:
|
||||
uni.showToast({
|
||||
title: tips || ("对讲状态: " + (status || "unknown")),
|
||||
icon: "none"
|
||||
});
|
||||
break;
|
||||
}
|
||||
},
|
||||
|
||||
/* ------------------ 原生结果的内部处理函数(统一处理 callback / event) ------------------ */
|
||||
|
||||
_handleSnapshotResultFromNative(res, reqIdFromCallback = null) {
|
||||
if (!res) {
|
||||
uni.showToast({
|
||||
title: "截图没有返回数据",
|
||||
icon: "none"
|
||||
});
|
||||
// 回传失败
|
||||
if (reqIdFromCallback) {
|
||||
uni.$emit(`smallmonitor:response:${reqIdFromCallback}`, {
|
||||
ok: false,
|
||||
error: 'no_data'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
let payload = res;
|
||||
if (res.detail) payload = res.detail;
|
||||
|
||||
console.log("snapshot payload normalized:", payload);
|
||||
|
||||
// 优先判断 callback 里直接传进来的 reqId
|
||||
if (reqIdFromCallback) {
|
||||
uni.$emit(`smallmonitor:response:${reqIdFromCallback}`, {
|
||||
ok: !!payload.snapShotResult,
|
||||
payload
|
||||
});
|
||||
}
|
||||
|
||||
// 如果没有 callback reqId,但有 pending 列表,则把结果分发给所有 pending reqId(典型场景:调用方只发了 reqId,但 native 最终通过 onSnapShot 事件推回)
|
||||
if ((!reqIdFromCallback) && this._pendingRequests.snapshot && this._pendingRequests.snapshot.length) {
|
||||
while (this._pendingRequests.snapshot.length) {
|
||||
const rid = this._pendingRequests.snapshot.shift();
|
||||
uni.$emit(`smallmonitor:response:${rid}`, {
|
||||
ok: !!payload.snapShotResult,
|
||||
payload
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 无论如何,都发一个通用完成事件,方便只监听通用事件的页面
|
||||
uni.$emit('smallmonitor:snapshot:done', payload);
|
||||
|
||||
if (payload.snapShotResult === true || payload.snapShotResult === "true") {
|
||||
const url = payload.snapShotUrl || payload.snapShotPath || payload.url;
|
||||
uni.showToast({
|
||||
title: "截图成功",
|
||||
icon: "success",
|
||||
duration: 1200
|
||||
});
|
||||
if (url) {
|
||||
uni.previewImage({
|
||||
urls: [url]
|
||||
});
|
||||
}
|
||||
} else {
|
||||
const err = payload.snapShotErrorCode || payload.error || "unknown";
|
||||
uni.showToast({
|
||||
title: "截图失败: " + err,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
console.warn("snapshot failed reason:", err, payload);
|
||||
}
|
||||
},
|
||||
|
||||
_handleRecordResultFromNative(res, reqIdFromCallback = null) {
|
||||
if (!res) {
|
||||
uni.showToast({
|
||||
title: "录屏没有返回数据",
|
||||
icon: "none"
|
||||
});
|
||||
this.isRecording = false;
|
||||
if (reqIdFromCallback) {
|
||||
uni.$emit(`smallmonitor:response:${reqIdFromCallback}`, {
|
||||
ok: false,
|
||||
error: 'no_data'
|
||||
});
|
||||
}
|
||||
return;
|
||||
}
|
||||
let payload = res;
|
||||
if (res.detail) payload = res.detail;
|
||||
|
||||
console.log("record payload normalized:", payload);
|
||||
|
||||
// 优先用 callback 的 reqId 回传
|
||||
if (reqIdFromCallback) {
|
||||
uni.$emit(`smallmonitor:response:${reqIdFromCallback}`, {
|
||||
ok: !!(payload.recordUrl || payload.snapShotResult),
|
||||
payload
|
||||
});
|
||||
}
|
||||
|
||||
// 如果没有 callback reqId,但有 pending,则回传给 pending 列表
|
||||
if ((!reqIdFromCallback) && this._pendingRequests.record && this._pendingRequests.record.length) {
|
||||
while (this._pendingRequests.record.length) {
|
||||
const rid = this._pendingRequests.record.shift();
|
||||
uni.$emit(`smallmonitor:response:${rid}`, {
|
||||
ok: !!(payload.recordUrl || payload.snapShotResult),
|
||||
payload
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 通用事件
|
||||
uni.$emit('smallmonitor:record:done', payload);
|
||||
|
||||
if (payload.recordUrl) {
|
||||
uni.showToast({
|
||||
title: "录屏完成",
|
||||
icon: "success",
|
||||
duration: 1400
|
||||
});
|
||||
this.isRecording = false;
|
||||
console.log("录屏地址:", payload.recordUrl);
|
||||
} else if (payload.recordFailedReason) {
|
||||
uni.showToast({
|
||||
title: "录屏失败: " + payload.recordFailedReason,
|
||||
icon: "none",
|
||||
duration: 2000
|
||||
});
|
||||
this.isRecording = false;
|
||||
console.warn("record failed reason:", payload.recordFailedReason);
|
||||
} else {
|
||||
if (payload.snapShotResult === true) {
|
||||
uni.showToast({
|
||||
title: "录屏操作已完成(返回未知)",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
this.isRecording = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.center-column {
|
||||
/* width: 680px;
|
||||
height: 520px; */
|
||||
width: 675px;
|
||||
height: 475px;
|
||||
border-radius: 30px;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -11,7 +11,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted,defineEmits } from 'vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
const props = defineProps({
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted,defineEmits } from 'vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
const props = defineProps({
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ref, reactive, onMounted, computed, nextTick, watch, onBeforeUnmount,defineProps } from 'vue'
|
||||
import { ref, reactive, onMounted, computed, nextTick, watch, onBeforeUnmount } from 'vue'
|
||||
|
||||
|
||||
// 接收父组件传入的宽度百分比
|
||||
|
|
|
|||
|
|
@ -16,7 +16,6 @@
|
|||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
defineProps,
|
||||
computed,
|
||||
onMounted
|
||||
} from 'vue'
|
||||
|
|
|
|||
|
|
@ -586,44 +586,44 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
const movecard = (type : number) => {
|
||||
isopen.value = false
|
||||
switch (type) {
|
||||
case 0:
|
||||
if (clickY.value > 0) {
|
||||
clickY.value--
|
||||
}
|
||||
// const movecard = (type : number) => {
|
||||
// isopen.value = false
|
||||
// switch (type) {
|
||||
// case 0:
|
||||
// if (clickY.value > 0) {
|
||||
// clickY.value--
|
||||
// }
|
||||
|
||||
break
|
||||
case 1:
|
||||
if (clickX.value < 23) {
|
||||
clickX.value++
|
||||
}
|
||||
// break
|
||||
// case 1:
|
||||
// if (clickX.value < 23) {
|
||||
// clickX.value++
|
||||
// }
|
||||
|
||||
|
||||
break
|
||||
case 2:
|
||||
if (clickY.value < 11) {
|
||||
clickY.value++
|
||||
}
|
||||
// break
|
||||
// case 2:
|
||||
// if (clickY.value < 11) {
|
||||
// clickY.value++
|
||||
// }
|
||||
|
||||
break
|
||||
case 3:
|
||||
if (clickX.value > 0) {
|
||||
clickX.value--
|
||||
}
|
||||
// break
|
||||
// case 3:
|
||||
// if (clickX.value > 0) {
|
||||
// clickX.value--
|
||||
// }
|
||||
|
||||
break
|
||||
case 4:
|
||||
rulerTouchClick(changetimearr.value[clickX.value].children[clickY.value], clickX.value, clickY.value)
|
||||
// break
|
||||
// case 4:
|
||||
// rulerTouchClick(changetimearr.value[clickX.value].children[clickY.value], clickX.value, clickY.value)
|
||||
|
||||
break
|
||||
case 5:
|
||||
// break
|
||||
// case 5:
|
||||
|
||||
routerBack()
|
||||
break
|
||||
}
|
||||
}
|
||||
// routerBack()
|
||||
// break
|
||||
// }
|
||||
// }
|
||||
function changeRuler(type : boolean) {
|
||||
if (type) {
|
||||
scalcType.value = 7
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@
|
|||
import {
|
||||
ref,
|
||||
onMounted,
|
||||
defineEmits
|
||||
} from 'vue';
|
||||
const props = defineProps({
|
||||
isShow: {
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted,defineEmits } from 'vue';
|
||||
import { ref, onMounted } from 'vue';
|
||||
const props = defineProps({
|
||||
isShow: {
|
||||
type: Boolean,
|
||||
|
|
|
|||
|
|
@ -246,7 +246,6 @@
|
|||
const menuIndex = ref(-1);
|
||||
const typeNow = ref(-1);
|
||||
const photoplay = ref(false);
|
||||
const getblue = ref(false);
|
||||
const gobackdrawer = ref(null);
|
||||
const wheelRef = ref(null);
|
||||
const topnum = ref(0); // scroll-top (px)
|
||||
|
|
@ -404,8 +403,13 @@
|
|||
lastClickTime = now
|
||||
// console.log("???", lastClickTime)
|
||||
}
|
||||
const leftshowtarget = ref(-1)
|
||||
const changeLeftMenu = (item : any, index : number) => {
|
||||
|
||||
if(leftshowtarget.value===index && index){
|
||||
return
|
||||
}else{
|
||||
leftshowtarget.value = index
|
||||
}
|
||||
if (item?.elderServerEntityList) {
|
||||
//给屏幕右侧数据用的
|
||||
const nearest = findClosestItem(item?.elderServerEntityList, time.value)
|
||||
|
|
@ -678,7 +682,7 @@
|
|||
menuIndex.value = 0;
|
||||
typeNow.value = 0;
|
||||
photoplay.value = true;
|
||||
getblue.value = true;
|
||||
|
||||
})
|
||||
const leftTargetIndex = ref(0);
|
||||
const topTargetIndex = ref(-1);
|
||||
|
|
@ -717,193 +721,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
const movecard = (type : number) => {
|
||||
|
||||
if (leftTargetIndex.value !== -1) {
|
||||
switch (type) {
|
||||
case 0:
|
||||
if (menuIndex.value > 0) {
|
||||
leftTargetIndex.value--
|
||||
menuIndex.value = leftTargetIndex.value
|
||||
ensureVisible(menuIndex.value)
|
||||
changeLeftMenu(filteredMenu.value[leftTargetIndex.value], leftTargetIndex.value)
|
||||
|
||||
} else {
|
||||
topTargetIndex.value = typeNow.value
|
||||
leftTargetIndex.value = -1
|
||||
}
|
||||
|
||||
break
|
||||
case 1:
|
||||
|
||||
topTargetIndex.value = typeNow.value
|
||||
leftTargetIndex.value = -1
|
||||
|
||||
break
|
||||
case 2:
|
||||
if (menuIndex.value < filteredMenu.value.length - 1) {
|
||||
menuIndex.value++
|
||||
leftTargetIndex.value = menuIndex.value
|
||||
ensureVisible(menuIndex.value)
|
||||
changeLeftMenu(filteredMenu.value[leftTargetIndex.value], leftTargetIndex.value)
|
||||
}
|
||||
|
||||
break
|
||||
case 3:
|
||||
|
||||
break
|
||||
case 4:
|
||||
savetypeNow.value = leftTargetIndex.value
|
||||
uni.setStorageSync('nuId', filteredMenu.value[savetypeNow.value].nuId);
|
||||
uni.setStorageSync('nuName', filteredMenu.value[savetypeNow.value].nuName);
|
||||
uni.setStorageSync('customerId', filteredMenu.value[savetypeNow.value].elderInfo ? filteredMenu.value[savetypeNow.value].elderInfo?.id : null);
|
||||
uni.setStorageSync('NUall', filteredMenu.value[savetypeNow.value]);
|
||||
console.log("??????1111", filteredMenu.value[savetypeNow.value])
|
||||
if (!typeNow.value) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/NursingNew/index'
|
||||
})
|
||||
} else if (typeNow.value === 2) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/Warehouse/Warehouse',
|
||||
// })
|
||||
uni.navigateTo({
|
||||
url: '/pages/Warehouse/warehome',
|
||||
})
|
||||
}
|
||||
|
||||
break
|
||||
}
|
||||
} else if (topTargetIndex.value !== -1) {
|
||||
switch (type) {
|
||||
case 0:
|
||||
|
||||
break
|
||||
case 1:
|
||||
if (typeNow.value < typeArray.value.length - 2) {
|
||||
// console.log("???", typeArray.value.length)
|
||||
typeNow.value++
|
||||
topTargetIndex.value = typeNow.value
|
||||
changeLeftMenu(filteredMenu.value[0], 0)
|
||||
|
||||
} else {
|
||||
shezhi.value = true
|
||||
topTargetIndex.value = -1
|
||||
}
|
||||
|
||||
break
|
||||
case 2:
|
||||
// topTargetIndex.value = -1
|
||||
// menuIndex.value = 0
|
||||
// leftTargetIndex.value = menuIndex.value
|
||||
// ensureVisible(menuIndex.value)
|
||||
// if (filteredMenu.value.length) {
|
||||
// topTargetIndex.value = -1
|
||||
// menuIndex.value = 0
|
||||
// leftTargetIndex.value = menuIndex.value
|
||||
// ensureVisible(menuIndex.value)
|
||||
// }
|
||||
cleanandopen()
|
||||
bottomTargetIndex.value = 0;
|
||||
clickDownCard(0)
|
||||
break
|
||||
case 3:
|
||||
if (typeNow.value) {
|
||||
typeNow.value--
|
||||
topTargetIndex.value = typeNow.value
|
||||
changeLeftMenu(filteredMenu.value[0], 0)
|
||||
|
||||
} else {
|
||||
topTargetIndex.value = -1
|
||||
menuIndex.value = 0
|
||||
typeNow.value = 0
|
||||
leftTargetIndex.value = menuIndex.value
|
||||
ensureVisible(menuIndex.value)
|
||||
}
|
||||
|
||||
break
|
||||
case 5:
|
||||
topTargetIndex.value = -1
|
||||
menuIndex.value = 0
|
||||
leftTargetIndex.value = menuIndex.value
|
||||
ensureVisible(menuIndex.value)
|
||||
break
|
||||
}
|
||||
} else if (shezhi.value) {
|
||||
switch (type) {
|
||||
case 0:
|
||||
|
||||
break
|
||||
case 1:
|
||||
|
||||
|
||||
break
|
||||
case 2:
|
||||
cleanandopen()
|
||||
bottomTargetIndex.value = 0;
|
||||
clickDownCard(0)
|
||||
|
||||
break
|
||||
case 3:
|
||||
typeNow.value = 3
|
||||
topTargetIndex.value = typeNow.value
|
||||
shezhi.value = false;
|
||||
break
|
||||
case 4:
|
||||
goback()
|
||||
break
|
||||
case 5:
|
||||
topTargetIndex.value = -1
|
||||
menuIndex.value = 0
|
||||
leftTargetIndex.value = menuIndex.value
|
||||
ensureVisible(menuIndex.value)
|
||||
shezhi.value = false;
|
||||
break
|
||||
}
|
||||
|
||||
} else if (bottomTargetIndex.value !== -1) {
|
||||
switch (type) {
|
||||
case 0:
|
||||
cleanandopen()
|
||||
topTargetIndex.value = typeNow.value;
|
||||
break
|
||||
case 1:
|
||||
if (bottomTargetIndex.value < 4) {
|
||||
bottomTargetIndex.value++
|
||||
clickDownCard(bottomTargetIndex.value)
|
||||
}
|
||||
|
||||
break
|
||||
case 2:
|
||||
|
||||
break
|
||||
case 3:
|
||||
|
||||
if (bottomTargetIndex.value) {
|
||||
bottomTargetIndex.value--
|
||||
clickDownCard(bottomTargetIndex.value)
|
||||
} else {
|
||||
let menunumber = menuIndex.value
|
||||
cleanandopen()
|
||||
menuIndex.value = menunumber;
|
||||
leftTargetIndex.value = menunumber;
|
||||
changeLeftMenu(filteredMenu.value[menuIndex.value], menuIndex.value)
|
||||
}
|
||||
break
|
||||
case 4:
|
||||
goback()
|
||||
break
|
||||
case 5:
|
||||
// topTargetIndex.value = -1
|
||||
// menuIndex.value = 0
|
||||
// leftTargetIndex.value = menuIndex.value
|
||||
// ensureVisible(menuIndex.value)
|
||||
// shezhi.value = false;
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
const removeTimers = new Map<number, ReturnType<typeof setTimeout>>();
|
||||
onBeforeUnmount(() => {
|
||||
for (const t of removeTimers.values()) {
|
||||
|
|
|
|||
|
|
@ -78,7 +78,6 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick, vShow } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
|
||||
import { getqueryinfoByBuId,updateBaseInfo } from "./api.js"
|
||||
const goback = () => {
|
||||
|
|
|
|||
|
|
@ -361,97 +361,97 @@
|
|||
}
|
||||
const targetNumber = ref(-1)
|
||||
const infoNumber = ref(-1)
|
||||
const movecard = (where : number) => {
|
||||
if (count.value !== 100) {
|
||||
return
|
||||
}
|
||||
switch (where) {
|
||||
case 0:
|
||||
// const movecard = (where : number) => {
|
||||
// if (count.value !== 100) {
|
||||
// return
|
||||
// }
|
||||
// switch (where) {
|
||||
// case 0:
|
||||
|
||||
if (infoNumber.value === 0) {
|
||||
infoNumber.value = 1
|
||||
return
|
||||
} else if (infoNumber.value === 1) {
|
||||
infoNumber.value = 0
|
||||
return
|
||||
}
|
||||
// if (infoNumber.value === 0) {
|
||||
// infoNumber.value = 1
|
||||
// return
|
||||
// } else if (infoNumber.value === 1) {
|
||||
// infoNumber.value = 0
|
||||
// return
|
||||
// }
|
||||
|
||||
if (targetNumber.value - 2 < -1) {
|
||||
targetNumber.value = -1
|
||||
} else {
|
||||
targetNumber.value = targetNumber.value - 2
|
||||
ensureVisible(targetNumber.value)
|
||||
}
|
||||
break
|
||||
case 1:
|
||||
if (infoNumber.value === 0) {
|
||||
infoNumber.value = 1
|
||||
return
|
||||
} else if (infoNumber.value === 1) {
|
||||
infoNumber.value = 0
|
||||
return
|
||||
}
|
||||
if (targetNumber.value + 1 > cardarray.value.length - 1) {
|
||||
// if (targetNumber.value - 2 < -1) {
|
||||
// targetNumber.value = -1
|
||||
// } else {
|
||||
// targetNumber.value = targetNumber.value - 2
|
||||
// ensureVisible(targetNumber.value)
|
||||
// }
|
||||
// break
|
||||
// case 1:
|
||||
// if (infoNumber.value === 0) {
|
||||
// infoNumber.value = 1
|
||||
// return
|
||||
// } else if (infoNumber.value === 1) {
|
||||
// infoNumber.value = 0
|
||||
// return
|
||||
// }
|
||||
// if (targetNumber.value + 1 > cardarray.value.length - 1) {
|
||||
|
||||
} else {
|
||||
targetNumber.value++
|
||||
ensureVisible(targetNumber.value)
|
||||
}
|
||||
break
|
||||
case 2:
|
||||
if (infoNumber.value === 0) {
|
||||
infoNumber.value = 1
|
||||
return
|
||||
} else if (infoNumber.value === 1) {
|
||||
infoNumber.value = 0
|
||||
return
|
||||
}
|
||||
if (targetNumber.value + 1 === cardarray.value.length - 1 || targetNumber.value === -1) {
|
||||
targetNumber.value++
|
||||
ensureVisible(targetNumber.value)
|
||||
}
|
||||
else if (targetNumber.value + 2 > cardarray.value.length - 1) {
|
||||
// } else {
|
||||
// targetNumber.value++
|
||||
// ensureVisible(targetNumber.value)
|
||||
// }
|
||||
// break
|
||||
// case 2:
|
||||
// if (infoNumber.value === 0) {
|
||||
// infoNumber.value = 1
|
||||
// return
|
||||
// } else if (infoNumber.value === 1) {
|
||||
// infoNumber.value = 0
|
||||
// return
|
||||
// }
|
||||
// if (targetNumber.value + 1 === cardarray.value.length - 1 || targetNumber.value === -1) {
|
||||
// targetNumber.value++
|
||||
// ensureVisible(targetNumber.value)
|
||||
// }
|
||||
// else if (targetNumber.value + 2 > cardarray.value.length - 1) {
|
||||
|
||||
} else {
|
||||
targetNumber.value = targetNumber.value + 2
|
||||
ensureVisible(targetNumber.value)
|
||||
}
|
||||
break
|
||||
case 3:
|
||||
if (infoNumber.value === 0) {
|
||||
infoNumber.value = 1
|
||||
return
|
||||
} else if (infoNumber.value === 1) {
|
||||
infoNumber.value = 0
|
||||
return
|
||||
}
|
||||
if (targetNumber.value !== -1) {
|
||||
targetNumber.value--
|
||||
ensureVisible(targetNumber.value)
|
||||
}
|
||||
break
|
||||
case 4:
|
||||
if(infoNumber.value ===1){
|
||||
rename(targetNumber.value,cardarray.value[targetNumber.value])
|
||||
return
|
||||
}
|
||||
if (targetNumber.value === -1) {
|
||||
cantoggleRun()
|
||||
} else {
|
||||
infoNumber.value = 0;
|
||||
}
|
||||
// } else {
|
||||
// targetNumber.value = targetNumber.value + 2
|
||||
// ensureVisible(targetNumber.value)
|
||||
// }
|
||||
// break
|
||||
// case 3:
|
||||
// if (infoNumber.value === 0) {
|
||||
// infoNumber.value = 1
|
||||
// return
|
||||
// } else if (infoNumber.value === 1) {
|
||||
// infoNumber.value = 0
|
||||
// return
|
||||
// }
|
||||
// if (targetNumber.value !== -1) {
|
||||
// targetNumber.value--
|
||||
// ensureVisible(targetNumber.value)
|
||||
// }
|
||||
// break
|
||||
// case 4:
|
||||
// if(infoNumber.value ===1){
|
||||
// rename(targetNumber.value,cardarray.value[targetNumber.value])
|
||||
// return
|
||||
// }
|
||||
// if (targetNumber.value === -1) {
|
||||
// cantoggleRun()
|
||||
// } else {
|
||||
// infoNumber.value = 0;
|
||||
// }
|
||||
|
||||
break
|
||||
case 5:
|
||||
if(infoNumber.value !==-1){
|
||||
infoNumber.value = -1
|
||||
}else{
|
||||
goback()
|
||||
}
|
||||
// break
|
||||
// case 5:
|
||||
// if(infoNumber.value !==-1){
|
||||
// infoNumber.value = -1
|
||||
// }else{
|
||||
// goback()
|
||||
// }
|
||||
|
||||
break
|
||||
}
|
||||
}
|
||||
// break
|
||||
// }
|
||||
// }
|
||||
onBeforeUnmount(() => {
|
||||
if (rafId != null) caf(rafId)
|
||||
stopBallGeneration()
|
||||
|
|
|
|||
|
|
@ -76,7 +76,6 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
import { getqueryinfoByBuId, updateBaseInfo } from "./api.js"
|
||||
const goback = () => {
|
||||
uni.navigateBack()
|
||||
|
|
|
|||
|
|
@ -91,7 +91,6 @@
|
|||
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch, nextTick } from 'vue'
|
||||
import { defineProps, defineEmits } from 'vue'
|
||||
import exit from "@/component/public/exit.vue"
|
||||
import reset from "@/component/public/reset.vue"
|
||||
import ZyUpdate from '@/component/zy-upgrade/zy-upgrade.vue'
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 218 KiB |
|
Before Width: | Height: | Size: 34 KiB |
|
Before Width: | Height: | Size: 16 KiB |
|
Before Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 22 KiB |
|
Before Width: | Height: | Size: 28 KiB |
|
Before Width: | Height: | Size: 20 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 21 KiB |
|
Before Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 2.8 KiB |
|
Before Width: | Height: | Size: 2.6 KiB |
|
Before Width: | Height: | Size: 7.0 KiB |
|
Before Width: | Height: | Size: 2.5 KiB |
|
Before Width: | Height: | Size: 17 KiB |
|
|
@ -7,8 +7,8 @@
|
|||
"id": "__UNI__FB2D473",
|
||||
"name": "护理单元",
|
||||
"version": {
|
||||
"name": "1.0.012",
|
||||
"code": 10012
|
||||
"name": "1.0.013",
|
||||
"code": 10013
|
||||
},
|
||||
"description": "护理单元",
|
||||
"developer": {
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
.all-content[data-v-c8dcb513]{width:100%;height:100%;background:url(../../static/index/warehouse/bg.png) no-repeat;background-size:cover cover;position:relative}.wareaitem[data-v-c8dcb513]{width:100%;height:100%;position:absolute;top:0;left:0;transform:scale(.9,.8)}.wareaitem .tp uni-image[data-v-c8dcb513]{width:100%;height:100%}.wareaitem .operationbtn[data-v-c8dcb513]{width:22vw;height:10vw;position:absolute;right:1.5vw;bottom:2vw;display:flex;justify-content:space-between;flex-wrap:wrap}.wareaitem .operationbtn>uni-view[data-v-c8dcb513]{width:10vw;height:4vw;border-radius:1vw;border:.0625rem solid #D9DADC;display:flex;justify-content:center;align-items:center;font-weight:400;font-size:1.3vw;color:#888d99;margin:0 .3vw;transition:transform .18s ease,box-shadow .18s ease,background .25s ease;-webkit-tap-highlight-color:transparent}.wareaitem .operationbtn>uni-view uni-image[data-v-c8dcb513]{width:1.6vw;height:1.6vw;margin-right:.2vw}.wareaitem .operationbtn .grad-text[data-v-c8dcb513]{background:linear-gradient(90deg,#5b8bb3,#87a1bd);background-size:200% 100%;background-position:0% 50%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transition:background-position .8s linear}@keyframes scalePulse-c8dcb513{0%{transform:scale(1)}25%{transform:scale(.94)}65%{transform:scale(1.08)}to{transform:scale(1)}}.wareaitem .wareaitem-item[data-v-c8dcb513]{width:100%;height:100%;position:fixed;top:0;left:-2vw}.wareaitem .wareaitem-item .itemact1[data-v-c8dcb513]{width:29vw;height:21vw;top:23vw;left:6vw;z-index:31}.wareaitem .wareaitem-item .itemact2[data-v-c8dcb513]{width:26vw;height:16vw;top:15vw;left:41vw;z-index:27}.wareaitem .wareaitem-item .itemact4[data-v-c8dcb513]{width:24vw;height:16vw;top:28vw;left:46vw;z-index:55}.wareaitem .wareaitem-item .itemact3[data-v-c8dcb513]{width:17vw;height:13vw;top:22vw;left:67vw;z-index:36}.wareaitem .wareaitem-item .wclik[data-v-c8dcb513]{width:22vw;height:14vw;top:16vw;left:44vw;z-index:47}.wareaitem .wareaitem-item .gifs[data-v-c8dcb513]{width:41vw;height:20vw;top:21.6vw;left:27.5vw;z-index:29}.wareaitem .wareaitem-item .ys[data-v-c8dcb513]{width:11vw;height:8vw;top:24.2vw;left:57.9vw;z-index:28}.wareaitem .wareaitem-item .wareitem1[data-v-c8dcb513]{width:86vw;height:44vw;top:1vw;left:10.5vw;z-index:15}.wareaitem .wareaitem-item .wareitem4[data-v-c8dcb513]{width:11vw;height:7vw;top:30.9vw;left:60vw}.wareaitem .wareaitem-item .wareitem6[data-v-c8dcb513]{width:17vw;height:12vw;top:28vw;right:-2vw;z-index:35}.wareaitem .wareaitem-item .wareitem5[data-v-c8dcb513]{width:18vw;height:15vw;top:37vw;left:73vw;z-index:35}.wareaitem .wareaitem-item .wareitem8[data-v-c8dcb513]{width:26vw;height:8vw;top:29.7vw;left:21.8vw}.wareaitem .wareaitem-item .wareitem11[data-v-c8dcb513]{width:3vw;height:3vw;top:24.5vw;left:60vw;z-index:35}.wareaitem .wareaitem-item .wareitem10[data-v-c8dcb513]{width:55vw;height:27vw;top:38vw;left:20vw;z-index:36}.wareaitem .wareaitem-item>uni-view[data-v-c8dcb513]{position:absolute}.wareaitem .annotation1[data-v-c8dcb513]{top:21.5vw;left:19.5vw}.wareaitem .annotation2[data-v-c8dcb513]{top:13vw;left:47vw}.wareaitem .annotation3[data-v-c8dcb513]{top:18vw;left:70vw}.wareaitem .annotation4[data-v-c8dcb513]{top:24vw;left:49.3vw}.wareaitem .annotation5[data-v-c8dcb513]{top:34vw;left:74vw}.wareaitem .annotation6[data-v-c8dcb513]{top:24vw;right:6vw}.wareaitem .annotation7[data-v-c8dcb513]{top:62vh;left:40vw}.wareaitem .annotation8[data-v-c8dcb513]{top:5vh;left:28vw}.wareaitem .annotation[data-v-c8dcb513]{width:7vw;height:8vw;z-index:20;position:fixed}.wareaitem .annotation>uni-view[data-v-c8dcb513]{position:relative}.wareaitem .annotation>uni-view[data-v-c8dcb513]:nth-child(2){width:7.8vw;height:3.5vw;z-index:2;margin-left:-.3125rem;display:flex;align-items:center;justify-content:center;border-radius:.8vw .8vw 1.5vw 1.5vw;overflow:hidden}.wareaitem .annotation>uni-view:nth-child(2) uni-image[data-v-c8dcb513]{position:absolute;top:0;left:0}.wareaitem .annotation>uni-view:nth-child(2) uni-text[data-v-c8dcb513]{position:relative;font-weight:400;font-size:1.1vw;color:#fff;z-index:3;margin-top:-.5vw}.wareaitem .annotation>uni-view[data-v-c8dcb513]:nth-child(3){width:3vw;height:5vw;z-index:1;margin:-1vw auto 0}.zhanwei[data-v-c8dcb513]{position:absolute;top:40vh;right:3vw;width:13vw;height:13vw}.content-title[data-v-c8dcb513]{position:absolute;top:3.125rem;left:1.5625rem;display:flex;align-items:center}.content-title .title-imge[data-v-c8dcb513]{width:1.875rem;height:1.875rem}.content-title .title-font[data-v-c8dcb513]{margin-left:.3125rem;font-size:1.09375rem;font-weight:600}
|
||||
.all-content[data-v-82523906]{width:100%;height:100%;background:url(../../static/index/warehouse/bg.png) no-repeat;background-size:cover cover;position:relative}.wareaitem[data-v-82523906]{width:100%;height:100%;position:absolute;top:0;left:0;transform:scale(.9,.8)}.wareaitem .tp uni-image[data-v-82523906]{width:100%;height:100%}.wareaitem .operationbtn[data-v-82523906]{width:22vw;height:10vw;position:absolute;right:1.5vw;bottom:2vw;display:flex;justify-content:space-between;flex-wrap:wrap}.wareaitem .operationbtn>uni-view[data-v-82523906]{width:10vw;height:4vw;border-radius:1vw;border:.0625rem solid #D9DADC;display:flex;justify-content:center;align-items:center;font-weight:400;font-size:1.3vw;color:#888d99;margin:0 .3vw;transition:transform .18s ease,box-shadow .18s ease,background .25s ease;-webkit-tap-highlight-color:transparent}.wareaitem .operationbtn>uni-view uni-image[data-v-82523906]{width:1.6vw;height:1.6vw;margin-right:.2vw}.wareaitem .operationbtn .grad-text[data-v-82523906]{background:linear-gradient(90deg,#5b8bb3,#87a1bd);background-size:200% 100%;background-position:0% 50%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transition:background-position .8s linear}@keyframes scalePulse-82523906{0%{transform:scale(1)}25%{transform:scale(.94)}65%{transform:scale(1.08)}to{transform:scale(1)}}.wareaitem .wareaitem-item[data-v-82523906]{width:100%;height:100%;position:fixed;top:0;left:-2vw}.wareaitem .wareaitem-item .itemact1[data-v-82523906]{width:29vw;height:21vw;top:23vw;left:6vw;z-index:31}.wareaitem .wareaitem-item .itemact2[data-v-82523906]{width:26vw;height:16vw;top:15vw;left:41vw;z-index:27}.wareaitem .wareaitem-item .itemact4[data-v-82523906]{width:24vw;height:16vw;top:28vw;left:46vw;z-index:55}.wareaitem .wareaitem-item .itemact3[data-v-82523906]{width:17vw;height:13vw;top:22vw;left:67vw;z-index:36}.wareaitem .wareaitem-item .wclik[data-v-82523906]{width:22vw;height:14vw;top:16vw;left:44vw;z-index:47}.wareaitem .wareaitem-item .gifs[data-v-82523906]{width:41vw;height:20vw;top:21.6vw;left:27.5vw;z-index:29}.wareaitem .wareaitem-item .ys[data-v-82523906]{width:11vw;height:8vw;top:24.2vw;left:57.9vw;z-index:28}.wareaitem .wareaitem-item .wareitem1[data-v-82523906]{width:86vw;height:44vw;top:1vw;left:10.5vw;z-index:15}.wareaitem .wareaitem-item .wareitem4[data-v-82523906]{width:11vw;height:7vw;top:30.9vw;left:60vw}.wareaitem .wareaitem-item .wareitem6[data-v-82523906]{width:17vw;height:12vw;top:28vw;right:-2vw;z-index:35}.wareaitem .wareaitem-item .wareitem5[data-v-82523906]{width:18vw;height:15vw;top:37vw;left:73vw;z-index:35}.wareaitem .wareaitem-item .wareitem8[data-v-82523906]{width:26vw;height:8vw;top:29.7vw;left:21.8vw}.wareaitem .wareaitem-item .wareitem11[data-v-82523906]{width:3vw;height:3vw;top:24.5vw;left:60vw;z-index:35}.wareaitem .wareaitem-item .wareitem10[data-v-82523906]{width:55vw;height:27vw;top:38vw;left:20vw;z-index:36}.wareaitem .wareaitem-item>uni-view[data-v-82523906]{position:absolute}.wareaitem .annotation1[data-v-82523906]{top:21.5vw;left:19.5vw}.wareaitem .annotation2[data-v-82523906]{top:13vw;left:47vw}.wareaitem .annotation3[data-v-82523906]{top:18vw;left:70vw}.wareaitem .annotation4[data-v-82523906]{top:24vw;left:49.3vw}.wareaitem .annotation5[data-v-82523906]{top:34vw;left:74vw}.wareaitem .annotation6[data-v-82523906]{top:24vw;right:6vw}.wareaitem .annotation7[data-v-82523906]{top:62vh;left:40vw}.wareaitem .annotation8[data-v-82523906]{top:5vh;left:28vw}.wareaitem .annotation[data-v-82523906]{width:7vw;height:8vw;z-index:20;position:fixed}.wareaitem .annotation>uni-view[data-v-82523906]{position:relative}.wareaitem .annotation>uni-view[data-v-82523906]:nth-child(2){width:7.8vw;height:3.5vw;z-index:2;margin-left:-.3125rem;display:flex;align-items:center;justify-content:center;border-radius:.8vw .8vw 1.5vw 1.5vw;overflow:hidden}.wareaitem .annotation>uni-view:nth-child(2) uni-image[data-v-82523906]{position:absolute;top:0;left:0}.wareaitem .annotation>uni-view:nth-child(2) uni-text[data-v-82523906]{position:relative;font-weight:400;font-size:1.1vw;color:#fff;z-index:3;margin-top:-.5vw}.wareaitem .annotation>uni-view[data-v-82523906]:nth-child(3){width:3vw;height:5vw;z-index:1;margin:-1vw auto 0}.zhanwei[data-v-82523906]{position:absolute;top:40vh;right:3vw;width:13vw;height:13vw}.content-title[data-v-82523906]{position:absolute;top:3.125rem;left:1.5625rem;display:flex;align-items:center}.content-title .title-imge[data-v-82523906]{width:1.875rem;height:1.875rem}.content-title .title-font[data-v-82523906]{margin-left:.3125rem;font-size:1.09375rem;font-weight:600}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
.clikurlbox[data-v-c0c4a77a]{position:fixed;width:100vw;height:100vw;top:0;left:0;overflow:hidden;z-index:61}.clikurlbox .itemact1[data-v-c0c4a77a]{width:22.3vw;height:13.6vw;bottom:9.8vw;left:12.6vw;z-index:31}.clikurlbox .itemact2[data-v-c0c4a77a]{width:9vw;height:9vw;top:22.5vw;left:16.5vw;z-index:57}.clikurlbox .itemact3[data-v-c0c4a77a]{width:11vw;height:9vw;top:37vw;left:48vw;z-index:55}.clikurlbox .itemact4[data-v-c0c4a77a]{width:14.4vw;height:13vw;top:35vw;right:4.4vw;z-index:65}.clikurlbox .itemact5[data-v-c0c4a77a]{width:14.4vw;height:10vw;bottom:3vw;right:21vw;z-index:65}.clikurlbox .itemact6[data-v-c0c4a77a]{width:18.2vw;height:12vw;top:8vw;left:12vw;z-index:65}.clikurlbox uni-view[data-v-c0c4a77a]{position:fixed;z-index:10}.cardtm[data-v-c0c4a77a]{position:relative;z-index:66}.cardtm>uni-view[data-v-c0c4a77a]{position:fixed;min-width:5vw;height:2.7vw;border-radius:1.35vw;box-shadow:0 0 .3vw rgba(174,174,188,.4);z-index:66;display:flex;align-items:center;padding:0 1vw;white-space:nowrap;z-index:70}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(1){bottom:33.5vh;left:20.5vw}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(2){top:28vw;left:26.5vw}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(3){bottom:21vw;left:55vw}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(4){top:35vw;right:6.5vw}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(5){bottom:11.5vw;right:23.5vw}.cardtm>uni-view[data-v-c0c4a77a]:nth-child(6){top:6vw;left:17vw}.cardtm>uni-view uni-text[data-v-c0c4a77a]{width:1vw;height:1vw;border-radius:50%;border:1px solid #0089fe;margin:0 .4vw 0 0}.cardtm>uni-view uni-view[data-v-c0c4a77a]{width:2.8vw;height:4.4vw;position:absolute;top:2vw;left:30%}.cardtm .actve[data-v-c0c4a77a]{background:linear-gradient(-45deg,#0089fe,#97c1ff)!important;color:#fff!important}.cardtm .actve uni-text[data-v-c0c4a77a]{border:1px solid #fff}.cardtm .b[data-v-c0c4a77a]{background:#eff2f6}.pulu1[data-v-c0c4a77a]{width:28.2vw;height:9.8vw;position:fixed;top:30vw;right:9.2vw;z-index:60;overflow:auto}.pulu1 uni-image[data-v-c0c4a77a]{position:absolute;top:0;left:0}.pulu2[data-v-c0c4a77a]{width:16.8vw;height:24vw;position:fixed;top:30.7vw;right:21.1vw;z-index:60}.pulu2 uni-image[data-v-c0c4a77a]{position:absolute;top:0;left:0}.route[data-v-c0c4a77a]{width:99.5vw;height:51.2vw;position:fixed;top:4.5vw;left:.3vw;z-index:2}.route uni-image[data-v-c0c4a77a]{position:absolute;top:0;left:0}.contitem[data-v-c0c4a77a]{width:48vw;height:36vw;position:fixed;top:5.3vw;left:28.2vw;z-index:50}.hldy[data-v-c0c4a77a]{position:fixed;left:6.7vw;bottom:3.7vw}.home[data-v-c0c4a77a]{width:100vw;height:100vh;overflow:hidden;position:relative;z-index:0}.tp uni-image[data-v-c0c4a77a]{width:100%;height:100%}.contain-right-button[data-v-c0c4a77a]{position:fixed;top:5vh;right:2vw;width:7.3vw;height:3.3vw;background:#fff;border-radius:1.65vw;border:1px solid #D9DADC;font-weight:400;font-size:1.4vw;color:#222;display:flex;justify-content:center;align-items:center;margin:0 0 0 .7vw;color:#555;z-index:99}.contain-right-button uni-image[data-v-c0c4a77a]{width:1.5vw;height:1.3vw;margin:0 .5vw 0 0}
|
||||
.clikurlbox[data-v-832abd68]{position:fixed;width:100vw;height:100vw;top:0;left:0;overflow:hidden;z-index:61}.clikurlbox .itemact1[data-v-832abd68]{width:22.3vw;height:13.6vw;bottom:9.8vw;left:12.6vw;z-index:31}.clikurlbox .itemact2[data-v-832abd68]{width:9vw;height:9vw;top:22.5vw;left:16.5vw;z-index:57}.clikurlbox .itemact3[data-v-832abd68]{width:11vw;height:9vw;top:37vw;left:48vw;z-index:55}.clikurlbox .itemact4[data-v-832abd68]{width:14.4vw;height:13vw;top:35vw;right:4.4vw;z-index:65}.clikurlbox .itemact5[data-v-832abd68]{width:14.4vw;height:10vw;bottom:3vw;right:21vw;z-index:65}.clikurlbox .itemact6[data-v-832abd68]{width:18.2vw;height:12vw;top:8vw;left:12vw;z-index:65}.clikurlbox uni-view[data-v-832abd68]{position:fixed;z-index:10}.cardtm[data-v-832abd68]{position:relative;z-index:66}.cardtm>uni-view[data-v-832abd68]{position:fixed;min-width:5vw;height:2.7vw;border-radius:1.35vw;box-shadow:0 0 .3vw rgba(174,174,188,.4);z-index:66;display:flex;align-items:center;padding:0 1vw;white-space:nowrap;z-index:70}.cardtm>uni-view[data-v-832abd68]:nth-child(1){bottom:33.5vh;left:20.5vw}.cardtm>uni-view[data-v-832abd68]:nth-child(2){top:28vw;left:26.5vw}.cardtm>uni-view[data-v-832abd68]:nth-child(3){bottom:21vw;left:55vw}.cardtm>uni-view[data-v-832abd68]:nth-child(4){top:35vw;right:6.5vw}.cardtm>uni-view[data-v-832abd68]:nth-child(5){bottom:11.5vw;right:23.5vw}.cardtm>uni-view[data-v-832abd68]:nth-child(6){top:6vw;left:17vw}.cardtm>uni-view uni-text[data-v-832abd68]{width:1vw;height:1vw;border-radius:50%;border:1px solid #0089fe;margin:0 .4vw 0 0}.cardtm>uni-view uni-view[data-v-832abd68]{width:2.8vw;height:4.4vw;position:absolute;top:2vw;left:30%}.cardtm .actve[data-v-832abd68]{background:linear-gradient(-45deg,#0089fe,#97c1ff)!important;color:#fff!important}.cardtm .actve uni-text[data-v-832abd68]{border:1px solid #fff}.cardtm .b[data-v-832abd68]{background:#eff2f6}.pulu1[data-v-832abd68]{width:28.2vw;height:9.8vw;position:fixed;top:30vw;right:9.2vw;z-index:60;overflow:auto}.pulu1 uni-image[data-v-832abd68]{position:absolute;top:0;left:0}.pulu2[data-v-832abd68]{width:16.8vw;height:24vw;position:fixed;top:30.7vw;right:21.1vw;z-index:60}.pulu2 uni-image[data-v-832abd68]{position:absolute;top:0;left:0}.route[data-v-832abd68]{width:99.5vw;height:51.2vw;position:fixed;top:4.5vw;left:.3vw;z-index:2}.route uni-image[data-v-832abd68]{position:absolute;top:0;left:0}.contitem[data-v-832abd68]{width:48vw;height:36vw;position:fixed;top:5.3vw;left:28.2vw;z-index:50}.hldy[data-v-832abd68]{position:fixed;left:6.7vw;bottom:3.7vw}.home[data-v-832abd68]{width:100vw;height:100vh;overflow:hidden;position:relative;z-index:0}.tp uni-image[data-v-832abd68]{width:100%;height:100%}.contain-right-button[data-v-832abd68]{position:fixed;top:5vh;right:2vw;width:7.3vw;height:3.3vw;background:#fff;border-radius:1.65vw;border:1px solid #D9DADC;font-weight:400;font-size:1.4vw;color:#222;display:flex;justify-content:center;align-items:center;margin:0 0 0 .7vw;color:#555;z-index:99}.contain-right-button uni-image[data-v-832abd68]{width:1.5vw;height:1.3vw;margin:0 .5vw 0 0}
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
.index-content-other[data-v-a78aa9a4]{width:100%;height:100%;transition:opacity 1s ease;position:relative;background-color:#eff0f4}.index-content-down[data-v-a78aa9a4]{position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%)}.index-content-right[data-v-a78aa9a4]{width:100%;border-radius:1.5625rem;display:flex;align-items:center;padding-top:3.125rem;font-size:1rem;position:relative}.index-content-right .index-content-title[data-v-a78aa9a4]{position:absolute;top:1.875rem;left:1.875rem;display:flex;align-items:center}.index-content-right .index-content-title .shu[data-v-a78aa9a4]{width:.625rem;height:1.5625rem;background:linear-gradient(to right,#0052c2,#00b4ff);border-radius:.625rem;margin-right:.9375rem}.index-content-right .index-content-title .shu-font[data-v-a78aa9a4]{color:#415273;font-size:1.09375rem}.saomiao[data-v-a78aa9a4]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;z-index:1}.saomiao .saoma-input[data-v-a78aa9a4]{background-color:#fff;width:17.1875rem;height:2.8125rem;border-radius:.9375rem;padding-left:3.125rem;z-index:2}.saomiao .left-img[data-v-a78aa9a4]{width:1.5625rem;height:1.5625rem;position:absolute;top:50%;left:.9375rem;transform:translateY(-50%);z-index:3}.saomiao .right-img[data-v-a78aa9a4]{width:1.5625rem;height:1.5625rem;position:absolute;top:50%;right:6.875rem;transform:translateY(-50%);z-index:2}.blue-button[data-v-a78aa9a4]{margin-left:.9375rem;width:5.3125rem;height:2.8125rem;border-radius:1.25rem;display:flex;justify-content:center;align-items:center;color:#007cff;font-size:.9375rem;background-color:#ddf0ff;border:.03125rem solid #007CFF}.big-ball[data-v-a78aa9a4]{width:6.25rem;height:6.25rem;position:absolute;top:50%;left:-1.71875rem;transform:translateY(-50%);border-radius:50%;background-color:#dbe4f6}.big-ball .ball[data-v-a78aa9a4]{width:4.6875rem;height:4.6875rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background-color:#cfddf1}.back-img[data-v-a78aa9a4]{width:.9375rem;height:.9375rem;margin-left:3.125rem;margin-right:.625rem}.big-bgc[data-v-a78aa9a4]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34.375rem;height:34.375rem}.big-img[data-v-a78aa9a4]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:28.125rem;height:28.125rem}.card[data-v-a78aa9a4]{width:18.75rem;margin-left:4%;height:14.0625rem;box-shadow:.09375rem .1875rem .375rem .09375rem rgba(206,206,206,.5);background-color:#f4f5f7;border-radius:.9375rem;margin-top:.15625rem;margin-bottom:1.09375rem;padding:0 .78125rem;position:relative;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.card-title[data-v-a78aa9a4]{width:100%;height:4.0625rem;display:flex;align-items:center;justify-content:space-between}.main-title[data-v-a78aa9a4]{display:flex;align-items:center;margin-top:2.1875rem;margin-bottom:.3125rem}.video-father[data-v-a78aa9a4]{width:1.875rem;height:1.875rem;display:flex;justify-content:center;align-items:center;margin-left:.46875rem}.edit-img[data-v-a78aa9a4]{width:1.25rem;height:.9375rem}.play-img[data-v-a78aa9a4]{position:absolute;top:1.5625rem;right:.9375rem;width:4.0625rem;height:1.71875rem;font-size:.8125rem;border-radius:1.09375rem;border:.0625rem solid #999;display:flex;justify-content:center;align-items:center}.card-tags[data-v-a78aa9a4]{position:absolute;top:1.5625rem;left:0;width:6.25rem;height:2.03125rem;font-size:.78125rem;display:flex;justify-content:center;align-items:center}.popup-any[data-v-a78aa9a4]{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .5s ease;-webkit-backdrop-filter:blur(.03125rem);backdrop-filter:blur(.03125rem);background-color:rgba(236,237,241,.4);z-index:999}.mask[data-v-a78aa9a4]{position:absolute;top:0;right:0;bottom:0;left:0}.rename-father[data-v-a78aa9a4]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:18.75rem;height:14.0625rem;border-radius:.9375rem;box-shadow:.0625rem .125rem .25rem .0625rem rgba(0,0,0,.3);background-color:#fff;display:flex;flex-direction:column;align-items:center;padding:0 .9375rem;z-index:999}.rename-father .rename-title[data-v-a78aa9a4]{width:100%;height:2.5rem;display:flex;justify-content:center;align-items:center;margin-top:.9375rem;margin-bottom:.625rem;font-size:1rem}.rename-father .rename-gray[data-v-a78aa9a4]{width:100%;height:2.5rem;display:flex;color:#a7a7a7;align-items:center}.rename-father .rename-input[data-v-a78aa9a4]{width:100%;height:2.5rem;display:flex;background-color:#f5f6fa;border-radius:.625rem;color:#a7a7a7;align-items:center;padding:0 .625rem;position:relative}.rename-father .rename-input .uni-input[data-v-a78aa9a4]{font-size:.78125rem;width:100%}.rename-father .rename-input .left-img[data-v-a78aa9a4]{width:1.5625rem;height:1.5625rem;margin-right:.46875rem}.rename-father .rename-input .right-img[data-v-a78aa9a4]{position:absolute;right:.9375rem;top:50%;transform:translateY(-50%);width:.9375rem;height:.9375rem}
|
||||
.index-content-other[data-v-9599d5fa]{width:100%;height:100%;transition:opacity 1s ease;position:relative;background-color:#eff0f4}.index-content-down[data-v-9599d5fa]{position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%)}.index-content-right[data-v-9599d5fa]{width:100%;border-radius:1.5625rem;display:flex;align-items:center;padding-top:3.125rem;font-size:1rem;position:relative}.index-content-right .index-content-title[data-v-9599d5fa]{position:absolute;top:1.875rem;left:1.875rem;display:flex;align-items:center}.index-content-right .index-content-title .shu[data-v-9599d5fa]{width:.625rem;height:1.5625rem;background:linear-gradient(to right,#0052c2,#00b4ff);border-radius:.625rem;margin-right:.9375rem}.index-content-right .index-content-title .shu-font[data-v-9599d5fa]{color:#415273;font-size:1.09375rem}.saomiao[data-v-9599d5fa]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;z-index:1}.saomiao .saoma-input[data-v-9599d5fa]{background-color:#fff;width:17.1875rem;height:2.8125rem;border-radius:.9375rem;padding-left:3.125rem;z-index:2}.saomiao .left-img[data-v-9599d5fa]{width:1.5625rem;height:1.5625rem;position:absolute;top:50%;left:.9375rem;transform:translateY(-50%);z-index:3}.saomiao .right-img[data-v-9599d5fa]{width:1.5625rem;height:1.5625rem;position:absolute;top:50%;right:6.875rem;transform:translateY(-50%);z-index:2}.blue-button[data-v-9599d5fa]{margin-left:.9375rem;width:5.3125rem;height:2.8125rem;border-radius:1.25rem;display:flex;justify-content:center;align-items:center;color:#007cff;font-size:.9375rem;background-color:#ddf0ff;border:.03125rem solid #007CFF}.big-ball[data-v-9599d5fa]{width:6.25rem;height:6.25rem;position:absolute;top:50%;left:-1.71875rem;transform:translateY(-50%);border-radius:50%;background-color:#dbe4f6}.big-ball .ball[data-v-9599d5fa]{width:4.6875rem;height:4.6875rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border-radius:50%;background-color:#cfddf1}.back-img[data-v-9599d5fa]{width:.9375rem;height:.9375rem;margin-left:3.125rem;margin-right:.625rem}.big-bgc[data-v-9599d5fa]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34.375rem;height:34.375rem}.big-img[data-v-9599d5fa]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:28.125rem;height:28.125rem}.card[data-v-9599d5fa]{width:18.75rem;margin-left:4%;height:14.0625rem;box-shadow:.09375rem .1875rem .375rem .09375rem rgba(206,206,206,.5);background-color:#f4f5f7;border-radius:.9375rem;margin-top:.15625rem;margin-bottom:1.09375rem;padding:0 .78125rem;position:relative;display:flex;justify-content:center;align-items:center;flex-direction:column;overflow:hidden}.card-title[data-v-9599d5fa]{width:100%;height:4.0625rem;display:flex;align-items:center;justify-content:space-between}.main-title[data-v-9599d5fa]{display:flex;align-items:center;margin-top:2.1875rem;margin-bottom:.3125rem}.video-father[data-v-9599d5fa]{width:1.875rem;height:1.875rem;display:flex;justify-content:center;align-items:center;margin-left:.46875rem}.edit-img[data-v-9599d5fa]{width:1.25rem;height:.9375rem}.play-img[data-v-9599d5fa]{position:absolute;top:1.5625rem;right:.9375rem;width:4.0625rem;height:1.71875rem;font-size:.8125rem;border-radius:1.09375rem;border:.0625rem solid #999;display:flex;justify-content:center;align-items:center}.card-tags[data-v-9599d5fa]{position:absolute;top:1.5625rem;left:0;width:6.25rem;height:2.03125rem;font-size:.78125rem;display:flex;justify-content:center;align-items:center}.popup-any[data-v-9599d5fa]{position:fixed;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .5s ease;-webkit-backdrop-filter:blur(.03125rem);backdrop-filter:blur(.03125rem);background-color:rgba(236,237,241,.4);z-index:999}.mask[data-v-9599d5fa]{position:absolute;top:0;right:0;bottom:0;left:0}.rename-father[data-v-9599d5fa]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:18.75rem;height:14.0625rem;border-radius:.9375rem;box-shadow:.0625rem .125rem .25rem .0625rem rgba(0,0,0,.3);background-color:#fff;display:flex;flex-direction:column;align-items:center;padding:0 .9375rem;z-index:999}.rename-father .rename-title[data-v-9599d5fa]{width:100%;height:2.5rem;display:flex;justify-content:center;align-items:center;margin-top:.9375rem;margin-bottom:.625rem;font-size:1rem}.rename-father .rename-gray[data-v-9599d5fa]{width:100%;height:2.5rem;display:flex;color:#a7a7a7;align-items:center}.rename-father .rename-input[data-v-9599d5fa]{width:100%;height:2.5rem;display:flex;background-color:#f5f6fa;border-radius:.625rem;color:#a7a7a7;align-items:center;padding:0 .625rem;position:relative}.rename-father .rename-input .uni-input[data-v-9599d5fa]{font-size:.78125rem;width:100%}.rename-father .rename-input .left-img[data-v-9599d5fa]{width:1.5625rem;height:1.5625rem;margin-right:.46875rem}.rename-father .rename-input .right-img[data-v-9599d5fa]{position:absolute;right:.9375rem;top:50%;transform:translateY(-50%);width:.9375rem;height:.9375rem}
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 17 KiB |
|
Before Width: | Height: | Size: 218 KiB |
|
Before Width: | Height: | Size: 34 KiB |
|
Before Width: | Height: | Size: 16 KiB |