Skip to content

Commit

Permalink
complete get data from backend & add i18n
Browse files Browse the repository at this point in the history
  • Loading branch information
shellteo committed Dec 25, 2018
1 parent 96fce57 commit b4e4815
Show file tree
Hide file tree
Showing 19 changed files with 641 additions and 198 deletions.
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
"axios": "^0.18.0",
"element-ui": "^2.4.5",
"vue": "^2.5.17",
"vue-i18n": "^8.5.0",
"vue-router": "^3.0.1",
"vuex": "^3.0.1"
},
Expand Down
72 changes: 67 additions & 5 deletions src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
import CryptoHeader from './components/layout/CryptoHeader'
import CryptoFooter from './components/layout/CryptoFooter'
import API from '@/api'
import util from '@/util/util'
export default {
name: 'app',
Expand All @@ -23,7 +24,67 @@
CryptoFooter
},
mounted() {
/*window.onload = () => {
/*window.addEventListener('load', () => {
if (typeof tronPay !== 'undefined') {
tronWeb = tronPay.tronWeb || tronWeb
if (tronWeb.isTronPay && tronWeb.ready) {
this.$store.commit('updateLogin', true)
let address = window.tronWeb.defaultAddress.hex;
API.login({
address: address,
sign: ''
}).then(res => {
console.log(res);
});
/!*window.tronWeb.trx.getAccount(address).then((res) => {
console.log(res);
})*!/
} else {
this.$notify({
title: '提示',
message: '波场钱包请先解锁',
duration: 0
});
this.$store.commit('updateLogin', false)
}
} else {
this.$notify({
title: '提示',
message: '请先安装波场钱包插件',
duration: 0
});
this.$store.commit('updateLogin', false)
}
})*/
/*const waitForGlobal = async () => {
if (window.tronWeb) {
const tronWeb = window.tronWeb
const nodes = await tronWeb.isConnected()
const connected = !Object.entries(nodes).map(([key, value]) => {
if (!value) {
console.error(`Error: ${key} is not connected`)
}
return value
}).includes(false)
if (connected) {
console.log('connected')
} else {
console.error('Error: TRON node is not connected')
console.error('wait for tronLink')
setTimeout(async () => {
await waitForGlobal()
}, 100)
}
} else {
console.error('wait for tronLink')
setTimeout(async () => {
await waitForGlobal()
}, 100)
}
};
waitForGlobal().then()*/
window.onload = () => {
if (!window.tronWeb) {
this.$notify({
title: '提示',
Expand All @@ -44,17 +105,18 @@
this.$store.commit('updateLogin', true)
let address = window.tronWeb.defaultAddress.hex;
API.login({
address: address,
sign: ''
address: address
}).then(res => {
console.log(res);
if (res.code === 0) {
util.setCookie('access_token', res.data.access_token);
}
});
window.tronWeb.trx.getAccount(address).then((res) => {
console.log(res);
})
}
}
}*/
}
/*api.setTronWeb(window.tronWeb)
api.contract.allOf(1).call().then(resp => {
Expand Down
1 change: 1 addition & 0 deletions src/api/index.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import axios from 'axios'
import config from './config'
axios.defaults.withCredentials = true
const instance = axios.create({
baseURL: config.BASE_URL
});
Expand Down
37 changes: 33 additions & 4 deletions src/components/Card.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@
<div class="card-body" @click="toDetail">
<div class="heart-icon-container" @click.stop>
<!--<img class="heart-img" alt="" @click.stop="like">-->
<font-awesome-icon :icon="['fas', 'heart']" class="heart-icon"/>
<font-awesome-icon :icon="['far', 'heart']" class="heart-icon" v-if="idol.IsLike === 0" @click.stop="like"/>
<font-awesome-icon :icon="['fas', 'heart']" class="heart-icon" v-if="idol.IsLike === 1" @click.stop="unlike"/>
</div>
<div class="body-top">
<span>{{idol.NickName}}</span>
Expand All @@ -18,15 +19,17 @@
<span>#{{idol.TokenId}}</span>
</div>
</div>
<div class="buy">
<span>购买</span>
<div class="buy" @click="buy">
<span>{{$t('buy')}}</span>
</div>
</div>
</template>

<script>
import API from '@/api'
import config from '@/api/config'
import KittyCore from '@/util/KittyCore.json'
import util from '@/util/util'
export default {
name: 'Card',
props: {
Expand Down Expand Up @@ -64,8 +67,34 @@
},
like() {
API.like({tokenId: this.idol.TokenId}).then(res => {
if (res.code === 0) {}
if (res.code === 0) {
console.log(res);
this.idol.IsLike = 1;
}
})
},
unlike() {
API.unlike({tokenId: this.idol.TokenId}).then(res => {
if (res.code === 0) {
console.log(res);
this.idol.IsLike = 0;
}
})
},
async buy() {
/*const tronWeb = window.tronWeb;
const contract = tronWeb.contract(KittyCore.abi, KittyCore.address);
contract.getuint256(1).call().then(resp => {
console.log(resp)
})*/
const signMessage = await window.tronWeb.trx.sign(util.strToHex('tron idol'));
console.log(signMessage);
/*contract.teststore().send({
shouldPollResponse: true,
callValue: 2000000000,
}).then(res => {
console.log('success', res)
})*/
}
}
}
Expand Down
34 changes: 34 additions & 0 deletions src/components/layout/CryptoFooter.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,16 @@
<p><a href="https://twitter.com/">twitter</a></p>
<p><a href="https://www.youtube.com/">youtube</a></p>
</div>
<div class="langContainer">
<el-select v-model="lang" placeholder="请选择" @change="langChange">
<el-option
v-for="item in LangOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</div>
<div class="copyRight">
<span>Copyright © 2018 CryptoGirls Team </span>
Expand All @@ -40,11 +50,25 @@ export default {
name: 'CryptoFooter',
data() {
return {
LangOptions: [{
value: 'en',
label: 'English'
}, {
value: 'zh',
label: '简体中文'
}, {
value: 'zh_tw',
label: '繁體中文'
}],
lang: 'zh'
}
},
mounted() {
},
methods: {
langChange(lang) {
this.$i18n.locale = lang;
}
}
}
</script>
Expand Down Expand Up @@ -85,3 +109,13 @@ export default {
text-decoration: none;
}
</style>
<style lang="scss">
.langContainer .el-input__inner {
background-color: rgb(12, 7, 28)!important;
color: #BDBDBD;
border: none;
}
.langContainer .el-select {
border-bottom: 1px solid #BDBDBD;
}
</style>
46 changes: 33 additions & 13 deletions src/components/layout/CryptoHeader.vue
Original file line number Diff line number Diff line change
Expand Up @@ -9,19 +9,19 @@
</router-link>
<div style="display: flex;">
<el-menu
default-active="market"
:default-active="currentPage"
mode="horizontal"
background-color="#191428"
text-color="#BDBDBD"
select="loginSelect"
router
active-text-color="#ffffff">
<el-menu-item index="market" route="/market">
市场
{{$t('market')}}
</el-menu-item>
<el-menu-item index="register" route="/register" v-if="!isLoginIn">
<!--<el-menu-item index="register" route="/register" v-if="!isLoginIn">
注册
</el-menu-item>
</el-menu-item>-->
<el-menu-item index="user" route="/user" v-if="isLoginIn">
<font-awesome-icon :icon="['fas', 'user-circle']" size="lg"/>
</el-menu-item>
Expand All @@ -35,20 +35,40 @@
<script>
import API from '@/api'
import { mapState } from 'vuex'
import util from '@/util/util'
export default {
name: 'CryptoHeader',
data() {
return {
currentPage: 'market'
}
},
mounted() {
console.log(this.$route)
let href = window.location.href;
this.currentPage = href.substring(href.lastIndexOf('/') + 1, href.length);
},
methods: {
login() {
async login() {
if (!window.tronWeb) {
this.$notify({
title: '提示',
message: '请先安装波场钱包插件',
duration: 0
});
} else {
if (!window.tronWeb.ready) {
this.$notify({
title: '提示',
message: '波场钱包请先解锁',
duration: 0
});
}
}
const sign = await util.signMessage('tron idol');
console.log(sign, window.tronWeb);
API.login({
address: '',
sign: ''
address: window.tronWeb.defaultAddress.base58,
sign
}).then(res => {
console.log(res);
})
Expand All @@ -61,17 +81,17 @@
}).then(res => {
console.log(res);
})
},
toUser() {
this.$router.push({
path: '/user'
})
}
},
computed: {
...mapState([
'isLoginIn'
])
},
watch: {
'$router'(val) {
console.log(val)
}
}
}
</script>
Expand Down
9 changes: 9 additions & 0 deletions src/i18n/en.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default {
switch_lang: 'Switch Lang',
buy: 'Buy',
market: 'Market',
all: 'All',
for_sale: 'For Sale',
rental: 'Rental',
new: 'New'
};
18 changes: 18 additions & 0 deletions src/i18n/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import Vue from 'vue';
import VueI18n from 'vue-i18n';

import zh from './zh';
import en from './en';
import zh_tw from './zh_tw';

Vue.use(VueI18n);

export default new VueI18n({
locale: 'zh',
fallbackLocale: 'zh',
messages: {
en,
zh,
zh_tw
},
});
9 changes: 9 additions & 0 deletions src/i18n/zh.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default {
switch_lang: '切换语言',
buy: '购买',
market: '市场',
all: '全部',
for_sale: '待出售',
rental: '可租赁',
new: '最新'
};
9 changes: 9 additions & 0 deletions src/i18n/zh_tw.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
export default {
switch_lang: '切換語言',
buy: '購買',
market: '市場',
all: '全部',
for_sale: '待出售',
rental: '可租賃',
new: '最新'
};
2 changes: 2 additions & 0 deletions src/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import {faHeart, faFilter, faBars, faUserCircle} from '@fortawesome/free-solid-s
import {faHeart as farHeart} from '@fortawesome/free-regular-svg-icons'
import {FontAwesomeIcon} from '@fortawesome/vue-fontawesome'
import config from '@/api/config'
import i18n from '@/i18n';

library.add(faHeart, farHeart, faFilter, faBars, faUserCircle)

Expand All @@ -20,6 +21,7 @@ Vue.prototype.CONFIG = config;
new Vue({
router,
store,
i18n,
render: h => h(App)
}).$mount('#app');

Expand Down
Loading

0 comments on commit b4e4815

Please sign in to comment.