code-image-backup-public/fastbee
1
0
Fork 0
mirror of https://gitee.com/beecue/fastbee.git synced 2026-03-21 22:14:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'origin/master'

Browse Source
This commit is contained in:
gx_ma
2026-03-11 14:17:29 +08:00
parent 3bfada91d9 1630f510da
commit 0634d69f3d
3 changed files with 988 additions and 377 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
vue/src/api/login.js
View File

@@ -93,12 +93,6 @@ export function bindLogin(data) {
}); });
} }
export function getErrorMsg(errorId) {
return request({
url: '/auth/getErrorMsg/' + errorId,
method: 'get',
});
}
// 三方登录注册绑定 // 三方登录注册绑定
@@ -113,3 +107,103 @@ export function bindRegister(data) {
data: data, data: data,
}); });
} }
//短信登录获取验证码
export function getSmsLoginCaptcha(phoneNumber) {
return request({
url: '/notify/smsLoginCaptcha?phoneNumber=' + phoneNumber,
method: 'get',
});
}
// 短信登录
export function smsLogin(data) {
return request({
url: '/auth/sms/login',
method: 'post',
data: data,
});
}
export function getErrorMsg(errorId) {
return request({
url: '/auth/getErrorMsg/' + errorId,
method: 'get',
});
}
// 忘记密码发送短信
export function getSmsForgetPassword(phoneNumber) {
return request({
url: '/notify/smsForgetPassword?phoneNumber=' + phoneNumber,
method: 'get',
});
}
// 忘记密码重置用户密码
export function forgetPwdReset(data) {
return request({
url: '/system/user/forgetPwdReset',
method: 'put',
data: data,
});
}
// ========== OAUTH 2.0 相关 ==========
export function getAuthorize(clientId) {
return request({
url: '/oauth2/authorize?clientId=' + clientId,
method: 'get',
});
}
export function authorize(responseType, clientId, redirectUri, state, autoApprove, checkedScopes, uncheckedScopes) {
// 构建 scopes
const scopes = {};
for (const scope of checkedScopes) {
scopes[scope] = true;
}
for (const scope of uncheckedScopes) {
scopes[scope] = false;
}
// 发起请求
return request({
url: '/oauth2/authorize',
headers: {
'Content-type': 'application/x-www-form-urlencoded',
},
params: {
response_type: responseType,
client_id: clientId,
redirect_uri: redirectUri,
state: state,
auto_approve: autoApprove,
scope: JSON.stringify(scopes),
},
method: 'post',
});
}
//登录
export function oauthLogin(data) {
return request({
url: '/auth/ssoLogin',
method: 'post',
data: data,
});
}
//修改语言
export function changeLanguage(lang) {
return request({
url: '/changeLanguage',
method: 'get',
headers: {
isToken: false,
},
params: {
lang: lang,
},
});
}

386
vue/src/views/iot/platform/index.vue Normal file
View File

@@ -0,0 +1,386 @@
<template>
<div class="iot-platform">
<el-card v-show="showSearch" class="search-card">
<el-form @submit.native.prevent :model="queryParams" ref="queryForm" :inline="true" label-width="85px" class="search-form">
<el-form-item prop="platform">
<el-select v-model="queryParams.platform" clearable placeholder="请选择平台">
<el-option v-for="dict in dict.type.iot_social_platform" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<el-form-item prop="status">
<el-select v-model="queryParams.status" clearable placeholder="请选择状态">
<el-option v-for="dict in dict.type.iot_social_platform_status" :key="dict.value" :label="dict.label" :value="dict.value" />
</el-select>
</el-form-item>
<div style="float: right">
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</div>
</el-form>
</el-card>
<el-card>
<el-row :gutter="10" style="margin-bottom: 16px">
<el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="small" @click="handleAdd" v-hasPermi="['iot:platform:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button plain icon="el-icon-edit" size="small" :disabled="single" @click="handleUpdate" v-hasPermi="['iot:platform:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button plain icon="el-icon-delete" size="small" :disabled="multiple" @click="handleDelete" v-hasPermi="['iot:platform:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button plain icon="el-icon-download" size="small" @click="handleExport" v-hasPermi="['iot:platform:export']">导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="platformList" :border="false" @selection-change="handleSelectionChange" ref="multipleTable" :row-key="getRowKeys">
<el-table-column :reserve-selection="true" type="selection" width="55" align="center" />
<el-table-column align="left" label="平台名称" prop="platform" min-width="200">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_social_platform" :value="scope.row.platform" />
</template>
</el-table-column>
<el-table-column align="center" label="状态" prop="status" width="80">
<template slot-scope="scope">
<dict-tag :options="dict.type.iot_social_platform_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column label="平台申请ID" align="center" prop="clientId" min-width="180" />
<el-table-column label="跳转地址" align="left" prop="redirectUri" min-width="250" :show-overflow-tooltip="true" />
<el-table-column align="left" label="绑定登录uri" prop="bindUri" :show-tooltip-when-overflow="true" :render-header="(h, column) => renderHeaderMethods(h, column, columnTips.bindId)" min-width="250" />
<el-table-column
align="left"
label="跳转登录uri"
prop="redirectLoginUri"
:show-tooltip-when-overflow="true"
:render-header="(h, column) => renderHeaderMethods(h, column, columnTips.redirectLogin)"
min-width="250"
/>
<el-table-column
align="left"
label="错误提示uri"
prop="errorMsgUri"
:show-tooltip-when-overflow="true"
:render-header="(h, column) => renderHeaderMethods(h, column, columnTips.errorId)"
min-width="250"
/>
<el-table-column align="center" label="创建时间" prop="createTime" width="100">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" align="center" width="125">
<template slot-scope="scope">
<el-button size="small" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['iot:platform:edit']">修改</el-button>
<el-button size="small" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['iot:platform:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination style="margin-bottom: 20px" v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 添加或修改第三方登录平台控制对话框 -->
<el-dialog :title="title" :visible.sync="open" width="630px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="130px">
<el-form-item label="平台名称" prop="platform">
<el-select v-model="form.platform" placeholder="请选择平台" style="width: 400px">
<el-option v-for="dict in dict.type.iot_social_platform" :key="dict.value" :label="dict.label" :value="dict.value"></el-option>
</el-select>
</el-form-item>
<el-form-item label="平台状态" prop="status">
<el-select v-model="form.status" placeholder="请选择状态" style="width: 400px">
<el-option v-for="dict in dict.type.iot_social_platform_status" :key="dict.value" :label="dict.label" :value="Number(dict.value)"></el-option>
</el-select>
</el-form-item>
<el-form-item label="平台申请ID" prop="clientId">
<el-input v-model="form.clientId" placeholder="请输入平台申请ID" style="width: 400px" />
</el-form-item>
<el-form-item label="平台密钥" prop="secretKey">
<el-input v-model="form.secretKey" placeholder="请输入平台密钥" style="width: 400px" />
</el-form-item>
<el-form-item label="认证跳转地址" prop="redirectUri">
<el-input v-model="form.redirectUri" placeholder="请输入认证跳转地址" style="width: 400px" />
</el-form-item>
<el-form-item label="绑定注册urL" prop="bindUri">
<el-input v-model="form.bindUri" placeholder="请输入绑定注册 url, http://localhost/login?bindId=" style="width: 400px" />
</el-form-item>
<el-form-item label="跳转登录URL" prop="redirectLoginUri">
<el-input v-model="form.redirectLoginUri" placeholder="请输入跳转登录 url, http://localhost/login?loginId=" style="width: 400px" />
</el-form-item>
<el-form-item label="错误提示URL" prop="errorMsgUri">
<el-input v-model="form.errorMsgUri" placeholder="请输入错误提示 url, http://localhost/login?errorId=" style="width: 400px" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }" style="width: 400px" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确定</el-button>
<el-button @click="cancel">取消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { addPlatform, delPlatform, getPlatform, listPlatform, updatePlatform } from '@/api/iot/platform';
export default {
name: 'Platform',
dicts: ['iot_social_platform', 'iot_social_platform_status'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 第三方登录平台控制表格数据
platformList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
platform: null,
status: null,
},
columnTips: {
bindId: '绑定登录uri, http://localhost/login?bindId=,域名换成对应域名即可，本地开发不需要更改',
redirectLogin: '跳转登录uri,http://localhost/login?loginId=,域名换成对应域名即可，本地开发不需要更改',
errorId: '错误提示获取uri,http://localhost/login?errorId=,域名换成对应域名即可，本地开发不需要更改',
},
// 表单参数
form: {},
// 表单校验
rules: {
platform: [
{
required: true,
message: '第三方平台不能为空',
trigger: 'change',
},
],
status: [
{
required: true,
message: ' 0:启用 ,1:禁用不能为空',
trigger: 'change',
},
],
clientId: [
{
required: true,
message: '第三方平台申请Id不能为空',
trigger: 'blur',
},
],
secretKey: [
{
required: true,
message: '第三方平台密钥不能为空',
trigger: 'blur',
},
],
redirectUri: [
{
required: true,
message: '用户认证后跳转地址不能为空',
trigger: 'blur',
},
],
bindUri: [
{
required: true,
message: '绑定注册登录uri,http://localhost/login?bindId=不能为空',
trigger: 'blur',
},
],
redirectLoginUri: [
{
required: true,
message: '跳转登录uri,http://localhost/login?loginId=不能为空',
trigger: 'blur',
},
],
errorMsgUri: [
{
required: true,
message: '错误提示uri,http://localhost/login?errorId=不能为空',
trigger: 'blur',
},
],
},
};
},
created() {
this.getList();
},
methods: {
renderHeaderMethods(h, { column }, content) {
return h('div', [
h('span', column.label),
h(
'el-tooltip',
{
props: {
effect: 'dark',
content: content,
placement: 'top',
},
},
[
h('i', {
class: 'el-icon-question',
style: 'color:#486FF2;margin-left:5px;',
}),
]
),
]);
},
/** 查询第三方登录平台控制列表 */
getList() {
this.loading = true;
listPlatform(this.queryParams).then((response) => {
this.platformList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
socialPlatformId: null,
platform: null,
status: null,
clientId: null,
secretKey: null,
redirectUri: null,
createBy: null,
createTime: null,
updateTime: null,
updateBy: null,
remark: null,
bindUri: null,
redirectLoginUri: null,
errorMsgUri: null,
};
this.resetForm('form');
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm');
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.socialPlatformId);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = '添加平台控制';
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const socialPlatformId = row.socialPlatformId || this.ids;
getPlatform(socialPlatformId).then((response) => {
this.form = response.data;
this.open = true;
this.title = '修改平台控制';
});
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.form.socialPlatformId != null) {
updatePlatform(this.form).then((response) => {
this.$modal.msgSuccess('修改成功');
this.open = false;
this.getList();
});
} else {
addPlatform(this.form).then((response) => {
this.$modal.msgSuccess('新增成功');
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const socialPlatformIds = row.socialPlatformId || this.ids;
this.$modal
.confirm('是否确认删除平台控制编号为"' + socialPlatformIds + '"的数据项')
.then(function () {
return delPlatform(socialPlatformIds);
})
.then(() => {
this.getList();
this.$modal.msgSuccess('删除成功');
this.$refs.multipleTable.clearSelection();
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download(
'iot/platform/export',
{
...this.queryParams,
},
`platform_${new Date().getTime()}.xlsx`
);
},
getRowKeys(row) {
return row.socialPlatformId;
},
},
};
</script>
<style lang="scss" scoped>
.iot-platform {
padding: 20px;
.search-card {
margin-bottom: 15px;
padding: 3px 0;
}
.search-form {
margin-bottom: -22.5px;
}
}
</style>

873
vue/src/views/login.vue
View File

@@ -1,92 +1,108 @@
<template> <template>
<div class="login"> <div class="login">
<el-row> <el-row>
<el-col :xs="24"> <el-col :xs="24">
<div <div style="color: #fff; background-color: #0f73ee; width: 100%; height: 200px; text-align: center; padding: 15px; font-family: '微软雅黑'">
style="color: #fff; background-color: #0f73ee; width: 100%; height: 200px; text-align: center; padding: 15px; font-family: '微软雅黑'"> <div style="font-size: 42px; padding-top: 40px; width: 300px; margin: 0 auto">
<div style="font-size: 42px; padding-top: 40px; width: 300px; margin: 0 auto"> <img :src="logo" alt="logo" style="width: 100px; height: 100px; float: left" />
<img :src="logo" alt="logo" style="width: 100px; height: 100px; float: left" /> <div style="float: left; margin-top: 13px; width: 200px; text-align: left">
<div style="float: left; margin-top: 13px; width: 200px; text-align: left"> <div>FastBee</div>
<div>FastBee</div> <div style="letter-spacing: 1.5px; font-size: 20px; font-weight: 600; margin-top: -8px; margin-left: 3px">开源物联网平台</div>
<div style="letter-spacing: 1.5px; font-size: 20px; font-weight: 600; margin-top: -8px; margin-left: 3px"> </div>
开源物联网平台</div> </div>
</div> </div>
</div>
</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form"> <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
<el-form-item> <el-form-item>
<div class="alert-box-wrap" v-if="loginForm.bindId != null"> <div class="alert-box-wrap" v-if="loginForm.bindId != null">
<div v-if="loginForm.bindId != null" class="alert-message-wrap"> <div v-if="loginForm.bindId != null" class="alert-message-wrap">
<i class="el-icon-warning" /> <i class="el-icon-warning" />
如果你已经有账号,请直接输入账号进行绑定， 如果你已经有账号,请直接输入账号进行绑定，
</div> </div>
<el-row> <el-row>
<el-col :span="10.5"> <el-col :span="10.5">
<div v-if="loginForm.bindId != null" class="alert-message-wrap"> <div v-if="loginForm.bindId != null" class="alert-message-wrap">如果还没有账号，请先去</div>
如果还没有账号，请先去</div> </el-col>
</el-col> <!-- <el-col :span="4"> -->
<!-- <el-col :span="4"> --> <router-link
<router-link v-if="loginForm.bindId != null" :to="{ path: '/register', query: this.$route.query }" v-if="loginForm.bindId != null"
style="margin-left: 10px; font-size: 14px; font-family: '微软雅黑'; color: rgba(41, 96, 197, 0.856);"> :to="{ path: '/register', query: this.$route.query }"
注册 style="margin-left: 10px; font-size: 14px; font-family: '微软雅黑'; color: rgba(41, 96, 197, 0.856)"
</router-link> >
<!-- </el-col> --> 注册
</el-row> </router-link>
</div> <!-- </el-col> -->
</el-form-item> </el-row>
<el-form-item prop="username"> </div>
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号"> </el-form-item>
<svg-icon slot="prefix" icon-class="user" class="input-icon" /> <el-form-item prop="username">
</el-input> <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
</el-form-item> <svg-icon slot="prefix" icon-class="user" class="input-icon" />
<el-form-item prop="password"> </el-input>
<el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码" </el-form-item>
@keyup.enter.native="handleLogin"> <el-form-item prop="password">
<svg-icon slot="prefix" icon-class="password" class="input-icon" /> <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码" @keyup.enter.native="handleLogin">
</el-input> <svg-icon slot="prefix" icon-class="password" class="input-icon" />
</el-form-item> </el-input>
<el-form-item v-if="captchaOnOff" prop="code"> </el-form-item>
<el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%" <el-form-item v-if="captchaOnOff" prop="code">
@keyup.enter.native="handleLogin"> <el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter.native="handleLogin">
<svg-icon slot="prefix" icon-class="validCode" class="input-icon" /> <svg-icon slot="prefix" icon-class="validCode" class="input-icon" />
</el-input> </el-input>
<div class="login-code"> <div class="login-code">
<img :src="codeUrl" @click="getCode" /> <img :src="codeUrl" @click="getCode" />
</div> </div>
</el-form-item> </el-form-item>
<el-checkbox v-model="loginForm.rememberMe" style="margin: 0px 0px 25px 0px; color: #000">记住密码</el-checkbox> <el-checkbox v-model="loginForm.rememberMe" style="margin: 0px 0px 25px 0px; color: #000">记住密码</el-checkbox>
<el-form-item style="width: 100%"> <el-form-item style="width: 100%">
<div style="margin-bottom: 10px"> <div style="margin-bottom: 10px">
<el-button v-if="!bindAccount" :loading="loading" type="primary" style="width: 100%" <!-- <el-button v-if="!bindAccount" :loading="loading" type="primary" style="width: 100%"
@click.native.prevent="handleLogin"> @click.native.prevent="handleLogin">
<span v-if="!loading">登 录</span> <span v-if="!loading">登 录</span>
<span v-else>登 录 中...</span> <span v-else>登 录 中...</span>
</el-button> </el-button> -->
</div> <div v-if="!bindId">
<el-row> <el-button class="btn" :loading="loading" type="primary" @click.native.prevent="handleLogin">
<div> <span v-if="!loading">登 录</span>
<el-link href="https://fastbee.cn/" :underline="false" target="_blank" style="float: left">返回官网</el-link> <span v-else>登 录 中...</span>
<el-link href="https://fastbee.cn/doc" :underline="false" target="_blank" style="float: left; margin-left: 20px">查看文档</el-link> </el-button>
<router-link v-if="!bindAccount" :to="{ path: '/register', query: this.$route.query }" </div>
style="float: left;margin-left:20px;">注册账号</router-link> <div v-else>
</div> <el-button class="btn" :loading="loading" type="primary" @click.native.prevent="handleBindLogin">
</el-row> <span v-if="!loading">绑定并登录</span>
</el-form-item> <span v-else>绑定中...</span>
</el-form> </el-button>
</el-col> <el-button style="margin: 16px 0 0 0" class="btn" @click.native.prevent="handleBackLogin">
</el-row> <span>返回登录</span>
<!-- 底部 --> </el-button>
<div class="el-login-footer"> </div>
<span> <el-row>
Copyright © 2021-2025 <div>
<a target="_blank" href="http://fastbee.cn">FastBee</a> <el-link href="https://fastbee.cn/" :underline="false" target="_blank" style="float: left">返回官网</el-link>
All Rights Reserved. <el-link href="https://fastbee.cn/doc" :underline="false" target="_blank" style="float: left; margin-left: 20px">查看文档</el-link>
</span> <router-link v-if="!bindAccount" :to="{ path: '/register', query: this.$route.query }" style="float: left; margin-left: 20px">注册账号</router-link>
</div>
</el-row>
<div class="other-login">
<span class="text">其他登录方式：</span>
<svg-icon class="icon" icon-class="wechat" style="color: #07c160" @click="handleGotoWeChatLogin" />
</div>
</div>
</el-form-item>
</el-form>
</el-col>
</el-row>
<!-- 底部 -->
<div class="el-login-footer">
<span>
Copyright © 2021-2025
<a target="_blank" href="http://fastbee.cn">FastBee</a>
All Rights Reserved.
</span>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
@@ -98,328 +114,443 @@ import { encrypt, decrypt } from '@/utils/jsencrypt';
import { setToken } from '@/utils/auth'; import { setToken } from '@/utils/auth';
export default { export default {
name: 'Login', name: 'Login',
data() { data() {
return { return {
logo, logo,
codeUrl: '', codeUrl: '',
loginForm: { loginForm: {
username: '', username: '',
password: '', password: '',
rememberMe: false, rememberMe: false,
code: '', code: '',
uuid: '', uuid: '',
bindId: '', bindId: '',
// loginId: '', // loginId: '',
}, },
loginRules: { loginRules: {
username: [ username: [
{ {
required: true, required: true,
trigger: 'blur', trigger: 'blur',
message: '请输入您的账号', message: '请输入您的账号',
}, },
], ],
password: [ password: [
{ {
required: true, required: true,
trigger: 'blur', trigger: 'blur',
message: '请输入您的密码', message: '请输入您的密码',
}, },
], ],
code: [ code: [
{ {
required: true, required: true,
trigger: 'change', trigger: 'change',
message: '请输入验证码', message: '请输入验证码',
}, },
], ],
}, },
loading: false, loading: false,
// 验证码开关 // 验证码开关
captchaOnOff: true, captchaOnOff: true,
bindAccount: false, bindAccount: false,
// 注册开关 // 注册开关
register: true, register: true,
redirect: undefined, redirect: undefined,
}; bindId: '',
}, };
watch: {
$route: {
handler: function (route) {
this.redirect = route.query && route.query.redirect;
},
immediate: true,
}, },
}, watch: {
created() { $route: {
const loginId = this.$route.query.loginId; handler: function (route) {
if (loginId === undefined || loginId === null) { this.redirect = route.query && route.query.redirect;
this.checkBind(); },
this.getCode(); immediate: true,
this.checkErrorMsg();
this.getCookie();
} else {
this.redirectSocialLogin(loginId);
}
},
methods: {
redirectLogin(loginId) {
this.loading = true;
this.$store
.dispatch('RedirectLogin', loginId)
.then(() => {
this.$router
.push({
path: this.redirect || '/',
})
.catch(() => { });
})
.catch(() => {
this.loading = false;
if (this.captchaOnOff) {
this.getCode();
}
this.$router.push({
query: {},
});
});
},
redirectSocialLogin() {
const query = this.$route.query;
const loginId = query.loginId;
socialLogin(loginId).then((res) => {
// 保存token
this.loading = true;
setToken(res.token);
this.$router
.push({
path: this.redirect || '/',
})
.catch(() => { });
if (this.captchaOnOff) {
this.getCode();
this.loading = false;
}
});
},
checkBind() {
const query = this.$route.query;
const bindId = query.bindId;
if (bindId === undefined || bindId === null) {
this.bindAccount = false;
} else {
this.bindAccount = true;
checkBindId(bindId).then((res) => {
this.bindAccount = res.bindAccount === undefined ? true : res.bindAccount;
if (this.bindAccount) {
this.loginForm.bindId = bindId;
} else {
this.loginForm.bindId = '';
this.$router.push({
query: {},
});
}
});
}
},
checkErrorMsg() {
const errorId = this.$route.query.errorId;
if (errorId !== undefined && errorId !== null) {
getErrorMsg(errorId)
.then((res) => { })
.catch((err) => {
this.$router.push({ query: {} });
console.log(err);
});
}
},
getCode() {
getCodeImg().then((res) => {
//this.captchaOnOff = res.captchaOnOff === undefined ? true : res.captchaOnOff;
this.captchaOnOff = res.captchaEnabled;
if (this.captchaOnOff) {
this.codeUrl = 'data:image/gif;base64,' + res.img;
this.loginForm.uuid = res.uuid;
}
});
},
getCookie() {
const username = Cookies.get('username');
const password = Cookies.get('password');
const rememberMe = Cookies.get('rememberMe');
const loginId = Cookies.get('loginId');
this.loginForm = {
username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
loginId: loginId === undefined ? this.loginForm.loginId : loginId,
};
},
qqLogin() {
window.location.href = 'http://localhost:8080/auth/render/qq';
},
weChatLogin() {
const baseURL = process.env.VUE_APP_BASE_API;
window.location.href = baseURL + '/auth/render/wechat_open_web';
},
authLogin() {
this.$alert('第三方登录正在集成中...', '提示消息', {
confirmButtonText: '确定',
callback: (action) => {
this.$message({
type: 'info',
message: `action: ${action}`,
});
}, },
});
}, },
handleBind() { created() {
this.$refs.loginForm.validate((valid) => { const { loginId } = this.$route.query;
if (valid) { if (!loginId) {
this.loading = true; this.getCode();
if (this.loginForm.rememberMe) { this.getCookie();
Cookies.set('username', this.loginForm.username, { this.checkBind();
expires: 30, this.checkError();
}); } else {
Cookies.set('password', encrypt(this.loginForm.password), { this.redirectSocialLogin(loginId);
expires: 30,
});
Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove('username');
Cookies.remove('password');
Cookies.remove('rememberMe');
}
this.loginForm.bindId = this.$route.query.bindId;
bindLogin(this.loginForm)
.then((res) => {
// 保存token
setToken(res.token);
this.$router
.push({
path: '/',
})
.catch(() => { });
})
.catch(() => {
this.loading = false;
if (this.captchaOnOff) {
this.loading = false;
this.getCode();
}
});
} }
});
}, },
handleLogin() { methods: {
this.$refs.loginForm.validate((valid) => { redirectLogin(loginId) {
if (valid) { this.loading = true;
this.loading = true; this.$store
if (this.loginForm.rememberMe) { .dispatch('RedirectLogin', loginId)
Cookies.set('username', this.loginForm.username, { .then(() => {
expires: 30, this.$router
}); .push({
Cookies.set('password', encrypt(this.loginForm.password), { path: this.redirect || '/',
expires: 30, })
}); .catch(() => {});
Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove('username');
Cookies.remove('password');
Cookies.remove('rememberMe');
}
this.$store
.dispatch('Login', this.loginForm)
.then(() => {
this.$router
.push({
path: this.redirect || '/',
}) })
.catch(() => { }); .catch(() => {
}) this.loading = false;
.catch(() => { if (this.captchaOnOff) {
this.loading = false; this.getCode();
if (this.captchaOnOff) { }
this.$router.push({
query: {},
});
});
},
// 微信登录
handleGotoWeChatLogin() {
const baseUrl = process.env.VUE_APP_BASE_API;
window.location.href = baseUrl + '/auth/render/wechat_open_web';
},
// 返回登录页（绑定登录或者登录）
handleGotoLogin() {
if (this.captchaOnOff) {
this.getCode(); this.getCode();
} }
this.clearValidate('loginForm');
this.formIndex = 1;
this.isHaveBind = false;
this.errorText = '';
},
// 返回登录（登录）
handleBackLogin() {
this.bindId = '';
this.$router.push('/login');
},
// 检测绑定信息
checkBind() {
const { bindId } = this.$route.query;
if (bindId) {
checkBindId(bindId).then((res) => {
if (res.code === 200) {
this.isHaveBind = true;
} else {
this.isHaveBind = false;
}
if (this.isHaveBind) {
this.bindId = bindId;
} else {
this.bindId = '';
this.$router.push({
query: {},
});
}
});
}
},
// 绑定账号并登录
handleBindLogin() {
this.$refs.loginForm.validate((valid) => {
if (valid) {
this.loading = true;
if (this.loginForm.rememberMe) {
Cookies.set('username', this.loginForm.username, {
expires: 30,
});
Cookies.set('password', encrypt(this.loginForm.password), {
expires: 30,
});
Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove('username');
Cookies.remove('password');
Cookies.remove('rememberMe');
}
const params = { ...this.loginForm, uuid: this.uuid, bindId: this.bindId };
bindLogin(params)
.then((res) => {
setToken(res.token); // 保存token
this.$router
.push({
path: '/',
})
.catch(() => {});
})
.catch(() => {
this.loading = false;
if (this.captchaOnOff) {
this.getCode();
}
});
}
}); });
} },
}); // 检查错误信息
checkError() {
const { errorId } = this.$route.query;
if (errorId) {
getErrorMsg(errorId).then((res) => {
if (res.code === 200) {
this.errorText = res.msg;
} else {
this.errorText = '';
}
});
}
},
// 重定向到登录
redirectLogin() {
const { loginId } = this.$route.query;
socialLogin(loginId).then((res) => {
setToken(res.token); // 保存token
this.$router.push({
path: this.redirect || '/',
});
});
},
redirectSocialLogin() {
const query = this.$route.query;
const loginId = query.loginId;
socialLogin(loginId).then((res) => {
// 保存token
this.loading = true;
setToken(res.token);
this.$router
.push({
path: this.redirect || '/',
})
.catch(() => {});
if (this.captchaOnOff) {
this.getCode();
this.loading = false;
}
});
},
checkBind() {
const query = this.$route.query;
const bindId = query.bindId;
if (bindId === undefined || bindId === null) {
this.bindAccount = false;
} else {
this.bindAccount = true;
checkBindId(bindId).then((res) => {
this.bindAccount = res.bindAccount === undefined ? true : res.bindAccount;
if (this.bindAccount) {
this.loginForm.bindId = bindId;
} else {
this.loginForm.bindId = '';
this.$router.push({
query: {},
});
}
});
}
},
getCode() {
getCodeImg().then((res) => {
//this.captchaOnOff = res.captchaOnOff === undefined ? true : res.captchaOnOff;
this.captchaOnOff = res.captchaEnabled;
if (this.captchaOnOff) {
this.codeUrl = 'data:image/gif;base64,' + res.img;
this.loginForm.uuid = res.uuid;
}
});
},
getCookie() {
const username = Cookies.get('username');
const password = Cookies.get('password');
const rememberMe = Cookies.get('rememberMe');
const loginId = Cookies.get('loginId');
this.loginForm = {
username: username === undefined ? this.loginForm.username : username,
password: password === undefined ? this.loginForm.password : decrypt(password),
rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
loginId: loginId === undefined ? this.loginForm.loginId : loginId,
};
},
qqLogin() {
window.location.href = 'http://localhost:8080/auth/render/qq';
},
weChatLogin() {
const baseURL = process.env.VUE_APP_BASE_API;
window.location.href = baseURL + '/auth/render/wechat_open_web';
},
authLogin() {
this.$alert('第三方登录正在集成中...', '提示消息', {
confirmButtonText: '确定',
callback: (action) => {
this.$message({
type: 'info',
message: `action: ${action}`,
});
},
});
},
handleBind() {
this.$refs.loginForm.validate((valid) => {
if (valid) {
this.loading = true;
if (this.loginForm.rememberMe) {
Cookies.set('username', this.loginForm.username, {
expires: 30,
});
Cookies.set('password', encrypt(this.loginForm.password), {
expires: 30,
});
Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove('username');
Cookies.remove('password');
Cookies.remove('rememberMe');
}
this.loginForm.bindId = this.$route.query.bindId;
bindLogin(this.loginForm)
.then((res) => {
// 保存token
setToken(res.token);
this.$router
.push({
path: '/',
})
.catch(() => {});
})
.catch(() => {
this.loading = false;
if (this.captchaOnOff) {
this.loading = false;
this.getCode();
}
});
}
});
},
handleLogin() {
this.$refs.loginForm.validate((valid) => {
if (valid) {
this.loading = true;
if (this.loginForm.rememberMe) {
Cookies.set('username', this.loginForm.username, {
expires: 30,
});
Cookies.set('password', encrypt(this.loginForm.password), {
expires: 30,
});
Cookies.set('rememberMe', this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove('username');
Cookies.remove('password');
Cookies.remove('rememberMe');
}
this.$store
.dispatch('Login', this.loginForm)
.then(() => {
this.$router
.push({
path: this.redirect || '/',
})
.catch(() => {});
})
.catch(() => {
this.loading = false;
if (this.captchaOnOff) {
this.getCode();
}
});
}
});
},
}, },
},
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
.login { .login {
height: 100%; height: 100%;
overflow: auto; overflow: auto;
} }
.bindAccountTitle { .bindAccountTitle {
margin: 0px auto 30px auto; margin: 0px auto 30px auto;
text-align: center; text-align: center;
color: #333; color: #333;
font-size: 24px; font-size: 24px;
} }
.login-form { .login-form {
margin: 30px auto 0 auto; margin: 30px auto 0 auto;
padding: 15px; padding: 15px;
z-index: 1000; z-index: 1000;
max-width: 350px; max-width: 350px;
input { input {
height: 38px; height: 38px;
background-color: #f1f1f1; background-color: #f1f1f1;
color: #666; color: #666;
} }
.input-icon { .input-icon {
height: 39px; height: 39px;
width: 14px; width: 14px;
margin-left: 2px; margin-left: 2px;
} }
} }
.login-code { .login-code {
width: 33%; width: 33%;
float: right; float: right;
img { img {
cursor: pointer; cursor: pointer;
vertical-align: middle; vertical-align: middle;
border-radius: 3px; border-radius: 3px;
height: 38px; height: 38px;
} }
} }
.el-login-footer { .el-login-footer {
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
text-align: center; text-align: center;
color: #333; color: #333;
font-family: Arial; font-family: Arial;
font-size: 12px; font-size: 12px;
letter-spacing: 1px; letter-spacing: 1px;
} }
.alert-box-wrap { .alert-box-wrap {
border: 1px solid #f78e21; border: 1px solid #f78e21;
.alert-message-wrap { .alert-message-wrap {
font-size: 14px; font-size: 14px;
font-family: '微软雅黑'; font-family: '微软雅黑';
color: rgba(197, 41, 41, 0.856); color: rgba(197, 41, 41, 0.856);
margin-left: 10px; margin-left: 10px;
} }
}
.btn {
margin-top: 26px;
width: 100%;
height: 40px;
}
.other-login {
margin-top: 40px;
display: flex;
flex-direction: row;
align-items: center;
.icon {
width: 16px;
height: 16px;
margin: 0 12px 0 8px;
cursor: pointer;
}
} }
</style> </style>