<template>
    <hc-new-dialog v-model="isShow" widths="90%" title="合同计量单元修改" @save="modalSave">
        <el-form ref="formRef" class="p-4" label-position="left" label-width="auto" :model="formModel" :rules="formRules">
            <el-row :gutter="20">
                <el-col :span="6">
                    <el-form-item label="工程名称：">
                        <el-input v-model="formModel.key1" placeholder="工程名称" />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="工程编号：">
                        <el-input v-model="formModel.key2" placeholder="工程编号" />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="节点类型：">
                        <el-select v-model="formModel.key3" block placeholder="节点类型">
                            <el-option label="单位工程" :value="1" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="工程类型：">
                        <el-select v-model="formModel.key4" block placeholder="工程类型">
                            <el-option label="总则" :value="1" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="桩号类型：">
                        <el-select v-model="formModel.key5" block placeholder="桩号类型">
                            <el-option label="总则" :value="1" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="起始桩号：">
                        <el-input v-model="formModel.key6" placeholder="起始桩号" />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="结束桩号：">
                        <el-input v-model="formModel.key7" placeholder="结束桩号" />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="是否增补：">
                        <el-select v-model="formModel.key8" block placeholder="是否增补">
                            <el-option label="是" :value="1" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="施工金额：">
                        <el-input v-model="formModel.key9" placeholder="施工图金额">
                            <template #suffix>元</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="变更金额：">
                        <el-input v-model="formModel.key9" placeholder="变更后金额">
                            <template #suffix>元</template>
                        </el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="合同图号：">
                        <el-input v-model="formModel.key9" placeholder="合同图号" />
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="变更图号：">
                        <el-input v-model="formModel.key9" placeholder="变更合同图号" />
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="备注：">
                        <el-input v-model="formModel.key10" :autosize="{ minRows: 4, maxRows: 8 }" type="textarea" />
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
    </hc-new-dialog>
</template>

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

const props = defineProps({
    ids: {
        type: [String, Number],
        default: '',
    },
})

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

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

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

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

//弹窗表单
const formRef = ref(null)
const formModel = ref({})
const formRules = ref({})

const modalSave = () => {
    emit('finish')
}
</script>
