Commit 1041f5da authored by Filipa Lacerda's avatar Filipa Lacerda

Merge branch 'refactor/move-board-new-issue-vue-component' into 'master'

Move BoardNewIssue vue component

See merge request gitlab-org/gitlab-ce!16947
parents 1553a34d 89c652b8
<script> <script>
import Sortable from 'vendor/Sortable'; import Sortable from 'vendor/Sortable';
import boardNewIssue from './board_new_issue'; import boardNewIssue from './board_new_issue.vue';
import boardCard from './board_card.vue'; import boardCard from './board_card.vue';
import eventHub from '../eventhub'; import eventHub from '../eventhub';
import loadingIcon from '../../vue_shared/components/loading_icon.vue'; import loadingIcon from '../../vue_shared/components/loading_icon.vue';
......
/* global ListIssue */ <script>
import eventHub from '../eventhub'; import eventHub from '../eventhub';
import ListIssue from '../models/issue';
const Store = gl.issueBoards.BoardsStore; const Store = gl.issueBoards.BoardsStore;
...@@ -17,6 +18,9 @@ export default { ...@@ -17,6 +18,9 @@ export default {
error: false, error: false,
}; };
}, },
mounted() {
this.$refs.input.focus();
},
methods: { methods: {
submit(e) { submit(e) {
e.preventDefault(); e.preventDefault();
...@@ -59,42 +63,51 @@ export default { ...@@ -59,42 +63,51 @@ export default {
eventHub.$emit(`hide-issue-form-${this.list.id}`); eventHub.$emit(`hide-issue-form-${this.list.id}`);
}, },
}, },
mounted() {
this.$refs.input.focus();
},
template: `
<div class="card board-new-issue-form">
<form @submit="submit($event)">
<div class="flash-container"
v-if="error">
<div class="flash-alert">
An error occurred. Please try again.
</div>
</div>
<label class="label-light"
:for="list.id + '-title'">
Title
</label>
<input class="form-control"
type="text"
v-model="title"
ref="input"
autocomplete="off"
:id="list.id + '-title'" />
<div class="clearfix prepend-top-10">
<button class="btn btn-success pull-left"
type="submit"
:disabled="title === ''"
ref="submit-button">
Submit issue
</button>
<button class="btn btn-default pull-right"
type="button"
@click="cancel">
Cancel
</button>
</div>
</form>
</div>
`,
}; };
</script>
<template>
<div class="card board-new-issue-form">
<form @submit="submit($event)">
<div
class="flash-container"
v-if="error"
>
<div class="flash-alert">
An error occurred. Please try again.
</div>
</div>
<label
class="label-light"
:for="list.id + '-title'"
>
Title
</label>
<input
class="form-control"
type="text"
v-model="title"
ref="input"
autocomplete="off"
:id="list.id + '-title'"
/>
<div class="clearfix prepend-top-10">
<button
class="btn btn-success pull-left"
type="submit"
:disabled="title === ''"
ref="submit-button"
>
Submit issue
</button>
<button
class="btn btn-default pull-right"
type="button"
@click="cancel"
>
Cancel
</button>
</div>
</form>
</div>
</template>
...@@ -110,3 +110,5 @@ class ListIssue { ...@@ -110,3 +110,5 @@ class ListIssue {
} }
window.ListIssue = ListIssue; window.ListIssue = ListIssue;
export default ListIssue;
---
title: Move BoardNewIssue vue component
merge_request: 16947
author: George Tsiolis
type: performance
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
import Vue from 'vue'; import Vue from 'vue';
import MockAdapter from 'axios-mock-adapter'; import MockAdapter from 'axios-mock-adapter';
import axios from '~/lib/utils/axios_utils'; import axios from '~/lib/utils/axios_utils';
import boardNewIssue from '~/boards/components/board_new_issue'; import boardNewIssue from '~/boards/components/board_new_issue.vue';
import '~/boards/models/list'; import '~/boards/models/list';
import { listObj, boardsMockInterceptor, mockBoardService } from './mock_data'; import { listObj, boardsMockInterceptor, mockBoardService } from './mock_data';
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment