main
vue 154 lines 4.41 KB
Raw
1 <template>
2 <div class="contents">
3 <n-button v-if="isDeployEnabled" :loading type="success" :size secondary @click.stop="provision()">
4 <template #icon>
5 <Icon :name="DeployIcon" />
6 </template>
7 Deploy
8 </n-button>
9
10 <n-button v-if="!hideDeleteButton" :size type="error" ghost :loading="loadingDelete" @click.stop="handleDelete">
11 <template #icon>
12 <Icon :name="DeleteIcon" :size="15" />
13 </template>
14 Delete
15 </n-button>
16 </div>
17 </template>
18
19 <script setup lang="ts">
20 import type { ButtonSize } from "naive-ui"
21 import type { ApiCommonResponse } from "@/types/common.d"
22 import type { CustomerIntegration } from "@/types/integrations.d"
23 import { NButton, useDialog, useMessage } from "naive-ui"
24 import { computed, ref, watch } from "vue"
25 import Api from "@/api"
26 import Icon from "@/components/common/Icon.vue"
27 import { handleDeleteIntegration } from "./utils"
28
29 const { integration, hideDeleteButton, size } = defineProps<{
30 integration: CustomerIntegration
31 hideDeleteButton?: boolean
32 size?: ButtonSize
33 }>()
34
35 const emit = defineEmits<{
36 (e: "startLoading"): void
37 (e: "stopLoading"): void
38 (e: "deployed"): void
39 (e: "deleted"): void
40 }>()
41
42 const DeployIcon = "carbon:deploy"
43 const DeleteIcon = "ph:trash"
44
45 const dialog = useDialog()
46 const message = useMessage()
47
48 const loadingProvision = ref(false)
49 const loadingDelete = ref(false)
50 const loading = computed(() => loadingProvision.value || loadingDelete.value)
51 const serviceName = computed(() => integration.integration_service_name)
52 const customerCode = computed(() => integration.customer_code)
53 const isOffice365 = computed(() => serviceName.value === "Office365")
54 const isMimecast = computed(() => serviceName.value === "Mimecast")
55 const isCrowdstrike = computed(() => serviceName.value === "Crowdstrike")
56 const isDuo = computed(() => serviceName.value === "DUO")
57 const isDarktrace = computed(() => serviceName.value === "Darktrace")
58 const isBitdefender = computed(() => serviceName.value === "BitDefender")
59 const isCato = computed(() => serviceName.value === "CATO")
60 const isDefenderForEndpoint = computed(() => serviceName.value === "DefenderForEndpoint")
61 const isSOCFortressMdr = computed(() => serviceName.value === "SOCFortress MDR")
62 const isDeployEnabled = computed(
63 () =>
64 (isOffice365.value ||
65 isMimecast.value ||
66 isCrowdstrike.value ||
67 isDuo.value ||
68 isDarktrace.value ||
69 isBitdefender.value ||
70 isCato.value ||
71 isDefenderForEndpoint.value ||
72 isSOCFortressMdr.value) &&
73 !integration.deployed
74 )
75
76 watch(loading, val => {
77 if (val) {
78 emit("startLoading")
79 } else {
80 emit("stopLoading")
81 }
82 })
83
84 function provision() {
85 let apiCall: Promise<ApiCommonResponse> | null = null
86
87 if (isOffice365.value) {
88 apiCall = Api.integrations.office365Provision(customerCode.value, serviceName.value)
89 }
90 if (isMimecast.value) {
91 apiCall = Api.integrations.mimecastProvision(customerCode.value, serviceName.value)
92 }
93 if (isCrowdstrike.value) {
94 apiCall = Api.integrations.crowdstrikeProvision(customerCode.value, serviceName.value)
95 }
96 if (isDuo.value) {
97 apiCall = Api.integrations.duoProvision(customerCode.value, serviceName.value)
98 }
99 if (isDarktrace.value) {
100 apiCall = Api.integrations.darktraceProvision(customerCode.value, serviceName.value)
101 }
102 if (isBitdefender.value) {
103 apiCall = Api.integrations.bitdefenderProvision(customerCode.value, serviceName.value)
104 }
105 if (isCato.value) {
106 apiCall = Api.integrations.catoProvision(customerCode.value, serviceName.value)
107 }
108 if (isDefenderForEndpoint.value) {
109 apiCall = Api.integrations.defenderForEndpointProvision(customerCode.value, serviceName.value)
110 }
111 if (isSOCFortressMdr.value) {
112 apiCall = Api.integrations.socfortressMdrProvision(customerCode.value, serviceName.value)
113 }
114
115 if (!apiCall) {
116 return
117 }
118
119 loadingProvision.value = true
120
121 apiCall
122 .then(res => {
123 if (res.data.success) {
124 emit("deployed")
125 message.success(res.data?.message || "Customer integration successfully deployed.")
126 } else {
127 message.warning(res.data?.message || "An error occurred. Please try again later.")
128 }
129 })
130 .catch(err => {
131 message.error(err.response?.data?.message || "An error occurred. Please try again later.")
132 })
133 .finally(() => {
134 loadingProvision.value = false
135 })
136 }
137
138 function handleDelete() {
139 handleDeleteIntegration({
140 integration,
141 cbBefore: () => {
142 loadingDelete.value = true
143 },
144 cbSuccess: () => {
145 emit("deleted")
146 },
147 cbAfter: () => {
148 loadingDelete.value = false
149 },
150 message,
151 dialog
152 })
153 }
154 </script>