subject_gxj/xj_project_app/pages/overdue/startData/index.vue

<template>
	<view class="container">
		<view class="back-btn" @click="backToBefore()">
			<u-icon name="arrow-left" color="#fff" size="20" customStyle="margin:0 auto"></u-icon>

			<text class="back-text">项目开工资料</text>
		</view>

		<view class="table-area">
			<uni-table stripe emptyText="暂无更多数据">
				<uni-tr>
					<uni-th width="100" align="center">工作说明</uni-th>
					<uni-th width="100" align="center">办理状态</uni-th>
					<uni-th width="100" align="center">批复单位</uni-th>
					<uni-th width="100" align="center">计划日期</uni-th>
					<uni-th width="100" align="center">实际批复</uni-th>
					<uni-th width="100" align="center">批复文号</uni-th>
					<uni-th width="200" align="center">附件</uni-th>
				</uni-tr>

				<uni-tr v-for="(item, index) in tableData" :key="index">
					<uni-td align="center">{{ item.sysName || "--" }}</uni-td>
					<uni-td align="center">{{ item.statusName || "--" }}</uni-td>
					<uni-td align="center">{{ item.subUnitName || "--" }}</uni-td>
					<uni-td align="center">{{ item.datePlan || "--" }}</uni-td>
					<uni-td align="center">{{ item.dateConfirm || "--" }}</uni-td>
					<uni-td align="center">{{ item.apprNo || "--" }}</uni-td>
					<uni-td align="center">{{ item.fileName || "--" }}</uni-td>
				</uni-tr>
			</uni-table>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'

	import {
		onLoad
	} from "@dcloudio/uni-app"

	import {
		getProjectInfoDetail,
	} from "@/api/work/projectInfo.js"

	function backToBefore() {
		uni.navigateBack({})
	};

	let tableData = ref([{
		startDate: '2023-06-20',
		endDate: '2023-06-20',
		status: 'sdfasdfasfd',
		planStatus: 'new'
	}, {
		startDate: '2023-06-20',
		endDate: '2023-06-20',
		status: 'sdfasdfasfd',
		planStatus: 'wait'
	}, {
		startDate: '2023-06-20',
		endDate: '2023-06-20',
		status: 'sdfasdfasfd',
		planStatus: 'done'
	}])

	onLoad((option) => {
		getProjectInfoDetail({
			subId: option.id
		}).then(res => {
			tableData.value = res.data.kgsp[2]
		})
	})
</script>

<style lang="scss" scoped>
	page {
		height: 100%;
		background-color: #EAF0FA;
	}

	.container {
		position: relative;
		width: 100%;
		height: 100%;
		background: linear-gradient(180deg, #1869F6 0%, #EAF0FA 64%, #EAF0FA 100%);

		.back-btn {
			position: absolute;
			top: 8%;
			left: 4%;
			display: flex;
			font-size: 40rpx;
			font-weight: 500;
			color: #FFF;

			.back-text {
				margin-left: 28rpx;
			}
		}

		.table-area {
			position: absolute;
			top: 14%;
			left: 0;
			width: 100%;
			height: 86%;
			background-color: #fff;
			border-radius: 28rpx 28rpx 0rpx 0rpx;
			overflow: hidden;
		}
	}

	::v-deep .uni-table {

		.uni-table-th,
		.uni-table-th-content {
			height: 112rpx;
			color: #343437;
			font-size: 32rpx;
			font-weight: 500;
			background-color: #EAF0FA;
		}

		.uni-table-td {
			color: #343437;
			font-size: 28rpx
		}
	}
</style>