forked from gzzfw/frontEnd/gzDyh

dminyi
2024-09-03 173b3d0069802ded2d61f2d0154874585176f096
gz-customerSystem/src/views/register/handleFeedback/component/CaseResult.jsx
@@ -2,16 +2,17 @@
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-02 14:49:13
 * @LastEditors: dminyi 1301963064@qq.com
 * @LastEditTime: 2024-09-02 19:44:37
 * @LastEditTime: 2024-09-02 20:52:05
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\handleFeedback\component\CaseResult.jsx
 * @Description: 结案申请
 */
import React, { useState } from 'react';
import { Modal, Form, Select, Upload, Input } from '@arco-design/web-react';
import { Col, Space, Button } from 'antd';
import { Col, Space, Button, Tooltip, Radio } from 'antd';
import DocumentScanner from './FileUpLoad'
import { scan } from '@/assets/images/icon'
import { tip } from '@/assets/images'
import { tip, question1 } from '@/assets/images'
import { NoHandleReason } from '../../visit/component/levelDetail'
const FormItem = Form.Item;
@@ -25,6 +26,8 @@
  const [selectedTab1, setSelectedTab1] = useState('1'); // 默认选中第一个 tab
  const [fileTip, setFileTip] = useState('0');
  const [value, setValue] = useState(1)
  const [noHandleReason, setNoHandleReason] = useState(false);
  const [radioValue, setRadioValue] = useState(1)
  const tabs = [
@@ -61,6 +64,11 @@
    setScanFile(false);
  };
  const onChange = (e) => {
    console.log('radio checked', e.target.value);
    setRadioValue(e.target.value);
  };
  return (
    <>
@@ -83,6 +91,7 @@
            </div>
          ))}
        </div>
        {selectedTab === '1' &&
        <Form
          layout='vertical'
          scrollToFirstError={true}
@@ -188,7 +197,7 @@
                  label={
                    <>
                      <div style={{ display: 'flex' }}>
                        协议附件
                          协议文书
                        <div className="must" style={{ marginLeft: '4px' }}>必填</div>
                      </div>
                      <div className='caseResult-tips'>
@@ -303,12 +312,124 @@
            <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>保存</Button>
          </Space>
        </Form>
        }
        {selectedTab === '2' &&
          <Form
            layout='vertical'
            requiredSymbol={false}
            scrollToFirstError={true}
            initialValues={{
              caseLevel: 3,
            }}//默认值
          >
            <Col span={24}>
              <FormItem
                label={<div style={{ display: 'flex' }}>
                  无法化解理由
                  <Tooltip onClick={() => setNoHandleReason(true)}>
                    <img src={question1} alt="" style={{ width: '13px', height: '13px', margin: '4px 4px 0px 4px' }} />
                  </Tooltip>
                  <div className="must" style={{ marginLeft: '4px' }}>必填</div>
                </div>
                }
                field='caseDes'
                rules={[{ message: '请填写事项概况', required: true }]}
              >
                <table border="1" align="center" cellpadding="8" className="table">
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">调解过程中提供的解决方案</th>
                    <td>
                      <Input.TextArea
                        showWordLimit
                        rows={3}
                        placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过'
                        wrapperStyle={{ width: '100%' }}
                      />
                    </td>
                  </tr>
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title">调解过程中的主要分歧点</th>
                    <td>
                      <Input.TextArea
                        showWordLimit
                        rows={3}
                        placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过'
                        wrapperStyle={{ width: '100%' }}
                      />
                    </td>
                  </tr>
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title">最终难以调和的原因</th>
                    <td>
                      <Input.TextArea
                        showWordLimit
                        rows={3}
                        placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过'
                        wrapperStyle={{ width: '100%' }}
                      />
                    </td>
                  </tr>
                </table>
              </FormItem>
            </Col>
            <Col span={24}>
              <FormItem
                label={
                  <>
                    <div style={{ display: 'flex' }}>
                      结案意见
                      <div className="must" style={{ marginLeft: '4px' }}>必填</div>
                    </div>
                  </>
                }
                field='caseDes'
                rules={[{ message: '请填写事项概况', required: true }]}
              >
                <div className='caseResult-textarea'>公共模板1:化解不成功结案意见范本</div>
                <Input.TextArea
                  rows={5}
                  wrapperStyle={{ width: '100%' }}
                  value='鉴于以上协议内容已经双方确认,并认为该协议内容公平合理,能够妥善解决双方的纠纷。建议双方当事人按照协议内容执行,以实现纠纷的最终解决。'
                />
              </FormItem>
            </Col>
            <Col span={24}>
              <FormItem
                label='是否转诉讼案件'
                field='caseDes'
              >
                <Radio.Group onChange={onChange} value={radioValue}>
                  <Space direction="vertical">
                    <Radio value={1}>否</Radio>
                    <Radio value={2}>是</Radio>
                  </Space>
                </Radio.Group>
              </FormItem>
            </Col>
            <Col span={24}>
              <FormItem
                label='是否转诉诉讼案号讼案件'
                field='caseDes'
              >
                <Input style={{ width: 350 }} placeholder='请输入法院立案号' />
              </FormItem>
            </Col>
            <Space style={{ marginBottom: '16px' }}>
              <Button type='primary'>提交</Button>
              <Button type='outline' style={{ color: '#1A6FB8', border: '1px solid #1A6FB8' }}>保存</Button>
            </Space>
          </Form>
        }
      </Modal>
      <DocumentScanner
        visible={scanFile}
        onConfirm={handleConfirm}
        onCancel={handleCancel}
      />
      <NoHandleReason
        visible={noHandleReason}
        onClose={() => setNoHandleReason(false)}
      />
    </>
  )
}