app-station-control-frontend_v1/components/PublicTable/PublicTable.vue

<template>
	<uni-table ref="table" :loading="loading" border stripe emptyText="暂无更多数据">
		<uni-tr class="headerFix">
			<uni-th width="120" align="center">车牌号</uni-th>
			<uni-th width="144">车辆识别码(VIN码)</uni-th>
			<uni-th width="160">前端电池距离(CM)</uni-th>
			<uni-th width="142">创建时间</uni-th>
			<uni-th width="142">来源</uni-th>
			<uni-th width="142">状态</uni-th>
			<uni-th align="center" width="148">操作</uni-th>
		</uni-tr>
		<uni-tr v-for="(item, index) in tableData" :key="index">
			<uni-td width="120" align="center">{{ item.date }}</uni-td>
			<uni-td width="144" align="center">{{ item.name }}</uni-td>
			<uni-td width="160">{{ item.name }}</uni-td>
			<uni-td width="142">{{ item.name }}</uni-td>
			<uni-td width="142">{{ item.name }}</uni-td>
			<uni-td width="142">{{ item.name }}</uni-td>
			<uni-td width="150">
				<view class="uni-group">
					<view class="editbtn">编辑</view>
					<view class="editbtn">删除</view>
				</view>
			</uni-td>
		</uni-tr>
	</uni-table>
</template>

<script>
	export default {
		name: "PublicTable",
		props: ['loading', 'tableData'],
		data() {
			return {

			};
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
	.editbtn {
		color: #91FDB9;
	}

	.tableHeader {
		display: flex;
	}

	.uni-group {
		display: flex;
		align-items: center;
		justify-content: center;

		view:first-child {
			margin-right: 15px;
		}
	}

	.uni-container {
		margin-top: 16px;
		height: 480px;
		padding-top: 46px;
		box-sizing: border-box;
	}
	
	::v-deep .uni-table-scroll {
		width: 998px;
		height: 100%;
	}

	.headerFix {
		position: fixed;
		left: 241px;
		z-index: 1;
		top: 224px;
	}
	::v-deep .table--border{
		border: none !important;
	}
	::v-deep .uni-table {
		background: none;

		.empty-border {
			border: none;
			height: 80px;
			line-height: 80px;
		}

		.uni-table-th {
			height: 46px;
			background: #1D283E;
			box-shadow: 0px 1px 0px 0px #2F3C86;
			font-weight: 600;
			color: #FFFFFF;
			font-size: 14px;
		}

		.uni-table-td {
			font-weight: 400;
			color: #FFFFFF;
			font-size: 14px;
			height: 46px;
			line-height: 38px;
		}

		.uni-table-tr:nth-child(n + 2):hover {
			background-color: #1e2f36;
		}
	}

	::v-deep .table--stripe .uni-table-tr:nth-child(2n + 3) {
		background-color: #141B2B;
		box-shadow: 0px 1px 0px 0px #292D46, 0px -1px 0px 0px #292D46;
	}
</style>