add vue and element-uio tree
This commit is contained in:
程广
parent
7da0fac51a
commit
0038a12534
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
File diff suppressed because it is too large
Load Diff
|
|
@ -1,6 +1,20 @@
|
|||
import * as vscode from 'vscode';
|
||||
import * as child_process from 'child_process';
|
||||
|
||||
const GitFilter:{[key: string]: string} = {
|
||||
s: 'since',
|
||||
u: 'until',
|
||||
a: 'author',
|
||||
g: 'grep',
|
||||
};
|
||||
export interface GitCommit {
|
||||
hash?: string;
|
||||
author?: string;
|
||||
date?: string;
|
||||
msg?: string;
|
||||
files?: string[];
|
||||
}
|
||||
|
||||
export class GitService {
|
||||
private _repoPath: string;
|
||||
|
||||
|
|
@ -13,16 +27,66 @@ export class GitService {
|
|||
}
|
||||
|
||||
public async getCommits(filter: string = ''): Promise<any[]> {
|
||||
const command = `git log --oneline ${filter}`;
|
||||
const filterParts = filter.split(' ');
|
||||
const nFilter: string[] = [];
|
||||
filterParts.forEach((part) => {
|
||||
const t = part.split(':');
|
||||
const key = t[0];
|
||||
const v = t[1];
|
||||
if (key in GitFilter) {
|
||||
nFilter.push(`--${GitFilter[key]}=${v}`);
|
||||
}
|
||||
});
|
||||
const command = `git log --oneline ${nFilter.join(' ')} --pretty=format:"{\\\"hash\\\":\\\"%h\\\",\\\"author\\\":\\\"%an\\\",\\\"date\\\":\\\"%ad\\\",\\\"msg\\\":\\\"%s\\\"}%n---" --date=format:'%Y-%m-%d' --name-only`;
|
||||
return new Promise((resolve, reject) => {
|
||||
child_process.exec(command, { cwd: this._repoPath }, (error, stdout, stderr) => {
|
||||
if (error) {
|
||||
reject(error);
|
||||
} else {
|
||||
const commits = stdout.split('\n').map(line => {
|
||||
const parts = line.split(' ');
|
||||
return { hash: parts[0], message: parts.slice(1).join(' ') };
|
||||
}).filter(commit => commit.hash);
|
||||
// const commits = stdout.split('\n').map(line => {
|
||||
// try {
|
||||
// const commit = JSON.parse(line);
|
||||
// return commit;
|
||||
// } catch (e) {
|
||||
// return null;
|
||||
// }
|
||||
// }).filter(commit => commit.hash);
|
||||
const lines = stdout.split('\n')
|
||||
let commit:GitCommit|undefined = {};
|
||||
let commits:GitCommit[] = [];
|
||||
for (let i = 0; i < lines.length; i++) {
|
||||
const line = lines[i];
|
||||
if (line.startsWith('{')) {
|
||||
try{
|
||||
commit = JSON.parse(line);
|
||||
if(!commit){
|
||||
continue
|
||||
}
|
||||
commit.files = [];
|
||||
}catch(e){
|
||||
commit = undefined
|
||||
console.log(e);
|
||||
}
|
||||
|
||||
} else if (line === '---') {
|
||||
if(commit){
|
||||
commits.push(commit);
|
||||
}
|
||||
|
||||
} else if (line.trim() !== '') {
|
||||
if(!commit){
|
||||
continue;
|
||||
}
|
||||
if(!commit.files){
|
||||
commit.files = [];
|
||||
}
|
||||
commit.files.push(line);
|
||||
} else {
|
||||
// do nothing
|
||||
console.log('end');
|
||||
}
|
||||
|
||||
}
|
||||
resolve(commits);
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import * as vscode from 'vscode';
|
||||
import { GitService } from './GitService';
|
||||
import * as vscode from "vscode";
|
||||
import * as path from "path";
|
||||
import { GitService } from "./GitService";
|
||||
|
||||
export class GViewProvider implements vscode.WebviewViewProvider {
|
||||
public static readonly viewType = "gitcommitfilter.view";
|
||||
|
|
@ -21,24 +22,33 @@ export class GViewProvider implements vscode.WebviewViewProvider {
|
|||
webviewView.webview.html = this.generateHtml(webviewView);
|
||||
|
||||
// 添加事件监听器
|
||||
webviewView.webview.onDidReceiveMessage(message => {
|
||||
switch (message.command) {
|
||||
case 'filterCommits':
|
||||
const filterText = message.text;
|
||||
this.filterCommits(filterText);
|
||||
return;
|
||||
}
|
||||
}, undefined, this.context.subscriptions);
|
||||
webviewView.webview.onDidReceiveMessage(
|
||||
(message) => {
|
||||
switch (message.command) {
|
||||
case "filterCommits":
|
||||
const filterText = message.text;
|
||||
this.filterCommits(filterText);
|
||||
return;
|
||||
}
|
||||
},
|
||||
undefined,
|
||||
this.context.subscriptions
|
||||
);
|
||||
}
|
||||
|
||||
generateHtml(webviewView: vscode.WebviewView) {
|
||||
return `
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<html lang="en" class="dark">
|
||||
<head >
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Git Commit Filter</title>
|
||||
<link rel="stylesheet" href="${webviewView.webview.asWebviewUri(
|
||||
vscode.Uri.file(
|
||||
path.join(this.context.extensionPath, "media", "elui.css")
|
||||
)
|
||||
)}">
|
||||
<style>
|
||||
body {
|
||||
font-family: var(--vscode-font-family);
|
||||
|
|
@ -68,47 +78,96 @@ export class GViewProvider implements vscode.WebviewViewProvider {
|
|||
button:hover {
|
||||
background-color: var(--vscode-button-hoverBackground);
|
||||
}
|
||||
|
||||
.commit {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="${webviewView.webview.asWebviewUri(
|
||||
vscode.Uri.file(
|
||||
path.join(this.context.extensionPath, "media", "elui.css")
|
||||
)
|
||||
)}">
|
||||
<link rel="stylesheet" href="${webviewView.webview.asWebviewUri(
|
||||
vscode.Uri.file(
|
||||
path.join(this.context.extensionPath, "media", "elui.color.css")
|
||||
)
|
||||
)}">
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<input type="text" id="commitFilter" placeholder="Enter commit message to filter">
|
||||
<button id="filterButton">过滤</button>
|
||||
<div id="commits"></div>
|
||||
<div id="app">
|
||||
<el-input v-model="filterText" placeholder="Enter commit message to filter"></el-input>
|
||||
<el-button @click="filterCommits">过滤</el-button>
|
||||
<el-tree :data="commits" :props="defaultProps" ></el-tree>
|
||||
</div>
|
||||
<script src="${webviewView.webview.asWebviewUri(
|
||||
vscode.Uri.file(
|
||||
path.join(this.context.extensionPath, "media", "vue.js")
|
||||
)
|
||||
)}"></script>
|
||||
<script src="${webviewView.webview.asWebviewUri(
|
||||
vscode.Uri.file(
|
||||
path.join(this.context.extensionPath, "media", "elui.js")
|
||||
)
|
||||
)}"></script>
|
||||
<script>
|
||||
const vscode = acquireVsCodeApi();
|
||||
|
||||
document.getElementById('filterButton').addEventListener('click', () => {
|
||||
const filterText = document.getElementById('commitFilter').value;
|
||||
vscode.postMessage({ command: 'filterCommits', text: filterText });
|
||||
new Vue({
|
||||
el: '#app',
|
||||
data() {
|
||||
return {
|
||||
filterText: '',
|
||||
commits: [],
|
||||
defaultProps: {
|
||||
children: 'files',
|
||||
label: 'message'
|
||||
}
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
filterCommits() {
|
||||
vscode.postMessage({ command: 'filterCommits', text: this.filterText });
|
||||
},
|
||||
updateCommits(commits) {
|
||||
this.commits = commits.map(commit => ({
|
||||
message: commit.msg,
|
||||
files: commit.files.map(file => ({ message: file }))
|
||||
}));
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const root = document.documentElement;
|
||||
const observer = new MutationObserver(() => {
|
||||
root.style.setProperty('--el-color-primary', getComputedStyle(root).getPropertyValue('--vscode-button-background'));
|
||||
});
|
||||
observer.observe(root, { attributes: true, attributeFilter: ['style'] });
|
||||
|
||||
console.log("mounted")
|
||||
debugger;
|
||||
window.addEventListener('message', event => {
|
||||
console.log("recv update",JSON.stringify(event.data));
|
||||
debugger;
|
||||
const message = event.data;
|
||||
switch (message.command) {
|
||||
case 'updateCommits':
|
||||
this.updateCommits(message.commits);
|
||||
break;
|
||||
}
|
||||
});
|
||||
setTimeout(()=> vscode.postMessage({ command: 'filterCommits', text: '' }),100);
|
||||
}
|
||||
});
|
||||
|
||||
function updateCommits(commits) {
|
||||
const commitsDiv = document.getElementById('commits');
|
||||
commitsDiv.innerHTML = '';
|
||||
commits.forEach(commit => {
|
||||
const commitDiv = document.createElement('div');
|
||||
commitDiv.className = 'commit';
|
||||
commitDiv.textContent = commit.message;
|
||||
commitsDiv.appendChild(commitDiv);
|
||||
});
|
||||
}
|
||||
|
||||
// 初始加载commits
|
||||
vscode.postMessage({ command: 'filterCommits', text: '' });
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
`;
|
||||
}
|
||||
|
||||
private filterCommits(filterText: string) {
|
||||
private async filterCommits(filterText: string) {
|
||||
if (this._view) {
|
||||
const commits = this._gitService.getFilteredCommits(filterText);
|
||||
this._view.webview.postMessage({ command: 'updateCommits', commits: commits });
|
||||
const commits = await this._gitService.getCommits(filterText);
|
||||
this._view.webview.postMessage({
|
||||
command: "updateCommits",
|
||||
commits
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue