feat: 增加生成支付Drawer；支付表单默认当前订单和顾问；图文新增或保存是当前用户

11 months ago · e6756e5da0
parent 0f883df097
commit e6756e5da0
5 changed files with 116 additions and 46 deletions
--- a/src/stores/OrderStore.js
+++ b/src/stores/OrderStore.js
@ -11,6 +11,19 @@ export const useOrderStore = create(devtools((set, get) => ({
  customerDetail: {},
  lastQuotation: {},
  quotationList: [],
+  drawerOpen: false,
+
+  openDrawer: () => {
+    set(() => ({
+      drawerOpen: true
+    }))
+  },
+
+  closeDrawer: () => {
+    set(() => ({
+      drawerOpen: false
+    }))
+  },

  fetchOrderList: async (formValues, loginUser) => {
    let fetchOrderUrl = `${API_HOST}/getwlorder?opisn=${loginUser.userIdStr}&otype=${formValues.type}`
@ -46,6 +59,12 @@ export const useOrderStore = create(devtools((set, get) => ({
            lastQuotation: orderResult.quotes.length > 0 ? orderResult.quotes[0] : {},
            quotationList: orderResult.quotes,
          }))
+          return {
+            orderDetail: orderResult,
+            customerDetail: orderResult.contact.length > 0 ? orderResult.contact[0] : {},
+            lastQuotation: orderResult.quotes.length > 0 ? orderResult.quotes[0] : {},
+            quotationList: orderResult.quotes,
+          }
        } else {
          throw new Error(json?.errmsg + ': ' + json.errcode)
        }
--- a/src/stores/SnippetStore.js
+++ b/src/stores/SnippetStore.js
@ -114,7 +114,7 @@ const useSnippetStore = create(devtools((set, get) => ({
    formData.append('type', formValues.category)
    formData.append('title', formValues.title)
    formData.append('adi_content', formValues.content.htmlContent)
-    formData.append('opi_sn', 383)
+    formData.append('opi_sn', formValues.opi_sn)

    return postForm(postSnippetUrl, formData)
      .then(json => {
--- a/src/views/DesktopApp.jsx
+++ b/src/views/DesktopApp.jsx
@ -1,5 +1,6 @@
 import useAuthStore from '@/stores/AuthStore'
 import useSnippetStore from '@/stores/SnippetStore'
+import { useOrderStore } from '@/stores/OrderStore'
 import useConversationStore from '@/stores/ConversationStore'
 import { useThemeContext } from '@/stores/ThemeContext'
 import { DownOutlined } from '@ant-design/icons'
@ -26,7 +27,8 @@ import 'react-chat-elements/dist/main.css'
 import ReloadPrompt from './ReloadPrompt'
 import ClearCache from './ClearCache'

-import SnippetList from './accounts/SnippetList'
+import SnippetList from '@/views/accounts/SnippetList'
+import GeneratePayment from '@/views/accounts/GeneratePayment'

 import { BUILD_VERSION, BUILD_DATE } from '@/config'

@ -42,18 +44,30 @@ function DesktopApp() {
  const totalNotify = useConversationStore((state) => state.totalNotify)

  const [
-    openSnippetDrawer ,
-    closeDrawer,
-    drawerOpen,
+    openSnippetDrawer,
+    closeSnippetDrawer,
+    snippetDrawerOpen,
  ] = useSnippetStore((state) => [
    state.openDrawer,
    state.closeDrawer,
    state.drawerOpen,
  ])

+  const [
+    openPaymentDrawer,
+    closePaymentDrawer,
+    paymentDrawerOpen,
+  ] = useOrderStore((state) => [
+    state.openDrawer,
+    state.closeDrawer,
+    state.drawerOpen,
+  ])
+
  const onClick = ({ key }) => {
    if (key === 'snippet-list') {
      openSnippetDrawer()
+    } else if (key == 'generate-payment') {
+      openPaymentDrawer()
    }
  }

@ -110,11 +124,20 @@ function DesktopApp() {
          title='图文集管理'
          placement={'top'}
          size={'large'}
-          onClose={() => closeDrawer()}
-          open={drawerOpen}
+          onClose={() => closeSnippetDrawer()}
+          open={snippetDrawerOpen}
          >
          <SnippetList></SnippetList>
        </Drawer>
+        <Drawer
+          title='生成支付链接'
+          placement={'top'}
+          size={'large'}
+          onClose={() => closePaymentDrawer()}
+          open={paymentDrawerOpen}
+          >
+          <GeneratePayment></GeneratePayment>
+        </Drawer>
        <Row gutter={{ md: 24 }} align='middle'>
          <Col flex='220px'>
            <NavLink to='/'>
@ -169,7 +192,7 @@ function DesktopApp() {
                    key: 'profile',
                  },
                  {
-                    label: <Link to='/account/generate-payment'>付款链接</Link>,
+                    label: '生成付款链接',
                    key: 'generate-payment',
                  },
                  {
--- a/src/views/accounts/GeneratePayment.jsx
+++ b/src/views/accounts/GeneratePayment.jsx
@ -2,6 +2,7 @@ import { Radio, Row, Col, Tooltip, Flex, Form, Input, Button, InputNumber, Selec
 import { useState, useEffect } from 'react'
 import HtmlPreview from './HtmlPreview'
 import useAuthStore from '@/stores/AuthStore'
+import useConversationStore from '@/stores/ConversationStore'
 import { useOrderStore } from '@/stores/OrderStore'
 import { InfoCircleOutlined } from '@ant-design/icons'

@ -10,8 +11,9 @@ function GeneratePayment() {

  const [generateForm] = Form.useForm()

-  const [getPrimaryEmail, loginUser] = useAuthStore(s => [s.getPrimaryEmail, s.loginUser])
-  const [generatePayment] = useOrderStore(s => [s.generatePayment])
+  const [getPrimaryEmail, loginUser] = useAuthStore((s) => [s.getPrimaryEmail, s.loginUser])
+  const [generatePayment, fetchOrderDetail] = useOrderStore((s) => [s.generatePayment, s.fetchOrderDetail])
+  const currentOrder = useConversationStore((state) => state.currentConversation?.coli_sn || '')

  const [isHtmlLoading, setHtmlLoading] = useState(false)
  const [generatedObject, setGeneratedObject] = useState('')
@ -26,6 +28,35 @@ function GeneratePayment() {
      .finally(() => setHtmlLoading(false))
  }

+  useEffect(() => {
+    if (currentOrder) {
+      fetchOrderDetail(currentOrder)
+        .then((result) => {
+          const orderNumber = result.orderDetail.order_no
+          const travelAdvisor = loginUser.accountList.length > 0 ? loginUser.accountList[0].OPI_NameEN : ''
+          generateForm.setFieldsValue({
+            notifyEmail: getPrimaryEmail(),
+            orderNumber: orderNumber,
+            description: 'Tracking Code: ' + orderNumber + '\r\nTravel Advisor: ' + travelAdvisor + '\r\nContent: \r\n',
+            langauge: 'US',
+            orderType: '227001',
+            currency: 'USD',
+            amount: 1,
+            userId: loginUser.userId,
+          })
+        })
+        // .finally(() => setLoading(false))
+        .catch((reason) => {
+          // notification.error({
+          // 	message: "查询出错",
+          // 	description: reason.message,
+          // 	placement: "top",
+          // 	duration: 60,
+          // });
+        })
+    }
+  }, [currentOrder])
+
  return (
    <>
      <Row gutter={16}>
@ -35,39 +66,33 @@ function GeneratePayment() {
              span: 4,
            }}
            layout={'horizontal'}
-            form={generateForm}
-            initialValues={{
-              notifyEmail: getPrimaryEmail(),
-              description: 'Tracking Code:\r\nTravel Advisor: \r\nContent:\r\n',
-              orderNumber: 'lyj202411141004001',
-              langauge: 'US',
-              orderType: '227001',
-              currency: 'USD',
-              amount: 1,
-              userId: loginUser.userId
-            }}>
-            <Form.Item name='userId' className='hidden' ><Input /></Form.Item>
-            <Form.Item label='订单类型' name='orderType'
+            form={generateForm}>
+            <Form.Item name='userId' className='hidden'>
+              <Input />
+            </Form.Item>
+            <Form.Item
+              label='订单类型'
+              name='orderType'
              rules={[
                {
                  required: true,
                  message: '订单类型必选',
                },
-              ]}
-            >
+              ]}>
              <Radio.Group>
                <Radio.Button value='227001'>线路订单</Radio.Button>
                <Radio.Button value='227002'>商务订单</Radio.Button>
              </Radio.Group>
            </Form.Item>
-            <Form.Item label='语种' name='langauge'
+            <Form.Item
+              label='语种'
+              name='langauge'
              rules={[
                {
                  required: true,
                  message: '语种必选',
                },
-              ]}
-            >
+              ]}>
              <Select
                options={[
                  { value: 'US', label: '英语' },
@ -80,24 +105,26 @@ function GeneratePayment() {
                ]}
              />
            </Form.Item>
-            <Form.Item label='订单号' name='orderNumber'
+            <Form.Item
+              label='订单号'
+              name='orderNumber'
              rules={[
                {
                  required: true,
                  message: '订单号必填',
                },
-              ]}
-            >
+              ]}>
              <Input />
            </Form.Item>
-            <Form.Item label='金额' name='amount'
+            <Form.Item
+              label='金额'
+              name='amount'
              rules={[
                {
                  required: true,
                  message: '金额填',
                },
-              ]}
-            >
+              ]}>
              <InputNumber
                addonBefore={
                  <Form.Item name='currency' noStyle>
@ -106,16 +133,14 @@ function GeneratePayment() {
                        width: 90,
                      }}
                      options={[
-                        {value: 'USD', label: '美元'},
-                        {value: 'CNY', label: '人民币'},
-                        {value: 'EUR', label: '欧元'},
-                        {value: 'JPY', label: '日元'},
-                        {value: 'AUD', label: '澳元'},
-                        {value: 'CAD', label: '加元'},
-                        {value: 'HKD', label: '港币'},
-                      ]}
-                    >
-                    </Select>
+                        { value: 'USD', label: '美元' },
+                        { value: 'CNY', label: '人民币' },
+                        { value: 'EUR', label: '欧元' },
+                        { value: 'JPY', label: '日元' },
+                        { value: 'AUD', label: '澳元' },
+                        { value: 'CAD', label: '加元' },
+                        { value: 'HKD', label: '港币' },
+                      ]}></Select>
                  </Form.Item>
                }
                min={1}
--- a/src/views/accounts/SnippetList.jsx
+++ b/src/views/accounts/SnippetList.jsx
@ -70,12 +70,12 @@ function SnippetList() {
  }

  const handelSnippetEdit = () => {
-    snippetForm.setFieldsValue(currentSnippet)
+    snippetForm.setFieldsValue({opi_sn: loginUser.userId, ...currentSnippet})
    setSnippetModalOpen(true)
  }

  const handelSnippetNew = () => {
-    const snippet = createSnippet(383)
+    const snippet = createSnippet(loginUser.userId)
    snippetForm.setFieldsValue(snippet)
    setSnippetModalOpen(true)
  }
@ -131,6 +131,9 @@ function SnippetList() {
        <Form.Item name='snippetId' className='hidden'>
          <Input />
        </Form.Item>
+        <Form.Item name='opi_sn' className='hidden'>
+          <Input />
+        </Form.Item>
        <Form.Item
          label='标题'
          name='title'