crypto/cebg-activities
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

merge

Browse Source
This commit is contained in:
huangjinming 2022-11-16 22:28:07 +08:00
parent c96efe730c
commit 39dc6bf266
9 changed files with 5556 additions and 8744 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -19,6 +19,7 @@
"postcss-write-svg": "^3.0.1",
"three": "^0.146.0",
"vue": "^2.6.14",
"vue-infinite-scroll": "^2.0.2",
"vue-router": "^3.5.1",
"vuex": "^3.6.2"
},

4
src/App.vue
View File

@ -21,8 +21,8 @@ body, html {
}
#app {
position: relative;
width: 100vw;
height: 100vh;
// width: 100vw;
// height: 100vh;
}

7
src/main.js
View File

@ -3,16 +3,17 @@ import App from './App.vue'
import router from './router'
import store from './store'
import axios from 'axios';
import Web3 from 'web3'
// 完整引入，main.js写入以下代码
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
import "@/assets/font/font.css";
import infiniteScroll from 'vue-infinite-scroll'
Vue.use(infiniteScroll)
Vue.prototype.$axios = axios;
Vue.use(ElementUI)
Vue.config.productionTip = false
Vue.prototype.Web3 = Web3
new Vue({
router,

39
src/views/layout/Header.vue
View File

@ -4,7 +4,13 @@
<div class="logo-img">
<img class="imgs" src="../../assets/mobile/logo.png" alt="" />
</div>
<div class="header-login">WALLET CONNECT</div>
<div class="header-login">
<span href="">WALLET CONNECT</span>
<div class="dropdown-content">
<a href="# ">Quest Info</a>
<a href="# ">Log out</a>
</div>
</div>
</div>
</div>
</template>
@ -38,5 +44,36 @@ export default {
font-size: 0.6rem;
height: 4vh;
margin-right: 1.5vw;
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
top:4.2vh;
position: absolute;
background-color: rgb(18, 18, 18);
min-width: 100%;
border-radius: 4px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
// padding: 12px 16px;
z-index: 1;
}
.header-login:hover .dropdown-content {
display: block;
}
.dropdown-content a {
text-decoration: none;
padding: 0.2vw 0.3vw;
font-size: 0.46rem;
border-radius: 13px;
display: block;
text-align: center;
font-family: OPPOSans;
font-weight: normal;
background: linear-gradient(90deg, #714f34, #f5c384);
margin-top: 0.2rem;
color: #fff;
}
</style>

3
src/views/layout/index.vue
View File

@ -2,7 +2,8 @@
<div>
<Header></Header>
<router-view />
<Footer v-if="router !== '/rankinglist'"></Footer>
<Footer ></Footer>
<!-- <Footer v-if="router !== '/rankinglist'"></Footer> -->
</div>
</template>

65
src/views/mobile/LisitDetails.vue
View File

@ -12,17 +12,29 @@
<div class="points">POINTS</div>
</div>
<div class="list">
<div class="list-item" v-for="(item, i) in leaderboard" :key="i">
<div class="rabk-item">{{ item.rank }}</div>
<div class="tweitter-item">{{ item.twitter }}</div>
<div class="clan-member-item">{{ item.clan }}</div>
<div class="points-item">{{ item.point }}</div>
<div
v-infinite-scroll="scrollEvent"
class="scroll-content"
infinite-scroll-throttle-delay="500"
infinite-scroll-disabled="busy"
infinite-scroll-distance="10"
>
<div class="list-item" v-for="(item, i) in leaderboard" :key="i">
<div class="rabk-item">{{ item.rank }}</div>
<div class="tweitter-item">{{ item.twitter }}</div>
<div class="clan-member-item">{{ item.clan }}</div>
<div class="points-item">{{ item.point }}</div>
</div>
</div>
<!-- // <VScroll :allList="leaderboard" :oneHeight="150" :lower="150" @scrollLower="scrollLower"> -->
<!-- // <VScroll :allList="leaderboard" :oneHeight="150" :lower="150" @scrollLower="scrollLower"> -->
<div class="more">......</div>
<div class="list-item" v-for="(item, i) in leaderboardMe" :key="i">
<div class="rabk-item">
<img class="imgs" :src="require('@/assets/mobile/current-'+item.id+'.png')" alt="">
<img
class="imgs"
:src="require('@/assets/mobile/current-' + item.id + '.png')"
alt=""
/>
{{ item.rank }}
</div>
<div class="tweitter-item">{{ item.twitter }}</div>
@ -35,14 +47,43 @@
</template>
<script>
import infiniteScroll from "vue-infinite-scroll";
export default {
components:{},
directives: { infiniteScroll },
components: {},
data() {
return {
leaderboard: null,
leaderboardMe: null,
offset: 0,
busy: false,
limit: 10,
};
},
methods: {
// 列表滚动事件
scrollEvent(e) {
this.offset += 1;
this.updateData();
},
updateData() {
this.$axios
.post(process.env.VUE_APP_API_HOST + "/aa1/leaderboard", {
account: "0xCC8EFe18ca9f000786D73D993e85A9eFc3ac9417",
offset: this.offset,
limit: 10,
})
.then((res) => {
console.log("成功", res.data);
this.leaderboard = res.data.data;
})
.catch((err) => {
console.error(err);
alert(err.response.data.msg);
});
},
},
created() {
this.$axios
.post(process.env.VUE_APP_API_HOST + "/aa1/leaderboard", {
@ -78,7 +119,7 @@ export default {
.container {
position: relative;
width: 100vw;
height: calc(100vh - 4.8vh - 10vh);
height: calc(100vh - 4.8vh - 8vh);
background: url(../../assets/mobile/bg-content.png);
background-size: 100% 100%;
}
@ -137,7 +178,7 @@ export default {
.list {
width: 89vw;
margin: 0 auto;
.list-item {
width: 97%;
margin: 0 auto;
@ -185,4 +226,8 @@ export default {
text-align: center;
color: #cfa16c;
}
.scroll-content {
height: 30vh; // 设置固定高度
overflow:auto
}
</style>

2
src/views/mobile/Login.vue
View File

@ -99,7 +99,7 @@ export default {
.container {
position: relative;
width: 100vw;
height: calc(100vh - 4.8vh - 10vh);
height: calc(100vh - 4.8vh - 8vh);
background: url(../../assets/mobile/bg-content.png);
background-size: 100% 100%;
}

2
src/views/mobile/RankingList.vue
View File

@ -126,7 +126,7 @@
</div>
<div v-show="currentIndex == 1" class="info">Coming Soon</div>
</div>
<Footer class="footer"></Footer>
<!-- <Footer class="footer"></Footer> -->
</div>
</template>

14177
yarn.lock
View File

File diff suppressed because it is too large Load Diff