广州市综治平台前端
xusd
7 days ago 544148eddae96db824423cd059ebecb9d13c392e
src/views/register/index.jsx
@@ -10,6 +10,7 @@
import { useNavigate } from 'react-router-dom';
import { tab0, tab1, tab2, tab3, tab4, tab5, tab6, allSign, tab1bg } from '@/assets/images';
import TableView from '../../components/TableView';
import NewPage from '../../components/NewPage';
import TableDraftSearch from '../../components/TableDraftSearch';
import TableSearch from '../../components/TableSearch';
import MyTabsNew from '../../components/MyTabsNew';
@@ -499,7 +500,12 @@
         title: '事项来源',
         dataIndex: 'caseSource',
         key: 'caseSource',
         width: 120,
         width: 150,
         render: (text, record) => {
            return record.caseSecondSource && record.caseSecondSource !== null
               ? `${text}/${record.caseSecondSource}`
               : text;
         },
      },
      {
         title: '问题属地',
@@ -2863,7 +2869,7 @@
            sortColmn: 2,
            status: '1',
         });
      }else {
      } else {
         setSearchData({
            sortType: 2,
            sortColmn: 1,
@@ -3570,603 +3576,619 @@
   console.log('tableTab', tableTab, tabActivekey, tableData);
   return (
      <div className="VisitWorkBench">
         <div className="VisitWorkBench-top">
            <span style={{ fontWeight: 600 }}>工作总览</span>
            <div className="VisitWorkBench-top-list">
               {Object.keys(tabsMap).map((key) => (
                  <div
                     key={key}
                     className="VisitWorkBench-top-list-tabsItem"
                     style={{
                        ...(tabActivekey !== key ? { backgroundColor: tabsMap[key].workTotal.bgColor } : {}),
                        ...(tabActivekey === key
                           ? {
                                 backgroundImage: `url(${require(`../../assets/images/${tabsMap[key].workTotal.bgImage}`)})`,
                                 border: `1px solid ${tabsMap[key].workTotal.borderColor}`,
                                 backgroundRepeat: 'no-repeat',
                                 backgroundSize: 'cover',
                                 maxWidth: '100%',
                                 height: 'auto',
                             }
                           : {}),
                     }}
                     onClick={() => tabActive(key, tabsMap[key])}
                  >
                     <div>
                        <div>{tabsMap[key].workTotal.label}</div>
                        <span className="VisitWorkBench-top-list-tabsItem-title">{countData[tabsMap[key].workTotal.value] || 0}</span>件
                     </div>
                     <div>
                        <img src={tabsMap[key].workTotal.img} alt="" className="VisitWorkBench-top-list-tabsItem-imgView" />
                     </div>
                  </div>
               ))}
            </div>
         </div>
         <div
            className="VisitWorkBench-middle"
            onKeyUp={(e) => {
               if (e.key === 'Enter') {
                  handleSubmit();
               }
            }}
         >
            <Tabs activeTab={searchData.status} onChange={handleColumnType} destroyOnHide>
               {tableTab?.map((item) => {
                  return (
                     <TabPane
                        key={item.value}
                        title={
                           <span style={{ fontSize: '15px' }}>
                              {item.label}
                              {item.numberKey ? `(${countData[item.numberKey] || 0})` : ''}
                           </span>
                        }
                     >
                        <Typography.Paragraph key={tabActivekey + item.value}>
                           {tabActivekey == '5' && searchData.status != '2' && (
                              <Radio.Group
                                 type="button"
                                 value={searchData.type}
                                 onChange={(value) => {
                                    setSearchData({
                                       ...searchData,
                                       type: value,
                                    });
                                 }}
                                 style={{ marginBottom: 16 }}
                                 options={[
                                    {
                                       label: `回退审核${searchData.status === '0' ? `(${countData.returnReview || 0})` : ''}`,
                                       value: 1,
                                    },
                                    {
                                       label: `上报审核${searchData.status === '0' ? `(${countData.appearReview || 0})` : ''}`,
                                       value: 2,
                                    },
                                    {
                                       label: `结案申请审核${searchData.status === '0' ? `(${countData.windupReview || 0})` : ''}`,
                                       value: 3,
                                    },
                                    {
                                       label: `联合处置审核${searchData.status === '0' ? `(${countData.assistReview || 0})` : ''}`,
                                       value: 4,
                                    },
                                 ]}
                              />
                           )}
                           {tabActivekey == '4' && (
                              <Radio.Group
                                 type="button"
                                 value={searchData.caseTaskType}
                                 onChange={(value) => {
                                    setSearchData({
                                       ...searchData,
                                       caseTaskType: value,
                                    });
                                 }}
                                 style={{ marginBottom: 16 }}
                                 options={[
                                    {
                                       label: '我承办的',
                                       value: 1,
                                    },
                                    {
                                       label: '我配合的',
                                       value: 2,
                                    },
                                 ]}
                              />
                           )}
                           <TableView
                              rowSelection={tabActivekey == '2' && item.value === '1' ? rowSelection : null}
                              columns={item.columnsMap ? item.columnsMap[tabActivekey == '4' ? searchData.caseTaskType : searchData.type] : item.columns}
                              dataSource={tableData}
                              // tableHeight={'100%'}
                              size="small"
                              rowKey="ownerId"
                              bordered={true}
                              isScroll={true} //兼容以前的,当需要表格竖向滚动,请设置这个
                              scroll={{
                                 x: 1300,
                              }}
                              offsetHeight={165}
                              loading={loading}
                              pagination={{
                                 current: pageData.page,
                                 pageSize: pageData.size,
                                 total: total,
                                 onChange: (page, pageSize) => {
                                    setPageData({
                                       ...pageData,
                                       page,
                                       size: pageSize,
                                    });
                                 },
                              }}
                              onChange={(pagination, filters, sorter) => {
                                 handleSort(sorter);
                              }}
                           />
                        </Typography.Paragraph>
                        {tabActivekey == '2' && item.value === '1' && selectedRowKeys.length != 0 && (
                           <div className="VisitWorkBench-middle-select">
                              <span>已选{selectedRowKeys.length}项</span>
                              <span
                                 className="linkBtnColor"
                                 onClick={() => {
                                    setSelectedRowKeys([]);
                                    setSelectedRows([]);
                                 }}
                              >
                                 取消
                              </span>
                              <span className="linkBtnColor" onClick={handleBatchQs}>
                                 批量签收
                              </span>
                           </div>
                        )}
                     </TabPane>
                  );
               })}
            </Tabs>
            <div className="VisitWorkBench-middle-search">
               <Form ref={formRef} layout="vertical">
                  <div style={{ display: 'flex' }}>
                     {tabActivekey == '2' && searchData.status === '1' && selectedRowKeys.length != 0 && (
                        <div
                           onClick={handleAllSign}
                           style={{ color: '#1a6fb8', cursor: 'pointer', marginRight: '16px', width: '85px', textAlign: 'center', paddingTop: '3px' }}
                        >
                           <img src={allSign} alt="" className="title-file" />
                           全部签收
                        </div>
                     )}
                     {tabActivekey == '0' && (
                        <FormItem label=" " field="caseStatus" style={{ width: '160px' }}>
                           <Select allowClear placeholder="请选择">
                              {[
                                 { value: '1', label: '未办结' },
                                 { value: '2', label: '已办结' },
                                 { value: '3', label: '不予受理' },
                              ]?.map((y) => (
                                 <Option value={y.value}>事项状态:{y.label}</Option>
                              ))}
                           </Select>
                        </FormItem>
                     )}
                     <FormItem label=" " field="time" style={{ width: '300px' }}>
                        <RangePicker
                           style={{ width: '100%' }}
                           shortcutsPlacementLeft={true}
                           shortcuts={$$.shortcutsList()}
                           format="YYYY-MM-DD HH:mm"
                           showTime={true}
                           placeholder={getPlaceholder()}
                        />
                     </FormItem>
                     <FormItem label=" " field="partyName" style={{ width: '250px' }}>
                        <Input allowClear placeholder="查询申请方/被申请方关键词" />
                     </FormItem>
                     <Button type="primary" className="dialogPrimary" onClick={handleSubmit}>
                        查询
                     </Button>
                  </div>
               </Form>
            </div>
         </div>
         <div className="VisitWorkBench-bottom">
            <div className="VisitWorkBench-bottom-list">
               <div style={{ backgroundColor: '#fff', padding: '12px 16px 16px 16px', flex: '1' }}>
                  <div className="VisitWorkBench-bottom-head">
                     <span>事项登记</span>
                     <span
                        onClick={() => modalClick('his')}
                        style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', gap: '4px' }}
                        className="public-color"
                     >
                        <img style={{ width: '18px' }} src={workDash_15} alt="" srcset="" /> 登记历史
                     </span>
                  </div>
                  <div className="VisitWorkBench-bottom-list-l">
      <NewPage>
         <div className="VisitWorkBench">
            <div className="VisitWorkBench-top">
               <span style={{ fontWeight: 600 }}>工作总览</span>
               <div className="VisitWorkBench-top-list">
                  {Object.keys(tabsMap).map((key) => (
                     <div
                        className="bottomTab3"
                        onClick={() => {
                           navigate(`/mediate/visit`);
                           // let userInfo = $$.getSessionStorage('customerSystemUser');
                           // if (userInfo?.unit.endsWith('综治中心')) {
                           //    navigate(`/mediate/visit`);
                           // } else {
                           //    // 提示您所在的机构无法使用大厅来访
                           //    $$.info({ type: 'error', content: '您所在的机构无法使用大厅来访' });
                           // }
                        key={key}
                        className="VisitWorkBench-top-list-tabsItem"
                        style={{
                           ...(tabActivekey !== key ? { backgroundColor: tabsMap[key].workTotal.bgColor } : {}),
                           ...(tabActivekey === key
                              ? {
                                    backgroundImage: `url(${require(`../../assets/images/${tabsMap[key].workTotal.bgImage}`)})`,
                                    border: `1px solid ${tabsMap[key].workTotal.borderColor}`,
                                    backgroundRepeat: 'no-repeat',
                                    backgroundSize: 'cover',
                                    maxWidth: '100%',
                                    height: 'auto',
                                }
                              : {}),
                        }}
                        onClick={() => tabActive(key, tabsMap[key])}
                     >
                        <div className="VisitWorkBench-bottom-title" style={{ color: '#206BCD' }}>
                           大厅来访
                        </div>
                        {/* <img src={visitInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                     </div>
                     <div
                        className="bottomTab4"
                        onClick={() => {
                           setInspectionVisible(true);
                        }}
                     >
                        <div className="VisitWorkBench-bottom-title" style={{ color: '#D46B08' }}>
                           自行排查
                        </div>
                        {/* <img src={checkInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                     </div>
                  </div>
               </div>
               <div className="VisitWorkBench-bottom-list-r">
                  <div className="VisitWorkBench-bottom-list-r-item">
                     <div className="VisitWorkBench-bottom-head">已办事项</div>
                     <div onClick={() => modalClick('done')} className="VisitWorkBench-bottom-list-r-item-content">
                        <img src={visitWorkBench_1} alt="" srcset="" />
                        <div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-title">全部已办</div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-num">
                              {countData.alreadyDone || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                           </div>
                           <div>{tabsMap[key].workTotal.label}</div>
                           <span className="VisitWorkBench-top-list-tabsItem-title">{countData[tabsMap[key].workTotal.value] || 0}</span>件
                        </div>
                     </div>
                  </div>
                  <div className="VisitWorkBench-bottom-list-r-item">
                     <div className="VisitWorkBench-bottom-head">效能分析</div>
                     <div
                        onClick={() => {
                           navigate(`/mediate/workEfficiency`);
                        }}
                        className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-red"
                     >
                        <img src={efficiency} alt="" srcset="" />
                        <div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-title">超时任务</div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-num">
                              {countData.timeOut || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                           </div>
                           <img src={tabsMap[key].workTotal.img} alt="" className="VisitWorkBench-top-list-tabsItem-imgView" />
                        </div>
                     </div>
                  </div>
                  <div className="VisitWorkBench-bottom-list-r-item">
                     <div className="VisitWorkBench-bottom-head">草稿箱</div>
                     <div
                        onClick={() => modalClick('draft')}
                        className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-orange"
                     >
                        <img src={visitWorkBench_2} alt="" srcset="" />
                        <div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-title">事项草稿</div>
                           <div className="VisitWorkBench-bottom-list-r-item-content-num">
                              {countData.caseDraft || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                           </div>
                        </div>
                     </div>
                  </div>
                  ))}
               </div>
            </div>
         </div>
         <Modal
            title={<div style={{ textAlign: 'left' }}>{modalData.title}</div>}
            style={{ width: '80%' }}
            onCancel={() => {
               setModalData({ ...modalData, visible: false, list: [], title: '', type: '' });
            }}
            closable={true}
            visible={modalData.visible}
            footer={null}
         >
            {modalData.type === 'draft' && (
               <div>
                  <TableDraftSearch
                     labelLength={4}
                     exportButtonShow={false}
                     handleText={'重置'}
                     form={form}
                     itemData={[
                        { type: 'RangePicker', name: 'updateTime', label: '保存时间', shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 6 },
                        { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                        { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                     ]}
                     handleReset={() => handleSearch('draft', 'reset')}
                     handleSearch={() => handleSearch('draft', 'search')}
                  />
                  <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', marginBottom: '12px' }}></div>
                  <div style={{ marginTop: '0px' }}>
                     <TableView
                        showHeader
                        title="查询结果"
                        columns={columns()}
                        dataSource={data.tableData}
                        onChange={(pagination, filters, sorter) => {
                           handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                           // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                        }}
                        pagination={{
                           current: search.page,
                           pageSize: search.size,
                           total: data.total,
                           // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                        }}
                     />
                  </div>
               </div>
            )}
            {modalData.type === 'his' && (
               <div>
                  <TableSearch
                     labelLength={4}
                     exportButtonShow={false}
                     displayShow={false}
                     textAlign={{ textAlign: 'left' }}
                     form={form}
                     itemData={[
                        { type: 'RangePicker', name: 'createTime', label: '登记时间', shortcutsPlacementLeft: true, shortcuts: $$.shortcutsList(), span: 6 },
                        { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                        { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                        {
                           type: 'Select',
                           name: 'status',
                           label: '事项状态',
                           placeholder: '请选择',
                           span: 8,
                           selectdata: $$.options.caseStatus,
                        },
                        {
                           type: 'Cascader',
                           name: 'caseType',
                           label: '纠纷类型',
                           placeholder: '请选择',
                           span: 8,
                           treedata: $$.caseTypeSelect.caseTypeSelect,
                        },
                        {
                           type: 'Select',
                           name: 'canal',
                           label: '事项来源',
                           placeholder: '请选择',
                           span: 8,
                           selectdata: $$.options.caseCanal,
                        },
                        {
                           type: 'Select',
                           name: 'caseLevel',
                           label: '事项等级',
                           placeholder: '请选择',
                           span: 8,
                           selectdata: $$.options.caseLevelList,
                        },
                        {
                           type: 'Select',
                           name: 'mediResult',
                           label: '化解结果',
                           placeholder: '请选择',
                           span: 8,
                           selectdata: $$.options.mediResult,
                        },
                     ]}
                     handleReset={() => handleSearch('his', 'reset')}
                     handleSearch={() => handleSearch('his', 'search')}
                  />
                  <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                  <div style={{ marginTop: '0px' }}>
                     <TableView
                        showHeader
                        title="查询结果"
                        columns={columnsHis()}
                        dataSource={data.tableData}
                        onChange={(pagination, filters, sorter) => {
                           handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                           // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                        }}
                        pagination={{
                           current: search.page,
                           pageSize: search.size,
                           total: data.total,
                           // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                        }}
                     />
                  </div>
               </div>
            )}
            {modalData.type === 'done' && (
               <div>
                  <TableSearch
                     labelLength={4}
                     exportButtonShow={false}
                     displayShow={false}
                     textAlign={{ textAlign: 'left' }}
                     form={form}
                     itemData={[
                        {
                           type: 'RangePicker',
                           name: 'handleTime',
                           label: '统计时间',
                           allowClear: false,
                           shortcutsPlacementLeft: true,
                           shortcuts: $$.shortcutsList(),
                           span: 6,
                        },
                        {
                           type: 'Cascader',
                           name: 'caseType',
                           label: '纠纷类型',
                           placeholder: '请选择',
                           span: 8,
                           changeSelect: true,
                           allowClear: false,
                           treedata: $$.caseTypeSelect.caseTypeSelect,
                        },
                        { type: 'Select', name: 'caseLevel', label: '事项等级', placeholder: '请选择', span: 8, selectdata: $$.options.caseLevelList },
                        { type: 'Select', name: 'canal', label: '事项来源', placeholder: '请选择', span: 8, selectdata: $$.options.caseCanal },
                        { type: 'Select', name: 'mediResult', label: '化解结果', placeholder: '请选择', span: 8, selectdata: $$.options.mediResult },
                        { type: 'Select', name: 'status', label: '事项状态', placeholder: '请选择', span: 8, selectdata: $$.options.caseStatus },
                     ]}
                     handleReset={() => handleSearch('done', 'reset')}
                     handleSearch={() => handleSearch('done', 'search')}
                  />
                  <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                  <div style={{ marginTop: '0px' }}>
                     <div style={{ fontSize: '16px' }}>查询结果</div>
                     <div style={{ width: '100%', position: 'relative' }}>
                        <MyTabsNew
                           // 1-已受理,2-已交办,3-已上报,4已回退
                           tabs={[
                              { label: <div style={{ height: '24px' }}>全部({data?.totalData?.totalNum || 0})</div>, key: '' },
                              { label: <div style={{ height: '24px' }}>已受理({data?.totalData?.acceptNum || 0})</div>, key: '1' },
                              { label: <div style={{ height: '24px' }}>已交办({data?.totalData?.assignedNum || 0})</div>, key: '2' },
                              { label: <div style={{ height: '24px' }}>已上报({data?.totalData?.reportNUm || 0})</div>, key: '3' },
                              { label: <div style={{ height: '24px' }}>已回退({data?.totalData?.backNUm || 0})</div>, key: '4' },
                           ]}
                           activeKey={tabKey}
                           onChange={(activeKey) => tabsOnchange(activeKey)}
                        />
                        <div style={{ borderBottom: '1px solid #E5E6EB', position: 'absolute', width: '100%' }}></div>
                     </div>
                     <div style={{ margin: '12px 0' }}>
                        <Alert
                           type="success"
                           content={
                              <span>
                                 已为您生成
                                 {tabKey !== '' && (
                                    <span>
                                       <span className="public-color">
                                          {tabKey === '1'
                                             ? '受理时间'
                                             : tabKey === '2'
                                             ? '交办时间'
                                             : tabKey === '3'
                                             ? '上报时间'
                                             : tabKey === '4'
                                             ? '回退时间'
                                             : ''}
                                       </span>
                                       在
                                    </span>
                                 )}
                                 {search.handleTimeStart && (
                                    <span className="public-color">
                                       {$$.myTimeFormat(search.handleTimeStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.handleTimeEnd, 'YYYY.M.D')}
                                    </span>
                                 )}
                                 {/*{search.closeStart && <span className='public-color'>{search.createStart && '、'}办结时间({$$.myTimeFormat(search.createStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.createEnd, 'YYYY.M.D')})</span>}
                    {search.caseType && <span className='public-color'>{(search.createStart || search.closeStart) && '、'}纠纷类型({caseTypeNames.join('/')})</span>} */}
                                 内的已办矛盾纠纷
            <div
               className="VisitWorkBench-middle"
               onKeyUp={(e) => {
                  if (e.key === 'Enter') {
                     handleSubmit();
                  }
               }}
            >
               <Tabs activeTab={searchData.status} onChange={handleColumnType} destroyOnHide>
                  {tableTab?.map((item) => {
                     return (
                        <TabPane
                           key={item.value}
                           title={
                              <span style={{ fontSize: '15px' }}>
                                 {item.label}
                                 {item.numberKey ? `(${countData[item.numberKey] || 0})` : ''}
                              </span>
                           }
                        >
                           <Typography.Paragraph key={tabActivekey + item.value}>
                              {tabActivekey == '5' && searchData.status != '2' && (
                                 <Radio.Group
                                    type="button"
                                    value={searchData.type}
                                    onChange={(value) => {
                                       setSearchData({
                                          ...searchData,
                                          type: value,
                                       });
                                    }}
                                    style={{ marginBottom: 16 }}
                                    options={[
                                       {
                                          label: `回退审核${searchData.status === '0' ? `(${countData.returnReview || 0})` : ''}`,
                                          value: 1,
                                       },
                                       {
                                          label: `上报审核${searchData.status === '0' ? `(${countData.appearReview || 0})` : ''}`,
                                          value: 2,
                                       },
                                       {
                                          label: `结案申请审核${searchData.status === '0' ? `(${countData.windupReview || 0})` : ''}`,
                                          value: 3,
                                       },
                                       {
                                          label: `联合处置审核${searchData.status === '0' ? `(${countData.assistReview || 0})` : ''}`,
                                          value: 4,
                                       },
                                    ]}
                                 />
                              )}
                              {tabActivekey == '4' && (
                                 <Radio.Group
                                    type="button"
                                    value={searchData.caseTaskType}
                                    onChange={(value) => {
                                       setSearchData({
                                          ...searchData,
                                          caseTaskType: value,
                                       });
                                    }}
                                    style={{ marginBottom: 16 }}
                                    options={[
                                       {
                                          label: '我承办的',
                                          value: 1,
                                       },
                                       {
                                          label: '我配合的',
                                          value: 2,
                                       },
                                    ]}
                                 />
                              )}
                              <TableView
                                 rowSelection={tabActivekey == '2' && item.value === '1' ? rowSelection : null}
                                 columns={item.columnsMap ? item.columnsMap[tabActivekey == '4' ? searchData.caseTaskType : searchData.type] : item.columns}
                                 dataSource={tableData}
                                 // tableHeight={'100%'}
                                 size="small"
                                 rowKey="ownerId"
                                 bordered={true}
                                 isScroll={true} //兼容以前的,当需要表格竖向滚动,请设置这个
                                 scroll={{
                                    x: 1300,
                                 }}
                                 offsetHeight={165}
                                 loading={loading}
                                 pagination={{
                                    current: pageData.page,
                                    pageSize: pageData.size,
                                    total: total,
                                    onChange: (page, pageSize) => {
                                       setPageData({
                                          ...pageData,
                                          page,
                                          size: pageSize,
                                       });
                                    },
                                 }}
                                 onChange={(pagination, filters, sorter) => {
                                    handleSort(sorter);
                                 }}
                              />
                           </Typography.Paragraph>
                           {tabActivekey == '2' && item.value === '1' && selectedRowKeys.length != 0 && (
                              <div className="VisitWorkBench-middle-select">
                                 <span>已选{selectedRowKeys.length}项</span>
                                 <span
                                    className="linkBtnColor"
                                    onClick={() => {
                                       setSelectedRowKeys([]);
                                       setSelectedRows([]);
                                    }}
                                 >
                                    取消
                                 </span>
                                 <span className="linkBtnColor" onClick={handleBatchQs}>
                                    批量签收
                                 </span>
                              </div>
                           )}
                        </TabPane>
                     );
                  })}
               </Tabs>
               <div className="VisitWorkBench-middle-search">
                  <Form ref={formRef} layout="vertical">
                     <div style={{ display: 'flex' }}>
                        {tabActivekey == '2' && searchData.status === '1' && selectedRowKeys.length != 0 && (
                           <div
                              onClick={handleAllSign}
                              style={{ color: '#1a6fb8', cursor: 'pointer', marginRight: '16px', width: '85px', textAlign: 'center', paddingTop: '3px' }}
                           >
                              <img src={allSign} alt="" className="title-file" />
                              全部签收
                           </div>
                        )}
                        {tabActivekey == '0' && (
                           <FormItem label=" " field="caseStatus" style={{ width: '160px' }}>
                              <Select allowClear placeholder="请选择">
                                 {[
                                    { value: '1', label: '未办结' },
                                    { value: '2', label: '已办结' },
                                    { value: '3', label: '不予受理' },
                                 ]?.map((y) => (
                                    <Option value={y.value}>事项状态:{y.label}</Option>
                                 ))}
                              </Select>
                           </FormItem>
                        )}
                        <FormItem label=" " field="time" style={{ width: '300px' }}>
                           <RangePicker
                              style={{ width: '100%' }}
                              shortcutsPlacementLeft={true}
                              shortcuts={$$.shortcutsList()}
                              format="YYYY-MM-DD HH:mm"
                              showTime={true}
                              placeholder={getPlaceholder()}
                           />
                        </FormItem>
                        <FormItem label=" " field="partyName" style={{ width: '250px' }}>
                           <Input allowClear placeholder="查询申请方/被申请方关键词" />
                        </FormItem>
                        <Button type="primary" className="dialogPrimary" onClick={handleSubmit}>
                           查询
                        </Button>
                     </div>
                  </Form>
               </div>
            </div>
            <div className="VisitWorkBench-bottom">
               <div className="VisitWorkBench-bottom-list">
                  <div style={{ backgroundColor: '#fff', padding: '12px 16px 16px 16px', flex: '1' }}>
                     <div className="VisitWorkBench-bottom-head">
                        <span>事项登记</span>
                        <span
                           onClick={() => modalClick('his')}
                           style={{ cursor: 'pointer', display: 'flex', alignItems: 'center', gap: '4px' }}
                           className="public-color"
                        >
                           <img style={{ width: '18px' }} src={workDash_15} alt="" srcset="" /> 登记历史
                        </span>
                     </div>
                     <div className="VisitWorkBench-bottom-list-l">
                        <div
                           className="bottomTab3"
                           onClick={() => {
                              navigate(`/mediate/visit`);
                              // let userInfo = $$.getSessionStorage('customerSystemUser');
                              // if (userInfo?.unit.endsWith('综治中心')) {
                              //    navigate(`/mediate/visit`);
                              // } else {
                              //    // 提示您所在的机构无法使用大厅来访
                              //    $$.info({ type: 'error', content: '您所在的机构无法使用大厅来访' });
                              // }
                           }}
                        >
                           <div className="VisitWorkBench-bottom-title" style={{ color: '#206BCD' }}>
                              大厅来访
                           </div>
                           {/* <img src={visitInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                        </div>
                        <div
                           className="bottomTab4"
                           onClick={() => {
                              setInspectionVisible(true);
                           }}
                        >
                           <div className="VisitWorkBench-bottom-title" style={{ color: '#D46B08' }}>
                              自行排查
                           </div>
                           {/* <img src={checkInto} alt='' className='VisitWorkBench-bottom-img' /> */}
                        </div>
                     </div>
                  </div>
                  <div className="VisitWorkBench-bottom-list-r">
                     <div className="VisitWorkBench-bottom-list-r-item">
                        <div className="VisitWorkBench-bottom-head">已办事项</div>
                        <div onClick={() => modalClick('done')} className="VisitWorkBench-bottom-list-r-item-content">
                           <img src={visitWorkBench_1} alt="" srcset="" />
                           <div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-title">全部已办</div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                 {countData.alreadyDone || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div className="VisitWorkBench-bottom-list-r-item">
                        <div className="VisitWorkBench-bottom-head">效能分析</div>
                        <div
                           onClick={() => {
                              navigate(`/mediate/workEfficiency`);
                           }}
                           className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-red"
                        >
                           <img src={efficiency} alt="" srcset="" />
                           <div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-title">超时任务</div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                 {countData.timeOut || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                              </div>
                           </div>
                        </div>
                     </div>
                     <div className="VisitWorkBench-bottom-list-r-item">
                        <div className="VisitWorkBench-bottom-head">草稿箱</div>
                        <div
                           onClick={() => modalClick('draft')}
                           className="VisitWorkBench-bottom-list-r-item-content VisitWorkBench-bottom-list-r-item-content-orange"
                        >
                           <img src={visitWorkBench_2} alt="" srcset="" />
                           <div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-title">事项草稿</div>
                              <div className="VisitWorkBench-bottom-list-r-item-content-num">
                                 {countData.caseDraft || 0}&nbsp;<span className="VisitWorkBench-bottom-list-r-item-content-unit">件</span>
                              </div>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
            <Modal
               title={<div style={{ textAlign: 'left' }}>{modalData.title}</div>}
               style={{ width: '80%' }}
               onCancel={() => {
                  setModalData({ ...modalData, visible: false, list: [], title: '', type: '' });
               }}
               closable={true}
               visible={modalData.visible}
               footer={null}
            >
               {modalData.type === 'draft' && (
                  <div>
                     <TableDraftSearch
                        labelLength={4}
                        exportButtonShow={false}
                        handleText={'重置'}
                        form={form}
                        itemData={[
                           {
                              type: 'RangePicker',
                              name: 'updateTime',
                              label: '保存时间',
                              shortcutsPlacementLeft: true,
                              shortcuts: $$.shortcutsList(),
                              span: 6,
                           },
                           { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                           { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                        ]}
                        handleReset={() => handleSearch('draft', 'reset')}
                        handleSearch={() => handleSearch('draft', 'search')}
                     />
                     <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', marginBottom: '12px' }}></div>
                     <div style={{ marginTop: '0px' }}>
                        <TableView
                           showHeader
                           title="查询结果"
                           columns={columns()}
                           dataSource={data.tableData}
                           onChange={(pagination, filters, sorter) => {
                              handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                              // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                           }}
                           pagination={{
                              current: search.page,
                              pageSize: search.size,
                              total: data.total,
                              // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                           }}
                        />
                     </div>
                     <TableView
                        // showHeader
                        // title="查询结果"
                        columns={columnsDone}
                        key={tabKey}
                        dataSource={data.tableData}
                        onChange={(pagination, filters, sorter) => {
                           handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                           // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                        }}
                        pagination={{
                           current: search.page,
                           pageSize: search.size,
                           total: data.total,
                           // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                        }}
                  </div>
               )}
               {modalData.type === 'his' && (
                  <div>
                     <TableSearch
                        labelLength={4}
                        exportButtonShow={false}
                        displayShow={false}
                        textAlign={{ textAlign: 'left' }}
                        form={form}
                        itemData={[
                           {
                              type: 'RangePicker',
                              name: 'createTime',
                              label: '登记时间',
                              shortcutsPlacementLeft: true,
                              shortcuts: $$.shortcutsList(),
                              span: 6,
                           },
                           { type: 'Input', name: 'plaintiffs', placeholder: '查询关键词', label: '申请方', span: 6 },
                           { type: 'Input', name: 'defendants', placeholder: '查询关键词', label: '被申请方', span: 6 },
                           {
                              type: 'Select',
                              name: 'status',
                              label: '事项状态',
                              placeholder: '请选择',
                              span: 8,
                              selectdata: $$.options.caseStatus,
                           },
                           {
                              type: 'Cascader',
                              name: 'caseType',
                              label: '纠纷类型',
                              placeholder: '请选择',
                              span: 8,
                              treedata: $$.caseTypeSelect.caseTypeSelect,
                           },
                           {
                              type: 'Select',
                              name: 'canal',
                              label: '事项来源',
                              placeholder: '请选择',
                              span: 8,
                              selectdata: $$.options.caseCanal,
                           },
                           {
                              type: 'Select',
                              name: 'caseLevel',
                              label: '事项等级',
                              placeholder: '请选择',
                              span: 8,
                              selectdata: $$.options.caseLevelList,
                           },
                           {
                              type: 'Select',
                              name: 'mediResult',
                              label: '化解结果',
                              placeholder: '请选择',
                              span: 8,
                              selectdata: $$.options.mediResult,
                           },
                        ]}
                        handleReset={() => handleSearch('his', 'reset')}
                        handleSearch={() => handleSearch('his', 'search')}
                     />
                     <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                     <div style={{ marginTop: '0px' }}>
                        <TableView
                           showHeader
                           title="查询结果"
                           columns={columnsHis()}
                           dataSource={data.tableData}
                           onChange={(pagination, filters, sorter) => {
                              handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                              // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                           }}
                           pagination={{
                              current: search.page,
                              pageSize: search.size,
                              total: data.total,
                              // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                           }}
                        />
                     </div>
                  </div>
               </div>
            )}
         </Modal>
         <Response visible={response} handleOnCancel={() => setResponse(false)} responseId={responseId} data={superviseInfo} />
         <Modal title="督办信息" style={{ width: '938px' }} onCancel={() => setSupervisingList(false)} visible={supervisingList} footer={null}>
            <TableView
               showHeader
               title=""
               columns={supervisingColumns}
               dataSource={SuperviseListData || []}
               rowKey="id"
               tableHeight={500}
               style={{ marginTop: '-40px' }}
               )}
               {modalData.type === 'done' && (
                  <div>
                     <TableSearch
                        labelLength={4}
                        exportButtonShow={false}
                        displayShow={false}
                        textAlign={{ textAlign: 'left' }}
                        form={form}
                        itemData={[
                           {
                              type: 'RangePicker',
                              name: 'handleTime',
                              label: '统计时间',
                              allowClear: false,
                              shortcutsPlacementLeft: true,
                              shortcuts: $$.shortcutsList(),
                              span: 6,
                           },
                           {
                              type: 'Cascader',
                              name: 'caseType',
                              label: '纠纷类型',
                              placeholder: '请选择',
                              span: 8,
                              changeSelect: true,
                              allowClear: false,
                              treedata: $$.caseTypeSelect.caseTypeSelect,
                           },
                           { type: 'Select', name: 'caseLevel', label: '事项等级', placeholder: '请选择', span: 8, selectdata: $$.options.caseLevelList },
                           { type: 'Select', name: 'canal', label: '事项来源', placeholder: '请选择', span: 8, selectdata: $$.options.caseCanal },
                           { type: 'Select', name: 'mediResult', label: '化解结果', placeholder: '请选择', span: 8, selectdata: $$.options.mediResult },
                           { type: 'Select', name: 'status', label: '事项状态', placeholder: '请选择', span: 8, selectdata: $$.options.caseStatus },
                        ]}
                        handleReset={() => handleSearch('done', 'reset')}
                        handleSearch={() => handleSearch('done', 'search')}
                     />
                     <div style={{ width: '100%', borderBottom: '1px solid #E5E6EB', margin: '12px 0' }}></div>
                     <div style={{ marginTop: '0px' }}>
                        <div style={{ fontSize: '16px' }}>查询结果</div>
                        <div style={{ width: '100%', position: 'relative' }}>
                           <MyTabsNew
                              // 1-已受理,2-已交办,3-已上报,4已回退
                              tabs={[
                                 { label: <div style={{ height: '24px' }}>全部({data?.totalData?.totalNum || 0})</div>, key: '' },
                                 { label: <div style={{ height: '24px' }}>已受理({data?.totalData?.acceptNum || 0})</div>, key: '1' },
                                 { label: <div style={{ height: '24px' }}>已交办({data?.totalData?.assignedNum || 0})</div>, key: '2' },
                                 { label: <div style={{ height: '24px' }}>已上报({data?.totalData?.reportNUm || 0})</div>, key: '3' },
                                 { label: <div style={{ height: '24px' }}>已回退({data?.totalData?.backNUm || 0})</div>, key: '4' },
                              ]}
                              activeKey={tabKey}
                              onChange={(activeKey) => tabsOnchange(activeKey)}
                           />
                           <div style={{ borderBottom: '1px solid #E5E6EB', position: 'absolute', width: '100%' }}></div>
                        </div>
                        <div style={{ margin: '12px 0' }}>
                           <Alert
                              type="success"
                              content={
                                 <span>
                                    已为您生成
                                    {tabKey !== '' && (
                                       <span>
                                          <span className="public-color">
                                             {tabKey === '1'
                                                ? '受理时间'
                                                : tabKey === '2'
                                                ? '交办时间'
                                                : tabKey === '3'
                                                ? '上报时间'
                                                : tabKey === '4'
                                                ? '回退时间'
                                                : ''}
                                          </span>
                                          在
                                       </span>
                                    )}
                                    {search.handleTimeStart && (
                                       <span className="public-color">
                                          {$$.myTimeFormat(search.handleTimeStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.handleTimeEnd, 'YYYY.M.D')}
                                       </span>
                                    )}
                                    {/*{search.closeStart && <span className='public-color'>{search.createStart && '、'}办结时间({$$.myTimeFormat(search.createStart, 'YYYY.M.D')}-{$$.myTimeFormat(search.createEnd, 'YYYY.M.D')})</span>}
                    {search.caseType && <span className='public-color'>{(search.createStart || search.closeStart) && '、'}纠纷类型({caseTypeNames.join('/')})</span>} */}
                                    内的已办矛盾纠纷
                                 </span>
                              }
                           />
                        </div>
                        <TableView
                           // showHeader
                           // title="查询结果"
                           columns={columnsDone}
                           key={tabKey}
                           dataSource={data.tableData}
                           onChange={(pagination, filters, sorter) => {
                              handleChangePage(pagination.current, pagination.pageSize, sorter.field, sorter.order);
                              // handleSearch('change', { ...search, sortType: sorter.field === 'waitDay' ? 2 : 1, descType: sorter.order === 'descend' ? 2 : sorter.order === 'ascend' ? 1 : '', page: pagination.current, size: pagination.pageSize });
                           }}
                           pagination={{
                              current: search.page,
                              pageSize: search.size,
                              total: data.total,
                              // onChange: (page, pageSize, sorter) => handleChangePage(page, pageSize, sorter),
                           }}
                        />
                     </div>
                  </div>
               )}
            </Modal>
            <Response visible={response} handleOnCancel={() => setResponse(false)} responseId={responseId} data={superviseInfo} />
            <Modal title="督办信息" style={{ width: '938px' }} onCancel={() => setSupervisingList(false)} visible={supervisingList} footer={null}>
               <TableView
                  showHeader
                  title=""
                  columns={supervisingColumns}
                  dataSource={SuperviseListData || []}
                  rowKey="id"
                  tableHeight={500}
                  style={{ marginTop: '-40px' }}
               />
            </Modal>
            <ResponseDetail visible={detail} handleOnCancel={() => setDetail(false)} data={responseDetail} />
            <SupervisingViews
               visible={supervising}
               handleOnCancel={() => setSupervising(false)}
               caseId={supervisingAddId}
               supervisingId={supervisingId}
               getTableData={() => getTableData('1')}
            />
         </Modal>
         <ResponseDetail visible={detail} handleOnCancel={() => setDetail(false)} data={responseDetail} />
         <SupervisingViews
            visible={supervising}
            handleOnCancel={() => setSupervising(false)}
            caseId={supervisingAddId}
            supervisingId={supervisingId}
            getTableData={() => getTableData('1')}
         />
         <Modal title="自行排查" style={{ width: '512px' }} onCancel={() => setInspectionVisible(false)} visible={inspectionVisible} footer={null}>
            <div className="troubleshooting">
               <div className="troubleshooting-left">
                  <img src={troubleshooting} alt="" srcset="" />
                  <div>
                     <div className="troubleshooting-left-top">部门排查</div>
                     <div className="troubleshooting-left-bottom">部门自行化解矛盾或提交纠纷至综治中心化解</div>
            <Modal title="自行排查" style={{ width: '512px' }} onCancel={() => setInspectionVisible(false)} visible={inspectionVisible} footer={null}>
               <div className="troubleshooting">
                  <div className="troubleshooting-left">
                     <img src={troubleshooting} alt="" srcset="" />
                     <div>
                        <div className="troubleshooting-left-top">部门排查</div>
                        <div className="troubleshooting-left-bottom">部门自行化解矛盾或提交纠纷至综治中心化解</div>
                     </div>
                  </div>
                  <Button
                     type="primary"
                     onClick={() => {
                        navigate(`/mediate/selfInspection`);
                     }}
                  >
                     登记
                  </Button>
               </div>
               <Button
                  type="primary"
                  onClick={() => {
                     navigate(`/mediate/selfInspection`);
                  }}
               >
                  登记
               </Button>
            </div>
            <Divider />
            <div className="troubleshooting">
               <div className="troubleshooting-left">
                  <img src={peopleMediation} alt="" srcset="" />
                  <div>
                     <div className="troubleshooting-left-top">调解组织录入</div>
                     <div className="troubleshooting-left-bottom">调解员或调解组织自行受理案件</div>
               <Divider />
               <div className="troubleshooting">
                  <div className="troubleshooting-left">
                     <img src={peopleMediation} alt="" srcset="" />
                     <div>
                        <div className="troubleshooting-left-top">调解组织录入</div>
                        <div className="troubleshooting-left-bottom">调解员或调解组织自行受理案件</div>
                     </div>
                  </div>
                  <Button
                     type="primary"
                     onClick={() => {
                        navigate(`/mediate/selfInspection?isOrganization=true`);
                     }}
                  >
                     登记
                  </Button>
               </div>
               <Button
                  type="primary"
                  onClick={() => {
                     navigate(`/mediate/selfInspection?isOrganization=true`);
                  }}
               >
                  登记
               </Button>
            </div>
         </Modal>
         <AiQuestion
            visible={AiQuestionView}
            onClose={() => setAiQuestionView(false)}
            aiData={aiData}
            aiLawData={aiLawData}
            caseDetailAi={caseDetailAi}
            caseClaim={caseClaim}
         />
      </div>
            </Modal>
            <AiQuestion
               visible={AiQuestionView}
               onClose={() => setAiQuestionView(false)}
               aiData={aiData}
               aiLawData={aiLawData}
               caseDetailAi={caseDetailAi}
               caseClaim={caseClaim}
            />
         </div>
      </NewPage>
   );
};