bszn_xcx/components/table-dom/index.vue

<template>
	<view>
		<u-table v-if="tableList.length > 0">
			<u-tr class="u-tr">
				<u-th v-for="(item) in options" class="u-th">{{ item.label }}</u-th>
			</u-tr>
			<u-tr v-for="(row,index) in tableList" class="u-tr">
				<u-td v-for="(col,coli) in options" class="u-td">
					<view v-if="col.prop == 'menu'" class="menu" @click="view(row)">
						查看
					</view>
					<view v-else>{{ row[col['prop']] }}</view>
				</u-td>
			</u-tr>
		</u-table>
		<view v-else class="empty">
			<view>
				<view class="tip">
					<view>暂无数据</view>
				</view>
				<!-- <view @click="add" class="l_b">新增物建员</view> -->
			</view>
		</view>
	</view>
</template>
<script>
	export default {
		name: 'table-dom',
		props: {
			tableList: {
				type: Array,
				default: []
			},
			options: {
				type: Array,
				default: []
			},
		},
		methods: {
			view(row) {
				this.$emit('view', row)
			}
			// add() {
			// 	uni.navigateTo({
			// 		url: `/pages/home/detail?type=add&ldId=${this.ldId}&dyh=${this.dyh}`
			// 	})
			// }
		}
	}
</script>
<style lang="scss" scoped>
	.menu {
		color: rgba(16, 109, 255, 1);
	}

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

		.tip {
			height: 88rpx;
			width: 50vw;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.l_b {
			background-color: rgba(16, 109, 255, 1);
			border-radius: 16rpx;
			width: 50vw;
			height: 88rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			color: rgba(255, 255, 255, 1);
			font-size: 36rpx;
			font-weight: 600;
		}
	}
</style>