Skip to content

C
community_vote
Commit 9290be36 authored by hanfeng zhang's avatar hanfeng zhang
Browse files
Options

321

parent d30730d7
Hide whitespace changes
Inline Side-by-side
Showing with 127 additions and 51 deletions
package-lock.json
View file @ 9290be36
......@@ -4890,6 +4890,14 @@
"resolved": "https://registry.npmjs.org/aws4/-/aws4-1.11.0.tgz",
"integrity": "sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA=="
},
"axios": {
"version": "0.21.1",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.21.1.tgz",
"integrity": "sha512-dKQiRHxGD9PPRIUNIWvZhPTPpl1rf/OxTYKsqKUDjBwYylTvV7SjSHJb9ratfyzM6wCdLCOYLzs73qpg5c4iGA==",
"requires": {
"follow-redirects": "^1.10.0"
}
},
"babel-code-frame": {
"version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
......@@ -6070,6 +6078,16 @@
"integrity": "sha512-FxqpkPPwu1HjuN93Omfm4h8uIanXofW0RxVEW3k5RKx+mJJYSthzNhp32Kzxxy3YAEZ/Dc/EWN1vZRY0+kOhbw==",
"dev": true
},
"clipboard": {
"version": "2.0.8",
"resolved": "https://registry.npmjs.org/clipboard/-/clipboard-2.0.8.tgz",
"integrity": "sha512-Y6WO0unAIQp5bLmk1zdThRhgJt/x3ks6f30s3oE3H1mgIEU33XyQjEf8gsf6DxC7NPX8Y1SsNWjUjL/ywLnnbQ==",
"requires": {
"good-listener": "^1.2.2",
"select": "^1.1.2",
"tiny-emitter": "^2.0.0"
}
},
"clipboardy": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/clipboardy/-/clipboardy-2.3.0.tgz",
......@@ -7181,6 +7199,11 @@
"resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
"integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk="
},
"delegate": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/delegate/-/delegate-3.2.0.tgz",
"integrity": "sha512-IofjkYBZaZivn0V8nnsMJGBr4jVLxHDheKSW88PyxS5QC4Vo9ZbZVvhzlSxY87fVq3STR6r+4cGepyHkcWOQSw=="
},
"depd": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/depd/-/depd-1.1.2.tgz",
......@@ -8415,8 +8438,7 @@
"follow-redirects": {
"version": "1.14.1",
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz",
"integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg==",
"dev": true
"integrity": "sha512-HWqDgT7ZEkqRzBvc2s64vSZ/hfOceEol3ac/7tKwzuvEyWx3/4UegXh5oBOIotkGsObyk3xznnSRVADBgWSQVg=="
},
"for-in": {
"version": "1.0.2",
......@@ -8996,6 +9018,14 @@
"slash": "^2.0.0"
}
},
"good-listener": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/good-listener/-/good-listener-1.2.2.tgz",
"integrity": "sha1-1TswzfkxPf+33JoNR3CWqm0UXFA=",
"requires": {
"delegate": "^3.1.2"
}
},
"graceful-fs": {
"version": "4.2.6",
"resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.6.tgz",
......@@ -13073,6 +13103,11 @@
"resolved": "https://registry.npmjs.org/seed-random/-/seed-random-2.2.0.tgz",
"integrity": "sha1-KpsZ4lCoFwmSMaW5mk2vgLf77VQ="
},
"select": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/select/-/select-1.1.2.tgz",
"integrity": "sha1-DnNQrN7ICxEIUoeG7B1EGNEbOW0="
},
"select-hose": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
......@@ -15033,6 +15068,14 @@
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.12.tgz",
"integrity": "sha512-uhmLFETqPPNyuLLbsKz6ioJ4q7AZHzD8ZVFNATNyICSZouqP2Sz0rotWQC8UNBF6VGSCs5abnKJoStA6JbCbfg=="
},
"vue-clipboard2": {
"version": "0.3.1",
"resolved": "https://registry.npmjs.org/vue-clipboard2/-/vue-clipboard2-0.3.1.tgz",
"integrity": "sha512-H5S/agEDj0kXjUb5GP2c0hCzIXWRBygaWLN3NEFsaI9I3uWin778SFEMt8QRXiPG+7anyjqWiw2lqcxWUSfkYg==",
"requires": {
"clipboard": "^2.0.0"
}
},
"vue-date-pick": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/vue-date-pick/-/vue-date-pick-1.4.1.tgz",
......
package.json
View file @ 9290be36
......@@ -13,6 +13,7 @@
"@trevoreyre/autocomplete-vue": "^2.2.0",
"animejs": "^3.2.1",
"ant-design-vue": "^1.7.5",
"axios": "^0.21.1",
"bip39": "^3.0.4",
"core-js": "^3.6.5",
"dexie": "^3.0.3",
......
public/img/bg/squareBanner.png
View replaced file @ d30730d7 View file @ 9290be36
public/img/bg/squareBanner.png

88.3 KB | W: | H:

public/img/bg/squareBanner.png

79.4 KB | W: | H:

public/img/bg/squareBanner.png
public/img/bg/squareBanner.png
public/img/bg/squareBanner.png
public/img/bg/squareBanner.png
  • 2-up
  • Swipe
  • Onion skin
src/components/common/Search.vue 0 → 100644
View file @ 9290be36
<template>
<div class='search flex items-center w-full bg-app-dark-2 bg-opacity-30 text-sm px-3 py-1 rounded-3xl border border-app-blue-3 hover:border-app-blue-2'>
<div class='search-input flex-grow'>
<input type="text" class=" w-full bg-transparent" placeholder="输入项目名称/ID">
</div>
<app-icon size="20px" class="flex-grow-0" color="#ffffff" type='search'></app-icon>
</div>
</template>
<script lang="ts">
import Vue,{Component} from 'vue';
import { Icon } from 'ant-design-vue';
Vue.use(Icon)
const AppIcon = Icon.createFromIconfontCN({
scriptUrl:'/iconfont.js' // generated by iconfont.cn
});
export default Vue.extend({
props: {
},
components:{
'app-icon':AppIcon as Component
}
});
</script>
src/components/home/Banner.vue
View file @ 9290be36
<template>
<div class="home-banner relative">
<div class="mt-6 flex justify-center flex-grow-0" :class="{ 'mb-8': !showBtn }">
<img class="logo w-60 h-40 transform scale-100" src="@/assets/home/banner-img.png" alt="">
<div class="pt-5">
<img class="w-48 object-fill mx-auto" src="@/assets/home/banner-img.png" alt="">
</div>
<div v-if="!canAttend && showBtn" ref="imgbtn" class="fixed top-1/2 right-1 z-50 imgbtn" :style="{ top: top, right: right }" @click="attendActivity">
<div v-if="!canAttend " ref="imgbtn" class="fixed top-1/2 right-1 z-50 imgbtn" :style="{ top: top, right: right }" @click="attendActivity">
<img class="w-16 h-16" src="@/assets/home/a-btn.png" alt="">
</div>
<!-- <template v-if="!scrollHide"> -->
<div
v-if="showBtn"
class="header-box w-full h-auto pb-12 flex flex-col items-center justify-center"
:class="{ 'opacity-0': scrollHide }"
:style="{ 'height': showBtn ? 'auto' : '' }"
>
<button
v-if="canAttend"
......@@ -26,13 +25,8 @@
</div>
</div>
<!-- </template> -->
<div v-if="showBtn" class="mt-3 w-full px-6 absolute bottom-0">
<div class='search flex items-center w-full bg-app-dark-2 bg-opacity-30 text-sm px-3 py-1 rounded-3xl border border-app-blue-3 hover:border-app-blue-2'>
<div class='search-input flex-grow'>
<input type="text" class=" w-full bg-transparent" placeholder="输入项目名称/ID">
</div>
<app-icon size="20px" class="flex-grow-0" color="#ffffff" type='search'></app-icon>
</div>
<div class="mt-3 w-full px-6 absolute bottom-0">
<app-search></app-search>
</div>
</div>
</template>
......@@ -40,19 +34,17 @@
<script lang="ts">
import Vue from 'vue'
import Timebox from '@/components/Timebox.vue'
import AppIcon from '@/components/common/Icon.vue'
export default Vue.extend({
components: {
Timebox,
AppIcon,
'app-search':()=>import('@/components/common/Search.vue')
},
name: 'HomeBanner',
data() {
return {
voteType: 1,
canAttend: false,
canAttend: true,
clientWidth: 0,
clientHeight: 0,
top: '50%',
......
src/components/home/RankList.vue
View file @ 9290be36
<template>
<div v-show="isShow" class="pt-7">
<div class="rank-list relative w-full px-4">
<div v-show="isShow" >
<div class=" relative w-11/12 mx-auto ">
<div class="rank-title absolute left-1/2 -top-4 transform -translate-x-1/2">
<p class="text-center text-lg leading-10">排行榜</p>
</div>
<div class="lines border border-app-blue-3 border-solid rounded-lg" style="background: rgb(25, 2, 92)" ref="lines">
<div class="lines border border-app-blue-3 border-solid rounded-lg" style="background: rgb(25, 2, 92)" ref="lines">
<div class="overflow-y-scroll h-full" @scroll="scrollEvent">
<div class="rank-lines h-full px-3 flex flex-col items-center">
<template v-if="ranklist.length > 0" class="">
......@@ -18,7 +18,6 @@
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -27,14 +26,15 @@
<script lang="ts">
import Cardtwo from '@/components/Card_two.vue'
import Vue from 'vue'
import {TimelineLite, Power2} from 'gsap'
import {TimelineLite, Power3} from 'gsap'
export default Vue.extend({
components: { Cardtwo },
name: 'RankList',
data() {
return {
anima: null as any,
scrollArr: [] as any[]
scrollArr: [] as any[],
directionUp:false
}
},
props: {
......@@ -48,35 +48,30 @@ export default Vue.extend({
},
methods: {
scrollEvent(e: any) {
// const scrollTop = e.target.scrollTop
// const line = this.$refs.lines as any
// if (scrollTop > 320) {
// this.$emit('scrollEvent', true)
// line.style.height = 'calc(100vh - 220px)'
// } else {
// this.$emit('scrollEvent', false)
// line.style.height = 'calc(100vh - 400px)'
// }
let poisition = e.target.scrollTop
this.scrollArr.push(poisition)
let l = this.scrollArr.slice(-2)
if(e.target.scrollTop > 120 && l[0]<l[1]){
if(poisition > 90 && l[0]<l[1]){
this.directionUp = false
this.anima.play()
}else if(e.target.scrollTop <= 320 && l[0]>l[1]){
}else if(poisition <= 120 && l[0]>l[1]){
this.directionUp = true
this.anima.reverse()
}
},
initialGASP() {
initialGASP() {
const {lines} = this.$refs
const top = this.$parent.$refs.banner as any
const topBox = top.$el
const img = topBox.querySelector('.logo') as any
const header = topBox.querySelector('.header-box') as any
this.anima = new TimelineLite()
this.anima.to(lines,0.3,{css:{height:"calc(100vh - 220px)"},ease:Power2.easeInOut, delay: 0.5})
this.anima.to(img,0.2,{css:{transform: 'scale(0.7)', transformOrigin: '50% 50%'},ease:Power2.easeInOut, delay: 0.1})
this.anima.to(header,0.2,{css:{transform: 'scale(0)', transformOrigin: '50% 0'},ease:Power2.easeInOut, delay: 0.1})
this.anima.to(topBox,0.2,{css:{height:"205px"},ease:Power2.easeInOut}, '-=0.3')
this.anima = new TimelineLite({duration:0.1,ease:Power3.easeInOut})
this.anima.to(lines,{css:{height:"calc(100vh - 220px)"}})
this.anima.to(topBox,{css:{height:"205px"}})
this.anima.to(header,{css:{transform: 'scale(0)', transformOrigin: '50% 0'}})
this.anima.to(img,{css:{transform: 'scale(0.7)', transformOrigin: '50% 50%'}})
this.anima.pause()
}
},
......
src/service/index.ts 0 → 100644
View file @ 9290be36
import axios,{ AxiosInstance } from "axios";
class AppService {
// private baseUrl:string
private service:AxiosInstance
constructor(){
this.service = axios.create({
baseURL:this.getBaseUrl(),
timeout: 15000,
})
}
private getBaseUrl(){
return process.env == 'devlelop'?"123":"321"
}
}
\ No newline at end of file
src/service/index.vue deleted 100644 → 0
View file @ d30730d7
接口的统一出口文件
\ No newline at end of file
src/views/Square.vue
View file @ 9290be36
<template>
<div class="flex flex-col">
<div class=" h-260px bg-squareBanner bg-center bg-cover bg-transparent bg-opacity-10 relative" ref="topBox">
<div class="flex flex-col justify-center items-center py-12" ref="textBox">
<img src="@/assets/squareBanner-text.png" alt="">
</div>
<div class='w-full absolute bottom-3 '>
<div class=' w-11/12 mx-auto h-10 text-white'>
<div class='search flex items-center w-full bg-app-dark-2 bg-opacity-30 text-sm px-3 py-1 rounded-3xl border border-app-blue-3 hover:border-app-blue-2'>
<div class='search-input flex-grow'>
<input type="text" class=" w-full bg-transparent" placeholder="输入项目名称/ID">
</div>
<app-icon size="20px" class="flex-grow-0" color="#ffffff" type='search'></app-icon>
</div>
<app-search></app-search>
</div>
</div>
</div>
......@@ -50,10 +48,12 @@ export default Vue.extend({
};
},
mounted(){
const {topBox,botBox} = this.$refs
const {topBox,botBox,textBox} = this.$refs
this.anima = new TimelineLite()
this.anima.to(botBox,0,{css:{height:"calc(100vh - 190px)"},ease:Power2.easeInOut})
this.anima.to(topBox,0.6,{css:{height:"110px"},ease:Power2.easeInOut,delay:0.1})
this.anima.to(textBox,0.1,{opacity:0,ease:Power2.easeInOut})
this.anima.to(topBox,0.6,{css:{height:"110px"},ease:Power2.easeInOut,delay:0.1},'>-0.3')
this.anima.pause()
},
......@@ -61,6 +61,7 @@ export default Vue.extend({
'app-icon':()=>import('@/components/common/Icon.vue'),
'app-card':()=>import('@/components/Card.vue'),
'app-card2':()=>import('@/components/Card_two.vue'),
'app-search':()=>import('@/components/common/Search.vue')
},
methods:{
doFilter(){
......
tailwind.config.js
View file @ 9290be36
......@@ -805,6 +805,7 @@ module.exports = {
'9/12': '75%',
'10/12': '83.333333%',
'11/12': '91.666667%',
'11.5/12':'95.833333%',
full: '100%',
screen: '100vw',
min: 'min-content',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment