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
index e00b5f312..57f6a4ce3 100644
--- 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
@@ -1 +1,13 @@
-
\ No newline at end of file
+
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
index e69de29bb..376fb5d1c 100644
--- 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
@@ -0,0 +1,27 @@
+.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.ts b/src/workbench/browser/src/app/shared/components/page-feature-preview/page-feature-preview.component.ts
index fade9c000..38b5d007f 100644
--- 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
@@ -3,13 +3,75 @@ import { Component, OnInit } from '@angular/core';
@Component({
selector: 'eo-page-feature-preview',
templateUrl: './page-feature-preview.component.html',
- styleUrls: ['./page-feature-preview.component.scss']
+ 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() { }
+ constructor() {
+ this.getInstaller();
+ }
+
+ ngOnInit(): void {}
- 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
+ );
+ });
+ });
+ }
}