<template>
|
<div class="create">
|
<el-form ref="device" label-position="right" label-width="120px" :model="bayonet" :rule="rules">
|
<!-- 卡口名称 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="卡口名称:" prop="name">
|
<el-input v-model="bayonet.name" placeholder="请填写卡口名称"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 经纬度位置 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="经纬度位置:" prop="longitude">
|
<el-input v-model="bayonet.longitude" placeholder="请填写经度位置"></el-input>
|
</el-form-item>
|
<el-form-item prop="latitude">
|
<el-input v-model="bayonet.latitude" placeholder="请填写纬度位置"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 所属区域 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="所属区域:" prop="area">
|
<el-input v-model="bayonet.area" placeholder="请填写区域名称"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 域名/ip -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="域名/IP:" prop="domainName">
|
<el-input v-model="bayonet.domainName" placeholder="请填写域名或者IP"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 端口号 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="端口号:" prop="port">
|
<el-input v-model="bayonet.port" placeholder="请输入端口号"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 前端类型 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="前端类型:" prop="webType">
|
<el-input v-model="bayonet.webType" placeholder="请输入前端类型"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 出入城类型 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="出入城类型:" prop="cityType">
|
<el-input v-model="bayonet.cityType" placeholder="出城/入城"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 描述 -->
|
<div class="device-item">
|
<div class="item-left">
|
<el-form-item label="描述:" prop="description">
|
<el-input type="textarea" :rows='5' maxlength="200" v-model="bayonet.description" placeholder="请输入描述内容200字以内"></el-input>
|
</el-form-item>
|
</div>
|
<div class="item-right"></div>
|
</div>
|
<!-- 按钮 -->
|
<div class="device-btn">
|
<el-button>返回</el-button>
|
<el-button type="primary">确定</el-button>
|
</div>
|
</el-form>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
bayonet: {
|
bayonetName: '',
|
latitude: '',
|
longitude: '',
|
area: '',
|
ipAddress: '',
|
port: '',
|
frontEndType: '',
|
inOutCityType: '',
|
description: '',
|
},
|
rules: {
|
|
}
|
}
|
},
|
|
}
|
</script>
|
<style lang="scss" scoped>
|
.create {
|
padding: 20px;
|
|
.device-item {
|
display: flex;
|
|
.item-left {
|
flex: 6;
|
display: flex;
|
|
.el-form-item {
|
flex: 1;
|
}
|
}
|
|
.item-right {
|
flex: 4;
|
}
|
}
|
|
.device-btn {
|
padding-top: 20px;
|
display: flex;
|
justify-content: center;
|
}
|
}
|
</style>
|
