133 lines
3.3 KiB
Vue
133 lines
3.3 KiB
Vue
<script>
|
|
/* global Flash */
|
|
import Store from '../stores/repo_store';
|
|
import RepoMixin from '../mixins/repo_mixin';
|
|
import Service from '../services/repo_service';
|
|
|
|
export default {
|
|
data: () => Store,
|
|
|
|
mixins: [RepoMixin],
|
|
|
|
computed: {
|
|
showCommitable() {
|
|
return this.isCommitable && this.changedFiles.length;
|
|
},
|
|
|
|
branchPaths() {
|
|
return this.changedFiles.map(f => f.path);
|
|
},
|
|
|
|
cantCommitYet() {
|
|
return !this.commitMessage || this.submitCommitsLoading;
|
|
},
|
|
|
|
filePluralize() {
|
|
return this.changedFiles.length > 1 ? 'files' : 'file';
|
|
},
|
|
},
|
|
|
|
methods: {
|
|
makeCommit() {
|
|
// see https://docs.gitlab.com/ce/api/commits.html#create-a-commit-with-multiple-files-and-actions
|
|
const commitMessage = this.commitMessage;
|
|
const actions = this.changedFiles.map(f => ({
|
|
action: 'update',
|
|
file_path: f.path,
|
|
content: f.newContent,
|
|
}));
|
|
const payload = {
|
|
branch: Store.targetBranch,
|
|
commit_message: commitMessage,
|
|
actions,
|
|
};
|
|
Store.submitCommitsLoading = true;
|
|
Service.commitFiles(payload)
|
|
.then(this.resetCommitState)
|
|
.catch(() => Flash('An error occured while committing your changes'));
|
|
},
|
|
|
|
resetCommitState() {
|
|
this.submitCommitsLoading = false;
|
|
this.changedFiles = [];
|
|
this.commitMessage = '';
|
|
this.editMode = false;
|
|
window.scrollTo(0, 0);
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<template>
|
|
<div
|
|
v-if="showCommitable"
|
|
id="commit-area">
|
|
<form
|
|
class="form-horizontal"
|
|
@submit.prevent="makeCommit">
|
|
<fieldset>
|
|
<div class="form-group">
|
|
<label class="col-md-4 control-label staged-files">
|
|
Staged files ({{changedFiles.length}})
|
|
</label>
|
|
<div class="col-md-6">
|
|
<ul class="list-unstyled changed-files">
|
|
<li
|
|
v-for="branchPath in branchPaths"
|
|
:key="branchPath">
|
|
<span class="help-block">
|
|
{{branchPath}}
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="form-group">
|
|
<label
|
|
class="col-md-4 control-label"
|
|
for="commit-message">
|
|
Commit message
|
|
</label>
|
|
<div class="col-md-6">
|
|
<textarea
|
|
id="commit-message"
|
|
class="form-control"
|
|
name="commit-message"
|
|
v-model="commitMessage">
|
|
</textarea>
|
|
</div>
|
|
</div>
|
|
<div class="form-group target-branch">
|
|
<label
|
|
class="col-md-4 control-label"
|
|
for="target-branch">
|
|
Target branch
|
|
</label>
|
|
<div class="col-md-6">
|
|
<span class="help-block">
|
|
{{targetBranch}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-offset-4 col-md-6">
|
|
<button
|
|
ref="submitCommit"
|
|
type="submit"
|
|
:disabled="cantCommitYet"
|
|
class="btn btn-success">
|
|
<i
|
|
v-if="submitCommitsLoading"
|
|
class="fa fa-spinner fa-spin"
|
|
aria-hidden="true"
|
|
aria-label="loading">
|
|
</i>
|
|
<span class="commit-summary">
|
|
Commit {{changedFiles.length}} {{filePluralize}}
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</fieldset>
|
|
</form>
|
|
</div>
|
|
</template>
|