flx:修改首页总览的视频配置到后台

This commit is contained in:
Rain_ 2025-03-24 17:43:53 +08:00
parent 2e9bcb40c9
commit ea49de0d6b
2 changed files with 40 additions and 12 deletions

View File

@ -3,14 +3,14 @@
<div class="bottom-left">
<el-scrollbar class="list-content">
<div class="list-detail" v-for="item in memberCareList" :key="item.id">
<div class="detail-pic">
<!-- <div class="detail-pic">
<el-image
:preview-src-list="item.file.map((item: any) => item.url)"
v-if="item.file.length > 0"
:src="item.file[0].url"
fit="cover"
/>
</div>
</div> -->
<div class="detail-text">
<div class="title" :title="item.title">115533{{ item.title || " " }}</div>
<div class="time">{{ item.createDate || " " }}</div>

View File

@ -38,7 +38,7 @@
</el-carousel>
</div>
<div class="videoBox" v-if="showVideo == 2" @mouseenter="showChangeVideo = true" @mouseleave="showChangeVideo = false">
<el-upload
<!-- <el-upload
:action="BASEURL + '/upload/image'"
:on-success="file => handleSuccessTwo(file, 1)"
:on-error="file => handleError(file, 1)"
@ -46,14 +46,13 @@
name="files"
:show-file-list="false"
>
<!-- 更换视频 -->
<span class="change-video" v-if="showChangeVideo">更换视频</span>
</el-upload>
</el-upload> -->
<video :src="BASEURL + '/image/' + projectData.videoUrl" class="videos" autoplay controls loop></video>
</div>
<div class="imgBox" v-if="showVideo == 3">
<div class="imgs" @mouseenter="showChangeImg = true" @mouseleave="showChangeImg = false">
<el-upload
<!-- <el-upload
:action="BASEURL + '/upload/image'"
:on-success="file => handleSuccess(file, 1)"
:on-error="file => handleError(file, 1)"
@ -61,10 +60,14 @@
name="files"
:show-file-list="false"
>
<!-- 更换图片 -->
<span class="change-video" v-if="showChangeImg">更换图片</span>
</el-upload>
<img :src="BASEURL + '/image/' + picUrl" alt="" />
</el-upload> -->
<!-- <img :src="BASEURL + '/image/' + picUrl" alt="" /> -->
<el-carousel trigger="click" :interval="5000">
<el-carousel-item v-for="item in picUrl" :key="item.id">
<div class="bg_top" :style="`background-image: url(${item.url})`"></div>
</el-carousel-item>
</el-carousel>
</div>
</div>
</Card>
@ -72,6 +75,7 @@
</template>
<script setup lang="ts">
import { isJSON } from "@/utils/util";
import Card from "@/components/card.vue";
import { ref, onMounted, watch } from "vue";
import { GlobalStore } from "@/stores";
@ -101,12 +105,15 @@ watch(
// console.log(newVal, "newVal");
if (newVal) {
// props.xData = newVal;
projectData.value = newVal;
projectData.value = {
...newVal,
videoUrl: isJSON(newVal.videoUrl) && JSON.parse(newVal.videoUrl) instanceof Array ? JSON.parse(newVal.videoUrl)[0].url : "",
};
}
}
);
//
const picUrl = ref("" as any);
const picUrl = ref([] as any);
const BASEURL = import.meta.env.VITE_API_URL;
//
@ -270,7 +277,7 @@ function getQueryBySnData(showLoading: boolean) {
}, showLoading).then((res: any) => {
console.log(res, "效果图");
if (res.result) {
picUrl.value = res.result.configValue;
picUrl.value = isJSON(res.result.configValue) && JSON.parse(res.result.configValue) instanceof Array ? JSON.parse(res.result.configValue) : [];
}
});
}
@ -332,6 +339,27 @@ onMounted(async () => {
height: 100%;
margin-top: 5%;
}
:deep(.el-carousel) {
height: 430px;
.el-carousel__container {
height: 100%;
}
.el-carousel__indicators--horizontal {
display: none;
}
.el-carousel__arrow {
top: 55%;
}
}
.bg_top {
width: 100%;
height: 100%;
margin-top: 5%;
// background-image: url(~@/assets/images/bthgIcon/bg5.png);
background-repeat: no-repeat;
background-size: 100% 100%;
position: relative;
}
}
}
.href-content {