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

style: select 样式调整

Browse Source
This commit is contained in:
@changcode
2021-09-27 10:25:19 +08:00
parent ba515a8277
commit 9a07b6e454
4 changed files with 14 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
nezha-fronted/src/assets/css/common/rightBoxCommon.scss
View File

@@ -275,9 +275,6 @@
}
.right-box-dropdown-top {
min-width: 625px;
.el-cascader-menu{
flex: 1;
}
}
.limit-height .el-cascader-menu {
max-height: 200px;

2
nezha-fronted/src/components/common/popBox/selectAssetType.vue
View File

@@ -1,5 +1,5 @@
<template>
<el-popover ref="selectAssetTypePopBox" v-model="popBox.show" :placement="placement" :width="width" popper-class="nz-pop nz-pop-select-panel right-public-box-dropdown" transition="slide">
<el-popover ref="selectAssetTypePopBox" v-model="popBox.show" :placement="placement" :width="width" popper-class="nz-pop nz-pop-select-panel right-box-select-top right-public-box-dropdown-top" transition="slide">
<div>
<div class="pop-item-wider">

8
nezha-fronted/src/components/common/rightBox/asset/assetBox.vue
View File

@@ -50,7 +50,7 @@
:placeholder="lockModelInputValue"
:options="options.brandAndModelOptions"
:props="{ label: 'name', value: 'id' }"
popper-class="prevent-clickoutside right-public-box-dropdown-top right-box-select-top limit-height"
popper-class="prevent-clickoutside right-public-box-dropdown-top right-public-box-select-top limit-height"
size="small"
style="width: 100%;"
></el-cascader>
@@ -135,7 +135,7 @@
v-model="label.value[0]"
:type="JSON.parse(label.param).subType === assetConstants.labelSubTypeData.date ? 'dateRange' : 'datetimerange'"
placeholder=""
popper-class="right-box-select-format-dropdown"
popper-class="right-box-select-top right-public-box-dropdown-top"
size="small"
style="width: 100%">
</my-date-picker>
@@ -146,7 +146,7 @@
v-model="label.value[0]"
:type="JSON.parse(label.param).subType"
placeholder=""
popper-class="right-box-select-format-dropdown"
popper-class="right-box-select-top right-public-box-dropdown-top"
size="small"
style="width: 100%"
value-format="yyyy-MM-dd">
@@ -168,7 +168,7 @@
:options="options.fieldGroupOptions"
:props="labelCascProp"
class="hide-input"
popper-class="prevent-clickoutside right-public-box-dropdown-top asset-right-box-dropdown-width limit-height"
popper-class="prevent-clickoutside right-box-dropdown-top asset-right-box-dropdown-width limit-height"
size="small"
@change="addLabel"
></el-cascader>

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

@@ -204,7 +204,7 @@
<div class="form-items--half-width-group">
<!-- type -->
<el-form-item :label="$t('dashboard.panel.chartForm.type')" class="form-item--half-width" prop="type">
<el-select id="chart-box-type" v-model="editChart.type" :disabled="editChart.type==='group'&&editChart.children&&editChart.children.length" placeholder="" popper-class="chart-box-dropdown-width prevent-clickoutside" size="small" value-key="chartType" @change="chartTypeChange">
<el-select id="chart-box-type" v-model="editChart.type" :disabled="editChart.type==='group'&&editChart.children&&editChart.children.length" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartType" @change="chartTypeChange">
<el-option v-for="item in chartTypeList" :key="item.id" :disabled=" item.id==='group' && editChart.isGroup" :label="item.name" :value="item.id">
<span class="panel-dropdown-label-txt" >{{item.name}}</span>
</el-option>
@@ -223,7 +223,7 @@
<!-- varType -->
<el-form-item :label="$t('dashboard.panel.chartForm.varType')" v-if="from === 'chartTemp'">
<el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" clearable placeholder="" size="small" value-key="chartType">
<el-select id="chart-box-group" v-model="editChart.varType" :disabled="!!editChart.id" class="right-box__select" popper-class="right-box-select-top right-public-box-dropdown-top prevent-clickoutside" clearable placeholder="" size="small" value-key="chartType">
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in varTypeArr">
<span class="panel-dropdown-label-txt" >{{item.name}}</span>
</el-option>
@@ -238,7 +238,7 @@
<div class="form-items--half-width-group">
<!--width-->
<el-form-item :label="$t('dashboard.panel.chartForm.width')" class="form-item--half-width" prop="span">
<el-select id="chart-box-span" v-model="editChart.span" :disabled="editChart.type === 'group'" placeholder="" popper-class="chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" size="small" value-key="chartSpan">
<el-select id="chart-box-span" v-model="editChart.span" :disabled="editChart.type === 'group'" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartSpan">
<el-option v-for="item in spanList" :key="item" :label="'span-' + item" :value="item">
<span class="panel-dropdown-label-txt" > span-{{item}}</span>
</el-option>
@@ -263,7 +263,7 @@
</el-autocomplete>-->
<!-- 由px改为span -->
<el-select id="chart-box-height" v-model="editChart.height" :disabled="editChart.type === 'group'" placeholder="" popper-class="chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" size="small" value-key="chartSpan">
<el-select id="chart-box-height" v-model="editChart.height" :disabled="editChart.type === 'group'" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" value-key="chartSpan">
<el-option v-for="item in spanList" :key="item" :label="'span-' + item" :value="item">
<span class="panel-dropdown-label-txt" > span-{{item}}</span>
</el-option>
@@ -274,7 +274,7 @@
<el-form-item v-show="editChart.type !='text' && editChart.type !=='url'&& editChart.type !=='group'&& editChart.type !=='diagram'" :label="$t('dashboard.panel.chartForm.unit')" class="form-item--half-width" prop="unit">
<el-cascader id="chart-box-unit" v-model="editChart.unit" :options="unitOptions" :props="{ expandTrigger: 'hover',emitPath:false }" :show-all-levels="false" filterable
placeholder=""
popper-class="chart-box-dropdown-option-top dc-dropdown right-public-box-dropdown-top prevent-clickoutside chart-box-unit"
popper-class="dc-dropdown right-public-box-select-top right-public-box-dropdown-top prevent-clickoutside chart-box-unit"
size="small"
style="width: 100%"
@change="unitSelected"
@@ -291,7 +291,7 @@
</el-form-item>-->
<!--lock-->
<el-form-item v-if="editChart.type ==='diagram'" :label="$t('dashboard.panel.chartForm.lock')" class="form-item--half-width" prop="lock">
<el-select id="chart-box-statistics" v-model="editChart.param.lock" placeholder="" popper-class="chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" size="small" @change="$forceUpdate">
<el-select id="chart-box-statistics" v-model="editChart.param.lock" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="$forceUpdate">
<el-option v-for="item in lockList" :key="item.value" :label="item.label" :value="item.value" class="width310">
<span class="panel-dropdown-label-txt" >{{item.label}}</span>
</el-option>
@@ -303,20 +303,20 @@
</el-form-item>
<el-form-item v-if="editChart.type === 'line' || editChart.type == 'bar' || editChart.type == 'stackArea' || editChart.type == 'table'" :label='"Null value"' class="form-item--half-width" prop="nullType">
<el-select id="chart-box-nullType" v-model="editChart.param.nullType" placeholder="" popper-class="chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" size="small" @change="$forceUpdate()" class="width310">
<el-select id="chart-box-nullType" v-model="editChart.param.nullType" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="$forceUpdate()" class="width310">
<el-option v-for="item in nullTypeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="editChart.type == 'singleStat' || editChart.type == 'pie'|| editChart.type=='table' || editChart.type == 'bar'" :label="$t('dashboard.panel.chartForm.statistics')" class="form-item--half-width" prop="param.statistics">
<el-select id="chart-box-statistics" v-model="editChart.param.statistics" placeholder="" popper-class="chart-box-dropdown-option-top chart-box-dropdown-width prevent-clickoutside" size="small" @change="$forceUpdate">
<el-select id="chart-box-statistics" v-model="editChart.param.statistics" placeholder="" popper-class="right-box-select-top prevent-clickoutside" size="small" @change="$forceUpdate">
<el-option v-for="item in statisticsList" :key="item.value" :label="item.label" :value="item.value" class="width310">
<span class="panel-dropdown-label-txt" >{{item.label}}</span>
</el-option>
</el-select>
</el-form-item>
<el-form-item class="form-item--half-width" v-if="editChart.type == 'logs'" :label='$t("dashboard.panel.chartForm.limit")' prop="param.limit">
<el-select v-model="editChart.param.limit" popper-class="chart-box-dropdown-width" size="small">
<el-select v-model="editChart.param.limit" popper-class="right-box-select-top" size="small">
<el-option v-for="option in limitOptions" :key="option" :value="option" class="width310"></el-option>
</el-select>
</el-form-item>