提交 2d8c1cc2 编写于 作者: tony001's avatar tony001

update:更新

上级 8cd77602
<template>
<div class="login">
<img src="@/assets/img/background.png" class="login-background" />
<div class="login-con" v-if="!isEmbedThridPlatForm">
<div class="login-con">
<card :bordered="false" class="login-card">
<div slot="title" class="login-header">
<p class="login-caption" style="text-align: center">桌面端应用示例</p>
</div>
<div class="login-content">
<div class="login-content">
<div class="form-con">
<a-form ref="loginForm" :rules="rules" :model="loginState">
<a-form-item name="loginname">
......@@ -14,7 +14,8 @@
size="large"
v-model:value="loginState.loginname"
placeholder="请输入用户名"
@pressEnter="handleSubmit">
@pressEnter="handleSubmit"
>
<template #prefix>
<user-outlined />
</template>
......@@ -26,19 +27,16 @@
v-model:value="loginState.password"
type="password"
placeholder="请输入密码"
@pressEnter="handleSubmit">
@pressEnter="handleSubmit"
>
<template #prefix>
<lock-outlined />
</template>
</a-input-password>
</a-form-item>
<a-form-item>
<a-button @click="handleSubmit" type="primary" class="login_btn">
登录
</a-button>
<a-button @click="goReset" type="success" class="login_reset">
重置
</a-button>
<a-button @click="handleSubmit" type="primary" class="login_btn">登录</a-button>
<a-button @click="goReset" type="success" class="login_reset">重置</a-button>
</a-form-item>
<a-form-item>
<div style="text-align: center">
......@@ -54,31 +52,30 @@
</div>
</a-form-item>
</a-form>
<p class="login-tip">\{{loginTip}}</p>
<p class="login-tip">{{ loginTip }}</p>
</div>
</div>
</card>
<div class="log_footer">
<div class="copyright">
<a href="https://www.ibizlab.cn/" target="_blank"> is based on ibizlab .</a>
<a href="https://www.ibizlab.cn/" target="_blank">is based on ibizlab .</a>
</div>
</div>
</div>
<div class="login-loadding-container" v-if="isEmbedThridPlatForm">
<div class="content-loadding">
<span>第三方登录跳转中</span>
<!-- loading待补充 -->
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { Ref, ref } from 'vue';
import { Ref, ref, unref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { clearCookie, setCookie } from 'qx-util';
import { Environment } from '@/environments/environment';
import { setCookie } from 'qx-util';
import { Http } from '@core';
interface LoginState {
loginname: string;
password: '';
}
/**
* 表单对象
*
......@@ -86,8 +83,8 @@ import { Http } from '@core';
* @memberof Login
*/
const loginState = reactive<LoginState>({
loginname: '',
password: ''
loginname: '',
password: '',
});
/**
......@@ -99,74 +96,46 @@ const loginState = reactive<LoginState>({
const loginTip: Ref<string> = ref('');
/**
* 运行平台
* 值规则
*
* @type {*}
* @memberof Login
*/
const platform: Ref<any> = ref({});
const rules: Ref<any> = ref({
loginname: [{ required: true, message: '用户名不能为空', trigger: 'change' }],
password: [{ required: true, message: '密码不能为空', trigger: 'change' }],
});
/**
* 是否嵌入第三方平台
* 登录表单
*
* @type {boolean}
* @type {*}
* @memberof Login
*/
const isEmbedThridPlatForm: Ref<boolean> = ref(false);
const loginForm: Ref<any> = ref(null);
/**
* 按钮可点击
* 路由对象
*
* @type {boolean}
* @type {*}
* @memberof Login
*/
const canClick: Ref<boolean> = ref(true);
const route = useRoute();
/**
* 应用名称
* 路由器对象
*
* @type {string}
* @type {*}
* @memberof Login
*/
const appTitle: string = Environment.AppTitle;
interface LoginState {
loginname: string,
password: ''
}
const router = useRouter();
/**
* 值规则
* 消除loadding
*
* @type {*}
* @memberof Login
*/
const rules: Ref<any> = ref({});
const loginForm: Ref<any> = ref(null);
const route = useRoute();
const router = useRouter();
const setRules = () => {
rules.value = {
loginname: [{ required: true, message: '用户名不能为空', trigger: 'change' }],
password: [{ required: true, message: '密码不能为空', trigger: 'change' }],
};
};
const afterCreated = () => {
setRules();
platform.value = window.navigator.userAgent.toUpperCase();
if (platform.value.indexOf('DINGTALK') !== -1) {
// this.DingDingLogin();
isEmbedThridPlatForm.value = true;
} else if (platform.value.indexOf('WXWORK') !== -1) {
// this.WXWorkLogin();
isEmbedThridPlatForm.value = true;
}
};
onMounted(() => {
setTimeout(() => {
const el = document.getElementById('app-loading-x');
......@@ -176,23 +145,32 @@ onMounted(() => {
}, 300);
});
/**
* 重置
*
* @type {*}
* @memberof Login
*/
const goReset = () => {
loginForm.value = { loginname: '', password: '' };
};
/**
* 提交表单数据
*
* @type {*}
* @memberof Login
*/
const handleSubmit = (): void => {
// clearAppData();
const _form = unref(loginForm);
const form = unref(loginForm);
let validatestate: boolean = true;
_form.validate((valid: boolean) => {
form.validate((valid: boolean) => {
validatestate = valid ? true : false;
});
if (!validatestate) {
return;
}
const loginname: string = loginState.loginname;
console.log("登录用户名", loginState)
// TODO 使用AppAuthService
Http.getInstance()
.post('/v7/login', loginState, true)
.then((post: any) => {
......@@ -207,7 +185,7 @@ const handleSubmit = (): void => {
// 设置cookie,保存账号密码7天
setCookie('loginname', loginname, 7, true);
// TODO 从路由中获取
const url: any = route.query?.redirecrt ? route.query.redirecrt : '/';
const url: any = unref(route).query?.redirecrt ? unref(route).query.redirecrt : '/';
router.push({ path: url });
}
})
......@@ -223,169 +201,12 @@ const handleSubmit = (): void => {
});
};
const clearAppData = () => {
// 清除user、token
clearCookie('ibzuaa-token', true);
clearCookie('ibzuaa-expired', true);
clearCookie('ibzuaa-user', true);
// 清除应用级数据
localStorage.removeItem('localdata');
// this.$store.commit('addAppData', {});
// this.$store.dispatch('authresource/commitAuthData', {});
// 清除租户相关信息
// removeSessionStorage("activeOrgData");
// removeSessionStorage("srfdynaorgid");
// removeSessionStorage("dcsystem");
// removeSessionStorage("orgsData");
};
/**
* 第三方登录(网页扫码方式)
*
* @memberof Login
*/
const handleThridLogin = (type: string) => {
if (!type) return;
switch (type) {
case 'DINGDING':
dingtalkHandleClick();
break;
case 'WXWORK':
wxWorkHandleClick();
break;
default:
// LogUtil.log(`暂不支持${type}登录`);
break;
}
};
/**
* 钉钉授权登录
*
* @memberof Login
*/
const dingtalkHandleClick = async () => {
// let result: any = await this.appThirdService.dingtalkLogin(Environment);
// if (result?.state && Object.is(result?.state, 'SUCCESS')) {
// const data = result.data;
// // 截取地址,拼接需要部分组成新地址
// const baseUrl = this.getNeedLocation();
// // 1.钉钉开放平台提供的appId
// const appId = data.appid;
// // 2.钉钉扫码后回调地址,需要UrlEncode转码
// const redirect_uri = baseUrl + 'assets/third/dingdingRedirect.html?id=' + data.appid;
// const redirect_uri_encode = encodeURIComponent(redirect_uri);
// // 3.钉钉扫码url
// const url =
// 'https://oapi.dingtalk.com/connect/qrconnect?response_type=code' +
// '&appid=' +
// appId +
// '&redirect_uri=' +
// redirect_uri_encode +
// '&scope=snsapi_login' +
// '&state=STATE';
// // 4.跳转钉钉扫码
// window.location.href = url;
// } else {
// this.$throw(result?.message,'dingtalkHandleClick');
// }
};
/**
* 企业微信授权登录
*
* @memberof Login
*/
const wxWorkHandleClick = async () => {
// let result: any = await this.appThirdService.wxWorkLogin(Environment);
// if (result?.state && Object.is(result?.state, 'SUCCESS')) {
// const data = result.data;
// // 截取地址,拼接需要部分组成新地址
// const baseUrl = this.getNeedLocation();
// // 1.钉钉开放平台提供的appId
// const appId = data.corp_id;
// const agentId = data.agentid;
// // 2.钉钉扫码后回调地址,需要UrlEncode转码
// const redirect_uri = baseUrl + 'assets/third/wxWorkRedirect.html?id=' + data.appid;
// const redirect_uri_encode = encodeURIComponent(redirect_uri);
// // 3.钉钉扫码url
// const url =
// 'https://open.work.weixin.qq.com/wwopen/sso/qrConnect?state=STATE' +
// '&appid=' +
// appId +
// '&agentid=' +
// agentId +
// '&redirect_uri=' +
// redirect_uri_encode;
// // 4.跳转钉钉扫码
// window.location.href = url;
// } else {
// // this.$throw(result?.message,'wxWorkHandleClick');
// }
};
/**
* 钉钉免登
*
* @memberof Login
*/
const DingDingLogin = async () => {
// let result: any = await this.appThirdService.embedDingTalkLogin(Environment);
// if (result?.state && Object.is(result?.state, 'SUCCESS')) {
// if (result.data.token && result.data.user) {
// setCookie('ibzuaa-token', result.data.token, 7,true);
// if (this.$route.query.redirect) {
// window.location.href = decodeURIComponent(this.$route.query.redirect as any);
// } else {
// this.$router.push({ path: '/' });
// }
// }
// } else {
// this.$throw(result?.message,'DingDingLogin');
// }
};
const WXWorkLogin = async () => {
// let result: any = await this.appThirdService.embedwxWorkLogin(Environment);
// if (result?.state && Object.is(result?.state, 'SUCCESS')) {
// // 截取地址,拼接需要部分组成新地址
// const baseUrl = this.getNeedLocation();
// // 1.企业微信提供的corp_id
// const appId = result.data.corp_id;
// // 2.认证成功后回调地址,需要UrlEncode转码
// const redirect_uri = baseUrl + 'assets/third/wxWorkRedirect.html?id=' + result.data.appid;
// const redirect_uri_encode = encodeURIComponent(redirect_uri);
// // 3.微信认证url
// const url =
// 'https://open.weixin.qq.com/connect/oauth2/authorize?response_type=code&scope=snsapi_base&#wechat_redirect' +
// '&appid=' +
// appId +
// '&redirect_uri=' +
// redirect_uri_encode +
// '&scope=snsapi_base' +
// '&state=STATE';
// // 4.跳转到微信认证地址
// window.location.href = url;
// } else {
// this.$throw(result?.message,'WXWorkLogin');
// }
};
const getNeedLocation = () => {
// 截取地址,拼接需要部分组成新地址
const scheme = window.location.protocol;
const host = window.location.host;
let baseUrl: any = scheme + '//' + host;
const port = window.location.port;
if (port) {
if (port == '80' || port == '443') {
baseUrl += '/';
} else {
baseUrl += ':' + port + '/';
}
} else {
baseUrl += '/';
}
return baseUrl;
console.log(`暂不支持${type}登录`);
};
</script>
\ No newline at end of file
......@@ -16,7 +16,7 @@ const props = withDefaults(defineProps<Props>(), {
<template #icon>
<AppIconText :iconClass="item.iconClass" :imgPath="item.imgPath" :text="collapsed ? item.caption[0] : undefined"/>
</template>
<a-tooltip :title="item.tooltip">\{{item.caption}}</a-tooltip>
<a-tooltip :title="item.tooltip">{{item.caption}}</a-tooltip>
</a-menu-item>
</template>
<template v-else>
......@@ -24,7 +24,7 @@ const props = withDefaults(defineProps<Props>(), {
<template #icon>
<AppIconText :iconClass="item.iconClass" :imgPath="item.imgPath" :text="collapsed ? item.caption[0] : undefined"/>
</template>
<template #title><a-tooltip :title="item.tooltip">\{{item.caption}}</a-tooltip></template>
<template #title><a-tooltip :title="item.tooltip">{{item.caption}}</a-tooltip></template>
<AppMenuItem :items="item.items" />
</a-sub-menu>
</template>
......
......@@ -407,6 +407,11 @@ assert-never@^1.2.1:
resolved "https://registry.npmmirror.com/assert-never/download/assert-never-1.2.1.tgz#11f0e363bf146205fb08193b5c7b90f4d1cf44fe"
integrity sha1-EfDjY78UYgX7CBk7XHuQ9NHPRP4=
async-validator@^3.3.0:
version "3.5.2"
resolved "https://registry.yarnpkg.com/async-validator/-/async-validator-3.5.2.tgz#68e866a96824e8b2694ff7a831c1a25c44d5e500"
integrity sha512-8eLCg00W9pIRZSB781UUX/H6Oskmm8xloZfr09lz5bikRpBVDlJ3hRVuxxP1SxcwsEYfJ4IU8Q19Y8/893r3rQ==
async-validator@^4.0.0, async-validator@^4.0.7:
version "4.0.7"
resolved "https://registry.yarnpkg.com/async-validator/-/async-validator-4.0.7.tgz#034a0fd2103a6b2ebf010da75183bec299247afe"
......@@ -980,6 +985,11 @@ mlly@^0.2.2:
dependencies:
import-meta-resolve "^1.1.1"
moment@2.24.0:
version "2.24.0"
resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
monaco-editor@^0.24.0:
version "0.24.0"
resolved "https://registry.yarnpkg.com/monaco-editor/-/monaco-editor-0.24.0.tgz#990b55096bcc95d08d8d28e55264c6eb17707269"
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册