fix

virgo.wzfrontend/workark/public/index.html

@@ -4,8 +4,10 @@
 		<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="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/2f7b4bfaf9e64817bc2cb46f3a632b01">
-		<title>WORKARK</title>
+		<link rel="icon" href="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/f9617c7f80da485cb3cc72b6accc62ed">
+		<title>WorkArk</title>
+		<meta name="keywords" content="workark,企业服务,项目申报,高新技术企业,专精特新,专利申报,营销推广">
+		<meta name="description" content="workark专注且专业的为企业各种申报提供相应的服务">
 		<link rel="stylesheet" type="text/css" href="<%= BASE_URL %>reset.css" />
 		<link rel="stylesheet" type="text/css" href="<%= BASE_URL %>font/font.css" />
 		<link rel="stylesheet" href="//at.alicdn.com/t/c/font_4358860_jvinmymekbm.css">

virgo.wzfrontend/workark/src/components/website/productItem.vue

@@ -1,9 +1,11 @@
 <template>
-	<div class="product-item" @click="clickItem">
-		<div class="product-item-image" :style="'background-image: url('+imageUrl(item.showPictures)+');'"></div>
-		<div class="product-content">
-			<div class="product-item-title hui-ellipsis">{{item.name}}</div>
-			<div class="space hui-ellipsis">{{item.remark}}</div>
+	<div class="product-item-box">
+		<div class="product-item" @click="clickItem">
+			<div class="product-item-image" :style="'background-image: url('+imageUrl(item.showPictures)+');'"></div>
+			<div class="product-content">
+				<div class="product-item-title hui-ellipsis">{{item.name}}</div>
+				<div class="space hui-ellipsis">{{item.remark}}</div>
+			</div>
 		</div>
 	</div>
 </template>
@@ -28,8 +30,13 @@
 </script>
 
 <style lang="scss">
+	.product-item-box {
+		width: 25%;
+		padding: 10px;
+	}
+
 	.product-item {
-		width: 275px;
+		width: 100%;
 		background: $--color-white;
 		border-radius: 8px;
 		box-sizing: border-box;
@@ -39,8 +46,7 @@
 		overflow: hidden;
 		padding: 15px;
 		box-sizing: border-box;
-		margin-right: 20px;
-		margin-bottom: 20px;
+
 
 		.product-item-image {
 			width: 100%;
@@ -52,9 +58,7 @@
 			background-position: center center;
 		}
 
-		&:nth-child(4n) {
-			margin-right: 0;
-		}
+
 
 		.product-content {
 			padding-top: 15px;

virgo.wzfrontend/workark/src/layout/components/indexNav.vue

@@ -1,216 +0,0 @@
-<template>
-	<div class="layout-title">
-		<div class="title-box">
-			<div class="title-logo" @click="$router.push('/')">
-				<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/f9617c7f80da485cb3cc72b6accc62ed"
-					alt="logo.png">
-				<div class="title-label">
-					<div class="title-name">WorkArk</div>
-					<div class="title-sub-name">SMART SERVE SYSTEM</div>
-				</div>
-			</div>
-			<div class="login" v-if="user.userId">
-				<div class="login-avatar">
-					<avatar :user="user"></avatar>
-				</div>
-				<span class="login-name">{{user.userName}}</span>
-				<span class="color-primary logout" @click="logout">退出</span>
-				<span class="admin-system" @click="$router.push('/work')">控制台</span>
-			</div>
-			<div class="login" v-else>
-				<div class="login-icon">
-					<i class="el-icon-s-custom"></i>
-				</div>
-				<span class="login-name" @click="loginFunc">登录 / 注册</span>
-				<span class="admin-system" @click="$router.push('/work')">控制台</span>
-			</div>
-		</div>
-		<el-dialog custom-class="login-custom" :close-on-click-modal="false" :visible.sync="dialogVisible"
-			:append-to-body="true">
-			<login v-if="dialogVisible" @callback="callback"></login>
-		</el-dialog>
-	</div>
-</template>
-
-<script>
-	import {
-		removeToken,
-		removeComment
-	} from '@/uitls/auth';
-	import {
-		mapGetters
-	} from 'vuex';
-	const login = () => import('./login');
-	export default {
-		data() {
-			return {
-				user: {},
-				dialogVisible: false
-			}
-		},
-		mounted() {
-			this.init();
-		},
-		methods: {
-			init() {
-				this.user = this.$store.getters.user;
-			},
-			loginFunc() {
-				this.dialogVisible = true;
-			},
-			logout() {
-				this.$confirm('是否要退出登录?', () => {
-					removeToken();
-					removeComment();
-					if (this.$store.getters.chatToken) this.$chat.disConnect();
-					if (this.$store.getters.chatTokens) this.$chats.disConnect();
-					this.$store.dispatch('app/resetState');
-					this.$message.success('退出成功');
-					this.callbackFunc();
-				});
-			},
-			callbackFunc() {
-				if (this.$route.path === '/') {
-					this.init();
-				} else {
-					this.$router.go(0);
-				}
-			},
-			callback(type) {
-				this.dialogVisible = false;
-				if (type == 'init') this.callbackFunc();
-			}
-		},
-		computed: {
-			...mapGetters(['loginVisible'])
-		},
-		watch: {
-			loginVisible(val) {
-				this.dialogVisible = true;
-			}
-		},
-		components: {
-			login
-		}
-	}
-</script>
-
-<style lang="scss">
-	.login-custom {
-		width: 440px !important;
-		height: auto !important;
-
-		.el-dialog__header {
-			display: none;
-		}
-	}
-
-	.layout-title {
-		width: 100%;
-		height: 60px;
-		z-index: 9;
-		background: $--color-white;
-		box-shadow: 0px 1px 12px rgba(3, 3, 3, 0.1);
-		position: fixed;
-		top: 0;
-		left: 0;
-
-		.title-box {
-			width: 1200px;
-			height: 100%;
-			margin: 0 auto;
-			display: flex;
-			align-items: center;
-			justify-content: space-between;
-
-		}
-
-		.title-logo {
-			display: flex;
-			align-items: center;
-
-			img {
-				width: 44px;
-				height: 44px;
-				margin-right: 10px;
-				cursor: pointer;
-			}
-
-		}
-
-		.title-label {
-			width: 150px;
-			cursor: pointer;
-		}
-
-		.title-name {
-			font-size: 16px;
-			line-height: 22px;
-			font-weight: 500;
-		}
-
-		.title-sub-name {
-			font-size: 12px;
-			transform: scale(.68) translateX(-32px);
-			opacity: .75;
-		}
-
-		.location {
-			border: 2px solid #fff;
-			border-radius: 26px;
-			height: 26px;
-			padding: 0 10px;
-			display: flex;
-			align-items: center;
-			cursor: pointer;
-		}
-
-		.location-name {
-			font-size: 12px;
-			margin-left: 3px;
-		}
-
-		.login {
-			display: flex;
-			align-items: center;
-		}
-
-		.logout {
-			font-size: 12px;
-			margin-left: 5px;
-			cursor: pointer;
-		}
-
-		.login-avatar {
-			width: 32px;
-			height: 32px;
-			border-radius: 32px;
-			margin-right: 10px;
-			overflow: hidden;
-		}
-
-		.login-icon {
-			width: 32px;
-			height: 32px;
-			border: 2px solid #fff;
-			border-radius: 32px;
-			text-align: center;
-			line-height: 32px;
-
-			.el-icon-s-custom {
-				font-size: 20px;
-			}
-		}
-
-		.login-name {
-			cursor: pointer;
-			font-weight: 500;
-		}
-
-		.admin-system {
-			margin-left: 20px;
-			cursor: pointer;
-			font-weight: 500;
-		}
-	}
-</style>

virgo.wzfrontend/workark/src/layout/components/login.vue

@@ -2,7 +2,7 @@
 	<div class="website-login-box">
 		<div class="login-box">
 			<div class="close-icon-box">
-				<i class="el-icon-circle-close close-icon" @click="$emit('callback')"></i>
+				<i class="el-icon-circle-close close-icon" @click="close"></i>
 			</div>
 			<div class="login-form">
 				<div class="login-tab" :class="{
@@ -163,6 +163,10 @@
 				this.isDisabled = codeNumber == 0 ? false : true;
 				this.$store.dispatch('app/changeCodeNumber', codeNumber == 0 ? 60 : codeNumber);
 			},
+			close() {
+				if (this.loginLoading) return;
+				this.$emit('callback');
+			},
 			loginSubmit() {
 				if (this.loginLoading) return;
 				this.loginLoading = true;
@@ -193,7 +197,10 @@
 								this.$store.dispatch('app/changeMenuData', user.workarkResource ? JSON
 									.parse(user.workarkResource) : []);
 								setComment(user.workarkMenu ? user.workarkMenu : JSON.stringify([]));
-								this.successLogin()
+								this.$chat.connect();
+								setTimeout(() => {
+									this.successLogin();
+								}, 500)
 							} else {
 								this.loginLoading = false;
 							}
@@ -203,8 +210,7 @@
 					}
 				})
 			},
-			successLogin(url) {
-				this.$chat.connect();
+			successLogin() {
 				this.loginLoading = false;
 				this.$emit('callback', 'init')
 				this.$message.success('登录成功');

virgo.wzfrontend/workark/src/layout/indexLayout.vue

@@ -1,23 +1,115 @@
 <template>
 	<div class="website-layout">
-		<index-nav></index-nav>
+		<div class="layout-title">
+			<div class="title-box">
+				<div class="title-logo" @click="$router.push('/')">
+					<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/f9617c7f80da485cb3cc72b6accc62ed"
+						alt="logo.png">
+					<div class="title-label">
+						<div class="title-name">WorkArk</div>
+						<div class="title-sub-name">SMART SERVE SYSTEM</div>
+					</div>
+				</div>
+				<ul class="navbar-nav" v-if="$route.path === '/'">
+					<li class="nav-link" v-for="(item,index) in navList" :key="index" @click="navClick(item)">
+						{{item.name}}
+					</li>
+				</ul>
+				<div class="login" v-if="user.userId">
+					<div class="login-avatar">
+						<avatar :user="user"></avatar>
+					</div>
+					<span class="login-name">{{user.userName}}</span>
+					<span class="color-primary logout" @click="logout">退出</span>
+					<span class="admin-system" @click="$router.push('/work')">控制台</span>
+				</div>
+				<div class="login" v-else>
+					<div class="login-icon">
+						<i class="el-icon-s-custom"></i>
+					</div>
+					<span class="login-name" @click="loginFunc">登录 / 注册</span>
+					<span class="admin-system" @click="$router.push('/work')">控制台</span>
+				</div>
+			</div>
+		</div>
 		<keep-alive :include="['index']">
-			<router-view />
+			<router-view ref="indexPage" @navFunc="navFunc"></router-view>
 		</keep-alive>
 		<index-foot></index-foot>
+		<el-dialog custom-class="login-custom" :close-on-click-modal="false" :visible.sync="dialogVisible"
+			:append-to-body="true">
+			<login v-if="dialogVisible" @callback="callback"></login>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
-	const indexNav = () => import('./components/indexNav');
+	import {
+		removeToken,
+		removeComment
+	} from '@/uitls/auth';
+	import {
+		mapGetters
+	} from 'vuex';
+	const login = () => import('./components/login');
 	const indexFoot = () => import('./components/indexFoot');
 	export default {
 		data() {
-			return {}
+			return {
+				user: {},
+				dialogVisible: false,
+				navList: []
+			}
+		},
+		mounted() {
+			this.init();
+		},
+		methods: {
+			init() {
+				this.user = this.$store.getters.user;
+			},
+			loginFunc() {
+				this.dialogVisible = true;
+			},
+			logout() {
+				this.$confirm('是否要退出登录?', () => {
+					removeToken();
+					removeComment();
+					if (this.$store.getters.chatToken) this.$chat.disConnect();
+					if (this.$store.getters.chatTokens) this.$chats.disConnect();
+					this.$store.dispatch('app/resetState');
+					this.$message.success('退出成功');
+					this.callbackFunc();
+				});
+			},
+			callbackFunc() {
+				if (this.$route.path === '/') {
+					this.init();
+				} else {
+					this.$router.go(0);
+				}
+			},
+			callback(type) {
+				this.dialogVisible = false;
+				if (type == 'init') this.callbackFunc();
+			},
+			navClick(item) {
+				if (this.$refs.indexPage) this.$refs.indexPage.screenTo(item);
+			},
+			navFunc(list) {
+				this.navList = list;
+			}
+		},
+		computed: {
+			...mapGetters(['loginVisible'])
+		},
+		watch: {
+			loginVisible(val) {
+				this.dialogVisible = true;
+			}
 		},
-		computed: {},
 		components: {
-			indexNav,
+			login,
 			indexFoot
 		}
 	}
@@ -31,4 +123,143 @@
 		position: relative;
 		padding-top: 60px;
 	}
+
+	.login-custom {
+		width: 440px !important;
+		height: auto !important;
+
+		.el-dialog__header {
+			display: none;
+		}
+	}
+
+	.layout-title {
+		width: 100%;
+		height: 60px;
+		z-index: 9;
+		background: $--color-white;
+		box-shadow: 0px 1px 12px rgba(3, 3, 3, 0.1);
+		position: fixed;
+		top: 0;
+		left: 0;
+
+		.navbar-nav {
+			flex: 1;
+			width: 0;
+			display: flex;
+		}
+
+		.nav-link {
+			font-weight: 400;
+			font-size: 15px;
+			line-height: 21px;
+			text-align: left;
+			font-style: normal;
+			padding: 0 16px;
+			cursor: pointer;
+
+			&:hover {
+				color: $--color-primary;
+			}
+		}
+
+		.title-box {
+			width: 1200px;
+			height: 100%;
+			margin: 0 auto;
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			padding-right: 20px;
+
+		}
+
+		.title-logo {
+			display: flex;
+			align-items: center;
+
+			img {
+				width: 44px;
+				height: 44px;
+				margin-right: 10px;
+				cursor: pointer;
+			}
+
+		}
+
+		.title-label {
+			width: 150px;
+			cursor: pointer;
+		}
+
+		.title-name {
+			font-size: 16px;
+			line-height: 22px;
+			font-weight: 500;
+		}
+
+		.title-sub-name {
+			font-size: 12px;
+			transform: scale(.68) translateX(-32px);
+			opacity: .75;
+		}
+
+		.location {
+			border: 2px solid #fff;
+			border-radius: 26px;
+			height: 26px;
+			padding: 0 10px;
+			display: flex;
+			align-items: center;
+			cursor: pointer;
+		}
+
+		.location-name {
+			font-size: 12px;
+			margin-left: 3px;
+		}
+
+		.login {
+			display: flex;
+			align-items: center;
+		}
+
+		.logout {
+			font-size: 12px;
+			margin-left: 5px;
+			cursor: pointer;
+		}
+
+		.login-avatar {
+			width: 32px;
+			height: 32px;
+			border-radius: 32px;
+			margin-right: 10px;
+			overflow: hidden;
+		}
+
+		.login-icon {
+			width: 32px;
+			height: 32px;
+			border: 2px solid #fff;
+			border-radius: 32px;
+			text-align: center;
+			line-height: 32px;
+
+			.el-icon-s-custom {
+				font-size: 20px;
+			}
+		}
+
+		.login-name {
+			cursor: pointer;
+			font-weight: 500;
+		}
+
+		.admin-system {
+			margin-left: 20px;
+			cursor: pointer;
+			font-weight: 500;
+		}
+	}
 </style>

virgo.wzfrontend/workark/src/views/index.vue

@@ -31,11 +31,11 @@
 				<div class="main-sub-title">方便、快捷、精准</div>
 			</div> -->
 			<div class="product-box">
-				<div class="product-iview" v-for="item in list" :key="item.id">
+				<div class="product-iview" v-for="item in list" :key="item.id" :id="`list${item.id}`">
 					<div class="title">{{item.name}}</div>
 					<div class="product-list">
-						<product-item v-for="(node,index) in item.children" :key="index" :item="node"
-							:parent="item"></product-item>
+						<product-item v-for="(node,index) in item.children" :key="index" :item="node" :parent="item">
+						</product-item>
 					</div>
 				</div>
 			</div>
@@ -80,9 +80,26 @@
 				getServeProductList(-1).then(res => {
 					if (res.state) {
 						this.list = res.data;
+						let navList = JSON.parse(JSON.stringify(res.data));
+						// navList.push({
+						// 	name: '产品介绍',
+						// 	id: -1
+						// })
+						this.$emit('navFunc', navList);
 					}
 				})
 			},
+			screenTo(item) {
+				if (!document.getElementById('list' + item.id)) return;
+				let top = document.getElementById('list' + item.id).offsetTop;
+				if (document.getElementsByClassName('website-layout')) {
+					document.getElementsByClassName('website-layout')[0].scrollTo({
+						top: top - 40, // 纵坐标位置
+						left: 0, // 横坐标位置
+						behavior: 'smooth' // 平滑滚动效果
+					});
+				}
+			}
 		},
 		components: {
 			productItem
@@ -170,5 +187,9 @@
 			display: flex;
 			flex-wrap: wrap;
 		}
+
+		.product-iview {
+			margin-bottom: 30px;
+		}
 	}
 </style>