提交

src/config/page.json

@@ -19,5 +19,8 @@
     },
     "WorldCupDetail": {
         "title": "参赛选手"
+    },
+    "SilkRoadSpringFestivalGala":{
+        "title": "丝路春晚"
     }
 }

src/view/SilkRoadSpringFestivalGala/index.js

@@ -0,0 +1,55 @@
+import App from "./index.vue";
+import "@/assets/js/common";
+import { createApp } from "vue";
+import { getUser } from "@/utils/tool.js";
+import { getPageParameters, environment } from "../../config/pageConfig";
+// 判断环境
+environment();
+window.$originData = getPageParameters();
+document.title = window.$originData.orginParames.title || "";
+// 分享
+window.weixin_Share_Init(
+  "丝路春晚",
+  "这是丝路春晚",
+  "https://cxzx.smcic.net/topic/highSpeed/img/logo3.png",
+  "https://cxzx.smcic.net/topic/activity/WorldCup.html?" + Date.now()
+);
+
+window.SL = new window.SmcicLogger("shanshipin", "c6124d95");
+window.SL.Util.SetUrl("https://collect.smcic.net:8443/");
+window.SL.Systematic.Init({
+  appid: "c6124d95",
+  channel: "shanshipin",
+  model: "",
+  os: "",
+  os_version: "",
+  carrier: "",
+  network_type: "",
+  ip: "",
+  app_name: "",
+  app_version: "",
+  build_version: "",
+  platform_type: "",
+});
+window.SL.Content.CommodityDetail({
+  commodity_detail_source: "活动",
+  commodity_id: "",
+  commodity_name: document.title,
+  publisher_name: "",
+  publisher_id: "",
+  review_count: 0,
+  comment_count: 0,
+  collect_count: 0,
+  share_count: 0,
+  like_count: 0,
+  tag: [],
+});
+
+!window.$shanshipin || !window.$shanshipin.Phone
+  ? getUser(() => createApp(App).mount("#app"))
+  : createApp(App).mount("#app");
+
+window.setUserSession = () => {
+  console.log("登录");
+  getUser(() => createApp(App).mount("#app"));
+};

src/view/SilkRoadSpringFestivalGala/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <div class="SilkRoadSpringFestivalGala">
+    <div class="screen first" v-if="showFirst">
+      <div class="first_text">
+        <p v-for="v in first_text_view" :key="v">
+          <span v-for="val in v" v-text="val" :key="val"></span>
+        </p>
+      </div>
+    </div>
+    <div class="screen">
+        
+    </div>
+    <div class="screen">3</div>
+    <div class="screen">4</div>
+    <div class="screen">5</div>
+    <div class="screen">6</div>
+  </div>
+</template>
+<script setup>
+// import { onMounted, reactive } from "vue";
+import { reactive, ref } from "vue";
+// import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
+/**
+ * window.$originData.orginParames.title 页面标题
+ * window.$originData.orginParames.parameters 固定参数值
+ * window.$originData.urlParames url参数
+ */
+console.log(window.$originData);
+let first_text = ['"大美中国·多彩丝路"', "2023丝路春晚 联名限定"];
+const showFirst = ref(true);
+for (let i = 0; i < first_text.length; i++) {
+  first_text[i] = first_text[i].split("");
+}
+const first_text_view = reactive(first_text);
+let time = setTimeout(() => {
+  clearTimeout(time);
+  showFirst.value = false;
+}, 5000);
+
+
+
+</script>
+<style lang="scss" scoped>
+@import url(https://cxzx.smcic.net/topic/tool/css/swiper-bundle8.4.4.min.css);
+.SilkRoadSpringFestivalGala {
+  width: 100vw;
+  height: 100vh;
+  overflow: hidden;
+  font-weight: 400;
+  .screen {
+    width: 100%;
+    height: 100%;
+  }
+  .first {
+    background-color: #000000;
+    position: relative;
+    transition: all 5s;
+    opacity: 1;
+    .first_text {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 100%;
+      transform: translate(-50%, -50%);
+      color: #ffffff;
+      text-align: center;
+      letter-spacing: 0.2rem;
+      font-size: 1.2rem;
+      font-family: Lato, serif;
+      text-transform: uppercase;
+      p {
+        margin-top: 5px;
+        span {
+          animation: rainbow 50s alternate infinite forwards;
+        }
+      }
+    }
+  }
+}
+
+@keyframes rainbow {
+  @for $i from 0 through 20 {
+    #{percentage($i * 0.05)} {
+      color: hsl(random(360%), 75, 75);
+    }
+  }
+}
+</style>