86 lines
1.7 KiB
Vue
86 lines
1.7 KiB
Vue
|
|
<template>
|
|||
|
|
<view class="order-context-bar">
|
|||
|
|
<view class="order-context-bar__main">
|
|||
|
|
<view class="order-context-bar__order">
|
|||
|
|
<text class="order-context-bar__label">单号</text>
|
|||
|
|
<text class="order-context-bar__value">{{ orderNo || '-' }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="order-context-bar__progress">
|
|||
|
|
已扫 {{ scannedCount }} / {{ targetCount }}
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="order-context-bar__meta">
|
|||
|
|
<text>供应商:{{ supplierName || '-' }}</text>
|
|||
|
|
<text>仓库:{{ warehouseName || '-' }}</text>
|
|||
|
|
<text class="order-context-bar__exception">异常:{{ exceptionCount }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup lang="ts">
|
|||
|
|
defineProps<{
|
|||
|
|
orderNo: string
|
|||
|
|
supplierName?: string
|
|||
|
|
warehouseName?: string
|
|||
|
|
scannedCount: number
|
|||
|
|
targetCount: number
|
|||
|
|
exceptionCount: number
|
|||
|
|
}>()
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.order-context-bar {
|
|||
|
|
padding: 20rpx 24rpx;
|
|||
|
|
border-bottom: 2rpx solid #e5e6eb;
|
|||
|
|
background: rgba(255, 255, 255, 0.96);
|
|||
|
|
|
|||
|
|
&__main,
|
|||
|
|
&__meta {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
gap: 16rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__order {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
gap: 12rpx;
|
|||
|
|
min-width: 0;
|
|||
|
|
flex: 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__label {
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
color: #86909c;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__value {
|
|||
|
|
min-width: 0;
|
|||
|
|
color: #1f2329;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__progress {
|
|||
|
|
flex-shrink: 0;
|
|||
|
|
color: #1677ff;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
font-weight: 600;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__meta {
|
|||
|
|
margin-top: 12rpx;
|
|||
|
|
color: #4e5969;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
flex-wrap: wrap;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&__exception {
|
|||
|
|
color: #d4380d;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|