You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
567 lines
46 KiB
567 lines
46 KiB
const e="aaa9be68-db1f-4bd3-8812-2ba0fa7b2cf3",t="custom-3d-piechart",n="3D立体饼图",a='<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1697434948946" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10369" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M931.76 423.52l-0.34 121.13-433.37 7.03 0.34-121.13 433.37-7.03z" fill="#CBD0D8" p-id="10370"></path><path d="M498.39 430.55l-0.34 121.13-305.61 177.6 0.34-121.13 305.61-177.6z" fill="#D1D5E0" p-id="10371"></path><path d="M64.78 429.31l-0.34 121.13c-0.18 64.69 42.51 129.48 128 178.84l0.34-121.13C107.3 558.79 64.6 494 64.78 429.31z" fill="#C0C6CE" p-id="10372"></path><path d="M804 253c81.85 47.25 124.45 108.65 127.78 170.57l-433.37 7-305.63 177.58C22.9 510.06 22 351 190.78 252.95S634.1 154.87 804 253z" fill="#E1E4EF" p-id="10373"></path><path d="M959.36 449.41a153 153 0 0 1 0 16.09C955.9 526.72 914 587.29 833.55 634L526 456.44z" fill="#F98282" p-id="10374"></path><path d="M959.56 457.74q0 3.88-0.22 7.76-0.15 2.75-0.42 5.5c-0.06 0.6-0.13 1.2-0.2 1.8-0.13 1.23-0.26 2.46-0.43 3.69-0.09 0.72-0.21 1.44-0.32 2.16-0.16 1.11-0.33 2.22-0.51 3.32-0.13 0.77-0.28 1.53-0.42 2.3-0.19 1-0.38 2-0.6 3.06s-0.49 2.23-0.74 3.34c-0.2 0.86-0.39 1.72-0.61 2.58-0.28 1.14-0.6 2.28-0.91 3.42-0.23 0.83-0.44 1.65-0.68 2.48-0.35 1.2-0.73 2.39-1.11 3.59-0.24 0.76-0.47 1.53-0.72 2.29-0.45 1.35-0.93 2.69-1.42 4-0.22 0.61-0.42 1.22-0.65 1.83q-1.12 3-2.36 5.92c-0.19 0.44-0.4 0.89-0.59 1.33-0.66 1.53-1.32 3-2 4.57-0.33 0.72-0.69 1.43-1 2.14-0.6 1.24-1.2 2.49-1.83 3.73-0.4 0.79-0.83 1.58-1.25 2.37-0.61 1.16-1.23 2.32-1.88 3.47-0.43 0.77-0.87 1.54-1.31 2.3q-1.12 2-2.3 3.89-0.7 1.15-1.41 2.29c-0.82 1.32-1.68 2.63-2.54 3.94-0.47 0.71-0.93 1.42-1.4 2.12-1.05 1.55-2.14 3.1-3.25 4.65-0.32 0.44-0.61 0.88-0.93 1.32q-2.16 3-4.47 5.9c-0.29 0.38-0.61 0.75-0.9 1.12q-2.21 2.79-4.56 5.55l-1.61 1.89q-2.4 2.77-4.92 5.52l-0.94 1q-3 3.2-6.14 6.36l-1.74 1.76q-2.51 2.47-5.12 4.92c-0.66 0.61-1.3 1.23-2 1.84-1.06 1-2.14 1.94-3.23 2.9-0.85 0.75-1.69 1.51-2.55 2.26-1.13 1-2.3 2-3.46 2.94-0.85 0.72-1.69 1.44-2.56 2.15-1.24 1-2.5 2-3.77 3-0.83 0.66-1.65 1.33-2.49 2-1.43 1.12-2.89 2.22-4.36 3.33-0.72 0.54-1.41 1.09-2.14 1.63q-3.31 2.46-6.73 4.88l-0.19 0.13q-3.34 2.36-6.79 4.67c-0.78 0.52-1.59 1-2.38 1.56-1.6 1.06-3.21 2.12-4.85 3.17-1 0.61-1.95 1.22-2.92 1.83-1.51 0.94-3 1.89-4.55 2.82-2.2 1.33-4.42 2.66-6.67 4l-0.34 121.13q3-1.76 6-3.56l0.68-0.42c1.52-0.93 3-1.86 4.51-2.8 1-0.62 2-1.23 3-1.85 1.63-1 3.23-2.1 4.83-3.15 0.79-0.52 1.61-1 2.39-1.57q3.51-2.36 6.91-4.75h0.07q3.43-2.42 6.73-4.88c0.74-0.55 1.45-1.11 2.18-1.66 1.45-1.1 2.9-2.19 4.32-3.3 0.85-0.66 1.67-1.33 2.5-2 1.26-1 2.52-2 3.76-3 0.87-0.72 1.71-1.44 2.57-2.16 1.16-1 2.32-2 3.45-2.94 0.87-0.75 1.71-1.51 2.56-2.27 1.08-1 2.16-1.92 3.21-2.89l0.85-0.77c0.39-0.36 0.74-0.72 1.12-1.08q2.61-2.44 5.11-4.91l1.68-1.66q3.15-3.16 6.14-6.36l0.94-1q2.52-2.75 4.92-5.52l1.62-1.89q2.34-2.76 4.55-5.55c0.23-0.29 0.48-0.57 0.7-0.85l0.2-0.27q2.3-2.94 4.47-5.9c0.32-0.44 0.62-0.88 0.93-1.32 1.11-1.55 2.2-3.09 3.26-4.65 0.48-0.7 0.93-1.41 1.4-2.12 0.87-1.31 1.72-2.62 2.54-3.94q0.72-1.14 1.41-2.29 1.18-1.94 2.3-3.89c0.27-0.47 0.56-0.93 0.82-1.4 0.17-0.3 0.32-0.61 0.49-0.91a295.241 295.241 0 0 0 3.13-5.84c0.63-1.24 1.24-2.49 1.84-3.73 0.34-0.71 0.7-1.42 1-2.13 0.71-1.52 1.38-3.05 2-4.58 0.19-0.44 0.39-0.88 0.58-1.32q1.24-3 2.36-5.93l0.06-0.16c0.21-0.55 0.38-1.1 0.58-1.65 0.49-1.35 1-2.69 1.43-4 0.25-0.76 0.48-1.53 0.72-2.29 0.38-1.2 0.76-2.39 1.11-3.59 0.24-0.82 0.46-1.65 0.68-2.48 0.31-1.14 0.62-2.28 0.91-3.42 0.21-0.86 0.41-1.72 0.61-2.58 0.26-1.11 0.51-2.23 0.74-3.35 0.07-0.32 0.15-0.63 0.21-1 0.14-0.7 0.25-1.41 0.39-2.11s0.29-1.53 0.42-2.29c0.19-1.11 0.35-2.22 0.52-3.33 0.11-0.72 0.22-1.44 0.31-2.16 0.16-1.23 0.29-2.46 0.43-3.69 0.06-0.6 0.14-1.2 0.2-1.8q0.26-2.75 0.42-5.5 0.1-1.89 0.16-3.77t0.06-4z" fill="#F7706C" p-id="10375"></path><path d="M833.55 634.03l-0.34 121.13-307.59-177.59 0.34-121.13 307.59 177.59z" fill="#E86262" p-id="10376"></path><path d="M723.81 807.89q4.38-1.55 8.71-3.17l2.72-1q5.5-2.09 10.92-4.29l2.19-0.91q4.4-1.81 8.75-3.7l3.15-1.38q4.46-2 8.85-4l1.81-0.84q5.19-2.45 10.28-5l2.62-1.34q3.93-2 7.79-4.08l2.86-1.54c3.32-1.81 6.61-3.64 9.85-5.53l0.34-121.13c-3.24 1.88-6.53 3.71-9.84 5.52l-2.89 1.5q-3.85 2.07-7.77 4.07l-2.64 1.35q-5.09 2.56-10.27 5l-1.83 0.84q-4.38 2-8.83 4l-3.15 1.38q-4.34 1.89-8.75 3.7l-2.19 0.91q-5.41 2.2-10.92 4.29l-2.73 1q-4.33 1.62-8.7 3.17l-3.27 1.15q-5.25 1.83-10.56 3.56l-0.84 0.28q-4.8 1.56-9.66 3l-2.12 0.63c-2.54 0.76-5.09 1.52-7.65 2.25l-3.56 1c-2.1 0.59-4.19 1.17-6.3 1.74l-4.07 1.06c-2 0.51-3.91 1-5.88 1.51l-4.32 1.11c-1.9 0.46-3.8 0.92-5.7 1.37l-4.49 1c-1.88 0.42-3.75 0.85-5.63 1.25l-4.61 1q-2.79 0.58-5.59 1.15l-4.69 0.91-5.59 1.05-4.08 0.73q-4.75 0.84-9.53 1.62l-3 0.49q-6.13 1-12.29 1.84l-2.62 0.35q-5 0.68-10 1.29l-3.73 0.45q-5.16 0.6-10.34 1.13l-2.35 0.25q-5.59 0.55-11.21 1l-1.87 0.14q-4.69 0.38-9.39 0.7l-3.87 0.24q-3.72 0.23-7.44 0.43l-4.37 0.21q-3.51 0.16-7 0.3l-4.66 0.16-5.92 0.16-4.86 0.1-6 0.07h-15.56c-2.06 0-4.13-0.07-6.19-0.11l-4.61-0.1c-1.9 0-3.8-0.12-5.7-0.18l-4.84-0.17c-1.93-0.08-3.86-0.18-5.79-0.27l-4.75-0.23c-1.95-0.11-3.9-0.23-5.84-0.35l-4.68-0.29c-2-0.14-4-0.3-6-0.45l-4.5-0.34c-2.09-0.17-4.17-0.37-6.25-0.56l-4.2-0.38c-2.37-0.23-4.73-0.49-7.09-0.74l-3.33-0.35q-5.2-0.58-10.38-1.24l-1.34-0.18q-4.5-0.58-9-1.21l-2.56-0.38c-2.65-0.39-5.31-0.77-7.95-1.19l-3.88-0.63c-2.2-0.36-4.4-0.71-6.59-1.09l-4.26-0.76c-2-0.37-4.09-0.73-6.12-1.12l-4.46-0.87c-2-0.38-3.92-0.77-5.87-1.17l-4.16-0.88q-3.38-0.72-6.75-1.46l-4.22-1q-3.32-0.76-6.62-1.56l-4.13-1q-3.45-0.86-6.89-1.75l-3.7-1q-4.25-1.13-8.46-2.32l-2-0.54q-6-1.72-11.95-3.56l-3.21-1q-4.79-1.51-9.52-3.08l-2.63-0.87q-5.81-2-11.54-4.05l-2.53-0.94q-4.65-1.72-9.24-3.51l-3.59-1.41-3.76-1.52q-2.42-1-4.81-2l-3.73-1.59q-2.38-1-4.74-2.07l-3.68-1.64q-2.36-1.07-4.7-2.16l-3.58-1.67c-1.59-0.75-3.16-1.52-4.73-2.29l-3.42-1.68c-1.63-0.81-3.25-1.64-4.87-2.48-1-0.54-2.1-1.07-3.15-1.62-1.77-0.93-3.52-1.88-5.28-2.82-0.87-0.47-1.75-0.93-2.61-1.4q-3.9-2.15-7.74-4.36l-0.34 121.13q3.83 2.21 7.74 4.36c0.87 0.48 1.75 0.94 2.62 1.41 1.75 0.94 3.49 1.89 5.26 2.81 1.05 0.55 2.11 1.09 3.17 1.63 1.61 0.83 3.22 1.65 4.85 2.47l3.42 1.68c1.57 0.77 3.14 1.53 4.73 2.29l3.58 1.67q2.34 1.09 4.7 2.16l3.68 1.64q2.36 1 4.74 2.07l3.73 1.59q2.39 1 4.8 2l3.78 1.53 1.75 0.71 1.81 0.69q4.6 1.8 9.26 3.52l2.53 0.94q5.73 2.08 11.55 4.06l2.61 0.87q4.75 1.59 9.55 3.09l3.19 1q5.94 1.83 12 3.56l0.2 0.06 1.77 0.49q4.21 1.19 8.46 2.32l3.7 1q3.43 0.89 6.89 1.75l4.13 1q3.29 0.79 6.61 1.55l4.24 1q3.36 0.75 6.75 1.46l2.7 0.58 1.47 0.29c2 0.4 3.91 0.78 5.87 1.17l4.46 0.87c2 0.38 4.06 0.75 6.1 1.11l4.3 0.77c2.19 0.38 4.39 0.73 6.59 1.09l3.86 0.63c2.69 0.42 5.38 0.82 8.08 1.21l2.27 0.34h0.16q4.77 0.67 9.56 1.28l0.78 0.1q5.19 0.66 10.4 1.24l3.07 0.32c2.45 0.26 4.9 0.53 7.35 0.77l4 0.37c2.13 0.2 4.27 0.4 6.41 0.57h0.4l4 0.3c2 0.16 4.07 0.32 6.1 0.46l4.6 0.29c2 0.12 3.95 0.25 5.93 0.36l4.71 0.23c1.94 0.09 3.88 0.19 5.82 0.27l4.81 0.17c1.91 0.06 3.82 0.13 5.74 0.18h1l3.54 0.06c2.08 0 4.16 0.08 6.24 0.11h15.57l6-0.07 4.83-0.1 6-0.16 2.29-0.06 2.34-0.1q3.52-0.13 7-0.3l4.37-0.21q3.72-0.2 7.42-0.43l3.9-0.24q4.69-0.32 9.37-0.7l1.89-0.14q5.61-0.47 11.21-1l0.57-0.05 1.79-0.2q5.18-0.53 10.34-1.13l3.74-0.45q5-0.61 10-1.29l2.62-0.35q6.17-0.86 12.3-1.84l3-0.49q4.79-0.78 9.55-1.62l2-0.34 2-0.39 5.61-1.06 4.68-0.91q2.81-0.56 5.61-1.15l4.58-1c1.9-0.41 3.79-0.84 5.68-1.26l4.45-1c1.92-0.45 3.82-0.91 5.73-1.37l4.32-1.05c2-0.49 3.93-1 5.89-1.52l4.06-1.06c2.12-0.57 4.22-1.16 6.32-1.75l3.53-1c2.58-0.74 5.14-1.5 7.69-2.27l2.07-0.61q4.86-1.48 9.67-3h0.15l0.67-0.23q5.32-1.73 10.58-3.57z" fill="#17AF7C" p-id="10377"></path><path d="M804.64 649.93c-168.77 98.07-443.32 98.07-613.19 0L497 472.34z" fill="#54D3A9" p-id="10378"></path></svg>',l="svg",i="动态",o="图表组件",c=!1,p=!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:c605398a724c","className":"m-b","columns":[{"body":[{"type":"input-number","label":"宽度","name":"width","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":"高度","name":"height","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:da449a94908a","className":"m-b","columns":[{"body":[{"type":"input-number","label":"X 轴","name":"x","keyboard":true,"id":"u:29852d093d9d","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:1b561d652acc","md":6},{"body":[{"type":"input-number","label":"Y 轴","name":"y","keyboard":true,"id":"u:dc8c1daed8ed","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:9672575193ac","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":0,"suffix":"","value":1,"inputClassName":"w-full","precision":2}],"id":"u:51ddf54ac749","md":6}],"gap":""},{"type":"grid","columns":[],"id":"u:235f153e5ad5","className":"m-b"},{"type":"grid","columns":[{"body":[{"type":"input-color","label":"图例颜色","name":"legendFontColor","id":"u:e8cb1c5f2784","format":"hex","mode":"horizontal","inputClassName":"w-full myColorPick"}],"id":"u:0eb487d20f40"}],"id":"u:d97854cb6bb7","className":"m-b"},{"type":"input-color","label":"标签颜色","name":"labelTextColor","id":"u:45de3deb2287","body":[{"type":"input-color","label":"标签字体颜色","name":"labelTextColor","id":"u:e56831dd4754","format":"hex","mode":"horizontal"}],"format":"hex","mode":"horizontal","inputClassName":"w-full"},{"type":"fieldset","title":"数据项颜色","collapsable":true,"body":[{"type":"combo","label":"","name":"itemColors","id":"u:ecbe4c39bbde","multiple":true,"addable":true,"removable":true,"removableMode":"icon","addBtn":{"label":"新增","icon":"fa fa-plus","level":"primary","size":"sm","id":"u:4eaf7bbd0de4"},"items":[{"type":"input-color","label":"","name":"color","id":"u:25d0f4cfde50","format":"rgba"}],"strictMode":true,"syncFields":[],"body":[{"type":"input-color","label":"颜色","name":"color","id":"u:d03cefb8aa55"},{"type":"input-color","label":"颜色","name":"color","id":"u:686fa9789255"},{"type":"input-color","label":"颜色","name":"color","id":"u:7f8d8a0cfc4a"}]}],"id":"u:fffdde5fd34d","bodyClassName":"m-b"},{"type":"fieldset","title":"提示框","collapsable":true,"body":[{"type":"input-color","label":"边框颜色","name":"tooltip.borderColor","keyboard":true,"id":"u:8078d2f4c631","step":1,"mode":"horizontal","inputClassName":"w-full","format":"rgba"},{"type":"input-color","label":"背景颜色","name":"tooltip.backgroundColor","keyboard":true,"id":"u:bbba51c172d3","step":1,"mode":"horizontal","inputClassName":"w-full","format":"rgba"},{"type":"input-color","label":"字体颜色","name":"tooltip.style.color","keyboard":true,"id":"u:b117c60c1199","step":1,"mode":"horizontal","inputClassName":"w-full","format":"rgba"},{"type":"input-number","label":"边框宽度","name":"tooltip.borderWidth","keyboard":true,"id":"u:f7e4e4c8f74f","step":1,"mode":"horizontal","inputClassName":"w-full"},{"type":"input-number","label":"边框圆角","name":"tooltip.borderRadius","keyboard":true,"id":"u:9aac2d800b91","step":1,"mode":"horizontal","inputClassName":"w-full"}],"id":"u:63a4dc69bb8e","bodyClassName":"m-b"},{"type":"fieldset","title":"代码配置","collapsable":true,"body":[{"type":"editor","label":"function (option, datas) {","name":"codeConfig","id":"u:689625dc5d7d","language":"javascript","value":"return option","labelClassName":"text-left","inputClassName":"text-left","className":"m-b-xs"},{"type":"tpl","tpl":"}","inline":true,"wrapperComponent":"","id":"u:f533d43d9ee4","className":"m-t-xs p-t-xs"}],"id":"u:cf0267c9669d","headingClassName":""}],"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":"1","active":true,"header":"常规","body":[{"type":"service","id":"u:6cb6d200ede2","data":{"dataPoint":"","compareType":"","conditionVariables":[],"defaultValue":"","unit":""},"body":[{"type":"input-text","label":"数据点","name":"dataPoint","id":"normalDataPoint","multiple":false,"mode":"horizontal","size":"full","onEvent":{"focus":{"weight":0,"actions":[{"actionType":"dialog","dialog":{"type":"dialog","title":"请配置需要绑定的数据点","body":[{"type":"tabs","tabs":[{"title":"常规数据点","body":[{"type":"form","title":"","body":[{"type":"select","label":"数据源","name":"dataSource","id":"u:c273f087b8ed","mode":"horizontal","multiple":false,"size":"md","horizontal":{"leftFixed":"sm"},"source":"\${apiDtoList || thingApiDTOList}","labelField":"name","valueField":"id","onEvent":{"change":{"actions":[{"actionType":"reload","componentId":"u:1cdb908c23a8"},{"actionType":"custom","script":"if (!event.data.value) { doAction({'actionType': 'setValue', 'componentId': 'u:1cdb908c23a8', 'args': {'value': ''} });\\r\\n doAction({'actionType': 'setValue', 'componentId': 'u:8147daea685d', 'args': {'value': ''} }); }"}]}},"clearable":true,"actionType":"change","target":"u:1cdb908c23a8"},{"type":"combo","label":"设备属性","name":"deviceAttrs","id":"u:98559a2dd514","multiple":false,"mode":"horizontal","size":"full","horizontal":{"leftFixed":"sm"},"items":[{"type":"input-table","label":false,"id":"u:41dfc35c368c","name":"table","strictMode":false,"needConfirm":false,"addable":true,"removable":true,"columns":[{"type":"input-text","label":"序号","id":"u:434e22030bc6","name":"num","size":"sm","mode":"horizontal","quickEdit":{"mode":"popOver","id":"u:c6a294f5c93a"},"horizontal":{"left":2,"right":10},"placeholder":"例：A/B/C/AA/BB","width":200},{"type":"select","name":"devices","id":"u:1cdb908c23a8","label":"设备","multiple":false,"mode":"horizontal","quickEdit":true,"size":"sm","source":{"url":"/thing/v2/api/telemetryById?id=\${dataSource}","method":"get","messages":{},"headers":{"token":"\${myToken}","tenantCode":"\${myTenantCode}","companyId":"\${myCompanyId}"},"adaptor":"if (payload && payload.data && payload.data.result) {console.log('payload.data.result', payload.data.result); \\r\\n const list = []\\r\\n const devices = payload.data.result.info \\r\\n for (const key in devices) {\\r\\n const device_info = devices[key] \\r\\n list.push({\\r\\n label: device_info.entityName,\\r\\n value: device_info.entityId,\\r\\n deviceCode: device_info.entityCode,\\r\\n deviceInfo: device_info,\\r\\n attrs: device_info.attrs })\\r\\n }\\r\\n payload.data = list;\\r\\n return payload\\r\\n}","sendOn":"this.dataSource"},"onEvent":{"change":{"actions":[{"actionType":"custom","script":"if (!event.data.value) { doAction({'actionType': 'setValue', 'componentId': 'u:8147daea685d', 'args': {'value': ''} }); }"}]}},"responseData":{"&":"$$","list":"\${items}"},"clearable":true,"horizontal":{"left":2,"right":10},"checkAll":false},{"type":"select","name":"dataPoint","id":"u:8147daea685d","label":"数据点","multiple":false,"quickEdit":true,"mode":"horizontal","size":"sm","source":{"url":"/thing/v2/api/callDict?id=\${dataSource}&entityId=\${devices}","method":"get","messages":{},"headers":{"token":"\${myToken}","tenantCode":"\${myTenantCode}","companyId":"\${myCompanyId}"},"sendOn":"this.dataSource && this.devices","adaptor":"const list = payload.data.map(item => {\\r\\n item.dictName = item.dictName + ' - ' + item.dictCode\\r\\n return item\\r\\n})\\r\\npayload.data = list;\\r\\nreturn payload"},"labelField":"dictName","valueField":"dictCode","checkAll":false,"horizontal":{"left":2,"right":10},"overlay":{"width":"350px"},"searchable":true}]}],"strictMode":true,"syncFields":[],"tabsMode":false,"canAccessSuperData":true,"inputClassName":"w-full","className":"m-b-sm"},{"type":"checkbox","label":"数据处理","name":"enableDataHandle","id":"u:034ca60f2135","mode":"horizontal","horizontal":{"leftFixed":"normal"},"option":""},{"type":"combo","id":"u:a06125153fa6","name":"calcRules","label":"计算规则","mode":"horizontal","visibleOn":"this.enableDataHandle","multiple":true,"items":[{"name":"formular","label":"计算公式","type":"input-text","id":"u:318a7f0c6449","placeholder":"例： (A + B) / C","width":"50%","size":"full"},{"name":"resultAttr","label":"计算结果属性","type":"input-text","id":"u:1e6e491ccbaa","placeholder":"例：A8、B、C...","width":"50%"}],"strictMode":true,"syncFields":[],"hidden":false,"inputClassName":"w-full","multiLine":false,"className":"calcRules"},{"type":"input-text","label":"唯一数据点","name":"uniquePoint","id":"u:3b257b599c19","mode":"horizontal","visibleOn":"this.enableDataHandle","labelRemark":{"icon":"fa fa-question-circle","trigger":["hover"],"className":"Remark--warning","placement":"top","title":"场景：","content":"当有数据处理，并且只需绑定一个数据点作为 【实时/立即/最新数据】时，请填写所需数据点的序号或计算结果属性。"},"inputControlClassName":"m-b"}],"id":"u:51f0e51abd7c","data":{"attrs":[],"deviceCode":"\${deviceCode || ''}","devices":"\${devices || ''}","dataPoint":"\${dataPoint || ''}","dataSource":"\${dataSource || ''}","deviceAttrs":"\${deviceAttrs || []}"},"submitText":"","onEvent":{"inited":{"actions":{"actionType":"custom","script":"if(event.data.devices && event.data.dataPoint && event.data.deviceAttrs.length === 0) { const dataPoints = event.data.dataPoint.split(','); const newDeviceAttrs = dataPoints.map((point, idx) => ({ num: String.fromCharCode(65+idx), devices: event.data.devices, dataPoint: point }) ); doAction({ 'actionType': 'setValue', 'componentId': 'u:51f0e51abd7c', 'args': { value: {deviceAttrs: { table: newDeviceAttrs } }} }); }"}}}}],"id":"u:5505e7ef7cab"},{"title":"虚拟变量","body":[{"type":"tpl","tpl":"暂时无虚拟变量可配置","wrapperComponent":"","inline":false,"id":"u:722592249b31"}],"id":"u:b739cc6a6ed7"}],"id":"u:3b446450d643"}],"showCloseButton":true,"showErrorMsg":true,"showLoading":true,"id":"u:f46c2439c983","data":{"&":"\${dataPoint | toJson}","apiDtoList":"\${thingApiDTOList}","myToken":"\${myToken}","myTenantCode":"\${myTenantCode}","myCompanyId":"\${myCompanyId}"},"onEvent":{"confirm":{"actions":[{"actionType":"custom","script":"const tableData = event.data.deviceAttrs.table; let devices = ''; let dataPoint = ''; if(tableData) { tableData.forEach(item => { devices += (item.devices + ',');dataPoint += (item.dataPoint + ','); });}; if(tableData && tableData.length > 0) { devices = devices.substring(0, devices.length - 1); dataPoint = dataPoint.substring(0, dataPoint.length - 1); const newValue = {...event.data, devices: devices, dataPoint: dataPoint, dataSource: event.data.dataSource} ; doAction({ 'componentId': 'normalDataPoint', 'actionType': 'setValue', 'args': { value: JSON.stringify(newValue) } }) } else {doAction({ 'componentId': 'normalDataPoint', 'actionType': 'setValue', 'args': { value: JSON.stringify(event.data) } }) };"}]}},"closeOnEsc":false,"size":"lg"}}]}},"className":"w-full m-b-sm","inputClassName":"w-full","clearable":true},{"type":"input-text","label":"默认值","clearable":true,"name":"defaultValue","id":"u:13ccbc565f5e","mode":"horizontal","size":"full","inputControlClassName":"mb-sm","labelClassName":"mb-sm","className":"m-b-sm"},{"type":"input-text","label":"单位   ","name":"unit","id":"u:0f606558e8c7","mode":"horizontal","size":"full","className":"m-b-sm"},{"type":"input-number","label":"渲染间隔","name":"renderInterval","keyboard":true,"id":"u:3f7cb08b0e2b","step":1,"mode":"horizontal","unitOptions":["ms"],"min":30000,"labelRemark":{"icon":"fa fa-question-circle","trigger":["hover"],"className":"Remark--warning","placement":"top","content":"最低渲染间隔为30秒","title":"提示："}},{"type":"switch","label":"开启渲染间隔","option":"","name":"renderIntervalEnabled","falseValue":false,"trueValue":true,"id":"u:457aaa1b64ed","value":true,"mode":"horizontal","labelRemark":{"icon":"fa fa-question-circle","trigger":["hover"],"className":"Remark--warning","placement":"top","title":"提示：","content":"关闭渲染间隔，将会渲染socket 推送的实时数据，意味着此时配置的数据源api如果不是 “最新” 值，将不会渲染。并且关闭渲染间隔后，需保存并刷新看板，才能看到效果。"}},{"type":"radios","label":"数据展示","name":"dataShowTypes","options":[{"label":"单个物单个属性","value":"oneThingOneAttr"},{"label":"单个物多个属性","value":"oneThingManyAttr"},{"label":"多个物多个属性","value":"manyThingManyAttr"},{"label":"多个物一个属性","value":"manyThingOneAttr"}],"id":"u:b8aeecd9e52f","mode":"horizontal","inputClassName":"w-full","itemClassName":"w-full","labelRemark":{"icon":"fa fa-question-circle","trigger":["hover"],"className":"Remark--warning","placement":"top","content":"请确保数据点的选择与数据展示方式一致"},"onEvent":{"change":{"actions":[{"componentId":"u:0fc48eacd2a4","actionType":"setValue","args":{"value":""}}]}}},{"type":"select","label":"图例名称展示","name":"legendNameType","options":[{"label":"物名称","value":"thingName","disabledOn":"this.dataShowTypes === 'oneThingManyAttr' || this.dataShowTypes === 'manyThingManyAttr' "},{"label":"物编码","value":"thingCode","disabledOn":"this.dataShowTypes === 'oneThingManyAttr' || this.dataShowTypes === 'manyThingManyAttr'"},{"label":"属性名称","value":"attrName","disabledOn":"this.dataShowTypes === 'manyThingManyAttr' || this.dataShowTypes === 'manyThingOneAttr'"},{"label":"属性编码","value":"attrCode","disabledOn":"this.dataShowTypes === 'manyThingManyAttr' || this.dataShowTypes === 'manyThingOneAttr'"},{"label":"物名称 + 属性名称","value":"thingNameAttrName"},{"label":"物编码 + 属性编码","value":"thingCodeAttrCode"}],"id":"u:0fc48eacd2a4","multiple":false,"mode":"horizontal","inputClassName":"w-full","value":"attrName"}],"name":"normalService","className":"p-none"},{"type":"service","body":[],"id":"u:0dd069ac163f"}],"id":"u:7b021709614e","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},{"url":"./plugins/highcharts/highcharts.js","isModule":false,"disabled":false},{"url":"./plugins/highcharts/highcharts-3d.js","isModule":false,"disabled":false},{"url":"./plugins/highcharts/exporting.js","isModule":false,"disabled":false}]',json:`{
|
|
"nodes": [
|
|
{
|
|
"id": "6f18dc4b-ebff-47b9-89e3-4ff1d967b64f",
|
|
"type": "custom-3d-piechart",
|
|
"x": 200,
|
|
"y": 200,
|
|
"text": {
|
|
"value": "",
|
|
"x": 200,
|
|
"y": 200
|
|
},
|
|
"properties": {
|
|
"id": "6f18dc4b-ebff-47b9-89e3-4ff1d967b64f",
|
|
"width": 350,
|
|
"height": 200,
|
|
"x": 200,
|
|
"y": 200,
|
|
"rotation": 0,
|
|
"opacity": 1,
|
|
"codeConfig": "return option;",
|
|
"nodeAlias": "3D立体饼图",
|
|
"showDefaultValue": false,
|
|
"showUnit": false,
|
|
"valueColor": "rgba(245, 166, 35, 1)",
|
|
"fontSize": 12,
|
|
"legendFontColor": "#50e3c2",
|
|
"color": "#50e3c2",
|
|
"labelTextColor": "#50e3c2",
|
|
"itemColors": [
|
|
{
|
|
"color": "#00B5EC"
|
|
},
|
|
{
|
|
"color": "#F39800"
|
|
},
|
|
{
|
|
"color": "#8FC31F"
|
|
},
|
|
{
|
|
"color": "#F29C9F"
|
|
},
|
|
{
|
|
"color": "#009944"
|
|
},
|
|
{
|
|
"color": "#8A8000"
|
|
}
|
|
],
|
|
"tooltip": {
|
|
"borderColor": "rgba(0, 141, 255, 0.6)",
|
|
"backgroundColor": "rgba(70,94,144,0.6)",
|
|
"style": {
|
|
"color": "rgba(255, 255, 255, 1)"
|
|
},
|
|
"borderWidth": 1,
|
|
"borderRadius": 6
|
|
},
|
|
"dynamic": {
|
|
"normalData": {
|
|
"dataPoint": "",
|
|
"compareType": "",
|
|
"conditionVariables": [],
|
|
"defaultValue": "",
|
|
"unit": "",
|
|
"renderIntervalEnabled": true,
|
|
"legendNameType": "attrName",
|
|
"dataShowTypes": "oneThingManyAttr"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}`,javascript:`const { createApp, createVNode, render } = Vue;
|
|
const app = createApp({})
|
|
|
|
const timeArr = new Array(24).fill('');
|
|
const totals = [];
|
|
// timeArr.forEach((i, index) => { const t = window.dayjs().hour(index).valueOf(); totals.push({ val: Math.random(1000) * 100, ts: t, attrKey: "A29" }) });
|
|
const defaultSocketValue = totals;
|
|
|
|
let myChart = null;
|
|
|
|
// 图例格式化
|
|
const assembleLegend = (api, thingKey, attrkey, dataShowTypes, legendNameType, datas) => {
|
|
if (api) {
|
|
const infos = window.totalDeviceInfos[api];
|
|
const thing = infos[datas[0].thingCode];
|
|
const thingName = thing.entityName;
|
|
const attrName = thing.attrs[attrkey].name;
|
|
if (dataShowTypes.value === 'oneThingOneAttr') {
|
|
switch (legendNameType.value) {
|
|
case "thingName":
|
|
return thing.entityName;
|
|
case "thingCode":
|
|
return thingKey;
|
|
case "attrName":
|
|
return attrName;
|
|
case "attrCode":
|
|
return attrkey;
|
|
case "thingNameAttrName":
|
|
return thingName + '-' + attrName;
|
|
case "thingCodeAttrCode":
|
|
return thingKey + '-' + attrkey;
|
|
}
|
|
} else if (dataShowTypes.value === 'oneThingManyAttr') {
|
|
switch (legendNameType.value) {
|
|
case "attrName":
|
|
return thing.attrs[attrkey].name;
|
|
case "attrCode":
|
|
return attrkey;
|
|
case "thingNameAttrName":
|
|
return thingName + '-' + attrName;
|
|
case "thingCodeAttrCode":
|
|
return thingKey + '-' + thingKey
|
|
}
|
|
} else if (dataShowTypes.value === 'manyThingManyAttr') {
|
|
switch (legendNameType.value) {
|
|
case "thingNameAttrName":
|
|
const attrName = thing.attrs[attrKey].name
|
|
return thingName + '-' + attrName;
|
|
case "thingCodeAttrCode":
|
|
return thingKey + '-' + thingKey;
|
|
}
|
|
} else if (dataShowTypes.value === 'manyThingOneAttr') {
|
|
switch (legendNameType.value) {
|
|
case "thingName":
|
|
return thingName;
|
|
case "thingCode":
|
|
return thingKey;
|
|
case "thingNameAttrName":
|
|
const attrName = thing.attrs[attrKey].name
|
|
return thingName + '-' + attrName;
|
|
case "thingCodeAttrCode":
|
|
return thingKey + '-' + thingKey;
|
|
}
|
|
}
|
|
} else {
|
|
return attrkey;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
const PieChart3D = {
|
|
template: '<div :id="lineId" :style="getStyle" class="highcharts-wrapper pie-3d-container"></div>',
|
|
props: {
|
|
lineId: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
historyDatas: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
width: {
|
|
type: Number,
|
|
default: 350
|
|
},
|
|
height: {
|
|
type: Number,
|
|
default: 150
|
|
},
|
|
codeConfig: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
legendFontColor: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
labelTextColor: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
dataShowTypes: {
|
|
type: String,
|
|
default: 'oneThingManyAttr',
|
|
},
|
|
legendNameType: {
|
|
type: String,
|
|
default: 'attrName',
|
|
},
|
|
apiid: {
|
|
type: String,
|
|
default: '',
|
|
},
|
|
itemColors: {
|
|
type: Array,
|
|
default: () =>
|
|
[
|
|
{
|
|
"color":
|
|
"#00B5EC"
|
|
},
|
|
{
|
|
"color":
|
|
"#F39800"
|
|
},
|
|
{
|
|
"color":
|
|
"#8FC31F"
|
|
},
|
|
{
|
|
"color":
|
|
"#F29C9F"
|
|
},
|
|
{
|
|
"color":
|
|
"#009944"
|
|
},
|
|
{
|
|
"color":
|
|
"#8A8000"
|
|
}
|
|
]
|
|
},
|
|
tooltip: {
|
|
type: Object,
|
|
default: () => ({
|
|
backgroundColor: "rgba(70,94,144,0.6)",
|
|
borderColor: "rgba(0, 141, 255, 0.6)",
|
|
borderRadius: 6,
|
|
borderWidth: 1,
|
|
style: {
|
|
color: "#fff"
|
|
}
|
|
})
|
|
}
|
|
},
|
|
computed: {
|
|
getStyle() {
|
|
return {
|
|
width: \`\${this.width}px\`,
|
|
height: \`\${this.height}px\`
|
|
}
|
|
}
|
|
},
|
|
setup(props) {
|
|
const { onMounted, nextTick, toRefs, watch } = Vue;
|
|
const { historyDatas, codeConfig, apiid, dataShowTypes, legendNameType, tooltip, itemColors } = toRefs(props);
|
|
|
|
const initChart = (datas) => {
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
|
const dom = document.getElementById(props.lineId);
|
|
if (dom) {
|
|
if (myChart) {
|
|
myChart.destroy();
|
|
myChart = null;
|
|
}
|
|
if (datas) {
|
|
let totalDatas = [];
|
|
let totalAmount = 0
|
|
if (datas.length > 0) {
|
|
const thingGrouped = window._.groupBy(datas, 'thingCode');
|
|
for (const thingKey in thingGrouped) {
|
|
const attrGrouped = window._.groupBy(thingGrouped[thingKey], 'attrKey')
|
|
for (const key in attrGrouped) {
|
|
let serieData = attrGrouped[key];
|
|
const legendKey = assembleLegend(apiid.value, thingKey, key, dataShowTypes, legendNameType, serieData);
|
|
totalDatas.push([legendKey, serieData[0].val]);
|
|
totalAmount += serieData[0].val;
|
|
}
|
|
}
|
|
totalDatas = totalDatas.map(i => {
|
|
i[1] = Number((i[1] / totalAmount * 100).toFixed(2));
|
|
return i;
|
|
})
|
|
} else {
|
|
totalDatas = [
|
|
['Firefox', 45.0],
|
|
['IE', 26.8],
|
|
{
|
|
name: 'Chrome',
|
|
y: 12.8,
|
|
sliced: true,
|
|
selected: true
|
|
},
|
|
['Safari', 8.5],
|
|
['Opera', 6.2],
|
|
['Others', 0.7]
|
|
]
|
|
}
|
|
|
|
|
|
// 指定图表的配置项和数据
|
|
var option = {
|
|
chart: {
|
|
accessibility: {
|
|
enabled: false
|
|
},
|
|
reflow: true,
|
|
type: "pie",
|
|
borderWidth: null,
|
|
plotBorderWidth: null,
|
|
options3d: {
|
|
enabled: true,
|
|
alpha: 50,
|
|
beta: 0
|
|
},
|
|
events: {
|
|
// load: function () {
|
|
// const each = Highcharts.each;
|
|
// const points = this.series[0].points;
|
|
// each(points, function (p, i) {
|
|
// p.graphic.attr({
|
|
// translateY: -p.shapeArgs.ran
|
|
// });
|
|
// p.graphic.side1.attr({
|
|
// translateY: -p.shapeArgs.ran
|
|
// });
|
|
// p.graphic.side2.attr({
|
|
// translateY: -p.shapeArgs.ran
|
|
// });
|
|
// });
|
|
// }
|
|
},
|
|
backgroundColor: null,
|
|
marginRight: 130,
|
|
marginBottom: 0,
|
|
spacingBottom: 0
|
|
},
|
|
title: {
|
|
text: ""
|
|
},
|
|
exporting: {
|
|
enabled: false
|
|
},
|
|
credits: {
|
|
enabled: false
|
|
},
|
|
tooltip: {
|
|
pointFormat: "{series.name}: <b>{point.percentage:.1f}%</b>",
|
|
...tooltip.value
|
|
},
|
|
plotOptions: {
|
|
pie: {
|
|
allowPointSelect: true,
|
|
cursor: "pointer",
|
|
depth: 25,
|
|
dataLabels: {
|
|
enabled: true,
|
|
formatter: function () {
|
|
return \`<span style='color: \${props.labelTextColor}'>\${this.point.name}</span>\`;
|
|
},
|
|
connectorColor: "#02AAD0",
|
|
style: {
|
|
textOverflow: "ellipsis",
|
|
textOutline: "none"
|
|
}
|
|
},
|
|
showInLegend: true,
|
|
states: {
|
|
hover: {
|
|
halo: {
|
|
size: 10,
|
|
opacity: 0.5,
|
|
attributes: {
|
|
// fill: "white"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
series: [
|
|
{
|
|
type: "pie",
|
|
name: "当月用能占比",
|
|
size: "50%",
|
|
data: totalDatas
|
|
}
|
|
],
|
|
legend: {
|
|
layout: "vertical",
|
|
floating: true,
|
|
backgroundColor: "none",
|
|
align: "right",
|
|
verticalAlign: "top",
|
|
x: 10,
|
|
y: 45,
|
|
itemStyle: { cursor: "pointer", color: props.legendFontColor, textOverflow: "ellipsis", textOutline: "none" },
|
|
itemWidth: 70,
|
|
itemHoverStyle: { color: "#34dcfc" },
|
|
symbolWidth: 12,
|
|
symbolHeight: 8,
|
|
symbolRadius: 0,
|
|
itemMarginBottom: 5,
|
|
},
|
|
colors: itemColors.value.map( i => i.color)
|
|
};
|
|
|
|
const func = new Function('option', 'datas', codeConfig.value);
|
|
const opt = func(window._.cloneDeep(option), datas);
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
nextTick(() => {
|
|
myChart = Highcharts.chart(props.lineId, opt);
|
|
})
|
|
}
|
|
}
|
|
}
|
|
|
|
watch(historyDatas, (val) => {
|
|
if (val) {
|
|
nextTick(() => {
|
|
initChart(val);
|
|
})
|
|
}
|
|
}, {
|
|
immediate: true
|
|
})
|
|
}
|
|
}
|
|
|
|
class Custom3DPieChartNode extends HtmlResize.view {
|
|
chartRendered = false
|
|
historyDatas = []
|
|
oldProperties = {}
|
|
|
|
setHtml(rootEl) {
|
|
if (!rootEl) return;
|
|
const { properties, width, height, } = this.props.model;
|
|
const { nodeAlias, grid, title, legend, tooltip, xAxis, yAxis, codeConfig, legendFontColor, labelTextColor, apiid, itemColors } = properties;
|
|
const { dataShowTypes, legendNameType, } = properties.normalData || {};
|
|
|
|
const el = document.createElement('div');
|
|
rootEl.innerHTML = '';
|
|
const instance = createVNode(PieChart3D, {
|
|
name: nodeAlias,
|
|
lineId: \`line-\${properties.id}\`,
|
|
historyDatas: this.historyDatas,
|
|
width,
|
|
height,
|
|
grid, title, legend, tooltip, xAxis, yAxis,
|
|
codeConfig,
|
|
legendFontColor, labelTextColor,
|
|
dataShowTypes, legendNameType, apiid, itemColors
|
|
})
|
|
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
|
|
}
|
|
|
|
filterHistoryData(thingCodeArr, dataPointArr, apiid, renderIntervalEnabled) {
|
|
if (dataPointArr && dataPointArr.length > 0) {
|
|
let datas = []
|
|
if (renderIntervalEnabled) {
|
|
datas = window.totalHistoryDatas[apiid];
|
|
} else {
|
|
if (window.globalDashboardDatas[apiid]) {
|
|
datas = window.globalDashboardDatas[apiid].values;
|
|
}
|
|
}
|
|
if (datas && datas.length > 0) {
|
|
const gotValues = datas.filter((val) => thingCodeArr.includes(val.thingCode) && dataPointArr.includes(val.attrKey))
|
|
this.historyDatas = gotValues
|
|
this.chartRendered = true;
|
|
}
|
|
}
|
|
}
|
|
|
|
// 生命周期 支持重写内容, 但格式需一致
|
|
shouldUpdate() {
|
|
const { properties } = this.props.model;
|
|
const { apiid } = properties;
|
|
const { normalData } = properties.dynamic || {};
|
|
const { dataPointArr, defaultValue, thingCodeArr } = normalData || {}
|
|
|
|
if (normalData && !normalData.dataPoint && !normalData.defaultValue) {
|
|
this.historyDatas = defaultSocketValue;
|
|
return true
|
|
} else if (normalData && !normalData.dataPoint && normalData.defaultValue) {
|
|
this.historyDatas = JSON.parse(defaultValue);
|
|
return true
|
|
}
|
|
|
|
const propertiesBack = window._.cloneDeep(properties);
|
|
if (propertiesBack.dynamic.normalData) {
|
|
propertiesBack.dynamic.normalData.defaultValue = '';
|
|
if (this.sameProps(propertiesBack) && this.chartRendered) {
|
|
return false
|
|
}
|
|
if (dataPointArr && apiid && !this.chartRendered) {
|
|
this.filterHistoryData(thingCodeArr, dataPointArr, apiid, normalData.renderIntervalEnabled);
|
|
return true;
|
|
}
|
|
}
|
|
return true;
|
|
}
|
|
|
|
updateHtml() {
|
|
this.setHtml(this.rootEl);
|
|
}
|
|
|
|
componentDidMount() {
|
|
const { properties } = this.props.model;
|
|
const { normalData } = properties.dynamic || {};
|
|
const { renderInterval, dataPointArr, thingCodeArr } = normalData || {};
|
|
if (this.shouldUpdate()) {
|
|
this.setHtml(this.rootEl);
|
|
}
|
|
|
|
let inters = parseInt(renderInterval || '300000')
|
|
if (normalData && !normalData.renderIntervalEnabled) {
|
|
inters = 1000
|
|
}
|
|
setInterval(() => {
|
|
if (window.totalHistoryDatas[properties.apiid]) {
|
|
this.filterHistoryData(thingCodeArr, dataPointArr, properties.apiid, normalData.renderIntervalEnabled);
|
|
this.setHtml(this.rootEl);
|
|
}
|
|
}, inters)
|
|
// 防止拖动时候频繁渲染图表
|
|
this.updateHtmlDebounced = window._.debounce(this.updateHtml.bind(this), 500);
|
|
}
|
|
|
|
componentDidUpdate() {
|
|
if (this.shouldUpdate()) {
|
|
this.updateHtmlDebounced();
|
|
}
|
|
}
|
|
}
|
|
|
|
class Custom3DPieChartModel 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-3d-piechart',
|
|
view: Custom3DPieChartNode,
|
|
model: Custom3DPieChartModel,
|
|
})`,css:`.highcharts-wrapper .highcharts-root {\r
|
|
stroke: none;\r
|
|
}`,fakeData:""},u={id:e,name:t,aliasName:n,image:a,imageType:l,groupName:i,groupType:o,isRemote:!1,isDefault:!0,sectionType:s,config:r,files:d};export{n as aliasName,r as config,u as default,d as files,i as groupName,o as groupType,e as id,a as image,l as imageType,p as isDefault,c as isRemote,t as name,s as sectionType};
|