添加测试
This commit is contained in:
parent
868b7cda6b
commit
b642894e9e
@ -12,3 +12,6 @@ vsc-extension-quickstart.md
|
||||
**/*.map
|
||||
**/*.ts
|
||||
**/.vscode-test.*
|
||||
app/**
|
||||
backend/**
|
||||
test/**
|
75
README.md
75
README.md
@ -1,71 +1,14 @@
|
||||
# openmcp README
|
||||
## OpenMCP
|
||||
|
||||
This is the README for your extension "openmcp". After writing up a brief description, we recommend including the following sections.
|
||||
一款用于 MCP 服务端调试的一体化 vscode 插件。
|
||||
|
||||
## Features
|
||||
- 包含原版 Inpsector 的所有功能
|
||||
- 包含一个简易的用于进行测试的大模型对话 & 执行窗口
|
||||
- 支持多种大模型
|
||||
|
||||
Describe specific features of your extension including screenshots of your extension in action. Image paths are relative to this README file.
|
||||
|
||||
For example if there is an image subfolder under your extension project workspace:
|
||||
## Dev
|
||||
|
||||
\!\[feature X\]\(images/feature-x.png\)
|
||||
|
||||
> Tip: Many popular extensions utilize animations. This is an excellent way to show off your extension! We recommend short, focused animations that are easy to follow.
|
||||
|
||||
## Requirements
|
||||
|
||||
If you have any requirements or dependencies, add a section describing those and how to install and configure them.
|
||||
|
||||
## Extension Settings
|
||||
|
||||
Include if your extension adds any VS Code settings through the `contributes.configuration` extension point.
|
||||
|
||||
For example:
|
||||
|
||||
This extension contributes the following settings:
|
||||
|
||||
* `myExtension.enable`: Enable/disable this extension.
|
||||
* `myExtension.thing`: Set to `blah` to do something.
|
||||
|
||||
## Known Issues
|
||||
|
||||
Calling out known issues can help limit users opening duplicate issues against your extension.
|
||||
|
||||
## Release Notes
|
||||
|
||||
Users appreciate release notes as you update your extension.
|
||||
|
||||
### 1.0.0
|
||||
|
||||
Initial release of ...
|
||||
|
||||
### 1.0.1
|
||||
|
||||
Fixed issue #.
|
||||
|
||||
### 1.1.0
|
||||
|
||||
Added features X, Y, and Z.
|
||||
|
||||
---
|
||||
|
||||
## Following extension guidelines
|
||||
|
||||
Ensure that you've read through the extensions guidelines and follow the best practices for creating your extension.
|
||||
|
||||
* [Extension Guidelines](https://code.visualstudio.com/api/references/extension-guidelines)
|
||||
|
||||
## Working with Markdown
|
||||
|
||||
You can author your README using Visual Studio Code. Here are some useful editor keyboard shortcuts:
|
||||
|
||||
* Split the editor (`Cmd+\` on macOS or `Ctrl+\` on Windows and Linux).
|
||||
* Toggle preview (`Shift+Cmd+V` on macOS or `Shift+Ctrl+V` on Windows and Linux).
|
||||
* Press `Ctrl+Space` (Windows, Linux, macOS) to see a list of Markdown snippets.
|
||||
|
||||
## For more information
|
||||
|
||||
* [Visual Studio Code's Markdown Support](http://code.visualstudio.com/docs/languages/markdown)
|
||||
* [Markdown Syntax Reference](https://help.github.com/articles/markdown-basics/)
|
||||
|
||||
**Enjoy!**
|
||||
- `app`: 前端 UI 的定义
|
||||
- `test`: 测试 `app` 的部分,包含一个简易的转发层
|
||||
- `src`: vscode 插件端定义
|
2
app/package-lock.json
generated
2
app/package-lock.json
generated
@ -11,7 +11,7 @@
|
||||
"core-js": "^3.8.3",
|
||||
"element-plus": "^2.9.7",
|
||||
"vue": "^3.2.13",
|
||||
"vue-i18n": "^11.1.2",
|
||||
"vue-i18n": "^11.1.0",
|
||||
"vue-router": "^4.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
@ -11,7 +11,7 @@
|
||||
"core-js": "^3.8.3",
|
||||
"element-plus": "^2.9.7",
|
||||
"vue": "^3.2.13",
|
||||
"vue-i18n": "^11.1.2",
|
||||
"vue-i18n": "^11.1.0",
|
||||
"vue-router": "^4.0.3"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
@ -20,6 +20,8 @@ export function setDefaultCss() {
|
||||
document.body.style.setProperty('--el-color-info-light-8', 'var(--main-color)');
|
||||
document.body.style.setProperty('--el-fill-color-light', 'var(--sidebar-item-selected)');
|
||||
document.body.style.setProperty('--el-color-primary-dark-2', 'var(--main-light-color)');
|
||||
document.body.style.setProperty('--el-fill-color-dark', 'var(--main-light-color)');
|
||||
document.body.style.setProperty('--el-fill-color-darker', 'var(--main-light-color)');
|
||||
// document.body.style.setProperty('--el-color-white', 'var(--background)');
|
||||
|
||||
// 设置全局宏
|
||||
|
@ -1,42 +1,29 @@
|
||||
<template>
|
||||
<div class="setting-section">
|
||||
<h2>{{ t('general-setting') }}</h2>
|
||||
<h2>{{ t('appearance-setting') }}</h2>
|
||||
<div class="setting-option">
|
||||
<span>
|
||||
<span class="iconfont icon-i18n"></span>
|
||||
<span class="option-title">{{ t('language-setting') }}</span>
|
||||
<span class="option-title">
|
||||
<span class="iconfont icon-bg-colors"></span>
|
||||
|
||||
{{ t('setting.general-color-setting') }}
|
||||
</span>
|
||||
<div style="width: 100px;">
|
||||
<el-select name="language-setting" class="language-setting" v-model="locale" @change="onlanguagechange">
|
||||
<el-option v-for="option in languageSetting.options" :value="option.value" :label="option.text"
|
||||
:key="option.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="option-group">
|
||||
<div style="height: 20px; width: 20px;"></div>
|
||||
<el-color-picker v-model="colorManager.mainColor" @change="onGeneralColorChange"
|
||||
:predefine="predefinedColors" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { languageSetting } from './language';
|
||||
import { defineComponent } from 'vue';
|
||||
import { colorManager, onGeneralColorChange, predefinedColors } from './color';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { globalSetting } from '@/hook/global';
|
||||
|
||||
defineComponent({ name: 'appearance' });
|
||||
defineComponent({ name: 'general' });
|
||||
const { t } = useI18n();
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
locale.value = globalSetting.language;
|
||||
|
||||
const currentLanguage = ref('简体中文');
|
||||
|
||||
function onlanguagechange(code: string) {
|
||||
const option = languageSetting.options.find(item => item.value === code);
|
||||
if (option) {
|
||||
currentLanguage.value = option.text;
|
||||
}
|
||||
// languageDialogShow.value = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
@ -1,29 +1,42 @@
|
||||
<template>
|
||||
<div class="setting-section">
|
||||
<h2>{{ t('appearance-setting') }}</h2>
|
||||
<h2>{{ t('general-setting') }}</h2>
|
||||
<div class="setting-option">
|
||||
<span class="option-title">
|
||||
<span class="iconfont icon-bg-colors"></span>
|
||||
|
||||
{{ t('setting.general-color-setting') }}
|
||||
<span>
|
||||
<span class="iconfont icon-i18n"></span>
|
||||
<span class="option-title">{{ t('language-setting') }}</span>
|
||||
</span>
|
||||
<div class="option-group">
|
||||
<div style="height: 20px; width: 20px;"></div>
|
||||
<el-color-picker v-model="colorManager.mainColor" @change="onGeneralColorChange"
|
||||
:predefine="predefinedColors" />
|
||||
<div style="width: 100px;">
|
||||
<el-select name="language-setting" class="language-setting" v-model="locale" @change="onlanguagechange">
|
||||
<el-option v-for="option in languageSetting.options" :value="option.value" :label="option.text"
|
||||
:key="option.value">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { colorManager, onGeneralColorChange, predefinedColors } from './color';
|
||||
import { defineComponent, ref } from 'vue';
|
||||
import { languageSetting } from './language';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { globalSetting } from '@/hook/global';
|
||||
|
||||
defineComponent({ name: 'general' });
|
||||
const { t } = useI18n();
|
||||
defineComponent({ name: 'appearance' });
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
locale.value = globalSetting.language;
|
||||
|
||||
const currentLanguage = ref('简体中文');
|
||||
|
||||
function onlanguagechange(code: string) {
|
||||
const option = languageSetting.options.find(item => item.value === code);
|
||||
if (option) {
|
||||
currentLanguage.value = option.text;
|
||||
}
|
||||
// languageDialogShow.value = true;
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
@ -1,8 +1,26 @@
|
||||
<template>
|
||||
<div class="setting-container">
|
||||
<General></General>
|
||||
<Api></Api>
|
||||
<Appearance></Appearance>
|
||||
<div>
|
||||
<el-segmented
|
||||
v-model="settingSections.current"
|
||||
:options="settingSections.data"
|
||||
size="large"
|
||||
style="margin: 10px; font-size: 16px; background-color: var(--background);"
|
||||
>
|
||||
<template #default="scope">
|
||||
<div class="setting-section-option">
|
||||
{{ scope.item.label }}
|
||||
</div>
|
||||
</template>
|
||||
</el-segmented>
|
||||
<div>
|
||||
|
||||
<General v-show="settingSections.current === 'general'"></General>
|
||||
<Api v-show="settingSections.current === 'api'"></Api>
|
||||
<Appearance v-show="settingSections.current === 'appearance'"></Appearance>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -14,6 +32,7 @@ import { colorManager } from './color';
|
||||
import General from './general.vue';
|
||||
import Api from './api.vue';
|
||||
import Appearance from './appearance.vue';
|
||||
import { settingSections } from './setting-section';
|
||||
|
||||
defineComponent({ name: 'setting' });
|
||||
|
||||
@ -21,6 +40,8 @@ onMounted(() => {
|
||||
colorManager.initColor();
|
||||
});
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
@ -43,6 +64,11 @@ onMounted(() => {
|
||||
border-radius: .5em .5em 0 0;
|
||||
}
|
||||
|
||||
.setting-section-option {
|
||||
padding: 10px;
|
||||
|
||||
}
|
||||
|
||||
.setting-container .el-scrollbar {
|
||||
width: 400px;
|
||||
user-select: none;
|
||||
|
23
app/src/views/setting/setting-section.ts
Normal file
23
app/src/views/setting/setting-section.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { reactive } from 'vue';
|
||||
|
||||
import I18n from '@/i18n/index';
|
||||
|
||||
const { t } = I18n.global;
|
||||
|
||||
export const settingSections = reactive({
|
||||
current: 'api',
|
||||
data: [
|
||||
{
|
||||
value: 'api',
|
||||
label: 'API'
|
||||
},
|
||||
{
|
||||
value: 'general',
|
||||
label: t('general-setting')
|
||||
},
|
||||
{
|
||||
value: 'appearance',
|
||||
label: t('appearance-setting')
|
||||
}
|
||||
]
|
||||
});
|
Loading…
x
Reference in New Issue
Block a user