<script setup>
// 防盗链

import {ref, watch} from "vue";
import ValuesBox from "@/components/common/ValuesBox.vue";
import CodeLabel from "@/components/common/CodeLabel.vue";
import TCheckboxBinary from "@/components/ui/TCheckboxBinary.vue";
import DefinitionTable from "@/components/common/DefinitionTable.vue";

const props = defineProps(["v-checkpoint"])

const {allowDomains, allowSameDomain, allowEmpty, denyDomains, checkOrigin, options, value} = (function () {
	let allowEmpty = true
	let allowSameDomain = true
	let allowDomains = []
	let denyDomains = []
	let checkOrigin = true

	let options = {}
	if (window.UPDATING_RULE != null) {
		options = window.UPDATING_RULE.checkpointOptions
	}

	if (options == null) {
		options = {}
	}
	if (typeof (options.allowEmpty) == "boolean") {
		allowEmpty = options.allowEmpty
	}
	if (typeof (options.allowSameDomain) == "boolean") {
		allowSameDomain = options.allowSameDomain
	}
	if (options.allowDomains != null && typeof (options.allowDomains) == "object") {
		allowDomains = options.allowDomains
	}
	if (options.denyDomains != null && typeof (options.denyDomains) == "object") {
		denyDomains = options.denyDomains
	}
	if (typeof options.checkOrigin == "boolean") {
		checkOrigin = options.checkOrigin
	}

	setTimeout(function () {
		change()
	}, 100)

	return {
		allowEmpty: ref(allowEmpty),
		allowSameDomain: ref(allowSameDomain),
		allowDomains: ref(allowDomains),
		denyDomains: ref(denyDomains),
		checkOrigin: ref(checkOrigin),
		options: ref({}),
		value: ref(0)
	}
})()

watch(allowEmpty, function () {
	change()
})

watch(allowSameDomain, function () {
	change()
})

watch(checkOrigin, function () {
	change()
})

const changeAllowDomains = function (values) {
	allowDomains.value = values
	change()
}

const changeDenyDomains = function (values) {
	denyDomains.value = values
	change()
}

const change = function () {
	props.vCheckpoint.options = [
		{
			code: "allowEmpty",
			value: allowEmpty.value
		},
		{
			code: "allowSameDomain",
			value: allowSameDomain.value
		},
		{
			code: "allowDomains",
			value: allowDomains.value
		},
		{
			code: "denyDomains",
			value: denyDomains.value
		},
		{
			code: "checkOrigin",
			value: checkOrigin.value
		}
	]
}
</script>

<template>
	<div>
		<input type="hidden" name="operator" value="eq"/>
		<input type="hidden" name="value" :value="value"/>
		<DefinitionTable>
			<tbody>
			<tr>
				<td class="title">来源域名允许为空</td>
				<td class="!font-normal">
					<TCheckboxBinary v-model="allowEmpty"></TCheckboxBinary>
					<p class="comment">允许不带来源的访问。</p>
				</td>
			</tr>
			<tr>
				<td>来源域名允许一致</td>
				<td class="!font-normal">
					<TCheckboxBinary v-model="allowSameDomain"></TCheckboxBinary>
					<p class="comment">允许来源域名和当前访问的域名一致，相当于在站内访问。</p>
				</td>
			</tr>
			<tr>
				<td>允许的来源域名</td>
				<td class="!font-normal">
					<ValuesBox :values="allowDomains" @change="changeAllowDomains"></ValuesBox>
					<p class="comment">允许的来源域名列表，比如
						<CodeLabel>example.com</CodeLabel>
						（顶级域名)、
						<CodeLabel>*.example.com</CodeLabel>
						（example.com的所有二级域名）。单个星号
						<CodeLabel>*</CodeLabel>
						表示允许所有域名。
					</p>
				</td>
			</tr>
			<tr>
				<td>禁止的来源域名</td>
				<td class="!font-normal">
					<ValuesBox :values="denyDomains" @change="changeDenyDomains"></ValuesBox>
					<p class="comment">禁止的来源域名列表，比如
						<CodeLabel>example.org</CodeLabel>
						（顶级域名）、
						<CodeLabel>*.example.org</CodeLabel>
						（example.org的所有二级域名）；除了这些禁止的来源域名外，其他域名都会被允许，除非限定了允许的来源域名。
					</p>
				</td>
			</tr>
			<tr>
				<td>同时检查Origin</td>
				<td class="!font-normal">
					<TCheckboxBinary v-model="checkOrigin"></TCheckboxBinary>
					<p class="comment">如果请求没有指定Referer Header，则尝试检查Origin Header，多用于跨站调用。</p>
				</td>
			</tr>
			</tbody>
		</DefinitionTable>
	</div>
</template>