<!-- 唯一码发放页面 - 唯一码发放、唯一码编辑、入库单快速生成唯一码 -->
<template>
    <navigation :title="title" :back-url="backUrl"></navigation>
    <view class="contentBox">
        <view class="remarkLine">
            <span>备注：</span>
            <uni-easyinput type="text" v-model="formData.remark" :inputBorder="false" placeholder="请输入备注" />
        </view>
        <!-- 物料列表 - 添加物料 -->
        <material-list ref="materialRef" :formData="formData" :remark="formData.remark" isEdit="1"
            :pathParams="pathParams" />
        <button class="bottom-btn" type="primary" @click="handleSubmit">提交</button>
    </view>
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import { addUniqueCode, editUniqueCode } from '@/api/uniqueCode';
import MaterialList from '../../../components/MaterialList.vue';
import Navigation from '../../../components/Navigation.vue';
import { objectToQuery } from '../../../until';
import _ from 'lodash';
const OPERATE_CONFIG = {
    // 唯一码创建 
    issueUniqueCode: {
        title: '唯一码发放',
        back: 'pages/warehousing/index'
    },
    //唯一码编辑
    issueUniqueCode_edit: {
        title: '',
        back: '/pages/warehousing/uniqueCode/myUniqueCode'
    },
    //入库单入库
    stockIn_inbound: {
        title: '快速生成唯一码',
        back: '/pages/warehousing/stockIn/components/inbound'
    },
}
// ref：标题
const title = ref('')
const backUrl = ref('')
// 数据：路径参数
const pathParams = ref('')
// 数据：物料、备注
const formData = ref({ remark: '', material: [] })
// ref:绑定物料列表
const materialRef = ref([])
// 接收路径参数 - 修改标题- 携带code、id、materialId
onLoad((options) => {
    const query = objectToQuery(options)
    pathParams.value = options
    const config = options.type ? OPERATE_CONFIG[options.type] : OPERATE_CONFIG.issueUniqueCode

    title.value = config.title ? config.title : options.title
    backUrl.value = config.back + query

})

onMounted(() => {
    // 快速生成唯一码时 已选择的物料列表初始为空 点击添加物料 去选择
    if (pathParams.value.type != 'inbound') {
        getMaterialList();
    }

})
// 创建/编辑 唯一码
const handleSubmit = () => {
    //  物料最新编辑数据
    const material = materialRef.value.getMaterialList()?.[0]
    const query = objectToQuery(pathParams.value)
    const params = {
        remark: formData.value.remark,
        material: { ...material.material, unitId: '23' }
    }
    if (pathParams.value.type == `issueUniqueCode_inbound`) {
        params.billNo = pathParams.value.billNo
    }
    if (pathParams.value.id) {
        params.id = pathParams.value.id; //唯一码id
        params.material.id = formData.value.material?.[0]?.uniqueCodeMaterialId; //唯一码物料id
        params.material.materialId = formData.value.material?.[0]?.materialId; //物料id
        editUniqueCode(params).then((response) => {
            if (response.code == 200) {
                uni.showToast({
                    title: '唯一码编辑成功',
                    mask: true,
                    icon: 'success',
                })
                uni.navigateTo({
                    url: OPERATE_CONFIG.issueUniqueCode_edit.back + query
                });
            }

        })
    } else {
        addUniqueCode(params).then((response) => {
            if (response.code == 200) {
                uni.showToast({
                    title: '唯一码创建成功',
                    mask: true,
                    icon: 'success',
                })
                if (_.includes(pathParams.value?.type, 'inbound')) {
                    uni.navigateTo({
                        url: OPERATE_CONFIG.stockIn_inbound.back + query
                    });
                } else {
                    uni.switchTab({
                        url: OPERATE_CONFIG.issueUniqueCode.back
                    })
                }

            }

        })
    }
}

// 获取缓存内的物料列表
const getMaterialList = () => {
    const value = uni.getStorageSync('app_material');
    if (value) {
        formData.value.material = value
        if (value?.[0]?.uniqueCodeRemark) {
            formData.value.remark = value?.[0]?.uniqueCodeRemark
        }
    }
}

</script>
<style scoped lang="scss">
.remarkLine {
    display: flex;
    align-items: center;
    background-color: #fff;
    justify-content: space-between;
    padding: 8rpx 24rpx;
    margin-bottom: 8rpx;
    min-height: 40rpx;

    span {
        font-size: 14px;
    }

    p {
        font-weight: 700;
        font-size: 14px;

    }

}

::v-deep .uv-button {
    height: 20px;
}

::v-deep .form {
    .title {
        color: #424242;
    }

    .tag {
        .uni-tag {
            display: flex;
            align-items: center;
            height: calc(25px - 6px);

        }

        .tag-form {
            display: flex;
            align-items: center;
        }

        .uni-forms-item {
            margin-bottom: 0;
            align-items: center;

            .uni-easyinput__content,
            .uni-easyinput__content-input {
                height: 25px;
                width: 80px;
            }
        }

    }

    .remark {
        .uni-forms-item {
            margin-bottom: 0;
            margin-top: 16rpx;
            display: flex;
            align-items: center;

            .uni-forms-item__label {
                color: #212121;
                height: 40rpx;
            }

            .uni-easyinput__content-input {
                height: 40rpx;

                .uni-input-wrapper {
                    text-align: right;
                }
            }

            .uni-input-placeholder {
                text-align: right;
                font-size: 13px;

            }
        }
    }


}
</style>