hongxilin
/
activityLink
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

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

songtongtong/feature-20250717104937-众筹
宋杰 4 weeks ago
parent
04269f7e09
commit
733c41db7c
3 changed files with 62 additions and 79 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      index.html
  2. 135
      src/views/choujiang/hxl-cj/cj.vue
  3. 2
      src/views/zhongchou/index.vue

2
index.html
View File

@ -7,7 +7,7 @@
<title>Vite + Vue</title> <title>Vite + Vue</title>
</head> </head>
<body> <body>
<script src="/src/utils/tween.min.js"></script>
<!-- <script src="/src/utils/tween.min.js"></script> -->
<div id="app"></div> <div id="app"></div>
<script type="module" src="/src/main.js"></script> <script type="module" src="/src/main.js"></script>

135
src/views/choujiang/hxl-cj/cj.vue
View File

@ -11,17 +11,9 @@
<div class="leftBar"> <div class="leftBar">
<el-scrollbar id="prizeBar"> <el-scrollbar id="prizeBar">
<ul class="prize-list"> <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> <span></span><span></span><span></span><span></span>
<div class="prize-img"> <div class="prize-img">
<img :src="item.img" :alt="item.title" /> <img :src="item.img" :alt="item.title" />
@ -35,27 +27,17 @@
</div> </div>
<div class="prize-count"> <div class="prize-count">
<div class="progress"> <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>
<div
:id="`prize-count-${item.type}`"
class="prize-count-left"
>
<div :id="`prize-count-${item.type}`" class="prize-count-left">
{{ item.leftCount }}/{{ item.count }} {{ item.leftCount }}/{{ item.count }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div v-else style="display: flex; width: 100%; height: 100%"> <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> </div>
</li> </li>
</ul> </ul>
@ -68,12 +50,7 @@
</div> </div>
<div v-else> <div v-else>
<div class="dgetPrizeName"> <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="tableHead">
<div class="tableHead1">HomilyID</div> <div class="tableHead1">HomilyID</div>
<div class="tableHead2">奖项</div> <div class="tableHead2">奖项</div>
@ -1587,12 +1564,15 @@ a {
overflow-y: auto; overflow-y: auto;
/* 隐藏滚动条 */ /* 隐藏滚动条 */
scrollbar-width: none; /* Firefox */
-ms-overflow-style: none; /* IE */
scrollbar-width: none;
/* Firefox */
-ms-overflow-style: none;
/* IE */
} }
#prizeBar::-webkit-scrollbar { #prizeBar::-webkit-scrollbar {
display: none; /* Chrome, Safari */
display: none;
/* Chrome, Safari */
} }
.prize-list { .prize-list {
@ -1668,20 +1648,24 @@ a {
} }
@keyframes bounce1 { @keyframes bounce1 {
0%, 0%,
100% { 100% {
transform: rotate(180deg) translateY(0); transform: rotate(180deg) translateY(0);
} }
50% { 50% {
transform: rotate(180deg) translateY(-8px); transform: rotate(180deg) translateY(-8px);
} }
} }
@keyframes bounce2 { @keyframes bounce2 {
0%, 0%,
100% { 100% {
transform: translateY(0); transform: translateY(0);
} }
50% { 50% {
transform: translateY(-8px); transform: translateY(-8px);
} }
@ -1702,6 +1686,7 @@ a {
width: 50%; width: 50%;
text-align: center; text-align: center;
} }
.tableHead2 { .tableHead2 {
width: 50%; width: 50%;
text-align: center; text-align: center;
@ -1711,13 +1696,11 @@ a {
width: 90%; width: 90%;
height: 3px; height: 3px;
border-radius: 150%; 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; position: absolute;
bottom: -10px; bottom: -10px;
} }
@ -1728,15 +1711,20 @@ a {
width: 100%; width: 100%;
height: 54vh; height: 54vh;
justify-content: center; 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 { .tableBody::-webkit-scrollbar {
display: none; /* Chrome, Safari */
display: none;
/* Chrome, Safari */
} }
.tableItem { .tableItem {
@ -1807,6 +1795,7 @@ a {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.level { .level {
width: 38%; width: 38%;
height: 100%; height: 100%;
@ -1849,36 +1838,30 @@ a {
} }
.progress-bar-striped { .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; -webkit-background-size: 8px 8px;
background-size: 8px 8px; background-size: 8px 8px;
} }

2
src/views/zhongchou/index.vue
View File

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

Write Preview
Loading…
Cancel
Save