Bladeren bron

2021-8-30

hwq 3 jaren geleden
bovenliggende
commit
38e960b80c

BIN
public/11.ico


BIN
public/favicon.ico


+ 34 - 14
public/index.html

@@ -1,17 +1,37 @@
 <!DOCTYPE html>
 <html lang="zh-CN">
-  <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title>tlPC</title>
-  </head>
-  <body>
-    <noscript>
-      <strong>We're sorry but tlPC doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
-    </noscript>
-    <div id="app"></div>
-    <!-- built files will be auto injected -->
-  </body>
+	<head>
+		<meta charset="utf-8">
+		<meta http-equiv="X-UA-Compatible" content="IE=edge">
+		<meta name="viewport" content="width=device-width,initial-scale=1.0">
+		<link rel="icon" href="<%= BASE_URL %>11.ico">
+		<script>
+			(function () {
+				var sUserAgent = navigator.userAgent.toLowerCase();
+				var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
+				var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
+				var bIsMidp = sUserAgent.match(/midp/i) == "midp";
+				var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
+				var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
+				var bIsAndroid = sUserAgent.match(/android/i) == "android";
+				var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
+				var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
+				if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
+					//跳转移动端页面
+					window.location.href = "http://wap.tianlicn.cn/phone"
+					rel = "external nofollow"
+					rel = "external nofollow";
+				}
+			})()
+		</script>
+		<title>添利节能科技有限公司</title>
+	</head>
+	<body>
+		<noscript>
+			<strong>We're sorry but tlPC doesn't work properly without JavaScript enabled. Please enable it to
+				continue.</strong>
+		</noscript>
+		<div id="app"></div>
+		<!-- built files will be auto injected -->
+	</body>
 </html>

+ 35 - 34
src/App.vue

@@ -1,51 +1,52 @@
 <template>
-  <div id="app">
-    <nav-bar></nav-bar>
-	<swiper></swiper>
-	<div class="main-wrapper">
-		<router-view />
+	<div id="app">
+		<div class="contentbox" :class="{mapBoxs : !isShow}">
+			<nav-bar exclude="map" v-if="isShow"></nav-bar>
+			<swiper exclude="map" v-if="isShow"></swiper>
+			<div class="main-wrapper"><router-view /></div>
+		</div>
+		<page-bottom exclude="map" v-if="isShow"></page-bottom>
 	</div>
-	<page-bottom></page-bottom>
-  </div>
 </template>
 <script>
-import NavBar from './components/navBar/NavBar.vue'
-import PageBottom from './components/pageBottom/PageBottom.vue'
-import swiper from './components/swiper/swiper.vue'
+import NavBar from './components/navBar/NavBar.vue';
+import PageBottom from './components/pageBottom/PageBottom.vue';
+import swiper from './components/swiper/swiper.vue';
 export default {
-  components: {
-    NavBar,
-	PageBottom,
-	swiper
-  }
-}
+	components: {
+		NavBar,
+		PageBottom,
+		swiper
+	},
+	data(){
+		return{
+			isShow: true,
+		}
+	},
+	watch:{
+		$route(e){
+			if(e.name == 'map'){
+				this.isShow = false
+			}else {
+				this.isShow = true
+			}
+		}
+	}
+};
 </script>
 <style lang="scss" scoped>
-#app {
-	max-width: 1920px;
-	min-width: 1080px;
+.contentbox {
 	margin: 0 auto;
-}
+	max-width: 1200px;
+	min-width: 1080px;
+	}
 .main-wrapper {
 	width: 100%;
 	margin: 0 auto;
 }
-.bg {
-	position: absolute;
-	left: 0;
-	right: 0;
+.mapBoxs {
 	margin: 0 auto;
-	// margin: 0 auto -300px;
-	height: 300px;
 	max-width: 1920px;
 	min-width: 1080px;
-	// background-image: url(assets/img/m1.png);
-	// background-size: auto 100%;
-	z-index: -1;
-	img {
-		width: 1920px;
-		
-		height: 300px;
-	}
 }
 </style>

+ 8 - 0
src/api/product.js

@@ -36,3 +36,11 @@ export function articleInfo(data, id) {
 	});
 }
 
+//  新闻详情 
+export function storyInfo(data, id) {
+	return request({
+		url: '/apis/story/' + id,
+		method: 'get',
+		data
+	});
+}

BIN
src/assets/img/logo.png


BIN
src/assets/img/tanchuang.jpg


BIN
src/assets/img/tanchuang.png


BIN
src/assets/img/weichat.jpg


BIN
src/assets/img/weichat.png


BIN
src/assets/img/weixin.png


+ 18 - 0
src/assets/js/time.js

@@ -0,0 +1,18 @@
+//时间戳转换成时间
+export function getTime(time) {
+	const num =13 - (time+'').length;
+	let l = 1;//倍数
+	for (let i = 0; i < num; i++) {
+		l+='0';
+	}
+	// 重新解析为数字
+	l = parseInt(l)
+	const date = new Date(parseInt(time) * l);
+	const year = date.getFullYear();
+	const mon = date.getMonth() + 1;
+	const day = date.getDate();
+	const hours = date.getHours();
+	const minu = date.getMinutes();
+	const sec = date.getSeconds();
+	return year + '-' + mon + '-' + day
+}

+ 161 - 104
src/components/leftNav/LeftNav.vue

@@ -1,143 +1,200 @@
 <template>
 	<div class="wrapper">
-		<div class="left-nav" :style="{height: navHeight}">
+		<div class="left-nav" :style="{ height: navHeight }">
 			<div class="nav-title">
-				<div class="china">
-					关于我们
-				</div>
-				<div class="English">
-					About us
-				</div>
+				<div class="china">关于我们</div>
+				<div class="English">About us</div>
 			</div>
-			<div class="nav-item" v-for="item in navList" :key="item.id" :class="{'action': currentUrl.indexOf(item.path) !== -1 }" @click="navTo(item.path)">
+			<div class="nav-item" v-for="item in navList" :key="item.id" :class="{ action: currentUrl.indexOf(item.path) !== -1 }" @click="navTo(item.path)">
 				<div class="item-name">
-					<div class="yuan">
-					</div>
-					{{item.name}}
+					<div class="yuan"></div>
+					{{ item.name }}
 				</div>
-				<div class="item-icon">
+				<div class="item-icon"></div>
+			</div>
+			<div class="phone hand" @click="dialogVisible = true">
+				<div class="phoneleft">
+					<div class="img">
+						<img src="../../assets/img/weixin.png" >
+					</div>
 					
 				</div>
+				<div class="phoneright">
+					咨询在线客服
+				</div>
 			</div>
 		</div>
 		<div class="right-content">
-			<div style="padding: 35px 50px 35px 50px;" class="line">
-				<slot></slot>
-			</div>
-			
+			<div style="padding: 35px 50px 35px 50px;" class="line"><slot></slot></div>
 		</div>
+		<el-dialog :visible.sync="dialogVisible" title="客服企业微信" width="30%" :before-close="handleClose">
+			<div class="imgBox">
+				<img src="../../assets/img/tanchuang.jpg" >
+			</div>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
-	export default {
-		props: {
-			navList: {
-				type: Array,
-				default:[]
-			}
+export default {
+	props: {
+		navList: {
+			type: Array,
+			default: []
+		}
+	},
+	computed: {
+		navHeight() {
+			return this.navList.length * 51 + 52 + 'px';
 		},
-		computed: {
-			navHeight() {
-				return this.navList.length*51 + 52 + 'px'
-			},
-			currentUrl() {
-				return this.$route.path
+		currentUrl() {
+			return this.$route.path;
+		}
+	},
+	data() {
+		return {
+			currentIndex: 0,
+			dialogVisible: false
+		};
+	},
+	methods: {
+		navTo(path) {
+			let currentUrl = this.$route.path;
+			if (currentUrl === path) {
+				return;
+			} else {
+				this.$router.push(path);
 			}
 		},
-		data() {
-			return {
-				currentIndex: 0
-			}
+		changeClik(index) {
+			this.currentIndex = index;
+			this.$router.push('/donation/Hpc?id=' + index);
 		},
-		methods: {
-			navTo(path) {
-				let currentUrl = this.$route.path
-				if(currentUrl === path){
-					return
-				}else {
-					this.$router.push(path)
-				}
-			},
-			changeClik(index) {
-				this.currentIndex = index
-				this.$router.push('/donation/Hpc?id=' + index)
-			}
+		handleClose(done) {
+			// this.$confirm('确认关闭?')
+			// 	.then(_ => {
+			// 		done();
+			// 	})
+			// 	.catch(_ => {});
+			this.dialogVisible = false
 		}
 	}
+};
 </script>
 
 <style lang="scss" scoped>
-	.wrapper {
-		margin-top: 20px;
-		max-width: 1920px;
-		min-width: 1080px;
-		display: flex;
-		justify-content: flex-start;
-		
+.wrapper {
+	margin-top: 20px;
+	max-width: 1920px;
+	min-width: 1080px;
+	display: flex;
+	justify-content: flex-start;
+}
+.left-nav {
+	width: 200px;
+	// height: 154px;
+	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
+	.nav-title {
+		background-color: #0165b5;
+		text-align: center;
+		font-size: 20px;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: #ffffff;
+		letter-spacing: 3px;
+		cursor: default;
+		padding: 25px 0 50px 30px;
+		text-align: left;
+		.English {
+			margin-top: 20px;
+		}
 	}
-	.left-nav {
-		width: 265px;
-		// height: 154px;
-		box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-		.nav-title {
-			background-color: #0165B5;
-			text-align: center;
-			font-size: 20px;
+	.nav-item {
+		cursor: pointer;
+		margin-top: 5px;
+		display: flex;
+		align-items: center;
+		height: 50px;
+		background-color: #f2eeef;
+		justify-content: space-between;
+		line-height: 50px;
+		padding: 0 37px 0 26px;
+		.item-name {
+			display: flex;
+			font-size: 16px;
 			font-family: PingFang SC;
 			font-weight: bold;
-			color: #FFFFFF;
-			letter-spacing:3px;
-			cursor:default;
-			padding: 25px 0 50px 30px;
-			text-align: left;
-			.English {
-				margin-top: 20px;
-			}
-		}
-		.nav-item {
-			cursor:pointer;
-			margin-top: 5px;
-			display: flex;
+			color: #333333;
+			letter-spacing: 1px;
 			align-items: center;
-			height: 50px;
-			background-color: #f2eeef;
-			justify-content: space-between;
-			line-height: 50px;
-			padding: 0 37px 0 26px;
-			.item-name {
-				display: flex;
-				font-size: 16px;
-				font-family: PingFang SC;
-				font-weight: bold;
-				color: #333333;
-				letter-spacing:1px;
-				align-items: center;
-				.yuan {
-					width: 10px;
-					height: 10px;
-					border-radius: 50%;
-					background: #98B6CE;
-					margin-right: 10px;
-				}
-			}
-			.item-icon {
+			.yuan {
 				width: 10px;
 				height: 10px;
-				background: #0165B5;
+				border-radius: 50%;
+				background: #98b6ce;
+				margin-right: 10px;
 			}
 		}
-		.action {
-			background-color: #B2D0E9;
+		.item-icon {
+			width: 10px;
+			height: 10px;
+			background: #0165b5;
 		}
 	}
-	.right-content {
-		margin-left: 20px;
-		width: 915px;
-		min-height: 700px;
+	.action {
+		background-color: #b2d0e9;
+	}
+}
+.right-content {
+	margin-left: 20px;
+	width: 915px;
+	min-height: 700px;
+}
+.line {
+	line-height: 1.5;
+	position: relative;
+}
+.phone {
+	margin-top: 20px;
+	text-align: center;
+	width: 200px;
+	background-color: #ffffff;
+	border: 1px solid #e6e6e6;
+	border-radius: 5px;
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 10px 30px 10px 20px;
+	.phoneleft {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		.img{
+			width: 40px;
+			height: 35px;
+			img{
+				width: 100%;
+				height: 100%;
+			}
+		}
+		.phonefont {
+			margin-top: 10px;
+			font-size: 10px;
+		}
 		
 	}
-	.line {
-		line-height: 1.5;
+}
+.imgBox {
+	margin: 0 auto;
+	width: 60%;
+	padding-top: 120%;
+	position: relative;
+	img {
+		position: absolute;
+		left: 0;
+		top: 0;
+		width: 100%;
+		height: 100%;
 	}
+}
 </style>

+ 50 - 20
src/components/navBar/NavBar.vue

@@ -1,6 +1,12 @@
 <template>
 	<div class="top-bar">
-		<div class="img"><img src="../../assets/img/logo.png" /></div>
+		<div class="logobox">
+			<div class="img"><img src="../../assets/img/logo.png" /></div>
+			<div class="logofont">
+				<div class="font">添利节能科技</div>
+				<div class="eng">TIANLIJIENENGKEJI</div>
+			</div>
+		</div>
 		<div class="barbox">
 			<div class="bar-item" v-for="(item, index) in navList" :key="index" @click="navClick(item.path, index)" :class="{ action: currentUrl.indexOf(item.path) != -1 }">
 				<div>{{ item.title }}</div>
@@ -24,11 +30,11 @@ export default {
 					title: '关于我们'
 				},
 				{
-					path: '/loveList',
+					path: '/product',
 					title: '案例展示'
 				},
 				{
-					path: '/join',
+					path: '/news',
 					title: '新闻动态'
 				},
 				{
@@ -50,29 +56,38 @@ export default {
 	},
 	methods: {
 		navClick(url, index) {
-			let currentUrl = this.$route.path;
-			console.log(url);
-			console.log(currentUrl, 'now');
-			if (currentUrl === url) {
-				return;
-			} else {
-				console.log('1');
-				this.currentIndex = index;
-				console.log(this.currentIndex);
-				this.$router.push(url);
+			console.log(index,"123456")
+			
+			if (index === 5) {
+				this.$router.push('/about');
+				window.location.href = 'https://www.tianlicn.cn/iot/#/user/login';
+				return
+			}else {
+				if (this.currentUrl === url) {
+				 	return;
+				 }else {
+					let currentUrl = this.$route.path;
+				
+					console.log("123")
+				
+					this.currentIndex = index;
+				
+					this.$router.push(url);
+				}
 			}
-		],
-		currentIndex: 0
-	};
-  },
+			 
+		}
+	}
 };
 </script>
 
 <style lang="scss" scoped>
 .top-bar {
-	width: 100%;
+	max-width: 1200px;
+	min-width: 1080px;
+	margin: 0 auto;
 	margin: 0 auto;
-	padding: 15px;
+	padding: 15px 0;
 	display: flex;
 	justify-content: space-between;
 	background-color: #ffffff;
@@ -83,7 +98,7 @@ export default {
 	letter-spacing: 3px;
 	align-items: center;
 	.img {
-		width: 200px;
+		width: 50px;
 		height: auto;
 		img {
 			width: 100%;
@@ -115,4 +130,19 @@ export default {
 		color: #0165b5;
 	}
 }
+.logobox {
+	display: flex;
+	align-items: center;
+	.logofont {
+		margin-left: 10px;
+		.font {
+			font-size: 24px;
+			font-weight: bold;
+		}
+		.eng {
+			font-size: 10px;
+			margin-top: 5px;
+		}
+	}
+}
 </style>

+ 44 - 40
src/components/pageBottom/PageBottom.vue

@@ -1,25 +1,23 @@
 <template>
 	<div class="view-bottom">
-		<div class="erweima">
-			<div class="erweima-bg">
-				<img src="../../assets/img/weichat.png" >
+		<div class="content">
+			<div class="erweima">
+				<div class="erweima-bg"><img src="../../assets/img/weichat.jpg" /></div>
+				<div class="erweima-title">扫一扫关注我们</div>
 			</div>
-			<div class="erweima-title">
-				扫一扫关注我们
+			<div class="bqsy">
+				<div class="bqsy-item" v-for="(item, index) in list">
+					<div class="title">{{ item.title }}</div>
+				</div>
 			</div>
-		</div>
-		<div class="bqsy">
-			<div class="bqsy-item" v-for="(item, index) in list">
-				<div class="title" >{{ item.title }}</div>
+			<div class="address" style="margin-top: 20px;">地址:浙江省台州市路桥区路北街道珠光街199号213室(环飞龙湖科创生态圈首聚地)</div>
+			<div class="address" style="margin-top: 15px;">
+				电话:0576-82528889
+				<span>邮箱:163312@qq.com</span>
+				<span>邮编:318050</span>
 			</div>
+			<div class="address" style="margin-top: 15px;">备案号:浙ICP备2021004458号</div>
 		</div>
-		<div class="address" style="margin-top: 37px;">地址:浙江省台州市路桥区路北街道珠光街199号213室(环飞龙湖科创生态圈首聚地)</div>
-		<div class="address" style="margin-top: 30px;">
-			电话:0576-82528889
-			<span>邮箱:163312@qq.com</span>
-			<span>邮编:318050</span>
-		</div>
-		<div class="address" style="margin-top: 25px;">备案号:浙ICP备2021004458号</div>
 	</div>
 </template>
 
@@ -70,7 +68,13 @@ export default {
 	font-weight: bold;
 	color: #ffffff;
 	line-height: 1;
-	padding: 48px 0 64px 0;
+	padding: 25px 0 35px 0;
+	.content {
+		margin: 0 auto;
+		max-width: 1200px;
+		min-width: 1080px;
+		position: relative;
+	}
 	.bqsy {
 		display: flex;
 		width: 100%;
@@ -88,7 +92,7 @@ export default {
 			line-height: 25px;
 			font-size: 16px;
 			cursor: pointer;
-			border-left: 1px solid #FFFFFF;
+			border-left: 1px solid #ffffff;
 			.title {
 				width: 120px;
 			}
@@ -109,28 +113,28 @@ export default {
 	}
 }
 .erweima {
-		position: absolute;
-		top: 50px;
-		right: 100px;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		width: auto;
-		height: auto;
-		.erweima-bg {
-			width: 130px;
-			background-color: #FFFFFF;
-			line-height: 0;
-			img{
-				width: 100%;
-			}
-		}
-		.erweima-title {
-			font-size: 14px;
-			font-family: Adobe Heiti Std;
-			font-weight: normal;
-			color: #FFFFFF;
-			margin-top: 10px;
+	position: absolute;
+	top: 20px;
+	right: 100px;
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	width: auto;
+	height: auto;
+	.erweima-bg {
+		width: 100px;
+		background-color: #ffffff;
+		line-height: 0;
+		img {
+			width: 100%;
 		}
 	}
+	.erweima-title {
+		font-size: 14px;
+		font-family: Adobe Heiti Std;
+		font-weight: normal;
+		color: #ffffff;
+		margin-top: 10px;
+	}
+}
 </style>

+ 4 - 5
src/components/swiper/swiper.vue

@@ -20,7 +20,7 @@ export default {
 	methods: {
 		getSwiperList() {
 			let obj = this;
-			console.log(obj);
+			
 			loadIndexs().then(res => {
 				obj.swiperList = res.data.loop.split(',').map(e => {
 					return obj.$store.state.www + e;
@@ -29,7 +29,7 @@ export default {
 		},
 		async aa(){
 			const c = await bb()
-			console.log(c);
+			
 			
 		},
 		bb(){
@@ -50,10 +50,9 @@ export default {
 	}
 }
 .home-swiper {
-	max-width: 1920px;
-	min-width: 1080px;
+	width: 100%;
 	position: relative;
-	padding-top: 40.37%;
+	padding-top: 40%;
 	.imgBox {
 		position: absolute;
 		width: 100%;

+ 43 - 2
src/router/index.js

@@ -16,12 +16,53 @@ const ter = new Router({
 			meta: {
 				title: '节水测试'
 			}
-		}, {
+		},
+		{
 			path: '/home',
 			name: 'home',
 			component: () => import('../views/Home.vue'),
 			meta: {
-				title: '添利'
+				title: '添利节能科技有限公司'
+			}
+		},
+		{
+			path: '/map',
+			name: 'map',
+			component: () => import('../views/Shuju.vue'),
+			meta: {
+				title: '地图'
+			}
+		},
+		{
+			path: '/product',
+			name: 'product',
+			component: () => import('../views/productList.vue'),
+			meta: {
+				title: '案例展示'
+			}
+		},
+		{
+			path: '/product/detail',
+			name: 'datatile',
+			component: () => import('../views/productDatatile.vue'),
+			meta: {
+				title: '案例详情'
+			}
+		},
+		{
+			path: '/news',
+			name: 'news',
+			component: () => import('../views/newsList.vue'),
+			meta: {
+				title: '新闻动态'
+			}
+		},
+		{
+			path: '/news/datatile',
+			name: 'newDatatile',
+			component: () => import('../views/newDatatile.vue'),
+			meta: {
+				title: '新闻详情'
 			}
 		},
 		{

+ 1 - 1
src/router/interceptor.js

@@ -5,7 +5,7 @@ router.afterEach((to, from, next) => {
 	//页面跳转时,页面位置重置为顶部
 	window.scrollTo(0, 0);
 	//修改页面title
-	window.document.title = to.meta.title == undefined ? '添利' : to.meta.title
+	window.document.title = to.meta.title == undefined ? '添利节能科技有限公司' : to.meta.title
 })
 
 export default router

+ 1 - 1
src/store.js

@@ -6,7 +6,7 @@ Vue.use(Vuex)
 export default new Vuex.Store({
   state: {
 	  // www:""
-	www: "http://tianli.liuniu946.com"
+	www: "http://wap.tianlicn.cn"
   },
   mutations: {
 

+ 11 - 2
src/utils/request.js

@@ -10,10 +10,10 @@ let configBase ={
 }
 if(process.env.NODE_ENV === 'development'){
 	configBase.baseURL = '';
-	console.log('开发环境')
+	
 }else{
 	configBase.baseURL = store.state.www;
-    console.log('生产环境')
+   
 }
 
 
@@ -37,6 +37,15 @@ service.interceptors.request.use(
 		// if(config.method=='post'){
 		// 	config.data.token = getToken();
 		// }
+		if(config.method.toUpperCase() == 'GET'){
+			if(config.data&&!config.params){
+				config.params = config.data;
+			}
+		}if(config.method.toUpperCase() == 'POST'){
+			if(config.params&&!config.data){
+				config.data = config.params;
+			}
+		}
 		return config
 	},
 	error => {

+ 7 - 2
src/views/About.vue

@@ -1,7 +1,7 @@
 <template>
 	<div class="about">
 		<left-nav :navList="navList" :rightTitle="rightTitle" :currentIndex="currentIndex">
-			<div id="" v-html="content">
+			<div id="">
 				<router-view></router-view>
 			</div>
 		</left-nav>
@@ -24,5 +24,10 @@ export default {
 }
 </script>
 
-<style>
+<style lang="scss" scoped>
+	.about {
+		width: 100%;
+		margin: 20px auto 0;
+		
+	}
 </style>

+ 117 - 59
src/views/Home.vue

@@ -2,44 +2,47 @@
 	<div class="home">
 		<div class="company">
 			<div class="company-left">
-				<item-title title="公司介绍" :topath="'/publicity'"></item-title>
-				<div class="font">
-					台州市添利节能科技有限公司是专注于电镀行业节能减排尖端设备研发和 技术服务的企业,多年来为国内多家电镀企业进行技术改造,截止2021年1月
-					累计节水量达到200多万吨,节水经济效益1.17亿元,平均节水效率45%。
+				<item-title title="公司介绍" :topath="'/about'"></item-title>
+				<div class="font" v-html="main.content">
+					
+				</div>
+			</div>
+			<div class="company-right">
+				<div class="imgBox">
+					<img class="img" :src="main.coverimage" />
 				</div>
 			</div>
-			<div class="company-right"><img src="" /></div>
 		</div>
 		<div class="home-body">
 			<div class="new-pic">
-				<el-carousel :interval="4000" height="450px" indicator-position="none">
-					<el-carousel-item v-for="(item, index) in showNew" :key="index" @click="navTo('/news/detail?id=' + item.id)">
-						<img :src="item.img" />
+				<el-carousel :interval="4000" height="320px" indicator-position="none">
+					<el-carousel-item v-for="(item, index) in showNew" :key="index" >
+						<img :src="item.coverimage" @click="navTo('/news/datatile?id='+ item.id)"/>
 						<div class="title clamp hand">{{ item.title }}</div>
 					</el-carousel-item>
 				</el-carousel>
 			</div>
 			<div class="case">
-				<item-title title="案例展示" :topath="'/publicity'"></item-title>
+				<item-title title="案例展示" :topath="'/product'"></item-title>
 				<div class="item-wrapper">
-					<div class="new-item hand" v-for="item in openNews" :key="item.id" @click="navTo('/publicity/detail?id=' + item.id)">
+					<div class="new-item hand" v-for="item in openNews" :key="item.id" @click="navTo('/product/detail?id='+ item.id)">
 						<div class="title clamp ">
 							<span></span>
 							{{ item.title }}
 						</div>
-						<div class="time">{{ item.release_time ? item.release_time : item.add_time | time }}</div>
+						<div class="time">{{ item.time }}</div>
 					</div>
 				</div>
 			</div>
 			<div class="news">
 				<item-title title="新闻动态" :topath="'/news'"></item-title>
 				<div class="item-wrapper">
-					<div class="new-item hand" v-for="item in redNews" :key="item.id" @click="navTo('/news/detail?id=' + item.id)">
+					<div class="new-item hand" v-for="item in redNews" :key="item.id" @click="navTo('/news/datatile?id='+ item.id)">
 						<div class="title clamp">
 							<span></span>
 							{{ item.title }}
 						</div>
-						<div class="time">{{ item.release_time ? item.release_time : item.add_time | time }}</div>
+						<div class="time">{{ item.time }}</div>
 					</div>
 				</div>
 			</div>
@@ -135,7 +138,9 @@
 
 <script>
 import ItemTitle from './homeChild/ItemTitle.vue';
-import { loadIndexs, aboutList, machine, companies, formBaoCun } from '@/api/index';
+import { loadIndexs, aboutList, machine, companies, formBaoCun,caseslist,storylist } from '@/api/index';
+import { getTime } from '../assets/js/time.js'
+import { aboutInfo } from '@/api/product.js'
 import MyOverlay from '@/components/MyOverlay.vue';
 export default {
 	components: {
@@ -144,14 +149,15 @@ export default {
 	},
 	data() {
 		return {
-			openNews: [],
-			redNews: [],
-			showNew: [{}, {}],
+			main:'',//公司介绍
+			openNews: [],//案例展示
+			redNews: [],//新闻展示
+			showNew: [{title:'111'},{title:'222'}],
 			map: null, //保存地图
 			// 公司列表
 			companyList: [],
 			// 默认层级
-			zoomActive: 12,
+			zoomActive: 9,
 			machineList: {} // 设备总体信息
 		};
 	},
@@ -163,6 +169,26 @@ export default {
 	methods: {
 		// 加载初始数据
 		loadData(){
+			//公司介绍
+			aboutInfo({},7).then(e => {
+				this.main = e.data;
+			})
+			//新闻展示
+			storylist({page:1,limit:7}).then(e => {
+				e.data.list.forEach(data => {
+				data.time = getTime(data.createtime)
+				})
+				this.redNews = e.data.list
+				this.showNew = e.data.list
+			})
+			//案例展示
+			caseslist({page:1,limit:7}).then(e =>{
+				e.data.list.forEach(data => {
+				data.time = getTime(data.createtime)
+				})
+				
+				this.openNews = e.data.list
+			})
 			companies().then(e => {
 				this.companyList = e.data.map(e => {
 					// 初始化弹窗显示隐藏
@@ -187,13 +213,13 @@ export default {
 			})
 			machine({}, 0).then(res => {
 				this.machineList = res.data;
-				console.log(res);
+				
 			});
 		},
 		// 保存处理公司数据
 		setCompanyData() {
 			let obj = this;
-			console.log(this.companyList, 55);
+			
 			for (let i = 0; i < this.companyList.length; i++) {
 				let data = this.companyList[i];
 				setTimeout(() => {
@@ -236,6 +262,9 @@ export default {
 				}
 			}
 		},
+		navTo(url) {
+			this.$router.push(url);
+		},
 		// 显示数据
 		infoWindowOpen(item) {
 			item.alertShow = true;
@@ -244,7 +273,7 @@ export default {
 		init({ BMap, map }) {
 			this.map = map;
 			// 初始化地图,设置中心点坐标
-			var point = new BMap.Point(121.434817, 28.653649);
+			var point = new BMap.Point(121.434817, 29.653849);
 			map.centerAndZoom(point, this.zoomActive);
 			// this.setMarker();
 			// 添加鼠标滚动缩放
@@ -256,16 +285,15 @@ export default {
 
 <style lang="scss" spcode>
 .company {
-	max-width: 1920px;
-	min-width: 1080px;
+	width: 100%;
+	margin: 0 auto;
 	display: flex;
 	justify-content: start;
-	padding: 50px 75px 70px 50px;
+	padding: 50px 0 50px;
 	.company-left {
-		padding-top: 20px;
 		max-width: 50%;
 		min-width: 25%;
-		height: 414px;
+		// height: 414px;
 		.font {
 			margin-top: 37px;
 			font-size: 14px;
@@ -276,32 +304,53 @@ export default {
 		}
 	}
 	.company-right {
-		margin-left: 60px;
+		margin-left: 20px;
 		width: 50%;
-		height: 410px;
-		background: #55aaff;
+		padding-top: 30%;
+		position: relative;
+		height: 0;
+		.imgBox {
+			position: absolute;
+			width: 100%;
+			height: 100%;
+			top: 0;
+			left: 0;
+			.img {
+				width: 100%;
+				height: 100%;
+			}
+		}
+		
 	}
 }
 .home-body {
-	max-width: 1920px;
-	min-width: 1080px;
+	width: 100%;
+	margin: 0 auto;
 	display: flex;
 	justify-content: space-between;
-	padding: 20px;
 	.new-pic {
-		width: 600px;
-		height: 450px;
+		// max-width: 550px;
+		// min-width: 400px;
+		width: 380px;;
+		height: 350px;
 		position: relative;
 		img {
-			width: 600px;
-			height: 450px;
+			// max-width: 550px;
+			// min-width: 400px;
+			width: 380px;
+			height: 320px;
 		}
+		
 		.title {
-			width: 600px;
-			height: 80px;
+			text-align: center;
+			// max-width: 550px;
+			// min-width: 400px;
+			padding: 0 10px;
+			width: 380px;
+			height: 60px;
 			background: #d2d3d3;
 			opacity: 0.8;
-			line-height: 55px;
+			line-height: 60px;
 			font-size: 24px;
 			font-family: inpinheiti;
 			font-weight: 400;
@@ -311,14 +360,14 @@ export default {
 		}
 	}
 	.case {
-		width: 33%;
-		height: 450px;
+		width: 32%;
+		height: 350px;
 		background: #ffffff;
 		margin-left: 20px;
 	}
 	.news {
-		width: 33%;
-		height: 450px;
+		width: 32%;
+		height: 350px;
 		background: #ffffff;
 		margin-left: 20px;
 	}
@@ -338,31 +387,33 @@ export default {
 	padding: 20px 15px 0 13px;
 
 	.new-item {
+		width: 100%;;
 		display: flex;
 		justify-content: space-between;
 		margin-bottom: 17px;
 		&:hover {
 			span {
-				background: red;
+				border-color: #0165B5;
 			}
 			.title {
-				color: red;
+				color: #0165B5;
 			}
 			.time {
-				color: red;
+				color: #0165B5;
 			}
 		}
 		span {
 			display: inline-block;
-			width: 8px;
-			height: 8px;
-			background: #d8d8d8;
-			// border-radius: 50%;
-			transform: rotate(45deg);
 			margin-right: 8px;
+			width: 5px;
+			height: 5px;
+			border-left: 1px solid #d8d8d8;
+			border-bottom: 1px solid #d8d8d8;
+			-webkit-transform: translate(0,-50%) rotate(-135deg);
+			transform: translate(0,-50%) rotate(-135deg);
 		}
 		.title {
-			width: 400px;
+			
 			height: 14px;
 			font-size: 14px;
 			font-family: PingFang SC;
@@ -373,6 +424,7 @@ export default {
 			// }
 		}
 		.time {
+			min-width: 80px;
 			font-size: 14px;
 			font-family: PingFang SC;
 			font-weight: 500;
@@ -410,9 +462,11 @@ export default {
 	}
 }
 .mapBox{
+	max-width: 1200px;
+	min-width: 1080px;
 	position: relative;
-	padding-top: 33.33%;
-	margin: 15px;
+	padding-top: 50%;
+	margin: 15px auto 35px;
 }
 .sjkb_box {
 	position: absolute;
@@ -442,30 +496,34 @@ export default {
 				line-height: 1;
 				background: #ffffff;
 				display: flex;
+				align-items: center;
+				border-radius: 5px;
 				&:last-of-type {
 					margin-right: 0;
 					// padding-right: 20px;
 				}
 				.iconMapTop{
-					width: 80px;
-					height: 80px;
+					width: 70px;
+					height: 70px;
 				}
 				// align-items: center;
 				.shebeitji_box {
+					margin-left: 5px;
 					padding-right: 20px;
-					padding-top: 8px;
+					// padding-top: 8px;
 					// border-right: 1px solid #f0f0f0;
 					text-align: left;
 					.sjkb_title {
-						font-size: 24px;
+						font-size: 18px;
 						font-family: PingFang SC;
 						font-weight: 500;
 						color: #101010;
 					}
 					.sjkb_content {
+						margin-top: 10px;
 						text-align: left;
 						.sjkb_now {
-							font-size: 40px;
+							font-size: 20px;
 							font-family: PingFang SC;
 							font-weight: 500;
 							color: #101010;

+ 325 - 0
src/views/Shuju.vue

@@ -0,0 +1,325 @@
+<template>
+	<div class="map_box">
+		<baidu-map class="bm-view" @zoomend='zoomendChange' @ready="init" :min-zoom="5" :max-zoom="18">
+			<bm-navigation anchor="BMAP_ANCHOR_BOTTOM_RIGHT"></bm-navigation>
+			<bm-copyright anchor="BMAP_ANCHOR_TOP_RIGHT" :copyright="[{id: 1, content: 'Copyright Message', bounds: {ne: {lng: 110, lat: 40}, sw:{lng: 0, lat: 0}}}, {id: 2, content: '<a>添利节能科技有限公司</a>'}]">
+			</bm-copyright>
+			<bm-marker class="bm-marker" v-for="(item, index) in companyList" :key="index" :position="{
+					lng: item.longtitude,
+					lat: item.lattitude
+				}"
+			 @click="infoWindowOpen(item)">
+				<bm-label v-if='zoomActive>=15' :content="item.name" :labelStyle="item.style" :offset="item.textType" />
+			 <my-overlay
+						 :position="{lng: item.longtitude, lat: item.lattitude-0.003}"
+						 :item="item"
+						 v-if='item.alertShow == true'
+						 >
+					 </my-overlay>
+			</bm-marker>
+
+		</baidu-map>
+		<div class="sjkb_wrap">
+			<div class="sjkb_item">
+				<el-image class="sjkb_img" :src="require('@/assets/img/info003.png')" fit="cover"></el-image>
+				<div class="shebeitji_box">
+					<span class="sjkb_title">经济效益(万元)</span>
+					<div class="sjkb_content">
+						<span class="sjkb_now">{{ parseFloat(machineData.machine_save_money/10000).toFixed(2) || '0' }}</span>
+						<!-- <el-image class="" :src="require('@/assets/index_up.png')" fit="cover"></el-image>
+						<span class="sjkb_upNum">0</span> -->
+					</div>
+				</div>
+			</div>
+			<div class="sjkb_item">
+				<el-image class="sjkb_img" :src="require('@/assets/img/info002.png')" fit="cover"></el-image>
+				<div class="shebeitji_box">
+					<span class="sjkb_title">用水总量(万吨)</span>
+					<div class="sjkb_content">
+						<span class="sjkb_now">{{ parseFloat(machineData.machine_use_water/10000).toFixed(2) || '0' }}</span>
+						<!-- <el-image class="" :src="require('@/assets/rili.png')" fit="cover"></el-image>
+						<span class="sjkb_upNum">{{ machineData.machine_use_time_max }}</span> -->
+					</div>
+				</div>
+			</div>
+			<div class="sjkb_item">
+				<el-image class="sjkb_img" :src="require('@/assets/img/info002.png')" fit="cover"></el-image>
+				<div class="shebeitji_box">
+					<span class="sjkb_title">节水总量(万吨)</span>
+					<div class="sjkb_content">
+						<span class="sjkb_now">{{ parseFloat(machineData.machine_save_water/10000).toFixed(2) || '0' }}</span>
+						<!-- <el-image class="" :src="require('@/assets/rili.png')" fit="cover"></el-image>
+						<span class="sjkb_upNum">{{ machineData.machine_use_time_max }}</span> -->
+					</div>
+				</div>
+			</div>
+			<div class="sjkb_item">
+				<el-image class="sjkb_img" :src="require('@/assets/img/info001.png')" fit="cover"></el-image>
+				<div class="shebeitji_box">
+					<span class="sjkb_title">合作企业(家)</span>
+					<div class="sjkb_content">
+						<span class="sjkb_now">{{ machineData.machine_company_num || '0' }}</span>
+						<!-- <el-image class="" :src="require('@/assets/index_up.png')" fit="cover"></el-image>
+						<span class="sjkb_upNum">0</span> -->
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	import MyOverlay from '../components/MyOverlay.vue'
+	import {
+		companies,
+		machine
+	} from '../api/index.js';
+	export default {
+		name: 'Shuju',
+		components: {
+			MyOverlay
+		},
+		data() {
+			return {
+				// 公司列表
+				companyList: [],
+				// 默认层级
+				zoomActive: 9,
+				machineData: {
+					machine_num: 0, //设备数量 <number>
+					machine_use_time_max: 0, //运行时间 <number>
+					machine_company_num: 0, //企业数量 <number>
+					machine_use_water: 0, //用水量 <string>
+					machine_save_water: 0, //节水量 <string>
+					machine_save_money: 0 //省了多少钱 <string>
+				},
+				machineDataModal: {
+					machine_num: 0, //设备数量 <number>
+					machine_use_time_max: 0, //运行时间 <number>
+					machine_company_num: 0, //企业数量 <number>
+					machine_use_water: 0, //用水量 <string>
+					machine_save_water: 0, //节水量 <string>
+					machine_save_money: 0, //省了多少钱 <string>
+					machine_name: '',
+				},
+				infoWindow: {
+					show: false
+				},
+				map: '', // 地图
+				itemData: {}, // 选中数据
+				machineid: '', // 选中id
+				mapZoomChangeStatus: false, //判断是否已经触发过显示事件
+				position: {},
+			}
+		},
+		created() {
+			this.loadData();
+		},
+		methods: {
+			loadData() {
+				companies().then(e => {
+					this.companyList = e.data.map(e => {
+						// 初始化弹窗显示隐藏
+						e.alertShow = false;
+						// e.lattitude = 28.243198;
+						// e.longtitude = 121.279239;
+						// 设置文字样式
+						e.textType = {
+							width: -((e.name.length / 2) * 10),
+							height: 30
+						};
+						e.data = {};
+						e.style = {
+							background: 'none',
+							color: '#333333',
+							fontSize: '10px',
+							border: 'none'
+						};
+						return e;
+					});
+					this.setCompanyData();
+				})
+
+				machine({}, 0).then(res => {
+					this.machineData = res.data;
+				})
+			},
+			setCompanyData() {
+				let obj = this;
+				console.log(this.companyList, 55);
+				for (let i = 0; i < this.companyList.length; i++) {
+					let data = this.companyList[i];
+					setTimeout(() => {
+						obj.getData(data.id).then((e) => {
+							data.data = e.data;
+							data.data.machine_name = data.name
+						}).catch(e => {
+							console.log(e);
+						})
+					}, 100 * i)
+				}
+			},
+			/* 设置弹窗 */
+			zoomendChange(type) {
+				const obj = this;
+				obj.zoomActive = type.target.getZoom();
+				if (obj.zoomActive >= 15) {
+					for(let i=0; i< obj.companyList.length; i++) {
+						obj.companyList[i].alertShow = true;
+					}
+				}
+				if (obj.zoomActive <= 10) {
+					for(let i=0; i< obj.companyList.length; i++) {
+						obj.companyList[i].alertShow = false;
+					}
+				}
+			},
+			getData(machineid) {
+				return new Promise((ok, err) => {
+					machine({}, machineid).then(e => {
+							ok(e);
+						})
+						.catch(e => {
+							err(e);
+							console.log(e);
+						});
+				})
+			},
+			infoWindowClose(item) {
+				console.log(item);
+				item.alertShow = false
+			},
+			// 显示数据
+			infoWindowOpen(item) {
+				item.alertShow = true
+			},
+			init({
+				BMap,
+				map
+			}) {
+				this.map = map;
+				// 初始化地图,设置中心点坐标
+				var point = new BMap.Point(121.434817, 29.653849);
+				map.centerAndZoom(point, this.zoomActive);
+				// 添加鼠标滚动缩放
+				map.enableScrollWheelZoom();
+			},
+			//切换事件
+			// onAction(start=true) {
+			// 	console.log('触发点击');
+			// 	this.autoPlay = false;
+			// 	clearTimeout(this.outPlay);
+			// 	if(start){
+			// 		this.outPlay = setTimeout(e => {
+			// 			this.autoPlay = true;
+			// 		}, this.setOutTime);
+			// 	}
+			// },
+		}
+	}
+</script>
+
+<style lang="scss">
+	.map_box {
+		width: 100%;
+		height: 100vh;
+		position: relative;
+
+		.bm-view {
+			width: 100%;
+			height: 100vh;
+		}
+
+		.sjkb_wrap {
+			position: absolute;
+			top: 20px;
+			left: 30px;
+			display: flex;
+			align-items: center;
+
+			.sjkb_item {
+				margin-right: 15px;
+				background: #ffffff;
+				display: flex;
+				align-items: center;
+				.sjkb_img {
+					width: 100px;
+					height: 100px;
+				}
+				// &:last-of-type {
+				// 	margin-right: 0;
+				// 	padding-right: 20px;
+				// }
+				// align-items: center;
+				.shebeitji_box {
+					margin-left: 5px;
+					padding-right: 20px;
+					// padding-top: 8px;
+					// border-right: 1px solid #f0f0f0;
+					text-align: left;
+					.sjkb_title {
+						font-size: 18px;
+						font-family: PingFang SC;
+						font-weight: 500;
+						color: #101010;
+					}
+					.sjkb_content {
+						margin-top: 10px;
+						text-align: left;
+						.sjkb_now {
+							font-size: 20px;
+							font-family: PingFang SC;
+							font-weight: 500;
+							color: #101010;
+						}
+						.sjkb_upNum {
+							margin-left: 3px;
+							font-size: 20px;
+							font-family: PingFang SC;
+							font-weight: 500;
+							color: #101010;
+						}
+					}
+				}
+				
+				.sbtj_tongji {
+					padding: 0 70px 10px 20px;
+					display: flex;
+					flex-direction: column;
+					align-items: center;
+					justify-content: space-around;
+
+					.sbtj_shuju {
+						display: flex;
+						align-items: center;
+						font-size: 18px;
+						font-family: PingFang SC;
+						font-weight: bold;
+						color: #101010;
+
+						.sbtj_dian {
+							margin-right: 3px;
+							width: 10px;
+							height: 10px;
+							border-radius: 50%;
+						}
+
+						.lanse {
+							background: #1890ff;
+						}
+
+						.hongse {
+							background: #f25657;
+						}
+
+						.huise {
+							background: #eeeeee;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	
+</style>

+ 14 - 2
src/views/about/Company.vue

@@ -1,11 +1,15 @@
 <template>
 	<div class="center">
+		<div class="title">
+			公司介绍
+		</div>
 		<div class="" v-html="text">
 		</div>
 	</div>
 </template>
 
 <script>
+	import { articleInfo } from '@/api/product.js'
 	export default {
 		data() {
 			return {
@@ -13,15 +17,23 @@
 			}
 		},
 		created() {
-			this.getContent()
+			this.getContent();
 		},
 		methods: {
 			getContent() {
-				
+				articleInfo({},2).then(e =>{
+					
+					this.text = e.data.content
+				})
 			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped="">
+	.title {
+		padding-bottom: 20px;
+		font-size: 20px;
+		font-weight: bold;
+	}
 </style>

+ 74 - 11
src/views/about/Concat.vue

@@ -1,27 +1,90 @@
 <template>
 	<div class="center">
-		<div class="" v-html="text">
+		<div class="title">联系我们</div>
+		<div class="box">
+			<baidu-map class="bm-view" @ready="init" :min-zoom="5" :max-zoom="18">
+				<bm-info-window
+					:position="{ lng: 121.389408, lat: 28.595935 }"
+					:show="infoWindow.show"
+					@close="infoWindowClose"
+					@open="infoWindowOpen"
+				>
+					<p class="font-title">添利节能科技</p>
+					<p class="font-main">地址:浙江省台州市路桥区路北街道珠光街199号213室</p>
+					<p class="font-main">联系方式:0576-82528889</p>
+					
+				</bm-info-window>
+			</baidu-map>
+		</div>
+		<div class="phone">
+			咨询热线:0576-82528889
 		</div>
 	</div>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				text: ''
+export default {
+	data() {
+		return {
+			text: '',
+			map: null, //保存地图
+			// 默认层级
+			zoomActive: 18,
+			infoWindow: {
+				show: true,
+				
 			}
+		};
+	},
+	created() {
+		this.getContent();
+	},
+	methods: {
+		getContent() {},
+		init({ BMap, map }) {
+			this.map = map;
+			// 初始化地图,设置中心点坐标
+			var point = new BMap.Point(121.389408, 28.595935);
+			map.centerAndZoom(point, this.zoomActive);
+			// this.setMarker();
+			// 添加鼠标滚动缩放
+			map.enableScrollWheelZoom();
 		},
-		created() {
-			this.getContent()
+		infoWindowClose(e) {
+			this.infoWindow.show = false;
 		},
-		methods: {
-			getContent() {
-				
-			}
+		infoWindowOpen(e) {
+			this.infoWindow.show = true;
 		}
 	}
+};
 </script>
 
 <style lang="scss" scoped="">
+.title {
+	padding-bottom: 20px;
+	font-size: 20px;
+	font-weight: bold;
+}
+.box {
+	width: 850px;
+	height: 400px;
+	.bm-view {
+		width: 100%;
+		height: 100%;
+	}
+}
+.font-title {
+	padding-top: 5px;
+	padding-right: 5px;
+	font-size: 16px;
+}
+.font-main {
+	font-size: 14px;
+}
+.phone {
+	margin-top: 40px;
+	width: 850px;
+	text-align: center;
+}
 </style>

+ 12 - 1
src/views/about/Product.vue

@@ -1,11 +1,15 @@
 <template>
 	<div class="center">
+		<div class="title">
+			产品介绍
+		</div>
 		<div class="" v-html="text">
 		</div>
 	</div>
 </template>
 
 <script>
+	import { productInfo } from '@/api/product.js'
 	export default {
 		data() {
 			return {
@@ -17,11 +21,18 @@
 		},
 		methods: {
 			getContent() {
-				
+				productInfo({},3).then(e =>{
+					this.text = e.data.content
+				})
 			}
 		}
 	}
 </script>
 
 <style lang="scss" scoped="">
+	.title {
+		padding-bottom: 20px;
+		font-size: 20px;
+		font-weight: bold;
+	}
 </style>

+ 59 - 0
src/views/newDatatile.vue

@@ -0,0 +1,59 @@
+<template>
+	<div class="new-detail">
+		<div class="title">
+			新闻动态
+		</div>
+		<dcontent class="main" :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { storyInfo } from '@/api/product.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				// detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				storyInfo({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.new-detail {
+		max-width: 1180px;
+		min-width: 1060px;
+		margin: 20px auto 0;
+	}
+	.title {
+		font-size: 20px;
+		font-family: Adobe Heiti Std;
+		font-weight: normal;
+		color: #000000;
+		width: 100%;
+		text-align: center;
+	}
+	.main {
+		width: 80%;;
+		margin: 20px auto 0;
+		min-height: 1000px;
+		padding-bottom: 20px;
+	}
+</style>

+ 190 - 0
src/views/newsList.vue

@@ -0,0 +1,190 @@
+<template>
+	<div class="new-list">
+		<div class="mpBoxTitle">
+			<div class="mpBoxTitleBox">
+			<div class="titleText">
+				新闻动态
+			</div>
+			</div>
+			<div class="border"></div>
+		</div>
+		<div class="boxs" v-for="item in newList" @click="navTo('/news/datatile?id='+ item.id)">
+			<div class="box">
+				<div class="box-left">
+					<img :src="item.coverimage" >
+				</div>
+				<div class="box-right">
+					<div class="box-title clamp">
+						{{ item.title }}
+					</div>
+					<div class="box-time">
+						{{ item.time }}
+					</div>
+					<div class="box-main">
+						{{ item.synopsis }}
+					</div>
+				</div>
+			</div>
+			<div class="box-bottom">
+				<div class="bottom-font">
+					作者:{{ item.author }}
+				</div>
+				<div class="bottom-font">
+					{{ item.time }}
+				</div>
+				<div class="bottom-font">
+					阅读量:{{ item.visit }}
+				</div>
+			</div>
+		</div>
+		<div class="page">
+			<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页" @current-change="currentChange" :page-size="3" hide-on-single-page></el-pagination>
+		</div>
+	</div>
+</template>
+
+<script>
+import { storylist } from '@/api/index.js';
+import { getTime } from '../assets/js/time.js'
+export default {
+	data() {
+		return {
+			newList: [],
+			total: 0,
+			page: 1,
+			limit: 3
+		};
+	},
+	filters: {
+		
+	},
+	created() {
+		this.getList()
+	},
+	methods:{
+		navTo(url) {
+			this.$router.push(url);
+		},
+		currentChange(e) {
+			this.page = e
+			this.getList()
+		},
+		getList() {
+			let obj = this
+			
+			storylist({
+				page: obj.page,
+				limit: obj.limit
+			}).then(res => {
+				res.data.list.forEach(data => {
+					data.time = getTime(data.createtime)
+				})
+				obj.newList = res.data.list
+				obj.total = res.data.count
+			})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.new-list {
+	max-width: 1200px;
+	min-width: 1080px;
+	margin: 0 auto;
+	padding-bottom: 20px;
+	min-height: 500px;
+}
+.boxs {
+	width: 80%;
+	margin: 30px auto 0;
+	.box-bottom {
+		padding: 10px;
+		width: 100%;
+		display: flex;
+		justify-content: space-between;
+		.bottom-font {
+			font-size: 16px;
+			color: #E0E2E4;
+		}
+	}
+}
+
+.box {
+	width: 100%;
+	display: flex;
+	justify-content: space-between;
+	.box-left {
+		flex-shrink: 0;
+		width: 250px;
+		height: 150px;
+		// background-color: #000066;
+		img{
+			width: 100%;
+			height: 100%;
+		}
+	}
+	.box-right {
+		max-width: 70%;
+		min-width: 70%;
+		padding: 10px;
+		.box-title {
+			font-size: 20px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			color: #535962;
+		}
+		.box-time {
+			font-size: 16px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			color: #A1A1A1;
+			margin-top: 10px;
+		}
+		.box-main {
+			max-width: 100%;
+			min-width: 100%;
+			font-size: 18px;
+			margin-top: 10px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			height: 70px;
+			word-wrap: break-word;
+			word-break: break-all;
+			overflow: hidden;
+		}
+	}
+}
+.mpBoxTitle{
+	display: flex;
+	align-items: center;
+	height: 50px;
+	position: relative;
+	margin-top: 30px;
+	.border{
+		height: 1px;
+		width: 100%;
+		background-color: #E0E2E4;
+	}
+	.mpBoxTitleBox{
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.titleText{
+			background-color: #FFFFFF;
+			font-size: 26px;
+			padding:  30px;
+			font-weight: bold;
+		}
+	}
+}
+.page {
+	width: 80%;
+	margin: 20px auto 0;
+}
+</style>

+ 59 - 0
src/views/productDatatile.vue

@@ -0,0 +1,59 @@
+<template>
+	<div class="new-detail">
+		<div class="title">
+			案例展示
+		</div>
+		<dcontent class="main" :content="content"></dcontent>
+	</div>
+</template>
+
+<script>
+	import { casesInfo } from '@/api/product.js'
+	export default {
+		data() {
+			return {
+				content: '',
+				// detail: {},
+				idd:0
+			}
+		},
+		created() {
+			this.getContent()
+		},
+		methods:{
+			getContent() {
+				let obj = this
+				this.idd = this.$route.query.id
+				obj.getDetail()
+			},
+			getDetail() {
+				let obj = this
+				casesInfo({},this.idd).then(res => {
+					obj.content = res.data.content
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.new-detail {
+		max-width: 1180px;
+		min-width: 1060px;
+		margin: 20px auto 0;
+	}
+	.title {
+		font-size: 20px;
+		font-family: Adobe Heiti Std;
+		font-weight: normal;
+		color: #000000;
+		width: 100%;
+		text-align: center;
+	}
+	.main {
+		width: 80%;;
+		margin: 20px auto 0;
+		min-height: 1000px;
+		padding-bottom: 20px;
+	}
+</style>

+ 190 - 0
src/views/productList.vue

@@ -0,0 +1,190 @@
+<template>
+	<div class="new-list">
+		<div class="mpBoxTitle">
+			<div class="mpBoxTitleBox">
+			<div class="titleText">
+				案例展示
+			</div>
+			</div>
+			<div class="border"></div>
+		</div>
+		<div class="boxs" v-for="item in newList" @click="navTo('/product/detail?id='+ item.id)">
+			<div class="box">
+				<div class="box-left">
+					<img :src="item.coverimage" >
+				</div>
+				<div class="box-right">
+					<div class="box-title clamp">
+						{{ item.title }}
+					</div>
+					<div class="box-time">
+						{{ item.time }}
+					</div>
+					<div class="box-main">
+						{{ item.synopsis }}
+					</div>
+				</div>
+			</div>
+			<div class="box-bottom">
+				<div class="bottom-font">
+					作者:{{ item.author }}
+				</div>
+				<div class="bottom-font">
+					{{ item.time }}
+				</div>
+				<div class="bottom-font">
+					阅读量:{{ item.visit }}
+				</div>
+			</div>
+		</div>
+		<div class="page">
+			<el-pagination layout="prev, pager, next" :total="total" background prev-text="上一页" next-text="下一页" @current-change="currentChange" :page-size="3" hide-on-single-page></el-pagination>
+		</div>
+	</div>
+</template>
+
+<script>
+import { caseslist } from '@/api/index.js';
+import { getTime } from '../assets/js/time.js'
+export default {
+	data() {
+		return {
+			newList: [],
+			total: 0,
+			page: 1,
+			limit: 3
+		};
+	},
+	filters: {
+		
+	},
+	created() {
+		this.getList()
+	},
+	methods:{
+		navTo(url) {
+			this.$router.push(url);
+		},
+		currentChange(e) {
+			this.page = e
+			this.getList()
+		},
+		getList() {
+			let obj = this
+			
+			caseslist({
+				page: obj.page,
+				limit: obj.limit
+			}).then(res => {
+				res.data.list.forEach(data => {
+					data.time = getTime(data.createtime)
+				})
+				obj.newList = res.data.list
+				obj.total = res.data.count
+			})
+		}
+	}
+};
+</script>
+
+<style lang="scss" scoped>
+.new-list {
+	max-width: 1200px;
+	min-width: 1080px;
+	margin: 0 auto;
+	padding-bottom: 20px;
+	min-height: 500px;
+}
+.boxs {
+	width: 80%;
+	margin: 30px auto 0;
+	.box-bottom {
+		padding: 10px;
+		width: 100%;
+		display: flex;
+		justify-content: space-between;
+		.bottom-font {
+			font-size: 16px;
+			color: #E0E2E4;
+		}
+	}
+}
+
+.box {
+	width: 100%;
+	display: flex;
+	justify-content: space-between;
+	.box-left {
+		flex-shrink: 0;
+		width: 250px;
+		height: 150px;
+		// background-color: #000066;
+		img{
+			width: 100%;
+			height: 100%;
+		}
+	}
+	.box-right {
+		max-width: 70%;
+		min-width: 70%;
+		padding: 10px;
+		.box-title {
+			font-size: 20px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			color: #535962;
+		}
+		.box-time {
+			font-size: 16px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			color: #A1A1A1;
+			margin-top: 10px;
+		}
+		.box-main {
+			max-width: 100%;
+			min-width: 100%;
+			font-size: 18px;
+			margin-top: 10px;
+			font-family: Adobe Heiti Std;
+			font-weight: normal;
+			height: 70px;
+			word-wrap: break-word;
+			word-break: break-all;
+			overflow: hidden;
+		}
+	}
+}
+.mpBoxTitle{
+	display: flex;
+	align-items: center;
+	height: 50px;
+	position: relative;
+	margin-top: 30px;
+	.border{
+		height: 1px;
+		width: 100%;
+		background-color: #E0E2E4;
+	}
+	.mpBoxTitleBox{
+		position: absolute;
+		top: 0;
+		left: 0;
+		width: 100%;
+		height: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		.titleText{
+			background-color: #FFFFFF;
+			font-size: 26px;
+			padding:  30px;
+			font-weight: bold;
+		}
+	}
+}
+.page {
+	width: 80%;
+	margin: 20px auto 0;
+}
+</style>

+ 19 - 21
src/views/test.vue

@@ -3,7 +3,7 @@
 		<div class="swiper-item">
 			<div class="form">
 				<div class="form-item">
-					<div class="form-left">姓名:</div>
+					<div class="form-left"><span>*</span>姓名:</div>
 					<div class="form-right"><el-input class="list-input" v-model="name" type="text" placeholder="请填写姓名"></el-input></div>
 				</div>
 				<div class="form-item">
@@ -11,11 +11,11 @@
 					<div class="form-right"><el-input class="list-input" v-model="address" type="text" placeholder="请填写详细地址"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">联系电话:</div>
-					<div class="form-right"><el-input class="list-input" v-model="telephone" type="number" placeholder="请填写联系电话"></el-input></div>
+					<div class="form-left"><span>*</span>联系电话:</div>
+					<div class="form-right"><el-input class="list-input" v-model="telephone" type="text" placeholder="请填写联系电话"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">生产线类型:</div>
+					<div class="form-left"><span>*</span>生产线类型:</div>
 					<div class="form-right">
 						<el-select class="list-input" v-model="line_type" placeholder="请选择生产类型">
 							<el-option v-for="item in options" :key="item.value" :label="item.value" :value="item.value"></el-option>
@@ -23,23 +23,23 @@
 					</div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">生产线数量:</div>
+					<div class="form-left"><span>*</span>生产线数量:</div>
 					<div class="form-right"><el-input class="list-input" v-model="line_num" type="number" placeholder="请填写生产线数量"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">目前用水量(吨/小时):</div>
+					<div class="form-left"><span>*</span>目前用水量(吨/小时):</div>
 					<div class="form-right"><el-input class="list-input" v-model="water_using" type="number" placeholder="请填写目前用水量"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">工作时长(小时):</div>
+					<div class="form-left">工作时长(小时):</div>
 					<div class="form-right"><el-input class="list-input" v-model="day_work_times" type="number" placeholder="默认为12小时"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">年工作日数:</div>
+					<div class="form-left">年工作日数(天):</div>
 					<div class="form-right"><el-input class="list-input" v-model="year_work_day" type="number" placeholder="默认为330日"></el-input></div>
 				</div>
 				<div class="form-item">
-					<div class="form-left">废水处理成本(元/吨):</div>
+					<div class="form-left"><span>*</span>废水处理成本(元/吨):</div>
 					<div class="form-right"><el-input class="list-input" v-model="deal_cost" type="number" placeholder="请填写废水处理成本"></el-input></div>
 				</div>
 			</div>
@@ -129,12 +129,6 @@ export default {
 				});
 				return;
 			}
-			if (!obj.address) {
-				obj.$alert('请填写详细地址', '提示', {
-					confirmButtonText: '确定'
-				});
-				return;
-			}
 			if (!obj.telephone) {
 				obj.$alert('请填写联系电话', '提示', {
 					confirmButtonText: '确定'
@@ -173,7 +167,7 @@ export default {
 				});
 				return;
 			}
-			console.log('’提交');
+			
 			formBaoCun({
 				name: obj.name,
 				address: obj.address,
@@ -185,7 +179,7 @@ export default {
 				year_work_day: obj.year_work_day,
 				deal_cost: obj.deal_cost
 			}).then(e => {
-				console.log(e, '请求成功');
+				
 				obj.isshow = true;
 				obj.num1 = '';
 				obj.num2 = '';
@@ -205,13 +199,11 @@ export default {
 				// this.num2 = this.water_using * 0.7;
 				obj.num1 = parseFloat(obj.water_using * 0.3).toFixed(2);
 				obj.num2 = parseFloat(obj.water_using * 0.7).toFixed(2);
-				console.log('this.num1', obj.num1);
+				
 				// 节约的水量=目前用水量—改造后的用水量
 				obj.savaWater1 = obj.water_using - obj.num1;
 				obj.savaWater2 = obj.water_using - obj.num2;
-				console.log('this.savaWater1', obj.savaWater1);
-				console.log('this.day_work_times', obj.day_work_times);
-				console.log('this.deal_cost', obj.deal_cost);
+				
 				// 经济效益=节约的水量X年工作时长(小时)X废水处理成本
 				obj.num3 = parseFloat((obj.savaWater1 * 3960 * obj.deal_cost) / 10000).toFixed(2);
 				obj.num4 = parseFloat((obj.savaWater2 * 3960 * obj.deal_cost) / 10000).toFixed(2);
@@ -226,6 +218,9 @@ export default {
 
 <style lang="scss">
 .jieshui_box {
+	max-width: 1180px;
+	min-width: 1060px;
+	margin: 0 auto ;
 	.recommend1 {
 		width: 100%;
 		display: flex;
@@ -278,6 +273,9 @@ export default {
 				font-size: 22px;
 				width: 230px;
 				flex-shrink: 0;
+				span {
+					color: #EF2F27;
+				}
 			}
 
 			.form-right {

+ 5 - 3
vue.config.js

@@ -1,8 +1,8 @@
 'use strict'
 const path = require('path')
 const port = process.env.port || process.env.npm_config_port || 9527 // dev port
-module.exports = {
-	publicPath: '/',
+const options = {
+	publicPath: '/index',
 	outputDir: 'dist',
 	indexPath: process.env.NODE_ENV === 'development' ? 'mer.html' : 'index.html',
 	lintOnSave: process.env.NODE_ENV === 'development',
@@ -16,7 +16,7 @@ module.exports = {
 		},
 		"proxy": {
 			"/apis": {
-				"target": "http://tianli.liuniu946.com/apis", //请求的目标域名
+				"target": "http://wap.tianlicn.cn/apis", //请求的目标域名
 				"changeOrigin": true,
 				// "secure": false,
 				"pathRewrite": {
@@ -27,3 +27,5 @@ module.exports = {
 	}
 
 }
+process.env.BASE_URL = options.publicPath;
+module.exports = options