diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-12 03:09:44 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-12 03:09:44 +0300 |
commit | 88544d284c0a25d45ea51c1817fcab1c7e99afe7 (patch) | |
tree | 7ae1c1fb6982eadb803de5f80e069fac8574e84d /app/assets | |
parent | 15f6e7bab546b32b7ada8aa2019b06b7bda12c1d (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/access_tokens/components/expires_at_field.vue | 26 | ||||
-rw-r--r-- | app/assets/javascripts/access_tokens/index.js | 31 |
2 files changed, 49 insertions, 8 deletions
diff --git a/app/assets/javascripts/access_tokens/components/expires_at_field.vue b/app/assets/javascripts/access_tokens/components/expires_at_field.vue index d0932ad80e1..1fec186f2fa 100644 --- a/app/assets/javascripts/access_tokens/components/expires_at_field.vue +++ b/app/assets/javascripts/access_tokens/components/expires_at_field.vue @@ -1,14 +1,32 @@ <script> -import { GlDatepicker } from '@gitlab/ui'; +import { GlDatepicker, GlFormInput } from '@gitlab/ui'; export default { name: 'ExpiresAtField', - components: { GlDatepicker }, + components: { GlDatepicker, GlFormInput }, + props: { + inputAttrs: { + type: Object, + required: false, + default: () => ({}), + }, + }, + data() { + return { + minDate: new Date(), + }; + }, }; </script> <template> - <gl-datepicker :target="null" :min-date="new Date()"> - <slot></slot> + <gl-datepicker :target="null" :min-date="minDate"> + <gl-form-input + v-bind="inputAttrs" + class="datepicker gl-datepicker-input" + autocomplete="off" + inputmode="none" + data-qa-selector="expiry_date_field" + /> </gl-datepicker> </template> diff --git a/app/assets/javascripts/access_tokens/index.js b/app/assets/javascripts/access_tokens/index.js index 9bdb2940956..319144193f1 100644 --- a/app/assets/javascripts/access_tokens/index.js +++ b/app/assets/javascripts/access_tokens/index.js @@ -1,11 +1,34 @@ import Vue from 'vue'; import ExpiresAtField from './components/expires_at_field.vue'; +const getInputAttrs = el => { + const input = el.querySelector('input'); + + return { + id: input.id, + name: input.name, + placeholder: input.placeholder, + }; +}; + const initExpiresAtField = () => { - // eslint-disable-next-line no-new - new Vue({ - el: document.querySelector('.js-access-tokens-expires-at'), - components: { ExpiresAtField }, + const el = document.querySelector('.js-access-tokens-expires-at'); + + if (!el) { + return null; + } + + const inputAttrs = getInputAttrs(el); + + return new Vue({ + el, + render(h) { + return h(ExpiresAtField, { + props: { + inputAttrs, + }, + }); + }, }); }; |