插件分类
-
- {{ item.title }} （{{ extensionService.extensionIDs.length }}）
+
+
+
+
-
+
diff --git a/src/workbench/browser/src/app/pages/extension/extension.component.scss b/src/workbench/browser/src/app/pages/extension/extension.component.scss
index cf6fa219..9b09b9a5 100644
--- a/src/workbench/browser/src/app/pages/extension/extension.component.scss
+++ b/src/workbench/browser/src/app/pages/extension/extension.component.scss
@@ -1,10 +1,50 @@
-.main {
+::ng-deep .main {
height: 100%;
width: 100%;
display: flex;
+ .input {
+ height: 30px;
+ border: none;
+ background-color: rgba(0,0,0,0.05);
+ border-radius: 3px;
+ &::placeholder {
+ color: rgba(0,0,0,0.5);
+ font-size: 0.9em;
+ }
+ }
+ .tree_node {
+ font-size: 12px;
+ }
+ .ant-tree .ant-tree-treenode {
+ padding: 0;
+ margin: 2px 0;
+ border-radius: 3px;
+ transition: all 0.3s, border 0s, line-height 0s, box-shadow 0s;
+ &:hover {
+ background-color: #f5f5f5;
+ }
+ }
+ .ant-tree-treenode-selected {
+ background-color: var(--NAVBAR_BTN_BG);
+ }
+ .ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected {
+ background-color: transparent;
+ transition: none;
+ }
+ .ant-tree .ant-tree-node-content-wrapper{
+ border-radius: 0;
+ &.ant-tree-node-selected {
+ opacity: .8;
+ }
+ }
+
+ .ant-tree-switcher {
+ width: 0;
+ }
+
.left {
- background: #f8f8f8;
+ border-right: 1px solid #f8f8f8;
width: 250px;
padding: 10px;
diff --git a/src/workbench/browser/src/app/pages/extension/extension.component.ts b/src/workbench/browser/src/app/pages/extension/extension.component.ts
index 10aa41f2..5308c97c 100644
--- a/src/workbench/browser/src/app/pages/extension/extension.component.ts
+++ b/src/workbench/browser/src/app/pages/extension/extension.component.ts
@@ -1,5 +1,10 @@
import { Component, OnInit } from '@angular/core';
-import { Router } from '@angular/router';
+import { ActivatedRoute, NavigationEnd, Router } from '@angular/router';
+import { ElectronService } from 'eo/workbench/browser/src/app/core/services';
+import { GroupTreeItem } from 'eo/workbench/browser/src/app/shared/models';
+import { MessageService } from 'eo/workbench/browser/src/app/shared/services/message';
+import { NzFormatEmitEvent, NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/tree';
+import { filter, Subject } from 'rxjs';
import { ExtensionGroupType } from './extension.model';
import { ExtensionService } from './extension.service';
@@ -9,24 +14,34 @@ import { ExtensionService } from './extension.service';
styleUrls: ['./extension.component.scss'],
})
export class ExtensionComponent implements OnInit {
- groups = [
+ keyword = '';
+ nzSelectedKeys: (number | string)[] = [];
+ treeNodes: NzTreeNodeOptions[] = [
{
- id: 'all',
- title: '全部插件',
- },
- {
- id: 'official',
- title: '官方插件',
- },
- {
- id: 'installed',
- title: '已安装',
- showNum: true
+ key: 'official',
+ title: $localize`Official`,
+ isLeaf: true,
},
];
- selectGroup: ExtensionGroupType|string = ExtensionGroupType.all;
- constructor(public extensionService: ExtensionService, private router: Router) {
- }
+ fixedTreeNode: GroupTreeItem[] | NzTreeNode[] = [
+ {
+ title: $localize`All`,
+ key: 'all',
+ weight: 0,
+ parentID: '0',
+ isLeaf: true,
+ isFixed: true,
+ },
+ ];
+ selectGroup: ExtensionGroupType | string = ExtensionGroupType.all;
+
+ constructor(
+ public extensionService: ExtensionService,
+ private router: Router,
+ public electron: ElectronService,
+ private route: ActivatedRoute,
+ private messageService: MessageService
+ ) {}
clickGroup(id) {
this.selectGroup = id;
this.router
@@ -35,5 +50,46 @@ export class ExtensionComponent implements OnInit {
})
.finally();
}
- ngOnInit(): void {}
+ ngOnInit(): void {
+ this.watchRouterChange();
+ this.setSelectedKeys();
+ }
+
+ onSeachChange(keyword) {
+ this.messageService.send({ type: 'searchPluginByKeyword', data: keyword });
+ }
+
+ private watchRouterChange() {
+ this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe((res: any) => {
+ this.setSelectedKeys();
+ });
+ }
+
+ /**
+ * Group tree item click.
+ *
+ * @param event
+ */
+ clickTreeItem(event: NzFormatEmitEvent): void {
+ const eventName = event.node?.origin.isFixed ? 'clickFixedItem' : 'clickItem';
+
+ switch (eventName) {
+ case 'clickFixedItem': {
+ this.clickGroup(event.node.key);
+ break;
+ }
+ case 'clickItem': {
+ this.clickGroup(event.node.key);
+ break;
+ }
+ }
+ }
+
+ private setSelectedKeys() {
+ if (this.route.snapshot.queryParams.type) {
+ this.nzSelectedKeys = [this.route.snapshot.queryParams.type];
+ } else {
+ this.nzSelectedKeys = [this.fixedTreeNode[0].key];
+ }
+ }
}
diff --git a/src/workbench/browser/src/app/pages/extension/extension.module.ts b/src/workbench/browser/src/app/pages/extension/extension.module.ts
index 63e256d9..93f44de1 100644
--- a/src/workbench/browser/src/app/pages/extension/extension.module.ts
+++ b/src/workbench/browser/src/app/pages/extension/extension.module.ts
@@ -14,11 +14,30 @@ import { NzInputModule } from 'ng-zorro-antd/input';
import { NzTabsModule } from 'ng-zorro-antd/tabs';
import { NzDescriptionsModule } from 'ng-zorro-antd/descriptions';
import { NzTagModule } from 'ng-zorro-antd/tag';
-
+import { NzDividerModule } from 'ng-zorro-antd/divider';
+import { NzTreeModule } from 'ng-zorro-antd/tree';
+import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
+import { NzSkeletonModule } from 'ng-zorro-antd/skeleton';
+import { SharedModule } from 'eo/workbench/browser/src/app/shared/shared.module';
@NgModule({
- imports: [FormsModule,NzTabsModule,NzTagModule,NzDescriptionsModule,NzInputModule,NzButtonModule,NzIconModule,ExtensionRoutingModule, CommonModule],
- providers:[ExtensionService],
+ imports: [
+ SharedModule,
+ FormsModule,
+ NzTabsModule,
+ NzTagModule,
+ NzDescriptionsModule,
+ NzInputModule,
+ NzButtonModule,
+ NzIconModule,
+ ExtensionRoutingModule,
+ CommonModule,
+ NzDividerModule,
+ NzTreeModule,
+ NzDropDownModule,
+ NzSkeletonModule,
+ ],
+ providers: [ExtensionService],
declarations: [ExtensionComponent, ExtensionListComponent, ExtensionDetailComponent],
})
export class ExtensionModule {}
diff --git a/src/workbench/browser/src/app/pages/extension/extension.service.ts b/src/workbench/browser/src/app/pages/extension/extension.service.ts
index 0ca5d3dc..892613b4 100644
--- a/src/workbench/browser/src/app/pages/extension/extension.service.ts
+++ b/src/workbench/browser/src/app/pages/extension/extension.service.ts
@@ -1,5 +1,6 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
+import { isElectron } from 'eo/shared/common/common';
import { lastValueFrom } from 'rxjs';
import { ModuleInfo } from '../../utils/module-loader';
import { EoExtensionInfo } from './extension.model';
@@ -14,7 +15,7 @@ export class ExtensionService {
this.getInstalledList();
}
getInstalledList() {
- this.localModules = window.eo.getModules();
+ this.localModules = window.eo?.getModules() || new Map();
this.updateExtensionIDs();
}
public async requestList() {
diff --git a/src/workbench/browser/src/app/pages/extension/list/extension-list.component.html b/src/workbench/browser/src/app/pages/extension/list/extension-list.component.html
index 31a13e29..1db01216 100644
--- a/src/workbench/browser/src/app/pages/extension/list/extension-list.component.html
+++ b/src/workbench/browser/src/app/pages/extension/list/extension-list.component.html
@@ -1,51 +1,24 @@
+
+
+
+
+
+
+
+
+
+
+ {{ node.title }}
+
+
+
+
+
+
+
+
+ {{ node.origin.method }}
+
+ {{ node.title }}
+
+
- = new Subject();
- constructor(public extensionService: ExtensionService, private route: ActivatedRoute, private router: Router) {
+ private destroy$: Subject = new Subject();
+
+ constructor(
+ public extensionService: ExtensionService,
+ private route: ActivatedRoute,
+ private router: Router,
+ private messageService: MessageService
+ ) {
this.type = this.route.snapshot.queryParams.type;
this.seachChanged$.pipe(debounceTime(500), distinctUntilChanged()).subscribe(async (keyword) => {
this.renderList = await this.searchPlugin(keyword);
@@ -32,6 +42,7 @@ export class ExtensionListComponent implements OnInit {
}
async ngOnInit() {
this.watchSearchConditionChange();
+ this.watchSearchKeywordChange();
}
async searchPlugin(keyword = '') {
if (this.type === 'installed') {
@@ -54,7 +65,12 @@ export class ExtensionListComponent implements OnInit {
clickExtension(item) {
this.router
.navigate(['home/extension/detail'], {
- queryParams: { id: item.moduleID, name: item.name, jump: 'setting' },
+ queryParams: {
+ type: this.route.snapshot.queryParams.type,
+ id: item.moduleID,
+ name: item.name,
+ jump: 'setting',
+ },
})
.finally();
}
@@ -64,4 +80,18 @@ export class ExtensionListComponent implements OnInit {
this.renderList = await this.searchPlugin();
});
}
+
+ private watchSearchKeywordChange() {
+ this.messageService
+ .get()
+ .pipe(takeUntil(this.destroy$))
+ .subscribe((inArg: Message) => {
+ switch (inArg.type) {
+ case 'searchPluginByKeyword': {
+ this.onSeachChange(inArg.data);
+ break;
+ }
+ }
+ });
+ }
}
diff --git a/src/workbench/browser/src/app/pages/navbar/navbar.component.html b/src/workbench/browser/src/app/pages/navbar/navbar.component.html
new file mode 100644
index 00000000..6faafc2c
--- /dev/null
+++ b/src/workbench/browser/src/app/pages/navbar/navbar.component.html
@@ -0,0 +1,56 @@
+;
- resourceInfo = [
- {
- id: 'win',
- name: 'Windows 客户端',
- icon: 'windows',
- keyword: 'Setup',
- suffix: 'exe',
- link: '',
- },
- {
- id: 'mac',
- name: 'macOS(Intel) 客户端',
- icon: 'mac',
- suffix: 'dmg',
- link: '',
- },
- {
- id: 'mac',
- name: 'macOS(M1) 客户端',
- icon: 'mac',
- suffix: 'arm64.dmg',
- link: '',
- },
- ];
+ resourceInfo = ResourceInfo;
constructor(
private electron: ElectronService,
@@ -124,6 +102,10 @@ export class NavbarComponent implements OnInit {
}
}
+ handleShowModal() {
+ this.isSettingVisible = true;
+ }
+
/**
* switch data
*/
diff --git a/src/workbench/browser/src/app/pages/navbar/navbar.module.ts b/src/workbench/browser/src/app/pages/navbar/navbar.module.ts
new file mode 100644
index 00000000..b393fff4
--- /dev/null
+++ b/src/workbench/browser/src/app/pages/navbar/navbar.module.ts
@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
+import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
+import { NavbarComponent } from 'eo/workbench/browser/src/app/pages/navbar/navbar.component';
+import { SettingModule } from 'eo/workbench/browser/src/app/shared/components/setting/setting.module';
+import { CommonModule } from '@angular/common';
+import { SharedModule } from 'eo/workbench/browser/src/app/shared/shared.module';
+
+@NgModule({
+ imports: [CommonModule, NzDropDownModule, NzToolTipModule, SettingModule, SharedModule],
+ declarations: [NavbarComponent],
+ exports: [NavbarComponent],
+})
+export class NavbarModule {}
diff --git a/src/workbench/browser/src/app/pages/pages-routing.module.ts b/src/workbench/browser/src/app/pages/pages-routing.module.ts
index f3dd6436..2c8caf36 100644
--- a/src/workbench/browser/src/app/pages/pages-routing.module.ts
+++ b/src/workbench/browser/src/app/pages/pages-routing.module.ts
@@ -3,7 +3,6 @@ import { NgModule } from '@angular/core';
import { PagesComponent } from './pages.component';
import { PageBlankComponent } from '../shared/components/page-blank/page-blank.component';
-import { PageFeaturePreviewComponent } from '../shared/components/page-feature-preview/page-feature-preview.component';
const routes: Routes = [
{
path: '',
@@ -18,10 +17,6 @@ const routes: Routes = [
path: 'blank',
component: PageBlankComponent,
},
- {
- path: 'preview',
- component: PageFeaturePreviewComponent,
- },
{
path: 'api',
loadChildren: () => import('./api/api.module').then((m) => m.ApiModule),
diff --git a/src/workbench/browser/src/app/pages/pages.component.html b/src/workbench/browser/src/app/pages/pages.component.html
index ca5e8d8d..1fe2b581 100644
--- a/src/workbench/browser/src/app/pages/pages.component.html
+++ b/src/workbench/browser/src/app/pages/pages.component.html
@@ -2,19 +2,29 @@
= new Subject();
+ private rawChange$: Subject = new Subject();
get isShowNotification() {
return !this.isRemote && this.isShow;
}
@@ -35,11 +35,15 @@ export class PagesComponent implements OnInit {
public sidebar: SidebarService,
private messageService: MessageService,
private remoteService: RemoteService
- ) {}
+ ) {
+ this.rawChange$.pipe(debounceTime(500), takeUntil(this.destroy$)).subscribe(() => {
+ this.updateState();
+ });
+ }
ngOnInit(): void {
this.watchSidebarItemChange();
this.watchRemoteServerChange();
- this.updateState();
+ this.rawChange$.next('');
}
private watchSidebarItemChange() {
this.sidebar.appChanged$.subscribe(() => {
@@ -48,7 +52,7 @@ export class PagesComponent implements OnInit {
setTimeout(() => {
//add loading
this.loadedIframe = false;
- let iframe = document.getElementById('app_iframe') as HTMLIFrameElement;
+ const iframe = document.getElementById('app_iframe') as HTMLIFrameElement;
//load resource
iframe.src = this.sidebar.currentModule.main;
//loading finish
@@ -65,7 +69,7 @@ export class PagesComponent implements OnInit {
this.remoteService.switchDataSource();
};
- updateState = debounce(async () => {
+ updateState = async () => {
if (!this.isRemote && localStorage.getItem(IS_SHOW_REMOTE_SERVER_NOTIFICATION) !== 'false') {
const [isSuccess] = await this.remoteService.pingRmoteServerUrl();
this.isShow = isSuccess;
@@ -73,7 +77,7 @@ export class PagesComponent implements OnInit {
// if (!) {
// this.isClose = false;
// }
- }, 500);
+ };
private watchRemoteServerChange() {
this.messageService
@@ -82,7 +86,7 @@ export class PagesComponent implements OnInit {
.subscribe((inArg: Message) => {
switch (inArg.type) {
case 'onDataSourceChange': {
- this.updateState();
+ this.rawChange$.next(inArg.type);
break;
}
}
diff --git a/src/workbench/browser/src/app/pages/pages.module.ts b/src/workbench/browser/src/app/pages/pages.module.ts
index e0dea024..203d38ff 100644
--- a/src/workbench/browser/src/app/pages/pages.module.ts
+++ b/src/workbench/browser/src/app/pages/pages.module.ts
@@ -5,10 +5,11 @@ import { SettingModule } from '../shared/components/setting/setting.module';
import { PagesComponent } from './pages.component';
import { SharedModule } from '../shared/shared.module';
import { NzIconModule } from 'ng-zorro-antd/icon';
+import { NavbarModule } from 'eo/workbench/browser/src/app/pages/navbar/navbar.module';
@NgModule({
+ imports: [PagesRoutingModule, SettingModule, CommonModule, SharedModule, NzIconModule, NavbarModule],
declarations: [PagesComponent],
- imports: [PagesRoutingModule, SettingModule, CommonModule, SharedModule, NzIconModule],
exports: [],
})
export class PagesModule {}
diff --git a/src/workbench/browser/src/app/shared/components/about/about.component.html b/src/workbench/browser/src/app/shared/components/about/about.component.html
deleted file mode 100644
index 9bd75a7d..00000000
--- a/src/workbench/browser/src/app/shared/components/about/about.component.html
+++ /dev/null
@@ -1,5 +0,0 @@
-;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [AboutComponent],
- }).compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(AboutComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
diff --git a/src/workbench/browser/src/app/shared/components/about/about.component.ts b/src/workbench/browser/src/app/shared/components/about/about.component.ts
deleted file mode 100644
index 69963e54..00000000
--- a/src/workbench/browser/src/app/shared/components/about/about.component.ts
+++ /dev/null
@@ -1,104 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { ElectronService } from '../../../core/services';
-import pkg from '../../../../../../../../package.json';
-
-const dependencies = {
- ...pkg.dependencies,
- ...pkg.devDependencies,
-} as const;
-
-type DescriptionsItem = {
- readonly id: string;
- readonly label: string;
- value: string;
-};
-
-const descriptions: DescriptionsItem[] = [
- {
- id: 'version',
- label: '当前版本号',
- value: pkg.version,
- },
- {
- id: 'publishTime',
- label: '发布日期',
- value: '',
- },
- {
- id: 'homeDir',
- label: '安装目录',
- value: '',
- },
- {
- id: 'electron',
- label: 'Electron',
- value: '',
- },
- {
- id: 'chrome',
- label: 'Chromium',
- value: '',
- },
- {
- id: 'node',
- label: 'Node.js',
- value: '',
- },
- {
- id: 'v8',
- label: 'V8',
- value: '',
- },
- {
- id: 'os',
- label: 'OS',
- value: '',
- },
-];
-
-@Component({
- selector: 'eo-about',
- templateUrl: './about.component.html',
- styleUrls: ['./about.component.scss'],
-})
-export class AboutComponent implements OnInit {
- list = descriptions;
-
- constructor(private electron: ElectronService) {}
-
- ngOnInit(): void {
- fetch('https://api.github.com/repos/eolinker/eoapi/releases')
- .then((response) => response.json())
- .then((data) => {
- const publishTime = data.find((n) => n.tag_name.slice(1) === pkg.version)?.published_at;
- const publishObj = this.list.find((n) => n.id === 'publishTime');
- if (publishTime) {
- publishObj.value = new Intl.DateTimeFormat('zh-CN', {
- year: 'numeric',
- month: '2-digit',
- weekday: 'long',
- day: '2-digit',
- hour: '2-digit',
- minute: '2-digit',
- second: '2-digit',
- hour12: false,
- })
- .format(new Date(publishTime))
- .replace(/星期[^]?/, '');
- } else {
- publishObj.value = `当前版本(v${pkg.version})尚未发布`;
- }
- });
- const systemInfo = this.getSystemInfo();
- this.list.forEach((item) => {
- if (item.id in systemInfo) {
- item.value = systemInfo[item.id];
- }
- });
- }
-
- getSystemInfo() {
- const systemInfo = this.electron.ipcRenderer.sendSync('get-system-info');
- return systemInfo;
- }
-}
diff --git a/src/workbench/browser/src/app/shared/components/env/env.component.html b/src/workbench/browser/src/app/shared/components/env/env.component.html
index 08b50706..383e6509 100644
--- a/src/workbench/browser/src/app/shared/components/env/env.component.html
+++ b/src/workbench/browser/src/app/shared/components/env/env.component.html
@@ -1,54 +1,50 @@
-
-
-
-
-
-
-
-
-
-
-
-
+
+
diff --git a/src/workbench/browser/src/app/pages/extension/list/extension-list.component.ts b/src/workbench/browser/src/app/pages/extension/list/extension-list.component.ts
index 67e6de2b..a7bb4946 100644
--- a/src/workbench/browser/src/app/pages/extension/list/extension-list.component.ts
+++ b/src/workbench/browser/src/app/pages/extension/list/extension-list.component.ts
@@ -1,6 +1,8 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
-import { debounceTime, distinctUntilChanged, lastValueFrom, Subject } from 'rxjs';
+import { isElectron } from 'eo/shared/common/common';
+import { Message, MessageService } from 'eo/workbench/browser/src/app/shared/services/message';
+import { debounceTime, distinctUntilChanged, takeUntil, Subject } from 'rxjs';
import { ExtensionGroupType } from '../extension.model';
import { ExtensionService } from '../extension.service';
class ExtensionList {
@@ -10,7 +12,7 @@ class ExtensionList {
}
search(keyword: string) {
return this.list.filter(
- (it) => it.moduleID.includes(keyword) || it.name.includes(keyword) || it.keywords.includes(keyword)
+ (it) => it.moduleID.includes(keyword) || it.name.includes(keyword) || it.keywords?.includes(keyword)
);
}
}
@@ -23,8 +25,16 @@ export class ExtensionListComponent implements OnInit {
type: ExtensionGroupType = ExtensionGroupType.all;
keyword = '';
renderList = [];
+ isElectron = isElectron();
seachChanged$: Subject
-
- 已安装
- 未安装
-
-
-
- {{ it.moduleName }}
- {{ it.author }}
- {{ it.description }}
+ class="bd_all w-full min-h-[140px] p-5 rounded-lg flex flex-col flex-wrap items-center plugin-block hover:border-green-700 hover:shadow-lg transition-shadow duration-300"
+ *ngFor="let it of renderList" (click)="clickExtension(it)">
+
+
+
+
+
+ {{ it.moduleName }}
+ {{ it.author }}
+ {{ it.description }}
+
+
+ Installed
+
+
+
+
+ 
+
+ 
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+-
+ Document
+
+ Report Issue
+
+
+
+
+
+
+
+
+
+
+
+
+ Download
+ -
+
- 目前数据储存在{{dataSourceText}}，如需协作请切换
- {{ isRemote ? '本地' : '远程' }}数据源
-
+ Current data storage exists{{ dataSourceText }},please switch if you want to collaborate
+ {{ isRemote ? 'Remote Server' : 'Localhost' }} Data Storage
+
-
- {{item.value}}
-
-
diff --git a/src/workbench/browser/src/app/shared/components/about/about.component.scss b/src/workbench/browser/src/app/shared/components/about/about.component.scss
deleted file mode 100644
index 008b0f40..00000000
--- a/src/workbench/browser/src/app/shared/components/about/about.component.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-.about ::ng-deep .ant-descriptions-item-label {
- width: 84px;
- position: relative;
- &::after {
- position: absolute;
- right: 0;
- }
-}
diff --git a/src/workbench/browser/src/app/shared/components/about/about.component.spec.ts b/src/workbench/browser/src/app/shared/components/about/about.component.spec.ts
deleted file mode 100644
index 1c435a01..00000000
--- a/src/workbench/browser/src/app/shared/components/about/about.component.spec.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AboutComponent } from './about.component';
-
-describe('AboutComponent', () => {
- let component: AboutComponent;
- let fixture: ComponentFixture
-
-
- {{ item.name }}
-
-
-
-
-
- 新建环境
-
-
+
+
-
- ) => {
if (file.type !== 'application/json') {
- this.message.error('仅支持上传 JSON 格式的文件');
+ this.message.error($localize `Only files in JSON format are supported`);
observer.complete();
}
parserJsonFile(file).then((result: { name: string }) => {
diff --git a/src/workbench/browser/src/app/shared/components/index.ts b/src/workbench/browser/src/app/shared/components/index.ts
index 8d94c677..b137abca 100644
--- a/src/workbench/browser/src/app/shared/components/index.ts
+++ b/src/workbench/browser/src/app/shared/components/index.ts
@@ -1,6 +1,5 @@
export * from './toolbar/toolbar.component';
export * from './toolbar/select-theme/select-theme.component';
export * from './sidebar/sidebar.component';
-export * from './navbar/navbar.component';
export * from './page-not-found/page-not-found.component';
-export * from './about/about.component';
+// export * from './about/about.component';
diff --git a/src/workbench/browser/src/app/shared/components/navbar/navbar.component.html b/src/workbench/browser/src/app/shared/components/navbar/navbar.component.html
deleted file mode 100644
index ac8887bb..00000000
--- a/src/workbench/browser/src/app/shared/components/navbar/navbar.component.html
+++ /dev/null
@@ -1,58 +0,0 @@
-
-
diff --git a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.scss b/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.scss
deleted file mode 100644
index 376fb5d1..00000000
--- a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.scss
+++ /dev/null
@@ -1,27 +0,0 @@
-.card {
- width: 160px;
- height: 160px;
- box-shadow: 0 0 10px rgba(0,0,0,0.1);
- border-radius: 4px;
- cursor: pointer;
- color: #00785a;
- i {
- &.relative {
- transition: all 0.3s ease;
- z-index: 10;
- opacity: 1;
- }
- &.absolute {
- opacity: 0;
- }
-
- }
- &:hover {
- i.relative {
- opacity: 0;
- }
- i.absolute {
- opacity: 1;
- }
- }
-}
\ No newline at end of file
diff --git a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.spec.ts b/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.spec.ts
deleted file mode 100644
index 362fe451..00000000
--- a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.spec.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { PageFeaturePreviewComponent } from './page-feature-preview.component';
-
-describe('PageFeaturePreviewComponent', () => {
- let component: PageFeaturePreviewComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ PageFeaturePreviewComponent ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(PageFeaturePreviewComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
diff --git a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.ts b/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.ts
deleted file mode 100644
index f4c4c19f..00000000
--- a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-@Component({
- selector: 'eo-page-feature-preview',
- templateUrl: './page-feature-preview.component.html',
- styleUrls: ['./page-feature-preview.component.scss'],
-})
-export class PageFeaturePreviewComponent implements OnInit {
- resourceInfo = [
- {
- id: 'win',
- name: 'Windows 客户端',
- icon: 'windows',
- keyword: 'Setup',
- suffix: 'exe',
- link: ''
- },
- {
- id: 'mac',
- name: 'macOS(Intel) 客户端',
- icon: 'apple',
- suffix: 'dmg',
- link: ''
- },
- {
- id: 'mac',
- name: 'macOS(M1) 客户端',
- icon: 'apple',
- suffix: 'arm64.dmg',
- link: '',
- },
- ];
-
- constructor() {
- this.getInstaller();
- }
-
- ngOnInit(): void {}
-
- private findLinkInSingleAssets(assets, item) {
- let result = '';
- const assetIndex = assets.findIndex(
- (asset) =>
- new RegExp(`${item.suffix}$`, 'g').test(asset.browser_download_url) &&
- (!item.keyword || asset.browser_download_url.includes(item.keyword))
- );
- if (assetIndex === -1) {
- return result;
- }
- result = assets[assetIndex].browser_download_url;
- assets.splice(assetIndex, 1);
- return result;
- }
-
- private findLink(allAssets, item) {
- let result = '';
- allAssets.some((assets) => {
- result = this.findLinkInSingleAssets(assets, item);
- return result;
- });
- return result;
- }
- getInstaller() {
- fetch('https://api.github.com/repos/eolinker/eoapi/releases')
- .then((response) => response.json())
- .then((data) => {
- [...this.resourceInfo]
- .sort((a1, a2) => a2.suffix.length - a1.suffix.length)
- .forEach((item) => {
- item.link = this.findLink(
- data.map((val) => val.assets),
- item
- );
- });
- });
- }
-}
diff --git a/src/workbench/browser/src/app/shared/components/params-import/params-import.component.html b/src/workbench/browser/src/app/shared/components/params-import/params-import.component.html
index 1cd198f0..d3caac27 100644
--- a/src/workbench/browser/src/app/shared/components/params-import/params-import.component.html
+++ b/src/workbench/browser/src/app/shared/components/params-import/params-import.component.html
@@ -1,11 +1,11 @@
-
-
-
+
+
+
+
+ No plugins are currently installed, go to install
+
+
+
+
+
+
+
+
+
diff --git a/src/workbench/browser/src/app/shared/components/setting/setting.component.ts b/src/workbench/browser/src/app/shared/components/setting/setting.component.ts
index c3bf2505..3c8aee6b 100644
--- a/src/workbench/browser/src/app/shared/components/setting/setting.component.ts
+++ b/src/workbench/browser/src/app/shared/components/setting/setting.component.ts
@@ -1,20 +1,18 @@
-// @ts-nocheck
-import { Component, OnInit } from '@angular/core';
+import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { SelectionModel } from '@angular/cdk/collections';
import { FlatTreeControl } from '@angular/cdk/tree';
import { NzTreeFlatDataSource, NzTreeFlattener } from 'ng-zorro-antd/tree-view';
-import { debounce, cloneDeep } from 'lodash';
import { eoapiSettings } from './eoapi-settings/';
import { Message, MessageService } from '../../../shared/services/message';
-import { Subject, takeUntil } from 'rxjs';
+import { Subject, takeUntil, debounceTime } from 'rxjs';
import { NzMessageService } from 'ng-zorro-antd/message';
-import MarkdownIt from 'markdown-it/dist/markdown-it';
import { RemoteService } from 'eo/workbench/browser/src/app/shared/services/remote/remote.service';
+import { SettingService } from 'eo/workbench/browser/src/app/core/services/settings/settings.service';
+import { Router } from '@angular/router';
interface TreeNode {
name: string;
- title: string;
moduleID?: string;
disabled?: boolean;
children?: TreeNode[];
@@ -34,25 +32,39 @@ interface FlatNode {
styleUrls: ['./setting.component.scss'],
})
export class SettingComponent implements OnInit {
+ @Input() set isShowModal(val) {
+ this.$isShowModal = val;
+ if (val) {
+ this.init();
+ this.remoteServerUrl = this.settings['eoapi-common.remoteServer.url'];
+ this.remoteServerToken = this.settings['eoapi-common.remoteServer.token'];
+ this.oldDataStorage = this.settings['eoapi-common.dataStorage'];
+ } else {
+ // this.handleSave();
+ }
+ }
+ get isShowModal() {
+ return this.$isShowModal;
+ }
+ @Output() isShowModalChange = new EventEmitter();
objectKeys = Object.keys;
- /** 是否远程数据源 */
+ /** Whether the remote data source */
get isRemote() {
return this.remoteService.isRemote;
}
- /** 当前数据源对应的文本 */
+ /** The text corresponding to the current data source */
get dataSourceText() {
return this.remoteService.dataSourceText;
}
- private transformer = (node: TreeNode, level: number): FlatNode => ({
+ private transformer = (node: TreeNode, level: number): FlatNode & TreeNode => ({
...node,
expandable: !!node.children && node.children.length > 0,
name: node.name,
level,
disabled: !!node.disabled,
});
- selectListSelection = new SelectionModel();
- md = new MarkdownIt();
- treeControl: any = new FlatTreeControl(
+ selectListSelection = new SelectionModel();
+ treeControl: any = new FlatTreeControl(
(node) => node.level,
(node) => node.expandable
);
@@ -65,34 +77,52 @@ export class SettingComponent implements OnInit {
);
dataSource = new NzTreeFlatDataSource(this.treeControl, this.treeFlattener);
-
+ switchDataSourceLoading = false;
/** current configuration */
currentConfiguration = [];
- isVisible = false;
+ // ! isVisible = false;
$isShowModal = false;
+ /** current active configure */
/** all configure */
- settings = {};
+ $settings = {};
+
+ set settings(val) {
+ this.$settings = val;
+ this.handleSave();
+ }
+
+ get settings() {
+ return this.$settings;
+ }
+ readonly treeNodes = [
+ {
+ name: $localize`:@@DataSource:Data Storage`,
+ moduleID: 'eoapi-common',
+ },
+ {
+ name: $localize`:@@Language:Language`,
+ moduleID: 'eoapi-language',
+ },
+ {
+ name: $localize`Extensions`,
+ moduleID: 'eoapi-extensions',
+ },
+ {
+ name: $localize`About`,
+ moduleID: 'eoapi-about',
+ },
+ ];
/** local configure */
- localSettings = { settings: {}, nestedSettings: {} };
- /** nested settings */
- nestedSettings = {};
+ localSettings = {};
validateForm!: FormGroup;
/** remote server url */
remoteServerUrl = '';
/** remote server token */
remoteServerToken = '';
+ oldDataStorage = '';
- get isShowModal() {
- return this.$isShowModal;
- }
-
- set isShowModal(val) {
- this.$isShowModal = val;
- if (val) {
- this.init();
- this.remoteServerUrl = this.settings['eoapi-common.remoteServer.url'];
- this.remoteServerToken = this.settings['eoapi-common.remoteServer.token'];
- }
+ get selected() {
+ return this.selectListSelection.selected.at(0)?.moduleID;
}
private destroy$: Subject = new Subject();
@@ -100,10 +130,10 @@ export class SettingComponent implements OnInit {
private fb: FormBuilder,
private messageService: MessageService,
private message: NzMessageService,
- private remoteService: RemoteService
- ) {
- this.customLinkRender();
- }
+ private remoteService: RemoteService,
+ private settingService: SettingService,
+ private router: Router
+ ) {}
ngOnInit(): void {
this.init();
@@ -129,89 +159,28 @@ export class SettingComponent implements OnInit {
hasChild = (_: number, node: FlatNode): boolean => node.expandable;
- customLinkRender() {
- const defaultRender =
- this.md.renderer.rules.link_open ||
- function (tokens, idx, options, env, self) {
- return self.renderToken(tokens, idx, options);
- };
-
- this.md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
- // If you are sure other plugins can't add `target` - drop check below
- const aIndex = tokens[idx].attrIndex('target');
-
- if (aIndex < 0) {
- tokens[idx].attrPush(['target', '_blank']); // add new attribute
- } else {
- tokens[idx].attrs[aIndex][1] = '_blank'; // replace value of existing attr
- }
-
- // pass token to default renderer.
- return defaultRender(tokens, idx, options, env, self);
- };
- }
-
/**
- * 切换数据源
+ * switch data source
*/
switchDataSource() {
- this.remoteService.switchDataSource();
+ this.switchDataSourceLoading = true;
+ this.remoteService.switchDataSource().finally(() => {
+ this.switchDataSourceLoading = false;
+ });
// this.messageService.send({ type: 'switchDataSource', data: { showWithSetting: true } });
}
/**
- * 测试远程服务器地址是否可用
- */
- async pingRmoteServerUrl() {
- const { url: remoteUrl, token } = this.getConfiguration('eoapi-common.remoteServer');
- // 是否更新了远程服务地址或token
- const isUpdateRemoteServerInfo = remoteUrl !== this.remoteServerUrl || token !== this.remoteServerToken;
- let messageId;
- if (isUpdateRemoteServerInfo) {
- messageId = this.message.loading('远程服务器连接中...', { nzDuration: 0 }).messageId;
- }
-
- try {
- const url = `${remoteUrl}/system/status`.replace(/(? this.message.remove(messageId), 500);
- }
- }
-
- /**
- * 设置数据
+ * set data
*
* @param properties
*/
private setSettingsModel(properties, controls) {
- // 平级配置对象
+ // Flat configuration object
Object.keys(properties).forEach((fieldKey) => {
const props = properties[fieldKey];
- this.settings[fieldKey] = this.localSettings?.settings?.[fieldKey] ?? props.default;
- // 可扩展加入更多默认校验
+ this.settings[fieldKey] = this.localSettings?.[fieldKey] ?? props.default;
+ // Extensible to add more default checks
if (props.required) {
controls[fieldKey] = [null, [Validators.required]];
} else {
@@ -219,36 +188,36 @@ export class SettingComponent implements OnInit {
}
});
// 深层嵌套的配置对象
- Object.keys(properties).forEach((fieldKey) => {
- const keyArr = fieldKey.split('.');
- const keyArrL = keyArr.length - 1;
- keyArr.reduce((p, k, i) => {
- const isLast = i === keyArrL;
- p[k] ??= isLast ? this.settings[fieldKey] : {};
- return p[k];
- }, this.nestedSettings);
- // 当settings变化时，将值同步到nestedSettings
- Object.defineProperty(this.settings, fieldKey, {
- get: () => this.getConfiguration(fieldKey),
- set: (newVal) => {
- const target = keyArr.slice(0, -1).reduce((p, k) => p[k], this.nestedSettings);
- target[keyArr[keyArrL]] = newVal;
- },
- });
- });
+ // Object.keys(properties).forEach((fieldKey) => {
+ // const keyArr = fieldKey.split('.');
+ // const keyArrL = keyArr.length - 1;
+ // keyArr.reduce((p, k, i) => {
+ // const isLast = i === keyArrL;
+ // p[k] ??= isLast ? this.settings[fieldKey] : {};
+ // return p[k];
+ // }, this.nestedSettings);
+ // // 当settings变化时，将值同步到nestedSettings
+ // Object.defineProperty(this.settings, fieldKey, {
+ // get: () => this.getConfiguration(fieldKey),
+ // set: (newVal) => {
+ // const target = keyArr.slice(0, -1).reduce((p, k) => p[k], this.nestedSettings);
+ // target[keyArr[keyArrL]] = newVal;
+ // },
+ // });
+ // });
}
/**
- * 根据key路径获取对应的配置的值
+ * Get the value of the corresponding configuration according to the key path
*
* @param key
* @returns
*/
getConfiguration(key: string) {
- return key.split('.').reduce((p, k) => p[k], this.nestedSettings);
+ // return key.split('.').reduce((p, k) => p?.[k], this.nestedSettings);
}
/**
- * 获取模块的标题
+ * Get the title of the module
*
* @param module
* @returns
@@ -266,31 +235,24 @@ export class SettingComponent implements OnInit {
}
/**
- * 解析所有模块的配置信息
+ * Parse the configuration information of all modules
*/
private init() {
- if (!window.eo && !window.eo?.getFeature) {
- return;
- }
- this.isVisible = true;
- this.settings = {};
- this.nestedSettings = {};
- // 获取本地设置
- this.localSettings = window.eo.getSettings();
+ // if (!window.eo && !window.eo?.getFeature) {
+ // return;
+ // }
+ // ! this.isVisible = true;
+ // Get local settings
+ this.settings = this.localSettings = this.settingService.getSettings();
+ console.log('localSettings', this.localSettings);
// const featureList = window.eo.getFeature('configuration');
- const modules = window.eo.getModules();
+ const modules = window.eo?.getModules() || new Map([]);
// const extensitonConfigurations = [...modules.values()].filter((n) => n.contributes?.configuration);
const extensitonConfigurations = [...modules.values()].filter((n) => n.features?.configuration);
const controls = {};
- // 所有设置
- const allSettings = cloneDeep([
- eoapiSettings['eoapi-common'],
- eoapiSettings['eoapi-theme'],
- eoapiSettings['eoapi-extensions'],
- eoapiSettings['eoapi-features'],
- eoapiSettings['eoapi-about'],
- ]);
- // 所有配置
+ // All settings
+ const allSettings = structuredClone([eoapiSettings['eoapi-extensions']]);
+ // All configure
const allConfiguration = allSettings.map((n) => {
const configuration = n.features?.configuration || n.contributes?.configuration;
if (Array.isArray(configuration)) {
@@ -312,14 +274,14 @@ export class SettingComponent implements OnInit {
extensionsConfiguration.push(configuration);
}
});
- // 给插件的属性前面追加模块ID
+ // Appends the module ID to the plug-in property
const appendModuleID = (properties, moduleID) =>
Object.keys(properties).reduce((prev, key) => {
prev[`${moduleID}.${key}`] = properties[key];
return prev;
}, {});
- /** 根据configuration配置生成settings model */
+ /** Generate settings model based on configuration configuration */
allConfiguration.forEach((item) => {
if (Array.isArray(item)) {
item.forEach((n) => {
@@ -332,7 +294,7 @@ export class SettingComponent implements OnInit {
}
});
type Configuration = typeof allConfiguration[number] | Array;
- // 递归生成设置树
+ // Recursively generate the setup tree
const generateTreeData = (configurations: Configuration = []) =>
[].concat(configurations).reduce((prev, curr) => {
if (Array.isArray(curr)) {
@@ -340,47 +302,35 @@ export class SettingComponent implements OnInit {
}
const treeItem: TreeNode = {
name: curr.title,
- title: curr.title,
configuration: [].concat(curr),
};
return prev.concat(treeItem);
}, []);
- // 所有设置项
- const treeData = allSettings.reduce((prev, curr) => {
- let treeItem: TreeNode;
- const configuration = curr.features?.configuration || curr.contributes?.configuration;
- if (Array.isArray(configuration)) {
- treeItem = {
- name: curr.name,
- moduleID: curr.moduleID,
- title: curr.moduleName || curr.name,
- children: generateTreeData(configuration),
- configuration,
- };
- } else {
- treeItem = {
- name: curr.name,
- moduleID: curr.moduleID,
- title: curr.moduleName || configuration.title || curr.name,
- configuration: [configuration],
- };
- }
- return prev.concat(treeItem);
- }, []);
+ // All settings
+ const treeData = structuredClone(this.treeNodes);
+ const extensions = treeData.find((n) => n.moduleID === 'eoapi-extensions');
+ const extensionConfiguration = allSettings[0].features?.configuration || allSettings[0].contributes?.configuration;
+ extensions.children = generateTreeData(extensionConfiguration);
+ extensions.configuration = extensionConfiguration;
this.dataSource.setData(treeData);
this.treeControl.expandAll();
this.validateForm = this.fb.group(controls);
- this.validateForm.valueChanges.subscribe(debounce(this.handleSave.bind(this), 300));
- // 默认选中第一项
+ this.validateForm.valueChanges.pipe(debounceTime(300)).subscribe(this.handleSave);
+ // The first item is selected by default
this.selectModule(this.treeControl.dataNodes.at(0));
- this.handleSave();
}
+ navToExtensionList() {
+ this.router.navigate(['home/extension/list'], {
+ queryParams: { type: 'all' },
+ });
+ this.handleCancel();
+ }
handleShowModal() {
this.isShowModal = true;
}
- handleSave(): void {
+ handleSave = () => {
// for (const i in this.validateForm.controls) {
// if (this.validateForm.controls.hasOwnProperty(i)) {
// this.validateForm.controls[i].markAsDirty();
@@ -390,24 +340,32 @@ export class SettingComponent implements OnInit {
// if (this.validateForm.status === 'INVALID') {
// return;
// }
- // 加入根据返回显示提示消息
- const saved = window.eo.saveSettings({ settings: this.settings, nestedSettings: this.nestedSettings });
- if (saved) {
- // this.handleCancel();
- }
- }
+ this.settingService.saveSetting(this.settings);
+ window.eo?.saveSettings?.({ ...this.settings });
+ };
async handleCancel() {
try {
- const result = await this.pingRmoteServerUrl();
- if (Object.is(result, true)) {
- this.message.success('远程数据源连接成功');
- this.remoteService.switchToHttp();
- this.remoteService.refreshComponent();
+ const isUpdateRemoteInfo =
+ this.remoteServerUrl !== this.settings['eoapi-common.remoteServer.url'] ||
+ this.remoteServerToken !== this.settings['eoapi-common.remoteServer.token'] ||
+ this.oldDataStorage !== this.settings['eoapi-common.dataStorage'];
+
+ if (isUpdateRemoteInfo) {
+ this.message.success(
+ 'You have modified the data source related information, the page will refresh in 2 seconds...'
+ );
+ setTimeout(() => {
+ this.remoteService.switchDataSource();
+ this.remoteService.refreshComponent();
+ }, 2000);
}
} catch (error) {
} finally {
+ this.handleSave();
+
this.isShowModal = false;
+ this.isShowModalChange.emit(false);
}
}
}
diff --git a/src/workbench/browser/src/app/shared/components/setting/setting.module.ts b/src/workbench/browser/src/app/shared/components/setting/setting.module.ts
index 9353b882..a0832d1e 100644
--- a/src/workbench/browser/src/app/shared/components/setting/setting.module.ts
+++ b/src/workbench/browser/src/app/shared/components/setting/setting.module.ts
@@ -16,10 +16,18 @@ import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
import { NzPopoverModule } from 'ng-zorro-antd/popover';
import { NzEmptyModule } from 'ng-zorro-antd/empty';
import { NzTabsModule } from 'ng-zorro-antd/tabs';
+import { NzRadioModule } from 'ng-zorro-antd/radio';
import { NzTreeViewModule } from 'ng-zorro-antd/tree-view';
+import { NzDescriptionsModule } from 'ng-zorro-antd/descriptions';
import { ElectronService } from '../../../core/services';
-import { SharedModule } from '../../shared.module';
+import { SelectThemeComponent } from 'eo/workbench/browser/src/app/shared/components/toolbar/select-theme/select-theme.component';
+import { SharedModule } from 'eo/workbench/browser/src/app/shared/shared.module';
+import {
+ DataStorageComponent,
+ LanguageSwticherComponent,
+ AboutComponent,
+} from 'eo/workbench/browser/src/app/shared/components/setting/common';
const ANTDMODULES = [
NzModalModule,
@@ -37,11 +45,19 @@ const ANTDMODULES = [
NzEmptyModule,
NzDropDownModule,
NzPopoverModule,
+ NzRadioModule,
+ NzDescriptionsModule,
];
@NgModule({
- declarations: [SettingComponent],
+ declarations: [
+ SettingComponent,
+ SelectThemeComponent,
+ DataStorageComponent,
+ LanguageSwticherComponent,
+ AboutComponent,
+ ],
imports: [FormsModule, ReactiveFormsModule, SharedModule, CommonModule, ...ANTDMODULES],
- exports: [SettingComponent],
+ exports: [SettingComponent, SelectThemeComponent],
providers: [ElectronService],
})
export class SettingModule {}
diff --git a/src/workbench/browser/src/app/shared/components/shadow/shadow-dom-encapsulation.component.ts b/src/workbench/browser/src/app/shared/components/shadow/shadow-dom-encapsulation.component.ts
new file mode 100644
index 00000000..8d12d58a
--- /dev/null
+++ b/src/workbench/browser/src/app/shared/components/shadow/shadow-dom-encapsulation.component.ts
@@ -0,0 +1,56 @@
+import { Component, Input, ViewEncapsulation, OnInit } from '@angular/core';
+import MarkdownIt from 'markdown-it/dist/markdown-it';
+
+@Component({
+ selector: 'eo-shadow-dom',
+ template: ` `,
+ styles: [],
+ encapsulation: ViewEncapsulation.ShadowDom,
+})
+export class ShadowDomEncapsulationComponent implements OnInit {
+ md: MarkdownIt;
+
+ @Input() text = '';
+ @Input() options = {
+ html: false,
+ };
+
+ get content() {
+ const html = this.md.render(this.text || '');
+ if (html && this.options.html) {
+ const domParser = new DOMParser();
+ const doc = domParser.parseFromString(html, 'text/html');
+ const a = doc.querySelectorAll('a');
+ a.forEach((n) => n.setAttribute('target', '_blank'));
+ return doc.body.innerHTML;
+ } else {
+ return html;
+ }
+ }
+
+ constructor() {}
+
+ ngOnInit() {
+ this.md = new MarkdownIt(this.options);
+ this.customLinkRender();
+ }
+
+ customLinkRender() {
+ const defaultRender =
+ this.md.renderer.rules.link_open || ((tokens, idx, options, env, self) => self.renderToken(tokens, idx, options));
+
+ this.md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
+ // If you are sure other plugins can't add `target` - drop check below
+ const aIndex = tokens[idx].attrIndex('target');
+
+ if (aIndex < 0) {
+ tokens[idx].attrPush(['target', '_blank']); // add new attribute
+ } else {
+ tokens[idx].attrs[aIndex][1] = '_blank'; // replace value of existing attr
+ }
+
+ // pass token to default renderer.
+ return defaultRender(tokens, idx, options, env, self);
+ };
+ }
+}
diff --git a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.html b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.html
index 6842f4c0..6869f70e 100644
--- a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.html
+++ b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.html
@@ -1,14 +1,11 @@
diff --git a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.scss b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.scss
index d08db7ff..42127eb2 100644
--- a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.scss
+++ b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.scss
@@ -1,5 +1,4 @@
.eo_sidebar {
- background-color: var(--SIDEBAR_BG);
border-right: 1px solid var(--BORDER);
overflow: auto;
width: 90px;
@@ -19,15 +18,24 @@
color: var(--SIDEBAR_TEXT);
transform: scale(0.8);
border-radius: 3px;
+ color: rgba(0,0,0,0.5);
&:hover {
background-color: var(--SEC_BG);
// background-color: var(--SIDEBAR_BG_HOVER);
// color: var(--TEXT_ACTIVE);
}
- img {
- width: 25px;
+ i.icon {
+ font-size: 1.6em;
+ }
+ &.sidebar_item_active {
+ background-color: var(--SEC_BG);
+ color: #00785a;
+ i.icon {
+ color: #00785a;
+ }
+ .label {
+ color: rgba(0,0,0,0.8);
+ }
}
}
-.sidebar_item_active {
- background-color: var(--SEC_BG);
-}
+
diff --git a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.ts b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.ts
index d24e174c..7af972af 100644
--- a/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.ts
+++ b/src/workbench/browser/src/app/shared/components/sidebar/sidebar.component.ts
@@ -38,7 +38,7 @@ export class SidebarComponent implements OnInit, OnDestroy {
this.watchRouterChange();
}
- watchRouterChange(){
+ watchRouterChange() {
this.router.events.pipe(filter((event) => event instanceof NavigationEnd)).subscribe((res: any) => {
this.getModuleIDFromRoute();
});
@@ -46,30 +46,31 @@ export class SidebarComponent implements OnInit, OnDestroy {
clickModule(module) {
this.sidebar.currentModule = module;
this.sidebar.appChanged$.next();
- let nextApp = this.modules.find((val) => val.moduleID === module.moduleID);
- let route = (nextApp as SidebarModuleInfo).route || '/home/blank';
+ const nextApp = this.modules.find((val) => val.moduleID === module.moduleID);
+ const route = (nextApp as SidebarModuleInfo).route || '/home/blank';
+ console.log('route', route);
this.router.navigate([route]);
}
ngOnDestroy(): void {
this.destroy = true;
}
private getModules() {
- let defaultModule = [
+ const defaultModule = [
{
- moduleName: 'API',
+ moduleName: 'REST',
moduleID: '@eo-core-apimanger',
isOffical: true,
- logo: 'icon-api',
+ icon: 'api',
activeRoute: 'home/api',
route: 'home/api/test',
},
{
- moduleName: '插件广场',
+ moduleName: $localize`Extensions`,
moduleID: '@eo-core-extension',
isOffical: true,
- logo: 'icon-apps',
+ icon: 'puzzle',
activeRoute: 'home/extension',
- route: this.electron.isElectron ? 'home/extension/list' : 'home/preview',
+ route: 'home/extension/list',
},
];
if (this.electron.isElectron) {
@@ -82,10 +83,11 @@ export class SidebarComponent implements OnInit, OnDestroy {
}
}
private getModuleIDFromRoute() {
- let currentModule = this.modules.find((val) => this.router.url.includes(val.activeRoute));
+ const currentModule = this.modules.find((val) => this.router.url.includes(val.activeRoute));
if (!currentModule) {
//route error
this.clickModule(this.modules[0]);
+ console.error('route error: currentModule is undefind', currentModule);
return;
}
this.sidebar.currentModule = currentModule;
diff --git a/src/workbench/browser/src/app/shared/components/sync-api/sync-api.component.ts b/src/workbench/browser/src/app/shared/components/sync-api/sync-api.component.ts
index bac870e7..4f0d1dc5 100644
--- a/src/workbench/browser/src/app/shared/components/sync-api/sync-api.component.ts
+++ b/src/workbench/browser/src/app/shared/components/sync-api/sync-api.component.ts
@@ -31,7 +31,7 @@ export class SyncApiComponent implements OnInit {
const action = feature.action || null;
const module = window.eo.loadFeatureModule(this.currentExtension);
// TODO 临时取值方式需要修改
- const { token: secretKey, projectId } = window.eo.getModuleSettings(
+ const { token: secretKey, projectId } = window.eo?.getModuleSettings(
'eoapi-feature-push-eolink.eolink.remoteServer'
);
if (module && module[action] && typeof module[action] === 'function') {
diff --git a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.html b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.html
index aa1b4322..3a14b4a6 100644
--- a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.html
+++ b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.html
@@ -1,5 +1,11 @@
diff --git a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.scss b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.scss
index d7d3df70..70167966 100644
--- a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.scss
+++ b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.scss
@@ -9,6 +9,10 @@
width: 100%;
z-index: 2;
color: var(--FOOTER_TEXT);
+ i {
+ font-size: 24px;
+ color: rgba(0,0,0,.5);
+ }
}
.iconfont{
line-height: 22px;
diff --git a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.ts b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.ts
index ea1efc75..061f575b 100644
--- a/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.ts
+++ b/src/workbench/browser/src/app/shared/components/toolbar/toolbar.component.ts
@@ -10,7 +10,7 @@ import { takeUntil } from 'rxjs/operators';
styleUrls: ['./toolbar.component.scss'],
})
export class ToolbarComponent implements OnInit, OnDestroy {
- showThemeDrawer: boolean = false;
+ showThemeDrawer = false;
sideBarCollapsed: boolean;
private destroy$: Subject = new Subject();
constructor(private sidebar: SidebarService) {
diff --git a/src/workbench/browser/src/app/shared/models/client.model.ts b/src/workbench/browser/src/app/shared/models/client.model.ts
new file mode 100644
index 00000000..2aa6adba
--- /dev/null
+++ b/src/workbench/browser/src/app/shared/models/client.model.ts
@@ -0,0 +1,24 @@
+export const ResourceInfo = [
+ {
+ id: 'win',
+ name: $localize`Windows Client`,
+ icon: 'windows',
+ keyword: 'Setup',
+ suffix: 'exe',
+ link: '',
+ },
+ {
+ id: 'mac',
+ name: $localize`MacOS(Intel) Client`,
+ icon: 'mac',
+ suffix: 'dmg',
+ link: '',
+ },
+ {
+ id: 'mac',
+ name: $localize`MacOS(M1) Client`,
+ icon: 'mac',
+ suffix: 'arm64.dmg',
+ link: '',
+ },
+];
diff --git a/src/workbench/browser/src/app/shared/services/api-test/serverless-node/test-connect.service.ts b/src/workbench/browser/src/app/shared/services/api-test/serverless-node/test-connect.service.ts
index b31fe122..1bfd1c61 100644
--- a/src/workbench/browser/src/app/shared/services/api-test/serverless-node/test-connect.service.ts
+++ b/src/workbench/browser/src/app/shared/services/api-test/serverless-node/test-connect.service.ts
@@ -42,7 +42,7 @@ export class TestServerServerlessService implements TestServer {
responseLength: 0,
responseType: 'text',
reportList: [],
- body: '测试服务连接失败，请提交 Issue 联系社区',
+ body: $localize`Test service connection failed, please submit Issue contact community`,
},
report: {
request: {
diff --git a/src/workbench/browser/src/app/shared/services/modal.service.ts b/src/workbench/browser/src/app/shared/services/modal.service.ts
index 63e6253c..d0061c59 100644
--- a/src/workbench/browser/src/app/shared/services/modal.service.ts
+++ b/src/workbench/browser/src/app/shared/services/modal.service.ts
@@ -22,7 +22,7 @@ export class ModalService {
},
nzFooter: [
{
- label: '确认',
+ label: $localize`Confirm`,
type: 'primary',
onClick: () => {
if (inOpts.nzOnOk) {
@@ -33,7 +33,7 @@ export class ModalService {
},
},
{
- label: '取消',
+ label: $localize`Cancel`,
onClick: () => {
modal.destroy();
},
diff --git a/src/workbench/browser/src/app/shared/services/remote/remote.service.ts b/src/workbench/browser/src/app/shared/services/remote/remote.service.ts
index 74a779e1..d1a9169a 100644
--- a/src/workbench/browser/src/app/shared/services/remote/remote.service.ts
+++ b/src/workbench/browser/src/app/shared/services/remote/remote.service.ts
@@ -1,16 +1,13 @@
import { Injectable } from '@angular/core';
import { Subject, takeUntil } from 'rxjs';
-import {
- DataSourceType,
- DATA_SOURCE_TYPE_KEY,
- StorageService,
-} from 'eo/workbench/browser/src/app/shared/services/storage/storage.service';
+import { DataSourceType, StorageService } from 'eo/workbench/browser/src/app/shared/services/storage/storage.service';
import { MessageService } from 'eo/workbench/browser/src/app/shared/services/message/message.service';
import { Message } from 'eo/workbench/browser/src/app/shared/services/message/message.model';
import { NzMessageService } from 'ng-zorro-antd/message';
import { Router } from '@angular/router';
import { ApiData } from 'eo/workbench/browser/src/app/shared/services/storage/index.model';
import { ElectronService } from 'eo/workbench/browser/src/app/core/services/electron/electron.service';
+import { SettingService } from 'eo/workbench/browser/src/app/core/services/settings/settings.service';
/** is show switch success tips */
export const IS_SHOW_DATA_SOURCE_TIP = 'IS_SHOW_DATA_SOURCE_TIP';
@@ -25,7 +22,7 @@ export const IS_SHOW_DATA_SOURCE_TIP = 'IS_SHOW_DATA_SOURCE_TIP';
export class RemoteService {
private destroy$: Subject = new Subject();
/** data source type @type { DataSourceType } */
- dataSourceType: DataSourceType = (localStorage.getItem(DATA_SOURCE_TYPE_KEY) as DataSourceType) || 'local';
+ dataSourceType: DataSourceType = 'local';
get isElectron() {
return this.electronService.isElectron;
}
@@ -35,7 +32,7 @@ export class RemoteService {
}
/** Text corresponding to the current data source */
get dataSourceText() {
- return this.isRemote ? '远程' : '本地';
+ return this.isRemote ? $localize`:@@Remote Server:Remote Server` : $localize`Localhost`;
}
/** get mock url */
get mockUrl() {
@@ -48,9 +45,11 @@ export class RemoteService {
private storageService: StorageService,
private messageService: MessageService,
private message: NzMessageService,
- public electronService: ElectronService,
+ private electronService: ElectronService,
+ private settingService: SettingService,
private router: Router
) {
+ this.dataSourceType = this.settingService.settings['eoapi-common.dataStorage'] ?? this.dataSourceType;
this.messageService
.get()
.pipe(takeUntil(this.destroy$))
@@ -84,7 +83,7 @@ export class RemoteService {
}
/**
- * 测试远程服务器地址是否可用
+ * Test if remote server address is available
*/
async pingRmoteServerUrl(): Promise<[boolean, any]> {
const { url: remoteUrl, token } = window.eo?.getModuleSettings('eoapi-common.remoteServer') || {};
@@ -136,15 +135,14 @@ export class RemoteService {
this.switchToHttp();
this.refreshComponent();
} else {
- console.log('切换失败');
- this.message.create('error', `远程数据源不可用`);
+ this.message.create('error', $localize`Remote data source not available`);
localStorage.setItem(IS_SHOW_DATA_SOURCE_TIP, 'false');
}
}
};
showMessage() {
- this.message.create('success', `成功切换到${this.dataSourceText}数据源`);
+ this.message.create('success', $localize`successfully switched to ${this.dataSourceText} data source`);
localStorage.setItem('IS_SHOW_DATA_SOURCE_TIP', 'false');
}
}
diff --git a/src/workbench/browser/src/app/shared/services/storage/IndexedDB/lib/index.ts b/src/workbench/browser/src/app/shared/services/storage/IndexedDB/lib/index.ts
index 46deb043..5edffe09 100644
--- a/src/workbench/browser/src/app/shared/services/storage/IndexedDB/lib/index.ts
+++ b/src/workbench/browser/src/app/shared/services/storage/IndexedDB/lib/index.ts
@@ -1,9 +1,7 @@
import Dexie, { Table } from 'dexie';
+import { getSettings } from 'eo/workbench/browser/src/app/core/services/settings/settings.service';
import { messageService } from 'eo/workbench/browser/src/app/shared/services/message/message.service';
-import {
- DataSourceType,
- DATA_SOURCE_TYPE_KEY,
-} from 'eo/workbench/browser/src/app/shared/services/storage/storage.service';
+import { DataSourceType } from 'eo/workbench/browser/src/app/shared/services/storage/storage.service';
import { tree2obj } from 'eo/workbench/browser/src/app/utils/tree/tree.utils';
import { Observable } from 'rxjs';
import {
@@ -27,7 +25,7 @@ export type ResultType = {
let isFirstLoad = true;
const getApiUrl = (apiData: ApiData) => {
- const dataSourceType: DataSourceType = (localStorage.getItem(DATA_SOURCE_TYPE_KEY) as DataSourceType) || 'local';
+ const dataSourceType: DataSourceType = getSettings()?.['eoapi-common.dataStorage'] ?? 'local';
/** Is it a remote data source */
const isRemote = dataSourceType === 'http';
@@ -64,7 +62,7 @@ const batchCreateMock = async (mock: Table, data
const mockList = await mock.where('uuid').above(0).toArray();
const noHasDefaultMockApiDatas = data
.filter((item) => !mockList.some((m) => Number(m.apiDataID) === item.uuid))
- .map((item) => createMockObj(item, { name: '默认 Mock', createWay: 'system' }));
+ .map((item) => createMockObj(item, { name: $localize`Default Mock`, createWay: 'system' }));
await mock.bulkAdd(noHasDefaultMockApiDatas);
}
@@ -393,7 +391,7 @@ export class IndexedDBStorage extends Dexie implements StorageInterface {
const result = this.loadAllByConditions(this.apiData, { projectID });
result.subscribe(({ status, data }: ResultType) => {
if (isFirstLoad && status === 200 && data) {
- batchCreateMock(this.mock, data);
+ requestIdleCallback(() => batchCreateMock(this.mock, data));
}
});
return result;
@@ -488,7 +486,7 @@ export class IndexedDBStorage extends Dexie implements StorageInterface {
* @param apiDataID
*/
apiTestHistoryLoadAllByApiDataID(apiDataID: number | string): Observable
+
+
+ Environment
+
+
+
+
+
+ {{ item.name }}
+
+
+
+
+
+
- 该功能需要插件支持，请移步至插件广场下载
+
diff --git a/src/workbench/browser/src/app/shared/components/extension-select/extension-select.component.ts b/src/workbench/browser/src/app/shared/components/extension-select/extension-select.component.ts
index cc798c22..9efd055b 100644
--- a/src/workbench/browser/src/app/shared/components/extension-select/extension-select.component.ts
+++ b/src/workbench/browser/src/app/shared/components/extension-select/extension-select.component.ts
@@ -41,7 +41,7 @@ export class ExtensionSelectComponent {
parserFile = (file) =>
new Observable((observer: Observer
+ This feature requires plugin support, please move to extensions download
@@ -39,8 +39,8 @@
- 点击或直接拖拽文件至此区域
-仅支持JSON格式的单个文件导入
+Tap or drag files directly to this area
+Only individual files in Json format are supported
{{ filename }}
-
-
diff --git a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.html b/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.html
deleted file mode 100644
index 9d134c84..00000000
--- a/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.html
+++ /dev/null
@@ -1,14 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- -
-
-
-
-
-
-
-
- {{ dataSourceText }}数据源
- 数据储存在{{ dataSourceText }}，{{ isRemote ? '如不需协作，可以切换到本地数据源' : '如需协作请切换到远程数据源'}}
-
-
-
-
-
-
-
-
-
- 体验插件功能请下载桌面端使用
-
-
-
-
-
-
-
-
- {{ item.name }}
-
-
-
+ 
+
- {{ node.title }}
+
+ {{ node.name }}
@@ -27,70 +44,119 @@
-
- {{ node.title }}
+
+ {{ node.name }}
-
-
- 暂无配置项
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+