微调了页面内css以适配Editor底色

src/vs/workbench/contrib/example/browser/common/stockDetailsService.ts

@@ -3,8 +3,8 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
-import { createDecorator } from '../../../../platform/instantiation/common/instantiation.js';
+import { createDecorator } from '../../../../../platform/instantiation/common/instantiation.js';
-import { Emitter, Event } from '../../../../base/common/event.js';
+import { Emitter, Event } from '../../../../../base/common/event.js';
 
 /**
  * 定义服务接口和标识符

src/vs/workbench/contrib/example/browser/editors/StockDetailsEditor.ts

@@ -5,10 +5,10 @@
 import { EditorPane } from '../../../../browser/parts/editor/editorPane.js';
 import { Dimension } from '../../../../../base/browser/dom.js';
 import { StockDetailsInput } from './StockDetailsInput.js';
-import { IWebviewService, IOverlayWebview } from '../../../../contrib/webview/browser/webview.js';
 import { ITelemetryService } from '../../../../../platform/telemetry/common/telemetry.js';
 import { IThemeService } from '../../../../../platform/theme/common/themeService.js';
 import { IStorageService } from '../../../../../platform/storage/common/storage.js';
+
 import { CancellationToken } from '../../../../../base/common/cancellation.js';
 import { IEditorOptions } from '../../../../../platform/editor/common/editor.js';
 import { IEditorOpenContext } from '../../../../common/editor.js';
@@ -18,20 +18,19 @@ import * as DOM from '../../../../../base/browser/dom.js';
 export class StockDetailsEditor extends EditorPane {
 	static readonly ID = 'workbench.editor.stockDetails';
 
-	private webview: IOverlayWebview | null = null;
+	private container: HTMLElement | null = null;
 
 	constructor(
 		group: IEditorGroup,
 		@ITelemetryService telemetryService: ITelemetryService,
 		@IThemeService themeService: IThemeService,
-		@IStorageService storageService: IStorageService,
+		@IStorageService storageService: IStorageService
-		@IWebviewService private readonly webviewService: IWebviewService
 	) {
 		super(StockDetailsEditor.ID, group, telemetryService, themeService, storageService);
 	}
 
 	/**
-	 * 创建编辑器容器并初始化 WebView。
+	 * 创建编辑器容器并初始化界面。
 	 */
 	protected createEditor(parent: HTMLElement): void {
 		// 使用 WebView 服务创建 IOverlayWebview 实例
@@ -42,31 +41,38 @@ export class StockDetailsEditor extends EditorPane {
 			contentOptions: {
 				allowScripts: true,
 				localResourceRoots: [], // 根据需求设置本地资源根路径
+				localResourceRoots: [], // 根据需求设置本地资源根路径
 			},
 			extension: undefined,
 		});
 
 		// 将 WebView 定位到父元素
 		if (this.webview) {
+			// 获取当前激活的窗口
 			// 获取当前激活的窗口
 			const targetWindow = DOM.getActiveWindow();
 
+
 			if (!targetWindow) {
 				console.error('无法获取活动窗口');
 				return;
 			}
 
+			// Claim WebView 所有权，绑定到目标窗口
 			// Claim WebView 所有权，绑定到目标窗口
 			this.webview.claim(this, targetWindow as any, undefined);
 
+			// 使用 layoutWebviewOverElement 方法，将 WebView 定位到 `parent`
+
 			// 使用 layoutWebviewOverElement 方法，将 WebView 定位到 `parent`
 			this.webview.layoutWebviewOverElement(parent, new Dimension(parent.offsetWidth, parent.offsetHeight));
 		}
 
+
 	}
 
 	/**
-	 * 设置编辑器输入并更新 WebView 内容。
+	 * 设置编辑器输入。
 	 */
 	override async setInput(
 		input: StockDetailsInput,
@@ -76,7 +82,8 @@ export class StockDetailsEditor extends EditorPane {
 	): Promise<void> {
 		await super.setInput(input, options, context, token);
 
-		if (this.webview && input.resource) {
+		if (input.resource) {
+			console.log(`setInput 接收到股票代码: ${input.getCode()}`);
 			const stockCode = input.getCode();
 
 			if (!stockCode || stockCode.trim() === '') {
@@ -198,10 +205,13 @@ export class StockDetailsEditor extends EditorPane {
 		if (this.webview && this.webview.container) {
 			const webviewContainer = this.webview.container;
 
+			// 设置 WebView 的宽高
+
 			// 设置 WebView 的宽高
 			webviewContainer.style.width = `${dimension.width}px`;
 			webviewContainer.style.height = `${dimension.height}px`;
 
+			// 限制 WebView 到当前编辑器区域
 			// 限制 WebView 到当前编辑器区域
 			const clippingContainer = this.getContainer();
 			if (clippingContainer) {
@@ -214,8 +224,8 @@ export class StockDetailsEditor extends EditorPane {
 	 * 清空输入内容。
 	 */
 	override clearInput(): void {
-		if (this.webview) {
+		if (this.container) {
-			this.webview.setHtml('<!DOCTYPE html><html><body></body></html>'); // 清空内容
+			this.container.textContent = ''; // 不使用 innerHTML
 		}
 		super.clearInput();
 	}
@@ -225,3 +235,5 @@ export class StockDetailsEditor extends EditorPane {
 
 
 
+
+

src/vs/workbench/contrib/example/browser/example.contribution.ts

@@ -25,7 +25,7 @@ import { EditorPaneDescriptor, IEditorPaneRegistry } from '../../../browser/edit
 import { EditorExtensions } from '../../../common/editor.js';
 import { StockDetailsEditor } from './editors/StockDetailsEditor.js';
 import { StockDetailsInput } from './editors/StockDetailsInput.js';
-import { IStockDetailsService, StockDetailsService } from '../common/stockDetailsService.js';
+import { IStockDetailsService, StockDetailsService } from './common/stockDetailsService.js';
 import { InstantiationType, registerSingleton } from '../../../../platform/instantiation/common/extensions.js';
 
 // 注册消息传递服务

src/vs/workbench/contrib/example/browser/resources/app.js

@@ -1,13 +0,0 @@
-/*---------------------------------------------------------------------------------------------
- *  Copyright (c) Microsoft Corporation. All rights reserved.
- *  Licensed under the MIT License. See License.txt in the project root for license information.
- *--------------------------------------------------------------------------------------------*/
-document.addEventListener('DOMContentLoaded', () => {
-	// 模拟异步获取股票数据
-	setTimeout(() => {
-		const stockCode = '000001'; // 示例代码，实际可通过外部注入
-		document.getElementById('stock-code').textContent = stockCode;
-		document.getElementById('price').textContent = '价格: ¥' + (Math.random() * 100).toFixed(2);
-		document.getElementById('change').textContent = '涨跌幅: ' + (Math.random() * 10 - 5).toFixed(2) + '%';
-	}, 1000);
-});

src/vs/workbench/contrib/example/browser/resources/index.html

@@ -1,16 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	<title>股票详情</title>
-	<link rel="stylesheet" href="[[CSS_PATH]]"> <!-- 动态替换 CSS 路径 -->
-</head>
-<body>
-	<h1>股票详情</h1>
-	<div class="info">代码: <span id="stock-code">[[STOCK_CODE]]</span></div> <!-- 动态替换股票代码 -->
-	<div id="price" class="info">价格: ¥加载中...</div>
-	<div id="change" class="info">涨跌幅: 加载中...</div>
-	<script src="[[JS_PATH]]"></script> <!-- 动态替换 JS 路径 -->
-</body>
-</html>

src/vs/workbench/contrib/example/browser/resources/styles.css

@@ -1,16 +0,0 @@
-body {
-    font-family: Arial, sans-serif;
-    margin: 0;
-    padding: 20px;
-    background: #f5f5f5;
-    color: #333;
-}
-
-h1 {
-    font-size: 24px;
-    margin-bottom: 10px;
-}
-
-.info {
-    margin: 5px 0;
-}

src/vs/workbench/contrib/example/browser/views/auxiliaryView.ts

@@ -18,7 +18,7 @@ import { IAccessibleViewService } from '../../../../../platform/accessibility/br
 import { IHoverService } from '../../../../../platform/hover/browser/hover.js';
 import * as DOM from '../../../../../base/browser/dom.js';
 
-import { IStockDetailsService, StockDetail } from '../../common/stockDetailsService.js';
+import { IStockDetailsService, StockDetail } from '../common/stockDetailsService.js';
 
 export class AuxiliaryView extends ViewPane {
 	private stockDetailContainer: HTMLElement | undefined;

src/vs/workbench/contrib/example/browser/views/exampleView.ts

@@ -23,8 +23,8 @@ import './media/exampleViewContainer.css';
 import { IEditorService } from '../../../../services/editor/common/editorService.js';
 import { StockDetailsInput } from '../editors/StockDetailsInput.js';
 import { IWorkbenchLayoutService, Parts } from '../../../../services/layout/browser/layoutService.js';
-import { IStockDetailsService, StockDetail } from '../../common/stockDetailsService.js';
+import { IStockDetailsService, StockDetail } from '../common/stockDetailsService.js';
-import { httpService } from '../../common/stockHttpService.js';
+
 
 export class ExampleView extends ViewPane {
 	constructor(
@@ -62,77 +62,30 @@ export class ExampleView extends ViewPane {
 		this.editorService.onDidActiveEditorChange(() => this.onActiveEditorChange());
 	}
 
-	// override renderBody(container: HTMLElement): void {
+	override renderBody(container: HTMLElement): void {
-	// 	super.renderBody(container);
-
-	// 	const ul = DOM.$('ul'); // 创建一个无序列表
-	// 	ul.classList.add('stock-list'); // 为列表添加样式类
-	// 	const data = [
-	// 		{ name: 'Stock A', code: '000001', price: 100 },
-	// 		{ name: 'Stock B', code: '000002', price: 200 },
-	// 		{ name: 'Stock C', code: '000003', price: 300 },
-	// 		{ name: 'Stock D', code: '000004', price: 400 },
-	// 		{ name: 'Stock E', code: '000005', price: 500 },
-	// 	]; // 假数据
-
-	// 	for (const stock of data) {
-	// 		const li = DOM.$('li');
-	// 		li.textContent = `${stock.name} (${stock.code}) ¥${stock.price.toFixed(2)}`;
-	// 		li.classList.add('stock-item');
-	// 		li.addEventListener('click', () => {
-	// 			this.openStockDetails(stock); // 点击时打开股票详情
-	// 		});
-	// 		ul.appendChild(li);
-	// 	}
-
-	// 	container.appendChild(ul); // 将列表附加到容器中
-	// }
-
-	override async renderBody(container: HTMLElement): Promise<void> {
 		super.renderBody(container);
 
-		// 保持现有的静态数据和渲染逻辑
+		const ul = DOM.$('ul'); // 创建一个无序列表
-		const ul = DOM.$('ul');
+		ul.classList.add('stock-list'); // 为列表添加样式类
-		ul.classList.add('stock-list');
-
 		const data = [
 			{ name: 'Stock A', code: '000001', price: 100 },
 			{ name: 'Stock B', code: '000002', price: 200 },
 			{ name: 'Stock C', code: '000003', price: 300 },
 			{ name: 'Stock D', code: '000004', price: 400 },
 			{ name: 'Stock E', code: '000005', price: 500 },
-		];
+		]; // 假数据
 
 		for (const stock of data) {
 			const li = DOM.$('li');
 			li.textContent = `${stock.name} (${stock.code}) ¥${stock.price.toFixed(2)}`;
 			li.classList.add('stock-item');
 			li.addEventListener('click', () => {
-				this.openStockDetails(stock);
+				this.openStockDetails(stock); // 点击时打开股票详情
 			});
 			ul.appendChild(li);
 		}
 
-		container.appendChild(ul);
+		container.appendChild(ul); // 将列表附加到容器中
-
-		// 发起 POST 请求
-		const requestBody = {
-			pageNo: 1,
-			pageSize: 10,
-			year: '1',
-			indexType: 'hs300'
-		};
-
-		console.log('即将进入请求调用');
-
-		try {
-			const response = await httpService.fetchPostJson('https://www.shidaotec.com/api/strategy/selectStockPageList', requestBody);
-			console.log('API Response:', response); // 请求完成后再打印
-		} catch (err) {
-			console.error('Error fetching stock data:', err); // 捕获异常
-		}
-
-		console.log('已步过');
 	}
 
 

src/vs/workbench/contrib/example/browser/views/panelView.ts

@@ -18,7 +18,7 @@ import { IAccessibleViewService } from '../../../../../platform/accessibility/br
 import { IHoverService } from '../../../../../platform/hover/browser/hover.js';
 import * as DOM from '../../../../../base/browser/dom.js';
 
-import { IStockDetailsService, StockDetail } from '../../common/stockDetailsService.js';
+import { IStockDetailsService, StockDetail } from '../common/stockDetailsService.js';
 
 export class PanelView extends ViewPane {
 	private stockDetailContainer: HTMLElement | undefined;

src/vs/workbench/contrib/example/common/stockHttpService.ts

@@ -1,38 +0,0 @@
-/*---------------------------------------------------------------------------------------------
- *  Copyright (c) Microsoft Corporation. All rights reserved.
- *  Licensed under the MIT License. See License.txt in the project root for license information.
- *--------------------------------------------------------------------------------------------*/
-export class HttpService {
-	async fetchJson(url: string, options: RequestInit = {}): Promise<any> {
-		const response = await fetch(url, options);
-		if (!response.ok) {
-			throw new Error(`HTTP Error: ${response.status} - ${response.statusText}`);
-		}
-		return response.json();
-	}
-
-	async fetchText(url: string, options: RequestInit = {}): Promise<string> {
-		const response = await fetch(url, options);
-		if (!response.ok) {
-			throw new Error(`HTTP Error: ${response.status} - ${response.statusText}`);
-		}
-		return response.text();
-	}
-
-	async fetchPostJson(url: string, body: any, headers: Record<string, string> = { 'Content-Type': 'application/json' }): Promise<any> {
-		console.log('Fetching data with body:', body);
-		const response = await fetch(url, {
-			method: 'POST',
-			headers,
-			body: JSON.stringify(body),
-		});
-		// console.log('Response:', response);
-		if (!response.ok) {
-			throw new Error(`HTTP Error: ${response.status} - ${response.statusText}`);
-		}
-		return response.json();
-	}
-}
-
-// 导出单例
-export const httpService = new HttpService();