<!-- 转为客户 -->
<template>
    <el-dialog title="转为客户" v-model="visible" width="850px">
        <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
            <el-form-item label="客户代码：" prop="dataCode">
                <el-input disabled v-model="form.dataCode" placeholder="请输入客户代码"/>
            </el-form-item>
            <el-form-item label="客户名称：" prop="customerName">
                <el-input v-model="form.customerName" placeholder="请输入客户名称"/>
            </el-form-item>
            <el-form-item label="客户来源：" prop="customerSourceDictValue">
                <SelectDict v-model="form.customerSourceDictValue" placeholder="请选择客户来源" dictCode="customer_source"></SelectDict>
            </el-form-item>
            <el-form-item label="经济性质：" prop="customerEconomicNatureDictValue">
                <SelectDict v-model="form.customerEconomicNatureDictValue" placeholder="请选择经济性质" dictCode="economic_nature"></SelectDict>
            </el-form-item>
            <el-form-item label="客户状态：" prop="customerStatusDictValue">
                <SelectDict v-model="form.customerStatusDictValue" placeholder="请选择客户状态" dictCode="customer_status"></SelectDict>
            </el-form-item>
            <el-form-item label="归属人员：" prop="ownerBy">
                <SelectUser v-model="form.ownerBy" placeholder="请选择归属人员"></SelectUser>
            </el-form-item>
            <el-form-item label="首联系人：" prop="liaison.name">
                <el-input v-model="form.liaison.name" placeholder="请输入首联系人"/>
            </el-form-item>
            <el-form-item label="电子邮箱：" prop="liaison.email">
                <el-input v-model="form.liaison.email" placeholder="请输入电子邮箱"/>
            </el-form-item>
        </el-form>
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="cancel">取消</el-button>
                <el-button :loading="buttonLoading" type="primary" @click="submitForm">提交</el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
    import { convertCustomer, generateBizCode } from '@/api/customer'
    import { CustomerVO } from '@/api/customer/types'
    import { useDictCache } from '@/hooks/web/useDict'
    import useUserStore from '@/store/modules/user';

    const { queryDictDetailByCodes } = useDictCache(['customer_source', 'economic_nature', 'customer_status'])
    queryDictDetailByCodes()

    const emits = defineEmits(['refresh'])

    const visible = ref(false)
    const buttonLoading = ref(false)

    const open = ({ obj }: { obj: CustomerVO }) => {
        visible.value = true
        Object.assign(form, obj)
        getCode()
    }

    const getCode = () => {
        generateBizCode({bizTypeCode:10}).then(res => {
            if(res.success) {
                form.dataCode = res.result
            }
        })
    }

    const formRef = ref<ElFormInstance>();
    const { userInfo } = useUserStore();
    const form = reactive<any>({
        id: '',
        dataCode: '',
        customerName: '',
        customerSourceDictValue: '',
        customerEconomicNatureDictValue: '',
        customerStatusDictValue: '',
        ownerBy: userInfo.id,
        liaison: {
            name: '',
            email: ''
        }
    })

    const rules = {
        dataCode: [
            { required: true, message: "客户代码不能为空", trigger: "blur" }
        ],
        customerName: [
            { required: true, message: "客户名称不能为空", trigger: "blur" }
        ],
        customerSourceDictValue: [
            { required: true, message: "客户来源不能为空", trigger: "blur" }
        ],
        customerEconomicNatureDictValue: [
            { required: true, message: "经济性质不能为空", trigger: "blur" }
        ],
        customerStatusDictValue: [
            { required: true, message: "客户状态不能为空", trigger: "blur" }
        ],
        ownerBy: [
            { required: true, message: "归属人员不能为空", trigger: "blur" }
        ],
        'liaison.name': [
            { required: true, message: "首联系人不能为空", trigger: "blur" }
        ],
        'liaison.email': [
            { required: true, message: "电子邮箱不能为空", trigger: "blur" }
        ]
    }

    const submitForm = () => {
        formRef.value?.validate(async (valid: boolean) => {
            if (valid) {
                buttonLoading.value = true;
                await convertCustomer(form).finally(() => buttonLoading.value = false);
                ElMessage.success("转为客户成功");
                formRef.value?.resetFields()
                visible.value = false
                emits('refresh')
            }
        });
    }

    const cancel = () => {
        visible.value = false
    }

    defineExpose({
        open
    })
</script>

<style lang="scss" scoped>

</style>
