137 lines
4.4 KiB
Vue
137 lines
4.4 KiB
Vue
<script setup>
|
|
const { t } = useI18n()
|
|
const router = useRouter()
|
|
const proxiesStore = useProxiesStore()
|
|
const { success, error } = useNotification()
|
|
const { confirmDelete: showConfirm } = useConfirm()
|
|
|
|
const props = defineProps({
|
|
domain: { type: String, required: true },
|
|
})
|
|
|
|
const form = reactive({
|
|
name: '',
|
|
domain: '',
|
|
localAddr: '127.0.0.1',
|
|
localPort: '',
|
|
enabled: true,
|
|
serviceHttps: false,
|
|
autoHttps: true,
|
|
autoSSL: false,
|
|
})
|
|
|
|
|
|
const saving = ref(false)
|
|
|
|
onMounted(async () => {
|
|
if (!proxiesStore.loaded) await proxiesStore.load()
|
|
const proxy = proxiesStore.list.find(p => p.ExternalDomain === props.domain)
|
|
if (proxy) {
|
|
form.name = proxy.Name || ''
|
|
form.domain = proxy.ExternalDomain
|
|
form.localAddr = proxy.LocalAddress
|
|
form.localPort = proxy.LocalPort
|
|
form.enabled = proxy.Enable
|
|
form.serviceHttps = proxy.ServiceHTTPSuse
|
|
form.autoHttps = proxy.AutoHTTPS
|
|
form.autoSSL = proxy.AutoCreateSSL || false
|
|
}
|
|
})
|
|
|
|
const saveProxy = async () => {
|
|
saving.value = true
|
|
const config = await api.getConfig()
|
|
const idx = config.Proxy_Service.findIndex(p => p.ExternalDomain === props.domain)
|
|
if (idx >= 0) {
|
|
config.Proxy_Service[idx].Name = form.name
|
|
config.Proxy_Service[idx].ExternalDomain = form.domain
|
|
config.Proxy_Service[idx].LocalAddress = form.localAddr
|
|
config.Proxy_Service[idx].LocalPort = form.localPort
|
|
config.Proxy_Service[idx].Enable = form.enabled
|
|
config.Proxy_Service[idx].ServiceHTTPSuse = form.serviceHttps
|
|
config.Proxy_Service[idx].AutoHTTPS = form.serviceHttps
|
|
config.Proxy_Service[idx].AutoCreateSSL = form.autoSSL
|
|
const result = await api.saveConfig(JSON.stringify(config))
|
|
if (!String(result).startsWith('Error')) {
|
|
await proxiesStore.load()
|
|
success(t('notify.dataSaved'))
|
|
router.push('/')
|
|
} else {
|
|
error(result)
|
|
}
|
|
} else {
|
|
error('Proxy not found in config')
|
|
}
|
|
saving.value = false
|
|
}
|
|
|
|
const confirmDelete = async () => {
|
|
const result = await showConfirm({
|
|
title: t('proxies.deleteTitle'),
|
|
message: form.domain,
|
|
})
|
|
if (result) {
|
|
const res = await proxiesStore.remove(form.domain)
|
|
if (res && !String(res).startsWith('Error')) {
|
|
success(t('notify.proxyDeleted'))
|
|
router.push('/')
|
|
} else {
|
|
error(String(res))
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="vaccess-page">
|
|
<Breadcrumbs :items="[domain]" />
|
|
|
|
<PageHeader icon="fas fa-edit" :title="`${t('sites.edit')} — ${domain}`">
|
|
<template #actions>
|
|
<VButton variant="danger" icon="fas fa-trash" @click="confirmDelete">{{ t('common.delete') }}</VButton>
|
|
<VButton icon="fas fa-times" @click="router.push('/')">{{ t('common.cancel') }}</VButton>
|
|
<VButton variant="success" icon="fas fa-save" :loading="saving" @click="saveProxy">{{ t('common.save') }}</VButton>
|
|
</template>
|
|
</PageHeader>
|
|
|
|
<div class="form-section">
|
|
<div class="settings-form">
|
|
<!-- Статус -->
|
|
<div class="form-group">
|
|
<label class="form-label">{{ t('proxies.status') }}:</label>
|
|
<div class="status-toggle">
|
|
<button class="status-btn" :class="{ active: form.enabled }" @click="form.enabled = true">
|
|
<i class="fas fa-check-circle"></i> {{ t('common.enabled') }}
|
|
</button>
|
|
<button class="status-btn" :class="{ active: !form.enabled }" @click="form.enabled = false">
|
|
<i class="fas fa-times-circle"></i> {{ t('common.disabled') }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Имя и домен -->
|
|
<VInput v-model="form.name" :label="t('sites.formName')" />
|
|
<VInput v-model="form.domain" :label="t('proxies.externalDomain')" required />
|
|
|
|
<!-- Адрес и порт -->
|
|
<div class="form-row">
|
|
<VInput v-model="form.localAddr" :label="t('proxies.formLocalAddr')" required />
|
|
<VInput v-model="form.localPort" :label="t('proxies.formLocalPort')" required />
|
|
</div>
|
|
|
|
<!-- Toggles -->
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label class="form-label">HTTPS:</label>
|
|
<VToggle v-model="form.serviceHttps" :label="t('common.enabled')" />
|
|
</div>
|
|
<div class="form-group">
|
|
<label class="form-label">Auto SSL:</label>
|
|
<VToggle v-model="form.autoSSL" :label="t('common.enabled')" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|