<template>
	<div>
		<el-card :body-style="cardBodyStyle">
			<el-form label-width="160px" label-position="right" inline>
				<div v-for="item in list" :key="item.id">
					<div v-if="item.configKey=='defaultPassword'">
						<el-form-item :label="item.configMemo">
							<el-input v-model="item.configValue" type="password" show-password style="width: 200px;">
								<template #append>
									<el-button @click="modifyItem(item)">
										<el-icon style="vertical-align: middle">
											<EditPen />
										</el-icon>
									</el-button>
								</template>
							</el-input>
						</el-form-item>
					</div>


					<div v-if="item.configKey=='tokenTime'">
						<el-form-item :label="item.configMemo">
							<el-input v-model="item.configValue" style="width: 200px;" disabled>
								<template #append>
									<el-button @click="modifyItem(item)" disabled>
										<el-icon style="vertical-align: middle">
											<EditPen />
										</el-icon>
									</el-button>
								</template>
							</el-input>
						</el-form-item>
					</div>


				</div>
			</el-form>
		</el-card>
	</div>
</template>


<script setup>
	import {
		ref,
		reactive,
		onMounted,
		getCurrentInstance,
		nextTick
	} from 'vue'
	const {
		proxy
	} = getCurrentInstance()

	import style from '@/tools/style'
	const cardBodyStyle = ref(style.card)

	onMounted(() => {
		getList()
	})


	const list = ref([])
	const getList = () => {

		var url = 'framework/SysConfig/query'
		var param = {}
		proxy.$axios.get(url, param).then(response => {
			if (response.data.code == '0') {
				list.value = response.data.data
			} else {
				ElMessage.error('操作失败！' + response.data.msg)
			}
		})
	}
	const modifyItem = (item) => {
		ElMessageBox.confirm(
				'确定修改 ' + item.configMemo+' ?',
				'提示', {
					confirmButtonText: '确认',
					cancelButtonText: '取消',
					type: 'warning',
					draggable: true,
				}
			)
			.then(() => {
				var url = 'framework/SysConfig/save'
				var param = {
					json: JSON.stringify(item)
				}
				proxy.$axios.post(url, param).then(response => {
					if (response.data.code == '0') {
						ElMessage.success('修改成功')
						getList()
					} else {
						ElMessage.error('操作失败！' + response.data.msg)
					}
				})

			})
			.catch(() => {
				ElMessage({
					type: 'info',
					message: '已取消',
				})
			})


	}
</script>

<style>
</style>