修改样式

This commit is contained in:
jingna 2026-06-11 10:23:59 +08:00
parent 41247bbfbd
commit 9268d572c7

View File

@ -38,6 +38,11 @@ const infoList = ref({
{ category: '功率', delay: 0, enabled: false, output_node: '', limit: 0 }, { category: '功率', delay: 0, enabled: false, output_node: '', limit: 0 },
{ category: '频率', delay: 0, enabled: false, output_node: '', limit: 0 }, { category: '频率', delay: 0, enabled: false, output_node: '', limit: 0 },
], ],
mutual_limit_alarm: [
{ category: 'PT变化', delay: 0, enabled: false, output_node: '', limit: 0 },
{ category: 'CT变化', delay: 0, enabled: false, output_node: '', limit: 0 },
]
}) })
const options = ref([ const options = ref([
{ {
@ -102,6 +107,12 @@ const cleardata = () => {
item.output_node = '' item.output_node = ''
item.limit = 0 item.limit = 0
}) })
infoList.value.mutual_limit_alarm.forEach(item => {
item.delay = 0
item.enabled = false
item.output_node = ''
item.limit = 0
})
} }
const currentLine = ref(1) const currentLine = ref(1)
const handleTabClick = (tab: string) => { const handleTabClick = (tab: string) => {
@ -138,11 +149,22 @@ const init = () => {
} }
}) })
}) })
// res.mutual_limit_alarm.forEach(item => {
// infoList.value.mutual_limit_alarm.forEach((mutualLimitItem, idx) => {
// if (mutualLimitItem.category === item.category) {
// mutualLimitItem.delay = item.delay
// mutualLimitItem.enabled = item.enabled
// mutualLimitItem.output_node = item.output_node
// mutualLimitItem.limit = item.limit || 0
// }
// })
// })
}) })
} }
const isswitch = ref(false) const isswitch = ref(false)
const dialogVisible = ref(false) const dialogVisible = ref(false)
const handleSave = () => { const handleSave = () => {
console.log(infoList.value)
ElMessageBox.prompt('请输入密码', '保存', { ElMessageBox.prompt('请输入密码', '保存', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
@ -185,8 +207,9 @@ const handleSave = () => {
<div class="line-tabs-box"> <div class="line-tabs-box">
<div class="tab-content"> <div class="tab-content">
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box" style="height: 265px;">越限告警</div> <div class="tab-content-item-box" style="height: 235px;">越限告警</div>
<div class="tab-content-item-box" style="height: 85px;">故障告警</div> <div class="tab-content-item-box" style="height: 75px;">故障告警</div>
<div class="tab-content-item-box" style="height: 35px;">互感器变化</div>
</div> </div>
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box box-height">类别</div> <div class="tab-content-item-box box-height">类别</div>
@ -197,9 +220,10 @@ const handleSave = () => {
<div class="tab-content-item-box box-color box-height">频率</div> <div class="tab-content-item-box box-color box-height">频率</div>
<div class="tab-content-item-box box-color box-height">PT断线</div> <div class="tab-content-item-box box-color box-height">PT断线</div>
<div class="tab-content-item-box box-color box-height">CT断线</div> <div class="tab-content-item-box box-color box-height">CT断线</div>
<div class="tab-content-item-box box-color box-height">PT变化</div>
</div> </div>
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box box-height"></div> <div class="tab-content-item-box box-height"></div>
<div class="tab-content-item-box box-color box-height"> <div class="tab-content-item-box box-color box-height">
<el-input-number v-model="infoList.over_limit_alarm[0].limit" style="width: 100%;" <el-input-number v-model="infoList.over_limit_alarm[0].limit" style="width: 100%;"
:controls="false" /> :controls="false" />
@ -220,22 +244,16 @@ const handleSave = () => {
<el-input-number v-model="infoList.fault_alarm[1].limit" style="width: 100%;" <el-input-number v-model="infoList.fault_alarm[1].limit" style="width: 100%;"
:controls="false" /> :controls="false" />
</div> </div>
<div class="tab-content-item-box box-color box-height" <div class="tab-content-item-box box-color box-height" style="border: none;">
style="display: flex;align-items: center;flex-direction: row;border: none;"> <img src="@/assets/images/menuicon/noitem.png" style="width: 100%; height: 100%;" alt="">
<div style="width: 60px;min-width: 60px;">PT变比</div> </div>
<div class="tab-content-item-box box-color box-height" style="border: none;">
<img src="@/assets/images/menuicon/noitem.png" style="width: 100%; height: 100%;" alt="">
</div>
<div class="tab-content-item-box box-color box-height"> <div class="tab-content-item-box box-color box-height">
<el-input-number v-model="infoList.fault_alarm[0].limit" style="width: 100%;" <el-input-number v-model="infoList.mutual_limit_alarm[0].limit" style="width: 100%;"
:controls="false" /> :controls="false" />
</div> </div>
</div>
<div class="tab-content-item-box box-color box-height" style="display: flex;align-items: center;border: none;flex-direction: row;">
<div style="width: 60px;min-width: 60px;">CT变比</div>
<div class="tab-content-item-box box-color box-height">
<el-input-number v-model="infoList.fault_alarm[1].limit" style="width: 100%;"
:controls="false" />
</div>
</div>
</div> </div>
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box box-height">延时s</div> <div class="tab-content-item-box box-height">延时s</div>
@ -267,6 +285,9 @@ const handleSave = () => {
<el-input-number v-model="infoList.fault_alarm[1].delay" style="width: 100%;" <el-input-number v-model="infoList.fault_alarm[1].delay" style="width: 100%;"
:controls="false" /> :controls="false" />
</div> </div>
<div class="tab-content-item-box box-color box-height">
CT变化
</div>
</div> </div>
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box box-height">输出节点</div> <div class="tab-content-item-box box-height">输出节点</div>
@ -312,6 +333,10 @@ const handleSave = () => {
:value="item.value"></el-option> :value="item.value"></el-option>
</el-select> </el-select>
</div> </div>
<div class="tab-content-item-box box-color box-height">
<el-input-number v-model="infoList.mutual_limit_alarm[0].output_node" style="width: 100%;"
:controls="false" />
</div>
</div> </div>
<div class="tab-content-item"> <div class="tab-content-item">
<div class="tab-content-item-box box-height">是否投入</div> <div class="tab-content-item-box box-height">是否投入</div>
@ -336,6 +361,9 @@ const handleSave = () => {
<div class="tab-content-item-box box-color box-height"> <div class="tab-content-item-box box-color box-height">
<el-switch v-model="infoList.fault_alarm[1].enabled"></el-switch> <el-switch v-model="infoList.fault_alarm[1].enabled"></el-switch>
</div> </div>
<div class="tab-content-item-box box-color box-height" style="border: none;">
<img src="@/assets/images/menuicon/noitem.png" style="width: 100%; height: 100%;" alt="">
</div>
</div> </div>
</div> </div>
<el-button type="primary" class="save-btn" @click="handleSave">保存</el-button> <el-button type="primary" class="save-btn" @click="handleSave">保存</el-button>
@ -394,7 +422,7 @@ const handleSave = () => {
// height: calc(100vh - 260px); // height: calc(100vh - 260px);
border-radius: 4px; border-radius: 4px;
box-shadow: 0px 0px 10px rgba(219, 225, 236, 1); box-shadow: 0px 0px 10px rgba(219, 225, 236, 1);
padding: 20px 20px; padding: 10px 20px;
min-height: max-content; min-height: max-content;
gap: 5px; gap: 5px;
@ -426,14 +454,14 @@ const handleSave = () => {
} }
.box-height { .box-height {
height: 40px; height: 35px;
} }
} }
} }
.save-btn { .save-btn {
margin-top: 20px; margin-top: 10px;
width: 150px; width: 150px;
height: 40px; height: 40px;
font-size: 14px; font-size: 14px;