Files
rd_mes_uniapp/components/t-sale-info/t-sale-info.vue
2025-12-18 14:11:48 +08:00

112 lines
2.0 KiB
Vue

<template>
<uni-card class="saleInfo" margin="0" padding="12px" :title="saleInfo.saleOutTaskCode || ' '">
<view class="card-list">
<view class="card-item">
<span class="card-item__label">客户编码</span>
<span class="card-item__value">{{ saleInfo.customerName || '-' }}</span>
</view>
<view class="card-item">
<span class="card-item__label">下级客户</span>
<span class="card-item__value">{{ saleInfo.dynamicField1.nextLevelCus || '-' }}</span>
</view>
</view>
<view class="card-data">
<view class="card-data-item">
<span class="card-data-item__label">扫描数量</span>
<span class="card-data-item__value finish">
{{ saleInfo.scanNumber || '-' }}
</span>
</view>
<view class="card-data-item">
<span class="card-data-item__label">总数量</span>
<span class="card-data-item__value">
{{ saleInfo.allNumber || '-' }}
</span>
</view>
</view>
</uni-card>
</template>
<script>
export default {
name: "t-sale-info",
props: {
saleInfo: {
type: Object,
default: {}
},
},
data() {
return {
};
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.saleInfo {
margin: 0 0 10px !important;
padding: 0 !important;
box-shadow: none !important;
border-radius: 11px;
.card-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 4px;
.card-item {
display: flex;
flex-direction: column;
align-items: center;
.card-item__label {
font-size: 13px;
}
.card-item__value {
font-weight: bold;
font-size: 15px;
color: #333;
}
}
}
.card-data {
display: flex;
margin-top: 4px;
background-color: #f1f1f1;
border-radius: 4px;
padding: 6px 0;
.card-data-item {
flex: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
.card-data-item__label {
font-size: 13px;
}
.card-data-item__value {
font-weight: bold;
font-size: 15px;
color: #333;
&.finish {
color: #059669;
}
}
}
}
.actions {
padding: 0 10px;
}
}
</style>