electricControl/.bin/main/set.js

278 lines
6.2 KiB
JavaScript
Raw Normal View History

2023-08-04 09:20:01 +08:00
(function() {
2023-08-04 10:55:53 +08:00
global.UIMultiSelector = api.require("UIMultiSelector");
2023-08-04 09:20:01 +08:00
var Set = /*@__PURE__*/ (function(Component) {
function Set(props) {
Component.call(this, props);
this.data = {
setList: [
2023-08-04 10:55:53 +08:00
{isSet: false, setVal: "", selectVal: "请选择", name: "高压风冷"},
{isSet: true, setVal: "", selectVal: "请选择", name: "中压风冷"},
{isSet: false, setVal: "", selectVal: "请选择", name: "低压风冷"},
{isSet: true, setVal: "", selectVal: "请选择", name: "闭锁调压"}
],
//电流通道列表
currentList: [
2023-08-04 09:20:01 +08:00
{
2023-08-04 10:55:53 +08:00
text: "1路",
status: "normal"
2023-08-04 09:20:01 +08:00
},
{
2023-08-04 10:55:53 +08:00
text: "2路",
status: "normal"
2023-08-04 09:20:01 +08:00
},
{
2023-08-04 10:55:53 +08:00
text: "3路",
status: "normal"
2023-08-04 09:20:01 +08:00
},
{
2023-08-04 10:55:53 +08:00
text: "4路",
status: "normal"
2023-08-04 09:20:01 +08:00
}
2023-08-04 10:55:53 +08:00
]
2023-08-04 09:20:01 +08:00
};
}
if (Component) Set.__proto__ = Component;
Set.prototype = Object.create(Component && Component.prototype);
Set.prototype.constructor = Set;
2023-08-04 10:55:53 +08:00
Set.prototype.apiready = function() {};
2023-08-04 09:20:01 +08:00
Set.prototype.handleBackIndex = function() {
api.navigateBack({
delta: 2
});
};
Set.prototype.handleSwitchChange = function(e) {
var _index = e.target.attributes.index;
this.data.setList.forEach(function(item, index) {
if (index === _index) {
item.isSet = e.detail.value;
}
});
};
2023-08-04 10:55:53 +08:00
Set.prototype.handleSelectChange = function(selectNum) {
var _setList = this.data.setList;
//设置下拉选项
UIMultiSelector.open(
{
rect: {
h: 400
},
text: {
title: "电流通道",
leftBtn: "取消",
rightBtn: "确认"
},
styles: {
mask: "rgba(0,0,0,0)",
title: {
bg: "#ffffff",
color: "#000000",
size: 36,
h: 80
},
leftButton: {
w: 160,
h: 80,
marginT: 5,
marginL: 8,
color: "#ffffff",
size: 36,
bg: "#5199FF"
},
rightButton: {
w: 160,
h: 80,
marginT: 5,
marginR: 8,
color: "#ffffff",
size: 36,
bg: "#5199FF"
},
item: {
h: 80,
bg: "#ffffff",
bgActive: "#5199FF",
bgHighlight: "#5199FF",
color: "#000000",
active: "#ffffff",
highlight: "#ffffff",
size: 36,
activeSize: 36,
lineColor: "#d8d8d8",
textAlign: "center"
}
},
max: 1,
singleSelection: true,
animation: true,
items: this.data.currentList
},
function(ret) {
if (ret.eventType === "clickLeft") {
UIMultiSelector.close();
} else if (
ret.eventType === "clickRight" ||
ret.eventType === "clickItem"
) {
UIMultiSelector.close();
_setList[selectNum].selectVal =
ret.items.length > 0 ? ret.items[0].text : _setList[selectNum].selectVal;
}
2023-08-04 09:20:01 +08:00
}
2023-08-04 10:55:53 +08:00
);
};
Set.prototype.handleSubmitSet = function() {
console.log("保存参数");
2023-08-04 09:20:01 +08:00
};
Set.prototype.render = function() {
var this$1 = this;
return apivm.h(
"view",
{class: "set_wrap"},
apivm.h(
"text",
{class: "set_back_text", onClick: this.handleBackIndex},
"返回"
),
apivm.h(
"view",
{class: "set_list"},
(Array.isArray(this.data.setList)
? this.data.setList
: Object.values(this.data.setList)
).map(function(item$1, index$1) {
return apivm.h(
"view",
{class: "list_inline"},
apivm.h(
"view",
{class: "inline_item"},
apivm.h("text", {class: "item_label"}, item$1.name, ""),
apivm.h(
"view",
{class: "item_content"},
apivm.h(
"view",
{class: "switch_box"},
apivm.h("switch", {
class: "switch",
index: index$1,
checked: item$1.isSet,
onChange: this$1.handleSwitchChange
})
),
apivm.h("input", {
class: "input",
type: "text",
disabled: !item$1.isSet,
placeholder: "请输入电流值"
})
)
),
apivm.h(
"view",
{class: "inline_item"},
apivm.h("text", {class: "item_label"}, "电流通道:"),
apivm.h(
"view",
{class: "item_content"},
apivm.h(
2023-08-04 10:55:53 +08:00
"text",
2023-08-04 09:20:01 +08:00
{
2023-08-04 10:55:53 +08:00
class: "item_label",
onClick: function() {
return this$1.handleSelectChange(index$1);
}
2023-08-04 09:20:01 +08:00
},
2023-08-04 10:55:53 +08:00
item$1.selectVal
2023-08-04 09:20:01 +08:00
)
)
)
);
})
2023-08-04 10:55:53 +08:00
),
apivm.h(
"text",
{class: "set_btn", onClick: this.handleSubmitSet},
"保存参数"
2023-08-04 09:20:01 +08:00
)
);
};
return Set;
})(Component);
Set.css = {
".set_wrap": {
width: "100%",
height: "100vh",
boxSizing: "border-box",
2023-08-04 10:55:53 +08:00
padding: "20px",
backgroundImage: 'url("../../image/login.png")',
backgroundSize: "120%",
backgroundRepeat: "no-repeat",
backgroundPosition: "center",
position: "relative"
2023-08-04 09:20:01 +08:00
},
2023-08-04 10:55:53 +08:00
".set_back_text": {
fontSize: "40px",
color: "#ffffff",
fontWeight: "bold",
position: "absolute",
top: "20px",
left: "20px"
},
".set_list": {marginTop: "80px", display: "flex", alignItems: "center"},
2023-08-04 09:20:01 +08:00
".list_inline": {
display: "flex",
flexDirection: "row",
alignItems: "center",
margin: "10px 0"
},
".inline_item": {
margin: "0 40px",
display: "flex",
flexDirection: "row",
alignItems: "center"
},
2023-08-04 10:55:53 +08:00
".item_label": {fontSize: "40px", fontWeight: "bold", color: "#ffffff"},
2023-08-04 09:20:01 +08:00
".item_content": {
display: "flex",
flexDirection: "row",
alignItems: "center"
},
".switch_box": {
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "76px",
height: "46px"
},
".switch": {transform: "scale(1.5, 1.5)"},
".input": {
boxSizing: "border-box",
padding: "5px",
border: "1px solid silver",
fontSize: "32px",
height: "60px",
width: "200px",
marginLeft: "20px",
borderRadius: "10px"
2023-08-04 10:55:53 +08:00
},
".set_btn": {
fontSize: "40px",
color: "#5199FF",
backgroundColor: "#ffffff",
boxSizing: "border-box",
padding: "10px 20px",
borderRadius: "10px",
textAlign: "center",
width: "300px",
margin: "50px auto 0",
fontWeight: "bold"
2023-08-04 09:20:01 +08:00
}
};
apivm.define("set", Set);
apivm.render(apivm.h("set", null), "body");
})();