添加欢迎页面提示可能无法安装的插件信息和GetStart中添加步骤提示安装插件路径。

This commit is contained in:
chriswang521 2022-10-18 10:12:03 +08:00
parent 5ec0c4200d
commit 8715534d75
3 changed files with 72 additions and 2 deletions

View File

@ -144,6 +144,7 @@ export class GettingStartedPage extends EditorPane {
private hasScrolledToFirstCategory = false; private hasScrolledToFirstCategory = false;
private recentlyOpenedList?: GettingStartedIndexList<RecentEntry>; private recentlyOpenedList?: GettingStartedIndexList<RecentEntry>;
private startList?: GettingStartedIndexList<IWelcomePageStartEntry>; private startList?: GettingStartedIndexList<IWelcomePageStartEntry>;
private tipsList?: GettingStartedIndexList<RecentEntry>;
private gettingStartedList?: GettingStartedIndexList<IResolvedWalkthrough>; private gettingStartedList?: GettingStartedIndexList<IResolvedWalkthrough>;
private stepsSlide!: HTMLElement; private stepsSlide!: HTMLElement;
@ -373,6 +374,10 @@ export class GettingStartedPage extends EditorPane {
} }
break; break;
} }
case 'installExtension':{
this.commandService.executeCommand('workbench.extensions.action.installVSIX');
break;
}
case 'selectCategory': { case 'selectCategory': {
const selectedCategory = this.gettingStartedCategories.find(category => category.id === argument); const selectedCategory = this.gettingStartedCategories.find(category => category.id === argument);
if (!selectedCategory) { throw Error('Could not find category with ID ' + argument); } if (!selectedCategory) { throw Error('Could not find category with ID ' + argument); }
@ -753,6 +758,7 @@ export class GettingStartedPage extends EditorPane {
const rightColumn = $('.categories-column.categories-column-right', {},); const rightColumn = $('.categories-column.categories-column-right', {},);
const startList = this.buildStartList(); const startList = this.buildStartList();
const tipsList = this.buildTipsList();
const recentList = this.buildRecentlyOpenedList(); const recentList = this.buildRecentlyOpenedList();
const gettingStartedList = this.buildGettingStartedWalkthroughsList(); const gettingStartedList = this.buildGettingStartedWalkthroughsList();
@ -765,13 +771,13 @@ export class GettingStartedPage extends EditorPane {
const layoutLists = () => { const layoutLists = () => {
if (gettingStartedList.itemCount) { if (gettingStartedList.itemCount) {
this.container.classList.remove('noWalkthroughs'); this.container.classList.remove('noWalkthroughs');
reset(leftColumn, startList.getDomElement(), recentList.getDomElement()); reset(leftColumn, startList.getDomElement(), tipsList.getDomElement(),recentList.getDomElement());
reset(rightColumn, gettingStartedList.getDomElement()); reset(rightColumn, gettingStartedList.getDomElement());
recentList.setLimit(5); recentList.setLimit(5);
} }
else { else {
this.container.classList.add('noWalkthroughs'); this.container.classList.add('noWalkthroughs');
reset(leftColumn, startList.getDomElement()); reset(leftColumn, startList.getDomElement(),tipsList.getDomElement());
reset(rightColumn, recentList.getDomElement()); reset(rightColumn, recentList.getDomElement());
recentList.setLimit(10); recentList.setLimit(10);
} }
@ -918,6 +924,42 @@ export class GettingStartedPage extends EditorPane {
return recentlyOpenedList; return recentlyOpenedList;
} }
/**
*build tips List
*RecentEntry here is meaningless, just borrowed to display the contents of empty.
*If you really want to display the tipslist as a list later, you need to create an entry to render the HTMLElement.
*/
private buildTipsList(): GettingStartedIndexList<RecentEntry> {
//This code doesn't make sense
const renderTips = (entry: RecentEntry) => {
const li = $('li');
const span = $('span');
span.innerText = 'test';
span.title = 'test2';
li.appendChild(span);
return li;
};
if (this.tipsList) { this.tipsList.dispose(); }
const tipsList = this.tipsList = new GettingStartedIndexList(// fit GettingStartedIndexList class
{
title: localize('tipsTitle', "Tips"),
klass: 'tips-container',
limit: 2,//Meaningless code
empty: $('.empty-tips', {},
localize('tipsMsg', "If the system creates a new user, some extensions of the new user cannot be installed. In this case, you need to manually install them.Yon can "),
$('button.button-link', { 'x-dispatch': 'installExtension' }, localize('installExtension', "install extension")),
localize('directory',"to choose extensions path:/usr/share/code-oss/vsix/")),
renderElement: renderTips,//Meaningless code
contextService: this.contextService
});
//register button click event
tipsList.onDidChange(() => this.registerDispatchListeners());
//Parameter array is empty, only display empty content
tipsList.setEntries([]);
return tipsList;
}
private buildStartList(): GettingStartedIndexList<IWelcomePageStartEntry> { private buildStartList(): GettingStartedIndexList<IWelcomePageStartEntry> {
const renderStartEntry = (entry: IWelcomePageStartEntry): HTMLElement => const renderStartEntry = (entry: IWelcomePageStartEntry): HTMLElement =>
$('li', $('li',
@ -1036,6 +1078,7 @@ export class GettingStartedPage extends EditorPane {
this.detailsPageScrollbar?.scanDomNode(); this.detailsPageScrollbar?.scanDomNode();
this.startList?.layout(size); this.startList?.layout(size);
this.tipsList?.layout(size);
this.gettingStartedList?.layout(size); this.gettingStartedList?.layout(size);
this.recentlyOpenedList?.layout(size); this.recentlyOpenedList?.layout(size);

View File

@ -3,6 +3,7 @@
* Licensed under the MIT License. See License.txt in the project root for license information. * Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/ *--------------------------------------------------------------------------------------------*/
import 'vs/workbench/contrib/welcomeGettingStarted/common/media/extension_install';
import 'vs/workbench/contrib/welcomeGettingStarted/common/media/theme_picker'; import 'vs/workbench/contrib/welcomeGettingStarted/common/media/theme_picker';
import 'vs/workbench/contrib/welcomeGettingStarted/common/media/notebookProfile'; import 'vs/workbench/contrib/welcomeGettingStarted/common/media/notebookProfile';
import { localize } from 'vs/nls'; import { localize } from 'vs/nls';
@ -190,6 +191,13 @@ export const walkthroughs: GettingStartedWalkthroughContent = [
content: { content: {
type: 'steps', type: 'steps',
steps: [ steps: [
{
id: 'extensionTips',
title: localize('gettingStarted.extensionTips.title', "Manual Extension Installation"),
description: localize('gettingStarted.extensionTips.description', "If the system creates a new user, some extensions of the new user cannot be installed. In this case, you need to manually install them.\n{0}", Button(localize('installExtension', "Install Extension"), 'command:workbench.extensions.action.installVSIX')),
completionEvents:['onCommand:workbench.extensions.action.installVSIX'],
media: { type: 'markdown', path: 'extension_install', }
},
{ {
id: 'pickColorTheme', id: 'pickColorTheme',
title: localize('gettingStarted.pickColor.title', "Choose the look you want"), title: localize('gettingStarted.pickColor.title', "Choose the look you want"),

View File

@ -0,0 +1,19 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import { escape } from 'vs/base/common/strings';
import { localize } from 'vs/nls';
export default () => `
<span>
${escape(localize('directory', "Yon can install extensions path:/usr/share/code-oss/vsix/*.vsix"))}
</span>
<p>
${escape(localize('install', "You can use command install extension:"))}
</p>
<p>
${escape('code --install-extension /usr/share/code-oss/vsix/*.vsix')}
</p>
`;