朱兆平 / vue_cli · 提交

转到一个项目

作者 王勇
提交 caabaf3a987ce61778fb6d6615d8151964fb644f 1 个父辈 70d728fe

服务器增加创建选项

内嵌 并排对比
正在显示 1 个修改的文件 包含 73 行增加 和 10 行删除
... ... @@ -27,10 +27,13 @@
<el-table-column type="selection" width="55" align="center"></el-table-column>
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="服务器名称" prop="serverName" align="center" width="180"></el-table-column>
<el-table-column label="服务器地址" prop="serverIp" align="center" width="180"></el-table-column>
<el-table-column label="服务器端口号" prop="serverPort" align="center" width="160"></el-table-column>
<el-table-column label="服务器地址" prop="serverIp" align="center" width="200"></el-table-column>
<el-table-column label="服务器端口号" prop="serverPort" align="center" width="150"></el-table-column>
<el-table-column label="客户端端口号" prop="clientPort" align="center" width="150"></el-table-column>
<el-table-column label="超级用户名称" prop="superUsername" align="center"
width="150"></el-table-column>
<el-table-column label="相关描述" prop="description" align="center" width="300"></el-table-column>
<el-table-column label="操作" width="300px" align="center">
<el-table-column label="操作" width="300px" align="center" fixed="right">
<template slot-scope="scope">
<!-- 虚拟主机 -->
<el-tooltip effect="dark" content="虚拟主机" placement="top-start" :enterable="false">
... ... @@ -38,7 +41,6 @@
@click="toVirtualHost(scope.$index,scope.row)">虚拟主机
</el-button>
</el-tooltip>
<!-- 编辑按钮 -->
<el-tooltip effect="dark" content="编辑" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="mini"
... ... @@ -86,8 +88,7 @@
style="margin-top: -50px"
width="50%" text-align="center" @close="serverAddDialogClosed">
<el-form :inline="true" :model="addServerForm" label-width="120px" status-icon
:rules="addServerFormRules" ref="addServerFormRef"
align="center">
:rules="addServerFormRules" ref="addServerFormRef" style="margin-top: -30px" align="center">
<el-form-item label="服务器名称：" prop="serverName">
<el-input v-model="addServerForm.serverName" style="width:270px" size="small" clearable
placeholder="请输入服务器名称"></el-input>
... ... @@ -96,10 +97,26 @@
<el-input v-model="addServerForm.serverIp" style="width:270px" size="small" clearable
placeholder="请输入服务器IP地址"></el-input>
</el-form-item>
<el-form-item label="端口号：" prop="serverPort">
<el-form-item label="服务器端口号：" prop="serverPort">
<el-input v-model="addServerForm.serverPort" style="width:270px" size="small" clearable
placeholder="请输入服务器端口号"></el-input>
</el-form-item>
<el-form-item label="客户端端口号：" prop="clientPort">
<el-input v-model="addServerForm.clientPort" style="width:270px" size="small" clearable
placeholder="请输入客户端端口号"></el-input>
</el-form-item>
<el-form-item label="超级用户名称：" prop="superUsername">
<el-input v-model="addServerForm.superUsername" style="width:270px" size="small" clearable
placeholder="请输入超级用户名称"></el-input>
</el-form-item>
<el-form-item label="超级用户密码：" prop="firstPassword">
<el-input type="password" v-model="addServerForm.firstPassword" style="width:270px"
size="small" clearable show-password placeholder="请输入超级用户密码"></el-input>
</el-form-item>
<el-form-item label="重新输入密码：" prop="superPassword">
<el-input type="password" v-model="addServerForm.superPassword" style="width:270px"
size="small" clearable show-password placeholder="请重新输入密码"></el-input>
</el-form-item>
<el-form-item label="相关描述：" prop="description">
<el-input v-model="addServerForm.description" placeholder="请输入相关描述"
style="width:270px" size="small" clearable
... ... @@ -107,7 +124,7 @@
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<div slot="footer" class="dialog-footer" style="text-align: center;margin-top: -20px">
<el-button type="info" @click="serverDialog.addDialog = false" size="medium"
style="width: 100px">取消
</el-button>
... ... @@ -138,11 +155,21 @@
readonly disabled
placeholder="请输入服务器IP地址"></el-input>
</el-form-item>
<el-form-item label="端口号：" prop="serverPort">
<el-form-item label="服务器端口号：" prop="serverPort">
<el-input v-model="editServerForm.serverPort" style="width:270px" size="small" clearable
readonly disabled
placeholder="请输入服务器端口号"></el-input>
</el-form-item>
<el-form-item label="客户端端口号：" prop="clientPort">
<el-input v-model="editServerForm.clientPort" style="width:270px" size="small" clearable
readonly disabled placeholder="请输入客户端端口号"></el-input>
</el-form-item>
<el-form-item label="超级用户名称：" prop="superUsername">
<el-input v-model="editServerForm.superUsername" style="width:270px" size="small" clearable
readonly disabled placeholder="请输入超级用户名称"></el-input>
</el-form-item>
<el-form-item label="相关描述：" prop="description">
<el-input v-model="editServerForm.description" placeholder="请输入相关描述"
style="width:270px" size="small" clearable
... ... @@ -179,6 +206,15 @@
name: "Server",
data() {
const validatePassword = (rule, value, callback) => {
if (value === '') {
callback(new Error('请重新输入密码'));
} else if (value !== this.addServerForm.firstPassword) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};
// 验证IP地址的自定义规则
const serverIpValid = (rule, value, callback) => {
// 验证IP地址的正则表达式
... ... @@ -212,6 +248,14 @@
serverIp: '',
// 服务器端口号
serverPort: undefined,
// 客户端端口号
clientPort: undefined,
// 超级用户名称
superUsername: '',
// 第一次输入密码
firstPassword: '',
// 超级用户密码
superPassword: '',
// 相关描述
description: '',
},
... ... @@ -271,7 +315,7 @@
],
serverIp: [
{required: true, message: '请输入服务器IP地址', trigger: ['blur', 'change']},
{validator: serverIpValid, trigger: 'blur'}
{validator: serverIpValid, trigger: ['blur', 'change']}
],
serverPort: [
{required: true, message: '请输入服务器端口号', trigger: ['blur', 'change']},
... ... @@ -279,6 +323,19 @@
description: [
{required: true, message: '请输入服务器相关描述', trigger: ['blur', 'change']},
],
clientPort: [
{required: true, message: '请输入客户端端口号', trigger: ['blur', 'change']},
],
superUsername: [
{required: true, message: '请输入超级用户名称', trigger: ['blur', 'change']},
],
firstPassword: [
{required: true, message: '请输入超级用户密码', trigger: ['blur', 'change']},
],
superPassword: [
{required: true, message: '请重新输入密码', trigger: ['blur', 'change']},
{validator: validatePassword, trigger: ['blur', 'change']}
],
},
/**
* 编辑服务器，表单的验证规则对象
... ... @@ -297,6 +354,12 @@
description: [
{required: true, message: '请输入服务器相关描述', trigger: ['blur', 'change']},
],
clientPort: [
{required: true, message: '请输入客户端端口号', trigger: ['blur', 'change']},
],
superUsername: [
{required: true, message: '请输入超级用户名称', trigger: ['blur', 'change']},
],
},
}
},
... ...