Global-sales/src/views/accounts/GeneratePayment.jsx

import { App, Row, Col, Flex, Form, Input, Button, InputNumber, Select, message } from 'antd'
import { useState, useEffect } from 'react'
import HtmlPreview from './HtmlPreview'
import useAuthStore from '@/stores/AuthStore'

function GeneratePayment() {
  const [messageApi, contextHolder] = message.useMessage()

  const [searchform] = Form.useForm()

  const [isHtmlLoading, setHtmlLoading] = useState(false)

  const handleSearchFinish = (values) => {
  }

  useEffect(() => {}, [])

  return (
    <>
      <Row gutter={16}>
        <Col span={6} offset={6}>
          <Form
            labelCol={{
              span: 4,
            }}
            layout={'horizontal'}
            form={searchform}
            onFinish={handleSearchFinish}
            initialValues={{}}>
            <Form.Item label='币种' name='owner'>
              <Select
                options={[
                  { value: '美元', label: '美元' },
                  { value: '欧元', label: '欧元' },
                  { value: '人民币', label: '人民币' },
                ]}></Select>
            </Form.Item>
            <Form.Item label='语种' name='type'>
              <Select
                options={[
                  { value: '英语', label: '英语' },
                  { value: '意语', label: '意语' },
                  { value: '法语', label: '法语' },
                ]}
              />
            </Form.Item>
            <Form.Item label='订单类型' name='订单类型'>
              <Select
                options={[
                  { value: '线路订单', label: '线路订单' },
                  { value: '商务订单', label: '商务订单' },
                ]}
              />
            </Form.Item>
            <Form.Item label='订单号' name='订单号'>
              <Input />
            </Form.Item>
            <Form.Item label='金额' name='title'>
              <InputNumber className='w-full' />
            </Form.Item>
            <Form.Item label='描述' name='描述'>
              <Input.TextArea rows={4} />
            </Form.Item>
            <Form.Item label='通知邮箱' name='通知邮箱'>
              <Input />
            </Form.Item>
          </Form>

          <Flex gap='middle' justify='center'>
            <Button onClick={() => {}}>生成</Button>
            <Button type='primary' onClick={() => {}}>
              复制
            </Button>
          </Flex>
        </Col>

        <Col span={6}>
          <HtmlPreview />
        </Col>
        {contextHolder}
      </Row>
    </>
  )
}

export default GeneratePayment