Skip to content

Commit e573a05

Browse files
elsiosanchezelsiosanchez
andauthored
Add activity notifications (#997)
Co-authored-by: elsiosanchez <elsiossanches@gmail.com>
1 parent b92e36a commit e573a05

File tree

3 files changed

+106
-49
lines changed

3 files changed

+106
-49
lines changed

src/components/ADempiere/Badge/index.vue

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,11 +33,25 @@
3333
</el-table-column>
3434
<el-table-column
3535
width="50"
36-
class-name="procesActivity"
3736
>
38-
<el-tooltip effect="dark" :content="$t('navbar.badge.link')" placement="top-start">
37+
<template slot="header">
38+
<!-- <el-button"
39+
type="text"
40+
@click="handleCurrentChange()"
41+
> -->
3942
<svg-icon icon-class="tree-table" />
40-
</el-tooltip>
43+
<!-- </el-button> -->
44+
</template>
45+
<template slot-scope="scope">
46+
<el-button
47+
type="text"
48+
size="small"
49+
style="color: black"
50+
@click="openProcess(scope.$index, getRecordNotification)"
51+
>
52+
<svg-icon icon-class="tree-table" />
53+
</el-button>
54+
</template>
4155
</el-table-column>
4256
</el-table>
4357
<el-button slot="reference" type="text" icon="el-icon-bell" style="float: left;color: #000000;font-size: 121%;font-weight: 615!important;padding-top: 14px;" />
@@ -74,6 +88,9 @@ export default {
7488
this.show = false
7589
},
7690
handleCurrentChange(getRecordNotification, val, index, rows) {
91+
if (!this.isEmptyValue(getRecordNotification.typeActivity) && getRecordNotification.typeActivity) {
92+
return ''
93+
}
7794
if (val !== null) {
7895
let options = {
7996
name: 'ProcessActivity'
@@ -92,6 +109,10 @@ export default {
92109
this.$router.push(options, () => {})
93110
}
94111
},
112+
openProcess(index, rows) {
113+
this.$router.push({ name: '8e51c232-fb40-11e8-a479-7a0060f0aa01' }, () => {})
114+
this.deleteRow(index, this.getRecordNotification)
115+
},
95116
deleteRow(index, rows) {
96117
rows.splice(index, 1)
97118
},

src/components/ADempiere/Form/WorkflowActivity/index.vue

Lines changed: 81 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -15,15 +15,14 @@
1515
-->
1616
<template>
1717
<el-container style="height: 100% !important;">
18-
<el-header class="header" :style="!collapse ? 'height: 35% !important;' : 'height: 10%!important'">
18+
<el-header id="WorkflowActivity" class="header" :style="!collapse ? 'height: 35% !important;' : 'height: 10%!important'">
1919
<el-card :style="!collapse ? 'height: 100% !important;' : 'height: auto'">
2020
<div slot="header">
2121
<span> {{ $t('form.activity.title') }} </span>
2222
<el-button style="float: right; padding: 3px 0" type="text" :icon="collapse ? 'el-icon-arrow-down' : 'el-icon-arrow-up'" @click="collapse = !collapse" />
2323
</div>
2424
<el-table
2525
v-show="!collapse"
26-
ref="WorkflowActivity"
2726
v-loading="isEmptyValue(activityList)"
2827
:data="activityList"
2928
highlight-current-row
@@ -44,45 +43,61 @@
4443
</el-card>
4544
</el-header>
4645
<el-main class="main">
47-
<transition name="el-zoom-in-center">
48-
<el-card v-show="show" :style="{position: 'absolute', zIndex: '5', left: leftContextualMenu + 'px', top: topContextualMenu + 'px'}" class="box-card">
49-
<div slot="header" class="clearfix">
50-
<span>
51-
<b> {{ infoNode.name }} </b>
52-
</span>
53-
<el-button style="float: right; padding: 3px 0" type="text" icon="el-icon-close" @click="show = !show" />
54-
</div>
55-
<div class="text item" style="padding: 20px">
56-
<el-timeline class="info">
57-
<el-timeline-item :timestamp="currentWorkflow.created" placement="top">
58-
<el-card style="padding: 20px!important;">
59-
<b> Usuario: </b> {{ currentWorkflow.user_name }} <br>
60-
<b> {{ $t('table.ProcessActivity.Description') }}: </b> {{ infoNode.description }}
61-
</el-card>
62-
</el-timeline-item>
63-
</el-timeline>
64-
</div>
65-
</el-card>
66-
</transition>
67-
<workflow-chart
68-
v-if="!isEmptyValue(node) && !isEmptyValue(currentWorkflow)"
69-
:transitions="listWorkflowTransition"
70-
:states="node"
71-
:state-semantics="currentNode"
72-
@state-click="onLabelClicked(node, $event)"
73-
/>
74-
<el-scrollbar v-if="!isEmptyValue(currentWorkflow)" wrap-class="scroll-child">
75-
<el-timeline class="info">
76-
<el-timeline-item
77-
v-for="(nodes, key) in currentWorkflow.workflow_process.workflow_events"
78-
:key="key"
79-
:timestamp="translateDate(nodes.log_date)"
80-
placement="top"
81-
>
82-
<b> {{ nodes.node_name }} </b> {{ nodes.text_message }}
83-
</el-timeline-item>
84-
</el-timeline>
85-
</el-scrollbar>
46+
<el-container style="height: 100%;">
47+
<el-aside v-if="!isEmptyValue(currentActivity)" width="70%" style="background: white;">
48+
<transition name="el-zoom-in-center">
49+
<el-card v-show="show" :style="{position: 'absolute', zIndex: '5', left: leftContextualMenu + 'px', top: topContextualMenu + 'px'}" class="box-card">
50+
<div slot="header" class="clearfix">
51+
<span>
52+
{{ infoNode.description }}
53+
</span>
54+
<el-button style="float: right; padding: 3px 0" type="text" icon="el-icon-close" @click="show = !show" />
55+
</div>
56+
<div v-if="!isEmptyValue(infoNode.nodeLogs)" class="text item" style="padding: 20px">
57+
<el-timeline class="info">
58+
<el-timeline-item
59+
v-for="(logs, key) in infoNode.nodeLogs"
60+
:key="key"
61+
:timestamp="translateDate(logs.log_date)"
62+
placement="top"
63+
>
64+
<el-card style="padding: 20px!important;">
65+
<b> {{ $t('login.userName') }} </b> {{ logs.user_name }} <br>
66+
{{ logs.text_message }}
67+
</el-card>
68+
</el-timeline-item>
69+
</el-timeline>
70+
</div>
71+
</el-card>
72+
</transition>
73+
<workflow-chart
74+
v-if="!isEmptyValue(node) && !isEmptyValue(currentActivity)"
75+
:transitions="listWorkflowTransition"
76+
:states="node"
77+
:state-semantics="currentNode"
78+
@state-click="onLabelClicked(node, $event)"
79+
/>
80+
</el-aside>
81+
<el-main v-if="!isEmptyValue(currentActivity)">
82+
<el-card class="box-card">
83+
<div slot="header" class="clearfix">
84+
{{ $t('field.logsField') }}
85+
</div>
86+
<el-scrollbar v-if="!isEmptyValue(currentActivity)" wrap-class="scroll-child">
87+
<el-timeline class="info">
88+
<el-timeline-item
89+
v-for="(nodes, key) in listProcessWorkflow"
90+
:key="key"
91+
:timestamp="translateDate(nodes.log_date)"
92+
placement="top"
93+
>
94+
<b> {{ nodes.node_name }} </b> {{ nodes.text_message }}
95+
</el-timeline-item>
96+
</el-timeline>
97+
</el-scrollbar>
98+
</el-card>
99+
</el-main>
100+
</el-container>
86101
</el-main>
87102
<el-footer :class="styleFooter">
88103
<el-card shadow="hover" class="search">
@@ -138,18 +153,20 @@ export default {
138153
topContextualMenu: 0,
139154
leftContextualMenu: 0,
140155
infoNode: {},
156+
visible: false,
141157
show: false,
142158
collapse: false,
143159
currentNode: [{
144160
classname: 'delete',
145161
id: ''
146162
}],
147163
currentWorkflow: {},
164+
listProcessWorkflow: [],
148165
listWorkflowTransition: [],
149166
orderLineDefinition: [
150167
{
151168
columnName: 'workflow.name',
152-
name: 'Nombre',
169+
name: this.$t('table.ProcessActivity.Name'),
153170
isNumeric: false
154171
},
155172
{
@@ -159,7 +176,7 @@ export default {
159176
},
160177
{
161178
columnName: 'node.description',
162-
name: 'Descripcion',
179+
name: this.$t('table.ProcessActivity.Description'),
163180
isNumeric: false
164181
}
165182
]
@@ -184,23 +201,37 @@ export default {
184201
return this.$store.getters.getCurrentActivity
185202
}
186203
},
204+
watch: {
205+
activityList(list) {
206+
this.SendActivityListNotifier(list)
207+
},
208+
currentActivity(value) {
209+
this.listWorkflow(value)
210+
this.setCurrent()
211+
}
212+
},
187213
mounted() {
188214
this.$store.dispatch('serverListActivity')
189215
if (!this.isEmptyValue(this.currentActivity)) {
190-
this.setCurrent()
216+
this.listWorkflow(this.currentActivity)
191217
}
192218
},
193219
methods: {
220+
SendActivityListNotifier() {
221+
this.$store.commit('addNotificationProcess', { name: this.$t('navbar.badge.activity') + ' ' + this.activityList.length, typeActivity: true })
222+
},
194223
setCurrent() {
195224
const activity = this.activityList.find(activity => activity.node === this.currentActivity.node)
196225
this.$refs.WorkflowActivity.setCurrentRow(activity)
197226
},
198227
handleCurrentChange(activity) {
199-
this.listWorkflow(activity)
200228
this.$store.dispatch('selectedActivity', activity)
201229
},
202230
onLabelClicked(type, id) {
231+
this.visible = true
203232
this.infoNode = type.find(node => node.id === id)
233+
const nodeLogs = this.listProcessWorkflow.filter(node => node.node_uuid === this.infoNode.uuid)
234+
this.infoNode.nodeLogs = nodeLogs
204235
const menuMinWidth = 105
205236
const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
206237
const offsetWidth = this.$el.offsetWidth // container width
@@ -223,6 +254,7 @@ export default {
223254
listWorkflow(activity) {
224255
// Highlight Current Node
225256
this.currentWorkflow = activity
257+
this.listProcessWorkflow = !this.isEmptyValue(this.currentWorkflow.workflow_process) ? this.currentWorkflow.workflow_process.workflow_events.reverse() : []
226258
this.transitions = []
227259
if (!this.isEmptyValue(activity.node.uuid)) {
228260
this.currentNode = [{
@@ -337,7 +369,7 @@ export default {
337369
margin: 0px;
338370
font-size: 14px;
339371
list-style: none;
340-
padding: 0px;
372+
padding: 10px;
341373
}
342374
.vue-workflow-chart-state {
343375
background-color: #fff;
@@ -360,6 +392,9 @@ export default {
360392
}
361393
</style>
362394
<style lang='scss'>
395+
.scroll-child {
396+
max-height: 450px;
397+
}
363398
.el-card {
364399
border-radius: 4px;
365400
border: 1px solid #e6ebf5;

src/lang/ADempiere/es.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ export default {
5757
navbar: {
5858
badge: {
5959
Notifications: 'Notificaciones',
60+
activity: 'Actividades pendiente',
6061
link: 'Ir a Histórico de Procesos'
6162
},
6263
logOut: 'Salir',

0 commit comments

Comments
 (0)