Files
front-pc/pages/home/components/MainContent.vue

53 lines
1.6 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

`<template>
<div class="main-content">
<div class="flex">
<div class="h-424px w-957px">
<el-carousel height="424px" indicator-position="none">
<el-carousel-item v-for="(item, index) in bannerList" :key="index">
<el-image :src="item.content" class="w-100%" :class="{ 'cursor-pointer': item.url }" fit="cover" @click="handleClick(item.url)" />
</el-carousel-item>
</el-carousel>
</div>
<LoginForm />
</div>
<div class="box-border h-56px w-1219px flex items-center border border-[#EEEEEE] border-solid border-t-none bg-[#FFFFFF] pl-10px line-height-46px">
<img src="~/assets/images/voice.png" alt="" srcset="" class="mr-10px h-15px w-16px" />
<Vue3Marquee :duration="10" direction="normal" pause-on-hover>· 经典来袭SolidWorks装配经典案例之气动发动机 </Vue3Marquee>
</div>
</div>
</template>
<script setup lang="ts">
import { reactive, ref } from 'vue'
import LoginForm from './LoginForm.vue'
import { getSettingPage } from '~/api/home/index'
import type { PageResultIndexSettingRespVO } from '~/api/home/type'
const pageReq = reactive({
type: 1,
status: 0,
})
const bannerList = ref<PageResultIndexSettingRespVO[]>([])
const getBanner = async () => {
const res = await getSettingPage(pageReq)
if (res.code === 0) {
bannerList.value = res.data
}
}
getBanner()
const handleClick = (url: string) => {
if (url) {
navigateTo(url)
}
}
</script>
<style scoped lang="scss">
.main-content {
flex: 1;
}
</style>