140 lines
4.4 KiB
TypeScript
140 lines
4.4 KiB
TypeScript
import { Button, FormInstance, Space } from "antd";
|
|
import { inject, observer } from "mobx-react";
|
|
import { useEffect } from "react";
|
|
import { Store } from "antd/lib/form/interface";
|
|
import SimpleForm from "@/components/form/simple_form";
|
|
import React from "react";
|
|
import { useParams } from "react-router";
|
|
const PayConfig = (props: Store) => {
|
|
const { appStore } = props;
|
|
const { id } = useParams();
|
|
const wxformRef = React.useRef<FormInstance>(null);
|
|
const aliformRef = React.useRef<FormInstance>(null);
|
|
useEffect(() => {
|
|
wxformRef.current?.setFieldsValue(appStore.item?.wechat)
|
|
aliformRef.current?.setFieldsValue(appStore.item?.ali)
|
|
}, [appStore.item,id]);
|
|
const onFinishFailed = () => {};
|
|
const onwxFinish = (values: any) => {
|
|
appStore.setWechatConfig(id,values)
|
|
};
|
|
const onAliFinish = (values: any) => {
|
|
appStore.setAlConfig(id,values)
|
|
};
|
|
return (
|
|
<div className="contentBox">
|
|
<Space direction="vertical" size="middle" style={{ display: "flex" }}>
|
|
<div style={{ backgroundColor: "#fff", padding: "10px" }}>
|
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
|
<p>微信支付</p>
|
|
<Button
|
|
type="primary"
|
|
onClick={() => {
|
|
wxformRef.current?.submit();
|
|
}}
|
|
>
|
|
保存
|
|
</Button>
|
|
</div>
|
|
<SimpleForm
|
|
formName={""}
|
|
colProps={0}
|
|
formRef={wxformRef}
|
|
onFinish={onwxFinish}
|
|
onFinishFailed={onFinishFailed}
|
|
formDatas={[
|
|
{
|
|
type: "input",
|
|
label: "wechatAppid",
|
|
name: "wechatAppid",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "mchid",
|
|
name: "mchid",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "body",
|
|
name: "body",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "notifyURL",
|
|
name: "notifyURL",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "key",
|
|
name: "key",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
<div style={{ backgroundColor: "#fff", padding: "10px" }}>
|
|
<div style={{ display: "flex", justifyContent: "space-between" }}>
|
|
<p>支付宝支付</p>
|
|
<Button
|
|
type="primary"
|
|
onClick={() => {
|
|
aliformRef.current?.submit();
|
|
}}
|
|
>
|
|
保存
|
|
</Button>
|
|
</div>
|
|
<SimpleForm
|
|
formRef={aliformRef}
|
|
formName={""}
|
|
colProps={0}
|
|
onFinish={onAliFinish}
|
|
onFinishFailed={onFinishFailed}
|
|
formDatas={[
|
|
{
|
|
type: "input",
|
|
label: "AliAppId",
|
|
name: "appid",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "AliKey",
|
|
name: "aliKey",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "returnUrl",
|
|
name: "returnUrl",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
{
|
|
type: "input",
|
|
label: "notifyURL",
|
|
name: "notifyURL",
|
|
value: "",
|
|
rules: [{ required: true, message: "请输入卡片名称!" }],
|
|
},
|
|
]}
|
|
/>
|
|
</div>
|
|
</Space>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default inject("appStore")(observer(PayConfig));
|