Skip to content

A
apaas-ui
Commit 05c94b84 authored by 刘殿昕's avatar 刘殿昕
Browse files
Options

Merge branch 'ldx' into dev

parents 5d143bcf f1796d24
Hide whitespace changes
Inline Side-by-side
Showing with 235 additions and 48 deletions
src/pages/user/user_info.vue
View file @ 05c94b84
......@@ -9,53 +9,109 @@
<el-tab-pane label="个人信息详情" name="0"></el-tab-pane>
<el-tab-pane label="业务系统详情" name="1"></el-tab-pane>
</el-tabs>
<el-form ref="form" :model="form">
<el-form-item class="info_item">
<p>账号：</p>
<el-input v-model="form.accountNo"></el-input>
</el-form-item>
<el-form-item class="info_item info_item_right_btn">
<p>密码：</p>
<el-input v-model="form.password"></el-input>
<el-button class="option_btn" @click="changePassword">修改密码</el-button>
</el-form-item>
<el-form-item class="info_item">
<p>昵称：</p>
<el-input v-model="form.nickname"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>头像：</p>
<upload-file
:multiple="false"
:max="1"
type="cropper"
:readOnly="false"
:list="imgList"
@getNewList="getNewList"
></upload-file>
</el-form-item>
<el-form-item class="info_item">
<p>联系人：</p>
<el-input v-model="form.contactPerson"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>手机号：</p>
<el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>邮箱：</p>
<el-input v-model="form.email"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>组织机构：</p>
<el-input v-model="form.organization"></el-input>
</el-form-item>
<el-form-item class="info_item info_item_right_btn">
<p>当前角色：</p>
<el-input v-model="form.role"></el-input>
<el-button class="option_btn" @click="upLevel">升级为开发者</el-button>
</el-form-item>
</el-form>
<div v-if="activeName == '0'">
<el-form ref="form" :model="form">
<el-form-item class="info_item">
<p>账号：</p>
<el-input v-model="form.accountNo"></el-input>
</el-form-item>
<el-form-item class="info_item info_item_right_btn">
<p>密码：</p>
<el-input v-model="form.password"></el-input>
<el-button class="option_btn" @click="changePassword">修改密码</el-button>
</el-form-item>
<el-form-item class="info_item">
<p>昵称：</p>
<el-input v-model="form.nickname"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>头像：</p>
<upload-file
:multiple="false"
:max="1"
type="cropper"
:readOnly="false"
:list="imgList"
@getNewList="getNewList"
></upload-file>
</el-form-item>
<el-form-item class="info_item">
<p>联系人：</p>
<el-input v-model="form.contactPerson"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>手机号：</p>
<el-input v-model="form.phone"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>邮箱：</p>
<el-input v-model="form.email"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>组织机构：</p>
<el-input v-model="form.organization"></el-input>
</el-form-item>
<el-form-item class="info_item info_item_right_btn">
<p>当前角色：</p>
<el-input v-model="form.role"></el-input>
<el-button class="option_btn" @click="upLevel">升级为开发者</el-button>
</el-form-item>
</el-form>
</div>
<div v-if="activeName == '1'">
<el-form ref="formBusiness" :model="formBusiness">
<el-form-item class="info_item">
<p>业务系统名：</p>
<el-input v-model="formBusiness.businessSystemName"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>域名：</p>
<el-input v-model="formBusiness.domainName"></el-input>
</el-form-item>
<el-form-item class="info_item">
<p>IP（白名单）：</p>
<div class="ip_block">
<div v-for="item in formBusiness.ip_white" :key="item.id" class="ip_item">
{{ item.ip }}
<i class="el-icon-close ip_del" @click="delIp(item.ip, 'white')"></i>
</div>
<el-input
v-if="whiteAddShow"
class="ip_input"
v-model="newIpWhite"
@keyup.enter.native="watchKeyboardWhite"
></el-input>
<el-button class="add_ip" @click="addIp('white')" icon="el-icon-plus">增加</el-button>
</div>
</el-form-item>
<el-form-item class="info_item">
<p>IP（黑名单）：</p>
<div class="ip_block">
<div v-for="item in formBusiness.ip_black" :key="item.id" class="ip_item">
{{ item.ip }}
<i class="el-icon-close ip_del" @click="delIp(item.ip, 'black')"></i>
</div>
<el-input
v-if="blackAddShow"
class="ip_input"
v-model="newIpBlack"
@keyup.enter.native="watchKeyboardBlack"
></el-input>
<el-button class="add_ip" @click="addIp('black')" icon="el-icon-plus">增加</el-button>
</div>
</el-form-item>
<el-form-item class="info_item info_item_right_btn_2">
<p>密钥：</p>
<el-input ref="keys" v-model="formBusiness.key"></el-input>
<el-button class="option_btn" @click="copyKey">复制</el-button>
<el-button class="option_btn_gray" @click="upLevel">重置</el-button>
</el-form-item>
<el-form-item class="info_item">
<p>描述：</p>
<el-input type="textarea" :rows="2" v-model="formBusiness.description"></el-input>
</el-form-item>
</el-form>
</div>
<div class="btn_footer">
<el-button class="previous" @click="previous">取消</el-button>
<el-button class="registe" @click="registe">修改</el-button>
......@@ -112,6 +168,32 @@ export default {
role: ""
},
imgList: [],
formBusiness: {
businessSystemName: "",
domainName: "",
ip_white: [
{ ip: "255.255.255.255", id: "123789244" },
{ ip: "255.255.255.255", id: "123576744" },
{ ip: "255.255.255.255", id: "123467866874" },
{ ip: "255.255.255.255", id: "1226783544" }
],
ip_black: [
{ ip: "255.255.255.255", id: "12773844" },
{ ip: "255.255.255.255", id: "12561344" },
{ ip: "255.255.255.255", id: "1235672344" },
{ ip: "255.255.255.255", id: "12342314" },
{ ip: "255.255.255.255", id: "12386444" },
{ ip: "255.255.255.255", id: "12783544" },
{ ip: "255.255.255.255", id: "121678344" },
{ ip: "255.255.255.255", id: "127678344" }
],
key: "",
description: ""
},
whiteAddShow: false,
blackAddShow: false,
newIpWhite: "",
newIpBlack: "",
diaPassWord: false
}),
mounted() {
......@@ -135,6 +217,50 @@ export default {
submitChangePwd() {},
upLevel() {
this.diaPassWord = true;
},
copyKey() {
this.$refs.keys.select();
document.execCommand("Copy");
this.$message({
message: "复制成功",
type: "success"
});
},
delIp(ip, type) {
console.log(ip, type);
},
addIp(type) {
if (type == "white") {
this.whiteAddShow
? this.$message({
message: "请按回车完善本次ip填写",
type: "error"
})
: (this.whiteAddShow = true);
} else if (type == "black") {
this.blackAddShow
? this.$message({
message: "请按回车完善本次ip填写",
type: "error"
})
: (this.blackAddShow = true);
}
},
watchKeyboardWhite() {
let self = this;
if (self.newIpWhite != "") {
self.formBusiness.ip_white.push({ ip: self.newIpWhite, id: 0 });
self.whiteAddShow = false;
self.newIpWhite = "";
}
},
watchKeyboardBlack() {
let self = this;
if (self.newIpBlack != "") {
self.formBusiness.ip_black.push({ ip: self.newIpBlack, id: 0 });
self.blackAddShow = false;
self.newIpBlack = "";
}
}
}
};
......@@ -147,7 +273,7 @@ export default {
.btn_footer {
display: flex;
justify-content: flex-end;
margin: 40px 20px 10px;
margin: 60px 20px 10px;
}
.previous {
width: 100px;
......@@ -165,6 +291,12 @@ export default {
border-radius: 8px;
color: #f8f9fd;
}
.option_btn_gray {
width: 124px;
background-color: #e3e5ef;
border-radius: 8px;
color: #0f2683;
}
.info_item {
width: 70%;
min-width: 600px;
......@@ -191,12 +323,60 @@ export default {
justify-content: flex-end;
margin: 20px 0 0;
}
.ip_block {
border-radius: 8px;
border: solid 1px #e3e5ef;
padding: 10px 0 0 10px;
line-height: 24px;
}
.ip_item {
display: inline-block;
position: relative;
background-color: #e6ebfe;
border-radius: 4px;
color: #0f2683;
font-size: 12px;
line-height: 24px;
padding: 0 26px 0 8px;
margin-right: 10px;
margin-bottom: 10px;
}
.ip_del {
position: absolute;
right: 8px;
top: 6px;
font-size: 14px;
color: #6573ae;
cursor: pointer;
}
.ip_del:hover {
color: #e56600;
}
.add_ip {
background-color: #495feb;
border-radius: 4px;
color: #f8f9fd;
font-size: 12px;
line-height: 24px;
padding: 0 8px;
margin-right: 10px;
margin-bottom: 10px;
}
.ip_input {
width: 110px;
margin-right: 10px;
margin-bottom: 10px;
}
</style>
<style>
.info_item_right_btn .el-input {
width: calc(100% - 140px);
margin-right: 10px;
}
.info_item_right_btn_2 .el-input {
width: calc(100% - 280px);
margin-right: 10px;
}
.info_block .el-dialog__wrapper {
padding-left: 180px;
}
......@@ -209,4 +389,11 @@ export default {
.info_block .el-dialog__body {
padding: 15px 20px 20px;
}
.ip_input .el-input__inner {
border-radius: 4px;
padding: 0 8px;
font-size: 12px;
line-height: 24px;
height: 24px;
}
</style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment