const e="938ffb94-8afc-4c0d-95b1-66d0d59df174",a="custom-datetime-node",t="日期选择",n='',l="svg",o="基础",i="常用",m=!1,u=!0,s="时间",r=`{"type":"page","id":"u:270584784ce1","name":"page1","asideResizor":false,"style":{"boxShadow":" 0px 0px 0px 0px transparent"},"pullRefresh":{"disabled":true},"body":[{"type":"tabs","name":"tab","tabs":[{"title":"样式","icon":"fa fa-th-large","body":[{"type":"form","title":"","name":"basicPropForm","body":[{"type":"input-text","label":"名称","name":"nodeAlias","id":"u:6b126f0520cb","size":"full","mode":"horizontal","inputControlClassName":"w-100","className":"m-b"},{"type":"input-text","label":"ID ","name":"id","id":"u:6232710ac003","size":"full","mode":"horizontal","inputControlClassName":"w-100","className":"m-b"},{"type":"grid","id":"u:1954dc15dd5b","className":"m-b","columns":[{"body":[{"type":"input-number","label":"宽度","name":"width","keyboard":true,"id":"u:656efdb758ad","step":1,"suffix":"px","placeholder":"组件宽度","size":"full","mode":"horizontal","className":"m-b","value":100,"labelClassName":"w-8","labelAlign":"left","precision":2,"inputClassName":"w-full"}],"id":"u:4274c47a4ef5","md":6},{"body":[{"type":"input-number","label":"高度","name":"height","keyboard":true,"id":"u:1ed6dcd98c1a","step":1,"suffix":"px","placeholder":"组件高度","size":"full","mode":"horizontal","className":"m-b","value":100,"labelAlign":"left","labelClassName":"w-8","precision":2,"inputClassName":"w-full"}],"id":"u:3e9d1e71a69f","md":6}]},{"type":"grid","id":"u:c605398a724c","className":"m-b","columns":[{"body":[{"type":"input-number","label":"X 轴","name":"x","keyboard":true,"id":"u:dcc0c21d16f6","step":1,"suffix":"px","placeholder":"组件左边距","size":"full","mode":"horizontal","className":"m-b","value":200,"labelAlign":"left","precision":2,"inputClassName":"w-full","labelClassName":"w-8"}],"id":"u:14cc19d6ffb0","md":6},{"body":[{"type":"input-number","label":"Y 轴","name":"y","keyboard":true,"id":"u:cd6fdff9ca88","step":1,"suffix":"px","placeholder":"组件上边距","size":"full","mode":"horizontal","className":"m-b","value":200,"labelAlign":"left","precision":2,"inputClassName":"w-full","labelClassName":"w-8"}],"id":"u:4931801ca9b8","md":6}]},{"type":"grid","id":"u:a332a7bf83c1","className":"m-b","columns":[{"body":[{"type":"input-number","label":"旋转","name":"rotation","id":"u:f6a2dbb518f9","placeholder":"组件旋转角度","mode":"horizontal","size":"full","className":"","keyboard":true,"step":1,"suffix":"deg","value":0,"labelAlign":"left","inputClassName":"w-full"}],"id":"u:646cd98b7955","md":6},{"body":[{"type":"input-number","label":"透明","name":"opacity","id":"u:cf80f59d8d42","placeholder":"组件透明度","mode":"horizontal","size":"full","className":"m-b","keyboard":true,"step":1,"suffix":"","value":1,"inputClassName":"w-full"}],"id":"u:51ddf54ac749","md":6}],"gap":""},{"type":"grid","columns":[{"body":[{"type":"input-color","label":"填充","name":"fill","id":"u:0d19ed3e2bdc","placeholder":"","mode":"horizontal","size":"full","className":"m-b","format":"rgba","inputClassName":"w-full"}],"id":"u:facc5c90e990","md":6},{"body":[{"type":"input-color","label":"描边","name":"strokeColor","id":"u:89afff5fd00d","placeholder":"","mode":"horizontal","size":"full","className":"m-b","format":"rgba","inputClassName":"w-full"}],"id":"u:7c903d9d40ab","md":6}],"id":"u:457970dd35bf","className":"m-b"},{"type":"grid","columns":[{"body":[{"type":"input-number","label":"边宽","name":"strokeWidth","id":"u:8dcf62d3dab5","placeholder":"描边宽度","mode":"horizontal","size":"full","className":"m-b","keyboard":true,"step":1,"value":1,"suffix":"px","inputClassName":"w-full"},{"type":"switch","label":"范围时间","option":"","name":"isRange","falseValue":false,"trueValue":true,"id":"u:54fd94662263","value":false,"mode":"horizontal"}],"id":"u:d701217b85ef","md":6},{"body":[{"type":"input-text","label":"内容","name":"content","id":"u:bea5a408f98f","mode":"horizontal","size":"full","inputControlClassName":"inputControlClassName-bea5a408f98f"}],"id":"u:afc37bde0156","md":6}],"id":"u:235f153e5ad5","className":"m-b"},{"type":"grid","columns":[{"body":[{"type":"select","label":"时间类型","name":"timeType","options":[{"label":"年","value":"year"},{"label":"月","value":"month"},{"label":"日期时间","value":"datetime"}],"id":"u:0896ce2301d0","multiple":false,"mode":"horizontal","inputClassName":"w-full"},{"type":"select","label":"文本对齐","name":"textAlign","options":[{"label":"左对齐","value":"left"},{"label":"居中对齐","value":"center"}],"id":"u:b6da4c84bd7c","multiple":false,"mode":"horizontal","inputClassName":"w-full"},{"type":"switch","label":"深色UI","option":"","name":"darkTheme","falseValue":false,"trueValue":true,"id":"u:b0988280ebc7","value":false,"mode":"horizontal"},{"type":"input-color","label":"选择器背景","name":"dateSelectBack","id":"u:6df1b3e36fbc","format":"rgba","mode":"horizontal","inputClassName":"w-full"},{"type":"input-color","label":"选择器边框","name":"dateSelectBorderColor","id":"u:fbd675233085","format":"rgba","mode":"horizontal","inputClassName":"w-full"},{"type":"select","label":"选择器主题","name":"selectTheme","options":[{"label":"墨绿主题","value":"molv"},{"label":"格子主题","value":"grid"},{"label":"圆圈高亮主题","value":"circle"}],"id":"u:ff6315d77835","multiple":false,"creatable":true,"mode":"horizontal","inputClassName":"w-full","value":"molv","clearable":true}],"id":"u:b4ebc7d7c151"}],"id":"u:e7d6402954c5","className":"m-b"},{"type":"fieldset","id":"u:2a93d8eee7a9","className":"","title":"字体","collapsable":true,"body":[{"type":"container","id":"u:1606d0ad8360","body":[{"type":"select","id":"u:6f3470628b86","label":"字体类型","name":"fontFamily","mode":"horizontal","horizontal":{"leftFixed":"sm"},"size":"lg","options":[{},{"label":"宋体","value":"SimSun"},{"label":"微软雅黑","value":"Microsoft Yahei"},{"label":"苹方","value":"PingFang SC"},{"label":"Andale Mono","value":"andale mono,monospace"},{"label":"Arial","value":"arial,helvetica,sans-serif"},{"label":"Arial Black","value":"arial black,sans-serif"},{"label":"Book Antiqua","value":"book antiqua,palatino,serif"},{"label":"Comic Sans MS","value":"comic sans ms,sans-serif"},{"label":"Courier New","value":"courier new,courier,monospace"},{"label":"Georgia","value":"georgia,palatino,serif"},{"label":"Helvetica Neue","value":"Helvetica Neue"},{"label":"Helvetica","value":"helvetica,arial,sans-serif"},{"label":"Impact","value":"impact,sans-serif"},{"label":"Symbol","value":"symbol"},{"label":"Tahoma","value":"tahoma,arial,helvetica,sans-serif"},{"label":"Terminal","value":"terminal,monaco,monospace"},{"label":"Times New Roman","value":"times new roman,times,serif"},{"label":"Trebuchet MS","value":"trebuchet ms,geneva,sans-serif"},{"label":"Verdana","value":"verdana,geneva,sans-serif"}],"multiple":false,"className":"m-b","menuTpl":"\${label}","inputClassName":""},{"type":"input-color","label":"字体","name":"fontColor","id":"u:f398c821eda1","mode":"horizontal","size":"lg","className":"m-b","format":"rgba","placeholder":"字体颜色","horizontal":{"leftFixed":"sm"},"inputClassName":""},{"type":"input-number","id":"u:0063eed6ed66","label":"字体大小","name":"fontSize","min":12,"step":1,"mode":"horizontal","horizontal":{"leftFixed":"sm"},"className":"m-b","keyboard":true,"displayMode":"enhance","value":12,"max":100},{"type":"checkboxes","id":"u:b34f4c274416","className":"custom-checkbox-style m-b","label":"文字样式","name":"fontStyle","options":[{"label":"fa-bold fa","value":"bold"},{"label":"fa-italic fa","value":"italic"},{"label":"fa-underline fa","value":"underline"},{"label":"fa fa-strikethrough","value":"line-through"}],"checkAll":false,"joinValues":true,"mode":"horizontal","horizontal":{"leftFixed":"sm"},"optionType":"button","menuTpl":"","inputClassName":"","multiple":true},{"type":"checkboxes","label":"文字位置","name":"fontAlign","multiple":false,"options":[{"label":"fa fa-align-left","value":"left"},{"label":"fa fa-align-center","value":"center"},{"label":"fa fa-align-right","value":"right"},{"label":"fa fa-align-justify","value":"justify"}],"id":"u:7e80e906ea14","checkAll":false,"joinValues":true,"mode":"horizontal","horizontal":{"leftFixed":"sm"},"optionType":"button","menuTpl":"","inputClassName":"","className":"custom-checkbox-style m-b"},{"type":"input-number","label":"文字行高","name":"lineHeight","keyboard":true,"id":"u:0063eed6ed66","step":1,"mode":"horizontal","horizontal":{"leftFixed":"sm"},"displayMode":"enhance","className":"m-b"}],"style":{"position":"static","display":"block"},"wrapperBody":false}],"bodyClassName":"m-b"}],"id":"u:a5ebe5f02407","submitText":"","onEvent":{"change":{"weight":0,"actions":[]}},"debug":false,"mode":"normal","panelClassName":"p","labelAlign":"left","className":"","wrapWithPanel":true}],"id":"u:c309ae58472c","className":"p-none no-border"},{"title":"交互","icon":"fa fa-calendar-minus-o","body":[{"type":"service","body":[{"type":"collapse","key":"2","header":"事件","body":[{"type":"service","id":"u:4ec2acc50405","body":[{"type":"combo","label":"","name":"eventCombo","multiple":true,"addable":false,"removable":false,"removableMode":"icon","addBtn":{"label":"新增","icon":"fa fa-plus","level":"primary","size":"sm","id":"u:ae1b0a0c0f55"},"items":[{"type":"select","name":"eventType","placeholder":"选择事件","options":[{"label":"改变","value":"change"}],"id":"u:a7b44847011a","label":"名称"},{"type":"checkBox","id":"u:79dadbc61f74","name":"enable","label":"启用"},{"type":"input-text","id":"u:6efb6f120e47","name":"targetNode","label":"目标节点","multiple":false,"mode":"horizontal","inputClassName":"w-full","visibleOn":"this.eventType === 'change'","removable":"true","placeholder":"目标节点id"},{"type":"select","label":"入参类型","name":"targetParamsType","options":[{"label":"物实体","value":"entitys"},{"label":"物属性","value":"attrs"},{"label":"时间","value":"times"}],"id":"u:d10a57a9b966","multiple":false,"mode":"horizontal","inputClassName":"w-full","removable":true},{"type":"radios","label":"入参实体","name":"targetParamsEntitys","options":[{"label":"物组","value":"group"},{"label":"列表","value":"list"},{"label":"关系","value":"relation"},{"label":"搜索","value":"search"},{"label":"标签","value":"tag"},{"label":"类型","value":"type"}],"id":"u:26df91ece010","onEvent":{"change":{"actions":[{"actionType":"custom","script":"console.log('event', event);"}]}},"checkAll":false,"joinValues":true,"inputClassName":"w-full text-left","mode":"horizontal","labelClassName":"","visibleOn":"this.targetParamsType === 'entitys'"},{"type":"radios","label":"属性类型","name":"targetParamsAttrsType","options":[{"label":"分属性","value":"split"},{"label":"全部","value":"all"}],"id":"u:26df91ece010","checkAll":false,"joinValues":true,"inputClassName":"w-full text-left","mode":"horizontal","labelClassName":"","visibleOn":"this.targetParamsType === 'attrs'"},{"type":"radios","label":"入参属性","name":"targetParamsAttrsKeysEntitys","options":[{"label":"物","value":"entitys"},{"label":"属性","value":"keys"}],"id":"u:26df91ece010","checkAll":false,"joinValues":true,"inputClassName":"w-full text-left","mode":"horizontal","labelClassName":"","visibleOn":"this.targetParamsType === 'attrs'"},{"type":"radios","label":"入参时间","name":"targetParamsTimesType","options":[{"label":"最近","value":"nearest"},{"label":"时间段","value":"range"},{"label":"区间","value":"interval"}],"id":"u:26df91ece010","multiple":false,"checkAll":false,"joinValues":true,"inputClassName":"w-full text-left","mode":"horizontal","labelClassName":"","visibleOn":"this.targetParamsType === 'times'"},{"type":"input-text","label":"超级api","name":"apiId","id":"u:912394455375","placeholder":"超级apiId"}],"id":"u:364496dd313b","deleteBtn":{"type":"icon","icon":"fa fa-trash","id":"u:6d4a75088bc2","className":"border-none"},"strictMode":true,"syncFields":[],"labelClassName":""}],"data":{"eventCombo":[{"eventType":"click","enable":false,"config":""},{"eventType":"dblClick","enable":false,"config":""}]},"name":"eventsService"}],"id":"u:14834e895716","headingClassName":"p-sm bg-white b-b b-light","className":"m-b r-3x","bodyClassName":"p-none"}],"id":"u:3eb6b9a42dcb","name":"dynamicService"}],"id":"u:043251c106af","className":"p-sm"},{"title":"脚本解析","icon":"fa fa-star","body":[{"type":"flex","id":"u:edef8e21c1e3","justify":"flex-end","items":[{"type":"button","id":"u:f6d8d837a48d","label":"导入","onEvent":{"click":{"actions":[]}},"icon":"fa fa-download","level":"primary","className":"mr-2"},{"type":"button","id":"u:23f988f98a28","label":"保存","onEvent":{"click":{"actions":[{"actionType":"setValue","componentId":"u:6dc2a126004a","args":{"value":{"save":true}}}]}},"icon":"fa fa-save"}]},{"type":"service","id":"u:6dc2a126004a","body":[{"type":"tpl","id":"u:c77724a2f3b3","tpl":"function (context, service, nodeId) {","inline":true,"wrapperComponent":"","style":{"fontFamily":"","fontSize":16}},{"type":"editor","label":"","name":"script","id":"u:55ceb80e58a7","language":"javascript","size":"xxl","className":"m-b-none","onEvent":{"focus":{"actions":[{"actionType":"setValue","componentId":"u:6dc2a126004a","args":{"value":{"save":false}}}]}},"description":"参数提示：\\n1. context 是整个看板上下文，可以获取看板所有元素节点和连线节点，也可以访问 context.globalDatas 获取全局socket 数据。 \\n2. service 是 Ajax 请求服务。\\n3. nodeId 是节点 id . \\n4. 如果返回一个函数，则可以当socket 数据更新时，调用此函数，此函数入参分别是 context, service, nodeId, globalDatas ;，以满足多样化的业务需求。"},{"type":"tpl","tpl":"}","inline":true,"wrapperComponent":"","id":"u:fa21aebb859b","style":{"fontFamily":"","fontSize":16}}],"name":"scriptService","data":{"script":"","save":false},"className":"text-left"}],"id":"u:dc8d331cbe5e"}],"id":"u:178107498966","tabsMode":"radio","className":"p-none w-full","contentClassName":"p-none"}],"className":""}`,d={jsPlugin:'[{"url":"./logicflow/core.umd.js","isModule":false,"disabled":true},{"url":"./logicflow/extensionLib/NodeResize.js","isModule":false,"disabled":true}]',json:`{
"nodes": [
{
"id": "ce04328f-02d5-4d08-8694-7e3408566165",
"type": "custom-datetime-node",
"x": 200,
"y": 200,
"text": {
"value": "",
"x": 200,
"y": 200
},
"properties": {
"id": "ce04328f-02d5-4d08-8694-7e3408566165",
"width": 150,
"height": 35,
"x": 200,
"y": 200,
"rotation": 0,
"opacity": 1,
"strokeWidth": 1,
"isRange": false,
"darkTheme": true,
"selectTheme": "molv",
"fontSize": 13,
"nodeAlias": "日期",
"fontColor": "#ffffff",
"fill": "rgba(74, 144, 226, 1)",
"strokeColor": "rgba(74, 144, 226, 1)",
"timeType": "datetime",
"dateSelectBack": "rgba(13, 13, 45, 1)",
"textAlign": "left",
"dateSelectBorderColor": "rgba(23, 23, 81, 1)",
"dynamic": {
"normalData": {
"dataPoint": "",
"compareType": "",
"conditionVariables": [],
"defaultValue": "",
"unit": ""
},
"eventsData": {
"eventCombo": [
{
"eventType": "change",
"enable": false,
"config": "",
"targetParamsType": "times",
"targetParamsTimesType": "nearest"
}
]
},
"uiData": {
"dataPoint": "",
"compareType": "",
"conditionVariables": []
}
}
}
}
]
}`,javascript:`
const { createApp, createVNode, render } = Vue;
const app = createApp({})
const DateTime = {
template: \`
\`,
props: {
nodeId: {
type: String,
default: ''
},
defaultValue: {
type: String,
default: '[]'
},
isRange: {
type: Boolean,
default: false
},
fontColor: {
type: String,
default: '#333'
},
fontSize: {
type: Number,
default: 14
},
fontFamily: {
type: String,
default: '宋体'
},
fontStyle: {
type: String,
default: 'normal'
},
width: {
type: Number,
default: 150
},
height: {
type: Number,
default: 35
},
lineHeight: {
type: Number,
default: 35,
},
strokeWidth: {
type: Number,
default: 2,
},
borderColor: {
type: String,
default: '#666'
},
backgroundColor: {
type: String,
default: '#ffffff',
},
timeType: {
type: String,
default: 'datetime',
},
darkTheme: {
type: Boolean,
default: false
},
dateSelectBack: {
type: String,
default: '#ffffff'
},
textAlign: {
type: String,
default: 'left'
},
selectTheme: {
type: String,
default: 'molv'
},
dateSelectBorderColor: {
type: String,
default: '#e2e2e2'
}
},
emits: ["change"],
setup(props, { emit }) {
const { ref, toRefs, computed, onMounted } = Vue;
const dateTime = ref('');
const getNodeId = computed(() => {
return 'dateTimePicker'
})
const { width, height, lineHeight } = toRefs(props)
const cssStyle = computed(() => {
const borderWidths = props.strokeWidth * 6;
const realWidth = parseInt(width.value);
const realHeight = parseInt(height.value);
return \`
position: relative;
color: \${props.fontColor};
font-size: \${props.fontSize}px;
text-align: \${props.textAlign};
border-width: \${props.strokeWidth}px;
border-style: solid;
width: \${realWidth - borderWidths}px;
height: \${realHeight - borderWidths}px;
line-height: \${lineHeight.value - borderWidths}px;
border-radius: 4px;
border-color:\${props.borderColor};
background-color:\${props.backgroundColor};
padding-left: \${props.textAlign === 'left' ? 10 : 0}px;
outline: none;\`
})
const getOuterStyle = computed(() => {
const w = parseInt(width.value);
const h = parseInt(height.value);
return \`
width: \${w}px;
height: \${h}px;
\`
})
onMounted(() => {
setTimeout(() => {
layui.use('laydate', function () {
layui.laydate.index = Date.now();
var laydate = layui.laydate;
//执行一个laydate实例
laydate.render({
elem: '#' + getNodeId.value,
theme: props.selectTheme,
value: new Date(),
type: props.timeType,
range: props.isRange,
trigger: 'click',
done: function (value, date, endDate) {
if (props.isRange) {
emit('change', {
start: date,
end: endDate
})
} else {
emit('change', {
start: value,
end: endDate
})
}
},
ready: function () {
if (props.darkTheme && props.dateSelectBack && props.dateSelectBack !== '#ffffff') {
const layDateDom = document.querySelector('.layui-laydate');
layDateDom.classList.add('dark-custom-theme');
const stylesheet = document.createElement('style');
stylesheet.innerText = \`
.layui-laydate.dark-custom-theme {
background-color: \${props.dateSelectBack};
border: none;
}
.layui-laydate.dark-custom-theme .layui-laydate-list {
background-color: \${props.dateSelectBack};
}
.layui-laydate.dark-custom-theme .laydate-month-list {
background-color: \${props.dateSelectBack};
}
.layui-laydate.dark-custom-theme .laydate-year-list {
background-color: \${props.dateSelectBack};
}
.layui-laydate.dark-custom-theme .layui-laydate-footer span {
background-color: \${props.dateSelectBack};
}
.layui-laydate.dark-custom-theme .layui-laydate-content {
border-color: \${props.dateSelectBorderColor};
}
.layui-laydate.dark-custom-theme .layui-laydate-footer {
border-color: \${props.dateSelectBorderColor};
}
.layui-laydate.dark-custom-theme .layui-laydate-footer span{
border-color: \${props.dateSelectBorderColor};
}
\`;
const head = document.getElementsByTagName('head')[0];
head.appendChild(stylesheet);
}
},
});
// 初始化默认时间传给外部
const timesFormat = {
year: 'YYYY',
month: 'YYYY-MM',
datetime: 'YYYY-MM-DD HH:mm:ss'
}
if (props.isRange) {
if (props.timeType === 'year') {
emit('change', {
start: window.dayjs(new Date().getTime()).startOf('year').subtract(1, ' year').format(timesFormat[props.timeType]),
end: window.dayjs(new Date().getTime()).startOf('year').format(timesFormat[props.timeType]),
})
} else if (props.timeType === 'month') {
emit('change', {
start: window.dayjs(new Date().getTime()).startOf('month').subtract(1, ' month').format(timesFormat[props.timeType]),
end: window.dayjs(new Date().getTime()).startOf('month').format(timesFormat[props.timeType]),
})
} else {
emit('change', {
start: window.dayjs(new Date().getTime()).startOf('day').format(timesFormat[props.timeType]),
end: window.dayjs(new Date().getTime()).endOf('day').format(timesFormat[props.timeType]),
})
}
} else {
emit('change', {
start: window.dayjs(new Date().getTime()).format(timesFormat[props.timeType]),
end: ''
})
}
});
// if (props.darkTheme) {
// document.getElementById('layui_theme_css').setAttribute('href', './plugins/layui/css/layui-theme-dark.css')
// } else {
// document.getElementById('layui_theme_css').removeAttribute('href')
// }
}, 200)
})
return {
getNodeId,
dateTime,
cssStyle,
getOuterStyle,
}
}
}
class CustomDateTimeNode extends HtmlResize.view {
oldProperties = {}
setHtml(rootEl) {
const { graphModel } = this.props;
const { properties, width, height } = this.props.model;
const { isRange, fontColor, fontSize, fontFamily, fontStyle, strokeWidth, strokeColor,
lineHeight, fill, id, timeType, darkTheme, dateSelectBack, textAlign, selectTheme, dateSelectBorderColor } = properties;
const { normalData } = properties.dynamic || {};
const { defaultValue } = normalData || {};
const { model } = this.props;
const el = document.createElement('div');
rootEl.innerHTML = '';
const changeHandler = (e) => {
graphModel.eventCenter.emit("node:change", {
data: this.props.model,
e,
});
}
const { uiData } = properties.dynamic || {};
let fillColor = fill
let fontC = fontColor
let realValue = ''
if (uiData) {
realValue = window.resolveScadaNewValue(uiData.defaultValue)
if (realValue !== '') {
uiData.conditionVariables.forEach((item) => {
if (item.type === 'rangeColor') {
let from = item.from;
let to = item.to;
if (item.from >= item.to) {
from = item.to;
to = item.from;
}
if (item.backColor && Number(realValue) >= from && Number(realValue) <= to) {
fillColor = item.backColor
}
if (item.fontColor && Number(realValue) >= from && Number(realValue) <= to) {
fontC = item.fontColor
}
} else if (item.type === 'equal') {
if (Number(realValue) === Number(item.value)) {
item.backColor && (fillColor = item.backColor);
item.fontColor && (fontC = item.fontColor);
dynamicName = item.valueLabel;
}
} else if (item.type === 'boolean') {
if (realValue === 'true' || realValue === true) {
item.backColor && (fillColor = item.backColor);
item.fontColor && (fontC = item.fontColor);
dynamicName = item.valueLabel;
}
}
})
}
}
const instance = createVNode(DateTime, {
nodeId: id,
isRange: isRange,
fontColor: fontC,
fontSize, fontFamily, fontStyle, width: properties.width, height: properties.height, lineHeight,
backgroundColor: fillColor,
borderColor: strokeColor,
strokeWidth,
defaultValue,
timeType: timeType,
darkTheme,
dateSelectBack,
textAlign,
selectTheme,
dateSelectBorderColor,
onChange: changeHandler
})
instance.appContext = app._context
render(instance, el)
rootEl.appendChild(el);
}
sameProps(properties) {
const isSame = window._.isEqual(this.oldProperties, properties);
if (isSame) return true;
this.oldProperties = properties;
return false
}
// 生命周期 支持重写内容, 但格式需一致
shouldUpdate() {
const { properties } = this.props.model;
const propertiesBack = window._.cloneDeep(properties);
// 由于事件change 会给properties 增加一个 event 属性（见目录scadaDashboard/Diagram/useDynamicEventsHandler），会引发属性的改变，导致组件重渲染。
delete propertiesBack.event;
if (this.sameProps(propertiesBack)) {
return false
}
return true;
}
}
class CustomDateTimeModel extends HtmlResize.model {
initNodeData(data) {
// 自定义组件，需最开始重置一下text 。
data.text = {
value: "",
x: data.x,
y: data.y,
};
super.initNodeData(data);
const { properties } = this;
this.width = properties.width || 80;
this.height = properties.height || 35;
this.text.editable = false; // 不允许文本被编辑
}
setAttributes() {
// 自定义组件需重置 text
const { x, y, properties } = this;
const { textHorizontalMove = 0, textVerticalMove = 0 } = properties;
this.text = {
...this.text,
x: x + textHorizontalMove,
y: y + textVerticalMove,
value: "",
}
}
}
lf.register({
type: 'custom-datetime-node',
view: CustomDateTimeNode,
model: CustomDateTimeModel,
})
`,css:"",fakeData:""},c={id:e,name:a,aliasName:t,image:n,imageType:l,groupName:o,groupType:i,isRemote:!1,isDefault:!0,sectionType:s,config:r,files:d};export{t as aliasName,r as config,c as default,d as files,o as groupName,i as groupType,e as id,n as image,l as imageType,u as isDefault,m as isRemote,a as name,s as sectionType};