{"version":3,"sources":["webpack:///./src/views/home/tiantan.vue","webpack:///./src/views/home/tiantan.vue?66bd","webpack:///./src/views/home/tiantan.vue?7c15"],"names":["class","id","muted","autoplay","src","type","alt","showFalg","nowTime","sTime","nowDate","week","components","setup","props","formatEnergyDate","dates","Date","setHours","getHours","months","getMonth","day","getDate","year","getFullYear","hours","minutes","getMinutes","getSeconds","getWeek","getDay","str","router","route","proxyData","intevell","init","myVid","document","getElementById","aniThree","aniThree5","aniThree6","skSlogan","ani1","ani2","ani3","ani4","ani5","ani51","ani52","ani53","ani54","ani6","ani7","ani8","ani82","ani83","ani84","ani85","ani86","ani87","ani88","ani9","ani10","slogan","controls","bind","fadeOut","show","addClass","updateStyle","timer","setTimeout","clearTimeout","time2","push","path","query","style","top","offsetHeight","winChange","window","addEventListener","__exports__","render"],"mappings":"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","file":"static/js/chunk-01583e5c.26fefc56.js","sourcesContent":["<template>\n  <div class=\"main\" v-if=\"showFalg\">\n    <video id=\"video1\" muted autoplay>\n      <!-- <source src=\"/sk/skImage/媒体1.mp4\" type=\"video/mp4\" /> -->\n      <source src=\"/sk/skImage/720p.mp4\" type=\"video/mp4\" />\n      您的浏览器不支持 HTML5 video 标签。\n    </video>\n\n    <div id=\"skSlogan\" class=\"skSlogan\">\n      <!-- 天坛部分 -->\n      <img id=\"ani83\" class=\"ani83\" src=\"/sk/skImage/蓝天.jpg\" alt=\"\" />\n      <img id=\"ani84\" class=\"ani84\" src=\"/sk/skImage/云朵0.png\" alt=\"\" />\n\n      <img id=\"ani85\" class=\"ani85\" src=\"/sk/skImage/鸽子1-白色.gif\" alt=\"\" />\n      <img id=\"ani86\" class=\"ani86\" src=\"/sk/skImage/鸽子2-白色.gif\" alt=\"\" />\n      <img id=\"ani87\" class=\"ani87\" src=\"/sk/skImage/鸽子1-白色.gif\" alt=\"\" />\n      <img id=\"ani88\" class=\"ani88\" src=\"/sk/skImage/鸽子2-白色.gif\" alt=\"\" />\n\n      <img id=\"ani8\" class=\"ani8\" src=\"/sk/skImage/天坛1.png\" alt=\"\" />\n      <img id=\"ani82\" class=\"ani82\" src=\"/sk/skImage/天坛2.png\" alt=\"\" />\n\n      <img id=\"ani9\" class=\"ani9\" src=\"/sk/skImage/蝴蝶2.gif\" alt=\"\" />\n      <!-- 天坛左上 -->\n      <img id=\"ani1\" class=\"ani1\" src=\"/sk/skImage/ani1.jpg\" alt=\"\" />\n      <!-- 左上鸽子 -->\n      <!-- <img id=\"ani5\" class=\"ani5\" src=\"/sk/skImage/ani5.jpg\" alt=\"\"> -->\n      <img id=\"ani51\" class=\"ani51\" src=\"/sk/skImage/鸽子1-橙色.gif\" alt=\"\" />\n      <img id=\"ani52\" class=\"ani52\" src=\"/sk/skImage/鸽子2-橙色.gif\" alt=\"\" />\n      <img id=\"ani53\" class=\"ani53\" src=\"/sk/skImage/鸽子1-橙色.gif\" alt=\"\" />\n      <img id=\"ani54\" class=\"ani54\" src=\"/sk/skImage/鸽子2-橙色.gif\" alt=\"\" />\n\n      <!-- 文字slogan -->\n      <div id=\"slogan\" class=\"slogan\">\n        <img id=\"slogan11\" class=\"slogan11\" src=\"/sk/skImage/word/幸.png\" alt=\"\" />\n        <img id=\"slogan12\" class=\"slogan12\" src=\"/sk/skImage/word/福.png\" alt=\"\" />\n\n        <img id=\"slogan21\" class=\"slogan21\" src=\"/sk/skImage/word/S.png\" alt=\"\" />\n        <img id=\"slogan22\" class=\"slogan22\" src=\"/sk/skImage/word/U.png\" alt=\"\" />\n        <img id=\"slogan23\" class=\"slogan23\" src=\"/sk/skImage/word/P.png\" alt=\"\" />\n        <img id=\"slogan24\" class=\"slogan24\" src=\"/sk/skImage/word/e.png\" alt=\"\" />\n        <img id=\"slogan25\" class=\"slogan25\" src=\"/sk/skImage/word/X.png\" alt=\"\" />\n\n        <img id=\"slogan31\" class=\"slogan31\" src=\"/sk/skImage/word/P2.png\" alt=\"\" />\n        <img id=\"slogan32\" class=\"slogan32\" src=\"/sk/skImage/word/a.png\" alt=\"\" />\n        <img id=\"slogan33\" class=\"slogan33\" src=\"/sk/skImage/word/e2.png\" alt=\"\" />\n        <img id=\"slogan34\" class=\"slogan34\" src=\"/sk/skImage/word/-.png\" alt=\"\" />\n        <img id=\"slogan35\" class=\"slogan35\" src=\"/sk/skImage/word/g.png\" alt=\"\" />\n        <img id=\"slogan36\" class=\"slogan36\" src=\"/sk/skImage/word/i.png\" alt=\"\" />\n      </div>\n\n      <img id=\"ani4\" class=\"ani4\" src=\"/sk/skImage/ani4.jpg\" alt=\"\" />\n\n      <!-- 时间部分 -->\n      <!-- <img id=\"ani2\" class=\"ani2\" src=\"/sk/skImage/ani21.jpg\" alt=\"\" />\n     -->\n      <div id=\"ani2\" class=\"ani2\">\n        <div class=\"time-top\">\n          <span>北京时间</span>\n          <span>首尔时间</span>\n        </div>\n        <div class=\"time-box\">\n          <span>{{ nowTime }}</span>\n          <span></span>\n          <span>{{ sTime }}</span>\n        </div>\n        <div class=\"time-line\"></div>\n        <div class=\"time-bottom\">\n          <img src=\"/sk/skImage/time-icon.svg\" alt=\"\" />\n          <span>{{ nowDate }}</span>\n          <div class=\"time-right\">\n            <span>{{ week }}</span>\n          </div>\n        </div>\n      </div>\n    </div>\n    <div id=\"aniThree\" class=\"aniThree\">\n      <div id=\"aniThree5\" class=\"aniThree5\"><img src=\"/sk/skImage/word/SK 1.png\" alt=\"\"></div>\n      <div id=\"aniThree6\" class=\"aniThree6\"><img src=\"/sk/skImage/word/text4.png\" alt=\"\"></div>\n    </div>\n    <!-- <div id=\"aniThree\" class=\"aniThree\">\n      <div id=\"logoLeft\" class=\"logoLeft\">\n        <img src=\"/sk/skImage/EXPOlogo.jpg\" alt=\"\" />\n      </div>\n      <div id=\"logoRight\" class=\"logoRight\">\n        <img src=\"/sk/skImage/skLogo.jpg\" alt=\"\" />\n      </div>\n      <div class=\"line\" id=\"line\"></div>\n      <div class=\"text\" id=\"text\">\n        <img src=\"/sk/skImage/text.jpg\" alt=\"\" />\n      </div>\n    </div> -->\n  </div>\n</template>\n  \n<script>\nimport { useRouter, useRoute } from \"vue-router\";\nimport { formatEnergyDate, getWeek } from \"@/utils\";\nimport $ from \"jquery\";\nimport { nextTick } from \"vue\";\nimport {\n  defineComponent,\n  reactive,\n  toRefs,\n  onMounted,\n  onBeforeUnmount,\n} from \"vue\";\nexport default defineComponent({\n  components: {},\n  setup(props) {\n    const formatEnergyDate = function (type = 1) {\n      //三目运算符\n      let dates = null;\n      if (type == 2) {\n        dates = new Date(new Date().setHours(new Date().getHours() + 1));\n      } else {\n        dates = new Date();\n      }\n      //月份下标是0-11\n      const months =\n        dates.getMonth() + 1 < 10\n          ? \"0\" + (dates.getMonth() + 1)\n          : dates.getMonth() + 1;\n      //具体的天数\n      const day =\n        dates.getDate() < 10 ? \"0\" + dates.getDate() : dates.getDate();\n      const year = dates.getFullYear();\n      const hours =\n        dates.getHours() < 10 ? \"0\" + dates.getHours() : dates.getHours();\n      // //分钟\n      const minutes =\n        dates.getMinutes() < 10 ? \"0\" + dates.getMinutes() : dates.getMinutes();\n      const seconds =\n        dates.getSeconds() < 10 ? \"0\" + dates.getSeconds() : dates.getSeconds();\n      //返回数据格式\n      return [\n        year + \"年\" + months + \"月\" + day + \"日\",\n        months + \"月\" + day + \"日\",\n        hours + \":\" + minutes,\n      ];\n    };\n    const getWeek = function () {\n      let week = new Date().getDay();\n      let str = \"\";\n      if (week == 0) {\n        str = \"星期日\";\n      } else if (week == 1) {\n        str = \"星期一\";\n      } else if (week == 2) {\n        str = \"星期二\";\n      } else if (week == 3) {\n        str = \"星期三\";\n      } else if (week == 4) {\n        str = \"星期四\";\n      } else if (week == 5) {\n        str = \"星期五\";\n      } else if (week == 6) {\n        str = \"星期六\";\n      }\n      return str;\n    };\n    const router = useRouter();\n    const route = useRoute();\n    const proxyData = reactive({\n      nowTime: formatEnergyDate()[2],\n      sTime: formatEnergyDate(2)[2],\n      nowDate: formatEnergyDate()[0],\n      intevell: null,\n      type: \"\",\n      showFalg: false,\n      week: getWeek(),\n      init() {\n        let myVid = document.getElementById(\"video1\");\n        let aniThree = document.getElementById(\"aniThree\");\n        let aniThree5 = document.getElementById(\"aniThree5\");\n        let aniThree6 = document.getElementById(\"aniThree6\");\n        let logoLeft = document.getElementById(\"logoLeft\");\n        let logoRight = document.getElementById(\"logoRight\");\n        let line = document.getElementById(\"line\");\n        let text = document.getElementById(\"text\");\n        let skSlogan = document.getElementById(\"skSlogan\");\n        let ani1 = document.getElementById(\"ani1\");\n        let ani2 = document.getElementById(\"ani2\");\n        let ani3 = document.getElementById(\"ani3\");\n        let ani4 = document.getElementById(\"ani4\");\n        let ani5 = document.getElementById(\"ani5\");\n        let ani51 = document.getElementById(\"ani51\");\n        let ani52 = document.getElementById(\"ani52\");\n        let ani53 = document.getElementById(\"ani53\");\n        let ani54 = document.getElementById(\"ani54\");\n\n        let ani6 = document.getElementById(\"ani6\");\n        let ani7 = document.getElementById(\"ani7\");\n\n        let ani8 = document.getElementById(\"ani8\");\n        let ani82 = document.getElementById(\"ani82\");\n        let ani83 = document.getElementById(\"ani83\");\n        let ani84 = document.getElementById(\"ani84\");\n        let ani85 = document.getElementById(\"ani85\");\n        let ani86 = document.getElementById(\"ani86\");\n        let ani87 = document.getElementById(\"ani87\");\n        let ani88 = document.getElementById(\"ani88\");\n\n        let ani9 = document.getElementById(\"ani9\");\n        let ani10 = document.getElementById(\"ani10\");\n\n        let slogan = document.getElementById(\"slogan\");\n\n        myVid.autoplay = true;\n        myVid.controls = false;\n\n        // 视频播放完成\n        $(myVid).bind(\"ended\", function () {\n          $(myVid).fadeOut();\n\n          // 第2部分\n          $(skSlogan).show();\n          $(ani1).addClass(\"ani1Active\");\n          $(ani2).addClass(\"ani2Active\");\n          $(ani3).addClass(\"ani3Active\");\n          $(ani4).addClass(\"ani4Active\");\n          $(ani5).addClass(\"ani5Active\");\n          $(ani51).addClass(\"ani51Active\");\n          $(ani52).addClass(\"ani52Active\");\n          $(ani53).addClass(\"ani53Active\");\n          $(ani54).addClass(\"ani54Active\");\n\n          $(ani6).addClass(\"ani6Active\");\n          $(ani7).addClass(\"ani7Active\");\n\n          $(ani8).addClass(\"ani8Active\");\n          $(ani82).addClass(\"ani82Active\");\n          $(ani83).addClass(\"ani83Active\");\n          $(ani84).addClass(\"ani84Active\");\n          $(ani85).addClass(\"ani85Active\");\n          $(ani86).addClass(\"ani86Active\");\n          $(ani87).addClass(\"ani87Active\");\n          $(ani88).addClass(\"ani88Active\");\n\n          $(ani9).addClass(\"ani9Active\");\n          $(ani10).addClass(\"ani10Active\");\n\n          $(slogan).addClass(\"sloganActive\");\n\n          proxyData.updateStyle();\n          let type = proxyData.type;\n          // 第3部分\n\n          /**\n           * 需要第三个画面的时候\n           */\n          // let timer = setTimeout(function() {\n          //   $(skSlogan).fadeOut();\n          //   // $(aniThree).show();\n          //   $(logoLeft).addClass(\"logoLeftAni\");\n          //   $(logoRight).addClass(\"logoRightAni\");\n          //   $(line).addClass(\"lineAni\");\n          //   $(text).addClass(\"lineAni\");\n          //   clearTimeout(timer);\n          //   let time2 = setTimeout(() => {\n          //     clearTimeout(time2);\n          //     console.log(\"/weather\" + \"?type=\" + type);\n          //     router.push({\n          //       path: \"/weather\",\n          //       query: { type: proxyData.type },\n          //     });\n          //   }, 30000);\n          // }, 30000);\n\n          /**\n           * 删除第三部分的时候用此代码\n           */\n          // let time2 = setTimeout(() => {\n          //   clearTimeout(time2);\n          //   console.log(\"/weather\" + \"?type=\" + type);\n          //   router.push({\n          //     path: \"/weather\",\n          //     query: { type: proxyData.type },\n          //   });\n          // }, 30000);\n          let timer = setTimeout(function () {\n            $(skSlogan).fadeOut();\n            $(aniThree).show();\n            $(aniThree).addClass(\"aniThreeActive\");\n            $(aniThree5).addClass(\"aniThreeActive5\");\n            $(aniThree6).addClass(\"aniThreeActive6\");\n            // $(logoLeft).addClass(\"logoLeftAni\");\n            // $(logoRight).addClass(\"logoRightAni\");\n            // $(line).addClass(\"lineAni\");\n            // $(text).addClass(\"lineAni\");\n            clearTimeout(timer);\n            let time2 = setTimeout(() => {\n              clearTimeout(time2);\n              router.push({\n                path: \"/weather\",\n                query: { type: proxyData.type },\n              });\n            }, 30000);\n          }, 15000);\n        });\n      },\n      // 动态修改样式\n      updateStyle() {\n        let ani1 = document.getElementById(\"ani1\");\n        let ani2 = document.getElementById(\"ani2\");\n        if (ani1 && ani2) {\n          ani2.style.top = ani1.offsetHeight - ani1.offsetHeight * 0.014 + \"px\";\n        }\n        // let line = document.getElementById(\"line\");\n        // let text = document.getElementById(\"text\");\n        // line.style.height = logoLeft.offsetHeight + \"px\";\n        // text.style.top = logoLeft.offsetHeight + logoLeft.offsetTop + 20 + \"px\";\n      },\n      // 窗口变化的时候调整适配\n      winChange() {\n        window.addEventListener(\n          \"resize\",\n          function () {\n            proxyData.updateStyle();\n          },\n          false\n        );\n      },\n    });\n    onBeforeUnmount(() => { });\n    onMounted(() => {\n      let type = route.query.type;\n      proxyData.type = type;\n      console.log(proxyData.type);\n      proxyData.showFalg = true;\n      nextTick(() => {\n        proxyData.init();\n        setTimeout(() => {\n          proxyData.updateStyle();\n        }, 200);\n        proxyData.winChange();\n      });\n    });\n    return {\n      ...toRefs(proxyData),\n    };\n  },\n});\n</script>\n  \n<style lang=\"scss\" scoped>\n* {\n  margin: 0px;\n  padding: 0px;\n  box-sizing: border-box;\n  overflow: hidden;\n}\n#video1 {\n  width: 100vw;\n  height: 100vh;\n  position: absolute;\n}\n\n/* 第3部分动画 */\n.aniThree {\n  display: none;\n  width: 100%;\n  height: 100%;\n  position: absolute;\n}\n.aniThreeActive {\n  display: block;\n}\n.aniThree5 {\n  opacity: 0;\n  margin-top: 330px;\n  margin-bottom: 60px;\n  display: flex;\n  justify-content: center;\n}\n.aniThreeActive5 {\n  animation: aniThreeActive5 1.5s ease-in-out 0.1s forwards;\n}\n@keyframes aniThreeActive5 {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.aniThree6 {\n  opacity: 0;\n  justify-content: center;\n  display: flex;\n}\n.aniThreeActive6 {\n  animation: aniThreeActive6 1.5s ease-in-out 0.9s forwards;\n}\n@keyframes aniThreeActive6 {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.logoLeft {\n  top: 20vh;\n  position: absolute;\n  opacity: 0;\n}\n.logoLeft img {\n  height: 400px;\n}\n.logoLeftAni {\n  opacity: 1;\n  animation: logoLeftAni 0.6s ease-in-out forwards;\n}\n\n.logoRight {\n  top: 20vh;\n  position: absolute;\n  opacity: 0;\n}\n.logoRight img {\n  height: 400px;\n  // width: 26vw;\n}\n.logoRightAni {\n  opacity: 1;\n  animation: logoRightAni 0.6s ease-in-out forwards;\n}\n\n@keyframes logoLeftAni {\n  0% {\n    opacity: 0;\n    // transform: translate(860px, 0px);\n    transform: translate(44.7vw, 0px);\n  }\n  100% {\n    opacity: 1;\n    // transform: translate(460px, 0px);\n    transform: translate(24vw, 0px);\n  }\n}\n\n@keyframes logoRightAni {\n  0% {\n    opacity: 0;\n    // transform: translate(860px, 0px);\n    transform: translate(44.7vw, 0px);\n  }\n  100% {\n    opacity: 1;\n    // transform: translate(1000px, 0px);\n    transform: translate(52vw, 0px);\n  }\n}\n\n.line {\n  opacity: 0;\n  position: absolute;\n  top: 20vh;\n  left: 52vw;\n  height: 41vh;\n  width: 4px;\n  background-color: #ccc;\n}\n.lineAni {\n  animation: lineShow 1s forwards;\n}\n@keyframes lineShow {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n\n.text {\n  opacity: 0;\n  position: absolute;\n  // height: 18.5vh;\n  width: 36.4vw;\n  // top: 75vh;\n  left: 50%;\n  transform: translateX(-50%);\n}\n.text img {\n  // height: 200px;\n  width: 100%;\n}\n.lineAni {\n  animation: lineShow 1s forwards;\n}\n\n/* 第2部分动画 */\n.skSlogan {\n  /* display: none; */\n  width: 100vw;\n  height: 100vh;\n  position: absolute;\n}\n.skSloganActive {\n  display: block;\n}\n/* 天坛左上 */\n.ani1 {\n  width: 43%;\n  opacity: 0;\n  top: 0;\n  position: absolute;\n}\n.ani1Active {\n  animation: ani1Active 1s ease-in-out 4.7s forwards;\n}\n@keyframes ani1Active {\n  0% {\n    opacity: 0;\n    /* transform:translate(-700px,-200px) ; */\n  }\n  100% {\n    opacity: 1;\n    /* transform:translate(0px,0px) ; */\n  }\n}\n\n.ani3 {\n  opacity: 0;\n  // top: 180px;\n  // left: 975px;\n  width: 29.9%;\n  top: 9.25%;\n  left: 11.45%;\n  position: absolute;\n}\n.ani3Active {\n  animation: ani3Active 1s ease-in-out 4.8s forwards;\n}\n@keyframes ani3Active {\n  0% {\n    opacity: 0;\n    transform: translate(100px, 0px);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(0px, 0px);\n  }\n}\n\n.ani2 {\n  opacity: 0;\n  font-size: 0;\n  left: 10.4vw;\n  position: absolute;\n  .time-top {\n    // display: flex;\n    // justify-content: space-between;\n    span {\n      display: inline-block;\n      font-size: 34px;\n      color: #7e7e82;\n      &:nth-child(1) {\n        padding-left: 10px;\n        margin-right: 8.2vw;\n      }\n    }\n  }\n  .time-line {\n    margin: 0 auto;\n    margin-top: 0.7vh;\n    margin-bottom: 0.7vh;\n    // width: 440px;\n    width: 95%;\n    height: 1px;\n    background: #cacaca;\n  }\n  .time-bottom {\n    display: inline-block;\n    vertical-align: middle;\n    font-size: 34px;\n    padding-left: 10px;\n    color: #7e7e82;\n    img {\n      display: inline-block;\n      vertical-align: middle;\n      width: 34px;\n      height: 34px;\n    }\n    span {\n      display: inline-block;\n      vertical-align: middle;\n      font-size: 34px;\n      padding-left: 15px;\n    }\n    .time-right {\n      display: inline-block;\n      margin-top: -2px;\n      vertical-align: middle;\n      font-size: 34px;\n      padding-left: 20px;\n    }\n  }\n  .time-box {\n    padding-top: 0.1vh;\n    font-size: 70px;\n    font-family: \"HarmonyOS Sans TC\";\n    color: #ff7a00;\n    span {\n      display: inline-block;\n      vertical-align: middle;\n      &:nth-child(2) {\n        margin-left: 52px;\n        margin-right: 52px;\n        height: 45px;\n        border-left: 1px solid #cacaca;\n      }\n    }\n  }\n}\n.ani2Active {\n  animation: ani2Active 1s ease-in-out 4.8s forwards;\n}\n@keyframes ani2Active {\n  0% {\n    opacity: 0;\n    transform: translate(-20px, 0px);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(0px, 0px);\n  }\n}\n\n.ani4 {\n  opacity: 0;\n  // top: 95px;\n  top: 8vh;\n  right: 120px;\n  width: 138px;\n  opacity: 0;\n  position: absolute;\n}\n.ani4Active {\n  animation: ani4Active 1s ease-in-out 4.8s forwards;\n}\n@keyframes ani4Active {\n  0% {\n    opacity: 0;\n    transform: translate(50px, 0px);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(0px, 0px);\n  }\n}\n\n/* 左上鸽子 */\n.ani5 {\n  opacity: 0;\n  // top: -80px;\n  top: -7.4vw;\n  // left: 700px;\n  left: 36.4vw;\n  position: absolute;\n}\n.ani5Active {\n  animation: ani5Active 3s infinite ease-in-out 5s forwards;\n}\n@keyframes ani5Active {\n  0% {\n    opacity: 0;\n    transform: translate(0px, 0px);\n  }\n  40% {\n    opacity: 1;\n    // transform: translate(-300px, 150px);\n    transform: translate(-15.625vw, 13.8vh);\n  }\n  100% {\n    opacity: 1;\n    // transform: translate(-800px, 200px);\n    transform: translate(-41.67vw, 18.5vh);\n  }\n}\n\n.ani51 {\n  opacity: 0;\n  // top: -80px;\n  // left: 680px;\n  top: -7.4vh;\n  left: 680px;\n  transform: scale(0.2);\n  position: absolute;\n}\n.ani51Active {\n  animation: ani51Active 5s infinite ease-in-out 5s forwards;\n}\n@keyframes ani51Active {\n  0% {\n    opacity: 0;\n    transform: translate(0px, 0px) scale(0.2);\n  }\n  40% {\n    opacity: 1;\n    transform: translate(-160px, 120px) scale(0.2);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(-900px, 80px) scale(0.2);\n  }\n}\n.ani52 {\n  opacity: 0;\n  top: -80px;\n  left: 720px;\n  transform: scale(0.5);\n\n  position: absolute;\n}\n.ani52Active {\n  animation: ani52Active 5s infinite ease-in-out 5s forwards;\n}\n@keyframes ani52Active {\n  0% {\n    opacity: 0;\n    transform: translate(0px, 0px) scale(0.5);\n  }\n  40% {\n    opacity: 1;\n    transform: translate(-210px, 160px) scale(0.5);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(-900px, 160px) scale(0.5);\n  }\n}\n.ani53 {\n  opacity: 0;\n  top: -80px;\n  left: 800px;\n  transform: scale(0.6);\n\n  position: absolute;\n}\n.ani53Active {\n  animation: ani53Active 5s infinite ease-in-out 5s forwards;\n}\n@keyframes ani53Active {\n  0% {\n    opacity: 0;\n    transform: translate(0px, 0px) scale(0.6);\n  }\n  40% {\n    opacity: 1;\n    transform: translate(-240px, 210px) scale(0.6);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(-1000px, 170px) scale(0.6);\n  }\n}\n\n.ani54 {\n  opacity: 0;\n  transform: scale(0.5);\n  top: -80px;\n  left: 770px;\n  position: absolute;\n}\n.ani54Active {\n  animation: ani54Active 5s infinite ease-in-out 5s forwards;\n}\n@keyframes ani54Active {\n  0% {\n    opacity: 0;\n    transform: translate(0px, 0px) scale(0.5);\n  }\n  40% {\n    opacity: 1;\n    transform: translate(-150px, 130px) scale(0.5);\n  }\n  100% {\n    opacity: 1;\n    transform: translate(-900px, 100px) scale(0.5);\n  }\n}\n\n.ani6 {\n  opacity: 0;\n  top: 500px;\n  left: -100px;\n  position: absolute;\n}\n.ani6Active {\n  animation: ani6Active 1.4s ease-in-out forwards;\n}\n@keyframes ani6Active {\n  0% {\n    opacity: 1;\n    transform: translate(-100px, 500px), scale(1.5);\n\n    /* top: 800px;\n        left: -500px; */\n  }\n  10% {\n    opacity: 1;\n    transform: translate(300px, -460px), scale(2);\n    /* top: 100px;\n        left: 400px; */\n  }\n  70% {\n    opacity: 1;\n    transform: translate(300px, -460px) scale(2);\n    /* top: 100px;\n        left: 400px; */\n  }\n  100% {\n    opacity: 1;\n    transform: translate(-260px, -720px) scale(1);\n    /* top: -223px;\n        left: -360px; */\n  }\n}\n\n.ani7 {\n  opacity: 0;\n  top: 87px;\n  left: 159px;\n  position: absolute;\n}\n.ani7Active {\n  animation: ani7Active 1s ease-in-out 1.1s forwards;\n}\n@keyframes ani7Active {\n  0% {\n    opacity: 0;\n  }\n  100% {\n    opacity: 1;\n  }\n}\n/* 天坛-完整 */\n.ani8 {\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  // width: 100vw;\n  top: 0px;\n}\n.ani8Active {\n  animation: ani8Active 5s ease-in-out forwards;\n}\n@keyframes ani8Active {\n  0% {\n    opacity: 0;\n  }\n  5% {\n    opacity: 1;\n  }\n  80% {\n    transform: translate(0px, 0px);\n\n    opacity: 1;\n  }\n  100% {\n    transform: translate(-563px, -238px) scale(0.58);\n    opacity: 1;\n  }\n}\n.ani82 {\n  // top: 60px;\n  // top:1vh;\n  top: 0;\n  position: absolute;\n  opacity: 0;\n  width: 100%;\n  z-index: 99;\n}\n.ani82Active {\n  animation: ani82Active 5s ease-in-out forwards;\n}\n@keyframes ani82Active {\n  0% {\n    opacity: 0;\n  }\n  5% {\n    opacity: 1;\n  }\n  80% {\n    transform: translate(0px, 0px);\n\n    opacity: 1;\n  }\n  90% {\n    transform: translate(0px, 0px);\n\n    opacity: 0;\n  }\n  100% {\n    transform: translate(-500px, -200px) scale(0.75);\n    opacity: 0;\n  }\n}\n/* 蓝天 */\n.ani83 {\n  top: 0px;\n  left: 0px;\n  position: absolute;\n  opacity: 0;\n  // width: 1920px;\n  width: 100%;\n}\n.ani83Active {\n  animation: ani82Active 5s ease-in-out forwards;\n}\n\n/* 云0 */\n.ani84 {\n  top: 26px;\n  left: 0;\n  position: absolute;\n  opacity: 0;\n}\n.ani84Active {\n  animation: ani84Active 4.8s ease-in-out forwards;\n}\n@keyframes ani84Active {\n  0% {\n    opacity: 1;\n    transform: translate(300px, 0px);\n  }\n  90% {\n    transform: translate(200px, 0px);\n    opacity: 1;\n  }\n  100% {\n    transform: translate(200px, 0px);\n    opacity: 0;\n  }\n}\n/* 鸽子0 */\n.ani85 {\n  top: 50px;\n  left: 1200px;\n  position: absolute;\n  opacity: 0;\n  transform: scale(0.2);\n}\n.ani85Active {\n  animation: ani85Active 4.6s ease-in-out forwards;\n}\n@keyframes ani85Active {\n  0% {\n    opacity: 1;\n    transform: translate(0px, 0px) scale(0.2);\n  }\n  90% {\n    opacity: 1;\n    // transform: translate(-30px, 80px) scale(0.2);\n    transform: translate(-30px, 7.4vh) scale(0.2);\n  }\n  100% {\n    // transform: translate(-100px, -50px) scale(0.2);\n    transform: translate(-100px, -4.6vh) scale(0.2);\n    opacity: 0;\n  }\n}\n\n.ani86 {\n  // top: 30px;\n  // left: 1280px;\n  top: 2.78vh;\n  left: 66.67vw;\n  position: absolute;\n  opacity: 0;\n  transform: scale(0.5);\n}\n.ani86Active {\n  animation: ani86Active 4.6s ease-in-out forwards;\n}\n@keyframes ani86Active {\n  0% {\n    opacity: 1;\n    transform: translate(0px, 0px) scale(0.5);\n  }\n  90% {\n    opacity: 1;\n    // transform: translate(-150px, 180px) scale(0.5);\n    transform: translate(-150px, 16.67vh) scale(0.5);\n  }\n  100% {\n    // transform: translate(-540px, -150px) scale(0.5);\n    transform: translate(-540px, -13.89vh) scale(0.5);\n    opacity: 0;\n  }\n}\n\n.ani87 {\n  // top: 130px;\n  // left: 1270px;\n  top: 12.04vh;\n  left: 66%;\n  position: absolute;\n  opacity: 0;\n  transform: scale(0.7);\n}\n.ani87Active {\n  animation: ani87Active 4.6s ease-in-out forwards;\n}\n@keyframes ani87Active {\n  0% {\n    opacity: 1;\n    transform: translate(0px, 0px) scale(0.7);\n  }\n  90% {\n    opacity: 1;\n    // transform: translate(-100px, 150px) scale(0.7);\n    transform: translate(-100px, 13.89vh) scale(0.7);\n  }\n  100% {\n    transform: translate(-330px, -4.63vh) scale(0.7);\n    opacity: 0;\n  }\n}\n.ani88 {\n  // top: 90px;\n  // left: 1350px;\n  top: 8.34vh;\n  left: 70%;\n  position: absolute;\n  opacity: 0;\n  transform: scale(0.5);\n}\n.ani88Active {\n  animation: ani88Active 4.6s ease-in-out forwards;\n}\n@keyframes ani88Active {\n  0% {\n    opacity: 1;\n    transform: translate(0px, 0px) scale(0.5);\n  }\n  90% {\n    opacity: 1;\n    // transform: translate(-80px, 120px) scale(0.5);\n    transform: translate(-80px, 11.1vh) scale(0.5);\n  }\n  100% {\n    transform: translate(-380px, -4.63vh) scale(0.5);\n    opacity: 0;\n  }\n}\n\n/* 蝴蝶飞舞 */\n.ani9 {\n  position: absolute;\n  opacity: 0;\n  /* left:0px;\n      top: 0px; */\n  transform: translate(0, 0) rotate(30deg);\n}\n.ani9Active {\n  animation: ani9Active 5s ease-in-out forwards;\n}\n@keyframes ani9Active {\n  0% {\n    opacity: 0;\n    /* left:-500px;\n        top: 0px; */\n    // transform: translate(-600px, 300px) rotate(60deg) scale(1.5);\n    transform: translate(-600px, 2.78vh) rotate(60deg) scale(1.5);\n  }\n\n  40% {\n    opacity: 1;\n    /* left:-500px;\n        top: 0px; */\n    // transform: translate(700px, 100px) rotate(60deg) scale(0.15);\n    transform: translate(700px, 9.26vh) rotate(60deg) scale(0.15);\n  }\n  60% {\n    opacity: 1;\n    /* left:-500px;\n        top: 0px; */\n    // transform: translate(700px, -100px) rotate(-50deg) scale(0.15);\n    transform: translate(700px, -9.26vh) rotate(-50deg) scale(0.15);\n  }\n  80% {\n    opacity: 1;\n    transform: translate(500px, -18.5vh) rotate(-60deg) scale(0.1);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(0px, -18.5vh) rotate(-60deg) scale(0.1);\n  }\n}\n\n.ani10 {\n  width: 100vw;\n  opacity: 0;\n  position: absolute;\n}\n.ani10Active {\n  animation: ani10Active 0.5s ease-in-out 6s forwards;\n}\n@keyframes ani10Active {\n  0% {\n    // top: 700px;\n    top: 64.8vh;\n    left: 0px;\n    opacity: 1;\n  }\n  100% {\n    top: 0px;\n    left: 0px;\n    opacity: 1;\n  }\n}\n</style>\n  ","import { render } from \"./tiantan.vue?vue&type=template&id=285a81d8&scoped=true\"\nimport script from \"./tiantan.vue?vue&type=script&lang=js\"\nexport * from \"./tiantan.vue?vue&type=script&lang=js\"\n\nimport \"./tiantan.vue?vue&type=style&index=0&id=285a81d8&lang=scss&scoped=true\"\n\nimport exportComponent from \"/Users/jing/work/sagacare/sagaclound-sagacare-sk/node_modules/vue-loader-v16/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-285a81d8\"]])\n\nexport default __exports__","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../node_modules/style-resources-loader/lib/index.js??ref--8-oneOf-1-4!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader-v16/dist/index.js??ref--0-1!./tiantan.vue?vue&type=style&index=0&id=285a81d8&lang=scss&scoped=true\""],"sourceRoot":""}