Skip to content

Y
Ygopro Arena Web
Commit 949121cd authored by ganjingcun's avatar ganjingcun
Browse files
Options

重构

parent 55039792
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 79 additions and 119 deletions
build/dev-server.js
View file @ 949121cd
......@@ -60,8 +60,8 @@ app.use(hotMiddleware)
// serve pure static assets
var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
// app.use(staticPath, express.static('./static'))
app.use(staticPath, express.static('./src/assets'))
app.use(staticPath, express.static('./static/assets'))
// app.use(staticPath, express.static('./src/assets'))
var uri = 'http://localhost:' + port
......
index.html
View file @ 949121cd
......@@ -5,14 +5,16 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ygopro</title>
<link rel="stylesheet" href="./assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="./assets/css/styles.css">
<link rel="stylesheet" href="./assets/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
</head>
<body>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/bootstrap/js/bootstrap.min.js"></script>
</body>
</html>
\ No newline at end of file
src/App.vue
View file @ 949121cd
......@@ -12,17 +12,11 @@
import PageHeader from './components/PageHeader'
import PageFooter from './components/PageFooter'
//css
// import "./assets/bootstrap/css/bootstrap.min.css"
import "./assets/css/Projects-Clean.css"
import "./assets/css/Pretty-Search-Form.css"
// import "./assets/css/styles.css"
// import "./assets/css/font-awesome.min.css"
//js
window.jQuery = window.$ = require('jquery');
require('./assets/bootstrap/js/bootstrap.min.js')
export default {
name: 'app',
......
src/components/Index.vue
View file @ 949121cd
<template>
<div class="hello">
<div id="promo" v-if="!isLogin" v-bind:style="{ backgroundImage: 'url(' + image + ')' }">
<div id="promo" v-if="!user.isLogin" v-bind:style="{ backgroundImage: 'url(' + image + ')' }">
<div class="jumbotron">
<h1>MyCard </h1>
<p>{{lang.index.p1}}</p>
......@@ -8,15 +8,14 @@
</div>
</div>
<div class="projects-clean" v-bind:class="{ 'fix-top': isLogin }">
<div class="projects-clean" v-bind:class="{ 'fix-top': user.isLogin }">
<div class="container" id="project">
<div class="intro">
<h2 class="text-center">{{lang.index.p2}} </h2>
<p class="text-center">{{lang.index.p3}} </p>
</div>
<div class="row projects">
<div @
="gogo('#/ranking')" class="col-lg-4 col-sm-6 item" v-bind:class="{ 'fix-width': !isMobile , 'fix-width-m': isMobile }"><img class="img-responsive" src="../assets/img/image6.png">
<div @click="gogo('#/ranking')" class="col-lg-4 col-sm-6 item" v-bind:class="{ 'fix-width': !isMobile , 'fix-width-m': isMobile }"><img class="img-responsive" src="../assets/img/image6.png">
<h3 class="name">
<span style="text-decoration: underline;">{{lang.index.h1}}</span>
</h3>
......@@ -47,36 +46,26 @@
</template>
<script>
import language from './lang';
import querystring from 'querystring';
import image from '../assets/img/banner.jpg'
import image from '../assets/img/banner.jpg'
import { mapGetters } from 'vuex'
export default {
data() {
return {
isLogin: false,
isMobile: false,
image:image,
lang: {},
image: image,
}
},
created: function () {
var lang = localStorage.getItem('lang') || 'cn';
this.init(lang)
var token = querystring.parse(location.search.slice(1)).sso;
if (token) {
localStorage.setItem('token', token);
this.isLogin = true;
} else {
token = localStorage.getItem('token');
if (token) {
this.isLogin = true;
} else {
this.isLogin = false;
}
}
computed: {
...mapGetters({
lang: 'getLang',
user: 'getUser'
}),
},
created: function () {
var clientWidth = document.body.clientWidth;
if (clientWidth < 753) {
this.isMobile = true
......@@ -91,22 +80,13 @@
self.isMobile = false;
}
}
},
methods: {
init: function (lang) {
this.lang = language[lang]
},
gogo: function (url) {
// window.open(url)
window.location.href = url
}
},
events: {
'lang-change': function (lang) {
this.init(lang)
}
},
}
</script>
......@@ -135,7 +115,7 @@
#promo {
text-align: center;
padding: 40px;
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: cover;
margin-top: 50px;
}
......
src/components/PageHeader.vue
View file @ 949121cd
......@@ -17,8 +17,8 @@
<li role="presentation"><a href="https://rep.ygobbs.com">{{lang.battlelog}} </a></li>
<!--<li role="presentation"><a href="https://mycard.moe/ygopro/">{{lang.download}} </a></li>-->
<li role="presentation"><a href="#/download">{{lang.download}} </a></li>
<li v-if="isLogin" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" href="#"><img v-bind:src="avatar_url" id="head-portrait">{{username}} <span class="caret"></span></a>
<li v-if="user.isLogin" class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false" href="#"><img v-bind:src="user.avatar_url" id="head-portrait">{{user.username}} <span class="caret"></span></a>
<ul class="dropdown-menu" role="menu">
<li role="presentation"><a href="#/profile">{{lang.profile}} </a></li>
<li class="divider" role="presentation"></li>
......@@ -53,9 +53,6 @@
export default {
data() {
return {
isLogin: false,
username: "",
avatar_url: "",
}
},
created: function () {
......@@ -64,6 +61,7 @@
computed: {
...mapGetters({
lang: 'getLang',
user: 'getUser'
}),
},
methods: {
......@@ -72,14 +70,10 @@
if (token) {
localStorage.setItem('token', token);
this.render(token);
this.isLogin = true;
} else {
token = localStorage.getItem('token');
if (token) {
this.render(token);
this.isLogin = true;
} else {
this.isLogin = false;
}
}
......@@ -92,11 +86,11 @@
},
render: function (token) {
var user = querystring.parse(new Buffer(token, 'base64').toString());
this.username = user.username;
this.avatar_url = user.avatar_url;
this.$store.dispatch('login', user);
},
logout: function () {
localStorage.removeItem('token');
this.$store.dispatch('logout',{});
// var redirectUrl = "http://localhost:8081/index.html";
var redirectUrl = "https://mycard.moe/ygopro/arena/index.html";
......@@ -127,10 +121,10 @@
localStorage.setItem('lang', 'en');
// this.lang = language['en'];
// this.$dispatch('lang-change', 'en')
this.curLang = 'en'
this.$store.dispatch('getLang', this);
this.curLang = 'en'
this.$store.dispatch('getLang', this);
this.$emit('helloworld')
this.$emit('helloworld')
}
}
}
......
src/components/Profile.vue
View file @ 949121cd
......@@ -4,9 +4,9 @@
<div class="row">
<div class="col-md-3" id="profile">
<div class="thumbnail">
<img v-bind:src="avatar_url" style="height:200px;margin-top:13px;">
<img v-bind:src="user.avatar_url" style="height:200px;margin-top:13px;">
<div class="caption">
<h3> <i class="glyphicon glyphicon-user"></i> <strong>{{username}}</strong></h3>
<h3> <i class="glyphicon glyphicon-user"></i> <strong>{{user.username}}</strong></h3>
<!--<p class="text-nowrap text-muted" style="font-size:20px;">有妞不泡，大逆不道;遇妞则泡，替天行道。 </p>-->
</div>
</div>
......@@ -94,15 +94,12 @@
<script>
import querystring from 'querystring';
import language from './lang';
import API from '../api'
import { mapGetters } from 'vuex'
export default {
data() {
return {
username: "",
avatar_url: "",
user_info: {
exp: 0,
pt: 500,
......@@ -124,57 +121,23 @@
computed: {
...mapGetters({
lang: 'getLang',
user: 'getUser'
}),
},
watch: {
lang: function (val) {
},
},
created: function () {
this.init()
var lang = localStorage.getItem('lang');
this.initLang(lang)
},
events: {
'lang-change': function (lang) {
this.initLang(lang)
let opt = {
'username': this.user.username
}
API.getUserInfo(opt).then((res) => {
this.user_info = res.data
});
},
methods: {
init: function () {
var token = querystring.parse(location.search.slice(1)).sso;
if (token) {
this.render(token);
this.isLogin = true;
} else {
token = localStorage.getItem('token');
if (token) {
this.render(token);
this.isLogin = true;
} else {
this.isLogin = false;
}
}
},
initLang: function (lang) {
},
render: function (token) {
var user = querystring.parse(new Buffer(token, 'base64').toString());
this.username = user.username;
this.avatar_url = user.avatar_url;
let opt = {
'username': user.username
}
API.getUserInfo(opt).then((res) => {
this.user_info = res.data
});
}
},
}
......
src/store/actions.js
View file @ 949121cd
......@@ -628,7 +628,14 @@ export const getInvoiceAmount = ({commit}, context) => {
}
export const getLang = ({commit}, context) => {
commit(types.GET_LANG, {lang: context.curLang})
}
\ No newline at end of file
}
export const login = ({commit}, user) => {
commit(types.LOGIN, {user: user})
}
export const logout = ({commit}, context) => {
commit(types.LOGOUT, {})
}
src/store/getters.js
View file @ 949121cd
......@@ -19,4 +19,5 @@ export const getInvoiceAmount = state => state.invoice.amount
export const getUserInfo = state => state.account.userInfo
export const getLang = state => state.invoice.lang
\ No newline at end of file
export const getLang = state => state.invoice.lang
export const getUser = state => state.invoice.user
\ No newline at end of file
src/store/modules/invoice.js
View file @ 949121cd
import * as types from '../mutation-types'
import lg from '../../components/lang'
import lg from '../../components/lang'
// initial state
// shape: [{ id, quantity }]
......@@ -10,7 +10,12 @@ const state = {
tax: {},
listData: [],
pageTotal: 1,
lang: lg['cn']
lang: lg['cn'],
user: {
isLogin: false,
username:"",
avatar_url:""
}
}
// getters
......@@ -21,25 +26,32 @@ const actions = {}
// mutations
const mutations = {
[types.GET_LANG] (state, {lang}) {
[types.GET_LANG](state, {lang}) {
state.lang = lg[lang]
},
[types.GET_INVOICE_ADDRESS] (state, {data}) {
[types.LOGIN](state, {user}) {
user.isLogin = true
state.user = user
},
[types.LOGOUT](state, {}) {
state.user.isLogin = false
},
[types.GET_INVOICE_ADDRESS](state, {data}) {
state.address = data
},
[types.GET_INVOICE_TAX] (state, {data}) {
[types.GET_INVOICE_TAX](state, {data}) {
state.tax = data
},
[types.CREATE_INVOICE] (state, {id}) {
[types.CREATE_INVOICE](state, {id}) {
state.tax.id = id
},
[types.CREATE_ADDRESS] (state, {id}) {
[types.CREATE_ADDRESS](state, {id}) {
state.address.id = id
},
[types.GET_INVOICE_AMOUNT] (state, {data}) {
[types.GET_INVOICE_AMOUNT](state, {data}) {
state.amount = data.invoice_amount.toFixed(2)
},
[types.CHANGE_INVOICE_STATUS] (state, {data}) {
[types.CHANGE_INVOICE_STATUS](state, {data}) {
let index = data.index
state.listData[index].status = 2
state.listData[index].status_str = '已撤销'
......
src/store/mutation-types.js
View file @ 949121cd
......@@ -23,4 +23,6 @@ export const GET_USER_INFO = 'GET_USER_INFO'
export const CHANGE_INVOICE_STATUS = 'CHANGE_INVOICE_STATUS'
export const GET_LANG = 'GET_LANG'
\ No newline at end of file
export const GET_LANG = 'GET_LANG'
export const LOGIN = 'LOGIN'
export const LOGOUT = 'LOGOUT'
\ No newline at end of file
static/assets/js/jquery.min.js 0 → 100644
View file @ 949121cd
This diff is collapsed.
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