Merge branch 'dev' of http://10.0.0.22:3000/lingxi/lingxi-business-paltform into dev

src/pages/transaction/components/orderPayModal/index.less

@@ -100,3 +100,29 @@
   }
 
 }
+
+// 扫码
+.qrCodeImage {
+  text-align: center;
+  width: 224px;
+  height: 224px;
+  margin: 20px auto 42px;
+
+  &>img {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+}
+
+.scanTips {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #6b778c;
+  margin-bottom: 18px;
+  .scanIcon {
+    font-size: 30px;
+    margin-right: @margin-sm;
+  }
+}
\ No newline at end of file

src/pages/transaction/components/orderPayModal/index.tsx

@@ -3,13 +3,14 @@ import { Modal, Steps, Row, Col, Spin, message, Upload, Button, Input } from 'an
 import style from './index.less'
 import { OrderDetailContext } from '../../_public/order/context'
 import cx from 'classnames'
-import { UploadOutlined } from '@ant-design/icons'
+import { ScanOutlined, UploadOutlined } from '@ant-design/icons'
 import { UPLOAD_TYPE } from '@/constants'
 import { usePageStatus } from '@/hooks/usePageStatus'
 import { PublicApi } from '@/services/api'
 import { history } from 'umi'
 import { useHttpRequest } from '@/hooks/useHttpRequest'
 import { encryptedByAES } from '@/utils/cryptoAes'
+import QRCode from 'qrcode'
 
 export interface OrderPayModalProps {
   currentRef: any,
@@ -79,7 +80,9 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
   const [checked, setChecked] = useState<any>({})
   const [current, setCurrent] = useState(0) // 0选择方式 1线下支付方式 2授信支付 3余额支付 4微信支付 5货到付款 1000清除
   const [payStep, setPayStep] = useState(0) // 支付模态框的步骤 0选方式 1下一步的具体操作 2输入支付密码
+  const mobilePayFlag = useRef(0) // 用于判断移动支付类型 4微信 
   const [code, setCode] = useState('')
+  const [qrCodeInfo, setQrCodeInfo] = useState({ generateCharacter: '', qrUrl: '' })
   const [number, setNumber] = useState([0,1,2,3,4,5])
   const { currentRef, confirm } = props
   const [isSpin, setIsSpin] = useState<boolean>(false)
@@ -103,6 +106,24 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
     }
   }, [visible])
 
+  useEffect(() => {
+    if(qrCodeInfo.generateCharacter){
+      generateQrCode()
+    }
+  }, [qrCodeInfo.generateCharacter])
+
+  const generateQrCode = () => {
+    // 生成二维码
+    QRCode.toDataURL(qrCodeInfo.generateCharacter).then((url:any) => {
+      setQrCodeInfo({...qrCodeInfo, qrUrl: url})
+      // 轮询支付结果
+      // setOpenTimer(1)
+    })
+    .catch((err:any) => {
+      console.error(err)
+    })
+  }
+
   const handleConfirm = () => {
     console.log(data,'data')
     if (current === 0) {
@@ -147,13 +168,15 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
           console.log('选择了货到付款')
           setCurrent(5)
           setPayStep(1)
-        } 
-        // else if(checked.id === 2) {
-        //   console.log('选择了微信支付')
+        } else if(checked.id === 2) {
+          console.log('选择了微信支付')
+          // 跳转扫码支付
+          history.push(`/pay?orderId=${btoa(JSON.stringify({ orderId: id, memberId: data.supplyMembersId, memberRoleId: data.supplyMembersRoleId }))}`)
+          // mobilePayFlag.current = 4
           // setCurrent(4)
           // setPayStep(1)
           // handleSubmitPay()
-        // } 
+        }
         else {
           message.error('暂只支持线下支付、授信额度支付、余额支付方式、货到付款')
         }
@@ -232,12 +255,15 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
       params.payOrderUrls = payOrderUrls.join(',')
     }
 
+    console.log(current, payStep,'666',mobilePayFlag)
+
     const res = await run(params)
     if (res.code === 1000) {
-      if(current != 4) {
+      if(mobilePayFlag.current !== 4) {
         history.goBack()
       } else {
         console.log(res, '二维码信息')
+        setQrCodeInfo({ ...qrCodeInfo, generateCharacter: res.data })
       }
     }
   }
@@ -433,9 +459,12 @@ const OrderPayModal: React.FC<OrderPayModalProps> = (props) => {
       {
         current === 4 &&
         <div>
-          <p>微信扫码支付</p>
-          <div>
-
+          <div className={style.qrCodeImage}>
+            <img src={qrCodeInfo.qrUrl} alt=""/>
+            <div className={style.scanTips}>
+              <ScanOutlined className={style.scanIcon} />
+              <span>打开 {mobilePayFlag.current === 4 ? '微信' : '支付宝'}App<br />扫码完成支付</span>
+            </div>
           </div>
         </div>
       }

src/pages/transaction/saleOrder/readyConfirmOrder/detail/index.tsx

@@ -33,17 +33,17 @@ const ReadyConfirmOrderDetail: React.FC = () => {
 
 
   // 提交表单
-  const handleSubmit = useCallback(() => {
+  const handleSubmit = () => {
     approvedRef.current.actions.submit().then(async (v) => {
       const params = {
         id: Number(id),
         state: v.values.state,
         cause: v.values.cause,
       }
-      if(v.values.state) { // 通过
+      if(formContext.data.usingElectronicContracts && v.values.state) { // 使用合同 并且通过
         approvedRef.current.setVisible(false)
         electronRef.current.setVisible(true)
-      } else { // 不通过
+      } else {
         const result = await run(params)
 
         if (result.code === 1000) {
@@ -51,10 +51,8 @@ const ReadyConfirmOrderDetail: React.FC = () => {
           history.goBack()
         }
       }
-      console.log(params, v, 'v', approvedRef.current, electronRef.current)
-
     })
-  }, [])
+  }
 
   return (
     <div>