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-06-29 09:34:00 +08:00
parent 72f1ccae30
commit 9d5166414f
3 changed files with 84 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -37,7 +37,7 @@ function formatTime(dateStr: string): string {
const tableData = computed(() => {
const alarms = state.alarms || []
const firstThree = alarms.slice(0, 1)
const firstThree = alarms.slice(0, 2)
return firstThree.map(list => {
return {
id: list.id || 0,
@ -97,8 +97,7 @@ onMounted(() => {
</div>
</div>
</div>
<!-- <div class="ai-container-bottom">
<div class="ai-container-bottom">
<div class="top-title">报警信息</div>
<div class="container-bottom-box">
<div v-for="(item, index) in tableData" :key="index" class="container-bottom-box-line1">
@ -110,7 +109,7 @@ onMounted(() => {
<div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div>
</div>
</div> -->
</div>
</div>
</template>
@ -118,24 +117,24 @@ onMounted(() => {
.ai-container {
width: 100%;
height: 100%;
padding: 15px;
padding: 10px;
.top-title {
font-weight: 700;
font-style: normal;
font-size: 16px;
color: #363636;
margin-bottom: 10px;
margin-bottom: 4px;
}
.ai-container-top {
width: 100%;
margin-bottom: 10px;
margin-bottom: 4px;
.container-top-box {
width: 100%;
height: 460px;
padding: 20px;
height: 404px;
padding: 8px 10px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
@ -150,8 +149,8 @@ onMounted(() => {
.header-cell {
flex: 1;
height: 28px;
line-height: 28px;
height: 25px;
line-height: 25px;
background-color: #f8f9fc;
border: 1px solid #e8e8e8;
border-radius: 4px;
@ -173,8 +172,8 @@ onMounted(() => {
.cell {
flex: 1;
height: 28px;
line-height: 28px;
height: 25px;
line-height: 25px;
border: 1px solid #e8e8e8;
border-radius: 4px;
text-align: center;
@ -191,8 +190,8 @@ onMounted(() => {
.container-bottom-box {
width: 100%;
height: calc(100vh - 590px);
padding: 15px 20px;
height: 66px;
padding: 0px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
@ -201,7 +200,7 @@ onMounted(() => {
display: flex;
align-items: center;
color: #787878;
height: 40px;
height: 33px;
font-size: 14px;
color: #505050;
border-bottom: 1px solid #f2f2f2;

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

@ -120,7 +120,7 @@ function formatTime(dateStr: string): string {
const tableData = computed(() => {
const alarms = state.alarms || []
const firstThree = alarms.slice(0, 1)
const firstThree = alarms.slice(0, 2)
return firstThree.map(list => {
return {
id: list.id || 0,
@ -207,7 +207,7 @@ onMounted(() => {
</div>
</div>
</div>
<!-- <div class="analog-quantity-container-bottom">
<div class="analog-quantity-container-bottom">
<div class="top-title">报警信息</div>
<div class="container-bottom-box">
<div v-for="(item, index) in tableData" :key="item.id" class="container-bottom-box-line1">
@ -219,7 +219,7 @@ onMounted(() => {
<div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div>
</div>
</div> -->
</div>
</div>
</template>
@ -227,24 +227,24 @@ onMounted(() => {
.analog-quantity-container {
width: 100%;
height: 100%;
padding: 15px;
padding: 10px;
.top-title {
font-weight: 700;
font-style: normal;
font-size: 16px;
color: #363636;
margin-bottom: 10px;
margin-bottom: 5px;
}
.analog-quantity-container-top {
width: 100%;
margin-bottom: 10px;
margin-bottom: 5px;
.container-top-box {
width: 100%;
height: 440px;
padding: 15px 20px;
height: 385px;
padding: 10px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
@ -299,7 +299,7 @@ onMounted(() => {
}
.container-top-box-content {
margin-top: 15px;
margin-top: 10px;
.container-top-box-content-top {
.container-top-box-content-line1 {
@ -312,8 +312,8 @@ onMounted(() => {
.table-line1-item {
width: 20%;
background: #f9fafe;
height: 40px;
line-height: 40px;
height: 35px;
line-height: 35px;
text-align: center;
border: 1px solid #e4e4e4;
border-radius: 4px;
@ -321,8 +321,8 @@ onMounted(() => {
.table-line1-item2 {
width: 20%;
height: 40px;
line-height: 40px;
height: 35px;
line-height: 35px;
text-align: center;
border: 1px solid #e4e4e4;
border-radius: 4px;
@ -341,17 +341,16 @@ onMounted(() => {
.container-bottom-box {
width: 100%;
height: calc(100vh - 575px);
padding: 15px 20px;
height: 72px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
overflow: auto;
// overflow: auto;
.container-bottom-box-line1 {
display: flex;
align-items: center;
color: #787878;
height: 40px;
height: 36px;
font-size: 14px;
color: #505050;
border-bottom: 1px solid #f2f2f2;

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

@ -39,7 +39,7 @@ function formatTime(dateStr: string): string {
const tableData = computed(() => {
const alarms = state.alarms || []
const firstThree = alarms.slice(0, 1)
const firstThree = alarms.slice(0, 2)
return firstThree.map(list => {
return {
id: list.id || 0,
@ -86,8 +86,8 @@ onMounted(() => {
</div>
<div class="state-grid">
<div v-for="(state, index) in inputStates" :key="`input-${index}`" class="state-item">
<img v-if="state === 1" src="@/assets/images/menuicon/on.png" style="width: 34px; height: 36px;"
alt="">
<img v-if="state === 1" src="@/assets/images/menuicon/on.png"
style="width: 34px; height: 36px;" alt="">
<img v-else src="@/assets/images/menuicon/off.png" alt=""
style="width: 34px; height: 36px;">
<div class="label">开入{{ index + 1 }}</div>
@ -101,16 +101,30 @@ onMounted(() => {
</div>
<div class="state-grid">
<div v-for="(state, index) in outputStates" :key="`output-${index}`" class="state-item">
<img v-if="state === 1" src="@/assets/images/menuicon/on2.png" @click="outputChange(state,index)" style="width: 46px; height: 24px;cursor: pointer;"
alt="">
<img v-else src="@/assets/images/menuicon/off2.png" @click="outputChange(state,index)" style="width: 46px; height: 24px;cursor: pointer;"
<img v-if="state === 1" src="@/assets/images/menuicon/on2.png"
@click="outputChange(state, index)" style="width: 46px; height: 24px;cursor: pointer;"
alt="">
<img v-else src="@/assets/images/menuicon/off2.png" @click="outputChange(state, index)"
style="width: 46px; height: 24px;cursor: pointer;" alt="">
<div class="label">开出{{ index + 1 }}</div>
</div>
</div>
</div>
</div>
</div>
<div class="switch-container-bottom">
<div class="top-title">报警信息</div>
<div class="container-bottom-box">
<div v-for="(item, index) in tableData" :key="item.id" class="container-bottom-box-line1">
<div style="width: 8%;text-align: center;">{{ index + 1 }}</div>
<div style="width: 14%;text-align: center;">{{ item.name }}</div>
<div style="width: 20%;text-align: center;">{{ item.typeName }}</div>
<div style="width: 8%;text-align: center;">{{ item.eventValue }}</div>
<div style="width: 30%;text-align: center;">{{ item.content }}</div>
<div style="width: 20%;text-align: center;">{{ item.time }}</div>
</div>
</div>
</div>
</div>
</template>
@ -118,23 +132,24 @@ onMounted(() => {
.switch-container {
width: 100%;
height: 100%;
padding: 20px;
padding: 10px;
.top-title {
font-weight: 700;
font-style: normal;
font-size: 16px;
color: #363636;
margin-bottom: 15px;
margin-bottom: 5px;
}
.switch-container-top {
width: 100%;
margin-bottom: 10px;
margin-bottom: 5px;
.container-top-box {
width: 100%;
height: 440px;
padding: 15px 20px;
height: 385px;
padding: 10px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
@ -171,9 +186,9 @@ onMounted(() => {
.state-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
padding: 15px 10px;
// padding: 15px 10px;
background-color: rgba(249, 250, 254, 1);
height: 375px;
height: 335px;
align-items: center;
justify-items: center;
gap: 0;
@ -207,8 +222,7 @@ onMounted(() => {
.container-bottom-box {
width: 100%;
height: calc(100vh - 506px);
padding: 20px;
height: 72px;
background: #ffffff;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
border-radius: 4px;
@ -218,7 +232,7 @@ onMounted(() => {
display: flex;
align-items: center;
color: #787878;
height: 40px;
height: 36px;
font-size: 14px;
color: #505050;
border-bottom: 1px solid #f2f2f2;