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

5 Commits
2d2445b7f6 ... 0e2f6d6110

Author SHA1 Message Date
宋杰 0e2f6d6110 火箭图片在周年庆下面。
4 weeks ago
宋杰 a879bbb605 更换美股背景图片；公告提示语修改。
4 weeks ago
宋杰 05bf98e358 传参token修改为ApiToken。
4 weeks ago
宋杰 733c41db7c 取消导入tween；一修改为二。
4 weeks ago
宋杰 04269f7e09 统一tweenjs导入方式。
4 weeks ago
7 changed files with 70 additions and 85 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
  1. 2
      index.html
  2. 2
      package.json
  3. 4
      src/api/zhongchouApi.js
  4. BIN
      src/assets/img/zhongchou/美股.png
  5. 2
      src/utils/prizeList.js
  6. 138
      src/views/choujiang/hxl-cj/cj.vue
  7. 7
      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>

2
package.json
View File

@ -7,7 +7,7 @@
"dev": "vite --host", "dev": "vite --host",
"build": "vite build", "build": "vite build",
"preview": "vite preview", "preview": "vite preview",
"build:test": "vite build --mode test",
"build:test": "vite build --mode development",
"build:prod": "vite build --mode production" "build:prod": "vite build --mode production"
}, },
"dependencies": { "dependencies": {

4
src/api/zhongchouApi.js
View File

@ -9,7 +9,7 @@ export function addRecordAPI(data) {
method: 'post', method: 'post',
data: data, data: data,
headers: { headers: {
token: localStorage.getItem('localToken')
ApiToken: localStorage.getItem('localToken')
}, },
}) })
} }
@ -19,7 +19,7 @@ export function getActivity1API() {
url: `${APIurl}/api/funding/getActivity`, url: `${APIurl}/api/funding/getActivity`,
method: 'post', method: 'post',
headers: { headers: {
token: localStorage.getItem('localToken')
ApiToken: localStorage.getItem('localToken')
}, },
}) })
} }

BIN
src/assets/img/zhongchou/美股.png
View File

Side by Side Swipe Overlay

Before

Width: 1319  |  Height: 773  |  Size: 229 KiB

After

Width: 1319  |  Height: 773  |  Size: 243 KiB

2
src/utils/prizeList.js
View File

@ -1,4 +1,4 @@
import * as TWEEN from "./tween.min.js";
import TWEEN from "@tweenjs/tween.js";
const MAX_TOP = 300; const MAX_TOP = 300;
const MAX_WIDTH = document.body.clientWidth; const MAX_WIDTH = document.body.clientWidth;

138
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>
@ -145,6 +122,7 @@ import { resetPrize } from "../../../utils/prizeList";
import { NUMBER_MATRIX } from "../../../utils/config"; import { NUMBER_MATRIX } from "../../../utils/config";
import { CSS3DObject, CSS3DRenderer } from "../../../utils/CSS3DRenderer.js"; import { CSS3DObject, CSS3DRenderer } from "../../../utils/CSS3DRenderer.js";
import { TrackballControls } from "../../../utils/TrackballControls.js"; import { TrackballControls } from "../../../utils/TrackballControls.js";
import TWEEN from "@tweenjs/tween.js";
import { import {
getPrizeListApi, getPrizeListApi,
@ -373,7 +351,7 @@ const initAll = async () => {
prizes.value = prizeList.data; prizes.value = prizeList.data;
// 用户列表 // 用户列表
users.value = userList.data; users.value = userList.data;
prizes.value.forEach((item, index) => {
prizes.value.forEach((item, index) => {
item.type = index; item.type = index;
item.count = item.amount; item.count = item.amount;
item.leftCount = item.remainNum; //剩余次数（用于计算奖品下方的进度条的百分比） item.leftCount = item.remainNum; //剩余次数（用于计算奖品下方的进度条的百分比）
@ -1586,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 {
@ -1667,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);
} }
@ -1701,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;
@ -1710,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;
} }
@ -1727,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 {
@ -1806,6 +1795,7 @@ a {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.level { .level {
width: 38%; width: 38%;
height: 100%; height: 100%;
@ -1848,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;
} }

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

@ -110,7 +110,7 @@
<div class="modal-text"> <div class="modal-text">
<div class="rules-list"> <div class="rules-list">
<p>1. 活动时间为{{ activityPeriod }}。</p> <p>1. 活动时间为{{ activityPeriod }}。</p>
<p>2. 每人每天每个活动可以参与一次。</p>
<p>2. 每人每天可以参与一次。</p>
<p>3. 初始时间为15分钟，每一百人参与助力，即可扣减一分钟！</p> <p>3. 初始时间为15分钟，每一百人参与助力，即可扣减一分钟！</p>
<p>4. 助力成功后，对应股票市场将开放实时数据！</p> <p>4. 助力成功后，对应股票市场将开放实时数据！</p>
<p>5. 实时数据众筹上线后，您助力的次数会转化成对应天数的实时数据体验卡。</p> <p>5. 实时数据众筹上线后，您助力的次数会转化成对应天数的实时数据体验卡。</p>
@ -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()
} }
// 进度条高度动态获取 // 进度条高度动态获取
@ -548,6 +548,7 @@ const hideRules = () => {
/* 美股卡片默认位置 - 居中显示，移除放大效果 */ /* 美股卡片默认位置 - 居中显示，移除放大效果 */
.left-area { .left-area {
transform: translateX(0) rotateY(0deg); transform: translateX(0) rotateY(0deg);
z-index: 15;
} }
/* 港股卡片默认位置 - 火箭右侧，向内倾斜 */ /* 港股卡片默认位置 - 火箭右侧，向内倾斜 */
@ -596,7 +597,7 @@ const hideRules = () => {
/* 火箭区域 - 位于美股卡片右边，不覆盖卡片 */ /* 火箭区域 - 位于美股卡片右边，不覆盖卡片 */
.rocket-area { .rocket-area {
position: absolute; position: absolute;
z-index: 10;
z-index: 1;
/* 位置调整到美股卡片右边，确保不覆盖 */ /* 位置调整到美股卡片右边，确保不覆盖 */
top: 35%; top: 35%;
/* 垂直居中 */ /* 垂直居中 */

Write Preview
Loading…
Cancel
Save