Dialogs and Vuetify styling changes

src/components/PurgeRoomDialog.vue

@@ -2,7 +2,7 @@
   <v-dialog
     persistent
     v-model="showDialog"
-    v-show="room" class="ma-0 pa-0"
+    class="ma-0 pa-0"
     :width="$vuetify.display.smAndUp ? '688px' : '95%'"
   >
     <div v-if="timeout == -1" class="dialog-content text-center">
@@ -96,47 +96,25 @@
   </v-dialog>
 </template>
 <script>
-import roomInfoMixin from "./roomInfoMixin";
 import { STATE_EVENT_ROOM_DELETION_NOTICE } from "../plugins/utils";
+import RoomDialogBase from "./RoomDialogBase.vue";
 
 export default {
-  name: "LeaveRoomDialog",
-  mixins: [roomInfoMixin],
-  props: {
-    show: {
-      type: Boolean,
-      default: function () {
-        return false;
-      },
-    },
-  },
+  name: "PurgeRoomDialog",
+  extends: RoomDialogBase,
   data() {
     return {
       timeout: -1,
       timeoutTimer: null,
-      showDialog: false,
       isPurging: false,
       status: null,
     };
   },
-  watch: {
-    show: {
-      handler(newVal, ignoredOldVal) {
-        this.showDialog = newVal;
-      },
-    },
-    showDialog(val, oldVal) {
-      if (!val && oldVal) {
-        this.undo();
-        this.$emit("close");
-      } else if (val && !oldVal) {
-        // Showing, reset
-        this.status = null;
-      }
-    },
-  },
-
   methods: {
+    onOpenDialog() {  
+      // Showing, reset
+      this.status = null;
+    },
     undo() {
       if (this.timeoutTimer) {
         clearInterval(this.timeoutTimer);