HQ_yueYue/后台管理/src/pages/A2orderSet/A2xuZhi.tsx

import React, { useCallback, useEffect, useRef } from 'react'
import styles from './index.module.scss'
import { Button, Modal } from 'antd'
import MyPopconfirm from '@/components/MyPopconfirm'
import ZRichTexts from '@/components/ZRichTexts'
import { A2_APIgetConfig, A2_APIsetConfig } from '@/store/action/A2orderSet'
import { MessageFu } from '@/utils/message'
import { A2getConfigType, A2NolistIdType, A2setConfigType } from './type'

type Props = {
  closeFu: () => void
  getSrc: A2getConfigType
  setSrc: A2setConfigType
  sId: A2NolistIdType
}

function A2xuZhi({ closeFu, getSrc, setSrc, sId }: Props) {
  // 富文本的ref
  const ZRichTextRef = useRef<any>(null)

  // 获取设置
  const getEMfu = useCallback(async () => {
    const res = await A2_APIgetConfig(getSrc, sId)
    if (res.code === 0) {
      // 设置富文本
      ZRichTextRef.current?.ritxtShowFu(JSON.parse(res.data.rtf || '{}'))
    }
  }, [getSrc, sId])

  useEffect(() => {
    getEMfu()
  }, [getEMfu])

  // 点击提交
  const btnOk = useCallback(async () => {
    // 富文本校验不通过
    const rtf = ZRichTextRef.current?.fatherBtnOkFu() || { flag: true }

    const res = await A2_APIsetConfig(setSrc, { id: sId, rtf: rtf.val || '' })

    if (res.code === 0) {
      MessageFu.success('设置预约须知成功!')
      closeFu()
    }
  }, [closeFu, sId, setSrc])

  return (
    <Modal
      wrapClassName={styles.A2xuZhi}
      open={true}
      title='预约须知'
      footer={
        [] // 设置footer为空，去掉 取消 确定默认按钮
      }
    >
      <div className='formRow'>
        <ZRichTexts
          check={false}
          dirCode={'A2xuZhiText'}
          isLook={false}
          ref={ZRichTextRef}
          myUrl='cms/book/upload'
          isOne={true}
          upAudioBtnNone={true}
          otherArr={[{ key: 'moduleName', value: 'config' }]}
        />
      </div>

      <div className='A2Xbtn'>
        <MyPopconfirm txtK='取消' onConfirm={closeFu} />
        &emsp;
        <Button type='primary' onClick={btnOk}>
          提交
        </Button>
      </div>
    </Modal>
  )
}

const MemoA2xuZhi = React.memo(A2xuZhi)

export default MemoA2xuZhi