Compare commits

...

2 Commits

  1. 26
      ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue
  2. 2
      ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue
  3. 28
      ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue

26
ruoyi-ui/src/views/JiHeExpressway/components/FormConfig/components/ElCheckboxGroup.vue

@ -1,25 +1,12 @@
<template> <template>
<ElCheckboxGroup <ElCheckboxGroup v-bind="$attrs" v-on="$listeners" class="ElCheckboxGroup" :style="{ gap }">
v-bind="$attrs" <ElCheckbox v-for="item in options" :disabled="item.disabled" :label="item[id] || item[label]"
v-on="$listeners" :key="item[id] || item[label]">
class="ElCheckboxGroup" <slot :name="item[id] || item[label]" :data="item">{{ item[label] }}
: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> </slot>
<div v-if="showIcon"> <div v-if="showIcon">
<img <img v-if="item.deviceState == '0' || item.deviceState == null" src="@/assets/jihe/images/offline.svg"
v-if="item.deviceState == '0' || item.deviceState == null" class="state" />
src="@/assets/jihe/images/offline.svg"
class="state"
/>
<img v-else src="@/assets/jihe/images/online.svg" class="state" /> <img v-else src="@/assets/jihe/images/online.svg" class="state" />
</div> </div>
</ElCheckbox> </ElCheckbox>
@ -70,7 +57,6 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
width: 87px;
.el-checkbox__input { .el-checkbox__input {
line-height: 0; line-height: 0;

2
ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/PerceiveEvent/index.vue

@ -5,7 +5,7 @@
<div class="video-pic"> <div class="video-pic">
<Video style="height: 100%; flex: 1" :showHeader="false" :url="dialogData.formData.videoList[0]" <Video style="height: 100%; flex: 1" :showHeader="false" :url="dialogData.formData.videoList[0]"
videoType="mp4" /> 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> </div>
<LineChart class="chart" /> <LineChart class="chart" />
<Form class="form" v-loading="loading" v-model="data" ref="FormConfigRef" :formList="formList" column="1" /> <Form class="form" v-loading="loading" v-model="data" ref="FormConfigRef" :formList="formList" column="1" />

28
ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/Carousel/index.vue

@ -2,12 +2,11 @@
<div class="Carousel"> <div class="Carousel">
<img src="./images/arrow.svg" @click="prevSlide" class="arrow" /> <img src="./images/arrow.svg" @click="prevSlide" class="arrow" />
<VueSlickCarousel style="width: 100%" v-if="pictures.length > 0" v-bind="settings" ref="CarouselRef" <VueSlickCarousel v-if="pictures.length > 0" v-bind="settings" ref="CarouselRef" class="vueSlickCarousel">
class="vueSlickCarousel">
<div v-for="(item, index) in pictures" :key="index" class="item"> <div v-for="(item, index) in pictures" :key="index" class="item">
<!-- <img :src="require(`@screen/images/${item}`)" style="height: 100%"> --> <!-- <img :src="require(`@screen/images/${item}`)" style="height: 100%"> -->
<!-- <img :src="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> </el-image>
</div> </div>
</VueSlickCarousel> </VueSlickCarousel>
@ -48,7 +47,7 @@ export default {
infinite: true, infinite: true,
arrows: false, arrows: false,
speed: 600, speed: 600,
slidesToShow: 3, slidesToShow: 1,
slidesToScroll: 1, slidesToScroll: 1,
autoplay: true, autoplay: true,
autoplaySpeed: 1800, autoplaySpeed: 1800,
@ -77,37 +76,20 @@ export default {
.vueSlickCarousel { .vueSlickCarousel {
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;
width: 100%;
::v-deep { ::v-deep {
.slick-list { .slick-list {
height: 100%; 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 { .item {
img { img {
height: 100%; height: 100%;
width: 100%;
} }
} }
} }

Loading…
Cancel
Save