电子合同

package.json

@@ -33,8 +33,8 @@
     "@ant-design/icons": "^4.2.1",
     "@ant-design/pro-layout": "^5.0.16",
     "@antv/data-set": "^0.11.5",
-    "@formily/antd": "^1.2.11",
-    "@formily/antd-components": "^1.2.11",
+    "@formily/antd": "^1.3.3",
+    "@formily/antd-components": "^1.3.3",
     "@umijs/hooks": "^1.9.3",
     "@umijs/preset-react": "1.x",
     "@umijs/test": "^3.2.0",

src/pages/transaction/purchaseOrder/orderPreview/components/orderElectronModal/index.tsx

 import React from 'react'
 import { Modal } from 'antd'
 import NiceForm from '@/components/NiceForm'
-import { createFormActions } from '@formily/antd'
+import { createFormActions, ISchema } from '@formily/antd'
+import ModalForm from '@/components/ModalForm'
 
-export interface OrderElectronModalProps {}
+export interface OrderElectronModalProps {
+  currentRef: any
+}
 
 const schemaActions = createFormActions()
 
+const schema: ISchema = {
+  type: 'object',
+  properties: {
+    NO_SUBMIT: {
+      type: 'object',
+      "x-component": "mega-layout",
+      "x-component-props": {
+        labelAlign: 'left'
+      },
+      properties: {
+        usingElectronicContracts: {
+          type: 'radio',
+          title: '是否使用电子合同',
+          enum: [
+            { label: '是', value: 1 },
+            { label: '否', value: 2 },
+          ],
+          "x-linkages": [
+            {
+              type: 'value:visible',
+              target: 'contractTemplateId',
+              condition: "{{$value === 1}}"
+            },
+            {
+              type: 'value:visible',
+              target: 'electronicContractName',
+              condition: "{{$value === 1}}"
+            }
+          ]
+        },
+        contractTemplateId: {
+          type: 'string',
+          enum: [],
+          title: '电子合同模板'
+        },
+        electronicContractName: {
+          type: 'string',
+          editable: false,
+          title: '电子合同',
+        },
+        state: {
+          type: 'radio',
+          enum: [
+            { label: '审核通过', value: 1 },
+            { label: '审核不通过', value: 0 },
+          ],
+          default: 1,
+          "x-linkages": [
+            {
+              type: 'value:visible',
+              target: 'cause',
+              condition: "{{$value === 0}}"
+            }
+          ]
+        },
+        cause: {
+          type: 'textarea',
+          "x-component-props": {
+            rows: 4,
+            placeholder: '在此输入你的原因, 最多60个汉字'
+          },
+          title: '审核不通过原因',
+          "x-rules": [
+            {
+              required: true,
+              message: '请输入审核不通过原因'
+            },
+            {
+              limitByte: true,
+              maxByte: 30
+            }
+          ]
+        }
+      }
+    }
+  }
+}
 //@todo 尚未完成
 const OrderElectronModal:React.FC<OrderElectronModalProps> = (props) => {
   return (
-    <Modal>
-      <NiceForm
-        actions={schemaActions}
-        schema={{
-          type: 'object',
-          properties: {
-            NO_SUBMIT: {
-              type: 'object',
-              "x-component": "mega-layout",
-              "x-component-props": {
-                labelAlign: 'top'
-              },
-              properties: {
-
-              }
-            }
-          }
-        }}
-      />
-    </Modal>
+    <ModalForm
+      currentRef={props.currentRef}
+      schema={schema}
+    />
   )
 }
 

src/pages/transaction/purchaseOrder/orderPreview/index.tsx

@@ -21,6 +21,7 @@ import { createFormActions } from '@formily/antd'
 import OrderPayModal from './components/orderPayModal'
 import OrderDeleveRecord from './components/orderDeleveRecord'
 import { PurchaseOrderInsideWorkState } from '@/constants'
+import OrderElectronModal from './components/orderElectronModal'
 
 export interface CommonOrderDetailProps {}
 
@@ -32,10 +33,12 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
   const [btnLoading, setBtnLoading] = useState<boolean>(false)
   const [formData, setFormData] = useState<any>(null)
   const [payList, setPaylist] = useState<any[]>([])
+  
   let { id, pageStatus, page_type = PURCHASE_ORDER_STATUS.PREVIEW_ORDER } = usePageStatus()
   page_type = parseInt(page_type)
   const approvedRef = useRef<any>({})
   const payRef = useRef<any>({})
+  const electronRef = useRef<any>({})
   useEffect(() => {
     if (id) {
       PublicApi.getOrderPurchaseOrderDetails({id}).then(({data, code}) => {
@@ -196,7 +199,7 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
         </div>
       }
     </>
-  }, [formData])
+  }, [formData, btnLoading])
     
   const detailList = [
     { label: '对应报价单号', name: 'quotationNo', span: 8, render: text => <Link to={'/'}>{text}</Link> },
@@ -310,6 +313,9 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
         <OrderPayModal
           currentRef={payRef}
         />
+        <OrderElectronModal
+          currentRef={electronRef}
+        />
       </OrderDetailContext.Provider>
     </div>
   ) : null

src/pages/transaction/purchaseOrder/readyConfirmContract/model/useSelfTable.tsx

 import React, { useEffect, useState } from 'react'
 import { history } from 'umi'
-import { Button, Popconfirm } from 'antd'
+import { Button, Popconfirm, Modal } from 'antd'
 import { baseOrderListColumns } from '../../constant'
 import { PublicApi } from '@/services/api'
 
@@ -13,10 +13,19 @@ export const useSelfTable = () => {
       history.push(`/memberCenter/tranactionAbility/purchaseOrder/orderPreview?page_type=4&id=${record.id}&preview=0`)
     } else {
       // 未认证
-      console.log('未认证电子合同')
+      Modal.confirm({
+        title: '提示',
+        content: '未签约电子合同, 是否要立即前往?',
+        onOk: popConfirm,
+        maskClosable: true
+      })
     }
   }
 
+  const popConfirm = () => {
+    console.log('前往签约')
+  }
+
   useEffect(() => {
     PublicApi.getOrderSignatureAuthAuthState().then(({data}) => {
       setIsSign(data.state === 1)
@@ -29,9 +38,7 @@ export const useSelfTable = () => {
       dataIndex: 'ctl',
       key: 'ctl',
       render: (text, record) => <>
-        <Popconfirm title='您未申请电子签章是否需要立即前往?'>
-          <Button type='link' onClick={() => handleConfirm(record)}>确认电子合同</Button>
-        </Popconfirm>
+        <Button type='link' onClick={() => handleConfirm(record)}>确认电子合同</Button>
       </>
     }
   ])

src/pages/transaction/saleOrder/orderPreview/components/orderElectronModal/index.tsx

 import React from 'react'
-import { Modal } from 'antd'
+import { Modal, Button } from 'antd'
 import NiceForm from '@/components/NiceForm'
-import { createFormActions } from '@formily/antd'
+import { createFormActions, ISchema } from '@formily/antd'
+import ModalForm from '@/components/ModalForm'
+import { useAsyncInitSelect } from '@/formSchema/effects/useAsyncInitSelect'
+import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect'
+import { PublicApi } from '@/services/api'
+import { useHttpRequest } from '@/hooks/useHttpRequest'
 
-export interface OrderElectronModalProps {}
+export interface OrderElectronModalProps {
+  currentRef: any
+}
 
 const schemaActions = createFormActions()
 
+const schema: ISchema = {
+  type: 'object',
+  properties: {
+    NO_SUBMIT: {
+      type: 'object',
+      "x-component": "mega-layout",
+      "x-component-props": {
+        labelAlign: 'left',
+        labelCol: 6
+      },
+      properties: {
+        usingElectronicContracts: {
+          type: 'radio',
+          title: '是否使用电子合同',
+          enum: [
+            { label: '是', value: 1 },
+            { label: '否', value: 2 },
+          ],
+          default: 1,
+          "x-linkages": [
+            {
+              type: 'value:visible',
+              target: 'contractTemplateId',
+              condition: "{{$value === 1}}"
+            },
+            {
+              type: 'value:visible',
+              target: 'electronicContractName',
+              condition: "{{$value === 1}}"
+            }
+          ]
+        },
+        contractTemplateId: {
+          type: 'string',
+          enum: [],
+          title: '电子合同模板',
+          "x-component-props": {
+            placeholder: '请选择电子合同模板',
+            style: {
+              minWidth: 140
+            }
+          },
+          "x-props": {
+            addonAfter: "{{electronBtn}}"
+          }
+        },
+        electronicContractName: {
+          type: 'string',
+          editable: false,
+          title: '电子合同',
+        },
+        state: {
+          type: 'radio',
+          title: '是否审核通过',
+          enum: [
+            { label: '审核通过', value: 1 },
+            { label: '审核不通过', value: 0 },
+          ],
+          default: 1,
+          "x-linkages": [
+            {
+              type: 'value:visible',
+              target: 'cause',
+              condition: "{{$value === 0}}"
+            }
+          ]
+        },
+        cause: {
+          type: 'textarea',
+          "x-component-props": {
+            rows: 4,
+            placeholder: '在此输入你的原因, 最多60个汉字'
+          },
+          title: '审核不通过原因',
+          "x-rules": [
+            {
+              required: true,
+              message: '请输入审核不通过原因'
+            },
+            {
+              limitByte: true,
+              maxByte: 30
+            }
+          ]
+        }
+      }
+    }
+  }
+}
 //@todo 尚未完成
 const OrderElectronModal:React.FC<OrderElectronModalProps> = (props) => {
+  const { run, loading } = useHttpRequest(PublicApi.postOrderSignatureSignContractCreate)
+  const createElectron = async () => {
+    // const contractTemplateId = schemaActions.getFieldValue('contractTemplateId')
+  }
+  const electronBtn = <Button style={{marginLeft: 24}} onClick={createElectron} loading={loading}>生成电子合同</Button>
   return (
-    <Modal>
-      <NiceForm
-        actions={schemaActions}
-        schema={{
-          type: 'object',
-          properties: {
-            NO_SUBMIT: {
-              type: 'object',
-              "x-component": "mega-layout",
-              "x-component-props": {
-                labelAlign: 'top'
-              },
-              properties: {
-
-              }
-            }
-          }
-        }}
-      />
-    </Modal>
+    <ModalForm
+      modalTitle='确认提交审核'
+      previewPlaceholder=' '
+      currentRef={props.currentRef}
+      schema={schema}
+      actions={schemaActions}
+      expressionScope={{
+        electronBtn
+      }}
+      effects={($) => {
+        useAsyncSelect('contractTemplateId', async () => (await PublicApi.getOrderSelectListContractTemplate()).data, ['name', 'id'])
+      }}
+    />
   )
 }
 

src/pages/transaction/saleOrder/orderPreview/index.tsx

@@ -20,6 +20,7 @@ import OrderPayTabs from './components/orderPayTabs'
 import StatusColors from '@/pages/transaction/components/StatusColors'
 import OrderPayResultModal from './components/orderPayResultModal'
 import OrderDeleveRecord from './components/orderDeleveRecord'
+import OrderElectronModal from './components/orderElectronModal'
 
 export interface CommonOrderDetailProps {}
 
@@ -29,6 +30,7 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
   let { id, pageStatus, page_type = SALE_ORDER_STATUS.READY_APPROVED_ORDER, orderDeliveryDetailsId } = usePageStatus()
   page_type = Number(page_type)
   const payResultVisible = useRef<any>({})
+  const electronRef = useRef<any>({})
   const [payResultType, setPayResultType] = useState<'default' | 'preview'>('default')
   useEffect(() => {
     if (id) {
@@ -54,16 +56,15 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
     let result: any = {}
     const caseData = typeof page_type === 'string' ? parseInt(page_type) : page_type
 
-    setBtnLoading(true)
     switch(caseData) {
       case SALE_ORDER_STATUS.READY_APPROVED_ORDER: {
         //@todo 暂时写死
-        const params = {
-          id: parseInt(id),
-          usingElectronicContracts: 0,
-          state: 1
-        }
-        result = await PublicApi.postOrderSubmittedReviewOrder(params)
+        // const params = {
+        //   id: parseInt(id),
+        //   usingElectronicContracts: 0,
+        //   state: 1
+        // }
+        // result = await PublicApi.postOrderSubmittedReviewOrder(params)
         break;
       }
 
@@ -145,6 +146,11 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
       payResultVisible.current.setVisible(true)
       return
     }
+
+    if (page_type === SALE_ORDER_STATUS.READY_APPROVED_ORDER) {
+      electronRef.current.setVisible(true)
+      return 
+    }
     handleSubmit()
   }
 
@@ -221,7 +227,9 @@ const CommonOrderDetail:React.FC<CommonOrderDetailProps> = (props) => {
             <OrderTransformRecord/>
           </div>
         </OrderDetailWrapper>
-
+        <OrderElectronModal
+          currentRef={electronRef}
+        />
         <OrderPayResultModal currentRef={payResultVisible} type={payResultType}/>
       </OrderDetailContext.Provider>
     </div>