94 lines
2.4 KiB
Vue
94 lines
2.4 KiB
Vue
<template>
|
||
<view>
|
||
<view v-if="canScan" class="flex-white-plr26 ptb20 bdb_f5 fabric-out-scanRow process-in-binRow">
|
||
<text class="mr26 process-in-binLabel">仓位<text class="redXingh">*</text></text>
|
||
<input
|
||
type="text"
|
||
:value="code"
|
||
class="fabric-out-scanInput"
|
||
placeholder="请先扫描仓位"
|
||
@input="$emit('code-input', $event.detail.value)"
|
||
@confirm="$emit('confirm')"
|
||
/>
|
||
<text v-if="name" class="process-in-binName">{{ name }}</text>
|
||
<view
|
||
v-if="showPhoneScan && scanning"
|
||
class="fabric-out-scanClose"
|
||
@click.stop="$emit('phone-scan')"
|
||
>关闭扫码</view>
|
||
<u-icon
|
||
v-else-if="showPhoneScan"
|
||
class="fabric-out-phoneScanIcon"
|
||
name="scan"
|
||
size="44"
|
||
color="#2979ff"
|
||
@click="$emit('phone-scan')"
|
||
/>
|
||
<text v-if="binId" class="process-in-binClear" @click="$emit('clear')">更换</text>
|
||
</view>
|
||
<view v-else-if="showDisabledTip" class="fabric-out-scanTip">{{ disabledTip }}</view>
|
||
<view v-if="canScan && !binId" class="fabric-out-scanTip">请先扫描仓位，再扫描布匹二维码</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
props: {
|
||
canScan: { type: Boolean, default: false },
|
||
binId: { type: [Number, String], default: 0 },
|
||
code: { type: String, default: '' },
|
||
name: { type: String, default: '' },
|
||
showPhoneScan: { type: Boolean, default: false },
|
||
scanning: { type: Boolean, default: false },
|
||
showDisabledTip: { type: Boolean, default: true },
|
||
disabledTip: { type: String, default: '请先提交保存后再扫仓位' },
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
@import '@/pages/storefabric/storeFabricBusinessOutPage.scss';
|
||
@import '@/common/pda-typography.scss';
|
||
|
||
.process-in-binRow {
|
||
background: #fff;
|
||
}
|
||
.process-in-binLabel {
|
||
flex-shrink: 0;
|
||
}
|
||
.fabric-out-phoneScanIcon {
|
||
margin-left: 16rpx;
|
||
flex-shrink: 0;
|
||
}
|
||
.fabric-out-scanClose {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-left: 8rpx;
|
||
padding: 0 16rpx;
|
||
height: 72rpx;
|
||
border-radius: 8rpx;
|
||
border: 1rpx solid #2979ff;
|
||
background: #eaf2ff;
|
||
color: #2979ff;
|
||
font-size: $pda-font-action;
|
||
flex-shrink: 0;
|
||
white-space: nowrap;
|
||
}
|
||
.process-in-binName {
|
||
margin-left: 12rpx;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
max-width: 200rpx;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.process-in-binClear {
|
||
margin-left: 16rpx;
|
||
font-size: 28rpx;
|
||
color: #2979ff;
|
||
flex-shrink: 0;
|
||
}
|
||
</style>
|