<script lang="ts">
import { defineComponent, reactive, ref } from 'vue';
import { Tabs, Select, SelectOption, Input, InputGroup, Form, Button } from 'ant-design-vue';
import { StepForwardOutlined } from '@ant-design/icons-vue';
export default defineComponent({
name: '',
components: {
ATabs: Tabs,
ATabPane: Tabs.TabPane,
Select,
SelectOption,
Input,
InputGroup,
AFormItemRest: Form.ItemRest,
Button,
StepForwardOutlined,
}
})
</script>
// 局部html代码
<template #queryKey="{ model, field }">
<AFormItemRest>
<InputGroup compact class="free-input-group">
<Select
v-model:value="model['queryKeyType']"
class="free-select"
@change="queryKeyTypeChange"
>
<SelectOption :value="0">修饰名称</SelectOption>
<SelectOption :value="1">英文标识</SelectOption>
</Select>
<Input v-model:value="model[field]" class="free-input" placeholder="请输入" />
</InputGroup>
</AFormItemRest>
</template>
<template #btn>
<Button type="default" @click="closeDrawer">取 消</Button>
<Button type="primary" @click="handleSubmit">确 认</Button>
</template>
<template #iconBtn>
<StepForwardOutlined style="color: red; font-size: 33px" />
</template>