优化检测脚本页面

This commit is contained in:
GGJ
2025-02-27 15:09:09 +08:00
parent e0fd42199f
commit c7e5ee0862
9 changed files with 417 additions and 280 deletions

View File

@@ -1,16 +1,16 @@
<template>
<div>
<div class="divider-container">
<el-divider style="width: 300px" content-position="left">检测脚本信息</el-divider>
<el-divider style="width: 260px" content-position="left">检测脚本信息</el-divider>
<!-- <el-divider style="width: 400px" content-position="left">通讯脚本</el-divider> -->
<el-divider style="flex: 1" content-position="left">检测项目概要信息</el-divider>
</div>
<div class="data-check-content">
<div class="content-tree">
<Tree :treeData="treeData" />
<Tree :treeData="treeData" @setTab="setTab" />
</div>
<div class="content-right-Tabs" style="height: calc(100vh - 335px); width: 100px">
<div class="content-right-Tabs" style="height: calc(100vh - 315px); width: 100px">
<el-tabs type="border-card" style="height: 100%" v-model="activeName" @tab-change="tabChange">
<el-tab-pane v-for="tab in tabData" :key="tab.value" :label="tab.label" :name="tab.value">
<div v-if="activeName == tab.value">
@@ -25,7 +25,7 @@
:activeName="activeName"
:formContent="props.formContent"
:options="props.options"
style="width: 400px"
style="width: 360px"
:disabled="tab.children.length == 0 ? false : true"
ref="communRef"
/>
@@ -54,11 +54,11 @@
}"
stripe
:cell-style="{ textAlign: 'center' }"
height="calc(100vh - 515px)"
height="calc(100vh - 480px)"
style="width: 100%"
>
<el-table-column type="index" label="组次" width="60" />
<el-table-column prop="ffreq" label="频率(Hz)" width="100" />
<el-table-column prop="ffreq" label="频率(Hz)" width="90" />
<el-table-column
:label="item.label"
v-for="item in column"
@@ -73,7 +73,7 @@
{{
row.channelList[item.num].famp == null
? '/'
: '电压=' +
: '' +
row.channelList[item.num]?.famp +
(valueCode == 'Absolute' ? 'V' : '%')
}}
@@ -82,7 +82,7 @@
{{
row.channelList[item.num].fphase == null
? '/'
: '相角=' +
: '' +
row.channelList[item.num].fphase +
'°'
}}
@@ -94,7 +94,7 @@
{{
row.channelList[item.num + 1].famp == null
? '/'
: '电流=' +
: '' +
row.channelList[item.num + 1].famp +
(valueCode == 'Absolute' ? 'V' : '%')
}}
@@ -103,7 +103,7 @@
{{
row.channelList[item.num + 1].fphase == null
? '/'
: '相角=' +
: '' +
row.channelList[item.num + 1].fphase +
'°'
}}
@@ -113,7 +113,7 @@
</table>
</template>
</el-table-column>
<el-table-column label="是否启用" width="90">
<el-table-column label="是否启用" width="85">
<template #default="{ row }">
<el-switch
v-model="row.enable"
@@ -130,7 +130,7 @@
</el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="220">
<el-table-column label="操作" width="215">
<template #default="{ row }">
<el-button
type="primary"
@@ -280,6 +280,12 @@ const getTree = () => {
}
})
}
// 设置树点击tab
const setTab = row => {
activeName.value = row.activeName
childActiveName.value = row.childActiveName
getTree()
}
const copyActiveName = ref('')
// 获取通讯脚本点击
const getCommunication = () => {
@@ -415,11 +421,11 @@ onMounted(() => {
}
.content-tree {
width: 300px;
height: calc(100vh - 335px);
width: 260px;
height: calc(100vh - 315px);
border: 1px solid #dcdfe6;
border-radius: 4px;
margin-right: 10px;
// margin-right: 10px;
overflow: auto; /* 同时启用垂直和水平滚动 */
overflow-x: hidden;
}
@@ -479,4 +485,10 @@ input::-webkit-inner-spin-button {
input::-webkit-outer-spin-button {
-webkit-appearance: none !important;
}
.el-divider--horizontal {
margin: 4px 0 24px 0;
}
.el-tabs--border-card > .el-tabs__content {
padding: 10px;
}
</style>