<style lang="less">
.panel-add-miniprogram-to-desk {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 2;
    &.show {
        display: flex;
    }
    &.hide {
        display: none;
    }
    .panel-mask {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.2);
    }
    .content {
        width: 622rpx;
        height: 648rpx;
        background: #ffffff;
        box-shadow: 0px 8rpx 30rpx rgba(0, 0, 0, 0.15);
        border-radius: 50rpx;
        text-align: center;
        position: relative;
        &.hidBtn {
            height: 648rpx;
        }
    }
 

    .btn-ingore {
        width: 100%;
        font-size: 30rpx;
        line-height: 32rpx;
        text-align: center;
        color: #c4c4c4;
        padding-top: 56rpx;
        box-sizing: border-box;
        flex: 1;
    }


    .android-content {
        background: #fff;
        height: 100%;
        .operation-tip {
            .tip-image {
                width: 100%;
                height: 558rpx;
                display: block;
            }
            .text {
                height: 96rpx;
                border-top: 1rpx solid #E8ECF0;
                font-family: PingFang SC;
                font-size: 32rpx;
                font-weight: 400;
                line-height: 96rpx;
                color: #1DB1B2;
            }
        }
    }
}
</style>

<template>
    <cover-view
        class="{{'panel-add-miniprogram-to-desk '+(show?'show':'hide')}}"
        v-on:touchmove.stop="stopProgration"
    >
        <cover-view
            class="panel-mask"
            v-on:click="closePanel"
        ></cover-view>
        <cover-view
            class="content"
            :class="{hidBtn: !showBottomButton}"
        >
            <cover-view class="android-content">
                <cover-view class="operation-tip">
                    <cover-image
                        class="tip-image"
                        :src="h5StaticPath+'/page-personalCenter/ceshi.png'"
                    ></cover-image>
                    <cover-view class="text"  v-on:click="closePanel">我知道了</cover-view>
                </cover-view>
                <!-- <cover-image class="tip-image" :src="h5StaticPath+'/page-personalCenter/bg-android-tip.png'"></cover-image> -->
                <cover-view
                    class="btn-ingore"
                    v-on:click="added"
                    v-if="showBottomButton"
                >我已添加，不再展示</cover-view>
            </cover-view>
        </cover-view>
    </cover-view>
</template>

<script>
import wepy from '@wepy/core'
import config from '@config'
import { mapState } from '@wepy/x'
import store from '@/store'

wepy.component({
  store,
  data: {
    h5StaticPath: config.h5StaticPath,
    h5Origin: config.h5Origin,
    showLink: `${config.h5Origin}/#/wx-external-link`
  },
  props: {
    data: Object,
    show: Boolean,
    showBottomButton: {
      type: Boolean,
      default: true
    }
  },
  computed: {
    ...mapState({ userInfo: state => state.user.userInfo })
  },
  created() {

  },
  methods: {
    closePanel() {
      this.$emit('component-add-miniprogram-to-desk-panel-close')
    },
    added() {
            // 缓存字段添加过了
      wx.setStorageSync('HasAddMiniprogramShortcute', true)
      this.$emit('component-add-miniprogram-to-desk-panel-added')
    },
    stopProgration() { }
  }
})
</script>


<config>
{
  
}
</config>
