<template>
	<a-card :bordered="false" class="xn-mb10">
		<a-form ref="searchFormRef" name="advanced_search" class="ant-advanced-search-form" :model="searchFormState">
			<a-row :gutter="24">
				<a-col :span="6">
					<a-form-item name="status" label="状态">
						<a-select v-model:value="searchFormState.status" placeholder="请选择">
							<a-select-option v-for="item in statusData" :key="item.value" :value="item.value">{{
								item.label
							}}</a-select-option>
						</a-select>
					</a-form-item>
				</a-col>
				<a-col :span="8">
					<a-button type="primary" @click="tableRef.refresh(true)">
						<template #icon>
							<SearchOutlined />
						</template>
						查询
					</a-button>
					<a-button style="margin-left: 8px" @click="reset">
						<template #icon>
							<redo-outlined />
						</template>
						重置
					</a-button>
				</a-col>
			</a-row>
		</a-form>
	</a-card>
	<a-card :bordered="false">
		<s-table ref="tableRef" :columns="columns" :data="loadData" bordered :row-key="(record) => record.id">
			<template #operator class="table-operator">
				<a-space>
					<a-button type="primary" @click="formRef.onOpen()" v-if="hasPerm('bizRechargePlanConfigAdd')">
						<template #icon>
							<plus-outlined />
						</template>
						新增
					</a-button>
				</a-space>
			</template>
			<template #bodyCell="{ column, record, index }">
				<template v-if="column.dataIndex === 'serial'">
					{{ index + 1 }}
				</template>
				<template v-if="column.dataIndex === 'rebateRatio'">
					{{ record.rebateRatio + ' %' }}
				</template>
				<template v-if="column.dataIndex === 'status'">
					<a-switch
						:loading="loading"
						:checked="record.status === 'ENABLE'"
						checked-children="启用"
						un-checked-children="停用"
						@change="editStatus(record)"
						v-if="hasPerm('bizUserUpdataStatus')"
					/>
					<span v-else>{{ $TOOL.dictTypeData('COMMON_STATUS', record.userStatus) }}</span>
				</template>
				<template v-if="column.dataIndex === 'action'">
					<a-space>
						<a
							@click="formRef.onOpen(record)"
							v-if="hasPerm('bizRechargePlanConfigEdit') && record.status === 'DISABLED'"
							>编辑</a
						>
						<a-divider
							type="vertical"
							v-if="
								hasPerm(['bizRechargePlanConfigEdit', 'bizRechargePlanConfigDelete'], 'and') &&
								record.status === 'DISABLED'
							"
						/>
						<a-popconfirm title="确定要删除吗？" @confirm="deleteBizRechargePlanConfig(record)">
							<a-button
								type="link"
								danger
								size="small"
								v-if="hasPerm('bizRechargePlanConfigDelete') && record.status === 'DISABLED'"
								>删除
							</a-button>
						</a-popconfirm>
					</a-space>
				</template>
			</template>
		</s-table>
	</a-card>
	<Form ref="formRef" @successful="tableRef.refresh()" />
</template>

<script setup name="rechargeplanconfig">
	import Form from './form.vue'
	import bizRechargePlanConfigApi from '@/api/biz/bizRechargePlanConfigApi'
	import tool from '@/utils/tool'
	import { ref } from 'vue'
	const searchFormRef = ref()
	const searchFormState = ref({})
	const tableRef = ref()
	const formRef = ref()
	const loading = ref(false)
	const statusData = tool.dictList('COMMON_STATUS')
	const columns = [
		{
			title: '序号',
			dataIndex: 'serial',
			width: 80
		},
		{
			title: '充值金额及以上（元）',
			dataIndex: 'rechargeAmount'
		},
		{
			title: '优惠券金额（元）',
			dataIndex: 'couponAmount'
		},
		{
			title: '优惠券数量',
			dataIndex: 'couponNum'
		},
		{
			title: '账户余额增加金额（元）',
			dataIndex: 'accountBalance'
		},
		{
			title: '返点比例（代金券）',
			dataIndex: 'rebateRatio'
		},
		{
			title: '状态',
			dataIndex: 'status'
		}
	]
	// 操作栏通过权限判断是否显示
	if (hasPerm(['bizRechargePlanConfigEdit', 'bizRechargePlanConfigDelete'])) {
		columns.push({
			title: '操作',
			dataIndex: 'action',
			align: 'center',
			width: 150
		})
	}
	const loadData = (parameter) => {
		return bizRechargePlanConfigApi
			.bizRechargePlanConfigPage(Object.assign(parameter, searchFormState.value))
			.then((data) => {
				return data
			})
	}
	// 重置
	const reset = () => {
		searchFormRef.value.resetFields()
		tableRef.value.refresh(true)
	}
	// 删除
	const deleteBizRechargePlanConfig = (record) => {
		let params = [
			{
				id: record.id
			}
		]
		bizRechargePlanConfigApi.bizRechargePlanConfigDelete(params).then(() => {
			tableRef.value.refresh(true)
		})
	}
	// 修改状态
	const editStatus = (record) => {
		loading.value = true
		if (record.status === 'ENABLE') {
			bizRechargePlanConfigApi
				.bizRechargePlanConfigDisabled({ id: record.id })
				.then(() => {
					tableRef.value.refresh()
				})
				.finally(() => {
					loading.value = false
				})
		} else {
			bizRechargePlanConfigApi
				.bizRechargePlanConfigEnable({ id: record.id })
				.then(() => {
					tableRef.value.refresh()
				})
				.finally(() => {
					loading.value = false
				})
		}
	}
</script>
