From 2cebc91556360793947994f7019aaf082d58ae95 Mon Sep 17 00:00:00 2001
From: 77 <270260644@qq.com>
Date: Thu, 15 Aug 2024 09:27:07 +0800
Subject: [PATCH] =?UTF-8?q?aboutus=E7=9A=84=E5=9B=BE=E7=89=87=E6=B2=A1?=
 =?UTF-8?q?=E6=9C=89=E8=87=AA=E9=80=82=E5=BA=94=E4=B8=8Eprojectdetail?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E7=9A=84=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/aboutus.vue       | 1384 ++++++++++++++++++-----------------
 src/views/projectdetail.vue |  504 +++++++------
 2 files changed, 971 insertions(+), 917 deletions(-)

diff --git a/src/views/aboutus.vue b/src/views/aboutus.vue
index a7daa5f..b5952f2 100644
--- a/src/views/aboutus.vue
+++ b/src/views/aboutus.vue
@@ -1,763 +1,797 @@
 <template>
-    <div>
+	<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="/aboutus">走进飞阳</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-tab-pane label="公司荣誉" name="second"></el-tab-pane>
-                    
-                            <el-tab-pane label="企业文化" name="fourth"></el-tab-pane>
-                        </el-tabs>
+		<div class="page_ban">
+			<div class="img compbg"></div>
+			<div class="content">
+				<div class="page_nav">
+					<div class="name">
+						<a style="padding: 0;" href="/aboutus">走进飞阳</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-tab-pane label="公司荣誉" name="second"></el-tab-pane>
 
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div v-show="activeName == 'first'">
-            <div style="width: 80%;margin: auto;">
-                <div style="height: 50px;"></div>
-                <div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleUp}}</div>
-                <div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchUp}}</div>
-                <div style="height: 40px;"></div>
-                <div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;"v-html="componyarr[0].contentUp">
-                 
-                
-                </div>
-                <div style="height: 70px;"></div>
-            </div>
-            <div class="about2">
-                <div class="content">
-                    <div class="bg">
-                        <div class="float wow fadeInUp animated">
-                        </div>
-                        <div class="introduce">
-                            <h3 class="wow fadeInUp animated"
-                                style="animation-delay: 0.1s; visibility: visible; animation-name: fadeInUp;">
-                                <span>信</span><span style="margin-left:44px">责任</span><span
-                                    style="margin-left:44px">和谐</span><span style="margin-left:44px">效益</span>
-                            </h3>
-                            <p class="wow fadeInUp animated"
-                                style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
-                                公司秉承“诚信、责任、和谐、效益”的核心价值观
-                            </p>
-                            <p class="wow fadeInUp animated"
-                                style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
-                                连年被授予国家“守合同重信用企业”、莆田市“纳税大户”、<br>"诚信企业先
-                                进单位”、“建筑业骨干企业”、 “综合实力十强” <br>等光荣称号。
-                            </p>
+							<el-tab-pane label="企业文化" name="fourth"></el-tab-pane>
+						</el-tabs>
 
-                        </div>
-                    </div>
-                </div>
-            </div>
-
-            <div style="width: 80%;margin: auto;">
-                <div style="height: 50px;"></div>
-                <div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleIn}}</div>
-                <div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchIn}}
-                </div>
-                <div style="height: 40px;"></div>
-                <div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;" class="init" v-html="componyarr[0].contentIn">
-                    
-                </div>
-                <div style="height: 40px;"></div>
-            </div>
-            <div style="width: 80%;margin: auto;">
-
-                <div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleDown}}</div>
-                <div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchDown}}
-                </div>
-                <div style="height: 40px;"></div>
-                <div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;"  class="init" v-html="componyarr[0].contentDown">
-                            
-                </div>
-                <div style="height: 70px;"></div>
-            </div>
-            <div class="about_4">
-                <div class="content">
-                    <div class="introduce">
-                        <h3 class="wow fadeInUp animated"
-                            style="animation-delay: 0.2s; visibility: visible; animation-name: fadeInUp;">LEADING THE
-                            LOCAL INDUSTRY
-                        </h3>
-                        <h5 class="wow fadeInUp animated"
-                            style="animation-delay: 0.4s; visibility: visible; animation-name: fadeInUp;">本地行业之首
-                            出
-                            10余个国
-                        </h5>
-                        <p class="wow fadeInUp animated"
-                            style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
-                            自有两个具有设计、生产、安装能力的钢结构装配式基地，制造年产能超过5万吨
-                            位居本地行业之首,<br>产品出口美非亚等10余个国家
-                        </p>
-
-                        <h6 class="wow fadeInUp" style="animation-delay: 0.6s;  animation-name: none;">荣获多个优质工程的荣誉称号
-                        </h6>
-                        <p class="wow fadeInUp animated"
-                            style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
-                            获得了保利地产、建发地产、百威英博(ABInbev) 、美国皇冠制罐、佳通轮胎、南
-                            平铝业、福清核电、<br>湄洲湾核电、鹭燕医药等众多国内外客户的赞誉和认可。
-                        </p>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div v-show="activeName == 'first'">
+			<div style="width: 80%;margin: auto;">
+				<div style="height: 50px;"></div>
+				<div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleUp}}</div>
+				<div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchUp}}</div>
+				<div style="height: 40px;"></div>
+				<div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;" v-html="componyarr[0].contentUp">
 
 
-                    </div>
-                    <div class="bl_map">
-                        <img src="@/assets/images/map.png">
+				</div>
+				<div style="height: 70px;"></div>
+			</div>
+			<div class="about2">
+				<div class="content">
+					<div class="bg">
+						<div class="float wow fadeInUp animated">
+						</div>
+						<div class="introduce">
+							<h3 class="wow fadeInUp animated"
+								style="animation-delay: 0.1s; visibility: visible; animation-name: fadeInUp;">
+								<span>信</span><span style="margin-left:44px">责任</span><span
+									style="margin-left:44px">和谐</span><span style="margin-left:44px">效益</span>
+							</h3>
+							<p class="wow fadeInUp animated"
+								style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
+								公司秉承“诚信、责任、和谐、效益”的核心价值观
+							</p>
+							<p class="wow fadeInUp animated"
+								style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
+								连年被授予国家“守合同重信用企业”、莆田市“纳税大户”、<br>"诚信企业先
+								进单位”、“建筑业骨干企业”、 “综合实力十强” <br>等光荣称号。
+							</p>
 
-                        <div class="scope s3">
-                            <p class="no_margin">中国内地</p>
-                        </div>
+						</div>
+					</div>
+				</div>
+			</div>
 
-                    </div>
-                </div>
-            </div>
-        </div>
-        <div v-show="activeName == 'second'">
-            <!--时间线-->
-            <div class="timeLine" style="overflow: hidden;">
-              
+			<div style="width: 80%;margin: auto;">
+				<div style="height: 50px;"></div>
+				<div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleIn}}</div>
+				<div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchIn}}
+				</div>
+				<div style="height: 40px;"></div>
+				<div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;" class="init"
+					v-html="componyarr[0].contentIn">
 
-                <div class="ul_box" style="padding: 50px 0px;">
+				</div>
+				<div style="height: 40px;"></div>
+			</div>
+			<div style="width: 80%;margin: auto;">
 
-                    <ul class="my_timeline" ref="mytimeline" style=" display: flex;width: 80%;padding: 0;margin: auto;">
-                        <div class="my_timeline_prev" @click="moveLeft()">
-                            <i style="color: skyblue;" class="el-icon-arrow-left"></i>
-                        </div>
-                        <li class="my_timeline_item" v-for="(item, index) in timeLineList" :key="index">
-                            <!--圈圈节点-->
-                            <div class="my_timeline_node" @click="changeActive(index,item)"
-                                :class="{ active: index == timeIndex }"> {{ item.timestamp }}</div>
-                            <!--线-->
+				<div style="font-size: 26px;color:rgba(0,0,0,.6)">{{componyarr[0].titleDown}}</div>
+				<div style="color:rgba(60,115,164);font-size:40px">{{componyarr[0].sketchDown}}
+				</div>
+				<div style="height: 40px;"></div>
+				<div style="color: rgba(0,0,0,.6);line-height: 30px;width: 57%;" class="init"
+					v-html="componyarr[0].contentDown">
 
-                            <!--标注-->
+				</div>
+				<div style="height: 70px;"></div>
+			</div>
+			<div class="about_4">
+				<div class="content">
+					<div class="introduce">
+						<h3 class="wow fadeInUp animated"
+							style="animation-delay: 0.2s; visibility: visible; animation-name: fadeInUp;">LEADING THE
+							LOCAL INDUSTRY
+						</h3>
+						<h5 class="wow fadeInUp animated"
+							style="animation-delay: 0.4s; visibility: visible; animation-name: fadeInUp;">本地行业之首
+							出
+							10余个国
+						</h5>
+						<p class="wow fadeInUp animated"
+							style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
+							自有两个具有设计、生产、安装能力的钢结构装配式基地，制造年产能超过5万吨
+							位居本地行业之首,<br>产品出口美非亚等10余个国家
+						</p>
 
-                        </li>
-                        <div class="my_timeline_next" @click="moveRight()">
-
-                            <i style="color: skyblue;" class="el-icon-arrow-right"></i>
-
-                        </div>
-                    </ul>
-                </div>
-            </div>
-            <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;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;">
-  
-
-                    </div>
-              
-                    <div style="height: 100%;text-align: center;    border: 5px solid #F8F8F8;">
-                        
-                         
-                            <img :src="item.picture" alt="200603" style="scale: 0.85;height: 285px;width: 379px"> </div>
-                </div>
-               
-
-            </div>
-            <div v-if="!honorList.length" style="height: 400px;display: flex;justify-content: center;align-items: center;">
-                 <div style="color: #999;">该年份暂无内容展示</div>
-            </div>
-        </div>
-        <div v-show="activeName == 'fourth'" style="margin-bottom: -50px;">
-            <div style="height: 50px;"></div>
-            <div style="width: 80%;margin: auto;display: flex;justify-content: space-between;">
-                <div style="width:   32%;margin-bottom: 20px;">
-                    <div style=" ">
-                        <img src="@/assets/images/rongyu/yuanjing.png"
-                            style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
-                    </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;">{{ 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;">
-                    <div style=" ">
-                        <img src="@/assets/images/rongyu/shiming.png"
-                            style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
-                    </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;">{{ 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;">
-                    <div style=" ">
-                        <img src="@/assets/images/rongyu/jiazhi.png"
-                            style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
+						<h6 class="wow fadeInUp" style="animation-delay: 0.6s;  animation-name: none;">荣获多个优质工程的荣誉称号
+						</h6>
+						<p class="wow fadeInUp animated"
+							style="animation-delay: 0.5s; visibility: visible; animation-name: fadeInUp;">
+							获得了保利地产、建发地产、百威英博(ABInbev) 、美国皇冠制罐、佳通轮胎、南
+							平铝业、福清核电、<br>湄洲湾核电、鹭燕医药等众多国内外客户的赞誉和认可。
+						</p>
 
 
-                    </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;">{{ 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>
-                      
+					</div>
+					<div class="bl_map">
+						<img src="@/assets/images/map.png">
 
-                
-                    </div>
-       
-                </div>
-                
-            </div>
-            <div style="position: relative;top: -50px;z-index: -1;">
-                    <img style="width: 100%;object-fit: contain;" src="@/assets/images/rongyu/bg.png">
-                </div>
-        </div>
-    </div>
+						<div class="scope s3">
+							<p class="no_margin">中国内地</p>
+						</div>
+
+					</div>
+				</div>
+			</div>
+		</div>
+		<div v-show="activeName == 'second'">
+			<!--时间线-->
+			<div class="timeLine" style="overflow: hidden;">
+
+
+				<div class="ul_box" style="padding: 50px 0px;">
+
+					<ul class="my_timeline" ref="mytimeline" style=" display: flex;width: 80%;padding: 0;margin: auto;">
+						<div class="my_timeline_prev" @click="moveLeft()">
+							<i style="color: skyblue;" class="el-icon-arrow-left"></i>
+						</div>
+						<li class="my_timeline_item" v-for="(item, index) in timeLineList" :key="index">
+							<!--圈圈节点-->
+							<div class="my_timeline_node" @click="changeActive(index,item)"
+								:class="{ active: index == timeIndex }"> {{ item.timestamp }}</div>
+							<!--线-->
+
+							<!--标注-->
+
+						</li>
+						<div class="my_timeline_next" @click="moveRight()">
+
+							<i style="color: skyblue;" class="el-icon-arrow-right"></i>
+
+						</div>
+					</ul>
+				</div>
+			</div>
+			<div class="images_cl">
+				<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;">
+
+
+					</div>
+
+					<div class="img_cl" style="height: 100%;text-align: center;    border: 5px solid #F8F8F8;">
+
+
+						<img :src="item.picture" alt="200603" style="scale: 0.85;height: 285px;width: 379px">
+					</div>
+				</div>
+
+
+			</div>
+			<div v-if="!honorList.length"
+				style="height: 400px;display: flex;justify-content: center;align-items: center;">
+				<div style="color: #999;">该年份暂无内容展示</div>
+			</div>
+		</div>
+		<div v-show="activeName == 'fourth'" style="margin-bottom: -50px;">
+			<div style="height: 50px;"></div>
+			<div style="width: 80%;margin: auto;display: flex;justify-content: space-between;">
+				<div style="width:   32%;margin-bottom: 20px;">
+					<div style=" ">
+						<img src="@/assets/images/rongyu/yuanjing.png"
+							style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
+					</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;">{{ 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;">
+					<div style=" ">
+						<img src="@/assets/images/rongyu/shiming.png"
+							style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
+					</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;">{{ 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;">
+					<div style=" ">
+						<img src="@/assets/images/rongyu/jiazhi.png"
+							style="width: 100%;object-fit: contain;margin: auto;display: block; border-radius: 14px 14px 0 0;">
+
+
+					</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;">{{ 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>
+
+
+
+					</div>
+
+				</div>
+
+			</div>
+			<div style="position: relative;top: -50px;z-index: -1;">
+				<img style="width: 100%;object-fit: contain;" src="@/assets/images/rongyu/bg.png">
+			</div>
+		</div>
+	</div>
 </template>
 <script>
-import { honor,culture,compony } from '@/api';
-import { honorList } from '@/api';
-export default {
-    data() {
-        return {
-            activeName: 'first',
-            timeIndex: 0,
-            timeLineList:
-             [
-             {
-                "timestamp": "全部",
-                "color": "#999",
-                "fontsize": 18,
-                "year": "all",
-                "bgcolor": "#e4e7ed",
-    
-            },{
-                "timestamp": "2024年",
-                "color": "#999",
-                "fontsize": 18,
-                "year": "2024",
-                "bgcolor": "#e4e7ed",
-    
-            }, {
-                "timestamp": "2023年",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "year": "2023",
+	import {
+		honor,
+		culture,
+		compony
+	} from '@/api';
+	import {
+		honorList
+	} from '@/api';
+	export default {
+		data() {
+			return {
+				activeName: 'first',
+				timeIndex: 0,
+				timeLineList: [{
+					"timestamp": "全部",
+					"color": "#999",
+					"fontsize": 18,
+					"year": "all",
+					"bgcolor": "#e4e7ed",
 
-                "bgcolor": "#e4e7ed",
-          
-            }, {
-                "timestamp": "2022年",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "year": "2022",
+				}, {
+					"timestamp": "2024年",
+					"color": "#999",
+					"fontsize": 18,
+					"year": "2024",
+					"bgcolor": "#e4e7ed",
 
-                "bgcolor": "#e4e7ed",
-            
-            }, {
-                "timestamp": "2021年",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "year": "2021",
+				}, {
+					"timestamp": "2023年",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"year": "2023",
 
-                "year": "2021",
-       
-            }, {
-                "timestamp": "2020年",
-                "color": "#999",
-                "fontsize": 18,
-                "year": "2020",
-                "size": "28",
-         
-            }, {
-                "timestamp": "2019年",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "year": "2019",
+					"bgcolor": "#e4e7ed",
 
-                "bgcolor": "#e4e7ed",
-        
-            }, {
-                "timestamp": "2018年",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "year": "2018",
+				}, {
+					"timestamp": "2022年",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"year": "2022",
 
-                "bgcolor": "#e4e7ed",
-              
-            }, {
-                "timestamp": "2017及前",
-                "color": "#999",
-                "fontsize": 18,
-                "size": "28",
-                "bgcolor": "#e4e7ed",
-                "icon": "el-iconprev",
-                "year": "2017",
-                "info": "chengli"
-            }],
-            honorList:[],
-            culturelist:[],
-            componyarr:[],
-        }
-    },
-    mounted(){
-        // honor({'year':'2019'}).then((res)=>{
-        //   console.log(res)
-        // })
-      compony().then((res)=>{
-        this.componyarr=res.data    
-      })
-        if(this.$route.query.category){
-            this.activeName='second'
-        }
-        this.getHonner('all')
-        culture().then((res)=>{
-                this.culturelist=res.data
-        })
-    },
-    methods: {
+					"bgcolor": "#e4e7ed",
 
-       async getHonner(year){
-      
-      
-        const {data:res} = await honorList({'year':year});
-          console.log(res)
-          this.honorList = res
-        },
-        handleClick(tab, event) {
-            console.log(tab.index);
-        },
-        changeActive(index,item) {
-            this.timeIndex = index;
-            console.log(item)
-           this.getHonner(item.year)
-        },
-        moveLeft() {
-     
-            //  let marginLeft = parseInt(this.$refs.mytimeline.style.marginLeft);
-            // let listNum = 0;
-            // if(marginLeft <= 10 && (marginLeft >= -650)){
-            //     this.$refs.mytimeline.style.marginLeft = marginLeft - 220 + 'px';
-            if (this.timeIndex < 1) {
-                return
-            }
-            else {
-                this.timeIndex = this.timeIndex - 1
-                console.log(this.timeIndex)
-                const year = this.timeLineList[this.timeIndex].year
-                console.log(year)
-                this.getHonner(year)
-            }
+				}, {
+					"timestamp": "2021年",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"year": "2021",
 
-        },
-        moveRight() {
-            // let marginLeft = parseInt(this.$refs.mytimeline.style.marginLeft);
-            // if(marginLeft < (-200)){
-            //     this.$refs.mytimeline.style.marginLeft = marginLeft + 220 + 'px';
-            // }
-            if (this.timeIndex > this.timeLineList.length - 2) {
-                return
-            } else {
-                this.timeIndex = this.timeIndex + 1
-                const year = this.timeLineList[this.timeIndex].year
-                console.log(year)
-                this.getHonner(year)
-            }
-        },
-        changeto(id){
-            this.$router.push({
-          path: '/honordetail?id=' + id
-        })
-        }
-    }
-};
+					"year": "2021",
+
+				}, {
+					"timestamp": "2020年",
+					"color": "#999",
+					"fontsize": 18,
+					"year": "2020",
+					"size": "28",
+
+				}, {
+					"timestamp": "2019年",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"year": "2019",
+
+					"bgcolor": "#e4e7ed",
+
+				}, {
+					"timestamp": "2018年",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"year": "2018",
+
+					"bgcolor": "#e4e7ed",
+
+				}, {
+					"timestamp": "2017及前",
+					"color": "#999",
+					"fontsize": 18,
+					"size": "28",
+					"bgcolor": "#e4e7ed",
+					"icon": "el-iconprev",
+					"year": "2017",
+					"info": "chengli"
+				}],
+				honorList: [],
+				culturelist: [],
+				componyarr: [],
+			}
+		},
+		mounted() {
+			// honor({'year':'2019'}).then((res)=>{
+			//   console.log(res)
+			// })
+			compony().then((res) => {
+				this.componyarr = res.data
+			})
+			if (this.$route.query.category) {
+				this.activeName = 'second'
+			}
+			this.getHonner('all')
+			culture().then((res) => {
+				this.culturelist = res.data
+			})
+		},
+		methods: {
+
+			async getHonner(year) {
+
+
+				const {
+					data: res
+				} = await honorList({
+					'year': year
+				});
+				console.log(res)
+				this.honorList = res
+			},
+			handleClick(tab, event) {
+				console.log(tab.index);
+			},
+			changeActive(index, item) {
+				this.timeIndex = index;
+				console.log(item)
+				this.getHonner(item.year)
+			},
+			moveLeft() {
+
+				//  let marginLeft = parseInt(this.$refs.mytimeline.style.marginLeft);
+				// let listNum = 0;
+				// if(marginLeft <= 10 && (marginLeft >= -650)){
+				//     this.$refs.mytimeline.style.marginLeft = marginLeft - 220 + 'px';
+				if (this.timeIndex < 1) {
+					return
+				} else {
+					this.timeIndex = this.timeIndex - 1
+					console.log(this.timeIndex)
+					const year = this.timeLineList[this.timeIndex].year
+					console.log(year)
+					this.getHonner(year)
+				}
+
+			},
+			moveRight() {
+				// let marginLeft = parseInt(this.$refs.mytimeline.style.marginLeft);
+				// if(marginLeft < (-200)){
+				//     this.$refs.mytimeline.style.marginLeft = marginLeft + 220 + 'px';
+				// }
+				if (this.timeIndex > this.timeLineList.length - 2) {
+					return
+				} else {
+					this.timeIndex = this.timeIndex + 1
+					const year = this.timeLineList[this.timeIndex].year
+					console.log(year)
+					this.getHonner(year)
+				}
+			},
+			changeto(id) {
+				this.$router.push({
+					path: '/honordetail?id=' + id
+				})
+			}
+		}
+	};
 </script>
-<style scoped>
-.compbg {
-    background-image: url('../assets/images/banner.png');
-}
+<style scoped lang="scss">
+	.images_cl {
+		width: 80%;
+		margin: auto;
+		flex-wrap: wrap;
+		justify-content: space-between;
+		display: grid;
+		grid-template-columns: repeat(auto-fill, minmax(31.33%, 1fr));
+	}
+	@media screen and (max-width:1523px) {
+		.img_cl {
+			img {
+				width: 100% !important;
+			}
+		}
+	}
+	
+	@media screen and (max-width:1241px) {
+		.images_cl {
+			grid-template-columns: repeat(auto-fill, minmax(45%, 1fr));
+		}
+	}
 
-.page_ban {
-    height: 404px;
-    position: relative;
-    text-align: center;
-    z-index: 101;
-}
 
-.page_ban .img {
-    width: 100%;
-    height: 100%;
+	.compbg {
+		background-image: url('../assets/images/banner.png');
+	}
 
-    background-size: cover;
-    position: absolute;
-    left: 0;
-    top: 0;
-    z-index: -1;
-}
+	.page_ban {
+		height: 404px;
+		position: relative;
+		text-align: center;
+		z-index: 101;
+	}
 
-.page_ban .content {
-    position: relative;
-    height: 100%;
-}
+	.page_ban .img {
+		width: 100%;
+		height: 100%;
 
-.content {
-    width: 80%;
-    margin: 0 auto;
-}
+		background-size: cover;
+		position: absolute;
+		left: 0;
+		top: 0;
+		z-index: -1;
+	}
 
-.page_nav {
-    width: 100%;
-    position: absolute;
-    left: 0;
-    bottom: 0;
-}
+	.page_ban .content {
+		position: relative;
+		height: 100%;
+	}
 
-div,
-li {
-    box-sizing: border-box;
-}
+	.content {
+		width: 80%;
+		margin: 0 auto;
+	}
 
-.page_nav .name {
-    float: left;
-}
+	.page_nav {
+		width: 100%;
+		position: absolute;
+		left: 0;
+		bottom: 0;
+	}
 
-.page_nav .list {
-    position: relative;
-    float: right;
-    margin-right: -35px;
-}
+	div,
+	li {
+		box-sizing: border-box;
+	}
 
-.page_nav a {
-    float: left;
-    line-height: 76px;
-    position: relative;
-    font-size: 14.5px;
+	.page_nav .name {
+		float: left;
+	}
 
-    color: white;
-    font-weight: bold;
-    text-decoration: none;
-}
+	.page_nav .list {
+		position: relative;
+		float: right;
+		margin-right: -35px;
+	}
 
-.page_nav .name a {
-    padding-left: 30px;
-    /* background: url() no-repeat left 30px; */
-}
+	.page_nav a {
+		float: left;
+		line-height: 76px;
+		position: relative;
+		font-size: 14.5px;
 
-.page_nav .list {
-    position: relative;
-    float: right;
-    margin-right: -35px;
-}
+		color: white;
+		font-weight: bold;
+		text-decoration: none;
+	}
 
-.page_nav .list a {
-    color: #e7dfd2;
-    color: rgba(231, 223, 210, .7);
-    margin-right: 35px;
-}
+	.page_nav .name a {
+		padding-left: 30px;
+		/* background: url() no-repeat left 30px; */
+	}
 
-.page_nav a {
-    float: left;
-    line-height: 76px;
-    position: relative;
-    font-size: 14.5px;
+	.page_nav .list {
+		position: relative;
+		float: right;
+		margin-right: -35px;
+	}
 
-    color: rgba(255, 255, 255, 0.8);
-    font-weight: bold;
-}
+	.page_nav .list a {
+		color: #e7dfd2;
+		color: rgba(231, 223, 210, .7);
+		margin-right: 35px;
+	}
 
-.page_nav .inner_bor {
-    height: 4px;
-    background: #f23c39;
-    position: absolute;
-    bottom: -4px;
-    left: 0;
-    display: block;
-}
+	.page_nav a {
+		float: left;
+		line-height: 76px;
+		position: relative;
+		font-size: 14.5px;
 
-::v-deep .el-tabs__item {
+		color: rgba(255, 255, 255, 0.8);
+		font-weight: bold;
+	}
 
-    color: rgba(255, 255, 255, 0.8);
-    border: none;
-}
+	.page_nav .inner_bor {
+		height: 4px;
+		background: #f23c39;
+		position: absolute;
+		bottom: -4px;
+		left: 0;
+		display: block;
+	}
 
-::v-deep .el-tabs__nav-wrap::after {
-    background-color: transparent;
-}
+	::v-deep .el-tabs__item {
 
-.bg {
-    background-image: url(' ../assets/images/公司简介背景.png');
-    background-size: cover;
-}
+		color: rgba(255, 255, 255, 0.8);
+		border: none;
+	}
 
-.about2 .bg {
-    position: relative;
-    width: 100%;
-    height: 540px;
+	::v-deep .el-tabs__nav-wrap::after {
+		background-color: transparent;
+	}
 
-    background-size: cover;
-    padding-top: 155px;
-    background-size: 100% 100%;
-    border-radius: 14px;
-    -webkit-border-radius: 14px;
-    -moz-border-radius: 14px;
-    -ms-border-radius: 14px;
-    -o-border-radius: 14px;
-}
+	.bg {
+		background-image: url(' ../assets/images/公司简介背景.png');
+		background-size: cover;
+	}
 
-.about2 .float {
-    width: 335px;
-    height: 286px;
-    background: no-repeat center;
-    background-size: cover;
-    position: absolute;
-    top: 43px;
-    left: 76px;
-    background-image: url('../assets/images/com-logo.png');
-}
+	.about2 .bg {
+		position: relative;
+		width: 100%;
+		height: 540px;
 
-.about2 .introduce {
-    width: 60.5%;
-    float: right;
-}
+		background-size: cover;
+		padding-top: 155px;
+		background-size: 100% 100%;
+		border-radius: 14px;
+		-webkit-border-radius: 14px;
+		-moz-border-radius: 14px;
+		-ms-border-radius: 14px;
+		-o-border-radius: 14px;
+	}
 
-.about2 h3 {
-    font-size: 36px;
-    color: #fff;
-    line-height: 1;
-    /* letter-spacing: 44px; */
-    font-weight: lighter;
-    margin-bottom: 22px;
-}
+	.about2 .float {
+		width: 335px;
+		height: 286px;
+		background: no-repeat center;
+		background-size: cover;
+		position: absolute;
+		top: 43px;
+		left: 76px;
+		background-image: url('../assets/images/com-logo.png');
+	}
 
-.about2 p {
-    font-size: 15px;
-    color: #262a3b;
-    color: rgba(38, 42, 59, .7);
-    line-height: 26px;
-}
+	.about2 .introduce {
+		width: 60.5%;
+		float: right;
+	}
 
-.about_4 {
-    min-height: 660px;
-    background: url('../assets/images/bg.png') no-repeat center;
-    background-size: cover;
-}
+	.about2 h3 {
+		font-size: 36px;
+		color: #fff;
+		line-height: 1;
+		/* letter-spacing: 44px; */
+		font-weight: lighter;
+		margin-bottom: 22px;
+	}
 
-.about_4 .content {
-    padding: 138px 0 0;
-    position: relative;
-    height: 100%;
-}
+	.about2 p {
+		font-size: 15px;
+		color: #262a3b;
+		color: rgba(38, 42, 59, .7);
+		line-height: 26px;
+	}
 
-.content {
-    width: 80%;
-    margin: 0 auto;
-}
+	.about_4 {
+		min-height: 660px;
+		background: url('../assets/images/bg.png') no-repeat center;
+		background-size: cover;
+	}
 
-.about_4 h3 {
-    font-family: 'Rajdhani';
-    font-size: 48px;
-    color: #ffffff;
-    color: rgba(255, 255, 255, .5);
-    line-height: 1;
-}
+	.about_4 .content {
+		padding: 138px 0 0;
+		position: relative;
+		height: 100%;
+	}
 
-.about_4 h5 {
-    font-size: 30px;
-    color: #00b4b7;
-    line-height: 1;
-    margin: 8px 0 10px;
-}
+	.content {
+		width: 80%;
+		margin: 0 auto;
+	}
 
-.about_4 p {
-    font-size: 15px;
-    color: #ffffff;
-    color: rgba(255, 255, 255, .44);
-    line-height: 30px;
-}
+	.about_4 h3 {
+		font-family: 'Rajdhani';
+		font-size: 48px;
+		color: #ffffff;
+		color: rgba(255, 255, 255, .5);
+		line-height: 1;
+	}
 
-.about_4 h6 {
-    font-size: 48px;
-    color: #00b4b7;
-    line-height: 1;
-    font-weight: lighter;
-    margin: 52px 0 12px;
-}
+	.about_4 h5 {
+		font-size: 30px;
+		color: #00b4b7;
+		line-height: 1;
+		margin: 8px 0 10px;
+	}
 
-.about_4 ul {
-    padding-left: 18px;
-    list-style: inherit;
-}
+	.about_4 p {
+		font-size: 15px;
+		color: #ffffff;
+		color: rgba(255, 255, 255, .44);
+		line-height: 30px;
+	}
 
-.about_4 li {
-    list-style: inherit;
-    color: #ffffff;
-}
+	.about_4 h6 {
+		font-size: 48px;
+		color: #00b4b7;
+		line-height: 1;
+		font-weight: lighter;
+		margin: 52px 0 12px;
+	}
 
-.about_4 .bl_map {
-    position: absolute;
-    top: 87px;
-    right: -110px;
-}
+	.about_4 ul {
+		padding-left: 18px;
+		list-style: inherit;
+	}
 
-.bl_map {
-    position: relative;
-    width: 951px;
-}
+	.about_4 li {
+		list-style: inherit;
+		color: #ffffff;
+	}
 
-.bl_map .scope.s3 {
-    width: 166px;
-    height: 166px;
-    left: 62%;
-    top: 21%;
-}
+	.about_4 .bl_map {
+		position: absolute;
+		top: 87px;
+		right: -110px;
+	}
 
-.bl_map .scope {
-    position: absolute;
-    z-index: 9;
-}
+	.bl_map {
+		position: relative;
+		width: 951px;
+	}
 
-.bl_map .scope.s3:before {
-    animation: h_map 2s .6s linear alternate infinite;
-    -webkit-animation: h_map 2s .6s linear alternate infinite;
-}
+	.bl_map .scope.s3 {
+		width: 166px;
+		height: 166px;
+		left: 62%;
+		top: 21%;
+	}
 
-.bl_map .scope:before {
-    content: '';
-    width: 100%;
-    height: 100%;
-    background-color: #d1486c;
-    position: absolute;
-    left: 0;
-    top: 0;
-    border-radius: 50%;
-    -webkit-border-radius: 50%;
-    -moz-border-radius: 50%;
-    -ms-border-radius: 50%;
-    -o-border-radius: 50%;
-    opacity: .5;
-    filter: alpha(opacity=50);
-    -webkit-filter: alpha(opacity=50);
-    animation: h_map 2s linear alternate infinite;
-    -webkit-animation: h_map 2s linear alternate infinite;
-}
+	.bl_map .scope {
+		position: absolute;
+		z-index: 9;
+	}
 
-@keyframes h_map {
-    0% {
+	.bl_map .scope.s3:before {
+		animation: h_map 2s .6s linear alternate infinite;
+		-webkit-animation: h_map 2s .6s linear alternate infinite;
+	}
 
-        transform: scale(.6);
-    }
+	.bl_map .scope:before {
+		content: '';
+		width: 100%;
+		height: 100%;
+		background-color: #d1486c;
+		position: absolute;
+		left: 0;
+		top: 0;
+		border-radius: 50%;
+		-webkit-border-radius: 50%;
+		-moz-border-radius: 50%;
+		-ms-border-radius: 50%;
+		-o-border-radius: 50%;
+		opacity: .5;
+		filter: alpha(opacity=50);
+		-webkit-filter: alpha(opacity=50);
+		animation: h_map 2s linear alternate infinite;
+		-webkit-animation: h_map 2s linear alternate infinite;
+	}
 
-    100% {
+	@keyframes h_map {
+		0% {
 
-        transform: scale(1);
-    }
-}
+			transform: scale(.6);
+		}
 
-.bl_map .scope.s3 p {
-    width: 100%;
-    text-align: center;
-}
+		100% {
 
-.bl_map .scope p {
-    font-size: 14.5px;
-    color: #c2cff3;
-    white-space: nowrap;
-    position: absolute;
-    left: 0;
-    top: 50%;
-    margin-top: -12px;
-}
+			transform: scale(1);
+		}
+	}
 
-.my_timeline_prev,
-.my_timeline_next {
-    float: left;
-    display: inline-block;
-    background-color: #fff;
-    cursor: pointer;
-}
+	.bl_map .scope.s3 p {
+		width: 100%;
+		text-align: center;
+	}
 
-.my_timeline_prev {
-    /* width: 200px; */
-    /* float: left; */
-    flex: 0.5
-}
+	.bl_map .scope p {
+		font-size: 14.5px;
+		color: #c2cff3;
+		white-space: nowrap;
+		position: absolute;
+		left: 0;
+		top: 50%;
+		margin-top: -12px;
+	}
 
-.my_timeline_next {
-    /* width: 34px;
+	.my_timeline_prev,
+	.my_timeline_next {
+		float: left;
+		display: inline-block;
+		background-color: #fff;
+		cursor: pointer;
+	}
+
+	.my_timeline_prev {
+		/* width: 200px; */
+		/* float: left; */
+		flex: 0.5
+	}
+
+	.my_timeline_next {
+		/* width: 34px;
     margin-left: -22px; */
-    flex: 0.5
-}
-.init p{
-    margin:16px 0
+		flex: 0.5
+	}
 
-}
-.ul_box {
-    width: 100%;
+	.init p {
+		margin: 16px 0
+	}
 
-    display: inline-block;
-    float: left;
-    margin-top: 2px;
-    overflow: hidden;
-}
+	.ul_box {
+		width: 100%;
 
-.my_timeline_item {
-    display: inline-block;
-    flex: 1;
+		display: inline-block;
+		float: left;
+		margin-top: 2px;
+		overflow: hidden;
+	}
 
-}
+	.my_timeline_item {
+		display: inline-block;
+		flex: 1;
 
-.my_timeline_node {
-    box-sizing: border-box;
-    border-radius: 50%;
-    cursor: pointer;
-}
+	}
 
-.my_timeline_node.active {
-    background-color: #fff !important;
-    color: rgb(0, 113, 203);
-    font-size: 26px;
-    line-height: 24px;
-}
+	.my_timeline_node {
+		box-sizing: border-box;
+		border-radius: 50%;
+		cursor: pointer;
+	}
 
-.my_timeline_item_line {
-    /* width: 100%; */
-    height: 10px;
-    /* margin: -14px 0 0 28px; */
-    border-top: 2px solid #E4E7ED;
-    border-left: none;
-}
+	.my_timeline_node.active {
+		background-color: #fff !important;
+		color: rgb(0, 113, 203);
+		font-size: 26px;
+		line-height: 24px;
+	}
 
-.my_timeline_item_content {
-    width: 80%;
-    margin: auto;
+	.my_timeline_item_line {
+		/* width: 100%; */
+		height: 10px;
+		/* margin: -14px 0 0 28px; */
+		border-top: 2px solid #E4E7ED;
+		border-left: none;
+	}
 
-}
+	.my_timeline_item_content {
+		width: 80%;
+		margin: auto;
 
-h5 {
-    font-family: 'Rajdhani';
-    font-size: 30px;
-    color: #ffffff;
-    color: rgba(219, 219, 219);
-    line-height: 24px;
-    text-transform: uppercase;
-    letter-spacing: -1px;
-    margin-top: 8px;
-    margin-bottom: 8px;
-    width:203px;
-}
+	}
+
+	h5 {
+		font-family: 'Rajdhani';
+		font-size: 30px;
+		color: #ffffff;
+		color: rgba(219, 219, 219);
+		line-height: 24px;
+		text-transform: uppercase;
+		letter-spacing: -1px;
+		margin-top: 8px;
+		margin-bottom: 8px;
+		width: 203px;
+	}
 </style>
\ No newline at end of file
diff --git a/src/views/projectdetail.vue b/src/views/projectdetail.vue
index b09528f..d4579ea 100644
--- a/src/views/projectdetail.vue
+++ b/src/views/projectdetail.vue
@@ -1,274 +1,294 @@
 <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="/project">工程资讯</a> <a href="javascript:;">工程详情</a>
-                    </div>
-                    <div class="list" style="bottom:-15px">
-                        <el-tabs v-model="activeName" >
-                            <el-tab-pane label="工程详情" name="first"></el-tab-pane>
-                                                 
-                        </el-tabs>
+	<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="/project">工程资讯</a> <a href="javascript:;">工程详情</a>
+					</div>
+					<div class="list" style="bottom:-15px">
+						<el-tabs v-model="activeName">
+							<el-tab-pane label="工程详情" name="first"></el-tab-pane>
 
-                    </div>
-                </div>
-            </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 ql-editor" style="text-align: center;">
-            <div class="name">{{ name }}</div>
-            <div class="top-box">   
-                <!-- <div class="date">{{time}}</div>  -->
-        </div>
-            <div class="divider"></div>
-            <div class="cont" v-html="content"></div>
-           </div>
-             
-                <div class="con">
-              </div>
-              </div>
-                </div>
-            </div>
-  
-        </div>
+						</el-tabs>
+
+					</div>
+				</div>
+			</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 ql-editor" style="text-align: center;">
+						<div class="name">{{ name }}</div>
+						<div class="top-box">
+							<!-- <div class="date">{{time}}</div>  -->
+						</div>
+						<div class="divider"></div>
+						<div class="cont" v-html="content"></div>
+					</div>
+
+					<div class="con">
+					</div>
+				</div>
+			</div>
+		</div>
+
+	</div>
 </template>
 <script>
-import { projectdetail } from '@/api';
-export default{
-    data(){
-        return{
-            name:'',
-            content:'',
-            time:'',
-            area:'',
-            height:''
-        }
-    },
-    methods:{
+	import {
+		projectdetail
+	} from '@/api';
+	export default {
+		data() {
+			return {
+				name: '',
+				content: '',
+				time: '',
+				area: '',
+				height: ''
+			}
+		},
+		methods: {
 
-    },
-    mounted(){
-       projectdetail(this.$route.query).then((res)=>{
-                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
-        })
-    },
-}
+		},
+		mounted() {
+			projectdetail(this.$route.query).then((res) => {
+				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
+			})
+		},
+	}
 </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 {
+	.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 0px;
+		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 {
+	::v-deep .el-tabs__item {
 
-color: rgba(255, 255, 255, 0.8);
-border: none;
-}
+		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;
-}
+	::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');
-}
+	.compbg {
+		background-image: url('../assets/images/banner.png');
+	}
 
-.page_ban {
-    height: 404px;
-    position: relative;
-    text-align: center;
-    z-index: 101;
-}
+	.page_ban {
+		height: 404px;
+		position: relative;
+		text-align: center;
+		z-index: 101;
+	}
 
-.page_ban .img {
-    width: 100%;
-    height: 100%;
+	.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: 86%;
-    margin: 0 auto;
-}
+		background-size: cover;
+		position: absolute;
+		left: 0;
+		top: 0;
+		z-index: -1;
+	}
 
-.page_nav {
-    width: 100%;
-    position: absolute;
-    left: 0;
-    bottom: 0;
-}
-div,
-li {
-    box-sizing: border-box;
-}
+	.top-box {
+		margin: 16px 0 30px;
+	}
 
-.page_nav .name {
-    float: left;
-}
+	.date {
 
-.page_nav .list {
-    position: relative;
-    float: right;
-    margin-right: -35px;
-}
+		font-size: 26px;
+		color: #dfd4c3;
+		line-height: 1;
 
-.page_nav a {
-    float: left;
-    line-height: 76px;
-    position: relative;
-    font-size: 14.5px;
+		bottom: 20px;
+		padding: 0 30px;
+		width: 100%;
+	}
 
-    color: white;
-    font-weight: bold;
-    text-decoration: none;
-}
+	.page_ban .content {
+		position: relative;
+		height: 100%;
+	}
 
-.page_nav .name a {
-    padding-left: 30px;
-    /* background: url() no-repeat left 30px; */
-}
+	.content {
+		width: 86%;
+		margin: 0 auto;
+	}
 
-.page_nav .list {
-    position: relative;
-    float: right;
-    margin-right: -35px;
-}
+	.page_nav {
+		width: 100%;
+		position: absolute;
+		left: 0;
+		bottom: 0;
+	}
 
-.page_nav .list a {
-    color: #e7dfd2;
-    color: rgba(231, 223, 210, .7);
-    margin-right: 35px;
-}
+	div,
+	li {
+		box-sizing: border-box;
+	}
 
-.page_nav a {
-    float: left;
-    line-height: 76px;
-    position: relative;
-    font-size: 14.5px;
+	.page_nav .name {
+		float: left;
+	}
 
-    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;
-}
-.cont{
-	width: 70%;
-	margin: 0 auto;
-}
-.cont >>> img{
-max-width:500px;
-}
+	.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;
+	}
+
+	.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;
+	}
+
+	.cont {
+		display: flex;
+		width: 100%;
+	}
+
+	.cont>>>img {
+		width: 100%;
+	}
 </style>
\ No newline at end of file