|
1 | 1 | import Vue from "vue"; |
2 | | -import AuthClientsListing from "./components/AuthClientsListing"; |
| 2 | +import AuthClientsListing from "./components/AuthClientsListing.vue"; |
3 | 3 |
|
4 | 4 | Vue.component("AuthClientsListing", AuthClientsListing); |
| 5 | + |
| 6 | +new Vue({ |
| 7 | + el: "#authClients", |
| 8 | + data: { |
| 9 | + authClient: { |
| 10 | + id: null, |
| 11 | + name: "", |
| 12 | + types: [], |
| 13 | + redirect: "", |
| 14 | + secret: "", |
| 15 | + }, |
| 16 | + filter: "", |
| 17 | + errors: null, |
| 18 | + disabled: false, |
| 19 | + title: "", |
| 20 | + secretTitle: "", |
| 21 | + customModalButtons: [], |
| 22 | + secret: "", |
| 23 | + }, |
| 24 | + beforeMount() { |
| 25 | + this.initCustomModalButtons(); |
| 26 | + this.resetValues(); |
| 27 | + }, |
| 28 | + methods: { |
| 29 | + onClose() { |
| 30 | + this.resetValues(); |
| 31 | + }, |
| 32 | + onSave() { |
| 33 | + if (this.disabled) { |
| 34 | + return; |
| 35 | + } |
| 36 | + this.disabled = true; |
| 37 | + |
| 38 | + this.loading = true; |
| 39 | + let method = "POST"; |
| 40 | + let url = "/oauth/clients"; |
| 41 | + let verb = "created"; |
| 42 | + if (this.authClient.id) { |
| 43 | + method = "PUT"; |
| 44 | + url = `${url}/${this.authClient.id}`; |
| 45 | + verb = "saved"; |
| 46 | + } |
| 47 | + ProcessMaker.apiClient({ |
| 48 | + method, |
| 49 | + url, |
| 50 | + baseURL: "/", |
| 51 | + data: this.authClient, |
| 52 | + }).then((response) => { |
| 53 | + this.$refs.createEditAuthClient.hide(); |
| 54 | + this.loading = false; |
| 55 | + if (response.data.secret) { |
| 56 | + this.secret = response.data.secret; |
| 57 | + this.$refs.secretModal.show(); |
| 58 | + } else { |
| 59 | + this.$refs.authClientList.fetch(); |
| 60 | + } |
| 61 | + ProcessMaker.alert(`${this.$t("The auth client was ")}${verb}.`, this.$t("success")); |
| 62 | + }).catch((error) => { |
| 63 | + this.disabled = false; |
| 64 | + this.errors = error.response.data.errors; |
| 65 | + }); |
| 66 | + }, |
| 67 | + resetValues() { |
| 68 | + this.title = this.$t("Create Auth-Client"); |
| 69 | + this.secretTitle = this.$t("Copy Secret To Clipboard"); |
| 70 | + this.authClient = { |
| 71 | + id: null, |
| 72 | + name: "", |
| 73 | + types: [], |
| 74 | + redirect: "", |
| 75 | + secret: "", |
| 76 | + }; |
| 77 | + this.errors = { |
| 78 | + name: null, |
| 79 | + redirect: null, |
| 80 | + types: null, |
| 81 | + }; |
| 82 | + this.disabled = false; |
| 83 | + this.initCustomModalButtons(); |
| 84 | + }, |
| 85 | + edit(item) { |
| 86 | + this.title = this.$t("Edit Auth Client"); |
| 87 | + this.authClient = item; |
| 88 | + this.$refs.createEditAuthClient.show(); |
| 89 | + }, |
| 90 | + initCustomModalButtons() { |
| 91 | + this.customModalButtons = [ |
| 92 | + { |
| 93 | + content: "Close", |
| 94 | + action: "close", |
| 95 | + variant: "secondary", |
| 96 | + disabled: false, |
| 97 | + hidden: false, |
| 98 | + }, |
| 99 | + ]; |
| 100 | + }, |
| 101 | + hideSecretModal() { |
| 102 | + this.$refs.secretModal.hide(); |
| 103 | + this.$refs.authClientList.fetch(); |
| 104 | + }, |
| 105 | + copySecret(secret) { |
| 106 | + navigator.clipboard.writeText(secret).then(() => { |
| 107 | + ProcessMaker.alert(this.$t("Secret copied to clipboard."), "success"); |
| 108 | + }, () => { |
| 109 | + ProcessMaker.alert(this.$t("Secret not copied to clipboard."), "danger"); |
| 110 | + }); |
| 111 | + }, |
| 112 | + }, |
| 113 | +}); |
0 commit comments