gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: project部分功能

Browse Source 
1.具体为endpoint的弹框，包括param、host
2.部分样式统一抽取
This commit is contained in:
chenjinsong
2019-12-11 17:15:23 +08:00
parent b40faefc84
commit 3b00a52538
6 changed files with 495 additions and 767 deletions
Download Patch File Download Diff File Expand all files Collapse all files

142
nezha-fronted/src/components/page/config/promServer.vue
View File

@@ -23,144 +23,6 @@
.content-right-option .el-icon-view:hover {
color: #409EFF;
}
/* begin--右侧弹框*/
.right-box {
position: fixed;
top: 80px;
right: 15px;
z-index: 1;
border-radius: 8px;
box-shadow: 0 0 15px #ccc;
background-color: white;
padding: 0 20px;
}
.right-box-prom {
width: 550px;
height: calc(100% - 100px);
}
/* begin--右侧弹框--顶部按钮*/
.right-box-top-btns {
text-align: center;
}
.right-box-top-btn {
border-radius: 0 0 9px 9px;
float: right;
color: #656565;
height: 30px;
font-size: 12px;
padding: 3px 8px 1px 8px;
border: 1px solid #aaaaaa;
border-top: none;
cursor: pointer;
margin-left: 20px;
}
.right-box-top-btn-full {
background-color: #656565;
border: 1px solid #656565;
border-top: none;
color: white;
}
/* end--右侧弹框--顶部按钮*/
/* begin--右侧弹框--内容*/
.right-box-title {
height: 30px;
line-height: 40px;
text-align: left;
}
.right-box-form {
margin-top: 35px;
}
.right-box-form-row {
margin-top: 25px;
}
.right-box-form-label {
margin-bottom: 8px;
text-align: left;
}
.right-box-form-content {
line-height: 32px;
text-align: left;
width: 100%;
}
.right-box-form-content-txt {
padding-left: 11px;
}
.right-box-form-content .el-select {
width: calc(100% - 38px);
vertical-align: top;
}
.el-select-add-btn {
width: 33px;
height: 33px;
display: inline-block;
text-align: center;
border-radius: 5px;
border: 1px solid #DCDFE6;
box-sizing: border-box;
color: #C7C9CE;
transition: border-color .2s cubic-bezier(.645,.045,.355,1);
}
.el-select-add-btn:hover {
border: 1px solid #C0C4CC;
cursor: pointer;
}
/* end--右侧弹框--内容*/
/* begin--右侧弹框--底部按钮*/
.right-box-bottom-btns {
position: absolute;
bottom: 0;
width: 100%;
height: 40px;
left: 0;
text-align: center;
}
.right-box-bottom-btn:first-of-type {
border-bottom-left-radius: 8px;
}
.right-box-bottom-btn:last-of-type{
border-bottom-right-radius: 8px;
}
.right-box-bottom-btn {
display: inline-block;
background-color: #656565;
color: white;
height: 100%;
line-height: 40px;
cursor: pointer;
width: 100%;
}
.config-dropdown-label-input {
width: 50%;
display: inline-block;
}
.right-box-bottom-btn-cancel {
background-color: #DADADA;
color: #656565;
}
.right-box-bottom-btn-50 {
width: 50%;
}
/* end--右侧弹框--底部按钮*/
/* end--右侧弹框*/
/* begin--右弹框滑入滑出动画*/
@keyframes slide-in-from-right {
from {right: -800px}
to {right: 0}
}
@keyframes slide-out-to-right {
from {right: 0}
to {right: -800px}
}
.right-box-enter-active {
animation: slide-in-from-right 0.4s;
}
.right-box-leave-active {
animation: slide-out-to-right 0.4s;
}
/* end--右弹框滑入滑出动画*/
</style>
<template>
<div class="prom">
@@ -249,7 +111,7 @@
<div class="right-box-form-row">
<div class="right-box-form-label">IDC</div>
<div class="right-box-form-content">
<el-select value-key="id" popper-class="config-dropdown" v-model="promServer.idc" placeholder="" v-if="rightBox.isEdit" size="small">
<el-select class="right-box-row-with-btn" value-key="id" popper-class="config-dropdown" v-model="promServer.idc" placeholder="" v-if="rightBox.isEdit" size="small">
<el-option
@click.native="blurEditIdc()"
v-for="item in idcData"
@@ -272,7 +134,7 @@
<span class="config-dropdown-btn config-dropdown-btn-delete" @click.stop="toDelIdc(item)"><i class="el-icon-delete"></i></span>
</el-option>
</el-select>
<div class="el-select-add-btn" v-if="rightBox.isEdit">
<div class="right-box-row-btn" v-if="rightBox.isEdit">
<span class="el-icon-plus"></span>
</div>
<div class="right-box-form-content-txt" v-if="!rightBox.isEdit">{{promServer.idc.name}}</div>