wqy
/
central-control
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'origin/绿色触摸屏' into 触摸屏-直流

Browse Source
触摸屏-直流
Rice 2 weeks ago
parent 2f052d319e 34d28b188b
commit 3eb1421cac
2 changed files with 59 additions and 78 deletions
Show Stats Download Patch File Download Diff File

43
src/views/AlarmInformation/index.vue
Unescape View File

@ -31,7 +31,7 @@
批量删除
</el-button>
</div>
<el-table :data="showTableData" style="width: 100%" height="390" stripe v-loading="loading" @selection-change="handleSelectionChange" row-key="id" ref="multipleTableRef">
<el-table class="alarm-table" :data="showTableData" style="width: 100%" stripe v-loading="loading" @selection-change="handleSelectionChange" row-key="id" ref="multipleTableRef">
<el-table-column type="selection" :selectable="selectable" width="55" />
<el-table-column align="center" prop="id" label="序号" />
<el-table-column align="center" prop="loop_idx" label="回路地址" />
@ -53,7 +53,7 @@
</template>
</el-table-column> -->
</el-table>
<el-pagination v-if="total > 0" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[10, 30, 50, 100]" :total="total" :pager-count="5" v-model:page-size="pageSize" v-model:current-page="currentPage" background layout="prev, pager, next" />
<el-pagination v-if="total > 0" @size-change="handleSizeChange" @current-change="handleCurrentChange" :page-sizes="[6, 8, 10, 30, 50]" :total="total" :pager-count="5" v-model:page-size="pageSize" v-model:current-page="currentPage" background layout="total, sizes, prev, pager, next" />
</div>
</div>
<!-- 底部信息 -->
@ -103,19 +103,25 @@ const commit_uid = sessionStorage.getItem('central_control_comm_uid')
const loading = ref(false)
const total = ref(0)
const pageSize = ref(8)
const pageSize = ref(6)
const currentPage = ref(1)
const handleSizeChange = () => {
const tableData = ref([])
const showTableData = ref([])
const applyPageData = () => {
const start = (currentPage.value - 1) * pageSize.value
showTableData.value = tableData.value.slice(start, start + pageSize.value)
}
const handleSizeChange = (size) => {
pageSize.value = size
currentPage.value = 1
// getData()
applyPageData()
}
const handleCurrentChange = () => {
// getData()
showTableData.value = tableData.value.slice((currentPage.value - 1) * 8, (currentPage.value - 1) * 8 + 8)
applyPageData()
}
const tableData = ref([])
const multipleTableRef = ref(null)
const multipleSelection = ref([])
const selectable = (row) => true
@ -167,8 +173,6 @@ const handleDeal = () => {
})
}
const showTableData = ref([])
const getData = () => {
currentPage.value = 1
const params = {
@ -190,9 +194,10 @@ const getData = () => {
loading.value = true
tableData.value = []
RPC.post('/m9z/fault/list', params).then(res => {
total.value = res.rows.length || 0
tableData.value = res.rows || []
showTableData.value = tableData.value.slice(0, 8)
const rows = res?.rows || []
total.value = rows.length
tableData.value = rows
applyPageData()
}).finally(() => {
loading.value = false
})
@ -267,7 +272,7 @@ onUnmounted(() => {
height: 100vh;
box-sizing: border-box;
position: relative;
overflow: auto;
overflow: hidden;
background: center / cover url('@/assets/images/背景小@2x.png') no-repeat;
background-color: #0A3933;
}
@ -276,15 +281,19 @@ onUnmounted(() => {
position: relative;
z-index: 2;
width: 100%;
height: 100%;
height: calc(100vh - 50px);
padding: 10px 20px;
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
}
.header-status {
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
margin-bottom: 20px;
color: rgba(255, 255, 255, 0.9);
}
@ -312,11 +321,13 @@ onUnmounted(() => {
.control-content {
width: 100%;
flex: 1;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
overflow: hidden;
:deep(.el-table__header) {
.el-table__cell {

94
src/views/Monitoring/index.vue
Unescape View File

@ -99,40 +99,11 @@
<div v-else class="fault-empty">当前无故障</div>
</div>
<div class="circuit-section">
<!-- 上排回路 -->
<div class="circuit-row">
<div v-for="(circuit, index) in info?.Loops?.slice(0, 5)" :key="circuit.name" class="circuit-item">
<div class="circuit-grid">
<div v-for="(circuit, index) in monitorLoops" :key="`${circuit.name}-${index}`" class="circuit-item">
<div class="circuit-status" :class="{ active: circuit.is_open }">
直流回路{{ index + 1 }}：{{ circuit.is_open ? '打开' : '关闭' }}
直流回路{{ loopNo(circuit, index) }}：{{ circuit.is_open ? '打开' : '关闭' }}
</div>
<!-- <div class="circuit-icon" :class="{ active: circuit.is_open }">
<el-icon>
<Sunny />
</el-icon>
</div> -->
<div class="circuitStatus">
<div class="line">
<div class="line_item">电压: <span>{{ circuit.V ? circuit.V?.toFixed(2) : 0 }}V</span></div>
<div class="line_item">电流: <span>{{ circuit.A ? circuit.A?.toFixed(2) : 0 }}A</span></div>
</div>
<div class="line">
<div class="line_item">功率: <span>{{ circuit.Kw ? circuit.Kw?.toFixed(3) : 0 }}kW</span></div>
</div>
</div>
</div>
</div>
<!-- 下排回路 -->
<div class="circuit-row">
<div v-for="(circuit, index) in info?.Loops?.slice(5, 10)" :key="circuit.name" class="circuit-item">
<div class="circuit-status" :class="{ active: circuit.is_open }">
直流回路{{ index + 6 }}：{{ circuit.is_open ? '打开' : '关闭' }}
</div>
<!-- <div class="circuit-icon" :class="{ active: circuit.is_open }">
<el-icon>
<Sunny />
</el-icon>
</div> -->
<div class="circuitStatus">
<div class="line">
<div class="line_item">电压: <span>{{ circuit.V ? circuit.V?.toFixed(2) : 0 }}V</span></div>
@ -146,20 +117,9 @@
</div>
</div>
<div class="dimming-section">
<!-- 上排调光通道 -->
<div class="dimming-row">
<div v-for="(channel, index) in info?.Loops?.slice(0, 5)" :key="channel.name" class="dimming-item">
<div class="channel-label">调光通道{{ index + 1 }}</div>
<div class="brightness-display" :class="{ active: channel.pwm > 0 }">
{{ channel.pwm }}%
</div>
</div>
</div>
<!-- 下排调光通道 -->
<div class="dimming-row">
<div v-for="(channel, index) in info?.Loops?.slice(5, 10)" :key="channel.name" class="dimming-item">
<div class="channel-label">调光通道{{ index + 6 }}</div>
<div class="dimming-grid">
<div v-for="(channel, index) in monitorLoops" :key="`${channel.name}-${index}`" class="dimming-item">
<div class="channel-label">调光通道{{ loopNo(channel, index) }}</div>
<div class="brightness-display" :class="{ active: channel.pwm > 0 }">
{{ channel.pwm }}%
</div>
@ -406,6 +366,15 @@ const scanDeviceCount = computed(() => {
return info.value?.scan_device_count ?? info.value?.ScanDeviceCount ?? info.value?.Loops?.length ?? 0
})
const monitorLoops = computed(() => {
return info.value?.Loops || []
})
const loopNo = (loop, index) => {
const loopIndex = loop?.index ?? loop?.Index
return Number.isInteger(loopIndex) ? loopIndex + 1 : index + 1
}
const currentFaults = computed(() => {
const loops = info.value?.Loops || []
return loops.flatMap((loop, index) => {
@ -701,7 +670,7 @@ onUnmounted(() => {
flex-direction: column;
// justify-content: space-between;
/* width: 500px; */
gap: 20px;
gap: 12px;
height: 100%;
overflow-y: auto;
}
@ -844,12 +813,13 @@ onUnmounted(() => {
.circuit-section {
display: flex;
flex-direction: column;
gap: 10px;
gap: 8px;
}
.circuit-row {
display: flex;
justify-content: space-between;
.circuit-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 8px;
font-size: 12px;
.circuitStatus {
@ -859,12 +829,11 @@ onUnmounted(() => {
.line {
width: 100%;
display: flex;
margin-top: 10px;
display: flex;
margin-top: 6px;
justify-content: space-between;
.line_item {
width: 45%;
width: 48%;
// flex: 1;
flex-shrink: 0;
display: flex;
@ -879,14 +848,14 @@ onUnmounted(() => {
flex-direction: column;
align-items: center;
// gap: 10px;
width: 18%;
min-width: 0;
}
.circuit-status {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 8px;
padding: 8px 12px;
padding: 6px 8px;
color: rgba(255, 255, 255, 0.7);
text-align: center;
width: 100%;
@ -928,21 +897,22 @@ onUnmounted(() => {
.dimming-section {
display: flex;
flex-direction: column;
gap: 10px;
gap: 8px;
font-size: 12px;
}
.dimming-row {
display: flex;
justify-content: space-between;
.dimming-grid {
display: grid;
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 8px;
}
.dimming-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
width: 18%;
gap: 8px;
min-width: 0;
}
.channel-label {

Write Preview
Loading…
Cancel
Save