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
})
}
//企业文化
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 detail from '@/views/detail.vue'
import projectdetail from '@/views/projectdetail.vue'
import honordetail from '@/views/honordetail.vue'
Vue.use(VueRouter)
const routes = [
@ -44,6 +45,10 @@ const routes = [
{
path:'/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="swiper-container swiper5">
<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 class="swiper-pagination"></div>
@ -33,49 +34,44 @@
保利发展控股股票代码</h3>
<h5 class="red green"><em style="display: block;">8.03</em>RMB</h5>
</div> -->
<!-- 暂定动态 -->
<div style="width: 50%;"></div>
<!-- 暂定动态 -->
<div style="width: 50%;"></div>
</div>
<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;
color: #3c3c48;
color: rgba(60, 60, 72, .8);
line-height: 30px;">{{newsitem.name}}</h3>
line-height: 30px;">{{ newsitem.name }}</h3>
<h5 style=" width: auto;
float: none;
font-size: 30px;
color: #c0a988;
margin: 3px 0 6px; line-height: 1;
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;
color: #95959d;
line-height: 24px;
text-align: justify;">{{newsitem.source}}
text-align: justify;">{{ newsitem.source }}
</p>
</div>
<div style="overflow: hidden;">
</div>
<div @click="changeto(false)" style="cursor: pointer;">
<div class="dot_box" style=" font-size: 0;
<div @click="changeto(false)" style="cursor: pointer;">
<div class="dot_box" style=" font-size: 0;
margin-top: 20px;
top: -2px;
display: inline-block;
text-align: center;
position: relative;"
>
<div class="i"></div>
<div class="i"></div>
<div class="i"></div>
</div>
<div class="text">更多新闻</div>
</div>
position: relative;">
<div class="i"></div>
<div class="i"></div>
<div class="i"></div>
</div>
<div class="text">更多新闻</div>
</div>
</div>
@ -98,19 +94,23 @@
</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 class="tiltle">
<!-- 飞阳建设工程业务领域<br>
<!-- 飞阳建设工程业务领域<br>
建筑产业<br>
现代化发展趋势 -->
<h3 class="init" v-html="bgtextitem.content">
<h3 class="init" v-html="bgtextitem.contentUp">
</h3>
<div class="init2" v-html="bgtextitem.contents">
<div class="init2" v-html="bgtextitem.contentDown">
</div>
<!-- <p style="width: 500px;">
飞阳包含房屋建筑市政公路、工业建筑，金属门窗、”钢结构广等业务领域 致力于数据化、智能化创新发展，积极探索建筑产业现代化发展趋势
</p> -->
</div>
</div>
<div class="list" style="position: absolute;
left: 0;
@ -120,7 +120,8 @@
<div class="swiper2" style="max-width: 80vw;overflow: hidden;height: 100%;">
<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>
@ -149,7 +150,8 @@
<!-- <h3></h3> -->
<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> -->
</div>
@ -160,16 +162,18 @@
</div>
</div>
<div style="max-width: 80vw;overflow: hidden;height: 100%;margin: auto;">
<div class="swiper3" >
<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="swiper3">
<div class="swiper-wrapper swiper9">
<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 class="swiper-pagination1" style="text-align: center;"></div>
</div>
</div>
</div>
</div>
@ -183,86 +187,86 @@
import Swiper from 'swiper'
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 {
data() {
return {
hydata:{src:''},
imgarr:[],
achievementarr:[],
newsitem:{},
bgtextitem:{},
smallPicturearr:[]
hydata: { src: '' },
imgarr: [],
achievementarr: [],
newsitem: {},
bgtextitem: {},
smallPicturearr: []
}
},
mounted() {
//大图轮播图
swiperimg().then((res)=>{
this.imgarr=res.data
this.$nextTick(()=>{
new Swiper('.swiper5', {
loop: true,
autoplay: {
delay: 4100,
disableOnInteraction: false,
},
swiperimg().then((res) => {
this.imgarr = res.data
this.$nextTick(() => {
new Swiper('.swiper5', {
loop: true,
autoplay: {
delay: 4100,
disableOnInteraction: false,
},
pagination: {
el: '.swiper-pagination',
pagination: {
el: '.swiper-pagination',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
}
)
})
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
}
)
})
})
//行业动态
hyDtai().then((res)=>{
this.hydata.src=res.data[0].picture
this.hydata.content=res.data[0].content
//行业动态
hyDtai().then((res) => {
this.hydata.src = res.data[0].picture
this.hydata.content = res.data[0].content
})
//背景图文轮播图
smallPicture().then((res)=>{
this.smallPicturearr=res.data
this.$nextTick(()=>{
new Swiper('.swiper2', {
slidesPerView: 3,
slidesPerGroup: 1,
spaceBetween: 20,
pagination: {
el: '.swiper-pagination2'
}
})
})
//背景图文轮播图
smallPicture().then((res) => {
this.smallPicturearr = res.data
this.$nextTick(() => {
new Swiper('.swiper2', {
slidesPerView: 3,
slidesPerGroup: 1,
spaceBetween: 20,
pagination: {
el: '.swiper-pagination2'
}
})
})
})
//荣誉展示
achievementPic().then((res)=>{
this.achievementarr=res.data
this.$nextTick(()=>{
honor({'year':'all'}).then((res) => {
this.achievementarr = res.data
this.$nextTick(() => {
new Swiper('.swiper3', {
slidesPerView: 4,
slidesPerGroup: 1,
spaceBetween: 20,
pagination: {
el: '.swiper-pagination1'
}
})
slidesPerView: 4,
slidesPerGroup: 1,
spaceBetween: 20,
pagination: {
el: '.swiper-pagination1'
}
})
})
})
//新闻展示
getnews({'page':0}).then((res)=>{
this.newsitem=res.data.content[1]
getnews({ 'page': 0 }).then((res) => {
this.newsitem = res.data.content[1]
})
//图文展示
backgroundText().then((res)=>{
this.bgtextitem=res.data[0]
backgroundText().then((res) => {
this.bgtextitem = res.data[0]
})
@ -288,25 +292,31 @@ export default {
// 初始化Swiper
},
methods:{
switchto(){
methods: {
switchto() {
this.$router.push({
path:'/aboutus'
})
},
changeto(id){
if(id){
path: '/aboutus',
query:{'category':'honor'}
})
},
changeto(id) {
if (id) {
this.$router.push({
path:'/detail?id='+id
})
}else{
path: '/detail?id=' + id
})
} else {
console.log(id)
this.$router.push({
path:'/news'
})
path: '/news'
})
}
},
honorto(id){
this.$router.push({
path: '/honordetail?id=' + id
})
}
},
beforeDestroy() {
@ -357,7 +367,7 @@ export default {
height: 100%;
}
.swiper-slide1 {
.swiper-slide1 {
min-width: calc(26.66666vw - 14px);
max-width: calc(26.66666vw - 14px);
@ -366,12 +376,12 @@ export default {
}
.swiper-slide2{
width:100%;
.swiper-slide2 {
width: 100%;
}
.swiper-slide::after {
.swiper-slide::after {
content: '';
left: 0px;
position: absolute;
@ -439,7 +449,7 @@ h6 {
.index-top {
position: relative;
padding-bottom: 24px;
padding-bottom: 24px;
margin-bottom: 24px;
border-bottom: 2px solid #c9c9c9;
border-bottom: 2px solid rgba(201, 201, 201, .5);
@ -475,7 +485,7 @@ padding-bottom: 24px;
padding-top: 140px;
width: 100%;
height: 604px;
background: url(http://1.94.20.201/fyapi/images/86e81da7-b406-45ad-a8b6-94be672da4a2.png) no-repeat center;
background-attachment: fixed;
background-size: cover;
}
@ -484,7 +494,7 @@ padding-bottom: 24px;
font-size: 48px;
color: RGB(48, 113, 183);
line-height: 60px;
margin-top:48px;
margin-top: 48px;
margin-bottom: 14px;
font-weight: lighter;
}
@ -495,35 +505,40 @@ padding-bottom: 24px;
color: rgba(255, 255, 255, .5);
font-weight: bold;
}
.swiper9 .swiper-slide::after{
all:initial
.swiper9 .swiper-slide::after {
all: initial
}
.swiper-slide9 img {
width: 100%;
}
.dot_box .i{
display: inline-block;
width: 6px;
height: 6px;
background-color: RGB(48, 113, 183);
border-radius: 50%;
margin: 0 2px;
.dot_box .i {
display: inline-block;
width: 6px;
height: 6px;
background-color: RGB(48, 113, 183);
border-radius: 50%;
margin: 0 2px;
}
.text {
font-size: 14.5px;
color: RGB(48, 113, 183);
display: inline-block;
.text {
font-size: 14.5px;
color: RGB(48, 113, 183);
display: inline-block;
}
.init p{
.init p {
margin: 0 !important;
}
.init2{
.init2 {
font-size: 16px;
line-height: 24px;
color: rgba(255, 255, 255, .5);
font-weight: bold;
line-height: 24px;
color: rgba(255, 255, 255, .5);
font-weight: bold;
}
</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;
grid-template-columns: repeat(auto-fill, minmax(31.33%, 1fr));
grid-column-gap: 2%;">
<div style="width: auto;margin-bottom: 20px;border-radius: 10px;" v-for="item in honorList" :key="item.id">
<div style="padding: 10% 0;background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;">
<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="background-color: rgb(240,246,250); border-radius: 14px 14px 0 0;">
<!-- <img src="@/assets/images/rongyu/1.png"
style="height: 100%;object-fit: contain;margin: auto;display: block;"> -->
<img :src="item.picture"
style="width:100%;height: 345px; margin: auto;display: block;scale: 0.8;">
<!-- <img :src="item.picture"
style="width:100%;height: 345px; margin: auto;display: block;scale: 0.85;"> -->
</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;">
<h3 style="padding: 10px 0 0 0 ;color:rgb(108,108,118);margin: 0;">{{ item.annual }}</h3>
<p style="color:rgb(155,155,155)">
<!-- J2016P01地块建设工程(1-14号楼及联合地下
室主体),荣膺2018年度市级建筑施工安全生
产标准化优良项目。 -->
{{ item.name }}
</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 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;">
@ -281,11 +283,10 @@
</div>
<div
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>
<h5>CORPORATE <br>VISION</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;">用一流服务打造一流的飞阳口碑
</p>
<h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[2].name }}</h3>
<h5>{{culturelist[2].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[2].content">
</p>
</div>
</div>
<div style="width: 32%;margin-bottom: 20px;">
@ -297,11 +298,10 @@
</div>
<div
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>
<h5>CORPORATE <br>MISSION</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;">为客户创造价值
</p>
<h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[1].name }}</h3>
<h5>{{culturelist[1].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[1].content">
</p>
</div>
</div>
<div style="width: 32%;margin-bottom: 20px;">
@ -313,13 +313,13 @@
</div>
<div
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>
<h5>CORPORATE <br>VALUES</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">敢言道正 树立榜样 尊重他人 客观持平 贵乎自知
<h3 style="color:rgb(108,108,118);margin: 0;">{{ culturelist[0].name }}</h3>
<h5>{{culturelist[0].synopsis}}</h5>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;" v-html="culturelist[0].content">
</p>
<p style="color: rgb(169,169,169);margin: 0;font-size: 14px;">承担责任 透明公开 诚恳可靠 正直不阿
</p>
</div>
</div>
@ -332,14 +332,23 @@
</div>
</template>
<script>
import { honor } from '@/api';
import { honor,culture } from '@/api';
import { honorList } from '@/api';
export default {
data() {
return {
activeName: 'first',
timeIndex: 6,
timeLineList: [{
timeIndex: 0,
timeLineList:
[
{
"timestamp": "全部",
"color": "#999",
"fontsize": 18,
"year": "all",
"bgcolor": "#e4e7ed",
},{
"timestamp": "2024年",
"color": "#999",
"fontsize": 18,
@ -408,19 +417,27 @@ export default {
"year": "2017",
"info": "chengli"
}],
honorList:[]
honorList:[],
culturelist:[]
}
},
mounted(){
// honor({'year':'2019'}).then((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: {
async getHonner(year){
console.log(year)
const {data:res} = await honorList({'year':year});
console.log(res)
@ -465,6 +482,11 @@ export default {
console.log(year)
this.getHonner(year)
}
},
changeto(id){
this.$router.push({
path: '/honordetail?id=' + id
})
}
}
};
@ -840,5 +862,6 @@ h5 {
letter-spacing: -1px;
margin-top: 8px;
margin-bottom: 8px;
width:203px;
}
</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>
<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>
</el-card>
@ -61,12 +61,27 @@
</div>
<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 class="date1" style="width: 12%;">{{item.releaseTime}}</div>
<div class="" style=" float: left;
width: 88%;"> <div class="title1">{{item.name}}
</div> <div class="introduction1">{{item.source}}
</div></div>
<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=""><img :src="item.pic" style="width: 236px;height: 157px;"></img></div>
<div class="" style=" width: 65%;margin-left: 35px;">
<div style=" font-size: 18px;
color: #000;
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 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">
@ -298,7 +313,7 @@ float: none;
.news_li_con {
position: relative;
padding-left: 28px;
height: 200px;
height: 150px;
overflow: hidden;
}
.news_li_con:before {
@ -363,7 +378,7 @@ div{
left: 0;
}
.newsitem .date1{
width: 128px;
width: 236px;
float: left;
font-family: 'Rajdhani';
font-size: 26px;

39
src/views/project.vue
View File

@ -21,10 +21,13 @@
</el-radio-group>
</div>
<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%;">
<img :src="item.picture" style="width: 100%;border-radius: 15px 15px 0 0 ;">
<div style="padding: 2px 20px;display:flex ;justify-content: space-between;">
<p>{{item.name}}</p><p class="project-font" @click="changeto(item.id)" style="cursor: pointer;" >MORE...</p>
<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 ;">
<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 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;
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>

69
src/views/projectdetail.vue
View File

@ -1,5 +1,5 @@
<template>
<div>
<div>
<div class="page_ban">
<div class="img compbg"></div>
<div class="content">
@ -18,6 +18,23 @@
</div>
</div>
<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="name">{{ name }}</div>
<div class="top-box"> <div class="date">{{time}}</div> </div>
@ -25,13 +42,13 @@
<div v-html="content"></div>
</div>
<div class="con">
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { projectdetail } from '@/api';
@ -40,7 +57,9 @@ export default{
return{
name:'',
content:'',
time:''
time:'',
area:'',
height:''
}
},
methods:{
@ -51,6 +70,8 @@ export default{
this.content=res.data.particulars
this.name=res.data.name
this.time=res.data.completeTime
this.area=res.data.area
this.height=res.data.height
})
},
}
@ -142,7 +163,7 @@ background-color: transparent;
height: 100%;
}
.content {
width: 80%;
width: 86%;
margin: 0 auto;
}
@ -204,4 +225,40 @@ li {
color: rgba(255, 255, 255, 0.8);
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>