<template>
	<view>
		<view v-if="canScan" class="flex-white-plr26 ptb20 bdb_f5 fabric-out-scanRow">
			<text class="mr26">条码资料</text>
			<input
				type="text"
				:value="value"
				class="fabric-out-scanInput"
				placeholder="扫描条码"
				@input="$emit('input', $event.detail.value)"
				@confirm="$emit('scan')"
			/>
			<u-icon
				v-if="showPhoneScan"
				class="fabric-out-phoneScanIcon"
				name="scan"
				size="44"
				color="#2979ff"
				@click="$emit('phone-scan')"
			/>
			<checkbox-group @change="$emit('delete-mode-change', $event)">
				<label class="fabric-out-delCheck">
					<checkbox :checked="deleteMode" />删除
				</label>
			</checkbox-group>
		</view>
		<view v-else class="fabric-out-scanTip">{{ disabledTip }}</view>
		<view v-if="message" class="fabric-out-msgTip">{{ message }}</view>
	</view>
</template>

<script>
export default {
	props: {
		canScan: { type: Boolean, default: false },
		value: { type: String, default: '' },
		deleteMode: { type: Boolean, default: false },
		message: { type: String, default: '' },
		disabledTip: { type: String, default: '当前状态不可扫码' },
		showPhoneScan: { type: Boolean, default: false },
	},
};
</script>

<style scoped lang="scss">
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';

.fabric-out-phoneScanIcon {
	margin-left: 16rpx;
	flex-shrink: 0;
}
</style>
