You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
86 lines
2.2 KiB
86 lines
2.2 KiB
2 years ago
|
<template>
|
||
|
<a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||
|
<a-form-item label="相机名称">
|
||
|
<a-input v-model:value="formState.name" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="相机IP">
|
||
|
<a-input v-model:value="formState.ip" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="相机参数 Id">
|
||
|
<a-input v-model:value="formState.CbCameraParamsId" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="登录名">
|
||
|
<a-input v-model:value="formState.userName" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="密码">
|
||
|
<a-input-password v-model:value="formState.password" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="用户类型">
|
||
|
<a-select v-model:value="formState.userType" placeholder="请选择用户类型">
|
||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||
|
</a-select>
|
||
|
</a-form-item>
|
||
|
<a-form-item label="是否启用">
|
||
|
<a-switch v-model:checked="formState.state" />
|
||
|
</a-form-item>
|
||
|
<a-form-item label="备注">
|
||
|
<a-input v-model:value="formState.remark" type="textarea" />
|
||
|
</a-form-item>
|
||
|
<!-- <a-form-item :wrapper-col="{ span: 14, offset: 4 }">
|
||
|
<a-button type="primary" @click="onSubmit">Create</a-button>
|
||
|
<a-button style="margin-left: 10px">Cancel</a-button>
|
||
|
</a-form-item> -->
|
||
|
</a-form>
|
||
|
|
||
|
|
||
|
|
||
|
</template>
|
||
|
|
||
|
<script setup lang='ts'>
|
||
|
import { reactive, toRaw, UnwrapRef } from 'vue';
|
||
|
interface FormState {
|
||
|
name: string;
|
||
|
ip: string;
|
||
|
CbCameraParamsId: string;
|
||
|
userName: string;
|
||
|
password: string;
|
||
|
userType: string | undefined;
|
||
|
state: boolean;
|
||
|
remark: string;
|
||
|
}
|
||
|
const props = defineProps({
|
||
|
handleOk: Function
|
||
|
});
|
||
|
|
||
|
let labelCol= { span: 6 }
|
||
|
let wrapperCol= { span: 14 }
|
||
|
const formState: UnwrapRef<FormState> = reactive({
|
||
|
name: '',
|
||
|
ip: '',
|
||
|
CbCameraParamsId: '',
|
||
|
userName: '',
|
||
|
password: '',
|
||
|
userType: undefined,
|
||
|
state: false,
|
||
|
remark: '',
|
||
|
});
|
||
|
const onSubmit = () => {
|
||
|
console.log('submit!', toRaw(formState));
|
||
|
};
|
||
|
|
||
|
//提交
|
||
|
function submit(){
|
||
|
|
||
|
|
||
|
}
|
||
|
|
||
|
|
||
|
</script>
|
||
|
|
||
|
<style lang="less" scoped>
|
||
|
|
||
|
:deep(.ant-input ){
|
||
|
color: #000;
|
||
|
}
|
||
|
</style>
|