改样式，还有数据详情下拉没有新数据的问题

src/views/dataEntry_manage/databaseComponents/edbDetailData.vue

@@ -93,6 +93,10 @@ export default {
 		dataList:{
 			type:Array,
 			default:()=>{return []}
+		},
+		haveMore:{
+			type:Boolean,
+			default:false
 		}
 	},
 	data() {
@@ -101,11 +105,31 @@ export default {
 		};
 	},
 	methods: {
-		scrollHandle(){}
+		/* 数值滚动加载 */
+		scrollHandle: _.throttle(function() {
+			let scrollTop = this.$refs.valueUl.scrollTop;
+			let clientHeight = this.$refs.valueUl.clientHeight;
+			let scrollHeight = this.$refs.valueUl.scrollHeight;
+			if(scrollTop===0) return
+			if(scrollTop + clientHeight >= scrollHeight-10 && this.haveMore){
+				this.$emit('getNextData')
+			}
+		},200),
 	},
 };
 </script>
 
+<style lang="scss">
+.edb-detail-data-wrap{
+    .el-table--enable-row-transition .el-table__body td{
+        background: #fff !important;
+    }
+    .el-table td, .el-table th.is-leaf {
+        background: #F2F6FA !important;
+    }
+
+}
+</style>
 <style scoped lang="scss">
 .edb-detail-data-wrap{
 	display: flex;
@@ -120,6 +144,7 @@ export default {
 	.value-ul{
 		/* flex: 1;
 		overflow-y: auto; */
+        overflow-y: auto;
 	}
 }
 </style>

src/views/dataEntry_manage/databaseList.vue

@@ -254,20 +254,20 @@
 						</div>
 						<ul class="value-ul"
 							v-show="showTable&&dataList.length">
-							<li class="value-item">
-								<span>日期（频度：{{EdbData.Frequency}}）</span>
-								<span style="min-width:200px;text-align:center;">值</span>
+							<li class="value-item" style="background-color: #EBEFF6;">
+								<span style="width:240px">日期（频度：{{EdbData.Frequency}}）</span>
+								<span style="flex:1;">值</span>
 							</li>
 							<li class="value-item"
 								v-for="item in dataList.slice(0,3)"
 								:key="item.EdbDataId">
-								<span class="value-label">
+								<span class="value-label date" style="width:240px">
 									<span style="position: relative;">
 										<i class="new-tag" v-if="EdbData.LatestDate===item.DataTime"></i>
 										{{item.DataTime}}
 									</span>
 								</span>
-								<span :class="['value-label',{'predict-act': EdbData.DataInsertConfig.Date===item.DataTime}]" style="min-width:200px;text-align:center;">
+								<span :class="['value-label',{'predict-act': EdbData.DataInsertConfig.Date===item.DataTime}]" style="flex:1;">
 									<span :class="['value-style',{'predict-act': EdbData.DataInsertConfig.Date===item.DataTime}]">{{item.Value}}</span>
 								</span>
 							</li>
@@ -276,11 +276,14 @@
 					</div>
 					<div class="list" v-show="activeTab==='Data'">
 						<edb-detail-data 
+							ref="edb_detail_data"
 							:current-lang="currentLang"
 							:table-data="tableData"
 							:table-colums-one="tableColumsOne"
 							:table-colums-two="tableColumsTwo"
 							:data-list="dataList"
+							:haveMore="haveMore"
+							@getNextData="()=>{page_no++;getDataList();}"
 						/>
 					</div>
 				</div>
@@ -694,6 +697,9 @@ export default {
 				this.activeTab=''
 			}else {
 				this.activeTab='Chart'
+				this.page_no = 1
+				this.$refs.edb_detail_data.$refs.valueUl.scrollTop=0
+				console.log('scroll 置0')
 				this.initGetData();
 			}
 		},
@@ -2115,19 +2121,19 @@ export default {
 			overflow: hidden;
 			.value-ul {
 				margin-top: 10px;
-				border-bottom: 1px solid #dcdfe6;
-				max-height: calc(100vh - 495px);
-				overflow-y: auto;
+				border-bottom: 1px solid #EBEFF6;
+				//max-height: calc(100vh - 495px);
+				//overflow-y: auto;
 				.value-item {
 					/* width: 100%; */
-					padding: 14px 0;
+					padding: 10px 0;
 					border: 1px solid #dcdfe6;
 					border-bottom: none;
 					display: flex;
 					justify-content: space-around;
-					span{
-						flex: 1;
-						text-align: center;
+					>span{
+						padding:0 16px;
+						box-sizing: border-box;
 					}
 					.value-label {
 						position: relative;
@@ -2141,6 +2147,17 @@ export default {
 								color: orange;
 							}
 						}
+						&.date{
+							&::after{
+								content: '';
+								position:absolute;
+								right:0;
+								top:-14px;
+								height:calc(100% + 28px);
+								width:1px;
+								background-color: #dcdfe6;
+							}
+						}
 					}
 					.predict-act {
 						color: orange;
@@ -2226,6 +2243,7 @@ export default {
 				>.header{
 					display: flex;
 					position: relative;
+					height: 60px;
 					.el-tabs{
 						width:200px;
 						.el-tabs__header{
@@ -2238,6 +2256,8 @@ export default {
 								flex: 1;
 								text-align: center;
 								font-size: 16px;
+								height: 60px;
+								line-height: 60px;
 							}
 						}
 					}

src/views/predictEdb_manage/components/childData.vue

@@ -212,6 +212,16 @@ export default {
   },
 };
 </script>
+<style lang="scss">
+.data-wrapper {
+    .el-table--enable-row-transition .el-table__body td{
+        background: #fff !important;
+    }
+    .el-table td, .el-table th.is-leaf {
+        background: #F2F6FA !important;
+    }
+}
+</style>
 <style scoped lang="scss">
 .data-wrapper {
   .value-ul {
@@ -219,7 +229,7 @@ export default {
     border-bottom: 1px solid #dcdfe6;
     border-top: 1px solid #dcdfe6;
     /* max-height: 520px; */
-    max-height: calc(100vh - 350px);
+    max-height: calc(100vh - 430px);
     overflow-y: auto;
     .value-item {
       /* width: 100%; */

src/views/predictEdb_manage/components/edbDetail.vue

@@ -14,16 +14,16 @@
             class="value-ul"
             v-show="showData&&dataList.length"
             >
-            <li class="value-item">
-                <span>日期（频度：{{EdbData.Frequency}}）</span>
-                <span style="min-width:200px;text-align:center;">值</span>
+            <li class="value-item" style="background-color: #EBEFF6;">
+                <span style="width:240px">日期（频度：{{EdbData.Frequency}}）</span>
+                <span style="flex:1;">值</span>
             </li>
             <li
                 class="value-item"
                 v-for="item in dataList.slice(0,3)"
                 :key="item.EdbDataId"
             >
-                <span class="value-label">
+                <span class="value-label date" style="width:240px">
                     <span>
                         <i class="new-tag" v-if="EdbData.LatestDate===item.DataTime"></i>
                         {{ item.DataTime }}
@@ -31,7 +31,7 @@
                 </span>
                 <span
                     :class="['value-label',{'predict-act': item.isPredic}]"
-                    style="min-width: 200px; text-align: center"
+                    style="flex:1;"
                 >
                     <span :class="['value-style',{'predict-act': item.isPredic}]">{{item.Value}}</span>
                 </span
@@ -180,16 +180,16 @@ export default {
 <style lang="scss" scoped>
 .value-ul {
     margin-top: 10px;
-    border-bottom: 1px solid #dcdfe6;
+    border-bottom: 1px solid #EBEFF6;
     .value-item {
-        padding: 14px 0;
-        border: 1px solid #dcdfe6;
+        padding: 10px 0;
+        border: 1px solid #EBEFF6;
         border-bottom: none;
         display: flex;
         justify-content: space-around;
-        span{
-            flex: 1;
-            text-align: center;
+        >span{
+            padding:0 16px;
+            box-sizing: border-box;
         }
         .value-label {
             position: relative;
@@ -203,6 +203,17 @@ export default {
                     color: orange;
                 }
             }
+            &.date{
+                &::after{
+                    content: '';
+                    position:absolute;
+                    right:0;
+                    top:-14px;
+                    height:calc(100% + 28px);
+                    width:1px;
+                    background-color: #EBEFF6;
+                }
+            }
         }
         .predict-act {
             color: orange;

src/views/predictEdb_manage/predictEdb.vue

@@ -1374,6 +1374,7 @@ export default {
 	.detail-header{
 		display: flex;
 		position: relative;
+		height: 60px;
 		.el-tabs{
 			width:200px;
 			.el-tabs__header{
@@ -1386,6 +1387,8 @@ export default {
 					flex: 1;
 					text-align: center;
 					font-size: 16px;
+					height: 60px;
+					line-height: 60px;
 				}
 			}
 		}