@@ -12,10 +12,12 @@ | |||||
"core-js": "^3.6.5", | "core-js": "^3.6.5", | ||||
"element-ui": "^2.15.14", | "element-ui": "^2.15.14", | ||||
"identify": "^0.1.5", | "identify": "^0.1.5", | ||||
"js-cookie": "^3.0.5", | |||||
"moment": "^2.30.1", | "moment": "^2.30.1", | ||||
"swiper": "^3.4.0", | "swiper": "^3.4.0", | ||||
"vue": "^2.6.11", | "vue": "^2.6.11", | ||||
"vue-router": "^3.5.2" | |||||
"vue-router": "^3.5.2", | |||||
"vuex": "^3.1.0" | |||||
}, | }, | ||||
"devDependencies": { | "devDependencies": { | ||||
"@vue/cli-plugin-babel": "~4.5.9", | "@vue/cli-plugin-babel": "~4.5.9", | ||||
@@ -9451,6 +9453,14 @@ | |||||
"dev": true, | "dev": true, | ||||
"license": "MIT" | "license": "MIT" | ||||
}, | }, | ||||
"node_modules/js-cookie": { | |||||
"version": "3.0.5", | |||||
"resolved": "https://registry.npmmirror.com/js-cookie/-/js-cookie-3.0.5.tgz", | |||||
"integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==", | |||||
"engines": { | |||||
"node": ">=14" | |||||
} | |||||
}, | |||||
"node_modules/js-message": { | "node_modules/js-message": { | ||||
"version": "1.0.7", | "version": "1.0.7", | ||||
"dev": true, | "dev": true, | ||||
@@ -15344,6 +15354,11 @@ | |||||
"prettier": "^1.18.2 || ^2.0.0" | "prettier": "^1.18.2 || ^2.0.0" | ||||
} | } | ||||
}, | }, | ||||
"node_modules/vuex": { | |||||
"version": "3.1.0", | |||||
"resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.1.0.tgz", | |||||
"integrity": "sha512-mdHeHT/7u4BncpUZMlxNaIdcN/HIt1GsGG5LKByArvYG/v6DvHcOxvDCts+7SRdCoIRGllK8IMZvQtQXLppDYg==" | |||||
}, | |||||
"node_modules/watchpack": { | "node_modules/watchpack": { | ||||
"version": "1.7.5", | "version": "1.7.5", | ||||
"dev": true, | "dev": true, | ||||
@@ -22628,6 +22643,11 @@ | |||||
"version": "2.1.0", | "version": "2.1.0", | ||||
"dev": true | "dev": true | ||||
}, | }, | ||||
"js-cookie": { | |||||
"version": "3.0.5", | |||||
"resolved": "https://registry.npmmirror.com/js-cookie/-/js-cookie-3.0.5.tgz", | |||||
"integrity": "sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==" | |||||
}, | |||||
"js-message": { | "js-message": { | ||||
"version": "1.0.7", | "version": "1.0.7", | ||||
"dev": true | "dev": true | ||||
@@ -26658,6 +26678,11 @@ | |||||
"version": "1.9.1", | "version": "1.9.1", | ||||
"dev": true | "dev": true | ||||
}, | }, | ||||
"vuex": { | |||||
"version": "3.1.0", | |||||
"resolved": "https://registry.npmmirror.com/vuex/-/vuex-3.1.0.tgz", | |||||
"integrity": "sha512-mdHeHT/7u4BncpUZMlxNaIdcN/HIt1GsGG5LKByArvYG/v6DvHcOxvDCts+7SRdCoIRGllK8IMZvQtQXLppDYg==" | |||||
}, | |||||
"watchpack": { | "watchpack": { | ||||
"version": "1.7.5", | "version": "1.7.5", | ||||
"dev": true, | "dev": true, | ||||
@@ -13,10 +13,12 @@ | |||||
"core-js": "^3.6.5", | "core-js": "^3.6.5", | ||||
"element-ui": "^2.15.14", | "element-ui": "^2.15.14", | ||||
"identify": "^0.1.5", | "identify": "^0.1.5", | ||||
"js-cookie": "^3.0.5", | |||||
"moment": "^2.30.1", | "moment": "^2.30.1", | ||||
"swiper": "^3.4.0", | "swiper": "^3.4.0", | ||||
"vue": "^2.6.11", | "vue": "^2.6.11", | ||||
"vue-router": "^3.5.2" | |||||
"vue-router": "^3.5.2", | |||||
"vuex": "^3.1.0" | |||||
}, | }, | ||||
"devDependencies": { | "devDependencies": { | ||||
"@vue/cli-plugin-babel": "~4.5.9", | "@vue/cli-plugin-babel": "~4.5.9", | ||||
@@ -53,7 +53,17 @@ export function doRegisterByPhoneAPi(data) { | |||||
*/ | */ | ||||
export const getUserInfoApi = () => { | export const getUserInfoApi = () => { | ||||
return request({ | return request({ | ||||
method: 'get', | |||||
url: baseUrl + `/C/api/user/getUserInfo` | |||||
method: 'get', | |||||
url: baseUrl + `/C/api/user/getUserInfo` | |||||
}) | }) | ||||
} | |||||
} | |||||
/** | |||||
* 退出 | |||||
* @returns request | |||||
*/ | |||||
export const logoutApi = () => { | |||||
return request({ | |||||
method: 'get', | |||||
url: baseUrl + `/C/api/user/logout` | |||||
}) | |||||
} |
@@ -1,5 +1,6 @@ | |||||
import axios from 'axios' | import axios from 'axios' | ||||
import Cookies from 'js-cookie' | |||||
/* eslint-disable */ | |||||
// create an axios instance | // create an axios instance | ||||
const service = axios.create({ | const service = axios.create({ | ||||
baseURL: process.env.VUE_APP_BASE_API, // /api | baseURL: process.env.VUE_APP_BASE_API, // /api | ||||
@@ -14,6 +15,13 @@ service.interceptors.request.use( | |||||
// if (AccessToken) { | // if (AccessToken) { | ||||
// config.headers.token = AccessToken | // config.headers.token = AccessToken | ||||
// } | // } | ||||
if (Cookies.get('token')) { | |||||
// let each request carry token | |||||
// ['X-Token'] is a custom headers key | |||||
// please modify it according to the actual situation | |||||
// config.headers['Authorization'] = getToken() | |||||
config.token['Authorization'] = Cookies.get('token') | |||||
} | |||||
return config | return config | ||||
}, | }, | ||||
error => { | error => { | ||||
@@ -33,6 +33,7 @@ | |||||
<script> | <script> | ||||
/* eslint-disable */ | /* eslint-disable */ | ||||
import { loginApi, sendLoginPhoneCodeApi, doLoginByPhoneApi, doRegisterByPhoneAPi, getUserInfoApi } from '@/api/login.js' | import { loginApi, sendLoginPhoneCodeApi, doLoginByPhoneApi, doRegisterByPhoneAPi, getUserInfoApi } from '@/api/login.js' | ||||
import Cookies from "js-cookie"; | |||||
export default { | export default { | ||||
props: {}, | props: {}, | ||||
data() { | data() { | ||||
@@ -81,7 +82,6 @@ export default { | |||||
type: 'success' | type: 'success' | ||||
}); | }); | ||||
}else { | }else { | ||||
debugger | |||||
this.$message({ | this.$message({ | ||||
message: res.data.message, | message: res.data.message, | ||||
type: 'warning' | type: 'warning' | ||||
@@ -89,6 +89,13 @@ export default { | |||||
} | } | ||||
}) | }) | ||||
}, | }, | ||||
getUserInfo() { | |||||
getUserInfoApi().then(res => { | |||||
if (res.data.code === 200) { | |||||
this.$store.dispatch('user/setUserInfo', res.data.data) | |||||
} | |||||
}) | |||||
}, | |||||
async login(formName) { | async login(formName) { | ||||
this.$refs[formName].validate(async(valid) => { | this.$refs[formName].validate(async(valid) => { | ||||
if (valid) { | if (valid) { | ||||
@@ -111,9 +118,34 @@ export default { | |||||
}); | }); | ||||
} | } | ||||
}) | }) | ||||
} else if (this.loginFlag === 2) { | |||||
let d = { | |||||
password: this.form.password, | |||||
code: this.form.code | |||||
} | |||||
doLoginByPhoneApi(d).then(res => { | |||||
if (res.data.code === 200) { | |||||
Cookies.set("token", res.data.data.token); | |||||
this.$store.dispatch('user/setIsLogin', true) | |||||
this.getUserInfo() | |||||
this.$message({ | |||||
message: '登录成功', | |||||
type: 'success' | |||||
}); | |||||
this.dialogVisible = false | |||||
} else { | |||||
this.$message({ | |||||
message: res.data.message, | |||||
type: 'warning' | |||||
}); | |||||
} | |||||
}) | |||||
} else { | } else { | ||||
loginApi(this.form).then(res => { | loginApi(this.form).then(res => { | ||||
if (res.data.code === 200) { | if (res.data.code === 200) { | ||||
Cookies.set("token", res.data.data.token); | |||||
this.$store.dispatch('user/setIsLogin', true) | |||||
this.getUserInfo() | |||||
this.$message({ | this.$message({ | ||||
message: '登录成功', | message: '登录成功', | ||||
type: 'success' | type: 'success' | ||||
@@ -4,7 +4,15 @@ | |||||
<div class="header"> | <div class="header"> | ||||
<img src="@/assets/logo.png" id="logo" /> | <img src="@/assets/logo.png" id="logo" /> | ||||
<yqheaders/> | <yqheaders/> | ||||
<el-button plain class="login" size="small" @click="loginFn">注册 / 登录</el-button> | |||||
<el-button v-if="isLogin" plain class="login" size="small" @click="loginFn">注册 / 登录</el-button> | |||||
<el-dropdown v-else class="user"> | |||||
<span class="el-dropdown-link"> | |||||
{{ userInfo.phone }}<i class="el-icon-arrow-down el-icon--right"></i> | |||||
</span> | |||||
<el-dropdown-menu slot="dropdown"> | |||||
<el-dropdown-item><a @click="logout">退出</a></el-dropdown-item> | |||||
</el-dropdown-menu> | |||||
</el-dropdown> | |||||
</div> | </div> | ||||
</el-header> | </el-header> | ||||
<el-main> | <el-main> | ||||
@@ -18,6 +26,9 @@ | |||||
import yqheaders from '@/components/header.vue' | import yqheaders from '@/components/header.vue' | ||||
import yqfooters from '@/components/footer.vue' | import yqfooters from '@/components/footer.vue' | ||||
import login from '@/components/login' | import login from '@/components/login' | ||||
import { mapState } from 'vuex' | |||||
import { logoutApi } from '@/api/login.js' | |||||
/* eslint-disable */ | |||||
export default { | export default { | ||||
name: 'layouts', | name: 'layouts', | ||||
data () { | data () { | ||||
@@ -30,9 +41,34 @@ export default { | |||||
yqfooters, | yqfooters, | ||||
login | login | ||||
}, | }, | ||||
computed: { | |||||
...mapState({ | |||||
isLogin: state => state.user.isLogin, | |||||
userInfo: state => state.user.userInfo | |||||
}) | |||||
}, | |||||
methods: { | methods: { | ||||
loginFn () { | loginFn () { | ||||
this.loginFlag = true | this.loginFlag = true | ||||
}, | |||||
logout() { | |||||
debugger | |||||
logoutApi().then(res => { | |||||
if (res.data.coode === 200) { | |||||
this.$store.dispatch('user/setIsLogin', false) | |||||
this.$store.dispatch('user/setUserInfo', {}) | |||||
Cookies.remove('token'); | |||||
this.$message({ | |||||
message: '退出成功', | |||||
type: 'success' | |||||
}); | |||||
}else { | |||||
this.$message({ | |||||
message: res.data.message, | |||||
type: 'warning' | |||||
}); | |||||
} | |||||
}) | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -40,6 +76,13 @@ export default { | |||||
<style lang="scss" scoped> | <style lang="scss" scoped> | ||||
.header{ | .header{ | ||||
width: 1200px !important; | width: 1200px !important; | ||||
position: relative; | |||||
} | |||||
.user { | |||||
position: absolute; | |||||
right: 0; | |||||
top: 30px; | |||||
color: #fff; | |||||
} | } | ||||
.el-container { | .el-container { | ||||
margin: 0; | margin: 0; | ||||
@@ -5,11 +5,13 @@ import 'element-ui/lib/theme-chalk/index.css' | |||||
import '@/styles/element-variables.scss' | import '@/styles/element-variables.scss' | ||||
import App from './App.vue' | import App from './App.vue' | ||||
import router from './router' | import router from './router' | ||||
import store from './store' | |||||
import moment from 'moment' | import moment from 'moment' | ||||
Vue.prototype.$moment = moment | Vue.prototype.$moment = moment | ||||
Vue.config.productionTip = false | Vue.config.productionTip = false | ||||
Vue.use(Element) | Vue.use(Element) | ||||
new Vue({ | new Vue({ | ||||
router, | router, | ||||
store, | |||||
render: h => h(App) | render: h => h(App) | ||||
}).$mount('#app') | }).$mount('#app') |
@@ -1,8 +1,4 @@ | |||||
/* | |||||
* @Date: 2021-07-16 17:52:04 | |||||
* @LastEditTime: 2022-07-27 10:48:11 | |||||
* @Description: | |||||
*/ | |||||
/* eslint-disable */ | |||||
const getters = { | const getters = { | ||||
sidebar: state => state.app.sidebar, | sidebar: state => state.app.sidebar, | ||||
device: state => state.app.device, | device: state => state.app.device, | ||||
@@ -1,3 +1,4 @@ | |||||
/* eslint-disable */ | |||||
import Vue from 'vue' | import Vue from 'vue' | ||||
import Vuex from 'vuex' | import Vuex from 'vuex' | ||||
import getters from './getters' | import getters from './getters' | ||||
@@ -1,70 +1,36 @@ | |||||
import { login, logout, getInfo } from '@/api/user' | |||||
import { getToken, removeToken } from '@/utils/auth' | |||||
import { resetRouter } from '@/router' | |||||
/* eslint-disable */ | |||||
const getDefaultState = () => { | const getDefaultState = () => { | ||||
return { | return { | ||||
loginFlag: false, | |||||
phone: '' | |||||
isLogin: false, | |||||
userInfo: {}, | |||||
token: '' | |||||
} | } | ||||
} | } | ||||
const state = getDefaultState() | const state = getDefaultState() | ||||
const mutations = { | const mutations = { | ||||
RESET_STATE: (state) => { | |||||
Object.assign(state, getDefaultState()) | |||||
SET_USERINFO: (state, userInfo) => { | |||||
state.userInfo = userInfo | |||||
}, | |||||
SET_ISLOGIN: (state, isLogin) => { | |||||
state.isLogin = isLogin | |||||
}, | }, | ||||
SET_TOKEN: (state, token) => { | SET_TOKEN: (state, token) => { | ||||
state.token = token | state.token = token | ||||
}, | |||||
SET_NAME: (state, name) => { | |||||
state.name = name | |||||
}, | |||||
SET_AVATAR: (state, avatar) => { | |||||
state.avatar = avatar | |||||
}, | |||||
SET_ISCHILD: (state, isChild) => { | |||||
state.isChild = isChild | |||||
}, | |||||
SET_Login: (state, roles) => { | |||||
state.roles = roles | |||||
} | } | ||||
} | } | ||||
const actions = { | const actions = { | ||||
setChild({ commit }, isChild) { | |||||
commit('SET_ISCHILD', isChild) | |||||
setUserInfo({ commit }, userInfo) { | |||||
commit('SET_USERINFO', userInfo) | |||||
}, | }, | ||||
setRoles({ commit }, roles) { | |||||
commit('SET_ROLES', roles) | |||||
setIsLogin({ commit }, isLogin) { | |||||
commit('SET_ISLOGIN', isLogin) | |||||
}, | }, | ||||
setToken({ commit }, token) { | setToken({ commit }, token) { | ||||
commit('SET_TOKEN', token) | commit('SET_TOKEN', token) | ||||
}, | }, | ||||
// user login | |||||
/* login({ commit }, userInfo) { | |||||
const { username, password } = userInfo | |||||
return new Promise((resolve, reject) => { | |||||
login({ username: username.trim(), password: password }).then(response => { | |||||
const { data } = response | |||||
commit('SET_TOKEN', data.token) | |||||
setToken(data.token) | |||||
resolve() | |||||
}).catch(error => { | |||||
reject(error) | |||||
}) | |||||
}) | |||||
}, */ | |||||
// remove token | |||||
resetToken({ commit }) { | |||||
return new Promise(resolve => { | |||||
removeToken() // must remove token first | |||||
commit('RESET_STATE') | |||||
resolve() | |||||
}) | |||||
} | |||||
} | } | ||||
export default { | export default { | ||||
@@ -2,27 +2,11 @@ | |||||
<div class="aigc"> | <div class="aigc"> | ||||
<div id="top"> | <div id="top"> | ||||
<Swiper :banner-array="carouselList" /> | <Swiper :banner-array="carouselList" /> | ||||
<!-- <el-form ref="form" :model="form" label-width="0px"> | |||||
<el-form ref="form" :model="form" label-width="0px"> | |||||
<el-form-item> | <el-form-item> | ||||
<el-input v-model="form.phone" placeholder="手机号"></el-input> | |||||
<el-button type="primary" class="createai" @click="loginFn">{{ isLogin ? '制作数字人' : '登录'}}</el-button> | |||||
</el-form-item> | </el-form-item> | ||||
<el-form-item> | |||||
<el-input v-model="form.password" placeholder="登录密码"></el-input> | |||||
</el-form-item> | |||||
<el-form-item> | |||||
<el-input class="identify" v-model="form.code" placeholder="验证码"></el-input> | |||||
<img :src="verifyCodeUrl" class="code" alt=""> | |||||
</el-form-item> | |||||
<el-form-item class="nomargin"> | |||||
<el-button type="primary" @click="login">登录</el-button> | |||||
</el-form-item> | |||||
<el-form-item class="nomargin"> | |||||
<a>使用短信登录</a> | |||||
</el-form-item> | |||||
<el-form-item> | |||||
<el-button type="primary" class="createai">制作数字人</el-button> | |||||
</el-form-item> | |||||
</el-form> --> | |||||
</el-form> | |||||
</div> | </div> | ||||
<div id="hot"> | <div id="hot"> | ||||
<div class="content"> | <div class="content"> | ||||
@@ -71,11 +55,15 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<login v-if="loginFlag" /> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
/* eslint-disable */ | |||||
import Swiper from '@/components/swiper' | import Swiper from '@/components/swiper' | ||||
import SwiperHor from '@/components/swiperHor' | import SwiperHor from '@/components/swiperHor' | ||||
import { mapState } from 'vuex' | |||||
import login from '@/components/login' | |||||
import { guanggao, shuzirenremark, shuzirenList, shuzirenZhiBoList, videoList, lunboList } from '@/api/aigc.js' | import { guanggao, shuzirenremark, shuzirenList, shuzirenZhiBoList, videoList, lunboList } from '@/api/aigc.js' | ||||
export default { | export default { | ||||
name: 'aigc', | name: 'aigc', | ||||
@@ -100,12 +88,18 @@ export default { | |||||
aigcsp: [], | aigcsp: [], | ||||
gg1: {}, | gg1: {}, | ||||
gg2: {}, | gg2: {}, | ||||
verifyCodeUrl: 'https://www.meta-autotv.com/C/api/user/captcha.jpg' | |||||
loginFlag: false | |||||
} | } | ||||
}, | }, | ||||
components: { | components: { | ||||
Swiper, | Swiper, | ||||
SwiperHor | |||||
SwiperHor, | |||||
login | |||||
}, | |||||
computed: { | |||||
...mapState({ | |||||
isLogin: state => state.user.isLogin | |||||
}) | |||||
}, | }, | ||||
mounted () { | mounted () { | ||||
this.getguanggao() | this.getguanggao() | ||||
@@ -116,6 +110,13 @@ export default { | |||||
this.getlunboList() | this.getlunboList() | ||||
}, | }, | ||||
methods: { | methods: { | ||||
loginFn() { | |||||
if (this.isLogin) { | |||||
window.open() | |||||
} else { | |||||
this.loginFlag = true | |||||
} | |||||
}, | |||||
async getlunboList () { | async getlunboList () { | ||||
const { data: { code, data } } = await lunboList() | const { data: { code, data } } = await lunboList() | ||||
if (code === 200) { | if (code === 200) { | ||||