审批时增加批注功能

src/pages/Detail/AuditModal.js

@@ -1,12 +1,11 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { Form } from '@ant-design/compatible';
 import '@ant-design/compatible/assets/index.css';
 import { Modal, Input } from 'antd';
 
-
 // 审批意见
 function AuditModal(props) {
-  const { visible, onClose, onOk, form, loading } = props;
+  const { visible, onClose, onOk, form, sheetRef, loading } = props;
 
   const handleOk = () => {
     form.validateFields((err, fieldsValue) => {
@@ -14,6 +13,18 @@ function AuditModal(props) {
       onOk(fieldsValue);
     });
   };
+  useEffect(() => {
+    if (visible) {
+      const comment = sheetRef.current.getComment();
+      console.log(comment);
+      let str = '';
+      comment.forEach(item => {
+        let col = String.fromCharCode(item.c + 65);
+        str += `单元格${col}${item.r}：${item.value}\n`;
+      });
+      form.setFieldsValue({ audit_comment: str });
+    }
+  }, [visible]);
 
   return (
     <Modal
@@ -31,4 +42,4 @@ function AuditModal(props) {
   );
 }
 
-export default Form.create()(AuditModal)
+export default Form.create()(AuditModal);

src/pages/Detail/Index.js

@@ -216,9 +216,9 @@ function Detail(props) {
       },
     });
   };
-
-  const onUpdate = () => {
-    if (flow.active != 0) return;
+  // 更新表单，flag为true时不判断是否属于审批，强制更新
+  const onUpdate = (flag) => {
+    if (!flag && flow.active != 0) return;
     let currentData = sheetRef.current.getSheetJson().data;
     let sheets = JSON.parse(JSON.stringify(currentData));
     sheets.forEach(item => {
@@ -596,6 +596,7 @@ function Detail(props) {
       <AuditModal
         loading={getLoading()}
         visible={auditVisible}
+        sheetRef={sheetRef}
         onClose={() => setAuditVisible(false)}
         onOk={onAudit}
       />

src/pages/Detail/LuckySheet.js

@@ -105,6 +105,14 @@ class LuckySheet extends React.Component {
             }, 3000);
           }
         },
+        // 修改批注后保存sheet
+        commentUpdateAfter() {
+          clearTimeout(_this.updateTimer);
+          _this.updateTimer = setTimeout(() => {
+            onUpdate.bind(_this);
+            onUpdate(true);
+          }, 3000);
+        },
         sheetActivate: sheet => {
           console.log(sheet);
           setTimeout(() => {
@@ -540,6 +548,25 @@ class LuckySheet extends React.Component {
     let currentData = this.getExcelData(checkValue);
     exportExcel(currentData, '下载');
   }
+  // 获取批注
+  getComment() {
+    let sheets = this.luckysheet.toJson().data;
+    let comment = [];
+    sheets.forEach(sheet => {
+      sheet.celldata.forEach(cell => {
+        // 判断是否含有批注
+        if (cell?.v?.ps?.value) {
+          comment.push({
+            sheet: sheet.name,
+            r: cell.r,
+            c: cell.c,
+            value: cell.v.ps.value || '',
+          });
+        }
+      });
+    });
+    return comment;
+  }
 
   render() {
     return (