<template>
    <navigation :title="title" :back-url="backUrl"></navigation>
    <view class="contentBox">
        <!-- 仓库信息 - 仓库、存储区 -->
        <warehousing-info ref="warehousingInfoRef" :warehouseInfo="warehouseInfo"
            :pathParams="{ ...pathParams, type: 'stockOut' }" />
        <!-- 物料列表 - 添加物料 -->
        <material-list ref="materialRef" :formData="formData" :isEdit="flag == 'stockOut' ? 5 : 1"
            :pathParams="{...pathParams.value, type: 'stockOut' }" />
        <!-- 底部操作栏 -->
        <view class="bottom">
            <uv-button @tap="scanCode">扫码添加</uv-button>
            <uv-button type="primary" @tap="submitForm">提交</uv-button>
        </view>
    </view>
</template>

<script setup>

import _ from 'lodash';
import { ref } from 'vue';
import { objectToQuery, removeStorage } from '../../until';
import { onLoad, onShow } from "@dcloudio/uni-app";
import { addStockOut, stockOutUpdate } from '@/api/stockOut';
import { getMaterialByQrCodeInfo } from '@/api/uniqueCode';
import MaterialList from '../../components/MaterialList.vue';
import WarehousingInfo from '../../components/WarehousingInfo.vue';
import Navigation from '../../components/Navigation.vue';
import { includes } from 'lodash';

// 数据：路径参数
const pathParams = ref('')
// 标志：是否为编辑
const isEdit = ref('')
// 标志：区分页面 进入页面的状态 null新建  stockOut:出库编辑  stockOut-putAway：出库单出库编辑 
const flag = ref('')

// ref：标题
const title = ref('出库单开单')
const backUrl = ref('pages/warehousing/index')
//ref:已经扫过的code
const existList = ref([])

// ref：物料绑定
const materialRef = ref([])
// ref：仓库信息绑定
const warehousingInfoRef = ref([])

// 数据：物料列表
const formData = ref([{ remark: '', material: [] }])
// 数据：仓库信息
const warehouseInfo = ref({ warehousing: {}, storageArea: {}, remark: '' })

// 数据：获取缓存信息
const getMaterialList = () => {
    // 获取仓库信息
    const warehouse = uni.getStorageSync('app_warehousing');
    warehouseInfo.value.warehousing = warehouse

    // 获取存储区信息
    const storageArea = uni.getStorageSync('app_storageArea');
    warehouseInfo.value.storageArea = storageArea

    // 获取物料信息
    const material = uni.getStorageSync('app_material');
    formData.value.material = material

    // 获取出库单备注
    const billRemark = uni.getStorageSync('app_billRemark');
    warehouseInfo.value.remark = billRemark
}
getMaterialList();
// 扫码添加
const scanCode = () => {
    // 先校验是否支持扫码
    uni.scanCode({
        scanType: ['qrCode', 'barCode'], // 支持二维码 + 条形码
        success: (res) => {
            console.log('二维码code====>', res.result);
            const idx = includes(existList, res.result)
            if (idx) {
                uni.showToast({
                    title: '该物料已添加，请勿重复添加！',
                    mask: true,
                    icon: 'none',
                })
                return
            }
            if (res.result) {
                getMaterialByQrCodeInfo({ code: res.result, existList: existList.value }).then((response) => {
                    console.log('物料内容====>：', response);
                    if (`${response.code}` === '200') {
                        const material = uni.getStorageSync('app_material');
                        // 处理物料信息 合并
                        const materialInfo = _.filter(material, { isDelete: '0' });
                        console.log('materialInfo====>', materialInfo);
                        const materialId = response.data?.[0]?.materialId;
                        console.log('materialId====>', materialId);
                        // const idx = _.findIndex(materialInfo, (i) => i.materialId ? i.materialId == materialId : i.id == materialId);
                        // console.log('已选中是否有重复数据====>', idx);

                        // if (idx != -1) {
                        //     uni.showToast({
                        //         title: '该物料已添加，请勿重复添加！',
                        //         mask: true,
                        //         icon: 'none',
                        //     })
                        // } else {
                        let _material = [...materialInfo, { ...response.data[0], uniqueCode: res.result }]
                        console.log('新的物料数组====>', _material);
                        formData.value.material = _material
                        uni.setStorageSync('app_material', formData.value.material)
                        existList.value.push(res.result)
                        // }
                    } else {
                        console.log(response.code, 'response.code');
                    }


                })
            }
        },
        fail: () => {
            uni.showToast({ title: '扫码失败', icon: 'none' });
        }
    });
};

// 提交表单
const submitForm = () => {
    const info = warehousingInfoRef.value.getWarehousingInfo()
    const materialInfo = materialRef.value.getMaterialList()
    console.log(info, 'info==>');

    if (!info.warehousing?.[0]?.deptName) {
        uni.showToast({
            title: '请填写仓库信息',
            mask: true,
            icon: 'error',
        })
        return
    }
    if (!info.storageArea?.[0]?.deptName) {
        uni.showToast({
            title: '请填写存储区信息',
            mask: true,
            icon: 'error',
        })
        return
    }
    let params = {
        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 }))
    }
    console.log(params, isEdit, !isEdit, info, materialInfo, '入参params');
    // 新建
    if (!isEdit.value) {
        addStockOut(params).then((res) => {
            if (res.code == 200) {
                uni.showToast({
                    title: '出库单创建成功',
                    mask: true,
                    icon: 'success',
                })
                removeStorage()
                uni.navigateTo({
                    url: `/pages/warehousing/stockOut/my`,
                });
            }

        })
    } else if (isEdit.value) {
        // 编辑
        params.billNo = pathParams.value?.billNo
        params.billId = pathParams.value?.billId
        const query = objectToQuery(pathParams.value)
        stockOutUpdate(params).then((res) => {
            if (res.code == 200) {
                uni.showToast({
                    title: '出库单编辑成功',
                    mask: true,
                    icon: 'success',
                })
                let url = `/pages/warehousing/stockOut/components/detail${query}`
                uni.navigateTo({
                    url: url,
                });
            }
        })
    }

}
// 数据：路径参数
onLoad((options) => {
    console.log(options, 'options', _.includes(options?.type, 'stockOut'));

    pathParams.value = options
    flag.value = options.type
    isEdit.value = _.includes(options?.type, 'stockOut')
})
// 修改标题：若有billNo传入 修改标题
onShow(() => {
    const query = objectToQuery(pathParams.value)
    // /pages/warehousing/stockIn/components/detail?billNo=DL1775619567111&type=stockOut
    if (includes(pathParams.value.type, 'stockOut')) {
        backUrl.value = `/pages/warehousing/stockIn/components/detail${query}`
    }
    if (pathParams.value.billNo) {
        title.value = pathParams.value.billNo
    }

})
</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: 50%;
        border-radius: 0;
    }

    .uv-button--info {
        background-color: #07c160;
        color: #fff;

    }
}
</style>