登入好礼活动完成静态页面，暂存

view/molistar/activity/2024-loginGift/css/index.css

@@ -0,0 +1,141 @@
+html,
+body {
+  width: 100%;
+  background: #E1E7FE;
+}
+
+.back {
+  position: fixed;
+  top: 0.93333rem;
+  left: 0.45333rem;
+  z-index: 99;
+  width: 0.82667rem;
+  height: 0.82667rem;
+}
+
+.back img {
+  width: 100%;
+  height: 100%;
+}
+
+.back p {
+  color: #fff;
+  font-size: 0.42667rem;
+  position: absolute;
+  width: 9rem;
+  left: 0;
+  top: 0;
+  height: 100%;
+  text-align: center;
+  line-height: 0.82667rem;
+}
+
+.header {
+  width: 10rem;
+  height: 11.70667rem;
+  position: relative;
+  margin: 0 auto;
+  background: url(../images/header.png) no-repeat 100% 100%;
+  background-size: 100% 100%;
+}
+
+.header .hader_title {
+  width: 10rem;
+  height: 14rem;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  top: 0.85333rem;
+}
+
+.box1 {
+  width: 9.90667rem;
+  height: 17.10667rem;
+  background: url(../images/box1.png) no-repeat;
+  background-size: 100% 100%;
+  position: relative;
+  margin: -1.2rem auto 0rem;
+}
+
+.box1 .signInIcon {
+  width: 2.05333rem;
+  height: 1.64rem;
+  position: absolute;
+  display: none;
+}
+
+.box1 .signInIcon1 {
+  left: 4.04rem;
+  bottom: 12.42667rem;
+}
+
+.box1 .signInIcon2 {
+  left: 0.86667rem;
+  bottom: 10.69333rem;
+}
+
+.box1 .signInIcon3 {
+  left: 6.93333rem;
+  bottom: 10.69333rem;
+}
+
+.box1 .signInIcon4 {
+  left: 3.92rem;
+  bottom: 8.18667rem;
+}
+
+.box1 .signInIcon5 {
+  left: 0.93333rem;
+  bottom: 5.93333rem;
+}
+
+.box1 .signInIcon6 {
+  left: 7rem;
+  bottom: 5.92rem;
+}
+
+.box1 .signInIcon7 {
+  left: 3.92rem;
+  bottom: 3.52rem;
+}
+
+.box1 .signInIconActive {
+  display: block;
+}
+
+.box1 .butBox {
+  width: 7.6rem;
+  height: 1.33333rem;
+  display: flex;
+  justify-content: space-between;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: 1.33333rem;
+}
+
+.box1 .butBox img {
+  width: 3.70667rem;
+  display: block;
+}
+
+.box2 {
+  width: 9.77333rem;
+  height: 8.41333rem;
+  display: block;
+  margin: 0 auto;
+}
+
+.box3 {
+  width: 9.77333rem;
+  height: 15.45333rem;
+  display: block;
+  margin: 0 auto;
+}
+
+.box4 {
+  width: 9.77333rem;
+  height: 5.44rem;
+  display: block;
+  margin: 0 auto;
+}

view/molistar/activity/2024-loginGift/css/index.scss

@@ -0,0 +1,145 @@
+@function px2rem($px) {
+    @return $px / 75+rem;
+}
+
+html,
+body {
+    width: 100%;
+    background: #E1E7FE;
+}
+
+.back {
+    position: fixed;
+    top: px2rem(70);
+    left: px2rem(34);
+    z-index: 99;
+    width: px2rem(62);
+    height: px2rem(62);
+
+    img {
+        width: 100%;
+        height: 100%;
+    }
+
+    p {
+        color: #fff;
+        font-size: px2rem(32);
+        position: absolute;
+        width: 9rem;
+        left: 0;
+        top: 0;
+        height: 100%;
+        text-align: center;
+        line-height: px2rem(62);
+    }
+}
+
+.header {
+    width: px2rem(750);
+    height: px2rem(878);
+    position: relative;
+    margin: 0 auto;
+    background: url(../images/header.png) no-repeat 100% 100%;
+    background-size: 100% 100%;
+
+    .hader_title {
+        width: px2rem(750);
+        height: px2rem(1050);
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        top: px2rem(64);
+    }
+}
+
+.box1 {
+    width: px2rem(743);
+    height: px2rem(1283);
+    background: url(../images/box1.png) no-repeat;
+    background-size: 100% 100%;
+    position: relative;
+    margin: -1.2rem auto px2rem(0);
+
+    .signInIcon {
+        width: px2rem(154);
+        height: px2rem(123);
+        position: absolute;
+        display: none;
+    }
+
+    .signInIcon1 {
+        left: px2rem(303);
+        bottom: px2rem(932);
+    }
+
+    .signInIcon2 {
+        left: px2rem(65);
+        bottom: px2rem(802);
+    }
+
+    .signInIcon3 {
+        left: px2rem(520);
+        bottom: px2rem(802);
+    }
+
+    .signInIcon4 {
+        left: px2rem(294);
+        bottom: px2rem(614);
+    }
+
+    .signInIcon5 {
+        left: px2rem(70);
+        bottom: px2rem(445);
+    }
+
+    .signInIcon6 {
+        left: px2rem(525);
+        bottom: px2rem(444);
+    }
+
+    .signInIcon7 {
+        left: px2rem(294);
+        bottom: px2rem(264);
+    }
+
+    .signInIconActive {
+        display: block;
+    }
+
+    .butBox {
+        width: px2rem(570);
+        height: px2rem(100);
+        display: flex;
+        justify-content: space-between;
+        position: absolute;
+        left: 50%;
+        transform: translateX(-50%);
+        bottom: px2rem(100);
+
+        img {
+            width: px2rem(278);
+            display: block;
+        }
+    }
+}
+
+.box2 {
+    width: px2rem(733);
+    height: px2rem(631);
+    display: block;
+    margin: 0 auto;
+}
+
+.box3 {
+    width: px2rem(733);
+    height: px2rem(1159);
+    display: block;
+    margin: 0 auto;
+}
+
+.box4 {
+    width: px2rem(733);
+    height: px2rem(408);
+    display: block;
+    margin: 0 auto;
+}

view/molistar/activity/2024-loginGift/index.html

@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>百万福利</title>
+    <link rel="stylesheet" href="../../common/css/reset.css">
+    <link rel="stylesheet" href="./css/index.css">
+</head>
+
+<body>
+    <!-- 頂部返回 -->
+    <div class="back">
+        <img src="./images/travel/back.png" alt="">
+    </div>
+    <!-- 头部 -->
+    <div class="header">
+        <img src="./images/hader_title.png" alt="" class="hader_title">
+    </div>
+    <!-- 登入送好礼 -->
+    <div class="box1">
+        <!-- <img src="./images/signInImg.png" alt="" class="signInIcon"> -->
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon1 signInIconActive">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon2">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon3">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon4">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon5">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon6">
+        <img src="./images/signInOut.png" alt="" class="signInIcon signInIcon7">
+        <div class="butBox">
+            <img src="./images/notSignInR.png" alt="" class="but1">
+            <img src="./images/notSignIn.png" alt="" class="but2">
+        </div>
+    </div>
+    <!-- 疯狂动物园 -->
+    <img src="./images/box2.png" alt="" class="box2">
+    <!-- 许愿之星 -->
+    <img src="./images/box3.png" alt="" class="box3">
+    <!-- 活动说明 -->
+    <img src="./images/box4.png" alt="" class="box4">
+</body>
+
+</html>
+<script src="../../common/js/flexible.js"></script>
+<script src="../../common/js/jquery-3.2.1.min.js"></script>
+<script src="../../common/js/common2.js"></script>
+<script src="../../common/js/layer.js"></script>
+<script src="../../common/js/vconsole.min.js"></script>
+<script src="../../common/js/route-constant.js"></script>
+<script src="./js/index.js"></script>

view/molistar/activity/2024-loginGift/js/index.js

@@ -0,0 +1,69 @@
+let urlPrefix = getUrlPrefix()
+let browser = checkVersion()
+let env = EnvCheck();
+if (env == 'test') {
+    new VConsole();
+}
+// 封裝layer消息提醒框
+let layerIndex
+const showLoading = (content = '加載中...') => {
+    layer.open({
+        type: 2,
+        shadeClose: false,
+        content,
+        success(e) {
+            layerIndex = $(e).attr('index')
+        }
+    })
+}
+const hideLoading = (index) => {
+    layer.close(index)
+}
+const toastMsg = (content = '操作完成', time = 2) => {
+    layer.open({
+        content,
+        time,
+        skin: 'msg'
+    })
+}
+// 初始化函數
+$(function () {
+    getInfoFromClient()
+    setTimeout(function () {
+        // 頁面全屏
+        if (browser.app) {
+            if (browser.android) {
+                window.androidJsObj.initShowNav(false)
+            } else {
+                window.webkit.messageHandlers.initShowNav.postMessage(0)
+            }
+        };
+        // 頂部返回事件
+        $('.back').click(() => {
+            if (browser.android) {
+                window.androidJsObj.closeWebView()
+            } else {
+                window.webkit.messageHandlers.closeWebView.postMessage(null)
+            }
+        })
+    }, 100)
+})
+// 獲取配置接口
+function getConfig() {
+    showLoading()
+    networkRequest({
+        type: 'GEt',
+        url: urlPrefix + '',
+        success(res) {
+            if (res.code === 200) {
+            } else {
+                toastMsg(res.message)
+            }
+            hideLoading(layerIndex)
+        },
+        error(err) {
+            hideLoading(layerIndex)
+            toastMsg('網絡錯誤，請退出重進')
+        }
+    })
+}