优化了代码
This commit is contained in:
parent
657ca24410
commit
2462b1b124
|
|
@ -21,130 +21,205 @@
|
||||||
)) -->
|
)) -->
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<image :src="isError ? defaultImage : links[currentIndex]" :style="{ width: width, height: height }"
|
<image :src="displaySrc" :style="{ width: width, height: height }" :mode="objectFit" @error="handleError"
|
||||||
:mode="objectFit" @error="isError = true" @load="isError = false" />
|
@load="handleLoad" />
|
||||||
<button v-if="showButton" @click="$emit('update:playing', !playing)">
|
<button v-if="showButton" @click="togglePlaying">
|
||||||
{{ playing ? '停止播放' : '开始播放' }}
|
{{ playing ? '停止播放' : '开始播放' }}
|
||||||
</button>
|
</button>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup lang="ts">
|
||||||
import {
|
import { ref, computed, watch, onUnmounted } from 'vue'
|
||||||
ref,
|
|
||||||
watch,
|
|
||||||
onUnmounted
|
|
||||||
} from 'vue'
|
|
||||||
|
|
||||||
// 定义组件的 props
|
/* ---------------- props ---------------- */
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
// links是图片地址所组成的数组
|
|
||||||
links: {
|
links: {
|
||||||
type: Array,
|
type: Array as () => string[],
|
||||||
default: () => []
|
default: () => []
|
||||||
},
|
},
|
||||||
// 长宽的值可以传任何类型
|
width: { type: String, default: '65rpx' },
|
||||||
width: {
|
height: { type: String, default: '65rpx' },
|
||||||
type: String,
|
objectFit: { type: String, default: 'aspectFill' },
|
||||||
default: '65rpx'
|
defaultImage: { type: String, default: '' },
|
||||||
},
|
interval: { type: Number, default: 80 }, // ms
|
||||||
height: {
|
playing: { type: Boolean, default: false },
|
||||||
type: String,
|
showButton: { type: Boolean, default: false },
|
||||||
default: '65rpx'
|
loop: { type: Boolean, default: false },
|
||||||
},
|
// 可选:每帧最大重试次数(失败后跳过)
|
||||||
// 展示的动画中每一帧的图片类型
|
maxRetryPerFrame: { type: Number, default: 1 }
|
||||||
objectFit: {
|
|
||||||
type: String,
|
|
||||||
default: 'aspectFill'
|
|
||||||
},
|
|
||||||
// 动画如果加载失败,展示的图片
|
|
||||||
defaultImage: {
|
|
||||||
type: String,
|
|
||||||
default: ''
|
|
||||||
},
|
|
||||||
// 注意这是每一帧图片的间隔,这个值越小加载的越快
|
|
||||||
interval: {
|
|
||||||
type: Number,
|
|
||||||
default: 80
|
|
||||||
},
|
|
||||||
// 注意,因为这是监听的机制,所以默认转态必须是false,然后在mounted这类钩子或按钮变成true来播放
|
|
||||||
playing: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
// 展示是否停止、开启动画的按钮
|
|
||||||
showButton: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
// 重要:动画时候会不停的循环
|
|
||||||
loop: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
}
|
|
||||||
})
|
})
|
||||||
|
|
||||||
// 定义组件发出的事件
|
|
||||||
const emit = defineEmits(['update:playing'])
|
const emit = defineEmits(['update:playing'])
|
||||||
|
|
||||||
// 组件内部状态
|
/* ---------------- local state ---------------- */
|
||||||
const currentIndex = ref(0) // 当前播放的图片索引
|
const currentIndex = ref(0)
|
||||||
const isPlaying = ref(false) // 是否正在播放
|
const internalPlaying = ref(false) // 与 props.playing 同步(主要用于内部判断)
|
||||||
const isError = ref(false) // 当前图片是否加载失败
|
const timer : { id : number | null } = { id: null } // 使用对象包装,方便类型
|
||||||
let timer = null // 定时器
|
// 记录每帧失败次数
|
||||||
|
const frameRetries = new Map<number, number>()
|
||||||
|
// 记录已经判定为“失败很严重、需要显示默认图”的帧
|
||||||
|
const failedFrames = new Set<number>()
|
||||||
|
|
||||||
// 开始播放
|
/* ---------------- helpers / computed ---------------- */
|
||||||
const startPlay = () => {
|
const hasLinks = computed(() => Array.isArray(props.links) && props.links.length > 0)
|
||||||
if (isPlaying.value) return
|
const displaySrc = computed(() => {
|
||||||
isPlaying.value = true
|
if (!hasLinks.value) {
|
||||||
timer = setInterval(() => {
|
return props.defaultImage || ''
|
||||||
if (props.loop) {
|
}
|
||||||
// 循环播放:使用模运算循环索引
|
// 如果该帧被标为失败则显示 defaultImage(兜底)
|
||||||
currentIndex.value = (currentIndex.value + 1) % props.links.length
|
if (failedFrames.has(currentIndex.value) && props.defaultImage) {
|
||||||
isError.value = false
|
return props.defaultImage
|
||||||
} else {
|
}
|
||||||
// 非循环播放:到末尾时停止
|
// 正常显示链接(或 defaultImage 如果索引越界)
|
||||||
if (currentIndex.value < props.links.length - 1) {
|
const idx = currentIndex.value
|
||||||
currentIndex.value++
|
return props.links[idx] || props.defaultImage || ''
|
||||||
isError.value = false
|
})
|
||||||
} else {
|
|
||||||
stopPlay()
|
/* ---------------- play control (使用递归 setTimeout) ---------------- */
|
||||||
|
function clearTimer() {
|
||||||
|
if (timer.id !== null) {
|
||||||
|
clearTimeout(timer.id)
|
||||||
|
timer.id = null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function scheduleNextTick() {
|
||||||
|
// 防止重复 schedule
|
||||||
|
if (timer.id !== null) return
|
||||||
|
timer.id = setTimeout(() => {
|
||||||
|
timer.id = null
|
||||||
|
tickFrame()
|
||||||
|
// 继续循环(如果仍在播放)
|
||||||
|
if (props.playing) {
|
||||||
|
// 若没有 links 则不再 schedule
|
||||||
|
if (hasLinks.value) {
|
||||||
|
scheduleNextTick()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}, props.interval)
|
}, Math.max(16, props.interval)) as unknown as number
|
||||||
}
|
}
|
||||||
|
|
||||||
// 停止播放
|
function startPlay() {
|
||||||
const stopPlay = () => {
|
if (!hasLinks.value) return
|
||||||
isPlaying.value = false
|
if (timer.id !== null) return
|
||||||
clearInterval(timer)
|
internalPlaying.value = true
|
||||||
|
scheduleNextTick()
|
||||||
}
|
}
|
||||||
|
|
||||||
// 监听 playing 属性变化
|
function stopPlay() {
|
||||||
|
internalPlaying.value = false
|
||||||
|
clearTimer()
|
||||||
|
}
|
||||||
|
|
||||||
|
function tickFrame() {
|
||||||
|
// 当没有帧时什么也不做
|
||||||
|
if (!hasLinks.value) return
|
||||||
|
|
||||||
|
const len = props.links.length
|
||||||
|
if (len === 0) return
|
||||||
|
|
||||||
|
if (props.loop) {
|
||||||
|
// 循环播放
|
||||||
|
currentIndex.value = (currentIndex.value + 1) % len
|
||||||
|
} else {
|
||||||
|
// 非循环播放:到末尾停止并通知父组件
|
||||||
|
if (currentIndex.value < len - 1) {
|
||||||
|
currentIndex.value++
|
||||||
|
} else {
|
||||||
|
// 到尾了,停止播放
|
||||||
|
stopPlay()
|
||||||
|
// 告知父组件(保持 playing 为单一真相)
|
||||||
|
emit('update:playing', false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------------- image event handlers ---------------- */
|
||||||
|
function handleError() {
|
||||||
|
// 记录重试次数并决定是否跳过该帧
|
||||||
|
const idx = currentIndex.value
|
||||||
|
const prev = frameRetries.get(idx) || 0
|
||||||
|
const nextCount = prev + 1
|
||||||
|
frameRetries.set(idx, nextCount)
|
||||||
|
|
||||||
|
if (nextCount > (props.maxRetryPerFrame || 0)) {
|
||||||
|
// 标记为失败帧,用 defaultImage 兜底并尝试跳到下一帧(避免卡住)
|
||||||
|
failedFrames.add(idx)
|
||||||
|
// 立即跳到下一帧(但不用强制立即 schedule — 因为 scheduleNextTick 会继续)
|
||||||
|
// 若你想立即切换也可以直接调用 tickFrame()
|
||||||
|
if (hasLinks.value) {
|
||||||
|
// 如果是 loop 模式或尚未到尾(非 loop),直接 advance,否则 stop
|
||||||
|
if (props.loop || currentIndex.value < props.links.length - 1) {
|
||||||
|
// 立即 advance 一帧,但不要重复 schedule(tickFrame 内部不依赖 timer)
|
||||||
|
tickFrame()
|
||||||
|
} else {
|
||||||
|
stopPlay()
|
||||||
|
emit('update:playing', false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 尝试跳过到下一帧(减少卡顿风险)
|
||||||
|
if (hasLinks.value) {
|
||||||
|
if (props.loop || currentIndex.value < props.links.length - 1) {
|
||||||
|
tickFrame()
|
||||||
|
} else {
|
||||||
|
stopPlay()
|
||||||
|
emit('update:playing', false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleLoad() {
|
||||||
|
// 成功加载清理重试记录(该帧已正常)
|
||||||
|
const idx = currentIndex.value
|
||||||
|
frameRetries.delete(idx)
|
||||||
|
failedFrames.delete(idx)
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------------- watch props ---------------- */
|
||||||
|
// 以 props.playing 为单一真相源;当 props.playing 改变时启动/停止
|
||||||
watch(() => props.playing, (val) => {
|
watch(() => props.playing, (val) => {
|
||||||
currentIndex.value = 0
|
|
||||||
if (val) {
|
if (val) {
|
||||||
|
// reset index 到 0(可选,如果你希望保留进度可以去掉)
|
||||||
|
// currentIndex.value = 0
|
||||||
startPlay()
|
startPlay()
|
||||||
} else {
|
} else {
|
||||||
stopPlay()
|
stopPlay()
|
||||||
setTimeout(() => currentIndex.value = 0, 50)
|
// 保证视觉上复位到首帧(可选)
|
||||||
|
setTimeout(() => {
|
||||||
|
currentIndex.value = 0
|
||||||
|
}, 50)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
// 监听 links 数组变化
|
// 监听 links 的引用变化(但不要 deep watch)
|
||||||
watch(() => props.links, () => {
|
// 当父组件传入新的数组对象时触发:重置状态,清理 retry/failed 信息
|
||||||
|
watch(() => props.links, (newLinks, oldLinks) => {
|
||||||
|
// 如果引用相同且长度相同,尽量不重置(减少不必要抖动)
|
||||||
|
if (newLinks === oldLinks) return
|
||||||
|
// 重置索引和错误记录
|
||||||
currentIndex.value = 0
|
currentIndex.value = 0
|
||||||
isError.value = false
|
frameRetries.clear()
|
||||||
if (isPlaying.value) {
|
failedFrames.clear()
|
||||||
|
// 如果当前 props.playing 为 true,重启播放(先清理 timer 再开始)
|
||||||
|
if (props.playing) {
|
||||||
stopPlay()
|
stopPlay()
|
||||||
|
// 延迟一点点再启动,避免连续多次触发时重复 schedule
|
||||||
|
setTimeout(() => {
|
||||||
|
if (props.playing) startPlay()
|
||||||
|
}, 30)
|
||||||
}
|
}
|
||||||
}, {
|
}, { immediate: false })
|
||||||
deep: true
|
|
||||||
})
|
|
||||||
|
|
||||||
// 组件销毁时清理定时器
|
/* ---------------- toggle via internal button ---------------- */
|
||||||
|
function togglePlaying() {
|
||||||
|
emit('update:playing', !props.playing)
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------------- cleanup ---------------- */
|
||||||
onUnmounted(() => {
|
onUnmounted(() => {
|
||||||
stopPlay()
|
clearTimer()
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -1577,7 +1577,7 @@
|
||||||
|
|
||||||
.message-view {
|
.message-view {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
font-size: 25rpx;
|
||||||
.message-shu {
|
.message-shu {
|
||||||
width: 3rpx;
|
width: 3rpx;
|
||||||
height: 1.5vw;
|
height: 1.5vw;
|
||||||
|
|
|
||||||
|
|
@ -1453,20 +1453,6 @@
|
||||||
margin-left: -5rpx;
|
margin-left: -5rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
.target-gray {
|
|
||||||
background-color: #F8F8FA;
|
|
||||||
border: 1rpx solid #D5D5D5;
|
|
||||||
display: flex;
|
|
||||||
height: 100%;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 18rpx;
|
|
||||||
border-radius: 10rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #222222;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.target-contain {
|
.target-contain {
|
||||||
|
|
@ -1550,7 +1536,7 @@
|
||||||
top: 310rpx;
|
top: 310rpx;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 472rpx;
|
height: 490rpx;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border: 2rpx solid rgba(0, 137, 254, 0.29);
|
border: 2rpx solid rgba(0, 137, 254, 0.29);
|
||||||
border-radius: 35rpx;
|
border-radius: 35rpx;
|
||||||
|
|
@ -1800,7 +1786,7 @@
|
||||||
right: 20rpx;
|
right: 20rpx;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
transform: translateY(-50%);
|
transform: translateY(-50%);
|
||||||
width: 200rpx;
|
width: 220rpx;
|
||||||
height: 70%;
|
height: 70%;
|
||||||
background-color: #0089FE;
|
background-color: #0089FE;
|
||||||
border-radius: 20rpx;
|
border-radius: 20rpx;
|
||||||
|
|
@ -1809,6 +1795,13 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-size: 35rpx;
|
font-size: 35rpx;
|
||||||
|
|
||||||
|
.white-imge {
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
margin-right: 5rpx;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2128,16 +2121,17 @@
|
||||||
|
|
||||||
.packtarget-end {
|
.packtarget-end {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 200rpx;
|
height: 240rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
padding-top: 15rpx;
|
padding-top: 15rpx;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
/* background-color: red; */
|
||||||
|
|
||||||
|
|
||||||
.target-edit {
|
.target-edit {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 5rpx;
|
right: 5rpx;
|
||||||
bottom: -20rpx;
|
bottom: 0rpx;
|
||||||
width: 130rpx;
|
width: 130rpx;
|
||||||
height: 60rpx;
|
height: 60rpx;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
@ -2151,8 +2145,8 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.end-icon {
|
.end-icon {
|
||||||
width: 100rpx;
|
width: 80rpx;
|
||||||
height: 100rpx;
|
height: 80rpx;
|
||||||
margin-left: 20rpx;
|
margin-left: 20rpx;
|
||||||
margin-top: 5rpx;
|
margin-top: 5rpx;
|
||||||
margin-right: 20rpx;
|
margin-right: 20rpx;
|
||||||
|
|
@ -2165,15 +2159,12 @@
|
||||||
border: 1rpx solid #D5D5D5;
|
border: 1rpx solid #D5D5D5;
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 35rpx;
|
height: 35rpx;
|
||||||
width: 100%;
|
padding: 0 10rpx;
|
||||||
/* align-items: center; */
|
|
||||||
/* padding: 0 10rpx; */
|
|
||||||
border-radius: 10rpx;
|
border-radius: 10rpx;
|
||||||
font-size: 23rpx;
|
font-size: 25rpx;
|
||||||
color: #222222;
|
color: #7a7a7a;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 10rpx;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.packtarget-title {
|
.packtarget-title {
|
||||||
|
|
@ -2186,7 +2177,7 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 2.5rpx;
|
top: 2.5rpx;
|
||||||
left: 0;
|
left: 0;
|
||||||
font-size: 31rpx;
|
font-size: 32rpx;
|
||||||
/* margin-top: 3rpx; */
|
/* margin-top: 3rpx; */
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -2199,7 +2190,10 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.packtarget-serviceContent {
|
.packtarget-serviceContent {
|
||||||
width: 350rpx;
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 100rpx;
|
||||||
|
width: 530rpx;
|
||||||
height: 70rpx;
|
height: 70rpx;
|
||||||
margin-top: 10rpx;
|
margin-top: 10rpx;
|
||||||
font-size: 25rpx;
|
font-size: 25rpx;
|
||||||
|
|
@ -2406,11 +2400,13 @@
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
}
|
}
|
||||||
.includestwo-father{
|
|
||||||
|
.includestwo-father {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
margin-top: 5rpx;
|
margin-top: 5rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.includestwo {
|
.includestwo {
|
||||||
|
|
||||||
width: 110rpx;
|
width: 110rpx;
|
||||||
|
|
@ -2423,26 +2419,32 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.includestwo-detail{
|
|
||||||
|
.includestwo-detail {
|
||||||
font-size: 25rpx;
|
font-size: 25rpx;
|
||||||
margin-left: 10rpx;
|
margin-left: 10rpx;
|
||||||
}
|
}
|
||||||
.includestwo-image{
|
|
||||||
|
.includestwo-image {
|
||||||
width: 12rpx;
|
width: 12rpx;
|
||||||
height: 11rpx;
|
height: 11rpx;
|
||||||
margin-left: 6rpx;
|
margin-left: 6rpx;
|
||||||
}
|
}
|
||||||
.target-gray-spec{
|
|
||||||
|
.target-gray-spec {
|
||||||
background-color: #F8F8FA;
|
background-color: #F8F8FA;
|
||||||
border: 1rpx solid #D5D5D5;
|
border: 1rpx solid #D5D5D5;
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 35rpx;
|
height: 35rpx;
|
||||||
/* align-items: center; */
|
|
||||||
padding: 0 10rpx;
|
padding: 0 10rpx;
|
||||||
border-radius: 10rpx;
|
border-radius: 10rpx;
|
||||||
font-size: 25rpx;
|
font-size: 25rpx;
|
||||||
color: #222222;
|
color: #222222;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
/* margin-top: 10rpx; */
|
}
|
||||||
|
.gray-view{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 7rpx;
|
||||||
}
|
}
|
||||||
|
|
@ -64,7 +64,7 @@
|
||||||
<!-- <view class="card-bao" v-if="item1.izPackage==`Y`">
|
<!-- <view class="card-bao" v-if="item1.izPackage==`Y`">
|
||||||
包
|
包
|
||||||
</view> -->
|
</view> -->
|
||||||
<!-- <image class="more-card"
|
<!-- <image class="more-card"
|
||||||
v-if="item1.includesarray && item1.includesarray.length>1"
|
v-if="item1.includesarray && item1.includesarray.length>1"
|
||||||
src="/static/index/manycards.png" /> -->
|
src="/static/index/manycards.png" /> -->
|
||||||
<view :class="getClass(item1,index0,index1)"
|
<view :class="getClass(item1,index0,index1)"
|
||||||
|
|
@ -82,16 +82,18 @@
|
||||||
class="title-time-font-tags">
|
class="title-time-font-tags">
|
||||||
({{ item1.directiveName?splitString(item1.directiveName)[1]:""}})
|
({{ item1.directiveName?splitString(item1.directiveName)[1]:""}})
|
||||||
</view>
|
</view>
|
||||||
<view class="includestwo-father" v-if="item1.includesarray && item1.includesarray.length>1">
|
<view class="includestwo-father"
|
||||||
|
v-if="item1.includesarray && item1.includesarray.length>1">
|
||||||
<view class="includestwo">
|
<view class="includestwo">
|
||||||
指令集合
|
指令集合
|
||||||
</view>
|
</view>
|
||||||
<view class="includestwo-detail">
|
<view class="includestwo-detail">
|
||||||
详情
|
详情
|
||||||
</view>
|
</view>
|
||||||
<image class="includestwo-image" src="/static/index/rightmore.png" />
|
<image class="includestwo-image"
|
||||||
|
src="/static/index/rightmore.png" />
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view v-if="item1.startTime" class="card-time">
|
<view v-if="item1.startTime" class="card-time">
|
||||||
|
|
||||||
<view class="weight-time">
|
<view class="weight-time">
|
||||||
|
|
@ -307,7 +309,7 @@
|
||||||
{{ bottomItems[moreindex]?.directiveName }}
|
{{ bottomItems[moreindex]?.directiveName }}
|
||||||
</view>
|
</view>
|
||||||
<view class="detail-contain">
|
<view class="detail-contain">
|
||||||
{{ bottomItems[moreindex]?.serviceContent }}
|
{{ bottomItems[moreindex]?.serviceContent || `暂无指令详细信息` }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -349,16 +351,18 @@
|
||||||
<!-- <view class="servers-heng" :style="ruleritem.izPackage==`Y`?{left:`114rpx`}:{}"
|
<!-- <view class="servers-heng" :style="ruleritem.izPackage==`Y`?{left:`114rpx`}:{}"
|
||||||
v-show="ruleritem.directiveName"></view> -->
|
v-show="ruleritem.directiveName"></view> -->
|
||||||
|
|
||||||
<image class="explain-icon" @click.stop="clickexplainopen" style="top: 25rpx;" v-if="ruleritem.includesarray?.length !== 1 "
|
<image class="explain-icon" @click.stop="clickexplainopen" style="top: 25rpx;"
|
||||||
|
v-if="ruleritem.includesarray?.length !== 1 "
|
||||||
src="/static/index/procurement/explain.png" mode="aspectFill"></image>
|
src="/static/index/procurement/explain.png" mode="aspectFill"></image>
|
||||||
|
|
||||||
<view class="explain-text" v-show="explainopen" style="top: 78rpx;" :style="ruleritem.includesarray?.length >1?{height:`80rpx`}:{height:`160rpx`}">
|
<view class="explain-text" v-show="explainopen" style="top: 78rpx;"
|
||||||
|
:style="ruleritem.includesarray?.length >1?{height:`80rpx`}:{height:`160rpx`}">
|
||||||
<view class="triangle">
|
<view class="triangle">
|
||||||
<view class="triangle-small"></view>
|
<view class="triangle-small"></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="">
|
<view class="">
|
||||||
{{ ruleritem.includesarray?.length >1?`长按可进行删除操作。`:`双击服务指令可添加矩阵, 长按服务指令可拖动到即时指令区进行添加。` }}
|
{{ ruleritem.includesarray?.length >1?`长按可进行删除操作。`:`双击服务指令可添加矩阵, 长按服务指令可拖动到即时指令区进行添加。` }}
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -473,7 +477,7 @@
|
||||||
{{ savePackagelist[packnumber]?.directives[packdetail]?.directiveName }}
|
{{ savePackagelist[packnumber]?.directives[packdetail]?.directiveName }}
|
||||||
</view>
|
</view>
|
||||||
<view class="detail-contain">
|
<view class="detail-contain">
|
||||||
{{ savePackagelist[packnumber]?.directives[packdetail]?.serviceContent }}
|
{{ savePackagelist[packnumber]?.directives[packdetail]?.serviceContent || `暂无指令详细信息` }}
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -529,7 +533,7 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="target-smalltext">
|
<view class="target-smalltext">
|
||||||
{{ ruleritem.serviceContent }}
|
{{ ruleritem.serviceContent || `暂无指令详细信息` }}
|
||||||
</view>
|
</view>
|
||||||
<view class="target-edit" style="right: 150rpx;" @click.stop="editcardname(0)"
|
<view class="target-edit" style="right: 150rpx;" @click.stop="editcardname(0)"
|
||||||
v-show="editingmode">
|
v-show="editingmode">
|
||||||
|
|
@ -561,10 +565,10 @@
|
||||||
<text v-if="!editingmode">
|
<text v-if="!editingmode">
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.newtypename }}
|
{{ ruleritem?.includesarray[packtargetindex]?.newtypename }}
|
||||||
</text>
|
</text>
|
||||||
<text class="packtarget-blue" v-else @click.stop="edititems(ruleritem,true)">
|
<text class="packtarget-blue" v-else @click.stop="edititems(ruleritem?.includesarray[packtargetindex],true)">
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.newtypename }}
|
{{ ruleritem?.includesarray[packtargetindex]?.newtypename }}
|
||||||
</text>
|
</text>
|
||||||
|
|
||||||
<view class="packtarget-shu">
|
<view class="packtarget-shu">
|
||||||
|
|
|
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -579,7 +583,8 @@
|
||||||
<view class="details" :style="packtargetindex==index?{color:`#0089FE`}:{}"
|
<view class="details" :style="packtargetindex==index?{color:`#0089FE`}:{}"
|
||||||
v-for="(item,index) in ruleritem?.includesarray"
|
v-for="(item,index) in ruleritem?.includesarray"
|
||||||
@touchstart="startdeletedetail" @touchend="enddeletedetail"
|
@touchstart="startdeletedetail" @touchend="enddeletedetail"
|
||||||
@click.stop="cleanallopen();packtargetindex=index;killbaddata = true" :key="index">
|
@click.stop="cleanallopen();packtargetindex=index;killbaddata = true"
|
||||||
|
:key="index">
|
||||||
<image class="detail-icon" :class="detailshake?`wiggle`:``" :src="
|
<image class="detail-icon" :class="detailshake?`wiggle`:``" :src="
|
||||||
index === packtargetindex
|
index === packtargetindex
|
||||||
? (item.immediateFileFocus ? serverUrl + item.immediateFileFocus : noimageshowtarget)
|
? (item.immediateFileFocus ? serverUrl + item.immediateFileFocus : noimageshowtarget)
|
||||||
|
|
@ -610,17 +615,19 @@
|
||||||
: noimageshow
|
: noimageshow
|
||||||
" mode="aspectFill">
|
" mode="aspectFill">
|
||||||
</image>
|
</image>
|
||||||
<view class="target-gray">
|
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.categoryName }}
|
|
||||||
</view>
|
|
||||||
<view class="target-gray">
|
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.typeName }}
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="">
|
<view class="">
|
||||||
<view class="packtarget-title">
|
<view class="packtarget-title">
|
||||||
<!-- <view class="target-gray">
|
<view class="target-black">
|
||||||
|
{{ splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[0] + (splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1]?`(${splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1]})`:"") }}
|
||||||
|
</view>
|
||||||
|
<view class="target-black"
|
||||||
|
v-if="splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1] ">
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="gray-view">
|
||||||
|
<view class="target-gray">
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.categoryName }}
|
{{ ruleritem?.includesarray[packtargetindex]?.categoryName }}
|
||||||
</view>
|
</view>
|
||||||
<view class="target-shu">
|
<view class="target-shu">
|
||||||
|
|
@ -628,23 +635,18 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="target-gray">
|
<view class="target-gray">
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.typeName }}
|
{{ ruleritem?.includesarray[packtargetindex]?.typeName }}
|
||||||
</view> -->
|
|
||||||
<view class="target-black">
|
|
||||||
{{ splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[0] + (splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1]?`(${splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1]})`:"") }}
|
|
||||||
</view>
|
</view>
|
||||||
<view class="target-black"
|
</view>
|
||||||
v-if="splitString(ruleritem?.includesarray[packtargetindex]?.directiveName)[1] ">
|
|
||||||
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="packtarget-serviceContent">
|
|
||||||
{{ ruleritem?.includesarray[packtargetindex]?.serviceContent }}
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
<!-- <view class="target-edit" style="right: 150rpx;" @click.stop="editcardname(1)"
|
<!-- <view class="target-edit" style="right: 150rpx;" @click.stop="editcardname(1)"
|
||||||
v-show="editingmode">
|
v-show="editingmode">
|
||||||
修改
|
修改
|
||||||
</view> -->
|
</view> -->
|
||||||
|
<view class="packtarget-serviceContent">
|
||||||
|
{{ ruleritem?.includesarray[packtargetindex]?.serviceContent || `暂无指令详细信息` }}
|
||||||
|
</view>
|
||||||
<view class="target-edit" @click.stop="editcardname(0)" v-show="editingmode">
|
<view class="target-edit" @click.stop="editcardname(0)" v-show="editingmode">
|
||||||
添加
|
添加
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -656,9 +658,9 @@
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="edit-open" v-show="editopen" @click.stop>
|
<view class="edit-open" :style="whitetou?{top:`160rpx`}:{}" v-show="editopen" @click.stop>
|
||||||
<view class="edit-menu">
|
<view class="edit-menu">
|
||||||
<view class="triangle" v-show="!whitetou">
|
<view class="triangle" :style="whitetou?{right:`390rpx`}:{}">
|
||||||
<view class="triangle-small"></view>
|
<view class="triangle-small"></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="edit-tags" :style="edittype===index?{fontWeight:`800`}:{}"
|
<view class="edit-tags" :style="edittype===index?{fontWeight:`800`}:{}"
|
||||||
|
|
@ -742,7 +744,8 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="blue-right" @click="cleanallopen();editingmode = !editingmode">
|
<view class="blue-right" @click="cleanallopen();editingmode = !editingmode">
|
||||||
{{ editingmode?"确定":"+编辑" }}
|
<image class="white-imge" src="/static/index/changemode.png" />
|
||||||
|
{{ editingmode?"只读模式":"编辑模式" }}
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -1017,7 +1020,13 @@
|
||||||
nosave.value.cycleValue = Number(inputnum.value).toString()
|
nosave.value.cycleValue = Number(inputnum.value).toString()
|
||||||
}
|
}
|
||||||
isclickright.value = true
|
isclickright.value = true
|
||||||
let allobject = ruleritem.value
|
let allobject = {}
|
||||||
|
if(whitetou.value){
|
||||||
|
allobject = smallcard.value
|
||||||
|
}else{
|
||||||
|
allobject = ruleritem.value
|
||||||
|
}
|
||||||
|
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
const ts = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')} ${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}:${now.getSeconds().toString().padStart(2, '0')}`;
|
const ts = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')} ${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}:${now.getSeconds().toString().padStart(2, '0')}`;
|
||||||
let data = {
|
let data = {
|
||||||
|
|
@ -1034,10 +1043,10 @@
|
||||||
optCount: nosave.value.optCount,
|
optCount: nosave.value.optCount,
|
||||||
optTime: ts,
|
optTime: ts,
|
||||||
}
|
}
|
||||||
console.log("啥情况", data)
|
// console.log("啥情况", data)
|
||||||
// return
|
|
||||||
editDirective(data).then((res) => {
|
editDirective(data).then((res) => {
|
||||||
console.log("啥情况", res)
|
// console.log("啥情况1111", res)
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
geteverything()
|
geteverything()
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
@ -1084,8 +1093,13 @@
|
||||||
optCount: "",
|
optCount: "",
|
||||||
})
|
})
|
||||||
const whitetou = ref(false);
|
const whitetou = ref(false);
|
||||||
|
const smallcard = ref({});
|
||||||
const edititems = (item : any, whitetoushow : boolean) => {
|
const edititems = (item : any, whitetoushow : boolean) => {
|
||||||
|
if(whitetoushow){
|
||||||
|
smallcard.value = item;
|
||||||
|
}
|
||||||
whitetou.value = whitetoushow
|
whitetou.value = whitetoushow
|
||||||
|
|
||||||
nosave.value.cycleTypeId = item.cycleTypeId;
|
nosave.value.cycleTypeId = item.cycleTypeId;
|
||||||
nosave.value.cycleValue = item.cycleValue
|
nosave.value.cycleValue = item.cycleValue
|
||||||
nosave.value.optCount = item.optCount
|
nosave.value.optCount = item.optCount
|
||||||
|
|
|
||||||
|
|
@ -484,7 +484,7 @@
|
||||||
margin-top: 2vw;
|
margin-top: 2vw;
|
||||||
margin-bottom: 0.8vw;
|
margin-bottom: 0.8vw;
|
||||||
margin-left: 1.2vw;
|
margin-left: 1.2vw;
|
||||||
background: red;
|
// background: red;
|
||||||
// padding: 0.2vw;
|
// padding: 0.2vw;
|
||||||
// padding: 0.5vw;
|
// padding: 0.5vw;
|
||||||
// margin: 0.7vw auto 0.3vw;
|
// margin: 0.7vw auto 0.3vw;
|
||||||
|
|
|
||||||
|
|
@ -249,7 +249,7 @@
|
||||||
// console.log("???????????????",res.result.records[0].permissionList)
|
// console.log("???????????????",res.result.records[0].permissionList)
|
||||||
arrlist.value = [{ name: '首页', url: '/static/shouye/sy/h0.png', urls: '/static/shouye/sy/h1.png', type: 'hldy' }];
|
arrlist.value = [{ name: '首页', url: '/static/shouye/sy/h0.png', urls: '/static/shouye/sy/h1.png', type: 'hldy' }];
|
||||||
let tbr = [];
|
let tbr = [];
|
||||||
console.log("xxxx",res)
|
// console.log("xxxx",res)
|
||||||
if (arr) {
|
if (arr) {
|
||||||
arr.forEach((v, i) => {
|
arr.forEach((v, i) => {
|
||||||
let obj = arrs.find(item =>
|
let obj = arrs.find(item =>
|
||||||
|
|
|
||||||
|
|
@ -158,7 +158,7 @@
|
||||||
onShow(() => {
|
onShow(() => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
playall.value = true;
|
playall.value = true;
|
||||||
}, 2000)
|
}, 300)
|
||||||
|
|
||||||
zyupgrade.value?.check_update();
|
zyupgrade.value?.check_update();
|
||||||
queryPadPageList().then((res => {
|
queryPadPageList().then((res => {
|
||||||
|
|
@ -370,11 +370,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
const ceshijump = () => {
|
const ceshijump = () => {
|
||||||
ceshiopen.value = true
|
// ceshiopen.value = true
|
||||||
// uni.navigateTo({
|
// uni.navigateTo({
|
||||||
// url:"/pages/login/ceshi"
|
// url:"/pages/login/ceshi"
|
||||||
// })
|
// })
|
||||||
console.log("wtf")
|
// console.log("wtf")
|
||||||
// try {
|
// try {
|
||||||
// const Intent = plus.android.importClass('android.content.Intent')
|
// const Intent = plus.android.importClass('android.content.Intent')
|
||||||
// const Uri = plus.android.importClass('android.net.Uri')
|
// const Uri = plus.android.importClass('android.net.Uri')
|
||||||
|
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Loading…
Reference in New Issue