@@ -8,7 +8,14 @@ <h3>{{ labels.TitleForInline }}</h3>
88 < el-input v-model ="FormData.Name "> </ el-input >
99 </ el-form-item >
1010 < el-form-item :label ="labels.Scheme " :rules ="getFieldRules('SchemeCode') " prop ="SchemeCode ">
11- < el-select v-model ="FormData.SchemeCode " :disabled ="readonly " filterable placeholder ="" style ="width: 100%; ">
11+ < el-select
12+ v-model ="FormData.SchemeCode "
13+ :disabled ="readonly "
14+ @change ="onSchemeChange "
15+ filterable
16+ placeholder =""
17+ style ="width: 100%; "
18+ >
1219 < el-option
1320 v-for ="scheme in schemes "
1421 :key ="scheme "
@@ -18,6 +25,146 @@ <h3>{{ labels.TitleForInline }}</h3>
1825 </ el-select >
1926 </ el-form-item >
2027
28+ < div style ="margin-bottom: 10px; ">
29+ < h4 class ="WorkflowDesignerTitleWithCreate Underline ">
30+ {{ labels.InputParameters }}
31+ < a v-if ="!readonly " @click ="addInputParameter() "> {{ ButtonTextCreate }}</ a >
32+ </ h4 >
33+ < table v-if ="inputParameters.length > 0 " class ="WorkflowDesignerTable ">
34+ < tr >
35+ < th > </ th >
36+ < th > {{ labels.Target }}</ th >
37+ < th > {{ labels.Purpose }}</ th >
38+ < th > {{ labels.Expression }}</ th >
39+ </ tr >
40+ < tr
41+ v-for ="(parameter, index) in inputParameters "
42+ :key ="index "
43+ :class ="dragOverIndex == index && dragOverBlock == parameter ? 'dragOver' : '' "
44+ @dragend ="dragend($event) "
45+ @dragover ="dragover(parameter, index, $event) "
46+ @dragstart ="dragstart(index, $event, inputParameters) "
47+ >
48+ < td :draggable ="!readonly " class ='WorkflowDesignerTableMoveCol '>
49+ < div v-if ="!readonly " class ='WorkflowDesignerTableMoveButton '> </ div >
50+ </ td >
51+ < td >
52+ < el-select
53+ v-model ="parameter.Target "
54+ :allow-create ="true "
55+ :disabled ="readonly "
56+ @change ="onInputParameterTargetChange "
57+ :class ="isEmpty(parameter.Target) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
58+ filterable
59+ >
60+ < el-option
61+ v-for ="schemeParameter in inlinedSchemeParameters "
62+ :key ="schemeParameter.Name "
63+ :label ="schemeParameter.Name "
64+ :value ="schemeParameter.Name ">
65+ </ el-option >
66+ </ el-select >
67+ </ td >
68+ < td >
69+ < el-select
70+ v-model ="parameter.Purpose "
71+ :disabled ="readonly || !!findInlinedSchemeParameter(parameter.Target) "
72+ :class ="isEmpty(parameter.Purpose) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
73+ filterable
74+ >
75+ < el-option key ="Temporary " :label ="!!findInlinedSchemeParameter(parameter.Target) ? 'Predefined' : 'Temporary' " value ="Temporary "> </ el-option >
76+ < el-option key ="Persistent " label ="Persistence " value ="Persistence "> </ el-option >
77+ </ el-select >
78+ </ td >
79+ < td >
80+ < el-input
81+ v-model ="parameter.Expression "
82+ :readonly ="readonly "
83+ :class ="isEmpty(parameter.Expression) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
84+ > </ el-input >
85+ </ td >
86+ < td v-if ="!readonly " class ="WorkflowDesignerTableEditButtons Double ">
87+ < el-button-group >
88+ < el-button
89+ :class ="'WorkflowDesignerTableCodeActionsButton ' + (editingParameter == parameter ? 'is-active' : '') "
90+ @click ="showExpressionEditor(parameter) "> </ el-button >
91+ < el-button class ="WorkflowDesignerTableDeleteButton " @click ="removeItem(inputParameters, index) "> </ el-button >
92+ </ el-button-group >
93+ </ td >
94+ </ tr >
95+ </ table >
96+ </ div >
97+
98+ < div style ="margin-bottom: 10px; ">
99+ < h4 class ="WorkflowDesignerTitleWithCreate Underline ">
100+ {{ labels.OutputParameters }}
101+ < a v-if ="!readonly " @click ="addOutputParameter() "> {{ ButtonTextCreate }}</ a >
102+ </ h4 >
103+ < table v-if ="outputParameters.length > 0 " class ="WorkflowDesignerTable ">
104+ < tr >
105+ < th > </ th >
106+ < th > {{ labels.Target }}</ th >
107+ < th > {{ labels.Purpose }}</ th >
108+ < th > {{ labels.Expression }}</ th >
109+ </ tr >
110+ < tr
111+ v-for ="(parameter, index) in outputParameters "
112+ :key ="index "
113+ :class ="dragOverIndex == index && dragOverBlock == parameter ? 'dragOver' : '' "
114+ @dragend ="dragend($event) "
115+ @dragover ="dragover(parameter, index, $event) "
116+ @dragstart ="dragstart(index, $event, outputParameters) "
117+ >
118+ < td :draggable ="!readonly " class ='WorkflowDesignerTableMoveCol '>
119+ < div v-if ="!readonly " class ='WorkflowDesignerTableMoveButton '> </ div >
120+ </ td >
121+ < td >
122+ < el-select
123+ v-model ="parameter.Target "
124+ :allow-create ="true "
125+ :disabled ="readonly "
126+ @change ="onOutputParameterTargetChange "
127+ :class ="isEmpty(parameter.Target) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
128+ filterable
129+ >
130+ < el-option
131+ v-for ="schemeParameter in schemeParameters "
132+ :key ="schemeParameter.Name "
133+ :label ="schemeParameter.Name "
134+ :value ="schemeParameter.Name ">
135+ </ el-option >
136+ </ el-select >
137+ </ td >
138+ < td >
139+ < el-select
140+ v-model ="parameter.Purpose "
141+ :disabled ="readonly || !!findSchemeParameter(parameter.Target) "
142+ :class ="isEmpty(parameter.Purpose) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
143+ filterable
144+ >
145+ < el-option key ="Temporary " :label ="!!findSchemeParameter(parameter.Target) ? 'Predefined' : 'Temporary' " value ="Temporary "> </ el-option >
146+ < el-option key ="Persistence " label ="Persistence " value ="Persistence "> </ el-option >
147+ </ el-select >
148+ </ td >
149+ < td >
150+ < el-input
151+ v-model ="parameter.Expression "
152+ :readonly ="readonly "
153+ :class ="isEmpty(parameter.Expression) && saveTriggered ? 'WorkflowDesignerInputError' : '' "
154+ > </ el-input >
155+ </ td >
156+ < td v-if ="!readonly " class ="WorkflowDesignerTableEditButtons Double ">
157+ < el-button-group >
158+ < el-button
159+ :class ="'WorkflowDesignerTableCodeActionsButton ' + (editingParameter == parameter ? 'is-active' : '') "
160+ @click ="showExpressionEditor(parameter) "> </ el-button >
161+ < el-button class ="WorkflowDesignerTableDeleteButton " @click ="removeItem(outputParameters, index) "> </ el-button >
162+ </ el-button-group >
163+ </ td >
164+ </ tr >
165+ </ table >
166+ </ div >
167+
21168 < el-button v-if ="!readonly && !itemHasComment " circle icon ="el-icon-s-comment " @click ="showUserComment() "> </ el-button >
22169 < el-form-item v-if ="itemHasComment " :label ="labels.UserComment ">
23170 < el-input
@@ -42,6 +189,13 @@ <h3>{{ labels.TitleForInline }}</h3>
42189 labels : WorkflowDesignerConstants . ActivityFormLabel ,
43190 ButtonTextSave : WorkflowDesignerConstants . ButtonTextSave ,
44191 ButtonTextCancel : WorkflowDesignerConstants . ButtonTextCancel ,
192+ ButtonTextCreate : WorkflowDesignerConstants . ButtonTextCreate ,
193+ inputParameters : [ ] , //: ParameterMapping[]
194+ outputParameters : [ ] , //: ParameterMapping[],
195+ inlinedSchemeParameters : [ ] , //: ParameterDefinition[]
196+ schemeParameters : [ ] , //: ParameterDefinition[]
197+ editingParameter : null , //: ParameterMapping | null
198+ saveTriggered : false , //: boolean
45199 } ) ;
46200 }
47201
@@ -53,13 +207,38 @@ <h3>{{ labels.TitleForInline }}</h3>
53207 FormData : { }
54208 } ) ;
55209
210+ var INPUT_PARAMETERS_ANNOTATION = '__inputParameters' ;
211+ var OUTPUT_PARAMETERS_ANNOTATION = '__outputParameters' ;
212+
56213 me . VueConfig . methods . onUpdate = function ( item ) {
57214 me . VueConfig . data . originalItem = item ;
58215 me . VueConfig . data . FormData . Name = item . Name ;
59216 me . VueConfig . data . FormData . SchemeCode = item . SchemeCode ;
217+ me . VueConfig . data . FormData . Annotations = item . Annotations || [ ] ;
60218 me . VueConfig . data . schemes = me . graph . data . AdditionalParams . InlinedSchemeCodes ;
219+
220+ if ( ! ! item . SchemeCode ) {
221+ me . VueConfig . data . inlinedSchemeParameters = me . graph . data . AdditionalParams . InlinedSchemeParameters [ item . SchemeCode ] . map ( parameter => new ParameterDefinition ( parameter ) ) ;
222+ }
223+
224+ me . VueConfig . data . schemeParameters = me . graph . data . Parameters
225+ . filter ( parameter => parameter . Purpose !== 'System' )
226+ . map ( parameter => new ParameterDefinition ( parameter ) ) ;
227+
61228 me . VueConfig . data . itemHasComment = item . UserComment != null && item . UserComment . length > 0 ;
62229
230+ if ( Array . isArray ( item . Annotations ) ) {
231+ item . Annotations . forEach ( function ( annotation ) {
232+ if ( annotation . Name === INPUT_PARAMETERS_ANNOTATION ) {
233+ var inputParameters = JSON . parse ( annotation . JsonValue ) ;
234+ me . VueConfig . data . inputParameters = inputParameters . map ( json => new ParameterMapping ( json ) ) ;
235+ } else if ( annotation . Name === OUTPUT_PARAMETERS_ANNOTATION ) {
236+ var outputParameters = JSON . parse ( annotation . JsonValue ) ;
237+ me . VueConfig . data . outputParameters = outputParameters . map ( json => new ParameterMapping ( json ) ) ;
238+ }
239+ } ) ;
240+ }
241+
63242 me . VueConfig . data . readonly = me . graph . Settings . readonly ;
64243 } ;
65244
@@ -87,15 +266,49 @@ <h3>{{ labels.TitleForInline }}</h3>
87266 return res ;
88267 } ;
89268
269+ function validateParameterMapping ( parameter /*: ParameterMapping*/ ) /*: boolean*/ {
270+ return ! ! parameter . Target && ! ! parameter . Expression && ! ! parameter . Purpose ;
271+ }
272+
90273 me . VueConfig . methods . onSave = function ( ) {
274+ me . VueConfig . data . saveTriggered = true ;
275+
91276 if ( this . $refs && this . $refs . form ) {
92277 this . $refs . form . validate ( function ( valid ) {
93278 if ( valid ) {
279+ if ( me . VueConfig . data . inputParameters . some ( parameter => ! validateParameterMapping ( parameter ) ) ) return ;
280+ if ( me . VueConfig . data . outputParameters . some ( parameter => ! validateParameterMapping ( parameter ) ) ) return ;
281+
282+ var annotations = me . VueConfig . data . FormData . Annotations ;
283+
284+ var inputParametersAnnotation = annotations . find ( annotation => annotation . Name === INPUT_PARAMETERS_ANNOTATION ) ;
285+
286+ if ( ! inputParametersAnnotation ) {
287+ inputParametersAnnotation = {
288+ Name : INPUT_PARAMETERS_ANNOTATION ,
289+ JsonValue : JSON . stringify ( me . VueConfig . data . inputParameters )
290+ } ;
291+ annotations . push ( inputParametersAnnotation ) ;
292+ } else {
293+ inputParametersAnnotation . JsonValue = JSON . stringify ( me . VueConfig . data . inputParameters ) ;
294+ }
295+
296+ var outputParametersAnnotation = annotations . find ( annotation => annotation . Name === OUTPUT_PARAMETERS_ANNOTATION ) ;
297+
298+ if ( ! outputParametersAnnotation ) {
299+ outputParametersAnnotation = {
300+ Name : OUTPUT_PARAMETERS_ANNOTATION ,
301+ JsonValue : JSON . stringify ( me . VueConfig . data . outputParameters )
302+ } ;
303+ annotations . push ( outputParametersAnnotation ) ;
304+ } else {
305+ outputParametersAnnotation . JsonValue = JSON . stringify ( me . VueConfig . data . outputParameters ) ;
306+ }
307+
94308 me . onSuccess ( me . VueConfig . data . FormData ) ;
95309 me . onClose ( true ) ;
96310 }
97311 } ) ;
98-
99312 }
100313 } ;
101314
@@ -123,6 +336,102 @@ <h3>{{ labels.TitleForInline }}</h3>
123336 me . onClose ( true ) ;
124337 } ;
125338
339+ me . VueConfig . methods . showExpressionEditor = function ( parameter /*:ParameterMapping */ ) {
340+ me . VueConfig . data . editingParameter = parameter ;
341+ me . editItem = parameter ;
342+
343+ var onSuccess = function ( value ) {
344+ if ( me . editItem ) {
345+ me . editItem . Expression = value ;
346+ me . VueConfig . data . editingParameter = null ;
347+ delete me . editItem ;
348+ }
349+ } ;
350+
351+ var onClose = function ( value ) {
352+ me . VueConfig . data . editingParameter = null ;
353+ } ;
354+
355+ me . VueConfig . data . jsonform = me . showjson ( parameter . Expression , { expression : true , expressiontype : 'object' } , onSuccess , onClose ) ;
356+ } ;
357+
358+ class ParameterDefinition {
359+ Name //: string;
360+ Purpose //: 'Temporary' | 'Persistent';
361+ constructor ( data ) {
362+ if ( data ) {
363+ Object . assign ( this , data ) ;
364+ }
365+ }
366+ }
367+
368+ me . VueConfig . methods . onSchemeChange = function ( schemeCode /*: string*/ ) {
369+ if ( schemeCode ) {
370+ me . VueConfig . data . inlinedSchemeParameters = me . graph . data . AdditionalParams . InlinedSchemeParameters [ schemeCode ] . map ( parameter => new ParameterDefinition ( parameter ) ) ;
371+ } else {
372+ me . VueConfig . data . inlinedSchemeParameters = [ ] ;
373+ }
374+
375+ for ( var inputParameter of me . VueConfig . data . inputParameters ) {
376+ me . VueConfig . methods . onInputParameterTargetChange ( inputParameter . Target ) ;
377+ }
378+ } ;
379+
380+ me . VueConfig . methods . findInlinedSchemeParameter = function ( name /*: string*/ ) /*: ParameterDefinition | undefined*/ {
381+ return me . VueConfig . data . inlinedSchemeParameters . find ( parameter => parameter . Name === name ) ;
382+ } ;
383+
384+ me . VueConfig . methods . findSchemeParameter = function ( name /*: string*/ ) /*: ParameterDefinition | undefined*/ {
385+ return me . VueConfig . data . schemeParameters . find ( parameter => parameter . Name === name ) ;
386+ } ;
387+
388+ me . VueConfig . methods . onInputParameterTargetChange = function ( target /*: string*/ ) {
389+ var schemeParameter = me . VueConfig . methods . findInlinedSchemeParameter ( target ) ;
390+ if ( schemeParameter ) {
391+ var parameter = me . VueConfig . data . inputParameters . find ( parameter => parameter . Target === target ) ;
392+ if ( parameter ) {
393+ parameter . Purpose = 'Temporary' ;
394+ }
395+ }
396+ } ;
397+
398+ me . VueConfig . methods . onOutputParameterTargetChange = function ( target /*: string*/ ) {
399+ var schemeParameter = me . VueConfig . methods . findSchemeParameter ( target ) ;
400+ if ( schemeParameter ) {
401+ var parameter = me . VueConfig . data . outputParameters . find ( parameter => parameter . Target === target ) ;
402+ if ( parameter ) {
403+ parameter . Purpose = 'Temporary' ;
404+ }
405+ }
406+ } ;
407+
408+ class ParameterMapping {
409+ Target = '' //: string;
410+ Purpose = 'Temporary' //: 'Temporary' | 'Persistent';
411+ Expression = '' //: string;
412+ constructor ( data ) {
413+ if ( data ) {
414+ Object . assign ( this , data ) ;
415+ }
416+ }
417+ }
418+
419+ me . VueConfig . methods . isEmpty = function ( input /*: string | null| undefined*/ ) {
420+ return ! input ;
421+ }
422+
423+ me . VueConfig . methods . removeItem = function ( items , index ) {
424+ items . splice ( index , 1 ) ;
425+ } ;
426+
427+ me . VueConfig . methods . addInputParameter = function ( ) {
428+ me . VueConfig . data . inputParameters . push ( new ParameterMapping ( ) ) ;
429+ } ;
430+
431+ me . VueConfig . methods . addOutputParameter = function ( ) {
432+ me . VueConfig . data . outputParameters . push ( new ParameterMapping ( ) ) ;
433+ } ;
434+
126435 me . showConfirm = function ( ) {
127436 me . VueConfig . methods . showConfirm ( {
128437 title : WorkflowDesignerConstants . DialogConfirmText ,
0 commit comments