From 18c01a66e59d520e5675a2fbb5526b8b1291eeb2 Mon Sep 17 00:00:00 2001
From: qingzhengli <1204552371@qq.com>
Date: Mon, 8 Apr 2024 16:09:55 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=20max-width=E4=BF=AE=E5=A4=8D=E5=AE=BD?=
 =?UTF-8?q?=E5=BA=A6=E5=B7=A8=E9=95=BF=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../FormConfig/components/ElCheckboxGroup.vue | 26 ++++-------------
 .../Dialogs/PerceiveEvent/index.vue           |  2 +-
 .../EventDetailDialog/Carousel/index.vue      | 28 ++++---------------
 3 files changed, 12 insertions(+), 44 deletions(-)

diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue b/ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue
index c484c49e..ea360b39 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue
@@ -1,25 +1,12 @@
 <template>
-  <ElCheckboxGroup
-    v-bind="$attrs"
-    v-on="$listeners"
-    class="ElCheckboxGroup"
-    :style="{ gap }"
-  >
-    <ElCheckbox
-      v-for="item in options"
-      :disabled="item.disabled"
-      :label="item[id] || item[label]"
-      :key="item[id] || item[label]"
-    >
-      <slot :name="item[id] || item[label]" :data="item"
-        >{{ item[label] }}
+  <ElCheckboxGroup v-bind="$attrs" v-on="$listeners" class="ElCheckboxGroup" :style="{ gap }">
+    <ElCheckbox v-for="item in options" :disabled="item.disabled" :label="item[id] || item[label]"
+      :key="item[id] || item[label]">
+      <slot :name="item[id] || item[label]" :data="item">{{ item[label] }}
       </slot>
       <div v-if="showIcon">
-        <img
-          v-if="item.deviceState == '0' || item.deviceState == null"
-          src="@/assets/jihe/images/offline.svg"
-          class="state"
-        />
+        <img v-if="item.deviceState == '0' || item.deviceState == null" src="@/assets/jihe/images/offline.svg"
+          class="state" />
         <img v-else src="@/assets/jihe/images/online.svg" class="state" />
       </div>
     </ElCheckbox>
@@ -70,7 +57,6 @@ export default {
       display: flex;
       align-items: center;
       gap: 6px;
-      width: 87px;
 
       .el-checkbox__input {
         line-height: 0;
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue
index 2a6194a2..92887ceb 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue
@@ -5,7 +5,7 @@
       <div class="video-pic">
         <Video style="height: 100%; flex: 1" :showHeader="false" :url="dialogData.formData.videoList[0]"
           videoType="mp4" />
-        <Carousel style="flex: 1; height: 100%" :pictures="dialogData.formData.pictures" />
+        <Carousel style="flex: 1; height: 100%;max-width: 300px;" :pictures="dialogData.formData.pictures" />
       </div>
       <LineChart class="chart" />
       <Form class="form" v-loading="loading" v-model="data" ref="FormConfigRef" :formList="formList" column="1" />
diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue
index d99ae97e..8aff60c9 100644
--- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue
+++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue
@@ -2,12 +2,11 @@
   <div class="Carousel">
     <img src="./images/arrow.svg" @click="prevSlide" class="arrow" />
 
-    <VueSlickCarousel style="width: 100%" v-if="pictures.length > 0" v-bind="settings" ref="CarouselRef"
-      class="vueSlickCarousel">
+    <VueSlickCarousel v-if="pictures.length > 0" v-bind="settings" ref="CarouselRef" class="vueSlickCarousel">
       <div v-for="(item, index) in pictures" :key="index" class="item">
         <!-- <img :src="require(`@screen/images/${item}`)" style="height: 100%"> -->
         <!-- <img :src="item" style="height: 100%"> -->
-        <el-image style="height: 100%;width:100%" :src="item" :preview-src-list="pictures">
+        <el-image style="height: 100%" :src="item" :preview-src-list="pictures">
         </el-image>
       </div>
     </VueSlickCarousel>
@@ -48,7 +47,7 @@ export default {
         infinite: true,
         arrows: false,
         speed: 600,
-        slidesToShow: 3,
+        slidesToShow: 1,
         slidesToScroll: 1,
         autoplay: true,
         autoplaySpeed: 1800,
@@ -77,37 +76,20 @@ export default {
   .vueSlickCarousel {
     flex: 1;
     overflow: hidden;
-    width: 100%;
 
     ::v-deep {
       .slick-list {
         height: 100%;
-        width: 100%;
-
-        .slick-track {
-          width: 100% !important;
-          height: 100% !important;
-
-          .slick-slide {
-            width: 100% !important;
-
-            div {
-              width: 100%;
-              height: 100%;
-            }
-          }
-
 
+        div {
+          height: 100%;
         }
-
-
       }
     }
 
     .item {
       img {
         height: 100%;
-        width: 100%;
       }
     }
   }