Changes for page 05 Cloud SCADA

Last modified by Joe on 2024/08/08 09:29

From version 6.1
edited by Leo
on 2022/06/16 17:07
Change comment: There is no comment for this version
To version 4.1
edited by Leo
on 2022/06/16 16:25
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -1,10 +1,11 @@
1 1  = 1 Instruction =
2 2  
3 -The default page of the V-BOX WEB SCADA platform after login is shown as below. The main functions of this platform includes the centralized monitoring, template management, project management, and authority management. The user could switch between the function modules through the left navigation bar, and the specific content of each function module will be displayed on the right side.
3 +The default page of the V-BOX WEB SCADA platform after login is shown as Figure 1-1. The main functions of this platform includes the centralized monitoring, template management, project management, and authority management. The user could switch between the function modules through the left navigation bar, and the specific content of each function module will be displayed on the right side.
4 4  
5 5  (% style="text-align:center" %)
6 6  [[image:1617874482390-379.png||height="421" width="800" class="img-thumbnail"]]
7 7  
8 +Figure 1 ‑1
8 8  
9 9  **Introduction**
10 10  
... ... @@ -28,6 +28,8 @@
28 28  (% style="text-align:center" %)
29 29  [[image:1617874518342-186.png||height="357" width="200" class="img-thumbnail"]]
30 30  
32 +Figure 2 ‑1
33 +
31 31  2)The account of the V-box WEB SCADA platform is the same as the V-BOX account.
32 32  
33 33  **✎Note:**
... ... @@ -43,6 +43,8 @@
43 43  (% style="text-align:center" %)
44 44  [[image:1617874482390-379.png||height="421" width="800" class="img-thumbnail"]]
45 45  
49 +Figure 3 ‑1
50 +
46 46  This page shows projects under each group by switching groups. User could add, delete and modify the group.
47 47  
48 48  == 3.1 Group management ==
... ... @@ -62,11 +62,13 @@
62 62  
63 63  == 3.2 Assign project ==
64 64  
65 -The centralized monitoring module includes following functions:add new projects, delete projects and preview projects for each group. Click on the corresponding group to display the list of projects in the group, as shown below.
70 +The centralized monitoring module includes following functions:add new projects, delete projects and preview projects for each group. Click on the corresponding group to display the list of projects in the group, as shown in Figure 3-3.
66 66  
67 67  (% style="text-align:center" %)
68 68  [[image:1617948660671-429.png||height="270" width="800" class="img-thumbnail"]]
69 69  
75 +Figure 3 ‑3
76 +
70 70  1. **Add project:** Click [[image:1617948869319-850.png||class="img-thumbnail"]] in the project list area to assign a project in the group.
71 71  1. **Delete project: **Click [[image:1617948891768-154.png||class="img-thumbnail"]] in the upper right corner of a project thumbnail in the project list to move the project out of the group.
72 72  1. **Preview project:** Click on [[image:1617948906340-294.png||class="img-thumbnail"]] to view the configuration screen of the project. For details, please refer to chapter 3.3.
... ... @@ -73,11 +73,13 @@
73 73  
74 74  == 3.3 Browse project ==
75 75  
76 -Click on [[image:1617948906340-294.png||class="img-thumbnail"]] in the project list to view the configuration screen.
83 +Click on [[image:1617948906340-294.png||class="img-thumbnail"]] in the project list to view the configuration screen. See Figure 3-4.
77 77  
78 78  (% style="text-align:center" %)
79 79  [[image:V-BOX cloud configuration user manual_html_72b4c2044c0ab2fe.png||height="365" width="600" class="img-thumbnail"]]
80 80  
88 +Figure 3 ‑4
89 +
81 81  1. **Real-time data: **Click the [Real-time Data] to view the device name and state. Or view the current value, encoding, description, etc. of each data.
82 82  1. **Alarm data: **Click the [alarm data] button to pop up the alarm record page and view the current alarm status and historical alarm information.
83 83  1. **Historical data:** Click the [History Data] button to pop up the history report interface of the data. User could view all the historical data.
... ... @@ -89,11 +89,13 @@
89 89  
90 90  == **4.1 Template management** ==
91 91  
92 -Click the template management module on the left menu to enter the template management module.
101 +Click the template management module on the left menu to enter the template management module, as Figure 4-1 shows.
93 93  
94 94  (% style="text-align:center" %)
95 95  [[image:1617949183137-615.png||height="205" width="800" class="img-thumbnail"]]
96 96  
106 +Figure 4 ‑1
107 +
97 97  The V-box WEB SCADA platform provides a template management module that could save the designed configuration screen as a template and user could import the template .
98 98  
99 99  == **4.2 Add, edit and delete template** ==
... ... @@ -105,6 +105,8 @@
105 105  (% style="text-align:center" %)
106 106  [[image:1617933432286-367.png||height="347" width="600" class="img-thumbnail"]]
107 107  
119 +Figure 4 ‑2
120 +
108 108  == **4.3 Design template** ==
109 109  
110 110  Click the [Template Design] in the template list to access the V-box configuration platform editor page. User could edit the template in this page. More details about how to design the project please refer to Chapter 6.
... ... @@ -115,11 +115,13 @@
115 115  
116 116  == **5.1 Project management** ==
117 117  
118 -Click the [Project management] on the left menu to enter the project list.
131 +Click the [Project management] on the left menu to enter the project list, as Figure 5-1 shows.
119 119  
120 120  (% style="text-align:center" %)
121 121  [[image:1617949499753-859.png||height="401" width="800" class="img-thumbnail"]]
122 122  
136 +Figure 5 ‑1
137 +
123 123  == **5.2 Add, edit, delete and preview project** ==
124 124  
125 125  1. **Add project:** Click the [Add] in the upper right corner of [Project Management] to add a project (Set project name and cross-box options).
... ... @@ -146,17 +146,21 @@
146 146  (% style="text-align:center" %)
147 147  [[image:1617949467765-343.png||height="393" width="800" class="img-thumbnail"]]
148 148  
149 -The function partition of WEB SCADA editor.
164 +Figure 6 ‑1
150 150  
166 +The function partition of WEB SCADA editor is shown in Figure 6-2.
167 +
151 151  (% style="text-align:center" %)
152 152  [[image:V-box 1.png||alt="V-BOX cloud configuration user manual_html_cb0c19aefec34494.png" height="315" width="600" class="img-thumbnail"]]
153 153  
171 +Figure 6 ‑2
172 +
154 154  1. **Toolbar:** A function bar that provides pages operations and objects operations;
155 155  1. **Project Manager:** It shows all pages for project;
156 156  1. **Objects Library: **It provides 7 basic shapes objects and 13 common objects for creating SCADA page;
157 157  1. **Design Area: **Design area for SCADA page and template;
158 158  
159 -== **6.2 Design** ==
178 +== **6.2 Operating procedures of design** ==
160 160  
161 161  1. Create new page and set the property;
162 162  1. Select the object and drag the mouse in design area;
... ... @@ -165,13 +165,15 @@
165 165  
166 166  == **6.3 Project Screen** ==
167 167  
168 -A project or template is composed of one or several screens. And all screens are listed on [Project Manager]. Select screen name, its page would be displayed on [Design Area].
187 +A project or template is composed of one or several screens. And all screens are listed on [Project Manager] as Figure 6-3 shows. Select screen name, its page would be displayed on [Design Area].
169 169  
170 170  (% style="text-align:center" %)
171 171  [[image:1617949566099-340.png||height="705" width="250" class="img-thumbnail"]]
172 172  
173 -Project Manager would display two kinds of screen. One is page screen, and the other is Thumbnail. A project or template could contain several screens, but only one thumbnail. Thumbnail is used for displayed project on [Centralized Monitoring].
192 +Figure 6 ‑3
174 174  
194 +Project Manager would display two kinds of screen. One is page screen, and the other is Thumbnail. A project or template could contain several screens, but only one thumbnail. Thumbnail is used for displayed project on [Centralized Monitoring] as Figure 6-4 shows.
195 +
175 175  (% style="text-align:center" %)
176 176  [[image:1617949620811-522.png||height="469" width="800" class="img-thumbnail"]]
177 177  
... ... @@ -178,13 +178,16 @@
178 178  (% style="text-align:center" %)
179 179  [[image:1617949663298-790.png||height="413" width="800" class="img-thumbnail"]]
180 180  
181 -**Creating thumbnail**
202 +Figure 6 ‑4
182 182  
204 +**Operating procedures of creating thumbnail**
205 +
183 183  1)Click [[image:V-BOX cloud configuration user manual_html_287ead7d4c995a28.png||height="30" width="30" class="img-thumbnail"]] on [Project Manager];
184 184  
185 185  (% style="text-align:center" %)
186 186  [[image:1617949820581-164.png||height="386" width="500" class="img-thumbnail"]]
187 187  
211 +Figure 6 ‑14
188 188  
189 189  2)Select [Page Type] as [Thumbnail] on screen attribute window;
190 190  
... ... @@ -192,7 +192,7 @@
192 192  
193 193  4)Click [Save] to complete operation;
194 194  
195 -**Creating page screen**
219 +**Operating procedures of creating page screen**
196 196  
197 197  1)Click [[image:V-BOX cloud configuration user manual_html_287ead7d4c995a28.png||height="30" width="30" class="img-thumbnail"]] on [Project Manager];
198 198  
... ... @@ -209,7 +209,7 @@
209 209  
210 210  When a thumbnail page is not created, the default picture would be displayed on [Centralized Monitoring].
211 211  
212 -**Modifying screen**
236 +**Operating procedures of modifying screen**
213 213  
214 214  1. Select the page to be modified;
215 215  1. Click [[image:V-BOX cloud configuration user manual_html_a5f920d2d144472c.png||height="30" width="30" class="img-thumbnail"]] on [Project Manager] or [[image:V-BOX cloud configuration user manual_html_56ae321f2d4418ac.png||height="24" width="147" class="img-thumbnail"]] on [Toolbar];
... ... @@ -217,7 +217,7 @@
217 217  1. Click [[image:V-BOX cloud configuration user manual_html_5970eb09902bd1a3.png||height="30" width="30" class="img-thumbnail"]] on [Toolbar] to complete modification;
218 218  1.
219 219  
220 -**Deleting screen**
244 +**Operating procedures of deleting screen**
221 221  
222 222  1)Select screen on [Project Manager];
223 223  
... ... @@ -226,9 +226,11 @@
226 226  (% style="text-align:center" %)
227 227  [[image:V-BOX cloud configuration user manual_html_1e7f9096426ebeca.png||height="161" width="300" class="img-thumbnail"]]
228 228  
253 +Figure 6 ‑16
254 +
229 229  3)Click [OK] to delete page;
230 230  
231 -**Sort screen**
257 +**Operating procedures of sort screen**
232 232  
233 233  1. Select page screen on [Project Manager];
234 234  1. Click [[image:V-BOX cloud configuration user manual_html_1ab5c888bfd536c.png||height="19" width="40"]] to sort screen upwards or downwards;
... ... @@ -243,22 +243,24 @@
243 243  
244 244  === **6.4.1 Basic Operations** ===
245 245  
246 -**Adding objects on screen**
272 +**Operating procedures of adding objects on screen**
247 247  
248 248  1. Select and click the desired object on [Objects Library];
249 249  1. Move the cursor to the [Design Area];
250 250  1. When cursor changes as + symbol, hold down left click draw the desired size;
251 251  
252 -**Moving object**
278 +**Operating procedures of moving object**
253 253  
254 254  1. Select object on [Design Area];
255 -1. Hold down the left click and move object to desired position.
281 +1. Hold down the left click and move object to desired position, as shown in Figure 6-8.
256 256  
257 257  (% style="text-align:center" %)
258 258  [[image:V-BOX cloud configuration user manual_html_4a7ca599f8cf89c5.png||height="141" width="200" class="img-thumbnail"]]
259 259  
260 -**Scaling object**
286 +Figure 6 ‑8
261 261  
288 +**Operating procedures of scaling object**
289 +
262 262  1)Select object, the positioning control point would appear around object;
263 263  
264 264  2)Click any control point;
... ... @@ -265,15 +265,17 @@
265 265  
266 266  3)Move point to scale object;
267 267  
268 -**Editing object**
296 +**Operating procedure of editing object**
269 269  
270 270  1)Select object;
271 271  
272 -2)Double-click it to open property window;
300 +2)Double-click it to open property window as Figure 6-9 shows;
273 273  
274 274  (% style="text-align:center" %)
275 275  [[image:V-BOX cloud configuration user manual_html_45a8e3cf3e1113fe.png||height="352" width="600" class="img-thumbnail"]]
276 276  
305 +Figure 6 ‑18
306 +
277 277  3)Edit object settings;
278 278  
279 279  4)Click [Save] to complete operation;
... ... @@ -302,10 +302,10 @@
302 302  * **Picture: **It is used for displaying the picture, support the user defined picture.
303 303  
304 304  (% class="table-bordered" %)
305 -|=(% scope="row" %)**Property**|=**Description**
306 -|=Gallery|Choose the picture from the gallery
307 -|=Angle|Rotation angle (0~~360)
308 -|=Scale|(((
335 +|**Property**|**Description**
336 +|Gallery|Choose the picture from the gallery
337 +|Angle|Rotation angle (0~~360)
338 +|Scale|(((
309 309  Yes: the aspect ratio is fixed
310 310  
311 311  No: the aspect ratio is not fixed
... ... @@ -316,8 +316,11 @@
316 316  (% style="text-align:center" %)
317 317  [[image:V-BOX cloud configuration user manual_html_c84a5d0032df07e2.png||height="420" width="250" class="img-thumbnail"]]
318 318  
349 +Figure 6 ‑11
350 +
319 319  * **Display Frame**
320 320  
353 +(% border="2" %)
321 321  |**Item**|**Description**
322 322  |Monitoring Point|Set operating address for this object (Read and write can be different);
323 323  |Read-write permission|There are three modes for it, users could select according to requirements;
... ... @@ -331,6 +331,7 @@
331 331  Indicator could monitor and display the specified PLC or HMI bit address, and its state changes according to the specified address value.
332 332  
333 333  (((
367 +(% border="2" %)
334 334  |**Items**|**Description**
335 335  |Monitor Point|Set reading address for this object;
336 336  |Status|Set text for every status;
... ... @@ -344,6 +344,7 @@
344 344  Switch could operate the specified PLC or HMI bit address, and its state changes according to the specified address value.
345 345  
346 346  (((
381 +(% border="2" %)
347 347  |**Items**|**Description**
348 348  |Monitor Point|Set operating address for this object (Read and write can be different);
349 349  |Read-write permission|There are three modes for it, users could select according to requirements;
... ... @@ -359,6 +359,7 @@
359 359  Display the value of address in real time using the dashboard.
360 360  
361 361  (((
397 +(% border="2" %)
362 362  |**Items**|**Description**
363 363  |Monitor Point|Set operating address for this object (Read and write can be different);
364 364  |Select|Set dashboard display range, there are two modes, Constant and Variable
... ... @@ -374,6 +374,7 @@
374 374  Use the length or height of the rectangle to reflect the value of reading address so that the value could be visualized.
375 375  
376 376  (((
413 +(% border="2" %)
377 377  |**Items**|**Description**
378 378  |Monitor Point|Set operating address for this object (Read and write can be different);
379 379  |Digit Display|Check it to display digit value on bar;
... ... @@ -390,6 +390,7 @@
390 390  Use the curve to show the trend of the data over time. X-axis is time, Y-axis is variable.
391 391  
392 392  (((
430 +(% border="2" %)
393 393  |**Items**|**Description**
394 394  |Monitor Point|Set operating address for this object (Read and write can be different);
395 395  |Digit Display|Check it to display digit value on bar;
... ... @@ -407,6 +407,7 @@
407 407  This is a flowing animation object, users could set animation trigger condition for it, the monitor point could be both bit address and word address;
408 408  
409 409  (((
448 +(% border="2" %)
410 410  |**Items**|**Description**
411 411  |Border color|Set object background color;
412 412  |Color|Set flowing block color;
... ... @@ -418,6 +418,8 @@
418 418  
419 419  Word address: Set value range;
420 420  )))
460 +
461 +(% border="2" %)
421 421  |Color Block Width|Set flowing block size;
422 422  |Color Block Length|Set flowing block size;
423 423  |Color Block Spacing|Set the spacing between flow blocks;
... ... @@ -435,6 +435,7 @@
435 435  Video object is used for playing the video file provided in the video source.
436 436  
437 437  (((
479 +(% border="2" %)
438 438  |**Items**|**Description**
439 439  |Border color|Set object background color;
440 440  |Color|Set flowing block color;
... ... @@ -446,6 +446,8 @@
446 446  
447 447  Word address: Set value range;
448 448  )))
491 +
492 +(% border="2" %)
449 449  |Color Block Width|Set flowing block size;
450 450  |Color Block Length|Set flowing block size;
451 451  |Color Block Spacing|Set the spacing between flow blocks;
... ... @@ -459,7 +459,8 @@
459 459  The object for link website;
460 460  
461 461  (((
462 -|=**Items**|=**Description**
506 +(% border="2" %)
507 +|**Items**|**Description**
463 463  |Link address|Enter website;
464 464  |Open with|There are two options, user could select open with new window or current window;
465 465  |Select Language|One object could support three language, user could enter text for note object;
... ... @@ -472,7 +472,8 @@
472 472  Function switch is designed to switch screens, and call and close sub screen.
473 473  
474 474  (((
475 -|=**Items**|=**Description**
520 +(% border="2" %)
521 +|**Items**|**Description**
476 476  |Screen|Select the target screen for switch;
477 477  |Sub-screen|There are two options, user could select open with new window or current window;
478 478  |Previous|Switch to the previous screen
... ... @@ -488,7 +488,8 @@
488 488  The combination switch supports the collection of multiple functions onto one object. When the object is pressed, multiple functions are arranged in sequence to meet the special requirements of user.
489 489  
490 490  (((
491 -|=**Items**|=**Description**
537 +(% border="2" %)
538 +|**Items**|**Description**
492 492  |Bit operation|It provides [Bit copy], [Set ON], [Set OFF], [Switch] and [Bit Copy] functions.
493 493  |Word operation|It provides [Word copy], [Word set], [Increase] and [Decrease] functions,
494 494  |Arithmetic|[Add], [Subtract], [Multiply] and [Divide] functions
... ... @@ -504,7 +504,8 @@
504 504  It is used for displaying the time of the V-BOX, when the V-BOX is offline, the time will stay at the time when it is offline.
505 505  
506 506  (((
507 -|=**Items**|=**Description**
554 +(% border="2" %)
555 +|**Items**|**Description**
508 508  |Monitoring box|Link a box for the time part
509 509  |Pattern|Two types, one is digit and the other is clock
510 510  |Format settings|Set format for time and date in digit pattern
... ... @@ -518,7 +518,8 @@
518 518  It is used for display more than one tag value in Bar graph format.
519 519  
520 520  (((
521 -|=**Items**|=**Description**
569 +(% border="2" %)
570 +|**Items**|**Description**
522 522  |Add new group|Maximum is 8, add items for this object, also set colors
523 523  |Add monitoring point|Set read tag for every item,
524 524  |Style|Set object display style such as color, use picture as background or not
... ... @@ -530,7 +530,8 @@
530 530  It is used for display alarm information of V-BOX. It can support current and history alarm.
531 531  
532 532  (((
533 -|=**Items**|=**Description**
582 +(% border="2" %)
583 +|**Items**|**Description**
534 534  |Select box|Link to V-BOX
535 535  |Alarm type|Select current alarm or history alarm or all
536 536  |Start date|Alarm display start date
... ... @@ -547,7 +547,8 @@
547 547  The history trend will display data record with graph. X axis represents as time, and Y axis represents as data.
548 548  
549 549  (((
550 -|=(% colspan="2" %)**Items**|=**Description**
600 +(% border="2" %)
601 +|(% colspan="2" %)**Items**|**Description**
551 551  |(% colspan="2" %)Basic|Set numbers of curve in object and select style for every curves including color, link tag
552 552  |(% rowspan="11" %)Style|Display form|Two type, one is curve, and the other is table
553 553  |Start date|Start date of history data
... ... @@ -568,7 +568,8 @@
568 568  This object is used for calling screens when condition is met.
569 569  
570 570  (((
571 -|=(% colspan="2" %)**Items**|=**Description**
622 +(% border="2" %)
623 +|(% colspan="2" %)**Items**|**Description**
572 572  |(% rowspan="4" %)Basic|Conditional trigger|It provides bit, word condition and unconditional
573 573  |Bind monitoring point|Link to tag for triggering
574 574  |Trigger condition|for bit address, it requires ON or OFF, for word address, different value corresponds to different screens.
... ... @@ -582,7 +582,8 @@
582 582  Display value as ring chart
583 583  
584 584  (((
585 -|=(% colspan="2" %)**Items**|=**Description**
637 +(% border="2" %)
638 +|(% colspan="2" %)**Items**|**Description**
586 586  |(% rowspan="7" %)Basic|Monitor point|Link to tag for data reading
587 587  |Range|Set fixed range or variable range
588 588  |Scales|Set scales such as major and minor numbers, colors and so on
... ... @@ -599,7 +599,8 @@
599 599  Display more than one value in one pie chart
600 600  
601 601  (((
602 -|=(% colspan="2" %)**Items**|=**Description**
655 +(% border="2" %)
656 +|(% colspan="2" %)**Items**|**Description**
603 603  |(% colspan="2" %)Monitor point|Add read addresses, the maximum is 8
604 604  |(% rowspan="3" %)Style|Pattern|Set alarm range and colors
605 605  |Numerical scale|Check it to display value in object
... ... @@ -612,7 +612,8 @@
612 612  The toolbar has the same function as the tool list. (right-click on the canvas to pop up tool list)
613 613  
614 614  (((
615 -|=**Tool**|=**Description**
669 +(% border="2" %)
670 +|**Tool**|**Description**
616 616  |[[image:V-BOX cloud configuration user manual_html_668218d361cc54ba.png||height="21" width="76" class="img-thumbnail"]]|Mouse tool for selecting parts. Hold Ctrl key and click on the part to select multiple parts at the same time.
617 617  |[[image:V-BOX cloud configuration user manual_html_867a000ba1161424.png||height="21" width="69" class="img-thumbnail"]]|Save current canvas
618 618  |[[image:V-BOX cloud configuration user manual_html_f5dbf6b889320d6c.png||height="21" width="81" class="img-thumbnail"]]|Delete the selected parts. Multiple selected parts can be deleted at the same time.