<template>
    <el-dialog
        v-model="data.dialogVisible"
        :title="data.editId ? '编辑销售概览' : '新增销售概览'"
        :before-close="handleClose"
        width="600px"
    >
        <el-form ref="formDataRef" :model="ruleForm" :rules="rules" label-width="140px">
            <el-form-item label="应收货款(元)" prop="accountsReceivable">
                <el-input-number
                    v-model="ruleForm.accountsReceivable"
                    :precision="2"
                    :min="0"
                    :max="99999999.99"
                    placeholder="请输入应收货款"
                    style="width: 100%"
                ></el-input-number>
            </el-form-item>

            <el-form-item label="未收货款(元)" prop="uncollectedPayment">
                <el-input-number
                    v-model="ruleForm.uncollectedPayment"
                    :precision="2"
                    :min="0"
                    :max="99999999.99"
                    placeholder="请输入未收货款"
                    style="width: 100%"
                ></el-input-number>
            </el-form-item>

            <el-form-item label="实收货款(元)" prop="actualPayment">
                <el-input-number
                    v-model="ruleForm.actualPayment"
                    :precision="2"
                    :min="0"
                    :max="99999999.99"
                    placeholder="请输入实收货款"
                    style="width: 100%"
                ></el-input-number>
            </el-form-item>

            <el-alert
                v-if="data.editId"
                title="提示"
                description="采购总额、销售总额、利润、采购数量、采购单数、销售单数等字段由系统自动计算，无法手动修改。"
                type="info"
                :closable="false"
                show-icon
                style="margin-bottom: 20px"
            />
        </el-form>

        <template #footer>
            <span class="dialog-footer">
                <el-button :loading="data.saveLoading" type="primary" @click="onClickSave">保存</el-button>
                <el-button @click="handleClose">取消</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script setup>
import { ref, reactive } from 'vue';
import { ElMessage } from 'element-plus';
import { salesOverviewAdd, salesOverviewEdit } from '@/api/salesOverview.js';

const emits = defineEmits(['success']);
const formDataRef = ref(null);

const data = reactive({
    dialogVisible: false,
    saveLoading: false,
    editId: null,
});

const ruleForm = reactive({
    id: null,
    accountsReceivable: null,
    uncollectedPayment: null,
    actualPayment: null,
});

const rules = reactive({
    accountsReceivable: [
        { type: 'number', min: 0, message: '应收货款不能小于0', trigger: 'blur' },
    ],
    uncollectedPayment: [
        { type: 'number', min: 0, message: '未收货款不能小于0', trigger: 'blur' },
    ],
    actualPayment: [
        { type: 'number', min: 0, message: '实收货款不能小于0', trigger: 'blur' },
    ],
});

const handleClose = () => {
    if (formDataRef.value) {
        formDataRef.value.resetFields();
    }
    // 重置表单数据
    ruleForm.id = null;
    ruleForm.accountsReceivable = null;
    ruleForm.uncollectedPayment = null;
    ruleForm.actualPayment = null;
    data.editId = null;
    data.dialogVisible = false;
};

const onClickSave = () => {
    if (!formDataRef.value) {
        return;
    }

    formDataRef.value.validate((valid) => {
        if (!valid) {
            return false;
        }

        data.saveLoading = true;

        const params = {
            accountsReceivable: ruleForm.accountsReceivable || 0,
            uncollectedPayment: ruleForm.uncollectedPayment || 0,
            actualPayment: ruleForm.actualPayment || 0,
        };

        if (data.editId) {
            // 编辑
            params.id = data.editId;
            salesOverviewEdit(params)
                .then((res) => {
                    if (res.code === 200) {
                        ElMessage.success('编辑成功');
                        handleClose();
                        emits('success');
                    } else {
                        ElMessage.error(res.msg || '编辑失败');
                    }
                })
                .catch((error) => {
                    ElMessage.error('编辑失败：' + (error.message || '未知错误'));
                })
                .finally(() => {
                    data.saveLoading = false;
                });
        } else {
            // 新增
            salesOverviewAdd(params)
                .then((res) => {
                    if (res.code === 200) {
                        ElMessage.success('新增成功');
                        handleClose();
                        emits('success');
                    } else {
                        ElMessage.error(res.msg || '新增失败');
                    }
                })
                .catch((error) => {
                    ElMessage.error('新增失败：' + (error.message || '未知错误'));
                })
                .finally(() => {
                    data.saveLoading = false;
                });
        }
    });
};

const onShowDialog = (row) => {
    if (row) {
        // 编辑
        data.editId = row.id;
        ruleForm.id = row.id;
        ruleForm.accountsReceivable = row.accountsReceivable || null;
        ruleForm.uncollectedPayment = row.uncollectedPayment || null;
        ruleForm.actualPayment = row.actualPayment || null;
    } else {
        // 新增
        data.editId = null;
        ruleForm.id = null;
        ruleForm.accountsReceivable = null;
        ruleForm.uncollectedPayment = null;
        ruleForm.actualPayment = null;
    }
    data.dialogVisible = true;
};

defineExpose({
    onShowDialog,
});
</script>

<style scoped>
.dialog-footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}
</style>

