changeset 686:9f2fa198ee80

cont removing dependency on bootstrap-vue
author Sebastien Jodogne <s.jodogne@gmail.com>
date Tue, 17 Dec 2024 12:23:07 +0100
parents 49aab490fc48
children ec0f264beac9
files WebApplication/app.js WebApplication/index.html
diffstat 2 files changed, 54 insertions(+), 30 deletions(-) [+]
line wrap: on
line diff
--- a/WebApplication/app.js	Tue Dec 17 12:09:30 2024 +0100
+++ b/WebApplication/app.js	Tue Dec 17 12:23:07 2024 +0100
@@ -220,7 +220,7 @@
     },
     ConfirmDeleteStudy: function(study) {
       app.studyToDelete = study;
-      app.$bvModal.show('study-delete-confirm');
+      $(app.$refs['study-delete-confirm']).modal();
     },
     ExecuteDeleteStudy: function(study) {
       axios
@@ -319,7 +319,7 @@
     },
     ConfirmDeleteSeries: function(series) {
       app.seriesToDelete = series;
-      app.$bvModal.show('series-delete-confirm');
+      $(app.$refs['series-delete-confirm']).modal();
     },
     ExecuteDeleteSeries: function(series) {
       axios
--- a/WebApplication/index.html	Tue Dec 17 12:09:30 2024 +0100
+++ b/WebApplication/index.html	Tue Dec 17 12:23:07 2024 +0100
@@ -173,20 +173,6 @@
             </tr>
           </tbody>
         </table>
-
-        <b-modal id="study-delete-confirm" size="xl" @ok="ExecuteDeleteStudy">
-          <template slot="modal-title">
-            Confirm deletion
-          </template>
-          <div class="d-block">
-            <p>
-              Are you sure you want to remove this study from the remote server?
-            </p>
-            <p>
-              Patient name: {{ studyToDelete && studyToDelete['00100010'] && studyToDelete['00100010'].Value }}
-            </p>
-          </div>
-        </b-modal>
       </div>
 
 
@@ -225,6 +211,32 @@
       </div>
 
 
+      <div class="modal" tabindex="-1" ref="study-delete-confirm">
+        <div class="modal-dialog modal-xl">
+          <div class="modal-content">
+            <div class="modal-header">
+              <h5 class="modal-title">Confirm deletion</h5>
+              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+              </button>
+            </div>
+            <div class="modal-body">
+              <p>
+                Are you sure you want to remove this study from the remote server?
+              </p>
+              <p>
+                Patient name: {{ studyToDelete && studyToDelete['00100010'] && studyToDelete['00100010'].Value }}
+              </p>
+            </div>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+              <button type="button" class="btn btn-primary" data-dismiss="modal" @click="ExecuteDeleteStudy">Confirm</button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+
       <!-- SERIES -->
 
       <hr  v-show="showSeries" ref="series-top" />
@@ -272,20 +284,6 @@
             <b-img v-if="!previewFailure" :src="preview" fluid alt=""></b-img>
           </div>
         </b-modal>
-
-        <b-modal id="series-delete-confirm" size="xl" @ok="ExecuteDeleteSeries">
-          <template slot="modal-title">
-            Confirm deletion
-          </template>
-          <div class="d-block">
-            <p>
-              Are you sure you want to remove this series from the remote server?
-            </p>
-            <p>
-              Series description: {{ seriesToDelete && seriesToDelete['0008103E'] && seriesToDelete['0008103E'].Value }}
-            </p>
-          </div>
-        </b-modal>
       </div>
 
 
@@ -324,6 +322,32 @@
       </div>
 
 
+      <div class="modal" tabindex="-1" ref="series-delete-confirm">
+        <div class="modal-dialog modal-xl">
+          <div class="modal-content">
+            <div class="modal-header">
+              <h5 class="modal-title">Confirm deletion</h5>
+              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+              </button>
+            </div>
+            <div class="modal-body">
+              <p>
+                Are you sure you want to remove this series from the remote server?
+              </p>
+              <p>
+                Series description: {{ seriesToDelete && seriesToDelete['0008103E'] && seriesToDelete['0008103E'].Value }}
+              </p>
+            </div>
+            <div class="modal-footer">
+              <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+              <button type="button" class="btn btn-primary" data-dismiss="modal" @click="ExecuteDeleteSeries">Confirm</button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+
       <b-modal ref="retrieve-job" size="xl" ok-only="true">
         <template slot="modal-title">
           Retrieving {{ jobLevel }}