feat: Update toolbar

feat: Update toolbar feat: Update toolbar
quanxiang-cloud · Jan 2, 2024 · 10e5bee · 10e5bee
1 parent 9169ff8
commit 10e5bee
Show file tree

Hide file tree

Showing 3 changed files with 43 additions and 7 deletions.
diff --git a/clients/home/pages/app-table-view-detail/details-drawer.tsx b/clients/home/pages/app-table-view-detail/details-drawer.tsx
@@ -100,7 +100,7 @@ function DetailsDrawer(
     const operationRecord = operationRecords?.find((item: any)=> item?.creatorId === USER?.id);
     if (operationRecord?.taskId) {
       // window.location = `/approvals/${processInstanceId}/${operationRecords?.[0]?.taskId}/ALL_PAGE/${_taskType}` as any;
-      window.location = `/approvals/${taskID}/${id}/ALL_PAGE/${_taskType}` as any;
+      window.location = `/approvals/${taskID}/${id}/WAIT_HANDLE_PAGE/${_taskType}` as any;
     } else {
       // getTaskFormById(processInstanceId, { type: 'ALL_PAGE', taskId: '' })
       //   .then((res: any)=>{
@@ -112,7 +112,7 @@ function DetailsDrawer(
       //   .catch((err)=>{
       //   // window.open(`/approvals/${processInstanceId}/${id}/ALL_PAGE`);
       //   });
-      window.location = `/approvals/${taskID}/${id}/ALL_PAGE/${_taskType}` as any;
+      window.location = `/approvals/${taskID}/${id}/WAIT_HANDLE_PAGE/${_taskType}` as any;
     }
   };
 

diff --git a/clients/home/pages/new-approvals/detail/index.tsx b/clients/home/pages/new-approvals/detail/index.tsx
@@ -65,6 +65,8 @@ function ApprovalDetail(): JSX.Element {
     taskType: string;
   }>();
 
+  const [readOnly, setReadOnly] = useState((type === 'WAIT_HANDLE_PAGE' || type === 'ALL_PAGE') ? true : false);
+
   const history = useHistory();
   const queryRelationKey = showSwitch ? [processInstanceID, type, currentTaskId] : [processInstanceID, type];
   const searchArr = window.location.search?.replace('?', '')?.split('&');
@@ -253,13 +255,21 @@ function ApprovalDetail(): JSX.Element {
   useEffect(()=>{
     if (count > 0) {
       const { value, currTask, reasonRequired } = actionParams;
-      validate ? store.handleClickAction(value, currTask, reasonRequired) : toast.error('必填项未填写完整');
+      if (value === 'REFUSE' && readOnly === true) {
+        store.handleClickAction(value, currTask, reasonRequired);
+      } else {
+        validate ? store.handleClickAction(value, currTask, reasonRequired) : toast.error('必填项未填写完整');
+      }
     }
   }, [count]);
 
   const onSubmitClick = (value: any, currTask: any, reasonRequired: any)=>{
     setActionParams({ value, currTask, reasonRequired });
-    submitRef?.current?.click();
+    if (value === 'REFUSE' && readOnly === true) {
+      setCount(count + 1);
+    } else {
+      submitRef?.current?.click();
+    }
   };
 
   const formatProperties = (data: any, fieldPermission?: any)=>{
@@ -296,11 +306,11 @@ function ApprovalDetail(): JSX.Element {
       <div className='task-form overflow-auto px-24'>
         {
           task?.formSchema &&
-        (<FormRenderer
+        ( <FormRenderer
           value={formData}
           schema={formatFormSchema(task.formSchema, task?.fieldPermission) || {}}
           onFormValueChange={setFormValues}
-          readOnly={taskEnd || type === 'APPLY_PAGE' || type === 'HANDLED_PAGE' || task?.taskType === 'Finish' }
+          readOnly={( readOnly && (type === 'WAIT_HANDLE_PAGE' || type === 'ALL_PAGE') && taskType !== FILL_IN) || taskEnd || type === 'APPLY_PAGE' || type === 'HANDLED_PAGE' || task?.taskType === 'Finish' }
           usePermission
           onValidate={(value) => {
             setValidate(value);
@@ -315,6 +325,10 @@ function ApprovalDetail(): JSX.Element {
     );
   };
 
+  const handleEditApproval = ()=>{
+    setReadOnly(!readOnly);
+  };
+
   if (isLoading) {
     return <Loading />;
   }
@@ -364,6 +378,8 @@ function ApprovalDetail(): JSX.Element {
                 formData={formValues}
                 onSubmitClick={onSubmitClick}
                 taskType = {taskType}
+                onEditApproval={handleEditApproval}
+                editApproval={!readOnly}
               />
               <div className='flow-name hidden'>{data?.flowName}</div>
               {renderSchemaForm(task)}

diff --git a/clients/home/pages/new-approvals/detail/toolbar.tsx b/clients/home/pages/new-approvals/detail/toolbar.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable max-len */
 import React, { useEffect, useState } from 'react';
 import { useHistory, useParams } from 'react-router-dom';
 import cs from 'classnames';
@@ -26,6 +27,8 @@ interface Props {
   schema: ISchema;
   formData: Record<string, unknown>;
   taskType?: string;
+  onEditApproval?: () => void;
+  editApproval?: boolean;
 }
 
 const moreActions = [
@@ -40,7 +43,7 @@ const getIconByAction = (action: string): string => {
 
 function Toolbar({
   currTask, permission, onClickAction, globalActions, workFlowType, schema, formData, taskType,
-  onSubmitClick,
+  onSubmitClick, onEditApproval, editApproval,
 }: Props): JSX.Element {
   const { processInstanceID, taskID } = useParams<{ processInstanceID: string; taskID: string }>();
   const [comment, setComment] = useState('');
@@ -122,6 +125,11 @@ function Toolbar({
       }
     }).catch((err) => toast.error(err.message || '操作失败'));
   }
+
+  const handleEditApproval = ()=>{
+    onEditApproval && onEditApproval();
+  };
+
   return (
     <div className="approval-detail-toolbar flex justify-between items-center py-10 px-24 mb-10">
       <div className="left-btns task-custom-actions flex flex-1 flex-wrap">
@@ -164,6 +172,18 @@ function Toolbar({
       </div>
 
       <div className="right-btns task-default-actions">
+        {
+          (workFlowType === 'WAIT_HANDLE_PAGE' || workFlowType === 'ALL_PAGE') &&
+         taskType !== FILL_IN &&
+         showBtn &&
+         ( <Button
+           onClick={handleEditApproval}
+           style={{ border: '1px solid var(--gray-700)' }}
+         >
+           { !editApproval ? '编辑' : '退出'}
+         </Button>)
+        }
+
         {
           ((taskType !== FILL_IN && workFlowType === 'WAIT_HANDLE_PAGE' && !system?.length) ? systemApproval : system)?.map(({ name, value, enabled, defaultText, text, reasonRequired }: PermissionItem, idx) => {
             if (!enabled) {