workflow-editor 0.9.68-pv → 0.9.68
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/workflow-editor.css +1 -1
- package/lib/workflow-editor.umd.min.js +8 -8
- package/package.json +2 -2
- package/packages/plugins/formValidatorUtil.js +6 -1
- package/packages/workflow-editor/src/json-object-templates/auto-task.js +70 -0
- package/packages/workflow-editor/src/json-object-templates/copy-task.js +5 -0
- package/packages/workflow-editor/src/json-object-templates/subprocess.js +2 -1
- package/packages/workflow-editor/src/main/canvas.vue +5 -1
- package/packages/workflow-editor/src/main/wf-history-canvas.vue +3 -1
- package/packages/workflow-editor/src/process-json.js +2 -1
- package/packages/workflow-editor/src/process-service.js +2 -2
- package/packages/workflow-editor/src/properties-editors/auto-task/basic-properties.vue +81 -0
- package/packages/workflow-editor/src/properties-editors/auto-task/permission-settings.vue +155 -0
- package/packages/workflow-editor/src/properties-editors/auto-task.vue +73 -0
- package/packages/workflow-editor/src/properties-editors/common/additional-condition-utils.js +36 -11
- package/packages/workflow-editor/src/properties-editors/common/form-fields-utils.js +1 -1
- package/packages/workflow-editor/src/properties-editors/common/notice-reminder.vue +1 -1
- package/packages/workflow-editor/src/properties-editors/common/transactor-settings.vue +51 -9
- package/packages/workflow-editor/src/properties-editors/copy-task.vue +15 -1
- package/packages/workflow-editor/src/properties-editors/human-task/basic-properties.vue +5 -1
- package/packages/workflow-editor/src/properties-editors/human-task.vue +2 -2
- package/packages/workflow-editor/src/properties-editors/process/basic-properties.vue +9 -62
- package/packages/workflow-editor/src/properties-editors/process/selectPage.vue +1 -8
- package/packages/workflow-editor/src/properties-editors/subprocess/basic-properties.vue +18 -6
- package/packages/workflow-editor/src/properties-editors/user-condition.js +7 -1
- package/packages/workflow-editor/src/store/getters.js +1 -2
- package/packages/workflow-editor/src/store/workflow-editor.js +0 -3
- package/packages/workflow-editor/src/taches/auto-task.vue +99 -0
- package/packages/workflow-editor/src/util.js +32 -36
- package/packages/workflow-editor/src/workflow-editor.vue +8 -27
- package/src/i18n/langs/cn.js +32 -23
- package/src/i18n/langs/en.js +8 -2
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
|
|
2
2
|
import { getLanguageWithLocale } from 'imatrix-ui/src/utils/util'
|
|
3
|
+
import i18n from '../../../src/i18n/i18n'
|
|
4
|
+
import newAutoTask from './json-object-templates/auto-task'
|
|
5
|
+
import newCopyTask from './json-object-templates/copy-task'
|
|
6
|
+
import newDecision from './json-object-templates/decision'
|
|
7
|
+
import newEnd from './json-object-templates/end'
|
|
8
|
+
import newFork from './json-object-templates/fork'
|
|
9
|
+
import newHumanDecision from './json-object-templates/human-decision'
|
|
10
|
+
import newHumanTask from './json-object-templates/human-task'
|
|
11
|
+
import newJoin from './json-object-templates/join'
|
|
12
|
+
import newProcess from './json-object-templates/process'
|
|
13
|
+
import newStart from './json-object-templates/start'
|
|
14
|
+
import newSubprocess from './json-object-templates/subprocess'
|
|
15
|
+
import newTransition from './json-object-templates/transition'
|
|
3
16
|
function getStore() {
|
|
4
17
|
return window.$store
|
|
5
18
|
}
|
|
@@ -92,6 +105,16 @@ export function getComponentList() {
|
|
|
92
105
|
height: 40,
|
|
93
106
|
color: '#0777D4'
|
|
94
107
|
},
|
|
108
|
+
{
|
|
109
|
+
name: 'AutoTask',
|
|
110
|
+
label: getI18n().t('workflowEditor.task.autoTask'),
|
|
111
|
+
icon: 'human-task',
|
|
112
|
+
type: '',
|
|
113
|
+
round: false,
|
|
114
|
+
width: 80,
|
|
115
|
+
height: 40,
|
|
116
|
+
color: '#0777D4'
|
|
117
|
+
},
|
|
95
118
|
{
|
|
96
119
|
name: 'End',
|
|
97
120
|
label: getI18n().t('workflowEditor.task.end'),
|
|
@@ -269,7 +292,7 @@ function clearAllSelectedComponents() {
|
|
|
269
292
|
*/
|
|
270
293
|
function removeTextProperty(obj) {
|
|
271
294
|
const keys = Object.getOwnPropertyNames(obj)
|
|
272
|
-
keys.forEach(function(key) {
|
|
295
|
+
keys.forEach(function (key) {
|
|
273
296
|
if (typeof obj[key] === 'object') {
|
|
274
297
|
if (obj[key]._text !== undefined) {
|
|
275
298
|
obj[key] = obj[key]._text
|
|
@@ -290,7 +313,7 @@ function removeTextProperty(obj) {
|
|
|
290
313
|
})
|
|
291
314
|
}
|
|
292
315
|
function generateTaches(type, arr) {
|
|
293
|
-
if (!arr)arr = []
|
|
316
|
+
if (!arr) arr = []
|
|
294
317
|
if (!Array.isArray(arr)) {
|
|
295
318
|
arr = [arr]
|
|
296
319
|
}
|
|
@@ -312,7 +335,7 @@ function generateTaches(type, arr) {
|
|
|
312
335
|
}
|
|
313
336
|
}
|
|
314
337
|
function generateTransitions(type, arr) {
|
|
315
|
-
if (!arr)arr = []
|
|
338
|
+
if (!arr) arr = []
|
|
316
339
|
if (!Array.isArray(arr)) {
|
|
317
340
|
arr = [arr]
|
|
318
341
|
}
|
|
@@ -361,6 +384,7 @@ function initializeProcessData(process) {
|
|
|
361
384
|
generateTaches('Subprocess', process.subprocess)
|
|
362
385
|
generateTaches('HumanDecision', process.humanDecision)
|
|
363
386
|
generateTaches('CopyTask', process.copyTask)
|
|
387
|
+
generateTaches('AutoTask', process.autoTask)
|
|
364
388
|
generateTaches('Start', process.start)
|
|
365
389
|
generateTaches('End', process.end)
|
|
366
390
|
generateTransitions('Transition', process.transition)
|
|
@@ -442,39 +466,9 @@ function watchShowName(vm, newVal) {
|
|
|
442
466
|
return showName
|
|
443
467
|
}
|
|
444
468
|
export {
|
|
445
|
-
getComponentInfo,
|
|
446
|
-
|
|
447
|
-
getMousePosition,
|
|
448
|
-
getClientMousePosition,
|
|
449
|
-
getMouseOffset,
|
|
450
|
-
getVirtualRegion,
|
|
451
|
-
getRealRegion,
|
|
452
|
-
startDragTache,
|
|
453
|
-
endDragTache,
|
|
454
|
-
clearAllSelectedComponents,
|
|
455
|
-
removeTextProperty,
|
|
456
|
-
initializeProcessData,
|
|
457
|
-
findOutgoingTransitionsByTacheId,
|
|
458
|
-
findIncomingTransitionsByTacheId,
|
|
459
|
-
findTacheById,
|
|
460
|
-
deepCopy,
|
|
461
|
-
updateTransitionsWhenTacheIdChanged,
|
|
462
|
-
validateTacheCode,
|
|
463
|
-
getI18n,
|
|
464
|
-
watchShowName
|
|
469
|
+
clearAllSelectedComponents, deepCopy, endDragTache, findIncomingTransitionsByTacheId, findOutgoingTransitionsByTacheId, findTacheById, getClientMousePosition, getComponentInfo, getI18n, getJoint, getMouseOffset, getMousePosition, getRealRegion, getVirtualRegion, initializeProcessData, removeTextProperty, startDragTache, updateTransitionsWhenTacheIdChanged,
|
|
470
|
+
validateTacheCode, watchShowName
|
|
465
471
|
}
|
|
466
|
-
import newProcess from './json-object-templates/process'
|
|
467
|
-
import newHumanTask from './json-object-templates/human-task'
|
|
468
|
-
import newDecision from './json-object-templates/decision'
|
|
469
|
-
import newStart from './json-object-templates/start'
|
|
470
|
-
import newEnd from './json-object-templates/end'
|
|
471
|
-
import newTransition from './json-object-templates/transition'
|
|
472
|
-
import newSubprocess from './json-object-templates/subprocess'
|
|
473
|
-
import newFork from './json-object-templates/fork'
|
|
474
|
-
import newJoin from './json-object-templates/join'
|
|
475
|
-
import newHumanDecision from './json-object-templates/human-decision'
|
|
476
|
-
import i18n from '../../../src/i18n/i18n'
|
|
477
|
-
import newCopyTask from './json-object-templates/copy-task'
|
|
478
472
|
|
|
479
473
|
const processTemplate = {
|
|
480
474
|
newProcess,
|
|
@@ -487,7 +481,9 @@ const processTemplate = {
|
|
|
487
481
|
newFork,
|
|
488
482
|
newJoin,
|
|
489
483
|
newHumanDecision,
|
|
490
|
-
newCopyTask
|
|
484
|
+
newCopyTask,
|
|
485
|
+
newAutoTask
|
|
491
486
|
}
|
|
492
487
|
|
|
493
488
|
export { processTemplate }
|
|
489
|
+
|
|
@@ -99,7 +99,6 @@ import processService from './process-service'
|
|
|
99
99
|
import FileSaver from 'file-saver'
|
|
100
100
|
import Prism from 'prismjs'
|
|
101
101
|
import AdminSaveDialog from './main/admin-save-dialog'
|
|
102
|
-
import authApi from 'imatrix-ui/src/utils/auth-api'
|
|
103
102
|
export default {
|
|
104
103
|
name: 'WorkflowEditor',
|
|
105
104
|
components: {
|
|
@@ -128,16 +127,6 @@ export default {
|
|
|
128
127
|
readonly: {
|
|
129
128
|
type: Boolean,
|
|
130
129
|
default: false
|
|
131
|
-
},
|
|
132
|
-
// 系统编码,新增时选中的系统编码,或修改时流程定义所属的系统编码
|
|
133
|
-
systemCode: {
|
|
134
|
-
type: String,
|
|
135
|
-
default: null
|
|
136
|
-
},
|
|
137
|
-
// 系统版本号,修改时流程定义中的系统版本号,例如:v1.0.0,新增不会使用该属性
|
|
138
|
-
systemPublishVersion: {
|
|
139
|
-
type: Number,
|
|
140
|
-
default: null
|
|
141
130
|
}
|
|
142
131
|
},
|
|
143
132
|
data: function() {
|
|
@@ -154,7 +143,7 @@ export default {
|
|
|
154
143
|
},
|
|
155
144
|
computed: {
|
|
156
145
|
...mapGetters(
|
|
157
|
-
'wfEditor', ['componentToDraw', 'taches', 'transitions', 'contextMenuVisible'
|
|
146
|
+
'wfEditor', ['componentToDraw', 'taches', 'transitions', 'contextMenuVisible']
|
|
158
147
|
),
|
|
159
148
|
...mapGetters([
|
|
160
149
|
'sidebar'
|
|
@@ -174,10 +163,6 @@ export default {
|
|
|
174
163
|
}
|
|
175
164
|
},
|
|
176
165
|
created: function() {
|
|
177
|
-
authApi.setSessionCache('wf_editor_systemVersion', this.systemPublishVersion)
|
|
178
|
-
if (this.systemCode) {
|
|
179
|
-
this.setSystemCode(this.systemCode)
|
|
180
|
-
}
|
|
181
166
|
// 打开或新建流程图时先清空画布,开发过程中代码热更新的时候可以避免节点重复
|
|
182
167
|
this.clearCanvas()
|
|
183
168
|
if (this.id) {
|
|
@@ -196,6 +181,7 @@ export default {
|
|
|
196
181
|
}
|
|
197
182
|
},
|
|
198
183
|
mounted: function() {
|
|
184
|
+
|
|
199
185
|
},
|
|
200
186
|
methods: {
|
|
201
187
|
...mapMutations('wfEditor', [
|
|
@@ -203,7 +189,6 @@ export default {
|
|
|
203
189
|
'clearCanvas',
|
|
204
190
|
'setContextMenuVisible',
|
|
205
191
|
'setSystemCode',
|
|
206
|
-
'setSystemVersion',
|
|
207
192
|
'setProcessCode'
|
|
208
193
|
]),
|
|
209
194
|
showContextMenu(event) {
|
|
@@ -223,9 +208,6 @@ export default {
|
|
|
223
208
|
this.process = processObj.process
|
|
224
209
|
if (this.process && this.process.properties && this.process.properties.basicProperties) {
|
|
225
210
|
this.setSystemCode(this.process.properties.basicProperties.systemCode)
|
|
226
|
-
} else {
|
|
227
|
-
// 新增时,将传过来的系统编码缓存起来
|
|
228
|
-
this.setSystemCode(this.systemCode)
|
|
229
211
|
}
|
|
230
212
|
if (this.process && this.process.attr) {
|
|
231
213
|
this.setProcessCode(this.process.attr.code)
|
|
@@ -241,7 +223,7 @@ export default {
|
|
|
241
223
|
const formVersion = processProperties.formVersion
|
|
242
224
|
if (formCode && formCode !== '' && formVersion) {
|
|
243
225
|
// 取出formFields放到vuex中
|
|
244
|
-
processService.fetchFormFields(processProperties.formCode, processProperties.formVersion
|
|
226
|
+
processService.fetchFormFields(processProperties.formCode, processProperties.formVersion)
|
|
245
227
|
}
|
|
246
228
|
},
|
|
247
229
|
packageUrlParam(url) {
|
|
@@ -264,6 +246,7 @@ export default {
|
|
|
264
246
|
subprocess: [],
|
|
265
247
|
humanDecision: [],
|
|
266
248
|
copyTask: [],
|
|
249
|
+
autoTask: [],
|
|
267
250
|
end: []
|
|
268
251
|
}
|
|
269
252
|
process.attr = this.process.attr
|
|
@@ -319,8 +302,7 @@ export default {
|
|
|
319
302
|
} else {
|
|
320
303
|
// 表示新建
|
|
321
304
|
const param = {
|
|
322
|
-
xml: xml
|
|
323
|
-
publishVersion: this.systemPublishVersion
|
|
305
|
+
xml: xml
|
|
324
306
|
}
|
|
325
307
|
this.$http.post(this.baseAPI + '/wf-editor/workflow-definitions', param).then(definition => {
|
|
326
308
|
this.definitionId = definition.id
|
|
@@ -342,8 +324,7 @@ export default {
|
|
|
342
324
|
},
|
|
343
325
|
packageSaveXmlParam(xml) {
|
|
344
326
|
const param = {
|
|
345
|
-
xml: xml
|
|
346
|
-
publishVersion: this.systemPublishVersion
|
|
327
|
+
xml: xml
|
|
347
328
|
}
|
|
348
329
|
if (this.definitionId) {
|
|
349
330
|
// 表示已保存过,新流程定义的id
|
|
@@ -392,8 +373,7 @@ export default {
|
|
|
392
373
|
} else {
|
|
393
374
|
// 表示新建
|
|
394
375
|
const param = {
|
|
395
|
-
xml: xml
|
|
396
|
-
publishVersion: this.systemPublishVersion
|
|
376
|
+
xml: xml
|
|
397
377
|
}
|
|
398
378
|
this.$http.post(this.baseAPI + '/wf-editor/workflow-definitions', param).then(definition => {
|
|
399
379
|
this.definitionId = definition.id
|
|
@@ -598,6 +578,7 @@ section{
|
|
|
598
578
|
height: calc(100% - #{$tabsHeaderHeight});
|
|
599
579
|
padding:10px;
|
|
600
580
|
width:100%;
|
|
581
|
+
box-sizing: border-box;
|
|
601
582
|
}
|
|
602
583
|
|
|
603
584
|
.canvas,.xml{
|
package/src/i18n/langs/cn.js
CHANGED
|
@@ -30,7 +30,7 @@ const cn = {
|
|
|
30
30
|
i18nEn: '英文',
|
|
31
31
|
i18nKey: '国际化key',
|
|
32
32
|
subprocessTitle: '子流程流转历史',
|
|
33
|
-
custom:'自定义'
|
|
33
|
+
custom: '自定义'
|
|
34
34
|
},
|
|
35
35
|
workflowEditorMessage: {
|
|
36
36
|
requiredAndMustBeADate: '必填且必须为日期',
|
|
@@ -139,22 +139,22 @@ const cn = {
|
|
|
139
139
|
variableName: '变量名',
|
|
140
140
|
variableValue: '变量值',
|
|
141
141
|
selectField: '选择字段',
|
|
142
|
-
taskNotice:'待办通知',
|
|
143
|
-
reminderNotice:'催办通知',
|
|
144
|
-
customMsg:'自定义消息内容'
|
|
142
|
+
taskNotice: '待办通知',
|
|
143
|
+
reminderNotice: '催办通知',
|
|
144
|
+
customMsg: '自定义消息内容'
|
|
145
145
|
},
|
|
146
146
|
// 流程属性
|
|
147
147
|
process: {
|
|
148
|
-
processInitiator: '
|
|
149
|
-
processInitiatorRole: '
|
|
150
|
-
processInitiatorDepartment: '
|
|
151
|
-
processInitiatorSuperiorDepartment: '
|
|
152
|
-
processInitiatorTopDepartment: '
|
|
153
|
-
processInitiatorWorkingGroup: '
|
|
154
|
-
nameOfTheDirectSuperiorOfTheProcessInitiator: '
|
|
155
|
-
processInitiatorsDirectSuperiorDepartment: '
|
|
156
|
-
directSuperiorRoleOfProcessInitiator: '
|
|
157
|
-
ProcessInitiatorsImmediateSuperiorWorkingGroup: '
|
|
148
|
+
processInitiator: '起草人',
|
|
149
|
+
processInitiatorRole: '起草人角色',
|
|
150
|
+
processInitiatorDepartment: '起草人部门',
|
|
151
|
+
processInitiatorSuperiorDepartment: '起草人上级部门',
|
|
152
|
+
processInitiatorTopDepartment: '起草人顶级部门',
|
|
153
|
+
processInitiatorWorkingGroup: '起草人工作组',
|
|
154
|
+
nameOfTheDirectSuperiorOfTheProcessInitiator: '起草人直属上级姓名',
|
|
155
|
+
processInitiatorsDirectSuperiorDepartment: '起草人直属上级部门',
|
|
156
|
+
directSuperiorRoleOfProcessInitiator: '起草人直属上级角色',
|
|
157
|
+
ProcessInitiatorsImmediateSuperiorWorkingGroup: '起草人直属上级工作组',
|
|
158
158
|
nameOfCurrentHandler: '当前办理人姓名',
|
|
159
159
|
currentHandlerRole: '当前办理人角色',
|
|
160
160
|
currentHandlerDepartment: '当前办理人部门',
|
|
@@ -225,8 +225,8 @@ const cn = {
|
|
|
225
225
|
personSpecifiedInFormField: '表单字段中指定的人员',
|
|
226
226
|
filterByCriteria: '按条件筛选',
|
|
227
227
|
additionalConditions: '附加条件',
|
|
228
|
-
handlingYyThePersonnelOfTheDepartmentOfTheInitiator: '
|
|
229
|
-
personnelOfTheDepartmentWhereTheInitiatorWorksParticipateInTheHandling: '
|
|
228
|
+
handlingYyThePersonnelOfTheDepartmentOfTheInitiator: '起草人所在部门人员办理',
|
|
229
|
+
personnelOfTheDepartmentWhereTheInitiatorWorksParticipateInTheHandling: '起草人所在部门人员参与办理',
|
|
230
230
|
selectSpecificHandler: '选择具体办理人',
|
|
231
231
|
selectOneFromDept: '同一部门仅需一人办理',
|
|
232
232
|
generateOneInstanceFromDept: '同一部门生成一个实例',
|
|
@@ -302,11 +302,11 @@ const cn = {
|
|
|
302
302
|
propertiesOfSubprocesses: '子流程的属性',
|
|
303
303
|
settingOfHandler: '办理人设置',
|
|
304
304
|
eventProcessing: '事件处理',
|
|
305
|
-
sponsorsImmediateSuperior: '发起人直属上级
|
|
306
|
-
sponsorsSuperiorDepartment: '
|
|
307
|
-
sponsorTopDepartment: '
|
|
308
|
-
superiorDepartmentDirectlyUnderTheInitiator: '
|
|
309
|
-
sponsorsImmediateSuperiorWorkingGroup: '
|
|
305
|
+
sponsorsImmediateSuperior: '起草人部门负责人',// 发起人直属上级
|
|
306
|
+
sponsorsSuperiorDepartment: '起草人上级部门',
|
|
307
|
+
sponsorTopDepartment: '起草人顶级部门',
|
|
308
|
+
superiorDepartmentDirectlyUnderTheInitiator: '起草人直属上级部门',
|
|
309
|
+
sponsorsImmediateSuperiorWorkingGroup: '起草人直属上级工作组',
|
|
310
310
|
lastLinkHandlerDepartment: '上一环节办理人部门',
|
|
311
311
|
previousLinkHandlerSuperiorDepartment: '上一环节办理人上级部门',
|
|
312
312
|
topDepartmentOfHandlerInThePreviousLink: '上一环节办理人顶级部门',
|
|
@@ -321,7 +321,12 @@ const cn = {
|
|
|
321
321
|
defaultMailTemplate: '默认邮件模板',
|
|
322
322
|
trustTask: '委托任务',
|
|
323
323
|
subprocessIsSharedForm: '主子流程共用表单',
|
|
324
|
-
|
|
324
|
+
generateForParttimeDept: '为兼职部门人员生成任务',
|
|
325
|
+
deptSpecifiedInFormField: '表单字段中指定的部门',
|
|
326
|
+
activateOneVoteVeto: '一票否决',
|
|
327
|
+
deptApprover: '起草人部门授权审批人',
|
|
328
|
+
superiorDeptApprover: '起草人上级部门授权审批人',
|
|
329
|
+
superiorDeptLeader: '起草人上级部门负责人'
|
|
325
330
|
},
|
|
326
331
|
// 环节属性
|
|
327
332
|
task: {
|
|
@@ -427,7 +432,11 @@ const cn = {
|
|
|
427
432
|
cCtask: '抄送任务',
|
|
428
433
|
canItBeRejected: '是否可驳回',
|
|
429
434
|
selectMailTemplate: '选择通知模板',
|
|
430
|
-
selectTemplate: '选择模板'
|
|
435
|
+
selectTemplate: '选择模板',
|
|
436
|
+
autoTask: '自动任务',
|
|
437
|
+
newAutoTask: '新自动任务',
|
|
438
|
+
propertiesOfAutoTask: '自动任务的属性',
|
|
439
|
+
custombeanName: '自定义bean'
|
|
431
440
|
},
|
|
432
441
|
// 流向属性
|
|
433
442
|
transition: {
|
package/src/i18n/langs/en.js
CHANGED
|
@@ -321,7 +321,9 @@ const en = {
|
|
|
321
321
|
defaultMailTemplate: 'Default Mail Template',
|
|
322
322
|
trustTask: 'Trust Task',
|
|
323
323
|
subprocessIsSharedForm: 'Main process and subprocess shared form',
|
|
324
|
-
|
|
324
|
+
generateForParttimeDept: 'Generate tasks for part-time department personnel',
|
|
325
|
+
deptSpecifiedInFormField: 'Dept Specified In Form Field',
|
|
326
|
+
activateOneVoteVeto: 'Activate one vote veto'
|
|
325
327
|
},
|
|
326
328
|
// 环节属性
|
|
327
329
|
task: {
|
|
@@ -427,7 +429,11 @@ const en = {
|
|
|
427
429
|
cCtask: 'CC Task',
|
|
428
430
|
canItBeRejected: 'Can It Be Rejected',
|
|
429
431
|
selectMailTemplate: 'Select Notice Template',
|
|
430
|
-
selectTemplate: 'Select Template'
|
|
432
|
+
selectTemplate: 'Select Template',
|
|
433
|
+
autoTask: 'Auto Task',
|
|
434
|
+
newAutoTask: 'New Auto Task',
|
|
435
|
+
propertiesOfAutoTask: 'Properties Of Auto Task',
|
|
436
|
+
custombeanName: 'Custom Bean Name'
|
|
431
437
|
},
|
|
432
438
|
// 流向属性
|
|
433
439
|
transition: {
|