@igea/oac_frontend 1.0.76 → 1.0.77

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@igea/oac_frontend",
3
- "version": "1.0.76",
3
+ "version": "1.0.77",
4
4
  "description": "Frontend service for the OAC project",
5
5
  "main": "src/index.js",
6
6
  "bin": {
@@ -17,6 +17,10 @@ const sequenceValues = ["$UUID$",
17
17
 
18
18
  const uploadValues = ["$UPLOAD$"];
19
19
 
20
+ const CLIENT_UUID = crypto.randomUUID();
21
+
22
+ const KEEP_LOCK_EVERY = 60*1000;
23
+
20
24
  document.addEventListener('DOMContentLoaded', () => {
21
25
 
22
26
  // App separata per l'autocomplete
@@ -26,13 +30,13 @@ document.addEventListener('DOMContentLoaded', () => {
26
30
  const searchApp = createApp({
27
31
  template: `
28
32
  <div style="display: flex; gap: 10px; align-items: center; margin-bottom: 20px;">
29
- <autocomplete-search
33
+ <autocomplete-search v-if="!inEdit"
30
34
  search-url="/backend/ontology/form/search"
31
35
  :min-chars="3"
32
36
  :placeholder="labels.search"
33
37
  @select="handleAutocompleteSelect"
34
38
  />
35
- <button v-if="existingInstance != null || inEdit" :title="labels.edit"
39
+ <button v-if="existingInstance != null && !inEdit" :title="labels.edit"
36
40
  @click="editInstance()" type="button" class="btn btn-info">
37
41
  <i class="fa-solid fa-pen-to-square"></i>
38
42
  </button>
@@ -63,14 +67,33 @@ document.addEventListener('DOMContentLoaded', () => {
63
67
  this.existingInstance = value;
64
68
  this.inEdit = false;
65
69
  window.dispatchEvent(
66
- new CustomEvent('select-item', { detail: value.uuid })
70
+ new CustomEvent('select-item', {
71
+ detail: {
72
+ id: this.existingInstance.id,
73
+ uuid: this.existingInstance.uuid
74
+ }
75
+ })
67
76
  );
68
77
  },
69
78
  editInstance(){
70
- this.inEdit = true;
71
- window.dispatchEvent(
72
- new CustomEvent('edit-item', { detail: this.existingInstance.uuid })
73
- );
79
+ setTimeout((async function(){
80
+ var response = await fetch(
81
+ '/backend/ontology/form/lock/' + this.existingInstance.id + "/" + CLIENT_UUID
82
+ ).then(resp => resp.json());
83
+ if(response.success){
84
+ this.inEdit = true;
85
+ window.dispatchEvent(
86
+ new CustomEvent('edit-item', {
87
+ detail: {
88
+ id: this.existingInstance.id,
89
+ uuid: this.existingInstance.uuid
90
+ }
91
+ })
92
+ );
93
+ }else{
94
+ alert("Record in editing da un altro utente")
95
+ }
96
+ }).bind(this))
74
97
  },
75
98
  newInstance(){
76
99
  this.inEdit = true;
@@ -79,10 +102,13 @@ document.addEventListener('DOMContentLoaded', () => {
79
102
  );
80
103
  },
81
104
  stopEdit(){
82
- this.inEdit = false;
83
- window.dispatchEvent(
84
- new CustomEvent('edit-stop')
85
- );
105
+ setTimeout((async function(){
106
+ this.inEdit = false;
107
+ this.existingInstance = null;
108
+ window.dispatchEvent(
109
+ new CustomEvent('edit-stop')
110
+ );
111
+ }).bind(this))
86
112
  }
87
113
  }
88
114
  });
@@ -105,6 +131,9 @@ document.addEventListener('DOMContentLoaded', () => {
105
131
  cur_role: parseInt(el.dataset.cur_role),
106
132
  uuid: el.dataset.uuid || null,
107
133
  form: null,
134
+ form_id: null,
135
+ form_keep_lock_timer: null,
136
+ form_keep_locking: false,
108
137
  inEditing: false,
109
138
  isVisible: false,
110
139
  enabled: el.dataset.editing == "true",
@@ -132,20 +161,28 @@ document.addEventListener('DOMContentLoaded', () => {
132
161
  // Ascolta eventi dall'autocomplete
133
162
  var _this = this;
134
163
  window.addEventListener('select-item', (event) => {
135
- var uuid = event.detail;
164
+ var detail = event.detail;
165
+ var id = detail.id;
166
+ var uuid = detail.uuid;
167
+ _this.form_id = id;
136
168
  console.log('select-item...', uuid);
137
169
  _this.enabled = false;
138
170
  _this.isVisible = true;
139
171
  _this.inEditing = false;
140
172
  _this.resetShaclForm(uuid, false);
173
+
141
174
  });
142
175
  window.addEventListener('edit-item', (event) => {
143
- var uuid = event.detail;
176
+ var detail = event.detail;
177
+ var id = detail.id;
178
+ var uuid = detail.uuid;
179
+ _this.form_id = id;
144
180
  console.log('edit-item...', uuid);
145
181
  _this.enabled = true;
146
182
  _this.isVisible = true;
147
183
  _this.inEditing = true;
148
184
  _this.resetShaclForm(uuid, true);
185
+ _this.form_keep_lock_timer = setInterval(_this.keepLock.bind(_this), KEEP_LOCK_EVERY)
149
186
  });
150
187
  window.addEventListener('new-item', (event) => {
151
188
  console.log('new-item...');
@@ -153,14 +190,30 @@ document.addEventListener('DOMContentLoaded', () => {
153
190
  _this.isVisible = true;
154
191
  _this.inEditing = true;
155
192
  _this.resetShaclForm(null, true);
193
+ _this.form_id = null;
156
194
  });
157
- window.addEventListener('edit-stop', (event) => {
195
+ window.addEventListener('edit-stop', async (event) => {
158
196
  console.log('edit-stop...');
197
+ if(_this.form_id){
198
+ await fetch(
199
+ '/backend/ontology/form/unlock/' + _this.form_id + "/" + CLIENT_UUID
200
+ ).then(resp => resp.json());
201
+ }
159
202
  _this.enabled = false;
160
203
  _this.isVisible = false;
161
204
  _this.inEditing = false;
205
+ _this.form_id = null;
162
206
  //_this.resetShaclForm(null, true);
207
+ clearInterval(_this.form_keep_lock_timer);
163
208
  });
209
+
210
+ window.addEventListener('beforeunload', () => {
211
+ if(this.form_id){
212
+ var url = '/backend/ontology/form/unlock/' + this.form_id + "/" + CLIENT_UUID;
213
+ navigator.sendBeacon(url);
214
+ }
215
+ });
216
+
164
217
  },
165
218
  computed:{
166
219
  outputStyle(){
@@ -177,6 +230,16 @@ document.addEventListener('DOMContentLoaded', () => {
177
230
  }
178
231
  },
179
232
  methods: {
233
+ keepLock(){
234
+ if(this.form_id && !this.form_keep_locking){
235
+ this.form_keep_locking = true;
236
+ setTimeout((async function(){
237
+ var url = '/backend/ontology/form/lock-keep/' + this.form_id + "/" + CLIENT_UUID;
238
+ await fetch(url);
239
+ this.form_keep_locking = false;
240
+ }).bind(this))
241
+ }
242
+ },
180
243
  onSelect(){
181
244
 
182
245
  },
@@ -584,6 +647,7 @@ document.addEventListener('DOMContentLoaded', () => {
584
647
 
585
648
  save(automatic) {
586
649
  if(this.saving) return;
650
+ var _this = this;
587
651
  this.lastSaveTs = (new Date()).getTime();
588
652
  automatic = automatic || false;
589
653
  this.saving = true;
@@ -591,17 +655,23 @@ document.addEventListener('DOMContentLoaded', () => {
591
655
  turtle: this.serializedForm,
592
656
  uuid: this.uuid
593
657
  });
594
- request.then(response => {
658
+ request.then(async response => {
595
659
  var obj = response.data;
660
+ console.log(obj);
596
661
  if(!automatic){
597
- if(obj.success)
662
+ if(obj.success){
598
663
  alert("Saved: OK");
599
- else
664
+ if(_this.isNew && obj.data){
665
+ _this.form_id = obj.data;
666
+ await fetch('/backend/ontology/form/lock/' + obj.data + "/" + CLIENT_UUID)
667
+ _this.form_keep_lock_timer = setInterval(_this.keepLock.bind(_this), KEEP_LOCK_EVERY)
668
+ }
669
+ }else
600
670
  alert("Error: " + obj.message);
601
671
  }
602
- this.saving = false;
672
+ _this.saving = false;
603
673
  }).catch(error => {
604
- this.saving = false;
674
+ _this.saving = false;
605
675
  console.log(error);
606
676
  });
607
677
  },