/**
|
* 气体浓度详情页面
|
* 显示气体浓度数据列表中的所有对象的详细信息
|
*/
|
import dxui from '../../dxmodules/dxUi.js'
|
import viewUtils from './viewUtils.js'
|
import logger from '../../dxmodules/dxLogger.js'
|
import mainView from './mainView.js'
|
import std from '../../dxmodules/dxStd.js'
|
|
const gasDetailView = {}
|
|
gasDetailView.init = function (gasData) {
|
try {
|
// 先检查是否已存在相同ID的页面，如果存在则删除
|
if (dxui.all['gasDetailView']) {
|
dxui.del(dxui.all['gasDetailView'])
|
}
|
|
// 创建页面容器
|
const screenMain = dxui.View.build('gasDetailView', dxui.Utils.LAYER.MAIN)
|
gasDetailView.screenMain = screenMain
|
screenMain.scroll(false) // 禁用屏幕主容器的滚动
|
screenMain.bgColor(0xf5f5f5)
|
|
// 创建标题栏
|
const titleBox = dxui.View.build('gasDetailViewTitle', screenMain)
|
viewUtils._clearStyle(titleBox)
|
titleBox.setSize(800, 70)
|
titleBox.bgColor(0xffffff)
|
titleBox.align(dxui.Utils.ALIGN.TOP_MID, 0, 0)
|
|
// 添加标题文本
|
const titleLbl = dxui.Label.build('gasDetailViewTitleText', titleBox)
|
titleLbl.textFont(viewUtils.font(28))
|
titleLbl.align(dxui.Utils.ALIGN.CENTER, 0, 0)
|
titleLbl.text('气体浓度详情')
|
|
// 添加返回按钮
|
const back = viewUtils.imageBtn(titleBox, 'gasDetailViewTitleBack', '/app/code/resource/image/back.png')
|
back.setSize(80, 70)
|
back.align(dxui.Utils.ALIGN.LEFT_MID, 0, 0)
|
|
back.on(dxui.Utils.EVENT.CLICK, () => {
|
if (mainView.screenMain) {
|
dxui.loadMain(mainView.screenMain)
|
}
|
})
|
logger.info('[mainView]: 标题栏创建完成')
|
|
// 内容容器（无滚动）
|
const contentContainer = dxui.View.build('contentContainer', screenMain)
|
viewUtils._clearStyle(contentContainer)
|
contentContainer.setSize(800, 1210) // 屏幕高度1280减去标题栏70
|
contentContainer.align(dxui.Utils.ALIGN.TOP_MID, 0, 70)
|
contentContainer.scroll(false) // 禁用滚动功能
|
contentContainer.bgOpa(0)
|
|
// 内容区域
|
const content = dxui.View.build('content', contentContainer)
|
viewUtils._clearStyle(content)
|
content.setSize(760, 1200) // 调整内容区域高度，适合5个点位
|
content.align(dxui.Utils.ALIGN.TOP_MID, 0, 20)
|
content.bgOpa(0)
|
content.flexFlow(dxui.Utils.FLEX_FLOW.COLUMN)
|
content.flexAlign(dxui.Utils.ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.FLEX_START, dxui.Utils.FLEX_ALIGN.CENTER)
|
content.obj.lvObjSetStylePadGap(15, 0) // 调整纵向间距，适合5个点位
|
|
// 检查气体浓度数据是否存在
|
if (!gasData || !gasData.data || !gasData.data.value || gasData.data.value.length === 0) {
|
const noData = dxui.Label.build('noData', content)
|
noData.text('暂无气体浓度数据')
|
noData.textFont(viewUtils.font(20))
|
noData.textColor(0x666666)
|
noData.align(dxui.Utils.ALIGN.CENTER, 0, 0)
|
return
|
}
|
|
// 显示气体浓度数据列表
|
const gasValues = gasData.data.value
|
|
gasValues.forEach((gasItem, index) => {
|
// 创建传感器标题
|
const sensorTitle = dxui.Label.build(`sensorTitle${index}`, content)
|
sensorTitle.text(`点位 ${index + 1}`)
|
sensorTitle.textFont(viewUtils.font(16, dxui.Utils.FONT_STYLE.BOLD))
|
sensorTitle.textColor(0x333333)
|
sensorTitle.align(dxui.Utils.ALIGN.TOP_LEFT, 0, 0)
|
|
// 创建气体数据容器
|
const gasContainer = dxui.View.build(`gasContainer${index}`, content)
|
viewUtils._clearStyle(gasContainer)
|
gasContainer.setSize(760, 180)
|
gasContainer.bgOpa(0)
|
gasContainer.flexFlow(dxui.Utils.FLEX_FLOW.ROW)
|
gasContainer.flexAlign(dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER) // 居中对齐
|
gasContainer.obj.lvObjSetStylePadGap(20, 0) // 减小横向间距
|
|
// 显示氧气浓度和状态
|
if (gasItem.o2 !== undefined || gasItem.statusO2 !== undefined) {
|
const o2Box = dxui.Image.build(`o2Box${index}`, gasContainer)
|
viewUtils._clearStyle(o2Box)
|
o2Box.setSize(239, 166)
|
const isO2Qualified = gasItem.statusO2 === '0'
|
o2Box.source(isO2Qualified ? '/app/code/resource/image/o2_s.png' : '/app/code/resource/image/o2_f.png')
|
|
const o2Title = dxui.Label.build(`o2Title${index}`, o2Box)
|
o2Title.text('氧气')
|
o2Title.textFont(viewUtils.font(20))
|
o2Title.textColor(0xffffff)
|
o2Title.align(dxui.Utils.ALIGN.TOP_MID, 0, 18)
|
|
// 氧气数值和单位容器
|
const o2ValueContainer = dxui.View.build(`o2ValueContainer${index}`, o2Box)
|
viewUtils._clearStyle(o2ValueContainer)
|
o2ValueContainer.setSize(100, 40)
|
o2ValueContainer.bgOpa(0)
|
o2ValueContainer.align(dxui.Utils.ALIGN.CENTER, 0, 0)
|
o2ValueContainer.flexFlow(dxui.Utils.FLEX_FLOW.ROW)
|
o2ValueContainer.flexAlign(dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER)
|
o2ValueContainer.obj.lvObjSetStylePadGap(5, 0)
|
|
// 氧气数值部分
|
const o2Value = dxui.Label.build(`o2Value${index}`, o2ValueContainer)
|
o2Value.text(gasItem.o2 || '未知')
|
o2Value.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
o2Value.textColor(0xffffff)
|
|
// 氧气单位部分
|
const o2Unit = dxui.Label.build(`o2Unit${index}`, o2ValueContainer)
|
o2Unit.text('%')
|
o2Unit.textFont(viewUtils.font(12))
|
o2Unit.textColor(0xffffff)
|
|
const o2Status = dxui.Label.build(`o2Status${index}`, o2Box)
|
o2Status.text(isO2Qualified ? '合格' : '不合格')
|
o2Status.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
o2Status.textColor(0xffffff)
|
o2Status.align(dxui.Utils.ALIGN.BOTTOM_MID, 0, -20)
|
}
|
|
|
// 显示磷化氢浓度和状态
|
if (gasItem.ph3 !== undefined || gasItem.statusPh3 !== undefined) {
|
const ph3Box = dxui.Image.build(`ph3Box${index}`, gasContainer)
|
viewUtils._clearStyle(ph3Box)
|
ph3Box.setSize(239, 166)
|
const isPh3Qualified = gasItem.statusPh3 === '0'
|
ph3Box.source(isPh3Qualified ? '/app/code/resource/image/ph3_s.png' : '/app/code/resource/image/ph3_f.png')
|
|
const ph3Title = dxui.Label.build(`ph3Title${index}`, ph3Box)
|
ph3Title.text('磷化氢')
|
ph3Title.textFont(viewUtils.font(20))
|
ph3Title.textColor(0xffffff)
|
ph3Title.align(dxui.Utils.ALIGN.TOP_MID, 0, 18)
|
|
// 磷化氢数值和单位容器
|
const ph3ValueContainer = dxui.View.build(`ph3ValueContainer${index}`, ph3Box)
|
viewUtils._clearStyle(ph3ValueContainer)
|
ph3ValueContainer.setSize(100, 40)
|
ph3ValueContainer.bgOpa(0)
|
ph3ValueContainer.align(dxui.Utils.ALIGN.CENTER, 0, 0)
|
ph3ValueContainer.flexFlow(dxui.Utils.FLEX_FLOW.ROW)
|
ph3ValueContainer.flexAlign(dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER)
|
ph3ValueContainer.obj.lvObjSetStylePadGap(5, 0)
|
|
// 磷化氢数值部分
|
const ph3Value = dxui.Label.build(`ph3Value${index}`, ph3ValueContainer)
|
ph3Value.text(gasItem.ph3 || '0')
|
ph3Value.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
ph3Value.textColor(0xffffff)
|
|
// 磷化氢单位部分
|
const ph3Unit = dxui.Label.build(`ph3Unit${index}`, ph3ValueContainer)
|
ph3Unit.text('PPM')
|
ph3Unit.textFont(viewUtils.font(12))
|
ph3Unit.textColor(0xffffff)
|
|
const ph3Status = dxui.Label.build(`ph3Status${index}`, ph3Box)
|
ph3Status.text(isPh3Qualified ? '合格' : '不合格')
|
ph3Status.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
ph3Status.textColor(0xffffff)
|
ph3Status.align(dxui.Utils.ALIGN.BOTTOM_MID, 0, -20)
|
}
|
|
// 显示二氧化碳浓度和状态
|
if (gasItem.co2 !== undefined || gasItem.statusCo2 !== undefined) {
|
const co2Box = dxui.Image.build(`co2Box${index}`, gasContainer)
|
viewUtils._clearStyle(co2Box)
|
co2Box.setSize(239, 166)
|
const isCo2Qualified = gasItem.statusCo2 === '0'
|
co2Box.source(isCo2Qualified ? '/app/code/resource/image/co2_s.png' : '/app/code/resource/image/co2_f.png')
|
|
const co2Title = dxui.Label.build(`co2Title${index}`, co2Box)
|
co2Title.text('二氧化碳')
|
co2Title.textFont(viewUtils.font(20))
|
co2Title.textColor(0xffffff)
|
co2Title.align(dxui.Utils.ALIGN.TOP_MID, 0, 18)
|
|
// 二氧化碳数值和单位容器
|
const co2ValueContainer = dxui.View.build(`co2ValueContainer${index}`, co2Box)
|
viewUtils._clearStyle(co2ValueContainer)
|
co2ValueContainer.setSize(100, 40)
|
co2ValueContainer.bgOpa(0)
|
co2ValueContainer.align(dxui.Utils.ALIGN.CENTER, 0, 0)
|
co2ValueContainer.flexFlow(dxui.Utils.FLEX_FLOW.ROW)
|
co2ValueContainer.flexAlign(dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER, dxui.Utils.FLEX_ALIGN.CENTER)
|
co2ValueContainer.obj.lvObjSetStylePadGap(5, 0)
|
|
// 二氧化碳数值部分
|
const co2Value = dxui.Label.build(`co2Value${index}`, co2ValueContainer)
|
co2Value.text(gasItem.co2 || '未知')
|
co2Value.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
co2Value.textColor(0xffffff)
|
|
// 二氧化碳单位部分
|
const co2Unit = dxui.Label.build(`co2Unit${index}`, co2ValueContainer)
|
co2Unit.text('PPM')
|
co2Unit.textFont(viewUtils.font(12))
|
co2Unit.textColor(0xffffff)
|
|
const co2Status = dxui.Label.build(`co2Status${index}`, co2Box)
|
co2Status.text(isCo2Qualified ? '合格' : '不合格')
|
co2Status.textFont(viewUtils.font(20, dxui.Utils.FONT_STYLE.BOLD))
|
co2Status.textColor(0xffffff)
|
co2Status.align(dxui.Utils.ALIGN.BOTTOM_MID, 0, -20)
|
}
|
})
|
|
// 显示页面
|
dxui.loadMain(screenMain)
|
} catch (error) {
|
logger.error('[gasDetailView] 初始化气体浓度详情页面失败:', error)
|
}
|
}
|
|
export default gasDetailView
|
