11<template >
22 <div class =" m-2 mb-3 row" >
33 <div class =" row" >
4+ <Transition name =" add-effect" mode =" out-in" >
5+ <div class =" position-relative col-6" >
6+ <div class =" card card-shadow" >
7+ <div class =" card-body" >
8+ <NetworkMap ref =" s7comm_map" :empty_message =" no_transitions_message" :height =" '30vh'"
9+ :page_csrf =" props.context.csrf" :url =" s7comm_map_url" :url_params =" getExtraParameters()"
10+ :map_id =" 's7comm_transition_map'" >
11+ </NetworkMap >
12+ </div >
13+ </div >
14+ </div >
15+ </Transition >
416 <Transition name =" add-effect" mode =" out-in" >
517 <div class =" position-relative col-6" >
618 <BootstrapTable id =" s7comm_bootstrap_table" :columns =" stats_columns" :rows =" stats_rows"
921 </BootstrapTable >
1022 </div >
1123 </Transition >
24+ </div >
25+ <div class =" mt-2 row" >
1226 <Transition name =" add-effect" mode =" out-in" >
1327 <div class =" position-relative col-6" >
14- <TableWithConfig ref =" table_s7comm_function_codes" :table_id =" 's7comm_functions '"
28+ <TableWithConfig ref =" table_s7comm_function_codes" :table_id =" 's7comm_function_codes '"
1529 :showLoading =" true" :f_map_columns =" mapTableColumns" :f_sort_rows =" columnsSorting"
1630 :get_extra_params_obj =" getExtraParameters" >
1731 <template v-slot :custom_header >
2842
2943<script setup>
3044import { ref , onMounted , onBeforeMount , computed } from " vue" ;
45+ import { default as NetworkMap } from " ./network-map.vue" ;
3146import { default as BootstrapTable } from " ./bootstrap-table.vue" ;
3247import { default as sortingFunctions } from " ../utilities/sorting-utils.js" ;
3348import { default as TableWithConfig } from " ./table-with-config.vue" ;
@@ -43,6 +58,8 @@ const table_s7comm_functions = ref(null);
4358const stats_rows = ref ([]);
4459const s7comm_general_stats_url = ' /lua/pro/rest/v2/get/flow/s7comm/general_stats.lua'
4560const no_transitions_message = i18n (' flow_details.s7comm_no_transitions' )
61+ const s7comm_map = ref (null )
62+ const s7comm_map_url = ` ${ http_prefix} /lua/pro/rest/v2/get/flow/s7comm/map.lua`
4663const stats_columns = ref ([{
4764 name: _i18n (" map_page.info" ),
4865 id: " info"
@@ -111,7 +128,7 @@ function print_stats_row(col, row) {
111128
112129function columnsSorting (col , r0 , r1 ) {
113130 if (col != null ) {
114- if (col .id == " s7comm_function " ) {
131+ if (col .id == " s7comm_function_code " ) {
115132 return sortingFunctions .sortByName (r0 .s7comm_function_code , r1 .s7comm_function_code , col .sort );
116133 } else if (col .id == " num_uses" ) {
117134 return sortingFunctions .sortByNumber (r0 .num_uses , r1 .num_uses , col .sort );
@@ -125,7 +142,7 @@ function columnsSorting(col, r0, r1) {
125142
126143const mapTableColumns = (columns ) => {
127144 let map_columns = {
128- " s7comm_function " : (value ) => {
145+ " s7comm_function_code " : (value ) => {
129146 return value;
130147 },
131148 " num_uses " : (value ) => {
0 commit comments