province-uniapp-qinghai-ipad/pages/queryStatistics/emergencyInfo/storageEnterprise.vue

<!-- 应急仓储企业 -->
<template>
	<view class="formBox">
		<u-form :model="pageData" ref="uForm" label-align="right">
			<u-form-item label="原粮库房仓容(吨)" label-width="150px">
				<u-input readonly v-model="pageData.grainWarehouseCapacity" type="text" />
			</u-form-item>
			<u-form-item label="原粮油罐罐容(吨)" label-width="150px">
				<u-input readonly v-model="pageData.vegetableOilTankCapacity" type="text" />
			</u-form-item>
			<u-form-item label="成品粮库房容(吨)" label-width="150px">
				<u-input readonly v-model="pageData.finishedGrainWarehouseCapacity" type="text" />
			</u-form-item>
			<u-form-item label="成品粮油罐容(吨)" label-width="150px">
				<u-input readonly v-model="pageData.finishedOilTankCapacity" type="text" />
			</u-form-item>
			<u-form-item label="实际日运输量(吨/天)" label-width="150px">
				<u-input readonly v-model="pageData.dailyDeliveryCapacity" type="text" />
			</u-form-item>
			<u-form-item label="自有运输能力(吨)" label-width="150px">
				<u-input readonly v-model="pageData.ownTransportVehicles" type="text" />
			</u-form-item>
			<u-form-item label="自有运输车辆数(辆)" label-width="150px">
				<u-input readonly v-model="pageData.ownTransportVehicles" type="text" />
			</u-form-item>
			<u-form-item label="自有车辆日配送能力(吨)" label-width="150px">
				<u-input readonly v-model="pageData.ownVehiclesDailyDeliveryCapacity" type="text" />
			</u-form-item>
		</u-form>
		<u-scroll-list>
			<uni-table border stripe emptyText="暂无更多数据">
				<!-- 表头行 -->
				<uni-tr>
					<uni-th align="center" width="140">品种</uni-th>
					<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-th align="center">其他原粮</uni-th>
					<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-tr>
					<uni-td align="center">日库存（吨）</uni-td>
					<uni-td align="center">{{tableData.inventory.wheat}}</uni-td>
					<uni-td align="center">{{tableData.inventory.paddy}}</uni-td>
					<uni-td align="center">{{tableData.inventory.soybean}}</uni-td>
					<uni-td align="center">{{tableData.inventory.maize}}</uni-td>
					<uni-td align="center">{{tableData.inventory.otherGain}}</uni-td>
					<uni-td align="center">{{tableData.inventory.wheatFlour}}</uni-td>
					<uni-td align="center">{{tableData.inventory.riceProducts}}</uni-td>
					<uni-td align="center">{{tableData.inventory.edibleOil}}</uni-td>
					<uni-td align="center">{{tableData.inventory.otherGrainProducts}}</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">日出库量（吨）</uni-td>
					<uni-td align="center">{{tableData.delivery.wheat}}</uni-td>
					<uni-td align="center">{{tableData.delivery.paddy}}</uni-td>
					<uni-td align="center">{{tableData.delivery.soybean}}</uni-td>
					<uni-td align="center">{{tableData.delivery.maize}}</uni-td>
					<uni-td align="center">{{tableData.delivery.otherGain}}</uni-td>
					<uni-td align="center">{{tableData.delivery.wheatFlour}}</uni-td>
					<uni-td align="center">{{tableData.delivery.riceProducts}}</uni-td>
					<uni-td align="center">{{tableData.delivery.edibleOil}}</uni-td>
					<uni-td align="center">{{tableData.delivery.otherGrainProducts}}</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">日入库量（吨）</uni-td>
					<uni-td align="center">{{tableData.deposit.wheat}}</uni-td>
					<uni-td align="center">{{tableData.deposit.paddy}}</uni-td>
					<uni-td align="center">{{tableData.deposit.soybean}}</uni-td>
					<uni-td align="center">{{tableData.deposit.maize}}</uni-td>
					<uni-td align="center">{{tableData.deposit.otherGain}}</uni-td>
					<uni-td align="center">{{tableData.deposit.wheatFlour}}</uni-td>
					<uni-td align="center">{{tableData.deposit.riceProducts}}</uni-td>
					<uni-td align="center">{{tableData.deposit.edibleOil}}</uni-td>
					<uni-td align="center">{{tableData.deposit.otherGrainProducts}}</uni-td>
				</uni-tr>
				<uni-tr>
					<uni-td align="center">出库能力（吨）</uni-td>
					<uni-td align="center">{{tableData.capacity.wheat}}</uni-td>
					<uni-td align="center">{{tableData.capacity.paddy}}</uni-td>
					<uni-td align="center">{{tableData.capacity.soybean}}</uni-td>
					<uni-td align="center">{{tableData.capacity.maize}}</uni-td>
					<uni-td align="center">{{tableData.capacity.otherGain}}</uni-td>
					<uni-td align="center">{{tableData.capacity.wheatFlour}}</uni-td>
					<uni-td align="center">{{tableData.capacity.riceProducts}}</uni-td>
					<uni-td align="center">{{tableData.capacity.edibleOil}}</uni-td>
					<uni-td align="center">{{tableData.capacity.otherGrainProducts}}</uni-td>
				</uni-tr>
			</uni-table>
		</u-scroll-list>
	</view>
</template>

<script>
	export default {
		props: {
			pageData: {
				type: Object,
				required: true
			}
		},
		data() {
			return {
				tableData: {
					inventory: {}, // 日库存
					delivery: {}, // 日出库量
					deposit: {}, // 日入库量
					capacity: {} // 出库能力
				},
				varietyList: [{
						code: 1,
						key: "wheat",
						label: "小麦原粮",
					},
					{
						code: 2,
						key: "paddy",
						label: "稻谷原粮",
					},
					{
						code: 3,
						key: "soybean",
						label: "大豆原粮",
					},
					{
						code: 4,
						key: "maize",
						label: "玉米原粮",
					},
					{
						code: 5,
						key: "otherGain",
						label: "其他原粮",
					},
					{
						code: 6,
						key: "wheatFlour",
						label: "小麦粉成品粮",
					},
					{
						code: 7,
						key: "riceProducts",
						label: "大米成品粮",
					},
					{
						code: 8,
						key: "edibleOil",
						label: "食用油成品粮",
					},
					{
						code: 9,
						key: "otherGrainProducts",
						label: "其他成品粮",
					}
				]
			}
		},
		methods: {
			returnkey(code) {
				let key = "";
				this.varietyList.map((item) => {
					if (item.code == code) {
						key = item.key;
					}
				});
				return key;
			},
		},
		watch: {
			pageData: {
				handler(newVal) {
					if (newVal.bizEsStorageEnterpriseGrain.length) {
						newVal.bizEsStorageEnterpriseGrain.map(item => {
							let key = this.returnkey(item.grainVariety);
							if (item.type == 1) { // 日库存
								this.tableData.inventory[key] = item.quantity;
							} else if (item.type == 2) { // 日出库量
								this.tableData.delivery[key] = item.quantity;
							} else if (item.type == 3) { // 日入库量
								this.tableData.deposit[key] = item.quantity;
							} else { // 出库能力
								this.tableData.capacity[key] = item.quantity;
							}
						})
					}
				},
				deep: true,
				immediate: true,
			}
		}
	}
</script>

<style scoped lang="scss">
	.formBox {
		.u-form {
			margin-bottom: 30px;
			overflow: hidden;

			.u-form-item {
				float: left;
				margin-right: 10px;
				width: calc(100% / 2 - 10px);
			}
		}

		.uni-table-scroll {
			margin: 20px 0;
		}
	}
</style>