页面样式调整

This commit is contained in:
白菜
2025-06-24 22:48:33 +08:00
parent 7145afd5a0
commit 6cec2849ba
14 changed files with 213 additions and 275 deletions

View File

@ -2,43 +2,41 @@
<template>
<el-card shadow="always" class="common-card-container common-card-container-no-title-bg">
<!-- 搜索栏-->
<div class="select-container">
<el-form :inline="true">
<el-form-item label="设备类型">
<el-select v-model="search.sblx" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in sblxOptions" :key="index+'sblxOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="告警等级">
<el-select v-model="search.gjdj" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in gjdjOptions" :key="index+'gjdjOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="时间选择">
<el-date-picker
v-model="dateRange"
type="daterange"
range-separator=""
start-placeholder="开始时间"
:picker-options="pickerOptions"
:default-value="defaultDateRange"
end-placeholder="结束时间">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="warning" @click="onSearch" native-type="button">搜索</el-button>
</el-form-item>
<el-form-item>
<el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item>
</el-form>
</div>
<el-form :inline="true" class="select-container">
<el-form-item label="设备类型">
<el-select v-model="search.sblx" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in sblxOptions" :key="index+'sblxOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="告警等级">
<el-select v-model="search.gjdj" placeholder="请选择" :loading="loading" loading-text="正在加载数据">
<el-option :label="item.name" :value="item.id" v-for="(item,index) in gjdjOptions" :key="index+'gjdjOptions'"></el-option>
</el-select>
</el-form-item>
<el-form-item label="时间选择">
<el-date-picker
v-model="dateRange"
type="daterange"
range-separator=""
start-placeholder="开始时间"
:picker-options="pickerOptions"
:default-value="defaultDateRange"
end-placeholder="结束时间">
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSearch" native-type="button">搜索</el-button>
</el-form-item>
<el-form-item>
<el-button @click="onReset" native-type="button">重置</el-button>
</el-form-item>
</el-form>
<div style="margin:30px 0;">
<!-- 二个选择按钮-->
<el-row style="">
<el-col :xs="24" :sm="24" :lg="24">
<el-button-group>
<el-button v-for="(item,index) in btnList" :key="index+'dtdcBtns'" type="warning" :class="{'activeBtn' : activeBtn === item.id}" @click="changeDataType(item.id)">{{item.name}}</el-button>
<el-button-group class="ems-btns-group">
<el-button v-for="(item,index) in btnList" :key="index+'dtdcBtns'" :class="{'activeBtn' : activeBtn === item.id}" @click="changeDataType(item.id)">{{item.name}}</el-button>
</el-button-group>
</el-col>
</el-row>
@ -154,17 +152,3 @@ export default {
}
}
</script>
<style scoped lang="scss">
.select-container{
.el-form--inline .el-form-item{
margin-right: 20px;
}
}
.activeBtn{
background-color: #FFF2CB;
border-color: #FFF2CB;
color: #666666;
font-weight: 600;
}
</style>