<script setup>
	/**
	 * name：
	 * user：sa0ChunLuyu
	 * date：2023年8月14日 08:08:44
	 */
	import {
		ref
	} from 'vue'
	import {
		$response
	} from '@/api'
	import {
		onShow
	} from '@dcloudio/uni-app'
	import $config from '@/config.js'
	const config_arr = ref($config.config)
	const config_item_create_default = {
		active: false,
		url: '',
		gzh: {
			id: '',
			jump: ''
		}
	}
	const config_item_create = ref(JSON.parse(JSON.stringify(config_item_create_default)))
	const switchChange = (e, key) => {
		if (key === -1) {
			config_item_create.value.active = e.detail.value
		} else {
			if (!!e.detail.value) {
				config_arr.value.forEach((item) => {
					item.active = false
				})
				config_arr.value[key].active = true
			} else {
				config_arr.value[key].active = false
				config_arr.value[0].active = true
			}
		}
	}
	const del_popup_ref = ref(null)
	const delPopupRef = (e) => {
		del_popup_ref.value = e
	}
	const addClick = () => {
		if (!config_item_create.value.url) return uni.$lu.toast('请填写URL')
		if (config_item_create.value.url.indexOf('http') !== 0) return uni.$lu.toast('请填写正确的URL')
		if (config_item_create.value.active) {
			config_arr.value.forEach((item) => {
				item.active = false
			})
		}
		config_arr.value.unshift(config_item_create.value)
	}
	const del_active = ref(-1)
	const delClick = (index) => {
		del_active.value = index
		del_popup_ref.value.open()
	}
	const delConfirmClick = () => {
		if (del_active.value === -1) return
		if (config_arr.value[del_active.value].active) return
		config_arr.value.splice(del_active.value, 1)
		del_active.value = -1
	}
	const save_popup_ref = ref(null)
	const savePopupRef = (e) => {
		save_popup_ref.value = e
	}
	const saveConfigClick = () => {
		save_popup_ref.value.open()
	}
	const saveConfirmClick = () => {
		uni.setStorageSync("CONFIG_STR", JSON.stringify(config_arr.value))
		uni.$lu.toast('保存成功，重启后生效')
	}

	const reset_popup_ref = ref(null)
	const resetPopupRef = (e) => {
		reset_popup_ref.value = e
	}
	const resetConfirmClick = () => {
		uni.setStorageSync("CONFIG_STR", JSON.stringify(uni.$config))
		config_arr.value = uni.$config
		uni.$lu.toast('保存成功，重启后生效')
	}
	const resetConfigClick = () => {
		reset_popup_ref.value.open()
	}
	onShow(() => {})
</script>
<template>
	<view>
		<uni-popup :ref="delPopupRef" type="dialog">
			<uni-popup-dialog type="error" cancelText="取消" confirmText="确定" title="提示" content="是否删除该代理？"
				@confirm="delConfirmClick()"></uni-popup-dialog>
		</uni-popup>
		<uni-popup :ref="savePopupRef" type="dialog">
			<uni-popup-dialog type="error" cancelText="取消" confirmText="确定" title="提示" content="是否保存代理配置？"
				@confirm="saveConfirmClick()"></uni-popup-dialog>
		</uni-popup>
		<uni-popup :ref="resetPopupRef" type="dialog">
			<uni-popup-dialog type="error" cancelText="取消" confirmText="确定" title="提示" content="是否重置代理配置？"
				@confirm="resetConfirmClick()"></uni-popup-dialog>
		</uni-popup>

		<view class="config_list_wrapper">
			<view class="config_item_wrapper">
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">URL</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_item_create.url" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">公众号</view>
					<view class="input_line_tag_wrapper error_tip_wrapper">用不到可以不填</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">APPID</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_item_create.gzh.id" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">授权地址</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_item_create.gzh.jump" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">激活状态</view>
					<view class="input_line_input_wrapper">
						<switch :checked="config_item_create.active" @change="(e)=>{switchChange(e,-1)}"
							style="transform:scale(0.7)" />
						<view class="input_line_tag_wrapper">
							<button @click="addClick()" class="add_button_wrapper">添加</button>
						</view>
					</view>
				</view>
			</view>
			<view @click="saveConfigClick()" class="save_config_button_wrapper">保存配置</view>
			<view @click="resetConfigClick()" class="reset_config_button_wrapper">重置配置</view>
			<view class="config_item_wrapper" v-for="(i,k) in config_arr" :key="k">
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">URL</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_arr[k].url" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">公众号</view>
					<view class="input_line_tag_wrapper error_tip_wrapper">用不到可以不填</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">APPID</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_arr[k].gzh.id" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">授权地址</view>
					<view class="input_line_input_wrapper">
						<uni-easyinput v-model="config_arr[k].gzh.jump" placeholder="请输入"></uni-easyinput>
					</view>
				</view>
				<view class="input_line_wrapper">
					<view class="input_line_tag_wrapper">激活状态</view>
					<view class="input_line_input_wrapper">
						<switch :disabled="config_arr[k].active" :checked="config_arr[k].active" @change="(e)=>{switchChange(e,k)}"
							style="transform:scale(0.7)" />
						<view class="input_line_tag_wrapper">
							<button :disabled="config_arr.length <= 1 || config_arr[k].active" @click="delClick(k)"
								class="del_button_wrapper">删除</button>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bottom_blank_wrapper"></view>
	</view>
</template>
<style>
	page {
		background: #ffffff;
	}
</style>
<style scoped>
	.save_config_button_wrapper {
		width: 700rpx;
		height: 60rpx;
		line-height: 60rpx;
		background: #56bb37;
		color: #ffffff;
		text-align: center;
		margin: 20rpx auto;
	}

	.reset_config_button_wrapper {
		width: 700rpx;
		height: 60rpx;
		line-height: 60rpx;
		background: #c3494e;
		color: #ffffff;
		text-align: center;
		margin: 20rpx auto;
	}

	.del_button_wrapper {
		background: #c3494e;
		color: #ffffff;
		width: 200rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 26rpx;
		font-weight: bold;
		border-radius: 6rpx;
	}

	.add_button_wrapper {
		background: #56bb37;
		color: #ffffff;
		width: 200rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		font-size: 26rpx;
		font-weight: bold;
		border-radius: 6rpx;
	}

	.input_line_input_wrapper {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.config_item_wrapper {
		margin-top: 10rpx;
		padding-bottom: 10rpx;
		border-bottom: 1rpx #cccccc40 solid;
	}

	.input_line_wrapper {
		margin-top: 10rpx;
	}

	.config_list_wrapper {
		width: 730rpx;
		margin: 0 auto;
	}

	.error_tip_wrapper {
		color: #c3494e;
	}
</style>