<script setup>
// Copyright 2024 FlexCDN root@flexcdn.cn. All rights reserved. Official site: https://flexcdn.cn .

import ctxRef from "@/utils/ctx_ref.js"
import Context from "./index.js"
import ServerSettingLayout from "@/layouts/ServerSettingLayout.vue";
import WarningMessage from "@/components/common/WarningMessage.vue";
import PostForm from "@/components/form/PostForm.vue";
import TCheckboxBinary from "@/components/ui/TCheckboxBinary.vue";
import SSLConfigBox from "@/components/server/SSLConfigBox.vue";
import SubmitButton from "@/components/form/SubmitButton.vue";
import DefinitionTable from "@/components/common/DefinitionTable.vue";
import NetworkAddressesBox from "@/components/common/NetworkAddressesBox.vue";

const ctx = ctxRef(new Context())

</script>

<template>
	<ServerSettingLayout :ctx="ctx">
		<p class="comment">提醒：HTTP/2、证书等信息修改后，可能需要清空浏览器缓存后才能浏览效果。</p>

		<WarningMessage v-if="ctx.httpsConfig.isOn && ctx.missingCertServerNames !=null && ctx.missingCertServerNames.length > 0">
			警告：当前网站绑定的以下域名尚未配置证书，将无法通过HTTPS协议访问：{{ctx.missingCertServerNames.join("、")}} 。
		</WarningMessage>

		<PostForm action="$" @success="ctx.success">
			<input type="hidden" name="serverId" :value="ctx.serverId"/>
			<input type="hidden" name="serverType" :value="ctx.serverType"/>
			<DefinitionTable>
				<tbody>
				<tr>
					<td class="title">启用HTTPS</td>
					<td>
						<TCheckboxBinary name="isOn" value="1" v-model="ctx.httpsConfig.isOn"/>
					</td>
				</tr>
				</tbody>
				<tbody v-show="ctx.httpsConfig.isOn && ctx.canSpecifyPort">
				<tr>
					<td class="title">绑定端口 *</td>
					<td>
						<span class="red" v-if="ctx.httpsConfig.isOn && (ctx.httpsConfig.addresses == null || ctx.httpsConfig.addresses.length == 0)">还没有添加端口绑定，会导致HTTPS服务无法访问。</span>
						<NetworkAddressesBox
							:v-server-type="ctx.serverType"
							:v-addresses="ctx.httpsConfig.addresses"
							:v-protocol="'https'"
							:min-port="ctx.minPort"
							:max-port="ctx.maxPort"></NetworkAddressesBox>
						<p class="comment">
							<span v-if="ctx.conflictingPorts.length > 0" class="red">配置错误：<span v-for="(port, index) in ctx.conflictingPorts">{{ port }}<span v-if="index != ctx.conflictingPorts.length - 1">、</span></span><span v-if="ctx.conflictingPorts.length > 1">等</span>端口同HTTP设置的端口冲突，请删除HTTP或HTTPS中的相关端口。</span>
						</p>
					</td>
				</tr>
				</tbody>
			</DefinitionTable>

			<!-- SSL配置 -->
			<SSLConfigBox :v-ssl-policy="ctx.httpsConfig.sslPolicy" :v-protocol="'https'" v-show="ctx.httpsConfig.isOn" :v-server-id="ctx.serverId" :v-support-http3="ctx.httpsConfig.supportsHTTP3 && ctx.http3FeatureEnabled"></SSLConfigBox>

			<SubmitButton></SubmitButton>
		</PostForm>
	</ServerSettingLayout>
</template>

<style lang="postcss" scoped>
</style>