root/feiyang-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

all

Browse Source
This commit is contained in:
dzj 2024-05-17 15:50:06 +08:00
parent d6f103d196
commit 352e98d28b
8 changed files with 564 additions and 198 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/api/index.js
View File

@ -79,3 +79,16 @@ export function projectdetail(params){
params params
}) })
} }
//企业文化
export function culture(){
return request({
url:'/organization/list'
})
}
//荣誉详情
export function honordetail(params){
return request({
url:'/honor/byId',
params
})
}

5
src/router/index.js
View File

@ -8,6 +8,7 @@ import recruit from '@/views/recruit.vue'
import contactus from '@/views/contactus.vue' import contactus from '@/views/contactus.vue'
import detail from '@/views/detail.vue' import detail from '@/views/detail.vue'
import projectdetail from '@/views/projectdetail.vue' import projectdetail from '@/views/projectdetail.vue'
import honordetail from '@/views/honordetail.vue'
Vue.use(VueRouter) Vue.use(VueRouter)
const routes = [ const routes = [
@ -44,6 +45,10 @@ const routes = [
{ {
path:'/projectdetail', path:'/projectdetail',
component:projectdetail component:projectdetail
},
{
path:'/honordetail',
component:honordetail
} }
] ]

275
src/views/HomeView.vue
View File

@ -5,7 +5,8 @@
<div class="bd" style="height: 581px;position: relative;"> <div class="bd" style="height: 581px;position: relative;">
<div class="swiper-container swiper5"> <div class="swiper-container swiper5">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in imgarr" :key="item.id"><img :src="item.url" style="width: 100%;height:100%;"></div> <div class="swiper-slide" v-for="item in imgarr" :key="item.id"><img :src="item.url"
style="width: 100%;height:100%;"></div>
</div> </div>
<div class="swiper-pagination"></div> <div class="swiper-pagination"></div>
@ -33,49 +34,44 @@
保利发展控股股票代码</h3> 保利发展控股股票代码</h3>
<h5 class="red green"><em style="display: block;">8.03</em>RMB</h5> <h5 class="red green"><em style="display: block;">8.03</em>RMB</h5>
</div> --> </div> -->
<!-- 暂定动态 --> <!-- 暂定动态 -->
<div style="width: 50%;"></div> <div style="width: 50%;"></div>
</div> </div>
<div class="content-right"> <div class="content-right">
<div class="index-top" @click="changeto(newsitem.id) " style="cursor: pointer;" > <div class="index-top" @click="changeto(newsitem.id)" style="cursor: pointer;">
<h3 style=" font-size: 24px; <h3 style=" font-size: 24px;
color: #3c3c48; color: #3c3c48;
color: rgba(60, 60, 72, .8); color: rgba(60, 60, 72, .8);
line-height: 30px;">{{newsitem.name}}</h3> line-height: 30px;">{{ newsitem.name }}</h3>
<h5 style=" width: auto; <h5 style=" width: auto;
float: none; float: none;
font-size: 30px; font-size: 30px;
color: #c0a988; color: #c0a988;
margin: 3px 0 6px; line-height: 1; margin: 3px 0 6px; line-height: 1;
font-weight: bold; font-weight: bold;
letter-spacing: -.2px;font-family: 'Rajdhani';">{{newsitem.releaseTime}}</h5> letter-spacing: -.2px;font-family: 'Rajdhani';">{{ newsitem.releaseTime }}</h5>
<p style=" color: rgba(115, 115, 124, .6); font-size: 13px; <p style=" color: rgba(115, 115, 124, .6); font-size: 13px;
color: #95959d; color: #95959d;
line-height: 24px; line-height: 24px;
text-align: justify;">{{newsitem.source}} text-align: justify;">{{ newsitem.source }}
</p> </p>
</div> </div>
<div style="overflow: hidden;"> <div style="overflow: hidden;">
</div> </div>
<div @click="changeto(false)" style="cursor: pointer;"> <div @click="changeto(false)" style="cursor: pointer;">
<div class="dot_box" style=" font-size: 0;
<div class="dot_box" style=" font-size: 0;
margin-top: 20px; margin-top: 20px;
top: -2px; top: -2px;
display: inline-block; display: inline-block;
text-align: center; text-align: center;
position: relative;" position: relative;">
<div class="i"></div>
> <div class="i"></div>
<div class="i"></div> <div class="i"></div>
<div class="i"></div> </div>
<div class="i"></div> <div class="text">更多新闻</div>
</div> </div>
<div class="text">更多新闻</div>
</div>
</div> </div>
@ -98,19 +94,23 @@
</div> </div>
</div> </div>
</div> </div>
<div class="index_3"> <div class="index_3" :style=" {background: `url(${bgtextitem.url})`, norepeat: 'center'}">
<div style="position: relative;height: 100%;width: 80%;margin: 0 auto;"> <div style="position: relative;height: 100%;width: 80%;margin: 0 auto;">
<div class="tiltle"> <div class="tiltle">
<!-- 飞阳建设工程业务领域<br> <!-- 飞阳建设工程业务领域<br>
建筑产业<br> 建筑产业<br>
现代化发展趋势 --> 现代化发展趋势 -->
<h3 class="init" v-html="bgtextitem.content"> <h3 class="init" v-html="bgtextitem.contentUp">
</h3> </h3>
<div class="init2" v-html="bgtextitem.contents"> <div class="init2" v-html="bgtextitem.contentDown">
</div>
<!-- <p style="width: 500px;">
飞阳包含房屋建筑市政公路、工业建筑，金属门窗、”钢结构广等业务领域 致力于数据化、智能化创新发展，积极探索建筑产业现代化发展趋势
</p> -->
</div>
</div> </div>
<div class="list" style="position: absolute; <div class="list" style="position: absolute;
left: 0; left: 0;
@ -120,7 +120,8 @@
<div class="swiper2" style="max-width: 80vw;overflow: hidden;height: 100%;"> <div class="swiper2" style="max-width: 80vw;overflow: hidden;height: 100%;">
<div class="swiper-wrapper swiper9"> <div class="swiper-wrapper swiper9">
<div class="swiper-slide" style="height: 100%;" v-for="item in smallPicturearr" :key="item.id"><img :src="item.picture" style=" border-radius: 10px;width: 396px;height:263px;"></div> <div class="swiper-slide" style="height: 100%;" v-for="item in smallPicturearr" :key="item.id"><img
:src="item.picture" style=" border-radius: 10px;width: 396px;height:263px;"></div>
</div> </div>
@ -149,7 +150,8 @@
<!-- <h3></h3> --> <!-- <h3></h3> -->
<h5 style="line-height: 20px;">荣获行业诸多奖项<br> <h5 style="line-height: 20px;">荣获行业诸多奖项<br>
拥有一支高素质的专业管理团队<span style="color:RGB(48, 113, 183);float: right;font-weight: bold;cursor: pointer;" @click="switchto">MORE...</span> 拥有一支高素质的专业管理团队<span style="color:RGB(48, 113, 183);float: right;font-weight: bold;cursor: pointer;"
@click="switchto">MORE...</span>
</h5> </h5>
<!-- <h5></h5> --> <!-- <h5></h5> -->
</div> </div>
@ -160,16 +162,18 @@
</div> </div>
</div> </div>
<div style="max-width: 80vw;overflow: hidden;height: 100%;margin: auto;"> <div style="max-width: 80vw;overflow: hidden;height: 100%;margin: auto;">
<div class="swiper3" > <div class="swiper3">
<div class="swiper-wrapper swiper9" > <div class="swiper-wrapper swiper9">
<div class="swiper-slide" v-for="item in achievementarr" :key="item.id" style="background-color: rgb(240,246,250);border-radius: 10px;padding: 40px;box-sizing: border-box;"><img :src="item.url" style=" width: 100%;margin: auto;"></div> <div class="swiper-slide" v-for="item in achievementarr" :key="item.id"
@click="honorto(item.id)"
style="background-color: rgb(240,246,250);border-radius: 10px;padding: 40px;box-sizing: border-box;cursor: pointer;">
<img :src="item.picture" style=" width: 100%;margin: auto;"></div>
</div>
<div class="swiper-pagination1" style="text-align: center;"></div>
</div>
</div> </div>
<div class="swiper-pagination1" style="text-align: center;"></div>
</div>
</div>
</div> </div>
</div> </div>
@ -183,86 +187,86 @@
import Swiper from 'swiper' import Swiper from 'swiper'
import 'swiper/css/swiper.min.css' import 'swiper/css/swiper.min.css'
import { achievementPic, hyDtai,swiperimg,getnews,backgroundText,smallPicture } from '@/api' import { achievementPic, hyDtai, swiperimg, getnews, backgroundText, smallPicture,honor } from '@/api'
export default { export default {
data() { data() {
return { return {
hydata:{src:''}, hydata: { src: '' },
imgarr:[], imgarr: [],
achievementarr:[], achievementarr: [],
newsitem:{}, newsitem: {},
bgtextitem:{}, bgtextitem: {},
smallPicturearr:[] smallPicturearr: []
} }
}, },
mounted() { mounted() {
//大图轮播图 //大图轮播图
swiperimg().then((res)=>{ swiperimg().then((res) => {
this.imgarr=res.data this.imgarr = res.data
this.$nextTick(()=>{ this.$nextTick(() => {
new Swiper('.swiper5', { new Swiper('.swiper5', {
loop: true, loop: true,
autoplay: { autoplay: {
delay: 4100, delay: 4100,
disableOnInteraction: false, disableOnInteraction: false,
}, },
pagination: { pagination: {
el: '.swiper-pagination', el: '.swiper-pagination',
}, },
navigation: { navigation: {
nextEl: '.swiper-button-next', nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev', prevEl: '.swiper-button-prev',
}, },
} }
) )
}) })
}) })
//行业动态 //行业动态
hyDtai().then((res)=>{ hyDtai().then((res) => {
this.hydata.src=res.data[0].picture this.hydata.src = res.data[0].picture
this.hydata.content=res.data[0].content this.hydata.content = res.data[0].content
}) })
//背景图文轮播图 //背景图文轮播图
smallPicture().then((res)=>{ smallPicture().then((res) => {
this.smallPicturearr=res.data this.smallPicturearr = res.data
this.$nextTick(()=>{ this.$nextTick(() => {
new Swiper('.swiper2', { new Swiper('.swiper2', {
slidesPerView: 3, slidesPerView: 3,
slidesPerGroup: 1, slidesPerGroup: 1,
spaceBetween: 20, spaceBetween: 20,
pagination: { pagination: {
el: '.swiper-pagination2' el: '.swiper-pagination2'
} }
}) })
}) })
}) })
//荣誉展示 //荣誉展示
achievementPic().then((res)=>{ honor({'year':'all'}).then((res) => {
this.achievementarr=res.data this.achievementarr = res.data
this.$nextTick(()=>{ this.$nextTick(() => {
new Swiper('.swiper3', { new Swiper('.swiper3', {
slidesPerView: 4, slidesPerView: 4,
slidesPerGroup: 1, slidesPerGroup: 1,
spaceBetween: 20, spaceBetween: 20,
pagination: { pagination: {
el: '.swiper-pagination1' el: '.swiper-pagination1'
} }
}) })
}) })
}) })
//新闻展示 //新闻展示
getnews({'page':0}).then((res)=>{ getnews({ 'page': 0 }).then((res) => {
this.newsitem=res.data.content[1] this.newsitem = res.data.content[1]
}) })
//图文展示 //图文展示
backgroundText().then((res)=>{ backgroundText().then((res) => {
this.bgtextitem=res.data[0] this.bgtextitem = res.data[0]
}) })
@ -288,25 +292,31 @@ export default {
// 初始化Swiper // 初始化Swiper
}, },
methods:{ methods: {
switchto(){ switchto() {
this.$router.push({ this.$router.push({
path:'/aboutus' path: '/aboutus',
}) query:{'category':'honor'}
}, })
changeto(id){ },
if(id){ changeto(id) {
if (id) {
this.$router.push({ this.$router.push({
path:'/detail?id='+id path: '/detail?id=' + id
}) })
}else{ } else {
console.log(id) console.log(id)
this.$router.push({ this.$router.push({
path:'/news' path: '/news'
}) })
} }
},
honorto(id){
this.$router.push({
path: '/honordetail?id=' + id
})
} }
}, },
beforeDestroy() { beforeDestroy() {
@ -357,7 +367,7 @@ export default {
height: 100%; height: 100%;
} }
.swiper-slide1 { .swiper-slide1 {
min-width: calc(26.66666vw - 14px); min-width: calc(26.66666vw - 14px);
max-width: calc(26.66666vw - 14px); max-width: calc(26.66666vw - 14px);
@ -366,12 +376,12 @@ export default {
} }
.swiper-slide2{ .swiper-slide2 {
width:100%; width: 100%;
} }
.swiper-slide::after { .swiper-slide::after {
content: ''; content: '';
left: 0px; left: 0px;
position: absolute; position: absolute;
@ -439,7 +449,7 @@ h6 {
.index-top { .index-top {
position: relative; position: relative;
padding-bottom: 24px; padding-bottom: 24px;
margin-bottom: 24px; margin-bottom: 24px;
border-bottom: 2px solid #c9c9c9; border-bottom: 2px solid #c9c9c9;
border-bottom: 2px solid rgba(201, 201, 201, .5); border-bottom: 2px solid rgba(201, 201, 201, .5);
@ -475,7 +485,7 @@ padding-bottom: 24px;
padding-top: 140px; padding-top: 140px;
width: 100%; width: 100%;
height: 604px; height: 604px;
background: url(http://1.94.20.201/fyapi/images/86e81da7-b406-45ad-a8b6-94be672da4a2.png) no-repeat center;
background-attachment: fixed; background-attachment: fixed;
background-size: cover; background-size: cover;
} }
@ -484,7 +494,7 @@ padding-bottom: 24px;
font-size: 48px; font-size: 48px;
color: RGB(48, 113, 183); color: RGB(48, 113, 183);
line-height: 60px; line-height: 60px;
margin-top:48px; margin-top: 48px;
margin-bottom: 14px; margin-bottom: 14px;
font-weight: lighter; font-weight: lighter;
} }
@ -495,35 +505,40 @@ padding-bottom: 24px;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
font-weight: bold; font-weight: bold;
} }
.swiper9 .swiper-slide::after{
all:initial .swiper9 .swiper-slide::after {
all: initial
} }
.swiper-slide9 img { .swiper-slide9 img {
width: 100%; width: 100%;
} }
.dot_box .i{
display: inline-block;
width: 6px;
height: 6px;
background-color: RGB(48, 113, 183); .dot_box .i {
border-radius: 50%; display: inline-block;
margin: 0 2px; width: 6px;
height: 6px;
background-color: RGB(48, 113, 183);
border-radius: 50%;
margin: 0 2px;
} }
.text {
font-size: 14.5px; .text {
color: RGB(48, 113, 183); font-size: 14.5px;
display: inline-block; color: RGB(48, 113, 183);
display: inline-block;
} }
.init p{
.init p {
margin: 0 !important; margin: 0 !important;
} }
.init2{
.init2 {
font-size: 16px; font-size: 16px;
line-height: 24px; line-height: 24px;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
font-weight: bold; font-weight: bold;
} }
</style> </style>

83
src/views/aboutus.vue
View File

@ -176,25 +176,27 @@
<div style="width: 80%;margin: auto;flex-wrap: wrap;justify-content: space-between; display: grid; <div style="width: 80%;margin: auto;flex-wrap: wrap;justify-content: space-between; display: grid;
grid-template-columns: repeat(auto-fill, minmax(31.33%, 1fr)); grid-template-columns: repeat(auto-fill, minmax(31.33%, 1fr));
grid-column-gap: 2%;"> grid-column-gap: 2%;">
<div style="width: auto;margin-bottom: 20px;border-radius: 10px;" v-for="item in honorList" :key="item.id"> <div style="width: auto;margin-bottom: 20px;border-radius: 10px;cursor: pointer;" v-for="item in honorList" :key="item.id" @click="changeto(item.id)">
<div style="padding: 10% 0;background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;"> <div style="background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;">
<!-- <img src="@/assets/images/rongyu/1.png" <!-- <img src="@/assets/images/rongyu/1.png"
style="height: 100%;object-fit: contain;margin: auto;display: block;"> --> style="height: 100%;object-fit: contain;margin: auto;display: block;"> -->
<img :src="item.picture" <!-- <img :src="item.picture"
style="width:100%;height: 345px; margin: auto;display: block;scale: 0.8;"> style="width:100%;height: 345px; margin: auto;display: block;scale: 0.85;"> -->
</div> </div>
<div <!-- <div
style="background-color: rgb(248,248,248);padding-left: 5%;padding-right: 5%; border-radius: 0 0 14px 14px ;height: 100px;overflow: hidden;"> style="background-color: rgb(248,248,248);padding-left: 5%;padding-right: 5%; border-radius: 0 0 14px 14px ;height: 100px;overflow: hidden;">
<h3 style="padding: 10px 0 0 0 ;color:rgb(108,108,118);margin: 0;">{{ item.annual }}</h3> <h3 style="padding: 10px 0 0 0 ;color:rgb(108,108,118);margin: 0;">{{ item.annual }}</h3>
<p style="color:rgb(155,155,155)"> <p style="color:rgb(155,155,155)">
<!-- J2016P01地块建设工程(1-14号楼及联合地下
室主体),荣膺2018年度市级建筑施工安全生
产标准化优良项目。 -->
{{ item.name }} {{ item.name }}
</p> </p>
</div> </div> -->
<div style="height: 100%;text-align: center; border: 5px solid #F8F8F8;">
<img :src="item.picture" alt="200603" style="scale: 0.85;height: 100%;width: 100%"> </div>
</div> </div>
<!-- <div style="width: auto;margin-bottom: 20px;border-radius: 10px;"> <!-- <div style="width: auto;margin-bottom: 20px;border-radius: 10px;">
<div style="padding: 10% 0;background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;"> <div style="padding: 10% 0;background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;">
@ -281,11 +283,10 @@
</div> </div>
<div <div
style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;"> style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;">
<h3 style="color:rgb(108,108,118);margin: 0;">企业愿景</h3> <h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[2].name }}</h3>
<h5>CORPORATE <br>VISION</h5> <h5>{{culturelist[2].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">成为载誉八闽的一流建筑承包商</p> <p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[2].content">
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">用一流服务打造一流的飞阳口碑 </p>
</p>
</div> </div>
</div> </div>
<div style="width: 32%;margin-bottom: 20px;"> <div style="width: 32%;margin-bottom: 20px;">
@ -297,11 +298,10 @@
</div> </div>
<div <div
style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;"> style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;">
<h3 style="color:rgb(108,108,118);margin: 0;">企业使命</h3> <h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[1].name }}</h3>
<h5>CORPORATE <br>MISSION</h5> <h5>{{culturelist[1].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">不断提升管理和服务能力</p> <p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[1].content">
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">为客户创造价值 </p>
</p>
</div> </div>
</div> </div>
<div style="width: 32%;margin-bottom: 20px;"> <div style="width: 32%;margin-bottom: 20px;">
@ -313,13 +313,13 @@
</div> </div>
<div <div
style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;"> style="background-color: rgb(248,248,248);padding: 36px 42px 0; border-radius: 0 0 14px 14px ;line-height: 24px;height: 230px;">
<h3 style="color:rgb(108,108,118);margin: 0;">核心价值观</h3> <h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[0].name }}</h3>
<h5>CORPORATE <br>VALUES</h5> <h5>{{culturelist[0].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">敢言道正 树立榜样 尊重他人 客观持平 贵乎自知 <p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[0].content">
</p> </p>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">承担责任 透明公开 诚恳可靠 正直不阿
</p>
</div> </div>
</div> </div>
@ -332,14 +332,23 @@
</div> </div>
</template> </template>
<script> <script>
import { honor } from '@/api'; import { honor,culture } from '@/api';
import { honorList } from '@/api'; import { honorList } from '@/api';
export default { export default {
data() { data() {
return { return {
activeName: 'first', activeName: 'first',
timeIndex: 6, timeIndex: 0,
timeLineList: [{ timeLineList:
[
{
"timestamp": "全部",
"color": "#999",
"fontsize": 18,
"year": "all",
"bgcolor": "#e4e7ed",
},{
"timestamp": "2024年", "timestamp": "2024年",
"color": "#999", "color": "#999",
"fontsize": 18, "fontsize": 18,
@ -408,19 +417,27 @@ export default {
"year": "2017", "year": "2017",
"info": "chengli" "info": "chengli"
}], }],
honorList:[] honorList:[],
culturelist:[]
} }
}, },
mounted(){ mounted(){
// honor({'year':'2019'}).then((res)=>{ // honor({'year':'2019'}).then((res)=>{
// console.log(res) // console.log(res)
// }) // })
this.getHonner('2018')
if(this.$route.query.category){
this.activeName='second'
}
this.getHonner('all')
culture().then((res)=>{
this.culturelist=res.data
})
}, },
methods: { methods: {
async getHonner(year){ async getHonner(year){
console.log(year)
const {data:res} = await honorList({'year':year}); const {data:res} = await honorList({'year':year});
console.log(res) console.log(res)
@ -465,6 +482,11 @@ export default {
console.log(year) console.log(year)
this.getHonner(year) this.getHonner(year)
} }
},
changeto(id){
this.$router.push({
path: '/honordetail?id=' + id
})
} }
} }
}; };
@ -840,5 +862,6 @@ h5 {
letter-spacing: -1px; letter-spacing: -1px;
margin-top: 8px; margin-top: 8px;
margin-bottom: 8px; margin-bottom: 8px;
width:203px;
} }
</style> </style>

207
src/views/honordetail.vue Normal file
View File

@ -0,0 +1,207 @@
<template>
<div>
<div class="page_ban">
<div class="img compbg"></div>
<div class="content">
<div class="page_nav">
<div class="name">
<a style="padding: 0;" href="">荣誉资讯</a> <a href="javascript:;">荣誉详情</a>
</div>
<div class="list" style="bottom:-15px">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="荣誉详情" name="first"></el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</div>
<div class="Wrapper news_d">
<div class="content" style="text-align: center;">
<div class="name">{{ name }}</div>
<div class="top-box"> <div class="date">{{time}}</div> </div>
<div class="divider"></div>
<div v-html="content"></div>
</div>
<div class="con">
</div>
</div>
</div>
</template>
<script>
import { honordetail } from '@/api';
export default{
data(){
return{
name:'',
content:'',
time:''
}
},
methods:{
},
mounted(){
honordetail(this.$route.query).then((res)=>{
this.content=res.data.content
this.name=res.data.name
this.time=res.data.createTime
})
},
}
</script>
<style scoped>
.divider {
width: 100%;
height: 3px;
background-color: #0059a7;
position: static;
margin-bottom: 28px;
}
.name {
font-size: 30px;
color: #0007a9;
color: rgba(0, 7, 169, .8);
line-height: 36px;
}
.news_d {
padding: 60px 0 90px;
overflow: hidden;
}
.Wrapper {
position: relative;
background-color: #fff;
z-index: 100;
}
.news_d .name {
font-size: 30px;
color: #0007a9;
color: rgba(0, 7, 169, .8);
line-height: 36px;
}
::v-deep .el-tabs__item {
color: rgba(255, 255, 255, 0.8);
border: none;
}
::v-deep .el-tabs__nav-wrap::after {
background-color: transparent;
}
.news_d .con p {
font-size: 14.5px;
color: #8e8e95;
line-height: 26px;
margin-bottom: 26px;
text-align: justify;
}
.compbg {
background-image: url('../assets/images/banner.png');
}
.page_ban {
height: 404px;
position: relative;
text-align: center;
z-index: 101;
}
.page_ban .img {
width: 100%;
height: 100%;
background-size: cover;
position: absolute;
left: 0;
top: 0;
z-index: -1;
}
.top-box{
margin: 16px 0 30px;
}
.date{
font-size: 26px;
color: #dfd4c3;
line-height: 1;
bottom: 20px;
padding: 0 30px;
width: 100%;
}
.page_ban .content {
position: relative;
height: 100%;
}
.content {
width: 80%;
margin: 0 auto;
}
.page_nav {
width: 100%;
position: absolute;
left: 0;
bottom: 0;
}
div,
li {
box-sizing: border-box;
}
.page_nav .name {
float: left;
}
.page_nav .list {
position: relative;
float: right;
margin-right: -35px;
}
.page_nav a {
float: left;
line-height: 76px;
position: relative;
font-size: 14.5px;
color: white;
font-weight: bold;
text-decoration: none;
}
.page_nav .name a {
padding-left: 30px;
/* background: url() no-repeat left 30px; */
}
.page_nav .list {
position: relative;
float: right;
margin-right: -35px;
}
.page_nav .list a {
color: #e7dfd2;
color: rgba(231, 223, 210, .7);
margin-right: 35px;
}
.page_nav a {
float: left;
line-height: 76px;
position: relative;
font-size: 14.5px;
color: rgba(255, 255, 255, 0.8);
font-weight: bold;
}
</style>

33
src/views/news.vue
View File

@ -26,7 +26,7 @@
<div class="date">{{item.releaseTime}}</div> <div class="date">{{item.releaseTime}}</div>
</div> </div>
<div> <div>
<div class="news_li_con"><div class="title">{{item.name}}</div> <div class="introduction" >{{ item.source }}</div> <div class="more">more...</div> </div> <div class="news_li_con"><div class="title">{{item.name}}</div> <div class="introduction" >{{ item.source }}</div> </div>
</div> </div>
</el-card> </el-card>
@ -61,12 +61,27 @@
</div> </div>
<div style="width: 80%;margin: auto;"> <div style="width: 80%;margin: auto;">
<div v-for="item in rest" class="newsitem" style="overflow: hidden; padding: 30px 0 24px;position: relative;cursor: pointer;" @click="changeto(item.id)"> <div v-for="item in rest" class="newsitem" style="overflow: hidden; padding: 30px 0 24px;position: relative;cursor: pointer;display: flex;" @click="changeto(item.id)">
<div class="date1" style="width: 12%;">{{item.releaseTime}}</div> <div class="date1" style=""><img :src="item.pic" style="width: 236px;height: 157px;"></img></div>
<div class="" style=" float: left; <div class="" style=" width: 65%;margin-left: 35px;">
width: 88%;"> <div class="title1">{{item.name}} <div style=" font-size: 18px;
</div> <div class="introduction1">{{item.source}} color: #000;
</div></div> font-weight: bold;
margin-top: 15px;">
{{item.name}}
</div>
<div style="font-size: 14px;
margin-top: 7px;
color: #ababab;">
{{item.releaseTime}}
</div>
<div style="font-size: 14px;
color: #666666;
margin-top: 10px;">
{{item.source}}
</div>
</div>
</div> </div>
<div style="height: 40px;"></div> <div style="height: 40px;"></div>
<div class="page_more wow fadeInUp animated" data-wow-delay=".2s" id="More" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;" @click="addnews"> <div class="page_more wow fadeInUp animated" data-wow-delay=".2s" id="More" style="visibility: visible; animation-delay: 0.2s; animation-name: fadeInUp;" @click="addnews">
@ -298,7 +313,7 @@ float: none;
.news_li_con { .news_li_con {
position: relative; position: relative;
padding-left: 28px; padding-left: 28px;
height: 200px; height: 150px;
overflow: hidden; overflow: hidden;
} }
.news_li_con:before { .news_li_con:before {
@ -363,7 +378,7 @@ div{
left: 0; left: 0;
} }
.newsitem .date1{ .newsitem .date1{
width: 128px; width: 236px;
float: left; float: left;
font-family: 'Rajdhani'; font-family: 'Rajdhani';
font-size: 26px; font-size: 26px;

39
src/views/project.vue
View File

@ -21,10 +21,13 @@
</el-radio-group> </el-radio-group>
</div> </div>
<div class="content2" style="width: 80%;margin: auto;display: flex;justify-content: space-between;flex-wrap: wrap;"> <div class="content2" style="width: 80%;margin: auto;display: flex;justify-content: space-between;flex-wrap: wrap;">
<div v-for="item in PrijectList" style="width: 32%;border-radius: 15px 15px 0 0 ;background-color: rgb(245,245,245);margin-bottom: 2%;"> <div v-for="item in PrijectList" style="width: 32%;border-radius: 15px 15px 0 0 ;margin-bottom: 2%; border-bottom: 1px solid #D9D9D9;cursor: pointer;" @click="changeto(item.id)">
<img :src="item.picture" style="width: 100%;border-radius: 15px 15px 0 0 ;">
<div style="padding: 2px 20px;display:flex ;justify-content: space-between;"> <img :src="item.picture" style="width: 100%;border-radius: 15px ;">
<p>{{item.name}}</p><p class="project-font" @click="changeto(item.id)" style="cursor: pointer;" >MORE...</p> <div style="padding: 2px 20px;justify-content: space-between;">
<!-- <p>{{item.name}}</p><p class="project-font" @click="changeto(item.id)" style="cursor: pointer;" >MORE...</p> -->
<span class="cpbt"> <b class="l">{{item.name}} </b> <i class="r">&gt;</i> </span>
</div> </div>
</div> </div>
<!-- <div style="width: 32%;border-radius: 15px 15px 0 0;background-color: rgb(245,245,245);margin-bottom: 2%;"> <!-- <div style="width: 32%;border-radius: 15px 15px 0 0;background-color: rgb(245,245,245);margin-bottom: 2%;">
@ -307,5 +310,33 @@ li {
line-height: 39px; line-height: 39px;
height: 40px; height: 40px;
} }
.cpbt {
display: block;
height: 71px;
line-height: 71px;
}
b {
font-size: 16px;
color: #000;
}
.l {
float: left;
}
b, strong {
font-weight: 700;
}
i {
font-size: 16px;
color: #000;
font-family: 宋体;
font-style: normal;
}
.r {
float: right;
}
</style> </style>

69
src/views/projectdetail.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div> <div>
<div class="page_ban"> <div class="page_ban">
<div class="img compbg"></div> <div class="img compbg"></div>
<div class="content"> <div class="content">
@ -18,6 +18,23 @@
</div> </div>
</div> </div>
<div class="Wrapper news_d"> <div class="Wrapper news_d">
<div style="display: flex;width: 95%;justify-content: space-between;">
<div style="width: 30%;background-color:rgb(228,235,241);">
<div style="width: 100%;padding-left: 30%;box-sizing: border-box;">
<div class="z_xq_cont_top_lt">工程简介</div>
<div class="z_xq_cont_top_ls"></div>
<div class="z_xq_cont_top_lc"><img src="https://www.fygroup.cn//skin/images/xqjt.png"></div>
<div class="z_xq_cont_top_lx">
<div class="jzmssj">{{area}} <span class="dwi">㎡</span></div>
<div class="jzmsms">工程建筑面积</div>
</div>
<div class="z_xq_cont_top_lx">
<div class="jzmssj">{{ height }} <span class="dwi">M</span></div>
<div class="jzmsms">建筑高度</div>
</div>
</div>
</div>
<div style="width: 70%;">
<div class="content" style="text-align: center;"> <div class="content" style="text-align: center;">
<div class="name">{{ name }}</div> <div class="name">{{ name }}</div>
<div class="top-box"> <div class="date">{{time}}</div> </div> <div class="top-box"> <div class="date">{{time}}</div> </div>
@ -25,13 +42,13 @@
<div v-html="content"></div> <div v-html="content"></div>
</div> </div>
<div class="con"> <div class="con">
</div>
</div>
</div> </div>
</div> </div>
</div>
</div>
</template> </template>
<script> <script>
import { projectdetail } from '@/api'; import { projectdetail } from '@/api';
@ -40,7 +57,9 @@ export default{
return{ return{
name:'', name:'',
content:'', content:'',
time:'' time:'',
area:'',
height:''
} }
}, },
methods:{ methods:{
@ -51,6 +70,8 @@ export default{
this.content=res.data.particulars this.content=res.data.particulars
this.name=res.data.name this.name=res.data.name
this.time=res.data.completeTime this.time=res.data.completeTime
this.area=res.data.area
this.height=res.data.height
}) })
}, },
} }
@ -142,7 +163,7 @@ background-color: transparent;
height: 100%; height: 100%;
} }
.content { .content {
width: 80%; width: 86%;
margin: 0 auto; margin: 0 auto;
} }
@ -204,4 +225,40 @@ li {
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
font-weight: bold; font-weight: bold;
} }
.z_xq_cont_top_lt {
font-size: 25px;
color: #000000;
margin-top: 55px;
font-weight: bold;
}
.z_xq_cont_top_ls {
font-size: 20px;
color: #263d8f;
margin: 20px 0;
}
.z_xq_cont_top_lc {
overflow: hidden;
}
.z_xq_cont_top_lc img {
-webkit-box-sizing: border-box;
box-sizing: border-box;
vertical-align: middle;
border: 0;
}
.z_xq_cont_top_lx {
height: 88px;
border-left: 1px solid #CCCCCC;
padding-left: 10px;
margin-top: 50px;
}
.z_xq_cont_top_lx .jzmssj {
font-size: 46px;
color: #263d8f;
font-weight: 100;
line-height: 52px;
}
.z_xq_cont_top_lx .jzmssj .dwi {
font-size: 14px;
color: #666666;
}
</style> </style>