Refactor axios.js and Vue components to conditionally handle namespace settings based on server provider. Update request headers in axios.js to include site key and namespace password only for specific providers. Enhance NamespaceAccess and NamespaceSettingsCard components to show/hide based on provider, and streamline password management functionality.

This commit is contained in:
SunWuyuan
2025-05-18 15:09:10 +08:00
parent 31cff8a867
commit 4691114f9b
5 changed files with 153 additions and 24 deletions
+16 -6
View File
@@ -1,5 +1,5 @@
<template>
<div class="namespace-access">
<div class="namespace-access" v-if="shouldShowAccess">
<!-- 只读状态显示 -->
<v-chip
v-if="isReadOnly"
@@ -13,7 +13,7 @@
<v-btn
v-if="isReadOnly"
color="primary"
size="small"
class="rounded-xl"
prepend-icon="mdi-lock-open-variant"
@click="openPasswordDialog"
:disabled="loading"
@@ -23,7 +23,7 @@
<!-- 密码输入对话框 -->
<v-dialog v-model="dialog" max-width="400" persistent>
<v-card>
<v-card class="rounded-xl" border hover>
<v-card-title class="text-h6">输入访问密码</v-card-title>
<v-card-text>
<div v-if="passwordHint" class="text-body-2 mb-4">
@@ -37,7 +37,6 @@
:error="!!error"
:error-messages="error"
@keyup.enter="checkPassword"
:append-inner-icon="showPassword ? 'mdi-eye-off' : 'mdi-eye'"
@click:append-inner="showPassword = !showPassword"
:disabled="loading"
autofocus
@@ -85,11 +84,23 @@ export default {
passwordHint: null, // 密码提示
};
},
computed: {
shouldShowAccess() {
const provider = getSetting("server.provider");
return provider === "kv-server" || provider === "classworkscloud";
}
},
async created() {
await this.checkAccess();
if (this.shouldShowAccess) {
await this.checkAccess();
}
},
methods: {
async checkAccess() {
if (!this.shouldShowAccess) {
return;
}
try {
// 获取命名空间访问类型
const response = await axios.get(
@@ -105,7 +116,6 @@ export default {
// 保存密码提示
this.passwordHint = response.data.passwordHint || null;
} else {
//this.$router.push("/settings");
return;
}
@@ -1,9 +1,11 @@
<template>
<settings-card
v-if="shouldShowCard"
title="命名空间设置"
icon="mdi-database-lock"
:loading="loading"
>
<namespace-access ref="namespaceAccess" />
<!-- 命名空间标识符 -->
<v-card variant="tonal" class="rounded-lg mb-4">
<v-card-item>
@@ -178,12 +180,23 @@
variant="tonal"
:loading="hintLoading"
@click="openHintDialog"
class="mr-2"
>
设置密码提示
<template #prepend>
<v-icon icon="mdi-lightbulb-outline" />
</template>
</v-btn>
<v-btn
color="primary"
variant="tonal"
@click="modifyLocalPassword"
>
修改本地密码
<template #prepend>
<v-icon icon="mdi-key-variant" />
</template>
</v-btn>
</div>
<v-btn
@@ -352,6 +365,7 @@
<script>
import SettingsCard from "@/components/SettingsCard.vue";
import NamespaceAccess from "@/components/NamespaceAccess.vue";
import { kvServerProvider } from "@/utils/providers/kvServerProvider";
import { getSetting } from "@/utils/settings";
import axios from "@/axios/axios";
@@ -374,7 +388,10 @@ const getHeaders = () => {
export default {
name: "NamespaceSettingsCard",
components: { SettingsCard },
components: {
SettingsCard,
NamespaceAccess
},
data() {
return {
@@ -438,6 +455,10 @@ export default {
},
computed: {
shouldShowCard() {
const provider = getSetting("server.provider");
return provider === "kv-server" || provider === "classworkscloud";
},
deviceUuid() {
return this.namespaceInfo.uuid;
},
@@ -460,8 +481,10 @@ export default {
},
async created() {
await this.loadNamespaceInfo();
await this.loadPasswordHint();
if (this.shouldShowCard) {
await this.loadNamespaceInfo();
await this.loadPasswordHint();
}
},
methods: {
@@ -693,6 +716,14 @@ export default {
this.snackbarText = message;
this.showSnackbar = true;
},
modifyLocalPassword() {
// 获取NamespaceAccess组件实例并调用方法
const namespaceAccess = this.$refs.namespaceAccess;
if (namespaceAccess) {
namespaceAccess.openPasswordDialog();
}
},
},
};
</script>