<template>
    <a-modal :open="modal.open" :title="modal.title" :width="600" :confirm-loading="modal.confirmLoading"
        :after-close="onAfterClose" :cancel-text="cancelText" @ok="handleOk" @cancel="handleCancel">
        <a-spin tip="Loading..." :spinning="spining">
            <a-card>
                <a-form ref="formRef" :model="formData" :rules="formRules">
                    <a-row :gutter="24">
                        <a-col :span="24">
                            <a-form-item label="转出类型" name="directionType">
                                <a-radio-group v-model:value="formData.directionType">
                                    <a-radio :value="'Transfer'">转出</a-radio>
                                    <a-radio :value="'Death'">去世</a-radio>
                                </a-radio-group>
                            </a-form-item>
                        </a-col>
                        <a-col :span="24" v-if="formData.directionType==='Transfer'">
                            <a-form-item label="转出原因" name="reason">
                                <a-select v-model:value="formData.reason" placeholder="请选择转出原因" allow-clear>
                                    <a-select-option v-for="item in dicsStore.dictOptions.OUT_REASON" :key="item.dval"
                                        :value="item.dval">
                                        {{ item.introduction }}
                                    </a-select-option>
                                </a-select>
                            </a-form-item>
                        </a-col>
                        <a-col :span="24" v-if="formData.directionType==='Transfer'">
                            <a-form-item label="转入节点" name="nStationId">
                                <ServiceStation @change="handleChange" v-model:value="formData.nStationId" />
                            </a-form-item>
                        </a-col>
                        <a-col :span="24" v-if="formData.directionType === 'Death'">
                            <a-form-item label="去世时间">
                                <a-date-picker v-model:value="formData.passWayAt" style="width: 100%;" />
                            </a-form-item>
                        </a-col>
                        <a-col :span="24">
                            <a-form-item label="备注" name="remark">
                                <a-textarea v-model:value="formData.remark" placeholder="请输入备注" :rows="1"
                                    :auto-size="{ minRows: 1, maxRows: 2 }" />
                            </a-form-item>
                        </a-col>
                    </a-row>
                </a-form>
            </a-card>
        </a-spin>
    </a-modal>
</template>

<script setup>
import { ref, defineProps, nextTick, watch } from 'vue'
import { config } from '@/config'
import apis from '@/apis'
import { useForm, useModal, useSpining } from '@/hooks'
import { useDicsStore } from '@/store'
import dayjs from 'dayjs'
import storage from '@/utils/storage'
import ServiceStation from '@/components/ServiceStation/index.vue'
const emit = defineEmits(['ok'])
const { modal, showModal, hideModal, showLoading, hideLoading } = useModal()
const { formRecord, formData, formRef, formRules, resetForm } = useForm()
const cancelText = ref('取消')
const spining = ref(false)
formRules.value = {
    reason: [{ required: true, message: '请选择原因', trigger: 'change' }],
    directionType: [{ required: true, message: '请选择类型', trigger: 'change' }],
    nStationId: [{ required: true, message: '请选择节点', trigger: 'change' }],
    passWayAt: [{ required: true, message: '请选择去世时间', trigger: 'change' }]
}

const dicsStore = useDicsStore()
formData.value = {}
/**
 * 新建
 */
function handleCreate(id,stationId) {
    formData.value.directionType = 'Transfer'
    formData.value.direction = 'Out'
    formData.value.customerId = id
    formData.value.stationId = stationId

    showModal({
        type: 'create',
        title: '转出',
    })
}
function handleChange(e) {
    console.log(e)
}


/**
 * 确定
 */
function handleOk() {
    formRef.value
        .validateFields()
        .then(async (values) => {
            try {
                showLoading()
                let params = {
                    ...formData.value,
                }
                if (params.directionType === 'Death') {
                    params.passWayAt = dayjs(formData.value.passWayAt)
                } 
                let result = null
                switch (modal.value.type) {
                    case 'create':
                        result = await apis.serverObj.inOutLogs(params).catch(() => {
                            throw new Error()
                        })
                        console.log('result', result.code)
                        break
                    case 'edit':
                        console.log(params)
                        result = await apis.serverObj.updateItem(params.id, params).catch(() => {
                            throw new Error()
                        })
                        break
                }
                hideLoading()
                if (config('http.code.success') === true) {
                    hideModal()
                    emit('ok')
                }
            } catch (error) {
                console.log(error.message)
                hideLoading()
                // message.error(error.message)
            }
        })
        .catch(() => {
            hideLoading()
        })
}

/**
 * 取消
 */
function handleCancel() {
    hideModal()
}

/**
 * 关闭后
 */
function onAfterClose() {
    resetForm()
    hideLoading()
}

defineExpose({
    handleCreate
})
</script>

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