feat:去除路由守卫以及测试
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
# 接口前缀
|
# 接口前缀
|
||||||
VITE_APP_BASEAPI="/api-dev"
|
VITE_APP_BASEAPI="/api-dev"
|
||||||
# VITE_APP_URL="http://123.207.63.87:19001/api/app"
|
VITE_APP_URL="http://123.207.63.87:19001/api/app"
|
||||||
VITE_APP_URL="http://localhost:19001/api/app"
|
# VITE_APP_URL="http://localhost:19001/api/app"
|
||||||
VITE_APP_ENV_NAME = "dev"
|
VITE_APP_ENV_NAME = "dev"
|
||||||
@@ -1,131 +1,146 @@
|
|||||||
<template >
|
<template>
|
||||||
<div class="avatar">
|
<div class="avatar">
|
||||||
<div class="avatar-left">
|
<div class="avatar-left">
|
||||||
<el-avatar :size="props.size" :src="iconUrl" />
|
<el-avatar :size="props.size" :src="iconUrl" />
|
||||||
|
|
||||||
<div v-if="props.isSelf">
|
<div v-if="props.isSelf">
|
||||||
<div class="nick"> {{ userInfo.nick }}</div>
|
<div class="nick">{{ userInfo.nick }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="!props.isSelf">
|
<div v-if="!props.isSelf">
|
||||||
|
<div class="nick" :class="{ mt_1: props.time != 'undefined' }">
|
||||||
<div class="nick" :class="{ mt_1: props.time != 'undefined' }"> {{ userInfo.nick }}</div>
|
{{ userInfo.nick }}
|
||||||
<div class="remarks" v-if="props.time"> {{ props.time }}</div>
|
|
||||||
<div class="remarks">
|
|
||||||
<slot name="bottom" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="info" v-if="!props.isSelf">
|
|
||||||
<el-tag class="ml-2" type="warning">V8</el-tag>
|
|
||||||
<el-tag class="ml-2" type="danger">会员</el-tag>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="remarks" v-if="props.time">{{ props.time }}</div>
|
||||||
|
<div class="remarks">
|
||||||
<el-button v-if="props.showWatching" type="primary" size="default" icon="Plus">关注</el-button>
|
<slot name="bottom" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info" v-if="!props.isSelf">
|
||||||
|
<el-tag class="ml-2" type="warning">V8</el-tag>
|
||||||
|
<el-tag class="ml-2" type="danger">会员</el-tag>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<el-button
|
||||||
|
v-if="props.showWatching"
|
||||||
|
type="primary"
|
||||||
|
size="default"
|
||||||
|
icon="Plus"
|
||||||
|
>关注</el-button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import useUserStore from '@/stores/user'
|
import useUserStore from "@/stores/user";
|
||||||
import { reactive, watch, onMounted, computed, ref } from 'vue';
|
import { reactive, watch, onMounted, computed, ref } from "vue";
|
||||||
//userInfo
|
//userInfo
|
||||||
//{icon,name,role,id},根据判断userInfo是否等于未定义,来觉得是当前登录用户信息,还是其他人信息
|
//{icon,name,role,id},根据判断userInfo是否等于未定义,来觉得是当前登录用户信息,还是其他人信息
|
||||||
const props = defineProps(['size', 'showWatching', 'time', 'userInfo', 'isSelf'])
|
const props = defineProps([
|
||||||
|
"size",
|
||||||
|
"showWatching",
|
||||||
|
"time",
|
||||||
|
"userInfo",
|
||||||
|
"isSelf",
|
||||||
|
]);
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
const userInfo = reactive({
|
const userInfo = reactive({
|
||||||
icon: "",
|
icon: "",
|
||||||
nick: "",
|
nick: "",
|
||||||
role: [],
|
role: [],
|
||||||
id: ""
|
id: "",
|
||||||
});
|
});
|
||||||
const iconUrl=ref('/src/assets/logo.ico');
|
const iconUrl = ref("/src/assets/logo.ico");
|
||||||
const iconUrlHandler = () => {
|
const iconUrlHandler = () => {
|
||||||
if (userInfo.icon == null || userInfo.icon == undefined || userInfo.icon == '') {
|
if (
|
||||||
|
userInfo.icon == null ||
|
||||||
return '/src/assets/logo.ico';
|
userInfo.icon == undefined ||
|
||||||
}
|
userInfo.icon == ""
|
||||||
return `${import.meta.env.VITE_APP_BASEAPI}/file/${userInfo.icon}`;
|
) {
|
||||||
}
|
return "/src/assets/logo.ico";
|
||||||
|
}
|
||||||
|
return `${import.meta.env.VITE_APP_BASEAPI}/file/${userInfo.icon}`;
|
||||||
|
};
|
||||||
|
|
||||||
watch(userStore, (n) => {
|
watch(userStore, (n) => {
|
||||||
if (props.userInfo == undefined) {
|
if (props.userInfo == undefined) {
|
||||||
userInfo.nick = n.name;
|
userInfo.nick = n.name;
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
|
||||||
})
|
watch(
|
||||||
|
() => props,
|
||||||
watch(() => props, (n) => {
|
(n) => {
|
||||||
Init();
|
Init();
|
||||||
}, { deep: true })
|
},
|
||||||
|
{ deep: true }
|
||||||
|
);
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
Init();
|
Init();
|
||||||
})
|
});
|
||||||
|
|
||||||
const Init = () => {
|
const Init = () => {
|
||||||
//使用传入值
|
//使用传入值
|
||||||
if (props.userInfo != undefined) {
|
if (props.userInfo != undefined) {
|
||||||
userInfo.icon = props.userInfo.icon;
|
userInfo.icon = props.userInfo.icon;
|
||||||
userInfo.nick = props.userInfo.nick;
|
userInfo.nick = props.userInfo.nick;
|
||||||
userInfo.role = props.userInfo.role;
|
userInfo.role = props.userInfo.role;
|
||||||
userInfo.id = props.userInfo.id;
|
userInfo.id = props.userInfo.id;
|
||||||
iconUrl.value=iconUrlHandler(userInfo.icon)
|
iconUrl.value = iconUrlHandler(userInfo.icon);
|
||||||
}
|
console.log("使用传入值:", iconUrl.value);
|
||||||
|
}
|
||||||
//使用当前登录用户
|
|
||||||
else {
|
|
||||||
|
|
||||||
userInfo.icon = userStore.icon;
|
|
||||||
userInfo.nick = userStore.name;
|
|
||||||
userInfo.role = userStore.role;
|
|
||||||
userInfo.id = userStore.id;
|
|
||||||
iconUrl.value=userInfo.icon;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
//使用当前登录用户
|
||||||
|
else {
|
||||||
|
userInfo.icon = userStore.icon;
|
||||||
|
userInfo.nick = userStore.name;
|
||||||
|
userInfo.role = userStore.role;
|
||||||
|
userInfo.id = userStore.id;
|
||||||
|
iconUrl.value = userInfo.icon;
|
||||||
|
console.log("当前登陆:", iconUrl.value);
|
||||||
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.mt_1 {
|
.mt_1 {
|
||||||
margin-top: 0.5rem;
|
margin-top: 0.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nick {
|
.nick {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
margin-top: 0.6rem;
|
margin-top: 0.6rem;
|
||||||
margin-left: 1rem;
|
margin-left: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.info .el-tag {
|
.info .el-tag {
|
||||||
margin-right: 1rem;
|
margin-right: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-icon {
|
.el-icon {
|
||||||
color: white;
|
color: white;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.avatar {
|
.avatar {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.avatar-left {
|
.avatar-left {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-avatar {
|
.el-avatar {
|
||||||
margin-right: 1.2rem;
|
margin-right: 1.2rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.remarks {
|
.remarks {
|
||||||
padding-top: 0.5rem;
|
padding-top: 0.5rem;
|
||||||
color: #8C8C8C;
|
color: #8c8c8c;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -41,7 +41,8 @@ router.beforeEach((to, from, next) => {
|
|||||||
// 在免登录白名单,直接进入
|
// 在免登录白名单,直接进入
|
||||||
next();
|
next();
|
||||||
} else {
|
} else {
|
||||||
next(`/login?redirect=${to.path}&unTourist=true`); // 否则全部重定向到登录页
|
next();
|
||||||
|
// next(`/login?redirect=${to.path}&unTourist=true`); // 否则全部重定向到登录页
|
||||||
NProgress.done();
|
NProgress.done();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ const useUserStore = defineStore("user", {
|
|||||||
user.icon == "" || user.icon == null
|
user.icon == "" || user.icon == null
|
||||||
? "/src/assets/logo.ico"
|
? "/src/assets/logo.ico"
|
||||||
: import.meta.env.VITE_APP_BASEAPI + "/file/" + user.icon;
|
: import.meta.env.VITE_APP_BASEAPI + "/file/" + user.icon;
|
||||||
|
console.log(avatar, "store的avatar");
|
||||||
if (res.roleCodes && res.roleCodes.length > 0) {
|
if (res.roleCodes && res.roleCodes.length > 0) {
|
||||||
// 验证返回的roles是否是一个非空数组
|
// 验证返回的roles是否是一个非空数组
|
||||||
this.roles = res.roleCodes;
|
this.roles = res.roleCodes;
|
||||||
|
|||||||
@@ -26,7 +26,7 @@
|
|||||||
</el-form>
|
</el-form>
|
||||||
<RouterLink to="/register"> 没有账号?前往注册</RouterLink>
|
<RouterLink to="/register"> 没有账号?前往注册</RouterLink>
|
||||||
<button class="login-btn" @click="login(loginFormRef)">登 录</button>
|
<button class="login-btn" @click="login(loginFormRef)">登 录</button>
|
||||||
<button class="login-btn" @click="guestlogin">游客临时登录</button>
|
<button class="login-btn" @click="guestlogin">访客</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="divider">
|
<div class="divider">
|
||||||
@@ -76,9 +76,6 @@ const loginForm = reactive({
|
|||||||
code: "",
|
code: "",
|
||||||
});
|
});
|
||||||
const guestlogin = async () => {
|
const guestlogin = async () => {
|
||||||
loginForm.userName = "guest";
|
|
||||||
loginForm.password = "123456";
|
|
||||||
await userStore.login(loginForm);
|
|
||||||
const redirect = route.query?.redirect ?? "/index";
|
const redirect = route.query?.redirect ?? "/index";
|
||||||
router.push(redirect);
|
router.push(redirect);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user