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

feat：样式调整

Browse Source
This commit is contained in:
zhangyu
2021-02-09 17:12:42 +08:00
parent 8df2d9499d
commit 635b16b028
8 changed files with 49 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
nezha-fronted/src/assets/stylus/main.scss
View File

@@ -1388,7 +1388,7 @@ li{
.right-box-form>.el-form-item.half-form-item:nth-child(odd){
display: inline-block;
width: 395px;
margin-left: 0;
margin-left: 10px;
}
.right-box-form .one-third-form-item-left{
display: inline-block;
@@ -2176,11 +2176,11 @@ li{
color: #0275b8;
}
.tag-edit-tag{
width: 100px;
width: 180px;
padding: 0 10px;
}
.tag-edit-value{
width: calc(100% - 149px);
width: calc(100% - 235px);
padding: 0 10px;
}
.tag-edit-action {
@@ -2197,11 +2197,11 @@ li{
padding: 0 10px;
}
.tag-edit-tag{
width: 100px;
width: 180px;
padding: 0 10px;
}
.tag-edit-value{
width: calc(100% - 149px);
width: calc(100% - 235px);
padding: 0 10px;
}
.tag-edit-action {

168
nezha-fronted/src/components/common/project/L5/CanvasProps.vue
View File

@@ -265,85 +265,16 @@
</el-tab-pane>
<el-tab-pane :label="$t('project.topology.style')" name="4">
<el-collapse v-model="activeNames">
<!--位置大小-->
<el-collapse-item :label="$t('project.topology.positionAndSize')" name="3" v-if="selection.pen&&!selection.pen.type">
<!--&lt;!&ndash;位置大小&ndash;&gt;-->
<!--<el-collapse-item :label="$t('project.topology.positionAndSize')" name="3" v-if="selection.pen&&!selection.pen.type">-->
<!--<div class="flex flex-warp">-->
<!--</div>-->
<!--</el-collapse-item>-->
<!--样式-->
<el-collapse-item :label="'Style'" name="4" v-if="selection.pen">
<div class="flex flex-warp">
<div class="props-pen-item">
<div>X（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.x"
:readonly="readonly"
required
@change="onChange()"
></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>Y（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.y"
:readonly="readonly"
required
@change="onChange()"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.width')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.width"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.height')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.rect.height"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.circularBead')}}（0 - 1）</div>
<div class="p10 pl0">
@@ -382,87 +313,6 @@
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.pt')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.paddingTop"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.pb')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.paddingBottom"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.pl')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.paddingLeft"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
<div class="props-pen-item">
<div>{{$t('project.topology.pr')}}（px）</div>
<div class="p10 pl0">
<el-input-number
@focus="inputFocus"
@blur="inputBlur"
:precision="2"
controls-position="right"
size="small"
name="x"
class="input"
v-model.number="selection.pen.paddingRight"
:readonly="readonly"
required
@change="onChange()"
:min="0"></el-input-number>
</div>
</div>
</div>
</el-collapse-item>
<!--样式-->
<el-collapse-item :label="$t('project.topology.style')" name="4" v-if="selection.pen">
<div class="flex flex-warp">
<div class="props-pen-item" v-if="selection.pen&&!selection.pen.type">
<div>{{$t('project.topology.bac')}}</div>
<div class="p10 pl0">

4
nezha-fronted/src/components/common/rightBox/accountBox.vue
View File

@@ -64,10 +64,10 @@
<div class="right-box-line"></div>
<div id="account-input-box">
<el-form-item v-for="(notification, index) in editUser.notifications" :key="index" class="notification-item">
<el-select class='form-item-title' placeholder="" popper-class="no-style-class" size="small" v-model="notification.scriptId">
<el-select placeholder="" popper-class="no-style-class" size="small" v-model="notification.scriptId" style="display: inline-block;width: 100px;margin-left: 15px">
<el-option v-for="(item, i) in selectableScripts" :label="item.name" :key="i" :value="item.id" :disabled="item.disabled"></el-option>
</el-select>
<el-input placeholder="" v-model="notification.account" size="small" style="width: calc(100% - 37px);"></el-input>
<el-input placeholder="" v-model="notification.account" size="small" style="width: calc(100% - 157px);"></el-input>
<span @click="removeNotification(index)" style="padding-left: 5px;"><i class="nz-icon nz-icon-shanchu1"></i></span>
</el-form-item>
</div>

4
nezha-fronted/src/components/common/rightBox/addEndpointBox.vue
View File

@@ -24,7 +24,7 @@
</el-select>
</el-form-item>
<!--asset和endpoint-->
<div class="right-box-form-row right-child-boxes" style="height: calc(100% - 135px);">
<div class="right-box-form-row right-child-boxes" style="height: calc(100% - 190px);">
<div class="right-child-box assets-box">
<!--begin--标题-->
<div class="right-child-box-title">{{$t('asset.asset')}}</div>
@@ -1256,7 +1256,7 @@
.endpoint-sub-table {
padding-top: 13px;
height: calc(100% - 83px);
width: 260px;
width: 320px;
}
.line-100 {
margin-bottom: 3px;

57
nezha-fronted/src/components/common/rightBox/batchEditAsset.vue
View File

@@ -172,38 +172,34 @@
</div>
</div>
<div class="right-box-line"></div>
<el-form-item>
<template slot="label">
<span></span>
</template>
<div class="tag-edit-box">
<div class="tag-edit-box-head">
<div>Tag</div>
<div>Value</div>
<div>Action</div>
</div>
<div ref="tagEditBoxScrollbar" style="height: calc(100% - 32px); overflow: auto;" id="batch-edit-tags-box">
<div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
<el-form-item class="tag-edit tag-edit-tag"
:rules="{required: true, message: $t('validate.required'), trigger: 'change'}"
:prop="'tags.' + index + '.tag'">
<el-autocomplete placeholder="tag" size="mini" v-model="item.tag" :fetch-suggestions="filterKey"
@blur="loadValues(item)" @select="loadValues"
popper-class="no-style-class"></el-autocomplete>
</el-form-item>
<el-form-item class="tag-edit tag-edit-value"
:rules="{required: true, message: $t('validate.required'), trigger: 'change'}"
:prop="'tags.' + index + '.value'">
<el-autocomplete placeholder="value" size="mini" v-model="item.value" :fetch-suggestions="filterValue"
popper-class="no-style-class"></el-autocomplete>
</el-form-item>
<div class="param-box-row-symbol" :id="'asset-tag-remove-'+index" @click.stop="removeTag(index)"><i
class="nz-icon nz-icon-shanchu1" style="color: #666666"></i></div>
</div>
<el-form-item :label-width="'0px'">
<div class="tag-edit-box">
<div class="tag-edit-box-head">
<div class="tag-edit-tag">Tag</div>
<div class="tag-edit-value">Value</div>
<div class="tag-edit-action">Action</div>
</div>
<div ref="tagEditBoxScrollbar" style="height: calc(100% - 32px); overflow: auto;" id="batch-edit-tags-box">
<div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
<el-form-item class="tag-edit tag-edit-tag" :label-width="'0px'"
:rules="{required: true, message: $t('validate.required'), trigger: 'change'}"
:prop="'tags.' + index + '.tag'">
<el-autocomplete placeholder="tag" size="mini" v-model="item.tag" :fetch-suggestions="filterKey"
@blur="loadValues(item)" @select="loadValues"
popper-class="no-style-class"></el-autocomplete>
</el-form-item>
<el-form-item class="tag-edit tag-edit-value" :label-width="'0px'"
:rules="{required: true, message: $t('validate.required'), trigger: 'change'}"
:prop="'tags.' + index + '.value'">
<el-autocomplete placeholder="value" size="mini" v-model="item.value" :fetch-suggestions="filterValue"
popper-class="no-style-class"></el-autocomplete>
</el-form-item>
<div class="param-box-row-symbol tag-edit-action" :id="'asset-tag-remove-'+index" @click.stop="removeTag(index)"><i
class="nz-icon nz-icon-shanchu1" style="color: #666666"></i></div>
</div>
</div>
</div>
</el-form-item>
<!--<div class="right-box-sub-title">{{$t('asset.location')}}</div>-->
<!--<div class="right-box-line"></div>-->
<!------------------------------------------IDC---------------------------------------------->
@@ -632,7 +628,6 @@
},
save(){
if(this.prevent_opt.save){ return } ;
this.prevent_opt.save=true;
if(this.locationInfo){
if(this.locationInfo.idc){
this.editAsset.idcId=this.locationInfo.idc.id;
@@ -664,6 +659,7 @@
this.assetSelList.forEach((item)=>{
this.editAsset.assetIds.push(item.id);
});
this.prevent_opt.save=true;
this.$put('/asset/batch',this.editAsset).then(res=>{
this.prevent_opt.save=false;
if(res.code===200){
@@ -674,6 +670,7 @@
}
});
}else{
console.log(213123123123);
this.prevent_opt.save=false;
return false;
}

2
nezha-fronted/src/components/common/rightBox/moduleBox.vue
View File

@@ -21,7 +21,7 @@
<el-option :id="'module-project-'+item.id" v-for="item in projectList" :key="item.id" :label="item.name" :value="item"></el-option>
</el-select>
</el-form-item>
<el-form-item :label='$t("project.module.moduleName")' prop="name" label-width="125px" style="width: calc(100% - 8px);margin-left: 8px;">
<el-form-item :label='$t("project.module.moduleName")' prop="name" label-width="125px">
<el-input placeholder="" maxlength="64" show-word-limit v-model="editModule.name" size="small" id="module-box-input-name"></el-input>
</el-form-item>

4
nezha-fronted/src/components/page/dashboard/chartBox.vue
View File

@@ -1,6 +1,6 @@
<style scoped>
.el-row {
margin-bottom: 20px;
margin-bottom: 15px;
}
.el-row:last-child {
margin-bottom: 0;
@@ -241,8 +241,8 @@
<template slot-scope="{ item }">
<div class="name">{{ item }}</div>
</template>
<template slot="append">px</template>
</el-autocomplete>
<span class="nz-input-append">px</span>
</el-form-item>
<el-form-item :label='$t("dashboard.panel.chartForm.url")' :rules="{ required: true, message: $t('validate.required'), trigger: 'blur' }" prop="param.url" v-if="isUrl">

2
nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue
View File

@@ -22,7 +22,7 @@
<!--right-box里的样式-->
<template v-if="styleType == 2">
<el-row v-if="plugins.indexOf('metric-input') > -1 || plugins.indexOf('metric-selector') > -1" style="width: 100%;">
<el-col :style="{'width':plugins.indexOf('metric-selector') > -1 ? '120px':'100%', 'padding-right': '20px', 'text-align':plugins.indexOf('metric-selector') > -1 ? 'right':'left', 'color': '#666','font-weight':plugins.indexOf('metric-selector') > -1 ?'400':'bold'}">
<el-col :style="{'width':plugins.indexOf('metric-selector') > -1 ? '120px':'100%', 'padding': plugins.indexOf('metric-selector') > -1 ?'0 0 0 10px':'0 20px 0 0 ', 'text-align':left, 'color': '#666','font-weight':plugins.indexOf('metric-selector') > -1 ?'400':'bold'}">
<el-dropdown class="metric-selector" v-if="plugins.indexOf('metric-selector') > -1">
<el-dropdown-menu style="display: none"></el-dropdown-menu>
<span :class="{'expr-title':projectRightBox}" style="cursor: pointer;" @click="toggleDropdown">Metric&nbsp;<i class="nz-icon nz-icon-arrow-down" style="font-size: 14px; -webkit-transform:scale(0.75);display:inline-block;"></i></span>