<script setup>

import {ref} from "vue"
import TCheckboxBinary from "@/components/ui/TCheckboxBinary.vue";
import URLPatternsBox from "@/components/common/URLPatternsBox.vue";
import MoreOptionsIndicator from "@/components/common/MoreOptionsIndicator.vue";
import PriorCheckbox from "@/components/common/PriorCheckbox.vue";
import DefinitionTable from "@/components/common/DefinitionTable.vue";

const props = defineProps(["v-optimization-config", "v-is-location", "v-is-group"])

const {config, htmlMoreOptions, javascriptMoreOptions, cssMoreOptions} = (function () {
	let config = props.vOptimizationConfig

	return {
		config: ref(config),
		htmlMoreOptions: ref(false),
		javascriptMoreOptions: ref(false),
		cssMoreOptions: ref(false)
	}
})()

const isOn = function () {
	return ((!props.vIsLocation && !props.vIsGroup) || config.value.isPrior) && config.value.isOn
}


</script>

<template>
	<div>
		<input type="hidden" name="optimizationJSON" :value="JSON.stringify(config)"/>
		<DefinitionTable v-if="vIsLocation || vIsGroup">
			<PriorCheckbox :v-config="config"></PriorCheckbox>
		</DefinitionTable>

		<div v-show="(!vIsLocation && !vIsGroup) || config.isPrior">
			<div class="margin"></div>
			<DefinitionTable>
				<tbody>
				<tr>
					<td class="title">HTML优化</td>
					<td>
						<TCheckboxBinary value="1" v-model="config.html.isOn"/>
						<p class="comment">可以自动优化HTML中包含的空白、注释、空标签等；只有文件可以缓存时才会被优化。</p>
					</td>
				</tr>
				<tr v-show="config.html.isOn">
					<td colspan="2">
						<MoreOptionsIndicator v-model="htmlMoreOptions"></MoreOptionsIndicator>
					</td>
				</tr>
				</tbody>
				<tbody v-show="htmlMoreOptions">
				<tr>
					<td>HTML例外URL</td>
					<td>
						<URLPatternsBox v-model="config.html.exceptURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了例外URL，表示这些URL跳过不做处理。</p>
					</td>
				</tr>
				<tr>
					<td>HTML限制URL</td>
					<td>
						<URLPatternsBox v-model="config.html.onlyURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了限制URL，表示只对这些URL进行优化处理；如果不填则表示支持所有的URL。</p>
					</td>
				</tr>
				</tbody>
			</DefinitionTable>

			<DefinitionTable>
				<tbody>
				<tr>
					<td class="title">Javascript优化</td>
					<td>
						<TCheckboxBinary value="1" v-model="config.javascript.isOn"/>
						<p class="comment">可以自动缩短Javascript中变量、函数名称等。只有文件可以缓存时才会被优化。</p>
					</td>
				</tr>
				<tr v-show="config.javascript.isOn">
					<td colspan="2">
						<MoreOptionsIndicator v-model="javascriptMoreOptions"></MoreOptionsIndicator>
					</td>
				</tr>
				</tbody>
				<tbody v-show="javascriptMoreOptions">
				<tr>
					<td>Javascript例外URL</td>
					<td>
						<URLPatternsBox v-model="config.javascript.exceptURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了例外URL，表示这些URL跳过不做处理。</p>
					</td>
				</tr>
				<tr>
					<td>Javascript限制URL</td>
					<td>
						<URLPatternsBox v-model="config.javascript.onlyURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了限制URL，表示只对这些URL进行优化处理；如果不填则表示支持所有的URL。</p>
					</td>
				</tr>
				</tbody>
			</DefinitionTable>

			<DefinitionTable>
				<tbody>
				<tr>
					<td class="title">CSS优化</td>
					<td>
						<TCheckboxBinary value="1" v-model="config.css.isOn"/>
						<p class="comment">可以自动去除CSS中包含的空白。只有文件可以缓存时才会被优化。</p>
					</td>
				</tr>
				<tr v-show="config.css.isOn">
					<td colspan="2">
						<MoreOptionsIndicator v-model="cssMoreOptions"></MoreOptionsIndicator>
					</td>
				</tr>
				</tbody>
				<tbody v-show="cssMoreOptions">
				<tr>
					<td>CSS例外URL</td>
					<td>
						<URLPatternsBox v-model="config.css.exceptURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了例外URL，表示这些URL跳过不做处理。</p>
					</td>
				</tr>
				<tr>
					<td>CSS限制URL</td>
					<td>
						<URLPatternsBox v-model="config.css.onlyURLPatterns"></URLPatternsBox>
						<p class="comment">如果填写了限制URL，表示只对这些URL进行优化处理；如果不填则表示支持所有的URL。</p>
					</td>
				</tr>
				</tbody>
			</DefinitionTable>
		</div>
	</div>
</template>

<style scoped>
</style>
