<template>
    <el-form :model="form" class="common-form" label-width="auto">
        <el-form-item label="已揽件-物流异常：">
            <div class="flex items-center">
                <el-checkbox
                    v-model="form.pickUpSwitch"
                    :true-label="1"
                    :false-label="0"
                    >开启</el-checkbox
                >
                <ele-text class="ml-6">
                    已揽件状态的订单，路由信息
                    <el-input
                        v-model="form.pickUpDays"
                        placeholder="请输入"
                        clearable
                        style="width: 100px"
                    />
                    天未更新
                </ele-text>
            </div>
        </el-form-item>
        <el-form-item label="已签收-收货超时：">
            <div class="flex items-center">
                <el-checkbox
                    v-model="form.signSwitch"
                    :true-label="1"
                    :false-label="0"
                    >开启</el-checkbox
                >
                <ele-text class="ml-6">
                    已签收状态
                    <el-input
                        v-model="form.signHours"
                        placeholder="请输入"
                        clearable
                        style="width: 100px"
                    />
                    小时仍未确认收货
                </ele-text>
            </div>
        </el-form-item>
        <el-form-item label="已收货-审核超时：">
            <div class="flex items-center">
                <el-checkbox
                    v-model="form.receivedSwitch"
                    :true-label="1"
                    :false-label="0"
                    >开启</el-checkbox
                >
                <ele-text class="ml-6">
                    已收货状态
                    <el-input
                        v-model="form.receivedHours"
                        placeholder="请输入"
                        clearable
                        style="width: 100px"
                    />
                    小时仍未审核完成
                </ele-text>
            </div>
        </el-form-item>
        <el-form-item label="已到仓-收货超时：">
            <div class="flex items-center">
                <el-checkbox
                    v-model="form.arrivedSwitch"
                    :true-label="1"
                    :false-label="0"
                    >开启</el-checkbox
                >
                <ele-text class="ml-6">
                    已到仓状态
                    <el-input
                        v-model="form.arrivedHours"
                        placeholder="请输入"
                        clearable
                        style="width: 100px"
                    />
                    小时仍未确认收货
                </ele-text>
            </div>
        </el-form-item>

        <el-form-item>
            <el-button
                type="success"
                style="width: 100px"
                plain
                @click="onSubmit"
                v-permission="'recycle:orderSetting:recycleAlertParams'"
                >保存</el-button
            >
        </el-form-item>
    </el-form>
</template>

<script setup>
    import { reactive, watch } from 'vue';
    import { ElMessage } from 'element-plus';
    import request from '@/utils/request';

    const props = defineProps({
        settings: {
            type: Object,
            default: () => ({})
        }
    });

    const form = reactive({
        pickUpSwitch: 0,
        pickUpDays: '',
        signSwitch: 0,
        signHours: '',
        receivedSwitch: 0,
        receivedHours: '',
        arrivedSwitch: 0,
        arrivedHours: ''
    });

    watch(
        () => props.settings,
        (newVal) => {
            if (newVal) {
                form.pickUpSwitch = newVal.earlyWarningPickUpSwitch;
                form.pickUpDays = newVal.earlyWarningPickUpDays;
                form.signSwitch = newVal.earlyWarningSignSwitch;
                form.signHours = newVal.earlyWarningSignHours;
                form.receivedSwitch = newVal.earlyWarningReceivedSwitch;
                form.receivedHours = newVal.earlyWarningReceivedHours;
                form.arrivedSwitch = newVal.earlyWarningArrivedSwitch;
                form.arrivedHours = newVal.earlyWarningArrivedHours;
            }
        },
        { immediate: true, deep: true }
    );

    const onSubmit = () => {
        let data = JSON.parse(JSON.stringify(form));
        request
            .post('/recycle/manage/overall/update/earlyWarning', data)
            .then((res) => {
                if (res.data.code === 200) {
                    ElMessage.success('保存成功');
                } else {
                    ElMessage.error(res.data.msg);
                }
            });
    };
</script>
