Skip to content

html / poolin_app

Go to a project
Commit 8fae1780 by zhanghui1
Options

0110

parent dbd2ad6e
Showing with 224 additions and 72 deletions
config/index.js
......@@ -13,7 +13,7 @@ module.exports = {
proxyTable: {},
// Various Dev Server settings
host: 'localhost', // can be overwritten by process.env.HOST
host: '172.16.4.38', // can be overwritten by process.env.HOST
port: 8081, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
......
index.html
<!DOCTYPE html>
<html>
<head>
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
<meta content="telephone=no" name="format-detection" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<script src="https://cdn.bootcss.com/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/tween.js@16.3.4"></script>
<title>poolin_app</title>
</head>
<body>
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</body>
</html>
package-lock.json
......@@ -243,6 +243,14 @@
"integrity": "sha512-jp/uFnooOiO+L211eZOoSyzpOITMXx1rBITauYykG3BRYPu8h0UcxsPNB04RR5vo4Tyz3+ay17tR6JVf9qzYWg==",
"dev": true
},
"async-validator": {
"version": "1.8.2",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.8.2.tgz",
"integrity": "sha1-t3WXIm6WJC+NUxwNRq4pX2JCK6Q=",
"requires": {
"babel-runtime": "6.26.0"
}
},
"asynckit": {
"version": "0.4.0",
"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
......@@ -537,8 +545,7 @@
"babel-helper-vue-jsx-merge-props": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/babel-helper-vue-jsx-merge-props/-/babel-helper-vue-jsx-merge-props-2.0.3.tgz",
"integrity": "sha512-gsLiKK7Qrb7zYJNgiXKpXblxbV5ffSwR0f5whkPAaBAR4fhi6bwRZxX9wBlIc5M/v8CCkXUbXZL4N/nSE97cqg==",
"dev": true
"integrity": "sha512-gsLiKK7Qrb7zYJNgiXKpXblxbV5ffSwR0f5whkPAaBAR4fhi6bwRZxX9wBlIc5M/v8CCkXUbXZL4N/nSE97cqg=="
},
"babel-helpers": {
"version": "6.24.1",
......@@ -1054,7 +1061,6 @@
"version": "6.26.0",
"resolved": "https://registry.npmjs.org/babel-runtime/-/babel-runtime-6.26.0.tgz",
"integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
"dev": true,
"requires": {
"core-js": "2.5.3",
"regenerator-runtime": "0.11.1"
......@@ -1886,8 +1892,7 @@
"core-js": {
"version": "2.5.3",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.5.3.tgz",
"integrity": "sha1-isw4NFgk8W2DZbfJtCWRaOjtYD4=",
"dev": true
"integrity": "sha1-isw4NFgk8W2DZbfJtCWRaOjtYD4="
},
"core-util-is": {
"version": "1.0.2",
......@@ -2358,6 +2363,11 @@
"integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=",
"dev": true
},
"deepmerge": {
"version": "1.5.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz",
"integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ=="
},
"define-properties": {
"version": "1.1.2",
"resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.1.2.tgz",
......@@ -2647,6 +2657,17 @@
"batch-processor": "1.0.0"
}
},
"element-ui": {
"version": "2.0.11",
"resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.0.11.tgz",
"integrity": "sha512-jrBIuoHTx07RmgrdpkPQTj9KCFP+BNewUaVB2kkbH+MSGdurzXw8MPzH+o/RZCGIh+ODNfLa71h5veYKJysIpA==",
"requires": {
"async-validator": "1.8.2",
"babel-helper-vue-jsx-merge-props": "2.0.3",
"deepmerge": "1.5.2",
"throttle-debounce": "1.0.1"
}
},
"elliptic": {
"version": "6.4.0",
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.4.0.tgz",
......@@ -7798,8 +7819,7 @@
"regenerator-runtime": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
"integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==",
"dev": true
"integrity": "sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg=="
},
"regenerator-transform": {
"version": "0.10.1",
......@@ -8595,6 +8615,11 @@
"integrity": "sha1-mTcqXJmb8t8WCvwNdL7U9HlIzSI=",
"dev": true
},
"throttle-debounce": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.0.1.tgz",
"integrity": "sha1-2tD+Ew+drzcZ/eoz3Dao5rp/MLU="
},
"through2": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/through2/-/through2-2.0.3.tgz",
......
package.json
......@@ -12,6 +12,7 @@
"dependencies": {
"axios": "^0.17.1",
"echarts": "^3.8.5",
"element-ui": "^2.0.11",
"mint-ui": "^2.2.13",
"vue": "^2.5.2",
"vue-awesome-swiper": "^3.1.0",
......
src/assets/img/icon-01.png
src/assets/img/icon-01.png

1.28 KB | W: | H:

src/assets/img/icon-01.png

2.19 KB | W: | H:

src/assets/img/icon-01.png
src/assets/img/icon-01.png
src/assets/img/icon-01.png
src/assets/img/icon-01.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/img/index-tab1-active.png
src/assets/img/index-tab1-active.png

5.84 KB | W: | H:

src/assets/img/index-tab1-active.png

17.7 KB | W: | H:

src/assets/img/index-tab1-active.png
src/assets/img/index-tab1-active.png
src/assets/img/index-tab1-active.png
src/assets/img/index-tab1-active.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/img/index-tab1.png
src/assets/img/index-tab1.png

3.4 KB | W: | H:

src/assets/img/index-tab1.png

12.5 KB | W: | H:

src/assets/img/index-tab1.png
src/assets/img/index-tab1.png
src/assets/img/index-tab1.png
src/assets/img/index-tab1.png
  • 2-up
  • Swipe
  • Onion skin
src/assets/js/store.js
......@@ -5,7 +5,7 @@ Vue.use(Vuex);
import dictionaries from '@/assets/js/dictionaries.js'; //字典
const state = {
refresh_time: 10000, //定时刷新
refresh_time: 100000, //定时刷新
// is_login: $auth.isAuthenticated(), //是否登录
init_url: {}, //全站入口信息
cur_coins: [], //获取支持的币种
......
src/assets/less/style.less
......@@ -53,10 +53,75 @@
.eq-font {font-family: "Droid Sans Mono", Menlo, Monaco, Consolas, "Courier New", monospace}
html,body {-webkit-tap-highlight-color: rgba(0, 0, 0,0); background: #ededf2;font-family: "Roboto","Helvetica Neue",Helvetica,"Hiragino Sans GB",STHeitiSC-Light,"Microsoft YaHei","微软雅黑",Arial,sans-serif;width:100%;height:100%;}
html,body {-webkit-tap-highlight-color: rgba(0, 0, 0,0); font-size: 0.28rem; background: #fff;font-family: "Roboto","Helvetica Neue",Helvetica,"Hiragino Sans GB",STHeitiSC-Light,"Microsoft YaHei","微软雅黑",Arial,sans-serif;width:100%;height:100%;}
.bg-blue {background: #ededf2;}
.line{.pos(r);
&:after {width:100%; height:1px; background:#ccc;.pos(a); left: 0; right: 0; top:0; transform:scale(1,0.33) translateY(-1px);content:'';}
.xt{width:100%; height:1px; background:#ccc;.pos(a); left: 0; right: 0; top:0; transform:scale(1,0.33) translateY(-1px);content:'';}
.xb{width:100%; height:1px; background:#ccc;.pos(a); left: 0; right: 0; bottom:0; transform:scale(1,0.33) translateY(1px);content:'';}
.yl{width:1px; height:100%; background:#ccc;.pos(a); left: 0; bottom: 0; top:0; transform:scale(0.33,1) translateX(-1px);content:'';}
.yr{width:1px; height:100%; background:#ccc;.pos(a); right: 0; bottom: 0; top:0; transform:scale(0.33,1) translateX(1px);content:'';}
}
/*复用颜色*/
@blue:#103f73;
.header-home {height:2.9rem; background:@blue;
.logo {width:2.8rem; height:auto; display:block;margin:0 auto;}
/*样式修正*/
.button-primary {background:@blue;border-color:@blue; box-shadow: 0 0.2rem 0.3rem rgba(16,63,115,0.2);}
.swiper-home {.pos(r);
&:after {.line.xb;}
.swiper-button-next, .swiper-button-prev {width:0.18rem; height:0.32rem;background-size:0.18rem 0.32rem; margin-top: -0.16rem;}
/*
.swiper-button-prev {left: 0;}
.swiper-button-next {right: 0;}
*/
.swiper-slide {.tc;}
span {color:#999;.d-ib;font-size:0.28rem;.txt-ver(0.9rem); background-size:0.5rem 0.5rem; background-repeat: no-repeat; background-position: left center; padding-left: 0.6rem;
&.ltc {background-image:url(../img/index-tab1.png);}
&.eth {background-image:url(../img/index-tab2.png);}
&.dash {background-image:url(../img/index-tab3.png);}
&.xmr {background-image:url(../img/index-tab4.png);}
&.btc {background-image:url(../img/index-tab5.png);}
&.sc {background-image:url(../img/index-tab6.png);}
&.zcash {background-image:url(../img/index-tab7.png);}
&.doge {background-image:url(../img/index-tab8.png);}
}
span.active {color:#333;.d-ib;font-size:0.28rem;.txt-ver(0.9rem); background-size:0.5rem 0.5rem; background-repeat: no-repeat; background-position: left center; padding-left: 0.6rem;
&.ltc {background-image:url(../img/index-tab1-active.png);}
&.eth {background-image:url(../img/index-tab2-active.png);}
&.dash {background-image:url(../img/index-tab3-active.png);}
&.xmr {background-image:url(../img/index-tab4-active.png);}
&.btc {background-image:url(../img/index-tab5-active.png);}
&.sc {background-image:url(../img/index-tab6-active.png);}
&.zcash {background-image:url(../img/index-tab7-active.png);}
&.doge {background-image:url(../img/index-tab8-active.png);}
}
}
.header-home {height:2.9rem; background:@blue;
.logo {width:2.8rem; height:auto;.d-b;}
&.ios { height:2.7rem; padding-top: 0.2rem;}
}
.btn-group { .ohz;
button {width: 100%; margin-bottom: 0.4rem;}
.el-button+.el-button {margin:0}
}
.v {font-size: 0.4rem; color: #252525}
.k {font-size:0.26rem; color: #252525; margin-left: 0.1rem;}
.title { .font-wn;
&.f24gray {color: #888; font-size: 0.24rem;}
}
.cell {.pos(r);
&:after {.line.xb;}
&>div { padding: 0.5rem 0;.pos(r);
&:after {.line.yr;}
}
&>div:nth-last-of-type(1) {
&:after {width: 0;}
}
.title {margin-top: 0.1rem;}
}
.c-charts {width:100%;height:220px;}
\ No newline at end of file
src/components/Home.vue
<template>
<div class="warp">
<div class="header-home"><img class="logo" src="../assets/img/logo.png" alt="" /></div>
<div class="header-home" flex="main:center cross:center"><img class="logo" src="../assets/img/logo.png" alt="" /></div>
<div class="swiper-home">
<swiper :options="swiperOption" ref="mySwiper">
<!-- slides -->
<swiper-slide>I'm Slide 1</swiper-slide>
<swiper-slide>I'm Slide 2</swiper-slide>
<swiper-slide>I'm Slide 3</swiper-slide>
<swiper-slide flex="main:center cross:center" v-for="(coin,coinIdx) in $store.state.cur_coins" :key="coin"><span :class="coinIdx==active?coin+' active':coin+''" @click="changeCoin(coin,coinIdx)">{{coin|uppercase}}</span></swiper-slide>
<!-- Optional controls -->
<div class="swiper-button-prev" slot="button-prev"></div>
<div class="swiper-button-next" slot="button-next"></div>
</swiper>
{{msg}}
<button @click="login">登录</button>
<button @click="reg">注册</button>
</div>
<indexChart :params_coin=coin></indexChart>
<div class="btn-group mt40 pb40 pl100 pr100">
<el-button type="primary" round @click="login" class="button-primary">登录</el-button>
<el-button round @click="reg">注册</el-button>
</div>
</div>
</template>
<script>
import fn from '@/assets/js/function.js'
import { mapState } from 'vuex'
// import indexChart from "@/components/charts/indexChart.vue"
import indexChart from "@/components/charts/indexChart.vue"
import { swiper, swiperSlide } from 'vue-awesome-swiper'
export default {
name: 'home',
components: {
swiper,
swiperSlide
swiperSlide,
indexChart
},
data() {
return {
......@@ -35,19 +38,25 @@ export default {
direction: 'horizontal',
grabCursor: true,
setWrapperSize: true,
autoHeight: true,
paginationClickable: true,
autoHeight: false,
prevButton: '.swiper-button-prev',
nextButton: '.swiper-button-next',
mousewheelControl: true,
observeParents: true,
debugger: true,
slidesPerView:3
slidesPerView: 2,
},
coin: $store.state.cur_coins[0],
active: 0
}
},
computed: {
...mapState(["txt", "init_url", "cur_coins"]),
swiper() {
return this.$refs.mySwiper.swiper
}
},
mounted() {
this.swiper.slideTo(0, 1000, false);
},
methods: {
login() {
......@@ -55,6 +64,10 @@ export default {
},
reg() {
this.$router.push('/reg')
},
changeCoin(coin, coinIdx) {
this.coin = coin;
this.active = coinIdx;
}
}
}
......
src/components/charts/indexChart.vue
<template>
<div>
<h2 class="title s5 mt50 mb30" v-if="language=='zh-cn'">{{init_url.coins[params_coin]['text_zh-cn']}}{{txt[language].suanlitubiao}}</h2>
<h2 class="title s5 mt50 mb30" v-if="language=='en'">{{init_url.coins[params_coin]['text_en']}}　{{txt[language].suanlitubiao}}</h2>
<p class="f-tac"><span class="v"><animated-num :value="shares_1h" :fixed=3></animated-num></span><span class="k">{{shares_unit}}H/s</span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="v"><animated-num :value="workers" :fixed=0></animated-num></span><span class="k">在线矿机</span></p>
<div class="cell" flex="box:mean">
<div flex="main:center dir:top box:center cross:center">
<p><span class="v"><animated-num :value="shares_1h" :fixed=3></animated-num></span><span class="k">{{unit}}H/s</span></p>
<h3 class="title f24gray">实时算力</h3>
</div>
<div flex="main:center dir:top box:center cross:center">
<p><span class="v"><animated-num :value="workers" :fixed=0></animated-num></span><span class="k">台</span></p>
<h3 class="title f24gray">矿机</h3>
</div>
</div>
<div class="c-charts">
<IEcharts :option="line"></IEcharts>
</div>
<div class="line"></div>
</div>
</template>
<script>
import fn from '@/assets/js/function.js';
import { mapState } from 'vuex';
import IEcharts from 'vue-echarts-v3';
import animatedNum from "@/components/pages/animatednum.vue";
import animatedNum from "@/components/AnimatedNum.vue";
export default {
components: {
IEcharts,
......@@ -20,9 +28,9 @@ export default {
},
data: () => ({
shares_1h: '',
shares_1h: 0,
shares_unit: '',
workers: '',
workers: 0,
shareHistoryTime: [], //算力历史时间
shareHistoryYes: [], //算力历史成功
......@@ -45,14 +53,13 @@ export default {
tooltip: {
trigger: 'axis',
formatter: function(params) {
//console.log(params)
return params[0].name + '<br/>' +
params[0].seriesName + ' : ' + (params[0].value).toFixed(3) + ' ' + self.unit + 'H/s'
}
},
legend: {},
grid: {
top: '9%',
top: '15%',
left: '3%',
right: '5%',
bottom: '5%',
......@@ -128,14 +135,11 @@ export default {
}]
}
},
// refresh() {
// return $store.state.refresh
// }
},
watch: {
// refresh(v) {
// this.pageInitInterval()
// }
params_coin(){
this.pageInitInterval()
}
},
created() {
this.pageInitInterval()
......@@ -166,15 +170,12 @@ export default {
fn.getShareHistory(72, "1h", self.params_coin)
.then(res => {
let hour;
self.shareHistoryTime=[];
self.shareHistoryYes=[];
self.shareHistoryNo=[];
self.shareHistoryTime = [];
self.shareHistoryYes = [];
self.shareHistoryNo = [];
if (res.data.err_no == 0) {
self.unit = res.data.data.unit;
_.each(res.data.data.tickers, function(v, i) {
//时间戳转小时
// hour = new Date(v[0] * 1000).getHours();
// self.shareHistoryTime.push((Array(2).join(0) + hour).slice(-2) + ":00");
self.shareHistoryTime.push(fn.getYMDHM(v[0] * 1000))
self.shareHistoryYes.push(v[1]);
self.shareHistoryNo.push(v[2]);
......@@ -189,24 +190,6 @@ export default {
</script>
<style scoped>
.el-col {
margin-bottom: 16px;
}
.material-icons {
font-size: 80px;
color: #ddd;
}
.cart-string {
height: 100px;
padding-top: 10px;
font-size: 1.1rem;
}
.c-charts {
height: 400px;
width: 100%;
}
</style>
src/main.js
......@@ -18,6 +18,10 @@ import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
Vue.use(MintUI)
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
import axios from 'axios';
axios.defaults.withCredentials = false;
axios.defaults.timeout = 50000;
......@@ -25,15 +29,17 @@ axios.interceptors.request.use(config => {
return checkToken().then(function(res) {
config.headers['Authorization'] = "Bearer " + res;
return config;
}, function(eMsg) {console.log('添加token失败了')});
}, function(eMsg) { console.log('添加token失败了') });
}, err => {
return Promise.reject(err);
});
function checkToken() {
return new Promise((resolve, reject) => {
resolve("access token");
})
}
window.$axios = Vue.prototype.$axios = axios;
window.$router = router
......@@ -43,6 +49,7 @@ Vue.config.productionTip = false
new Vue({
el: '#app',
store,
router,
template: '<App/>',
components: { App }
......
src/router/index.js
......@@ -128,14 +128,14 @@ const router = new Router({
meta: {
title: 'Notice.vue'
}
},{
}, {
path: '/noticeList',
name: 'noticeList',
component: NoticeList,
meta: {
title: 'NoticeList.vue'
}
},{
}, {
path: '/noticeShow',
name: 'noticeShow',
component: NoticeShow,
......@@ -149,11 +149,63 @@ const router = new Router({
})
router.beforeEach((to, from, next) => {
// if (localStorage.getItem('enter_panel') == "true") {
// $store.commit('setEnterPannel', true);
// }
function getCoins(obj) {
//获取所支持币种['ltc','dash','eth'...]
let arr_coins = [];
_.map(obj.regions, function(v, i, o) {
_.map(v.supported_coin_types, function(v1, i1, o1) {
arr_coins.push(v1.coin_type)
})
});
return _.uniq(arr_coins)
}
var arr = ['home', 'jump'];
if (arr.indexOf(to.name) > -1) {
//初始全站入口支持数据(未登录页基础数据)
if ($store.state.cur_coins.length == 0) {
$axios($store.state.base_url)
.then(res => {
$store.commit('setInitUrl', res.data);
$store.commit('setCurCoins', getCoins(res.data));
if (localStorage.coin_type) {
$store.commit('setCoinType', localStorage.coin_type);
} else {
$store.commit('setCoinType', $store.state.cur_coins[0]);
}
if (localStorage.region_id) {
$store.commit('setRegionId', localStorage.region_id)
} else {
$store.commit('setRegionId', res.data.regions[0].region_id);
}
if (!localStorage.puid) {
$store.commit('setPuid', '')
}
if (!localStorage.language) {
$store.commit('setLanguage', $store.state.language)
}
next();
})
} else {
next();
}
} else {
localStorage.removeItem('access_token')
localStorage.removeItem('id_token')
localStorage.removeItem('expires_at')
// $auth.login();
next();
}
})
router.afterEach((to, from) => {
document.title = to.meta.title
clearInterval(window.dingshiqi);
document.title = to.meta.title;
})
export default router
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 sign in to comment