提交 227db394 authored 作者: 王鹏飞's avatar 王鹏飞

新增sofia登录

上级 3110eb38
差异被折叠。
...@@ -65,18 +65,18 @@ ...@@ -65,18 +65,18 @@
"webpack-merge": "^4.2.2" "webpack-merge": "^4.2.2"
}, },
"dependencies": { "dependencies": {
"axios": "^0.19.2", "axios": "^0.20.0",
"cross-env": "^7.0.2", "cross-env": "^7.0.2",
"element-ui": "^2.13.0", "element-ui": "^2.13.2",
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"lodash": "^4.17.15", "lodash": "^4.17.20",
"promise.prototype.finally": "^3.1.2", "promise.prototype.finally": "^3.1.2",
"regenerator": "^0.14.4", "regenerator": "^0.14.4",
"vue": "^2.6.11", "vue": "^2.6.12",
"vue-i18n": "^8.16.0", "vue-i18n": "^8.21.0",
"vue-loader": "^15.9.1", "vue-loader": "^15.9.1",
"vue-meta-info": "^0.1.7", "vue-meta-info": "^0.1.7",
"vue-router": "^3.1.6", "vue-router": "^3.4.3",
"vue-template-compiler": "^2.6.11" "vue-template-compiler": "^2.6.11"
} }
} }
import BaseACTION from './base_action'
import { Test } from '@api'
export default class TestAction extends BaseACTION {
/* get传输方式 */
getTest (id) {
return Test.getTest(id).then(res => {
return res || { test: this.getVueInstance().$t('action.interface') }
}).catch(res => {
return res || { test: this.getVueInstance().$t('action.interface') }
})
}
/* post传输方式 */
postTest (obj = {}) {
return Test.postTest(obj).then(res => {
return res || { test: 'OK' }
}).catch(res => {
return res || { test: 'OK' }
})
}
/* 当前登录用户,检测是否该系统有权限 */
getInfo () {
return Test.getInfo().then(res => {
return res || { test: 'OK' }
}).catch(res => {
return res || { test: 'OK' }
})
}
}
export default class ACTION {
getVueInstance () {
return window.G.$instance_vue
}
}
import TestAction from './TestAction'
const Test = new TestAction()
const cAction = {
Test
}
export default cAction
import httpRequest from '@/utils/axios'
// 登录
export function login(data) {
return httpRequest.post('/api/passport/rest/login', data)
}
// 绑定微信
export function bindWechat(data) {
return httpRequest.post('/api/passport/rest/wechat/bind-unionid', data)
}
// 重置密码
export function resetPassword(data) {
return httpRequest.post('/api/usercenter/user/update-pwd', data)
}
// 发送重置验证码
export function sendCode(data) {
return httpRequest.post('/api/usercenter/user/send-code', data)
}
// 登出
export function logout() {
return httpRequest.get('/api/passport/rest/logout')
}
// 获取用户信息
export function getUser() {
return httpRequest.get('/api/passport/account/get-user-info')
}
import axios from 'axios'
import _ from 'lodash'
export default class API {
constructor (config) {
/* 创建一个 自定义配置axios实例 */
// 让ajax携带cookie
axios.defaults.withCredentials = true
this._axios = axios.create({
timeout: config.timeout || 5 * 1000,
/* 表示服务器响应的数据类型,可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream' */
responseType: config.resType || 'json',
/* 将自动加在 `url` 前面,除非 `url` 是一个绝对 URL */
baseURL: config.apiBaseURL || '',
/* 即将被发送的自定义请求头 */
headers: {
Accept: '*/*',
'Accept-Language': '',
'Content-Type': 'application/x-www-form-urlencoded'
}
})
}
/* 获取当前Vue创建实例 */
getVueInstance () {
return window.G.$instance_vue
}
/* 重新封装 请求时的执行函数 */
_request (_config = {}) {
/* 具体执行请求成功后业务逻辑前,先执行该方法 */
const beforeSuccess = _config.beforeSuccess ? _config.beforeSuccess : this._reqSuccess
/* 具体执行请求失败后业务逻辑前,先执行该方法 */
const beforeFail = _config.beforeFail ? _config.beforeFail : this._reqFail
const headers = {}
_config.headers = _.assignIn(_config.headers, headers)
/* 判别 传输方式 */
if (_config.headers['Content-Type'] === 'application/x-www-form-urlencoded') {
let str = ''
const _obj = _config.data || _config.params
for (const key in _obj) {
str += key + '=' + _obj[key] + '&'
}
str = str.substr(0, str.length - 1)
if (_config.data) {
_config.data = str
} else {
_config.params = str
}
}
if (_config.headers['Content-Type'] === 'multipart/form-data') {
let fr = new FormData() // eslint-disable-line
const _obj = _config.data || _config.params
for (const key in _obj) {
fr.append(key, _obj[key])
}
_config.data = fr
}
/* 创建并根据参数发起请求 */
return this._axios(_config)
.then(beforeSuccess.bind(this), beforeFail.bind(this))
}
/**
* 统一处理request success操作,在实现业务逻辑前进行统一处理。
* 注意:如果不能满足需求,可在接口定义处重新实现
* @param {[object]} res 返回数据
*/
_reqSuccess (res) {
const { status, data } = res
let err = null
if (status === 200) {
return data
} else {
err = new Error(JSON.stringify(res.data))
throw err
}
}
/**
* 统一处理request fail操作,在实现业务逻辑前进行统一处理。
* 注意:如果不能满足需求,可在接口定义处重新实现
* @param {[object]} res 如果未到达 response 阶段,则无res.response
*/
_reqFail (res) {
let err = null
if (res.code === 'ECONNABORTED') {
err = new Error('网络超时,请稍后重试')
} else if (res.response) {
err = new Error(JSON.stringify(res.response))
} else {
err = new Error('msg:' + res.message + 'stack:' + res.stack)
err.code = 500
}
/* 如果出错,创建错误对象,并抛出一个错误。 */
throw err
}
/* 重新实现 get请求 */
get (url, data, config) {
return this._request(_.assignIn({ url, method: 'GET', params: data }, config))
}
/* 重新实现 post请求 */
post (url, data, config) {
return this._request(_.assignIn({ url, method: 'POST', data: data }, config))
}
/* 重新实现 put请求 */
put (url, data, config) {
return this._request(_.assignIn({ url, method: 'PUT', data: data }, config))
}
/* 重新实现 delete请求 */
delete (url, data, config) {
return this._request(_.assignIn({ url, method: 'DELETE', params: data }, config))
}
}
import TestAPI from './test_api'
const Test = new TestAPI(webConf)
export {
Test
}
import BaseAPI from './base_api'
export default class TestAPI extends BaseAPI {
/**
* get传输方式
* @param {[string]} id resource_id
*/
getTest = (id) => this.get(`/vue-client/get/${id}`, {})
/**
* post传输方式
* @param {[object]} obj
*/
postTest = (obj = {}) => this.post('/passport/rest/login', obj, { headers: { 'Content-Type': 'multipart/form-data' } })
/**
* 当前登录用户,检测是否该系统有权限
*/
getInfo = () => this.post('/user_center/get_user_info', {}, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
}
<template>
<el-button v-bind="$attrs" :disabled="currentDisabled" @click="start">{{ curretnValue }}</el-button>
</template>
<script>
export default {
name: 'Countdown',
props: {
step: { type: Number, default: 1000 },
disabled: { type: Boolean, default: false },
seconds: { type: Number, default: 60 },
defaultValue: { type: String, default: '获取验证码' }
},
data() {
return {
currentDisabled: false,
currentSeconds: 0,
timer: null
}
},
watch: {
disabled: {
immediate: true,
handler(value) {
this.currentDisabled = value
}
}
},
computed: {
curretnValue() {
const longTime = this.seconds - this.currentSeconds
return longTime < this.seconds ? `${longTime}秒后重发` : this.defaultValue
}
},
methods: {
genTimer() {
this.clearTimer()
this.timer = setInterval(() => {
this.currentSeconds++
if (this.currentSeconds === this.seconds) {
this.stop()
}
}, this.step)
},
clearTimer() {
this.timer && clearInterval(this.timer)
},
start() {
this.currentDisabled = true
this.genTimer()
this.$emit('start')
},
stop() {
this.clearTimer()
this.currentSeconds = 0
this.currentDisabled = false
this.$emit('stop')
}
}
}
</script>
<template>
<div>
<el-form :model="ruleForm" :rules="rules" ref="form" @submit.native.prevent>
<el-form-item prop="account">
<el-input
v-model="ruleForm.account"
placeholder="邮箱/手机号"
@keyup.enter.native="handleSubmit"
>
<i slot="prefix" class="el-input__icon el-icon-user"></i>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
type="password"
v-model="ruleForm.password"
placeholder="请输入登录密码"
@keyup.enter.native="handleSubmit"
>
<i slot="prefix" class="el-input__icon el-icon-lock"></i>
</el-input>
</el-form-item>
<el-checkbox v-model="ruleForm.RememberMe" style="margin-bottom:10px;">记住我</el-checkbox>
<el-button type="primary" class="submit-button" :loading="loading" @click="handleSubmit">登录</el-button>
</el-form>
<div class="login-footer">
<router-link to="code">手机号登录</router-link>
<router-link to="../password">忘记密码</router-link>
</div>
</div>
</template>
<script>
import * as api from '@/api/account'
export default {
name: 'AccountLogin',
data() {
return {
ruleForm: { type: 1, account: '', password: '', RememberMe: false, service: 'https://h5.ezijing.com' },
rules: {
account: [{ required: true, message: '请输入账号名', trigger: 'change' }],
password: [{ required: true, message: '请输入密码', trigger: 'change' }]
},
loading: false
}
},
computed: {
// 重定向地址
redirectURI() {
const { query } = this.$route
return query.redirect_uri ? decodeURIComponent(query.redirect_uri) : ''
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 接口请求
handleRequest() {
this.loading = true
api.login(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 登录成功
handleSuccess(response) {
this.$message({ type: 'success', message: '登录成功' })
if (document.referrer) {
window.location.href = document.referrer
}
// if (this.redirectURI) {
// } else {
// this.$router.replace('/')
// }
}
}
}
</script>
<template>
<div>
<el-form :model="ruleForm" :rules="rules" ref="form" @submit.native.prevent>
<el-form-item prop="account">
<el-input v-model="ruleForm.account" placeholder="手机号" @keyup.enter.native="handleSubmit">
<i slot="prefix" class="el-input__icon el-icon-mobile-phone"></i>
</el-input>
</el-form-item>
<el-form-item prop="password">
<el-input
v-model="ruleForm.password"
placeholder="请输入登录验证码"
@keyup.enter.native="handleSubmit"
>
<i slot="prefix" class="el-input__icon el-icon-unlock"></i>
<countdown
slot="suffix"
size="mini"
:disabled="disabledSend"
@start="sendCodeRequest"
ref="countdown"
></countdown>
</el-input>
</el-form-item>
<el-checkbox v-model="ruleForm.RememberMe" style="margin-bottom:10px;">记住我</el-checkbox>
<el-button type="primary" class="submit-button" @click="handleSubmit">登录</el-button>
</el-form>
<div class="login-footer">
<router-link to="index">账号登录</router-link>
<router-link to="../password">忘记密码</router-link>
</div>
</div>
</template>
<script>
import * as api from '@/api/account'
import countdown from './countdown.vue'
export default {
name: 'CodeLogin',
components: { countdown },
data() {
return {
ruleForm: { type: 2, account: '', password: '', RememberMe: false, service: 'https://h5.ezijing.com' },
rules: {
account: [{ required: true, message: '请输入手机号', trigger: 'change' }],
password: [{ required: true, message: '请输入验证码', trigger: 'change' }]
},
loading: false
}
},
computed: {
// 重定向地址
redirectURI() {
const { query } = this.$route
return query.redirect_uri ? decodeURIComponent(query.redirect_uri) : ''
},
disabledSend() {
return !/^1[3-9]\d{9}$/.test(this.ruleForm.account)
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 登录
handleRequest() {
this.loading = true
api.login(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 登录成功
handleSuccess(response) {
this.$message({ type: 'success', message: '登录成功' })
if (document.referrer) {
window.location.href = document.referrer
}
// if (this.redirectURI) {
// this.$message({ type: 'success', message: '登录成功' })
// window.location.href = this.redirectURI
// } else {
// this.$router.replace('/')
// }
},
// 验证码
sendCodeRequest() {
api
.sendCode({ account: this.ruleForm.account })
.then(response => {
console.log(response)
if (response.code === 0) {
this.$message({ type: 'success', message: '验证码已发送' })
} else {
// 停止计时
this.$refs.countdown.stop()
this.$message({ type: 'error', message: response.msg })
}
})
.catch(this.$refs.countdown.stop)
}
}
}
</script>
<template>
<div>
<el-form :model="ruleForm" :rules="rules" ref="form" @submit.native.prevent>
<el-form-item prop="account" label="账号">
<el-input v-model="ruleForm.account" placeholder="邮箱/手机号">
<i slot="prefix" class="el-input__icon el-icon-user"></i>
</el-input>
</el-form-item>
<el-form-item prop="code" label="验证码">
<el-input v-model="ruleForm.code" placeholder="请输入验证码">
<i slot="prefix" class="el-input__icon el-icon-unlock"></i>
<countdown
slot="suffix"
size="mini"
:disabled="disabledSend"
@start="sendCodeRequest"
ref="countdown"
></countdown>
</el-input>
</el-form-item>
<el-form-item prop="password" label="新密码">
<el-input type="password" v-model="ruleForm.password" placeholder="请输入新登录密码">
<i slot="prefix" class="el-input__icon el-icon-lock"></i>
</el-input>
</el-form-item>
<el-form-item prop="passwordR" label="确认新密码">
<el-input type="password" v-model="ruleForm.passwordR" placeholder="请输入新登录密码">
<i slot="prefix" class="el-input__icon el-icon-lock"></i>
</el-input>
</el-form-item>
<el-button type="primary" class="submit-button" :loading="loading" @click="handleSubmit">提交</el-button>
</el-form>
</div>
</template>
<script>
import * as api from '@/api/account'
import countdown from './countdown.vue'
export default {
name: 'Password',
components: { countdown },
data() {
const validatePass = (rule, value, callback) => {
if (value === '') {
callback(new Error('请再次输入密码'))
} else if (value !== this.ruleForm.password) {
callback(new Error('两次输入密码不一致!'))
} else {
callback()
}
}
return {
ruleForm: { account: '', code: '', password: '', passwordR: '' },
rules: {
account: [{ required: true, message: '请输入账号名', trigger: 'blur' }],
code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
password: [
{ required: true, message: '请输入新密码', trigger: 'blur' },
{ min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
],
passwordR: [
{ required: true, message: '请输入新密码', trigger: 'blur' },
{ validator: validatePass, trigger: 'blur' }
]
},
loading: false
}
},
computed: {
disabledSend() {
const value = this.ruleForm.account
return !(/^1[3-9]\d{9}$/.test(value) || /@/.test(value))
}
},
methods: {
// 提交
handleSubmit() {
this.$refs.form.validate().then(this.handleRequest)
},
// 接口请求
handleRequest() {
this.loading = true
api.resetPassword(this.ruleForm).then(response => {
response.code === 0 ? this.handleSuccess(response) : this.$message.error(response.msg)
this.loading = false
})
},
// 成功
handleSuccess(response) {
this.$alert('密码修改成功,快去登录吧', '提示', {
type: 'success',
confirmButtonText: '去登录',
callback: action => {
this.$router.push('login')
}
})
},
// 验证码
sendCodeRequest() {
api
.sendCode({ account: this.ruleForm.account })
.then(response => {
console.log(response)
if (response.code === 0) {
this.$message({ type: 'success', message: '验证码已发送' })
} else {
// 停止计时
this.$refs.countdown.stop()
this.$message({ type: 'error', message: response.msg })
}
})
.catch(this.$refs.countdown.stop)
}
}
}
</script>
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<!-- <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> --> <!-- <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> -->
<!-- <meta http-equiv="Pragma" content="no-cache" /> --> <!-- <meta http-equiv="Pragma" content="no-cache" /> -->
<!-- <meta http-equiv="Expires" content="0" /> --> <!-- <meta http-equiv="Expires" content="0" /> -->
<title>登录</title> <title>紫荆教育MBA学习系统</title>
<meta <meta
name="viewport" name="viewport"
id="viewport" id="viewport"
......
<template>
<div class="wrapper">
<header class="header">
<div class="header-logo">
<img src="../../../assets/sofia/logo.png" />
</div>
<div class="header-title">在线学习系统</div>
</header>
<section class="main">
<router-view></router-view>
</section>
<footer class="footer">
<p class="t1">
学习平台服务电话:010-62793299
<br />服务时间:9:00-18:00
</p>
<p class="t2">
Copyright © 2020 Zijing Education. All rights reserved.
<br />清控紫荆(北京)教育科技股份有限公司 京ICP证150431号 京公网安备 11010802023681号
</p>
</footer>
</div>
</template>
<script>
export default {}
</script>
<style lang="scss" scoped>
.wrapper {
min-height: 100vh;
display: flex;
flex-direction: column;
}
.header {
height: 100px;
padding: 30px 0 20px;
text-align: center;
}
.header-title {
margin-top: 5px;
font-size: 32px;
font-weight: 700;
letter-spacing: 5px;
}
.main {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
background-color: #981838;
padding: 40px 20px;
}
.footer {
padding: 20px 10px;
text-align: center;
.t1 {
color: #535353;
}
.t2 {
margin-top: 10px;
color: #898989;
}
}
</style>
<template>
<div class="login">
<el-row type="flex" justify="space-between" align="middle" style="width:100%">
<el-col :span="12" class="hidden-xs-only">
<div class="login-logo">
<img src="../../assets/sofia/login_logo.png" />
</div>
</el-col>
<el-col :span="12" :xs="24">
<div class="login-box">
<router-view></router-view>
</div>
</el-col>
</el-row>
</div>
</template>
<style lang="scss" scoped>
.login {
color: #fff;
width: 100%;
max-width: 660px;
margin: 0 auto;
}
</style>
<template>
<div class="password">
<el-page-header @back="$router.push('login')" title="返回登录" content="忘记密码"></el-page-header>
<div class="password-form">
<router-view></router-view>
</div>
</div>
</template>
<script>
export default {}
</script>
<style lang="scss" scoped>
.password {
width: 100%;
max-width: 1000px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
}
.password-form {
max-width: 340px;
margin: 40px auto;
}
</style>
<template>
<div class="abc">
<div>这是一个测试页面{{test}}</div>
<!-- 外部引入字体库 -->
<div class="el-icon-self-star_full"></div>
<!-- 页面引入的两种方式 -->
<img :src="require('@/assets/images/logo.png')" alt="">
<img src="@/assets/images/logo.png" alt="">
<!-- 切换中英文 -->
<s-language></s-language>
<div @click="changeLanguage">切换中英文:{{ $t('common.title') }}</div>
<!-- css图片引入 -->
<div class="bg-img"></div>
<!-- 引入 模块 -->
<test-module></test-module>
<!-- element-ui 弹框 查看中英文切换 -->
<div @click="alertMsg">点击弹框</div>
</div>
</template>
<script>
import sLanguage from '@/components/languageSwitch/index.vue'
import action from '@action'
export default {
components: { sLanguage },
data () {
return {
test: 'abc'
}
},
metaInfo () {
return {
title: '独立 - 标题',
meta: [
// { vmid: 'description', name: 'description', content: this.description }
]
}
},
mounted () {
/* 接口请求测试 */
// action.Test.getTest('1').then((res) => {
// console.log(res)
// })
action.Test.postTest().then(res => {
console.log(res)
})
console.log(1, CKEDITOR)
console.log(2, Base64)
console.log(3, md5)
},
methods: {
changeLanguage () {
this.$i18n.locale = (this.$i18n.locale === 'cn' ? 'en' : 'cn')
},
alertMsg () {
this.$alert('这是一段内容', '标题名称', {
callback: action => {}
})
}
}
}
</script>
<style lang="scss" scoped>
.bg-img {
width: 134px;
height: 44px;
background: url('~@/assets/images/logo.png') no-repeat;
}
</style>
const loginAccount = () => import(/* webpackChunkName: "login" */ '@/components/loginAccount.vue')
const loginCode = () => import(/* webpackChunkName: "login" */ '@/components/loginCode.vue')
const password = () => import(/* webpackChunkName: "login" */ '@/components/password.vue')
export default [ export default [
{ path: '/', redirect: '/test' }, { path: '*', redirect: '/sofia' },
/* 测试页面 */ {
{ path: '/test', name: 'test', component: () => import('../pages/test.vue') }, path: '/sofia',
/* 如果所有页面都没找到 - 指向 */ component: () => import(/* webpackChunkName: "sofia" */ '../pages/sofia/components/layout.vue'),
{ path: '*', component: () => import('@/components/errorPages/404.vue') } children: [
{ path: '', redirect: 'login/index' },
{
path: 'login',
component: () => import(/* webpackChunkName: "sofia" */ '../pages/sofia/login.vue'),
children: [
{ path: '', redirect: 'index' },
{ path: 'index', component: loginAccount },
{ path: 'code', component: loginCode }
]
},
{
path: 'password',
component: () => import(/* webpackChunkName: "sofia" */ '../pages/sofia/password.vue'),
children: [{ path: '', component: password }]
}
]
}
] ]
html, body { * {
font-size: 14px; // 防止html根元素 影响本身DOM元素字体大小继承
padding: 0;
margin: 0; margin: 0;
height: 100%; padding: 0;
width: 100%;
background: #eee;
} }
/* 统一字体样式 */ html,
* { body {
font-family: font-size: 14px;
"Source Han Sans CN", font-family: 'Source Han Sans CN', 'PingFang SC', -apple-system, 'Microsoft YaHei', 'Helvetica', 'Arial', Verdana,
"PingFang SC", 'Hiragino Sans GB', 'Wenquanyi Micro Hei', sans-serif;
-apple-system, color: #535353;
"Microsoft YaHei",
"Helvetica",
"Arial",
Verdana,
"Hiragino Sans GB",
"Wenquanyi Micro Hei",
sans-serif;
} }
/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575px) {}
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767px) {}
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991px) {}
/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199px) {}
/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {}
/* 改变主题色变量 */ /* 改变主题色变量 */
$--color-primary: #b80037; $--color-primary: #b80037;
/* 改变 icon 字体路径变量,必需 */ /* 改变 icon 字体路径变量,必需 */
$--font-path: '~element-ui/lib/theme-chalk/fonts'; $--font-path: '~element-ui/lib/theme-chalk/fonts';
/* 引入element-ui对应scss文件,重新编译 */ /* 引入element-ui对应scss文件,重新编译 */
@import "~element-ui/packages/theme-chalk/src/index"; @import '~element-ui/packages/theme-chalk/src/index';
/* 引入隐藏显示样式 */ /* 引入隐藏显示样式 */
@import "~element-ui/lib/theme-chalk/display.css"; @import '~element-ui/lib/theme-chalk/display.css';
/* 引入三方 自定义图标库,方法 vue -> 第三方 自建图标库 中有 */ .submit-button {
@import "~@/assets/font-icons/iconfont.css"; width: 100%;
[class^="el-icon-self-"], [class*="el-icon-self-"] { display: block;
font-family: "selfAllIcon" !important; }
font-size: 16px; .login-footer {
font-style: normal; padding: 10px 0;
-webkit-font-smoothing: antialiased; display: flex;
-moz-osx-font-smoothing: grayscale; justify-content: space-between;
}
.login-footer a {
text-decoration: none;
color: #fff;
} }
export default class ConvertTime {
/**
* 工具方法 - 播放时间 转化 h:m:s
* @param {[string]} duration 时间戳
*/
durationToTimeString (duration) {
let h = Math.floor(duration / 3600)
let m = Math.floor((duration - h * 3600) / 60)
let s = (duration - h * 3600 - m * 60) % 60
function tenify (a) {
return a >= 10 ? a : '0' + a
}
let to = { h: tenify(h), m: tenify(m), s: tenify(s) }
let format = 'h:m:s'
return format.replace(/h|m|s/g, k => to[k]).replace(/^00:/, '')
}
}
export default class Cookies {
/*
name: cookies的名字,也是cookies的唯一标识,通过他来获取和设置cookies
value:cookies的值,也就是cookies的内容,这是cookies有用的内容
Domain:cookies所属的域
Path: cookies所属的路径,他是属于某个路径的,/代表根路径
expires:cookies的到期时间,如果为0则永不过期
http: 如果打钩则通过脚本无法获取,可以防止xss攻击
secure:https连接才会传送该cookies,增强了安全性
sameSite:可选值Strict 和 Lax,Strict 严格模式,不能被第三方网站获取,Lax:宽松模式,可以被第三方获取
*/
/* 如果 http 打钩,则 这边的 脚本函数将全部失效,而线上就是这么做的 */
/**
* 设置 Cookies,用于客户端
* @param {[string]} cName 要设置cookie的key值
* @param {[string]} cValue 要设置cookie的value值
* @param {[object]} obj 要设置cookie的其他值
* @param {[object]} obj.path 路径
* @param {[object]} obj.domain 域名
* @param {[object]} obj.expires 过期时间
*/
setCookie (cName, cValue, obj) {
let d = new Date()
if (obj.expires) {
d.setTime(d.getTime() + ((obj.expires || 0) * 24 * 60 * 60 * 1000))
obj.expires = d.toUTCString()
}
let str = ''
for (let key in obj) {
str += '; ' + key + '=' + obj[key]
}
document.cookie = cName + '=' + cValue + str
}
/**
* 获取指定cookie,用于客户端
* @param {[string]} cName 要获取cookie的key值
*/
getCookie (cName) {
let key = cName + '='
let ca = document.cookie.split(';')
for (let i = 0; i < ca.length; i++) {
let c = ca[i]
while (c.charAt(0) === ' ') c = c.substring(1)
if (c.indexOf(key) !== -1) {
return c.substring(key.length, c.length)
}
}
return ''
}
/**
* 获取全cookie,用于客户端
*/
getAllCookies () {
return document.cookie
}
/**
* 清除cookie,用于客户端
* 需要path 和 domain 唯一确定 一个 cookie
* @param {[string]} cName 要清除cookie的key值
* @param {[object]} obj.path 路径
* @param {[object]} obj.domain 域名
* @param {[object]} obj.expires 过期时间
*/
clearCookie (cName, obj) {
let exp = new Date() // 获取客户端本地当前系统时间
// 将exp设置为客户端本地时间1分钟以前,将exp赋值给cookie作为过期时间后,就表示该cookie已经过期了, 那么浏览器就会将其立刻删除掉
exp.setTime(exp.getTime() - 60 * 1000)
obj.expires = exp.toUTCString()
let str = ''
for (let key in obj) {
str += '; ' + key + '=' + obj[key]
}
document.cookie = cName + '=' + str
}
}
import Cookies from './cookies'
import ConvertTime from './convert_time'
import Other from './other'
let cookies = new Cookies()
let convertTime = new ConvertTime()
let other = new Other()
export default {
cookies,
convertTime,
other
}
export default class Other {
/**
* 获取idt
*/
getIdt () {
let cookieName = '_idt'
// 尝试从cookie获取
let idt = /_idt=/.test(document.cookie) && document.cookie.replace(/.*_idt=([^;]+).*/, '$1')
if (!idt) {
idt = (new Date()).getTime().toString(36) + Math.random().toString(32) + Math.random().toString(32)
let d = new Date()
d.setMonth(d.getMonth() + 6)
document.cookie = cookieName + '=' + idt + ';path=/;domain=.ezijing.com;expires=' + d.toGMTString()
}
return idt
}
}
import axios from 'axios'
import qs from 'qs'
import { Message } from 'element-ui'
const httpRequest = axios.create({
// baseURL: process.env.VUE_APP_BASE_API,
timeout: 60000,
withCredentials: true,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
})
// 请求拦截
httpRequest.interceptors.request.use(
function(config) {
if (config.headers['Content-Type'] === 'application/x-www-form-urlencoded') {
config.data = qs.stringify(config.data)
}
return config
},
function(error) {
return Promise.reject(error)
}
)
// 响应拦截
httpRequest.interceptors.response.use(
function(response) {
return response.data
},
function(error) {
if (error.response) {
const { status, message } = error.response.data
if (status === 400) {
Message.error(message)
}
} else {
Message.error(error)
}
return Promise.reject(error)
}
)
export default httpRequest
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论