zhengsl/emcp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

根据样式进行修改

Browse Source
This commit is contained in:
jingna 2026-05-26 15:11:03 +08:00
parent 71917122b6
commit 6738d7f017
9 changed files with 66 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
frontend/src/views/aiAlarmSetting/index.vue
View File

@ -127,12 +127,12 @@ onMounted(() => {
.ai-alarm-container { .ai-alarm-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 15px; padding: 10px;
.panel { .panel {
background: #fff; background: #fff;
border-radius: 6px; border-radius: 6px;
padding: 16px; padding: 10px;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
} }
@ -146,7 +146,7 @@ onMounted(() => {
.row { .row {
display: flex; display: flex;
margin-bottom: 8px; margin-bottom: 5px;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
@ -165,7 +165,7 @@ onMounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 37px; height: 28px;
box-sizing: border-box; box-sizing: border-box;
background-color: #f9fafe; background-color: #f9fafe;
color: #787878; color: #787878;
@ -214,7 +214,7 @@ onMounted(() => {
} }
.btn-wrap { .btn-wrap {
margin-top: 20px; margin-top: 10px;
} }
.save-btn { .save-btn {

8
frontend/src/views/aiChannelSetting/index.vue
View File

@ -81,7 +81,7 @@ onMounted(() => {
<template> <template>
<div class="ai-channel-container"> <div class="ai-channel-container">
<div class="title">AI通道设置</div> <!-- <div class="title">AI通道设置</div> -->
<div class="panel"> <div class="panel">
<div class="row header-row"> <div class="row header-row">
<div class="cell cell-no">通道号</div> <div class="cell cell-no">通道号</div>
@ -136,7 +136,7 @@ onMounted(() => {
.ai-channel-container { .ai-channel-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 15px; padding: 10px;
.panel { .panel {
background: #fff; background: #fff;
@ -155,7 +155,7 @@ onMounted(() => {
.row { .row {
display: flex; display: flex;
margin-bottom: 8px; margin-bottom: 5px;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
@ -174,7 +174,7 @@ onMounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 37px; height: 28px;
box-sizing: border-box; box-sizing: border-box;
background-color: #f9fafe; background-color: #f9fafe;
color: #787878; color: #787878;

16
frontend/src/views/aiQuantity/index.vue
View File

@ -35,7 +35,7 @@ function formatTime(dateStr: string): string {
} }
const tableData = computed(() => { const tableData = computed(() => {
const alarms = state.alarms || [] const alarms = state.alarms || []
const firstThree = alarms.slice(0, 2) const firstThree = alarms.slice(0, 1)
return firstThree.map(list => { return firstThree.map(list => {
const reslist: any = {} const reslist: any = {}
if (list.alarm_type == 'line_alarm') { if (list.alarm_type == 'line_alarm') {
@ -75,7 +75,7 @@ onMounted(() => {
<template> <template>
<div class="ai-container"> <div class="ai-container">
<div class="ai-container-top"> <div class="ai-container-top">
<div class="top-title">AI采集信息</div> <!-- <div class="top-title">AI采集信息</div> -->
<div class="container-top-box"> <div class="container-top-box">
<!-- 表格表头 --> <!-- 表格表头 -->
<div class="table-header"> <div class="table-header">
@ -101,7 +101,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<div class="ai-container-bottom"> <!-- <div class="ai-container-bottom">
<div class="top-title">报警信息</div> <div class="top-title">报警信息</div>
<div class="container-bottom-box"> <div class="container-bottom-box">
<div v-for="(item, index) in tableData" :key="index" class="container-bottom-box-line1"> <div v-for="(item, index) in tableData" :key="index" class="container-bottom-box-line1">
@ -113,7 +113,7 @@ onMounted(() => {
<div style="width: 20%;text-align: center;">{{ item.time }}</div> <div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</template> </template>
@ -128,12 +128,12 @@ onMounted(() => {
font-style: normal; font-style: normal;
font-size: 16px; font-size: 16px;
color: #363636; color: #363636;
margin-bottom: 15px; margin-bottom: 10px;
} }
.ai-container-top { .ai-container-top {
width: 100%; width: 100%;
margin-bottom: 25px; margin-bottom: 10px;
.container-top-box { .container-top-box {
width: 100%; width: 100%;
@ -194,8 +194,8 @@ onMounted(() => {
.container-bottom-box { .container-bottom-box {
width: 100%; width: 100%;
height: calc(100vh - 646px); height: calc(100vh - 590px);
padding: 20px; padding: 15px 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px; border-radius: 4px;

24
frontend/src/views/analogQuantity/index.vue
View File

@ -119,7 +119,7 @@ function formatTime(dateStr: string): string {
const tableData = computed(() => { const tableData = computed(() => {
const alarms = state.alarms || [] const alarms = state.alarms || []
const firstThree = alarms.slice(0, 2) const firstThree = alarms.slice(0, 1)
return firstThree.map(list => { return firstThree.map(list => {
const reslist: any = {} const reslist: any = {}
if (list.alarm_type == 'line_alarm') { if (list.alarm_type == 'line_alarm') {
@ -155,7 +155,7 @@ onMounted(() => {
<template> <template>
<div class="analog-quantity-container"> <div class="analog-quantity-container">
<div class="analog-quantity-container-top"> <div class="analog-quantity-container-top">
<div class="top-title">实时信息</div> <!-- <div class="top-title">实时信息</div> -->
<div class="container-top-box"> <div class="container-top-box">
<div class="container-top-box-nav"> <div class="container-top-box-nav">
<div class="nav-box"> <div class="nav-box">
@ -211,7 +211,7 @@ onMounted(() => {
</div> </div>
</div> </div>
</div> </div>
<div class="analog-quantity-container-bottom"> <!-- <div class="analog-quantity-container-bottom">
<div class="top-title">报警信息</div> <div class="top-title">报警信息</div>
<div class="container-bottom-box"> <div class="container-bottom-box">
<div v-for="(item, index) in tableData" :key="item.id" class="container-bottom-box-line1"> <div v-for="(item, index) in tableData" :key="item.id" class="container-bottom-box-line1">
@ -223,7 +223,7 @@ onMounted(() => {
<div style="width: 20%;text-align: center;">{{ item.time }}</div> <div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</template> </template>
@ -238,17 +238,17 @@ onMounted(() => {
font-style: normal; font-style: normal;
font-size: 16px; font-size: 16px;
color: #363636; color: #363636;
margin-bottom: 15px; margin-bottom: 10px;
} }
.analog-quantity-container-top { .analog-quantity-container-top {
width: 100%; width: 100%;
margin-bottom: 25px; margin-bottom: 10px;
.container-top-box { .container-top-box {
width: 100%; width: 100%;
height: 458px; height: 440px;
padding: 20px; padding: 15px 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px; border-radius: 4px;
@ -260,7 +260,7 @@ onMounted(() => {
.nav-box { .nav-box {
display: flex; display: flex;
gap: 20px; gap: 15px;
.nav-box-line { .nav-box-line {
display: flex; display: flex;
@ -303,7 +303,7 @@ onMounted(() => {
} }
.container-top-box-content { .container-top-box-content {
margin-top: 20px; margin-top: 15px;
.container-top-box-content-top { .container-top-box-content-top {
.container-top-box-content-line1 { .container-top-box-content-line1 {
@ -345,8 +345,8 @@ onMounted(() => {
.container-bottom-box { .container-bottom-box {
width: 100%; width: 100%;
height: calc(100vh - 645px); height: calc(100vh - 575px);
padding: 20px; padding: 15px 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px; border-radius: 4px;

8
frontend/src/views/aoChannelSetting/index.vue
View File

@ -80,7 +80,7 @@ onMounted(() => {
<template> <template>
<div class="ao-channel-contaoner"> <div class="ao-channel-contaoner">
<div class="title">AO通道设置</div> <!-- <div class="title">AO通道设置</div> -->
<div class="panel"> <div class="panel">
<div class="row header-row"> <div class="row header-row">
<div class="cell cell-no">通道号</div> <div class="cell cell-no">通道号</div>
@ -136,7 +136,7 @@ onMounted(() => {
.ao-channel-contaoner { .ao-channel-contaoner {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 15px; padding: 10px;
.panel { .panel {
background: #fff; background: #fff;
@ -155,7 +155,7 @@ onMounted(() => {
.row { .row {
display: flex; display: flex;
margin-bottom: 8px; margin-bottom: 5px;
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
@ -174,7 +174,7 @@ onMounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 37px; height: 28px;
box-sizing: border-box; box-sizing: border-box;
background-color: #f9fafe; background-color: #f9fafe;
color: #787878; color: #787878;

18
frontend/src/views/communicationSetting/index.vue
View File

@ -253,15 +253,14 @@ onMounted(() => {
.form-wrapper { .form-wrapper {
background: #fff; background: #fff;
padding: 20px 50px; padding: 15px 50px;
border-radius: 4px; border-radius: 4px;
padding-bottom: 120px;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
} }
.section { .section {
margin-bottom: 24px; margin-bottom: 10px;
padding-bottom: 16px; padding-bottom: 10px;
border-bottom: 1px solid #ebeef5; border-bottom: 1px solid #ebeef5;
&:last-child { &:last-child {
@ -273,7 +272,7 @@ onMounted(() => {
.section-title { .section-title {
font-size: 16px; font-size: 16px;
font-weight: 500; font-weight: 500;
margin: 0 0 21px 0; margin: 0 0 10px 0;
display: flex; display: flex;
align-items: center; align-items: center;
font-weight: 700; font-weight: 700;
@ -293,7 +292,7 @@ onMounted(() => {
.form-row { .form-row {
display: flex; display: flex;
gap: 40px; gap: 40px;
margin-bottom: 16px; margin-bottom: 10px;
.el-form-item { .el-form-item {
flex: 1; flex: 1;
@ -302,7 +301,7 @@ onMounted(() => {
} }
.btn-wrapper { .btn-wrapper {
margin-top: 20px; margin-top: 15px;
} }
} }
@ -311,6 +310,7 @@ onMounted(() => {
text-align: left; text-align: left;
justify-content: flex-start; justify-content: flex-start;
color: #787878; color: #787878;
} }
:deep(.el-select__placeholder) { :deep(.el-select__placeholder) {
@ -325,4 +325,8 @@ onMounted(() => {
:deep(.el-select__wrapper) { :deep(.el-select__wrapper) {
min-height: 40px; min-height: 40px;
} }
:deep(.el-form-item__label) {
height: 40px;
line-height: 40px;
}
</style> </style>

16
frontend/src/views/eventReport/index.vue
View File

@ -8,7 +8,7 @@ const formData: any = ref({
}) })
const tableData: any = ref([]) const tableData: any = ref([])
tableData.value = []
const pagination = ref({ const pagination = ref({
currentPage: 1, currentPage: 1,
pageSize: 10, pageSize: 10,
@ -95,7 +95,7 @@ onMounted(() => {
</el-button> </el-button>
</div> </div>
<div class="table-box"> <div class="table-box">
<el-table :data="tableData" style="width: 100%; height: calc(100vh - 280px)" header-align="center" <el-table :data="tableData" style="width: 100%; height: calc(100vh - 260px)" header-align="center"
align="center"> align="center">
<el-table-column label="序号" type="index" width="80" align="center" /> <el-table-column label="序号" type="index" width="80" align="center" />
<el-table-column label="事件所属" prop="belong"> <el-table-column label="事件所属" prop="belong">
@ -123,26 +123,26 @@ onMounted(() => {
.event-report-container { .event-report-container {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; padding: 15px;
} }
.search-box { .search-box {
background: #fff; background: #fff;
border-radius: 6px; border-radius: 6px;
padding: 20px; padding: 15px;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
margin-bottom: 20px; margin-bottom: 15px;
display: flex; display: flex;
align-items: center; align-items: center;
height: 80px; height: 65px;
} }
.table-box { .table-box {
background: #fff; background: #fff;
border-radius: 4px; border-radius: 4px;
padding: 20px; padding: 15px;
box-shadow: 0 0 10px rgba(219, 225, 236, 1); box-shadow: 0 0 10px rgba(219, 225, 236, 1);
height: calc(100% - 100px); height: calc(100% - 80px);
} }
.pagination { .pagination {

4
frontend/src/views/lineSetting/index.vue
View File

@ -324,7 +324,7 @@ const handleSave = () => {
.line-page { .line-page {
width: 100%; width: 100%;
height: 100%; height: 100%;
padding: 20px; padding: 15px;
.line-tabs { .line-tabs {
display: flex; display: flex;
@ -402,7 +402,7 @@ const handleSave = () => {
} }
.save-btn { .save-btn {
margin-top: 30px; margin-top: 20px;
width: 150px; width: 150px;
height: 40px; height: 40px;
font-size: 14px; font-size: 14px;

23
frontend/src/views/switchQuantity/index.vue
View File

@ -35,7 +35,7 @@ function formatTime(dateStr: string): string {
} }
const tableData = computed(() => { const tableData = computed(() => {
const alarms = state.alarms || [] const alarms = state.alarms || []
const firstThree = alarms.slice(0, 2) const firstThree = alarms.slice(0, 1)
return firstThree.map(list => { return firstThree.map(list => {
const reslist: any = {} const reslist: any = {}
if (list.alarm_type == 'line_alarm') { if (list.alarm_type == 'line_alarm') {
@ -62,7 +62,7 @@ onMounted(() => {
<template> <template>
<div class="switch-container"> <div class="switch-container">
<div class="switch-container-top"> <div class="switch-container-top">
<div class="top-title">开入/开出状态</div> <!-- <div class="top-title">开入/开出状态</div> -->
<div class="container-top-box"> <div class="container-top-box">
<div class="state-column"> <div class="state-column">
<div class="column-title"> <div class="column-title">
@ -96,7 +96,7 @@ onMounted(() => {
</div> </div>
</div> </div>
</div> </div>
<!--
<div class="switch-container-bottom"> <div class="switch-container-bottom">
<div class="top-title">报警信息</div> <div class="top-title">报警信息</div>
<div class="container-bottom-box"> <div class="container-bottom-box">
@ -109,7 +109,7 @@ onMounted(() => {
<div style="width: 20%;text-align: center;">{{ item.time }}</div> <div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div> </div>
</div> </div>
</div> </div> -->
</div> </div>
</template> </template>
@ -129,12 +129,11 @@ onMounted(() => {
.switch-container-top { .switch-container-top {
width: 100%; width: 100%;
margin-bottom: 25px; margin-bottom: 10px;
.container-top-box { .container-top-box {
width: 100%; width: 100%;
height: 458px; height: 440px;
padding: 20px; padding: 15px 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px; border-radius: 4px;
@ -150,7 +149,7 @@ onMounted(() => {
font-size: 18px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: #363636; color: #363636;
margin-bottom: 20px; margin-bottom: 10px;
display: flex; display: flex;
align-items: center; align-items: center;
@ -171,9 +170,9 @@ onMounted(() => {
.state-grid { .state-grid {
display: grid; display: grid;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
padding: 20px 10px; padding: 15px 10px;
background-color: rgba(249, 250, 254, 1); background-color: rgba(249, 250, 254, 1);
height: 380px; height: 375px;
align-items: center; align-items: center;
justify-items: center; justify-items: center;
gap: 0; gap: 0;
@ -207,7 +206,7 @@ onMounted(() => {
.container-bottom-box { .container-bottom-box {
width: 100%; width: 100%;
height: calc(100vh - 645px); height: calc(100vh - 506px);
padding: 20px; padding: 20px;
background: #ffffff; background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);