页面对象修改：文字、颜色、显隐和跳转 | HQ VISU Designer

findComponent(nameOrId) 返回页面上的真实 DOM；getComponentData(nameOrId) 返回导出时的组件数据。前者适合直接改样式，后者适合读组件原始位置、宽高、角度和元信息。

• 想直接改样式时先用 findComponent
• 想读导出数据时再用 getComponentData
• 对象名建议尽量稳定，方便脚本查找

var titleEl = qtedit.findComponent("Title 1");
var titleData = qtedit.getComponentData("Title 1");

if (titleEl && titleData) {
  titleEl.style.color = "#e11d48";
  qtedit.setComponentLayout("Title 1", { width: titleData.width });
}

这是最常用的一组页面修改方法。它们适合在页面脚本、点击脚本和质量判断中快速改变对象显示效果，而不需要自行处理 DOM 细节。

• 改字用 setComponentText
• 改填充用 setComponentFill
• 改边框用 setComponentBorder
• 显隐控制用 setComponentVisible

qtedit.setComponentText("Title 1", "READY");
qtedit.setComponentFill("PumpBody", "#16a34a");
qtedit.setComponentBorder("PumpBody", "#166534");
qtedit.setComponentVisible("AlarmIcon", false);

这是高阶但非常实用的方法。当目标组件的新位置、新尺寸或新角度已经明确时，可以直接用它补布局。适合拖动结果回写、特殊定位、页面初始化纠偏和不适合用固定行为表达的复杂布局。

• x / y 控位置
• width / height 控尺寸
• angle 控角度
• 只改局部字段时也可以只传需要修改的字段

qtedit.setComponentLayout("Rectangle 1", {
  x: 120,
  y: 80,
  width: 260,
  height: 100,
  angle: 0
});

页面跳转、跨包跳转、外链打开、语言切换和强制刷新都在这一组中。同包页面优先使用 openPage，跨包页面优先使用 openScreen，外部站点优先使用 openWebsite，语言切换后可配合 notifyLanguageChange 或 refreshView。

• 同包跳转用 openPage
• 跨包跳转用 openScreen
• 外部网址用 openWebsite
• 语言和标签变更后可通知运行时刷新

qtedit.openPage("Alarm");
qtedit.openScreen("PUMP_OVERVIEW");
qtedit.useLanguage("zh-CN");
qtedit.notifyLanguageChange();
qtedit.refreshView();

页面需要记录当前 tab、当前选中设备或最近一次交互动作时，可以写入页面变量。该方法只适合页面联动，不等同于写 PLC，也不应代替正式 Tag 写值。

• 适合切换 tab、筛选状态和当前选择
• 不适合设备控制
• 正式设备写入仍应使用 Write Tag 或写值动作

qtedit.writeVariable("currentTab", "alarm");
qtedit.writeVariable("selectedDevice", "Pump01");

`ReadBrowserStorage`、`WriteBrowserStorage` 和 `RemoveBrowserStorage` 用于保存页面偏好，例如上次选择的区域、折叠状态或显示模式。浏览器存储受运行环境影响，不应用作设备控制、关键业务状态或长期审计记录。

• 适合界面偏好和当前选择
• 不适合作为设备控制链路
• 不适合保存关键业务记录

var area = ReadBrowserStorage("selectedArea", "A01", "local");
WriteBrowserStorage("selectedArea", area, "local");
RemoveBrowserStorage("selectedArea", "local");