From 4a800a8fc83c6bd1f86a8e847b079a51a7532c09 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 20 七月 2022 15:05:58 +0800
Subject: [PATCH] 修复国标配置的bug
---
src/pages/cameraAccess/components/scene/SlideScene.vue | 88 ++++++++++++++++++++++++++++++--------------
1 files changed, 60 insertions(+), 28 deletions(-)
diff --git a/src/pages/cameraAccess/components/scene/SlideScene.vue b/src/pages/cameraAccess/components/scene/SlideScene.vue
index ee755f0..289192c 100644
--- a/src/pages/cameraAccess/components/scene/SlideScene.vue
+++ b/src/pages/cameraAccess/components/scene/SlideScene.vue
@@ -1,76 +1,108 @@
<template>
<div class="swiper-box">
- <p class="task-tip" v-if="sceneData.length == 0 ">鏆傛棤鍦烘櫙锛岃寮�濮嬪垱寤�</p>
+ <p class="task-tip" v-if="sceneData.length == 0">鏆傛棤鍦烘櫙锛岃寮�濮嬪垱寤�</p>
<swiper
ref="sceneSwiper"
- v-if="sceneData.length>=1"
+ v-if="sceneData.length >= 1"
:options="swiperOption"
class="swiper-box-container"
>
- <swiper-slide v-for="item in sceneData" :key="item.id+'s'">
+ <swiper-slide v-for="item in sceneData" :key="item.id + 's'">
<div class="wrap-box">
<div class="inner">
<div class="scenario-icon">
- <div class="single" v-if="item.rules.length==1">
+ <div class="single" v-if="item.rules.length == 1">
<div class="svg-wrap">
<!-- <svg class="icon" aria-hidden="true" style="font-size:4rem;">
<use :xlink:href="`#${item.rules[0].icon}`" />
</svg>-->
<img
class="baseImg"
- :src="item.rules[0].icon_blob && item.rules[0].icon_blob.indexOf(',')>0?item.rules[0].icon_blob:`data:image/png;base64,${item.rules[0].icon_blob}`"
+ :src="
+ item.rules[0].icon_blob &&
+ item.rules[0].icon_blob.indexOf(',') > 0
+ ? item.rules[0].icon_blob
+ : `data:image/png;base64,${item.rules[0].icon_blob}`
+ "
alt
/>
</div>
</div>
- <div class="double" v-else-if="item.rules.length==2">
- <div class="svg-wrap" v-for="(rule,index) in item.rules" :key="index">
+ <div class="double" v-else-if="item.rules.length == 2">
+ <div
+ class="svg-wrap"
+ v-for="(rule, index) in item.rules"
+ :key="index"
+ >
<!-- <svg class="icon" aria-hidden="true" style="font-size:2rem;">
<use :xlink:href="`#${rule.icon}`" />
</svg>-->
<img
class="baseImg"
- :src="item.rules[0].icon_blob &&item.rules[0].icon_blob.indexOf(',')>0?item.rules[0].icon_blob:`data:image/png;base64,${rule.icon_blob}`"
+ :src="
+ item.rules[index].icon_blob &&
+ item.rules[index].icon_blob.indexOf(',') > 0
+ ? item.rules[index].icon_blob
+ : `data:image/png;base64,${rule.icon_blob}`
+ "
alt
/>
</div>
</div>
- <div class="third" v-else-if="item.rules.length==3">
- <div class="svg-wrap" v-for="(rule,index) in item.rules" :key="'t'+index">
+ <div class="third" v-else-if="item.rules.length == 3">
+ <div
+ class="svg-wrap"
+ v-for="(rule, index) in item.rules"
+ :key="'t' + index"
+ >
<!-- <svg class="icon" aria-hidden="true" style="font-size:2rem;">
<use :xlink:href="`#${rule.icon}`" />
</svg>-->
<img
class="baseImg"
- :src="item.rules[0].icon_blob &&item.rules[0].icon_blob.indexOf(',')>0?item.rules[0].icon_blob:`data:image/png;base64,${rule.icon_blob}`"
+ :src="
+ item.rules[index].icon_blob &&
+ item.rules[index].icon_blob.indexOf(',') > 0
+ ? item.rules[index].icon_blob
+ : `data:image/png;base64,${rule.icon_blob}`
+ "
alt
/>
</div>
</div>
- <div class="four" v-else-if="item.rules.length==4">
- <div class="svg-wrap" v-for="(rule,index) in item.rules" :key="'f'+index">
+ <div class="four" v-else-if="item.rules.length == 4">
+ <div
+ class="svg-wrap"
+ v-for="(rule, index) in item.rules"
+ :key="'f' + index"
+ >
<!-- <svg class="icon" aria-hidden="true" style="font-size:2rem;">
<use :xlink:href="`#${rule.icon}`" />
</svg>-->
<img
class="baseImg"
- :src="item.rules[0].icon_blob && item.rules[0].icon_blob.indexOf(',')>0?item.rules[0].icon_blob:`data:image/png;base64,${rule.icon_blob}`"
+ :src="
+ item.rules[index].icon_blob &&
+ item.rules[index].icon_blob.indexOf(',') > 0
+ ? item.rules[index].icon_blob
+ : `data:image/png;base64,${rule.icon_blob}`
+ "
alt
/>
</div>
</div>
</div>
- <div class="scenario-name">{{item.scene_name}}</div>
+ <div class="scenario-name">{{ item.scene_name }}</div>
</div>
</div>
</swiper-slide>
</swiper>
- <div class="swiper-pre-border" v-show="sceneData.length > 4 ">
+ <div class="swiper-pre-border" v-show="sceneData.length > 4">
<div class="icon-btn" slot="button-prev">
<i class="iconfont iconzuo"></i>
</div>
</div>
- <div class="swiper-next-border" v-show="sceneData.length > 4 ">
+ <div class="swiper-next-border" v-show="sceneData.length > 4">
<div class="icon-btn" slot="button-next">
<i class="iconfont iconyou1"></i>
</div>
@@ -79,11 +111,11 @@
</template>
<script>
-import {chunkArr} from '@/scripts/util';
+import { chunkArr } from "@/scripts/util";
export default {
props: [
// 'swiperOption',
- 'sceneData'
+ "sceneData",
],
data() {
@@ -115,28 +147,27 @@
spaceBetween: 0,
pagination: {
el: ".swiper-pagination",
- clickable: true
+ clickable: true,
},
navigation: {
nextEl: ".swiper-next-border",
- prevEl: ".swiper-pre-border"
+ prevEl: ".swiper-pre-border",
},
- observer: true,//淇敼swiper鑷繁鎴栧瓙鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper
- observeParents: true,//淇敼swiper鐨勭埗鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper
+ observer: true, //淇敼swiper鑷繁鎴栧瓙鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper
+ observeParents: true, //淇敼swiper鐨勭埗鍏冪礌鏃讹紝鑷姩鍒濆鍖杝wiper
},
- mySwiper: {}
- }
+ mySwiper: {},
+ };
},
mounted() {
// this.mySwiper = this.$refs.sceneSwiper.swiper;
-
},
computed: {
slides() {
return chunkArr(this.mockSceneData, 5);
- }
- }
+ },
+ },
};
</script>
@@ -302,6 +333,7 @@
position: absolute;
bottom: 10px;
left: 0;
+ word-break: break-all;
}
}
}
--
Gitblit v1.8.0