forked from gitea/gitea
		
	Use Vue to refactor pull merge UI (#19650)
* Use Vue to refactor pull merge UI * add comments * fix comments * small fine tune * fix tests * adopt new pull default messages * clean up Co-authored-by: 6543 <6543@obermui.de>
This commit is contained in:
		
							parent
							
								
									d985dcc922
								
							
						
					
					
						commit
						368baf9e77
					
				| @ -37,10 +37,8 @@ func testPullMerge(t *testing.T, session *TestSession, user, repo, pullnum strin | ||||
| 	req := NewRequest(t, "GET", path.Join(user, repo, "pulls", pullnum)) | ||||
| 	resp := session.MakeRequest(t, req, http.StatusOK) | ||||
| 
 | ||||
| 	// Click the little green button to create a pull | ||||
| 	htmlDoc := NewHTMLParser(t, resp.Body) | ||||
| 	link, exists := htmlDoc.doc.Find(".ui.form." + string(mergeStyle) + "-fields > form").Attr("action") | ||||
| 	assert.True(t, exists, "The template has changed") | ||||
| 	link := path.Join(user, repo, "pulls", pullnum, "merge") | ||||
| 	req = NewRequestWithValues(t, "POST", link, map[string]string{ | ||||
| 		"_csrf": htmlDoc.GetCSRF(), | ||||
| 		"do":    string(mergeStyle), | ||||
| @ -57,7 +55,7 @@ func testPullCleanUp(t *testing.T, session *TestSession, user, repo, pullnum str | ||||
| 	// Click the little green button to create a pull | ||||
| 	htmlDoc := NewHTMLParser(t, resp.Body) | ||||
| 	link, exists := htmlDoc.doc.Find(".timeline-item .delete-button").Attr("data-url") | ||||
| 	assert.True(t, exists, "The template has changed") | ||||
| 	assert.True(t, exists, "The template has changed, can not find delete button url") | ||||
| 	req = NewRequestWithValues(t, "POST", link, map[string]string{ | ||||
| 		"_csrf": htmlDoc.GetCSRF(), | ||||
| 	}) | ||||
|  | ||||
| @ -150,24 +150,6 @@ func (cfg *PullRequestsConfig) GetDefaultMergeStyle() MergeStyle { | ||||
| 	return MergeStyleMerge | ||||
| } | ||||
| 
 | ||||
| // AllowedMergeStyleCount returns the total count of allowed merge styles for the PullRequestsConfig | ||||
| func (cfg *PullRequestsConfig) AllowedMergeStyleCount() int { | ||||
| 	count := 0 | ||||
| 	if cfg.AllowMerge { | ||||
| 		count++ | ||||
| 	} | ||||
| 	if cfg.AllowRebase { | ||||
| 		count++ | ||||
| 	} | ||||
| 	if cfg.AllowRebaseMerge { | ||||
| 		count++ | ||||
| 	} | ||||
| 	if cfg.AllowSquash { | ||||
| 		count++ | ||||
| 	} | ||||
| 	return count | ||||
| } | ||||
| 
 | ||||
| // BeforeSet is invoked from XORM before setting the value of a field of this object. | ||||
| func (r *RepoUnit) BeforeSet(colName string, val xorm.Cell) { | ||||
| 	switch colName { | ||||
|  | ||||
| @ -322,176 +322,69 @@ | ||||
| 						{{$prUnit := .Repository.MustGetUnit $.UnitTypePullRequests}} | ||||
| 						{{$approvers := .Issue.PullRequest.GetApprovers}} | ||||
| 						{{if or $prUnit.PullRequestsConfig.AllowMerge $prUnit.PullRequestsConfig.AllowRebase $prUnit.PullRequestsConfig.AllowRebaseMerge $prUnit.PullRequestsConfig.AllowSquash}} | ||||
| 
 | ||||
| 							<div class="ui divider"></div> | ||||
| 							{{if $prUnit.PullRequestsConfig.AllowMerge}} | ||||
| 							<div class="ui form merge-fields" style="display: none"> | ||||
| 								<form action="{{.Link}}/merge" method="post"> | ||||
| 									{{.CsrfTokenHtml}} | ||||
| 									<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}"> | ||||
| 									<div class="field"> | ||||
| 										<input type="text" name="merge_title_field" value="{{.DefaultMergeMessage}}"> | ||||
| 									</div> | ||||
| 									<div class="field"> | ||||
| 										<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">Reviewed-on: {{$.Issue.HTMLURL}}
{{$approvers}}</textarea> | ||||
| 									</div> | ||||
| 									<button class="ui green button" type="submit" name="do" value="merge"> | ||||
| 										{{$.i18n.Tr "repo.pulls.merge_pull_request"}} | ||||
| 									</button> | ||||
| 									<button class="ui button merge-cancel"> | ||||
| 										{{$.i18n.Tr "cancel"}} | ||||
| 									</button> | ||||
| 									{{if .IsPullBranchDeletable}} | ||||
| 										<div class="ui checkbox ml-2"> | ||||
| 											<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}> | ||||
| 											<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label> | ||||
| 										</div> | ||||
| 									{{end}} | ||||
| 								</form> | ||||
| 							</div> | ||||
| 							{{end}} | ||||
| 							{{if $prUnit.PullRequestsConfig.AllowRebase}} | ||||
| 							<div class="ui form rebase-fields" style="display: none"> | ||||
| 								<form action="{{.Link}}/merge" method="post"> | ||||
| 									{{.CsrfTokenHtml}} | ||||
| 									<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}"> | ||||
| 									<button class="ui green button" type="submit" name="do" value="rebase"> | ||||
| 										{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}} | ||||
| 									</button> | ||||
| 									<button class="ui button merge-cancel"> | ||||
| 										{{$.i18n.Tr "cancel"}} | ||||
| 									</button> | ||||
| 									{{if .IsPullBranchDeletable}} | ||||
| 										<div class="ui checkbox ml-2"> | ||||
| 											<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}> | ||||
| 											<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label> | ||||
| 										</div> | ||||
| 									{{end}} | ||||
| 								</form> | ||||
| 							</div> | ||||
| 							{{end}} | ||||
| 							{{if $prUnit.PullRequestsConfig.AllowRebaseMerge}} | ||||
| 							<div class="ui form rebase-merge-fields" style="display: none"> | ||||
| 								<form action="{{.Link}}/merge" method="post"> | ||||
| 									{{.CsrfTokenHtml}} | ||||
| 									<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}"> | ||||
| 									<div class="field"> | ||||
| 										<input type="text" name="merge_title_field" value="{{.DefaultMergeMessage}}"> | ||||
| 									</div> | ||||
| 									<div class="field"> | ||||
| 										<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">Reviewed-on: {{$.Issue.HTMLURL}}
{{$approvers}}</textarea> | ||||
| 									</div> | ||||
| 									<button class="ui green button" type="submit" name="do" value="rebase-merge"> | ||||
| 										{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}} | ||||
| 									</button> | ||||
| 									<button class="ui button merge-cancel"> | ||||
| 										{{$.i18n.Tr "cancel"}} | ||||
| 									</button> | ||||
| 									{{if .IsPullBranchDeletable}} | ||||
| 										<div class="ui checkbox ml-2"> | ||||
| 											<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}> | ||||
| 											<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label> | ||||
| 										</div> | ||||
| 									{{end}} | ||||
| 								</form> | ||||
| 							</div> | ||||
| 							{{end}} | ||||
| 							{{if $prUnit.PullRequestsConfig.AllowSquash}} | ||||
| 							<div class="ui form squash-fields" style="display: none"> | ||||
| 								<form action="{{.Link}}/merge" method="post"> | ||||
| 									{{.CsrfTokenHtml}} | ||||
| 									<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}"> | ||||
| 									<div class="field"> | ||||
| 										<input type="text" name="merge_title_field" value="{{.DefaultSquashMergeMessage}}"> | ||||
| 									</div> | ||||
| 									<div class="field"> | ||||
| 										<textarea name="merge_message_field" rows="5" placeholder="{{$.i18n.Tr "repo.editor.commit_message_desc"}}">{{.GetCommitMessages}}Reviewed-on: {{$.Issue.HTMLURL}}
{{$approvers}}</textarea> | ||||
| 									</div> | ||||
| 									<button class="ui green button" type="submit" name="do" value="squash"> | ||||
| 										{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}} | ||||
| 									</button> | ||||
| 									<button class="ui button merge-cancel"> | ||||
| 										{{$.i18n.Tr "cancel"}} | ||||
| 									</button> | ||||
| 									{{if .IsPullBranchDeletable}} | ||||
| 										<div class="ui checkbox ml-2"> | ||||
| 											<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}> | ||||
| 											<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label> | ||||
| 										</div> | ||||
| 									{{end}} | ||||
| 								</form> | ||||
| 							</div> | ||||
| 							{{end}} | ||||
| 							{{if and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}} | ||||
| 								<div class="ui form manually-merged-fields" style="display: none"> | ||||
| 									<form action="{{.Link}}/merge" method="post"> | ||||
| 										{{.CsrfTokenHtml}} | ||||
| 										<input type="hidden" name="head_commit_id" value="{{.PullHeadCommitID}}"> | ||||
| 										<div class="field"> | ||||
| 											<input type="text" name="merge_commit_id"  placeholder="{{$.i18n.Tr "repo.pulls.merge_commit_id"}}"> | ||||
| 										</div> | ||||
| 										<button class="ui red button" type="submit" name="do" value="manually-merged"> | ||||
| 											{{$.i18n.Tr "repo.pulls.merge_manually"}} | ||||
| 										</button> | ||||
| 										<button class="ui button merge-cancel"> | ||||
| 											{{$.i18n.Tr "cancel"}} | ||||
| 										</button> | ||||
| 										{{if .IsPullBranchDeletable}} | ||||
| 											<div class="ui checkbox ml-2"> | ||||
| 												<input name="delete_branch_after_merge" type="checkbox" {{if $prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}checked{{end}}> | ||||
| 												<label>{{$.i18n.Tr "repo.branch.delete" .HeadTarget}}</label> | ||||
| 											</div> | ||||
| 										{{end}} | ||||
| 									</form> | ||||
| 								</div> | ||||
| 							{{end}} | ||||
| 							<div class="dib"> | ||||
| 								<div class="ui {{if $notAllOverridableChecksOk}}red{{else}}green{{end}} buttons merge-button"> | ||||
| 									<button class="ui button" data-do="{{.MergeStyle}}"> | ||||
| 										{{svg "octicon-git-merge"}} | ||||
| 										<span class="button-text"> | ||||
| 										{{if eq .MergeStyle "merge"}} | ||||
| 											{{$.i18n.Tr "repo.pulls.merge_pull_request"}} | ||||
| 										{{end}} | ||||
| 										{{if eq .MergeStyle "rebase"}} | ||||
| 											{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}} | ||||
| 										{{end}} | ||||
| 										{{if eq .MergeStyle "rebase-merge"}} | ||||
| 											{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}} | ||||
| 										{{end}} | ||||
| 										{{if eq .MergeStyle "squash"}} | ||||
| 											{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}} | ||||
| 										{{end}} | ||||
| 										{{if eq .MergeStyle "manually-merged"}} | ||||
| 											{{$.i18n.Tr "repo.pulls.merge_manually"}} | ||||
| 										{{end}} | ||||
| 										</span> | ||||
| 									</button> | ||||
| 									{{if gt $prUnit.PullRequestsConfig.AllowedMergeStyleCount 1}} | ||||
| 										<div class="ui dropdown icon button no-text"> | ||||
| 											{{svg "octicon-triangle-down" 14 "dropdown icon"}} | ||||
| 											<div class="menu"> | ||||
| 												{{if $prUnit.PullRequestsConfig.AllowMerge}} | ||||
| 												<div class="item{{if eq .MergeStyle "merge"}} active selected{{end}}" data-do="merge">{{$.i18n.Tr "repo.pulls.merge_pull_request"}}</div> | ||||
| 												{{end}} | ||||
| 												{{if $prUnit.PullRequestsConfig.AllowRebase}} | ||||
| 												<div class="item{{if eq .MergeStyle "rebase"}} active selected{{end}}" data-do="rebase">{{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}}</div> | ||||
| 												{{end}} | ||||
| 												{{if $prUnit.PullRequestsConfig.AllowRebaseMerge}} | ||||
| 												<div class="item{{if eq .MergeStyle "rebase-merge"}} active selected{{end}}" data-do="rebase-merge">{{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}}</div> | ||||
| 												{{end}} | ||||
| 												{{if $prUnit.PullRequestsConfig.AllowSquash}} | ||||
| 												<div class="item{{if eq .MergeStyle "squash"}} active selected{{end}}" data-do="squash">{{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}}</div> | ||||
| 												{{end}} | ||||
| 												{{if and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}} | ||||
| 												<div class="item{{if eq .MergeStyle "manually-merged"}} active selected{{end}}" data-do="manually-merged">{{$.i18n.Tr "repo.pulls.merge_manually"}}</div> | ||||
| 												{{end}} | ||||
| 											</div> | ||||
| 										</div> | ||||
| 									{{end}} | ||||
| 								</div> | ||||
| 							</div> | ||||
| 
 | ||||
| 							<script> | ||||
| 								<!-- /* eslint-disable */ --> | ||||
| 								(() => { | ||||
| 									const defaultMergeTitle = {{.DefaultMergeMessage}}; | ||||
| 									const defaultSquashMergeTitle = {{.DefaultSquashMergeMessage}}; | ||||
| 									const defaultMergeMessage = 'Reviewed-on: ' + {{$.Issue.HTMLURL}} + '\n' + {{$approvers}}; | ||||
| 									const mergeForm = { | ||||
| 										'baseLink': {{.Link}}, | ||||
| 										'textCancel': {{$.i18n.Tr "cancel"}}, | ||||
| 										'textDeleteBranch': {{$.i18n.Tr "repo.branch.delete" .HeadTarget}}, | ||||
| 
 | ||||
| 										'allOverridableChecksOk': {{not $notAllOverridableChecksOk}}, | ||||
| 										'pullHeadCommitID': {{.PullHeadCommitID}}, | ||||
| 										'isPullBranchDeletable': {{.IsPullBranchDeletable}}, | ||||
| 										'defaultDeleteBranchAfterMerge': {{$prUnit.PullRequestsConfig.DefaultDeleteBranchAfterMerge}}, | ||||
| 										'mergeMessageFieldPlaceHolder': {{$.i18n.Tr "repo.editor.commit_message_desc"}}, | ||||
| 									}; | ||||
| 									mergeForm['mergeStyles'] = [ | ||||
| 										{ | ||||
| 											'name': 'merge', | ||||
| 											'allowed': {{$prUnit.PullRequestsConfig.AllowMerge}}, | ||||
| 											'textDoMerge': {{$.i18n.Tr "repo.pulls.merge_pull_request"}}, | ||||
| 											'mergeTitleFieldText': defaultMergeTitle, | ||||
| 											'mergeMessageFieldText': defaultMergeMessage, | ||||
| 										}, | ||||
| 										{ | ||||
| 											'name': 'rebase', | ||||
| 											'allowed': {{$prUnit.PullRequestsConfig.AllowRebase}}, | ||||
| 											'textDoMerge': {{$.i18n.Tr "repo.pulls.rebase_merge_pull_request"}}, | ||||
| 											'hideMergeMessageTexts': true, | ||||
| 										}, | ||||
| 										{ | ||||
| 											'name': 'rebase-merge', | ||||
| 											'allowed': {{$prUnit.PullRequestsConfig.AllowRebaseMerge}}, | ||||
| 											'textDoMerge': {{$.i18n.Tr "repo.pulls.rebase_merge_commit_pull_request"}}, | ||||
| 											'mergeTitleFieldText': defaultMergeTitle, | ||||
| 											'mergeMessageFieldText': defaultMergeMessage, | ||||
| 										}, | ||||
| 										{ | ||||
| 											'name': 'squash', | ||||
| 											'allowed': {{$prUnit.PullRequestsConfig.AllowSquash}}, | ||||
| 											'textDoMerge': {{$.i18n.Tr "repo.pulls.squash_merge_pull_request"}}, | ||||
| 											'mergeTitleFieldText': defaultSquashMergeTitle, | ||||
| 											'mergeMessageFieldText': defaultMergeMessage, | ||||
| 										}, | ||||
| 										{ | ||||
| 											'name': 'manually-merged', | ||||
| 											'allowed': {{and $prUnit.PullRequestsConfig.AllowManualMerge $.IsRepoAdmin}}, | ||||
| 											'textDoMerge': {{$.i18n.Tr "repo.pulls.merge_manually"}}, | ||||
| 											'hideMergeMessageTexts': true, | ||||
| 										} | ||||
| 									]; | ||||
| 									window.config.pageData.pullRequestMergeForm = mergeForm; | ||||
| 								})(); | ||||
| 							</script> | ||||
| 
 | ||||
| 							<div id="pull-request-merge-form"></div> | ||||
| 
 | ||||
| 							{{if .ShowMergeInstructions}} | ||||
| 								<div class="instruct-toggle ml-3"> {{$.i18n.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div> | ||||
| 								<div class="instruct-toggle mt-3"> {{$.i18n.Tr "repo.pulls.merge_instruction_hint" | Safe}} </div> | ||||
| 								<div class="instruct-content" style="display:none"> | ||||
| 									<div class="ui divider"></div> | ||||
| 									<div><h3 class="di">{{$.i18n.Tr "step1"}} </h3>{{$.i18n.Tr "repo.pulls.merge_instruction_step1_desc"}}</div> | ||||
|  | ||||
							
								
								
									
										127
									
								
								web_src/js/components/PullRequestMergeForm.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										127
									
								
								web_src/js/components/PullRequestMergeForm.vue
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,127 @@ | ||||
| <template> | ||||
|   <div> | ||||
|     <div class="ui form" v-if="showActionForm"> | ||||
|       <form :action="mergeForm.baseLink+'/merge'" method="post"> | ||||
|         <input type="hidden" name="_csrf" :value="csrfToken"> | ||||
|         <input type="hidden" name="head_commit_id" v-model="mergeForm.pullHeadCommitID"> | ||||
| 
 | ||||
|         <template v-if="!mergeStyleDetail.hideMergeMessageTexts"> | ||||
|           <div class="field"> | ||||
|             <input type="text" name="merge_title_field" v-model="mergeTitleFieldValue"> | ||||
|           </div> | ||||
|           <div class="field"> | ||||
|             <textarea name="merge_message_field" rows="5" :placeholder="mergeForm.mergeMessageFieldPlaceHolder" v-model="mergeMessageFieldValue"/> | ||||
|           </div> | ||||
|         </template> | ||||
| 
 | ||||
|         <button class="ui button" :class="[mergeForm.allOverridableChecksOk?'green':'red']" type="submit" name="do" :value="mergeStyle"> | ||||
|           {{ mergeStyleDetail.textDoMerge }} | ||||
|         </button> | ||||
| 
 | ||||
|         <button class="ui button merge-cancel" @click="toggleActionForm(false)"> | ||||
|           {{ mergeForm.textCancel }} | ||||
|         </button> | ||||
| 
 | ||||
|         <div class="ui checkbox ml-2" v-if="mergeForm.isPullBranchDeletable"> | ||||
|           <input name="delete_branch_after_merge" type="checkbox" v-model="deleteBranchAfterMerge" id="delete-branch-after-merge"> | ||||
|           <label for="delete-branch-after-merge">{{ mergeForm.textDeleteBranch }}</label> | ||||
|         </div> | ||||
|       </form> | ||||
|     </div> | ||||
| 
 | ||||
|     <template v-if="!showActionForm"> | ||||
|       <div class="ui buttons merge-button" :class="[mergeForm.allOverridableChecksOk?'green':'red']" @click="toggleActionForm(true)"> | ||||
|         <button class="ui button"> | ||||
|           <svg-icon name="octicon-git-merge"/> | ||||
|           <span class="button-text">{{ mergeStyleDetail.textDoMerge }}</span> | ||||
|         </button> | ||||
|         <div class="ui dropdown icon button no-text" @click.stop="showMergeStyleMenu = !showMergeStyleMenu" v-if="mergeStyleAllowedCount>1"> | ||||
|           <svg-icon name="octicon-triangle-down" :size="14"/> | ||||
|           <div class="menu" :class="{'show':showMergeStyleMenu}"> | ||||
|             <template v-for="msd in mergeForm.mergeStyles"> | ||||
|               <div class="item" v-if="msd.allowed" :key="msd.name" @click.stop="mergeStyle=msd.name"> | ||||
|                 {{ msd.textDoMerge }} | ||||
|               </div> | ||||
|             </template> | ||||
|           </div> | ||||
|         </div> | ||||
|       </div> | ||||
|     </template> | ||||
|   </div> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
| import {SvgIcon} from '../svg.js'; | ||||
| 
 | ||||
| const {csrfToken, pageData} = window.config; | ||||
| 
 | ||||
| export default { | ||||
|   name: 'PullRequestMergeForm', | ||||
|   components: { | ||||
|     SvgIcon, | ||||
|   }, | ||||
| 
 | ||||
|   data: () => ({ | ||||
|     csrfToken, | ||||
|     mergeForm: pageData.pullRequestMergeForm, | ||||
| 
 | ||||
|     mergeTitleFieldValue: '', | ||||
|     mergeMessageFieldValue: '', | ||||
|     deleteBranchAfterMerge: false, | ||||
| 
 | ||||
|     mergeStyle: '', | ||||
|     mergeStyleDetail: { // dummy only, these values will come from one of the mergeForm.mergeStyles | ||||
|       hideMergeMessageTexts: false, | ||||
|       textDoMerge: '', | ||||
|       mergeTitleFieldText: '', | ||||
|       mergeMessageFieldText: '', | ||||
|     }, | ||||
|     mergeStyleAllowedCount: 0, | ||||
| 
 | ||||
|     showMergeStyleMenu: false, | ||||
|     showActionForm: false, | ||||
|   }), | ||||
| 
 | ||||
|   watch: { | ||||
|     mergeStyle(val) { | ||||
|       this.mergeStyleDetail = this.mergeForm.mergeStyles.find((e) => e.name === val); | ||||
|     } | ||||
|   }, | ||||
| 
 | ||||
|   created() { | ||||
|     this.mergeStyleAllowedCount = this.mergeForm.mergeStyles.reduce((v, msd) => v + (msd.allowed ? 1 : 0), 0); | ||||
|     this.mergeStyle = this.mergeForm.mergeStyles.find((e) => e.allowed)?.name; | ||||
|   }, | ||||
| 
 | ||||
|   mounted() { | ||||
|     document.addEventListener('mouseup', this.hideMergeStyleMenu); | ||||
|   }, | ||||
| 
 | ||||
|   unmounted() { | ||||
|     document.removeEventListener('mouseup', this.hideMergeStyleMenu); | ||||
|   }, | ||||
| 
 | ||||
|   methods: { | ||||
|     hideMergeStyleMenu() { | ||||
|       this.showMergeStyleMenu = false; | ||||
|     }, | ||||
|     toggleActionForm(show) { | ||||
|       this.showActionForm = show; | ||||
|       if (!show) return; | ||||
|       this.deleteBranchAfterMerge = this.mergeForm.defaultDeleteBranchAfterMerge; | ||||
|       this.mergeTitleFieldValue = this.mergeStyleDetail.mergeTitleFieldText; | ||||
|       this.mergeMessageFieldValue = this.mergeStyleDetail.mergeMessageFieldText; | ||||
|     } | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
| 
 | ||||
| <style scoped> | ||||
| /* to keep UI the same, at the moment we are still using some Fomantic UI styles, but we do not use their scripts, so we need to fine tune some styles */ | ||||
| .ui.dropdown .menu.show { | ||||
|   display: block; | ||||
| } | ||||
| .ui.checkbox label { | ||||
|   cursor: pointer; | ||||
| } | ||||
| </style> | ||||
							
								
								
									
										12
									
								
								web_src/js/features/repo-issue-pr-form.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										12
									
								
								web_src/js/features/repo-issue-pr-form.js
									
									
									
									
									
										Normal file
									
								
							| @ -0,0 +1,12 @@ | ||||
| import Vue from 'vue'; | ||||
| import PullRequestMergeForm from '../components/PullRequestMergeForm.vue'; | ||||
| 
 | ||||
| export default function initPullRequestMergeForm() { | ||||
|   const el = document.getElementById('pull-request-merge-form'); | ||||
|   if (!el) return; | ||||
| 
 | ||||
|   const View = Vue.extend({ | ||||
|     render: (createElement) => createElement(PullRequestMergeForm), | ||||
|   }); | ||||
|   new View().$mount(el); | ||||
| } | ||||
| @ -234,32 +234,6 @@ export function initRepoIssueStatusButton() { | ||||
|   }); | ||||
| } | ||||
| 
 | ||||
| export function initRepoPullRequestMerge() { | ||||
|   // Pull Request merge button
 | ||||
|   const $mergeButton = $('.merge-button > button'); | ||||
|   $mergeButton.on('click', function (e) { | ||||
|     e.preventDefault(); | ||||
|     $(`.${$(this).data('do')}-fields`).show(); | ||||
|     $(this).parent().hide(); | ||||
|     $('.instruct-toggle').hide(); | ||||
|     $('.instruct-content').hide(); | ||||
|   }); | ||||
|   $('.merge-button > .dropdown').dropdown({ | ||||
|     onChange(_text, _value, $choice) { | ||||
|       if ($choice.data('do')) { | ||||
|         $mergeButton.find('.button-text').text($choice.text()); | ||||
|         $mergeButton.data('do', $choice.data('do')); | ||||
|       } | ||||
|     } | ||||
|   }); | ||||
|   $('.merge-cancel').on('click', function (e) { | ||||
|     e.preventDefault(); | ||||
|     $(this).closest('.form').hide(); | ||||
|     $mergeButton.parent().show(); | ||||
|     $('.instruct-toggle').show(); | ||||
|   }); | ||||
| } | ||||
| 
 | ||||
| export function initRepoPullRequestUpdate() { | ||||
|   // Pull Request update button
 | ||||
|   const $pullUpdateButton = $('.update-button > button'); | ||||
|  | ||||
| @ -8,7 +8,7 @@ import { | ||||
|   initRepoIssueComments, initRepoIssueDependencyDelete, | ||||
|   initRepoIssueReferenceIssue, initRepoIssueStatusButton, | ||||
|   initRepoIssueTitleEdit, | ||||
|   initRepoIssueWipToggle, initRepoPullRequestMerge, initRepoPullRequestUpdate, | ||||
|   initRepoIssueWipToggle, initRepoPullRequestUpdate, | ||||
|   updateIssuesMeta, | ||||
| } from './repo-issue.js'; | ||||
| import {initUnicodeEscapeButton} from './repo-unicode-escape.js'; | ||||
| @ -28,6 +28,7 @@ import createDropzone from './dropzone.js'; | ||||
| import {initCommentContent, initMarkupContent} from '../markup/content.js'; | ||||
| import {initCompReactionSelector} from './comp/ReactionSelector.js'; | ||||
| import {initRepoSettingBranches} from './repo-settings.js'; | ||||
| import initRepoPullRequestMergeForm from './repo-issue-pr-form.js'; | ||||
| 
 | ||||
| const {csrfToken} = window.config; | ||||
| 
 | ||||
| @ -507,9 +508,10 @@ export function initRepository() { | ||||
|     initRepoIssueDependencyDelete(); | ||||
|     initRepoIssueCodeCommentCancel(); | ||||
|     initRepoIssueStatusButton(); | ||||
|     initRepoPullRequestMerge(); | ||||
|     initRepoPullRequestUpdate(); | ||||
|     initCompReactionSelector(); | ||||
| 
 | ||||
|     initRepoPullRequestMergeForm(); | ||||
|   } | ||||
| 
 | ||||
|   // Pull request
 | ||||
|  | ||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user
	 wxiaoguang
						wxiaoguang