<template> 
 | 
    <view class="content"> 
 | 
        <view class="order-message"> 
 | 
            <view class="content_list_item_top"> 
 | 
                <view class="content_list_item_top_left"> 
 | 
                    <text>{{ data.code }}</text> 
 | 
                </view> 
 | 
                <view class="content_list_item_top_right"> 
 | 
                    <text class="warning" v-if="data.status === 0">待入库</text> 
 | 
                    <text class="green" v-else-if="data.status === 1">已入库</text> 
 | 
                    <text class="info" v-else-if="data.status === 2">已取消</text> 
 | 
                </view> 
 | 
            </view> 
 | 
            <view class="content_list_item_content"> 
 | 
                <view class="content_list_item_content_item"> 
 | 
                    <view class="content_list_item_content_item_label">单据类型:</view> 
 | 
                    <view class="content_list_item_content_item_nr" v-if="data.billType"> 
 | 
                        {{ seeText(data.billType) }} 
 | 
                    </view> 
 | 
                </view> 
 | 
                <view class="content_list_item_content_item"> 
 | 
                    <view class="content_list_item_content_item_label">入库仓库:</view> 
 | 
                    <view class="content_list_item_content_item_nr"> 
 | 
                        {{ data.warehouseCode + ' | ' + data.warehouseName }} 
 | 
                    </view> 
 | 
                </view> 
 | 
                <view class="content_list_item_content_item"> 
 | 
                    <view class="content_list_item_content_item_label">计划入库:</view> 
 | 
                    <view class="content_list_item_content_item_nr"> 
 | 
                        {{ data.planDate }} 
 | 
                    </view> 
 | 
                </view> 
 | 
                <view class="content_list_item_content_item"> 
 | 
                    <view class="content_list_item_content_item_label">来源类型:</view> 
 | 
                    <view class="content_list_item_content_item_nr" v-if="data.originType"> 
 | 
                        {{ tyepToStr(data.originType) }} 
 | 
                    </view> 
 | 
                </view> 
 | 
                <view class="content_list_item_content_item"> 
 | 
                    <view class="content_list_item_content_item_label">来源单号:</view> 
 | 
                    <view class="content_list_item_content_item_nr"> 
 | 
                        {{ data.originCode ? data.originCode : '-' }} 
 | 
                    </view> 
 | 
                </view> 
 | 
            </view> 
 | 
        </view> 
 | 
        <!-- 转库物料 --> 
 | 
        <view class="title"> 
 | 
            <text class="title-prefix"></text> 
 | 
            <text>入出库物料</text> 
 | 
        </view> 
 | 
        <view class="material-content"> 
 | 
            <view class="item-style" v-for="(item, index) in materailArray" :key="index"> 
 | 
                <view class="item-title-style"> 
 | 
                    <text style="font-weight: 500;">{{ item.materialName + ' | ' + item.materialCode}}</text> 
 | 
                </view> 
 | 
                <view class="item-content-style"> 
 | 
                    <view class="content_list_item_content_item"> 
 | 
                        <text class="content_list_item_content_item_label">批次号:</text> 
 | 
                        <text class="content_list_item_content_item_nr">{{ item.batch || '-' }}</text> 
 | 
                    </view> 
 | 
                    <view class="content_list_item_content_item"> 
 | 
                        <text class="content_list_item_content_item_label">数量:</text> 
 | 
                        <text class="content_list_item_content_item_nr">{{ item.doneNum + item.unitName }}</text> 
 | 
                    </view> 
 | 
                    <view class="content_list_item_content_item"> 
 | 
                        <text class="content_list_item_content_item_label">工序:</text> 
 | 
                        <text class="content_list_item_content_item_nr">{{ item.procedureName || '-' }}</text> 
 | 
                    </view> 
 | 
                    <view class="content_list_item_content_item"> 
 | 
                        <view class="content_list_item_content_item_label">质量:</view> 
 | 
                        <view class="content_list_item_content_item_nr"> 
 | 
                            <text v-if="item.qualityType == 0" class="green">合格</text> 
 | 
                            <text v-else-if="item.qualityType == 1" class="yellow">不良</text> 
 | 
                            <text v-else-if="item.qualityType == 2" class="red">报废</text> 
 | 
                            <text v-else>-</text> 
 | 
                        </view> 
 | 
                    </view> 
 | 
                    <view class="content_list_item_content_item"> 
 | 
                        <text class="content_list_item_content_item_label">入库货位:</text> 
 | 
                        <text 
 | 
                            class="content_list_item_content_item_nr">{{ item.locationName ? item.locationName : '-' }}</text> 
 | 
                    </view> 
 | 
                </view> 
 | 
            </view> 
 | 
        </view> 
 | 
        <view v-if="data.status === 0" style="height:94rpx"></view> 
 | 
        <view v-if="data.status === 0" class="bottom-button"> 
 | 
            <button class="button button-cancel" @click="submit">去入库</button> 
 | 
            <!-- <button class="button button-cancel" @click="cancel">取消</button> --> 
 | 
        </view> 
 | 
    </view> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
    import { 
 | 
        orderTyepToStr 
 | 
    } from '@/util/constData.js' 
 | 
    import { 
 | 
        getBoundDetail, 
 | 
        cancelBound 
 | 
    } from '@/util/api/materialStorage' 
 | 
  
 | 
    export default { 
 | 
        data() { 
 | 
            return { 
 | 
                id: null, 
 | 
                types: [{ 
 | 
                        name: '全部', 
 | 
                        id: '', 
 | 
                        isActive: true 
 | 
                    }, 
 | 
                    { 
 | 
                        name: '采购订单', 
 | 
                        id: '0', 
 | 
                        isActive: false 
 | 
                    }, 
 | 
                    { 
 | 
                        name: '生产工单', 
 | 
                        id: '1', 
 | 
                        isActive: false 
 | 
                    }, 
 | 
                    { 
 | 
                        name: '销售订单', 
 | 
                        id: '2', 
 | 
                        isActive: false 
 | 
                    }, 
 | 
                    { 
 | 
                        name: '转库单', 
 | 
                        id: '3', 
 | 
                        isActive: false 
 | 
                    }, 
 | 
                    { 
 | 
                        name: '盘点单', 
 | 
                        id: '4', 
 | 
                        isActive: false 
 | 
                    }, 
 | 
                ], 
 | 
                data: { 
 | 
                    code: "", 
 | 
                    createName: "", 
 | 
                    planDate: "", 
 | 
                    dealDate: "", 
 | 
                    status: 0, 
 | 
                    originType: 0, 
 | 
                    originCode: "", 
 | 
                    updateName: "", 
 | 
                    updateMobile: "", 
 | 
                    updateTime: "", 
 | 
                    warehouseName: "", 
 | 
                    warehouseCode: "", 
 | 
                    outPlandate: "", 
 | 
                    inPlandate: "", 
 | 
                    woutboundDetailsWait: [], 
 | 
                    woutboundDetailsOut: [] 
 | 
                }, 
 | 
                materailArray: [] 
 | 
            }; 
 | 
        }, 
 | 
        onLoad(option) { 
 | 
            this.id = option.id 
 | 
            getBoundDetail({ 
 | 
                id: option.id 
 | 
            }) 
 | 
            .then(res => { 
 | 
                this.data = res.data 
 | 
                if (this.data.status === 1) { 
 | 
                    this.materailArray.push(...this.data.woutboundDetailsOut) 
 | 
                } else { 
 | 
                    this.materailArray.push(...this.data.woutboundDetailsWait) 
 | 
                } 
 | 
            }) 
 | 
        }, 
 | 
        methods: { 
 | 
            seeText(id) { 
 | 
                return orderTyepToStr(id) 
 | 
            }, 
 | 
            tyepToStr(type) { 
 | 
                for (const item of this.types) { 
 | 
                    if (parseInt(item.id) === this.type) { 
 | 
                        return item.name 
 | 
                    } 
 | 
                } 
 | 
                return '-' 
 | 
            }, 
 | 
            submit() { 
 | 
  
 | 
            }, 
 | 
            cancel() { 
 | 
                cancelBound({ 
 | 
                    id: this.id 
 | 
                }) 
 | 
                .then(res => { 
 | 
                    uni.showToast({ 
 | 
                        title: '取消成功', 
 | 
                        icon: 'success', 
 | 
                        duration: 2000 
 | 
                    }); 
 | 
                    uni.navigateBack({ 
 | 
                        delta: 1 
 | 
                    }); 
 | 
                }) 
 | 
                .catch(err => { 
 | 
                    uni.showToast({ 
 | 
                        title: err.message, 
 | 
                        icon: 'error', 
 | 
                        duration: 2000 
 | 
                    }); 
 | 
                }) 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</script> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
    .content { 
 | 
        background: white; 
 | 
  
 | 
        .order-message { 
 | 
            padding: 30rpx; 
 | 
            display: flex; 
 | 
            flex-direction: column; 
 | 
  
 | 
            // border-bottom: 1rpx solid #ececec; 
 | 
            .content_list_item_top { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
  
 | 
                .content_list_item_top_left { 
 | 
                    display: flex; 
 | 
  
 | 
                    // align-items: center; 
 | 
                    text { 
 | 
                        font-size: 32rpx; 
 | 
                        font-weight: 500; 
 | 
                        color: #333333; 
 | 
                    } 
 | 
                } 
 | 
  
 | 
                .content_list_item_top_right { 
 | 
                    font-size: 26rpx; 
 | 
                    font-weight: 400; 
 | 
  
 | 
                    .created { 
 | 
                        color: $nav-stateColor1 !important; 
 | 
                    } 
 | 
  
 | 
                    .warning { 
 | 
                        color: $nav-stateColor5 !important; 
 | 
                    } 
 | 
  
 | 
                    .green { 
 | 
                        color: $nav-stateColor6 !important; 
 | 
                    } 
 | 
  
 | 
                    .info { 
 | 
                        color: $nav-stateColor3 !important; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
  
 | 
            .content_list_item_content { 
 | 
                padding: 24rpx 30rpx; 
 | 
                background: #f7f7f7; 
 | 
                border-radius: 16rpx; 
 | 
                display: flex; 
 | 
                flex-wrap: wrap; 
 | 
                justify-content: space-between; 
 | 
                margin-top: 32rpx; 
 | 
  
 | 
                .content_list_item_content_item:first-child { 
 | 
                    margin-top: 0; 
 | 
                } 
 | 
  
 | 
                .content_list_item_content_item { 
 | 
                    width: 100%; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    margin-top: 24rpx; 
 | 
  
 | 
                    .content_list_item_content_item_label { 
 | 
                        font-size: 24rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #666666; 
 | 
                        flex-shrink: 0; 
 | 
                    } 
 | 
  
 | 
                    .content_list_item_content_item_nr { 
 | 
                        font-size: 24rpx; 
 | 
                        font-weight: 400; 
 | 
                        color: #222222; 
 | 
                        margin-right: 10rpx; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
  
 | 
        .title { 
 | 
            background-color: #f7f7f7; 
 | 
            padding: 30rpx; 
 | 
            font-size: 30rpx; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
  
 | 
            .title-prefix { 
 | 
                display: inline-block; 
 | 
                background-color: #4275FC; 
 | 
                height: 30rpx; 
 | 
                width: 8rpx; 
 | 
                border-radius: 1rpx; 
 | 
                margin-right: 12rpx; 
 | 
            } 
 | 
        } 
 | 
  
 | 
        .material-content { 
 | 
            padding: 30rpx; 
 | 
  
 | 
            .item-style { 
 | 
                width: initial; 
 | 
                border-bottom: 1rpx solid #ececec; 
 | 
                margin-top: 30rpx; 
 | 
  
 | 
                &:first-child { 
 | 
                    margin-top: 0 !important; 
 | 
                } 
 | 
  
 | 
                &:last-child { 
 | 
                    border: none; 
 | 
                } 
 | 
  
 | 
                .item-title-style { 
 | 
                    margin-bottom: 12rpx; 
 | 
                    font-size: 30rpx; 
 | 
                } 
 | 
  
 | 
                .item-content-style { 
 | 
                    // padding: 24rpx 30rpx; 
 | 
                    // background-color: #f7f7f7; 
 | 
                    // border-radius: 16rpx; 
 | 
                    display: flex; 
 | 
                    flex-wrap: wrap; 
 | 
                    padding-bottom: 30rpx; 
 | 
                    justify-content: space-between; 
 | 
  
 | 
                    &:last-child { 
 | 
                        padding-bottom: 0; 
 | 
                    } 
 | 
  
 | 
                    .content_list_item_content_item { 
 | 
                        width: 100%; 
 | 
                        display: flex; 
 | 
                        margin-top: 24rpx; 
 | 
  
 | 
                        .content_list_item_content_item_label { 
 | 
                            font-size: 24rpx; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                            flex-shrink: 0; 
 | 
                        } 
 | 
  
 | 
                        .content_list_item_content_item_nr { 
 | 
                            font-size: 24rpx; 
 | 
                            font-weight: 400; 
 | 
                            color: #222222; 
 | 
                            margin-right: 10rpx; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
  
 | 
        .bottom-button { 
 | 
            padding: 1rpx; 
 | 
            background-color: #f7f7f7; 
 | 
            position: fixed; 
 | 
            width: 100%; 
 | 
            bottom: 0; 
 | 
            height: 188rpx; 
 | 
            display: flex; 
 | 
            justify-content: space-between; 
 | 
  
 | 
            .button-action { 
 | 
                background: #fff; 
 | 
                color: $nav-color; 
 | 
            } 
 | 
  
 | 
            .button-cancel { 
 | 
                background: $nav-color; 
 | 
                color: #FFFFFF; 
 | 
            } 
 | 
  
 | 
            .button { 
 | 
                margin: 32rpx 32rpx 68rpx 32rpx; 
 | 
                height: 88rpx; 
 | 
                /*width: 668rpx;*/ 
 | 
                // width: 334rpx; 
 | 
                border: none; 
 | 
                border-radius: 8rpx; 
 | 
                box-shadow: 0 0 12rpx 0 rgba(0, 0, 0, 0.08); 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: center; 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |