合并

src/pages/activity/helpActivity/helpRecord.jsx

 const { Meta } = Card;
 
 /**
- *
+ * 助力者弹框
+ */
+class InviteTable extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      dataSource: { records: [] },
+      visibleData: { visible: false, customerId: '', realtyConsultant: '' },
+    }
+  }
+
+  // 挂载之后
+  componentDidMount () {
+    const { customerId } = this.state.visibleData
+    this.getList({ helpRecordInitiateId: customerId, pageNumber: 1, pageSize: 5 })
+  }
+
+  componentDidUpdate (preProps, preState) {
+    const { customerId } = this.state.visibleData
+    if (this.props.visibleData.customerId !== preState.visibleData.customerId) {
+      this.getList({ helpRecordInitiateId: customerId, pageNumber: 1, pageSize: 5 })
+      this.setState({ visibleData: this.props.visibleData });
+    }
+  }
+
+  // 弹框确定按钮
+  // eslint-disable-next-line react/sort-comp
+  handleOk () {
+    this.setState({ visibleData: { visible: false, customerId: '', realtyConsultant: '' } })
+  }
+
+  // 弹框取消按钮
+  handleCancel () {
+    this.setState({ visibleData: { visible: false, customerId: '', realtyConsultant: '' } })
+  }
+
+  getList (params) {
+    request({ ...apis.helpActivity.helpPeopleDetails, params: { ...params } }).then(res => {
+      this.setState({ dataSource: res })
+    }).catch(err => {
+      // eslint-disable-next-line no-unused-expressions
+      <Alert
+        style={{
+          marginBottom: 24,
+        }}
+        message={err}
+        type="error"
+        showIcon
+      />
+    })
+  }
+
+  // 分页
+  onChange (pageNum) {
+    this.getList({ pageNumber: pageNum, pageSize: 5 })
+  }
+
+  render () {
+    const columns = [
+      {
+        title: '用户姓名',
+        dataIndex: 'name',
+        key: 'name',
+        align: 'center',
+      },
+      {
+        title: '手机号',
+        dataIndex: 'phone',
+        key: 'phone',
+        align: 'center',
+        render: text => <a>{text}</a>,
+      },
+      {
+        title: '助力时间',
+        dataIndex: 'createDate',
+        key: 'createDate',
+        align: 'center',
+      },
+    ]
+    return (
+      <>
+        <Modal
+          title="助力者"
+          destroyOnClose="true"
+          width={900}
+          footer={null}
+          visible={this.state.visibleData.visible}
+          // onOk={() => this.handleOk()}
+          onCancel={(e) => this.handleCancel(e)}
+        >
+          <Table rowKey="independent" dataSource={this.state.dataSource.records} columns={columns} pagination={{ total: this.state.dataSource.total, onChange: e => this.onChange(e) }} />
+        </Modal>
+      </>
+    );
+  }
+}
+
+
+
+
+
+
+
+/**
+ * 助力者弹框
+ */
+class Verifier extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      helpRecordInitiateId: { id: '' },
+      visibleData: { visible: false, customerId: '', realtyConsultant: '', helpRecordInitiateId: '' },
+    }
+  }
+
+  // 挂载之后
+  componentDidMount () {
+    const { customerId } = this.state.visibleData
+    this.getList({ helpRecordInitiateId: customerId, pageNumber: 1, pageSize: 5 })
+  }
+
+  componentDidUpdate (preProps, preState) {
+    const { customerId } = this.state.visibleData
+    console.log('this.state.visibleData', this.state.visibleData)
+    if (this.props.visibleData.customerId !== preState.visibleData.customerId) {
+      this.getList({ helpRecordInitiateId: customerId, pageNumber: 1, pageSize: 5 })
+      this.setState({ visibleData: this.props.visibleData });
+    }
+  }
+
+  // 弹框确定按钮
+  // eslint-disable-next-line react/sort-comp
+  handleOk () {
+    this.setState({ visibleData: { visible: false, customerId: '', realtyConsultant: '' } })
+  }
+
+  // 弹框取消按钮
+  handleCancel () {
+    this.setState({ visibleData: { visible: false, customerId: '', realtyConsultant: '' } })
+  }
+
+  getList (params) {
+    request({ ...apis.helpActivity.helpPeopleDetails, params: { ...params } }).then(res => {
+      this.setState({ dataSource: res })
+    }).catch(err => {
+      // eslint-disable-next-line no-unused-expressions
+      <Alert
+        style={{
+          marginBottom: 24,
+        }}
+        message={err}
+        type="error"
+        showIcon
+      />
+    })
+  }
+
+  // eslint-disable-next-line class-methods-use-this
+  verify(e) {
+    console.log('111', e.target.value)
+  }
+
+  // eslint-disable-next-line class-methods-use-this
+  verification(e) {
+    console.log('this.state.visibleData', this.state.visibleData)
+      alert(1)
+  }
+
+  render () {
+    return (
+      <>
+        <Modal
+          title="核销"
+          destroyOnClose="true"
+          width={300}
+          footer={null}
+          visible={this.state.visibleData.visible}
+          // onOk={() => this.handleOk()}
+          onCancel={(e) => this.handleCancel(e)}
+        >
+          <div><span>核销码:<input onChange={this.verify.bind(this)}/></span>
+           <Button onClick={(e) => this.verification(e)}>立即核销</Button>
+          </div>
+        </Modal>
+      </>
+    );
+  }
+}
+
+/**
+ *主体列表
  *
  * @param {*} props
  * @returns
  */
 function body(props) {
+  const [gInviteData, setGInviteData] = useState({ visible: false, customerId: '', realtyConsultant: '' })
+
+  const [gVerifierData, setVerifierData] = useState({ visible: false, customerId: '', realtyConsultant: '', helpRecordInitiateId: '' })
+
   const { getFieldDecorator, getFieldsValue } = props.form
 
   // eslint-disable-next-line react-hooks/rules-of-hooks
   // eslint-disable-next-line react-hooks/rules-of-hooks
   // const [columns, setColumns] = useState(privateColumns)
 
-  // 默认私客
+  // 默认成功
   // eslint-disable-next-line react-hooks/rules-of-hooks
   const [customerType, setCustomerType] = useState('helpSucceed')
 
   // 调整归属 ============  start
   // eslint-disable-next-line react-hooks/rules-of-hooks
   const [gVisibleData, setGVisibleData] = useState({ visible: false, customerId: '', realtyConsultant: '' })
-  // 调整归属 ============= end
 
-  // 积分记录 ============  start
-  // eslint-disable-next-line react-hooks/rules-of-hooks
-  const [recordVisibleData, setRecordVisibleData] = useState({ visible: false, customerId: '' })
-  // 积分记录 ============= end
 
-  // 变更状态 ============  start
-  // eslint-disable-next-line react-hooks/rules-of-hooks
-  const [statusVisibleData, setStatusVisibleData] = useState({ visible: false, customerId: '', status: '' })
   // 变更状态 ============= end
 
   // eslint-disable-next-line react-hooks/rules-of-hooks
   }
 
   function displayNone() {
-    setRecordVisibleData({ visible: false, customerId: '' })
     setGVisibleData({ visible: false, customerId: '', realtyConsultant: '' })
-    setStatusVisibleData({ visible: false, customerId: '', status: '' })
   }
 
   // 提交事件
     getList({ pageNumber: pageNum, pageSize: 10, customerType })
   }
 
-  // 私客/公客切换
+  // 助力成功/进行中/助力失败
   function radioButtonHandleSizeChange(e) {
+    setGInviteData({ visible: true, customerId: '', realtyConsultant: '' })
     displayNone()
 
     const { value } = e.target
     getList({ pageNumber: 1, pageSize: 10, customerType })
   }
 
-
-  // 这里有个 Bug， 就是 Modal 弹框，会联动出现， 比如 我点击 调整归属的Model弹框， 那么 积分记录的Model弹框莫名其妙的也显示了
-  // 所有这里临时解决方法是，弹出一个Modal对话框的时候，把其他的对话框给隐藏
-
-  function showGM(record) {
-    setGVisibleData({ visible: true, customerId: record.customerId, realtyConsultant: record.realtyConsultant })
-    setRecordVisibleData({ visible: false, customerId: '' })
-    setStatusVisibleData({ visible: false, customerId: '' })
-  }
-
-  function showRecord(record) {
-    setRecordVisibleData({ visible: true, customerId: record.customerId })
-    setGVisibleData({ visible: false, customerId: '', realtyConsultant: '' })
-    setStatusVisibleData({ visible: false, customerId: '' })
-  }
-
-  function showStatus(record) {
-    setRecordVisibleData({ visible: false, customerId: '' })
-    setGVisibleData({ visible: false, customerId: '', realtyConsultant: '' })
-    setStatusVisibleData({ visible: true, customerId: record.customerId, status: record.status })
-  }
   function toCustomerDateil(record) {
     router.push({
       pathname: '/customer/customerlist/customerDetail',
     link.click()
   }
 
+// 助力记录弹框
+function helpRecord(row) {
+// 关闭核销
+// eslint-disable-next-line max-len
+setVerifierData({ visible: false, customerId: row.helpRecordInitiateId, realtyConsultant: row.realtyConsultant })
+  // eslint-disable-next-line max-len
+  setGInviteData({ visible: true, customerId: row.helpRecordInitiateId, realtyConsultant: row.realtyConsultant })
+}
+ // 核销
+ function helpInitiateRecordVerify(row) {
+// 关闭助力记录弹框
+// eslint-disable-next-line max-len
+  setVerifierData({ visible: true, customerId: row.helpRecordInitiateId, realtyConsultant: row.realtyConsultant })
+  // eslint-disable-next-line max-len
+  setGInviteData({ visible: false, customerId: row.helpRecordInitiateId, realtyConsultant: row.realtyConsultant })
+ }
+
   const publicColumns = [
     {
       title: '发起者',
       key: 'helpCount',
       align: 'center',
       width: '15%',
-      render: (text, record) => <a style={ { color: '#66B3FF' } } >{record.helpCount}/{record.persionNumCount}</a>,
+      render: (text, record) => <a style={ { color: '#66B3FF' } } onClick={() => helpRecord(record)}>{record.helpCount}/{record.persionNumCount}</a>,
     },
   ]
 
       key: 'helpCount',
       align: 'center',
       width: '15%',
-      render: (text, record) => <a style={ { color: '#66B3FF' } } >{record.helpCount}人</a>,
+      render: (text, record) => <a style={ { color: '#66B3FF' } } onClick={() => helpRecord(record)}>{record.helpCount}人</a>,
     },
     {
       title: '核销状态',
         <>
           {row.verificationStatus === 0 &&
           <AuthButton name="admin.SignList.get" noRight={null}>
-           <span style={{ color: '#1990FF', cursor: 'pointer' }}>核销</span>
+           <span style={{ color: '#1990FF', cursor: 'pointer' }} onClick={() => helpInitiateRecordVerify(row)}>核销</span>
           </AuthButton>
         }
         </>
           <Radio.Group value={customerType} onChange={radioButtonHandleSizeChange} buttonStyle="solid">
             <Radio.Button value="helpSucceed">助力成功</Radio.Button>
             <Radio.Button value="helpUnderway">进行中</Radio.Button>
-            <Radio.Button value="helpUnfinished ">助力失败</Radio.Button>
+            <Radio.Button value="helpUnfinished">助力失败</Radio.Button>
           </Radio.Group>
         </AuthButton>
       </div>
         <Table dataSource={dataSource.list} columns={privateColumns} pagination={{ total: dataSource.total, onChange }} rowKey="customerList" /> :
         <Table dataSource={dataSource.list} columns={publicColumns} pagination={{ total: dataSource.total, onChange }} rowKey="customerList" /> 
       }
+       <InviteTable visibleData={gInviteData} />
+       <Verifier visibleData={gVerifierData} />
     </>
   );
 }

src/services/apis.js

     method: 'get',
     action: 'admin.taRole.get',
   },
+  helpPeopleDetails: {
+    url: `${prefix}/taHelpRecord/details`,
+    method: 'get',
+    action: 'admin.taRole.get',
+  },
  },
  third: {
   thirdPartyMiniapp: {