pda-cli/src/pages/storefabric/storeFabricWarehouseStockList.vue

<template>
	<view class="warehouse-page">
		<view class="fabricHeader">
			<view class="fabricCode">{{ context.grey_fabric_code || '-' }}</view>
			<view class="fabricName">{{ context.grey_fabric_name || '-' }}</view>
		</view>

		<view class="filterBar">
			<u-search
				v-model="filters.machine_number"
				placeholder="机台号"
				:show-action="false"
				@search="loadList"
				@custom="loadList"
			/>
		</view>

		<view class="summaryBar">
			<text>合计：{{ totals.roll }} 匹 / {{ totals.weight }} KG（{{ totals.count }} 条）</text>
		</view>

		<scroll-view
			scroll-y
			:style="{ height: scrollHeight }"
			refresher-enabled
			:refresher-triggered="triggered"
			@refresherrefresh="onRefresh"
		>
			<dataNull
				v-if="tableContents.length === 0"
				src="/src/static/img/chahua/gjNull.png"
				title="暂无维度汇总"
				title1="请调整机台号筛选后重试"
			/>
			<view v-else class="tableBox">
				<WarehouseDataTable
					:headers="tableHeaders"
					:contents="tableContents"
					:height="tableHeight"
					@row-click="goDetail"
				/>
			</view>
		</scroll-view>
	</view>
</template>

<script>
import WarehouseDataTable from '@/components/storefabric/WarehouseDataTable.vue';
import {
	STOCK_TABLE_COLUMNS,
	buildDetailNavigateQuery,
	buildStockListQuery,
	calcTableHeight,
	fetchAllWarehouseList,
	mapStockTableRow,
	parsePageQuery,
	sumStockTotals,
	toQueryString,
} from '@/common/storeFabricWarehouse';

export default {
	components: { WarehouseDataTable },
	data() {
		return {
			list: [],
			scrollHeight: '667px',
			triggered: false,
			tableHeaders: STOCK_TABLE_COLUMNS,
			context: {
				grey_fabric_id: '',
				grey_fabric_code: '',
				grey_fabric_name: '',
				warehouse_id: '',
			},
			filters: {
				machine_number: '',
			},
		};
	},
	computed: {
		tableContents() {
			return this.list.map(mapStockTableRow);
		},
		totals() {
			return sumStockTotals(this.list);
		},
		tableHeight() {
			return calcTableHeight(this.tableContents.length, { maxPx: 9999 });
		},
	},
	onLoad(options) {
		const parsed = parsePageQuery(options || {});
		this.context = {
			grey_fabric_id: parsed.grey_fabric_id || '',
			grey_fabric_code: parsed.grey_fabric_code || '',
			grey_fabric_name: parsed.grey_fabric_name || '',
			warehouse_id: parsed.warehouse_id || '',
		};
		const title = this.context.grey_fabric_name
			? `${this.context.grey_fabric_name} 库存汇总`
			: '坯布库存汇总';
		uni.setNavigationBarTitle({ title });
		uni.getSystemInfo({
			success: (res) => {
				this.scrollHeight = `${res.windowHeight - 120}px`;
			},
		});
		if (!this.context.grey_fabric_id) {
			uni.showToast({ title: '缺少坯布参数', icon: 'none' });
			return;
		}
		this.loadList();
	},
	methods: {
		loadList() {
			const params = buildStockListQuery(this.filters, this.context);
			fetchAllWarehouseList((p) => this.$u.api.gfmWarehouse.stockSummaryList(p), params)
				.then((rows) => {
					this.triggered = false;
					this.list = rows || [];
				})
				.catch((err) => {
					this.triggered = false;
					this.list = [];
					uni.showToast({ title: err.message || '加载失败', icon: 'none' });
				});
		},
		onRefresh() {
			this.triggered = true;
			this.loadList();
		},
		goDetail(row) {
			const query = buildDetailNavigateQuery(row, this.context);
			uni.navigateTo({
				url: `./storeFabricWarehouseDetail?${toQueryString(query)}`,
			});
		},
	},
};
</script>

<style>
page { background-color: #F8F8F8; }
.warehouse-page { min-height: 100%; }
.fabricHeader { padding: 20rpx 24rpx; background: #fff; border-bottom: 1rpx solid #f0f0f0; }
.fabricCode { font-size: 30rpx; font-weight: bold; color: #333; }
.fabricName { margin-top: 8rpx; font-size: 26rpx; color: #666; }
.filterBar { padding: 16rpx 20rpx; background: #fff; }
.summaryBar {
	padding: 12rpx 24rpx;
	font-size: 26rpx;
	color: #666;
	background: #fff;
	border-top: 1rpx solid #f0f0f0;
}
.tableBox { padding: 16rpx 12rpx; }
</style>