mirror/ezbookkeeping
1
0
Fork 0
mirror of https://github.com/mayswind/ezbookkeeping.git synced 2026-05-15 23:47:33 +08:00
Code Issues Packages Projects Releases Wiki Activity

add a special token type for MCP

Browse Source
This commit is contained in:
MaysWind
2025-07-07 01:20:38 +08:00
parent fbaf6086e3
commit 0140fc7622
26 changed files with 424 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/desktop/user/settings/dialogs/UserGenerateMCPTokenDialog.vue
+162
View File
@@ -0,0 +1,162 @@
<template>
<v-dialog width="800" :persistent="true" v-model="showState">
<v-card class="pa-2 pa-sm-4 pa-md-4">
<template #title>
<div class="d-flex align-center justify-center">
<h4 class="text-h4">{{ tt('Generate MCP token') }}</h4>
</div>
</template>
<v-card-text class="py-0 w-100 d-flex justify-center" v-if="generatedToken && serverUrl">
<v-switch class="export-data-display-switch" color="secondary"
:label="tt('Configuration')"
v-model="showConfiguration"
@click="showConfiguration = !showConfiguration">
<template #prepend>
<span>{{ tt('Token') }}</span>
</template>
</v-switch>
</v-card-text>
<v-card-text>
<v-row>
<v-col cols="12" md="12" v-if="!generatedToken">
<v-text-field
autocomplete="current-password"
type="password"
:disabled="generating"
:label="tt('Current Password')"
:placeholder="tt('Current Password')"
v-model="currentPassword"
@keyup.enter="generateToken"
/>
</v-col>
<v-col cols="12" md="12" v-if="generatedToken">
<v-textarea :readonly="true" :rows="4" :value="generatedToken" v-if="!showConfiguration || !serverUrl" />
<v-textarea :readonly="true" :rows="15" :value="mcpServerConfiguration" v-if="showConfiguration && serverUrl" />
</v-col>
</v-row>
</v-card-text>
<v-card-text class="overflow-y-visible">
<div ref="buttonContainer" class="w-100 d-flex justify-center gap-4">
<v-btn :disabled="generating || !currentPassword" @click="generateToken" v-if="!generatedToken">
{{ tt('Generate') }}
<v-progress-circular indeterminate size="22" class="ml-2" v-if="generating"></v-progress-circular>
</v-btn>
<v-btn color="secondary" variant="tonal" :disabled="generating"
@click="cancel" v-if="!generatedToken">{{ tt('Cancel') }}</v-btn>
<v-btn @click="copy" v-if="generatedToken">{{ tt('Copy') }}</v-btn>
<v-btn color="secondary" variant="tonal" @click="close" v-if="generatedToken">{{ tt('Close') }}</v-btn>
</div>
</v-card-text>
</v-card>
</v-dialog>
<snack-bar ref="snackbar" />
</template>
<script setup lang="ts">
import SnackBar from '@/components/desktop/SnackBar.vue';
import { ref, computed, useTemplateRef } from 'vue';
import { useI18n } from '@/locales/helpers.ts';
import { useTokensStore } from '@/stores/token.ts';
import { copyTextToClipboard } from '@/lib/ui/common.ts';
type SnackBarType = InstanceType<typeof SnackBar>;
const { tt } = useI18n();
const tokensStore = useTokensStore();
const buttonContainer = useTemplateRef<HTMLElement>('buttonContainer');
const snackbar = useTemplateRef<SnackBarType>('snackbar');
let resolveFunc: (() => void) | null = null;
let rejectFunc: ((reason?: unknown) => void) | null = null;
const showState = ref<boolean>(false);
const currentPassword = ref<string>('');
const generating = ref<boolean>(false);
const showConfiguration = ref<boolean>(false);
const serverUrl = ref<string>('');
const generatedToken = ref<string>('');
const mcpServerConfiguration = computed<string>(() => {
return '{\n' +
' "mcpServers": {\n' +
' "ezbookkeeping-mcp": {\n' +
' "type": "streamable-http",\n' +
' "url": "' + serverUrl.value + '",\n' +
' "headers": {\n' +
' "Authorization": "Bearer ' + generatedToken.value + '"\n' +
' }\n' +
' }\n' +
' }\n' +
'}'
});
function open(): Promise<void> {
showState.value = true;
currentPassword.value = '';
generating.value = false;
showConfiguration.value = false;
serverUrl.value = '';
generatedToken.value = '';
return new Promise((resolve, reject) => {
resolveFunc = resolve;
rejectFunc = reject;
});
}
function generateToken(): void {
if (generating.value || !currentPassword.value) {
return;
}
generating.value = true;
tokensStore.generateMCPToken({
password: currentPassword.value
}).then(result => {
generating.value = false;
currentPassword.value = '';
serverUrl.value = result.mcpUrl;
generatedToken.value = result.token;
}).catch(error => {
generating.value = false;
if (!error.processed) {
snackbar.value?.showError(error);
}
});
}
function copy(): void {
if (showConfiguration.value) {
copyTextToClipboard(mcpServerConfiguration.value, buttonContainer.value);
} else {
copyTextToClipboard(generatedToken.value, buttonContainer.value);
}
snackbar.value?.showMessage('Data copied');
}
function cancel(): void {
rejectFunc?.();
showState.value = false;
}
function close(): void {
resolveFunc?.();
showState.value = false;
}
defineExpose({
open
});
</script>
src/views/desktop/user/settings/tabs/UserSecuritySettingTab.vue
+16 -1
View File
@@ -68,6 +68,8 @@
<template #title>
<div class="d-flex align-center">
<span>{{ tt('Device & Sessions') }}</span>
<v-btn class="ml-3" density="compact" color="default" variant="outlined"
@click="generateMCPToken">{{ tt('Generate MCP token') }}</v-btn>
<v-btn density="compact" color="default" variant="text" size="24"
class="ml-2" :icon="true" :loading="loadingSession" @click="reloadSessions(false)">
<template #loader>
@@ -106,7 +108,7 @@
v-for="session in sessions">
<td class="text-sm">
<v-icon start :icon="session.icon"/>
{{ tt(session.isCurrent ? 'Current' : 'Other Device') }}
{{ session.deviceType === 'mcp' ? 'MCP' : (tt(session.isCurrent ? 'Current' : 'Other Device')) }}
</td>
<td class="text-sm">{{ session.deviceInfo }}</td>
<td class="text-sm">{{ session.lastSeenDateTime }}</td>
@@ -124,12 +126,14 @@
</v-col>
</v-row>
<user-generate-m-c-p-token-dialog ref="generateMCPTokenDialog" />
<confirm-dialog ref="confirmDialog"/>
<snack-bar ref="snackbar" />
</template>
<script setup lang="ts">
import { VTextField } from 'vuetify/components/VTextField';
import UserGenerateMCPTokenDialog from '@/views/desktop/user/settings/dialogs/UserGenerateMCPTokenDialog.vue';
import ConfirmDialog from '@/components/desktop/ConfirmDialog.vue';
import SnackBar from '@/components/desktop/SnackBar.vue';
@@ -152,6 +156,7 @@ import {
mdiTablet,
mdiWatch,
mdiTelevision,
mdiMagicStaff,
mdiConsole,
mdiDevices
} from '@mdi/js';
@@ -167,6 +172,7 @@ class DesktopPageSessionInfo extends SessionInfo {
}
}
type UserGenerateMCPTokenDialogType = InstanceType<typeof UserGenerateMCPTokenDialog>;
type ConfirmDialogType = InstanceType<typeof ConfirmDialog>;
type SnackBarType = InstanceType<typeof SnackBar>;
@@ -178,6 +184,7 @@ const tokensStore = useTokensStore();
const newPasswordInput = useTemplateRef<VTextField>('newPasswordInput');
const confirmPasswordInput = useTemplateRef<VTextField>('confirmPasswordInput');
const generateMCPTokenDialog = useTemplateRef<UserGenerateMCPTokenDialogType>('generateMCPTokenDialog');
const confirmDialog = useTemplateRef<ConfirmDialogType>('confirmDialog');
const snackbar = useTemplateRef<SnackBarType>('snackbar');
@@ -229,6 +236,8 @@ function getTokenIcon(deviceType: string): string {
return mdiTablet;
} else if (deviceType === 'tv') {
return mdiTelevision;
} else if (deviceType === 'mcp') {
return mdiMagicStaff;
} else if (deviceType === 'cli') {
return mdiConsole;
} else {
@@ -288,6 +297,12 @@ function updatePassword(): void {
});
}
function generateMCPToken(): void {
generateMCPTokenDialog.value?.open().then(() => {
reloadSessions(true);
});
}
function reloadSessions(silent?: boolean): void {
loadingSession.value = true;