hazardousWaste_app/pages/warehousing/StockOut/components/outAway.vue

<!--点击出库单出库后的出库页面 -->
<template>
    <navigation title="出库" :back-url="backUrl"></navigation>
    <view class="contentBox">
        <!-- 技术鉴定表 -->
        <uv-form ref="formRef" class="form" :model="technicalEvaluationList" label-width="150rpx">
            <uv-form-item label="技术鉴定表" prop="fileList" @tap="toTechnical">
                <u-cell>
                    <view slot="title" class="u-slot-title">
                        <text class="u-cell-text" v-if="technicalEvaluationList">
                            {{ technicalEvaluationList?.appraisalNo }}
                        </text>
                        <text class="placeholder" v-else> 请添加技术鉴定表</text>
                        <uni-icons type="right" size="10" />
                    </view>
                </u-cell>
            </uv-form-item>
        </uv-form>
        <!-- 仓库信息 - 仓库、存储区 -->
        <warehousing-info ref="warehousingInfoRef" :warehouseInfo="warehouseInfo"
            :pathParams="{ ...pathParams, back: 'stockOut' }" />

        <!-- 物料列表 - 添加物料 -->
        <material-list ref="materialRef" :formData="formData" isEdit="5" backStr="stockOut" :pathParams="pathParams" />
        <!-- 底部操作栏 -->
        <view class="bottom">
            <uv-button type="primary" @tap="submitForm">出库</uv-button>
        </view>
    </view>
</template>

<script setup>

import _ from 'lodash';
import { ref } from 'vue';
import { onLoad } from "@dcloudio/uni-app";
import { outBoundFinish } from '@/api/stockOut';
import MaterialList from '../../../components/MaterialList.vue';
import WarehousingInfo from '../../../components/WarehousingInfo.vue';
import { onMounted } from 'vue';
import Navigation from '../../../components/Navigation.vue';
import { objectToQuery } from '../../../until';
const backUrl = ref('')
// 数据：路径参数
const pathParams = ref('')
// ref：物料绑定
const materialRef = ref([])
// ref：仓库信息绑定
const warehousingInfoRef = ref([])
// 数据：物料列表
const formData = ref([{ remark: '', material: [] }])
// 数据：仓库信息
const warehouseInfo = ref({ warehousing: {}, storageArea: {}, remark: '' })
// 技术鉴定表
const technicalEvaluationList = ref({
    appraisalNo: '',
    fileList: [],
    remark:''
})

// 数据：获取缓存信息
const getMaterialList = () => {
    // 获取仓库信息
    const warehouse = uni.getStorageSync('app_warehousing');
    warehouseInfo.value.warehousing = warehouse
    // 获取存储区信息
    const storageArea = uni.getStorageSync('app_storageArea');
    warehouseInfo.value.storageArea = storageArea
    // 获取出库单备注
    const billRemark = uni.getStorageSync('app_billRemark');
    warehouseInfo.value.remark = billRemark
    // 获取技术鉴定表数据
    const list = uni.getStorageSync('app_technical');
    technicalEvaluationList.value.appraisalNo = list.appraisalNo
    // 获取物料信息 - 有uniqueCode
    const material = uni.getStorageSync('app_material');
    formData.value.material = material
}


// 出库:提交表单
const submitForm = () => {
    const info = warehousingInfoRef.value.getWarehousingInfo()
    const materialInfo = materialRef.value.getMaterialList()
    // 过滤出已删除的物料
    const _materialInfo = _.filter(materialInfo, { isDelete: '0' })
    let params = {
        billType: '1',//0出库申请 1出库成功 2出库申请 3出库成功 4出库单已作废 5出库单已作废
        billNo: pathParams.value.billNo,
        warehouseCode: info.warehousing?.[0].deptCode || info.warehousing?.[0].deptId,
        warehouseName: info.warehousing?.[0].deptName,
        areaCode: info.storageArea?.[0].deptCode || info.storageArea?.[0].deptId,
        areaName: info.storageArea?.[0].deptName,
        remark: info.remark,
        billRemark: info.remark,
        itemList: _.map(_materialInfo, (i) => ({ ...i.material }))
    }

    outBoundFinish(params).then((res) => {
        // /pages/warehousing/stockOut/components/detail
        uni.navigateTo({
            url: backUrl.value
        });
        console.log(res, '出库单出库');
    })

}
// 数据：路径参数
onLoad((options) => {
    console.log(options, 'options', _.includes(options?.type, 'stockOut'));
    if (!options.billNo) {
        uni.showToast({ title: '参数错误,无唯一码ID', icon: 'none' })
        return
    }
    pathParams.value = options
    // stockOut-putAway
    // stockOut
    const query = objectToQuery(pathParams.value)
    backUrl.value = `/pages/warehousing/stockIn/components/detail${query}`

})

onMounted(() => {
    getMaterialList()
})
const toTechnical = () => {
    const query = objectToQuery(pathParams?.value)

    uni.navigateTo({
        url: `/pages/warehousing/stockOut/components/technicalEvaluation${query}`
    })
}
</script>

<style lang="scss" scoped>
.page {
    background: #f5f5f5;
    min-height: 100vh;
}

/* 底部按钮 */
::v-deep .bottom {
    position: fixed;
    bottom: 0;
    height: 60rpx;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;

    .uv-button-wrapper {
        width: 100%;
        border-radius: 0;
    }

}

::v-deep .form {
    // background-color: #fff;
    padding: 0;

    .uv-input__content {

        .uv-input__content__field-wrapper__field {
            text-align: right !important;
        }
    }

    .uv-form-item__body {
        background-color: #fff;
        padding: 12rpx;
        margin-bottom: 2rpx;
        align-items: center;
    }

    .uv-form-item__body__left__content__label {
        font-size: 14px;
    }

    .uv-line {
        border-bottom: 0 !important;
    }

    .uv-form-item__body__right__content__slot {
        justify-content: flex-end;
        align-items: center;
    }

    .uv-cell__body {
        padding: 0
    }

    .uni-icons {
        display: block;
    }

    .u-slot-title {

        display: flex;
        align-items: center;
    }
}
</style>