Merge pull request #900 from doccano/fix/#825

Replace BaseDialog with VDialog, fix #825

frontend/components/containers/annotation/GuidelineButton.vue

@@ -16,24 +16,25 @@
       </template>
       <span>Show guideline</span>
     </v-tooltip>
-    <base-dialog :dialog="dialog">
+    <v-dialog
+      v-model="dialog"
+      width="800"
+    >
       <guideline-card
         v-if="currentProject"
         :guideline-text="currentProject.guideline"
         @close="dialog=false"
       />
-    </base-dialog>
+    </v-dialog>
   </div>
 </template>
 
 <script>
 import { mapGetters } from 'vuex'
-import BaseDialog from '@/components/molecules/BaseDialog'
 import GuidelineCard from '@/components/organisms/annotation/GuidelineCard'
 
 export default {
   components: {
-    BaseDialog,
     GuidelineCard
   },
 

frontend/components/containers/documents/DocumentActionMenu.vue

@@ -5,34 +5,38 @@
       @upload="importDialog=true"
       @download="exportDialog=true"
     />
-    <base-dialog :dialog="importDialog">
+    <v-dialog
+      v-model="importDialog"
+      width="800"
+    >
       <document-upload-form
         :upload-document="uploadDocument"
         :formats="getImportFormat"
         @close="importDialog=false"
       />
-    </base-dialog>
-    <base-dialog :dialog="exportDialog">
+    </v-dialog>
+    <v-dialog
+      v-model="exportDialog"
+      width="800"
+    >
       <document-export-form
         :export-document="exportDocument"
         :formats="getExportFormat"
         @close="exportDialog=false"
       />
-    </base-dialog>
+    </v-dialog>
   </div>
 </template>
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
 import ActionMenu from '@/components/molecules/ActionMenu'
-import BaseDialog from '@/components/molecules/BaseDialog'
 import DocumentUploadForm from '@/components/organisms/documents/DocumentUploadForm'
 import DocumentExportForm from '@/components/organisms/documents/DocumentExportForm'
 
 export default {
   components: {
     ActionMenu,
-    BaseDialog,
     DocumentUploadForm,
     DocumentExportForm
   },

frontend/components/containers/documents/DocumentDeletionButton.vue

@@ -8,7 +8,10 @@
     >
       Delete
     </v-btn>
-    <base-dialog :dialog="dialog">
+    <v-dialog
+      v-model="dialog"
+      width="800"
+    >
       <confirm-form
         :items="selected"
         title="Delete Document"
@@ -17,18 +20,16 @@
         @ok="deleteDocument($route.params.id);dialog=false"
         @cancel="dialog=false"
       />
-    </base-dialog>
+    </v-dialog>
   </div>
 </template>
 
 <script>
 import { mapState, mapGetters, mapActions } from 'vuex'
-import BaseDialog from '@/components/molecules/BaseDialog'
 import ConfirmForm from '@/components/organisms/utils/ConfirmForm'
 
 export default {
   components: {
-    BaseDialog,
     ConfirmForm
   },
 

frontend/components/containers/labels/LabelActionMenu.vue

@@ -6,33 +6,37 @@
       @upload="importDialog=true"
       @download="handleDownload"
     />
-    <base-dialog :dialog="createDialog">
+    <v-dialog
+      v-model="createDialog"
+      width="800"
+    >
       <label-creation-form
         :create-label="createLabel"
         :keys="shortkeys"
         @close="createDialog=false"
       />
-    </base-dialog>
-    <base-dialog :dialog="importDialog">
+    </v-dialog>
+    <v-dialog
+      v-model="importDialog"
+      width="800"
+    >
       <label-import-form
         :upload-label="uploadLabel"
         @close="importDialog=false"
       />
-    </base-dialog>
+    </v-dialog>
   </div>
 </template>
 
 <script>
 import { mapActions, mapGetters } from 'vuex'
 import ActionMenu from '@/components/molecules/ActionMenu'
-import BaseDialog from '@/components/molecules/BaseDialog'
 import LabelCreationForm from '@/components/organisms/labels/LabelCreationForm'
 import LabelImportForm from '@/components/organisms/labels/LabelImportForm'
 
 export default {
   components: {
     ActionMenu,
-    BaseDialog,
     LabelCreationForm,
     LabelImportForm
   },

frontend/components/containers/labels/LabelDeletionButton.vue

@@ -8,7 +8,10 @@
     >
       Delete
     </v-btn>
-    <base-dialog :dialog="dialog">
+    <v-dialog
+      v-model="dialog"
+      width="800"
+    >
       <confirm-form
         :items="selected"
         title="Delete Label"
@@ -17,18 +20,16 @@
         @ok="deleteLabel($route.params.id);dialog=false"
         @cancel="dialog=false"
       />
-    </base-dialog>
+    </v-dialog>
   </div>
 </template>
 
 <script>
 import { mapState, mapGetters, mapActions } from 'vuex'
-import BaseDialog from '@/components/molecules/BaseDialog'
 import ConfirmForm from '@/components/organisms/utils/ConfirmForm'
 
 export default {
   components: {
-    BaseDialog,
     ConfirmForm
   },
 

frontend/components/molecules/BaseDialog.vue

@@ -1,24 +0,0 @@
-<template>
-  <v-dialog
-    :value="dialog"
-    :width="width"
-  >
-    <slot />
-  </v-dialog>
-</template>
-
-<script>
-export default {
-  props: {
-    dialog: {
-      type: Boolean,
-      default: false,
-      required: true
-    },
-    width: {
-      type: String,
-      default: '800'
-    }
-  }
-}
-</script>