<template>
	<view class="fabric-out-page">
		<OrderStatusBar class="fabric-out-mt32" :status="displayAuditStatus" :name="displayAuditStatusName" />

		<view class="flex-white-plr26 ptb10 bdb_f5">
			<text class="mr26">出仓单号</text>
			<text>{{ form.order_no }}</text>
		</view>
		<view class="flex-white-plr26 ptb20 bdb_f5">
			<text class="mr26">出仓类型</text>
			<text>{{ getBillTypeName() }}</text>
		</view>
		<view class="flex-white-plr26 ptb20 bdb_f5">
			<text class="mr26">染厂</text>
			<text>{{ form.business_unit_name || '-' }}</text>
		</view>
		<view class="flex-white-plr26 ptb20 bdb_f5">
			<text class="mr26">{{ dateLabel }}</text>
			<text>{{ form.delivery_time }}</text>
		</view>
		<view class="flex-white-plr26 ptb20 bdb_f5">
			<text class="mr26">单据备注</text>
			<text>{{ form.remark || '-' }}</text>
		</view>

		<FabricOutDetailList
			:list="form.item_data"
			@fabric-info="openFabricInfo"
			@fine-code="openFineCode"
		>
			<FabricOutScanBar
				slot="before-list"
				:can-scan="canScan"
				:value="QRBarCode"
				:delete-mode="BarCodeDelStatus"
				:message="BillDataMessage"
				:show-phone-scan="usePhoneScanFallback"
				@input="QRBarCode = $event"
				@scan="handleScan"
				@phone-scan="handlePhoneScan"
				@delete-mode-change="BarCodeDelChange"
			/>
			<FabricOutScanDetail
				slot="before-list"
				:detail="scanDetail"
				:item-data="form.item_data"
				:group-keys="scanGroupKeys"
				@group-change="scanGroupKeys = $event"
			/>
		</FabricOutDetailList>

		<FabricOutFooter :buttons="statusActionButtons" @action="handleStatusAction" />

		<u-select v-model="selectShow" :list="selectList" @confirm="selectConfirmFun"></u-select>
		<FabricInfoPopup :show.sync="fabricInfoShow" :data="currentFabricInfo" />
		<FineCodePopup :show.sync="fineCodeShow" :list="currentFineCodes" :readonly="false" @delete="onDeleteFineCode" />
	</view>
</template>

<script>
import formMixin from './storeFabricBusinessOutMixin.js';
import FabricInfoPopup from '@/components/storefabric/FabricInfoPopup.vue';
import FineCodePopup from '@/components/storefabric/FineCodePopup.vue';
import OrderStatusBar from '@/components/storefabric/OrderStatusBar.vue';
import FabricOutDetailList from '@/components/storefabric/FabricOutDetailList.vue';
import FabricOutScanBar from '@/components/storefabric/FabricOutScanBar.vue';
import FabricOutScanDetail from '@/components/storefabric/FabricOutScanDetail.vue';
import FabricOutFooter from '@/components/storefabric/FabricOutFooter.vue';

export default {
	components: {
		FabricInfoPopup,
		FineCodePopup,
		OrderStatusBar,
		FabricOutDetailList,
		FabricOutScanBar,
		FabricOutScanDetail,
		FabricOutFooter,
	},
	mixins: [formMixin],
	onLoad(e) {
		uni.setNavigationBarTitle({ title: '编辑坯布出仓单' });
		this.pageMode = 'edit';
		if (e.id) {
			this.loadOrder(Number(e.id), { rejectIfLocked: true });
		}
	},
};
</script>

<style lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
page {
	background-color: #F8F8F8;
	padding-bottom: 260rpx;
}
</style>
