import { business } from '@/services';
import { formLayout } from '@/utils/formLayout';
import {
	ProForm,
	ProFormText,
	ProFormTextArea,
} from '@ant-design/pro-components';
import { Col, message, Row, Space } from 'antd';

export default function WxPayConfig() {
	return (
		<ProForm<BusinessAPI.WxPayConfigValue>
			{...formLayout()}
			request={async () => {
				const { data } = await business.setting.showSetting({
					settingShowQry: {
						settingKey: 'WX_PAY_CONFIG',
					},
				});

				const wxPayConfigValue =
					data?.settingValue as BusinessAPI.WxPayConfigValue;

				return {
					...wxPayConfigValue,
				} as BusinessAPI.WxMaConfigValue;
			}}
			onFinish={async (values) => {
				await business.setting.updateSetting({
					settingKey: 'WX_PAY_CONFIG',
					settingValue: {
						...values,
						settingKey: 'WX_PAY_CONFIG',
					},
				});

				message.success('更新微信支付配置成功');
			}}
			submitter={{
				render: (_, dom) => {
					return (
						<Row>
							<Col span={14} offset={4}>
								<Space>{dom}</Space>
							</Col>
						</Row>
					);
				},
			}}
		>
			<ProFormText hidden={true} name={'settingId'} />
			<ProFormText
				name="appId"
				label="小程序appId"
				placeholder={'请输入小程序appId'}
				required={true}
				rules={[
					{
						required: true,
						message: '小程序appId为必填项',
					},
				]}
			/>
			<ProFormText
				name="mchId"
				label="支付商号"
				placeholder={'请输入支付商号'}
				extra={'微信支付商号，审核通过后，在微信发送的邮件中查看'}
				required={true}
				rules={[
					{
						required: true,
						message: '支付商号为必填项',
					},
				]}
			/>
			<ProFormText.Password
				name="apiV3Key"
				label="支付秘钥Key"
				placeholder={'请输入支付秘钥Key'}
				extra={'请登录微信支付商户平台，在账户设置-安全设置-API[安全]中设置'}
				required={true}
				rules={[
					{
						required: true,
						message: '支付秘钥Key为必填项',
					},
				]}
			/>
			<ProFormText
				name="certSerialNo"
				label="证书序列号"
				placeholder={'请输入证书序列号'}
				extra={
					'登录商户平台【API安全】->【API证书】->【查看证书】，可查看商户API证书序列号。'
				}
				required={true}
				rules={[
					{
						required: true,
						message: '证书序列号为必填项',
					},
				]}
			/>

			<ProFormTextArea
				label={'客户端密钥'}
				name={'privateKeyString'}
				required={true}
				placeholder={'请输入客户端密钥'}
				rules={[
					{
						required: true,
						message: '客户端密钥为必填项',
					},
				]}
			/>

			<ProFormTextArea
				label={'客户端证书'}
				name={'privateCertString'}
				required={true}
				rules={[
					{
						required: true,
						message: '请输入微信支付客户端证书',
					},
				]}
			/>

			<ProFormText
				name="publicKeyId"
				label="微信支付公钥ID"
				placeholder={'请输入微信支付公钥ID'}
				extra={
					<div>
						微信支付公钥ID，
						<a
							href={
								'https://pay.weixin.qq.com/doc/v3/merchant/4012154180#4.1-%E8%8E%B7%E5%8F%96%E5%BE%AE%E4%BF%A1%E6%94%AF%E4%BB%98%E5%85%AC%E9%92%A5'
							}
						>
							如何获取参考获取微信支付公钥
						</a>
					</div>
				}
				required={true}
				rules={[
					{
						required: true,
						message: '微信支付公钥ID为必填项',
					},
				]}
			/>

			<ProFormTextArea
				name={'publicKeyString'}
				label="微信支付公钥证书"
				required={true}
				rules={[
					{
						required: true,
						message: '微信支付公钥证书为必填项',
					},
				]}
			/>

			<ProFormText
				name="notifyUrl"
				label="回调地址"
				placeholder={'请输入回调地址'}
				required={true}
				rules={[
					{
						required: true,
						message: '请输入回调地址',
					},
				]}
			/>
		</ProForm>
	);
}
