editDetails

付延余

2022-07-28 548b97b82e741b67c4258661352ae28462a34f66

 components/common/popup-menu/popup-menu.vue

@@ -1,151 +1,170 @@
<template>
   <view class="popup-menu">
      <u-popup mode="right" :show="menuShow" @close="close" @open="open">
         <u-cell-group>
            <u-cell
                title="首页"
                isLink
                url="/pages/home/home" style="color:blue"
            >
               <image src="@/static/menuIcon/menu-home.png" slot="icon" size="32" name="search"/>
            </u-cell>
            <u-cell
                v-if="$store.state.shenqingMenu"
               v-cloak
                title="我的申请"
                isLink
                url="/pages/my-application/my-application"
            >
                 <image src="@/static/menuIcon/menu-application.png" slot="icon" size="32" name="search"/>
            </u-cell>
            <u-cell
                title="我的待办"
                isLink
                url="/pages/my-todo/my-todo"
            >				
                <image src="@/static/menuIcon/menu-todo.png" slot="icon" size="32" name="search"/>
            </u-cell>
            <u-cell
                title="我的已办"
                isLink
                url="/pages/my-have-todo/my-have-todo"
            >				
                <image src="@/static/menuIcon/menu-havedo.png" slot="icon" size="32" name="search"/>
            </u-cell>
            <u-cell
               v-if="$store.state.rijihuaMenu"
               v-cloak
                title="日发运计划"
                isLink
                url="/pages/jihua/jihua" style="color:blue"
            >
                <image src="@/static/menuIcon/menu-shipment.png" slot="icon" size="32" name="search"/>
            </u-cell>
         </u-cell-group>
         <u-button text="退出" type="primary" @click="menuPopupClick"></u-button>
      </u-popup>
   </view>
  <view class="popup-menu">
    <u-popup mode="right" :show="menuShow" @close="close" @open="open">
      <u-cell-group>
        <u-cell
            title="首页"
            isLink
            url="/pages/home/home" style="color:blue"
        >
          <image src="@/static/menuIcon/menu-home.png" slot="icon" size="32" name="search"/>
        </u-cell>
        <u-cell
            v-if="$store.state.shenqingMenu"
            v-cloak
            title="我的申请"
            isLink
            url="/pages/my-application/my-application"
        >
          <image src="@/static/menuIcon/menu-application.png" slot="icon" size="32" name="search"/>
        </u-cell>
        <u-cell
            title="我的待办"
            isLink
            url="/pages/my-todo/my-todo"
        >
          <image src="@/static/menuIcon/menu-todo.png" slot="icon" size="32" name="search"/>
        </u-cell>
        <u-cell
            title="我的已办"
            isLink
            url="/pages/my-have-todo/my-have-todo"
        >
          <image src="@/static/menuIcon/menu-havedo.png" slot="icon" size="32" name="search"/>
        </u-cell>
        <u-cell
            v-if="$store.state.rijihuaMenu"
            v-cloak
            title="日发运计划"
            isLink
            url="/pages/jihua/jihua" style="color:blue"
        >
          <image src="@/static/menuIcon/menu-shipment.png" slot="icon" size="32" name="search"/>
        </u-cell>
      </u-cell-group>
      <u-button text="退出" type="primary" @click="menuPopupClick"></u-button>
    </u-popup>
  </view>
</template>

<script>
import { redirectLogin } from '@/utils/status.js';
import {redirectLogin} from '@/utils/status.js';

export default {
   name: 'PopupMenu',
   // props:{
   //    menuShow:{
   //       type:Boolean,
   //       default:false
   //    }
   // },
   // watch:{
   //    menuShow(newV,oldV){
   //          this.menuShow = newV;
   //          console.log('监听menu',newV);
   //    }
   // },
   data() {
      return {
         menuShow:false
      };
   },
   onShow() {
      alert(111)
   },
   methods: {
      menuClick(){
         this.menuShow = !this.menuShow
         this.$emit('menuShow',this.menuShow)
      },
      open() {
         console.log(this.$store.state,'shenqingMenu====')
      },
      close() {
         this.menuShow = false;
         this.$emit('menuShow',this.menuShow)
      },
      menuPopupClick(){
         this.menuShow = false;
         redirectLogin();
      }
   }
  name: 'PopupMenu',
  // props:{
  //    menuShow:{
  //       type:Boolean,
  //       default:false
  //    }
  // },
  // watch:{
  //    menuShow(newV,oldV){
  //          this.menuShow = newV;
  //          console.log('监听menu',newV);
  //    }
  // },
  data() {
    return {
      menuShow: false
    };
  },
  onShow() {
    alert(111);
  },
  methods: {
    menuClick() {
      this.menuShow = !this.menuShow
      this.$emit('menuShow', this.menuShow)
    },
    open() {
      console.log(this.$store.state, 'shenqingMenu====')
    },
    close() {
      this.menuShow = false;
      this.$emit('menuShow', this.menuShow)
    },
    menuPopupClick() {
      this.menuShow = false;
      uni.request({
        url: '/auth/token/logout',
        method: 'DELETE',
        header: {
          'TENANT-ID': 5,
          Authorization: 'Bearer ' + uni.getStorageSync('access_token'),
          VERSION: 'zzl'
        }
      }).then(redirectLogin()).catch(err => {
        uni.showToast({
          title: '退出失败！',
        })
      })
    }
  }
};
</script>

<style lang="scss" scoped>
::v-deep.popup-menu {
   .u-popup{
      .u-transition{
         .u-popup__content{
            // 按钮
            .u-button{
               width:vww(222);
               height:vww(40);
               margin-bottom:vww(40);
            }
            // cell单元格
            .u-cell-group{
					
               .u-cell-group__wrapper{
                  .u-cell{
                     width:vww(270);
                     height:vww(48);
                     .u-cell__body{
                        height:vww(48);
                        .u-cell__body__content{
                           .u-cell__left-icon-wrap{
                              margin-right: vww(8);
                              image{
                                 width:vww(16);
                                 height:vww(16);
                              }
                           }
                           .u-cell__title{
                              .u-cell__title-text{
                                 font-size:vww(14);
                              }
                        }
                        }
                        .u-cell__right-icon-wrap{
                           .u-icon{
                              .u-icon__icon{
                                 width:vww(7.27);
                                 height:vww(12);
                                 span{
                                    color:#007AFF;
												
                                 }
                              }
                           }
                        }
                     }
                  }
               }
            }
				
				
				
         }
      }
   }
  .u-popup {
    .u-transition {
      .u-popup__content {
        // 按钮
        .u-button {
          width: vww(222);
          height: vww(40);
          margin-bottom: vww(40);
        }

        // cell单元格
        .u-cell-group {

          .u-cell-group__wrapper {
            .u-cell {
              width: vww(270);
              height: vww(48);

              .u-cell__body {
                height: vww(48);

                .u-cell__body__content {
                  .u-cell__left-icon-wrap {
                    margin-right: vww(8);

                    image {
                      width: vww(16);
                      height: vww(16);
                    }
                  }

                  .u-cell__title {
                    .u-cell__title-text {
                      font-size: vww(14);
                    }
                  }
                }

                .u-cell__right-icon-wrap {
                  .u-icon {
                    .u-icon__icon {
                      width: vww(7.27);
                      height: vww(12);

                      span {
                        color: #007AFF;

                      }
                    }
                  }
                }
              }
            }
          }
        }


      }
    }
  }
}
</style>