diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-03-11 18:07:48 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-03-11 18:07:48 +0300 |
commit | e46506bcc32de1af076ec8a5d51d405f827dd986 (patch) | |
tree | bb08cb3d53132eef0e8d17e1f6bab9d672454ddd /app/assets/javascripts/admin | |
parent | e105f6b881d9341331558c8c42f90391bab2fd19 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/admin')
-rw-r--r-- | app/assets/javascripts/admin/applications/components/delete_application.vue | 84 | ||||
-rw-r--r-- | app/assets/javascripts/admin/applications/index.js | 15 |
2 files changed, 99 insertions, 0 deletions
diff --git a/app/assets/javascripts/admin/applications/components/delete_application.vue b/app/assets/javascripts/admin/applications/components/delete_application.vue new file mode 100644 index 00000000000..77694296b0a --- /dev/null +++ b/app/assets/javascripts/admin/applications/components/delete_application.vue @@ -0,0 +1,84 @@ +<script> +import { GlModal, GlSprintf } from '@gitlab/ui'; +import { __ } from '~/locale'; +import csrf from '~/lib/utils/csrf'; + +export default { + components: { + GlModal, + GlSprintf, + }, + data() { + return { + name: '', + path: '', + buttons: [], + }; + }, + mounted() { + this.buttons = document.querySelectorAll('.js-application-delete-button'); + + this.buttons.forEach((button) => button.addEventListener('click', this.buttonEvent)); + }, + destroy() { + this.buttons.forEach((button) => button.removeEventListener('click', this.buttonEvent)); + }, + methods: { + buttonEvent(e) { + e.preventDefault(); + this.show(e.target.dataset); + }, + show(dataset) { + const { name, path } = dataset; + + this.name = name; + this.path = path; + + this.$refs.deleteModal.show(); + }, + deleteApplication() { + this.$refs.deleteForm.submit(); + }, + }, + i18n: { + destroy: __('Destroy'), + title: __('Confirm destroy application'), + body: __('Are you sure that you want to destroy %{application}'), + }, + modal: { + actionPrimary: { + text: __('Destroy'), + attributes: { + variant: 'danger', + }, + }, + actionSecondary: { + text: __('Cancel'), + attributes: { + variant: 'default', + }, + }, + }, + csrf, +}; +</script> +<template> + <gl-modal + ref="deleteModal" + :title="$options.i18n.title" + :action-primary="$options.modal.actionPrimary" + :action-secondary="$options.modal.actionSecondary" + modal-id="delete-application-modal" + size="sm" + @primary="deleteApplication" + ><gl-sprintf :message="$options.i18n.body"> + <template #application> + <strong>{{ name }}</strong> + </template></gl-sprintf + > + <form ref="deleteForm" method="post" :action="path"> + <input type="hidden" name="_method" value="delete" /> + <input type="hidden" name="authenticity_token" :value="$options.csrf.token" /> + </form> + </gl-modal> +</template> diff --git a/app/assets/javascripts/admin/applications/index.js b/app/assets/javascripts/admin/applications/index.js new file mode 100644 index 00000000000..5875fd18729 --- /dev/null +++ b/app/assets/javascripts/admin/applications/index.js @@ -0,0 +1,15 @@ +import Vue from 'vue'; +import DeleteApplication from './components/delete_application.vue'; + +export default () => { + const el = document.querySelector('.js-application-delete-modal'); + + if (!el) return false; + + return new Vue({ + el, + render(h) { + return h(DeleteApplication); + }, + }); +}; |