2017-07-25 09:18:45 -04:00
< script >
2017-07-26 08:56:31 -04:00
/* global Flash */
2017-07-25 09:18:45 -04:00
import Store from './repo_store' ;
2017-07-26 08:56:31 -04:00
import Api from '../api' ;
2017-08-01 09:41:24 -04:00
import RepoMixin from './repo_mixin' ;
import Helper from './repo_helper' ;
2017-07-25 09:18:45 -04:00
const RepoCommitSection = {
data : ( ) => Store ,
2017-07-26 08:39:32 -04:00
2017-07-28 13:36:07 -04:00
mixins : [ RepoMixin ] ,
2017-08-01 09:41:24 -04:00
2017-07-28 19:33:56 -04:00
computed : {
branchPaths ( ) {
2017-08-01 09:41:24 -04:00
const branch = Helper . getBranch ( ) ;
return this . changedFiles . map ( f => Helper . getFilePathFromFullPath ( f . url , branch ) ) ;
2017-07-28 23:08:05 -04:00
} ,
filePluralize ( ) {
2017-08-01 09:41:24 -04:00
return this . changedFiles . length > 1 ? 'files' : 'file' ;
2017-07-28 23:08:05 -04:00
} ,
2017-07-28 19:33:56 -04:00
} ,
2017-07-28 13:36:07 -04:00
2017-07-25 09:18:45 -04:00
methods : {
makeCommit ( ) {
// see https://docs.gitlab.com/ce/api/commits.html#create-a-commit-with-multiple-files-and-actions
2017-07-28 19:33:56 -04:00
const branch = Helper . getBranch ( ) ;
2017-07-25 09:18:45 -04:00
const commitMessage = this . commitMessage ;
2017-08-01 11:38:00 -04:00
const actions = this . changedFiles . map ( f => ( {
action : 'update' ,
file _path : Helper . getFilePathFromFullPath ( f . url , branch ) ,
content : f . newContent ,
} ) ) ;
2017-07-25 10:54:27 -04:00
const payload = {
2017-07-28 21:52:09 -04:00
branch : Store . targetBranch ,
2017-07-25 10:54:27 -04:00
commit _message : commitMessage ,
2017-07-26 08:56:31 -04:00
actions ,
} ;
2017-07-25 22:06:12 -04:00
Store . submitCommitsLoading = true ;
2017-07-25 13:52:46 -04:00
Api . commitMultiple ( Store . projectId , payload , ( data ) => {
2017-07-25 22:06:12 -04:00
Store . submitCommitsLoading = false ;
Flash ( ` Your changes have been committed. Commit ${ data . short _id } with ${ data . stats . additions } additions, ${ data . stats . deletions } deletions. ` , 'notice' ) ;
this . changedFiles = [ ] ;
this . openedFiles = [ ] ;
this . commitMessage = '' ;
this . editMode = false ;
$ ( 'html, body' ) . animate ( { scrollTop : 0 } , 'fast' ) ;
2017-07-28 10:24:01 -04:00
} ) ;
2017-07-26 08:56:31 -04:00
} ,
2017-07-25 09:18:45 -04:00
} ,
2017-07-26 08:56:31 -04:00
} ;
2017-07-25 09:18:45 -04:00
export default RepoCommitSection ;
< / script >
< template >
< div id = "commit-area" v-if = "isCommitable && changedFiles.length" >
< form class = "form-horizontal" >
< fieldset >
< div class = "form-group" >
2017-07-27 10:49:25 -04:00
< label class = "col-md-4 control-label staged-files" > Staged files ( { { changedFiles . length } } ) < / label >
2017-07-25 09:18:45 -04:00
< div class = "col-md-4" >
2017-07-27 10:49:25 -04:00
< ul class = "list-unstyled changed-files" >
2017-07-28 19:33:56 -04:00
< li v-for = "file in branchPaths" >
< span class = "help-block" > { { file } } < / span >
2017-07-25 09:18:45 -04:00
< / li >
< / ul >
< / div >
< / div >
<!-- Textarea
-- >
< div class = "form-group" >
< label class = "col-md-4 control-label" for = "commit-message" > Commit message < / label >
< div class = "col-md-4" >
< textarea class = "form-control" id = "commit-message" name = "commit-message" v-model = "commitMessage" > < / textarea >
< / div >
< / div >
<!-- Button Drop Down
-- >
< div class = "form-group" >
< label class = "col-md-4 control-label" for = "target-branch" > Target branch < / label >
< div class = "col-md-4" >
2017-07-28 19:33:56 -04:00
< span class = "help-block" > { { targetBranch } } < / span >
2017-07-25 09:18:45 -04:00
< / div >
< / div >
< div class = "col-md-offset-4 col-md-4" >
2017-07-27 10:49:25 -04:00
< button type = "submit" : disabled = "!commitMessage || submitCommitsLoading" class = "btn btn-success submit-commit" @click.prevent ="makeCommit" >
2017-07-25 22:06:12 -04:00
< i class = "fa fa-spinner fa-spin" v-if = "submitCommitsLoading" > < / i >
2017-07-28 23:08:05 -04:00
< span class = "commit-summary" > Commit { { changedFiles . length } } { { filePluralize } } < / span >
2017-07-25 22:06:12 -04:00
< / button >
2017-07-25 09:18:45 -04:00
< / div >
< / fieldset >
< / form >
< / div >
2017-07-26 08:39:32 -04:00
< / template >