<template>
    <hc-new-dialog widths="30rem" :show="isShow" title="变更归档目录" @save="addModalSave" @close="addModalClose">
        <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
            <el-form-item label="文件编号：">
                <el-input v-model="formModel.key1" />
            </el-form-item>
            <el-form-item label="文件名称：">
                <el-input v-model="formModel.key2" />
            </el-form-item>
            <el-form-item label="文件类型：">
                <el-select v-model="formModel.key3" block>
                    <el-option label="变更方案" value="1" />
                    <el-option label="变更令" value="2" />
                </el-select>
            </el-form-item>
            <el-form-item label="备注：">
                <el-input v-model="formModel.key4" :autosize="{ minRows: 4, maxRows: 8 }" type="textarea" />
            </el-form-item>
        </el-form>
    </hc-new-dialog>
</template>

<script setup>
import { ref, watch } from 'vue'

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

//事件
const emit = defineEmits(['finish', 'close'])

//双向绑定
// eslint-disable-next-line no-undef
const isShow = defineModel('modelValue', {
    default: false,
})

//监听
watch(() => [
    props.info,
], ([val]) => {
    console.log('info', val)
}, { immediate: true })

//监听
watch(isShow, (val) => {
    if (val) {
        console.log('isShow', val)
    }
})

//基础表单
const formRef = ref(null)
const formModel = ref({})
const formRules = {}

//保存
const addModalSave = () => {
    emit('finish')
    addModalClose()
}

//关闭弹窗
const addModalClose = () => {
    isShow.value = false
    emit('close')
}
</script>
