@igea/oac_frontend 1.0.76 → 1.0.78

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.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/public/js/app/vue-investigation.js +91 -20
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.78",
4
4
  "description": "Frontend service for the OAC project",
5
5
  "main": "src/index.js",
6
6
  "bin": {
package/src/public/js/app/vue-investigation.js CHANGED
@@ -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
  },
@@ -242,7 +305,8 @@ document.addEventListener('DOMContentLoaded', () => {
242
305
  newForm.dataset.shapeSubject="http://example.org/shapes/E7Activity01Shape";
243
306
 
244
307
  if(uuid){
245
- newForm.dataset.valuesUrl="/backend/ontology/form/" + uuid;
308
+ var rnd = (new Date()).getTime();
309
+ newForm.dataset.valuesUrl="/backend/ontology/form/" + uuid + "?rnd=" + rnd;
246
310
  newForm.dataset.valuesSubject="http://indagine/" + uuid;
247
311
  }
248
312
 
@@ -584,6 +648,7 @@ document.addEventListener('DOMContentLoaded', () => {
584
648
 
585
649
  save(automatic) {
586
650
  if(this.saving) return;
651
+ var _this = this;
587
652
  this.lastSaveTs = (new Date()).getTime();
588
653
  automatic = automatic || false;
589
654
  this.saving = true;
@@ -591,17 +656,23 @@ document.addEventListener('DOMContentLoaded', () => {
591
656
  turtle: this.serializedForm,
592
657
  uuid: this.uuid
593
658
  });
594
- request.then(response => {
659
+ request.then(async response => {
595
660
  var obj = response.data;
661
+ console.log(obj);
596
662
  if(!automatic){
597
- if(obj.success)
663
+ if(obj.success){
598
664
  alert("Saved: OK");
599
- else
665
+ if(_this.isNew && obj.data){
666
+ _this.form_id = obj.data;
667
+ await fetch('/backend/ontology/form/lock/' + obj.data + "/" + CLIENT_UUID)
668
+ _this.form_keep_lock_timer = setInterval(_this.keepLock.bind(_this), KEEP_LOCK_EVERY)
669
+ }
670
+ }else
600
671
  alert("Error: " + obj.message);
601
672
  }
602
- this.saving = false;
673
+ _this.saving = false;
603
674
  }).catch(error => {
604
- this.saving = false;
675
+ _this.saving = false;
605
676
  console.log(error);
606
677
  });
607
678
  },