up
This commit is contained in:
@@ -1,46 +1,45 @@
|
||||
<script setup>
|
||||
import { useUserStore } from "@/stores/user";
|
||||
|
||||
import { RouterLink} from 'vue-router'
|
||||
import { RouterLink } from "vue-router";
|
||||
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
import { myfuncs } from '@/myfunc.js'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { myfuncs } from "@/myfunc.js";
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
// 使用 vue-i18n 的 Composition API
|
||||
const { t, locale } = useI18n()
|
||||
|
||||
const theTeme = ref('light')
|
||||
const lang_sele = ref(null)
|
||||
|
||||
const isLogin = false
|
||||
const { t, locale } = useI18n();
|
||||
const userStore = useUserStore();
|
||||
const theTeme = ref("light");
|
||||
const lang_sele = ref(null);
|
||||
|
||||
function set_them(temp) {
|
||||
theTeme.value = temp
|
||||
myfuncs.setTheme(temp, true)
|
||||
theTeme.value = temp;
|
||||
myfuncs.setTheme(temp, true);
|
||||
}
|
||||
|
||||
function changeLanguage(lang) {
|
||||
// 切换语言
|
||||
const selectElement = lang.target
|
||||
const selectedLang = selectElement.value
|
||||
locale.value = selectedLang
|
||||
myfuncs.save('userLanguage', selectedLang)
|
||||
const selectElement = lang.target;
|
||||
const selectedLang = selectElement.value;
|
||||
locale.value = selectedLang;
|
||||
myfuncs.save("userLanguage", selectedLang);
|
||||
//console.log("selectedLang:",selectedLang);
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
const savedTheme = myfuncs.getThemefromStorge()
|
||||
theTeme.value = savedTheme
|
||||
myfuncs.setTheme(savedTheme, false)
|
||||
const userLang = myfuncs.load('userLanguage')
|
||||
const savedTheme = myfuncs.getThemefromStorge();
|
||||
theTeme.value = savedTheme;
|
||||
myfuncs.setTheme(savedTheme, false);
|
||||
const userLang = myfuncs.load("userLanguage");
|
||||
if (userLang) {
|
||||
locale.value = userLang
|
||||
locale.value = userLang;
|
||||
if (lang_sele.value) {
|
||||
;(lang_sele.value).value = userLang
|
||||
lang_sele.value.value = userLang;
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -60,7 +59,9 @@ onMounted(() => {
|
||||
</button>
|
||||
<!-- END NAVBAR TOGGLER -->
|
||||
<!-- BEGIN NAVBAR LOGO -->
|
||||
<div class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3">
|
||||
<div
|
||||
class="navbar-brand navbar-brand-autodark d-none-navbar-horizontal pe-0 pe-md-3"
|
||||
>
|
||||
<router-link to="/" aria-label="Tabler">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
@@ -137,8 +138,8 @@ onMounted(() => {
|
||||
</a>
|
||||
</div>
|
||||
<!-- 这里判断是否已经登陆 是则显示用户信息 否则显示登陆按钮 -->
|
||||
<div v-if="!isLogin" class="nav-item">
|
||||
<router-link to="login" class="btn btn-outline-primary" >
|
||||
<div v-if="!userStore.isLoggedIn" class="nav-item">
|
||||
<router-link to="login" class="btn btn-outline-primary">
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
class="icon"
|
||||
@@ -157,18 +158,21 @@ onMounted(() => {
|
||||
<path d="M19 22v-6"></path>
|
||||
<path d="M22 19l-3 -3l-3 3"></path>
|
||||
</svg>
|
||||
{{ t('message.login_or_register') }}
|
||||
{{ t("message.login_or_register") }}
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<div v-if="isLogin" class="nav-item dropdown">
|
||||
<div v-if="userStore.isLoggedIn" class="nav-item dropdown">
|
||||
<a
|
||||
href="#"
|
||||
class="nav-link d-flex lh-1 p-0 px-2"
|
||||
data-bs-toggle="dropdown"
|
||||
aria-label="Open user menu"
|
||||
>
|
||||
<span class="avatar avatar-sm" style="background-image: url(./static/avatars/000m.jpg)">
|
||||
<span
|
||||
class="avatar avatar-sm"
|
||||
style="background-image: url(./static/avatars/000m.jpg)"
|
||||
>
|
||||
</span>
|
||||
<div class="d-none d-xl-block ps-2">
|
||||
<div>Paweł Kuna</div>
|
||||
@@ -213,15 +217,23 @@ onMounted(() => {
|
||||
>
|
||||
<path d="M5 12l-2 0l9 -9l9 9l-2 0" />
|
||||
<path d="M5 12v7a2 2 0 0 0 2 2h10a2 2 0 0 0 2 -2v-7" />
|
||||
<path d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6" /></svg
|
||||
<path
|
||||
d="M9 21v-6a2 2 0 0 1 2 -2h2a2 2 0 0 1 2 2v6"
|
||||
/></svg
|
||||
></span>
|
||||
<span class="nav-link-title"> {{ t('appname.home') }} </span>
|
||||
<span class="nav-link-title">
|
||||
{{ t("appname.home") }}
|
||||
</span>
|
||||
</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="ms-auto">
|
||||
<select class="form-select" @change="changeLanguage" ref="lang_sele">
|
||||
<select
|
||||
class="form-select"
|
||||
@change="changeLanguage"
|
||||
ref="lang_sele"
|
||||
>
|
||||
<option value="en">English</option>
|
||||
<option value="zh-CN">中文</option>
|
||||
</select>
|
||||
|
||||
@@ -37,7 +37,10 @@
|
||||
"network_err":"Network error",
|
||||
"username_dup":"Duplicate username",
|
||||
"registration_successful":"Registration successful!",
|
||||
"server_error":"Server Error"
|
||||
"server_error":"Server Error",
|
||||
"user_not_found":"User not found",
|
||||
"username_or_password_incorrect":"Username or password incorrect.",
|
||||
"login_successful":"Login successful"
|
||||
},
|
||||
"button": {
|
||||
"submit": "Submit",
|
||||
|
||||
@@ -37,7 +37,10 @@
|
||||
"network_err":"网络错误",
|
||||
"username_dup":"用户名重复",
|
||||
"registration_successful":"注册成功!",
|
||||
"server_error":"服务端错误"
|
||||
"server_error":"服务端错误",
|
||||
"user_not_found":"找不到用户",
|
||||
"username_or_password_incorrect":"用户或密码错误",
|
||||
"login_successful":"登录成功"
|
||||
},
|
||||
"button": {
|
||||
"submit": "提交",
|
||||
|
||||
@@ -23,7 +23,7 @@ export const my_network_func = {
|
||||
//把cookie插入json
|
||||
var data = {};
|
||||
data["data"] = json;
|
||||
var cookie = myfuncs.load_json("cookie");
|
||||
var cookie = myfuncs.loadJson("cookie");
|
||||
if (cookie) {
|
||||
data["cookie"] = cookie.Value;
|
||||
}
|
||||
@@ -46,7 +46,7 @@ export const my_network_func = {
|
||||
if (response.data.cookie.Value == "") {
|
||||
myfuncs.dele("cookie");
|
||||
} else {
|
||||
myfuncs.save_json("cookie", response.data.cookie);
|
||||
myfuncs.saveJson("cookie", response.data.cookie);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,6 +8,31 @@ export const myfuncs = {
|
||||
console.log("myfuncs test ok");
|
||||
},
|
||||
|
||||
//临时保存的数据,浏览器专属
|
||||
saveT(key,data){
|
||||
sessionStorage.setItem(key, data)
|
||||
},
|
||||
loadT(key){
|
||||
return sessionStorage.getItem(key)
|
||||
},
|
||||
deleT(key){
|
||||
sessionStorage.removeItem(key)
|
||||
},
|
||||
saveJsonT(key,data){
|
||||
this.saveT(key,JSON.stringify(data))
|
||||
},
|
||||
|
||||
loadJsonT(key){
|
||||
const js_data=this.loadT(key)
|
||||
if(js_data){
|
||||
return JSON.parse(js_data)
|
||||
}else{
|
||||
return null
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
save(key,data){
|
||||
localStorage.setItem(key, data)
|
||||
},
|
||||
@@ -18,11 +43,11 @@ export const myfuncs = {
|
||||
localStorage.removeItem(key)
|
||||
},
|
||||
|
||||
save_json(key,data){
|
||||
saveJson(key,data){
|
||||
this.save(key,JSON.stringify(data))
|
||||
},
|
||||
|
||||
load_json(key){
|
||||
loadJson(key){
|
||||
const js_data=this.load(key)
|
||||
if(js_data){
|
||||
return JSON.parse(js_data)
|
||||
|
||||
@@ -15,6 +15,9 @@ export const useUserStore = defineStore("user", () => {
|
||||
const login = () => {
|
||||
isLoggedIn.value = true;
|
||||
};
|
||||
const loginUpdata = () => {
|
||||
isLoggedIn.value = true;
|
||||
};
|
||||
|
||||
return {
|
||||
userInfo,
|
||||
@@ -22,5 +25,6 @@ export const useUserStore = defineStore("user", () => {
|
||||
isLoggedIn,
|
||||
logout,
|
||||
login,
|
||||
loginUpdata,
|
||||
};
|
||||
});
|
||||
|
||||
@@ -1,9 +1,16 @@
|
||||
<script setup>
|
||||
import { onMounted, watch, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useUserStore } from "@/stores/user";
|
||||
|
||||
import { my_network_func } from "@/my_network_func";
|
||||
import { myfuncs } from "@/myfunc.js";
|
||||
import MyOffcanvas from "@/components/MyOffcanvas.vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
// 使用 vue-i18n 的 Composition API
|
||||
const { t, locale } = useI18n();
|
||||
const router = useRouter();
|
||||
const userStore = useUserStore();
|
||||
|
||||
const mos = ref();
|
||||
|
||||
@@ -11,6 +18,7 @@ const username = ref();
|
||||
const password = ref();
|
||||
const isRemember = ref();
|
||||
|
||||
|
||||
const isShowPassword = ref(false);
|
||||
function togglePasswordVisibility() {
|
||||
isShowPassword.value = !isShowPassword.value;
|
||||
@@ -42,7 +50,69 @@ function login() {
|
||||
return;
|
||||
}
|
||||
|
||||
console.log("登录信息:", { user, pass, remember });
|
||||
//console.log("登录信息:", { user, pass, remember });
|
||||
|
||||
my_network_func.postJson(
|
||||
"/users/login",
|
||||
{
|
||||
username: user,
|
||||
userpass: pass,
|
||||
remember: remember,
|
||||
},
|
||||
(r) => {
|
||||
console.log(r)
|
||||
switch (r.statusCode) {
|
||||
case 200:
|
||||
switch (r.data.err_code) {
|
||||
case -41:
|
||||
username.value?.classList.add("is-invalid");
|
||||
mos.value?.showAlert(
|
||||
"warning",
|
||||
t("message.user_not_found"),
|
||||
5000
|
||||
);
|
||||
break;
|
||||
case -42:
|
||||
username.value?.classList.add("is-invalid");
|
||||
password.value?.classList.add("is-invalid");
|
||||
mos.value?.showAlert(
|
||||
"warning",
|
||||
t("message.username_or_password_incorrect"),
|
||||
5000
|
||||
);
|
||||
break;
|
||||
case 0:
|
||||
//登录成功,载入cookie
|
||||
//临时保存cookie
|
||||
myfuncs.saveJsonT("userCookie",r.data.return.cookie)
|
||||
if(remember){
|
||||
//长期保存cookie
|
||||
myfuncs.saveJson("userCookie",r.data.return.cookie)
|
||||
}
|
||||
|
||||
//userStore.isLoggedIn=true
|
||||
//更新用户信息
|
||||
|
||||
mos.value?.showAlert(
|
||||
"success",
|
||||
t("message.login_successful"),
|
||||
1000,
|
||||
() => {
|
||||
router.back()
|
||||
}
|
||||
);
|
||||
break;
|
||||
default:
|
||||
mos.value?.showAlert("danger", t("message.server_error"), 5000);
|
||||
break;
|
||||
}
|
||||
break;
|
||||
default:
|
||||
mos.value?.showAlert("danger", t("message.network_err"), 5000);
|
||||
break;
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
function functionupdataTitle() {
|
||||
|
||||
@@ -75,7 +75,7 @@ function createAccount() {
|
||||
userpass: userpassword.value?.value,
|
||||
},
|
||||
(r) => {
|
||||
console.log(r);
|
||||
//console.log(r);
|
||||
switch (r.statusCode) {
|
||||
case 200:
|
||||
switch (r.data.err_code) {
|
||||
|
||||
Reference in New Issue
Block a user