|
@@ -4,7 +4,14 @@
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
- <title>产业园区</title>
|
|
|
+ <meta name=”SiteName” content=”重庆市南岸区人民政府”>
|
|
|
+ <meta name="SiteDomain" content="http://www.cqna.gov.cn" />
|
|
|
+ <meta name="SiteIDCode" content="5001080014">
|
|
|
+ <meta name="ColumnName" content="产业园区">
|
|
|
+ <meta name="ColumnDescription" content="产业园区" />
|
|
|
+ <meta name="ColumnKeywords" content="产业园区" />
|
|
|
+ <meta name="ColumnType" content="产业园区" />
|
|
|
+ <title>产业园区-重庆市南岸区人民政府网</title>
|
|
|
<!-- 引入 Vue -->
|
|
|
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/vue.min.js"></script>
|
|
|
<!-- 引入样式 -->
|
|
@@ -12,8 +19,9 @@
|
|
|
<!-- 引入组件库 -->
|
|
|
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/index.js"></script>
|
|
|
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/jquery-3.5.1.min.js"></script>
|
|
|
- <script type="text/javascript" src="https://api.map.baidu.com/api?type=webgl&v=3.0&ak=7XivTux4H2e1ifKLjvEhxfuayDYxAluq">
|
|
|
- </script>
|
|
|
+ <script type="text/javascript"
|
|
|
+ src="https://api.map.baidu.com/api?type=webgl&v=3.0&ak=7XivTux4H2e1ifKLjvEhxfuayDYxAluq">
|
|
|
+ </script>
|
|
|
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/jquery-3.5.1.min.js"></script>
|
|
|
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/urljson.js"></script>
|
|
|
<style>
|
|
@@ -144,6 +152,7 @@
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
}
|
|
|
+
|
|
|
.tdgyC {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
@@ -152,6 +161,7 @@
|
|
|
-ms-overflow-style: none;
|
|
|
scrollbar-width: none;
|
|
|
}
|
|
|
+
|
|
|
.ztfwC {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
@@ -171,6 +181,7 @@
|
|
|
width: 100%;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
.liList {
|
|
|
display: flex;
|
|
|
border-bottom: 1px solid rgba(245, 250, 255, .2);
|
|
@@ -181,6 +192,7 @@
|
|
|
width: 100%;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
.ztfwList {
|
|
|
display: flex;
|
|
|
border-bottom: 1px solid rgba(245, 250, 255, .2);
|
|
@@ -191,14 +203,17 @@
|
|
|
width: 100%;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
.liList:last-child {
|
|
|
display: flex;
|
|
|
border-bottom: none;
|
|
|
}
|
|
|
+
|
|
|
.ztfwList:last-child {
|
|
|
display: flex;
|
|
|
border-bottom: none;
|
|
|
}
|
|
|
+
|
|
|
.liList>img {
|
|
|
width: 20px;
|
|
|
height: 20px;
|
|
@@ -206,20 +221,24 @@
|
|
|
margin-right: 10px;
|
|
|
cursor: pointer;
|
|
|
}
|
|
|
+
|
|
|
.tdgyList:last-child {
|
|
|
display: flex;
|
|
|
border-bottom: none;
|
|
|
}
|
|
|
+
|
|
|
.ztfwList:last-child {
|
|
|
display: flex;
|
|
|
border-bottom: none;
|
|
|
}
|
|
|
+
|
|
|
.tdgyList>img {
|
|
|
width: 20px;
|
|
|
height: 20px;
|
|
|
margin-top: 5px;
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
+
|
|
|
.ztfwList>img {
|
|
|
width: 20px;
|
|
|
height: 20px;
|
|
@@ -356,7 +375,8 @@
|
|
|
color: #FFFFFF;
|
|
|
font-family: Microsoft YaHei;
|
|
|
}
|
|
|
- .title1{
|
|
|
+
|
|
|
+ .title1 {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
padding: 15px 15px 0 15px;
|
|
@@ -514,7 +534,9 @@
|
|
|
<div class="contentBox">
|
|
|
<div class="contentItem">
|
|
|
<video autoplay loop muted playsinline>
|
|
|
- <source :src="this.id==='4'?'https://www.cqna.gov.cn/syygapi/npxq.mp4':this.id==='5'?'https://www.cqna.gov.cn/syygapi/ylcxgxcp-2024.2.2.mp4':'https://www.cqna.gov.cn/syygapi/index.mp4'" type="video/mp4" style="width:100%;height: 100%;">
|
|
|
+ <source
|
|
|
+ :src="this.id==='4'?'https://www.cqna.gov.cn/syygapi/npxq.mp4':this.id==='5'?'https://www.cqna.gov.cn/syygapi/ylcxgxcp-2024.2.2.mp4':'https://www.cqna.gov.cn/syygapi/index.mp4'"
|
|
|
+ type="video/mp4" style="width:100%;height: 100%;">
|
|
|
Your browser does not support the video tag.
|
|
|
</video>
|
|
|
</div>
|
|
@@ -556,46 +578,53 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="contentItem" style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/tdgybg.png) no-repeat;background-size: 100% 100%;">
|
|
|
+ <div class="contentItem"
|
|
|
+ style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/tdgybg.png) no-repeat;background-size: 100% 100%;">
|
|
|
<div class="title">
|
|
|
<span class="text">土地供应</span>
|
|
|
- <span class="more" @click="golink('https://www.cqna.gov.cn/syygapi/naxsb/tdcrlist.html?id=-1',1)" v-if="!contentList.length">更多>></span>
|
|
|
- <span class="more" @click="golink('https://www.cqna.gov.cn/syygapi/naxsb/tdcrlist.html',2)" v-else>更多>></span>
|
|
|
+ <span class="more" @click="golink('https://www.cqna.gov.cn/syygapi/naxsb/tdcrlist.html?id=-1',1)"
|
|
|
+ v-if="!contentList.length">更多>></span>
|
|
|
+ <span class="more" @click="golink('https://www.cqna.gov.cn/syygapi/naxsb/tdcrlist.html',2)"
|
|
|
+ v-else>更多>></span>
|
|
|
</div>
|
|
|
<div class="tdgy">
|
|
|
<div class="tdgyC">
|
|
|
- <div class="tdgyList" v-for="(tab, index) in this.contentList" :key="index" @click="goTdcr(tab.id)">
|
|
|
- <img src="https://www.cqna.gov.cn/syygapi/naxsb/image/listcricle.png" />
|
|
|
- <div class="tdgyContent">
|
|
|
- <div class="tdgyTitle">{{tab.landName}}</div>
|
|
|
- <div class="tdgyDec">{{tab.landArea}}亩 丨 {{tab.landFunction?tab.landFunction:''}}</div>
|
|
|
- <!-- <div class="tdgyLocation"><i class="el-icon-location"></i>{{tab.addr?tab.addr:''}}</div> -->
|
|
|
+ <div class="tdgyList" v-for="(tab, index) in this.contentList" :key="index" @click="goTdcr(tab.id)">
|
|
|
+ <img src="https://www.cqna.gov.cn/syygapi/naxsb/image/listcricle.png" />
|
|
|
+ <div class="tdgyContent">
|
|
|
+ <div class="tdgyTitle">{{tab.landName}}</div>
|
|
|
+ <div class="tdgyDec">{{tab.landArea}}亩 丨 {{tab.landFunction?tab.landFunction:''}}</div>
|
|
|
+ <!-- <div class="tdgyLocation"><i class="el-icon-location"></i>{{tab.addr?tab.addr:''}}</div> -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div></div>
|
|
|
+ </div>
|
|
|
<div class="nodata" v-show="!contentList.length"
|
|
|
:style="{ backgroundImage: 'url(' + tdBackgroundImage + ')'}"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="contentItem" style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/ztfwbg.png) no-repeat;background-size: 100% 100%;">
|
|
|
+ <div class="contentItem"
|
|
|
+ style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/ztfwbg.png) no-repeat;background-size: 100% 100%;">
|
|
|
<div class="title">
|
|
|
<span class="text">载体服务</span>
|
|
|
<span class="more" @click="golink('https://www.cqna.gov.cn/syygapi/naxsb/ztcrlist.html',2)">更多>></span>
|
|
|
</div>
|
|
|
<div class="tdgy">
|
|
|
<div class="ztfwC">
|
|
|
- <div class="ztfwList" v-for="(tab, index) in this.buildList" :key="index" @click="goZtcr(tab.id)">
|
|
|
- <img src="https://www.cqna.gov.cn/syygapi/naxsb/image/listcricle.png" />
|
|
|
- <div class="tdgyContent">
|
|
|
- <div class="tdgyTitle">{{tab.carrierName}}</div>
|
|
|
- <div class="tdgyDec">
|
|
|
- {{tab.space?tab.space:''}}亩 丨 {{tab.addr?tab.addr:tab.application}}</div>
|
|
|
+ <div class="ztfwList" v-for="(tab, index) in this.buildList" :key="index" @click="goZtcr(tab.id)">
|
|
|
+ <img src="https://www.cqna.gov.cn/syygapi/naxsb/image/listcricle.png" />
|
|
|
+ <div class="tdgyContent">
|
|
|
+ <div class="tdgyTitle">{{tab.carrierName}}</div>
|
|
|
+ <div class="tdgyDec">
|
|
|
+ {{tab.space?tab.space:''}}亩 丨 {{tab.addr?tab.addr:tab.application}}</div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div></div>
|
|
|
+ </div>
|
|
|
<div class="nodata" v-show="!buildList.length"
|
|
|
:style="{ backgroundImage: 'url(' + ztBackgroundImage + ')'}"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="contentItem" style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/yqfwbg.png) no-repeat;background-size: 100% 100%;">
|
|
|
+ <div class="contentItem"
|
|
|
+ style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/yqfwbg.png) no-repeat;background-size: 100% 100%;">
|
|
|
<div class="title">
|
|
|
<span class="text">园区服务</span>
|
|
|
</div>
|
|
@@ -614,7 +643,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="contentItem" style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/mxqybg.png) no-repeat;background-size: 100% 100%;">
|
|
|
+ <div class="contentItem"
|
|
|
+ style="background:url(https://www.cqna.gov.cn/syygapi/naxsb/image/mxqybg.png) no-repeat;background-size: 100% 100%;">
|
|
|
<div class="title">
|
|
|
<span class="text">明星企业</span>
|
|
|
</div>
|
|
@@ -629,18 +659,18 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width:100%;" class="footer"></div>
|
|
|
+ <div style="width:100%;" class="footer"></div>
|
|
|
</body>
|
|
|
|
|
|
<script>
|
|
|
- $(function () {
|
|
|
- /*公共部分
|
|
|
- * 导航栏
|
|
|
- * footer CopyRight
|
|
|
- */
|
|
|
- $(".header").load('https://www.cqna.gov.cn/syygapi/naxsb/top/top_style.html');
|
|
|
- $(".footer").load('https://www.cqna.gov.cn/syygapi/naxsb/footer/footer.html');
|
|
|
- });
|
|
|
+ $(function () {
|
|
|
+ /*公共部分
|
|
|
+ * 导航栏
|
|
|
+ * footer CopyRight
|
|
|
+ */
|
|
|
+ $(".header").load('https://www.cqna.gov.cn/syygapi/naxsb/top/top_style.html');
|
|
|
+ $(".footer").load('https://www.cqna.gov.cn/syygapi/naxsb/footer/footer.html');
|
|
|
+ });
|
|
|
</script>
|
|
|
<script>
|
|
|
// 初始化Vue实例
|
|
@@ -662,7 +692,7 @@
|
|
|
fadeIn: false,
|
|
|
id: null,
|
|
|
curraddr: '',
|
|
|
- map : null
|
|
|
+ map: null
|
|
|
};
|
|
|
},
|
|
|
created() { },
|
|
@@ -688,26 +718,26 @@
|
|
|
this.tdBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/tdcy.webp';
|
|
|
}
|
|
|
if (this.id == 4) {
|
|
|
- this.str=['位于南岸核心区范围','总面积约5平方公里','轨道3号线、10号线','城市公共服务和配套设施完善','主导产业:软件信息业、商贸流通业、文旅大健康产业、生产型服务业']
|
|
|
+ this.str = ['位于南岸核心区范围', '总面积约5平方公里', '轨道3号线、10号线', '城市公共服务和配套设施完善', '主导产业:软件信息业、商贸流通业、文旅大健康产业、生产型服务业']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztnp.webp';
|
|
|
} else if (this.id == 6) {
|
|
|
- this.str=['位于广阳湾智创生态城内','规划总建筑面积约为75万平方米','主导产业:软件及信息服务业发展']
|
|
|
+ this.str = ['位于广阳湾智创生态城内', '规划总建筑面积约为75万平方米', '主导产业:软件及信息服务业发展']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztdx.webp';
|
|
|
} else if (this.id == 5) {
|
|
|
- this.str=['位于广阳湾智创生态城东南侧迎龙片区','建设用地总面积0.72平方公里','已建用地约为0.36平方公里','轨道交通便捷,公路交通发达','主导产业:脑科学等前沿科学、绿色低碳产业、软件信息服务业、商贸服务业']
|
|
|
+ this.str = ['位于广阳湾智创生态城东南侧迎龙片区', '建设用地总面积0.72平方公里', '已建用地约为0.36平方公里', '轨道交通便捷,公路交通发达', '主导产业:脑科学等前沿科学、绿色低碳产业、软件信息服务业、商贸服务业']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztyl.webp';
|
|
|
} else if (this.id == 3) {
|
|
|
- this.str=['位于广阳湾智创生态城核心区','规划建设用地面积约为4.43平方公里','建成面积约为4.17平方公里','主导产业:智能终端研发生产矩阵、数字经济软信产业链、节能环保绿色装备制造基地、医药医疗器械产业']
|
|
|
+ this.str = ['位于广阳湾智创生态城核心区', '规划建设用地面积约为4.43平方公里', '建成面积约为4.17平方公里', '主导产业:智能终端研发生产矩阵、数字经济软信产业链、节能环保绿色装备制造基地、医药医疗器械产业']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztcjcx.webp';
|
|
|
} else if (this.id == 2) {
|
|
|
- this.str=['位于广阳湾智创生态城内','总用地面积约32万平方米','规划总建筑面积约为75万平方米','主导产业:软件及信息服务业发展']
|
|
|
+ this.str = ['位于广阳湾智创生态城内', '总用地面积约32万平方米', '规划总建筑面积约为75万平方米', '主导产业:软件及信息服务业发展']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztxj.webp';
|
|
|
} else {
|
|
|
- this.str=['总面积约7.31平方公里','建设用地面积4.14平方公里','建成面积约3.47平方公里','主导产业:智能制造、软件信息服务、大健康、汽车及零部件']
|
|
|
+ this.str = ['总面积约7.31平方公里', '建设用地面积4.14平方公里', '建成面积约3.47平方公里', '主导产业:智能制造、软件信息服务、大健康、汽车及零部件']
|
|
|
this.ztBackgroundImage = 'https://www.cqna.gov.cn/syygapi/naxsb/image/ztcy.webp';
|
|
|
}
|
|
|
- console.log(this.str,'srt');
|
|
|
-
|
|
|
+ console.log(this.str, 'srt');
|
|
|
+
|
|
|
},
|
|
|
methods: {
|
|
|
goIndex() {
|
|
@@ -823,7 +853,7 @@
|
|
|
map.addOverlay(polygon1);
|
|
|
setTimeout(function name(params) {
|
|
|
that.zoomInStepByStep(3, level);
|
|
|
- },3000)
|
|
|
+ }, 3000)
|
|
|
})
|
|
|
.catch(error => console.error('Error fetching JSON:', error));
|
|
|
|
|
@@ -916,7 +946,7 @@
|
|
|
// 开始递进缩放
|
|
|
setTimeout(function name(params) {
|
|
|
that.zoomInStepByStep(3, level);
|
|
|
- },3000)
|
|
|
+ }, 3000)
|
|
|
},
|
|
|
async getParkData() {
|
|
|
let that = this;
|
|
@@ -974,12 +1004,13 @@
|
|
|
that.buildList = dataList;
|
|
|
}
|
|
|
});
|
|
|
- var height = document.querySelector('.ztfwList')?document.querySelector('.ztfwList').clientHeight:0;
|
|
|
- if(this.buildList.length){
|
|
|
- this.addKeyFrames(height * this.buildList.length);}
|
|
|
- console.log(height,this.buildList.length);
|
|
|
- var height1 = document.querySelector('.tdgyList')?document.querySelector('.tdgyList').clientHeight:0;
|
|
|
- if(this.contentList.length){this.addKey(height1 * this.contentList.length);}
|
|
|
+ var height = document.querySelector('.ztfwList') ? document.querySelector('.ztfwList').clientHeight : 0;
|
|
|
+ if (this.buildList.length) {
|
|
|
+ this.addKeyFrames(height * this.buildList.length);
|
|
|
+ }
|
|
|
+ console.log(height, this.buildList.length);
|
|
|
+ var height1 = document.querySelector('.tdgyList') ? document.querySelector('.tdgyList').clientHeight : 0;
|
|
|
+ if (this.contentList.length) { this.addKey(height1 * this.contentList.length); }
|
|
|
},
|
|
|
addKeyFrames(y) {
|
|
|
console.log(y);
|
|
@@ -995,12 +1026,12 @@
|
|
|
zoomInStepByStep(currentZoom, maxZoom) {
|
|
|
let that = this;
|
|
|
if (currentZoom <= maxZoom) {
|
|
|
- map.setZoom(currentZoom,true);
|
|
|
- setTimeout(function() {
|
|
|
+ map.setZoom(currentZoom, true);
|
|
|
+ setTimeout(function () {
|
|
|
that.zoomInStepByStep(currentZoom + 0.5, maxZoom);
|
|
|
}, 100); // 每秒钟放大一级
|
|
|
}
|
|
|
- }
|
|
|
+ }
|
|
|
}
|
|
|
});
|
|
|
</script>
|