tsai
/
thingsboard
mirror of https://github.com/thingsboard/thingsboard.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

UI: Dashboard layout settings improvements. Add test scada widgets bundle.

pull/11391/head
Igor Kulikov 2 years ago
parent
c1c2ceeff6
commit
ddbd3903d2
33 changed files with 878 additions and 51 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 18
      application/src/main/data/json/system/scada_symbols/horizontal-connector-long.svg
  2. 16
      application/src/main/data/json/system/scada_symbols/horizontal-connector.svg
  3. 85
      application/src/main/data/json/system/scada_symbols/horizontal-faucet.svg
  4. 20
      application/src/main/data/json/system/scada_symbols/horizontal-tank-with-screen.svg
  5. 26
      application/src/main/data/json/system/scada_symbols/left-bottom-angle-connector.svg
  6. 26
      application/src/main/data/json/system/scada_symbols/left-top-angle-connector.svg
  7. 127
      application/src/main/data/json/system/scada_symbols/pump-left.svg
  8. 127
      application/src/main/data/json/system/scada_symbols/pump.svg
  9. 26
      application/src/main/data/json/system/scada_symbols/quadro-connector.svg
  10. 26
      application/src/main/data/json/system/scada_symbols/right-bottom-angle-connector.svg
  11. 26
      application/src/main/data/json/system/scada_symbols/right-top-angle-connector.svg
  12. 31
      application/src/main/data/json/system/scada_symbols/top-black-counter.svg
  13. 31
      application/src/main/data/json/system/scada_symbols/top-white-counter.svg
  14. 16
      application/src/main/data/json/system/scada_symbols/vertical-connector-long.svg
  15. 16
      application/src/main/data/json/system/scada_symbols/vertical-connector.svg
  16. 24
      application/src/main/data/json/system/scada_symbols/vertical-tank-with-level.svg
  17. 102
      application/src/main/data/json/system/scada_symbols/water-blower-right-connector.svg
  18. 4
      application/src/main/data/json/system/widget_bundles/scada_symbols.json
  19. 30
      application/src/main/data/json/system/widget_bundles/scada_water_system_symbols.json
  20. 2
      application/src/main/java/org/thingsboard/server/install/ThingsboardInstallService.java
  21. 5
      application/src/main/java/org/thingsboard/server/service/install/DefaultSystemDataLoaderService.java
  22. 20
      application/src/main/java/org/thingsboard/server/service/install/InstallScripts.java
  23. 2
      application/src/main/java/org/thingsboard/server/service/install/SystemDataLoaderService.java
  24. 9
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts
  25. 1
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.models.ts
  26. 29
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html
  27. 26
      ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.ts
  28. 21
      ui-ngx/src/app/modules/home/components/dashboard-page/layout/dashboard-layout.component.ts
  29. 1
      ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.html
  30. 9
      ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.ts
  31. 1
      ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
  32. 22
      ui-ngx/src/app/shared/models/dashboard.models.ts
  33. 4
      ui-ngx/src/assets/locale/locale.constant-en_US.json

18
application/src/main/data/json/system/scada_symbols/horizontal-connector-long.svg
View File

@ -0,0 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="112" height="56" viewBox="0 0 112 56" fill="none"><tb:metadata xmlns=""><![CDATA[{
"title": "Horizontal connector long",
"widgetSizeX": 2,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata>
<path d="M108 38L4 38V18L108 18V38Z" fill="url(#paint0_linear_909_16496)"/><path d="M107.5 37.5L4.5 37.5V18.5L107.5 18.5V37.5Z" stroke="black" stroke-opacity="0.12"/><rect x="111.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 111.5 41.5)" fill="#D9D9D9" stroke="#727171"/><rect x="3.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 3.5 41.5)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_909_16496" x1="24.5432" y1="38" x2="24.5432" y2="18" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1004 B

16
application/src/main/data/json/system/scada_symbols/horizontal-connector.svg
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Horizontal connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M52 38L4 38V18L52 18V38Z" fill="url(#paint0_linear_898_122992)"/><path d="M51.5 37.5L4.5 37.5V18.5L51.5 18.5V37.5Z" stroke="black" stroke-opacity="0.12"/><rect x="55.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 55.5 41.5)" fill="#D9D9D9" stroke="#727171"/><rect x="3.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 3.5 41.5)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_898_122992" x1="13.4815" y1="38" x2="13.4815" y2="18" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 991 B

85
application/src/main/data/json/system/scada_symbols/horizontal-faucet.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 9.6 KiB

20
application/src/main/data/json/system/scada_symbols/horizontal-tank-with-screen.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

26
application/src/main/data/json/system/scada_symbols/left-bottom-angle-connector.svg
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Left bottom angle connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><rect x="4" y="18" width="14" height="20" fill="url(#paint0_linear_898_122896)"/><rect x="4.5" y="18.5" width="13" height="19" stroke="black" stroke-opacity="0.12"/><path d="M18 52V38H38V52H18Z" fill="url(#paint1_linear_898_122896)"/><path d="M18.5 51.5V38.5H37.5V51.5H18.5Z" stroke="black" stroke-opacity="0.12"/><rect x="0.5" y="14.5" width="3" height="27" rx="1.5" fill="#D9D9D9" stroke="#727171"/><rect x="14.5" y="55.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 55.5)" fill="#D9D9D9" stroke="#727171"/><path d="M18 18C18 18 26.4772 18.4772 32 24C37.5228 29.5228 38 38 38 38H18V18Z" fill="url(#paint2_linear_898_122896)"/><path d="M18.5 37.5V18.5469C18.7196 18.5708 19.0022 18.6056 19.3373 18.6554C20.2009 18.7839 21.411 19.0118 22.7905 19.4094C25.5562 20.2064 28.9673 21.6744 31.6464 24.3536C34.3256 27.0327 35.7936 30.4438 36.5906 33.2095C36.9881 34.589 37.2161 35.7991 37.3446 36.6627C37.3944 36.9978 37.4292 37.2804 37.4531 37.5H18.5Z" stroke="black" stroke-opacity="0.12"/><defs>
<linearGradient id="paint0_linear_898_122896" x1="11.7778" y1="18" x2="11.7778" y2="38" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122896" x1="18" y1="40.7654" x2="38" y2="40.7654" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122896" x1="18" y1="37" x2="32.5" y2="25.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.367326" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

26
application/src/main/data/json/system/scada_symbols/left-top-angle-connector.svg
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Left top angle connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><rect x="38" y="4" width="14" height="20" transform="rotate(90 38 4)" fill="url(#paint0_linear_898_122935)"/><rect x="37.5" y="4.5" width="13" height="19" transform="rotate(90 37.5 4.5)" stroke="black" stroke-opacity="0.12"/><path d="M4 18H18V38H4V18Z" fill="url(#paint1_linear_898_122935)"/><path d="M4.5 18.5H17.5V37.5H4.5V18.5Z" stroke="black" stroke-opacity="0.12"/><rect x="41.5" y="0.5" width="3" height="27" rx="1.5" transform="rotate(90 41.5 0.5)" fill="#D9D9D9" stroke="#727171"/><rect x="0.5" y="14.5" width="3" height="27" rx="1.5" fill="#D9D9D9" stroke="#727171"/><path d="M38 18C38 18 37.5228 26.4772 32 32C26.4772 37.5228 18 38 18 38V18H38Z" fill="url(#paint2_linear_898_122935)"/><path d="M18.5 18.5H37.4531C37.4292 18.7196 37.3944 19.0022 37.3446 19.3373C37.2161 20.2009 36.9882 21.411 36.5906 22.7905C35.7936 25.5562 34.3256 28.9673 31.6464 31.6464C28.9673 34.3256 25.5562 35.7936 22.7905 36.5906C21.411 36.9881 20.2009 37.2161 19.3373 37.3446C19.0022 37.3944 18.7196 37.4292 18.5 37.4531V18.5Z" stroke="black" stroke-opacity="0.12"/><defs>
<linearGradient id="paint0_linear_898_122935" x1="45.7778" y1="4" x2="45.7778" y2="24" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122935" x1="15.2346" y1="18" x2="15.2346" y2="38" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122935" x1="19" y1="18" x2="30.5" y2="32.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.367326" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

127
application/src/main/data/json/system/scada_symbols/pump-left.svg
View File

@ -0,0 +1,127 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="224" height="168" viewBox="0 0 224 168" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Pump left",
"widgetSizeX": 4,
"widgetSizeY": 3,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M32 28H16V140H32V28Z" fill="url(#paint0_linear_898_122801)"/><path d="M31.5 28.5H16.5V139.5H31.5V28.5Z" stroke="black" stroke-opacity="0.12"/><path d="M49 28H44C41.7909 28 40 29.7909 40 32V136C40 138.209 41.7909 140 44 140H49V28Z" fill="url(#paint1_linear_898_122801)"/><path d="M48.5 28.5H44C42.067 28.5 40.5 30.067 40.5 32V136C40.5 137.933 42.067 139.5 44 139.5H48.5V28.5Z" stroke="black" stroke-opacity="0.12"/><path d="M36 56C36 55.4477 35.5523 55 35 55H32V113H35C35.5523 113 36 112.552 36 112V56Z" fill="url(#paint2_linear_898_122801)"/><path d="M35.5 56C35.5 55.7239 35.2761 55.5 35 55.5H32.5V112.5H35C35.2761 112.5 35.5 112.276 35.5 112V56Z" stroke="black" stroke-opacity="0.12"/><path d="M40 41H37C36.4477 41 36 41.4477 36 42V128C36 128.552 36.4477 129 37 129H40V41Z" fill="url(#paint3_linear_898_122801)"/><path d="M39.5 41.5H37C36.7239 41.5 36.5 41.7239 36.5 42V128C36.5 128.276 36.7239 128.5 37 128.5H39.5V41.5Z" stroke="black" stroke-opacity="0.12"/><path d="M32 28L42 18H13L16 28H32Z" fill="url(#paint4_linear_898_122801)"/><path d="M16.372 27.5H31.7929L40.7929 18.5H13.672L16.372 27.5Z" stroke="black" stroke-opacity="0.12"/><rect width="14" height="55" rx="1" transform="matrix(0 -1 -1 0 55 18)" fill="url(#paint5_linear_898_122801)"/><rect x="-0.5" y="-0.5" width="13" height="54" rx="0.5" transform="matrix(0 -1 -1 0 54 17)" stroke="black" stroke-opacity="0.12"/><rect width="17" height="194" rx="1" transform="matrix(0 -1 -1 0 202 168)" fill="url(#paint6_linear_898_122801)"/><rect x="-0.5" y="-0.5" width="16" height="193" rx="0.5" transform="matrix(0 -1 -1 0 201 167)" stroke="black" stroke-opacity="0.12"/><path d="M186 151L178 140H60L52 151H186Z" fill="url(#paint7_linear_898_122801)"/><path d="M60.2546 140.5L52.9819 150.5H185.018L177.745 140.5H60.2546Z" stroke="black" stroke-opacity="0.12"/><path d="M36 151L32 140H16L12 151H36Z" fill="url(#paint8_linear_898_122801)"/><path d="M16.3502 140.5L12.7139 150.5H35.2861L31.6498 140.5H16.3502Z" stroke="black" stroke-opacity="0.12"/><path d="M16 60C16 59.4477 15.5523 59 15 59H12C7.58172 59 4 62.5817 4 67V99C4 103.418 7.58172 107 12 107H15C15.5523 107 16 106.552 16 106V60Z" fill="url(#paint9_linear_898_122801)"/><path d="M15.5 60C15.5 59.7239 15.2761 59.5 15 59.5H12C7.85786 59.5 4.5 62.8579 4.5 67V99C4.5 103.142 7.85786 106.5 12 106.5H15C15.2761 106.5 15.5 106.276 15.5 106V60Z" stroke="black" stroke-opacity="0.12"/><path d="M202 28H49C46.7909 28 45 29.7909 45 32V136C45 138.209 46.7909 140 49 140H202V28Z" fill="url(#paint10_linear_898_122801)"/><path d="M202 28H49C46.7909 28 45 29.7909 45 32V36H202V28Z" fill="url(#paint11_linear_898_122801)"/><path d="M202 36H45V44H202V36Z" fill="url(#paint12_linear_898_122801)"/><path d="M202 44H45V52H202V44Z" fill="url(#paint13_linear_898_122801)"/><path d="M202 52H45V60H202V52Z" fill="url(#paint14_linear_898_122801)"/><path d="M202 60H45V68H202V60Z" fill="url(#paint15_linear_898_122801)"/><path d="M202 68H45V76H202V68Z" fill="url(#paint16_linear_898_122801)"/><path d="M202 76H45V84H202V76Z" fill="url(#paint17_linear_898_122801)"/><path d="M202 84H45V92H202V84Z" fill="url(#paint18_linear_898_122801)"/><path d="M202 92H45V100H202V92Z" fill="url(#paint19_linear_898_122801)"/><path d="M202 100H45V108H202V100Z" fill="url(#paint20_linear_898_122801)"/><path d="M202 108H45V116H202V108Z" fill="url(#paint21_linear_898_122801)"/><path d="M202 116H45V124H202V116Z" fill="url(#paint22_linear_898_122801)"/><path d="M202 124H45V132H202V124Z" fill="url(#paint23_linear_898_122801)"/><path d="M202 132H45V136C45 138.209 46.7909 140 49 140H202V132Z" fill="url(#paint24_linear_898_122801)"/><rect x="0.5" y="70.5" width="3" height="27" rx="1.5" fill="#D9D9D9" stroke="#727171"/><path d="M224 40C224 33.3726 218.627 28 212 28H202V140H212C218.627 140 224 134.627 224 128V40Z" fill="url(#paint25_linear_898_122801)"/><path d="M223.5 40C223.5 33.6487 218.351 28.5 212 28.5H202.5V139.5H212C218.351 139.5 223.5 134.351 223.5 128V40Z" stroke="black" stroke-opacity="0.12"/><rect x="-0.5" y="-0.5" width="3" height="27" rx="1.5" transform="matrix(0 -1 -1 0 41 3)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_898_122801" x1="24" y1="28" x2="24" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122801" x1="44.5" y1="28" x2="44.5" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122801" x1="34" y1="55" x2="34" y2="113" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint3_linear_898_122801" x1="38" y1="41" x2="38" y2="129" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint4_linear_898_122801" x1="33.1739" y1="23" x2="20.5652" y2="23" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint5_linear_898_122801" x1="7" y1="0" x2="7" y2="55" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint6_linear_898_122801" x1="8.5" y1="0" x2="8.5" y2="194" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint7_linear_898_122801" x1="60" y1="145.238" x2="178" y2="145.238" gradientUnits="userSpaceOnUse">
<stop stop-color="#77B6FF"/>
<stop offset="0.500964" stop-color="#0054B7"/>
<stop offset="1" stop-color="#77B6FF"/>
</linearGradient>
<linearGradient id="paint8_linear_898_122801" x1="16.0746" y1="145.238" x2="31.9254" y2="145.238" gradientUnits="userSpaceOnUse">
<stop stop-color="#77B6FF"/>
<stop offset="0.500964" stop-color="#0054B7"/>
<stop offset="1" stop-color="#77B6FF"/>
</linearGradient>
<linearGradient id="paint9_linear_898_122801" x1="10" y1="59" x2="10" y2="107" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint10_linear_898_122801" x1="123.5" y1="28" x2="123.5" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.506056" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint11_linear_898_122801" x1="121.865" y1="36" x2="121.865" y2="28" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint12_linear_898_122801" x1="121.865" y1="44" x2="121.865" y2="36" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint13_linear_898_122801" x1="121.865" y1="52" x2="121.865" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint14_linear_898_122801" x1="121.865" y1="60" x2="121.865" y2="52" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint15_linear_898_122801" x1="121.865" y1="68" x2="121.865" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint16_linear_898_122801" x1="121.865" y1="76" x2="121.865" y2="68" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint17_linear_898_122801" x1="121.865" y1="84" x2="121.865" y2="76" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint18_linear_898_122801" x1="121.865" y1="92" x2="121.865" y2="84" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint19_linear_898_122801" x1="121.865" y1="100" x2="121.865" y2="92" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint20_linear_898_122801" x1="121.865" y1="108" x2="121.865" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint21_linear_898_122801" x1="121.865" y1="116" x2="121.865" y2="108" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint22_linear_898_122801" x1="121.865" y1="124" x2="121.865" y2="116" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint23_linear_898_122801" x1="121.865" y1="132" x2="121.865" y2="124" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint24_linear_898_122801" x1="121.865" y1="140" x2="121.865" y2="132" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint25_linear_898_122801" x1="213" y1="28" x2="213" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

127
application/src/main/data/json/system/scada_symbols/pump.svg
View File

@ -0,0 +1,127 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="224" height="168" viewBox="0 0 224 168" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Pump",
"widgetSizeX": 4,
"widgetSizeY": 3,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M192 28H208V140H192V28Z" fill="url(#paint0_linear_898_122767)"/><path d="M192.5 28.5H207.5V139.5H192.5V28.5Z" stroke="black" stroke-opacity="0.12"/><path d="M175 28H180C182.209 28 184 29.7909 184 32V136C184 138.209 182.209 140 180 140H175V28Z" fill="url(#paint1_linear_898_122767)"/><path d="M175.5 28.5H180C181.933 28.5 183.5 30.067 183.5 32V136C183.5 137.933 181.933 139.5 180 139.5H175.5V28.5Z" stroke="black" stroke-opacity="0.12"/><path d="M188 56C188 55.4477 188.448 55 189 55H192V113H189C188.448 113 188 112.552 188 112V56Z" fill="url(#paint2_linear_898_122767)"/><path d="M188.5 56C188.5 55.7239 188.724 55.5 189 55.5H191.5V112.5H189C188.724 112.5 188.5 112.276 188.5 112V56Z" stroke="black" stroke-opacity="0.12"/><path d="M184 41H187C187.552 41 188 41.4477 188 42V128C188 128.552 187.552 129 187 129H184V41Z" fill="url(#paint3_linear_898_122767)"/><path d="M184.5 41.5H187C187.276 41.5 187.5 41.7239 187.5 42V128C187.5 128.276 187.276 128.5 187 128.5H184.5V41.5Z" stroke="black" stroke-opacity="0.12"/><path d="M192 28L182 18H211L208 28H192Z" fill="url(#paint4_linear_898_122767)"/><path d="M207.628 27.5H192.207L183.207 18.5H210.328L207.628 27.5Z" stroke="black" stroke-opacity="0.12"/><rect x="169" y="18" width="14" height="55" rx="1" transform="rotate(-90 169 18)" fill="url(#paint5_linear_898_122767)"/><rect x="169.5" y="17.5" width="13" height="54" rx="0.5" transform="rotate(-90 169.5 17.5)" stroke="black" stroke-opacity="0.12"/><rect x="22" y="168" width="17" height="194" rx="1" transform="rotate(-90 22 168)" fill="url(#paint6_linear_898_122767)"/><rect x="22.5" y="167.5" width="16" height="193" rx="0.5" transform="rotate(-90 22.5 167.5)" stroke="black" stroke-opacity="0.12"/><path d="M38 151L46 140H164L172 151H38Z" fill="url(#paint7_linear_898_122767)"/><path d="M163.745 140.5L171.018 150.5H38.9819L46.2546 140.5H163.745Z" stroke="black" stroke-opacity="0.12"/><path d="M188 151L192 140H208L212 151H188Z" fill="url(#paint8_linear_898_122767)"/><path d="M207.65 140.5L211.286 150.5H188.714L192.35 140.5H207.65Z" stroke="black" stroke-opacity="0.12"/><path d="M208 60C208 59.4477 208.448 59 209 59H212C216.418 59 220 62.5817 220 67V99C220 103.418 216.418 107 212 107H209C208.448 107 208 106.552 208 106V60Z" fill="url(#paint9_linear_898_122767)"/><path d="M208.5 60C208.5 59.7239 208.724 59.5 209 59.5H212C216.142 59.5 219.5 62.8579 219.5 67V99C219.5 103.142 216.142 106.5 212 106.5H209C208.724 106.5 208.5 106.276 208.5 106V60Z" stroke="black" stroke-opacity="0.12"/><path d="M22 28H175C177.209 28 179 29.7909 179 32V136C179 138.209 177.209 140 175 140H22V28Z" fill="url(#paint10_linear_898_122767)"/><path d="M22 28H175C177.209 28 179 29.7909 179 32V36H22V28Z" fill="url(#paint11_linear_898_122767)"/><path d="M22 36H179V44H22V36Z" fill="url(#paint12_linear_898_122767)"/><path d="M22 44H179V52H22V44Z" fill="url(#paint13_linear_898_122767)"/><path d="M22 52H179V60H22V52Z" fill="url(#paint14_linear_898_122767)"/><path d="M22 60H179V68H22V60Z" fill="url(#paint15_linear_898_122767)"/><path d="M22 68H179V76H22V68Z" fill="url(#paint16_linear_898_122767)"/><path d="M22 76H179V84H22V76Z" fill="url(#paint17_linear_898_122767)"/><path d="M22 84H179V92H22V84Z" fill="url(#paint18_linear_898_122767)"/><path d="M22 92H179V100H22V92Z" fill="url(#paint19_linear_898_122767)"/><path d="M22 100H179V108H22V100Z" fill="url(#paint20_linear_898_122767)"/><path d="M22 108H179V116H22V108Z" fill="url(#paint21_linear_898_122767)"/><path d="M22 116H179V124H22V116Z" fill="url(#paint22_linear_898_122767)"/><path d="M22 124H179V132H22V124Z" fill="url(#paint23_linear_898_122767)"/><path d="M22 132H179V136C179 138.209 177.209 140 175 140H22V132Z" fill="url(#paint24_linear_898_122767)"/><rect x="-0.5" y="0.5" width="3" height="27" rx="1.5" transform="matrix(-1 0 0 1 223 70)" fill="#D9D9D9" stroke="#727171"/><path d="M0 40C0 33.3726 5.37258 28 12 28H22V140H12C5.37258 140 0 134.627 0 128V40Z" fill="url(#paint25_linear_898_122767)"/><path d="M0.5 40C0.5 33.6487 5.64873 28.5 12 28.5H21.5V139.5H12C5.64873 139.5 0.5 134.351 0.5 128V40Z" stroke="black" stroke-opacity="0.12"/><rect x="182.5" y="3.5" width="3" height="27" rx="1.5" transform="rotate(-90 182.5 3.5)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_898_122767" x1="200" y1="28" x2="200" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122767" x1="179.5" y1="28" x2="179.5" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122767" x1="190" y1="55" x2="190" y2="113" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint3_linear_898_122767" x1="186" y1="41" x2="186" y2="129" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint4_linear_898_122767" x1="190.826" y1="23" x2="203.435" y2="23" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint5_linear_898_122767" x1="176" y1="18" x2="176" y2="73" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint6_linear_898_122767" x1="30.5" y1="168" x2="30.5" y2="362" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint7_linear_898_122767" x1="164" y1="145.238" x2="46" y2="145.238" gradientUnits="userSpaceOnUse">
<stop stop-color="#77B6FF"/>
<stop offset="0.500964" stop-color="#0054B7"/>
<stop offset="1" stop-color="#77B6FF"/>
</linearGradient>
<linearGradient id="paint8_linear_898_122767" x1="207.925" y1="145.238" x2="192.075" y2="145.238" gradientUnits="userSpaceOnUse">
<stop stop-color="#77B6FF"/>
<stop offset="0.500964" stop-color="#0054B7"/>
<stop offset="1" stop-color="#77B6FF"/>
</linearGradient>
<linearGradient id="paint9_linear_898_122767" x1="214" y1="59" x2="214" y2="107" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint10_linear_898_122767" x1="100.5" y1="28" x2="100.5" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.506056" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
<linearGradient id="paint11_linear_898_122767" x1="102.135" y1="36" x2="102.135" y2="28" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint12_linear_898_122767" x1="102.135" y1="44" x2="102.135" y2="36" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint13_linear_898_122767" x1="102.135" y1="52" x2="102.135" y2="44" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint14_linear_898_122767" x1="102.135" y1="60" x2="102.135" y2="52" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint15_linear_898_122767" x1="102.135" y1="68" x2="102.135" y2="60" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint16_linear_898_122767" x1="102.135" y1="76" x2="102.135" y2="68" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint17_linear_898_122767" x1="102.135" y1="84" x2="102.135" y2="76" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint18_linear_898_122767" x1="102.135" y1="92" x2="102.135" y2="84" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint19_linear_898_122767" x1="102.135" y1="100" x2="102.135" y2="92" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint20_linear_898_122767" x1="102.135" y1="108" x2="102.135" y2="100" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint21_linear_898_122767" x1="102.135" y1="116" x2="102.135" y2="108" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint22_linear_898_122767" x1="102.135" y1="124" x2="102.135" y2="116" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint23_linear_898_122767" x1="102.135" y1="132" x2="102.135" y2="124" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint24_linear_898_122767" x1="102.135" y1="140" x2="102.135" y2="132" gradientUnits="userSpaceOnUse">
<stop stop-color="#D9D9D9" stop-opacity="0"/>
<stop offset="1" stop-color="#000E33"/>
</linearGradient>
<linearGradient id="paint25_linear_898_122767" x1="11" y1="28" x2="11" y2="140" gradientUnits="userSpaceOnUse">
<stop stop-color="#0054B7"/>
<stop offset="0.503638" stop-color="#77B6FF"/>
<stop offset="1" stop-color="#0054B7"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

26
application/src/main/data/json/system/scada_symbols/quadro-connector.svg
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Quadro connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M52 38L4 38V18L52 18V38Z" fill="url(#paint0_linear_838_20114)"/><path d="M51.5 37.5L4.5 37.5V18.5L51.5 18.5V37.5Z" stroke="black" stroke-opacity="0.12"/><rect x="14.5" y="55.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 55.5)" fill="#D9D9D9" stroke="#727171"/><rect x="14.5" y="3.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 3.5)" fill="#D9D9D9" stroke="#727171"/><rect x="55.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 55.5 41.5)" fill="#D9D9D9" stroke="#727171"/><rect x="3.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 3.5 41.5)" fill="#D9D9D9" stroke="#727171"/><path d="M18 52V37.5238L28 28L38 37.5238V52H18Z" fill="url(#paint1_linear_838_20114)"/><path d="M18.5 51.5V37.7381L28 28.6905L37.5 37.7381V51.5H18.5Z" stroke="black" stroke-opacity="0.12"/><path d="M18 4V18.4762L28 28L38 18.4762V4L18 4Z" fill="url(#paint2_linear_838_20114)"/><path d="M18.5 4.5V18.2619L28 27.3095L37.5 18.2619V4.5L18.5 4.5Z" stroke="black" stroke-opacity="0.12"/><defs>
<linearGradient id="paint0_linear_838_20114" x1="13.4815" y1="38" x2="13.4815" y2="18" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_838_20114" x1="18" y1="46.0741" x2="38" y2="46.0741" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint2_linear_838_20114" x1="18" y1="9.92593" x2="38" y2="9.92593" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

26
application/src/main/data/json/system/scada_symbols/right-bottom-angle-connector.svg
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Right bottom angle connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><rect x="18" y="52" width="14" height="20" transform="rotate(-90 18 52)" fill="url(#paint0_linear_898_122973)"/><rect x="18.5" y="51.5" width="13" height="19" transform="rotate(-90 18.5 51.5)" stroke="black" stroke-opacity="0.12"/><path d="M52 38H38V18H52V38Z" fill="url(#paint1_linear_898_122973)"/><path d="M51.5 37.5H38.5V18.5H51.5V37.5Z" stroke="black" stroke-opacity="0.12"/><rect x="14.5" y="55.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 55.5)" fill="#D9D9D9" stroke="#727171"/><rect x="55.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 55.5 41.5)" fill="#D9D9D9" stroke="#727171"/><path d="M18 38C18 38 18.4772 29.5228 24 24C29.5228 18.4772 38 18 38 18V38H18Z" fill="url(#paint2_linear_898_122973)"/><path d="M37.5 37.5H18.5469C18.5708 37.2804 18.6056 36.9978 18.6554 36.6627C18.7839 35.7991 19.0118 34.589 19.4094 33.2095C20.2064 30.4438 21.6744 27.0327 24.3536 24.3536C27.0327 21.6744 30.4438 20.2064 33.2095 19.4094C34.589 19.0119 35.7991 18.7839 36.6627 18.6554C36.9978 18.6056 37.2804 18.5708 37.5 18.5469V37.5Z" stroke="black" stroke-opacity="0.12"/><defs>
<linearGradient id="paint0_linear_898_122973" x1="25.7778" y1="52" x2="25.7778" y2="72" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122973" x1="40.7654" y1="38" x2="40.7654" y2="18" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122973" x1="37" y1="38" x2="25.5" y2="23.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.367326" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

26
application/src/main/data/json/system/scada_symbols/right-top-angle-connector.svg
View File

@ -0,0 +1,26 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Right top angle connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><rect x="52" y="38" width="14" height="20" transform="rotate(-180 52 38)" fill="url(#paint0_linear_898_122954)"/><rect x="51.5" y="37.5" width="13" height="19" transform="rotate(-180 51.5 37.5)" stroke="black" stroke-opacity="0.12"/><path d="M38 4V18L18 18L18 4L38 4Z" fill="url(#paint1_linear_898_122954)"/><path d="M37.5 4.5V17.5L18.5 17.5L18.5 4.5L37.5 4.5Z" stroke="black" stroke-opacity="0.12"/><rect x="55.5" y="41.5" width="3" height="27" rx="1.5" transform="rotate(-180 55.5 41.5)" fill="#D9D9D9" stroke="#727171"/><rect x="41.5" y="0.5" width="3" height="27" rx="1.5" transform="rotate(90 41.5 0.5)" fill="#D9D9D9" stroke="#727171"/><path d="M38 38C38 38 29.5228 37.5228 24 32C18.4772 26.4772 18 18 18 18L38 18V38Z" fill="url(#paint2_linear_898_122954)"/><path d="M37.5 18.5V37.4531C37.2804 37.4292 36.9978 37.3944 36.6627 37.3446C35.7991 37.2161 34.589 36.9882 33.2095 36.5906C30.4438 35.7936 27.0327 34.3256 24.3536 31.6464C21.6744 28.9673 20.2064 25.5562 19.4094 22.7905C19.0119 21.411 18.7839 20.2009 18.6554 19.3373C18.6056 19.0022 18.5708 18.7196 18.5469 18.5L37.5 18.5Z" stroke="black" stroke-opacity="0.12"/><defs>
<linearGradient id="paint0_linear_898_122954" x1="59.7778" y1="38" x2="59.7778" y2="58" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_898_122954" x1="38" y1="15.2346" x2="18" y2="15.2346" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint2_linear_898_122954" x1="38" y1="19" x2="23.5" y2="30.5" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.367326" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

31
application/src/main/data/json/system/scada_symbols/top-black-counter.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

31
application/src/main/data/json/system/scada_symbols/top-white-counter.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

16
application/src/main/data/json/system/scada_symbols/vertical-connector-long.svg
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="112" viewBox="0 0 56 112" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Vertical connector long",
"widgetSizeX": 1,
"widgetSizeY": 2,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M18 108L18 4H38V108H18Z" fill="url(#paint0_linear_835_61018)"/><path d="M18.5 107.5L18.5 4.5H37.5V107.5H18.5Z" stroke="black" stroke-opacity="0.12"/><rect x="14.5" y="111.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 111.5)" fill="#D9D9D9" stroke="#727171"/><rect x="14.5" y="3.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 3.5)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_835_61018" x1="18" y1="24.5432" x2="38" y2="24.5432" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 990 B

16
application/src/main/data/json/system/scada_symbols/vertical-connector.svg
View File

@ -0,0 +1,16 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="56" height="56" viewBox="0 0 56 56" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Vertical connector",
"widgetSizeX": 1,
"widgetSizeY": 1,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M18 52L18 4H38V52H18Z" fill="url(#paint0_linear_898_123014)"/><path d="M18.5 51.5L18.5 4.5H37.5V51.5H18.5Z" stroke="black" stroke-opacity="0.12"/><rect x="14.5" y="55.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 55.5)" fill="#D9D9D9" stroke="#727171"/><rect x="14.5" y="3.5" width="3" height="27" rx="1.5" transform="rotate(-90 14.5 3.5)" fill="#D9D9D9" stroke="#727171"/><defs>
<linearGradient id="paint0_linear_898_123014" x1="18" y1="13.4815" x2="38" y2="13.4815" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.498292" stop-color="white"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 979 B

24
application/src/main/data/json/system/scada_symbols/vertical-tank-with-level.svg
View File

@ -0,0 +1,24 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="168" height="280" viewBox="0 0 168 280" fill="none">
<tb:metadata xmlns=""><![CDATA[{
"title": "Vertical tank with level",
"widgetSizeX": 3,
"widgetSizeY": 5,
"tags": [],
"behavior": [],
"properties": []
}]]></tb:metadata><path d="M0 55C-4.39865e-05 -7.62939e-06 56.5 0 56.5 0H84H112.5C112.5 0 168 0 168 55C168 98.4236 168 213.531 168 260.063C168 271.109 159.046 280 148 280H20C8.9543 280 2.24098e-06 271.109 4.61562e-06 260.063C1.46193e-05 213.531 3.47283e-05 98.4236 0 55Z" fill="url(#paint0_linear_828_77723)"/><path d="M0 55C-4.39865e-05 -7.62939e-06 56.5 0 56.5 0H84H112.5C112.5 0 168 0 168 55C168 98.4236 168 213.531 168 260.063C168 271.109 159.046 280 148 280H20C8.9543 280 2.24098e-06 271.109 4.61562e-06 260.063C1.46193e-05 213.531 3.47283e-05 98.4236 0 55Z" fill="url(#paint1_linear_828_77723)" fill-opacity="0.2"/><rect x="0.5" y="57.5" width="3" height="167" transform="rotate(-90 0.5 57.5)" fill="#D9D9D9" stroke="#727171"/><rect x="130.5" y="90.5" width="15" height="119" rx="1.5" fill="#4A4848" stroke="#7D7D7D"/><mask id="mask0_828_77723" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="131" y="90" width="14" height="120">
<rect x="131" y="90.8571" width="14" height="118.286" rx="1" fill="#D9D9D9"/>
</mask><g mask="url(#mask0_828_77723)">
<rect x="131" y="126.857" width="14" height="120" fill="#62A5F2"/>
</g><defs>
<linearGradient id="paint0_linear_828_77723" x1="168" y1="153.243" x2="-4.02657e-05" y2="153.243" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171"/>
<stop offset="0.504644" stop-color="#CACACA"/>
<stop offset="1" stop-color="#727171"/>
</linearGradient>
<linearGradient id="paint1_linear_828_77723" x1="84" y1="228.919" x2="84" y2="280" gradientUnits="userSpaceOnUse">
<stop stop-opacity="0"/>
<stop offset="1"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

102
application/src/main/data/json/system/scada_symbols/water-blower-right-connector.svg
View File

@ -0,0 +1,102 @@
<svg xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg" xmlns:tb="https://thingsboard.io/svg" width="401" height="400" viewBox="0 0 401 400" fill="none" version="1.1" id="svg143" sodipodi:docname="water-blower-right-connector.svg" inkscape:version="1.2.2 (b0a8486541, 2022-12-01)">
<tb:metadata xmlns=""><![CDATA[{
"title": "Water blower right connector",
"widgetSizeX": 2,
"widgetSizeY": 2,
"tags": [
{
"tag": "motor",
"stateRenderFunction": "var on = ctx.values.on;\n//debugger;\nvar t = element.timeline();\nif (on) {\n if (!t.active()) {\n if (t.time()) {\n t.play();\n } else {\n ctx.api.animate(element, 2000).ease('-').rotate(360).loop();\n t = element.timeline();\n //var speed = 0.25;\n //speed = Math.max(0, Math.min(1, speed))*2; \n //t.speed(speed);\n }\n }\n} else {\n t.pause();//.stop();\n}",
"actions": null
}
],
"behavior": [
{
"id": "on",
"name": "On/Off state",
"hint": null,
"type": "value",
"valueType": "BOOLEAN",
"defaultValue": false,
"trueLabel": "{i18n:widgets.rpc-state.on}",
"falseLabel": "{i18n:widgets.rpc-state.off}",
"stateLabel": "{i18n:widgets.rpc-state.on}",
"valueToDataType": "CONSTANT",
"constantValue": false,
"valueToDataFunction": ""
}
],
"properties": []
}]]></tb:metadata><sodipodi:namedview id="namedview145" pagecolor="#ffffff" bordercolor="#000000" borderopacity="0.25" inkscape:showpageshadow="2" inkscape:pageopacity="0.0" inkscape:pagecheckerboard="0" inkscape:deskcolor="#d1d1d1" showgrid="false" inkscape:zoom="2.5675" inkscape:cx="137.87731" inkscape:cy="200.19474" inkscape:window-width="2560" inkscape:window-height="1329" inkscape:window-x="0" inkscape:window-y="0" inkscape:window-maximized="1" inkscape:current-layer="svg143"/><rect x="71.929" y="275" width="85.7143" height="107.143" fill="url(#paint0_linear_955_26716)" id="rect2"/><rect x="73.7147" y="276.786" width="82.1429" height="103.571" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="rect4"/><rect x="243.357" y="275" width="85.7143" height="107.143" fill="url(#paint1_linear_955_26716)" id="rect6"/><rect x="245.143" y="276.786" width="82.1429" height="103.571" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="rect8"/><rect x="229.071" y="371.429" width="171.429" height="28.5714" rx="7.14286" fill="url(#paint2_linear_955_26716)" id="rect10"/><rect x="230.857" y="373.215" width="167.857" height="25" rx="5.35714" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="rect12"/><rect x="0.5" y="371.429" width="171.429" height="28.5714" rx="7.14286" fill="url(#paint3_linear_955_26716)" id="rect14"/><rect x="2.28571" y="373.215" width="167.857" height="25" rx="5.35714" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="rect16"/><path d="M364.786 371.429V364.286C364.786 360.341 367.984 357.143 371.929 357.143H379.072C383.017 357.143 386.215 360.341 386.215 364.286V371.429H364.786Z" fill="#727171" id="path18"/><path d="M366.572 369.643V364.286C366.572 361.327 368.97 358.929 371.929 358.929H379.072C382.031 358.929 384.429 361.327 384.429 364.286V369.643H366.572Z" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="path20"/><path d="M14.7864 371.429V364.286C14.7864 360.341 17.9843 357.143 21.9292 357.143H29.0721C33.017 357.143 36.2149 360.341 36.2149 364.286V371.429H14.7864Z" fill="#CACACA" id="path22"/><path d="M16.5721 369.643V364.286C16.5721 361.327 18.9706 358.929 21.9292 358.929H29.0721C32.0308 358.929 34.4292 361.327 34.4292 364.286V369.643H16.5721Z" stroke="black" stroke-opacity="0.12" stroke-width="3.57143" id="path24"/><rect x="200.5" y="64" width="186" height="72" fill="url(#paint4_linear_955_26716)" id="rect26"/><rect x="202" y="65.5" width="183" height="69" stroke="black" stroke-opacity="0.12" stroke-width="3" id="rect28"/><rect x="388" y="51.5" width="11" height="97" rx="5.5" fill="#D9D9D9" stroke="#727171" stroke-width="3" id="rect30"/><circle cx="200.5" cy="186" r="178" fill="url(#paint5_linear_955_26716)" id="circle32"/><circle cx="200.5" cy="186" r="176" stroke="black" stroke-opacity="0.12" stroke-width="4" id="circle34"/><circle cx="200.5" cy="186" r="132" fill="url(#paint6_linear_955_26716)" id="circle36"/><circle cx="200.5" cy="186" r="131.5" stroke="black" stroke-opacity="0.12" id="circle38"/><g id="g271" tb:tag="motor">
<g id="g257" transform="translate(30.396481,-1.1593215)">
<circle cx="170.10352" cy="187.15932" r="54" fill="url(#paint7_linear_955_26716)" id="circle40" style="fill:url(#paint7_linear_955_26716)"/>
<path d="m 188.10352,95.159123 c 0,16.154197 -4.5,30.000197 -18,30.000197 -13.5,0 -18,-13.846 -18,-30.000197 0,-16.1539 4.5,-30 18,-30 13.5,0 18,13.8461 18,30 z" fill="url(#paint8_linear_955_26716)" id="path44" style="fill:url(#paint8_linear_955_26716)"/>
<path d="m 188.10352,279.15932 c 0,16.154 -4.5,30 -18,30 -13.5,0 -18,-13.846 -18,-30 0,-16.154 4.5,-30 18,-30 13.5,0 18,13.846 18,30 z" fill="url(#paint9_linear_955_26716)" id="path48" style="fill:url(#paint9_linear_955_26716)"/>
<path d="m 109.10352,187.15932 c 0,13.5 -13.431002,18 -30.000002,18 -16.5683,0 -29.9998,-4.5 -29.9998,-18 0,-13.5 13.4315,-18 29.9998,-18 16.569,0 30.000002,4.5 30.000002,18 z" fill="url(#paint10_linear_955_26716)" id="path52" style="fill:url(#paint10_linear_955_26716)"/>
<path d="m 291.10352,187.15932 c 0,13.5 -13.431,18 -30,18 -16.568,0 -30,-4.5 -30,-18 0,-13.5 13.432,-18 30,-18 16.569,0 30,4.5 30,18 z" fill="url(#paint11_linear_955_26716)" id="path56" style="fill:url(#paint11_linear_955_26716)"/>
</g>
<g id="g250">
<circle cx="200.5" cy="186" r="53.5" stroke="black" stroke-opacity="0.12" id="circle42"/>
<path d="M218 93.9998C218 102.045 216.877 109.452 214.118 114.829C212.741 117.512 210.965 119.675 208.73 121.168C206.499 122.659 203.785 123.5 200.5 123.5C197.215 123.5 194.501 122.659 192.27 121.168C190.036 119.675 188.259 117.512 186.883 114.829C184.123 109.452 183 102.045 183 93.9998C183 85.9546 184.123 78.5477 186.883 73.1703C188.259 70.4877 190.036 68.3245 192.27 66.8313C194.501 65.3405 197.215 64.4998 200.5 64.4998C203.785 64.4998 206.499 65.3405 208.73 66.8313C210.965 68.3245 212.741 70.4877 214.118 73.1703C216.877 78.5477 218 85.9546 218 93.9998Z" stroke="black" stroke-opacity="0.12" id="path46"/>
<path d="M218 278C218 286.045 216.877 293.452 214.118 298.829C212.741 301.512 210.965 303.675 208.73 305.168C206.499 306.659 203.785 307.5 200.5 307.5C197.215 307.5 194.501 306.659 192.27 305.168C190.036 303.675 188.259 301.512 186.883 298.829C184.123 293.452 183 286.045 183 278C183 269.955 184.123 262.548 186.883 257.17C188.259 254.488 190.036 252.325 192.27 250.831C194.501 249.341 197.215 248.5 200.5 248.5C203.785 248.5 206.499 249.341 208.73 250.831C210.965 252.325 212.741 254.488 214.118 257.17C216.877 262.548 218 269.955 218 278Z" stroke="black" stroke-opacity="0.12" id="path50"/>
<path d="M139 186C139 189.288 138.184 192.003 136.724 194.234C135.263 196.467 133.139 198.243 130.483 199.618C125.16 202.376 117.755 203.5 109.5 203.5C101.246 203.5 93.8408 202.376 88.517 199.618C85.8617 198.243 83.7376 196.467 82.2762 194.234C80.8167 192.003 80.0002 189.288 80.0002 186C80.0002 182.712 80.8167 179.996 82.2762 177.766C83.7376 175.532 85.8617 173.757 88.517 172.381C93.8408 169.623 101.246 168.5 109.5 168.5C117.755 168.5 125.16 169.623 130.483 172.381C133.139 173.757 135.263 175.532 136.724 177.766C138.184 179.996 139 182.712 139 186Z" stroke="black" stroke-opacity="0.12" id="path54"/>
<path d="M321 186C321 189.288 320.184 192.003 318.724 194.234C317.263 196.467 315.139 198.243 312.483 199.618C307.16 202.376 299.755 203.5 291.5 203.5C283.246 203.5 275.841 202.376 270.517 199.618C267.862 198.243 265.738 196.467 264.276 194.234C262.817 192.003 262 189.288 262 186C262 182.712 262.817 179.996 264.276 177.766C265.738 175.532 267.862 173.757 270.517 172.381C275.841 169.623 283.246 168.5 291.5 168.5C299.755 168.5 307.16 169.623 312.483 172.381C315.139 173.757 317.263 175.532 318.724 177.766C320.184 179.996 321 182.712 321 186Z" stroke="black" stroke-opacity="0.12" id="path58"/>
</g>
</g><path d="M339.5 186C339.5 262.768 277.268 325 200.5 325C123.733 325 61.5002 262.768 61.5002 186C61.5002 109.232 123.733 47 200.5 47C277.268 47 339.5 109.232 339.5 186ZM68.5096 186C68.5096 258.896 127.604 317.991 200.5 317.991C273.397 317.991 332.491 258.896 332.491 186C332.491 113.104 273.397 54.0093 200.5 54.0093C127.604 54.0093 68.5096 113.104 68.5096 186Z" fill="url(#paint12_linear_955_26716)" id="path60"/><rect x="195" y="1.5" width="11" height="51" rx="5.5" fill="#D9D9D9" stroke="#727171" stroke-width="3" id="rect62"/><rect x="195" y="319.5" width="11" height="51" rx="5.5" fill="#D9D9D9" stroke="#727171" stroke-width="3" id="rect64"/><rect x="334" y="191.5" width="11" height="51" rx="5.5" transform="rotate(-90 334 191.5)" fill="#D9D9D9" stroke="#727171" stroke-width="3" id="rect66"/><rect x="16.0002" y="191.5" width="11" height="51" rx="5.5" transform="rotate(-90 16.0002 191.5)" fill="#D9D9D9" stroke="#727171" stroke-width="3" id="rect68"/><defs id="defs141">
<linearGradient id="paint0_linear_955_26716" x1="74.6075" y1="352.922" x2="156.654" y2="355.893" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171" id="stop70"/>
<stop offset="0.470507" stop-color="white" id="stop72"/>
<stop offset="1" stop-color="#727171" id="stop74"/>
</linearGradient>
<linearGradient id="paint1_linear_955_26716" x1="246.036" y1="352.922" x2="328.082" y2="355.893" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171" id="stop77"/>
<stop offset="0.470507" stop-color="white" id="stop79"/>
<stop offset="1" stop-color="#727171" id="stop81"/>
</linearGradient>
<linearGradient id="paint2_linear_955_26716" x1="232.967" y1="385.715" x2="249.686" y2="435.276" gradientUnits="userSpaceOnUse">
<stop stop-color="#CACACA" id="stop84"/>
<stop offset="1" stop-color="#727171" id="stop86"/>
</linearGradient>
<linearGradient id="paint3_linear_955_26716" x1="4.3961" y1="385.715" x2="21.1151" y2="435.276" gradientUnits="userSpaceOnUse">
<stop stop-color="#CACACA" id="stop89"/>
<stop offset="1" stop-color="#727171" id="stop91"/>
</linearGradient>
<linearGradient id="paint4_linear_955_26716" x1="303.833" y1="64" x2="303.833" y2="136" gradientUnits="userSpaceOnUse">
<stop stop-color="#727171" id="stop94"/>
<stop offset="0.489321" stop-color="white" id="stop96"/>
<stop offset="1" stop-color="#727171" id="stop98"/>
</linearGradient>
<linearGradient id="paint5_linear_955_26716" x1="80.3502" y1="52.5" x2="329.55" y2="323.95" gradientUnits="userSpaceOnUse">
<stop stop-color="#CACACA" id="stop101"/>
<stop offset="1" stop-color="#727171" id="stop103"/>
</linearGradient>
<linearGradient id="paint6_linear_955_26716" x1="111.4" y1="86.9998" x2="296.2" y2="288.3" gradientUnits="userSpaceOnUse">
<stop stop-color="#A1DBB3" id="stop106"/>
<stop offset="1" stop-color="#198038" id="stop108"/>
</linearGradient>
<linearGradient id="paint7_linear_955_26716" x1="164.05" y1="145.5" x2="239.65" y2="227.85" gradientUnits="userSpaceOnUse" gradientTransform="translate(-30.396482,1.1593233)">
<stop stop-color="#A1DBB3" id="stop111"/>
<stop offset="1" stop-color="#198038" id="stop113"/>
</linearGradient>
<linearGradient id="paint8_linear_955_26716" x1="188.35" y1="71.4998" x2="226.959" y2="96.7334" gradientUnits="userSpaceOnUse" gradientTransform="translate(-30.396482,1.1593233)">
<stop stop-color="#A1DBB3" id="stop116"/>
<stop offset="1" stop-color="#198038" id="stop118"/>
</linearGradient>
<linearGradient id="paint9_linear_955_26716" x1="188.35" y1="255.5" x2="226.959" y2="280.733" gradientUnits="userSpaceOnUse" gradientTransform="translate(-30.396482,1.1593233)">
<stop stop-color="#A1DBB3" id="stop121"/>
<stop offset="1" stop-color="#198038" id="stop123"/>
</linearGradient>
<linearGradient id="paint10_linear_955_26716" x1="89.2502" y1="172.5" x2="110.627" y2="211.309" gradientUnits="userSpaceOnUse" gradientTransform="translate(-30.396482,1.1593233)">
<stop stop-color="#A1DBB3" id="stop126"/>
<stop offset="1" stop-color="#198038" id="stop128"/>
</linearGradient>
<linearGradient id="paint11_linear_955_26716" x1="271.25" y1="172.5" x2="292.627" y2="211.309" gradientUnits="userSpaceOnUse" gradientTransform="translate(-30.396482,1.1593233)">
<stop stop-color="#A1DBB3" id="stop131"/>
<stop offset="1" stop-color="#198038" id="stop133"/>
</linearGradient>
<linearGradient id="paint12_linear_955_26716" x1="61.5002" y1="186" x2="339.5" y2="186" gradientUnits="userSpaceOnUse">
<stop stop-color="#F4F4F4" id="stop136"/>
<stop offset="1" stop-color="#EBE7E7" id="stop138"/>
</linearGradient>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

4
application/src/main/data/json/system/widget_bundles/scada_symbols.json
View File

@ -7,5 +7,7 @@
"order": 9200, "order": 9200,
"name": "SCADA symbols" "name": "SCADA symbols"
}, },
"widgetTypeFqns": [] "widgetTypeFqns": [
"scada_symbol"
]
} }

30
application/src/main/data/json/system/widget_bundles/scada_water_system_symbols.json
View File

@ -0,0 +1,30 @@
{
"widgetsBundle": {
"alias": "scada_water_system_symbols",
"title": "SCADA water system symbols",
"image": null,
"description": "Bundle with SCADA symbols for water system",
"order": 9300,
"name": "SCADA water system symbols"
},
"widgetTypeFqns": [
"level_and_fan",
"vertical_connector_long",
"horizontal_tank_with_screen",
"quadro_connector",
"horizontal_faucet",
"top_white_counter",
"right_top_angle_connector",
"left_top_angle_connector",
"water_blower_right_connector",
"vertical_tank_with_level",
"left_bottom_angle_connector",
"horizontal_connector_long",
"top_black_counter",
"right_bottom_angle_connector",
"vertical_connector",
"horizontal_connector",
"pump_left",
"pump"
]
}

2
application/src/main/java/org/thingsboard/server/install/ThingsboardInstallService.java
View File

@ -150,7 +150,6 @@ public class ThingsboardInstallService {
log.info("Updating system data..."); log.info("Updating system data...");
dataUpdateService.upgradeRuleNodes(); dataUpdateService.upgradeRuleNodes();
systemDataLoaderService.loadSystemWidgets(); systemDataLoaderService.loadSystemWidgets();
systemDataLoaderService.loadSystemScadaSymbols();
installScripts.loadSystemLwm2mResources(); installScripts.loadSystemLwm2mResources();
installScripts.loadSystemImages(); installScripts.loadSystemImages();
if (installScripts.isUpdateImages()) { if (installScripts.isUpdateImages()) {
@ -191,7 +190,6 @@ public class ThingsboardInstallService {
systemDataLoaderService.createAdminSettings(); systemDataLoaderService.createAdminSettings();
systemDataLoaderService.createRandomJwtSettings(); systemDataLoaderService.createRandomJwtSettings();
systemDataLoaderService.loadSystemWidgets(); systemDataLoaderService.loadSystemWidgets();
systemDataLoaderService.loadSystemScadaSymbols();
systemDataLoaderService.createOAuth2Templates(); systemDataLoaderService.createOAuth2Templates();
systemDataLoaderService.createQueues(); systemDataLoaderService.createQueues();
systemDataLoaderService.createDefaultNotificationConfigs(); systemDataLoaderService.createDefaultNotificationConfigs();

5
application/src/main/java/org/thingsboard/server/service/install/DefaultSystemDataLoaderService.java
View File

@ -526,11 +526,6 @@ public class DefaultSystemDataLoaderService implements SystemDataLoaderService {
installScripts.loadSystemWidgets(); installScripts.loadSystemWidgets();
} }
@Override
public void loadSystemScadaSymbols() throws Exception {
installScripts.loadSystemScadaSymbols();
}
private User createUser(Authority authority, private User createUser(Authority authority,
TenantId tenantId, TenantId tenantId,
CustomerId customerId, CustomerId customerId,

20
application/src/main/java/org/thingsboard/server/service/install/InstallScripts.java
View File

@ -265,6 +265,7 @@ public class InstallScripts {
); );
} }
} }
this.loadSystemScadaSymbols();
for (var widgetsBundleDescriptorEntry : widgetsBundlesMap.entrySet()) { for (var widgetsBundleDescriptorEntry : widgetsBundlesMap.entrySet()) {
Path path = widgetsBundleDescriptorEntry.getKey(); Path path = widgetsBundleDescriptorEntry.getKey();
try { try {
@ -302,12 +303,11 @@ public class InstallScripts {
} }
} }
public void loadSystemScadaSymbols() throws Exception { private void loadSystemScadaSymbols() throws Exception {
log.info("Loading system SCADA symbols"); log.info("Loading system SCADA symbols");
Path scadaSymbolsDir = Paths.get(getDataDir(), JSON_DIR, SYSTEM_DIR, SCADA_SYMBOLS_DIR); Path scadaSymbolsDir = Paths.get(getDataDir(), JSON_DIR, SYSTEM_DIR, SCADA_SYMBOLS_DIR);
if (Files.exists(scadaSymbolsDir)) { if (Files.exists(scadaSymbolsDir)) {
WidgetTypeDetails widgetTypeDetailsTemplate = widgetTypeService.findWidgetTypeDetailsByTenantIdAndFqn(TenantId.SYS_TENANT_ID, "scada_symbol"); WidgetTypeDetails scadaSymbolWidgetTemplate = widgetTypeService.findWidgetTypeDetailsByTenantIdAndFqn(TenantId.SYS_TENANT_ID, "scada_symbol");
List<String> widgetTypeFqns = new ArrayList<>();
try (DirectoryStream<Path> dirStream = Files.newDirectoryStream(scadaSymbolsDir, path -> path.toString().endsWith(SVG_EXT))) { try (DirectoryStream<Path> dirStream = Files.newDirectoryStream(scadaSymbolsDir, path -> path.toString().endsWith(SVG_EXT))) {
dirStream.forEach( dirStream.forEach(
path -> { path -> {
@ -316,8 +316,8 @@ public class InstallScripts {
var scadaSymbolData = Files.readAllBytes(path); var scadaSymbolData = Files.readAllBytes(path);
var metadata = ImageUtils.processScadaSymbolMetadata(fileName, scadaSymbolData); var metadata = ImageUtils.processScadaSymbolMetadata(fileName, scadaSymbolData);
TbResourceInfo savedScadaSymbol = saveScadaSymbol(metadata, fileName, scadaSymbolData); TbResourceInfo savedScadaSymbol = saveScadaSymbol(metadata, fileName, scadaSymbolData);
if (widgetTypeDetailsTemplate != null) { if (scadaSymbolWidgetTemplate != null) {
widgetTypeFqns.add(saveScadaSymbolWidget(widgetTypeDetailsTemplate, savedScadaSymbol, metadata)); saveScadaSymbolWidget(scadaSymbolWidgetTemplate, savedScadaSymbol, metadata);
} }
} catch (Exception e) { } catch (Exception e) {
log.error("Unable to load SCADA symbol from file: [{}]", path.toString()); log.error("Unable to load SCADA symbol from file: [{}]", path.toString());
@ -326,11 +326,6 @@ public class InstallScripts {
} }
); );
} }
var scadaSymbolsBundle = widgetsBundleService.findWidgetsBundleByTenantIdAndAlias(TenantId.SYS_TENANT_ID, "scada_symbols");
if (scadaSymbolsBundle != null) {
widgetTypeFqns.add("scada_symbol");
widgetTypeService.updateWidgetsBundleWidgetFqns(TenantId.SYS_TENANT_ID, scadaSymbolsBundle.getId(), widgetTypeFqns);
}
} }
} }
@ -355,7 +350,7 @@ public class InstallScripts {
} }
} }
private String saveScadaSymbolWidget(WidgetTypeDetails template, TbResourceInfo scadaSymbol, private WidgetTypeDetails saveScadaSymbolWidget(WidgetTypeDetails template, TbResourceInfo scadaSymbol,
ImageUtils.ScadaSymbolMetadataInfo metadata) { ImageUtils.ScadaSymbolMetadataInfo metadata) {
String symbolUrl = DataConstants.TB_IMAGE_PREFIX + scadaSymbol.getLink(); String symbolUrl = DataConstants.TB_IMAGE_PREFIX + scadaSymbol.getLink();
WidgetTypeDetails scadaSymbolWidget = new WidgetTypeDetails(); WidgetTypeDetails scadaSymbolWidget = new WidgetTypeDetails();
@ -388,8 +383,7 @@ public class InstallScripts {
controllerScript = controllerScript.replaceAll("previewWidth: '\\d*px'", "previewWidth: '" + (metadata.getWidgetSizeX() * 100) + "px'"); controllerScript = controllerScript.replaceAll("previewWidth: '\\d*px'", "previewWidth: '" + (metadata.getWidgetSizeX() * 100) + "px'");
controllerScript = controllerScript.replaceAll("previewHeight: '\\d*px'", "previewHeight: '" + (metadata.getWidgetSizeY() * 100 + 20) + "px'"); controllerScript = controllerScript.replaceAll("previewHeight: '\\d*px'", "previewHeight: '" + (metadata.getWidgetSizeY() * 100 + 20) + "px'");
((ObjectNode)descriptor).put("controllerScript", controllerScript); ((ObjectNode)descriptor).put("controllerScript", controllerScript);
var savedWidget = widgetTypeService.saveWidgetType(scadaSymbolWidget); return widgetTypeService.saveWidgetType(scadaSymbolWidget);
return savedWidget.getFqn();
} }
private void deleteSystemWidgetBundle(String bundleAlias) { private void deleteSystemWidgetBundle(String bundleAlias) {

2
application/src/main/java/org/thingsboard/server/service/install/SystemDataLoaderService.java
View File

@ -31,8 +31,6 @@ public interface SystemDataLoaderService {
void loadSystemWidgets() throws Exception; void loadSystemWidgets() throws Exception;
void loadSystemScadaSymbols() throws Exception;
void loadDemoData() throws Exception; void loadDemoData() throws Exception;
void createQueues(); void createQueues();

9
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.component.ts
View File

@ -51,6 +51,7 @@ import {
DashboardStateLayouts, DashboardStateLayouts,
GridSettings, GridSettings,
LayoutDimension, LayoutDimension,
LayoutType,
WidgetLayout WidgetLayout
} from '@app/shared/models/dashboard.models'; } from '@app/shared/models/dashboard.models';
import { WINDOW } from '@core/services/window.service'; import { WINDOW } from '@core/services/window.service';
@ -1199,7 +1200,7 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
} else { } else {
layoutIds = Object.keys(layouts) as DashboardLayoutId[]; layoutIds = Object.keys(layouts) as DashboardLayoutId[];
} }
return layoutIds.every(id => layouts[id].gridSettings.isScada); return layoutIds.every(id => layouts[id].gridSettings.layoutType === LayoutType.scada);
} }
private selectTargetLayout(): Observable<DashboardLayoutId> { private selectTargetLayout(): Observable<DashboardLayoutId> {
@ -1397,6 +1398,12 @@ export class DashboardPageComponent extends PageComponent implements IDashboardC
this.importExport.exportWidget(this.dashboard, this.dashboardCtx.state, layoutCtx.id, widget, widgetTitle); this.importExport.exportWidget(this.dashboard, this.dashboardCtx.state, layoutCtx.id, widget, widgetTitle);
} }
dashboardMouseDown($event: Event, layoutCtx: DashboardPageLayoutContext) {
if (this.isEdit && !this.isEditingWidget) {
layoutCtx.ctrl.resetHighlight();
}
}
widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget) { widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget) {
if (this.isEditingWidget) { if (this.isEditingWidget) {
this.editWidget($event, layoutCtx, widget); this.editWidget($event, layoutCtx, widget);

1
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-page.models.ts
View File

@ -53,6 +53,7 @@ export interface IDashboardController {
exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget, widgetTitle: string); exportWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget, widgetTitle: string);
removeWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget); removeWidget($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
widgetMouseDown($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget); widgetMouseDown($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
dashboardMouseDown($event: Event, layoutCtx: DashboardPageLayoutContext);
widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget); widgetClicked($event: Event, layoutCtx: DashboardPageLayoutContext, widget: Widget);
prepareDashboardContextMenu(layoutCtx: DashboardPageLayoutContext): Array<DashboardContextMenuItem>; prepareDashboardContextMenu(layoutCtx: DashboardPageLayoutContext): Array<DashboardContextMenuItem>;
prepareWidgetContextMenu(layoutCtx: DashboardPageLayoutContext, widget: Widget): Array<WidgetContextMenuItem>; prepareWidgetContextMenu(layoutCtx: DashboardPageLayoutContext, widget: Widget): Array<WidgetContextMenuItem>;

29
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.html
View File

@ -105,16 +105,21 @@
</mat-expansion-panel> </mat-expansion-panel>
</div> </div>
<div *ngIf="gridSettings" class="tb-form-panel no-border no-padding" [formGroup]="gridSettingsFormGroup"> <div *ngIf="gridSettings" class="tb-form-panel no-border no-padding" [formGroup]="gridSettingsFormGroup">
<div class="tb-form-row"> <div class="tb-form-row space-between">
<mat-slide-toggle class="mat-slide" formControlName="isScada"> <div class="fixed-title-width" translate>dashboard.layout</div>
{{ 'dashboard.scada-layout' | translate }} <mat-form-field class="flex" appearance="outline" subscriptSizing="dynamic">
</mat-slide-toggle> <mat-select formControlName="layoutType">
<mat-option *ngFor="let type of layoutTypes" [value]="type">
{{ layoutTypeTranslations.get(type) | translate }}
</mat-option>
</mat-select>
</mat-form-field>
</div> </div>
<div class="tb-form-panel stroked"> <div class="tb-form-panel stroked">
<div class="tb-form-panel-title" translate>dashboard.layout-settings</div> <div class="tb-form-panel-title" translate>dashboard.layout-settings</div>
<div class="tb-form-row space-between"> <div class="tb-form-row space-between">
<div translate>dashboard.columns-count</div> <div translate>dashboard.columns-count</div>
<mat-form-field *ngIf="!gridSettingsFormGroup.get('isScada').value" <mat-form-field *ngIf="!isScada()"
appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic"> appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
<input matInput formControlName="columns" type="number" min="10" max="1008" step="1" <input matInput formControlName="columns" type="number" min="10" max="1008" step="1"
required required
@ -129,7 +134,7 @@
warning warning
</mat-icon> </mat-icon>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="gridSettingsFormGroup.get('isScada').value" <mat-form-field *ngIf="isScada()"
class="medium-width" appearance="outline" subscriptSizing="dynamic"> class="medium-width" appearance="outline" subscriptSizing="dynamic">
<mat-select required formControlName="columns"> <mat-select required formControlName="columns">
<mat-option *ngFor="let columns of scadaColumns" [value]="columns"> <mat-option *ngFor="let columns of scadaColumns" [value]="columns">
@ -156,7 +161,7 @@
<span translate matSuffix>dashboard.columns-suffix</span> <span translate matSuffix>dashboard.columns-suffix</span>
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value" class="tb-form-row space-between"> <div *ngIf="!isScada()" class="tb-form-row space-between">
<div translate>dashboard.widgets-margins</div> <div translate>dashboard.widgets-margins</div>
<mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic"> <mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
<input matInput formControlName="margin" type="number" min="0" max="50" step="any" <input matInput formControlName="margin" type="number" min="0" max="50" step="any"
@ -173,12 +178,12 @@
</mat-icon> </mat-icon>
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value" class="tb-form-row"> <div *ngIf="!isScada()" class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="outerMargin"> <mat-slide-toggle class="mat-slide" formControlName="outerMargin">
{{ 'dashboard.apply-outer-margin' | translate }} {{ 'dashboard.apply-outer-margin' | translate }}
</mat-slide-toggle> </mat-slide-toggle>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value" class="tb-form-row"> <div *ngIf="!isScada()" class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="autoFillHeight"> <mat-slide-toggle class="mat-slide" formControlName="autoFillHeight">
{{ 'dashboard.autofill-height' | translate }} {{ 'dashboard.autofill-height' | translate }}
</mat-slide-toggle> </mat-slide-toggle>
@ -207,19 +212,19 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value || isRightLayout" class="tb-form-panel stroked"> <div *ngIf="!isScada() || isRightLayout" class="tb-form-panel stroked">
<div class="tb-form-panel-title" translate>dashboard.mobile-layout</div> <div class="tb-form-panel-title" translate>dashboard.mobile-layout</div>
<div *ngIf="isRightLayout" class="tb-form-row"> <div *ngIf="isRightLayout" class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="mobileDisplayLayoutFirst"> <mat-slide-toggle class="mat-slide" formControlName="mobileDisplayLayoutFirst">
{{ 'dashboard.display-first-in-mobile-view' | translate }} {{ 'dashboard.display-first-in-mobile-view' | translate }}
</mat-slide-toggle> </mat-slide-toggle>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value" class="tb-form-row"> <div *ngIf="!isScada()" class="tb-form-row">
<mat-slide-toggle class="mat-slide" formControlName="mobileAutoFillHeight"> <mat-slide-toggle class="mat-slide" formControlName="mobileAutoFillHeight">
{{ 'dashboard.autofill-height' | translate }} {{ 'dashboard.autofill-height' | translate }}
</mat-slide-toggle> </mat-slide-toggle>
</div> </div>
<div *ngIf="!gridSettingsFormGroup.get('isScada').value" class="tb-form-row space-between"> <div *ngIf="!isScada()" class="tb-form-row space-between">
<div translate>dashboard.mobile-row-height</div> <div translate>dashboard.mobile-row-height</div>
<mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic"> <mat-form-field appearance="outline" class="number medium-width tb-suffix-absolute" subscriptSizing="dynamic">
<input matInput formControlName="mobileRowHeight" type="number" min="5" max="200" step="any" <input matInput formControlName="mobileRowHeight" type="number" min="5" max="200" step="any"

26
ui-ngx/src/app/modules/home/components/dashboard-page/dashboard-settings-dialog.component.ts
View File

@ -23,7 +23,13 @@ import { FormBuilder, FormControl, FormGroup, FormGroupDirective, NgForm, Valida
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { DialogComponent } from '@app/shared/components/dialog.component'; import { DialogComponent } from '@app/shared/components/dialog.component';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { DashboardSettings, GridSettings, StateControllerId } from '@app/shared/models/dashboard.models'; import {
DashboardSettings,
GridSettings,
LayoutType,
layoutTypes, layoutTypeTranslationMap,
StateControllerId
} from '@app/shared/models/dashboard.models';
import { isDefined, isUndefined } from '@core/utils'; import { isDefined, isUndefined } from '@core/utils';
import { StatesControllerService } from './states/states-controller.service'; import { StatesControllerService } from './states/states-controller.service';
import { merge } from 'rxjs'; import { merge } from 'rxjs';
@ -43,6 +49,10 @@ export interface DashboardSettingsDialogData {
export class DashboardSettingsDialogComponent extends DialogComponent<DashboardSettingsDialogComponent, DashboardSettingsDialogData> export class DashboardSettingsDialogComponent extends DialogComponent<DashboardSettingsDialogComponent, DashboardSettingsDialogData>
implements OnInit, ErrorStateMatcher { implements OnInit, ErrorStateMatcher {
layoutTypes = layoutTypes;
layoutTypeTranslations = layoutTypeTranslationMap;
settings: DashboardSettings; settings: DashboardSettings;
gridSettings: GridSettings; gridSettings: GridSettings;
isRightLayout = false; isRightLayout = false;
@ -164,7 +174,7 @@ export class DashboardSettingsDialogComponent extends DialogComponent<DashboardS
} }
const mobileAutoFillHeight = isUndefined(this.gridSettings.mobileAutoFillHeight) ? false : this.gridSettings.mobileAutoFillHeight; const mobileAutoFillHeight = isUndefined(this.gridSettings.mobileAutoFillHeight) ? false : this.gridSettings.mobileAutoFillHeight;
this.gridSettingsFormGroup = this.fb.group({ this.gridSettingsFormGroup = this.fb.group({
isScada: [this.gridSettings.isScada, []], layoutType: [this.gridSettings.layoutType || LayoutType.default, []],
columns: [this.gridSettings.columns || 24, [Validators.required, Validators.min(10), Validators.max(1008)]], columns: [this.gridSettings.columns || 24, [Validators.required, Validators.min(10), Validators.max(1008)]],
minColumns: [this.gridSettings.minColumns || this.gridSettings.columns || 24, minColumns: [this.gridSettings.minColumns || this.gridSettings.columns || 24,
[Validators.required, Validators.min(10), Validators.max(1008)]], [Validators.required, Validators.min(10), Validators.max(1008)]],
@ -184,7 +194,7 @@ export class DashboardSettingsDialogComponent extends DialogComponent<DashboardS
isUndefined(this.gridSettings.mobileDisplayLayoutFirst) ? false : this.gridSettings.mobileDisplayLayoutFirst; isUndefined(this.gridSettings.mobileDisplayLayoutFirst) ? false : this.gridSettings.mobileDisplayLayoutFirst;
this.gridSettingsFormGroup.addControl('mobileDisplayLayoutFirst', this.fb.control(mobileDisplayLayoutFirst, [])); this.gridSettingsFormGroup.addControl('mobileDisplayLayoutFirst', this.fb.control(mobileDisplayLayoutFirst, []));
} }
merge(this.gridSettingsFormGroup.get('isScada').valueChanges, merge(this.gridSettingsFormGroup.get('layoutType').valueChanges,
this.gridSettingsFormGroup.get('mobileAutoFillHeight').valueChanges).subscribe( this.gridSettingsFormGroup.get('mobileAutoFillHeight').valueChanges).subscribe(
() => { () => {
this.updateGridSettingsFormState(); this.updateGridSettingsFormState();
@ -199,6 +209,14 @@ export class DashboardSettingsDialogComponent extends DialogComponent<DashboardS
ngOnInit(): void { ngOnInit(): void {
} }
isScada() {
if (this.gridSettingsFormGroup) {
return this.gridSettingsFormGroup.get('layoutType').value === LayoutType.scada;
} else {
return false;
}
}
isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean { isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {
const originalErrorState = this.errorStateMatcher.isErrorState(control, form); const originalErrorState = this.errorStateMatcher.isErrorState(control, form);
const customErrorState = !!(control && control.invalid && this.submitted); const customErrorState = !!(control && control.invalid && this.submitted);
@ -230,7 +248,7 @@ export class DashboardSettingsDialogComponent extends DialogComponent<DashboardS
} }
private updateGridSettingsFormState() { private updateGridSettingsFormState() {
const isScada: boolean = this.gridSettingsFormGroup.get('isScada').value; const isScada: boolean = this.gridSettingsFormGroup.get('layoutType').value === LayoutType.scada;
if (isScada) { if (isScada) {
this.gridSettingsFormGroup.get('margin').disable(); this.gridSettingsFormGroup.get('margin').disable();
this.gridSettingsFormGroup.get('outerMargin').disable(); this.gridSettingsFormGroup.get('outerMargin').disable();

21
ui-ngx/src/app/modules/home/components/dashboard-page/layout/dashboard-layout.component.ts
View File

@ -37,6 +37,7 @@ import { TbPopoverComponent } from '@shared/components/popover.component';
import { ImagePipe } from '@shared/pipe/image.pipe'; import { ImagePipe } from '@shared/pipe/image.pipe';
import { map } from 'rxjs/operators'; import { map } from 'rxjs/operators';
import { displayGrids } from 'angular-gridster2/lib/gridsterConfig.interface'; import { displayGrids } from 'angular-gridster2/lib/gridsterConfig.interface';
import { LayoutType } from '@shared/models/dashboard.models';
@Component({ @Component({
selector: 'tb-dashboard-layout', selector: 'tb-dashboard-layout',
@ -67,28 +68,32 @@ export class DashboardLayoutComponent extends PageComponent implements ILayoutCo
return this.layoutCtxValue; return this.layoutCtxValue;
} }
get isScada(): boolean {
return this.layoutCtx.gridSettings.layoutType === LayoutType.scada;
}
get outerMargin(): boolean { get outerMargin(): boolean {
return this.layoutCtx.gridSettings.isScada ? false : this.layoutCtx.gridSettings.outerMargin; return this.isScada ? false : this.layoutCtx.gridSettings.outerMargin;
} }
get margin(): number { get margin(): number {
return this.layoutCtx.gridSettings.isScada ? 0 : this.layoutCtx.gridSettings.margin; return this.isScada ? 0 : this.layoutCtx.gridSettings.margin;
} }
get autoFillHeight(): boolean { get autoFillHeight(): boolean {
return (this.isEdit || this.layoutCtx.gridSettings.isScada) ? false : this.layoutCtx.gridSettings.autoFillHeight; return (this.isEdit || this.isScada) ? false : this.layoutCtx.gridSettings.autoFillHeight;
} }
get mobileAutoFillHeight(): boolean { get mobileAutoFillHeight(): boolean {
return (this.isEdit || this.layoutCtx.gridSettings.isScada) ? false : this.layoutCtx.gridSettings.mobileAutoFillHeight; return (this.isEdit || this.isScada) ? false : this.layoutCtx.gridSettings.mobileAutoFillHeight;
} }
get isMobileDisabled(): boolean { get isMobileDisabled(): boolean {
return this.widgetEditMode || this.layoutCtx.gridSettings.isScada; return this.widgetEditMode || this.isScada;
} }
get colWidthInteger(): boolean { get colWidthInteger(): boolean {
return this.layoutCtx.gridSettings.isScada; return this.isScada;
} }
get columns(): number { get columns(): number {
@ -271,6 +276,10 @@ export class DashboardLayoutComponent extends PageComponent implements ILayoutCo
this.layoutCtx.dashboardCtrl.widgetMouseDown($event, this.layoutCtx, widget); this.layoutCtx.dashboardCtrl.widgetMouseDown($event, this.layoutCtx, widget);
} }
onDashboardMouseDown($event: Event): void {
this.layoutCtx.dashboardCtrl.dashboardMouseDown($event, this.layoutCtx);
}
onWidgetClicked($event: Event, widget: Widget): void { onWidgetClicked($event: Event, widget: Widget): void {
this.layoutCtx.dashboardCtrl.widgetClicked($event, this.layoutCtx, widget); this.layoutCtx.dashboardCtrl.widgetClicked($event, this.layoutCtx, widget);
} }

1
ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.html
View File

@ -26,6 +26,7 @@
fxFlex class="tb-dashboard-content" [class.autofill-height]="isAutofillHeight()" fxFlex class="tb-dashboard-content" [class.autofill-height]="isAutofillHeight()"
[class.center-vertical]="centerVertical" [class.center-vertical]="centerVertical"
[class.center-horizontal]="centerHorizontal" [class.center-horizontal]="centerHorizontal"
(mousedown)="onDashboardMouseDown($event)"
(contextmenu)="openDashboardContextMenu($event)"> (contextmenu)="openDashboardContextMenu($event)">
<div #dashboardMenuTrigger="matMenuTrigger" style="visibility: hidden; position: fixed" <div #dashboardMenuTrigger="matMenuTrigger" style="visibility: hidden; position: fixed"
[style.left]="dashboardMenuPosition.x" [style.left]="dashboardMenuPosition.x"

9
ui-ngx/src/app/modules/home/components/dashboard/dashboard.component.ts
View File

@ -395,6 +395,15 @@ export class DashboardComponent extends PageComponent implements IDashboardCompo
} }
} }
onDashboardMouseDown($event: MouseEvent) {
if (this.callbacks && this.callbacks.onDashboardMouseDown) {
if ($event) {
$event.stopPropagation();
}
this.callbacks.onDashboardMouseDown($event);
}
}
openDashboardContextMenu($event: MouseEvent) { openDashboardContextMenu($event: MouseEvent) {
if (this.callbacks && this.callbacks.prepareDashboardContextMenu) { if (this.callbacks && this.callbacks.prepareDashboardContextMenu) {
const items = this.callbacks.prepareDashboardContextMenu($event); const items = this.callbacks.prepareDashboardContextMenu($event);

1
ui-ngx/src/app/modules/home/models/dashboard-component.models.ts
View File

@ -68,6 +68,7 @@ export interface DashboardCallbacks {
onExportWidget?: ($event: Event, widget: Widget, widgeTitle: string) => void; onExportWidget?: ($event: Event, widget: Widget, widgeTitle: string) => void;
onRemoveWidget?: ($event: Event, widget: Widget) => void; onRemoveWidget?: ($event: Event, widget: Widget) => void;
onWidgetMouseDown?: ($event: Event, widget: Widget) => void; onWidgetMouseDown?: ($event: Event, widget: Widget) => void;
onDashboardMouseDown?: ($event: Event) => void;
onWidgetClicked?: ($event: Event, widget: Widget) => void; onWidgetClicked?: ($event: Event, widget: Widget) => void;
prepareDashboardContextMenu?: ($event: Event) => Array<DashboardContextMenuItem>; prepareDashboardContextMenu?: ($event: Event) => Array<DashboardContextMenuItem>;
prepareWidgetContextMenu?: ($event: Event, widget: Widget) => Array<WidgetContextMenuItem>; prepareWidgetContextMenu?: ($event: Event, widget: Widget) => Array<WidgetContextMenuItem>;

22
ui-ngx/src/app/shared/models/dashboard.models.ts
View File

@ -18,7 +18,7 @@ import { BaseData, ExportableEntity } from '@shared/models/base-data';
import { DashboardId } from '@shared/models/id/dashboard-id'; import { DashboardId } from '@shared/models/id/dashboard-id';
import { TenantId } from '@shared/models/id/tenant-id'; import { TenantId } from '@shared/models/id/tenant-id';
import { ShortCustomerInfo } from '@shared/models/customer.model'; import { ShortCustomerInfo } from '@shared/models/customer.model';
import { Widget } from './widget.models'; import { LegendPosition, Widget } from './widget.models';
import { Timewindow } from '@shared/models/time/time.models'; import { Timewindow } from '@shared/models/time/time.models';
import { EntityAliases } from './alias.models'; import { EntityAliases } from './alias.models';
import { Filters } from '@shared/models/query/query.models'; import { Filters } from '@shared/models/query/query.models';
@ -49,7 +49,22 @@ export interface WidgetLayouts {
[id: string]: WidgetLayout; [id: string]: WidgetLayout;
} }
export enum LayoutType {
default = 'default',
scada = 'scada'
}
export const layoutTypes = Object.keys(LayoutType) as LayoutType[];
export const layoutTypeTranslationMap = new Map<LayoutType, string>(
[
[ LayoutType.default, 'dashboard.layout-type-default' ],
[ LayoutType.scada, 'dashboard.layout-type-scada' ]
]
);
export interface GridSettings { export interface GridSettings {
layoutType?: LayoutType;
backgroundColor?: string; backgroundColor?: string;
columns?: number; columns?: number;
minColumns?: number; minColumns?: number;
@ -62,7 +77,6 @@ export interface GridSettings {
mobileRowHeight?: number; mobileRowHeight?: number;
mobileDisplayLayoutFirst?: boolean; mobileDisplayLayoutFirst?: boolean;
layoutDimension?: LayoutDimension; layoutDimension?: LayoutDimension;
isScada?: boolean;
[key: string]: any; [key: string]: any;
} }
@ -78,7 +92,7 @@ export interface DashboardLayoutInfo {
} }
export interface LayoutDimension { export interface LayoutDimension {
type?: LayoutType; type?: LayoutDimensionType;
fixedWidth?: number; fixedWidth?: number;
fixedLayout?: DashboardLayoutId; fixedLayout?: DashboardLayoutId;
leftWidthPercentage?: number; leftWidthPercentage?: number;
@ -86,7 +100,7 @@ export interface LayoutDimension {
export declare type DashboardLayoutId = 'main' | 'right'; export declare type DashboardLayoutId = 'main' | 'right';
export declare type LayoutType = 'percentage' | 'fixed'; export declare type LayoutDimensionType = 'percentage' | 'fixed';
export declare type DashboardStateLayouts = {[key in DashboardLayoutId]?: DashboardLayout}; export declare type DashboardStateLayouts = {[key in DashboardLayoutId]?: DashboardLayout};

4
ui-ngx/src/assets/locale/locale.constant-en_US.json
View File

@ -1167,7 +1167,9 @@
"move-by": "Move by", "move-by": "Move by",
"cols": "cols", "cols": "cols",
"rows": "rows", "rows": "rows",
"scada-layout": "SCADA layout", "layout": "Layout",
"layout-type-default": "Default",
"layout-type-scada": "SCADA",
"layout-settings": "Layout settings", "layout-settings": "Layout settings",
"columns-count": "Columns count", "columns-count": "Columns count",
"columns-count-required": "Columns count is required.", "columns-count-required": "Columns count is required.",

Write Preview
Loading…
Cancel
Save