From 9cad6a832c786989be620573b09badccfe7e3b51 Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期一, 25 八月 2025 15:11:37 +0800
Subject: [PATCH] 首页头部，样式调整
---
src/views/aboutUs/index.vue | 106 +++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 86 insertions(+), 20 deletions(-)
diff --git a/src/views/aboutUs/index.vue b/src/views/aboutUs/index.vue
index 8324cc0..f89ad38 100644
--- a/src/views/aboutUs/index.vue
+++ b/src/views/aboutUs/index.vue
@@ -1,12 +1,12 @@
<template>
<div class="homePage">
- <el-carousel :height="screenheight + 'px'">
- <el-carousel-item v-for="(item, index) in banner" :key="index">
- <div class="bannerBox imgBox">
- <img id="autoHeight" class="bannerImg" :src="item.icon" @click="bannerLink(item)" />
- </div>
- </el-carousel-item>
- </el-carousel>
+ <div class="bannerBox imgBox">
+ <img class="bannerImg" :src="banner[0]?.icon" @click="bannerLink(item)" />
+ <div class="bannerText">
+ <div>涓浗鍗忓拰鍖荤澶у鍑虹増绀�</div>
+ <div class="enText">ABOUT US</div>
+ </div>
+ </div>
<div class="contentBox">
<div class="crumbs">
@@ -20,7 +20,7 @@
<div class="titleBox1">
<img class="autoImg" src="@/assets/images/xiehe/about/yinhao.png" alt="" />
</div>
- <div class="titleText">Publisher Introduction</div>
+ <div class="titleText">PUBLISHER INTRODUCTION</div>
</div>
<div class="textBox" v-html="publisherIntroduction"></div>
<div class="statisticsBox">
@@ -31,7 +31,9 @@
<div class="statisticsTitle">涓撴敞鍖诲鍑虹増</div>
</div>
<div class="statisticsItem">
- <div class="statisticsNum">{{ publisherData.topExpertDatabase }}+ 浣�</div>
+ <div class="statisticsNum">
+ {{ publisherData.topExpertDatabase }}+ <span class="circleBox">浣�</span>
+ </div>
<div class="statisticsTitle">椤剁骇涓撳搴�</div>
</div>
<div class="statisticsItem">
@@ -60,7 +62,9 @@
<div class="CultureBox">
<div class="brandCultureTitle">
<div>鐞嗗康涓庡搧鐗屾枃鍖�</div>
- <div class="enText">Philosophy & Brand Culture</div>
+ <div class="enText" style="color: #348c6e; font-size: 48px">
+ PHILOSOPHY & BRAND CULTURE
+ </div>
</div>
<div class="cultureList" v-loading="loading">
<div class="cultureItem firstItem">
@@ -128,7 +132,7 @@
</div>
</div>
<div class="page-container">
- <MapContainer />
+ <Map v-if="contactUsData" :contactUsData="contactUsData" />
</div>
</div>
</template>
@@ -137,6 +141,7 @@
import moment from 'moment'
import MapContainer from '@/components/MapContainer.vue'
import { ref, onBeforeMount, inject, reactive, onMounted } from 'vue'
+import Map from './components/map.vue'
let screenheight = ref(document.documentElement.clientHeight / 2)
const MG = inject('MG')
const config = inject('config')
@@ -146,11 +151,12 @@
let publisherData = ref('')
let ideaBrandCulture = ref([])
let loading = ref(false)
+let contactUsData = ref(null)
const getBanner = () => {
MG.resource
.getItem({
- path: 'banner\\homeBanner',
+ path: 'banner\\about',
fields: { link: [] },
paging: { start: 0, size: 9 },
})
@@ -204,15 +210,68 @@
})
}
+// 鑾峰彇鑱旂郴鎴戜滑
+const getConectText = () => {
+ MG.resource
+ .getItem({
+ path: 'aboutUs\\contactUs',
+ fields: {
+ postalCode: [],
+ address: [],
+ telphone: [],
+ faxNumber: [],
+ website: [],
+ mailbox: [],
+ },
+ sort: {
+ LinkOrder: 'Asc',
+ },
+ paging: {
+ start: 0,
+ size: 999,
+ },
+ coverSize: {
+ height: 430,
+ },
+ })
+ .then((res) => {
+ const { datas } = res
+ if (datas?.length > 0) {
+ contactUsData.value = datas[0]
+ }
+ })
+}
+
onMounted(() => {
getBanner()
getPublisherIntroduction()
getPublisherData()
getIdeaBrandCulture()
+ getConectText()
})
</script>
<style lang="less" scoped>
+.bannerBox {
+ height: 380px;
+ position: relative;
+ .bannerText {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ font-size: 36px;
+ font-weight: 700;
+ color: #fff;
+ text-shadow: 0px 0px 10px #000000;
+ text-align: center;
+ }
+ .enText {
+ font-size: 28px;
+ opacity: 0.45;
+ margin-top: 10px;
+ }
+}
.homePage {
min-width: 1220px;
min-height: calc(100vh - 61.8%);
@@ -292,6 +351,7 @@
}
.statisticsTitle {
margin-top: 10px;
+ font-size: 14px;
}
.circleBox {
width: 26px;
@@ -307,38 +367,43 @@
}
.brandCultureTop {
background-image: url(@/assets/images/xiehe/about/wenhua_bg.png);
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ background-position: center;
width: 100%;
- height: 500px;
- padding-top: 55px;
+ height: 580px;
+ padding-top: 30px;
}
+
.brandCultureTitle {
font-size: 36px;
color: #fff;
font-weight: 700;
text-align: center;
+ line-height: 70px;
}
.cultureList {
display: flex;
justify-content: space-between;
width: 100%;
- margin-top: 60px;
+ margin-top: 50px;
}
.cultureItem {
- width: 320px;
+ width: 324px;
height: 320px;
background-color: #fff;
- margin-left: 30px;
+ margin-left: 10px;
padding: 20px;
box-sizing: border-box;
}
.firstItem {
background-color: #144941;
color: #fff;
- width: 320px;
+ width: 324px;
height: 320px;
- text-align: center;
+ text-align: left;
margin-left: 0px;
}
.CultureBox {
@@ -356,7 +421,7 @@
padding-bottom: 16px;
}
.titleTextInfo {
- margin-left: 20px;
+ margin-left: 10px;
text-align: left;
}
.itemTitle {
@@ -367,6 +432,7 @@
}
.itemSubTitle {
color: #000;
+ font-size: 12px;
opacity: 0.5;
}
.itemText {
--
Gitblit v1.9.1