forestry-wx/src/plant/models/warehouseCard/medicine-card.vue

<template>
    <view class="d-flex j-sb a-c li-item-head">
        <view class="li-left-tag" :class="{ [`bg-instore-${item?.instoreBizInfo?.processType}`]: true }">{{ selectDictLabel(st_medicine_process_type, item?.instoreBizInfo?.processType) }}</view>
        <view v-if="isInstoreDate" class="f-s-22 c-#666 mr-24"> 
            {{ getDateRangeFrt(item?.instoreBizInfo?.processingDate, item?.instoreBizInfo?.processingDateEnd) }}
            <span>包装</span>
        </view>
    </view>
    <view class="pd-20">
        <view class="d-flex flex1">
            <view class="flex1">
                <span class="f-s-34 c-#333 f-w-500 mr-10">{{ item?.instoreBizInfo?.proName }}</span>
                <span v-if="item?.instoreBizInfo?.proLevel" class="f-s-24 c-#666">{{ item?.instoreBizInfo?.proLevel }}</span>
            </view>
            <view>
                <view v-if="item?.examinReport?.length" class="tag-span c-primary bg-#EBF6EE">已检验</view>
                <view v-else class="tag-span c-danger bg-#F9ECEA">未检验</view>
            </view>
        </view>
        <view v-if="item?.instoreBizInfo?.proSpecn" class="f-s-24 c-#666">{{ item?.instoreBizInfo?.proSpecn }}</view>
        <view class="pd2-4-0 f-s-28">
            <span class="c-#666">生产批号：</span>
            <span class="c-#333 f-w-500">{{ item?.batchCode || '-' }}</span>
        </view>
        <view class="pd2-4-0 f-s-28">
            <span class="c-#666">执行标准：</span>
            <span class="c-#333 f-w-500">{{ item?.instoreBizInfo?.standardName || '-' }}</span>
        </view>
        <view class="pd2-4-0 f-s-28">
            <span class="c-#666">加工工艺：</span>
            <span class="c-#333 f-w-500">{{ item?.instoreBizInfo?.ptech || '-' }}</span>
        </view>
        <view class="pd2-4-0 f-s-28">
            <span class="c-#666">入库量：</span>
            <span class="c-#333 f-w-500">{{ item?.capacity }}{{ item?.unit }}</span>
        </view>
        <view class="d-flex">
            <view v-if="item?.inputAmount" class="pd2-4-0 f-s-28 flex1">
                <span class="c-#666">出库量：</span>
                <span class="c-#333 f-w-500">{{ item?.inputAmount || '0' }}{{ item?.unit }}</span>
            </view>
            <view v-if="item?.restAmount" class="pd2-4-0 f-s-28 flex1">
                <span class="c-danger">剩余量：</span>
                <span class="c-danger f-w-500">{{ item?.restAmount || '0' }}{{ item?.unit }}</span>
            </view>
        </view>
        <slot></slot>
    </view>
</template>
<script setup lang="ts" name="MedicineCard">
import { selectDictListClass } from '@/utils/ruoyi';
import { getStorageRoomNames } from '@/utils/common';
// 种源展示卡片
const props = defineProps({
    item: {
        type: Object,
        default: () => ({}),
    },
    dict: {
        type: Object,
        default: () => ({}),
    },
    isInstoreDate: {
        type: Boolean,
        default: true,
    },
});
const { st_medicine_process_type } = toRefs<any>(props.dict);
</script>
<style lang="scss" scoped>
.li-left-tag {
    padding: 6rpx 16rpx;
    color: #fff;
    border-radius: 16rpx 0 16rpx 0;
    font-size: 20rpx;
    font-weight: 500;
}
.tag-span {
    padding: 4rpx 12rpx;
    font-size: 20rpx;
    border-radius: 18rpx;
}
</style>