import * as vscode from "vscode";
import { AbstractWebview, IWebviewOption } from "./AbstractWebview";
// import { getAnswers, IGetAnswersRes } from "../service";
import * as MarkdownIt from "markdown-it";
import { answersRes } from '../mock/index';
import _ from '../utils/lodash';
import { getQuestionDetails } from '../service';
export class AnswersWebview extends AbstractWebview {
protected readonly viewType: string = "answers.preview";
private answersRes: any;
public md: MarkdownIt;
constructor(private question_id: string) {
super();
this.md = new MarkdownIt({
html: true,
linkify: true,
typographer: true,
});
}
public async init(name: string) {
const response = await getQuestionDetails(Number(this.question_id), name);
let data = _.get(response, 'data', [])[0];
data.success = _.get(response, 'code', 0) === 0 ? true : false;
this.answersRes = this.transfromData(data);
console.log('this.answersRes', this.answersRes);
}
public transfromData(values: any) {
return {
success: values.success,
topic: values.topic,
name: values.name,
detail: values.detail,
refer_answer: values.refer_answer || '',
your_answer: values.your_answer || '暂未提交',
other_answer: values.other_answer && values.other_answer.length ? values.other_answer : [{ answer: '暂无' }],
}
}
public show(): void {
this.showWebviewInternal();
}
protected getWebviewOption(): IWebviewOption {
return {
title: `题目${this.question_id}答案`,
viewColumn: vscode.ViewColumn.One,
preserveFocus: true,
};
}
protected getWebviewContent(): string {
const defaultErrorMsg = "资源加载失败";
const script = `
const add = document.getElementById('add');
const minus = document.getElementById('minus');
const md = document.getElementById('md');
const mds = document.getElementsByClassName('md');
md.style.fontSize = '16px'
for(let ele of mds) {
ele.style.fontSize = '16px'
}
add.addEventListener('click', function (event) {
const size = parseInt(md.style.fontSize) + 1 + 'px'
md.style.fontSize = size
for(let ele of mds) {
ele.style.fontSize = size
}
})
minus.addEventListener('click', function (event) {
const size = parseInt(md.style.fontSize) - 1 + 'px'
md.style.fontSize = size
for(let ele of mds) {
ele.style.fontSize = size
}
})
`;
if (!this.answersRes) {
return `${defaultErrorMsg}
`;
}
const {
success,
errorMsg = defaultErrorMsg,
name,
detail,
refer_answer,
your_answer,
other_answer,
} = this.answersRes;
if (!success) {
return `${errorMsg}
`;
}
let prefix = `
${name}
${detail}
参考答案：
${this.md.render(refer_answer)}
你的答案：
${this.md.render(_.get(your_answer, 'answer', ''))}
大家的答案：
`;
const list = other_answer.map((it: any) => {
return `${this.md.render(
it.answer
)}`;
});
const html = `
${prefix}
`;
return html;
}
protected onDidDisposeWebview(): void {
super.onDidDisposeWebview();
}
}