<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>

			<u-input disabled placeholder="保存后自动生成" v-model="form.order_no" />

		</view>

		<view class="flex-white-plr26 ptb20 bdb_f5">

			<text class="mr26">出仓类型</text>

			<view>{{ getBillTypeName() }}</view>

		</view>

		<view @click="pickerSelectFun('染厂')" class="flex-white-plr26 ptb20 bdb_f5">

			<text class="mr26">染厂<text class="redXingh">*</text></text>

			<view :class="form.business_unit_name ? '' : 'cBlack'">

				{{ form.business_unit_name || '请选择' }}

				<u-icon v-if="headerEditable" class="ml26" name="arrow-right" size="40" color="#888888"></u-icon>

			</view>

		</view>



		<view class="flex-white-plr26 ptb20 bdb_f5">

			<text class="mr26">{{ dateLabel }}<text class="redXingh">*</text></text>

			<picker mode="date" :value="form.delivery_time" :disabled="!headerEditable" @change="bindDateChange">

				<view>{{ form.delivery_time }}</view>

			</picker>

		</view>



		<view class="flex-white-plr26-column ptb20 mt32">

			<view style="margin-bottom: 8rpx;"><text>单据备注</text></view>

			<u-input v-model="form.remark" :disabled="!headerEditable" type="textarea" :border="true" :height="100" :auto-height="true" />

		</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"
				disabled-tip="请先提交保存后再扫码"
				: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

			v-if="!headerSaved"

			:buttons="[{ label: '提交保存', action: 'save' }]"

			single

			@action="submitSave"

		/>

		<FabricOutFooter

			v-else

			: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() {

		uni.setNavigationBarTitle({ title: '新增坯布出仓单' });

		this.pageMode = 'add';

		this.loadBaseDropdowns();

	},

};

</script>



<style lang="scss">

@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';

page {
	background-color: #F8F8F8;
	padding-bottom: 260rpx;
}

</style>


