团购秒杀

2024-03-14 22:58:38 +08:00
parent 9dda08a1b1
commit 7a3dd0fae8
11 changed files with 347 additions and 11 deletions
--- a/src/pages/mine/subs/components/official-account-dialog.vue
+++ b/src/pages/mine/subs/components/official-account-dialog.vue
@@ -0,0 +1,79 @@
+<template>
+
+  <uni-popup type='bottom' ref='popupRef' :mask-click='false' @touchmove.stop.prevent=''>
+    <view class='popup-content c-flex-column'>
+      <view class='c-flex-row'>
+        <text>关注公众号</text>
+        <image :src='assetsUrl("ic_close.png")' @click.stop='close()' />
+      </view>
+
+      <image class='qrcode' :src='assetsUrl("test_bg.png")' />
+
+      <text class='tips'>长按关注会员中心公众号
+        获得更多优惠和服务信息
+      </text>
+    </view>
+  </uni-popup>
+</template>
+
+<script lang='ts' setup>
+import { assetsUrl } from '@/utils/assets';
+
+const popupRef = ref();
+const show = () => {
+  popupRef.value.open();
+};
+
+const close = () => {
+  popupRef.value.close();
+};
+
+defineExpose({ show });
+
+</script>
+
+<style lang='scss' scoped>
+.popup-content {
+  background: #FFFFFF;
+  border-radius: 20rpx 20rpx 0 0;
+  padding: 38rpx 45rpx 140rpx 45rpx;
+
+  view:nth-of-type(1) {
+    display: flex;
+    margin-bottom: 70rpx;
+    position: relative;
+
+    image {
+      width: 35rpx;
+      height: 35rpx;
+      align-self: flex-start;
+    }
+
+    text {
+      font-weight: bold;
+      font-size: 30rpx;
+      color: #333333;
+      position: absolute;
+      left: 0;
+      right: 0;
+      text-align: center;
+    }
+  }
+
+  .qrcode {
+    width: 377rpx;
+    height: 377rpx;
+    margin-top: 50rpx;
+    align-self: center;
+  }
+
+  .tips {
+    font-weight: bold;
+    font-size: 30rpx;
+    color: #333333;
+    margin-top: 10rpx;
+    margin-bottom: 104rpx;
+  }
+
+}
+</style>