🔨 修改路由配置.
This commit is contained in:
lijiahangmax
@@ -1,7 +1,13 @@
|
||||
<template>
|
||||
<div></div>
|
||||
<div />
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'redirect',
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
|
||||
@@ -1,44 +1,34 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<a-result class="result" status="403" subtitle="您没有访问该资源的权限" />
|
||||
<div class="operation-row">
|
||||
<a-button class="mr8" key="back" type="primary" @click="logout">重新登录</a-button>
|
||||
<a-button key="back" type="primary" @click="to('workplace')">返回工作台</a-button>
|
||||
</div>
|
||||
<a-space>
|
||||
<a-button type="primary" @click="() => logout()">重新登录</a-button>
|
||||
<a-button type="primary" @click="() => $router.push(DEFAULT_ROUTE_NAME)">返回工作台</a-button>
|
||||
</a-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useUserStore } from '@/store';
|
||||
|
||||
const router = useRouter();
|
||||
const to = (name: string) => {
|
||||
router.push({ name: name });
|
||||
};
|
||||
|
||||
// 重新登录
|
||||
const logout = () => {
|
||||
const userStore = useUserStore();
|
||||
userStore.logout();
|
||||
to('login');
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'forbidden',
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import useUser from '@/hooks/user';
|
||||
import { DEFAULT_ROUTE_NAME } from '@/router/constants';
|
||||
|
||||
const { logout } = useUser();
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.content {
|
||||
// padding-top: 100px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -95px;
|
||||
margin-top: -121px;
|
||||
margin-left: -96px;
|
||||
margin-top: -124px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,44 +1,34 @@
|
||||
<template>
|
||||
<div class="content">
|
||||
<a-result class="result" status="404" subtitle="糟糕! 页面不见了!" />
|
||||
<div class="operation-row">
|
||||
<a-button class="mr8" key="back" type="primary" @click="logout">重新登录</a-button>
|
||||
<a-button key="back" type="primary" @click="to('workplace')">返回工作台</a-button>
|
||||
</div>
|
||||
<a-space>
|
||||
<a-button type="primary" @click="() => logout()">重新登录</a-button>
|
||||
<a-button type="primary" @click="() => $router.push(DEFAULT_ROUTE_NAME)">返回工作台</a-button>
|
||||
</a-space>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
import { useUserStore } from '@/store';
|
||||
|
||||
const router = useRouter();
|
||||
const to = (name: string) => {
|
||||
router.push({ name: name });
|
||||
};
|
||||
|
||||
// 重新登录
|
||||
const logout = () => {
|
||||
const userStore = useUserStore();
|
||||
userStore.logout();
|
||||
to('login');
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'notFound',
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import useUser from '@/hooks/user';
|
||||
import { DEFAULT_ROUTE_NAME } from '@/router/constants';
|
||||
|
||||
const { logout } = useUser();
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.content {
|
||||
// padding-top: 100px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -95px;
|
||||
margin-top: -121px;
|
||||
margin-left: -96px;
|
||||
margin-top: -124px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
165
orion-visor-ui/src/views/base/update-password/index.vue
Normal file
165
orion-visor-ui/src/views/base/update-password/index.vue
Normal file
@@ -0,0 +1,165 @@
|
||||
<template>
|
||||
<a-spin class="content" :loading="loading">
|
||||
<!-- 原因 -->
|
||||
<p class="reason">{{ reason }}</p>
|
||||
<!-- 表单 -->
|
||||
<a-form :model="formModel"
|
||||
ref="formRef"
|
||||
label-align="right"
|
||||
:rules="rules">
|
||||
<!-- 原始密码 -->
|
||||
<a-form-item field="beforePassword"
|
||||
label="原始密码"
|
||||
hide-label>
|
||||
<a-input-password v-model="formModel.beforePassword" placeholder="请输入原始密码" />
|
||||
</a-form-item>
|
||||
<!-- 新密码 -->
|
||||
<a-form-item field="password"
|
||||
label="新密码"
|
||||
hide-label>
|
||||
<a-input-password v-model="formModel.password" placeholder="请输入新密码" />
|
||||
</a-form-item>
|
||||
<!-- 确认密码 -->
|
||||
<a-form-item field="checkPassword"
|
||||
label="确认密码"
|
||||
hide-label>
|
||||
<a-input-password v-model="formModel.checkPassword" placeholder="请再次输入新密码" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
<!-- 按钮 -->
|
||||
<a-space>
|
||||
<!-- 确认修改 -->
|
||||
<a-button class="action"
|
||||
type="primary"
|
||||
@click="doUpdate">
|
||||
确认修改
|
||||
</a-button>
|
||||
<!-- 退出登录 -->
|
||||
<a-button class="action"
|
||||
type="primary"
|
||||
@click="() => logout()">
|
||||
退出登录
|
||||
</a-button>
|
||||
</a-space>
|
||||
</a-spin>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'updatePassword',
|
||||
};
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import type { UserUpdatePasswordRequest } from '@/api/user/mine';
|
||||
import type { FieldRule } from '@arco-design/web-vue';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { md5 } from '@/utils';
|
||||
import useUser from '@/hooks/user';
|
||||
import useLoading from '@/hooks/loading';
|
||||
import { useDictStore } from '@/store';
|
||||
import { dictKeys, updatePasswordReasonKey } from './types/const';
|
||||
import { updateCurrentUserPassword } from '@/api/user/mine';
|
||||
|
||||
const { logout } = useUser();
|
||||
const { loading, setLoading } = useLoading();
|
||||
|
||||
const rules = {
|
||||
beforePassword: [{
|
||||
required: true,
|
||||
message: '请输入原始密码'
|
||||
}],
|
||||
password: [{
|
||||
required: true,
|
||||
message: '请输入新密码'
|
||||
}, {
|
||||
minLength: 8,
|
||||
maxLength: 32,
|
||||
message: '新密码长度需要在 8-32 位之间'
|
||||
}, {
|
||||
validator: (value, cb) => {
|
||||
if (formModel.value.beforePassword === value) {
|
||||
cb('新密码不能和原始密码相同');
|
||||
return;
|
||||
}
|
||||
}
|
||||
}],
|
||||
checkPassword: [{
|
||||
required: true,
|
||||
message: '请再次输入新密码'
|
||||
}, {
|
||||
validator: (value, cb) => {
|
||||
if (formModel.value.password !== value) {
|
||||
cb('两次输入的密码不一致');
|
||||
return;
|
||||
}
|
||||
}
|
||||
}],
|
||||
} as Record<string, FieldRule | FieldRule[]>;
|
||||
|
||||
const reason = ref();
|
||||
const formRef = ref();
|
||||
const formModel = ref<UserUpdatePasswordRequest>({});
|
||||
|
||||
// 确认修改
|
||||
const doUpdate = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
// 验证参数
|
||||
const error = await formRef.value.validate();
|
||||
if (error) {
|
||||
return;
|
||||
}
|
||||
// 修改密码
|
||||
await updateCurrentUserPassword({
|
||||
beforePassword: md5(formModel.value.beforePassword as string),
|
||||
password: md5(formModel.value.password as string)
|
||||
});
|
||||
// 退出登录
|
||||
await logout('修改成功');
|
||||
} catch (e) {
|
||||
return;
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
const reasonKey = useRoute().query?.reason;
|
||||
if (reasonKey) {
|
||||
const { loadKeys, getDictValue } = useDictStore();
|
||||
// 加载字典值
|
||||
await loadKeys(dictKeys);
|
||||
// 获取原因
|
||||
reason.value = getDictValue(updatePasswordReasonKey, reasonKey);
|
||||
} else {
|
||||
reason.value = '修改密码';
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.content {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -96px;
|
||||
margin-top: -168px;
|
||||
text-align: center;
|
||||
|
||||
.reason {
|
||||
text-align: left;
|
||||
margin-bottom: 16px;
|
||||
height: 16px;
|
||||
line-height: 16px;
|
||||
font-size: 16px;
|
||||
color: var(--color-text-2);
|
||||
}
|
||||
|
||||
.action {
|
||||
width: 148px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,5 @@
|
||||
// 修改密码原因
|
||||
export const updatePasswordReasonKey = 'updatePasswordReason';
|
||||
|
||||
// 加载的字典值
|
||||
export const dictKeys = [updatePasswordReasonKey];
|
||||
Reference in New Issue
Block a user