首页切图，bug修改

src/components/headerBar/header-bar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div id="main" class="header-bar">
+  <div id="main" class="header-bar" @click="isChildMenu = false">
     <header>
       <ul class="nav">
         <!-- <div class="logo">ByteSailing</div> -->
@@ -8,7 +8,7 @@
           <el-image v-else style="width: 120px; height: 30px" :src="logoUrl" fit="scale-down" />
         </div>
         <li class="header-bar-hover-warp nav-li" :class="isChildMenu ? 'active' : ''">
-          <div @click="isChildMenu = !isChildMenu" class="menu-modal">
+          <div @click.stop="isChildMenu = !isChildMenu" class="menu-modal">
             <i class="iconfont icon-icomx_gongndh" style="margin: 0 5px 0 0"></i>
             {{$t('header.functionGuide')}}
             <i class="iconfont icon-iconm_xialan1" style="margin: 0 0 0 3px"></i>

src/views/index.vue

@@ -1,5 +1,44 @@
 <template>
 	<div class="app-container home">
+		
+		<div class="stat-warp">
+			<ul class="stat-warp" >
+				<li class="theme6">
+					<div class="label">我的待审批</div>
+					<div class="num">300</div>
+				</li>
+				<li class="theme5">
+					<div class="label">我的发起（未结束）</div>
+					<div class="num">300</div>
+				</li>
+				<li class="theme3">
+					<div class="label">未读消息</div>
+					<div class="num">3</div>
+				</li>
+			</ul>
+		</div>
+		<div class="table-warp">
+			<div class="card">
+				<div class="commons-title">
+					我的待审批
+				</div>
+			</div>
+			<div class="card">
+				<div class="commons-title">
+					业务提醒
+				</div>
+			</div>
+			<div class="card">
+				<div class="commons-title">
+					我的发起（未结束）
+				</div>
+			</div>
+			<div class="card">
+				<div class="commons-title">
+					系统公告
+				</div>
+			</div>
+		</div>
 		<!-- <byTableDemo></byTableDemo> -->
 		<!-- <el-input type="number" v-model='aaa' v-mousewheel></el-input> -->
 		<!-- 111112132131211 -->
@@ -17,14 +56,159 @@ function goTarget(url) {
 	window.open(url, '__blank')
 }
 // ​
-onMounted(() => {
-	
-})
+onMounted(() => {})
 </script>
 <style>
 </style>
 <style scoped lang="scss">
-.home {
+.app-container {
+	height: 100%;
+	.table-warp{
+		//页面全屏，占据剩下的位置
+		height: calc(100% - 157px);
+		border-radius: 5px;
+		.card{
+			width: calc(50% - 10px);
+			height: calc(50% - 10px);
+			background: #fff;
+			float: left;
+			border-radius: 5px;
+			padding:20px;
+		}
+		.card:nth-child(2n + 1){
+			margin-right: 20px;
+		}
+		.card:nth-child(1){
+			margin-bottom: 20px;
+		}
+		.card:nth-child(2){
+			margin-bottom: 20px;
+		}
+	}
+	.stat-warp {
+		margin-bottom: 20px;
+		background: #fff;
+		padding: 20px;
+		overflow: hidden;
+		position: relative;
+		border-radius: 5px;
+		.title {
+			height: 60px;
+			select {
+				height: 60px;
+				border: none;
+				outline: none;
+				-webkit-appearance: none;
+				appearance: none;
+				font-size: 14px;
+				font-weight: bold;
+				background: url('@/assets/images/sanjiao.png') no-repeat right
+					center;
+				padding-right: 20px;
+			}
+			div {
+				height: 60px;
+				font-size: 14px;
+				font-weight: bold;
+				line-height: 60px;
+			}
+		}
+		ul {
+			padding: 0;
+			overflow: hidden;
+			margin: 0;
+			li {
+				list-style: none;
+				min-width: 285px;
+				box-sizing: border-box;
+				margin-right: 20px;
+				background: #eff6ff;
+				float: left;
+				overflow: hidden;
+				padding: 20px;
+				color: #333333;
+				border-radius: 10px;
+				.label {
+					font-size: 14px;
+				}
+				.label::before {
+					width: 10px;
+					height: 10px;
+					content: '';
+					border-radius: 50%;
+					background: #0084ff;
+					display: inline-block;
+					margin-right: 10px;
+				}
+				.num {
+					margin-top: 10px;
+					font-size: 24px;
+					font-weight: bold;
+				}
+			}
+			//#F5F3FF #9E64ED
+			.theme2 {
+				background: #f5f3ff;
+				.label::before {
+					background: #9e64ed;
+				}
+			}
+			//#FFF1E1 #FF9315
+			.theme3 {
+				background: #fff1e1;
+				.label::before {
+					background: #ff9315;
+				}
+			}
+			//#E2FBE8 #39C55A
+			.theme4 {
+				background: #e2fbe8;
+				.label::before {
+					background: #39c55a;
+				}
+			}
+			.theme5 {
+				background: #ffebe9;
+				.label::before {
+					background: #f94539;
+				}
+			}
+			.theme6 {
+				background: #e4f9f9;
+				.label::before {
+					background: #53cbcb;
+				}
+			}
+			.multi-data {
+				.label::before {
+					display: none;
+				}
+				.label {
+					font-size: 14px;
+					font-weight: bold;
+					color: #333;
+					margin-bottom: 8px;
+				}
+				.num-warp {
+					overflow: hidden;
+					.num-box {
+						float: left;
+						min-width: 80px;
+						margin-right: 20px;
+						.num-small {
+							font-size: 16px;
+							font-weight: bold;
+							margin-bottom: 8px;
+						}
+						.label-small {
+							color: #666;
+							font-size: 14px;
+						}
+					}
+				}
+			}
+		}
+	}
 }
 </style>
 

src/views/product/product/index.vue

@@ -545,6 +545,7 @@ const submitForm = () => {
         getList();
       },
       (err) => {
+        formData.data.standardJson = JSON.parse(formData.data.standardJson);
         submitLoading.value = false;
       }
     );