Kevin L'HereecandCopilot
d1c65dbf1e
- Docker infrastructure (Dockerfile, docker-compose.yml, genieacs-sim) - AdonisJS v7 app with Inertia.js + Vue 3 - MongoDB integration - CWMP/TR-069 state machine engine - Configuration engine with compliance tracking - Branding: ADAM ACS (favicon, navbar, locales) Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
100 lines
3.6 KiB
Vue
100 lines
3.6 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
import { router } from '@inertiajs/vue3'
|
|
import { useI18n } from 'vue-i18n'
|
|
import TitleBar from '../components/TitleBar.vue'
|
|
|
|
const { t } = useI18n()
|
|
|
|
const { discovery, provisioning } = defineProps<{
|
|
discovery: any[]
|
|
provisioning: any[]
|
|
}>()
|
|
|
|
const showDeleteModal = ref(false)
|
|
const deleteTarget = ref<{ type: string; identifier: string } | null>(null)
|
|
|
|
function confirmDelete(type: string, identifier: string) {
|
|
deleteTarget.value = { type, identifier }
|
|
showDeleteModal.value = true
|
|
}
|
|
|
|
function executeDelete() {
|
|
if (!deleteTarget.value) return
|
|
router.delete(`/configurations/${deleteTarget.value.type}/${encodeURIComponent(deleteTarget.value.identifier)}`, {
|
|
onFinish: () => {
|
|
showDeleteModal.value = false
|
|
deleteTarget.value = null
|
|
},
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<TitleBar section="configurations" />
|
|
|
|
<div class="container-xxl py-4">
|
|
<div class="row">
|
|
<!-- Discovery -->
|
|
<div class="col-md-6">
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<h3>{{ t('labels.discovery') }}</h3>
|
|
<a href="/configurations/discovery/create" class="btn btn-primary btn-sm">{{ t('button.create') }}</a>
|
|
</div>
|
|
<div v-for="config in discovery" :key="config.identifier" class="card mb-2">
|
|
<div class="card-body d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<strong>{{ config.identifier }}</strong>
|
|
<br><small class="text-muted">{{ config.createdAt }}</small>
|
|
</div>
|
|
<button class="btn btn-danger btn-sm" @click="confirmDelete('discovery', config.identifier)">
|
|
{{ t('button.delete') }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Provisioning -->
|
|
<div class="col-md-6">
|
|
<div class="d-flex justify-content-between align-items-center mb-3">
|
|
<h3>{{ t('labels.provisioning') }}</h3>
|
|
<a href="/configurations/provisioning/create" class="btn btn-primary btn-sm">{{ t('button.create') }}</a>
|
|
</div>
|
|
<div v-for="config in provisioning" :key="config.identifier" class="card mb-2">
|
|
<div class="card-body d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<strong>{{ config.identifier }}</strong>
|
|
<br><small class="text-muted">{{ config.createdAt }}</small>
|
|
</div>
|
|
<button class="btn btn-danger btn-sm" @click="confirmDelete('provisioning', config.identifier)">
|
|
{{ t('button.delete') }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Confirmation Modal -->
|
|
<teleport to="body">
|
|
<div v-if="showDeleteModal" class="modal-backdrop fade show"></div>
|
|
<div v-if="showDeleteModal" class="modal fade show d-block" tabindex="-1" aria-modal="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{{ t('modal.confirmDelete') }}</h5>
|
|
<button type="button" class="btn-close" @click="showDeleteModal = false"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>{{ t('modal.confirmDeleteMessage') }}</p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-secondary" @click="showDeleteModal = false">{{ t('button.cancel') }}</button>
|
|
<button class="btn btn-danger" @click="executeDelete">{{ t('button.confirm') }}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</teleport>
|
|
</template>
|