调整table

pages/index/index.vue

@@ -178,15 +178,29 @@
 
 		<!-- 项目运营表格 -->
 		<view class="table-container">
-			<text class="table-title">项目运营情况</text>
-			<uni-table :data="currentData.tableData" border stripe emptyText="暂无数据">
-				<uni-tr>
-					<uni-th align="center">项目</uni-th>
-					<uni-th align="center">区域</uni-th>
-					<uni-th align="center">销售额</uni-th>
-					<uni-th align="center">增长率</uni-th>
-				</uni-tr>
-			</uni-table>
+			<text class="table-title">模拟老板运营情况</text>
+			<view class="table-scroll">
+				<uni-table 
+					:data="currentData.tableData" 
+					border
+					stripe
+					:loading="loading"
+					emptyText="暂无数据"
+				>
+					<uni-tr>
+						<uni-th align="center" width="80">模拟老板</uni-th>
+						<uni-th align="center" width="50">区域</uni-th>
+						<uni-th align="center" width="50">销售额</uni-th>
+						<uni-th align="center" width="50">增长率</uni-th>
+					</uni-tr>
+					<uni-tr v-for="(item, index) in currentData.tableData" :key="index">
+						<uni-td>{{ item.project }}</uni-td>
+						<uni-td>{{ item.area }}</uni-td>
+						<uni-td>{{ item.sales }}</uni-td>
+						<uni-td>{{ item.growth }}</uni-td>
+					</uni-tr>
+				</uni-table>
+			</view>
 		</view>
 	</view>
 </template>
@@ -201,7 +215,7 @@ import { uniIcons } from '@dcloudio/uni-ui'
 	},
 		data() {
 			return {
-			loading: false,
+			loading: true,
 			activeTime: 'today',
 			myChart: null,
 			sortType: 'receivable',
@@ -374,6 +388,9 @@ import { uniIcons } from '@dcloudio/uni-ui'
 	mounted() {
 		this.initChart()
 		this.$nextTick(() => {
+			if (this.currentData.tableData && this.currentData.tableData.length > 0) {
+				this.loading = false
+			}
 			this.sortChart('receivable')
 			window.addEventListener('resize', this.onResize)
 		})
@@ -1015,20 +1032,26 @@ import { uniIcons } from '@dcloudio/uni-ui'
 		}
 		
 		.table-container {
+			display: block;
 			background-color: #fff;
-			padding: 15px;
 			border-radius: 8px;
+			overflow-x: hidden;
+	
 			
 			.table-title {
 				display: block;
 				font-size: 16px;
 				font-weight: bold;
+				color: #333;
 				margin-bottom: 12px;
+				padding: 15px 15px 0px 15px;
 			}
 			
-			uni-th, uni-td {
-				padding: 12px !important;
-				text-align: center !important;
+			.table-scroll {
+				display: block;
+				width: 100%;
+				overflow-x: auto;
+				-webkit-overflow-scrolling: touch;
 			}
 		}
 	}