取消导入tween；一修改为二。

4 weeks ago · 733c41db7c
3 changed files with 62 additions and 79 deletions
--- a/index.html
+++ b/index.html
@ -7,7 +7,7 @@
    <title>Vite + Vue</title>
  </head>
  <body>
-    <script src="/src/utils/tween.min.js"></script>
+    <!-- <script src="/src/utils/tween.min.js"></script> -->

    <div id="app"></div>
    <script type="module" src="/src/main.js"></script>
--- a/src/views/choujiang/hxl-cj/cj.vue
+++ b/src/views/choujiang/hxl-cj/cj.vue
@ -11,17 +11,9 @@
    <div class="leftBar">
      <el-scrollbar id="prizeBar">
        <ul class="prize-list">
-          <li
-            v-for="item in prizes"
-            :key="item.type"
-            :id="`prize-item-${item.type}`"
-            :class="['prize-item']"
-            @click="lookPrize(item)"
-          >
-            <div
-              v-if="item.isLook"
-              style="display: flex; width: 100%; height: 100%"
-            >
+          <li v-for="item in prizes" :key="item.type" :id="`prize-item-${item.type}`" :class="['prize-item']"
+            @click="lookPrize(item)">
+            <div v-if="item.isLook" style="display: flex; width: 100%; height: 100%">
              <span></span><span></span><span></span><span></span>
              <div class="prize-img">
                <img :src="item.img" :alt="item.title" />
@ -35,27 +27,17 @@
                </div>
                <div class="prize-count">
                  <div class="progress">
-                    <div
-                      :id="`prize-bar-${item.type}`"
-                      class="progress-bar progress-bar-danger progress-bar-striped active"
-                      style="width: 100%"
-                    ></div>
+                    <div :id="`prize-bar-${item.type}`"
+                      class="progress-bar progress-bar-danger progress-bar-striped active" style="width: 100%"></div>
                  </div>
-                  <div
-                    :id="`prize-count-${item.type}`"
-                    class="prize-count-left"
-                  >
+                  <div :id="`prize-count-${item.type}`" class="prize-count-left">
                    {{ item.leftCount }}/{{ item.count }}
                  </div>
                </div>
              </div>
            </div>
            <div v-else style="display: flex; width: 100%; height: 100%">
-              <img
-                src="../../../assets/img/待揭秘.png"
-                alt="待揭秘"
-                class="readyLook"
-              />
+              <img src="../../../assets/img/待揭秘.png" alt="待揭秘" class="readyLook" />
            </div>
          </li>
        </ul>
@ -68,12 +50,7 @@
      </div>
      <div v-else>
        <div class="dgetPrizeName">
-          <img
-            src="../../../assets/img/展开.png"
-            alt="展开"
-            class="close"
-            @click="closeGetPrize()"
-          />
+          <img src="../../../assets/img/展开.png" alt="展开" class="close" @click="closeGetPrize()" />
          <div class="tableHead">
            <div class="tableHead1">HomilyID</div>
            <div class="tableHead2">奖项</div>
@ -374,7 +351,7 @@ const initAll = async () => {
  prizes.value = prizeList.data;
  //   用户列表
  users.value = userList.data;
-  prizes.value.forEach((item, index) => {
+  prizes.value.forEach((item, index) => { 
    item.type = index;
    item.count = item.amount;
    item.leftCount = item.remainNum; //剩余次数（用于计算奖品下方的进度条的百分比）
@ -1587,12 +1564,15 @@ a {
  overflow-y: auto;

  /* 隐藏滚动条 */
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE */
+  scrollbar-width: none;
+  /* Firefox */
+  -ms-overflow-style: none;
+  /* IE */
 }

 #prizeBar::-webkit-scrollbar {
-  display: none; /* Chrome, Safari */
+  display: none;
+  /* Chrome, Safari */
 }

 .prize-list {
@ -1668,20 +1648,24 @@ a {
 }

@keyframes bounce1 {
+
  0%,
  100% {
    transform: rotate(180deg) translateY(0);
  }
+
  50% {
    transform: rotate(180deg) translateY(-8px);
  }
 }

@keyframes bounce2 {
+
  0%,
  100% {
    transform: translateY(0);
  }
+
  50% {
    transform: translateY(-8px);
  }
@ -1702,6 +1686,7 @@ a {
  width: 50%;
  text-align: center;
 }
+
 .tableHead2 {
  width: 50%;
  text-align: center;
@ -1711,13 +1696,11 @@ a {
  width: 90%;
  height: 3px;
  border-radius: 150%;
-  background: linear-gradient(
-    to right,
-    transparent 0%,
-    #d5291f 45%,
-    #d5291f 55%,
-    transparent 100%
-  );
+  background: linear-gradient(to right,
+      transparent 0%,
+      #d5291f 45%,
+      #d5291f 55%,
+      transparent 100%);
  position: absolute;
  bottom: -10px;
 }
@ -1728,15 +1711,20 @@ a {
  width: 100%;
  height: 54vh;
  justify-content: center;
-  overflow-y: auto; /* 启用垂直滚动 */
-  overflow-x: hidden; /* 启用垂直滚动 */
+  overflow-y: auto;
+  /* 启用垂直滚动 */
+  overflow-x: hidden;
+  /* 启用垂直滚动 */
  /* 隐藏滚动条 */
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* IE */
+  scrollbar-width: none;
+  /* Firefox */
+  -ms-overflow-style: none;
+  /* IE */
 }

 .tableBody::-webkit-scrollbar {
-  display: none; /* Chrome, Safari */
+  display: none;
+  /* Chrome, Safari */
 }

 .tableItem {
@ -1807,6 +1795,7 @@ a {
  display: flex;
  align-items: center;
 }
+
 .level {
  width: 38%;
  height: 100%;
@ -1849,36 +1838,30 @@ a {
 }

 .progress-bar-striped {
-  background-image: -webkit-linear-gradient(
-    45deg,
-    rgba(255, 255, 255, 0.15) 25%,
-    transparent 25%,
-    transparent 50%,
-    rgba(255, 255, 255, 0.15) 50%,
-    rgba(255, 255, 255, 0.15) 75%,
-    transparent 75%,
-    transparent
-  );
-  background-image: -o-linear-gradient(
-    45deg,
-    rgba(255, 255, 255, 0.15) 25%,
-    transparent 25%,
-    transparent 50%,
-    rgba(255, 255, 255, 0.15) 50%,
-    rgba(255, 255, 255, 0.15) 75%,
-    transparent 75%,
-    transparent
-  );
-  background-image: linear-gradient(
-    45deg,
-    rgba(255, 255, 255, 0.15) 25%,
-    transparent 25%,
-    transparent 50%,
-    rgba(255, 255, 255, 0.15) 50%,
-    rgba(255, 255, 255, 0.15) 75%,
-    transparent 75%,
-    transparent
-  );
+  background-image: -webkit-linear-gradient(45deg,
+      rgba(255, 255, 255, 0.15) 25%,
+      transparent 25%,
+      transparent 50%,
+      rgba(255, 255, 255, 0.15) 50%,
+      rgba(255, 255, 255, 0.15) 75%,
+      transparent 75%,
+      transparent);
+  background-image: -o-linear-gradient(45deg,
+      rgba(255, 255, 255, 0.15) 25%,
+      transparent 25%,
+      transparent 50%,
+      rgba(255, 255, 255, 0.15) 50%,
+      rgba(255, 255, 255, 0.15) 75%,
+      transparent 75%,
+      transparent);
+  background-image: linear-gradient(45deg,
+      rgba(255, 255, 255, 0.15) 25%,
+      transparent 25%,
+      transparent 50%,
+      rgba(255, 255, 255, 0.15) 50%,
+      rgba(255, 255, 255, 0.15) 75%,
+      transparent 75%,
+      transparent);
  -webkit-background-size: 8px 8px;
  background-size: 8px 8px;
 }
--- a/src/views/zhongchou/index.vue
+++ b/src/views/zhongchou/index.vue
@ -215,7 +215,7 @@ async function fetchActivity() {


 const numberToChinese = (num) => {
-    const chineseNumbers = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二', '十三', '十四', '十五']
+    const chineseNumbers = ['零', '一', '两', '三', '四', '五', '六', '七', '八', '九', '十', '十一', '十二', '十三', '十四', '十五']
    return chineseNumbers[num] || num.toString()
 }
 // 进度条高度动态获取