Skip to content

html / poolin_app

Go to a project
Commit 64e73221 by jingjie
Options

jingjie

parent 85d73297
Showing with 182 additions and 12 deletions
package.json
......@@ -5,7 +5,7 @@
"author": "xin3w <xin3w@126.com>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 172.16.4.38",
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
......
src/assets/less/style3.less
@import url('../css/reset.css');
@import url('function.less');
@import url('animate.less');
/*复用颜色*/
@fontBlue:#1c5fa9;
@fontGray: #8e8e8e;
@bgGray:#ededf2;
//线
.line(){
&.xb{left: 0; right: 0;height: 1px;width: 100%; background: #ededf2;;content: '';position: absolute;bottom:0;transform: scaleY(0.33) translateY(1px);}
}
.language{
background: @bgGray;
.page-content{
&.top{
padding-top: 0.28rem;
}
.language-content{
.language-item{
height: 0.87rem;
line-height: 0.87rem;
padding: 0 10px;
background-color: #fff;
.pos(r);
&:after{.line.xb;}
.language-title{
height: 0.87rem;
line-height: 0.87rem;
span{
font-size: 0.3rem;
color: @fontGray;
}
img{
width: 0.48rem;
height: 0.32rem;
margin-top: -0.02rem;
}
}
.language-selected{
width: 0.36rem;
height: 0.26rem;
background: url(../../assets/img/selected.png) center center no-repeat;
background-size: 0.36rem 0.26rem;
.pos(a);
top: 50%;
right: 10px;
transform: translateY(-50%);
}
&.active{color:@fontBlue;}
}
}
}
}
.default-coin{
background: @bgGray;
.page-content{
&.top{
padding-top: 0.28rem;
}
.coin-text{
padding: 0 0.3rem;
font-size: 0.28rem;
&.coin-text-top{
color: #103f73;
}
&.bottom{
color: #727272;
}
}
.coin-type{
padding: 0.3rem;
margin: 0.18rem 0 0.24rem 0;
background-color: #fff;
.coin-item{
width: 1.98rem;
height: 0.6rem;
line-height: 0.6rem;
box-sizing: border-box;
border: 1px solid #dcdedf;
margin-right:0.48rem;
&:nth-child(3n){
margin-right:0;
}
&.active{
border-color: #2b6aaf;
}
.coin-img{
display: inline-block;
width: 0.44rem;
height:0.44rem;
background: url(../../assets/img/index-tab1.png) center center no-repeat;
background-size: 0.44rem 0.44rem;
}
}
}
.commit-btn{
width: 6.9rem;
height: 0.9rem;
line-height: 0.9rem;
.bc;
background: #103f73;
color: #fff;
font-size: 0.36rem;
border-radius: 30px;
margin: 0 auto;
.pos(a);
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
border: none;
}
}
}
src/components/Settings/DefaultCoin.vue
<template>
<div class="">
{{msg}}
<button @click="goBack">提交返回</button>
<div class="page default-coin">
<div class="page-header" flex="main:justify cross:center">
<div class="back" @click="goBack"><i class="iconfont icon-fanhui"></i></div>
<div class="title">{{msg}}</div>
</div>
<div class="page-content top">
<div class="coin-text coin-text-top">请选择默认币种</div>
<ul class="coin-type f-cb">
<li class="coin-item f-fl mb40" @click="toggleClass(0)" :class="index==0?'active':''">
<i class="coin-img"></i>
<span class="coin-name">LTC</span>
</li>
<li class="coin-item f-fl mb40" @click="toggleClass(1)" :class="index==1?'active':''"></li>
<li class="coin-item f-fl mb40" @click="toggleClass(2)" :class="index==2?'active':''"></li>
<li class="coin-item f-fl" @click="toggleClass(3)" :class="index==3?'active':''"></li>
<li class="coin-item f-fl" @click="toggleClass(4)" :class="index==4?'active':''"></li>
</ul>
<div class="coin-text coin-text-bottom">当切换到该子账户时，将默认显示该币种</div>
<button class="commit-btn">提交</button>
</div>
</div>
</template>
<script>
......@@ -9,7 +27,8 @@ export default {
name: 'defaultCoin',
data() {
return {
msg: '设置默认币种'
msg: '设置默认币种',
index: 0
}
},
mounted() {
......@@ -18,6 +37,9 @@ export default {
methods: {
goBack() {
this.$router.go(-1)
},
toggleClass(n){
this.index = n;
}
}
}
......
src/components/Settings/Language.vue
<template>
<div class="">
{{msg}}
<button @click="goBack">返回</button>
<div class="page language">
<div class="page-header" flex="main:justify cross:center">
<div class="back" @click="goBack"><i class="iconfont icon-fanhui"></i></div>
<div class="title">{{msg}}</div>
</div>
<div class="page-content top">
<div class="language-content">
<div class="f-cb language-item" @click="toggleClass(0)" :class="index==0?'active':''">
<div class="f-fl language-title">
自动
</div>
<div :class="index==0?'language-selected':''">
</div>
</div>
<div class="f-cb language-item" @click="toggleClass(1)" :class="index==1?'active':''">
<div class="f-fl language-title">
中文
<img src="../../assets/img/cn.png" alt="">
</div>
<div :class="index==1?'language-selected':''">
</div>
</div>
<div class="f-cb language-item" @click="toggleClass(2)" :class="index==2?'active':''">
<div class="f-fl language-title">
英文
<img src="../../assets/img/en.png" alt="">
</div>
<div :class="index==2?'language-selected':''">
</div>
</div>
</div>
</div>
</div>
</template>
<script>
......@@ -9,7 +41,8 @@ export default {
name: 'language',
data() {
return {
msg: '语言设置'
msg: '语言设置',
index: 0
}
},
mounted() {
......@@ -18,6 +51,9 @@ export default {
methods: {
goBack() {
this.$router.go(-1)
},
toggleClass(n){
this.index = n;
}
}
}
......
src/components/Settings/index.vue
......@@ -15,7 +15,7 @@
<div class="settings-title">子账户设置</div>
<mt-cell title="LTC收益地址" is-link></mt-cell>
<mt-cell title="DOGE补贴地址" is-link></mt-cell>
<mt-cell title="默认币种设置" is-link>
<mt-cell title="默认币种设置" is-link to="/defaultCoin">
<img src="../../assets/img/index-tab1-active.png" alt="" class="fore-link-img"/>
</mt-cell>
</div>
......@@ -45,7 +45,7 @@
<mt-cell title="矿机设置" is-link>
<span class="fore-link-text">矿工必看</span>
</mt-cell>
<mt-cell title="语言设置" is-link>
<mt-cell title="语言设置" is-link to="/language">
<img src="../../assets/img/cn.png" alt="" class="fore-link-lang"/>
</mt-cell>
</div>
......@@ -57,7 +57,7 @@
<!-- page end -->
</template>
<script>
import tabbar from "@/components/Tabbar.vue";
import tabbar from "@/components/Common/Tabbar.vue";
export default {
name: 'dashboard',
components: {
......
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