<template>
    <vxe-modal v-model="show" :z-index="1006" @hide="onClose" :title="title" width="800" esc-closable mask-closable
        show-footer>
        <template #default>

            <vxe-form
                title-overflow
                title-colon
                title-width="120"
                title-align="right"
                ref="formRef"
                :data="form"
                >
                <vxe-form-item  v-for="(item, index) in formColumn"   :key="index"  :field="item"   :title="item" span="12" :item-render="item">
                    <template #default>
                    <vxe-input v-model="form[item]" :disabled="item=='id'"></vxe-input>
                    </template>
                </vxe-form-item>
            </vxe-form>
        </template>
        <template #footer>
            <el-button type="primary" @click="onSubmit">确认</el-button>
        </template>
    </vxe-modal>
</template>

<script lang="ts" setup name="InformationInfoDialog">
import { ref, watch } from 'vue'
import { useRoute } from 'vue-router'
import { addInformationInfoApi, updateInformationInfoApi } from '@/api/customer'
import { ElMessage, type FormInstance } from 'element-plus'

const route = useRoute()

const props = defineProps({
    visible: {
        type: Boolean,
        default: false
    },
    title: {
        type: String,
        default: "新增资料"
    },
    informationInfo: {
        type: Object,
        default: () => { }
    }
})

const emits = defineEmits(['onChange'])

const show = ref(false)
const formRef = ref<FormInstance>()
const formColumn = ref<any>([])
const form = ref<any>({})

watch(
    () => props.visible,
    (val) => {
        show.value = val
        formColumn.value = Object.keys(props.informationInfo)
        form.value = props.informationInfo
    }
)

const addInformationInfo = async () => {
    const params = {
        informationType: route.query.informationType,
        json: JSON.stringify(form.value)
    }
    const { data } = await addInformationInfoApi(params)
    if (data?.code == 200) {
        ElMessage.success(`${data?.message}`)
        emits('onChange', 'add')
    } else {
        ElMessage.error(`${data?.message}`)
    }
}



const updateInformationInfo = async () => {
    delete form.value['_X_ROW_KEY']
    const params = {
        informationType: route.query.informationType,
        json: JSON.stringify(form.value)
    }
    const { data } = await updateInformationInfoApi(params)
    if (data?.code == 200) {
        ElMessage.success(`${data?.message}`)
        emits('onChange', 'update')
    } else {
        ElMessage.error(`${data?.message}`)
    }
}

const onSubmit = () => {
    if (props.title == '新增资料') {
        addInformationInfo()
    } else {
        updateInformationInfo()
    }
}

const onClose = () => {
    emits('onChange', 'close')
}

</script>

<style lang="scss" scoped></style>