MigrateRepos/AutoCommit
1
0
Fork 0
mirror of https://github.com/OBKoro1/autoCommit.git synced 2024-11-16 23:49:29 +08:00
Code Issues Projects Releases Wiki Activity
8bf8eb9b92
AutoCommit/src/views/autoCommit.html

343 lines
12 KiB
HTML
Raw Normal View History

init
2019-12-26 17:47:37 +08:00
<!DOCTYPE html>
<html>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Github自动提交commit工具</title>
<link href="../assets/styles/element-ui2.13.min.css" rel="stylesheet" />
<link href="../assets/styles/base.css" rel="stylesheet" />
<link href="../assets/styles/autoCommit.css" rel="stylesheet" />
</head>
<body>
<div id="app">
<div class="form-title">Github自动提交commit工具</div>
<el-container>
<el-main>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-form ref="form" :model="form" :rules="rules" label-width="180px">
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
<el-form-item class="form_item" prop="itemSrc">
<label slot="label">
<el-tooltip class="item" content="要提交commit的仓库文件夹" placement="top-start">
<span>项目地址 :</span>
</el-tooltip>
</label>
commit 流程ing
2019-12-30 21:13:08 +08:00
<span @click="chooseItem">{{ form.itemSrc }}</span>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-input>
</el-form-item>
<el-form-item class="form_item" prop="fileName">
<label slot="label">
<el-tooltip class="item" content="默认写入commit内容的文件,位于项目的根目录，不存在会自动创建" placement="top-start">
<span>commit文件 :</span>
</el-tooltip>
</label>
<el-input class="input_form" v-model="form.fileName" @change="fileNameChange"></el-input>
</el-input>
</el-form-item>
<el-form-item class="form_item" prop="commitMsg">
<label slot="label">
issue
2020-01-04 14:12:29 +08:00
<el-tooltip class="item" content="每个提交的统一commit message" placement="top-start">
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
<span>commit信息 :</span>
</el-tooltip>
</label>
<el-input class="input_form" v-model="form.commitMsg" @change="commitMsgChange"></el-input>
</el-input>
</el-form-item>
<el-form-item class="form_item" prop="commitNumber">
<label slot="label">
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-tooltip class="item" content="时间范围内默认每个日期需要commit的次数" placement="top-start">
<span>默认commit次数 :</span>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-tooltip>
</label>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-input-number v-model="form.commitNumber" :step="1" :min="1" :max="100" size="large"></el-input-number>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-form-item>
<el-form-item v-for="(ele, index) in form.timeArr" :key="index" :prop="'timeArr.' + index + '.value'" :rules="{
required: true, message: '日期不能为空', trigger: 'blur'
}">
<label slot="label">
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-tooltip class="item" content="要commit的日期范围" placement="top-start">
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
<span>commit日期范围{{index+1}} :</span>
</el-tooltip>
</label>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-date-picker v-model="ele.value" type="daterange" value-format="yyyy-MM-dd"
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
</el-date-picker>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
</el-form-item>
<el-form-item v-for="(ele, index) in form.timeArr" :key="index">
<label slot="label">
<el-tooltip class="item" content="可选(默认使用默认commit次数)：对应index的日期范围每个日期的commit次数" placement="top-start">
<span>该范围每天提交次数{{index+1}} :</span>
</el-tooltip>
</label>
<el-input-number v-model="ele.commitNumber" :step="1" :min="0" :max="100" ></el-input-number>
exec异步问题
2020-01-02 14:19:05 +08:00
<el-button @click.prevent="removeTime(index)" :disabled="form.timeArr.length === 1">删除</el-button>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-form-item>
<el-form-item>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-button type="primary" @click="submitForm('form')" :disabled="runNow === 1 && runNow !== 0">开始commit</el-button>
<el-button @click="addTimeRange" :disabled="runNow === 1">新增日期范围</el-button>
<el-button @click="reset" :disabled="runNow !== 1">取消commit</el-button>
<el-button @click="clearLog" :disabled="showText.logStr === ''">清空日志</el-button>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-form-item>
</el-form>
commit 流程ing
2019-12-30 21:13:08 +08:00
<div class="form-title2">日志和文档</div>
webview style
2019-12-27 17:05:55 +08:00
<el-main>
commit 流程ing
2019-12-30 21:13:08 +08:00
<div class="log_form_father">
<el-form label-width="160px">
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-form-item>
<label slot="label">
<el-tooltip content="通过日志了解插件运行信息" placement="top-start">
<span>插件运行日志 :</span>
</el-tooltip>
</label>
commit 流程ing
2019-12-30 21:13:08 +08:00
<el-input @input="formatLog" type="textarea"
:autosize="{ minRows: 1, maxRows: 8}"
placeholder="无法输入 仅用于展示" v-model="showText.logStr" :disabled="runNow === 1 || runNow === 0">
</el-form-item>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-form-item>
<label slot="label">
<el-tooltip content="点击开始commit,插件运行所需要的参数" placement="top-start">
一次性push
2020-01-06 16:10:26 +08:00
<span>插件参数 :</span>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
</el-tooltip>
</label>
commit 流程ing
2019-12-30 21:13:08 +08:00
<el-input @input="watchParamsChange" type="textarea"
:autosize="{ minRows: 1, maxRows: 4}"
placeholder="无法输入 仅用于展示" v-model="showText.paramsStr" :disabled="showText.paramsStr === ''">
</el-form-item>
某天的随机时间
2020-01-01 18:06:58 +08:00
<!-- TODO: 链接 -->
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<el-form-item label="请先阅读文档 :">
commit 流程ing
2019-12-30 21:13:08 +08:00
<el-link href="https://element.eleme.io" type="primary" target="_blank">Readme</el-link>
<el-link href="https://element.eleme.io" type="primary" target="_blank">更新日志</el-link>
</el-form-item>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
<div class="tip">觉得这个插件还不错的话, 请给我点个<el-link href="https://github.com/OBKoro1/autoCommit" type="primary" target="_blank">Star⭐️</el-link>吧~</div>
exec异步问题
2020-01-02 14:19:05 +08:00
<div v-if="!isProduction">
<div>{{ showText.logArr }}</div>
</div>
</el-form>
commit 流程ing
2019-12-30 21:13:08 +08:00
</div>
webview style
2019-12-27 17:05:55 +08:00
</el-main>
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</el-main>
</el-container>
</div>
</div>
</body>
<script src="../assets/scripts/vue.min.js"></script>
<script src="../assets/scripts/element2.13.min.js"></script>
<script>
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
let isWeb = false // 是否网页 不在vscode插件生态内
let vscode;
try{
vscode = acquireVsCodeApi()
}catch(err){
isWeb = true
}
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
new Vue({
el: '#app',
data() {
// 项目地址验证
const itemSrcCheck = (rule, value, callback) => {
if (value !== '点击选择要commit的项目文件夹') {
callback();
} else {
callback(new Error('请选择要commit的项目文件夹'));
}
}
return {
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
isProduction: false, // 是否为调试模式
mockLogTime: null, // 模拟数据的定时器
commit 流程ing
2019-12-30 21:13:08 +08:00
showText:{
oldParams: '', // 保存的参数
paramsStr: '', // commit参数
logArr: [], // 保存的日志
logStr: '', //
exec异步问题
2020-01-02 14:19:05 +08:00
command: [],
data: []
commit 流程ing
2019-12-30 21:13:08 +08:00
},
runNow: 0, // 0 初始化 1运行中 2运行结束 3取消运行
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
form: {
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
// TODO: 保存其他几个参数
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
// itemSrc: '/Users/koro/work/web_my/testCommit',
itemSrc: '点击选择要commit的项目文件夹',
fileName: 'commit.md',
commitMsg: 'autoCommit',
timeArr: [
{
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
value: '',
commitNumber: 0
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
}
],
commitNumber: 1,
},
rules: {
'itemSrc': [
{
validator: itemSrcCheck, // 项目地址
required: true,
message: '请选择要commit的项目文件夹'
}
],
'fileName': [
{
required: true,
message: '请选择要写入内容的文件'
}
],
'commitMsg': [
{
required: true,
message: '请填入要commit的内容'
}
],
'commitNumber': [
{
required: true
}
]
}
};
},
mounted() {
commit 流程ing
2019-12-30 21:13:08 +08:00
this.initListener();
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
if(isWeb){
this.form.itemSrc = '随便一个地址'
}
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
},
methods: {
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.runCommit()
} else {
return false;
webview style
2019-12-27 17:05:55 +08:00
}
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
});
init
2019-12-26 17:47:37 +08:00
},
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
// 开始commit
runCommit() {
commit 流程ing
2019-12-30 21:13:08 +08:00
this.runNow = 1
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
this.clearLog()
this.showText.paramsStr = JSON.stringify(this.form)
commit 流程ing
2019-12-30 21:13:08 +08:00
this.showText.oldParams = this.showText.paramsStr
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
if(isWeb){
this.mockLog()
}else{
this.postMessage('commit', this.form);
}
init
2019-12-26 17:47:37 +08:00
},
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
// 发送消息到插件
commit 流程ing
2019-12-30 21:13:08 +08:00
postMessage(command, data) {
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
vscode.postMessage({
command,
data
});
},
vscode向webview通信
2019-12-31 18:01:35 +08:00
logDebug(command,data){
this.showText.logArr.unshift(`command: ${command}`);
this.showText.logArr.unshift(`数据: ${data}`);
this.formatLog()
},
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
// 接收日志
vscode向webview通信
2019-12-31 18:01:35 +08:00
acceptLogFn(paramArr){
const logStr = paramArr.join(' ')
this.showText.logArr.unshift(logStr);
this.formatLog()
},
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
// 注册
initListener() {
vscode向webview通信
2019-12-31 18:01:35 +08:00
window.onmessage = (e) =>{
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
const { command, data } = event.data;
exec异步问题
2020-01-02 14:19:05 +08:00
this.showText.command.unshift(command)
this.showText.data.unshift(data)
vscode向webview通信
2019-12-31 18:01:35 +08:00
if (command === 'choose item success') {
// 选择文件夹成功
this.form.itemSrc = data
}else if(command === 'choose item error'){
this.$message({
type: 'error',
showClose: true,
message: `${data}根目录没有.git文件夹`,
duration: 0
});
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
} else if(command === 'commit 完成'){
// commit 完成
this.runNow = 2
vscode向webview通信
2019-12-31 18:01:35 +08:00
} else if(command === 'console-log'){
this.acceptLogFn(data)
}else if(command === 'isProduction'){
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
// 调试模式 查看通信
vscode向webview通信
2019-12-31 18:01:35 +08:00
this.isProduction = data
}
exec异步问题
2020-01-02 14:19:05 +08:00
if(!this.isProduction && false){
vscode向webview通信
2019-12-31 18:01:35 +08:00
this.logDebug(command, data)
}
}
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
},
// 重置： commit成功和中断commit
reset() {
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
this.runNow = 3;
if(isWeb){
clearInterval(this.mockLogTime)
this.mockLogTime = null
} else{
this.postMessage('cancel autoCommit')
}
commit 流程ing
2019-12-30 21:13:08 +08:00
},
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
// 模拟日志 写html时用
commit 流程ing
2019-12-30 21:13:08 +08:00
mockLog(){
this.showText.logArr = [
'res 开始 undefined',
'res 结束',
'log 开始 [{"commit": "a6b5f3d","author": "OBKoro1 <1677593011@qq.com>","date": "2019-12-26 21:05:57 +0800","message": "init"}]',
'log 结束',
'commit内容 2019-12-27T08:00:00+08:000',
'总commit次数1'
]
let num = 0;
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
this.mockLogTime = setInterval(() => {
commit 流程ing
2019-12-30 21:13:08 +08:00
if(num< 100){
num++
this.showText.logArr.unshift(`一些文字${num}`)
this.formatLog()
}else{
this.reset()
}
}, 1000);
},
clearLog(){
this.showText.logArr = []
this.showText.logStr = ''
},
formatLog(){
this.showText.logStr = this.showText.logArr.join(`\n`)
},
watchParamsChange(){
this.showText.paramsStr = this.showText.oldParams
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
},
// 删除时间
removeTime(index) {
this.form.timeArr.splice(index, 1)
},
commit 流程ing
2019-12-30 21:13:08 +08:00
chooseItem() {
this.postMessage('choose-item')
},
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
// 增加时间范围选择
addTimeRange() {
this.form.timeArr.push({
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
value: '',
commitNumber: 0
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
});
},
fileNameChange(value) {
if (value === '') {
this.form.fileName = 'commit.md'
webview init
2019-12-27 16:02:37 +08:00
}
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
},
commitMsgChange(value) {
if (value === '') {
this.form.commitMsg = 'autoCommit'
}
},
}
数据格式重构以及完成测试模式
2020-01-01 17:37:28 +08:00
});
webview 验证和日期，数据传参等
2019-12-29 19:51:53 +08:00
</script>
</html>
Reference in New Issue Copy Permalink