InternetCompetition/src/components/Wireles.vue

97 lines
3.0 KiB
Vue

<template>
<div>
<el-button @click="dialogVisible = true">无线设置</el-button>
<el-dialog
title="无线设置"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose"
>
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
label-width="150px"
class="demo-ruleForm"
:label-position="labelPosition"
>
<el-form-item label="工作模式:" prop="gzms">
<el-col :span="10">
<el-select v-model="ruleForm.gzms">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="网络名称:" prop="wlmc">
<el-col :span="10">
<el-select v-model="ruleForm.wlmc">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="MAC地址:" prop="mac">
<el-col :span="10">
<el-input v-model="ruleForm.mac"> </el-input>
</el-col>
</el-form-item>
<el-form-item label="加密模式:" prop="jmms">
<el-col :span="10">
<el-select v-model="ruleForm.jmms">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="加密算法:" prop="jmsf">
<el-col :span="10">
<el-select v-model="ruleForm.jmsf">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-col>
</el-form-item>
<el-form-item label="密码:" prop="mm">
<el-col :span="10">
<el-input v-model="ruleForm.mm"> </el-input>
</el-col>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false"
>保存</el-button
>
<el-button @click="dialogVisible = false"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
dialogVisible: false,
labelPosition: "left",
ruleForm: {
gzms: "",
wlmc: "",
mac: "",
jmms: "",
jmsf: "",
mm: "",
},
rules: {
gzms: [{ required: true, trigger: "change" }],
wlmc: [{ required: true, trigger: "change" }],
mac: [{ trigger: "blur" }],
jmms: [{ required: true, trigger: "blur" }],
jmsf: [{ required: true, trigger: "blur" }],
mm: [{ required: true, trigger: "blur" }],
},
};
},
};
</script>