update

src/utils/app-drawer/app-drawer.ts

@@ -77,21 +77,24 @@ export class AppDrawer {
                 }
             }).$mount();
             this.vueExample = vm;
-            document.body.appendChild(vm.$el);
+            let app =  document.getElementById("app");
+            if(app){
+                app.appendChild(vm.$el);
+            }
             const comp: any = vm.$children[0];
             let subject =  comp.getSubject()
             return new Promise((reaolve, reject) => {
                 subject.subscribe((result: any) => {
-                    if (vm) {
-                        document.body.removeChild(vm.$el);
+                    if (vm && app) {
+                        app.removeChild(vm.$el);
                     }
                 }, () => {
-                    if (vm) {
-                        document.body.removeChild(vm.$el);
+                    if (vm  && app) {
+                        app.removeChild(vm.$el);
                     }
                 }, () => {
-                    if (vm) {
-                        document.body.removeChild(vm.$el);
+                    if (vm && app) {
+                        app.removeChild(vm.$el);
                     }
                 });
             });

src/utils/app-drawer/app-drawer.vue

 <template>
-<div v-if="isShow" class="drawer">
-    <van-popup @closed="close" v-model="isShow" :position="placement" :style="{ width:'80%', height: '100%' }" >
-            <component
+<div >
+        <ion-menu
+        :content-id="uuid"
+        :ref="this.uuid+'drawer'"
+        @ionWillClose="close"
+        @on-visible-change="onVisibleChange($event)">
+        <component
             :is="viewname"
             class="viewcontainer2"
             :viewDefaultUsage="false"
@@ -12,7 +16,7 @@
             @close="close($event)"
             :ref="viewname">
         </component>
-    </van-popup>
+        </ion-menu>
 </div>
 </template>
 
@@ -49,6 +53,10 @@ export default class AppDrawerCompponent extends Vue {
      */
     @Prop() public uuid?: any;
 
+    public ionWillClose(value:any){
+        console.log(value);
+    }
+
     /**
      * 视图参数
      *
@@ -167,6 +175,10 @@ export default class AppDrawerCompponent extends Vue {
     public mounted() {
         this.isShow = true;
         this.handleZIndex('ivu-drawer-mask', 'ivu-drawer-wrap');
+        let drawer :any = this.$refs[this.uuid+'drawer'];
+            if(drawer){
+                drawer.open()
+        }
     }
 
     /**
@@ -241,7 +253,7 @@ export default class AppDrawerCompponent extends Vue {
      *
      * @memberof AppDrawerCompponent
      */
-    public onVisibleChange($event: any) {
+    public async onVisibleChange($event: any) {
         const component: any = this.$refs[this.viewname];
         if (component) {
             const { viewtag: _viewtag } = component;
@@ -250,9 +262,21 @@ export default class AppDrawerCompponent extends Vue {
                 this.isShow = true;
                 const title: any = this.$t('app.tabpage.sureclosetip.title');
                 const contant: any = this.$t('app.tabpage.sureclosetip.content');
-                
-            } 
-            this.handleShowState(true);
+                const result = await this.$notice.confirm(title, contant);
+                if (result) {
+                    this.$store.commit('viewaction/setViewDataChange', { viewtag: _viewtag, viewdatachange: false });
+                    this.isShow = false;
+                    this.handleShowState($event);
+                } else {
+                    this.isShow = true;
+                    let drawer :any = this.$refs[this.uuid+'drawer'];
+                    if(drawer){
+                      const re =   drawer.toggle(true);
+                    }
+                }
+            }else{
+                this.handleShowState($event);
+            }
         }
     }