113 lines
4.0 KiB
Vue
113 lines
4.0 KiB
Vue
<template>
|
|
<div>
|
|
<!-- <div class="data_acquire">
|
|
<el-button type="info" plain @click="outerVisible = true">数据采集设备</el-button>
|
|
</div> -->
|
|
<div>
|
|
<el-dialog title="新建网关" :visible.sync="outerVisible" width="382px">
|
|
<el-form :model="formdata" :rules="rules" ref="ruleForm" label-width="85px" class="demo-ruleForm">
|
|
<el-form-item label="网关名称:" prop="name">
|
|
<el-input v-model="formdata.name" placeholder="" style="width: 200px;"></el-input>
|
|
<el-select v-model="formdata.name" placeholder="有线区网关1" style="width: 200px;">
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="网关类型:" prop="type">
|
|
<el-select v-model="formdata.type" placeholder="lot Life 网关" style="width: 200px;">
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-dialog width="382px" title="系统提示" :visible.sync="innerVisible" append-to-body>
|
|
<p class="inner_content">请确认选择的网关类型与网关实体一致:否则该工程无法下载至实体网关</p>
|
|
<div slot="footer" class="dialog-footer">
|
|
<el-button type="primary" @click="innerConfirm">确定</el-button>
|
|
<el-button @click="innerVisible = false">取 消</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
<div slot="footer" class="dialog-footer-outer">
|
|
<el-button type="primary" @click="innerVisible = true">保存</el-button>
|
|
<el-button @click="outerVisible = false">取 消</el-button>
|
|
</div>
|
|
</el-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'TestDataAcquisition',
|
|
|
|
data() {
|
|
return {
|
|
input1: "",
|
|
options: [{
|
|
value: 'loT Lite网关',
|
|
label: 'loT Lite网关'
|
|
}, {
|
|
value: 'MODBUS网关',
|
|
label: 'MODBUS网关'
|
|
}, {
|
|
value: 'BACNET网关',
|
|
label: 'BACNET网关'
|
|
}, {
|
|
value: 'OPC UA网关',
|
|
label: 'OPC UA网关'
|
|
}, {
|
|
value: 'OPC DA网关',
|
|
label: 'OPC DA网关'
|
|
},
|
|
{
|
|
value: 'loT网关',
|
|
label: 'loT网关'
|
|
}],
|
|
value: '',
|
|
formdata: {
|
|
name: "Gateway",
|
|
type: "loT网关"
|
|
},
|
|
rules: {
|
|
name: [
|
|
{ required: true, message: '请输入网关名称', trigger: 'blur' },
|
|
{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
|
|
],
|
|
type: [
|
|
{ required: true, message: '请选择活动区域', trigger: 'change' }
|
|
],
|
|
},
|
|
outerVisible: true,
|
|
innerVisible: false,
|
|
};
|
|
},
|
|
|
|
mounted() {
|
|
|
|
},
|
|
|
|
methods: {
|
|
innerConfirm() {
|
|
this.outerVisible = false;
|
|
this.innerVisible = false;
|
|
this.$router.replace("/channelconfig");
|
|
}
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.data_acquire {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.inner_content {
|
|
margin-left: 30px;
|
|
width: 280px;
|
|
height: 40px;
|
|
// color: rgba(255, 255, 255, 0);
|
|
font-size: 14px;
|
|
text-align: left;
|
|
font-family: SourceHanSansSC-regular;
|
|
}
|
|
</style> |