处理流程 20%

web/client/src/components/index.js

@@ -7,6 +7,8 @@ import OutHidden from './outHidden'
 import Uploads from './Uploads/index'
 import WorkflowModal from './workflow';
 import WorkFlowViewModal from './workflow/view'
+import WorkflowApprovalModal from './workflow/approval'
+
 export {
    SimpleFileDownButton,
    ReminderBox,
@@ -15,5 +17,6 @@ export {
    OutHidden,
    Uploads,
    WorkflowModal,
-   WorkFlowViewModal
+   WorkFlowViewModal,
+   WorkflowApprovalModal,
 };

web/client/src/components/workflow/approval.jsx

@@ -0,0 +1,84 @@
+'use strict';
+
+import React from 'react';
+import { connect } from 'react-redux';
+import { Modal, Spin, Notification, Row, Space, Button } from '@douyinfe/semi-ui';
+import { EmisRequest, EmisApiTable } from '$utils';
+import { useState } from 'react';
+import { useEffect } from 'react';
+import { IconClose } from '@douyinfe/semi-icons';
+import './index.less'
+
+const WorkFlowApprovalModal = (props) => {
+   const { visible, onCancel, webEmis, user, postData } = props;
+   const [loading, setLoading] = useState(true);
+
+   const iframeRef = React.createRef();
+
+   return (
+      <div>
+         <Modal
+            fullScreen
+            visible={visible}
+            width={'100%'}
+            closable={false}
+            hasCancel={false}
+            footer={null}
+            wrapClassName='process_modal_wrap'
+         >
+            <div className='workflow-body'>
+               <div className='workflow-body-header'>
+                  <img src='/assets/images/fs-logo.png' />
+                  <span className='workflow-body-header_title'>
+                     <span className='workflow-body-header_title_shu'>|</span>
+                     <span className='workflow-body-header_title_zi'>让世间万物拥有感知，服务人类社会于美好</span>
+                  </span>
+                  <IconClose className="workflow-body-header_closeIcon" onClick={() => {
+                     onCancel && onCancel();
+                     setLoading(false);
+                  }} />
+               </div>
+               <div className='workflow-body-form'>
+                  <Spin
+                     spinning={loading}
+                  >
+                     {
+                        // webEmis && processId || 
+                        1 ?
+                           <iframe
+                              id='workflowFrame'
+                              onLoad={() => {
+                                 let frameWin = document.getElementById('workflowFrame');
+                                 frameWin.contentWindow.postMessage(JSON.stringify({
+                                    
+                                 }), '*');
+                                 setLoading(false);
+                              }}
+                              allowTransparency="true"
+                              ref={iframeRef}
+                              src={`${webEmis}/approval/info?token=${user.token}`}
+                              width={'100%'}
+                              style={{ height: '100vh' }}
+                              frameBorder="0"
+                           ></iframe>
+                           : ''
+                     }
+                  </Spin>
+               </div>
+            </div>
+         </Modal >
+      </div>
+   )
+}
+
+function mapStateToProps (state) {
+   const { auth, global } = state;
+   return {
+      user: auth.user,
+      clientHeight: global.clientHeight,
+      webEmis: global.webEmis,
+      webOa: global.webOa
+   }
+}
+
+export default connect(mapStateToProps)(WorkFlowApprovalModal);

web/client/src/components/workflow/index.jsx

@@ -14,6 +14,7 @@ import './index.less'
 const { confirm } = Modal;
 
 const WorkFlowModal = (props) => {
+   // 这个弹框是发起表单滴
    const { successCallBack = () => { }, title, visible, clientHeight, postData, processId, user, dispatch, webEmis, webOa, onCancel } = props;
    const [loading, setLoading] = useState(true);
    const [ifShowMessage, setIfShowMessage] = useState(true);
@@ -168,7 +169,6 @@ const WorkFlowModal = (props) => {
                                  取消
                               </Button>
                            </Space>
-
                         }
                      >
                      </Modal>

web/client/src/sections/workOrder/containers/jobOrder.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from 'react';
 import { connect } from 'react-redux';
 import moment from 'moment';
-import { WorkflowModal, WorkFlowViewModal } from "$components"
+import { WorkflowModal, WorkFlowViewModal, WorkflowApprovalModal } from "$components"
 import { EmisRequest, EmisApiTable } from "$utils"
 import { Card, Notification, Space, Button, Spin } from '@douyinfe/semi-ui';
 import { IconArticle } from '@douyinfe/semi-icons';
@@ -78,17 +78,21 @@ const JobOrder = (props) => {
                })
             }
          </div>
-         <WorkflowModal
+         {/* <WorkflowModal
             visible={workflowModalVisible}
             title={''}
             processId={launchProcessId}
             onCancel={() => { setWorkflowModalVisible(false) }}
             successCallBack={() => { setWorkflowModalVisible(false) }}
-         />
+         /> */}
          {/* <WorkFlowViewModal
             visible={workflowModalVisible}
             processId={launchProcessId}
          /> */}
+         {<WorkflowApprovalModal
+            visible={workflowModalVisible}
+            onCancel={() => { setWorkflowModalVisible(false) }}
+         />}
       </div>
    )
 }

web/package.json

@@ -7,7 +7,7 @@
       "test": "mocha",
       "start-vite": "cross-env NODE_ENV=developmentVite npm run start-params",
       "start": "cross-env NODE_ENV=development npm run start-params",
-      "start-params": "node server -p 5600 -u http://localhost:4600 --apiPomsUrl http://localhost:4600 --apiAnxinyunUrl http://10.8.30.112:4100 --apiEmisUrl http://10.8.30.161:1111 --webEmisUrl http://10.8.30.161:1112 --webOaUrl http://10.8.30.161:8668  --qnak 5XrM4wEB9YU6RQwT64sPzzE6cYFKZgssdP5Kj3uu --qnsk w6j2ixR_i-aelc6I7S3HotKIX-ukMzcKmDfH6-M5 --qnbkt anxinyun-test --qndmn http://test.resources.anxinyun.cn --iotVcmpWeb https://mediaconsole.ngaiot.com  --pomsMonitor http://monitor.anxinyun.cn/goto/PaEDLE84z?orgId=1  --pomsKubesphere https://k8sadmin.anxinyun.cn/  --pomsAmbari https://ambari.anxinyun.cn/  --pomsKowl https://kafka.anxinyun.cn/  --pomsPghero https://pghero.anxinyun.cn/  --pomsEs https://esc.anxinyun.cn/  --pomsNotebook https://inotebook.anxinyun.cn/  --dcWeb  https://fsiot-oamss.anxinyun.cn",
+      "start-params": "node server -p 5600 -u http://localhost:4600 --apiPomsUrl http://localhost:4600 --apiAnxinyunUrl http://10.8.30.112:4100 --apiEmisUrl http://localhost:14000 --webEmisUrl http://localhost:5000 --webOaUrl http://10.8.30.161:8668  --qnak 5XrM4wEB9YU6RQwT64sPzzE6cYFKZgssdP5Kj3uu --qnsk w6j2ixR_i-aelc6I7S3HotKIX-ukMzcKmDfH6-M5 --qnbkt anxinyun-test --qndmn http://test.resources.anxinyun.cn --iotVcmpWeb https://mediaconsole.ngaiot.com  --pomsMonitor http://monitor.anxinyun.cn/goto/PaEDLE84z?orgId=1  --pomsKubesphere https://k8sadmin.anxinyun.cn/  --pomsAmbari https://ambari.anxinyun.cn/  --pomsKowl https://kafka.anxinyun.cn/  --pomsPghero https://pghero.anxinyun.cn/  --pomsEs https://esc.anxinyun.cn/  --pomsNotebook https://inotebook.anxinyun.cn/  --dcWeb  https://fsiot-oamss.anxinyun.cn",
       "deploy": "export NODE_ENV=production&& npm run build && node server",
       "build-dev": "cross-env NODE_ENV=development&&webpack --config webpack.config.js",
       "build": "cross-env NODE_ENV=production&&webpack --config webpack.config.prod.js"