From 49a435043b0b1a289a24606e35253365d7ab3956 Mon Sep 17 00:00:00 2001
From: QYF-GitLab1 <1940665526@qq.com>
Date: 星期一, 25 八月 2025 17:51:57 +0800
Subject: [PATCH] 首页、及教学出版样式修改
---
src/views/aboutUs/index.vue | 150 +++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 117 insertions(+), 33 deletions(-)
diff --git a/src/views/aboutUs/index.vue b/src/views/aboutUs/index.vue
index 8324cc0..7e876b7 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">
@@ -75,11 +79,7 @@
</div>
</div>
</div>
- <div
- class="itemText"
- style="color: #d5d5d5"
- v-html="ideaBrandCulture[0]?.content"
- ></div>
+ <div class="itemText" style="color: #d5d5d5" v-html="ideaBrandCulture[0]?.content"></div>
</div>
<div class="cultureItem">
<div class="cultureTitle">
@@ -128,29 +128,26 @@
</div>
</div>
<div class="page-container">
- <MapContainer />
+ <Map v-if="contactUsData" :contactUsData="contactUsData" />
</div>
</div>
</template>
<script setup>
-import moment from 'moment'
-import MapContainer from '@/components/MapContainer.vue'
-import { ref, onBeforeMount, inject, reactive, onMounted } from 'vue'
-let screenheight = ref(document.documentElement.clientHeight / 2)
+import { ref, inject, reactive, onMounted } from 'vue'
+import Map from './components/map.vue'
const MG = inject('MG')
-const config = inject('config')
-const tool = inject('tool')
const banner = reactive([])
let publisherIntroduction = ref('')
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 },
})
@@ -180,7 +177,6 @@
paging: { start: 0, size: 9 },
})
.then((res) => {
- console.log(res.datas, 'ideaBrandCulture')
ideaBrandCulture.value = res.datas
loading.value = false
})
@@ -199,8 +195,39 @@
paging: { start: 0, size: 1 },
})
.then((res) => {
- console.log(res.datas, 'publisherData')
publisherData.value = res.datas[0]
+ })
+}
+
+// 鑾峰彇鑱旂郴鎴戜滑
+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]
+ }
})
}
@@ -209,41 +236,71 @@
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%);
background-color: #fff;
}
+
.contentBox {
background-color: #fff;
padding-bottom: 100px;
margin-top: 35px;
+
.aboutUs {
width: 100%;
font-size: 16px;
border-top: 1px solid #ededed;
margin-top: 40px;
+
.aboutTitle {
display: flex;
width: 100%;
padding-top: 30px;
+
.titleBox1 {
position: relative;
width: 50px;
height: 50px;
margin-right: 20px;
}
+
.titleText {
font-size: 48px;
font-weight: 700;
opacity: 0.05;
}
}
+
.block {
display: inline-block;
width: 4px;
@@ -252,12 +309,15 @@
vertical-align: middle;
background: #dadada;
}
+
.selected {
background-color: #e7f9ef;
+
.block {
background-color: #008e3f;
}
}
+
.title {
padding: 0;
font-weight: 700;
@@ -267,32 +327,41 @@
line-height: 36px;
border-bottom: 0;
}
+
div {
cursor: pointer;
// border-bottom: 1px dashed #ededed;
}
+
.colorText {
color: #144941;
}
+
.textBox {
line-height: 20px;
margin-top: 30px;
+
p {
margin-top: 30px;
}
}
}
+
.statisticsBox {
display: flex;
justify-content: space-between;
margin-top: 80px;
text-align: center;
+
.statisticsNum {
font-size: 48px;
}
+
.statisticsTitle {
margin-top: 10px;
+ font-size: 14px;
}
+
.circleBox {
width: 26px;
height: 26px;
@@ -305,70 +374,85 @@
}
}
}
+
.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 {
width: 1200px;
margin: 0 auto;
}
+
.leftIcon {
width: 58px;
height: 58px;
position: relative;
}
+
.cultureTitle {
display: flex;
border-bottom: 1px solid #dedede;
padding-bottom: 16px;
}
+
.titleTextInfo {
- margin-left: 20px;
+ margin-left: 10px;
text-align: left;
}
+
.itemTitle {
font-size: 18px;
font-weight: 700;
line-height: 36px;
color: #333;
}
+
.itemSubTitle {
color: #000;
+ font-size: 12px;
opacity: 0.5;
}
+
.itemText {
font-size: 16px;
line-height: 28px;
--
Gitblit v1.9.1