完善信息领取奖励

src/components/common/ImproveInformation.vue

+<!-- 完善信息领取奖励 -->
+<template>
+  <div class="ImproveInformation" v-if="show" catchtouchmove="true">
+    <div class="ImproveInformation__bg"></div>
+    <div class="ImproveInformation__content">
+      <div class="close" @click="close">
+        <i class="iconfont icon-guanbi"></i>
+      </div>
+      <div class="title">完善信息领奖励</div>
+      <div class="banner">
+        xxx
+      </div>
+      <div class="bottom">
+        <div class="bottom__left">
+          <checkbox v-model="notPromptFlag" @click="notPrompt" color="var(--main-color)"><span>不再提示</span></checkbox>
+        </div>
+        <div class="bottom__right">
+          <van-button type="danger" @click="confirm" size="small">立即前往</van-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script type="text/ecmascript-6">
+const app = getApp()
+export default {
+  name: "ImproveInformation",
+  data() {
+    return {
+      show: false, // 弹窗显示
+      notPromptFlag: false,
+    }
+  },
+  components: {},
+  computed: {},
+  created() {
+    this.open();
+  },
+  mounted() { },
+  methods: {
+    open() {
+      if (wx.getStorageSync('notPromptFlag')) {
+        this.show = false;
+        return;
+      }
+      this.show = true;
+    },
+    notPrompt() {
+      this.notPromptFlag = !this.notPromptFlag;
+    },
+    close() {
+      console.log('close->', this.notPromptFlag)
+      if (this.notPromptFlag) {
+        wx.setStorageSync('notPromptFlag', true);
+      }
+      this.show = false;
+    },
+    confirm() {
+      app.$themeToLink({
+        type: 1,
+        link: `/personalCenter/userInfo`,
+      })
+      this.close();
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.ImproveInformation {
+  z-index: 9999;
+  position: fixed;
+  width: 100vw;
+  height: 100%;
+  left: 0;
+  bottom: 0;
+  margin: 0 auto;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  &__bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100%;
+    z-index: 6;
+    background: rgba(0, 0, 0, 0.4);
+    opacity: 0.8;
+  }
+
+  &__content {
+    position: relative;
+    box-sizing: border-box;
+    width: 80vw;
+    border-radius: 8px;
+    overflow: hidden;
+    z-index: 11;
+    background: #fff;
+    padding: 10px;
+
+    .close {
+      position: absolute;
+      right: 10px;
+      top: 10px;
+
+      i {
+        font-size: 12px;
+      }
+    }
+
+    .title {
+      font-size: 16px;
+      color: #333;
+      font-weight: bold;
+      text-align: center;
+    }
+
+    .banner {
+      margin-top: 20px;
+      background: #333;
+      height: 100px;
+    }
+
+    .bottom {
+      margin-top: 20px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+  }
+}
+</style>