From d27794814b69d18aeb8ee96a46cae91d5613570c Mon Sep 17 00:00:00 2001
From: xusd <330628789@qq.com>
Date: Thu, 19 Jun 2025 21:06:51 +0800
Subject: [PATCH] feature:市平台粤政易H5
---
src/utils/timer.js | 32
src/views/selectPerson/index.less | 215
src/views/selfInspection/components/Preview/index.less | 170
src/components/room/RoomNumberGrid.jsx | 92
src/views/selfInspection/components/UploadFile/index.jsx | 117
src/assets/img/Residential_1.png | 0
src/components/MyModal/index.less | 20
src/components/ModalBottomDownYear/index.less | 43
src/components/ModalDown copy/index.jsx | 455
src/components/cityData/index.jsx | 232
src/components/ModalDown/index.jsx | 358
src/assets/img/me_img_15.png | 0
src/components/building/StandardAddresList.jsx | 311
src/assets/img/avatar4.png | 0
src/assets/img/mediate_img_3.png | 0
src/assets/img/homePage_3.png | 0
src/assets/img/pdf.svg | 6
src/assets/img/task_img_2.png | 0
src/components/MyList/index.jsx | 109
src/components/MsgModal/index.jsx | 79
src/components/ImgShow/index.less | 54
src/views/selfInspection/components/FormCacheManager/index.jsx | 131
src/components/ModalContent/index.less | 24
src/assets/img/camera.png | 0
src/assets/img/room-bg.png | 0
src/assets/img/help_img_3.png | 0
src/assets/img/visit_4.png | 0
src/components/MySearchBar/index.less | 34
src/views/selfInspection/components/BasicInfoForm/index.jsx | 546
src/assets/img/addressBlack.png | 0
src/assets/img/tabBar_img_5.png | 0
src/components/analysis/index.less | 69
src/assets/img/principalDetail.png | 0
src/components/task/TaskHandleDetail.jsx | 89
src/assets/img/workStatistics_5.png | 0
src/components/IdcardOCR/index.less | 77
src/components/Info/index.less | 169
src/assets/img/applyClose_1.svg | 1
src/assets/img/tabBar_img_11.png | 0
src/assets/img/natural_person_1.png | 0
public/dayjs.min.js | 1
src/assets/icon/legal-person.svg | 4
src/assets/img/homePage_img_4.png | 0
src/components/TabBarPage/index.less | 98
src/components/mediate/index.less | 783
src/assets/img/caseDesPicture.png | 0
src/views/flow/component/lzjd/index.jsx | 30
src/assets/img/me_img_6.png | 0
src/assets/img/preview_1.png | 0
src/components/ProgressStep/VisitStep.jsx | 216
src/views/selfInspection/readperson/index.less | 151
src/components/ModalMinDown/index.less | 52
src/assets/img/questionMark.png | 0
src/assets/img/secPage_1.png | 0
src/views/selfInspection/components/VoiceRecognition/index.jsx | 149
src/api/apiHandler.js | 110
src/components/MySearchNoSelectBar/index.jsx | 30
src/assets/img/home_3.png | 0
src/views/flow/component/sqjl/detail.less | 480
public/index.html | 47
src/assets/img/Frame.png | 0
src/views/selfInspection/caseDes/index.jsx | 143
src/components/building/index.less | 104
src/views/flow/component/bysl/index.jsx | 125
src/views/login/index.less | 349
src/assets/img/coordinate_2.png | 0
src/assets/img/login_3.png | 0
src/components/MyCardSearchBar/index.less | 39
src/assets/img/roomForm_2.png | 0
src/assets/img/idcard.png | 0
src/styles/index.less | 35
src/views/flow/index.less | 217
src/components/ServiceStep/index.jsx | 54
src/assets/img/tabBar_img_6.png | 0
src/components/oldsterEvent/SubsidyList.jsx | 96
src/assets/img/login_history.png | 0
src/assets/img/account2.png | 0
src/assets/img/close_1.png | 0
src/assets/img/sqjl_3.png | 0
src/components/RenderFormView copy/index.less | 305
src/views/caseQuery/index.jsx | 1137
src/assets/img/Frame_6.png | 0
src/components/Overlay/index.less | 16
src/views/selfInspection/components/CaseSubmitService/index.js | 142
src/assets/img/help_img_2.png | 0
src/components/NewModalContent/index.less | 53
src/assets/img/Frame3.png | 0
src/assets/img/tabBar_img_10.png | 0
src/assets/img/taskHandle_img_1.png | 0
src/assets/img/building_6.png | 0
src/assets/img/mediate_img_2.png | 0
src/assets/img/Frame_6_2x.png | 0
src/views/flow/component/sxbl/index.jsx | 465
src/assets/img/homePage_4.png | 0
src/assets/img/visit_3.png | 0
src/views/flow/component/sxbl/index.less | 619
src/views/selfInspection/readperson/index.jsx | 464
src/assets/img/person_file.png | 0
src/assets/img/satellite_map.png | 0
src/assets/img/skinInput.png | 0
src/assets/img/remove_1.png | 0
src/assets/img/homePage_img_5.png | 0
src/assets/img/me_img_7.png | 0
src/assets/img/coordinate_1.png | 0
src/assets/img/word.png | 0
src/assets/img/avatar3.png | 0
src/assets/img/building_1.png | 0
src/assets/img/excel.png | 0
src/assets/img/modify_1.png | 0
src/components/ShowToastCustom/toast.css | 89
src/assets/img/assistHeading_1.png | 0
src/utils/caseTypeSelect.js | 598
src/components/MyTabs/index.less | 33
src/assets/img/me_img_14.png | 0
src/views/selfInspection/components/VoiceRecognition/index.less | 134
src/assets/cardImg/del.png | 0
src/assets/img/home_2.png | 0
src/assets/img/building.png | 0
src/components/task/TaskDetail.jsx | 113
src/assets/img/roomForm.png | 0
src/views/selfInspection/disputeTypePicker/index.less | 239
package.json | 68
src/assets/img/repeat_1.png | 0
src/assets/img/login_2.png | 0
src/components/FormView/index.jsx | 311
src/assets/img/account1.png | 0
src/assets/img/account3.png | 0
src/assets/img/batchImport_save.png | 0
src/utils/selectOption.js | 1566 +
src/assets/img/building_5.png | 0
src/assets/img/qrCode.png | 0
src/status/router.js | 75
src/assets/img/help_1.png | 0
src/assets/img/avatar6.png | 0
src/components/UserTag/index.jsx | 105
src/assets/img/message_img_1.png | 0
src/views/workStatistics/areaIndex.jsx | 1187
src/assets/cardImg/index.js | 17
src/assets/img/sqjl_2.png | 0
craco.config.js | 25
src/views/workStatistics/MyLTopChartPie.jsx | 152
src/assets/img/suceess.png | 0
src/api/appUrl.js | 97
src/components/Overlay/index.jsx | 25
public/locationSelect.js | 1066
src/views/registerHis/index.jsx | 616
src/assets/img/file.svg | 6
src/assets/img/preview_2.png | 0
src/assets/img/assistHeading_5.png | 0
src/assets/img/me_img_17.png | 0
src/assets/img/homePage_img_6.png | 0
src/assets/img/mental_1.png | 0
src/assets/img/me_img_21.png | 0
src/views/flow/index.jsx | 1290
src/assets/img/modalDown_1.png | 0
src/views/selfInspection/components/CharacterCounter/index.jsx | 90
src/components/ModalLContent/index.jsx | 94
src/components/EmptyView/index.jsx | 35
src/status/publicData.js | 100
src/components/MySearch/index.less | 41
src/assets/img/assistHeading_2.png | 0
src/assets/img/assist_2.png | 0
src/assets/img/goldMedal.png | 0
src/components/MyCardTab/index.jsx | 44
src/assets/img/person_edit.png | 0
src/components/MySearch/index.jsx | 38
src/components/ModalBottomDownYear/index.jsx | 76
src/views/flow/component/lzjd/index.less | 3
src/components/CalendarRangeDay/index.less | 99
src/components/Info/index.jsx | 458
src/components/RenderFormView/index.jsx | 2095 +
public/DingTalk_JinBuTi_Regular.ttf | 0
src/assets/img/tabBar_img_3.png | 0
src/assets/img/building_2.png | 0
public/manifest.json | 25
src/components/room/index.js | 18
src/assets/img/help_img_1.png | 0
src/components/IdcardOCR/index.jsx | 122
src/views/selfInspection/legalPerson/partyInfo.jsx | 556
src/assets/img/select_null.png | 0
src/assets/img/license.png | 0
src/components/analysis/PieChart.jsx | 72
src/assets/img/unincorporated_org_0.png | 0
src/assets/img/login_4.png | 0
src/assets/img/qianChu.png | 0
src/assets/img/mental_2.png | 0
src/components/MyCardTab/index.less | 54
src/assets/img/me_img_16.png | 0
src/assets/img/eventInit_img_3.png | 0
src/assets/img/me_img_1.png | 0
src/components/MyCardSearchBar/index.jsx | 35
src/assets/img/mediate_img_4.png | 0
src/assets/img/tabBar_img_4.png | 0
src/assets/img/building_4.png | 0
src/components/CalendarRangeDay/index.jsx | 168
src/components/TabBarPage/index.jsx | 184
src/assets/img/homePage_img_7.png | 0
src/components/MyTabs/index.jsx | 31
src/components/workLog/ModalContent/index.jsx | 84
src/assets/img/principalAdd.png | 0
src/assets/img/index_modal_1.png | 0
README.md | 97
src/assets/img/sqjl_1.png | 0
src/components/MyList/index.less | 20
src/views/flow/component/daxx/index.jsx | 224
src/assets/icon/index.js | 13
src/assets/img/assistHeading_4.png | 0
src/assets/img/upOneLevel.png | 0
src/components/RenderFormView/index.less | 493
src/assets/img/avatar5.png | 0
src/components/ShowToastCustom/index.js | 49
src/components/FileShow/index.less | 55
src/components/InfoView/index.less | 213
src/assets/img/base_map.png | 0
src/assets/img/logAvatar.png | 0
src/assets/img/home.png | 0
src/assets/img/person2.png | 0
src/assets/img/assistHeading_3.png | 0
src/assets/img/link_picture.png | 0
src/components/Calendar/index.jsx | 141
src/views/personCenter/index.jsx | 107
src/views/selfInspection/components/LocationPicker/index.jsx | 167
src/components/visitHistory/PersonMsg.jsx | 148
src/assets/img/buildingbg.png | 0
src/assets/img/uploadButton.png | 0
src/utils/rules.js | 86
src/assets/img/ledger_8.png | 0
src/assets/img/message_img_2.png | 0
src/index.js | 31
src/components/CardFollow/CardFollowDetailMsg.jsx | 87
src/components/SlideTest/index.less | 45
src/assets/img/building_3.png | 0
src/components/room/List.jsx | 101
src/components/NavBarPage/index.less | 51
src/assets/img/home_9.png | 0
src/views/selfInspection/caseDes/index.less | 757
src/components/ModalNewContent/index.jsx | 76
src/assets/img/idcardOcr.png | 0
src/assets/img/surveyGrid_img_1.png | 0
src/views/flow/addRecord/index.jsx | 165
src/assets/img/workLog_img_1.png | 0
src/components/searchHead/index.less | 0
src/components/ModalView/index.less | 0
src/components/TaskModalContent/index.less | 42
src/views/flow/component/daxx/index.less | 145
src/assets/img/hasMore_1.png | 0
src/assets/img/logo1.png | 0
src/assets/img/me_img_2.png | 0
src/components/room/RoomMsg.jsx | 136
src/views/selfInspection/components/CaseSubmitService/service.js | 0
public/robots.txt | 3
src/assets/img/batchImport_right.png | 0
src/components/MyTabsHeads/index.less | 50
src/assets/img/homePage_img_1.png | 0
src/assets/img/homePage_img_12.png | 0
src/assets/img/homePage_bg.png | 0
src/assets/cardImg/add.png | 0
src/assets/img/homePage_img_8.png | 0
src/components/room/ResidentMsg.jsx | 96
src/assets/img/area_2.png | 0
src/react-router-dom.d.ts | 1
src/assets/img/me_img_9.png | 0
src/views/personCenter/index.less | 214
src/components/PreviewImage/index.jsx | 25
src/assets/img/home_7.png | 0
src/assets/img/file_delete.png | 0
src/assets/icon/natural-person.svg | 4
src/assets/icon/img_none.svg | 5
src/components/NewModalContent/index.jsx | 87
src/assets/img/index_modal_2.png | 0
src/assets/img/eventInit_img_2.png | 0
src/views/selfInspection/components/BasicInfoForm/index.less | 682
src/assets/img/ledger_7.png | 0
src/assets/img/cbdb_1.png | 0
src/assets/img/me_img_11.png | 0
src/assets/img/seal.png | 0
src/assets/img/tabBar_img_1.png | 0
src/views/selfInspection/components/UploadFile/index.less | 0
src/components/ServiceStep/index.less | 64
src/assets/img/caseDesVoice.png | 0
src/views/selfInspection/disputeTypePicker/index.jsx | 356
src/assets/icon/non-legal-person.svg | 4
src/assets/img/workStatistics_2.png | 0
src/components/UploadFile/index.less | 0
src/assets/img/idCardphoto.png | 0
src/assets/img/task_tag_3.png | 0
src/views/selfInspection/legalPerson/CustomFormExample.jsx | 140
src/assets/img/zxperson4.png | 0
src/assets/img/lettersVisits_1.png | 0
src/assets/img/legal_person_0.png | 0
src/components/ModalDownPreview/index.less | 66
src/components/ModalDown/index.less | 201
src/views/selfInspection/legalPerson/index.jsx | 201
src/assets/img/home_8.png | 0
src/assets/img/visit_1.png | 0
src/assets/img/tabBar_img_8.png | 0
src/components/ModalView/index.jsx | 30
src/assets/img/batchImport_select.png | 0
src/assets/img/ledger_12.png | 0
src/views/selfInspection/legalPerson/index copy.jsx | 194
src/assets/img/Rectangle 812.png | 0
src/views/flow/component/caseDetail/index.jsx | 0
src/components/person/MorePersonMsg.jsx | 65
src/components/ModalLContent/index.less | 63
src/components/MyModal/index.jsx | 74
src/assets/img/workLog_img_2.png | 0
src/components/WorkStatisticsTabs/index.less | 43
src/components/task/ReturnTask.jsx | 113
src/views/workStatistics/MyChartBar.jsx | 176
src/assets/img/person1.png | 0
src/components/visit/search.jsx | 84
src/views/home/index.jsx | 1086
src/views/caseYb/index.jsx | 898
src/views/selfInspection/components/CharacterCounter/index.less | 118
src/assets/img/area_1.png | 0
src/assets/img/home_1.png | 0
src/assets/img/hasMore_2.png | 0
src/components/CustomFormView/index.less | 513
src/components/FormView/index.less | 295
src/components/FileShow/index.jsx | 108
src/components/ImgShow/index.jsx | 165
src/assets/img/catalogue.png | 0
src/components/InfoView/index.jsx | 359
src/assets/img/homePage_img_9.png | 0
src/components/citywideView/index.less | 0
src/components/MyTabsHeads/index.jsx | 32
src/assets/img/upLoadFile.png | 0
src/assets/img/Personnel_1.png | 0
src/styles/public.less | 676
src/views/flow/component/dbcb/index.jsx | 960
src/assets/img/eventInit_img_1.png | 0
src/components/citywideView/index.jsx | 301
src/assets/img/me_img_18.png | 0
src/router/index.js | 173
src/components/communityService/List.jsx | 81
src/components/ResidenceDetails/index.jsx | 63
src/assets/img/me_img_8.png | 0
src/views/flow/component/dbcb/index.less | 735
src/assets/img/idCardReverse.png | 0
src/assets/img/help_2.png | 0
src/assets/img/home_6.png | 0
src/styles/theme.css | 516
src/components/DingUpload/index.jsx | 172
src/assets/img/return_1.png | 0
src/assets/img/PersonnelNews_1.png | 0
src/assets/img/guide.png | 0
src/assets/img/zxperson3.png | 0
.gitignore | 26
src/components/CalendarRangeTwoDay/index.less | 99
src/assets/img/phone.png | 0
src/assets/img/legal_person_1.png | 0
src/components/Descriptions/index.jsx | 212
src/components/MyTabsBuilding/index.less | 44
src/views/flow/component/dbcb/reply.jsx | 189
src/assets/img/assist_1.png | 0
src/components/CalendarMonth/index.jsx | 184
src/components/CustomFormView/index.jsx | 570
src/components/room/UnitMsg.jsx | 112
src/styles/form.less | 32
src/assets/img/delEliminate.png | 0
src/assets/img/Frame2.png | 0
src/assets/img/me_img_10.png | 0
src/components/searchHead/index.jsx | 130
src/assets/img/me_img_20.png | 0
src/utils/utility.js | 1158
src/assets/img/task_tag_2.png | 0
src/assets/img/me_img_19.png | 0
src/assets/img/index.js | 520
src/views/workStatistics/areaIndex.less | 940
src/components/cityData/index.less | 0
src/assets/img/homePage_img_11.png | 0
src/components/ModalDownPreview/index.jsx | 229
src/components/analysis/List.jsx | 105
src/views/message/index.jsx | 56
src/assets/img/unincorporated_org_1.png | 0
src/assets/img/tabBar_img_2.png | 0
src/assets/img/questionMark_blue.png | 0
src/views/selfInspection/Agentperson/index.less | 1303
src/utils/socialCard.js | 234
src/assets/img/me_img_3.png | 0
src/assets/img/workStatistics_1.png | 0
src/components/DingUpload/index.less | 113
src/assets/img/general_user-add-blue.png | 0
src/assets/img/institutions_1.png | 0
src/assets/img/caseQuery_2.png | 0
src/views/flow/component/daxx/previewTable.jsx | 108
src/components/MyTabsBuilding/index.jsx | 42
src/assets/img/tabBar_img_7.png | 0
src/components/PreviewImage/index.less | 24
src/utils/selectOptionPage.js | 426
src/assets/img/address.png | 0
src/views/flow/component/sqjl/index.jsx | 138
.cursorrules | 154
src/views/selfInspection/components/LocationPicker/index.less | 141
src/components/village/List.jsx | 67
src/components/resourcePool/List.jsx | 97
src/assets/img/me.png | 0
src/assets/img/railwayOrgAdd_1.png | 0
src/components/InfoViewModal/index.jsx | 104
src/components/mediate/List.jsx | 102
src/views/selfInspection/components/DingUpload/index.less | 114
src/components/ModalNewContent/index.less | 55
src/components/mediate/index.js | 14
src/views/selfInspection/Agentperson/index.jsx | 712
src/components/task/List.jsx | 188
src/assets/img/sxbl_1.png | 0
src/components/mediate/MediateDetailMsg.jsx | 431
src/styles/theme.less | 45
src/assets/img/idCardTip.png | 0
public/regionData1.js | 2747 ++
src/api/caseApi.js | 41
src/components/room/OutPersonMsg.jsx | 79
src/views/selectPerson/index.jsx | 387
src/components/CalendarRangeTwoDay/index.jsx | 183
src/components/communityService/index.less | 155
src/assets/img/visit_2.png | 0
src/utils/threeLocationSelect.js | 1123
src/assets/img/helped_1.png | 0
src/assets/img/img_none.png | 0
src/views/flow/addRecord/index.less | 134
src/views/selfInspection/legalPerson/partyInfo.less | 830
src/reportWebVitals.js | 13
src/views/flow/component/sqjl/detail.jsx | 555
src/views/caseYb/index.less | 360
src/views/draftBox/index.jsx | 176
src/components/visit/List.jsx | 72
src/components/ModalMinDown/index.jsx | 40
src/assets/icon/del.svg | 12
public/font.css | 4
src/views/selfInspection/components/DingUpload/index.jsx | 172
src/assets/img/floating_1.png | 0
src/assets/img/homePage_1.png | 0
src/components/SlideTest/index.jsx | 76
src/views/flow/component/sqjl/index.less | 151
src/views/selfInspection/NaturePersonNone/index.jsx | 443
src/assets/img/home_5.png | 0
src/assets/img/avatar2.png | 0
src/assets/img/zxperson2.png | 0
src/views/selfInspection/legalPerson/index.less | 304
src/assets/img/batchImport_search.png | 0
src/components/CalendarMonth/index.less | 133
src/assets/img/task_img_1.png | 0
src/components/TaskModalContent/index.jsx | 75
src/views/caseQuery/index.less | 777
src/components/UploadFile/index.jsx | 117
src/components/cityData/index copy.jsx | 96
src/utils/caseCauseSelect.js | 114
src/components/room/ChangeRoomMsg.jsx | 103
src/components/ModalDown copy/index.less | 185
src/components/ShowToastCustom/toast.js | 79
src/assets/img/homePage_img_2.png | 0
src/views/selfInspection/components/ProcessFlow/index.jsx | 64
src/views/selfInspection/NaturePersonNone/index.less | 777
src/assets/img/login_1.png | 0
src/assets/img/homePage_img_10.png | 0
src/assets/img/task_tag_1.png | 0
src/assets/img/home_10.png | 0
src/assets/img/general_user-add.png | 0
src/assets/img/PersonnelNews_2.png | 0
src/assets/img/me_img_4.png | 0
src/components/materials/List.jsx | 67
src/assets/img/me_img_13.png | 0
src/assets/img/ToDesk.lnk | 0
src/assets/img/riskMask.png | 0
src/views/login/index.jsx | 261
src/components/ProgressStep/index.less | 272
public/regionData.js | 15019 +++++++++++
src/components/MySearchNoSelectBar/index.less | 32
src/views/flow/component/bysl/index.less | 145
src/components/Calendar/index.less | 62
src/assets/img/caseQuery_1.png | 0
src/assets/img/ledger_14.svg | 19
src/components/InfoViewModal/index.less | 149
src/components/Descriptions/index.less | 152
src/assets/img/railwayOrgAdd_2.png | 0
public/loader.css | 142
src/components/building/List.jsx | 81
src/views/selfInspection/components/Preview/index.jsx | 451
src/views/flow/component/dbcb/reply.less | 135
src/assets/img/hisPerson.png | 0
src/setupTests.js | 5
src/views/selfInspection/components/ProcessFlow/index.less | 132
src/assets/img/idCardFace.png | 0
src/components/UserTag/index.less | 81
src/views/registerHis/index.less | 378
src/components/oldsterEvent/GoodTreatmentList.jsx | 96
src/views/draftBox/index.less | 303
src/assets/img/task_img_3.png | 0
src/assets/img/Group.png | 0
src/assets/img/workStatistics_4.png | 0
src/assets/img/material_none.png | 0
src/assets/img/natural_person_0.png | 0
src/assets/img/analysis_2.png | 0
src/views/flow/applyClose/index.less | 324
src/assets/img/help_img_4.png | 0
src/views/repeat/index.jsx | 287
src/views/workStatistics/index.jsx | 997
src/components/ModalContent/index.jsx | 34
src/components/MySearchBar/index.jsx | 42
src/views/flow/applyClose/index.jsx | 382
src/assets/img/workStatistics_3.png | 0
public/regionData2.js | 2258 +
src/assets/img/home_11.png | 0
src/views/home/index.less | 744
src/assets/img/analysis_1.png | 0
src/assets/img/roomForm_1.png | 0
src/components/mediate/PartyEditModal.jsx | 292
src/assets/img/roomList.png | 0
src/components/NavBarPage/index.jsx | 60
src/assets/img/jpg.svg | 9
src/assets/img/floating_2.png | 0
src/assets/img/homePage_2.png | 0
src/components/MsgModal/index.less | 77
src/assets/img/visitHistory_img_1.png | 0
src/assets/img/home_4.png | 0
src/assets/img/plaint.png | 0
src/assets/img/me_img_5.png | 0
src/assets/img/tabBar_img_9.png | 0
src/assets/img/file_upload.png | 0
src/assets/img/me_img_12.png | 0
src/components/RenderFormView copy/index.jsx | 1187
src/views/repeat/index.less | 213
src/components/workLog/ModalContent/index.less | 66
src/assets/img/homePage_img_3.png | 0
src/views/workStatistics/index.less | 885
src/assets/img/avatar1.png | 0
src/views/message/index.less | 27
src/components/WorkStatisticsTabs/index.jsx | 91
src/assets/img/ledger_13.png | 0
src/assets/img/zxperson1.png | 0
530 files changed, 81,772 insertions(+), 2 deletions(-)
diff --git a/.cursorrules b/.cursorrules
new file mode 100644
index 0000000..70c06d8
--- /dev/null
+++ b/.cursorrules
@@ -0,0 +1,154 @@
+#回答规范
+#用来确定AI的回答是否是在我定义的规则内
+每次回答我的问题时，都要叫我亲爱的龙傲天大人
+
+#代码风格规范
+#React组件规范
+- 组件文件使用大驼峰命名（PascalCase），如：UserProfile.tsx
+- 组件内部函数使用小驼峰命名（camelCase）
+- 组件props类型必须使用TypeScript接口定义
+- 组件必须包含清晰的JSDoc注释，说明组件的用途和props含义
+- 组件内部状态使用useState或useReducer管理
+- 复杂逻辑必须抽离到自定义Hook中
+
+#目录结构规范
+- src/api：接口请求统一管理，按模块分类
+- src/components：可复用组件，按功能模块分类
+- src/views：页面级组件，按路由模块分类
+- src/utils：工具函数，按功能分类
+- src/styles：全局样式和主题配置
+- src/assets：静态资源，按类型分类（images/icons等）
+- src/router：路由配置，包含路由守卫
+- src/status：状态管理，使用Context或Redux
+
+#样式规范
+- 使用Less预处理器
+- 样式文件与组件同名，使用.module.less后缀
+- 全局样式变量统一在styles/variables.less中管理
+- 移动端适配使用rem或vw单位
+- 组件样式必须使用CSS Modules避免样式污染
+
+#TypeScript规范
+- 必须为所有props定义类型
+- 使用interface定义对象类型
+- 使用type定义联合类型和工具类型
+- 避免使用any类型，必要时使用unknown
+- 使用泛型增强代码复用性
+
+#性能优化规范
+- 使用React.memo优化组件重渲染
+- 使用useMemo和useCallback缓存计算结果和函数
+- 列表渲染必须使用key属性
+- 大数据列表使用虚拟滚动
+- 图片资源必须进行压缩和懒加载
+
+#钉钉开发规范
+- 钉钉API调用必须进行错误处理
+- 钉钉环境判断必须使用utils中的统一方法
+- 钉钉主题适配必须使用dingtalk-theme
+- 钉钉组件必须使用dingtalk-design-mobile
+
+#Git提交规范
+- feat: 新功能
+- fix: 修复bug
+- docs: 文档更新
+- style: 代码格式调整
+- refactor: 代码重构
+- test: 测试用例
+- chore: 构建过程或辅助工具的变动
+
+#注释规范
+- 组件文件头部必须包含作者、时间、版本等信息
+- 复杂逻辑必须添加详细注释
+- 工具函数必须包含参数和返回值说明
+- 接口定义必须包含字段说明
+- 关键业务逻辑必须添加注释说明
+
+#测试规范
+- 组件必须包含单元测试
+- 工具函数必须包含单元测试
+- 关键业务逻辑必须包含集成测试
+- 测试文件与源文件同名，使用.test.ts后缀
+- 测试覆盖率要求达到80%以上
+
+#安全规范
+- 敏感信息必须加密处理
+- 用户输入必须进行验证和转义
+- API请求必须进行错误处理
+- 避免在前端存储敏感信息
+- 使用HTTPS进行数据传输
+
+#文档规范
+- README必须包含项目说明、安装步骤、开发指南
+- 组件必须包含使用示例
+- API接口必须包含参数说明
+- 工具函数必须包含使用说明
+- 项目更新必须更新CHANGELOG
+
+#工具函数引入规范
+#utility.js工具函数自动引入规则
+- 当代码中需要使用以下功能时，必须自动引入utility.js中的对应方法：
+
+1. 环境判断和配置
+- isDebug, isTest, appUrl, title 等环境变量
+- 引入方式：import { isDebug, isTest, appUrl, title } from '../utils/utility';
+
+2. 日期时间处理
+- dateFormat, timeFormat, minuteFormat, myTimeFormat 等日期格式化
+- getQuarter, getBeforeDate, getCountTime 等日期计算
+- msgTime, tipTime, getweekTime 等时间显示
+- 引入方式：import { dateFormat, timeFormat, getQuarter } from '../utils/utility';
+
+3. 表单验证
+- checkTel, checkIdCard 等验证方法
+- verification, verificationLong, verificationSwf 等表单校验
+- 引入方式：import { checkTel, checkIdCard, verification } from '../utils/utility';
+
+4. UI交互
+- showToast, confirmModal, confirmTwoButtonModal, confirmThreeButtonModal 等弹窗
+- info, infoSuccess, infoError 等消息提示
+- 引入方式：import { showToast, confirmModal, info } from '../utils/utility';
+
+5. 本地存储
+- setLocal, getLocal, clearLocal 等localStorage操作
+- setSessionStorage, getSessionStorage, clearSessionStorage 等sessionStorage操作
+- 引入方式：import { setLocal, getLocal, setSessionStorage } from '../utils/utility';
+
+6. 地址处理
+- gainRegionDesc, gainRegionCode, gainnewRegionCode 等地址处理
+- regionThreeDesc, regionThreeCode 等三级联动
+- 引入方式：import { gainRegionDesc, regionThreeDesc } from '../utils/utility';
+
+7. 文件处理
+- openFiles 文件预览和下载
+- 引入方式：import { openFiles } from '../utils/utility';
+
+8. 钉钉相关
+- loginModal 登录状态处理
+- 引入方式：import { loginModal } from '../utils/utility';
+
+9. 数据处理
+- modifyArray, flattenNestedArray 等数组处理
+- ellipsis, sensitiveTitle 等字符串处理
+- noToChinese, checkIsNum 等数字处理
+- 引入方式：import { modifyArray, ellipsis, noToChinese } from '../utils/utility';
+
+10. 身份证信息提取
+- getSexByIdcard, getBirthdatByIdNo, getAgeByIdcard 等身份证信息处理
+- 引入方式：import { getSexByIdcard, getBirthdatByIdNo, getAgeByIdcard } from '../utils/utility';
+
+#工具函数使用规范
+- 优先使用utility.js中已有的工具函数，避免重复造轮子
+- 使用工具函数时必须进行错误处理
+- 工具函数的参数必须符合类型要求
+- 工具函数的返回值必须进行空值判断
+- 涉及敏感信息的工具函数必须进行加密处理
+- 涉及钉钉环境的工具函数必须进行环境判断
+
+#工具函数扩展规范
+- 新增工具函数必须添加到utility.js中
+- 新增工具函数必须添加JSDoc注释说明
+- 新增工具函数必须包含参数类型说明
+- 新增工具函数必须包含返回值说明
+- 新增工具函数必须包含使用示例
+- 新增工具函数必须进行单元测试
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..eaad73b
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,26 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+package-lock.json
+.vscode
diff --git a/README.md b/README.md
index 42ef2c3..9887ec4 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,97 @@
-## yzy_h5
+<!--
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-08 15:30:04
+ * @LastEditTime: 2023-06-02 10:42:35
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+-->
+# 项目必读
-广州矛调粤政易端
+## 项目运行
+```
+npm install // 项目初始化下载，运行过慢时可选择执行yarn，运行前如有package-lock.json请删除
+
+npm start // 运行
+
+npm run build // 打包
+```
+
+## 注意事项
+
+* 项目的运行环境是node@14.17.4版本下下载的。（版本过高可能会存在问题）
+
+* TODO 标签代表可运行但后续变化可修改
+
+* 打包代码需注意api地址访问，需修改utils - utility.js文件的 isDebug 变量，true为正式环境。
+
+* 引入dingtalk-jsapi包是为了钉钉ui组件引入,未使用到钉钉的jsapi接口, 此项目为政务钉钉jsApi调用是用gdt-jsapi
+
+* 引入海口地图服务注意：
+
+ 1. 海口地图引入了public的map，主要在index.html里面中引入了:
+
+ ```
+ <!-- HK地图css -->
+ <link rel="stylesheet" href="./map/arcgis_js_v332_api/arcgis_js_api/library/3.32/3.32/esri/css/esri.css" />
+
+ <!-- HK地图引用资源的地址 -->
+ <script type="text/javascript" src="./map/arcgis_js_v332_api/arcgis_js_api/library/3.32/3.32/global.js"></script>
+
+ <!-- HK地图js -->
+ <script type="text/javascript" src="./map/arcgis_js_v332_api/arcgis_js_api/library/3.32/3.32/init.js"></script>
+ ```
+
+ 2. 修改了map地图内以下地址的源码，添加了自己的服务器资源地址替换原有的地址，将源代码中的[HOSTNAME_AND_PATH_TO_JSAPI] 替换为global中的arcgisUrl。
+
+ D:\CodeWeb\hztGrid\mobile\public\map\arcgis_js_v332_api\arcgis_js_api\library\3.32\3.32 地图路径需要修改
+
+ ```
+ static-server\public\arcgis-3.32\init.js // 38行处
+
+ static-server\public\arcgis-3.32\dojo\dojo.js // 36行处
+ ```
+
+ 3. 海口地图参考：ArcGIS API for JavaScript3.x版本。
+
+ 4. 项目运行地图服务（ArcGIS）时调用的是以下地址（global.js）内的请求链接，如项目存放的服务器地址变更注意此（global.js)也需要考虑是否变更。
+
+ ```
+ static-server\public\arcgis-3.32\global.js
+ ```
+
+* gdt-jsapi海口“海政通”接口调用的包。
+
+* 项目中使用了“react-router-cache-route”路由缓存，可以缓存路由页面，不进行二次刷新页面，刷新页面通过status->router.js内的spinPage变量控制。
+
+* building,room,task,mediate/eventList模块页面(index.jsx)和搜索页面(Search.jsx)有共同的操作代码，如要改其中一个，另一个也需要注意是否需要更改，后续这一部分逻辑可优化（当时设计是为了独立性）。
+
+* 项目中曾使用react-virtual虚拟滚动，但因与react-router-cache-route配合使用时产生滚动条复位的问题未能解决，现已屏蔽react-virtual相关代码，后续不需要则可删除。
+
+## 项目目录
+
+```
+├── public
+│ ├── favicon.ico
+│ ├── index.html
+│ ├── loader.css 项目初始空白过渡动画
+│ ├── map_dot.png 地图服务的打点标记图片icon
+│ ├── marker.png 地图服务的marker标记图片icon
+│ ├── dayjs.min.js 时间，日期处理的js，moment的替代
+│ ├── regionData2.js 海口市地址js
+│ ├── regionData.js 省市区地址js
+│ └── map 海口政务地图服务的js库
+├── src
+ ├── api 项目api接口
+ ├── assets 项目图片，icon等资源
+ ├── components 公共组件，页面组件（页面组件多数情况下都是其页面单独使用）库
+ ├── router 路由
+ ├── status 数据，状态，工具类
+ ├── styles 样式
+ ├── utils 公共方法
+ ├── views 页面
+ └── index.js 入口文件
+└── craco.config.js craco的配置文件，用于加载less
+```
diff --git a/craco.config.js b/craco.config.js
new file mode 100644
index 0000000..e747d2b
--- /dev/null
+++ b/craco.config.js
@@ -0,0 +1,25 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-07-20 09:38:05
+ * @LastEditTime: 2023-07-20 09:40:59
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: craco配置文件
+ */
+const CracoLessPlugin = require('craco-less');
+
+module.exports = {
+ plugins: [
+ {
+ plugin: CracoLessPlugin,
+ options: {
+ lessLoaderOptions: {
+ lessOptions: {
+ javascriptEnabled: true,
+ },
+ },
+ },
+ },
+ ],
+};
diff --git a/package.json b/package.json
new file mode 100644
index 0000000..8270b09
--- /dev/null
+++ b/package.json
@@ -0,0 +1,68 @@
+{
+ "name": "hztSSIM",
+ "version": "0.1.0",
+ "private": true,
+ "dependencies": {
+ "@amap/amap-jsapi-loader": "^1.0.1",
+ "@ant-design/icons": "^5.2.6",
+ "@antv/data-set": "^0.11.8",
+ "@antv/f2": "^4.0.27",
+ "@antv/g2": "^4.2.7",
+ "@arco-design/web-react": "^2.63.1",
+ "@craco/craco": "^6.4.3",
+ "@testing-library/jest-dom": "^5.16.2",
+ "@testing-library/react": "^12.1.2",
+ "@testing-library/user-event": "^13.5.0",
+ "antd": "^5.8.6",
+ "axios": "^0.27.2",
+ "craco-less": "^2.0.0",
+ "cross-fetch": "^4.0.0",
+ "crypto-js": "^4.2.0",
+ "dd-icons": "^1.5.18",
+ "dingtalk-design-mobile": "^2.5.3",
+ "dingtalk-jsapi": "^2.15.2",
+ "dingtalk-theme": "^6.0.3",
+ "echarts": "^5.4.2",
+ "gdt-jsapi": "^1.9.38",
+ "html2canvas": "^1.4.1",
+ "react": "^17.0.2",
+ "react-custom-scrollbars": "^4.2.1",
+ "react-dom": "^17.0.2",
+ "react-pdf-js": "^5.1.0",
+ "react-router-cache-route": "^1.12.11",
+ "react-router-dom": "^5.3.3",
+ "react-scripts": "5.0.1",
+ "react-virtual": "^2.10.4",
+ "swiper": "^9.0.5",
+ "web-vitals": "^2.1.4"
+ },
+ "homepage": ".",
+ "scripts": {
+ "start": "craco start",
+ "build": "craco build",
+ "test": "craco test",
+ "eject": "react-scripts eject"
+ },
+ "eslintConfig": {
+ "extends": [
+ "react-app",
+ "react-app/jest"
+ ]
+ },
+ "browserslist": {
+ "production": [
+ ">0.2%",
+ "not dead",
+ "not op_mini all"
+ ],
+ "development": [
+ "last 1 chrome version",
+ "last 1 firefox version",
+ "last 1 safari version"
+ ]
+ },
+ "devDependencies": {
+ "@types/react-router-dom": "^5.3.3",
+ "typescript": "^5.4.2"
+ }
+}
diff --git a/public/DingTalk_JinBuTi_Regular.ttf b/public/DingTalk_JinBuTi_Regular.ttf
new file mode 100644
index 0000000..c4efa55
--- /dev/null
+++ b/public/DingTalk_JinBuTi_Regular.ttf
Binary files differ
diff --git a/public/dayjs.min.js b/public/dayjs.min.js
new file mode 100644
index 0000000..4acc24c
--- /dev/null
+++ b/public/dayjs.min.js
@@ -0,0 +1 @@
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t="undefined"!=typeof globalThis?globalThis:t||self).dayjs=e()}(this,(function(){"use strict";var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",f="month",h="quarter",c="year",d="date",$="Invalid Date",l=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_")},m=function(t,e,n){var r=String(t);return!r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},g={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return(e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return-t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,f),s=n-i<0,u=e.clone().add(r+(s?-1:1),f);return+(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return{M:f,y:c,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:h}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},v="en",D={};D[v]=M;var p=function(t){return t instanceof _},S=function t(e,n,r){var i;if(!e)return v;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else{var a=e.name;D[a]=e,i=a}return!r&&i&&(v=i),i||!r&&v},w=function(t,e){if(p(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},O=g;O.l=S,O.i=p,O.w=function(t,e){return w(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=S(t.locale,null,!0),this.parse(t)}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(O.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match(l);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.$x=t.x||{},this.init()},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds()},m.$utils=function(){return O},m.isValid=function(){return!(this.$d.toString()===$)},m.isSame=function(t,e){var n=w(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return w(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<w(t)},m.$g=function(t,e,n){return O.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!O.u(e)||e,h=O.p(t),$=function(t,e){var i=O.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},l=function(t,e){return O.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,g="set"+(this.$u?"UTC":"");switch(h){case c:return r?$(1,0):$(31,11);case f:return r?$(1,M):$(0,M+1);case o:var v=this.$locale().weekStart||0,D=(y<v?y+7:y)-v;return $(r?m-D:m+(6-D),M);case a:case d:return l(g+"Hours",0);case u:return l(g+"Minutes",1);case s:return l(g+"Seconds",2);case i:return l(g+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=O.p(t),h="set"+(this.$u?"UTC":""),$=(n={},n[a]=h+"Date",n[d]=h+"Date",n[f]=h+"Month",n[c]=h+"FullYear",n[u]=h+"Hours",n[s]=h+"Minutes",n[i]=h+"Seconds",n[r]=h+"Milliseconds",n)[o],l=o===a?this.$D+(e-this.$W):e;if(o===f||o===c){var y=this.clone().set(d,1);y.$d[$](l),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d}else $&&this.$d[$](l);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[O.p(t)]()},m.add=function(r,h){var d,$=this;r=Number(r);var l=O.p(h),y=function(t){var e=w($);return O.w(e.date(e.date()+Math.round(t*r)),$)};if(l===f)return this.set(f,this.$M+r);if(l===c)return this.set(c,this.$y+r);if(l===a)return y(1);if(l===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[l]||1,m=this.$d.getTime()+r*M;return O.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||$;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=O.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,f=n.months,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},c=function(t){return O.s(s%12||12,t,"0")},d=n.meridiem||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r},l={YY:String(this.$y).slice(-2),YYYY:this.$y,M:a+1,MM:O.s(a+1,2,"0"),MMM:h(n.monthsShort,a,f,3),MMMM:h(f,a),D:this.$D,DD:O.s(this.$D,2,"0"),d:String(this.$W),dd:h(n.weekdaysMin,this.$W,o,2),ddd:h(n.weekdaysShort,this.$W,o,3),dddd:o[this.$W],H:String(s),HH:O.s(s,2,"0"),h:c(1),hh:c(2),a:d(s,u,!0),A:d(s,u,!1),m:String(u),mm:O.s(u,2,"0"),s:String(this.$s),ss:O.s(this.$s,2,"0"),SSS:O.s(this.$ms,3,"0"),Z:i};return r.replace(y,(function(t,e){return e||l[t]||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,$){var l,y=O.p(d),M=w(r),m=(M.utcOffset()-this.utcOffset())*e,g=this-M,v=O.m(this,M);return v=(l={},l[c]=v/12,l[f]=v,l[h]=v/3,l[o]=(g-m)/6048e5,l[a]=(g-m)/864e5,l[u]=g/n,l[s]=g/e,l[i]=g/t,l)[y]||g,$?v:O.a(v)},m.daysInMonth=function(){return this.endOf(f).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=S(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return O.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),T=_.prototype;return w.prototype=T,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",f],["$y",c],["$D",d]].forEach((function(t){T[t[1]]=function(e){return this.$g(e,t[0],t[1])}})),w.extend=function(t,e){return t.$i||(t(e,_,w),t.$i=!0),w},w.locale=S,w.isDayjs=p,w.unix=function(t){return w(1e3*t)},w.en=D[v],w.Ls=D,w.p={},w}));
\ No newline at end of file
diff --git a/public/font.css b/public/font.css
new file mode 100644
index 0000000..edad09a
--- /dev/null
+++ b/public/font.css
@@ -0,0 +1,4 @@
+@font-face {
+ font-family: DingTalkRegular;
+ src: url('./DingTalk_JinBuTi_Regular.ttf');
+}
\ No newline at end of file
diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..33eb522
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,47 @@
+<!--
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2023-07-31 11:16:59
+ * @LastEditors: lwh
+ * @LastEditTime: 2025-04-16 11:14:53
+ * @FilePath: \hztSsim\mobile\public\index.html
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta http-equiv="Content-Type" charset="utf-8" />
+ <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
+ <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+ <meta name="mobile-web-app-capable" content="yes" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
+ <meta name="theme-color" content="#000000" />
+ <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/loader.css" />
+ <link rel="stylesheet" type="text/css" href="%PUBLIC_URL%/font.css" />
+ <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+ <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+ <title>广州市社会治安综合治理平台</title>
+ <!-- 钉钉组件暗黑模式多端统一引入 -->
+ <!-- <script src="//g.alicdn.com/dingding/dingtalk-theme/entry.js"></script> -->
+ <!-- 时间格式处理 -->
+ <script type="text/javascript" src="./dayjs.min.js"></script>
+ <script type="text/javascript">
+ window.onload = () => document.getElementById('loader-wrapper').remove();
+ </script>
+ <!-- <script src="https://uaa.digitalhainan.com.cn/js/sdk/uaa-sdk-bridge-release-1.0.0.min.js"></script> -->
+ <!-- 地区js -->
+ <script type="text/javascript" src="./regionData.js"></script>
+ <script type="text/javascript" src="./regionData2.js"></script>
+ <script type="text/javascript" src="./regionData1.js"></script>
+ </head>
+ <body>
+ <div id="loader-wrapper">
+ <div id="loader"></div>
+ <div class="loader-section section-left"></div>
+ <div class="loader-section section-right"></div>
+ </div>
+ <noscript>You need to enable JavaScript to run this app.</noscript>
+ <div id="root"></div>
+ </body>
+</html>
diff --git a/public/loader.css b/public/loader.css
new file mode 100644
index 0000000..10441d9
--- /dev/null
+++ b/public/loader.css
@@ -0,0 +1,142 @@
+#loader-wrapper {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 999;
+}
+
+#loader {
+ display: block;
+ position: relative;
+ left: 50%;
+ top: 50%;
+ width: 100px;
+ height: 100px;
+ margin: -50px 0 0 -50px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ /* COLOR 1 */
+ border-top-color: #007fff;
+ -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -ms-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -moz-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -o-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
+ z-index: 1001;
+}
+
+#loader:before {
+ content: '';
+ position: absolute;
+ top: 5px;
+ left: 5px;
+ right: 5px;
+ bottom: 5px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ /* COLOR 2 */
+ border-top-color: #007fff;
+ -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -moz-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -o-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -ms-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
+}
+
+#loader:after {
+ content: '';
+ position: absolute;
+ top: 15px;
+ left: 15px;
+ right: 15px;
+ bottom: 15px;
+ border-radius: 50%;
+ border: 3px solid transparent;
+ border-top-color: #007fff;
+ /* COLOR 3 */
+ -moz-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -o-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -ms-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
+ animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
+}
+
+@-webkit-keyframes spin {
+ 0% {
+ -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: rotate(0deg); /* IE 9 */
+ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
+ }
+ 100% {
+ -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: rotate(360deg); /* IE 9 */
+ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
+ }
+}
+
+@keyframes spin {
+ 0% {
+ -webkit-transform: rotate(0deg); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: rotate(0deg); /* IE 9 */
+ transform: rotate(0deg); /* Firefox 16+, IE 10+, Opera */
+ }
+ 100% {
+ -webkit-transform: rotate(360deg); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: rotate(360deg); /* IE 9 */
+ transform: rotate(360deg); /* Firefox 16+, IE 10+, Opera */
+ }
+}
+
+#loader-wrapper .loader-section {
+ position: fixed;
+ top: 0;
+ width: 51%;
+ height: 100%;
+ background: #f0f2f5; /* Old browsers */
+ z-index: 1000;
+ -webkit-transform: translateX(0); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: translateX(0); /* IE 9 */
+ transform: translateX(0); /* Firefox 16+, IE 10+, Opera */
+}
+
+#loader-wrapper .loader-section.section-left {
+ left: 0;
+}
+
+#loader-wrapper .loader-section.section-right {
+ right: 0;
+}
+
+/* Loaded */
+.loaded #loader-wrapper .loader-section.section-left {
+ -webkit-transform: translateX(-100%); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: translateX(-100%); /* IE 9 */
+ transform: translateX(-100%); /* Firefox 16+, IE 10+, Opera */
+ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+ transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.loaded #loader-wrapper .loader-section.section-right {
+ -webkit-transform: translateX(100%); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: translateX(100%); /* IE 9 */
+ transform: translateX(100%); /* Firefox 16+, IE 10+, Opera */
+ -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+ transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
+}
+
+.loaded #loader {
+ opacity: 0;
+ -webkit-transition: all 0.3s ease-out;
+ transition: all 0.3s ease-out;
+}
+
+.loaded #loader-wrapper {
+ visibility: hidden;
+ -webkit-transform: translateY(-100%); /* Chrome, Opera 15+, Safari 3.1+ */
+ -ms-transform: translateY(-100%); /* IE 9 */
+ transform: translateY(-100%); /* Firefox 16+, IE 10+, Opera */
+ -webkit-transition: all 0.3s 1s ease-out;
+ transition: all 0.3s 1s ease-out;
+}
diff --git a/public/locationSelect.js b/public/locationSelect.js
new file mode 100644
index 0000000..0ba3c4c
--- /dev/null
+++ b/public/locationSelect.js
@@ -0,0 +1,1066 @@
+let locationSelect = {
+ '19': [
+ {
+ 'label': '广东',
+ 'value': '19',
+ 'parentId': 'root',
+ 'children': [
+ {
+ 'label': '广州市',
+ 'value': '1601',
+ 'parentId': '19',
+ 'children': [
+ {
+ 'label': '白云区',
+ 'value': '50258',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '云城街道',
+ 'value': '129164',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '石门街道',
+ 'value': '129165',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '鹤龙街道',
+ 'value': '129166',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '白云湖街道',
+ 'value': '129167',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '江高镇',
+ 'value': '50373',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '人和镇',
+ 'value': '50374',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '太和镇',
+ 'value': '50375',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '竹料镇',
+ 'value': '50376',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '钟落潭镇',
+ 'value': '50377',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '城区',
+ 'value': '51885',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '三元里街道',
+ 'value': '62833',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '景泰街道',
+ 'value': '62834',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '黄石街道',
+ 'value': '62835',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '棠景街道',
+ 'value': '62836',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '嘉禾街道',
+ 'value': '62837',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '均禾街道',
+ 'value': '62838',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '石井街道',
+ 'value': '62839',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '金沙街道',
+ 'value': '62840',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '松洲街道',
+ 'value': '62855',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '同德街道',
+ 'value': '62856',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '新市街道',
+ 'value': '62857',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '同和街道',
+ 'value': '62858',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '京溪街道',
+ 'value': '62859',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '永平街道',
+ 'value': '62860',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '龙归街道',
+ 'value': '71879',
+ 'parentId': '50258',
+ },
+ {
+ 'label': '大源街道',
+ 'value': '71880',
+ 'parentId': '50258',
+ },
+ ],
+ },
+ {
+ 'label': '天河区',
+ 'value': '3633',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '员村街道',
+ 'value': '63243',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '车陂街道',
+ 'value': '63244',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '五山街道',
+ 'value': '63245',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '沙河街道',
+ 'value': '63246',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '石牌街道',
+ 'value': '63247',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '沙东街道',
+ 'value': '63248',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '天河南街道',
+ 'value': '63249',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '林和街道',
+ 'value': '63250',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '兴华街道',
+ 'value': '63251',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '棠下街道',
+ 'value': '63252',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '冼村街道',
+ 'value': '63253',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '长兴街道',
+ 'value': '63254',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '前进街道',
+ 'value': '63255',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '珠吉街道',
+ 'value': '63256',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '天园街道',
+ 'value': '63257',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '猎德街道',
+ 'value': '63258',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '元岗街道',
+ 'value': '63259',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '黄村街道',
+ 'value': '63260',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '龙洞街道',
+ 'value': '63261',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '凤凰街道',
+ 'value': '63262',
+ 'parentId': '3633',
+ },
+ {
+ 'label': '新塘街道',
+ 'value': '63263',
+ 'parentId': '3633',
+ },
+ ],
+ },
+ {
+ 'label': '海珠区',
+ 'value': '3634',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '赤岗街道',
+ 'value': '63199',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '龙凤街道',
+ 'value': '63200',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '华洲街道',
+ 'value': '63201',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '新港街道',
+ 'value': '63203',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '昌岗街道',
+ 'value': '63204',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '江南中街道',
+ 'value': '63205',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '滨江街道',
+ 'value': '63206',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '素社街道',
+ 'value': '63207',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '海幢街道',
+ 'value': '63208',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '南华西街道',
+ 'value': '63209',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '瑞宝街道',
+ 'value': '63210',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '江海街道',
+ 'value': '63211',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '沙园街道',
+ 'value': '63216',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '南石头街道',
+ 'value': '63217',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '凤阳街道',
+ 'value': '63218',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '琶洲街道',
+ 'value': '63219',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '南洲街道',
+ 'value': '63220',
+ 'parentId': '3634',
+ },
+ {
+ 'label': '官洲街道',
+ 'value': '63221',
+ 'parentId': '3634',
+ },
+ ],
+ },
+ {
+ 'label': '荔湾区',
+ 'value': '3635',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '沙面街道',
+ 'value': '63101',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '岭南街道',
+ 'value': '63102',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '逢源街道',
+ 'value': '63103',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '彩虹街道',
+ 'value': '63104',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '南源街道',
+ 'value': '63105',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '桥中街道',
+ 'value': '63106',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '花地街道',
+ 'value': '63107',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '海龙街道',
+ 'value': '63108',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '中南街道',
+ 'value': '63109',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '华林街道',
+ 'value': '63126',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '多宝街道',
+ 'value': '63127',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '昌华街道',
+ 'value': '63128',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '龙津街道',
+ 'value': '63129',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '金花街道',
+ 'value': '63130',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '西村街道',
+ 'value': '63131',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '站前街道',
+ 'value': '63132',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '白鹤洞街道',
+ 'value': '63133',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '冲口街道',
+ 'value': '63134',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '石围塘街道',
+ 'value': '63135',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '茶滘街道',
+ 'value': '63136',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '东漖街道',
+ 'value': '63137',
+ 'parentId': '3635',
+ },
+ {
+ 'label': '东沙街道',
+ 'value': '63138',
+ 'parentId': '3635',
+ },
+ ],
+ },
+ {
+ 'label': '越秀区',
+ 'value': '3637',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '洪桥街道',
+ 'value': '63154',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '光塔街道',
+ 'value': '63155',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '人民街道',
+ 'value': '63156',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '农林街道',
+ 'value': '63157',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '黄花岗街道',
+ 'value': '63158',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '建设街道',
+ 'value': '63159',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '矿泉街道',
+ 'value': '63160',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '大东街道',
+ 'value': '63168',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '北京街道',
+ 'value': '63177',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '六榕街道',
+ 'value': '63178',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '流花街道',
+ 'value': '63179',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '东山街道',
+ 'value': '63180',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '梅花村街道',
+ 'value': '63181',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '华乐街道',
+ 'value': '63182',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '大塘街道',
+ 'value': '63183',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '珠光街道',
+ 'value': '63184',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '白云街道',
+ 'value': '63185',
+ 'parentId': '3637',
+ },
+ {
+ 'label': '登峰街道',
+ 'value': '63187',
+ 'parentId': '3637',
+ },
+ ],
+ },
+ {
+ 'label': '番禺区',
+ 'value': '36953',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '南村镇',
+ 'value': '50397',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '新造镇',
+ 'value': '50398',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '化龙镇',
+ 'value': '50399',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '石楼镇',
+ 'value': '50400',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '沙湾镇',
+ 'value': '50401',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '石碁镇',
+ 'value': '50402',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '城区',
+ 'value': '51883',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '市桥街道',
+ 'value': '62865',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '沙头街道',
+ 'value': '62866',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '东环街道',
+ 'value': '62867',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '小谷围街道',
+ 'value': '62868',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '大石街道',
+ 'value': '62869',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '洛浦街道',
+ 'value': '62870',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '石壁街道',
+ 'value': '62871',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '桥南街道',
+ 'value': '62891',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '钟村街道',
+ 'value': '62892',
+ 'parentId': '36953',
+ },
+ {
+ 'label': '大龙街道',
+ 'value': '62893',
+ 'parentId': '36953',
+ },
+ ],
+ },
+ {
+ 'label': '花都区',
+ 'value': '50256',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '狮岭镇',
+ 'value': '50414',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '雅瑶镇',
+ 'value': '50415',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '花山镇',
+ 'value': '50416',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '花东镇',
+ 'value': '50417',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '炭步镇',
+ 'value': '50418',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '梯面镇',
+ 'value': '50419',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '赤坭镇',
+ 'value': '50420',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '白云国际机场',
+ 'value': '50421',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '城区',
+ 'value': '51884',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '花城街道',
+ 'value': '62876',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '新华街道',
+ 'value': '62894',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '秀全街道',
+ 'value': '62900',
+ 'parentId': '50256',
+ },
+ {
+ 'label': '新雅街道',
+ 'value': '62901',
+ 'parentId': '50256',
+ },
+ ],
+ },
+ {
+ 'label': '南沙区',
+ 'value': '50259',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '黄阁镇',
+ 'value': '50423',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '东涌镇',
+ 'value': '50424',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '大岗镇',
+ 'value': '50425',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '榄核镇',
+ 'value': '50426',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '横沥镇',
+ 'value': '50427',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '万顷沙镇',
+ 'value': '50430',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '城区',
+ 'value': '51886',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '龙穴街道',
+ 'value': '52680',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '南沙街道',
+ 'value': '62914',
+ 'parentId': '50259',
+ },
+ {
+ 'label': '珠江街道',
+ 'value': '62915',
+ 'parentId': '50259',
+ },
+ ],
+ },
+ {
+ 'label': '黄埔区',
+ 'value': '50283',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '长岭街道',
+ 'value': '129162',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '云埔街道',
+ 'value': '129163',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '长洲街道',
+ 'value': '50386',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '城区',
+ 'value': '51887',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '永和街道',
+ 'value': '53526',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '联和街道',
+ 'value': '62861',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '文冲街道',
+ 'value': '62862',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '南岗街道',
+ 'value': '62863',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '萝岗街道',
+ 'value': '62864',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '黄埔街道',
+ 'value': '62883',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '红山街道',
+ 'value': '62884',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '鱼珠街道',
+ 'value': '62885',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '大沙街道',
+ 'value': '62886',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '穗东街道',
+ 'value': '62887',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '荔联街道',
+ 'value': '62888',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '夏港街道',
+ 'value': '62889',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '东区街道',
+ 'value': '62890',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '九佛街道',
+ 'value': '71656',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '龙湖街道',
+ 'value': '71661',
+ 'parentId': '50283',
+ },
+ {
+ 'label': '新龙镇',
+ 'value': '71662',
+ 'parentId': '50283',
+ },
+ ],
+ },
+ {
+ 'label': '增城区',
+ 'value': '50284',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '朱村街道',
+ 'value': '50447',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '新塘镇',
+ 'value': '50448',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '小楼镇',
+ 'value': '50449',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '石滩镇',
+ 'value': '50450',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '中新镇',
+ 'value': '50451',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '正果镇',
+ 'value': '50452',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '派潭镇',
+ 'value': '50453',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '宁西街道',
+ 'value': '51055',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '仙村镇',
+ 'value': '51056',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '城区',
+ 'value': '52086',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '增江街道',
+ 'value': '62875',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '荔城街道',
+ 'value': '62897',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '永宁街道',
+ 'value': '62898',
+ 'parentId': '50284',
+ },
+ {
+ 'label': '荔湖街道',
+ 'value': '62899',
+ 'parentId': '50284',
+ },
+ ],
+ },
+ {
+ 'label': '从化区',
+ 'value': '50285',
+ 'parentId': '1601',
+ 'children': [
+ {
+ 'label': '太平镇',
+ 'value': '50466',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '神岗镇',
+ 'value': '50467',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '温泉镇',
+ 'value': '50468',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '良口镇',
+ 'value': '50469',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '吕田镇',
+ 'value': '50470',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '鳌头镇',
+ 'value': '50471',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '龙潭镇',
+ 'value': '51057',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '东明镇',
+ 'value': '51058',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '城区',
+ 'value': '51382',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '街口街道',
+ 'value': '62872',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '流溪河林场',
+ 'value': '62873',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '黄龙带水库管理处',
+ 'value': '62874',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '江埔街道',
+ 'value': '62895',
+ 'parentId': '50285',
+ },
+ {
+ 'label': '城郊街道',
+ 'value': '62896',
+ 'parentId': '50285',
+ },
+ ],
+ },
+ {
+ 'label': '广州大学城',
+ 'value': '51091',
+ 'parentId': '1601',
+ 'children': null,
+ },
+ ],
+ },
+ ],
+ },
+ ],
+};
diff --git a/public/manifest.json b/public/manifest.json
new file mode 100644
index 0000000..080d6c7
--- /dev/null
+++ b/public/manifest.json
@@ -0,0 +1,25 @@
+{
+ "short_name": "React App",
+ "name": "Create React App Sample",
+ "icons": [
+ {
+ "src": "favicon.ico",
+ "sizes": "64x64 32x32 24x24 16x16",
+ "type": "image/x-icon"
+ },
+ {
+ "src": "logo192.png",
+ "type": "image/png",
+ "sizes": "192x192"
+ },
+ {
+ "src": "logo512.png",
+ "type": "image/png",
+ "sizes": "512x512"
+ }
+ ],
+ "start_url": ".",
+ "display": "standalone",
+ "theme_color": "#000000",
+ "background_color": "#ffffff"
+}
diff --git a/public/regionData.js b/public/regionData.js
new file mode 100644
index 0000000..00a6054
--- /dev/null
+++ b/public/regionData.js
@@ -0,0 +1,15019 @@
+let regionData = [
+ {
+ label: '海南省',
+ value: '460000',
+ children: [
+ {
+ label: '海口市',
+ value: '460100',
+ children: [
+ {
+ label: '市辖区',
+ value: '460101',
+ },
+ {
+ label: '秀英区',
+ value: '460105',
+ },
+ {
+ label: '龙华区',
+ value: '460106',
+ },
+ {
+ label: '琼山区',
+ value: '460107',
+ },
+ {
+ label: '美兰区',
+ value: '460108',
+ },
+ ],
+ },
+ {
+ label: '三亚市',
+ value: '460200',
+ children: [
+ {
+ label: '市辖区',
+ value: '460201',
+ },
+ {
+ label: '海棠区',
+ value: '460202',
+ },
+ {
+ label: '吉阳区',
+ value: '460203',
+ },
+ {
+ label: '天涯区',
+ value: '460204',
+ },
+ {
+ label: '崖州区',
+ value: '460205',
+ },
+ ],
+ },
+ {
+ label: '三沙市',
+ value: '460300',
+ children: [],
+ },
+ {
+ label: '儋州市',
+ value: '460400',
+ children: [],
+ },
+ {
+ label: '省直辖县级行政区划',
+ value: '469000',
+ children: [
+ {
+ label: '五指山市',
+ value: '469001',
+ },
+ {
+ label: '琼海市',
+ value: '469002',
+ },
+ {
+ label: '文昌市',
+ value: '469005',
+ },
+ {
+ label: '万宁市',
+ value: '469006',
+ },
+ {
+ label: '东方市',
+ value: '469007',
+ },
+ {
+ label: '定安县',
+ value: '469021',
+ },
+ {
+ label: '屯昌县',
+ value: '469022',
+ },
+ {
+ label: '澄迈县',
+ value: '469023',
+ },
+ {
+ label: '临高县',
+ value: '469024',
+ },
+ {
+ label: '白沙黎族自治县',
+ value: '469025',
+ },
+ {
+ label: '昌江黎族自治县',
+ value: '469026',
+ },
+ {
+ label: '乐东黎族自治县',
+ value: '469027',
+ },
+ {
+ label: '陵水黎族自治县',
+ value: '469028',
+ },
+ {
+ label: '保亭黎族苗族自治县',
+ value: '469029',
+ },
+ {
+ label: '琼中黎族苗族自治县',
+ value: '469030',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '广东省',
+ value: '440000',
+ children: [
+ {
+ label: '广州市',
+ value: '440100',
+ children: [
+ {
+ label: '市辖区',
+ value: '440101',
+ },
+ {
+ label: '荔湾区',
+ value: '440103',
+ },
+ {
+ label: '越秀区',
+ value: '440104',
+ },
+ {
+ label: '海珠区',
+ value: '440105',
+ },
+ {
+ label: '天河区',
+ value: '440106',
+ },
+ {
+ label: '白云区',
+ value: '440111',
+ },
+ {
+ label: '黄埔区',
+ value: '440112',
+ },
+ {
+ label: '番禺区',
+ value: '440113',
+ },
+ {
+ label: '花都区',
+ value: '440114',
+ },
+ {
+ label: '南沙区',
+ value: '440115',
+ },
+ {
+ label: '从化区',
+ value: '440117',
+ },
+ {
+ label: '增城区',
+ value: '440118',
+ },
+ ],
+ },
+ {
+ label: '韶关市',
+ value: '440200',
+ children: [
+ {
+ label: '市辖区',
+ value: '440201',
+ },
+ {
+ label: '武江区',
+ value: '440203',
+ },
+ {
+ label: '浈江区',
+ value: '440204',
+ },
+ {
+ label: '曲江区',
+ value: '440205',
+ },
+ {
+ label: '始兴县',
+ value: '440222',
+ },
+ {
+ label: '仁化县',
+ value: '440224',
+ },
+ {
+ label: '翁源县',
+ value: '440229',
+ },
+ {
+ label: '乳源瑶族自治县',
+ value: '440232',
+ },
+ {
+ label: '新丰县',
+ value: '440233',
+ },
+ {
+ label: '乐昌市',
+ value: '440281',
+ },
+ {
+ label: '南雄市',
+ value: '440282',
+ },
+ ],
+ },
+ {
+ label: '深圳市',
+ value: '440300',
+ children: [
+ {
+ label: '市辖区',
+ value: '440301',
+ },
+ {
+ label: '罗湖区',
+ value: '440303',
+ },
+ {
+ label: '福田区',
+ value: '440304',
+ },
+ {
+ label: '南山区',
+ value: '440305',
+ },
+ {
+ label: '宝安区',
+ value: '440306',
+ },
+ {
+ label: '龙岗区',
+ value: '440307',
+ },
+ {
+ label: '盐田区',
+ value: '440308',
+ },
+ ],
+ },
+ {
+ label: '珠海市',
+ value: '440400',
+ children: [
+ {
+ label: '市辖区',
+ value: '440401',
+ },
+ {
+ label: '香洲区',
+ value: '440402',
+ },
+ {
+ label: '斗门区',
+ value: '440403',
+ },
+ {
+ label: '金湾区',
+ value: '440404',
+ },
+ ],
+ },
+ {
+ label: '汕头市',
+ value: '440500',
+ children: [
+ {
+ label: '市辖区',
+ value: '440501',
+ },
+ {
+ label: '龙湖区',
+ value: '440507',
+ },
+ {
+ label: '金平区',
+ value: '440511',
+ },
+ {
+ label: '濠江区',
+ value: '440512',
+ },
+ {
+ label: '潮阳区',
+ value: '440513',
+ },
+ {
+ label: '潮南区',
+ value: '440514',
+ },
+ {
+ label: '澄海区',
+ value: '440515',
+ },
+ {
+ label: '南澳县',
+ value: '440523',
+ },
+ ],
+ },
+ {
+ label: '佛山市',
+ value: '440600',
+ children: [
+ {
+ label: '市辖区',
+ value: '440601',
+ },
+ {
+ label: '禅城区',
+ value: '440604',
+ },
+ {
+ label: '南海区',
+ value: '440605',
+ },
+ {
+ label: '顺德区',
+ value: '440606',
+ },
+ {
+ label: '三水区',
+ value: '440607',
+ },
+ {
+ label: '高明区',
+ value: '440608',
+ },
+ ],
+ },
+ {
+ label: '江门市',
+ value: '440700',
+ children: [
+ {
+ label: '市辖区',
+ value: '440701',
+ },
+ {
+ label: '蓬江区',
+ value: '440703',
+ },
+ {
+ label: '江海区',
+ value: '440704',
+ },
+ {
+ label: '新会区',
+ value: '440705',
+ },
+ {
+ label: '台山市',
+ value: '440781',
+ },
+ {
+ label: '开平市',
+ value: '440783',
+ },
+ {
+ label: '鹤山市',
+ value: '440784',
+ },
+ {
+ label: '恩平市',
+ value: '440785',
+ },
+ ],
+ },
+ {
+ label: '湛江市',
+ value: '440800',
+ children: [
+ {
+ label: '市辖区',
+ value: '440801',
+ },
+ {
+ label: '赤坎区',
+ value: '440802',
+ },
+ {
+ label: '霞山区',
+ value: '440803',
+ },
+ {
+ label: '坡头区',
+ value: '440804',
+ },
+ {
+ label: '麻章区',
+ value: '440811',
+ },
+ {
+ label: '遂溪县',
+ value: '440823',
+ },
+ {
+ label: '徐闻县',
+ value: '440825',
+ },
+ {
+ label: '廉江市',
+ value: '440881',
+ },
+ {
+ label: '雷州市',
+ value: '440882',
+ },
+ {
+ label: '吴川市',
+ value: '440883',
+ },
+ ],
+ },
+ {
+ label: '茂名市',
+ value: '440900',
+ children: [
+ {
+ label: '市辖区',
+ value: '440901',
+ },
+ {
+ label: '茂南区',
+ value: '440902',
+ },
+ {
+ label: '电白区',
+ value: '440904',
+ },
+ {
+ label: '高州市',
+ value: '440981',
+ },
+ {
+ label: '化州市',
+ value: '440982',
+ },
+ {
+ label: '信宜市',
+ value: '440983',
+ },
+ ],
+ },
+ {
+ label: '肇庆市',
+ value: '441200',
+ children: [
+ {
+ label: '市辖区',
+ value: '441201',
+ },
+ {
+ label: '端州区',
+ value: '441202',
+ },
+ {
+ label: '鼎湖区',
+ value: '441203',
+ },
+ {
+ label: '高要区',
+ value: '441204',
+ },
+ {
+ label: '广宁县',
+ value: '441223',
+ },
+ {
+ label: '怀集县',
+ value: '441224',
+ },
+ {
+ label: '封开县',
+ value: '441225',
+ },
+ {
+ label: '德庆县',
+ value: '441226',
+ },
+ {
+ label: '四会市',
+ value: '441284',
+ },
+ ],
+ },
+ {
+ label: '惠州市',
+ value: '441300',
+ children: [
+ {
+ label: '市辖区',
+ value: '441301',
+ },
+ {
+ label: '惠城区',
+ value: '441302',
+ },
+ {
+ label: '惠阳区',
+ value: '441303',
+ },
+ {
+ label: '博罗县',
+ value: '441322',
+ },
+ {
+ label: '惠东县',
+ value: '441323',
+ },
+ {
+ label: '龙门县',
+ value: '441324',
+ },
+ ],
+ },
+ {
+ label: '梅州市',
+ value: '441400',
+ children: [
+ {
+ label: '市辖区',
+ value: '441401',
+ },
+ {
+ label: '梅江区',
+ value: '441402',
+ },
+ {
+ label: '梅县区',
+ value: '441403',
+ },
+ {
+ label: '大埔县',
+ value: '441422',
+ },
+ {
+ label: '丰顺县',
+ value: '441423',
+ },
+ {
+ label: '五华县',
+ value: '441424',
+ },
+ {
+ label: '平远县',
+ value: '441426',
+ },
+ {
+ label: '蕉岭县',
+ value: '441427',
+ },
+ {
+ label: '兴宁市',
+ value: '441481',
+ },
+ ],
+ },
+ {
+ label: '汕尾市',
+ value: '441500',
+ children: [
+ {
+ label: '市辖区',
+ value: '441501',
+ },
+ {
+ label: '城区',
+ value: '441502',
+ },
+ {
+ label: '海丰县',
+ value: '441521',
+ },
+ {
+ label: '陆河县',
+ value: '441523',
+ },
+ {
+ label: '陆丰市',
+ value: '441581',
+ },
+ ],
+ },
+ {
+ label: '河源市',
+ value: '441600',
+ children: [
+ {
+ label: '市辖区',
+ value: '441601',
+ },
+ {
+ label: '源城区',
+ value: '441602',
+ },
+ {
+ label: '紫金县',
+ value: '441621',
+ },
+ {
+ label: '龙川县',
+ value: '441622',
+ },
+ {
+ label: '连平县',
+ value: '441623',
+ },
+ {
+ label: '和平县',
+ value: '441624',
+ },
+ {
+ label: '东源县',
+ value: '441625',
+ },
+ ],
+ },
+ {
+ label: '阳江市',
+ value: '441700',
+ children: [
+ {
+ label: '市辖区',
+ value: '441701',
+ },
+ {
+ label: '江城区',
+ value: '441702',
+ },
+ {
+ label: '阳东区',
+ value: '441704',
+ },
+ {
+ label: '阳西县',
+ value: '441721',
+ },
+ {
+ label: '阳春市',
+ value: '441781',
+ },
+ ],
+ },
+ {
+ label: '清远市',
+ value: '441800',
+ children: [
+ {
+ label: '市辖区',
+ value: '441801',
+ },
+ {
+ label: '清城区',
+ value: '441802',
+ },
+ {
+ label: '清新区',
+ value: '441803',
+ },
+ {
+ label: '佛冈县',
+ value: '441821',
+ },
+ {
+ label: '阳山县',
+ value: '441823',
+ },
+ {
+ label: '连山壮族瑶族自治县',
+ value: '441825',
+ },
+ {
+ label: '连南瑶族自治县',
+ value: '441826',
+ },
+ {
+ label: '英德市',
+ value: '441881',
+ },
+ {
+ label: '连州市',
+ value: '441882',
+ },
+ ],
+ },
+ {
+ label: '东莞市',
+ value: '441900',
+ children: [],
+ },
+ {
+ label: '中山市',
+ value: '442000',
+ children: [],
+ },
+ {
+ label: '潮州市',
+ value: '445100',
+ children: [
+ {
+ label: '市辖区',
+ value: '445101',
+ },
+ {
+ label: '湘桥区',
+ value: '445102',
+ },
+ {
+ label: '潮安区',
+ value: '445103',
+ },
+ {
+ label: '饶平县',
+ value: '445122',
+ },
+ ],
+ },
+ {
+ label: '揭阳市',
+ value: '445200',
+ children: [
+ {
+ label: '市辖区',
+ value: '445201',
+ },
+ {
+ label: '榕城区',
+ value: '445202',
+ },
+ {
+ label: '揭东区',
+ value: '445203',
+ },
+ {
+ label: '揭西县',
+ value: '445222',
+ },
+ {
+ label: '惠来县',
+ value: '445224',
+ },
+ {
+ label: '普宁市',
+ value: '445281',
+ },
+ ],
+ },
+ {
+ label: '云浮市',
+ value: '445300',
+ children: [
+ {
+ label: '市辖区',
+ value: '445301',
+ },
+ {
+ label: '云城区',
+ value: '445302',
+ },
+ {
+ label: '云安区',
+ value: '445303',
+ },
+ {
+ label: '新兴县',
+ value: '445321',
+ },
+ {
+ label: '郁南县',
+ value: '445322',
+ },
+ {
+ label: '罗定市',
+ value: '445381',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '广西壮族自治区',
+ value: '450000',
+ children: [
+ {
+ label: '南宁市',
+ value: '450100',
+ children: [
+ {
+ label: '市辖区',
+ value: '450101',
+ },
+ {
+ label: '兴宁区',
+ value: '450102',
+ },
+ {
+ label: '青秀区',
+ value: '450103',
+ },
+ {
+ label: '江南区',
+ value: '450105',
+ },
+ {
+ label: '西乡塘区',
+ value: '450107',
+ },
+ {
+ label: '良庆区',
+ value: '450108',
+ },
+ {
+ label: '邕宁区',
+ value: '450109',
+ },
+ {
+ label: '武鸣区',
+ value: '450110',
+ },
+ {
+ label: '隆安县',
+ value: '450123',
+ },
+ {
+ label: '马山县',
+ value: '450124',
+ },
+ {
+ label: '上林县',
+ value: '450125',
+ },
+ {
+ label: '宾阳县',
+ value: '450126',
+ },
+ {
+ label: '横县',
+ value: '450127',
+ },
+ ],
+ },
+ {
+ label: '柳州市',
+ value: '450200',
+ children: [
+ {
+ label: '市辖区',
+ value: '450201',
+ },
+ {
+ label: '城中区',
+ value: '450202',
+ },
+ {
+ label: '鱼峰区',
+ value: '450203',
+ },
+ {
+ label: '柳南区',
+ value: '450204',
+ },
+ {
+ label: '柳北区',
+ value: '450205',
+ },
+ {
+ label: '柳江区',
+ value: '450206',
+ },
+ {
+ label: '柳城县',
+ value: '450222',
+ },
+ {
+ label: '鹿寨县',
+ value: '450223',
+ },
+ {
+ label: '融安县',
+ value: '450224',
+ },
+ {
+ label: '融水苗族自治县',
+ value: '450225',
+ },
+ {
+ label: '三江侗族自治县',
+ value: '450226',
+ },
+ ],
+ },
+ {
+ label: '桂林市',
+ value: '450300',
+ children: [
+ {
+ label: '市辖区',
+ value: '450301',
+ },
+ {
+ label: '秀峰区',
+ value: '450302',
+ },
+ {
+ label: '叠彩区',
+ value: '450303',
+ },
+ {
+ label: '象山区',
+ value: '450304',
+ },
+ {
+ label: '七星区',
+ value: '450305',
+ },
+ {
+ label: '雁山区',
+ value: '450311',
+ },
+ {
+ label: '临桂区',
+ value: '450312',
+ },
+ {
+ label: '阳朔县',
+ value: '450321',
+ },
+ {
+ label: '灵川县',
+ value: '450323',
+ },
+ {
+ label: '全州县',
+ value: '450324',
+ },
+ {
+ label: '兴安县',
+ value: '450325',
+ },
+ {
+ label: '永福县',
+ value: '450326',
+ },
+ {
+ label: '灌阳县',
+ value: '450327',
+ },
+ {
+ label: '龙胜各族自治县',
+ value: '450328',
+ },
+ {
+ label: '资源县',
+ value: '450329',
+ },
+ {
+ label: '平乐县',
+ value: '450330',
+ },
+ {
+ label: '荔浦县',
+ value: '450331',
+ },
+ {
+ label: '恭城瑶族自治县',
+ value: '450332',
+ },
+ ],
+ },
+ {
+ label: '梧州市',
+ value: '450400',
+ children: [
+ {
+ label: '市辖区',
+ value: '450401',
+ },
+ {
+ label: '万秀区',
+ value: '450403',
+ },
+ {
+ label: '长洲区',
+ value: '450405',
+ },
+ {
+ label: '龙圩区',
+ value: '450406',
+ },
+ {
+ label: '苍梧县',
+ value: '450421',
+ },
+ {
+ label: '藤县',
+ value: '450422',
+ },
+ {
+ label: '蒙山县',
+ value: '450423',
+ },
+ {
+ label: '岑溪市',
+ value: '450481',
+ },
+ ],
+ },
+ {
+ label: '北海市',
+ value: '450500',
+ children: [
+ {
+ label: '市辖区',
+ value: '450501',
+ },
+ {
+ label: '海城区',
+ value: '450502',
+ },
+ {
+ label: '银海区',
+ value: '450503',
+ },
+ {
+ label: '铁山港区',
+ value: '450512',
+ },
+ {
+ label: '合浦县',
+ value: '450521',
+ },
+ ],
+ },
+ {
+ label: '防城港市',
+ value: '450600',
+ children: [
+ {
+ label: '市辖区',
+ value: '450601',
+ },
+ {
+ label: '港口区',
+ value: '450602',
+ },
+ {
+ label: '防城区',
+ value: '450603',
+ },
+ {
+ label: '上思县',
+ value: '450621',
+ },
+ {
+ label: '东兴市',
+ value: '450681',
+ },
+ ],
+ },
+ {
+ label: '钦州市',
+ value: '450700',
+ children: [
+ {
+ label: '市辖区',
+ value: '450701',
+ },
+ {
+ label: '钦南区',
+ value: '450702',
+ },
+ {
+ label: '钦北区',
+ value: '450703',
+ },
+ {
+ label: '灵山县',
+ value: '450721',
+ },
+ {
+ label: '浦北县',
+ value: '450722',
+ },
+ ],
+ },
+ {
+ label: '贵港市',
+ value: '450800',
+ children: [
+ {
+ label: '市辖区',
+ value: '450801',
+ },
+ {
+ label: '港北区',
+ value: '450802',
+ },
+ {
+ label: '港南区',
+ value: '450803',
+ },
+ {
+ label: '覃塘区',
+ value: '450804',
+ },
+ {
+ label: '平南县',
+ value: '450821',
+ },
+ {
+ label: '桂平市',
+ value: '450881',
+ },
+ ],
+ },
+ {
+ label: '玉林市',
+ value: '450900',
+ children: [
+ {
+ label: '市辖区',
+ value: '450901',
+ },
+ {
+ label: '玉州区',
+ value: '450902',
+ },
+ {
+ label: '福绵区',
+ value: '450903',
+ },
+ {
+ label: '容县',
+ value: '450921',
+ },
+ {
+ label: '陆川县',
+ value: '450922',
+ },
+ {
+ label: '博白县',
+ value: '450923',
+ },
+ {
+ label: '兴业县',
+ value: '450924',
+ },
+ {
+ label: '北流市',
+ value: '450981',
+ },
+ ],
+ },
+ {
+ label: '百色市',
+ value: '451000',
+ children: [
+ {
+ label: '市辖区',
+ value: '451001',
+ },
+ {
+ label: '右江区',
+ value: '451002',
+ },
+ {
+ label: '田阳县',
+ value: '451021',
+ },
+ {
+ label: '田东县',
+ value: '451022',
+ },
+ {
+ label: '平果县',
+ value: '451023',
+ },
+ {
+ label: '德保县',
+ value: '451024',
+ },
+ {
+ label: '那坡县',
+ value: '451026',
+ },
+ {
+ label: '凌云县',
+ value: '451027',
+ },
+ {
+ label: '乐业县',
+ value: '451028',
+ },
+ {
+ label: '田林县',
+ value: '451029',
+ },
+ {
+ label: '西林县',
+ value: '451030',
+ },
+ {
+ label: '隆林各族自治县',
+ value: '451031',
+ },
+ {
+ label: '靖西市',
+ value: '451081',
+ },
+ ],
+ },
+ {
+ label: '贺州市',
+ value: '451100',
+ children: [
+ {
+ label: '市辖区',
+ value: '451101',
+ },
+ {
+ label: '八步区',
+ value: '451102',
+ },
+ {
+ label: '平桂区',
+ value: '451103',
+ },
+ {
+ label: '昭平县',
+ value: '451121',
+ },
+ {
+ label: '钟山县',
+ value: '451122',
+ },
+ {
+ label: '富川瑶族自治县',
+ value: '451123',
+ },
+ ],
+ },
+ {
+ label: '河池市',
+ value: '451200',
+ children: [
+ {
+ label: '市辖区',
+ value: '451201',
+ },
+ {
+ label: '金城江区',
+ value: '451202',
+ },
+ {
+ label: '南丹县',
+ value: '451221',
+ },
+ {
+ label: '天峨县',
+ value: '451222',
+ },
+ {
+ label: '凤山县',
+ value: '451223',
+ },
+ {
+ label: '东兰县',
+ value: '451224',
+ },
+ {
+ label: '罗城仫佬族自治县',
+ value: '451225',
+ },
+ {
+ label: '环江毛南族自治县',
+ value: '451226',
+ },
+ {
+ label: '巴马瑶族自治县',
+ value: '451227',
+ },
+ {
+ label: '都安瑶族自治县',
+ value: '451228',
+ },
+ {
+ label: '大化瑶族自治县',
+ value: '451229',
+ },
+ {
+ label: '宜州市',
+ value: '451281',
+ },
+ ],
+ },
+ {
+ label: '来宾市',
+ value: '451300',
+ children: [
+ {
+ label: '市辖区',
+ value: '451301',
+ },
+ {
+ label: '兴宾区',
+ value: '451302',
+ },
+ {
+ label: '忻城县',
+ value: '451321',
+ },
+ {
+ label: '象州县',
+ value: '451322',
+ },
+ {
+ label: '武宣县',
+ value: '451323',
+ },
+ {
+ label: '金秀瑶族自治县',
+ value: '451324',
+ },
+ {
+ label: '合山市',
+ value: '451381',
+ },
+ ],
+ },
+ {
+ label: '崇左市',
+ value: '451400',
+ children: [
+ {
+ label: '市辖区',
+ value: '451401',
+ },
+ {
+ label: '江州区',
+ value: '451402',
+ },
+ {
+ label: '扶绥县',
+ value: '451421',
+ },
+ {
+ label: '宁明县',
+ value: '451422',
+ },
+ {
+ label: '龙州县',
+ value: '451423',
+ },
+ {
+ label: '大新县',
+ value: '451424',
+ },
+ {
+ label: '天等县',
+ value: '451425',
+ },
+ {
+ label: '凭祥市',
+ value: '451481',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '四川省',
+ value: '510000',
+ children: [
+ {
+ label: '成都市',
+ value: '510100',
+ children: [
+ {
+ label: '市辖区',
+ value: '510101',
+ },
+ {
+ label: '锦江区',
+ value: '510104',
+ },
+ {
+ label: '青羊区',
+ value: '510105',
+ },
+ {
+ label: '金牛区',
+ value: '510106',
+ },
+ {
+ label: '武侯区',
+ value: '510107',
+ },
+ {
+ label: '成华区',
+ value: '510108',
+ },
+ {
+ label: '龙泉驿区',
+ value: '510112',
+ },
+ {
+ label: '青白江区',
+ value: '510113',
+ },
+ {
+ label: '新都区',
+ value: '510114',
+ },
+ {
+ label: '温江区',
+ value: '510115',
+ },
+ {
+ label: '双流区',
+ value: '510116',
+ },
+ {
+ label: '金堂县',
+ value: '510121',
+ },
+ {
+ label: '郫县',
+ value: '510124',
+ },
+ {
+ label: '大邑县',
+ value: '510129',
+ },
+ {
+ label: '蒲江县',
+ value: '510131',
+ },
+ {
+ label: '新津县',
+ value: '510132',
+ },
+ {
+ label: '都江堰市',
+ value: '510181',
+ },
+ {
+ label: '彭州市',
+ value: '510182',
+ },
+ {
+ label: '邛崃市',
+ value: '510183',
+ },
+ {
+ label: '崇州市',
+ value: '510184',
+ },
+ {
+ label: '简阳市',
+ value: '510185',
+ },
+ ],
+ },
+ {
+ label: '自贡市',
+ value: '510300',
+ children: [
+ {
+ label: '市辖区',
+ value: '510301',
+ },
+ {
+ label: '自流井区',
+ value: '510302',
+ },
+ {
+ label: '贡井区',
+ value: '510303',
+ },
+ {
+ label: '大安区',
+ value: '510304',
+ },
+ {
+ label: '沿滩区',
+ value: '510311',
+ },
+ {
+ label: '荣县',
+ value: '510321',
+ },
+ {
+ label: '富顺县',
+ value: '510322',
+ },
+ ],
+ },
+ {
+ label: '攀枝花市',
+ value: '510400',
+ children: [
+ {
+ label: '市辖区',
+ value: '510401',
+ },
+ {
+ label: '东区',
+ value: '510402',
+ },
+ {
+ label: '西区',
+ value: '510403',
+ },
+ {
+ label: '仁和区',
+ value: '510411',
+ },
+ {
+ label: '米易县',
+ value: '510421',
+ },
+ {
+ label: '盐边县',
+ value: '510422',
+ },
+ ],
+ },
+ {
+ label: '泸州市',
+ value: '510500',
+ children: [
+ {
+ label: '市辖区',
+ value: '510501',
+ },
+ {
+ label: '江阳区',
+ value: '510502',
+ },
+ {
+ label: '纳溪区',
+ value: '510503',
+ },
+ {
+ label: '龙马潭区',
+ value: '510504',
+ },
+ {
+ label: '泸县',
+ value: '510521',
+ },
+ {
+ label: '合江县',
+ value: '510522',
+ },
+ {
+ label: '叙永县',
+ value: '510524',
+ },
+ {
+ label: '古蔺县',
+ value: '510525',
+ },
+ ],
+ },
+ {
+ label: '德阳市',
+ value: '510600',
+ children: [
+ {
+ label: '市辖区',
+ value: '510601',
+ },
+ {
+ label: '旌阳区',
+ value: '510603',
+ },
+ {
+ label: '中江县',
+ value: '510623',
+ },
+ {
+ label: '罗江县',
+ value: '510626',
+ },
+ {
+ label: '广汉市',
+ value: '510681',
+ },
+ {
+ label: '什邡市',
+ value: '510682',
+ },
+ {
+ label: '绵竹市',
+ value: '510683',
+ },
+ ],
+ },
+ {
+ label: '绵阳市',
+ value: '510700',
+ children: [
+ {
+ label: '市辖区',
+ value: '510701',
+ },
+ {
+ label: '涪城区',
+ value: '510703',
+ },
+ {
+ label: '游仙区',
+ value: '510704',
+ },
+ {
+ label: '安州区',
+ value: '510705',
+ },
+ {
+ label: '三台县',
+ value: '510722',
+ },
+ {
+ label: '盐亭县',
+ value: '510723',
+ },
+ {
+ label: '梓潼县',
+ value: '510725',
+ },
+ {
+ label: '北川羌族自治县',
+ value: '510726',
+ },
+ {
+ label: '平武县',
+ value: '510727',
+ },
+ {
+ label: '江油市',
+ value: '510781',
+ },
+ ],
+ },
+ {
+ label: '广元市',
+ value: '510800',
+ children: [
+ {
+ label: '市辖区',
+ value: '510801',
+ },
+ {
+ label: '利州区',
+ value: '510802',
+ },
+ {
+ label: '昭化区',
+ value: '510811',
+ },
+ {
+ label: '朝天区',
+ value: '510812',
+ },
+ {
+ label: '旺苍县',
+ value: '510821',
+ },
+ {
+ label: '青川县',
+ value: '510822',
+ },
+ {
+ label: '剑阁县',
+ value: '510823',
+ },
+ {
+ label: '苍溪县',
+ value: '510824',
+ },
+ ],
+ },
+ {
+ label: '遂宁市',
+ value: '510900',
+ children: [
+ {
+ label: '市辖区',
+ value: '510901',
+ },
+ {
+ label: '船山区',
+ value: '510903',
+ },
+ {
+ label: '安居区',
+ value: '510904',
+ },
+ {
+ label: '蓬溪县',
+ value: '510921',
+ },
+ {
+ label: '射洪县',
+ value: '510922',
+ },
+ {
+ label: '大英县',
+ value: '510923',
+ },
+ ],
+ },
+ {
+ label: '内江市',
+ value: '511000',
+ children: [
+ {
+ label: '市辖区',
+ value: '511001',
+ },
+ {
+ label: '市中区',
+ value: '511002',
+ },
+ {
+ label: '东兴区',
+ value: '511011',
+ },
+ {
+ label: '威远县',
+ value: '511024',
+ },
+ {
+ label: '资中县',
+ value: '511025',
+ },
+ {
+ label: '隆昌县',
+ value: '511028',
+ },
+ ],
+ },
+ {
+ label: '乐山市',
+ value: '511100',
+ children: [
+ {
+ label: '市辖区',
+ value: '511101',
+ },
+ {
+ label: '市中区',
+ value: '511102',
+ },
+ {
+ label: '沙湾区',
+ value: '511111',
+ },
+ {
+ label: '五通桥区',
+ value: '511112',
+ },
+ {
+ label: '金口河区',
+ value: '511113',
+ },
+ {
+ label: '犍为县',
+ value: '511123',
+ },
+ {
+ label: '井研县',
+ value: '511124',
+ },
+ {
+ label: '夹江县',
+ value: '511126',
+ },
+ {
+ label: '沐川县',
+ value: '511129',
+ },
+ {
+ label: '峨边彝族自治县',
+ value: '511132',
+ },
+ {
+ label: '马边彝族自治县',
+ value: '511133',
+ },
+ {
+ label: '峨眉山市',
+ value: '511181',
+ },
+ ],
+ },
+ {
+ label: '南充市',
+ value: '511300',
+ children: [
+ {
+ label: '市辖区',
+ value: '511301',
+ },
+ {
+ label: '顺庆区',
+ value: '511302',
+ },
+ {
+ label: '高坪区',
+ value: '511303',
+ },
+ {
+ label: '嘉陵区',
+ value: '511304',
+ },
+ {
+ label: '南部县',
+ value: '511321',
+ },
+ {
+ label: '营山县',
+ value: '511322',
+ },
+ {
+ label: '蓬安县',
+ value: '511323',
+ },
+ {
+ label: '仪陇县',
+ value: '511324',
+ },
+ {
+ label: '西充县',
+ value: '511325',
+ },
+ {
+ label: '阆中市',
+ value: '511381',
+ },
+ ],
+ },
+ {
+ label: '眉山市',
+ value: '511400',
+ children: [
+ {
+ label: '市辖区',
+ value: '511401',
+ },
+ {
+ label: '东坡区',
+ value: '511402',
+ },
+ {
+ label: '彭山区',
+ value: '511403',
+ },
+ {
+ label: '仁寿县',
+ value: '511421',
+ },
+ {
+ label: '洪雅县',
+ value: '511423',
+ },
+ {
+ label: '丹棱县',
+ value: '511424',
+ },
+ {
+ label: '青神县',
+ value: '511425',
+ },
+ ],
+ },
+ {
+ label: '宜宾市',
+ value: '511500',
+ children: [
+ {
+ label: '市辖区',
+ value: '511501',
+ },
+ {
+ label: '翠屏区',
+ value: '511502',
+ },
+ {
+ label: '南溪区',
+ value: '511503',
+ },
+ {
+ label: '宜宾县',
+ value: '511521',
+ },
+ {
+ label: '江安县',
+ value: '511523',
+ },
+ {
+ label: '长宁县',
+ value: '511524',
+ },
+ {
+ label: '高县',
+ value: '511525',
+ },
+ {
+ label: '珙县',
+ value: '511526',
+ },
+ {
+ label: '筠连县',
+ value: '511527',
+ },
+ {
+ label: '兴文县',
+ value: '511528',
+ },
+ {
+ label: '屏山县',
+ value: '511529',
+ },
+ ],
+ },
+ {
+ label: '广安市',
+ value: '511600',
+ children: [
+ {
+ label: '市辖区',
+ value: '511601',
+ },
+ {
+ label: '广安区',
+ value: '511602',
+ },
+ {
+ label: '前锋区',
+ value: '511603',
+ },
+ {
+ label: '岳池县',
+ value: '511621',
+ },
+ {
+ label: '武胜县',
+ value: '511622',
+ },
+ {
+ label: '邻水县',
+ value: '511623',
+ },
+ {
+ label: '华蓥市',
+ value: '511681',
+ },
+ ],
+ },
+ {
+ label: '达州市',
+ value: '511700',
+ children: [
+ {
+ label: '市辖区',
+ value: '511701',
+ },
+ {
+ label: '通川区',
+ value: '511702',
+ },
+ {
+ label: '达川区',
+ value: '511703',
+ },
+ {
+ label: '宣汉县',
+ value: '511722',
+ },
+ {
+ label: '开江县',
+ value: '511723',
+ },
+ {
+ label: '大竹县',
+ value: '511724',
+ },
+ {
+ label: '渠县',
+ value: '511725',
+ },
+ {
+ label: '万源市',
+ value: '511781',
+ },
+ ],
+ },
+ {
+ label: '雅安市',
+ value: '511800',
+ children: [
+ {
+ label: '市辖区',
+ value: '511801',
+ },
+ {
+ label: '雨城区',
+ value: '511802',
+ },
+ {
+ label: '名山区',
+ value: '511803',
+ },
+ {
+ label: '荥经县',
+ value: '511822',
+ },
+ {
+ label: '汉源县',
+ value: '511823',
+ },
+ {
+ label: '石棉县',
+ value: '511824',
+ },
+ {
+ label: '天全县',
+ value: '511825',
+ },
+ {
+ label: '芦山县',
+ value: '511826',
+ },
+ {
+ label: '宝兴县',
+ value: '511827',
+ },
+ ],
+ },
+ {
+ label: '巴中市',
+ value: '511900',
+ children: [
+ {
+ label: '市辖区',
+ value: '511901',
+ },
+ {
+ label: '巴州区',
+ value: '511902',
+ },
+ {
+ label: '恩阳区',
+ value: '511903',
+ },
+ {
+ label: '通江县',
+ value: '511921',
+ },
+ {
+ label: '南江县',
+ value: '511922',
+ },
+ {
+ label: '平昌县',
+ value: '511923',
+ },
+ ],
+ },
+ {
+ label: '资阳市',
+ value: '512000',
+ children: [
+ {
+ label: '市辖区',
+ value: '512001',
+ },
+ {
+ label: '雁江区',
+ value: '512002',
+ },
+ {
+ label: '安岳县',
+ value: '512021',
+ },
+ {
+ label: '乐至县',
+ value: '512022',
+ },
+ ],
+ },
+ {
+ label: '阿坝藏族羌族自治州',
+ value: '513200',
+ children: [
+ {
+ label: '马尔康市',
+ value: '513201',
+ },
+ {
+ label: '汶川县',
+ value: '513221',
+ },
+ {
+ label: '理县',
+ value: '513222',
+ },
+ {
+ label: '茂县',
+ value: '513223',
+ },
+ {
+ label: '松潘县',
+ value: '513224',
+ },
+ {
+ label: '九寨沟县',
+ value: '513225',
+ },
+ {
+ label: '金川县',
+ value: '513226',
+ },
+ {
+ label: '小金县',
+ value: '513227',
+ },
+ {
+ label: '黑水县',
+ value: '513228',
+ },
+ {
+ label: '壤塘县',
+ value: '513230',
+ },
+ {
+ label: '阿坝县',
+ value: '513231',
+ },
+ {
+ label: '若尔盖县',
+ value: '513232',
+ },
+ {
+ label: '红原县',
+ value: '513233',
+ },
+ ],
+ },
+ {
+ label: '甘孜藏族自治州',
+ value: '513300',
+ children: [
+ {
+ label: '康定市',
+ value: '513301',
+ },
+ {
+ label: '泸定县',
+ value: '513322',
+ },
+ {
+ label: '丹巴县',
+ value: '513323',
+ },
+ {
+ label: '九龙县',
+ value: '513324',
+ },
+ {
+ label: '雅江县',
+ value: '513325',
+ },
+ {
+ label: '道孚县',
+ value: '513326',
+ },
+ {
+ label: '炉霍县',
+ value: '513327',
+ },
+ {
+ label: '甘孜县',
+ value: '513328',
+ },
+ {
+ label: '新龙县',
+ value: '513329',
+ },
+ {
+ label: '德格县',
+ value: '513330',
+ },
+ {
+ label: '白玉县',
+ value: '513331',
+ },
+ {
+ label: '石渠县',
+ value: '513332',
+ },
+ {
+ label: '色达县',
+ value: '513333',
+ },
+ {
+ label: '理塘县',
+ value: '513334',
+ },
+ {
+ label: '巴塘县',
+ value: '513335',
+ },
+ {
+ label: '乡城县',
+ value: '513336',
+ },
+ {
+ label: '稻城县',
+ value: '513337',
+ },
+ {
+ label: '得荣县',
+ value: '513338',
+ },
+ ],
+ },
+ {
+ label: '凉山彝族自治州',
+ value: '513400',
+ children: [
+ {
+ label: '西昌市',
+ value: '513401',
+ },
+ {
+ label: '木里藏族自治县',
+ value: '513422',
+ },
+ {
+ label: '盐源县',
+ value: '513423',
+ },
+ {
+ label: '德昌县',
+ value: '513424',
+ },
+ {
+ label: '会理县',
+ value: '513425',
+ },
+ {
+ label: '会东县',
+ value: '513426',
+ },
+ {
+ label: '宁南县',
+ value: '513427',
+ },
+ {
+ label: '普格县',
+ value: '513428',
+ },
+ {
+ label: '布拖县',
+ value: '513429',
+ },
+ {
+ label: '金阳县',
+ value: '513430',
+ },
+ {
+ label: '昭觉县',
+ value: '513431',
+ },
+ {
+ label: '喜德县',
+ value: '513432',
+ },
+ {
+ label: '冕宁县',
+ value: '513433',
+ },
+ {
+ label: '越西县',
+ value: '513434',
+ },
+ {
+ label: '甘洛县',
+ value: '513435',
+ },
+ {
+ label: '美姑县',
+ value: '513436',
+ },
+ {
+ label: '雷波县',
+ value: '513437',
+ },
+ ],
+ },
+ ],
+ },
+
+ {
+ label: '河南省',
+ value: '410000',
+ children: [
+ {
+ label: '郑州市',
+ value: '410100',
+ children: [
+ {
+ label: '市辖区',
+ value: '410101',
+ },
+ {
+ label: '中原区',
+ value: '410102',
+ },
+ {
+ label: '二七区',
+ value: '410103',
+ },
+ {
+ label: '管城回族区',
+ value: '410104',
+ },
+ {
+ label: '金水区',
+ value: '410105',
+ },
+ {
+ label: '上街区',
+ value: '410106',
+ },
+ {
+ label: '惠济区',
+ value: '410108',
+ },
+ {
+ label: '中牟县',
+ value: '410122',
+ },
+ {
+ label: '巩义市',
+ value: '410181',
+ },
+ {
+ label: '荥阳市',
+ value: '410182',
+ },
+ {
+ label: '新密市',
+ value: '410183',
+ },
+ {
+ label: '新郑市',
+ value: '410184',
+ },
+ {
+ label: '登封市',
+ value: '410185',
+ },
+ ],
+ },
+ {
+ label: '开封市',
+ value: '410200',
+ children: [
+ {
+ label: '市辖区',
+ value: '410201',
+ },
+ {
+ label: '龙亭区',
+ value: '410202',
+ },
+ {
+ label: '顺河回族区',
+ value: '410203',
+ },
+ {
+ label: '鼓楼区',
+ value: '410204',
+ },
+ {
+ label: '禹王台区',
+ value: '410205',
+ },
+ {
+ label: '金明区',
+ value: '410211',
+ },
+ {
+ label: '祥符区',
+ value: '410212',
+ },
+ {
+ label: '杞县',
+ value: '410221',
+ },
+ {
+ label: '通许县',
+ value: '410222',
+ },
+ {
+ label: '尉氏县',
+ value: '410223',
+ },
+ {
+ label: '兰考县',
+ value: '410225',
+ },
+ ],
+ },
+ {
+ label: '洛阳市',
+ value: '410300',
+ children: [
+ {
+ label: '市辖区',
+ value: '410301',
+ },
+ {
+ label: '老城区',
+ value: '410302',
+ },
+ {
+ label: '西工区',
+ value: '410303',
+ },
+ {
+ label: '瀍河回族区',
+ value: '410304',
+ },
+ {
+ label: '涧西区',
+ value: '410305',
+ },
+ {
+ label: '吉利区',
+ value: '410306',
+ },
+ {
+ label: '洛龙区',
+ value: '410311',
+ },
+ {
+ label: '孟津县',
+ value: '410322',
+ },
+ {
+ label: '新安县',
+ value: '410323',
+ },
+ {
+ label: '栾川县',
+ value: '410324',
+ },
+ {
+ label: '嵩县',
+ value: '410325',
+ },
+ {
+ label: '汝阳县',
+ value: '410326',
+ },
+ {
+ label: '宜阳县',
+ value: '410327',
+ },
+ {
+ label: '洛宁县',
+ value: '410328',
+ },
+ {
+ label: '伊川县',
+ value: '410329',
+ },
+ {
+ label: '偃师市',
+ value: '410381',
+ },
+ ],
+ },
+ {
+ label: '平顶山市',
+ value: '410400',
+ children: [
+ {
+ label: '市辖区',
+ value: '410401',
+ },
+ {
+ label: '新华区',
+ value: '410402',
+ },
+ {
+ label: '卫东区',
+ value: '410403',
+ },
+ {
+ label: '石龙区',
+ value: '410404',
+ },
+ {
+ label: '湛河区',
+ value: '410411',
+ },
+ {
+ label: '宝丰县',
+ value: '410421',
+ },
+ {
+ label: '叶县',
+ value: '410422',
+ },
+ {
+ label: '鲁山县',
+ value: '410423',
+ },
+ {
+ label: '郏县',
+ value: '410425',
+ },
+ {
+ label: '舞钢市',
+ value: '410481',
+ },
+ {
+ label: '汝州市',
+ value: '410482',
+ },
+ ],
+ },
+ {
+ label: '安阳市',
+ value: '410500',
+ children: [
+ {
+ label: '市辖区',
+ value: '410501',
+ },
+ {
+ label: '文峰区',
+ value: '410502',
+ },
+ {
+ label: '北关区',
+ value: '410503',
+ },
+ {
+ label: '殷都区',
+ value: '410505',
+ },
+ {
+ label: '龙安区',
+ value: '410506',
+ },
+ {
+ label: '安阳县',
+ value: '410522',
+ },
+ {
+ label: '汤阴县',
+ value: '410523',
+ },
+ {
+ label: '滑县',
+ value: '410526',
+ },
+ {
+ label: '内黄县',
+ value: '410527',
+ },
+ {
+ label: '林州市',
+ value: '410581',
+ },
+ ],
+ },
+ {
+ label: '鹤壁市',
+ value: '410600',
+ children: [
+ {
+ label: '市辖区',
+ value: '410601',
+ },
+ {
+ label: '鹤山区',
+ value: '410602',
+ },
+ {
+ label: '山城区',
+ value: '410603',
+ },
+ {
+ label: '淇滨区',
+ value: '410611',
+ },
+ {
+ label: '浚县',
+ value: '410621',
+ },
+ {
+ label: '淇县',
+ value: '410622',
+ },
+ ],
+ },
+ {
+ label: '新乡市',
+ value: '410700',
+ children: [
+ {
+ label: '市辖区',
+ value: '410701',
+ },
+ {
+ label: '红旗区',
+ value: '410702',
+ },
+ {
+ label: '卫滨区',
+ value: '410703',
+ },
+ {
+ label: '凤泉区',
+ value: '410704',
+ },
+ {
+ label: '牧野区',
+ value: '410711',
+ },
+ {
+ label: '新乡县',
+ value: '410721',
+ },
+ {
+ label: '获嘉县',
+ value: '410724',
+ },
+ {
+ label: '原阳县',
+ value: '410725',
+ },
+ {
+ label: '延津县',
+ value: '410726',
+ },
+ {
+ label: '封丘县',
+ value: '410727',
+ },
+ {
+ label: '长垣县',
+ value: '410728',
+ },
+ {
+ label: '卫辉市',
+ value: '410781',
+ },
+ {
+ label: '辉县市',
+ value: '410782',
+ },
+ ],
+ },
+ {
+ label: '焦作市',
+ value: '410800',
+ children: [
+ {
+ label: '市辖区',
+ value: '410801',
+ },
+ {
+ label: '解放区',
+ value: '410802',
+ },
+ {
+ label: '中站区',
+ value: '410803',
+ },
+ {
+ label: '马村区',
+ value: '410804',
+ },
+ {
+ label: '山阳区',
+ value: '410811',
+ },
+ {
+ label: '修武县',
+ value: '410821',
+ },
+ {
+ label: '博爱县',
+ value: '410822',
+ },
+ {
+ label: '武陟县',
+ value: '410823',
+ },
+ {
+ label: '温县',
+ value: '410825',
+ },
+ {
+ label: '沁阳市',
+ value: '410882',
+ },
+ {
+ label: '孟州市',
+ value: '410883',
+ },
+ ],
+ },
+ {
+ label: '濮阳市',
+ value: '410900',
+ children: [
+ {
+ label: '市辖区',
+ value: '410901',
+ },
+ {
+ label: '华龙区',
+ value: '410902',
+ },
+ {
+ label: '清丰县',
+ value: '410922',
+ },
+ {
+ label: '南乐县',
+ value: '410923',
+ },
+ {
+ label: '范县',
+ value: '410926',
+ },
+ {
+ label: '台前县',
+ value: '410927',
+ },
+ {
+ label: '濮阳县',
+ value: '410928',
+ },
+ ],
+ },
+ {
+ label: '许昌市',
+ value: '411000',
+ children: [
+ {
+ label: '市辖区',
+ value: '411001',
+ },
+ {
+ label: '魏都区',
+ value: '411002',
+ },
+ {
+ label: '许昌县',
+ value: '411023',
+ },
+ {
+ label: '鄢陵县',
+ value: '411024',
+ },
+ {
+ label: '襄城县',
+ value: '411025',
+ },
+ {
+ label: '禹州市',
+ value: '411081',
+ },
+ {
+ label: '长葛市',
+ value: '411082',
+ },
+ ],
+ },
+ {
+ label: '漯河市',
+ value: '411100',
+ children: [
+ {
+ label: '市辖区',
+ value: '411101',
+ },
+ {
+ label: '源汇区',
+ value: '411102',
+ },
+ {
+ label: '郾城区',
+ value: '411103',
+ },
+ {
+ label: '召陵区',
+ value: '411104',
+ },
+ {
+ label: '舞阳县',
+ value: '411121',
+ },
+ {
+ label: '临颍县',
+ value: '411122',
+ },
+ ],
+ },
+ {
+ label: '三门峡市',
+ value: '411200',
+ children: [
+ {
+ label: '市辖区',
+ value: '411201',
+ },
+ {
+ label: '湖滨区',
+ value: '411202',
+ },
+ {
+ label: '陕州区',
+ value: '411203',
+ },
+ {
+ label: '渑池县',
+ value: '411221',
+ },
+ {
+ label: '卢氏县',
+ value: '411224',
+ },
+ {
+ label: '义马市',
+ value: '411281',
+ },
+ {
+ label: '灵宝市',
+ value: '411282',
+ },
+ ],
+ },
+ {
+ label: '南阳市',
+ value: '411300',
+ children: [
+ {
+ label: '市辖区',
+ value: '411301',
+ },
+ {
+ label: '宛城区',
+ value: '411302',
+ },
+ {
+ label: '卧龙区',
+ value: '411303',
+ },
+ {
+ label: '南召县',
+ value: '411321',
+ },
+ {
+ label: '方城县',
+ value: '411322',
+ },
+ {
+ label: '西峡县',
+ value: '411323',
+ },
+ {
+ label: '镇平县',
+ value: '411324',
+ },
+ {
+ label: '内乡县',
+ value: '411325',
+ },
+ {
+ label: '淅川县',
+ value: '411326',
+ },
+ {
+ label: '社旗县',
+ value: '411327',
+ },
+ {
+ label: '唐河县',
+ value: '411328',
+ },
+ {
+ label: '新野县',
+ value: '411329',
+ },
+ {
+ label: '桐柏县',
+ value: '411330',
+ },
+ {
+ label: '邓州市',
+ value: '411381',
+ },
+ ],
+ },
+ {
+ label: '商丘市',
+ value: '411400',
+ children: [
+ {
+ label: '市辖区',
+ value: '411401',
+ },
+ {
+ label: '梁园区',
+ value: '411402',
+ },
+ {
+ label: '睢阳区',
+ value: '411403',
+ },
+ {
+ label: '民权县',
+ value: '411421',
+ },
+ {
+ label: '睢县',
+ value: '411422',
+ },
+ {
+ label: '宁陵县',
+ value: '411423',
+ },
+ {
+ label: '柘城县',
+ value: '411424',
+ },
+ {
+ label: '虞城县',
+ value: '411425',
+ },
+ {
+ label: '夏邑县',
+ value: '411426',
+ },
+ {
+ label: '永城市',
+ value: '411481',
+ },
+ ],
+ },
+ {
+ label: '信阳市',
+ value: '411500',
+ children: [
+ {
+ label: '市辖区',
+ value: '411501',
+ },
+ {
+ label: '浉河区',
+ value: '411502',
+ },
+ {
+ label: '平桥区',
+ value: '411503',
+ },
+ {
+ label: '罗山县',
+ value: '411521',
+ },
+ {
+ label: '光山县',
+ value: '411522',
+ },
+ {
+ label: '新县',
+ value: '411523',
+ },
+ {
+ label: '商城县',
+ value: '411524',
+ },
+ {
+ label: '固始县',
+ value: '411525',
+ },
+ {
+ label: '潢川县',
+ value: '411526',
+ },
+ {
+ label: '淮滨县',
+ value: '411527',
+ },
+ {
+ label: '息县',
+ value: '411528',
+ },
+ ],
+ },
+ {
+ label: '周口市',
+ value: '411600',
+ children: [
+ {
+ label: '市辖区',
+ value: '411601',
+ },
+ {
+ label: '川汇区',
+ value: '411602',
+ },
+ {
+ label: '扶沟县',
+ value: '411621',
+ },
+ {
+ label: '西华县',
+ value: '411622',
+ },
+ {
+ label: '商水县',
+ value: '411623',
+ },
+ {
+ label: '沈丘县',
+ value: '411624',
+ },
+ {
+ label: '郸城县',
+ value: '411625',
+ },
+ {
+ label: '淮阳县',
+ value: '411626',
+ },
+ {
+ label: '太康县',
+ value: '411627',
+ },
+ {
+ label: '鹿邑县',
+ value: '411628',
+ },
+ {
+ label: '项城市',
+ value: '411681',
+ },
+ ],
+ },
+ {
+ label: '驻马店市',
+ value: '411700',
+ children: [
+ {
+ label: '市辖区',
+ value: '411701',
+ },
+ {
+ label: '驿城区',
+ value: '411702',
+ },
+ {
+ label: '西平县',
+ value: '411721',
+ },
+ {
+ label: '上蔡县',
+ value: '411722',
+ },
+ {
+ label: '平舆县',
+ value: '411723',
+ },
+ {
+ label: '正阳县',
+ value: '411724',
+ },
+ {
+ label: '确山县',
+ value: '411725',
+ },
+ {
+ label: '泌阳县',
+ value: '411726',
+ },
+ {
+ label: '汝南县',
+ value: '411727',
+ },
+ {
+ label: '遂平县',
+ value: '411728',
+ },
+ {
+ label: '新蔡县',
+ value: '411729',
+ },
+ ],
+ },
+ {
+ label: '省直辖县级行政区划',
+ value: '419000',
+ children: [
+ {
+ label: '济源市',
+ value: '419001',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '湖南省',
+ value: '430000',
+ children: [
+ {
+ label: '长沙市',
+ value: '430100',
+ children: [
+ {
+ label: '市辖区',
+ value: '430101',
+ },
+ {
+ label: '芙蓉区',
+ value: '430102',
+ },
+ {
+ label: '天心区',
+ value: '430103',
+ },
+ {
+ label: '岳麓区',
+ value: '430104',
+ },
+ {
+ label: '开福区',
+ value: '430105',
+ },
+ {
+ label: '雨花区',
+ value: '430111',
+ },
+ {
+ label: '望城区',
+ value: '430112',
+ },
+ {
+ label: '长沙县',
+ value: '430121',
+ },
+ {
+ label: '宁乡县',
+ value: '430124',
+ },
+ {
+ label: '浏阳市',
+ value: '430181',
+ },
+ ],
+ },
+ {
+ label: '株洲市',
+ value: '430200',
+ children: [
+ {
+ label: '市辖区',
+ value: '430201',
+ },
+ {
+ label: '荷塘区',
+ value: '430202',
+ },
+ {
+ label: '芦淞区',
+ value: '430203',
+ },
+ {
+ label: '石峰区',
+ value: '430204',
+ },
+ {
+ label: '天元区',
+ value: '430211',
+ },
+ {
+ label: '株洲县',
+ value: '430221',
+ },
+ {
+ label: '攸县',
+ value: '430223',
+ },
+ {
+ label: '茶陵县',
+ value: '430224',
+ },
+ {
+ label: '炎陵县',
+ value: '430225',
+ },
+ {
+ label: '醴陵市',
+ value: '430281',
+ },
+ ],
+ },
+ {
+ label: '湘潭市',
+ value: '430300',
+ children: [
+ {
+ label: '市辖区',
+ value: '430301',
+ },
+ {
+ label: '雨湖区',
+ value: '430302',
+ },
+ {
+ label: '岳塘区',
+ value: '430304',
+ },
+ {
+ label: '湘潭县',
+ value: '430321',
+ },
+ {
+ label: '湘乡市',
+ value: '430381',
+ },
+ {
+ label: '韶山市',
+ value: '430382',
+ },
+ ],
+ },
+ {
+ label: '衡阳市',
+ value: '430400',
+ children: [
+ {
+ label: '市辖区',
+ value: '430401',
+ },
+ {
+ label: '珠晖区',
+ value: '430405',
+ },
+ {
+ label: '雁峰区',
+ value: '430406',
+ },
+ {
+ label: '石鼓区',
+ value: '430407',
+ },
+ {
+ label: '蒸湘区',
+ value: '430408',
+ },
+ {
+ label: '南岳区',
+ value: '430412',
+ },
+ {
+ label: '衡阳县',
+ value: '430421',
+ },
+ {
+ label: '衡南县',
+ value: '430422',
+ },
+ {
+ label: '衡山县',
+ value: '430423',
+ },
+ {
+ label: '衡东县',
+ value: '430424',
+ },
+ {
+ label: '祁东县',
+ value: '430426',
+ },
+ {
+ label: '耒阳市',
+ value: '430481',
+ },
+ {
+ label: '常宁市',
+ value: '430482',
+ },
+ ],
+ },
+ {
+ label: '邵阳市',
+ value: '430500',
+ children: [
+ {
+ label: '市辖区',
+ value: '430501',
+ },
+ {
+ label: '双清区',
+ value: '430502',
+ },
+ {
+ label: '大祥区',
+ value: '430503',
+ },
+ {
+ label: '北塔区',
+ value: '430511',
+ },
+ {
+ label: '邵东县',
+ value: '430521',
+ },
+ {
+ label: '新邵县',
+ value: '430522',
+ },
+ {
+ label: '邵阳县',
+ value: '430523',
+ },
+ {
+ label: '隆回县',
+ value: '430524',
+ },
+ {
+ label: '洞口县',
+ value: '430525',
+ },
+ {
+ label: '绥宁县',
+ value: '430527',
+ },
+ {
+ label: '新宁县',
+ value: '430528',
+ },
+ {
+ label: '城步苗族自治县',
+ value: '430529',
+ },
+ {
+ label: '武冈市',
+ value: '430581',
+ },
+ ],
+ },
+ {
+ label: '岳阳市',
+ value: '430600',
+ children: [
+ {
+ label: '市辖区',
+ value: '430601',
+ },
+ {
+ label: '岳阳楼区',
+ value: '430602',
+ },
+ {
+ label: '云溪区',
+ value: '430603',
+ },
+ {
+ label: '君山区',
+ value: '430611',
+ },
+ {
+ label: '岳阳县',
+ value: '430621',
+ },
+ {
+ label: '华容县',
+ value: '430623',
+ },
+ {
+ label: '湘阴县',
+ value: '430624',
+ },
+ {
+ label: '平江县',
+ value: '430626',
+ },
+ {
+ label: '汨罗市',
+ value: '430681',
+ },
+ {
+ label: '临湘市',
+ value: '430682',
+ },
+ ],
+ },
+ {
+ label: '常德市',
+ value: '430700',
+ children: [
+ {
+ label: '市辖区',
+ value: '430701',
+ },
+ {
+ label: '武陵区',
+ value: '430702',
+ },
+ {
+ label: '鼎城区',
+ value: '430703',
+ },
+ {
+ label: '安乡县',
+ value: '430721',
+ },
+ {
+ label: '汉寿县',
+ value: '430722',
+ },
+ {
+ label: '澧县',
+ value: '430723',
+ },
+ {
+ label: '临澧县',
+ value: '430724',
+ },
+ {
+ label: '桃源县',
+ value: '430725',
+ },
+ {
+ label: '石门县',
+ value: '430726',
+ },
+ {
+ label: '津市市',
+ value: '430781',
+ },
+ ],
+ },
+ {
+ label: '张家界市',
+ value: '430800',
+ children: [
+ {
+ label: '市辖区',
+ value: '430801',
+ },
+ {
+ label: '永定区',
+ value: '430802',
+ },
+ {
+ label: '武陵源区',
+ value: '430811',
+ },
+ {
+ label: '慈利县',
+ value: '430821',
+ },
+ {
+ label: '桑植县',
+ value: '430822',
+ },
+ ],
+ },
+ {
+ label: '益阳市',
+ value: '430900',
+ children: [
+ {
+ label: '市辖区',
+ value: '430901',
+ },
+ {
+ label: '资阳区',
+ value: '430902',
+ },
+ {
+ label: '赫山区',
+ value: '430903',
+ },
+ {
+ label: '南县',
+ value: '430921',
+ },
+ {
+ label: '桃江县',
+ value: '430922',
+ },
+ {
+ label: '安化县',
+ value: '430923',
+ },
+ {
+ label: '沅江市',
+ value: '430981',
+ },
+ ],
+ },
+ {
+ label: '郴州市',
+ value: '431000',
+ children: [
+ {
+ label: '市辖区',
+ value: '431001',
+ },
+ {
+ label: '北湖区',
+ value: '431002',
+ },
+ {
+ label: '苏仙区',
+ value: '431003',
+ },
+ {
+ label: '桂阳县',
+ value: '431021',
+ },
+ {
+ label: '宜章县',
+ value: '431022',
+ },
+ {
+ label: '永兴县',
+ value: '431023',
+ },
+ {
+ label: '嘉禾县',
+ value: '431024',
+ },
+ {
+ label: '临武县',
+ value: '431025',
+ },
+ {
+ label: '汝城县',
+ value: '431026',
+ },
+ {
+ label: '桂东县',
+ value: '431027',
+ },
+ {
+ label: '安仁县',
+ value: '431028',
+ },
+ {
+ label: '资兴市',
+ value: '431081',
+ },
+ ],
+ },
+ {
+ label: '永州市',
+ value: '431100',
+ children: [
+ {
+ label: '市辖区',
+ value: '431101',
+ },
+ {
+ label: '零陵区',
+ value: '431102',
+ },
+ {
+ label: '冷水滩区',
+ value: '431103',
+ },
+ {
+ label: '祁阳县',
+ value: '431121',
+ },
+ {
+ label: '东安县',
+ value: '431122',
+ },
+ {
+ label: '双牌县',
+ value: '431123',
+ },
+ {
+ label: '道县',
+ value: '431124',
+ },
+ {
+ label: '江永县',
+ value: '431125',
+ },
+ {
+ label: '宁远县',
+ value: '431126',
+ },
+ {
+ label: '蓝山县',
+ value: '431127',
+ },
+ {
+ label: '新田县',
+ value: '431128',
+ },
+ {
+ label: '江华瑶族自治县',
+ value: '431129',
+ },
+ ],
+ },
+ {
+ label: '怀化市',
+ value: '431200',
+ children: [
+ {
+ label: '市辖区',
+ value: '431201',
+ },
+ {
+ label: '鹤城区',
+ value: '431202',
+ },
+ {
+ label: '中方县',
+ value: '431221',
+ },
+ {
+ label: '沅陵县',
+ value: '431222',
+ },
+ {
+ label: '辰溪县',
+ value: '431223',
+ },
+ {
+ label: '溆浦县',
+ value: '431224',
+ },
+ {
+ label: '会同县',
+ value: '431225',
+ },
+ {
+ label: '麻阳苗族自治县',
+ value: '431226',
+ },
+ {
+ label: '新晃侗族自治县',
+ value: '431227',
+ },
+ {
+ label: '芷江侗族自治县',
+ value: '431228',
+ },
+ {
+ label: '靖州苗族侗族自治县',
+ value: '431229',
+ },
+ {
+ label: '通道侗族自治县',
+ value: '431230',
+ },
+ {
+ label: '洪江市',
+ value: '431281',
+ },
+ ],
+ },
+ {
+ label: '娄底市',
+ value: '431300',
+ children: [
+ {
+ label: '市辖区',
+ value: '431301',
+ },
+ {
+ label: '娄星区',
+ value: '431302',
+ },
+ {
+ label: '双峰县',
+ value: '431321',
+ },
+ {
+ label: '新化县',
+ value: '431322',
+ },
+ {
+ label: '冷水江市',
+ value: '431381',
+ },
+ {
+ label: '涟源市',
+ value: '431382',
+ },
+ ],
+ },
+ {
+ label: '湘西土家族苗族自治州',
+ value: '433100',
+ children: [
+ {
+ label: '吉首市',
+ value: '433101',
+ },
+ {
+ label: '泸溪县',
+ value: '433122',
+ },
+ {
+ label: '凤凰县',
+ value: '433123',
+ },
+ {
+ label: '花垣县',
+ value: '433124',
+ },
+ {
+ label: '保靖县',
+ value: '433125',
+ },
+ {
+ label: '古丈县',
+ value: '433126',
+ },
+ {
+ label: '永顺县',
+ value: '433127',
+ },
+ {
+ label: '龙山县',
+ value: '433130',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '湖北省',
+ value: '420000',
+ children: [
+ {
+ label: '武汉市',
+ value: '420100',
+ children: [
+ {
+ label: '市辖区',
+ value: '420101',
+ },
+ {
+ label: '江岸区',
+ value: '420102',
+ },
+ {
+ label: '江汉区',
+ value: '420103',
+ },
+ {
+ label: '硚口区',
+ value: '420104',
+ },
+ {
+ label: '汉阳区',
+ value: '420105',
+ },
+ {
+ label: '武昌区',
+ value: '420106',
+ },
+ {
+ label: '青山区',
+ value: '420107',
+ },
+ {
+ label: '洪山区',
+ value: '420111',
+ },
+ {
+ label: '东西湖区',
+ value: '420112',
+ },
+ {
+ label: '汉南区',
+ value: '420113',
+ },
+ {
+ label: '蔡甸区',
+ value: '420114',
+ },
+ {
+ label: '江夏区',
+ value: '420115',
+ },
+ {
+ label: '黄陂区',
+ value: '420116',
+ },
+ {
+ label: '新洲区',
+ value: '420117',
+ },
+ ],
+ },
+ {
+ label: '黄石市',
+ value: '420200',
+ children: [
+ {
+ label: '市辖区',
+ value: '420201',
+ },
+ {
+ label: '黄石港区',
+ value: '420202',
+ },
+ {
+ label: '西塞山区',
+ value: '420203',
+ },
+ {
+ label: '下陆区',
+ value: '420204',
+ },
+ {
+ label: '铁山区',
+ value: '420205',
+ },
+ {
+ label: '阳新县',
+ value: '420222',
+ },
+ {
+ label: '大冶市',
+ value: '420281',
+ },
+ ],
+ },
+ {
+ label: '十堰市',
+ value: '420300',
+ children: [
+ {
+ label: '市辖区',
+ value: '420301',
+ },
+ {
+ label: '茅箭区',
+ value: '420302',
+ },
+ {
+ label: '张湾区',
+ value: '420303',
+ },
+ {
+ label: '郧阳区',
+ value: '420304',
+ },
+ {
+ label: '郧西县',
+ value: '420322',
+ },
+ {
+ label: '竹山县',
+ value: '420323',
+ },
+ {
+ label: '竹溪县',
+ value: '420324',
+ },
+ {
+ label: '房县',
+ value: '420325',
+ },
+ {
+ label: '丹江口市',
+ value: '420381',
+ },
+ ],
+ },
+ {
+ label: '宜昌市',
+ value: '420500',
+ children: [
+ {
+ label: '市辖区',
+ value: '420501',
+ },
+ {
+ label: '西陵区',
+ value: '420502',
+ },
+ {
+ label: '伍家岗区',
+ value: '420503',
+ },
+ {
+ label: '点军区',
+ value: '420504',
+ },
+ {
+ label: '猇亭区',
+ value: '420505',
+ },
+ {
+ label: '夷陵区',
+ value: '420506',
+ },
+ {
+ label: '远安县',
+ value: '420525',
+ },
+ {
+ label: '兴山县',
+ value: '420526',
+ },
+ {
+ label: '秭归县',
+ value: '420527',
+ },
+ {
+ label: '长阳土家族自治县',
+ value: '420528',
+ },
+ {
+ label: '五峰土家族自治县',
+ value: '420529',
+ },
+ {
+ label: '宜都市',
+ value: '420581',
+ },
+ {
+ label: '当阳市',
+ value: '420582',
+ },
+ {
+ label: '枝江市',
+ value: '420583',
+ },
+ ],
+ },
+ {
+ label: '襄阳市',
+ value: '420600',
+ children: [
+ {
+ label: '市辖区',
+ value: '420601',
+ },
+ {
+ label: '襄城区',
+ value: '420602',
+ },
+ {
+ label: '樊城区',
+ value: '420606',
+ },
+ {
+ label: '襄州区',
+ value: '420607',
+ },
+ {
+ label: '南漳县',
+ value: '420624',
+ },
+ {
+ label: '谷城县',
+ value: '420625',
+ },
+ {
+ label: '保康县',
+ value: '420626',
+ },
+ {
+ label: '老河口市',
+ value: '420682',
+ },
+ {
+ label: '枣阳市',
+ value: '420683',
+ },
+ {
+ label: '宜城市',
+ value: '420684',
+ },
+ ],
+ },
+ {
+ label: '鄂州市',
+ value: '420700',
+ children: [
+ {
+ label: '市辖区',
+ value: '420701',
+ },
+ {
+ label: '梁子湖区',
+ value: '420702',
+ },
+ {
+ label: '华容区',
+ value: '420703',
+ },
+ {
+ label: '鄂城区',
+ value: '420704',
+ },
+ ],
+ },
+ {
+ label: '荆门市',
+ value: '420800',
+ children: [
+ {
+ label: '市辖区',
+ value: '420801',
+ },
+ {
+ label: '东宝区',
+ value: '420802',
+ },
+ {
+ label: '掇刀区',
+ value: '420804',
+ },
+ {
+ label: '京山县',
+ value: '420821',
+ },
+ {
+ label: '沙洋县',
+ value: '420822',
+ },
+ {
+ label: '钟祥市',
+ value: '420881',
+ },
+ ],
+ },
+ {
+ label: '孝感市',
+ value: '420900',
+ children: [
+ {
+ label: '市辖区',
+ value: '420901',
+ },
+ {
+ label: '孝南区',
+ value: '420902',
+ },
+ {
+ label: '孝昌县',
+ value: '420921',
+ },
+ {
+ label: '大悟县',
+ value: '420922',
+ },
+ {
+ label: '云梦县',
+ value: '420923',
+ },
+ {
+ label: '应城市',
+ value: '420981',
+ },
+ {
+ label: '安陆市',
+ value: '420982',
+ },
+ {
+ label: '汉川市',
+ value: '420984',
+ },
+ ],
+ },
+ {
+ label: '荆州市',
+ value: '421000',
+ children: [
+ {
+ label: '市辖区',
+ value: '421001',
+ },
+ {
+ label: '沙市区',
+ value: '421002',
+ },
+ {
+ label: '荆州区',
+ value: '421003',
+ },
+ {
+ label: '公安县',
+ value: '421022',
+ },
+ {
+ label: '监利县',
+ value: '421023',
+ },
+ {
+ label: '江陵县',
+ value: '421024',
+ },
+ {
+ label: '石首市',
+ value: '421081',
+ },
+ {
+ label: '洪湖市',
+ value: '421083',
+ },
+ {
+ label: '松滋市',
+ value: '421087',
+ },
+ ],
+ },
+ {
+ label: '黄冈市',
+ value: '421100',
+ children: [
+ {
+ label: '市辖区',
+ value: '421101',
+ },
+ {
+ label: '黄州区',
+ value: '421102',
+ },
+ {
+ label: '团风县',
+ value: '421121',
+ },
+ {
+ label: '红安县',
+ value: '421122',
+ },
+ {
+ label: '罗田县',
+ value: '421123',
+ },
+ {
+ label: '英山县',
+ value: '421124',
+ },
+ {
+ label: '浠水县',
+ value: '421125',
+ },
+ {
+ label: '蕲春县',
+ value: '421126',
+ },
+ {
+ label: '黄梅县',
+ value: '421127',
+ },
+ {
+ label: '麻城市',
+ value: '421181',
+ },
+ {
+ label: '武穴市',
+ value: '421182',
+ },
+ ],
+ },
+ {
+ label: '咸宁市',
+ value: '421200',
+ children: [
+ {
+ label: '市辖区',
+ value: '421201',
+ },
+ {
+ label: '咸安区',
+ value: '421202',
+ },
+ {
+ label: '嘉鱼县',
+ value: '421221',
+ },
+ {
+ label: '通城县',
+ value: '421222',
+ },
+ {
+ label: '崇阳县',
+ value: '421223',
+ },
+ {
+ label: '通山县',
+ value: '421224',
+ },
+ {
+ label: '赤壁市',
+ value: '421281',
+ },
+ ],
+ },
+ {
+ label: '随州市',
+ value: '421300',
+ children: [
+ {
+ label: '市辖区',
+ value: '421301',
+ },
+ {
+ label: '曾都区',
+ value: '421303',
+ },
+ {
+ label: '随县',
+ value: '421321',
+ },
+ {
+ label: '广水市',
+ value: '421381',
+ },
+ ],
+ },
+ {
+ label: '恩施土家族苗族自治州',
+ value: '422800',
+ children: [
+ {
+ label: '恩施市',
+ value: '422801',
+ },
+ {
+ label: '利川市',
+ value: '422802',
+ },
+ {
+ label: '建始县',
+ value: '422822',
+ },
+ {
+ label: '巴东县',
+ value: '422823',
+ },
+ {
+ label: '宣恩县',
+ value: '422825',
+ },
+ {
+ label: '咸丰县',
+ value: '422826',
+ },
+ {
+ label: '来凤县',
+ value: '422827',
+ },
+ {
+ label: '鹤峰县',
+ value: '422828',
+ },
+ ],
+ },
+ {
+ label: '省直辖县级行政区划',
+ value: '429000',
+ children: [
+ {
+ label: '仙桃市',
+ value: '429004',
+ },
+ {
+ label: '潜江市',
+ value: '429005',
+ },
+ {
+ label: '天门市',
+ value: '429006',
+ },
+ {
+ label: '神农架林区',
+ value: '429021',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '辽宁省',
+ value: '210000',
+ children: [
+ {
+ label: '沈阳市',
+ value: '210100',
+ children: [
+ {
+ label: '市辖区',
+ value: '210101',
+ },
+ {
+ label: '和平区',
+ value: '210102',
+ },
+ {
+ label: '沈河区',
+ value: '210103',
+ },
+ {
+ label: '大东区',
+ value: '210104',
+ },
+ {
+ label: '皇姑区',
+ value: '210105',
+ },
+ {
+ label: '铁西区',
+ value: '210106',
+ },
+ {
+ label: '苏家屯区',
+ value: '210111',
+ },
+ {
+ label: '浑南区',
+ value: '210112',
+ },
+ {
+ label: '沈北新区',
+ value: '210113',
+ },
+ {
+ label: '于洪区',
+ value: '210114',
+ },
+ {
+ label: '辽中区',
+ value: '210115',
+ },
+ {
+ label: '康平县',
+ value: '210123',
+ },
+ {
+ label: '法库县',
+ value: '210124',
+ },
+ {
+ label: '新民市',
+ value: '210181',
+ },
+ ],
+ },
+ {
+ label: '大连市',
+ value: '210200',
+ children: [
+ {
+ label: '市辖区',
+ value: '210201',
+ },
+ {
+ label: '中山区',
+ value: '210202',
+ },
+ {
+ label: '西岗区',
+ value: '210203',
+ },
+ {
+ label: '沙河口区',
+ value: '210204',
+ },
+ {
+ label: '甘井子区',
+ value: '210211',
+ },
+ {
+ label: '旅顺口区',
+ value: '210212',
+ },
+ {
+ label: '金州区',
+ value: '210213',
+ },
+ {
+ label: '普兰店区',
+ value: '210214',
+ },
+ {
+ label: '长海县',
+ value: '210224',
+ },
+ {
+ label: '瓦房店市',
+ value: '210281',
+ },
+ {
+ label: '庄河市',
+ value: '210283',
+ },
+ ],
+ },
+ {
+ label: '鞍山市',
+ value: '210300',
+ children: [
+ {
+ label: '市辖区',
+ value: '210301',
+ },
+ {
+ label: '铁东区',
+ value: '210302',
+ },
+ {
+ label: '铁西区',
+ value: '210303',
+ },
+ {
+ label: '立山区',
+ value: '210304',
+ },
+ {
+ label: '千山区',
+ value: '210311',
+ },
+ {
+ label: '台安县',
+ value: '210321',
+ },
+ {
+ label: '岫岩满族自治县',
+ value: '210323',
+ },
+ {
+ label: '海城市',
+ value: '210381',
+ },
+ ],
+ },
+ {
+ label: '抚顺市',
+ value: '210400',
+ children: [
+ {
+ label: '市辖区',
+ value: '210401',
+ },
+ {
+ label: '新抚区',
+ value: '210402',
+ },
+ {
+ label: '东洲区',
+ value: '210403',
+ },
+ {
+ label: '望花区',
+ value: '210404',
+ },
+ {
+ label: '顺城区',
+ value: '210411',
+ },
+ {
+ label: '抚顺县',
+ value: '210421',
+ },
+ {
+ label: '新宾满族自治县',
+ value: '210422',
+ },
+ {
+ label: '清原满族自治县',
+ value: '210423',
+ },
+ ],
+ },
+ {
+ label: '本溪市',
+ value: '210500',
+ children: [
+ {
+ label: '市辖区',
+ value: '210501',
+ },
+ {
+ label: '平山区',
+ value: '210502',
+ },
+ {
+ label: '溪湖区',
+ value: '210503',
+ },
+ {
+ label: '明山区',
+ value: '210504',
+ },
+ {
+ label: '南芬区',
+ value: '210505',
+ },
+ {
+ label: '本溪满族自治县',
+ value: '210521',
+ },
+ {
+ label: '桓仁满族自治县',
+ value: '210522',
+ },
+ ],
+ },
+ {
+ label: '丹东市',
+ value: '210600',
+ children: [
+ {
+ label: '市辖区',
+ value: '210601',
+ },
+ {
+ label: '元宝区',
+ value: '210602',
+ },
+ {
+ label: '振兴区',
+ value: '210603',
+ },
+ {
+ label: '振安区',
+ value: '210604',
+ },
+ {
+ label: '宽甸满族自治县',
+ value: '210624',
+ },
+ {
+ label: '东港市',
+ value: '210681',
+ },
+ {
+ label: '凤城市',
+ value: '210682',
+ },
+ ],
+ },
+ {
+ label: '锦州市',
+ value: '210700',
+ children: [
+ {
+ label: '市辖区',
+ value: '210701',
+ },
+ {
+ label: '古塔区',
+ value: '210702',
+ },
+ {
+ label: '凌河区',
+ value: '210703',
+ },
+ {
+ label: '太和区',
+ value: '210711',
+ },
+ {
+ label: '黑山县',
+ value: '210726',
+ },
+ {
+ label: '义县',
+ value: '210727',
+ },
+ {
+ label: '凌海市',
+ value: '210781',
+ },
+ {
+ label: '北镇市',
+ value: '210782',
+ },
+ ],
+ },
+ {
+ label: '营口市',
+ value: '210800',
+ children: [
+ {
+ label: '市辖区',
+ value: '210801',
+ },
+ {
+ label: '站前区',
+ value: '210802',
+ },
+ {
+ label: '西市区',
+ value: '210803',
+ },
+ {
+ label: '鲅鱼圈区',
+ value: '210804',
+ },
+ {
+ label: '老边区',
+ value: '210811',
+ },
+ {
+ label: '盖州市',
+ value: '210881',
+ },
+ {
+ label: '大石桥市',
+ value: '210882',
+ },
+ ],
+ },
+ {
+ label: '阜新市',
+ value: '210900',
+ children: [
+ {
+ label: '市辖区',
+ value: '210901',
+ },
+ {
+ label: '海州区',
+ value: '210902',
+ },
+ {
+ label: '新邱区',
+ value: '210903',
+ },
+ {
+ label: '太平区',
+ value: '210904',
+ },
+ {
+ label: '清河门区',
+ value: '210905',
+ },
+ {
+ label: '细河区',
+ value: '210911',
+ },
+ {
+ label: '阜新蒙古族自治县',
+ value: '210921',
+ },
+ {
+ label: '彰武县',
+ value: '210922',
+ },
+ ],
+ },
+ {
+ label: '辽阳市',
+ value: '211000',
+ children: [
+ {
+ label: '市辖区',
+ value: '211001',
+ },
+ {
+ label: '白塔区',
+ value: '211002',
+ },
+ {
+ label: '文圣区',
+ value: '211003',
+ },
+ {
+ label: '宏伟区',
+ value: '211004',
+ },
+ {
+ label: '弓长岭区',
+ value: '211005',
+ },
+ {
+ label: '太子河区',
+ value: '211011',
+ },
+ {
+ label: '辽阳县',
+ value: '211021',
+ },
+ {
+ label: '灯塔市',
+ value: '211081',
+ },
+ ],
+ },
+ {
+ label: '盘锦市',
+ value: '211100',
+ children: [
+ {
+ label: '市辖区',
+ value: '211101',
+ },
+ {
+ label: '双台子区',
+ value: '211102',
+ },
+ {
+ label: '兴隆台区',
+ value: '211103',
+ },
+ {
+ label: '大洼区',
+ value: '211104',
+ },
+ {
+ label: '盘山县',
+ value: '211122',
+ },
+ ],
+ },
+ {
+ label: '铁岭市',
+ value: '211200',
+ children: [
+ {
+ label: '市辖区',
+ value: '211201',
+ },
+ {
+ label: '银州区',
+ value: '211202',
+ },
+ {
+ label: '清河区',
+ value: '211204',
+ },
+ {
+ label: '铁岭县',
+ value: '211221',
+ },
+ {
+ label: '西丰县',
+ value: '211223',
+ },
+ {
+ label: '昌图县',
+ value: '211224',
+ },
+ {
+ label: '调兵山市',
+ value: '211281',
+ },
+ {
+ label: '开原市',
+ value: '211282',
+ },
+ ],
+ },
+ {
+ label: '朝阳市',
+ value: '211300',
+ children: [
+ {
+ label: '市辖区',
+ value: '211301',
+ },
+ {
+ label: '双塔区',
+ value: '211302',
+ },
+ {
+ label: '龙城区',
+ value: '211303',
+ },
+ {
+ label: '朝阳县',
+ value: '211321',
+ },
+ {
+ label: '建平县',
+ value: '211322',
+ },
+ {
+ label: '喀喇沁左翼蒙古族自治县',
+ value: '211324',
+ },
+ {
+ label: '北票市',
+ value: '211381',
+ },
+ {
+ label: '凌源市',
+ value: '211382',
+ },
+ ],
+ },
+ {
+ label: '葫芦岛市',
+ value: '211400',
+ children: [
+ {
+ label: '市辖区',
+ value: '211401',
+ },
+ {
+ label: '连山区',
+ value: '211402',
+ },
+ {
+ label: '龙港区',
+ value: '211403',
+ },
+ {
+ label: '南票区',
+ value: '211404',
+ },
+ {
+ label: '绥中县',
+ value: '211421',
+ },
+ {
+ label: '建昌县',
+ value: '211422',
+ },
+ {
+ label: '兴城市',
+ value: '211481',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '吉林省',
+ value: '220000',
+ children: [
+ {
+ label: '长春市',
+ value: '220100',
+ children: [
+ {
+ label: '市辖区',
+ value: '220101',
+ },
+ {
+ label: '南关区',
+ value: '220102',
+ },
+ {
+ label: '宽城区',
+ value: '220103',
+ },
+ {
+ label: '朝阳区',
+ value: '220104',
+ },
+ {
+ label: '二道区',
+ value: '220105',
+ },
+ {
+ label: '绿园区',
+ value: '220106',
+ },
+ {
+ label: '双阳区',
+ value: '220112',
+ },
+ {
+ label: '九台区',
+ value: '220113',
+ },
+ {
+ label: '农安县',
+ value: '220122',
+ },
+ {
+ label: '榆树市',
+ value: '220182',
+ },
+ {
+ label: '德惠市',
+ value: '220183',
+ },
+ ],
+ },
+ {
+ label: '吉林市',
+ value: '220200',
+ children: [
+ {
+ label: '市辖区',
+ value: '220201',
+ },
+ {
+ label: '昌邑区',
+ value: '220202',
+ },
+ {
+ label: '龙潭区',
+ value: '220203',
+ },
+ {
+ label: '船营区',
+ value: '220204',
+ },
+ {
+ label: '丰满区',
+ value: '220211',
+ },
+ {
+ label: '永吉县',
+ value: '220221',
+ },
+ {
+ label: '蛟河市',
+ value: '220281',
+ },
+ {
+ label: '桦甸市',
+ value: '220282',
+ },
+ {
+ label: '舒兰市',
+ value: '220283',
+ },
+ {
+ label: '磐石市',
+ value: '220284',
+ },
+ ],
+ },
+ {
+ label: '四平市',
+ value: '220300',
+ children: [
+ {
+ label: '市辖区',
+ value: '220301',
+ },
+ {
+ label: '铁西区',
+ value: '220302',
+ },
+ {
+ label: '铁东区',
+ value: '220303',
+ },
+ {
+ label: '梨树县',
+ value: '220322',
+ },
+ {
+ label: '伊通满族自治县',
+ value: '220323',
+ },
+ {
+ label: '公主岭市',
+ value: '220381',
+ },
+ {
+ label: '双辽市',
+ value: '220382',
+ },
+ ],
+ },
+ {
+ label: '辽源市',
+ value: '220400',
+ children: [
+ {
+ label: '市辖区',
+ value: '220401',
+ },
+ {
+ label: '龙山区',
+ value: '220402',
+ },
+ {
+ label: '西安区',
+ value: '220403',
+ },
+ {
+ label: '东丰县',
+ value: '220421',
+ },
+ {
+ label: '东辽县',
+ value: '220422',
+ },
+ ],
+ },
+ {
+ label: '通化市',
+ value: '220500',
+ children: [
+ {
+ label: '市辖区',
+ value: '220501',
+ },
+ {
+ label: '东昌区',
+ value: '220502',
+ },
+ {
+ label: '二道江区',
+ value: '220503',
+ },
+ {
+ label: '通化县',
+ value: '220521',
+ },
+ {
+ label: '辉南县',
+ value: '220523',
+ },
+ {
+ label: '柳河县',
+ value: '220524',
+ },
+ {
+ label: '梅河口市',
+ value: '220581',
+ },
+ {
+ label: '集安市',
+ value: '220582',
+ },
+ ],
+ },
+ {
+ label: '白山市',
+ value: '220600',
+ children: [
+ {
+ label: '市辖区',
+ value: '220601',
+ },
+ {
+ label: '浑江区',
+ value: '220602',
+ },
+ {
+ label: '江源区',
+ value: '220605',
+ },
+ {
+ label: '抚松县',
+ value: '220621',
+ },
+ {
+ label: '靖宇县',
+ value: '220622',
+ },
+ {
+ label: '长白朝鲜族自治县',
+ value: '220623',
+ },
+ {
+ label: '临江市',
+ value: '220681',
+ },
+ ],
+ },
+ {
+ label: '松原市',
+ value: '220700',
+ children: [
+ {
+ label: '市辖区',
+ value: '220701',
+ },
+ {
+ label: '宁江区',
+ value: '220702',
+ },
+ {
+ label: '前郭尔罗斯蒙古族自治县',
+ value: '220721',
+ },
+ {
+ label: '长岭县',
+ value: '220722',
+ },
+ {
+ label: '乾安县',
+ value: '220723',
+ },
+ {
+ label: '扶余市',
+ value: '220781',
+ },
+ ],
+ },
+ {
+ label: '白城市',
+ value: '220800',
+ children: [
+ {
+ label: '市辖区',
+ value: '220801',
+ },
+ {
+ label: '洮北区',
+ value: '220802',
+ },
+ {
+ label: '镇赉县',
+ value: '220821',
+ },
+ {
+ label: '通榆县',
+ value: '220822',
+ },
+ {
+ label: '洮南市',
+ value: '220881',
+ },
+ {
+ label: '大安市',
+ value: '220882',
+ },
+ ],
+ },
+ {
+ label: '延边朝鲜族自治州',
+ value: '222400',
+ children: [
+ {
+ label: '延吉市',
+ value: '222401',
+ },
+ {
+ label: '图们市',
+ value: '222402',
+ },
+ {
+ label: '敦化市',
+ value: '222403',
+ },
+ {
+ label: '珲春市',
+ value: '222404',
+ },
+ {
+ label: '龙井市',
+ value: '222405',
+ },
+ {
+ label: '和龙市',
+ value: '222406',
+ },
+ {
+ label: '汪清县',
+ value: '222424',
+ },
+ {
+ label: '安图县',
+ value: '222426',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '黑龙江省',
+ value: '230000',
+ children: [
+ {
+ label: '哈尔滨市',
+ value: '230100',
+ children: [
+ {
+ label: '市辖区',
+ value: '230101',
+ },
+ {
+ label: '道里区',
+ value: '230102',
+ },
+ {
+ label: '南岗区',
+ value: '230103',
+ },
+ {
+ label: '道外区',
+ value: '230104',
+ },
+ {
+ label: '平房区',
+ value: '230108',
+ },
+ {
+ label: '松北区',
+ value: '230109',
+ },
+ {
+ label: '香坊区',
+ value: '230110',
+ },
+ {
+ label: '呼兰区',
+ value: '230111',
+ },
+ {
+ label: '阿城区',
+ value: '230112',
+ },
+ {
+ label: '双城区',
+ value: '230113',
+ },
+ {
+ label: '依兰县',
+ value: '230123',
+ },
+ {
+ label: '方正县',
+ value: '230124',
+ },
+ {
+ label: '宾县',
+ value: '230125',
+ },
+ {
+ label: '巴彦县',
+ value: '230126',
+ },
+ {
+ label: '木兰县',
+ value: '230127',
+ },
+ {
+ label: '通河县',
+ value: '230128',
+ },
+ {
+ label: '延寿县',
+ value: '230129',
+ },
+ {
+ label: '尚志市',
+ value: '230183',
+ },
+ {
+ label: '五常市',
+ value: '230184',
+ },
+ ],
+ },
+ {
+ label: '齐齐哈尔市',
+ value: '230200',
+ children: [
+ {
+ label: '市辖区',
+ value: '230201',
+ },
+ {
+ label: '龙沙区',
+ value: '230202',
+ },
+ {
+ label: '建华区',
+ value: '230203',
+ },
+ {
+ label: '铁锋区',
+ value: '230204',
+ },
+ {
+ label: '昂昂溪区',
+ value: '230205',
+ },
+ {
+ label: '富拉尔基区',
+ value: '230206',
+ },
+ {
+ label: '碾子山区',
+ value: '230207',
+ },
+ {
+ label: '梅里斯达斡尔族区',
+ value: '230208',
+ },
+ {
+ label: '龙江县',
+ value: '230221',
+ },
+ {
+ label: '依安县',
+ value: '230223',
+ },
+ {
+ label: '泰来县',
+ value: '230224',
+ },
+ {
+ label: '甘南县',
+ value: '230225',
+ },
+ {
+ label: '富裕县',
+ value: '230227',
+ },
+ {
+ label: '克山县',
+ value: '230229',
+ },
+ {
+ label: '克东县',
+ value: '230230',
+ },
+ {
+ label: '拜泉县',
+ value: '230231',
+ },
+ {
+ label: '讷河市',
+ value: '230281',
+ },
+ ],
+ },
+ {
+ label: '鸡西市',
+ value: '230300',
+ children: [
+ {
+ label: '市辖区',
+ value: '230301',
+ },
+ {
+ label: '鸡冠区',
+ value: '230302',
+ },
+ {
+ label: '恒山区',
+ value: '230303',
+ },
+ {
+ label: '滴道区',
+ value: '230304',
+ },
+ {
+ label: '梨树区',
+ value: '230305',
+ },
+ {
+ label: '城子河区',
+ value: '230306',
+ },
+ {
+ label: '麻山区',
+ value: '230307',
+ },
+ {
+ label: '鸡东县',
+ value: '230321',
+ },
+ {
+ label: '虎林市',
+ value: '230381',
+ },
+ {
+ label: '密山市',
+ value: '230382',
+ },
+ ],
+ },
+ {
+ label: '鹤岗市',
+ value: '230400',
+ children: [
+ {
+ label: '市辖区',
+ value: '230401',
+ },
+ {
+ label: '向阳区',
+ value: '230402',
+ },
+ {
+ label: '工农区',
+ value: '230403',
+ },
+ {
+ label: '南山区',
+ value: '230404',
+ },
+ {
+ label: '兴安区',
+ value: '230405',
+ },
+ {
+ label: '东山区',
+ value: '230406',
+ },
+ {
+ label: '兴山区',
+ value: '230407',
+ },
+ {
+ label: '萝北县',
+ value: '230421',
+ },
+ {
+ label: '绥滨县',
+ value: '230422',
+ },
+ ],
+ },
+ {
+ label: '双鸭山市',
+ value: '230500',
+ children: [
+ {
+ label: '市辖区',
+ value: '230501',
+ },
+ {
+ label: '尖山区',
+ value: '230502',
+ },
+ {
+ label: '岭东区',
+ value: '230503',
+ },
+ {
+ label: '四方台区',
+ value: '230505',
+ },
+ {
+ label: '宝山区',
+ value: '230506',
+ },
+ {
+ label: '集贤县',
+ value: '230521',
+ },
+ {
+ label: '友谊县',
+ value: '230522',
+ },
+ {
+ label: '宝清县',
+ value: '230523',
+ },
+ {
+ label: '饶河县',
+ value: '230524',
+ },
+ ],
+ },
+ {
+ label: '大庆市',
+ value: '230600',
+ children: [
+ {
+ label: '市辖区',
+ value: '230601',
+ },
+ {
+ label: '萨尔图区',
+ value: '230602',
+ },
+ {
+ label: '龙凤区',
+ value: '230603',
+ },
+ {
+ label: '让胡路区',
+ value: '230604',
+ },
+ {
+ label: '红岗区',
+ value: '230605',
+ },
+ {
+ label: '大同区',
+ value: '230606',
+ },
+ {
+ label: '肇州县',
+ value: '230621',
+ },
+ {
+ label: '肇源县',
+ value: '230622',
+ },
+ {
+ label: '林甸县',
+ value: '230623',
+ },
+ {
+ label: '杜尔伯特蒙古族自治县',
+ value: '230624',
+ },
+ ],
+ },
+ {
+ label: '伊春市',
+ value: '230700',
+ children: [
+ {
+ label: '市辖区',
+ value: '230701',
+ },
+ {
+ label: '伊春区',
+ value: '230702',
+ },
+ {
+ label: '南岔区',
+ value: '230703',
+ },
+ {
+ label: '友好区',
+ value: '230704',
+ },
+ {
+ label: '西林区',
+ value: '230705',
+ },
+ {
+ label: '翠峦区',
+ value: '230706',
+ },
+ {
+ label: '新青区',
+ value: '230707',
+ },
+ {
+ label: '美溪区',
+ value: '230708',
+ },
+ {
+ label: '金山屯区',
+ value: '230709',
+ },
+ {
+ label: '五营区',
+ value: '230710',
+ },
+ {
+ label: '乌马河区',
+ value: '230711',
+ },
+ {
+ label: '汤旺河区',
+ value: '230712',
+ },
+ {
+ label: '带岭区',
+ value: '230713',
+ },
+ {
+ label: '乌伊岭区',
+ value: '230714',
+ },
+ {
+ label: '红星区',
+ value: '230715',
+ },
+ {
+ label: '上甘岭区',
+ value: '230716',
+ },
+ {
+ label: '嘉荫县',
+ value: '230722',
+ },
+ {
+ label: '铁力市',
+ value: '230781',
+ },
+ ],
+ },
+ {
+ label: '佳木斯市',
+ value: '230800',
+ children: [
+ {
+ label: '市辖区',
+ value: '230801',
+ },
+ {
+ label: '向阳区',
+ value: '230803',
+ },
+ {
+ label: '前进区',
+ value: '230804',
+ },
+ {
+ label: '东风区',
+ value: '230805',
+ },
+ {
+ label: '郊区',
+ value: '230811',
+ },
+ {
+ label: '桦南县',
+ value: '230822',
+ },
+ {
+ label: '桦川县',
+ value: '230826',
+ },
+ {
+ label: '汤原县',
+ value: '230828',
+ },
+ {
+ label: '同江市',
+ value: '230881',
+ },
+ {
+ label: '富锦市',
+ value: '230882',
+ },
+ {
+ label: '抚远市',
+ value: '230883',
+ },
+ ],
+ },
+ {
+ label: '七台河市',
+ value: '230900',
+ children: [
+ {
+ label: '市辖区',
+ value: '230901',
+ },
+ {
+ label: '新兴区',
+ value: '230902',
+ },
+ {
+ label: '桃山区',
+ value: '230903',
+ },
+ {
+ label: '茄子河区',
+ value: '230904',
+ },
+ {
+ label: '勃利县',
+ value: '230921',
+ },
+ ],
+ },
+ {
+ label: '牡丹江市',
+ value: '231000',
+ children: [
+ {
+ label: '市辖区',
+ value: '231001',
+ },
+ {
+ label: '东安区',
+ value: '231002',
+ },
+ {
+ label: '阳明区',
+ value: '231003',
+ },
+ {
+ label: '爱民区',
+ value: '231004',
+ },
+ {
+ label: '西安区',
+ value: '231005',
+ },
+ {
+ label: '林口县',
+ value: '231025',
+ },
+ {
+ label: '绥芬河市',
+ value: '231081',
+ },
+ {
+ label: '海林市',
+ value: '231083',
+ },
+ {
+ label: '宁安市',
+ value: '231084',
+ },
+ {
+ label: '穆棱市',
+ value: '231085',
+ },
+ {
+ label: '东宁市',
+ value: '231086',
+ },
+ ],
+ },
+ {
+ label: '黑河市',
+ value: '231100',
+ children: [
+ {
+ label: '市辖区',
+ value: '231101',
+ },
+ {
+ label: '爱辉区',
+ value: '231102',
+ },
+ {
+ label: '嫩江县',
+ value: '231121',
+ },
+ {
+ label: '逊克县',
+ value: '231123',
+ },
+ {
+ label: '孙吴县',
+ value: '231124',
+ },
+ {
+ label: '北安市',
+ value: '231181',
+ },
+ {
+ label: '五大连池市',
+ value: '231182',
+ },
+ ],
+ },
+ {
+ label: '绥化市',
+ value: '231200',
+ children: [
+ {
+ label: '市辖区',
+ value: '231201',
+ },
+ {
+ label: '北林区',
+ value: '231202',
+ },
+ {
+ label: '望奎县',
+ value: '231221',
+ },
+ {
+ label: '兰西县',
+ value: '231222',
+ },
+ {
+ label: '青冈县',
+ value: '231223',
+ },
+ {
+ label: '庆安县',
+ value: '231224',
+ },
+ {
+ label: '明水县',
+ value: '231225',
+ },
+ {
+ label: '绥棱县',
+ value: '231226',
+ },
+ {
+ label: '安达市',
+ value: '231281',
+ },
+ {
+ label: '肇东市',
+ value: '231282',
+ },
+ {
+ label: '海伦市',
+ value: '231283',
+ },
+ ],
+ },
+ {
+ label: '大兴安岭地区',
+ value: '232700',
+ children: [
+ {
+ label: '呼玛县',
+ value: '232721',
+ },
+ {
+ label: '塔河县',
+ value: '232722',
+ },
+ {
+ label: '漠河县',
+ value: '232723',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '北京市',
+ value: '110000',
+ children: [
+ {
+ label: '市辖区',
+ value: '110100',
+ children: [
+ {
+ label: '东城区',
+ value: '110101',
+ },
+ {
+ label: '西城区',
+ value: '110102',
+ },
+ {
+ label: '朝阳区',
+ value: '110105',
+ },
+ {
+ label: '丰台区',
+ value: '110106',
+ },
+ {
+ label: '石景山区',
+ value: '110107',
+ },
+ {
+ label: '海淀区',
+ value: '110108',
+ },
+ {
+ label: '门头沟区',
+ value: '110109',
+ },
+ {
+ label: '房山区',
+ value: '110111',
+ },
+ {
+ label: '通州区',
+ value: '110112',
+ },
+ {
+ label: '顺义区',
+ value: '110113',
+ },
+ {
+ label: '昌平区',
+ value: '110114',
+ },
+ {
+ label: '大兴区',
+ value: '110115',
+ },
+ {
+ label: '怀柔区',
+ value: '110116',
+ },
+ {
+ label: '平谷区',
+ value: '110117',
+ },
+ {
+ label: '密云区',
+ value: '110118',
+ },
+ {
+ label: '延庆区',
+ value: '110119',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '天津市',
+ value: '120000',
+ children: [
+ {
+ label: '市辖区',
+ value: '120100',
+ children: [
+ {
+ label: '和平区',
+ value: '120101',
+ },
+ {
+ label: '河东区',
+ value: '120102',
+ },
+ {
+ label: '河西区',
+ value: '120103',
+ },
+ {
+ label: '南开区',
+ value: '120104',
+ },
+ {
+ label: '河北区',
+ value: '120105',
+ },
+ {
+ label: '红桥区',
+ value: '120106',
+ },
+ {
+ label: '东丽区',
+ value: '120110',
+ },
+ {
+ label: '西青区',
+ value: '120111',
+ },
+ {
+ label: '津南区',
+ value: '120112',
+ },
+ {
+ label: '北辰区',
+ value: '120113',
+ },
+ {
+ label: '武清区',
+ value: '120114',
+ },
+ {
+ label: '宝坻区',
+ value: '120115',
+ },
+ {
+ label: '滨海新区',
+ value: '120116',
+ },
+ {
+ label: '宁河区',
+ value: '120117',
+ },
+ {
+ label: '静海区',
+ value: '120118',
+ },
+ {
+ label: '蓟州区',
+ value: '120119',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '河北省',
+ value: '130000',
+ children: [
+ {
+ label: '石家庄市',
+ value: '130100',
+ children: [
+ {
+ label: '市辖区',
+ value: '130101',
+ },
+ {
+ label: '长安区',
+ value: '130102',
+ },
+ {
+ label: '桥西区',
+ value: '130104',
+ },
+ {
+ label: '新华区',
+ value: '130105',
+ },
+ {
+ label: '井陉矿区',
+ value: '130107',
+ },
+ {
+ label: '裕华区',
+ value: '130108',
+ },
+ {
+ label: '藁城区',
+ value: '130109',
+ },
+ {
+ label: '鹿泉区',
+ value: '130110',
+ },
+ {
+ label: '栾城区',
+ value: '130111',
+ },
+ {
+ label: '井陉县',
+ value: '130121',
+ },
+ {
+ label: '正定县',
+ value: '130123',
+ },
+ {
+ label: '行唐县',
+ value: '130125',
+ },
+ {
+ label: '灵寿县',
+ value: '130126',
+ },
+ {
+ label: '高邑县',
+ value: '130127',
+ },
+ {
+ label: '深泽县',
+ value: '130128',
+ },
+ {
+ label: '赞皇县',
+ value: '130129',
+ },
+ {
+ label: '无极县',
+ value: '130130',
+ },
+ {
+ label: '平山县',
+ value: '130131',
+ },
+ {
+ label: '元氏县',
+ value: '130132',
+ },
+ {
+ label: '赵县',
+ value: '130133',
+ },
+ {
+ label: '晋州市',
+ value: '130183',
+ },
+ {
+ label: '新乐市',
+ value: '130184',
+ },
+ ],
+ },
+ {
+ label: '唐山市',
+ value: '130200',
+ children: [
+ {
+ label: '市辖区',
+ value: '130201',
+ },
+ {
+ label: '路南区',
+ value: '130202',
+ },
+ {
+ label: '路北区',
+ value: '130203',
+ },
+ {
+ label: '古冶区',
+ value: '130204',
+ },
+ {
+ label: '开平区',
+ value: '130205',
+ },
+ {
+ label: '丰南区',
+ value: '130207',
+ },
+ {
+ label: '丰润区',
+ value: '130208',
+ },
+ {
+ label: '曹妃甸区',
+ value: '130209',
+ },
+ {
+ label: '滦县',
+ value: '130223',
+ },
+ {
+ label: '滦南县',
+ value: '130224',
+ },
+ {
+ label: '乐亭县',
+ value: '130225',
+ },
+ {
+ label: '迁西县',
+ value: '130227',
+ },
+ {
+ label: '玉田县',
+ value: '130229',
+ },
+ {
+ label: '遵化市',
+ value: '130281',
+ },
+ {
+ label: '迁安市',
+ value: '130283',
+ },
+ ],
+ },
+ {
+ label: '秦皇岛市',
+ value: '130300',
+ children: [
+ {
+ label: '市辖区',
+ value: '130301',
+ },
+ {
+ label: '海港区',
+ value: '130302',
+ },
+ {
+ label: '山海关区',
+ value: '130303',
+ },
+ {
+ label: '北戴河区',
+ value: '130304',
+ },
+ {
+ label: '抚宁区',
+ value: '130306',
+ },
+ {
+ label: '青龙满族自治县',
+ value: '130321',
+ },
+ {
+ label: '昌黎县',
+ value: '130322',
+ },
+ {
+ label: '卢龙县',
+ value: '130324',
+ },
+ ],
+ },
+ {
+ label: '邯郸市',
+ value: '130400',
+ children: [
+ {
+ label: '市辖区',
+ value: '130401',
+ },
+ {
+ label: '邯山区',
+ value: '130402',
+ },
+ {
+ label: '丛台区',
+ value: '130403',
+ },
+ {
+ label: '复兴区',
+ value: '130404',
+ },
+ {
+ label: '峰峰矿区',
+ value: '130406',
+ },
+ {
+ label: '邯郸县',
+ value: '130421',
+ },
+ {
+ label: '临漳县',
+ value: '130423',
+ },
+ {
+ label: '成安县',
+ value: '130424',
+ },
+ {
+ label: '大名县',
+ value: '130425',
+ },
+ {
+ label: '涉县',
+ value: '130426',
+ },
+ {
+ label: '磁县',
+ value: '130427',
+ },
+ {
+ label: '肥乡县',
+ value: '130428',
+ },
+ {
+ label: '永年县',
+ value: '130429',
+ },
+ {
+ label: '邱县',
+ value: '130430',
+ },
+ {
+ label: '鸡泽县',
+ value: '130431',
+ },
+ {
+ label: '广平县',
+ value: '130432',
+ },
+ {
+ label: '馆陶县',
+ value: '130433',
+ },
+ {
+ label: '魏县',
+ value: '130434',
+ },
+ {
+ label: '曲周县',
+ value: '130435',
+ },
+ {
+ label: '武安市',
+ value: '130481',
+ },
+ ],
+ },
+ {
+ label: '邢台市',
+ value: '130500',
+ children: [
+ {
+ label: '市辖区',
+ value: '130501',
+ },
+ {
+ label: '桥东区',
+ value: '130502',
+ },
+ {
+ label: '桥西区',
+ value: '130503',
+ },
+ {
+ label: '邢台县',
+ value: '130521',
+ },
+ {
+ label: '临城县',
+ value: '130522',
+ },
+ {
+ label: '内丘县',
+ value: '130523',
+ },
+ {
+ label: '柏乡县',
+ value: '130524',
+ },
+ {
+ label: '隆尧县',
+ value: '130525',
+ },
+ {
+ label: '任县',
+ value: '130526',
+ },
+ {
+ label: '南和县',
+ value: '130527',
+ },
+ {
+ label: '宁晋县',
+ value: '130528',
+ },
+ {
+ label: '巨鹿县',
+ value: '130529',
+ },
+ {
+ label: '新河县',
+ value: '130530',
+ },
+ {
+ label: '广宗县',
+ value: '130531',
+ },
+ {
+ label: '平乡县',
+ value: '130532',
+ },
+ {
+ label: '威县',
+ value: '130533',
+ },
+ {
+ label: '清河县',
+ value: '130534',
+ },
+ {
+ label: '临西县',
+ value: '130535',
+ },
+ {
+ label: '南宫市',
+ value: '130581',
+ },
+ {
+ label: '沙河市',
+ value: '130582',
+ },
+ ],
+ },
+ {
+ label: '保定市',
+ value: '130600',
+ children: [
+ {
+ label: '市辖区',
+ value: '130601',
+ },
+ {
+ label: '竞秀区',
+ value: '130602',
+ },
+ {
+ label: '莲池区',
+ value: '130606',
+ },
+ {
+ label: '满城区',
+ value: '130607',
+ },
+ {
+ label: '清苑区',
+ value: '130608',
+ },
+ {
+ label: '徐水区',
+ value: '130609',
+ },
+ {
+ label: '涞水县',
+ value: '130623',
+ },
+ {
+ label: '阜平县',
+ value: '130624',
+ },
+ {
+ label: '定兴县',
+ value: '130626',
+ },
+ {
+ label: '唐县',
+ value: '130627',
+ },
+ {
+ label: '高阳县',
+ value: '130628',
+ },
+ {
+ label: '容城县',
+ value: '130629',
+ },
+ {
+ label: '涞源县',
+ value: '130630',
+ },
+ {
+ label: '望都县',
+ value: '130631',
+ },
+ {
+ label: '安新县',
+ value: '130632',
+ },
+ {
+ label: '易县',
+ value: '130633',
+ },
+ {
+ label: '曲阳县',
+ value: '130634',
+ },
+ {
+ label: '蠡县',
+ value: '130635',
+ },
+ {
+ label: '顺平县',
+ value: '130636',
+ },
+ {
+ label: '博野县',
+ value: '130637',
+ },
+ {
+ label: '雄县',
+ value: '130638',
+ },
+ {
+ label: '涿州市',
+ value: '130681',
+ },
+ {
+ label: '安国市',
+ value: '130683',
+ },
+ {
+ label: '高碑店市',
+ value: '130684',
+ },
+ ],
+ },
+ {
+ label: '张家口市',
+ value: '130700',
+ children: [
+ {
+ label: '市辖区',
+ value: '130701',
+ },
+ {
+ label: '桥东区',
+ value: '130702',
+ },
+ {
+ label: '桥西区',
+ value: '130703',
+ },
+ {
+ label: '宣化区',
+ value: '130705',
+ },
+ {
+ label: '下花园区',
+ value: '130706',
+ },
+ {
+ label: '万全区',
+ value: '130708',
+ },
+ {
+ label: '崇礼区',
+ value: '130709',
+ },
+ {
+ label: '张北县',
+ value: '130722',
+ },
+ {
+ label: '康保县',
+ value: '130723',
+ },
+ {
+ label: '沽源县',
+ value: '130724',
+ },
+ {
+ label: '尚义县',
+ value: '130725',
+ },
+ {
+ label: '蔚县',
+ value: '130726',
+ },
+ {
+ label: '阳原县',
+ value: '130727',
+ },
+ {
+ label: '怀安县',
+ value: '130728',
+ },
+ {
+ label: '怀来县',
+ value: '130730',
+ },
+ {
+ label: '涿鹿县',
+ value: '130731',
+ },
+ {
+ label: '赤城县',
+ value: '130732',
+ },
+ ],
+ },
+ {
+ label: '承德市',
+ value: '130800',
+ children: [
+ {
+ label: '市辖区',
+ value: '130801',
+ },
+ {
+ label: '双桥区',
+ value: '130802',
+ },
+ {
+ label: '双滦区',
+ value: '130803',
+ },
+ {
+ label: '鹰手营子矿区',
+ value: '130804',
+ },
+ {
+ label: '承德县',
+ value: '130821',
+ },
+ {
+ label: '兴隆县',
+ value: '130822',
+ },
+ {
+ label: '平泉县',
+ value: '130823',
+ },
+ {
+ label: '滦平县',
+ value: '130824',
+ },
+ {
+ label: '隆化县',
+ value: '130825',
+ },
+ {
+ label: '丰宁满族自治县',
+ value: '130826',
+ },
+ {
+ label: '宽城满族自治县',
+ value: '130827',
+ },
+ {
+ label: '围场满族蒙古族自治县',
+ value: '130828',
+ },
+ ],
+ },
+ {
+ label: '沧州市',
+ value: '130900',
+ children: [
+ {
+ label: '市辖区',
+ value: '130901',
+ },
+ {
+ label: '新华区',
+ value: '130902',
+ },
+ {
+ label: '运河区',
+ value: '130903',
+ },
+ {
+ label: '沧县',
+ value: '130921',
+ },
+ {
+ label: '青县',
+ value: '130922',
+ },
+ {
+ label: '东光县',
+ value: '130923',
+ },
+ {
+ label: '海兴县',
+ value: '130924',
+ },
+ {
+ label: '盐山县',
+ value: '130925',
+ },
+ {
+ label: '肃宁县',
+ value: '130926',
+ },
+ {
+ label: '南皮县',
+ value: '130927',
+ },
+ {
+ label: '吴桥县',
+ value: '130928',
+ },
+ {
+ label: '献县',
+ value: '130929',
+ },
+ {
+ label: '孟村回族自治县',
+ value: '130930',
+ },
+ {
+ label: '泊头市',
+ value: '130981',
+ },
+ {
+ label: '任丘市',
+ value: '130982',
+ },
+ {
+ label: '黄骅市',
+ value: '130983',
+ },
+ {
+ label: '河间市',
+ value: '130984',
+ },
+ ],
+ },
+ {
+ label: '廊坊市',
+ value: '131000',
+ children: [
+ {
+ label: '市辖区',
+ value: '131001',
+ },
+ {
+ label: '安次区',
+ value: '131002',
+ },
+ {
+ label: '广阳区',
+ value: '131003',
+ },
+ {
+ label: '固安县',
+ value: '131022',
+ },
+ {
+ label: '永清县',
+ value: '131023',
+ },
+ {
+ label: '香河县',
+ value: '131024',
+ },
+ {
+ label: '大城县',
+ value: '131025',
+ },
+ {
+ label: '文安县',
+ value: '131026',
+ },
+ {
+ label: '大厂回族自治县',
+ value: '131028',
+ },
+ {
+ label: '霸州市',
+ value: '131081',
+ },
+ {
+ label: '三河市',
+ value: '131082',
+ },
+ ],
+ },
+ {
+ label: '衡水市',
+ value: '131100',
+ children: [
+ {
+ label: '市辖区',
+ value: '131101',
+ },
+ {
+ label: '桃城区',
+ value: '131102',
+ },
+ {
+ label: '冀州区',
+ value: '131103',
+ },
+ {
+ label: '枣强县',
+ value: '131121',
+ },
+ {
+ label: '武邑县',
+ value: '131122',
+ },
+ {
+ label: '武强县',
+ value: '131123',
+ },
+ {
+ label: '饶阳县',
+ value: '131124',
+ },
+ {
+ label: '安平县',
+ value: '131125',
+ },
+ {
+ label: '故城县',
+ value: '131126',
+ },
+ {
+ label: '景县',
+ value: '131127',
+ },
+ {
+ label: '阜城县',
+ value: '131128',
+ },
+ {
+ label: '深州市',
+ value: '131182',
+ },
+ ],
+ },
+ {
+ label: '省直辖县级行政区划',
+ value: '139000',
+ children: [
+ {
+ label: '定州市',
+ value: '139001',
+ },
+ {
+ label: '辛集市',
+ value: '139002',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '山西省',
+ value: '140000',
+ children: [
+ {
+ label: '太原市',
+ value: '140100',
+ children: [
+ {
+ label: '市辖区',
+ value: '140101',
+ },
+ {
+ label: '小店区',
+ value: '140105',
+ },
+ {
+ label: '迎泽区',
+ value: '140106',
+ },
+ {
+ label: '杏花岭区',
+ value: '140107',
+ },
+ {
+ label: '尖草坪区',
+ value: '140108',
+ },
+ {
+ label: '万柏林区',
+ value: '140109',
+ },
+ {
+ label: '晋源区',
+ value: '140110',
+ },
+ {
+ label: '清徐县',
+ value: '140121',
+ },
+ {
+ label: '阳曲县',
+ value: '140122',
+ },
+ {
+ label: '娄烦县',
+ value: '140123',
+ },
+ {
+ label: '古交市',
+ value: '140181',
+ },
+ ],
+ },
+ {
+ label: '大同市',
+ value: '140200',
+ children: [
+ {
+ label: '市辖区',
+ value: '140201',
+ },
+ {
+ label: '城区',
+ value: '140202',
+ },
+ {
+ label: '矿区',
+ value: '140203',
+ },
+ {
+ label: '南郊区',
+ value: '140211',
+ },
+ {
+ label: '新荣区',
+ value: '140212',
+ },
+ {
+ label: '阳高县',
+ value: '140221',
+ },
+ {
+ label: '天镇县',
+ value: '140222',
+ },
+ {
+ label: '广灵县',
+ value: '140223',
+ },
+ {
+ label: '灵丘县',
+ value: '140224',
+ },
+ {
+ label: '浑源县',
+ value: '140225',
+ },
+ {
+ label: '左云县',
+ value: '140226',
+ },
+ {
+ label: '大同县',
+ value: '140227',
+ },
+ ],
+ },
+ {
+ label: '阳泉市',
+ value: '140300',
+ children: [
+ {
+ label: '市辖区',
+ value: '140301',
+ },
+ {
+ label: '城区',
+ value: '140302',
+ },
+ {
+ label: '矿区',
+ value: '140303',
+ },
+ {
+ label: '郊区',
+ value: '140311',
+ },
+ {
+ label: '平定县',
+ value: '140321',
+ },
+ {
+ label: '盂县',
+ value: '140322',
+ },
+ ],
+ },
+ {
+ label: '长治市',
+ value: '140400',
+ children: [
+ {
+ label: '市辖区',
+ value: '140401',
+ },
+ {
+ label: '城区',
+ value: '140402',
+ },
+ {
+ label: '郊区',
+ value: '140411',
+ },
+ {
+ label: '长治县',
+ value: '140421',
+ },
+ {
+ label: '襄垣县',
+ value: '140423',
+ },
+ {
+ label: '屯留县',
+ value: '140424',
+ },
+ {
+ label: '平顺县',
+ value: '140425',
+ },
+ {
+ label: '黎城县',
+ value: '140426',
+ },
+ {
+ label: '壶关县',
+ value: '140427',
+ },
+ {
+ label: '长子县',
+ value: '140428',
+ },
+ {
+ label: '武乡县',
+ value: '140429',
+ },
+ {
+ label: '沁县',
+ value: '140430',
+ },
+ {
+ label: '沁源县',
+ value: '140431',
+ },
+ {
+ label: '潞城市',
+ value: '140481',
+ },
+ ],
+ },
+ {
+ label: '晋城市',
+ value: '140500',
+ children: [
+ {
+ label: '市辖区',
+ value: '140501',
+ },
+ {
+ label: '城区',
+ value: '140502',
+ },
+ {
+ label: '沁水县',
+ value: '140521',
+ },
+ {
+ label: '阳城县',
+ value: '140522',
+ },
+ {
+ label: '陵川县',
+ value: '140524',
+ },
+ {
+ label: '泽州县',
+ value: '140525',
+ },
+ {
+ label: '高平市',
+ value: '140581',
+ },
+ ],
+ },
+ {
+ label: '朔州市',
+ value: '140600',
+ children: [
+ {
+ label: '市辖区',
+ value: '140601',
+ },
+ {
+ label: '朔城区',
+ value: '140602',
+ },
+ {
+ label: '平鲁区',
+ value: '140603',
+ },
+ {
+ label: '山阴县',
+ value: '140621',
+ },
+ {
+ label: '应县',
+ value: '140622',
+ },
+ {
+ label: '右玉县',
+ value: '140623',
+ },
+ {
+ label: '怀仁县',
+ value: '140624',
+ },
+ ],
+ },
+ {
+ label: '晋中市',
+ value: '140700',
+ children: [
+ {
+ label: '市辖区',
+ value: '140701',
+ },
+ {
+ label: '榆次区',
+ value: '140702',
+ },
+ {
+ label: '榆社县',
+ value: '140721',
+ },
+ {
+ label: '左权县',
+ value: '140722',
+ },
+ {
+ label: '和顺县',
+ value: '140723',
+ },
+ {
+ label: '昔阳县',
+ value: '140724',
+ },
+ {
+ label: '寿阳县',
+ value: '140725',
+ },
+ {
+ label: '太谷县',
+ value: '140726',
+ },
+ {
+ label: '祁县',
+ value: '140727',
+ },
+ {
+ label: '平遥县',
+ value: '140728',
+ },
+ {
+ label: '灵石县',
+ value: '140729',
+ },
+ {
+ label: '介休市',
+ value: '140781',
+ },
+ ],
+ },
+ {
+ label: '运城市',
+ value: '140800',
+ children: [
+ {
+ label: '市辖区',
+ value: '140801',
+ },
+ {
+ label: '盐湖区',
+ value: '140802',
+ },
+ {
+ label: '临猗县',
+ value: '140821',
+ },
+ {
+ label: '万荣县',
+ value: '140822',
+ },
+ {
+ label: '闻喜县',
+ value: '140823',
+ },
+ {
+ label: '稷山县',
+ value: '140824',
+ },
+ {
+ label: '新绛县',
+ value: '140825',
+ },
+ {
+ label: '绛县',
+ value: '140826',
+ },
+ {
+ label: '垣曲县',
+ value: '140827',
+ },
+ {
+ label: '夏县',
+ value: '140828',
+ },
+ {
+ label: '平陆县',
+ value: '140829',
+ },
+ {
+ label: '芮城县',
+ value: '140830',
+ },
+ {
+ label: '永济市',
+ value: '140881',
+ },
+ {
+ label: '河津市',
+ value: '140882',
+ },
+ ],
+ },
+ {
+ label: '忻州市',
+ value: '140900',
+ children: [
+ {
+ label: '市辖区',
+ value: '140901',
+ },
+ {
+ label: '忻府区',
+ value: '140902',
+ },
+ {
+ label: '定襄县',
+ value: '140921',
+ },
+ {
+ label: '五台县',
+ value: '140922',
+ },
+ {
+ label: '代县',
+ value: '140923',
+ },
+ {
+ label: '繁峙县',
+ value: '140924',
+ },
+ {
+ label: '宁武县',
+ value: '140925',
+ },
+ {
+ label: '静乐县',
+ value: '140926',
+ },
+ {
+ label: '神池县',
+ value: '140927',
+ },
+ {
+ label: '五寨县',
+ value: '140928',
+ },
+ {
+ label: '岢岚县',
+ value: '140929',
+ },
+ {
+ label: '河曲县',
+ value: '140930',
+ },
+ {
+ label: '保德县',
+ value: '140931',
+ },
+ {
+ label: '偏关县',
+ value: '140932',
+ },
+ {
+ label: '原平市',
+ value: '140981',
+ },
+ ],
+ },
+ {
+ label: '临汾市',
+ value: '141000',
+ children: [
+ {
+ label: '市辖区',
+ value: '141001',
+ },
+ {
+ label: '尧都区',
+ value: '141002',
+ },
+ {
+ label: '曲沃县',
+ value: '141021',
+ },
+ {
+ label: '翼城县',
+ value: '141022',
+ },
+ {
+ label: '襄汾县',
+ value: '141023',
+ },
+ {
+ label: '洪洞县',
+ value: '141024',
+ },
+ {
+ label: '古县',
+ value: '141025',
+ },
+ {
+ label: '安泽县',
+ value: '141026',
+ },
+ {
+ label: '浮山县',
+ value: '141027',
+ },
+ {
+ label: '吉县',
+ value: '141028',
+ },
+ {
+ label: '乡宁县',
+ value: '141029',
+ },
+ {
+ label: '大宁县',
+ value: '141030',
+ },
+ {
+ label: '隰县',
+ value: '141031',
+ },
+ {
+ label: '永和县',
+ value: '141032',
+ },
+ {
+ label: '蒲县',
+ value: '141033',
+ },
+ {
+ label: '汾西县',
+ value: '141034',
+ },
+ {
+ label: '侯马市',
+ value: '141081',
+ },
+ {
+ label: '霍州市',
+ value: '141082',
+ },
+ ],
+ },
+ {
+ label: '吕梁市',
+ value: '141100',
+ children: [
+ {
+ label: '市辖区',
+ value: '141101',
+ },
+ {
+ label: '离石区',
+ value: '141102',
+ },
+ {
+ label: '文水县',
+ value: '141121',
+ },
+ {
+ label: '交城县',
+ value: '141122',
+ },
+ {
+ label: '兴县',
+ value: '141123',
+ },
+ {
+ label: '临县',
+ value: '141124',
+ },
+ {
+ label: '柳林县',
+ value: '141125',
+ },
+ {
+ label: '石楼县',
+ value: '141126',
+ },
+ {
+ label: '岚县',
+ value: '141127',
+ },
+ {
+ label: '方山县',
+ value: '141128',
+ },
+ {
+ label: '中阳县',
+ value: '141129',
+ },
+ {
+ label: '交口县',
+ value: '141130',
+ },
+ {
+ label: '孝义市',
+ value: '141181',
+ },
+ {
+ label: '汾阳市',
+ value: '141182',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '内蒙古自治区',
+ value: '150000',
+ children: [
+ {
+ label: '呼和浩特市',
+ value: '150100',
+ children: [
+ {
+ label: '市辖区',
+ value: '150101',
+ },
+ {
+ label: '新城区',
+ value: '150102',
+ },
+ {
+ label: '回民区',
+ value: '150103',
+ },
+ {
+ label: '玉泉区',
+ value: '150104',
+ },
+ {
+ label: '赛罕区',
+ value: '150105',
+ },
+ {
+ label: '土默特左旗',
+ value: '150121',
+ },
+ {
+ label: '托克托县',
+ value: '150122',
+ },
+ {
+ label: '和林格尔县',
+ value: '150123',
+ },
+ {
+ label: '清水河县',
+ value: '150124',
+ },
+ {
+ label: '武川县',
+ value: '150125',
+ },
+ ],
+ },
+ {
+ label: '包头市',
+ value: '150200',
+ children: [
+ {
+ label: '市辖区',
+ value: '150201',
+ },
+ {
+ label: '东河区',
+ value: '150202',
+ },
+ {
+ label: '昆都仑区',
+ value: '150203',
+ },
+ {
+ label: '青山区',
+ value: '150204',
+ },
+ {
+ label: '石拐区',
+ value: '150205',
+ },
+ {
+ label: '白云鄂博矿区',
+ value: '150206',
+ },
+ {
+ label: '九原区',
+ value: '150207',
+ },
+ {
+ label: '土默特右旗',
+ value: '150221',
+ },
+ {
+ label: '固阳县',
+ value: '150222',
+ },
+ {
+ label: '达尔罕茂明安联合旗',
+ value: '150223',
+ },
+ ],
+ },
+ {
+ label: '乌海市',
+ value: '150300',
+ children: [
+ {
+ label: '市辖区',
+ value: '150301',
+ },
+ {
+ label: '海勃湾区',
+ value: '150302',
+ },
+ {
+ label: '海南区',
+ value: '150303',
+ },
+ {
+ label: '乌达区',
+ value: '150304',
+ },
+ ],
+ },
+ {
+ label: '赤峰市',
+ value: '150400',
+ children: [
+ {
+ label: '市辖区',
+ value: '150401',
+ },
+ {
+ label: '红山区',
+ value: '150402',
+ },
+ {
+ label: '元宝山区',
+ value: '150403',
+ },
+ {
+ label: '松山区',
+ value: '150404',
+ },
+ {
+ label: '阿鲁科尔沁旗',
+ value: '150421',
+ },
+ {
+ label: '巴林左旗',
+ value: '150422',
+ },
+ {
+ label: '巴林右旗',
+ value: '150423',
+ },
+ {
+ label: '林西县',
+ value: '150424',
+ },
+ {
+ label: '克什克腾旗',
+ value: '150425',
+ },
+ {
+ label: '翁牛特旗',
+ value: '150426',
+ },
+ {
+ label: '喀喇沁旗',
+ value: '150428',
+ },
+ {
+ label: '宁城县',
+ value: '150429',
+ },
+ {
+ label: '敖汉旗',
+ value: '150430',
+ },
+ ],
+ },
+ {
+ label: '通辽市',
+ value: '150500',
+ children: [
+ {
+ label: '市辖区',
+ value: '150501',
+ },
+ {
+ label: '科尔沁区',
+ value: '150502',
+ },
+ {
+ label: '科尔沁左翼中旗',
+ value: '150521',
+ },
+ {
+ label: '科尔沁左翼后旗',
+ value: '150522',
+ },
+ {
+ label: '开鲁县',
+ value: '150523',
+ },
+ {
+ label: '库伦旗',
+ value: '150524',
+ },
+ {
+ label: '奈曼旗',
+ value: '150525',
+ },
+ {
+ label: '扎鲁特旗',
+ value: '150526',
+ },
+ {
+ label: '霍林郭勒市',
+ value: '150581',
+ },
+ ],
+ },
+ {
+ label: '鄂尔多斯市',
+ value: '150600',
+ children: [
+ {
+ label: '市辖区',
+ value: '150601',
+ },
+ {
+ label: '东胜区',
+ value: '150602',
+ },
+ {
+ label: '康巴什区',
+ value: '150603',
+ },
+ {
+ label: '达拉特旗',
+ value: '150621',
+ },
+ {
+ label: '准格尔旗',
+ value: '150622',
+ },
+ {
+ label: '鄂托克前旗',
+ value: '150623',
+ },
+ {
+ label: '鄂托克旗',
+ value: '150624',
+ },
+ {
+ label: '杭锦旗',
+ value: '150625',
+ },
+ {
+ label: '乌审旗',
+ value: '150626',
+ },
+ {
+ label: '伊金霍洛旗',
+ value: '150627',
+ },
+ ],
+ },
+ {
+ label: '呼伦贝尔市',
+ value: '150700',
+ children: [
+ {
+ label: '市辖区',
+ value: '150701',
+ },
+ {
+ label: '海拉尔区',
+ value: '150702',
+ },
+ {
+ label: '扎赉诺尔区',
+ value: '150703',
+ },
+ {
+ label: '阿荣旗',
+ value: '150721',
+ },
+ {
+ label: '莫力达瓦达斡尔族自治旗',
+ value: '150722',
+ },
+ {
+ label: '鄂伦春自治旗',
+ value: '150723',
+ },
+ {
+ label: '鄂温克族自治旗',
+ value: '150724',
+ },
+ {
+ label: '陈巴尔虎旗',
+ value: '150725',
+ },
+ {
+ label: '新巴尔虎左旗',
+ value: '150726',
+ },
+ {
+ label: '新巴尔虎右旗',
+ value: '150727',
+ },
+ {
+ label: '满洲里市',
+ value: '150781',
+ },
+ {
+ label: '牙克石市',
+ value: '150782',
+ },
+ {
+ label: '扎兰屯市',
+ value: '150783',
+ },
+ {
+ label: '额尔古纳市',
+ value: '150784',
+ },
+ {
+ label: '根河市',
+ value: '150785',
+ },
+ ],
+ },
+ {
+ label: '巴彦淖尔市',
+ value: '150800',
+ children: [
+ {
+ label: '市辖区',
+ value: '150801',
+ },
+ {
+ label: '临河区',
+ value: '150802',
+ },
+ {
+ label: '五原县',
+ value: '150821',
+ },
+ {
+ label: '磴口县',
+ value: '150822',
+ },
+ {
+ label: '乌拉特前旗',
+ value: '150823',
+ },
+ {
+ label: '乌拉特中旗',
+ value: '150824',
+ },
+ {
+ label: '乌拉特后旗',
+ value: '150825',
+ },
+ {
+ label: '杭锦后旗',
+ value: '150826',
+ },
+ ],
+ },
+ {
+ label: '乌兰察布市',
+ value: '150900',
+ children: [
+ {
+ label: '市辖区',
+ value: '150901',
+ },
+ {
+ label: '集宁区',
+ value: '150902',
+ },
+ {
+ label: '卓资县',
+ value: '150921',
+ },
+ {
+ label: '化德县',
+ value: '150922',
+ },
+ {
+ label: '商都县',
+ value: '150923',
+ },
+ {
+ label: '兴和县',
+ value: '150924',
+ },
+ {
+ label: '凉城县',
+ value: '150925',
+ },
+ {
+ label: '察哈尔右翼前旗',
+ value: '150926',
+ },
+ {
+ label: '察哈尔右翼中旗',
+ value: '150927',
+ },
+ {
+ label: '察哈尔右翼后旗',
+ value: '150928',
+ },
+ {
+ label: '四子王旗',
+ value: '150929',
+ },
+ {
+ label: '丰镇市',
+ value: '150981',
+ },
+ ],
+ },
+ {
+ label: '兴安盟',
+ value: '152200',
+ children: [
+ {
+ label: '乌兰浩特市',
+ value: '152201',
+ },
+ {
+ label: '阿尔山市',
+ value: '152202',
+ },
+ {
+ label: '科尔沁右翼前旗',
+ value: '152221',
+ },
+ {
+ label: '科尔沁右翼中旗',
+ value: '152222',
+ },
+ {
+ label: '扎赉特旗',
+ value: '152223',
+ },
+ {
+ label: '突泉县',
+ value: '152224',
+ },
+ ],
+ },
+ {
+ label: '锡林郭勒盟',
+ value: '152500',
+ children: [
+ {
+ label: '二连浩特市',
+ value: '152501',
+ },
+ {
+ label: '锡林浩特市',
+ value: '152502',
+ },
+ {
+ label: '阿巴嘎旗',
+ value: '152522',
+ },
+ {
+ label: '苏尼特左旗',
+ value: '152523',
+ },
+ {
+ label: '苏尼特右旗',
+ value: '152524',
+ },
+ {
+ label: '东乌珠穆沁旗',
+ value: '152525',
+ },
+ {
+ label: '西乌珠穆沁旗',
+ value: '152526',
+ },
+ {
+ label: '太仆寺旗',
+ value: '152527',
+ },
+ {
+ label: '镶黄旗',
+ value: '152528',
+ },
+ {
+ label: '正镶白旗',
+ value: '152529',
+ },
+ {
+ label: '正蓝旗',
+ value: '152530',
+ },
+ {
+ label: '多伦县',
+ value: '152531',
+ },
+ ],
+ },
+ {
+ label: '阿拉善盟',
+ value: '152900',
+ children: [
+ {
+ label: '阿拉善左旗',
+ value: '152921',
+ },
+ {
+ label: '阿拉善右旗',
+ value: '152922',
+ },
+ {
+ label: '额济纳旗',
+ value: '152923',
+ },
+ ],
+ },
+ ],
+ },
+
+ {
+ label: '上海市',
+ value: '310000',
+ children: [
+ {
+ label: '市辖区',
+ value: '310100',
+ children: [
+ {
+ label: '黄浦区',
+ value: '310101',
+ },
+ {
+ label: '徐汇区',
+ value: '310104',
+ },
+ {
+ label: '长宁区',
+ value: '310105',
+ },
+ {
+ label: '静安区',
+ value: '310106',
+ },
+ {
+ label: '普陀区',
+ value: '310107',
+ },
+ {
+ label: '虹口区',
+ value: '310109',
+ },
+ {
+ label: '杨浦区',
+ value: '310110',
+ },
+ {
+ label: '闵行区',
+ value: '310112',
+ },
+ {
+ label: '宝山区',
+ value: '310113',
+ },
+ {
+ label: '嘉定区',
+ value: '310114',
+ },
+ {
+ label: '浦东新区',
+ value: '310115',
+ },
+ {
+ label: '金山区',
+ value: '310116',
+ },
+ {
+ label: '松江区',
+ value: '310117',
+ },
+ {
+ label: '青浦区',
+ value: '310118',
+ },
+ {
+ label: '奉贤区',
+ value: '310120',
+ },
+ {
+ label: '崇明区',
+ value: '310151',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '江苏省',
+ value: '320000',
+ children: [
+ {
+ label: '南京市',
+ value: '320100',
+ children: [
+ {
+ label: '市辖区',
+ value: '320101',
+ },
+ {
+ label: '玄武区',
+ value: '320102',
+ },
+ {
+ label: '秦淮区',
+ value: '320104',
+ },
+ {
+ label: '建邺区',
+ value: '320105',
+ },
+ {
+ label: '鼓楼区',
+ value: '320106',
+ },
+ {
+ label: '浦口区',
+ value: '320111',
+ },
+ {
+ label: '栖霞区',
+ value: '320113',
+ },
+ {
+ label: '雨花台区',
+ value: '320114',
+ },
+ {
+ label: '江宁区',
+ value: '320115',
+ },
+ {
+ label: '六合区',
+ value: '320116',
+ },
+ {
+ label: '溧水区',
+ value: '320117',
+ },
+ {
+ label: '高淳区',
+ value: '320118',
+ },
+ ],
+ },
+ {
+ label: '无锡市',
+ value: '320200',
+ children: [
+ {
+ label: '市辖区',
+ value: '320201',
+ },
+ {
+ label: '锡山区',
+ value: '320205',
+ },
+ {
+ label: '惠山区',
+ value: '320206',
+ },
+ {
+ label: '滨湖区',
+ value: '320211',
+ },
+ {
+ label: '梁溪区',
+ value: '320213',
+ },
+ {
+ label: '新吴区',
+ value: '320214',
+ },
+ {
+ label: '江阴市',
+ value: '320281',
+ },
+ {
+ label: '宜兴市',
+ value: '320282',
+ },
+ ],
+ },
+ {
+ label: '徐州市',
+ value: '320300',
+ children: [
+ {
+ label: '市辖区',
+ value: '320301',
+ },
+ {
+ label: '鼓楼区',
+ value: '320302',
+ },
+ {
+ label: '云龙区',
+ value: '320303',
+ },
+ {
+ label: '贾汪区',
+ value: '320305',
+ },
+ {
+ label: '泉山区',
+ value: '320311',
+ },
+ {
+ label: '铜山区',
+ value: '320312',
+ },
+ {
+ label: '丰县',
+ value: '320321',
+ },
+ {
+ label: '沛县',
+ value: '320322',
+ },
+ {
+ label: '睢宁县',
+ value: '320324',
+ },
+ {
+ label: '新沂市',
+ value: '320381',
+ },
+ {
+ label: '邳州市',
+ value: '320382',
+ },
+ ],
+ },
+ {
+ label: '常州市',
+ value: '320400',
+ children: [
+ {
+ label: '市辖区',
+ value: '320401',
+ },
+ {
+ label: '天宁区',
+ value: '320402',
+ },
+ {
+ label: '钟楼区',
+ value: '320404',
+ },
+ {
+ label: '新北区',
+ value: '320411',
+ },
+ {
+ label: '武进区',
+ value: '320412',
+ },
+ {
+ label: '金坛区',
+ value: '320413',
+ },
+ {
+ label: '溧阳市',
+ value: '320481',
+ },
+ ],
+ },
+ {
+ label: '苏州市',
+ value: '320500',
+ children: [
+ {
+ label: '市辖区',
+ value: '320501',
+ },
+ {
+ label: '虎丘区',
+ value: '320505',
+ },
+ {
+ label: '吴中区',
+ value: '320506',
+ },
+ {
+ label: '相城区',
+ value: '320507',
+ },
+ {
+ label: '姑苏区',
+ value: '320508',
+ },
+ {
+ label: '吴江区',
+ value: '320509',
+ },
+ {
+ label: '常熟市',
+ value: '320581',
+ },
+ {
+ label: '张家港市',
+ value: '320582',
+ },
+ {
+ label: '昆山市',
+ value: '320583',
+ },
+ {
+ label: '太仓市',
+ value: '320585',
+ },
+ ],
+ },
+ {
+ label: '南通市',
+ value: '320600',
+ children: [
+ {
+ label: '市辖区',
+ value: '320601',
+ },
+ {
+ label: '崇川区',
+ value: '320602',
+ },
+ {
+ label: '港闸区',
+ value: '320611',
+ },
+ {
+ label: '通州区',
+ value: '320612',
+ },
+ {
+ label: '海安县',
+ value: '320621',
+ },
+ {
+ label: '如东县',
+ value: '320623',
+ },
+ {
+ label: '启东市',
+ value: '320681',
+ },
+ {
+ label: '如皋市',
+ value: '320682',
+ },
+ {
+ label: '海门市',
+ value: '320684',
+ },
+ ],
+ },
+ {
+ label: '连云港市',
+ value: '320700',
+ children: [
+ {
+ label: '市辖区',
+ value: '320701',
+ },
+ {
+ label: '连云区',
+ value: '320703',
+ },
+ {
+ label: '海州区',
+ value: '320706',
+ },
+ {
+ label: '赣榆区',
+ value: '320707',
+ },
+ {
+ label: '东海县',
+ value: '320722',
+ },
+ {
+ label: '灌云县',
+ value: '320723',
+ },
+ {
+ label: '灌南县',
+ value: '320724',
+ },
+ ],
+ },
+ {
+ label: '淮安市',
+ value: '320800',
+ children: [
+ {
+ label: '市辖区',
+ value: '320801',
+ },
+ {
+ label: '淮安区',
+ value: '320803',
+ },
+ {
+ label: '淮阴区',
+ value: '320804',
+ },
+ {
+ label: '清江浦区',
+ value: '320812',
+ },
+ {
+ label: '洪泽区',
+ value: '320813',
+ },
+ {
+ label: '涟水县',
+ value: '320826',
+ },
+ {
+ label: '盱眙县',
+ value: '320830',
+ },
+ {
+ label: '金湖县',
+ value: '320831',
+ },
+ ],
+ },
+ {
+ label: '盐城市',
+ value: '320900',
+ children: [
+ {
+ label: '市辖区',
+ value: '320901',
+ },
+ {
+ label: '亭湖区',
+ value: '320902',
+ },
+ {
+ label: '盐都区',
+ value: '320903',
+ },
+ {
+ label: '大丰区',
+ value: '320904',
+ },
+ {
+ label: '响水县',
+ value: '320921',
+ },
+ {
+ label: '滨海县',
+ value: '320922',
+ },
+ {
+ label: '阜宁县',
+ value: '320923',
+ },
+ {
+ label: '射阳县',
+ value: '320924',
+ },
+ {
+ label: '建湖县',
+ value: '320925',
+ },
+ {
+ label: '东台市',
+ value: '320981',
+ },
+ ],
+ },
+ {
+ label: '扬州市',
+ value: '321000',
+ children: [
+ {
+ label: '市辖区',
+ value: '321001',
+ },
+ {
+ label: '广陵区',
+ value: '321002',
+ },
+ {
+ label: '邗江区',
+ value: '321003',
+ },
+ {
+ label: '江都区',
+ value: '321012',
+ },
+ {
+ label: '宝应县',
+ value: '321023',
+ },
+ {
+ label: '仪征市',
+ value: '321081',
+ },
+ {
+ label: '高邮市',
+ value: '321084',
+ },
+ ],
+ },
+ {
+ label: '镇江市',
+ value: '321100',
+ children: [
+ {
+ label: '市辖区',
+ value: '321101',
+ },
+ {
+ label: '京口区',
+ value: '321102',
+ },
+ {
+ label: '润州区',
+ value: '321111',
+ },
+ {
+ label: '丹徒区',
+ value: '321112',
+ },
+ {
+ label: '丹阳市',
+ value: '321181',
+ },
+ {
+ label: '扬中市',
+ value: '321182',
+ },
+ {
+ label: '句容市',
+ value: '321183',
+ },
+ ],
+ },
+ {
+ label: '泰州市',
+ value: '321200',
+ children: [
+ {
+ label: '市辖区',
+ value: '321201',
+ },
+ {
+ label: '海陵区',
+ value: '321202',
+ },
+ {
+ label: '高港区',
+ value: '321203',
+ },
+ {
+ label: '姜堰区',
+ value: '321204',
+ },
+ {
+ label: '兴化市',
+ value: '321281',
+ },
+ {
+ label: '靖江市',
+ value: '321282',
+ },
+ {
+ label: '泰兴市',
+ value: '321283',
+ },
+ ],
+ },
+ {
+ label: '宿迁市',
+ value: '321300',
+ children: [
+ {
+ label: '市辖区',
+ value: '321301',
+ },
+ {
+ label: '宿城区',
+ value: '321302',
+ },
+ {
+ label: '宿豫区',
+ value: '321311',
+ },
+ {
+ label: '沭阳县',
+ value: '321322',
+ },
+ {
+ label: '泗阳县',
+ value: '321323',
+ },
+ {
+ label: '泗洪县',
+ value: '321324',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '浙江省',
+ value: '330000',
+ children: [
+ {
+ label: '杭州市',
+ value: '330100',
+ children: [
+ {
+ label: '市辖区',
+ value: '330101',
+ },
+ {
+ label: '上城区',
+ value: '330102',
+ },
+ {
+ label: '下城区',
+ value: '330103',
+ },
+ {
+ label: '江干区',
+ value: '330104',
+ },
+ {
+ label: '拱墅区',
+ value: '330105',
+ },
+ {
+ label: '西湖区',
+ value: '330106',
+ },
+ {
+ label: '滨江区',
+ value: '330108',
+ },
+ {
+ label: '萧山区',
+ value: '330109',
+ },
+ {
+ label: '余杭区',
+ value: '330110',
+ },
+ {
+ label: '富阳区',
+ value: '330111',
+ },
+ {
+ label: '桐庐县',
+ value: '330122',
+ },
+ {
+ label: '淳安县',
+ value: '330127',
+ },
+ {
+ label: '建德市',
+ value: '330182',
+ },
+ {
+ label: '临安市',
+ value: '330185',
+ },
+ ],
+ },
+ {
+ label: '宁波市',
+ value: '330200',
+ children: [
+ {
+ label: '市辖区',
+ value: '330201',
+ },
+ {
+ label: '海曙区',
+ value: '330203',
+ },
+ {
+ label: '江东区',
+ value: '330204',
+ },
+ {
+ label: '江北区',
+ value: '330205',
+ },
+ {
+ label: '北仑区',
+ value: '330206',
+ },
+ {
+ label: '镇海区',
+ value: '330211',
+ },
+ {
+ label: '鄞州区',
+ value: '330212',
+ },
+ {
+ label: '象山县',
+ value: '330225',
+ },
+ {
+ label: '宁海县',
+ value: '330226',
+ },
+ {
+ label: '余姚市',
+ value: '330281',
+ },
+ {
+ label: '慈溪市',
+ value: '330282',
+ },
+ {
+ label: '奉化市',
+ value: '330283',
+ },
+ ],
+ },
+ {
+ label: '温州市',
+ value: '330300',
+ children: [
+ {
+ label: '市辖区',
+ value: '330301',
+ },
+ {
+ label: '鹿城区',
+ value: '330302',
+ },
+ {
+ label: '龙湾区',
+ value: '330303',
+ },
+ {
+ label: '瓯海区',
+ value: '330304',
+ },
+ {
+ label: '洞头区',
+ value: '330305',
+ },
+ {
+ label: '永嘉县',
+ value: '330324',
+ },
+ {
+ label: '平阳县',
+ value: '330326',
+ },
+ {
+ label: '苍南县',
+ value: '330327',
+ },
+ {
+ label: '文成县',
+ value: '330328',
+ },
+ {
+ label: '泰顺县',
+ value: '330329',
+ },
+ {
+ label: '瑞安市',
+ value: '330381',
+ },
+ {
+ label: '乐清市',
+ value: '330382',
+ },
+ ],
+ },
+ {
+ label: '嘉兴市',
+ value: '330400',
+ children: [
+ {
+ label: '市辖区',
+ value: '330401',
+ },
+ {
+ label: '南湖区',
+ value: '330402',
+ },
+ {
+ label: '秀洲区',
+ value: '330411',
+ },
+ {
+ label: '嘉善县',
+ value: '330421',
+ },
+ {
+ label: '海盐县',
+ value: '330424',
+ },
+ {
+ label: '海宁市',
+ value: '330481',
+ },
+ {
+ label: '平湖市',
+ value: '330482',
+ },
+ {
+ label: '桐乡市',
+ value: '330483',
+ },
+ ],
+ },
+ {
+ label: '湖州市',
+ value: '330500',
+ children: [
+ {
+ label: '市辖区',
+ value: '330501',
+ },
+ {
+ label: '吴兴区',
+ value: '330502',
+ },
+ {
+ label: '南浔区',
+ value: '330503',
+ },
+ {
+ label: '德清县',
+ value: '330521',
+ },
+ {
+ label: '长兴县',
+ value: '330522',
+ },
+ {
+ label: '安吉县',
+ value: '330523',
+ },
+ ],
+ },
+ {
+ label: '绍兴市',
+ value: '330600',
+ children: [
+ {
+ label: '市辖区',
+ value: '330601',
+ },
+ {
+ label: '越城区',
+ value: '330602',
+ },
+ {
+ label: '柯桥区',
+ value: '330603',
+ },
+ {
+ label: '上虞区',
+ value: '330604',
+ },
+ {
+ label: '新昌县',
+ value: '330624',
+ },
+ {
+ label: '诸暨市',
+ value: '330681',
+ },
+ {
+ label: '嵊州市',
+ value: '330683',
+ },
+ ],
+ },
+ {
+ label: '金华市',
+ value: '330700',
+ children: [
+ {
+ label: '市辖区',
+ value: '330701',
+ },
+ {
+ label: '婺城区',
+ value: '330702',
+ },
+ {
+ label: '金东区',
+ value: '330703',
+ },
+ {
+ label: '武义县',
+ value: '330723',
+ },
+ {
+ label: '浦江县',
+ value: '330726',
+ },
+ {
+ label: '磐安县',
+ value: '330727',
+ },
+ {
+ label: '兰溪市',
+ value: '330781',
+ },
+ {
+ label: '义乌市',
+ value: '330782',
+ },
+ {
+ label: '东阳市',
+ value: '330783',
+ },
+ {
+ label: '永康市',
+ value: '330784',
+ },
+ ],
+ },
+ {
+ label: '衢州市',
+ value: '330800',
+ children: [
+ {
+ label: '市辖区',
+ value: '330801',
+ },
+ {
+ label: '柯城区',
+ value: '330802',
+ },
+ {
+ label: '衢江区',
+ value: '330803',
+ },
+ {
+ label: '常山县',
+ value: '330822',
+ },
+ {
+ label: '开化县',
+ value: '330824',
+ },
+ {
+ label: '龙游县',
+ value: '330825',
+ },
+ {
+ label: '江山市',
+ value: '330881',
+ },
+ ],
+ },
+ {
+ label: '舟山市',
+ value: '330900',
+ children: [
+ {
+ label: '市辖区',
+ value: '330901',
+ },
+ {
+ label: '定海区',
+ value: '330902',
+ },
+ {
+ label: '普陀区',
+ value: '330903',
+ },
+ {
+ label: '岱山县',
+ value: '330921',
+ },
+ {
+ label: '嵊泗县',
+ value: '330922',
+ },
+ ],
+ },
+ {
+ label: '台州市',
+ value: '331000',
+ children: [
+ {
+ label: '市辖区',
+ value: '331001',
+ },
+ {
+ label: '椒江区',
+ value: '331002',
+ },
+ {
+ label: '黄岩区',
+ value: '331003',
+ },
+ {
+ label: '路桥区',
+ value: '331004',
+ },
+ {
+ label: '玉环县',
+ value: '331021',
+ },
+ {
+ label: '三门县',
+ value: '331022',
+ },
+ {
+ label: '天台县',
+ value: '331023',
+ },
+ {
+ label: '仙居县',
+ value: '331024',
+ },
+ {
+ label: '温岭市',
+ value: '331081',
+ },
+ {
+ label: '临海市',
+ value: '331082',
+ },
+ ],
+ },
+ {
+ label: '丽水市',
+ value: '331100',
+ children: [
+ {
+ label: '市辖区',
+ value: '331101',
+ },
+ {
+ label: '莲都区',
+ value: '331102',
+ },
+ {
+ label: '青田县',
+ value: '331121',
+ },
+ {
+ label: '缙云县',
+ value: '331122',
+ },
+ {
+ label: '遂昌县',
+ value: '331123',
+ },
+ {
+ label: '松阳县',
+ value: '331124',
+ },
+ {
+ label: '云和县',
+ value: '331125',
+ },
+ {
+ label: '庆元县',
+ value: '331126',
+ },
+ {
+ label: '景宁畲族自治县',
+ value: '331127',
+ },
+ {
+ label: '龙泉市',
+ value: '331181',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '安徽省',
+ value: '340000',
+ children: [
+ {
+ label: '合肥市',
+ value: '340100',
+ children: [
+ {
+ label: '市辖区',
+ value: '340101',
+ },
+ {
+ label: '瑶海区',
+ value: '340102',
+ },
+ {
+ label: '庐阳区',
+ value: '340103',
+ },
+ {
+ label: '蜀山区',
+ value: '340104',
+ },
+ {
+ label: '包河区',
+ value: '340111',
+ },
+ {
+ label: '长丰县',
+ value: '340121',
+ },
+ {
+ label: '肥东县',
+ value: '340122',
+ },
+ {
+ label: '肥西县',
+ value: '340123',
+ },
+ {
+ label: '庐江县',
+ value: '340124',
+ },
+ {
+ label: '巢湖市',
+ value: '340181',
+ },
+ ],
+ },
+ {
+ label: '芜湖市',
+ value: '340200',
+ children: [
+ {
+ label: '市辖区',
+ value: '340201',
+ },
+ {
+ label: '镜湖区',
+ value: '340202',
+ },
+ {
+ label: '弋江区',
+ value: '340203',
+ },
+ {
+ label: '鸠江区',
+ value: '340207',
+ },
+ {
+ label: '三山区',
+ value: '340208',
+ },
+ {
+ label: '芜湖县',
+ value: '340221',
+ },
+ {
+ label: '繁昌县',
+ value: '340222',
+ },
+ {
+ label: '南陵县',
+ value: '340223',
+ },
+ {
+ label: '无为县',
+ value: '340225',
+ },
+ ],
+ },
+ {
+ label: '蚌埠市',
+ value: '340300',
+ children: [
+ {
+ label: '市辖区',
+ value: '340301',
+ },
+ {
+ label: '龙子湖区',
+ value: '340302',
+ },
+ {
+ label: '蚌山区',
+ value: '340303',
+ },
+ {
+ label: '禹会区',
+ value: '340304',
+ },
+ {
+ label: '淮上区',
+ value: '340311',
+ },
+ {
+ label: '怀远县',
+ value: '340321',
+ },
+ {
+ label: '五河县',
+ value: '340322',
+ },
+ {
+ label: '固镇县',
+ value: '340323',
+ },
+ ],
+ },
+ {
+ label: '淮南市',
+ value: '340400',
+ children: [
+ {
+ label: '市辖区',
+ value: '340401',
+ },
+ {
+ label: '大通区',
+ value: '340402',
+ },
+ {
+ label: '田家庵区',
+ value: '340403',
+ },
+ {
+ label: '谢家集区',
+ value: '340404',
+ },
+ {
+ label: '八公山区',
+ value: '340405',
+ },
+ {
+ label: '潘集区',
+ value: '340406',
+ },
+ {
+ label: '凤台县',
+ value: '340421',
+ },
+ {
+ label: '寿县',
+ value: '340422',
+ },
+ ],
+ },
+ {
+ label: '马鞍山市',
+ value: '340500',
+ children: [
+ {
+ label: '市辖区',
+ value: '340501',
+ },
+ {
+ label: '花山区',
+ value: '340503',
+ },
+ {
+ label: '雨山区',
+ value: '340504',
+ },
+ {
+ label: '博望区',
+ value: '340506',
+ },
+ {
+ label: '当涂县',
+ value: '340521',
+ },
+ {
+ label: '含山县',
+ value: '340522',
+ },
+ {
+ label: '和县',
+ value: '340523',
+ },
+ ],
+ },
+ {
+ label: '淮北市',
+ value: '340600',
+ children: [
+ {
+ label: '市辖区',
+ value: '340601',
+ },
+ {
+ label: '杜集区',
+ value: '340602',
+ },
+ {
+ label: '相山区',
+ value: '340603',
+ },
+ {
+ label: '烈山区',
+ value: '340604',
+ },
+ {
+ label: '濉溪县',
+ value: '340621',
+ },
+ ],
+ },
+ {
+ label: '铜陵市',
+ value: '340700',
+ children: [
+ {
+ label: '市辖区',
+ value: '340701',
+ },
+ {
+ label: '铜官区',
+ value: '340705',
+ },
+ {
+ label: '义安区',
+ value: '340706',
+ },
+ {
+ label: '郊区',
+ value: '340711',
+ },
+ {
+ label: '枞阳县',
+ value: '340722',
+ },
+ ],
+ },
+ {
+ label: '安庆市',
+ value: '340800',
+ children: [
+ {
+ label: '市辖区',
+ value: '340801',
+ },
+ {
+ label: '迎江区',
+ value: '340802',
+ },
+ {
+ label: '大观区',
+ value: '340803',
+ },
+ {
+ label: '宜秀区',
+ value: '340811',
+ },
+ {
+ label: '怀宁县',
+ value: '340822',
+ },
+ {
+ label: '潜山县',
+ value: '340824',
+ },
+ {
+ label: '太湖县',
+ value: '340825',
+ },
+ {
+ label: '宿松县',
+ value: '340826',
+ },
+ {
+ label: '望江县',
+ value: '340827',
+ },
+ {
+ label: '岳西县',
+ value: '340828',
+ },
+ {
+ label: '桐城市',
+ value: '340881',
+ },
+ ],
+ },
+ {
+ label: '黄山市',
+ value: '341000',
+ children: [
+ {
+ label: '市辖区',
+ value: '341001',
+ },
+ {
+ label: '屯溪区',
+ value: '341002',
+ },
+ {
+ label: '黄山区',
+ value: '341003',
+ },
+ {
+ label: '徽州区',
+ value: '341004',
+ },
+ {
+ label: '歙县',
+ value: '341021',
+ },
+ {
+ label: '休宁县',
+ value: '341022',
+ },
+ {
+ label: '黟县',
+ value: '341023',
+ },
+ {
+ label: '祁门县',
+ value: '341024',
+ },
+ ],
+ },
+ {
+ label: '滁州市',
+ value: '341100',
+ children: [
+ {
+ label: '市辖区',
+ value: '341101',
+ },
+ {
+ label: '琅琊区',
+ value: '341102',
+ },
+ {
+ label: '南谯区',
+ value: '341103',
+ },
+ {
+ label: '来安县',
+ value: '341122',
+ },
+ {
+ label: '全椒县',
+ value: '341124',
+ },
+ {
+ label: '定远县',
+ value: '341125',
+ },
+ {
+ label: '凤阳县',
+ value: '341126',
+ },
+ {
+ label: '天长市',
+ value: '341181',
+ },
+ {
+ label: '明光市',
+ value: '341182',
+ },
+ ],
+ },
+ {
+ label: '阜阳市',
+ value: '341200',
+ children: [
+ {
+ label: '市辖区',
+ value: '341201',
+ },
+ {
+ label: '颍州区',
+ value: '341202',
+ },
+ {
+ label: '颍东区',
+ value: '341203',
+ },
+ {
+ label: '颍泉区',
+ value: '341204',
+ },
+ {
+ label: '临泉县',
+ value: '341221',
+ },
+ {
+ label: '太和县',
+ value: '341222',
+ },
+ {
+ label: '阜南县',
+ value: '341225',
+ },
+ {
+ label: '颍上县',
+ value: '341226',
+ },
+ {
+ label: '界首市',
+ value: '341282',
+ },
+ ],
+ },
+ {
+ label: '宿州市',
+ value: '341300',
+ children: [
+ {
+ label: '市辖区',
+ value: '341301',
+ },
+ {
+ label: '埇桥区',
+ value: '341302',
+ },
+ {
+ label: '砀山县',
+ value: '341321',
+ },
+ {
+ label: '萧县',
+ value: '341322',
+ },
+ {
+ label: '灵璧县',
+ value: '341323',
+ },
+ {
+ label: '泗县',
+ value: '341324',
+ },
+ ],
+ },
+ {
+ label: '六安市',
+ value: '341500',
+ children: [
+ {
+ label: '市辖区',
+ value: '341501',
+ },
+ {
+ label: '金安区',
+ value: '341502',
+ },
+ {
+ label: '裕安区',
+ value: '341503',
+ },
+ {
+ label: '叶集区',
+ value: '341504',
+ },
+ {
+ label: '霍邱县',
+ value: '341522',
+ },
+ {
+ label: '舒城县',
+ value: '341523',
+ },
+ {
+ label: '金寨县',
+ value: '341524',
+ },
+ {
+ label: '霍山县',
+ value: '341525',
+ },
+ ],
+ },
+ {
+ label: '亳州市',
+ value: '341600',
+ children: [
+ {
+ label: '市辖区',
+ value: '341601',
+ },
+ {
+ label: '谯城区',
+ value: '341602',
+ },
+ {
+ label: '涡阳县',
+ value: '341621',
+ },
+ {
+ label: '蒙城县',
+ value: '341622',
+ },
+ {
+ label: '利辛县',
+ value: '341623',
+ },
+ ],
+ },
+ {
+ label: '池州市',
+ value: '341700',
+ children: [
+ {
+ label: '市辖区',
+ value: '341701',
+ },
+ {
+ label: '贵池区',
+ value: '341702',
+ },
+ {
+ label: '东至县',
+ value: '341721',
+ },
+ {
+ label: '石台县',
+ value: '341722',
+ },
+ {
+ label: '青阳县',
+ value: '341723',
+ },
+ ],
+ },
+ {
+ label: '宣城市',
+ value: '341800',
+ children: [
+ {
+ label: '市辖区',
+ value: '341801',
+ },
+ {
+ label: '宣州区',
+ value: '341802',
+ },
+ {
+ label: '郎溪县',
+ value: '341821',
+ },
+ {
+ label: '广德县',
+ value: '341822',
+ },
+ {
+ label: '泾县',
+ value: '341823',
+ },
+ {
+ label: '绩溪县',
+ value: '341824',
+ },
+ {
+ label: '旌德县',
+ value: '341825',
+ },
+ {
+ label: '宁国市',
+ value: '341881',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '福建省',
+ value: '350000',
+ children: [
+ {
+ label: '福州市',
+ value: '350100',
+ children: [
+ {
+ label: '市辖区',
+ value: '350101',
+ },
+ {
+ label: '鼓楼区',
+ value: '350102',
+ },
+ {
+ label: '台江区',
+ value: '350103',
+ },
+ {
+ label: '仓山区',
+ value: '350104',
+ },
+ {
+ label: '马尾区',
+ value: '350105',
+ },
+ {
+ label: '晋安区',
+ value: '350111',
+ },
+ {
+ label: '闽侯县',
+ value: '350121',
+ },
+ {
+ label: '连江县',
+ value: '350122',
+ },
+ {
+ label: '罗源县',
+ value: '350123',
+ },
+ {
+ label: '闽清县',
+ value: '350124',
+ },
+ {
+ label: '永泰县',
+ value: '350125',
+ },
+ {
+ label: '平潭县',
+ value: '350128',
+ },
+ {
+ label: '福清市',
+ value: '350181',
+ },
+ {
+ label: '长乐市',
+ value: '350182',
+ },
+ ],
+ },
+ {
+ label: '厦门市',
+ value: '350200',
+ children: [
+ {
+ label: '市辖区',
+ value: '350201',
+ },
+ {
+ label: '思明区',
+ value: '350203',
+ },
+ {
+ label: '海沧区',
+ value: '350205',
+ },
+ {
+ label: '湖里区',
+ value: '350206',
+ },
+ {
+ label: '集美区',
+ value: '350211',
+ },
+ {
+ label: '同安区',
+ value: '350212',
+ },
+ {
+ label: '翔安区',
+ value: '350213',
+ },
+ ],
+ },
+ {
+ label: '莆田市',
+ value: '350300',
+ children: [
+ {
+ label: '市辖区',
+ value: '350301',
+ },
+ {
+ label: '城厢区',
+ value: '350302',
+ },
+ {
+ label: '涵江区',
+ value: '350303',
+ },
+ {
+ label: '荔城区',
+ value: '350304',
+ },
+ {
+ label: '秀屿区',
+ value: '350305',
+ },
+ {
+ label: '仙游县',
+ value: '350322',
+ },
+ ],
+ },
+ {
+ label: '三明市',
+ value: '350400',
+ children: [
+ {
+ label: '市辖区',
+ value: '350401',
+ },
+ {
+ label: '梅列区',
+ value: '350402',
+ },
+ {
+ label: '三元区',
+ value: '350403',
+ },
+ {
+ label: '明溪县',
+ value: '350421',
+ },
+ {
+ label: '清流县',
+ value: '350423',
+ },
+ {
+ label: '宁化县',
+ value: '350424',
+ },
+ {
+ label: '大田县',
+ value: '350425',
+ },
+ {
+ label: '尤溪县',
+ value: '350426',
+ },
+ {
+ label: '沙县',
+ value: '350427',
+ },
+ {
+ label: '将乐县',
+ value: '350428',
+ },
+ {
+ label: '泰宁县',
+ value: '350429',
+ },
+ {
+ label: '建宁县',
+ value: '350430',
+ },
+ {
+ label: '永安市',
+ value: '350481',
+ },
+ ],
+ },
+ {
+ label: '泉州市',
+ value: '350500',
+ children: [
+ {
+ label: '市辖区',
+ value: '350501',
+ },
+ {
+ label: '鲤城区',
+ value: '350502',
+ },
+ {
+ label: '丰泽区',
+ value: '350503',
+ },
+ {
+ label: '洛江区',
+ value: '350504',
+ },
+ {
+ label: '泉港区',
+ value: '350505',
+ },
+ {
+ label: '惠安县',
+ value: '350521',
+ },
+ {
+ label: '安溪县',
+ value: '350524',
+ },
+ {
+ label: '永春县',
+ value: '350525',
+ },
+ {
+ label: '德化县',
+ value: '350526',
+ },
+ {
+ label: '金门县',
+ value: '350527',
+ },
+ {
+ label: '石狮市',
+ value: '350581',
+ },
+ {
+ label: '晋江市',
+ value: '350582',
+ },
+ {
+ label: '南安市',
+ value: '350583',
+ },
+ ],
+ },
+ {
+ label: '漳州市',
+ value: '350600',
+ children: [
+ {
+ label: '市辖区',
+ value: '350601',
+ },
+ {
+ label: '芗城区',
+ value: '350602',
+ },
+ {
+ label: '龙文区',
+ value: '350603',
+ },
+ {
+ label: '云霄县',
+ value: '350622',
+ },
+ {
+ label: '漳浦县',
+ value: '350623',
+ },
+ {
+ label: '诏安县',
+ value: '350624',
+ },
+ {
+ label: '长泰县',
+ value: '350625',
+ },
+ {
+ label: '东山县',
+ value: '350626',
+ },
+ {
+ label: '南靖县',
+ value: '350627',
+ },
+ {
+ label: '平和县',
+ value: '350628',
+ },
+ {
+ label: '华安县',
+ value: '350629',
+ },
+ {
+ label: '龙海市',
+ value: '350681',
+ },
+ ],
+ },
+ {
+ label: '南平市',
+ value: '350700',
+ children: [
+ {
+ label: '市辖区',
+ value: '350701',
+ },
+ {
+ label: '延平区',
+ value: '350702',
+ },
+ {
+ label: '建阳区',
+ value: '350703',
+ },
+ {
+ label: '顺昌县',
+ value: '350721',
+ },
+ {
+ label: '浦城县',
+ value: '350722',
+ },
+ {
+ label: '光泽县',
+ value: '350723',
+ },
+ {
+ label: '松溪县',
+ value: '350724',
+ },
+ {
+ label: '政和县',
+ value: '350725',
+ },
+ {
+ label: '邵武市',
+ value: '350781',
+ },
+ {
+ label: '武夷山市',
+ value: '350782',
+ },
+ {
+ label: '建瓯市',
+ value: '350783',
+ },
+ ],
+ },
+ {
+ label: '龙岩市',
+ value: '350800',
+ children: [
+ {
+ label: '市辖区',
+ value: '350801',
+ },
+ {
+ label: '新罗区',
+ value: '350802',
+ },
+ {
+ label: '永定区',
+ value: '350803',
+ },
+ {
+ label: '长汀县',
+ value: '350821',
+ },
+ {
+ label: '上杭县',
+ value: '350823',
+ },
+ {
+ label: '武平县',
+ value: '350824',
+ },
+ {
+ label: '连城县',
+ value: '350825',
+ },
+ {
+ label: '漳平市',
+ value: '350881',
+ },
+ ],
+ },
+ {
+ label: '宁德市',
+ value: '350900',
+ children: [
+ {
+ label: '市辖区',
+ value: '350901',
+ },
+ {
+ label: '蕉城区',
+ value: '350902',
+ },
+ {
+ label: '霞浦县',
+ value: '350921',
+ },
+ {
+ label: '古田县',
+ value: '350922',
+ },
+ {
+ label: '屏南县',
+ value: '350923',
+ },
+ {
+ label: '寿宁县',
+ value: '350924',
+ },
+ {
+ label: '周宁县',
+ value: '350925',
+ },
+ {
+ label: '柘荣县',
+ value: '350926',
+ },
+ {
+ label: '福安市',
+ value: '350981',
+ },
+ {
+ label: '福鼎市',
+ value: '350982',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '江西省',
+ value: '360000',
+ children: [
+ {
+ label: '南昌市',
+ value: '360100',
+ children: [
+ {
+ label: '市辖区',
+ value: '360101',
+ },
+ {
+ label: '东湖区',
+ value: '360102',
+ },
+ {
+ label: '西湖区',
+ value: '360103',
+ },
+ {
+ label: '青云谱区',
+ value: '360104',
+ },
+ {
+ label: '湾里区',
+ value: '360105',
+ },
+ {
+ label: '青山湖区',
+ value: '360111',
+ },
+ {
+ label: '新建区',
+ value: '360112',
+ },
+ {
+ label: '南昌县',
+ value: '360121',
+ },
+ {
+ label: '安义县',
+ value: '360123',
+ },
+ {
+ label: '进贤县',
+ value: '360124',
+ },
+ ],
+ },
+ {
+ label: '景德镇市',
+ value: '360200',
+ children: [
+ {
+ label: '市辖区',
+ value: '360201',
+ },
+ {
+ label: '昌江区',
+ value: '360202',
+ },
+ {
+ label: '珠山区',
+ value: '360203',
+ },
+ {
+ label: '浮梁县',
+ value: '360222',
+ },
+ {
+ label: '乐平市',
+ value: '360281',
+ },
+ ],
+ },
+ {
+ label: '萍乡市',
+ value: '360300',
+ children: [
+ {
+ label: '市辖区',
+ value: '360301',
+ },
+ {
+ label: '安源区',
+ value: '360302',
+ },
+ {
+ label: '湘东区',
+ value: '360313',
+ },
+ {
+ label: '莲花县',
+ value: '360321',
+ },
+ {
+ label: '上栗县',
+ value: '360322',
+ },
+ {
+ label: '芦溪县',
+ value: '360323',
+ },
+ ],
+ },
+ {
+ label: '九江市',
+ value: '360400',
+ children: [
+ {
+ label: '市辖区',
+ value: '360401',
+ },
+ {
+ label: '濂溪区',
+ value: '360402',
+ },
+ {
+ label: '浔阳区',
+ value: '360403',
+ },
+ {
+ label: '九江县',
+ value: '360421',
+ },
+ {
+ label: '武宁县',
+ value: '360423',
+ },
+ {
+ label: '修水县',
+ value: '360424',
+ },
+ {
+ label: '永修县',
+ value: '360425',
+ },
+ {
+ label: '德安县',
+ value: '360426',
+ },
+ {
+ label: '都昌县',
+ value: '360428',
+ },
+ {
+ label: '湖口县',
+ value: '360429',
+ },
+ {
+ label: '彭泽县',
+ value: '360430',
+ },
+ {
+ label: '瑞昌市',
+ value: '360481',
+ },
+ {
+ label: '共青城市',
+ value: '360482',
+ },
+ {
+ label: '庐山市',
+ value: '360483',
+ },
+ ],
+ },
+ {
+ label: '新余市',
+ value: '360500',
+ children: [
+ {
+ label: '市辖区',
+ value: '360501',
+ },
+ {
+ label: '渝水区',
+ value: '360502',
+ },
+ {
+ label: '分宜县',
+ value: '360521',
+ },
+ ],
+ },
+ {
+ label: '鹰潭市',
+ value: '360600',
+ children: [
+ {
+ label: '市辖区',
+ value: '360601',
+ },
+ {
+ label: '月湖区',
+ value: '360602',
+ },
+ {
+ label: '余江县',
+ value: '360622',
+ },
+ {
+ label: '贵溪市',
+ value: '360681',
+ },
+ ],
+ },
+ {
+ label: '赣州市',
+ value: '360700',
+ children: [
+ {
+ label: '市辖区',
+ value: '360701',
+ },
+ {
+ label: '章贡区',
+ value: '360702',
+ },
+ {
+ label: '南康区',
+ value: '360703',
+ },
+ {
+ label: '赣县',
+ value: '360721',
+ },
+ {
+ label: '信丰县',
+ value: '360722',
+ },
+ {
+ label: '大余县',
+ value: '360723',
+ },
+ {
+ label: '上犹县',
+ value: '360724',
+ },
+ {
+ label: '崇义县',
+ value: '360725',
+ },
+ {
+ label: '安远县',
+ value: '360726',
+ },
+ {
+ label: '龙南县',
+ value: '360727',
+ },
+ {
+ label: '定南县',
+ value: '360728',
+ },
+ {
+ label: '全南县',
+ value: '360729',
+ },
+ {
+ label: '宁都县',
+ value: '360730',
+ },
+ {
+ label: '于都县',
+ value: '360731',
+ },
+ {
+ label: '兴国县',
+ value: '360732',
+ },
+ {
+ label: '会昌县',
+ value: '360733',
+ },
+ {
+ label: '寻乌县',
+ value: '360734',
+ },
+ {
+ label: '石城县',
+ value: '360735',
+ },
+ {
+ label: '瑞金市',
+ value: '360781',
+ },
+ ],
+ },
+ {
+ label: '吉安市',
+ value: '360800',
+ children: [
+ {
+ label: '市辖区',
+ value: '360801',
+ },
+ {
+ label: '吉州区',
+ value: '360802',
+ },
+ {
+ label: '青原区',
+ value: '360803',
+ },
+ {
+ label: '吉安县',
+ value: '360821',
+ },
+ {
+ label: '吉水县',
+ value: '360822',
+ },
+ {
+ label: '峡江县',
+ value: '360823',
+ },
+ {
+ label: '新干县',
+ value: '360824',
+ },
+ {
+ label: '永丰县',
+ value: '360825',
+ },
+ {
+ label: '泰和县',
+ value: '360826',
+ },
+ {
+ label: '遂川县',
+ value: '360827',
+ },
+ {
+ label: '万安县',
+ value: '360828',
+ },
+ {
+ label: '安福县',
+ value: '360829',
+ },
+ {
+ label: '永新县',
+ value: '360830',
+ },
+ {
+ label: '井冈山市',
+ value: '360881',
+ },
+ ],
+ },
+ {
+ label: '宜春市',
+ value: '360900',
+ children: [
+ {
+ label: '市辖区',
+ value: '360901',
+ },
+ {
+ label: '袁州区',
+ value: '360902',
+ },
+ {
+ label: '奉新县',
+ value: '360921',
+ },
+ {
+ label: '万载县',
+ value: '360922',
+ },
+ {
+ label: '上高县',
+ value: '360923',
+ },
+ {
+ label: '宜丰县',
+ value: '360924',
+ },
+ {
+ label: '靖安县',
+ value: '360925',
+ },
+ {
+ label: '铜鼓县',
+ value: '360926',
+ },
+ {
+ label: '丰城市',
+ value: '360981',
+ },
+ {
+ label: '樟树市',
+ value: '360982',
+ },
+ {
+ label: '高安市',
+ value: '360983',
+ },
+ ],
+ },
+ {
+ label: '抚州市',
+ value: '361000',
+ children: [
+ {
+ label: '市辖区',
+ value: '361001',
+ },
+ {
+ label: '临川区',
+ value: '361002',
+ },
+ {
+ label: '南城县',
+ value: '361021',
+ },
+ {
+ label: '黎川县',
+ value: '361022',
+ },
+ {
+ label: '南丰县',
+ value: '361023',
+ },
+ {
+ label: '崇仁县',
+ value: '361024',
+ },
+ {
+ label: '乐安县',
+ value: '361025',
+ },
+ {
+ label: '宜黄县',
+ value: '361026',
+ },
+ {
+ label: '金溪县',
+ value: '361027',
+ },
+ {
+ label: '资溪县',
+ value: '361028',
+ },
+ {
+ label: '东乡县',
+ value: '361029',
+ },
+ {
+ label: '广昌县',
+ value: '361030',
+ },
+ ],
+ },
+ {
+ label: '上饶市',
+ value: '361100',
+ children: [
+ {
+ label: '市辖区',
+ value: '361101',
+ },
+ {
+ label: '信州区',
+ value: '361102',
+ },
+ {
+ label: '广丰区',
+ value: '361103',
+ },
+ {
+ label: '上饶县',
+ value: '361121',
+ },
+ {
+ label: '玉山县',
+ value: '361123',
+ },
+ {
+ label: '铅山县',
+ value: '361124',
+ },
+ {
+ label: '横峰县',
+ value: '361125',
+ },
+ {
+ label: '弋阳县',
+ value: '361126',
+ },
+ {
+ label: '余干县',
+ value: '361127',
+ },
+ {
+ label: '鄱阳县',
+ value: '361128',
+ },
+ {
+ label: '万年县',
+ value: '361129',
+ },
+ {
+ label: '婺源县',
+ value: '361130',
+ },
+ {
+ label: '德兴市',
+ value: '361181',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '山东省',
+ value: '370000',
+ children: [
+ {
+ label: '济南市',
+ value: '370100',
+ children: [
+ {
+ label: '市辖区',
+ value: '370101',
+ },
+ {
+ label: '历下区',
+ value: '370102',
+ },
+ {
+ label: '市中区',
+ value: '370103',
+ },
+ {
+ label: '槐荫区',
+ value: '370104',
+ },
+ {
+ label: '天桥区',
+ value: '370105',
+ },
+ {
+ label: '历城区',
+ value: '370112',
+ },
+ {
+ label: '长清区',
+ value: '370113',
+ },
+ {
+ label: '平阴县',
+ value: '370124',
+ },
+ {
+ label: '济阳县',
+ value: '370125',
+ },
+ {
+ label: '商河县',
+ value: '370126',
+ },
+ {
+ label: '章丘市',
+ value: '370181',
+ },
+ ],
+ },
+ {
+ label: '青岛市',
+ value: '370200',
+ children: [
+ {
+ label: '市辖区',
+ value: '370201',
+ },
+ {
+ label: '市南区',
+ value: '370202',
+ },
+ {
+ label: '市北区',
+ value: '370203',
+ },
+ {
+ label: '黄岛区',
+ value: '370211',
+ },
+ {
+ label: '崂山区',
+ value: '370212',
+ },
+ {
+ label: '李沧区',
+ value: '370213',
+ },
+ {
+ label: '城阳区',
+ value: '370214',
+ },
+ {
+ label: '胶州市',
+ value: '370281',
+ },
+ {
+ label: '即墨市',
+ value: '370282',
+ },
+ {
+ label: '平度市',
+ value: '370283',
+ },
+ {
+ label: '莱西市',
+ value: '370285',
+ },
+ ],
+ },
+ {
+ label: '淄博市',
+ value: '370300',
+ children: [
+ {
+ label: '市辖区',
+ value: '370301',
+ },
+ {
+ label: '淄川区',
+ value: '370302',
+ },
+ {
+ label: '张店区',
+ value: '370303',
+ },
+ {
+ label: '博山区',
+ value: '370304',
+ },
+ {
+ label: '临淄区',
+ value: '370305',
+ },
+ {
+ label: '周村区',
+ value: '370306',
+ },
+ {
+ label: '桓台县',
+ value: '370321',
+ },
+ {
+ label: '高青县',
+ value: '370322',
+ },
+ {
+ label: '沂源县',
+ value: '370323',
+ },
+ ],
+ },
+ {
+ label: '枣庄市',
+ value: '370400',
+ children: [
+ {
+ label: '市辖区',
+ value: '370401',
+ },
+ {
+ label: '市中区',
+ value: '370402',
+ },
+ {
+ label: '薛城区',
+ value: '370403',
+ },
+ {
+ label: '峄城区',
+ value: '370404',
+ },
+ {
+ label: '台儿庄区',
+ value: '370405',
+ },
+ {
+ label: '山亭区',
+ value: '370406',
+ },
+ {
+ label: '滕州市',
+ value: '370481',
+ },
+ ],
+ },
+ {
+ label: '东营市',
+ value: '370500',
+ children: [
+ {
+ label: '市辖区',
+ value: '370501',
+ },
+ {
+ label: '东营区',
+ value: '370502',
+ },
+ {
+ label: '河口区',
+ value: '370503',
+ },
+ {
+ label: '垦利区',
+ value: '370505',
+ },
+ {
+ label: '利津县',
+ value: '370522',
+ },
+ {
+ label: '广饶县',
+ value: '370523',
+ },
+ ],
+ },
+ {
+ label: '烟台市',
+ value: '370600',
+ children: [
+ {
+ label: '市辖区',
+ value: '370601',
+ },
+ {
+ label: '芝罘区',
+ value: '370602',
+ },
+ {
+ label: '福山区',
+ value: '370611',
+ },
+ {
+ label: '牟平区',
+ value: '370612',
+ },
+ {
+ label: '莱山区',
+ value: '370613',
+ },
+ {
+ label: '长岛县',
+ value: '370634',
+ },
+ {
+ label: '龙口市',
+ value: '370681',
+ },
+ {
+ label: '莱阳市',
+ value: '370682',
+ },
+ {
+ label: '莱州市',
+ value: '370683',
+ },
+ {
+ label: '蓬莱市',
+ value: '370684',
+ },
+ {
+ label: '招远市',
+ value: '370685',
+ },
+ {
+ label: '栖霞市',
+ value: '370686',
+ },
+ {
+ label: '海阳市',
+ value: '370687',
+ },
+ ],
+ },
+ {
+ label: '潍坊市',
+ value: '370700',
+ children: [
+ {
+ label: '市辖区',
+ value: '370701',
+ },
+ {
+ label: '潍城区',
+ value: '370702',
+ },
+ {
+ label: '寒亭区',
+ value: '370703',
+ },
+ {
+ label: '坊子区',
+ value: '370704',
+ },
+ {
+ label: '奎文区',
+ value: '370705',
+ },
+ {
+ label: '临朐县',
+ value: '370724',
+ },
+ {
+ label: '昌乐县',
+ value: '370725',
+ },
+ {
+ label: '青州市',
+ value: '370781',
+ },
+ {
+ label: '诸城市',
+ value: '370782',
+ },
+ {
+ label: '寿光市',
+ value: '370783',
+ },
+ {
+ label: '安丘市',
+ value: '370784',
+ },
+ {
+ label: '高密市',
+ value: '370785',
+ },
+ {
+ label: '昌邑市',
+ value: '370786',
+ },
+ ],
+ },
+ {
+ label: '济宁市',
+ value: '370800',
+ children: [
+ {
+ label: '市辖区',
+ value: '370801',
+ },
+ {
+ label: '任城区',
+ value: '370811',
+ },
+ {
+ label: '兖州区',
+ value: '370812',
+ },
+ {
+ label: '微山县',
+ value: '370826',
+ },
+ {
+ label: '鱼台县',
+ value: '370827',
+ },
+ {
+ label: '金乡县',
+ value: '370828',
+ },
+ {
+ label: '嘉祥县',
+ value: '370829',
+ },
+ {
+ label: '汶上县',
+ value: '370830',
+ },
+ {
+ label: '泗水县',
+ value: '370831',
+ },
+ {
+ label: '梁山县',
+ value: '370832',
+ },
+ {
+ label: '曲阜市',
+ value: '370881',
+ },
+ {
+ label: '邹城市',
+ value: '370883',
+ },
+ ],
+ },
+ {
+ label: '泰安市',
+ value: '370900',
+ children: [
+ {
+ label: '市辖区',
+ value: '370901',
+ },
+ {
+ label: '泰山区',
+ value: '370902',
+ },
+ {
+ label: '岱岳区',
+ value: '370911',
+ },
+ {
+ label: '宁阳县',
+ value: '370921',
+ },
+ {
+ label: '东平县',
+ value: '370923',
+ },
+ {
+ label: '新泰市',
+ value: '370982',
+ },
+ {
+ label: '肥城市',
+ value: '370983',
+ },
+ ],
+ },
+ {
+ label: '威海市',
+ value: '371000',
+ children: [
+ {
+ label: '市辖区',
+ value: '371001',
+ },
+ {
+ label: '环翠区',
+ value: '371002',
+ },
+ {
+ label: '文登区',
+ value: '371003',
+ },
+ {
+ label: '荣成市',
+ value: '371082',
+ },
+ {
+ label: '乳山市',
+ value: '371083',
+ },
+ ],
+ },
+ {
+ label: '日照市',
+ value: '371100',
+ children: [
+ {
+ label: '市辖区',
+ value: '371101',
+ },
+ {
+ label: '东港区',
+ value: '371102',
+ },
+ {
+ label: '岚山区',
+ value: '371103',
+ },
+ {
+ label: '五莲县',
+ value: '371121',
+ },
+ {
+ label: '莒县',
+ value: '371122',
+ },
+ ],
+ },
+ {
+ label: '莱芜市',
+ value: '371200',
+ children: [
+ {
+ label: '市辖区',
+ value: '371201',
+ },
+ {
+ label: '莱城区',
+ value: '371202',
+ },
+ {
+ label: '钢城区',
+ value: '371203',
+ },
+ ],
+ },
+ {
+ label: '临沂市',
+ value: '371300',
+ children: [
+ {
+ label: '市辖区',
+ value: '371301',
+ },
+ {
+ label: '兰山区',
+ value: '371302',
+ },
+ {
+ label: '罗庄区',
+ value: '371311',
+ },
+ {
+ label: '河东区',
+ value: '371312',
+ },
+ {
+ label: '沂南县',
+ value: '371321',
+ },
+ {
+ label: '郯城县',
+ value: '371322',
+ },
+ {
+ label: '沂水县',
+ value: '371323',
+ },
+ {
+ label: '兰陵县',
+ value: '371324',
+ },
+ {
+ label: '费县',
+ value: '371325',
+ },
+ {
+ label: '平邑县',
+ value: '371326',
+ },
+ {
+ label: '莒南县',
+ value: '371327',
+ },
+ {
+ label: '蒙阴县',
+ value: '371328',
+ },
+ {
+ label: '临沭县',
+ value: '371329',
+ },
+ ],
+ },
+ {
+ label: '德州市',
+ value: '371400',
+ children: [
+ {
+ label: '市辖区',
+ value: '371401',
+ },
+ {
+ label: '德城区',
+ value: '371402',
+ },
+ {
+ label: '陵城区',
+ value: '371403',
+ },
+ {
+ label: '宁津县',
+ value: '371422',
+ },
+ {
+ label: '庆云县',
+ value: '371423',
+ },
+ {
+ label: '临邑县',
+ value: '371424',
+ },
+ {
+ label: '齐河县',
+ value: '371425',
+ },
+ {
+ label: '平原县',
+ value: '371426',
+ },
+ {
+ label: '夏津县',
+ value: '371427',
+ },
+ {
+ label: '武城县',
+ value: '371428',
+ },
+ {
+ label: '乐陵市',
+ value: '371481',
+ },
+ {
+ label: '禹城市',
+ value: '371482',
+ },
+ ],
+ },
+ {
+ label: '聊城市',
+ value: '371500',
+ children: [
+ {
+ label: '市辖区',
+ value: '371501',
+ },
+ {
+ label: '东昌府区',
+ value: '371502',
+ },
+ {
+ label: '阳谷县',
+ value: '371521',
+ },
+ {
+ label: '莘县',
+ value: '371522',
+ },
+ {
+ label: '茌平县',
+ value: '371523',
+ },
+ {
+ label: '东阿县',
+ value: '371524',
+ },
+ {
+ label: '冠县',
+ value: '371525',
+ },
+ {
+ label: '高唐县',
+ value: '371526',
+ },
+ {
+ label: '临清市',
+ value: '371581',
+ },
+ ],
+ },
+ {
+ label: '滨州市',
+ value: '371600',
+ children: [
+ {
+ label: '市辖区',
+ value: '371601',
+ },
+ {
+ label: '滨城区',
+ value: '371602',
+ },
+ {
+ label: '沾化区',
+ value: '371603',
+ },
+ {
+ label: '惠民县',
+ value: '371621',
+ },
+ {
+ label: '阳信县',
+ value: '371622',
+ },
+ {
+ label: '无棣县',
+ value: '371623',
+ },
+ {
+ label: '博兴县',
+ value: '371625',
+ },
+ {
+ label: '邹平县',
+ value: '371626',
+ },
+ ],
+ },
+ {
+ label: '菏泽市',
+ value: '371700',
+ children: [
+ {
+ label: '市辖区',
+ value: '371701',
+ },
+ {
+ label: '牡丹区',
+ value: '371702',
+ },
+ {
+ label: '定陶区',
+ value: '371703',
+ },
+ {
+ label: '曹县',
+ value: '371721',
+ },
+ {
+ label: '单县',
+ value: '371722',
+ },
+ {
+ label: '成武县',
+ value: '371723',
+ },
+ {
+ label: '巨野县',
+ value: '371724',
+ },
+ {
+ label: '郓城县',
+ value: '371725',
+ },
+ {
+ label: '鄄城县',
+ value: '371726',
+ },
+ {
+ label: '东明县',
+ value: '371728',
+ },
+ ],
+ },
+ ],
+ },
+
+ {
+ label: '重庆市',
+ value: '500000',
+ children: [
+ {
+ label: '市辖区',
+ value: '500100',
+ children: [
+ {
+ label: '万州区',
+ value: '500101',
+ },
+ {
+ label: '涪陵区',
+ value: '500102',
+ },
+ {
+ label: '渝中区',
+ value: '500103',
+ },
+ {
+ label: '大渡口区',
+ value: '500104',
+ },
+ {
+ label: '江北区',
+ value: '500105',
+ },
+ {
+ label: '沙坪坝区',
+ value: '500106',
+ },
+ {
+ label: '九龙坡区',
+ value: '500107',
+ },
+ {
+ label: '南岸区',
+ value: '500108',
+ },
+ {
+ label: '北碚区',
+ value: '500109',
+ },
+ {
+ label: '綦江区',
+ value: '500110',
+ },
+ {
+ label: '大足区',
+ value: '500111',
+ },
+ {
+ label: '渝北区',
+ value: '500112',
+ },
+ {
+ label: '巴南区',
+ value: '500113',
+ },
+ {
+ label: '黔江区',
+ value: '500114',
+ },
+ {
+ label: '长寿区',
+ value: '500115',
+ },
+ {
+ label: '江津区',
+ value: '500116',
+ },
+ {
+ label: '合川区',
+ value: '500117',
+ },
+ {
+ label: '永川区',
+ value: '500118',
+ },
+ {
+ label: '南川区',
+ value: '500119',
+ },
+ {
+ label: '璧山区',
+ value: '500120',
+ },
+ {
+ label: '铜梁区',
+ value: '500151',
+ },
+ {
+ label: '潼南区',
+ value: '500152',
+ },
+ {
+ label: '荣昌区',
+ value: '500153',
+ },
+ {
+ label: '开州区',
+ value: '500154',
+ },
+ ],
+ },
+ {
+ label: '县',
+ value: '500200',
+ children: [
+ {
+ label: '梁平县',
+ value: '500228',
+ },
+ {
+ label: '城口县',
+ value: '500229',
+ },
+ {
+ label: '丰都县',
+ value: '500230',
+ },
+ {
+ label: '垫江县',
+ value: '500231',
+ },
+ {
+ label: '武隆县',
+ value: '500232',
+ },
+ {
+ label: '忠县',
+ value: '500233',
+ },
+ {
+ label: '云阳县',
+ value: '500235',
+ },
+ {
+ label: '奉节县',
+ value: '500236',
+ },
+ {
+ label: '巫山县',
+ value: '500237',
+ },
+ {
+ label: '巫溪县',
+ value: '500238',
+ },
+ {
+ label: '石柱土家族自治县',
+ value: '500240',
+ },
+ {
+ label: '秀山土家族苗族自治县',
+ value: '500241',
+ },
+ {
+ label: '酉阳土家族苗族自治县',
+ value: '500242',
+ },
+ {
+ label: '彭水苗族土家族自治县',
+ value: '500243',
+ },
+ ],
+ },
+ ],
+ },
+
+ {
+ label: '贵州省',
+ value: '520000',
+ children: [
+ {
+ label: '贵阳市',
+ value: '520100',
+ children: [
+ {
+ label: '市辖区',
+ value: '520101',
+ },
+ {
+ label: '南明区',
+ value: '520102',
+ },
+ {
+ label: '云岩区',
+ value: '520103',
+ },
+ {
+ label: '花溪区',
+ value: '520111',
+ },
+ {
+ label: '乌当区',
+ value: '520112',
+ },
+ {
+ label: '白云区',
+ value: '520113',
+ },
+ {
+ label: '观山湖区',
+ value: '520115',
+ },
+ {
+ label: '开阳县',
+ value: '520121',
+ },
+ {
+ label: '息烽县',
+ value: '520122',
+ },
+ {
+ label: '修文县',
+ value: '520123',
+ },
+ {
+ label: '清镇市',
+ value: '520181',
+ },
+ ],
+ },
+ {
+ label: '六盘水市',
+ value: '520200',
+ children: [
+ {
+ label: '钟山区',
+ value: '520201',
+ },
+ {
+ label: '六枝特区',
+ value: '520203',
+ },
+ {
+ label: '水城县',
+ value: '520221',
+ },
+ {
+ label: '盘县',
+ value: '520222',
+ },
+ ],
+ },
+ {
+ label: '遵义市',
+ value: '520300',
+ children: [
+ {
+ label: '市辖区',
+ value: '520301',
+ },
+ {
+ label: '红花岗区',
+ value: '520302',
+ },
+ {
+ label: '汇川区',
+ value: '520303',
+ },
+ {
+ label: '播州区',
+ value: '520304',
+ },
+ {
+ label: '桐梓县',
+ value: '520322',
+ },
+ {
+ label: '绥阳县',
+ value: '520323',
+ },
+ {
+ label: '正安县',
+ value: '520324',
+ },
+ {
+ label: '道真仡佬族苗族自治县',
+ value: '520325',
+ },
+ {
+ label: '务川仡佬族苗族自治县',
+ value: '520326',
+ },
+ {
+ label: '凤冈县',
+ value: '520327',
+ },
+ {
+ label: '湄潭县',
+ value: '520328',
+ },
+ {
+ label: '余庆县',
+ value: '520329',
+ },
+ {
+ label: '习水县',
+ value: '520330',
+ },
+ {
+ label: '赤水市',
+ value: '520381',
+ },
+ {
+ label: '仁怀市',
+ value: '520382',
+ },
+ ],
+ },
+ {
+ label: '安顺市',
+ value: '520400',
+ children: [
+ {
+ label: '市辖区',
+ value: '520401',
+ },
+ {
+ label: '西秀区',
+ value: '520402',
+ },
+ {
+ label: '平坝区',
+ value: '520403',
+ },
+ {
+ label: '普定县',
+ value: '520422',
+ },
+ {
+ label: '镇宁布依族苗族自治县',
+ value: '520423',
+ },
+ {
+ label: '关岭布依族苗族自治县',
+ value: '520424',
+ },
+ {
+ label: '紫云苗族布依族自治县',
+ value: '520425',
+ },
+ ],
+ },
+ {
+ label: '毕节市',
+ value: '520500',
+ children: [
+ {
+ label: '市辖区',
+ value: '520501',
+ },
+ {
+ label: '七星关区',
+ value: '520502',
+ },
+ {
+ label: '大方县',
+ value: '520521',
+ },
+ {
+ label: '黔西县',
+ value: '520522',
+ },
+ {
+ label: '金沙县',
+ value: '520523',
+ },
+ {
+ label: '织金县',
+ value: '520524',
+ },
+ {
+ label: '纳雍县',
+ value: '520525',
+ },
+ {
+ label: '威宁彝族回族苗族自治县',
+ value: '520526',
+ },
+ {
+ label: '赫章县',
+ value: '520527',
+ },
+ ],
+ },
+ {
+ label: '铜仁市',
+ value: '520600',
+ children: [
+ {
+ label: '市辖区',
+ value: '520601',
+ },
+ {
+ label: '碧江区',
+ value: '520602',
+ },
+ {
+ label: '万山区',
+ value: '520603',
+ },
+ {
+ label: '江口县',
+ value: '520621',
+ },
+ {
+ label: '玉屏侗族自治县',
+ value: '520622',
+ },
+ {
+ label: '石阡县',
+ value: '520623',
+ },
+ {
+ label: '思南县',
+ value: '520624',
+ },
+ {
+ label: '印江土家族苗族自治县',
+ value: '520625',
+ },
+ {
+ label: '德江县',
+ value: '520626',
+ },
+ {
+ label: '沿河土家族自治县',
+ value: '520627',
+ },
+ {
+ label: '松桃苗族自治县',
+ value: '520628',
+ },
+ ],
+ },
+ {
+ label: '黔西南布依族苗族自治州',
+ value: '522300',
+ children: [
+ {
+ label: '兴义市',
+ value: '522301',
+ },
+ {
+ label: '兴仁县',
+ value: '522322',
+ },
+ {
+ label: '普安县',
+ value: '522323',
+ },
+ {
+ label: '晴隆县',
+ value: '522324',
+ },
+ {
+ label: '贞丰县',
+ value: '522325',
+ },
+ {
+ label: '望谟县',
+ value: '522326',
+ },
+ {
+ label: '册亨县',
+ value: '522327',
+ },
+ {
+ label: '安龙县',
+ value: '522328',
+ },
+ ],
+ },
+ {
+ label: '黔东南苗族侗族自治州',
+ value: '522600',
+ children: [
+ {
+ label: '凯里市',
+ value: '522601',
+ },
+ {
+ label: '黄平县',
+ value: '522622',
+ },
+ {
+ label: '施秉县',
+ value: '522623',
+ },
+ {
+ label: '三穗县',
+ value: '522624',
+ },
+ {
+ label: '镇远县',
+ value: '522625',
+ },
+ {
+ label: '岑巩县',
+ value: '522626',
+ },
+ {
+ label: '天柱县',
+ value: '522627',
+ },
+ {
+ label: '锦屏县',
+ value: '522628',
+ },
+ {
+ label: '剑河县',
+ value: '522629',
+ },
+ {
+ label: '台江县',
+ value: '522630',
+ },
+ {
+ label: '黎平县',
+ value: '522631',
+ },
+ {
+ label: '榕江县',
+ value: '522632',
+ },
+ {
+ label: '从江县',
+ value: '522633',
+ },
+ {
+ label: '雷山县',
+ value: '522634',
+ },
+ {
+ label: '麻江县',
+ value: '522635',
+ },
+ {
+ label: '丹寨县',
+ value: '522636',
+ },
+ ],
+ },
+ {
+ label: '黔南布依族苗族自治州',
+ value: '522700',
+ children: [
+ {
+ label: '都匀市',
+ value: '522701',
+ },
+ {
+ label: '福泉市',
+ value: '522702',
+ },
+ {
+ label: '荔波县',
+ value: '522722',
+ },
+ {
+ label: '贵定县',
+ value: '522723',
+ },
+ {
+ label: '瓮安县',
+ value: '522725',
+ },
+ {
+ label: '独山县',
+ value: '522726',
+ },
+ {
+ label: '平塘县',
+ value: '522727',
+ },
+ {
+ label: '罗甸县',
+ value: '522728',
+ },
+ {
+ label: '长顺县',
+ value: '522729',
+ },
+ {
+ label: '龙里县',
+ value: '522730',
+ },
+ {
+ label: '惠水县',
+ value: '522731',
+ },
+ {
+ label: '三都水族自治县',
+ value: '522732',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '云南省',
+ value: '530000',
+ children: [
+ {
+ label: '昆明市',
+ value: '530100',
+ children: [
+ {
+ label: '市辖区',
+ value: '530101',
+ },
+ {
+ label: '五华区',
+ value: '530102',
+ },
+ {
+ label: '盘龙区',
+ value: '530103',
+ },
+ {
+ label: '官渡区',
+ value: '530111',
+ },
+ {
+ label: '西山区',
+ value: '530112',
+ },
+ {
+ label: '东川区',
+ value: '530113',
+ },
+ {
+ label: '呈贡区',
+ value: '530114',
+ },
+ {
+ label: '晋宁县',
+ value: '530122',
+ },
+ {
+ label: '富民县',
+ value: '530124',
+ },
+ {
+ label: '宜良县',
+ value: '530125',
+ },
+ {
+ label: '石林彝族自治县',
+ value: '530126',
+ },
+ {
+ label: '嵩明县',
+ value: '530127',
+ },
+ {
+ label: '禄劝彝族苗族自治县',
+ value: '530128',
+ },
+ {
+ label: '寻甸回族彝族自治县',
+ value: '530129',
+ },
+ {
+ label: '安宁市',
+ value: '530181',
+ },
+ ],
+ },
+ {
+ label: '曲靖市',
+ value: '530300',
+ children: [
+ {
+ label: '市辖区',
+ value: '530301',
+ },
+ {
+ label: '麒麟区',
+ value: '530302',
+ },
+ {
+ label: '沾益区',
+ value: '530303',
+ },
+ {
+ label: '马龙县',
+ value: '530321',
+ },
+ {
+ label: '陆良县',
+ value: '530322',
+ },
+ {
+ label: '师宗县',
+ value: '530323',
+ },
+ {
+ label: '罗平县',
+ value: '530324',
+ },
+ {
+ label: '富源县',
+ value: '530325',
+ },
+ {
+ label: '会泽县',
+ value: '530326',
+ },
+ {
+ label: '宣威市',
+ value: '530381',
+ },
+ ],
+ },
+ {
+ label: '玉溪市',
+ value: '530400',
+ children: [
+ {
+ label: '市辖区',
+ value: '530401',
+ },
+ {
+ label: '红塔区',
+ value: '530402',
+ },
+ {
+ label: '江川区',
+ value: '530403',
+ },
+ {
+ label: '澄江县',
+ value: '530422',
+ },
+ {
+ label: '通海县',
+ value: '530423',
+ },
+ {
+ label: '华宁县',
+ value: '530424',
+ },
+ {
+ label: '易门县',
+ value: '530425',
+ },
+ {
+ label: '峨山彝族自治县',
+ value: '530426',
+ },
+ {
+ label: '新平彝族傣族自治县',
+ value: '530427',
+ },
+ {
+ label: '元江哈尼族彝族傣族自治县',
+ value: '530428',
+ },
+ ],
+ },
+ {
+ label: '保山市',
+ value: '530500',
+ children: [
+ {
+ label: '市辖区',
+ value: '530501',
+ },
+ {
+ label: '隆阳区',
+ value: '530502',
+ },
+ {
+ label: '施甸县',
+ value: '530521',
+ },
+ {
+ label: '龙陵县',
+ value: '530523',
+ },
+ {
+ label: '昌宁县',
+ value: '530524',
+ },
+ {
+ label: '腾冲市',
+ value: '530581',
+ },
+ ],
+ },
+ {
+ label: '昭通市',
+ value: '530600',
+ children: [
+ {
+ label: '市辖区',
+ value: '530601',
+ },
+ {
+ label: '昭阳区',
+ value: '530602',
+ },
+ {
+ label: '鲁甸县',
+ value: '530621',
+ },
+ {
+ label: '巧家县',
+ value: '530622',
+ },
+ {
+ label: '盐津县',
+ value: '530623',
+ },
+ {
+ label: '大关县',
+ value: '530624',
+ },
+ {
+ label: '永善县',
+ value: '530625',
+ },
+ {
+ label: '绥江县',
+ value: '530626',
+ },
+ {
+ label: '镇雄县',
+ value: '530627',
+ },
+ {
+ label: '彝良县',
+ value: '530628',
+ },
+ {
+ label: '威信县',
+ value: '530629',
+ },
+ {
+ label: '水富县',
+ value: '530630',
+ },
+ ],
+ },
+ {
+ label: '丽江市',
+ value: '530700',
+ children: [
+ {
+ label: '市辖区',
+ value: '530701',
+ },
+ {
+ label: '古城区',
+ value: '530702',
+ },
+ {
+ label: '玉龙纳西族自治县',
+ value: '530721',
+ },
+ {
+ label: '永胜县',
+ value: '530722',
+ },
+ {
+ label: '华坪县',
+ value: '530723',
+ },
+ {
+ label: '宁蒗彝族自治县',
+ value: '530724',
+ },
+ ],
+ },
+ {
+ label: '普洱市',
+ value: '530800',
+ children: [
+ {
+ label: '市辖区',
+ value: '530801',
+ },
+ {
+ label: '思茅区',
+ value: '530802',
+ },
+ {
+ label: '宁洱哈尼族彝族自治县',
+ value: '530821',
+ },
+ {
+ label: '墨江哈尼族自治县',
+ value: '530822',
+ },
+ {
+ label: '景东彝族自治县',
+ value: '530823',
+ },
+ {
+ label: '景谷傣族彝族自治县',
+ value: '530824',
+ },
+ {
+ label: '镇沅彝族哈尼族拉祜族自治县',
+ value: '530825',
+ },
+ {
+ label: '江城哈尼族彝族自治县',
+ value: '530826',
+ },
+ {
+ label: '孟连傣族拉祜族佤族自治县',
+ value: '530827',
+ },
+ {
+ label: '澜沧拉祜族自治县',
+ value: '530828',
+ },
+ {
+ label: '西盟佤族自治县',
+ value: '530829',
+ },
+ ],
+ },
+ {
+ label: '临沧市',
+ value: '530900',
+ children: [
+ {
+ label: '市辖区',
+ value: '530901',
+ },
+ {
+ label: '临翔区',
+ value: '530902',
+ },
+ {
+ label: '凤庆县',
+ value: '530921',
+ },
+ {
+ label: '云县',
+ value: '530922',
+ },
+ {
+ label: '永德县',
+ value: '530923',
+ },
+ {
+ label: '镇康县',
+ value: '530924',
+ },
+ {
+ label: '双江拉祜族佤族布朗族傣族自治县',
+ value: '530925',
+ },
+ {
+ label: '耿马傣族佤族自治县',
+ value: '530926',
+ },
+ {
+ label: '沧源佤族自治县',
+ value: '530927',
+ },
+ ],
+ },
+ {
+ label: '楚雄彝族自治州',
+ value: '532300',
+ children: [
+ {
+ label: '楚雄市',
+ value: '532301',
+ },
+ {
+ label: '双柏县',
+ value: '532322',
+ },
+ {
+ label: '牟定县',
+ value: '532323',
+ },
+ {
+ label: '南华县',
+ value: '532324',
+ },
+ {
+ label: '姚安县',
+ value: '532325',
+ },
+ {
+ label: '大姚县',
+ value: '532326',
+ },
+ {
+ label: '永仁县',
+ value: '532327',
+ },
+ {
+ label: '元谋县',
+ value: '532328',
+ },
+ {
+ label: '武定县',
+ value: '532329',
+ },
+ {
+ label: '禄丰县',
+ value: '532331',
+ },
+ ],
+ },
+ {
+ label: '红河哈尼族彝族自治州',
+ value: '532500',
+ children: [
+ {
+ label: '个旧市',
+ value: '532501',
+ },
+ {
+ label: '开远市',
+ value: '532502',
+ },
+ {
+ label: '蒙自市',
+ value: '532503',
+ },
+ {
+ label: '弥勒市',
+ value: '532504',
+ },
+ {
+ label: '屏边苗族自治县',
+ value: '532523',
+ },
+ {
+ label: '建水县',
+ value: '532524',
+ },
+ {
+ label: '石屏县',
+ value: '532525',
+ },
+ {
+ label: '泸西县',
+ value: '532527',
+ },
+ {
+ label: '元阳县',
+ value: '532528',
+ },
+ {
+ label: '红河县',
+ value: '532529',
+ },
+ {
+ label: '金平苗族瑶族傣族自治县',
+ value: '532530',
+ },
+ {
+ label: '绿春县',
+ value: '532531',
+ },
+ {
+ label: '河口瑶族自治县',
+ value: '532532',
+ },
+ ],
+ },
+ {
+ label: '文山壮族苗族自治州',
+ value: '532600',
+ children: [
+ {
+ label: '文山市',
+ value: '532601',
+ },
+ {
+ label: '砚山县',
+ value: '532622',
+ },
+ {
+ label: '西畴县',
+ value: '532623',
+ },
+ {
+ label: '麻栗坡县',
+ value: '532624',
+ },
+ {
+ label: '马关县',
+ value: '532625',
+ },
+ {
+ label: '丘北县',
+ value: '532626',
+ },
+ {
+ label: '广南县',
+ value: '532627',
+ },
+ {
+ label: '富宁县',
+ value: '532628',
+ },
+ ],
+ },
+ {
+ label: '西双版纳傣族自治州',
+ value: '532800',
+ children: [
+ {
+ label: '景洪市',
+ value: '532801',
+ },
+ {
+ label: '勐海县',
+ value: '532822',
+ },
+ {
+ label: '勐腊县',
+ value: '532823',
+ },
+ ],
+ },
+ {
+ label: '大理白族自治州',
+ value: '532900',
+ children: [
+ {
+ label: '大理市',
+ value: '532901',
+ },
+ {
+ label: '漾濞彝族自治县',
+ value: '532922',
+ },
+ {
+ label: '祥云县',
+ value: '532923',
+ },
+ {
+ label: '宾川县',
+ value: '532924',
+ },
+ {
+ label: '弥渡县',
+ value: '532925',
+ },
+ {
+ label: '南涧彝族自治县',
+ value: '532926',
+ },
+ {
+ label: '巍山彝族回族自治县',
+ value: '532927',
+ },
+ {
+ label: '永平县',
+ value: '532928',
+ },
+ {
+ label: '云龙县',
+ value: '532929',
+ },
+ {
+ label: '洱源县',
+ value: '532930',
+ },
+ {
+ label: '剑川县',
+ value: '532931',
+ },
+ {
+ label: '鹤庆县',
+ value: '532932',
+ },
+ ],
+ },
+ {
+ label: '德宏傣族景颇族自治州',
+ value: '533100',
+ children: [
+ {
+ label: '瑞丽市',
+ value: '533102',
+ },
+ {
+ label: '芒市',
+ value: '533103',
+ },
+ {
+ label: '梁河县',
+ value: '533122',
+ },
+ {
+ label: '盈江县',
+ value: '533123',
+ },
+ {
+ label: '陇川县',
+ value: '533124',
+ },
+ ],
+ },
+ {
+ label: '怒江傈僳族自治州',
+ value: '533300',
+ children: [
+ {
+ label: '泸水市',
+ value: '533301',
+ },
+ {
+ label: '福贡县',
+ value: '533323',
+ },
+ {
+ label: '贡山独龙族怒族自治县',
+ value: '533324',
+ },
+ {
+ label: '兰坪白族普米族自治县',
+ value: '533325',
+ },
+ ],
+ },
+ {
+ label: '迪庆藏族自治州',
+ value: '533400',
+ children: [
+ {
+ label: '香格里拉市',
+ value: '533401',
+ },
+ {
+ label: '德钦县',
+ value: '533422',
+ },
+ {
+ label: '维西傈僳族自治县',
+ value: '533423',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '西藏自治区',
+ value: '540000',
+ children: [
+ {
+ label: '拉萨市',
+ value: '540100',
+ children: [
+ {
+ label: '市辖区',
+ value: '540101',
+ },
+ {
+ label: '城关区',
+ value: '540102',
+ },
+ {
+ label: '堆龙德庆区',
+ value: '540103',
+ },
+ {
+ label: '林周县',
+ value: '540121',
+ },
+ {
+ label: '当雄县',
+ value: '540122',
+ },
+ {
+ label: '尼木县',
+ value: '540123',
+ },
+ {
+ label: '曲水县',
+ value: '540124',
+ },
+ {
+ label: '达孜县',
+ value: '540126',
+ },
+ {
+ label: '墨竹工卡县',
+ value: '540127',
+ },
+ ],
+ },
+ {
+ label: '日喀则市',
+ value: '540200',
+ children: [
+ {
+ label: '桑珠孜区',
+ value: '540202',
+ },
+ {
+ label: '南木林县',
+ value: '540221',
+ },
+ {
+ label: '江孜县',
+ value: '540222',
+ },
+ {
+ label: '定日县',
+ value: '540223',
+ },
+ {
+ label: '萨迦县',
+ value: '540224',
+ },
+ {
+ label: '拉孜县',
+ value: '540225',
+ },
+ {
+ label: '昂仁县',
+ value: '540226',
+ },
+ {
+ label: '谢通门县',
+ value: '540227',
+ },
+ {
+ label: '白朗县',
+ value: '540228',
+ },
+ {
+ label: '仁布县',
+ value: '540229',
+ },
+ {
+ label: '康马县',
+ value: '540230',
+ },
+ {
+ label: '定结县',
+ value: '540231',
+ },
+ {
+ label: '仲巴县',
+ value: '540232',
+ },
+ {
+ label: '亚东县',
+ value: '540233',
+ },
+ {
+ label: '吉隆县',
+ value: '540234',
+ },
+ {
+ label: '聂拉木县',
+ value: '540235',
+ },
+ {
+ label: '萨嘎县',
+ value: '540236',
+ },
+ {
+ label: '岗巴县',
+ value: '540237',
+ },
+ ],
+ },
+ {
+ label: '昌都市',
+ value: '540300',
+ children: [
+ {
+ label: '卡若区',
+ value: '540302',
+ },
+ {
+ label: '江达县',
+ value: '540321',
+ },
+ {
+ label: '贡觉县',
+ value: '540322',
+ },
+ {
+ label: '类乌齐县',
+ value: '540323',
+ },
+ {
+ label: '丁青县',
+ value: '540324',
+ },
+ {
+ label: '察雅县',
+ value: '540325',
+ },
+ {
+ label: '八宿县',
+ value: '540326',
+ },
+ {
+ label: '左贡县',
+ value: '540327',
+ },
+ {
+ label: '芒康县',
+ value: '540328',
+ },
+ {
+ label: '洛隆县',
+ value: '540329',
+ },
+ {
+ label: '边坝县',
+ value: '540330',
+ },
+ ],
+ },
+ {
+ label: '林芝市',
+ value: '540400',
+ children: [
+ {
+ label: '巴宜区',
+ value: '540402',
+ },
+ {
+ label: '工布江达县',
+ value: '540421',
+ },
+ {
+ label: '米林县',
+ value: '540422',
+ },
+ {
+ label: '墨脱县',
+ value: '540423',
+ },
+ {
+ label: '波密县',
+ value: '540424',
+ },
+ {
+ label: '察隅县',
+ value: '540425',
+ },
+ {
+ label: '朗县',
+ value: '540426',
+ },
+ ],
+ },
+ {
+ label: '山南市',
+ value: '540500',
+ children: [
+ {
+ label: '市辖区',
+ value: '540501',
+ },
+ {
+ label: '乃东区',
+ value: '540502',
+ },
+ {
+ label: '扎囊县',
+ value: '540521',
+ },
+ {
+ label: '贡嘎县',
+ value: '540522',
+ },
+ {
+ label: '桑日县',
+ value: '540523',
+ },
+ {
+ label: '琼结县',
+ value: '540524',
+ },
+ {
+ label: '曲松县',
+ value: '540525',
+ },
+ {
+ label: '措美县',
+ value: '540526',
+ },
+ {
+ label: '洛扎县',
+ value: '540527',
+ },
+ {
+ label: '加查县',
+ value: '540528',
+ },
+ {
+ label: '隆子县',
+ value: '540529',
+ },
+ {
+ label: '错那县',
+ value: '540530',
+ },
+ {
+ label: '浪卡子县',
+ value: '540531',
+ },
+ ],
+ },
+ {
+ label: '那曲地区',
+ value: '542400',
+ children: [
+ {
+ label: '那曲县',
+ value: '542421',
+ },
+ {
+ label: '嘉黎县',
+ value: '542422',
+ },
+ {
+ label: '比如县',
+ value: '542423',
+ },
+ {
+ label: '聂荣县',
+ value: '542424',
+ },
+ {
+ label: '安多县',
+ value: '542425',
+ },
+ {
+ label: '申扎县',
+ value: '542426',
+ },
+ {
+ label: '索县',
+ value: '542427',
+ },
+ {
+ label: '班戈县',
+ value: '542428',
+ },
+ {
+ label: '巴青县',
+ value: '542429',
+ },
+ {
+ label: '尼玛县',
+ value: '542430',
+ },
+ {
+ label: '双湖县',
+ value: '542431',
+ },
+ ],
+ },
+ {
+ label: '阿里地区',
+ value: '542500',
+ children: [
+ {
+ label: '普兰县',
+ value: '542521',
+ },
+ {
+ label: '札达县',
+ value: '542522',
+ },
+ {
+ label: '噶尔县',
+ value: '542523',
+ },
+ {
+ label: '日土县',
+ value: '542524',
+ },
+ {
+ label: '革吉县',
+ value: '542525',
+ },
+ {
+ label: '改则县',
+ value: '542526',
+ },
+ {
+ label: '措勤县',
+ value: '542527',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '陕西省',
+ value: '610000',
+ children: [
+ {
+ label: '西安市',
+ value: '610100',
+ children: [
+ {
+ label: '市辖区',
+ value: '610101',
+ },
+ {
+ label: '新城区',
+ value: '610102',
+ },
+ {
+ label: '碑林区',
+ value: '610103',
+ },
+ {
+ label: '莲湖区',
+ value: '610104',
+ },
+ {
+ label: '灞桥区',
+ value: '610111',
+ },
+ {
+ label: '未央区',
+ value: '610112',
+ },
+ {
+ label: '雁塔区',
+ value: '610113',
+ },
+ {
+ label: '阎良区',
+ value: '610114',
+ },
+ {
+ label: '临潼区',
+ value: '610115',
+ },
+ {
+ label: '长安区',
+ value: '610116',
+ },
+ {
+ label: '高陵区',
+ value: '610117',
+ },
+ {
+ label: '蓝田县',
+ value: '610122',
+ },
+ {
+ label: '周至县',
+ value: '610124',
+ },
+ {
+ label: '户县',
+ value: '610125',
+ },
+ ],
+ },
+ {
+ label: '铜川市',
+ value: '610200',
+ children: [
+ {
+ label: '市辖区',
+ value: '610201',
+ },
+ {
+ label: '王益区',
+ value: '610202',
+ },
+ {
+ label: '印台区',
+ value: '610203',
+ },
+ {
+ label: '耀州区',
+ value: '610204',
+ },
+ {
+ label: '宜君县',
+ value: '610222',
+ },
+ ],
+ },
+ {
+ label: '宝鸡市',
+ value: '610300',
+ children: [
+ {
+ label: '市辖区',
+ value: '610301',
+ },
+ {
+ label: '渭滨区',
+ value: '610302',
+ },
+ {
+ label: '金台区',
+ value: '610303',
+ },
+ {
+ label: '陈仓区',
+ value: '610304',
+ },
+ {
+ label: '凤翔县',
+ value: '610322',
+ },
+ {
+ label: '岐山县',
+ value: '610323',
+ },
+ {
+ label: '扶风县',
+ value: '610324',
+ },
+ {
+ label: '眉县',
+ value: '610326',
+ },
+ {
+ label: '陇县',
+ value: '610327',
+ },
+ {
+ label: '千阳县',
+ value: '610328',
+ },
+ {
+ label: '麟游县',
+ value: '610329',
+ },
+ {
+ label: '凤县',
+ value: '610330',
+ },
+ {
+ label: '太白县',
+ value: '610331',
+ },
+ ],
+ },
+ {
+ label: '咸阳市',
+ value: '610400',
+ children: [
+ {
+ label: '市辖区',
+ value: '610401',
+ },
+ {
+ label: '秦都区',
+ value: '610402',
+ },
+ {
+ label: '杨陵区',
+ value: '610403',
+ },
+ {
+ label: '渭城区',
+ value: '610404',
+ },
+ {
+ label: '三原县',
+ value: '610422',
+ },
+ {
+ label: '泾阳县',
+ value: '610423',
+ },
+ {
+ label: '乾县',
+ value: '610424',
+ },
+ {
+ label: '礼泉县',
+ value: '610425',
+ },
+ {
+ label: '永寿县',
+ value: '610426',
+ },
+ {
+ label: '彬县',
+ value: '610427',
+ },
+ {
+ label: '长武县',
+ value: '610428',
+ },
+ {
+ label: '旬邑县',
+ value: '610429',
+ },
+ {
+ label: '淳化县',
+ value: '610430',
+ },
+ {
+ label: '武功县',
+ value: '610431',
+ },
+ {
+ label: '兴平市',
+ value: '610481',
+ },
+ ],
+ },
+ {
+ label: '渭南市',
+ value: '610500',
+ children: [
+ {
+ label: '市辖区',
+ value: '610501',
+ },
+ {
+ label: '临渭区',
+ value: '610502',
+ },
+ {
+ label: '华州区',
+ value: '610503',
+ },
+ {
+ label: '潼关县',
+ value: '610522',
+ },
+ {
+ label: '大荔县',
+ value: '610523',
+ },
+ {
+ label: '合阳县',
+ value: '610524',
+ },
+ {
+ label: '澄城县',
+ value: '610525',
+ },
+ {
+ label: '蒲城县',
+ value: '610526',
+ },
+ {
+ label: '白水县',
+ value: '610527',
+ },
+ {
+ label: '富平县',
+ value: '610528',
+ },
+ {
+ label: '韩城市',
+ value: '610581',
+ },
+ {
+ label: '华阴市',
+ value: '610582',
+ },
+ ],
+ },
+ {
+ label: '延安市',
+ value: '610600',
+ children: [
+ {
+ label: '市辖区',
+ value: '610601',
+ },
+ {
+ label: '宝塔区',
+ value: '610602',
+ },
+ {
+ label: '安塞区',
+ value: '610603',
+ },
+ {
+ label: '延长县',
+ value: '610621',
+ },
+ {
+ label: '延川县',
+ value: '610622',
+ },
+ {
+ label: '子长县',
+ value: '610623',
+ },
+ {
+ label: '志丹县',
+ value: '610625',
+ },
+ {
+ label: '吴起县',
+ value: '610626',
+ },
+ {
+ label: '甘泉县',
+ value: '610627',
+ },
+ {
+ label: '富县',
+ value: '610628',
+ },
+ {
+ label: '洛川县',
+ value: '610629',
+ },
+ {
+ label: '宜川县',
+ value: '610630',
+ },
+ {
+ label: '黄龙县',
+ value: '610631',
+ },
+ {
+ label: '黄陵县',
+ value: '610632',
+ },
+ ],
+ },
+ {
+ label: '汉中市',
+ value: '610700',
+ children: [
+ {
+ label: '市辖区',
+ value: '610701',
+ },
+ {
+ label: '汉台区',
+ value: '610702',
+ },
+ {
+ label: '南郑县',
+ value: '610721',
+ },
+ {
+ label: '城固县',
+ value: '610722',
+ },
+ {
+ label: '洋县',
+ value: '610723',
+ },
+ {
+ label: '西乡县',
+ value: '610724',
+ },
+ {
+ label: '勉县',
+ value: '610725',
+ },
+ {
+ label: '宁强县',
+ value: '610726',
+ },
+ {
+ label: '略阳县',
+ value: '610727',
+ },
+ {
+ label: '镇巴县',
+ value: '610728',
+ },
+ {
+ label: '留坝县',
+ value: '610729',
+ },
+ {
+ label: '佛坪县',
+ value: '610730',
+ },
+ ],
+ },
+ {
+ label: '榆林市',
+ value: '610800',
+ children: [
+ {
+ label: '市辖区',
+ value: '610801',
+ },
+ {
+ label: '榆阳区',
+ value: '610802',
+ },
+ {
+ label: '横山区',
+ value: '610803',
+ },
+ {
+ label: '神木县',
+ value: '610821',
+ },
+ {
+ label: '府谷县',
+ value: '610822',
+ },
+ {
+ label: '靖边县',
+ value: '610824',
+ },
+ {
+ label: '定边县',
+ value: '610825',
+ },
+ {
+ label: '绥德县',
+ value: '610826',
+ },
+ {
+ label: '米脂县',
+ value: '610827',
+ },
+ {
+ label: '佳县',
+ value: '610828',
+ },
+ {
+ label: '吴堡县',
+ value: '610829',
+ },
+ {
+ label: '清涧县',
+ value: '610830',
+ },
+ {
+ label: '子洲县',
+ value: '610831',
+ },
+ ],
+ },
+ {
+ label: '安康市',
+ value: '610900',
+ children: [
+ {
+ label: '市辖区',
+ value: '610901',
+ },
+ {
+ label: '汉滨区',
+ value: '610902',
+ },
+ {
+ label: '汉阴县',
+ value: '610921',
+ },
+ {
+ label: '石泉县',
+ value: '610922',
+ },
+ {
+ label: '宁陕县',
+ value: '610923',
+ },
+ {
+ label: '紫阳县',
+ value: '610924',
+ },
+ {
+ label: '岚皋县',
+ value: '610925',
+ },
+ {
+ label: '平利县',
+ value: '610926',
+ },
+ {
+ label: '镇坪县',
+ value: '610927',
+ },
+ {
+ label: '旬阳县',
+ value: '610928',
+ },
+ {
+ label: '白河县',
+ value: '610929',
+ },
+ ],
+ },
+ {
+ label: '商洛市',
+ value: '611000',
+ children: [
+ {
+ label: '市辖区',
+ value: '611001',
+ },
+ {
+ label: '商州区',
+ value: '611002',
+ },
+ {
+ label: '洛南县',
+ value: '611021',
+ },
+ {
+ label: '丹凤县',
+ value: '611022',
+ },
+ {
+ label: '商南县',
+ value: '611023',
+ },
+ {
+ label: '山阳县',
+ value: '611024',
+ },
+ {
+ label: '镇安县',
+ value: '611025',
+ },
+ {
+ label: '柞水县',
+ value: '611026',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '甘肃省',
+ value: '620000',
+ children: [
+ {
+ label: '兰州市',
+ value: '620100',
+ children: [
+ {
+ label: '市辖区',
+ value: '620101',
+ },
+ {
+ label: '城关区',
+ value: '620102',
+ },
+ {
+ label: '七里河区',
+ value: '620103',
+ },
+ {
+ label: '西固区',
+ value: '620104',
+ },
+ {
+ label: '安宁区',
+ value: '620105',
+ },
+ {
+ label: '红古区',
+ value: '620111',
+ },
+ {
+ label: '永登县',
+ value: '620121',
+ },
+ {
+ label: '皋兰县',
+ value: '620122',
+ },
+ {
+ label: '榆中县',
+ value: '620123',
+ },
+ ],
+ },
+ {
+ label: '嘉峪关市',
+ value: '620200',
+ children: [
+ {
+ label: '市辖区',
+ value: '620201',
+ },
+ ],
+ },
+ {
+ label: '金昌市',
+ value: '620300',
+ children: [
+ {
+ label: '市辖区',
+ value: '620301',
+ },
+ {
+ label: '金川区',
+ value: '620302',
+ },
+ {
+ label: '永昌县',
+ value: '620321',
+ },
+ ],
+ },
+ {
+ label: '白银市',
+ value: '620400',
+ children: [
+ {
+ label: '市辖区',
+ value: '620401',
+ },
+ {
+ label: '白银区',
+ value: '620402',
+ },
+ {
+ label: '平川区',
+ value: '620403',
+ },
+ {
+ label: '靖远县',
+ value: '620421',
+ },
+ {
+ label: '会宁县',
+ value: '620422',
+ },
+ {
+ label: '景泰县',
+ value: '620423',
+ },
+ ],
+ },
+ {
+ label: '天水市',
+ value: '620500',
+ children: [
+ {
+ label: '市辖区',
+ value: '620501',
+ },
+ {
+ label: '秦州区',
+ value: '620502',
+ },
+ {
+ label: '麦积区',
+ value: '620503',
+ },
+ {
+ label: '清水县',
+ value: '620521',
+ },
+ {
+ label: '秦安县',
+ value: '620522',
+ },
+ {
+ label: '甘谷县',
+ value: '620523',
+ },
+ {
+ label: '武山县',
+ value: '620524',
+ },
+ {
+ label: '张家川回族自治县',
+ value: '620525',
+ },
+ ],
+ },
+ {
+ label: '武威市',
+ value: '620600',
+ children: [
+ {
+ label: '市辖区',
+ value: '620601',
+ },
+ {
+ label: '凉州区',
+ value: '620602',
+ },
+ {
+ label: '民勤县',
+ value: '620621',
+ },
+ {
+ label: '古浪县',
+ value: '620622',
+ },
+ {
+ label: '天祝藏族自治县',
+ value: '620623',
+ },
+ ],
+ },
+ {
+ label: '张掖市',
+ value: '620700',
+ children: [
+ {
+ label: '市辖区',
+ value: '620701',
+ },
+ {
+ label: '甘州区',
+ value: '620702',
+ },
+ {
+ label: '肃南裕固族自治县',
+ value: '620721',
+ },
+ {
+ label: '民乐县',
+ value: '620722',
+ },
+ {
+ label: '临泽县',
+ value: '620723',
+ },
+ {
+ label: '高台县',
+ value: '620724',
+ },
+ {
+ label: '山丹县',
+ value: '620725',
+ },
+ ],
+ },
+ {
+ label: '平凉市',
+ value: '620800',
+ children: [
+ {
+ label: '市辖区',
+ value: '620801',
+ },
+ {
+ label: '崆峒区',
+ value: '620802',
+ },
+ {
+ label: '泾川县',
+ value: '620821',
+ },
+ {
+ label: '灵台县',
+ value: '620822',
+ },
+ {
+ label: '崇信县',
+ value: '620823',
+ },
+ {
+ label: '华亭县',
+ value: '620824',
+ },
+ {
+ label: '庄浪县',
+ value: '620825',
+ },
+ {
+ label: '静宁县',
+ value: '620826',
+ },
+ ],
+ },
+ {
+ label: '酒泉市',
+ value: '620900',
+ children: [
+ {
+ label: '市辖区',
+ value: '620901',
+ },
+ {
+ label: '肃州区',
+ value: '620902',
+ },
+ {
+ label: '金塔县',
+ value: '620921',
+ },
+ {
+ label: '瓜州县',
+ value: '620922',
+ },
+ {
+ label: '肃北蒙古族自治县',
+ value: '620923',
+ },
+ {
+ label: '阿克塞哈萨克族自治县',
+ value: '620924',
+ },
+ {
+ label: '玉门市',
+ value: '620981',
+ },
+ {
+ label: '敦煌市',
+ value: '620982',
+ },
+ ],
+ },
+ {
+ label: '庆阳市',
+ value: '621000',
+ children: [
+ {
+ label: '市辖区',
+ value: '621001',
+ },
+ {
+ label: '西峰区',
+ value: '621002',
+ },
+ {
+ label: '庆城县',
+ value: '621021',
+ },
+ {
+ label: '环县',
+ value: '621022',
+ },
+ {
+ label: '华池县',
+ value: '621023',
+ },
+ {
+ label: '合水县',
+ value: '621024',
+ },
+ {
+ label: '正宁县',
+ value: '621025',
+ },
+ {
+ label: '宁县',
+ value: '621026',
+ },
+ {
+ label: '镇原县',
+ value: '621027',
+ },
+ ],
+ },
+ {
+ label: '定西市',
+ value: '621100',
+ children: [
+ {
+ label: '市辖区',
+ value: '621101',
+ },
+ {
+ label: '安定区',
+ value: '621102',
+ },
+ {
+ label: '通渭县',
+ value: '621121',
+ },
+ {
+ label: '陇西县',
+ value: '621122',
+ },
+ {
+ label: '渭源县',
+ value: '621123',
+ },
+ {
+ label: '临洮县',
+ value: '621124',
+ },
+ {
+ label: '漳县',
+ value: '621125',
+ },
+ {
+ label: '岷县',
+ value: '621126',
+ },
+ ],
+ },
+ {
+ label: '陇南市',
+ value: '621200',
+ children: [
+ {
+ label: '市辖区',
+ value: '621201',
+ },
+ {
+ label: '武都区',
+ value: '621202',
+ },
+ {
+ label: '成县',
+ value: '621221',
+ },
+ {
+ label: '文县',
+ value: '621222',
+ },
+ {
+ label: '宕昌县',
+ value: '621223',
+ },
+ {
+ label: '康县',
+ value: '621224',
+ },
+ {
+ label: '西和县',
+ value: '621225',
+ },
+ {
+ label: '礼县',
+ value: '621226',
+ },
+ {
+ label: '徽县',
+ value: '621227',
+ },
+ {
+ label: '两当县',
+ value: '621228',
+ },
+ ],
+ },
+ {
+ label: '临夏回族自治州',
+ value: '622900',
+ children: [
+ {
+ label: '临夏市',
+ value: '622901',
+ },
+ {
+ label: '临夏县',
+ value: '622921',
+ },
+ {
+ label: '康乐县',
+ value: '622922',
+ },
+ {
+ label: '永靖县',
+ value: '622923',
+ },
+ {
+ label: '广河县',
+ value: '622924',
+ },
+ {
+ label: '和政县',
+ value: '622925',
+ },
+ {
+ label: '东乡族自治县',
+ value: '622926',
+ },
+ {
+ label: '积石山保安族东乡族撒拉族自治县',
+ value: '622927',
+ },
+ ],
+ },
+ {
+ label: '甘南藏族自治州',
+ value: '623000',
+ children: [
+ {
+ label: '合作市',
+ value: '623001',
+ },
+ {
+ label: '临潭县',
+ value: '623021',
+ },
+ {
+ label: '卓尼县',
+ value: '623022',
+ },
+ {
+ label: '舟曲县',
+ value: '623023',
+ },
+ {
+ label: '迭部县',
+ value: '623024',
+ },
+ {
+ label: '玛曲县',
+ value: '623025',
+ },
+ {
+ label: '碌曲县',
+ value: '623026',
+ },
+ {
+ label: '夏河县',
+ value: '623027',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '青海省',
+ value: '630000',
+ children: [
+ {
+ label: '西宁市',
+ value: '630100',
+ children: [
+ {
+ label: '市辖区',
+ value: '630101',
+ },
+ {
+ label: '城东区',
+ value: '630102',
+ },
+ {
+ label: '城中区',
+ value: '630103',
+ },
+ {
+ label: '城西区',
+ value: '630104',
+ },
+ {
+ label: '城北区',
+ value: '630105',
+ },
+ {
+ label: '大通回族土族自治县',
+ value: '630121',
+ },
+ {
+ label: '湟中县',
+ value: '630122',
+ },
+ {
+ label: '湟源县',
+ value: '630123',
+ },
+ ],
+ },
+ {
+ label: '海东市',
+ value: '630200',
+ children: [
+ {
+ label: '乐都区',
+ value: '630202',
+ },
+ {
+ label: '平安区',
+ value: '630203',
+ },
+ {
+ label: '民和回族土族自治县',
+ value: '630222',
+ },
+ {
+ label: '互助土族自治县',
+ value: '630223',
+ },
+ {
+ label: '化隆回族自治县',
+ value: '630224',
+ },
+ {
+ label: '循化撒拉族自治县',
+ value: '630225',
+ },
+ ],
+ },
+ {
+ label: '海北藏族自治州',
+ value: '632200',
+ children: [
+ {
+ label: '门源回族自治县',
+ value: '632221',
+ },
+ {
+ label: '祁连县',
+ value: '632222',
+ },
+ {
+ label: '海晏县',
+ value: '632223',
+ },
+ {
+ label: '刚察县',
+ value: '632224',
+ },
+ ],
+ },
+ {
+ label: '黄南藏族自治州',
+ value: '632300',
+ children: [
+ {
+ label: '同仁县',
+ value: '632321',
+ },
+ {
+ label: '尖扎县',
+ value: '632322',
+ },
+ {
+ label: '泽库县',
+ value: '632323',
+ },
+ {
+ label: '河南蒙古族自治县',
+ value: '632324',
+ },
+ ],
+ },
+ {
+ label: '海南藏族自治州',
+ value: '632500',
+ children: [
+ {
+ label: '共和县',
+ value: '632521',
+ },
+ {
+ label: '同德县',
+ value: '632522',
+ },
+ {
+ label: '贵德县',
+ value: '632523',
+ },
+ {
+ label: '兴海县',
+ value: '632524',
+ },
+ {
+ label: '贵南县',
+ value: '632525',
+ },
+ ],
+ },
+ {
+ label: '果洛藏族自治州',
+ value: '632600',
+ children: [
+ {
+ label: '玛沁县',
+ value: '632621',
+ },
+ {
+ label: '班玛县',
+ value: '632622',
+ },
+ {
+ label: '甘德县',
+ value: '632623',
+ },
+ {
+ label: '达日县',
+ value: '632624',
+ },
+ {
+ label: '久治县',
+ value: '632625',
+ },
+ {
+ label: '玛多县',
+ value: '632626',
+ },
+ ],
+ },
+ {
+ label: '玉树藏族自治州',
+ value: '632700',
+ children: [
+ {
+ label: '玉树市',
+ value: '632701',
+ },
+ {
+ label: '杂多县',
+ value: '632722',
+ },
+ {
+ label: '称多县',
+ value: '632723',
+ },
+ {
+ label: '治多县',
+ value: '632724',
+ },
+ {
+ label: '囊谦县',
+ value: '632725',
+ },
+ {
+ label: '曲麻莱县',
+ value: '632726',
+ },
+ ],
+ },
+ {
+ label: '海西蒙古族藏族自治州',
+ value: '632800',
+ children: [
+ {
+ label: '格尔木市',
+ value: '632801',
+ },
+ {
+ label: '德令哈市',
+ value: '632802',
+ },
+ {
+ label: '乌兰县',
+ value: '632821',
+ },
+ {
+ label: '都兰县',
+ value: '632822',
+ },
+ {
+ label: '天峻县',
+ value: '632823',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '宁夏回族自治区',
+ value: '640000',
+ children: [
+ {
+ label: '银川市',
+ value: '640100',
+ children: [
+ {
+ label: '市辖区',
+ value: '640101',
+ },
+ {
+ label: '兴庆区',
+ value: '640104',
+ },
+ {
+ label: '西夏区',
+ value: '640105',
+ },
+ {
+ label: '金凤区',
+ value: '640106',
+ },
+ {
+ label: '永宁县',
+ value: '640121',
+ },
+ {
+ label: '贺兰县',
+ value: '640122',
+ },
+ {
+ label: '灵武市',
+ value: '640181',
+ },
+ ],
+ },
+ {
+ label: '石嘴山市',
+ value: '640200',
+ children: [
+ {
+ label: '市辖区',
+ value: '640201',
+ },
+ {
+ label: '大武口区',
+ value: '640202',
+ },
+ {
+ label: '惠农区',
+ value: '640205',
+ },
+ {
+ label: '平罗县',
+ value: '640221',
+ },
+ ],
+ },
+ {
+ label: '吴忠市',
+ value: '640300',
+ children: [
+ {
+ label: '市辖区',
+ value: '640301',
+ },
+ {
+ label: '利通区',
+ value: '640302',
+ },
+ {
+ label: '红寺堡区',
+ value: '640303',
+ },
+ {
+ label: '盐池县',
+ value: '640323',
+ },
+ {
+ label: '同心县',
+ value: '640324',
+ },
+ {
+ label: '青铜峡市',
+ value: '640381',
+ },
+ ],
+ },
+ {
+ label: '固原市',
+ value: '640400',
+ children: [
+ {
+ label: '市辖区',
+ value: '640401',
+ },
+ {
+ label: '原州区',
+ value: '640402',
+ },
+ {
+ label: '西吉县',
+ value: '640422',
+ },
+ {
+ label: '隆德县',
+ value: '640423',
+ },
+ {
+ label: '泾源县',
+ value: '640424',
+ },
+ {
+ label: '彭阳县',
+ value: '640425',
+ },
+ ],
+ },
+ {
+ label: '中卫市',
+ value: '640500',
+ children: [
+ {
+ label: '市辖区',
+ value: '640501',
+ },
+ {
+ label: '沙坡头区',
+ value: '640502',
+ },
+ {
+ label: '中宁县',
+ value: '640521',
+ },
+ {
+ label: '海原县',
+ value: '640522',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '新疆维吾尔自治区',
+ value: '650000',
+ children: [
+ {
+ label: '乌鲁木齐市',
+ value: '650100',
+ children: [
+ {
+ label: '市辖区',
+ value: '650101',
+ },
+ {
+ label: '天山区',
+ value: '650102',
+ },
+ {
+ label: '沙依巴克区',
+ value: '650103',
+ },
+ {
+ label: '新市区',
+ value: '650104',
+ },
+ {
+ label: '水磨沟区',
+ value: '650105',
+ },
+ {
+ label: '头屯河区',
+ value: '650106',
+ },
+ {
+ label: '达坂城区',
+ value: '650107',
+ },
+ {
+ label: '米东区',
+ value: '650109',
+ },
+ {
+ label: '乌鲁木齐县',
+ value: '650121',
+ },
+ ],
+ },
+ {
+ label: '克拉玛依市',
+ value: '650200',
+ children: [
+ {
+ label: '市辖区',
+ value: '650201',
+ },
+ {
+ label: '独山子区',
+ value: '650202',
+ },
+ {
+ label: '克拉玛依区',
+ value: '650203',
+ },
+ {
+ label: '白碱滩区',
+ value: '650204',
+ },
+ {
+ label: '乌尔禾区',
+ value: '650205',
+ },
+ ],
+ },
+ {
+ label: '吐鲁番市',
+ value: '650400',
+ children: [
+ {
+ label: '高昌区',
+ value: '650402',
+ },
+ {
+ label: '鄯善县',
+ value: '650421',
+ },
+ {
+ label: '托克逊县',
+ value: '650422',
+ },
+ ],
+ },
+ {
+ label: '哈密市',
+ value: '650500',
+ children: [
+ {
+ label: '伊州区',
+ value: '650502',
+ },
+ {
+ label: '巴里坤哈萨克自治县',
+ value: '650521',
+ },
+ {
+ label: '伊吾县',
+ value: '650522',
+ },
+ ],
+ },
+ {
+ label: '昌吉回族自治州',
+ value: '652300',
+ children: [
+ {
+ label: '昌吉市',
+ value: '652301',
+ },
+ {
+ label: '阜康市',
+ value: '652302',
+ },
+ {
+ label: '呼图壁县',
+ value: '652323',
+ },
+ {
+ label: '玛纳斯县',
+ value: '652324',
+ },
+ {
+ label: '奇台县',
+ value: '652325',
+ },
+ {
+ label: '吉木萨尔县',
+ value: '652327',
+ },
+ {
+ label: '木垒哈萨克自治县',
+ value: '652328',
+ },
+ ],
+ },
+ {
+ label: '博尔塔拉蒙古自治州',
+ value: '652700',
+ children: [
+ {
+ label: '博乐市',
+ value: '652701',
+ },
+ {
+ label: '阿拉山口市',
+ value: '652702',
+ },
+ {
+ label: '精河县',
+ value: '652722',
+ },
+ {
+ label: '温泉县',
+ value: '652723',
+ },
+ ],
+ },
+ {
+ label: '巴音郭楞蒙古自治州',
+ value: '652800',
+ children: [
+ {
+ label: '库尔勒市',
+ value: '652801',
+ },
+ {
+ label: '轮台县',
+ value: '652822',
+ },
+ {
+ label: '尉犁县',
+ value: '652823',
+ },
+ {
+ label: '若羌县',
+ value: '652824',
+ },
+ {
+ label: '且末县',
+ value: '652825',
+ },
+ {
+ label: '焉耆回族自治县',
+ value: '652826',
+ },
+ {
+ label: '和静县',
+ value: '652827',
+ },
+ {
+ label: '和硕县',
+ value: '652828',
+ },
+ {
+ label: '博湖县',
+ value: '652829',
+ },
+ ],
+ },
+ {
+ label: '阿克苏地区',
+ value: '652900',
+ children: [
+ {
+ label: '阿克苏市',
+ value: '652901',
+ },
+ {
+ label: '温宿县',
+ value: '652922',
+ },
+ {
+ label: '库车县',
+ value: '652923',
+ },
+ {
+ label: '沙雅县',
+ value: '652924',
+ },
+ {
+ label: '新和县',
+ value: '652925',
+ },
+ {
+ label: '拜城县',
+ value: '652926',
+ },
+ {
+ label: '乌什县',
+ value: '652927',
+ },
+ {
+ label: '阿瓦提县',
+ value: '652928',
+ },
+ {
+ label: '柯坪县',
+ value: '652929',
+ },
+ ],
+ },
+ {
+ label: '克孜勒苏柯尔克孜自治州',
+ value: '653000',
+ children: [
+ {
+ label: '阿图什市',
+ value: '653001',
+ },
+ {
+ label: '阿克陶县',
+ value: '653022',
+ },
+ {
+ label: '阿合奇县',
+ value: '653023',
+ },
+ {
+ label: '乌恰县',
+ value: '653024',
+ },
+ ],
+ },
+ {
+ label: '喀什地区',
+ value: '653100',
+ children: [
+ {
+ label: '喀什市',
+ value: '653101',
+ },
+ {
+ label: '疏附县',
+ value: '653121',
+ },
+ {
+ label: '疏勒县',
+ value: '653122',
+ },
+ {
+ label: '英吉沙县',
+ value: '653123',
+ },
+ {
+ label: '泽普县',
+ value: '653124',
+ },
+ {
+ label: '莎车县',
+ value: '653125',
+ },
+ {
+ label: '叶城县',
+ value: '653126',
+ },
+ {
+ label: '麦盖提县',
+ value: '653127',
+ },
+ {
+ label: '岳普湖县',
+ value: '653128',
+ },
+ {
+ label: '伽师县',
+ value: '653129',
+ },
+ {
+ label: '巴楚县',
+ value: '653130',
+ },
+ {
+ label: '塔什库尔干塔吉克自治县',
+ value: '653131',
+ },
+ ],
+ },
+ {
+ label: '和田地区',
+ value: '653200',
+ children: [
+ {
+ label: '和田市',
+ value: '653201',
+ },
+ {
+ label: '和田县',
+ value: '653221',
+ },
+ {
+ label: '墨玉县',
+ value: '653222',
+ },
+ {
+ label: '皮山县',
+ value: '653223',
+ },
+ {
+ label: '洛浦县',
+ value: '653224',
+ },
+ {
+ label: '策勒县',
+ value: '653225',
+ },
+ {
+ label: '于田县',
+ value: '653226',
+ },
+ {
+ label: '民丰县',
+ value: '653227',
+ },
+ ],
+ },
+ {
+ label: '伊犁哈萨克自治州',
+ value: '654000',
+ children: [
+ {
+ label: '伊宁市',
+ value: '654002',
+ },
+ {
+ label: '奎屯市',
+ value: '654003',
+ },
+ {
+ label: '霍尔果斯市',
+ value: '654004',
+ },
+ {
+ label: '伊宁县',
+ value: '654021',
+ },
+ {
+ label: '察布查尔锡伯自治县',
+ value: '654022',
+ },
+ {
+ label: '霍城县',
+ value: '654023',
+ },
+ {
+ label: '巩留县',
+ value: '654024',
+ },
+ {
+ label: '新源县',
+ value: '654025',
+ },
+ {
+ label: '昭苏县',
+ value: '654026',
+ },
+ {
+ label: '特克斯县',
+ value: '654027',
+ },
+ {
+ label: '尼勒克县',
+ value: '654028',
+ },
+ ],
+ },
+ {
+ label: '塔城地区',
+ value: '654200',
+ children: [
+ {
+ label: '塔城市',
+ value: '654201',
+ },
+ {
+ label: '乌苏市',
+ value: '654202',
+ },
+ {
+ label: '额敏县',
+ value: '654221',
+ },
+ {
+ label: '沙湾县',
+ value: '654223',
+ },
+ {
+ label: '托里县',
+ value: '654224',
+ },
+ {
+ label: '裕民县',
+ value: '654225',
+ },
+ {
+ label: '和布克赛尔蒙古自治县',
+ value: '654226',
+ },
+ ],
+ },
+ {
+ label: '阿勒泰地区',
+ value: '654300',
+ children: [
+ {
+ label: '阿勒泰市',
+ value: '654301',
+ },
+ {
+ label: '布尔津县',
+ value: '654321',
+ },
+ {
+ label: '富蕴县',
+ value: '654322',
+ },
+ {
+ label: '福海县',
+ value: '654323',
+ },
+ {
+ label: '哈巴河县',
+ value: '654324',
+ },
+ {
+ label: '青河县',
+ value: '654325',
+ },
+ {
+ label: '吉木乃县',
+ value: '654326',
+ },
+ ],
+ },
+ {
+ label: '自治区直辖县级行政区划',
+ value: '659000',
+ children: [
+ {
+ label: '石河子市',
+ value: '659001',
+ },
+ {
+ label: '阿拉尔市',
+ value: '659002',
+ },
+ {
+ label: '图木舒克市',
+ value: '659003',
+ },
+ {
+ label: '五家渠市',
+ value: '659004',
+ },
+ {
+ label: '铁门关市',
+ value: '659006',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ value: '660000',
+ label: '台湾省',
+ children: [
+ {
+ value: '660100',
+ label: '台北市',
+ children: [
+ { value: '660101', label: '中正区' },
+ { value: '660102', label: '大同区' },
+ { value: '660103', label: '中山区' },
+ { value: '660104', label: '松山区' },
+ { value: '660105', label: '大安区' },
+ { value: '660106', label: '万华区' },
+ { value: '660107', label: '信义区' },
+ { value: '660108', label: '士林区' },
+ { value: '660109', label: '北投区' },
+ { value: '660110', label: '内湖区' },
+ { value: '660111', label: '南港区' },
+ { value: '660112', label: '文山区' },
+ ],
+ },
+ {
+ value: '660200',
+ label: '高雄市',
+ children: [
+ { value: '660201', label: '新兴区' },
+ { value: '660202', label: '前金区' },
+ { value: '660203', label: '芩雅区' },
+ { value: '660204', label: '盐埕区' },
+ { value: '660205', label: '鼓山区' },
+ { value: '660206', label: '旗津区' },
+ { value: '660207', label: '前镇区' },
+ { value: '660208', label: '三民区' },
+ { value: '660209', label: '左营区' },
+ { value: '660210', label: '楠梓区' },
+ { value: '660211', label: '小港区' },
+ ],
+ },
+ {
+ value: '660300',
+ label: '台南市',
+ children: [
+ { value: '660301', label: '中西区' },
+ { value: '660302', label: '东区' },
+ { value: '660303', label: '南区' },
+ { value: '660304', label: '北区' },
+ { value: '660305', label: '安平区' },
+ { value: '660306', label: '安南区' },
+ ],
+ },
+ {
+ value: '660400',
+ label: '台中市',
+ children: [
+ { value: '660401', label: '中区' },
+ { value: '660402', label: '东区' },
+ { value: '660403', label: '南区' },
+ { value: '660404', label: '西区' },
+ { value: '660405', label: '北区' },
+ { value: '660406', label: '北屯区' },
+ { value: '660407', label: '西屯区' },
+ { value: '660408', label: '南屯区' },
+ ],
+ },
+ {
+ value: '660500',
+ label: '金门县',
+ children: [{ value: '660501', label: '金门县' }],
+ },
+ {
+ value: '660600',
+ label: '南投县',
+ children: [{ value: '660601', label: '南投县' }],
+ },
+ {
+ value: '660700',
+ label: '基隆市',
+ children: [
+ { value: '660701', label: '仁爱区' },
+ { value: '660702', label: '信义区' },
+ { value: '660703', label: '中正区' },
+ { value: '660704', label: '中山区' },
+ { value: '660705', label: '安乐区' },
+ { value: '660706', label: '暖暖区' },
+ { value: '660707', label: '七堵区' },
+ ],
+ },
+ {
+ value: '660800',
+ label: '新竹市',
+ children: [
+ { value: '660801', label: '东区' },
+ { value: '660802', label: '北区' },
+ { value: '660803', label: '香山区' },
+ ],
+ },
+ {
+ value: '660900',
+ label: '嘉义市',
+ children: [
+ { value: '660901', label: '东区' },
+ { value: '660902', label: '西区' },
+ ],
+ },
+ {
+ value: '661000',
+ label: '新北市',
+ children: [{ value: '661001', label: '新北市' }],
+ },
+ {
+ value: '661100',
+ label: '宜兰县',
+ children: [{ value: '661100', label: '宜兰县' }],
+ },
+ {
+ value: '661200',
+ label: '新竹县',
+ children: [{ value: '661201', label: '新竹县' }],
+ },
+ {
+ value: '661300',
+ label: '桃园县',
+ children: [{ value: '661301', label: '桃园县' }],
+ },
+ {
+ value: '661400',
+ label: '苗栗县',
+ children: [{ value: '661401', label: '苗栗县' }],
+ },
+ {
+ value: '661500',
+ label: '彰化县',
+ children: [{ value: '661501', label: '彰化县' }],
+ },
+ {
+ value: '661600',
+ label: '嘉义县',
+ children: [{ value: '661601', label: '嘉义县' }],
+ },
+ {
+ value: '661700',
+ label: '云林县',
+ children: [{ value: '661701', label: '云林县' }],
+ },
+ {
+ value: '661800',
+ label: '屏东县',
+ children: [{ value: '661801', label: '屏东县' }],
+ },
+ {
+ value: '661900',
+ label: '台东县',
+ children: [{ value: '661901', label: '台东县' }],
+ },
+ {
+ value: '662000',
+ label: '花莲县',
+ children: [{ value: '662001', label: '花莲县' }],
+ },
+ {
+ value: '662100',
+ label: '澎湖县',
+ children: [{ value: '662101', label: '澎湖县' }],
+ },
+ ],
+ },
+
+ {
+ value: '670000',
+ label: '香港',
+ children: [
+ {
+ value: '670100',
+ label: '香港岛',
+ children: [
+ { value: '670101', label: '中西区' },
+ { value: '670102', label: '湾仔区' },
+ { value: '670103', label: '东区' },
+ { value: '670104', label: '南区' },
+ ],
+ },
+ {
+ value: '670200',
+ label: '九龙半岛',
+ children: [
+ { value: '670201', label: '九龙城区' },
+ { value: '670202', label: '油尖旺区' },
+ { value: '670203', label: '深水埗区' },
+ { value: '670204', label: '黄大仙区' },
+ { value: '670205', label: '观塘区' },
+ ],
+ },
+ {
+ value: '670300',
+ label: '新界',
+ children: [
+ { value: '670301', label: '北区' },
+ { value: '670302', label: '大埔区' },
+ { value: '670303', label: '沙田区' },
+ { value: '670304', label: '西贡区' },
+ { value: '670305', label: '元朗区' },
+ { value: '670306', label: '屯门区' },
+ { value: '670307', label: '荃湾区' },
+ { value: '670308', label: '葵青区' },
+ { value: '670309', label: '离岛区' },
+ ],
+ },
+ ],
+ },
+ {
+ value: '680000',
+ label: '澳门',
+ children: [
+ {
+ value: '680100',
+ label: '澳门半岛',
+ children: [
+ { value: '680101', label: '花地玛堂区' },
+ { value: '680102', label: '圣安多尼堂区' },
+ { value: '680103', label: '大堂区' },
+ { value: '680104', label: '望德堂区' },
+ { value: '680105', label: '风顺堂区' },
+ ],
+ },
+ {
+ value: '680200',
+ label: '离岛',
+ children: [
+ { value: '680201', label: '嘉模堂区' },
+ { value: '680202', label: '圣方济各堂区' },
+ ],
+ },
+ ],
+ },
+ // {
+ // "label": "台湾省",
+ // "value": "710000",
+ // },
+ // {
+ // "label": "香港特别行政区",
+ // "value": "810000",
+ // },
+ // {
+ // "label": "澳门特别行政区",
+ // "value": "820000",
+ // }
+];
diff --git a/public/regionData1.js b/public/regionData1.js
new file mode 100644
index 0000000..6051296
--- /dev/null
+++ b/public/regionData1.js
@@ -0,0 +1,2747 @@
+
+
+let regionData1 = [
+ {
+ label: "海口市",
+ value: "460100",
+ number: "123",
+ children: [
+ {
+ label: "秀英区",
+ value: "460105",
+ number: "123",
+ children: [
+ {
+ label: "秀英街道",
+ value: "460105001",
+ number: "123",
+ children: [
+ {
+ label: "秀华社区居委会",
+ number: "123",
+ value: "460105001001",
+ },
+ {
+ label: "秀海社区居委会",
+ number: "123",
+ value: "460105001002",
+ },
+ {
+ label: "秀中社区居委会",
+ number: "123",
+ value: "460105001003",
+ },
+ {
+ label: "秀新社区居委会",
+ number: "123",
+ value: "460105001004",
+ },
+ {
+ label: "向荣村委会",
+ number: "123",
+ value: "460105001200",
+ },
+ {
+ label: "书场村委会",
+ number: "123",
+ value: "460105001201",
+ },
+ {
+ label: "高新社区居委会",
+ number: "123",
+ value: "460105001005",
+ },
+ ],
+ },
+ {
+ label: "海秀街道",
+ value: "460105002",
+ number: "123",
+ children: [
+ {
+ label: "海口港社区居委会",
+ number: "123",
+ value: "460105002001",
+ },
+ {
+ label: "长秀社区居委会",
+ number: "123",
+ value: "460105002003",
+ },
+ {
+ label: "金鼎社区居委会",
+ number: "123",
+ value: "460105002004",
+ },
+ {
+ label: "十一支队家属社区居委会",
+ number: "123",
+ value: "460105002005",
+ },
+ {
+ label: "天海社区居委会",
+ number: "123",
+ value: "460105002007",
+ },
+ {
+ label: "东方洋社区居委会",
+ number: "123",
+ value: "460105002002",
+ },
+ {
+ label: "爱华社区居委会",
+ number: "123",
+ value: "460105002006",
+ },
+ ],
+ },
+ {
+ label: "长流镇",
+ value: "460105100",
+ number: "123",
+ children: [
+ {
+ label: "美李村委会",
+ number: "123",
+ value: "460105100211",
+ },
+ {
+ label: "堂善村委会",
+ number: "123",
+ value: "460105100207",
+ },
+ {
+ label: "长东村委会",
+ number: "123",
+ value: "460105100200",
+ },
+ {
+ label: "长南村委会",
+ number: "123",
+ value: "460105100206",
+ },
+ {
+ label: "博新村委会",
+ number: "123",
+ value: "460105100205",
+ },
+ {
+ label: "长丰村委会",
+ number: "123",
+ value: "460105100203",
+ },
+ {
+ label: "康安村委会",
+ number: "123",
+ value: "460105100201",
+ },
+ {
+ label: "镇海居委会",
+ number: "123",
+ value: "460105100002",
+ },
+ {
+ label: "长流墟居委会",
+ number: "123",
+ value: "460105100001",
+ },
+ {
+ label: "长流村委会",
+ number: "123",
+ value: "460105100208",
+ },
+ {
+ label: "长北村委会",
+ number: "123",
+ value: "460105100210",
+ },
+ {
+ label: "棠昌村委会",
+ number: "123",
+ value: "460105100209",
+ },
+ {
+ label: "美德村委会",
+ number: "123",
+ value: "460105100204",
+ },
+ {
+ label: "会南村委会",
+ number: "123",
+ value: "460105100202",
+ },
+ {
+ label: "长彤居委会",
+ number: "123",
+ value: "460105100004",
+ },
+ {
+ label: "长信居委会",
+ number: "123",
+ value: "460105100003",
+ },
+ ],
+ },
+ {
+ label: "西秀镇",
+ value: "460105101",
+ number: "123",
+ children: [
+ {
+ label: "长滨社区居委会",
+ number: "123",
+ value: "460105101001",
+ },
+ {
+ label: "南港社区居委会",
+ number: "123",
+ value: "460105101002",
+ },
+ {
+ label: "荣山村委会",
+ number: "123",
+ value: "460105101204",
+ },
+ {
+ label: "新和村委会",
+ number: "123",
+ value: "460105101205",
+ },
+ {
+ label: "丰盈村委会",
+ number: "123",
+ value: "460105101206",
+ },
+ {
+ label: "长德村委会",
+ number: "123",
+ value: "460105101201",
+ },
+ {
+ label: "博养村委会",
+ number: "123",
+ value: "460105101200",
+ },
+ {
+ label: "龙头村委会",
+ number: "123",
+ value: "460105101202",
+ },
+ {
+ label: "祥堂村委会",
+ number: "123",
+ value: "460105101203",
+ },
+ {
+ label: "新海村委会",
+ number: "123",
+ value: "460105101208",
+ },
+ {
+ label: "拔南村委会",
+ number: "123",
+ value: "460105101207",
+ },
+ {
+ label: "荣山寮村委会",
+ number: "123",
+ value: "460105101209",
+ },
+ ],
+ },
+ {
+ label: "海秀镇",
+ value: "460105102",
+ number: "123",
+ children: [
+ {
+ label: "海榆东社区居委会",
+ number: "123",
+ value: "460105102002",
+ },
+ {
+ label: "新村村委会",
+ number: "123",
+ value: "460105102200",
+ },
+ {
+ label: "水头村委会",
+ number: "123",
+ value: "460105102201",
+ },
+ {
+ label: "周仁村委会",
+ number: "123",
+ value: "460105102204",
+ },
+ {
+ label: "永庄村委会",
+ number: "123",
+ value: "460105102205",
+ },
+ {
+ label: "海榆西社区居委会",
+ number: "123",
+ value: "460105102001",
+ },
+ {
+ label: "业里村委会",
+ number: "123",
+ value: "460105102202",
+ },
+ {
+ label: "儒益村委会",
+ number: "123",
+ value: "460105102203",
+ },
+ ],
+ },
+ {
+ label: "石山镇",
+ value: "460105103",
+ number: "123",
+ children: [
+ {
+ label: "建新村委会",
+ number: "123",
+ value: "460105103208",
+ },
+ {
+ label: "安仁村委会",
+ number: "123",
+ value: "460105103206",
+ },
+ {
+ label: "美岭村委会",
+ number: "123",
+ value: "460105103209",
+ },
+ {
+ label: "石山墟居委会",
+ number: "123",
+ value: "460105103001",
+ },
+ {
+ label: "和平村委会",
+ number: "123",
+ value: "460105103200",
+ },
+ {
+ label: "扬佳村委会",
+ number: "123",
+ value: "460105103201",
+ },
+ {
+ label: "道堂村委会",
+ number: "123",
+ value: "460105103202",
+ },
+ {
+ label: "北铺村委会",
+ number: "123",
+ value: "460105103203",
+ },
+ {
+ label: "岭西村委会",
+ number: "123",
+ value: "460105103204",
+ },
+ {
+ label: "施茶村委会",
+ number: "123",
+ value: "460105103205",
+ },
+ {
+ label: "福安村委会",
+ number: "123",
+ value: "460105103207",
+ },
+ {
+ label: "道育村委会",
+ number: "123",
+ value: "460105103210",
+ },
+ ],
+ },
+ {
+ label: "永兴镇",
+ value: "460105104",
+ number: "123",
+ children: [
+ {
+ label: "建中村委会",
+ number: "123",
+ value: "460105104203",
+ },
+ {
+ label: "雷虎村委会",
+ number: "123",
+ value: "460105104204",
+ },
+ {
+ label: "罗经村委会",
+ number: "123",
+ value: "460105104206",
+ },
+ {
+ label: "建群村委会",
+ number: "123",
+ value: "460105104205",
+ },
+ {
+ label: "永兴墟居委会",
+ number: "123",
+ value: "460105104001",
+ },
+ {
+ label: "永秀村委会",
+ number: "123",
+ value: "460105104200",
+ },
+ {
+ label: "永德村委会",
+ number: "123",
+ value: "460105104201",
+ },
+ {
+ label: "博强村委会",
+ number: "123",
+ value: "460105104207",
+ },
+ {
+ label: "美东村委会",
+ number: "123",
+ value: "460105104202",
+ },
+ ],
+ },
+ {
+ label: "东山镇",
+ value: "460105105",
+ number: "123",
+ children: [
+ {
+ label: "儒万村委会",
+ number: "123",
+ value: "460105105201",
+ },
+ {
+ label: "永华村委会",
+ number: "123",
+ value: "460105105202",
+ },
+ {
+ label: "东山村委会",
+ number: "123",
+ value: "460105105203",
+ },
+ {
+ label: "东溪村委会",
+ number: "123",
+ value: "460105105204",
+ },
+ {
+ label: "光明村委会",
+ number: "123",
+ value: "460105105205",
+ },
+ {
+ label: "溪头村委会",
+ number: "123",
+ value: "460105105206",
+ },
+ {
+ label: "马坡村委会",
+ number: "123",
+ value: "460105105207",
+ },
+ {
+ label: "东苍村委会",
+ number: "123",
+ value: "460105105208",
+ },
+ {
+ label: "雅德村委会",
+ number: "123",
+ value: "460105105210",
+ },
+ {
+ label: "玉下村委会",
+ number: "123",
+ value: "460105105209",
+ },
+ {
+ label: "文塘村委会",
+ number: "123",
+ value: "460105105212",
+ },
+ {
+ label: "溪南村委会",
+ number: "123",
+ value: "460105105217",
+ },
+ {
+ label: "射钗村委会",
+ number: "123",
+ value: "460105105218",
+ },
+ {
+ label: "东城村委会",
+ number: "123",
+ value: "460105105219",
+ },
+ {
+ label: "镇南居委会",
+ number: "123",
+ value: "460105105001",
+ },
+ {
+ label: "镇北居委会",
+ number: "123",
+ value: "460105105002",
+ },
+ {
+ label: "建丰村委会",
+ number: "123",
+ value: "460105105211",
+ },
+ {
+ label: "紫罗村委会",
+ number: "123",
+ value: "460105105213",
+ },
+ {
+ label: "前进村委会",
+ number: "123",
+ value: "460105105214",
+ },
+ {
+ label: "环湖村委会",
+ number: "123",
+ value: "460105105215",
+ },
+ {
+ label: "东升村委会",
+ number: "123",
+ value: "460105105216",
+ },
+ {
+ label: "城西村委会",
+ number: "123",
+ value: "460105105220",
+ },
+ {
+ label: "东山热作场虚拟村委会",
+ number: "123",
+ value: "460105105500",
+ },
+ {
+ label: "热作农场村委会",
+ number: "123",
+ value: "460107500400",
+ },
+ {
+ label: "东星村委会",
+ number: "123",
+ value: "460105105200",
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: "龙华区",
+ value: "460106",
+ number: "123",
+ children: [
+ {
+ label: "中山路街道",
+ number: "123",
+ value: "460106001",
+ children: [
+ {
+ label: "长堤社区居委会",
+ number: "123",
+ value: "460106001001",
+ },
+ {
+ label: "人和坊社区居委会",
+ number: "123",
+ value: "460106001002",
+ },
+ {
+ label: "居仁坊社区居委会",
+ number: "123",
+ value: "460106001003",
+ },
+ {
+ label: "园内里社区居委会",
+ number: "123",
+ value: "460106001004",
+ },
+ {
+ label: "竹林社区居委会",
+ number: "123",
+ value: "460106001005",
+ },
+ {
+ label: "得胜沙社区居委会",
+ number: "123",
+ value: "460106001006",
+ },
+ {
+ label: "富兴社区居委会",
+ number: "123",
+ value: "460106001007",
+ },
+ {
+ label: "义兴社区居委会",
+ number: "123",
+ value: "460106001008",
+ },
+ {
+ label: "西湖社区居委会",
+ number: "123",
+ value: "460106001009",
+ },
+ {
+ label: "西门外社区居委会",
+ number: "123",
+ value: "460106001010",
+ },
+ {
+ label: "永兴社区居委会",
+ number: "123",
+ value: "460106001011",
+ },
+ ],
+ },
+ {
+ label: "滨海街道",
+ number: "123",
+ value: "460106002",
+ children: [
+ {
+ label: "八灶社区居委会",
+ number: "123",
+ value: "460106002001",
+ },
+ {
+ label: "滨海新村社区居委会",
+ number: "123",
+ value: "460106002002",
+ },
+ {
+ label: "滨海社区居委会",
+ number: "123",
+ value: "460106002003",
+ },
+ {
+ label: "盐灶一社区居委会",
+ number: "123",
+ value: "460106002004",
+ },
+ {
+ label: "盐灶二社区居委会",
+ number: "123",
+ value: "460106002005",
+ },
+ {
+ label: "盐灶三社区居委会",
+ number: "123",
+ value: "460106002006",
+ },
+ {
+ label: "龙华中社区居委会",
+ number: "123",
+ value: "460106002007",
+ },
+ {
+ label: "滨港社区居委会",
+ number: "123",
+ value: "460106002008",
+ },
+ {
+ label: "泰华社区居委会",
+ number: "123",
+ value: "460106002009",
+ },
+ {
+ label: "玉河社区居委会",
+ number: "123",
+ value: "460106002010",
+ },
+ ],
+ },
+ {
+ label: "金贸街道",
+ number: "123",
+ value: "460106003",
+ children: [
+ {
+ label: "龙华南社区居委会",
+ number: "123",
+ value: "460106003001",
+ },
+ {
+ label: "珠江社区居委会",
+ number: "123",
+ value: "460106003002",
+ },
+ {
+ label: "世贸社区居委会",
+ number: "123",
+ value: "460106003003",
+ },
+ {
+ label: "国贸社区居委会",
+ number: "123",
+ value: "460106003004",
+ },
+ {
+ label: "玉沙社区居委会",
+ number: "123",
+ value: "460106003005",
+ },
+ {
+ label: "电力社区居委会",
+ number: "123",
+ value: "460106003006",
+ },
+ {
+ label: "万绿园社区居委会",
+ number: "123",
+ value: "460106003007",
+ },
+ {
+ label: "金海社区居委会",
+ number: "123",
+ value: "460106003008",
+ },
+ {
+ label: "嘉华社区居委会",
+ number: "123",
+ value: "460106003009",
+ },
+ ],
+ },
+ {
+ label: "大同路街道",
+ number: "123",
+ value: "460106004",
+ children: [
+ {
+ label: "友谊社区居委会",
+ number: "123",
+ value: "460106004001",
+ },
+ {
+ label: "大同里社区居委会",
+ number: "123",
+ value: "460106004002",
+ },
+ {
+ label: "华海社区居委会",
+ number: "123",
+ value: "460106004003",
+ },
+ {
+ label: "龙昆上社区居委会",
+ number: "123",
+ value: "460106004004",
+ },
+ {
+ label: "龙昆下社区居委会",
+ number: "123",
+ value: "460106004005",
+ },
+ {
+ label: "正义社区居委会",
+ number: "123",
+ value: "460106004006",
+ },
+ {
+ label: "侨中社区居委会",
+ number: "123",
+ value: "460106004007",
+ },
+ {
+ label: "彩虹社区居委会",
+ number: "123",
+ value: "460106004008",
+ },
+ {
+ label: "义龙东社区居委会",
+ number: "123",
+ value: "460106004009",
+ },
+ {
+ label: "义龙西社区居委会",
+ number: "123",
+ value: "460106004010",
+ },
+ ],
+ },
+ {
+ label: "海垦街道",
+ number: "123",
+ value: "460106005",
+ children: [
+ {
+ label: "金垦社区居委会",
+ number: "123",
+ value: "460106005001",
+ },
+ {
+ label: "滨秀社区居委会",
+ number: "123",
+ value: "460106005002",
+ },
+ {
+ label: "海秀社区居委会",
+ number: "123",
+ value: "460106005003",
+ },
+ {
+ label: "金山社区居委会",
+ number: "123",
+ value: "460106005004",
+ },
+ {
+ label: "顺发社区居委会",
+ number: "123",
+ value: "460106005005",
+ },
+ {
+ label: "疏港社区居委会",
+ number: "123",
+ value: "460106005006",
+ },
+ {
+ label: "秀英村社区居委会",
+ number: "123",
+ value: "460106005008",
+ },
+ {
+ label: "滨涯社区居委会",
+ number: "123",
+ value: "460106005009",
+ },
+ {
+ label: "滨濂北社区居委会",
+ number: "123",
+ value: "460106005010",
+ },
+ {
+ label: "垦中社区居委会",
+ number: "123",
+ value: "460106005012",
+ },
+ {
+ label: "华垦社区居委会",
+ number: "123",
+ value: "460106005013",
+ },
+ {
+ label: "西岭社区居委会",
+ number: "123",
+ value: "460106005014",
+ },
+ {
+ label: "金牛岭社区居委会",
+ number: "123",
+ value: "460106005007",
+ },
+ {
+ label: "滨濂南社区居委会",
+ number: "123",
+ value: "460106005011",
+ },
+ ],
+ },
+ {
+ label: "金宇街道",
+ number: "123",
+ value: "460106006",
+ children: [
+ {
+ label: "银湖社区居委会",
+ number: "123",
+ value: "460106006001",
+ },
+ {
+ label: "面前坡社区居委会",
+ number: "123",
+ value: "460106006003",
+ },
+ {
+ label: "坡博西社区居委会",
+ number: "123",
+ value: "460106006004",
+ },
+ {
+ label: "坡巷社区居委会",
+ number: "123",
+ value: "460106006005",
+ },
+ {
+ label: "南沙社区居委会",
+ number: "123",
+ value: "460106006007",
+ },
+ {
+ label: "金坡社区居委会",
+ number: "123",
+ value: "460106006008",
+ },
+ {
+ label: "坡博南社区居委会",
+ number: "123",
+ value: "460106006009",
+ },
+ {
+ label: "海德社区居委会",
+ number: "123",
+ value: "460106006010",
+ },
+ {
+ label: "昌茂社区居委会",
+ number: "123",
+ value: "460106006002",
+ },
+ {
+ label: "坡博东社区居委会",
+ number: "123",
+ value: "460106006006",
+ },
+ ],
+ },
+ {
+ label: "城西镇",
+ value: "460106100",
+ number: "123",
+ children: [
+ {
+ label: "高坡村委会",
+ number: "123",
+ value: "460106100200",
+ },
+ {
+ label: "沙坡村委会",
+ number: "123",
+ value: "460106100203",
+ },
+ {
+ label: "苍东村委会",
+ number: "123",
+ value: "460106100206",
+ },
+ {
+ label: "大样村委会",
+ number: "123",
+ value: "460106100207",
+ },
+ {
+ label: "薛村村委会",
+ number: "123",
+ value: "460106100208",
+ },
+ {
+ label: "仁里南社区居委会",
+ number: "123",
+ value: "460106100001",
+ },
+ {
+ label: "金盘社区居委会",
+ number: "123",
+ value: "460106100003",
+ },
+ {
+ label: "仁里北社区居委会",
+ number: "123",
+ value: "460106100004",
+ },
+ {
+ label: "四季华庭社区居委会",
+ number: "123",
+ value: "460106100005",
+ },
+ {
+ label: "丁村村委会",
+ number: "123",
+ value: "460106100201",
+ },
+ {
+ label: "山高村委会",
+ number: "123",
+ value: "460106100202",
+ },
+ {
+ label: "头铺村委会",
+ number: "123",
+ value: "460106100204",
+ },
+ {
+ label: "金星社区居委会",
+ number: "123",
+ value: "460106100007",
+ },
+ {
+ label: "府西社区居委会",
+ number: "123",
+ value: "460106100002",
+ },
+ {
+ label: "金沙社区居委会",
+ number: "123",
+ value: "460106100006",
+ },
+ {
+ label: "苍西村委会",
+ number: "123",
+ value: "460106100205",
+ },
+ {
+ label: "丁村北社区居委会",
+ number: "123",
+ value: "460106100008",
+ },
+ {
+ label: "丁村南社区居委会",
+ number: "123",
+ value: "460106100009",
+ },
+ {
+ label: "山高西社区居委会",
+ number: "123",
+ value: "460106100010",
+ },
+ {
+ label: "山高东社区居委会",
+ number: "123",
+ value: "460106100011",
+ },
+ {
+ label: "头铺西社区居委会",
+ number: "123",
+ value: "460106100012",
+ },
+ {
+ label: "头铺东社区居委会",
+ number: "123",
+ value: "460106100013",
+ },
+ ],
+ },
+ {
+ label: "龙桥镇",
+ value: "460106101",
+ number: "123",
+ children: [
+ {
+ label: "龙洪村委会",
+ number: "123",
+ value: "460106101204",
+ },
+ {
+ label: "挺丰村委会",
+ number: "123",
+ value: "460106101200",
+ },
+ {
+ label: "道贡村委会",
+ number: "123",
+ value: "460106101202",
+ },
+ {
+ label: "玉荣村委会",
+ number: "123",
+ value: "460106101205",
+ },
+ {
+ label: "玉符村委会",
+ number: "123",
+ value: "460106101201",
+ },
+ {
+ label: "三角园村委会",
+ number: "123",
+ value: "460106101207",
+ },
+ {
+ label: "龙桥村委会",
+ number: "123",
+ value: "460106101203",
+ },
+ {
+ label: "永东村委会",
+ number: "123",
+ value: "460106101206",
+ },
+ ],
+ },
+ {
+ label: "新坡镇",
+ value: "460106102",
+ number: "123",
+ children: [
+ {
+ label: "仁南村委会",
+ number: "123",
+ value: "460106102211",
+ },
+ {
+ label: "农丰村委会",
+ number: "123",
+ value: "460106102204",
+ },
+ {
+ label: "民丰村委会",
+ number: "123",
+ value: "460106102208",
+ },
+ {
+ label: "新坡村委会",
+ number: "123",
+ value: "460106102209",
+ },
+ {
+ label: "仁里村委会",
+ number: "123",
+ value: "460106102212",
+ },
+ {
+ label: "光荣村委会",
+ number: "123",
+ value: "460106102210",
+ },
+ {
+ label: "群益村委会",
+ number: "123",
+ value: "460106102206",
+ },
+ {
+ label: "群丰村委会",
+ number: "123",
+ value: "460106102207",
+ },
+ {
+ label: "新彩村委会",
+ number: "123",
+ value: "460106102205",
+ },
+ {
+ label: "文山村委会",
+ number: "123",
+ value: "460106102200",
+ },
+ {
+ label: "文丰村委会",
+ number: "123",
+ value: "460106102201",
+ },
+ {
+ label: "新村村委会",
+ number: "123",
+ value: "460106102202",
+ },
+ {
+ label: "雄丰村委会",
+ number: "123",
+ value: "460106102203",
+ },
+ ],
+ },
+ {
+ label: "遵谭镇",
+ value: "460106103",
+ number: "123",
+ children: [
+ {
+ label: "遵谭村委会",
+ number: "123",
+ value: "460106103206",
+ },
+ {
+ label: "东谭村委会",
+ number: "123",
+ value: "460106103205",
+ },
+ {
+ label: "新谭村委会",
+ number: "123",
+ value: "460106103200",
+ },
+ {
+ label: "龙合村委会",
+ number: "123",
+ value: "460106103203",
+ },
+ {
+ label: "群力村委会",
+ number: "123",
+ value: "460106103201",
+ },
+ {
+ label: "咸东村委会",
+ number: "123",
+ value: "460106103204",
+ },
+ {
+ label: "咸谅村委会",
+ number: "123",
+ value: "460106103202",
+ },
+ ],
+ },
+ {
+ label: "龙泉镇",
+ value: "460106104",
+ number: "123",
+ children: [
+ {
+ label: "元平村委会",
+ number: "123",
+ value: "460106104210",
+ },
+ {
+ label: "富伟村委会",
+ number: "123",
+ value: "460106104212",
+ },
+ {
+ label: "占符村委会",
+ number: "123",
+ value: "460106104215",
+ },
+ {
+ label: "永昌村委会",
+ number: "123",
+ value: "460106104213",
+ },
+ {
+ label: "椰子头村委会",
+ number: "123",
+ value: "460106104207",
+ },
+ {
+ label: "五一村委会",
+ number: "123",
+ value: "460106104203",
+ },
+ {
+ label: "新江村委会",
+ number: "123",
+ value: "460106104202",
+ },
+ {
+ label: "仁新村委会",
+ number: "123",
+ value: "460106104204",
+ },
+ {
+ label: "扬亭村委会",
+ number: "123",
+ value: "460106104201",
+ },
+ {
+ label: "国扬村委会",
+ number: "123",
+ value: "460106104216",
+ },
+ {
+ label: "市井村委会",
+ number: "123",
+ value: "460106104211",
+ },
+ {
+ label: "美定村委会",
+ number: "123",
+ value: "460106104214",
+ },
+ {
+ label: "雅咏村委会",
+ number: "123",
+ value: "460106104205",
+ },
+ {
+ label: "大叠村委会",
+ number: "123",
+ value: "460106104206",
+ },
+ {
+ label: "美仁坡村委会",
+ number: "123",
+ value: "460106104208",
+ },
+ {
+ label: "新联村委会",
+ number: "123",
+ value: "460106104209",
+ },
+ {
+ label: "东占居委会",
+ number: "123",
+ value: "460106104001",
+ },
+ {
+ label: "翰香村委会",
+ number: "123",
+ value: "460106104200",
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: "琼山区",
+ value: "460107",
+ number: "123",
+ children: [
+ {
+ label: "国兴街道",
+ value: "460107001",
+ number: "123",
+ children: [
+ {
+ label: "巴伦社区居委会",
+ number: "123",
+ value: "460107001001",
+ },
+ {
+ label: "攀丹社区居委会",
+ number: "123",
+ value: "460107001002",
+ },
+ {
+ label: "米铺社区居委会",
+ number: "123",
+ value: "460107001003",
+ },
+ {
+ label: "八一社区居委会",
+ number: "123",
+ value: "460107001005",
+ },
+ {
+ label: "文政社区居委会",
+ number: "123",
+ value: "460107001006",
+ },
+ {
+ label: "文坛社区居委会",
+ number: "123",
+ value: "460107001007",
+ },
+ {
+ label: "道客社区居委会",
+ number: "123",
+ value: "460107001004",
+ },
+ ],
+ },
+ {
+ label: "府城街道",
+ value: "460107002",
+ number: "123",
+ children: [
+ {
+ label: "府城社区居委会",
+ number: "123",
+ value: "460107002001",
+ },
+ {
+ label: "忠介社区居委会",
+ number: "123",
+ value: "460107002002",
+ },
+ {
+ label: "云露社区居委会",
+ number: "123",
+ value: "460107002003",
+ },
+ {
+ label: "北官社区居委会",
+ number: "123",
+ value: "460107002005",
+ },
+ {
+ label: "甘蔗园社区居委会",
+ number: "123",
+ value: "460107002006",
+ },
+ {
+ label: "北胜社区居委会",
+ number: "123",
+ value: "460107002007",
+ },
+ {
+ label: "龙昆南社区居委会",
+ number: "123",
+ value: "460107002008",
+ },
+ {
+ label: "文庄社区居委会",
+ number: "123",
+ value: "460107002004",
+ },
+ {
+ label: "鼓楼社区居委会",
+ number: "123",
+ value: "460107002009",
+ },
+ ],
+ },
+ {
+ label: "滨江街道",
+ value: "460107003",
+ number: "123",
+ children: [
+ {
+ label: "东门社区居委会",
+ number: "123",
+ value: "460107003001",
+ },
+ {
+ label: "城东社区居委会",
+ number: "123",
+ value: "460107003002",
+ },
+ {
+ label: "下坎社区居委会",
+ number: "123",
+ value: "460107003003",
+ },
+ {
+ label: "铁桥社区居委会",
+ number: "123",
+ value: "460107003004",
+ },
+ {
+ label: "博桂社区居委会",
+ number: "123",
+ value: "460107003005",
+ },
+ {
+ label: "北冲溪社区居委会",
+ number: "123",
+ value: "460107003006",
+ },
+ ],
+ },
+ {
+ label: "凤翔街道",
+ value: "460107004",
+ number: "123",
+ children: [
+ {
+ label: "桂林社区居委会",
+ number: "123",
+ value: "460107004001",
+ },
+ {
+ label: "高登社区居委会",
+ number: "123",
+ value: "460107004002",
+ },
+ {
+ label: "大园社区居委会",
+ number: "123",
+ value: "460107004003",
+ },
+ {
+ label: "凤翔社区居委会",
+ number: "123",
+ value: "460107004004",
+ },
+ {
+ label: "三峰社区居委会",
+ number: "123",
+ value: "460107004005",
+ },
+ {
+ label: "洗马桥社区居委会",
+ number: "123",
+ value: "460107004006",
+ },
+ {
+ label: "红星村委会",
+ value: "460107004203",
+ },
+ {
+ label: "那央村委会",
+ value: "460107004200",
+ },
+ {
+ label: "儒逢村委会",
+ value: "460107004202",
+ },
+ {
+ label: "五岳村委会",
+ value: "460107004201",
+ },
+ {
+ label: "石塔村委会",
+ value: "460107004204",
+ },
+ {
+ label: "迈瀛社区居委会",
+ number: "123",
+ value: "460107004007",
+ },
+ ],
+ },
+ {
+ label: "龙塘镇",
+ value: "460107101",
+ number: "123",
+ children: [
+ {
+ label: "三桥村委会",
+ value: "460107101200",
+ number: "123",
+ },
+ {
+ label: "龙富村委会",
+ value: "460107101201",
+ number: "123",
+ },
+ {
+ label: "仁三村委会",
+ value: "460107101202",
+ number: "123",
+ },
+ {
+ label: "潭口村委会",
+ value: "460107101203",
+ number: "123",
+ },
+ {
+ label: "龙光村委会",
+ value: "460107101204",
+ number: "123",
+ },
+ {
+ label: "新民村委会",
+ value: "460107101205",
+ number: "123",
+ },
+ {
+ label: "龙新村委会",
+ value: "460107101206",
+ number: "123",
+ },
+ {
+ label: "文道村委会",
+ value: "460107101207",
+ number: "123",
+ },
+ {
+ label: "仁庄村委会",
+ value: "460107101209",
+ number: "123",
+ },
+ {
+ label: "三联村委会",
+ value: "460107101208",
+ number: "123",
+ },
+ {
+ label: "龙塘居委会",
+ number: "123",
+ value: "460107101001",
+ },
+ ],
+ },
+ {
+ label: "云龙镇",
+ value: "460107102",
+ number: "123",
+ children: [
+ {
+ label: "云龙村委会",
+ value: "460107102201",
+ number: "123",
+ },
+ {
+ label: "云阁村委会",
+ value: "460107102203",
+ number: "123",
+ },
+ {
+ label: "云裕村委会",
+ value: "460107102205",
+ number: "123",
+ },
+ {
+ label: "云蛟村委会",
+ value: "460107102204",
+ number: "123",
+ },
+ {
+ label: "云岭村委会",
+ value: "460107102206",
+ number: "123",
+ },
+ {
+ label: "长泰村委会",
+ value: "460107102202",
+ number: "123",
+ },
+ {
+ label: "儒林村委会",
+ value: "460107102200",
+ number: "123",
+ },
+ {
+ label: "南区居委会",
+ number: "123",
+ value: "460107102001",
+ },
+ ],
+ },
+ {
+ label: "红旗镇",
+ value: "460107103",
+ number: "123",
+ children: [
+ {
+ label: "昌文村委会",
+ value: "460107103200",
+ number: "123",
+ },
+ {
+ label: "红旗村委会",
+ value: "460107103209",
+ number: "123",
+ },
+ {
+ label: "大山村委会",
+ value: "460107103201",
+ number: "123",
+ },
+ {
+ label: "龙榜村委会",
+ value: "460107103202",
+ number: "123",
+ },
+ {
+ label: "合群村委会",
+ value: "460107103203",
+ number: "123",
+ },
+ {
+ label: "道崇村委会",
+ value: "460107103204",
+ number: "123",
+ },
+ {
+ label: "苏寻三村委会",
+ value: "460107103205",
+ number: "123",
+ },
+ {
+ label: "龙源村委会",
+ value: "460107103206",
+ number: "123",
+ },
+ {
+ label: "龙发村委会",
+ value: "460107103207",
+ number: "123",
+ },
+ {
+ label: "墨桥村委会",
+ value: "460107103208",
+ number: "123",
+ },
+ {
+ label: "土桥居委会",
+ number: "123",
+ value: "460107103001",
+ },
+ ],
+ },
+ {
+ label: "三门坡镇",
+ value: "460107104",
+ number: "123",
+ children: [
+ {
+ label: "文岭村委会",
+ value: "460107104201",
+ number: "123",
+ },
+ {
+ label: "新德村委会",
+ value: "460107104200",
+ number: "123",
+ },
+ {
+ label: "美城村委会",
+ value: "460107104202",
+ number: "123",
+ },
+ {
+ label: "龙马村委会",
+ value: "460107104203",
+ number: "123",
+ },
+ {
+ label: "谭文村委会",
+ value: "460107104204",
+ number: "123",
+ },
+ {
+ label: "谷桥村委会",
+ value: "460107104205",
+ number: "123",
+ },
+ {
+ label: "乐来村委会",
+ value: "460107104209",
+ number: "123",
+ },
+ {
+ label: "清泉村委会",
+ value: "460107104207",
+ number: "123",
+ },
+ {
+ label: "友爱村委会",
+ value: "460107104208",
+ number: "123",
+ },
+ {
+ label: "文蛟村委会",
+ value: "460107104206",
+ number: "123",
+ },
+ {
+ label: "庆丰居委会",
+ number: "123",
+ value: "460107104001",
+ },
+ {
+ label: "谭新社区居委会",
+ number: "123",
+ value: "460107104002",
+ },
+ ],
+ },
+ {
+ label: "大坡镇",
+ value: "460107105",
+ number: "123",
+ children: [
+ {
+ label: "大坡村委会",
+ value: "460107105200",
+ number: "123",
+ },
+ {
+ label: "福昌村委会",
+ value: "460107105203",
+ number: "123",
+ },
+ {
+ label: "中税村委会",
+ value: "460107105202",
+ number: "123",
+ },
+ {
+ label: "新瑞村委会",
+ value: "460107105201",
+ number: "123",
+ },
+ {
+ label: "树德村委会",
+ value: "460107105204",
+ number: "123",
+ },
+ {
+ label: "博坡社区居委会",
+ number: "123",
+ value: "460107105001",
+ },
+ ],
+ },
+ {
+ label: "甲子镇",
+ value: "460107106",
+ number: "123",
+ children: [
+ {
+ label: "昌西村委会",
+ value: "460107106203",
+ number: "123",
+ },
+ {
+ label: "青云村委会",
+ value: "460107106204",
+ number: "123",
+ },
+ {
+ label: "红岭村委会",
+ value: "460107106201",
+ number: "123",
+ },
+ {
+ label: "民昌村委会",
+ value: "460107106205",
+ number: "123",
+ },
+ {
+ label: "琼星村委会",
+ value: "460107106207",
+ number: "123",
+ },
+ {
+ label: "琼新村委会",
+ value: "460107106206",
+ number: "123",
+ },
+ {
+ label: "益新村委会",
+ value: "460107106210",
+ number: "123",
+ },
+ {
+ label: "仙民村委会",
+ value: "460107106209",
+ number: "123",
+ },
+ {
+ label: "益民村委会",
+ value: "460107106208",
+ number: "123",
+ },
+ {
+ label: "大同村委会",
+ value: "460107106211",
+ number: "123",
+ },
+ {
+ label: "民兴村委会",
+ value: "460107106212",
+ number: "123",
+ },
+ {
+ label: "新昌村委会",
+ value: "460107106213",
+ number: "123",
+ },
+ {
+ label: "群星村委会",
+ value: "460107106202",
+ number: "123",
+ },
+ {
+ label: "长昌村委会",
+ value: "460107106214",
+ number: "123",
+ },
+ {
+ label: "海丰村委会",
+ value: "460107106215",
+ number: "123",
+ },
+ {
+ label: "甲子村委会",
+ value: "460107106200",
+ number: "123",
+ },
+ {
+ label: "甲新社区居委会",
+ number: "123",
+ value: "460107106001",
+ },
+ ],
+ },
+ {
+ label: "旧州镇",
+ value: "460107107",
+ number: "123",
+ children: [
+ {
+ label: "旧州村委会",
+ value: "460107107200",
+ number: "123",
+ },
+ {
+ label: "红卫村委会",
+ value: "460107107202",
+ number: "123",
+ },
+ {
+ label: "联丰村委会",
+ value: "460107107206",
+ number: "123",
+ },
+ {
+ label: "联星村委会",
+ value: "460107107207",
+ number: "123",
+ },
+ {
+ label: "池连村委会",
+ value: "460107107208",
+ number: "123",
+ },
+ {
+ label: "光明村委会",
+ value: "460107107209",
+ number: "123",
+ },
+ {
+ label: "岭南村委会",
+ value: "460107107201",
+ number: "123",
+ },
+ {
+ label: "道美村委会",
+ value: "460107107205",
+ number: "123",
+ },
+ {
+ label: "文新村委会",
+ value: "460107107203",
+ number: "123",
+ },
+ {
+ label: "雅秀村委会",
+ value: "460107107204",
+ number: "123",
+ },
+ {
+ label: "双拥社区居委会",
+ number: "123",
+ value: "460107107001",
+ },
+ ],
+ },
+ {
+ label: "国营东昌农场",
+ value: "460107401",
+ number: "123",
+ children: [
+ {
+ label: "国营东昌农场虚拟居委会",
+ number: "123",
+ value: "460107401400",
+ },
+ ],
+ },
+ {
+ label: "国营红明农场",
+ value: "460107400",
+ number: "123",
+ children: [
+ {
+ label: "国营红明农场虚拟居委会",
+ number: "123",
+ value: "460107400400",
+ },
+ ],
+ },
+ {
+ label: "省长昌煤矿",
+ value: "460107501",
+ number: "123",
+ children: [
+ {
+ label: "省长昌煤矿虚拟居委会",
+ number: "123",
+ value: "460107501400",
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: "美兰区",
+ value: "460108",
+ number: "123",
+ children: [
+ {
+ label: "海府街道",
+ number: "123",
+ value: "460108001",
+ children: [
+ {
+ label: "东湖里社区居委会",
+ number: "123",
+ value: "460108001001",
+ },
+ {
+ label: "白坡里社区居委会",
+ number: "123",
+ value: "460108001002",
+ },
+ {
+ label: "龙峰社区居委会",
+ number: "123",
+ value: "460108001003",
+ },
+ {
+ label: "龙舌坡社区居委会",
+ number: "123",
+ value: "460108001004",
+ },
+ {
+ label: "大英社区居委会",
+ number: "123",
+ value: "460108001005",
+ },
+ {
+ label: "南宝社区居委会",
+ number: "123",
+ value: "460108001006",
+ },
+ ],
+ },
+ {
+ label: "蓝天街道",
+ number: "123",
+ value: "460108002",
+ children: [
+ {
+ label: "龙岐社区居委会",
+ number: "123",
+ value: "460108002001",
+ },
+ {
+ label: "万华社区居委会",
+ number: "123",
+ value: "460108002002",
+ },
+ {
+ label: "塔光社区居委会",
+ number: "123",
+ value: "460108002003",
+ },
+ {
+ label: "下洋社区居委会",
+ number: "123",
+ value: "460108002004",
+ },
+ ],
+ },
+ {
+ label: "博爱街道",
+ number: "123",
+ value: "460108003",
+ children: [
+ {
+ label: "新风里社区居委会",
+ number: "123",
+ value: "460108003001",
+ },
+ {
+ label: "振龙社区居委会",
+ number: "123",
+ value: "460108003002",
+ },
+ {
+ label: "龙文坊社区居委会",
+ number: "123",
+ value: "460108003003",
+ },
+ {
+ label: "三亚社区居委会",
+ number: "123",
+ value: "460108003004",
+ },
+ {
+ label: "南联社区居委会",
+ number: "123",
+ value: "460108003005",
+ },
+ {
+ label: "联桂坊社区居委会",
+ number: "123",
+ value: "460108003006",
+ },
+ {
+ label: "红坎坡社区居委会",
+ number: "123",
+ value: "460108003007",
+ },
+ ],
+ },
+ {
+ label: "海甸街道",
+ number: "123",
+ value: "460108004",
+ children: [
+ {
+ label: "新安社区居委会",
+ number: "123",
+ value: "460108004001",
+ },
+ {
+ label: "沿江社区居委会",
+ number: "123",
+ value: "460108004002",
+ },
+ {
+ label: "金甸社区居委会",
+ number: "123",
+ value: "460108004003",
+ },
+ {
+ label: "海达社区居委会",
+ number: "123",
+ value: "460108004004",
+ },
+ {
+ label: "白沙门社区居委会",
+ number: "123",
+ value: "460108004005",
+ },
+ {
+ label: "福安社区居委会",
+ number: "123",
+ value: "460108004006",
+ },
+ ],
+ },
+ {
+ label: "人民街道",
+ number: "123",
+ value: "460108005",
+ children: [
+ {
+ label: "拦海社区居委会",
+ number: "123",
+ value: "460108005004",
+ },
+ {
+ label: "新利社区居委会",
+ number: "123",
+ value: "460108005005",
+ },
+ {
+ label: "万福社区居委会",
+ number: "123",
+ value: "460108005006",
+ },
+ {
+ label: "银甸社区居委会",
+ number: "123",
+ value: "460108005001",
+ },
+ {
+ label: "捕捞社区居委会",
+ number: "123",
+ value: "460108005002",
+ },
+ {
+ label: "邦墩社区居委会",
+ number: "123",
+ value: "460108005003",
+ },
+ {
+ label: "美丽沙社区居委会",
+ number: "123",
+ value: "460108005007",
+ },
+ ],
+ },
+ {
+ label: "白龙街道",
+ number: "123",
+ value: "460108006",
+ children: [
+ {
+ label: "美舍社区居委会",
+ number: "123",
+ value: "460108006001",
+ },
+ {
+ label: "振兴社区居委会",
+ number: "123",
+ value: "460108006002",
+ },
+ {
+ label: "五贤社区居委会",
+ number: "123",
+ value: "460108006003",
+ },
+ {
+ label: "千家社区居委会",
+ number: "123",
+ value: "460108006004",
+ },
+ {
+ label: "流水坡社区居委会",
+ number: "123",
+ value: "460108006005",
+ },
+ {
+ label: "群上社区居委会",
+ number: "123",
+ value: "460108006006",
+ },
+ ],
+ },
+ {
+ label: "和平南街道",
+ number: "123",
+ value: "460108007",
+ children: [
+ {
+ label: "文明社区居委会",
+ number: "123",
+ value: "460108007001",
+ },
+ {
+ label: "君尧社区居委会",
+ number: "123",
+ value: "460108007002",
+ },
+ {
+ label: "上坡社区居委会",
+ number: "123",
+ value: "460108007003",
+ },
+ {
+ label: "琼苑社区居委会",
+ number: "123",
+ value: "460108007004",
+ },
+ {
+ label: "光阳社区居委会",
+ number: "123",
+ value: "460108007005",
+ },
+ ],
+ },
+ {
+ label: "白沙街道",
+ number: "123",
+ value: "460108008",
+ children: [
+ {
+ label: "锦山里社区居委会",
+ number: "123",
+ value: "460108008001",
+ },
+ {
+ label: "白沙坊社区居委会",
+ number: "123",
+ value: "460108008002",
+ },
+ {
+ label: "白龙社区居委会",
+ number: "123",
+ value: "460108008003",
+ },
+ {
+ label: "岭下社区居委会",
+ number: "123",
+ value: "460108008004",
+ },
+ ],
+ },
+ {
+ label: "新埠街道",
+ number: "123",
+ value: "460108009",
+ children: [
+ {
+ label: "新埠社区居委会",
+ number: "123",
+ value: "460108009001",
+ },
+ {
+ label: "新东社区居委会",
+ number: "123",
+ value: "460108009002",
+ },
+ {
+ label: "三联社区居委会",
+ number: "123",
+ value: "460108009003",
+ },
+ {
+ label: "土尾社区居委会",
+ number: "123",
+ value: "460108009004",
+ },
+ ],
+ },
+ {
+ label: "灵山镇",
+ value: "460108101",
+ number: "123",
+ children: [
+ {
+ label: "东头村委会",
+ value: "460108101200",
+ number: "123",
+ },
+ {
+ label: "晋文村委会",
+ value: "460108101213",
+ number: "123",
+ },
+ {
+ label: "桥东村委会",
+ value: "460108101214",
+ number: "123",
+ },
+ {
+ label: "林昌村委会",
+ value: "460108101203",
+ number: "123",
+ },
+ {
+ label: "新市村委会",
+ value: "460108101205",
+ number: "123",
+ },
+ {
+ label: "新琼村委会",
+ value: "460108101202",
+ number: "123",
+ },
+ {
+ label: "新管村委会",
+ value: "460108101204",
+ number: "123",
+ },
+ {
+ label: "东营村委会",
+ value: "460108101208",
+ number: "123",
+ },
+ {
+ label: "东湖村委会",
+ value: "460108101201",
+ number: "123",
+ },
+ {
+ label: "东和村委会",
+ value: "460108101221",
+ number: "123",
+ },
+ {
+ label: "爱群村委会",
+ value: "460108101210",
+ number: "123",
+ },
+ {
+ label: "灵山居委会",
+ number: "123",
+ value: "460108101001",
+ },
+ {
+ label: "红丰村委会",
+ value: "460108101216",
+ number: "123",
+ },
+ {
+ label: "群山村委会",
+ value: "460108101212",
+ number: "123",
+ },
+ {
+ label: "锦丰村委会",
+ value: "460108101206",
+ number: "123",
+ },
+ {
+ label: "大林村委会",
+ value: "460108101215",
+ number: "123",
+ },
+ {
+ label: "大昌村委会",
+ value: "460108101217",
+ number: "123",
+ },
+ {
+ label: "美庄村委会",
+ value: "460108101220",
+ number: "123",
+ },
+ {
+ label: "福玉村委会",
+ value: "460108101207",
+ number: "123",
+ },
+ {
+ label: "晋美社区居委会",
+ number: "123",
+ value: "460108101002",
+ },
+ {
+ label: "仙云社区居委会",
+ number: "123",
+ value: "460108101003",
+ },
+ {
+ label: "东平村委会",
+ value: "460108101219",
+ number: "123",
+ },
+ {
+ label: "仲恺村委会",
+ value: "460108101209",
+ number: "123",
+ },
+ {
+ label: "灵山村委会",
+ value: "460108101211",
+ number: "123",
+ },
+ {
+ label: "新岛村委会",
+ value: "460108101218",
+ number: "123",
+ },
+ ],
+ },
+ {
+ label: "演丰镇",
+ value: "460108102",
+ number: "123",
+ children: [
+ {
+ label: "演丰居委会",
+ number: "123",
+ value: "460108102001",
+ },
+ {
+ label: "演海村委会",
+ value: "460108102200",
+ number: "123",
+ },
+ {
+ label: "边海村委会",
+ value: "460108102201",
+ number: "123",
+ },
+ {
+ label: "北港村委会",
+ value: "460108102202",
+ number: "123",
+ },
+ {
+ label: "演中村委会",
+ value: "460108102203",
+ number: "123",
+ },
+ {
+ label: "美兰村委会",
+ value: "460108102204",
+ number: "123",
+ },
+ {
+ label: "演东村委会",
+ value: "460108102205",
+ number: "123",
+ },
+ {
+ label: "苏民村委会",
+ value: "460108102206",
+ number: "123",
+ },
+ {
+ label: "演南村委会",
+ value: "460108102207",
+ number: "123",
+ },
+ {
+ label: "昌城村委会",
+ value: "460108102208",
+ number: "123",
+ },
+ {
+ label: "群庄村委会",
+ value: "460108102209",
+ number: "123",
+ },
+ {
+ label: "塔市村委会",
+ value: "460108102210",
+ number: "123",
+ },
+ {
+ label: "演西村委会",
+ value: "460108102211",
+ number: "123",
+ },
+ {
+ label: "山尾村委会",
+ value: "460108102212",
+ number: "123",
+ },
+ ],
+ },
+ {
+ label: "三江镇",
+ value: "460108103",
+ number: "123",
+ children: [
+ {
+ label: "三江居居委会",
+ number: "123",
+ value: "460108103002",
+ },
+ {
+ label: "苏寻三村委会",
+ value: "460108103204",
+ number: "123",
+ },
+ {
+ label: "眼镜塘村委会",
+ value: "460108103206",
+ number: "123",
+ },
+ {
+ label: "江源村委会",
+ value: "460108103207",
+ number: "123",
+ },
+ {
+ label: "上云村委会",
+ value: "460108103205",
+ number: "123",
+ },
+ {
+ label: "三江村委会",
+ value: "460108103200",
+ number: "123",
+ },
+ {
+ label: "茄南村委会",
+ value: "460108103201",
+ number: "123",
+ },
+ {
+ label: "道学村委会",
+ value: "460108103202",
+ number: "123",
+ },
+ {
+ label: "茄芮村委会",
+ value: "460108103203",
+ number: "123",
+ },
+ {
+ label: "三江居委会",
+ number: "123",
+ value: "460108103001",
+ },
+ ],
+ },
+ {
+ label: "大致坡镇",
+ value: "460108104",
+ number: "123",
+ children: [
+ {
+ label: "崇德村委会",
+ value: "460108104206",
+ number: "123",
+ },
+ {
+ label: "美良村委会",
+ value: "460108104209",
+ number: "123",
+ },
+ {
+ label: "椰林居委会",
+ number: "123",
+ value: "460108104002",
+ },
+ {
+ label: "大致坡镇",
+ value: "460108106011",
+ number: "123",
+ },
+ {
+ label: "民乐居委会",
+ number: "123",
+ value: "460108104001",
+ },
+ {
+ label: "昌福村委会",
+ value: "460108104200",
+ number: "123",
+ },
+ {
+ label: "金堆村委会",
+ value: "460108104201",
+ number: "123",
+ },
+ {
+ label: "大东村委会",
+ value: "460108104202",
+ number: "123",
+ },
+ {
+ label: "永群村委会",
+ value: "460108104203",
+ number: "123",
+ },
+ {
+ label: "栽群村委会",
+ value: "460108104204",
+ number: "123",
+ },
+ {
+ label: "咸来村委会",
+ value: "460108104205",
+ number: "123",
+ },
+ {
+ label: "美桐村委会",
+ value: "460108104207",
+ number: "123",
+ },
+ {
+ label: "大榕村委会",
+ value: "460108104208",
+ number: "123",
+ },
+ {
+ label: "咸来居委会",
+ number: "123",
+ value: "460108104003",
+ },
+ ],
+ },
+ {
+ label: "国营三江农场",
+ value: "460108401",
+ number: "123",
+ children: [
+ {
+ label: "国营三江农场虚拟居委会",
+ number: "123",
+ value: "460108401400",
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: "桂林洋",
+ value: "460114",
+ number: "123",
+ children: [
+ {
+ label: "林东管理区",
+ number: "123",
+ value: "460114001",
+ children: [
+ {
+ label: "传忠社区居委会",
+ number: "123",
+ value: "460114001001",
+ },
+ {
+ label: "永卫社区居委会",
+ number: "123",
+ value: "460114001002",
+ },
+ ],
+ },
+ {
+ label: "迈演管理区",
+ number: "123",
+ value: "460114006",
+ children: [
+ {
+ label: "五一社区居委会",
+ number: "123",
+ value: "460114006002",
+ },
+ {
+ label: "迈进社区居委会",
+ number: "123",
+ value: "460114006001",
+ },
+ ],
+ },
+ {
+ label: "兴洋管理区",
+ number: "123",
+ value: "460114005",
+ children: [
+ {
+ label: "场部社区居委会",
+ number: "123",
+ value: "460114005002",
+ },
+ {
+ label: "场部社区居委会",
+ number: "123",
+ value: "460114005001",
+ },
+ ],
+ },
+ {
+ label: "青松管理区",
+ number: "123",
+ value: "460114004",
+ children: [
+ {
+ label: "青合社区居委会",
+ number: "123",
+ value: "460114004003",
+ },
+ {
+ label: "美莲社区居委会",
+ number: "123",
+ value: "460114004002",
+ },
+ {
+ label: "昌炳社区居委会",
+ number: "123",
+ value: "460114004001",
+ },
+ ],
+ },
+ {
+ label: "振新管理区",
+ number: "123",
+ value: "460114003",
+ children: [
+ {
+ label: "新群社区居委会",
+ number: "123",
+ value: "460114003002",
+ },
+ {
+ label: "振家社区居委会",
+ number: "123",
+ value: "460114003001",
+ },
+ ],
+ },
+ {
+ label: "高丰管理区",
+ number: "123",
+ value: "460114002",
+ children: [
+ {
+ label: "丰兴社区居委会",
+ number: "123",
+ value: "460114002002",
+ },
+ {
+ label: "高山社区居委会",
+ number: "123",
+ value: "460114002001",
+ },
+ ],
+ },
+ ],
+ },
+ ],
+ },
+];
diff --git a/public/regionData2.js b/public/regionData2.js
new file mode 100644
index 0000000..ce1b544
--- /dev/null
+++ b/public/regionData2.js
@@ -0,0 +1,2258 @@
+let regionData2 = [
+ {
+ label: '秀英区',
+ value: '460105',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '秀英街道办事处',
+ value: '460105001',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '秀华社区居委会',
+ value: '460105001001',
+ },
+ {
+ label: '秀海社区居委会',
+ value: '460105001002',
+ },
+ {
+ label: '秀中社区居委会',
+ value: '460105001003',
+ },
+ {
+ label: '秀新社区居委会',
+ value: '460105001004',
+ },
+ {
+ label: '向荣村委会',
+ value: '460105001200',
+ },
+ {
+ label: '书场村委会',
+ value: '460105001201',
+ },
+ {
+ label: '高新社区居委会',
+ value: '460105001005',
+ },
+ ],
+ },
+ {
+ label: '海秀街道办事处',
+ value: '460105002',
+ children: [
+ {
+ label: '海口港社区居委会',
+ value: '460105002001',
+ },
+ {
+ label: '长秀社区居委会',
+ value: '460105002003',
+ },
+ {
+ label: '金鼎社区居委会',
+ value: '460105002004',
+ },
+ {
+ label: '十一支队家属社区居委会',
+ value: '460105002005',
+ },
+ {
+ label: '天海社区居委会',
+ value: '460105002007',
+ },
+ {
+ label: '东方洋社区居委会',
+ value: '460105002002',
+ },
+ {
+ label: '爱华社区居委会',
+ value: '460105002006',
+ },
+ ],
+ },
+ {
+ label: '长流镇',
+ value: '460105100',
+ children: [
+ {
+ label: '美李村委会',
+ value: '460105100211',
+ },
+ {
+ label: '堂善村委会',
+ value: '460105100207',
+ },
+ {
+ label: '长东村委会',
+ value: '460105100200',
+ },
+ {
+ label: '长南村委会',
+ value: '460105100206',
+ },
+ {
+ label: '博新村委会',
+ value: '460105100205',
+ },
+ {
+ label: '长丰村委会',
+ value: '460105100203',
+ },
+ {
+ label: '康安村委会',
+ value: '460105100201',
+ },
+ {
+ label: '镇海居委会',
+ value: '460105100002',
+ },
+ {
+ label: '长流墟居委会',
+ value: '460105100001',
+ },
+ {
+ label: '长流村委会',
+ value: '460105100208',
+ },
+ {
+ label: '长北村委会',
+ value: '460105100210',
+ },
+ {
+ label: '棠昌村委会',
+ value: '460105100209',
+ },
+ {
+ label: '美德村委会',
+ value: '460105100204',
+ },
+ {
+ label: '会南村委会',
+ value: '460105100202',
+ },
+ {
+ label: '长彤居委会',
+ value: '460105100004',
+ },
+ {
+ label: '长信居委会',
+ value: '460105100003',
+ },
+ ],
+ },
+ {
+ label: '西秀镇',
+ value: '460105101',
+ children: [
+ {
+ label: '长滨社区居委会',
+ value: '460105101001',
+ },
+ {
+ label: '南港社区居委会',
+ value: '460105101002',
+ },
+ {
+ label: '荣山村委会',
+ value: '460105101204',
+ },
+ {
+ label: '新和村委会',
+ value: '460105101205',
+ },
+ {
+ label: '丰盈村委会',
+ value: '460105101206',
+ },
+ {
+ label: '长德村委会',
+ value: '460105101201',
+ },
+ {
+ label: '博养村委会',
+ value: '460105101200',
+ },
+ {
+ label: '龙头村委会',
+ value: '460105101202',
+ },
+ {
+ label: '祥堂村委会',
+ value: '460105101203',
+ },
+ {
+ label: '新海村委会',
+ value: '460105101208',
+ },
+ {
+ label: '拔南村委会',
+ value: '460105101207',
+ },
+ {
+ label: '荣山寮村委会',
+ value: '460105101209',
+ },
+ ],
+ },
+ {
+ label: '海秀镇',
+ value: '460105102',
+ children: [
+ {
+ label: '海榆东社区居委会',
+ value: '460105102002',
+ },
+ {
+ label: '新村村委会',
+ value: '460105102200',
+ },
+ {
+ label: '水头村委会',
+ value: '460105102201',
+ },
+ {
+ label: '周仁村委会',
+ value: '460105102204',
+ },
+ {
+ label: '永庄村委会',
+ value: '460105102205',
+ },
+ {
+ label: '海榆西社区居委会',
+ value: '460105102001',
+ },
+ {
+ label: '业里村委会',
+ value: '460105102202',
+ },
+ {
+ label: '儒益村委会',
+ value: '460105102203',
+ },
+ ],
+ },
+ {
+ label: '石山镇',
+ value: '460105103',
+ children: [
+ {
+ label: '建新村委会',
+ value: '460105103208',
+ },
+ {
+ label: '安仁村委会',
+ value: '460105103206',
+ },
+ {
+ label: '美岭村委会',
+ value: '460105103209',
+ },
+ {
+ label: '石山墟居委会',
+ value: '460105103001',
+ },
+ {
+ label: '和平村委会',
+ value: '460105103200',
+ },
+ {
+ label: '扬佳村委会',
+ value: '460105103201',
+ },
+ {
+ label: '道堂村委会',
+ value: '460105103202',
+ },
+ {
+ label: '北铺村委会',
+ value: '460105103203',
+ },
+ {
+ label: '岭西村委会',
+ value: '460105103204',
+ },
+ {
+ label: '施茶村委会',
+ value: '460105103205',
+ },
+ {
+ label: '福安村委会',
+ value: '460105103207',
+ },
+ {
+ label: '道育村委会',
+ value: '460105103210',
+ },
+ ],
+ },
+ {
+ label: '永兴镇',
+ value: '460105104',
+ children: [
+ {
+ label: '建中村委会',
+ value: '460105104203',
+ },
+ {
+ label: '雷虎村委会',
+ value: '460105104204',
+ },
+ {
+ label: '罗经村委会',
+ value: '460105104206',
+ },
+ {
+ label: '建群村委会',
+ value: '460105104205',
+ },
+ {
+ label: '永兴墟居委会',
+ value: '460105104001',
+ },
+ {
+ label: '永秀村委会',
+ value: '460105104200',
+ },
+ {
+ label: '永德村委会',
+ value: '460105104201',
+ },
+ {
+ label: '博强村委会',
+ value: '460105104207',
+ },
+ {
+ label: '美东村委会',
+ value: '460105104202',
+ },
+ ],
+ },
+ {
+ label: '东山镇',
+ value: '460105105',
+ children: [
+ {
+ label: '儒万村委会',
+ value: '460105105201',
+ },
+ {
+ label: '永华村委会',
+ value: '460105105202',
+ },
+ {
+ label: '东山村委会',
+ value: '460105105203',
+ },
+ {
+ label: '东溪村委会',
+ value: '460105105204',
+ },
+ {
+ label: '光明村委会',
+ value: '460105105205',
+ },
+ {
+ label: '溪头村委会',
+ value: '460105105206',
+ },
+ {
+ label: '马坡村委会',
+ value: '460105105207',
+ },
+ {
+ label: '东苍村委会',
+ value: '460105105208',
+ },
+ {
+ label: '雅德村委会',
+ value: '460105105210',
+ },
+ {
+ label: '玉下村委会',
+ value: '460105105209',
+ },
+ {
+ label: '文塘村委会',
+ value: '460105105212',
+ },
+ {
+ label: '溪南村委会',
+ value: '460105105217',
+ },
+ {
+ label: '射钗村委会',
+ value: '460105105218',
+ },
+ {
+ label: '东城村委会',
+ value: '460105105219',
+ },
+ {
+ label: '镇南居委会',
+ value: '460105105001',
+ },
+ {
+ label: '镇北居委会',
+ value: '460105105002',
+ },
+ {
+ label: '建丰村委会',
+ value: '460105105211',
+ },
+ {
+ label: '紫罗村委会',
+ value: '460105105213',
+ },
+ {
+ label: '前进村委会',
+ value: '460105105214',
+ },
+ {
+ label: '环湖村委会',
+ value: '460105105215',
+ },
+ {
+ label: '东升村委会',
+ value: '460105105216',
+ },
+ {
+ label: '城西村委会',
+ value: '460105105220',
+ },
+ {
+ label: '东山热作场虚拟村委会',
+ value: '460105105500',
+ },
+ {
+ label: '热作农场村委会',
+ value: '460107500400',
+ },
+ {
+ label: '东星村委会',
+ value: '460105105200',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '龙华区',
+ value: '460106',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '中山路街道办事处',
+ value: '460106001',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '长堤社区居委会',
+ value: '460106001001',
+ },
+ {
+ label: '人和坊社区居委会',
+ value: '460106001002',
+ },
+ {
+ label: '居仁坊社区居委会',
+ value: '460106001003',
+ },
+ {
+ label: '园内里社区居委会',
+ value: '460106001004',
+ },
+ {
+ label: '竹林社区居委会',
+ value: '460106001005',
+ },
+ {
+ label: '得胜沙社区居委会',
+ value: '460106001006',
+ },
+ {
+ label: '富兴社区居委会',
+ value: '460106001007',
+ },
+ {
+ label: '义兴社区居委会',
+ value: '460106001008',
+ },
+ {
+ label: '西湖社区居委会',
+ value: '460106001009',
+ },
+ {
+ label: '西门外社区居委会',
+ value: '460106001010',
+ },
+ {
+ label: '永兴社区居委会',
+ value: '460106001011',
+ },
+ ],
+ },
+ {
+ label: '滨海街道办事处',
+ value: '460106002',
+ children: [
+ {
+ label: '八灶社区居委会',
+ value: '460106002001',
+ },
+ {
+ label: '滨海新村社区居委会',
+ value: '460106002002',
+ },
+ {
+ label: '滨海社区居委会',
+ value: '460106002003',
+ },
+ {
+ label: '盐灶一社区居委会',
+ value: '460106002004',
+ },
+ {
+ label: '盐灶二社区居委会',
+ value: '460106002005',
+ },
+ {
+ label: '盐灶三社区居委会',
+ value: '460106002006',
+ },
+ {
+ label: '龙华中社区居委会',
+ value: '460106002007',
+ },
+ {
+ label: '滨港社区居委会',
+ value: '460106002008',
+ },
+ {
+ label: '泰华社区居委会',
+ value: '460106002009',
+ },
+ {
+ label: '玉河社区居委会',
+ value: '460106002010',
+ },
+ ],
+ },
+ {
+ label: '金贸街道办事处',
+ value: '460106003',
+ children: [
+ {
+ label: '龙华南社区居委会',
+ value: '460106003001',
+ },
+ {
+ label: '珠江社区居委会',
+ value: '460106003002',
+ },
+ {
+ label: '世贸社区居委会',
+ value: '460106003003',
+ },
+ {
+ label: '国贸社区居委会',
+ value: '460106003004',
+ },
+ {
+ label: '玉沙社区居委会',
+ value: '460106003005',
+ },
+ {
+ label: '电力社区居委会',
+ value: '460106003006',
+ },
+ {
+ label: '万绿园社区居委会',
+ value: '460106003007',
+ },
+ {
+ label: '金海社区居委会',
+ value: '460106003008',
+ },
+ {
+ label: '嘉华社区居委会',
+ value: '460106003009',
+ },
+ ],
+ },
+ {
+ label: '大同路街道办事处',
+ value: '460106004',
+ children: [
+ {
+ label: '友谊社区居委会',
+ value: '460106004001',
+ },
+ {
+ label: '大同里社区居委会',
+ value: '460106004002',
+ },
+ {
+ label: '华海社区居委会',
+ value: '460106004003',
+ },
+ {
+ label: '龙昆上社区居委会',
+ value: '460106004004',
+ },
+ {
+ label: '龙昆下社区居委会',
+ value: '460106004005',
+ },
+ {
+ label: '正义社区居委会',
+ value: '460106004006',
+ },
+ {
+ label: '侨中社区居委会',
+ value: '460106004007',
+ },
+ {
+ label: '彩虹社区居委会',
+ value: '460106004008',
+ },
+ {
+ label: '义龙东社区居委会',
+ value: '460106004009',
+ },
+ {
+ label: '义龙西社区居委会',
+ value: '460106004010',
+ },
+ ],
+ },
+ {
+ label: '海垦街道办事处',
+ value: '460106005',
+ children: [
+ {
+ label: '金垦社区居委会',
+ value: '460106005001',
+ },
+ {
+ label: '滨秀社区居委会',
+ value: '460106005002',
+ },
+ {
+ label: '海秀社区居委会',
+ value: '460106005003',
+ },
+ {
+ label: '金山社区居委会',
+ value: '460106005004',
+ },
+ {
+ label: '顺发社区居委会',
+ value: '460106005005',
+ },
+ {
+ label: '疏港社区居委会',
+ value: '460106005006',
+ },
+ {
+ label: '秀英村社区居委会',
+ value: '460106005008',
+ },
+ {
+ label: '滨涯社区居委会',
+ value: '460106005009',
+ },
+ {
+ label: '滨濂北社区居委会',
+ value: '460106005010',
+ },
+ {
+ label: '垦中社区居委会',
+ value: '460106005012',
+ },
+ {
+ label: '华垦社区居委会',
+ value: '460106005013',
+ },
+ {
+ label: '西岭社区居委会',
+ value: '460106005014',
+ },
+ {
+ label: '金牛岭社区居委会',
+ value: '460106005007',
+ },
+ {
+ label: '滨濂南社区居委会',
+ value: '460106005011',
+ },
+ ],
+ },
+ {
+ label: '金宇街道办事处',
+ value: '460106006',
+ children: [
+ {
+ label: '银湖社区居委会',
+ value: '460106006001',
+ },
+ {
+ label: '面前坡社区居委会',
+ value: '460106006003',
+ },
+ {
+ label: '坡博西社区居委会',
+ value: '460106006004',
+ },
+ {
+ label: '坡巷社区居委会',
+ value: '460106006005',
+ },
+ {
+ label: '南沙社区居委会',
+ value: '460106006007',
+ },
+ {
+ label: '金坡社区居委会',
+ value: '460106006008',
+ },
+ {
+ label: '坡博南社区居委会',
+ value: '460106006009',
+ },
+ {
+ label: '海德社区居委会',
+ value: '460106006010',
+ },
+ {
+ label: '昌茂社区居委会',
+ value: '460106006002',
+ },
+ {
+ label: '坡博东社区居委会',
+ value: '460106006006',
+ },
+ ],
+ },
+ {
+ label: '城西镇',
+ value: '460106100',
+ children: [
+ {
+ label: '高坡村委会',
+ value: '460106100200',
+ },
+ {
+ label: '沙坡村委会',
+ value: '460106100203',
+ },
+ {
+ label: '苍东村委会',
+ value: '460106100206',
+ },
+ {
+ label: '大样村委会',
+ value: '460106100207',
+ },
+ {
+ label: '薛村村委会',
+ value: '460106100208',
+ },
+ {
+ label: '仁里南社区居委会',
+ value: '460106100001',
+ },
+ {
+ label: '金盘社区居委会',
+ value: '460106100003',
+ },
+ {
+ label: '仁里北社区居委会',
+ value: '460106100004',
+ },
+ {
+ label: '四季华庭社区居委会',
+ value: '460106100005',
+ },
+ {
+ label: '丁村村委会',
+ value: '460106100201',
+ },
+ {
+ label: '山高村委会',
+ value: '460106100202',
+ },
+ {
+ label: '头铺村委会',
+ value: '460106100204',
+ },
+ {
+ label: '金星社区居委会',
+ value: '460106100007',
+ },
+ {
+ label: '府西社区居委会',
+ value: '460106100002',
+ },
+ {
+ label: '金沙社区居委会',
+ value: '460106100006',
+ },
+ {
+ label: '苍西村委会',
+ value: '460106100205',
+ },
+ {
+ label: '丁村北社区居委会',
+ value: '460106100008',
+ },
+ {
+ label: '丁村南社区居委会',
+ value: '460106100009',
+ },
+ {
+ label: '山高西社区居委会',
+ value: '460106100010',
+ },
+ {
+ label: '山高东社区居委会',
+ value: '460106100011',
+ },
+ {
+ label: '头铺西社区居委会',
+ value: '460106100012',
+ },
+ {
+ label: '头铺东社区居委会',
+ value: '460106100013',
+ },
+ ],
+ },
+ {
+ label: '龙桥镇',
+ value: '460106101',
+ children: [
+ {
+ label: '龙洪村委会',
+ value: '460106101204',
+ },
+ {
+ label: '挺丰村委会',
+ value: '460106101200',
+ },
+ {
+ label: '道贡村委会',
+ value: '460106101202',
+ },
+ {
+ label: '玉荣村委会',
+ value: '460106101205',
+ },
+ {
+ label: '玉符村委会',
+ value: '460106101201',
+ },
+ {
+ label: '三角园村委会',
+ value: '460106101207',
+ },
+ {
+ label: '龙桥村委会',
+ value: '460106101203',
+ },
+ {
+ label: '永东村委会',
+ value: '460106101206',
+ },
+ ],
+ },
+ {
+ label: '新坡镇',
+ value: '460106102',
+ children: [
+ {
+ label: '仁南村委会',
+ value: '460106102211',
+ },
+ {
+ label: '农丰村委会',
+ value: '460106102204',
+ },
+ {
+ label: '民丰村委会',
+ value: '460106102208',
+ },
+ {
+ label: '新坡村委会',
+ value: '460106102209',
+ },
+ {
+ label: '仁里村委会',
+ value: '460106102212',
+ },
+ {
+ label: '光荣村委会',
+ value: '460106102210',
+ },
+ {
+ label: '群益村委会',
+ value: '460106102206',
+ },
+ {
+ label: '群丰村委会',
+ value: '460106102207',
+ },
+ {
+ label: '新彩村委会',
+ value: '460106102205',
+ },
+ {
+ label: '文山村委会',
+ value: '460106102200',
+ },
+ {
+ label: '文丰村委会',
+ value: '460106102201',
+ },
+ {
+ label: '新村村委会',
+ value: '460106102202',
+ },
+ {
+ label: '雄丰村委会',
+ value: '460106102203',
+ },
+ ],
+ },
+ {
+ label: '遵谭镇',
+ value: '460106103',
+ children: [
+ {
+ label: '遵谭村委会',
+ value: '460106103206',
+ },
+ {
+ label: '东谭村委会',
+ value: '460106103205',
+ },
+ {
+ label: '新谭村委会',
+ value: '460106103200',
+ },
+ {
+ label: '龙合村委会',
+ value: '460106103203',
+ },
+ {
+ label: '群力村委会',
+ value: '460106103201',
+ },
+ {
+ label: '咸东村委会',
+ value: '460106103204',
+ },
+ {
+ label: '咸谅村委会',
+ value: '460106103202',
+ },
+ ],
+ },
+ {
+ label: '龙泉镇',
+ value: '460106104',
+ children: [
+ {
+ label: '元平村委会',
+ value: '460106104210',
+ },
+ {
+ label: '富伟村委会',
+ value: '460106104212',
+ },
+ {
+ label: '占符村委会',
+ value: '460106104215',
+ },
+ {
+ label: '永昌村委会',
+ value: '460106104213',
+ },
+ {
+ label: '椰子头村委会',
+ value: '460106104207',
+ },
+ {
+ label: '五一村委会',
+ value: '460106104203',
+ },
+ {
+ label: '新江村委会',
+ value: '460106104202',
+ },
+ {
+ label: '仁新村委会',
+ value: '460106104204',
+ },
+ {
+ label: '扬亭村委会',
+ value: '460106104201',
+ },
+ {
+ label: '国扬村委会',
+ value: '460106104216',
+ },
+ {
+ label: '市井村委会',
+ value: '460106104211',
+ },
+ {
+ label: '美定村委会',
+ value: '460106104214',
+ },
+ {
+ label: '雅咏村委会',
+ value: '460106104205',
+ },
+ {
+ label: '大叠村委会',
+ value: '460106104206',
+ },
+ {
+ label: '美仁坡村委会',
+ value: '460106104208',
+ },
+ {
+ label: '新联村委会',
+ value: '460106104209',
+ },
+ {
+ label: '东占居委会',
+ value: '460106104001',
+ },
+ {
+ label: '翰香村委会',
+ value: '460106104200',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '琼山区',
+ value: '460107',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '国兴街道办事处',
+ value: '460107001',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '巴伦社区居委会',
+ value: '460107001001',
+ },
+ {
+ label: '攀丹社区居委会',
+ value: '460107001002',
+ },
+ {
+ label: '米铺社区居委会',
+ value: '460107001003',
+ },
+ {
+ label: '八一社区居委会',
+ value: '460107001005',
+ },
+ {
+ label: '文政社区居委会',
+ value: '460107001006',
+ },
+ {
+ label: '文坛社区居委会',
+ value: '460107001007',
+ },
+ {
+ label: '道客社区居委会',
+ value: '460107001004',
+ },
+ ],
+ },
+ {
+ label: '府城街道办事处',
+ value: '460107002',
+ children: [
+ {
+ label: '府城社区居委会',
+ value: '460107002001',
+ },
+ {
+ label: '忠介社区居委会',
+ value: '460107002002',
+ },
+ {
+ label: '云露社区居委会',
+ value: '460107002003',
+ },
+ {
+ label: '北官社区居委会',
+ value: '460107002005',
+ },
+ {
+ label: '甘蔗园社区居委会',
+ value: '460107002006',
+ },
+ {
+ label: '北胜社区居委会',
+ value: '460107002007',
+ },
+ {
+ label: '龙昆南社区居委会',
+ value: '460107002008',
+ },
+ {
+ label: '文庄社区居委会',
+ value: '460107002004',
+ },
+ {
+ label: '鼓楼社区居委会',
+ value: '460107002009',
+ },
+ ],
+ },
+ {
+ label: '滨江街道办事处',
+ value: '460107003',
+ children: [
+ {
+ label: '东门社区居委会',
+ value: '460107003001',
+ },
+ {
+ label: '城东社区居委会',
+ value: '460107003002',
+ },
+ {
+ label: '下坎社区居委会',
+ value: '460107003003',
+ },
+ {
+ label: '铁桥社区居委会',
+ value: '460107003004',
+ },
+ {
+ label: '博桂社区居委会',
+ value: '460107003005',
+ },
+ {
+ label: '北冲溪社区居委会',
+ value: '460107003006',
+ },
+ ],
+ },
+ {
+ label: '凤翔街道办事处',
+ value: '460107004',
+ children: [
+ {
+ label: '桂林社区居委会',
+ value: '460107004001',
+ },
+ {
+ label: '高登社区居委会',
+ value: '460107004002',
+ },
+ {
+ label: '大园社区居委会',
+ value: '460107004003',
+ },
+ {
+ label: '凤翔社区居委会',
+ value: '460107004004',
+ },
+ {
+ label: '三峰社区居委会',
+ value: '460107004005',
+ },
+ {
+ label: '洗马桥社区居委会',
+ value: '460107004006',
+ },
+ {
+ label: '红星村委会',
+ value: '460107004203',
+ },
+ {
+ label: '那央村委会',
+ value: '460107004200',
+ },
+ {
+ label: '儒逢村委会',
+ value: '460107004202',
+ },
+ {
+ label: '五岳村委会',
+ value: '460107004201',
+ },
+ {
+ label: '石塔村委会',
+ value: '460107004204',
+ },
+ {
+ label: '迈瀛社区居委会',
+ value: '460107004007',
+ },
+ ],
+ },
+ {
+ label: '龙塘镇',
+ value: '460107101',
+ children: [
+ {
+ label: '三桥村委会',
+ value: '460107101200',
+ },
+ {
+ label: '龙富村委会',
+ value: '460107101201',
+ },
+ {
+ label: '仁三村委会',
+ value: '460107101202',
+ },
+ {
+ label: '潭口村委会',
+ value: '460107101203',
+ },
+ {
+ label: '龙光村委会',
+ value: '460107101204',
+ },
+ {
+ label: '新民村委会',
+ value: '460107101205',
+ },
+ {
+ label: '龙新村委会',
+ value: '460107101206',
+ },
+ {
+ label: '文道村委会',
+ value: '460107101207',
+ },
+ {
+ label: '仁庄村委会',
+ value: '460107101209',
+ },
+ {
+ label: '三联村委会',
+ value: '460107101208',
+ },
+ {
+ label: '龙塘居委会',
+ value: '460107101001',
+ },
+ ],
+ },
+ {
+ label: '云龙镇',
+ value: '460107102',
+ children: [
+ {
+ label: '云龙村委会',
+ value: '460107102201',
+ },
+ {
+ label: '云阁村委会',
+ value: '460107102203',
+ },
+ {
+ label: '云裕村委会',
+ value: '460107102205',
+ },
+ {
+ label: '云蛟村委会',
+ value: '460107102204',
+ },
+ {
+ label: '云岭村委会',
+ value: '460107102206',
+ },
+ {
+ label: '长泰村委会',
+ value: '460107102202',
+ },
+ {
+ label: '儒林村委会',
+ value: '460107102200',
+ },
+ {
+ label: '南区居委会',
+ value: '460107102001',
+ },
+ ],
+ },
+ {
+ label: '红旗镇',
+ value: '460107103',
+ children: [
+ {
+ label: '昌文村委会',
+ value: '460107103200',
+ },
+ {
+ label: '红旗村委会',
+ value: '460107103209',
+ },
+ {
+ label: '大山村委会',
+ value: '460107103201',
+ },
+ {
+ label: '龙榜村委会',
+ value: '460107103202',
+ },
+ {
+ label: '合群村委会',
+ value: '460107103203',
+ },
+ {
+ label: '道崇村委会',
+ value: '460107103204',
+ },
+ {
+ label: '苏寻三村委会',
+ value: '460107103205',
+ },
+ {
+ label: '龙源村委会',
+ value: '460107103206',
+ },
+ {
+ label: '龙发村委会',
+ value: '460107103207',
+ },
+ {
+ label: '墨桥村委会',
+ value: '460107103208',
+ },
+ {
+ label: '土桥居委会',
+ value: '460107103001',
+ },
+ ],
+ },
+ {
+ label: '三门坡镇',
+ value: '460107104',
+ children: [
+ {
+ label: '文岭村委会',
+ value: '460107104201',
+ },
+ {
+ label: '新德村委会',
+ value: '460107104200',
+ },
+ {
+ label: '美城村委会',
+ value: '460107104202',
+ },
+ {
+ label: '龙马村委会',
+ value: '460107104203',
+ },
+ {
+ label: '谭文村委会',
+ value: '460107104204',
+ },
+ {
+ label: '谷桥村委会',
+ value: '460107104205',
+ },
+ {
+ label: '乐来村委会',
+ value: '460107104209',
+ },
+ {
+ label: '清泉村委会',
+ value: '460107104207',
+ },
+ {
+ label: '友爱村委会',
+ value: '460107104208',
+ },
+ {
+ label: '文蛟村委会',
+ value: '460107104206',
+ },
+ {
+ label: '庆丰居委会',
+ value: '460107104001',
+ },
+ {
+ label: '谭新社区居委会',
+ value: '460107104002',
+ },
+ ],
+ },
+ {
+ label: '大坡镇',
+ value: '460107105',
+ children: [
+ {
+ label: '大坡村委会',
+ value: '460107105200',
+ },
+ {
+ label: '福昌村委会',
+ value: '460107105203',
+ },
+ {
+ label: '中税村委会',
+ value: '460107105202',
+ },
+ {
+ label: '新瑞村委会',
+ value: '460107105201',
+ },
+ {
+ label: '树德村委会',
+ value: '460107105204',
+ },
+ {
+ label: '博坡社区居委会',
+ value: '460107105001',
+ },
+ ],
+ },
+ {
+ label: '甲子镇',
+ value: '460107106',
+ children: [
+ {
+ label: '昌西村委会',
+ value: '460107106203',
+ },
+ {
+ label: '青云村委会',
+ value: '460107106204',
+ },
+ {
+ label: '红岭村委会',
+ value: '460107106201',
+ },
+ {
+ label: '民昌村委会',
+ value: '460107106205',
+ },
+ {
+ label: '琼星村委会',
+ value: '460107106207',
+ },
+ {
+ label: '琼新村委会',
+ value: '460107106206',
+ },
+ {
+ label: '益新村委会',
+ value: '460107106210',
+ },
+ {
+ label: '仙民村委会',
+ value: '460107106209',
+ },
+ {
+ label: '益民村委会',
+ value: '460107106208',
+ },
+ {
+ label: '大同村委会',
+ value: '460107106211',
+ },
+ {
+ label: '民兴村委会',
+ value: '460107106212',
+ },
+ {
+ label: '新昌村委会',
+ value: '460107106213',
+ },
+ {
+ label: '群星村委会',
+ value: '460107106202',
+ },
+ {
+ label: '长昌村委会',
+ value: '460107106214',
+ },
+ {
+ label: '海丰村委会',
+ value: '460107106215',
+ },
+ {
+ label: '甲子村委会',
+ value: '460107106200',
+ },
+ {
+ label: '甲新社区居委会',
+ value: '460107106001',
+ },
+ ],
+ },
+ {
+ label: '旧州镇',
+ value: '460107107',
+ children: [
+ {
+ label: '旧州村委会',
+ value: '460107107200',
+ },
+ {
+ label: '红卫村委会',
+ value: '460107107202',
+ },
+ {
+ label: '联丰村委会',
+ value: '460107107206',
+ },
+ {
+ label: '联星村委会',
+ value: '460107107207',
+ },
+ {
+ label: '池连村委会',
+ value: '460107107208',
+ },
+ {
+ label: '光明村委会',
+ value: '460107107209',
+ },
+ {
+ label: '岭南村委会',
+ value: '460107107201',
+ },
+ {
+ label: '道美村委会',
+ value: '460107107205',
+ },
+ {
+ label: '文新村委会',
+ value: '460107107203',
+ },
+ {
+ label: '雅秀村委会',
+ value: '460107107204',
+ },
+ {
+ label: '双拥社区居委会',
+ value: '460107107001',
+ },
+ ],
+ },
+ {
+ label: '国营东昌农场',
+ value: '460107401',
+ children: [
+ {
+ label: '国营东昌农场虚拟居委会',
+ value: '460107401400',
+ },
+ ],
+ },
+ {
+ label: '国营红明农场',
+ value: '460107400',
+ children: [
+ {
+ label: '国营红明农场虚拟居委会',
+ value: '460107400400',
+ },
+ ],
+ },
+ {
+ label: '省长昌煤矿',
+ value: '460107501',
+ children: [
+ {
+ label: '省长昌煤矿虚拟居委会',
+ value: '460107501400',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '美兰区',
+ value: '460108',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '海府街道办事处',
+ value: '460108001',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '东湖里社区居委会',
+ value: '460108001001',
+ },
+ {
+ label: '白坡里社区居委会',
+ value: '460108001002',
+ },
+ {
+ label: '龙峰社区居委会',
+ value: '460108001003',
+ },
+ {
+ label: '龙舌坡社区居委会',
+ value: '460108001004',
+ },
+ {
+ label: '大英社区居委会',
+ value: '460108001005',
+ },
+ {
+ label: '南宝社区居委会',
+ value: '460108001006',
+ },
+ ],
+ },
+ {
+ label: '蓝天街道办事处',
+ value: '460108002',
+ children: [
+ {
+ label: '龙岐社区居委会',
+ value: '460108002001',
+ },
+ {
+ label: '万华社区居委会',
+ value: '460108002002',
+ },
+ {
+ label: '塔光社区居委会',
+ value: '460108002003',
+ },
+ {
+ label: '下洋社区居委会',
+ value: '460108002004',
+ },
+ ],
+ },
+ {
+ label: '博爱街道办事处',
+ value: '460108003',
+ children: [
+ {
+ label: '新风里社区居委会',
+ value: '460108003001',
+ },
+ {
+ label: '振龙社区居委会',
+ value: '460108003002',
+ },
+ {
+ label: '龙文坊社区居委会',
+ value: '460108003003',
+ },
+ {
+ label: '三亚社区居委会',
+ value: '460108003004',
+ },
+ {
+ label: '南联社区居委会',
+ value: '460108003005',
+ },
+ {
+ label: '联桂坊社区居委会',
+ value: '460108003006',
+ },
+ {
+ label: '红坎坡社区居委会',
+ value: '460108003007',
+ },
+ ],
+ },
+ {
+ label: '海甸街道办事处',
+ value: '460108004',
+ children: [
+ {
+ label: '新安社区居委会',
+ value: '460108004001',
+ },
+ {
+ label: '沿江社区居委会',
+ value: '460108004002',
+ },
+ {
+ label: '金甸社区居委会',
+ value: '460108004003',
+ },
+ {
+ label: '海达社区居委会',
+ value: '460108004004',
+ },
+ {
+ label: '白沙门社区居委会',
+ value: '460108004005',
+ },
+ {
+ label: '福安社区居委会',
+ value: '460108004006',
+ },
+ ],
+ },
+ {
+ label: '人民街道办事处',
+ value: '460108005',
+ children: [
+ {
+ label: '拦海社区居委会',
+ value: '460108005004',
+ },
+ {
+ label: '新利社区居委会',
+ value: '460108005005',
+ },
+ {
+ label: '万福社区居委会',
+ value: '460108005006',
+ },
+ {
+ label: '银甸社区居委会',
+ value: '460108005001',
+ },
+ {
+ label: '捕捞社区居委会',
+ value: '460108005002',
+ },
+ {
+ label: '邦墩社区居委会',
+ value: '460108005003',
+ },
+ {
+ label: '美丽沙社区居委会',
+ value: '460108005007',
+ },
+ ],
+ },
+ {
+ label: '白龙街道办事处',
+ value: '460108006',
+ children: [
+ {
+ label: '美舍社区居委会',
+ value: '460108006001',
+ },
+ {
+ label: '振兴社区居委会',
+ value: '460108006002',
+ },
+ {
+ label: '五贤社区居委会',
+ value: '460108006003',
+ },
+ {
+ label: '千家社区居委会',
+ value: '460108006004',
+ },
+ {
+ label: '流水坡社区居委会',
+ value: '460108006005',
+ },
+ {
+ label: '群上社区居委会',
+ value: '460108006006',
+ },
+ ],
+ },
+ {
+ label: '和平南街道办事处',
+ value: '460108007',
+ children: [
+ {
+ label: '文明社区居委会',
+ value: '460108007001',
+ },
+ {
+ label: '君尧社区居委会',
+ value: '460108007002',
+ },
+ {
+ label: '上坡社区居委会',
+ value: '460108007003',
+ },
+ {
+ label: '琼苑社区居委会',
+ value: '460108007004',
+ },
+ {
+ label: '光阳社区居委会',
+ value: '460108007005',
+ },
+ ],
+ },
+ {
+ label: '白沙街道办事处',
+ value: '460108008',
+ children: [
+ {
+ label: '锦山里社区居委会',
+ value: '460108008001',
+ },
+ {
+ label: '白沙坊社区居委会',
+ value: '460108008002',
+ },
+ {
+ label: '白龙社区居委会',
+ value: '460108008003',
+ },
+ {
+ label: '岭下社区居委会',
+ value: '460108008004',
+ },
+ ],
+ },
+ {
+ label: '新埠街道办事处',
+ value: '460108009',
+ children: [
+ {
+ label: '新埠社区居委会',
+ value: '460108009001',
+ },
+ {
+ label: '新东社区居委会',
+ value: '460108009002',
+ },
+ {
+ label: '三联社区居委会',
+ value: '460108009003',
+ },
+ {
+ label: '土尾社区居委会',
+ value: '460108009004',
+ },
+ ],
+ },
+ {
+ label: '灵山镇',
+ value: '460108101',
+ children: [
+ {
+ label: '东头村委会',
+ value: '460108101200',
+ },
+ {
+ label: '晋文村委会',
+ value: '460108101213',
+ },
+ {
+ label: '桥东村委会',
+ value: '460108101214',
+ },
+ {
+ label: '林昌村委会',
+ value: '460108101203',
+ },
+ {
+ label: '新市村委会',
+ value: '460108101205',
+ },
+ {
+ label: '新琼村委会',
+ value: '460108101202',
+ },
+ {
+ label: '新管村委会',
+ value: '460108101204',
+ },
+ {
+ label: '东营村委会',
+ value: '460108101208',
+ },
+ {
+ label: '东湖村委会',
+ value: '460108101201',
+ },
+ {
+ label: '东和村委会',
+ value: '460108101221',
+ },
+ {
+ label: '爱群村委会',
+ value: '460108101210',
+ },
+ {
+ label: '灵山居委会',
+ value: '460108101001',
+ },
+ {
+ label: '红丰村委会',
+ value: '460108101216',
+ },
+ {
+ label: '群山村委会',
+ value: '460108101212',
+ },
+ {
+ label: '锦丰村委会',
+ value: '460108101206',
+ },
+ {
+ label: '大林村委会',
+ value: '460108101215',
+ },
+ {
+ label: '大昌村委会',
+ value: '460108101217',
+ },
+ {
+ label: '美庄村委会',
+ value: '460108101220',
+ },
+ {
+ label: '福玉村委会',
+ value: '460108101207',
+ },
+ {
+ label: '晋美社区居委会',
+ value: '460108101002',
+ },
+ {
+ label: '仙云社区居委会',
+ value: '460108101003',
+ },
+ {
+ label: '东平村委会',
+ value: '460108101219',
+ },
+ {
+ label: '仲恺村委会',
+ value: '460108101209',
+ },
+ {
+ label: '灵山村委会',
+ value: '460108101211',
+ },
+ {
+ label: '新岛村委会',
+ value: '460108101218',
+ },
+ ],
+ },
+ {
+ label: '演丰镇',
+ value: '460108102',
+ children: [
+ {
+ label: '演丰居委会',
+ value: '460108102001',
+ },
+ {
+ label: '演海村委会',
+ value: '460108102200',
+ },
+ {
+ label: '边海村委会',
+ value: '460108102201',
+ },
+ {
+ label: '北港村委会',
+ value: '460108102202',
+ },
+ {
+ label: '演中村委会',
+ value: '460108102203',
+ },
+ {
+ label: '美兰村委会',
+ value: '460108102204',
+ },
+ {
+ label: '演东村委会',
+ value: '460108102205',
+ },
+ {
+ label: '苏民村委会',
+ value: '460108102206',
+ },
+ {
+ label: '演南村委会',
+ value: '460108102207',
+ },
+ {
+ label: '昌城村委会',
+ value: '460108102208',
+ },
+ {
+ label: '群庄村委会',
+ value: '460108102209',
+ },
+ {
+ label: '塔市村委会',
+ value: '460108102210',
+ },
+ {
+ label: '演西村委会',
+ value: '460108102211',
+ },
+ {
+ label: '山尾村委会',
+ value: '460108102212',
+ },
+ ],
+ },
+ {
+ label: '三江镇',
+ value: '460108103',
+ children: [
+ {
+ label: '三江居居委会',
+ value: '460108103002',
+ },
+ {
+ label: '苏寻三村委会',
+ value: '460108103204',
+ },
+ {
+ label: '眼镜塘村委会',
+ value: '460108103206',
+ },
+ {
+ label: '江源村委会',
+ value: '460108103207',
+ },
+ {
+ label: '上云村委会',
+ value: '460108103205',
+ },
+ {
+ label: '三江村委会',
+ value: '460108103200',
+ },
+ {
+ label: '茄南村委会',
+ value: '460108103201',
+ },
+ {
+ label: '道学村委会',
+ value: '460108103202',
+ },
+ {
+ label: '茄芮村委会',
+ value: '460108103203',
+ },
+ {
+ label: '三江居委会',
+ value: '460108103001',
+ },
+ ],
+ },
+ {
+ label: '大致坡镇',
+ value: '460108104',
+ children: [
+ {
+ label: '崇德村委会',
+ value: '460108104206',
+ },
+ {
+ label: '美良村委会',
+ value: '460108104209',
+ },
+ {
+ label: '椰林居委会',
+ value: '460108104002',
+ },
+ {
+ label: '大致坡镇',
+ value: '460108106011',
+ },
+ {
+ label: '民乐居委会',
+ value: '460108104001',
+ },
+ {
+ label: '昌福村委会',
+ value: '460108104200',
+ },
+ {
+ label: '金堆村委会',
+ value: '460108104201',
+ },
+ {
+ label: '大东村委会',
+ value: '460108104202',
+ },
+ {
+ label: '永群村委会',
+ value: '460108104203',
+ },
+ {
+ label: '栽群村委会',
+ value: '460108104204',
+ },
+ {
+ label: '咸来村委会',
+ value: '460108104205',
+ },
+ {
+ label: '美桐村委会',
+ value: '460108104207',
+ },
+ {
+ label: '大榕村委会',
+ value: '460108104208',
+ },
+ {
+ label: '咸来居委会',
+ value: '460108104003',
+ },
+ ],
+ },
+ {
+ label: '国营三江农场',
+ value: '460108401',
+ children: [
+ {
+ label: '国营三江农场虚拟居委会',
+ value: '460108401400',
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: '桂林洋',
+ value: '460114',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '林东管理区',
+ value: '460114001',
+ children: [
+ {
+ label:'暂不选择',
+ value:'',
+ },
+ {
+ label: '传忠社区居委会',
+ value: '460114001001',
+ },
+ {
+ label: '永卫社区居委会',
+ value: '460114001002',
+ },
+ ],
+ },
+ {
+ label: '迈演管理区',
+ value: '460114006',
+ children: [
+ {
+ label: '五一社区居委会',
+ value: '460114006002',
+ },
+ {
+ label: '迈进社区居委会',
+ value: '460114006001',
+ },
+ ],
+ },
+ {
+ label: '兴洋管理区',
+ value: '460114005',
+ children: [
+ {
+ label: '场部社区居委会',
+ value: '460114005002',
+ },
+ {
+ label: '场部社区居委会',
+ value: '460114005001',
+ },
+ ],
+ },
+ {
+ label: '青松管理区',
+ value: '460114004',
+ children: [
+ {
+ label: '青合社区居委会',
+ value: '460114004003',
+ },
+ {
+ label: '美莲社区居委会',
+ value: '460114004002',
+ },
+ {
+ label: '昌炳社区居委会',
+ value: '460114004001',
+ },
+ ],
+ },
+ {
+ label: '振新管理区',
+ value: '460114003',
+ children: [
+ {
+ label: '新群社区居委会',
+ value: '460114003002',
+ },
+ {
+ label: '振家社区居委会',
+ value: '460114003001',
+ },
+ ],
+ },
+ {
+ label: '高丰管理区',
+ value: '460114002',
+ children: [
+ {
+ label: '丰兴社区居委会',
+ value: '460114002002',
+ },
+ {
+ label: '高山社区居委会',
+ value: '460114002001',
+ },
+ ],
+ },
+ ],
+ },
+];
diff --git a/public/robots.txt b/public/robots.txt
new file mode 100644
index 0000000..e9e57dc
--- /dev/null
+++ b/public/robots.txt
@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:
diff --git a/src/api/apiHandler.js b/src/api/apiHandler.js
new file mode 100644
index 0000000..7af7a8b
--- /dev/null
+++ b/src/api/apiHandler.js
@@ -0,0 +1,110 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-08 16:44:29
+ * @LastEditTime: 2025-04-07 15:35:24
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: axios处理方法
+ */
+import axios from 'axios';
+import { catchApiError, appUrl, getLocal, loginModal, getSessionStorage, confirmModal } from '../utils/utility';
+
+// 网络异常
+function networkException(err) {
+ if (err.code >= 400) {
+ catchApiError({ content: '抱歉! 网络异常请刷新' });
+ } else {
+ catchApiError({ content: '抱歉! 网络错误' });
+ }
+}
+
+// api返回结果处理
+function resHandle(resData) {
+ const { code, data, msg } = resData;
+ if (code === 0 || code === '0') {
+ return { type: true, data };
+ } else if (code === 401 || code === '401') {
+ loginModal();
+ return { type: false };
+ } else if (code === -1) {
+ if (msg) {
+ catchApiError({ content: msg });
+ return { type: false, content: msg };
+ } else {
+ return { type: false };
+ }
+ } else {
+ return { type: code, data, msg };
+ }
+}
+
+export const ax = axios;
+
+export function request(value = {}) {
+ let token = getSessionStorage('customerSystemToken');
+
+ // 无token、非登录、非网格单点跳转时
+ if (!value.isGrid && !token && value.url !== 'ctAccount/login') {
+ catchApiError({
+ content: '抱歉！登录状态已失效请重新登录',
+ loginStatus: 'lose',
+ });
+ return { type: false };
+ }
+ let sessionacc = getLocal('sessionacc') || '';
+ let data = value.data;
+
+ // ocr接口单独调用其他服务
+ const url =
+ value.serviceType === 'thrid'
+ ? `${appUrl.baseUrl}/${appUrl[value.service] || ''}/api/thrid/grid/${value.url}`
+ : `${appUrl.baseUrl}/${appUrl[value.service] || ''}/api/web/${value.url}`;
+ const urlAi = `${appUrl.fileUrl}/${appUrl[value.service] || ''}/api/ai/${value.urlAi}`;
+
+ if (value.typeAi === 'get') {
+ return ax
+ .get(urlAi, { params: data, headers: { Authorization: token } })
+ .then((response) => {
+ return resHandle(response.data);
+ })
+ .catch((err) => {
+ networkException(err);
+ return { type: false };
+ });
+ }
+
+ if (value.typeAi === 'post') {
+ return ax
+ .post(urlAi, data, { headers: { Authorization: token } })
+ .then((response) => {
+ return resHandle(response.data);
+ })
+ .catch((err) => {
+ networkException(err);
+ return { type: false };
+ });
+ }
+
+ if (value.type === 'get') {
+ return ax
+ .get(url, { params: data, headers: { Authorization: token } })
+ .then((response) => {
+ return resHandle(response.data);
+ })
+ .catch((err) => {
+ networkException(err);
+ return { type: false };
+ });
+ } else {
+ return ax
+ .post(url, data, { headers: { Authorization: token } })
+ .then((response) => {
+ return resHandle(response.data);
+ })
+ .catch((err) => {
+ networkException(err);
+ return { type: false };
+ });
+ }
+}
diff --git a/src/api/appUrl.js b/src/api/appUrl.js
new file mode 100644
index 0000000..35b3276
--- /dev/null
+++ b/src/api/appUrl.js
@@ -0,0 +1,97 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-02-16 11:25:57
+ * @LastEditTime: 2025-05-23 14:28:02
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: api地址
+ */
+export const debug = {
+ // web服务
+ // baseUrl: 'http://gz.hugeinfo.com.cn',
+ // baseUrl: "http://192.168.3.131:9002",
+ // baseUrl: 'http://192.168.1.101:9002',
+ baseUrl: 'http://10.200.1.89:9002',
+ // baseUrl: 'http://192.168.1.158:9002',
+
+ // 附件服务
+ // fileUrl: 'http://192.168.1.101:9002',
+ fileUrl: 'http://10.200.1.89:9002',
+ // fileUrl: 'http://192.168.1.158:9002',
+ // fileUrl: 'http://gz.hugeinfo.com.cn',
+
+ // 文件查看url 后面接附件编号
+ fileShowUrl: '/dyh-sys/api/web/fileInfo/show/',
+ // 文件下载url 后面接附件编号
+ fileDownUrl: '/dyh-sys/api/web/fileInfo/down/',
+ // 在线文档编辑链接
+ fileDocx: '/word/docDraft/showWord',
+ // 签章的文档编辑链接
+ fileDocx2: '/InsertSeal/Word/AddSeal1/Word1',
+
+ // 不同服务接口type
+ mediate: 'dyh-mediate', // dyh-mediate
+ cust: 'dyh-cust', // dyh-cust
+ oper: 'dyh-oper', // dyh-oper
+ sys: 'dyh-sys', // dyh-sys
+ disp: 'dyh-disp', //dyh-disp
+ utils: 'dyh-utils',
+ know: 'dyh-know'
+};
+
+// 正式版
+export const web = {
+ // web服务
+ baseUrl: 'https://zfw-dyh.by.gov.cn',
+ // baseUrl: 'http://146.4.99.61:8088/byzfw',
+
+ // 附件服务
+ fileUrl: 'https://zfw-dyh.by.gov.cn',
+
+ // 文件查看url 后面接附件编号
+ fileShowUrl: '/gzdyh-sys/api/web/fileInfo/show/',
+ // 文件下载url 后面接附件编号
+ fileDownUrl: '/gzdyh-sys/api/web/fileInfo/down/',
+ // 在线文档编辑链接
+ fileDocx: '/word/docDraft/showWord',
+ // 签章的文档编辑链接
+ fileDocx2: '/InsertSeal/Word/AddSeal1/Word1',
+
+ // 不同服务接口type
+ mediate: 'gzdyh-mediate', // dyh-mediate
+ cust: 'gzdyh-cust', // dyh-cust
+ oper: 'gzdyh-oper', // dyh-oper
+ sys: 'gzdyh-sys', // dyh-sys
+ disp: 'gzdyh-disp', //dyh-disp
+ utils: 'gzdyh-utils',
+ know: 'gzdyh-know'
+};
+
+// 测试
+export const test = {
+ // web服务
+ baseUrl: 'http://10.202.1.71',
+ // baseUrl: 'http://146.4.99.61:8088/byzfw',
+
+ // 附件服务
+ fileUrl: 'http://10.202.1.71',
+
+ // 文件查看url 后面接附件编号
+ fileShowUrl: '/gzdyh-test-sys/api/web/fileInfo/show/',
+ // 文件下载url 后面接附件编号
+ fileDownUrl: '/gzdyh-test-sys/api/web/fileInfo/down/',
+ // 在线文档编辑链接
+ fileDocx: '/word/docDraft/showWord',
+ // 签章的文档编辑链接
+ fileDocx2: '/InsertSeal/Word/AddSeal1/Word1',
+
+ // 不同服务接口type
+ mediate: 'gzdyh-test-mediate', // dyh-mediate
+ cust: 'gzdyh-test-cust', // dyh-cust
+ oper: 'gzdyh-test-oper', // dyh-oper
+ sys: 'gzdyh-test-sys', // dyh-sys
+ disp: 'gzdyh-test-disp', //dyh-disp
+ utils: 'gzdyh-test-utils',
+ know: 'gzdyh-test-know'
+};
diff --git a/src/api/caseApi.js b/src/api/caseApi.js
new file mode 100644
index 0000000..ec0f68d
--- /dev/null
+++ b/src/api/caseApi.js
@@ -0,0 +1,41 @@
+import * as $$ from '../utils/utility';
+
+/**
+ * 获取新的案件ID
+ * @returns {Promise} 请求的Promise对象
+ */
+export function getNewTimeCaseId() {
+ return $$.ax.request({
+ url: `caseUtils/getNewTimeCaseId`,
+ type: 'get',
+ service: 'utils'
+ });
+}
+
+/**
+ * 提交案件登记
+ * @param {Object} data - 案件登记表单数据
+ * @returns {Promise} 请求的Promise对象
+ */
+export function submitCaseRegister(data) {
+ return $$.ax.request({
+ url: 'caseInfo/caseRegister',
+ type: 'post',
+ data,
+ service: 'mediate'
+ });
+}
+
+/**
+ * 保存草稿
+ * @param {Object} data - 案件草稿表单数据
+ * @returns {Promise} 请求的Promise对象
+ */
+export function saveCaseDraft(data) {
+ return $$.ax.request({
+ url: 'casedraftInfo/caseDraftRegister',
+ type: 'post',
+ data,
+ service: 'mediate'
+ });
+}
\ No newline at end of file
diff --git a/src/assets/cardImg/add.png b/src/assets/cardImg/add.png
new file mode 100644
index 0000000..595c788
--- /dev/null
+++ b/src/assets/cardImg/add.png
Binary files differ
diff --git a/src/assets/cardImg/del.png b/src/assets/cardImg/del.png
new file mode 100644
index 0000000..48e9daa
--- /dev/null
+++ b/src/assets/cardImg/del.png
Binary files differ
diff --git a/src/assets/cardImg/index.js b/src/assets/cardImg/index.js
new file mode 100644
index 0000000..156d1e4
--- /dev/null
+++ b/src/assets/cardImg/index.js
@@ -0,0 +1,17 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-06-07 15:44:26
+ * @LastEditTime: 2024-02-29 09:30:05
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import del from './del.png';
+import add from './add.png';
+
+
+export {
+ del,
+ add
+};
diff --git a/src/assets/icon/del.svg b/src/assets/icon/del.svg
new file mode 100644
index 0000000..d243d10
--- /dev/null
+++ b/src/assets/icon/del.svg
@@ -0,0 +1,12 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_1108_9691)">
+<path d="M12 22C17.5229 22 22 17.5229 22 12C22 6.47715 17.5229 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5229 6.47715 22 12 22Z" stroke="white" stroke-width="1.5" stroke-linejoin="round"/>
+<path d="M14.8282 9.17188L9.17139 14.8287" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.17163 9.17188L14.8285 14.8287" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_1108_9691">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/icon/img_none.svg b/src/assets/icon/img_none.svg
new file mode 100644
index 0000000..d3cd179
--- /dev/null
+++ b/src/assets/icon/img_none.svg
@@ -0,0 +1,5 @@
+<svg width="54" height="54" viewBox="0 0 54 54" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M6.48 0H47.52C49.2386 0 50.8868 0.682712 52.1021 1.89795C53.3173 3.11318 54 4.7614 54 6.48V47.52C54 49.2386 53.3173 50.8868 52.1021 52.1021C50.8868 53.3173 49.2386 54 47.52 54H6.48C4.7614 54 3.11318 53.3173 1.89795 52.1021C0.682712 50.8868 0 49.2386 0 47.52L0 6.48C0 4.7614 0.682712 3.11318 1.89795 1.89795C3.11318 0.682712 4.7614 0 6.48 0V0Z" fill="#E7F0F9"/>
+<path d="M41.8726 40.5102H11.6801C11.5289 40.5197 11.3779 40.488 11.2432 40.4185C11.1086 40.349 10.9953 40.2443 10.9154 40.1156C10.8355 39.9868 10.792 39.8388 10.7895 39.6873C10.7871 39.5358 10.8257 39.3865 10.9014 39.2552L14.4881 31.3053C14.8296 30.7909 15.2931 30.369 15.8372 30.0772C16.3813 29.7853 16.9892 29.6326 17.6066 29.6326C18.224 29.6326 18.8319 29.7853 19.376 30.0772C19.9201 30.369 20.3836 30.7909 20.7251 31.3053L22.3861 33.9837C22.5621 34.2504 22.8035 34.4675 23.0873 34.6141C23.3712 34.7607 23.6879 34.832 24.0072 34.8212C24.3265 34.8104 24.6377 34.7177 24.9109 34.5522C25.1842 34.3866 25.4104 34.1537 25.5678 33.8757L30.9775 23.3997C31.2199 22.9669 31.5733 22.6066 32.0013 22.3557C32.4292 22.1049 32.9163 21.9727 33.4124 21.9727C33.9084 21.9727 34.3955 22.1049 34.8235 22.3557C35.2515 22.6066 35.6049 22.9669 35.8472 23.3997L42.6837 39.3168C42.745 39.4486 42.7711 39.5941 42.7594 39.739C42.7477 39.884 42.6986 40.0234 42.6168 40.1437C42.5351 40.2639 42.4235 40.3609 42.2931 40.4252C42.1626 40.4894 42.0177 40.5187 41.8726 40.5102Z" fill="#AFD6FF"/>
+<path d="M18.1244 21.9657C20.1936 21.9657 21.871 20.2883 21.871 18.2192C21.871 16.15 20.1936 14.4727 18.1244 14.4727C16.0553 14.4727 14.3779 16.15 14.3779 18.2192C14.3779 20.2883 16.0553 21.9657 18.1244 21.9657Z" fill="#AFD6FF"/>
+</svg>
diff --git a/src/assets/icon/index.js b/src/assets/icon/index.js
new file mode 100644
index 0000000..17c16fa
--- /dev/null
+++ b/src/assets/icon/index.js
@@ -0,0 +1,13 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-10 11:06:53
+ * @LastEditTime: 2025-03-20 16:16:55
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: icon
+ */
+import del from './del.svg';
+import img_none from './img_none.svg';
+
+export { del, img_none };
diff --git a/src/assets/icon/legal-person.svg b/src/assets/icon/legal-person.svg
new file mode 100644
index 0000000..9fabc5e
--- /dev/null
+++ b/src/assets/icon/legal-person.svg
@@ -0,0 +1,4 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="24" cy="24" r="24" fill="#E6F4FF"/>
+ <path d="M34 35H14V17H34V35ZM31 20H17V23H31V20ZM31 26H17V29H31V26ZM24 14C22.9 14 22 14.9 22 16C22 17.1 22.9 18 24 18C25.1 18 26 17.1 26 16C26 14.9 25.1 14 24 14Z" fill="#1A6FB8"/>
+</svg>
\ No newline at end of file
diff --git a/src/assets/icon/natural-person.svg b/src/assets/icon/natural-person.svg
new file mode 100644
index 0000000..b98bda7
--- /dev/null
+++ b/src/assets/icon/natural-person.svg
@@ -0,0 +1,4 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="24" cy="24" r="24" fill="#E6F4FF"/>
+ <path d="M24 14C21.79 14 20 15.79 20 18C20 20.21 21.79 22 24 22C26.21 22 28 20.21 28 18C28 15.79 26.21 14 24 14ZM24 28C20.67 28 14 29.67 14 33V34C14 34.55 14.45 35 15 35H33C33.55 35 34 34.55 34 34V33C34 29.67 27.33 28 24 28Z" fill="#1A6FB8"/>
+</svg>
\ No newline at end of file
diff --git a/src/assets/icon/non-legal-person.svg b/src/assets/icon/non-legal-person.svg
new file mode 100644
index 0000000..36d680b
--- /dev/null
+++ b/src/assets/icon/non-legal-person.svg
@@ -0,0 +1,4 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="24" cy="24" r="24" fill="#E6F4FF"/>
+ <path d="M34 35H14V17H34V35ZM31 20H17V23H31V20ZM31 26H17V29H31V26ZM24 14C22.9 14 22 14.9 22 16C22 17.1 22.9 18 24 18C25.1 18 26 17.1 26 16C26 14.9 25.1 14 24 14ZM24 22C22.9 22 22 22.9 22 24C22 25.1 22.9 26 24 26C25.1 26 26 25.1 26 24C26 22.9 25.1 22 24 22Z" fill="#1A6FB8"/>
+</svg>
\ No newline at end of file
diff --git a/src/assets/img/Frame.png b/src/assets/img/Frame.png
new file mode 100644
index 0000000..3f54675
--- /dev/null
+++ b/src/assets/img/Frame.png
Binary files differ
diff --git a/src/assets/img/Frame2.png b/src/assets/img/Frame2.png
new file mode 100644
index 0000000..70f00e7
--- /dev/null
+++ b/src/assets/img/Frame2.png
Binary files differ
diff --git a/src/assets/img/Frame3.png b/src/assets/img/Frame3.png
new file mode 100644
index 0000000..2b25584
--- /dev/null
+++ b/src/assets/img/Frame3.png
Binary files differ
diff --git a/src/assets/img/Frame_6.png b/src/assets/img/Frame_6.png
new file mode 100644
index 0000000..3427bc3
--- /dev/null
+++ b/src/assets/img/Frame_6.png
Binary files differ
diff --git a/src/assets/img/Frame_6_2x.png b/src/assets/img/Frame_6_2x.png
new file mode 100644
index 0000000..a8ae1da
--- /dev/null
+++ b/src/assets/img/Frame_6_2x.png
Binary files differ
diff --git a/src/assets/img/Group.png b/src/assets/img/Group.png
new file mode 100644
index 0000000..0b34ad3
--- /dev/null
+++ b/src/assets/img/Group.png
Binary files differ
diff --git a/src/assets/img/PersonnelNews_1.png b/src/assets/img/PersonnelNews_1.png
new file mode 100644
index 0000000..6a36733
--- /dev/null
+++ b/src/assets/img/PersonnelNews_1.png
Binary files differ
diff --git a/src/assets/img/PersonnelNews_2.png b/src/assets/img/PersonnelNews_2.png
new file mode 100644
index 0000000..fdc94ca
--- /dev/null
+++ b/src/assets/img/PersonnelNews_2.png
Binary files differ
diff --git a/src/assets/img/Personnel_1.png b/src/assets/img/Personnel_1.png
new file mode 100644
index 0000000..127cca4
--- /dev/null
+++ b/src/assets/img/Personnel_1.png
Binary files differ
diff --git a/src/assets/img/Rectangle 812.png b/src/assets/img/Rectangle 812.png
new file mode 100644
index 0000000..c4d5d28
--- /dev/null
+++ b/src/assets/img/Rectangle 812.png
Binary files differ
diff --git a/src/assets/img/Residential_1.png b/src/assets/img/Residential_1.png
new file mode 100644
index 0000000..cdf9a2a
--- /dev/null
+++ b/src/assets/img/Residential_1.png
Binary files differ
diff --git a/src/assets/img/ToDesk.lnk b/src/assets/img/ToDesk.lnk
new file mode 100644
index 0000000..7193bc3
--- /dev/null
+++ b/src/assets/img/ToDesk.lnk
Binary files differ
diff --git a/src/assets/img/account1.png b/src/assets/img/account1.png
new file mode 100644
index 0000000..5e5ad3c
--- /dev/null
+++ b/src/assets/img/account1.png
Binary files differ
diff --git a/src/assets/img/account2.png b/src/assets/img/account2.png
new file mode 100644
index 0000000..3716770
--- /dev/null
+++ b/src/assets/img/account2.png
Binary files differ
diff --git a/src/assets/img/account3.png b/src/assets/img/account3.png
new file mode 100644
index 0000000..68ac207
--- /dev/null
+++ b/src/assets/img/account3.png
Binary files differ
diff --git a/src/assets/img/address.png b/src/assets/img/address.png
new file mode 100644
index 0000000..9356e3e
--- /dev/null
+++ b/src/assets/img/address.png
Binary files differ
diff --git a/src/assets/img/addressBlack.png b/src/assets/img/addressBlack.png
new file mode 100644
index 0000000..122e716
--- /dev/null
+++ b/src/assets/img/addressBlack.png
Binary files differ
diff --git a/src/assets/img/analysis_1.png b/src/assets/img/analysis_1.png
new file mode 100644
index 0000000..97472c9
--- /dev/null
+++ b/src/assets/img/analysis_1.png
Binary files differ
diff --git a/src/assets/img/analysis_2.png b/src/assets/img/analysis_2.png
new file mode 100644
index 0000000..2907609
--- /dev/null
+++ b/src/assets/img/analysis_2.png
Binary files differ
diff --git a/src/assets/img/applyClose_1.svg b/src/assets/img/applyClose_1.svg
new file mode 100644
index 0000000..6a8e536
--- /dev/null
+++ b/src/assets/img/applyClose_1.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1744341077235" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2644" width="17" height="17" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M504.364385 16.445242c-278.216885 0-503.756235 225.53935-503.756235 503.756235s225.53935 503.756235 503.756235 503.756235 503.756235-225.53935 503.756235-503.756235S782.58127 16.445242 504.364385 16.445242zM406.070511 739.739869 231.325844 564.928749l65.52925-65.554422 109.215417 109.257705 305.803166-305.919964 65.52925 65.554422L406.070511 739.739869z" fill="#1A6FB8" p-id="2645"></path></svg>
\ No newline at end of file
diff --git a/src/assets/img/area_1.png b/src/assets/img/area_1.png
new file mode 100644
index 0000000..cc9b64e
--- /dev/null
+++ b/src/assets/img/area_1.png
Binary files differ
diff --git a/src/assets/img/area_2.png b/src/assets/img/area_2.png
new file mode 100644
index 0000000..41946ba
--- /dev/null
+++ b/src/assets/img/area_2.png
Binary files differ
diff --git a/src/assets/img/assistHeading_1.png b/src/assets/img/assistHeading_1.png
new file mode 100644
index 0000000..fb1ce4e
--- /dev/null
+++ b/src/assets/img/assistHeading_1.png
Binary files differ
diff --git a/src/assets/img/assistHeading_2.png b/src/assets/img/assistHeading_2.png
new file mode 100644
index 0000000..fc0e459
--- /dev/null
+++ b/src/assets/img/assistHeading_2.png
Binary files differ
diff --git a/src/assets/img/assistHeading_3.png b/src/assets/img/assistHeading_3.png
new file mode 100644
index 0000000..231861b
--- /dev/null
+++ b/src/assets/img/assistHeading_3.png
Binary files differ
diff --git a/src/assets/img/assistHeading_4.png b/src/assets/img/assistHeading_4.png
new file mode 100644
index 0000000..66145f6
--- /dev/null
+++ b/src/assets/img/assistHeading_4.png
Binary files differ
diff --git a/src/assets/img/assistHeading_5.png b/src/assets/img/assistHeading_5.png
new file mode 100644
index 0000000..91dc4dd
--- /dev/null
+++ b/src/assets/img/assistHeading_5.png
Binary files differ
diff --git a/src/assets/img/assist_1.png b/src/assets/img/assist_1.png
new file mode 100644
index 0000000..97d33e9
--- /dev/null
+++ b/src/assets/img/assist_1.png
Binary files differ
diff --git a/src/assets/img/assist_2.png b/src/assets/img/assist_2.png
new file mode 100644
index 0000000..ea525c5
--- /dev/null
+++ b/src/assets/img/assist_2.png
Binary files differ
diff --git a/src/assets/img/avatar1.png b/src/assets/img/avatar1.png
new file mode 100644
index 0000000..c7414ff
--- /dev/null
+++ b/src/assets/img/avatar1.png
Binary files differ
diff --git a/src/assets/img/avatar2.png b/src/assets/img/avatar2.png
new file mode 100644
index 0000000..6d31649
--- /dev/null
+++ b/src/assets/img/avatar2.png
Binary files differ
diff --git a/src/assets/img/avatar3.png b/src/assets/img/avatar3.png
new file mode 100644
index 0000000..580a94a
--- /dev/null
+++ b/src/assets/img/avatar3.png
Binary files differ
diff --git a/src/assets/img/avatar4.png b/src/assets/img/avatar4.png
new file mode 100644
index 0000000..3d0662e
--- /dev/null
+++ b/src/assets/img/avatar4.png
Binary files differ
diff --git a/src/assets/img/avatar5.png b/src/assets/img/avatar5.png
new file mode 100644
index 0000000..97a2b2e
--- /dev/null
+++ b/src/assets/img/avatar5.png
Binary files differ
diff --git a/src/assets/img/avatar6.png b/src/assets/img/avatar6.png
new file mode 100644
index 0000000..ef45c54
--- /dev/null
+++ b/src/assets/img/avatar6.png
Binary files differ
diff --git a/src/assets/img/base_map.png b/src/assets/img/base_map.png
new file mode 100644
index 0000000..dc67122
--- /dev/null
+++ b/src/assets/img/base_map.png
Binary files differ
diff --git a/src/assets/img/batchImport_right.png b/src/assets/img/batchImport_right.png
new file mode 100644
index 0000000..39f4baf
--- /dev/null
+++ b/src/assets/img/batchImport_right.png
Binary files differ
diff --git a/src/assets/img/batchImport_save.png b/src/assets/img/batchImport_save.png
new file mode 100644
index 0000000..9c14f05
--- /dev/null
+++ b/src/assets/img/batchImport_save.png
Binary files differ
diff --git a/src/assets/img/batchImport_search.png b/src/assets/img/batchImport_search.png
new file mode 100644
index 0000000..96ae686
--- /dev/null
+++ b/src/assets/img/batchImport_search.png
Binary files differ
diff --git a/src/assets/img/batchImport_select.png b/src/assets/img/batchImport_select.png
new file mode 100644
index 0000000..93b129e
--- /dev/null
+++ b/src/assets/img/batchImport_select.png
Binary files differ
diff --git a/src/assets/img/building.png b/src/assets/img/building.png
new file mode 100644
index 0000000..1d17277
--- /dev/null
+++ b/src/assets/img/building.png
Binary files differ
diff --git a/src/assets/img/building_1.png b/src/assets/img/building_1.png
new file mode 100644
index 0000000..33ac8cf
--- /dev/null
+++ b/src/assets/img/building_1.png
Binary files differ
diff --git a/src/assets/img/building_2.png b/src/assets/img/building_2.png
new file mode 100644
index 0000000..4ed34e0
--- /dev/null
+++ b/src/assets/img/building_2.png
Binary files differ
diff --git a/src/assets/img/building_3.png b/src/assets/img/building_3.png
new file mode 100644
index 0000000..06739cd
--- /dev/null
+++ b/src/assets/img/building_3.png
Binary files differ
diff --git a/src/assets/img/building_4.png b/src/assets/img/building_4.png
new file mode 100644
index 0000000..0df2fb6
--- /dev/null
+++ b/src/assets/img/building_4.png
Binary files differ
diff --git a/src/assets/img/building_5.png b/src/assets/img/building_5.png
new file mode 100644
index 0000000..d2fcd1a
--- /dev/null
+++ b/src/assets/img/building_5.png
Binary files differ
diff --git a/src/assets/img/building_6.png b/src/assets/img/building_6.png
new file mode 100644
index 0000000..f0e7e35
--- /dev/null
+++ b/src/assets/img/building_6.png
Binary files differ
diff --git a/src/assets/img/buildingbg.png b/src/assets/img/buildingbg.png
new file mode 100644
index 0000000..9c36c96
--- /dev/null
+++ b/src/assets/img/buildingbg.png
Binary files differ
diff --git a/src/assets/img/camera.png b/src/assets/img/camera.png
new file mode 100644
index 0000000..8efefa9
--- /dev/null
+++ b/src/assets/img/camera.png
Binary files differ
diff --git a/src/assets/img/caseDesPicture.png b/src/assets/img/caseDesPicture.png
new file mode 100644
index 0000000..fab6525
--- /dev/null
+++ b/src/assets/img/caseDesPicture.png
Binary files differ
diff --git a/src/assets/img/caseDesVoice.png b/src/assets/img/caseDesVoice.png
new file mode 100644
index 0000000..c5eadf8
--- /dev/null
+++ b/src/assets/img/caseDesVoice.png
Binary files differ
diff --git a/src/assets/img/caseQuery_1.png b/src/assets/img/caseQuery_1.png
new file mode 100644
index 0000000..3661a80
--- /dev/null
+++ b/src/assets/img/caseQuery_1.png
Binary files differ
diff --git a/src/assets/img/caseQuery_2.png b/src/assets/img/caseQuery_2.png
new file mode 100644
index 0000000..426e4c0
--- /dev/null
+++ b/src/assets/img/caseQuery_2.png
Binary files differ
diff --git a/src/assets/img/catalogue.png b/src/assets/img/catalogue.png
new file mode 100644
index 0000000..1327998
--- /dev/null
+++ b/src/assets/img/catalogue.png
Binary files differ
diff --git a/src/assets/img/cbdb_1.png b/src/assets/img/cbdb_1.png
new file mode 100644
index 0000000..9fe9896
--- /dev/null
+++ b/src/assets/img/cbdb_1.png
Binary files differ
diff --git a/src/assets/img/close_1.png b/src/assets/img/close_1.png
new file mode 100644
index 0000000..7372549
--- /dev/null
+++ b/src/assets/img/close_1.png
Binary files differ
diff --git a/src/assets/img/coordinate_1.png b/src/assets/img/coordinate_1.png
new file mode 100644
index 0000000..ff318cd
--- /dev/null
+++ b/src/assets/img/coordinate_1.png
Binary files differ
diff --git a/src/assets/img/coordinate_2.png b/src/assets/img/coordinate_2.png
new file mode 100644
index 0000000..e8b72c2
--- /dev/null
+++ b/src/assets/img/coordinate_2.png
Binary files differ
diff --git a/src/assets/img/delEliminate.png b/src/assets/img/delEliminate.png
new file mode 100644
index 0000000..e79b099
--- /dev/null
+++ b/src/assets/img/delEliminate.png
Binary files differ
diff --git a/src/assets/img/eventInit_img_1.png b/src/assets/img/eventInit_img_1.png
new file mode 100644
index 0000000..77ab2b3
--- /dev/null
+++ b/src/assets/img/eventInit_img_1.png
Binary files differ
diff --git a/src/assets/img/eventInit_img_2.png b/src/assets/img/eventInit_img_2.png
new file mode 100644
index 0000000..1f69641
--- /dev/null
+++ b/src/assets/img/eventInit_img_2.png
Binary files differ
diff --git a/src/assets/img/eventInit_img_3.png b/src/assets/img/eventInit_img_3.png
new file mode 100644
index 0000000..77e2b1b
--- /dev/null
+++ b/src/assets/img/eventInit_img_3.png
Binary files differ
diff --git a/src/assets/img/excel.png b/src/assets/img/excel.png
new file mode 100644
index 0000000..cc02ebd
--- /dev/null
+++ b/src/assets/img/excel.png
Binary files differ
diff --git a/src/assets/img/file.svg b/src/assets/img/file.svg
new file mode 100644
index 0000000..51f60b0
--- /dev/null
+++ b/src/assets/img/file.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="46" viewBox="0 0 40 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M40 11.6914V43.5939C40 44.383 39.3616 45.0214 38.5725 45.0214H5.51893C4.91576 45.0214 4.43323 44.5338 4.43323 43.9357V0.799196C4.43323 0.356874 4.7901 0 5.23242 0H27.5044C27.5496 0 27.5747 0.0552904 27.5446 0.0904752C27.5245 0.110581 27.5245 0.145765 27.5496 0.165871L39.9899 11.6562C39.9899 11.6662 40 11.6813 40 11.6914Z" fill="#F4F4F4"/>
+<path d="M27.5094 10.9223V0L40 11.6713H28.2584C27.8462 11.6713 27.5094 11.3345 27.5094 10.9223ZM16.2805 14.6419H5.31289C2.37748 14.6419 0 12.2644 0 9.32898C0 6.39357 2.37748 4.01608 5.31289 4.01608H16.2805C19.2159 4.01608 21.5934 6.39357 21.5934 9.32898C21.5984 12.2644 19.2159 14.6419 16.2805 14.6419Z" fill="#E52020"/>
+<path d="M11.1851 35.8057L15.31 29.743C15.3628 29.6653 15.432 29.6001 15.5128 29.5521C15.5936 29.5041 15.6839 29.4745 15.7774 29.4653C15.8709 29.4561 15.9653 29.4675 16.0539 29.4989C16.1425 29.5302 16.2231 29.5806 16.2901 29.6465L19.0161 32.3174L24.9973 22.9424C25.0565 22.8494 25.1387 22.7732 25.236 22.7212C25.3333 22.6692 25.4423 22.6432 25.5526 22.6457C25.6628 22.6481 25.7706 22.679 25.8654 22.7353C25.9603 22.7916 26.039 22.8714 26.094 22.967L33.5255 35.8461C33.5819 35.9436 33.6116 36.0543 33.6117 36.1669C33.6117 36.2796 33.5821 36.3903 33.5258 36.4879C33.4694 36.5854 33.3884 36.6664 33.2908 36.7227C33.1932 36.7789 33.0825 36.8085 32.9698 36.8084H11.7156C11.5988 36.8086 11.4842 36.777 11.3841 36.7168C11.284 36.6567 11.2022 36.5704 11.1476 36.4672C11.093 36.364 11.0676 36.2478 11.0741 36.1312C11.0807 36.0147 11.119 35.9021 11.1848 35.8057H11.1851Z" fill="#E52020"/>
+<path d="M12.4204 22.0779C12.4204 22.9355 12.7611 23.758 13.3675 24.3644C13.9739 24.9708 14.7964 25.3115 15.654 25.3115C16.5117 25.3115 17.3342 24.9708 17.9406 24.3644C18.547 23.758 18.8877 22.9355 18.8877 22.0779C18.8877 21.2203 18.547 20.3978 17.9406 19.7913C17.3342 19.1849 16.5117 18.8442 15.654 18.8442C14.7964 18.8442 13.9739 19.1849 13.3675 19.7913C12.7611 20.3978 12.4204 21.2203 12.4204 22.0779Z" fill="#E52020"/>
+</svg>
diff --git a/src/assets/img/file_delete.png b/src/assets/img/file_delete.png
new file mode 100644
index 0000000..c406407
--- /dev/null
+++ b/src/assets/img/file_delete.png
Binary files differ
diff --git a/src/assets/img/file_upload.png b/src/assets/img/file_upload.png
new file mode 100644
index 0000000..0923add
--- /dev/null
+++ b/src/assets/img/file_upload.png
Binary files differ
diff --git a/src/assets/img/floating_1.png b/src/assets/img/floating_1.png
new file mode 100644
index 0000000..842d27a
--- /dev/null
+++ b/src/assets/img/floating_1.png
Binary files differ
diff --git a/src/assets/img/floating_2.png b/src/assets/img/floating_2.png
new file mode 100644
index 0000000..5bece55
--- /dev/null
+++ b/src/assets/img/floating_2.png
Binary files differ
diff --git a/src/assets/img/general_user-add-blue.png b/src/assets/img/general_user-add-blue.png
new file mode 100644
index 0000000..cedb065
--- /dev/null
+++ b/src/assets/img/general_user-add-blue.png
Binary files differ
diff --git a/src/assets/img/general_user-add.png b/src/assets/img/general_user-add.png
new file mode 100644
index 0000000..16ef2e1
--- /dev/null
+++ b/src/assets/img/general_user-add.png
Binary files differ
diff --git a/src/assets/img/goldMedal.png b/src/assets/img/goldMedal.png
new file mode 100644
index 0000000..b30607c
--- /dev/null
+++ b/src/assets/img/goldMedal.png
Binary files differ
diff --git a/src/assets/img/guide.png b/src/assets/img/guide.png
new file mode 100644
index 0000000..d474596
--- /dev/null
+++ b/src/assets/img/guide.png
Binary files differ
diff --git a/src/assets/img/hasMore_1.png b/src/assets/img/hasMore_1.png
new file mode 100644
index 0000000..449efa2
--- /dev/null
+++ b/src/assets/img/hasMore_1.png
Binary files differ
diff --git a/src/assets/img/hasMore_2.png b/src/assets/img/hasMore_2.png
new file mode 100644
index 0000000..ac8469d
--- /dev/null
+++ b/src/assets/img/hasMore_2.png
Binary files differ
diff --git a/src/assets/img/help_1.png b/src/assets/img/help_1.png
new file mode 100644
index 0000000..59dc26a
--- /dev/null
+++ b/src/assets/img/help_1.png
Binary files differ
diff --git a/src/assets/img/help_2.png b/src/assets/img/help_2.png
new file mode 100644
index 0000000..acd7983
--- /dev/null
+++ b/src/assets/img/help_2.png
Binary files differ
diff --git a/src/assets/img/help_img_1.png b/src/assets/img/help_img_1.png
new file mode 100644
index 0000000..8b2bac2
--- /dev/null
+++ b/src/assets/img/help_img_1.png
Binary files differ
diff --git a/src/assets/img/help_img_2.png b/src/assets/img/help_img_2.png
new file mode 100644
index 0000000..15f8347
--- /dev/null
+++ b/src/assets/img/help_img_2.png
Binary files differ
diff --git a/src/assets/img/help_img_3.png b/src/assets/img/help_img_3.png
new file mode 100644
index 0000000..8e2f1ee
--- /dev/null
+++ b/src/assets/img/help_img_3.png
Binary files differ
diff --git a/src/assets/img/help_img_4.png b/src/assets/img/help_img_4.png
new file mode 100644
index 0000000..dcb716b
--- /dev/null
+++ b/src/assets/img/help_img_4.png
Binary files differ
diff --git a/src/assets/img/helped_1.png b/src/assets/img/helped_1.png
new file mode 100644
index 0000000..75068ce
--- /dev/null
+++ b/src/assets/img/helped_1.png
Binary files differ
diff --git a/src/assets/img/hisPerson.png b/src/assets/img/hisPerson.png
new file mode 100644
index 0000000..77b9520
--- /dev/null
+++ b/src/assets/img/hisPerson.png
Binary files differ
diff --git a/src/assets/img/home.png b/src/assets/img/home.png
new file mode 100644
index 0000000..07fc9c4
--- /dev/null
+++ b/src/assets/img/home.png
Binary files differ
diff --git a/src/assets/img/homePage_1.png b/src/assets/img/homePage_1.png
new file mode 100644
index 0000000..28ddd6c
--- /dev/null
+++ b/src/assets/img/homePage_1.png
Binary files differ
diff --git a/src/assets/img/homePage_2.png b/src/assets/img/homePage_2.png
new file mode 100644
index 0000000..9193f09
--- /dev/null
+++ b/src/assets/img/homePage_2.png
Binary files differ
diff --git a/src/assets/img/homePage_3.png b/src/assets/img/homePage_3.png
new file mode 100644
index 0000000..214fddb
--- /dev/null
+++ b/src/assets/img/homePage_3.png
Binary files differ
diff --git a/src/assets/img/homePage_4.png b/src/assets/img/homePage_4.png
new file mode 100644
index 0000000..10002eb
--- /dev/null
+++ b/src/assets/img/homePage_4.png
Binary files differ
diff --git a/src/assets/img/homePage_bg.png b/src/assets/img/homePage_bg.png
new file mode 100644
index 0000000..91bf172
--- /dev/null
+++ b/src/assets/img/homePage_bg.png
Binary files differ
diff --git a/src/assets/img/homePage_img_1.png b/src/assets/img/homePage_img_1.png
new file mode 100644
index 0000000..10cff4c
--- /dev/null
+++ b/src/assets/img/homePage_img_1.png
Binary files differ
diff --git a/src/assets/img/homePage_img_10.png b/src/assets/img/homePage_img_10.png
new file mode 100644
index 0000000..ef184a1
--- /dev/null
+++ b/src/assets/img/homePage_img_10.png
Binary files differ
diff --git a/src/assets/img/homePage_img_11.png b/src/assets/img/homePage_img_11.png
new file mode 100644
index 0000000..8372aa0
--- /dev/null
+++ b/src/assets/img/homePage_img_11.png
Binary files differ
diff --git a/src/assets/img/homePage_img_12.png b/src/assets/img/homePage_img_12.png
new file mode 100644
index 0000000..554699e
--- /dev/null
+++ b/src/assets/img/homePage_img_12.png
Binary files differ
diff --git a/src/assets/img/homePage_img_2.png b/src/assets/img/homePage_img_2.png
new file mode 100644
index 0000000..e968ab9
--- /dev/null
+++ b/src/assets/img/homePage_img_2.png
Binary files differ
diff --git a/src/assets/img/homePage_img_3.png b/src/assets/img/homePage_img_3.png
new file mode 100644
index 0000000..b559740
--- /dev/null
+++ b/src/assets/img/homePage_img_3.png
Binary files differ
diff --git a/src/assets/img/homePage_img_4.png b/src/assets/img/homePage_img_4.png
new file mode 100644
index 0000000..6ba376d
--- /dev/null
+++ b/src/assets/img/homePage_img_4.png
Binary files differ
diff --git a/src/assets/img/homePage_img_5.png b/src/assets/img/homePage_img_5.png
new file mode 100644
index 0000000..3efe61e
--- /dev/null
+++ b/src/assets/img/homePage_img_5.png
Binary files differ
diff --git a/src/assets/img/homePage_img_6.png b/src/assets/img/homePage_img_6.png
new file mode 100644
index 0000000..e93796b
--- /dev/null
+++ b/src/assets/img/homePage_img_6.png
Binary files differ
diff --git a/src/assets/img/homePage_img_7.png b/src/assets/img/homePage_img_7.png
new file mode 100644
index 0000000..27fc36e
--- /dev/null
+++ b/src/assets/img/homePage_img_7.png
Binary files differ
diff --git a/src/assets/img/homePage_img_8.png b/src/assets/img/homePage_img_8.png
new file mode 100644
index 0000000..56f122d
--- /dev/null
+++ b/src/assets/img/homePage_img_8.png
Binary files differ
diff --git a/src/assets/img/homePage_img_9.png b/src/assets/img/homePage_img_9.png
new file mode 100644
index 0000000..5b130de
--- /dev/null
+++ b/src/assets/img/homePage_img_9.png
Binary files differ
diff --git a/src/assets/img/home_1.png b/src/assets/img/home_1.png
new file mode 100644
index 0000000..d94593b
--- /dev/null
+++ b/src/assets/img/home_1.png
Binary files differ
diff --git a/src/assets/img/home_10.png b/src/assets/img/home_10.png
new file mode 100644
index 0000000..c074589
--- /dev/null
+++ b/src/assets/img/home_10.png
Binary files differ
diff --git a/src/assets/img/home_11.png b/src/assets/img/home_11.png
new file mode 100644
index 0000000..111384a
--- /dev/null
+++ b/src/assets/img/home_11.png
Binary files differ
diff --git a/src/assets/img/home_2.png b/src/assets/img/home_2.png
new file mode 100644
index 0000000..fb41c67
--- /dev/null
+++ b/src/assets/img/home_2.png
Binary files differ
diff --git a/src/assets/img/home_3.png b/src/assets/img/home_3.png
new file mode 100644
index 0000000..683867e
--- /dev/null
+++ b/src/assets/img/home_3.png
Binary files differ
diff --git a/src/assets/img/home_4.png b/src/assets/img/home_4.png
new file mode 100644
index 0000000..9c5428d
--- /dev/null
+++ b/src/assets/img/home_4.png
Binary files differ
diff --git a/src/assets/img/home_5.png b/src/assets/img/home_5.png
new file mode 100644
index 0000000..8d298a1
--- /dev/null
+++ b/src/assets/img/home_5.png
Binary files differ
diff --git a/src/assets/img/home_6.png b/src/assets/img/home_6.png
new file mode 100644
index 0000000..929cf73
--- /dev/null
+++ b/src/assets/img/home_6.png
Binary files differ
diff --git a/src/assets/img/home_7.png b/src/assets/img/home_7.png
new file mode 100644
index 0000000..7802ee2
--- /dev/null
+++ b/src/assets/img/home_7.png
Binary files differ
diff --git a/src/assets/img/home_8.png b/src/assets/img/home_8.png
new file mode 100644
index 0000000..10fc5bc
--- /dev/null
+++ b/src/assets/img/home_8.png
Binary files differ
diff --git a/src/assets/img/home_9.png b/src/assets/img/home_9.png
new file mode 100644
index 0000000..c23c9bc
--- /dev/null
+++ b/src/assets/img/home_9.png
Binary files differ
diff --git a/src/assets/img/idCardFace.png b/src/assets/img/idCardFace.png
new file mode 100644
index 0000000..3feaede
--- /dev/null
+++ b/src/assets/img/idCardFace.png
Binary files differ
diff --git a/src/assets/img/idCardReverse.png b/src/assets/img/idCardReverse.png
new file mode 100644
index 0000000..a7fe634
--- /dev/null
+++ b/src/assets/img/idCardReverse.png
Binary files differ
diff --git a/src/assets/img/idCardTip.png b/src/assets/img/idCardTip.png
new file mode 100644
index 0000000..8ee000c
--- /dev/null
+++ b/src/assets/img/idCardTip.png
Binary files differ
diff --git a/src/assets/img/idCardphoto.png b/src/assets/img/idCardphoto.png
new file mode 100644
index 0000000..8725ca1
--- /dev/null
+++ b/src/assets/img/idCardphoto.png
Binary files differ
diff --git a/src/assets/img/idcard.png b/src/assets/img/idcard.png
new file mode 100644
index 0000000..aae8ed1
--- /dev/null
+++ b/src/assets/img/idcard.png
Binary files differ
diff --git a/src/assets/img/idcardOcr.png b/src/assets/img/idcardOcr.png
new file mode 100644
index 0000000..87c2c2e
--- /dev/null
+++ b/src/assets/img/idcardOcr.png
Binary files differ
diff --git a/src/assets/img/img_none.png b/src/assets/img/img_none.png
new file mode 100644
index 0000000..e1420c7
--- /dev/null
+++ b/src/assets/img/img_none.png
Binary files differ
diff --git a/src/assets/img/index.js b/src/assets/img/index.js
new file mode 100644
index 0000000..3d1c0fc
--- /dev/null
+++ b/src/assets/img/index.js
@@ -0,0 +1,520 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-28 17:49:57
+ * @LastEditTime: 2025-05-20 09:36:45
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-10 12:00:11
+ * @LastEditTime: 2025-05-07 16:21:03
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 图片
+ */
+import room_bg from './room-bg.png'; // 房间详情背景图
+import avatar1 from './avatar1.png'; // 头像1
+import avatar2 from './avatar2.png'; // 头像2
+import img_none from './img_none.png'; //无图显示
+import goldMedal from './goldMedal.png'; // 金牌
+import questionMark from './questionMark.png'; // 问号
+import questionMark_blue from './questionMark_blue.png'; // 问号
+import qianChu from './qianChu.png'; // 迁出
+import delEliminate from './delEliminate.png'; // 删除图片
+
+// 个人中心
+import me_avatar from './me.png'; // 个人中心头像
+import me_img_1 from './me_img_1.png';
+import me_img_2 from './me_img_2.png';
+import me_img_3 from './me_img_3.png';
+import me_img_4 from './me_img_4.png';
+import me_img_5 from './me_img_5.png';
+import me_img_6 from './me_img_6.png';
+import me_img_7 from './me_img_7.png';
+import me_img_8 from './me_img_8.png';
+import me_img_9 from './me_img_9.png';
+import me_img_10 from './me_img_10.png';
+import me_img_11 from './me_img_11.png';
+import me_img_12 from './me_img_12.png';
+import me_img_13 from './me_img_13.png';
+import me_img_14 from './me_img_14.png';
+import me_img_15 from './me_img_15.png';
+import me_img_16 from './me_img_16.png';
+import me_img_17 from './me_img_17.png';
+import me_img_18 from './me_img_18.png';
+import me_img_19 from './me_img_19.png';
+import me_img_20 from './me_img_20.png';
+import me_img_21 from './me_img_21.png';
+import homePage_1 from './homePage_1.png';
+import homePage_2 from './homePage_2.png';
+import homePage_3 from './homePage_3.png';
+import homePage_4 from './homePage_4.png';
+
+import modalDown_1 from './modalDown_1.png';
+
+// 我的消息
+import message_img_1 from './message_img_1.png';
+import message_img_2 from './message_img_2.png';
+// 我的任务
+import task_img_1 from './task_img_1.png';
+import task_img_2 from './task_img_2.png';
+import task_img_3 from './task_img_3.png';
+// 我的任务 - 任务处理
+import taskHandle_img_1 from './taskHandle_img_1.png';
+// 到访历史
+import visitHistory_img_1 from './visitHistory_img_1.png';
+// TabBarPage
+import tabBar_img_1 from './tabBar_img_1.png';
+import tabBar_img_2 from './tabBar_img_2.png';
+import tabBar_img_3 from './tabBar_img_3.png';
+import tabBar_img_4 from './tabBar_img_4.png';
+import tabBar_img_5 from './tabBar_img_5.png';
+import tabBar_img_6 from './tabBar_img_6.png';
+import tabBar_img_7 from './tabBar_img_7.png';
+import tabBar_img_8 from './tabBar_img_8.png';
+import tabBar_img_9 from './tabBar_img_9.png';
+import tabBar_img_10 from './tabBar_img_10.png';
+import tabBar_img_11 from './tabBar_img_11.png';
+
+// homePage
+import homePage_img_1 from './homePage_img_1.png';
+import homePage_img_2 from './homePage_img_2.png';
+import homePage_img_3 from './homePage_img_3.png';
+import homePage_img_4 from './homePage_img_4.png';
+import homePage_img_5 from './homePage_img_5.png';
+import homePage_img_6 from './homePage_img_6.png';
+import homePage_img_7 from './homePage_img_7.png';
+import homePage_img_8 from './homePage_img_8.png';
+import homePage_img_9 from './homePage_img_9.png';
+import homePage_img_10 from './homePage_img_10.png';
+import homePage_img_11 from './homePage_img_11.png';
+import homePage_img_12 from './homePage_img_12.png';
+
+import homePage_bg from './homePage_bg.png';
+// 地图打点
+import base_map from './base_map.png';
+import satellite_map from './satellite_map.png';
+// 任务tag
+import task_tag_1 from './task_tag_1.png';
+import task_tag_2 from './task_tag_2.png';
+import task_tag_3 from './task_tag_3.png';
+
+import Frame_6_2x from './Frame_6_2x.png';
+import Frame_6 from './Frame_6.png';
+import qrCode from './qrCode.png';
+import seal from './seal.png';
+import person1 from './person1.png';
+import person2 from './person2.png';
+import idcard from './idcard.png';
+import address from './address.png';
+import addressBlack from './addressBlack.png';
+import idCardFace from './idCardFace.png';
+import idCardReverse from './idCardReverse.png';
+import camera from './camera.png';
+import account1 from './account1.png';
+import account2 from './account2.png';
+import account3 from './account2.png';
+import idcardOcr from './idcardOcr.png';
+import hisPerson from './hisPerson.png';
+import cataloguePng from './catalogue.png';
+import home from './home.png';
+import plaint from './plaint.png';
+import avatar4 from './avatar4.png';
+import avatar3 from './avatar3.png';
+import idCardphoto from './idCardphoto.png';
+import idCardTip from './idCardTip.png';
+import batchImport_right from './batchImport_right.png';
+import batchImport_save from './batchImport_save.png';
+import batchImport_search from './batchImport_search.png';
+import batchImport_select from './batchImport_select.png';
+//工作统计
+import workStatistics_1 from './workStatistics_1.png';
+import workStatistics_2 from './workStatistics_2.png';
+// 楼栋背景
+import buildingbg from './buildingbg.png';
+import building from './building.png';
+import building_1 from './building_1.png';
+import building_2 from './building_2.png';
+import building_3 from './building_3.png';
+import building_4 from './building_4.png';
+import building_5 from './building_5.png';
+import building_6 from './building_6.png';
+// 房间登记
+import roomForm from './roomForm.png';
+import roomForm_1 from './roomForm_1.png';
+import roomForm_2 from './roomForm_2.png';
+import roomList from './roomList.png';
+// 事件初始化
+import eventInit_img_1 from './eventInit_img_1.png';
+import eventInit_img_2 from './eventInit_img_2.png';
+import eventInit_img_3 from './eventInit_img_3.png';
+// 矛盾纠纷
+import mediate_img_2 from './mediate_img_2.png';
+import mediate_img_3 from './mediate_img_3.png';
+import mediate_img_4 from './mediate_img_4.png';
+import material_none from './material_none.png';
+import avatar5 from './avatar5.png';
+import avatar6 from './avatar6.png';
+// file显示图片
+import jpg from './jpg.svg';
+import pdf from './pdf.svg';
+import word from './word.png';
+import excel from './excel.png';
+import file from './file.svg';
+
+// 物资phone
+import phone from './phone.png';
+
+// 城乡社区
+import upOneLevel from './upOneLevel.png';
+
+// 工作日志
+import workLog_img_1 from './workLog_img_1.png';
+import workLog_img_2 from './workLog_img_2.png';
+
+//网格概况
+import surveyGrid_img_1 from './surveyGrid_img_1.png';
+
+// 数据分析
+import analysis_1 from './analysis_1.png';
+import analysis_2 from './analysis_2.png';
+
+// 帮助中心
+import help_img_1 from './help_img_1.png';
+import help_img_2 from './help_img_2.png';
+import help_img_3 from './help_img_3.png';
+import help_img_4 from './help_img_4.png';
+
+// 走访
+import visit_1 from './visit_1.png';
+import visit_2 from './visit_2.png';
+import visit_3 from './visit_3.png';
+import visit_4 from './visit_4.png';
+// 登录
+import login_1 from './login_1.png';
+import login_2 from './login_2.png';
+import login_3 from './login_3.png';
+import login_4 from './login_4.png';
+
+// 综治机构
+import institutions_1 from './institutions_1.png';
+import secPage_1 from './secPage_1.png';
+
+//实有人口
+import Personnel_1 from './Personnel_1.png';
+import Residential_1 from './Residential_1.png';
+import hasMore_1 from './hasMore_1.png';
+import close_1 from './close_1.png';
+import coordinate_1 from './coordinate_1.png';
+import coordinate_2 from './coordinate_2.png';
+import PersonnelNews_1 from './PersonnelNews_1.png';
+import PersonnelNews_2 from './PersonnelNews_2.png';
+import hasMore_2 from './hasMore_2.png';
+import remove_1 from './remove_1.png';
+import modify_1 from './modify_1.png';
+import help_1 from './help_1.png';
+import help_2 from './help_2.png';
+import floating_1 from './floating_1.png';
+import floating_2 from './floating_2.png';
+import assist_1 from './assist_1.png';
+import assist_2 from './assist_2.png';
+import assistHeading_1 from './assistHeading_1.png';
+import assistHeading_2 from './assistHeading_2.png';
+import assistHeading_3 from './assistHeading_3.png';
+import assistHeading_4 from './assistHeading_4.png';
+import assistHeading_5 from './assistHeading_5.png';
+import area_1 from './area_1.png';
+import area_2 from './area_2.png';
+import mental_1 from './mental_1.png';
+import mental_2 from './mental_2.png';
+
+import return_1 from './return_1.png';
+import helped_1 from './helped_1.png';
+import upLoadFile from './upLoadFile.png';
+
+// 涉诉涉访
+import lettersVisits_1 from './lettersVisits_1.png';
+import skinInput from './skinInput.png';
+
+import principalAdd from './principalAdd.png';
+import railwayOrgAdd_1 from './railwayOrgAdd_1.png';
+import railwayOrgAdd_2 from './railwayOrgAdd_2.png';
+import principalDetail from './principalDetail.png';
+
+// 事项办理
+import sxbl_1 from './sxbl_1.png';
+import select_null from './select_null.png';
+//案件详情
+import ledger_8 from './ledger_8.png';
+import ledger_7 from './ledger_7.png';
+import ledger_12 from './ledger_12.png';
+import ledger_13 from './ledger_13.png';
+import ledger_14 from './ledger_14.svg';
+import cbdb_1 from './cbdb_1.png';
+import applyClose_1 from './applyClose_1.svg';
+//首页
+import home_1 from './home_1.png';
+import home_2 from './home_2.png';
+import home_3 from './home_3.png';
+import home_4 from './home_4.png';
+import home_5 from './home_5.png';
+import home_6 from './home_6.png';
+import home_7 from './home_7.png';
+import home_8 from './home_8.png';
+import home_9 from './home_9.png';
+import home_10 from './home_10.png';
+import home_11 from './home_11.png';
+
+// 待审核详情
+import sqjl_1 from './sqjl_1.png';
+import sqjl_2 from './sqjl_2.png';
+import sqjl_3 from './sqjl_3.png';
+//综合查询
+import caseQuery_1 from './caseQuery_1.png';
+import caseQuery_2 from './caseQuery_2.png';
+//工作统计
+import workStatistics_3 from './workStatistics_3.png';
+import workStatistics_4 from './workStatistics_4.png';
+import workStatistics_5 from './workStatistics_5.png';
+
+// 重复事项
+import repeat_1 from './repeat_1.png';
+
+import general_user_add from './general_user-add.png';
+import general_user_add_blue from './general_user-add-blue.png';
+
+// 纠纷登记
+import caseDesPicture from './caseDesPicture.png';
+import caseDesVoice from './caseDesVoice.png';
+import riskMask from './riskMask.png';
+import guide from './guide.png';
+import preview_1 from './preview_1.png';
+import preview_2 from './preview_2.png';
+
+export {
+ room_bg,
+ avatar1,
+ avatar2,
+ me_avatar,
+ img_none,
+ goldMedal,
+ questionMark,
+ questionMark_blue,
+ qianChu,
+ delEliminate,
+ me_img_1,
+ me_img_2,
+ me_img_3,
+ me_img_4,
+ me_img_5,
+ me_img_6,
+ me_img_7,
+ me_img_8,
+ me_img_9,
+ me_img_10,
+ me_img_11,
+ me_img_12,
+ me_img_13,
+ me_img_14,
+ me_img_15,
+ me_img_16,
+ me_img_17,
+ me_img_18,
+ me_img_19,
+ me_img_20,
+ me_img_21,
+ homePage_1,
+ homePage_2,
+ homePage_3,
+ homePage_4,
+ modalDown_1,
+ message_img_1,
+ message_img_2,
+ task_img_1,
+ task_img_2,
+ task_img_3,
+ taskHandle_img_1,
+ visitHistory_img_1,
+ tabBar_img_1,
+ tabBar_img_2,
+ tabBar_img_3,
+ tabBar_img_4,
+ tabBar_img_5,
+ tabBar_img_6,
+ tabBar_img_7,
+ tabBar_img_8,
+ tabBar_img_9,
+ tabBar_img_10,
+ tabBar_img_11,
+ homePage_img_1,
+ homePage_img_2,
+ homePage_img_3,
+ homePage_img_4,
+ homePage_img_5,
+ homePage_img_6,
+ homePage_img_7,
+ homePage_img_8,
+ homePage_img_9,
+ homePage_img_10,
+ homePage_img_11,
+ homePage_img_12,
+ homePage_bg,
+ base_map,
+ satellite_map,
+ task_tag_1,
+ task_tag_2,
+ task_tag_3,
+ Frame_6_2x,
+ Frame_6,
+ idcard,
+ address,
+ addressBlack,
+ qrCode,
+ seal,
+ person1,
+ person2,
+ idCardFace,
+ idCardReverse,
+ camera,
+ account1,
+ account2,
+ account3,
+ idcardOcr,
+ hisPerson,
+ cataloguePng,
+ home,
+ plaint,
+ avatar4,
+ avatar3,
+ idCardphoto,
+ idCardTip,
+ batchImport_right,
+ batchImport_save,
+ batchImport_search,
+ batchImport_select,
+ workStatistics_1,
+ workStatistics_2,
+ buildingbg,
+ building,
+ building_1,
+ building_2,
+ building_3,
+ building_4,
+ building_5,
+ building_6,
+ roomForm,
+ roomForm_1,
+ roomForm_2,
+ roomList,
+ eventInit_img_1,
+ eventInit_img_2,
+ eventInit_img_3,
+ mediate_img_2,
+ mediate_img_3,
+ mediate_img_4,
+ material_none,
+ avatar5,
+ avatar6,
+ phone,
+ jpg,
+ pdf,
+ word,
+ excel,
+ file,
+ upOneLevel,
+ workLog_img_1,
+ workLog_img_2,
+ surveyGrid_img_1,
+ analysis_1,
+ analysis_2,
+ help_img_1,
+ help_img_2,
+ help_img_3,
+ help_img_4,
+ visit_1,
+ visit_2,
+ visit_3,
+ visit_4,
+ login_1,
+ login_2,
+ login_3,
+ login_4,
+ institutions_1,
+ secPage_1,
+ Personnel_1,
+ Residential_1,
+ hasMore_1,
+ close_1,
+ coordinate_1,
+ coordinate_2,
+ PersonnelNews_1,
+ PersonnelNews_2,
+ hasMore_2,
+ remove_1,
+ modify_1,
+ help_1,
+ help_2,
+ floating_1,
+ floating_2,
+ assist_1,
+ assist_2,
+ assistHeading_1,
+ assistHeading_2,
+ assistHeading_3,
+ assistHeading_4,
+ assistHeading_5,
+ area_1,
+ area_2,
+ mental_1,
+ mental_2,
+ lettersVisits_1,
+ return_1,
+ helped_1,
+ upLoadFile,
+ skinInput,
+ principalAdd,
+ railwayOrgAdd_1,
+ railwayOrgAdd_2,
+ principalDetail,
+ select_null,
+ sxbl_1,
+ ledger_8,
+ ledger_7,
+ ledger_12,
+ ledger_13,
+ ledger_14,
+ applyClose_1,
+ sqjl_1,
+ sqjl_2,
+ sqjl_3,
+ cbdb_1,
+ home_1,
+ home_2,
+ home_3,
+ home_4,
+ home_5,
+ home_6,
+ home_7,
+ home_8,
+ home_9,
+ home_11,
+ repeat_1,
+ home_10,
+ caseQuery_1,
+ caseQuery_2,
+ general_user_add,
+ general_user_add_blue,
+ caseDesPicture,
+ caseDesVoice,
+ riskMask,
+ guide,
+ preview_1,
+ preview_2,
+ workStatistics_3,
+ workStatistics_4,
+ workStatistics_5,
+};
diff --git a/src/assets/img/index_modal_1.png b/src/assets/img/index_modal_1.png
new file mode 100644
index 0000000..91417e7
--- /dev/null
+++ b/src/assets/img/index_modal_1.png
Binary files differ
diff --git a/src/assets/img/index_modal_2.png b/src/assets/img/index_modal_2.png
new file mode 100644
index 0000000..06b6112
--- /dev/null
+++ b/src/assets/img/index_modal_2.png
Binary files differ
diff --git a/src/assets/img/institutions_1.png b/src/assets/img/institutions_1.png
new file mode 100644
index 0000000..2751b54
--- /dev/null
+++ b/src/assets/img/institutions_1.png
Binary files differ
diff --git a/src/assets/img/jpg.svg b/src/assets/img/jpg.svg
new file mode 100644
index 0000000..ee2b3f2
--- /dev/null
+++ b/src/assets/img/jpg.svg
@@ -0,0 +1,9 @@
+<svg width="40" height="46" viewBox="0 0 40 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M40 11.6914V43.5939C40 44.383 39.3616 45.0214 38.5725 45.0214H5.51893C4.91576 45.0214 4.43323 44.5338 4.43323 43.9357V0.799196C4.43323 0.356874 4.7901 0 5.23242 0H27.5044C27.5496 0 27.5747 0.0552904 27.5446 0.0904752C27.5245 0.110581 27.5245 0.145765 27.5496 0.165871L39.9899 11.6562C39.9899 11.6662 40 11.6813 40 11.6914V11.6914Z" fill="#F4F4F4"/>
+<path d="M27.5094 10.9223V0L40 11.6713H28.2584C27.8462 11.6713 27.5094 11.3345 27.5094 10.9223ZM16.2805 14.6419H5.31289C2.37748 14.6419 0 12.2644 0 9.32898C0 6.39357 2.37748 4.01608 5.31289 4.01608H16.2805C19.2159 4.01608 21.5934 6.39357 21.5934 9.32898C21.5984 12.2644 19.2159 14.6419 16.2805 14.6419Z" fill="#E52020"/>
+<path d="M11.1851 35.8057L15.31 29.743C15.3628 29.6653 15.432 29.6001 15.5128 29.5521C15.5936 29.5041 15.6839 29.4745 15.7774 29.4653C15.8709 29.4561 15.9653 29.4675 16.0539 29.4989C16.1425 29.5302 16.2231 29.5806 16.2901 29.6465L19.0161 32.3174L24.9973 22.9424C25.0565 22.8494 25.1387 22.7732 25.236 22.7212C25.3333 22.6692 25.4423 22.6432 25.5526 22.6457C25.6628 22.6481 25.7706 22.679 25.8654 22.7353C25.9603 22.7916 26.039 22.8714 26.094 22.967L33.5255 35.8461C33.5819 35.9436 33.6116 36.0543 33.6117 36.1669C33.6117 36.2796 33.5821 36.3903 33.5258 36.4879C33.4694 36.5854 33.3884 36.6664 33.2908 36.7227C33.1932 36.7789 33.0825 36.8085 32.9698 36.8084H11.7156C11.5988 36.8086 11.4842 36.777 11.3841 36.7168C11.284 36.6567 11.2022 36.5704 11.1476 36.4672C11.093 36.364 11.0676 36.2478 11.0741 36.1312C11.0807 36.0147 11.119 35.9021 11.1848 35.8057H11.1851Z" fill="#E52020"/>
+<path d="M12.4204 22.0779C12.4204 22.9355 12.7611 23.758 13.3675 24.3644C13.9739 24.9708 14.7964 25.3115 15.654 25.3115C16.5117 25.3115 17.3342 24.9708 17.9406 24.3644C18.547 23.758 18.8877 22.9355 18.8877 22.0779C18.8877 21.2203 18.547 20.3978 17.9406 19.7913C17.3342 19.1849 16.5117 18.8442 15.654 18.8442C14.7964 18.8442 13.9739 19.1849 13.3675 19.7913C12.7611 20.3978 12.4204 21.2203 12.4204 22.0779V22.0779Z" fill="#E52020"/>
+<path d="M7.28516 10.7549V7.73438H7.84766V10.7549C7.84766 11.0361 7.79004 11.2734 7.6748 11.4668C7.55957 11.6602 7.40039 11.8076 7.19727 11.9092C6.99609 12.0088 6.76465 12.0586 6.50293 12.0586C6.24121 12.0586 6.00879 12.0137 5.80566 11.9238C5.60254 11.834 5.44336 11.6973 5.32812 11.5137C5.21289 11.3301 5.15527 11.0986 5.15527 10.8193H5.7207C5.7207 10.999 5.75391 11.1465 5.82031 11.2617C5.88672 11.377 5.97852 11.4619 6.0957 11.5166C6.21484 11.5713 6.35059 11.5986 6.50293 11.5986C6.65137 11.5986 6.78418 11.5674 6.90137 11.5049C7.02051 11.4404 7.11426 11.3457 7.18262 11.2207C7.25098 11.0938 7.28516 10.9385 7.28516 10.7549ZM10.3789 10.3271H9.23926V9.86719H10.3789C10.5996 9.86719 10.7783 9.83203 10.915 9.76172C11.0518 9.69141 11.1514 9.59375 11.2139 9.46875C11.2783 9.34375 11.3105 9.20117 11.3105 9.04102C11.3105 8.89453 11.2783 8.75684 11.2139 8.62793C11.1514 8.49902 11.0518 8.39551 10.915 8.31738C10.7783 8.2373 10.5996 8.19727 10.3789 8.19727H9.37109V12H8.80566V7.73438H10.3789C10.7012 7.73438 10.9736 7.79004 11.1963 7.90137C11.4189 8.0127 11.5879 8.16699 11.7031 8.36426C11.8184 8.55957 11.876 8.7832 11.876 9.03516C11.876 9.30859 11.8184 9.54199 11.7031 9.73535C11.5879 9.92871 11.4189 10.0762 11.1963 10.1777C10.9736 10.2773 10.7012 10.3271 10.3789 10.3271ZM15.7432 9.87598V11.4375C15.6904 11.5156 15.6064 11.6035 15.4912 11.7012C15.376 11.7969 15.2168 11.8809 15.0137 11.9531C14.8125 12.0234 14.5527 12.0586 14.2344 12.0586C13.9746 12.0586 13.7354 12.0137 13.5166 11.9238C13.2998 11.832 13.1113 11.6992 12.9512 11.5254C12.793 11.3496 12.6699 11.1367 12.582 10.8867C12.4961 10.6348 12.4531 10.3496 12.4531 10.0312V9.7002C12.4531 9.38184 12.4902 9.09766 12.5645 8.84766C12.6406 8.59766 12.752 8.38574 12.8984 8.21191C13.0449 8.03613 13.2246 7.90332 13.4375 7.81348C13.6504 7.72168 13.8945 7.67578 14.1699 7.67578C14.4961 7.67578 14.7686 7.73242 14.9873 7.8457C15.208 7.95703 15.3799 8.11133 15.5029 8.30859C15.6279 8.50586 15.708 8.73047 15.7432 8.98242H15.1777C15.1523 8.82812 15.1016 8.6875 15.0254 8.56055C14.9512 8.43359 14.8447 8.33203 14.7061 8.25586C14.5674 8.17773 14.3887 8.13867 14.1699 8.13867C13.9727 8.13867 13.8018 8.1748 13.6572 8.24707C13.5127 8.31934 13.3936 8.42285 13.2998 8.55762C13.2061 8.69238 13.1357 8.85547 13.0889 9.04688C13.0439 9.23828 13.0215 9.4541 13.0215 9.69434V10.0312C13.0215 10.2773 13.0498 10.4971 13.1064 10.6904C13.165 10.8838 13.248 11.0488 13.3555 11.1855C13.4629 11.3203 13.5908 11.4229 13.7393 11.4932C13.8896 11.5635 14.0557 11.5986 14.2373 11.5986C14.4385 11.5986 14.6016 11.582 14.7266 11.5488C14.8516 11.5137 14.9492 11.4727 15.0195 11.4258C15.0898 11.377 15.1436 11.3311 15.1807 11.2881V10.333H14.1934V9.87598H15.7432Z" fill="white"/>
+<rect y="4" width="22" height="12" rx="6" fill="#E52020"/>
+<path d="M7.18848 10.7197V7.73438H7.9209V10.7197C7.9209 11.0029 7.86035 11.2441 7.73926 11.4434C7.61816 11.6426 7.45312 11.7949 7.24414 11.9004C7.03516 12.0059 6.79785 12.0586 6.53223 12.0586C6.26074 12.0586 6.01953 12.0127 5.80859 11.9209C5.59961 11.8291 5.43555 11.6885 5.31641 11.499C5.19727 11.3096 5.1377 11.0693 5.1377 10.7783H5.87598C5.87598 10.9463 5.90234 11.082 5.95508 11.1855C6.00977 11.2871 6.08594 11.3613 6.18359 11.4082C6.2832 11.4531 6.39941 11.4756 6.53223 11.4756C6.65918 11.4756 6.77148 11.4473 6.86914 11.3906C6.96875 11.332 7.04688 11.2471 7.10352 11.1357C7.16016 11.0225 7.18848 10.8838 7.18848 10.7197ZM10.3877 10.4092H9.27734V9.82617H10.3877C10.5811 9.82617 10.7373 9.79492 10.8564 9.73242C10.9756 9.66992 11.0625 9.58398 11.1172 9.47461C11.1738 9.36328 11.2021 9.23633 11.2021 9.09375C11.2021 8.95898 11.1738 8.83301 11.1172 8.71582C11.0625 8.59668 10.9756 8.50098 10.8564 8.42871C10.7373 8.35645 10.5811 8.32031 10.3877 8.32031H9.50293V12H8.76758V7.73438H10.3877C10.7178 7.73438 10.998 7.79297 11.2285 7.91016C11.4609 8.02539 11.6377 8.18555 11.7588 8.39062C11.8799 8.59375 11.9404 8.82617 11.9404 9.08789C11.9404 9.36328 11.8799 9.59961 11.7588 9.79688C11.6377 9.99414 11.4609 10.1455 11.2285 10.251C10.998 10.3564 10.7178 10.4092 10.3877 10.4092ZM15.875 9.82031V11.4492C15.8145 11.5293 15.7197 11.6172 15.5908 11.7129C15.4639 11.8066 15.2949 11.8877 15.084 11.9561C14.873 12.0244 14.6104 12.0586 14.2959 12.0586C14.0283 12.0586 13.7832 12.0137 13.5605 11.9238C13.3379 11.832 13.1455 11.6982 12.9834 11.5225C12.8232 11.3467 12.6992 11.1328 12.6113 10.8809C12.5234 10.627 12.4795 10.3379 12.4795 10.0137V9.71777C12.4795 9.39551 12.5195 9.1084 12.5996 8.85645C12.6816 8.60254 12.7988 8.3877 12.9512 8.21191C13.1035 8.03613 13.2871 7.90332 13.502 7.81348C13.7188 7.72168 13.9639 7.67578 14.2373 7.67578C14.5869 7.67578 14.876 7.73438 15.1045 7.85156C15.335 7.9668 15.5127 8.12695 15.6377 8.33203C15.7627 8.53711 15.8418 8.77148 15.875 9.03516H15.1543C15.1309 8.88672 15.085 8.75391 15.0166 8.63672C14.9502 8.51953 14.8545 8.42773 14.7295 8.36133C14.6064 8.29297 14.4463 8.25879 14.249 8.25879C14.0791 8.25879 13.9297 8.29102 13.8008 8.35547C13.6719 8.41992 13.5645 8.51465 13.4785 8.63965C13.3945 8.76465 13.3311 8.91699 13.2881 9.09668C13.2451 9.27637 13.2236 9.48145 13.2236 9.71191V10.0137C13.2236 10.248 13.248 10.4561 13.2969 10.6377C13.3477 10.8193 13.4199 10.9727 13.5137 11.0977C13.6094 11.2227 13.7256 11.3174 13.8623 11.3818C13.999 11.4443 14.1533 11.4756 14.3252 11.4756C14.4932 11.4756 14.6309 11.4619 14.7383 11.4346C14.8457 11.4053 14.9307 11.3711 14.9932 11.332C15.0576 11.291 15.1074 11.252 15.1426 11.2148V10.3682H14.2549V9.82031H15.875Z" fill="white"/>
+</svg>
diff --git a/src/assets/img/ledger_12.png b/src/assets/img/ledger_12.png
new file mode 100644
index 0000000..4467c98
--- /dev/null
+++ b/src/assets/img/ledger_12.png
Binary files differ
diff --git a/src/assets/img/ledger_13.png b/src/assets/img/ledger_13.png
new file mode 100644
index 0000000..941122c
--- /dev/null
+++ b/src/assets/img/ledger_13.png
Binary files differ
diff --git a/src/assets/img/ledger_14.svg b/src/assets/img/ledger_14.svg
new file mode 100644
index 0000000..0c905f7
--- /dev/null
+++ b/src/assets/img/ledger_14.svg
@@ -0,0 +1,19 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_511_38706)">
+<path opacity="0.01" d="M0 0H16V16H0V0Z" fill="#202425"/>
+<path d="M14.8667 7.93333C14.8667 11.7627 11.7627 14.8667 7.93333 14.8667C4.104 14.8667 1 11.7627 1 7.93333C1 4.104 4.104 1 7.93333 1C11.7627 1 14.8667 4.104 14.8667 7.93333Z" fill="#F53F3F"/>
+<path d="M8.00011 1.60182C4.46571 1.60182 1.60011 4.46742 1.60011 8.00182C1.60011 11.5362 4.46571 14.4018 8.00011 14.4018C11.5345 14.4018 14.4001 11.5362 14.4001 8.00182C14.4001 4.46742 11.5345 1.60182 8.00011 1.60182ZM0.533447 8.00182C0.533447 3.87809 3.87638 0.535156 8.00011 0.535156C12.1238 0.535156 15.4668 3.87809 15.4668 8.00182C15.4668 12.1256 12.1238 15.4685 8.00011 15.4685C3.87638 15.4685 0.533447 12.1256 0.533447 8.00182Z" fill="white"/>
+<g clip-path="url(#clip1_511_38706)">
+<path d="M6.33398 6.33594L9.66732 9.66927" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M6.33398 9.66927L9.66732 6.33594" stroke="white" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_511_38706">
+<rect width="16" height="16" fill="white"/>
+</clipPath>
+<clipPath id="clip1_511_38706">
+<rect width="8" height="8" fill="white" transform="translate(4 4)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/src/assets/img/ledger_7.png b/src/assets/img/ledger_7.png
new file mode 100644
index 0000000..99d1539
--- /dev/null
+++ b/src/assets/img/ledger_7.png
Binary files differ
diff --git a/src/assets/img/ledger_8.png b/src/assets/img/ledger_8.png
new file mode 100644
index 0000000..d216a43
--- /dev/null
+++ b/src/assets/img/ledger_8.png
Binary files differ
diff --git a/src/assets/img/legal_person_0.png b/src/assets/img/legal_person_0.png
new file mode 100644
index 0000000..019130f
--- /dev/null
+++ b/src/assets/img/legal_person_0.png
Binary files differ
diff --git a/src/assets/img/legal_person_1.png b/src/assets/img/legal_person_1.png
new file mode 100644
index 0000000..167fcea
--- /dev/null
+++ b/src/assets/img/legal_person_1.png
Binary files differ
diff --git a/src/assets/img/lettersVisits_1.png b/src/assets/img/lettersVisits_1.png
new file mode 100644
index 0000000..554fbb4
--- /dev/null
+++ b/src/assets/img/lettersVisits_1.png
Binary files differ
diff --git a/src/assets/img/license.png b/src/assets/img/license.png
new file mode 100644
index 0000000..e49faf8
--- /dev/null
+++ b/src/assets/img/license.png
Binary files differ
diff --git a/src/assets/img/link_picture.png b/src/assets/img/link_picture.png
new file mode 100644
index 0000000..fb5674a
--- /dev/null
+++ b/src/assets/img/link_picture.png
Binary files differ
diff --git a/src/assets/img/logAvatar.png b/src/assets/img/logAvatar.png
new file mode 100644
index 0000000..9269200
--- /dev/null
+++ b/src/assets/img/logAvatar.png
Binary files differ
diff --git a/src/assets/img/login_1.png b/src/assets/img/login_1.png
new file mode 100644
index 0000000..bf7caa2
--- /dev/null
+++ b/src/assets/img/login_1.png
Binary files differ
diff --git a/src/assets/img/login_2.png b/src/assets/img/login_2.png
new file mode 100644
index 0000000..f795c5c
--- /dev/null
+++ b/src/assets/img/login_2.png
Binary files differ
diff --git a/src/assets/img/login_3.png b/src/assets/img/login_3.png
new file mode 100644
index 0000000..12d0ad9
--- /dev/null
+++ b/src/assets/img/login_3.png
Binary files differ
diff --git a/src/assets/img/login_4.png b/src/assets/img/login_4.png
new file mode 100644
index 0000000..8a57de6
--- /dev/null
+++ b/src/assets/img/login_4.png
Binary files differ
diff --git a/src/assets/img/login_history.png b/src/assets/img/login_history.png
new file mode 100644
index 0000000..b2d56d7
--- /dev/null
+++ b/src/assets/img/login_history.png
Binary files differ
diff --git a/src/assets/img/logo1.png b/src/assets/img/logo1.png
new file mode 100644
index 0000000..2455628
--- /dev/null
+++ b/src/assets/img/logo1.png
Binary files differ
diff --git a/src/assets/img/material_none.png b/src/assets/img/material_none.png
new file mode 100644
index 0000000..7dd24ec
--- /dev/null
+++ b/src/assets/img/material_none.png
Binary files differ
diff --git a/src/assets/img/me.png b/src/assets/img/me.png
new file mode 100644
index 0000000..2a97553
--- /dev/null
+++ b/src/assets/img/me.png
Binary files differ
diff --git a/src/assets/img/me_img_1.png b/src/assets/img/me_img_1.png
new file mode 100644
index 0000000..17c9e37
--- /dev/null
+++ b/src/assets/img/me_img_1.png
Binary files differ
diff --git a/src/assets/img/me_img_10.png b/src/assets/img/me_img_10.png
new file mode 100644
index 0000000..e5528a7
--- /dev/null
+++ b/src/assets/img/me_img_10.png
Binary files differ
diff --git a/src/assets/img/me_img_11.png b/src/assets/img/me_img_11.png
new file mode 100644
index 0000000..3ede5c1
--- /dev/null
+++ b/src/assets/img/me_img_11.png
Binary files differ
diff --git a/src/assets/img/me_img_12.png b/src/assets/img/me_img_12.png
new file mode 100644
index 0000000..c9219f4
--- /dev/null
+++ b/src/assets/img/me_img_12.png
Binary files differ
diff --git a/src/assets/img/me_img_13.png b/src/assets/img/me_img_13.png
new file mode 100644
index 0000000..0da2129
--- /dev/null
+++ b/src/assets/img/me_img_13.png
Binary files differ
diff --git a/src/assets/img/me_img_14.png b/src/assets/img/me_img_14.png
new file mode 100644
index 0000000..d2f672c
--- /dev/null
+++ b/src/assets/img/me_img_14.png
Binary files differ
diff --git a/src/assets/img/me_img_15.png b/src/assets/img/me_img_15.png
new file mode 100644
index 0000000..7ce0fff
--- /dev/null
+++ b/src/assets/img/me_img_15.png
Binary files differ
diff --git a/src/assets/img/me_img_16.png b/src/assets/img/me_img_16.png
new file mode 100644
index 0000000..0d2428d
--- /dev/null
+++ b/src/assets/img/me_img_16.png
Binary files differ
diff --git a/src/assets/img/me_img_17.png b/src/assets/img/me_img_17.png
new file mode 100644
index 0000000..8659983
--- /dev/null
+++ b/src/assets/img/me_img_17.png
Binary files differ
diff --git a/src/assets/img/me_img_18.png b/src/assets/img/me_img_18.png
new file mode 100644
index 0000000..e42e7e8
--- /dev/null
+++ b/src/assets/img/me_img_18.png
Binary files differ
diff --git a/src/assets/img/me_img_19.png b/src/assets/img/me_img_19.png
new file mode 100644
index 0000000..3a66afa
--- /dev/null
+++ b/src/assets/img/me_img_19.png
Binary files differ
diff --git a/src/assets/img/me_img_2.png b/src/assets/img/me_img_2.png
new file mode 100644
index 0000000..9564b05
--- /dev/null
+++ b/src/assets/img/me_img_2.png
Binary files differ
diff --git a/src/assets/img/me_img_20.png b/src/assets/img/me_img_20.png
new file mode 100644
index 0000000..203bb22
--- /dev/null
+++ b/src/assets/img/me_img_20.png
Binary files differ
diff --git a/src/assets/img/me_img_21.png b/src/assets/img/me_img_21.png
new file mode 100644
index 0000000..460b2a4
--- /dev/null
+++ b/src/assets/img/me_img_21.png
Binary files differ
diff --git a/src/assets/img/me_img_3.png b/src/assets/img/me_img_3.png
new file mode 100644
index 0000000..dba764b
--- /dev/null
+++ b/src/assets/img/me_img_3.png
Binary files differ
diff --git a/src/assets/img/me_img_4.png b/src/assets/img/me_img_4.png
new file mode 100644
index 0000000..9bc20b9
--- /dev/null
+++ b/src/assets/img/me_img_4.png
Binary files differ
diff --git a/src/assets/img/me_img_5.png b/src/assets/img/me_img_5.png
new file mode 100644
index 0000000..5c334c3
--- /dev/null
+++ b/src/assets/img/me_img_5.png
Binary files differ
diff --git a/src/assets/img/me_img_6.png b/src/assets/img/me_img_6.png
new file mode 100644
index 0000000..2d3a147
--- /dev/null
+++ b/src/assets/img/me_img_6.png
Binary files differ
diff --git a/src/assets/img/me_img_7.png b/src/assets/img/me_img_7.png
new file mode 100644
index 0000000..d07d90e
--- /dev/null
+++ b/src/assets/img/me_img_7.png
Binary files differ
diff --git a/src/assets/img/me_img_8.png b/src/assets/img/me_img_8.png
new file mode 100644
index 0000000..9e6888d
--- /dev/null
+++ b/src/assets/img/me_img_8.png
Binary files differ
diff --git a/src/assets/img/me_img_9.png b/src/assets/img/me_img_9.png
new file mode 100644
index 0000000..6a45018
--- /dev/null
+++ b/src/assets/img/me_img_9.png
Binary files differ
diff --git a/src/assets/img/mediate_img_2.png b/src/assets/img/mediate_img_2.png
new file mode 100644
index 0000000..f6ec43e
--- /dev/null
+++ b/src/assets/img/mediate_img_2.png
Binary files differ
diff --git a/src/assets/img/mediate_img_3.png b/src/assets/img/mediate_img_3.png
new file mode 100644
index 0000000..06c3fc1
--- /dev/null
+++ b/src/assets/img/mediate_img_3.png
Binary files differ
diff --git a/src/assets/img/mediate_img_4.png b/src/assets/img/mediate_img_4.png
new file mode 100644
index 0000000..6ab7651
--- /dev/null
+++ b/src/assets/img/mediate_img_4.png
Binary files differ
diff --git a/src/assets/img/mental_1.png b/src/assets/img/mental_1.png
new file mode 100644
index 0000000..8a39805
--- /dev/null
+++ b/src/assets/img/mental_1.png
Binary files differ
diff --git a/src/assets/img/mental_2.png b/src/assets/img/mental_2.png
new file mode 100644
index 0000000..7e3c36f
--- /dev/null
+++ b/src/assets/img/mental_2.png
Binary files differ
diff --git a/src/assets/img/message_img_1.png b/src/assets/img/message_img_1.png
new file mode 100644
index 0000000..76023d7
--- /dev/null
+++ b/src/assets/img/message_img_1.png
Binary files differ
diff --git a/src/assets/img/message_img_2.png b/src/assets/img/message_img_2.png
new file mode 100644
index 0000000..86e6694
--- /dev/null
+++ b/src/assets/img/message_img_2.png
Binary files differ
diff --git a/src/assets/img/modalDown_1.png b/src/assets/img/modalDown_1.png
new file mode 100644
index 0000000..0384f04
--- /dev/null
+++ b/src/assets/img/modalDown_1.png
Binary files differ
diff --git a/src/assets/img/modify_1.png b/src/assets/img/modify_1.png
new file mode 100644
index 0000000..55b5e9b
--- /dev/null
+++ b/src/assets/img/modify_1.png
Binary files differ
diff --git a/src/assets/img/natural_person_0.png b/src/assets/img/natural_person_0.png
new file mode 100644
index 0000000..8ef8b06
--- /dev/null
+++ b/src/assets/img/natural_person_0.png
Binary files differ
diff --git a/src/assets/img/natural_person_1.png b/src/assets/img/natural_person_1.png
new file mode 100644
index 0000000..205b584
--- /dev/null
+++ b/src/assets/img/natural_person_1.png
Binary files differ
diff --git a/src/assets/img/pdf.svg b/src/assets/img/pdf.svg
new file mode 100644
index 0000000..b38d9c1
--- /dev/null
+++ b/src/assets/img/pdf.svg
@@ -0,0 +1,6 @@
+<svg width="40" height="46" viewBox="0 0 40 46" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M40 11.6914V43.5939C40 44.383 39.3616 45.0214 38.5725 45.0214H5.51893C4.91576 45.0214 4.43323 44.5338 4.43323 43.9357V0.799196C4.43323 0.356874 4.7901 0 5.23242 0H27.5044C27.5496 0 27.5747 0.0552904 27.5446 0.0904752C27.5245 0.110581 27.5245 0.145765 27.5496 0.165871L39.9899 11.6562C39.9899 11.6662 40 11.6813 40 11.6914Z" fill="#F4F4F4"/>
+<path d="M27.5094 10.9223V0L40 11.6713H28.2584C27.8462 11.6713 27.5094 11.3345 27.5094 10.9223ZM16.2805 14.6419H5.31289C2.37748 14.6419 0 12.2644 0 9.32898C0 6.39357 2.37748 4.01608 5.31289 4.01608H16.2805C19.2159 4.01608 21.5934 6.39357 21.5934 9.32898C21.5984 12.2644 19.2159 14.6419 16.2805 14.6419Z" fill="#E52020"/>
+<path d="M18.9294 35.1447C17.8839 35.1447 17.0445 34.833 16.4313 34.2198C15.4712 33.2598 15.4662 31.9026 15.4662 31.772C15.4813 30.646 15.8281 29.7715 16.5066 29.1633C17.4767 28.2937 18.7736 28.3339 19.0249 28.349H23.8502C24.946 28.349 25.7904 28.0374 26.3584 27.4241C26.8861 26.8511 27.1023 26.0972 27.1928 25.5644C27.2883 24.9813 27.2581 24.534 27.2581 24.5289V24.4686C27.2581 23.398 26.9264 22.5938 26.2428 22.0157C25.2878 21.2015 23.81 20.9753 22.7343 20.925C22.101 20.8949 21.5381 20.925 21.141 20.9602V26.6249H19.7436V19.7438L20.3317 19.6483C20.5127 19.6182 24.7901 18.9446 27.1475 20.9501C28.1427 21.7946 28.6504 22.9708 28.6554 24.4435C28.6755 24.7451 28.756 26.8863 27.3938 28.3691C26.5544 29.2839 25.3631 29.7463 23.8603 29.7463H18.9696L18.9444 29.7413C18.8942 29.7363 18.0196 29.686 17.4416 30.2088C17.0746 30.5455 16.8836 31.0733 16.8736 31.787V31.7921C16.8736 31.8423 16.8836 32.6918 17.4365 33.2346C17.7934 33.5865 18.3312 33.7574 19.0299 33.7423H19.5325L19.5074 31.6463L20.9047 31.6312L20.95 35.1396H19.05C19.0048 35.1447 18.9646 35.1447 18.9294 35.1447Z" fill="#E82B29"/>
+<path d="M7.72556 7.46952C7.45414 7.23328 7.07213 7.11768 6.5896 7.11768H5.27771V11.5409H6.02664V9.96261H6.47399C6.94144 9.97769 7.34356 9.84701 7.65519 9.57558C7.97185 9.29913 8.13773 8.93723 8.13773 8.49491C8.14275 8.05258 8.00201 7.71079 7.72556 7.46952ZM6.03167 7.79624H6.4941C7.09224 7.79624 7.36869 8.02243 7.36869 8.50999C7.36869 8.7613 7.29329 8.94728 7.1425 9.07797C6.98668 9.20865 6.75044 9.27902 6.44383 9.27902H6.0367V7.79624H6.03167ZM12.1689 7.70074C11.7215 7.3137 11.1586 7.11768 10.4901 7.11768H9.17316V11.5409H10.4448C11.1435 11.5409 11.7215 11.3348 12.1689 10.9227C12.6162 10.5105 12.8424 9.95758 12.8424 9.27902C12.8475 8.62057 12.6213 8.09279 12.1689 7.70074ZM9.92712 7.80126H10.47C10.9525 7.80126 11.3446 7.92692 11.6361 8.17322C11.9226 8.41951 12.0684 8.79146 12.0684 9.28405C12.0684 9.78166 11.9276 10.1687 11.6461 10.4401C11.3647 10.7115 10.9626 10.8523 10.4499 10.8523H9.93215V7.80126H9.92712ZM16.3157 7.80126V7.11768H13.9231V11.5359H14.672V9.69621H16.195V9.01262H14.672V7.80126H16.3157Z" fill="white"/>
+</svg>
diff --git a/src/assets/img/person1.png b/src/assets/img/person1.png
new file mode 100644
index 0000000..d05cadf
--- /dev/null
+++ b/src/assets/img/person1.png
Binary files differ
diff --git a/src/assets/img/person2.png b/src/assets/img/person2.png
new file mode 100644
index 0000000..645f063
--- /dev/null
+++ b/src/assets/img/person2.png
Binary files differ
diff --git a/src/assets/img/person_edit.png b/src/assets/img/person_edit.png
new file mode 100644
index 0000000..1fb70e8
--- /dev/null
+++ b/src/assets/img/person_edit.png
Binary files differ
diff --git a/src/assets/img/person_file.png b/src/assets/img/person_file.png
new file mode 100644
index 0000000..b616dab
--- /dev/null
+++ b/src/assets/img/person_file.png
Binary files differ
diff --git a/src/assets/img/phone.png b/src/assets/img/phone.png
new file mode 100644
index 0000000..164898b
--- /dev/null
+++ b/src/assets/img/phone.png
Binary files differ
diff --git a/src/assets/img/plaint.png b/src/assets/img/plaint.png
new file mode 100644
index 0000000..310603a
--- /dev/null
+++ b/src/assets/img/plaint.png
Binary files differ
diff --git a/src/assets/img/preview_1.png b/src/assets/img/preview_1.png
new file mode 100644
index 0000000..3b6995a
--- /dev/null
+++ b/src/assets/img/preview_1.png
Binary files differ
diff --git a/src/assets/img/preview_2.png b/src/assets/img/preview_2.png
new file mode 100644
index 0000000..8c36434
--- /dev/null
+++ b/src/assets/img/preview_2.png
Binary files differ
diff --git a/src/assets/img/principalAdd.png b/src/assets/img/principalAdd.png
new file mode 100644
index 0000000..0100d92
--- /dev/null
+++ b/src/assets/img/principalAdd.png
Binary files differ
diff --git a/src/assets/img/principalDetail.png b/src/assets/img/principalDetail.png
new file mode 100644
index 0000000..98865fb
--- /dev/null
+++ b/src/assets/img/principalDetail.png
Binary files differ
diff --git a/src/assets/img/qianChu.png b/src/assets/img/qianChu.png
new file mode 100644
index 0000000..2ab85ee
--- /dev/null
+++ b/src/assets/img/qianChu.png
Binary files differ
diff --git a/src/assets/img/qrCode.png b/src/assets/img/qrCode.png
new file mode 100644
index 0000000..a8ae1da
--- /dev/null
+++ b/src/assets/img/qrCode.png
Binary files differ
diff --git a/src/assets/img/questionMark.png b/src/assets/img/questionMark.png
new file mode 100644
index 0000000..c4f72ec
--- /dev/null
+++ b/src/assets/img/questionMark.png
Binary files differ
diff --git a/src/assets/img/questionMark_blue.png b/src/assets/img/questionMark_blue.png
new file mode 100644
index 0000000..1de3c46
--- /dev/null
+++ b/src/assets/img/questionMark_blue.png
Binary files differ
diff --git a/src/assets/img/railwayOrgAdd_1.png b/src/assets/img/railwayOrgAdd_1.png
new file mode 100644
index 0000000..0100d92
--- /dev/null
+++ b/src/assets/img/railwayOrgAdd_1.png
Binary files differ
diff --git a/src/assets/img/railwayOrgAdd_2.png b/src/assets/img/railwayOrgAdd_2.png
new file mode 100644
index 0000000..847416b
--- /dev/null
+++ b/src/assets/img/railwayOrgAdd_2.png
Binary files differ
diff --git a/src/assets/img/remove_1.png b/src/assets/img/remove_1.png
new file mode 100644
index 0000000..5498f4e
--- /dev/null
+++ b/src/assets/img/remove_1.png
Binary files differ
diff --git a/src/assets/img/repeat_1.png b/src/assets/img/repeat_1.png
new file mode 100644
index 0000000..4b62028
--- /dev/null
+++ b/src/assets/img/repeat_1.png
Binary files differ
diff --git a/src/assets/img/return_1.png b/src/assets/img/return_1.png
new file mode 100644
index 0000000..37bb6a3
--- /dev/null
+++ b/src/assets/img/return_1.png
Binary files differ
diff --git a/src/assets/img/riskMask.png b/src/assets/img/riskMask.png
new file mode 100644
index 0000000..bd03766
--- /dev/null
+++ b/src/assets/img/riskMask.png
Binary files differ
diff --git a/src/assets/img/room-bg.png b/src/assets/img/room-bg.png
new file mode 100644
index 0000000..cc48a1c
--- /dev/null
+++ b/src/assets/img/room-bg.png
Binary files differ
diff --git a/src/assets/img/roomForm.png b/src/assets/img/roomForm.png
new file mode 100644
index 0000000..eed00ea
--- /dev/null
+++ b/src/assets/img/roomForm.png
Binary files differ
diff --git a/src/assets/img/roomForm_1.png b/src/assets/img/roomForm_1.png
new file mode 100644
index 0000000..987bd4f
--- /dev/null
+++ b/src/assets/img/roomForm_1.png
Binary files differ
diff --git a/src/assets/img/roomForm_2.png b/src/assets/img/roomForm_2.png
new file mode 100644
index 0000000..711f6a8
--- /dev/null
+++ b/src/assets/img/roomForm_2.png
Binary files differ
diff --git a/src/assets/img/roomList.png b/src/assets/img/roomList.png
new file mode 100644
index 0000000..ca25eb5
--- /dev/null
+++ b/src/assets/img/roomList.png
Binary files differ
diff --git a/src/assets/img/satellite_map.png b/src/assets/img/satellite_map.png
new file mode 100644
index 0000000..9b96be9
--- /dev/null
+++ b/src/assets/img/satellite_map.png
Binary files differ
diff --git a/src/assets/img/seal.png b/src/assets/img/seal.png
new file mode 100644
index 0000000..41833df
--- /dev/null
+++ b/src/assets/img/seal.png
Binary files differ
diff --git a/src/assets/img/secPage_1.png b/src/assets/img/secPage_1.png
new file mode 100644
index 0000000..62e71e6
--- /dev/null
+++ b/src/assets/img/secPage_1.png
Binary files differ
diff --git a/src/assets/img/select_null.png b/src/assets/img/select_null.png
new file mode 100644
index 0000000..ab3c748
--- /dev/null
+++ b/src/assets/img/select_null.png
Binary files differ
diff --git a/src/assets/img/skinInput.png b/src/assets/img/skinInput.png
new file mode 100644
index 0000000..d4935b2
--- /dev/null
+++ b/src/assets/img/skinInput.png
Binary files differ
diff --git a/src/assets/img/sqjl_1.png b/src/assets/img/sqjl_1.png
new file mode 100644
index 0000000..8cfddcf
--- /dev/null
+++ b/src/assets/img/sqjl_1.png
Binary files differ
diff --git a/src/assets/img/sqjl_2.png b/src/assets/img/sqjl_2.png
new file mode 100644
index 0000000..d098a1a
--- /dev/null
+++ b/src/assets/img/sqjl_2.png
Binary files differ
diff --git a/src/assets/img/sqjl_3.png b/src/assets/img/sqjl_3.png
new file mode 100644
index 0000000..796b7c6
--- /dev/null
+++ b/src/assets/img/sqjl_3.png
Binary files differ
diff --git a/src/assets/img/suceess.png b/src/assets/img/suceess.png
new file mode 100644
index 0000000..16acceb
--- /dev/null
+++ b/src/assets/img/suceess.png
Binary files differ
diff --git a/src/assets/img/surveyGrid_img_1.png b/src/assets/img/surveyGrid_img_1.png
new file mode 100644
index 0000000..57d1408
--- /dev/null
+++ b/src/assets/img/surveyGrid_img_1.png
Binary files differ
diff --git a/src/assets/img/sxbl_1.png b/src/assets/img/sxbl_1.png
new file mode 100644
index 0000000..572c940
--- /dev/null
+++ b/src/assets/img/sxbl_1.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_1.png b/src/assets/img/tabBar_img_1.png
new file mode 100644
index 0000000..c1b2d14
--- /dev/null
+++ b/src/assets/img/tabBar_img_1.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_10.png b/src/assets/img/tabBar_img_10.png
new file mode 100644
index 0000000..184a86d
--- /dev/null
+++ b/src/assets/img/tabBar_img_10.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_11.png b/src/assets/img/tabBar_img_11.png
new file mode 100644
index 0000000..dcb06ef
--- /dev/null
+++ b/src/assets/img/tabBar_img_11.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_2.png b/src/assets/img/tabBar_img_2.png
new file mode 100644
index 0000000..68f0e21
--- /dev/null
+++ b/src/assets/img/tabBar_img_2.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_3.png b/src/assets/img/tabBar_img_3.png
new file mode 100644
index 0000000..6cc5aff
--- /dev/null
+++ b/src/assets/img/tabBar_img_3.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_4.png b/src/assets/img/tabBar_img_4.png
new file mode 100644
index 0000000..639f4f2
--- /dev/null
+++ b/src/assets/img/tabBar_img_4.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_5.png b/src/assets/img/tabBar_img_5.png
new file mode 100644
index 0000000..8fe9e76
--- /dev/null
+++ b/src/assets/img/tabBar_img_5.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_6.png b/src/assets/img/tabBar_img_6.png
new file mode 100644
index 0000000..ba8bfd9
--- /dev/null
+++ b/src/assets/img/tabBar_img_6.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_7.png b/src/assets/img/tabBar_img_7.png
new file mode 100644
index 0000000..7033921
--- /dev/null
+++ b/src/assets/img/tabBar_img_7.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_8.png b/src/assets/img/tabBar_img_8.png
new file mode 100644
index 0000000..0ed23af
--- /dev/null
+++ b/src/assets/img/tabBar_img_8.png
Binary files differ
diff --git a/src/assets/img/tabBar_img_9.png b/src/assets/img/tabBar_img_9.png
new file mode 100644
index 0000000..a541dcc
--- /dev/null
+++ b/src/assets/img/tabBar_img_9.png
Binary files differ
diff --git a/src/assets/img/taskHandle_img_1.png b/src/assets/img/taskHandle_img_1.png
new file mode 100644
index 0000000..4261269
--- /dev/null
+++ b/src/assets/img/taskHandle_img_1.png
Binary files differ
diff --git a/src/assets/img/task_img_1.png b/src/assets/img/task_img_1.png
new file mode 100644
index 0000000..68f0e21
--- /dev/null
+++ b/src/assets/img/task_img_1.png
Binary files differ
diff --git a/src/assets/img/task_img_2.png b/src/assets/img/task_img_2.png
new file mode 100644
index 0000000..299e39f
--- /dev/null
+++ b/src/assets/img/task_img_2.png
Binary files differ
diff --git a/src/assets/img/task_img_3.png b/src/assets/img/task_img_3.png
new file mode 100644
index 0000000..00d8f6b
--- /dev/null
+++ b/src/assets/img/task_img_3.png
Binary files differ
diff --git a/src/assets/img/task_tag_1.png b/src/assets/img/task_tag_1.png
new file mode 100644
index 0000000..2bc62d1
--- /dev/null
+++ b/src/assets/img/task_tag_1.png
Binary files differ
diff --git a/src/assets/img/task_tag_2.png b/src/assets/img/task_tag_2.png
new file mode 100644
index 0000000..2c99347
--- /dev/null
+++ b/src/assets/img/task_tag_2.png
Binary files differ
diff --git a/src/assets/img/task_tag_3.png b/src/assets/img/task_tag_3.png
new file mode 100644
index 0000000..c57efab
--- /dev/null
+++ b/src/assets/img/task_tag_3.png
Binary files differ
diff --git a/src/assets/img/unincorporated_org_0.png b/src/assets/img/unincorporated_org_0.png
new file mode 100644
index 0000000..4e0713f
--- /dev/null
+++ b/src/assets/img/unincorporated_org_0.png
Binary files differ
diff --git a/src/assets/img/unincorporated_org_1.png b/src/assets/img/unincorporated_org_1.png
new file mode 100644
index 0000000..169dbb6
--- /dev/null
+++ b/src/assets/img/unincorporated_org_1.png
Binary files differ
diff --git a/src/assets/img/upLoadFile.png b/src/assets/img/upLoadFile.png
new file mode 100644
index 0000000..fc7deb4
--- /dev/null
+++ b/src/assets/img/upLoadFile.png
Binary files differ
diff --git a/src/assets/img/upOneLevel.png b/src/assets/img/upOneLevel.png
new file mode 100644
index 0000000..51ee867
--- /dev/null
+++ b/src/assets/img/upOneLevel.png
Binary files differ
diff --git a/src/assets/img/uploadButton.png b/src/assets/img/uploadButton.png
new file mode 100644
index 0000000..57247e9
--- /dev/null
+++ b/src/assets/img/uploadButton.png
Binary files differ
diff --git a/src/assets/img/visitHistory_img_1.png b/src/assets/img/visitHistory_img_1.png
new file mode 100644
index 0000000..6d10244
--- /dev/null
+++ b/src/assets/img/visitHistory_img_1.png
Binary files differ
diff --git a/src/assets/img/visit_1.png b/src/assets/img/visit_1.png
new file mode 100644
index 0000000..286407b
--- /dev/null
+++ b/src/assets/img/visit_1.png
Binary files differ
diff --git a/src/assets/img/visit_2.png b/src/assets/img/visit_2.png
new file mode 100644
index 0000000..3b0141d
--- /dev/null
+++ b/src/assets/img/visit_2.png
Binary files differ
diff --git a/src/assets/img/visit_3.png b/src/assets/img/visit_3.png
new file mode 100644
index 0000000..dbfb2e7
--- /dev/null
+++ b/src/assets/img/visit_3.png
Binary files differ
diff --git a/src/assets/img/visit_4.png b/src/assets/img/visit_4.png
new file mode 100644
index 0000000..2998789
--- /dev/null
+++ b/src/assets/img/visit_4.png
Binary files differ
diff --git a/src/assets/img/word.png b/src/assets/img/word.png
new file mode 100644
index 0000000..9f3e5bb
--- /dev/null
+++ b/src/assets/img/word.png
Binary files differ
diff --git a/src/assets/img/workLog_img_1.png b/src/assets/img/workLog_img_1.png
new file mode 100644
index 0000000..6dcd557
--- /dev/null
+++ b/src/assets/img/workLog_img_1.png
Binary files differ
diff --git a/src/assets/img/workLog_img_2.png b/src/assets/img/workLog_img_2.png
new file mode 100644
index 0000000..9236eae
--- /dev/null
+++ b/src/assets/img/workLog_img_2.png
Binary files differ
diff --git a/src/assets/img/workStatistics_1.png b/src/assets/img/workStatistics_1.png
new file mode 100644
index 0000000..def53d0
--- /dev/null
+++ b/src/assets/img/workStatistics_1.png
Binary files differ
diff --git a/src/assets/img/workStatistics_2.png b/src/assets/img/workStatistics_2.png
new file mode 100644
index 0000000..dc8634f
--- /dev/null
+++ b/src/assets/img/workStatistics_2.png
Binary files differ
diff --git a/src/assets/img/workStatistics_3.png b/src/assets/img/workStatistics_3.png
new file mode 100644
index 0000000..57fb199
--- /dev/null
+++ b/src/assets/img/workStatistics_3.png
Binary files differ
diff --git a/src/assets/img/workStatistics_4.png b/src/assets/img/workStatistics_4.png
new file mode 100644
index 0000000..48a5197
--- /dev/null
+++ b/src/assets/img/workStatistics_4.png
Binary files differ
diff --git a/src/assets/img/workStatistics_5.png b/src/assets/img/workStatistics_5.png
new file mode 100644
index 0000000..ba51226
--- /dev/null
+++ b/src/assets/img/workStatistics_5.png
Binary files differ
diff --git a/src/assets/img/zxperson1.png b/src/assets/img/zxperson1.png
new file mode 100644
index 0000000..b1b206e
--- /dev/null
+++ b/src/assets/img/zxperson1.png
Binary files differ
diff --git a/src/assets/img/zxperson2.png b/src/assets/img/zxperson2.png
new file mode 100644
index 0000000..e2b5278
--- /dev/null
+++ b/src/assets/img/zxperson2.png
Binary files differ
diff --git a/src/assets/img/zxperson3.png b/src/assets/img/zxperson3.png
new file mode 100644
index 0000000..5788395
--- /dev/null
+++ b/src/assets/img/zxperson3.png
Binary files differ
diff --git a/src/assets/img/zxperson4.png b/src/assets/img/zxperson4.png
new file mode 100644
index 0000000..8a683d4
--- /dev/null
+++ b/src/assets/img/zxperson4.png
Binary files differ
diff --git a/src/components/Calendar/index.jsx b/src/components/Calendar/index.jsx
new file mode 100644
index 0000000..75e343c
--- /dev/null
+++ b/src/components/Calendar/index.jsx
@@ -0,0 +1,141 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-29 15:35:35
+ * @LastEditTime: 2022-09-08 16:55:04
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 日历
+ */
+import React, { useEffect, useMemo, useState } from 'react';
+import { LeftArrow2Outlined, RightArrow2Outlined } from 'dd-icons';
+import { moment, myTimeFormat } from '../../utils/utility';
+import './index.less';
+
+/**
+ * time: date | string; // 当前月份时间
+ * activeTime: date | string; // 当前选择日期
+ * onClickDate: func; // 点击日期回调事件
+ * onChangeMonth: func, // 切换月份回调, 返回月份date格式
+ */
+const Calendar = ({ time = new Date(), activeTime, onClickDate, onChangeMonth }) => {
+ // 当前选择月份
+ const [nowTime, setNowTime] = useState(myTimeFormat(time, 'YYYY-MM'));
+
+ // 当前点击日期
+ const [activeDate, setActiveDate] = useState({});
+
+ // 当前月份的天数
+ const monthDays = useMemo(() => {
+ let monthDay = [];
+ let thisMonthDays = moment(nowTime).daysInMonth();
+ for (let i = 1; i <= thisMonthDays; i++) {
+ let key = `${nowTime}-${i}`;
+ if (myTimeFormat(`${nowTime}-${i}`, 'YYYY-MM-DD') === myTimeFormat(new Date(), 'YYYY-MM-DD')) {
+ key = 'today';
+ }
+ monthDay.push({ value: 'thisMonth', label: i, key });
+ }
+ // 当前月份第一天星期几
+ let firstDay = new Date(nowTime).getDay();
+ // 上一月,下一个月
+ let beforeMonth = moment(nowTime).add(-1, 'month'),
+ lastMonth = moment(nowTime).add(1, 'month');
+ // 上一个月的天数
+ let beforeMonthDays = moment(beforeMonth).daysInMonth();
+ // 计算上一个月有多少天在今月展示
+ let beforeDay = [];
+ for (let i = beforeMonthDays; i > beforeMonthDays - firstDay; i--) {
+ let key = myTimeFormat(beforeMonth, `YYYY-MM-${i}`);
+ if (myTimeFormat(beforeMonth, `YYYY-MM-${i}`) === myTimeFormat(new Date(), 'YYYY-MM-D')) {
+ key = 'today';
+ }
+ beforeDay = [{ value: 'beforeMonth', label: i, key }, ...beforeDay];
+ }
+ // 计算下一个月有多少天在今月展示
+ let lastDay = [];
+ for (let i = 1; i <= 42 - beforeDay.length - monthDay.length; i++) {
+ let key = myTimeFormat(lastMonth, `YYYY-MM-${i}`);
+ if (myTimeFormat(lastMonth, `YYYY-MM-${i}`) === myTimeFormat(new Date(), 'YYYY-MM-D')) {
+ key = 'today';
+ }
+ lastDay.push({ value: 'lastMonth', label: i, key });
+ }
+ return [...beforeDay, ...monthDay, ...lastDay];
+ }, [nowTime]);
+
+ // 点击上一月，下一月
+ function handleChangeMonth(key) {
+ let time = '';
+ if (key === 'before') {
+ time = moment(nowTime).add(-1, 'month');
+ } else {
+ time = moment(nowTime).add(1, 'month');
+ }
+ setNowTime(myTimeFormat(time, 'YYYY-MM'));
+ !!onChangeMonth && onChangeMonth(key, time);
+ }
+
+ // 点击日期
+ function handleClickDate(item) {
+
+ if (item.value === 'beforeMonth') {
+ handleChangeMonth('before');
+ }
+ if (item.value === 'lastMonth') {
+ handleChangeMonth('next');
+ }
+ setActiveDate(item);
+ !!onClickDate && onClickDate(item);
+ }
+
+ // 传入当前选择日期设置
+ let date = activeTime ? myTimeFormat(activeTime, 'YYYY-MM-DD') : '';
+ useEffect(() => {
+ if (date) {
+ let key = date === myTimeFormat(new Date(), 'YYYY-MM-DD') ? 'today' : date;
+ setActiveDate({ key });
+ }
+ }, [date]);
+
+ // 日期
+ const dateHeader = [{ label: '日' }, { label: '一' }, { label: '二' }, { label: '三' }, { label: '四' }, { label: '五' }, { label: '六' }];
+
+ return (
+ <div className="calendar">
+ <div className="calendar-header">
+ <LeftArrow2Outlined onClick={() => handleChangeMonth('before')} />
+ <div className="calendar-header-title">{myTimeFormat(nowTime, 'YYYY年M月')}</div>
+ <RightArrow2Outlined onClick={() => handleChangeMonth('next')} />
+ </div>
+ <div className="calendar-main">
+ <div className="calendar-main-header">
+ {dateHeader.map((x, t) => (
+ <div className="calendar-main-header-item" key={t}>
+ {x.label}
+ </div>
+ ))}
+ </div>
+ <div className="calendar-main-content">
+ {monthDays.map((x, t) => (
+ <div onClick={() => handleClickDate(x)} className="calendar-main-content-item" key={t}>
+ {x.key === 'today' ? (
+ <div className={`calendar-main-content-itemBox calendar-today ${x.key === activeDate.key ? 'calendar-hover' : ''}`}>今</div>
+ ) : (
+ <div
+ className={`calendar-main-content-itemBox ${x.value !== 'thisMonth' ? 'calendar-main-content-itemSubtitle' : ''} ${
+ x.key === activeDate.key ? 'calendar-hover' : ''
+ }`}
+ >
+ {x.label}
+ </div>
+ )}
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+export default Calendar;
diff --git a/src/components/Calendar/index.less b/src/components/Calendar/index.less
new file mode 100644
index 0000000..c2ea82e
--- /dev/null
+++ b/src/components/Calendar/index.less
@@ -0,0 +1,62 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.calendar {
+ &-header {
+ display: flex;
+ align-items: center;
+ padding-bottom: 12px;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ }
+ }
+
+ &-main {
+ &-header {
+ display: flex;
+ align-items: center;
+ color: @common_level2_base_color;
+ padding: 12px 0;
+ border-top: 1px solid @common_line_light_color;
+
+ &-item {
+ flex: 0 0 14.2%;
+ text-align: center;
+ }
+ }
+
+ &-content {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+
+ &-item {
+ flex: 0 0 14.2%;
+ }
+
+ &-itemSubtitle {
+ color: rgba(23, 26, 29, 0.4);
+ }
+
+ &-itemBox {
+ height: 36px;
+ max-width: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ border-radius: 50%;
+ }
+ }
+ }
+
+ &-today {
+ background-color: #f2f2f6;
+ color: @theme_primary1_color;
+ }
+
+ &-hover {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ }
+}
diff --git a/src/components/CalendarMonth/index.jsx b/src/components/CalendarMonth/index.jsx
new file mode 100644
index 0000000..629cecd
--- /dev/null
+++ b/src/components/CalendarMonth/index.jsx
@@ -0,0 +1,184 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-16 08:50:50
+ * @LastEditTime: 2023-08-01 17:11:39
+ * @LastEditors: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git
+ * @Version: 1.0.0
+ * @Description: 日历选择器（月份）
+ */
+import React, { useEffect, useMemo, useState } from 'react';
+import { LeftArrow2Outlined, RightArrow2Outlined, CloseBoldOutlined } from 'dd-icons';
+import { moment, myTimeFormat } from '../../utils/utility';
+import './index.less';
+
+/**
+ * 仅仅只能选择月份的日历组件
+ * time: date | string; // 当前月份时间
+ * activeTime: date | string; // 当前选择日期
+ * onClickDate: func; // 点击日期回调事件
+ * onChangeMonth: func, // 切换月份回调, 返回月份date格式
+ * CalendaronClick：func //日历取消确定操作
+ */
+const CalendarMonth = ({ time = new Date(), activeTime, onClickDate, onChangeMonth, CalendaronClick }) => {
+ // 当前选择月份
+ const [nowTime, setNowTime] = useState(myTimeFormat(time, 'YYYY-MM'));
+
+ const [startX, setStartX] = useState();
+ const [endX, setEndX] = useState();
+
+
+ // 当前点击日期
+ const [activeDate, setActiveDate] = useState([]);
+
+ // 当前月份的天数
+ const monthDays = useMemo(() => {
+ let monthDay = [];
+ let thisMonthDays = moment(nowTime).daysInMonth();
+ for (let i = 1; i <= thisMonthDays; i++) {
+ let key = `${nowTime}-${i}`;
+ monthDay.push({ value: 'thisMonth', label: i, key: moment(key).format('YYYY-MM-DD') });
+ }
+ // 当前月份第一天星期几
+ let firstDay = new Date(nowTime).getDay();
+ // 上一月,下一个月
+ let beforeMonth = moment(nowTime).add(-1, 'month'),
+ lastMonth = moment(nowTime).add(1, 'month');
+ // 上一个月的天数
+ let beforeMonthDays = moment(beforeMonth).daysInMonth();
+ // 计算上一个月有多少天在今月展示
+ let beforeDay = [];
+ for (let i = beforeMonthDays; i > beforeMonthDays - firstDay; i--) {
+ let key = myTimeFormat(beforeMonth, `YYYY-MM-${i}`);
+ beforeDay = [{ value: 'beforeMonth', label: i, key: moment(key).format('YYYY-MM-DD') }, ...beforeDay];
+ }
+ // 计算下一个月有多少天在今月展示
+ let lastDay = [];
+ for (let i = 1; i <= 42 - beforeDay.length - monthDay.length; i++) {
+ let key = myTimeFormat(lastMonth, `YYYY-MM-${i}`);
+ lastDay.push({ value: 'lastMonth', label: i, key: moment(key).format('YYYY-MM-DD') });
+ }
+ return [...beforeDay, ...monthDay, ...lastDay];
+ }, [nowTime]);
+
+ // 点击上一月，下一月
+ function handleChangeMonth(key) {
+ let time = '';
+ if (key === 'before') {
+ time = moment(nowTime).add(-1, 'month');
+ } else {
+ time = moment(nowTime).add(1, 'month');
+ }
+ setNowTime(myTimeFormat(time, 'YYYY-MM'));
+ !!onChangeMonth && onChangeMonth(key, time);
+ }
+
+ // 点击日期 activeDate [开始时间， 结束时间]
+ function handleClickDate(item) {
+ const list = activeDate.concat(item);
+ if (list.length > 2) {
+ setActiveDate([item]);
+ } else {
+ if (list.length === 2) {
+ let newList = rangeTime(list);
+ setActiveDate(newList);
+ !!onClickDate && onClickDate(newList);
+ } else {
+ setActiveDate(list);
+ }
+ }
+ }
+
+ // 开始时间，结束时间排序
+ function rangeTime(list) {
+ return list[0].key > list[1].key ? [list[1], list[0]] : [list[0], list[1]];
+ }
+
+ // 传入当前选择日期设置
+ let date = activeTime ? myTimeFormat(activeTime, 'YYYY-MM-DD') : '';
+ useEffect(() => { }, [date]);
+
+ // 日期
+ const dateHeader = [{ label: '日' }, { label: '一' }, { label: '二' }, { label: '三' }, { label: '四' }, { label: '五' }, { label: '六' }];
+
+ return (
+ <div className="CalendarRange">
+ <div className="CalendarRange-header">
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <CloseBoldOutlined onClick={() => CalendaronClick('month', 'onClose')} />
+ <LeftArrow2Outlined style={{ paddingLeft: '12px' }} onClick={() => handleChangeMonth('before')} />
+ </div>
+ <div className="CalendarRange-header-title">
+ {activeDate.length == 0 && myTimeFormat(nowTime, 'YYYY年M月')}
+ {activeDate.length == 1 && myTimeFormat(activeDate[0].key, 'YYYY年M月D日')}
+ {activeDate.length == 2 && `${myTimeFormat(activeDate[0].key, 'YYYY年M月D日')}-${myTimeFormat(activeDate[1].key, 'YYYY年M月D日')}`}
+ </div>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <RightArrow2Outlined onClick={() => handleChangeMonth('next')} />
+ <div onClick={() => CalendaronClick('month', 'submit')} style={{ paddingLeft: '12px' }} className="CalendarRange-title-color">
+ 确定
+ </div>
+ </div>
+ </div>
+ <div className="CalendarRange-main CalendarRange-main-month" >
+ <div className="CalendarRange-main-header">
+ {dateHeader.map((x, t) => (
+ <div className="CalendarRange-main-header-item" key={t}>
+ {x.label}
+ </div>
+ ))}
+ </div>
+ <div className="CalendarRange-main-content">
+ {monthDays.map((x, t) => (
+ <div className="CalendarRange-main-content-item" key={t}>
+ <div className="CalendarRange-main-content-item-o">
+ {
+ <div
+ className={`CalendarRange-main-content-itemBox
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key
+ ? x.key >= activeDate[0].key && x.key <= activeDate[1].key
+ ? 'CalendarRange-hover'
+ : ''
+ : ''
+ }
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key ? x.key === activeDate[0].key && 'CalendarRange-hover-l' : ''}
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key ? x.key === activeDate[1].key && 'CalendarRange-hover-r' : ''}
+ ${activeDate.length === 2 && x.key === activeDate[1] && activeDate[0] === activeDate[1].key && 'CalendarRange-hover-all'}
+ `}
+ >
+ {x.key === myTimeFormat(new Date(), 'YYYY-MM-DD') && (
+ <div
+ className={`CalendarRange-main-content-itemBox CalendarRange-today
+ }`}
+ >
+ 今
+ </div>
+ )}
+ {x.key !== myTimeFormat(new Date(), 'YYYY-MM-DD') && (
+ <div
+ className={`CalendarRange-main-content-itemBox-l
+ ${activeDate.length === 1 && (x.key === activeDate[0].key ? 'CalendarRange-hover CalendarRange-hover-all' : '')}
+ ${activeDate.length === 2 && activeDate[0].key === activeDate[1].key
+ ? x.key >= activeDate[0].key && x.key <= activeDate[1].key
+ ? 'CalendarRange-hover CalendarRange-hover-all'
+ : ''
+ : ''
+ }
+ `}
+ >
+ {x.label}
+ </div>
+ )}
+ </div>
+ }
+ </div>
+ </div>
+ ))}
+ </div>
+ <div className='CalendarRange-main-month-div'>{activeDate.length == 0 && myTimeFormat(nowTime, 'M月')}</div>
+ </div>
+ </div>
+ );
+};
+
+export default CalendarMonth;
diff --git a/src/components/CalendarMonth/index.less b/src/components/CalendarMonth/index.less
new file mode 100644
index 0000000..7a3ddeb
--- /dev/null
+++ b/src/components/CalendarMonth/index.less
@@ -0,0 +1,133 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.CalendarRange {
+ &-header {
+ display: flex;
+ align-items: center;
+ padding: 12px;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ }
+ }
+ &-title-color {
+ color: @theme_primary1_color;
+ font-size: 14px;
+ }
+
+ &-main {
+ &-header {
+ display: flex;
+ align-items: center;
+ color: @common_level2_base_color;
+ padding: 12px 0;
+ border-top: 1px solid @common_line_light_color;
+
+ &-item {
+ flex: 0 0 14.2%;
+ text-align: center;
+ }
+ }
+
+ &-content {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+
+ &-item {
+ flex: 0 0 14.2%;
+ &-o {
+ padding: 3px 0;
+ }
+ }
+
+ &-itemSubtitle {
+ color: rgba(23, 26, 29, 0.4);
+ }
+
+ &-itemBox {
+ height: 36px;
+ // max-width: 36px;
+ // line-height: 36px;
+ // margin: auto;
+ // text-align: center;
+ }
+
+ &-itemBox-l {
+ height: 36px;
+ max-width: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ }
+ }
+
+ &-month {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ opacity: 0.24;
+ &-new {
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ }
+ &-div {
+ position: absolute;
+ font-size: 32px;
+ line-height: 40px;
+ color: #171a1d;
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ &-new {
+ position: absolute;
+ font-size: 64px;
+ line-height: 40px;
+ color: #171a1d;
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ opacity: 0.24;
+ z-index: -1;
+ }
+ }
+ }
+ }
+
+ &-today {
+ background-color: #f2f2f6;
+ color: @theme_primary1_color;
+ height: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ max-width: 36px;
+ border-radius: 50%;
+ }
+
+ &-hover-new {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ border-radius: 50%;
+ }
+
+ &-hover {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ &-l {
+ border-radius: 22px 0 0 22px;
+ }
+ &-r {
+ border-radius: 0 22px 22px 0;
+ }
+ &-all {
+ border-radius: 50%;
+ }
+ }
+}
diff --git a/src/components/CalendarRangeDay/index.jsx b/src/components/CalendarRangeDay/index.jsx
new file mode 100644
index 0000000..4971426
--- /dev/null
+++ b/src/components/CalendarRangeDay/index.jsx
@@ -0,0 +1,168 @@
+import React, { useEffect, useMemo, useState } from 'react';
+import { LeftArrow2Outlined, RightArrow2Outlined, CloseBoldOutlined } from 'dd-icons';
+import { moment, myTimeFormat, getweekTime } from '../../utils/utility';
+import './index.less';
+
+/**
+ * time: date | string; // 当前月份时间
+ * activeTime: date | string; // 当前选择日期
+ * onClickDate: func; // 点击日期回调事件
+ * onChangeMonth: func, // 切换月份回调, 返回月份date格式
+ * CalendaronClick：func //日历取消确定操作
+ */
+const CalendarRangeDay = ({ time = new Date(), activeTime, onClickDate, onChangeMonth, CalendaronClick }) => {
+ // 当前选择月份
+ const [nowTime, setNowTime] = useState(myTimeFormat(time, 'YYYY-M'));
+
+ // 当前点击日期
+ const [activeDate, setActiveDate] = useState([
+ { value: 'thisMonth', label: new Date(activeTime).getDate(), key: activeTime }]);
+
+ // 当前月份的天数
+ const monthDays = useMemo(() => {
+ let monthDay = [];
+ let thisMonthDays = moment(nowTime).daysInMonth();
+ for (let i = 1; i <= thisMonthDays; i++) {
+ let key = `${nowTime}-${i}`;
+ monthDay.push({ value: 'thisMonth', label: i, key: moment(key).format('YYYY-M-D') });
+ }
+ // 当前月份第一天星期几
+ let firstDay = new Date(nowTime).getDay();
+ // 上一月,下一个月
+ let beforeMonth = moment(nowTime).add(-1, 'month'),
+ lastMonth = moment(nowTime).add(1, 'month');
+ // 上一个月的天数
+ let beforeMonthDays = moment(beforeMonth).daysInMonth();
+ // 计算上一个月有多少天在今月展示
+ let beforeDay = [];
+ for (let i = beforeMonthDays; i > beforeMonthDays - firstDay; i--) {
+ let key = myTimeFormat(beforeMonth, `YYYY-MM-${i}`);
+ beforeDay = [{ value: 'beforeMonth', label: i, key: moment(key).format('YYYY-MM-DD') }, ...beforeDay];
+ }
+ // 计算下一个月有多少天在今月展示
+ let lastDay = [];
+ for (let i = 1; i <= 42 - beforeDay.length - monthDay.length; i++) {
+ let key = myTimeFormat(lastMonth, `YYYY-M-${i}`);
+ lastDay.push({ value: 'lastMonth', label: i, key: moment(key).format('YYYY-MM-DD') });
+ }
+ return [...beforeDay, ...monthDay, ...lastDay];
+ }, [nowTime]);
+
+ // 点击上一月，下一月
+ function handleChangeMonth(key) {
+ let time = '';
+ if (key === 'before') {
+ time = moment(nowTime).add(-1, 'month');
+ } else {
+ time = moment(nowTime).add(1, 'month');
+ }
+ setNowTime(myTimeFormat(time, 'YYYY-M'));
+ !!onChangeMonth && onChangeMonth(key, time);
+ }
+
+ // 点击日期 activeDate [开始时间， 结束时间]
+ function handleClickDate(item) {
+ const list = activeDate.concat(item);
+ setActiveDate([item]);
+ !!onClickDate && onClickDate(item)
+ }
+ // function handleClickDate(item) {
+ // const list = activeDate.concat(item);
+ // if (list.length > 2) {
+ // setActiveDate([item]);
+ // } else {
+ // if (list.length === 2) {
+ // let newList = rangeTime(list);
+ // setActiveDate(newList);
+ // !!onClickDate && onClickDate(newList);
+ // } else {
+ // setActiveDate(list);
+ // }
+ // }
+ // }
+
+ // 开始时间，结束时间排序
+ function rangeTime(list) {
+ return list[0].key > list[1].key ? [list[1], list[0]] : [list[0], list[1]];
+ }
+
+ // 传入当前选择日期设置
+ let date = activeTime ? myTimeFormat(activeTime, 'YYYY-MM-DD') : '';
+ useEffect(() => { }, [date]);
+
+ // 日期
+ const dateHeader = [{ label: '日' }, { label: '一' }, { label: '二' }, { label: '三' }, { label: '四' }, { label: '五' }, { label: '六' }];
+
+ return (
+ <div className="CalendarRange">
+ <div className="CalendarRange-header">
+ {/* <div className="CalendarRange-header-title">取消</div> */}
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <CloseBoldOutlined onClick={() => CalendaronClick('day', 'onClose')} />
+ <LeftArrow2Outlined style={{ paddingLeft: '12px' }} onClick={() => handleChangeMonth('before')} />
+ </div>
+ <div className="CalendarRange-header-title">
+ {activeDate.length > 0 && `${myTimeFormat(activeDate[0].key, 'YYYY年M月D日')} ${getweekTime(activeDate[0].key)}`}
+ </div>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <RightArrow2Outlined onClick={() => handleChangeMonth('next')} />
+ <div onClick={() => CalendaronClick('day', 'submit')} style={{ paddingLeft: '12px' }} className="CalendarRange-title-color">
+ 确定
+ </div>
+ </div>
+ {/* <div className="CalendarRange-header-title">确定</div> */}
+ </div>
+ <div className="CalendarRange-main">
+ <div className="CalendarRange-main-header">
+ {dateHeader.map((x, t) => (
+ <div className="CalendarRange-main-header-item" key={t}>
+ {x.label}
+ </div>
+ ))}
+ </div>
+ <div className="CalendarRange-main-content">
+ {monthDays.map((x, t) => (
+ <div onClick={() => handleClickDate(x)} className="CalendarRange-main-content-item" key={t}>
+ <div className="CalendarRange-main-content-item-o">
+ {
+ <div
+ className={`CalendarRange-main-content-itemBox ${x.value !== 'thisMonth' ? 'CalendarRange-main-content-itemSubtitle' : ''}
+ 'CalendarRange-hover-all'
+ `}
+ >
+ {x.key === myTimeFormat(new Date(), 'YYYY-M-D') && (
+ <div
+ className={`CalendarRange-main-content-itemBox CalendarRange-today ${x.key === activeDate[0].key ? 'CalendarRange-hover CalendarRange-hover-all' : ''}
+ }`}
+ >
+ 今
+ </div>
+ )}
+
+ {x.key !== myTimeFormat(new Date(), 'YYYY-M-D') && (
+ <div
+ className={`CalendarRange-main-content-itemBox-l
+ ${activeDate.length === 1 && (x.key === activeDate[0].key ? 'CalendarRange-hover CalendarRange-hover-all' : '')}
+ ${activeDate.length === 2 && activeDate[0].key === activeDate[1].key
+ ? x.key >= activeDate[0].key && x.key <= activeDate[1].key
+ ? 'CalendarRange-hover CalendarRange-hover-all'
+ : ''
+ : ''
+ }
+ `}
+ >
+ {x.label}
+ </div>
+ )}
+ </div>
+ }
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+export default CalendarRangeDay;
diff --git a/src/components/CalendarRangeDay/index.less b/src/components/CalendarRangeDay/index.less
new file mode 100644
index 0000000..acb1dea
--- /dev/null
+++ b/src/components/CalendarRangeDay/index.less
@@ -0,0 +1,99 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.CalendarRange {
+ &-header {
+ display: flex;
+ align-items: center;
+ padding: 14px;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ font-size: 16px;
+ line-height: 16px;
+ }
+ }
+ &-title-color {
+ color: @theme_primary1_color;
+ font-size: 16px;
+ }
+
+ &-main {
+ &-header {
+ display: flex;
+ align-items: center;
+ color: @common_level2_base_color;
+ padding: 12px 0;
+ border-top: 1px solid @common_line_light_color;
+
+ &-item {
+ flex: 0 0 14.2%;
+ text-align: center;
+ }
+ }
+
+ &-content {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+
+ &-item {
+ flex: 0 0 14.2%;
+ &-o {
+ padding: 3px 0;
+ }
+ }
+
+ &-itemSubtitle {
+ color: rgba(23, 26, 29, 0.4);
+ }
+
+ &-itemBox {
+ height: 36px;
+ // max-width: 36px;
+ // line-height: 36px;
+ // margin: auto;
+ // text-align: center;
+ }
+
+ &-itemBox-l {
+ height: 36px;
+ max-width: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ }
+ }
+ }
+
+ &-today {
+ background-color: #f2f2f6;
+ color: @theme_primary1_color;
+ height: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ max-width: 36px;
+ border-radius: 50%;
+ }
+
+ &-hover-new {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ border-radius: 50%;
+ }
+
+ &-hover {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ &-l {
+ border-radius: 22px 0 0 22px;
+ }
+ &-r {
+ border-radius: 0 22px 22px 0;
+ }
+ &-all {
+ border-radius: 50%;
+ }
+ }
+}
diff --git a/src/components/CalendarRangeTwoDay/index.jsx b/src/components/CalendarRangeTwoDay/index.jsx
new file mode 100644
index 0000000..c0bb411
--- /dev/null
+++ b/src/components/CalendarRangeTwoDay/index.jsx
@@ -0,0 +1,183 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-16 08:50:50
+ * @LastEditTime: 2023-07-07 11:32:42
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 日历选择器（月份）
+ */
+import React, { useEffect, useMemo, useState } from 'react';
+import { LeftArrow2Outlined, RightArrow2Outlined, CloseBoldOutlined } from 'dd-icons';
+import { moment, myTimeFormat } from '../../utils/utility';
+import './index.less';
+
+/**
+ * time: date | string; // 当前月份时间
+ * activeTime: date | string; // 当前选择日期
+ * onClickDate: func; // 点击日期回调事件
+ * onChangeMonth: func, // 切换月份回调, 返回月份date格式
+ * CalendaronClick：func //日历取消确定操作
+ */
+const CalendarRange = ({ time = new Date(), activeTime, onClickDate, onChangeMonth, CalendaronClick }) => {
+ // 当前选择月份
+ const [nowTime, setNowTime] = useState(myTimeFormat(time, 'YYYY-MM'));
+
+ const [startX, setStartX] = useState();
+ const [endX, setEndX] = useState();
+
+
+ // 当前点击日期
+ const [activeDate, setActiveDate] = useState([]);
+
+ // 当前月份的天数
+ const monthDays = useMemo(() => {
+ let monthDay = [];
+ let thisMonthDays = moment(nowTime).daysInMonth();
+ for (let i = 1; i <= thisMonthDays; i++) {
+ let key = `${nowTime}-${i}`;
+ monthDay.push({ value: 'thisMonth', label: i, key: moment(key).format('YYYY-MM-DD') });
+ }
+ // 当前月份第一天星期几
+ let firstDay = new Date(nowTime).getDay();
+ // 上一月,下一个月
+ let beforeMonth = moment(nowTime).add(-1, 'month'),
+ lastMonth = moment(nowTime).add(1, 'month');
+ // 上一个月的天数
+ let beforeMonthDays = moment(beforeMonth).daysInMonth();
+ // 计算上一个月有多少天在今月展示
+ let beforeDay = [];
+ for (let i = beforeMonthDays; i > beforeMonthDays - firstDay; i--) {
+ let key = myTimeFormat(beforeMonth, `YYYY-MM-${i}`);
+ beforeDay = [{ value: 'beforeMonth', label: i, key: moment(key).format('YYYY-MM-DD') }, ...beforeDay];
+ }
+ // 计算下一个月有多少天在今月展示
+ let lastDay = [];
+ for (let i = 1; i <= 42 - beforeDay.length - monthDay.length; i++) {
+ let key = myTimeFormat(lastMonth, `YYYY-MM-${i}`);
+ lastDay.push({ value: 'lastMonth', label: i, key: moment(key).format('YYYY-MM-DD') });
+ }
+ return [...beforeDay, ...monthDay, ...lastDay];
+ }, [nowTime]);
+
+ // 点击上一月，下一月
+ function handleChangeMonth(key) {
+ let time = '';
+ if (key === 'before') {
+ time = moment(nowTime).add(-1, 'month');
+ } else {
+ time = moment(nowTime).add(1, 'month');
+ }
+ setNowTime(myTimeFormat(time, 'YYYY-MM'));
+ !!onChangeMonth && onChangeMonth(key, time);
+ }
+
+ // 点击日期 activeDate [开始时间， 结束时间]
+ function handleClickDate(item) {
+ const list = activeDate.concat(item);
+ if (list.length > 2) {
+ setActiveDate([item]);
+ } else {
+ if (list.length === 2) {
+ let newList = rangeTime(list);
+ setActiveDate(newList);
+ !!onClickDate && onClickDate(newList);
+ } else {
+ setActiveDate(list);
+ }
+ }
+ }
+
+ // 开始时间，结束时间排序
+ function rangeTime(list) {
+ return list[0].key > list[1].key ? [list[1], list[0]] : [list[0], list[1]];
+ }
+
+ // 传入当前选择日期设置
+ let date = activeTime ? myTimeFormat(activeTime, 'YYYY-MM-DD') : '';
+ useEffect(() => { }, [date]);
+
+ // 日期
+ const dateHeader = [{ label: '日' }, { label: '一' }, { label: '二' }, { label: '三' }, { label: '四' }, { label: '五' }, { label: '六' }];
+
+ return (
+ <div className="CalendarRange">
+ <div className="CalendarRange-header">
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <CloseBoldOutlined onClick={() => CalendaronClick('month', 'onClose')} />
+ <LeftArrow2Outlined style={{ paddingLeft: '12px' }} onClick={() => handleChangeMonth('before')} />
+ </div>
+ <div className="CalendarRange-header-title">
+ {activeDate.length == 0 && myTimeFormat(nowTime, 'YYYY年M月')}
+ {activeDate.length == 1 && myTimeFormat(activeDate[0].key, 'YYYY年M月D日')}
+ {activeDate.length == 2 && `${myTimeFormat(activeDate[0].key, 'YYYY年M月D日')}-${myTimeFormat(activeDate[1].key, 'M月D日')}`}
+ </div>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <RightArrow2Outlined onClick={() => handleChangeMonth('next')} />
+ <div onClick={() => CalendaronClick('month', 'submit')} style={{ paddingLeft: '12px' }} className="CalendarRange-title-color">
+ 确定
+ </div>
+ </div>
+ </div>
+ <div className="CalendarRange-main CalendarRange-main-month-new" >
+ <div className="CalendarRange-main-header">
+ {dateHeader.map((x, t) => (
+ <div className="CalendarRange-main-header-item" key={t}>
+ {x.label}
+ </div>
+ ))}
+ </div>
+ <div className="CalendarRange-main-content">
+ {monthDays.map((x, t) => (
+ <div onClick={() => handleClickDate(x)} className="CalendarRange-main-content-item" key={t}>
+ <div className="CalendarRange-main-content-item-o">
+ {
+ <div
+ className={`CalendarRange-main-content-itemBox
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key
+ ? x.key >= activeDate[0].key && x.key <= activeDate[1].key
+ ? 'CalendarRange-hover'
+ : ''
+ : ''
+ }
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key ? x.key === activeDate[0].key && 'CalendarRange-hover-l' : ''}
+ ${activeDate.length === 2 && activeDate[0].key !== activeDate[1].key ? x.key === activeDate[1].key && 'CalendarRange-hover-r' : ''}
+ ${activeDate.length === 2 && x.key === activeDate[1] && activeDate[0] === activeDate[1].key && 'CalendarRange-hover-all'}
+ `}
+ >
+ {x.key === myTimeFormat(new Date(), 'YYYY-MM-DD') && (
+ <div
+ className={`CalendarRange-main-content-itemBox CalendarRange-today
+ }`}
+ >
+ 今
+ </div>
+ )}
+ {x.key !== myTimeFormat(new Date(), 'YYYY-MM-DD') && (
+ <div
+ className={`CalendarRange-main-content-itemBox-l
+ ${activeDate.length === 1 && (x.key === activeDate[0].key ? 'CalendarRange-hover CalendarRange-hover-all' : '')}
+ ${activeDate.length === 2 && activeDate[0].key === activeDate[1].key
+ ? x.key >= activeDate[0].key && x.key <= activeDate[1].key
+ ? 'CalendarRange-hover CalendarRange-hover-all'
+ : ''
+ : ''
+ }
+ `}
+ >
+ {x.label}
+ </div>
+ )}
+ </div>
+ }
+ </div>
+ </div>
+ ))}
+ </div>
+ <div className='CalendarRange-main-month-div-new'>{myTimeFormat(nowTime, 'M月')}</div>
+ </div>
+ </div>
+ );
+};
+
+export default CalendarRange;
diff --git a/src/components/CalendarRangeTwoDay/index.less b/src/components/CalendarRangeTwoDay/index.less
new file mode 100644
index 0000000..acb1dea
--- /dev/null
+++ b/src/components/CalendarRangeTwoDay/index.less
@@ -0,0 +1,99 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.CalendarRange {
+ &-header {
+ display: flex;
+ align-items: center;
+ padding: 14px;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ font-size: 16px;
+ line-height: 16px;
+ }
+ }
+ &-title-color {
+ color: @theme_primary1_color;
+ font-size: 16px;
+ }
+
+ &-main {
+ &-header {
+ display: flex;
+ align-items: center;
+ color: @common_level2_base_color;
+ padding: 12px 0;
+ border-top: 1px solid @common_line_light_color;
+
+ &-item {
+ flex: 0 0 14.2%;
+ text-align: center;
+ }
+ }
+
+ &-content {
+ display: flex;
+ align-items: center;
+ flex-wrap: wrap;
+
+ &-item {
+ flex: 0 0 14.2%;
+ &-o {
+ padding: 3px 0;
+ }
+ }
+
+ &-itemSubtitle {
+ color: rgba(23, 26, 29, 0.4);
+ }
+
+ &-itemBox {
+ height: 36px;
+ // max-width: 36px;
+ // line-height: 36px;
+ // margin: auto;
+ // text-align: center;
+ }
+
+ &-itemBox-l {
+ height: 36px;
+ max-width: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ }
+ }
+ }
+
+ &-today {
+ background-color: #f2f2f6;
+ color: @theme_primary1_color;
+ height: 36px;
+ line-height: 36px;
+ margin: auto;
+ text-align: center;
+ max-width: 36px;
+ border-radius: 50%;
+ }
+
+ &-hover-new {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ border-radius: 50%;
+ }
+
+ &-hover {
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ &-l {
+ border-radius: 22px 0 0 22px;
+ }
+ &-r {
+ border-radius: 0 22px 22px 0;
+ }
+ &-all {
+ border-radius: 50%;
+ }
+ }
+}
diff --git a/src/components/CardFollow/CardFollowDetailMsg.jsx b/src/components/CardFollow/CardFollowDetailMsg.jsx
new file mode 100644
index 0000000..bb418ed
--- /dev/null
+++ b/src/components/CardFollow/CardFollowDetailMsg.jsx
@@ -0,0 +1,87 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-09-13 16:01:52
+ * @LastEditTime: 2023-06-28 10:55:05
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 资源删除原因
+ */
+import React, { useState, useEffect } from 'react';
+import { Button, Checkbox, Form, Space, TextareaItem, Toast } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined, DownArrow2Outlined } from 'dd-icons';
+import obj from '../../utils/socialCard';
+import MyModal from '../MyModal';
+
+/**
+ * title: string; // 标题
+ * miniTitle: string; // 小标题
+ * data: obj{} //对象数据
+ * visible: bool //显示隐藏
+ * onClose: func //取消事件回调
+ * onSave: func //确认事件回调
+ */
+const CardFollowDetailMsg = ({ title, miniTitle, data, visible, onClose, onSave }) => {
+ const [roomMsg, setRoomMsg] = useState(data);
+ const [outReason, setOutReason] = useState(obj.delReason.map((item) => ({ ...item, checked: item.value === '01' ? true : false })));
+
+ useEffect(() => {
+ setRoomMsg(data);
+ }, [data]);
+
+ return (
+ <MyModal bodyClass="taskHandle-returnModal" visible={visible} onClose={onClose}>
+ <div className="taskHandle-returnModal-title h7">{title}</div>
+ <div style={{ padding: "12px 16px" }}>
+ <div>
+ {outReason.map((item, index) => (
+ <div className="person-detail-modal-checkbox-l" key={index}>
+ <Checkbox
+ name={item.value}
+ checked={item.checked || false}
+ onChange={(e) => {
+ setOutReason(outReason.map((i) => ({ ...i, checked: i.value == item.value ? true : false })));
+ setRoomMsg({ ...roomMsg, outReason: item.value, outReasonDesc: item.label });
+ }}
+ className="person-detail-modal-checkbox"
+ />
+ <span className="person-detail-modal-checkbox-text">{item.label}</span>
+ </div>
+ ))}
+ </div>
+ <div>
+ {roomMsg.outReason == '99' && (
+ <Form.Item
+ position="brief"
+ className="person-detail-modal-input"
+ label={
+ <Space align="center">
+ <span style={{ fontSize: '16px' }}>{miniTitle}</span>
+ <span className="public-tag4">必填</span>
+ </Space>
+ }
+ >
+ <TextareaItem
+ onChange={(value) => setRoomMsg({ ...roomMsg, deleteReason: value })}
+ value={roomMsg.deleteReason}
+ className="render-form-view-input-brief"
+ placeholder="请输入"
+ rows={5}
+ />
+ </Form.Item>
+ )}
+ </div>
+ </div>
+ <div className="myModal-action">
+ <div onClick={onClose} className="myModal-action-item1">
+ 我再想想
+ </div>
+ <div onClick={() => onSave(roomMsg)} className="myModal-action-item2">
+ 确定删除
+ </div>
+ </div>
+ </MyModal>
+ );
+};
+
+export default CardFollowDetailMsg;
diff --git a/src/components/CustomFormView/index.jsx b/src/components/CustomFormView/index.jsx
new file mode 100644
index 0000000..5822453
--- /dev/null
+++ b/src/components/CustomFormView/index.jsx
@@ -0,0 +1,570 @@
+import React, { useState, useEffect } from 'react';
+import { Space, InputItem, Select, Switch, DatePicker, TextareaItem, Toast, Picker, Upload } from 'dingtalk-design-mobile';
+import { RightArrow2Outlined } from 'dd-icons';
+import FileShow from '../FileShow';
+import DingUpload from '../DingUpload';
+import * as $$ from '../../utils/utility';
+import './index.less';
+
+/**
+ * 自定义表单组件，无需使用Form组件
+ * @param {Array} formConfig - 表单配置数组
+ * @param {Object} formData - 表单数据对象
+ * @param {Function} onChange - 表单数据变更回调
+ * @param {Function} onSelectPerson - 选择人员回调
+ * @param {Function} onUpload - 文件上传回调
+ * @param {Boolean} disabled - 是否禁用表单
+ */
+const CustomFormView = ({ formConfig = [], formData = {}, onChange, onSelectPerson, onUpload, disabled = false }) => {
+ const [formValues, setFormValues] = useState({});
+
+ // 初始化表单数据
+ useEffect(() => {
+ setFormValues(formData);
+ }, [formData]);
+
+ // 处理表单项值变更
+ const handleChange = (name, value) => {
+ const newValues = { ...formValues, [name]: value };
+ setFormValues(newValues);
+
+ if (onChange) {
+ onChange(newValues, name);
+ }
+ };
+
+ // 处理文件上传/删除
+ const handleFileChange = (items, type) => {
+ let fileList = formValues.fileList || [];
+
+ if (type === 'add') {
+ fileList = fileList.concat(items);
+ } else {
+ fileList = fileList.filter((item) => item.id !== items.id);
+ }
+
+ const newValues = { ...formValues, fileList };
+ setFormValues(newValues);
+
+ if (onChange) {
+ onChange(newValues, 'fileList');
+ }
+ };
+
+ // 渲染表单项
+ const renderFormItem = (item, index) => {
+ const {
+ type,
+ name,
+ label,
+ placeholder,
+ format,
+ list = [],
+ desc,
+ require,
+ disabled,
+ className = '',
+ itemStyle = {},
+ tabs,
+ cols = 2,
+ subTitle,
+ url,
+ ownerType,
+ ownerId,
+ mainId,
+ onClick,
+ } = item;
+
+ const isFieldDisabled = disabled;
+
+ // 表单项的值
+ const fieldValue = formValues[name] !== undefined ? formValues[name] : '';
+
+ // 渲染不同类型的表单项
+ switch (type) {
+ case 'headerTitle':
+ return (
+ <div key={`header-${index}`} className="custom-form-header" style={itemStyle}>
+ {label}
+ </div>
+ );
+
+ case 'textBrief':
+ case 'text':
+ case 'password':
+ case 'phone':
+ case 'idcard':
+ case 'digit':
+ return (
+ <div key={`text-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-label">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <InputItem
+ className="custom-form-input"
+ type={type === 'textBrief' ? 'text' : type}
+ value={formValues[name] || ''}
+ onChange={(value) => handleChange(name, value)}
+ disabled={isFieldDisabled}
+ placeholder={placeholder}
+ />
+ </div>
+ </div>
+ );
+
+ case 'textarea':
+ return (
+ <div key={`textarea-${name}-${index}`} className={`custom-form-item ${tabs > 1 ? 'custom-form-item-tabs' : ''}`} style={itemStyle}>
+ <div className="custom-form-label" style={{ marginTop: '8px' }}>
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <TextareaItem
+ className="custom-form-textarea"
+ value={formValues[name] || ''}
+ onChange={(value) => handleChange(name, value)}
+ disabled={isFieldDisabled}
+ placeholder={placeholder}
+ rows={tabs || 2}
+ maxLength={500}
+ />
+ </div>
+ </div>
+ );
+
+ case 'select':
+ // 优化选项处理逻辑，支持多种传入格式
+ let pickerOptions = [];
+
+ try {
+ if (Array.isArray(list)) {
+ if (list.length > 0) {
+ if (typeof list[0] === 'object' && list[0] !== null) {
+ // 处理标准对象数组格式 [{label/title/name: '', value: ''}]
+ pickerOptions = list.map((item) => {
+ if (!item) return { label: '', value: '' };
+ return {
+ label: item.label || item.title || item.name || String(item.value || '') || '',
+ value: item.value !== undefined ? item.value : item.id !== undefined ? item.id : item.key !== undefined ? item.key : '',
+ };
+ });
+ } else if (typeof list[0] === 'string' || typeof list[0] === 'number') {
+ // 处理简单数组格式 ['选项1', '选项2']
+ pickerOptions = list.map((item) => ({
+ label: String(item || ''),
+ value: item,
+ }));
+ }
+ }
+ } else if (typeof list === 'object' && list !== null) {
+ // 处理对象格式 {key1: value1, key2: value2}
+ pickerOptions = Object.entries(list).map(([key, value]) => ({
+ label: String(value || ''),
+ value: key,
+ }));
+ } else if (typeof list === 'string') {
+ // 尝试将字符串解析为JSON
+ try {
+ const parsedList = JSON.parse(list);
+ if (Array.isArray(parsedList)) {
+ if (parsedList.length > 0 && typeof parsedList[0] === 'object') {
+ pickerOptions = parsedList.map((item) => ({
+ label: item.label || item.title || item.name || String(item.value || '') || '',
+ value: item.value || item.id || item.key || '',
+ }));
+ } else {
+ pickerOptions = parsedList.map((item) => ({
+ label: String(item || ''),
+ value: item,
+ }));
+ }
+ }
+ } catch (e) {
+ console.error('尝试解析字符串失败:', e);
+ // 如果解析失败，将整个字符串作为单个选项
+ pickerOptions = [{ label: list, value: list }];
+ }
+ }
+
+ // 如果转换后的选项为空，创建一个空占位选项避免Picker组件报错
+ if (pickerOptions.length === 0) {
+ pickerOptions = [{ label: placeholder, value: '' }];
+ }
+ } catch (error) {
+ console.error('处理select选项时出错:', error);
+ pickerOptions = [{ label: placeholder, value: '' }];
+ }
+
+ // 安全地将fieldValue转换为字符串进行比较
+ const fieldValueStr = fieldValue !== undefined && fieldValue !== null ? String(fieldValue) : '';
+
+ // 查找当前选中项的标签文本
+ const selectedOption = pickerOptions.find((item) => {
+ if (item.value === undefined || item.value === null) return false;
+
+ // 处理数字和字符串类型转换的比较
+ const itemValueStr = String(item.value);
+ return itemValueStr === fieldValueStr;
+ });
+
+ const selectedLabel = selectedOption ? selectedOption.label : '';
+
+ return (
+ <div key={`select-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row custom-form-value-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-select">
+ <Picker
+ value={fieldValue ? [fieldValue] : []}
+ okText="确定"
+ cancelText="取消"
+ onChange={(value) => {
+ console.log('Picker选择的值:', value);
+ // 如果提供了desc参数，同时更新对应的中文名称
+ if (desc) {
+ const selectedOption = pickerOptions.find((item) => String(item.value) === String(value[0]));
+ // 创建一个新的对象，同时更新两个字段
+ const newValues = {
+ ...formValues,
+ [name]: value[0],
+ [desc]: selectedOption ? selectedOption.label : '',
+ };
+ setFormValues(newValues);
+ if (onChange) {
+ onChange(newValues, name);
+ }
+ } else {
+ handleChange(name, value[0]);
+ }
+ }}
+ disabled={isFieldDisabled}
+ cols={1}
+ data={list}
+ >
+ <div className="custom-form-value-display">
+ <span className={selectedLabel ? 'custom-form-value-select-text' : 'custom-form-value-select-text-placeholder'}>
+ {selectedLabel || placeholder}
+ </span>
+ <RightArrow2Outlined className="custom-form-value-arrow" />
+ </div>
+ </Picker>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'date':
+ return (
+ <div key={`date-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <DatePicker
+ value={fieldValue ? fieldValue : ''}
+ onChange={(date) => {
+ console.log('date', date);
+ handleChange(name, date);
+ }}
+ disabled={isFieldDisabled}
+ adaptForm
+ // mode="time"
+ extra={placeholder || '选择'}
+ format={format || 'YYYY-MM-DD'}
+ />
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'switch':
+ return (
+ <div key={`switch-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control custom-form-switch">
+ <Switch
+ checked={fieldValue === '1' || fieldValue === true || fieldValue === 1}
+ onChange={(checked) => handleChange(name, checked ? '1' : '0')}
+ disabled={isFieldDisabled}
+ />
+ <span className="custom-form-switch-text">
+ {list && list.length > 1 ? (fieldValue === '1' || fieldValue === true || fieldValue === 1 ? list[1] : list[0]) : ''}
+ </span>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'number':
+ return (
+ <div key={`number-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-label">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <InputItem
+ className="custom-form-input"
+ type="number"
+ value={fieldValue}
+ onChange={(value) => handleChange(name, value.replace(/\s+/g, ''))}
+ disabled={isFieldDisabled}
+ placeholder={placeholder}
+ clear
+ maxLength={10}
+ />
+ </div>
+ </div>
+ );
+
+ case 'selectPerson':
+ return (
+ <div key={`person-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <div className="custom-form-select-person" onClick={() => !isFieldDisabled && onSelectPerson && onSelectPerson(name, url)}>
+ {fieldValue ? (
+ <div className="custom-form-select-value">{fieldValue}</div>
+ ) : (
+ <div className="custom-form-select-placeholder">{placeholder}</div>
+ )}
+ {!isFieldDisabled && (
+ <div className="custom-form-select-arrow">
+ <RightArrow2Outlined />
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ {subTitle && <div className="custom-form-subtitle">{subTitle}</div>}
+ </div>
+ );
+
+ case 'dingUpload':
+ return (
+ <div key={`dingUpload-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-upload">
+ <Upload
+ fileList={formValues[name] || []}
+ label={
+ <div className="ding-upload-label">
+ {require && <span className="custom-form-required">*</span>}
+ <div className="ding-upload-title">{label}</div>
+ {subTitle && <div className="ding-upload-subtitle">{subTitle}</div>}
+ </div>
+ // <div className="custom-form-title-row">
+ // <span className="custom-form-label-upload">{label}</span>
+
+ // </div>
+ }
+ type="form-upload"
+ accept="image/*,.pdf,.doc,.docx,.zip,.rar"
+ previewContent="预览"
+ action={`${$$.appUrl.fileUrl}/${$$.appUrl.sys}/api/web/fileInfo/upload?mainId=${mainId || ''}&ownerId=${ownerId || ''}&ownerType=${
+ ownerType || ''
+ }`}
+ headers={{ Authorization: $$.getSessionStorage('customerSystemToken') }}
+ onChange={(info) => {
+ handleChange(name, info.fileList);
+ if (onUpload) {
+ onUpload(name, info.fileList);
+ }
+ }}
+ disabled={isFieldDisabled}
+ uploadLabel="支持扩展名：.jpg .pdf .doc .docx .zip .rar，30M以内"
+ uploadBtnLabel="上传文件"
+ className="identity-document-upload"
+ />
+ </div>
+ {/* {subTitle && <div className="custom-form-subtitle">{subTitle}</div>} */}
+ </div>
+ );
+
+ case 'checkboxDiy':
+ return (
+ <div key={`checkbox-${name}-${index}`} className="custom-form-item custom-form-checkbox" style={itemStyle}>
+ <div className="custom-form-checkbox-list">
+ {list.map((option, optIndex) => (
+ <div
+ key={`option-${option.value}-${optIndex}`}
+ className={`custom-form-checkbox-option ${fieldValue === option.value ? 'custom-form-checkbox-selected' : ''}`}
+ onClick={() => !isFieldDisabled && handleChange(name, option.value)}
+ >
+ <div className="custom-form-checkbox-title">{option.title}</div>
+ {option.subTitle && <div className="custom-form-checkbox-subtitle">{option.subTitle}</div>}
+ </div>
+ ))}
+ </div>
+ </div>
+ );
+
+ case 'district':
+ return (
+ <div key={`district-${name}-${index}`} className={`custom-form-item ${tabs > 1 ? 'custom-form-item-tabs' : ''}`} style={itemStyle}>
+ <div className="custom-form-select-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-control">
+ <div className="custom-form-district" onClick={() => !isFieldDisabled && onSelectPerson && onSelectPerson('district', name)}>
+ {fieldValue ? (
+ <div className="custom-form-select-value">{fieldValue}</div>
+ ) : (
+ <div className="custom-form-select-placeholder">{placeholder || '请选择地区'}</div>
+ )}
+ {!isFieldDisabled && (
+ <div className="custom-form-select-arrow">
+ <RightArrow2Outlined />
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'radio':
+ return (
+ <div key={`radio-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-radio">
+ <Space direction="horizontal" size="large">
+ {list.map((option, optIndex) => (
+ <label key={`radio-option-${optIndex}`} className="custom-form-radio-option">
+ <input
+ type="radio"
+ name={name}
+ value={option.value}
+ checked={fieldValue === option.value}
+ onChange={(e) => handleChange(name, e.target.value)}
+ disabled={isFieldDisabled}
+ />
+ <span className="custom-form-radio-label">{option.label}</span>
+ </label>
+ ))}
+ </Space>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'cascader':
+ return (
+ <div key={`cascader-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row custom-form-value-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-select">
+ <Picker
+ value={Array.isArray(fieldValue) ? fieldValue : []}
+ cascade={true}
+ okText="确定"
+ cancelText="取消"
+ onChange={(value) => {
+ handleChange(name, value);
+ }}
+ disabled={isFieldDisabled}
+ cols={cols}
+ data={Array.isArray(list) ? list : []}
+ >
+ <div className="custom-form-value-display">
+ <span
+ className={
+ Array.isArray(fieldValue) && fieldValue.length > 0
+ ? 'custom-form-value-select-text'
+ : 'custom-form-value-select-text-placeholder'
+ }
+ >
+ {Array.isArray(fieldValue) && fieldValue.length > 0
+ ? (() => {
+ // 尝试从列表中找出对应的标签文本
+ try {
+ const labels = [];
+ let currentData = list;
+ fieldValue.forEach((value, index) => {
+ const found = currentData.find((item) => item.value === value);
+ if (found) {
+ labels.push(found.label);
+ currentData = found.children || [];
+ }
+ });
+ return labels.length > 0 ? labels.join('/') : fieldValue.join('/');
+ } catch (e) {
+ // 如果解析出错，直接返回原始值
+ return fieldValue.join('/');
+ }
+ })()
+ : placeholder}
+ </span>
+ <RightArrow2Outlined className="custom-form-value-arrow" />
+ </div>
+ </Picker>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'navigation':
+ return (
+ <div key={`navigation-${name}-${index}`} className="custom-form-item" style={itemStyle}>
+ <div className="custom-form-select-row custom-form-value-row">
+ <div className="custom-form-label custom-form-label-inline">
+ {require && <span className="custom-form-required">*</span>}
+ {label}
+ </div>
+ <div className="custom-form-select">
+ <div className="custom-form-value-display" onClick={() => !isFieldDisabled && onClick && onClick()}>
+ <span className={fieldValue ? 'custom-form-value-select-text' : 'custom-form-value-select-text-placeholder'}>
+ {fieldValue || placeholder}
+ </span>
+ <RightArrow2Outlined className="custom-form-value-arrow" />
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+
+ default:
+ return null;
+ }
+ };
+
+ // 渲染表单分组
+ const renderFormGroup = (group, groupIndex) => {
+ const { title, titleTab, list = [] } = group;
+
+ return (
+ <div key={`group-${groupIndex}`} className="custom-form-group">
+ {(title || titleTab) && <div className="custom-form-group-title">{title || titleTab}</div>}
+ <div className="custom-form-group-content">{list.map((item, itemIndex) => renderFormItem(item, itemIndex))}</div>
+ </div>
+ );
+ };
+
+ return <div className="custom-form-container">{formConfig.map((group, index) => renderFormGroup(group, index))}</div>;
+};
+
+export default CustomFormView;
diff --git a/src/components/CustomFormView/index.less b/src/components/CustomFormView/index.less
new file mode 100644
index 0000000..cfe3b9d
--- /dev/null
+++ b/src/components/CustomFormView/index.less
@@ -0,0 +1,513 @@
+.custom-form-container {
+ width: 100%;
+ background-color: #f5f7fa;
+}
+
+.custom-form-group {
+ margin-bottom: 12px;
+ background-color: #fff;
+}
+
+.custom-form-group-title {
+ color: #333;
+ font-size: 16px;
+ font-weight: 500;
+ padding: 16px 16px 8px;
+ position: relative;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+
+ &::before {
+ content: '';
+ display: block;
+ width: 4px;
+ height: 16px;
+ background-color: #1677ff;
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ }
+}
+
+.custom-form-group-content {
+ padding: 0;
+}
+
+.custom-form-header {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ padding: 16px 16px 8px;
+ background-color: #fff;
+ position: relative;
+ border-bottom: 1px solid rgba(0, 0, 0, 0.06);
+
+ &::before {
+ content: '';
+ display: block;
+ width: 4px;
+ height: 16px;
+ background-color: #1677ff;
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ }
+}
+
+.custom-form-item {
+ padding: 0px 16px 0 6px;
+ display: flex;
+ flex-direction: column;
+ border-bottom: none;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ &.custom-form-item-tabs {
+ padding-bottom: 4px;
+ }
+}
+
+.custom-form-control {
+ margin-left: 8px;
+ width: 100%;
+}
+
+.custom-form-input,
+.custom-form-textarea {
+ width: 100%;
+ border-radius: 4px;
+ font-size: 15px;
+
+ &:focus {
+ border-color: #1677ff;
+ outline: none;
+ }
+}
+
+.custom-form-input {
+ height: 47px;
+ line-height: 47px;
+}
+
+.custom-form-textarea {
+ min-height: 74px;
+ line-height: normal;
+ padding: 8px 0;
+}
+
+.custom-form-select {
+ position: relative;
+ flex: 1 1 auto;
+
+ .dd-picker {
+ width: 100%;
+ }
+
+ .dd-picker-item {
+ border: none !important;
+ background: transparent !important;
+ padding: 0 !important;
+ height: 47px !important;
+ line-height: 47px !important;
+ }
+
+ .custom-form-select-desc {
+ margin-top: 8px;
+ font-size: 15px;
+ color: #999;
+ }
+}
+
+.custom-form-select-person {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 8px 12px;
+ border: 1px solid #d9d9d9;
+ border-radius: 4px;
+ cursor: pointer;
+ width: 100%;
+ height: 47px;
+
+ &:active {
+ background-color: rgba(0, 0, 0, 0.02);
+ }
+}
+
+.custom-form-select-value {
+ color: #333;
+ font-size: 15px;
+}
+
+.custom-form-select-placeholder {
+ color: #999;
+ font-size: 15px;
+}
+
+.custom-form-select-arrow {
+ color: #999;
+}
+
+.custom-form-switch {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ height: 47px;
+}
+
+.custom-form-switch-text {
+ margin-left: 8px;
+ font-size: 15px;
+ color: #333;
+}
+
+.custom-form-upload {
+ padding: 0;
+ margin: 5px 0 10px;
+ width: 100%;
+
+ .ding-upload-container {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+
+ .identity-document-upload {
+ .dd-upload-form-upload {
+ background-color: #fff;
+ border: none;
+ box-shadow: none;
+ width: 100%;
+
+ .dd-upload-upload-label {
+ color: #999;
+ font-size: 13px;
+ margin-bottom: 5px;
+ }
+
+ .dd-upload-upload-btn {
+ background-color: #fff;
+ border: 1px solid #d9d9d9;
+ color: #333;
+ padding: 8px 16px;
+ border-radius: 4px;
+ font-size: 15px;
+ width: 100%;
+ text-align: center;
+ margin-top: 8px;
+ }
+ }
+
+ .dd-upload-upload-list {
+ margin-top: 10px;
+
+ .dd-upload-upload-item {
+ display: flex;
+ align-items: center;
+ margin-bottom: 8px;
+ background: #f5f7fa;
+ padding: 8px;
+ border-radius: 4px;
+ }
+ }
+ }
+}
+
+.custom-form-checkbox {
+ .custom-form-checkbox-list {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ }
+
+ .custom-form-checkbox-option {
+ padding: 12px;
+ border: 1px solid #d9d9d9;
+ border-radius: 4px;
+ cursor: pointer;
+ height: 47px;
+ display: flex;
+ align-items: center;
+
+ &.custom-form-checkbox-selected {
+ border-color: #1677ff;
+ background-color: rgba(22, 119, 255, 0.05);
+ }
+
+ .custom-form-checkbox-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ }
+
+ .custom-form-checkbox-subtitle {
+ margin-top: 4px;
+ font-size: 15px;
+ color: #999;
+ }
+ }
+
+ .custom-form-checkbox-desc {
+ margin-top: 8px;
+ font-size: 15px;
+ color: #999;
+ }
+}
+
+.custom-form-district {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 8px 12px;
+ border: 1px solid #d9d9d9;
+ border-radius: 4px;
+ cursor: pointer;
+ width: 100%;
+ height: 47px;
+
+ &:active {
+ background-color: rgba(0, 0, 0, 0.02);
+ }
+}
+
+.custom-form-district-desc {
+ margin-top: 8px;
+ font-size: 15px;
+ color: #999;
+}
+
+.custom-form-select-row {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ height: 47px;
+}
+
+.custom-form-label {
+ color: #333;
+ font-size: 15px;
+ position: relative;
+ padding-left: 8px;
+}
+
+.custom-form-label-inline {
+ flex: 0 0 auto;
+ margin-bottom: 0px;
+ margin-right: 12px;
+ color: #333;
+ font-size: 15px;
+ font-weight: normal;
+ position: relative;
+ padding-left: 8px;
+}
+
+.custom-form-required {
+ color: #ff4d4f;
+ font-size: 14px;
+ position: absolute;
+ left: -4px;
+}
+
+.custom-form-subtitle {
+ margin-top: 4px;
+ font-size: 15px;
+ color: #999;
+}
+
+.custom-form-picker-trigger {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 8px 12px;
+ border: 1px solid #d9d9d9;
+ border-radius: 4px;
+ font-size: 15px;
+ color: #333;
+ background-color: #fff;
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ height: 47px;
+}
+
+.custom-form-picker-arrow {
+ color: #999;
+ font-size: 16px;
+ margin-left: 8px;
+}
+
+.custom-form-picker-value {
+ flex: 1;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ color: #333;
+ font-size: 15px;
+}
+
+.custom-form-picker-trigger:empty .custom-form-picker-value,
+.custom-form-picker-value:empty {
+ color: #999;
+}
+
+.custom-form-value-row {
+ min-height: 47px;
+ padding: 0;
+}
+
+.custom-form-value-display {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ min-width: 0;
+ flex: 1;
+ padding: 0;
+ background: transparent;
+ border: none;
+ box-shadow: none;
+ height: 47px;
+}
+
+.custom-form-value-select-text {
+ color: #171a1d;
+ font-size: 15px;
+ text-align: right;
+ margin-right: 8px;
+ flex: 1;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+}
+
+.custom-form-value-select-text-placeholder {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 15px;
+}
+
+.dtm-date-picker-form-inner-node-content {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 15px;
+}
+.dtm-date-picker-format-value {
+ margin-right: 8px;
+}
+
+.dtm-date-picker-form-inner-node-arrow {
+ margin-left: 0px;
+ color: #bfbfbf;
+}
+
+.custom-form-value-arrow {
+ color: #bfbfbf;
+ font-size: 16px;
+ flex-shrink: 0;
+ margin-left: 0px;
+}
+
+.custom-form-title-row {
+ display: flex;
+ align-items: center;
+ margin-bottom: 8px;
+}
+
+.custom-form-label-upload {
+ color: #333;
+ font-size: 15px;
+ font-weight: normal;
+}
+
+.custom-form-radio {
+ display: flex;
+ align-items: center;
+
+ &-option {
+ display: flex;
+ align-items: center;
+ cursor: pointer;
+ margin-right: 16px;
+
+ input[type='radio'] {
+ margin-right: 4px;
+ }
+
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #333;
+ }
+
+ &-desc {
+ margin-top: 4px;
+ font-size: 12px;
+ color: #999;
+ }
+}
+
+.ding-upload-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+}
+
+.ding-upload-label {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ align-items: top;
+}
+
+.ding-upload-subtitle {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+}
+:global {
+ .ddm-upload-form {
+ .ddm-upload-form-text {
+ color: #999;
+ }
+
+ .ddm-upload-form-remove {
+ color: #999;
+
+ &:hover {
+ color: #f5222d;
+ }
+ }
+
+ .ddm-upload-form-file-name {
+ color: #333;
+ }
+
+ .ddm-upload-form-preview {
+ color: #1a6fb8;
+ }
+
+ .ddm-upload-form-upload-button {
+ background-color: #f5f5f5;
+ border: 1px dashed #d9d9d9;
+ color: #666;
+
+ &:hover {
+ border-color: #1a6fb8;
+ color: #1a6fb8;
+ }
+ }
+ }
+}
+& .dtm-upload-form-upload-btn {
+ align-items: flex-start;
+}
+
+& .dtm-upload-list {
+ margin-top: 10px;
+}
diff --git a/src/components/Descriptions/index.jsx b/src/components/Descriptions/index.jsx
new file mode 100644
index 0000000..3e53c28
--- /dev/null
+++ b/src/components/Descriptions/index.jsx
@@ -0,0 +1,212 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-10 18:33:51
+ * @LastEditTime: 2023-08-03 14:38:45
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description: 描述列表
+ */
+import React, { useState } from 'react';
+import { RightArrow2Outlined } from 'dd-icons';
+import { Space } from 'dingtalk-design-mobile';
+import { idcard, address, person1, person2 } from '../../assets/img';
+import ImgShow from '../../components/ImgShow';
+import { ellipsis, showToast } from '../../utils/utility';
+
+/**
+ * data: array, [{label:"",value:""}], // 数据
+ * columns: number, // 展示的列数
+ * title: string, // 标题
+ * extra: ReactNode, // 标题右侧的操作区自定义
+ * topRightActionVisible: bool, // 是否展示标题右侧区域
+ * onTopRightAction: func, // 点击标题右侧区域方法回调
+ * layout: string, // horizontal , vertical
+ * colon: bool, // 是否有冒号
+ * textGap: number, // 文字的间距
+ * itemGap: number, // col之间的间距
+ */
+const Descriptions = ({
+ data = [],
+ otherData = [],
+ columns = 2,
+ title,
+ extra,
+ topRightActionVisible = false,
+ onTopRightAction = null,
+ layout = 'horizontal',
+ colon = true,
+ textGap = 6,
+ itemGap = 4,
+}) => {
+ const width = 100 / columns;
+ const [visibles, setVisibles] = useState([]); //显示隐藏引导气泡
+
+ // 显隐
+ function handleVisible(index, visible) {
+ setVisibles(() => {
+ const tmp = new Array(data.length || []).fill(false);
+ if (!visible) {
+ return tmp;
+ } else {
+ tmp.splice(index, 1, visible);
+ return tmp;
+ }
+ })
+ }
+
+ function typeChange(x) {
+ switch (x.type) {
+ case 'idcard':
+ return (
+ <div className="descriptions-card descriptions-card-blue">
+ <div className="descriptions-card-avatar descriptions-card-avatar-blue">
+ <img className="descriptions-card-img" src={idcard} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <Space align="center">
+ <span>{x.title}</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>{x.cardType}</span>
+ <span className="public-rightBorder">{x.contents}</span>
+ </div>
+ </div>
+ </div>
+ );
+ case 'address':
+ return (
+ <div className="descriptions-card descriptions-card-orange">
+ <div className="descriptions-card-avatar descriptions-card-avatar-orange">
+ <img className="descriptions-card-img" src={address} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <Space align="center">
+ <span>{x.title}</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>户籍详址：{x.contents}</span>
+ </div>
+ </div>
+ </div>
+ );
+ case 'abroad':
+ return (
+ <div className="descriptions-card descriptions-card-orange">
+ <div className="descriptions-card-avatar descriptions-card-avatar-orange">
+ <img className="descriptions-card-img" src={address} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <Space align="center">
+ <span>{x.title}</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>来华目的：{x.contents}</span>
+ </div>
+ </div>
+ </div>
+ );
+ case 'files':
+ return (
+ <div className="descriptions-card-files">
+ {x.files?.map((x, t) => (
+ <div className="descriptions-card-files-item" key={t}>
+ <ImgShow fileType={x.type || '22_00017-3'} img={x.showUrl} allImg={x.files} title={x.name} />
+ </div>
+ ))}
+ {(x.files || []).length === 0 && (
+ <div className="descriptions-card-files-item">
+ <ImgShow />
+ </div>
+ )}
+ </div>
+ );
+ // 综治相关信息
+ case 'children':
+ return (
+ <div className="descriptions-card-ssim descriptions-card-red">
+ <div className="descriptions-card-ssim-title">综治9+X</div>
+ <div className="roomDetail-msgCard-content" style={{ marginTop: '20px' }}>
+ <Space align="center">
+ <span>{x.title}</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>留守类型：{x.contents}</span>
+ </div>
+ </div>
+ <div className="descriptions-card-ssim-avatar descriptions-card-ssim-avatar-red">
+ <img className="descriptions-card-ssim-img" src={person1} alt="" />
+ </div>
+ </div>
+ );
+ // 综治相关信息
+ case 'teenager':
+ return (
+ <div className="descriptions-card-ssim descriptions-card-red">
+ <div className="descriptions-card-ssim-title">综治9+X</div>
+ <div className="roomDetail-msgCard-content" style={{ marginTop: '20px' }}>
+ <Space align="center">
+ <span>{x.title}</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>{x.teenagerTypeDesc ? (x.teenagerTypeDesc.substring(0, 5) + (x.teenagerTypeDesc.length > 5 ? '...' : '')) : ''}</span>
+ <span className="public-rightBorder">{x.teenagerFamilyDesc ? (x.teenagerFamilyDesc.substring(0, 5) + (x.teenagerFamilyDesc.length > 5 ? '...' : '')) : ''}</span>
+ <span className="public-rightBorder">{x.teenagerHelpDesc ? (x.teenagerHelpDesc.substring(0, 5) + (x.teenagerHelpDesc.length > 5 ? '...' : '')) : ''}</span>
+ </div>
+ </div>
+ <div className="descriptions-card-ssim-avatar descriptions-card-ssim-avatar-red">
+ <img className="descriptions-card-ssim-img" src={person2} alt="" />
+ </div>
+ </div>
+ );
+ case 'build':
+ return;
+ default:
+ return;
+ }
+ }
+
+ return (
+ <>
+ {title && (
+ <div className="descriptions-title">
+ <div className="descriptions-title-left">{title || '标题'}</div>
+ {!!extra
+ ? extra
+ : topRightActionVisible && (
+ <div className="descriptions-title-right" onClick={onTopRightAction}>
+ <span>修改信息</span>
+ <RightArrow2Outlined />
+ </div>
+ )}
+ </div>
+ )}
+ {otherData.map((x, t) => {
+ return <React.Fragment key={t}>{typeChange(x)}</React.Fragment>;
+ })}
+ {data?.length > 0 && (
+ <div className="descriptions-grid" style={{ marginTop: `-${itemGap}px` }}>
+ {data.map((x, t) => {
+ return (
+ <div style={{ maxWidth: `${x.width || width}%`, flex: `0 0 ${x.width || width}%`, marginTop: itemGap + 'px' }} key={t}>
+ <div className="descriptions-grid-col" style={{ flexDirection: layout === 'horizontal' ? 'row' : 'column' }}>
+ <div className="descriptions-grid-col-left" style={{ margin: layout === 'horizontal' ? `0 ${textGap}px 0 0` : `0 0 ${textGap}px` }}>
+ {x.label}
+ {colon && ':'}
+ </div>
+ {
+ x.value && x.value.length < 32 ?
+ <pre className="descriptions-grid-col-right">{x.value ? ellipsis(x.value, 32) : '-'}</pre> :
+ <pre onClick={() => showToast.msg({ content: x.value, showType: 'line' })} className="descriptions-grid-col-right">{x.value ? ellipsis(x.value, 32) : '-'}</pre>
+ }
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ )}
+ </>
+ );
+};
+
+export default Descriptions;
diff --git a/src/components/Descriptions/index.less b/src/components/Descriptions/index.less
new file mode 100644
index 0000000..0c802f0
--- /dev/null
+++ b/src/components/Descriptions/index.less
@@ -0,0 +1,152 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.descriptions {
+
+ &-title {
+ display: flex;
+ align-items: center;
+ margin-bottom: 8px;
+
+
+ &-left {
+ flex: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ font-weight: 600;
+ font-size: 14px;
+ line-height: 22px;
+ }
+
+ &-right {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ }
+ }
+
+ &-grid {
+ display: flex;
+ flex-flow: row wrap;
+ margin-left: -6px;
+ margin-right: -6px;
+
+ &-col {
+ padding: 0 6px;
+ display: flex;
+
+ &-left {
+ color: @common_level2_base_color;
+ }
+
+ &-right {
+ flex: 1;
+ }
+ }
+ }
+
+
+
+ &-card {
+ display: flex;
+ align-items: center;
+ padding: 4px 8px;
+ border-radius: 5px;
+ margin-bottom: 8px;
+
+
+ &-ssim {
+ display: flex;
+ align-items: center;
+ padding: 4px 8px;
+ border-radius: 5px;
+ margin-bottom: 8px;
+ position: relative;
+
+ &-avatar {
+ min-width: 64px;
+ min-height: 64px;
+ max-width: 64px;
+ max-height: 64px;
+ margin-right: 8px;
+ font-size: 18px;
+
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-img {
+ min-width: 50px;
+ min-height: 50px;
+ max-width: 50px;
+ max-height: 50px;
+ }
+
+ &-title {
+ height: 20px;
+ background: #fce5e8;
+ position: absolute;
+ left: 0;
+ top: 0;
+ border-radius: 10px 0px 10px 0px;
+ text-align: LEFT;
+ color: #b54559;
+ line-height: 20px;
+ font-size: 12px;
+ padding: 0 8px;
+ }
+ }
+
+ &-files {
+ display: flex;
+ flex-flow: row wrap;
+ margin-top: -8px;
+
+ &-item {
+ margin-top: 8px;
+ margin-right: 16px;
+ }
+ }
+
+ &-blue {
+ background-color: rgba(0, 127, 255, 0.1);
+ }
+
+ &-orange {
+ background: rgb(255, 243, 239, 0.1);
+ }
+
+ &-red {
+ background: #fffafc;
+ border: 1px solid rgba(244, 228, 231, 0.7);
+ border-radius: 10px;
+ }
+
+ &-avatar {
+ min-width: 34px;
+ min-height: 34px;
+ max-width: 34px;
+ max-height: 34px;
+ margin-right: 8px;
+ border-radius: 50%;
+ font-size: 18px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ &-blue {
+ background: linear-gradient(138deg, #007fff 0%, #0062ff 100%);
+ }
+ &-orange {
+ background: linear-gradient(135deg, #ff713d 0%, #ff5b1f 100%);
+ }
+ }
+
+ &-img {
+ min-width: 18px;
+ min-height: 18px;
+ max-width: 18px;
+ max-height: 18px;
+ }
+ }
+}
diff --git a/src/components/DingUpload/index.jsx b/src/components/DingUpload/index.jsx
new file mode 100644
index 0000000..9ce2918
--- /dev/null
+++ b/src/components/DingUpload/index.jsx
@@ -0,0 +1,172 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 17:30:00
+ * @LastEditTime: 2025-04-30 15:18:25
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 通用附件上传查看组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Upload, Modal } from 'dingtalk-design-mobile';
+import * as $$ from '../../utils/utility';
+import './index.less';
+
+const appUrl = $$.appUrl;
+
+/**
+ * 通用附件上传查看组件
+ * @param {Object} props 组件属性
+ * @param {Array} props.fileList 文件列表
+ * @param {Function} props.onChange 文件列表变化回调
+ * @param {String} props.mainId 主ID，用于上传接口
+ * @param {String} props.ownerId 文件所属ID，用于上传接口
+ * @param {String} props.ownerType 文件所属类型，用于上传接口
+ * @param {String} props.title 标题
+ * @param {Boolean} props.disabled 是否禁用上传功能
+ * @param {Boolean} props.viewOnly 是否只查看模式（不显示上传和删除）
+ * @param {String} props.subtitle 副标题
+ * @param {String} props.accept 接受的文件类型
+ * @param {String} props.tipText 提示文本
+ * @param {String} props.btnText 按钮文本
+ * @returns {JSX.Element}
+ */
+const DingUpload = ({
+ fileList = [],
+ onChange,
+ mainId = '',
+ ownerId = '',
+ ownerType = '',
+ title = '附件材料',
+ disabled = false,
+ viewOnly = false,
+ subtitle = '',
+ accept = '*',
+ tipText = '支持扩展名：.rar .zip .doc .docx .pdf .jpg，30M以内',
+ btnText = '上传文件',
+}) => {
+ const [files, setFiles] = useState([]);
+ const [imageVisible, setImageVisible] = useState(false);
+ const [previewImage, setPreviewImage] = useState('');
+
+ useEffect(() => {
+ setFiles(fileList);
+ }, [fileList]);
+
+ // 处理文件列表变化
+ const handleChange = (info) => {
+ setFiles(info.fileList);
+ if (onChange) {
+ onChange(info);
+ }
+
+ // 处理上传状态变化
+ if (info?.file?.status === 'done') {
+ $$.showToast({ content: '上传成功' });
+ } else if (info?.file?.status === 'error') {
+ $$.showToast({ content: '抱歉! 网络错误' });
+ }
+ };
+
+ // 预览文件
+ const handlePreview = async (file) => {
+ console.log('file', file);
+ // 如果是图片类型，则打开图片预览
+ if (file.type && file.type.startsWith('image/')) {
+ let src = '';
+ if (file.url) {
+ src = file.url;
+ } else if (file.response && file.response.data && file.response.data[0] && file.response.data[0].showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.response.data[0].showUrl}`;
+ } else if (file.showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ }
+ window.open(src);
+ // setPreviewImage(src);
+ // setImageVisible(true);
+ } else {
+ // 其他类型文件，通过URL打开
+ let src = '';
+ if (file.url) {
+ src = file.url;
+ } else if (file.response && file.response.data && file.response.data && file.response.data[0] && file.response.data[0].showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.response.data[0].showUrl}`;
+ } else if (file.showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ }
+
+ window.open(src);
+ }
+ };
+
+ // 删除文件
+ const handleRemove = async (file) => {
+ // 需要调用删除接口
+ try {
+ if (file.id || (file.response && file.response.data && file.response.data[0] && file.response.data[0].id)) {
+ const fileId = file.id || file.response.data[0].id;
+ const res = await $$.ax.request({
+ url: `fileInfo/deleteFileById`,
+ type: 'get',
+ data: { id: fileId },
+ service: 'sys',
+ });
+
+ if (res.type) {
+ $$.showToast({ content: '删除成功' });
+ } else {
+ $$.showToast({ content: '删除失败' });
+ return false; // 阻止删除操作
+ }
+ }
+ return true;
+ } catch (error) {
+ $$.showToast({ content: '删除失败' });
+ return false; // 阻止删除操作
+ }
+ };
+
+ return (
+ <div className="ding-upload-container">
+ {viewOnly && (
+ <div className="ding-upload-label">
+ <div className="ding-upload-title">{title}</div>
+ <div className="ding-upload-subtitle">{subtitle}</div>
+ </div>
+ )}
+ <Upload
+ label={
+ <div className="ding-upload-label">
+ <div className="ding-upload-title">{title}</div>
+ <div className="ding-upload-subtitle">{subtitle}</div>
+ </div>
+ }
+ onPreview={handlePreview}
+ fileList={files}
+ type="form-upload"
+ accept={accept}
+ previewContent="预览"
+ action={`${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${mainId}&ownerId=${ownerId}&ownerType=${ownerType}`}
+ headers={{ Authorization: $$.getSessionStorage('customerSystemToken') }}
+ onChange={handleChange}
+ disabled={disabled || viewOnly}
+ onRemove={viewOnly ? null : handleRemove}
+ showUploadList={{
+ showRemoveIcon: !viewOnly,
+ showUploadBtn: !viewOnly,
+ }}
+ uploadLabel={tipText}
+ uploadBtnLabel={btnText}
+ className={viewOnly ? 'ding-upload-preview-only' : ''}
+ />
+
+ <Modal visible={imageVisible} onClose={() => setImageVisible(false)} className="ding-upload-image-preview">
+ <div className="ding-upload-image-wrapper">
+ <img src={previewImage} alt="预览图片" />
+ </div>
+ </Modal>
+ </div>
+ );
+};
+
+export default DingUpload;
diff --git a/src/components/DingUpload/index.less b/src/components/DingUpload/index.less
new file mode 100644
index 0000000..9e7172b
--- /dev/null
+++ b/src/components/DingUpload/index.less
@@ -0,0 +1,113 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 17:30:00
+ * @LastEditTime: 2025-04-14 16:44:32
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 通用附件上传查看组件样式
+ */
+
+.ding-upload-container {
+ width: 100%;
+ background-color: #fff;
+ border-radius: 4px;
+
+ & .dtm-upload-disabled {
+ display: none;
+ }
+
+ .ding-upload-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+ }
+
+ .ding-upload-label {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ align-items: top;
+ }
+
+ .ding-upload-subtitle {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+ :global {
+ .ddm-upload-form {
+ .ddm-upload-form-text {
+ color: #999;
+ }
+
+ .ddm-upload-form-remove {
+ color: #999;
+
+ &:hover {
+ color: #f5222d;
+ }
+ }
+
+ .ddm-upload-form-file-name {
+ color: #333;
+ }
+
+ .ddm-upload-form-preview {
+ color: #1a6fb8;
+ }
+
+ .ddm-upload-form-upload-button {
+ background-color: #f5f5f5;
+ border: 1px dashed #d9d9d9;
+ color: #666;
+
+ &:hover {
+ border-color: #1a6fb8;
+ color: #1a6fb8;
+ }
+ }
+ }
+ }
+ & .dtm-upload-form-upload-btn {
+ align-items: flex-start;
+ }
+
+ & .dtm-upload-list {
+ margin-top: 10px;
+ }
+}
+
+.ding-upload-preview-only {
+ :global {
+ .ddm-upload-form {
+ .ddm-upload-form-upload-button {
+ display: none;
+ }
+ }
+ }
+}
+
+.ding-upload-image-preview {
+ :global {
+ .ddm-dialog-content {
+ padding: 0;
+ }
+ }
+
+ .ding-upload-image-wrapper {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.7);
+
+ img {
+ max-width: 100%;
+ max-height: 80vh;
+ object-fit: contain;
+ }
+ }
+}
diff --git a/src/components/EmptyView/index.jsx b/src/components/EmptyView/index.jsx
new file mode 100644
index 0000000..36d964b
--- /dev/null
+++ b/src/components/EmptyView/index.jsx
@@ -0,0 +1,35 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-05-20 10:11:29
+ * @LastEditTime: 2023-08-08 00:45:12
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState } from 'react';
+import { RightArrow2Outlined } from 'dd-icons';
+import { Empty, Button } from 'dingtalk-design-mobile';
+import { idcard, address, person1, person2 } from '../../assets/img';
+import { HashRouter as Router, Route, Redirect, useHistory } from 'react-router-dom';
+
+const EmptyView = ({ show, showOnClick }) => {
+ const history = useHistory();
+
+ return (
+ <>
+ <Empty
+ type="permission"
+ action={{
+ text: '账号登录',
+ onClick: () => {
+ showOnClick();
+ },
+ }}
+ title={show === 'noDingDing' ? '抱歉，请在海政通内打开!' : '该应用仅对网格员开放!'}
+ />
+ </>
+ );
+};
+
+export default EmptyView;
\ No newline at end of file
diff --git a/src/components/FileShow/index.jsx b/src/components/FileShow/index.jsx
new file mode 100644
index 0000000..6f2ddf8
--- /dev/null
+++ b/src/components/FileShow/index.jsx
@@ -0,0 +1,108 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-16 17:53:50
+ * @LastEditTime: 2023-06-15 10:30:40
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState, useEffect } from 'react';
+import dd from 'gdt-jsapi';
+import { showToast, ax, confirmModal, appUrl } from '../../utils/utility';
+import UploadFile from './..//UploadFile';
+import { DeleteOutlined } from 'dd-icons';
+import { camera } from '../../assets/img';
+
+function delFileApi(id) {
+ return ax.request({ url: `fileInfo/deleteById?id=${id}`, type: 'get', service: 'sys' });
+}
+
+const FileShow = ({ formData, data, ownerId, ownerType, callback }) => {
+ const [imgdataShow, setImgdataShow] = useState({});
+ const [imgurlShow, setImgurlShow] = useState({});
+
+ function onSuccessCallback(params) {
+ const url = params.find((item) => Number(item.ownerType) == Number(ownerType))
+ ? `${appUrl.fileUrl}${params.find((item) => Number(item.ownerType) == Number(ownerType)).showUrl}`
+ : '';
+ setImgurlShow(url);
+ callback && callback(params, 'add');
+ }
+
+ // 删除附件
+ async function delOnClick(params) {
+ confirmModal({
+ title: '附件删除确认',
+ subtitle: (
+ <span>
+ 确定删除 <span className="public-color">{data.title}</span>吗？
+ </span>
+ ),
+ okText: '确定删除',
+ onOk: async () => {
+ global.setSpinning(true);
+ const res = await delFileApi(params.id);
+ global.setSpinning(false);
+ if (res.type) {
+ showToast({ type: 'success', content: '删除成功' });
+ setImgurlShow('');
+ setImgdataShow(params);
+ callback && callback(params, 'del');
+ }
+ },
+ });
+ }
+
+ function handleShowImg() {
+ dd.previewImage({
+ current: imgurlShow,
+ urls: [imgurlShow],
+ }).catch((res) => {
+ showToast({ type: 'fail', content: '查看失败' });
+ });
+ }
+
+ // 初始化
+ useEffect(() => {
+ const fileList = formData.fileList || [];
+ const url = fileList.find((item) => Number(item.ownerType) == Number(ownerType))
+ ? `${appUrl.fileUrl}${fileList.find((item) => Number(item.ownerType) == Number(ownerType)).showUrl}`
+ : '';
+ setImgdataShow(fileList.find((item) => Number(item.ownerType) == Number(ownerType)) || {})
+ setImgurlShow(url)
+ }, [formData]);
+
+ return (
+ <div style={{ height: '128px' }}>
+ {imgurlShow && (
+ <div className="file-show-main">
+ <div className="file-show-main-del" onClick={() => delOnClick(imgdataShow)}>
+ <DeleteOutlined style={{ color: '#fff', margin: '0px 0 0 10px' }} />
+ </div>
+ <img onClick={handleShowImg} src={imgurlShow} className="file-show-main-showImg" />
+ <div className="file-show-main-title">{data.title}</div>
+ </div>
+ )}
+ {!imgurlShow && (
+ <UploadFile ownerId={ownerId || ''} ownerType={data.ownerType || ''} onSuccessCallback={onSuccessCallback} maxCount={1}>
+ {
+ data.bgImgHeight ?
+ <div className="file-show-main" style={{ width: '118px', display: 'flex', justifyContent: 'center' }}>
+ <img className="file-show-main-img" src={data.bgImg} style={{ height: data.bgImgHeight ? data.bgImgHeight : '100%' }} />
+ <img src={camera} className="file-show-main-img-camera" />
+ <div className="file-show-main-title">{data.title}</div>
+ </div> :
+ <div className="file-show-main">
+ <img className="file-show-main-img" src={data.bgImg} />
+ <img src={camera} className="file-show-main-img-camera" />
+ <div className="file-show-main-title">{data.title}</div>
+ </div>
+ }
+ </UploadFile>
+ )}
+ </div>
+ );
+};
+
+export default FileShow;
diff --git a/src/components/FileShow/index.less b/src/components/FileShow/index.less
new file mode 100644
index 0000000..c772ea7
--- /dev/null
+++ b/src/components/FileShow/index.less
@@ -0,0 +1,55 @@
+.file-show {
+ &-main {
+ position: relative;
+ // width: 118px;
+ height: 70px;
+ flex: 1;
+ border-radius: 5px 5px 0 0;
+ padding: 15px;
+ background-color: #d3e7fc;
+ &-img {
+ // max-width: 54px;
+ max-width: 118px;
+ opacity: 0.8;
+ &-camera {
+ max-width: 56px;
+ position: absolute;
+ left: 46px;
+ top: 24px;
+ }
+ }
+
+ &-del {
+ width: 27px;
+ position: absolute;
+ right: 0;
+ top: 0px;
+ background: #f5222d;
+ border-radius: 0px 0px 0px 30px;
+ }
+
+ &-showImg {
+ max-height: 70px;
+ max-width: 118px;
+ min-width: 118px;
+ }
+
+ &-title {
+ position: absolute;
+ bottom: -28px;
+ left: 0;
+ color: #171a1d;
+ opacity: 0.8;
+ width: 100%;
+ height: 28px;
+ background: #f2f2f2;
+ font-size: 12px;
+ line-height: 28px;
+ text-align: center;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ border-radius: 0 0 5px 5px;
+ }
+ }
+}
diff --git a/src/components/FormView/index.jsx b/src/components/FormView/index.jsx
new file mode 100644
index 0000000..1f741b0
--- /dev/null
+++ b/src/components/FormView/index.jsx
@@ -0,0 +1,311 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-15 20:09:04
+ * @LastEditTime: 2025-04-30 10:55:32
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:表单组件
+ */
+import React, { useState, useRef, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Picker, List, Space, Switch, Form, DatePicker, Input, Select, Button, Toast, Checkbox } from 'dingtalk-design-mobile';
+import { confirmModal } from '../../utils/utility';
+import FileShow from '../../components/FileShow';
+import { roomForm } from '../../assets/img';
+import IdcardOCR from '../../components/IdcardOCR';
+import MyModal from '../../components/MyModal';
+import { region, checkIdCard, checkTel, setLocal, confirmThreeButtonModal, myTimeFormat } from '../../utils/utility';
+import rule from '../../utils/rules';
+// import { applyForForm_3 } from '../../assets/cardImg';
+import { RightArrow2Outlined } from 'dd-icons';
+
+
+
+// form表单[]
+// formData表单value对象 {}
+// handleChange输入事件 fun
+// rightButtonOnClick 右侧点击按钮 fun
+// formstatus 表单登记状态是否显示 true flase
+// tabPage 页签
+// tabList 表单登记状态提示信息
+// 是否为新增表单
+const RenderFormView = ({ form, formData, handleChange, tabPage, tabList, rightButtonOnClick, formstatus, newAdd, metaAddrClick, OCRsuccessCallback }) => {
+ const history = useHistory();
+ const [data, setData] = useState({ list: [], total: 0 });
+ const [visible, setVisible] = useState(false);
+ const [expiredDateVisible, setExpiredDateVisible] = useState(false);
+ const [expiredDateData, setExpiredDateData] = useState({ visible: false, visible1: false, });
+ // 选择小区异常情况
+ const [diySelectData, setDiySelectData] = useState(false);
+
+ function render(item, i, listIndex, handleChange, rightButtonOnClick, form, formData, formstatus) {
+ const h = (items) => {
+ let { index, key, value } = items;
+ formData[key] = value;
+ handleChange(formData, key);
+ };
+
+ const fileH = (items, type) => {
+ if (type === 'add') {
+ formData.fileList = formData.fileList.concat(items)
+ } else {
+ formData.fileList = formData.fileList.filter(item => item.id !== items.id)
+ }
+ handleChange(formData, 'fileList');
+ }
+
+ const {
+ name,
+ require,
+ value,
+ type,
+ showTitle,
+ label,
+ list = [],
+ code,
+ extra = null,
+ margin,
+ display,
+ disabled = false,
+ desc,
+ placeholder = null,
+ files,
+ url,
+ img,
+ rightButton,
+ rightArrow,
+ miniLabel,
+ parameter,
+ startTime,
+ endTime,
+ } = item;
+ switch (type) {
+ case 'text':
+ case 'password':
+ case 'phone':
+ case 'idcard':
+ case 'digit':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <>
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ </>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ {name === 'idcard' && disabled === true ? (
+ <div
+ style={{ fontSize: '14px', lineHeight: '1.5', color: 'rgba(23, 26, 29, 0.24)' }}
+ onClick={(e) => {
+ Toast.info({
+ content: '不允许修改已登记居民的证件号，如填写错误，请迁出后重新添加',
+ });
+ }}
+ >
+ {formData[name] ? formData[name] : ''}
+ </div>
+ ) : (
+ <Input
+ className="render-form-view-input"
+ type={type}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ disabled={disabled}
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ )}
+ </Form.Item>
+ );
+ default:
+ return null;
+ }
+ }
+
+ // 登记状态判断
+ function newTest(tabPage, tabList) {
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'red') {
+ return (
+ <div className="divider-Tabtitle-tabs-red">
+ <span></span>
+ {'异常登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'green') {
+ return (
+ <div className="divider-Tabtitle-tabs-green">
+ <span></span>
+ {'已登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'normal') {
+ return (
+ <div className="divider-Tabtitle-tabs">
+ <span></span>
+ {'未登记'}
+ </div>
+ );
+ }
+ }
+
+ return (
+ <div className="render-form-view-main">
+ {form.map((items, i) => {
+ return (
+ <div key={i}>
+ {items.titleTab && (
+ <div className="divider-Tabtitle">
+ <div>{items.titleTab}</div>
+ {formstatus && newTest(tabPage, tabList)}
+ </div>
+ )}
+ {/* {
+ items.selectTitle &&
+ <div className="divider-title" style={{ marginBottom: '0px' }}>
+ <div>{items.selectTitle}</div>
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick({}, items.selectTitle)}>
+ <img
+ style={{ width: '12px', paddingLeft: '0' }}
+ src={applyForForm_3}
+ alt=""
+ /> 选择
+ </span>
+ </div>
+ </div>
+ } */}
+ {(items.title !== 'ocr') && (
+ <div className={items.title ? 'divider-title' : (items.list.length > 0 ? 'divider-title-new' : 'divider-title-new111')}>
+ {items.title}
+ {items.title === '公安标准地址关联' && formData.metaAddr && (
+ <div onClick={() => metaAddrClick()} style={{ display: 'flex', alignItems: 'center' }} className="divider-Tabtitle-tabs-red">
+ <img style={{ width: '14px', height: '14px', marginRight: '4px' }} src={roomForm} alt="" />
+ {'取消关联'}
+ </div>
+ )}
+ </div>
+ )}
+ <div className="render-form-view-col">
+ {items.list.map((item, index) => {
+ return <div key={item.name + index}>{render(item, index, items.list.length, handleChange, rightButtonOnClick, form, formData)}</div>;
+ })}
+ </div>
+ </div>
+ );
+ })}
+ {/* 地名地址说明 */}
+ <MyModal visible={visible} center title="地名地址规范说明" onClose={() => setVisible(false)}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <div className="from-long-main-body-in">
+ <p>{`地名是人们对具有特定方位、地域范围的地理实体赋予的专有名称。`}</p>
+ <p>{`地址是有地名的详细表述，包括国家、省份、城市或乡村、街道、门牌号码、屋邨、大厦等建筑物名称，或者再加楼层数目、房间编号等。`}</p>
+ <p>{`<行政区划名><街巷路名|村名>[门牌号][小区名][标志物名][单元名][楼栋名（号）]。其中<>表示必填项，|表示或者，[]表示可选项。地名地址描述组合规则共有五大类十小类`}</p>
+ <div className="form-font-weight">{`A.<行政区划名><街巷路名><门牌号>[小区名][楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`1.行政区划名+街巷路名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸五西路30号 `}</div>
+ <div>{`2.行政区划名+街巷路名+门牌号+小区名+楼栋名（号）+商铺号 `}</div>
+ <div className="form-font-color-blue">{`示例：美兰区和平大道61号都市海岸8栋海景阁铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`B.<行政区划名><街巷路名><小区名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`3.行政区划名+街巷路名+小区名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍`}</div>
+ <div>{`4.行政区划名+街巷路名+小区名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍1栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`C.<行政区划名><街巷路名><门牌号><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`5.行政区划名+街巷路名+门牌号+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸二西路2号金源大厦`}</div>
+ <div>{`6.行政区划名+街巷路名+门牌号+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区人民大道58号海南大学海甸校区学生宿舍11栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`D.<行政区划名><街巷路名><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`7.行政区划名+街巷路名+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校`}</div>
+ <div>{`8.行政区划名+街巷路名+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校美术楼铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`E.<行政区划名><村名><门牌号>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`9.行政区划名+村名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区拦海中村165号`}</div>
+ <div>{`10.行政区划名+村名+门牌号+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：琼山区高登里二横97号1栋铺面1`}</div>
+ </div>
+ </div>
+ <div>
+ <div style={{ height: '1px', width: '100%', margin: '8px 0', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <Button
+ onClick={() => {
+ setVisible(false);
+ }}
+ style={{ width: '100%' }}
+ type="primary"
+ >
+ 我知道了
+ </Button>
+ </div>
+ </MyModal>
+ {
+ formData[expiredDateData.startTime] &&
+ <Picker
+ // data={[[{ label: myTimeFormat((new Date(formData.icExpiredStartTime).getTime() + 157680000000), `YYYY年M月D日`), value: new Date(new Date(formData.icExpiredDate).getTime() + 86400000) }, { label: '长期', value: '2' }]]}
+ data={[[
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: '长期', value: myTimeFormat(new Date('2099-1-1'), `YYYY-M-D`) }]]}
+ visible={expiredDateData.visible}
+ title="证件有效期"
+ okText="确定"
+ cascade={false}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false })}
+ onChange={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })
+ formData[expiredDateData.endTime] = new Date(e)
+ console.log('expiredDateData.startTime', expiredDateData.endTime);
+ console.log('formData', formData);
+ handleChange(formData, expiredDateData.endTime)
+ }
+ }
+ >
+ </Picker>
+
+ }
+ <DatePicker
+ visible={expiredDateData.visible1}
+ title={'证件有效期开始日期'}
+ mode="date"
+ minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ extra={<span className="select-color">请选择</span>}
+ cascade={true}
+ onChange={(e) => {
+ formData[expiredDateData.startTime] = e;
+ console.log('expiredDateData.startTime', expiredDateData);
+ console.log('formData', formData)
+ handleChange(formData, expiredDateData.startTime)
+ }}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })}
+ onOk={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: true, visible1: false })
+ }}
+ >
+ </DatePicker>
+ </div >
+ );
+};
+
+export default RenderFormView;
diff --git a/src/components/FormView/index.less b/src/components/FormView/index.less
new file mode 100644
index 0000000..11c1902
--- /dev/null
+++ b/src/components/FormView/index.less
@@ -0,0 +1,295 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.select-color {
+ color: @common_level3_base_color;
+}
+
+.divider-title {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px;
+ display: flex;
+ justify-content: space-between;
+ &-new {
+ height: 8px;
+ }
+}
+
+.divider-title-ocr {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px 12px 0 12px;
+ display: flex;
+ justify-content: space-between;
+}
+
+.form-font-weight {
+ font-weight: 600;
+}
+
+.form-font-color-red {
+ color: #f5222d;
+}
+
+.form-font-color-blue {
+ color: #007fff;
+}
+
+.mini-divider-title {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 20px;
+}
+
+.select-color-disabled {
+ & .dtm-list-extra {
+ color: rgba(23, 26, 29, 0.24) !important;
+ }
+}
+
+.divider-Tabtitle {
+ font-size: 14px;
+ color: #007fff;
+ line-height: 20px;
+ margin: 12px 12px 0px 12px;
+ display: flex;
+ justify-content: space-between;
+
+ &-tabs {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #d9d9d9;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-green {
+ font-size: 12px;
+ color: #00b042;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #00b042;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-red {
+ font-size: 12px;
+ color: #ff5219;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #ff5219;
+ border-radius: 2px;
+ }
+ }
+}
+
+.dtm-list-item {
+ min-height: 46px;
+}
+
+.render-form-view {
+ &-main {
+ // overflow: hidden;
+ // padding-bottom: 16px;
+
+ & .dtm-space-item {
+ font-size: 14px;
+ }
+ }
+
+ &-overflow {
+ // height: 100%;
+ // overflow: scroll;
+ // &::-webkit-scrollbar {
+ // display: none !important;
+ // }
+ }
+
+
+
+ &-input .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ text-align: right;
+ }
+
+ &-input-brief .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ // text-align: right;
+ }
+
+
+
+ &-title-borderRadius {
+ border-radius: 10px;
+ }
+
+ &-switch-title {
+ font-size: 14px;
+ padding-right: 8px;
+ color: #171a1d;
+ opacity: 0.85;
+ }
+
+ &-switch .dtm-switch-fake {
+ width: 43px !important;
+ height: 22px !important;
+ }
+
+ &-switch .dtm-switch-fake::after {
+ width: 18px !important;
+ height: 18px !important;
+ background-color: var(--common_white1_color, #ffffff);
+ }
+
+ &-switch .dtm-form-item-default-label {
+ width: auto;
+ }
+
+ &-multiple {
+ &-top .dtm-list-item-middle {
+ border-radius: 10px 10px 0px 0px;
+ }
+
+ &-bottom .dtm-list-item-middle {
+ border-radius: 0px 0px 10px 10px;
+ }
+
+ &-radius .dtm-list-item-middle {
+ border-radius: 10px;
+ }
+ }
+
+ &-select_multiple {
+ display: flex;
+ justify-content: space-between;
+
+ &-value {
+ color: #171a1d;
+ opacity: 0.85;
+ font-size: 14px;
+ }
+
+ &-m {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+ }
+
+ &-space {
+ width: 100%;
+ }
+
+ &-files {
+ background: #ffffff;
+ border-radius: 10px;
+ padding: 12px 16px 16px;
+
+ &-title {
+ font-size: 14px;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ margin-bottom: 12px;
+ }
+
+ &-col {
+ display: flex;
+ justify-content: space-between;
+ }
+ }
+
+ &-childView {
+ margin-bottom: 0px;
+ background: #fff;
+ padding: 10px 16px;
+
+ &-flex {
+ display: flex;
+ align-items: center;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-rightArrow {
+ margin-left: 5px;
+ font-size: 15px;
+ color: var(--common_level4_base_color, #ffffff);
+ }
+ }
+
+ &-headtTitle {
+ background: #fff;
+ padding: 12px 16px;
+
+ &-overflow {
+ overflow: scroll;
+ height: 300px;
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-border {
+ position: relative;
+ background-color: @common_bg_z1_color;
+
+ &::after {
+ content: '';
+ position: absolute;
+ height: 1px;
+ background-color: @common_line_light_color;
+ left: 0;
+ right: 0;
+ z-index: 99;
+ bottom: -12px;
+ }
+ }
+ }
+
+ &-checkbox {
+ margin: 12px 0;
+ & .dtm-list-thumb {
+ // margin: 0 !important;
+ }
+ & .dtm-list-item {
+ padding: 0;
+ }
+ & .dtm-list-line {
+ padding: 0;
+ }
+ }
+}
+
+
diff --git a/src/components/IdcardOCR/index.jsx b/src/components/IdcardOCR/index.jsx
new file mode 100644
index 0000000..a4afed2
--- /dev/null
+++ b/src/components/IdcardOCR/index.jsx
@@ -0,0 +1,122 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-16 17:53:50
+ * @LastEditTime: 2023-08-03 15:22:59
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description:拍摄证件照回填和选择历史人口
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Modal, Button } from 'dingtalk-design-mobile';
+import { idCardphoto, idCardTip } from '../../assets/img';
+import UploadFile from '../UploadFile';
+import { showToast } from '../../utils/utility';
+
+const IdcardOCR = ({ data, OCRsuccessCallback }) => {
+ const history = useHistory();
+ const [visible, setVisible] = useState(false); //拍摄证件回填弹窗
+
+ function ConClick(type) {
+ if (type == 'idcardOcr') {
+ // todo
+ // showToast({ content: '该功能将于近期开放' });
+ setVisible(true);
+ } else if (type == 'hisPerson') {
+ history.push(`/hztGrid/person/hisPersonList`);
+ }
+ }
+
+ function visibleOnClick(type, v) {
+ setVisible(false);
+ }
+
+ function bottomOnclick(type) {
+ switch (type) {
+ case 'reset':
+ return setVisible(false);
+ case 'submit':
+ setVisible(false);
+ return;
+ case 'default':
+ return;
+ }
+ }
+
+ return (
+ <>
+ <div
+ className="idcard-ocr-main"
+ onClick={() => {
+ ConClick(data.type);
+ }}
+ >
+ <img src={data.bgImg} className="idcard-ocr-main-img" />
+ <div className="idcard-ocr-main-title">
+ <div className="idcard-ocr-main-title-top">{data.title}</div>
+ <div className="idcard-ocr-main-title-bottom">{data.contents}</div>
+ </div>
+ </div>
+ <Modal
+ className="idcard-ocr-main-modal-m"
+ style={{ width: '90%' }}
+ visible={visible}
+ title="拍摄证件回填"
+ onClose={() => () => visibleOnClick('', false)}
+ >
+ <div className="idcard-ocr-main-modal">
+ <span className="idcard-ocr-main-modal-space"></span>
+ <span>请拍摄身份证人像面</span>
+ </div>
+ <div className="idcard-ocr-main-modal-img">
+ <img src={idCardphoto} alt="" />
+ </div>
+ <div className="idcard-ocr-main-modal">
+ <span className="idcard-ocr-main-modal-space"></span>
+ <span>拍摄要求</span>
+ </div>
+ <div className="idcard-ocr-main-modal-img2">
+ <img src={idCardTip} alt="" />
+ </div>
+ <div className="modal-down-main-foot-button">
+ <div style={{ flex: 1 }}>
+ <UploadFile
+ onSuccessCallback={(e) => {
+ OCRsuccessCallback(e);
+ setVisible(false);
+ }}
+ OCRshow={true}
+ capture="camera"
+ >
+ <Button type="primary">立即拍摄</Button>
+ </UploadFile>
+ </div>
+ </div>
+ <div style={{ padding: '0 12px 24px 12px' }} className="modal-down-main-foot-button">
+ <Button
+ onClick={() => {
+ bottomOnclick('reset');
+ }}
+ style={{ flex: 1, marginRight: '8px' }}
+ >
+ 暂不拍摄
+ </Button>
+ <div style={{ flex: 1, marginLeft: '8px' }}>
+ <UploadFile
+ onSuccessCallback={(e) => {
+ OCRsuccessCallback(e);
+ setVisible(false);
+ }}
+ OCRshow={true}
+ >
+ <Button>使用手机照片</Button>
+ </UploadFile>
+ </div>
+ </div>
+ </Modal>
+ </>
+ );
+};
+
+export default IdcardOCR;
diff --git a/src/components/IdcardOCR/index.less b/src/components/IdcardOCR/index.less
new file mode 100644
index 0000000..9996af5
--- /dev/null
+++ b/src/components/IdcardOCR/index.less
@@ -0,0 +1,77 @@
+.idcard-ocr {
+ &-main {
+ flex: 1;
+ height: 48px;
+ border-radius: 5px;
+ background-color: #fff;
+ display: flex;
+ padding: 10px;
+ align-items: flex-start;
+ margin-right: 8px;
+ &-img {
+ // max-width: 54px;
+ max-width: 48px;
+ max-height: 48px;
+ opacity: 0.8;
+ margin-right: 8px;
+ }
+
+ &-title {
+ // line-height: 48px;
+ // text-align: left;
+ // height: 48px;
+ // width: 94px;
+ &-top {
+ color: #171a1d;
+ font-size: 14px;
+ line-height: 22px;
+ // height: 22px;
+ }
+ &-bottom {
+ font-size: 12px;
+ // transform: scale(0.83);
+ // transform-origin: 0 0;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 14px;
+ // height: 14px;
+ // width: 118px;
+ }
+ }
+ &-modal {
+ text-align: left;
+ padding: 12px;
+ &-m .dtm-modal-body {
+ padding: 0 !important;
+ }
+ &-space {
+ width: 3px;
+ height: 12px;
+ display: inline-block;
+ background: #007fff;
+ margin-right: 8px;
+ & span {
+ font-size: 14px;
+ }
+ }
+ &-img {
+ & img {
+ width: 120px;
+ }
+ }
+ &-img2 {
+ padding: 0 12px;
+ & img {
+ height: 72px;
+ width: 100%;
+ }
+ }
+ & .dtm-modal-title {
+ font-size: 16px;
+ }
+ }
+ }
+
+ &-main:last-child {
+ margin-right: 0;
+ }
+}
diff --git a/src/components/ImgShow/index.jsx b/src/components/ImgShow/index.jsx
new file mode 100644
index 0000000..de9c0ab
--- /dev/null
+++ b/src/components/ImgShow/index.jsx
@@ -0,0 +1,165 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-09 11:44:57
+ * @LastEditTime: 2024-12-01 17:01:39
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 附件展示组件
+ */
+import React, { useState, useEffect, useMemo, useRef } from 'react';
+import { appUrl, ax, openFiles, showToast, confirmModal } from '../../utils/utility';
+import { pdf, word, excel, file, delEliminate } from '../../assets/img';
+import MyModal from '../../components/MyModal';
+import { img_none } from '../../assets/icon';
+import './index.less';
+
+// 删除附件
+function delFileApi(id) {
+ return ax.request({ url: `sys/attachment/removeById?id=${id}`, type: 'get', service: 'ninex' });
+}
+
+/**
+ * fileType: string, // 附件类型，不传则默认是图片
+ * fileId: string, // 附件id
+ * img: string, // 当前展示图片(附件)接口格式链接一般是showUrl
+ * imageUrl: string, // 完整的图片(附件)链接
+ * allImg: array, [''], // 全部展示图片，便于图片查看
+ * title: string, // 标题
+ * noTitle: bool, // 是否有标题
+ * width: number, // 图片的宽度,高度
+ * isShowBig: bool, // 是否可以放大查看
+ * isDelete: bool, // 是否可以删除
+ * defaultImg:string //默认展示图片
+ * onDelCallback: func // 删除文件反馈函数
+ * noEllipsis：图片名称展示不折叠
+ */
+const ImgShow = ({
+ fileType = '22_00017-3',
+ fileId,
+ img,
+ imageUrl,
+ allImg = [],
+ title,
+ noTitle = false,
+ width = 54,
+ isShowBig = true,
+ isDelete = false,
+ defaultImg = img_none,
+ onDelCallback,
+ noEllipsis = false
+}) => {
+ const imgRef = useRef();
+
+ const [modalImg, setModalImg] = useState({ visible: false, url: '' });
+
+ // 判断附件链接
+ const imgUrl = imageUrl ? imageUrl : img ? `${appUrl.fileUrl}${img}` : null;
+
+ // 点击查看附件
+ function handleShowFile() {
+ console.log('11111');
+
+ if (!imgUrl || !isShowBig) return;
+ console.log(imgUrl);
+ // openFiles({ type: fileType, url: imgUrl, urls: allImg });
+ setModalImg({ visible: true, url: imgUrl })
+ }
+
+ // 点击删除附件
+ async function handleDelFile(value) {
+ confirmModal({
+ title: '删除附件确认',
+ subtitle: (
+ <span>
+ 确认删除该附件吗？
+ </span>
+ ),
+ okText: '确定删除',
+ onOk: async () => {
+ global.setSpinning(true);
+ const res = await delFileApi(fileId);
+ global.setSpinning(false);
+ if (res.type) {
+ showToast({ type: 'success', content: '删除成功' });
+ // console.log('删除成功onDelCallback');
+ onDelCallback && onDelCallback(fileId);
+ }
+ },
+ });
+
+ }
+
+ // 图片初始化
+ useEffect(() => {
+ if (imgUrl && fileType === '22_00017-3') {
+ let temp = new Image();
+ temp.src = imgUrl;
+ temp.onload = () => {
+ imgRef.current.src = imgUrl;
+ };
+ }
+ }, [imgUrl, fileType]);
+
+
+
+ // 判断除图片外的附件
+ const fileImg = useMemo(() => {
+ let img = '';
+ switch (fileType) {
+ case '22_00017-4':
+ img = word;
+ break;
+ case '22_00017-5':
+ img = excel;
+ break;
+ case '22_00017-6':
+ img = pdf;
+ break;
+ default:
+ img = file;
+ }
+ return img;
+ }, [fileType]);
+
+ return (
+ <div className="fileShow" style={{ width: `${width}px`, height: `${width}px` }}>
+ {fileType !== '22_00017-3' ? (
+ // 非图片
+ <div className="fileShow-elseFile">
+ <img src={fileImg} alt="" className="fileShow-img" />
+ </div>
+ ) : (
+ // 图片
+ <div className="fileShow-imgBox">
+ {!img && !imageUrl ? (
+ <img src={defaultImg} alt="" className="fileShow-img" />
+ ) : (
+ <img ref={imgRef} onClick={handleShowFile} src={defaultImg} alt="加载中..." className="fileShow-img" />
+ )}
+ </div>
+ )}
+ {/* 右上角删除icon */}
+ {isDelete && fileId && (
+ <div onClick={handleDelFile} className="fileShow-del">
+ {/* <EliminateFilled /> */}
+ <img style={{ width: '18px', height: '18px' }} src={delEliminate} alt="" />
+ </div>
+ )}
+ {/* 名称展示 */}
+ {!noTitle && (
+ <div className="fileShow-title">
+ <div className={'fileShow-title-text'}>{title || '未上传'}</div>
+ </div>
+ )}
+ <MyModal visible={modalImg.visible} center title="查看图片" onClose={() => setModalImg({ visible: false, url: '' })}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <img src={modalImg.url} alt="" style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
+ </div>
+ </MyModal>
+ </div>
+ );
+};
+
+export default ImgShow;
diff --git a/src/components/ImgShow/index.less b/src/components/ImgShow/index.less
new file mode 100644
index 0000000..d809541
--- /dev/null
+++ b/src/components/ImgShow/index.less
@@ -0,0 +1,54 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.fileShow {
+ position: relative;
+ border-radius: 2px;
+ background-color: @common_bg_color;
+ margin-top: 8px;
+
+ &-imgBox {
+ height: 100%;
+ width: 100%;
+ background-color: @common_bg_color;
+ }
+
+ &-img {
+ height: 100%;
+ width: 100%;
+ }
+
+ &-elseFile {
+ height: 100%;
+ width: 100%;
+ font-size: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-title {
+ position: absolute;
+ color: @common_bg_z1_color;
+ bottom: 0;
+ width: 100%;
+ height: 20px;
+ background: rgba(23, 26, 29, 0.6);
+ border-radius: 2px;
+ font-size: 12px;
+ line-height: 20px;
+ text-align: center;
+
+ &-text {
+ }
+
+
+ }
+
+ &-del {
+ font-size: 16px;
+ position: absolute;
+ color: @theme_danger1_color;
+ top: -8px;
+ right: -8px;
+ }
+}
\ No newline at end of file
diff --git a/src/components/Info/index.jsx b/src/components/Info/index.jsx
new file mode 100644
index 0000000..1113f91
--- /dev/null
+++ b/src/components/Info/index.jsx
@@ -0,0 +1,458 @@
+import React, { useState } from 'react';
+import { TelephoneOutlined } from 'dd-icons';
+import { Space } from 'dingtalk-design-mobile';
+import { dateFormat, myTimeFormat } from '../../utils/utility';
+import './index.less';
+import obj from '../../utils/selectOption';
+import {
+ coordinate_1,
+ coordinate_2,
+ PersonnelNews_1,
+ PersonnelNews_2,
+ assistHeading_1,
+ assistHeading_2,
+ assistHeading_3,
+ assistHeading_4,
+ assistHeading_5,
+ Residential_1,
+} from '../../assets/img';
+
+import ImgShow from '../../components/ImgShow';
+
+/**
+ * list: array, // 列表模型
+ * data: object, // 对象数据
+ * marginTop: bool, // 是否有上边距
+ * marginBottom: bool, // 是否有下边距
+ * detailClick: fun //查看按钮
+ * noPaddingTop:不要上面灰色间距
+ */
+const Info = ({
+ list,
+ data,
+ OnClick,
+ detailClick,
+ showButtons = true,
+ noPaddingTop = false,
+ showCard = false,
+ ChangeOnClick,
+ showCard1 = false,
+ showShow = false,
+ otherInfo = false,
+ showMain = false,
+ show1 = false,
+}) => {
+ function typeChange(x) {
+ switch (x.type) {
+ case 'text':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div className="Info-card-value">
+ {x.key ? (
+ <span>{x.key}</span>
+ ) : (
+ <>
+ {x.value === 'userTotal' || x.value === 'personAmount' ? (
+ <span>
+ {data[x.value] || 0}
+ {x.unit}
+ </span>
+ ) : x.value === 'onDuty' ? (
+ <span>{data[x.value] === 1 ? '是' : '否'}</span>
+ ) : data[x.value] !== null ? (
+ <span>{data[x.value] || '-'}</span>
+ ) : (
+ <span>-</span>
+ )}
+ </>
+ )}
+ {data[x.value] > 0 && x.value !== 'posCount' && x.clickableText && (
+ <span onClick={() => detailClick(x.title, data.coreId)} className="public-color">
+ {x.clickableText}
+ </span>
+ )}
+ </div>
+ </div>
+ );
+ case 'select':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div className="Info-card-value">
+ {x.key ? (
+ <span>{x.key}</span>
+ ) : (
+ <>
+ {data[x.value] !== null ? <span>{obj[x.value]?.find((item) => item.value === data[x.value])?.label || '-'}</span> : <span>-</span>}
+ </>
+ )}
+ {data[x.value] > 0 && x.value !== 'posCount' && x.clickableText && (
+ <span onClick={() => detailClick(x.title, data.coreId)} className="public-color">
+ {x.clickableText}
+ </span>
+ )}
+ </div>
+ </div>
+ );
+ case 'heading':
+ return (
+ <div className="Info-card-heading" style={{ paddingTop: x.paddingTop && '6px', paddingBottom: x.paddingBottom && '6px' }}>
+ {x.title}
+ </div>
+ );
+ case 'newHeading':
+ return <></>;
+ case 'newText':
+ return (
+ <div
+ style={{
+ display: 'flex',
+ flexWrap: 'wrap',
+ paddingRight: '20%',
+ background: '#fff',
+ gap: '8px',
+ paddingLeft: '16px',
+ paddingBottom: x.paddingBottom && '12px',
+ }}
+ >
+ <div className="Info-card-title">{x.title}</div>
+
+ {/* <div className='infoView-card-title'>
+ {x.title}
+ </div>
+ <div className="infoView-card-value">
+ {data[x.value] || '-'}
+ </div> */}
+ {x.list?.length > 0 &&
+ x.list?.map((item, index) => (
+ <div key={index} className="Info-card-value-posCount">
+ <div className="Info-card-value-posCount-number">
+ <div className="Info-card-value-posCount-number-first">{item.posName.charAt(0)}</div>
+ <div className="Info-card-value-posCount-number-second">{item.posName}</div>
+ <div className="Info-card-value-posCount-number-third">
+ <span onClick={() => detailClick()} className="public-color">
+ {x.clickableText}
+ </span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ case 'newText1':
+ return (
+ <div
+ style={{
+ display: 'flex',
+ flexWrap: 'wrap',
+ paddingRight: '20%',
+ background: '#fff',
+ gap: '8px',
+ paddingLeft: '16px',
+ paddingBottom: x.paddingBottom && '12px',
+ }}
+ >
+ <div className="Info-card-title">{x.title}</div>
+
+ {/* <div className='infoView-card-title'>
+ {x.title}
+ </div>
+ <div className="infoView-card-value">
+ {data[x.value] || '-'}
+ </div> */}
+ {x.list?.length > 0 &&
+ x.list?.map((item, index) => (
+ <div key={index} className="Info-card-value-posCount">
+ <div className="Info-card-value-posCount-number">
+ <div className="Info-card-value-posCount-number-first">{item.personName ? item.personName.charAt(0) : '-'}</div>
+ <div className="Info-card-value-posCount-number-second">{item.personName}</div>
+ <div className="Info-card-value-posCount-number-third">
+ <span
+ onClick={(v) => {
+ console.log(v, '11111111111');
+ ChangeOnClick('1');
+ }}
+ className="public-color"
+ >
+ {x.clickableText}
+ </span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ case 'hasMore':
+ return (
+ <div style={{ backgroundColor: '#fff' }} onClick={() => OnClick(x.title)}>
+ <div style={{ backgroundColor: '#fff', height: '12px' }}></div>
+ <div style={{ border: '1px solid rgba(126,134,142,0.16)', marginLeft: '12PX', marginRight: '12px' }}></div>
+ <div
+ style={{
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ color: '#007FFF',
+ paddingTop: '12px',
+ paddingBottom: '12px',
+ backgroundColor: '#fff',
+ }}
+ >
+ <div style={{ paddingRight: '8px' }}>{x.title}</div>
+ <img src={x.img} alt="" srcset="" style={{ width: '14px', height: '14px', verticalAlign: 'middle' }} />
+ </div>
+ </div>
+ );
+ case 'img':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div style={{ display: 'flex', gap: '8px' }}>
+ <ImgShow
+ fileType="22_00017-3"
+ title="身份证人像"
+ width={68} // 或者提供适当的width值
+ isShowBig={true} // 或者提供适当的isShowBig值
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ <ImgShow
+ fileType="22_00017-3"
+ title="身份证国徽"
+ width={68} // 或者提供适当的width值
+ isShowBig={true} // 或者提供适当的isShowBig值
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ </div>
+ </div>
+ );
+ case 'img1':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div style={{ display: 'flex', gap: '8px' }}>
+ <ImgShow noTitle={true} width={68} isShowBig={true} isDelete={false} />
+ </div>
+ </div>
+ );
+ case 'householdBook':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div style={{ display: 'flex', gap: '8px' }}>
+ <ImgShow
+ fileType="22_00017-2"
+ title="户口簿地址"
+ width={68}
+ isShowBig={true}
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ <ImgShow
+ fileType="22_00017-3"
+ title="户主页"
+ width={68} // 或者提供适当的width值
+ isShowBig={true} // 或者提供适当的isShowBig值
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ <ImgShow
+ fileType="22_00017-3"
+ title="本人页正面"
+ width={68} // 或者提供适当的width值
+ isShowBig={true} // 或者提供适当的isShowBig值
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ <ImgShow
+ fileType="22_00017-3"
+ title="本人页反面"
+ width={68} // 或者提供适当的width值
+ isShowBig={true} // 或者提供适当的isShowBig值
+ isDelete={false} // 或者提供适当的isDelete值
+ />
+ </div>
+ </div>
+ );
+ case 'assistCase':
+ return (
+ <>
+ {x.assistList.map((item, index) => (
+ <div style={{ backgroundColor: '#fff', paddingBottom: '12px' }}>
+ <div style={{ margin: '0px 16px ', backgroundColor: '#F2F2F2', borderRadius: '8px' }} key={index}>
+ <div style={{ display: 'flex', marginBottom: '4px' }}>
+ <img
+ style={{ width: '16px', height: '16px', margin: '12px 8px 0px 12px', paddingTop: '5px' }}
+ src={
+ item.assistType === '1'
+ ? assistHeading_1
+ : item.assistType === '3'
+ ? assistHeading_3
+ : item.assistType === '4'
+ ? assistHeading_4
+ : item.assistType === '5'
+ ? assistHeading_5
+ : item.assistType === '6'
+ ? Residential_1
+ : assistHeading_2
+ }
+ alt=""
+ srcSet=""
+ />
+ <div
+ style={{
+ fontSize: '16px',
+ margin: '12px 0px 0px 0px',
+ color:
+ item.assistType === '1'
+ ? '#007FFF'
+ : item.assistType === '3'
+ ? '#00B042'
+ : item.assistType === '4'
+ ? '#007FFF'
+ : item.assistType === '5'
+ ? '#FF9200'
+ : item.assistType === '6'
+ ? '#007FFF'
+ : '#FF9200',
+ }}
+ >
+ {item.assistTitle}
+ </div>
+ <div>{item.value}</div>
+ </div>
+
+ {item.assistTexts.map((text, idx) => (
+ <div key={idx}>
+ <div style={{ paddingTop: text.paddingTop && '12px', paddingBottom: text.paddingBottom && '12px', padding: '8px 12px 0px' }}>
+ <div className="Info-card-title">{text.title}</div>
+ <div style={{ fontSize: '14px', lineHeight: '24px', marginTop: '4px', paddingBottom: text.paddingBottom && '12px' }}>
+ {data[text.value] !== null ? data[text.value] : '-'}
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ ))}
+ </>
+ );
+
+ case 'label':
+ return (
+ <>
+ {x.labelContents.map((item, index) => (
+ <div className="Info-card" key={index}>
+ <div onClick={() => OnClick(x.type, index)} className={`Info-card-label ${item.labelType && 'Info-card-label-focus'}`}>
+ {item.houseaddress || '-'}
+ </div>
+ </div>
+ ))}
+ </>
+ );
+ case 'editor':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div style={{ display: 'flex' }}>
+ {data[x.value] && (
+ <>
+ <div className="infoView-card-value">{data[x.value]}</div>
+ </>
+ )}
+ {data[x.editorOption] && <div className="infoView-card-value">（{data[x.editorOption] || '-'}）</div>}
+ </div>
+ </div>
+ );
+ case 'divider':
+ return <div className="Info-card-divider public-space">{x.title}</div>;
+ case 'phone':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <Space align="center">
+ {data[x.value] && (
+ <>
+ <div className="Info-card-value">{data[x.value]}</div>
+ </>
+ )}
+ {data[x.phoneValue] ? <TelephoneOutlined /> : null}
+ {data[x.phoneValue] && <div className="Info-card-value">{data[x.phoneValue] || '-'}</div>}
+ </Space>
+ </div>
+ );
+ case 'number':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div className="Info-card-value">{data[x.value] || '-'}</div>
+ </div>
+ );
+ case 'time':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div className="infoView-card-value">{data[x.value] ? myTimeFormat(data[x.value], 'YYYY.M.D') : '-'}</div>
+ </div>
+ );
+ case 'rangeTime':
+ return (
+ <div className="Info-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ <div className="infoView-card-value">
+ {data[x.startValue] ? myTimeFormat(data[x.startValue], 'YYYY.M.D') : '-'}至
+ {data[x.endValue] ? myTimeFormat(data[x.endValue], 'YYYY.M.D') : '-'}
+ </div>
+ </div>
+ );
+ case 'diy':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="Info-card-title">{x.title}</div>
+ {x.value}
+ </div>
+ );
+ case 'build':
+ return;
+ default:
+ return;
+ }
+ }
+
+ return (
+ <div className={`Info ${otherInfo && 'Info-otherInfo'}`}>
+ <div className={`Info-main ${showMain && 'Info-main1'}`}>
+ {list.map((x, t) => {
+ return <div key={t}>{typeChange(x)}</div>;
+ })}
+ </div>
+
+ {showButtons && (
+ <div className="Info-foot">
+ <div
+ className="Info-foot-card"
+ onClick={(v) => {
+ console.log(v, '11111111111');
+ ChangeOnClick('1');
+ }}
+ >
+ <img style={{ width: '24px', height: '24px' }} src={showCard ? PersonnelNews_1 : PersonnelNews_2} alt="" srcset="" />
+ <div className={showCard ? 'public-color' : null}>人员信息</div>
+ </div>
+ <div
+ className="Info-foot-card"
+ onClick={(v) => {
+ console.log(v, '11111111111');
+ ChangeOnClick('2');
+ }}
+ >
+ <img style={{ width: '24px', height: '24px' }} src={showCard1 ? coordinate_2 : coordinate_1} alt="" srcset="" />
+ <div className={showCard1 ? 'public-color' : null}>居住信息</div>
+ </div>
+ </div>
+ )}
+
+ {showShow && <div style={{ paddingBottom: '16px' }}></div>}
+ {show1 && <div style={{ paddingTop: '16px' }}></div>}
+ </div>
+ );
+};
+
+export default Info;
diff --git a/src/components/Info/index.less b/src/components/Info/index.less
new file mode 100644
index 0000000..750c561
--- /dev/null
+++ b/src/components/Info/index.less
@@ -0,0 +1,169 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.Info {
+ display: flex;
+ flex-direction: column;
+ height: calc(100% - 52px);
+ padding-top: 8px;
+ overflow: hidden;
+
+ &-otherInfo {
+ height: calc(100% - 132px) !important;
+ }
+
+ &-main {
+ flex: 1;
+ overflow: scroll;
+ }
+
+ &-main1 {
+ flex: 1;
+ overflow: scroll;
+ background-color: #fff;
+ }
+
+ &-card {
+ background-color: #fff;
+ padding: 8px 16px 0px;
+
+ &-card1 {
+ background-color: #fff;
+ }
+
+ &-heading {
+ font-size: 18px;
+ color: #171a1d;
+ font-weight: 700;
+ line-height: 26px;
+ background-color: #fff;
+ padding: 8px 0 0 16px;
+ }
+
+ &-title {
+ width: 100%;
+ font-size: 14px;
+ line-height: 22px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+
+ // &-focusLabel {
+ // padding: 8px 12px;
+ // background-color: rgba(0, 127, 255, 0.12);
+ // border: 1px solid #007FFF;
+ // color: #007FFF;
+ // overflow: hidden;
+ // white-space: nowrap;
+ // text-overflow: ellipsis;
+ // border-radius: 4px;
+ // }
+
+ &-label {
+ padding: 8px 12px;
+ background-color: rgba(242, 242, 242, 1);
+ border: 1px solid rgba(126, 134, 142, 0.16);
+ color: rgba(23, 26, 29, 0.6);
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ border-radius: 4px;
+
+ &-focus {
+ border: 1px solid rgba(0, 127, 255, 1);
+ background-color: rgba(0, 127, 255, 0.12);
+ color: #007fff;
+ }
+ }
+
+ &-value {
+ font-size: 16px;
+ line-height: 24px;
+ padding-top: 4px;
+ color: #171a1d;
+
+ &-posCount {
+ &-number {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 8px;
+ background: #f2f2f6;
+ border-radius: 4px;
+
+ &-first {
+ display: flex;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ font-size: 14px;
+ font-weight: 400;
+ text-align: LEFT;
+ background-color: @theme_primary1_color;
+ color: #ffffff;
+ line-height: 22px;
+ border-radius: 4px;
+ }
+
+ &-second {
+ display: flex;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-Regular;
+ font-weight: 400;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ padding-left: 8px;
+ justify-content: center;
+ }
+
+ &-third {
+ display: flex;
+ font-size: 14px;
+ justify-content: center;
+ padding-left: 8px;
+ }
+ }
+ }
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ }
+
+ &-divider {
+ height: 8px;
+ }
+
+ &-img {
+ min-width: 18px;
+ min-height: 18px;
+ max-width: 18px;
+ max-height: 18px;
+ }
+ }
+
+ &-foot {
+ display: flex;
+ justify-content: space-around;
+ padding: 8px;
+ background-color: #fff;
+ margin-top: 16px;
+
+ &-card {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ }
+ }
+}
+
+.first-letter {
+ font-size: 32px;
+ /* 可根据需要调整字体大小 */
+ font-weight: 400;
+ /* 可选：加粗字体 */
+ color: rgba(0, 127, 255, 0.48);
+ vertical-align: middle;
+ /* 垂直居中对齐 */
+}
diff --git a/src/components/InfoView/index.jsx b/src/components/InfoView/index.jsx
new file mode 100644
index 0000000..af2a396
--- /dev/null
+++ b/src/components/InfoView/index.jsx
@@ -0,0 +1,359 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-08-22 09:09:28
+ * @LastEditTime: 2025-04-08 14:59:04
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState } from 'react';
+import { myTimeFormat, getAgeByIdcard } from '../../utils/utility';
+import { remove_1, modify_1, visit_1 } from '../../assets/img';
+import ModalNewContent from '../../components/ModalNewContent';
+import './index.less';
+
+/**
+ * list: array, // 列表模型
+ * data: object, // 对象数据
+ * marginTop: bool, // 是否有上边距
+ * marginBottom: bool, // 是否有下边距
+ * detailClick: fun //查看按钮
+ * noPaddingTop:不要上面灰色间距
+ */
+const InfoView = ({ list, data, OnClick, detailClick, showButtons = true, noPaddingTop = false, showCard = true }) => {
+ const [showModal, setShowModal] = useState({ visible: false, data: {} });
+
+ function typeChange(x) {
+ switch (x.type) {
+ case 'text':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">
+ {x.key ? (
+ <span>{x.key}</span>
+ ) : (
+ <>
+ {x.value === 'userTotal' || x.value === 'personAmount' ? (
+ <span>
+ {data[x.value] || 0}
+ {x.unit}
+ </span>
+ ) : data[x.value] !== null ? (
+ <span>{data[x.value] || '-'}</span>
+ ) : (
+ <span>-</span>
+ )}
+ </>
+ )}
+ {data[x.value] > 0 && x.value !== 'posCount' && x.clickableText && (
+ <span onClick={() => detailClick(x.title, data.coreId)} className="public-color">
+ {x.clickableText}
+ </span>
+ )}
+ </div>
+ </div>
+ );
+ case 'heading':
+ return (
+ <div className="infoView-card-heading" style={{ paddingTop: x.paddingTop && '6px', paddingBottom: x.paddingBottom && '6px' }}>
+ {x.title}
+ </div>
+ );
+
+ case 'headingTitle':
+ return (
+ <div className="infoView-card-headingTitle" style={{ paddingTop: x.paddingTop && '6px', paddingBottom: x.paddingBottom && '6px' }}>
+ {x.title}
+ </div>
+ );
+
+ case 'newText':
+ return (
+ <div style={{ display: 'flex', flexWrap: 'wrap', paddingRight: '20%', background: '#fff', gap: '8px', paddingLeft: '16px' }}>
+ {/* <div className='infoView-card-title'>
+ {x.title}
+ </div>
+ <div className="infoView-card-value">
+ {data[x.value] || '-'}
+ </div> */}
+ {x.list?.length > 0 &&
+ x.list?.map((item, index) => (
+ <div key={index} className="infoView-card-value-posCount">
+ <div className="infoView-card-value-posCount-number">
+ <div className="infoView-card-value-posCount-number-first">{item.posName.charAt(0)}</div>
+ <div className="infoView-card-value-posCount-number-second">{item.posName}</div>
+ <div className="infoView-card-value-posCount-number-third">
+ <span onClick={detailClick} className="public-color">
+ {x.clickableText}
+ </span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ case 'rowPersons':
+ return (
+ <div
+ style={{
+ display: 'flex',
+ paddingTop: '12px',
+ paddingBottom: '12px',
+ flexDirection: 'column',
+ flexWrap: 'wrap',
+ paddingRight: '24px',
+ background: '#fff',
+ gap: '8px',
+ paddingLeft: '16px',
+ }}
+ >
+ {x.list?.length > 0 &&
+ x.list?.map((item, index) => (
+ <div key={index} className="infoView-card-value-posCount">
+ <div style={{ width: '100%', justifyContent: 'space-between', padding: '0 8px' }} className="infoView-card-value-posCount-number">
+ <div style={{ display: 'flex' }}>
+ <div style={{ width: 'auto', padding: '0 4px' }} className="infoView-card-value-posCount-number-first">
+ {item.personName?.charAt(0)}
+ </div>
+ <div className="building-subtitle">
+ {/* <div style={{ padding: ' 0 4px ' }} className='infoView-card-value-posCount-number-second'>{item.personName}</div>
+ <div style={{ margin: '0' }} className="public-split" /> */}
+ <div style={{ padding: ' 0 4px ' }} className="infoView-card-value-posCount-number-second">
+ {item.sexDesc}
+ </div>
+ <div style={{ margin: '0' }} className="public-split" />
+ <div style={{ padding: ' 0 4px ' }} className="infoView-card-value-posCount-number-second">
+ {item.idcard ? getAgeByIdcard(item.idcard) : ''}
+ </div>
+ <div style={{ margin: '0' }} className="public-split" />
+ <div style={{ padding: ' 0 4px' }} className="infoView-card-value-posCount-number-second">
+ {item.idcard}
+ </div>
+ </div>
+ </div>
+ <div className="infoView-card-value-posCount-number-third">
+ <span onClick={() => setShowModal({ visible: true, data: item })} className="public-color">
+ {x.clickableText}
+ </span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ case 'hasMore':
+ return (
+ <div style={{ backgroundColor: '#fff' }} onClick={() => OnClick(x.title)}>
+ <div style={{ backgroundColor: '#fff', height: '12px' }}></div>
+ <div style={{ border: '1px solid rgba(126,134,142,0.16)', marginLeft: '12PX', marginRight: '12px' }}></div>
+ <div
+ style={{
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ color: '#007FFF',
+ paddingTop: '12px',
+ paddingBottom: '12px',
+ backgroundColor: '#fff',
+ }}
+ >
+ <div style={{ paddingRight: '8px' }}>{x.title}</div>
+ <img src={x.img} alt="" srcset="" style={{ width: '14px', height: '14px', verticalAlign: 'middle' }} />
+ </div>
+ </div>
+ );
+ case 'divider':
+ return <div className="public-space">{x.title}</div>;
+ case 'editor':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div style={{ display: 'flex' }}>
+ {data[x.value] && (
+ <>
+ <div className="infoView-card-value">{data[x.value]}</div>
+ </>
+ )}
+ {data[x.editorOption] && <div className="infoView-card-value">（{data[x.editorOption] || '-'}）</div>}
+ </div>
+ </div>
+ );
+ case 'number':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">{data[x.value] || '-'}</div>
+ </div>
+ );
+ case 'time':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">{data[x.value] ? myTimeFormat(data[x.value], 'YYYY.M.D') : '-'}</div>
+ </div>
+ );
+ case 'switch':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">
+ <span>{data[x.value] === 1 ? '是' : data[x.value] === 2 ? '否' : '-'}</span>
+ </div>
+ </div>
+ );
+
+ case 'diy':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ {x.value}
+ </div>
+ );
+ case 'build':
+ return;
+ default:
+ return;
+ }
+ }
+
+ return (
+ <div className={`infoView ${noPaddingTop && 'infoView-noPadding'}`}>
+ <div className="infoView-main">
+ {list.map((x, t) => {
+ return <div key={t}>{typeChange(x)}</div>;
+ })}
+ </div>
+
+ {showButtons && (
+ <div>
+ <div className="newFoot">
+ {/* <div
+ className='newFoot-item'
+ onClick={() => { OnClick('del') }}
+ >
+ <img
+ className='newFoot-img'
+ src={remove_1}
+ alt=""
+ srcset=""
+ />
+ </div> */}
+ <div
+ className="newFoot-itemEdit"
+ onClick={() => {
+ OnClick('edit');
+ }}
+ >
+ <img className="newFoot-img" src={modify_1} alt="" srcset="" />
+ </div>
+ </div>
+ {showCard && <div style={{ height: '18px', backgroundColor: '' }}></div>}
+ </div>
+ // <div className='infoView-foot-button'>
+ // <Button
+ // onClick={() => { OnClick('del') }}
+ // className='infoView-foot-button-del'
+ // style={{ flex: 1, marginRight: '8px', border: '1px solid #F5222D', color: '#F5222D' }}
+ // >
+ // 删除
+ // </Button>
+ // <Button
+ // className='infoView-foot-button-edit'
+ // type="primary" onClick={() => {
+ // OnClick('edit');
+ // }}>
+ // 修改
+ // </Button>
+ // </div>
+ )}
+ <ModalNewContent
+ headStyle={{ textAlign: 'center' }}
+ footBackground={false}
+ onOk={false}
+ content={
+ <>
+ {/* <div className='ModalLContent-head' style={{ textAlign: 'center' }} >走访样图111</div> */}
+ <div className="ModalLContent-content" style={{ backgroundColor: '#fff', borderRadius: '10px 10px' }}>
+ <div style={{ padding: '0px 16px 16px 16px' }}>
+ <div style={{ paddingTop: '6px' }}>
+ <div className="infoView-card">
+ <div className="infoView-card-title">姓名</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.personName}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">性别</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.sexCode || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">证件类型</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.permitTypeDesc || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">身份证号</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.idcard}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">民族</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.nationalDesc}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">学历</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.educationDesc || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">人员类型</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.personTypeDesc || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">籍贯编码</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.birthplaceDesc || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">年龄</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.age || '-'}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">出生日期</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.birthdate}</span>
+ </div>
+ </div>
+ <div className="infoView-card">
+ <div className="infoView-card-title">地址</div>
+ <div className="infoView-card-value">
+ <span>{showModal?.data?.personAddress}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </>
+ }
+ visible={showModal.visible}
+ visibleOnClick={() => setShowModal({ visible: false, data: {} })}
+ />
+ </div>
+ );
+};
+
+export default InfoView;
diff --git a/src/components/InfoView/index.less b/src/components/InfoView/index.less
new file mode 100644
index 0000000..3584a4f
--- /dev/null
+++ b/src/components/InfoView/index.less
@@ -0,0 +1,213 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.infoView {
+ display: flex;
+ flex-direction: column;
+ // height: calc(100% - 52px);
+ padding-top: 8px;
+ overflow: hidden;
+
+ &-noPadding {
+ padding: 0 !important;
+ }
+
+ &-main {
+ flex: 1;
+ overflow: scroll;
+ }
+
+ &-card {
+ background-color: #fff;
+ padding: 8px 16px 0px;
+ font-size: 14px;
+
+ &-card1 {
+ background-color: #fff;
+ }
+
+ &-heading {
+ font-size: 18px;
+ color: #171a1d;
+ font-weight: 700;
+ line-height: 26px;
+ background-color: #fff;
+ padding: 8px 0 0 16px;
+ }
+
+ &-headingTitle {
+ font-size: 18px;
+ color: #171a1d;
+ font-weight: 700;
+ line-height: 26px;
+ background-color: #f2f2f2;
+ padding: 8px 0 0 16px;
+ }
+
+ &-title {
+ font-size: 14px;
+ line-height: 22px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+
+ &-value {
+ font-size: 15px;
+ line-height: 23px;
+ color: #171a1d;
+ margin-top: 4px;
+ background-color: #fff;
+ &-posCount {
+ &-number {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 126px;
+ height: 36px;
+ background: #f2f2f6;
+ border-radius: 4px;
+
+ &-first {
+ display: flex;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ font-size: 14px;
+ font-weight: 400;
+ text-align: LEFT;
+ background-color: @theme_primary1_color;
+ color: #ffffff;
+ line-height: 22px;
+ border-radius: 4px;
+ }
+
+ &-second {
+ display: flex;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-Regular;
+ font-weight: 400;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ padding-left: 8px;
+ justify-content: center;
+ }
+
+ &-third {
+ display: flex;
+ font-size: 14px;
+ justify-content: center;
+ padding-left: 8px;
+ }
+ }
+ }
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ }
+
+ &-divider {
+ height: 8px;
+ }
+
+ &-img {
+ min-width: 18px;
+ min-height: 18px;
+ max-width: 18px;
+ max-height: 18px;
+ }
+ }
+
+ &-foot-button {
+ background-color: #fff;
+ padding: 12px 16px;
+ display: flex;
+ justify-content: center;
+ margin-top: 16px;
+
+ &-del {
+ flex: 1;
+ margin-right: 8px;
+ border: 1px solid #f5222d;
+ color: #f5222d;
+ font-size: 16px;
+ }
+
+ &-edit {
+ flex: 1;
+ font-size: 16px;
+ }
+ }
+}
+
+.management {
+ &-add {
+ &-form {
+ display: flex;
+ flex-direction: column;
+ height: calc(100vh - 44px);
+
+ &-main {
+ flex: 1 1;
+ overflow: hidden;
+ padding-bottom: 16px;
+ }
+
+ &-item {
+ height: 100%;
+ overflow: scroll;
+ }
+
+ &-button {
+ background-color: #fff;
+ padding: 12px;
+ }
+ }
+ }
+}
+
+.first-letter {
+ font-size: 32px;
+ /* 可根据需要调整字体大小 */
+ font-weight: 400;
+ /* 可选：加粗字体 */
+ color: rgba(0, 127, 255, 0.48);
+ vertical-align: middle;
+ /* 垂直居中对齐 */
+}
+
+.newFoot {
+ position: fixed;
+ bottom: 102px;
+ right: 18px;
+
+ &-item {
+ width: 44px;
+ height: 44px;
+ border-radius: 50%;
+ margin-bottom: 18px;
+ background-color: #e41100;
+ }
+
+ &-itemEdit {
+ width: 44px;
+ height: 44px;
+ border-radius: 50%;
+ background-color: #0089ff;
+ }
+
+ &-img {
+ width: 33px;
+ height: 33px;
+ position: absolute;
+ top: 6px;
+ left: 5px;
+ }
+ &-img1 {
+ width: 33px;
+ height: 33px;
+ position: absolute;
+ top: 66px;
+ left: 5px;
+ }
+}
diff --git a/src/components/InfoViewModal/index.jsx b/src/components/InfoViewModal/index.jsx
new file mode 100644
index 0000000..f71c22a
--- /dev/null
+++ b/src/components/InfoViewModal/index.jsx
@@ -0,0 +1,104 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-08-22 09:09:28
+ * @LastEditTime: 2023-10-18 14:47:38
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState } from 'react';
+import { TelephoneOutlined } from 'dd-icons';
+import { Space, Button } from 'dingtalk-design-mobile';
+import { dateFormat } from '../../utils/utility';
+import './index.less';
+
+/**
+ * list: array, // 列表模型
+ * data: object, // 对象数据
+ * marginTop: bool, // 是否有上边距
+ * marginBottom: bool, // 是否有下边距
+ * detailClick: fun //查看按钮
+ */
+const InfoViewModal = ({ list, data, OnClick, detailClick, showButtons = true }) => {
+
+
+ function typeChange(x) {
+ switch (x.type) {
+ case 'text':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">
+ {x.value === "userTotal" || x.value === 'personAmount' ? (
+ <span>
+ {data[x.value] || 0}{x.unit}
+ </span>
+ ) : x.value === 'onDuty' ? (
+ <span>
+ {data[x.value] === 1 ? '是' : '否'}
+ </span>
+ ) : (
+ data[x.value] !== null ? (
+ <span>
+ {data[x.value]}
+ </span>
+ ) : (
+ <span>-</span>
+ )
+ )}
+
+ {data[x.value] > 0 && x.value !== 'posCount' && x.clickableText && (
+ <span onClick={() => detailClick(x.title, data.coreId)} className='public-color'> {x.clickableText}</span>
+ )}
+ </div>
+ </div >
+ );
+ case 'time':
+ return (
+ <div className="infoView-card" style={{ paddingTop: x.paddingTop && '12px', paddingBottom: x.paddingBottom && '12px' }}>
+ <div className="infoView-card-title">{x.title}</div>
+ <div className="infoView-card-value">{data[x.value] ? dateFormat(data[x.value]) : '-'}</div>
+ </div >
+ );
+ case 'build':
+ return;
+ default:
+ return;
+ }
+ }
+
+
+ return (
+ <div className="infoView1">
+ <div className="infoView1-main" >
+ {list.map((x, t) => {
+ return <div key={t}>{typeChange(x)}</div>;
+ })}
+ </div>
+
+ {showButtons && (
+ <div className='infoView-foot-button'>
+ <Button
+ onClick={() => { OnClick('del') }}
+ className='infoView-foot-button-del'
+ style={{ flex: 1, marginRight: '8px', border: '1px solid #F5222D', color: '#F5222D' }}
+ >
+ 删除
+ </Button>
+ <Button
+ className='infoView-foot-button-edit'
+ type="primary" onClick={() => {
+ OnClick('edit');
+ }}>
+ 修改
+ </Button>
+ </div>
+ )}
+ </div>
+ )
+
+};
+
+
+export default InfoViewModal;
\ No newline at end of file
diff --git a/src/components/InfoViewModal/index.less b/src/components/InfoViewModal/index.less
new file mode 100644
index 0000000..efd16f1
--- /dev/null
+++ b/src/components/InfoViewModal/index.less
@@ -0,0 +1,149 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.infoView {
+ display: flex;
+ flex-direction: column;
+ height: calc(100% - 52px);
+ overflow: hidden;
+
+ &-main {
+ flex: 1;
+ overflow: scroll;
+ }
+
+ &-card {
+ background-color: #fff;
+ padding: 8px 16px 0px;
+
+ &-title {
+ font-size: 14px;
+ line-height: 22px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+
+ &-value {
+ font-size: 16px;
+ line-height: 24px;
+ margin-top: 4px;
+ color: #171a1d;
+
+ &-posCount {
+ &-number {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 126px;
+ height: 36px;
+ background: #f2f2f6;
+ border-radius: 4px;
+
+ &-first {
+ display: flex;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ font-size: 14px;
+ font-weight: 400;
+ text-align: LEFT;
+ background-color:@theme_primary1_color;
+ color: #ffffff;
+ line-height: 22px;
+ border-radius: 4px;
+ }
+
+ &-second {
+ display: flex;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-Regular;
+ font-weight: 400;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ padding-left: 8px;
+ justify-content: center;
+ }
+ &-third{
+ display: flex;
+ font-size: 14px;
+ justify-content: center;
+ padding-left: 8px;
+ }
+ }
+ }
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ }
+
+ &-divider {
+ height: 8px;
+ }
+
+ &-img {
+ min-width: 18px;
+ min-height: 18px;
+ max-width: 18px;
+ max-height: 18px;
+ }
+ }
+
+ &-foot-button {
+ background-color: #fff;
+ padding: 12px 16px;
+ display: flex;
+ justify-content: center;
+ margin-top: 16px;
+
+ &-del {
+ flex: 1;
+ margin-right: 8px;
+ border: 1px solid #f5222d;
+ color: #f5222d;
+ font-size: 16px;
+ }
+
+ &-edit {
+ flex: 1;
+ font-size: 16px;
+
+ }
+ }
+}
+
+.management {
+ &-add {
+ &-form {
+ display: flex;
+ flex-direction: column;
+ height: calc(100vh - 44px);
+
+ &-main {
+ flex: 1 1;
+ overflow: hidden;
+ padding-bottom: 16px;
+ }
+
+ &-item {
+ height: 100%;
+ overflow: scroll;
+ }
+
+ &-button {
+ background-color: #fff;
+ padding: 12px;
+ }
+ }
+ }
+}
+
+.first-letter {
+ font-size: 32px;
+ /* 可根据需要调整字体大小 */
+ font-weight: 400;
+ /* 可选：加粗字体 */
+ color: rgba(0, 127, 255, 0.48);
+ vertical-align: middle;
+ /* 垂直居中对齐 */
+}
\ No newline at end of file
diff --git a/src/components/ModalBottomDownYear/index.jsx b/src/components/ModalBottomDownYear/index.jsx
new file mode 100644
index 0000000..2635408
--- /dev/null
+++ b/src/components/ModalBottomDownYear/index.jsx
@@ -0,0 +1,76 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-16 08:50:50
+ * @LastEditTime: 2023-02-16 10:06:22
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 底部选择器
+ */
+import React from 'react';
+import { Drawer, Button, List, Picker } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined } from 'dd-icons';
+import './index.less';
+
+/**
+ * visible: bool, // 显隐
+ * onClose: func, // 关闭方法
+ * title: string, // 弹窗标题
+ * body// 自定义内容
+ */
+
+const years = new Array(new Date().getFullYear() - (new Date().getFullYear() - 10)).fill(0).map((item, i) => ({ label: String(new Date().getFullYear() - 9 + i) + '年' }))
+const ModalBottomDownYear = ({
+ visible,
+ title = "",
+ onClose,
+ onOkClick,
+ onCancel,
+ onChange,
+}) => {
+ return (
+ // <Drawer
+ // size="large"
+ // visible={visible}
+ // title={title}
+ // actions={[{
+ // text: '确定',
+ // type: 'ok',
+ // onClick: () => { onOkClick(); }
+ // }, {
+ // text: '取消',
+ // type: 'cancel',
+ // onClick: () => { onCancel(); }
+ // }]} onVisibleChange={onClose} >
+ // <div className="modalBottomDownYear">
+ // <div className='modalBottomDownYear-head'>
+ // <CloseBoldOutlined />
+ // <div className='modalBottomDownYear-head-text'>确定</div>
+ // </div>
+ // <div className='modalBottomDownYear-main'>
+ // {
+ // years.map((item, idx) => (
+ // <div className='modalBottomDownYear-main-title' key={idx}>{item.label}</div>
+ // ))
+ // }
+ // <div className='modalBottomDownYear-main-focus'></div>
+ // </div>
+ // <div className='modalBottomDownYear-bottom'></div>
+ // </div>
+ // </Drawer>
+ <Picker
+ data={years}
+ cols={1}
+ visible={true}
+ title="季度"
+ okText="确定"
+ value={2022}
+ onChange={(e) => { console.log(e); }}
+ extra="请选择(可选)"
+ >
+ <List.Item arrow="horizontal">标题文字</List.Item>
+ </Picker>
+ );
+};
+
+export default ModalBottomDownYear;
diff --git a/src/components/ModalBottomDownYear/index.less b/src/components/ModalBottomDownYear/index.less
new file mode 100644
index 0000000..1681254
--- /dev/null
+++ b/src/components/ModalBottomDownYear/index.less
@@ -0,0 +1,43 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.modalBottomDownYear {
+ height: 314px;
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ &-head {
+ display: flex;
+ padding: 15px 16px;
+ justify-content: space-between;
+ align-items: center;
+ &-text {
+ font-size: 14px;
+ line-height: 22px;
+ color: #0089ff;
+ }
+ }
+
+ &-main {
+ flex: 1;
+ overflow: auto;
+ height: 228px;
+ text-align: center;
+
+ &-title {
+ font-size: 16px;
+ line-height: 33px;
+ }
+ &-focus {
+ position: absolute;
+ height: 33px;
+ border-top: 1px solid rgba(126, 134, 142, 0.16);
+ border-bottom: 1px solid rgba(126, 134, 142, 0.16);
+ top: 115px;
+ width: 100%;
+ }
+ }
+
+ &-bottom {
+ height: 34px;
+ }
+}
diff --git a/src/components/ModalContent/index.jsx b/src/components/ModalContent/index.jsx
new file mode 100644
index 0000000..7627cf2
--- /dev/null
+++ b/src/components/ModalContent/index.jsx
@@ -0,0 +1,34 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2022-08-19 11:42:24
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 右上角更多操作显示
+ */
+import React from 'react';
+import MyModal from '../MyModal';
+import './index.less';
+
+const ModalContent = ({ data, visible, visibleOnClick }) => {
+ return (
+ <MyModal visible={visible} center width={280} onClose={() => visibleOnClick('', false)}>
+ <div className="modalContent">
+ {data.list &&
+ data.list.map((item, index) => {
+ return (
+ <div onClick={() => visibleOnClick(item, false)} key={index} className="modalContent-item">
+ {item.title}
+ </div>
+ );
+ })}
+ </div>
+ <div className="modalContent-bottom" onClick={() => visibleOnClick('', false)}>
+ 取消
+ </div>
+ </MyModal>
+ );
+};
+
+export default ModalContent;
diff --git a/src/components/ModalContent/index.less b/src/components/ModalContent/index.less
new file mode 100644
index 0000000..cc6b0a4
--- /dev/null
+++ b/src/components/ModalContent/index.less
@@ -0,0 +1,24 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.modalContent {
+ padding-top: 12px;
+
+ &-item {
+ padding: 8px;
+ margin-bottom: 4px;
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ &-item:last-child {
+ margin-bottom: 0;
+ }
+
+ &-bottom {
+ color: @theme_primary1_color;
+ margin-top: 12px;
+ padding: 0 8px;
+ text-align: right;
+ line-height: 22px;
+ }
+}
diff --git a/src/components/ModalDown copy/index.jsx b/src/components/ModalDown copy/index.jsx
new file mode 100644
index 0000000..e7fba67
--- /dev/null
+++ b/src/components/ModalDown copy/index.jsx
@@ -0,0 +1,455 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2024-01-15 09:05:24
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 底部弹窗
+ */
+import React, { useEffect, useState } from 'react';
+import { DownArrow2Outlined } from 'dd-icons';
+import { Drawer, Button, DatePicker, InputItem, Picker, List } from 'dingtalk-design-mobile';
+import './index.less';
+import { getCountTime, myTimeFormat, hkRegion, moment } from '../../utils/utility';
+import obj from '../../utils/selectOption';
+import { modalDown_1 } from '../../assets/img';
+
+const ModalDown = ({
+ headContent,
+ dataList = [],
+ title,
+ visible,
+ visibleOnClick,
+ onChange, //点击筛选条件回调事件
+ onConfirm,
+ onReset,
+ extraContent, // 自定义内容
+ actionContent, // 自定义底部操作区
+ isAction = true,
+ cancelText = '重置',
+ okText = '确定',
+}) => {
+ const [screenList, setScreenList] = useState();
+
+ const [oldScreenList, setOldScreenList] = useState();
+
+ function screenListChange(list, value, index, label, key, type) {
+ console.log('list, value, index, label, key', list, value, index, label, key);
+ onChange && onChange(list, value, index, label, key, type);
+ }
+
+ // 选择筛选条件
+ function handleChange(value, index, label, key) {
+ if (screenList[index].key === 'dateTime' || screenList[index].key === 'ageRange' || screenList[index].key === 'censusTest' || screenList[index].key === 'nationalTest' || screenList[index].key === 'createTime' || screenList[index].key === 'newCreateTime' || screenList[index].key === 'area') {
+ // 自定义时间范围选择处理 - 选择显隐开始时间和结束时间
+ if (value === 'customTime' && screenList[index].value !== 'customTime') {
+ screenList[index].customTime = true;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'customTime' && screenList[index].value === 'customTime') {
+ screenList[index].customTime = false;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ x.value = '';
+ }
+ });
+ }
+ if (value === 'custom' && screenList[index].value !== 'custom') {
+ screenList[index].custom = true;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'custom' && screenList[index].value === 'custom') {
+ screenList[index].custom = false;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ x.value = '';
+ }
+ });
+ }
+
+ // 综治领导责任制
+ if (value === 'customYear') {
+ screenList[index].customTime = true;
+ screenList[index].select = screenList[index]?.select.filter(item => item.key !== 'noCustomYear')
+ screenList[index]?.select.forEach((x) => {
+ if (x.key === 'customYear' && x.display) {
+ x.display = 'block';
+ }
+ if (x.key !== 'customYear' && x.display) {
+ x.display = 'none';
+ }
+ });
+ }
+ if (value === 'customTimeRange') {
+ screenList[index].customTime = true;
+ screenList[index]?.select.splice(3, 0, { value: '', key: 'noCustomYear' })
+ screenList[index]?.select.forEach((x) => {
+ if (x.key === 'customYear' && x.display) {
+ x.display = 'none';
+ }
+ if (x.key !== 'customYear' && x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'customTimeRange' && value !== 'customYear' && key === 'newCreateTime') {
+ if (screenList[index]?.select?.length === 6) {
+ screenList[index]?.select.splice(3, 0, { value: '', key: 'noCustomYear' })
+ }
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ }
+ });
+ }
+ }
+ let arr = screenList.map((item, i) => ({ ...item, value: i === index ? value : item.value, label: i === index ? label : item.label }));
+ setScreenList(arr);
+ screenListChange(arr, value, index, label, key);
+ }
+
+ // 时间选择
+ function changeDatePicker(value, index, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, key === 'startTime' ? 'YYYY-MM-DD' : 'YYYY-MM-DD');
+ setScreenList([...screenList]);
+ }
+
+ // 年月选择器
+ function changeYearMonthPicker(value, index, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, 'YYYY.MM');
+ setScreenList([...screenList]);
+ }
+
+ // 时间登记时间选择器
+ function changeNameDatePicker(name, value, index, label, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, key === 'createTimeStart' ? 'YYYY-MM-DD' : 'YYYY-MM-DD');
+ setScreenList([...screenList]);
+ screenListChange(screenList, item.value, index, label, key);
+ }
+
+ // 自定义输入框或选择框回填
+ function changeValue(type, value, index, label, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ if (type === 'select') {
+ item.value = value.splice(',');
+ } else {
+ item.value = value
+ }
+ setScreenList([...screenList]);
+ screenListChange(screenList, item.value, index, label, key, type);
+ }
+
+ // 重置
+ function resetOnclick() {
+ let list = JSON.parse(JSON.stringify(oldScreenList));
+ setScreenList(list);
+ let result = {},
+ resultName = {};
+ list.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ result[x.key] = !x.value
+ ? ''
+ : x.value === 'customTime'
+ ? {
+ start: x.select.filter((item) => item.key === 'startTime')[0].value,
+ end: x.select.filter((item) => item.key === 'endTime')[0].value,
+ }
+ : getCountTime(x.value);
+ } else {
+ result[x.key] = x.value;
+ resultName[x.key] = x.label;
+ }
+ });
+
+ !!onReset && onReset(result, list, resultName);
+ }
+
+ // 点击确定
+ function searchOnclick() {
+ let result = {},
+ resultName = {};
+ screenList.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ result[x.key] = !x.value
+ ? ''
+ : x.value === 'customTime'
+ ? {
+ start: x.select.filter((item) => item.key === 'startTime')[0].value,
+ end: x.select.filter((item) => item.key === 'endTime')[0].value,
+ }
+ : '';
+ } else {
+ result[x.key] = x.value;
+ resultName[x.key] = x.label;
+ }
+ });
+ !!onConfirm && onConfirm(result, screenList, resultName);
+ }
+
+ useEffect(() => {
+ if (dataList.length !== 0 && visible) {
+ if (!oldScreenList) {
+ // setOldScreenList(JSON.parse(JSON.stringify(dataList)));
+ let value = JSON.parse(JSON.stringify(dataList));
+ setOldScreenList([...value]);
+ }
+ setScreenList(dataList);
+ }
+ }, [dataList, visible]);
+
+ // DatePicker的自定义元素
+ const CustomChildren = ({ onClick, children, className, type }) => (
+ <div className={type === 'endTime' ? 'modal-down-endPicker' : ''}>
+ <Button size="middle" onClick={onClick}>
+ <div className={className}>{children}</div>
+ </Button>
+ </div>
+ );
+
+ // 筛选的元素判断
+ const renderItem = (data, item, index) => {
+ if (!data.label) {
+ return <div />;
+ } else if (data.type === 'DatePicker') {
+ return (
+ <DatePicker mode="date" value={null} title={data.title} onChange={(date) => changeDatePicker(date, index, data.key)}>
+ <CustomChildren className={data.value ? '' : 'modal-down-subtitle'} type={data.key}>
+ {data.value || data.label}
+ </CustomChildren>
+ </DatePicker>
+ );
+ } else if (data.type === 'yearMonthDatePicker') {
+ return (
+ <DatePicker mode="month" value={null} title={data.title} onChange={(date) => changeYearMonthPicker(date, index, data.key)}>
+ <CustomChildren className={data.value ? '' : 'modal-down-subtitle'} type={data.key}>
+ {data.value || data.label}
+ </CustomChildren>
+ </DatePicker>
+ );
+ } else if (data.type === 'createTime') {
+ return (
+ <div className='modal-down-input modal-down-input-relative'>
+ {
+ data.key === 'createTimeEnd' &&
+ <div className='modal-down-input-absolute'>至</div>
+ }
+ <div style={{ height: '30px', flex: '1' }}>
+ <div>
+ <DatePicker mode="date" extra={<span className="select-color">{data.label}</span>} value={data.value ? new Date(data.value) : null} title={data.title} onChange={(date) => changeNameDatePicker('createTime', date, index, data.label, data.key)}>
+ <List.Item arrow="horizontal" className='select-color_1'>
+ </List.Item>
+ </DatePicker>
+ </div>
+ </div>
+
+ <div className='modal-down-input-img'><img src={modalDown_1} alt="" /></div>
+ </div >
+ );
+ } else if (data.type === 'Input') {
+ return (
+ <div className='modal-down-input modal-down-input-relative'>
+ {
+ data.key === 'ageEnd' &&
+ <div className='modal-down-input-absolute'>至</div>
+ }
+ <InputItem type='number' className='modal-down-input-relative' placeholder={data.label} title={data.title} onChange={(value) => changeValue('input', value, index, data.label, data.key)}>
+ </InputItem>
+ <div className='modal-down-input-img'><img src={modalDown_1} alt="" /></div>
+ </div >
+ );
+ } else if (data.type === 'district') {
+ return (
+ <div className='modal-down-input' style={{ height: '30px' }}>
+ <div style={{ flex: '1' }}>
+ <Picker
+ data={hkRegion}
+ cols={3}
+ placeholder={data.label}
+ title={data.title}
+ okText="确定"
+ cascade={true}
+ value={data.value ? data.value : []}
+ extra={<span className="select-color">请选择</span>}
+ onChange={(e) => {
+ changeValue('select', e, index, data.label, data.key)
+ }}
+ >
+ <List.Item arrow="horizontal" className='select-color_1'>
+ </List.Item>
+ </Picker>
+ </div>
+ <div className='modal-down-input-img'><img src={modalDown_1} alt="" /></div>
+ </div >
+
+
+ )
+ } else if (data.type === 'select') {
+ return (
+ <div className='modal-down-input' style={{ height: '30px' }}>
+ <div style={{ flex: '1' }}>
+ <Picker
+ data={data.selectList}
+ cols={1}
+ placeholder={data.label}
+ title={data.title}
+ okText="确定"
+ cascade={true}
+ value={data.value ? data.value : []}
+ extra={<span className="select-color">请选择</span>}
+ onChange={(e) => {
+ changeValue('select', e, index, data.label, data.key)
+ }}
+ >
+ <List.Item arrow="horizontal" className='select-color_1'>
+ </List.Item>
+ </Picker>
+ </div>
+ <div className='modal-down-input-img'><img src={modalDown_1} alt="" /></div>
+ </div >
+
+
+ )
+ } else if (data.type === 'gridSelect') {
+ // 区域
+ return (
+ <div className='modal-down-input' style={{ height: '30px' }}>
+ <div style={{ flex: '1' }}>
+ <Picker
+ data={[
+ {
+ label: '市辖区',
+ value: '460101',
+ },
+ {
+ label: '秀英区',
+ value: '460105',
+ },
+ {
+ label: '龙华区',
+ value: '460106',
+ },
+ {
+ label: '琼山区',
+ value: '460107',
+ },
+ {
+ label: '美兰区',
+ value: '460108',
+ },
+ ]}
+ cols={1}
+ placeholder={data.label}
+ title={'区域'}
+ okText="确定"
+ cascade={true}
+ value={data.value ? data.value : []}
+ extra={<span className="select-color">请选择</span>}
+ onChange={(e) => {
+ changeValue('select', e, index, data.label, data.key)
+ }}
+ >
+ <List.Item arrow="horizontal" className='select-color_1'>
+ </List.Item>
+ </Picker>
+ </div>
+ <div className='modal-down-input-img'><img src={modalDown_1} alt="" /></div>
+ </div >
+ )
+ }
+ else if (data.type === 'mapChange') {
+ return (
+ <div
+ onClick={() => handleChange(data.value, index, data.label, item.key)}
+ className={`modal-down-mapItem ${item.value === data.value ? 'modal-down-mapItem-active' : ''}`}
+ >
+ <div className="modal-down-mapItem-imgBox">
+ <img src={data.img} alt="" />
+ </div>
+ <div>{data.label}</div>
+ </div>
+ );
+ } else {
+ return (
+ <Button
+ name={data.label}
+ size="middle"
+ onClick={() => handleChange(data.value, index, data.label, item.key)}
+ type={item.value === data.value ? 'primary' : 'secondary'}
+ >
+ {data.label}
+ </Button>
+ );
+ }
+ };
+
+ return (
+ <Drawer visible={visible} onVisibleChange={visibleOnClick} className="modal-down">
+ <div className="modal-down-main">
+ {!headContent && (
+ <>
+ <div className="modal-down-main-head">
+ <DownArrow2Outlined onClick={visibleOnClick} />
+ <div className="modal-down-main-head-title">{title || '筛选'}</div>
+ </div>
+ <div className="modal-down-main-divider"></div>
+ </>
+ )}
+ <div className="modal-down-main-overflow">
+ {!!extraContent ? (
+ extraContent
+ ) : (
+ <div className="modal-down-main-overflow-in">
+ {screenList?.map((item, index) => {
+ let gridList = item.select.filter((item) => item.display !== 'none');
+ let width = 100 / Number(item.column);
+ return (
+ <div className="modal-down-main-body" key={index}>
+ <div className="modal-down-main-body-title">{item.title}</div>
+ <div className="modal-down-grid">
+ {gridList.map((x, t) => {
+ return (
+ <div style={{ maxWidth: `${width}%`, flex: `0 0 ${width}%` }} key={t}>
+ <div className="modal-down-grid-col">{renderItem(x, item, index)}</div>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ )}
+ </div>
+ {isAction && !actionContent && (
+ <div className="modal-down-main-foot-button">
+ <Button onClick={resetOnclick} style={{ flex: 1, marginRight: '8px' }}>
+ {cancelText}
+ </Button>
+ <Button onClick={searchOnclick} style={{ flex: 1, marginLeft: '8px' }} type="primary">
+ {okText}
+ </Button>
+ </div>
+ )}
+ {!!actionContent && actionContent}
+ </div>
+ </Drawer>
+ );
+};
+
+export default ModalDown;
\ No newline at end of file
diff --git a/src/components/ModalDown copy/index.less b/src/components/ModalDown copy/index.less
new file mode 100644
index 0000000..51a30be
--- /dev/null
+++ b/src/components/ModalDown copy/index.less
@@ -0,0 +1,185 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.modal-down {
+ .dtm-drawer-sidebar {
+ max-height: 80% !important;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ overflow-y: auto;
+
+ &-head {
+ height: 24px;
+ padding: 12px;
+ display: flex;
+ align-items: center;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ }
+ }
+
+ &-divider {
+ height: 8px;
+ width: 100%;
+ background: #f2f2f2;
+ }
+
+ &-overflow {
+ flex: 1;
+ max-height: 480px;
+ overflow-y: auto;
+ border-bottom: 1px solid rgba(126, 134, 142, 0.16);
+ padding-bottom: 16px;
+ }
+
+ &-overflow-in {
+ &::-webkit-scrollbar {
+ display: none !important;
+ }
+ }
+
+ &-body {
+ & .dtm-grid-square {
+ padding: 0 4px;
+ }
+
+ &-title {
+ padding: 12px 16px;
+ }
+
+ &-button {
+ &-b {
+ width: 158px;
+ margin-bottom: 8px;
+ }
+ }
+ }
+
+ &-foot-button {
+ display: flex;
+ padding: 12px;
+ background-color: #fff;
+ }
+ }
+
+ &-subtitle {
+ color: @common_level2_base_color;
+ }
+
+ &-endPicker {
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ height: 1px;
+ width: 10px;
+ background-color: @common_level2_base_color;
+ left: -17px;
+ top: 17px;
+ z-index: 999;
+ }
+ }
+
+ &-mapItem {
+ display: flex;
+ flex-direction: column;
+ font-size: 12px;
+ line-height: 20px;
+ text-align: center;
+
+ img {
+ height: 46px;
+ width: 100%;
+ }
+
+ &-imgBox {
+ height: 46px;
+ border-radius: 5px;
+ margin-bottom: 4px;
+ }
+
+ &-active {
+ color: @theme_primary1_color;
+
+ .modal-down-mapItem-imgBox {
+ border: 1px solid @theme_primary1_color;
+ }
+ }
+ }
+
+ &-grid {
+ margin-left: -12px;
+ margin-right: -12px;
+ margin-bottom: -8px;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 0 16px;
+
+ &-col {
+ padding: 0 12px;
+ margin-bottom: 8px;
+ }
+ }
+ &-input {
+ border-bottom: 1px solid @theme_primary1_color;
+ }
+
+ &-input {
+ display: flex;
+ align-items: flex-end;
+ &-relative {
+ position: relative;
+ height: 30px;
+ }
+ &-absolute {
+ content: '';
+ position: absolute;
+ // height: 1px;
+ width: 10px;
+ left: -17px;
+ top: 13px;
+ z-index: 999;
+ }
+
+ &-img {
+ width: 24px;
+ height: 24px;
+ & img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+
+ & .dtm-input-item-input {
+ text-align: center !important;
+ }
+ }
+}
+
+.modal-down-input .dtm-list-item {
+ min-height: 30px !important;
+
+ & .dtm-list-line {
+ height: 30px;
+ line-height: 30px;
+ padding: 0 !important;
+ width: 100%;
+ justify-content: center;
+ }
+}
+
+.select-color_1 {
+ padding-left: 0 !important;
+ & .dd-icon svg {
+ display: none !important;
+ }
+}
\ No newline at end of file
diff --git a/src/components/ModalDown/index.jsx b/src/components/ModalDown/index.jsx
new file mode 100644
index 0000000..efcf967
--- /dev/null
+++ b/src/components/ModalDown/index.jsx
@@ -0,0 +1,358 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2025-05-07 18:22:01
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 底部弹窗
+ */
+import React, { useEffect, useState } from 'react';
+import { DownArrow2Outlined } from 'dd-icons';
+import { Drawer, Button, DatePicker, InputItem, Picker, List } from 'dingtalk-design-mobile';
+import './index.less';
+import { getCountTime, myTimeFormat, hkRegion, regionThreeDesc, selectThreeDesc, showToast, hkRegionLValue } from '../../utils/utility';
+import obj from '../../utils/selectOption';
+import { modalDown_1 } from '../../assets/img';
+
+const ModalDown = ({
+ headContent,
+ dataList = [],
+ title,
+ visible,
+ itemStyle,
+ visibleOnClick,
+ onChange, //点击筛选条件回调事件
+ onConfirm,
+ onReset,
+ extraContent, // 自定义内容
+ actionContent, // 自定义底部操作区
+ isAction = true,
+ cancelText = '重置',
+ okText = '确定',
+ selectLink,
+}) => {
+ const [screenList, setScreenList] = useState();
+
+ const [oldScreenList, setOldScreenList] = useState();
+
+ const [rangePickerTime, setRangePickerTime] = useState({ visible1: false, visible2: false });
+
+ const [rangePickerStart, setRangePickerStart] = useState('');
+
+ function screenListChange(list, value, index, label, key) {
+ onChange && onChange(list, value, index, label, key);
+ }
+
+ const processRegionData = (data) => {
+ return data.map((item) => ({
+ ...item,
+ children: item.children && item.children.length > 0 ? processRegionData(item.children) : [], // 当children为空时，将label赋给children
+ }));
+ };
+
+ const hkRegionProcessed = processRegionData(hkRegion);
+ const hkRegionLength = processRegionData(hkRegionLValue);
+
+ // 选择筛选条件
+ function handleChange(value, index, label, key) {
+ if (
+ screenList[index].key === 'dateTime' ||
+ screenList[index].key === 'ageRange' ||
+ screenList[index].key === 'censusTest' ||
+ screenList[index].key === 'censusTestOther' ||
+ screenList[index].key === 'nationalTest' ||
+ screenList[index].key === 'createTime' ||
+ screenList[index].key === 'newCreateTime' ||
+ screenList[index].key === 'area' ||
+ screenList[index].key === 'PickerSelect' ||
+ screenList[index].key === 'tag'
+ ) {
+ // 自定义时间范围选择处理 - 选择显隐开始时间和结束时间
+ if (value === 'customTime' && screenList[index].value !== 'customTime') {
+ screenList[index].customTime = true;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'customTime' && screenList[index].value === 'customTime') {
+ screenList[index].customTime = false;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ x.value = '';
+ x.value1 = '';
+ x.value2 = '';
+ }
+ });
+ }
+ if (value === 'custom' && screenList[index].value !== 'custom') {
+ screenList[index].custom = true;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'custom' && screenList[index].value === 'custom') {
+ screenList[index].custom = false;
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ x.value = '';
+ x.value1 = '';
+ x.value2 = '';
+ x.value3 = '';
+ }
+ });
+ }
+
+ // 综治领导责任制
+ if (value === 'customYear') {
+ screenList[index].customTime = true;
+ screenList[index].select = screenList[index]?.select.filter((item) => item.key !== 'noCustomYear');
+ screenList[index]?.select.forEach((x) => {
+ if (x.key === 'customYear' && x.display) {
+ x.display = 'block';
+ }
+ if (x.key !== 'customYear' && x.display) {
+ x.display = 'none';
+ }
+ });
+ }
+ if (value === 'customTimeRange') {
+ screenList[index].customTime = true;
+ screenList[index]?.select.splice(3, 0, { value: '', key: 'noCustomYear' });
+ screenList[index]?.select.forEach((x) => {
+ if (x.key === 'customYear' && x.display) {
+ x.display = 'none';
+ }
+ if (x.key !== 'customYear' && x.display) {
+ x.display = 'block';
+ }
+ });
+ }
+ if (value !== 'customTimeRange' && value !== 'customYear' && key === 'newCreateTime') {
+ if (screenList[index]?.select?.length === 6) {
+ screenList[index]?.select.splice(3, 0, { value: '', key: 'noCustomYear' });
+ }
+ screenList[index]?.select.forEach((x) => {
+ if (x.display) {
+ x.display = 'none';
+ }
+ });
+ }
+ }
+ let arr = screenList.map((item, i) => ({ ...item, value: i === index ? value : item.value, label: i === index ? label : item.label }));
+ setScreenList(arr);
+ screenListChange(arr, value, index, label, key);
+ }
+
+ // 时间选择
+ function changeDatePicker(value, index, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, 'YYYY.MM.DD');
+ setScreenList([...screenList]);
+ }
+
+ // 年月选择器
+ function changeYearMonthPicker(value, index, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, 'YYYY.MM');
+ setScreenList([...screenList]);
+ }
+
+ // 时间登记时间选择器
+ function changeNameDatePicker(name, value, index, label, key) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ item.value = myTimeFormat(value, key === 'createTimeStart' ? 'YYYY-MM-DD 00:00' : 'YYYY-MM-DD 23:59');
+ setScreenList([...screenList]);
+ screenListChange(screenList, item.value, index, label, key);
+ }
+
+ // 自定义输入框或选择框回填
+ function changeValue(type, value, index, label, key, list) {
+ let item = screenList[index].select.filter((item) => item.key === key)[0];
+ if (type === 'district') {
+ let valueLabel = regionThreeDesc(hkRegionProcessed, value).join(',');
+ item.value = value.splice(',');
+ item.label = valueLabel;
+ } else if (type === 'district2') {
+ let valueLabel = regionThreeDesc(hkRegionLength, value).join(',');
+ item.value = value.splice(',');
+ item.label = valueLabel;
+ } else if (type === 'select' || type === 'gridSelect') {
+ item.value = value;
+ item.label = selectThreeDesc(list, value);
+ } else {
+ item.value = value;
+ }
+ setScreenList([...screenList]);
+ screenListChange(screenList, item.value, index, label, key);
+ }
+
+ // 重置
+ function resetOnclick() {
+ let list = JSON.parse(JSON.stringify(oldScreenList));
+ setScreenList(list);
+ let result = {},
+ resultName = {};
+ list.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ result[x.key] = !x.value
+ ? ''
+ : x.value === 'customTime'
+ ? {
+ start: x.select.filter((item) => item.key === 'startTime')[0].value,
+ end: x.select.filter((item) => item.key === 'endTime')[0].value,
+ }
+ : getCountTime(x.value);
+ } else {
+ result[x.key] = x.value;
+ resultName[x.key] = x.label;
+ }
+ });
+
+ !!onReset && onReset(result, list, resultName);
+ }
+
+ // 点击确定
+ function searchOnclick() {
+ if (screenList[1]) {
+ if (
+ screenList[1].select.find((item) => item.key === 'ageStart')?.value !== '' &&
+ screenList[1].select.find((item) => item.key === 'ageEnd')?.value !== ''
+ ) {
+ if (
+ Number(screenList[1].select.find((item) => item.key === 'ageStart')?.value) >
+ Number(screenList[1].select.find((item) => item.key === 'endAge')?.value)
+ ) {
+ showToast({ content: '您输入年龄范围有误' });
+ return;
+ }
+ }
+ }
+ let result = {},
+ resultName = {};
+ screenList.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ if (x.value === 'customTime') {
+ result[x.select.find((item) => item.key1)?.key1] = x.select.find((item) => item.key1)?.value1 || '';
+ result[x.select.find((item) => item.key2)?.key2] = x.select.find((item) => item.key2)?.value2 || '';
+ }
+ }
+ if (x.value === 'custom') {
+ if (x.key === 'censusTest') {
+ if (x.select[x.select?.length - 1]?.type === 'district1' || 'district2') {
+ result[x.select.find((item) => item.key1)?.key1] = x.select.find((item) => item.key1)?.value1 || '';
+ result[x.select.find((item) => item.key2)?.key2] = x.select.find((item) => item.key2)?.value2 || '';
+ result[x.select.find((item) => item.key3)?.key3] = x.select.find((item) => item.key3)?.value3 || '';
+ } else {
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value?.[2]
+ ? x.select.find((item) => item.key)?.value?.[2]
+ : x.select.find((item) => item.key)?.value?.[1]
+ ? x.select.find((item) => item.key)?.value?.[1]
+ : x.select.find((item) => item.key)?.value?.[0]
+ ? x.select.find((item) => item.key)?.value?.[0]
+ : '';
+ }
+ }
+
+ if (x.key === 'ageRange') {
+ result[x.select.find((item) => item.key1)?.key1] = x.select.find((item) => item.key1)?.value1 || '';
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value || '';
+ } else {
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value?.[0] || '';
+ }
+ } else {
+ result[x.key] = x.value;
+ resultName[x.key] = x.label;
+ }
+ });
+ !!onConfirm && onConfirm(result, screenList, resultName);
+ }
+
+ useEffect(() => {
+ if (dataList.length !== 0 && visible) {
+ if (!oldScreenList) {
+ // setOldScreenList(JSON.parse(JSON.stringify(dataList)));
+ let value = JSON.parse(JSON.stringify(dataList));
+ setOldScreenList([...value]);
+ }
+ setScreenList(dataList);
+ }
+ }, [dataList, visible]);
+
+ // DatePicker的自定义元素
+ const CustomChildren = ({ onClick, children, className, type }) => (
+ <div className={type === 'endTime' ? 'modal-down-endPicker' : ''}>
+ <Button size="middle" onClick={onClick}>
+ <div className={className}>{children}</div>
+ </Button>
+ </div>
+ );
+
+ // 筛选的元素判断
+ const renderItem = (data, item, index) => {
+ return (
+ <Button
+ name={data.label}
+ size="middle"
+ onClick={() => handleChange(data.value, index, data.label, item.key)}
+ type={item.value === data.value ? 'primary' : 'secondary'}
+ >
+ {data.label}
+ </Button>
+ );
+ };
+
+ return (
+ <Drawer position="top" visible={visible} onVisibleChange={visibleOnClick} className="modal-down">
+ <div className="modal-down-main" style={itemStyle}>
+ <div className="modal-down-main-overflow">
+ {!!extraContent ? (
+ extraContent
+ ) : (
+ <div className="modal-down-main-overflow-in">
+ {screenList?.map((item, index) => {
+ let width = 100 / Number(item.column);
+ return (
+ <div className="modal-down-main-body" key={index}>
+ <div className="modal-down-main-body-title">{item.title}</div>
+ <div className="modal-down-grid">
+ {/* {gridList.map((x, t) => {
+ return (
+ <div style={{ maxWidth: `${width}%`, flex: `0 0 ${width}%` }} key={t}>
+ <div className="modal-down-grid-col">{renderItem(x, item, index)}</div>
+ </div>
+ );
+ })} */}
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ )}
+ </div>
+ {isAction && !actionContent && (
+ <div className="modal-down-main-foot">
+ <div className="modal-down-main-foot-button">
+ <Button onClick={resetOnclick} style={{ flex: 1, marginRight: '8px' }}>
+ {cancelText}
+ </Button>
+ <Button onClick={searchOnclick} style={{ flex: 1, marginLeft: '8px' }} type="primary">
+ {okText}
+ </Button>
+ </div>
+ </div>
+ )}
+ </div>
+ </Drawer>
+ );
+};
+
+export default ModalDown;
diff --git a/src/components/ModalDown/index.less b/src/components/ModalDown/index.less
new file mode 100644
index 0000000..3735bac
--- /dev/null
+++ b/src/components/ModalDown/index.less
@@ -0,0 +1,201 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.modal-down {
+ .dtm-drawer-sidebar {
+ max-height: 80% !important;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 50vh;
+ overflow-y: auto;
+ position: relative;
+ padding-top: 44px;
+ &-head {
+ height: 24px;
+ padding: 12px;
+ display: flex;
+ align-items: center;
+
+ &-title {
+ flex: 1;
+ text-align: center;
+ }
+ }
+
+ &-divider {
+ height: 8px;
+ width: 100%;
+ background: #f2f2f2;
+ }
+
+ &-overflow {
+ flex: 1;
+ max-height: 480px;
+ overflow-y: auto;
+ border-bottom: 1px solid rgba(126, 134, 142, 0.16);
+ padding-bottom: 16px;
+ }
+
+ &-overflow-in {
+ &::-webkit-scrollbar {
+ display: none !important;
+ }
+ }
+
+ &-body {
+ & .dtm-grid-square {
+ padding: 0 4px;
+ }
+
+ &-title {
+ padding: 12px 16px;
+ }
+
+ &-button {
+ &-b {
+ width: 158px;
+ margin-bottom: 8px;
+ }
+ }
+ }
+
+ &-foot {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ &-button {
+ display: flex;
+ padding: 12px;
+ background-color: #fff;
+ }
+ }
+ }
+
+ &-subtitle {
+ color: @common_level2_base_color;
+ }
+
+ &-endPicker {
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ height: 1px;
+ width: 10px;
+ background-color: @common_level2_base_color;
+ left: -17px;
+ top: 17px;
+ z-index: 999;
+ }
+ }
+
+ &-mapItem {
+ display: flex;
+ flex-direction: column;
+ font-size: 12px;
+ line-height: 20px;
+ text-align: center;
+
+ img {
+ height: 46px;
+ width: 100%;
+ }
+
+ &-imgBox {
+ height: 46px;
+ border-radius: 5px;
+ margin-bottom: 4px;
+ }
+
+ &-active {
+ color: @theme_primary1_color;
+
+ .modal-down-mapItem-imgBox {
+ border: 1px solid @theme_primary1_color;
+ }
+ }
+ }
+
+ &-grid {
+ margin-left: -12px;
+ margin-right: -12px;
+ margin-bottom: -8px;
+ display: flex;
+ flex-wrap: wrap;
+ padding: 0 16px;
+
+ &-col {
+ padding: 0 12px;
+ margin-bottom: 8px;
+ }
+ }
+ &-input {
+ border-bottom: 1px solid @theme_primary1_color;
+ }
+
+ &-rangePicker {
+ color: rgba(23, 26, 29, 0.24);
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ font-size: 16px;
+ height: 30px;
+ line-height: 30px;
+ }
+
+ &-input {
+ display: flex;
+ align-items: flex-end;
+ &-relative {
+ position: relative;
+ height: 30px;
+ }
+ &-absolute {
+ content: '';
+ position: absolute;
+ // height: 1px;
+ width: 10px;
+ left: -19px;
+ top: 7px;
+ z-index: 999;
+ }
+
+ &-img {
+ width: 24px;
+ height: 24px;
+ & img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+
+ & .dtm-input-item-input {
+ text-align: center !important;
+ }
+ }
+}
+
+.modal-down-input .dtm-list-item {
+ min-height: 30px !important;
+
+ & .dtm-list-line {
+ height: 30px;
+ line-height: 30px;
+ padding: 0 !important;
+ width: 100%;
+ justify-content: center;
+ }
+}
+
+.select-color_1 {
+ padding-left: 0 !important;
+ & .dd-icon svg {
+ display: none !important;
+ }
+}
diff --git a/src/components/ModalDownPreview/index.jsx b/src/components/ModalDownPreview/index.jsx
new file mode 100644
index 0000000..40bd7ea
--- /dev/null
+++ b/src/components/ModalDownPreview/index.jsx
@@ -0,0 +1,229 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2024-03-13 18:56:31
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 底部弹窗数据预览组件
+ */
+import React, { useState } from 'react';
+import { Drawer, } from 'dingtalk-design-mobile';
+import './index.less';
+import { myTimeFormat } from '../../utils/utility';
+import obj from '../../utils/selectOption';
+import { hasMore_1, close_1 } from "../../assets/img";
+
+const ModalDownPreview = ({
+ screenModal,
+ okText = '收起',
+ updateScreenModal,
+ updateList
+}) => {
+
+ // 展开/隐藏
+ const [showValues, setShowValues] = useState(false);
+
+ const handleClickRemove = (index) => {
+ const updatedScreenModal = { ...screenModal };
+ let modalDownList = updatedScreenModal.dataList.map((item, i) => ({ ...item, value: i === index ? item.select[0].value : item.value, label: i === index ? item.select[0].label : item.label, select: i === index ? item.select?.map((x, t) => ({ ...x, display: x.display && 'none', value: x.display ? '' : x.value, value1: x.display ? '' : x.value1, value2: x.display ? '' : x.value2, })) : item.select }));
+ // let modalTopList = updatedScreenModal.dataList.filter((item, i) => i !== index);
+ let modalTopList = updatedScreenModal.dataList.map((item, i) => {
+ if ((item.key === 'area' || item.key === 'censusTest') && i === index && (item.value === 'custom' || item.value === '')) {
+ return { ...item, label: '海口市', value: '' };
+ } else {
+ return {
+ ...item,
+ value: i === index ? item.select[0].value : item.value,
+ label: i === index ? item.select[0].label : item.label,
+ select: i === index ? item.select?.map((x, t) => ({ ...x, display: x.display && 'none', value: x.display ? '' : x.value })) : item.select
+ };
+ }
+ });
+ let result = {};
+ modalDownList.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ if (x.value === 'customTime') {
+ result[x.select.find((item) => item.key1)?.key1] = x.select.find((item) => item.key1)?.value1 || '';
+ result[x.select.find((item) => item.key2)?.key2] = x.select.find((item) => item.key2)?.value2 || '';
+ }
+ }
+ if (x.value === 'custom') {
+ if (x.key === 'censusTest') {
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value?.[2] ? x.select.find((item) => item.key)?.value?.[2] : x.select.find((item) => item.key)?.value?.[1] ? x.select.find((item) => item.key)?.value?.[1] : x.select.find((item) => item.key)?.value?.[0] ? x.select.find((item) => item.key)?.value?.[0] : '';
+ } else {
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value?.[0] || '';
+ }
+ }
+ else {
+ result[x.key] = x.value;
+ }
+ });
+ updateScreenModal(modalDownList, modalTopList, result);
+ };
+
+
+
+
+
+
+ function toggleDropdown(value) {
+ setShowValues(value)
+ }
+
+
+ const renderSelectedValues = () => {
+ return screenModal.dataList.map((item, index) => (
+ <div key={index} className='modal-down-preview-bottom-show-mark'>
+ <div className='modal-down-preview-bottom-show-mark-flex'>
+ <div className='public-color'>
+ {item.title}：
+ {/* 正常选择 */}
+ {
+ (item.value !== 'custom' && item.value !== 'customTime') &&
+ <span>
+ {item.label ||
+ item.select?.find(item => item.value === '')?.label}
+ </span>
+ }
+
+ {/* 自定义选择 */}
+ {
+ item.value === 'custom' &&
+ <>
+ {/* 区域 */}
+ {
+ item.key === 'censusTest' &&
+ <>
+ {item.select[item.select?.length - 1]?.label}
+ </>
+ }
+ {/*三级区域 */}
+ {
+ item.key === 'censusTestOther' &&
+ <>
+ {item.select[item.select?.length - 1]?.label}
+ </>
+ }
+ {/* 区级区域 */}
+ {
+ item.key === 'area' &&
+ <>
+ {item.select[item.select?.length - 1]?.label}
+ </>
+ }
+ {/* 年龄范围 */}
+ {
+ item.key === 'ageRange' &&
+ <>
+ {item.select.map((subItem, subIndex) => {
+ if (subItem.key === 'ageStart' || subItem.key === 'ageEnd') {
+ return (
+ <span key={subIndex}>
+ {subItem.value}
+ {subItem.key === 'ageStart' && subItem.value ? '-' : null}
+ {subItem.key === 'ageEnd' && subItem.value ? '岁' : null}
+ </span>
+ );
+ }
+ return null;
+ })}
+ </>
+ }
+ {/* input */}
+ {
+ item.key === 'areaRange' &&
+ <>
+ {item.select[item.select?.length - 1]?.value}
+ </>
+ }
+ {/* 民族 */}
+ {item.key === 'nationalTest' &&
+ <>
+ {obj.national?.find(i => i.value === item.select[item.select?.length - 1]?.value[0])?.label}
+ </>
+ }
+ {item.key === 'PickerSelect' &&
+ <>
+ {item.select[item.select?.length - 1]?.selectList?.find(i => i.value === item.select[item.select?.length - 1]?.value[0])?.label || '请选择'}
+ </>
+ }
+ </>
+ }
+ {
+ item.value === 'customTime' &&
+ <>
+ {item.key === 'dateTime' &&
+ <>
+ {myTimeFormat(item.select[item.select?.length - 1]?.value1, 'YYYY.MM.DD')}-{myTimeFormat(item.select[item.select?.length - 1]?.value2, 'YYYY.MM.DD')}
+ </>
+ }
+ </>
+ }
+ <img
+ src={close_1}
+ alt=""
+ srcset=""
+ style={{ height: '14px', width: '14px', verticalAlign: 'middle', marginLeft: '8px' }}
+ onClick={() => handleClickRemove(index)}
+ />
+ </div>
+
+ </div>
+ </div >
+ ));
+ };
+
+ return (
+ <>
+ {
+ !showValues ?
+ <div className='modal-down-preview-bottom-flex' onClick={() => toggleDropdown(true)}>
+ <div className='modal-down-preview-bottom-div'>
+ <img
+ src={hasMore_1}
+ alt=""
+ srcset=""
+ />
+ </div>
+ </div> :
+ <Drawer className='modal-down-preview-bottom-show' visible={showValues} onVisibleChange={(v) => { setShowValues(v) }} position='top'>
+ <div style={{ padding: '12px' }}>
+ <div style={{ color: 'rgba(23,26,29,0.6)' }}>已设置的筛选条件：</div>
+ {renderSelectedValues()} {/* 渲染已选的条件 */}
+ </div>{/*; */}
+ <div className='modal-down-preview-bottom-show-button' onClick={(v) => {
+ toggleDropdown(false);
+ let result = {},
+ resultName = {};
+ screenModal.dataList.forEach((x) => {
+ // 当key中包含dateTime字段时则会特殊处理显示时间选项
+ if (x.key.indexOf('dateTime') !== -1) {
+ if (x.value === 'customTime') {
+ result[x.select.find((item) => item.key1)?.key1] = x.select.find((item) => item.key1)?.value1 || '';
+ result[x.select.find((item) => item.key2)?.key2] = x.select.find((item) => item.key2)?.value2 || '';
+ }
+ }
+ if (x.value === 'custom') {
+ // if (x.value) {
+
+ // } else {
+ // }
+ result[x.select.find((item) => item.key)?.key] = x.select.find((item) => item.key)?.value?.[0] || '';
+ }
+ else {
+ result[x.key] = x.value;
+ resultName[x.key] = x.label;
+ }
+ });
+ updateList(result, screenModal.dataList,)
+ }}><span className='public-color'>{okText}</span></div>
+ </Drawer>
+
+ }
+ </>
+ );
+};
+
+export default ModalDownPreview;
\ No newline at end of file
diff --git a/src/components/ModalDownPreview/index.less b/src/components/ModalDownPreview/index.less
new file mode 100644
index 0000000..dc94742
--- /dev/null
+++ b/src/components/ModalDownPreview/index.less
@@ -0,0 +1,66 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.modal-down-preview {
+ &-bottom {
+ &-flex {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ top: -44px;
+ z-index: 1;
+ }
+
+ &-div {
+ width: 49px;
+ height: 52px;
+ background-color: #fff;
+ border-radius: 50%;
+ position: absolute;
+ top: 0;
+ display: flex;
+ align-items: end;
+ justify-content: center;
+
+
+ & img {
+ height: 18px;
+ width: 26px;
+ position: relative;
+ top: 2px;
+ }
+ }
+
+ &-show {
+ // background-color: #fff;
+ // position: absolute;
+ // width: 100%;
+ top: 92px;
+ font-size: 14px;
+
+
+
+ &-button {
+ padding: 12px 12px;
+ border-top: 1px solid rgba(126, 134, 142, 0.16);
+ text-align: center;
+ }
+
+ &-mark {
+ display: flex;
+ align-items: center;
+ gap: 8px;
+ margin: 8px 0;
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ border: 1px solid rgba(0, 127, 255, 0.48);
+ border-radius: 4px;
+ line-height: 22px;
+ padding: 2px 8px;
+ }
+ }
+ }
+ }
+}
diff --git a/src/components/ModalLContent/index.jsx b/src/components/ModalLContent/index.jsx
new file mode 100644
index 0000000..4b6cfbf
--- /dev/null
+++ b/src/components/ModalLContent/index.jsx
@@ -0,0 +1,94 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2024-03-06 10:49:19
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 中间最下方带关闭图标的弹窗
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import MyModal from '../MyModal';
+import { Button } from 'dingtalk-design-mobile';
+import './index.less';
+import Overlay from '../Overlay';
+import { del } from '../../assets/icon';
+
+// height 高度建议不要高于80%， top 距离顶部的距离
+const ModalContent = ({ title, buttonTitle = '确定', headBackground, headStyle, centerBackground, footBackground, buttonStyle, content, zIndex = 999, width = '94%', onOk = true, height = '50%', top = '150px', centerMinHeight = '0', centerMaxHeight = '440px', visible, center, bottom, disabledButton = false, visibleOnClick, buttonNum }) => {
+ const modalRef = useRef();
+
+ const [styles, setStyles] = useState();
+
+ useEffect(() => {
+ if (!visible) return;
+ let obj = {};
+ let countWidth = 0;
+ if (width.toString().indexOf('%') !== -1) {
+ let windowWidth = document.body.clientWidth;
+ countWidth = (windowWidth * parseInt(width)) / 100;
+ } else {
+ countWidth = width;
+ }
+ if (center) {
+ obj = {
+ top: '50%',
+ marginTop: `-${modalRef.current.clientHeight / 2}px`,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ } else if (bottom) {
+ obj = {
+ bottom: '24px',
+ left: '24px',
+ right: '24px',
+ };
+ } else {
+ obj = {
+ top: top,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ }
+ setStyles(obj);
+ }, [bottom, center, visible, width]);
+ return (
+ <div >
+ {
+ visible && (
+ <div ref={modalRef} className="ModalLContent" style={{ ...styles, zIndex: zIndex }}>
+ <div className='ModalLContent-main'>
+ <div className='ModalLContent-head' style={headBackground ? { backgroundColor: '#fff', color: '#171A1D' } : { ...headStyle }} >{title}</div>
+ <div className='ModalLContent-content' style={{ minHeight: centerMinHeight, maxHeight: centerMaxHeight, backgroundColor: centerBackground }}>{content}</div>
+ <div style={{ zIndex: zIndex, backgroundColor: footBackground ? "#ffffff" : "#f2f2f2", margin: '0', borderRadius: '0 0 10px 10px' }} >
+ {
+ onOk &&
+ <div style={{ ...buttonStyle }}>
+ <Button
+ disabled={disabledButton}
+ onClick={() => {
+ visibleOnClick('submit', false);
+ }}
+ style={{ flex: 2 }}
+ type="primary"
+ >
+ {buttonTitle}{buttonNum ? `(${buttonNum})` : ''}
+ </Button>
+ </div>
+ }
+ </div>
+ <div className="ModalLContent-bottom" style={{ zIndex: zIndex }} onClick={() => visibleOnClick('', false)}>
+ <img className="ModalLContent-bottom-img" style={{ zIndex: zIndex }} src={del} alt="" />
+ </div>
+ </div>
+ </div>
+ )
+ }
+ < Overlay zIndex={zIndex - 1} show={visible} onOverlay={() => visibleOnClick('', false)} />
+ </div>
+ );
+};
+
+export default ModalContent;
\ No newline at end of file
diff --git a/src/components/ModalLContent/index.less b/src/components/ModalLContent/index.less
new file mode 100644
index 0000000..83663ad
--- /dev/null
+++ b/src/components/ModalLContent/index.less
@@ -0,0 +1,63 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2023-07-31 11:17:00
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @LastEditTime: 2024-01-03 14:22:54
+ * @FilePath: \hztSsim\mobile\src\components\ModalLContent\index.less
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.ModalLContent {
+ position: fixed;
+ overflow-y: auto;
+ border-radius: 10px;
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+ &-head {
+ background-color: #007fff;
+ color: #fff;
+ text-align: center;
+ font-size: 16px;
+ line-height: 24px;
+ padding: 12px 12px;
+ }
+ &-content {
+ flex: 1;
+ overflow: auto;
+ // min-height: 302px;
+ max-height: 440px;
+ // border-radius: 0 0 10px 10px;
+ background: #f2f2f2;
+ & :focus-visible {
+ outline: -webkit-focus-ring-color auto 0px;
+ }
+ }
+ &-bottom {
+ // position: absolute;
+ // bottom: -40px;
+ margin-top: 16px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ &-img {
+ width: 24px;
+ height: 24px;
+ }
+ }
+
+ &-item {
+ padding: 8px;
+ margin-bottom: 4px;
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ &-item:last-child {
+ margin-bottom: 0;
+ }
+}
diff --git a/src/components/ModalMinDown/index.jsx b/src/components/ModalMinDown/index.jsx
new file mode 100644
index 0000000..498af14
--- /dev/null
+++ b/src/components/ModalMinDown/index.jsx
@@ -0,0 +1,40 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2022-08-20 20:32:31
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 底部弹窗操作区
+ */
+import React from 'react';
+import { CloseOutlined } from 'dd-icons';
+import MyModal from '../MyModal';
+import './index.less';
+
+const ModalMinDown = ({ title, visible, list, onClose, onClickAction }) => {
+ return (
+ <MyModal visible={visible} bottom onClose={onClose}>
+ <div className="modalMinDown-header">
+ <div className="modalMinDown-header-title">{title || '标题'}</div>
+ <div className="modalMinDown-header-close" onClick={onClose}>
+ <CloseOutlined />
+ </div>
+ </div>
+ <div className="modalMinDown-main">
+ {list.map((x, t) => {
+ return (
+ <div className="modalMinDown-main-item" key={t} onClick={() => onClickAction(x)}>
+ <div className="modalMinDown-main-item-icon">
+ <img className="modalMinDown-main-item-icon-img" src={x.img} alt="" />
+ </div>
+ <div className="modalMinDown-main-item-text">{x.title}</div>
+ </div>
+ );
+ })}
+ </div>
+ </MyModal>
+ );
+};
+
+export default ModalMinDown;
diff --git a/src/components/ModalMinDown/index.less b/src/components/ModalMinDown/index.less
new file mode 100644
index 0000000..0137daa
--- /dev/null
+++ b/src/components/ModalMinDown/index.less
@@ -0,0 +1,52 @@
+.modalMinDown {
+ &-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 12px 0;
+
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 600;
+ }
+
+ &-close {
+ font-size: 16px;
+ }
+ }
+
+ &-main {
+ display: flex;
+ flex-wrap: wrap;
+
+ &-item {
+ padding: 8px 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ flex: 0 0 25%;
+
+ &-icon {
+ width: 36px;
+ height: 36px;
+ background: linear-gradient(138deg, #007fff 0%, #0062ff 100%);
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ &-img {
+ width: 16px;
+ height: 16px;
+ }
+ }
+
+ &-text {
+ font-size: 12px;
+ line-height: 20px;
+ margin-top: 4px;
+ }
+ }
+ }
+}
diff --git a/src/components/ModalNewContent/index.jsx b/src/components/ModalNewContent/index.jsx
new file mode 100644
index 0000000..07bb091
--- /dev/null
+++ b/src/components/ModalNewContent/index.jsx
@@ -0,0 +1,76 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2023-05-16 09:28:30
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 中间最下方带关闭图标的弹窗
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import MyModal from '../MyModal';
+import { Button } from 'dingtalk-design-mobile';
+import './index.less';
+import Overlay from '../Overlay';
+import { del } from '../../assets/icon';
+
+// height 高度建议不要高于80%， top 距离顶部的距离
+const ModalNewContent = ({ title, buttonTitle = '确定', content, zIndex = 999, width = '94%', onOk = true, height = '50%', top = '150px', centerMinHeight = '0', centerMaxHeight = '440px', visible, center, bottom, visibleOnClick }) => {
+ const modalRef = useRef();
+
+ const [styles, setStyles] = useState();
+
+ useEffect(() => {
+ if (!visible) return;
+ let obj = {};
+ let countWidth = 0;
+ if (width.toString().indexOf('%') !== -1) {
+ let windowWidth = document.body.clientWidth;
+ countWidth = (windowWidth * parseInt(width)) / 100;
+ } else {
+ countWidth = width;
+ }
+ if (center) {
+ obj = {
+ top: '50%',
+ marginTop: `-${modalRef.current.clientHeight / 2}px`,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ } else if (bottom) {
+ obj = {
+ bottom: '24px',
+ left: '24px',
+ right: '24px',
+ };
+ } else {
+ obj = {
+ top: top,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ }
+ setStyles(obj);
+ }, [bottom, center, visible, width]);
+ return (
+ <div >
+ {
+ visible && (
+ <div ref={modalRef} className="ModalLContent" style={{ ...styles, zIndex: zIndex }}>
+ <div className='ModalLContent-main'>
+ {content}
+ <div className="ModalLContent-bottom" style={{ zIndex: zIndex }} onClick={() => visibleOnClick('', false)}>
+ <img className="ModalLContent-bottom-img" style={{ zIndex: zIndex }} src={del} alt="" />
+ </div>
+ </div>
+ </div>
+ )
+ }
+ < Overlay zIndex={zIndex - 1} show={visible} onOverlay={() => visibleOnClick('', false)} />
+ </div>
+ );
+};
+
+export default ModalNewContent;
\ No newline at end of file
diff --git a/src/components/ModalNewContent/index.less b/src/components/ModalNewContent/index.less
new file mode 100644
index 0000000..e2a2070
--- /dev/null
+++ b/src/components/ModalNewContent/index.less
@@ -0,0 +1,55 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.ModalLContent {
+ position: fixed;
+ overflow-y: auto;
+ border-radius: 10px;
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+ &-head {
+ background-color: #007fff;
+ color: #fff;
+ text-align: left;
+ font-size: 16px;
+ line-height: 24px;
+ padding: 12px 12px;
+ }
+ &-content {
+ flex: 1;
+ overflow: auto;
+ // min-height: 302px;
+ max-height: 440px;
+ // border-radius: 0 0 10px 10px;
+ background: #f2f2f2;
+ & :focus-visible {
+ outline: -webkit-focus-ring-color auto 0px;
+ }
+ }
+ &-bottom {
+ // position: absolute;
+ // bottom: -40px;
+ margin-top: 16px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ &-img {
+ width: 24px;
+ height: 24px;
+ }
+ }
+
+ &-item {
+ padding: 8px;
+ margin-bottom: 4px;
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ &-item:last-child {
+ margin-bottom: 0;
+ }
+}
diff --git a/src/components/ModalView/index.jsx b/src/components/ModalView/index.jsx
new file mode 100644
index 0000000..6812526
--- /dev/null
+++ b/src/components/ModalView/index.jsx
@@ -0,0 +1,30 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2023-08-04 11:50:34
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState } from 'react';
+import { Modal, Button } from 'dingtalk-design-mobile';
+import './index.less';
+
+const ModalView = ({ data, visible, visibleOnClick }) => {
+ return (
+ <>
+ <Modal
+ visible={visible}
+ title={data.title}
+ onClose={() => () => visibleOnClick('', false)}
+ actions={data.list.map((item) => ({ text: item.text, onClick: () => visibleOnClick(item.type, false) }))}
+ >
+ <div>{data.content}</div>
+
+ </Modal>
+ </>
+ );
+};
+
+export default ModalView;
diff --git a/src/components/ModalView/index.less b/src/components/ModalView/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/ModalView/index.less
diff --git a/src/components/MsgModal/index.jsx b/src/components/MsgModal/index.jsx
new file mode 100644
index 0000000..fc00539
--- /dev/null
+++ b/src/components/MsgModal/index.jsx
@@ -0,0 +1,79 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-16 08:50:50
+ * @LastEditTime: 2023-05-23 20:34:22
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 消息底部弹窗
+ */
+import React from 'react';
+import { Drawer, Button, Space } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined } from 'dd-icons';
+import './index.less';
+
+/**
+ * visible: bool, // 显隐
+ * onClose: func, // 关闭方法
+ * title: string, // 弹窗标题
+ * icon: any, // 弹窗类型的icon
+ * msgTitle: string, // 弹窗类型的标题
+ * msgTag: array, [{className:'tag样式',text:'tag标题'}], // 弹窗类型当存在tag时传入
+ * content: string, // 弹窗内容
+ * isAction: bool, // 是否有底部操作区，只有一个操作
+ * actionText: string, // 底部操作的按钮名称
+ * actionFunc: func, // 底部操作的按钮方法
+ * contentTitle: string, // 弹窗内容的标题
+ */
+const MsgModal = ({
+ visible,
+ onClose,
+ title = '消息详情',
+ icon,
+ msgTitle,
+ msgSubtitle,
+ msgTag = [],
+ content,
+ isAction = true,
+ actionText = '我知道了',
+ actionFunc,
+ contentTitle,
+}) => {
+ return (
+ <Drawer visible={visible} onVisibleChange={onClose} size="auto">
+ <div className="msgModal">
+ <div className="msgModal-header">
+ <div className="msgModal-header-title">{title}</div>
+ <div className="msgModal-header-icon" onClick={onClose}>
+ <CloseBoldOutlined />
+ </div>
+ </div>
+ <div className="msgModal-title">
+ <img className="msgModal-title-img" src={icon} alt="" />
+ <div className="msgModal-title-content">
+ <Space>
+ <div className="msgModal-title-content-title">{msgTitle}</div>
+ {msgTag.map((x, t) => (
+ <div className={x.className} key={t}>
+ {x.text}
+ </div>
+ ))}
+ </Space>
+ <div className="msgModal-title-content-subtitle">{msgSubtitle}</div>
+ </div>
+ </div>
+ {contentTitle && <div className="msgModal-contentTitle">{contentTitle}</div>}
+ {content && <div className="msgModal-content"><span dangerouslySetInnerHTML={{ __html: content ? content.replace(/\/n/g, '<br/>') : '-' }}></span></div>}
+ {isAction && (
+ <div className="msgModal-action">
+ <Button onClick={() => !!actionFunc && actionFunc()} type="primary">
+ {actionText}
+ </Button>
+ </div>
+ )}
+ </div>
+ </Drawer>
+ );
+};
+
+export default MsgModal;
diff --git a/src/components/MsgModal/index.less b/src/components/MsgModal/index.less
new file mode 100644
index 0000000..7278441
--- /dev/null
+++ b/src/components/MsgModal/index.less
@@ -0,0 +1,77 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.msgModal {
+ padding: 12px 16px;
+
+ &-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ font-size: 16px;
+ line-height: 24px;
+ margin-bottom: 16px;
+
+ &-title {
+ font-weight: 600;
+ }
+
+ &-icon {
+ color: @common_level2_base_color;
+ }
+ }
+
+ &-title {
+ display: flex;
+ align-items: center;
+ margin-bottom: 16px;
+
+ &-img {
+ height: 44px;
+ width: 44px;
+ }
+
+ &-content {
+ padding-left: 8px;
+ flex: 1;
+
+ &-title {
+ font-weight: 600;
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ }
+ }
+ }
+
+ &-contentTitle {
+ font-weight: 600;
+ margin-bottom: 4px;
+ }
+
+ &-content {
+ max-height: 300px;
+ overflow-y: auto;
+ }
+
+ &-action {
+ margin-top: 48px;
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ top: -24px;
+ left: 0;
+ right: 0;
+ height: 1px;
+ background-color: @common_line_light_color;
+ }
+ }
+}
+
+.dtm-drawer-sidebar {
+ height: auto !important;
+}
diff --git a/src/components/MyCardSearchBar/index.jsx b/src/components/MyCardSearchBar/index.jsx
new file mode 100644
index 0000000..773dcfb
--- /dev/null
+++ b/src/components/MyCardSearchBar/index.jsx
@@ -0,0 +1,35 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-06-08 17:03:43
+ * @LastEditTime: 2023-06-08 17:30:03
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 社保卡搜索框
+ */
+
+import React from 'react';
+import { Input } from 'dingtalk-design-mobile';
+import { SearchOutlined, FilterOutlined } from 'dd-icons';
+import './index.less';
+
+/**
+ * onOpenSearch: func // 点击搜索回调
+ * onClickRightAction: func // 点击右侧按钮回调
+ * isRightActive: bool // 是否执行了右侧按钮
+ */
+const MyCardSearchBar = ({ onOpenSearch, placeholder = '搜索', onChange, onClickRightAction, isRightActive = false }) => {
+ return (
+ <div className="MyCardSearchBar">
+ <div className="MyCardSearchBar-search" >
+ {/* <SearchOutlined style={{ marginRight: '4px' }} /> */}
+ <Input className="MyCardSearchBar-search-input" placeholder={placeholder} onChange={onChange} />
+ </div>
+ <div className='MyCardSearchBar-scan' onClick={onClickRightAction}>
+ <span>搜索</span>
+ </div>
+ </div>
+ );
+};
+
+export default MyCardSearchBar;
diff --git a/src/components/MyCardSearchBar/index.less b/src/components/MyCardSearchBar/index.less
new file mode 100644
index 0000000..8386ff1
--- /dev/null
+++ b/src/components/MyCardSearchBar/index.less
@@ -0,0 +1,39 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.MyCardSearchBar {
+ display: flex;
+ align-items: center;
+ border: 1px solid #007fff;
+ border-radius: 20px;
+ margin: 0 12px 16px;
+ padding: 4px;
+ background-color: @common_bg_z1_color;
+ display: flex;
+ align-items: center;
+
+ &-search {
+ height: 20px;
+ flex: 1;
+ border-radius: 5px;
+ padding: 0 12px;
+ color: rgba(0, 0, 0, 0.5);
+ line-height: 32px;
+ margin-right: 16px;
+ &-input {
+ height: 20px;
+ line-height: 20px;
+ }
+ }
+
+ &-scan {
+ display: flex;
+ align-items: center;
+ // width: 52px;
+ justify-content: center;
+ background-color: #007fff;
+ color: #ffffff;
+ padding: 4px 12px;
+ border-radius: 20px;
+ line-height: 20px;
+ }
+}
diff --git a/src/components/MyCardTab/index.jsx b/src/components/MyCardTab/index.jsx
new file mode 100644
index 0000000..30cf813
--- /dev/null
+++ b/src/components/MyCardTab/index.jsx
@@ -0,0 +1,44 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-09 10:53:36
+ * @LastEditTime: 2022-08-18 16:21:02
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 自定义的卡片tab
+ */
+import React from 'react';
+import './index.less';
+
+/**
+ * tabs: array [{ value:"唯一值", label:"标题" }], // tab数据
+ * activeKey: string, // 当前选中项
+ * activeIndex: number, // 当前选中项的下标
+ * onChangeTab: func, // 点击tab回调
+ */
+const MyCardTab = ({ tabs = [], activeKey, activeIndex, onChangeTab }) => {
+ return (
+ <div className="myCardTab">
+ {tabs.map((item, index) => (
+ <div
+ className={`myCardTab-item ${activeKey === item.value ? 'myCardTab-item-active' : ''} ${
+ index === 0 || index === activeIndex || index === activeIndex + 1 ? '' : 'myCardTab-itemBorder'
+ }`}
+ key={item.value}
+ >
+ <div
+ className="myCardTab-item-bg"
+ style={{
+ borderBottomLeftRadius: index === activeIndex + 1 ? '10px' : '0',
+ borderBottomRightRadius: index === activeIndex - 1 ? '10px' : '0',
+ }}
+ >
+ <span onClick={() => !!onChangeTab && onChangeTab(item, index)}>{item.label}</span>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+};
+
+export default MyCardTab;
diff --git a/src/components/MyCardTab/index.less b/src/components/MyCardTab/index.less
new file mode 100644
index 0000000..c3703da
--- /dev/null
+++ b/src/components/MyCardTab/index.less
@@ -0,0 +1,54 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myCardTab {
+ display: flex;
+ align-items: flex-end;
+
+ &-item {
+ flex: 1;
+ background-color: @common_bg_z1_color;
+ text-align: center;
+ position: relative;
+ font-size: 14px;
+ height: 40px;
+ line-height: 40px;
+ overflow: hidden;
+
+ &-active {
+ height: 50px;
+ line-height: 50px;
+ font-size: 16px;
+ font-weight: 600;
+ border-radius: 10px 10px 0px 0px !important;
+ overflow: initial;
+
+ .myCardTab-item-bg {
+ border-radius: 10px 10px 0px 0px;
+ background-color: @common_bg_z1_color;
+ }
+ }
+
+ &-bg {
+ background-color: @common_bg_color;
+ }
+ }
+
+ &-itemBorder {
+ &::before {
+ content: '';
+ position: absolute;
+ height: 22px;
+ border-right: 1px solid @common_line_hard_color;
+ left: 0;
+ top: 9px;
+ }
+ }
+}
+
+.myCardTab-item:first-child {
+ border-top-left-radius: 10px;
+}
+
+.myCardTab-item:last-child {
+ border-top-right-radius: 10px;
+}
diff --git a/src/components/MyList/index.jsx b/src/components/MyList/index.jsx
new file mode 100644
index 0000000..aefd66f
--- /dev/null
+++ b/src/components/MyList/index.jsx
@@ -0,0 +1,109 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-09 08:32:43
+ * @LastEditTime: 2023-10-07 10:23:09
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description: 虚拟滚动列表
+ */
+import React, { useRef, useEffect } from 'react';
+import { Spin } from 'dingtalk-design-mobile';
+import './index.less';
+import routerStatus from '../../status/router';
+
+/**
+ * data: array, // 列表数据
+ * height: string | number // 父容器高度
+ * loadMore: func // 加载更多的回调方法
+ * AddStyle: object // 列表项的样式
+ * hasMore: bool // 是否显示加载更多
+ * itemDom: func // 列表项的dom
+ * bottomText: string // 底部显示文本
+ * threshold: number // 距离底部多少px触发loadMore
+ * getScrollTopKey: string // 是否开启滚动条位置保存，保存的key
+ * scrollTop: number // 滚动条位置
+ */
+const MyList = ({ data, dataTotal, AddStyle, height, loadMore, hasMore, itemDom, bottomText, threshold = 150, getScrollTopKey, scrollTop,showBottomText }) => {
+ const parentRef = useRef();
+
+ // 触底加载
+ useEffect(() => {
+ parentRef.current.onscroll = () => {
+ if (getScrollTopKey) {
+ // console.log('getScrollTopKey', getScrollTopKey)
+ // console.log('parentRef', parentRef);
+ // console.log('parentRef.current?.scrollTop', parentRef.current?.scrollTop)
+ routerStatus.setPageScrollTop(getScrollTopKey, parentRef.current?.scrollTop);
+ }
+ if (routerStatus.loadBottom || !hasMore || !loadMore) return;
+ if (parentRef.current.scrollTop > parentRef.current.scrollHeight - parentRef.current.clientHeight - Number(threshold)) {
+ routerStatus.setLoadBottomStatus(true)
+ // 返回一个callback来更新触底的状态，不再继续滚动刷新
+ loadMore(function () {
+ routerStatus.setLoadBottomStatus(false)
+ });
+ }
+ };
+ }, [hasMore, loadMore, threshold]);
+
+ // 设置滚动条位置
+ useEffect(() => {
+ if (!!scrollTop) {
+ setTimeout(() => {
+ parentRef.current.scrollTop = scrollTop;
+ // console.log('scrollTop', scrollTop);
+ // console.log('parentRef.current.scrollTop', parentRef.current.scrollTop);
+ routerStatus.clearPageScrollTopNow();
+ }, 200);
+ }
+ }, [scrollTop]);
+
+ return (
+ <div className="myList" style={{ height: height || '100%', ...AddStyle }} ref={parentRef}>
+ {data.map((x, t) => (
+ <div key={t}>{itemDom(x, t)}</div>
+ ))}
+ <div className="myList-loading">
+ {hasMore ? (
+ <>
+ <Spin className="myList-loading-spin" />
+ <div>努力加载中</div>
+ </>
+ ) : (
+ // <>{bottomText || `共${dataTotal || data.length}条记录`}</>
+ <>{showBottomText !== false && '已加载全部数据'}</>
+ )}
+ </div>
+ </div>
+ );
+};
+
+// TODO:项目本想使用虚拟滚动，但奈何与CacheRoute联合使用时，进入到页面中返回到list页面时滚动条回位不成功所以放弃使用。
+// const rowVirtualizer = useVirtual({
+// size: data.length,
+// parentRef: parentRef,
+// overscan: 5,
+// });
+// {/* <div style={{ height: rowVirtualizer.totalSize, width: '100%', position: 'relative' }}>
+// {rowVirtualizer.virtualItems.map((virtualRow) => {
+// let x = data[virtualRow.index];
+// return (
+// <div
+// key={virtualRow.index}
+// ref={virtualRow.measureRef}
+// style={{
+// position: 'absolute',
+// top: 0,
+// left: 0,
+// width: '100%',
+// transform: `translateY(${virtualRow.start}px)`,
+// }}
+// >
+// {itemDom(x, virtualRow.index)}
+// </div>
+// );
+// })}
+// </div>; */}
+
+export default MyList;
\ No newline at end of file
diff --git a/src/components/MyList/index.less b/src/components/MyList/index.less
new file mode 100644
index 0000000..d63321c
--- /dev/null
+++ b/src/components/MyList/index.less
@@ -0,0 +1,20 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myList {
+ overflow-y: auto;
+
+ &-loading {
+ .common_body_bold_text_style;
+ font-weight: 100;
+ color: rgba(23, 26, 29, 0.4);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding-bottom: 12px;
+
+ &-spin {
+ --spin-size: 16px;
+ margin-right: 8px;
+ }
+ }
+}
diff --git a/src/components/MyModal/index.jsx b/src/components/MyModal/index.jsx
new file mode 100644
index 0000000..4fa73b6
--- /dev/null
+++ b/src/components/MyModal/index.jsx
@@ -0,0 +1,74 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-17 09:04:28
+ * @LastEditTime: 2022-09-20 09:41:25
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的 “弹窗” 组件
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import './index.less';
+import Overlay from '../Overlay';
+
+/**
+ * width: string | number // 支持百分比类型
+ */
+const MyModal = ({ visible, title, width = '85%', center, bottom, bodyClass, zIndex = 999, onClose, children }) => {
+ const modalRef = useRef();
+
+ const [styles, setStyles] = useState();
+
+ useEffect(() => {
+ if (!visible) return;
+ let obj = {};
+ let countWidth = 0;
+ if (width.toString().indexOf('%') !== -1) {
+ let windowWidth = document.body.clientWidth;
+ countWidth = (windowWidth * parseInt(width)) / 100;
+ } else {
+ countWidth = width;
+ }
+ if (center) {
+ obj = {
+ top: '50%',
+ marginTop: `-${modalRef.current.clientHeight / 2}px`,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ } else if (bottom) {
+ obj = {
+ bottom: '24px',
+ left: '24px',
+ right: '24px',
+ };
+ } else {
+ obj = {
+ top: '150px',
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ }
+ setStyles(obj);
+ }, [bottom, center, visible, width]);
+
+ return (
+ <>
+ {visible && (
+ <div ref={modalRef} className="myModal" style={{ ...styles, zIndex: zIndex }}>
+ {(center || styles) && (
+ <div className={`myModal-main ${bodyClass || ''}`}>
+ {!!title && <div className="myModal-title">{title}</div>}
+ <div>{children}</div>
+ </div>
+ )}
+ </div>
+ )}
+ <Overlay zIndex={zIndex - 1} show={visible} onOverlay={onClose} />
+ </>
+ );
+};
+
+export default MyModal;
diff --git a/src/components/MyModal/index.less b/src/components/MyModal/index.less
new file mode 100644
index 0000000..b2d9788
--- /dev/null
+++ b/src/components/MyModal/index.less
@@ -0,0 +1,20 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myModal {
+ position: fixed;
+ max-height: 60%;
+ overflow-y: auto;
+ background-color: @common_bg_z1_color;
+ border-radius: 10px;
+
+ &-main {
+ padding: 0 16px 20px;
+ }
+
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 600;
+ padding: 12px 0;
+ }
+}
diff --git a/src/components/MySearch/index.jsx b/src/components/MySearch/index.jsx
new file mode 100644
index 0000000..ef21e36
--- /dev/null
+++ b/src/components/MySearch/index.jsx
@@ -0,0 +1,38 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-08-01 15:10:43
+ * @LastEditTime: 2023-08-01 15:35:34
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 搜索框
+ */
+
+import React from 'react';
+import { SearchOutlined, } from 'dd-icons';
+import { InputItem } from 'dingtalk-design-mobile';
+import './index.less';
+
+/**
+ * onChange: func // 输入框回调
+ * value: string // 填写的值
+ * placeholder: string // 提示文字
+ * onClear: func // 清空回调
+ * onClickRightAction: func // 点击右侧按钮回调
+ * ButtonTitle: string // 右侧按钮文字
+ */
+const MySearch = ({ value, onChange, placeholder = '请输入', onClear, onClickRightAction, ButtonTitle = '搜索' }) => {
+ return (
+ <div className="mySearch">
+ <div className="mySearch-search" >
+ <SearchOutlined />
+ <InputItem placeholder={placeholder} clear value={value} onClear={onClear} onChange={onChange} />
+ </div>
+ <div style={{ marginLeft: '16px' }} className={`mySearch-scan mySearch-scan-active`} onClick={onClickRightAction}>
+ <span>{ButtonTitle}</span>
+ </div>
+ </div>
+ );
+};
+
+export default MySearch;
diff --git a/src/components/MySearch/index.less b/src/components/MySearch/index.less
new file mode 100644
index 0000000..90ec61a
--- /dev/null
+++ b/src/components/MySearch/index.less
@@ -0,0 +1,41 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.mySearch {
+ display: flex;
+ align-items: center;
+ padding: 8px 12px;
+ background-color: @common_bg_z1_color;
+
+ &-search {
+ height: 36px;
+ flex: 1;
+ background: #f6f6f6;
+ border-radius: 5px;
+ padding: 0 12px;
+ color: rgba(0, 0, 0, 0.5);
+ line-height: 36px;
+ display: flex;
+ align-items: center;
+
+ & .dtm-input-item-input {
+ background-color: #f6f6f6;
+ margin-left: 8px;
+ // padding-left: 34px;
+ // padding-right: 32px;
+ }
+ }
+
+ &-scan {
+ display: flex;
+ align-items: center;
+
+ &-icon {
+ font-size: 16px;
+ margin-right: 4px;
+ }
+
+ &-active {
+ color: @theme_primary1_color;
+ }
+ }
+}
diff --git a/src/components/MySearchBar/index.jsx b/src/components/MySearchBar/index.jsx
new file mode 100644
index 0000000..2b5821b
--- /dev/null
+++ b/src/components/MySearchBar/index.jsx
@@ -0,0 +1,42 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-09 15:52:45
+ * @LastEditTime: 2023-10-26 17:16:40
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description: 搜索栏
+ */
+import React from 'react';
+import { SearchOutlined, FilterOutlined } from 'dd-icons';
+import './index.less';
+
+/**
+ * onOpenSearch: func // 点击搜索回调
+ * onClickRightAction: func // 点击右侧按钮回调
+ * isRightActive: bool // 是否执行了右侧按钮
+ */
+const MySearch = ({ onOpenSearch, value, onClickRightAction, isRightActive = false, showButton = true,buttonTitle = '搜索',showFilterOutlined=false }) => {
+
+ return (
+ <div className="mySearchBar">
+ <div className="mySearchBar-search" onClick={onOpenSearch}>
+ <SearchOutlined />
+ <span>{value || '搜索'}</span>
+ </div>
+ {
+ showButton &&
+ <div style={{ marginLeft: '16px' }} className={`mySearchBar-scan ${isRightActive && 'mySearchBar-scan-active'}`} onClick={onClickRightAction}>
+ {
+ showFilterOutlined &&
+ <FilterOutlined className="mySearchBar-scan-icon" />
+ }
+ <span>{buttonTitle}</span>
+ </div>
+ }
+
+ </div>
+ );
+};
+
+export default MySearch;
diff --git a/src/components/MySearchBar/index.less b/src/components/MySearchBar/index.less
new file mode 100644
index 0000000..3437552
--- /dev/null
+++ b/src/components/MySearchBar/index.less
@@ -0,0 +1,34 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.mySearchBar {
+ display: flex;
+ align-items: center;
+ padding: 8px 12px;
+ background-color: @common_bg_z1_color;
+ position: relative;
+ z-index: 2;
+
+ &-search {
+ height: 32px;
+ flex: 1;
+ background: #eaeced;
+ border-radius: 5px;
+ padding: 0 12px;
+ color: #8f9192;
+ line-height: 32px;
+ }
+
+ &-scan {
+ display: flex;
+ align-items: center;
+
+ &-icon {
+ font-size: 16px;
+ margin-right: 4px;
+ }
+
+ &-active {
+ color: @theme_primary1_color;
+ }
+ }
+}
diff --git a/src/components/MySearchNoSelectBar/index.jsx b/src/components/MySearchNoSelectBar/index.jsx
new file mode 100644
index 0000000..e921254
--- /dev/null
+++ b/src/components/MySearchNoSelectBar/index.jsx
@@ -0,0 +1,30 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-09 15:52:45
+ * @LastEditTime: 2023-05-16 17:07:35
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 搜索栏
+ */
+import React from 'react';
+import { SearchOutlined, FilterOutlined } from 'dd-icons';
+import './index.less';
+
+/**
+ * onOpenSearch: func // 点击搜索回调
+ * onClickRightAction: func // 点击右侧按钮回调
+ * isRightActive: bool // 是否执行了右侧按钮
+ */
+const MySearchNoSelectBar = ({ onOpenSearch, searchTitle }) => {
+ return (
+ <div className="MySearchNoSelectBar">
+ <div className="MySearchNoSelectBar-search" onClick={onOpenSearch}>
+ <SearchOutlined style={{ marginRight: '4px' }} />
+ <span>{searchTitle || '搜索'}</span>
+ </div>
+ </div>
+ );
+};
+
+export default MySearchNoSelectBar;
diff --git a/src/components/MySearchNoSelectBar/index.less b/src/components/MySearchNoSelectBar/index.less
new file mode 100644
index 0000000..bdafd81
--- /dev/null
+++ b/src/components/MySearchNoSelectBar/index.less
@@ -0,0 +1,32 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.MySearchNoSelectBar {
+ display: flex;
+ align-items: center;
+ padding: 8px 12px;
+ background-color: @common_bg_z1_color;
+
+ &-search {
+ height: 32px;
+ flex: 1;
+ background: #eaeced;
+ border-radius: 5px;
+ padding: 0 12px;
+ color: rgba(0, 0, 0, 0.5);
+ line-height: 32px;
+ }
+
+ &-scan {
+ display: flex;
+ align-items: center;
+
+ &-icon {
+ font-size: 16px;
+ margin-right: 4px;
+ }
+
+ &-active {
+ color: @theme_primary1_color;
+ }
+ }
+}
diff --git a/src/components/MyTabs/index.jsx b/src/components/MyTabs/index.jsx
new file mode 100644
index 0000000..b84405e
--- /dev/null
+++ b/src/components/MyTabs/index.jsx
@@ -0,0 +1,31 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-20 19:25:50
+ * @LastEditTime: 2022-09-16 15:13:18
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的“tabs”组件
+ */
+import React from 'react';
+import './index.less';
+
+const MyTabs = ({ tabs = [], activeKey, onChange, keyStr = ['key', 'title'] }) => {
+ return (
+ <div className="myTabs">
+ {tabs.map((x, t) => {
+ return (
+ <div
+ onClick={() => onChange(x[keyStr[0]] || t)}
+ key={x[keyStr[0]] || t}
+ className={`myTabs-tab ${activeKey === (x[keyStr[0]] || t) ? 'myTabs-active' : ''}`}
+ >
+ {x[keyStr[1]]}
+ </div>
+ );
+ })}
+ </div>
+ );
+};
+
+export default MyTabs;
diff --git a/src/components/MyTabs/index.less b/src/components/MyTabs/index.less
new file mode 100644
index 0000000..314da0b
--- /dev/null
+++ b/src/components/MyTabs/index.less
@@ -0,0 +1,33 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myTabs {
+ color: @common_level2_base_color;
+ display: flex;
+
+ &-tab {
+ text-align: center;
+ margin-right: 16px;
+ }
+
+ &-tab:last-child {
+ margin-right: 0;
+ }
+
+ &-active {
+ position: relative;
+ color: @theme_primary1_color;
+ font-weight: 600;
+
+ &::after {
+ content: '';
+ height: 4px;
+ width: 22px;
+ background-color: @theme_primary1_color;
+ position: absolute;
+ left: 50%;
+ margin-left: -11px;
+ border-radius: 4px;
+ bottom: -6px;
+ }
+ }
+}
diff --git a/src/components/MyTabsBuilding/index.jsx b/src/components/MyTabsBuilding/index.jsx
new file mode 100644
index 0000000..bd329e1
--- /dev/null
+++ b/src/components/MyTabsBuilding/index.jsx
@@ -0,0 +1,42 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-20 19:25:50
+ * @LastEditTime: 2023-04-19 14:53:09
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 我的“tabs”组件
+ */
+import React from 'react';
+import './index.less';
+
+// type: 1-带下划线样式 2-不带下划线样式
+
+const MyTabsBuilding = ({ tabs = [], type = '1', activeKey, onChange, keyStr = ['key', 'title'] }) => {
+ return (
+ <div className="MyTabsBuilding">
+ {tabs.map((x, t) => {
+ return (
+ <>
+ {type == 1 ? <div
+ onClick={() => onChange(x[keyStr[0]] || t)}
+ key={x[keyStr[0]] || t}
+ className={`MyTabsBuilding-tab ${activeKey === (x[keyStr[0]] || t) ? 'MyTabsBuilding-active' : ''}`}
+ >
+ {x[keyStr[1]]}
+ </div> : <div
+ onClick={() => onChange(x[keyStr[0]] || t)}
+ key={x[keyStr[0]] || t}
+ className={`MyTabsBuilding-tab1 ${activeKey === (x[keyStr[0]] || t) ? 'MyTabsBuilding-active1' : ''}`}
+ >
+ {x[keyStr[1]]}
+ </div>
+ }
+ </>
+ );
+ })}
+ </div>
+ );
+};
+
+export default MyTabsBuilding;
diff --git a/src/components/MyTabsBuilding/index.less b/src/components/MyTabsBuilding/index.less
new file mode 100644
index 0000000..b642d61
--- /dev/null
+++ b/src/components/MyTabsBuilding/index.less
@@ -0,0 +1,44 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.MyTabsBuilding {
+ color: @common_level2_base_color;
+ display: flex;
+ &-tab {
+ flex-shrink: 0;
+ text-align: center;
+ margin-right: 16px;
+ }
+
+ &-tab:last-child {
+ margin-right: 0;
+ }
+
+ &-active {
+ position: relative;
+ color: @theme_primary1_color;
+ font-weight: 600;
+
+ &::after {
+ content: '';
+ height: 2px;
+ width: 22px;
+ background-color: @theme_primary1_color;
+ position: absolute;
+ left: 50%;
+ margin-left: -11px;
+ bottom: -8px;
+ }
+ }
+
+ &-tab1 {
+ line-height: 20px;
+ font-size: 12px;
+ text-align: center;
+ margin-right: 16px;
+ }
+ &-active1 {
+ position: relative;
+ color: @theme_primary1_color;
+ font-weight: 600;
+ }
+}
diff --git a/src/components/MyTabsHeads/index.jsx b/src/components/MyTabsHeads/index.jsx
new file mode 100644
index 0000000..a63f38f
--- /dev/null
+++ b/src/components/MyTabsHeads/index.jsx
@@ -0,0 +1,32 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-20 19:25:50
+ * @LastEditTime: 2024-01-19 11:24:16
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 我的“tabs”组件
+ */
+import React from 'react';
+import './index.less';
+
+const MyTabsHeads = ({ tabs = [], activeKey, onChange, keyStr = ['key', 'title'] }) => {
+ return (
+ <div className="myTabs-heads">
+ {tabs.map((x, t) => {
+ return (
+ <div
+ onClick={() => onChange(x[keyStr[0]] || t)}
+ key={x[keyStr[0]] || t}
+ className={`myTabs-heads-tab ${activeKey === (x[keyStr[0]] || t) ? 'myTabs-heads-active' : ''}`}
+ >
+ <div className="myTabs-heads-img">{activeKey === (x[keyStr[0]] || t) ? x.iconActive : x.icon}</div>
+ <div className="myTabs-heads-title">{x[keyStr[1]]}</div>
+ </div>
+ );
+ })}
+ </div>
+ );
+};
+
+export default MyTabsHeads;
diff --git a/src/components/MyTabsHeads/index.less b/src/components/MyTabsHeads/index.less
new file mode 100644
index 0000000..6562dc8
--- /dev/null
+++ b/src/components/MyTabsHeads/index.less
@@ -0,0 +1,50 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myTabs-heads {
+ color: @common_level2_base_color;
+ display: flex;
+ justify-content: space-around;
+
+ &-img {
+ width: 24px;
+ height: 24px;
+ margin-bottom: 4px;
+ & img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ &-title {
+ font-size: 14px;
+ line-height: 22px;
+ }
+ &-tab {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ margin-right: 16px;
+ }
+
+ &-tab:last-child {
+ margin-right: 0;
+ }
+
+ &-active {
+ position: relative;
+ color: @theme_primary1_color;
+ font-weight: 600;
+
+ // &::after {
+ // content: '';
+ // height: 4px;
+ // width: 22px;
+ // background-color: @theme_primary1_color;
+ // position: absolute;
+ // left: 50%;
+ // margin-left: -11px;
+ // border-radius: 4px;
+ // bottom: -6px;
+ // }
+ }
+}
diff --git a/src/components/NavBarPage/index.jsx b/src/components/NavBarPage/index.jsx
new file mode 100644
index 0000000..626051d
--- /dev/null
+++ b/src/components/NavBarPage/index.jsx
@@ -0,0 +1,60 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-08 17:19:10
+ * @LastEditTime: 2025-04-16 09:52:27
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 导航栏页面
+ */
+import React from 'react';
+import { MoreOutlined, LeftArrow2Outlined } from 'dd-icons';
+import { useHistory, useLocation } from 'react-router-dom';
+import './index.less';
+import { getLocal, isDebug, showToast } from '../../utils/utility';
+
+/**
+ * title: string; 导航栏标题
+ * leftContentVisible: bool; 是否显示导航栏左侧按钮
+ * leftContentFunc: func; 导航栏左侧按钮方法
+ * rightContentFunc: func; 导航栏右侧按钮方法
+ * rightChildren: React.ReactNode; 导航栏右侧按钮内容
+ * className: string, 导航栏背景颜色
+ */
+const NavBarPage = ({ children, title = '标题', leftContentVisible = true, leftContentFunc, rightContentFunc, rightChildren, className }) => {
+ const history = useHistory();
+
+ const location = useLocation();
+
+ // 点击返回icon
+ function handleClickBack() {
+ if (!!leftContentFunc) {
+ leftContentFunc();
+ } else {
+ // showToast({ content: '返回时提示' });
+ history.goBack();
+ }
+ }
+
+ return (
+ <>
+ <div className={`navBarPage-navbar ${className || ''}`}>
+ {!!leftContentVisible && (
+ <div className="navBarPage-navbar-left" onClick={handleClickBack}>
+ <LeftArrow2Outlined />
+ </div>
+ )}
+ <div className="navBarPage-navbar-title">{title}</div>
+ {!!rightContentFunc && (
+ <div onClick={rightContentFunc} className="navBarPage-navbar-right">
+ {rightChildren}
+ </div>
+ )}
+ </div>
+ <div className="navBarPage-height" />
+ {children}
+ </>
+ );
+};
+
+export default NavBarPage;
diff --git a/src/components/NavBarPage/index.less b/src/components/NavBarPage/index.less
new file mode 100644
index 0000000..faedc9b
--- /dev/null
+++ b/src/components/NavBarPage/index.less
@@ -0,0 +1,51 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+@import (reference) '../../styles/public.less';
+
+.navBarPage {
+ &-navbar {
+ height: @navBarHeight;
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ z-index: 999;
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ &-left {
+ font-size: 18px;
+ height: @navBarHeight;
+ line-height: @navBarHeight;
+ padding: 0 16px;
+ }
+
+ &-right {
+ font-size: 14px;
+ height: @navBarHeight;
+ line-height: @navBarHeight;
+ padding: 0 12px;
+ }
+
+ &-title {
+ position: absolute;
+ top: 0;
+ height: @navBarHeight;
+ left: 50px;
+ // right: 50px;
+ min-width: 270px;
+ text-align: center;
+ font-size: 18px;
+ line-height: @navBarHeight;
+ white-space: nowrap; /* 防止文字换行 */
+ overflow: hidden; /* 隐藏超出的部分 */
+ text-overflow: ellipsis; /* 显示省略号 */
+ }
+ }
+
+ &-height {
+ min-height: @navBarHeight;
+ }
+}
diff --git a/src/components/NewModalContent/index.jsx b/src/components/NewModalContent/index.jsx
new file mode 100644
index 0000000..ed57a9c
--- /dev/null
+++ b/src/components/NewModalContent/index.jsx
@@ -0,0 +1,87 @@
+import React, { useEffect, useState, useRef } from 'react';
+import MyModal from '../MyModal';
+import { Button } from 'dingtalk-design-mobile';
+import './index.less';
+import Overlay from '../Overlay';
+import { del } from '../../assets/icon';
+
+// height 高度建议不要高于80%， top 距离顶部的距离
+const NewModalContent = ({ title, buttonTitle = '确定', headBackground, headStyle, centerBackground, footBackground, content, zIndex = 999, width = '94%', onOk = true, height = '50%', top = '150px', centerMinHeight = '0', centerMaxHeight = '440px', visible, center, bottom, disabledButton = false, visibleOnClick, buttonNum }) => {
+ const modalRef = useRef();
+
+ const [styles, setStyles] = useState();
+
+ useEffect(() => {
+ if (!visible) return;
+ let obj = {};
+ let countWidth = 0;
+ if (width.toString().indexOf('%') !== -1) {
+ let windowWidth = document.body.clientWidth;
+ countWidth = (windowWidth * parseInt(width)) / 100;
+ } else {
+ countWidth = width;
+ }
+ if (center) {
+ obj = {
+ top: '50%',
+ marginTop: `-${modalRef.current.clientHeight / 2}px`,
+ // width: `${countWidth}px`,
+ width: '375.5px',
+ left: '50%',
+ // marginLeft: `-${Number(countWidth) / 2}px`,
+ marginLeft: '-188.25px'
+ };
+ } else if (bottom) {
+ obj = {
+ bottom: '24px',
+ left: '24px',
+ right: '24px',
+ };
+ } else {
+ obj = {
+ top: top,
+ width: '375.5px',
+ // width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: '-188.25px'
+ // marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ }
+ setStyles(obj);
+ }, [bottom, center, visible, width]);
+ return (
+ <div >
+ {
+ visible && (
+ <div ref={modalRef} className="ModalLContent" style={{ ...styles, zIndex: zIndex }}>
+ <div className='ModalLContent-main'>
+ <div className='ModalLContent-head' style={headBackground ? { backgroundColor: '#fff', color: '#171A1D' } : { ...headStyle }} >{title}</div>
+ <div className='ModalLContent-content' style={{ minHeight: centerMinHeight, maxHeight: centerMaxHeight, backgroundColor: centerBackground }}>{content}</div>
+ <div style={{ zIndex: zIndex, backgroundColor: footBackground ? "#ffffff" : "#f2f2f2", margin: '0', borderRadius: '0 0 10px 10px' }} >
+ {
+ onOk &&
+ <Button
+ disabled={disabledButton}
+ onClick={() => {
+ visibleOnClick('submit', false);
+ }}
+ style={{ flex: 2 }}
+ type="primary"
+ >
+ {buttonTitle}{buttonNum ? `(${buttonNum})` : ''}
+ </Button>
+ }
+ </div>
+ <div className="ModalLContent-bottom" style={{ zIndex: zIndex }} onClick={() => visibleOnClick('', false)}>
+ <img className="ModalLContent-bottom-img" style={{ zIndex: zIndex }} src={del} alt="" />
+ </div>
+ </div>
+ </div>
+ )
+ }
+ < Overlay zIndex={zIndex - 1} show={visible} onOverlay={() => visibleOnClick('', false)} />
+ </div>
+ );
+};
+
+export default NewModalContent;
\ No newline at end of file
diff --git a/src/components/NewModalContent/index.less b/src/components/NewModalContent/index.less
new file mode 100644
index 0000000..069f944
--- /dev/null
+++ b/src/components/NewModalContent/index.less
@@ -0,0 +1,53 @@
+.ModalLContent {
+ position: fixed;
+ overflow-y: auto;
+ border-radius: 0px;
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+ &-head {
+ background-color: #007fff;
+ color: #fff;
+ text-align: center;
+ font-size: 16px;
+ line-height: 24px;
+ padding: 12px 12px;
+ }
+ &-content {
+ flex: 1;
+ overflow: auto;
+ // min-height: 302px;
+ max-height: 440px;
+ // border-radius: 0 0 10px 10px;
+ background: #f2f2f2;
+ & :focus-visible {
+ outline: -webkit-focus-ring-color auto 0px;
+ }
+ }
+ &-bottom {
+ // position: absolute;
+ // bottom: -40px;
+ margin-top: 16px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ &-img {
+ width: 24px;
+ height: 24px;
+ }
+ }
+
+ &-item {
+ padding: 8px;
+ margin-bottom: 4px;
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ &-item:last-child {
+ margin-bottom: 0;
+ }
+}
diff --git a/src/components/Overlay/index.jsx b/src/components/Overlay/index.jsx
new file mode 100644
index 0000000..561bfd2
--- /dev/null
+++ b/src/components/Overlay/index.jsx
@@ -0,0 +1,25 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-11 11:24:42
+ * @LastEditTime: 2022-08-21 14:25:33
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 遮罩层
+ */
+import React from 'react';
+import './index.less';
+
+/**
+ * show: bool; // 显示隐藏
+ * zIndex: number; // 层级
+ * bgColor: string; // 背景色
+ * onOverlay: func; // 点击蒙层触发
+ */
+const Overlay = ({ show, zIndex, bgColor, onOverlay }) => {
+ return (
+ <div onClick={onOverlay} className={`overlay ${show ? '' : 'overlay-fade-leave'}`} style={{ zIndex: zIndex || 998, backgroundColor: bgColor }} />
+ );
+};
+
+export default Overlay;
diff --git a/src/components/Overlay/index.less b/src/components/Overlay/index.less
new file mode 100644
index 0000000..16fcebb
--- /dev/null
+++ b/src/components/Overlay/index.less
@@ -0,0 +1,16 @@
+.overlay {
+ background-color: rgba(0, 0, 0, 0.7);
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ transition-timing-function: ease;
+ transition-duration: 300ms;
+ transition-property: opacity;
+
+ &-fade-leave {
+ opacity: 0;
+ transform: translate3d(-100%, 0, 0);
+ }
+}
diff --git a/src/components/PreviewImage/index.jsx b/src/components/PreviewImage/index.jsx
new file mode 100644
index 0000000..2805bc8
--- /dev/null
+++ b/src/components/PreviewImage/index.jsx
@@ -0,0 +1,25 @@
+import React, { Fragment, useState } from 'react'
+import { Image } from '@arco-design/web-react';
+import { IconAttachment } from '@arco-design/web-react/icon';
+import './index.less';
+import * as $$ from '../../utils/utility';
+
+const appUrl = $$.appUrl;
+
+export default function PreviewImage(props) {
+ const [visible, setVisible] = useState(false)
+ const { name, src, ...rest } = props
+ return (
+ <Fragment>
+ <div style={{ display: 'none' }}>
+ <Image.Preview
+ src={`${appUrl.fileUrl}/${appUrl.sys}${src}`}
+ visible={visible}
+ onVisibleChange={setVisible}
+ {...rest}
+ />
+ </div>
+ <div onClick={() => { setVisible(true) }} style={{ color: '#1a6fb8', cursor: 'pointer', display: 'flex', alignItems: 'center', gap: '4px' }}><IconAttachment style={{ color: '#1A6FB8' }} /><span>{name}</span></div>
+ </Fragment>
+ )
+}
diff --git a/src/components/PreviewImage/index.less b/src/components/PreviewImage/index.less
new file mode 100644
index 0000000..c41cad6
--- /dev/null
+++ b/src/components/PreviewImage/index.less
@@ -0,0 +1,24 @@
+.title-file {
+ width: 14px;
+ height: 14px;
+ margin-right: 4px;
+ margin-top: -2px;
+}
+
+:global {
+ .preview-image-wrapper {
+ z-index: 1100 !important;
+ }
+
+ .arco-image-preview {
+ z-index: 1100 !important;
+ }
+
+ .arco-image-preview-wrapper {
+ z-index: 1100 !important;
+ }
+
+ .arco-image-preview-mask {
+ z-index: 1100 !important;
+ }
+}
\ No newline at end of file
diff --git a/src/components/ProgressStep/VisitStep.jsx b/src/components/ProgressStep/VisitStep.jsx
new file mode 100644
index 0000000..d2e33f5
--- /dev/null
+++ b/src/components/ProgressStep/VisitStep.jsx
@@ -0,0 +1,216 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2024-08-29 14:57:06
+ * @LastEditors: lwh
+ * @LastEditTime: 2025-01-02 16:14:02
+ * @FilePath: \gzDyh\gz-customerSystem\src\components\ProgressStep\VisitStep.jsx
+ * @Description: 来访登记步骤条
+ */
+
+import React, { Fragment, useEffect, useState } from 'react';
+import { Tooltip } from 'antd';
+import { ledger_8, ledger_7, ledger_12, ledger_13, ledger_14 } from '../../assets/img';
+import * as $$ from '../../utils/utility';
+import PreviewImage from '../PreviewImage';
+import './index.less';
+
+
+/**
+ * progressData: {
+ * assistCaseFlowList: [],//配合部门流程数组
+ * handleCaseFlowList: [],//承办部门流程数组
+ * }, // 流程数据
+ */
+const ProgressStep = ({ progressData }) => {
+ const [proType, setProType] = useState('handleCaseFlowList')
+ const [assistType, setAssistType] = useState('')
+ const [progressList, setProgressList] = useState([]);
+ const iconMap = {
+ 1: ledger_7,//完成
+ 2: ledger_12,//回退
+ 3: ledger_13,//上报
+ 4: ledger_14,//不予受理
+ }
+ const btnList = [
+ {
+ value: 'handleCaseFlowList',
+ label: '承办部门'
+ },
+ {
+ value: 'assistCaseFlowList',
+ label: '配合部门'
+ },
+ ]
+
+ useEffect(() => {
+ setProType('handleCaseFlowList')
+ setProgressList(progressData.handleCaseFlowList)
+ setAssistType(progressData.assistCaseFlowList && progressData.assistCaseFlowList[0]?.unitId || '')
+ }, [progressData])
+
+ //详细结果的处理
+ const typeDom = (data) => {
+ console.log(data);
+ const dom = data.fileInfoList?.map((result, resIndex) => {
+ return <div style={{ display: 'inline-block' }}>
+ <PreviewImage name={result.name} src={result.showUrl} />
+ {resIndex !== data.fileInfoList?.length - 1 && <>，</>}
+ </div>
+ })
+ console.log(dom);
+ //审核结果同意
+ if (data.auditResult && data.auditResult == '24_00004-1') {
+ return <div>
+ <div>审核结果：<span style={{ color: '#00B42A' }}>{data.auditResultName}</span></div>
+ {dom}
+ </div>
+ }
+ //审核结果不同意
+ if (data.auditResult && data.auditResult == '24_00004-2') {
+ return <div>
+ <div>审核结果：<span style={{ color: '#FF4D4F' }}>{data.auditResultName}</span></div>
+ {dom}
+ </div>
+ }
+ //化解结果成功
+ if (data.mediResult && data.mediResult == '22_00025-1') {
+ return <div>
+ <div>审核结果：<span style={{ color: '#00B42A' }}>{data.mediResultName}</span></div>
+ {dom}
+ </div>
+ }
+ //化解结果不成功
+ if (data.mediResult && data.mediResult == '22_00025-2') {
+ return <div>
+ <div>审核结果：<span style={{ color: '#FF4D4F' }}>{data.mediResultName}</span></div>
+ {dom}
+ </div>
+ }
+ return <div>
+ <div>{data.handleNotes || '-'}</div>
+ {dom}
+ </div>
+ }
+
+ return (
+ <Fragment>
+ {progressData.assistCaseFlowList &&
+ <>
+ <div className='tabBtn'>
+ {btnList.map((item, index) => {
+ return <div
+ className={`tabBtn-btn ${proType === item.value ? 'tabBtn-active' : ''}`}
+ key={item.value}
+ onClick={() => {
+ setProType(item.value)
+ if (item.value == 'handleCaseFlowList') {
+ setProgressList(progressData.handleCaseFlowList)
+ } else {
+ const findData = progressData.assistCaseFlowList?.find(res => res.unitId == assistType) || {}
+ setProgressList(findData.caseFlowList || [])
+ }
+ }}
+ style={{ marginRight: (index + 1) !== btnList.length ? '20px' : '0' }}
+ >{item.label == '配合部门' ? `${item.label}（${progressData.assistCaseFlowList.length}）` : item.label}</div>
+ })}
+ </div>
+ {
+ (proType == 'assistCaseFlowList' && progressData.assistCaseFlowList && progressData.assistCaseFlowList.length !== 0) && <div className='tabBtn'>
+ {progressData.assistCaseFlowList?.map(item => {
+ return <div
+ key={item.unitId}
+ className={`tabBtn-unit ${assistType === item.unitId ? 'tabBtn-unitActive' : ''}`}
+ onClick={() => {
+ setAssistType(item.unitId)
+ setProgressList(item.caseFlowList)
+ }}
+ >
+ {item.unitName}
+ </div>
+ })}
+ </div>
+ }
+ </>
+ }
+ {progressList && progressList.length !== 0
+ ? progressList.map((x, t) => {
+ return (
+ <div key={t + 1}>
+ <div className="myStep-item">
+ <div>
+ <div
+ className={`myStep-item-icon1 myStep-item-${x.status === 1 ? 'noStarted1' : 'success1'}`}
+ style={{ padding: '4px' }}
+ >
+ <div className="myStep-item-title" style={x.nodeShowName && x.nodeShowName.length === 4 ? {
+ display: 'block',
+ width: '100%',
+ textAlign: 'center'
+ } : {}}>
+ {x.nodeShowName && x.nodeShowName.length === 4 ?
+ <>
+ {x.nodeShowName.substring(0, 2)}<br/>
+ {x.nodeShowName.substring(2, 4)}
+ </> :
+ (x.nodeShowName || '事件流转')
+ }
+ </div>
+ <img className='myStep-item-img' src={x.status === 1 ? ledger_8 : iconMap[x.taskType]} alt="" />
+ </div>
+ {t === progressList.length - 1 ? null : <div className='myStep-item-divider' />}
+ </div>
+ <div className="myStep-item-right">
+ {x.status === 1 ?
+ <div>
+ <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}>
+ {x.statusName || '-'}
+ </div>
+ <div className="myStep-item-p">
+ <span>{x.processName || '-'}</span>
+ </div>
+ {
+ (x.readStatus === 0 || x.readStatus === 1) && <div className={x.readStatus === 0 ? 'myStep-item-noread' : 'myStep-item-read'}>
+ {x.readStatus === 0 ? '未读' : '已读 | ' + $$.minuteFormat(x.readTime)}
+ </div>
+ }
+ </div>
+ :
+ <div>
+ <div className="myStep-item-p">
+ <span>{x.handleUnitName || '-'}</span>
+ </div>
+ {x.handleUserName &&
+ <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}>
+ <span>操作人：</span>
+ <span>{x.handleUserName}</span>
+ </div>
+ }
+ <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}>
+ <span>操作时间：</span>
+ <span>{$$.minuteFormat(x.handleTime)}</span>
+ </div>
+ {
+ x.handleNotes &&
+ <div className='myStep-item-p-yy' style={{ width: '300px' }}>
+ <span className='myStep-item-p-yy-l'>
+ <span>
+ <Tooltip placement="top" title={x.handleNotes || ''}>
+ {typeDom(x)}
+ </Tooltip>
+ </span>
+ </span>
+ </div>
+ }
+ </div>
+ }
+ </div>
+ </div>
+ </div>
+ );
+ })
+ : <div style={{ padding: '100px 0' }}>{'暂无数据'}</div>}
+ </Fragment>
+ );
+};
+
+export default ProgressStep;
diff --git a/src/components/ProgressStep/index.less b/src/components/ProgressStep/index.less
new file mode 100644
index 0000000..9bdcf34
--- /dev/null
+++ b/src/components/ProgressStep/index.less
@@ -0,0 +1,272 @@
+@import '../../styles/theme.less';
+
+.myStep {
+ &-item {
+ position: relative;
+ padding-bottom: 34px;
+
+ &-success {
+ background-color: @main-color;
+
+ &::after {
+ border-color: #bfbfbf;
+ }
+ }
+
+ &-success1 {
+ background-color: @main-color;
+
+ &::after {
+ border-color: #bfbfbf;
+ }
+ }
+
+ &-noStarted {
+ background-color: #1890ff;
+
+ &::after {
+ border-color: #1890ff;
+ }
+ }
+
+ &-noStarted1 {
+ background-color: rgba(185, 99, 211, 1);
+
+ &::after {
+ border-color: rgba(185, 99, 211, 1);
+ }
+ }
+
+ &-icon {
+ float: left;
+ margin-right: 8px;
+ font-size: 12px;
+ line-height: 12px;
+ width: 22px;
+ height: 22px;
+ padding: 5px;
+ border-radius: 50%;
+ color: #ffffff;
+ }
+
+ &-icon1 {
+ float: left;
+ margin-right: 8px;
+ font-size: 12px;
+ line-height: 12px;
+ width: 52px;
+ height: 52px;
+ padding: 4px !important;
+ border-radius: 5px;
+ color: #ffffff;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ box-sizing: border-box;
+ }
+
+ &-img {
+ width: 16px;
+ height: 16px;
+ background-color: #ffffff;
+ border-radius: 50%;
+ position: absolute;
+ right: -4px;
+ bottom: 0;
+ }
+
+ &-divider {
+ position: absolute;
+ top: 56px; //52+4
+ left: 24px;
+ width: 2px;
+ bottom: 4px;
+
+ &::after {
+ content: '';
+ display: inline-block;
+ height: 100%;
+ border-left: 2px solid;
+ border-color: @divider-color;
+ }
+
+ &-success {
+ &::after {
+ border-color: @divider-color;
+ }
+ }
+ }
+
+ &-divider1 {
+ position: absolute;
+ top: 0;
+ left: 24px;
+ width: 3px;
+ height: 32px+52px+30px;
+ padding-top: 22px;
+
+ &::after {
+ content: '';
+ display: inline-block;
+ height: 32px+52px+30px;
+ border-left: 2px solid;
+ border-color: @divider-color;
+ }
+
+ &-success {
+ &::after {
+ border-color: @divider-color;
+ }
+ }
+ }
+
+ &-divider2 {
+ position: absolute;
+ top: 0;
+ left: 24px;
+ width: 3px;
+ height: 32px+52px+60px;
+ padding-top: 22px;
+
+ &::after {
+ content: '';
+ display: inline-block;
+ height: 32px+52px+60px;
+ border-left: 2px solid;
+ border-color: @divider-color;
+ }
+
+ &-success {
+ &::after {
+ border-color: @divider-color;
+ }
+ }
+ }
+
+ &-right {
+ overflow: hidden;
+ }
+
+ // &-title {
+ // font-weight: 600;
+ // }ｔｉｔｌｅ
+
+ &-title {
+ font-weight: 500;
+ font-size: 14px;
+ line-height: 20px;
+ text-align: center;
+ width: 100%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ word-break: break-all;
+ word-wrap: break-word;
+ }
+
+ &-p {
+ margin-top: 4px;
+ display: flex;
+ align-items: flex-start;
+
+ &-flex {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ margin-top: 8px;
+
+ &-title {
+ font-size: 12px;
+ line-height: 20px;
+ color: @text-color-secondary;
+ }
+ }
+
+ &-yy {
+ display: flex;
+ flex-direction: column;
+ margin-top: 8px;
+ background: #f3f2f7;
+ border-radius: 5px;
+ padding: 4px 8px;
+ color: rgba(0, 0, 0, 0.5);
+
+ &-l {
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
+ }
+ }
+
+ &-textArea {
+ max-width: 200px;
+ flex: 1;
+ overflow: hidden;
+ }
+
+ div.ant-typography {
+ margin: 0;
+ }
+
+ &-noread {
+ display: inline-block;
+ padding: 3px 8px;
+ background: #ffece8;
+ border-radius: 5px;
+ color: #F53F3F;
+ margin-top: 8px;
+ }
+
+ &-read {
+ display: inline-block;
+ padding: 3px 8px;
+ color: #00B42A;
+ background: #e8ffea;
+ border-radius: 5px;
+ margin-top: 8px;
+ }
+ }
+}
+
+.tabBtn {
+ display: flex;
+ margin-bottom: 12px;
+
+ &-btn {
+ height: 32px;
+ background: #ffffff;
+ border: 1px solid #e5e6eb;
+ border-radius: 4px;
+ color: #171A1D;
+ padding: 0 8px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-active {
+ color: #1a6fb8;
+ border-color: #1a6fb8;
+ }
+
+ &-unit {
+ height: 32px;
+ border-radius: 21px;
+ color: #1D2129;
+ padding: 0 12px;
+ cursor: pointer;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-unitActive {
+ background: #f3f2f7;
+ color: #1a6fb8;
+ }
+}
\ No newline at end of file
diff --git a/src/components/RenderFormView copy/index.jsx b/src/components/RenderFormView copy/index.jsx
new file mode 100644
index 0000000..ef107cc
--- /dev/null
+++ b/src/components/RenderFormView copy/index.jsx
@@ -0,0 +1,1187 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-15 20:09:04
+ * @LastEditTime: 2023-07-31 15:33:45
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:表单组件
+ */
+import React, { useState, useRef, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Picker, List, Space, Switch, Form, DatePicker, Input, Select, Button, Toast, Checkbox } from 'dingtalk-design-mobile';
+import { confirmModal } from '../../utils/utility';
+import FileShow from '../../components/FileShow';
+import { roomForm } from '../../assets/img';
+import IdcardOCR from '../../components/IdcardOCR';
+import MyModal from '../../components/MyModal';
+import { region, checkIdCard, checkTel, setLocal, confirmThreeButtonModal, myTimeFormat } from '../../utils/utility';
+import rule from '../../utils/rules';
+// import { applyForForm_3 } from '../../assets/cardImg';
+import { RightArrow2Outlined } from 'dd-icons';
+
+// form表单[]
+// formData表单value对象 {}
+// handleChange输入事件 fun
+// rightButtonOnClick 右侧点击按钮 fun
+// formstatus 表单登记状态是否显示 true flase
+// tabPage 页签
+// tabList 表单登记状态提示信息
+// 是否为新增表单
+const RenderFormView = ({ form, formData, handleChange, tabPage, tabList, rightButtonOnClick, formstatus, newAdd, metaAddrClick, OCRsuccessCallback }) => {
+ const history = useHistory();
+ const [data, setData] = useState({ list: [], total: 0 });
+ const [visible, setVisible] = useState(false);
+ const [expiredDateVisible, setExpiredDateVisible] = useState(false);
+ const [expiredDateData, setExpiredDateData] = useState({ visible: false, visible1: false, });
+ // 选择小区异常情况
+ const [diySelectData, setDiySelectData] = useState(false);
+
+ function render(item, i, listIndex, handleChange, rightButtonOnClick, form, formData, formstatus) {
+ const h = (items) => {
+ let { index, key, value } = items;
+ formData[key] = value;
+ handleChange(formData, key);
+ };
+
+ const fileH = (items, type) => {
+ if (type === 'add') {
+ formData.fileList = formData.fileList.concat(items)
+ } else {
+ formData.fileList = formData.fileList.filter(item => item.id !== items.id)
+ }
+ handleChange(formData, 'fileList');
+ }
+
+ const {
+ name,
+ require,
+ value,
+ type,
+ showTitle,
+ label,
+ list = [],
+ code,
+ extra = null,
+ margin,
+ display,
+ disabled = false,
+ desc,
+ placeholder = null,
+ files,
+ url,
+ img,
+ rightButton,
+ rightArrow,
+ miniLabel,
+ parameter,
+ startTime,
+ endTime,
+ } = item;
+ switch (type) {
+ case 'text':
+ case 'password':
+ case 'phone':
+ case 'idcard':
+ case 'digit':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <>
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ </>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ {name === 'idcard' && disabled === true ? (
+ <div
+ style={{ fontSize: '14px', lineHeight: '1.5', color: 'rgba(23, 26, 29, 0.24)' }}
+ onClick={(e) => {
+ Toast.info({
+ content: '不允许修改已登记居民的证件号，如填写错误，请迁出后重新添加',
+ });
+ }}
+ >
+ {formData[name] ? formData[name] : ''}
+ </div>
+ ) : (
+ <Input
+ className="render-form-view-input"
+ type={type}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ disabled={disabled}
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ )}
+ </Form.Item>
+ );
+ case 'number':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <>
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ </>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <Input
+ className="render-form-view-input"
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ disabled={disabled}
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ </Form.Item>
+ );
+ // 换行文本输入
+ case 'textBrief':
+ return (
+ <Form.Item
+ position="brief"
+ key={name}
+ label={
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <Input
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ className="render-form-view-input-brief"
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ </Form.Item>
+ );
+ // 单选框
+ case 'select':
+ case 'idcardType':
+ return (
+ <Picker
+ data={[list]}
+ cols={1}
+ key={name}
+ disabled={disabled}
+ title={label}
+ okText="确定"
+ cascade={false}
+ value={formData[name] ? list.find((it) => it.value == formData[name]) ? [formData[name]] : '' : ''}
+ onChange={(e) => {
+ h({ key: name, value: e[0] });
+ h({
+ key: desc,
+ value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item
+ className={`render-form-view-title ${disabled && 'select-color-disabled'} ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'
+ } ${listIndex - 1 == 0 && 'render-form-view-col-radius'}`}
+ arrow="horizontal"
+ >
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </Picker>
+ );
+
+ case 'diySelect':
+ return (
+ <>
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ </div>
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => setDiySelectData(true)}>
+ {formData[name] !== '99' && (formData[desc] ? <div>{formData[desc]}</div> : <div className="select-color">{placeholder}</div>)}
+ {formData[name] === '99' && (formData.groupname ? <div>{formData.groupname}</div> : <div className="select-color">{placeholder}</div>)}
+ <RightArrow2Outlined className="render-form-view-childView-rightArrow" />
+ </div>
+ </div>
+ </div>
+ <Picker
+ data={[list]}
+ cols={1}
+ key={name}
+ visible={diySelectData}
+ disabled={disabled}
+ title={'选择' + label}
+ okText="确定"
+ cascade={false}
+ value={formData[name] ? list.find((it) => it.value == formData[name]) ? [formData[name]] : '' : ''}
+ onVisibleChange={(e) => { setDiySelectData(!diySelectData) }}
+ onChange={(e) => {
+ console.log(e);
+ // 自行填写
+ if (e[0] === '99') {
+ h({ key: name, value: e[0] });
+ delete formData[desc]
+ // h({
+ // key: desc,
+ // value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ // });
+ rightButtonOnClick('自行填写')
+ } else {
+ h({ key: name, value: e[0] });
+ delete formData.groupname;
+ h({
+ key: desc,
+ value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ });
+ }
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ </Picker>
+ </>
+ );
+ // 多列单选框(区域，街道)
+ case 'selectCols':
+ return (
+ <Picker
+ key={name}
+ data={list}
+ cols={2}
+ title={label}
+ okText="确定"
+ cascade={true}
+ value={formData[name]}
+ onChange={(e, item) => {
+ h({ index: i, key: name, value: e });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </Picker>
+ );
+ // 多选框
+ case 'select_multiple':
+ return (
+ <div
+ key={name}
+ className={`${i == listIndex - 1 && 'render-form-view-multiple-bottom'} ${i == 0 && 'render-form-view-multiple-top'} ${listIndex - 1 == 0 && 'render-form-view-multiple-radius'
+ }`}
+ >
+ <Form.Item
+ label={
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className="render-form-view-switch"
+ >
+ <Select
+ mode="multiple"
+ value={formData[name]}
+ placeholder={
+ <div className="render-form-view-select_multiple">
+ <Space align="center">
+ <span style={{ color: '#171a1d' }}>{label}</span>
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div
+ className={
+ formData[name] == null || formData[name].length == 0
+ ? 'render-form-view-select_multiple-m'
+ : 'render-form-view-select_multiple-value'
+ }
+ >
+ {formData[desc] == null || formData[desc].length == 0 ? (
+ <span className="select-color">请选择</span>
+ ) : (
+ <span>{formData[desc].join(',').substr(0, 10) + '...'}</span>
+ )}
+ </div>
+ </div>
+ }
+ renderSelection={(vs) => {
+ return (
+ <div className="render-form-view-select_multiple">
+ <Space align="center">
+ <span style={{ color: '#171a1d' }}>{label}</span>
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div
+ className={
+ formData[name] == null || formData[name].length == 0
+ ? 'render-form-view-select_multiple-m'
+ : 'render-form-view-select_multiple-value'
+ }
+ >
+ {formData[name] == null || formData[desc].length == 0 ? '请选择' : formData[desc].join(',').substr(0, 10) + '...'}
+ </div>
+ </div>
+ );
+ }}
+ options={list}
+ title={label}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ h({ key: desc, value: e.map((it) => list.find((ite) => ite.value == it) ? list.find((ite) => ite.value == it).label : '') });
+ }}
+ />
+ </Form.Item>
+ </div>
+ );
+ // 三级联动选择地址
+ case 'district':
+ return (
+ <Picker
+ key={name}
+ data={region}
+ cols={3}
+ title={label}
+ okText="确定"
+ cascade={true}
+ value={formData[name]}
+ onChange={(e) => {
+ h({ index: i, key: name, value: e });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </Picker>
+ );
+ // 开关
+ case 'switch':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <span className="render-form-view-switch-title">{list[formData[name]] || list[0]}</span>
+ <Switch
+ checked={formData[name] == '0' || formData[name] == null ? false : formData[name] == '1' ? true : ''}
+ onChange={(e) => {
+ h({ index: i, key: name, value: e ? '1' : '0' });
+ }}
+ />
+ </Form.Item>
+ );
+ // 开关
+ case 'personSwitch':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <span className="render-form-view-switch-title">{list[formData[name]] || list[0]}</span>
+ <Switch
+ checked={formData[name] == '2' || formData[name] == null ? false : formData[name] == '1' ? true : ''}
+ disabled={disabled}
+ onChange={(e) => {
+ name === 'personType' && disabled === true ?
+ Toast.info({
+ content: '不允许修改已登记居民的证件号，如填写错误，请迁出后重新添加',
+ }) :
+ h({ index: i, key: name, value: e ? '1' : '2' });
+ }}
+ />
+ </Form.Item>
+ );
+ // 时间选择器
+ case 'time':
+ case 'date':
+ return (
+ <DatePicker
+ key={name}
+ title={label}
+ mode="date"
+ minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ extra={<span className="select-color">请选择</span>}
+ value={formData[name] ? new Date(formData[name]) : ''}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ }}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </DatePicker>
+ );
+
+ case 'expiredDate':
+ return (
+ <div onClick={() => {
+ console.log('startTime', startTime);
+ if (!expiredDateData.visible && expiredDateData.visible1) {
+ setExpiredDateData({ ...expiredDateData, visible: false, visible1: false, startTime: startTime, endTime: endTime })
+ } else {
+ setExpiredDateData({ ...expiredDateData, visible: true, visible1: true, startTime: startTime, endTime: endTime })
+ }
+ }}>
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ <div className="render-form-view-childView-flex">
+ <div className="render-form-view-childView-flex">
+ {!formData[endTime] && placeholder && <div className="select-color">{placeholder}</div>}
+ {formData[endTime] && placeholder && <div>
+ {myTimeFormat(formData[endTime], 'YYYY-M-D') == '2099-1-1' ? `${myTimeFormat(formData[startTime], 'YYYY-M-D')}~长期` : `${myTimeFormat(formData[startTime], 'YYYY-M-D')}~${myTimeFormat(formData[endTime], 'YYYY-M-D')}`}
+ </div>}
+ {<RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ // case 'expiredDate':
+ // return (
+ // <div onClick={() => {
+ // if (!expiredDateData.visible && expiredDateData.visible1) {
+ // setExpiredDateData({ visible: false, visible1: false })
+ // } else {
+ // setExpiredDateData({ visible: false, visible1: true })
+ // }
+ // }}>
+
+ // {
+ // myTimeFormat(formData[name], 'YYYY-M-D') == '2099-1-1' ?
+ // <div
+ // className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ // }`}
+ // >
+ // <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ // <div>
+ // <Space align="center" className="render-form-view-space">
+ // {label}
+ // {require && <span className="public-tag4">必填</span>}
+ // </Space>
+ // </div>
+ // <div className="render-form-view-childView-flex">
+ // <div style={{ display: 'flex' }}>
+ // 长期
+ // </div>
+ // <div className="render-form-view-childView-flex">
+ // {!formData[name] && placeholder && <div className="select-color">{placeholder[0]}</div>}
+ // {formData[name] && placeholder && <div>{placeholder[1]}</div>}
+ // {<RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ // </div>
+ // </div>
+ // </div>
+ // </div> :
+ // <DatePicker
+ // key={name}
+ // visible={expiredDateData.visible1}
+ // title={'证件有效期开始时间'}
+ // mode="date"
+ // minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ // maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ // extra={<span className="select-color">请选择</span>}
+ // value={formData[name] ? new Date(formData[name]) : ''}
+ // onOk={(e) => {
+ // setExpiredDateData({ visible: true, visible1: false })
+ // }}
+ // onDismiss={(e) => {
+ // setExpiredDateData({ visible: true, visible1: false })
+ // }}
+ // onChange={(e) => {
+ // h({ key: name, value: e });
+ // }}
+ // >
+ // <List.Item
+ // className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ // }`}
+ // arrow="horizontal"
+ // >
+ // <Space align="center" className="render-form-view-space">
+ // {label}
+ // {require && <span className="public-tag4">必填</span>}
+ // </Space>
+ // </List.Item>
+ // </DatePicker>
+ // }
+ // </div >
+ // );
+ case 'timeYear':
+ return (
+ <DatePicker
+ key={name}
+ title={label}
+ mode="year"
+ format={(val) => `${new Date(val).getFullYear()}年`}
+ extra={<span className="select-color">请选择</span>}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ }}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </DatePicker>
+ );
+ // 拍照证件回填
+ case 'idcardOCR':
+ return (
+ <div key={name} style={{ display: `${display ? display : 'flex'}` }}>
+ {list.map((x, t) => (
+ <IdcardOCR key={t} data={x} OCRsuccessCallback={OCRsuccessCallback} />
+ ))}
+ </div>
+ );
+ case 'files':
+ return (
+ <div key={type} className="render-form-view-files">
+ <Space align="center" className="render-form-view-space" style={{ marginBottom: '12px' }}>
+ {label}
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div style={{ display: 'flex', flexFlow: 'row wrap', rowGap: '8px', justifyContent: 'space-between' }}>
+ {list.map((x, t) => (
+ <FileShow
+ formData={formData}
+ fileList={formData[name]}
+ callback={(item, type) => { fileH(item, type) }}
+ key={t}
+ data={x}
+ ownerType={x.ownerType}
+ ownerId={x.ownerId ? formData[x.ownerId] : ''}
+ />
+ ))}
+ </div>
+ </div>
+ );
+
+ case 'files1':
+ return (
+ <div key={type} className="render-form-view-files">
+ <Space align="center" className="render-form-view-space" style={{ marginBottom: '8px' }}>
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ {
+ showTitle &&
+ <div style={{ backgroundColor: 'rgba(0,127,255,0.12)', fontSize: '12px', color: '#007fff', border: '1px solid #007fff', padding: '4px 8px', margin: '0 0 12px' }}>该申领人已有公安照片，如本次不上传新的制卡照片，将以公安照片作为制卡照片</div>
+ }
+ <div style={{ display: 'flex', flexFlow: 'row wrap', rowGap: '8px', justifyContent: 'space-between' }}>
+ {list.map((x, t) => (
+ <FileShow
+ formData={formData}
+ fileList={formData[name]}
+ callback={(item, type) => { fileH(item, type) }}
+ key={t}
+ data={x}
+ ownerType={x.ownerType}
+ ownerId={x.ownerId ? formData[x.ownerId] : ''}
+ />
+ ))}
+ </div>
+ <div style={{ display: 'flex', width: '148px', justifyContent: 'space-between', paddingTop: '12px' }}>
+ <div onClick={() => rightButtonOnClick('', '制卡照片要求')} className='public-color'>制卡照片要求</div>
+ <div onClick={() => rightButtonOnClick('', '拍照工具')} className='public-color'>拍照工具</div></div>
+ </div>
+ );
+ case 'childView':
+ // 标准地址选择
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ {formData[name] && <div>{formData[name]}</div>}
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => history.push(url)}>
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'childView2':
+ // 跳转页面后回显
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ if (parameter === 'buildingSelect' && formData[desc]?.length) {
+ confirmThreeButtonModal({
+ title: '操作提示',
+ subtitle: '请选择您的操作类型',
+ actions: [
+ {
+ text: '继续选择',
+ onClick: () => {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`${url}?id=${formData.id}`);
+ },
+ },
+ {
+ text: '查看已选择',
+ onClick: () => {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`/hztGrid/village/buildingSelectDetail?type=edit`);
+ },
+ },
+ { text: '取消操作' },
+ ],
+ });
+ } else {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`${url}?id=${formData.id}`);
+ }
+ }}
+ >
+ {formData[name] && <div>{formData[name]}</div>}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ // 社保卡领卡网点
+ case 'childView3':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ rightButtonOnClick(name, label)
+ }}
+ >
+ {formData[name] && <div>{formData[name]}</div>}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'imgView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ setLocal('dutyGridCodeEditFiles', {
+ files: formData[files],
+ });
+ history.push(`${url}?id=${formData[item.id]}&ownerType=${item.ownerType}`);
+ }}
+ >
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {formData[name] && <div>{formData[name]}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+ case 'buildView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ <div style={{ display: 'flex' }}>
+ {img && <img style={{ padding: '4px' }} src={img} alt="" />}
+ {formData[name] && (
+ <div className={`${formData[name] === '地名地址不符合规则，请检查后重新输入' && 'form-font-color-red'}`}>
+ {formData[name]}
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => rightButtonOnClick(label)}>
+ {!formData[name] && placeholder && <div className="select-color">{placeholder[0]}</div>}
+ {formData[name] && placeholder && <div>{placeholder[1]}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+ // 地名地址
+ case 'addressView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ </Space>
+ </div>
+ <div style={{ display: 'flex' }}>
+ {img && <img style={{ padding: '4px 4px 4px 0' }} src={img} alt="" />}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {formData[name] && (
+ <div
+ className={`${(formData[name] === '地名地址不符合规则，请检查后重新输入' || formData[name] === '街巷路名和村名只能填写其中一项') &&
+ 'form-font-color-red'
+ }`}
+ >
+ {formData[name]}
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ // 楼栋表单标题
+ case 'title':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ {img && (
+ <img
+ onClick={() => {
+ setVisible(true);
+ }}
+ src={img}
+ alt=""
+ />
+ )}
+ {require && <span className="public-tag4">必填</span>}
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+ case 'subTitle':
+ return (
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span >{label}</span>
+ {img && (
+ <img
+ onClick={() => {
+ setVisible(true);
+ }}
+ src={img}
+ alt=""
+ />
+ )}
+ {require && <span className="public-tag4">必填</span>}
+ </div>
+ {
+ formData[name] ?
+ <div className="render-form-view-childView-flex" onClick={() => rightButtonOnClick(rightButton, label)}>
+ <div>已签名</div>
+ <RightArrow2Outlined className="render-form-view-childView-rightArrow" />
+ </div> :
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton, label)}>
+ {rightButton}
+ </span>
+ </div>
+ }
+ </div>
+ </div>
+ );
+
+ // 地名地址头部
+ case 'addressTitle':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ <div style={{ display: 'flex', alignItems: 'center' }} onClick={() => {
+ setVisible(true);
+ }}>
+ <img
+ src={img}
+ alt=""
+ />
+ <span style={{ fontSize: '12px', color: '#007FFF' }}>查看规则</span>
+ </div>
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+
+ // 标签带按钮的
+ case 'selectTitle':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ <img
+ style={{ width: '12px', paddingLeft: '0' }}
+ src={img}
+ alt=""
+ /> {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+
+ default:
+ return null;
+ }
+ }
+
+ // 登记状态判断
+ function newTest(tabPage, tabList) {
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'red') {
+ return (
+ <div className="divider-Tabtitle-tabs-red">
+ <span></span>
+ {'异常登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'green') {
+ return (
+ <div className="divider-Tabtitle-tabs-green">
+ <span></span>
+ {'已登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'normal') {
+ return (
+ <div className="divider-Tabtitle-tabs">
+ <span></span>
+ {'未登记'}
+ </div>
+ );
+ }
+ }
+
+ return (
+ <div className="render-form-view-main">
+ {form.map((items, i) => {
+ return (
+ <div key={i}>
+ {items.titleTab && (
+ <div className="divider-Tabtitle">
+ <div>{items.titleTab}</div>
+ {formstatus && newTest(tabPage, tabList)}
+ </div>
+ )}
+ {/* {
+ items.selectTitle &&
+ <div className="divider-title" style={{ marginBottom: '0px' }}>
+ <div>{items.selectTitle}</div>
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick({}, items.selectTitle)}>
+ <img
+ style={{ width: '12px', paddingLeft: '0' }}
+ src={applyForForm_3}
+ alt=""
+ /> 选择
+ </span>
+ </div>
+ </div>
+ } */}
+ {(items.title !== 'ocr') && (
+ <div className={items.title ? 'divider-title' : (items.list.length > 0 ? 'divider-title-new' : 'divider-title-new111')}>
+ {items.title}
+ {items.title === '公安标准地址关联' && formData.metaAddr && (
+ <div onClick={() => metaAddrClick()} style={{ display: 'flex', alignItems: 'center' }} className="divider-Tabtitle-tabs-red">
+ <img style={{ width: '14px', height: '14px', marginRight: '4px' }} src={roomForm} alt="" />
+ {'取消关联'}
+ </div>
+ )}
+ </div>
+ )}
+ <div className="render-form-view-col">
+ {items.list.map((item, index) => {
+ return <div key={item.name + index}>{render(item, index, items.list.length, handleChange, rightButtonOnClick, form, formData)}</div>;
+ })}
+ </div>
+ </div>
+ );
+ })}
+ {/* 地名地址说明 */}
+ <MyModal visible={visible} center title="地名地址规范说明" onClose={() => setVisible(false)}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <div className="from-long-main-body-in">
+ <p>{`地名是人们对具有特定方位、地域范围的地理实体赋予的专有名称。`}</p>
+ <p>{`地址是有地名的详细表述，包括国家、省份、城市或乡村、街道、门牌号码、屋邨、大厦等建筑物名称，或者再加楼层数目、房间编号等。`}</p>
+ <p>{`<行政区划名><街巷路名|村名>[门牌号][小区名][标志物名][单元名][楼栋名（号）]。其中<>表示必填项，|表示或者，[]表示可选项。地名地址描述组合规则共有五大类十小类`}</p>
+ <div className="form-font-weight">{`A.<行政区划名><街巷路名><门牌号>[小区名][楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`1.行政区划名+街巷路名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸五西路30号 `}</div>
+ <div>{`2.行政区划名+街巷路名+门牌号+小区名+楼栋名（号）+商铺号 `}</div>
+ <div className="form-font-color-blue">{`示例：美兰区和平大道61号都市海岸8栋海景阁铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`B.<行政区划名><街巷路名><小区名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`3.行政区划名+街巷路名+小区名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍`}</div>
+ <div>{`4.行政区划名+街巷路名+小区名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍1栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`C.<行政区划名><街巷路名><门牌号><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`5.行政区划名+街巷路名+门牌号+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸二西路2号金源大厦`}</div>
+ <div>{`6.行政区划名+街巷路名+门牌号+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区人民大道58号海南大学海甸校区学生宿舍11栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`D.<行政区划名><街巷路名><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`7.行政区划名+街巷路名+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校`}</div>
+ <div>{`8.行政区划名+街巷路名+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校美术楼铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`E.<行政区划名><村名><门牌号>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`9.行政区划名+村名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区拦海中村165号`}</div>
+ <div>{`10.行政区划名+村名+门牌号+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：琼山区高登里二横97号1栋铺面1`}</div>
+ </div>
+ </div>
+ <div>
+ <div style={{ height: '1px', width: '100%', margin: '8px 0', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <Button
+ onClick={() => {
+ setVisible(false);
+ }}
+ style={{ width: '100%' }}
+ type="primary"
+ >
+ 我知道了
+ </Button>
+ </div>
+ </MyModal>
+ {
+ formData[expiredDateData.startTime] &&
+ <Picker
+ // data={[[{ label: myTimeFormat((new Date(formData.icExpiredStartTime).getTime() + 157680000000), `YYYY年M月D日`), value: new Date(new Date(formData.icExpiredDate).getTime() + 86400000) }, { label: '长期', value: '2' }]]}
+ data={[[
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: '长期', value: myTimeFormat(new Date('2099-1-1'), `YYYY-M-D`) }]]}
+ visible={expiredDateData.visible}
+ title="证件有效期"
+ okText="确定"
+ cascade={false}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false })}
+ onChange={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })
+ formData[expiredDateData.endTime] = new Date(e)
+ console.log('expiredDateData.startTime', expiredDateData.endTime);
+ console.log('formData', formData);
+ handleChange(formData, expiredDateData.endTime)
+ }
+ }
+ >
+ </Picker>
+
+ }
+ <DatePicker
+ visible={expiredDateData.visible1}
+ title={'证件有效期开始日期'}
+ mode="date"
+ minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ extra={<span className="select-color">请选择</span>}
+ cascade={true}
+ onChange={(e) => {
+ formData[expiredDateData.startTime] = e;
+ console.log('expiredDateData.startTime', expiredDateData);
+ console.log('formData', formData)
+ handleChange(formData, expiredDateData.startTime)
+ }}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })}
+ onOk={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: true, visible1: false })
+ }}
+ >
+ </DatePicker>
+ </div >
+ );
+};
+
+export default RenderFormView;
diff --git a/src/components/RenderFormView copy/index.less b/src/components/RenderFormView copy/index.less
new file mode 100644
index 0000000..bb05377
--- /dev/null
+++ b/src/components/RenderFormView copy/index.less
@@ -0,0 +1,305 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.select-color {
+ color: @common_level3_base_color;
+}
+
+.divider-title {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px;
+ display: flex;
+ justify-content: space-between;
+ &-new {
+ height: 8px;
+ }
+}
+
+.divider-title-ocr {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px 12px 0 12px;
+ display: flex;
+ justify-content: space-between;
+}
+
+.form-font-weight {
+ font-weight: 600;
+}
+
+.form-font-color-red {
+ color: #f5222d;
+}
+
+.form-font-color-blue {
+ color: #007fff;
+}
+
+.mini-divider-title {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 20px;
+}
+
+.select-color-disabled {
+ & .dtm-list-extra {
+ color: rgba(23, 26, 29, 0.24) !important;
+ }
+}
+
+.divider-Tabtitle {
+ font-size: 14px;
+ color: #007fff;
+ line-height: 20px;
+ margin: 12px 12px 0px 12px;
+ display: flex;
+ justify-content: space-between;
+
+ &-tabs {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #d9d9d9;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-green {
+ font-size: 12px;
+ color: #00b042;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #00b042;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-red {
+ font-size: 12px;
+ color: #ff5219;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #ff5219;
+ border-radius: 2px;
+ }
+ }
+}
+
+.dtm-list-item {
+ min-height: 46px;
+}
+
+.render-form-view {
+ &-main {
+ // overflow: hidden;
+ // padding-bottom: 16px;
+
+ & .dtm-space-item {
+ font-size: 14px;
+ }
+ }
+
+ &-overflow {
+ // height: 100%;
+ // overflow: scroll;
+ // &::-webkit-scrollbar {
+ // display: none !important;
+ // }
+ }
+
+ &-col {
+ padding: 0 12px;
+ }
+
+ &-col-top {
+ border-radius: 10px 10px 0px 0px;
+ }
+
+ &-col-bottom {
+ border-radius: 0px 0px 10px 10px;
+ }
+
+ &-col-radius {
+ border-radius: 10px;
+ }
+
+ &-input .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ text-align: right;
+ }
+
+ &-input-brief .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ // text-align: right;
+ }
+
+ &-title-borderRadius {
+ border-radius: 10px;
+ }
+
+ &-switch-title {
+ font-size: 14px;
+ padding-right: 8px;
+ color: #171a1d;
+ opacity: 0.85;
+ }
+
+ &-switch .dtm-switch-fake {
+ width: 43px !important;
+ height: 22px !important;
+ }
+
+ &-switch .dtm-switch-fake::after {
+ width: 18px !important;
+ height: 18px !important;
+ background-color: var(--common_white1_color, #ffffff);
+ }
+
+ &-switch .dtm-form-item-default-label {
+ width: auto;
+ }
+
+ &-multiple {
+ &-top .dtm-list-item-middle {
+ border-radius: 10px 10px 0px 0px;
+ }
+
+ &-bottom .dtm-list-item-middle {
+ border-radius: 0px 0px 10px 10px;
+ }
+
+ &-radius .dtm-list-item-middle {
+ border-radius: 10px;
+ }
+ }
+
+ &-select_multiple {
+ display: flex;
+ justify-content: space-between;
+
+ &-value {
+ color: #171a1d;
+ opacity: 0.85;
+ font-size: 14px;
+ }
+
+ &-m {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+ }
+
+ &-space {
+ width: 100%;
+ }
+
+ &-files {
+ background: #ffffff;
+ border-radius: 10px;
+ padding: 12px 16px 16px;
+
+ &-title {
+ font-size: 14px;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ margin-bottom: 12px;
+ }
+
+ &-col {
+ display: flex;
+ justify-content: space-between;
+ }
+ }
+
+ &-childView {
+ margin-bottom: 0px;
+ background: #fff;
+ padding: 10px 16px;
+
+ &-flex {
+ display: flex;
+ align-items: center;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-rightArrow {
+ margin-left: 5px;
+ font-size: 15px;
+ color: var(--common_level4_base_color, #ffffff);
+ }
+ }
+
+ &-headtTitle {
+ background: #fff;
+ padding: 12px 16px;
+
+ &-overflow {
+ overflow: scroll;
+ height: 300px;
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-border {
+ position: relative;
+ background-color: @common_bg_z1_color;
+
+ &::after {
+ content: '';
+ position: absolute;
+ height: 1px;
+ background-color: @common_line_light_color;
+ left: 0;
+ right: 0;
+ z-index: 99;
+ bottom: -12px;
+ }
+ }
+ }
+
+ &-checkbox {
+ margin: 12px 0;
+ & .dtm-list-thumb {
+ // margin: 0 !important;
+ }
+ & .dtm-list-item {
+ padding: 0;
+ }
+ & .dtm-list-line {
+ padding: 0;
+ }
+ }
+}
diff --git a/src/components/RenderFormView/index.jsx b/src/components/RenderFormView/index.jsx
new file mode 100644
index 0000000..73f4748
--- /dev/null
+++ b/src/components/RenderFormView/index.jsx
@@ -0,0 +1,2095 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-15 20:09:04
+ * @LastEditTime: 2024-12-02 16:27:30
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:表单组件
+ */
+import React, { useState, useRef, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Picker, List, Space, Form, DatePicker, InputItem, Select, Button, Toast, Checkbox, TextareaItem, Upload, Switch, Empty } from 'dingtalk-design-mobile';
+// import { Switch } from 'antd';
+import { confirmModal, dateFormat } from '../../utils/utility';
+import FileShow from '../../components/FileShow';
+import { roomForm } from '../../assets/img';
+import dd from 'gdt-jsapi';
+import IdcardOCR from '../../components/IdcardOCR';
+import MyModal from '../../components/MyModal';
+import { hkRegion, ax, catchApiError, checkTel, showToast, appUrl, setLocal, confirmThreeButtonModal, myTimeFormat, getLocal } from '../../utils/utility';
+import rule from '../../utils/rules';
+import { applyForForm_3, applyForForm_4, applyForForm_5, del, rail, add, mediateIdcard, mediateIdcard_1, mediatetel, mediatetel_1, } from '../../assets/cardImg';
+import { RightArrow2Outlined } from 'dd-icons';
+import ModalContent from '../ModalLContent';
+
+function deleteFile(submitData) {
+ return ax.request({ url: `sys/attachment/removeById`, type: 'get', service: 'ninex', data: submitData });
+}
+
+// form表单[]
+// formData表单value对象 {}
+// handleChange输入事件 fun
+// rightButtonOnClick 右侧点击按钮 fun
+// formstatus 表单登记状态是否显示 true flase
+// tabPage 页签
+// tabList 表单登记状态提示信息
+// 是否为新增表单
+const RenderFormView = ({ form, formData, handleChange, tabPage, tabList, rightButtonOnClick, formstatus, newAdd, metaAddrClick, OCRsuccessCallback }) => {
+ let token = global.postId || getLocal('postId');
+ const history = useHistory();
+ const [data, setData] = useState({ list: [], total: 0 });
+ const [visible, setVisible] = useState(false);
+ const [expiredDateVisible, setExpiredDateVisible] = useState(false);
+ const [expiredDateData, setExpiredDateData] = useState({ visible: false, visible1: false, });
+ // 选择小区异常情况
+ const [diySelectData, setDiySelectData] = useState(false);
+ const [modalImg, setModalImg] = useState({ visible: false, url: '' });
+
+ // 社保卡提示窗口 1。本人办理弹窗 2。他人代办弹窗
+ const [applyTip, setApplyTip] = useState({ visible: false, type: '1' });
+
+ // 删除文件
+ async function handleDeleteFiles(fileId, ownerType) {
+ global.setSpinning(true);
+ const res = await deleteFile({ id: fileId });
+ global.setSpinning(false);
+ if (res.type) {
+ showToast({ type: 'success', content: '删除成功' });
+ return true;
+ }
+ return false;
+ }
+
+ function render(item, i, listIndex, handleChange, rightButtonOnClick, form, formData, formstatus) {
+ const h = (items) => {
+ let { index, key, value } = items;
+ formData[key] = value;
+ handleChange(formData, key);
+ };
+
+ const fileH = (items, type) => {
+ if (type === 'add') {
+ formData.fileList = formData.fileList.concat(items)
+ } else {
+ formData.fileList = formData.fileList.filter(item => item.id !== items.id)
+ }
+ handleChange(formData, 'fileList');
+ }
+
+ const {
+ name,
+ rules,
+ tabs,
+ require,
+ value,
+ type,
+ showTitle,
+ label,
+ list = [],
+ code,
+ extra = null,
+ margin,
+ display,
+ disabled = false,
+ desc,
+ placeholder = null,
+ files,
+ url,
+ img,
+ rightButton,
+ rightArrow,
+ miniLabel,
+ parameter,
+ startTime,
+ endTime,
+ personType,
+ subtitle,
+ } = item;
+ switch (type) {
+ case 'text':
+ case 'password':
+ case 'phone':
+ case 'idcard':
+ case 'digit':
+ return (
+ <div style={subtitle && { backgroundColor: '#fff', height: '72px' }}>
+ <Form.Item
+ key={name}
+ rules={rules}
+ label={
+ <>
+ <div >
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ </>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ {name === 'idcard' && disabled === true ? (
+ <div
+ style={{ fontSize: '14px', lineHeight: '1.5', color: 'rgba(23, 26, 29, 0.24)' }}
+ onClick={(e) => {
+ Toast.info({
+ content: '不允许修改已登记居民的证件号，如填写错误，请迁出后重新添加',
+ });
+ }}
+ >
+ {formData[name] ? formData[name] : ''}
+ </div>
+ ) : (
+ <InputItem
+ className="render-form-view-input"
+ type={type}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ disabled={disabled}
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ )}
+ </Form.Item>
+ {subtitle && <div onClick={() => setApplyTip({ visible: true, type: '1' })} style={{ padding: '0 16px', color: '#007FFF', position: 'relative', top: '-8px', cursor: 'pointer' }}>{subtitle}</div>}
+ </div>
+ );
+ case 'number':
+ return (
+ <Form.Item
+ key={name}
+ name={name}
+ rules={rules}
+ label={
+ <>
+ <Space align="center">
+ {label}
+ </Space>
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ </>
+ }
+ className={`render-form-view-number ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <InputItem
+ className="render-form-view-input"
+ style={{ textAlign: 'right' }}
+ type='number'
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ disabled={disabled}
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ </Form.Item>
+ );
+ // 换行文本输入
+ case 'textBrief':
+ return (
+ <Form.Item
+ position="brief"
+ name={name}
+ key={name}
+ rules={rules}
+ // label={
+ // <Space align="center">
+ // {label}
+ // {require && <span className="public-tag4">必填</span>}
+ // </Space>
+ // }
+ disabled={disabled}
+ label={label}
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <InputItem
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+
+ className="render-form-view-input-brief"
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ </Form.Item>
+ );
+
+ // 换行文本输入（选择按钮选择人员）
+ case 'textBriefSelect':
+ return (
+ <Form.Item
+ position="brief"
+ name={name}
+ key={name}
+ rules={rules}
+ label={
+ <Space style={{ width: '100%' }} justify="between">
+ <Space align="center">
+ {label}
+ </Space>
+ <div onClick={() => rightButtonOnClick('selectPerson', url)} className='public-color'>选择</div>
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <InputItem
+ disabled={disabled}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ className="render-form-view-input-brief"
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ />
+ </Form.Item>
+ );
+ // 换行文本输入（选择负责区域及线路）
+ case 'textBriefSelect1':
+ return (
+ <Form.Item
+ position="brief"
+ name={name}
+ key={name}
+ rules={rules}
+ label={
+ <Space style={{ width: '100%' }} justify="between">
+ <Space align="center">
+ {label}
+ </Space>
+ <div onClick={() => rightButtonOnClick('selectPerson', url)} className='public-color'>选择</div>
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ fontSize: '17px', lineHeight: '25px' }} className="render-form-view-childView-flex">
+ {
+ formData[name] ? <div style={{ display: 'flex' }}>
+ <img style={{ width: '48px', height: '48px', padding: '0 12px 0 0' }} src={rail} alt="" srcset="" />
+ <div>
+ <div><span style={{ color: '#000000' }} className="searchPersonRoomSearch-card-title">{formData.protectRouteName || '-'}</span></div>
+ <div style={{ marginTop: '4px' }}><span className="searchPersonRoomSearch-card-main-flex">{formData.districtName || '-'}{formData.subdistrictName ? `/${formData.subdistrictName}` : ''}{formData.communityName ? `/${formData.communityName}` : ''}</span></div>
+
+ </div>
+ </div> :
+ <span className="select-color">请选择</span>
+ }
+ </div>
+ {/* <InputItem
+ disabled={disabled}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ className="render-form-view-input-brief"
+ placeholder={placeholder}
+ clear
+ maxLength={50}
+ /> */}
+ </Form.Item>
+ );
+
+
+
+ // 多行文本
+ case 'textarea':
+ return (
+ <Form.Item
+ position="brief"
+ name={name}
+ rules={rules}
+ key={name}
+ style={{ height: '22px' }}
+ label={label}
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <TextareaItem
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e.replace(/\s+/g, '') });
+ }}
+ className="render-form-view-input-briefOther"
+ placeholder={placeholder}
+ clear
+ rows={tabs || 5}
+ />
+ </Form.Item>
+ );
+ // 单选框
+ case 'select':
+ case 'idcardType':
+ return (
+ <Form.Item
+ name={name}
+ key={name}
+ rules={rules}
+ label={label}
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <Picker
+ data={[list]}
+ cols={1}
+ key={name}
+ disabled={disabled}
+ title={label}
+ okText="确定"
+ cascade={false}
+ value={formData[name] ? list.find((it) => it.value == formData[name]) ? [formData[name]] : '' : ''}
+ onChange={(e) => {
+ h({ key: name, value: e[0] });
+ h({
+ key: desc,
+ value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item className="institutions-add-form-picker-new" arrow> </List.Item>
+ </Picker>
+
+ </Form.Item>
+ );
+
+ case 'diySelect':
+ return (
+ <>
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ </div>
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => setDiySelectData(true)}>
+ {formData[name] !== '99' && (formData[desc] ? <div>{formData[desc]}</div> : <div className="select-color">{placeholder}</div>)}
+ {formData[name] === '99' && (formData.groupname ? <div>{formData.groupname}</div> : <div className="select-color">{placeholder}</div>)}
+ <RightArrow2Outlined className="render-form-view-childView-rightArrow" />
+ </div>
+ </div>
+ </div>
+ <Picker
+ data={[list]}
+ cols={1}
+ key={name}
+ visible={diySelectData}
+ disabled={disabled}
+ title={'选择' + label}
+ okText="确定"
+ cascade={false}
+ value={formData[name] ? list.find((it) => it.value == formData[name]) ? [formData[name]] : '' : ''}
+ onVisibleChange={(e) => { setDiySelectData(!diySelectData) }}
+ onChange={(e) => {
+ // 自行填写
+ if (e[0] === '99') {
+ h({ key: name, value: e[0] });
+ delete formData[desc]
+ // h({
+ // key: desc,
+ // value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ // });
+ rightButtonOnClick('自行填写')
+ } else {
+ h({ key: name, value: e[0] });
+ delete formData.groupname;
+ h({
+ key: desc,
+ value: list.find((it) => it.value == e[0]) ? list.find((it) => it.value == e[0]).label : '',
+ });
+ }
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ </Picker>
+ </>
+ );
+ // 多列单选框(区域，街道)
+ case 'selectCols':
+ return (
+ <Picker
+ key={name}
+ data={list}
+ cols={2}
+ title={label}
+ okText="确定"
+ cascade={true}
+ value={formData[name]}
+ onChange={(e, item) => {
+ h({ index: i, key: name, value: e });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </Picker>
+ );
+ // 多选框
+ case 'select_multiple':
+ return (
+ <div
+ key={name}
+ className={`${i == listIndex - 1 && 'render-form-view-multiple-bottom'} ${i == 0 && 'render-form-view-multiple-top'} ${listIndex - 1 == 0 && 'render-form-view-multiple-radius'
+ }`}
+ >
+ <Form.Item
+ label={
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className="render-form-view-switch"
+ >
+ <Select
+ mode="multiple"
+ value={formData[name]}
+ placeholder={
+ <div className="render-form-view-select_multiple">
+ <Space align="center">
+ <span style={{ color: '#171a1d' }}>{label}</span>
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div
+ className={
+ formData[name] == null || formData[name].length == 0
+ ? 'render-form-view-select_multiple-m'
+ : 'render-form-view-select_multiple-value'
+ }
+ >
+ {formData[desc] == null || formData[desc].length == 0 ? (
+ <span className="select-color">请选择</span>
+ ) : (
+ <span>{formData[desc].join(',').substr(0, 10) + '...'}</span>
+ )}
+ </div>
+ </div>
+ }
+ renderSelection={(vs) => {
+ return (
+ <div className="render-form-view-select_multiple">
+ <Space align="center">
+ <span style={{ color: '#171a1d' }}>{label}</span>
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div
+ className={
+ formData[name] == null || formData[name].length == 0
+ ? 'render-form-view-select_multiple-m'
+ : 'render-form-view-select_multiple-value'
+ }
+ >
+ {formData[name] == null || formData[desc].length == 0 ? '请选择' : formData[desc].join(',').substr(0, 10) + '...'}
+ </div>
+ </div>
+ );
+ }}
+ options={list}
+ title={label}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ h({ key: desc, value: e.map((it) => list.find((ite) => ite.value == it) ? list.find((ite) => ite.value == it).label : '') });
+ }}
+ />
+ </Form.Item>
+ </div>
+ );
+ // 三级联动选择地址
+ case 'district':
+ return (
+ <Form.Item
+ name={name}
+ key={name}
+ rules={rules}
+ label={label}
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <Picker
+ data={hkRegion || list}
+ cols={3}
+ title={label}
+ okText="确定"
+ cascade={true}
+ value={formData[name]}
+ onChange={(e) => {
+ h({ index: i, key: name, value: e });
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item className="institutions-add-form-picker-new" arrow> </List.Item>
+ </Picker>
+ </Form.Item>
+ );
+ // 开关
+ case 'switch':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <span className="render-form-view-switch-title">{list[formData[name]] || list[0]}</span>
+ <Switch
+ checked={formData[name] == '2' || formData[name] == null ? false : formData[name] == '1' ? true : ''}
+ onChange={(e) => {
+ h({ index: i, key: name, value: e ? '1' : '2' });
+ }}
+ />
+ </Form.Item>
+ );
+ // 选择开关
+ case 'switchSelect':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div className='switchSelect'>
+ {
+ list?.map(((i, idx) =>
+ <div onClick={() => h({ key: name, value: i.value })} key={`switchSelect${idx}`} className={formData[name] === i.value ? 'switchSelect-name switchSelect-active' : 'switchSelect-name'}>{i.label}</div>
+ ))
+ }
+ </div>
+ </div>
+ </div>
+ );
+ case 'checkbox':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <span className="render-form-view-switch-title">{list[formData[name]] || list[0]}</span>
+ <Checkbox.Group
+ // defaultValue={[1]}
+ // onChange={(values) => {
+ // }}
+ >
+ <Checkbox.Item value='1'>仅受理</Checkbox.Item>
+ </Checkbox.Group>
+ </Form.Item>
+ );
+ case 'checkboxDiy':
+ return (
+ <>
+ {list.map((item, idx) => (
+ <div key={`checkboxDiy${idx}`} onClick={() => h({ key: name, value: item.value })} className="infoView-card" style={{ padding: idx === 0 ? '12px 0 12px 16px' : '0 0 12px 16px' }}>
+ <div className={`people-visit-edit-select-title ${formData[name] === item.value && 'people-visit-edit-select-title-no'}`}><Checkbox checked={formData[name] === item.value ? true : false} className='people-visit-edit-select-checkbox'></Checkbox> {item.title}</div>
+ {
+ formData[name] === item.value && <div className='people-visit-edit-select-subtitle'>{item.subTitle}</div>
+ }
+ {
+ idx === list?.length - 1 ? null : <div style={{ height: '1px', backgroundColor: 'rgba(126,134,142,0.16)', marginTop: '8px' }}></div>
+ }
+ </div>
+ ))}
+ </>
+ );
+ // 开关
+ case 'personSwitch':
+ return (
+ <Form.Item
+ key={name}
+ label={
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ }
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <span className="render-form-view-switch-title">{list[formData[name]] || list[0]}</span>
+ <Switch
+ checked={formData[name] == '2' || formData[name] == null ? false : formData[name] == '1' ? true : ''}
+ disabled={disabled}
+ onChange={(e) => {
+ name === 'personType' && disabled === true ?
+ Toast.info({
+ content: '不允许修改已登记居民的证件号，如填写错误，请迁出后重新添加',
+ }) :
+ h({ index: i, key: name, value: e ? '1' : '2' });
+ }}
+ />
+ </Form.Item>
+ );
+ // 时间选择器
+ case 'time':
+ case 'date':
+ return (
+ <Form.Item
+ name={name}
+ key={name}
+ rules={rules}
+ label={label}
+ className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <DatePicker
+ mode="date"
+ minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ extra={<span className="select-color">请选择</span>}
+ value={formData[name] ? new Date(formData[name]) : ''}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ }}
+ >
+ <List.Item className="institutions-add-form-picker-new" arrow> </List.Item>
+ </DatePicker>
+ </Form.Item>
+ );
+
+ case 'expiredDate':
+ return (
+ <div onClick={() => {
+ if (!expiredDateData.visible && expiredDateData.visible1) {
+ setExpiredDateData({ ...expiredDateData, visible: false, visible1: false, startTime: startTime, endTime: endTime })
+ } else {
+ setExpiredDateData({ ...expiredDateData, visible: true, visible1: true, startTime: startTime, endTime: endTime })
+ }
+ }}>
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ <div className="render-form-view-childView-flex">
+ <div className="render-form-view-childView-flex">
+ {!formData[endTime] && placeholder && <div className="select-color">{placeholder}</div>}
+ {formData[endTime] && placeholder && <div>
+ {myTimeFormat(formData[endTime], 'YYYY-M-D') == '2099-1-1' ? `${myTimeFormat(formData[startTime], 'YYYY-M-D')}~长期` : `${myTimeFormat(formData[startTime], 'YYYY-M-D')}~${myTimeFormat(formData[endTime], 'YYYY-M-D')}`}
+ </div>}
+ {<RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'timeYear':
+ return (
+ <DatePicker
+ key={name}
+ title={label}
+ mode="year"
+ format={(val) => `${new Date(val).getFullYear()}年`}
+ extra={<span className="select-color">请选择</span>}
+ value={formData[name] ? formData[name] : ''}
+ onChange={(e) => {
+ h({ key: name, value: e });
+ }}
+ >
+ <List.Item
+ className={`render-form-view-title ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ arrow="horizontal"
+ >
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </List.Item>
+ </DatePicker>
+ );
+ // 拍照证件回填
+ case 'idcardOCR':
+ return (
+ <div key={name} style={{ display: `${display ? display : 'flex'}` }}>
+ {list.map((x, t) => (
+ <IdcardOCR key={t} data={x} OCRsuccessCallback={OCRsuccessCallback} />
+ ))}
+ </div>
+ );
+ case 'files':
+ return (
+ <div key={type} className="render-form-view-files">
+ <Space align="center" className="render-form-view-space" style={{ marginBottom: '12px' }}>
+ {label}
+ {miniLabel && <span className="mini-divider-title">{miniLabel}</span>}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ <div style={{ display: 'flex', flexFlow: 'row wrap', rowGap: '8px', justifyContent: 'space-between' }}>
+ {list.map((x, t) => (
+ <FileShow
+ formData={formData}
+ fileList={formData[name]}
+ callback={(item, type) => { fileH(item, type) }}
+ key={t}
+ data={x}
+ ownerType={x.ownerType}
+ ownerId={x.ownerId ? formData[x.ownerId] : ''}
+ />
+ ))}
+ </div>
+ </div>
+ );
+
+ case 'files1':
+ return (
+ <div key={type} className="render-form-view-files">
+ <Space align="center" className="render-form-view-space" style={{ marginBottom: '8px' }}>
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ {
+ showTitle &&
+ <div style={{ backgroundColor: 'rgba(0,127,255,0.12)', fontSize: '12px', color: '#007fff', border: '1px solid #007fff', padding: '4px 8px', margin: '0 0 12px' }}>该申领人已有公安照片，如本次不上传新的制卡照片，将以公安照片作为制卡照片</div>
+ }
+ <div style={{ display: 'flex', flexFlow: 'row wrap', rowGap: '8px', justifyContent: 'space-between' }}>
+ {list.map((x, t) => (
+ <FileShow
+ formData={formData}
+ fileList={formData[name]}
+ callback={(item, type) => { fileH(item, type) }}
+ key={t}
+ data={x}
+ ownerType={x.ownerType}
+ ownerId={x.ownerId ? formData[x.ownerId] : ''}
+ />
+ ))}
+ </div>
+ <div style={{ display: 'flex', width: '148px', justifyContent: 'space-between', paddingTop: '12px' }}>
+ <div onClick={() => rightButtonOnClick('', '制卡照片要求')} className='public-color'>制卡照片要求</div>
+ <div onClick={() => rightButtonOnClick('', '拍照工具')} className='public-color'>拍照工具</div></div>
+ </div>
+ );
+ case 'childView':
+ // 标准地址选择
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ {formData[name] && <div>{formData[name]}</div>}
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => history.push(url)}>
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ case 'childView2':
+ // 跳转页面后回显
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ if (parameter === 'buildingSelect' && formData[desc]?.length) {
+ confirmThreeButtonModal({
+ title: '操作提示',
+ subtitle: '请选择您的操作类型',
+ actions: [
+ {
+ text: '继续选择',
+ onClick: () => {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`${url}?id=${formData.id}`);
+ },
+ },
+ {
+ text: '查看已选择',
+ onClick: () => {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`/hztGrid/village/buildingSelectDetail?type=edit`);
+ },
+ },
+ { text: '取消操作' },
+ ],
+ });
+ } else {
+ setLocal(parameter, formData[desc] ? formData[desc] : []);
+ history.push(`${url}?id=${formData.id}`);
+ }
+ }}
+ >
+ {formData[name] && <div>{formData[name]}</div>}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ // 社保卡领卡网点
+ case 'childView3':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ rightButtonOnClick(name, label)
+ }}
+ >
+ {formData[name] && <div>{formData[name]}</div>}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+
+ // 单项选择字典值组件
+ case 'childView4':
+ return (
+ <div
+ className={`render-form-view-childView render-form-childView4-relative ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" style={{ '--gap': '0px' }} className="render-form-view-space">
+ {require && <span className="render-form-childView4-absolute"></span>}
+ {label}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ rightButtonOnClick(name, label)
+ }}
+ >
+ {formData[name] && <div>{formData[desc]}</div>}
+ {!formData[name] && <div style={{ fontSize: '16px' }} className="select-color">{placeholder}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ );
+
+ case 'imgView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {img && <img src={img} alt="" />}
+ </div>
+ </div>
+ <div
+ className="render-form-view-childView-flex"
+ onClick={() => {
+ setLocal('dutyGridCodeEditFiles', {
+ files: formData[files],
+ });
+ history.push(`${url}?id=${formData[item.id]}&ownerType=${item.ownerType}`);
+ }}
+ >
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {formData[name] && <div>{formData[name]}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+ case 'buildView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ <div style={{ display: 'flex' }}>
+ {img && <img style={{ padding: '4px' }} src={img} alt="" />}
+ {formData[name] && (
+ <div className={`${formData[name] === '地名地址不符合规则，请检查后重新输入' && 'form-font-color-red'}`}>
+ {formData[name]}
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ <div className="render-form-view-childView-flex" onClick={() => rightButtonOnClick(label)}>
+ {!formData[name] && placeholder && <div className="select-color">{placeholder[0]}</div>}
+ {formData[name] && placeholder && <div>{placeholder[1]}</div>}
+ {rightArrow && <RightArrow2Outlined className="render-form-view-childView-rightArrow" />}
+ </div>
+ </div>
+ </div>
+ );
+ // 地名地址
+ case 'addressView':
+ return (
+ <div
+ className={`render-form-view-childView ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}
+ >
+ <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+ <div>
+ <div className="render-form-view-childView-flex">
+ <div>
+ <Space align="center" className="render-form-view-space">
+ {label}
+ </Space>
+ </div>
+ <div style={{ display: 'flex' }}>
+ {img && <img style={{ padding: '4px 4px 4px 0' }} src={img} alt="" />}
+ {!formData[name] && <div className="select-color">{placeholder}</div>}
+ {formData[name] && (
+ <div
+ className={`${(formData[name] === '地名地址不符合规则，请检查后重新输入' || formData[name] === '街巷路名和村名只能填写其中一项') &&
+ 'form-font-color-red'
+ }`}
+ >
+ {formData[name]}
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ // 楼栋表单标题
+ case 'title':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ {img && (
+ <img
+ onClick={() => {
+ setVisible(true);
+ }}
+ src={img}
+ alt=""
+ />
+ )}
+ {require && <span className="public-tag4">必填</span>}
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+
+ // 表单分段标题无背景色
+ case 'headerTitle':
+ return (
+ <div style={{ padding: '0 12px 6px' }} className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '400', fontSize: '16px', color: 'rgba(23,26,29,0.60)' }}>{label}</span>
+ </div>
+ );
+
+ // 添加人员并可以删除
+ case 'headerTitleAdd':
+ return (
+ <div>
+ <div style={{ padding: '0 12px 6px' }} className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '400', fontSize: '16px', color: 'rgba(23,26,29,0.60)' }}>{label}</span>
+ {/* {require && <span className="public-tag4">必填</span>} */}
+ <div onClick={() => rightButtonOnClick(label, name)} className='public-color' style={{ fontWeight: '400', display: 'flex', alignItems: 'center', height: '24px' }}>
+ <img style={{ width: '16px', height: '16px', padding: '4px' }} src={add} alt="" srcset="" />
+ <div style={{ fontSize: '16px' }}>添加</div>
+ </div>
+ </div>
+ {
+ formData[name]?.length ?
+ <div>
+ {
+ formData[name]?.map(((item, index) => (
+ <div className="renderFormView-card" key={`${name}${index}`} style={index === 0 ? { marginTop: 0 } : null}>
+ <div className="renderFormView-card-header">
+ {
+ name === 'railwaySecuritys' &&
+ <div className="renderFormView-card-title">{item.caseName || '-'}</div>
+ }
+ {
+ name === 'schoolSecurityList' &&
+ <div className="renderFormView-card-title">{item.caseName || '-'}</div>
+ }
+ {
+ name === 'schoolKeyPeopleList' &&
+ <div className="renderFormView-card-title">{item.personName || '-'}</div>
+ }
+ {
+ name === 'workList' &&
+ <>
+ <div className="renderFormView-card-title">工作汇报</div>
+ </>
+ }
+ {
+ name === 'schoolDefendList' &&
+ <>
+ <div className="renderFormView-card-title">聘任学校</div>
+ </>
+ }
+ {
+ name === 'schoolRenovateList' &&
+ <div className="renderFormView-card-title">{formData.renovateActivity ? [
+ { value: 10, label: '校园内部安全隐患排查整治' },
+ { value: 11, label: '校园周边治安隐患排查整治' },
+ { value: 12, label: '校园周边交通安全隐患排查整治' },
+ { value: 13, label: '食品安全隐患排查整治' },
+ { value: 14, label: '消防安全隐患排查整治' },
+ ].find(i => i.value === formData.renovateActivity)?.value : '-'}</div>
+ }
+ {
+ name === 'schoolBoardList' &&
+ <div className="renderFormView-card-title">{item.boardName || '-'}</div>
+ }
+ {
+ ['fullPersonList', 'partPersonList', 'railwayTeamList'].includes(name) &&
+ <div className="renderFormView-card-title">{item.name || '-'}</div>
+ }
+ {
+ ['railwayStationList1', 'railwayStationList2', 'railwayStationList3', 'railwayStationList4', 'railwayStationList5'].includes(name) &&
+ <div className="renderFormView-card-title">{item.stationName || '-'}</div>
+ }
+ </div>
+ <div className="renderFormView-card-body">
+ {
+ name === 'fullPersonList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">职务：{item.postName || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">责任区段：{item.dutySection || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">联系电话：{item.tel || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'partPersonList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">职务：{item.postName || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">责任区段：{item.dutySection || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">联系电话：{item.tel || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'railwayTeamList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">巡护区域：{item.dutySection || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">联系电话：{item.tel || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'railwaySecuritys' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">发生日期：{dateFormat(item.caseTime)}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">发生地点：{item.occurAddress || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">案件性质：{item.caseTypeDesc || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">是否破案：{String(item.whetherSolveCase) === '1' ? '是' : String(item.whetherSolveCase) === '2' ? '否' : '-'}</div>
+ </div>
+ </>
+ }
+ {
+ ['railwayStationList1', 'railwayStationList4'].includes(name) &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">区间：{item.stationSection || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ ['railwayStationList2', 'railwayStationList3'].includes(name) &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">长度（米）：{item.stationLength || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">区间：{item.stationSection || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'railwayStationList5' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">区间：{item.stationSection || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">存在何种隐患：{item.risk || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'workList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">汇报时间：{item.reportTime || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">季度工作报告(提示：区、镇、街综治办报告)：<br />{item.report || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'schoolDefendList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">学校名称：{item.schoolName || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">聘任限期：{myTimeFormat(item.employStart, 'YYYY.M.D') || '-'}至{myTimeFormat(item.employEnd, 'YYYY.M.D') || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'schoolSecurityList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">发生日期：{item.caseTime || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">发生地点：{item.occurAddress || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">案件性质：{item.caseTypeDesc || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">是否破案：{String(item.whetherSolveCase) === '1' ? '是' : String(item.whetherSolveCase) === '2' ? '否' : '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'schoolKeyPeopleList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">籍贯：{item.birthPlaceDesc || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">户籍门(楼)详址：{item.censusAddress || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">公民身份证号码：{item.idcard || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">危害程度：{item.hurtDegreeCode ? item.hurtDegreeCode === '01' ? '高' : item.hurtDegreeCode === '02' ? '中' : item.hurtDegreeCode === '03' ? '低' : '' : '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'schoolRenovateList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">活动开展日期：{item.activityTime || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">活动开展单位：{item.activityUnit || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">活动主要内容：{item.content || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">取得的主要成效：{item.mainEffect || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'schoolBoardList' &&
+ <>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">寄宿站（点）地址：{item.boardAddress || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">寄宿站（点）法人代表姓名：{item.legalPerson || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">寄宿站（点）法人代表电话：{item.legalTel || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">寄宿学生人数：{item.studentNumber || '-'}</div>
+ </div>
+ </>
+ }
+ {
+ name === 'personList' &&
+ <>
+ {
+ String(item.personFlag) === '1' &&
+ <Space style={{ width: '100%' }}>
+ <div className="background-purple">
+ <span className="background-purple-size">{item.personName?.charAt(0)}</span>
+ </div>
+ <>
+ <div className='color-purple color-purple-title'>
+ <div className="color-purple-flex-margin">{item.personName}（申请人）</div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediateIdcard} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">{item.permitTypeDesc} | {item.idcard}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediatetel} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">联系方式：{item.contact}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div style={{ fontSize: '14px', lineHeight: '22px', padding: '4px 12px' }} className="color-purple-borderRadius building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color color-purple ">查看</div>
+ <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color color-purple">修改</div>
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: formData[name]?.filter((i, idx) => idx !== index) })} className="public-color color-purple">删除</div>
+ </div>
+ </div>
+ </div>
+ </>
+ </Space>
+ }
+ {
+ String(item.personFlag) === '2' &&
+ <Space style={{ width: '100%' }}>
+ <div className="background-orange">
+ <span className="background-orange-size">{item.personName?.charAt(0)}</span>
+ </div>
+ <>
+ <div className='color-orange color-orange-title'>
+ <div className="color-orange-flex-margin">{item.personName}（被申请人）</div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediateIdcard_1} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">{item.permitTypeDesc} | {item.idcard}</div>
+ </div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediatetel_1} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">联系方式：{item.contact}</div>
+ </div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div style={{ fontSize: '14px', lineHeight: '22px', padding: '4px 12px' }} className="color-orange-borderRadius building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color color-orange ">查看</div>
+ <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color color-orange">修改</div>
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: formData[name]?.filter((i, idx) => idx !== index) })} className="public-color color-orange">删除</div>
+ </div>
+ </div>
+ </div>
+ </>
+ </Space>
+ }
+ </>
+ }
+ {
+ name !== 'personList' &&
+ <div style={{ marginTop: '4px', fontSize: '14px', lineHeight: '22px' }} className="building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color">查看</div>
+ <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color">修改</div>
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: formData[name]?.filter((i, idx) => idx !== index) })} className="public-color">删除</div>
+ </div>
+ }
+
+
+
+ </div>
+ </div>
+ )))
+ }
+ </div> :
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex" style={{ height: '142px' }}>
+ <Empty direction={'row'} type='noContent' title={placeholder} desc={'点击右上方添加按钮添加'} inline />
+ </div>
+ </div>
+ }
+ </div >
+ );
+ // 添加铁路路线基本情况
+ case 'headerTitleAdd1':
+ return (
+ <div>
+ <div style={{ padding: '0 12px 6px' }} className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '400', fontSize: '16px', color: 'rgba(23,26,29,0.60)' }}>{label}</span>
+ <div onClick={() => formData[name]?.name ? showToast({ content: '该项只能添加一个' }) : rightButtonOnClick(label, name)} className='public-color' style={{ fontWeight: '400', display: 'flex', alignItems: 'center', height: '24px' }}>
+ <img style={{ width: '16px', height: '16px', padding: '4px' }} src={add} alt="" srcset="" />
+ <div style={{ fontSize: '16px' }}>添加</div>
+ </div>
+ </div>
+ {
+ formData[name]?.name ?
+ <div className="renderFormView-card" style={{ marginTop: 0 }}>
+ <div className="renderFormView-card-header">
+ <div className="renderFormView-card-title">{formData[name]?.name || '-'}</div>
+ </div>
+ <div className="renderFormView-card-body">
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">铁路线路区间：{formData[name]?.lineSection || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="renderFormView-card-main-flex">铁路线路里程（米）：{formData[name]?.mileage || '-'}</div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="building-subtitle renderFormView-card-main-flex">
+ <div>火车站：{formData[name]?.railwayStationList?.filter(i => i.type === '1')?.length}</div>
+ <div className="public-split" />
+ <div>铁路桥：{formData[name]?.railwayStationList?.filter(i => i.type === '2')?.length}</div>
+ <div className="public-split" />
+ <div>隧道：{formData[name]?.railwayStationList?.filter(i => i.type === '3')?.length}</div>
+ </div>
+ </div>
+ <div className="renderFormView-card-main">
+ <div className="building-subtitle renderFormView-card-main-flex">
+ <div>涵洞：{formData[name]?.railwayStationList?.filter(i => i.type === '4')?.length}</div>
+ <div className="public-split" />
+ <div >平交道口：{formData[name]?.railwayStationList?.filter(i => i.type === '5')?.length}</div>
+ </div>
+ </div>
+ <div style={{ marginTop: '4px', fontSize: '14px', lineHeight: '22px' }} className="building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, formData[name], 'detail')} className="public-color">查看</div>
+ <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, formData[name], 'edit')} className="public-color">修改</div>
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: {} })} className="public-color">删除</div>
+ </div>
+ </div>
+ </div> :
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex" style={{ height: '142px' }}>
+ <Empty direction={'row'} type='noContent' title={placeholder} desc={'点击右上方添加按钮添加'} inline />
+ </div>
+ </div>
+ }
+ </div >
+ );
+
+ // 添加人员并可以删除
+ case 'headerTitleAdd2':
+ return (
+ <div>
+ <div style={{ padding: '0 12px 6px' }} className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '400', fontSize: '16px', color: 'rgba(23,26,29,0.60)' }}>{label}</span>
+ <div onClick={() => rightButtonOnClick(label, name)} className='public-color' style={{ fontWeight: '400', display: 'flex', alignItems: 'center', height: '24px' }}>
+ <img style={{ width: '16px', height: '16px', padding: '4px' }} src={add} alt="" srcset="" />
+ <div style={{ fontSize: '16px' }}>添加</div>
+ </div>
+ </div>
+ {
+ formData[name]?.length ?
+ <div>
+ {
+ formData[name]?.map(((item, index) => (
+ <div className="renderFormView-card" key={`${name}${index}`} style={index === 0 ? { marginTop: 0 } : null}>
+ <div className="renderFormView-card-body">
+ <>
+ {
+ String(item.isSuspect) === '1' &&
+ <Space style={{ width: '100%' }}>
+ <div className="background-purple">
+ <span className="background-purple-size">{item.personName?.charAt(0)}</span>
+ </div>
+ <>
+ <div className='color-purple color-purple-title'>
+ <div className="color-purple-flex-margin">{item.personName}</div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediateIdcard} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">居民身份证 | {item.idcard}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediatetel} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">联系方式：{item.contact || '-'}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div style={{ fontSize: '14px', lineHeight: '22px', padding: '4px 12px' }} className="color-purple-borderRadius building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color color-purple ">查看</div>
+ {/* <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color color-purple">修改</div> */}
+ <div className="public-split" />
+ {/* personType */}
+ <div onClick={() => h({ key: name, value: formData[name]?.filter(item => item.isSuspect === personType)?.filter((i, idx) => idx !== index) })} className="public-color color-purple">删除</div>
+ </div>
+ </div>
+ </div>
+ </>
+ </Space>
+ }
+ {
+ String(item.isSuspect) === '0' &&
+ <Space style={{ width: '100%' }}>
+ <div className="background-orange">
+ <span className="background-orange-size">{item.personName?.charAt(0)}</span>
+ </div>
+ <>
+ <div className='color-orange color-orange-title'>
+ <div className="color-orange-flex-margin">{item.personName}</div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediateIdcard_1} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">居民身份证 | {item.idcard}</div>
+ </div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediatetel_1} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">联系方式：{item.contact || '-'}</div>
+ </div>
+ <div className="color-orange-flex color-orange-flex-margin">
+ <div style={{ fontSize: '14px', lineHeight: '22px', padding: '4px 12px' }} className="color-orange-borderRadius building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color color-orange ">查看</div>
+ {/* <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color color-orange">修改</div> */}
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: formData[name]?.filter((i, idx) => idx !== index) })} className="public-color color-orange">删除</div>
+ </div>
+ </div>
+ </div>
+ </>
+ </Space>
+ }
+ </>
+
+ </div>
+ </div>
+ )))
+ }
+ </div> :
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex" style={{ height: '142px' }}>
+ <Empty direction={'row'} type='noContent' title={placeholder} desc={'点击右上方添加按钮添加'} inline />
+ </div>
+ </div>
+ }
+ </div >
+ );
+
+ // 添加人员并可以删除
+ case 'headerTitleAdd3':
+ return (
+ <div>
+ <div style={{ padding: '0 12px 6px' }} className="render-form-view-headtTitle-flex">
+
+ <span style={{ fontWeight: '400', fontSize: '16px', color: 'rgba(23,26,29,0.60)' }}>{require && <span className="require-red">* </span>}{label}</span>
+ <div onClick={() => rightButtonOnClick(label, name)} className='public-color' style={{ fontWeight: '400', display: 'flex', alignItems: 'flex-end', height: '24px' }}>
+ <img style={{ width: '16px', height: '16px', padding: '4px' }} src={add} alt="" srcset="" />
+ <div style={{ fontSize: '16px' }}>添加</div>
+ </div>
+ </div>
+ {
+ formData[name]?.length ?
+ <div>
+ {
+ formData[name]?.map(((item, index) => (
+ <div className="renderFormView-card" key={`${name}${index}`} style={index === 0 ? { marginTop: 0 } : null}>
+ <div className="renderFormView-card-body">
+ <Space style={{ width: '100%' }}>
+ <div className="background-purple">
+ <span className="background-purple-size">{item.name?.charAt(0)}</span>
+ </div>
+ <div className='color-purple color-purple-title'>
+ <div className="color-purple-flex-margin">{item.name}</div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediateIdcard} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">证件号码 {item.idcard}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={mediatetel} alt="" />
+ </div>
+ <div className="renderFormView-card-main-flex">户籍地：{item.householdAddress}</div>
+ </div>
+ <div className="color-purple-flex color-purple-flex-margin">
+ <div style={{ fontSize: '14px', lineHeight: '22px', padding: '4px 12px' }} className="color-purple-borderRadius building-subtitle">
+ <div onClick={() => rightButtonOnClick(label, name, item, 'detail')} className="public-color color-purple ">查看</div>
+ <div className="public-split" />
+ <div onClick={() => rightButtonOnClick(label, name, item, 'edit', index)} className="public-color color-purple">修改</div>
+ <div className="public-split" />
+ <div onClick={() => h({ key: name, value: formData[name]?.filter((i, idx) => idx !== index) })} className="public-color color-purple">删除</div>
+ </div>
+ </div>
+ </div>
+ </Space>
+ </div>
+ </div>
+ )))
+ }
+ </div> :
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex" style={{ height: '142px' }}>
+ <Empty direction={'row'} type='noContent' title={placeholder} desc={'点击右上方添加按钮添加'} inline />
+ </div>
+ </div>
+ }
+ </div >
+ );
+ case 'subTitle':
+ return (
+ <div className="render-form-view-headtTitle">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span >{label}</span>
+ {img && (
+ <img
+ onClick={() => {
+ setVisible(true);
+ }}
+ src={img}
+ alt=""
+ />
+ )}
+ {require && <span className="public-tag4">必填</span>}
+ </div>
+ {
+ formData[name] ?
+ <div className="render-form-view-childView-flex" onClick={() => rightButtonOnClick(rightButton, label)}>
+ <div>已签名</div>
+ <RightArrow2Outlined className="render-form-view-childView-rightArrow" />
+ </div> :
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton, label)}>
+ {rightButton}
+ </span>
+ </div>
+ }
+ </div>
+ </div>
+ );
+
+ // 地名地址头部
+ case 'addressTitle':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ <div style={{ display: 'flex', alignItems: 'center' }} onClick={() => {
+ setVisible(true);
+ }}>
+ <img
+ src={img}
+ alt=""
+ />
+ <span style={{ fontSize: '12px', color: '#007FFF' }}>查看规则</span>
+ </div>
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+
+ // 标签带按钮的
+ case 'selectTitle':
+ return (
+ <div className="render-form-view-headtTitle render-form-view-col-top">
+ <div className="render-form-view-headtTitle-flex render-form-view-headtTitle-border ">
+ <div className="render-form-view-headtTitle-flex">
+ <span style={{ fontWeight: '700' }}>{label}</span>
+ </div>
+ {rightButton && (
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(rightButton)}>
+ <img
+ style={{ width: '12px', paddingLeft: '0' }}
+ src={img}
+ alt=""
+ /> {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ </div>
+ );
+
+ case 'selectPerson':
+ return (
+ <div className="render-form-view-headtTitle">
+ <div>
+ <div className="render-form-view-headtTitle-flex">
+ <div className="render-form-view-headtTitle-flex">
+ <Space align="center" className="render-form-view-space">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>
+ {rightButton && (
+ <div>
+ <span style={{ border: 'none' }} className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick(label, name)}>
+ {rightButton}
+ </span>
+ </div>
+ )}
+ </div>
+ <div style={{ paddingTop: '4px', paddingLeft: '0' }} className='people-visit-edit-select-subtitle'>{item.subTitle}</div>
+
+ {/* {
+ label === '处理人' &&
+ <Space wrap={true} direction={'vertical'}>
+ {formData[name]?.map((item, idx) => (
+ <div className='render-form-view-headtTitle-select' style={{ justifyContent: 'space-between' }} key={`selectPerson${idx}`}>
+ <div className='render-form-view-headtTitle-select-person'>{item.objectName}</div><img src={del} />
+ </div>
+ ))}
+ </Space>
+ }
+ {
+ label === '处理部门' &&
+ <Space wrap={true}>
+ {formData[name]?.map((item, idx) => (
+ <div className='render-form-view-headtTitle-select' key={`selectPerson${idx}`}>
+ <div className='render-form-view-headtTitle-select-person'>{item.objectName}</div><img src={del} />
+ </div>
+ ))}
+ </Space>
+ } */}
+ {
+ formData[name]?.length > 0 &&
+ <Space style={{ paddingTop: '8px' }} wrap={true}>
+ {formData[name]?.map((item, idx) => (
+ <div className='render-form-view-headtTitle-select' onClick={() => {
+ h({ key: name, value: formData[name].filter(i => i.objectId !== item.objectId) })
+ }} key={`selectPerson${idx}`}>
+ <div className='render-form-view-headtTitle-select-person'>{item.objectName}</div><img src={del} />
+ </div>
+ ))}
+ </Space>
+ }
+ </div>
+ </div>
+ );
+
+ case 'dingUpload':
+ return (
+ <Form.Item key={name} className={`render-form-view-switch ${i == listIndex - 1 && 'render-form-view-col-bottom'} ${i == 0 && 'render-form-view-col-top'} ${listIndex - 1 == 0 && 'render-form-view-col-radius'
+ }`}>
+ <Upload
+ label={<div>
+ <Space align="center">
+ {label}
+ {require && <span className="public-tag4">必填</span>}
+ </Space>
+ </div>}
+ onPreview={async (res) => {
+ let src = ''
+ if (!res.response) {
+ src = `${appUrl.baseUrl}${appUrl.ninex}${res?.showUrl}`
+ } else {
+ src = `${appUrl.baseUrl}${appUrl.ninex}${res.response?.data?.showUrl}`
+ }
+ setModalImg({ visible: true, url: src })
+ }}
+ fileList={formData[item.fileList]}
+ type="form-upload"
+ accept="*"
+ previewContent="预览"
+ action={`${appUrl.baseUrl}${appUrl.ninex}/dingTalk/api/sys/attachment/uploadFile?ownerId=${formData[item.ownerId]}&ownerType=${item.ownerType}`}
+ headers={{ Authorization: token }}
+ onChange={res => {
+ if (res?.file?.status === 'error') {
+ return catchApiError({ content: "抱歉! 网络错误" });
+ }
+ h({ key: item.fileList, value: res.fileList });
+ }}
+ onRemove={(file) => {
+ handleDeleteFiles(file.id ? file.id : formData[item.ownerId])
+ h({ key: item.fileList, value: formData[item.fileList].filter((x, t) => x.id !== file.id) });
+ }}
+ uploadLabel="支持扩展名：.rar .zip .doc .docx .pdf .jpg，30M以内"
+ uploadBtnLabel="上传文件"
+ />
+ </Form.Item>
+ )
+ default:
+ return null;
+ }
+ }
+
+ // 登记状态判断
+ function newTest(tabPage, tabList) {
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'red') {
+ return (
+ <div className="divider-Tabtitle-tabs-red">
+ <span></span>
+ {'异常登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'green') {
+ return (
+ <div className="divider-Tabtitle-tabs-green">
+ <span></span>
+ {'已登记'}
+ </div>
+ );
+ }
+ if (tabList.find((item, x) => x === tabPage - 1).type === 'normal') {
+ return (
+ <div className="divider-Tabtitle-tabs">
+ <span></span>
+ {'未登记'}
+ </div>
+ );
+ }
+ }
+
+ return (
+ <div className="render-form-view-main">
+ {form.map((items, i) => {
+ return (
+ <div key={i}>
+ {items.titleTab && (
+ <div className="divider-Tabtitle">
+ <div>{items.titleTab}</div>
+ {formstatus && newTest(tabPage, tabList)}
+ </div>
+ )}
+ {
+ items.selectTitle &&
+ <div className="divider-title" style={{ marginBottom: '0px' }}>
+ <div>{items.selectTitle}</div>
+ <div>
+ <span className="public-tag5 public-tag5-blue" onClick={() => rightButtonOnClick({}, items.selectTitle)}>
+ <img
+ style={{ width: '12px', paddingLeft: '0' }}
+ src={applyForForm_3}
+ alt=""
+ /> 选择
+ </span>
+ </div>
+ </div>
+ }
+ {(items.title !== 'ocr') && (
+ <div className={items.title ? 'divider-title' : (items.list.length > 0 ? 'divider-title-new' : 'divider-title-new111')}>
+ {items.title}
+ {items.title === '公安标准地址关联' && formData.metaAddr && (
+ <div onClick={() => metaAddrClick()} style={{ display: 'flex', alignItems: 'center' }} className="divider-Tabtitle-tabs-red">
+ <img style={{ width: '14px', height: '14px', marginRight: '4px' }} src={roomForm} alt="" />
+ {'取消关联'}
+ </div>
+ )}
+ </div>
+ )}
+ <div className="render-form-view-col">
+ {items.list.map((item, index) => {
+ return <div key={item.name + index}>{render(item, index, items.list.length, handleChange, rightButtonOnClick, form, formData)}</div>;
+ })}
+ </div>
+ </div>
+ );
+ })}
+ {/* 地名地址说明 */}
+ <MyModal visible={visible} center title="地名地址规范说明" onClose={() => setVisible(false)}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <div className="from-long-main-body-in">
+ <p>{`地名是人们对具有特定方位、地域范围的地理实体赋予的专有名称。`}</p>
+ <p>{`地址是有地名的详细表述，包括国家、省份、城市或乡村、街道、门牌号码、屋邨、大厦等建筑物名称，或者再加楼层数目、房间编号等。`}</p>
+ <p>{`<行政区划名><街巷路名|村名>[门牌号][小区名][标志物名][单元名][楼栋名（号）]。其中<>表示必填项，|表示或者，[]表示可选项。地名地址描述组合规则共有五大类十小类`}</p>
+ <div className="form-font-weight">{`A.<行政区划名><街巷路名><门牌号>[小区名][楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`1.行政区划名+街巷路名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸五西路30号 `}</div>
+ <div>{`2.行政区划名+街巷路名+门牌号+小区名+楼栋名（号）+商铺号 `}</div>
+ <div className="form-font-color-blue">{`示例：美兰区和平大道61号都市海岸8栋海景阁铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`B.<行政区划名><街巷路名><小区名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`3.行政区划名+街巷路名+小区名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍`}</div>
+ <div>{`4.行政区划名+街巷路名+小区名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海府路海南热带农作物局宿舍1栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`C.<行政区划名><街巷路名><门牌号><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`5.行政区划名+街巷路名+门牌号+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海甸二西路2号金源大厦`}</div>
+ <div>{`6.行政区划名+街巷路名+门牌号+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区人民大道58号海南大学海甸校区学生宿舍11栋铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`D.<行政区划名><街巷路名><标志物名>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`7.行政区划名+街巷路名+标志物名`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校`}</div>
+ <div>{`8.行政区划名+街巷路名+标志物名+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区海涛大道琼台师范高等专科学校美术楼铺面1`}</div>
+ <br />
+ <div className="form-font-weight">{`E.<行政区划名><村名><门牌号>[楼栋名][附属物/特殊类][铺面名称]`}</div>
+ <div>{`9.行政区划名+村名+门牌号`}</div>
+ <div className="form-font-color-blue">{`示例：美兰区拦海中村165号`}</div>
+ <div>{`10.行政区划名+村名+门牌号+楼栋名（号）+商铺号`}</div>
+ <div className="form-font-color-blue">{`示例：琼山区高登里二横97号1栋铺面1`}</div>
+ </div>
+ </div>
+ <div>
+ <div style={{ height: '1px', width: '100%', margin: '8px 0', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <Button
+ onClick={() => {
+ setVisible(false);
+ }}
+ style={{ width: '100%' }}
+ type="primary"
+ >
+ 我知道了
+ </Button>
+ </div>
+ </MyModal>
+
+ <MyModal visible={modalImg.visible} center title="查看图片" onClose={() => setModalImg({ visible: false, url: '' })}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <img src={modalImg.url} alt="" style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
+ </div>
+ </MyModal>
+ <ModalContent
+ headStyle={{ textAlign: 'center' }}
+ title={applyTip.type === '1' ? '如何查看身份证签发机关' : '如何查看身份证签发机关/户口簿登记机关'}
+ buttonTitle='我知道了'
+ visible={applyTip.visible}
+ visibleOnClick={(item) => {
+ setApplyTip({ ...applyTip, visible: false })
+ }}
+ content={
+ <div style={{ padding: '12px' }}>
+ {
+ applyTip.type === '1' ?
+ <div>根据省社保平台工作要求，社保卡申领<span className='public-color'>本人办理</span>时，需补充填写身份证签发机关，可查阅身份证国徽面获取相关信息（参考下图）</div> :
+ <div>根据省社保平台工作要求，社保卡申领<span className='public-color'>他人代办</span>时，当<span className='public-color'>选择上传身份证申领社保卡</span>，需补充填写身份证签发机关，可查阅身份证国徽面获取相关信息(参考下图)</div>
+
+ }
+ <img src={applyForForm_4} alt="" srcset="" />
+ {
+ applyTip.type === '2' &&
+ <>
+ <div>当选择<span className='public-color'>上传户口簿申领社保卡</span>，需补充填写户口簿登记机关，可查阅户口簿获取相关信息（参考下图:儋州市公安局南丰派出所）</div>
+ <img src={applyForForm_5} alt="" srcset="" />
+ </>
+ }
+ </div>
+ }
+ />
+ {
+ formData[expiredDateData.startTime] &&
+ <Picker
+ // data={[[{ label: myTimeFormat((new Date(formData.icExpiredStartTime).getTime() + 157680000000), `YYYY年M月D日`), value: new Date(new Date(formData.icExpiredDate).getTime() + 86400000) }, { label: '长期', value: '2' }]]}
+ data={[[
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 5) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 10) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20 + '年') + (myTimeFormat(formData[expiredDateData.startTime], `M月D日`)), value: (Number(myTimeFormat(formData[expiredDateData.startTime], `YYYY`)) + 20) + (myTimeFormat(formData[expiredDateData.startTime], `-M-D`)) },
+ { label: '长期', value: myTimeFormat(new Date('2099-1-1'), `YYYY-M-D`) }]]}
+ visible={expiredDateData.visible}
+ title="证件有效期"
+ okText="确定"
+ cascade={false}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false })}
+ onChange={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })
+ formData[expiredDateData.endTime] = new Date(e)
+ handleChange(formData, expiredDateData.endTime)
+ }
+ }
+ >
+ </Picker>
+
+ }
+ <DatePicker
+ visible={expiredDateData.visible1}
+ title={'证件有效期开始日期'}
+ mode="date"
+ minDate={new Date(1900, 1, 1, 0, 0, 0)}
+ maxDate={new Date(2100, 1, 1, 0, 0, 0)}
+ extra={<span className="select-color">请选择</span>}
+ cascade={true}
+ onChange={(e) => {
+ formData[expiredDateData.startTime] = e;
+ handleChange(formData, expiredDateData.startTime)
+ }}
+ onDismiss={() => setExpiredDateData({ ...expiredDateData, visible: false, visible1: false })}
+ onOk={(e) => {
+ setExpiredDateData({ ...expiredDateData, visible: true, visible1: false })
+ }}
+ >
+ </DatePicker>
+ </div >
+ );
+};
+
+function FullScreenImageViewer({ src }) {
+ const [isFullscreen, setIsFullscreen] = useState(false);
+
+ const toggleFullscreen = () => {
+ setIsFullscreen(!isFullscreen);
+ };
+
+ return (
+ <div>
+ <button onClick={toggleFullscreen}>查看全屏图片</button>
+ {isFullscreen && (
+ <div
+ style={{
+ position: 'fixed',
+ top: 0,
+ left: 0,
+ right: 0,
+ bottom: 0,
+ background: 'rgba(0, 0, 0, 0.75)',
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ zIndex: 1000
+ }}
+ >
+ <img src={src} alt="预览图片" style={{ maxWidth: '100%', maxHeight: '100%' }} />
+ <button onClick={toggleFullscreen} style={{ position: 'absolute', top: 10, right: 10 }}>
+ 关闭
+ </button>
+ </div>
+ )}
+ </div>
+ );
+}
+
+export default RenderFormView;
diff --git a/src/components/RenderFormView/index.less b/src/components/RenderFormView/index.less
new file mode 100644
index 0000000..d2deba8
--- /dev/null
+++ b/src/components/RenderFormView/index.less
@@ -0,0 +1,493 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.select-color {
+ color: @common_level3_base_color;
+}
+
+.divider-title {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px;
+ display: flex;
+ justify-content: space-between;
+ &-new {
+ height: 8px;
+ }
+}
+
+.divider-title-ocr {
+ font-size: 12px;
+ color: #171a1d;
+ line-height: 20px;
+ margin: 12px 12px 0 12px;
+ display: flex;
+ justify-content: space-between;
+}
+
+.form-font-weight {
+ font-weight: 600;
+}
+
+.form-font-color-red {
+ color: #f5222d;
+}
+
+.form-font-color-blue {
+ color: #007fff;
+}
+
+.mini-divider-title {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 20px;
+}
+
+.select-color-disabled {
+ & .dtm-list-extra {
+ color: rgba(23, 26, 29, 0.24) !important;
+ }
+}
+
+.divider-Tabtitle {
+ font-size: 14px;
+ color: #007fff;
+ line-height: 20px;
+ margin: 12px 12px 0px 12px;
+ display: flex;
+ justify-content: space-between;
+
+ &-tabs {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #d9d9d9;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-green {
+ font-size: 12px;
+ color: #00b042;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #00b042;
+ border-radius: 2px;
+ }
+ }
+
+ &-tabs-red {
+ font-size: 12px;
+ color: #ff5219;
+
+ & span {
+ width: 10px;
+ height: 10px;
+ display: inline-block;
+ margin-right: 8px;
+ background: #ff5219;
+ border-radius: 2px;
+ }
+ }
+}
+
+.render-form-childView4-relative {
+ position: relative;
+ min-height: 48px;
+ padding-left: 16px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ overflow: hidden;
+ vertical-align: middle;
+ transition: background-color 200ms;
+}
+
+.render-form-childView4-absolute:before {
+ position: absolute;
+ left: 6px;
+ display: inline-block;
+ color: var(--theme_danger1_color, #ff5219);
+ font-size: 14px;
+ font-family: SimSun, sans-serif;
+ line-height: 2px;
+ content: '*';
+}
+
+.dtm-list-item {
+ min-height: 46px;
+}
+
+.render-form-view {
+ &-main {
+ // overflow: hidden;
+ // padding-bottom: 16px;
+
+ & .dtm-space-item {
+ font-size: 16px;
+ }
+ }
+
+ &-overflow {
+ // height: 100%;
+ // overflow: scroll;
+ // &::-webkit-scrollbar {
+ // display: none !important;
+ // }
+ }
+
+ &-input .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ text-align: right;
+ }
+
+ &-input-brief .dtm-input-item-input {
+ // color: var(--common_level3_base_color, rgba(23, 26, 29, 0.4));
+ font-size: 14px;
+ // text-align: right;
+ }
+
+ &-title-borderRadius {
+ border-radius: 10px;
+ }
+
+ &-switch-title {
+ font-size: 14px;
+ padding-right: 8px;
+ color: #171a1d;
+ opacity: 0.85;
+ }
+
+ &-switch .dtm-switch-fake {
+ width: 43px !important;
+ height: 22px !important;
+ }
+
+ &-switch .dtm-switch-fake::after {
+ width: 18px !important;
+ height: 18px !important;
+ background-color: var(--common_white1_color, #ffffff);
+ }
+
+ &-switch .dtm-form-item-default-label {
+ width: auto;
+ }
+
+ &-multiple {
+ &-top .dtm-list-item-middle {
+ border-radius: 10px 10px 0px 0px;
+ }
+
+ &-bottom .dtm-list-item-middle {
+ border-radius: 0px 0px 10px 10px;
+ }
+
+ &-radius .dtm-list-item-middle {
+ border-radius: 10px;
+ }
+ }
+
+ &-select_multiple {
+ display: flex;
+ justify-content: space-between;
+
+ &-value {
+ color: #171a1d;
+ opacity: 0.85;
+ font-size: 14px;
+ }
+
+ &-m {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+ }
+
+ &-space {
+ width: 100%;
+ }
+
+ &-files {
+ background: #ffffff;
+ border-radius: 10px;
+ padding: 12px 16px 16px;
+
+ &-title {
+ font-size: 14px;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 22px;
+ margin-bottom: 12px;
+ }
+
+ &-col {
+ display: flex;
+ justify-content: space-between;
+ }
+ }
+
+ &-childView {
+ margin-bottom: 0px;
+ background: #fff;
+ padding: 10px 16px;
+
+ &-flex {
+ display: flex;
+ align-items: center;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-rightArrow {
+ margin-left: 5px;
+ font-size: 15px;
+ color: var(--common_level4_base_color, #ffffff);
+ }
+ }
+
+ &-headtTitle {
+ background: #fff;
+ padding: 12px 16px;
+
+ &-overflow {
+ overflow: scroll;
+ height: 300px;
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ & img {
+ padding-left: 6px;
+ width: 14px;
+ height: 14px;
+ }
+ }
+
+ &-border {
+ position: relative;
+ background-color: @common_bg_z1_color;
+
+ &::after {
+ content: '';
+ position: absolute;
+ height: 1px;
+ background-color: @common_line_light_color;
+ left: 0;
+ right: 0;
+ z-index: 99;
+ bottom: -12px;
+ }
+ }
+ }
+
+ &-checkbox {
+ margin: 12px 0;
+ & .dtm-list-thumb {
+ // margin: 0 !important;
+ }
+ & .dtm-list-item {
+ padding: 0;
+ }
+ & .dtm-list-line {
+ padding: 0;
+ }
+ }
+
+ &-number {
+ & .dtm-form-item-default-label {
+ flex: 3;
+ }
+ & .dtm-form-item-default-label .dtm-space-item {
+ width: 100%;
+ white-space: pre-wrap;
+ }
+
+ & .dtm-form-item-default-field {
+ flex: 1;
+ }
+ }
+}
+
+.people-visit-edit-select-subtitle {
+ color: rgba(23, 26, 29, 0.24);
+ font-size: 14px;
+ line-height: 22px;
+ padding-left: 24px;
+}
+
+.render-form-view-headtTitle-select {
+ display: flex;
+ background: #f2f2f6;
+ padding: 6px 5px;
+ border-radius: 4px;
+ align-items: center;
+ &-person {
+ background-color: #007fff;
+ border-radius: 4px;
+ font-size: 14px;
+ line-height: 24px;
+ padding: 0px 5px;
+ height: 24px;
+ color: #fff;
+ margin-right: 8px;
+ white-space: nowrap;
+ }
+ & img {
+ width: 16px;
+ height: 16px;
+ }
+}
+
+.headerTitleAdd-empty {
+ flex: 2;
+ height: 110px;
+}
+
+.renderFormView {
+ &-card {
+ padding: 12px 16px;
+ background-color: #fff;
+ margin-top: 8px;
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ display: flex;
+ align-items: center;
+ & img {
+ width: 16px;
+ height: 16px;
+ margin-left: 4px;
+ }
+ }
+ &-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 8px;
+ }
+ &-main {
+ display: flex;
+ line-height: 22px;
+ color: rgba(23, 26, 29, 0.6);
+ &-flex {
+ font-size: 14px;
+ line-height: 22px;
+ flex: 1 1;
+ display: flex;
+ }
+ }
+ }
+}
+
+.switchSelect {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ line-height: 22px;
+ background-color: #d9d9d9;
+ padding: 2px;
+ border-radius: 4px;
+ &-name {
+ white-space: nowrap;
+ padding: 1px 8px;
+ }
+ &-active {
+ background-color: #fff;
+ border-radius: 4px;
+ }
+}
+
+.background-purple {
+ background-color: #b963d3;
+ width: 48px;
+ height: 48px;
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+ border-radius: 50%;
+ &-size {
+ font-size: 24px;
+ line-height: 32px;
+ color: #fff;
+ }
+}
+
+.background-orange {
+ background-color: #ff9200;
+ width: 48px;
+ height: 48px;
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+ border-radius: 50%;
+ &-size {
+ font-size: 24px;
+ line-height: 32px;
+ color: #fff;
+ }
+}
+
+.color-purple {
+ color: #b963d3;
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ }
+ &-borderRadius {
+ background: rgba(185, 99, 211, 0.12);
+ border-radius: 15px;
+ }
+ &-flex {
+ display: flex;
+ &-margin {
+ margin-top: 4px;
+ & img {
+ width: 14px;
+ height: 14px;
+ margin-right: 4px;
+ }
+ }
+ }
+}
+
+.color-orange {
+ color: #ff9200;
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ }
+ &-borderRadius {
+ background: rgba(255, 146, 0, 0.12);
+ border-radius: 15px;
+ }
+ &-flex {
+ display: flex;
+ &-margin {
+ margin-top: 4px;
+ & img {
+ width: 14px;
+ height: 14px;
+ margin-right: 4px;
+ }
+ }
+ }
+}
diff --git a/src/components/ResidenceDetails/index.jsx b/src/components/ResidenceDetails/index.jsx
new file mode 100644
index 0000000..7bf217c
--- /dev/null
+++ b/src/components/ResidenceDetails/index.jsx
@@ -0,0 +1,63 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-03 14:50:49
+ * @LastEditTime: 2023-03-05 19:05:32
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 居住详情
+ */
+import React from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import { LocationOutlined, HomeOutlined } from 'dd-icons';
+import { searchPersonRoom_svg_9, searchPersonRoom_svg_12 } from "../../assets/icon";
+import MyModal from '../MyModal';
+import { dateFormat } from '../../utils/utility';
+
+const ResidenceDetail = ({ data, onClose }) => {
+ return (
+ <MyModal visible={data.visible} title="居住详情" onClose={onClose}>
+ <div className="livingTrack-card-main" style={{ display: 'block' }}>
+ <div className="livingTrack-card-main-line">
+ <div>
+ <LocationOutlined />
+ </div>
+ <div className="livingTrack-card-main-flex">{data.houseaddress}</div>
+ </div>
+ <div className="livingTrack-card-main-line">
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={searchPersonRoom_svg_9} alt="" />
+ </div>
+ <div className="livingTrack-card-main-flex">
+ {data.districtName} {data.subdistrictName} {data.communityName}
+ </div>
+ </div>
+ </div>
+ <div className="livingTrack-subtitle">
+ <Space direction="vertical" style={{ '--gap-vertical': '4px' }}>
+ <div>
+ <span>居住状态：</span>
+ <span className={`livingTrack-card-header-action-${data.liveType === '1' ? 'green' : 'red'}`}>{data.liveTypeDesc}</span>
+ </div>
+ {data.liveType === '2' && (
+ <div style={{ display: 'flex' }}>
+ <div>迁出原因：</div>
+ <div style={{ flex: 1 }}>{data.outReasonDesc} {data.outContent ? `（${data.outContent}）` : ''}</div>
+ </div>
+ )}
+ <div>登记时间：{dateFormat(data.editorTime)}</div>
+ {data.liveType === '2' && <div>迁出时间：{dateFormat(data.griderTime)}</div>}
+ <div>最近一次更新时间：{dateFormat(data.updateTime)}</div>
+ <div className="searchPersonRoomSearch-card-main-flex" style={{ paddingLeft: '0', alignItems: 'center' }}>
+ 网格员：{data.grider || '-'}
+ <div className='public-split'></div>
+ <div className='searchPersonRoomSearch-card-main-img'>
+ <img src={searchPersonRoom_svg_12} alt="" />
+ </div>{data.mobile || '-'}</div>
+ </Space>
+ </div>
+ </MyModal>
+ );
+};
+
+export default ResidenceDetail;
diff --git a/src/components/ServiceStep/index.jsx b/src/components/ServiceStep/index.jsx
new file mode 100644
index 0000000..b7a51fa
--- /dev/null
+++ b/src/components/ServiceStep/index.jsx
@@ -0,0 +1,54 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-17 09:39:09
+ * @LastEditTime: 2022-09-01 20:17:35
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 网络服务和椰居码历史服务 “步骤条” 组件
+ */
+import React from 'react';
+import './index.less';
+import { Empty } from 'dingtalk-design-mobile';
+import { step_jmxxdj, step_ylrkpc, step_sbkbl, step_lnzbl, step_mdjfpc } from '../../assets/icon/index';
+import { timeFormat } from '../../utils/utility';
+
+const ServiceStep = ({ stepData = [] }) => {
+ return (
+ <>
+ {stepData.length === 0 && (
+ <div>
+ <Empty type="noContent" title="暂无服务历史" inline />
+ </div>
+ )}
+ {stepData.map((x, t) => (
+ <div className="myStep-item" key={t}>
+ <div className="myStep-item-icon">
+ <img src={step_jmxxdj} alt="" />
+ </div>
+ <div className="myStep-item-content">
+ <div className="myStep-item-content-title">{x.serveTypeDesc}</div>
+ <div className="myStep-item-content-subtitle">
+ <span>服务结果：</span>
+ <span
+ className={`myStep-item-${x.serveResult === '1' ? 'orange' : x.serveResult === '2' ? 'green' : x.serveResult === '3' ? 'red' : ''}`}
+ >
+ <span>{x.serveResultDesc}</span>
+ {x.content && <span>（{x.content}）</span>}
+ </span>
+ </div>
+ <div className="myStep-item-content-subtitle">
+ <span>网格员：</span>
+ <span>{x.editor}</span>
+ </div>
+ <div className="myStep-item-content-subtitle">
+ <span>{timeFormat(x.createTime)}</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </>
+ );
+};
+
+export default ServiceStep;
diff --git a/src/components/ServiceStep/index.less b/src/components/ServiceStep/index.less
new file mode 100644
index 0000000..27bb206
--- /dev/null
+++ b/src/components/ServiceStep/index.less
@@ -0,0 +1,64 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.myStep {
+ &-item {
+ display: flex;
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ width: 1px;
+ height: 100%;
+ top: 0;
+ left: 8px;
+ background-color: @common_line_light_color;
+ }
+
+ &-icon {
+ height: 18px;
+ width: 18px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: @theme_primary1_color;
+ border-radius: 50%;
+ margin-top: 2px;
+ margin-right: 8px;
+ }
+
+ &-content {
+ flex: 1;
+ padding-bottom: 12px;
+
+ &-title {
+ font-weight: 600;
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ display: flex;
+ }
+ }
+
+ &-green {
+ color: @common_green1_color;
+ }
+
+ &-orange {
+ color: @common_orange1_color;
+ }
+
+ &-red {
+ color: @common_red1_active_color;
+ }
+ }
+
+ &-item:last-child {
+ &::before {
+ display: none;
+ }
+ }
+}
diff --git a/src/components/ShowToastCustom/index.js b/src/components/ShowToastCustom/index.js
new file mode 100644
index 0000000..f08060b
--- /dev/null
+++ b/src/components/ShowToastCustom/index.js
@@ -0,0 +1,49 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-03-07 14:55:41
+ * @LastEditTime: 2023-03-07 15:45:42
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React from 'react'
+import ReactDOM from 'react-dom'
+import Toast from './toast'
+import './toast.css'
+
+function createNotification() {
+ const div = document.createElement('div')
+ document.body.appendChild(div)
+ const notification = ReactDOM.render(<Toast />, div)
+ return {
+ addNotice(notice) {
+ return notification.addNotice(notice)
+ },
+ destroy() {
+ ReactDOM.unmountComponentAtNode(div)
+ document.body.removeChild(div)
+ }
+ }
+}
+
+let notification
+const notice = (type, content, duration = 2000, onClose) => {
+ if (!notification) notification = createNotification()
+ return notification.addNotice({ type, content, duration, onClose })
+}
+
+export default {
+ info(content, duration, onClose) {
+ return notice('info', content, duration, onClose)
+ },
+ success(content = '操作成功', duration, onClose) {
+ return notice('success', content, duration, onClose)
+ },
+ error(content, duration, onClose) {
+ return notice('error', content, duration, onClose)
+ },
+ loading(content = '加载中...', duration = 0, onClose) {
+ return notice('loading', content, duration, onClose)
+ }
+}
\ No newline at end of file
diff --git a/src/components/ShowToastCustom/toast.css b/src/components/ShowToastCustom/toast.css
new file mode 100644
index 0000000..e6c0df7
--- /dev/null
+++ b/src/components/ShowToastCustom/toast.css
@@ -0,0 +1,89 @@
+.toast {
+ position: fixed;
+ left: 0;
+ top: 0;
+ z-index: 999;
+ display: flex;
+ flex-direction: column;
+}
+.toast_bg {
+ position: fixed;
+ width: 100%;
+ height: 100%;
+ left: 0;
+ top: 0;
+}
+.toast_box {
+ position: relative;
+ left: 50%;
+ top: 50%;
+ width: 2.8rem;
+ height: 2rem;
+ margin: -1rem -1.4rem;
+ background: rgba(0, 0, 0, 0.65);
+ border-radius: 0.1rem;
+ color: #fff;
+}
+.toast_text {
+ position: absolute;
+ bottom: 16%;
+ text-align: center;
+ width: 90%;
+ margin: 0 5%;
+ height: 0.28rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+.toast_icon {
+ position: relative;
+ left: 50%;
+ top: 15%;
+ margin: -0.4rem;
+ width: 0.8rem;
+ height: 0.8rem;
+}
+.toast_loading {
+ -webkit-animation: loading 1s steps(12, end) infinite;
+ animation: loading 1s steps(12, end) infinite;
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAM1BMVEUAAAD///////////////////////////////////////////////////////////////+3leKCAAAAEHRSTlMAENCA8KAgsGDgQMCQUDBwhylaLQAAAL1JREFUOMu9U0kSwyAMK9jsS/T/1zZt2pgEZzq9RBeMZYRGDI/70bO5JptjrOAQVTonIJVK5bW2ma9A7VvpK8OdeQfbZectrDnyU+Oo0b68wGK0muDPdxpOciaizq5pkAgiIPAoew2rBVNYZoM2YHbZDNKz/2Ogam3ff5gMEL8wisfh2KKZiFiGWFkk1B7NSbhNQFy4M2+PghbODNsg7y8THM2njiy8gBgcaEUA9GgNJbxh6fJv+NxiFvYmPAFtCQZNK1qZIAAAAABJRU5ErkJggg==')
+ no-repeat;
+ background-size: 100%;
+}
+.toast_success {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAM1BMVEUAAAD///////////////////////////////////////////////////////////////+3leKCAAAAEHRSTlMA8DAQ0GBP4LCggMBwIJBAIttdjAAAAINJREFUOMvdkUsOwyAMBbH5hUCauf9pK1SlohF438x2LPn52f09+8vUfiNb/gighj8FouEjYCUoQDXiBSD7pdcMiK7XC9wCFmlDO3T20Scgx287ne13pwDU89NOJ3g3maCmJDANqIGRtLj8oi1ed1GMdmcB7wXIYX8QdQZJiM5Em3smbyVICDCOrCqSAAAAAElFTkSuQmCC')
+ no-repeat;
+ background-size: 100%;
+}
+.toast_error {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAMFBMVEUAAAD///////////////////////////////////////////////////////////87TQQwAAAAD3RSTlMA0BDAMODwUKBgsCCAQJClzVPvAAAA0UlEQVQoz2MgErAclv9o44Dgc8b/B4KvBTA+t/3XdgeWivjPG6ACbl8ngNXlp0AN+L8IwtD6DzFm2w+Y3v5sMGW/ACbA9Rms9ZsCTIApH2QR608GhoUKQJ4xA8P8AKCAP5CwF2JgUPwIlPwCFDj/AMRRYJIHCnL8AZkJ1AfkAcUYGNhBpso7MICUgBQw8H4EEv/B5ssDFYA4mAKYWjANfd+Aai3CYZ9BDoM63RDkdEGQ0zE9h+l9zADCDEIGt2/wQEZEwwVepGhgYEdEFGZUEgYAW05XI3jSsVwAAAAASUVORK5CYII=')
+ no-repeat;
+ background-size: 100%;
+}
+.toast_info {
+ background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAALVBMVEUAAAD///////////////////////////////////////////////////////+hSKubAAAADnRSTlMA4CCAwKBAMJBg8NAQUNhWlbcAAAC+SURBVCjPYyASsLfse+1cgOBzyr0DgocXYHwmv4dtCkwZck8UoAJZDydA1C2H8NnexUAYR99BjNF6CtMbtwhM+QUACUUhIMH6BKz14QEgafcYSPDIgSxifMkAE2CYJwAk6gQQAozPgURfA0KAA0T6JSAE2ECm7lNACDC9BhLvGGACIA6GAFyLohBEC9xQqLeeQKwFA4i1EIfBAeNzuNMVhSBOx/AcpvcxAwgzCDEDGTMaGHhhEYWIShN4VBIGAPvRT5YzufhUAAAAAElFTkSuQmCC')
+ no-repeat;
+ background-size: 100%;
+}
+
+@-webkit-keyframes loading {
+ 0% {
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
+ transform: rotate3d(0, 0, 1, 0deg);
+ }
+ 100% {
+ -webkit-transform: rotate3d(0, 0, 1, 360deg);
+ transform: rotate3d(0, 0, 1, 360deg);
+ }
+}
+
+@keyframes loading {
+ 0% {
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
+ transform: rotate3d(0, 0, 1, 0deg);
+ }
+ 100% {
+ -webkit-transform: rotate3d(0, 0, 1, 360deg);
+ transform: rotate3d(0, 0, 1, 360deg);
+ }
+}
diff --git a/src/components/ShowToastCustom/toast.js b/src/components/ShowToastCustom/toast.js
new file mode 100644
index 0000000..d582662
--- /dev/null
+++ b/src/components/ShowToastCustom/toast.js
@@ -0,0 +1,79 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-03-07 15:45:59
+ * @LastEditTime: 2023-03-07 15:46:10
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { Component } from 'react';
+
+class ToastBox extends Component {
+ constructor() {
+ super();
+ this.transitionTime = 300;
+ this.state = { notices: [] };
+ this.removeNotice = this.removeNotice.bind(this);
+ }
+
+ getNoticeKey() {
+ const { notices } = this.state;
+ return `notice-${new Date().getTime()}-${notices.length}`;
+ }
+
+ addNotice(notice) {
+ const { notices } = this.state;
+ notice.key = this.getNoticeKey();
+
+ // notices.push(notice);//展示所有的提示
+ notices[0] = notice; //仅展示最后一个提示
+
+ this.setState({ notices });
+ if (notice.duration > 0) {
+ setTimeout(() => {
+ this.removeNotice(notice.key);
+ }, notice.duration);
+ }
+ return () => {
+ this.removeNotice(notice.key);
+ };
+ }
+
+ removeNotice(key) {
+ const { notices } = this.state;
+ this.setState({
+ notices: notices.filter((notice) => {
+ if (notice.key === key) {
+ if (notice.onClose) setTimeout(notice.onClose, this.transitionTime);
+ return false;
+ }
+ return true;
+ }),
+ });
+ }
+
+ render() {
+ const { notices } = this.state;
+ const icons = {
+ info: 'toast_info',
+ success: 'toast_success',
+ error: 'toast_error',
+ loading: 'toast_loading',
+ };
+ return (
+ <div className="toast">
+ {notices.map((notice) => (
+ <div className="toast_bg" key={notice.key}>
+ <div className="toast_box">
+ <div className={`toast_icon ${icons[notice.type]}`}></div>
+ <div className="toast_text">{notice.content}</div>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ }
+}
+
+export default ToastBox;
diff --git a/src/components/SlideTest/index.jsx b/src/components/SlideTest/index.jsx
new file mode 100644
index 0000000..048c821
--- /dev/null
+++ b/src/components/SlideTest/index.jsx
@@ -0,0 +1,76 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-11-07 17:47:28
+ * @LastEditTime: 2024-09-19 10:57:46
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description: 滑动验证组件
+ */
+import React, { useEffect, useRef } from 'react';
+import './index.less';
+import { DoubleRightOutlined } from '@ant-design/icons';
+
+const SlideTest = ({ onSuccessCallback }) => {
+ const slideRef = useRef();
+
+ const boxRef = useRef();
+
+ const successRef = useRef();
+
+ useEffect(() => {
+ // setLeftWidth();
+ // 验证成功的距离
+ const distance = boxRef.current.clientWidth - 60;
+ let success = false;
+ slideRef.current.onmousedown = (eve) => {
+ const e = eve || window.event;
+ let downX = e.clientX;
+ document.onmousemove = (eve) => {
+ const e = eve || window.event;
+ let moveX = e.clientX;
+ let offsetX = moveX - downX;
+ if (offsetX > distance) {
+ offsetX = distance;
+ } else if (offsetX < 0) {
+ offsetX = 0;
+ }
+ slideRef.current.style.left = offsetX + 'px';
+ successRef.current.style.width = offsetX + 'px';
+ if (offsetX == distance) {
+ onSuccessCallback && onSuccessCallback();
+ success = true;
+ successRef.current.innerHTML = '验证通过';
+ document.onmousemove = null;
+ }
+ };
+ };
+ document.onmouseup = () => {
+ if (success) {
+ if (slideRef.current) {
+ slideRef.current.onmousedown = null;
+ }
+ document.onmouseup = null;
+ } else {
+ slideRef.current.style.left = 0;
+ successRef.current.style.width = 0;
+ successRef.current.innerHtml = '';
+ document.onmousemove = null;
+ }
+ };
+ return () => {
+ document.onmouseup = null;
+ };
+ }, []);
+
+ return (
+ <div className="slideTest-init" ref={boxRef}>
+ <div className="slideTest-success" ref={successRef} />
+ <div className="slideTest-slide" ref={slideRef}>
+ <DoubleRightOutlined style={{color:'rgba(0, 0, 0, 0.65)'}}/>
+ </div>
+ </div>
+ );
+};
+
+export default SlideTest;
diff --git a/src/components/SlideTest/index.less b/src/components/SlideTest/index.less
new file mode 100644
index 0000000..38dc2e9
--- /dev/null
+++ b/src/components/SlideTest/index.less
@@ -0,0 +1,45 @@
+@import '../../styles/theme.less';
+
+.slideTest {
+ &-init {
+ position: relative;
+ height: 40px;
+ width: 100%;
+ background-color: #f0f2f5;
+ border-radius: @border-radius-base;
+
+ &::before {
+ position: absolute;
+ content: '拖动滑块验证';
+ line-height: 40px;
+ width: 100%;
+ text-align: center;
+ font-size: 16px;
+ }
+ }
+
+ &-success {
+ position: absolute;
+ height: 40px;
+ line-height: 40px;
+ background-color: #52c41a;
+ text-align: center;
+ color: #ffffff;
+ font-size: 16px;
+ padding-left: 60px;
+ }
+
+ &-slide {
+ position: absolute;
+ z-index: 99;
+ height: 40px;
+ background-color: #fff;
+ border: 1px solid #d9d9d9;
+ width: 60px;
+ line-height: 40px;
+ text-align: center;
+ box-shadow: 0 0 8px #d9d9d9;
+ color: rgba(0, 0, 0, 0.65);
+ cursor: move;
+ }
+}
diff --git a/src/components/TabBarPage/index.jsx b/src/components/TabBarPage/index.jsx
new file mode 100644
index 0000000..8f7eafc
--- /dev/null
+++ b/src/components/TabBarPage/index.jsx
@@ -0,0 +1,184 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-08 19:57:35
+ * @LastEditTime: 2023-05-19 09:21:07
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 底部操作栏页面
+ */
+import React, { useState } from 'react';
+import { useLocation, useHistory } from 'react-router-dom';
+import { WorkOutlined, MeOutlined, HomeOutlined, CloseOutlined } from 'dd-icons';
+import './index.less';
+import Overlay from '../Overlay';
+import { tabBar_img_1, tabBar_img_2, tabBar_img_3, tabBar_img_8, tabBar_img_9, tabBar_img_11 } from '../../assets/img';
+import { tabBar_img_10 } from '../../assets/icon';
+
+const TabBarPage = ({ children }) => {
+ const location = useLocation();
+
+ const history = useHistory();
+
+ const pathName = location?.pathname;
+
+ // 更多操作显示
+ const [moreFunctionVisible, setMoreFunctionVisible] = useState(false);
+
+ // 更多操作
+ const moreFunctionList = [
+ // {
+ // title: '查人查房',
+ // subTitle: '通过关键字筛选人房信息',
+ // icon: tabBar_img_2,
+ // url: '/hztGrid/searchPersonRoom',
+ // key: '1',
+ // },
+ // {
+ // title: '工作日志',
+ // subTitle: '填写网格工作日志',
+ // icon: tabBar_img_8,
+ // url: '/hztGrid/workLog',
+ // key: '2',
+ // },
+ // {
+ // title: '网格概况',
+ // subTitle: '管辖网格整体情况',
+ // icon: tabBar_img_9,
+ // url: '/hztGrid/surveyGrid',
+ // key: '3',
+ // },
+ {
+ title: '工作统计',
+ subTitle: '个人网格工作统计',
+ icon: tabBar_img_3,
+ url: '/hztGrid/WorkStatistics',
+ key: '4',
+ },
+ // {
+ // title: '迁出查询',
+ // subTitle: '查询本网格已迁出的居民',
+ // icon: tabBar_img_10,
+ // url: '/hztGrid/moveOut',
+ // key: '10',
+ // },
+ // {
+ // title: '房间走访',
+ // subTitle: '网格员上门走访房间并拍照',
+ // icon: tabBar_img_11,
+ // url: '/hztGrid/visitList',
+ // key: '11',
+ // },
+ // {
+ // title: '我的任务',
+ // subTitle: '显示个人相关的网格工作',
+ // icon: tabBar_img_1,
+ // url: '/hztGrid/task',
+ // key: '5',
+ // },
+ // {
+ // title: '事件上报',
+ // subTitle: '上报网格内的各类事件',
+ // icon: tabBar_img_6,
+ // url: '/hztGrid/eventInit?type=register',
+ // key: '6',
+ // },
+ // {
+ // title: '上报查询',
+ // subTitle: '查询已上报的网格事件进展',
+ // icon: tabBar_img_7,
+ // url: '/hztGrid/eventInit?type=search',
+ // key: '7',
+ // },
+ // {
+ // title: '我的消息',
+ // subTitle: '网格公告与系统通知',
+ // icon: tabBar_img_4,
+ // url: '/hztGrid/message',
+ // key: '8',
+ // },
+ // TODO:暂无扫一扫功能
+ // {
+ // title: '扫一扫',
+ // subTitle: '扫描椰居码查看居民信息',
+ // icon: tabBar_img_5,
+ // url: '',
+ // key: '9',
+ // },
+ ];
+
+ // 更多操作跳转
+ function handleGoPage(item) {
+ if (item.url) {
+ history.push(item.url);
+ }
+ // 扫码TODO:暂无扫一扫功能
+ // if (item.key === '5') {
+ // dd.scan({ type: 'all' })
+ // .then((res) => {})
+ // .catch(() => {
+ // showToast({ type: 'fail', content: '扫码失败' });
+ // });
+ // }
+ }
+
+ // 切换tab
+ function handleChangeTab(key) {
+ if (key === location.pathname) return;
+ history.push(key);
+ }
+
+ return (
+ <>
+ {children}
+ <div className="tabBarPage-tabBar-height" />
+ <div className="tabBarPage-tabBar">
+ <div
+ onClick={() => handleChangeTab('/hztGrid/homePage')}
+ className={`tabBarPage-tabBar-item ${pathName === '/hztGrid/homePage' && 'tabBarPage-tabBar-itemActive'}`}
+ >
+ <HomeOutlined className="tabBarPage-tabBar-item-icon" />
+ <div>首页</div>
+ </div>
+ <div className="tabBarPage-tabBar-item">
+ <div className="tabBarPage-tabBar-more" onClick={() => setMoreFunctionVisible(true)}>
+ <WorkOutlined />
+ </div>
+ </div>
+ <div
+ onClick={() => handleChangeTab('/hztGrid/me')}
+ className={`tabBarPage-tabBar-item ${pathName === '/hztGrid/me' && 'tabBarPage-tabBar-itemActive'}`}
+ >
+ <MeOutlined className="tabBarPage-tabBar-item-icon" />
+ <div>我的</div>
+ </div>
+ </div>
+ {/* 更多操作 */}
+ <>
+ <div className="tabBarPage-function" style={{ transform: moreFunctionVisible ? 'translate3d(0, 0, 0)' : 'translate3d(0, 1000px, 0)' }}>
+ {moreFunctionList.map((x) => {
+ return (
+ <div key={x.key} onClick={() => handleGoPage(x)} className="tabBarPage-function-item">
+ <img src={x.icon} alt="" className="tabBarPage-function-img" />
+ <div>
+ <div className="tabBarPage-function-title">{x.title}</div>
+ <div className="tabBarPage-function-text">{x.subTitle}</div>
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ <div
+ style={{ display: moreFunctionVisible ? 'flex' : 'none' }}
+ className="tabBarPage-function-close"
+ onClick={() => setMoreFunctionVisible(false)}
+ >
+ <CloseOutlined />
+ </div>
+ <Overlay show={moreFunctionVisible} onOverlay={() => setMoreFunctionVisible(false)} bgColor="#333333" />
+ </>
+ </>
+ );
+};
+
+export default TabBarPage;
diff --git a/src/components/TabBarPage/index.less b/src/components/TabBarPage/index.less
new file mode 100644
index 0000000..fb33908
--- /dev/null
+++ b/src/components/TabBarPage/index.less
@@ -0,0 +1,98 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+@import (reference) '../../styles/public.less';
+
+.tabBarPage {
+ &-tabBar {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ display: flex;
+ align-items: center;
+ height: @tabBarHeight;
+ background-color: @common_bg_z1_color;
+ z-index: 99;
+
+ &-height {
+ height: @tabBarHeight;
+ }
+
+ &-item {
+ font-size: 12px;
+ line-height: 12px;
+ flex: 1;
+ text-align: center;
+
+ &-icon {
+ font-size: 18px;
+ margin-bottom: 4px;
+ }
+ }
+
+ &-itemActive {
+ color: @theme_primary1_color;
+ }
+
+ &-more {
+ background-color: @theme_primary1_color;
+ width: 55px;
+ height: 34px;
+ border-radius: 10px;
+ color: @common_bg_z1_color;
+ font-size: 24px;
+ text-align: center;
+ line-height: 34px;
+ margin: auto;
+ }
+ }
+
+ &-function {
+ position: fixed;
+ bottom: 64px;
+ z-index: 999;
+ transition: transform 0.6s;
+ transform: translate3d(0, 1000px, 0);
+ left: 50%;
+ margin-left: -100px;
+
+ &-close {
+ position: fixed;
+ z-index: 999;
+ bottom: 7px;
+ width: 54px;
+ height: 34px;
+ left: 50%;
+ margin-left: -27px;
+ text-align: center;
+ background-color: @common_bg_z1_color;
+ border-radius: 20px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-img {
+ width: 50px;
+ height: 50px;
+ margin-right: 8px;
+ }
+
+ &-item {
+ display: flex;
+ align-items: center;
+ color: @common_bg_z1_color;
+ margin-bottom: 32px;
+ }
+
+ &-title {
+ line-height: 14px;
+ }
+
+ &-text {
+ font-size: 12px;
+ line-height: 12px;
+ color: #c0b2b2;
+ padding-top: 8px;
+ }
+ }
+}
diff --git a/src/components/TaskModalContent/index.jsx b/src/components/TaskModalContent/index.jsx
new file mode 100644
index 0000000..328a021
--- /dev/null
+++ b/src/components/TaskModalContent/index.jsx
@@ -0,0 +1,75 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-16 20:03:48
+ * @LastEditTime: 2022-09-23 11:56:18
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 页面内底部弹窗中展示“我的任务”列表组件
+ */
+import React, { useState } from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import ModalDown from '../ModalDown';
+import TaskHandle02 from '../../views/task/handle/Handle_02';
+import './index.less';
+import { dateFormat } from '../../utils/utility';
+
+const TaskModalContent = ({ visible, data = [], onClose, onReturnCallback }) => {
+ const [taskModal, setTaskModal] = useState({ visible: false });
+
+ const beOverdue = (expireTime) => {
+ if (dateFormat(expireTime) < dateFormat(new Date())) {
+ return true;
+ }
+ return false;
+ };
+
+ return (
+ <>
+ <ModalDown
+ visible={visible}
+ visibleOnClick={onClose}
+ title="我的任务"
+ extraContent={
+ <div className="taskModal">
+ {data.map((x, t) => (
+ <div
+ onClick={() => setTaskModal({ ...x, visible: true })}
+ className={`taskModal-item ${t === data.length - 1 && 'taskModal-item-last'}`}
+ key={t}
+ >
+ <div>
+ <Space style={{ '--gap': '4px' }}>
+ <div className={`public-tag public-tag-red`}>{x.taskTagDesc}</div>
+ <div className="taskModal-item-title">{x.serveObjName}</div>
+ </Space>
+ </div>
+ <div className="taskModal-item-subtitle">任务下达时间：{dateFormat(x.createTime)}</div>
+ <div className="taskModal-item-subtitle">{x.eventContent}</div>
+ <div className="taskModal-item-tag">
+ <Space wrap>
+ <div className="public-tag2">{x.eventTypeDesc}</div>
+ {beOverdue(x.expireTime) && <div className="public-tag2 public-tag2-red">已过期</div>}
+ </Space>
+ </div>
+ </div>
+ ))}
+ </div>
+ }
+ isAction={false}
+ />
+ <TaskHandle02
+ visible={taskModal.visible}
+ taskId={taskModal.taskId}
+ eventType={taskModal.eventType}
+ eventTypeDesc={taskModal.eventTypeDesc}
+ data={taskModal}
+ onClose={() => setTaskModal({ visible: false })}
+ onReturnCallback={onReturnCallback}
+ onSubmitCallback={onClose}
+ />
+ </>
+ );
+};
+
+export default TaskModalContent;
diff --git a/src/components/TaskModalContent/index.less b/src/components/TaskModalContent/index.less
new file mode 100644
index 0000000..0023ec9
--- /dev/null
+++ b/src/components/TaskModalContent/index.less
@@ -0,0 +1,42 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.taskModal {
+ height: 100%;
+ overflow-y: auto;
+
+ &-item {
+ position: relative;
+ padding: 16px;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 16px;
+ right: 16px;
+ height: 1px;
+ background-color: @common_line_light_color;
+ }
+
+ &-title {
+ font-weight: 600;
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ margin-top: 4px;
+ }
+
+ &-tag {
+ margin-top: 4px;
+ }
+
+ &-last {
+ &::after {
+ content: '';
+ height: 0;
+ }
+ }
+ }
+}
diff --git a/src/components/UploadFile/index.jsx b/src/components/UploadFile/index.jsx
new file mode 100644
index 0000000..743ea24
--- /dev/null
+++ b/src/components/UploadFile/index.jsx
@@ -0,0 +1,117 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 18:58:01
+ * @LastEditTime: 2024-12-04 11:12:44
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 文件上传
+ */
+import React, { useRef } from 'react';
+import { ax, showToast } from '../../utils/utility';
+
+function uploadFileApi(submitData, ownerId, ownerType) {
+ return ax.request({ url: `attachment/uploadFile?ownerId=${ownerId}&ownerType=${ownerType}`, type: 'post', data: submitData, service: 'ninex' });
+}
+
+// ocr身份证识别
+function OCRFileApi(submitData) {
+ return ax.request({ url: `ocrIdcard`, type: 'post', data: submitData, service: 'ocr' });
+}
+
+const UploadFile = ({ children, ownerId, ownerType, OCRshow, accept = 'image/*', capture, maxCount = 9, onSuccessCallback, disabled = false }) => {
+ const fileRef = useRef();
+
+ let _maxCount = OCRshow ? 1 : parseInt(maxCount);
+
+ // 文件上传
+ function handleUploadFile(e) {
+ let files = e.target.files;
+ if (files.length > _maxCount) {
+ showToast({ content: `只可同时上传${_maxCount}个文件` });
+ return;
+ }
+ if (_maxCount === 1) {
+ let file = e.target.files[0] || {};
+ let formdata = new FormData();
+ formdata.append('files', file);
+ uploadFile(formdata);
+ } else {
+ let submit = [];
+ for (let i = 0; i < files.length; i++) {
+ let formdata = new FormData();
+ formdata.append('files', files[i]);
+ submit.push(formdata);
+ }
+ uploadFiles(submit);
+ }
+ }
+
+ function onPreview(params) {
+ console.log(params);
+ }
+
+ // 点击上传
+ function handleClickUpload() {
+ fileRef.current.click();
+ }
+
+ // 上传文件
+ async function uploadFile(submitData) {
+ global.setSpinning(true);
+ const res = OCRshow ? await OCRFileApi(submitData) : await uploadFileApi(submitData, ownerId, ownerType);
+ global.setSpinning(false);
+ if (res.type) {
+ showToast({ type: 'success', content: OCRshow ? '识别成功' : '上传成功' });
+ onSuccessCallback && onSuccessCallback(res.data);
+
+ }
+ // fileRef.current.value = '';
+ }
+
+ // 多个文件上传
+ async function uploadFiles(submitData) {
+ global.setSpinning(true);
+ let apiArr = submitData.map((x) => uploadFileApi(x, ownerId, ownerType));
+ ax.ax.all(apiArr).then(
+ ax.ax.spread(function (...res) {
+ global.setSpinning(false);
+ let successNum = 0,
+ failNum = 0,
+ resData = [];
+ res.forEach((x) => {
+ if (x.type) {
+ successNum = successNum + 1;
+ resData.push(x.data[0]);
+ } else {
+ failNum = failNum + 1;
+ }
+ });
+ showToast({ content: `上传成功${successNum},失败${failNum}` });
+ onSuccessCallback && onSuccessCallback(resData);
+ })
+ );
+ fileRef.current.value = '';
+ }
+
+ return (
+ <>
+ <input
+ type="file"
+ name="file"
+ disabled={disabled}
+ ref={fileRef}
+ accept="image/gif,image/jpeg"
+ capture={capture}
+ onChange={handleUploadFile}
+ onPreview={onPreview}
+ style={{ display: 'none' }}
+ multiple={_maxCount > 1 ? true : false}
+
+ />
+ <div onClick={handleClickUpload}>{children}</div>
+ </>
+ );
+};
+
+export default UploadFile;
diff --git a/src/components/UploadFile/index.less b/src/components/UploadFile/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/UploadFile/index.less
diff --git a/src/components/UserTag/index.jsx b/src/components/UserTag/index.jsx
new file mode 100644
index 0000000..6c4549b
--- /dev/null
+++ b/src/components/UserTag/index.jsx
@@ -0,0 +1,105 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-07-11 14:19:03
+ * @LastEditTime: 2025-04-10 17:09:55
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 展示人员的tag和底部抽屉人员详情
+ */
+import React, { useEffect, useState } from 'react';
+import { CloseOutlined } from 'dd-icons';
+import { Drawer } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import './index.less';
+
+import * as $$ from '../../utils/utility';
+
+// 获取数据
+function getDataApi(submitData) {
+ return $$.ax.request({ url: `ctUser/getByIdRole?id=${submitData}`, type: 'get', service: 'cust' });
+}
+
+const UserTag = ({ name, value, onClose, color = 'green', viewBtn = true }) => {
+ const [data, setData] = useState({});
+ const [visible, setVisible] = useState(false);
+
+ // 获取数据
+ async function getData() {
+ if (!value) return;
+ global.setSpinning(true);
+ const res = await getDataApi(value);
+ global.setSpinning(false);
+ if (res.type) {
+ setData(res.data || {});
+ setVisible(true);
+ }
+ }
+
+ const handleView = () => {
+ getData();
+ };
+
+ const handleClose = () => {
+ setVisible(false);
+ };
+
+ return (
+ <div>
+ <div className="UserTag">
+ <span className="UserTag-name">{name}</span>
+ {/* 查看 */}
+ {viewBtn && (
+ <div style={{ margin: '0 4px 0 2px' }} onClick={handleView} className="public-color">
+ 查看
+ </div>
+ )}
+ <CloseOutlined className="UserTag-close" onClick={onClose} />
+ </div>
+
+ <Drawer visible={visible} onClose={handleClose} position="bottom" className="user-detail-drawer">
+ <div className="user-detail">
+ <div className="user-detail-title">查看经办人</div>
+ <Scrollbars style={{ height: '45vh' }}>
+ <div className="user-detail-item">
+ <div className="user-detail-label">姓名</div>
+ <div className="user-detail-value">{data.trueName || '-'}</div>
+ </div>
+
+ <div className="user-detail-item">
+ <div className="user-detail-label">所属部门</div>
+ <div className="user-detail-value">{data.unitName || '-'}</div>
+ </div>
+
+ <div className="user-detail-item">
+ <div className="user-detail-label">职务</div>
+ <div className="user-detail-value">{data.userRoles || '-'}</div>
+ </div>
+
+ <div className="user-detail-item">
+ <div className="user-detail-label">手机号码</div>
+ <div className="user-detail-value">{data.mobile || '-'}</div>
+ </div>
+
+ <div className="user-detail-item">
+ <div className="user-detail-label">工作电话</div>
+ <div className="user-detail-value">{'-'}</div>
+ </div>
+
+ <div className="user-detail-item">
+ <div className="user-detail-label">登录账号</div>
+ <div className="user-detail-value">{data.acc}</div>
+ </div>
+ </Scrollbars>
+ <div className="user-detail-footer">
+ <div className="user-detail-btn" onClick={handleClose}>
+ 关闭
+ </div>
+ </div>
+ </div>
+ </Drawer>
+ </div>
+ );
+};
+
+export default UserTag;
diff --git a/src/components/UserTag/index.less b/src/components/UserTag/index.less
new file mode 100644
index 0000000..1d39ca2
--- /dev/null
+++ b/src/components/UserTag/index.less
@@ -0,0 +1,81 @@
+.UserTag {
+ display: inline-flex;
+ align-items: center;
+ padding: 0 8px;
+ height: 36px;
+ background: #f2f2f6;
+ border-radius: 4px;
+ margin-top: 8px;
+ font-size: 14px;
+ &-name {
+ font-size: 14px;
+ color: #333;
+ margin-right: 4px;
+ }
+
+ &-close {
+ color: #999;
+ }
+}
+
+.user-detail {
+ padding: 16px;
+ background: #fff;
+ border-radius: 8px 8px 0 0;
+
+ &-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 12px;
+ text-align: left;
+ position: relative;
+ padding-bottom: 12px;
+
+ &::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ height: 1px;
+ background: #F2F2F2;
+ }
+ }
+
+ &-item {
+ margin-bottom: 16px;
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 8px;
+ }
+
+ &-value {
+ font-size: 15px;
+ color: #333;
+ }
+
+ &-footer {
+ margin-top: 32px;
+ }
+
+ &-btn {
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ background: #1A6FB8;
+ border-radius: 8px;
+ color: #fff;
+ font-size: 16px;
+ }
+}
+
+// 修改抽屉样式
+:global {
+ .dtm-drawer {
+ border-radius: 8px 8px 0 0;
+ }
+}
diff --git a/src/components/WorkStatisticsTabs/index.jsx b/src/components/WorkStatisticsTabs/index.jsx
new file mode 100644
index 0000000..b7bcb47
--- /dev/null
+++ b/src/components/WorkStatisticsTabs/index.jsx
@@ -0,0 +1,91 @@
+import React from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import qs from 'qs';
+import * as $$ from '../../utils/utility';
+import './index.less';
+
+export function getCurrentTabKeyByLocation(location) {
+ const query = qs.parse(location.search, { ignoreQueryPrefix: true });
+ const userInfo = $$.getSessionStorage('customerSystemUser');
+ if (location.pathname === '/gzdyh/areaStatistics') return '区域工作统计';
+ if (location.pathname === '/gzdyh/workStatistics') {
+ if (query.type === '2') return '部门工作统计';
+ return userInfo?.trueName ? `${userInfo.trueName}工作统计` : '个人工作统计';
+ }
+ return '';
+}
+
+
+export function getCurrentTabKeyByLocation1(location) {
+ const query = qs.parse(location.search, { ignoreQueryPrefix: true });
+ const userInfo = $$.getSessionStorage('customerSystemUser');
+ if (location.pathname === '/gzdyh/areaStatistics') return '区域工作统计';
+ if (location.pathname === '/gzdyh/workStatistics') {
+ if (query.type === '2') return '部门工作统计';
+ return '个人工作统计';
+ }
+ return '';
+}
+
+const WorkStatisticsTabs = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const query = qs.parse(location.search, { ignoreQueryPrefix: true });
+ const userInfo = $$.getSessionStorage('customerSystemUser');
+ const isAdmin = userInfo?.ctUseroleList?.some(item => item.roleCode === '22_00024-2' || item.roleCode === '22_00024-3');
+
+ if (!isAdmin) {
+ return null;
+ }
+
+ const tabs = [
+ {
+ label: '个人工作统计',
+ path: '/gzdyh/workStatistics',
+ workType: '1',
+ isArea: false
+ },
+ {
+ label: '部门工作统计',
+ path: '/gzdyh/workStatistics',
+ workType: '2',
+ isArea: false
+ },
+ {
+ label: '区域工作统计',
+ path: '/gzdyh/areaStatistics',
+ workType: '',
+ isArea: true
+ }
+ ];
+
+ const currentTabKey = getCurrentTabKeyByLocation1(location);
+
+ const handleTabClick = (tab) => {
+ if (tab.isArea) {
+ if (location.pathname !== tab.path) {
+ history.push(tab.path);
+ }
+ } else {
+ if (query.type !== tab.workType || location.pathname !== tab.path) {
+ history.push(`${tab.path}?type=${tab.workType}`);
+ }
+ }
+ };
+
+ return (
+ <div className="work-statistics-tabs">
+ {tabs.map((tab) => (
+ <div
+ key={tab.label}
+ className={`work-statistics-tab${currentTabKey == tab.label ? ' work-statistics-tab-active' : ''}`}
+ onClick={() => handleTabClick(tab)}
+ >
+ {tab.label}
+ </div>
+ ))}
+ </div>
+ );
+};
+
+export default WorkStatisticsTabs;
\ No newline at end of file
diff --git a/src/components/WorkStatisticsTabs/index.less b/src/components/WorkStatisticsTabs/index.less
new file mode 100644
index 0000000..e1d129c
--- /dev/null
+++ b/src/components/WorkStatisticsTabs/index.less
@@ -0,0 +1,43 @@
+.work-statistics-tabs {
+ display: flex;
+ background-color: #fff;
+ border-bottom: 1px solid #e5e6eb;
+ height: 44px;
+ align-items: center;
+ justify-content: flex-start;
+ padding: 0 0 0 0;
+}
+
+.work-statistics-tab {
+ flex: 1;
+ text-align: center;
+ font-size: 16px;
+ color: #666;
+ height: 44px;
+ line-height: 44px;
+ background: #fff;
+ border: none;
+ border-radius: 0;
+ position: relative;
+ cursor: pointer;
+ font-weight: 400;
+ transition: color 0.2s;
+}
+
+.work-statistics-tab-active {
+ color: #1A6FB8;
+ font-weight: 500;
+}
+
+.work-statistics-tab-active::after {
+ content: '';
+ display: block;
+ position: absolute;
+ left: 50%;
+ bottom: 0;
+ width: 40px;
+ height: 3px;
+ background: #1A6FB8;
+ border-radius: 2px;
+ transform: translateX(-50%);
+}
\ No newline at end of file
diff --git a/src/components/analysis/List.jsx b/src/components/analysis/List.jsx
new file mode 100644
index 0000000..51ab938
--- /dev/null
+++ b/src/components/analysis/List.jsx
@@ -0,0 +1,105 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-03-31 10:59:35
+ * @LastEditTime: 2023-04-01 14:35:01
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import { DownArrow2Outlined } from "dd-icons";
+import MyList from '../MyList';
+import './index.less';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import { CaretUpOutlined, CaretDownOutlined } from '../../assets/icon';
+import routerStatus from '../../status/router';
+
+const AnalysisList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getAnalysis }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ console.log('加载更多数据');
+ getAnalysis({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 楼栋更新
+ useEffect(() => {
+ if (routerStatus.spinPage['analysis']) {
+ getAnalysis({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('analysis');
+ routerStatus.clearSpinPage('analysis');
+ }
+ }, [routerStatus.spinPage['analysis']]);
+
+ return (
+ <>
+ <div className='analysis-List-head'>
+ <div className='analysis-List-head-col1'>序</div>
+ <div style={{ width: '50px', padding: '4px' }}>辖区</div>
+ <div className='analysis-List-head-col2' style={{ display: 'flex', alignItems: 'center' }}>
+ <span className='analysis-List-head-orange'>人口</span>
+ <div className='analysis-List-flex'>
+ <img className='analysis-List-head-img1' src={CaretUpOutlined} alt="" />
+ <img className='analysis-List-head-img2' src={CaretDownOutlined} alt="" />
+ </div>
+ </div>
+ <div className='analysis-List-head-col2' style={{ display: 'flex', alignItems: 'center' }}>
+ <span>户数</span>
+ <div className='analysis-List-flex'>
+ <img className='analysis-List-head-img1' src={CaretUpOutlined} alt="" />
+ <img className='analysis-List-head-img2' src={CaretDownOutlined} alt="" />
+ </div></div>
+ <div className='analysis-List-head-col2' style={{ display: 'flex', alignItems: 'center' }}>
+ <span className='analysis-List-head-blue'>楼栋</span>
+ <div className='analysis-List-flex'>
+ <img className='analysis-List-head-img1' src={CaretUpOutlined} alt="" />
+ <img className='analysis-List-head-img2' src={CaretDownOutlined} alt="" />
+ </div>
+ </div>
+ <div className='analysis-List-head-col2' style={{ display: 'flex', alignItems: 'center' }}>
+ <span>房间</span>
+ <div className='analysis-List-flex'>
+ <img className='analysis-List-head-img1' src={CaretUpOutlined} alt="" />
+ <img className='analysis-List-head-img2' src={CaretDownOutlined} alt="" />
+ </div>
+ </div>
+ </div>
+ {data.map((item, index) => {
+ return (
+ <div key={`analy${index}`} className='analysis-List-item' style={{ backgroundColor: index % 2 ? 'rgba(230, 228, 234, 0.64)' : '#fff' }}>
+ <div className='analysis-List-item-col1'>{index + 1}</div>
+ <div style={{ width: '50px', padding: '4px' }}>{'美兰区'}</div>
+ <div className='analysis-List-item-col2'>
+ <div className='analysis-List-head-orange analysis-List-head-small-size' style={{ paddingBottom: '2px' }}>694247</div>
+ <div className='analysis-List-head-small-size'>当日<span className='analysis-List-head-orange'>+883</span></div>
+ </div>
+ <div className='analysis-List-item-col2'>
+ <div className='analysis-List-head-small-size' style={{ paddingBottom: '2px' }}>694247</div>
+ <div className='analysis-List-head-small-size'>当日+883</div>
+ </div>
+ <div className='analysis-List-item-col2'>
+ <div className='analysis-List-head-blue analysis-List-head-small-size' style={{ paddingBottom: '2px' }}>694247</div>
+ <div className='analysis-List-head-small-size'>当日<span className='analysis-List-head-blue'>+883</span></div>
+ </div>
+ <div className='analysis-List-item-col2'>
+ <div className='analysis-List-head-small-size' style={{ paddingBottom: '2px' }}>694247</div>
+ <div className='analysis-List-head-small-size'>当日+883</div>
+ </div>
+ </div>
+ );
+ })}
+ {
+ hasMore &&
+ <div className='analysis-List-item-more' onClick={handleLoadMore}>
+ <span>展开更多数据 <DownArrow2Outlined /></span>
+ </div>
+ }
+ </>
+ )
+}
+
+export default AnalysisList
\ No newline at end of file
diff --git a/src/components/analysis/PieChart.jsx b/src/components/analysis/PieChart.jsx
new file mode 100644
index 0000000..604c0b3
--- /dev/null
+++ b/src/components/analysis/PieChart.jsx
@@ -0,0 +1,72 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-04-01 14:42:46
+ * @LastEditTime: 2023-04-01 16:43:21
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useEffect, useMemo, useState, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space, Swiper, Toast } from 'dingtalk-design-mobile';
+import { AnnouncementOutlined, RightArrow2Outlined } from 'dd-icons';
+import { Canvas, Chart, Interval } from '@antv/f2';
+
+
+
+// 统计图表
+const ChartDom = ({ data }) => {
+ const newdata = [{ name: '0-6岁', color: '#A3DDFF', value: 13, center: '1', percent: 0.2 },
+ { name: '7-15岁', color: '#52B4FF', value: 13, center: '1', percent: 0.1 },
+ { name: '16-59岁', color: '#007FFF', value: 13, center: '1', percent: 0.1 },
+ { name: '60-79岁', color: '#004DB3', value: 13, center: '1', percent: 0.1 },
+ { name: '80岁+', color: '#002566', value: 13, center: '1', percent: 0.5 }]
+
+ // const countActive = useMemo(() => {
+ // let color = ['#6665FF', '#F57F20', '#77DA82'];
+ // let obj = data.countData ? data.countData[tabActive.count].data : {};
+ // let num = 0;
+ // let count = 0;
+ // obj.annular?.forEach((x) => (count += x.value));
+ // obj.annular?.forEach((x, t) => {
+ // let percent = Number((x.value / count).toFixed(2));
+ // x.color = color[t];
+ // x.center = '1';
+ // x.percent = t === obj.annular.length - 1 ? 1 - num : percent;
+ // num = num + percent;
+ // });
+ // return obj;
+ // });
+
+ useEffect(() => {
+ const context = document.getElementById('myChart').getContext('2d');
+ const { props } = (
+ <Canvas context={context} pixelRatio={window.devicePixelRatio}>
+ <Chart data={newdata} coord={{ radius: 1, innerRadius: 0.7, transposed: true, type: 'polar' }}>
+ <Interval
+ x="center"
+ y="percent"
+ adjust="stack"
+ color={{
+ field: 'color',
+ callback: (value) => value,
+ }}
+ selection={{
+ selectedStyle: (record) => {
+ const { yMax, yMin } = record;
+ return { r: (yMax - yMin) * 1.1 };
+ },
+ }}
+ />
+ </Chart>
+ </Canvas>
+ );
+ const chart = new Canvas(props);
+ chart.render();
+ }, [data]);
+
+ return <canvas id="myChart" width="200" height="200"></canvas>;
+};
+
+export default ChartDom;
\ No newline at end of file
diff --git a/src/components/analysis/index.less b/src/components/analysis/index.less
new file mode 100644
index 0000000..ba33d5e
--- /dev/null
+++ b/src/components/analysis/index.less
@@ -0,0 +1,69 @@
+.analysis-List {
+ &-head {
+ margin-top: 12px;
+ display: flex;
+ padding: 0 2px;
+ justify-content: space-between;
+ background-color: rgba(230, 228, 234, 0.64);
+ &-col1 {
+ width: 22px;
+ padding: 4px;
+ }
+ &-col2 {
+ flex: 2;
+ padding: 4px;
+ }
+ &-orange {
+ color: #ff5b1f;
+ }
+ &-blue {
+ color: #007fff;
+ }
+ &-img1 {
+ top: 0;
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ }
+ &-img2 {
+ bottom: 0;
+ width: 8px;
+ height: 8px;
+ position: absolute;
+ }
+ &-small-size {
+ font-size: 12px;
+ line-height: 20px;
+ }
+ }
+
+ &-flex {
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ height: 12px;
+ width: 8px;
+ }
+
+ &-item {
+ display: flex;
+ padding: 0 2px;
+ align-items: center;
+ &-col1 {
+ width: 22px;
+ padding: 4px;
+ }
+ &-col2 {
+ flex: 2;
+ padding: 6px 4px;
+ }
+ &-more {
+ margin-top: 8px;
+ background-color: rgba(230, 228, 234, 0.64);
+ padding: 6px;
+ text-align: center;
+ color: rgba(23, 26, 29, 0.85);
+ border-radius: 2px;
+ }
+ }
+}
diff --git a/src/components/building/List.jsx b/src/components/building/List.jsx
new file mode 100644
index 0000000..d109d05
--- /dev/null
+++ b/src/components/building/List.jsx
@@ -0,0 +1,81 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 16:35:20
+ * @LastEditTime: 2023-06-10 21:27:08
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 楼栋列表 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const BuildingList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getBuildingData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getBuildingData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 楼栋更新
+ useEffect(() => {
+ if (routerStatus.spinPage['building']) {
+ getBuildingData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('building');
+ routerStatus.clearSpinPage('building');
+ }
+ }, [routerStatus.spinPage['building']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ key={'building' + index}
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztGrid/room?id=${item.id}&address=${item.address}&gridCode=${item.gridCode}`)}
+ >
+ <div className="building-card">
+ <div className="building-title">
+ {item.taskTagList?.map((x, t) => (
+ <span key={t} className={`public-tag public-tag-${x === '21_00016-1' ? 'blue' : x === '21_00016-2' ? 'red' : 'green'}`}>
+ {x === '21_00016-1' ? '待排查' : x === '21_00016-2' ? '待核实' : '地址未同步'}
+ </span>
+ ))}
+ <span>{searchValue ? searchTitle(item.address, searchValue) : item.address}</span>
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.floorcount || 0}层</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.roomcount || 0}房间</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.personcount || 0}人口</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.updateTime ? `${dateFormat(item.updateTime)}更新` : '-'}</div>
+ </div>
+ <Space>
+ {getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
+ <div className="public-tag2">{item.communityName + item.gridNum}</div>
+ </Space>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default BuildingList;
diff --git a/src/components/building/StandardAddresList.jsx b/src/components/building/StandardAddresList.jsx
new file mode 100644
index 0000000..ecf5274
--- /dev/null
+++ b/src/components/building/StandardAddresList.jsx
@@ -0,0 +1,311 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 16:35:20
+ * @LastEditTime: 2023-05-04 17:58:07
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 楼栋列表 - 列表组件
+ */
+import React, { useEffect, useState } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space, WingBlank } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { UpArrowOutlined } from 'dd-icons';
+import { ax, dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import { building_1, building_2, building_5, building_6, addressBlack } from '../../assets/img';
+import routerStatus from '../../status/router';
+import ModalLContent from '../../components/ModalLContent';
+import './index.less';
+
+// 标准地名地址数据
+function getStandardAddressApi(submitData) {
+ return ax.request({ url: 'buildingInfo/dmBuidinfoList', type: 'get', data: submitData, service: 'reside' });
+}
+
+// 小区信息
+function getVillageDataApi(submitData) {
+ return ax.request({ url: 'lhDm/getLhDmInfo', type: 'get', data: submitData, service: 'opus' });
+}
+
+const StandardAddresList = ({ search, tabs, data, hasMore, getScrollTopKey, scrollTop, searchValue, standardAddressData }) => {
+ const history = useHistory();
+
+ const [showData, setShowData] = useState({});
+
+ // 小区下面折叠的劳动列表
+ const [buildingList, setBuildingList] = useState({});
+
+ // 小区信息
+ const [villageData, setVillageData] = useState({ data: {}, visible: false });
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ standardAddressData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 获取标准地名地址下的楼栋
+ async function getStandardAddressData(submitData, id) {
+ global.setSpinning(true);
+ const res = await getStandardAddressApi(submitData);
+ global.setSpinning(false);
+ if (res.type) {
+ let list = [].concat(res.data || []);
+ setBuildingList({ ...buildingList, [id]: list });
+ }
+ }
+
+ // 获取小区信息
+ async function modalData(id) {
+ global.setSpinning(true);
+ const res = await getVillageDataApi({ dmAUid: id });
+ global.setSpinning(false);
+ if (res.type) {
+ let data = res.data || {};
+ console.log('data', data);
+ setVillageData({ data, visible: true });
+ }
+ }
+
+ // 楼栋更新
+ useEffect(() => {
+ if (routerStatus.spinPage['building']) {
+ setShowData({});
+ standardAddressData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('building');
+ routerStatus.clearSpinPage('building');
+ }
+ }, [routerStatus.spinPage['building']]);
+
+ // 小区列表包含楼栋列表
+ function dom1(item, index) {
+ return (
+ <div style={{ backgroundColor: '#ffffff', borderRadius: '5px' }}>
+ <div
+ className={"building-card-bottom" + (showData[item.id] ? ' StandardAddresList-active' : '')}
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => {
+ setShowData({ ...showData, [item.id]: showData[item.id] ? false : true });
+ let s = { ...search };
+ delete s.page;
+ delete s.size;
+ getStandardAddressData({ ...s, dmAUidHk: item.dmAUidHk }, item.id);
+ }}
+ >
+ <div className="building-card">
+ <div className='StandardAddresList-flex'>
+ <div className="public_body_text_style_bold StandardAddresList-title">
+ <span className='StandardAddresList-rusticate'>小区</span>
+ <span>{searchValue ? searchTitle(item.dmAUidHkName, searchValue) : item.dmAUidHkName}</span>
+ </div>
+ <div className='StandardAddresList-flex-r'>
+ <img className='StandardAddresList-flex-r-img' src={!showData[item.id] ? building_1 : building_2} alt="" />
+ </div>
+ </div>
+ <div className="StandardAddresList-address">
+ <div className="StandardAddresList-address-img">
+ <img className="StandardAddresList-address-img_1" src={addressBlack} alt="" />
+ </div>
+ <span>{item.address}</span>
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.buildNum || 0}楼栋</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.roomcount || 0}房间</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.personcount || 0}人口</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.updateTime ? `${dateFormat(item.updateTime)}更新` : '-'}</div>
+ </div>
+ <Space>
+ {getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
+ <div className="public-tag2">{item.communityName + item.gridNum}</div>
+ </Space>
+ </div>
+ </div>
+ {
+ showData[item.id] && buildingList[item.id] &&
+ <div className='StandardAddresList-top-flex' >
+ <Space style={{ '--gap': '24px' }}>
+ <div className='StandardAddresList-top-flex-1' onClick={() => modalData(item.dmAUidHk)}>
+ <div className='StandardAddresList-top-flex-img'>
+ <img src={building_5} alt="" />
+ </div>
+ <div className='building-tip-title'>小区信息</div>
+ </div>
+ <div className='StandardAddresList-top-flex-1'>
+ <div className='StandardAddresList-top-flex-img'>
+ <img src={building_6} alt="" />
+ </div>
+ <div className='building-tip-title' onClick={() => { history.push(`/hztGrid/building/form?gridCode=${search.gridCode}&dmAUid=${item.dmAUidHk}&dmAUidHkName=${item.dmAUidHkName}`); }}>添加楼栋</div>
+ </div>
+ </Space>
+ </div>
+ }
+ {
+ showData[item.id] && buildingList[item.id]?.map((item, index) => (
+ <div
+ // className="building-card-bottom"
+ key={index}
+ style={index === 0 ? { marginTop: '2px', padding: '8px' } : { borderTop: '0.5px solid rgba(126,134,142,0.16)', padding: '8px 0', margin: '0 8px' }}
+ onClick={() => history.push(`/hztGrid/room?id=${item.id}&address=${item.address}&gridCode=${item.gridCode}`)}
+ >
+ <div>
+ <div className="building-title">
+ <span>{searchValue ? searchTitle(item.address, searchValue) : item.address}</span>
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.roomcount || 0}房间</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.personcount || 0}人口</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.updateTime ? `${dateFormat(item.updateTime)}更新` : '-'}</div>
+ </div>
+ <Space >
+ {getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
+ <div className="public-tag2">{item.communityName + item.gridNum}</div>
+ </Space>
+ </div>
+ </div>
+ ))
+ }
+ {
+ showData[item.id] && buildingList[item.id] &&
+ < div onClick={() => {
+ setShowData({ ...showData, [item.id]: showData[item.id] ? false : true });
+ let s = { ...search };
+ delete s.page;
+ delete s.size;
+ getStandardAddressData({ ...s, dmAUidHk: item.dmAUidHk }, item.id);
+ }} className='StandardAddresList-bottom-l' >折叠该小区的全部楼栋 <UpArrowOutlined /></div>
+ }
+ <ModalLContent
+ visible={villageData.visible}
+ height={'88%'}
+ centerMaxHeight={'540px'}
+ headStyle={{ textAlign: 'center' }}
+ title={"小区信息"}
+ zIndex={990}
+ onOk={false}
+ top={'80px'}
+ footBackground={false}
+ visibleOnClick={(type, visible) => setVillageData({ ...villageData, visible: false })}
+ buttonTitle='我知道了'
+ content={
+ <div className='StandardAddresList-form-head' style={{ backgroundColor: '#f2f2f2' }}>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">类型</div>
+ <div className="StandardAddresList-form-head-col-bottom">{villageData.data.typeName || '-'}</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">小区名称</div>
+ <div className="StandardAddresList-form-head-col-bottom">{villageData.data?.lhDmAName || '-'}</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">小区地址</div>
+ <div className="StandardAddresList-form-head-col-bottom">{villageData.data.address || '-'}</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">物业公司名称</div>
+ <div className="StandardAddresList-form-head-col-bottom">{villageData.data.wygsmc || '-'}</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">物业联系人</div>
+ <div className="StandardAddresList-form-head-col-bottom">{villageData.data.contact || '-'}</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">楼栋总数</div>
+ <div className="StandardAddresList-form-head-col-bottom">{item.buildNum || 0}楼栋</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">房间总数</div>
+ <div className="StandardAddresList-form-head-col-bottom">{item.roomcount || 0}房间</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">分户总数</div>
+ <div className="StandardAddresList-form-head-col-bottom">{item.familyCount || 0}分户</div>
+ </div>
+ </div>
+ <div className="StandardAddresList-form-head-row">
+ <div className="StandardAddresList-form-head-col">
+ <div className="StandardAddresList-form-head-col-top">人口总数</div>
+ <div className="StandardAddresList-form-head-col-bottom">{item.personcount || 0}人口</div>
+ </div>
+ </div>
+ </div>
+ } />
+ </div >
+ )
+ }
+
+ // 纯楼栋列表
+ function dom2(item, index) {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztGrid/room?id=${item.id}&address=${item.address}&gridCode=${item.gridCode}`)}
+ >
+ <div className="building-card">
+ <div className="building-title">
+ {item.taskTagList?.map((x, t) => (
+ <span key={t} className={`public-tag public-tag-${x === '21_00016-1' ? 'blue' : x === '21_00016-2' ? 'red' : 'green'}`}>
+ {x === '21_00016-1' ? '待排查' : x === '21_00016-2' ? '待核实' : '地址未同步'}
+ </span>
+ ))}
+ <span>{searchValue ? searchTitle(item.address, searchValue) : item.address}</span>
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.roomcount || 0}房间</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.personcount || 0}人口</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.updateTime ? `${dateFormat(item.updateTime)}更新` : '-'}</div>
+ </div>
+ <Space>
+ {getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
+ <div className="public-tag2">{item.communityName + item.gridNum}</div>
+ </Space>
+ </div>
+ </div>
+ )
+ }
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ item.isDm ? dom1(item, index) : dom2(item, index)
+ );
+ }}
+ />
+ );
+};
+
+export default StandardAddresList;
diff --git a/src/components/building/index.less b/src/components/building/index.less
new file mode 100644
index 0000000..024b812
--- /dev/null
+++ b/src/components/building/index.less
@@ -0,0 +1,104 @@
+.StandardAddresList {
+ &-rusticate {
+ font-family: 'DingTalkRegular';
+ color: #ff713d;
+ font-weight: 400;
+ }
+ &-title {
+ flex: 1;
+ }
+ &-flex {
+ margin-bottom: 4px;
+ display: flex;
+ justify-content: space-between;
+ &-r {
+ width: 14px;
+ height: 22px;
+ display: flex;
+ align-items: center;
+ &-img {
+ width: 100%;
+ height: 14px;
+ }
+ }
+ }
+ &-address {
+ font-size: 12px;
+ line-height: 20px;
+ color: rgba(23, 26, 29, 0.85);
+ display: flex;
+ &-img {
+ width: 14px;
+ height: 20px;
+ margin-right: 4px;
+ display: flex;
+ align-items: center;
+ &_1 {
+ width: 14px;
+ height: 14px;
+ }
+ }
+ }
+
+ &-active {
+ box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.08);
+ border-radius: 5px;
+ }
+ &-bottom-l {
+ font-size: 12px;
+ line-height: 20px;
+ padding: 8px 0;
+ margin: 0 8px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: rgba(23, 26, 29, 0.6);
+ border-top: 0.5px solid rgba(126, 134, 142, 0.16);
+ }
+
+ &-top {
+ &-flex {
+ display: flex;
+ justify-content: center;
+ padding: 8px 0;
+ margin: 0 8px;
+ border-bottom: 0.5px solid rgba(126, 134, 142, 0.16);
+ &-1 {
+ display: flex;
+ }
+ &-img {
+ width: 12px;
+ height: 20px;
+ display: flex;
+ align-items: center;
+ font-size: 12px;
+ margin-right: 4px;
+ & img {
+ width: 12px;
+ height: 12px;
+ }
+ }
+ }
+ }
+
+ &-form-head {
+ background-color: #f2f2f2;
+ border-radius: 10px;
+ padding: 12px 16px;
+ margin: 0 12px;
+ &-row {
+ display: flex;
+ padding-bottom: 4px;
+ }
+ &-col {
+ flex: 1 1;
+ &-top {
+ color: rgba(0, 0, 0, 0.5);
+ line-height: 22px;
+ }
+ &-bottom {
+ margin: 4px 0;
+ }
+ }
+ }
+}
diff --git a/src/components/cityData/index copy.jsx b/src/components/cityData/index copy.jsx
new file mode 100644
index 0000000..8ccf48b
--- /dev/null
+++ b/src/components/cityData/index copy.jsx
@@ -0,0 +1,96 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2023-10-30 09:41:38
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @LastEditTime: 2023-11-02 18:26:04
+ * @FilePath: \hztSsim\mobile\src\components\cityData\index.jsx
+ * @Description: 地区分块
+ */
+import React, { useState } from 'react';
+import { useHistory } from 'react-router-dom';
+
+
+
+
+const CityData = ({ cityData, jump = false, onClick }) => {
+ const history = useHistory();
+ const maxStreets = 6; return (
+
+ <div>
+ {cityData.cityId ? (
+ <>
+ <div className='search-searchBar-grid'>
+ <div>{cityData.cityName}</div>
+ <div>{cityData.population}</div>
+ </div>
+ {cityData.districts.map((district, districtIndex) => {
+ if (district.districtId && district.streets.some(street => street.streetId)) {
+ return (
+ <div className='search-searchBar-grid-box' key={districtIndex}>
+ <div className='search-searchBar-grid-box-title' onClick={() => onClick('1', district.streetId)}>
+ <div>{district.districtName}</div>
+ <div>{district.districtPopulation}</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ {district.streets.slice(0, maxStreets).map((street, streetIndex) => {
+ if (street.streetId) {
+ return (
+ <div className='search-searchBar-grid-box-value' key={streetIndex}>
+ <div onClick={() => onClick('2', district.streetId)}>
+ <div>{street.streetName}</div>
+ <div>{street.streetPopulation}</div>
+ </div>
+ </div>
+ );
+ }
+ return null;
+ })}
+ </div>
+ </div>
+ </div>
+ );
+ }
+ return null;
+ })}
+ </>
+ ) : (
+ <div>
+ {cityData.districts.map((district, districtIndex) => {
+ if (district.districtId && district.streets.some(street => street.streetId)) {
+ return (
+ <div className='search-searchBar-grid-box' key={districtIndex}>
+ <div className={'search-searchBar-grid-box-title'} onClick={() => history.push("/ssim/registeredPop/search")}>
+ <div>{district.districtName}</div>
+ <div>{district.districtPopulation}</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ {district.streets.map((street, streetIndex) => {
+ if (street.streetId) {
+ return (
+ <div className='search-searchBar-grid-box-value' key={streetIndex}>
+ <div>
+ <div>{street.streetName}</div>
+ <div>{street.streetPopulation}</div>
+ </div>
+ </div>
+ );
+ }
+ return null;
+ })}
+ </div>
+ </div>
+ </div>
+ );
+ }
+ return null;
+ })}
+ </div>
+ )}
+ </div>
+ )
+
+};
+
+export default CityData;
diff --git a/src/components/cityData/index.jsx b/src/components/cityData/index.jsx
new file mode 100644
index 0000000..b9c939a
--- /dev/null
+++ b/src/components/cityData/index.jsx
@@ -0,0 +1,232 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2023-10-30 09:41:38
+ * @LastEditors: lwh
+ * @LastEditTime: 2024-11-28 17:40:45
+ * @FilePath: \hztSsim\mobile\src\components\cityData\index.jsx
+ * @Description: 地区分块
+ */
+import React, { useEffect, useState } from 'react';
+import { Popover } from "dingtalk-design-mobile";
+import "./index.less";
+import { return_1 } from '../../assets/img';
+
+
+
+
+
+const CityData = ({ cityData, onClick, onClickPopList, upList, emptyToast }) => {
+
+ const [tooltipVisible, setTooltipVisible] = useState({})
+ const [visible, setVisible] = useState(false)
+ const handleVisibleChange = () => {
+ setVisible(visible);
+ };
+
+
+
+ function truncateText(text, maxLength) {
+ // if (text.length > maxLength) {
+ // return text.slice(0, maxLength) + '...';
+ // }
+ // return text;
+ };
+
+
+ return (
+ <div>
+ {cityData?.map((oneData, i) => (
+ <>
+ {oneData.areaName !== '海口市' &&
+ <div className='public-color' style={{ marginBottom: '16px', display: 'flex', alignItems: 'center' }} >
+ <img
+ style={{ width: '16px', height: '16px' }}
+ src={return_1}
+ alt=""
+ srcset=""
+ /><div onClick={() => { upList(oneData.areaCode) }}>上一级</div></div>
+ }
+ <div key={`one${i}`} className='search-searchBar-grid' onClick={() => { oneData.areaName !== '海口市' && onClick(oneData.areaCode, oneData.areaName, oneData.num) }}>
+ {/* <div style={{ textAlign: 'center' }}>{oneData.areaName}</div> */}
+ <div>{oneData.num !== 0 ? (
+ <Popover
+ dark
+ visible={tooltipVisible[`${oneData.areaName}`] || false}
+ onVisibleChange={(v) => { setTooltipVisible({ [`${oneData.areaName}`]: !tooltipVisible[`${oneData.areaName}`] }) }}
+ overlay={
+ <div style={{ display: 'flex' }}>
+ {/* <div onClick={() => {
+ onClick(oneData.areaCode)
+ setTooltipVisible({ [`${oneData.areaName}`]: false })
+ }}>进入</div> | */}
+ <div onClick={() => {
+ onClickPopList(oneData.areaName, oneData.areaCode);
+ setTooltipVisible({ [`${oneData.areaName}`]: false })
+ }}>查看</div>
+ </div>
+ }
+ placement="top"
+ >
+ <div onClick={() => { setTooltipVisible({ [`${oneData.areaName}`]: true }) }} className='search-searchBar-grid-box-title'>
+ <div style={{ paddingLeft: '5px' }}>{oneData.areaName}</div>
+ <div>{oneData.num || '-'}</div>
+ </div>
+ </Popover >
+ ) : (
+ <div onClick={() => { setTooltipVisible({ [`${oneData.areaName}`]: true }); emptyToast(oneData.num, oneData.areaName) }} className='search-searchBar-grid-box-title'>
+ <div style={{ paddingLeft: '5px' }}>{oneData.areaName}</div>
+ <div>{oneData.num || '-'}</div>
+ </div>
+ )
+ }</div>
+ </div>
+ {
+ oneData.areaName === '海口市' ?
+ <>
+ {
+ oneData.children?.map((twoData, idx) => (
+ <div key={`two${idx}`} className='search-searchBar-grid-box' >
+ {twoData.num !== 0 ? (
+ <Popover
+ dark
+ visible={tooltipVisible[`${twoData.areaName}`] || false}
+ onVisibleChange={(v) => { setTooltipVisible({ [`${twoData.areaName}`]: !tooltipVisible[`${twoData.areaName}`] }) }}
+ overlay={
+ <div style={{ display: 'flex' }}>
+ <div onClick={() => {
+ onClick(twoData.areaCode)
+ setTooltipVisible({ [`${twoData.areaName}`]: false })
+ }}>进入</div> |
+ <div onClick={() => {
+ onClickPopList(twoData.areaName, twoData.areaCode);
+ setTooltipVisible({ [`${twoData.areaName}`]: false })
+ }}>查看</div>
+ </div>
+ }
+ placement="top"
+ >
+ <div onClick={() => { setTooltipVisible({ [`${twoData.areaName}`]: true }) }} className='search-searchBar-grid-box-title'>
+ <div style={{ paddingLeft: '5px' }}>{twoData.areaName}</div>
+ <div>{twoData.num || '-'}</div>
+ </div>
+ </Popover >
+ ) : (
+ <div onClick={() => { setTooltipVisible({ [`${twoData.areaName}`]: true }); emptyToast(twoData.num, twoData.areaName) }} className='search-searchBar-grid-box-title'>
+ <div style={{ paddingLeft: '5px' }}>{twoData.areaName}</div>
+ <div>{twoData.num || '-'}</div>
+ </div>
+
+ )
+ }
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ {/* {oneData.children.slice(0, maxStreets).map((street, streetIndex) => { */}
+ {twoData.children?.map((threeData, index) => (
+
+ <div key={`three${index}`} className='search-searchBar-grid-box-value' >
+ {/* className='search-searchBar-grid-box-label' */}
+ {threeData.num !== 0 ? (
+ <Popover
+ dark
+ visible={tooltipVisible[`${threeData.areaName}`] || false}
+ onVisibleChange={(v) => { setTooltipVisible({ [`${threeData.areaName}`]: !tooltipVisible[`${threeData.areaName}`] }) }}
+ overlay={
+ <div style={{ display: 'flex' }}>
+ <div onClick={() => {
+ onClick(threeData.areaCode);
+ setTooltipVisible(false)
+ }}>进入</div> |
+ <div onClick={() => {
+ onClickPopList(threeData.areaName, threeData.areaCode);
+ setTooltipVisible(false)
+ }}>查看</div>
+ </div>
+ }
+ placement="topLeft"
+ >
+ <div onClick={() => { setTooltipVisible({ [`${threeData.areaName}`]: true }) }}>
+ <div style={{ width: '69px', textAlign: 'center', lineHeight: '22px' }}>{threeData.areaName}</div>
+ {/* <div className='search-searchBar-grid-box-label'>{truncateText(threeData.label, 4)}</div> */}
+ <div className='search-searchBar-grid-box-number'>{threeData.num || '-'}</div>
+ </div>
+ </Popover>
+
+ ) : (
+ <div onClick={() => { setTooltipVisible({ [`${threeData.areaName}`]: true }); emptyToast(threeData.num, threeData.areaName) }}>
+ <div style={{ width: '69px', textAlign: 'center', lineHeight: '22px' }}>{threeData.areaName}</div>
+ {/* <div className='search-searchBar-grid-box-label'>{truncateText(threeData.label, 4)}</div> */}
+ <div className='search-searchBar-grid-box-number'>{threeData.num || '-'}</div>
+ </div>
+
+ )}
+
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ ))
+ }
+ </> :
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', }} >
+ {
+ oneData.children?.map((twoData, idx) => (
+ <div key={`four${idx}`} >
+ {twoData.num !== 0 ? (
+ <Popover
+ dark
+ visible={tooltipVisible[`${twoData.areaName}`] || false}
+ onVisibleChange={(v) => { setTooltipVisible({ [`${twoData.areaName}`]: !tooltipVisible[`${twoData.areaName}`] }) }}
+ overlay={
+ <div style={{ display: 'flex' }}>
+ <div onClick={() => {
+ onClick(twoData.areaCode);
+ setTooltipVisible({ [`${twoData.areaName}`]: false })
+ }}>进入</div> |
+ <div onClick={() => {
+ onClickPopList(twoData.areaName, twoData.areaCode);
+ setTooltipVisible({ [`${twoData.areaName}`]: false })
+ }}>查看</div>
+ </div>
+ }
+ placement="top"
+ >
+ <div className='search-searchBar-grid-box-value' onClick={() => { setTooltipVisible({ [`${twoData.areaName}`]: true }) }} >
+ <div style={{ width: '69px', textAlign: 'center', lineHeight: '22px' }}>{twoData.areaName}</div>
+ <div className='search-searchBar-grid-box-number'>{twoData.num || '-'}</div>
+ </div>
+ </Popover >
+
+ ) : (
+ <div className='search-searchBar-grid-box-value' onClick={() => { setTooltipVisible({ [`${twoData.areaName}`]: true }); emptyToast(twoData.num, twoData.areaName) }} >
+ <div style={{ width: '69px', textAlign: 'center', lineHeight: '22px' }}>{twoData.areaName}</div>
+ <div className='search-searchBar-grid-box-number'>{twoData.num || '-'}</div>
+ </div>
+
+ )}
+
+ {/* {twoData.children?.map((threeData, index) => (
+ <div key={`three${index}`} className='search-searchBar-grid-box-value' >
+ <div className='search-searchBar-grid-box-label'>{threeData.label}</div>
+ <div className='search-searchBar-grid-box-number'>{threeData.number || '-'}</div>
+ </div>
+ ))} */}
+ </div >
+ ))
+ }
+ </div>
+
+ }
+ <div>
+
+ </div>
+
+ </>
+ ))
+ }
+ </div >
+ )
+
+};
+
+export default CityData;
diff --git a/src/components/cityData/index.less b/src/components/cityData/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/cityData/index.less
diff --git a/src/components/citywideView/index.jsx b/src/components/citywideView/index.jsx
new file mode 100644
index 0000000..63f6e8d
--- /dev/null
+++ b/src/components/citywideView/index.jsx
@@ -0,0 +1,301 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import NavBarPage from '../../components/NavBarPage';
+import MySearchBar from "../../components/MySearchBar";
+import ModalDown from "../../components/ModalDown";
+import "./index.less";
+import { hasMore_1 } from "../../assets/img";
+
+
+
+
+
+const CitywideView = ({ dataList }) => {
+ const history = useHistory();
+ // const [search, setSearch] = useState({ keyword: '', page: 1, size: 10 });
+ const [screenModal, setScreenModal] = useState({
+ dataList: dataList,
+ visible: false,
+ });
+
+
+ const [isDropdownOpen, setDropdownOpen] = useState(false);
+
+ const toggleDropdown = () => {
+ setDropdownOpen(!isDropdownOpen);
+ console.log("Dropdown clicked!"); // 在这里添加打印语句
+ };
+
+ function handleScreen(data, list) {
+ setScreenModal({ dataList: list, visible: false });
+ }
+
+
+
+ useEffect(() => {
+
+ }, []);
+
+ return (
+ <>
+ <div className="search-searchBar">
+ <MySearchBar
+ buttonTitle='筛选'
+ showButton={true}
+ showFilterOutlined={true}
+ onClickRightAction={() => {
+ setScreenModal({ ...screenModal, visible: true });
+ }}
+ onOpenSearch={() => {
+ history.push("/ssim/registeredPop/search");
+ }}
+ />
+ <div style={{ display: 'flex', justifyContent: 'center' }} onClick={toggleDropdown}>
+ <div style={{ width: '51px', height: '7px', backgroundColor: '#fff', borderBottomLeftRadius: '25.5px 7px', borderBottomRightRadius: '25.5px 7px' }}
+
+ >
+ <div style={{ display: 'flex', justifyContent: 'center' }}>
+ <img
+ style={{ width: '7px', height: '4px' }}
+ src={hasMore_1}
+ alt=""
+ srcset=""
+ />
+ </div>
+ <div>
+ {isDropdownOpen && (
+ <div style={{ backgroundColor: '#fff' }}>
+ 下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容下拉页面内容
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+
+ <div style={{ marginLeft: '16px' }}>
+ <div className='search-searchBar-grid'>
+ <div>海口市</div>
+ <div>2365221人</div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>美兰区</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>美兰区</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>龙华区</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>秀英区</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>琼山区</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className='search-searchBar-grid-box'>
+ <div className='search-searchBar-grid-box-title'>
+ <div>桂林洋</div>
+ <div>823165人</div>
+ </div>
+ <div style={{ flex: 1 }}>
+ <div style={{ display: 'flex', flexWrap: 'wrap', gap: '8px', marginLeft: '8px' }}>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ <div className='search-searchBar-grid-box-value'>
+ <div>白龙街道</div>
+ <div>259633人</div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ </div>
+ </div>
+ <ModalDown
+ dataList={screenModal.dataList}
+ visible={screenModal.visible}
+ visibleOnClick={() =>
+ setScreenModal({ ...screenModal, visible: false })
+ }
+ onConfirm={handleScreen}
+ />
+
+ </>
+ )
+
+}
+
+export default CitywideView;
\ No newline at end of file
diff --git a/src/components/citywideView/index.less b/src/components/citywideView/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/citywideView/index.less
diff --git a/src/components/communityService/List.jsx b/src/components/communityService/List.jsx
new file mode 100644
index 0000000..e2dfec2
--- /dev/null
+++ b/src/components/communityService/List.jsx
@@ -0,0 +1,81 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-12-27 09:57:22
+ * @LastEditTime: 2023-08-03 11:47:27
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description: 社区服务台账 - 列表组件
+ */
+import React from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import { LocationOutlined, MeOutlined } from 'dd-icons';
+import MyList from '../MyList';
+import { dateFormat, searchTitle } from '../../utils/utility';
+
+/*
+*search: 对象{} //
+*data: obj{} // 对象数据
+*hasMore: obj{} //对象数据
+*
+*/
+
+const CommunityServiceList = ({ search, data, hasMore, searchValue, getData }) => {
+ // 加载更多数据
+
+ function handleLoadMore(callback) {
+ getData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ itemDom={(item) => {
+ return (
+ <div className="communityService-main-item">
+ <h5>{searchValue ? searchTitle(item.personName, searchValue) : item.personName}</h5>
+ <div className="communityService-main-item-subtitle">
+ <div>{item.sexDesc || '-'}</div>
+ <div className="public-rightBorder">{item.age || '-'}岁</div>
+ <div className="public-rightBorder">服务时间：{dateFormat(item.agentTime)}</div>
+ </div>
+ <Space style={{ '--gap': '8px' }} wrap>
+ <div className="communityService-main-item-subtitle">
+ <div>
+ <LocationOutlined />
+ </div>
+ <div style={{ paddingLeft: '4px' }}>
+ {item.districtName || ''}
+ {item.subdistrictName || ''}
+ {item.communityName || ''}
+ </div>
+ </div>
+ <div className="communityService-main-item-subtitle">
+ <div>
+ <MeOutlined />
+ </div>
+ <div style={{ paddingLeft: '4px' }}>{item.agentUserName || '-'}</div>
+ </div>
+ </Space>
+ <Space style={{ '--gap': '8px', marginTop: '4px' }} wrap>
+ <div className="public-tag2">老年优待证</div>
+ {item.result && (
+ <div
+ className={`public-tag2 public-tag2-${
+ item.result === '21_00019-2' ? 'green' : item.result === '21_00019-3' ? 'red' : item.result === '21_00019-4' ? 'organ2' : 'blue3'
+ }`}
+ >
+ {item.resultDesc}
+ </div>
+ )}
+ </Space>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default CommunityServiceList;
diff --git a/src/components/communityService/index.less b/src/components/communityService/index.less
new file mode 100644
index 0000000..ad7f33d
--- /dev/null
+++ b/src/components/communityService/index.less
@@ -0,0 +1,155 @@
+.communityService {
+ &-searchBar {
+ position: fixed;
+ top: @navBarHeight;
+ left: 0;
+ right: 0;
+ z-index: 99;
+
+ &-height {
+ height: 48px;
+ }
+ }
+
+ &-main {
+ height: calc(100% - @navBarHeight - 48px - 24px);
+ padding: 12px;
+ display: flex;
+ flex-direction: column;
+
+ &-title {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 12px;
+
+ &-icon {
+ font-size: 16px;
+ }
+ }
+
+ &-list {
+ flex: 1;
+ overflow: hidden;
+ }
+
+ &-item {
+ padding: 4px 8px 8px;
+ border-radius: 5px;
+ background-color: @common_bg_z1_color;
+ margin-bottom: 8px;
+
+ &-subtitle {
+ display: flex;
+ font-size: 12px;
+ line-height: 20px;
+ margin-top: 4px;
+ }
+ }
+ }
+
+ &-statistics {
+ padding: 8px 12px 28px;
+
+ &-form {
+ border-radius: 10px;
+ overflow: hidden;
+ background-color: @common_bg_z1_color;
+ }
+
+ &-formItem {
+ padding: 12px 16px;
+ background-color: @common_bg_z1_color;
+
+ .dtm-list-extra {
+ max-width: 160px;
+ }
+ }
+
+ &-formListItem {
+ padding-left: 0;
+ min-height: 0 !important;
+
+ .dtm-list-line {
+ padding: 0;
+ }
+ }
+
+ &-btn {
+ padding: 8px 16px;
+ display: flex;
+
+ .public-btn-primary {
+ width: 115px;
+ margin-right: 24px;
+ }
+ }
+
+ &-title {
+ padding: 12px;
+ background-color: @common_bg_z1_color;
+ position: relative;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 12px;
+ right: 12px;
+ border-top: 1px dashed @common_line_light_color;
+ }
+ }
+
+ &-subtitle {
+ padding: 12px;
+ background-color: @common_bg_z1_color;
+ position: relative;
+
+ &::after {
+ content: '';
+ position: absolute;
+ height: 12px;
+ width: 3px;
+ left: 0;
+ top: 50%;
+ margin-top: -6px;
+ background-color: @theme_primary1_color;
+ }
+ }
+
+ &-table {
+ padding: 0 12px 16px;
+ background-color: @common_bg_z1_color;
+
+ &-col {
+ width: 100%;
+ display: flex;
+ font-size: 12px;
+ line-height: 20px;
+
+ div,
+ h5 {
+ padding: 6px 8px;
+ flex: 1;
+ .ellipsis-text-1;
+ }
+ }
+ }
+
+ &-blue1 {
+ background-color: #e6f7ff;
+ }
+
+ &-blue2 {
+ background-color: #a3ddff;
+ }
+
+ &-green1 {
+ background-color: #e6fffb;
+ }
+
+ &-green2 {
+ background-color: #b5f5ec;
+ }
+ }
+}
diff --git a/src/components/materials/List.jsx b/src/components/materials/List.jsx
new file mode 100644
index 0000000..755ecd6
--- /dev/null
+++ b/src/components/materials/List.jsx
@@ -0,0 +1,67 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 16:35:20
+ * @LastEditTime: 2022-12-07 10:59:51
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 应急物资 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const MaterialsList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getPageQueryData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getPageQueryData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 列表更新
+ useEffect(() => {
+ if (routerStatus.spinPage['materials']) {
+ getPageQueryData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('materials');
+ routerStatus.clearSpinPage('materials');
+ }
+ }, [routerStatus.spinPage['materials']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztGrid/detailMaterials?id=${item.id}`)}
+ >
+ <div className="building-card">
+ <div className="building-title">
+ {item.goodsName}
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">型号：{item.goodsNorms || '-'}</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">数量：{item.goodsCount || 0}</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{dateFormat(item.updateTime)}更新</div>
+ </div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default MaterialsList;
diff --git a/src/components/mediate/List.jsx b/src/components/mediate/List.jsx
new file mode 100644
index 0000000..851e790
--- /dev/null
+++ b/src/components/mediate/List.jsx
@@ -0,0 +1,102 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-17 11:50:34
+ * @LastEditTime: 2022-12-09 14:14:21
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的任务 - 任务列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import { ClockOutlined, LocationOutlined } from 'dd-icons';
+import MyList from '../MyList';
+import { searchTitle, moment } from '../../utils/utility';
+import routerStatus from '../../status/router';
+import { task_img_3 } from '../../assets/img';
+
+const EventList = ({ search, data, dataTotal, hasMore, getScrollTopKey, scrollTop, searchValue, getData }) => {
+ const history = useHistory();
+
+ // 跳转页面至详情页
+ function handleGoToDetail(item) {
+ history.push(`/hztGrid/mediateEventList/detail?eventId=${item.id}&taskId=${item.taskId}`);
+ }
+
+ function msgTime(value, type) {
+ let res = '';
+ if (moment(value).format('YYYYMMDD') === moment().format('YYYYMMDD')) {
+ res = '今日';
+ } else {
+ res = moment(value).format('MM月DD日');
+ }
+ return type ? res : `${res} ${moment(value).format('HH:mm')}`;
+ }
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 数据更新
+ useEffect(() => {
+ if (routerStatus.spinPage['mediateEventList']) {
+ getData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('mediateEventList');
+ routerStatus.clearSpinPage('mediateEventList');
+ }
+ }, [routerStatus.spinPage['mediateEventList']]);
+
+ return (
+ <>
+ <MyList
+ data={data}
+ dataTotal={dataTotal}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item) => {
+ return (
+ <div onClick={() => handleGoToDetail(item)} className="task-card">
+ <div className="task-card-header">
+ <img className="task-card-titleIcon" src={task_img_3} alt="" />
+ <span className="task-card-title">{item.eventTypeDesc}</span>
+ </div>
+ <div className="task-card-main">
+ <div className="task-card-main-header">
+ <LocationOutlined />
+ <span className="task-card-main-header-flex ellipsis-text-1">{searchValue ? searchTitle(item.addr, searchValue) : item.addr}</span>
+ </div>
+ <div className="task-card-main-tags">
+ <Space className="task-card-main-tags-flex" wrap>
+ {item.gridName && <div className="public-tag2">{item.gridName}</div>}
+ <div
+ className={`public-tag2 public-tag2-${item.process === '21_00004-2' ? 'organ2' : item.process === '21_00004-3' ? 'blue3' : ''}`}
+ >
+ {item.processDesc}
+ </div>
+ {item.mediResult && (
+ <div className={`public-tag2 public-tag2-${item.mediResult === '22_00025-1' ? 'green' : 'red'}`}>{item.mediResultName}</div>
+ )}
+ </Space>
+ <Space style={{ '--gap': '4px' }}>
+ <ClockOutlined style={{ fontSize: '14px' }} />
+ <div>{msgTime(item.updateTime)}</div>
+ </Space>
+ </div>
+ </div>
+ <div className="task-card-bottom">
+ <div className="task-card-bottom-point" />
+ <div>{item.eventTitle}</div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ </>
+ );
+};
+
+export default EventList;
diff --git a/src/components/mediate/MediateDetailMsg.jsx b/src/components/mediate/MediateDetailMsg.jsx
new file mode 100644
index 0000000..c5f5624
--- /dev/null
+++ b/src/components/mediate/MediateDetailMsg.jsx
@@ -0,0 +1,431 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-11-18 09:03:22
+ * @LastEditTime: 2022-12-09 16:40:16
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 调解详情展示
+ * 事件处置进度，21_00004-1：未开始，21_0004-2：进行中，21_00004-3：已结束，21_0004-4：超时限，21_0004-5：申情人撤回，21_0004-6：不予受理
+ */
+import React from 'react';
+import { useHistory } from 'react-router-dom';
+import { TelephoneOutlined, AchieveFilled, CopyOutlined } from 'dd-icons';
+import { avatar6, mediate_img_2, mediate_img_3, mediate_img_4, me_avatar } from '../../assets/img';
+import { confirmModal, confirmThreeButtonModal, myTimeFormat, selectOption, showToast, timeFormat } from '../../utils/utility';
+import { Button } from 'dingtalk-design-mobile';
+import Descriptions from '../Descriptions';
+import dd from 'gdt-jsapi';
+
+const MediateDetailMsg = ({ eventId, taskId, data }) => {
+ const history = useHistory();
+
+ // 上报矛盾纠纷调处中心
+ function handleSubmitMediateCenter() {
+ confirmModal({
+ title: '上报确认',
+ subtitle: (
+ <>
+ 上报矛盾纠纷调处中心<span className="public-color">上报矛盾纠纷调处中心</span>上报矛盾纠纷调处中心
+ </>
+ ),
+ okText: '确定上报',
+ });
+ }
+
+ // 重新上报矛盾纠纷调处中心
+ function handleAgainSubmit() {
+ confirmThreeButtonModal({
+ title: '重新上报提醒',
+ subtitle: '再次上报前，请仔细根据退回原因修改或补充纠纷信息',
+ actions: [
+ { text: '重新上报' },
+ { text: '修改纠纷', onClick: () => history.push(`/hztGrid/mediateRegister?eventId=${eventId}`) },
+ { text: '我再想想' },
+ ],
+ });
+ }
+
+ // 复制
+ function handleCopy(text) {
+ dd.copyToClipboard({ text: text })
+ .then((res) => showToast({ content: '复制成功' }))
+ .catch((err) => showToast({ content: '复制失败' }));
+ }
+
+ // 网格员 - 处置/调解中
+ const dom1 = (
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img1" src={mediate_img_2} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>进行中</h5>
+ <div className="public-tag2 public-tag2-organ3">网格员调解中</div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(data.inputTime)}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-dashed" />
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img2" src={me_avatar} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>{data.userName}</h5>
+ <div className="mediateDetailMsg-flex-phone">
+ <div className="mediateDetailMsg-flex-phone-icon">
+ <TelephoneOutlined />
+ </div>
+ <div>{data.mobile || '-'}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">
+ <div>{data.posName || '-'}</div>
+ <div className="public-rightBorder">
+ {data.districtName} {data.subdistrictName} {data.communityName}
+ </div>
+ </div>
+ </div>
+ </div>
+ <div>
+ {/* TODO:暂无 <Button onClick={handleSubmitMediateCenter} size="middle" className="public-btn-danger" style={{ marginTop: '16px' }}>
+ 上报矛盾纠纷调处中心
+ </Button> */}
+ <Button
+ onClick={() => history.push(`/hztGrid/mediateEventList/materialConclude?eventId=${eventId}&taskId=${taskId}`)}
+ size="middle"
+ type="primary"
+ style={{ marginTop: '16px' }}
+ >
+ 纠纷办结
+ </Button>
+ </div>
+ </div>
+ );
+
+ // 网格员 - 已处置
+ const dom2 = (
+ <>
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ <div className="mediateDetailMsg-flex-imgSuccess">
+ <AchieveFilled />
+ </div>
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>已完成</h5>
+ <div className="public-tag2 public-tag2-blue3">网格员反馈</div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(data.inputTime)}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-solid" />
+ <Descriptions
+ data={[
+ { label: '办结选项', value: selectOption.conclude.find((item) => item.value === data.handleCanal)?.label },
+ { label: '办结时间', value: timeFormat(data.finishTime) },
+ ...(data.process !== '21_00004-3'
+ ? []
+ : [
+ {
+ label: '调解结果',
+ value: <span className={`mediateDetailMsg-${data.mediResult === '22_00025-1' ? 'success' : 'fail'}`}>{data.mediResultName}</span>,
+ },
+ ]),
+ { label: '调解反馈', value: data.agreeContent },
+ ]}
+ columns={1}
+ layout="vertical"
+ colon={false}
+ textGap={0}
+ itemGap={8}
+ />
+ </div>
+ <div className="mediateDetailMsg-card">
+ <Descriptions title="调解附件" otherData={[{ type: 'files', files: data.fileInfoList }]} itemGap={0} />
+ <div className="mediateDetailMsg-solid" />
+ <div className="mediateDetailMsg-flex-subtitle">纠纷调解过程中的相关证明材料</div>
+ </div>
+ </>
+ );
+
+ // 矛盾纠纷调解处 - 未开始
+ const dom3 = (
+ <>
+ <div className="mediateDetailMsg-card2">
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img1" src={mediate_img_3} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>未开始</h5>
+ <div className="public-tag2 public-tag2-organ3">审查中</div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(new Date())}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-solid" />
+ <div className="mediateDetailMsg-load">
+ <div className="mediateDetailMsg-load-spin">
+ <img src={mediate_img_4} alt="" />
+ </div>
+ <h4>矛盾纠纷调处中心审查中</h4>
+ <div className="mediateDetailMsg-load-subtitle">审查纠纷信息、材料及匹配调解员中...</div>
+ </div>
+ </div>
+ <div style={{ padding: '16px 0' }}>
+ <Button onClick={() => history.push(`/hztGrid/mediateEventList/materialConclude?eventId=${eventId}&taskId=${taskId}`)} type="primary">
+ 纠纷办结
+ </Button>
+ </div>
+ </>
+ );
+
+ // 矛盾纠纷调解处 - 调解员处理
+ const dom4 = (
+ <>
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ {true ? (
+ <div className="mediateDetailMsg-flex-img3">
+ <AchieveFilled />
+ </div>
+ ) : (
+ <img className="mediateDetailMsg-flex-img1" src={mediate_img_2} alt="" />
+ )}
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ {true ? (
+ <>
+ <h5>已完成</h5>
+ <div className="public-tag2 public-tag2-blue3">调解员反馈</div>
+ <div className="public-tag2 public-tag2-blue3">司法确认反馈</div>
+ </>
+ ) : (
+ <>
+ <h5>进行中</h5>
+ <div className="public-tag2 public-tag2-organ3">调解员核实中</div>
+ </>
+ )}
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(new Date())}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-dashed" />
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img2" src={me_avatar} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>李飞</h5>
+ <div className="mediateDetailMsg-flex-phone">
+ <div className="mediateDetailMsg-flex-phone-icon">
+ <TelephoneOutlined />
+ </div>
+ <div>13590210706</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">
+ <span>调解员</span>
+ <span className="public-rightBorder">美兰区新埠街道人民调解委员会</span>
+ </div>
+ </div>
+ </div>
+ {/* 预约信息 */}
+ <div className="mediateDetailMsg-meeting">
+ <div className="mediateDetailMsg-meeting-left">
+ <div className="mediateDetailMsg-meeting-left-day">15号</div>
+ <div className="mediateDetailMsg-meeting-left-month">3月</div>
+ </div>
+ <div className="mediateDetailMsg-meeting-right">
+ <div>
+ <span>
+ 预约时间：{myTimeFormat(new Date(), 'HH:mm')} ~ {myTimeFormat(new Date(), 'HH:mm')}
+ </span>
+ <span className="public-tag public-tag-green2">线下调解</span>
+ </div>
+ <div className="mediateDetailMsg-space">
+ <div>预约地点：</div>
+ <div className="mediateDetailMsg-space-right">新埠街道人民调委会第一调解室</div>
+ </div>
+ </div>
+ </div>
+ {/* 调解进行中 or 已完成 */}
+ <div className="mediateDetailMsg-ing">
+ <div>调解开始时间：{timeFormat(new Date())}</div>
+ <div>
+ 调解时间：{timeFormat(new Date())} ~ {timeFormat(new Date())}
+ </div>
+ <div className="mediateDetailMsg-space">
+ <div>调解地点：</div>
+ <div className="mediateDetailMsg-space-right">新埠街道人民调委会第一调解室</div>
+ </div>
+ <div>调解方式：线上+线下</div>
+ <div>
+ <span>线上调解房间号：921402548</span>
+ <span onClick={() => handleCopy('房间号')} className="public-rightBorder">
+ <CopyOutlined style={{ marginRight: '4px' }} />
+ 复制
+ </span>
+ </div>
+ <div>
+ <span>调解结果：</span>
+ <span className="public-success-color public-fail-color">调解不成功</span>
+ </div>
+ </div>
+ {/* 调解协议 */}
+ <div className="mediateDetailMsg-file">
+ <div className="mediateDetailMsg-file-left">
+ <div>调解</div>
+ <div>协议</div>
+ </div>
+ <div>
+ <div className="mediateDetailMsg-file-title">李小萌与王菲婚姻调解协议书</div>
+ <div className="public-tag public-tag-green3">点击查看</div>
+ </div>
+ </div>
+ </div>
+ {/* 司法确认 */}
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img2" src={avatar6} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>李晓</h5>
+ <div className="mediateDetailMsg-flex-phone" style={{ color: 'var(--common_level1_base_color)' }}>
+ <div className="mediateDetailMsg-flex-phone-icon" style={{ borderColor: 'var(--common_level1_base_color)' }}>
+ <TelephoneOutlined />
+ </div>
+ <div>13590210706</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">
+ <span>承办法官</span>
+ <span className="public-rightBorder">美兰区法院</span>
+ </div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-ing" style={{ backgroundColor: 'rgba(249,241,189,0.6)' }}>
+ <div>
+ 司法确认时间：{timeFormat(new Date())} ~ {timeFormat(new Date())}
+ </div>
+ <div className="mediateDetailMsg-space">
+ <div>司法确认地点：</div>
+ <div className="mediateDetailMsg-space-right">新埠街道人民调委会第一调解室</div>
+ </div>
+ <div>司法确认方式：线上+线下</div>
+ <div>
+ <span>司法确认结果：</span>
+ <span className="public-success-color public-fail-color">未达成</span>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-file mediateDetailMsg-file2">
+ <div className="mediateDetailMsg-file-left">
+ <div>民事</div>
+ <div>裁定</div>
+ </div>
+ <div>
+ <div className="mediateDetailMsg-file-title">李小萌与王菲婚姻调解协议书</div>
+ <div className="public-tag public-tag-brown">点击查看</div>
+ </div>
+ </div>
+ </div>
+ </>
+ );
+
+ // 退回
+ const dom5 = (
+ <>
+ <div style={{ flex: 1 }}>
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ <img className="mediateDetailMsg-flex-img1" src={mediate_img_3} alt="" />
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>未开始</h5>
+ <div className="public-tag2 public-tag2-red">退回</div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(new Date())}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-solid" />
+ <Descriptions
+ data={[
+ { label: '审查组织', value: '' },
+ { label: '审查时间', value: timeFormat(new Date()) },
+ { label: '原因说明', value: '' },
+ ]}
+ columns={1}
+ layout="vertical"
+ colon={false}
+ textGap={0}
+ itemGap={8}
+ />
+ <Button onClick={handleAgainSubmit} size="middle" className="public-btn-primary" style={{ marginTop: '16px' }}>
+ 重新上报
+ </Button>
+ </div>
+ </div>
+ <div style={{ padding: '16px 0' }}>
+ <Button onClick={() => history.push(`/hztGrid/mediateEventList/materialConclude?eventId=${eventId}&taskId=${taskId}`)} type="primary">
+ 纠纷办结
+ </Button>
+ </div>
+ </>
+ );
+
+ // 不予受理 or 异常终止
+ const dom6 = (
+ <div className="mediateDetailMsg-card">
+ <div className="mediateDetailMsg-flex">
+ <div className="mediateDetailMsg-flex-imgSuccess">
+ <AchieveFilled />
+ </div>
+ <div>
+ <div className="mediateDetailMsg-flex-title">
+ <h5>已完成</h5>
+ <div className="public-tag2 public-tag2-red">不予受理</div>
+ </div>
+ <div className="mediateDetailMsg-flex-subtitle">纠纷上报时间：{timeFormat(new Date())}</div>
+ </div>
+ </div>
+ <div className="mediateDetailMsg-solid" />
+ <Descriptions
+ data={[
+ { label: '审查组织', value: '' },
+ { label: '审查时间', value: timeFormat(new Date()) },
+ { label: '原因说明', value: '' },
+
+ { label: '调解组织', value: '' },
+ {
+ label: '调解员',
+ value: (
+ <>
+ <span>李晓明</span>
+ <span className="public-rightBorder">13178511718</span>
+ <TelephoneOutlined className="public-color" style={{ marginLeft: '4px' }} />
+ </>
+ ),
+ },
+ { label: '终止时间', value: timeFormat(new Date()) },
+ { label: '原因说明', value: '' },
+ ]}
+ columns={1}
+ layout="vertical"
+ colon={false}
+ textGap={0}
+ itemGap={8}
+ />
+ </div>
+ );
+
+ let dom = null;
+ if (data.process === '21_00004-2') {
+ dom = dom1;
+ }
+ if (!['21_00004-1', '21_00004-2'].includes(data.process)) {
+ dom = dom2;
+ }
+
+ return <div className="mediateDetailMsg">{dom}</div>;
+};
+
+export default MediateDetailMsg;
diff --git a/src/components/mediate/PartyEditModal.jsx b/src/components/mediate/PartyEditModal.jsx
new file mode 100644
index 0000000..21ab3c2
--- /dev/null
+++ b/src/components/mediate/PartyEditModal.jsx
@@ -0,0 +1,292 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-11-10 14:54:21
+ * @LastEditTime: 2022-12-06 18:07:23
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 当事人新增or修改的modal组件
+ */
+import React from 'react';
+import { Button, Input, Empty } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined, CheckOutlined } from 'dd-icons';
+import ModalDown from '../../components/ModalDown';
+import MyTabs from '../../components/MyTabs';
+import { confirmModal, selectOption, showToast } from '../../utils/utility';
+import rule from '../../utils/rules';
+import UploadFile from '../UploadFile';
+
+const PartyEditModal = ({ titleShow, formData, partyModal, setFormData, setPartyModal, onClose }) => {
+ // 切换当事人 or 代理人
+ function handleChangeTab(value) {
+ if (partyModal.editType === 'edit') {
+ showToast({ content: '不支持修改类型' });
+ return;
+ }
+ setPartyModal({
+ ...partyModal,
+ tabActive: value,
+ partyIndex: 0,
+ perClassIndex: 0,
+ data: { ...partyModal.data, perClass: '09_01001-1', perClassName: '自然人', trueName: '', deputy: '', mobile: '', certiNo: '' },
+ });
+ }
+
+ // 切换当事人类型
+ function handleChangePartyType(value, index) {
+ if (partyModal.editType === 'edit') {
+ showToast({ content: '不支持修改类型' });
+ return;
+ }
+ partyModal.data.perClass = value.value;
+ partyModal.data.perClassName = value.label;
+ partyModal.data.trueName = '';
+ partyModal.data.deputy = '';
+ partyModal.perClassIndex = index;
+ setPartyModal({ ...partyModal });
+ }
+
+ // 表单修改
+ function handleChangeValue(key, value) {
+ partyModal.data[key] = value;
+ setPartyModal({ ...partyModal });
+ }
+
+ // 选择代理人
+ function handleSelectAgent(index) {
+ setPartyModal({ ...partyModal, partyIndex: index });
+ }
+
+ // ocr识别回填
+ function OCRsuccessCallback(value) {
+ const { ocrResult } = value;
+ setPartyModal({ ...partyModal, data: { ...partyModal.data, certiNo: ocrResult.idcard, trueName: ocrResult.name } });
+ }
+
+ // 删除申请人
+ function handleDelParty() {
+ confirmModal({
+ title: '申请人删除确认',
+ subtitle: (
+ <>
+ 确定删除<span className="public-color">{partyModal.data.trueName}</span>吗？
+ </>
+ ),
+ okText: '确定删除',
+ onOk: () => {
+ let type = partyModal.type;
+ let partyIndex = partyModal.partyIndex;
+ if (partyModal.tabActive === '2') {
+ formData[type][partyIndex].agent = null;
+ } else {
+ formData[type].splice(partyIndex, 1);
+ }
+ setFormData({ ...formData });
+ setPartyModal({ visible: false, data: {} });
+ },
+ });
+ }
+
+ // 保存信息
+ function handleSaveParty() {
+ let popupMsg = partyModal;
+ let data = partyModal.data;
+
+ // 信息校验
+ let msg = null;
+ let arr = formData[popupMsg.type === 'plaintiffList' ? 'defendantList' : 'plaintiffList'];
+ let arr2 = formData[popupMsg.type];
+ forEach: for (let t = 0; t < arr.length; t++) {
+ if (arr[t].certiNo === data.certiNo && rule.verifyEmpty(data.certiNo)) {
+ msg = '申请人与被申请人不能相同';
+ break forEach;
+ }
+ }
+ forEach: for (let t = 0; t < arr2.length; t++) {
+ if (arr2[t].certiNo === data.certiNo && rule.verifyEmpty(data.certiNo) && arr2[t].perClass === data.perClass && t !== popupMsg.partyIndex) {
+ msg = (popupMsg.type === 'defendantList' ? '被' : '') + '申请人不能重复';
+ break forEach;
+ }
+ }
+ // 被申请人可不需要手机号码，申请人和代理人需要
+ if (
+ (data.mobile && !rule.phone(data.mobile) && popupMsg.type === 'defendantList') ||
+ (!rule.phone(data.mobile) && popupMsg.type === 'plaintiffList') ||
+ (!rule.phone(data.mobile) && popupMsg.tabActive === '2')
+ ) {
+ msg = '请输入正确的手机号码';
+ }
+ if (!rule.verifyEmpty(data.trueName) || (data.perClass !== '09_01001-1' && !rule.verifyEmpty(data.deputy))) {
+ msg = `请补充${popupMsg.type === 'defendantList' ? '被' : ''}申请人方的${popupMsg.tabActive === '1' ? '当事人' : '代理人'}信息`;
+ }
+ if (msg) {
+ showToast({ content: msg });
+ return;
+ }
+ if (popupMsg.tabActive === '2' && typeof popupMsg.partyIndex !== 'number') {
+ showToast({ content: '请选择代理对象' });
+ return;
+ }
+ if (popupMsg.tabActive === '2' && arr2[popupMsg.partyIndex]?.certiNo === data.certiNo) {
+ showToast({ content: '代理人与当事人不能相同' });
+ return;
+ }
+
+ let type = popupMsg.type;
+ if (popupMsg.tabActive === '2') {
+ formData[type][popupMsg.partyIndex] = { ...formData[type][popupMsg.partyIndex] };
+ formData[type][popupMsg.partyIndex].agent = { ...formData[type][popupMsg.partyIndex].agent, ...data };
+ } else {
+ if (popupMsg.editType === 'add') {
+ formData[type] = [...formData[type], data];
+ } else {
+ formData[type][popupMsg.partyIndex] = { ...formData[type][popupMsg.partyIndex], ...data };
+ }
+ }
+ setFormData({ ...formData });
+ setPartyModal({ visible: false, data: {} });
+ }
+
+ return (
+ <ModalDown
+ visible={partyModal.visible}
+ headContent
+ isAction={false}
+ visibleOnClick={onClose}
+ extraContent={
+ <div className={partyModal.tabActive === '1' ? 'mediateRegister-partyModal' : ''}>
+ <div className="mediateRegister-partyModal-header">
+ <div>
+ {partyModal.editType === 'add' ? '增加' : '修改'}
+ {partyModal.type === 'plaintiffList' ? '申请人' : '被申请人'}
+ </div>
+ <CloseBoldOutlined onClick={onClose} />
+ </div>
+ <div className="mediateRegister-partyModal-tabs">
+ <MyTabs
+ tabs={[
+ { key: '1', title: '当事人' },
+ { key: '2', title: '代理人' },
+ ]}
+ activeKey={partyModal.tabActive}
+ onChange={handleChangeTab}
+ />
+ </div>
+ {partyModal.tabActive === '1' && (
+ <div className="mediateRegister-partyModal-tabsCard">
+ {selectOption.personClass.map((x, t) => (
+ <div
+ key={x.value}
+ className={`mediateRegister-partyModal-tabsCard-item ${
+ x.value === partyModal.data.perClass ? 'mediateRegister-partyModal-tabsCard-item-active' : ''
+ }`}
+ >
+ <div
+ onClick={() => handleChangePartyType(x, t)}
+ className="mediateRegister-partyModal-tabsCard-item-bg"
+ style={{
+ borderBottomLeftRadius: t === partyModal.perClassIndex + 1 ? '10px' : '0',
+ borderBottomRightRadius: t === partyModal.perClassIndex - 1 ? '10px' : '0',
+ }}
+ >
+ {x.label}
+ </div>
+ </div>
+ ))}
+ </div>
+ )}
+ <div className="mediateRegister-partyModal-form">
+ <div className="mediateRegister-formItem2">
+ <div className="mediateRegister-formTitle">{(titleShow[partyModal.data.perClass] || [])[1]}</div>
+ <div className="public-tag4">必填</div>
+ <div className="mediateRegister-formItem2-flex">
+ <Input
+ value={partyModal.data.trueName}
+ onChange={(value) => handleChangeValue('trueName', value)}
+ placeholder={`填写${(titleShow[partyModal.data.perClass] || [])[2]}`}
+ clear
+ />
+ </div>
+ </div>
+ {partyModal.data.perClass !== '09_01001-1' && partyModal.tabActive === '1' && (
+ <div className="mediateRegister-formItem2">
+ <div className="mediateRegister-formTitle">{(titleShow[partyModal.data.perClass] || [])[3]}</div>
+ <div className="public-tag4">必填</div>
+ <div className="mediateRegister-formItem2-flex">
+ <Input value={partyModal.data.deputy} onChange={(value) => handleChangeValue('deputy', value)} placeholder="填写真实姓名" clear />
+ </div>
+ </div>
+ )}
+ <div className="mediateRegister-formItem2">
+ <div className="mediateRegister-formTitle">手机号码</div>
+ {(partyModal.type === 'plaintiffList' || partyModal.tabActive === '2') && <div className="public-tag4">必填</div>}
+ <div className="mediateRegister-formItem2-flex">
+ <Input
+ value={partyModal.data.mobile}
+ onChange={(value) => handleChangeValue('mobile', value)}
+ placeholder="填写常用手机号码"
+ inputMode="tel"
+ clear
+ />
+ </div>
+ </div>
+ <div className="mediateRegister-formItem2">
+ <div className="mediateRegister-formTitle">身份证号码</div>
+ <div className="mediateRegister-formItem2-flex">
+ <Input
+ value={partyModal.data.certiNo}
+ onChange={(value) => handleChangeValue('certiNo', value)}
+ placeholder="调解实名规定需填写"
+ clear
+ />
+ </div>
+ <UploadFile OCRshow capture="camera" onSuccessCallback={OCRsuccessCallback}>
+ <div className="public-rightBorder public-color">拍照填写</div>
+ </UploadFile>
+ </div>
+ {/* 代理人 - 代理对象 */}
+ {partyModal.tabActive === '2' && (
+ <div className="mediateRegister-formItem">
+ <div className="mediateRegister-formItem-label">
+ <div className="mediateRegister-formTitle">代理对象</div>
+ <div className="public-tag4">必填</div>
+ </div>
+ <div className="mediateRegister-partyModal-agent">
+ {formData[partyModal.type]?.map((x, t) => (
+ <div
+ onClick={() => handleSelectAgent(t)}
+ className={`mediateRegister-partyModal-agent-item ${
+ t === partyModal.partyIndex ? 'mediateRegister-partyModal-agent-itemActive' : ''
+ }`}
+ key={t}
+ >
+ <div>{x.trueName}</div>
+ {t === partyModal.partyIndex && <CheckOutlined />}
+ </div>
+ ))}
+ {!formData[partyModal.type]?.length && (
+ <div>
+ <Empty type="noContent" title="尚未添加当事人" inline />
+ </div>
+ )}
+ </div>
+ </div>
+ )}
+ </div>
+ <div className="mediateRegister-partyModal-btn">
+ {partyModal.editType === 'edit' && (
+ <Button onClick={handleDelParty} type="danger" style={{ width: '120px', marginRight: '24px' }}>
+ 删除
+ </Button>
+ )}
+ <Button onClick={handleSaveParty} type="primary" style={{ flex: 1 }}>
+ 保存信息
+ </Button>
+ </div>
+ </div>
+ }
+ />
+ );
+};
+
+export default PartyEditModal;
diff --git a/src/components/mediate/index.js b/src/components/mediate/index.js
new file mode 100644
index 0000000..a07639b
--- /dev/null
+++ b/src/components/mediate/index.js
@@ -0,0 +1,14 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-11-10 14:54:54
+ * @LastEditTime: 2022-11-18 09:04:47
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 矛盾纠纷组件输出
+ */
+import PartyEditModal from './PartyEditModal';
+import EventList from './List';
+import MediateDetailMsg from './MediateDetailMsg';
+
+export { PartyEditModal, EventList, MediateDetailMsg };
diff --git a/src/components/mediate/index.less b/src/components/mediate/index.less
new file mode 100644
index 0000000..7f1677b
--- /dev/null
+++ b/src/components/mediate/index.less
@@ -0,0 +1,783 @@
+.mediateRegister {
+ &-form {
+ padding: 16px 12px 0;
+ height: calc(100% - 76px - @navBarHeight - 16px);
+ overflow-y: auto;
+ }
+
+ &-card {
+ border-radius: 10px;
+ margin-bottom: 8px;
+ overflow: hidden;
+ background-color: @common_bg_z1_color;
+ }
+
+ &-formItem {
+ padding: 12px 16px;
+ background-color: @common_bg_z1_color;
+
+ &-label {
+ display: flex;
+ align-items: center;
+ margin-bottom: 4px;
+ }
+ }
+
+ &-formTitle {
+ font-weight: 600;
+ margin-right: 8px;
+ }
+
+ &-formListItem {
+ padding-left: 0;
+ min-height: 0 !important;
+
+ .dtm-list-line {
+ padding: 0;
+ }
+ }
+
+ &-formItem2 {
+ padding: 12px 16px;
+ background-color: @common_bg_z1_color;
+ display: flex;
+ align-items: center;
+
+ &-flex {
+ flex: 1;
+ text-align: right;
+
+ .dtm-input-item-input {
+ text-align: right;
+ }
+ }
+ }
+
+ &-formNoBottom {
+ margin-bottom: -12px;
+ }
+
+ &-party {
+ background-color: @common_bg_z1_color;
+ padding: 8px 8px 8px 16px;
+
+ &-item {
+ display: flex;
+ align-items: center;
+ padding: 8px 0;
+ }
+
+ &-img {
+ width: 32px;
+ height: 32px;
+ border-radius: 5px;
+ line-height: 32px;
+ text-align: center;
+ color: @common_bg_z1_color;
+ font-size: 12px;
+
+ &-shen {
+ background: linear-gradient(138deg, #007fff 0%, #0062ff 100%);
+ }
+
+ &-bei {
+ background: linear-gradient(135deg, #ff713d 0%, #ff5b1f 100%);
+ }
+ }
+
+ &-content {
+ flex: 1;
+ padding-left: 16px;
+ overflow: hidden;
+
+ &-title {
+ display: flex;
+ align-items: center;
+ width: 100%;
+
+ &-name {
+ padding-right: 8px;
+ max-width: 75px;
+ .ellipsis-text-1;
+ }
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ .ellipsis-text-1;
+ }
+
+ .dtm-button {
+ border: 1px dashed @common_line_hard_color;
+ }
+ }
+
+ &-add {
+ padding: 0 8px;
+ border-left: 1px solid @common_line_hard_color;
+ margin-left: 8px;
+ color: @theme_primary1_color;
+ }
+ }
+
+ &-btn {
+ padding: 16px 12px;
+ }
+
+ &-success {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ position: absolute;
+ width: 100%;
+ top: 50%;
+ margin-top: -100px;
+
+ &-icon {
+ font-size: 64px;
+ color: @theme_primary1_color;
+ }
+
+ &-title {
+ font-size: 16px;
+ line-height: 25px;
+ font-weight: 600;
+ margin-top: 16px;
+ }
+
+ &-subtitle {
+ color: @common_level2_base_color;
+ margin: 16px 0 20px;
+ }
+ }
+
+ &-partyModal {
+ background-color: @common_bg_color;
+
+ .myTabs-tab {
+ margin-right: 32px;
+ }
+
+ &-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 12px 16px 0;
+ font-weight: 600;
+ font-size: 16px;
+ }
+
+ &-tabs {
+ padding: 12px 16px 16px;
+ }
+
+ &-tabsCard {
+ display: flex;
+ align-items: flex-end;
+
+ &-item {
+ flex: 1;
+ background-color: @common_bg_z1_color;
+ text-align: center;
+ line-height: 40px;
+ height: 40px;
+ position: relative;
+
+ &:first-child {
+ border-radius: 0px 0px 0px 10px;
+ }
+
+ &:last-child {
+ border-radius: 0px 10px 0px 0px;
+ }
+
+ &-active {
+ height: 50px;
+ line-height: 50px;
+ font-size: 16px;
+ font-weight: 600;
+ border-radius: 10px 10px 0px 0px !important;
+
+ .mediateRegister-partyModal-tabsCard-item-bg {
+ border-radius: 10px 10px 0px 0px;
+ background-color: @common_bg_z1_color;
+ }
+ }
+
+ &-bg {
+ background-color: @common_bg_color;
+ }
+ }
+ }
+
+ &-form {
+ background-color: @common_bg_z1_color;
+ padding: 16px 0;
+ }
+
+ &-agent {
+ padding: 12px 16px 0;
+ max-height: 300px;
+
+ &-item {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 8px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ &-itemActive {
+ color: @theme_primary1_color;
+ }
+
+ .dtm-empty-page-img {
+ width: 144px;
+ height: 144px;
+ }
+
+ .dtm-empty-page-title,
+ .dtm-empty-page-top {
+ margin: 0;
+ }
+ }
+
+ &-btn {
+ background-color: @common_bg_z1_color;
+ display: flex;
+ padding: 16px 16px 0;
+ border-top: 1px solid @common_line_light_color;
+
+ .dtm-button-warning {
+ background-color: @common_bg_z1_color;
+ color: @theme_danger1_color;
+ border: 1px solid;
+ }
+ }
+ }
+}
+
+.materialUpload {
+ &-title {
+ font-size: 12px;
+ line-height: 20px;
+ padding: 12px;
+ background-color: @common_bg_z1_color;
+ }
+
+ &-upload {
+ font-size: 12px;
+ line-height: 20px;
+ color: #ffffff;
+ position: fixed;
+ right: 16px;
+ bottom: 082px;
+ width: 80px;
+ height: 80px;
+ background: linear-gradient(138deg, #007fff 0%, #0062ff 100%);
+ border-radius: 50%;
+ box-shadow: 1px 1px 6px 0px rgba(0, 0, 0, 0.25);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+ }
+
+ &-header {
+ padding: 12px;
+ font-weight: 600;
+ }
+
+ &-card {
+ background-color: @common_bg_z1_color;
+ border-radius: 10px;
+ padding: 12px;
+ margin: 0 12px 8px;
+
+ &-avatar {
+ display: flex;
+ align-items: center;
+
+ &-right {
+ padding-left: 8px;
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ }
+ }
+
+ &-title {
+ display: flex;
+ align-items: center;
+
+ &-right {
+ font-size: 12px;
+ line-height: 20px;
+ color: @theme_primary1_color;
+ flex: 1;
+ text-align: right;
+ padding-left: 4px;
+ }
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ display: flex;
+ align-items: center;
+ margin-top: 4px;
+
+ &-left {
+ color: @common_level2_base_color;
+ padding-right: 24px;
+ }
+
+ &-right {
+ flex: 1;
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ overflow: hidden;
+
+ .ellipsis-text-1 {
+ max-width: 100%;
+ }
+ }
+
+ &-icon {
+ margin-right: 4px;
+ }
+ }
+ }
+
+ &-card2 {
+ background-color: @common_bg_color;
+ margin-top: 8px;
+ border-radius: 10px;
+ padding: 12px;
+ }
+
+ &-uploadCard {
+ padding: 16px 12px;
+
+ &-item {
+ padding: 12px 16px;
+ background-color: @common_bg_z1_color;
+ border-radius: 10px;
+ margin-bottom: 8px;
+
+ &-text {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ padding: 12px 0;
+ border-top: 1px solid @common_line_hard_color;
+ padding: 4px 0 0;
+ margin-top: 16px;
+ }
+ }
+
+ &-imgBox {
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ }
+
+ &-img {
+ padding: 16px 24px 0 0;
+ }
+
+ &-imgAdd {
+ width: 42px;
+ height: 42px;
+ background: @common_bg_z1_color;
+ border: 1px dashed rgba(0, 0, 0, 0.5);
+ border-radius: 2px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin: 16px 24px 0 0;
+ }
+
+ .mediateRegister-formItem {
+ border-radius: 10px;
+ margin-bottom: 8px;
+ }
+ }
+}
+
+.mediateEventList {
+ &-searchBar {
+ position: fixed;
+ top: @navBarHeight;
+ left: 0;
+ right: 0;
+ z-index: 99;
+
+ &-height {
+ height: 48px;
+ }
+ }
+
+ &-main {
+ height: calc(100% - @navBarHeight - 48px - 24px);
+ padding: 4px 12px 12px;
+ overflow: hidden;
+ }
+}
+
+.mediateEventListSearch {
+ &-main {
+ height: calc(100% - @navBarHeight - 48px - 24px);
+ padding: 12px;
+ display: flex;
+ flex-direction: column;
+
+ &-title {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 12px;
+ }
+
+ &-list {
+ flex: 1;
+ overflow: hidden;
+ }
+ }
+}
+
+.mediateDetail {
+ height: calc(100% - @navBarHeight);
+ display: flex;
+ flex-direction: column;
+
+ &-tab {
+ padding: 20px 0;
+
+ .myTabs-tab {
+ flex: 1;
+ margin: 0;
+ }
+ }
+
+ &-main {
+ flex: 1;
+ overflow-y: auto;
+ padding: 0 12px;
+
+ &-card {
+ background-color: @common_bg_z1_color;
+ border-radius: 10px;
+ overflow: hidden;
+ padding: 12px 16px;
+ margin-bottom: 8px;
+ }
+
+ .dtm-list-line,
+ .dtm-list-item {
+ padding: 0;
+ min-height: 0;
+ }
+ }
+
+ &-btn {
+ padding: 16px 12px;
+ }
+}
+
+.mediateDetailMsg {
+ flex: 1;
+ padding: 0 12px;
+ display: flex;
+ flex-direction: column;
+
+ &-card {
+ padding: 12px 16px;
+ border-radius: 10px;
+ background-color: @common_bg_z1_color;
+ margin-bottom: 8px;
+ overflow: hidden;
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+
+ &-img3 {
+ font-size: 37px;
+ color: @theme_primary1_color;
+ margin-right: 12px;
+ }
+
+ &-img1 {
+ margin-right: 12px;
+ }
+
+ &-img2 {
+ margin-right: 8px;
+ }
+
+ &-imgSuccess {
+ font-size: 44px;
+ color: @theme_primary1_color;
+ margin-right: 8px;
+ }
+
+ &-title {
+ display: flex;
+ align-items: center;
+ margin-bottom: 2px;
+
+ .public-tag2 {
+ margin-left: 8px;
+ }
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ display: flex;
+ align-items: center;
+
+ .public-rightBorder {
+ flex: 1;
+ }
+ }
+
+ &-phone {
+ color: #71b4e3;
+ display: flex;
+ align-items: center;
+ margin-left: 8px;
+ font-size: 12px;
+ line-height: 20px;
+
+ &-icon {
+ width: 14px;
+ height: 14px;
+ border-radius: 50%;
+ border: 1px solid #71b4e3;
+ border-radius: 50%;
+ line-height: 13px;
+ text-align: center;
+ margin-right: 4px;
+ font-size: 10px;
+ }
+ }
+ }
+
+ &-dashed {
+ margin: 12px 0;
+ border-top: 1px dashed @common_line_hard_color;
+ }
+
+ &-solid {
+ margin: 12px 0;
+ border-top: 1px solid @common_line_hard_color;
+ }
+
+ &-success {
+ color: @common_green1_color;
+ }
+
+ &-fail {
+ color: @common_red1_color;
+ }
+
+ &-card2 {
+ padding: 12px 16px;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ background-color: @common_bg_z1_color;
+ border-radius: 10px;
+ }
+
+ &-load {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+
+ &-spin {
+ animation: spin 1s infinite;
+ }
+
+ h4 {
+ margin-top: 12px;
+ }
+
+ &-subtitle {
+ color: @common_level2_base_color;
+ margin-top: 8px;
+ }
+ }
+
+ &-meeting {
+ margin-top: 8px;
+ padding: 8px;
+ background: rgba(82, 196, 26, 0.1);
+ border-radius: 5px;
+ display: flex;
+ align-items: center;
+
+ &-left {
+ padding: 6px 8px;
+ background: #52c41a;
+ border-radius: 5px;
+ text-align: center;
+ color: @common_bg_z1_color;
+ margin-right: 8px;
+
+ &-day {
+ font-size: 16px;
+ line-height: 16px;
+ }
+
+ &-month {
+ font-size: 12px;
+ line-height: 12px;
+ margin-top: 8px;
+ }
+ }
+
+ &-right {
+ flex: 1;
+ font-size: 12px;
+ line-height: 20px;
+
+ .public-tag {
+ line-height: 16px;
+ margin-left: 4px;
+ }
+ }
+ }
+
+ &-ing {
+ margin-top: 8px;
+ padding: 12px 16px;
+ background: rgba(113, 180, 227, 0.1);
+ border-radius: 5px;
+ font-size: 12px;
+ line-height: 20px;
+ }
+
+ &-space {
+ display: flex;
+
+ &-right {
+ flex: 1;
+ }
+ }
+
+ &-file {
+ margin-top: 8px;
+ padding: 8px;
+ background-color: rgba(5, 174, 174, 0.1);
+ border-radius: 5px;
+ display: flex;
+ align-items: center;
+
+ &-left {
+ width: 51px;
+ padding: 4px 0;
+ background-color: #05aeae;
+ border-radius: 5px;
+ text-align: center;
+ color: @common_bg_z1_color;
+ margin-right: 8px;
+ font-size: 16px;
+ line-height: 20px;
+ }
+
+ &-title {
+ font-size: 12px;
+ line-height: 12px;
+ font-weight: 600;
+ margin-bottom: 10px;
+ }
+
+ .public-tag {
+ line-height: 16px;
+ }
+ }
+
+ &-file2 {
+ background-color: rgba(236, 207, 165, 0.4);
+
+ .mediateDetailMsg-file-left {
+ background-color: #552719;
+ }
+ }
+}
+
+.mediateConclude {
+ &-dashed {
+ margin: 0 16px;
+ border-top: 1px dashed @common_line_hard_color;
+ }
+
+ &-btnBox {
+ display: flex;
+ margin: 0 -8px -8px -8px;
+ }
+
+ &-btn {
+ flex: 1;
+ padding: 8px;
+ text-align: center;
+
+ &-item {
+ padding: 8px 0;
+ background: #f2f2f2;
+ border: 1px solid #f2f2f2;
+ border-radius: 5px;
+ color: @common_level2_base_color;
+ }
+
+ &-itemActive {
+ background-color: #f3f9ff;
+ color: @theme_primary1_color;
+ border-color: @theme_primary1_color;
+ position: relative;
+ overflow: hidden;
+ }
+
+ &-activeIconBox {
+ position: absolute;
+ background-color: @theme_primary1_color;
+ bottom: -15px;
+ right: -18px;
+ width: 30px;
+ height: 30px;
+ transform: rotate(45deg);
+ }
+
+ &-activeIcon {
+ color: @common_bg_z1_color;
+ position: absolute;
+ font-size: 12px;
+ bottom: 0;
+ right: 0;
+ }
+ }
+}
+
+@keyframes spin {
+ 100% {
+ -webkit-transform: rotate(360deg);
+ -ms-transform: rotate(360deg);
+ transform: rotate(360deg);
+ }
+}
diff --git a/src/components/oldsterEvent/GoodTreatmentList.jsx b/src/components/oldsterEvent/GoodTreatmentList.jsx
new file mode 100644
index 0000000..90aceeb
--- /dev/null
+++ b/src/components/oldsterEvent/GoodTreatmentList.jsx
@@ -0,0 +1,96 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-12-26 11:18:30
+ * @LastEditTime: 2022-12-26 11:32:28
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 老年优待证代办 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import { TelephoneOutlined, LocationOutlined } from 'dd-icons';
+import MyList from '../MyList';
+import { dateFormat, searchTitle, setLocal } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const GoodTreatmentListCom = ({ type, search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 辖区未办老人跳转登记
+ function handleGoToRegister(item) {
+ if (type === '1') {
+ history.push(`/hztGrid/goodTreatmentList/detail?personId=${item.personId}`);
+ return;
+ }
+ setLocal('goodTreatment', item);
+ history.push(`/hztGrid/goodTreatmentRegister?personId=${item.personId}`);
+ }
+
+ // 数据更新
+ useEffect(() => {
+ if (routerStatus.spinPage['goodTreatmentList']) {
+ getData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('goodTreatmentList');
+ routerStatus.clearSpinPage('goodTreatmentList');
+ }
+ }, [routerStatus.spinPage['goodTreatmentList']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item) => {
+ return (
+ <div onClick={() => handleGoToRegister(item)} className="oldsterEvent-main-item">
+ <h5>{searchValue ? searchTitle(item.personName, searchValue) : item.personName}</h5>
+ <div className="oldsterEvent-main-item-subtitle">
+ <div>{item.sexDesc || '-'}</div>
+ <div className="public-rightBorder">{item.age || '-'}岁</div>
+ <div className="public-rightBorder">{dateFormat(item.birthdate)}出生</div>
+ <div className="public-rightBorder">
+ <TelephoneOutlined />
+ <span style={{ marginLeft: '4px' }}>{item.contact || '-'}</span>
+ </div>
+ </div>
+ <div className="oldsterEvent-main-item-subtitle">
+ <div>
+ <LocationOutlined />
+ </div>
+ <div style={{ flex: 1, paddingLeft: '4px' }}>
+ {item.districtName || ''}
+ {item.subdistrictName || ''}
+ {item.communityName || ''}
+ {item.dwellingPlace || ''}
+ </div>
+ </div>
+ <Space style={{ '--gap': '8px', marginTop: '4px' }} wrap>
+ <div className="public-tag2">{item.agentGridNum}</div>
+ {item.handleNum && <div className="public-tag2">{item.handleNum}次代办</div>}
+ {item.result && (
+ <div
+ className={`public-tag2 public-tag2-${
+ item.result === '21_00019-2' ? 'green' : item.result === '21_00019-3' ? 'red' : item.result === '21_00019-4' ? 'organ2' : 'blue3'
+ }`}
+ >
+ {item.resultDesc}
+ </div>
+ )}
+ </Space>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default GoodTreatmentListCom;
diff --git a/src/components/oldsterEvent/SubsidyList.jsx b/src/components/oldsterEvent/SubsidyList.jsx
new file mode 100644
index 0000000..1012d6a
--- /dev/null
+++ b/src/components/oldsterEvent/SubsidyList.jsx
@@ -0,0 +1,96 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-12-26 11:32:22
+ * @LastEditTime: 2022-12-26 11:46:33
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 高龄长寿老人补贴申领代办 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import { TelephoneOutlined, LocationOutlined } from 'dd-icons';
+import MyList from '../MyList';
+import { dateFormat, searchTitle, setLocal } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const SubsidyListCom = ({ type, search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 辖区未办老人跳转登记
+ function handleGoToRegister(item) {
+ if (type === '1') {
+ history.push(`/hztGrid/subsidyList/detail?personId=${item.personId}`);
+ return;
+ }
+ setLocal('subsidy', item);
+ history.push(`/hztGrid/subsidyRegister?personId=${item.personId}`);
+ }
+
+ // 数据更新
+ useEffect(() => {
+ if (routerStatus.spinPage['subsidyList']) {
+ getData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('subsidyList');
+ routerStatus.clearSpinPage('subsidyList');
+ }
+ }, [routerStatus.spinPage['subsidyList']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item) => {
+ return (
+ <div onClick={() => handleGoToRegister(item)} className="oldsterEvent-main-item">
+ <h5>{searchValue ? searchTitle(item.personName, searchValue) : item.personName}</h5>
+ <div className="oldsterEvent-main-item-subtitle">
+ <div>{item.sexDesc || '-'}</div>
+ <div className="public-rightBorder">{item.age || '-'}岁</div>
+ <div className="public-rightBorder">{dateFormat(item.birthdate)}出生</div>
+ <div className="public-rightBorder">
+ <TelephoneOutlined />
+ <span style={{ marginLeft: '4px' }}>{item.contact || '-'}</span>
+ </div>
+ </div>
+ <div className="oldsterEvent-main-item-subtitle">
+ <div>
+ <LocationOutlined />
+ </div>
+ <div style={{ flex: 1, paddingLeft: '4px' }}>
+ {item.districtName || ''}
+ {item.subdistrictName || ''}
+ {item.communityName || ''}
+ {item.dwellingPlace || ''}
+ </div>
+ </div>
+ <Space style={{ '--gap': '8px', marginTop: '4px' }} wrap>
+ <div className="public-tag2">{item.agentGridNum}</div>
+ {item.handleNum && <div className="public-tag2">{item.handleNum}次代办</div>}
+ {item.result && (
+ <div
+ className={`public-tag2 public-tag2-${
+ item.result === '21_00019-2' ? 'green' : item.result === '21_00019-3' ? 'red' : item.result === '21_00019-4' ? 'organ2' : 'blue3'
+ }`}
+ >
+ {item.resultDesc}
+ </div>
+ )}
+ </Space>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default SubsidyListCom;
diff --git a/src/components/person/MorePersonMsg.jsx b/src/components/person/MorePersonMsg.jsx
new file mode 100644
index 0000000..8a296af
--- /dev/null
+++ b/src/components/person/MorePersonMsg.jsx
@@ -0,0 +1,65 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-09-13 16:01:52
+ * @LastEditTime: 2023-03-10 16:23:44
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 多处登记提示
+ */
+import React, { useState, useEffect } from 'react';
+import { Button, Checkbox, Form, Space, TextareaItem, Toast } from 'dingtalk-design-mobile';
+import { LocationOutlined, HomeOutlined, ClockOutlined } from 'dd-icons';
+import MyList from './../MyList';
+import obj from '../../utils/selectOption';
+import { searchTitle, dateFormat } from '../../utils/utility';
+import MyModal from '../MyModal';
+
+const MorePersonMsg = ({ data, params, visible, onClose, onSave }) => {
+ console.log('data', data)
+ console.log('params', params)
+ return (
+ <MyModal bodyClass="taskHandle-returnModal" visible={visible} onClose={onClose}>
+ <div className="taskHandle-returnModal-title h7">多处登记提示</div>
+ <div style={{ display: 'flex', flexDirection: 'column' }}>
+ <div className="taskHandle-returnModal-contentPadding" >
+ <span>本次登记：{searchTitle(params.personName, params.personName)}，证件号{searchTitle(params.idcard, params.idcard)}存在以下{data.length ? searchTitle(String(data.length), String(data.length)) : '多'}处登记信息 </span>
+ <div style={{ height: '240px', marginTop: '8px', overflow: 'scroll' }}>
+ {data.map((item, index) => {
+ return <div style={{ flexDirection: 'column' }} className="livingTrack-card-main" key={index}>
+ <div style={{ display: 'flex', marginBottom: '8px' }}>
+ <div style={{ height: '20px', display: 'flex', alignItems: 'center' }}>
+ <LocationOutlined />
+ </div>
+ <div className="livingTrack-card-main-flex">{item.houseaddress} | <span style={{ color: 'rgba(0, 176, 66, 1)' }}>{item.liveTypeDesc}</span></div>
+ </div>
+ <div style={{ display: 'flex', marginBottom: '8px' }}>
+ <div style={{ height: '20px', display: 'flex', alignItems: 'center' }}>
+ <HomeOutlined />
+ </div>
+ <div className="livingTrack-card-main-flex">{item.districtName} {item.subdistrictName} {item.communityName} | 网格员：{item.grider}</div>
+ </div>
+ <div style={{ display: 'flex', marginBottom: '8px' }}>
+ <div style={{ height: '20px', display: 'flex', alignItems: 'center' }}>
+ <ClockOutlined />
+ </div>
+ <div className="livingTrack-card-main-flex">登记时间：{dateFormat(item.editorTime)}</div>
+ </div>
+ </div>
+ })}
+ </div>
+ </div>
+ <div style={{ flex: '1', background: '#fff' }} className="myModal-action">
+ <div onClick={onClose} className="myModal-action-item1">
+ 暂不登记
+ </div>
+ <div onClick={() => onSave(params)} className="myModal-action-item2">
+ 继续登记
+ </div>
+ </div>
+ </div>
+ </MyModal>
+ );
+};
+
+export default MorePersonMsg;
diff --git a/src/components/resourcePool/List.jsx b/src/components/resourcePool/List.jsx
new file mode 100644
index 0000000..bf1ff83
--- /dev/null
+++ b/src/components/resourcePool/List.jsx
@@ -0,0 +1,97 @@
+
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import { label, resourcePool_1, resourcePool_2 } from '../../assets/cardImg';
+import routerStatus from '../../status/router';
+
+const ResourcePoolList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, modalData, getResourcePoolData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getResourcePoolData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ //列表更新
+ useEffect(() => {
+ if (routerStatus.spinPage['resourcePool']) {
+ getResourcePoolData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('resourcePool');
+ routerStatus.clearSpinPage('resourcePool');
+ }
+ }, [routerStatus.spinPage['resourcePool']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ bottomText={'已加载全部数据'}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ key={index}
+ >
+ <div className='cardFollow-card'>
+ <div style={{ display: "flex", justifyContent: 'space-between' }}>
+ <Space style={{ '--gap': '8px' }}>
+ <div className="cardFollow-title">{item.personName || '-'}</div>
+ {
+ item.markNum > 0 &&
+ <div className="cardFollow-label" onClick={() => history.push(`/socialSecurityCard/markInfo?idcard=${item.idcard}&personName=${item.personName}`)}> <img style={{ width: '16px' }} src={label} alt="" />{item.markNum + '条标记信息'}</div>
+ }
+ </Space>
+ <div><span className='cardFollow-label-grey'>未申领</span></div>
+ </div>
+ <div className="cardFollow-dashed"></div>
+ <div onClick={() => modalData(item)}>
+ <Space direction='vertical' style={{ '--gap': '8px' }}>
+ <div className="cardFollow-main">
+ <div className='cardFollow-main-title'>身份证号：</div>
+ <div className="cardFollow-main-text">{item.idcard}</div>
+ </div>
+ <div className="cardFollow-main">
+ <div className='cardFollow-main-title'>联系电话：</div>
+ <div className="cardFollow-main-text">{item.contact}</div>
+ </div>
+ <div className="cardFollow-main">
+ <div className='cardFollow-main-title'>通讯地址：</div>
+ <div className="cardFollow-main-text">{item.houseaddress}</div>
+ </div>
+ </Space>
+
+ </div>
+ <div className="cardFollow-dashed"></div>
+ <div className="resourcePool-foot">
+ {
+ item.applyFlair === null ?
+ <div className="resourcePool-foot-right">-</div> :
+ <>
+ <div className="resourcePool-foot-left">
+ {
+ (item.applyFlair === 0 || item.applyFlair === 1) &&
+ <img style={{ width: '16px' }} src={item.applyFlair === 1 ? resourcePool_1 : resourcePool_2} alt="" />
+ }
+ </div>
+ <div className="resourcePool-foot-right">
+ <div className="resourcePool-foot-right-title">{item.applyFlair === 1 ? '符合制卡条件' : item.applyFlair === 0 ? '不符合制卡条件' : '-'}</div>
+ </div>
+ </>
+ }
+ </div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default ResourcePoolList;
diff --git a/src/components/room/ChangeRoomMsg.jsx b/src/components/room/ChangeRoomMsg.jsx
new file mode 100644
index 0000000..ff1b495
--- /dev/null
+++ b/src/components/room/ChangeRoomMsg.jsx
@@ -0,0 +1,103 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-13 16:01:52
+ * @LastEditTime: 2023-05-19 11:27:13
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 新增房间 or 修改房间弹窗组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Input, Button, Picker } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined, DownArrow2Outlined } from 'dd-icons';
+import { checkIsNum } from '../../utils/utility';
+import obj from '../../utils/selectOption';
+import MyModal from '../MyModal';
+
+// type:1房号 2.地名地址与房名房址一致
+const ChangeRoomMsg = ({ data, roomNumberSelect, visible, onClose, onSave, type = '1', detailLook = true }) => {
+
+ const [roomMsg, setRoomMsg] = useState(roomNumberSelect ? { ...data, ...roomNumberSelect } : { ...data });
+
+ useEffect(() => {
+ setRoomMsg(roomNumberSelect ? { ...data, ...roomNumberSelect } : { ...data });
+ }, [data]);
+
+ return (
+ <MyModal zIndex={889} visible={visible} center onClose={() => onClose(roomMsg)}>
+ <div className="room-changeRoomMsg">
+ <div className="room-changeRoomMsg-header">
+ <h4>房间信息</h4>
+ <CloseBoldOutlined onClick={() => onClose(roomMsg)} className="room-changeRoomMsg-close" />
+ </div>
+ {
+ type == '1' &&
+ <div className="room-changeRoomMsg-form">
+ <div className="room-changeRoomMsg-form-item">
+ <h5>单元号</h5>
+ <div className="room-input">
+ <Input onChange={(value) => setRoomMsg({ ...roomMsg, unit: checkIsNum(value) })}
+ value={roomMsg.unit || ''} placeholder="请输入" clear />
+ </div>
+ </div>
+ <div className="room-changeRoomMsg-form-item">
+ <h5>房号</h5>
+ <div className="room-input">
+ <Input
+ onChange={(value) => setRoomMsg({ ...roomMsg, housenumber: value.replace(/，/g, ",") })}
+ value={roomMsg.housenumber || ''}
+ placeholder="请输入户（室）牌号"
+ clear
+ />
+ </div>
+ </div>
+ </div>
+ }
+ {/* {
+ type == '2' &&
+ <div className="room-changeRoomMsg-form">
+ <div className="room-changeRoomMsg-form-item">
+ <div style={{ marginBottom: '8px' }}> <span style={{ fontWeight: '600' }}>房名房址：</span><span style={{ color: 'rgba(23, 26, 29, 0.6)' }}>{roomMsg.houseaddress || '-'}</span></div>
+ </div>
+ </div>
+ } */}
+ <div>
+ <h5>用途</h5>
+ <Picker
+ data={[obj.houseUse]}
+ value={(!roomMsg.houseUse || roomMsg.houseUse == 'undefined') ? [] : [roomMsg.houseUse]}
+ onChange={(e) => {
+ setRoomMsg({ ...roomMsg, houseUseName: obj.houseUse.find((it) => it.value == e[0]).label, houseUse: e[0] });
+ }}
+ title="用途"
+ okText="确定"
+ cascade={false}
+ >
+ {(!roomMsg.houseUse || roomMsg.houseUse == 'undefined') ?
+ <div className="room-input room-changeRoomMsg-form-picker room-changeRoomMsg-form-extra select-color">
+ <div>请选择</div>
+ <DownArrow2Outlined />
+ </div> : <div className="room-input room-changeRoomMsg-form-picker room-changeRoomMsg-form-extra">
+ {roomMsg.houseUseName}
+ <DownArrow2Outlined />
+ </div>
+ }
+ </Picker>
+ </div>
+ <div style={{ display: 'flex', marginTop: '8px' }}>
+ {detailLook && <Button
+ onClick={() => onSave('detail', roomMsg)}
+ style={{ flex: 1, marginRight: '8px', color: '#007FFF', border: '1px solid #007FFF' }}
+ >
+ 房间预览
+ </Button>}
+ <Button style={{ flex: 1 }} onClick={() => onSave('OnOk', roomMsg)} type="primary">
+ 保存信息
+ </Button>
+ </div>
+ </div>
+ </MyModal>
+ );
+};
+
+export default ChangeRoomMsg;
diff --git a/src/components/room/List.jsx b/src/components/room/List.jsx
new file mode 100644
index 0000000..0e5e72f
--- /dev/null
+++ b/src/components/room/List.jsx
@@ -0,0 +1,101 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 16:23:48
+ * @LastEditTime: 2023-05-24 19:55:38
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 房间列表 - 列表
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import RoomNumberGrid from './RoomNumberGrid';
+import ImgShow from '../ImgShow';
+import { room_1 } from '../../assets/icon';
+import { searchTitle, dateFormat, getUpdateStr, getQueryString, appUrl } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const RoomList = ({ search, pattern, data, hasMore, getScrollTopKey, address, scrollTop, searchValue, getRoomData }) => {
+ const history = useHistory();
+
+ const buildingAddress = getQueryString('address'); // 楼栋名称
+
+ // 跳转到房间详情
+ function handleGoToDetail(id, item) {
+ const { unit, housenumber, houseUseName, houseUse } = item;
+ history.push(
+ `/hztGrid/room/detail?id=${id}&address=${buildingAddress}`
+ );
+ }
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getRoomData({ ...search, page: search.page + 1, size: 10 }, pattern, '', callback);
+ }
+
+ // 处理当房间被删除时返回到此页面刷新
+ useEffect(() => {
+ if (routerStatus.spinPage['room']) {
+ getRoomData({ ...search, page: 1, size: search.page * search.size }, pattern, 'spin', '');
+ routerStatus.setSpinPage('building');
+ routerStatus.clearSpinPage('room');
+ routerStatus.setPageScrollTopNow('room');
+ }
+ }, [routerStatus.spinPage['room']]);
+
+ return pattern === 1 ? (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="room-card-bottomBorder"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => handleGoToDetail(item.id, item)}
+ >
+ <div className="room-card">
+ <div className="room-card-imgBox">
+ <ImgShow imageUrl={item.fileId ? appUrl.fileUrl + '/dingTalk/api/fileInfo/show/' + item.fileId : ''} defaultImg={room_1} width={58} noTitle isShowBig={false} />
+ </div>
+ <div className="room-card-main">
+ <div className="room-title">
+ {item.taskTagList?.map((x, t) => (
+ <span key={t} className={`public-tag public-tag-${x === '21_00016-1' ? 'blue' : x === '21_00016-2' ? 'red' : 'green'}`}>
+ {x === '21_00016-1' ? '待排查' : x === '21_00016-2' ? '待核实' : '地址未同步'}
+ </span>
+ ))}
+ <span>{searchValue ? ((!item.unit && !item.housenumber) ? '暂无房号' : searchTitle((item.unit ? `${item.unit}-` : '') + (item.housenumber || ''), searchValue)) : ((item.unit ? `${item.unit}-` : '') + (item.housenumber || '')) || buildingAddress}</span>
+ </div>
+ <div className="room-subtitle">
+ <div className="room-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="room-subtitle-text">{item.personCount || 0}人口</div>
+ <div className="public-split" />
+ <div className="room-subtitle-text">{dateFormat(item.updateTime)}更新</div>
+ </div>
+ <Space>
+ {getUpdateStr(item.updateTime) ? <div className="public-tag2">{getUpdateStr(item.updateTime)}</div> : null}
+ {item.isHouseRent ? <div className="public-tag2">{item.isHouseRent === '0' ? '自用' : '出租'}</div> : null}
+ {item.inputStatusName && <div className="public-tag2">{item.inputStatusName}</div>}
+ </Space>
+ </div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ ) : (
+ <RoomNumberGrid
+ data={data}
+ onClickRoom={(value) => handleGoToDetail(value.id, { ...value, unit: value.unit || '', housenumber: value.housenumber })}
+ />
+ );
+};
+
+export default RoomList;
diff --git a/src/components/room/OutPersonMsg.jsx b/src/components/room/OutPersonMsg.jsx
new file mode 100644
index 0000000..80b3e70
--- /dev/null
+++ b/src/components/room/OutPersonMsg.jsx
@@ -0,0 +1,79 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-09-13 16:01:52
+ * @LastEditTime: 2023-03-07 21:30:09
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 居民迁出or整户迁出弹窗组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Button, Checkbox, Form, Space, TextareaItem, Toast } from 'dingtalk-design-mobile';
+import { CloseBoldOutlined, DownArrow2Outlined } from 'dd-icons';
+import obj from '../../utils/selectOption';
+import MyModal from '../MyModal';
+
+const OutPersonMsg = ({ data, visible, onClose, onSave }) => {
+ const [roomMsg, setRoomMsg] = useState(data);
+ const [outReason, setOutReason] = useState(obj.outReason.map((item) => ({ ...item, checked: item.value === '01' ? true : false })));
+
+ useEffect(() => {
+ setRoomMsg(data);
+ }, [data]);
+
+ return (
+ <MyModal bodyClass="taskHandle-returnModal" visible={visible} onClose={onClose}>
+ <div className="taskHandle-returnModal-title h7">迁出原因</div>
+ <div style={{ padding: "12px 16px" }}>
+ <div>
+ {outReason.map((item, index) => (
+ <div className="person-detail-modal-checkbox-l" key={index}>
+ <Checkbox
+ name={item.value}
+ checked={item.checked || false}
+ onChange={(e) => {
+ setOutReason(outReason.map((i) => ({ ...i, checked: i.value == item.value ? true : false })));
+ setRoomMsg({ ...roomMsg, outReason: item.value, outReasonDesc: item.label });
+ }}
+ className="person-detail-modal-checkbox"
+ />
+ <span className="person-detail-modal-checkbox-text">{item.label}</span>
+ </div>
+ ))}
+ </div>
+ <div>
+ {roomMsg.outReason == '99' && (
+ <Form.Item
+ position="brief"
+ className="person-detail-modal-input"
+ label={
+ <Space align="center">
+ <span style={{ fontSize: '16px' }}>迁出原因</span>
+ <span className="public-tag4">必填</span>
+ </Space>
+ }
+ >
+ <TextareaItem
+ onChange={(value) => setRoomMsg({ ...roomMsg, outContent: value })}
+ value={roomMsg.outContent}
+ className="render-form-view-input-brief"
+ placeholder="请输入"
+ rows={5}
+ />
+ </Form.Item>
+ )}
+ </div>
+ </div>
+ <div className="myModal-action">
+ <div onClick={onClose} className="myModal-action-item1">
+ 我再想想
+ </div>
+ <div onClick={() => onSave(roomMsg)} className="myModal-action-item2">
+ 确定迁出
+ </div>
+ </div>
+ </MyModal>
+ );
+};
+
+export default OutPersonMsg;
diff --git a/src/components/room/ResidentMsg.jsx b/src/components/room/ResidentMsg.jsx
new file mode 100644
index 0000000..cf082c8
--- /dev/null
+++ b/src/components/room/ResidentMsg.jsx
@@ -0,0 +1,96 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-13 14:27:46
+ * @LastEditTime: 2023-03-15 08:54:49
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 房间详情页 - 居民信息
+ */
+import React from 'react';
+import { useHistory } from 'react-router-dom';
+import { Button } from 'dingtalk-design-mobile';
+import { RightArrow2Outlined, AddMembersOutlined } from 'dd-icons';
+import { dateFormat, setLocal } from '../../utils/utility';
+
+const ResidentMsg = ({ houseId, onlyCheck, data, onClickFamily }) => {
+ const history = useHistory();
+
+ return (
+ <div className="roomDetail-resident">
+ {data?.map((x, t) => {
+ let persons = x.residentInfoDTO || [];
+ return (
+ <div className="roomDetail-resident-item" key={t}>
+ <div onClick={() => onClickFamily(x, t)} className="roomDetail-resident-item-top">
+ <div>
+ 分户{t + 1}（{persons.length}人）
+ </div>
+ {!onlyCheck && (
+ <div className="roomDetail-resident-item-top-icon">
+ <RightArrow2Outlined />
+ </div>
+ )}
+ </div>
+ <div className="roomDetail-resident-item-main">
+ {persons.length === 0 && !onlyCheck ? (
+ <>
+ <div className="roomDetail-resident-item-person">
+ <Button
+ onClick={() => {
+ history.push(`/hztGrid/person/personForm?houseId=${houseId}&formType=1&familyId=${x.familyId}`);
+ setLocal('familyData', { list: [], familyPage: 0, hoverPerson: 0 });
+ }}
+ icon={<AddMembersOutlined />}
+ size="middle"
+ style={{ width: '100%', '--background-color': '#edeef0', border: 'none' }}
+ >
+ 点击添加住户信息
+ </Button>
+ </div>
+ </>
+ ) : (
+ <>
+ {persons.map((item, index) => {
+ return (
+ <div
+ onClick={() => {
+ if (!onlyCheck) {
+ history.push(`/hztGrid/person/detail?personId=${item.personId}&familyId=${x.familyId}&houseId=${houseId}`);
+ }
+ }}
+ className="roomDetail-resident-item-person"
+ key={index}
+ >
+ <div className={`roomDetail-resident-item-person-${item.roleofhold === '户主' ? 'left1' : 'left2'}`}>
+ {item.roleofhold?.substring(0, 2)}
+ </div>
+ <div className="roomDetail-resident-item-person-right">
+ <div className="roomDetail-resident-item-person-title ellipsis-text-1">
+ <span>{item.personName}</span>
+ <span>{item.contact}</span>
+ {item.updateTime && <span className="public-tag2">{dateFormat(item.updateTime)}更新</span>}
+ </div>
+ <div style={{ height: '4px' }}></div>
+ <div className="roomDetail-resident-item-person-desc ellipsis-text-1">
+ <span>{item.idcard || '-'}</span>
+ {item.createTime && <span className="public-rightBorder">{dateFormat(item.createTime)}登记</span>}
+ </div>
+ {/* TODO:暂无迁出返回 <div className={`roomDetail-resident-item-person-${'red'}`}>
+ <span className="public-rightBorder">迁出</span>
+ </div> */}
+ </div>
+ </div>
+ );
+ })}
+ </>
+ )}
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ );
+};
+
+export default ResidentMsg;
diff --git a/src/components/room/RoomMsg.jsx b/src/components/room/RoomMsg.jsx
new file mode 100644
index 0000000..b4cd66a
--- /dev/null
+++ b/src/components/room/RoomMsg.jsx
@@ -0,0 +1,136 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-13 14:27:55
+ * @LastEditTime: 2023-05-19 11:23:24
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 房间详情页 - 房间信息
+ */
+import React from 'react';
+import { RightArrow2Outlined, LocationOutlined } from 'dd-icons';
+import { useHistory } from 'react-router-dom';
+import { location_icon } from '../../assets/icon';
+import { avatar1, avatar2 } from '../../assets/img';
+import Descriptions from '../Descriptions';
+import ImgShow from '../ImgShow';
+const RoomMsg = ({ onlyCheck, data, onChangeLoginStatus }) => {
+ const history = useHistory();
+ return (
+ <>
+ <div onClick={() => onChangeLoginStatus(data.inputStatus)} className="roomDetail-roomMsg-top">
+ <div>登记状态：{data.inputStatusName || '-'}</div>
+ {!onlyCheck && (
+ <div className="roomDetail-roomMsg-top-icon">
+ <RightArrow2Outlined />
+ </div>
+ )}
+ </div>
+ <div className="roomDetail-roomMsg-main">
+ <div className="roomDetail-roomMsg-card">
+ <Descriptions
+ data={[
+ { label: '房号', value: data.housenumber },
+ { label: '房间现状', value: data.houseStateDesc },
+ { label: '房间用途', value: data.houseUseName },
+ { label: '产权性质', value: data.houseNatureDesc },
+ { label: '房间类别', value: data.houseTypeDesc },
+ { label: '房间结构', value: data.houseStructureDesc },
+ ]}
+ title="基本信息"
+ topRightActionVisible={!onlyCheck}
+ onTopRightAction={() => history.push(`/hztGrid/room/FormRoom?id=${data.id}&tabPage=${'1'}`)}
+ />
+ <div className="roomDetail-msgCard roomDetail-msgCard-blue">
+ {!data.metaAddr ? (
+ <>
+ <div className="roomDetail-msgCard-avatar">
+ <img src={location_icon} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-desc">尚未关联公安标准地址</div>
+ </>
+ ) : (
+ <>
+ <div className="roomDetail-msgCard-avatar roomDetail-msgCard-avatar-blue">
+ <LocationOutlined />
+ </div>
+ <div className="roomDetail-msgCard-text">公安标准地址：{data.metaAddr}</div>
+ </>
+ )}
+ </div>
+ </div>
+ {data.houseState == '2' && (
+ <div className="roomDetail-roomMsg-card">
+ <Descriptions
+ data={[
+ { label: '出租用途', value: data.leasePurposeDesc },
+ { label: '隐患类型', value: data.hiddenDangerTypeDesc },
+ ]}
+ title="出租信息"
+ />
+ <div className="roomDetail-msgCard roomDetail-msgCard-blue">
+ <div className="roomDetail-msgCard-avatar">
+ <img src={avatar1} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <div className="roomDetail-msgCard-content-title ellipsis-text-1">
+ <span>{data.landName || '-'}</span>
+ <span>{data.landPhone || '-'}</span>
+ <span className="public-tag2 public-tag2-blue">房东</span>
+ </div>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>{data.landCardtypeDesc || '-'}</span>
+ <span className="public-rightBorder">{data.landIdcard || '-'}</span>
+ </div>
+ </div>
+ </div>
+ <div className="roomDetail-msgCard roomDetail-msgCard-blue">
+ <div className="roomDetail-msgCard-avatar">
+ <img src={avatar2} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <div className="roomDetail-msgCard-content-title ellipsis-text-1">
+ <span>{data.manageName || '-'}</span>
+ <span>{data.managePhone || '-'}</span>
+ <span className="public-tag2 public-tag2-blue">代管人</span>
+ </div>
+ <div className="roomDetail-msgCard-content-desc ellipsis-text-1">
+ <span>{data.manageCardtypeDesc || '-'}</span>
+ <span className="public-rightBorder">{data.manageIdcard || '-'}</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
+ <div className="roomDetail-roomMsg-card">
+ <div className="roomDetail-roomMsg-card-title">房间附件</div>
+ <div className="roomDetail-roomMsg-card-file">
+ {data.fileList?.map((x, t) => (
+ <div className="roomDetail-roomMsg-card-file-item" key={t}>
+ <ImgShow img={x.showUrl} allImg={data.fileList} title={x.name} />
+ </div>
+ ))}
+ {(data.fileList || []).length === 0 && (
+ <div className="roomDetail-roomMsg-card-file-item">
+ <ImgShow />
+ </div>
+ )}
+ </div>
+ </div>
+ <div className="roomDetail-roomMsg-card">
+ <Descriptions
+ data={[
+ { label: '蟑迹鼠迹', value: data.mouseStatus == 0 ? '无' : data.mouseStatus == 1 ? '有' : '-' },
+ { label: '卫生状况', value: data.cleanStatus == 0 ? '良好' : data.cleanStatus == 1 ? '差' : '-' },
+ { label: '是否关注状况', value: data.focusType == '0' ? '正常' : data.focusType == '1' ? '关注' : '-' },
+ { label: '房间简称', value: data.shortName },
+ ]}
+ title="其他信息"
+ />
+ </div>
+ </div>
+ </>
+ );
+};
+
+export default RoomMsg;
diff --git a/src/components/room/RoomNumberGrid.jsx b/src/components/room/RoomNumberGrid.jsx
new file mode 100644
index 0000000..d091ffc
--- /dev/null
+++ b/src/components/room/RoomNumberGrid.jsx
@@ -0,0 +1,92 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-10 08:42:39
+ * @LastEditTime: 2023-05-25 10:07:37
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 房间列表 - 房号模式
+ */
+import React, { useMemo } from 'react';
+import { Button, Space } from 'dingtalk-design-mobile';
+
+const RoomNumberGrid = ({ type, data = [], active, onClickRoom }) => {
+ const parentRef = React.useRef();
+
+ const datasource = useMemo(() => {
+ let arr = [];
+ let result = [];
+ data.forEach((x) => {
+ result.push({ unit: x.unit });
+ let list = x.housenumberList || [];
+ list.forEach((x, t) => {
+ if (t % 3 === 0) {
+ arr = [];
+ }
+ arr.push(x);
+ if (t % 3 === 2) {
+ result.push(arr);
+ }
+ });
+ if (list.length % 3 !== 0) {
+ let arr2 = [];
+ for (let i = list.length % 3; i >= 0; i--) {
+ arr2.push(list[list.length - i]);
+ }
+ result.push(arr2);
+ }
+ });
+ return result;
+ }, [data]);
+
+ let temp1 = data.filter((item) => !item.unit && !item.housenumber);//无单元无房号
+ let temp2 = data.filter((item) => item.housenumber );//有房号
+ let newData = temp1.concat(temp2);
+
+ console.log('newData', newData);
+ console.log('data', data);
+ return (
+ <>
+ <div ref={parentRef} style={{ height: '100%', width: '100%', overflowY: 'auto' }}>
+ {type === 'change' && <div style={{ padding: '12px 12px 4px' }}>选择房号</div>}
+ <div className='room-number-box'>
+ <div className='room-number-box-flex'>
+ {newData.map((x, t) => {
+ let value = x;
+ return (
+ !x.unit && !x.housenumber ?
+ <div key={t} className='room-number-box-flex-3'>
+ <div style={{ flex: '1 1 0%' }}>
+ <Button
+ onClick={() => !!onClickRoom && onClickRoom(value)}
+ type={active == value.id ? 'primary' : 'secondary'}
+ size="middle"
+ >
+ {x.houseaddress || '-'}
+ </Button>
+ </div>
+ <div style={{ width: '8px', backgroundColor: '#ffffff' }}></div>
+ </div> :
+ <div key={t} className='room-number-box-flex-1'>
+ <div style={{ flex: '1 1 0%' }}>
+ <Button
+ onClick={() => !!onClickRoom && onClickRoom(value)}
+ type={active == value.id ? 'primary' : 'secondary'}
+ size="middle"
+ >
+ {(`${x.unit ? `${x.unit}-` : ''}${x.housenumber}`).length < 10 ? (`${x.unit ? `${x.unit}-` : ''}${x.housenumber}`) : (`${x.unit ? `${x.unit}-` : ''}${x.housenumber}`).substr(0, 10) + "..."}
+ </Button>
+ </div>
+ <div style={{ width: '8px', backgroundColor: '#ffffff' }}></div>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ {type !== 'change' && <div className="room-number-bottom">已加载所有房间</div>}
+ </div>
+ </>
+ );
+};
+
+export default RoomNumberGrid;
diff --git a/src/components/room/UnitMsg.jsx b/src/components/room/UnitMsg.jsx
new file mode 100644
index 0000000..d92fe71
--- /dev/null
+++ b/src/components/room/UnitMsg.jsx
@@ -0,0 +1,112 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-13 14:28:11
+ * @LastEditTime: 2022-09-24 14:50:30
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 房间详情页 - 单位信息
+ */
+import React from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import { personCard_icon } from '../../assets/icon';
+import { avatar1, avatar2 } from '../../assets/img';
+import { useHistory } from 'react-router-dom';
+import Descriptions from '../Descriptions';
+import ImgShow from '../ImgShow';
+
+const UnitMsg = ({ onlyCheck, houseId, data }) => {
+ const history = useHistory();
+ return (
+ <div className="roomDetail-roomMsg-main roomDetail-unitMsg-main">
+ <div className="roomDetail-roomMsg-card roomDetail-unitMsg-card">
+ <Descriptions
+ title="基本信息"
+ topRightActionVisible={!onlyCheck}
+ data={[
+ { label: '单位名称', value: data.unitname },
+ { label: '统一信用代码', value: data.unitcode },
+ { label: '单位性质', value: data.unittypeDesc },
+ { label: '单位类型', value: data.classifyName },
+ ]}
+ columns={1}
+ onTopRightAction={() => history.push(`/hztGrid/room/FormUnit?id=${data.id}&houseId=${houseId}`)}
+ />
+ </div>
+ <div className="roomDetail-roomMsg-card roomDetail-unitMsg-card">
+ <div className="roomDetail-roomMsg-card-title">责任人信息</div>
+ <div className="roomDetail-msgCard roomDetail-msgCard-blue">
+ {!data.pCorporationName ? (
+ <>
+ <div className="roomDetail-msgCard-avatar">
+ <img src={personCard_icon} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-desc">尚未登记法人信息</div>
+ </>
+ ) : (
+ <>
+ <div className="roomDetail-msgCard-avatar">
+ <img src={avatar1} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <Space align="center">
+ <span>{data.pCorporationName}</span>
+ <span>{data.pCorporationPhone}</span>
+ <span className="public-tag2 public-tag2-blue">法人</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>{data.pCorporationIdTypeName}</span>
+ <span className="public-rightBorder">{data.pCorporationIdCard}</span>
+ </div>
+ </div>
+ </>
+ )}
+ </div>
+ <div className="roomDetail-msgCard roomDetail-msgCard-blue">
+ {!data.pPrincipalName ? (
+ <>
+ <div className="roomDetail-msgCard-avatar">
+ <img src={personCard_icon} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-desc">尚未登记责任人信息</div>
+ </>
+ ) : (
+ <>
+ <div className="roomDetail-msgCard-avatar">
+ <img src={avatar2} alt="" />
+ </div>
+ <div className="roomDetail-msgCard-content">
+ <Space align="center">
+ <span>{data.pPrincipalName}</span>
+ <span>{data.pPrincipalPhone}</span>
+ <span className="public-tag2 public-tag2-blue">负责人</span>
+ </Space>
+ <div className="roomDetail-msgCard-content-desc">
+ <span>{data.pPrincipalIdTypeName}</span>
+ <span className="public-rightBorder">{data.pPrincipalIdCard}</span>
+ </div>
+ </div>
+ </>
+ )}
+ </div>
+ </div>
+ <div className="roomDetail-roomMsg-card roomDetail-unitMsg-card">
+ <div className="roomDetail-roomMsg-card-title">单位附件</div>
+ <div className="roomDetail-roomMsg-card-file">
+ {data.fileList?.map((x, t) => (
+ <div className="roomDetail-roomMsg-card-file-item" key={t}>
+ <ImgShow img={x.showUrl} allImg={data.fileList} title={x.name} />
+ </div>
+ ))}
+ {(data.fileList || []).length === 0 && (
+ <div className="roomDetail-roomMsg-card-file-item">
+ <ImgShow />
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+export default UnitMsg;
diff --git a/src/components/room/index.js b/src/components/room/index.js
new file mode 100644
index 0000000..14d6284
--- /dev/null
+++ b/src/components/room/index.js
@@ -0,0 +1,18 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-13 14:34:22
+ * @LastEditTime: 2022-09-21 20:18:21
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+import RoomNumberGrid from './RoomNumberGrid';
+import ResidentMsg from './ResidentMsg';
+import RoomMsg from './RoomMsg';
+import UnitMsg from './UnitMsg';
+import ChangeRoomMsg from './ChangeRoomMsg';
+import RoomList from './List';
+import OutPersonMsg from './OutPersonMsg';
+
+export { RoomNumberGrid, ResidentMsg, RoomMsg, UnitMsg, ChangeRoomMsg, RoomList, OutPersonMsg };
diff --git a/src/components/searchHead/index.jsx b/src/components/searchHead/index.jsx
new file mode 100644
index 0000000..59e0c68
--- /dev/null
+++ b/src/components/searchHead/index.jsx
@@ -0,0 +1,130 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-02-18 10:23:36
+ * @LastEditTime: 2024-01-26 09:43:34
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @Version: 1.0.0
+ * @Description:
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { DownArrow2Outlined } from 'dd-icons';
+import { Button, Empty, Picker } from 'dingtalk-design-mobile';
+import NavBarPage from '../../components/NavBarPage';
+import CalendarRange from '../../components/CalendarRange';
+import CalendarRangeDay from '../../components/CalendarRangeDay';
+import ModalDown from '../../components/ModalDown';
+import ModalContent from '../../components/workLog/ModalContent';
+import MyList from '../../components/MyList';
+import ImgShow from '../../components/ImgShow';
+import { workLog_img_1 } from '../../assets/img';
+import { room_1 } from './../../assets/icon';
+import { ax, myTimeFormat, moment, getweekTime } from '../../utils/utility';
+
+
+const years = new Array(new Date().getFullYear() - (new Date().getFullYear() - 10)).fill(0).map((item, i) => ({ label: String(new Date().getFullYear() - 9 + i) + '年', value: new Date().getFullYear() - 9 + i }))
+const typeList = [{ label: '年', value: 1 }, { label: '月', value: 2 }, { label: '日', value: 3 }]
+const SearchHead = () => {
+
+ const [visibleData, setVisibleData] = useState({ typeVisible: false, typeValue: 1, yearsVisible: false, yearsValue: new Date().getFullYear() });
+
+ const [nowTime, setNowTime] = useState(moment().format('YYYY-MM-DD'))
+ // 搜索
+ function handleSearch(value) {
+ if (value == '1') {
+ setVisibleData({ ...visibleData, typeVisible: true })
+ }
+ if (value == '2') {
+ if (visibleData.typeValue == 1) {
+ setVisibleData({ ...visibleData, yearsVisible: true, yearsValue: visibleData.yearsValue ? visibleData.yearsValue : new Date().getFullYear() })
+ }
+ if (visibleData.typeValue == 2) {
+ setVisibleData({ ...visibleData, monthVisible: true })
+ }
+ if (visibleData.typeValue == 3) {
+ setVisibleData({ ...visibleData, dayVisible: true })
+ }
+ }
+ }
+
+ return (
+ <></>
+ // <>
+ // <div className='workLog-searchBar'>
+ // <div className='workLog-searchBar-l' onClick={() => handleSearch('1')}>
+ // <div>{searchData.label}</div>
+ // <div><DownArrow2Outlined /></div>
+ // </div>
+ // <div className='workLog-searchBar-r' onClick={() => handleSearch('2')}>
+ // <div>{searchData.logTime}</div>
+ // <img className='workLog-searchBar-r-img' src={workLog_img_1} alt="" />
+ // </div>
+ // </div>
+ // {/* 日选择器 */}
+ // <ModalDown
+ // extraContent={<CalendarRangeDay activeTime={moment(nowTime).format('YYYY-M-D')} onClickDate={onClickDate} onChangeMonth={changeMonth} CalendaronClick={CalendaronClick} />}
+ // headContent={true}
+ // visible={visibleData.dayVisible}
+ // visibleOnClick={() => setVisibleData({ ...visibleData, dayVisible: false })}
+ // isAction={false}
+ // onConfirm={(data, list) => { }}
+ // />
+
+ // {/* 月选择器 */}
+ // <ModalDown
+ // extraContent={<CalendarRange activeTime={moment(nowTime).format('YYYY-M')} onChangeMonth={changeMonth} CalendaronClick={CalendaronClick} />}
+ // headContent={true}
+ // visible={visibleData.monthVisible}
+ // visibleOnClick={() => setVisibleData({ ...visibleData, monthVisible: false })}
+ // isAction={false}
+ // onConfirm={(data, list) => { }}
+ // />
+ // {/* 年选择器 */}
+ // <Picker
+ // data={years}
+ // cols={1}
+ // visible={visibleData.yearsVisible}
+ // title=""
+ // okText="确定"
+ // onDismiss={() => setVisibleData({ ...visibleData, yearsVisible: false })}
+ // value={[visibleData.yearsValue]}
+ // onChange={(e) => {
+ // setVisibleData({ ...visibleData, yearsValue: e[0], yearsLabel: years.find(i => i.value === e[0]).label, yearsVisible: false })
+ // let data = { ...searchData, logTime: e[0] }
+ // setSearchData(data);
+ // getLogBookData({
+ // type: data.type,
+ // logTime: data.logTime,
+ // page: data.page,
+ // size: data.size
+ // }, 'spin');
+ // }}
+ // >
+ // </Picker>
+ // {/* 类型选择器 */}
+ // <Picker
+ // data={typeList}
+ // cols={1}
+ // visible={visibleData.typeVisible}
+ // title=""
+ // okText="确定"
+ // onDismiss={() => setVisibleData({ ...visibleData, typeVisible: false })}
+ // value={[visibleData.typeValue]}
+ // onChange={(e) => {
+ // setVisibleData({ ...visibleData, typeValue: e[0], typeLabel: typeList.find(i => i.value === e[0]).label, typeVisible: false })
+ // let data = { ...searchData, type: e[0], label: typeList.find(i => i.value === e[0]).label, logTime: myTimeFormat(new Date(), e[0] == 1 ? 'YYYY' : e[0] == 2 ? 'YYYY-M' : e[0] == 3 ? 'YYYY-M-D' : 'YYYY-MM-DD') }
+ // setSearchData(data)
+ // getLogBookData({
+ // type: data.type,
+ // logTime: data.logTime,
+ // page: data.page,
+ // size: data.size
+ // }, 'spin');
+ // }}
+ // >
+ // </Picker>
+ // </>
+ )
+}
+export default SearchHead;
\ No newline at end of file
diff --git a/src/components/searchHead/index.less b/src/components/searchHead/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/components/searchHead/index.less
diff --git a/src/components/task/List.jsx b/src/components/task/List.jsx
new file mode 100644
index 0000000..5d8815a
--- /dev/null
+++ b/src/components/task/List.jsx
@@ -0,0 +1,188 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-17 11:50:34
+ * @LastEditTime: 2022-12-28 17:37:34
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的任务 - 任务列表组件
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import { ClockOutlined, LocationOutlined } from 'dd-icons';
+import MyList from '../MyList';
+import MsgModal from '../MsgModal';
+import TaskHandle02 from '../../views/task/handle/Handle_02';
+import { task_img_1, task_img_2, task_img_3 } from '../../assets/img';
+import { dateFormat, searchTitle, moment, timeFormat } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const TaskList = ({ search, data, dataTotal, hasMore, getScrollTopKey, scrollTop, searchValue, getTaskData }) => {
+ const history = useHistory();
+
+ // msgModal
+ const [msgModal, setMsgModal] = useState({ visible: false });
+
+ // TaskHandle02
+ const [taskHandleO2Visible, setTaskHandleO2Visible] = useState(false);
+
+ function iconType(key) {
+ if (['030101'].includes(key)) {
+ return task_img_2;
+ } else if (['010101'].includes(key)) {
+ return task_img_3;
+ } else {
+ return task_img_1;
+ }
+ }
+
+ // 已过期
+ function beOverdue(expireTime) {
+ if (expireTime && dateFormat(expireTime) < dateFormat(new Date())) {
+ return true;
+ }
+ return false;
+ }
+
+ function msgTime(value, type) {
+ let res = '';
+ if (moment(value).format('YYYYMMDD') === moment().format('YYYYMMDD')) {
+ res = '今日';
+ } else {
+ res = moment(value).format('MM月DD日');
+ }
+ return type ? res : `${res} ${moment(value).format('HH:mm')}`;
+ }
+
+ // 事件方法
+ function handleEvent() {
+ setMsgModal({ ...msgModal, visible: false });
+ if (msgModal.status === '2') {
+ // 已完成
+ if (msgModal.eventType === '010101') {
+ // 矛盾纠纷事件
+ history.push(`/hztGrid/mediateEventList/detail?eventId=${msgModal.eventId}&taskId=${msgModal.taskId}&pageFrom=task`);
+ } else {
+ history.push(`/hztGrid/task/detail?eventId=${msgModal.eventId}&eventType=${msgModal.eventType}&taskId=${msgModal.taskId}`);
+ }
+ } else {
+ // 未完成
+ if (['030101'].includes(msgModal.eventType)) {
+ history.push(`/hztGrid/task/handle?eventId=${msgModal.eventId}&eventType=${msgModal.eventType}&taskId=${msgModal.taskId}`);
+ } else if (msgModal.eventType === '010101') {
+ // 矛盾纠纷事件
+ history.push(`/hztGrid/mediateEventList/detail?eventId=${msgModal.eventId}&taskId=${msgModal.taskId}&tabActive=2&pageFrom=task`);
+ } else {
+ setTaskHandleO2Visible(true);
+ }
+ }
+ }
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getTaskData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 页面刷新
+ useEffect(() => {
+ if (routerStatus.spinPage['task']) {
+ getTaskData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('task');
+ routerStatus.clearSpinPage('task');
+ }
+ }, [routerStatus.spinPage['task']]);
+
+ return (
+ <>
+ <MyList
+ data={data}
+ dataTotal={dataTotal}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item) => {
+ return item.date ? (
+ <div className="task-title">
+ <Space>
+ <span>{msgTime(item.date, true)}任务</span>
+ <span className="task-title-subtitle">
+ {item.finish}/{item.total}
+ </span>
+ </Space>
+ </div>
+ ) : (
+ <div className="task-card" onClick={() => setMsgModal({ visible: true, ...item })}>
+ <div className="task-card-header">
+ <img className="task-card-titleIcon" src={iconType(item.eventType)} alt="" />
+ <span className="task-card-title">{item.eventTypeDesc}</span>
+ </div>
+ <div className="task-card-main">
+ <div className="task-card-main-header">
+ <LocationOutlined />
+ <span className="task-card-main-header-flex ellipsis-text-1">{searchValue ? searchTitle(item.addr, searchValue) : item.addr}</span>
+ </div>
+ <div className="task-card-main-tags">
+ <Space className="task-card-main-tags-flex" wrap>
+ {item.gridName && <div className="public-tag2">{item.gridName}</div>}
+ {item.status === '2' && <div className="public-tag2 public-tag2-green">已完成</div>}
+ {beOverdue(item.expireTime) && <div className="public-tag2 public-tag2-red">已过期</div>}
+ </Space>
+ <Space style={{ '--gap': '4px' }}>
+ <ClockOutlined style={{ fontSize: '14px' }} />
+ <div>{msgTime(item.createTime)}</div>
+ </Space>
+ </div>
+ </div>
+ {item.eventTitle && (
+ <div className="task-card-bottom">
+ <div className="task-card-bottom-point" />
+ <div>{item.eventTitle}</div>
+ </div>
+ )}
+ </div>
+ );
+ }}
+ />
+ {/* 底部消息弹窗 */}
+ <MsgModal
+ visible={msgModal.visible}
+ onClose={() => setMsgModal({ visible: false })}
+ title="任务详情"
+ icon={iconType(msgModal.eventType)}
+ msgTitle={msgModal.eventTypeDesc}
+ msgSubtitle={timeFormat(msgModal.createTime)}
+ msgTag={[
+ { className: 'public-tag2', text: msgModal.gridNum },
+ ...(msgModal.status === '2' ? [{ className: 'public-tag2 public-tag2-green', text: '已完成' }] : []),
+ ...(beOverdue(msgModal.expireTime) ? [{ className: 'public-tag2 public-tag2-red', text: '已过期' }] : []),
+ ]}
+ content={msgModal.taskContent}
+ actionText={msgModal.status === '2' ? '查看历史' : '立即处理'}
+ actionFunc={handleEvent}
+ contentTitle={msgModal.eventTitle}
+ />
+ {/* 020101,020102,020103事件任务处理弹窗组件 */}
+ <TaskHandle02
+ visible={taskHandleO2Visible}
+ taskId={msgModal.taskId}
+ eventType={msgModal.eventType}
+ eventTypeDesc={msgModal.eventTypeDesc}
+ data={msgModal}
+ onClose={() => setTaskHandleO2Visible(false)}
+ onReturnCallback={() => {
+ routerStatus.setSpinPage('task');
+ setTaskHandleO2Visible(false);
+ history.push(`/hztGrid/task/handle?eventType=${msgModal.eventType}`);
+ }}
+ onSubmitCallback={() => {
+ setMsgModal({ visible: false });
+ routerStatus.setSpinPage('task');
+ }}
+ />
+ </>
+ );
+};
+
+export default TaskList;
diff --git a/src/components/task/ReturnTask.jsx b/src/components/task/ReturnTask.jsx
new file mode 100644
index 0000000..fbc594b
--- /dev/null
+++ b/src/components/task/ReturnTask.jsx
@@ -0,0 +1,113 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-19 19:25:36
+ * @LastEditTime: 2022-09-22 17:24:27
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 任务退回modal
+ */
+import React, { useMemo, useState } from 'react';
+import { Input, TextareaItem } from 'dingtalk-design-mobile';
+import { WarningOutlined } from 'dd-icons';
+import MyModal from '../MyModal';
+import { ax, showToast } from '../../utils/utility';
+
+// 任务退回
+function setReturnTaskApi(submitData) {
+ return ax.request({ url: 'eventTask/gridBackTask', type: 'post', data: submitData, service: 'event' });
+}
+
+const ReturnTask = ({ taskId, eventType, visible, onClose, onSuccessCallback }) => {
+ const info = useMemo(() => {
+ let res = '';
+ if (['030101'].includes(eventType)) {
+ res = '如核实后事件不在管辖网格，请填写与居民核实后新的事件位置信息，这将帮助后续网格员更好开展工作';
+ } else {
+ res = '如核实居民不在管辖网格，请填写与居民核实后新的房名房址信息，这将帮助后续网格员更好开展工作';
+ }
+ return res;
+ }, [eventType]);
+
+ const info2 = useMemo(() => {
+ let res = '';
+ if (['030101'].includes(eventType)) {
+ res = '核实后的事件位置';
+ } else {
+ res = '核实后的房名房址';
+ }
+ return res;
+ }, [eventType]);
+
+ const info3 = useMemo(() => {
+ let res = '';
+ if (['030101'].includes(eventType)) {
+ res = '输入与居民核实后新的事件位置';
+ } else {
+ res = '输入与居民核实后新的房名房址信息';
+ }
+ return res;
+ }, [eventType]);
+
+ // 退回数据
+ const [returnData, setReturnData] = useState({});
+
+ // 退回任务
+ async function setReturnTask() {
+ if (!returnData.handleContent?.replace(/\s+/g, '')) {
+ showToast({ content: '请输入退回理由' });
+ return;
+ }
+ global.setSpinning(true);
+ const res = await setReturnTaskApi({ taskId, ...returnData });
+ global.setSpinning(false);
+ if (res.type) {
+ onSuccessCallback && onSuccessCallback();
+ }
+ }
+
+ return (
+ <MyModal zIndex={1002} visible={visible} center bodyClass="taskHandle-returnModal" onClose={onClose}>
+ <div className="taskHandle-returnModal-title h7">任务退回</div>
+ <div className="taskHandle-returnModal-contentPadding">
+ <div className="taskHandle-returnModal-subtitle">
+ <div className="taskHandle-returnModal-subtitle-icon">
+ <WarningOutlined />
+ </div>
+ <div>{info}</div>
+ </div>
+ <div className="taskHandle-returnModal-content">
+ <div className="taskHandle-feedback-title">
+ <div className="public_body_text_style_bold">{info2}</div>
+ </div>
+ <Input
+ value={returnData.serveObjEndAddr}
+ onChange={(value) => setReturnData({ ...returnData, serveObjEndAddr: value })}
+ placeholder={info3}
+ />
+ <div className="taskHandle-returnModal-split" />
+ <div className="taskHandle-feedback-title">
+ <div className="public_body_text_style_bold">退回理由</div>
+ <div className="public-tag4">必填</div>
+ </div>
+ <TextareaItem
+ value={returnData.handleContent}
+ onChange={(value) => setReturnData({ ...returnData, handleContent: value })}
+ placeholder="需要填写退回该任务的理由"
+ rows={3}
+ />
+ </div>
+ </div>
+ <div className="myModal-action">
+ <div onClick={onClose} className="myModal-action-item1">
+ 我再想想
+ </div>
+ <div onClick={setReturnTask} className="myModal-action-item2">
+ 确定退回
+ </div>
+ </div>
+ </MyModal>
+ );
+};
+
+export default ReturnTask;
diff --git a/src/components/task/TaskDetail.jsx b/src/components/task/TaskDetail.jsx
new file mode 100644
index 0000000..bf5c923
--- /dev/null
+++ b/src/components/task/TaskDetail.jsx
@@ -0,0 +1,113 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-20 10:31:56
+ * @LastEditTime: 2022-12-29 17:48:39
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的任务 - 详情 - 事件详情
+ */
+import React, { useMemo } from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import { LocationOutlined } from 'dd-icons';
+import Descriptions from '../../components/Descriptions';
+import ImgShow from '../../components/ImgShow';
+import { taskHandle_icon_1 } from '../../assets/icon';
+import { task_img_2 } from '../../assets/img';
+import { moment, timeFormat } from '../../utils/utility';
+
+const TaskDetail = ({ data }) => {
+ // 任务到期天数
+ const getExpireDays = useMemo(() => {
+ let now = moment(),
+ target = moment(data.taskExpireTime),
+ diffDay = now.diff(target, 'day');
+ if (diffDay <= 0) {
+ return `${Math.abs(diffDay) || 1}天后到期`;
+ }
+ return '';
+ }, [data.taskExpireTime]);
+
+ return (
+ <div className="taskHandle-main">
+ <div className="taskHandle-explain">
+ <img src={taskHandle_icon_1} alt="" />
+ <div className="taskHandle-explain-content">
+ <div>
+ 联系人信息：<span className="taskHandle-explain-color">{data.contacts || '-'}</span>（电话：
+ <span className="taskHandle-explain-color">{data.contactsMobile || '-'}</span>）
+ </div>
+ <div>请在处置时限内完成事件的处置与核实</div>
+ </div>
+ </div>
+ <div className="taskHandle-msg">
+ <div className="taskHandle-msg-title">
+ <img className="taskHandle-msg-title-img" src={task_img_2} alt="" />
+ <div className="taskHandle-msg-title-content">
+ <Space wrap>
+ <div className="taskHandle-msg-title-content-title">{data.eventContent || '-'}</div>
+ {getExpireDays ? <div className="public-tag2">{getExpireDays}</div> : <div className="public-tag2 public-tag2-red">已过期</div>}
+ </Space>
+ <div className="taskHandle-msg-title-content-subtitle">
+ <span>{data.eventSourceDesc || '-'}</span>
+ <span className="public-rightBorder">下达时间：{timeFormat(data.taskCreateTime)}</span>
+ </div>
+ </div>
+ </div>
+ <Descriptions
+ data={[
+ { label: '事件类型', value: data.eventTypeDesc },
+ { label: '事件标题', value: data.eventTitle },
+ { label: '事件编号', value: data.eventNo },
+ { label: '发生时间', value: timeFormat(data.eventTime) },
+ {
+ label: '区域及所属辖区',
+ value: (
+ <span>
+ {data.districtName || '-'}/{data.subdistrictName || '-'}/{data.communityName || '-'}
+ </span>
+ ),
+ },
+ {
+ label: '事件位置',
+ value: (
+ <div style={{ display: 'flex' }}>
+ <div>
+ <LocationOutlined />
+ </div>
+ <div style={{ flex: 1, marginLeft: '4px' }}>{data.addr || '-'}</div>
+ </div>
+ ),
+ },
+ { label: '事件级别', value: `${data.eventLevel || '-'}级` },
+ {
+ label: '事件描述',
+ value: data.eventContent,
+ },
+ {
+ label: '事件附件',
+ type: 'files',
+ value: (
+ <div className="taskHandle-msg-files">
+ {!data.fileList?.length && '-'}
+ {data.fileList?.map((x, t) => (
+ <div className="taskHandle-msg-files-item" key={t}>
+ <ImgShow img={x.showUrl} allImg={data.fileList} noTitle />
+ </div>
+ ))}
+ </div>
+ ),
+ },
+ ]}
+ layout="vertical"
+ columns={1}
+ colon={false}
+ textGap={0}
+ itemGap={8}
+ />
+ </div>
+ </div>
+ );
+};
+
+export default TaskDetail;
diff --git a/src/components/task/TaskHandleDetail.jsx b/src/components/task/TaskHandleDetail.jsx
new file mode 100644
index 0000000..fc17abb
--- /dev/null
+++ b/src/components/task/TaskHandleDetail.jsx
@@ -0,0 +1,89 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-20 10:46:07
+ * @LastEditTime: 2022-12-29 10:24:12
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 我的任务 - 详情 - 030101,020101,020102,020103处置或退回详情
+ */
+import React, { useMemo } from 'react';
+import { AchieveFilled } from 'dd-icons';
+import Descriptions from '../../components/Descriptions';
+import ImgShow from '../../components/ImgShow';
+import { taskHandle_img_1 } from '../../assets/img';
+import { timeFormat } from '../../utils/utility';
+
+const TaskHandleDetail = ({ data = {} }) => {
+ const strObj = useMemo(() => {
+ if (data.handleResult === '21_00014-1') {
+ return {
+ icon: (
+ <div className="taskDetail-right-header-icon">
+ <AchieveFilled />
+ </div>
+ ),
+ title: '已处置',
+ time: '处置时间',
+ des1: '处置人',
+ des2: { label: '处置反馈', value: data.handleContent },
+ };
+ } else {
+ return {
+ icon: <img className="taskDetail-right-header-icon" src={taskHandle_img_1} alt="" />,
+ title: '已退回',
+ time: '退回时间',
+ des1: '退回人',
+ des2: { label: '核实后的房名房址', value: data.addr },
+ };
+ }
+ }, [data.handleResult]);
+
+ return (
+ <div className="taskDetail">
+ <div className="taskDetail-right">
+ <div className="taskDetail-right-header">
+ {strObj.icon}
+ <div>
+ <h5>{strObj.title}</h5>
+ <div className="taskDetail-right-header-subtitle">
+ {strObj.time}：{timeFormat(data.finishTime)}
+ </div>
+ </div>
+ </div>
+ <Descriptions
+ data={[
+ { label: strObj.des1, value: data.handleUserName },
+ strObj.des2,
+ data.handleResult === '21_00014-1'
+ ? {
+ label: '事件附件',
+ type: 'files',
+ value: (
+ <div className="taskHandle-msg-files">
+ {!data.fileList?.length && '-'}
+ {data.fileList?.map((x, t) => (
+ <div className="taskHandle-msg-files-item" key={t}>
+ <ImgShow img={x.showUrl} allImg={data.fileList} noTitle />
+ </div>
+ ))}
+ </div>
+ ),
+ }
+ : {
+ label: '退回理由',
+ value: data.handleContent,
+ },
+ ]}
+ layout="vertical"
+ columns={1}
+ colon={false}
+ textGap={0}
+ itemGap={8}
+ />
+ </div>
+ </div>
+ );
+};
+
+export default TaskHandleDetail;
diff --git a/src/components/village/List.jsx b/src/components/village/List.jsx
new file mode 100644
index 0000000..b685d25
--- /dev/null
+++ b/src/components/village/List.jsx
@@ -0,0 +1,67 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 16:35:20
+ * @LastEditTime: 2022-12-13 15:23:10
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 城乡社区管理 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import routerStatus from '../../status/router';
+
+const MaterialsList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getPageQueryData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getPageQueryData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 列表更新
+ useEffect(() => {
+ if (routerStatus.spinPage['materials']) {
+ getPageQueryData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('materials');
+ routerStatus.clearSpinPage('materials');
+ }
+ }, [routerStatus.spinPage['materials']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztGrid/villageDetail?id=${item.id}`)}
+ >
+ <div className="building-card">
+ <div className="building-title">
+ {searchValue ? searchTitle(item.comName, searchValue) : item.comName}
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.comTypeDesc || '-'}</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.districtName || '-'} {item.subdistrictName || '-'}</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">楼栋总数：{item.buildCount || 0}</div>
+ </div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default MaterialsList;
diff --git a/src/components/visit/List.jsx b/src/components/visit/List.jsx
new file mode 100644
index 0000000..1366f10
--- /dev/null
+++ b/src/components/visit/List.jsx
@@ -0,0 +1,72 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-04-18 10:19:58
+ * @LastEditTime: 2023-05-18 16:31:43
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 走访列表 - 列表组件
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle } from '../../utils/utility';
+import { visit_1 } from '../../assets/img';
+import routerStatus from '../../status/router';
+
+const VisitList = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getTrailArriveData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getTrailArriveData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 房间更新
+ useEffect(() => {
+ if (routerStatus.spinPage['visitList']) {
+ getTrailArriveData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('visitList');
+ routerStatus.clearSpinPage('visitList');
+ }
+ }, [routerStatus.spinPage['visitList']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztGrid/visit?id=${item.houseId}`)}
+ >
+ <div className="building-card">
+ <div className="building-title">
+ <span>{searchValue ? searchTitle(item.houseaddress, searchValue) : item.houseaddress}</span>
+ </div>
+ <div className="building-subtitle">
+ <div className="building-subtitle-text">{item.familyCount || 0}分户</div>
+ <div className="public-split" />
+ <div className="building-subtitle-text">{item.personCount || 0}人口</div>
+ </div>
+ <Space>
+ {item.arriveQuarterOne ? <div className="public-tag2 public-tag2-blue">第一轮<img style={{ width: "12px", height: '12px', paddingLeft: '4px' }} src={visit_1} /></div> : <div className="public-tag2">第一轮</div>}
+ {item.arriveQuarterTwo ? <div className="public-tag2 public-tag2-blue">第二轮<img style={{ width: "12px", height: '12px', paddingLeft: '4px' }} src={visit_1} /></div> : <div className="public-tag2">第二轮</div>}
+ {item.arriveQuarterThree ? <div className="public-tag2 public-tag2-blue">第三轮<img style={{ width: "12px", height: '12px', paddingLeft: '4px' }} src={visit_1} /></div> : <div className="public-tag2">第三轮</div>}
+ {item.arriveQuarterFour ? <div className="public-tag2 public-tag2-blue">第四轮<img style={{ width: "12px", height: '12px', paddingLeft: '4px' }} src={visit_1} /></div> : <div className="public-tag2">第四轮</div>}
+ </Space>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default VisitList;
\ No newline at end of file
diff --git a/src/components/visit/search.jsx b/src/components/visit/search.jsx
new file mode 100644
index 0000000..c6f14a4
--- /dev/null
+++ b/src/components/visit/search.jsx
@@ -0,0 +1,84 @@
+/*
+ * @Author: dminyi 1301963064@qq.com
+ * @Date: 2023-08-10 16:31:54
+ * @LastEditors: dminyi 1301963064@qq.com
+ * @LastEditTime: 2023-08-14 11:49:51
+ * @FilePath: \hztSsim\mobile\src\components\visit\search.jsx
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+import React, { useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Space } from 'dingtalk-design-mobile';
+import MyList from '../MyList';
+import { dateFormat, getUpdateStr, searchTitle, myTimeFormat } from '../../utils/utility';
+import { visit_1 } from '../../assets/img';
+import routerStatus from '../../status/router';
+
+const VisitListSearchView = ({ search, data, hasMore, getScrollTopKey, scrollTop, searchValue, getTrailArriveData }) => {
+ const history = useHistory();
+
+ // 加载更多数据
+ function handleLoadMore(callback) {
+ getTrailArriveData({ ...search, page: search.page + 1 }, '', callback);
+ }
+
+ // 房间更新
+ useEffect(() => {
+ if (routerStatus.spinPage['VisitListSearchView']) {
+ getTrailArriveData({ ...search, page: 1, size: search.page * search.size }, 'spin');
+ routerStatus.setPageScrollTopNow('VisitListSearchView');
+ routerStatus.clearSpinPage('VisitListSearchView');
+ }
+ }, [routerStatus.spinPage['VisitListSearchView']]);
+
+ return (
+ <MyList
+ data={data}
+ hasMore={hasMore}
+ loadMore={handleLoadMore}
+ getScrollTopKey={getScrollTopKey}
+ scrollTop={scrollTop}
+ itemDom={(item, index) => {
+ return (
+ <div
+ className="building-card-bottom"
+ style={index === 0 ? { marginTop: 0 } : null}
+ onClick={() => history.push(`/hztSsim/visit?id=${item.coreNameId}`)}
+ >
+ <div
+ key={`institutions${index}`}
+ className="institutions-list"
+ style={index === 0 ? { marginTop: 0 } : null}
+ >
+ <div className="institutions-list-flex">
+ <div className="institutions-list-title">
+ {item.coreName}
+ </div>
+ <div className="institutions-list-subTitle">
+ {item.createTime
+ ? myTimeFormat(item.createTime, "YYYY.M.D") +
+ "录入"
+ : "-"}
+ </div>
+ </div>
+ <div className="institutions-list-subTitle">
+ 中心层级：{item.coreLevelName}
+ </div>
+ <div className="institutions-list-subTitle">
+ 队伍成员:{item.userTotal}人
+ </div>
+ <div className="institutions-list-subTitle">
+ 更新时间：
+ {item.updateTime
+ ? myTimeFormat(item.updateTime, "YYYY.M.D")
+ : "-"}
+ </div>
+ </div>
+ </div>
+ );
+ }}
+ />
+ );
+};
+
+export default VisitListSearchView;
\ No newline at end of file
diff --git a/src/components/visitHistory/PersonMsg.jsx b/src/components/visitHistory/PersonMsg.jsx
new file mode 100644
index 0000000..253f127
--- /dev/null
+++ b/src/components/visitHistory/PersonMsg.jsx
@@ -0,0 +1,148 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-18 10:46:51
+ * @LastEditTime: 2022-12-27 14:31:33
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 到访详情 - 居民信息展示组件
+ */
+import React from 'react';
+import { Space } from 'dingtalk-design-mobile';
+import Descriptions from '../Descriptions';
+import { dateFormat, getAgeByIdcard } from '../../utils/utility';
+
+// contrast: [] // 对比后更改的字段集合
+const PersonMsg = ({ data, contrast = [] }) => {
+ function setBg(key) {
+ return contrast.includes(key) ? 'personMsg-redBg' : '';
+ }
+
+ const liveData = [
+ { label: '住所类型', value: <span className={setBg('livePlaceDesc')}>{data.livePlaceDesc || '-'}</span> },
+ { label: '与户主的关系', value: <span className={setBg('roleofhold')}>{data.roleofhold || '-'}</span> },
+ {
+ label: '是否在住',
+ value: <span className={setBg('liveStatus')}>{data.liveStatus === '0' ? '不在住' : data.liveStatus === '1' ? '在住' : '-'}</span>,
+ },
+ { label: '居住月份', value: <span className={setBg('stayMothDesc')}>{data.stayMothDesc || '-'}</span> },
+ {
+ label: '人口标签',
+ value: (
+ <span>
+ {data.personLabelList && data.personLabelList.length > 0
+ ? data.personLabelList.length > 1
+ ? data.personLabelList[0].personLabelName + '...'
+ : data.personLabelList[0].personLabelName
+ : '-'}
+ </span>
+ ),
+ },
+ ];
+
+ const basicData = [
+ { label: '民族', value: <span className={setBg('nationalDesc')}>{data.nationalDesc || '-'}</span> },
+ { label: '出生日期', value: <span className={setBg('birthdate')}>{dateFormat(data.birthdate)}</span> },
+ { label: '籍贯', value: <span className={setBg('birthPlaceDesc')}>{data.birthPlaceDesc || '-'}</span> },
+ { label: '登记时间', value: <span className={setBg('createTime')}>{dateFormat(data.createTime)}</span> },
+ ];
+
+ const liveFeatureData = [
+ {
+ label: '是否重点人员',
+ value: <span className={setBg('isKeynote')}>{data.isKeynote == '0' ? '否' : data.isKeynote == '1' ? '是' : '-'}</span>,
+ },
+ { label: '是否流动人员', value: <span className={setBg('isFloat')}>{data.isFloat == '0' ? '否' : data.isFloat == '1' ? '是' : '-'}</span> },
+ ...(data.isFloat == '0' ? [] : [{ label: '流入原因', value: <span className={setBg('liveReasonDesc')}>{data.liveReasonDesc || '-'}</span> }]),
+ ];
+
+ const unitData = [
+ { label: '单位名称', value: <span className={setBg('unitName')}>{data.unitName || '-'}</span> },
+ { label: '单位联系人', value: <span className={setBg('unitContacterName')}>{data.unitContacterName || '-'}</span> },
+ { label: '单位联系人电话', value: <span className={setBg('unitContacterPhone')}>{data.unitContacterPhone || '-'}</span> },
+ { label: '单位地址', value: <span className={setBg('unitAddress')}>{data.unitAddress || '-'}</span> },
+ { label: '单位备注', value: <span className={setBg('unitRemark')}>{data.unitRemark || '-'}</span> },
+ ];
+
+ const otherData = [
+ { label: '曾用名', value: <span className={setBg('formerName')}>{data.formerName || '-'}</span> },
+ { label: '政治面貌', value: <span className={setBg('polityDesc')}>{data.polityDesc || '-'}</span> },
+ { label: '宗教信仰', value: <span className={setBg('religionDesc')}>{data.religionDesc || '-'}</span> },
+ { label: '婚姻状况', value: <span className={setBg('maritalDesc')}>{data.maritalDesc || '-'}</span> },
+ { label: '学历', value: <span className={setBg('educationDesc')}>{data.educationDesc || '-'}</span> },
+ { label: '职业类别', value: <span className={setBg('jobTypeDesc')}>{data.jobTypeDesc || '-'}</span> },
+ { label: '健康状况', value: <span className={setBg('healthConditionDesc')}>{data.healthConditionDesc || '-'}</span> },
+ { label: '服务处所', value: <span className={setBg('servicePlace')}>{data.servicePlace || '-'}</span> },
+ { label: '备注', value: <span className={setBg('memo')}>{data.memo || '-'}</span> },
+ ];
+
+ return (
+ <>
+ <div className="personMsg-header">
+ <div>
+ <Space align="center">
+ <div className="personMsg-header-title">{data.personName}</div>
+ <div className="public-tag2 public-tag2-blue">{data.roleofhold}</div>
+ </Space>
+ </div>
+ <div className="personMsg-header-subtitle">
+ <span className={setBg('sexDesc')}>{data.sexDesc || '-'}</span>
+ <span className={`public-rightBorder ${setBg('idcard')}`}>{data.idcard ? getAgeByIdcard(data.idcard) + '岁' : '-'}</span>
+ <span className={`public-rightBorder ${setBg('contact')}`}>{data.contact || '-'}</span>
+ </div>
+ <div className="personMsg-header-tag">
+ <Space wrap>
+ <span className="public-tag2">{data.personType === '1' ? '境内人员' : data.personType === '2' ? '境外人员' : '-'}</span>
+ {data.personLabelList &&
+ data.personLabelList.map((item) => (
+ <span key={item.personLabelId} className="public-tag2">
+ {item.personLabelName}
+ </span>
+ ))}
+ {data.isFloat && <span className="public-tag2">{data.isFloat === '0' ? '常驻人口' : '流动人口'}</span>}
+ {data.isKeynote && <span className="public-tag2 public-tag2-red">{data.isKeynote === '1' ? '重点人员' : null}</span>}
+ </Space>
+ </div>
+ </div>
+ <div className="personMsg-card">
+ <Descriptions data={liveData} title="居住信息" />
+ </div>
+ <div className="personMsg-card">
+ <Descriptions
+ data={basicData}
+ otherData={[
+ {
+ type: 'idcard',
+ title: <span>{data.idcard || '-'}</span>,
+ cardType: data.permitTypeDesc || '-',
+ contents: <span>{dateFormat(data.icExpiredDate)}到期</span>,
+ },
+ {
+ type: 'address',
+ title: <span>{data.censusDesc || '-'}（户籍地）</span>,
+ contents: <span>{data.censusAddress || '-'}</span>,
+ },
+ ]}
+ title="证件信息"
+ columns="2"
+ />
+ </div>
+ <div className="personMsg-card">
+ <Descriptions data={liveFeatureData} title="居民特征" />
+ </div>
+ <div className="personMsg-card">
+ <Descriptions otherData={[{ type: 'files', files: data.fileList || [] }]} title="上传附件" />
+ </div>
+ {data.personType == '2' && (
+ <div className="personMsg-card">
+ <Descriptions data={unitData} title="邀请单位信息" />
+ </div>
+ )}
+ <div className="personMsg-card">
+ <Descriptions data={otherData} title="其他信息" />
+ </div>
+ </>
+ );
+};
+
+export default PersonMsg;
diff --git a/src/components/workLog/ModalContent/index.jsx b/src/components/workLog/ModalContent/index.jsx
new file mode 100644
index 0000000..ad3a18d
--- /dev/null
+++ b/src/components/workLog/ModalContent/index.jsx
@@ -0,0 +1,84 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2022-08-09 09:38:59
+ * @LastEditTime: 2023-03-27 19:13:24
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 中间最下方带关闭图标的弹窗
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import './index.less';
+import Overlay from '../../Overlay';
+import { del } from '../../../assets/icon';
+import { workLog_img_2 } from '../../../assets/img';
+import './index.less'
+
+const ModalContent = ({ title, content, zIndex = 999, width = '94%', visible, center, bottom, visibleOnClick }) => {
+ const modalRef = useRef();
+
+ const [styles, setStyles] = useState();
+
+ useEffect(() => {
+ if (!visible) return;
+ let obj = {};
+ let countWidth = 0;
+ if (width.toString().indexOf('%') !== -1) {
+ let windowWidth = document.body.clientWidth;
+ countWidth = (windowWidth * parseInt(width)) / 100;
+ } else {
+ countWidth = width;
+ }
+ if (center) {
+ obj = {
+ top: '50%',
+ marginTop: `-${modalRef.current.clientHeight / 2}px`,
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ } else if (bottom) {
+ obj = {
+ bottom: '24px',
+ left: '24px',
+ right: '24px',
+ };
+ } else {
+ obj = {
+ top: '150px',
+ width: `${countWidth}px`,
+ left: '50%',
+ marginLeft: `-${Number(countWidth) / 2}px`,
+ };
+ }
+ setStyles(obj);
+ }, [bottom, center, visible, width]);
+ return (
+ <div >
+ {
+ visible && (
+ <div ref={modalRef} className="ModalContent" style={{ ...styles, zIndex: zIndex }}>
+ <div className='ModalContent-main'>
+ <div style={{ padding: '12px 16px 0 12px', backgroundColor: '#fff' }}>
+ <div className='ModalContent-head'>
+ <div className='ModalContent-head-l'>{title}</div>
+ <span style={{ zIndex: zIndex, height: '20px', lineHeight: '20px' }} onClick={() => visibleOnClick('workLogEdit', false)} className='public-tag5 public-tag5-blue'>修改</span>
+ {/* <div className="ModalContent-head-img" >
+ </div> */}
+ </div>
+
+ </div>
+ <div className='ModalContent-content'>{content}</div>
+ <div className="ModalContent-bottom" style={{ zIndex: zIndex }} onClick={() => visibleOnClick('', false)}>
+ <img className="ModalContent-bottom-img" style={{ zIndex: zIndex }} src={del} alt="" />
+ </div>
+ </div>
+ </div>
+ )
+ }
+ < Overlay zIndex={zIndex - 1} show={visible} onOverlay={() => visibleOnClick('', false)} />
+ </div >
+ );
+};
+
+export default ModalContent;
\ No newline at end of file
diff --git a/src/components/workLog/ModalContent/index.less b/src/components/workLog/ModalContent/index.less
new file mode 100644
index 0000000..95b0817
--- /dev/null
+++ b/src/components/workLog/ModalContent/index.less
@@ -0,0 +1,66 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.ModalContent {
+ position: fixed;
+ overflow-y: auto;
+ border-radius: 10px;
+
+ &-main {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+ &-head {
+ color: #fff;
+ background-color: #fff;
+ display: flex;
+ padding-bottom: 8px;
+ justify-content: space-between;
+ border-bottom: 1px dashed rgba(126, 134, 142, 0.24);
+ &-l {
+ font-size: 14px;
+ color: #171a1d;
+ line-height: 22px;
+ }
+
+ &-img {
+ width: 18px;
+ height: 18px;
+ & img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+ &-content {
+ flex: 1;
+ overflow: auto;
+ min-height: 302px;
+ max-height: 440px;
+ border-radius: 0 0 10px 10px;
+ background: #fff;
+ }
+ &-bottom {
+ // position: absolute;
+ // bottom: -40px;
+ margin-top: 16px;
+ width: 100%;
+ display: flex;
+ justify-content: center;
+ &-img {
+ width: 24px;
+ height: 24px;
+ }
+ }
+
+ &-item {
+ padding: 8px;
+ margin-bottom: 4px;
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ &-item:last-child {
+ margin-bottom: 0;
+ }
+}
diff --git a/src/index.js b/src/index.js
new file mode 100644
index 0000000..12128a0
--- /dev/null
+++ b/src/index.js
@@ -0,0 +1,31 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-07-20 09:38:04
+ * @LastEditTime: 2023-07-20 09:42:52
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 入口文件
+ */
+import React from 'react';
+import ReactDOM from 'react-dom';
+import reportWebVitals from './reportWebVitals';
+import Routers from './router';
+import './styles/index.less';
+
+ReactDOM.render(<Routers />, document.getElementById('root'));
+
+// If you want to start measuring performance in your app, pass a function
+// to log results (for example: reportWebVitals(
+// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
+reportWebVitals();
+
+// 添加 ResizeObserver 错误处理
+const resizeObserverError = 'ResizeObserver loop completed with undelivered notifications.';
+const originalError = window.console.error;
+window.console.error = (...args) => {
+ if (args[0] && typeof args[0] === 'string' && args[0].includes(resizeObserverError)) {
+ return;
+ }
+ originalError.apply(window.console, args);
+};
diff --git a/src/react-router-dom.d.ts b/src/react-router-dom.d.ts
new file mode 100644
index 0000000..dc16e34
--- /dev/null
+++ b/src/react-router-dom.d.ts
@@ -0,0 +1 @@
+declare module 'react-router-dom';
\ No newline at end of file
diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js
new file mode 100644
index 0000000..5253d3a
--- /dev/null
+++ b/src/reportWebVitals.js
@@ -0,0 +1,13 @@
+const reportWebVitals = onPerfEntry => {
+ if (onPerfEntry && onPerfEntry instanceof Function) {
+ import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+ getCLS(onPerfEntry);
+ getFID(onPerfEntry);
+ getFCP(onPerfEntry);
+ getLCP(onPerfEntry);
+ getTTFB(onPerfEntry);
+ });
+ }
+};
+
+export default reportWebVitals;
diff --git a/src/router/index.js b/src/router/index.js
new file mode 100644
index 0000000..224359b
--- /dev/null
+++ b/src/router/index.js
@@ -0,0 +1,173 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-07 10:28:51
+ * @LastEditTime: 2025-04-30 10:18:26
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-03 15:06:49
+ * @LastEditTime: 2025-04-07 11:33:20
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 路由
+ */
+import React, { useState, useEffect } from 'react';
+import { HashRouter as Router, Route, Redirect, useHistory } from 'react-router-dom';
+import CacheRoute, { CacheSwitch } from 'react-router-cache-route';
+import { Spin } from 'dingtalk-design-mobile';
+
+// 登录
+import Login from '../views/login';
+import LegalPerson from '../views/selfInspection/legalPerson';
+import CaseDes from '../views/selfInspection/caseDes';
+import Naturepersonnone from '../views/selfInspection/NaturePersonNone';
+import Agentperson from '../views/selfInspection/Agentperson';
+import Readperson from '../views/selfInspection/readperson';
+import SelectPerson from '../views/selectPerson';
+import AddRecord from '../views/flow/addRecord';
+import ApplyClose from '../views/flow/applyClose';
+import ApplyCloseDetail from '../views/flow/component/sqjl/detail';
+import Repeat from '../views/repeat';
+
+import PersonCenter from '../views/personCenter'; // 个人中心
+import Home from '../views/home'; // 首页
+
+// 事项流转
+import Flow from '../views/flow';
+
+// 语音识别
+import VoiceRecognition from '../views/selfInspection/components/VoiceRecognition';
+import DraftBox from '../views/draftBox';
+
+// 预览页面
+import Preview from '../views/selfInspection/components/Preview';
+
+// 问题属地选择器
+import LocationPicker from '../views/selfInspection/components/LocationPicker';
+
+// 纠纷类型选择器
+import DisputeTypePicker from '../views/selfInspection/disputeTypePicker';
+
+// 综合查询
+import CaseQuery from '../views/caseQuery';
+
+// 工作统计
+import WorkStatistics from '../views/workStatistics';
+import AreaStatistics from '../views/workStatistics/areaIndex';
+
+// 登记历史
+import RegisterHis from '../views/registerHis';
+
+// 已办事项
+import CaseYb from '../views/caseYb';
+
+// 消息
+import Message from '../views/message';
+
+const Routers = () => {
+ return (
+ <>
+ <Loading />
+ <Router>
+ <CacheSwitch>
+ {/* 登录页 */}
+ <Route exact path="/gzdyh/login" component={Login} />
+ {/* 首页 */}
+ <Route className="public-cacheRoute" exact path="/gzdyh/home" component={Home} />
+ {/* 暂时不确定 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/legalPerson" component={LegalPerson} />
+ {/* 案件描述 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/caseDes" component={CaseDes} />
+ {/* 自然人 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/NaturePersonNone" component={Naturepersonnone} />
+ {/* 法人 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/Agentperson" component={Agentperson} />
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/Readperson" component={Readperson} />
+ {/* 详情入口 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/flow" component={Flow} />
+ {/* 草稿箱 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/draftBox" component={DraftBox} />
+ {/* 选择人员 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/selectPerson" component={SelectPerson} />
+ {/* 添加办理记录 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/addRecord" component={AddRecord} />
+ {/* 结案申请页面 */}
+ <CacheRoute className="public-cacheRoute" exact path="/flow/applyClose" component={ApplyClose} />
+ {/* 待审核详情 */}
+ <CacheRoute className="public-cacheRoute" exact path="/flow/sqjl/detail" component={ApplyCloseDetail} />
+ {/* 重复事项 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/repeat" component={Repeat} />
+ {/* 综合查询 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/caseQuery" component={CaseQuery} />
+ {/* 工作统计 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/workStatistics" component={WorkStatistics} />
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/areaStatistics" component={AreaStatistics} />
+ {/* 登记历史 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/registerHis" component={RegisterHis} />
+ {/* 已办事项 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/caseYb" component={CaseYb} />
+ {/* 个人中心 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/personCenter" component={PersonCenter} />
+ {/* 消息 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/message" component={Message} />
+
+ {/* 语音识别页面 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/voiceRecognition" component={VoiceRecognition} />
+ {/* 问题属地选择器 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/locationPicker" component={LocationPicker} />
+ {/* 纠纷类型选择器 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/disputeTypePicker" component={DisputeTypePicker} />
+ {/* 预览页面 */}
+ <CacheRoute className="public-cacheRoute" exact path="/gzdyh/preview" component={Preview} />
+ <Redirect from="/*" to={'/gzdyh/login'} />
+ </CacheSwitch>
+ </Router>
+ </>
+ );
+};
+
+const Loading = () => {
+ const [spinning, setSpinning] = useState(false);
+
+ useEffect(() => {
+ global.setSpinning = (value) => {
+ setSpinning(value);
+ };
+ return () => {
+ global.setSpinning = void 0;
+ };
+ }, []);
+
+ // useEffect(() => {
+ // // 可以减少多次loading
+ // global.spin = 0;
+ // global.setSpinning = (value) => {
+ // console.log('value1', value);
+ // if (value) {
+ // if (global.spin) {
+ // global.spin = global.spin + 1;
+ // return;
+ // }
+ // global.spin = 1;
+ // setSpinning(value);
+ // } else {
+ // global.spin = global.spin - 1;
+ // if (global.spin) return;
+ // setSpinning(value);
+ // }
+ // };
+ // return () => {
+ // global.spin = void 0;
+ // global.setSpinning = void 0;
+ // };
+ // }, []);
+
+ return spinning && <Spin fixed={true} className="public-spin" text="加载中..." />;
+};
+
+export default Routers;
diff --git a/src/setupTests.js b/src/setupTests.js
new file mode 100644
index 0000000..8f2609b
--- /dev/null
+++ b/src/setupTests.js
@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';
diff --git a/src/status/publicData.js b/src/status/publicData.js
new file mode 100644
index 0000000..d51d376
--- /dev/null
+++ b/src/status/publicData.js
@@ -0,0 +1,100 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-21 10:44:30
+ * @LastEditTime: 2023-05-23 16:39:41
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 公共数据访问，可防止多次请求
+ */
+import { ax } from '../utils/utility';
+
+class publicDataStatus {
+ constructor() {
+ this.gridData = [];
+ this.gridDataPolygon = {};
+ this.gridDataAllMarker = {};
+ this.HKData = [];
+ }
+
+ // 退出登录清空数据
+ clearLogin() {
+ this.gridData = [];
+ this.gridDataPolygon = {};
+ this.gridDataAllMarker = {};
+ this.HKData = [];
+ }
+
+ // 获取网络数据
+ async getUserGrid(callback, isSpin, notAll) {
+ if (this.gridData.length === 0) {
+ function getUserGridApi() {
+ return ax.request({ url: 'opus/getUserGrid', type: 'get', service: 'opus' });
+ }
+ isSpin && global.setSpinning(true);
+ const res = await getUserGridApi();
+ isSpin && global.setSpinning(false);
+ if (res.type) {
+ this.gridData = res.data || [];
+ }
+ }
+ let gridCode = this.gridData.map((x) => x.gridCode).join();
+ callback(notAll || this.gridData?.length <= 1 ? this.gridData : [{ gridNum: '全部', gridCode }, ...this.gridData]);
+ }
+
+ // 获取网格的点位
+ async getUserGridPolygon(gridCode, callback, isSpin) {
+ if (!this.gridDataPolygon[gridCode] || this.gridDataPolygon[gridCode].length === 0) {
+ function getUserGridPolygonApi() {
+ return ax.request({ url: `gridMap/getAddressPlane?gridCode=${gridCode}`, type: 'get', service: 'geopro' });
+ }
+ isSpin && global.setSpinning(true);
+ const res = await getUserGridPolygonApi();
+ isSpin && global.setSpinning(false);
+ if (res.type) {
+ this.gridDataPolygon[gridCode] = res.data || [];
+ }
+ }
+ callback(this.gridDataPolygon[gridCode]);
+ }
+
+ // 获取网格内所有的点位
+ async getUserGridAllMarker(gridCode, callback, isSpin) {
+ if (!this.gridDataAllMarker[gridCode]) {
+ function getUserGridAllMarkerApi() {
+ return ax.request({ url: `buildingInfo/getAddressPoint?gridCode=${gridCode}`, type: 'get', service: 'reside' });
+ }
+ isSpin && global.setSpinning(true);
+ const res = await getUserGridAllMarkerApi();
+ isSpin && global.setSpinning(false);
+ if (res.type) {
+ // 处理数据便于地图加载
+ let markers = [];
+ let markerTexts = res.data || [];
+ res.data?.forEach((x) => {
+ markers.push(x.point);
+ });
+ this.gridDataAllMarker[gridCode] = { markers, markerTexts };
+ }
+ }
+ callback(this.gridDataAllMarker[gridCode]);
+ }
+
+ // 获取区，街道数据
+ async getMetaAddrHk(callback, isSpin, notAll) {
+ if (this.HKData.length === 0) {
+ function getMetaAddrHkApi() {
+ return ax.request({ url: 'metaAddrHk/getChildren', type: 'get', service: 'opus' });
+ }
+ isSpin && global.setSpinning(true);
+ const res = await getMetaAddrHkApi();
+ isSpin && global.setSpinning(false);
+ if (res.type) {
+ this.HKData = res.data || [];
+ }
+ }
+ callback(notAll ? this.HKData : [{ areaName: '全部', areaId: '' }, ...this.HKData]);
+ }
+}
+
+export default new publicDataStatus();
diff --git a/src/status/router.js b/src/status/router.js
new file mode 100644
index 0000000..98cc1c9
--- /dev/null
+++ b/src/status/router.js
@@ -0,0 +1,75 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-18 16:35:06
+ * @LastEditTime: 2023-02-18 19:36:37
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 路由传参状态类，刷新数据会重置，只适合保存不影响页面操作的数据
+ */
+class routerStatus {
+ constructor() {
+ // 路由传递的参数
+ this.state = {};
+ // 记录虚拟滚动的滚动条位置，返回时设置
+ this.scrollTop = {};
+ // 设置当前页面列表List的滚动位置
+ this.pageScrollTop = 0;
+ // 记录缓存路由当需要返回更新页面
+ this.spinPage = {};
+ // 防止MyList触底加载多次触发
+ this.loadBottom = false;
+ }
+
+ // 设置路由传参
+ setState(key, value) {
+ this.state[key] = value;
+ }
+
+ // 清除路由参数
+ clearState(key) {
+ delete this.state[key];
+ }
+
+ // 保存当前页面的scrollTop
+ setPageScrollTop(key, value) {
+ this.scrollTop[key] = value;
+ }
+
+ // 设置列表滚动
+ setPageScrollTopNow(key) {
+ this.pageScrollTop = this.scrollTop[key];
+ }
+
+ // 设置横向滚动
+ setPageScrollLeftNow(key) {
+ this.pageScrollLeft = this.scrollLeft[key];
+ }
+
+ // 设置列表滚动
+ clearPageScrollTopNow() {
+ this.pageScrollTop = 1;
+ }
+
+ // 设置列表滚动
+ clearPageScrollLeftNow() {
+ this.pageScrollLeft = 1;
+ }
+
+ // 设置返回路由页面需刷新
+ setSpinPage(key) {
+ this.spinPage[key] = true;
+ }
+
+ // 清除路由页面需刷新数据
+ clearSpinPage(key) {
+ delete this.spinPage[key];
+ }
+
+ // 设置触底加载状态
+ setLoadBottomStatus(visible) {
+ this.loadBottom = visible;
+ }
+}
+
+export default new routerStatus();
diff --git a/src/styles/form.less b/src/styles/form.less
new file mode 100644
index 0000000..1a6eefd
--- /dev/null
+++ b/src/styles/form.less
@@ -0,0 +1,32 @@
+// 必填字段标记样式
+.required-mark {
+ color: var(--theme_danger1_color, #ff5219);
+ margin-right: 4px;
+ font-family: SimSun, sans-serif;
+ font-size: 14px;
+ line-height: 1;
+}
+
+// 可选字段标记样式
+.optional-mark {
+ color: var(--common_level3_base_color, rgba(23, 26, 29, 0.24));
+ font-size: 12px;
+}
+
+// 表单标签样式
+.form-label {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ line-height: 22px;
+ color: var(--common_level1_base_color, rgba(23, 26, 29, 0.85));
+ margin-bottom: 8px;
+}
+
+// 表单错误提示样式
+.form-error {
+ color: var(--theme_danger1_color, #ff5219);
+ font-size: 12px;
+ line-height: 20px;
+ margin-top: 4px;
+}
\ No newline at end of file
diff --git a/src/styles/index.less b/src/styles/index.less
new file mode 100644
index 0000000..9179a88
--- /dev/null
+++ b/src/styles/index.less
@@ -0,0 +1,35 @@
+@import './theme.css';
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+@import './public.less';
+@import './form.less';
+
+@import '../views/login/index.less';
+
+.custom-grid-tabs {
+ display: flex;
+ flex-wrap: wrap;
+ background: #2176c1;
+ border-radius: 4px;
+ overflow: hidden;
+ background-color: #fff;
+ padding: 6px 12px;
+ .grid-tab-item {
+ box-sizing: border-box;
+ height: 48px;
+ line-height: 48px;
+ text-align: center;
+ color: #fff;
+ font-size: 16px;
+ cursor: pointer;
+ background: #2176c1;
+ transition: background 0.2s;
+ &.active {
+ background: #5faee3;
+ color: #fff;
+ font-weight: bold;
+ }
+ }
+}
+.custom-tab-content {
+ margin-top:0px;
+}
diff --git a/src/styles/public.less b/src/styles/public.less
new file mode 100644
index 0000000..c9a33fc
--- /dev/null
+++ b/src/styles/public.less
@@ -0,0 +1,676 @@
+// 主色
+@main-color: #1A6FB8;
+
+// 主色拓展
+@main-color-1: #E8F8FF;
+@main-color-2: #B6DDF1;
+@main-color-3: #89C2E3;
+@main-color-4: #5FA6D4;
+@main-color-5: #3A8AC6;
+
+@input-placeholder-color: rgba(0, 0, 0, 0.5); // Input
+@divider-color: rgba(0, 0, 0, 10%); // Divider
+@primary-color: @main-color; // 全局主色
+@link-color: @main-color; // 链接色
+@success-color: #00B42A; // 成功色
+@warning-color: #FA8C16; // 警告色
+@warning-bg-color: #fdf6e0; // 警告色背景
+@error-color: #F53F3F; // 错误色
+@font-size-base: 14px; // 主字号
+@line-height-base: 1.5715;
+@heading-color: rgba(0, 0, 0, 0.85); // 标题色
+@text-color: rgba(0, 0, 0, 0.85); // 主文本色
+@text-color-secondary: rgba(0, 0, 0, 0.65); // 次文本色
+@text-color-three: rgba(0, 0, 0, 0.5); // 次次文本色
+@disabled-color: rgba(0, 0, 0, 0.25); // 失效色
+@border-radius-base: 2px; // 组件/浮层圆角
+@border-color-base: #d9d9d9; // 边框色
+@box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05); // 浮层阴影
+
+@table-header-bg: #f2f3f5;
+@table-row-hover-bg: #e6f7ff;
+
+@loading-color: #1089ff; // 进行中
+
+@bg-color: #f0f2f5; // 项目背景色
+
+@tag-color: #fafafa; // 项目tag标签颜色
+
+@mediaConfirm: #05aeae; // 项目司法确认相关颜色
+
+@pageAboutMargin: 16px; // 页面基础边距
+
+@pageUpDownMargin: 16px; // 页面上下边距
+
+@pageMargin: 16px @pageAboutMargin; //页面上下左右边距
+
+@navBarHeight: 44px; // navBar高度
+@tabBarHeight: 48px; // tabBar高度
+
+
+html,
+body {
+ margin: 0;
+ padding: 0;
+ height: 100%;
+ width: 100%;
+ background-color: @common_bg_color;
+ // color: @common_level1_base_color;
+ .common_body_text_style;
+ font-size: 15px; // 添加全局默认字体大小
+}
+
+#root,
+.public-cacheRoute {
+ height: 100%;
+ width: 100%;
+}
+
+// 钉钉ui组件样式修改
+#root {
+ // spin
+ .public-spin {
+ background-color: @common_overlay_color;
+ z-index: 1005;
+ }
+
+ // SearchBar
+ .dtm-search-bar {
+ padding: 0 12px;
+ height: 60px;
+ }
+
+ .dtm-search-bar-input,
+ .dtm-search-bar-input .dtm-search-bar-synthetic-ph-container {
+ height: 36px;
+ background-color: #eaeced;
+ }
+
+ .dtm-search-bar-input .dtm-search-bar-value[type='search'] {
+ height: 36px;
+ .common_body_text_style;
+ }
+
+ .dtm-search-bar-input .dtm-search-bar-synthetic-ph {
+ height: 36px;
+ line-height: 36px;
+ }
+
+ .dtm-search-bar-input .dtm-search-bar-clear {
+ padding: 8px;
+ }
+
+ .dtm-search-bar-input .dtm-search-bar-synthetic-ph-icon {
+ vertical-align: -3px;
+ }
+
+ .dtm-search-bar-input .dtm-search-bar-synthetic-ph-placeholder {
+ .common_body_text_style;
+ vertical-align: inherit;
+ }
+
+ .dtm-search-bar-cancel {
+ .common_body_text_style;
+ color: @theme_primary1_color;
+ height: 60px;
+ line-height: 60px;
+ }
+
+ // empty
+ .dtm-empty-page {
+ top: 60%;
+ text-align: center;
+ transform: translate(-50%, -50%);
+ left: 50%;
+ }
+
+ .dtm-empty-page-inline {
+ transform: translate(0, 0);
+ top: 0;
+ left: 0;
+ }
+
+ .dtm-empty-page-title {
+ font-size: 17px;
+ line-height: 24px;
+ }
+
+ .dtm-empty-page-content {
+ bottom: 0;
+ padding: 0;
+ }
+
+ // List.Item搭配picker使用选择后值的颜色
+ .dtm-list-item .dtm-list-line .dtm-list-extra {
+ color: @common_level1_base_color;
+ max-width: 145px;
+ font-size: 16px !important;
+ line-height: 24px !important;
+ }
+
+ //选择框文本
+ .dtm-form-item-default-label {
+ // width: 208px !important;
+ }
+
+ .form-picker {
+ width: 72px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+
+ .dtm-picker-col-item {
+ font-size: 14px !important;
+ }
+
+ .dtm-picker-col-item-selected {
+ font-size: 16px !important;
+ }
+
+ .dtm-list {
+ height: 100%;
+ }
+
+ .dtm-list-body {
+ height: 100%;
+ }
+
+ .text_align_l {
+ text-align: left;
+ }
+
+ .text_align_r {
+ text-align: right;
+ }
+
+ .dtm-select-default-item .dtm-list-content {
+ text-align: right;
+ }
+
+ .dtm-list-content {
+ font-size: 15px;
+ }
+
+ .require-red {
+ color: #e41100;
+ }
+
+ .Picker-required-list {
+ padding-left: 0;
+ // margin-left: 16px;
+ }
+
+ .Picker-required {
+ padding-left: 16px;
+ }
+
+ .Picker-required:before {
+ position: absolute;
+ display: inline-block;
+ color: var(--theme_danger1_color, #ff5219);
+ font-size: 14px;
+ font-family: SimSun, sans-serif;
+ line-height: 1;
+ content: '*';
+ left: 8px;
+ top: 16px;
+ height: 10px;
+ }
+
+ .form-picker-defaultStyle:before {
+ top: 26px !important;
+ }
+
+ .form-picker-defaultStyleDate:before {
+ top: 15px !important;
+ }
+
+ // 多行输入框
+ textarea {
+ font-size: 15px;
+ line-height: 23px;
+ font-family: inherit;
+ }
+
+ // input,select
+ .dtm-input-item-input {
+ font-size: 15px;
+ line-height: 23px;
+ }
+
+ // DatePicker组件修改
+ .dtm-date-picker-form-inner-node-content {
+ text-align: right;
+ }
+
+ .dtm-form .dtm-select .dtm-list-item.dtm-select-default-item {
+ min-height: 46px;
+ padding-left: 0;
+ }
+}
+
+// DatePicker
+.dtm-picker-popup-mask,
+.dtm-picker-popup-wrap {
+ z-index: 1002;
+}
+
+// 字母指示IndexBar
+.dtm-indexBar-sticky .dtm-indexBar-anchor-title {
+ margin-bottom: 8px;
+ // display: none;
+}
+
+html .dtm-list-body :not(:last-child) .dtm-list-line:not(.dtm-list-line-hide-divider)::after {
+ background-color: #ffffff !important;
+}
+
+// modal.alert弹窗
+.dtm-modal-wrap,
+.dtm-modal-mask {
+ z-index: 1002;
+}
+
+//
+
+h4 {
+ margin: 0;
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 600;
+}
+
+h5 {
+ margin: 0;
+ .common_body_text_style;
+ font-weight: 600;
+}
+
+.h6 {
+ font-size: 20px;
+ line-height: 28px;
+ font-weight: 600;
+}
+
+.h7 {
+ font-size: 16px;
+ line-height: 25px;
+ font-weight: 600;
+}
+
+::-webkit-scrollbar {
+ display: none;
+}
+
+pre {
+ font-family: none;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+ margin: 0;
+}
+
+.public_body_text_style_bold {
+ .common_body_text_style;
+ font-weight: 600;
+}
+
+// 文本省略
+.ellipsis-text-1 {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.public-space {
+ height: 8px;
+ background: #f2f2f2;
+}
+
+// 彩色tag 圆角2px
+.public-tag {
+ font-size: 12px;
+ line-height: 20px;
+ padding: 0 4px;
+ border-radius: 2px;
+ color: @common_bg_z1_color;
+ display: inline-block;
+
+ &-red {
+ background-color: #d1423e;
+ }
+
+ &-blue {
+ background-color: #007fff;
+ }
+
+ &-blue2 {
+ color: @theme_primary1_color;
+ background-color: #e6f7ff;
+ }
+
+ &-green {
+ background-color: #009d3b;
+ }
+
+ &-green2 {
+ border: 0.5px solid #52c41a;
+ color: #52c41a;
+ }
+
+ &-green3 {
+ border: 0.5px solid #05aeae;
+ color: #05aeae;
+ }
+
+ &-organ {
+ background-color: #fff2e6;
+ color: #ff5500;
+ }
+
+ &-brown {
+ border: 0.5px solid #552719;
+ color: #552719;
+ }
+}
+
+// 类型单色tag 圆角4px
+.public-tag2 {
+ font-size: 12px;
+ line-height: 20px;
+ color: #879aab;
+ padding: 0 4px;
+ background-color: #edeef0;
+ border-radius: 4px;
+ display: inline-block;
+
+ &-red {
+ color: #ff4d4f;
+ background-color: rgba(255, 77, 79, 0.16);
+ }
+
+ &-organ {
+ color: @common_bg_z1_color;
+ background-color: rgba(255, 146, 0, 0.48);
+ }
+
+ &-organ2 {
+ color: rgba(255, 146, 0, 1);
+ background-color: rgba(255, 146, 0, 0.24);
+ }
+
+ &-organ3 {
+ color: #ff5b1f;
+ background-color: #ffe7d8;
+ }
+
+ &-blue {
+ color: @common_bg_z1_color;
+ background-color: #007fff;
+ }
+
+ &-blue3 {
+ color: @common_text_blue1_color;
+ background-color: rgba(0, 127, 255, 0.12);
+ }
+
+ &-green {
+ color: #009d3b;
+ background-color: rgba(0, 176, 66, 0.12);
+ }
+}
+
+// 必填tag
+.public-tag4 {
+ display: inline-block;
+ background: #edeef0;
+ color: #879aab;
+ font-size: 12px;
+ border-radius: 4px;
+ padding: 0 4px;
+ line-height: 18px;
+ height: 18px;
+}
+
+// 字体和边框变色
+.public-tag5 {
+ border-radius: 15px;
+ padding: 4px 8px;
+
+ &-red {
+ color: #ff4d4f;
+ border: 1px solid #ff4d4f;
+ }
+
+ &-organ {
+ color: @common_bg_z1_color;
+ border: 1px solid @common_bg_z1_color;
+ }
+
+ &-organ2 {
+ color: rgba(255, 146, 0, 1);
+ border: 1px solid rgba(255, 146, 0, 1);
+ }
+
+ &-blue {
+ color: @main-color;
+ border: 1px solid @main-color;
+ }
+
+ &-green {
+ color: rgba(0, 176, 66, 1);
+ border: 1px solid rgba(0, 176, 66, 1);
+ }
+
+ &-grey {
+ color: rgba(23, 26, 29, 0.24);
+ border: 1px solid rgba(23, 26, 29, 0.24);
+ }
+}
+
+.public-tag6 {
+ border-radius: 10px;
+ padding: 2px 8px;
+}
+
+// border-radius=2
+.public-tag7 {
+ border-radius: 2px;
+ font-size: 14px;
+ padding: 3px 8px;
+ color: rgba(23, 26, 29, 0.6);
+ border: 1px solid rgba(126, 134, 142, 0.16);
+}
+
+// 字体左侧border
+.public-rightBorder {
+ position: relative;
+ margin-left: 13px;
+
+ &::before {
+ content: '';
+ position: absolute;
+ border-left: 1px solid rgba(0, 0, 0, 0.2);
+ height: 14px;
+ top: 50%;
+ margin-top: -7px;
+ left: -7px;
+ }
+}
+
+// icon样式
+.public-icon {
+ display: flex;
+}
+
+// 竖直分割线
+.public-split {
+ height: 14px;
+ width: 1px;
+ margin: 0 8px;
+ background-color: @common_line_hard_color;
+}
+
+// 二次确认弹窗样式
+.confirmModal {
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 600;
+ }
+
+ &-subtitle {
+ font-size: 14px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ }
+}
+
+// 颜色
+.public-search-color,
+.public-color {
+ color: @theme_primary1_color;
+}
+
+.public-success-color {
+ color: @common_green1_color;
+}
+
+.public-fail-color {
+ color: @common_red1_color;
+}
+
+// 操作弹窗底部操作按钮样式
+.myModal {
+ &-action {
+ border-top: 1px solid @common_line_light_color;
+ display: flex;
+
+ &-item1,
+ &-item2 {
+ flex: 1;
+ padding: 12px 0;
+ text-align: center;
+ font-size: 16px;
+ }
+
+ &-item2 {
+ color: @theme_primary1_color;
+ border-left: 1px solid @common_line_light_color;
+ }
+ }
+}
+
+.head-tip-blue {
+ background: #007fff;
+ width: 4px;
+ height: 14px;
+ display: inline-block;
+ margin-right: 8px;
+}
+
+// empty
+.public-empty {
+ position: fixed;
+ top: 60%;
+ text-align: center;
+ transform: translate(-50%, -50%);
+ left: 50%;
+ margin-top: 90px;
+ width: 400px;
+ max-width: 300px;
+}
+
+// 白底次一级按钮
+.public-btn {
+ &-danger {
+ color: @theme_danger1_color;
+ border: 1px solid @theme_danger1_color;
+ background-color: @common_bg_z1_color;
+
+ &:hover,
+ &:focus {
+ color: @theme_danger1_color;
+ }
+
+ &:hover::after {
+ background-color: transparent;
+ }
+ }
+
+ &-primary {
+ color: @theme_primary1_color;
+ border: 1px solid @theme_primary1_color;
+ background-color: @common_bg_z1_color;
+
+ &:hover,
+ &:focus {
+ color: @theme_primary1_color;
+ }
+
+ &:hover::after {
+ background-color: transparent;
+ }
+ }
+}
+
+// radio
+.public-radio {
+ height: 18px;
+ width: 18px;
+ border-radius: 50%;
+ border: 2px solid @common_line_hard_color;
+
+ &-active {
+ border-color: @theme_primary1_color;
+ background-color: @theme_primary1_color;
+ color: @common_bg_z1_color;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 12px;
+ }
+}
+
+// empty 样式
+.dtm-empty-page-button {
+ margin-top: 0px !important;
+}
+
+.institutions-add {
+ &-form {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+
+ &-main {
+ height: calc(100% - 44px);
+ }
+
+ &-item {
+ flex: 1;
+ overflow: hidden;
+ margin-top: 8px;
+
+ &-button {
+ padding: 12px 16px;
+ background-color: #fff;
+ }
+ }
+ }
+
+ .dtm-list-content {
+ transform: translateY(20%);
+ }
+}
+
+.dtm-input-item-desktop-input {
+ border: 0px !important;
+ outline: none;
+ border: 0 !important;
+ padding: 0 !important;
+}
+
+.dtm-textarea-item-desktop {
+ border: 0px !important;
+}
diff --git a/src/styles/theme.css b/src/styles/theme.css
new file mode 100644
index 0000000..db556d3
--- /dev/null
+++ b/src/styles/theme.css
@@ -0,0 +1,516 @@
+:root {
+ --common_border_radius_s: 4px;
+ --common_border_radius_m: 6px;
+ --common_border_radius_l: 8px;
+ --common_border_radius_auto: 9.6px;
+ --common_supertitle_text_style__font-size: 28px;
+ --common_supertitle_text_style__line-height: 1.2;
+ --common_supertitle_bold_text_style__font-size: 28px;
+ --common_supertitle_bold_text_style__line-height: 1.2;
+ --common_largetitle_text_style__font-size: 24px;
+ --common_largetitle_text_style__line-height: 1.2;
+ --common_largetitle_bold_text_style__font-size: 24px;
+ --common_largetitle_bold_text_style__line-height: 1.2;
+ --common_h1_text_style__font-size: 20px;
+ --common_h1_text_style__line-height: 1.4;
+ --common_h1_bold_text_style__font-size: 20px;
+ --common_h1_bold_text_style__line-height: 1.4;
+ --common_h2_text_style__font-size: 18px;
+ --common_h2_text_style__line-height: 1.4;
+ --common_h2_bold_text_style__font-size: 18px;
+ --common_h2_bold_text_style__line-height: 1.4;
+ --common_body_text_style__font-size: 1px;
+ --common_body_text_style__line-height: 24px;
+ --common_body_bold_text_style__font-size: 14px;
+ --common_body_bold_text_style__line-height: 22px;
+ --common_paragraph_text_style__font-size: 16px;
+ --common_paragraph_text_style__line-height: 22px;
+ --common_paragraph_bold_text_style__font-size: 14px;
+ --common_paragraph_bold_text_style__line-height: 22px;
+ --common_action_text_style__font-size: 14px;
+ --common_action_text_style__line-height: 1.5;
+ --common_action_bold_text_style__font-size: 14px;
+ --common_action_bold_text_style__line-height: 1.5;
+ --common_subhead_text_style__font-size: 15px;
+ --common_subhead_text_style__line-height: 1.5;
+ --common_subhead_bold_text_style__font-size: 15px;
+ --common_subhead_bold_text_style__line-height: 1.5;
+ --common_description_text_style__font-size: 12px;
+ --common_description_text_style__line-height: 20px;
+ --common_description_bold_text_style__font-size: 12px;
+ --common_description_bold_text_style__line-height: 20px;
+ --common_footnote_text_style__font-size: 12px;
+ --common_footnote_text_style__line-height: 1.5;
+ --common_footnote_bold_text_style__font-size: 12px;
+ --common_footnote_bold_text_style__line-height: 1.5;
+ --common_tiny_text_style__font-size: 10px;
+ --common_tiny_text_style__line-height: 1.6;
+ --common_tiny_bold_text_style__font-size: 10px;
+ --common_tiny_bold_text_style__line-height: 1.6;
+ --common_box_shadow_s__box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.16);
+ --common_box_shadow_m__box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.16);
+ --common_box_shadow_l__box-shadow: 0px 12px 32px rgba(0, 0, 0, 0.24);
+ --common_light_motion_duration: 0.2s;
+ --common_light_motion_timing_function: ease-out;
+ --common_normal_motion_duration: 0.24s;
+ --common_normal_motion_timing_function: cubic-bezier(0.8, 0, 0.68, 0.92);
+ --common_hard_motion_duration: 0.36s;
+ --common_hard_motion_timing_function: cubic-bezier(0.66, 0, 0.01, 1);
+ --common_h3_text_style__font-size: 18px;
+ --common_h3_text_style__line-height: 1.4;
+ --common_h3_bold_text_style__font-size: 18px;
+ --common_h3_bold_text_style__line-height: 1.4;
+ --common_h4_text_style__font-size: 16px;
+ --common_h4_text_style__line-height: 24px;
+ --common_h4_bold_text_style__font-size: 16px;
+ --common_h4_bold_text_style__line-height: 24px;
+ --common_h5_text_style__font-size: 15px;
+ --common_h5_text_style__line-height: 1.5;
+ --common_h5_bold_text_style__font-size: 15px;
+ --common_h5_bold_text_style__line-height: 1.5;
+ --common_hypertitle_text_style__font-size: 28px;
+ --common_hypertitle_text_style__line-height: 1.2;
+ --common_hypertitle_bold_text_style__font-size: 28px;
+ --common_hypertitle_bold_text_style__line-height: 1.2;
+}
+:root[data-dingtalk-platform='pc'] {
+ --common_border_radius_s: 4px;
+ --common_border_radius_m: 6px;
+ --common_border_radius_l: 8px;
+ --common_border_radius_auto: 9.6px;
+ --common_hypertitle_text_style__font-size: 64px;
+ --common_hypertitle_text_style__line-height: 1.2;
+ --common_hypertitle_bold_text_style__font-size: 64px;
+ --common_hypertitle_bold_text_style__line-height: 1.2;
+ --common_supertitle_text_style__font-size: 44px;
+ --common_supertitle_text_style__line-height: 1.2;
+ --common_supertitle_bold_text_style__font-size: 44px;
+ --common_supertitle_bold_text_style__line-height: 1.2;
+ --common_largetitle_text_style__font-size: 32px;
+ --common_largetitle_text_style__line-height: 1.2;
+ --common_largetitle_bold_text_style__font-size: 32px;
+ --common_largetitle_bold_text_style__line-height: 1.2;
+ --common_h1_text_style__font-size: 24px;
+ --common_h1_text_style__line-height: 1.4;
+ --common_h1_bold_text_style__font-size: 24px;
+ --common_h1_bold_text_style__line-height: 1.4;
+ --common_h2_text_style__font-size: 20px;
+ --common_h2_text_style__line-height: 1.4;
+ --common_h2_bold_text_style__font-size: 20px;
+ --common_h2_bold_text_style__line-height: 1.4;
+ --common_h3_text_style__font-size: 18px;
+ --common_h3_text_style__line-height: 1.4;
+ --common_h3_bold_text_style__font-size: 18px;
+ --common_h3_bold_text_style__line-height: 1.4;
+ --common_h4_text_style__font-size: 16px;
+ --common_h4_text_style__line-height: 24px;
+ --common_h4_bold_text_style__font-size: 16px;
+ --common_h4_bold_text_style__line-height: 24px;
+ --common_h5_text_style__font-size: 15px;
+ --common_h5_text_style__line-height: 1.5;
+ --common_h5_bold_text_style__font-size: 15px;
+ --common_h5_bold_text_style__line-height: 1.5;
+ --common_body_text_style__font-size: 16px;
+ --common_body_text_style__line-height: 24px;
+ --common_body_bold_text_style__font-size: 14px;
+ --common_body_bold_text_style__line-height: 22px;
+ --common_paragraph_text_style__font-size: 16px;
+ --common_paragraph_text_style__line-height: 22px;
+ --common_paragraph_bold_text_style__font-size: 14px;
+ --common_paragraph_bold_text_style__line-height: 22px;
+ --common_action_text_style__font-size: 14px;
+ --common_action_text_style__line-height: 1.5;
+ --common_action_bold_text_style__font-size: 14px;
+ --common_action_bold_text_style__line-height: 1.5;
+ --common_description_text_style__font-size: 12px;
+ --common_description_text_style__line-height: 20px;
+ --common_description_bold_text_style__font-size: 12px;
+ --common_description_bold_text_style__line-height: 20px;
+ --common_tiny_text_style__font-size: 10px;
+ --common_tiny_text_style__line-height: 1.6;
+ --common_tiny_bold_text_style__font-size: 10px;
+ --common_tiny_bold_text_style__line-height: 1.6;
+ --common_box_shadow_s__box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.16);
+ --common_box_shadow_m__box-shadow: 0px 8px 24px rgba(0, 0, 0, 0.16);
+ --common_box_shadow_l__box-shadow: 0px 12px 32px rgba(0, 0, 0, 0.24);
+ --common_light_motion_duration: 0.2s;
+ --common_light_motion_timing_function: ease-out;
+ --common_normal_motion_duration: 0.24s;
+ --common_normal_motion_timing_function: cubic-bezier(0.8, 0, 0.68, 0.92);
+ --common_hard_motion_duration: 0.36s;
+ --common_hard_motion_timing_function: cubic-bezier(0.66, 0, 0.01, 1);
+ --common_subhead_text_style__font-size: 15px;
+ --common_subhead_text_style__line-height: 1.5;
+ --common_subhead_bold_text_style__font-size: 15px;
+ --common_subhead_bold_text_style__line-height: 1.5;
+ --common_footnote_text_style__font-size: 12px;
+ --common_footnote_text_style__line-height: 1.5;
+ --common_footnote_bold_text_style__font-size: 12px;
+ --common_footnote_bold_text_style__line-height: 1.5;
+}
+:root {
+ --common_level1_base_color: rgba(23, 26, 29, 0.85);
+ --common_level2_base_color: rgba(23, 26, 29, 0.6);
+ --common_level3_base_color: rgba(23, 26, 29, 0.24);
+ --common_level4_base_color: rgba(23, 26, 29, 0.4);
+ --common_stamp_color: #f2f2f2;
+ --common_link_color: rgba(49, 126, 208, 1);
+ --common_link_press_color: rgba(49, 126, 208, 0.4);
+ --common_text_blue1_color: rgba(0, 127, 255, 1);
+ --common_fg_color: rgba(255, 255, 255, 1);
+ --common_fg_z1_color: rgba(255, 255, 255, 1);
+ --common_fg_z2_color: rgba(255, 255, 255, 1);
+ --common_fg_press_color: rgba(246, 246, 246, 1);
+ --common_bg_color: #f2f2f2;
+ --common_bg_color_2: rgba(246, 247, 251, 1);
+ --common_bg_z1_color: rgba(255, 255, 255, 1);
+ --common_line_hard_color: rgba(126, 134, 142, 0.24);
+ --common_line_light_color: rgba(126, 134, 142, 0.16);
+ --common_overlay_color: rgba(0, 0, 0, 0.16);
+ --common_overlay_hover_color: rgba(126, 134, 142, 0.16);
+ --common_overlay_press_color: rgba(126, 134, 142, 0.24);
+ --common_overlay_normal_color: rgba(255, 255, 255, 0.4);
+ --theme_primary1_color: #1A6FB8;
+ --theme_primary2_color: rgba(0, 127, 255, 0.48);
+ --theme_primary3_color: rgba(0, 127, 255, 0.12);
+ --theme_primary_hover_color: rgba(0, 117, 235, 1);
+ --theme_primary_press_color: rgba(0, 106, 214, 1);
+ --theme_danger1_color: #f5222d;
+ --theme_danger2_color: rgba(255, 82, 25, 0.48);
+ --theme_danger3_color: rgba(255, 82, 25, 0.12);
+ --theme_danger_hover_color: rgba(235, 75, 23, 1);
+ --theme_danger_press_color: rgba(214, 68, 20, 1);
+ --common_blue1_color: rgba(0, 127, 255, 1);
+ --common_blue1_hover_color: rgba(56, 155, 255, 1);
+ --common_blue1_active_color: rgba(0, 93, 214, 1);
+ --common_blue2_color: rgba(0, 127, 255, 0.48);
+ --common_blue3_color: rgba(0, 127, 255, 0.12);
+ --common_red1_color: rgba(255, 82, 25, 1);
+ --common_red1_hover_color: #ff642b;
+ --common_red1_active_color: #e41100;
+ --common_red2_color: rgba(255, 82, 25, 0.48);
+ --common_red3_color: rgba(255, 82, 25, 0.12);
+ --common_orange1_color: rgb(255, 91, 31, 1);
+ --common_orange2_color: rgba(255, 146, 0, 0.48);
+ --common_orange3_color: rgba(255, 146, 0, 0.12);
+ --common_green1_color: rgba(0, 176, 66, 1);
+ --common_green2_color: rgba(0, 176, 66, 0.48);
+ --common_green3_color: rgba(0, 176, 66, 0.12);
+ --common_yellow1_color: rgba(244, 200, 0, 1);
+ --common_yellow2_color: rgba(244, 200, 0, 0.48);
+ --common_yellow3_color: rgba(244, 200, 0, 0.12);
+ --common_purple1_color: rgba(185, 99, 211, 1);
+ --common_purple2_color: rgba(185, 99, 211, 0.48);
+ --common_purple3_color: rgba(185, 99, 211, 0.12);
+ --common_water1_color: rgba(90, 200, 250, 1);
+ --common_water2_color: rgba(90, 200, 250, 0.48);
+ --common_water3_color: rgba(90, 200, 250, 0.12);
+ --common_pink1_color: rgba(236, 69, 137, 1);
+ --common_pink2_color: rgba(236, 69, 137, 0.48);
+ --common_pink3_color: rgba(236, 69, 137, 0.12);
+ --common_olive1_color: rgba(111, 146, 0, 1);
+ --common_olive2_color: rgba(111, 146, 0, 0.48);
+ --common_olive3_color: rgba(111, 146, 0, 0.12);
+ --common_white1_color: rgba(255, 255, 255, 1);
+ --common_white2_color: rgba(255, 255, 255, 0.4);
+ --common_white3_color: rgba(255, 255, 255, 0.28);
+ --common_white4_color: rgba(255, 255, 255, 0.16);
+ --common_white5_color: rgba(255, 255, 255, 0.08);
+ --common_black1_color: rgba(0, 0, 0, 1);
+ --common_black2_color: rgba(0, 0, 0, 0.4);
+ --common_black3_color: rgba(0, 0, 0, 0.28);
+ --common_black4_color: rgba(0, 0, 0, 0.18);
+ --common_black5_color: rgba(0, 0, 0, 0.08);
+ --common_gray1_color: #878f95;
+ --common_gray2_color: #a9aeb3;
+ --common_gray3_color: #c3c7ca;
+ --common_gray4_color: #cfd2d5;
+ --common_gray5_color: #e5e6e8;
+ --common_gray6_color: #f1f2f3;
+ --button_secondary_bg_color: #fff;
+ --common_action_icon_color: rgba(23, 26, 29, 1);
+ --common_action_icon_press_color: rgba(23, 26, 29, 0.4);
+ --common_backdropblur_menu: rgba(255, 255, 255, 0.88);
+ --common_backdropblur_tabbar: rgba(245, 247, 250, 0.88);
+ --common_tips_bg_color: rgba(69, 72, 74, 0.9);
+ --button_secondary_line_color: rgba(126, 134, 142, 0.24);
+ --im_chat_message_bg_color: #c9e7ff;
+ --im_chat_message_press_bg_color: #bfddf5;
+ --im_chat_message_other_press_bg_color: #e7e9ee;
+ --im_chat_announcement_message_bg_color: #fcedd9;
+ --im_chat_announcement_message_press_bg_color: #e8dac7;
+ --im_chat_announcement_message_font_color: #191f25;
+ --im_move_to_slide_action_bg_color: rgba(0, 176, 66, 1);
+ --im_move_to_slide_action_press_bg_color: #009036;
+ --im_chat_name_text_color: #7d8082;
+ --im_chat_list_bg_z1_color: rgba(255, 255, 255, 1);
+ --im_chat_sidebar_bg_color: rgba(235, 235, 235, 1);
+ --im_chat_card_bg_color: rgba(255, 255, 255, 1);
+ --im_chat_user_tag_bg: rgba(255, 255, 255, 0.72);
+ --im_redbag_button_text_color: #884c31;
+ --im_ipad_chat_bg_color: rgba(255, 255, 255, 1);
+ --im_sticky_to_top_tag_bg_color: rgba(45, 132, 250, 0.24);
+ --im_pic_preview_bar_bg_color: rgba(255, 255, 255, 0.9);
+ --im_paymodule1_bg_color: #f7563f;
+ --im_paymodule2_bg_color: #f6ce0b;
+ --im_paymodule3_bg_color: #9a4300;
+ --im_paymodule4_bg_color: #fcf7d7;
+ --im_paymodule5_bg_color: #af9a7c;
+ --im_paymodule6_bg_color: #e05449;
+ --im_paymodule7_bg_color: #f1e7b2;
+ --im_paymodule8_bg_color: #884d31;
+ --im_paymodule9_bg_color: #ffe4bb;
+ --im_chatcard_disabled_cover_bg_color: rgba(255, 255, 255, 0.4);
+ --im_chat_stick_bg_color: rgba(136, 149, 176, 0.12);
+ --im_chat_stick_press_bg_color: rgba(136, 149, 176, 0.24);
+ --kankan_link_color: #5c7099;
+ --im_chat_at_user_text_color: rgba(255, 255, 255, 1);
+ --im_chat_bg_z1_color: rgba(255, 255, 255, 1);
+ --im_chat_common_blue1_color: rgba(0, 127, 255, 1);
+ --im_chat_message_other_bg_color: rgba(255, 255, 255, 1);
+ --im_chat_message_more_bg_color: rgba(255, 255, 255, 1);
+ --im_chat_bg_color: rgba(241, 242, 243, 1);
+ --im_chat_text_message_other_bg_color: rgba(255, 255, 255, 1);
+ --im_diagonal_bg_color: rgba(0, 93, 214, 0.4);
+ --ding_homepage_expired_button_bg_color: rgba(254, 225, 81, 1);
+ --ding_homepage_expired_button_press_bg_color: #e2c94c;
+ --ding_homepage_expired_button_disabled_bg_color: rgba(254, 225, 81, 0.12);
+ --ding_homepage_received_button_bg_color: #ffc01a;
+ --ding_homepage_received_button_press_bg_color: #e3ac1a;
+ --ding_untap_cell_bg_color: #fcf7d7;
+ --ding_untap_cell_press_bg_color: #e0dcc0;
+ --phone_dail_normal_button_bg_color: #15bc83;
+ --phone_dail_normal_button_press_bg_color: #15a977;
+ --phone_discover_team_bg_color: #e6f2fe;
+ --videomeeting_roundbutton_bg_color: rgba(0, 0, 0, 0.72);
+ --common_level5_base_color: rgba(17, 31, 44, 0.12);
+ --common_level6_base_color: rgba(17, 31, 44, 0.12);
+ --common_level7_base_color: rgba(17, 31, 44, 0.08);
+ --common_level1_contrary_color: white;
+ --common_level4_contrary_color: rgba(255, 255, 255, 0.4);
+ --common_level5_contrary_color: rgba(255, 255, 255, 0.28);
+ --common_level6_contrary_color: rgba(255, 255, 255, 0.28);
+ --common_level7_contrary_color: rgba(255, 255, 255, 0.28);
+ --popover_bg_color: #45484a;
+ --common_level8_base_color: #eef1f3;
+ --common_level2_contrary_color: white;
+ --common_level3_contrary_color: white;
+ --common_hover_bg_color: rgba(126, 134, 142, 0.12);
+ --common_text_selected_gb_color: rgba(23, 26, 29, 1);
+ --common_text_bg_color: rgba(23, 26, 29, 1);
+ --common_text_disabled_bg_color: rgba(23, 26, 29, 0.24);
+ --common_tab_bg_color: #eef0f4;
+ --common_tab_icon_selected_bg_color: rgba(45, 132, 250, 1);
+ --common_tab_icon_bg_color: rgba(0, 106, 254, 1);
+ --common_tab_icon_disable_bg_color: rgba(0, 106, 254, 0.24);
+ --common_tab_icon_unselected_bg_color: rgba(255, 255, 255, 0.4);
+ --common_tab_icon_hover_bg_color: rgba(255, 255, 255, 0.4);
+ --common_darkline_bg_color: #e8e8e9;
+ --common_darkcover_bg_color: rgba(0, 0, 0, 0.4);
+ --common_shadow_bg_color: rgba(0, 0, 0, 0.4);
+ --common_backdropblur_base: rgba(238, 240, 244, 0.88);
+ --im_chat_text_message_other_press_bg_color: #f6f6f6;
+ --im_chat_shortcut_unactive_bg_color: rgba(23, 26, 29, 0.16);
+ --im_chatlist_press_bg_color: rgba(126, 134, 142, 0.16);
+ --im_chatlist_hover_bg_color: rgba(126, 134, 142, 0.12);
+ --common_topbar_bg_color: #0076f6;
+ --common_topbar_white1_color: rgba(255, 255, 255, 1);
+ --common_topbar_white2_color: rgba(255, 255, 255, 0.8);
+ --common_topbar_white3_color: rgba(255, 255, 255, 0.6);
+ --common_topbar_white4_color: rgba(255, 255, 255, 0.4);
+ --common_topbar_white5_color: rgba(255, 255, 255, 0.24);
+ --common_topbar_white6_color: rgba(255, 255, 255, 0.16);
+ --im_chat_report_bg_color: #f2f4f8;
+ --common_text_selected_bg_color: #378de9;
+ --common_topbar_search_bg_color: rgba(255, 255, 255, 0.24);
+ --common_topbar_search_hover_bg_color: rgba(255, 255, 255, 0.32);
+ --common_select_bg_color: rgba(126, 134, 142, 0.16);
+ --common_memo_desk_top_bk_color: rgba(222, 239, 253, 1);
+}
+
+:root[data-dingtalk-theme='dark'] {
+ --common_level1_base_color: rgba(255, 255, 255, 0.85);
+ --common_level2_base_color: rgba(255, 255, 255, 0.5);
+ --common_level3_base_color: rgba(255, 255, 255, 0.4);
+ --common_level4_base_color: rgba(255, 255, 255, 0.4);
+ --common_stamp_color: rgba(255, 255, 255, 0.03);
+ --common_link_color: rgba(62, 136, 214, 1);
+ --common_link_press_color: rgba(62, 136, 214, 0.4);
+ --common_text_blue1_color: rgba(71, 169, 255, 1);
+ --common_fg_color: rgba(24, 25, 27, 1);
+ --common_fg_z1_color: rgba(28, 29, 31, 1);
+ --common_fg_z2_color: rgba(89, 89, 89, 1);
+ --common_fg_press_color: rgba(60, 60, 60, 1);
+ --common_bg_color: rgba(17, 18, 19, 1);
+ --common_bg_color_2: rgba(17, 18, 19, 1);
+ --common_bg_z1_color: rgba(24, 25, 27, 1);
+ --common_line_hard_color: rgba(126, 134, 142, 0.18);
+ --common_line_light_color: rgba(126, 134, 142, 0.1);
+ --common_overlay_color: rgba(0, 0, 0, 0.16);
+ --common_overlay_hover_color: rgba(255, 255, 255, 0.08);
+ --common_overlay_press_color: rgba(255, 255, 255, 0.16);
+ --common_overlay_normal_color: rgba(0, 0, 0, 0.16);
+ --theme_primary1_color: rgba(0, 127, 255, 1);
+ --theme_primary2_color: rgba(0, 127, 255, 0.48);
+ --theme_primary3_color: rgba(0, 127, 255, 0.12);
+ --theme_primary_hover_color: rgba(20, 137, 255, 1);
+ --theme_primary_press_color: rgba(41, 147, 255, 1);
+ --theme_danger1_color: rgba(255, 94, 43, 1);
+ --theme_danger2_color: rgba(255, 94, 43, 0.48);
+ --theme_danger3_color: rgba(255, 94, 43, 0.12);
+ --theme_danger_hover_color: rgba(255, 106, 59, 1);
+ --theme_danger_press_color: rgba(255, 119, 77, 1);
+ --common_blue1_color: rgba(0, 127, 255, 1);
+ --common_blue1_hover_color: rgba(56, 155, 255, 1);
+ --common_blue1_active_color: rgba(0, 93, 214, 1);
+ --common_blue2_color: rgba(0, 127, 255, 0.48);
+ --common_blue3_color: rgba(0, 127, 255, 0.12);
+ --common_red1_color: rgba(255, 94, 43, 1);
+ --common_red1_hover_color: #ff6f3a;
+ --common_red1_active_color: #db2b00;
+ --common_red2_color: rgba(255, 94, 43, 0.48);
+ --common_red3_color: rgba(255, 94, 43, 0.16);
+ --common_orange1_color: rgba(255, 155, 0, 1);
+ --common_orange2_color: rgba(255, 155, 0, 0.48);
+ --common_orange3_color: rgba(255, 155, 0, 0.16);
+ --common_green1_color: rgba(0, 174, 75, 1);
+ --common_green2_color: rgba(0, 174, 75, 0.48);
+ --common_green3_color: rgba(0, 174, 75, 0.16);
+ --common_yellow1_color: rgba(237, 195, 0, 1);
+ --common_yellow2_color: rgba(237, 195, 0, 0.48);
+ --common_yellow3_color: rgba(237, 195, 0, 0.16);
+ --common_purple1_color: rgba(180, 99, 204, 1);
+ --common_purple2_color: rgba(180, 99, 204, 0.48);
+ --common_purple3_color: rgba(180, 99, 204, 0.16);
+ --common_water1_color: rgba(90, 200, 250, 1);
+ --common_water2_color: rgba(90, 200, 250, 0.48);
+ --common_water3_color: rgba(90, 200, 250, 0.16);
+ --common_pink1_color: rgba(227, 73, 134, 1);
+ --common_pink2_color: rgba(227, 73, 134, 0.48);
+ --common_pink3_color: rgba(227, 73, 134, 0.16);
+ --common_olive1_color: rgba(111, 143, 5, 1);
+ --common_olive2_color: rgba(111, 143, 5, 0.48);
+ --common_olive3_color: rgba(111, 143, 5, 0.16);
+ --common_white1_color: rgba(255, 255, 255, 1);
+ --common_white2_color: rgba(255, 255, 255, 0.4);
+ --common_white3_color: rgba(255, 255, 255, 0.28);
+ --common_white4_color: rgba(255, 255, 255, 0.16);
+ --common_white5_color: rgba(255, 255, 255, 0.08);
+ --common_black1_color: rgba(0, 0, 0, 1);
+ --common_black2_color: rgba(0, 0, 0, 0.4);
+ --common_black3_color: rgba(0, 0, 0, 0.28);
+ --common_black4_color: rgba(0, 0, 0, 0.18);
+ --common_black5_color: rgba(0, 0, 0, 0.08);
+ --common_gray1_color: #8f8f8f;
+ --common_gray2_color: #636363;
+ --common_gray3_color: #4a4a4a;
+ --common_gray4_color: #383838;
+ --common_gray5_color: #2b2b2b;
+ --common_gray6_color: #1c1c1c;
+ --button_secondary_bg_color: rgba(74, 74, 74, 1);
+ --common_action_icon_color: rgba(255, 255, 255, 0.8);
+ --common_action_icon_press_color: rgba(255, 255, 255, 0.4);
+ --common_backdropblur_menu: rgba(32, 33, 36, 0.8);
+ --common_backdropblur_tabbar: rgba(32, 33, 36, 0.8);
+ --common_tips_bg_color: rgba(69, 72, 74, 0.9);
+ --button_secondary_line_color: rgba(74, 74, 74, 0.6);
+ --im_chat_message_bg_color: rgba(23, 50, 84, 1);
+ --im_chat_message_press_bg_color: rgba(41, 66, 97, 1);
+ --im_chat_message_other_press_bg_color: rgba(44, 48, 56, 1);
+ --im_chat_announcement_message_bg_color: rgba(32, 35, 40, 1);
+ --im_chat_announcement_message_press_bg_color: rgba(74, 76, 79, 1);
+ --im_chat_announcement_message_font_color: rgba(25, 31, 37, 1);
+ --im_move_to_slide_action_bg_color: #15bc83;
+ --im_move_to_slide_action_press_bg_color: #15a977;
+ --im_chat_name_text_color: #7d8082;
+ --im_chat_list_bg_z1_color: rgba(21, 22, 23, 1);
+ --im_chat_sidebar_bg_color: rgba(8, 9, 12, 1);
+ --im_chat_card_bg_color: rgba(32, 35, 40, 1);
+ --im_chat_user_tag_bg: rgba(32, 35, 40, 0.72);
+ --im_redbag_button_text_color: #884c31;
+ --im_ipad_chat_bg_color: #f6f6f6;
+ --im_sticky_to_top_tag_bg_color: rgba(50, 150, 250, 0.28);
+ --im_pic_preview_bar_bg_color: rgba(255, 255, 255, 0.9);
+ --im_paymodule1_bg_color: #f7563f;
+ --im_paymodule2_bg_color: #f6ce0b;
+ --im_paymodule3_bg_color: #9a4300;
+ --im_paymodule4_bg_color: #fcf7d7;
+ --im_paymodule5_bg_color: #af9a7c;
+ --im_paymodule6_bg_color: #e05449;
+ --im_paymodule7_bg_color: #f1e7b2;
+ --im_paymodule8_bg_color: #884d31;
+ --im_paymodule9_bg_color: #ffe4bb;
+ --im_chatcard_disabled_cover_bg_color: rgba(0, 0, 0, 0.48);
+ --im_chat_stick_bg_color: rgba(136, 149, 176, 0.12);
+ --im_chat_stick_press_bg_color: rgba(136, 149, 176, 0.24);
+ --kankan_link_color: #6b7a99;
+ --im_chat_at_user_text_color: rgba(255, 255, 255, 0.8);
+ --im_chat_bg_z1_color: rgba(21, 22, 23, 1);
+ --im_chat_common_blue1_color: rgba(71, 169, 255, 1);
+ --im_chat_message_other_bg_color: rgba(32, 35, 40, 1);
+ --im_chat_message_more_bg_color: rgba(25, 31, 37, 1);
+ --im_chat_bg_color: rgba(17, 18, 19, 1);
+ --im_chat_text_message_other_bg_color: rgba(32, 35, 40, 1);
+ --im_diagonal_bg_color: rgba(0, 0, 0, 0.16);
+ --ding_homepage_expired_button_bg_color: rgba(254, 225, 81, 1);
+ --ding_homepage_expired_button_press_bg_color: #e2c94c;
+ --ding_homepage_expired_button_disabled_bg_color: rgba(254, 225, 81, 0.12);
+ --ding_homepage_received_button_bg_color: #ffc01a;
+ --ding_homepage_received_button_press_bg_color: #e3ac1a;
+ --ding_untap_cell_bg_color: #fcf7d7;
+ --ding_untap_cell_press_bg_color: #e0dcc0;
+ --phone_dail_normal_button_bg_color: #15bc83;
+ --phone_dail_normal_button_press_bg_color: #15a977;
+ --phone_discover_team_bg_color: #e6f2fe;
+ --videomeeting_roundbutton_bg_color: rgba(0, 0, 0, 0.72);
+ --common_level5_base_color: rgba(255, 255, 255, 0.2);
+ --common_level6_base_color: rgba(255, 255, 255, 0.16);
+ --common_level7_base_color: rgba(164, 180, 203, 0.16);
+ --common_level1_contrary_color: rgba(25, 31, 37, 1);
+ --common_level4_contrary_color: rgba(25, 31, 37, 0.28);
+ --common_level5_contrary_color: rgba(25, 31, 37, 0.16);
+ --common_level6_contrary_color: rgba(25, 31, 37, 0.12);
+ --common_level7_contrary_color: rgba(25, 31, 37, 0.08);
+ --popover_bg_color: #45484a;
+ --common_level8_base_color: #1e2022;
+ --common_level2_contrary_color: rgba(25, 31, 37, 0.56);
+ --common_level3_contrary_color: rgba(25, 31, 37, 0.4);
+ --common_hover_bg_color: rgba(126, 134, 142, 0.12);
+ --common_text_selected_gb_color: rgba(238, 242, 248, 1);
+ --common_text_bg_color: rgba(238, 242, 248, 1);
+ --common_text_disabled_bg_color: rgba(238, 242, 248, 0.24);
+ --common_tab_bg_color: #1d2125;
+ --common_tab_icon_selected_bg_color: rgba(57, 129, 240, 1);
+ --common_tab_icon_bg_color: rgba(23, 120, 254, 1);
+ --common_tab_icon_disable_bg_color: rgba(23, 120, 254, 0.24);
+ --common_tab_icon_unselected_bg_color: rgba(255, 255, 255, 0.4);
+ --common_tab_icon_hover_bg_color: rgba(255, 255, 255, 0.6);
+ --common_darkline_bg_color: rgba(0, 0, 0, 1);
+ --common_darkcover_bg_color: rgba(0, 0, 0, 0.4);
+ --common_shadow_bg_color: rgba(0, 0, 0, 0.64);
+ --common_backdropblur_base: rgba(36, 40, 44, 0.88);
+ --im_chat_text_message_other_press_bg_color: #262626;
+ --im_chat_shortcut_unactive_bg_color: rgba(255, 255, 255, 0.24);
+ --im_chatlist_press_bg_color: rgba(126, 134, 142, 0.16);
+ --im_chatlist_hover_bg_color: rgba(126, 134, 142, 0.12);
+ --common_topbar_bg_color: rgba(8, 9, 12, 1);
+ --common_topbar_white1_color: rgba(255, 255, 255, 1);
+ --common_topbar_white2_color: rgba(255, 255, 255, 0.8);
+ --common_topbar_white3_color: rgba(255, 255, 255, 0.6);
+ --common_topbar_white4_color: rgba(255, 255, 255, 0.4);
+ --common_topbar_white5_color: rgba(255, 255, 255, 0.24);
+ --common_topbar_white6_color: rgba(255, 255, 255, 0.16);
+ --im_chat_report_bg_color: #2f3035;
+ --common_text_selected_bg_color: #b3d7ff;
+ --common_topbar_search_bg_color: rgba(255, 255, 255, 0.16);
+ --common_topbar_search_hover_bg_color: rgba(255, 255, 255, 0.24);
+ --common_select_bg_color: rgba(126, 134, 142, 0.16);
+ --common_memo_desk_top_bk_color: rgba(21, 33, 45, 1);
+}
+
+:root[data-dingtalk-theme='white'] {
+ --im_chat_text_message_other_bg_color: #f2f4f8;
+ --im_chat_text_message_other_press_bg_color: #e7e9ee;
+ --im_chat_bg_color: #fff;
+ --im_chat_report_bg_color: #f2f4f8;
+}
diff --git a/src/styles/theme.less b/src/styles/theme.less
new file mode 100644
index 0000000..1d6201f
--- /dev/null
+++ b/src/styles/theme.less
@@ -0,0 +1,45 @@
+// 主色
+@main-color: #1A6FB8;
+
+// 主色拓展
+@main-color-1: #E8F8FF;
+@main-color-2: #B6DDF1;
+@main-color-3: #89C2E3;
+@main-color-4: #5FA6D4;
+@main-color-5: #3A8AC6;
+
+@input-placeholder-color: rgba(0, 0, 0, 0.5); // Input
+@divider-color: rgba(0, 0, 0, 10%); // Divider
+@primary-color: @main-color; // 全局主色
+@link-color: @main-color; // 链接色
+@success-color: #00B42A; // 成功色
+@warning-color: #FA8C16; // 警告色
+@warning-bg-color: #fdf6e0; // 警告色背景
+@error-color: #F53F3F; // 错误色
+@font-size-base: 14px; // 主字号
+@line-height-base: 1.5715;
+@heading-color: rgba(0, 0, 0, 0.85); // 标题色
+@text-color: rgba(0, 0, 0, 0.85); // 主文本色
+@text-color-secondary: rgba(0, 0, 0, 0.65); // 次文本色
+@text-color-three: rgba(0, 0, 0, 0.5); // 次次文本色
+@disabled-color: rgba(0, 0, 0, 0.25); // 失效色
+@border-radius-base: 2px; // 组件/浮层圆角
+@border-color-base: #d9d9d9; // 边框色
+@box-shadow-base: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05); // 浮层阴影
+
+@table-header-bg: #f2f3f5;
+@table-row-hover-bg: #e6f7ff;
+
+@loading-color: #1089ff; // 进行中
+
+@bg-color: #f0f2f5; // 项目背景色
+
+@tag-color: #fafafa; // 项目tag标签颜色
+
+@mediaConfirm: #05aeae; // 项目司法确认相关颜色
+
+@pageAboutMargin: 16px; // 页面基础边距
+
+@pageUpDownMargin: 16px; // 页面上下边距
+
+@pageMargin: 16px @pageAboutMargin; //页面上下左右边距
diff --git a/src/utils/caseCauseSelect.js b/src/utils/caseCauseSelect.js
new file mode 100644
index 0000000..d05311b
--- /dev/null
+++ b/src/utils/caseCauseSelect.js
@@ -0,0 +1,114 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-03-07 15:26:41
+ * @LastEditTime: 2022-11-14 15:54:55
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 纠纷类型
+ */
+// 纠纷类型
+const caseCause = [
+ {
+ value: '22_00039-0005',
+ label: '家庭婚姻纠纷',
+ },
+ {
+ value: '22_00039-0004',
+ label: '邻里纠纷',
+ },
+ {
+ value: '22_00039-0019',
+ label: '房屋宅基地纠纷',
+ },
+ {
+ value: '22_00039-0002',
+ label: '合同纠纷',
+ },
+ {
+ value: '22_00039-0020',
+ label: '生产经营纠纷',
+ },
+ {
+ value: '22_00039-0013',
+ label: '损害赔偿纠纷',
+ },
+ {
+ value: '22_00039-0015',
+ label: '山林土地纠纷',
+ },
+ {
+ value: '22_00039-0016',
+ label: '征地纠纷',
+ },
+ {
+ value: '22_00039-0021',
+ label: '环境污染纠纷',
+ },
+ {
+ value: '22_00039-0001',
+ label: '劳动争议纠纷',
+ },
+ {
+ value: '22_00039-0006',
+ label: '道路交通事故纠纷',
+ },
+ {
+ value: '22_00039-0007',
+ label: '医疗纠纷',
+ },
+ {
+ value: '22_00039-0022',
+ label: '物业管理纠纷',
+ },
+ {
+ value: '22_00039-0018',
+ label: '消费纠纷',
+ },
+ {
+ value: '22_00039-0023',
+ label: '旅游纠纷',
+ },
+ {
+ value: '22_00039-0008',
+ label: '知识产权纠纷',
+ },
+ {
+ value: '22_00039-0024',
+ label: '互联网纠纷',
+ },
+ {
+ value: '22_00039-0003',
+ label: '借贷纠纷',
+ },
+ {
+ value: '22_00039-0009',
+ label: '所有权纠纷',
+ },
+ {
+ value: '22_00039-0010',
+ label: '继承纠纷',
+ },
+ {
+ value: '22_00039-0011',
+ label: '人格权纠纷',
+ },
+ {
+ value: '22_00039-0012',
+ label: '股权转让纠纷',
+ },
+ {
+ value: '22_00039-0014',
+ label: '建设用地使用权纠纷',
+ },
+ {
+ value: '22_00039-0017',
+ label: '其他纠纷',
+ },
+];
+
+const obj = {
+ caseCause,
+};
+
+export default obj;
diff --git a/src/utils/caseTypeSelect.js b/src/utils/caseTypeSelect.js
new file mode 100644
index 0000000..3698043
--- /dev/null
+++ b/src/utils/caseTypeSelect.js
@@ -0,0 +1,598 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-03-07 15:26:41
+ * @LastEditTime: 2025-05-06 16:52:45
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 纠纷类型下拉框
+ */
+
+let caseTypeSelect = [
+ {
+ "label": "劳动社保",
+ "value": "24_01-2",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "拖欠、克扣工资",
+ "value": "24_02-9",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "社保费用补缴",
+ "value": "24_02-16",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "生育待遇",
+ "value": "24_02-12",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "异地就医办理",
+ "value": "24_02-13",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "养老待遇",
+ "value": "24_02-14",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "失业保险待遇",
+ "value": "24_02-15",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "参保流程",
+ "value": "24_02-17",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "其他（职业技能、社保补贴等）",
+ "value": "24_02-18",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "港澳青年来穗服务",
+ "value": "24_02-19",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "医保个人账户",
+ "value": "24_02-11",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ },
+ {
+ "label": "门诊及住院待遇",
+ "value": "24_02-10",
+ "icon": null,
+ "parentId": "24_01-2",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "城市管理",
+ "value": "24_01-3",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "施工问题",
+ "value": "24_02-20",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ },
+ {
+ "label": "违章建筑",
+ "value": "24_02-21",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ },
+ {
+ "label": "路桥坑洼、破损",
+ "value": "24_02-22",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ },
+ {
+ "label": "消防隐患举报",
+ "value": "24_02-23",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ },
+ {
+ "label": "噪声、气味、污水等环境问题",
+ "value": "24_02-25",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ },
+ {
+ "label": "乱摆卖、垃圾清理等街面问题",
+ "value": "24_02-24",
+ "icon": null,
+ "parentId": "24_01-3",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "家庭邻里",
+ "value": "24_01-8",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "邻里纠纷",
+ "value": "24_02-48",
+ "icon": null,
+ "parentId": "24_01-8",
+ "children": null
+ },
+ {
+ "label": "婚姻家庭纠纷",
+ "value": "24_02-47",
+ "icon": null,
+ "parentId": "24_01-8",
+ "children": null
+ },
+ {
+ "label": "男女情感问题",
+ "value": "24_02-49",
+ "icon": null,
+ "parentId": "24_01-8",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "交通运输",
+ "value": "24_01-4",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "出租车、公交车、站点等营运问题",
+ "value": "24_02-32",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "交通灯、电子警察等公安设施",
+ "value": "24_02-28",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "交通拥堵",
+ "value": "24_02-27",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "道路违章举报",
+ "value": "24_02-29",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "物流快递管理",
+ "value": "24_02-30",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "驾校纠纷",
+ "value": "24_02-31",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "车辆乱停放",
+ "value": "24_02-26",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "电动车违规问题",
+ "value": "24_02-33",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ },
+ {
+ "label": "其他（社会治安、限行、养犬等）",
+ "value": "24_02-34",
+ "icon": null,
+ "parentId": "24_01-4",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "教育医疗",
+ "value": "24_01-5",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "教育事务、培训机构投诉",
+ "value": "24_02-35",
+ "icon": null,
+ "parentId": "24_01-5",
+ "children": null
+ },
+ {
+ "label": "医疗服务",
+ "value": "24_02-36",
+ "icon": null,
+ "parentId": "24_01-5",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "房屋规划",
+ "value": "24_01-7",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "物业/业委会管理",
+ "value": "24_02-41",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ },
+ {
+ "label": "不动产登记",
+ "value": "24_02-42",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ },
+ {
+ "label": "开发商/中介纠纷",
+ "value": "24_02-43",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ },
+ {
+ "label": "电梯加装",
+ "value": "24_02-44",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ },
+ {
+ "label": "建设项目规划",
+ "value": "24_02-45",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ },
+ {
+ "label": "租赁纠纷",
+ "value": "24_02-46",
+ "icon": null,
+ "parentId": "24_01-7",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "公共服务",
+ "value": "24_01-6",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "个人危险行为",
+ "value": "24_02-40",
+ "icon": null,
+ "parentId": "24_01-6",
+ "children": null
+ },
+ {
+ "label": "停水/电/气",
+ "value": "24_02-37",
+ "icon": null,
+ "parentId": "24_01-6",
+ "children": null
+ },
+ {
+ "label": "自然灾害",
+ "value": "24_02-38",
+ "icon": null,
+ "parentId": "24_01-6",
+ "children": null
+ },
+ {
+ "label": "公共卫生安全",
+ "value": "24_02-39",
+ "icon": null,
+ "parentId": "24_01-6",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "市场监管",
+ "value": "24_01-1",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "金融纠纷",
+ "value": "24_02-6",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "网购及其他消费纠纷",
+ "value": "24_02-5",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "其他经济违法举报",
+ "value": "24_02-7",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "无证/无照/冒用信息等违法经营行为举报",
+ "value": "24_02-4",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "食品消费纠纷",
+ "value": "24_02-3",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "旅游消费纠纷",
+ "value": "24_02-2",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "通讯、宽带消费纠纷",
+ "value": "24_02-1",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ },
+ {
+ "label": "电费问题",
+ "value": "24_02-8",
+ "icon": null,
+ "parentId": "24_01-1",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "民事经济纠纷",
+ "value": "24_01-9",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "合同纠纷",
+ "value": "24_02-50",
+ "icon": null,
+ "parentId": "24_01-9",
+ "children": null
+ },
+ {
+ "label": "租赁纠纷",
+ "value": "24_02-51",
+ "icon": null,
+ "parentId": "24_01-9",
+ "children": null
+ },
+ {
+ "label": "劳务费",
+ "value": "24_02-52",
+ "icon": null,
+ "parentId": "24_01-9",
+ "children": null
+ },
+ {
+ "label": "其他民事经济纠纷",
+ "value": "24_02-53",
+ "icon": null,
+ "parentId": "24_01-9",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "人身损害",
+ "value": "24_01-10",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "生命权",
+ "value": "24_02-54",
+ "icon": null,
+ "parentId": "24_01-10",
+ "children": null
+ },
+ {
+ "label": "人格权",
+ "value": "24_02-55",
+ "icon": null,
+ "parentId": "24_01-10",
+ "children": null
+ }
+ ]
+ },
+ {
+ "label": "其他",
+ "value": "24_01-11",
+ "icon": null,
+ "parentId": "root",
+ "children": [
+ {
+ "label": "劳动争议纠纷",
+ "value": "24_02-56",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ },
+ {
+ "label": "借贷纠纷",
+ "value": "24_02-57",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "道路交通事故纠纷",
+ "value": "24_02-58",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "知识产权纠纷",
+ "value": "24_02-59",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ },{
+ "label": "所有权纠纷",
+ "value": "24_02-60",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "继承纠纷",
+ "value": "24_02-61",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "股权转让纠纷",
+ "value": "24_02-62",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "损害赔偿纠纷",
+ "value": "24_02-63",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "建设用地使用权纠纷",
+ "value": "24_02-64",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "山林土地纠纷",
+ "value": "24_02-65",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "征地纠纷",
+ "value": "24_02-66",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ },
+ {
+ "label": "消费纠纷",
+ "value": "24_02-67",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ },
+ {
+ "label": "房屋宅基地纠纷",
+ "value": "24_02-68",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "生产经营纠纷",
+ "value": "24_02-69",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "环境污染纠纷",
+ "value": "24_02-70",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }, {
+ "label": "互联网纠纷",
+ "value": "24_02-71",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ },
+ {
+ "label": "其他",
+ "value": "24_02-72",
+ "icon": null,
+ "parentId": "24_01-11",
+ "children": null
+ }
+ ]
+ }
+]
+
+const obj = {
+ caseTypeSelect
+};
+
+export default obj;
\ No newline at end of file
diff --git a/src/utils/rules.js b/src/utils/rules.js
new file mode 100644
index 0000000..030f883
--- /dev/null
+++ b/src/utils/rules.js
@@ -0,0 +1,86 @@
+/**
+ * 手机号码正则校验
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const phone = (value) => /(^[0-9]{8}$)|(^1[3-9][0-9]{9}$)/.test(value);
+
+/**
+ * email 地址校验
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const email = (value) => /^([a-zA-Z0-9\u4e00-\u9fa5]+[_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/.test(value);
+
+/**
+ * 数值范围校验
+ * @param min 最小值
+ * @param max 最大值
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const range = (min, max, value) => value >= min && value <= max;
+
+/**
+ * 是否为纯英文
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const en = (value) => /(^[A-Za-z]+$)/.test(value);
+
+/**
+ * 是否为纯中文
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const cn = (value) => /(^[\u4e00-\u9fa5]{0,}$)/.test(value);
+
+/**
+ * 是否为金钱数字
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const money = (value) => /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/.test(`${value}`);
+
+/**
+ * 是否字母数字组合
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const code = (value) => /(^[A-Za-z0-9]+$)/.test(value);
+
+/**
+ * 是否为纯数字
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const number = (value) => /^[0-9]+.?[0-9]*$/.test(`${value}`);
+
+/**
+ * 是否为 ip 地址
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const ip = (value) =>
+ /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/.test(
+ value
+ );
+
+/**
+ * 是否为合法 url
+ * @param value 需要校验值
+ * @returns {boolean}
+ */
+const url = (value) => /(http|ftp|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/.test(value);
+
+// 清除字符串中的空格，用于判断是否为空
+function verifyEmpty(value) {
+ return value?.toString().replace(/\s+/g, '');
+}
+
+// 特殊字符校验
+var punctuation = (value) => new RegExp("[`~!@#$^&*()=|{}':;'\\[\\].<>《》/?~！@#￥……&*（）——|{}【】‘；：”“'。，、？ ]").test(`${value}`);
+
+const obj = { phone, email, range, en, cn, money, number, ip, url, verifyEmpty, punctuation };
+
+export default obj;
diff --git a/src/utils/selectOption.js b/src/utils/selectOption.js
new file mode 100644
index 0000000..f724a19
--- /dev/null
+++ b/src/utils/selectOption.js
@@ -0,0 +1,1566 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-03-07 15:26:41
+ * @LastEditTime: 2024-11-13 18:10:52
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 公共下拉框数据
+ */
+
+// 事项来源
+const caseCanal = [
+ {
+ value: '22_00001-1',
+ label: '大厅来访',
+ },
+ {
+ value: '22_00001-2',
+ label: '线上来访',
+ },
+ {
+ value: '22_00001-3',
+ label: '自行排查',
+ },
+ {
+ value: '22_00001-4',
+ label: '协同推送',
+ },
+];
+// 来访形式
+const visitWay = [
+ {
+ value: '24_00002-1',
+ label: '来访',
+ },
+ {
+ value: '24_00002-2',
+ label: '线上',
+ },
+];
+// 当事人地位
+const personType = [
+ {
+ value: '15_020008-1',
+ label: '申请方当事人',
+ },
+ {
+ value: '15_020008-2',
+ label: '被申请方当事人',
+ },
+ {
+ value: '24_00006-1',
+ label: '申请方代理人',
+ },
+ {
+ value: '24_00006-2',
+ label: '被申请方代理人',
+ },
+];
+// 当事人类型
+const personClass = [
+ {
+ value: '09_01001-1',
+ label: '自然人',
+ },
+ {
+ value: '09_01001-2',
+ label: '法人',
+ },
+ {
+ value: '09_01001-3',
+ label: '非法人组织',
+ },
+];
+//上传材料大类
+const fileOwnerCat = [
+ {
+ value: '22_00014-1',
+ label: '申请材料',
+ },
+ {
+ value: '22_00014-2',
+ label: '证据材料',
+ },
+ {
+ value: '22_00014-7',
+ label: '办理材料',
+ },
+ {
+ value: '22_00014-5',
+ label: '结案材料',
+ },
+];
+//上传材料类型
+const fileOwnerType = [
+ {
+ value: '22_00018-101',
+ label: '申请材料',
+ },
+ {
+ value: '22_00018-102',
+ label: '证据材料',
+ },
+ {
+ value: '22_00018-202',
+ label: '身份证明材料',
+ },
+ {
+ value: '22_00018-207',
+ label: '代理人授权委托书',
+ },
+ {
+ value: '22_00018-203',
+ label: '企业(机构)登记材料',
+ },
+ {
+ value: '22_00018-204',
+ label: '法定(机构)代表人身份证明材料',
+ },
+ {
+ value: '22_00018-501',
+ label: '办理附件',
+ },
+ {
+ value: '22_00018-506',
+ label: '督办附件',
+ },
+ {
+ value: '22_00018-507',
+ label: '督办回复附件',
+ },
+ {
+ value: '22_00018-508',
+ label: '联合处置申请附件',
+ },
+ {
+ value: '22_00018-509',
+ label: '联合处置申请审核附件',
+ },
+ {
+ value: '22_00018-520',
+ label: '回退申请附件',
+ },
+ {
+ value: '22_00018-511',
+ label: '回退审核附件',
+ },
+ {
+ value: '22_00018-512',
+ label: '上报申请附件',
+ },
+ {
+ value: '22_00018-513',
+ label: '上报审核附件',
+ },
+ {
+ value: '22_00018-302',
+ label: '协议文书',
+ },
+ {
+ value: '22_00018-514',
+ label: '结案审核附件',
+ },
+ {
+ value: '22_00018-515',
+ label: '不予受理附件',
+ },
+];
+// 附件上传人类型
+const uploaderType = [
+ {
+ value: '1',
+ label: '工作人员',
+ },
+ {
+ value: '2',
+ label: '当事人',
+ },
+];
+// 性别
+const sex = [
+ {
+ value: '09_00003-1',
+ label: '男',
+ },
+ {
+ value: '09_00003-2',
+ label: '女',
+ },
+];
+// 证件类型
+const cardType = [
+ {
+ value: '09_00015-1',
+ label: '身份证',
+ },
+ {
+ value: '09_00015-11',
+ label: '户口簿',
+ },
+ {
+ value: '09_00015-12',
+ label: '中国护照',
+ },
+ {
+ value: '09_00015-13',
+ label: '外国护照',
+ },
+ {
+ value: '09_00015-14',
+ label: '港澳居民来往内陆通行证',
+ },
+ {
+ value: '09_00015-16',
+ label: '台湾居民来往大陆通行证',
+ },
+ // {
+ // value: '09_00015-255',
+ // label: '其他',
+ // },
+ // {
+ // value: '09_00015-17',
+ // label: '当事人未提供证件信息',
+ // },
+];
+// 民族
+const nation = [
+ {
+ value: '09_00005-1',
+ label: '汉族',
+ },
+ {
+ value: '09_00005-2',
+ label: '蒙古族',
+ },
+ {
+ value: '09_00005-3',
+ label: '回族',
+ },
+ {
+ value: '09_00005-4',
+ label: '藏族',
+ },
+ {
+ value: '09_00005-5',
+ label: '维吾尔族',
+ },
+ {
+ value: '09_00005-6',
+ label: '苗族',
+ },
+ {
+ value: '09_00005-7',
+ label: '彝族',
+ },
+ {
+ value: '09_00005-8',
+ label: '壮族',
+ },
+ {
+ value: '09_00005-9',
+ label: '布依族',
+ },
+ {
+ value: '09_00005-10',
+ label: '朝鲜族',
+ },
+ {
+ value: '09_00005-11',
+ label: '满族',
+ },
+ {
+ value: '09_00005-12',
+ label: '侗族',
+ },
+ {
+ value: '09_00005-13',
+ label: '瑶族',
+ },
+ {
+ value: '09_00005-14',
+ label: '白族',
+ },
+ {
+ value: '09_00005-15',
+ label: '土家族',
+ },
+ {
+ value: '09_00005-16',
+ label: '哈尼族',
+ },
+ {
+ value: '09_00005-17',
+ label: '哈萨克族',
+ },
+ {
+ value: '09_00005-18',
+ label: '傣族',
+ },
+ {
+ value: '09_00005-19',
+ label: '黎族',
+ },
+ {
+ value: '09_00005-20',
+ label: '傈僳族',
+ },
+ {
+ value: '09_00005-21',
+ label: '佤族',
+ },
+ {
+ value: '09_00005-22',
+ label: '畲族',
+ },
+ {
+ value: '09_00005-23',
+ label: '高山族',
+ },
+ {
+ value: '09_00005-24',
+ label: '拉祜族',
+ },
+ {
+ value: '09_00005-25',
+ label: '水族',
+ },
+ {
+ value: '09_00005-26',
+ label: '东乡族',
+ },
+ {
+ value: '09_00005-27',
+ label: '纳西族',
+ },
+ {
+ value: '09_00005-28',
+ label: '景颇族',
+ },
+ {
+ value: '09_00005-29',
+ label: '柯尔克孜族',
+ },
+ {
+ value: '09_00005-30',
+ label: '土族',
+ },
+ {
+ value: '09_00005-31',
+ label: '达斡尔族',
+ },
+ {
+ value: '09_00005-32',
+ label: '仫佬族',
+ },
+ {
+ value: '09_00005-33',
+ label: '羌族',
+ },
+ {
+ value: '09_00005-34',
+ label: '布郎族',
+ },
+ {
+ value: '09_00005-35',
+ label: '撒拉族',
+ },
+ {
+ value: '09_00005-36',
+ label: '毛南族',
+ },
+ {
+ value: '09_00005-37',
+ label: '仡佬族',
+ },
+ {
+ value: '09_00005-38',
+ label: '锡伯族',
+ },
+ {
+ value: '09_00005-39',
+ label: '阿昌族',
+ },
+ {
+ value: '09_00005-40',
+ label: '普米族',
+ },
+ {
+ value: '09_00005-41',
+ label: '塔吉克族',
+ },
+ {
+ value: '09_00005-42',
+ label: '怒族',
+ },
+ {
+ value: '09_00005-43',
+ label: '乌孜别克族',
+ },
+ {
+ value: '09_00005-44',
+ label: '俄罗斯族',
+ },
+ {
+ value: '09_00005-45',
+ label: '鄂温克族',
+ },
+ {
+ value: '09_00005-46',
+ label: '崩龙族',
+ },
+ {
+ value: '09_00005-47',
+ label: '保安族',
+ },
+ {
+ value: '09_00005-48',
+ label: '裕固族',
+ },
+ {
+ value: '09_00005-49',
+ label: '京族',
+ },
+ {
+ value: '09_00005-50',
+ label: '塔塔尔族',
+ },
+ {
+ value: '09_00005-51',
+ label: '独龙族',
+ },
+ {
+ value: '09_00005-52',
+ label: '鄂伦春族',
+ },
+ {
+ value: '09_00005-53',
+ label: '赫哲族',
+ },
+ {
+ value: '09_00005-54',
+ label: '门巴族',
+ },
+ {
+ value: '09_00005-55',
+ label: '珞巴族',
+ },
+ {
+ value: '09_00005-56',
+ label: '基诺族',
+ },
+ {
+ value: '09_00005-57',
+ label: '台湾人',
+ },
+ {
+ value: '09_00005-58',
+ label: '香港人',
+ },
+ {
+ value: '09_00005-59',
+ label: '澳门人',
+ },
+ {
+ value: '09_00005-60',
+ label: '华侨',
+ },
+ {
+ value: '09_00005-255',
+ label: '其他',
+ },
+];
+// 委托类型
+const agentType = [
+ {
+ value: '22_00004-1',
+ label: '一般授权代理',
+ },
+ {
+ value: '22_00004-2',
+ label: '特别委托代理',
+ },
+ {
+ value: '22_00004-3',
+ label: '共同委托代理',
+ },
+ {
+ value: '22_00004-4',
+ label: '转委托代理',
+ },
+];
+// 事项状态
+const caseStatus = [
+ {
+ value: '1',
+ label: '待分派',
+ },
+ {
+ value: '2',
+ label: '待签收',
+ },
+ {
+ value: '3',
+ label: '待受理',
+ },
+ {
+ value: '4',
+ label: '化解中',
+ },
+ {
+ value: '5',
+ label: '结案审核',
+ },
+ {
+ value: '6',
+ label: '待评价',
+ },
+ {
+ value: '7',
+ label: '已归档',
+ },
+ {
+ value: '8',
+ label: '不予受理',
+ },
+];
+// 事项进度
+const process = [
+ {
+ value: '1',
+ label: '来访登记',
+ },
+ {
+ value: '2',
+ label: '事件流转',
+ },
+ {
+ value: '3',
+ label: '办理反馈',
+ },
+ {
+ value: '4',
+ label: '结案审核',
+ },
+ {
+ value: '5',
+ label: '当事人评价',
+ },
+ {
+ value: '6',
+ label: '结案归档',
+ },
+];
+// 化解结果
+const mediResult = [
+ {
+ value: '22_00025-1',
+ label: '化解成功',
+ },
+ {
+ value: '22_00025-2',
+ label: '化解不成功',
+ },
+];
+// 会议类型
+const meetType = [
+ {
+ value: '22_00020-1',
+ label: '纠纷调解会议',
+ },
+ {
+ value: '22_00020-2',
+ label: '司法确认会议',
+ },
+];
+// 会议方式
+const meetWay = [
+ {
+ value: '22_00021-3',
+ label: '线上 + 线下',
+ },
+ {
+ value: '22_00021-2',
+ label: '线上',
+ },
+ {
+ value: '22_00021-1',
+ label: '线下',
+ },
+];
+// 调度类型
+const dispType = [
+ {
+ value: '22_00012-1',
+ label: '归口分流',
+ },
+ {
+ value: '22_00012-2',
+ label: '加入抢单池',
+ },
+];
+// 通用审核结果
+const auditResult = [
+ {
+ value: '24_00004-1',
+ label: '同意',
+ },
+ {
+ value: '24_00004-2',
+ label: '不同意',
+ },
+];
+// 委托关系
+const agentRelate = [
+ {
+ value: '24_00007-1',
+ label: '亲属',
+ },
+ {
+ value: '24_00007-2',
+ label: '监护人',
+ },
+ {
+ value: '24_00007-3',
+ label: '律师',
+ },
+ {
+ value: '24_00007-4',
+ label: '社会团体推荐的公民',
+ },
+ {
+ value: '24_00007-5',
+ label: '所在单位推荐的人',
+ },
+ {
+ value: '24_00007-6',
+ label: '法律工作者',
+ },
+ {
+ value: '24_00007-7',
+ label: '所在社区推荐的公民',
+ },
+];
+// 企业类型
+const enterpriseType = [
+ {
+ value: '24_00008-1',
+ label: '农、林、牧、渔业',
+ },
+ {
+ value: '24_00008-2',
+ label: '采矿业',
+ },
+ {
+ value: '24_00008-3',
+ label: '制造业',
+ },
+ {
+ value: '24_00008-4',
+ label: '电力、热力、燃气及水生产和供应业',
+ },
+ {
+ value: '24_00008-5',
+ label: '建筑业',
+ },
+ {
+ value: '24_00008-6',
+ label: '批发和零售业',
+ },
+ {
+ value: '24_00008-7',
+ label: '交通运输、仓储和邮政业',
+ },
+ {
+ value: '24_00008-8',
+ label: '住宿和餐饮业',
+ },
+ {
+ value: '24_00008-9',
+ label: '信息传输、软件和信息技术服务业',
+ },
+ {
+ value: '24_00008-10',
+ label: '金融业',
+ },
+ {
+ value: '24_00008-11',
+ label: '房地产业',
+ },
+ {
+ value: '24_00008-12',
+ label: '租赁和商务服务业',
+ },
+ {
+ value: '24_00008-13',
+ label: '科学研究和技术服务业',
+ },
+ {
+ value: '24_00008-14',
+ label: '水利、环境和公共设施管理业',
+ },
+ {
+ value: '24_00008-15',
+ label: '居民服务、修理和其他服务业',
+ },
+ {
+ value: '24_00008-16',
+ label: '教育',
+ },
+ {
+ value: '24_00008-17',
+ label: '卫生和社会工作',
+ },
+ {
+ value: '24_00008-18',
+ label: '文化、体育和娱乐业',
+ },
+ {
+ value: '24_00008-19',
+ label: '公共管理、社会保障和社会组织',
+ },
+ {
+ value: '24_00008-20',
+ label: '国际组织',
+ },
+];
+// 机构类型
+const orgaType = [
+ {
+ value: '24_00009-1',
+ label: '志愿者服务',
+ },
+];
+//事项等级
+const caseLevelList = [
+ {
+ value: '1',
+ label: '一级',
+ },
+ {
+ value: '2',
+ label: '二级',
+ },
+ {
+ value: '3',
+ label: '三级',
+ },
+];
+
+// VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV 暂时用不到，防止以后会用的，先保留 VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV
+
+// 调解类型
+const mediateType = [
+ {
+ value: '22_00002-1',
+ label: '人民调解',
+ },
+ {
+ value: '22_00002-2',
+ label: '司法调解',
+ },
+ {
+ value: '22_00002-3',
+ label: '诉讼调解',
+ },
+ {
+ value: '22_00002-4',
+ label: '行政调解',
+ },
+];
+// 代理人类型
+const agentClass = [
+ {
+ value: '09_01010-1',
+ label: '律师',
+ },
+ {
+ value: '09_01010-3',
+ label: '监护人',
+ },
+ {
+ value: '09_01010-4',
+ label: '亲友',
+ },
+ {
+ value: '09_01010-5',
+ label: '社会团体推荐的公民',
+ },
+ {
+ value: '09_01010-6',
+ label: '所在单位推荐的人',
+ },
+ {
+ value: '09_01010-8',
+ label: '法律工作者',
+ },
+ {
+ value: '09_01010-9',
+ label: '所在社区推荐的公民',
+ },
+];
+// 职业
+const job = [
+ {
+ value: '22_00003-1',
+ label: '专业人士(教师/医生/律师等)',
+ },
+ {
+ value: '22_00003-2',
+ label: '服务业人员(餐饮服务员/司机/售货员等)',
+ },
+ {
+ value: '22_00003-3',
+ label: '自由职业者(作家/艺术家/摄影师/导游等)',
+ },
+ {
+ value: '22_00003-4',
+ label: '工人(工厂工人/建筑工人/城市环卫工人等)',
+ },
+ {
+ value: '22_00003-5',
+ label: '公司职员',
+ },
+ {
+ value: '22_00003-6',
+ label: '商人/雇主',
+ },
+ {
+ value: '22_00003-7',
+ label: '小商贩/个体户',
+ },
+ {
+ value: '22_00003-8',
+ label: '事业单位/公务员/政府工作人员',
+ },
+ {
+ value: '22_00003-9',
+ label: '学生',
+ },
+ {
+ value: '22_00003-10',
+ label: '家庭主妇',
+ },
+ {
+ value: '22_00003-11',
+ label: '农民/牧民/渔夫',
+ },
+ {
+ value: '22_00003-12',
+ label: '无业/失业',
+ },
+ {
+ value: '22_00003-255',
+ label: '其他',
+ },
+];
+// 通知方式
+const noticeWay = [
+ {
+ value: '22_00023-1',
+ label: '微信通知',
+ },
+ {
+ value: '22_00023-2',
+ label: '短信通知',
+ },
+];
+// 归档状态
+const fileStatus = [
+ {
+ value: '0',
+ label: '未归档',
+ },
+ {
+ value: '1',
+ label: '已归档',
+ },
+];
+// 任务节点执行者类型
+const taskCandeType = [
+ {
+ value: '1',
+ label: '所有人',
+ },
+ {
+ value: '2',
+ label: '上一步骤选择',
+ },
+ {
+ value: '3',
+ label: '上一步骤执行者',
+ },
+ {
+ value: '4',
+ label: '自定义指定（单位部门角色人组合）',
+ },
+];
+// 实名认证状态
+const realStatus = [
+ {
+ value: '0',
+ label: '未认证',
+ },
+ {
+ value: '1',
+ label: '已认证',
+ },
+];
+// 会议视频录制状态：1：录制转码中，2：已上传
+const recordStatus = [
+ {
+ value: '1',
+ label: '录制转码中',
+ },
+ {
+ value: '2',
+ label: '已上传',
+ },
+];
+// 涉及人群
+const crowd = [
+ {
+ value: '22_00035-1',
+ label: '未成年人',
+ },
+ {
+ value: '22_00035-2',
+ label: '残疾人',
+ },
+ {
+ value: '22_00035-3',
+ label: '外来农民工',
+ },
+ {
+ value: '22_00035-4',
+ label: '待下岗',
+ },
+ {
+ value: '22_00035-5',
+ label: '妇女',
+ },
+ {
+ value: '22_00035-6',
+ label: '失业',
+ },
+ {
+ value: '22_00035-7',
+ label: '在职',
+ },
+ {
+ value: '22_00035-8',
+ label: '老年人',
+ },
+ {
+ value: '22_00035-9',
+ label: '其他',
+ },
+];
+
+// 涉及人数
+const peopleNum = [
+ {
+ value: '1-3',
+ label: '1-3人',
+ },
+ {
+ value: '4-5',
+ label: '4-5人',
+ },
+ {
+ value: '6-10',
+ label: '6-10人',
+ },
+ {
+ value: '11-19',
+ label: '11-19人',
+ },
+ {
+ value: '20',
+ label: '20人及以上',
+ },
+];
+
+// 涉及金额
+const amount = [
+ {
+ value: '0',
+ label: '不涉及',
+ },
+ {
+ value: '1-10000',
+ label: '不超过1万元',
+ },
+ {
+ value: '10000-100000',
+ label: '1-10万元',
+ },
+ {
+ value: '100000-200000',
+ label: '10-20万元',
+ },
+ {
+ value: '200000-500000',
+ label: '20-50万元',
+ },
+ {
+ value: '500000',
+ label: '50万元及以上',
+ },
+];
+
+// 评价等级
+const evaluateGrade = [
+ {
+ value: '5',
+ label: '5星',
+ },
+ {
+ value: '4',
+ label: '4星',
+ },
+ {
+ value: '3',
+ label: '3星',
+ },
+ {
+ value: '2',
+ label: '2星',
+ },
+ {
+ value: '1',
+ label: '1星',
+ },
+];
+
+// 纠纷来源
+const caseSource = [
+ {
+ value: '22_00036-2',
+ label: '依申请调解',
+ },
+ {
+ value: '22_00036-1',
+ label: '地方政府委托移送',
+ },
+ {
+ value: '22_00036-3',
+ label: '主动调解',
+ },
+ {
+ value: '22_00036-4',
+ label: '法援委托移送',
+ },
+ {
+ value: '22_00036-5',
+ label: '检察院委托移送',
+ },
+ {
+ value: '22_00036-6',
+ label: '公安机关委托移送',
+ },
+ {
+ value: '22_00036-7',
+ label: '信访记录委托移送',
+ },
+ {
+ value: '22_00036-8',
+ label: '劳动站移交',
+ },
+ {
+ value: '22_00036-9',
+ label: '派出所移交',
+ },
+ {
+ value: '22_00036-10',
+ label: '其他部门委托移送',
+ },
+];
+
+// VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV旧系统下拉框，临时保留VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV
+
+// 调解不予受理原因
+const mediateError = [
+ {
+ value: '22_00005-1',
+ label: '人民法院已经受理或正在受理的',
+ },
+ {
+ value: '22_00005-2',
+ label: '一方当事人不同意调解的',
+ },
+ {
+ value: '22_00005-3',
+ label: '已构成犯罪或构成违反治安管理处罚行为的',
+ },
+ {
+ value: '22_00005-4',
+ label: '已通过其他渠道受理或处理',
+ },
+ {
+ value: '22_00005-5',
+ label: '其他',
+ },
+];
+// 拒绝签收原因
+const refuseSign = [
+ {
+ value: '22_00009-1',
+ label: '人民法院已经受理或正在受理的',
+ },
+ {
+ value: '22_00009-2',
+ label: '一方当事人不同意调解的',
+ },
+ {
+ value: '22_00009-3',
+ label: '已构成犯罪或构成违反治安管理处罚行为的',
+ },
+ {
+ value: '22_00009-4',
+ label: '已通过其他渠道受理或处理',
+ },
+ {
+ value: '22_00009-5',
+ label: '材料不全或不合格',
+ },
+ {
+ value: '22_00009-6',
+ label: '不属于管辖受理范围',
+ },
+ {
+ value: '22_00009-9',
+ label: '其他（自行填写）',
+ },
+];
+// 签收意见
+const signResult = [
+ {
+ value: '22_00010-1',
+ label: '同意签收',
+ },
+ {
+ value: '22_00010-2',
+ label: '拒绝签收',
+ },
+];
+// 调度来源
+const dispSource = [
+ {
+ value: '22_00011-1',
+ label: '纠纷调度',
+ },
+ {
+ value: '22_00011-2',
+ label: '申请协助',
+ },
+ {
+ value: '22_00011-3',
+ label: '拒签退回',
+ },
+ {
+ value: '22_00011-4',
+ label: '超时未签收',
+ },
+ {
+ value: '22_00011-5',
+ label: '异常重新调度',
+ },
+];
+// 调度处理
+const dispHandle = [
+ {
+ value: '22_00013-1',
+ label: '正常调度',
+ },
+ {
+ value: '22_00013-2',
+ label: '重新调度',
+ },
+ {
+ value: '22_00013-3',
+ label: '退回申请人',
+ },
+ {
+ value: '22_00013-4',
+ label: '不予受理',
+ },
+];
+// 调解参与人类型
+const joinUserType = [
+ {
+ value: '22_00022-1',
+ label: '调解员',
+ },
+ {
+ value: '22_00022-2',
+ label: '法官',
+ },
+ {
+ value: '22_00022-3',
+ label: '专家',
+ },
+ {
+ value: '22_00022-9',
+ label: '其他',
+ },
+ {
+ value: '22_00022-10',
+ label: '代理人',
+ },
+ {
+ value: '22_00022-11',
+ label: '申请人',
+ },
+ {
+ value: '22_00022-12',
+ label: '被申请人',
+ },
+ {
+ value: '22_00022-15',
+ label: '第三人',
+ },
+];
+// 人脸认证状态
+const faceStatus = [
+ {
+ value: '1',
+ label: '已认证',
+ },
+ {
+ value: '99',
+ label: '未认证',
+ },
+];
+// 司法确认进度
+const judicProcess = [
+ {
+ value: '22_00029-1',
+ label: '待审查',
+ },
+ {
+ value: '22_00029-2',
+ label: '未开始',
+ },
+ {
+ value: '22_00029-3',
+ label: '进行中',
+ },
+ {
+ value: '22_00029-4',
+ label: '已结束',
+ },
+ {
+ value: '22_00029-5',
+ label: '退回补料',
+ },
+ {
+ value: '22_00029-6',
+ label: '不予受理',
+ },
+];
+// 司法确认状态
+const judicStatus = [
+ {
+ value: '22_00029-1',
+ label: '受理确认',
+ },
+ {
+ value: '22_00029-2',
+ label: '退回',
+ },
+ {
+ value: '22_00029-3',
+ label: '已补材',
+ },
+ {
+ value: '22_00029-4',
+ label: '已结束',
+ },
+ {
+ value: '22_00029-5',
+ label: '不予受理',
+ },
+ {
+ value: '22_00029-6',
+ label: '异常终止',
+ },
+];
+// 司法确认结果
+const judicResult = [
+ {
+ value: '22_00028-1',
+ label: '已达成',
+ },
+ {
+ value: '22_00028-2',
+ label: '未达成',
+ },
+];
+// 司法确认不予受理原因
+const judicError = [
+ {
+ value: '22_00031-1',
+ label: '不属于人民法院受理民事案件的范围',
+ },
+ {
+ value: '22_00031-2',
+ label: '调解协议生效之日起30日后申请',
+ },
+ {
+ value: '22_00031-3',
+ label: '纠纷类型不符合司法确认要求',
+ },
+ {
+ value: '22_00031-4',
+ label: '不在受理管辖范围',
+ },
+ {
+ value: '22_00031-5',
+ label: '其他不宜由人民法院受理的情形',
+ },
+];
+// 司法确认退回原因
+const judicReturn = [
+ {
+ value: '22_00032-1',
+ label: '其他',
+ },
+];
+// 系列案区别
+const selectdata = [
+ {
+ value: '1',
+ label: '非系列案',
+ },
+ {
+ value: '2',
+ label: '系列案',
+ },
+];
+// 履行情况
+const fulfilSitu = [
+ {
+ value: '22_00008-1',
+ label: '未履行',
+ },
+ {
+ value: '22_00008-2',
+ label: '当场履行',
+ },
+ {
+ value: '22_00008-3',
+ label: '分期履行',
+ },
+];
+//调解不成功原因
+const mediFalseCause = [
+ {
+ value: '22_00019-1',
+ label: '当事人未能就调解协议达成一致',
+ },
+ {
+ value: '22_00019-2',
+ label: '当事人拒绝调解',
+ },
+ {
+ value: '22_00019-3',
+ label: '提前终止调解',
+ },
+ {
+ value: '22_00019-4',
+ label: '当事人撤销调解请求',
+ },
+ {
+ value: '22_00019-9',
+ label: '其他（自行填写）',
+ },
+];
+
+const twoLocationSelect = {
+ '19': [
+ {
+ 'label': '广州市',
+ 'value': '1601',
+ 'children': [
+ {
+ 'label': '白云区',
+ 'value': '50258',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '天河区',
+ 'value': '3633',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '海珠区',
+ 'value': '3634',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '荔湾区',
+ 'value': '3635',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '越秀区',
+ 'value': '3637',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '番禺区',
+ 'value': '36953',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '花都区',
+ 'value': '50256',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '南沙区',
+ 'value': '50259',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '黄埔区',
+ 'value': '50283',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '增城区',
+ 'value': '50284',
+ 'parentId': '1601',
+ },
+ {
+ 'label': '从化区',
+ 'value': '50285',
+ 'parentId': '1601',
+ },
+ ],
+ },
+ ],
+};
+
+const resultList = [
+ {
+ value: '0',
+ label: '待审核',
+ },
+ {
+ value: '1',
+ label: '同意',
+ },
+ {
+ value: '2',
+ label: '未通过',
+ },
+]
+
+const rmtjList = [
+ {
+ value: '1',
+ label: '未转入',
+ },
+ {
+ value: '2',
+ label: '转入中',
+ },
+ {
+ value: '3',
+ label: '已转入',
+ },
+ {
+ value: '4',
+ label: '转入失败',
+ },
+]
+
+const inputWay = [
+ {
+ value: '1',
+ label: '正常登记',
+ },
+ {
+ value: '2',
+ label: '案件导入',
+ },
+]
+
+const agreeType = [
+ {
+ value: '24_00003-1',
+ label: '口头协议',
+ },
+ {
+ value: '24_00003-2',
+ label: '书面协议',
+ },
+]
+
+const obj = {
+ caseCanal,
+ visitWay,
+ personType,
+ personClass,
+ fileOwnerCat,
+ fileOwnerType,
+ uploaderType,
+ sex,
+ cardType,
+ nation,
+ agentType,
+ caseStatus,
+ process,
+ mediResult,
+ meetType,
+ meetWay,
+ dispType,
+ auditResult,
+ agentRelate,
+ enterpriseType,
+ orgaType,
+ caseLevelList,
+ agreeType,
+
+ // VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV 暂时用不到，防止以后会用的，先保留 VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV
+
+ mediateType,
+ agentClass,
+ job,
+ noticeWay,
+ fileStatus,
+ taskCandeType,
+ realStatus,
+ recordStatus,
+ crowd,
+ peopleNum,
+ amount,
+ evaluateGrade,
+ caseSource,
+
+ // VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV旧系统下拉框，临时保留VVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVV
+
+ mediateError,
+ refuseSign,
+ signResult,
+ dispSource,
+ dispHandle,
+ joinUserType,
+ faceStatus,
+ judicProcess,
+ judicStatus,
+ judicResult,
+ judicError,
+ judicReturn,
+ selectdata,
+ fulfilSitu,
+ mediFalseCause,
+ twoLocationSelect,
+ resultList,
+ rmtjList,
+ inputWay,
+};
+
+export default obj;
diff --git a/src/utils/selectOptionPage.js b/src/utils/selectOptionPage.js
new file mode 100644
index 0000000..e8a69c5
--- /dev/null
+++ b/src/utils/selectOptionPage.js
@@ -0,0 +1,426 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-03-07 15:26:41
+ * @LastEditTime: 2024-01-26 12:35:19
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 公共下拉框数据
+ */
+
+// 民族
+const national = [
+ {
+ title: 'A',
+ items: [{ value: '39', label: '阿昌族' }],
+ },
+ {
+ title: 'B',
+ items: [
+ {
+ value: '09',
+ label: '布依族',
+ },
+ {
+ value: '14',
+ label: '白族',
+ title: 'B',
+ },
+ {
+ value: '34',
+ label: '布朗族',
+ title: 'B',
+ },
+ {
+ value: '46',
+ label: '崩龙族',
+ title: 'B',
+ },
+ {
+ value: '47',
+ label: '保安族',
+ title: 'B',
+ },
+ ],
+ },
+ {
+ title: 'C',
+ items: [
+ {
+ value: '10',
+ label: '朝鲜族',
+ title: 'C',
+ },
+ ],
+ },
+ {
+ title: 'D',
+ items: [
+ {
+ value: '12',
+ label: '侗族',
+ title: 'D',
+ },
+ {
+ value: '18',
+ label: '傣族',
+ title: 'D',
+ },
+ {
+ value: '26',
+ label: '东乡族',
+ title: 'D',
+ },
+ {
+ value: '31',
+ label: '达斡尔族',
+ title: 'D',
+ },
+ {
+ value: '51',
+ label: '独龙族',
+ title: 'D',
+ },
+ ],
+ },
+ {
+ title: 'E',
+ items: [
+ {
+ value: '44',
+ label: '俄罗斯族',
+ title: 'E',
+ },
+ {
+ value: '45',
+ label: '鄂温克族',
+ title: 'E',
+ },
+ {
+ value: '52',
+ label: '鄂伦春族',
+ title: 'E',
+ },
+ ],
+ },
+ {
+ title: 'F',
+ items: [],
+ },
+ {
+ title: 'G',
+ items: [
+ {
+ value: '23',
+ label: '高山族',
+ title: 'G',
+ },
+ ],
+ },
+ {
+ title: 'H',
+ items: [
+ {
+ value: '01',
+ label: '汉族',
+ title: 'H',
+ },
+ {
+ value: '03',
+ label: '回族',
+ title: 'H',
+ },
+ {
+ value: '16',
+ label: '哈尼族',
+ title: 'H',
+ },
+ {
+ value: '17',
+ label: '哈萨克族',
+ title: 'H',
+ },
+ {
+ value: '53',
+ label: '赫哲族',
+ title: 'H',
+ },
+ ],
+ },
+ {
+ title: 'I',
+ items: [],
+ },
+ {
+ title: 'J',
+ items: [
+ {
+ value: '28',
+ label: '景颇族',
+ title: 'J',
+ },
+ {
+ value: '49',
+ label: '京族',
+ title: 'J',
+ },
+ {
+ value: '56',
+ label: '基诺族',
+ title: 'J',
+ },
+ ],
+ },
+ {
+ title: 'K',
+ items: [
+ {
+ value: '29',
+ label: '柯尔克孜族',
+ title: 'K',
+ },
+ ],
+ },
+ {
+ title: 'L',
+ items: [
+ {
+ value: '19',
+ label: '黎族',
+ title: 'L',
+ },
+ {
+ value: '20',
+ label: '傈僳族',
+ title: 'L',
+ },
+ {
+ value: '24',
+ label: '拉祜族',
+ title: 'L',
+ },
+ {
+ value: '55',
+ label: '珞巴族',
+ title: 'L',
+ },
+ ],
+ },
+ {
+ title: 'M',
+ items: [
+ {
+ value: '06',
+ label: '苗族',
+ title: 'M',
+ },
+ {
+ value: '02',
+ label: '蒙古族',
+ title: 'M',
+ },
+ {
+ value: '11',
+ label: '满族',
+ title: 'M',
+ },
+ {
+ value: '32',
+ label: '仫佬族',
+ title: 'M',
+ },
+ {
+ value: '36',
+ label: '毛难族',
+ title: 'M',
+ },
+ {
+ value: '37',
+ label: '仡佬族',
+ title: 'M',
+ },
+ {
+ value: '54',
+ label: '门巴族',
+ title: 'M',
+ },
+ ],
+ },
+ {
+ title: 'N',
+ items: [
+ {
+ value: '27',
+ label: '纳西族',
+ title: 'N',
+ },
+ {
+ value: '42',
+ label: '怒族',
+ title: 'N',
+ },
+ ],
+ },
+ {
+ title: 'O',
+ items: [],
+ },
+ {
+ title: 'P',
+ items: [
+ {
+ value: '40',
+ label: '普米族',
+ title: 'P',
+ },
+ ],
+ },
+ {
+ title: 'Q',
+ items: [
+ {
+ value: '33',
+ label: '羌族',
+ title: 'Q',
+ },
+ {
+ value: '97',
+ label: '其他',
+ title: 'Q',
+ },
+ ],
+ },
+ {
+ title: 'R',
+ items: [],
+ },
+ {
+ title: 'S',
+ items: [
+ {
+ value: '22',
+ label: '畲族',
+ title: 'S',
+ },
+ {
+ value: '25',
+ label: '水族',
+ title: 'S',
+ },
+ {
+ value: '35',
+ label: '撒拉族',
+ title: 'S',
+ },
+ ],
+ },
+ {
+ title: 'T',
+ items: [
+ {
+ value: '15',
+ label: '土家族',
+ title: 'T',
+ },
+ {
+ value: '30',
+ label: '土族',
+ title: 'T',
+ },
+ {
+ value: '41',
+ label: '塔吉克族',
+ title: 'T',
+ },
+ {
+ value: '50',
+ label: '塔塔尔族',
+ title: 'T',
+ },
+ ],
+ },
+ {
+ title: 'U',
+ items: [],
+ },
+ {
+ title: 'V',
+ items: [],
+ },
+ {
+ title: 'W',
+ items: [
+ {
+ value: '05',
+ label: '维吾尔族',
+ title: 'W',
+ },
+ {
+ value: '21',
+ label: '佤族',
+ title: 'W',
+ },
+ {
+ value: '43',
+ label: '乌孜别克族',
+ title: 'W',
+ },
+ {
+ value: '98',
+ label: '外国血统中国籍人士',
+ title: 'W',
+ },
+ ],
+ },
+ {
+ title: 'X',
+ items: [
+ {
+ value: '38',
+ label: '锡伯族',
+ title: 'X',
+ },
+ ],
+ },
+ {
+ title: 'Y',
+ items: [
+ {
+ value: '07',
+ label: '彝族',
+ title: 'Y',
+ },
+ {
+ value: '13',
+ label: '瑶族',
+ title: 'Y',
+ },
+ {
+ value: '48',
+ label: '裕固族',
+ title: 'Y',
+ },
+ ],
+ },
+ {
+ title: 'Z',
+ items: [
+ {
+ value: '08',
+ label: '壮族',
+ title: 'Z',
+ },
+ {
+ value: '04',
+ label: '藏族',
+ title: 'Z',
+ },
+ ],
+ },
+];
+
+const obj = {
+ national,
+};
+
+export default obj;
diff --git a/src/utils/socialCard.js b/src/utils/socialCard.js
new file mode 100644
index 0000000..5d23358
--- /dev/null
+++ b/src/utils/socialCard.js
@@ -0,0 +1,234 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2023-06-12 16:04:09
+ * @LastEditTime: 2023-06-14 20:41:37
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+// 行业
+const industry = [
+ {
+ value: '01',
+ label: '机关事业单位及部队',
+ },
+ {
+ value: '02',
+ label: '教育',
+ },
+ {
+ value: '03',
+ label: '医疗卫生业',
+ },
+ {
+ value: '04',
+ label: '金融业',
+ },
+ {
+ value: '05',
+ label: '律师、会计师事务所等咨询',
+ },
+ {
+ value: '06',
+ label: '房地产业',
+ },
+ {
+ value: '07',
+ label: '通讯IT技术业',
+ },
+ {
+ value: '08',
+ label: '交通运输仓储邮政',
+ },
+ {
+ value: '09',
+ label: '水电气供应',
+ },
+ {
+ value: '10',
+ label: '采矿业',
+ },
+ {
+ value: '11',
+ label: '制造业',
+ },
+ {
+ value: '12',
+ label: '建筑业',
+ },
+ {
+ value: '13',
+ label: '农林牧渔业',
+ },
+ {
+ value: '14',
+ label: '批发零售业',
+ },
+ {
+ value: '15',
+ label: '进出口贸易',
+ },
+ {
+ value: '16',
+ label: '住宿餐饮业',
+ },
+ {
+ value: '17',
+ label: '旅游业',
+ },
+ {
+ value: '18',
+ label: '文化娱乐体育',
+ },
+ {
+ value: '19',
+ label: '其它',
+ },
+];
+
+// 职业
+const job = [
+ {
+ value: '1',
+ label: '工人',
+ },
+ {
+ value: '10',
+ label: '军人武警',
+ },
+ {
+ value: '11',
+ label: '企业人员',
+ },
+ {
+ value: '12',
+ label: '金融从业者',
+ },
+ {
+ value: '13',
+ label: '私营业主',
+ },
+ {
+ value: '14',
+ label: '自由职业',
+ },
+ {
+ value: '15',
+ label: '农林牧副渔',
+ },
+ {
+ value: '16',
+ label: '退休',
+ },
+ {
+ value: '2',
+ label: '农民',
+ },
+ {
+ value: '3',
+ label: '学生',
+ },
+ {
+ value: '4',
+ label: '干部',
+ },
+
+ {
+ value: '5',
+ label: '公务员',
+ },
+ {
+ value: '6',
+ label: '现役军人',
+ },
+ {
+ value: '7',
+ label: '无业人员',
+ },
+ {
+ value: '8',
+ label: '事业单位',
+ },
+ {
+ value: '9',
+ label: '其他',
+ },
+ {
+ value: '98',
+ label: '农民工',
+ },
+];
+
+const delReason = [
+ {
+ value: '01',
+ label: '不符合制卡条件',
+ },
+ {
+ value: '02',
+ label: '居民已通过其他渠道办理',
+ },
+ {
+ value: '03',
+ label: '居民没有办理社保卡意向',
+ },
+ {
+ value: '04',
+ label: '居民已拥有社保卡',
+ },
+ {
+ value: '99',
+ label: '其他（自行填写）',
+ },
+];
+
+// 代理关系
+const agentRelation = [
+ {
+ value: '06',
+ label: '孙子女',
+ },
+ {
+ value: '07',
+ label: '外孙子女',
+ },
+ {
+ value: '08',
+ label: '兄弟姐妹',
+ },
+
+ {
+ value: '05',
+ label: '外祖父母',
+ },
+ {
+ value: '04',
+ label: '祖父母',
+ },
+ {
+ value: '03',
+ label: '子女',
+ },
+ {
+ value: '02',
+ label: '配偶',
+ },
+ {
+ value: '01',
+ label: '父母',
+ },
+ {
+ value: '09',
+ label: '其他',
+ },
+];
+
+const obj = {
+ industry,
+ job,
+ agentRelation,
+ delReason,
+};
+
+export default obj;
diff --git a/src/utils/threeLocationSelect.js b/src/utils/threeLocationSelect.js
new file mode 100644
index 0000000..46ce193
--- /dev/null
+++ b/src/utils/threeLocationSelect.js
@@ -0,0 +1,1123 @@
+const threelocationSelect = [
+ {
+ 'label': '越秀区',
+ 'value': '440104',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '洪桥街道',
+ 'value': '440104-001',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '北京街道',
+ 'value': '440104-003',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '六榕街道',
+ 'value': '440104-004',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '流花街道',
+ 'value': '440104-005',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '光塔街道',
+ 'value': '440104-007',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '人民街道',
+ 'value': '440104-010',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '东山街道',
+ 'value': '440104-011',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '农林街道',
+ 'value': '440104-012',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '梅花村街道',
+ 'value': '440104-013',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '黄花岗街道',
+ 'value': '440104-014',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '华乐街道',
+ 'value': '440104-015',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '建设街道',
+ 'value': '440104-016',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '大塘街道',
+ 'value': '440104-017',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '珠光街道',
+ 'value': '440104-018',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '大东街道',
+ 'value': '440104-019',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '白云街道',
+ 'value': '440104-020',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '登峰街道',
+ 'value': '440104-021',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ {
+ 'label': '矿泉街道',
+ 'value': '440104-022',
+ 'parentId': '440104',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '海珠区',
+ 'value': '440105',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '赤岗街道',
+ 'value': '440105-001',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '新港街道',
+ 'value': '440105-002',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '昌岗街道',
+ 'value': '440105-003',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '江南中街道',
+ 'value': '440105-004',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '滨江街道',
+ 'value': '440105-005',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '素社街道',
+ 'value': '440105-006',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '海幢街道',
+ 'value': '440105-007',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '南华西街道',
+ 'value': '440105-008',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '龙凤街道',
+ 'value': '440105-009',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '沙园街道',
+ 'value': '440105-010',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '南石头街道',
+ 'value': '440105-011',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '凤阳街道',
+ 'value': '440105-012',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '瑞宝街道',
+ 'value': '440105-013',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '江海街道',
+ 'value': '440105-014',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '琶洲街道',
+ 'value': '440105-015',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '南洲街道',
+ 'value': '440105-016',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '华洲街道',
+ 'value': '440105-017',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ {
+ 'label': '官洲街道',
+ 'value': '440105-018',
+ 'parentId': '440105',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '荔湾区',
+ 'value': '440103',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '沙面街道',
+ 'value': '440103-001',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '岭南街道',
+ 'value': '440103-002',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '华林街道',
+ 'value': '440103-003',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '多宝街道',
+ 'value': '440103-004',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '昌华街道',
+ 'value': '440103-005',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '逢源街道',
+ 'value': '440103-006',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '龙津街道',
+ 'value': '440103-007',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '金花街道',
+ 'value': '440103-008',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '南源街道',
+ 'value': '440103-010',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '西村街道',
+ 'value': '440103-011',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '站前街道',
+ 'value': '440103-012',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '桥中街道',
+ 'value': '440103-013',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '白鹤洞街道',
+ 'value': '440103-014',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '冲口街道',
+ 'value': '440103-015',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '石围塘街道',
+ 'value': '440103-017',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '茶滘街道',
+ 'value': '440103-018',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '东漖街道',
+ 'value': '440103-019',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '海龙街道',
+ 'value': '440103-020',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '东沙街道',
+ 'value': '440103-021',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ {
+ 'label': '中南街道',
+ 'value': '440103-022',
+ 'parentId': '440103',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '天河区',
+ 'value': '440106',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '五山街道',
+ 'value': '440106-001',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '员村街道',
+ 'value': '440106-002',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '车陂街道',
+ 'value': '440106-003',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '沙河街道',
+ 'value': '440106-004',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '石牌街道',
+ 'value': '440106-006',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '沙东街道',
+ 'value': '440106-007',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '天河南街道',
+ 'value': '440106-008',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '林和街道',
+ 'value': '440106-009',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '兴华街道',
+ 'value': '440106-010',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '棠下街道',
+ 'value': '440106-011',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '天园街道',
+ 'value': '440106-012',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '猎德街道',
+ 'value': '440106-013',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '冼村街道',
+ 'value': '440106-014',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '元岗街道',
+ 'value': '440106-015',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '黄村街道',
+ 'value': '440106-016',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '长兴街道',
+ 'value': '440106-017',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '龙洞街道',
+ 'value': '440106-018',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '凤凰街道',
+ 'value': '440106-019',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '前进街道',
+ 'value': '440106-020',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '珠吉街道',
+ 'value': '440106-021',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ {
+ 'label': '新塘街道',
+ 'value': '440106-022',
+ 'parentId': '440106',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '白云区',
+ 'value': '440111',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '三元里街道',
+ 'value': '440111-002',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '松洲街道',
+ 'value': '440111-003',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '景泰街道',
+ 'value': '440111-004',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '同德街道',
+ 'value': '440111-005',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '黄石街道',
+ 'value': '440111-006',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '棠景街道',
+ 'value': '440111-007',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '新市街道',
+ 'value': '440111-008',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '同和街道',
+ 'value': '440111-009',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '京溪街道',
+ 'value': '440111-010',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '永平街道',
+ 'value': '440111-011',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '嘉禾街道',
+ 'value': '440111-012',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '均禾街道',
+ 'value': '440111-013',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '石井街道',
+ 'value': '440111-014',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '金沙街道',
+ 'value': '440111-015',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '云城街道',
+ 'value': '440111-016',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '鹤龙街道',
+ 'value': '440111-017',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '白云湖街道',
+ 'value': '440111-018',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '石门街道',
+ 'value': '440111-019',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '龙归街道',
+ 'value': '440111-020',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '大源街道',
+ 'value': '440111-021',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '人和镇',
+ 'value': '440111-103',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '太和镇',
+ 'value': '440111-107',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '钟落潭镇',
+ 'value': '440111-108',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ {
+ 'label': '江高镇',
+ 'value': '440111-113',
+ 'parentId': '440111',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '黄埔区',
+ 'value': '440112',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '黄埔街道',
+ 'value': '440112-001',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '红山街道',
+ 'value': '440112-002',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '鱼珠街道',
+ 'value': '440112-003',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '大沙街道',
+ 'value': '440112-005',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '文冲街道',
+ 'value': '440112-006',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '穗东街道',
+ 'value': '440112-007',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '南岗街道',
+ 'value': '440112-008',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '长洲街道',
+ 'value': '440112-010',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '夏港街道',
+ 'value': '440112-011',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '萝岗街道',
+ 'value': '440112-012',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '云埔街道',
+ 'value': '440112-013',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '联和街道',
+ 'value': '440112-014',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '永和街道',
+ 'value': '440112-015',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '长岭街道',
+ 'value': '440112-016',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '九佛街道',
+ 'value': '440112-017',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '龙湖街道',
+ 'value': '440112-018',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ {
+ 'label': '新龙镇',
+ 'value': '440112-101',
+ 'parentId': '440112',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '花都区',
+ 'value': '440114',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '新华街道',
+ 'value': '440114-001',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '花城街道',
+ 'value': '440114-002',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '秀全街道',
+ 'value': '440114-003',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '新雅街道',
+ 'value': '440114-004',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '梯面镇',
+ 'value': '440114-103',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '花山镇',
+ 'value': '440114-104',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '花东镇',
+ 'value': '440114-105',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '炭步镇',
+ 'value': '440114-107',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '赤坭镇',
+ 'value': '440114-108',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ {
+ 'label': '狮岭镇',
+ 'value': '440114-109',
+ 'parentId': '440114',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '番禺区',
+ 'value': '440113',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '市桥街道',
+ 'value': '440113-007',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '沙头街道',
+ 'value': '440113-008',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '东环街道',
+ 'value': '440113-009',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '桥南街道',
+ 'value': '440113-010',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '小谷围街道',
+ 'value': '440113-011',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '大石街道',
+ 'value': '440113-012',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '洛浦街道',
+ 'value': '440113-013',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '石壁街道',
+ 'value': '440113-014',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '钟村街道',
+ 'value': '440113-015',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '大龙街道',
+ 'value': '440113-016',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '沙湾街道',
+ 'value': '440113-017',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '南村镇',
+ 'value': '440113-102',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '新造镇',
+ 'value': '440113-103',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '化龙镇',
+ 'value': '440113-104',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '石楼镇',
+ 'value': '440113-105',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ {
+ 'label': '石碁镇',
+ 'value': '440113-120',
+ 'parentId': '440113',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '南沙区',
+ 'value': '440115',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '南沙街道',
+ 'value': '440115-001',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '珠江街道',
+ 'value': '440115-002',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '龙穴街道',
+ 'value': '440115-003',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '万顷沙镇',
+ 'value': '440115-100',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '横沥镇',
+ 'value': '440115-101',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '黄阁镇',
+ 'value': '440115-102',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '东涌镇',
+ 'value': '440115-103',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '大岗镇',
+ 'value': '440115-104',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ {
+ 'label': '榄核镇',
+ 'value': '440115-105',
+ 'parentId': '440115',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '从化区',
+ 'value': '440117',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '街口街道',
+ 'value': '440117-001',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '江埔街道',
+ 'value': '440117-002',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '城郊街道',
+ 'value': '440117-003',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '温泉镇',
+ 'value': '440117-103',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '良口镇',
+ 'value': '440117-104',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '吕田镇',
+ 'value': '440117-107',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '太平镇',
+ 'value': '440117-111',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ {
+ 'label': '鳌头镇',
+ 'value': '440117-113',
+ 'parentId': '440117',
+ 'children': null,
+ },
+ ],
+ },
+ {
+ 'label': '增城区',
+ 'value': '440118',
+ 'parentId': '440100',
+ 'children': [
+ {
+ 'label': '荔城街道',
+ 'value': '440118-001',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '增江街道',
+ 'value': '440118-002',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '永宁街道',
+ 'value': '440118-004',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '荔湖街道',
+ 'value': '440118-005',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '宁西街道',
+ 'value': '440118-006',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '新塘镇',
+ 'value': '440118-101',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '石滩镇',
+ 'value': '440118-102',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '中新镇',
+ 'value': '440118-103',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '正果镇',
+ 'value': '440118-104',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '派潭镇',
+ 'value': '440118-105',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '小楼镇',
+ 'value': '440118-106',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ {
+ 'label': '仙村镇',
+ 'value': '440118-107',
+ 'parentId': '440118',
+ 'children': null,
+ },
+ ],
+ },
+];
+
+const obj = {
+ threelocationSelect,
+};
+
+export default obj;
diff --git a/src/utils/timer.js b/src/utils/timer.js
new file mode 100644
index 0000000..d663918
--- /dev/null
+++ b/src/utils/timer.js
@@ -0,0 +1,32 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-03-22 14:42:30
+ * @LastEditTime: 2022-04-26 17:21:02
+ * @LastEditors: ldh
+ * @Version: 1.0.0
+ * @Description: 计时器管理
+ */
+class timerHandle {
+ constructor() {
+ this.timer = {};
+ }
+
+ setInterval(key, func, interval) {
+ this.timer[key] = setInterval(func, interval);
+ }
+
+ clearInterval(key) {
+ clearInterval(this.timer[key]);
+ }
+
+ setTimeout(key, func, interval) {
+ this.timer[key] = setTimeout(func, interval);
+ }
+
+ clearTimeOut(key) {
+ clearTimeout(this.timer[key]);
+ }
+}
+
+export default new timerHandle();
diff --git a/src/utils/utility.js b/src/utils/utility.js
new file mode 100644
index 0000000..7d5f9cd
--- /dev/null
+++ b/src/utils/utility.js
@@ -0,0 +1,1158 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-08-08 16:42:08
+ * @LastEditTime: 2025-05-23 16:11:04
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 公用方法
+ */
+import React, { useEffect, useRef } from 'react';
+import { Toast, Modal } from 'dingtalk-design-mobile';
+import * as apiHandler from '../api/apiHandler';
+import selectOptionObj from './selectOption';
+import caseTypeSelectObj from './caseTypeSelect';
+import threelocationSelect from './threeLocationSelect';
+import { message, Empty } from 'antd';
+import rule from './rules';
+import dd from 'gdt-jsapi';
+import { debug, web, test } from '../api/appUrl';
+// eslint-disable-next-line no-undef
+export const moment = dayjs;
+
+export const isDebug = true; // 是否开发环境
+export const isTest = false; // 是否测试环境
+
+export const appUrl = isDebug ? debug : isTest ? test : web; // api
+export const title = isDebug ? '（矛盾纠纷应用测试版）' : isTest ? '（矛盾纠纷应用测试版）' : '（矛盾纠纷应用）'; // api
+
+// 下拉数据
+export const selectOption = selectOptionObj;
+export const caseTypeSelect = caseTypeSelectObj;
+
+// 纠纷类型
+export const caseTypeList = caseTypeSelect;
+
+// 纠纷发生地点
+export const threelocationSelectList = threelocationSelect;
+
+export { default as caseOptions } from './caseCauseSelect';
+
+// axios
+export const ax = apiHandler;
+
+// 版本号
+export const versionNumber = '1.0.0';
+
+// 地区
+// eslint-disable-next-line no-undef
+export const region = regionData;
+
+// 海口地区 没有海口市，每一行都携带暂无
+// eslint-disable-next-line no-undef
+export const hkRegionLValue = regionData2;
+export const hkRegion = getLocal('areaTree') || [];
+
+//海口地区，包含海口市
+// eslint-disable-next-line no-undef
+export const CityRegion = regionData1;
+
+// 睡眠
+export function sleep(timeout = 500) {
+ return new Promise((resolve) => setTimeout(resolve, timeout));
+}
+
+// 清除字符串中的空格，
+export function verifyEmpty(value) {
+ return value?.toString().replace(/\s+/g, '');
+}
+
+// api错误提示
+export function catchApiError({ content }) {
+ return Toast.fail({
+ content,
+ position: 'middle',
+ duration: 1.5,
+ mask: false,
+ });
+}
+
+// 轻提示
+export function showToast({ type = 'info', content, position = 'middle', showType, duration = 1.5, icon, mask = false }) {
+ return Toast[type]({ content, position, showType, duration, icon, mask });
+}
+
+// 地址栏截取
+export function getQueryString(name) {
+ let result = window.location.href.match(new RegExp('[?&]' + name + '=([^&]+)', 'i'));
+ if (!result || result.length < 1) {
+ return null;
+ }
+ return decodeURI(result[1]);
+}
+
+// 操作二次确认弹框
+export function confirmModal({ title = '提示', subtitle, cancelText = '我再想想', onCancel = null, okText = '确定', onOk, actions }) {
+ return Modal.alert(
+ <div className="confirmModal-title">{title}</div>,
+ <div className="confirmModal-subtitle" style={{ textAlign: 'left' }}>{subtitle || ''}</div>,
+ !!actions
+ ? actions
+ : [
+ { text: cancelText, onClick: onCancel, style: { fontSize: '16px' } },
+ {
+ text: okText,
+ onClick: onOk,
+ style: { color: 'var(--theme_primary1_color)', fontSize: '16px' },
+ },
+ ]
+ );
+}
+
+// 操作两个竖着按钮确认弹框
+export function confirmTwoButtonModal({
+ title = '标题',
+ subtitle,
+ cancelText = '我再想想',
+ onCancel = null,
+ okText = '确定',
+ assistText,
+ onAssist = null,
+ onOk,
+ actions,
+}) {
+ return Modal.alert(
+ <div className="confirmModal-title">{title}</div>,
+ <div className="confirmModal-subtitle">{subtitle || ''}</div>,
+ !!actions
+ ? actions
+ : [
+ {
+ text: cancelText,
+ onClick: onCancel,
+ style: { color: 'var(--theme_primary1_color)', fontSize: '16px' },
+ },
+ { text: okText, onClick: onOk, style: { fontSize: '16px' } },
+ {
+ text: assistText,
+ onClick: onAssist,
+ style: { fontSize: '17px', display: 'none' },
+ },
+ ]
+ );
+}
+
+// 操作三个按钮确认弹框
+export function confirmThreeButtonModal({
+ title = '标题',
+ subtitle,
+ cancelText = '我再想想',
+ onCancel = null,
+ okText = '确定',
+ assistText,
+ onAssist = null,
+ onOk,
+ actions,
+}) {
+ return Modal.alert(
+ <div className="confirmModal-title">{title}</div>,
+ <div className="confirmModal-subtitle">{subtitle || ''}</div>,
+ !!actions
+ ? actions
+ : [
+ {
+ text: cancelText,
+ onClick: onCancel,
+ style: { color: 'var(--theme_primary1_color)', fontSize: '16px' },
+ },
+ { text: okText, onClick: onOk, style: { fontSize: '16px' } },
+ { text: assistText, onClick: onAssist, style: { fontSize: '16px' } },
+ ]
+ );
+}
+
+// 过滤菜单方法
+export function filterArray(arr1, arr2) {
+ // 创建一个 Set 来存储 arr2 中的所有 name
+ const namesInArr2 = new Set(arr2.map((item) => item.menuName));
+ // 过滤 arr1，只保留那些 name 在 arr2 中存在的对象
+ return arr1.filter((item) => namesInArr2.has(item.name));
+}
+
+// 显示99+
+export function showMoreNum(value) {
+ return Number(value || 0) > 99 ? '99+' : value;
+}
+
+// 计算我的消息时间显示
+export function msgTime(value) {
+ if (!value) return;
+ let res = '';
+ if (moment(value).format('YYYYMMDD') === moment().format('YYYYMMDD')) {
+ res = '今日';
+ } else if (moment(value).format('YYYYMMDD') === moment().add(-1, 'd').format('YYYYMMDD')) {
+ res = '昨天';
+ } else {
+ res = moment(value).format('YYYY-MM-DD');
+ }
+ return `${res} ${moment(value).format('HH:mm')}`;
+}
+
+// 计算上午，中午，下午，晚上 的
+export function tipTime(value) {
+ if (!value) return;
+ let res = '';
+ if (moment(value).format('HH') >= 5 && moment(value).format('HH') < 12) {
+ res = '上午';
+ } else if (moment(value).format('HH') >= 12 && moment(value).format('HH') < 14) {
+ res = '中午';
+ } else if (moment(value).format('HH') >= 14 && moment(value).format('HH') < 18) {
+ res = '下午';
+ } else {
+ res = '晚上';
+ }
+ return `${res}`;
+}
+// 计算:周一至周末
+export function getweekTime(value) {
+ if (!value) return;
+ let res = '';
+ if (new Date(value).getDay() === 1) {
+ res = '周一';
+ } else if (new Date(value).getDay() === 2) {
+ res = '周二';
+ } else if (new Date(value).getDay() === 3) {
+ res = '周三';
+ } else if (new Date(value).getDay() === 4) {
+ res = '周四';
+ } else if (new Date(value).getDay() === 5) {
+ res = '周五';
+ } else if (new Date(value).getDay() === 6) {
+ res = '周六';
+ } else if (new Date(value).getDay() === 0) {
+ res = '周日';
+ } else {
+ return;
+ }
+ return `${res}`;
+}
+
+// 计算: 'week'近一周，'month'近一个月，'threeMonth'近三个月，'sixMonth'近半年，'year'近一年的开始时间和结束时间
+export function getCountTime(type) {
+ let e = '';
+ if (type === 'today') {
+ e = moment().add(0, 'd');
+ }
+ if (type === 'yesToday') {
+ e = moment().add(-1, 'd');
+ }
+ if (type === 'week') {
+ e = moment().add(-7, 'd');
+ }
+ if (type === 'month') {
+ e = moment().add(-30, 'd');
+ }
+ if (type === 'threeMonth') {
+ e = moment().add(-90, 'd');
+ }
+ if (type === 'sixMonth') {
+ e = moment().add(-180, 'd');
+ }
+ if (type === 'year') {
+ e = moment().add(-365, 'd');
+ }
+ return {
+ start: e.format('YYYY-MM-DD') + ' 00:00',
+ end: moment().format('YYYY-MM-DD 23:59'),
+ };
+}
+
+// 搜索后头部的高亮显示
+export function searchTitle(strTitle, searchValue) {
+ const index = strTitle?.indexOf(searchValue);
+ const beforeStr = strTitle?.substring(0, index);
+ const afterStr = strTitle?.slice(index + searchValue.length);
+ const label =
+ index > -1 ? (
+ <span>
+ {beforeStr}
+ <span className="public-search-color">{searchValue}</span>
+ {afterStr}
+ </span>
+ ) : (
+ <span>{strTitle}</span>
+ );
+ return label;
+}
+
+// 敏感信息使用*代替
+export function sensitiveTitle(value, strNum, endNum) {
+ return !!value ? value.replace(/^(.{3})(?:\d+)(.{4})$/, '$1***********$2') : '-';
+}
+
+// 超出文字使用省略号
+export function ellipsis(value, len) {
+ if (!value) return '';
+
+ if (value.length > len) {
+ return value.slice(0, len) + '...';
+ }
+
+ return value;
+}
+
+// 时间格式化
+export function dateFormat(value) {
+ return !!value ? moment(value).format('YYYY-MM-DD') : '-';
+}
+// liveStatus 居住状态，1-在住，0-迁出，空-其他
+export function liveStatus(value) {
+ return value === '1' ? '在住' : value === '0' ? '迁出' : '-';
+}
+
+export function timeFormat(value, isValue) {
+ return !!value ? moment(value).format('YYYY-MM-DD HH:mm') : isValue ? '' : '-';
+}
+
+export function minuteFormat(value, isValue) {
+ return !!value ? moment(value).format('YYYY-MM-DD HH:mm') : isValue ? '' : '-';
+}
+
+export function myTimeFormat(value, str, isValue) {
+ return !!value ? moment(value).format(str) : isValue ? '' : '-';
+}
+
+/**
+ * 验证号码格式 (支持手机号码、不含区号固定电话)
+ * @param tel 号码
+ * @returns {Boolean}
+ */
+export function checkTel(tel) {
+ var pattern = /(^[0-9]{8}$)|(^1[3-9][0-9]{9}$)/; //手机号码
+ var pattern2 = /(^[0-9]{3,4}[-][0-9]{7,8}$)/; //座机号码
+ if (pattern.test(tel) || pattern2.test(tel)) {
+ return true;
+ } else {
+ return false;
+ }
+}
+
+// 手机号码正则
+export const mobileRegExp = new RegExp('^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\\d{8}$', 'g');
+
+// 身份证正则18位和15位
+export const idcardRegExp = new RegExp(
+ '^(^[1-9]\\d{7}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])\\d{3}$)|(^[1-9]\\d{5}[1-9]\\d{3}((0\\d)|(1[0-2]))(([0|1|2]\\d)|3[0-1])((\\d{4})|\\d{3}[Xx])$)$',
+ 'g'
+);
+
+// 短表表单（格式）校验
+export function verification({ requireFields, formData, tabsType }) {
+ const msgList = [];
+ for (const a of requireFields) {
+ let { name, type, value, label, tabs } = a;
+ if (type == 'text' || type == 'number' || type == 'password' || type == 'phone' || type == 'idcard' || type == 'digit') {
+ if (!formData[a.name]) {
+ msgList.push({
+ value: (tabsType ? `P${tabs} ` : null) + label + '为必填项',
+ name,
+ tabs,
+ });
+ } else {
+ if (name == 'idcard') {
+ if (formData.permitType == '111' || formData.permitType == '112') {
+ if (checkIdCard(formData[a.name]) == false) {
+ msgList.push({
+ value: (tabsType ? `P${tabs} ` : null) + label + '格式不正确',
+ name,
+ tabs,
+ });
+ }
+ }
+ }
+ if (name == 'contact') {
+ if (checkTel(formData[a.name]) == false) {
+ msgList.push({
+ value: (tabsType ? `P${tabs} ` : null) + label + '格式不正确',
+ name,
+ tabs,
+ });
+ }
+ }
+ }
+ } else if (type == 'select') {
+ if (!formData[a.name]) {
+ msgList.push({
+ value: (tabsType && `P${tabs} `) + '请选择' + label,
+ name,
+ tabs,
+ });
+ }
+ } else {
+ if (!formData[a.name]) {
+ msgList.push({
+ value: (tabsType && `P${tabs} `) + '请选择' + label,
+ name,
+ tabs,
+ });
+ }
+ }
+ }
+ return msgList;
+}
+
+// 长表表单（格式）校验
+export function verificationLong({ requireFields, formData }) {
+ const msgList = [];
+ for (const a of requireFields) {
+ let { name, type, value, label, tabs } = a;
+ if (type == 'text' || type == 'number' || type == 'password' || type == 'phone' || type == 'idcard' || type == 'digit') {
+ if (!formData[a.name]) {
+ msgList.push({ value: label + '为必填项', name, tabs });
+ } else {
+ if (name === 'idcard') {
+ if (formData.permitType == '111' || formData.permitType == '112') {
+ if (checkIdCard(formData[a.name]) === false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ if (name === 'contact') {
+ if (checkTel(formData[a.name]) === false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ } else if (type == 'select') {
+ if (!formData[a.name]) {
+ msgList.push({ value: '请选择' + label, name, tabs });
+ }
+ } else {
+ if (!formData[a.name]) {
+ msgList.push({ value: '请选择' + label, name, tabs });
+ }
+ }
+ }
+ return msgList;
+}
+
+// 纯格式校验
+export function verificationSwf({ requireFields, formData, title }) {
+ const msgList = [];
+ let valueList = [];
+ for (const a of requireFields) {
+ let { name, type, value, label, tabs, require } = a;
+ if (!formData[name] || formData[name] == '') {
+ valueList.push({ value: false, type, name, label, require });
+ } else {
+ valueList.push({ value: true, type, name, label, require });
+ }
+ }
+ if (!valueList.filter((item) => item.type !== 'switch').find((item) => item.value == true)) {
+ msgList.push({ value: title });
+ }
+ for (const a of requireFields) {
+ let { name, type, value, label, tabs } = a;
+ if (!formData[name] || formData[name] == '') {
+ } else {
+ if (type === 'number') {
+ if (checkTel(formData[name]) == false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ if (name == 'landIdcard') {
+ if (formData.landCardtype === '111' || formData.landCardtype === '112') {
+ if (formData.landIdcard !== '' || !formData.landIdcard) {
+ if (checkIdCard(formData.landIdcard) == false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ }
+ if (name == 'manageIdcard') {
+ if (formData.manageCardtype === '111' || formData.manageCardtype === '112') {
+ if (formData.manageIdcard !== '' || !formData.manageIdcard) {
+ if (checkIdCard(formData.manageIdcard) == false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ }
+ if (name == 'pCorporationIdCard') {
+ if (formData.pCorporationIdType === '111' || formData.pCorporationIdType === '112') {
+ if (formData.pCorporationIdCard !== '' || !formData.pCorporationIdCard) {
+ if (checkIdCard(formData.pCorporationIdCard) == false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ }
+ if (name == 'pPrincipalIdCard') {
+ if (formData.pPrincipalIdType === '111' || formData.pPrincipalIdType === '112') {
+ if (formData.pPrincipalIdCard !== '' || !formData.pPrincipalIdCard) {
+ if (checkIdCard(formData.pPrincipalIdCard) == false) {
+ msgList.push({ value: label + '格式不正确', name, tabs });
+ }
+ }
+ }
+ }
+ }
+ }
+ return msgList;
+}
+
+//阿拉伯数字转中文数字
+export function noToChinese(num) {
+ if (!/^\d*(\.\d*)?$/.test(num)) {
+ alert('Number is wrong!');
+ return 'Number is wrong!';
+ }
+ var AA = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九');
+ var BB = new Array('', '十', '百', '千', '万', '亿', '点', '');
+ var a = ('' + num).replace(/(^0*)/g, '').split('.'),
+ k = 0,
+ re = '';
+ for (var i = a[0].length - 1; i >= 0; i--) {
+ switch (k) {
+ case 0:
+ re = BB[7] + re;
+ break;
+ case 4:
+ if (!new RegExp('0{4}\\d{' + (a[0].length - i - 1) + '}$').test(a[0])) re = BB[4] + re;
+ break;
+ case 8:
+ re = BB[5] + re;
+ BB[7] = BB[5];
+ k = 0;
+ break;
+ }
+ if (k % 4 == 2 && a[0].charAt(i + 2) != 0 && a[0].charAt(i + 1) == 0) re = AA[0] + re;
+ if (a[0].charAt(i) != 0) re = AA[a[0].charAt(i)] + BB[k % 4] + re;
+ k++;
+ }
+ if (a.length > 1) {
+ //加上小数部分(如果有小数部分)
+ re += BB[6];
+ for (var i = 0; i < a[1].length; i++) re += AA[a[1].charAt(i)];
+ }
+ return re;
+}
+
+// 中文一二三四五六七八九十转换为阿拉伯数字
+export function checkIsNum(str) {
+ let arr = str ? str.split('') : [];
+ let ChineseItem = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十', '百', '千', '万', '两']; //十,百
+ let numItem = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 100, 1000, 10000, 2];
+ let doubleNum = [];
+ let NumIndex = [];
+ for (let i = 0; i < arr.length; i++) {
+ let ChineseOne = arr[i].charAt();
+ for (let j = 0; j < ChineseItem.length; j++) {
+ if (ChineseOne == ChineseItem[j]) {
+ let a = {
+ index: j,
+ seat: i,
+ };
+ NumIndex.push(a);
+ }
+ }
+ }
+ let double = [];
+ let float = [];
+ let Num = 0;
+ for (var k = 0; k < NumIndex.length; k++) {
+ if (NumIndex[k].index == 0) {
+ } else {
+ if (k % 2 == 0) {
+ //单数
+ float.push(numItem[NumIndex[k].index]);
+ }
+ if (k % 2 == 1) {
+ double.push(numItem[NumIndex[k].index]);
+ }
+ }
+ }
+ if (double.length == 0) {
+ Num = float[0];
+ }
+ for (var j = 0; j < double.length; j++) {
+ if (double.length < float.length) {
+ if (float[j] == 0) {
+ } else {
+ Num = Num + double[j] * float[j];
+ if (j == double.length - 1 && j < float.length) {
+ if (float[j + 1] > 10) {
+ Num = Num * float[j + 1];
+ } else {
+ Num = Num + float[j + 1];
+ }
+ }
+ }
+ } else if (double.length == float.length) {
+ if (float[j] == 0) {
+ Num = Num + double[j] * float[j + 1];
+ } else {
+ Num = Num + double[j] * float[j];
+ }
+ }
+ }
+ const lastStr = arr.filter((item, index) => (NumIndex.find((da) => da.seat == index) ? '' : item));
+ if (NumIndex.length > 0) {
+ lastStr.splice(NumIndex[0].seat, 0, String(Num));
+ }
+ return lastStr.join('');
+}
+
+/**
+ * 修改数组
+ * @param originData 原数组
+ * @param data 需要新增的属性数组
+ * @returns {Array}
+ */
+export function modifyArray(form, data) {
+ return form.map((item) => ({
+ ...item,
+ list: item.list.map(({ name, ...a }) =>
+ data.find((b) => b.name === name)
+ ? {
+ ...a,
+ name,
+ disabled: data.find((b) => b.name == name).disabled,
+ extra: data.find((b) => b.name == name).extra,
+ clear: data.find((b) => b.name == name).clear,
+ delFun: data.find((b) => b.name == name).delFun,
+ disabledDom: data.find((b) => b.name == name).disabledDom,
+ onClick: data.find((b) => b.name == name).onClick,
+ display: data.find((b) => b.name == name).display,
+ }
+ : { ...a, name }
+ ),
+ }));
+}
+
+/**
+ * 获取户籍地详址
+ * @param v 户籍地编码址
+ * @returns String
+ */
+export function gainRegionDesc(v) {
+ let v1 = v.slice(0, 2) + '0000';
+ let v2 = v.slice(0, 4) + '00';
+ let v3 = v.slice(0);
+ let arr;
+ let str = '';
+ let index1 = region.findIndex(({ value }) => value == v1);
+ arr = [index1];
+ if (region[index1].children) {
+ let index2 = region[index1].children.findIndex(({ value }) => value == v2);
+ if (index2 !== -1) {
+ arr.push(index2);
+ let index3 = region[index1].children[index2].children.findIndex(({ value }) => value == v3);
+ str += region[index1].label + region[index1].children[index2].label;
+ if (index3 !== -1) {
+ arr.push(index3);
+ str += region[index1].children[index2].children[index3].label;
+ }
+ } else {
+ str += region[index1].label;
+ }
+ } else {
+ arr = [index1];
+ str = region[index1].label;
+ }
+ return str;
+}
+// 获取区域，街道详细(两级联动)
+export function villageRegionDesc(list, v) {
+ let v1 = v.slice(0, 6);
+ let v2 = v.slice(0);
+ let arr;
+ let str = [];
+ let index1 = list.findIndex(({ value }) => value == v1);
+ arr = [index1];
+ if (list[index1].children) {
+ let index2 = list[index1].children.findIndex(({ value }) => value == v2);
+ if (index2 !== -1) {
+ arr.push(index2);
+ str = [list[index1].label, list[index1].children[index2].label];
+ } else {
+ str = [list[index1].label];
+ }
+ } else {
+ arr = [index1];
+ str = [list[index1].label];
+ }
+ return str;
+}
+
+// 多维数组转换为一维数组
+export function flattenNestedArray(arr) {
+ const result = [];
+
+ function recursiveFlatten(arr) {
+ for (let i = 0; i < arr.length; i++) {
+ result.push(arr[i]);
+ if (arr[i].children && arr[i].children.length > 0) {
+ recursiveFlatten(arr[i].children);
+ }
+ }
+ }
+
+ recursiveFlatten(arr);
+
+ return result;
+}
+
+// 获取区域，街道详细(三级联动) v:['xxx所在区','xxx所在街道','xxx居委会']
+export function regionThreeDesc1(list, v) {
+ let select = flattenNestedArray(list);
+ console.log('select', select);
+ let v1 = v[0];
+ let v2 = v[1];
+ let v3 = v[2];
+ let label1 = select.find(({ value }) => value === v1)?.label;
+ let label2 = select.find(({ value }) => value === v2)?.label;
+ let label3 = select.find(({ value }) => value === v3)?.label;
+
+ return [label1, label2, label3];
+}
+
+// 后端给接口的,不同层级有相同value
+// 获取区域，街道详细(三级联动) v:['xxx所在区','xxx所在街道','xxx居委会']
+export function regionThreeDesc(list, v) {
+ let list1 = list.map((i) => [...i.children]).flat();
+ let list2 = list1.map((i) => [...i.children]).flat();
+ let v1 = v[0];
+ let v2 = v[1];
+ let v3 = v[2];
+ let label1 = list.find(({ value }) => value === v1)?.label;
+ let label2 = list1.find(({ value }) => value === v2)?.label;
+ let label3 = list2.find(({ value }) => value === v3)?.label;
+
+ return [label1, label2, label3];
+}
+
+export function selectThreeDesc(list, v) {
+ let select = flattenNestedArray(list);
+ let v1 = v[0];
+ let label1 = select.find(({ value }) => value === v1)?.label;
+
+ return label1;
+}
+
+/**
+ * 获取户籍地code 省，市，区
+ *
+ */
+export function gainRegionCode(v) {
+ let v1 = v.slice(0, 2) + '0000';
+ let v2 = v.slice(0, 4) + '00';
+ let v3 = v.slice(0);
+ let arr = [v1, v2, v3];
+ return arr;
+}
+
+/**
+ * 获取户籍地code 市，区 街道
+ *
+ */
+export function gainnewRegionCode(v) {
+ let v1 = v.slice(0, 4) + '00';
+ let v2 = v.slice(0, 6);
+ let v3 = v.slice(0, 9);
+ let v4 = v.slice(0, 12);
+ let arr = [v1, v2, v3, v4];
+ return arr;
+}
+
+export function regionThreeCode(v) {
+ let v2 = v.slice(0, 6);
+ let v3 = v.slice(0, 9);
+ let v4 = v.slice(0, 12);
+ let arr = [v2, v3, v4];
+ return arr;
+}
+
+// 获取当前季度的开始日期和结束日期
+export function getQuarter() {
+ // 获取季度
+ let nowMonth = moment().format('M'),
+ quarter = { s: 0, e: 0 };
+ if (nowMonth >= 1 && nowMonth <= 3) {
+ quarter = { s: 1, e: 3 };
+ } else if (nowMonth >= 4 && nowMonth <= 6) {
+ quarter = { s: 4, e: 6 };
+ } else if (nowMonth >= 7 && nowMonth <= 9) {
+ quarter = { s: 7, e: 9 };
+ } else if (nowMonth >= 10 && nowMonth <= 12) {
+ quarter = { s: 10, e: 12 };
+ }
+ return {
+ start: moment(`${moment().format('YYYY')}-${quarter.s}`).startOf('month'),
+ end: moment(`${moment().format('YYYY')}-${quarter.e}`).endOf('month'),
+ };
+}
+
+// 当月有更新, 当季有更新, 超过半年未更新, 当季未更新
+export function getUpdateStr(updateTime) {
+ if (!updateTime) return null;
+ let now = moment(),
+ target = moment(updateTime);
+ let quarter = getQuarter();
+ if (now.diff(target, 'day') < 90) {
+ return '近3个月有更新';
+ } else if (now.diff(target, 'day') > 90) {
+ return '超过3个月未更新';
+ }
+}
+
+// 计算往前的日期
+export function getBeforeDate(value) {
+ return moment().day(-Number(value)).format('YYYY-MM-DD');
+}
+
+// 缓存
+export function setLocal(name, value) {
+ localStorage.setItem(name, JSON.stringify(value || ''));
+}
+
+export function getLocal(name) {
+ try {
+ let data = localStorage.getItem(name);
+ return JSON.parse(data);
+ } catch (error) {
+ return null;
+ }
+}
+
+export function clearLocal(name) {
+ return name ? localStorage.removeItem(name) : localStorage.clear();
+}
+
+export function setSessionStorage(name, value) {
+ sessionStorage.setItem(name, JSON.stringify(value || ''));
+}
+
+export function getSessionStorage(name) {
+ let data = sessionStorage.getItem(name);
+ return !data ? null : JSON.parse(data);
+}
+
+export function clearSessionStorage(name) {
+ return name ? sessionStorage.removeItem(name) : sessionStorage.clear();
+}
+
+// 根据身份证获取性别
+export function getSexByIdcard(idcard) {
+ let flag;
+ if (idcard.length == 18) {
+ flag = parseInt(idcard.substring(16, 17));
+ } else if (idcard.length == 15) {
+ flag = parseInt(idcard.substring(13, 14));
+ } else {
+ return null;
+ }
+
+ return parseInt(flag) % 2 == 0 ? '女' : '男';
+}
+
+// 根据身份证获取出生年月
+export function getBirthdatByIdNo(iIdNo) {
+ var tmpStr = '';
+ var idDate = '';
+ var tmpInt = 0;
+ var strReturn = '';
+
+ iIdNo = iIdNo.replace(/^\s+|\s+$/g, '');
+
+ if (iIdNo.length == 15) {
+ tmpStr = iIdNo.substring(6, 12);
+ tmpStr = '19' + tmpStr;
+ tmpStr = tmpStr.substring(0, 4) + '-' + tmpStr.substring(4, 6) + '-' + tmpStr.substring(6);
+ return tmpStr;
+ } else {
+ tmpStr = iIdNo.substring(6, 14);
+ tmpStr = tmpStr.substring(0, 4) + '-' + tmpStr.substring(4, 6) + '-' + tmpStr.substring(6);
+ return tmpStr;
+ }
+}
+
+// 通过身份证获取年龄, 精确到月
+export function getAgeByIdcard(idcard) {
+ var year = 0;
+ var month = 0;
+ if (idcard.length == 15) {
+ year = parseInt(idcard.substring(6, 8)) + 1900;
+ month = parseInt(idcard.substring(8, 10));
+ } else if (idcard.length == 18) {
+ year = parseInt(idcard.substring(6, 10));
+ month = parseInt(idcard.substring(10, 12));
+ } else {
+ return '-';
+ }
+ var currYear = new Date().getFullYear();
+ var currMonth = new Date().getMonth() + 1;
+ var age = currYear - year;
+ age = month > currMonth ? age - 1 : age;
+
+ return age;
+}
+
+//身份号码位数及格式检验
+export function checkIdCard(idcard) {
+ var idNum = idcard || '';
+ var re;
+ var len = idNum.length;
+ //身份证位数检验
+ if (len != 15 && len != 18) {
+ return false;
+ } else if (len == 15) {
+ re = new RegExp(/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})$/);
+ return false;
+ } else {
+ re = new RegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})([0-9xX])$/);
+ }
+ var area = {
+ 11: '北京',
+ 12: '天津',
+ 13: '河北',
+ 14: '山西',
+ 15: '内蒙古',
+ 21: '辽宁',
+ 22: '吉林',
+ 23: '黑龙江',
+ 31: '上海',
+ 32: '江苏',
+ 33: '浙江',
+ 34: '安徽',
+ 35: '福建',
+ 36: '江西',
+ 37: '山东',
+ 41: '河南',
+ 42: '湖北',
+ 43: '湖南',
+ 44: '广东',
+ 45: '广西',
+ 46: '海南',
+ 50: '重庆',
+ 51: '四川',
+ 52: '贵州',
+ 53: '云南',
+ 54: '西藏',
+ 61: '陕西',
+ 62: '甘肃',
+ 63: '青海',
+ 64: '宁夏',
+ 65: '新疆',
+ 71: '台湾',
+ 81: '香港',
+ 82: '澳门',
+ 83: '台湾',
+ 91: '国外',
+ };
+ var idcard_array = new Array();
+ idcard_array = idNum.split('');
+ //地区检验
+ if (area[parseInt(idNum.substr(0, 2))] == null) {
+ return false;
+ }
+ //出生日期正确性检验
+ var a = idNum.match(re);
+ if (a != null) {
+ if (len == 15) {
+ var DD = new Date('19' + a[3] + '/' + a[4] + '/' + a[5]);
+ var flag = DD.getYear() == a[3] && DD.getMonth() + 1 == a[4] && DD.getDate() == a[5];
+ } else if (len == 18) {
+ var DD = new Date(a[3] + '/' + a[4] + '/' + a[5]);
+ var flag = DD.getFullYear() == a[3] && DD.getMonth() + 1 == a[4] && DD.getDate() == a[5];
+ }
+ if (!flag) {
+ return false;
+ }
+ //检验校验位
+ if (len == 18) {
+ var S =
+ (parseInt(idcard_array[0]) + parseInt(idcard_array[10])) * 7 +
+ (parseInt(idcard_array[1]) + parseInt(idcard_array[11])) * 9 +
+ (parseInt(idcard_array[2]) + parseInt(idcard_array[12])) * 10 +
+ (parseInt(idcard_array[3]) + parseInt(idcard_array[13])) * 5 +
+ (parseInt(idcard_array[4]) + parseInt(idcard_array[14])) * 8 +
+ (parseInt(idcard_array[5]) + parseInt(idcard_array[15])) * 4 +
+ (parseInt(idcard_array[6]) + parseInt(idcard_array[16])) * 2 +
+ parseInt(idcard_array[7]) * 1 +
+ parseInt(idcard_array[8]) * 6 +
+ parseInt(idcard_array[9]) * 3;
+ var Y = S % 11;
+ var M = 'F';
+ var JYM = '10X98765432';
+ var M = JYM.substr(Y, 1); //判断校验位
+ //检测ID的校验位
+ if (M == idcard_array[17]) {
+ return true;
+ } else {
+ return false;
+ }
+ }
+ } else {
+ return false;
+ }
+ return true;
+}
+
+/* <行政区划名><街巷路名><门牌号>[小区名][楼栋名][附属物/特殊类][铺面名称]
+<行政区划名><街巷路名><小区名>[楼栋名][附属物/特殊类][铺面名称]
+<行政区划名><街巷路名><门牌号><标志物名>[楼栋名][附属物/特殊类][铺面名称]
+<行政区划名><街巷路名><标志物名>[楼栋名][附属物/特殊类][铺面名称]
+<行政区划名><村名><门牌号>[楼栋名][附属物/特殊类][铺面名称]
+*/
+// 行政区划名.districtName 村名.vilname 街巷路名.strrdname 门牌号.dooplate 小区名.groupname or dmAUidHkName 标志物名.landmark (楼栋名building 附属物/特殊类.appendant 铺面名称.shopno 谁都可以拼接)
+export function guize(districtName, params) {
+ //网格员所属区
+ const { strrdname, vilname, dooplate, groupname, dmAUidHkName, building, landmark, appendant, shopno } = params;
+ const msg = '地名地址不符合规则，请检查后重新输入';
+
+ if (strrdname && vilname) {
+ return { status: false, msg: '街巷路名和村名只能填写其中一项' };
+ }
+
+ if (!strrdname && !vilname) {
+ return { status: false, msg };
+ }
+
+ if (strrdname && !vilname) {
+ if (dooplate) {
+ if (districtName === '龙华区') {
+ if (dmAUidHkName && landmark) {
+ return { status: false, msg };
+ }
+ } else {
+ if (groupname && landmark) {
+ return { status: false, msg };
+ }
+ }
+ } else {
+ if (districtName === '龙华区') {
+ if (!dmAUidHkName && !landmark) {
+ return { status: false, msg };
+ }
+ if (dmAUidHkName && landmark) {
+ return { status: false, msg };
+ }
+ } else {
+ if (!groupname && !landmark) {
+ return { status: false, msg };
+ }
+ if (groupname && landmark) {
+ return { status: false, msg };
+ }
+ }
+ }
+ }
+
+ if (!strrdname && vilname) {
+ if (dooplate) {
+ if (landmark) {
+ return { status: false, msg };
+ }
+ } else {
+ return { status: false, msg };
+ }
+ }
+ return {
+ status: true,
+ msg:
+ (districtName || '') +
+ (strrdname || '') +
+ (vilname || '') +
+ (dooplate || '') +
+ (dmAUidHkName || '') +
+ (groupname || '') +
+ (building || '') +
+ (landmark || '') +
+ (appendant || '') +
+ (shopno || ''),
+ };
+}
+
+// 记录旧值的公用hooks
+export function usePrevious(value) {
+ const ref = useRef();
+ useEffect(() => {
+ ref.current = value;
+ });
+ return ref.current;
+}
+
+// 获取唯一的key
+export const getBusinessId = () => {
+ let four = `${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}`;
+ let result = `${moment().format('YYYYMMDDHHmmss')}${four}`;
+ return result;
+};
+
+// 查看文件
+export function openFiles({ type, url, urls, name }) {
+ console.log('url', url);
+ console.log('urls', urls);
+ function getAllImg() {
+ let arr = [];
+ urls.forEach((x) => {
+ if (x.type === '22_00017-3') {
+ arr.push(`${appUrl.fileUrl}${x.showUrl}`);
+ }
+ });
+ return arr;
+ }
+ if (type === '22_00017-3') {
+ dd.previewImage({
+ current: url,
+ urls: urls && urls.length > 0 ? getAllImg() : [url],
+ }).catch(() => {
+ showToast({ content: '查看失败' });
+ });
+ } else if (['22_00017-4', '22_00017-5', '22_00017-6', '22_00017-9'].includes(type)) {
+ dd.downloadFile({ url: url, name: name })
+ .then((res) => {
+ dd.openDownloadFile({
+ url: res,
+ });
+ })
+ .catch(() => {
+ showToast({ content: '查看失败' });
+ });
+ } else {
+ showToast({ content: '抱歉！您所点击的附件暂不支持查看' });
+ }
+}
+
+// 重新登录弹窗
+let errorNum = false;
+export function loginModal() {
+ if (errorNum) return false;
+ errorNum = true;
+ return confirmModal({
+ subtitle: '抱歉! 登录状态已失效请重新登录',
+ actions: [
+ {
+ text: '我知道了',
+ onClick: () => {
+ errorNum = false;
+ clearLocal();
+ window.location.href = '#/hztGrid/login';
+ },
+ style: { color: 'var(--theme_primary1_color)', fontSize: '16px' },
+ },
+ ],
+ });
+}
+// 全局提示
+export function info({ type, content, duration, onClose }) {
+ return message[type](content, duration || 3, onClose);
+}
+
+export function infoSuccess({ content }) {
+ return info({ type: 'success', content });
+}
+export function infoError({ content }) {
+ return info({ type: 'error', content });
+}
diff --git a/src/views/caseQuery/index.jsx b/src/views/caseQuery/index.jsx
new file mode 100644
index 0000000..0bd076e
--- /dev/null
+++ b/src/views/caseQuery/index.jsx
@@ -0,0 +1,1137 @@
+/*
+ * @Author: Claude
+ * @Date: 2025-04-15 09:28:00
+ * @LastEditTime: 2025-05-20 15:17:53
+ * @LastEditors: lwh
+ * @Description: 综合查询页面
+ */
+import React, { useState, useEffect, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
+import { SearchBar, Button, Modal, Select, InputItem, Toast, Picker } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import NavBarPage from '../../components/NavBarPage';
+import MyList from '../../components/MyList';
+import CalendarRangeTwoDay from '../../components/CalendarRangeTwoDay';
+import * as $$ from '../../utils/utility';
+import { caseQuery_1, caseQuery_2, workStatistics_5 } from '../../assets/img';
+import { SearchOutlined,RightArrow2Outlined } from 'dd-icons';
+import './index.less';
+
+// 全局日期格式化函数
+function formatDate(date) {
+ if (!date) return '';
+ const d = new Date(date);
+ const year = d.getFullYear();
+ const month = String(d.getMonth() + 1).padStart(1, '0');
+ const day = String(d.getDate()).padStart(1, '0');
+ return `${year}-${month}-${day}`;
+}
+
+// 综合查询接口
+function exportQueryAllApi(data) {
+ return $$.ax.request({
+ url: 'caseInfo/pageQueryAll',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 问题属地接口
+function getRegionTreeApi() {
+ return $$.ax.request({
+ url: 'syRegion/treeByUserId',
+ type: 'get',
+ service: 'sys',
+ });
+}
+
+const CaseQuery = () => {
+ const history = useHistory();
+
+ // 搜索关键词
+ const [keyword, setKeyword] = useState('');
+
+ // 列表数据和分页状态
+ const [listData, setListData] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [refreshing, setRefreshing] = useState(false);
+ const [hasMore, setHasMore] = useState(true);
+ const [page, setPage] = useState(1);
+ const [totalCount, setTotalCount] = useState(0);
+ const [totalPages, setTotalPages] = useState(1);
+
+ // 日期选择弹窗状态
+ const [datePickerVisible, setDatePickerVisible] = useState(false);
+ const [currentDateType, setCurrentDateType] = useState('');
+
+ // 查询参数
+ const [queryParams, setQueryParams] = useState({
+ page: 1,
+ size: 10,
+ keyword: '',
+ sortColmn: '1',
+ sortType: '2',
+ });
+
+ // 高级筛选参数
+ const [advancedParams, setAdvancedParams] = useState({
+ queCity: '',
+ queArea: '',
+ queRoad: '',
+ queVillage: '',
+ inputUnitName: '',
+ createStart: '',
+ createEnd: '',
+ closeStart: '',
+ closeEnd: '',
+ caseType: '',
+ mediResult: '',
+ canal: '',
+ status: '',
+ caseLevel: '',
+ majorStatus: '',
+ mediateUnitId: '',
+ assistUnitId: '',
+ mediator: '',
+ caseRef: '',
+ plaintiffs: '',
+ defendants: '',
+ amount: '',
+ evaluateGrade: '',
+ fileStart: '',
+ fileEnd: '',
+ isRisk: '',
+ agreeType: '',
+ isDuplicate: '',
+ sortColmn: '1',
+ sortType: '2',
+ });
+
+ // 用于显示的部门和人员名称
+ const [displayNames, setDisplayNames] = useState({
+ mediateUnitName: '',
+ assistUnitName: '',
+ mediatorName: '',
+ });
+
+ // 地区树形数据
+ const [regionTree, setRegionTree] = useState([]);
+
+ // 查询状态
+ const [hasSearched, setHasSearched] = useState(false);
+
+ // 高级筛选弹窗状态
+ const [filterVisible, setFilterVisible] = useState(false);
+
+ // 选择器弹窗状态
+ const [selectorVisible, setSelectorVisible] = useState(false);
+ const [selectorTitle, setSelectorTitle] = useState('');
+ const [selectorOptions, setSelectorOptions] = useState([]);
+ const [selectorKey, setSelectorKey] = useState('');
+
+ // 新增：时间类型选项
+ const dateTypeOptions = [
+ { value: 'custom', label: '自定义' },
+ { value: 'lastMonth', label: '上月' },
+ { value: 'lastWeek', label: '上周' },
+ { value: 'thisMonth', label: '本月' },
+ { value: 'thisWeek', label: '本周' },
+ { value: 'thisYear', label: '本年度' },
+ { value: 'lastYear', label: '上年度' },
+ ];
+
+ const [dateTypeModalVisible, setDateTypeModalVisible] = useState(false);
+ const [dateTypeTarget, setDateTypeTarget] = useState(''); // 'create' or 'close'
+
+ // 新增：地区选择相关state
+ const [regionPickerVisible, setRegionPickerVisible] = useState(false);
+ const [regionPickerValue, setRegionPickerValue] = useState([]);
+
+ // 初始化加载地区数据
+ useEffect(() => {
+ fetchRegionTree();
+ }, []);
+
+ // 接收承办部门选择结果
+ useEffect(() => {
+ const data = $$.getLocal('mainDept');
+ if (data) {
+ setDisplayNames((prev) => ({ ...prev, mediateUnitName: data[0].label }));
+ setAdvancedParams((prev) => ({ ...prev, mediateUnitId: data[0].value }));
+ setFilterVisible(true);
+ $$.clearLocal('mainDept');
+ }
+ }, [$$.getLocal('mainDept')]);
+
+ // 接收配合部门选择结果
+ useEffect(() => {
+ const data = $$.getLocal('cooperateDepts');
+ if (data && data.length > 0) {
+ setDisplayNames((prev) => ({ ...prev, assistUnitName: data[0].label }));
+ setAdvancedParams((prev) => ({ ...prev, assistUnitId: data[0].value }));
+ setFilterVisible(true);
+ $$.clearLocal('cooperateDepts');
+ }
+ }, [$$.getLocal('cooperateDepts')]);
+
+ // 接收经办人选择结果
+ useEffect(() => {
+ const data = $$.getLocal('selectPerson');
+ if (data) {
+ console.log('data', data);
+ setDisplayNames((prev) => ({ ...prev, mediatorName: data[0]?.label }));
+ setAdvancedParams((prev) => ({ ...prev, mediator: data[0]?.value }));
+ setFilterVisible(true);
+ $$.clearLocal('selectPerson');
+ }
+ }, [$$.getLocal('selectPerson')]);
+
+ // 获取地区树形数据
+ const fetchRegionTree = async () => {
+ try {
+ const res = await getRegionTreeApi();
+ if (res.type) {
+ setRegionTree(res.data || []);
+ }
+ } catch (error) {
+ console.error('获取地区数据失败', error);
+ }
+ };
+
+ // 获取列表数据
+ const fetchListData = async (currentPage, params = {}) => {
+ setLoading(true);
+
+ try {
+ const requestParams = {
+ ...params,
+ page: currentPage,
+ size: 10,
+ sortColmn: '1',
+ sortType: '2',
+ };
+
+ // 打印请求参数检查
+ console.log('请求参数:', requestParams);
+
+ const res = await exportQueryAllApi(requestParams);
+
+ if (res.type) {
+ const { content, totalElements, totalPages, last } = res.data;
+
+ // 确保返回的数据不为空
+ const dataList = content || [];
+
+ if (currentPage === 1) {
+ // 第一页数据，直接设置
+ setListData(dataList);
+ } else {
+ // 加载更多数据
+ setListData((prev) => [...prev, ...dataList]);
+ }
+
+ setTotalCount(totalElements);
+ setTotalPages(totalPages);
+ setHasMore(!last);
+ setPage(currentPage);
+ setQueryParams({ ...requestParams });
+ setHasSearched(true);
+ }
+ } catch (error) {
+ console.error('获取列表数据失败', error);
+ Toast.show({
+ content: '获取数据失败，请稍后重试',
+ position: 'bottom',
+ });
+ } finally {
+ setLoading(false);
+ setRefreshing(false);
+ }
+ };
+
+ // 下拉刷新
+ const handleRefresh = () => {
+ setRefreshing(true);
+ fetchListData(1, queryParams);
+ };
+
+ // 加载更多
+ const loadMoreData = (callback) => {
+ if (loading || !hasMore) {
+ if (callback) callback();
+ return;
+ }
+
+ setLoading(true);
+ fetchListData(page + 1, queryParams)
+ .then(() => {
+ if (callback) callback();
+ })
+ .catch(() => {
+ if (callback) callback();
+ });
+ };
+
+ // 处理搜索
+ const handleSearch = () => {
+ const params = { ...queryParams, keyword, page: 1 };
+ fetchListData(1, params);
+ };
+
+ // 打开高级筛选
+ const handleOpenFilter = () => {
+ setFilterVisible(true);
+ };
+
+ // 关闭高级筛选
+ const handleCloseFilter = () => {
+ setFilterVisible(false);
+ };
+
+ // 重置高级筛选
+ const handleResetFilter = () => {
+ setAdvancedParams({
+ queCity: '',
+ queArea: '',
+ queRoad: '',
+ queVillage: '',
+ inputUnitName: '',
+ createStart: '',
+ createEnd: '',
+ closeStart: '',
+ closeEnd: '',
+ caseType: '',
+ mediResult: '',
+ canal: '',
+ status: '',
+ caseLevel: '',
+ majorStatus: '',
+ mediateUnitId: '',
+ assistUnitId: '',
+ mediator: '',
+ caseRef: '',
+ plaintiffs: '',
+ defendants: '',
+ amount: '',
+ evaluateGrade: '',
+ fileStart: '',
+ fileEnd: '',
+ isRisk: '',
+ agreeType: '',
+ isDuplicate: '',
+ sortColmn: '1',
+ sortType: '2',
+ });
+ setDisplayNames({
+ mediateUnitName: '',
+ assistUnitName: '',
+ mediatorName: '',
+ });
+ setRegionPickerValue([]);
+ };
+
+ // 应用高级筛选
+ const handleApplyFilter = () => {
+ // 确保日期参数正确传递
+ const params = {
+ ...advancedParams,
+ page: 1,
+ size: 10,
+ sortColmn: '1',
+ sortType: '2',
+ };
+
+ // 打印参数检查
+ console.log('查询参数:', params);
+
+ fetchListData(1, params);
+ handleCloseFilter();
+ };
+
+ // 处理问题属地选择
+ const handleRegionChange = (value, options) => {
+ const level = options[options.length - 1]?.level;
+ const selectedValue = value[value.length - 1];
+
+ if (level === '1') {
+ setAdvancedParams((prev) => ({ ...prev, queCity: selectedValue, queArea: '', queRoad: '', queVillage: '' }));
+ } else if (level === '2') {
+ setAdvancedParams((prev) => ({ ...prev, queArea: selectedValue, queRoad: '', queVillage: '' }));
+ } else if (level === '3') {
+ setAdvancedParams((prev) => ({ ...prev, queRoad: selectedValue, queVillage: '' }));
+ } else if (level === '4') {
+ setAdvancedParams((prev) => ({ ...prev, queVillage: selectedValue }));
+ }
+ };
+
+ // 转换地区数据为Picker格式
+ const formatRegionData = (data) => {
+ return data.map((item) => ({
+ value: item.value,
+ label: item.label,
+ level: item.level,
+ children: item.children && item.children.length > 0 ? formatRegionData(item.children) : undefined,
+ }));
+ };
+
+ // 选择承办部门
+ const handleSelectMediateUnit = () => {
+ setFilterVisible(false);
+ history.push(`/gzdyh/selectPerson?type=3&isMultiple=true`);
+ };
+
+ // 选择配合部门
+ const handleSelectAssistUnit = () => {
+ setFilterVisible(false);
+ history.push('/gzdyh/selectPerson?type=4&isMultiple=true');
+ };
+
+ // 选择经办人
+ const handleSelectMediator = () => {
+ setFilterVisible(false);
+ history.push('/gzdyh/selectPerson?type=1&isMultiple=trua');
+ };
+
+ // 渲染列表项
+ const renderListItem = (item) => {
+ // 格式化时间
+ const formatTime = (time) => {
+ if (!time) return '';
+ const date = new Date(time);
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ return `${year}-${month}-${day}`;
+ };
+
+ // 判断化解结果样式
+ const getResultStyle = (result) => {
+ if (result === '化解成功') {
+ return 'success';
+ } else if (result === '化解不成功') {
+ return 'fail';
+ }
+ return '';
+ };
+
+ const createDate = formatTime(item.createTime);
+ const resultStyle = getResultStyle(item.mediResultName);
+
+ return (
+ <div className="query-list-item" onClick={() => history.push(`/gzdyh/flow?caseTaskId=${item.caseTaskId}&caseId=${item.id}&editShow=false`)}>
+ <div className="query-list-header">
+ <div className="query-list-title">
+ <span>{item.plaintiffs}</span>
+ {item.defendants && (
+ <>
+ <span className="query-list-separator">、</span>
+ <span>{item.defendants}</span>
+ </>
+ )}
+ <span className="query-list-arrow"><RightArrow2Outlined /></span>
+ </div>
+ <div className="query-list-status">{item.statusName}</div>
+ </div>
+
+ <div className="query-list-content">
+ <div className="query-list-row">
+ <div className="query-list-label">登记时间</div>
+ <div className="query-list-value">{createDate}</div>
+ </div>
+
+ <div className="query-list-row">
+ <div className="query-list-label">纠纷类型</div>
+ <div className="query-list-value">{item.caseTypeName}</div>
+ </div>
+
+ <div className="query-list-row">
+ <div className="query-list-label">承办部门</div>
+ <div className="query-list-value">{item.mediateUnitName}</div>
+ </div>
+ <div className="query-list-row">
+ <div className="query-list-label">事项编号</div>
+ <div className="query-list-value">{item.caseRef}</div>
+ </div>
+ <div className="query-list-row">
+ <div className="query-list-label">化解结果</div>
+ <div className={`query-list-value query-result-${resultStyle}`}>{item.mediResultName}</div>
+ </div>
+ </div>
+ </div>
+ );
+ };
+
+ // 渲染初始状态
+ const renderInitialState = () => {
+ return (
+ <div className="query-initial-state">
+ <img src={caseQuery_1} alt="请输入关键词查询" className="query-initial-image" />
+ <div className="query-initial-text">请输入关键词查询</div>
+ </div>
+ );
+ };
+
+ // 渲染无数据状态
+ const renderEmptyState = () => {
+ return (
+ <div className="query-empty-state">
+ <img src={caseQuery_2} alt="暂无数据" className="query-empty-image" />
+ <div className="query-empty-text">暂无数据</div>
+ </div>
+ );
+ };
+
+ // 打开选择器弹窗
+ const openSelector = (title, options, key) => {
+ setSelectorTitle(title);
+ setSelectorOptions(options);
+ setSelectorKey(key);
+ setSelectorVisible(true);
+ };
+
+ // 关闭选择器弹窗
+ const closeSelector = () => {
+ setSelectorVisible(false);
+ };
+
+ // 处理选择器选择
+ const handleSelectorSelect = (value) => {
+ setAdvancedParams((prev) => ({ ...prev, [selectorKey]: value }));
+ closeSelector();
+ };
+
+ // 计算时间范围
+ const getDateRangeByType = (type) => {
+ const now = new Date();
+ let start, end;
+ switch (type) {
+ case 'lastMonth': {
+ const year = now.getMonth() === 0 ? now.getFullYear() - 1 : now.getFullYear();
+ const month = now.getMonth() === 0 ? 11 : now.getMonth() - 1;
+ start = new Date(year, month, 1);
+ end = new Date(year, month + 1, 0);
+ break;
+ }
+ case 'thisMonth': {
+ start = new Date(now.getFullYear(), now.getMonth(), 1);
+ end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+ break;
+ }
+ case 'lastWeek': {
+ const day = now.getDay() || 7;
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day);
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day - 6);
+ break;
+ }
+ case 'thisWeek': {
+ const day = now.getDay() || 7;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 7);
+ break;
+ }
+ case 'thisYear': {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = new Date(now.getFullYear(), 11, 31);
+ break;
+ }
+ case 'lastYear': {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ break;
+ }
+ default:
+ start = end = now;
+ }
+ return [formatDate(start), formatDate(end)];
+ };
+
+ // 打开时间类型弹窗
+ const handleOpenDateTypeModal = (target) => {
+ setDateTypeTarget(target);
+ setDateTypeModalVisible(true);
+ };
+
+ // 选择时间类型
+ const handleDateTypeSelect = (type) => {
+ setDateTypeModalVisible(false);
+ if (type === 'custom') {
+ setCurrentDateType(dateTypeTarget);
+ setDatePickerVisible(true);
+ } else {
+ const [start, end] = getDateRangeByType(type);
+ switch (dateTypeTarget) {
+ case 'create':
+ setAdvancedParams((prev) => ({ ...prev, createStart: start, createEnd: end }));
+ break;
+ case 'close':
+ setAdvancedParams((prev) => ({ ...prev, closeStart: start, closeEnd: end }));
+ break;
+ case 'file':
+ setAdvancedParams((prev) => ({ ...prev, fileStart: start, fileEnd: end }));
+ break;
+ default:
+ break;
+ }
+ }
+ };
+
+ // 渲染选择器弹窗
+ const renderSelectorModal = () => {
+ return (
+ <Modal
+ visible={selectorVisible}
+ onClose={closeSelector}
+ className="custom-selector-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">{selectorTitle}</div>
+ <span className="modal-close" onClick={closeSelector}>
+ ×
+ </span>
+ </div>
+ <div className="selector-modal-content">
+ {selectorOptions.map((option) => (
+ <div
+ key={option.value}
+ className="selector-modal-item"
+ onClick={() => handleSelectorSelect(option.value)}
+ style={{ color: option.value === advancedParams[selectorKey] ? '#1A6FB8' : '#171A1D' }}
+ >
+ {option.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+ );
+ };
+
+ // 新增：时间类型选择弹窗渲染
+ const renderDateTypeModal = () => (
+ <Modal
+ visible={dateTypeModalVisible}
+ onClose={() => setDateTypeModalVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择时间类型</div>
+ <span className="modal-close" onClick={() => setDateTypeModalVisible(false)}>
+ ×
+ </span>
+ </div>
+ <div className="date-type-modal-content">
+ {dateTypeOptions.map((opt) => (
+ <div key={opt.value} className="date-type-modal-item" onClick={() => handleDateTypeSelect(opt.value)}>
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+ );
+
+ // 新增：自定义时间选择弹窗渲染
+ const renderDatePickerModal = () => (
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="date-picker-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择日期范围</div>
+ <span className="modal-close" onClick={() => setDatePickerVisible(false)}>
+ ×
+ </span>
+ </div>
+ <CalendarRangeTwoDay CalendaronClick={handleCalendarClick} onClickDate={handleDateChange} />
+ </Modal>
+ );
+
+ // 工具函数：通过value获取label
+ const getSelectLabel = (options = [], value) => {
+ if (!value || !options || !options.length) return '';
+ const option = options.find((item) => item.value === value);
+ return option ? option.label : '';
+ };
+
+ // 新增：获取地区label字符串的函数
+ const getRegionLabel = () => {
+ if (!regionPickerValue || regionPickerValue.length === 0) return '请选择';
+ // 遍历regionTree，找到每一级的label
+ let labels = [];
+ let currentList = regionTree;
+ for (let i = 0; i < regionPickerValue.length; i++) {
+ const found = currentList && currentList.find(item => item.value === regionPickerValue[i]);
+ if (found) {
+ labels.push(found.label);
+ currentList = found.children;
+ } else {
+ break;
+ }
+ }
+ return labels.length > 0 ? labels.join(' / ') : '请选择';
+ };
+
+ // 新增：通用函数，判断有值时加深色样式
+ const renderSelectorText = (val, text) => {
+ return val ? <span style={{color: '#171A1D'}}>{text}</span> : text;
+ };
+
+ // 渲染高级筛选弹窗
+ const renderFilterModal = () => {
+ return (
+ <Modal
+ visible={filterVisible}
+ onClose={handleCloseFilter}
+ className="casequery-filter-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="query-filter-content">
+ <div className="filter-item">
+ <div className="filter-label">问题属地</div>
+ <div
+ className="filter-selector"
+ onClick={() => setRegionPickerVisible(true)}
+ >
+ {regionPickerValue && regionPickerValue.length > 0
+ ? <span style={{color: '#171A1D'}}>{getRegionLabel()}</span>
+ : getRegionLabel()}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+ {/* 地区选择Picker弹窗，单独渲染，避免嵌套错误 */}
+ <Picker
+ visible={regionPickerVisible}
+ data={regionTree}
+ value={regionPickerValue}
+ title="请选择地区"
+ okText="确定"
+ cancelText="取消"
+ onOk={(val) => {
+ setRegionPickerValue(val);
+ setAdvancedParams((prev) => ({
+ ...prev,
+ queCity: val[0] || '',
+ queArea: val[1] || '',
+ queRoad: val[2] || '',
+ queVillage: val[3] || '',
+ }));
+ setRegionPickerVisible(false);
+ }}
+ onCancel={() => setRegionPickerVisible(false)}
+ cascade={true}
+ />
+
+ <div className="filter-item">
+ <div className="filter-label">登记机构</div>
+ <div className="filter-input">
+ <InputItem
+ placeholder="请选择"
+ value={advancedParams.inputUnitName}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, inputUnitName: val }))}
+ style={advancedParams.inputUnitName ? {color: '#171A1D'} : {}}
+ />
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">登记时间</div>
+ <div className="filter-selector" onClick={() => handleOpenDateTypeModal('create')}>
+ {advancedParams.createStart && advancedParams.createEnd
+ ? <span style={{color: '#171A1D'}}>{`${advancedParams.createStart}-${advancedParams.createEnd}`}</span>
+ : '请选择'}
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">办结时间</div>
+ <div className="filter-selector" onClick={() => handleOpenDateTypeModal('close')}>
+ {advancedParams.closeStart && advancedParams.closeEnd
+ ? <span style={{color: '#171A1D'}}>{`${advancedParams.closeStart}-${advancedParams.closeEnd}`}</span>
+ : '请选择'}
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">纠纷类型</div>
+ <div className="filter-selector" onClick={() => openSelector('纠纷类型', $$.caseTypeSelect.caseTypeSelect || [], 'caseType')}>
+ {renderSelectorText(advancedParams.caseType, advancedParams.caseType ? getSelectLabel($$.caseTypeSelect.caseTypeSelect, advancedParams.caseType) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">化解结果</div>
+ <div className="filter-selector" onClick={() => openSelector('化解结果', $$.selectOption.mediResult || [], 'mediResult')}>
+ {renderSelectorText(advancedParams.mediResult, advancedParams.mediResult ? getSelectLabel($$.selectOption.mediResult, advancedParams.mediResult) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">事项来源</div>
+ <div className="filter-selector" onClick={() => openSelector('事项来源', $$.selectOption.caseCanal || [], 'canal')}>
+ {renderSelectorText(advancedParams.canal, advancedParams.canal ? getSelectLabel($$.selectOption.caseCanal, advancedParams.canal) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">事项状态</div>
+ <div className="filter-selector" onClick={() => openSelector('事项状态', $$.selectOption.caseStatus || [], 'status')}>
+ {renderSelectorText(advancedParams.status, advancedParams.status ? getSelectLabel($$.selectOption.caseStatus, advancedParams.status) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">事项等级</div>
+ <div className="filter-selector" onClick={() => openSelector('事项等级', $$.selectOption.caseLevelList || [], 'caseLevel')}>
+ {renderSelectorText(advancedParams.caseLevel, advancedParams.caseLevel ? getSelectLabel($$.selectOption.caseLevelList, advancedParams.caseLevel) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">是否重大矛盾纠纷</div>
+ <div
+ className="filter-selector"
+ onClick={() =>
+ openSelector(
+ '是否重大矛盾纠纷',
+ [
+ { label: '否', value: '0' },
+ { label: '是', value: '1' },
+ ],
+ 'majorStatus'
+ )
+ }
+ >
+ {renderSelectorText(advancedParams.majorStatus, advancedParams.majorStatus ? (advancedParams.majorStatus === '1' ? '是' : '否') : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">承办部门</div>
+ <div className="filter-selector" onClick={handleSelectMediateUnit}>
+ {renderSelectorText(displayNames.mediateUnitName, displayNames.mediateUnitName || '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">配合部门</div>
+ <div className="filter-selector" onClick={handleSelectAssistUnit}>
+ {renderSelectorText(displayNames.assistUnitName, displayNames.assistUnitName || '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">经办人</div>
+ <div className="filter-selector" onClick={handleSelectMediator}>
+ {renderSelectorText(displayNames.mediatorName, displayNames.mediatorName || '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">事项编号</div>
+ <div className="filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.caseRef}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, caseRef: val }))}
+ style={advancedParams.caseRef ? {color: '#171A1D'} : {}}
+ />
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">申请方</div>
+ <div className="filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.plaintiffs}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, plaintiffs: val }))}
+ style={advancedParams.plaintiffs ? {color: '#171A1D'} : {}}
+ />
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">被申请方</div>
+ <div className="filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.defendants}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, defendants: val }))}
+ style={advancedParams.defendants ? {color: '#171A1D'} : {}}
+ />
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">涉及金额</div>
+ <div className="filter-selector" onClick={() => openSelector('涉及金额', $$.selectOption.amount || [], 'amount')}>
+ {renderSelectorText(advancedParams.amount, advancedParams.amount ? getSelectLabel($$.selectOption.amount, advancedParams.amount) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">评价等级</div>
+ <div className="filter-selector" onClick={() => openSelector('评价等级', $$.selectOption.evaluateGrade || [], 'evaluateGrade')}>
+ {renderSelectorText(advancedParams.evaluateGrade, advancedParams.evaluateGrade ? getSelectLabel($$.selectOption.evaluateGrade, advancedParams.evaluateGrade) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">归档时间</div>
+ <div className="filter-selector" onClick={() => handleOpenDatePicker('file')}>
+ {advancedParams.fileStart && advancedParams.fileEnd ? `${advancedParams.fileStart} 至 ${advancedParams.fileEnd}` : '请选择'}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">是否扬言极端</div>
+ <div
+ className="filter-selector"
+ onClick={() =>
+ openSelector(
+ '是否扬言极端',
+ [
+ { label: '否', value: '0' },
+ { label: '是', value: '1' },
+ ],
+ 'isRisk'
+ )
+ }
+ >
+ {renderSelectorText(advancedParams.isRisk, advancedParams.isRisk ? (advancedParams.isRisk === '1' ? '是' : '否') : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">结案协议类型</div>
+ <div className="filter-selector" onClick={() => openSelector('结案协议类型', $$.selectOption.agreeType || [], 'agreeType')}>
+ {renderSelectorText(advancedParams.agreeType, advancedParams.agreeType ? getSelectLabel($$.selectOption.agreeType, advancedParams.agreeType) : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">是否重复事项</div>
+ <div
+ className="filter-selector"
+ onClick={() =>
+ openSelector(
+ '是否重复事项',
+ [
+ { label: '否', value: '0' },
+ { label: '是', value: '1' },
+ ],
+ 'isDuplicate'
+ )
+ }
+ >
+ {renderSelectorText(advancedParams.isDuplicate, advancedParams.isDuplicate ? (advancedParams.isDuplicate === '1' ? '是' : '否') : '请选择')}
+ <i className="filter-arrow"></i>
+ </div>
+ </div>
+ </div>
+
+ <div className="query-filter-buttons">
+ <Button className="filter-reset" onClick={handleResetFilter}>
+ 重置
+ </Button>
+ <Button className="filter-apply" type="primary" onClick={handleApplyFilter}>
+ 查询
+ </Button>
+ </div>
+ </Modal>
+ );
+ };
+
+ // 处理日期选择
+ const handleOpenDatePicker = (type) => {
+ setCurrentDateType(type);
+ setDatePickerVisible(true);
+ };
+
+ const calendarSelectedRef = useRef([]);
+
+ const handleDateChange = (dates) => {
+ if (!dates || dates.length !== 2) return;
+
+ const formatDate = (date) => {
+ if (!date || !date.key) return '';
+ return date.key;
+ };
+
+ const formattedStart = formatDate(dates[0]);
+ const formattedEnd = formatDate(dates[1]);
+
+ switch (currentDateType) {
+ case 'create':
+ setAdvancedParams((prev) => ({
+ ...prev,
+ createStart: formattedStart,
+ createEnd: formattedEnd,
+ }));
+ break;
+ case 'close':
+ setAdvancedParams((prev) => ({
+ ...prev,
+ closeStart: formattedStart,
+ closeEnd: formattedEnd,
+ }));
+ break;
+ case 'file':
+ setAdvancedParams((prev) => ({
+ ...prev,
+ fileStart: formattedStart,
+ fileEnd: formattedEnd,
+ }));
+ break;
+ default:
+ break;
+ }
+ setDatePickerVisible(false);
+ };
+
+ const handleCalendarClick = (type, action) => {
+ if (action === 'onClose') {
+ setDatePickerVisible(false);
+ } else if (action === 'submit') {
+ if (calendarSelectedRef.current && calendarSelectedRef.current.length === 2) {
+ handleDateChange(calendarSelectedRef.current);
+ } else {
+ setDatePickerVisible(false);
+ }
+ }
+ };
+
+ // 处理"更多"按钮点击事件
+ const handleMore = () => {
+ // 这里可以弹窗、展开高级筛选、或自定义逻辑
+ // 目前先简单弹窗
+ window && window.alert ? window.alert('更多功能开发中') : console.log('更多功能开发中');
+ };
+
+ // 渲染内容区域
+ const renderContent = () => {
+ // 初始状态，未搜索
+ if (!hasSearched) {
+ return renderInitialState();
+ }
+
+ // 搜索后无数据
+ if (hasSearched && listData.length === 0 && !loading) {
+ return renderEmptyState();
+ }
+
+ // 搜索中
+ if (loading && page === 1) {
+ return (
+ <div className="query-loading">
+ <div className="query-loading-text">加载中...</div>
+ </div>
+ );
+ }
+
+ // 搜索后有数据
+ return (
+ <Scrollbars style={{ height: 'calc(100vh - 155px)' }}>
+ <MyList
+ data={listData}
+ dataTotal={totalCount}
+ hasMore={hasMore}
+ loadMore={loadMoreData}
+ itemDom={renderListItem}
+ threshold={100}
+ showBottomText={true}
+ />
+ </Scrollbars>
+ );
+ };
+
+ return (
+ <NavBarPage title="综合查询" showBackArrow={true}>
+ <div className="query-container">
+ <div className="query-header">
+ <div
+ className="query-search"
+ style={{
+ display: 'flex',
+ alignItems: 'center',
+ background: '#F2F3F5',
+ borderRadius: 8,
+ padding: '2px 10px',
+ height: 32,
+ margin: '8px 12px',
+ }}
+ >
+ <span style={{ color: '#bfc2cc', marginRight: 6, fontSize: 18 }} className="iconfont icon-search" />
+ <SearchOutlined style={{ color: '#bfc2cc', marginRight: 6, fontSize: 18 }} />
+ <InputItem
+ placeholder="申请方/被申请方/事项编号"
+ clear
+ maxLength={50}
+ value={keyword}
+ onChange={(val) => setKeyword(val)}
+ className="query-search-input"
+ style={{
+ flex: 1,
+ background: 'transparent',
+ border: 'none',
+ fontSize: 15,
+ }}
+ />
+ <button className="custom-action-btn" onClick={handleSearch}>
+ 查询
+ </button>
+ </div>
+ <div className="query-actions">
+ <button className="custom-action-btn" onClick={handleOpenFilter}>
+ <img src={workStatistics_5} alt="" className="settings-icon" />
+ <span>更多</span>
+ </button>
+ </div>
+ </div>
+ {/* 新增：有查询结果时显示总数 */}
+ {hasSearched && listData.length > 0 && (
+ <div className="query-total-count">
+ 共<span className="query-total-count-number">{totalCount}</span>条记录
+ </div>
+ )}
+ <div className="query-content">{renderContent()}</div>
+
+ {renderFilterModal()}
+ {renderSelectorModal()}
+ {renderDateTypeModal()}
+ {renderDatePickerModal()}
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default CaseQuery;
diff --git a/src/views/caseQuery/index.less b/src/views/caseQuery/index.less
new file mode 100644
index 0000000..518cf55
--- /dev/null
+++ b/src/views/caseQuery/index.less
@@ -0,0 +1,777 @@
+// 综合查询页面样式
+.query-container {
+ width: 100%;
+ background-color: #f5f5f5;
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ overflow: hidden;
+}
+
+.query-search-input {
+ & .dtm-input-item-input {
+ background: #f2f3f5 !important;
+ }
+}
+
+// 头部搜索区域
+.query-header {
+ display: flex;
+ background-color: #fff;
+ align-items: center;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+ width: 100%;
+ box-sizing: border-box;
+
+ .query-search {
+ flex: 1;
+ min-width: 0;
+
+ :global {
+ .dtm-search-bar {
+ width: 100%;
+ background-color: #f5f5f5;
+ border-radius: 6px;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ padding: 0;
+
+ .dtm-search-bar-input-box {
+ width: 100%;
+ background-color: #f5f5f5;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ flex: 1;
+ padding: 0 12px;
+ box-sizing: border-box;
+
+ .dtm-icon {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 16px;
+ margin-right: 8px;
+ }
+
+ input {
+ flex: 1;
+ border: none;
+ outline: none;
+ background: transparent;
+ font-size: 14px;
+ color: #171a1d;
+ width: 100%;
+ height: 100%;
+ padding: 0;
+
+ &::placeholder {
+ color: rgba(23, 26, 29, 0.4);
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .query-actions {
+ display: flex;
+ align-items: center;
+ white-space: nowrap;
+ flex-shrink: 0;
+ }
+}
+
+.custom-action-btn {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ height: 36px;
+ padding: 0 4px;
+ border: none;
+ background: transparent;
+ color: #1a6fb8;
+ font-size: 16px;
+ font-weight: 400;
+ white-space: nowrap;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.7;
+ }
+
+ .settings-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 4px;
+ }
+}
+
+// 内容区域
+.query-content {
+ flex: 1;
+ overflow: hidden;
+ position: relative;
+}
+
+// 初始状态
+.query-initial-state {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+ margin-top: 200px;
+
+ .query-initial-image {
+ width: 210px;
+ height: 150px;
+ margin-bottom: 16px;
+ }
+
+ .query-initial-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+}
+
+// 无数据状态
+.query-empty-state {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ min-height: 87vh;
+
+ .query-empty-image {
+ width: 260px;
+ height: 260px;
+ margin-bottom: 16px;
+ }
+
+ .query-empty-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+}
+
+// 加载状态
+.query-loading {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+
+ .query-loading-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+}
+
+// 列表项样式
+.query-list-item {
+ background-color: #fff;
+ border-radius: 8px;
+ margin: 0px 12px 8px 12px;
+ padding: 16px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .query-list-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 12px;
+
+ .query-list-title {
+ font-size: 16px;
+ font-weight: bold;
+ color: #171a1d;
+ max-width: 260px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+
+ .query-list-separator {
+ margin: 0 2px;
+ }
+
+ .query-list-arrow {
+ margin-left: 4px;
+ color: #999;
+ }
+ }
+
+ .query-list-status {
+ font-size: 14px;
+ color: #1a6fb8;
+ }
+ }
+
+ .query-list-content {
+ .query-list-row {
+ display: flex;
+ margin-bottom: 8px;
+ padding-bottom: 8px;
+ border-bottom: 1px solid #f2f2f2;
+
+ &:last-child {
+ margin-bottom: 0;
+ padding-bottom: 0;
+ border-bottom: none;
+ }
+
+ .query-list-label {
+ width: 70px;
+ color: rgba(23, 26, 29, 0.6);
+ font-size: 14px;
+ }
+
+ .query-list-value {
+ flex: 1;
+ color: #171a1d;
+ font-size: 14px;
+
+ &.query-result-success {
+ color: #52c41a;
+ }
+
+ &.query-result-fail {
+ color: #f5222d;
+ }
+ }
+ }
+ }
+}
+.casequery-filter-modal .dtm-modal-body {
+ padding: 0 15px 15px !important;
+}
+
+// 筛选弹窗样式
+.casequery-filter-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ right: 0;
+ bottom: 148px;
+ z-index: 999;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: unset;
+ }
+
+ .am-modal-header {
+ display: none;
+ }
+
+ .am-modal-body {
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-start;
+ top: 44px;
+ overflow: visible;
+ height: calc(100% - 244px);
+ z-index: 999;
+ }
+
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+}
+
+.navbar {
+ z-index: 1003;
+ position: relative;
+}
+
+.navBarPage-navbar {
+ z-index: 1003 !important;
+}
+
+.query-filter-content {
+ flex: 1;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+
+ .filter-item {
+ width: calc(50% - 8px);
+ margin-bottom: 16px;
+
+ .filter-label {
+ font-size: 15px;
+ color: #171a1d;
+ margin-bottom: 8px;
+ font-weight: normal;
+ text-align: left;
+ }
+ .filter-input {
+ position: relative;
+ height: 40px;
+ display: flex;
+ align-items: center;
+ padding: 0 12px;
+ background: #f2f3f5;
+ border-radius: 4px;
+ color: #999;
+ font-size: 14px;
+ & .dtm-input-item-input {
+ background: #f2f3f5;
+ font-size: 14px;
+ }
+ }
+ .filter-selector {
+ position: relative;
+ height: 40px;
+ display: flex;
+ align-items: center;
+ padding: 0 12px;
+ background: #f2f3f5;
+ border-radius: 4px;
+ color: #999;
+ font-size: 14px;
+
+ .filter-arrow {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: translateY(-50%) rotate(45deg);
+ }
+ }
+
+ :global {
+ .dtm-input,
+ .dtm-select {
+ height: 40px;
+ border-radius: 4px !important;
+ background-color: #ffffff !important;
+ width: 100% !important;
+ border: none !important;
+ box-shadow: none !important;
+
+ input {
+ background-color: #ffffff !important;
+ font-size: 14px;
+
+ &::placeholder {
+ color: #999;
+ }
+ }
+ }
+
+ .dtm-picker {
+ width: 100%;
+
+ .dtm-list-item {
+ height: 40px;
+ line-height: 40px;
+ background-color: #ffffff;
+ border-radius: 4px;
+ padding: 0 12px;
+ color: #999;
+ font-size: 14px;
+
+ .dtm-list-item-content {
+ padding-right: 12px;
+
+ .dtm-list-arrow {
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: rotate(45deg);
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+.query-filter-buttons {
+ display: flex;
+ padding: 16px 0;
+ border-top: 1px solid #eee;
+ background: #ffffff;
+ position: sticky;
+ bottom: 0;
+
+ .filter-reset {
+ width: 120px;
+ height: 44px;
+ margin-right: 12px;
+ border: 1px solid #1a6fb8;
+ color: #1a6fb8;
+ background-color: #ffffff;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+
+ .filter-apply {
+ flex: 1;
+ height: 44px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+}
+
+// 日期选择弹窗样式
+.custom-date-picker-modal {
+ width: 90%;
+ max-width: 375px;
+
+ :global {
+ .am-modal-content {
+ border-radius: 8px;
+ }
+
+ .am-modal-header {
+ padding: 16px;
+ font-size: 16px;
+ font-weight: 500;
+ border-bottom: 1px solid #eee;
+ text-align: center;
+ }
+
+ .am-calendar {
+ display: block;
+ padding: 16px;
+ }
+ }
+}
+
+// 选择器弹窗样式
+.selector-item {
+ padding: 12px 16px;
+ border-bottom: 1px solid #eee;
+ font-size: 14px;
+
+ &:active {
+ background-color: #f5f5f5;
+ }
+
+ &.active {
+ color: #1a6fb8;
+ }
+}
+
+/* 下拉选择弹窗样式 */
+.custom-selector-modal {
+ width: 100vw;
+ min-width: 100vw;
+ max-width: 100vw;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ height: auto;
+ max-height: 80vh;
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: auto;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .selector-modal-content {
+ background: #fff;
+ border-radius: 0;
+ padding: 8px 0;
+ min-height: 0;
+ box-shadow: none;
+ }
+ .selector-modal-item {
+ font-size: 16px;
+ color: #222;
+ padding: 16px;
+ text-align: center;
+ border-bottom: 1px solid #f0f0f0;
+ cursor: pointer;
+ transition: background 0.2s;
+ &:last-child {
+ border-bottom: none;
+ }
+ &:active {
+ background: #f5f7fa;
+ }
+ }
+}
+
+/* 时间类型选择弹窗样式 */
+.date-type-modal {
+ width: 100vw;
+ min-width: 100vw;
+ max-width: 100vw;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ height: auto;
+ max-height: 80vh;
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: auto;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .date-type-modal-content {
+ background: #fff;
+ border-radius: 0;
+ padding: 8px 0;
+ min-height: 0;
+ box-shadow: none;
+ }
+ .date-type-modal-item {
+ font-size: 16px;
+ color: #222;
+ padding: 16px;
+ text-align: center;
+ border-bottom: 1px solid #f0f0f0;
+ cursor: pointer;
+ transition: background 0.2s;
+ &:last-child {
+ border-bottom: none;
+ }
+ &:active {
+ background: #f5f7fa;
+ }
+ }
+}
+
+/* 自定义时间选择弹窗样式 */
+.date-picker-modal {
+ width: 100vw;
+ min-width: 100vw;
+ max-width: 100vw;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ max-height: 80vh;
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 400px;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: 400px;
+ max-height: 80vh;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .calendar-container {
+ height: 100%;
+ }
+}
+
+.query-total-count {
+ font-size: 15px;
+ padding-left: 12px;
+ padding-top: 12px;
+ padding-bottom: 12px;
+}
+.query-total-count-number {
+ color: #1a6fb8;
+}
+
+/* 自定义筛选输入框样式 */
+.custom-filter-content .filter-item .dtm-input,
+.custom-filter-content .filter-item input[type='text'],
+.custom-filter-content .filter-item input {
+ background: #f2f3f5 !important;
+ border-radius: 6px !important;
+ border: none !important;
+ height: 40px !important;
+ font-size: 14px;
+ color: #171a1d;
+ box-shadow: none !important;
+ padding-left: 6px !important;
+}
diff --git a/src/views/caseYb/index.jsx b/src/views/caseYb/index.jsx
new file mode 100644
index 0000000..01b3187
--- /dev/null
+++ b/src/views/caseYb/index.jsx
@@ -0,0 +1,898 @@
+/*
+ * @Author: 韩天尊大人专属AI
+ * @Date: 2025-05-20
+ * @Version: 1.0.0
+ * @Description: 已办事项页面
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Button, Modal, InputItem, Picker } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import NavBarPage from '../../components/NavBarPage';
+import MyList from '../../components/MyList';
+import CalendarRangeTwoDay from '../../components/CalendarRangeTwoDay';
+import * as $$ from '../../utils/utility';
+import { SearchOutlined, CloseOutlined } from 'dd-icons';
+import './index.less';
+import caseTypeSelect from '../../utils/caseTypeSelect';
+import selectOption from '../../utils/selectOption';
+import { workStatistics_5 } from '../../assets/img';
+
+// 获取已办数量统计接口
+function countYbTaskAllApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/countYbTaskAll',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 全部已办接口
+function pageMyTaskAllApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskAll',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 已合并接口
+function pageCaseRepeatHbApi(data) {
+ return $$.ax.request({
+ url: 'caseRepeatInfo/pageCaseRepeatHb',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 已分派接口
+function pageMyTaskFpApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskFp',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 受理接口
+function pageMyTaskSlApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskSl',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 已结案接口
+function pageMyTaskBlzApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskBlz',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 审核接口
+function pageMyTaskShApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskSh',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 我发起的审核接口
+function pageMyTaskShWSQDApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskShWSQD',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 督办接口
+function pageMyTaskDbApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskDb',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 时间类型选项
+const dateTypeOptions = [
+ { value: 'custom', label: '自定义' },
+ { value: 'lastMonth', label: '上月' },
+ { value: 'lastWeek', label: '上周' },
+ { value: 'thisMonth', label: '本月' },
+ { value: 'thisWeek', label: '本周' },
+ { value: 'thisYear', label: '本年度' },
+ { value: 'lastYear', label: '上年度' },
+];
+
+const CaseYb = () => {
+ const history = useHistory();
+
+ // Tab状态
+ const [activeTab, setActiveTab] = useState('all');
+
+ // 搜索关键词
+ const [keyword, setKeyword] = useState('');
+
+ // 统计数据
+ const [countData, setCountData] = useState({
+ allYbTask: 0,
+ ybMerge: 0,
+ ybDispatch: 0,
+ ybAccept: 0,
+ ybClosed: 0,
+ ybAudit: 0,
+ ybSupervise: 0,
+ });
+
+ // 列表数据
+ const [listData, setListData] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [hasMore, setHasMore] = useState(true);
+ const [page, setPage] = useState(1);
+ const [totalCount, setTotalCount] = useState(0);
+
+ // 筛选弹窗
+ const [filterVisible, setFilterVisible] = useState(false);
+
+ // 查询参数
+ const [queryParams, setQueryParams] = useState({
+ page: 1,
+ size: 10,
+ status: 2,
+ caseStatus: '',
+ sortType: 2,
+ sortColmn: 1,
+ partyName: '',
+ statisticsTime: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ caseSource: '',
+ caseGrade: '',
+ });
+
+ // 按钮状态
+ const [activeButton, setActiveButton] = useState(1); // 1: 已受理, 2: 不予受理
+ const [activeClosedButton, setActiveClosedButton] = useState(1); // 1: 我承办的, 2: 我配合的
+ const [activeAuditButton, setActiveAuditButton] = useState(1); // 1: 回退审核, 2: 上报审核, 3: 结案审核, 4: 联合处置审核
+ const [activeSuperviseButton, setActiveSuperviseButton] = useState(1); // 1: 已办理, 2: 我发起的
+ const [dateTypeTarget, setDateTypeTarget] = useState('');
+ const [dateTypeModalVisible, setDateTypeModalVisible] = useState(false);
+
+ // 日期选择相关状态
+ const [datePickerVisible, setDatePickerVisible] = useState(false);
+ const [currentDateType, setCurrentDateType] = useState('');
+
+ // 高级筛选参数
+ const [advancedParams, setAdvancedParams] = useState({
+ handleTimeStart: '',
+ handleTimeEnd: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ canal: '',
+ caseStatus: '',
+ mediResult: '',
+ caseLevel: '',
+ });
+
+ // Tab配置
+ const tabConfig = {
+ all: {
+ text: '全部',
+ countKey: 'allYbTask',
+ api: pageMyTaskAllApi,
+ },
+ merge: {
+ text: '已合并',
+ countKey: 'ybMerge',
+ api: pageCaseRepeatHbApi,
+ },
+ dispatch: {
+ text: '已分派',
+ countKey: 'ybDispatch',
+ api: pageMyTaskFpApi,
+ },
+ accept: {
+ text: '受理',
+ countKey: 'ybAccept',
+ api: pageMyTaskSlApi,
+ },
+ closed: {
+ text: '已结案',
+ countKey: 'ybClosed',
+ api: pageMyTaskBlzApi,
+ },
+ audit: {
+ text: '审核',
+ countKey: 'ybAudit',
+ api: pageMyTaskShApi,
+ },
+ supervise: {
+ text: '督办',
+ countKey: 'ybSupervise',
+ api: pageMyTaskDbApi,
+ },
+ };
+
+ // 获取统计数据
+ const fetchCountData = async (params) => {
+ try {
+ const res = await countYbTaskAllApi(params);
+ if (res.type) {
+ setCountData(res.data);
+ }
+ } catch (error) {
+ $$.infoError('获取统计数据失败');
+ }
+ };
+
+ // 获取列表数据
+ const fetchListData = async (currentPage, tab, params = {}, type, buttonType) => {
+ setLoading(true);
+ try {
+ const currentTab = tabConfig[tab];
+ let api = currentTab.api;
+
+ // 处理不同tab的特殊参数
+ let requestParams = {
+ ...queryParams,
+ ...params,
+ page: currentPage,
+ size: 10,
+ };
+
+ // 处理不同状态的参数
+ switch (tab) {
+ case 'accept':
+ requestParams.status = buttonType === 2 ? 3 : 2;
+ break;
+ case 'closed':
+ requestParams.status = 1;
+ requestParams.caseTaskType = buttonType === 2 ? 2 : 1;
+ break;
+ case 'audit':
+ requestParams.status = 1;
+ requestParams.type = buttonType === 4 ? 4 : buttonType === 3 ? 3 : buttonType === 2 ? 2 : 1;
+ if (buttonType === 5) {
+ // 我发起的
+ api = pageMyTaskShWSQDApi;
+ }
+ break;
+ case 'supervise':
+ requestParams.status = activeSuperviseButton === 1 ? 1 : 3;
+ break;
+ default:
+ break;
+ }
+
+ console.log('api', api);
+
+ const res = await api(requestParams);
+
+ if (res.type) {
+ const { content, totalElements, last } = res.data;
+ if (currentPage === 1) {
+ setListData(content || []);
+ } else {
+ setListData((prev) => [...prev, ...(content || [])]);
+ }
+ setTotalCount(totalElements);
+ setActiveTab(tab);
+ setHasMore(!last);
+ setPage(currentPage);
+ fetchCountData(requestParams);
+ }
+ } catch (error) {
+ $$.infoError('获取列表数据失败');
+ } finally {
+ setLoading(false);
+ global.setSpinning(false);
+ }
+ };
+
+ // 搜索处理
+ const handleSearch = () => {
+ setQueryParams((prev) => ({ ...prev, partyName: keyword }));
+ fetchListData(1, activeTab, { partyName: keyword });
+ };
+
+ // 加载更多
+ const loadMoreData = () => {
+ if (!hasMore || loading) return;
+ fetchListData(page + 1, activeTab);
+ };
+
+ // 筛选相关处理
+ const handleOpenFilter = () => setFilterVisible(true);
+ const handleCloseFilter = () => setFilterVisible(false);
+
+ // 重置筛选
+ const handleResetFilter = () => {
+ setAdvancedParams({
+ handleTimeStart: '',
+ handleTimeEnd: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ canal: '',
+ caseStatus: '',
+ mediResult: '',
+ caseLevel: '',
+ });
+ setQueryParams((prev) => ({
+ ...prev,
+ statisticsTime: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ caseSource: '',
+ caseGrade: '',
+ }));
+ handleCloseFilter();
+ fetchListData(1);
+ };
+
+ const handleApplyFilter = () => {
+ // 确保日期参数正确传递
+ const params = {
+ ...advancedParams,
+ page: 1,
+ size: 10,
+ sortColmn: '1',
+ sortType: '2',
+ };
+
+ // 打印参数检查
+ console.log('查询参数:', params);
+
+ fetchListData(1, activeTab, params);
+ handleCloseFilter();
+ };
+
+ // Tab切换处理
+ const handleTabChange = (tab) => {
+ setActiveTab(tab);
+ setPage(1);
+ setListData([]);
+ global.setSpinning(true);
+ fetchListData(1, tab);
+ };
+
+ // 按钮点击处理
+ const handleButtonClick = (type, buttonType) => {
+ switch (type) {
+ case 'accept':
+ setActiveButton(buttonType);
+ break;
+ case 'closed':
+ setActiveClosedButton(buttonType);
+ break;
+ case 'audit':
+ setActiveAuditButton(buttonType);
+ break;
+ case 'supervise':
+ setActiveSuperviseButton(buttonType);
+ break;
+ default:
+ break;
+ }
+ setPage(1);
+ setListData([]);
+ global.setSpinning(true);
+ fetchListData(1, activeTab, {}, type, buttonType);
+ };
+
+ // 跳转详情
+ const handleGoToDetail = (item) => {
+ history.push(`/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=false`);
+ };
+
+ // 渲染列表项
+ const renderListItem = (item) => {
+ // 事项等级
+ const getGradeText = (grade) => {
+ switch (grade) {
+ case 1:
+ return '一级';
+ case 2:
+ return '二级';
+ case 3:
+ return '三级';
+ case 4:
+ return '四级';
+ case 5:
+ return '五级';
+ default:
+ return grade;
+ }
+ };
+ // 格式化时间
+ const formatTime = (time) => {
+ if (!time) return '';
+ const date = new Date(time);
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ const hours = String(date.getHours()).padStart(2, '0');
+ const minutes = String(date.getMinutes()).padStart(2, '0');
+ return `${year}-${month}-${day} ${hours}:${minutes}`;
+ };
+
+ return (
+ <div className="case-yb-list-item" onClick={() => handleGoToDetail(item)}>
+ <div className="case-yb-list-item-parties">
+ <div className="case-yb-list-item-plaintiffs">{item.plaintiffs}</div>
+ {item.defendants && (
+ <>
+ <div className="case-yb-list-item-parties-separator">、</div>
+ <div className="case-yb-list-item-defendants">{item.defendants}</div>
+ </>
+ )}
+ </div>
+ <div className="case-yb-list-item-time">{formatTime(item.turnaroundTime)}</div>
+ <div className="case-yb-list-item-tags">
+ {item.taskTypeName && <div className="case-yb-list-item-tag-type">{item.taskTypeName}</div>}
+ <div className="case-yb-list-item-tag">{item.caseType}</div>
+ {item.isRisk === '1' && <div className="case-yb-list-item-tag-timeout">风险</div>}
+ {item.superviseCount > 0 && <div className="case-yb-list-item-tag-supervise">督办</div>}
+ </div>
+ <div className="case-yb-list-item-info">
+ <div className="case-yb-list-item-address">
+ {item.caseSource} | {getGradeText(item.caseGrade)}
+ </div>
+ <div className="case-yb-list-item-action">
+ <div className="case-yb-list-item-action-btn">详情</div>
+ </div>
+ </div>
+ </div>
+ );
+ };
+
+ // 渲染Tab下方按钮
+ const renderTabButtons = () => {
+ const buttonConfigs = {
+ accept: [
+ { id: 1, text: '已受理' },
+ { id: 2, text: '不予受理' },
+ ],
+ closed: [
+ { id: 1, text: '我承办的' },
+ { id: 2, text: '我配合的' },
+ ],
+ audit: [
+ { id: 1, text: '回退审核' },
+ { id: 2, text: '上报审核' },
+ { id: 3, text: '结案审核' },
+ { id: 4, text: '联合处置审核' },
+ { id: 5, text: '我发起的' },
+ ],
+ supervise: [
+ { id: 1, text: '已办理' },
+ { id: 2, text: '我发起的' },
+ ],
+ };
+
+ const buttons = buttonConfigs[activeTab];
+ if (!buttons) return null;
+
+ let activeButtonState;
+ switch (activeTab) {
+ case 'accept':
+ activeButtonState = activeButton;
+ break;
+ case 'closed':
+ activeButtonState = activeClosedButton;
+ break;
+ case 'audit':
+ activeButtonState = activeAuditButton;
+ break;
+ case 'supervise':
+ activeButtonState = activeSuperviseButton;
+ break;
+ default:
+ return null;
+ }
+
+ return (
+ <div className="case-yb-list-buttons">
+ {buttons.map((button) => (
+ <div
+ key={button.id}
+ className={`case-yb-list-button${activeButtonState === button.id ? ' active' : ''}`}
+ onClick={() => handleButtonClick(activeTab, button.id)}
+ >
+ {button.text}
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ // 计算时间范围
+ const getDateRangeByType = (type) => {
+ const now = new Date();
+ let start, end;
+ switch (type) {
+ case 'lastMonth': {
+ const year = now.getMonth() === 0 ? now.getFullYear() - 1 : now.getFullYear();
+ const month = now.getMonth() === 0 ? 11 : now.getMonth() - 1;
+ start = new Date(year, month, 1);
+ end = new Date(year, month + 1, 0);
+ break;
+ }
+ case 'thisMonth': {
+ start = new Date(now.getFullYear(), now.getMonth(), 1);
+ end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+ break;
+ }
+ case 'lastWeek': {
+ const day = now.getDay() || 7;
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day);
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day - 6);
+ break;
+ }
+ case 'thisWeek': {
+ const day = now.getDay() || 7;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 7);
+ break;
+ }
+ case 'thisYear': {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = new Date(now.getFullYear(), 11, 31);
+ break;
+ }
+ case 'lastYear': {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ break;
+ }
+ default:
+ start = end = now;
+ }
+ const format = (date) => `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
+ return [format(start), format(end)];
+ };
+
+ // 选择时间类型
+ const handleDateTypeSelect = (type) => {
+ setDateTypeModalVisible(false);
+ if (type === 'custom') {
+ setCurrentDateType(dateTypeTarget);
+ setDatePickerVisible(true);
+ } else {
+ const [start, end] = getDateRangeByType(type);
+ if (dateTypeTarget === 'create') {
+ setAdvancedParams((prev) => ({ ...prev, handleTimeStart: start, handleTimeEnd: end }));
+ }
+ }
+ };
+
+ // 处理日期选择
+ const handleDateChange = (dates) => {
+ if (!dates || dates.length !== 2) return;
+ const formatDate = (date) => (date && date.key ? date.key : '');
+ const formattedStart = formatDate(dates[0]);
+ const formattedEnd = formatDate(dates[1]);
+ setAdvancedParams((prev) => ({
+ ...prev,
+ handleTimeStart: currentDateType === 'create' ? formattedStart : prev.handleTimeStart,
+ handleTimeEnd: currentDateType === 'create' ? formattedEnd : prev.handleTimeEnd,
+ }));
+ setDatePickerVisible(false);
+ };
+
+ // 时间类型选择弹窗渲染
+ const renderDateTypeModal = () => (
+ <Modal
+ visible={dateTypeModalVisible}
+ onClose={() => setDateTypeModalVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择时间类型</div>
+ <span className="modal-close" onClick={() => setDateTypeModalVisible(false)}>
+ ×
+ </span>
+ </div>
+ <div className="date-type-modal-content">
+ {dateTypeOptions.map((opt) => (
+ <div key={opt.value} className="date-type-modal-item" onClick={() => handleDateTypeSelect(opt.value)}>
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+ );
+
+ // 日期选择弹窗渲染
+ const renderDatePickerModal = () => (
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="date-picker-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择日期范围</div>
+ <span className="modal-close" onClick={() => setDatePickerVisible(false)}>
+ ×
+ </span>
+ </div>
+ <CalendarRangeTwoDay CalendaronClick={() => setDatePickerVisible(false)} onClickDate={handleDateChange} />
+ </Modal>
+ );
+
+ // 打开时间类型弹窗
+ const handleOpenDateTypeModal = (target) => {
+ setDateTypeTarget(target);
+ setDateTypeModalVisible(true);
+ };
+
+ // 筛选弹窗
+ const renderFilterModal = () => (
+ <Modal
+ visible={filterVisible}
+ onClose={handleCloseFilter}
+ className="registerhis-filter-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="registerhis-filter-content">
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">统计时间</div>
+ <div className="registerhis-filter-selector" onClick={() => handleOpenDateTypeModal('create')}>
+ {advancedParams.handleTimeStart && advancedParams.handleTimeEnd ? (
+ <span style={{ color: '#171A1D' }}>{`${advancedParams.handleTimeStart}-${advancedParams.handleTimeEnd}`}</span>
+ ) : (
+ '请选择'
+ )}
+ </div>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">纠纷类型</div>
+ <Picker
+ data={caseTypeSelect.caseTypeSelect}
+ cols={2}
+ cascade={true}
+ title="纠纷类型"
+ value={advancedParams.caseType ? [advancedParams.caseType] : []}
+ okText="确定"
+ onOk={(valArr) => {
+ const value = valArr.filter(Boolean).slice(-1)[0];
+ setAdvancedParams((prev) => ({ ...prev, caseType: value }));
+ }}
+ >
+ <div className="registerhis-filter-selector">
+ {(() => {
+ let label = '';
+ caseTypeSelect.caseTypeSelect.forEach((item) => {
+ if (item.value === advancedParams.caseType) {
+ label = item.label;
+ } else if (item.children) {
+ const child = item.children.find((child) => child.value === advancedParams.caseType);
+ if (child) label = child.label;
+ }
+ });
+ return label || '请选择';
+ })()}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+
+ {/* <div className="filter-item">
+ <div className="filter-label">申请方</div>
+ <div className="filter-input">
+ <InputItem
+ placeholder="请选择"
+ value={advancedParams.plaintiffs}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, plaintiffs: val }))}
+ style={advancedParams.plaintiffs ? { color: '#171A1D' } : {}}
+ />
+ </div>
+ </div> */}
+
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">申请方</div>
+ <div className="registerhis-filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.plaintiffs}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, plaintiffs: val }))}
+ clear
+ />
+ </div>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">被申请方</div>
+ <div className="registerhis-filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.defendants}
+ onChange={(val) => setAdvancedParams((prev) => ({ ...prev, defendants: val }))}
+ clear
+ />
+ </div>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项状态</div>
+ <Picker
+ data={selectOption.caseStatus}
+ cols={1}
+ title="事项状态"
+ value={advancedParams.caseStatus ? [advancedParams.caseStatus] : []}
+ okText="确定"
+ onOk={(valArr) => setAdvancedParams((prev) => ({ ...prev, caseStatus: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseStatus.find((i) => i.value === advancedParams.caseStatus)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项来源</div>
+ <Picker
+ data={selectOption.caseCanal}
+ cols={1}
+ title="事项来源"
+ value={advancedParams.canal ? [advancedParams.canal] : []}
+ okText="确定"
+ onOk={(valArr) => setAdvancedParams((prev) => ({ ...prev, canal: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseCanal.find((i) => i.value === advancedParams.canal)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项等级</div>
+ <Picker
+ data={selectOption.caseLevelList}
+ cols={1}
+ title="事项等级"
+ value={advancedParams.caseLevel ? [advancedParams.caseLevel] : []}
+ okText="确定"
+ onOk={(valArr) => setAdvancedParams((prev) => ({ ...prev, caseLevel: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseLevelList.find((i) => i.value === advancedParams.caseLevel)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">化解结果</div>
+ <Picker
+ data={selectOption.mediResult}
+ cols={1}
+ title="化解结果"
+ value={advancedParams.mediResult ? [advancedParams.mediResult] : []}
+ okText="确定"
+ onOk={(valArr) => setAdvancedParams((prev) => ({ ...prev, mediResult: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.mediResult.find((i) => i.value === advancedParams.mediResult)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ </div>
+ <div className="registerhis-filter-buttons">
+ <Button className="registerhis-filter-reset" onClick={handleResetFilter}>
+ 重置
+ </Button>
+ <Button className="registerhis-filter-apply" type="primary" onClick={handleApplyFilter}>
+ 查询
+ </Button>
+ </div>
+ </Modal>
+ );
+
+ useEffect(() => {
+ fetchListData(1, activeTab);
+ }, []);
+
+ return (
+ <div className="case-yb-page">
+ <NavBarPage title="已办事项" />
+ {/* 顶部查询区域，完全复用登记历史页面结构和样式 */}
+ <div className="registerhis-header">
+ <div className="registerhis-search">
+ <SearchOutlined style={{ color: '#bfc2cc', marginRight: 6, fontSize: 18 }} />
+ <InputItem
+ placeholder="申请方/被申请方/事项编号"
+ clear
+ maxLength={50}
+ value={keyword}
+ onChange={(val) => setKeyword(val)}
+ className="registerhis-search-input"
+ style={{ flex: 1, background: 'transparent', border: 'none', fontSize: 15 }}
+ onEnterPress={handleSearch}
+ />
+ <button className="registerhis-action-btn" onClick={handleSearch}>
+ 查询
+ </button>
+ </div>
+ <div className="registerhis-actions">
+ <button className="registerhis-action-btn" onClick={() => setFilterVisible(true)}>
+ {/* 这里建议引入登记历史的workStatistics_5图标，如无可用可省略 */}
+ <img src={workStatistics_5} alt="" className="settings-icon" />
+ <span>更多</span>
+ </button>
+ </div>
+ </div>
+ {/* Tab栏 */}
+ <div className="case-yb-tabs">
+ {Object.entries(tabConfig).map(([key, config]) => (
+ <div key={key} className={`case-yb-tab ${activeTab === key ? 'case-yb-tab-active' : ''}`} onClick={() => handleTabChange(key)}>
+ <div className="case-yb-tab-text">{config.text}</div>
+ {config.countKey && <div className="case-yb-tab-count">({countData[config.countKey] || 0})</div>}
+ </div>
+ ))}
+ </div>
+ {/* Tab下方按钮组 */}
+ {renderTabButtons()}
+ {/* 列表内容 */}
+ <div className="case-yb-list">
+ <Scrollbars
+ style={{
+ height:
+ activeTab === 'accept'
+ ? 'calc(100vh - 200px)'
+ : activeTab === 'closed'
+ ? 'calc(100vh - 200px)'
+ : activeTab === 'audit'
+ ? 'calc(100vh - 240px)'
+ : activeTab === 'supervise'
+ ? 'calc(100vh - 200px)'
+ : 'calc(100vh - 160px)',
+ }}
+ >
+ <MyList
+ data={listData}
+ dataTotal={totalCount}
+ hasMore={hasMore}
+ loadMore={loadMoreData}
+ itemDom={renderListItem}
+ threshold={100}
+ showBottomText={true}
+ />
+ </Scrollbars>
+ </div>
+ {/* 筛选弹窗 */}
+ {renderFilterModal()}
+ {renderDateTypeModal()}
+ {renderDatePickerModal()}
+ </div>
+ );
+};
+
+export default CaseYb;
diff --git a/src/views/caseYb/index.less b/src/views/caseYb/index.less
new file mode 100644
index 0000000..07bda30
--- /dev/null
+++ b/src/views/caseYb/index.less
@@ -0,0 +1,360 @@
+.case-yb-page {
+ display: flex;
+ flex-direction: column;
+ height: 100vh;
+ background-color: #f5f5f5;
+
+ // 搜索栏
+ .search-bar {
+ padding: 12px 16px;
+ background-color: #fff;
+ display: flex;
+ align-items: center;
+ gap: 12px;
+
+ .search-input {
+ flex: 1;
+ height: 32px;
+ background-color: #f5f5f5;
+ border-radius: 16px;
+ display: flex;
+ align-items: center;
+ padding: 0 12px;
+ position: relative;
+
+ .search-icon {
+ font-size: 16px;
+ color: #171a1d;
+ margin-right: 8px;
+ }
+
+ :global {
+ .dd-input-item {
+ background: transparent;
+ padding: 0;
+ height: 32px;
+ line-height: 32px;
+
+ input {
+ font-size: 14px;
+ }
+ }
+ }
+
+ .clear-icon {
+ position: absolute;
+ right: 12px;
+ font-size: 16px;
+ color: #999;
+ }
+ }
+
+ .search-actions {
+ display: flex;
+ gap: 8px;
+
+ .search-btn,
+ .filter-btn {
+ height: 32px;
+ padding: 0 16px;
+ font-size: 14px;
+ border-radius: 16px;
+ }
+
+ .search-btn {
+ background-color: #1677ff;
+ color: #fff;
+ border: none;
+ }
+
+ .filter-btn {
+ border: 1px solid #ddd;
+ }
+ }
+ }
+
+ // Tab栏样式复用首页
+ .case-yb-tabs {
+ display: flex;
+ flex-wrap: nowrap;
+ padding: 0 8px;
+ height: 40px;
+ align-items: center;
+ overflow-x: auto;
+ -webkit-overflow-scrolling: touch;
+ scrollbar-width: none; /* Firefox */
+ -ms-overflow-style: none; /* IE and Edge */
+ &::-webkit-scrollbar {
+ display: none; /* Chrome, Safari, Opera */
+ }
+ .case-yb-tab {
+ padding: 0 8px;
+ height: 23px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ flex-shrink: 0;
+ transition: all 0.3s;
+ .case-yb-tab-text {
+ font-size: 15px;
+ color: rgba(23, 26, 29, 0.6);
+ white-space: nowrap;
+ }
+ .case-yb-tab-count {
+ font-size: 15px;
+ color: rgba(23, 26, 29, 0.6);
+ margin-left: 4px;
+ }
+ &.case-yb-tab-active {
+ height: 38px;
+ width: auto;
+ .case-yb-tab-text {
+ font-size: 20px;
+ font-weight: bold;
+ color: #171a1d;
+ }
+ .case-yb-tab-count {
+ font-size: 20px;
+ font-weight: bold;
+ color: #171a1d;
+ margin-left: 4px;
+ }
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 42px;
+ height: 6px;
+ background: linear-gradient(90deg, #e8f8ff, #1a6fb8 100%);
+ border-radius: 2px;
+ }
+ }
+ }
+ }
+
+ // 列表样式复用首页
+ .case-yb-list {
+ padding: 8px 8px;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ .case-yb-list-item {
+ background-color: #fff;
+ padding: 6px 12px 6px 12px;
+ margin-bottom: 8px;
+ position: relative;
+ .case-yb-list-item-parties {
+ display: flex;
+ font-size: 16px;
+ font-weight: bold;
+ color: #333;
+ max-width: 167px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .case-yb-list-item-plaintiffs,
+ .case-yb-list-item-defendants {
+ max-width: 45%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .case-yb-list-item-parties-separator {
+ margin: 0 4px;
+ }
+ }
+ .case-yb-list-item-time {
+ position: absolute;
+ top: 12px;
+ right: 12px;
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+ .case-yb-list-item-tags {
+ display: flex;
+ flex-wrap: wrap;
+ margin-bottom: 8px;
+ .case-yb-list-item-tag-type {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ color: #f53f3f;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ border: 1px solid #f53f3f;
+ margin-top: 8px;
+ }
+ .case-yb-list-item-tag {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ color: #1a6fb8;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ border: 1px solid #1a6fb8;
+ background: none;
+ margin-top: 8px;
+ }
+ .case-yb-list-item-tag-timeout {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #f53f3f;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ margin-top: 8px;
+ }
+ .case-yb-list-item-tag-soon {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #f53f3f;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ }
+ .case-yb-list-item-tag-supervise {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #ff7d00;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ margin-top: 8px;
+ }
+ }
+ .case-yb-list-item-info {
+ display: flex;
+ justify-content: space-between;
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ align-items: center;
+ .case-yb-list-item-address {
+ flex: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ .case-yb-list-item-grade {
+ margin-left: 8px;
+ }
+ .case-yb-list-item-action {
+ margin-left: 8px;
+ .case-yb-list-item-action-btn {
+ width: 64px;
+ height: 28px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ font-size: 14px;
+ border-radius: 100px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+ }
+ }
+ }
+ }
+
+ // 筛选弹窗
+ .filter-modal {
+ :global {
+ .dd-modal-content {
+ padding: 16px;
+ }
+ }
+
+ .filter-content {
+ .filter-item {
+ margin-bottom: 16px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .item-label {
+ font-size: 14px;
+ color: #333;
+ margin-bottom: 8px;
+ }
+
+ :global {
+ .dd-input-item,
+ .dd-picker {
+ background-color: #f5f5f5;
+ border-radius: 4px;
+ }
+ }
+ }
+ }
+
+ .filter-footer {
+ margin-top: 24px;
+ display: flex;
+ gap: 12px;
+
+ .reset-btn,
+ .apply-btn {
+ flex: 1;
+ height: 40px;
+ border-radius: 20px;
+ font-size: 14px;
+ }
+
+ .reset-btn {
+ border: 1px solid #ddd;
+ }
+
+ .apply-btn {
+ background-color: #1677ff;
+ border: none;
+ }
+ }
+ }
+
+ .case-yb-list-buttons {
+ display: flex;
+ margin-left: 12px;
+ position: relative;
+ z-index: 1;
+ flex-wrap: wrap;
+ margin-top: 8px;
+ gap: 10px;
+ .case-yb-list-button {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ background: rgba(23, 26, 29, 0.06);
+ padding: 0px 4px;
+ cursor: pointer;
+ // margin-right: 10px;
+ transition: all 0.3s;
+ border: none;
+ border-radius: 4px;
+ height: 32px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ min-width: 64px;
+ &.active {
+ color: #1a6fb8;
+ background: rgba(26, 111, 184, 0.1);
+ }
+ }
+ }
+}
diff --git a/src/views/draftBox/index.jsx b/src/views/draftBox/index.jsx
new file mode 100644
index 0000000..4e4cd0c
--- /dev/null
+++ b/src/views/draftBox/index.jsx
@@ -0,0 +1,176 @@
+/*
+ * @Company: hugeInfo
+ * @Author: victor
+ * @Date: 2024-07-30 10:00:00
+ * @LastEditTime: 2024-07-30 10:00:00
+ * @LastEditors: victor
+ * @Version: 1.0.0
+ * @Description: 草稿箱页面
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Input, Button, Tag, List, Modal } from 'antd';
+import { SearchOutlined } from '@ant-design/icons';
+import NavBarPage from '../../components/NavBarPage';
+import * as $$ from '../../utils/utility';
+import './index.less';
+
+// 接口 - 分页查询草稿箱
+function pageQueryApi(data) {
+ return $$.ax.request({ url: 'casedraftInfo/pageQuery', type: 'get', data, service: 'mediate' });
+}
+
+// 接口 - 删除草稿
+function deleteDraftApi(id) {
+ // 注意：请替换为实际的删除接口URL和参数
+ return $$.ax.request({ url: `casedraftInfo/deleteById?id=${id}`, type: 'get', service: 'mediate' });
+}
+
+
+const DraftBox = () => {
+ const history = useHistory();
+ const [searchKeyword, setSearchKeyword] = useState('');
+ const [draftList, setDraftList] = useState([]);
+ const [total, setTotal] = useState(0);
+ const [loading, setLoading] = useState(false);
+ // 分页状态可以根据需要添加，这里简化处理，一次性加载
+ // const [pagination, setPagination] = useState({ current: 1, pageSize: 10 });
+
+ // 获取草稿列表数据
+ const fetchDrafts = async (keyword = '') => {
+ setLoading(true);
+ global.setSpinning(true);
+ try {
+ const params = {
+ // current: pagination.current,
+ // pageSize: pagination.pageSize,
+ // plaintiffs: keyword.trim(), // 传递搜索关键词 - 旧逻辑
+ page:1,
+ size:10,
+ sortColmn:1,
+ sortType:2
+ };
+ // 当 keyword 有值时才添加 plaintiffs 参数
+ if (keyword && keyword.trim()) {
+ params.plaintiffs = keyword.trim();
+ }
+ const res = await pageQueryApi(params);
+ if (res.type) {
+ setDraftList(res.data?.content || []);
+ setTotal(res.data?.totalElements || 0);
+ // setPagination({ ...pagination, total: res.data?.total || 0 });
+ } else {
+ $$.infoError(res.message || '获取草稿列表失败', 'error');
+ }
+ } catch (error) {
+ $$.infoError('获取草稿列表异常');
+ } finally {
+ setLoading(false);
+ global.setSpinning(false);
+ }
+ };
+
+ // 初始化加载数据
+ useEffect(() => {
+ fetchDrafts();
+ }, []); // 移除 pagination 依赖，简化为初始化加载
+
+ // 处理搜索
+ const handleSearch = () => {
+ // setPagination({ ...pagination, current: 1 }); // 重置到第一页
+ fetchDrafts(searchKeyword);
+ };
+
+ // 处理删除
+ const handleDelete = (item) => {
+ Modal.confirm({
+ title: '确认删除',
+ content: '您确定要删除此草稿吗？删除后不可恢复。',
+ okText: '确认',
+ cancelText: '取消',
+ onOk: async () => {
+ global.setSpinning(true);
+ try {
+ const res = await deleteDraftApi(item.id); // 假设item有id字段
+ if (res.success) {
+ $$.infoSuccess('删除成功', 'success');
+ fetchDrafts(searchKeyword); // 刷新列表
+ } else {
+ $$.infoError(res.message || '删除失败', 'error');
+ }
+ } catch (error) {
+ console.error('删除草稿失败:', error);
+ $$.infoError('删除草稿异常', 'error');
+ } finally {
+ global.setSpinning(false);
+ }
+ },
+ });
+ };
+
+ // 处理修改
+ const handleModify = (item) => {
+ // 跳转到编辑页面，传递草稿ID或其他必要信息
+ // history.push(`/gzdyh/editDraft/${item.id}`); // 假设有编辑页路由
+ console.log('跳转修改:', item);
+ $$.infoSuccess('修改功能待实现', 'info');
+ };
+
+ // 渲染列表项
+ const renderItem = (item) => (
+ <List.Item className="draft-item">
+ <div className="draft-item-content">
+ <div className="draft-item-title">{item.plaintiffs+','+item.defendants || '未知申请方'}</div>
+ <div className="draft-item-tags">
+ {!item.tags && <Tag className="draft-item-tag">{item.caseTypeFirstName}/{item.caseTypeName}</Tag>}
+ </div>
+ <div className="draft-item-bottom">
+ <div className="draft-item-time">保存时间：{$$.timeFormat(item.updateTime)}</div>
+ <div className="draft-item-actions">
+ <Button className="draft-item-delete-btn" onClick={() => handleDelete(item)}>删除</Button>
+ <Button type="primary" className="draft-item-modify-btn" onClick={() => handleModify(item)}>修改</Button>
+ </div>
+ </div>
+ </div>
+ </List.Item>
+ );
+
+ return (
+ <div className="draft-box">
+ <NavBarPage title="草稿箱" leftContentVisible={true} className="draft-box-navbar">
+ <div className="draft-box-search">
+ <div className="search-inner-container">
+ <Input
+ placeholder="申请方/被申请方姓名"
+ prefix={<SearchOutlined style={{ color: 'rgba(0,0,0,.25)' }} />}
+ value={searchKeyword}
+ onChange={(e) => setSearchKeyword(e.target.value)}
+ onPressEnter={handleSearch} // 支持回车搜索
+ className="search-input"
+ />
+ <Button type="primary" onClick={handleSearch} className="search-button">查询</Button>
+ </div>
+ </div>
+
+ <div className="draft-box-summary">
+ 共<span className="summary-total">{total}</span>条记录
+ </div>
+
+ <List
+ className="draft-box-list"
+ loading={loading}
+ itemLayout="horizontal"
+ dataSource={draftList}
+ renderItem={renderItem}
+ // 可以添加分页组件 <Pagination {...pagination} onChange={(page, pageSize) => setPagination({ ...pagination, current: page, pageSize })} />
+ locale={{ emptyText: '暂无草稿' }}
+ />
+ {draftList.length > 0 && (
+ <div className="draft-box-footer">已加载全部</div>
+ )}
+ </NavBarPage>
+ </div>
+ );
+};
+
+export default DraftBox;
\ No newline at end of file
diff --git a/src/views/draftBox/index.less b/src/views/draftBox/index.less
new file mode 100644
index 0000000..3ab003a
--- /dev/null
+++ b/src/views/draftBox/index.less
@@ -0,0 +1,303 @@
+/* 草稿箱页面样式 */
+.draft-box {
+ min-height: 100vh;
+ background-color: #f5f5f5;
+ display: flex;
+ flex-direction: column;
+
+ &-navbar {
+ background-color: #1a6fb8 !important; /* 保持与个人中心一致的顶部颜色 */
+ .am-navbar-title {
+ color: #fff !important; /* 确保标题是白色 */
+ }
+ .am-navbar-left-icon {
+ color: #fff !important; /* 确保返回箭头是白色 */
+ }
+ flex-shrink: 0; // 防止导航栏被压缩
+ }
+
+ .am-navbar-content { // 尝试 targeting NavBarPage 的内容区 (需要验证)
+ display: flex;
+ flex-direction: column;
+ flex: 1; // 占据剩余空间
+ overflow: hidden; // 防止内容溢出
+ }
+
+ /* 搜索区域 - 外层容器 */
+ &-search {
+ padding: 16px;
+ background-color: #fff;
+ border-bottom: 1px solid #f0f0f0;
+ flex-shrink: 0; // 防止搜索区被压缩
+ }
+
+ /* 搜索区域 - 内层容器 */
+ .search-inner-container {
+ display: flex;
+ align-items: center;
+ background: #f2f3f5; // 内层容器灰色背景
+ border-radius: 5px; // 内层容器圆角
+ height: 36px;
+ padding: 0 8px; // 内层容器左右内边距
+ box-sizing: border-box;
+
+ .search-input {
+ flex: 1;
+ margin-right: 8px;
+ border: none;
+ background: transparent;
+ height: 100%;
+ padding-left: 0; // 重置之前的 padding
+
+ // 去除 antd input 的 focus 效果
+ .ant-input,
+ .ant-input:focus,
+ .ant-input-focused {
+ background: transparent;
+ box-shadow: none !important;
+ border-color: transparent !important;
+ outline: none !important;
+ }
+ .ant-input-affix-wrapper,
+ .ant-input-affix-wrapper:focus,
+ .ant-input-affix-wrapper-focused {
+ background: transparent !important;
+ border-color: transparent !important;
+ box-shadow: none !important;
+ outline: none !important;
+ }
+
+ .ant-input-prefix {
+ margin-right: 4px;
+ color: #999;
+ }
+ }
+
+ .search-button {
+ position: relative; // 为了定位伪元素
+ padding: 0 8px; // 按钮左右内边距，给文字和竖线空间
+ width: auto; // 让宽度自适应内容
+ height: auto; // 让高度自适应内容
+ border: none;
+ background: none !important; // 强制去除背景
+ color: #1a6fb8;
+ font-weight: 500;
+ font-size: 15px;
+ line-height: 36px;
+ box-shadow: none !important; // 强制去除点击阴影
+ cursor: pointer; // 保持指针样式
+
+ // 添加左侧竖线
+ &::before {
+ content: '';
+ position: absolute;
+ left: 0; // 定位到按钮的左边
+ top: 50%;
+ transform: translateY(-50%);
+ width: 1px;
+ height: 14px; // 竖线高度
+ background-color: #d9d9d9; // 竖线颜色
+ }
+ }
+ }
+
+ /* 记录总数 */
+ &-summary {
+ padding-left: 12px;
+ padding-top: 12px;
+ padding-bottom: 12px;
+ font-size: 15px;
+ color: #000;
+ font-weight: 400;
+ flex-shrink: 0; // 防止摘要区被压缩
+
+ .summary-total {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+ }
+
+ /* 草稿列表 */
+ &-list {
+ flex: 1; // 占据剩余的垂直空间
+ background-color: #f5f5f5;
+ padding: 0 12px;
+ overflow-y: auto; // 内容超出时滚动
+
+ .ant-list-item {
+ background-color: #fff;
+ margin-bottom: 12px;
+ border-radius: 8px;
+ padding: 16px;
+ border: none; // 移除默认边框
+ display: flex; // 使用flex布局排列内容和按钮
+ justify-content: space-between;
+ align-items: flex-start; // 顶部对齐
+ }
+ }
+
+ /* 列表项内容 */
+ .draft-item-content {
+ flex: 1; // 占据主要空间
+ }
+
+ /* 列表项标题 */
+ .draft-item-title {
+ font-size: 16px;
+ color: #333;
+ margin-bottom: 8px;
+ font-weight: 500;
+ }
+
+ /* 标签区域 */
+ .draft-item-tags {
+ margin-bottom: 8px;
+ }
+
+ /* 标签样式 */
+ .draft-item-tag {
+ background-color: #e6f7ff;
+ border-color: #91d5ff;
+ color: #1890ff;
+ font-size: 12px;
+ font-weight: 400;
+ margin-right: 8px;
+ margin-bottom: 4px; // 标签换行时的间距
+ padding: 2px 6px;
+ border-radius: 4px;
+ }
+
+ /* 保存时间 + 操作按钮的容器 */
+ .draft-item-bottom {
+ display: flex;
+ justify-content: space-between; // 时间靠左，按钮靠右
+ align-items: center; // 垂直居中
+ margin-top: 12px; // 与上方内容的间距
+ padding-top: 12px; // 虚线上方的间距
+ border-top: 1px dotted #ccc; // 添加虚线上边框
+ }
+
+ /* 保存时间 */
+ .draft-item-time {
+ font-size: 14px;
+ color: #999;
+ white-space: nowrap; // 防止时间换行
+ margin-right: 8px; // 与按钮组的最小间距
+ }
+
+ /* 操作按钮区域 */
+ .draft-item-actions {
+ display: flex;
+ align-items: center; // 垂直居中按钮
+ gap: 8px; // 按钮之间的间距
+ }
+
+ /* 删除按钮 */
+ .draft-item-delete-btn {
+ border-color: #ff4d4f;
+ color: #ff4d4f;
+ border-radius: 16px;
+ height: 32px;
+ padding: 0 12px;
+ font-size: 14px;
+
+ &:hover, &:focus {
+ border-color: #ff7875;
+ color: #ff7875;
+ }
+ }
+
+ /* 修改按钮 */
+ .draft-item-modify-btn {
+ border-radius: 16px;
+ height: 32px;
+ padding: 0 12px;
+ font-size: 14px;
+ background-color: #1A6FB8; // 修改背景色
+ border-color: #1A6FB8; // 同时修改边框色
+
+ &:hover,
+ &:focus {
+ background-color: #155a9b; // 添加 hover 效果
+ border-color: #155a9b;
+ }
+ }
+
+ /* 列表底部提示 */
+ &-footer {
+ text-align: center;
+ color: #999;
+ padding-top: 0px;
+ padding-bottom: 12px;
+ flex-shrink: 0; // 防止页脚被压缩
+ background-color: #f5f5f5; // 确保背景色一致
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 22px;
+ }
+
+ /* 适配小屏幕 */
+ @media screen and (max-width: 375px) {
+ &-search { // 外层
+ padding: 12px;
+ }
+ .search-inner-container { // 内层
+ height: 32px;
+ padding: 0 6px;
+ .search-input {
+ .ant-input-prefix {
+ margin-right: 2px;
+ }
+ }
+ .search-button {
+ font-size: 14px;
+ line-height: 32px;
+ padding: 0 6px; // 调整小屏幕下的 padding
+ &::before {
+ height: 12px; // 调整小屏幕下的竖线高度
+ }
+ }
+ }
+ &-summary {
+ padding-left: 12px;
+ padding-top: 10px;
+ padding-bottom: 10px;
+ font-size: 13px;
+ .summary-total {
+ // margin: 0 2px; // 移除外边距
+ }
+ }
+ &-list {
+ padding: 0 12px;
+ .ant-list-item {
+ padding: 12px;
+ margin-bottom: 10px;
+ }
+ }
+ .draft-item-title {
+ font-size: 15px;
+ }
+ .draft-item-tag {
+ font-size: 12px;
+ }
+ .draft-item-bottom {
+ margin-top: 10px;
+ padding-top: 10px;
+ }
+ .draft-item-time {
+ font-size: 14px;
+ }
+ .draft-item-delete-btn,
+ .draft-item-modify-btn {
+ height: 28px;
+ padding: 0 10px;
+ font-size: 13px;
+ }
+ &-footer {
+ padding: 12px 0;
+ }
+ .am-navbar-content { // 如果目标类名正确
+ // 小屏幕下的 flex 调整（如果需要）
+ }
+ }
+ }
\ No newline at end of file
diff --git a/src/views/flow/addRecord/index.jsx b/src/views/flow/addRecord/index.jsx
new file mode 100644
index 0000000..f71cb91
--- /dev/null
+++ b/src/views/flow/addRecord/index.jsx
@@ -0,0 +1,165 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 10:15:06
+ * @LastEditTime: 2025-05-13 10:42:23
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 添加办理记录
+ */
+import React, { useEffect, useState } from 'react';
+import { TextareaItem, Button } from 'dingtalk-design-mobile';
+import { useHistory } from 'react-router-dom';
+import * as $$ from '../../../utils/utility';
+import NavBarPage from '../../../components/NavBarPage';
+import DingUpload from '../../../components/DingUpload';
+
+import './index.less';
+
+// 获取id
+function getNewTimeIdApi(id) {
+ return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
+}
+
+function updateFeedbackApi(data) {
+ return $$.ax.request({ url: `caseFeedback/updateFeedback`, type: 'post', service: 'mediate', data });
+}
+
+function saveFeedbackApi(data) {
+ return $$.ax.request({ url: `caseFeedback/saveFeedback`, type: 'post', service: 'mediate', data });
+}
+
+const AddRecord = () => {
+ const history = useHistory();
+ const mainId = $$.getQueryString('mainId');
+ const caseId = $$.getQueryString('caseId');
+ const caseTaskId = $$.getQueryString('caseTaskId');
+ const [handleContent, setHandleContent] = useState('');
+ const [fileList, setFileList] = useState([]);
+ const [newId, setNewId] = useState('');
+
+ // 处理提交
+ const handleSubmit = async () => {
+ if (!handleContent) {
+ $$.showToast({ content: '办理意见不能为空' });
+ return;
+ }
+ if (handleContent.length > 500) {
+ $$.showToast({ content: '办理意见不能超过500个字符' });
+ return;
+ }
+
+ // 新增
+ if (!mainId) {
+ global.setSpinning(true);
+ const res = await saveFeedbackApi({
+ handleContent,
+ caseId,
+ caseTaskId,
+ id: newId,
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ $$.setLocal('bljl', true);
+ history.goBack();
+ }
+ } else {
+ global.setSpinning(true);
+ const res = await updateFeedbackApi({
+ handleContent,
+ caseId,
+ caseTaskId,
+ id: mainId,
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ $$.setLocal('bljl', true);
+ history.goBack();
+ }
+ }
+ };
+
+ // 查看说明材料
+ const handleViewInstructions = () => {
+ console.log('查看说明材料');
+ };
+
+ //获取id
+ const getNewTimeId = async (type) => {
+ const res = await getNewTimeIdApi();
+ if (res.type) {
+ setNewId(res.data);
+ }
+ };
+
+ useEffect(() => {
+ if (!mainId) {
+ getNewTimeId();
+ } else {
+ // 记录在缓存中
+ // sxbl_currentRecord，要做到回显内容
+ const currentRecord = $$.getSessionStorage('sxbl_currentRecord');
+ if (currentRecord) {
+ setHandleContent(currentRecord.handleContent || '');
+ setNewId(mainId);
+ }
+ // 文件列表
+ if (currentRecord.fileInfoList && currentRecord.fileInfoList.length > 0) {
+ setFileList(currentRecord.fileInfoList);
+ }
+ }
+ }, []);
+
+ return (
+ <NavBarPage
+ title="添加办理记录"
+ rightContent={
+ <span className="public-color" onClick={handleViewInstructions}>
+ 说明材料
+ </span>
+ }
+ >
+ <div className="add-record">
+ <div className="add-record-content">
+ <div className="add-record-input">
+ <div className="add-record-label">
+ <span className="required-mark">*</span>
+ 办理意见
+ </div>
+ <TextareaItem
+ value={handleContent}
+ onChange={(value) => setHandleContent(value)}
+ showCount
+ maxLength={500}
+ placeholder="办理意见应该填写完整，办理意见应具备5要素：调解时间+调解参与部门/人+调解地点+调解过程+调解结果"
+ autoHeight
+ rows={16}
+ />
+ </div>
+ <div className="add-record-file">
+ <DingUpload
+ title="办理附件"
+ subtitle="可添加办理相关附件"
+ fileList={fileList}
+ mainId={caseId}
+ ownerId={newId}
+ ownerType="22_00018-501"
+ multiple={true}
+ maxCount={9}
+ />
+ </div>
+ </div>
+
+ <div className="add-record-footer">
+ <Button type="primary" onClick={handleSubmit}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default AddRecord;
diff --git a/src/views/flow/addRecord/index.less b/src/views/flow/addRecord/index.less
new file mode 100644
index 0000000..592cb43
--- /dev/null
+++ b/src/views/flow/addRecord/index.less
@@ -0,0 +1,134 @@
+.add-record {
+ display: flex;
+ flex-direction: column;
+ height: calc(100vh - 46px);
+
+ &-content {
+ flex: 1;
+ overflow-y: auto;
+ display: flex;
+ flex-direction: column;
+ }
+
+ &-desc {
+ font-size: 14px;
+ color: #999;
+ line-height: 1.5;
+ padding: 12px 16px;
+ background: #f2f7fe;
+ border-radius: 4px;
+ margin-bottom: 16px;
+ }
+
+ &-input {
+ flex: 1;
+ background: #fff;
+ border-radius: 4px;
+ padding: 12px 16px;
+ margin-bottom: 8px;
+
+ :global {
+ .dtm-textarea {
+ background: #fff;
+ border: none;
+ font-size: 15px;
+ }
+
+ .dtm-textarea-count {
+ text-align: right;
+ color: #999;
+ font-size: 12px;
+ margin-top: 8px;
+ }
+ }
+ }
+
+ &-file {
+ background: #fff;
+ border-radius: 4px;
+ padding: 12px 16px;
+ margin-bottom: 16px;
+
+ &-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ display: flex;
+ align-items: center;
+ margin-bottom: 8px;
+ }
+
+ &-icon {
+ font-size: 16px;
+ margin-right: 8px;
+ color: #1a6fb8;
+ }
+
+ &-desc {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 16px;
+ }
+
+ &-upload {
+ :global {
+ .dtm-upload {
+ padding: 0;
+ }
+
+ .dtm-upload-select {
+ width: 80px;
+ height: 80px;
+ border-radius: 4px;
+ border: 1px dashed #d9d9d9;
+ background-color: #fafafa;
+ }
+
+ .dtm-upload-list-item {
+ width: 80px;
+ height: 80px;
+ margin-right: 8px;
+ margin-bottom: 8px;
+ }
+
+ .dtm-upload-list-item-image {
+ border-radius: 4px;
+ }
+ }
+ }
+ }
+
+ &-footer {
+ padding: 12px;
+ border-top: 1px solid #eee;
+ background: #fff;
+ }
+
+ &-submit {
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ background: #1a6fb8;
+ color: #fff;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+
+ &-label {
+ font-size: 15px;
+ margin-bottom: 8px;
+ position: relative;
+
+ .required-mark {
+ color: #ff4d4f;
+ position: absolute;
+ left: -10px;
+ top: 0;
+ }
+ }
+}
+
+.addRecord-file-subtitle {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 14px;
+}
diff --git a/src/views/flow/applyClose/index.jsx b/src/views/flow/applyClose/index.jsx
new file mode 100644
index 0000000..be893be
--- /dev/null
+++ b/src/views/flow/applyClose/index.jsx
@@ -0,0 +1,382 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 18:40:00
+ * @LastEditTime: 2025-04-11 15:10:46
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 结案申请
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Button, TextareaItem } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import * as $$ from '../../../utils/utility';
+
+import { applyClose_1 } from '../../../assets/img';
+
+import NavBarPage from '../../../components/NavBarPage';
+import DingUpload from '../../../components/DingUpload';
+import './index.less';
+
+// 事项节点组件
+const TaskNode = ({ title, items }) => {
+ return (
+ <div className="task-node-container">
+ <div className="task-node-title">{title}</div>
+ <div className="task-node-content">
+ {items.map((item, index) => (
+ <div key={index} className="task-node-item">
+ <div className="task-node-item-dot"></div>
+ <div className="task-node-item-info">
+ <div className="task-node-item-title">{item.title}</div>
+ <div className="task-node-item-desc">{item.desc}</div>
+ <div className="task-node-item-time">{item.time}</div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ );
+};
+
+// 获取新ID接口
+function getNewTimeIdApi() {
+ return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
+}
+
+function windupApplyApi(data) {
+ return $$.ax.request({ url: `caseTask/windupApply`, type: 'post', service: 'mediate', data });
+}
+
+function saveVideoApi(data) {
+ return $$.ax.request({ url: `meetInfo/saveVideo`, type: 'post', service: 'mediate', data });
+}
+
+// ai分析是否为风险/重点案件
+function getRiskResultApi(data) {
+ return $$.ax.request({ urlAi: `case-law/getRiskResult`, data, typeAi: 'post', service: 'open' });
+}
+
+const ApplyClose = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const query = new URLSearchParams(location.search);
+ const caseId = query.get('caseId');
+ const caseTaskId = query.get('caseTaskId');
+
+ const [formData, setFormData] = useState({
+ resolveResult: '1', // 默认选择化解成功（1:成功 2:不成功）
+ agreementType: '1', // 默认选择书面协议（1:书面 2:口头）
+ windupContent: '', // 结案意见
+ solutionMeasures: '', // 调解过程中采取的措施及解决方案
+ failReason1: '', // 最终难以调和的原因
+ agreeContent: '', // 口头协议要点
+ });
+ const [fileList, setFileList] = useState([]); // 协议文书文件列表
+ const [newId, setNewId] = useState(''); // 用于文件上传的ID
+
+ async function fetchNewId() {
+ global.setSpinning(true);
+ const res = await getNewTimeIdApi();
+ global.setSpinning(false);
+ if (res.type) {
+ setNewId(res.data);
+ }
+ }
+ // 获取新ID
+ useEffect(() => {
+ fetchNewId();
+ }, []);
+
+ // 处理表单数据变化
+ const handleFormChange = (key, value) => {
+ setFormData({
+ ...formData,
+ [key]: value,
+ });
+ };
+
+ // 处理文件变化
+ const handleFileChange = (info) => {
+ setFileList(info.fileList);
+ };
+
+ // 提交申请
+ const handleSubmit = async () => {
+ // 化解成功时的验证
+ if (formData.resolveResult === '1') {
+ // 书面协议需要上传文书
+ if (formData.agreementType === '1' && fileList.length === 0) {
+ $$.showToast({ content: '请上传协议文书' });
+ return;
+ }
+ // 口头协议需要填写协议要点
+ else if (formData.agreementType === '2' && !formData.agreeContent) {
+ $$.showToast({ content: '请填写协议要点' });
+ return;
+ }
+ }
+ // 化解不成功时的额外验证
+ if (formData.resolveResult === '2') {
+ if (!formData.solutionMeasures) {
+ $$.showToast({ content: '请填写调解过程中采取的措施及解决方案' });
+ return;
+ }
+ if (!formData.failReason1) {
+ $$.showToast({ content: '请填写最终难以调和的原因' });
+ return;
+ }
+ formData.failReason = `1、${formData.solutionMeasures}；2、${formData.failReason1}。`;
+ }
+
+ // 表单验证
+ if (!formData.windupContent) {
+ $$.showToast({ content: '请填写结案意见' });
+ return;
+ }
+
+ // 如果化解不成功，则需要调用ai分析是否为风险/重点案件
+ if (formData.resolveResult === '2') {
+ const submitData = {
+ ...formData,
+ mediResultName: '化解不成功',
+ mediResult: '22_00025-2',
+ caseTaskId: caseTaskId,
+ id: newId,
+ caseId,
+ fileIds: fileList
+ .map((file) => file.response?.data?.id || file.id)
+ .filter(Boolean)
+ .join(','),
+ };
+
+ windupApply(submitData);
+ } else {
+ // 提交数据
+ const submitData = {
+ ...formData,
+ mediResultName: '化解成功',
+ mediResult: '22_00025-1',
+ agreeTypeName: formData.agreementType === '1' ? '书面协议' : '口头协议',
+ agreeType: formData.agreementType === '1' ? '24_00003-2' : '24_00003-1',
+ caseTaskId: caseTaskId,
+ id: newId,
+ caseId,
+ fileIds: fileList
+ .map((file) => file.response?.data?.id || file.id)
+ .filter(Boolean)
+ .join(','),
+ };
+ windupApply(submitData);
+ }
+ };
+
+ //结案申请请求
+ const windupApply = async (submitData) => {
+ const res = await windupApplyApi({
+ ...submitData,
+ });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ setTimeout(() => {
+ //返回两层这里可能需要修改
+ history.go(-2);
+ }, 1500);
+
+ saveVideo(caseId);
+ // getRiskResult({ caseId, caseText: submitData.windupContent || '' });
+ }
+ };
+
+ async function saveVideo(caseId) {
+ const res = await saveVideoApi({ caseId });
+ if (res.type) {
+ }
+ }
+
+ // ai分析是否为风险/重点案件
+ async function getRiskResult(data) {
+ const res = await getRiskResultApi(data);
+ if (res.type) {
+ }
+ }
+
+ return (
+ <NavBarPage title="结案申请">
+ <Scrollbars style={{ height: 'calc(100vh - 46px)' }}>
+ <div className="apply-close-container">
+ <div className="apply-close-section">
+ <div className="apply-close-title">化解结果</div>
+ <div className="apply-close-options">
+ <div className="rect-radio-group">
+ <div
+ className={`rect-radio-item ${formData.resolveResult === '1' ? 'active' : ''}`}
+ onClick={() => handleFormChange('resolveResult', '1')}
+ >
+ <span>化解成功</span>
+ {formData.resolveResult === '1' ? (
+ <img src={applyClose_1} className="rect-radio-check" alt="" />
+ ) : (
+ <div className="rect-radio-check empty-circle"></div>
+ )}
+ </div>
+ <div
+ className={`rect-radio-item ${formData.resolveResult === '2' ? 'active' : ''}`}
+ onClick={() => handleFormChange('resolveResult', '2')}
+ >
+ <span>化解不成功</span>
+ {formData.resolveResult === '2' ? (
+ <img src={applyClose_1} className="rect-radio-check circle-check" alt="" />
+ ) : (
+ <div className="rect-radio-check empty-circle"></div>
+ )}
+ </div>
+ </div>
+ </div>
+
+ {formData.resolveResult === '1' && (
+ <>
+ <div style={{ marginTop: '12px' }} className="apply-close-title">
+ 达成的协议类型
+ </div>
+ <div className="apply-close-options">
+ <div className="rect-radio-group">
+ <div
+ className={`rect-radio-item ${formData.agreementType === '1' ? 'active' : ''}`}
+ onClick={() => handleFormChange('agreementType', '1')}
+ >
+ <span>书面协议</span>
+ {formData.agreementType === '1' ? (
+ <img src={applyClose_1} className="rect-radio-check" alt="" />
+ ) : (
+ <div className="rect-radio-check empty-circle"></div>
+ )}
+ </div>
+ <div
+ className={`rect-radio-item ${formData.agreementType === '2' ? 'active' : ''}`}
+ onClick={() => handleFormChange('agreementType', '2')}
+ >
+ <span>口头协议</span>
+ {formData.agreementType === '2' ? (
+ <img src={applyClose_1} className="rect-radio-check circle-check" alt="" />
+ ) : (
+ <div className="rect-radio-check empty-circle"></div>
+ )}
+ </div>
+ </div>
+ </div>
+ </>
+ )}
+ </div>
+
+ {formData.resolveResult === '1' && (
+ <div className="apply-close-section">
+ {formData.agreementType === '1' ? (
+ <DingUpload
+ title="协议文书"
+ fileList={fileList}
+ onChange={handleFileChange}
+ ownerId={newId}
+ mainId={caseId || ''}
+ ownerType="22_00018-302" // 文件业务类型，代表结案协议
+ tipText="支持扩展名：.doc .docx .pdf .jpg，30M以内"
+ btnText="上传文件"
+ />
+ ) : (
+ <>
+ <div className="apply-close-title required-field">协议要点</div>
+ <div className="apply-close-textarea-wrapper">
+ <TextareaItem
+ placeholder="请填写口头协议的主要内容和要点"
+ value={formData.agreeContent}
+ onChange={(value) => handleFormChange('agreeContent', value)}
+ rows={4}
+ />
+ </div>
+ </>
+ )}
+ </div>
+ )}
+
+ {formData.resolveResult === '2' && (
+ <>
+ <div className="apply-close-section">
+ <div className="apply-close-title required-field">调解过程中采取的措施及解决方案</div>
+ <div className="apply-close-textarea-wrapper">
+ <TextareaItem
+ placeholder="如提出的纠纷化解建议、思路等"
+ value={formData.solutionMeasures}
+ onChange={(value) => handleFormChange('solutionMeasures', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+
+ <div className="apply-close-section">
+ <div className="apply-close-title required-field">最终难以调和的原因</div>
+ <div className="apply-close-textarea-wrapper">
+ <TextareaItem
+ placeholder="如说明利益分配不均、信任缺失、土地或立场不一致等具体情况"
+ value={formData.failReason1}
+ onChange={(value) => handleFormChange('failReason1', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+ </>
+ )}
+
+ <div className="apply-close-section">
+ <div className="apply-close-title required-field">结案意见</div>
+ <div className="apply-close-textarea-wrapper">
+ <TextareaItem
+ placeholder="请填写"
+ value={formData.windupContent}
+ onChange={(value) => handleFormChange('windupContent', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+ </div>
+ </Scrollbars>
+
+ {/* 添加事项节点 */}
+ <div className="apply-close-section task-node-section">
+ <TaskNode
+ title="事项节点"
+ items={[
+ {
+ title: "当事人沟通",
+ desc: "已完成",
+ time: "2025-04-08 10:30"
+ },
+ {
+ title: "材料收集",
+ desc: "已完成",
+ time: "2025-04-09 14:15"
+ },
+ {
+ title: "现场调查",
+ desc: "已完成",
+ time: "2025-04-10 09:45"
+ },
+ {
+ title: "调解会议",
+ desc: "进行中",
+ time: "2025-04-11 11:00"
+ }
+ ]}
+ />
+ </div>
+
+ <div className="apply-close-bottom">
+ <Button type="primary" block onClick={handleSubmit}>
+ 提交
+ </Button>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default ApplyClose;
diff --git a/src/views/flow/applyClose/index.less b/src/views/flow/applyClose/index.less
new file mode 100644
index 0000000..f74cf29
--- /dev/null
+++ b/src/views/flow/applyClose/index.less
@@ -0,0 +1,324 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 18:40:00
+ * @LastEditTime: 2025-04-11 11:37:02
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 结案申请样式
+ */
+
+.apply-close-container {
+ background-color: #f5f5f5;
+ padding-bottom: 72px;
+}
+
+.apply-close-section {
+ margin-bottom: 8px;
+ background-color: #fff;
+ padding: 16px;
+}
+
+.apply-close-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 8px;
+ position: relative;
+
+ // 必填标记样式
+ &.required-field {
+ position: relative;
+ padding-left: 0;
+
+ &::before {
+ content: '*';
+ color: #f5222d;
+ position: absolute;
+ left: -10px;
+ top: 0;
+ }
+ }
+}
+
+.apply-close-options {
+ .apply-close-radio-row {
+ display: flex;
+ flex-wrap: wrap;
+ }
+
+ .apply-close-radio {
+ margin-right: 32px;
+ margin-bottom: 8px;
+
+ :global {
+ .ddm-radio-wrapper {
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+
+ .apply-close-radio-text {
+ margin-left: 8px;
+ font-size: 15px;
+ color: #333;
+ }
+
+ // 自定义单选组件样式
+ .custom-radio-group {
+ display: flex;
+ flex-wrap: wrap;
+ }
+
+ .custom-radio-item {
+ display: flex;
+ align-items: center;
+ margin-right: 32px;
+ margin-bottom: 8px;
+ cursor: pointer;
+
+ &.active {
+ .custom-radio-icon {
+ border-color: #1a6fb8;
+ }
+
+ .custom-radio-text {
+ color: #1a6fb8;
+ }
+ }
+ }
+
+ .custom-radio-icon {
+ width: 18px;
+ height: 18px;
+ border: 1px solid #ddd;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-right: 8px;
+ }
+
+ .custom-radio-empty {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ border: 1px solid rgba(23, 26, 29, 0.24);
+ }
+
+ .custom-radio-dot {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ background-color: #1a6fb8;
+ }
+
+ .custom-radio-text {
+ font-size: 15px;
+ color: #333;
+ }
+
+ // 矩形单选按钮样式
+ .rect-radio-group {
+ display: flex;
+ justify-content: space-between;
+ flex-wrap: nowrap;
+ width: 100%;
+ }
+
+ .rect-radio-item {
+ position: relative;
+ width: 48%;
+ height: 37px;
+ border: 1px solid #f2f3f5;
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #f2f3f5;
+ cursor: pointer;
+ gap: 8px;
+
+ span {
+ font-size: 15px;
+ color: #333;
+ }
+
+ &.active {
+ border-color: #1a6fb8;
+
+ span {
+ color: #1a6fb8;
+ }
+ }
+
+ .rect-radio-check {
+ width: 18px;
+ height: 18px;
+ color: #fff;
+ font-size: 12px;
+ font-weight: bold;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+
+ &.empty-circle {
+ border: 1px solid rgba(23, 26, 29, 0.24);
+ background-color: transparent;
+ }
+ }
+
+ .circle-check {
+ background-color: transparent;
+ border: 1px solid #ccc;
+ color: transparent;
+ }
+ }
+}
+
+.apply-close-upload {
+ margin-top: 8px;
+
+ :global {
+ .ding-upload-container {
+ padding: 0;
+ }
+ }
+}
+
+.apply-close-textarea-wrapper {
+ position: relative;
+ margin-bottom: 15px;
+}
+
+.apply-close-textarea {
+ width: 100%;
+ height: 120px;
+ border: 1px solid #e8e8e8;
+ border-radius: 4px;
+ padding: 12px;
+ font-size: 15px;
+ color: #333;
+ resize: none;
+}
+
+.apply-close-tools {
+ display: flex;
+ flex-wrap: wrap;
+ margin-top: 16px;
+
+ .apply-close-tool-item {
+ display: flex;
+ align-items: center;
+ margin-right: 24px;
+ margin-bottom: 8px;
+ cursor: pointer;
+
+ .tool-icon {
+ width: 20px;
+ height: 20px;
+ margin-right: 4px;
+ display: inline-block;
+ background-size: contain;
+ background-repeat: no-repeat;
+ background-position: center;
+ }
+
+ .identify-icon {
+ background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTEyIDJDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bTEgMTVoLTJ2LTJoMnYyem0wLTRoLTJWN2gydjZ6IiBmaWxsPSIjMUE2RkI4Ii8+PC9zdmc+');
+ }
+
+ .template-icon {
+ background-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCI+PHBhdGggZD0iTTE0IDJINmMtMS4xIDAtMiAuOS0yIDJ2MTZjMCAxLjEuOSAyIDIgMmgxMmMxLjEgMCAyLS45IDItMlY4bC02LTZ6bTQgMThjMCAuNTUtLjQ1IDEtMSAxSDdjLS41NSAwLTEtLjQ1LTEtMVY0YzAtLjU1LjQ1LTEgMS0xaDYuNzlMMTggOC4yMVYyMHptLTcuMjEtM2gtMi41MnYyLjUyaDIuNTJ2LTIuNTJ6TTExIDloLTIuNXY1LjVIMTFWOXptNS41MiAxMS41MmgtMi41MlYxOGgyLjUydjIuNTJ6TTE1IDRWOS41aDUuNUwxNSA0eiIgZmlsbD0iIzFBNkZCOCIvPjwvc3ZnPg==');
+ }
+
+ span {
+ font-size: 14px;
+ color: #1a6fb8;
+ }
+ }
+}
+
+.apply-close-bottom {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 12px 16px;
+ background-color: #fff;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
+}
+
+/* 事项节点样式 */
+.task-node-section {
+ margin-bottom: 72px;
+}
+
+.task-node-container {
+ width: 100%;
+}
+
+.task-node-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 16px;
+}
+
+.task-node-content {
+ position: relative;
+}
+
+.task-node-item {
+ display: flex;
+ position: relative;
+ padding-bottom: 20px;
+
+ &:last-child {
+ padding-bottom: 0;
+ }
+
+ &:not(:last-child)::before {
+ content: '';
+ position: absolute;
+ top: 8px;
+ left: 4px;
+ width: 1px;
+ height: calc(100% - 8px);
+ background-color: #e5e5e5;
+ }
+}
+
+.task-node-item-dot {
+ width: 10px;
+ height: 10px;
+ border-radius: 50%;
+ background-color: #1a6fb8;
+ margin-right: 12px;
+ margin-top: 4px;
+ flex-shrink: 0;
+}
+
+.task-node-item-info {
+ flex: 1;
+}
+
+.task-node-item-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+}
+
+.task-node-item-desc {
+ font-size: 13px;
+ color: #1a6fb8;
+ margin-bottom: 4px;
+}
+
+.task-node-item-time {
+ font-size: 12px;
+ color: #999;
+}
\ No newline at end of file
diff --git a/src/views/flow/component/bysl/index.jsx b/src/views/flow/component/bysl/index.jsx
new file mode 100644
index 0000000..958097a
--- /dev/null
+++ b/src/views/flow/component/bysl/index.jsx
@@ -0,0 +1,125 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2024-04-08
+ * @LastEditTime: 2025-05-20 16:10:39
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 档案信息组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Avatar, Upload, Button } from 'dingtalk-design-mobile';
+import InfoView from './../../../../components/InfoView';
+import MyModal from './../../../../components/MyModal';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+const appUrl = $$.appUrl;
+export const Bysl = (props) => {
+ const [data, setData] = useState({});
+ const [modalImg, setModalImg] = useState({ visible: false, url: '' });
+
+ const onPreview = async (file) => {
+ const src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ window.open(src);
+ // if (file.cat === '22_00017-6') {
+ // // 文件预览
+ // } else {
+ // // 图片文件，使用模态框预览
+ // setModalImg({ visible: true, url: src });
+ // }
+ };
+
+ useEffect(() => {
+ const applyData = props.data?.fakeData?.filter((item) => item.perType === '15_020008-1' || item.perType === '24_00006-1');
+ const appliedData = props.data?.fakeData?.filter((item) => item.perType === '15_020008-2' || item.perType === '24_00006-2');
+
+ setData({
+ ...props.data,
+ applyData,
+ appliedData,
+ });
+ }, [props.data]);
+
+ // 渲染上传组件
+ const renderUpload = (ownerType) => {
+ const fileList = data.fileInfoList || [];
+
+ return fileList.length > 0 ? (
+ <>
+ <Upload
+ label=""
+ disabled
+ onPreview={onPreview}
+ fileList={fileList}
+ type="form-upload"
+ accept="*"
+ previewContent="预览"
+ showUploadList={{
+ showRemoveIcon: false,
+ showUploadBtn: false,
+ }}
+ className="bysl-upload-preview-only"
+ />
+ <MyModal visible={modalImg.visible} center title="查看图片" onClose={() => setModalImg({ visible: false, url: '' })}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <img src={modalImg.url} alt="" style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
+ </div>
+ </MyModal>
+ </>
+ ) : (
+ '-'
+ );
+ };
+
+ return (
+ <div className="bysl">
+ <div className="bysl-info">
+ <InfoView
+ showButtons={false}
+ OnClick={() => {
+ console.log('点击编辑');
+ }}
+ list={[
+ {
+ type: 'text',
+ title: '不予受理部门',
+ key: '-',
+ },
+ {
+ type: 'diy',
+ title: '不予受理时间',
+ value: <div className="bysl-info-time">{data.visitTime || '-'}</div>,
+ },
+ {
+ type: 'diy',
+ title: '操作人',
+ value: <div className="bysl-info-time">{data.handleUserName} {data.mobile || ''}</div>,
+ },
+ {
+ type: 'text',
+ title: '不予受理理由',
+ value: 'disContent',
+ paddingBottom: true,
+ },
+ {
+ type: 'divider',
+ },
+ {
+ type: 'diy',
+ title: '附件材料',
+ value: <div className="bysl-info-apply-material">{renderUpload()}</div>,
+ },
+ {
+ type: 'divider',
+ },
+ ]}
+ data={data || {}}
+ />
+ </div>
+ </div>
+ );
+};
+
+export default Bysl;
diff --git a/src/views/flow/component/bysl/index.less b/src/views/flow/component/bysl/index.less
new file mode 100644
index 0000000..6dde79d
--- /dev/null
+++ b/src/views/flow/component/bysl/index.less
@@ -0,0 +1,145 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.bysl {
+ &-card {
+ padding: 12px;
+ background: @common_bg_z1_color;
+ border-radius: 8px;
+ }
+
+ &-userInfo {
+ display: flex;
+ align-items: center;
+ // margin-bottom: 16px;
+ }
+
+ &-avatar {
+ margin-right: 12px;
+ background: #3491fa;
+ border-radius: 4px;
+ height: 48px;
+ width: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #fff;
+ font-size: 14px;
+ &-applied {
+ margin-right: 12px;
+ background: #ef6c24;
+ border-radius: 4px;
+ line-height: 20px;
+ height: 48px;
+ width: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #fff;
+ font-size: 14px;
+ }
+ }
+
+ &-info {
+ flex: 1;
+ &-status-blue {
+ background: #e8f3ff;
+ color: #1a6fb8;
+ width: 56px;
+ border-radius: 2px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 28px;
+ }
+ &-apply-material {
+ margin-top: 8px;
+ & .dtm-upload-select {
+ display: none;
+ }
+ }
+ }
+
+ &-name {
+ font-size: 14px;
+ font-weight: 500;
+ color: @common_level1_base_color;
+ line-height: 24px;
+ }
+
+ &-id {
+ font-size: 12px;
+ color: @common_level2_base_color;
+ line-height: 20px;
+ margin-top: 4px;
+ }
+
+ &-arrow {
+ color: @common_level3_base_color;
+ font-size: 16px;
+ }
+
+ // 虚线
+ &-line {
+ width: 100%;
+ border-top: 1px dashed #f0f0f0;
+ margin: 8px 0;
+ }
+
+ &-tags {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ }
+
+ &-tag {
+ padding: 4px 8px;
+ border-radius: 4px;
+ font-size: 12px;
+ line-height: 1;
+
+ &-purple {
+ background: #f5f0ff;
+ color: #722ed1;
+ }
+
+ &-green {
+ background: #f6ffed;
+ color: #52c41a;
+ }
+
+ &-orange {
+ background: #fff7e6;
+ color: #fa8c16;
+ }
+
+ &-pink {
+ background: #fff0f6;
+ color: #eb2f96;
+ }
+
+ &-blue {
+ background: #e6f7ff;
+ color: #1A6FB8;
+ }
+
+ &-cyan {
+ background: #e6fffb;
+ color: #13c2c2;
+ }
+
+ &-blue-light {
+ background: #f0f5ff;
+ color: #2f54eb;
+ }
+
+ &-purple-light {
+ background: #f9f0ff;
+ color: #9254de;
+ }
+
+ &-red {
+ background: #fff1f0;
+ color: #f5222d;
+ }
+ }
+}
diff --git a/src/views/flow/component/caseDetail/index.jsx b/src/views/flow/component/caseDetail/index.jsx
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/views/flow/component/caseDetail/index.jsx
diff --git a/src/views/flow/component/daxx/index.jsx b/src/views/flow/component/daxx/index.jsx
new file mode 100644
index 0000000..566d68d
--- /dev/null
+++ b/src/views/flow/component/daxx/index.jsx
@@ -0,0 +1,224 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2024-04-08
+ * @LastEditTime: 2025-05-12 15:48:53
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 档案信息组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Avatar, Upload, Button } from 'dingtalk-design-mobile';
+import { ApplyDialog, Applied } from './previewTable';
+import InfoView from './../../../../components/InfoView';
+import MyModal from './../../../../components/MyModal';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+const appUrl = $$.appUrl;
+export const Daxx = (props) => {
+ const [data, setData] = useState({});
+ const [modalImg, setModalImg] = useState({ visible: false, url: '' });
+
+ const onPreview = async (file) => {
+ const src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ window.open(src);
+ // if (file.cat === '22_00017-6') {
+ // // 文件预览
+ // } else {
+ // // 图片文件，使用模态框预览
+ // setModalImg({ visible: true, url: src });
+ // }
+ };
+
+ useEffect(() => {
+ const applyData = props.data?.fakeData?.filter((item) => item.perType === '15_020008-1' || item.perType === '24_00006-1');
+ const appliedData = props.data?.fakeData?.filter((item) => item.perType === '15_020008-2' || item.perType === '24_00006-2');
+
+ setData({
+ ...props.data,
+ applyData,
+ appliedData,
+ });
+ }, [props.data]);
+
+ // 渲染上传组件
+ const renderUpload = (ownerType) => {
+ const fileList = data.fileInfoList?.filter((item) => item.ownerType === ownerType)?.[0]?.fileList || [];
+
+ return fileList.length > 0 ? (
+ <>
+ <Upload
+ label=""
+ disabled
+ onPreview={onPreview}
+ fileList={fileList}
+ type="form-upload"
+ accept="*"
+ previewContent="预览"
+ showUploadList={{
+ showRemoveIcon: false,
+ showUploadBtn: false,
+ }}
+ className="daxx-upload-preview-only"
+ />
+ <MyModal visible={modalImg.visible} center title="查看图片" onClose={() => setModalImg({ visible: false, url: '' })}>
+ <div style={{ height: '1px', width: '100%', backgroundColor: 'rgba(126, 134, 142, 0.16)' }}></div>
+ <div style={{ height: '300px' }}>
+ <img src={modalImg.url} alt="" style={{ width: '100%', height: '100%', objectFit: 'contain' }} />
+ </div>
+ </MyModal>
+ </>
+ ) : (
+ '-'
+ );
+ };
+
+ return (
+ <div className="daxx">
+ {/* 申请人 &代理人*/}
+ {data.applyData && data.applyData.length > 0 && <ApplyDialog data={data.applyData} />}
+ {/* 被申请人 */}
+ {data.appliedData && data.appliedData.length > 0 && <Applied data={data.appliedData} />}
+
+ <div className="daxx-info">
+ <div className="public-space"></div>
+ <InfoView
+ showButtons={false}
+ OnClick={() => {
+ console.log('点击编辑');
+ }}
+ list={[
+ {
+ type: 'text',
+ title: '事项标签',
+ key: '-',
+ },
+ {
+ type: 'diy',
+ title: '事项状态',
+ value: <div className="daxx-info-status-blue">{data.statusName || '-'}</div>,
+ },
+ {
+ type: 'text',
+ title: '事项来源',
+ value: 'canalName',
+ },
+ data.canal === '22_00001-1' && {
+ type: 'diy',
+ title: '来访时间',
+ value: <div className="daxx-info-time">{data.visitTime || '-'}</div>,
+ },
+ data.canal === '22_00001-1' && {
+ type: 'text',
+ title: '来访人数（人）',
+ value: 'visitPeopleNum',
+ },
+ data.canal === '22_00001-1' && {
+ type: 'text',
+ title: '来访形式',
+ key: <span>来访</span>,
+ },
+ data.canal === '22_00001-3' && {
+ type: 'text',
+ title: '来访形式',
+ key: <span>排查</span>,
+ },
+ {
+ type: 'text',
+ title: '事项编号',
+ value: 'caseRef',
+ },
+ {
+ type: 'text',
+ title: '事项等级',
+ key: <span>{data.caseLevel === 1 ? '一级' : data.caseLevel === 2 ? '二级' : data.caseLevel === 3 ? '三级' : '-'}</span>,
+ },
+ {
+ type: 'text',
+ title: '纠纷类型',
+ key: <span>{data?.caseTypeFirstName ? `${data.caseTypeFirstName}/${data.caseTypeName}` : '-'}</span>,
+ },
+ {
+ type: 'text',
+ title: '纠纷发生时间',
+ key: <span>{data.occurTime ? $$.myTimeFormat(data.occurTime, 'YYYY-M-D HH:mm') : '-'}</span>,
+ },
+ {
+ type: 'text',
+ title: '纠纷发生地点',
+ value: 'addr',
+ },
+ {
+ type: 'text',
+ title: '问题属地',
+ key: <span>{data?.queAreaName ? `${data.queAreaName}/${data.queRoadName}` : '-'}</span>,
+ },
+ {
+ type: 'text',
+ title: '涉及人数（人）',
+ value: 'peopleNum',
+ },
+ {
+ type: 'text',
+ title: '涉及金额',
+ value: 'amount',
+ },
+ {
+ type: 'text',
+ title: '事项概况',
+ value: 'caseDes',
+ },
+ {
+ type: 'text',
+ title: '事项申请',
+ value: 'caseClaim',
+ paddingBottom: '12px',
+ },
+ {
+ type: 'divider',
+ },
+ {
+ type: 'diy',
+ title: '申请材料',
+ value: <div className="daxx-info-apply-material">{renderUpload('22_00018-101')}</div>,
+ },
+ {
+ type: 'divider',
+ },
+ {
+ type: 'diy',
+ title: '证明材料',
+ value: <div className="daxx-info-apply-material">{renderUpload('22_00018-102')}</div>,
+ },
+ {
+ type: 'divider',
+ },
+ {
+ type: 'text',
+ title: '登记机构',
+ value: 'inputUnitName',
+ },
+ {
+ type: 'text',
+ title: '登记人',
+ value: 'inputUserName',
+ },
+ {
+ type: 'text',
+ title: '登记时间',
+ paddingBottom: true,
+ key: <span>{data.createTime ? $$.myTimeFormat(data.createTime, 'YYYY-M-D HH:mm') : '-'}</span>,
+ },
+ {
+ type: 'divider',
+ },
+ ]}
+ data={data || {}}
+ />
+ </div>
+ </div>
+ );
+};
+
+export default Daxx;
diff --git a/src/views/flow/component/daxx/index.less b/src/views/flow/component/daxx/index.less
new file mode 100644
index 0000000..04cb206
--- /dev/null
+++ b/src/views/flow/component/daxx/index.less
@@ -0,0 +1,145 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.daxx {
+ &-card {
+ padding: 12px;
+ background: @common_bg_z1_color;
+ border-radius: 8px;
+ }
+
+ &-userInfo {
+ display: flex;
+ align-items: center;
+ // margin-bottom: 16px;
+ }
+
+ &-avatar {
+ margin-right: 12px;
+ background: #3491fa;
+ border-radius: 4px;
+ height: 48px;
+ width: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #fff;
+ font-size: 14px;
+ &-applied {
+ margin-right: 12px;
+ background: #ef6c24;
+ border-radius: 4px;
+ line-height: 20px;
+ height: 48px;
+ width: 48px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #fff;
+ font-size: 14px;
+ }
+ }
+
+ &-info {
+ flex: 1;
+ &-status-blue {
+ background: #e8f3ff;
+ color: #1a6fb8;
+ width: 56px;
+ border-radius: 2px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 28px;
+ }
+ &-apply-material {
+ margin-top: 8px;
+ & .dtm-upload-select {
+ display: none;
+ }
+ }
+ }
+
+ &-name {
+ font-size: 14px;
+ font-weight: 500;
+ color: @common_level1_base_color;
+ line-height: 24px;
+ }
+
+ &-id {
+ font-size: 12px;
+ color: @common_level2_base_color;
+ line-height: 20px;
+ margin-top: 4px;
+ }
+
+ &-arrow {
+ color: @common_level3_base_color;
+ font-size: 16px;
+ }
+
+ // 虚线
+ &-line {
+ width: 100%;
+ border-top: 1px dashed #f0f0f0;
+ margin: 8px 0;
+ }
+
+ &-tags {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ }
+
+ &-tag {
+ padding: 4px 8px;
+ border-radius: 4px;
+ font-size: 12px;
+ line-height: 1;
+
+ &-purple {
+ background: #f5f0ff;
+ color: #722ed1;
+ }
+
+ &-green {
+ background: #f6ffed;
+ color: #52c41a;
+ }
+
+ &-orange {
+ background: #fff7e6;
+ color: #fa8c16;
+ }
+
+ &-pink {
+ background: #fff0f6;
+ color: #eb2f96;
+ }
+
+ &-blue {
+ background: #e6f7ff;
+ color: #1A6FB8;
+ }
+
+ &-cyan {
+ background: #e6fffb;
+ color: #13c2c2;
+ }
+
+ &-blue-light {
+ background: #f0f5ff;
+ color: #2f54eb;
+ }
+
+ &-purple-light {
+ background: #f9f0ff;
+ color: #9254de;
+ }
+
+ &-red {
+ background: #fff1f0;
+ color: #f5222d;
+ }
+ }
+}
diff --git a/src/views/flow/component/daxx/previewTable.jsx b/src/views/flow/component/daxx/previewTable.jsx
new file mode 100644
index 0000000..f99af5d
--- /dev/null
+++ b/src/views/flow/component/daxx/previewTable.jsx
@@ -0,0 +1,108 @@
+// 申请人、申请人代理人、被申请人、被申请人代理人
+
+import React from 'react';
+import { RightArrow2Outlined } from 'dd-icons';
+
+const ApplyDialog = ({ data, handleCheckPreview, modalClick }) => {
+ return (
+ <>
+ {data?.map((item, index) => (
+ <div key={index}>
+ <div className="public-space"></div>
+ <div className="daxx-card">
+ <div className="daxx-userInfo">
+ <div className="daxx-avatar">申请方</div>
+ <div className="daxx-info">
+ <div className="daxx-name">
+ {item.trueName} {item.mobile}
+ {item.perType === '24_00006-1' && <span className="daxx-tag daxx-tag-blue">代理人</span>}
+ </div>
+ {item.perType === '24_00006-1' ? (
+ <div className="daxx-id">
+ 代理对象 | {'[人名]'} | {item.certiNo}
+ </div>
+ ) : (
+ <div className="daxx-id">
+ {item.perClassName} | {item.certiNo}
+ </div>
+ )}
+ </div>
+ <div className="daxx-arrow">
+ <RightArrow2Outlined />
+ </div>
+ </div>
+ {/* <div className="daxx-line-box">
+ <div className="daxx-line"></div>
+ <div className="daxx-tags">
+ <span className="daxx-tag daxx-tag-purple">精</span>
+ <span className="daxx-tag daxx-tag-green">流</span>
+ <span className="daxx-tag daxx-tag-orange">重</span>
+ <span className="daxx-tag daxx-tag-pink">统</span>
+ <span className="daxx-tag daxx-tag-blue">刑</span>
+ <span className="daxx-tag daxx-tag-cyan">少</span>
+ <span className="daxx-tag daxx-tag-blue-light">潜</span>
+ <span className="daxx-tag daxx-tag-purple-light">涉</span>
+ <span className="daxx-tag daxx-tag-red">极</span>
+ </div>
+ </div> */}
+ </div>
+ </div>
+ ))}
+ </>
+ );
+};
+
+const Applied = ({ data }) => {
+ return (
+ <>
+ {data?.map((item, index) => (
+ <div key={index}>
+ <div className="public-space"></div>
+ <div className="daxx-card">
+ <div className="daxx-userInfo">
+ <div className="daxx-avatar-applied">
+ 被申
+ <br />
+ 请方
+ </div>
+ <div className="daxx-info">
+ <div className="daxx-name">
+ {item.trueName} {item.mobile}
+ {item.perType === '24_00006-2' && <span className="daxx-tag daxx-tag-orange">代理人</span>}
+ </div>
+ {item.perType === '24_00006-2' ? (
+ <div className="daxx-id">
+ 代理对象 | {'[人名]'} | {item.certiNo}
+ </div>
+ ) : (
+ <div className="daxx-id">
+ {item.perClassName} | {item.certiNo}
+ </div>
+ )}
+ </div>
+ <div className="daxx-arrow">
+ <RightArrow2Outlined />
+ </div>
+ </div>
+ {/* <div className="daxx-line-box">
+ <div className="daxx-line"></div>
+ <div className="daxx-tags">
+ <span className="daxx-tag daxx-tag-purple">精</span>
+ <span className="daxx-tag daxx-tag-green">流</span>
+ <span className="daxx-tag daxx-tag-orange">重</span>
+ <span className="daxx-tag daxx-tag-pink">统</span>
+ <span className="daxx-tag daxx-tag-blue">刑</span>
+ <span className="daxx-tag daxx-tag-cyan">少</span>
+ <span className="daxx-tag daxx-tag-blue-light">潜</span>
+ <span className="daxx-tag daxx-tag-purple-light">涉</span>
+ <span className="daxx-tag daxx-tag-red">极</span>
+ </div>
+ </div> */}
+ </div>
+ </div>
+ ))}
+ </>
+ );
+};
+
+export { ApplyDialog, Applied };
diff --git a/src/views/flow/component/dbcb/index.jsx b/src/views/flow/component/dbcb/index.jsx
new file mode 100644
index 0000000..65aa3c0
--- /dev/null
+++ b/src/views/flow/component/dbcb/index.jsx
@@ -0,0 +1,960 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-08 09:28:00
+ * @LastEditTime: 2025-04-15 11:12:35
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 督办催办组件
+ */
+import React, { useState, useEffect, useRef } from 'react';
+import { useLocation, useHistory } from 'react-router-dom';
+import { Tabs, Badge, Button, Modal, Empty, Toast, PullToRefresh } from 'dingtalk-design-mobile';
+import { cbdb_1,caseQuery_2 } from '../../../../assets/img';
+import { Scrollbars } from 'react-custom-scrollbars';
+import * as $$ from '../../../../utils/utility';
+import DingUpload from '../../../../components/DingUpload';
+import './index.less';
+
+// 获取督办列表数据API
+function getSuperviseListApi(caseId, supStatus, page = 1, size = 10, type = 0) {
+ return $$.ax.request({
+ url: `caseSupervise/pageCaseSupervise?page=${page}&size=${size}&caseId=${caseId}&supStatus=${supStatus}&type=${type}`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 获取未回复督办数量API
+function getUnreadSuperviseCountApi(caseId) {
+ return $$.ax.request({
+ url: `caseSupervise/pageCaseSupervise?page=1&size=1&caseId=${caseId}&supStatus=0&type=1`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 获取未回复催办数量API
+function getUnreadUrgingCountApi(caseId) {
+ return $$.ax.request({
+ url: `caseUrging/pageQuery?page=1&size=1&caseId=${caseId}&urgingStatus=0`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 获取催办列表API
+function getUrgingListApi(caseId, urgingStatus, page = 1, size = 10) {
+ // 使用新的催办列表接口
+ return $$.ax.request({
+ url: `caseUrging/pageQuery?page=${page}&size=${size}&caseId=${caseId}&urgingStatus=${urgingStatus}`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 日期格式化函数
+function formatDateTime(dateString) {
+ if (!dateString) return '';
+
+ try {
+ let date;
+ if (dateString.includes('T')) {
+ // ISO格式: 2025-04-09T17:14:00
+ date = new Date(dateString);
+ } else if (dateString.includes('-')) {
+ // 普通格式: 2025-04-09 17:14
+ const [datePart, timePart] = dateString.split(' ');
+ const [year, month, day] = datePart.split('-');
+ const [hour, minute] = timePart.split(':');
+ date = new Date(year, parseInt(month) - 1, day, hour, minute);
+ } else {
+ return dateString;
+ }
+
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ const hours = String(date.getHours()).padStart(2, '0');
+ const minutes = String(date.getMinutes()).padStart(2, '0');
+
+ return `${year}-${month}-${day} ${hours}:${minutes}`;
+ } catch (error) {
+ console.error('日期格式化出错', error);
+ return dateString;
+ }
+}
+
+// 回复督办API
+function replyCaseSuperviseApi(data) {
+ return $$.ax.request({
+ url: 'caseSupervise/replyCaseSupervise',
+ type: 'post',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 回复催办API
+function replyCaseUrgingApi(data) {
+ return $$.ax
+ .request({
+ url: 'caseUrging/replyCaseUrging',
+ type: 'post',
+ data,
+ service: 'mediate',
+ })
+ .catch((error) => {
+ console.error('催办回复API调用失败', error);
+ // 返回一个标准格式的错误响应，避免后续处理时出错
+ return { type: false, message: '网络异常，请稍后再试', code: -1 };
+ });
+}
+
+const Dbcb = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const caseId = $$.getQueryString('caseId');
+ const scrollbarsRef = useRef(null);
+
+ const [activeType, setActiveType] = useState('supervision'); // 'supervision'督办 或 'urging'催办
+ const [activeStatus, setActiveStatus] = useState('unread'); // 'unread'未回复(0) 或 'read'已回复(1)
+ const [detailVisible, setDetailVisible] = useState(false);
+ const [currentDetail, setCurrentDetail] = useState(null);
+ const [currentItem, setCurrentItem] = useState(null);
+
+ // 回复相关状态
+ const [replyVisible, setReplyVisible] = useState(false);
+ const [replyContent, setReplyContent] = useState('');
+ const [attachments, setAttachments] = useState([]);
+
+ // 分页数据
+ const [supervisionList, setSupervisionList] = useState([]);
+ const [urgingList, setUrgingList] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [refreshing, setRefreshing] = useState(false);
+ const [hasMore, setHasMore] = useState(true);
+ const [page, setPage] = useState(1);
+ const [totalCount, setTotalCount] = useState(0);
+ const [totalPages, setTotalPages] = useState(1);
+ const [unreadSuperviseCount, setUnreadSuperviseCount] = useState(0);
+ const [unreadUrgingCount, setUnreadUrgingCount] = useState(0);
+ const isInitialMount = useRef(true);
+
+ // 初始化加载数据和未回复督办数量
+ useEffect(() => {
+ if (caseId) {
+ // 首次加载时，仅获取一次未回复督办数量和当前状态的列表数据
+ fetchData(1);
+ // fetchUnreadSuperviseCount();
+ // fetchUnreadUrgingCount();
+ isInitialMount.current = false;
+ }
+ }, [caseId]);
+
+ // 切换标签时加载对应的数据
+ useEffect(() => {
+ // 跳过首次加载，避免重复请求
+ if (!isInitialMount.current && caseId) {
+ fetchData(1);
+ }
+ }, [activeStatus]);
+
+ // 点击督办按钮时，重新获取未回复督办数量
+ useEffect(() => {
+ // 跳过首次加载，避免重复请求
+ if (!isInitialMount.current && caseId) {
+ if (activeType === 'supervision') {
+ fetchUnreadSuperviseCount();
+ } else {
+ fetchUnreadUrgingCount();
+ }
+ // 切换督办/催办时，重新加载列表数据
+ fetchData(1);
+ }
+ }, [activeType]);
+
+ // 获取未回复督办数量
+ const fetchUnreadSuperviseCount = async () => {
+ if (!caseId) return;
+
+ try {
+ const res = await getUnreadSuperviseCountApi(caseId);
+ if (res.type) {
+ setUnreadSuperviseCount(res.data.totalElements || 0);
+ }
+ } catch (error) {
+ console.error('获取未回复督办数量失败', error);
+ }
+ };
+
+ // 获取未回复催办数量
+ const fetchUnreadUrgingCount = async () => {
+ if (!caseId) return;
+
+ try {
+ const res = await getUnreadUrgingCountApi(caseId);
+ if (res.type) {
+ setUnreadUrgingCount(res.data.totalElements || 0);
+ }
+ } catch (error) {
+ console.error('获取未回复催办数量失败', error);
+ }
+ };
+
+ // 获取数据
+ const fetchData = async (currentPage, preservePosition = false) => {
+ if (!caseId) return;
+
+ if (!preservePosition) {
+ setLoading(true);
+ } else {
+ // 记录当前滚动位置
+ const currentScrollTop = scrollbarsRef.current?.getScrollTop() || 0;
+ setLoading(true);
+
+ // 数据加载后恢复滚动位置
+ const restoreScrollPosition = () => {
+ if (scrollbarsRef.current) {
+ setTimeout(() => {
+ scrollbarsRef.current.scrollTop(currentScrollTop);
+ }, 0);
+ }
+ };
+
+ // 使用Promise.finally来确保在数据加载后恢复滚动位置
+ setTimeout(() => restoreScrollPosition(), 100);
+ }
+
+ try {
+ const supStatus = activeStatus === 'unread' ? 0 : 1;
+ let res;
+
+ if (activeType === 'supervision') {
+ res = await getSuperviseListApi(caseId, supStatus, currentPage, 10, 1);
+ } else {
+ res = await getUrgingListApi(caseId, supStatus, currentPage, 10);
+ }
+
+ if (res.type) {
+ const { content, totalElements, totalPages, last } = res.data;
+
+ // 确保返回的数据不为空
+ const dataList = content || [];
+
+ if (currentPage === 1) {
+ // 第一页数据，直接设置
+ if (activeType === 'supervision') {
+ setSupervisionList(dataList);
+ } else {
+ setUrgingList(dataList);
+ }
+ } else {
+ // 加载更多数据，需要过滤掉已有的数据
+ if (activeType === 'supervision') {
+ // 获取已有数据的ID集合
+ const existingIds = new Set(supervisionList.map((item) => item.id));
+ // 过滤掉已有的数据
+ const newItems = dataList.filter((item) => !existingIds.has(item.id));
+ // 合并新数据
+ setSupervisionList((prev) => [...prev, ...newItems]);
+ } else {
+ // 获取已有数据的ID集合
+ const existingIds = new Set(urgingList.map((item) => item.id));
+ // 过滤掉已有的数据
+ const newItems = dataList.filter((item) => !existingIds.has(item.id));
+ // 合并新数据
+ setUrgingList((prev) => [...prev, ...newItems]);
+ }
+ }
+
+ setTotalCount(totalElements);
+ setTotalPages(totalPages);
+ setHasMore(!last);
+ setPage(currentPage);
+ }
+ } catch (error) {
+ console.error('获取数据失败', error);
+ $$.showToast({ content: '获取数据失败，请稍后重试' });
+ } finally {
+ setLoading(false);
+ setRefreshing(false);
+ }
+ };
+
+ // 下拉刷新
+ const handleRefresh = () => {
+ setRefreshing(true);
+ fetchData(1);
+ };
+
+ // 加载更多
+ const loadMoreData = () => {
+ if (loading || !hasMore) return;
+ fetchData(page + 1, true); // 传入true表示保持滚动位置
+ };
+
+ // 获取列表数据
+ const getListData = () => {
+ if (activeType === 'supervision') {
+ return supervisionList;
+ } else {
+ return urgingList;
+ }
+ };
+
+ // 查看详情
+ const handleViewDetail = (item) => {
+ setCurrentItem(item);
+ // 这里可以根据实际情况调用API获取详情
+ if (activeType === 'supervision') {
+ if (activeStatus === 'unread') {
+ setCurrentDetail({
+ supervisionTime: item.supTime,
+ supervisionPerson: `${item.supUserName} (${item.supUnitName})`,
+ supervisionContent: item.supContent,
+ // 处理督办附件，只保留ownerType=22_00018-506的
+ attachments: (item.fileInfoList || []).filter((file) => file.ownerType === '22_00018-506'),
+ });
+ } else {
+ setCurrentDetail({
+ supervisionTime: item.supTime,
+ supervisionPerson: `${item.supUserName} (${item.supUnitName})`,
+ supervisionContent: item.supContent,
+ replyTime: item.replyTime,
+ replyPerson: `${item.replyUserName} (${item.quiltUnitName})`,
+ replyContent: item.replyContent,
+ // 处理督办附件，只保留ownerType=22_00018-506的
+ attachments: (item.fileInfoList || []).filter((file) => file.ownerType === '22_00018-506'),
+ // 处理回复附件，只保留ownerType=22_00018-507的
+ replyAttachments: (item.replyFileInfoList || []).filter((file) => file.ownerType === '22_00018-507'),
+ });
+ }
+ } else if (activeType === 'urging') {
+ if (activeStatus === 'unread') {
+ setCurrentDetail({
+ urgingTime: item.urgingTime,
+ urgingPerson: `${item.urgingUserName} (${item.urgingUnitName})`,
+ urgingContent: item.supContent,
+ // 处理催办附件，只保留ownerType=22_00018-506的
+ attachments: (item.fileInfoList || []).filter((file) => file.ownerType === '22_00018-506'),
+ });
+ } else {
+ setCurrentDetail({
+ urgingTime: item.urgingTime,
+ urgingPerson: `${item.urgingUserName} (${item.urgingUnitName})`,
+ urgingContent: item.supContent,
+ replyTime: item.replyTime,
+ replyPerson: `${item.replyUserName} (${item.quiltUnitName})`,
+ replyContent: item.replyContent,
+ // 处理催办附件，只保留ownerType=22_00018-506的
+ attachments: (item.fileInfoList || []).filter((file) => file.ownerType === '22_00018-506'),
+ // 处理回复附件，只保留ownerType=22_00018-507的
+ replyAttachments: (item.replyFileInfoList || []).filter((file) => file.ownerType === '22_00018-507'),
+ });
+ }
+ }
+ setDetailVisible(true);
+ };
+
+ // 回复督办
+ const handleReply = (item) => {
+ // 设置当前选中的督办项
+ setCurrentItem(item);
+ // 清空回复内容和附件
+ setReplyContent('');
+ setAttachments([]);
+ // 打开回复弹窗
+ setReplyVisible(true);
+ };
+
+ // 关闭详情弹窗
+ const handleCloseDetail = () => {
+ setDetailVisible(false);
+ setCurrentDetail(null);
+ setCurrentItem(null);
+ };
+
+ // 关闭回复弹窗
+ const handleCloseReply = () => {
+ setReplyVisible(false);
+ setReplyContent('');
+ setAttachments([]);
+ };
+
+ // 提交回复
+ const handleSubmitReply = async () => {
+ const requestData = {
+ id: currentItem.id,
+ caseId: caseId,
+ replyContent: replyContent,
+ };
+ if (!replyContent.trim()) {
+ $$.showToast({ content: '请填写' });
+ return;
+ }
+ global.setSpinning(true);
+
+ let res;
+ if (activeType === 'supervision') {
+ // 调用督办回复接口
+ res = await replyCaseSuperviseApi(requestData);
+ } else {
+ // 调用催办回复接口
+ res = await replyCaseUrgingApi(requestData);
+ }
+
+ global.setSpinning(false);
+ if (res.type) {
+ // 关闭回复弹窗
+ setReplyVisible(false);
+ // 清空回复内容和附件
+ setReplyContent('');
+ setAttachments([]);
+ // 刷新列表数据
+ fetchData(1); // 刷新列表
+ // 如果是从未回复列表回复的，那么需要更新未回复数量
+ if (activeStatus === 'unread') {
+ if (activeType === 'supervision') {
+ fetchUnreadSuperviseCount();
+ } else {
+ fetchUnreadUrgingCount();
+ }
+ }
+ // 提示用户回复成功
+ $$.showToast({ content: '回复成功' });
+ }
+ };
+
+ // 使用模板
+ const handleUseTemplate = () => {
+ setReplyContent('双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。');
+ };
+
+ // OCR识别材料
+ const handleOcrRecognize = () => {
+ // 实际项目中应当调用OCR识别API或文件上传API
+ Toast.show({
+ content: '正在识别材料...',
+ position: 'bottom',
+ });
+
+ // 模拟识别结果
+ setTimeout(() => {
+ setReplyContent(replyContent + (replyContent ? '\n\n' : '') + '通过识别，确认双方当事人已达成和解协议，纠纷已妥善处理。');
+ Toast.show({
+ content: '识别完成',
+ position: 'bottom',
+ });
+ }, 1000);
+ };
+
+ // 渲染主要内容区域
+ const renderContent = () => {
+ const listData = getListData();
+
+ if (loading && page === 1) {
+ return (
+ <div className="dbcb-loading">
+ <div className="dbcb-loading-text">加载中...</div>
+ </div>
+ );
+ }
+
+ if (!loading && listData.length === 0) {
+ return (
+ <div className="dbcb-empty-state">
+ <img src={caseQuery_2} alt="暂无数据" className="dbcb-empty-image" />
+ <div className="dbcb-empty-text">暂无数据</div>
+ {/* <Empty description="暂无数据" /> */}
+ </div>
+ );
+ }
+
+ // 检查是否超时或即将超时的函数
+ const checkTimeout = (item) => {
+ if (!item.supTime) return { isTimeout: false, isAboutToTimeout: false };
+
+ try {
+ // 解析督办时间，处理不同格式的日期
+ let supTime;
+ if (item.supTime.includes('T')) {
+ // ISO格式: 2025-04-09T17:14:00
+ supTime = new Date(item.supTime);
+ } else if (item.supTime.includes('-')) {
+ // 普通格式: 2025-04-09 17:14
+ const [datePart, timePart] = item.supTime.split(' ');
+ const [year, month, day] = datePart.split('-');
+ const [hour, minute] = timePart.split(':');
+ supTime = new Date(year, parseInt(month) - 1, day, hour, minute);
+ } else {
+ // 无法解析的格式
+ return { isTimeout: false, isAboutToTimeout: false };
+ }
+
+ const now = new Date();
+ const diffHours = Math.floor((now - supTime) / (1000 * 60 * 60));
+
+ return {
+ isTimeout: diffHours >= 12,
+ isAboutToTimeout: diffHours >= 11 && diffHours < 12,
+ };
+ } catch (error) {
+ console.error('解析日期时间出错', error);
+ return { isTimeout: false, isAboutToTimeout: false };
+ }
+ };
+
+ console.log('dbcb');
+
+ return (
+ <div className="dbcb-list">
+ {listData.map((item) => {
+ const { isTimeout, isAboutToTimeout } = activeStatus === 'unread' ? checkTimeout(item) : { isTimeout: false, isAboutToTimeout: false };
+
+ return (
+ <div className="dbcb-item" key={item.id}>
+ <div className="dbcb-item-header">
+ <div className="dbcb-item-unit-container">
+ {activeType === 'supervision' ? (
+ <div className="dbcb-item-unit">{item.supUnitName}</div>
+ ) : (
+ <div className="dbcb-item-unit">当事人{item.urgingUserName}向你发出了一条催办提醒</div>
+ )}
+ {activeStatus === 'unread' && activeType === 'supervision' && (
+ <>
+ {isTimeout && <div className="dbcb-item-timeout">已超时</div>}
+ {isAboutToTimeout && <div className="dbcb-item-about-to-timeout">即将超时</div>}
+ </>
+ )}
+ </div>
+ </div>
+ {activeType === 'supervision' && <div className="dbcb-item-content">{item.supContent}</div>}
+ <div className="dbcb-item-footer">
+ {activeStatus === 'unread' ? (
+ <>
+ <div className="dbcb-item-time">
+ {activeType === 'supervision' ? `督办时间：${item.supTime}` : `催办时间：${formatDateTime(item.urgingTime)}`}
+ </div>
+ <div className="dbcb-item-actions">
+ <Button className="dbcb-item-btn dbcb-item-detail-btn" size="small" onClick={() => handleViewDetail(item)}>
+ 详情
+ </Button>
+ <Button className="dbcb-item-btn dbcb-item-reply-btn" size="small" type="primary" onClick={() => handleReply(item)}>
+ 回复
+ </Button>
+ </div>
+ </>
+ ) : (
+ <>
+ <div className="dbcb-item-time">
+ {activeType === 'supervision' ? `回复时间：${item.replyTime}` : `回复时间：${formatDateTime(item.replyTime)}`}
+ </div>
+ <div className="dbcb-item-actions">
+ <Button className="dbcb-item-btn dbcb-item-detail-btn" size="small" onClick={() => handleViewDetail(item)}>
+ 详情
+ </Button>
+ </div>
+ </>
+ )}
+ </div>
+ </div>
+ );
+ })}
+
+ {loading && page > 1 && <div className="dbcb-loading-more">加载更多...</div>}
+
+ {!hasMore && listData.length > 0 && <div className="dbcb-no-more">已加载全部</div>}
+ </div>
+ );
+ };
+
+ // 渲染详情弹窗
+ const renderDetailDialog = () => {
+ if (!currentDetail) return null;
+
+ // 检查当前项是否超时或即将超时
+ const getTimeoutStatus = (item) => {
+ if (activeStatus !== 'unread' || !item || !item.supTime) return null;
+
+ try {
+ // 解析督办时间，处理不同格式的日期
+ let supTime;
+ if (item.supTime.includes('T')) {
+ // ISO格式: 2025-04-09T17:14:00
+ supTime = new Date(item.supTime);
+ } else if (item.supTime.includes('-')) {
+ // 普通格式: 2025-04-09 17:14
+ const [datePart, timePart] = item.supTime.split(' ');
+ const [year, month, day] = datePart.split('-');
+ const [hour, minute] = timePart.split(':');
+ supTime = new Date(year, parseInt(month) - 1, day, hour, minute);
+ } else {
+ // 无法解析的格式
+ return null;
+ }
+
+ const now = new Date();
+ const diffHours = Math.floor((now - supTime) / (1000 * 60 * 60));
+
+ if (diffHours >= 12) {
+ return <span style={{ color: '#FF4D4F' }}>已超时</span>;
+ } else if (diffHours >= 11 && diffHours < 12) {
+ return <span style={{ color: '#FAAD14' }}>即将超时</span>;
+ }
+ return null;
+ } catch (error) {
+ console.error('解析日期时间出错', error);
+ return null;
+ }
+ };
+
+ const timeoutStatus = getTimeoutStatus(currentItem);
+
+ return (
+ <Modal
+ visible={detailVisible}
+ onClose={handleCloseDetail}
+ title={
+ <div className="dbcb-detail-header">
+ <div className="dbcb-detail-title">
+ {activeType === 'supervision'
+ ? activeStatus === 'unread'
+ ? '督办详情'
+ : '督办回复详情'
+ : activeStatus === 'unread'
+ ? '催办详情'
+ : '催办回复详情'}
+ </div>
+ <div className="dbcb-detail-timeout-status">{timeoutStatus}</div>
+ </div>
+ }
+ className="dbcb-detail-dialog"
+ maskClosable={true}
+ closable={true}
+ position="bottom"
+ >
+ <div className="dbcb-detail-content">
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">{activeType === 'supervision' ? '督办时间' : '催办时间'}</div>
+ <div className="dbcb-detail-value">
+ {activeType === 'supervision' ? currentDetail.supervisionTime : formatDateTime(currentDetail.urgingTime)}
+ </div>
+ </div>
+
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">{activeType === 'supervision' ? '督办人' : '催办人'}</div>
+ <div className="dbcb-detail-value">
+ {
+ activeType === 'supervision' ? currentDetail.supervisionPerson : currentDetail.urgingPerson.split(' ')[0] // 只取人名，不显示单位
+ }
+ </div>
+ </div>
+
+ {activeType === 'supervision' && (
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">督办内容</div>
+ <div className="dbcb-detail-value">{currentDetail.supervisionContent}</div>
+ </div>
+ )}
+
+ {currentDetail.attachments && currentDetail.attachments.length > 0 && (
+ <div className="dbcb-detail-section">
+ <DingUpload
+ fileList={currentDetail.attachments.map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '0KB',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ title={activeType === 'supervision' ? '督办附件' : '催办附件'}
+ />
+ </div>
+ )}
+
+ {/* 已回复详情的额外信息 */}
+ {activeStatus === 'read' && (
+ <>
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">回复时间</div>
+ <div className="dbcb-detail-value">{currentDetail.replyTime}</div>
+ </div>
+
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">回复人</div>
+ <div className="dbcb-detail-value">{currentDetail.replyPerson}</div>
+ </div>
+
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">回复内容</div>
+ <div className="dbcb-detail-value">{currentDetail.replyContent}</div>
+ </div>
+
+ {currentDetail.replyAttachments && currentDetail.replyAttachments.length > 0 && (
+ <div className="dbcb-detail-section">
+ <div className="dbcb-detail-label">回复附件</div>
+ <DingUpload
+ fileList={currentDetail.replyAttachments.map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '0KB',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ title="回复附件"
+ />
+ </div>
+ )}
+ </>
+ )}
+ </div>
+
+ {activeStatus === 'unread' && (
+ <div className="dbcb-detail-footer">
+ <Button
+ type="primary"
+ className="dbcb-detail-reply-btn"
+ onClick={() => {
+ // 关闭详情弹窗，打开回复弹窗
+ setDetailVisible(false);
+ // 延迟一点打开回复弹窗，避免两个弹窗切换过快
+ setTimeout(() => {
+ if (currentItem) {
+ handleReply(currentItem);
+ }
+ }, 300);
+ }}
+ >
+ 回复
+ </Button>
+ </div>
+ )}
+
+ {activeStatus === 'read' && (
+ <div className="dbcb-detail-footer">
+ <Button type="primary" className="dbcb-detail-close-btn" onClick={handleCloseDetail}>
+ 关闭
+ </Button>
+ </div>
+ )}
+ </Modal>
+ );
+ };
+
+ // 渲染回复弹窗
+ const renderReplyModal = () => {
+ if (!currentItem) return null;
+
+ return (
+ <Modal
+ visible={replyVisible}
+ onClose={handleCloseReply}
+ title={
+ <div className="dbcb-reply-header">
+ <div className="dbcb-reply-title">{activeType === 'supervision' ? '督办回复' : '催办回复'}</div>
+ <div className="dbcb-reply-close-btn" onClick={handleCloseReply}>
+ <img src={cbdb_1} width={20} height={20} alt="关闭" />
+ </div>
+ </div>
+ }
+ className="dbcb-detail-dialog dbcb-reply-dialog"
+ maskClosable={true}
+ closable={false}
+ position="bottom"
+ >
+ <div className="dbcb-reply-wrapper">
+ <div className="dbcb-reply-content">
+ {/* 督办详情信息 */}
+ <div className="dbcb-reply-detail">
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">{activeType === 'supervision' ? '督办时间' : '催办时间'}</div>
+ <div className="dbcb-reply-value">{activeType === 'supervision' ? currentItem.supTime : formatDateTime(currentItem.urgingTime)}</div>
+ </div>
+
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">{activeType === 'supervision' ? '督办人' : '催办人'}</div>
+ <div className="dbcb-reply-value">
+ {activeType === 'supervision'
+ ? `${currentItem.supUserName} (${currentItem.supUnitName}) ${currentItem.supUserPhone || ''}`
+ : `${currentItem.urgingUserName}`}
+ </div>
+ </div>
+
+ {activeType === 'supervision' && (
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">督办内容</div>
+ <div className="dbcb-reply-value">{currentItem.supContent}</div>
+ </div>
+ )}
+
+ {activeType === 'supervision' &&
+ currentItem.fileInfoList &&
+ currentItem.fileInfoList.filter((file) => file.ownerType === '22_00018-506').length > 0 && (
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">督办附件</div>
+ <DingUpload
+ fileList={(currentItem.fileInfoList || [])
+ .filter((file) => file.ownerType === '22_00018-506')
+ .map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '12.3K',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ title="督办附件"
+ />
+ </div>
+ )}
+
+ {activeType === 'urging' && currentItem.fileInfoList && currentItem.fileInfoList.length > 0 && (
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">催办附件</div>
+ <DingUpload
+ fileList={(currentItem.fileInfoList || []).map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '12.3K',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ title="催办附件"
+ />
+ </div>
+ )}
+ </div>
+
+ {/* 回复内容区域 */}
+ <div className="dbcb-reply-section">
+ <div className="dbcb-reply-label">
+ <span className="dbcb-reply-label-text">回复内容</span>
+ <div className="dbcb-reply-btn-group">
+ {/* <div className="dbcb-reply-ocr-btn" onClick={handleOcrRecognize}>
+ <svg viewBox="0 0 1024 1024" width="20" height="20">
+ <path
+ d="M832 128H192c-35.2 0-64 28.8-64 64v640c0 35.2 28.8 64 64 64h640c35.2 0 64-28.8 64-64V192c0-35.2-28.8-64-64-64z m0 704H192V192h640v640z"
+ fill="#1A6FB8"
+ ></path>
+ <path
+ d="M696.9 298.1H584.1c-12.3 0-22.3 10-22.3 22.3s10 22.3 22.3 22.3h69l-155.8 155.8c-8.7 8.7-8.7 22.8 0 31.5 4.4 4.4 10.1 6.5 15.7 6.5s11.4-2.2 15.7-6.5l155.8-155.8v69c0 12.3 10 22.3 22.3 22.3s22.3-10 22.3-22.3V320.4c0.1-12.3-9.9-22.3-22.2-22.3z"
+ fill="#1A6FB8"
+ ></path>
+ <path
+ d="M428.5 685.5c4.4 4.4 10.1 6.5 15.7 6.5s11.4-2.2 15.7-6.5c8.7-8.7 8.7-22.8 0-31.5L303.2 497.3v-69c0-12.3-10-22.3-22.3-22.3s-22.3 10-22.3 22.3v112.8c0 12.3 10 22.3 22.3 22.3h112.8c12.3 0 22.3-10 22.3-22.3s-10-22.3-22.3-22.3h-69L428.5 654c8.6 8.7 8.6 22.8 0 31.5z"
+ fill="#1A6FB8"
+ ></path>
+ </svg>
+ 识别材料
+ </div> */}
+ <div
+ className="dbcb-reply-template-btn"
+ onClick={() =>
+ setReplyContent(
+ activeType === 'supervision' ? '双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。' : '已认真制定方案，并同当事人进行了沟通'
+ )
+ }
+ >
+ <svg viewBox="0 0 1024 1024" width="20" height="20">
+ <path
+ d="M832 64H192C121.6 64 64 121.6 64 192v640c0 70.4 57.6 128 128 128h640c70.4 0 128-57.6 128-128V192c0-70.4-57.6-128-128-128zM192 128h640c35.2 0 64 28.8 64 64v256h-768V192c0-35.2 28.8-64 64-64z m640 768H192c-35.2 0-64-28.8-64-64V512h768v320c0 35.2-28.8 64-64 64z"
+ fill="#1A6FB8"
+ ></path>
+ <path d="M672 320H544V192h128v128zM672 832H544V704h128v128z" fill="#1A6FB8"></path>
+ </svg>
+ 选择模板
+ </div>
+ </div>
+ </div>
+ <textarea
+ className="dbcb-reply-textarea"
+ placeholder="请填写"
+ value={replyContent}
+ onChange={(e) => setReplyContent(e.target.value)}
+ rows={5}
+ ></textarea>
+ </div>
+
+ {/* 附件区域 */}
+ <div className="dbcb-reply-section">
+ <DingUpload
+ fileList={attachments}
+ onChange={(info) => {
+ if (info.fileList) {
+ setAttachments(info.fileList);
+ }
+ }}
+ ownerId={currentItem.id}
+ ownerType={activeType === 'supervision' ? '22_00018-507' : '23_00018-507'}
+ disabled={false}
+ viewOnly={false}
+ accept="image/*, .pdf, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .txt"
+ tipText="支持扩展名：.doc .docx .pdf .jpg 等，30M以内"
+ btnText="添加附件"
+ subtitle="请上传与内容相关的附件材料"
+ title="附件材料"
+ />
+ </div>
+ </div>
+
+ {/* 底部按钮 */}
+ <div className="dbcb-reply-footer">
+ <Button type="primary" className="dbcb-reply-submit-btn" onClick={handleSubmitReply}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Modal>
+ );
+ };
+
+ return (
+ <div className="dbcb-container">
+ {/* 督办/催办切换 */}
+ <div className="dbcb-type-tabs">
+ <div className={`dbcb-type-tab ${activeType === 'supervision' ? 'dbcb-type-tab-active' : ''}`} onClick={() => setActiveType('supervision')}>
+ 督办({unreadSuperviseCount || 0})
+ </div>
+ <div className={`dbcb-type-tab ${activeType === 'urging' ? 'dbcb-type-tab-active' : ''}`} onClick={() => setActiveType('urging')}>
+ 催办({unreadUrgingCount || 0})
+ </div>
+ </div>
+
+ {/* 未回复/已回复切换 */}
+ <div className="dbcb-status-tabs">
+ <div className={`dbcb-status-tab ${activeStatus === 'unread' ? 'dbcb-status-tab-active' : ''}`} onClick={() => setActiveStatus('unread')}>
+ 未回复
+ </div>
+ <div className={`dbcb-status-tab ${activeStatus === 'read' ? 'dbcb-status-tab-active' : ''}`} onClick={() => setActiveStatus('read')}>
+ 已回复
+ </div>
+ </div>
+
+ {/* 内容区域 */}
+ <PullToRefresh onRefresh={handleRefresh} refreshing={refreshing}>
+ <Scrollbars
+ ref={scrollbarsRef}
+ style={{ height: 'calc(100vh - 206px)' }}
+ autoHide
+ onScroll={(e) => {
+ // 滚动到底部加载更多数据
+ const { scrollTop, scrollHeight, clientHeight } = e.target;
+ if (scrollHeight - scrollTop - clientHeight < 50 && !loading && hasMore) {
+ loadMoreData();
+ }
+ }}
+ >
+ {renderContent()}
+ </Scrollbars>
+ </PullToRefresh>
+
+ {/* 详情弹窗 */}
+ {renderDetailDialog()}
+
+ {/* 回复弹窗 */}
+ {renderReplyModal()}
+ </div>
+ );
+};
+
+export default Dbcb;
diff --git a/src/views/flow/component/dbcb/index.less b/src/views/flow/component/dbcb/index.less
new file mode 100644
index 0000000..3f056c8
--- /dev/null
+++ b/src/views/flow/component/dbcb/index.less
@@ -0,0 +1,735 @@
+@import '../../../../styles/theme.less';
+
+.ddm-modal-container {
+ .ddm-modal-mask {
+ background-color: rgba(0, 0, 0, 0.45);
+ }
+
+ .ddm-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ }
+
+ .ddm-modal {
+ &.from-bottom {
+ border-radius: 8px 8px 0 0;
+ width: 100%;
+ margin: 0;
+ }
+ }
+}
+
+// 无数据状态
+.dbcb-empty-state {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ min-height: 60vh;
+
+ .dbcb-empty-image {
+ width: 260px;
+ height: 260px;
+ margin-bottom: 16px;
+ }
+
+ .dbcb-empty-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+}
+
+.dbcb {
+ &-container {
+ background-color: #f5f7fa;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+ }
+
+ /* 督办/催办 顶部标签切换 */
+ &-type-tabs {
+ display: flex;
+ background-color: #fff;
+ border-bottom: 1px solid #eaedf3;
+ padding: 10px 12px;
+ justify-content: center;
+ }
+
+ &-type-tab {
+ position: relative;
+ font-size: 15px;
+ color: #FFFFFF;
+ margin-right: 0;
+ height: 44px;
+ width: 175px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ box-sizing: border-box;
+ border-bottom: 3px solid transparent;
+ background-color: #5FA6D4;
+ border-radius: 4px;
+
+ &:first-child {
+ border-top-right-radius: 0;
+ border-bottom-right-radius: 0;
+ border-right: 1px solid #fff;
+ }
+
+ &:last-child {
+ border-top-left-radius: 0;
+ border-bottom-left-radius: 0;
+ border-left: 1px solid #fff;
+ }
+
+ &-active {
+ color: #fff;
+ font-weight: 500;
+ background-color: #1A6FB8;
+ border-bottom: 3px solid #1A6FB8;
+ }
+ }
+
+ /* 未回复/已回复 子标签切换 */
+ &-status-tabs {
+ display: flex;
+ padding: 12px 4px 8px;
+ border-bottom: 1px solid #eaedf3;
+ justify-content: flex-start;
+ gap: 8px;
+ margin-left: 12px;
+ }
+
+ &-status-tab-container {
+ display: flex;
+ border-radius: 4px;
+ overflow: hidden;
+ width: 92px;
+ height: 22px;
+ border: 1px solid #E5E6EB;
+ margin-left: 16px;
+ background-color: #f5f7fa;
+ }
+
+ &-status-tab {
+ padding: 0;
+ font-size: 14px;
+ color: #171A1D;
+ height: 22px;
+ line-height: 22px;
+ width: 45px;
+ text-align: center;
+ border: 1px solid #E5E6EB;
+ border-radius: 4px;
+ background: #f2f2f2;
+ padding: 0 4px;
+ &-active {
+ background-color: rgba(95, 166, 212, 0.1);
+ color: #1A6FB8;
+ }
+ }
+
+ /* 列表样式 */
+ &-list {
+ padding: 8px;
+ background-color: #f5f7fa;
+ }
+
+ /* 加载相关样式 */
+ &-loading {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 200px;
+
+ &-text {
+ font-size: 14px;
+ color: #86909c;
+ }
+ }
+
+ &-loading-more {
+ text-align: center;
+ padding: 12px 0;
+ font-size: 14px;
+ color: #86909c;
+ }
+
+ &-no-more {
+ text-align: center;
+ padding: 12px 0;
+ font-size: 14px;
+ color: #86909c;
+
+ &::before, &::after {
+ content: '';
+ display: inline-block;
+ width: 40px;
+ height: 1px;
+ background-color: #e5e6eb;
+ margin: 0 8px;
+ vertical-align: middle;
+ }
+ }
+
+ &-item {
+ background-color: #fff;
+ border-radius: 4px;
+ padding: 4px 12px;
+ margin-bottom: 8px;
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
+
+ &-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 8px;
+ }
+
+ &-unit-container {
+ display: flex;
+ align-items: center;
+ width: 100%;
+ justify-content: space-between;
+ }
+
+ &-unit {
+ font-size: 15px;
+ font-weight: 500;
+ color: #1d2129;
+ }
+
+ &-timeout {
+ font-size: 12px;
+ color: #f53f3f;
+ padding: 1px 4px;
+ background-color: #ffece8;
+ border-radius: 2px;
+ }
+
+ &-about-to-timeout {
+ font-size: 12px;
+ color: #ff7d00;
+ padding: 1px 4px;
+ background-color: #fff3e8;
+ border-radius: 2px;
+ }
+
+ &-content {
+ font-size: 14px;
+ color: #4e5969;
+ line-height: 20px;
+ margin-bottom: 8px;
+ -webkit-line-clamp: 2;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ }
+
+ &-footer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ border-top: 1px solid #f2f3f5;
+ margin-top: 4px;
+ padding-bottom: 6px;
+ padding-top: 6px;
+ }
+
+ &-time {
+ font-size: 14px;
+ color: #86909c;
+ }
+
+ &-actions {
+ display: flex;
+ gap: 8px;
+ justify-content: flex-end;
+ }
+
+ &-btn {
+ min-width: 52px;
+ width: 52px;
+ height: 26px;
+ border-radius: 4px;
+ font-size: 13px;
+ padding: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 16px;
+
+ &.ddm-button-primary {
+ background-color: #1A6FB8;
+ }
+
+ &.dbcb-item-detail-btn {
+ color: #1A6FB8;
+ border: 1px solid #e5e6eb;
+ background-color: #fff;
+ border: 1px solid #1A6FB8;
+ }
+
+ &.dbcb-item-reply-btn {
+ color: #fff;
+ background-color: #1A6FB8;
+ border: 1px solid #1A6FB8;
+ }
+ }
+ }
+
+ &-empty {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 300px;
+ }
+
+ /* 详情弹窗样式 */
+ &-detail {
+ &-dialog {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ margin: 0;
+ border-radius: 8px 8px 0 0;
+ width: 100% !important;
+ max-width: 100% !important;
+
+ .ddm-modal {
+ position: absolute;
+ bottom: 0;
+ width: 100%;
+ margin: 0;
+ }
+
+ .ddm-modal-content {
+ padding: 0 16px;
+ }
+
+ .ddm-modal-header {
+ padding: 16px;
+ text-align: left;
+ position: relative;
+ border-bottom: 1px solid #f5f5f5;
+
+ .ddm-modal-title {
+ text-align: left;
+ width: 100%;
+ font-size: 16px;
+ }
+
+ .ddm-modal-close {
+ position: absolute;
+ right: 16px;
+ top: 16px;
+ }
+ }
+ }
+
+ &-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ }
+
+ &-title {
+ font-weight: 500;
+ text-align: left;
+ font-size: 16px;
+ }
+
+ &-timeout-status {
+ text-align: right;
+ font-size: 13px;
+ display: flex;
+ align-items: center;
+ height: 100%;
+
+ span {
+ padding: 1px 4px;
+ border-radius: 2px;
+
+ &[style*="color: #FF4D4F"] {
+ background-color: #ffece8;
+ }
+
+ &[style*="color: #FAAD14"] {
+ background-color: #fff3e8;
+ }
+ }
+ }
+
+ &-content {
+ padding: 0 0 16px;
+ overflow-y: auto;
+ max-height: 70vh;
+ }
+
+ &-section {
+ margin-bottom: 16px;
+ text-align: left;
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #86909c;
+ margin-bottom: 4px;
+ text-align: left;
+ }
+
+ &-value {
+ font-size: 14px;
+ color: #1d2129;
+ line-height: 22px;
+ text-align: left;
+ white-space: pre-line; /* 保留换行符 */
+ }
+
+ &-attachments {
+ margin-top: 8px;
+ text-align: left;
+ }
+
+ &-footer {
+ display: flex;
+ justify-content: center;
+ padding: 16px 0;
+ border-top: 1px solid #f2f3f5;
+
+ .ddm-button {
+ width: 100%;
+ height: 44px;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+ }
+ }
+
+ /* 附件样式 */
+ &-attachment {
+ display: flex;
+ align-items: center;
+ height: 48px;
+ background-color: #f7f8fa;
+ border-radius: 4px;
+ padding: 0 12px;
+ margin-bottom: 8px;
+
+ &-icon {
+ margin-right: 8px;
+ }
+
+ &-name {
+ flex: 1;
+ font-size: 14px;
+ color: #1d2129;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ &-size {
+ font-size: 12px;
+ color: #86909c;
+ margin: 0 12px;
+ }
+
+ &-preview {
+ font-size: 14px;
+ color: #1A6FB8;
+ }
+ }
+
+ /* 回复弹窗样式 */
+ &-reply {
+ &-dialog {
+ max-height: 90vh !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ left: 0 !important;
+ right: 0 !important;
+ margin: 0 auto !important;
+ overflow-x: hidden !important;
+
+ .ddm-modal {
+ max-height: 90vh !important;
+ height: auto !important;
+ width: 100% !important;
+ max-width: 100% !important;
+ }
+
+ .ddm-modal-content {
+ padding: 0;
+ max-height: calc(90vh - 56px) !important;
+ height: auto !important;
+ display: flex;
+ flex-direction: column;
+ width: 100% !important;
+ overflow-x: hidden !important;
+ }
+
+ .ddm-modal-body {
+ width: 100% !important;
+ overflow-x: hidden !important;
+ padding: 0 !important;
+ }
+
+ .ddm-modal-header {
+ padding: 12px 16px;
+ text-align: left;
+ position: relative;
+ border-bottom: 1px solid #f5f5f5;
+ width: 100% !important;
+
+ .ddm-modal-title {
+ font-size: 17px;
+ font-weight: 500;
+ text-align: left;
+ width: 100% !important;
+ }
+
+ .ddm-modal-close {
+ display: none !important;
+ }
+ }
+ }
+
+ &-close-icon {
+ position: absolute !important;
+ top: 12px !important;
+ right: 16px !important;
+ width: 20px !important;
+ height: 20px !important;
+ z-index: 100 !important;
+ display: block !important;
+ }
+
+ &-wrapper {
+ width: 100% !important;
+ max-width: 100% !important;
+ overflow-x: hidden !important;
+ box-sizing: border-box !important;
+ }
+
+ &-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ position: relative;
+ }
+
+ &-title {
+ font-size: 17px;
+ font-weight: 500;
+ text-align: left;
+ padding-left: 0;
+ font-weight: 500;
+ }
+
+ &-close-btn {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 20px;
+ height: 20px;
+ cursor: pointer;
+ }
+
+ &-content {
+ flex: 1;
+ overflow-y: auto;
+ overflow-x: hidden !important;
+ display: flex;
+ flex-direction: column;
+ width: 100% !important;
+ max-width: 100% !important;
+ box-sizing: border-box !important;
+ }
+
+ &-detail {
+ padding: 12px 0px;
+ border-radius: 8px;
+ margin-bottom: 16px;
+ text-align: left;
+ margin-left: 0;
+ width: 100% !important;
+ box-sizing: border-box !important;
+ }
+
+ &-section {
+ margin-bottom: 16px;
+ text-align: left;
+ width: 100% !important;
+ box-sizing: border-box !important;
+ }
+
+ &-btn-group {
+ display: flex;
+ align-items: center;
+ }
+
+ &-ocr-btn {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ color: #1A6FB8;
+ margin-right: 12px;
+
+ svg {
+ margin-right: 4px;
+ }
+ }
+
+ &-template-btn {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ color: #1A6FB8;
+
+ svg {
+ margin-right: 4px;
+ }
+ }
+
+ &-label {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 15px;
+ color: #86909c;
+ margin-bottom: 8px;
+ text-align: left;
+
+ &-text {
+ font-weight: 500;
+ color: #171A1D;
+ }
+ }
+
+ &-value {
+ font-size: 14px;
+ color: #4e5969;
+ line-height: 22px;
+ white-space: pre-line;
+ text-align: left;
+ word-break: break-all;
+ }
+
+ &-textarea {
+ width: 98%;
+ border: 1px solid #e5e6eb;
+ border-radius: 4px;
+ font-size: 14px;
+ line-height: 22px;
+ resize: none;
+ min-height: 120px;
+ height: 120px;
+ }
+
+ &-attachments {
+ margin-top: 12px;
+ }
+
+ &-attachment {
+ display: flex;
+ align-items: center;
+ height: 48px;
+ background-color: #f7f8fa;
+ border-radius: 4px;
+ padding: 0 12px;
+ margin-bottom: 8px;
+ }
+
+ &-add-attachment {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ height: 48px;
+ background-color: #f7f8fa;
+ border-radius: 4px;
+ color: #1A6FB8;
+ font-size: 14px;
+
+ svg {
+ margin-right: 8px;
+ }
+ }
+
+ &-add-attachment-btn {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ color: #1A6FB8;
+
+ svg {
+ margin-right: 4px;
+ }
+ }
+
+ &-footer {
+ display: flex;
+ padding: 12px 0px;
+ border-top: 1px solid #f2f3f5;
+ justify-content: center;
+ width: 100% !important;
+ box-sizing: border-box !important;
+
+ .dbcb-reply-submit-btn {
+ flex: 1;
+ height: 44px;
+ border-radius: 8px;
+ background-color: #1A6FB8;
+ width: 100%;
+ font-size: 16px;
+ max-width: 100% !important;
+ }
+ }
+ }
+
+ /* 模板选择弹窗样式 */
+ &-template {
+ &-dialog {
+ .ddm-modal-content {
+ padding: 0 16px 16px;
+ }
+ }
+
+ &-content {
+ padding: 8px 0;
+ }
+
+ &-item {
+ border: 1px solid #e5e6eb;
+ border-radius: 4px;
+ padding: 12px;
+ margin-bottom: 12px;
+ }
+
+ &-title {
+ font-size: 14px;
+ font-weight: 500;
+ color: #1d2129;
+ margin-bottom: 8px;
+ }
+
+ &-preview {
+ font-size: 14px;
+ color: #4e5969;
+ line-height: 20px;
+ }
+ }
+
+ /* 附件样式补充 */
+ &-attachment {
+ &-delete {
+ font-size: 14px;
+ color: #f53f3f;
+ margin-left: 12px;
+ }
+ }
+}
diff --git a/src/views/flow/component/dbcb/reply.jsx b/src/views/flow/component/dbcb/reply.jsx
new file mode 100644
index 0000000..1d32f7a
--- /dev/null
+++ b/src/views/flow/component/dbcb/reply.jsx
@@ -0,0 +1,189 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-08 10:15:00
+ * @LastEditTime: 2025-04-08 10:30:00
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 督办回复组件
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Button, Input, Modal, Toast } from 'dingtalk-design-mobile';
+import NavBarPage from '../../../../components/NavBarPage';
+import * as $$ from '../../../../utils/utility';
+import './reply.less';
+
+// 督办详情模拟数据
+const mockSupervisionDetail = {
+ supervisionTime: '2025-3-1 12:00',
+ supervisionPerson: '李明明 (白云区综治中心) 13591990202',
+ supervisionContent: '本事项经初步核实，认为属于贵部门职责范围内的矛盾纠纷化解工作，请组织专门人员负责此事，尽快查明事实真相，依法依规进行处理，并在处理过程中充分考虑当事人的合理诉求，确保公平公正，维护当事人的合法权益。同时，请务必保持与当事人的沟通畅通，及时反馈办理进展，以增强矛盾纠纷化解工作的透明度和公信力。',
+ attachments: [
+ {
+ name: '关于加强矛盾纠纷解决指南',
+ size: '12.3K'
+ }
+ ]
+};
+
+const SupervisionReply = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const [replyContent, setReplyContent] = useState('');
+ const [attachments, setAttachments] = useState([]);
+ const [submitting, setSubmitting] = useState(false);
+
+ // 从URL获取督办ID
+ const supervisionId = $$.getQueryString('id');
+
+ // 添加附件
+ const handleAddAttachment = () => {
+ // 实际项目中，这里应该调用文件上传API
+ const newAttachment = {
+ id: Date.now().toString(),
+ name: '当事人沟通现场照片',
+ size: '12.3K'
+ };
+ setAttachments([...attachments, newAttachment]);
+ };
+
+ // 移除附件
+ const handleRemoveAttachment = (id) => {
+ setAttachments(attachments.filter(attachment => attachment.id !== id));
+ };
+
+ // 提交回复
+ const handleSubmit = () => {
+ if (!replyContent.trim()) {
+ Toast.show({
+ content: '请输入回复内容',
+ duration: 2000
+ });
+ return;
+ }
+
+ setSubmitting(true);
+
+ // 实际项目中，这里应该调用API提交回复
+ setTimeout(() => {
+ setSubmitting(false);
+ Toast.show({
+ content: '回复成功',
+ duration: 2000
+ });
+
+ // 返回上一页
+ history.goBack();
+ }, 1000);
+ };
+
+ // 渲染附件项
+ const renderAttachment = (file, isReplyAttachment = false) => {
+ return (
+ <div className="reply-attachment" key={file.id || file.name}>
+ <div className="reply-attachment-icon">
+ <svg viewBox="0 0 1024 1024" width="16" height="16">
+ <path d="M853.333 469.333c-17.066 0-32 14.934-32 32v256c0 23.467-19.2 42.667-42.667 42.667H245.333c-23.466 0-42.666-19.2-42.666-42.667V501.333c0-17.066-14.934-32-32-32s-32 14.934-32 32v256c0 59.733 46.933 106.667 106.666 106.667h533.334c59.733 0 106.666-46.934 106.666-106.667V501.333c0-17.066-14.933-32-32-32z" fill="#1677FF"></path>
+ <path d="M505.6 695.467c6.4 6.4 14.933 8.533 23.467 8.533s17.066-2.133 23.466-8.533l128-128c12.8-12.8 12.8-32 0-44.8-12.8-12.8-32-12.8-44.8 0L554.667 603.733V202.667c0-17.067-14.934-32-32-32s-32 14.933-32 32v401.066L409.6 522.667c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l140.8 128z" fill="#1677FF"></path>
+ </svg>
+ </div>
+ <div className="reply-attachment-name">{file.name}</div>
+ <div className="reply-attachment-size">{file.size}</div>
+ {isReplyAttachment ? (
+ <div
+ className="reply-attachment-delete"
+ onClick={() => handleRemoveAttachment(file.id)}
+ >
+ 删除
+ </div>
+ ) : (
+ <div className="reply-attachment-preview">预览</div>
+ )}
+ </div>
+ );
+ };
+
+ return (
+ <NavBarPage title="督办回复" showBack>
+ <div className="reply-container">
+ <div className="reply-header">督办回复详情</div>
+
+ {/* 督办详情部分 */}
+ <div className="reply-detail">
+ <div className="reply-section">
+ <div className="reply-label">督办时间</div>
+ <div className="reply-value">{mockSupervisionDetail.supervisionTime}</div>
+ </div>
+
+ <div className="reply-section">
+ <div className="reply-label">督办人</div>
+ <div className="reply-value">{mockSupervisionDetail.supervisionPerson}</div>
+ </div>
+
+ <div className="reply-section">
+ <div className="reply-label">督办内容</div>
+ <div className="reply-value">{mockSupervisionDetail.supervisionContent}</div>
+ </div>
+
+ {mockSupervisionDetail.attachments && mockSupervisionDetail.attachments.length > 0 && (
+ <div className="reply-section">
+ <div className="reply-label">督办附件</div>
+ <div className="reply-attachments">
+ {mockSupervisionDetail.attachments.map(file => renderAttachment(file))}
+ </div>
+ </div>
+ )}
+ </div>
+
+ <div className="reply-divider"></div>
+
+ {/* 回复编辑部分 */}
+ <div className="reply-edit">
+ <Input.TextArea
+ className="reply-textarea"
+ placeholder="请输入回复内容"
+ value={replyContent}
+ onChange={setReplyContent}
+ rows={5}
+ />
+
+ {/* 回复附件 */}
+ {attachments.length > 0 && (
+ <div className="reply-section">
+ <div className="reply-label">附件材料</div>
+ <div className="reply-attachments">
+ {attachments.map(file => renderAttachment(file, true))}
+ </div>
+ </div>
+ )}
+
+ {/* 添加附件按钮 */}
+ <div className="reply-add-attachment" onClick={handleAddAttachment}>
+ <div className="reply-add-attachment-icon">
+ <svg viewBox="0 0 1024 1024" width="20" height="20">
+ <path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z" fill="#1677FF"/>
+ <path d="M680 480H544V344c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v136H344c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h136v136c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h136c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z" fill="#1677FF"/>
+ </svg>
+ </div>
+ <div className="reply-add-attachment-text">添加附件</div>
+ </div>
+ </div>
+
+ {/* 底部提交按钮 */}
+ <div className="reply-footer">
+ <Button
+ type="primary"
+ className="reply-submit-btn"
+ loading={submitting}
+ onClick={handleSubmit}
+ >
+ 提交
+ </Button>
+ </div>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default SupervisionReply;
\ No newline at end of file
diff --git a/src/views/flow/component/dbcb/reply.less b/src/views/flow/component/dbcb/reply.less
new file mode 100644
index 0000000..1f5418a
--- /dev/null
+++ b/src/views/flow/component/dbcb/reply.less
@@ -0,0 +1,135 @@
+@import '../../../../styles/theme.less';
+
+.reply {
+ &-container {
+ background-color: #f5f7fa;
+ min-height: calc(100vh - 44px);
+ padding-bottom: 80px;
+ }
+
+ &-header {
+ font-size: 16px;
+ font-weight: 500;
+ padding: 16px;
+ background-color: #fff;
+ color: #1d2129;
+ border-bottom: 1px solid #f2f3f5;
+ }
+
+ &-detail, &-edit {
+ background-color: #fff;
+ padding: 0 16px;
+ }
+
+ &-section {
+ padding: 16px 0;
+ border-bottom: 1px solid #f2f3f5;
+
+ &:last-child {
+ border-bottom: none;
+ }
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #86909c;
+ margin-bottom: 8px;
+ }
+
+ &-value {
+ font-size: 14px;
+ color: #1d2129;
+ line-height: 22px;
+ }
+
+ &-attachments {
+ margin-top: 8px;
+ }
+
+ &-divider {
+ height: 8px;
+ background-color: #f5f7fa;
+ }
+
+ &-textarea {
+ padding: 16px 0;
+ font-size: 14px;
+ border: none;
+
+ .ddm-input-control {
+ min-height: 100px;
+ padding: 0;
+ }
+ }
+
+ &-add-attachment {
+ display: flex;
+ align-items: center;
+ padding: 12px 0 16px;
+
+ &-icon {
+ margin-right: 8px;
+ }
+
+ &-text {
+ color: #1A6FB8;
+ font-size: 14px;
+ }
+ }
+
+ &-attachment {
+ display: flex;
+ align-items: center;
+ height: 48px;
+ background-color: #f7f8fa;
+ border-radius: 4px;
+ padding: 0 12px;
+ margin-bottom: 8px;
+
+ &-icon {
+ margin-right: 8px;
+ }
+
+ &-name {
+ flex: 1;
+ font-size: 14px;
+ color: #1d2129;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ &-size {
+ font-size: 12px;
+ color: #86909c;
+ margin: 0 12px;
+ }
+
+ &-preview, &-delete {
+ font-size: 14px;
+ color: #1A6FB8;
+ }
+
+ &-delete {
+ color: #f53f3f;
+ }
+ }
+
+ &-footer {
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-color: #fff;
+ padding: 12px 16px;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
+ z-index: 10;
+ }
+
+ &-submit-btn {
+ width: 100%;
+ height: 44px;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+}
\ No newline at end of file
diff --git a/src/views/flow/component/lzjd/index.jsx b/src/views/flow/component/lzjd/index.jsx
new file mode 100644
index 0000000..0b5f390
--- /dev/null
+++ b/src/views/flow/component/lzjd/index.jsx
@@ -0,0 +1,30 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-08 09:28:00
+ * @LastEditTime: 2025-04-08 09:50:41
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:
+ */
+// 流程节点组件
+
+import React, { useState, useEffect } from 'react';
+import { useLocation } from 'react-router-dom';
+import ProgressStep from '../../../../components/ProgressStep/VisitStep';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+
+const Lzjd = ({progressData}) => {
+ const location = useLocation();
+ // 使用现有的getQueryString方法或从location中获取查询参数
+
+ return (
+ <div className="flow">
+ <ProgressStep progressData={progressData} />
+ </div>
+ )
+}
+
+export default Lzjd;
diff --git a/src/views/flow/component/lzjd/index.less b/src/views/flow/component/lzjd/index.less
new file mode 100644
index 0000000..da41f16
--- /dev/null
+++ b/src/views/flow/component/lzjd/index.less
@@ -0,0 +1,3 @@
+.flow {
+ padding: 12px 16px;
+}
\ No newline at end of file
diff --git a/src/views/flow/component/sqjl/detail.jsx b/src/views/flow/component/sqjl/detail.jsx
new file mode 100644
index 0000000..5994c1d
--- /dev/null
+++ b/src/views/flow/component/sqjl/detail.jsx
@@ -0,0 +1,555 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 16:45:00
+ * @LastEditTime: 2025-05-13 17:04:37
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 申请记录详情
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { TextareaItem, Button, Modal, Drawer, Radio } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+
+import { sqjl_1, sqjl_2, sqjl_3, applyClose_1 } from '../../../../assets/img';
+import NavBarPage from '../../../../components/NavBarPage';
+import DingUpload from '../../../../components/DingUpload';
+import * as $$ from '../../../../utils/utility';
+import './detail.less';
+
+// 审核接口
+function submit(type, data) {
+ let url = type === '回退申请' ? `caseTask/returnAudit` : type === '联合处置申请' ? `caseAssistApply/reviewCaseAssistApply` : `caseTask/windupAudit`;
+ return $$.ax.request({ url: url, type: 'post', service: 'mediate', data });
+}
+
+const SqjlDetail = () => {
+ const caseId = $$.getQueryString('caseId');
+ const caseTaskId = $$.getQueryString('caseTaskId');
+ const text = $$.getQueryString('text');
+ const btn = $$.getQueryString('btn');
+ const history = useHistory();
+
+ const [applyInfo, setApplyInfo] = useState({});
+ const [fileList, setFileList] = useState([]);
+ const [drawerVisible, setDrawerVisible] = useState(false);
+ const [submitting, setSubmitting] = useState(false);
+ const [cooperateDepts, setCooperateDepts] = useState([]); // 配合部门列表
+ const [auditForm, setAuditForm] = useState({
+ auditResult: '同意', // 审核结果: 同意/不同意
+ rejectReason: '', // 不同意的理由类型
+ content: '', // 审核意见内容
+ fileList: [], // 审核附件
+ });
+
+ useEffect(() => {
+ const record = $$.getLocal('sqjl_record') || {};
+ const { object } = record;
+ if (record.type === '回退申请') {
+ object.applyStatus = object.returnStatus;
+ object.applyTime = object.returnTime;
+ object.applyUnitName = object.returnUnitName;
+ object.applyUserName = object.returnUserName;
+ object.applyUserId = object.returnUserId;
+ }
+ if (record.type === '上报申请') {
+ object.applyStatus = object.applyStatus;
+ object.applyTime = object.appearTime;
+ object.applyUnitName = object.appearUnitName;
+ object.applyUserName = object.appearUserName;
+ object.applyUserId = object.appearUserId;
+ }
+ if (record.type === '司法确认申请') {
+ object.applyStatus = object.judicAudit === '24_00004-0' ? 0 : 1;
+ object.auditResult = object.judicAudit;
+ }
+ setApplyInfo(record?.object || {});
+ setFileList(record?.fileList?.[0]?.fileList || []);
+ $$.clearLocal('sqjl_record');
+ }, []);
+
+ // 获取申请状态图标
+ const getStatusImg = () => {
+ if (!applyInfo) return null;
+
+ // 未审核状态
+ if (applyInfo.auditResult === null || applyInfo.auditResult === undefined) {
+ return sqjl_1;
+ }
+ // 已审核状态
+ return applyInfo.auditResult === '24_00004-1' ? sqjl_2 : sqjl_3;
+ };
+
+ // 获取状态文本
+ const getStatusText = () => {
+ if (!applyInfo) return '';
+
+ if (applyInfo.auditResult === null || applyInfo.auditResult === undefined) {
+ return '待审核';
+ }
+ return applyInfo.auditResult === '24_00004-1' ? '审核通过' : '审核不通过';
+ };
+
+ // 打开审核抽屉
+ const handleShowAuditDrawer = () => {
+ setDrawerVisible(true);
+ };
+
+ // 关闭审核抽屉
+ const handleCloseAuditDrawer = () => {
+ setDrawerVisible(false);
+ };
+
+ // 更新审核表单
+ const handleAuditFormChange = (field, value) => {
+ setAuditForm((prev) => ({
+ ...prev,
+ [field]: value,
+ }));
+
+ // 如果切换了审核结果，重置理由
+ if (field === 'auditResult' && value === '同意') {
+ setAuditForm((prev) => ({
+ ...prev,
+ rejectReason: '',
+ content: '',
+ }));
+ }
+ };
+
+ // 提交审核
+ const handleSubmitAudit = async () => {
+ // 验证表单
+ if (!auditForm.auditResult) {
+ $$.showToast({ content: '请选择审核结果' });
+ return;
+ }
+
+ if (auditForm.auditResult === '不同意') {
+ if (text !== '联合处置申请') {
+ if (!auditForm.rejectReason) {
+ $$.showToast({ content: '请选择理由' });
+ return;
+ }
+
+ if (auditForm.rejectReason === '其他' && !auditForm.content) {
+ $$.showToast({ content: '请填写不同意的理由' });
+ return;
+ }
+ } else {
+ if (!auditForm.content) {
+ $$.showToast({ content: '请填写不同意的理由' });
+ return;
+ }
+ }
+ }
+
+ const params = {
+ caseId,
+ caseTaskId,
+ id: applyInfo?.id,
+ auditResult: auditForm.auditResult === '同意' ? '24_00004-1' : '24_00004-2',
+ auditContent:
+ auditForm.auditResult === '同意'
+ ? '同意'
+ : text === '联合处置申请'
+ ? auditForm.content
+ : auditForm.rejectReason === '其他'
+ ? auditForm.content
+ : auditForm.rejectReason,
+ };
+
+ global.setSpinning(true);
+ const res = await submit(text, params);
+ global.setSpinning(false);
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ handleCloseAuditDrawer();
+ // 返回两层
+ history.go(-2);
+ }
+ };
+
+ return (
+ <NavBarPage title={text || '申请详情'}>
+ <Scrollbars style={{ height: 'calc(100vh - 112px)', backgroundColor: '#F2F2F2' }}>
+ <div className="sqjl-detail">
+ <div className="sqjl-detail-card">
+ {getStatusImg() && (
+ <div className="sqjl-detail-status">
+ <img src={getStatusImg()} alt={getStatusText()} />
+ </div>
+ )}
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">申请时间</div>
+ <div className="sqjl-detail-value">{applyInfo.applyTime ? $$.timeFormat(applyInfo.applyTime) : '-'}</div>
+ </div>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">申请人</div>
+ <div className="sqjl-detail-value">
+ {applyInfo.applyUserName || '-'} {applyInfo.applyUnitName ? `(${applyInfo.applyUnitName})` : '-'}
+ </div>
+ </div>
+ {text === '上报申请' && (
+ <>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">上报意见</div>
+ <div className="sqjl-detail-dept">{applyInfo.appearContent}</div>
+ </div>
+ </>
+ )}
+ {text === '回退申请' && (
+ <>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">回退理由</div>
+ <div className="sqjl-detail-dept">{applyInfo.returnContent}</div>
+ </div>
+ </>
+ )}
+ {text === '联合处置申请' && (
+ <>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">添加配合部门</div>
+ <div className="sqjl-detail-value">
+ <div className="sqjl-detail-dept">{applyInfo.applyAssistUnitName}</div>
+ </div>
+ </div>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">添加理由</div>
+ <div className="sqjl-detail-dept">{applyInfo.applyContent || '-'}</div>
+ </div>
+ </>
+ )}
+ {text === '结案申请' && (
+ <>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">化解结果</div>
+ <div className="sqjl-detail-value">
+ <div className="sqjl-detail-dept">
+ {applyInfo.mediateResult === '24_00004-2' ? '化解不成功' : '化解成功'}
+ </div>
+ </div>
+ </div>
+ {applyInfo.mediateResult === '24_00004-2' && (
+ <>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">无法化解理由</div>
+ <div className="sqjl-detail-dept">
+ {applyInfo.failReason && (
+ <>
+ <div>1、调解过程中采取的措施及解决方案</div>
+ <div>{applyInfo.failReason}</div>
+ </>
+ )}
+ {applyInfo.failReasonTwo && (
+ <>
+ <div>2、最终难以调和的原因</div>
+ <div>{applyInfo.failReasonTwo}</div>
+ </>
+ )}
+ </div>
+ </div>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">结案意见</div>
+ <div className="sqjl-detail-dept">{applyInfo.windupContent || '-'}</div>
+ </div>
+ </>
+ )}
+ </>
+ )}
+ <div className="sqjl-detail-files">
+ <DingUpload
+ fileList={fileList}
+ disabled={true}
+ viewOnly={true}
+ title="附件材料"
+ mainId={caseTaskId}
+ ownerId={caseTaskId}
+ ownerType="CASE_TASK"
+ />
+ </div>
+ </div>
+
+ {/* 审核信息 */}
+ {applyInfo.auditTime && (
+ <div className="sqjl-detail-card sqjl-detail-audit-info">
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">审核时间</div>
+ <div className="sqjl-detail-value">{$$.timeFormat(applyInfo.auditTime)}</div>
+ </div>
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">审核人</div>
+ <div className="sqjl-detail-value">
+ {applyInfo.auditUserName || '-'} {applyInfo.auditUnitName ? `(${applyInfo.auditUnitName})` : '-'}
+ {applyInfo.auditPhone && <span className="sqjl-detail-phone"> {applyInfo.auditPhone}</span>}
+ </div>
+ </div>
+ {applyInfo.auditResultName && (
+ <div className="sqjl-detail-row">
+ <div className="sqjl-detail-label">审核意见</div>
+ <div className="sqjl-detail-value">{applyInfo.auditResultName}</div>
+ </div>
+ )}
+ </div>
+ )}
+ </div>
+ </Scrollbars>
+ {btn && (
+ <div className="sqjl-detail-bottom">
+ <Button type="primary" block onClick={handleShowAuditDrawer}>
+ 审核
+ </Button>
+ </div>
+ )}
+
+ {/* 审核抽屉 */}
+ <Drawer visible={drawerVisible} position="bottom" onMaskClick={handleCloseAuditDrawer}>
+ <div className="audit-drawer">
+ <div className="audit-drawer-header">
+ <div className="audit-drawer-title">审核</div>
+ <div className="audit-drawer-close" onClick={handleCloseAuditDrawer}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+
+ <div className="audit-drawer-content">
+ <div className="audit-drawer-scroll">
+ <div className="audit-section">
+ <div className="audit-section-title">审核结果</div>
+ <div className="audit-radio-group">
+ <div
+ className={`audit-radio-item ${auditForm.auditResult === '同意' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('auditResult', '同意')}
+ >
+ <span>同意</span>
+ {auditForm.auditResult === '同意' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ </div>
+ <div
+ className={`audit-radio-item ${auditForm.auditResult === '不同意' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('auditResult', '不同意')}
+ >
+ <span>不同意</span>
+ {auditForm.auditResult === '不同意' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ </div>
+ </div>
+ </div>
+
+ {auditForm.auditResult === '不同意' && (
+ <>
+ {text === '回退申请' && (
+ <>
+ <div className="audit-section required-field">
+ <div className="audit-section-title">理由说明</div>
+ <div className="audit-reason-group">
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '回退理由不充分' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '回退理由不充分')}
+ >
+ {auditForm.rejectReason === '回退理由不充分' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>回退理由不充分</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '回退超迟' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '回退超迟')}
+ >
+ {auditForm.rejectReason === '回退超迟' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>回退超迟</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '其他')}
+ >
+ {auditForm.rejectReason === '其他' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>其他</span>
+ </div>
+ </div>
+ </div>
+ {auditForm.rejectReason === '其他' && (
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder={`请填写不同意${text}的理由`}
+ value={auditForm.content}
+ onChange={(value) => handleAuditFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ )}
+ </>
+ )}
+ {text === '上报申请' && (
+ <>
+ <div className="audit-section required-field">
+ <div className="audit-section-title">理由说明</div>
+ <div className="audit-reason-group">
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '上报理由不充分' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '上报理由不充分')}
+ >
+ {auditForm.rejectReason === '上报理由不充分' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>上报理由不充分</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '上报延迟' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '上报延迟')}
+ >
+ {auditForm.rejectReason === '上报延迟' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>上报延迟</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '其他')}
+ >
+ {auditForm.rejectReason === '其他' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>其他</span>
+ </div>
+ </div>
+ </div>
+ {auditForm.rejectReason === '其他' && (
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder={`请填写不同意${text}的理由`}
+ value={auditForm.content}
+ onChange={(value) => handleAuditFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ )}
+ </>
+ )}
+ {text === '联合处置申请' && (
+ <>
+ <div className="audit-section required-field">
+ <div className="audit-section-title">理由说明</div>
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder={`请填写不同意${text}的理由`}
+ value={auditForm.content}
+ onChange={(value) => handleAuditFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+ </>
+ )}
+ {text === '结案申请' && (
+ <div className="audit-section required-field">
+ <div className="audit-section-title">理由说明</div>
+ <div className="audit-reason-group">
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '材料不完整' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '材料不完整')}
+ >
+ {auditForm.rejectReason === '材料不完整' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>材料不完整</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '办理流程有问题' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '办理流程有问题')}
+ >
+ {auditForm.rejectReason === '办理流程有问题' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>办理流程有问题</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '当事人不满意调解结果' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '当事人不满意调解结果')}
+ >
+ {auditForm.rejectReason === '当事人不满意调解结果' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>当事人不满意调解结果</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
+ onClick={() => handleAuditFormChange('rejectReason', '其他')}
+ >
+ {auditForm.rejectReason === '其他' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>其他</span>
+ </div>
+ </div>
+ {auditForm.rejectReason === '其他' && (
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder={`请填写不同意${text}的具体理由`}
+ value={auditForm.content}
+ onChange={(value) => handleAuditFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ )}
+ </div>
+ )}
+ </>
+ )}
+
+ <div className="audit-attach-section">
+ <DingUpload
+ fileList={auditForm.fileList}
+ title="附件材料"
+ subtitle="可添加审核相关附件"
+ mainId={caseId}
+ ownerId={applyInfo?.id || ''}
+ ownerType="22_00018-513"
+ />
+ </div>
+ </div>
+
+ <div className="audit-footer">
+ <Button type="primary" block onClick={handleSubmitAudit} loading={submitting}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </div>
+ </Drawer>
+ </NavBarPage>
+ );
+};
+
+export default SqjlDetail;
diff --git a/src/views/flow/component/sqjl/detail.less b/src/views/flow/component/sqjl/detail.less
new file mode 100644
index 0000000..9651af0
--- /dev/null
+++ b/src/views/flow/component/sqjl/detail.less
@@ -0,0 +1,480 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 16:45:00
+ * @LastEditTime: 2025-05-13 17:07:31
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 申请记录详情样式
+ */
+
+.sqjl-detail {
+}
+
+.sqjl-detail-card {
+ background-color: #fff;
+ border-radius: 4px;
+ padding: 16px;
+ position: relative;
+ overflow: hidden;
+}
+
+.sqjl-detail-status {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ z-index: 1;
+
+ img {
+ width: 80px;
+ height: 80px;
+ opacity: 0.6;
+ }
+}
+
+.sqjl-detail-row {
+ margin-bottom: 8px;
+ position: relative;
+ z-index: 2;
+}
+
+.sqjl-detail-label {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 0px;
+}
+
+.sqjl-detail-value {
+ font-size: 15px;
+ color: #333;
+ line-height: 1.5;
+ word-break: break-all;
+}
+
+.content-row {
+ .sqjl-detail-value {
+ background-color: #f7f8fa;
+ padding: 12px;
+ border-radius: 4px;
+ min-height: 80px;
+ }
+}
+
+.sqjl-detail-files {
+ margin-top: 24px;
+ position: relative;
+ z-index: 2;
+}
+
+.sqjl-detail-files-title {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 12px;
+}
+
+.sqjl-detail-files-list {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+}
+
+.sqjl-detail-file-item {
+ display: flex;
+ align-items: center;
+ background-color: #f2f7fe;
+ padding: 12px;
+ border-radius: 4px;
+}
+
+.sqjl-detail-file-icon {
+ width: 24px;
+ height: 24px;
+ margin-right: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .icon-link {
+ display: inline-block;
+ width: 20px;
+ height: 20px;
+ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z' fill='%231a6fb8'/%3E%3C/svg%3E");
+ background-size: contain;
+ }
+}
+
+.sqjl-detail-file-info {
+ flex: 1;
+}
+
+.sqjl-detail-file-name {
+ font-size: 14px;
+ color: #333;
+ margin-bottom: 4px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.sqjl-detail-file-size {
+ font-size: 12px;
+ color: #1a6fb8;
+}
+
+.sqjl-detail-phone {
+ color: #666;
+}
+
+.sqjl-detail-dept {
+ margin-bottom: 8px;
+ padding: 2px 0;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ &-tag {
+ width: 82px;
+ height: 30px;
+ background: #ffece8;
+ border-radius: 2px;
+ font-size: 14px;
+ color: #f53f3f;
+ text-align: center;
+ line-height: 30px;
+ }
+}
+
+.sqjl-detail-audit-info {
+ margin-top: 12px;
+}
+
+/* 审核区域样式 */
+.sqjl-detail-audit {
+ background-color: #fff;
+ border-radius: 4px;
+ margin-top: 12px;
+ padding: 16px;
+}
+
+.sqjl-detail-audit-content {
+ margin-bottom: 20px;
+}
+
+.sqjl-detail-audit-title {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 8px;
+}
+
+.sqjl-detail-btns {
+ display: flex;
+ justify-content: space-between;
+ gap: 16px;
+ margin-top: 24px;
+}
+
+.sqjl-detail-btn {
+ flex: 1;
+ height: 44px;
+ border-radius: 22px;
+ font-size: 16px;
+ font-weight: 500;
+}
+
+.sqjl-detail-btn-reject {
+ background-color: #fff;
+ color: #ff4d4f;
+ border: 1px solid #ff4d4f;
+}
+
+.sqjl-detail-btn-approve {
+ background-color: #1a6fb8;
+ color: #fff;
+ border: none;
+}
+
+.sqjl-detail-bottom {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: #fff;
+ padding: 12px;
+ // 这里不要内边距
+ box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.05);
+}
+
+/* 审核抽屉样式 */
+.audit-drawer {
+ background-color: #fff;
+ border-top-left-radius: 12px;
+ border-top-right-radius: 12px;
+ overflow: hidden;
+
+ .audit-drawer-content {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+
+ .audit-drawer-scroll {
+ flex: 1;
+ overflow-y: auto;
+ max-height: 40vh;
+ -webkit-overflow-scrolling: touch;
+ padding: 16px;
+ }
+
+ .audit-footer {
+ position: sticky;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 16px;
+ background: #fff;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
+ }
+}
+
+.audit-drawer-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+}
+
+.audit-drawer-title {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+}
+
+.audit-drawer-close {
+ width: 24px;
+ height: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+}
+
+.audit-drawer-close-icon {
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ position: relative;
+
+ &:before,
+ &:after {
+ content: '';
+ position: absolute;
+ top: 50%;
+ left: 0;
+ width: 100%;
+ height: 1px;
+ background-color: #999;
+ }
+
+ &:before {
+ transform: rotate(45deg);
+ }
+
+ &:after {
+ transform: rotate(-45deg);
+ }
+}
+
+.audit-unit-value-tag {
+ display: inline-block;
+ background: #f2f2f6;
+ border-radius: 4px;
+ padding: 4px 8px;
+}
+
+.audit-section {
+ padding: 12px 0;
+
+ &.required-field {
+ .audit-section-title:before {
+ content: '*';
+ color: #f5222d;
+ margin-right: 4px;
+ position: absolute;
+ left: -8px;
+ }
+ }
+
+ &-select {
+ color: rgba(23, 26, 29, 0.4);
+ }
+
+ &-flex {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ align-items: center;
+ &.required-field {
+ .audit-section-title:before {
+ content: '*';
+ color: #f5222d;
+ margin-right: 4px;
+ position: absolute;
+ left: -8px;
+ }
+ }
+ }
+}
+
+.audit-section-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 16px;
+ position: relative;
+}
+
+.audit-radio-group {
+ display: flex;
+ gap: 16px;
+ width: 100%;
+}
+
+.audit-radio-item {
+ display: flex;
+ align-items: center;
+ padding: 12px 16px;
+ background-color: #f5f5f5;
+ border-radius: 8px;
+ flex: 1;
+ justify-content: center;
+
+ &.active {
+ background-color: #e7f1fd;
+
+ span {
+ color: #1a6fb8;
+ }
+ }
+
+ span {
+ font-size: 16px;
+ color: #333;
+ }
+}
+
+.audit-radio-checked {
+ margin-left: 8px;
+ width: 18px;
+ height: 18px;
+}
+
+.audit-radio-unchecked {
+ margin-left: 8px;
+ width: 18px;
+ height: 18px;
+ border: 1px solid #d9d9d9;
+ border-radius: 50%;
+ background-color: #fff;
+}
+
+.audit-reason-group {
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+}
+
+.audit-reason-item {
+ display: flex;
+ align-items: center;
+ padding: 12px 16px;
+ background-color: #f5f5f5;
+ border-radius: 8px;
+
+ &.active {
+ background-color: #e7f1fd;
+
+ span {
+ color: #1a6fb8;
+ }
+ }
+
+ span {
+ margin-left: 8px;
+ font-size: 16px;
+ color: #333;
+ }
+}
+
+.audit-content-wrapper {
+ margin-top: 16px;
+ padding: 0 2px;
+}
+
+.audit-attach-section {
+ padding: 16px 0;
+ // border-top: 1px solid #f0f0f0;
+}
+
+.audit-attach-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 16px;
+
+ span {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+}
+
+.audit-attach-add {
+ width: 24px;
+ height: 24px;
+ background-color: #f0f0f0;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+}
+
+.audit-attach-add-icon {
+ display: inline-block;
+ width: 14px;
+ height: 14px;
+ position: relative;
+
+ &:before,
+ &:after {
+ content: '';
+ position: absolute;
+ background-color: #666;
+ }
+
+ &:before {
+ top: 0;
+ left: 6px;
+ width: 2px;
+ height: 14px;
+ }
+
+ &:after {
+ top: 6px;
+ left: 0;
+ width: 14px;
+ height: 2px;
+ }
+}
+
+.audit-footer {
+ background-color: #fff;
+ // margin-top: 32px;
+ padding: 12px 0;
+ &-gap {
+ background-color: #f2f2f2;
+ height: 32px;
+ }
+}
diff --git a/src/views/flow/component/sqjl/index.jsx b/src/views/flow/component/sqjl/index.jsx
new file mode 100644
index 0000000..20f2914
--- /dev/null
+++ b/src/views/flow/component/sqjl/index.jsx
@@ -0,0 +1,138 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 16:40:00
+ * @LastEditTime: 2025-04-14 16:08:55
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 申请记录组件
+ */
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import './index.less';
+import { Scrollbars } from 'react-custom-scrollbars';
+import * as $$ from '../../../../utils/utility';
+// 列表接口
+function listMyApplyRecordApi(data) {
+ return $$.ax.request({ url: `caseTask/listMyApplyRecord`, type: 'get', service: 'mediate', data });
+}
+
+const Sqjl = () => {
+ const history = useHistory();
+ const [recordList, setRecordList] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const caseId = $$.getQueryString('caseId');
+ const caseTaskId = $$.getQueryString('caseTaskId');
+
+ // 获取申请记录列表
+ useEffect(() => {
+ fetchRecordList();
+ }, []);
+
+ // 获取申请记录数据
+ const fetchRecordList = async () => {
+ global.setSpinning(true);
+ const res = await listMyApplyRecordApi({ caseId });
+ global.setSpinning(false);
+ if (res.type) {
+ setRecordList(res.data || []);
+ }
+ };
+
+ // 获取申请状态标签
+ const getStatusTag = (object) => {
+ if (object.applyStatus === 0) {
+ return { text: '待审核', className: 'sqjl-tag-pending' };
+ } else {
+ if (object.auditResult) {
+ // 已审核
+ if (object.auditResult === '24_00004-1') {
+ return { text: '审核通过', className: 'sqjl-tag-passed' };
+ } else {
+ return { text: '审核不通过', className: 'sqjl-tag-rejected' };
+ }
+ }
+ }
+ };
+
+ // 处理查看详情
+ const handleViewDetail = (record) => {
+ if (record.object?.applyStatus === 0 && $$.getLocal('sqjl')) {
+ $$.setLocal('sqjl_record', record);
+ history.push(`/flow/sqjl/detail?caseId=${caseId}&caseTaskId=${caseTaskId}&text=${record.type}&btn=true`);
+ } else {
+ // 跳转将对象放入缓存中
+ $$.setLocal('sqjl_record', record);
+ history.push(`/flow/sqjl/detail?caseId=${caseId}&caseTaskId=${caseTaskId}&text=${record.type}`);
+ }
+ };
+
+ return (
+ <div className="sqjl-container">
+ <div className="sqjl-header">共{recordList.length}条记录</div>
+ <Scrollbars style={{ height: 'calc(100vh - 152px)', backgroundColor: '#F2F2F2' }}>
+ <div className="sqjl-list">
+ {recordList.map((record) => {
+ const { object } = record;
+ if (record.type === '回退申请') {
+ object.applyStatus = object.returnStatus;
+ object.applyTime = object.returnTime;
+ object.applyUnitName = object.returnUnitName;
+ object.applyUserName = object.returnUserName;
+ object.applyUserId = object.returnUserId;
+ }
+ if (record.type === '上报申请') {
+ object.applyStatus = object.applyStatus;
+ object.applyTime = object.appearTime;
+ object.applyUnitName = object.appearUnitName;
+ object.applyUserName = object.appearUserName;
+ object.applyUserId = object.appearUserId;
+ }
+ if (record.type === '司法确认申请') {
+ object.applyStatus = object.judicAudit === '24_00004-0' ? 0 : 1;
+ object.auditResult = object.judicAudit;
+ }
+ const statusTag = getStatusTag(object);
+ const isPending = !object.auditResult;
+
+ return (
+ <div key={object.id} className="sqjl-item">
+ <div className="sqjl-item-header">
+ <div className="sqjl-item-type">{record.type}</div>
+ <div className="sqjl-item-tags">
+ <span className={`sqjl-tag ${statusTag.className}`}>{statusTag.text}</span>
+ </div>
+ </div>
+ <div className="sqjl-item-content">
+ <div className="sqjl-item-info">
+ <div className="sqjl-item-row">
+ <span className="sqjl-item-label">申请时间：</span>
+ <span className="sqjl-item-value">{$$.timeFormat(object.applyTime)}</span>
+ </div>
+ <div className="sqjl-item-row">
+ <span className="sqjl-item-label">申请人：</span>
+ <span className="sqjl-item-value">{object.applyUserName}</span>
+ </div>
+ <div className="sqjl-item-row">
+ <span className="sqjl-item-label">申请部门：</span>
+ <span className="sqjl-item-value">{object.applyUnitName}</span>
+ </div>
+ </div>
+ <div className="sqjl-item-action">
+ <button className="sqjl-btn sqjl-btn-primary" onClick={() => handleViewDetail(record)}>
+ {isPending ? '审核' : '查看'}
+ </button>
+ </div>
+ </div>
+ </div>
+ );
+ })}
+
+ {recordList.length === 0 && !loading && <div className="sqjl-empty">暂无申请记录</div>}
+ </div>
+ </Scrollbars>
+ </div>
+ );
+};
+
+export default Sqjl;
diff --git a/src/views/flow/component/sqjl/index.less b/src/views/flow/component/sqjl/index.less
new file mode 100644
index 0000000..056b95e
--- /dev/null
+++ b/src/views/flow/component/sqjl/index.less
@@ -0,0 +1,151 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 16:40:00
+ * @LastEditTime: 2025-04-14 10:53:10
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 申请记录组件样式
+ */
+
+.sqjl-container {
+ background-color: #f5f5f5;
+}
+
+.sqjl-header {
+ padding: 12px 16px;
+ font-size: 14px;
+ color: #666;
+ background-color: #f5f5f5;
+}
+
+.sqjl-list {
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ padding: 0 12px;
+ margin-bottom: 20px;
+}
+
+.sqjl-item {
+ background-color: #fff;
+ border-radius: 4px;
+ overflow: hidden;
+}
+
+.sqjl-item-header {
+ padding: 12px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ border-bottom: 1px dashed #f2f2f2;
+}
+
+.sqjl-item-type {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+}
+
+.sqjl-item-tags {
+ display: flex;
+ gap: 8px;
+}
+
+.sqjl-tag {
+ padding: 3px 6px;
+ border-radius: 4px;
+ font-size: 12px;
+ color: #fff;
+}
+
+.sqjl-tag-timeout {
+ background-color: #f53f3f;
+}
+
+.sqjl-tag-pending {
+ color: #ff7d00;
+ background-color: #fff7e8;
+}
+
+.sqjl-tag-passed {
+ color: #00b42a;
+ background-color: #e8ffea;
+}
+
+.sqjl-tag-rejected {
+ color: #f53f3f;
+ background-color: #ffece8;
+}
+
+.sqjl-item-content {
+ padding: 12px;
+ display: flex;
+ justify-content: space-between;
+}
+
+.sqjl-item-info {
+ flex: 1;
+}
+
+.sqjl-item-row {
+ margin-bottom: 8px;
+ display: flex;
+ font-size: 14px;
+ color: #666;
+}
+
+.sqjl-item-row:last-child {
+ margin-bottom: 0;
+}
+
+.sqjl-item-label {
+ min-width: 70px;
+ color: #999;
+}
+
+.sqjl-item-value {
+ color: #333;
+}
+
+.sqjl-item-action {
+ display: flex;
+ align-items: end;
+}
+
+.sqjl-btn {
+ min-width: 64px;
+ height: 32px;
+ border-radius: 20px;
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ border: none;
+ padding: 0 16px;
+}
+
+.sqjl-btn-primary {
+ background-color: #1a6fb8;
+ color: #fff;
+}
+
+.sqjl-btn-default {
+ background-color: #f2f3f5;
+ color: #1a6fb8;
+ border: 1px solid #dcdee0;
+}
+
+.sqjl-empty {
+ padding: 40px 0;
+ text-align: center;
+ color: #999;
+ font-size: 14px;
+}
+
+.audit-content-wrapper {
+ border: 1px solid #1a6fb8;
+ border-radius: 4px;
+ padding: 4px 8px;
+}
diff --git a/src/views/flow/component/sxbl/index.jsx b/src/views/flow/component/sxbl/index.jsx
new file mode 100644
index 0000000..b8168d2
--- /dev/null
+++ b/src/views/flow/component/sxbl/index.jsx
@@ -0,0 +1,465 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-09 10:10:06
+ * @LastEditTime: 2025-05-13 16:29:03
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description:办理信息
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import { Popover, Button, Upload, Drawer, TextareaItem, Form } from 'dingtalk-design-mobile';
+import { useHistory } from 'react-router-dom';
+import { Scrollbars } from 'react-custom-scrollbars';
+import { CloseOutlined, RightArrow2Outlined } from 'dd-icons';
+
+import UserTag from '../../../../components/UserTag';
+import MyModal from '../../../../components/MyModal';
+import DingUpload from '../../../../components/DingUpload';
+import * as $$ from '../../../../utils/utility';
+import { select_null, sxbl_1 } from '../../../../assets/img';
+
+import './index.less';
+
+const appUrl = $$.appUrl;
+
+// 获取id
+function getNewTimeIdApi(id) {
+ return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
+}
+
+// 联合处置申请
+function postAssistApply(data) {
+ return $$.ax.request({ url: `caseAssistApply/addCaseAssistApply`, type: 'post', service: 'mediate', data });
+}
+export const Sxbl = ({ editShow, wantUser, staticButtonList, caseId, caseTaskId, recordList, onClose }) => {
+ const history = useHistory();
+ const [forms] = Form.useForm();
+ const [popoverVisible, setPopoverVisible] = useState(false);
+ const [visible, setVisible] = useState(false);
+ const [detailVisible, setDetailVisible] = useState(false);
+ const [jointHandleVisible, setJointHandleVisible] = useState(false);
+ const [jointHandleNewId, setJointHandleNewId] = useState('');
+ const [currentRecord, setCurrentRecord] = useState({});
+ const [selectedDepts, setSelectedDepts] = useState([]);
+ const [reason, setReason] = useState('');
+ const [fileList, setFileList] = useState([]);
+ const [formData, setFormData] = useState({
+ applyContent: '',
+ });
+
+ // 查看详情处理函数
+ const handleViewDetail = (record) => {
+ setCurrentRecord(record);
+ setDetailVisible(true);
+ };
+
+ // 处理函数
+ const bottomOnclick = () => {
+ setVisible(true);
+ };
+
+ // 关闭抽屉
+ const handleClose = () => {
+ setVisible(false);
+ };
+
+ // 关闭详情抽屉
+ const handleCloseDetail = () => {
+ setDetailVisible(false);
+ };
+
+ // 关闭联合处置申请抽屉
+ const handleCloseJointHandle = () => {
+ setJointHandleVisible(false);
+ };
+
+ // 添加办理记录
+ const handleAddRecord = () => {
+ history.push(`/gzdyh/addRecord?caseId=${caseId}&caseTaskId=${caseTaskId}`);
+ handleClose();
+ };
+
+ // 申请结案
+ const handleApplyClose = () => {
+ // 先判断办理记录是否为空，为空时提醒请先添加办理记录
+ if (recordList.length === 0) {
+ $$.showToast({ content: '请先添加办理记录' });
+ return;
+ }
+ history.push(`/flow/applyClose?caseId=${caseId}&caseTaskId=${caseTaskId}`);
+ handleClose();
+ };
+
+ // 申请联合处置
+ const handleJointHandle = () => {
+ setJointHandleVisible(true);
+ getNewTimeId();
+ handleClose();
+ };
+
+ //获取id
+ const getNewTimeId = async () => {
+ const res = await getNewTimeIdApi();
+ if (res.type) {
+ setJointHandleNewId(res.data);
+ }
+ };
+
+ // 处理联合处置提交
+ const handleSubmitJointHandle = () => {
+ // 此处应添加表单验证逻辑
+ if (!selectedDepts.length) {
+ $$.showToast({ content: '请选择配合部门' });
+ return;
+ }
+ if (!formData.applyContent) {
+ $$.showToast({ content: '请填写添加理由' });
+ return;
+ }
+ handleJoint({
+ applyAssistUnitId: selectedDepts.map((dept) => dept.value)?.join(','),
+ applyAssistUnitName: selectedDepts.map((dept) => dept.label)?.join(','),
+ applyContent: formData.applyContent,
+ caseId,
+ id: jointHandleNewId,
+ });
+ };
+
+ //联合处置请求
+ const handleJoint = async (data) => {
+ const res = await postAssistApply(data);
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交申请成功！' });
+ handleCloseJointHandle();
+ }
+ };
+
+ // 移除已选择的部门
+ const handleRemoveDept = (value) => {
+ setSelectedDepts(selectedDepts.filter((dept) => dept.value !== value));
+ };
+
+ // 指派处理函数
+ const handleAssign = () => {
+ history.push(`/gzdyh/selectPerson?type=1&caseId=${caseId}&caseTaskId=${caseTaskId}`);
+ };
+
+ // 修改办理记录
+ const handleEdit = () => {
+ history.push(`/gzdyh/addRecord?mainId=${currentRecord.id}&caseId=${caseId}&caseTaskId=${caseTaskId}`);
+ setDetailVisible(false);
+ $$.setSessionStorage('sxbl_currentRecord', currentRecord);
+ };
+
+ // 预览文件
+ const onPreview = async (file) => {
+ const src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ window.open(src);
+ // if (file.cat === '22_00017-6') {
+ // // 文件预览
+ // } else {
+ // // 图片文件，使用模态框预览
+ // setModalImg({ visible: true, url: src });
+ // }
+ };
+
+ // 处理附件变化
+ const handleAttachmentChange = (info) => {
+ setFileList(info.fileList);
+ if (info?.file?.status === 'done') {
+ $$.showToast({ content: '上传成功' });
+ } else if (info?.file?.status === 'error') {
+ $$.showToast({ content: '上传失败，请重试' });
+ }
+ };
+
+ // 处理理由变化
+ const handleReasonChange = (value) => {
+ setFormData({
+ ...formData,
+ applyContent: value,
+ });
+ };
+
+ // 更新联合处置的部门
+ useEffect(() => {
+ let data = $$.getLocal('selectDept');
+ if (data) {
+ setSelectedDepts(data);
+ $$.clearLocal('selectDept');
+ }
+ }, [$$.getLocal('selectDept')]);
+
+ const renderActionButtons = () => {
+ const buttonMap = {
+ tjbljl: {
+ className: 'action-btn action-btn-primary',
+ onClick: handleAddRecord,
+ label: '添加办理记录',
+ },
+ jasq: {
+ className: 'action-btn action-btn-success',
+ onClick: handleApplyClose,
+ label: '申请结案',
+ },
+ lhczsq: {
+ className: 'action-btn action-btn-warning',
+ onClick: handleJointHandle,
+ label: '申请联合处置',
+ },
+ };
+
+ return staticButtonList.map((btn) => {
+ const buttonConfig = buttonMap[btn.id];
+ if (!buttonConfig) return null;
+
+ return (
+ <div key={btn.id} className={buttonConfig.className} onClick={buttonConfig.onClick}>
+ {btn.label}
+ </div>
+ );
+ });
+ };
+
+ return (
+ <>
+ <Scrollbars style={{ height: editShow ? 'calc(100vh - 172px)' : 'calc(100vh - 104px)', backgroundColor: '#F2F2F2' }}>
+ <div className="sxbl-info">
+ <div className="public-space"></div>
+ <div className="sxbl-card">
+ <div className="sxbl-manager">
+ <div className="sxbl-card-item">
+ <div className="sxbl-title">经办人</div>
+ {wantUser?.handleUserName ? (
+ <>
+ {/* onClose需要调用一个删除接口 */}
+ <UserTag name={wantUser.handleUserName} value={wantUser.handleUserId} onClose={() => onClose()} />
+ <div className="sxbl-card-item-img">
+ <img src={sxbl_1} alt="关闭" />
+ </div>
+ </>
+ ) : (
+ <div className="sxbl-desc">
+ <span>指派一名经办人，及时跟进矛盾化解工作</span>
+ <div className="sxbl-card-tag public-tag5 public-tag5-blue" onClick={handleAssign}>
+ 指派
+ </div>
+ </div>
+ )}
+ </div>
+ <div className="sxbl-record-list">
+ {recordList?.length > 0 && (
+ <div className="sxbl-record-title">
+ 共<span className="public-color">{recordList.length}</span>条办理记录
+ </div>
+ )}
+ {recordList?.length > 0 ? (
+ recordList?.map((record, index) => (
+ <div className="sxbl-record-item" key={record.id}>
+ <div className="sxbl-record-header">
+ <div className="sxbl-record-dept">
+ <span className="sxbl-dept-name">{record.handleUnitName}</span>
+ <span className={`sxbl-dept-tag sxbl-dept-tag-${record.handleType === 2 ? 'remark' : 'hostOrg'}`}>
+ {record.handleType === 2 ? '配合部门' : '承办部门'}
+ </span>
+ </div>
+ </div>
+ <Popover visible={popoverVisible} content={record.handleContent} placement="bottom">
+ <div
+ onClick={() => {
+ setPopoverVisible(true);
+ }}
+ className="sxbl-record-content"
+ >
+ {record.handleContent}
+ </div>
+ </Popover>
+ {/* 虚线分割线 */}
+ <div className="sxbl-record-line"></div>
+ <div className="sxbl-record-footer">
+ <div className="sxbl-record-time">{record.createTime}</div>
+ <div className="sxbl-record-view-tag" onClick={() => handleViewDetail(record)}>
+ 查看
+ </div>
+ </div>
+ </div>
+ ))
+ ) : (
+ <div className="sxbl-record-empty">
+ <img src={select_null} alt="尚未添加办理记录" />
+ <div className="sxbl-record-empty-text">尚未添加办理记录</div>
+ </div>
+ )}
+ {recordList?.length > 0 && <div className="myList-loading">已加载全部数据</div>}
+ </div>
+ </div>
+ </div>
+ </div>
+ </Scrollbars>
+ {editShow && (
+ <div className="flow-bottom-button">
+ <Button type="primary" onClick={bottomOnclick}>
+ 办理
+ </Button>
+ </div>
+ )}
+
+ {visible && (
+ <>
+ <div className="action-mask" onClick={handleClose}></div>
+ <div className="action-panel">
+ <div className="action-buttons">
+ {renderActionButtons()}
+ <div className="action-btn-cancel">
+ <div className="close-btn" onClick={handleClose}>
+ <CloseOutlined />
+ </div>
+ </div>
+ </div>
+ </div>
+ </>
+ )}
+
+ {/* 办理记录抽屉 */}
+ <Drawer visible={detailVisible} onClose={handleCloseDetail} position="bottom">
+ <div className="record-detail">
+ <div className="record-detail-title">办理记录详情</div>
+
+ <div className="record-detail-item">
+ <div className="record-detail-label">反馈时间</div>
+ <div className="record-detail-value">{currentRecord.createTime || '-'}</div>
+ </div>
+
+ <div className="record-detail-item">
+ <div className="record-detail-label">反馈部门</div>
+ <div className="record-detail-value">
+ {currentRecord.handleUnitName || '-'}
+ <span className={`sxbl-dept-tag sxbl-dept-tag-${currentRecord.handleType === 2 ? 'remark' : 'hostOrg'}`}>
+ {currentRecord.handleType === 2 ? '配合部门' : '承办部门'}
+ </span>
+ </div>
+ </div>
+
+ <div className="record-detail-item">
+ <div className="record-detail-label">操作人</div>
+ <div className="record-detail-value">
+ {currentRecord.handleUserName} {currentRecord.mobile || ''}
+ </div>
+ </div>
+
+ <div className="record-detail-item">
+ <div className="record-detail-label">办理意见</div>
+ <div className="record-detail-value record-detail-content">{currentRecord.handleContent || '-'}</div>
+ </div>
+
+ {currentRecord?.fileInfoList && currentRecord?.fileInfoList?.length > 0 && (
+ <div className="record-detail-item">
+ <div className="record-detail-label">办理附件</div>
+ <div className="record-detail-files">
+ <>
+ <Upload
+ label=""
+ disabled
+ onPreview={onPreview}
+ fileList={currentRecord.fileInfoList}
+ type="form-upload"
+ accept="*"
+ previewContent="预览"
+ showUploadList={{
+ showRemoveIcon: false,
+ showUploadBtn: false,
+ }}
+ className="daxx-upload-preview-only"
+ />
+ </>
+ </div>
+ </div>
+ )}
+
+ <div className="record-detail-footer">
+ <Button type="primary" block onClick={handleEdit}>
+ 修改
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+
+ {/* 联合处置申请 */}
+ <Drawer visible={jointHandleVisible} onClose={handleCloseJointHandle} position="bottom">
+ <div className="joint-handle-drawer">
+ <div className="joint-handle-title">联合处置申请</div>
+ <Scrollbars style={{ height: '45vh', marginBottom: '68px' }}>
+ <div className="joint-handle-form">
+ <div className="joint-handle-item">
+ <div className="joint-handle-label joint-handle-label-title">
+ <div className="form-label">
+ <span className="required-mark">*</span>
+ 添加配合部门
+ <span className="optional-mark">(可多选)</span>
+ </div>
+ <div
+ className="joint-handle-select"
+ onClick={() => history.push(`/gzdyh/selectPerson?type=2&caseId=${caseId}&caseTaskId=${caseTaskId}&isMultiple=true`)}
+ >
+ <span>选择</span>
+ <span className="joint-handle-arrow">
+ <RightArrow2Outlined style={{ fontSize: '16px' }} />
+ </span>
+ </div>
+ </div>
+ <div className="joint-handle-value">
+ {selectedDepts.length > 0 ? (
+ // 循环
+ <div className="joint-handle-dept-tags">
+ {selectedDepts.map((dept) => (
+ <UserTag key={dept.value} viewBtn={false} name={dept.label} value={dept.value} onClose={() => handleRemoveDept(dept.value)} />
+ ))}
+ </div>
+ ) : null}
+ </div>
+ </div>
+
+ <div className="joint-handle-item">
+ <div className="form-label">
+ <span className="required-mark">*</span>
+ 添加理由
+ </div>
+ <div className="joint-handle-value">
+ <TextareaItem
+ placeholder="请填写"
+ value={formData.applyContent}
+ onChange={handleReasonChange}
+ className="joint-handle-textarea"
+ rows={5}
+ />
+ </div>
+ </div>
+
+ <div className="joint-handle-item">
+ <DingUpload
+ title="附件材料"
+ subtitle="可添加申请联合处置相关附件"
+ fileList={fileList}
+ onChange={handleAttachmentChange}
+ mainId={caseId || ''}
+ ownerId={jointHandleNewId || ''}
+ ownerType="22_00018-508"
+ tipText="支持扩展名：.rar .zip .doc .docx .pdf .jpg，30M以内"
+ btnText="上传文件"
+ />
+ </div>
+ </div>
+ </Scrollbars>
+ <div className="user-detail-footer">
+ <Button type="primary" block onClick={handleSubmitJointHandle}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+ </>
+ );
+};
+
+export default Sxbl;
diff --git a/src/views/flow/component/sxbl/index.less b/src/views/flow/component/sxbl/index.less
new file mode 100644
index 0000000..401e55a
--- /dev/null
+++ b/src/views/flow/component/sxbl/index.less
@@ -0,0 +1,619 @@
+.sxbl-info {
+ // padding: 0 16px;
+
+ .sxbl-card {
+ // box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+ // padding: 12px 16px;
+ &-item {
+ background-color: #fff;
+ padding: 12px;
+ position: relative;
+ &-img {
+ position: absolute;
+ right: 0;
+ bottom: 0;
+ width: 56px;
+ height: 56px;
+ cursor: pointer;
+ & img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+
+ &-tag {
+ width: 42px;
+ height: 20px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .sxbl-manager {
+ display: flex;
+ flex-direction: column;
+
+ .sxbl-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+ }
+
+ .sxbl-desc {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ gap: 8px;
+ }
+
+ .sxbl-record-list {
+ background-color: #f2f2f2;
+ border-radius: 4px;
+ padding: 12px;
+
+ .sxbl-record-title {
+ font-size: 14px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 12px;
+ }
+
+ .sxbl-record-item {
+ padding: 10px 12px;
+ background-color: #fff;
+ border-radius: 4px;
+ margin-bottom: 12px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .sxbl-record-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 8px;
+
+ .sxbl-record-dept {
+ display: flex;
+ align-items: center;
+
+ .sxbl-dept-name {
+ font-size: 14px;
+ font-weight: 500;
+ color: #333;
+ margin-right: 8px;
+ }
+
+ .sxbl-dept-tag {
+ font-size: 12px;
+ padding: 2px 6px;
+ border-radius: 2px;
+ display: inline-block;
+
+ &-remark {
+ background-color: #fff7e8;
+ color: #ff7d00;
+ }
+
+ &-hostOrg {
+ background-color: #e8f3ff;
+ color: #1a6fb8;
+ }
+ }
+ }
+
+ .sxbl-view-btn {
+ padding: 4px 12px;
+ background-color: #1890ff;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ font-size: 12px;
+ cursor: pointer;
+ }
+ }
+
+ .sxbl-record-content {
+ font-size: 14px;
+ color: #666;
+ line-height: 1.5;
+ margin-bottom: 8px;
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .sxbl-record-time {
+ font-size: 14px;
+ color: #999;
+ }
+ }
+ }
+ .sxbl-record-line {
+ width: 100%;
+ border-top: 1px dashed #f0f0f0;
+ margin: 8px 0;
+ }
+ .sxbl-record-footer {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+ .sxbl-record-view-tag {
+ font-size: 14px;
+ padding: 4px 16px;
+ background-color: #1a6fb8;
+ color: #fff;
+ border-radius: 20px;
+ // padding: 4px 8px;
+ cursor: pointer;
+ }
+ .sxbl-record-empty {
+ margin-top: 30%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ &-text {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 17px;
+ }
+ }
+ }
+ }
+}
+
+/* 提取部门标签样式到全局级别 */
+.sxbl-dept-tag {
+ font-size: 12px;
+ padding: 2px 6px;
+ border-radius: 2px;
+ display: inline-block;
+
+ &-remark {
+ background-color: #fff7e8;
+ color: #ff7d00;
+ }
+
+ &-hostOrg {
+ background-color: #e8f3ff;
+ color: #1a6fb8;
+ }
+}
+
+.action-mask {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background-color: rgba(0, 0, 0, 0.8);
+ z-index: 1000;
+}
+
+.action-panel {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ z-index: 1001;
+ animation: slideUp 0.3s ease-out;
+}
+
+@keyframes slideUp {
+ from {
+ transform: translateY(100%);
+ }
+ to {
+ transform: translateY(0);
+ }
+}
+
+.action-buttons {
+ padding: 16px 32px;
+ border-radius: 16px 16px 0 0;
+ position: relative;
+ padding-bottom: 16px; // 为底部关闭按钮留出空间
+
+ .close-btn {
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ background: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #000;
+ }
+
+}
+
+.action-btn {
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ font-size: 16px;
+ border-radius: 22px;
+ margin-bottom: 16px;
+ color: #fff;
+ &-cancel {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ &-primary {
+ background: #1a6fb8;
+ }
+
+ &-success {
+ background: #00b42a;
+ }
+
+ &-warning {
+ background: #ef6c24;
+ }
+
+ &-danger {
+ background: #f53f3f;
+ }
+}
+
+// 移除旧的Drawer样式
+// :global {
+// .action-drawer {
+// .dtm-drawer {
+// border-radius: 8px 8px 0 0;
+// }
+// }
+// }
+
+.record-detail {
+ padding: 16px;
+ background: #fff;
+
+ &-title {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 16px;
+ padding-bottom: 12px;
+ position: relative;
+
+ &::after {
+ content: '';
+ position: absolute;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ height: 1px;
+ background-color: #f0f0f0;
+ }
+ }
+
+ &-item {
+ margin-bottom: 16px;
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 8px;
+ }
+
+ &-value {
+ font-size: 15px;
+ color: #333;
+ word-break: break-all;
+ }
+
+ &-content {
+ line-height: 1.6;
+ white-space: pre-wrap;
+ }
+
+ &-sub {
+ color: #1a6fb8;
+ margin-left: 8px;
+ }
+
+ &-files {
+ margin-top: 8px;
+ & .dtm-upload-select {
+ display: none;
+ }
+ }
+
+ &-file {
+ display: flex;
+ align-items: center;
+ padding: 12px;
+ background: #f5f5f5;
+ border-radius: 4px;
+ margin-bottom: 8px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ &-icon {
+ width: 20px;
+ height: 20px;
+ margin-right: 8px;
+ background-color: #1a6fb8;
+ mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 0H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8l-8-8zm-2 19c-1.66 0-3-1.34-3-3s1.34-3 3-3 3 1.34 3 3-1.34 3-3 3zm3-10H5V3h10v6z'/%3E%3C/svg%3E");
+ mask-size: contain;
+ mask-position: center;
+ mask-repeat: no-repeat;
+ }
+
+ &-name {
+ flex: 1;
+ font-size: 14px;
+ color: #333;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ &-size {
+ font-size: 12px;
+ color: #999;
+ margin: 0 8px;
+ }
+
+ &-view {
+ color: #1a6fb8;
+ font-size: 14px;
+ }
+ }
+
+ &-footer {
+ margin-top: 24px;
+ }
+
+ &-title {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+ text-align: left;
+ margin-bottom: 24px;
+ }
+}
+
+.sxbl-record-view-tag {
+ display: inline-block;
+ color: #1a6fb8;
+ cursor: pointer;
+}
+
+/* 联合处置申请抽屉样式 */
+.joint-handle-drawer {
+ padding: 12px 16px 16px 16px;
+
+ .joint-handle-title {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 24px;
+ text-align: left;
+ }
+
+ .joint-handle-form {
+ margin-bottom: 24px;
+
+ .joint-handle-item {
+ margin-bottom: 20px;
+
+ .joint-handle-label {
+ font-size: 15px;
+ color: #333;
+ margin-bottom: 12px;
+ font-weight: 500;
+
+ &-title {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 0;
+ }
+
+ .required-mark {
+ color: #f5222d;
+ margin-right: 4px;
+ }
+
+ .optional-mark {
+ color: #999;
+ font-size: 13px;
+ font-weight: normal;
+ }
+ }
+
+ // 添加必填字段样式
+ .required-field {
+ position: relative;
+ padding-left: 0;
+
+ &::before {
+ content: '*';
+ color: #f5222d;
+ position: absolute;
+ left: -10px;
+ top: 0;
+ }
+ }
+
+ .joint-handle-value {
+ .joint-handle-selected-depts {
+ margin-bottom: 12px;
+ display: flex;
+ flex-wrap: wrap;
+
+ .joint-handle-dept-tag {
+ display: inline-flex;
+ align-items: center;
+ background-color: #f5f5f5;
+ border-radius: 4px;
+ padding: 8px 12px;
+ margin-right: 8px;
+ margin-bottom: 8px;
+ font-size: 14px;
+ color: #333;
+
+ .joint-handle-dept-close {
+ margin-left: 8px;
+ font-size: 16px;
+ color: #999;
+ font-weight: bold;
+ cursor: pointer;
+ }
+ }
+ }
+
+ .joint-handle-dept-tags {
+ display: flex;
+ flex-wrap: wrap;
+ margin-bottom: 12px;
+ gap: 8px;
+ :global {
+ .usertag-container {
+ margin-right: 8px;
+ margin-bottom: 8px;
+ }
+ }
+ }
+
+ .joint-handle-reason-buttons {
+ display: flex;
+ margin-bottom: 12px;
+
+ .joint-handle-reason-btn {
+ height: 32px;
+ line-height: 32px;
+ padding: 0 12px;
+ background-color: #fff;
+ border: 1px solid #e8e8e8;
+ border-radius: 16px;
+ margin-right: 12px;
+ font-size: 14px;
+ color: #333;
+ }
+ }
+
+ .joint-handle-textarea {
+ width: 100%;
+
+ :global {
+ .ddm-textarea-item {
+ border: 1px solid #e8e8e8;
+ border-radius: 4px;
+ padding: 4px 0;
+
+ .ddm-textarea-item-text {
+ font-size: 14px;
+ padding: 8px 12px;
+ }
+
+ .ddm-textarea-item-placeholder {
+ padding: 8px 12px;
+ color: #999;
+ }
+ }
+ }
+ }
+
+ .joint-handle-upload {
+ width: 100%;
+
+ :global {
+ .ddm-upload-form {
+ .ddm-upload-form-text {
+ color: #999;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .joint-handle-footer {
+ button {
+ height: 44px;
+ font-size: 16px;
+ }
+ }
+}
+
+.joint-handle-select {
+ border-radius: 4px;
+ // padding: 0 12px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: rgba(23, 26, 29, 0.4);
+
+ .joint-handle-arrow {
+ font-size: 16px;
+ color: #ccc;
+ font-weight: normal;
+ display: flex;
+ align-items: center;
+ }
+}
+
+/* 详情样式 */
+.record-detail {
+ padding: 16px;
+
+ .record-detail-title {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+ text-align: left;
+ margin-bottom: 24px;
+ }
+
+ .record-detail-item {
+ margin-bottom: 16px;
+
+ .record-detail-label {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 8px;
+ }
+
+ .record-detail-value {
+ font-size: 15px;
+ color: #333;
+
+ &.record-detail-content {
+ line-height: 1.5;
+ }
+ }
+
+ .record-detail-files {
+ margin-top: 8px;
+ }
+ }
+
+ .record-detail-footer {
+ margin-top: 32px;
+
+ button {
+ height: 44px;
+ font-size: 16px;
+ }
+ }
+}
diff --git a/src/views/flow/index.jsx b/src/views/flow/index.jsx
new file mode 100644
index 0000000..da6d1c7
--- /dev/null
+++ b/src/views/flow/index.jsx
@@ -0,0 +1,1290 @@
+/*
+ * @Company: hugeInfo
+ * @Author: Claude
+ * @Date: 2022-04-07
+ * @LastEditTime: 2025-05-20 16:15:23
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 流程页面
+ */
+import React, { Fragment, useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Tabs, Drawer, Button, TextareaItem } from 'dingtalk-design-mobile';
+import { RightArrow2Outlined } from 'dd-icons';
+
+import { Scrollbars } from 'react-custom-scrollbars';
+import { CloseOutlined } from 'dd-icons';
+
+import NavBarPage from '../../components/NavBarPage';
+import Descriptions from '../../components/Descriptions';
+import UserTag from '../../components/UserTag';
+import DingUpload from '../../components/DingUpload';
+import { applyClose_1 } from '../../assets/img';
+import Daxx from './component/daxx';
+import Sqjl from './component/sqjl';
+import Sxbl from './component/sxbl';
+import Lzjd from './component/lzjd';
+import Dbcb from './component/dbcb';
+import Bysl from './component/bysl';
+
+import * as $$ from '../../utils/utility';
+import './index.less';
+
+function getTransactResultApi(caseId) {
+ return $$.ax.request({ url: `caseInfoUnfold/getTransactResult?caseId=${caseId}`, type: 'get', service: 'mediate' });
+}
+
+function getVideoApi(caseId) {
+ return $$.ax.request({ url: `meetInfo/getVideo?caseId=${caseId}`, type: 'get', service: 'mediate' });
+}
+
+function getByCaseIdApi(caseId) {
+ return $$.ax.request({ url: `caseEvaluate/getByCaseId?caseId=${caseId}`, type: 'get', service: 'mediate' });
+}
+
+function getCaseInfoApi(id) {
+ return $$.ax.request({ url: 'caseInfo/getCaseInfo?id=' + id, type: 'get', service: 'mediate' });
+}
+
+function listFeedbackApi(id) {
+ return $$.ax.request({ url: `caseFeedback/listFeedback?id=` + id, type: 'get', service: 'mediate' });
+}
+
+function getListCaseFlow(caseId) {
+ return $$.ax.request({ url: `caseTask/listCaseFlow?caseId=` + caseId, type: 'get', service: 'mediate' });
+}
+
+function getCaseDismiss(caseId) {
+ return $$.ax.request({ url: `caseDismiss/getByCaseId?caseId=` + caseId, type: 'get', service: 'mediate' });
+}
+
+function getTabButton(data) {
+ return $$.ax.request({ url: `caseTask/getTabButton`, type: 'get', service: 'mediate', data });
+}
+
+function getFeedbackInfoApi(data) {
+ return $$.ax.request({ url: `caseFeedback/getFeedbackInfo`, data, type: 'get', service: 'mediate' });
+}
+
+//删除经办人
+function deletePrincipalApi(data) {
+ return $$.ax.request({ url: `caseInfoUnfold/deletePrincipal`, data, type: 'get', service: 'mediate' });
+}
+
+function getId() {
+ return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
+}
+
+// 不予受理
+function requestDismiss(data) {
+ return $$.ax.request({ url: `caseTask/dismiss`, type: 'post', service: 'mediate', data });
+}
+
+// 受理+自行受理
+function accept(data) {
+ return $$.ax.request({ url: `caseTask/accept`, type: 'post', service: 'mediate', data });
+}
+
+// 上报
+function getAppearToUnit(data) {
+ return $$.ax.request({ url: `ctUnit/getAppearToUnit`, type: 'get', service: 'cust', data });
+}
+
+// 上报申请
+function appearApply(data) {
+ return $$.ax.request({ url: `caseTask/appearApply`, type: 'post', service: 'mediate', data });
+}
+
+// 交办
+function assign(data) {
+ return $$.ax.request({ url: `caseTask/assign`, type: 'post', service: 'mediate', data });
+}
+
+// 回退
+function returnApply(data) {
+ return $$.ax.request({ url: `caseTask/returnApply`, type: 'post', service: 'mediate', data });
+}
+
+// 定义标签页内容
+const myTab = [
+ {
+ label: '详情',
+ key: 'byslxq',
+ },
+ {
+ label: '事项详情',
+ key: 'daxx',
+ },
+ {
+ label: '事项详情',
+ key: 'dslxq',
+ },
+ {
+ label: '事项详情',
+ key: 'sxxq',
+ },
+ {
+ label: '重复事项',
+ key: 'cfsx',
+ isNeedStep: true,
+ },
+ {
+ label: '流转进度',
+ key: 'lzjd',
+ },
+ {
+ label: '督办催办',
+ key: 'dbcb',
+ },
+ {
+ label: '办理信息',
+ key: 'sxbl',
+ },
+ {
+ label: '申请信息',
+ key: 'sqjl',
+ },
+ {
+ label: '司法确认',
+ key: 'sfqr',
+ },
+];
+
+// 九宫格tab数据
+const gridTabs = [
+ { key: 'daxx', label: '事项信息' },
+ { key: 'lzjd', label: '流转进度' },
+ { key: 'dbcb', label: '督办催办' },
+ { key: 'sxbl', label: '办理信息' },
+ { key: 'sqjl', label: '申请信息' },
+ { key: 'sfqr', label: '结案信息' },
+ { key: 'hfxx', label: '回访信息' },
+ { key: 'cfsx', label: '重复事项' },
+ { key: 'byslxq', label: '不予受理' },
+];
+
+const Flow = () => {
+ const history = useHistory();
+ const caseTaskId = $$.getQueryString('caseTaskId');
+ const caseId = $$.getQueryString('caseId');
+ const moutedTab = $$.getQueryString('moutedTab');
+ const editShow = $$.getQueryString('editShow') === 'true' ? true : false;
+ const slTitle = $$.getQueryString('slTitle') ? '受理' : '自行受理';
+ const leftFunction = $$.getQueryString('leftFunction');
+ // const back = searchParams.get('back');
+ // const tab = searchParams.get('tab');
+ const [flowData, setFlowData] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [authorData, setAuthorData] = useState({});
+ const [grade, setGrade] = useState({});
+ const [transactResult, setTransactResult] = useState({});
+ const [videoList, setVideoList] = useState([]);
+ const [caseInfo, setCaseInfo] = useState({});
+ const [list, setList] = useState([]);
+ const [progressData, setProgressData] = useState([]);
+ const [dismissData, setDismissData] = useState([]);
+
+ const [tabsList, setTabsList] = useState([]);
+ const [tabsActive, setTabsActive] = useState(moutedTab || '');
+ const [staticButtonList, setStaticButtonList] = useState([]);
+ const [current, setCurrent] = useState({});
+
+ const [wantUser, setWantUser] = useState({});
+ const [visible, setVisible] = useState(false);
+ const [rejectVisible, setRejectVisible] = useState(false);
+ const [reportVisible, setReportVisible] = useState(false);
+ const [rejectReason, setRejectReason] = useState('');
+
+ const [auditForm, setAuditForm] = useState({
+ rejectReason: '',
+ rejectReasonTwo: '',
+ fileList: [],
+ });
+
+ const [reportForm, setReportForm] = useState({
+ reportUnit: '', // 上报至单位
+ appearContent: '', // 上报意见
+ fileList: [], // 附件列表
+ });
+
+ const [assignForm, setAssignForm] = useState({
+ handleUnitName: '', // 承办部门名称
+ cooperateDeptsName: [], // 配合部门名称
+ assignContent: '', // 交办意见
+ fileList: [], // 附件列表
+ id: '', // 交办id
+ });
+
+ const [assignVisible, setAssignVisible] = useState(false);
+
+ const [returnVisible, setReturnVisible] = useState(false);
+ const [returnForm, setReturnForm] = useState({
+ id: '',
+ returnReason: '',
+ content: '',
+ fileList: [],
+ });
+
+ const [activeGridTab, setActiveGridTab] = useState(gridTabs[0].key);
+
+ const myButton = [
+ {
+ label: slTitle,
+ type: 'success',
+ key: 'sl',
+ },
+ {
+ label: '交办',
+ type: 'primary',
+ key: 'jb',
+ },
+ {
+ label: '上报',
+ type: 'warning',
+ key: 'sb',
+ },
+ {
+ label: '不予受理',
+ type: 'danger',
+ key: 'bysl',
+ },
+ {
+ label: '回退',
+ type: 'danger',
+ key: 'ht',
+ },
+ {
+ label: '添加办理记录',
+ type: 'primary',
+ key: 'tjbljl',
+ },
+ {
+ label: '申请结案',
+ type: 'success',
+ key: 'jasq',
+ },
+ {
+ label: '申请联合处置',
+ type: 'warning',
+ key: 'lhczsq',
+ },
+ ];
+
+ // tab切换事件
+ const handleTabChange = (tab, index) => {
+ setTabsActive(tab.key);
+ };
+
+ //获取权限tab和按钮权限
+ const getTabButtonApi = async () => {
+ const res = await getTabButton({
+ caseTaskId: caseTaskId,
+ });
+ if (res.type) {
+ const { tabList } = res.data;
+ const { buttonList } = res.data;
+ setAuthorData(res.data);
+ if (tabList.length === 0) {
+ //没有tab
+ setTabsList([
+ {
+ label: '详情',
+ key: 'daxx',
+ },
+ ]);
+ setTabsActive('daxx');
+ } else {
+ const list = myTab
+ .filter((item) => {
+ // 如果是流转进度或督办催办，直接保留
+ if (['lzjd', 'dbcb'].includes(item.key)) {
+ return true;
+ }
+
+ // 其他情况保持原有逻辑
+ const flag = tabList.some((result) => {
+ if (result.id === item.key) {
+ return true;
+ }
+ });
+ return flag;
+ })
+ .map((item) => {
+ const data = tabList.find((res) => res.id === item.key) || {};
+ return {
+ ...item,
+ label: item.label || data.name,
+ };
+ });
+ setTabsList(list);
+
+ // 当moutedTab为sbsh、htsh、jash、lhczsh时，将其设置为sqjl
+ const specialTabs = ['sbsh', 'htsh', 'jash', 'lhczsh'];
+ const activeTab = specialTabs.includes(moutedTab) ? 'sqjl' : tabsActive || list[0].key;
+ setTabsActive(activeTab);
+
+ if (list.some((item) => item.key === 'sxbl')) {
+ // 如果tablist中存在办理信息，则调用该接口
+ getFeedbackInfo({ caseId, caseTaskId });
+ }
+
+ // 如果tabList中存在回退审核或者上报审核或者联合处置申请审核或者结案申请审核，则在缓存中存放一个key为'sqjl'的值
+ if (tabList.some((item) => item.id === 'htsh' || item.id === 'sbsh' || item.id === 'jash' || item.id === 'lhczsh')) {
+ $$.setLocal('sqjl', true);
+ }
+ }
+ setStaticButtonList(
+ myButton
+ .filter((item) => {
+ const flag = buttonList.some((result) => {
+ if (result.id === item.key) {
+ return true;
+ }
+ });
+ return flag;
+ })
+ .map((item) => {
+ const data = buttonList.find((res) => res.id == item.key);
+ return {
+ ...item,
+ label: data.name,
+ id: item.key,
+ name: data.name,
+ };
+ })
+ );
+ }
+ };
+
+ console.log(staticButtonList, 'staticButtonList');
+
+ const getByCaseId = async (id) => {
+ const res = await getByCaseIdApi(id);
+ if (res.type) {
+ setGrade(res.data);
+ }
+ };
+
+ const getTransactResult = async (id) => {
+ const res = await getTransactResultApi(id);
+ if (res.type) {
+ if (res.data) {
+ setTransactResult({ ...res.data });
+ } else {
+ setTransactResult(null);
+ }
+ }
+ };
+
+ const getVideo = async (id) => {
+ const res = await getVideoApi(id);
+ if (res.type) {
+ if (res.data) {
+ setVideoList(res.data || []);
+ } else {
+ setVideoList(null);
+ }
+ }
+ };
+
+ // 打开操作面板
+ const handleShowPanel = () => {
+ setVisible(true);
+ };
+
+ // 关闭操作面板
+ const handleClose = () => {
+ setVisible(false);
+ };
+
+ // 处理交办表单变更
+ const handleAssignFormChange = (field, value) => {
+ setAssignForm({ ...assignForm, [field]: value });
+ };
+
+ // 关闭交办抽屉
+ const handleAssignDrawerClose = () => {
+ setAssignVisible(false);
+ setAssignForm({
+ handleUnitName: '',
+ cooperateDepts: [],
+ assignContent: '',
+ fileList: [],
+ id: '',
+ });
+ };
+
+ // 提交交办
+ const handleSubmitAssign = () => {
+ if (!assignForm.handleUnitName) {
+ $$.showToast({ content: '请选择承办部门' });
+ return;
+ }
+ if (!assignForm.assignContent) {
+ $$.showToast({ content: '请填写交办意见' });
+ return;
+ }
+
+ $$.confirmModal({
+ title: '交办确认',
+ subtitle: '确定交办吗？',
+ onOk: async () => {
+ const res = await assign({
+ ...assignForm,
+ assistUnitList: assignForm?.assistUnitList?.map((item) => ({ uitId: item.value, uitName: item.label })),
+ caseId,
+ caseTaskId,
+ });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ handleAssignDrawerClose();
+ history.goBack();
+ }
+ },
+ });
+ };
+
+ // 关闭上报抽屉
+ const handleReportClose = () => {
+ setReportVisible(false);
+ };
+
+ // 关闭不予受理抽屉
+ const handleRejectClose = () => {
+ setRejectVisible(false);
+ setRejectReason('');
+ };
+
+ // 处理回退表单变更
+ const handleReturnFormChange = (field, value) => {
+ setReturnForm({ ...returnForm, [field]: value });
+ };
+
+ // 关闭回退抽屉
+ const handleReturnClose = () => {
+ setReturnVisible(false);
+ setReturnForm({
+ id: '',
+ returnReason: '',
+ content: '',
+ fileList: [],
+ });
+ };
+
+ // 提交回退
+ const handleSubmitReturn = () => {
+ if (!returnForm.returnReason) {
+ $$.showToast({ content: '请选择回退理由' });
+ return;
+ }
+ if (returnForm.returnReason === '其他' && !returnForm.content) {
+ $$.showToast({ content: '请填写回退具体理由' });
+ return;
+ }
+
+ const returnContent = returnForm.returnReason === '其他' ? returnForm.content : returnForm.returnReason;
+
+ $$.confirmModal({
+ title: '回退确认',
+ subtitle: '确定回退吗？',
+ onOk: async () => {
+ const res = await returnApply({ id: returnForm.id, returnContent: returnContent, caseId, caseTaskId });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ handleReturnClose();
+ history.goBack();
+ }
+ },
+ });
+ };
+
+ // 添加统一的按钮点击处理函数
+ const handleButtonClick = async (type, e) => {
+ switch (type) {
+ case 'sl':
+ // 自行受理+受理
+ $$.confirmModal({
+ title: slTitle + '确认',
+ subtitle: '确定' + slTitle + '吗？',
+ onOk: async () => {
+ const res = await accept({ caseTaskId });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ // 关闭按钮区域
+ handleClose();
+ // history.push(`/gzdyh/flow?caseTaskId=${caseTaskId}&caseId=${caseId}`);
+ history.goBack();
+ }
+ },
+ });
+ break;
+ case 'jb':
+ // 交办
+ handleClose();
+ const res1 = await getId();
+ if (res1.type) {
+ setAssignForm({ ...assignForm, id: res1.data });
+ setAssignVisible(true);
+ }
+ break;
+ case 'sb':
+ // 上报
+ handleClose();
+ const res2 = await getId();
+ global.setSpinning(true);
+ const res3 = await getAppearToUnit();
+ global.setSpinning(false);
+ if (res3.type) {
+ setReportVisible(true);
+ setReportForm({ ...reportForm, id: res2.data, auditUnitId: res3.data.auditUnitId, auditUnitName: res3.data.auditUnitName });
+ }
+ break;
+ case 'bysl':
+ // 不予受理
+ handleClose();
+ setRejectVisible(true);
+ const res4 = await getId();
+ if (res4.type) {
+ setAuditForm({ ...auditForm, id: res4.data });
+ }
+ break;
+ case 'ht':
+ // 回退
+ handleClose();
+ const res5 = await getId();
+ if (res5.type) {
+ setReturnForm({ ...returnForm, id: res5.data });
+ setReturnVisible(true);
+ }
+ break;
+ default:
+ break;
+ }
+ };
+
+ // 处理表单
+ const handleAuditFormChange = (field, value) => {
+ setAuditForm({ ...auditForm, [field]: value });
+ };
+
+ // 提交不予受理
+ const handleSubmitAudit = () => {
+ if (!auditForm.rejectReason) {
+ $$.showToast({ content: '请选择不予受理理由' });
+ return;
+ }
+ if (auditForm.rejectReason === '其他' && !auditForm.content) {
+ $$.showToast({ content: '请填写不予受理具体理由' });
+ return;
+ }
+
+ const disContent = auditForm.rejectReason === '其他' ? auditForm.content : auditForm.rejectReason;
+
+ $$.confirmModal({
+ title: '不予受理确认',
+ subtitle: '确定不予受理吗？',
+ onOk: async () => {
+ const res = await requestDismiss({ id: auditForm.id, disContent, caseId, caseTaskId });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ // 关闭底部抽屉
+ handleRejectClose();
+ history.goBack();
+ }
+ },
+ });
+ };
+
+ // 处理上报表单变更
+ const handleReportFormChange = (field, value) => {
+ setReportForm({ ...reportForm, [field]: value });
+ };
+
+ // 提交上报
+ const handleSubmitReport = () => {
+ if (!reportForm.appearContent) {
+ $$.showToast({ content: '请填写上报意见' });
+ return;
+ }
+
+ $$.confirmModal({
+ title: '上报确认',
+ subtitle: '确定上报吗？',
+ onOk: async () => {
+ // TODO: 调用上报接口
+ const res = await appearApply({ ...reportForm, caseId, caseTaskId });
+ if (res.type) {
+ $$.showToast({ type: 'success', content: '提交成功' });
+ handleReportClose();
+ history.goBack();
+ }
+ },
+ });
+ };
+
+ function bottomOnclick(type) {
+ switch (type) {
+ case 'sxxq':
+ history.push(`/mediate/visit/eventFlow?caseTaskId=${caseTaskId}&caseId=${caseId}`);
+ break;
+ case 'dslxq':
+ handleShowPanel();
+ break;
+ default:
+ break;
+ }
+ }
+
+ const getCaseInfo = async (id) => {
+ const res = await getCaseInfoApi(id);
+ if (res.type) {
+ const { agentList, personList, ...rest } = res.data;
+ const parList = agentList?.concat(personList);
+ const newParList =
+ parList?.map((item) => {
+ const fileInfoList = item.fileInfoList;
+ let file = []; //身份证明材料、企业登记材料
+ let file1 = []; //法人、机构身份证明材料、代理人授权委托书
+ if (fileInfoList && fileInfoList.length != 0) {
+ fileInfoList.forEach((item) => {
+ if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
+ item.fileList.forEach((res) => {
+ file.push({
+ ...res,
+ uid: res.id,
+ });
+ });
+ }
+ if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
+ item.fileList.forEach((res) => {
+ file1.push({
+ ...res,
+ uid: res.id,
+ });
+ });
+ }
+ });
+ }
+ return {
+ ...item,
+ file,
+ file1,
+ };
+ }) || [];
+ const obj = {
+ ...rest,
+ fakeData: newParList,
+ };
+ setCurrent(obj.process);
+ setCaseInfo(obj);
+ }
+ };
+
+ const listFeedback = async (id) => {
+ const res = await listFeedbackApi(id);
+ if (res.type) {
+ let data = res.data.caseFeedbackList;
+ setList(data);
+ }
+ };
+
+ const getData = async (id) => {
+ const res = await getListCaseFlow(id);
+ if (res.type) {
+ setProgressData(res.data);
+ }
+ };
+
+ //获取不予受理信息
+ const getDismissData = async (id) => {
+ const res = await getCaseDismiss(id);
+ if (res.type) {
+ setDismissData(res.data);
+ }
+ };
+
+ // 获取反馈信息
+ const getFeedbackInfo = async (data) => {
+ const res = await getFeedbackInfoApi(data);
+ if (res.type) {
+ let data = res.data;
+ setWantUser({ handleUserName: data?.handleUserName, handleUserId: data?.handleUserId });
+ }
+ };
+
+ // 删除经办人
+ const handleDelete = async () => {
+ global.setSpinning(true);
+ const res = await deletePrincipalApi({ caseId, caseTaskId });
+ global.setSpinning(false);
+ if (res.type) {
+ getFeedbackInfo({ caseId, caseTaskId });
+ }
+ };
+
+ // 接收承办部门
+ useEffect(() => {
+ let data = $$.getLocal('mainDept');
+ let data2 = $$.getLocal('cooperateDepts');
+ if (data) {
+ setAssignForm({ ...assignForm, handleUnitId: data[0].value, handleUnitName: data[0].label });
+ $$.clearLocal('mainDept');
+ }
+ if (data2) {
+ setAssignForm({ ...assignForm, assistUnitList: data2 });
+ $$.clearLocal('cooperateDepts');
+ }
+ }, [$$.getLocal('mainDept'), $$.getLocal('cooperateDepts')]);
+
+ // 更新办理记录
+ useEffect(() => {
+ let data = $$.getLocal('bljl');
+ if (data) {
+ listFeedback(caseId);
+ $$.clearLocal('bljl');
+ }
+ }, [$$.getLocal('bljl')]);
+
+ // 模拟获取数据
+ useEffect(() => {
+ getTabButtonApi();
+ getByCaseId(caseId);
+ getTransactResult(caseId);
+ getVideo(caseId);
+ getCaseInfo(caseId);
+ listFeedback(caseId);
+ getData(caseId);
+ getDismissData(caseId);
+ }, []);
+
+ // 更新经办人
+ useEffect(() => {
+ let data = $$.getLocal('selectPerson');
+ if (data) {
+ getFeedbackInfo({ caseId, caseTaskId });
+ $$.clearLocal('selectPerson');
+ }
+ }, [$$.getLocal('selectPerson')]);
+
+ console.log(tabsList, 'tabsList');
+ console.log(staticButtonList, 'staticButtonList');
+
+ return (
+ <NavBarPage
+ leftContentFunc={() => {
+ // 如果leftFunction=home，则跳转到首页
+ if (leftFunction === 'home') {
+ history.replace('/gzdyh/home');
+ } else {
+ // 否则返回上一页
+ history.goBack();
+ }
+ }}
+ title="事项处理"
+ >
+ {tabsList?.find((item) => item.key === 'daxx') || tabsList?.find((item) => item.key === 'byslxq') ? (
+ <div className="flow-container">
+ {/* 用来切换 */}
+ <div className="custom-grid-tabs">
+ {gridTabs.map((tab, idx) => (
+ <div
+ key={tab.key}
+ className={`grid-tab-item${activeGridTab === tab.key ? ' active' : ''}`}
+ onClick={() => setActiveGridTab(tab.key)}
+ style={{
+ width: '33.33%',
+ borderRight: (idx + 1) % 3 === 0 ? 'none' : '1px solid #fff',
+ borderBottom: idx >= 6 ? 'none' : '1px solid #fff',
+ }}
+ >
+ {tab.label}
+ </div>
+ ))}
+ </div>
+ <div className="custom-tab-content">
+ {activeGridTab === 'daxx' && <Daxx data={caseInfo} />}
+ {activeGridTab === 'lzjd' && <Lzjd progressData={progressData} />}
+ {activeGridTab === 'dbcb' && <Dbcb />}
+ {activeGridTab === 'sxbl' && <Sxbl editShow={editShow} wantUser={wantUser} staticButtonList={staticButtonList} caseId={caseId} caseTaskId={caseTaskId} recordList={list} onClose={() => handleDelete({ caseId, caseTaskId })} />}
+ {activeGridTab === 'sqjl' && <Sqjl />}
+ {activeGridTab === 'sfqr' && <div>结案信息内容</div>}
+ {activeGridTab === 'hfxx' && <div>回访信息内容</div>}
+ {activeGridTab === 'cfsx' && <div>回访信息内容</div>}
+ {activeGridTab === 'byslxq' && <Bysl data={dismissData} />}
+ </div>
+ </div>
+ ) : (
+ <div className="flow-container">
+ <Tabs
+ tabs={tabsList?.map((i) => ({ ...i, title: i.label }))}
+ onTabClick={handleTabChange}
+ activeKey={tabsActive}
+ className="flow-tab-container"
+ >
+ <div key="daxx">
+ {tabsList?.some((item) => item.key === 'daxx') && (
+ <Scrollbars style={{ height: 'calc(100vh - 104px)' }}>
+ <Daxx data={caseInfo} />
+ </Scrollbars>
+ )}
+ </div>
+
+ <div key="dslxq">
+ {tabsList?.some((item) => item.key === 'dslxq') && (
+ <>
+ <Scrollbars style={{ height: editShow ? 'calc(100vh - 162px)' : 'calc(100vh - 94px)' }}>
+ <Daxx data={caseInfo} />
+ </Scrollbars>
+ {editShow && (
+ <div className="flow-bottom-button">
+ <Button type="primary" onClick={() => bottomOnclick('dslxq')}>
+ 处理
+ </Button>
+ </div>
+ )}
+ </>
+ )}
+ </div>
+ <div key="sxxq">
+ {tabsList?.some((item) => item.key === 'sxxq') && (
+ <>
+ <Scrollbars style={{ height: editShow ? 'calc(100vh - 162px)' : 'calc(100vh - 94px)' }}>
+ <Daxx data={caseInfo} />
+ </Scrollbars>
+ {editShow && (
+ <div className="flow-bottom-button">
+ <Button type="primary" onClick={() => bottomOnclick('dslxq')}>
+ 处理
+ </Button>
+ </div>
+ )}
+ </>
+ )}
+ </div>
+ <div key="lzjd">
+ <>
+ <Scrollbars style={{ height: editShow ? 'calc(100vh - 162px)' : 'calc(100vh - 104px)' }}>
+ <Lzjd progressData={progressData} />
+ </Scrollbars>
+ {editShow && (
+ <div className="flow-bottom-button">
+ <Button type="primary" onClick={() => bottomOnclick('dslxq')}>
+ 处理
+ </Button>
+ </div>
+ )}
+ </>
+ {/* <Scrollbars style={{ height: 'calc(100vh - 101px)' }}>
+ <Lzjd progressData={progressData} />
+ </Scrollbars> */}
+ </div>
+ <div key="dbcb">{tabsList?.some((item) => item.key === 'dbcb') && <Dbcb />}</div>
+ <div key="sqjl">{tabsList?.some((item) => item.key === 'sqjl') && <Sqjl />}</div>
+ <div key="sxbl">
+ {tabsList?.some((item) => item.key === 'sxbl') && (
+ <Sxbl
+ editShow={editShow}
+ wantUser={wantUser}
+ staticButtonList={staticButtonList}
+ caseId={caseId}
+ caseTaskId={caseTaskId}
+ recordList={list}
+ onClose={() => handleDelete({ caseId, caseTaskId })}
+ />
+ )}
+ </div>
+ </Tabs>
+ </div>
+ )}
+
+ {/*dslxq的处理按钮*/}
+ {visible && (
+ <>
+ <div className="action-mask" onClick={handleClose}></div>
+ <div className="action-panel">
+ <div className="action-buttons">
+ {staticButtonList.map((button) => (
+ <div key={button.key} className={`action-btn action-btn-${button.type}`} onClick={(e) => handleButtonClick(button.key, e)}>
+ {button.label}
+ </div>
+ ))}
+ <div className="action-btn-cancel">
+ <div className="close-btn" onClick={handleClose}>
+ <CloseOutlined />
+ </div>
+ </div>
+ </div>
+ </div>
+ </>
+ )}
+
+ {/* 不予受理抽屉 */}
+ <Drawer visible={rejectVisible} onClose={handleRejectClose} position="bottom">
+ <div className="audit-drawer">
+ <div className="audit-drawer-header">
+ <div className="audit-drawer-title">不予受理</div>
+ <div className="audit-drawer-close" onClick={handleRejectClose}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+ <div className="audit-drawer-content">
+ <div className="audit-drawer-scroll">
+ <div className="audit-section required-field">
+ <div className="audit-section-title">不予受理理由</div>
+ <div className="audit-reason-group">
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '不属于相关职责范围' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '不属于相关职责范围')}
+ >
+ {auditForm.rejectReason === '不属于相关职责范围' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>不属于相关职责范围</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '诉求不合理或不明确' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '诉求不合理或不明确')}
+ >
+ {auditForm.rejectReason === '诉求不合理或不明确' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>诉求不合理或不明确</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '无法与当事人取得联系' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '无法与当事人取得联系')}
+ >
+ {auditForm.rejectReason === '无法与当事人取得联系' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>无法与当事人取得联系</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '缺乏具体事实依据' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '缺乏具体事实依据')}
+ >
+ {auditForm.rejectReason === '缺乏具体事实依据' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>缺乏具体事实依据</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '违反法律法规' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '违反法律法规')}
+ >
+ {auditForm.rejectReason === '违反法律法规' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>违反法律法规</span>
+ </div>
+ <div
+ className={`audit-reason-item ${auditForm.rejectReason === '其他' ? 'active' : ''}`}
+ onClick={(e) => handleAuditFormChange('rejectReason', '其他')}
+ >
+ {auditForm.rejectReason === '其他' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>其他</span>
+ </div>
+ </div>
+ {auditForm.rejectReason === '其他' && (
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder={`请填写不予受理具体理由`}
+ value={auditForm.content}
+ onChange={(value) => handleAuditFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+ {/* <div className="audit-footer-gap"></div> */}
+ <div className="audit-footer">
+ <Button type="primary" block onClick={handleSubmitAudit}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+
+ {/* 上报抽屉 */}
+ <Drawer visible={reportVisible} onClose={handleReportClose} position="bottom">
+ <div className="audit-drawer">
+ <div className="audit-drawer-header">
+ <div className="audit-drawer-title">上报</div>
+ <div className="audit-drawer-close" onClick={handleReportClose}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+ <div className="audit-drawer-content">
+ <div className="audit-drawer-scroll">
+ <div className="audit-section">
+ <div className="audit-section-title">上报至</div>
+ <div className="audit-unit-select">
+ <div className="audit-unit-value audit-unit-value-tag">{reportForm.auditUnitName}</div>
+ </div>
+ </div>
+ <div className="audit-section required-field">
+ <div className="audit-section-title">上报意见</div>
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder="请填写"
+ value={reportForm.appearContent}
+ onChange={(value) => handleReportFormChange('appearContent', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+ <div className="audit-section">
+ <DingUpload
+ title="附件材料"
+ subtitle="可添加上报申请相关附件"
+ fileList={reportForm.fileList}
+ mainId={caseId}
+ ownerId={reportForm?.id || ''}
+ ownerType="22_00018-512"
+ multiple={true}
+ maxCount={9}
+ />
+ </div>
+ </div>
+ </div>
+ <div className="audit-footer">
+ <Button type="primary" block onClick={handleSubmitReport}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+
+ {/* 交办抽屉 */}
+ <Drawer visible={assignVisible} onClose={handleAssignDrawerClose} position="bottom">
+ <div className="audit-drawer">
+ <div className="audit-drawer-header">
+ <div className="audit-drawer-title">交办</div>
+ <div className="audit-drawer-close" onClick={handleAssignDrawerClose}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+ <div className="audit-drawer-content">
+ <div className="audit-drawer-scroll">
+ <div className="audit-section">
+ <div className=" audit-section-flex required-field">
+ <div className="audit-section-title" style={{ margin: '0' }}>
+ 承办部门
+ </div>
+ <div
+ className="audit-section-select"
+ onClick={() => history.push(`/gzdyh/selectPerson?type=3&caseId=${caseId}&caseTaskId=${caseTaskId}&isMultiple=false`)}
+ >
+ <span>选择</span>
+ <span className="joint-handle-arrow">
+ <RightArrow2Outlined style={{ fontSize: '16px' }} />
+ </span>
+ </div>
+ </div>
+ <div className="joint-handle-value">
+ {assignForm.handleUnitName ? (
+ // 循环
+ <div className="joint-handle-dept-tags">
+ <UserTag
+ viewBtn={false}
+ name={assignForm.handleUnitName}
+ value={assignForm.handleUnitId}
+ onClose={() => setAssignForm({ ...assignForm, handleUnitName: '', handleUnitId: '' })}
+ />
+ </div>
+ ) : null}
+ </div>
+ </div>
+ <div className="audit-section">
+ <div className=" audit-section-flex">
+ <div className="audit-section-title" style={{ margin: '0' }}>
+ 配合部门<span className="audit-section-select">（可多选）</span>
+ </div>
+ <div
+ className="audit-section-select"
+ onClick={() => history.push(`/gzdyh/selectPerson?type=4&caseId=${caseId}&caseTaskId=${caseTaskId}&isMultiple=true`)}
+ >
+ <span>选择</span>
+ <span className="joint-handle-arrow">
+ <RightArrow2Outlined style={{ fontSize: '16px' }} />
+ </span>
+ </div>
+ </div>
+ <div className="joint-handle-value">
+ {assignForm.assistUnitList?.length > 0 ? (
+ // 循环
+ <div className="joint-handle-dept-tags">
+ {assignForm.assistUnitList?.map((dept) => (
+ <UserTag
+ key={dept.value}
+ viewBtn={false}
+ name={dept.label}
+ value={dept.value}
+ onClose={() =>
+ setAssignForm({ ...assignForm, assistUnitList: assignForm.assistUnitList.filter((item) => item.value !== dept.value) })
+ }
+ />
+ ))}
+ </div>
+ ) : null}
+ </div>
+ </div>
+
+ <div className="audit-section required-field">
+ <div className="audit-section-title">交办意见</div>
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder="请填写"
+ value={assignForm.assignContent}
+ onChange={(value) => handleAssignFormChange('assignContent', value)}
+ rows={4}
+ />
+ </div>
+ </div>
+ <div className="audit-section">
+ <DingUpload
+ title="附件材料"
+ subtitle="可添加交办工作相关附件"
+ fileList={assignForm.fileList}
+ mainId={caseId}
+ ownerId={assignForm?.id || ''}
+ ownerType="22_00018-513"
+ multiple={true}
+ maxCount={9}
+ />
+ </div>
+ </div>
+ </div>
+ {/* 间隔 */}
+ <div className="audit-footer-gap"></div>
+ <div className="audit-footer">
+ <Button type="primary" block onClick={handleSubmitAssign}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+
+ {/* 回退抽屉 */}
+ <Drawer visible={returnVisible} onClose={handleReturnClose} position="bottom">
+ <div className="audit-drawer">
+ <div className="audit-drawer-header">
+ <div className="audit-drawer-title">回退</div>
+ <div className="audit-drawer-close" onClick={handleReturnClose}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+ <div className="audit-drawer-content">
+ <div className="audit-drawer-scroll">
+ <div className="audit-section required-field">
+ <div className="audit-section-title">回退理由</div>
+ <div className="audit-reason-group">
+ <div
+ className={`audit-reason-item ${returnForm.returnReason === '不属于本部门的职能范围' ? 'active' : ''}`}
+ onClick={() => handleReturnFormChange('returnReason', '不属于本部门的职能范围')}
+ >
+ {returnForm.returnReason === '不属于本部门的职能范围' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>不属于本部门的职能范围</span>
+ </div>
+ <div
+ className={`audit-reason-item ${returnForm.returnReason === '超出本部门管辖范围' ? 'active' : ''}`}
+ onClick={() => handleReturnFormChange('returnReason', '超出本部门管辖范围')}
+ >
+ {returnForm.returnReason === '超出本部门管辖范围' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>超出本部门管辖范围</span>
+ </div>
+ <div
+ className={`audit-reason-item ${returnForm.returnReason === '重复上报' ? 'active' : ''}`}
+ onClick={() => handleReturnFormChange('returnReason', '重复上报')}
+ >
+ {returnForm.returnReason === '重复上报' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>重复上报</span>
+ </div>
+ <div
+ className={`audit-reason-item ${returnForm.returnReason === '无法与当事人取得联系' ? 'active' : ''}`}
+ onClick={() => handleReturnFormChange('returnReason', '无法与当事人取得联系')}
+ >
+ {returnForm.returnReason === '无法与当事人取得联系' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>无法与当事人取得联系</span>
+ </div>
+ <div
+ className={`audit-reason-item ${returnForm.returnReason === '其他' ? 'active' : ''}`}
+ onClick={() => handleReturnFormChange('returnReason', '其他')}
+ >
+ {returnForm.returnReason === '其他' ? (
+ <img src={applyClose_1} alt="选中" className="audit-radio-checked" />
+ ) : (
+ <div className="audit-radio-unchecked"></div>
+ )}
+ <span>其他</span>
+ </div>
+ </div>
+ {returnForm.returnReason === '其他' && (
+ <div className="audit-content-wrapper">
+ <TextareaItem
+ placeholder="请填写回退具体理由"
+ value={returnForm.content}
+ onChange={(value) => handleReturnFormChange('content', value)}
+ rows={4}
+ />
+ </div>
+ )}
+ </div>
+ <div className="audit-section">
+ <DingUpload
+ title="附件材料"
+ subtitle="可添加回退相关附件"
+ fileList={returnForm.fileList}
+ mainId={caseId}
+ ownerId={returnForm?.id || ''}
+ ownerType="22_00018-514"
+ multiple={true}
+ maxCount={9}
+ />
+ </div>
+ </div>
+ </div>
+ <div className="audit-footer">
+ <Button type="primary" block onClick={handleSubmitReturn}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+ </NavBarPage>
+ );
+};
+
+export default Flow;
diff --git a/src/views/flow/index.less b/src/views/flow/index.less
new file mode 100644
index 0000000..8102997
--- /dev/null
+++ b/src/views/flow/index.less
@@ -0,0 +1,217 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.flow {
+ &-container {
+ background-color: @common_bg_color;
+ height: calc(100vh - 48px);
+ }
+
+ &-header {
+ margin-bottom: 16px;
+ }
+
+ &-title {
+ font-size: 18px;
+ margin: 0;
+ padding: 8px 0;
+ font-weight: bold;
+ }
+
+ &-tab-container {
+ background-color: #ffffff;
+ position: sticky;
+ top: 44px;
+ z-index: 10;
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+ }
+
+ &-loading {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 200px;
+ color: @common_level2_base_color;
+ font-size: 15px;
+ }
+
+ &-content {
+ background-color: @common_bg_z1_color;
+ border-radius: 8px;
+ padding: 16px;
+ margin: 12px;
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+ }
+
+ &-progress {
+ background-color: @common_bg_z1_color;
+ border-radius: 8px;
+ padding: 16px;
+ margin: 12px;
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+
+ &-item {
+ position: relative;
+ padding-left: 20px;
+ padding-bottom: 24px;
+
+ &:last-child {
+ padding-bottom: 0;
+ }
+
+ &:not(:last-child)::before {
+ content: '';
+ position: absolute;
+ top: 16px;
+ left: 7px;
+ width: 1px;
+ height: calc(100% - 16px);
+ background-color: #e8e8e8;
+ }
+ }
+
+ &-dot {
+ position: absolute;
+ left: 0;
+ top: 6px;
+ width: 14px;
+ height: 14px;
+ border-radius: 50%;
+ background-color: #e8e8e8;
+ border: 2px solid @common_bg_z1_color;
+ }
+
+ &-content {
+ padding-left: 12px;
+ }
+
+ &-title {
+ font-size: 16px;
+ line-height: 24px;
+ font-weight: 500;
+ }
+
+ &-time {
+ font-size: 14px;
+ line-height: 20px;
+ color: @common_level2_base_color;
+ margin-top: 4px;
+ }
+
+ &-done {
+ .flow-progress-dot {
+ background-color: #52c41a;
+ }
+ }
+
+ &-process {
+ .flow-progress-dot {
+ background-color: #1A6FB8;
+ }
+
+ .flow-progress-title {
+ color: #1A6FB8;
+ }
+ }
+
+ &-wait {
+ .flow-progress-dot {
+ background-color: #d9d9d9;
+ }
+
+ .flow-progress-title {
+ color: @common_level2_base_color;
+ }
+ }
+ }
+
+ &-empty {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 200px;
+ color: @common_level2_base_color;
+ font-size: 16px;
+ }
+
+ &-footer {
+ margin-top: 24px;
+ padding: 0 8px;
+ }
+
+ &-tab-container {
+ & .dtm-tab-item-text {
+ font-size: 16px;
+ }
+ & .dtm-tab-item-text--active {
+ color: #1A6FB8 !important;
+ }
+ & .dtm-tab-item-active-line {
+ background-color: #1A6FB8 !important;
+ }
+ & .dtm-tab-scroll-container {
+ // 文字不能折行超出部分继续在右侧，可以滚动查看
+ white-space: nowrap;
+ overflow-x: auto;
+ text-overflow: ellipsis;
+ }
+ }
+
+ &-bottom-button {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background-color: #ffffff;
+ padding: 12px 12px;
+ }
+}
+
+/* 自定义标签栏样式 */
+.custom-tab-bar {
+ display: flex;
+ width: 100%;
+ height: 44px;
+ background-color: #ffffff;
+ align-items: center;
+ justify-content: space-around;
+ border-bottom: 1px solid #f5f5f5;
+}
+
+.custom-tab {
+ flex: 1;
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ font-size: 15px;
+ color: #666666;
+ transition: all 0.3s;
+ position: relative;
+
+ &-active {
+ color: #1A6FB8 !important;
+ font-weight: 500;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ width: 40px;
+ height: 3px;
+ background-color: #1A6FB8;
+ transform: translateX(-50%);
+ border-radius: 2px;
+ }
+ }
+}
+
+.joint-handle-dept-tags {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ padding: 8px 0;
+
+ .user-tag {
+ margin: 0;
+ }
+}
diff --git a/src/views/home/index.jsx b/src/views/home/index.jsx
new file mode 100644
index 0000000..e3d0297
--- /dev/null
+++ b/src/views/home/index.jsx
@@ -0,0 +1,1086 @@
+/*
+ * @Author: zhouxt
+ * @Date: 2025-04-10 09:28:00
+ * @LastEditTime: 2025-05-23 16:12:10
+ * @LastEditors: lwh
+ * @Description: 粤政易首页
+ */
+import React, { useState, useEffect, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Swiper, Toast, Drawer, Button, Popguide, TextareaItem, InputItem } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import * as $$ from '../../utils/utility';
+import NavBarPage from '../../components/NavBarPage';
+import MyList from '../../components/MyList';
+import { home_1, home_2, home_3, home_4, home_5, home_6, home_7, home_8, home_9, home_11, caseQuery_2 } from '../../assets/img';
+import DingUpload from '../../components/DingUpload';
+import './index.less';
+import { getNewTimeCaseId } from '../../api/caseApi';
+
+// 获取任务数量接口
+function getCountListApi() {
+ return $$.ax.request({
+ url: 'caseTask/getCountList',
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 全部待办接口
+function pageMyTaskAllApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskAll',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 待合并接口
+function pageMyTaskHbApi(data) {
+ return $$.ax.request({
+ url: 'caseRepeatInfo/pageCaseRepeatHb',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 待分派接口
+function pageMyTaskFpApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskFp',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 待受理接口
+function pageMyTaskSlApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskSl',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 办理中接口
+function pageMyTaskBlzApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskBlz',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 待审核接口
+function pageMyTaskShApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskSh',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 督办接口
+function pageMyTaskDbApi(data) {
+ return $$.ax.request({
+ url: 'caseTask/pageMyTaskDb',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 获取督办详情API
+function getSuperviseDetailApi(id) {
+ return $$.ax.request({
+ url: `caseSupervise/getById?id=${id}`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+// 回复督办API
+function replyCaseSuperviseApi(data) {
+ return $$.ax.request({
+ url: 'caseSupervise/replyCaseSupervise',
+ type: 'post',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 获取标签API
+function getLabelApi(caseId) {
+ return $$.ax.request({
+ url: `caseTask/getLabel?caseId=${caseId}`,
+ type: 'get',
+ service: 'mediate',
+ });
+}
+
+const Home = () => {
+ const history = useHistory();
+
+ // Tab 状态
+ const [activeTab, setActiveTab] = useState('all'); // 'all','merge','dispatch','accept','processing','review','supervise'
+
+ // 任务数量
+ const [countData, setCountData] = useState({
+ allTask: 0,
+ waitDisp: 0,
+ waitAccept: 0,
+ Processing: 0,
+ waitReview: 0,
+ supervise: 0,
+ });
+
+ // 列表数据
+ const [listData, setListData] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [refreshing, setRefreshing] = useState(false);
+ const [hasMore, setHasMore] = useState(true);
+ const [page, setPage] = useState(1);
+ const [totalCount, setTotalCount] = useState(0);
+ const [totalPages, setTotalPages] = useState(1);
+ const [searchParams, setSearchParams] = useState({
+ caseTaskType: '1',
+ caseTaskTypeName: '我承办的',
+ mediatorType: '0',
+ mediatorTypeName: '本部门办理',
+ });
+
+ // 请求参数
+ const [queryParams, setQueryParams] = useState({
+ page: 1,
+ size: 10,
+ status: 1,
+ sortType: 2,
+ sortColmn: 1,
+ type: 1,
+ caseTaskType: 1,
+ });
+
+ // 添加按钮选中状态
+ const [activeButton, setActiveButton] = useState(1); // 1: 我承办的, 2: 我配合的
+ const [activeReviewButton, setActiveReviewButton] = useState(1); // 1: 回退审核, 2: 上报审核, 3: 结案审核, 4: 联合处置审核
+
+ // 滑动图片
+ const carouselItems = [
+ { id: 1, src: home_1, alt: '轮播图1' },
+ { id: 2, src: home_1, alt: '轮播图2' },
+ { id: 3, src: home_1, alt: '轮播图3' },
+ ];
+
+ // 底部导航项
+ const bottomNavItems = [
+ { id: 'home', icon: home_6, text: '首页', path: '/gzdyh/home' },
+ { id: 'message', icon: home_7, text: '消息', path: '/gzdyh/message' },
+ { id: 'count', icon: home_8, text: '统计', path: '/gzdyh/workStatistics' },
+ { id: 'personCenter', icon: home_9, text: '我的', path: '/gzdyh/personCenter' },
+ ];
+
+ // 功能按钮项
+ const functionItems = [
+ { id: 'register', icon: home_2, text: '登记', path: '/gzdyh/Naturepersonnone' },
+ { id: 'done', icon: home_3, text: '已办事项', path: '/gzdyh/caseYb' },
+ { id: 'query', icon: home_4, text: '综合查询', path: '/gzdyh/caseQuery' },
+ { id: 'draft', icon: home_5, text: '草稿箱', path: '/gzdyh/draftBox' },
+ ];
+
+ // Tab 列表项
+ const tabItems = [
+ { id: 'all', text: '全部', countKey: 'allTask', apiFunc: pageMyTaskAllApi },
+ { id: 'merge', text: '待合并', countKey: null, apiFunc: pageMyTaskHbApi },
+ { id: 'dispatch', text: '待分派', countKey: 'waitDisp', apiFunc: pageMyTaskFpApi },
+ { id: 'accept', text: '待受理', countKey: 'waitAccept', apiFunc: pageMyTaskSlApi },
+ { id: 'processing', text: '办理中', countKey: 'processing', apiFunc: pageMyTaskBlzApi },
+ { id: 'review', text: '待审核', countKey: 'waitReview', apiFunc: pageMyTaskShApi },
+ { id: 'supervise', text: '督办', countKey: 'supervise', apiFunc: pageMyTaskDbApi },
+ ];
+
+ // 督办回复相关状态
+ const [superviseReplyVisible, setSuperviseReplyVisible] = useState(false);
+ const [currentSupervise, setCurrentSupervise] = useState(null);
+ const [replyContent, setReplyContent] = useState('');
+ const [attachments, setAttachments] = useState([]);
+ const [superviseLoading, setSuperviseLoading] = useState(false);
+
+ // 风险标签相关状态
+ const [labelVisible, setLabelVisible] = useState(false);
+ const [labelInfo, setLabelInfo] = useState({
+ personLabel: '',
+ caseLabel: '',
+ });
+ const [currentCaseId, setCurrentCaseId] = useState(null);
+
+ // 筛选弹窗相关状态
+ const [filterVisible, setFilterVisible] = useState(false);
+ const [filterRole, setFilterRole] = useState(1); // 1:我承办的 2:我配合的
+ const [filterScope, setFilterScope] = useState(1); // 1:本部门办理 2:本人办理 3:未指派经办人
+
+ // 初始化加载数据
+ // useEffect(() => {
+ // fetchCountData();
+ // fetchListData(1, activeTab, queryParams);
+ // }, []);
+
+ useEffect(() => {
+ if ($$.getSessionStorage('visitWorkBench')) {
+ const { tabId, params } = $$.getSessionStorage('visitWorkBench');
+ fetchCountData();
+ fetchListData(1, tabId, params);
+ $$.clearSessionStorage('visitWorkBench');
+ } else {
+ fetchCountData();
+ fetchListData(1, activeTab, queryParams);
+ }
+ }, []);
+
+ // 获取任务数量数据
+ const fetchCountData = async () => {
+ try {
+ const res = await getCountListApi();
+ if (res.type) {
+ setCountData(res.data || {});
+ }
+ } catch (error) {
+ console.error('获取任务数量失败', error);
+ }
+ };
+
+ // 获取列表数据
+ const fetchListData = async (currentPage, tabId, listParams) => {
+ // 根据当前选中的tab，获取对应的api函数
+ const currentTab = tabItems.find((tab) => tab.id === tabId);
+ if (!currentTab || !currentTab.apiFunc) return;
+
+ setLoading(true);
+
+ try {
+ const params = { ...listParams, page: currentPage };
+
+ // 当tab为supervise时，设置status=0
+ if (tabId === 'supervise' || tabId === 'review') {
+ params.status = 0;
+ } else {
+ params.status = 1;
+ }
+
+ const res = await currentTab.apiFunc(params);
+
+ if (res.type) {
+ const { content, totalElements, totalPages, last } = res.data;
+
+ // 确保返回的数据不为空
+ const dataList = content || [];
+
+ if (currentPage === 1) {
+ // 第一页数据，直接设置
+ setListData(dataList);
+ } else {
+ // 加载更多数据
+ setListData((prev) => [...prev, ...dataList]);
+ }
+ setActiveTab(tabId);
+ setTotalCount(totalElements);
+ setTotalPages(totalPages);
+ setHasMore(!last);
+ setPage(currentPage);
+ setQueryParams(listParams);
+ }
+ } catch (error) {
+ console.error('获取列表数据失败', error);
+ Toast.show({
+ content: '获取数据失败，请稍后重试',
+ position: 'bottom',
+ });
+ } finally {
+ setLoading(false);
+ setRefreshing(false);
+ }
+ };
+
+ // 下拉刷新
+ const handleRefresh = () => {
+ setRefreshing(true);
+ fetchCountData();
+ fetchListData(1, activeTab, queryParams);
+ setTimeout(() => {
+ setRefreshing(false);
+ }, 1000);
+ };
+
+ // 加载更多
+ const loadMoreData = (callback) => {
+ if (loading || !hasMore) {
+ if (callback) callback();
+ return;
+ }
+
+ setLoading(true);
+ fetchListData(page + 1, activeTab, queryParams)
+ .then(() => {
+ if (callback) callback();
+ })
+ .catch(() => {
+ if (callback) callback();
+ });
+ };
+
+ // 跳转到详情页
+ const handleGoToDetail = async (item) => {
+ if (!item) return;
+
+ // 督办标签处理
+ if (activeTab === 'supervise') {
+ try {
+ setSuperviseLoading(true);
+ const res = await getSuperviseDetailApi(item.ownerId);
+ if (res.type) {
+ setCurrentSupervise(res.data);
+ setSuperviseReplyVisible(true);
+ } else {
+ Toast.show({
+ content: '获取督办详情失败',
+ position: 'bottom',
+ });
+ }
+ } catch (error) {
+ console.error('获取督办详情失败', error);
+ Toast.show({
+ content: '获取督办详情失败，请稍后重试',
+ position: 'bottom',
+ });
+ } finally {
+ setSuperviseLoading(false);
+ }
+ return;
+ }
+
+ // 全部标签处理
+ if (activeTab === 'all') {
+ if (item.taskTypeName === '督办') {
+ try {
+ setSuperviseLoading(true);
+ const res = await getSuperviseDetailApi(item.ownerId);
+ if (res.type) {
+ setCurrentSupervise(res.data);
+ setSuperviseReplyVisible(true);
+ } else {
+ Toast.show({
+ content: '获取督办详情失败',
+ position: 'bottom',
+ });
+ }
+ } catch (error) {
+ console.error('获取督办详情失败', error);
+ Toast.show({
+ content: '获取督办详情失败，请稍后重试',
+ position: 'bottom',
+ });
+ } finally {
+ setSuperviseLoading(false);
+ }
+ return;
+ }
+
+ // 其他类型的跳转
+ let path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true`;
+ if (item.taskType) {
+ path += `&moutedTab=${item.taskType}`;
+ }
+ history.push(path);
+ return;
+ }
+
+ // 其他标签的处理
+ let path = '';
+ switch (activeTab) {
+ case 'merge':
+ path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true&moutedTab=hbcl`;
+ break;
+ case 'dispatch':
+ path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true&moutedTab=dslxq`;
+ break;
+ case 'accept':
+ path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true&slTitle=true`;
+ break;
+ case 'processing':
+ path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true&moutedTab=sxbl`;
+ break;
+ case 'review':
+ let reviewTab = '';
+ switch (activeReviewButton) {
+ case 1:
+ reviewTab = 'htsh';
+ break;
+ case 2:
+ reviewTab = 'sbsh';
+ break;
+ case 3:
+ reviewTab = 'jash';
+ break;
+ case 4:
+ reviewTab = 'lhczsh';
+ break;
+ default:
+ reviewTab = 'htsh';
+ }
+ path = `/gzdyh/flow?caseTaskId=${item.ownerId}&caseId=${item.caseId}&editShow=true&moutedTab=${reviewTab}`;
+ break;
+ default:
+ path = `/gzdyh/detail?caseId=${item.caseId}`;
+ }
+ $$.setSessionStorage('visitWorkBench', {
+ tabId: activeTab,
+ params: queryParams,
+ });
+ history.push(path);
+ };
+
+ // 关闭督办回复弹窗
+ const handleCloseSuperviseReply = () => {
+ setSuperviseReplyVisible(false);
+ setCurrentSupervise(null);
+ setReplyContent('');
+ setAttachments([]);
+ };
+
+ // 处理按钮点击
+ const handleButtonClick = (type) => {
+ if (type === 3) {
+ setFilterVisible(true);
+ return;
+ } else {
+ setActiveButton(type);
+ fetchListData(1, activeTab, { ...queryParams, caseTaskType: type });
+ }
+ };
+
+ // 处理审核按钮点击
+ const handleReviewButtonClick = (type) => {
+ setActiveReviewButton(type);
+ fetchListData(1, activeTab, { ...queryParams, type: type });
+ };
+
+ // 关闭标签气泡
+ const handleCloseLabelPopguide = () => {
+ setLabelVisible(false);
+ setCurrentCaseId(null);
+ };
+
+ // 处理风险标签点击
+ const handleRiskLabelClick = async (caseId) => {
+ try {
+ // 如果是同一个标签再次点击，直接关闭气泡
+ if (currentCaseId === caseId && labelVisible) {
+ setLabelVisible(false);
+ setCurrentCaseId(null);
+ return;
+ }
+
+ setCurrentCaseId(caseId);
+
+ const res = await getLabelApi(caseId);
+ if (res.type) {
+ setLabelInfo({
+ personLabel: res.data.personLabel || '',
+ caseLabel: res.data.caseLabel || '',
+ });
+ // 等数据加载完毕后再显示气泡
+ setTimeout(() => {
+ setLabelVisible(true);
+ }, 10);
+ } else {
+ Toast.show({
+ content: '获取标签信息失败',
+ position: 'bottom',
+ });
+ }
+ } catch (error) {
+ console.error('获取标签信息失败', error);
+ Toast.show({
+ content: '获取标签信息失败，请稍后重试',
+ position: 'bottom',
+ });
+ }
+ };
+
+ // 提交督办回复
+ const handleSubmitSuperviseReply = async () => {
+ if (!replyContent.trim()) {
+ Toast.show({
+ content: '请输入回复内容',
+ position: 'bottom',
+ });
+ return;
+ }
+
+ if (!currentSupervise) return;
+
+ const requestData = {
+ replyContent: replyContent,
+ id: currentSupervise.id,
+ };
+
+ try {
+ global.setSpinning(true);
+ const res = await replyCaseSuperviseApi(requestData);
+ global.setSpinning(false);
+
+ if (res.type) {
+ Toast.show({
+ content: '回复成功',
+ position: 'bottom',
+ });
+ handleCloseSuperviseReply();
+ fetchListData(1, activeTab, queryParams); // 刷新列表
+ } else {
+ Toast.show({
+ content: res.message || '回复失败',
+ position: 'bottom',
+ });
+ }
+ } catch (error) {
+ global.setSpinning(false);
+ console.error('提交督办回复失败', error);
+ Toast.show({
+ content: '网络异常，请稍后再试',
+ position: 'bottom',
+ });
+ }
+ };
+
+ // 使用回复模板
+ const handleUseTemplate = () => {
+ setReplyContent('双方当事人于xx时间xx地址已达成xx协议，纠纷已化解。');
+ };
+
+ // OCR识别材料
+ const handleOcrRecognize = () => {
+ Toast.show({
+ content: '正在识别材料...',
+ position: 'bottom',
+ });
+
+ // 模拟识别结果
+ setTimeout(() => {
+ setReplyContent(replyContent + (replyContent ? '\n\n' : '') + '通过识别，确认双方当事人已达成和解协议，纠纷已妥善处理。');
+ Toast.show({
+ content: '识别完成',
+ position: 'bottom',
+ });
+ }, 1000);
+ };
+
+ // 渲染顶部轮播图
+ const renderCarousel = () => {
+ return (
+ <div className="home-carousel">
+ <Swiper autoplay={true} loop={true}>
+ {carouselItems.map((item) => (
+ <Swiper.Item key={item.id}>
+ <div className="home-carousel-item">
+ <img src={item.src} alt={item.alt} />
+ </div>
+ </Swiper.Item>
+ ))}
+ </Swiper>
+ </div>
+ );
+ };
+
+ // 渲染功能按钮
+ const renderFunctionButtons = () => {
+ return (
+ <div className="home-function-buttons">
+ {functionItems.map((item) => (
+ <div key={item.id} className="home-function-button-wrapper">
+ <div className="home-function-button" onClick={() => history.push(item.path)}>
+ <div className="home-function-button-icon">
+ <img src={item.icon} alt={item.text} />
+ </div>
+ </div>
+ <div className="home-function-button-text">{item.text}</div>
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ // 渲染Tab栏
+ const renderTabs = () => {
+ return (
+ <div className="home-tabs">
+ {tabItems.map((tab) => {
+ const count = tab.countKey ? countData[tab.countKey] || 0 : 0;
+ const isActive = activeTab === tab.id;
+
+ return (
+ <div
+ key={tab.id}
+ className={`home-tab ${isActive ? 'home-tab-active' : ''}`}
+ onClick={() => {
+ fetchListData(1, tab.id, queryParams);
+ }}
+ >
+ <div className="home-tab-text">{tab.text}</div>
+ {isActive && count > 0 && <div className="home-tab-count">({count})</div>}
+ </div>
+ );
+ })}
+ </div>
+ );
+ };
+
+ // 渲染列表项
+ const renderListItem = (item, index) => {
+ // 转换事项等级
+ const getGradeText = (grade) => {
+ switch (grade) {
+ case 1:
+ return '一级';
+ case 2:
+ return '二级';
+ case 3:
+ return '三级';
+ case 4:
+ return '四级';
+ case 5:
+ return '五级';
+ default:
+ return grade;
+ }
+ };
+
+ // 格式化时间
+ const formatTime = (time) => {
+ if (!time) return '';
+ const date = new Date(time);
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ const hours = String(date.getHours()).padStart(2, '0');
+ const minutes = String(date.getMinutes()).padStart(2, '0');
+ return `${year}-${month}-${day} ${hours}:${minutes}`;
+ };
+
+ // 判断时间状态
+ const getTimeStatus = () => {
+ if (!item.timeLimit) return null;
+
+ const now = new Date().getTime();
+ const limitTime = new Date(item.timeLimit).getTime();
+
+ if (now > limitTime) {
+ return 'timeout'; // 已超时
+ } else if (limitTime - now < 3600000) {
+ // 小于一小时(3600000毫秒)
+ return 'soon'; // 即将超时
+ }
+ return null;
+ };
+
+ // 获取标签列表
+ const getTagList = () => {
+ const tags = [];
+
+ // 时间状态标签 - 即将超时
+ if (getTimeStatus() === 'soon') {
+ tags.push({
+ text: '即将超时',
+ type: 'soon',
+ });
+ }
+
+ // 时间状态标签 - 已超时
+ if (getTimeStatus() === 'timeout') {
+ tags.push({
+ text: '已超时',
+ type: 'timeout',
+ });
+ }
+
+ // 督办标签
+ if (item.superviseCount > 0) {
+ tags.push({
+ text: '督办',
+ type: 'supervise',
+ });
+ }
+
+ return tags;
+ };
+
+ return (
+ <div className="home-list-item">
+ <div className="home-list-item-parties">
+ <div className="home-list-item-plaintiffs">{item.plaintiffs}</div>
+ {item.defendants && (
+ <>
+ <div className="home-list-item-parties-separator">、</div>
+ <div className="home-list-item-defendants">{item.defendants}</div>
+ </>
+ )}
+ </div>
+ <div className="home-list-item-time">{formatTime(item.turnaroundTime)}</div>
+ <div className="home-list-item-tags">
+ {activeTab === 'all' && item.taskTypeName && <div className="home-list-item-tag-type">{item.taskTypeName}</div>}
+ <div className="home-list-item-tag">{item.caseType}</div>
+ {activeTab === 'all' && item.isRisk === '1' && (
+ <Popguide
+ visible={labelVisible && currentCaseId === item.caseId}
+ onClose={handleCloseLabelPopguide}
+ title={
+ <div className="risk-label-content">
+ <div className="risk-label-item">
+ <span className="risk-label-title">人员标签：</span>
+ <span className="risk-label-value">({labelInfo.personLabel})</span>
+ </div>
+ <div className="risk-label-item">
+ <span className="risk-label-title">事项标签：</span>
+ <span className="risk-label-value">({labelInfo.caseLabel})</span>
+ </div>
+ </div>
+ }
+ placement="top"
+ getPopupContainer={() => document.querySelector('.home-container')}
+ >
+ <div className="home-list-item-tag-timeout" id={`risk-tag-${item.caseId}`} onClick={() => handleRiskLabelClick(item.caseId)}>
+ 风险
+ </div>
+ </Popguide>
+ )}
+ </div>
+ <div className="home-list-item-info">
+ <div className="home-list-item-address">
+ {item.caseSource} | {getGradeText(item.caseGrade)}
+ </div>
+ <div className="home-list-item-action">
+ <div className="home-list-item-action-btn" onClick={() => handleGoToDetail(item)}>
+ 处理
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ };
+
+ // 渲染列表内容
+ const renderListContent = () => {
+ return (
+ <div className="home-list">
+ {activeTab === 'processing' && (
+ <div className="home-list-processing">
+ <div className="home-list-buttons">
+ <div className={`home-list-button ${activeButton === 1 ? 'active' : ''}`} onClick={() => handleButtonClick(1)}>
+ 办理中
+ </div>
+ <div className={`home-list-button ${activeButton === 2 ? 'active' : ''}`} onClick={() => handleButtonClick(2)}>
+ 结案申请
+ </div>
+ </div>
+ {/* 筛选条件 */}
+ <div className="home-list-processing-filter" onClick={() => handleButtonClick(3)}>
+ <div className="home-list-processing-filter-item">
+ <div className="home-list-processing-filter-item-img">
+ <img src={home_11} alt="办理中" />
+ </div>
+ <div className="home-list-processing-filter-item-value">
+ {searchParams.caseTaskTypeName}+{searchParams.mediatorTypeName}
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
+
+ {activeTab === 'review' && (
+ <div className="home-list-buttons">
+ <div className={`home-list-button ${activeReviewButton === 1 ? 'active' : ''}`} onClick={() => handleReviewButtonClick(1)}>
+ 回退审核
+ </div>
+ <div className={`home-list-button ${activeReviewButton === 2 ? 'active' : ''}`} onClick={() => handleReviewButtonClick(2)}>
+ 上报审核
+ </div>
+ <div className={`home-list-button ${activeReviewButton === 3 ? 'active' : ''}`} onClick={() => handleReviewButtonClick(3)}>
+ 结案审核
+ </div>
+ <div className={`home-list-button ${activeReviewButton === 4 ? 'active' : ''}`} onClick={() => handleReviewButtonClick(4)}>
+ 联合处置审核
+ </div>
+ </div>
+ )}
+
+ {loading && listData.length === 0 ? (
+ <div className="home-loading">
+ <div className="home-loading-text">加载中...</div>
+ </div>
+ ) : !loading && listData.length === 0 ? (
+ <div className="home-empty">
+ <img src={caseQuery_2} alt="暂无数据" className="home-empty-image" />
+ <div className="home-empty-text">暂无数据</div>
+ </div>
+ ) : (
+ <Scrollbars style={{ height: `calc(100vh - ${activeTab === 'review' || activeTab === 'processing' ? 435 : 386}px)` }}>
+ <MyList
+ data={listData}
+ dataTotal={totalCount}
+ hasMore={hasMore}
+ loadMore={loadMoreData}
+ getScrollTopKey={`home-${activeTab}`}
+ itemDom={renderListItem}
+ threshold={100}
+ showBottomText={true}
+ />
+ </Scrollbars>
+ )}
+ </div>
+ );
+ };
+
+ // 渲染底部导航
+ const renderBottomNav = () => {
+ return (
+ <div className="home-bottom-nav">
+ {bottomNavItems.map((item) => (
+ <div
+ key={item.id}
+ className={`home-bottom-nav-item ${item.id === 'home' ? 'home-bottom-nav-item-active' : ''}`}
+ onClick={() => history.push(item.path)}
+ >
+ <div className="home-bottom-nav-item-icon">
+ <img src={item.icon} alt={item.text} />
+ </div>
+ <div className="home-bottom-nav-item-text">{item.text}</div>
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ // 渲染督办回复弹窗
+ const renderSuperviseReplyModal = () => {
+ if (!currentSupervise) return null;
+
+ return (
+ <Drawer visible={superviseReplyVisible} onClose={handleCloseSuperviseReply} position="bottom">
+ <div className="dbcb-reply-home-wrapper">
+ <div className="dbcb-reply-home-header">
+ <div className="audit-drawer-title">督办回复</div>
+ <div className="audit-drawer-close" onClick={handleCloseSuperviseReply}>
+ <i className="audit-drawer-close-icon"></i>
+ </div>
+ </div>
+ <Scrollbars style={{ height: '55vh' }}>
+ <div className="dbcb-reply-home-content">
+ {/* 督办详情信息 */}
+ <div className="dbcb-reply-home-detail">
+ <div className="dbcb-reply-home-section">
+ <div className="dbcb-reply-home-label">督办时间</div>
+ <div className="dbcb-reply-home-value">{currentSupervise.supTime}</div>
+ </div>
+
+ <div className="dbcb-reply-home-section">
+ <div className="dbcb-reply-home-label">督办人</div>
+ <div className="dbcb-reply-home-value">{`${currentSupervise.supUserName} (${currentSupervise.supUnitName})`}</div>
+ </div>
+
+ <div className="dbcb-reply-home-section">
+ <div className="dbcb-reply-home-label">督办内容</div>
+ <div className="dbcb-reply-home-value">{currentSupervise.supContent}</div>
+ </div>
+
+ {currentSupervise.fileInfoList && currentSupervise.fileInfoList.length > 0 && (
+ <div className="dbcb-reply-home-section">
+ <div className="dbcb-reply-home-label">督办附件</div>
+ <DingUpload
+ fileList={(currentSupervise.fileInfoList || []).map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '12.3K',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ title=""
+ />
+ </div>
+ )}
+ </div>
+ {/* 分割线 */}
+ <div className="dbcb-reply-home-divider"></div>
+
+ {/* 回复内容区域 */}
+ <div className="dbcb-reply-home-section">
+ <div className="dbcb-reply-home-label">
+ <span className="dbcb-reply-home-label-text">回复内容</span>
+ <div className="dbcb-reply-home-btn-group">
+ {/* <div className="dbcb-reply-home-ocr-btn" onClick={handleOcrRecognize}>
+ <svg viewBox="0 0 1024 1024" width="20" height="20">
+ <path
+ d="M832 128H192c-35.2 0-64 28.8-64 64v640c0 35.2 28.8 64 64 64h640c35.2 0 64-28.8 64-64V192c0-35.2-28.8-64-64-64z m0 704H192V192h640v640z"
+ fill="#1A6FB8"
+ ></path>
+ <path
+ d="M696.9 298.1H584.1c-12.3 0-22.3 10-22.3 22.3s10 22.3 22.3 22.3h69l-155.8 155.8c-8.7 8.7-8.7 22.8 0 31.5 4.4 4.4 10.1 6.5 15.7 6.5s11.4-2.2 15.7-6.5l155.8-155.8v69c0 12.3 10 22.3 22.3 22.3s22.3-10 22.3-22.3V320.4c0.1-12.3-9.9-22.3-22.2-22.3z"
+ fill="#1A6FB8"
+ ></path>
+ <path
+ d="M428.5 685.5c4.4 4.4 10.1 6.5 15.7 6.5s11.4-2.2 15.7-6.5c8.7-8.7 8.7-22.8 0-31.5L303.2 497.3v-69c0-12.3-10-22.3-22.3-22.3s-22.3 10-22.3 22.3v112.8c0 12.3 10 22.3 22.3 22.3h112.8c12.3 0 22.3-10 22.3-22.3s-10-22.3-22.3-22.3h-69L428.5 654c8.6 8.7 8.6 22.8 0 31.5z"
+ fill="#1A6FB8"
+ ></path>
+ </svg>
+ 识别材料
+ </div> */}
+ <div className="dbcb-reply-home-template-btn" onClick={handleUseTemplate}>
+ <svg viewBox="0 0 1024 1024" width="20" height="20">
+ <path
+ d="M832 64H192C121.6 64 64 121.6 64 192v640c0 70.4 57.6 128 128 128h640c70.4 0 128-57.6 128-128V192c0-70.4-57.6-128-128-128zM192 128h640c35.2 0 64 28.8 64 64v256h-768V192c0-35.2 28.8-64 64-64z m640 768H192c-35.2 0-64-28.8-64-64V512h768v320c0 35.2-28.8 64-64 64z"
+ fill="#1A6FB8"
+ ></path>
+ <path d="M672 320H544V192h128v128zM672 832H544V704h128v128z" fill="#1A6FB8"></path>
+ </svg>
+ 选择模板
+ </div>
+ </div>
+ </div>
+ <TextareaItem placeholder={`请填写`} value={replyContent} onChange={(value) => setReplyContent(value)} rows={4} />
+ </div>
+
+ {/* 附件区域 */}
+ <div className="dbcb-reply-home-section">
+ <DingUpload
+ fileList={attachments}
+ onChange={(info) => {
+ if (info.fileList) {
+ setAttachments(info.fileList);
+ }
+ }}
+ ownerId={currentSupervise.id}
+ ownerType="22_00018-507"
+ disabled={false}
+ viewOnly={false}
+ accept="image/*, .pdf, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .txt"
+ tipText="支持扩展名：.doc .docx .pdf .jpg 等，30M以内"
+ btnText="添加附件"
+ subtitle="请上传与内容相关的附件材料"
+ title="附件材料"
+ />
+ </div>
+ </div>
+ </Scrollbars>
+ {/* 底部按钮 */}
+ <div className="dbcb-reply-home-footer">
+ <Button type="primary" className="dbcb-reply-home-submit-btn" onClick={handleSubmitSuperviseReply}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </Drawer>
+ );
+ };
+
+ return (
+ <NavBarPage title="首页">
+ <div className="home-container">
+ {/* 顶部轮播图 */}
+ {renderCarousel()}
+
+ {/* 功能按钮 */}
+ {renderFunctionButtons()}
+
+ {/* Tab栏 */}
+ {renderTabs()}
+
+ {/* 搜索框 */}
+ <div className="home-search-box">
+ <div className="home-search-box-input">
+ <InputItem placeholder="申请人/被申请人/事项编号" value={searchParams.partyName} onChange={(value) => setSearchParams({ ...searchParams, partyName: value })} className="custom-search-input" />
+ <button onClick={() => fetchListData(1, activeTab, { ...queryParams, partyName: searchParams.partyName })} className="custom-search-btn">查询</button>
+ </div>
+ </div>
+
+ {/* 内容区域 */}
+ <div className="home-content">{renderListContent()}</div>
+
+ {/* 底部导航 */}
+ {renderBottomNav()}
+
+ {/* 督办回复弹窗 */}
+ {renderSuperviseReplyModal()}
+ </div>
+ {filterVisible && (
+ <div className="filter-modal-mask" onClick={() => setFilterVisible(false)}>
+ <div className="filter-modal" onClick={(e) => e.stopPropagation()}>
+ <div className="filter-modal-header">
+ <span>筛选</span>
+ <span className="filter-modal-close" onClick={() => setFilterVisible(false)}>
+ ×
+ </span>
+ </div>
+ <div className="filter-modal-section">
+ <div className="filter-modal-label">办理角色</div>
+ <div className="filter-modal-options">
+ <div
+ className={`filter-modal-option${searchParams.caseTaskType === '1' ? ' selected' : ''}`}
+ onClick={() => setSearchParams({ ...searchParams, caseTaskTypeName: '我承办的', caseTaskType: '1' })}
+ >
+ 我承办的
+ </div>
+ <div
+ className={`filter-modal-option${searchParams.caseTaskType === '2' ? ' selected' : ''}`}
+ onClick={() => setSearchParams({ ...searchParams, caseTaskTypeName: '我配合的', caseTaskType: '2' })}
+ >
+ 我配合的
+ </div>
+ </div>
+ </div>
+ <div className="filter-modal-section">
+ <div className="filter-modal-label">查询范围</div>
+ <div className="filter-modal-options">
+ <div
+ className={`filter-modal-option${searchParams.mediatorType === '0' ? ' selected' : ''}`}
+ onClick={() => setSearchParams({ ...searchParams, mediatorTypeName: '本部门办理', mediatorType: '0' })}
+ >
+ 本部门办理
+ </div>
+ <div
+ className={`filter-modal-option${searchParams.mediatorType === '1' ? ' selected' : ''}`}
+ onClick={() => setSearchParams({ ...searchParams, mediatorTypeName: '本人办理', mediatorType: '1' })}
+ >
+ 本人办理
+ </div>
+ <div
+ className={`filter-modal-option${searchParams.mediatorType === '2' ? ' selected' : ''}`}
+ onClick={() => setSearchParams({ ...searchParams, mediatorTypeName: '未指派经办人', mediatorType: '2' })}
+ >
+ 未指派经办人
+ </div>
+ </div>
+ </div>
+ <button
+ className="filter-modal-confirm"
+ onClick={() => {
+ setFilterVisible(false);
+ fetchListData(1, activeTab, {
+ ...queryParams,
+ caseTaskType: searchParams.caseTaskType,
+ mediatorType: searchParams.mediatorType,
+ });
+ }}
+ >
+ 确定
+ </button>
+ </div>
+ </div>
+ )}
+ </NavBarPage>
+ );
+};
+
+export default Home;
diff --git a/src/views/home/index.less b/src/views/home/index.less
new file mode 100644
index 0000000..cd67a3c
--- /dev/null
+++ b/src/views/home/index.less
@@ -0,0 +1,744 @@
+// 首页样式
+.home-container {
+ background-color: #f5f5f5;
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ overflow: hidden;
+}
+
+// 轮播图样式
+.home-carousel {
+ width: calc(100% - 16px);
+ height: 120px;
+ margin: 8px 8px 8px 8px;
+ border-radius: 8px;
+ overflow: hidden;
+
+ .home-carousel-item {
+ width: 100%;
+ height: 120px;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ border-radius: 8px;
+ }
+ }
+}
+
+// 功能按钮样式
+.home-function-buttons {
+ display: flex;
+ justify-content: space-between;
+ padding: 0 16px;
+ margin-bottom: 16px;
+
+ .home-function-button-wrapper {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ position: relative;
+
+ &:nth-child(1) .home-function-button {
+ background: linear-gradient(180deg, #57a9fb, #206ccf 100%);
+ }
+
+ &:nth-child(2) .home-function-button {
+ background: linear-gradient(180deg, #36cfc9, #08979c 100%);
+ }
+
+ &:nth-child(3) .home-function-button {
+ background: linear-gradient(180deg, #f76560, #c2252b 100%);
+ }
+
+ &:nth-child(4) .home-function-button {
+ background: linear-gradient(180deg, #ffa940, #d46b08 100%);
+ }
+ }
+
+ .home-function-button {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 64px;
+ height: 64px;
+ border-radius: 12px;
+
+ .home-function-button-icon {
+ width: 40px;
+ height: 40px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+ }
+
+ .home-function-button-text {
+ font-size: 12px;
+ color: #333;
+ font-weight: 500;
+ margin-top: 4px;
+ }
+}
+
+// Tab栏样式
+.home-tabs {
+ display: flex;
+ flex-wrap: nowrap;
+ overflow-x: auto;
+ padding: 0 8px;
+ // border-bottom: 1px solid #e8e8e8;
+ height: 40px;
+ align-items: center;
+ width: auto;
+
+ &::-webkit-scrollbar {
+ display: none;
+ }
+
+ .home-tab {
+ padding: 0 8px;
+ height: 23px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ position: relative;
+ flex-shrink: 0;
+ transition: all 0.3s;
+
+ .home-tab-text {
+ font-size: 15px;
+ color: rgba(23, 26, 29, 0.6);
+ white-space: nowrap;
+ }
+
+ .home-tab-count {
+ font-size: 15px;
+ color: rgba(23, 26, 29, 0.6);
+ margin-left: 4px;
+ }
+
+ &.home-tab-active {
+ height: 38px;
+ width: auto;
+
+ .home-tab-text {
+ font-size: 20px;
+ font-weight: bold;
+ color: #171a1d;
+ }
+
+ .home-tab-count {
+ font-size: 20px;
+ font-weight: bold;
+ color: #171a1d;
+ margin-left: 4px;
+ }
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 42px;
+ height: 6px;
+ background: linear-gradient(90deg, #e8f8ff, #1a6fb8 100%);
+ border-radius: 2px;
+ }
+ }
+ }
+}
+
+// 列表样式
+.home-list {
+ padding: 8px 8px;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+
+ .home-list-processing {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+ height: 100%;
+ &-filter {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 16px;
+ &-item {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 4px;
+ color: #1a6fb8;
+ font-size: 14px
+ }
+ }
+ }
+
+ .home-list-buttons {
+ display: flex;
+ margin-bottom: 16px;
+ position: relative;
+ z-index: 1;
+ flex-wrap: wrap;
+
+ .home-list-button {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ background: rgba(23, 26, 29, 0.06);
+ padding: 0px 4px;
+ cursor: pointer;
+ margin-right: 10px;
+ transition: all 0.3s;
+
+ &.active {
+ color: #1a6fb8;
+ background: rgba(26, 111, 184, 0.1);
+ }
+ }
+ }
+
+ .home-list-item {
+ background-color: #fff;
+ padding: 6px 12px 6px 12px;
+ margin-bottom: 8px;
+ position: relative;
+
+ .home-list-item-parties {
+ display: flex;
+ font-size: 16px;
+ font-weight: bold;
+ color: #333;
+ max-width: 167px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+
+ .home-list-item-plaintiffs,
+ .home-list-item-defendants {
+ max-width: 45%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .home-list-item-parties-separator {
+ margin: 0 4px;
+ }
+ }
+
+ .home-list-item-time {
+ position: absolute;
+ top: 12px;
+ right: 12px;
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+
+ .home-list-item-tags {
+ display: flex;
+ flex-wrap: wrap;
+ margin-bottom: 8px;
+
+ .home-list-item-tag-type {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ color: #f53f3f;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ border: 1px solid #f53f3f;
+ margin-top: 8px;
+ }
+
+ .home-list-item-tag {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ color: #1a6fb8;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ border: 1px solid #1a6fb8;
+ background: none;
+ margin-top: 8px;
+ }
+
+ .home-list-item-tag-timeout {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #f53f3f;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ margin-top: 8px;
+ }
+
+ .home-list-item-tag-soon {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #f53f3f;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ }
+
+ .home-list-item-tag-supervise {
+ height: 20px;
+ padding: 0 6px;
+ border-radius: 4px;
+ background-color: #ff7d00;
+ color: #ffffff;
+ font-size: 12px;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ margin-top: 8px;
+ }
+ }
+
+ .home-list-item-info {
+ display: flex;
+ justify-content: space-between;
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ align-items: center;
+
+ .home-list-item-address {
+ flex: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .home-list-item-grade {
+ margin-left: 8px;
+ }
+
+ .home-list-item-action {
+ margin-left: 8px;
+
+ .home-list-item-action-btn {
+ width: 64px;
+ height: 28px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ font-size: 14px;
+ border-radius: 100px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+ }
+ }
+ }
+
+ .home-loading-more,
+ .home-no-more {
+ text-align: center;
+ color: #999;
+ font-size: 12px;
+ padding: 8px 0;
+ }
+}
+
+// 加载状态样式
+.home-loading,
+.home-empty {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+ z-index: 0;
+
+ .home-empty-icon {
+ width: 260px;
+ height: 260px;
+ padding-top: 120px;
+ border: 1px dashed rgba(23, 26, 29, 0.1);
+ border-radius: 8px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ img {
+ width: 120px;
+ height: 120px;
+ object-fit: contain;
+ }
+ }
+
+ .home-loading-text,
+ .home-empty-text {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 16px;
+ }
+ .home-empty-image {
+ width: 200px;
+ height: 200px;
+ }
+}
+
+// 底部导航样式
+.home-bottom-nav {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 60px;
+ background-color: #fff;
+ display: flex;
+ justify-content: space-around;
+ align-items: center;
+ border-top: 1px solid #e8e8e8;
+
+ .home-bottom-nav-item {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ flex: 1;
+ height: 100%;
+
+ .home-bottom-nav-item-icon {
+ width: 18px;
+ height: 18px;
+ margin-bottom: 2px;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ }
+ }
+
+ .home-bottom-nav-item-text {
+ font-size: 14px;
+ color: #666;
+ }
+
+ &.home-bottom-nav-item-active {
+ .home-bottom-nav-item-text {
+ color: #1a6fb8;
+ }
+ }
+ }
+}
+
+// 确保在PullToRefresh组件中居中
+.dtm-pull-to-refresh-content {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 100%;
+}
+
+// 内容区域样式
+.home-content {
+ height: calc(100vh - 280px);
+ overflow: hidden;
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+}
+
+// MyList样式调整
+.myList {
+ flex: 1;
+ overflow-y: auto;
+ overflow-x: hidden;
+ -webkit-overflow-scrolling: touch;
+
+ &::-webkit-scrollbar {
+ display: none;
+ }
+}
+
+// 督办回复样式
+.dbcb-reply-home {
+ &-wrapper {
+ background-color: #fff;
+ border-top-left-radius: 12px;
+ border-top-right-radius: 12px;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ }
+
+ &-header {
+ display: flex;
+ justify-content: space-between;
+ padding: 12px 16px;
+ margin-bottom: 10px;
+ position: relative;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 16px;
+ right: 16px;
+ height: 1px;
+ background: none;
+ border-bottom: 1px dashed rgba(126, 134, 142, 0.24);
+ }
+ }
+
+ &-content {
+ flex: 1;
+ overflow-y: auto;
+ padding: 0 16px;
+ }
+
+ &-divider {
+ height: 8px;
+ margin: 0 -16px 12px;
+ width: calc(100% + 32px);
+ }
+
+ &-detail {
+ border-radius: 8px;
+ margin-bottom: 16px;
+ }
+
+ &-section {
+ margin-bottom: 16px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ &-label {
+ font-size: 14px;
+ color: #999;
+ margin-bottom: 8px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+
+ &-text {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ }
+
+ &-value {
+ font-size: 15px;
+ color: #333;
+ line-height: 1.5;
+ }
+
+ &-btn-group {
+ display: flex;
+ gap: 16px;
+ }
+
+ &-ocr-btn,
+ &-template-btn {
+ display: flex;
+ align-items: center;
+ gap: 4px;
+ font-size: 14px;
+ color: #1a6fb8;
+ cursor: pointer;
+ }
+
+ &-textarea {
+ width: 100%;
+ height: 120px;
+ border-radius: 4px;
+ resize: none;
+ font-size: 14px;
+ line-height: 1.5;
+ border: 1px solid #e5e6eb;
+ padding: 12px;
+
+ &:focus {
+ outline: none;
+ border-color: #1a6fb8;
+ }
+ }
+
+ &-footer {
+ padding: 16px;
+ background-color: #fff;
+ margin-top: auto;
+ }
+
+ &-submit-btn {
+ width: 100%;
+ height: 44px;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ }
+}
+
+// 风险标签气泡样式
+.risk-label-content {
+ color: #ffffff;
+ padding: 10px 0;
+
+ .risk-label-item {
+ margin-bottom: 8px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .risk-label-title {
+ font-size: 14px;
+ font-weight: bold;
+ }
+
+ .risk-label-value {
+ font-size: 14px;
+ }
+ }
+}
+
+.home-search-box {
+ margin: 12px 12px 12px 12px;
+ .home-search-box-input {
+ display: flex;
+ align-items: center;
+ border: 1.5px solid #b5d3f3;
+ border-radius: 24px;
+ background: #fff;
+ padding: 0 6px 0 16px;
+ height: 44px;
+ box-sizing: border-box;
+ .custom-search-input {
+ flex: 1;
+ border: none;
+ background: transparent;
+ font-size: 16px;
+ color: #bdbdbd;
+ &::placeholder {
+ color: #bdbdbd;
+ }
+ &:disabled {
+ background: transparent;
+ color: #bdbdbd;
+ }
+ }
+ .custom-search-btn {
+ margin-left: 8px;
+ background: #1a6fb8;
+ color: #fff;
+ border: none;
+ border-radius: 20px;
+ padding: 0 20px;
+ height: 32px;
+ font-size: 16px;
+ cursor: pointer;
+ transition: background 0.2s;
+ &:active {
+ background: #155a96;
+ }
+ }
+ }
+}
+
+.filter-modal-mask {
+ position: fixed;
+ left: 0; top: 0; right: 0; bottom: 0;
+ background: rgba(0,0,0,0.35);
+ z-index: 1000;
+ display: flex;
+ align-items: flex-end;
+ justify-content: center;
+}
+.filter-modal {
+ width: 100%;
+ background: #fff;
+ border-radius: 16px 16px 0 0;
+ padding: 20px 20px 16px 20px;
+ box-sizing: border-box;
+ animation: slideUp 0.2s;
+}
+@keyframes slideUp {
+ from { transform: translateY(100%);}
+ to { transform: translateY(0);}
+}
+.filter-modal-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 18px;
+ font-weight: bold;
+ margin-bottom: 16px;
+}
+.filter-modal-close {
+ font-size: 22px;
+ color: #1a6fb8;
+ cursor: pointer;
+}
+.filter-modal-section {
+ margin-bottom: 18px;
+}
+.filter-modal-label {
+ font-size: 15px;
+ color: #333;
+ margin-bottom: 10px;
+}
+.filter-modal-options {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 12px;
+}
+.filter-modal-option {
+ flex-shrink: 1;
+ flex-basis: calc(50% - 6px);
+ min-width: 0;
+ box-sizing: border-box;
+ margin-bottom: 12px;
+ background: #F2F3F5;
+ border-radius: 4px;
+ text-align: center;
+ padding: 8px 0;
+}
+.filter-modal-option.selected {
+ border: 1.5px solid #1a6fb8;
+ background: #e8f4ff;
+ color: #1a6fb8;
+}
+.filter-modal-confirm {
+ width: 100%;
+ height: 44px;
+ background: #1a6fb8;
+ color: #fff;
+ border: none;
+ border-radius: 8px;
+ font-size: 18px;
+ margin-top: 10px;
+ cursor: pointer;
+}
diff --git a/src/views/login/index.jsx b/src/views/login/index.jsx
new file mode 100644
index 0000000..7065c66
--- /dev/null
+++ b/src/views/login/index.jsx
@@ -0,0 +1,261 @@
+/*
+ * @Company: hugeInfo
+ * @Author: xzx
+ * @Date: 2022-03-25 11:00:36
+ * @LastEditors: lwh
+ * @LastEditTime: 2025-04-25 11:16:26
+ * @Version: 1.0.0
+ * @Description: 登录注册页 TODO:注释掉的内容代码是暂时没有开发的功能，后续看需求是否添加
+ */
+import React, { useEffect, useState, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Form, Input, Button, message, Checkbox, Modal } from 'antd';
+import { EyeInvisibleOutlined, EyeOutlined, CloseCircleFilled } from '@ant-design/icons';
+import * as $$ from '../../utils/utility';
+import logAvatar from '../../assets/img/logAvatar.png';
+import logo1 from '../../assets/img/logo1.png';
+import SlideTest from '../../components/SlideTest';
+
+// 登录接口
+function logInApi(data) {
+ return $$.ax.request({ url: 'ctAccount/login', type: 'post', data, service: 'cust' });
+}
+
+// 角色选择
+function switchRoleApi(data) {
+ return $$.ax.request({ url: 'ctAccount/switchRole', type: 'get', data, service: 'cust' });
+}
+
+const LogAndSign = () => {
+ const [isLog, setIsLog] = useState(false);
+ const [forgotPwdVisible, setForgotPwdVisible] = useState(false);
+ const isComponentMounted = useRef(true);
+ const modalRef = useRef(null);
+
+ useEffect(() => {
+ let token = $$.getSessionStorage('customerSystemToken');
+ setIsLog(!!token);
+
+ return () => {
+ isComponentMounted.current = false;
+ // 清理所有 ResizeObserver
+ if (window.ResizeObserver) {
+ const resizeObservers = window.ResizeObserver.prototype.observe;
+ if (resizeObservers) {
+ window.ResizeObserver.prototype.observe = function(target) {
+ if (target && target.isConnected && isComponentMounted.current) {
+ resizeObservers.call(this, target);
+ }
+ };
+ }
+ }
+ };
+ }, []);
+
+ // 变更登录状态
+ function transformLogStatus(status) {
+ if (isComponentMounted.current) {
+ setIsLog(status);
+ // 确保关闭所有 Modal
+ setForgotPwdVisible(false);
+ // 清理所有 ResizeObserver
+ if (window.ResizeObserver) {
+ const resizeObservers = window.ResizeObserver.prototype.observe;
+ if (resizeObservers) {
+ window.ResizeObserver.prototype.observe = function(target) {
+ if (target && target.isConnected && isComponentMounted.current) {
+ resizeObservers.call(this, target);
+ }
+ };
+ }
+ }
+ }
+ }
+
+ // 打开忘记密码弹窗
+ const showForgotPwdModal = () => {
+ if (isComponentMounted.current) {
+ setForgotPwdVisible(true);
+ }
+ };
+
+ // 关闭忘记密码弹窗
+ const closeForgotPwdModal = () => {
+ if (isComponentMounted.current) {
+ setForgotPwdVisible(false);
+ }
+ };
+
+ return (
+ <div className="h5-login">
+ <main className="h5-login-container">
+ {!isLog && <BeforeLog returnLogStatus={transformLogStatus} showForgotPwdModal={showForgotPwdModal} />}
+ {isLog && <AfterLog returnLogStatus={transformLogStatus} />}
+ </main>
+ <div
+ onClick={() => {
+ window.open('https://beian.miit.gov.cn');
+ }}
+ className="public-a"
+ >
+ 粤ICP备2022017384号
+ </div>
+
+ {/* 忘记密码弹窗 */}
+ <Modal
+ visible={forgotPwdVisible}
+ footer={null}
+ closable={false}
+ maskClosable={false}
+ wrapClassName="h5-login-forgot-modal"
+ destroyOnClose
+ ref={modalRef}
+ >
+ <div className="h5-login-forgot-content">
+ <div className="h5-login-forgot-header">
+ <div className="h5-login-forgot-title">忘记密码</div>
+ <CloseCircleFilled className="h5-login-forgot-close" onClick={closeForgotPwdModal} />
+ </div>
+ <div className="h5-login-forgot-desc">找回密码请通过拨打电话或在各区系统工作微信群中联系技术支持人员</div>
+ <Button className="h5-login-forgot-btn" onClick={closeForgotPwdModal}>
+ 关闭
+ </Button>
+ </div>
+ </Modal>
+ </div>
+ );
+};
+
+//等待登录 组件
+const BeforeLog = ({ returnLogStatus, showForgotPwdModal }) => {
+ const history = useHistory();
+
+ // 滑动验证
+ const [isSuccessCode, setIsSuccessCode] = useState(false);
+ const [rememberAccount, setRememberAccount] = useState(false);
+
+ // 表单
+ const [form] = Form.useForm();
+
+ // 登录提交
+ async function submitLogInfo(value) {
+ global.setSpinning(true);
+ const res = await logInApi(value);
+ if (res.type) {
+ message.success('您已登入成功，欢迎回来！');
+ $$.clearSessionStorage();
+ $$.setSessionStorage('customerSystemToken', res.data?.token);
+ $$.setSessionStorage('customerSystemUser', res.data || {});
+ // 清除公共数据
+ let ctUseroleList = res.data?.ctUseroleList || [];
+ if (ctUseroleList.length === 1) {
+ const res = await switchRoleApi({ roleCode: ctUseroleList[0]?.roleCode });
+ if (res.type) {
+ $$.setSessionStorage('customerSystemToken', res.data);
+ history.push('/gzdyh/home');
+ }
+ } else {
+ returnLogStatus(true);
+ }
+ }
+ global.setSpinning(false);
+ }
+
+ return (
+ <div className="h5-login-card">
+ <div className="h5-login-logo">
+ <img src={logo1} alt="系统标志" />
+ </div>
+ <div className="h5-login-title">
+ <div className="h5-login-title-main">广州市社会治安综合治理应用平台</div>
+ <div className="h5-login-title-sub">(矛盾纠纷应用)</div>
+ </div>
+ <div className="h5-login-subtitle">输入账号和密码进行登录</div>
+ <Form name="logForm" onFinish={submitLogInfo} form={form} size="large" className="h5-login-form">
+ <Form.Item name="acc" rules={[{ required: true, message: '请输入帐号' }]}>
+ <Input placeholder="请输入登录帐号" allowClear />
+ </Form.Item>
+ <Form.Item name="cipher" rules={[{ required: true, message: '请输入密码' }]}>
+ <Input.Password
+ type="password"
+ placeholder="请输入登录密码"
+ allowClear
+ autoComplete="on"
+ iconRender={(visible) => (visible ? <EyeOutlined /> : <EyeInvisibleOutlined />)}
+ />
+ </Form.Item>
+ <div className="h5-login-options">
+ <Checkbox checked={rememberAccount} onChange={(e) => setRememberAccount(e.target.checked)}>
+ 记住账号
+ </Checkbox>
+ <div className="h5-login-forgot" onClick={showForgotPwdModal}>
+ 忘记密码?
+ </div>
+ </div>
+ <Form.Item>
+ <Button htmlType="submit" block className="h5-login-button">
+ 登录
+ </Button>
+ </Form.Item>
+ </Form>
+ </div>
+ );
+};
+
+//已登录 组件
+const AfterLog = ({ returnLogStatus }) => {
+ const history = useHistory();
+ const user = $$.getSessionStorage('customerSystemUser') || {};
+ const roleList = user.ctUseroleList || [];
+ const [tabKey, setTabKey] = useState(0);
+
+ // 进入系统
+ async function enterPersonCenter() {
+ global.setSpinning(true);
+ const res = await switchRoleApi({ roleCode: roleList[tabKey]?.roleCode });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.setSessionStorage('customerSystemToken', res.data);
+ history.push('/gzdyh/home');
+ }
+ }
+
+ //登出
+ function handleLogOut() {
+ // 先清理所有状态
+ $$.clearLocal('customerSystemUser');
+ $$.clearSessionStorage();
+
+ // 使用 Promise 确保状态清理完成
+ Promise.resolve().then(() => {
+ returnLogStatus(false);
+ // 使用 history.replace 而不是 reload
+ history.replace('/login');
+ });
+ }
+
+ function subStrName() {
+ let arr = user?.trueName?.split('') || [];
+ return arr[0] + (arr.length > 1 ? '*' : '') + (arr.length > 2 ? arr[arr.length - 1] : '');
+ }
+
+ return (
+ <div className="h5-login-card">
+ <div className="h5-login-user-info">
+ <div className="h5-login-user-avatar">
+ <img src={logAvatar} alt="登录头像" />
+ </div>
+ <div className="h5-login-user-name">{subStrName()}</div>
+ <div className="h5-login-user-subtitle">最近一次登录时间：{$$.timeFormat(user?.lastLoginTime)}</div>
+ <Button className="h5-login-button" block onClick={enterPersonCenter}>
+ 进入平台
+ </Button>
+ <Button type="link" onClick={handleLogOut} className="h5-login-logout-btn">
+ 退出登录
+ </Button>
+ </div>
+ </div>
+ );
+};
+
+export default LogAndSign;
diff --git a/src/views/login/index.less b/src/views/login/index.less
new file mode 100644
index 0000000..3f1403a
--- /dev/null
+++ b/src/views/login/index.less
@@ -0,0 +1,349 @@
+.login {
+ &-main {
+ padding: 24px 16px;
+ display: flex;
+ flex-direction: column;
+ background: #fff;
+ margin: 48px 24px;
+ text-align: center;
+ border-radius: 10px;
+
+ &-logo {
+ display: flex;
+ justify-content: center;
+ padding: 0px;
+ &-img {
+ width: 88px;
+ height: 88px;
+ border-radius: 50%;
+ }
+ }
+ &-input {
+ background: #f6f6f6;
+ border-radius: 5px;
+ padding: 8px;
+ display: flex;
+ align-items: center;
+ margin-bottom: 12px;
+ & img {
+ width: 14px;
+ height: 14px;
+ margin-right: 8px;
+ }
+ }
+ &-foot {
+ height: 185px;
+ position: fixed;
+ opacity: 0.6;
+ bottom: 0;
+ &-img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+
+ & .dtm-list-item {
+ padding-left: 0 !important;
+ }
+ & .dtm-list-item .dtm-list-line {
+ padding-right: 0 !important;
+ }
+
+ & .dtm-list-line {
+ padding: 0 !important;
+ }
+
+ &-post {
+ background-color: #fff;
+ padding: 24px 16px;
+ margin: 12px 24px;
+ border-radius: 10px;
+ display: flex;
+ align-items: center;
+ // justify-content: space-between ;
+ &-name {
+ font-size: 16px;
+ line-height: 24px;
+ }
+ &-title {
+ background-color: #1A6FB8;
+ color: #fff;
+ border-radius: 8px;
+ padding: 4px 8px;
+ font-size: 14px;
+ line-height: 22px;
+ margin: 0 12px;
+ }
+ &-name1 {
+ background-color: #ff9200;
+ color: #fff;
+ font-size: 14px;
+ line-height: 22px;
+ padding: 2px 4px;
+ }
+ &-name2 {
+ background-color: #e2dfdf;
+ font-size: 14px;
+ line-height: 22px;
+ padding: 2px 4px;
+ }
+ }
+ }
+}
+
+.login-main .dtm-input-item-input {
+ background-color: transparent !important;
+}
+
+.login-main-remember {
+ display: flex;
+ align-items: center;
+ font-size: 14px;
+ color: #666;
+}
+
+/* 手机H5登录页样式 */
+.h5-login {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 100vh;
+ width: 100%;
+ background: linear-gradient(180deg, #FFF9EC 0%, #E4DBFB 100%);
+ position: relative;
+ overflow: hidden;
+
+ &-container {
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-card {
+ width: 100%;
+ max-width: 318px;
+ background-color: rgba(255, 255, 255, 0.6);
+ border-radius: 12px;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
+ padding: 24px;
+ margin: 0 auto;
+ box-sizing: border-box;
+ }
+
+ &-logo {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 16px;
+
+ img {
+ width: 120px;
+ height: auto;
+ }
+ }
+
+ &-title {
+ text-align: center;
+ margin-bottom: 16px;
+
+ &-main {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+ }
+
+ &-sub {
+ font-size: 14px;
+ color: #333;
+ font-weight: 500;
+ }
+ }
+
+ &-subtitle {
+ color: #999;
+ font-size: 14px;
+ text-align: center;
+ margin-bottom: 24px;
+ }
+
+ &-form {
+ .ant-form-item:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ &-options {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 24px;
+ font-size: 14px;
+ }
+
+ &-forgot {
+ color: #1A6FB8;
+ cursor: pointer;
+ }
+
+ &-button {
+ width: 295px;
+ height: 48px;
+ background: #1a6fb8;
+ border-radius: 10px;
+ font-size: 16px;
+ color: #fff;
+ }
+
+ /* 已登录用户信息样式 */
+ &-user {
+ &-info {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ &-avatar {
+ width: 80px;
+ height: 80px;
+ margin-bottom: 16px;
+
+ img {
+ width: 100%;
+ height: 100%;
+ border-radius: 50%;
+ object-fit: cover;
+ }
+ }
+
+ &-name {
+ font-size: 18px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 8px;
+ }
+
+ &-subtitle {
+ color: #999;
+ font-size: 12px;
+ margin-bottom: 24px;
+ text-align: center;
+ }
+ }
+
+ &-logout-btn {
+ margin-top: 12px;
+ }
+
+ /* 忘记密码弹窗样式 */
+ &-forgot-modal {
+ .ant-modal {
+ position: fixed;
+ width: 100% !important;
+ max-width: 100%;
+ margin: 0;
+ bottom: 0;
+ top: auto;
+ padding: 0;
+ }
+
+ .ant-modal-content {
+ border-radius: 8px 8px 0 0;
+ overflow: hidden;
+ animation: modalSlideUp 0.3s ease-out forwards;
+ transform: translateY(100%);
+ margin: 0;
+ }
+
+ .ant-modal-body {
+ padding: 0;
+ }
+
+ .ant-modal-wrap {
+ overflow: hidden;
+ }
+ }
+
+ &-forgot-content {
+ padding: 0px;
+ text-align: left;
+ }
+
+ &-forgot-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding-bottom: 4px;
+ border-bottom: 1px dashed #e8e8e8;
+ }
+
+ &-forgot-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ text-align: left;
+ margin-left: 0;
+ }
+
+ &-forgot-close {
+ font-size: 20px;
+ color: #1a6fb8;
+ cursor: pointer;
+ }
+
+ &-forgot-desc {
+ font-size: 14px;
+ color: #666;
+ line-height: 1.6;
+ margin-bottom: 16px;
+ text-align: left;
+ padding: 8px 0;
+ }
+
+ &-forgot-btn {
+ width: 100%;
+ height: 44px;
+ background: #1a6fb8;
+ border-radius: 8px;
+ color: #fff;
+ font-size: 16px;
+ border: none;
+ margin: 0 auto;
+ }
+}
+
+/* 表单项样式调整 */
+.h5-login-form .ant-form-item {
+ margin-bottom: 16px;
+}
+
+.h5-login-form .ant-input,
+.h5-login-form .ant-input-affix-wrapper {
+ height: 48px;
+ border-radius: 4px;
+ padding: 0 12px;
+}
+
+/* 底部信息 */
+.public-a {
+ color: #bbb;
+ font-size: 12px;
+ text-align: center;
+ position: absolute;
+ bottom: 24px;
+ width: 100%;
+}
+
+/* 弹窗动画 */
+@keyframes modalSlideUp {
+ from {
+ transform: translateY(100%);
+ }
+ to {
+ transform: translateY(0);
+ }
+}
diff --git a/src/views/message/index.jsx b/src/views/message/index.jsx
new file mode 100644
index 0000000..fa3bdee
--- /dev/null
+++ b/src/views/message/index.jsx
@@ -0,0 +1,56 @@
+import React from 'react';
+import './index.less';
+import { caseQuery_2, home_6, home_7, home_8, home_9 } from '../../assets/img';
+import NavBarPage from '../../components/NavBarPage';
+import { useHistory } from 'react-router-dom';
+
+ // 底部导航项
+ const bottomNavItems = [
+ { id: 'home', icon: home_6, text: '首页', path: '/gzdyh/home' },
+ { id: 'message', icon: home_7, text: '消息', path: '/gzdyh/message' },
+ { id: 'count', icon: home_8, text: '统计', path: '/gzdyh/workStatistics' },
+ { id: 'personCenter', icon: home_9, text: '我的', path: '/gzdyh/personCenter' },
+ ];
+
+const Message = () => {
+ const history = useHistory();
+
+ // 渲染底部导航
+ const renderBottomNav = () => {
+ return (
+ <div className="home-bottom-nav">
+ {bottomNavItems.map((item) => {
+ const isActive = item.id === 'message';
+ return (
+ <div
+ key={item.id}
+ className={`home-bottom-nav-item${isActive ? ' home-bottom-nav-item-active' : ''}`}
+ onClick={() => history.push(item.path)}
+ >
+ <div className="home-bottom-nav-item-icon">
+ <img src={isActive && item.activeIcon ? item.activeIcon : item.icon} alt={item.text} />
+ </div>
+ <div className="home-bottom-nav-item-text">{item.text}</div>
+ </div>
+ );
+ })}
+ </div>
+ );
+ };
+
+ return (
+ <NavBarPage title="消息">
+ <div className="home-container">
+ <div className="message-empty-container">
+ <img className="message-empty-img" src={caseQuery_2} alt="暂无消息" />
+ <div className="message-empty-title">暂无消息</div>
+ <div className="message-empty-desc">你暂时还没有收到任何消息</div>
+ </div>
+ {/* 底部导航 */}
+ {/* {renderBottomNav()} */}
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default Message;
diff --git a/src/views/message/index.less b/src/views/message/index.less
new file mode 100644
index 0000000..fbdc09c
--- /dev/null
+++ b/src/views/message/index.less
@@ -0,0 +1,27 @@
+.message-empty-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ min-height: 94vh;
+ background: #fff;
+ }
+
+ .message-empty-img {
+ width: 240px;
+ height: 240px;
+ margin-bottom: 24px;
+ object-fit: contain;
+ }
+
+ .message-empty-title {
+ font-size: 18px;
+ color: #333;
+ font-weight: 500;
+ margin-bottom: 8px;
+ }
+
+ .message-empty-desc {
+ font-size: 14px;
+ color: #999;
+ }
\ No newline at end of file
diff --git a/src/views/personCenter/index.jsx b/src/views/personCenter/index.jsx
new file mode 100644
index 0000000..3ded812
--- /dev/null
+++ b/src/views/personCenter/index.jsx
@@ -0,0 +1,107 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-12 15:30:00
+ * @LastEditTime: 2025-04-25 11:13:34
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 个人中心页面
+ */
+import React from 'react';
+import { useHistory } from 'react-router-dom';
+import { Button } from 'antd';
+import { RightOutlined } from '@ant-design/icons';
+import NavBarPage from '../../components/NavBarPage';
+import * as $$ from '../../utils/utility';
+import userAvatar from '../../assets/img/logAvatar.png';
+import personEdit from '../../assets/img/person_edit.png';
+import loginHistory from '../../assets/img/login_history.png';
+import personFile from '../../assets/img/person_file.png';
+import './index.less';
+
+const PersonCenter = () => {
+ const history = useHistory();
+ const user = $$.getSessionStorage('customerSystemUser') || {};
+
+ // 登出
+ function handleLogOut() {
+ // $$.clearLocal('customerSystemUser');
+ // $$.clearSessionStorage();
+ history.push('/gzdyh/login');
+ }
+
+ // 用户名处理，如王*明
+ function formatName() {
+ let arr = user?.trueName?.split('') || [];
+ return arr[0] + (arr.length > 1 ? '*' : '') + (arr.length > 2 ? arr[arr.length - 1] : '');
+ }
+
+ // 菜单项点击处理
+ const handleMenuClick = (type) => {
+ switch (type) {
+ case 'history':
+ // 登记历史处理
+ history.push('/gzdyh/registerHis');
+ break;
+ case 'manual':
+ // 用户手册处理
+ break;
+ default:
+ break;
+ }
+ };
+
+ return (
+ <div className="person-center">
+ {/* 顶部导航栏 */}
+ <NavBarPage title="个人中心" leftContentVisible={true} className="person-center-navbar">
+ {/* 顶部个人信息区域 */}
+ <div className="person-center-header">
+ <div className="person-center-user">
+ <div className="person-center-avatar">
+ <img src={userAvatar} alt="用户头像" />
+ </div>
+ <div className="person-center-info">
+ <div className="person-center-name-container">
+ <span className="person-center-name">{formatName()}</span>
+ <img src={personEdit} alt="编辑" className="person-center-name-edit" />
+ </div>
+ <div className="person-center-time">最近登录时间：{$$.timeFormat(user?.lastLoginTime)}</div>
+ </div>
+ </div>
+ </div>
+
+ {/* 卡片区域 */}
+ <div className="person-center-card">
+ {/* 菜单区域 */}
+ <div className="person-center-menu">
+ <div className="person-center-menu-item" onClick={() => handleMenuClick('history')}>
+ <div className="person-center-menu-icon">
+ <img src={loginHistory} alt="登记历史" />
+ </div>
+ <div className="person-center-menu-text">登记历史</div>
+ <RightOutlined className="person-center-menu-arrow" />
+ </div>
+
+ <div className="person-center-menu-item" onClick={() => handleMenuClick('manual')}>
+ <div className="person-center-menu-icon">
+ <img src={personFile} alt="用户手册" />
+ </div>
+ <div className="person-center-menu-text">用户手册</div>
+ <RightOutlined className="person-center-menu-arrow" />
+ </div>
+ </div>
+
+ {/* 退出登录按钮 */}
+ <div className="person-center-logout">
+ <Button block onClick={handleLogOut} className="person-center-logout-btn">
+ 退出登录
+ </Button>
+ </div>
+ </div>
+ </NavBarPage>
+ </div>
+ );
+};
+
+export default PersonCenter;
\ No newline at end of file
diff --git a/src/views/personCenter/index.less b/src/views/personCenter/index.less
new file mode 100644
index 0000000..56e8187
--- /dev/null
+++ b/src/views/personCenter/index.less
@@ -0,0 +1,214 @@
+/* 个人中心页面样式 */
+.person-center {
+ min-height: 100vh;
+ background-color: #f5f5f5;
+ position: relative;
+ width: 100%;
+ overflow-x: hidden;
+ display: flex;
+ flex-direction: column;
+
+ &-navbar {
+ background-color: #1a6fb8 !important;
+ display: flex;
+ height: 48px;
+ }
+
+ /* 顶部个人信息区域 */
+ &-header {
+ background: linear-gradient(180deg, #1a6fb8 0%, #3388d9 100%);
+ padding-top: 42px;
+ padding-bottom: 42px;
+ color: #fff;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ }
+
+ &-user {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ }
+
+ &-avatar {
+ width: 119px;
+ height: 119px;
+ border-radius: 50%;
+ border: 2px solid rgba(255, 255, 255, 0.6);
+ margin-bottom: 16px;
+ overflow: hidden;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+ }
+ }
+
+ &-info {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ }
+
+ &-name-container {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 8px;
+ }
+
+ &-name {
+ font-size: 18px;
+ font-weight: 500;
+ margin-right: 8px;
+ display: flex;
+ align-items: center;
+ }
+
+ &-name-edit {
+ width: 15px;
+ height: 15px;
+ display: flex;
+ }
+
+ &-time {
+ font-size: 12px;
+ opacity: 0.8;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ /* 卡片区域 */
+ &-card {
+ width: 100%;
+ flex: 1;
+ background: #f2f2f2;
+ border-radius: 20px 20px 0px 0px;
+ margin-top: -20px;
+ position: relative;
+ display: flex;
+ flex-direction: column;
+ }
+
+ /* 菜单区域 */
+ &-menu {
+ background-color: #fff;
+ border-radius: 8px;
+ margin: 16px;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ &-menu-item {
+ display: flex;
+ align-items: center;
+ padding: 16px;
+ position: relative;
+ border-bottom: 1px solid #f5f5f5;
+
+ &:last-child {
+ border-bottom: none;
+ }
+ }
+
+ &-menu-icon {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-right: 12px;
+
+ img {
+ width: 15px;
+ height: 15px;
+ object-fit: contain;
+ }
+ }
+
+ &-menu-text {
+ flex: 1;
+ font-size: 16px;
+ color: #333;
+ display: flex;
+ align-items: center;
+ }
+
+ &-menu-arrow {
+ color: #ccc;
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ /* 退出登录按钮 */
+ &-logout {
+ width: 100%;
+ padding: 0 16px;
+ box-sizing: border-box;
+ margin-top: auto;
+ margin-bottom: 16px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+
+ &-logout-btn {
+ width: 100%;
+ height: 44px;
+ background: #1a6fb8 !important;
+ border-color: #1a6fb8 !important;
+ font-size: 16px;
+ border-radius: 8px;
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+}
+
+/* 媒体查询适配不同屏幕尺寸 */
+@media screen and (max-width: 375px) {
+ .person-center {
+ &-card {
+ border-radius: 16px 16px 0 0;
+ }
+
+ &-menu {
+ margin: 12px;
+ }
+
+ &-logout {
+ padding: 0 12px;
+ }
+ }
+}
+
+@media screen and (min-width: 414px) {
+ .person-center {
+ &-avatar {
+ width: 90px;
+ height: 90px;
+ }
+
+ &-name {
+ font-size: 20px;
+ }
+
+ &-menu-item {
+ padding: 18px 16px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/registerHis/index.jsx b/src/views/registerHis/index.jsx
new file mode 100644
index 0000000..d6023ba
--- /dev/null
+++ b/src/views/registerHis/index.jsx
@@ -0,0 +1,616 @@
+/*
+ * @Author: 韩天尊大人专属AI
+ * @Date: 2025-05-20
+ * @Version: 1.0.0
+ * @Description: 登记历史页面
+ */
+import React, { useState, useEffect, useRef } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Button, Modal, InputItem, Picker } from 'dingtalk-design-mobile';
+import { Scrollbars } from 'react-custom-scrollbars';
+import NavBarPage from '../../components/NavBarPage';
+import MyList from '../../components/MyList';
+import CalendarRangeTwoDay from '../../components/CalendarRangeTwoDay';
+import * as $$ from '../../utils/utility';
+import caseTypeSelect from '../../utils/caseTypeSelect';
+import selectOption from '../../utils/selectOption';
+import { workStatistics_5 } from '../../assets/img';
+import { SearchOutlined, CloseOutlined } from 'dd-icons';
+import './index.less';
+
+// 登记历史接口
+function registerHistoryApi(data) {
+ return $$.ax.request({
+ url: 'caseRegisterInfo/pageQuery',
+ type: 'get',
+ data,
+ service: 'mediate',
+ });
+}
+
+// 时间类型选项
+const dateTypeOptions = [
+ { value: 'custom', label: '自定义' },
+ { value: 'lastMonth', label: '上月' },
+ { value: 'lastWeek', label: '上周' },
+ { value: 'thisMonth', label: '本月' },
+ { value: 'thisWeek', label: '本周' },
+ { value: 'thisYear', label: '本年度' },
+ { value: 'lastYear', label: '上年度' },
+];
+
+const RegisterHis = () => {
+ const history = useHistory();
+ // 搜索关键词
+ const [keyword, setKeyword] = useState('');
+ // 列表数据和分页状态
+ const [listData, setListData] = useState([]);
+ const [loading, setLoading] = useState(false);
+ const [hasMore, setHasMore] = useState(true);
+ const [page, setPage] = useState(1);
+ const [totalCount, setTotalCount] = useState(0);
+ // 筛选弹窗
+ const [filterVisible, setFilterVisible] = useState(false);
+ // 日期选择弹窗
+ const [datePickerVisible, setDatePickerVisible] = useState(false);
+ const [currentDateType, setCurrentDateType] = useState('');
+ const [dateTypeTarget, setDateTypeTarget] = useState('');
+ const [dateTypeModalVisible, setDateTypeModalVisible] = useState(false);
+ // 查询参数
+ const [queryParams, setQueryParams] = useState({
+ page: 1,
+ size: 10,
+ sortColmn: 1,
+ sortType: 2,
+ keyword: '',
+ createStart: '',
+ createEnd: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ canal: '',
+ status: '',
+ mediResult: '',
+ caseLevel: '',
+ });
+ // 高级筛选参数
+ const [advancedParams, setAdvancedParams] = useState({
+ createStart: '',
+ createEnd: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ canal: '',
+ status: '',
+ mediResult: '',
+ caseLevel: '',
+ });
+ // 是否已搜索
+ const [hasSearched, setHasSearched] = useState(false);
+
+ // 计算时间范围
+ const getDateRangeByType = (type) => {
+ const now = new Date();
+ let start, end;
+ switch (type) {
+ case 'lastMonth': {
+ const year = now.getMonth() === 0 ? now.getFullYear() - 1 : now.getFullYear();
+ const month = now.getMonth() === 0 ? 11 : now.getMonth() - 1;
+ start = new Date(year, month, 1);
+ end = new Date(year, month + 1, 0);
+ break;
+ }
+ case 'thisMonth': {
+ start = new Date(now.getFullYear(), now.getMonth(), 1);
+ end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+ break;
+ }
+ case 'lastWeek': {
+ const day = now.getDay() || 7;
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day);
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day - 6);
+ break;
+ }
+ case 'thisWeek': {
+ const day = now.getDay() || 7;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 7);
+ break;
+ }
+ case 'thisYear': {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = new Date(now.getFullYear(), 11, 31);
+ break;
+ }
+ case 'lastYear': {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ break;
+ }
+ default:
+ start = end = now;
+ }
+ // 日期格式化
+ const format = (date) => `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`;
+ return [format(start), format(end)];
+ };
+
+ // 选择时间类型
+ const handleDateTypeSelect = (type) => {
+ setDateTypeModalVisible(false);
+ if (type === 'custom') {
+ setCurrentDateType(dateTypeTarget);
+ setDatePickerVisible(true);
+ } else {
+ const [start, end] = getDateRangeByType(type);
+ if (dateTypeTarget === 'create') {
+ setAdvancedParams((prev) => ({ ...prev, createStart: start, createEnd: end }));
+ }
+ }
+ };
+
+ // 日历组件操作处理（可选，和综合查询保持一致）
+ const handleCalendarClick = (type, action) => {
+ if (action === 'onClose') {
+ setDatePickerVisible(false);
+ } else if (action === 'submit') {
+ setDatePickerVisible(false);
+ }
+ };
+
+ // 获取列表数据
+ const fetchListData = async (currentPage, params = {}) => {
+ setLoading(true);
+ try {
+ const requestParams = {
+ ...queryParams,
+ ...advancedParams,
+ ...params,
+ page: currentPage,
+ size: 10,
+ sortColmn: 1,
+ sortType: 2,
+ keyword,
+ };
+ // 打印请求参数检查
+ console.log('请求参数:', requestParams);
+ const res = await registerHistoryApi(requestParams);
+ if (res.type) {
+ const { content, totalElements, totalPages, last } = res.data;
+
+ // 确保返回的数据不为空
+ const dataList = content || [];
+
+ if (currentPage === 1) {
+ // 第一页数据，直接设置
+ setListData(dataList);
+ } else {
+ // 加载更多数据
+ setListData((prev) => [...prev, ...dataList]);
+ }
+
+ setTotalCount(totalElements);
+ setHasMore(!last);
+ setPage(currentPage);
+ setQueryParams({ ...requestParams });
+ setHasSearched(true);
+ }
+
+ } catch (error) {
+ $$.infoError('获取数据失败，请稍后重试');
+ setHasSearched(true);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ // 搜索
+ const handleSearch = () => {
+ setPage(1);
+ fetchListData(1);
+ };
+
+ // 加载更多
+ const loadMoreData = () => {
+ if (loading || !hasMore) return;
+ fetchListData(page + 1);
+ };
+
+ // 打开筛选弹窗
+ const handleOpenFilter = () => {
+ setFilterVisible(true);
+ };
+ // 关闭筛选弹窗
+ const handleCloseFilter = () => {
+ setFilterVisible(false);
+ };
+
+ // 打开时间类型弹窗
+ const handleOpenDateTypeModal = (target) => {
+ setDateTypeTarget(target);
+ setDateTypeModalVisible(true);
+ };
+
+ // 重置筛选
+ const handleResetFilter = () => {
+ setAdvancedParams({
+ createStart: '',
+ createEnd: '',
+ caseType: '',
+ plaintiffs: '',
+ defendants: '',
+ canal: '',
+ status: '',
+ mediResult: '',
+ caseLevel: '',
+ });
+ };
+
+
+ // 新增：时间类型选择弹窗渲染
+ const renderDateTypeModal = () => (
+ <Modal
+ visible={dateTypeModalVisible}
+ onClose={() => setDateTypeModalVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择时间类型</div>
+ <span className="modal-close" onClick={() => setDateTypeModalVisible(false)}>
+ ×
+ </span>
+ </div>
+ <div className="date-type-modal-content">
+ {dateTypeOptions.map((opt) => (
+ <div key={opt.value} className="date-type-modal-item" onClick={() => handleDateTypeSelect(opt.value)}>
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+ );
+
+ // 新增：自定义时间选择弹窗渲染
+ const renderDatePickerModal = () => (
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="date-picker-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择日期范围</div>
+ <span className="modal-close" onClick={() => setDatePickerVisible(false)}>
+ ×
+ </span>
+ </div>
+ <CalendarRangeTwoDay CalendaronClick={handleCalendarClick} onClickDate={handleDateChange} />
+ </Modal>
+ );
+
+ // 应用筛选
+ const handleApplyFilter = () => {
+ setPage(1);
+ fetchListData(1);
+ setFilterVisible(false);
+ };
+ // 处理日期选择
+ const handleOpenDatePicker = (type) => {
+ setCurrentDateType(type);
+ setDatePickerVisible(true);
+ };
+ const handleDateChange = (dates) => {
+ if (!dates || dates.length !== 2) return;
+ const formatDate = (date) => (date && date.key ? date.key : '');
+ const formattedStart = formatDate(dates[0]);
+ const formattedEnd = formatDate(dates[1]);
+ setAdvancedParams((prev) => ({
+ ...prev,
+ createStart: currentDateType === 'create' ? formattedStart : prev.createStart,
+ createEnd: currentDateType === 'create' ? formattedEnd : prev.createEnd,
+ }));
+ setDatePickerVisible(false);
+ };
+
+ // 渲染列表项
+ const renderListItem = (item) => {
+ // 格式化时间
+ const formatTime = (time) => {
+ if (!time) return '';
+ const date = new Date(time);
+ const year = date.getFullYear();
+ const month = String(date.getMonth() + 1).padStart(2, '0');
+ const day = String(date.getDate()).padStart(2, '0');
+ const hour = String(date.getHours()).padStart(2, '0');
+ const min = String(date.getMinutes()).padStart(2, '0');
+ return `${year}-${month}-${day} ${hour}:${min}`;
+ };
+ // 化解结果样式
+ const getResultStyle = (result) => {
+ if (result === '化解成功') return 'registerhis-result-success';
+ if (result === '化解不成功') return 'registerhis-result-fail';
+ return '';
+ };
+ return (
+ <div className="registerhis-list-item" onClick={() => history.push(`/gzdyh/flow?caseTaskId=${item.caseTaskId}&caseId=${item.caseId}&editShow=true`)}>
+ <div className="registerhis-list-header">
+ <div className="registerhis-list-title">
+ <span>{item.plaintiffs}</span>
+ {item.defendants && <><span className="registerhis-list-separator">、</span><span>{item.defendants}</span></>}
+ <span className="registerhis-list-arrow">></span>
+ </div>
+ <div className="registerhis-list-status">{item.statusName}</div>
+ </div>
+ <div className="registerhis-list-content">
+ <div className="registerhis-list-row">
+ <div className="registerhis-list-label">登记时间</div>
+ <div className="registerhis-list-value">{formatTime(item.createTime)}</div>
+ </div>
+ <div className="registerhis-list-row">
+ <div className="registerhis-list-label">纠纷类型</div>
+ <div className="registerhis-list-value">{item.caseTypeName}</div>
+ </div>
+ <div className="registerhis-list-row">
+ <div className="registerhis-list-label">承办部门</div>
+ <div className="registerhis-list-value">{item.mediateUnitName}</div>
+ </div>
+ <div className="registerhis-list-row">
+ <div className="registerhis-list-label">事项编号</div>
+ <div className="registerhis-list-value">{item.caseTaskId}</div>
+ </div>
+ <div className="registerhis-list-row">
+ <div className="registerhis-list-label">化解结果</div>
+ <div className={`registerhis-list-value ${getResultStyle(item.mediResultName)}`}>{item.mediResultName}</div>
+ </div>
+ </div>
+ </div>
+ );
+ };
+
+ // 渲染无数据
+ const renderEmptyState = () => (
+ <div className="registerhis-empty-state">
+ <img src={require('../../assets/img/caseQuery_2.png')} alt="暂无数据" className="registerhis-empty-image" />
+ <div className="registerhis-empty-text">暂无数据</div>
+ </div>
+ );
+
+ // 渲染内容
+ const renderContent = () => {
+ if (loading && page === 1) {
+ return <div className="registerhis-loading"><div className="registerhis-loading-text">加载中...</div></div>;
+ }
+ if (hasSearched && listData.length === 0 && !loading) {
+ return renderEmptyState();
+ }
+ return (
+ <Scrollbars style={{ height: 'calc(100vh - 155px)' }}>
+ <MyList
+ data={listData}
+ dataTotal={totalCount}
+ hasMore={hasMore}
+ loadMore={loadMoreData}
+ itemDom={renderListItem}
+ threshold={100}
+ showBottomText={true}
+ />
+ </Scrollbars>
+ );
+ };
+
+ // 筛选弹窗
+ const renderFilterModal = () => (
+ <Modal
+ visible={filterVisible}
+ onClose={handleCloseFilter}
+ className="registerhis-filter-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="registerhis-filter-content">
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">登记时间</div>
+ <div className="registerhis-filter-selector" onClick={() => handleOpenDateTypeModal('create')}>
+ {advancedParams.createStart && advancedParams.createEnd
+ ? <span style={{color: '#171A1D'}}>{`${advancedParams.createStart}-${advancedParams.createEnd}`}</span>
+ : '请选择'}
+ </div>
+
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">纠纷类型</div>
+ <Picker
+ data={caseTypeSelect.caseTypeSelect}
+ cols={2}
+ cascade={true}
+ title="纠纷类型"
+ value={advancedParams.caseType ? [advancedParams.caseType] : []}
+ okText="确定"
+ onOk={valArr => {
+ const value = valArr.filter(Boolean).slice(-1)[0];
+ setAdvancedParams(prev => ({ ...prev, caseType: value }));
+ }}
+ >
+ <div className="registerhis-filter-selector">
+ {(() => {
+ let label = '';
+ caseTypeSelect.caseTypeSelect.forEach((item) => {
+ if (item.value === advancedParams.caseType) {
+ label = item.label;
+ } else if (item.children) {
+ const child = item.children.find((child) => child.value === advancedParams.caseType);
+ if (child) label = child.label;
+ }
+ });
+ return label || '请选择';
+ })()}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+
+ </div>
+
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">申请方</div>
+ <div className="registerhis-filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.plaintiffs}
+ onChange={val => setAdvancedParams(prev => ({ ...prev, plaintiffs: val }))}
+ clear
+ />
+ </div>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">被申请方</div>
+ <div className="registerhis-filter-input">
+ <InputItem
+ placeholder="请填写"
+ value={advancedParams.defendants}
+ onChange={val => setAdvancedParams(prev => ({ ...prev, defendants: val }))}
+ clear
+ />
+ </div>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项来源</div>
+ <Picker
+ data={selectOption.caseCanal}
+ cols={1}
+ title="事项来源"
+ value={advancedParams.canal ? [advancedParams.canal] : []}
+ okText="确定"
+ onOk={valArr => setAdvancedParams(prev => ({ ...prev, canal: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseCanal.find(i => i.value === advancedParams.canal)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项状态</div>
+ <Picker
+ data={selectOption.caseStatus}
+ cols={1}
+ title="事项状态"
+ value={advancedParams.status ? [advancedParams.status] : []}
+ okText="确定"
+ onOk={valArr => setAdvancedParams(prev => ({ ...prev, status: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseStatus.find(i => i.value === advancedParams.status)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">事项等级</div>
+ <Picker
+ data={selectOption.caseLevelList}
+ cols={1}
+ title="事项等级"
+ value={advancedParams.caseLevel ? [advancedParams.caseLevel] : []}
+ okText="确定"
+ onOk={valArr => setAdvancedParams(prev => ({ ...prev, caseLevel: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.caseLevelList.find(i => i.value === advancedParams.caseLevel)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ <div className="registerhis-filter-item">
+ <div className="registerhis-filter-label">化解结果</div>
+ <Picker
+ data={selectOption.mediResult}
+ cols={1}
+ title="化解结果"
+ value={advancedParams.mediResult ? [advancedParams.mediResult] : []}
+ okText="确定"
+ onOk={valArr => setAdvancedParams(prev => ({ ...prev, mediResult: valArr[0] }))}
+ >
+ <div className="registerhis-filter-selector">
+ {selectOption.mediResult.find(i => i.value === advancedParams.mediResult)?.label || '请选择'}
+ <div className="filter-arrow"></div>
+ </div>
+ </Picker>
+ </div>
+ </div>
+ <div className="registerhis-filter-buttons">
+ <Button className="registerhis-filter-reset" onClick={handleResetFilter}>重置</Button>
+ <Button className="registerhis-filter-apply" type="primary" onClick={handleApplyFilter}>查询</Button>
+ </div>
+ {/* 日期选择弹窗 */}
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="registerhis-date-picker-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="registerhis-modal-header">
+ <div className="registerhis-modal-title">选择日期范围</div>
+ <CloseOutlined className="registerhis-modal-close" onClick={() => setDatePickerVisible(false)} />
+ </div>
+ <CalendarRangeTwoDay CalendaronClick={() => setDatePickerVisible(false)} onClickDate={handleDateChange} />
+ </Modal>
+ </Modal>
+ );
+
+ // 页面加载自动请求一次
+ useEffect(() => {
+ fetchListData(1);
+ // eslint-disable-next-line
+ }, []);
+
+ return (
+ <NavBarPage title="登记历史" showBackArrow={true}>
+ <div className="registerhis-container">
+ <div className="registerhis-header">
+ <div className="registerhis-search">
+ <SearchOutlined style={{ color: '#bfc2cc', marginRight: 6, fontSize: 18 }} />
+ <InputItem
+ placeholder="申请方/被申请方/事项编号"
+ clear
+ maxLength={50}
+ value={keyword}
+ onChange={val => setKeyword(val)}
+ className="registerhis-search-input"
+ style={{ flex: 1, background: 'transparent', border: 'none', fontSize: 15 }}
+ />
+ <button className="registerhis-action-btn" onClick={handleSearch}>查询</button>
+ </div>
+ <div className="registerhis-actions">
+ <button className="registerhis-action-btn" onClick={handleOpenFilter}>
+ <img src={workStatistics_5} alt="" className="registerhis-settings-icon" />
+ <span>更多</span>
+ </button>
+ </div>
+ </div>
+ {hasSearched && listData.length > 0 && (
+ <div className="registerhis-total-count">
+ 共<span className="registerhis-total-count-number">{totalCount}</span>条记录
+ </div>
+ )}
+ <div className="registerhis-content">{renderContent()}</div>
+ {renderFilterModal()}
+ {renderDateTypeModal()}
+ {renderDatePickerModal()}
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default RegisterHis;
diff --git a/src/views/registerHis/index.less b/src/views/registerHis/index.less
new file mode 100644
index 0000000..b99238a
--- /dev/null
+++ b/src/views/registerHis/index.less
@@ -0,0 +1,378 @@
+// 登记历史页面样式
+.registerhis-container {
+ width: 100%;
+ background-color: #f5f5f5;
+ display: flex;
+ flex-direction: column;
+ position: relative;
+ overflow: hidden;
+}
+
+.registerhis-search-input {
+ & .dtm-input-item-input {
+ background: #F2F3F5 !important;
+ }
+}
+
+.registerhis-header {
+ display: flex;
+ background-color: #fff;
+ align-items: center;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+ width: 100%;
+ box-sizing: border-box;
+ .registerhis-search {
+ flex: 1;
+ min-width: 0;
+ display: flex;
+ align-items: center;
+ background: #F2F3F5;
+ border-radius: 8px;
+ padding: 2px 10px;
+ height: 32px;
+ margin: 8px 12px;
+ }
+ .registerhis-actions {
+ display: flex;
+ align-items: center;
+ white-space: nowrap;
+ flex-shrink: 0;
+ }
+}
+
+.registerhis-action-btn {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ height: 36px;
+ padding: 0 4px;
+ border: none;
+ background: transparent;
+ color: #1A6FB8;
+ font-size: 16px;
+ font-weight: 400;
+ white-space: nowrap;
+ cursor: pointer;
+ &:active {
+ opacity: 0.7;
+ }
+ .registerhis-settings-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 4px;
+ }
+}
+
+.registerhis-content {
+ flex: 1;
+ overflow: hidden;
+ position: relative;
+}
+
+.registerhis-empty-state {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ min-height: 87vh;
+ .registerhis-empty-image {
+ width: 260px;
+ height: 260px;
+ margin-bottom: 16px;
+ }
+ .registerhis-empty-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+}
+
+.registerhis-loading {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+ .registerhis-loading-text {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ }
+}
+
+.registerhis-list-item {
+ background-color: #fff;
+ border-radius: 8px;
+ margin: 0px 12px 8px 12px;
+ padding: 16px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+ .registerhis-list-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 12px;
+ .registerhis-list-title {
+ font-size: 16px;
+ font-weight: bold;
+ color: #171A1D;
+ max-width: 260px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ .registerhis-list-separator {
+ margin: 0 2px;
+ }
+ .registerhis-list-arrow {
+ margin-left: 4px;
+ color: #999;
+ }
+ }
+ .registerhis-list-status {
+ font-size: 14px;
+ color: #1A6FB8;
+ }
+ }
+ .registerhis-list-content {
+ .registerhis-list-row {
+ display: flex;
+ margin-bottom: 8px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .registerhis-list-label {
+ width: 70px;
+ color: rgba(23, 26, 29, 0.6);
+ font-size: 14px;
+ }
+ .registerhis-list-value {
+ flex: 1;
+ color: #171A1D;
+ font-size: 14px;
+ &.registerhis-result-success {
+ color: #52C41A;
+ }
+ &.registerhis-result-fail {
+ color: #F5222D;
+ }
+ }
+ }
+ }
+}
+
+.registerhis-filter-modal .dtm-modal-body {
+ padding: 0 15px 15px !important;
+}
+
+.registerhis-filter-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ right: 0;
+ bottom: 368px;
+ z-index: 999;
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: unset;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ }
+}
+
+.registerhis-filter-content {
+ background: #fff;
+ display: flex;
+ flex-wrap: wrap;
+ .registerhis-filter-item {
+ width: 50%;
+ box-sizing: border-box;
+ padding-right: 8px;
+ margin-bottom: 16px;
+ justify-content: flex-start;
+ &:nth-child(2n) {
+ padding-right: 0;
+ padding-left: 8px;
+ }
+ .registerhis-filter-label {
+ font-size: 14px;
+ color: #171A1D;
+ margin-bottom: 8px;
+ text-align: left;
+ }
+
+ .registerhis-filter-input {
+ position: relative;
+ height: 40px;
+ display: flex;
+ align-items: center;
+ padding: 0 6px;
+ background: #F2F3F5;
+ border-radius: 4px;
+ color: #171A1D;
+ font-size: 14px;
+ & .dtm-input-item-input{
+ background: #F2F3F5;
+ color: #171A1D !important;
+ font-size: 14px;
+ }
+ }
+
+ .registerhis-filter-selector {
+ height: 40px;
+ line-height: 40px;
+ background: #F2F3F5;
+ border-radius: 4px;
+ padding: 0 6px;
+ color: #999;
+ font-size: 14px;
+ cursor: pointer;
+ text-align: left;
+ position: relative;
+
+ .filter-arrow {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: translateY(-50%) rotate(45deg);
+ }
+ }
+ .dtm-input-item {
+ width: 100%;
+ .dtm-input-item-input {
+ text-align: left;
+ border-radius: 4px;
+ background-color:#F2F3F5;
+ color: #999;
+ font-size: 14px;
+ }
+ }
+ }
+ // 最后一行如果只有一个筛选项，宽度100%
+ .registerhis-filter-item:last-child:nth-child(odd) {
+ width: 100%;
+ padding-right: 0;
+ padding-left: 0;
+ }
+}
+
+.registerhis-filter-buttons {
+ display: flex;
+ padding: 16px 0;
+ border-top: 1px solid #eee;
+ background: #FFFFFF;
+ position: sticky;
+ bottom: 0;
+ .registerhis-filter-reset {
+ width: 120px;
+ height: 44px;
+ margin-right: 12px;
+ border: 1px solid #1A6FB8;
+ color: #1A6FB8;
+ background-color: #FFFFFF;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+ .registerhis-filter-apply {
+ flex: 1;
+ height: 44px;
+ background-color: #1A6FB8;
+ color: #FFFFFF;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+}
+
+.registerhis-date-picker-modal {
+ width: 100vw;
+ min-width: 100vw;
+ max-width: 100vw;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ height: auto;
+ max-height: 80vh;
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: auto;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .registerhis-modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .registerhis-modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .registerhis-modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+}
+
+.registerhis-total-count {
+ font-size: 14px;
+ color: #666;
+ padding: 8px 16px;
+ .registerhis-total-count-number {
+ color: #1A6FB8;
+ font-weight: bold;
+ margin: 0 2px;
+ }
+}
diff --git a/src/views/repeat/index.jsx b/src/views/repeat/index.jsx
new file mode 100644
index 0000000..047735f
--- /dev/null
+++ b/src/views/repeat/index.jsx
@@ -0,0 +1,287 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-24 11:06:12
+ * @LastEditTime: 2025-04-24 16:21:41
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 重复事项合并
+ */
+import React, { useState, useEffect } from 'react';
+
+import { Scrollbars } from 'react-custom-scrollbars';
+
+import NavBarPage from '../../components/NavBarPage';
+import * as $$ from '../../utils/utility';
+
+import { repeat_1 } from '../../assets/img';
+import './index.less';
+
+// 获取重复事项信息
+function getRepeatCaseInfoApi(data) {
+ return $$.ax.request({ url: `caseRepeatInfo/getRepeatCaseInfo`, type: 'get', service: 'mediate', data });
+}
+
+// 保存重复事项
+function saveRepeatCaseApi(data) {
+ return $$.ax.request({ url: `caseRepeatInfo/svaeRepeatCase`, type: 'post', service: 'mediate', data });
+}
+
+// 添加重复事项列表
+function getRepeatCaseListApi(data) {
+ return $$.ax.request({ url: `caseRepeatInfo/pageCaseInfoDhb`, type: 'get', service: 'mediate', data });
+}
+
+// 获取重复事项信息
+function listRepeatCaseApi(data) {
+ return $$.ax.request({ url: `caseRepeatInfo/listRepeatCase`, type: 'get', service: 'mediate', data });
+}
+
+// 取消重复事项
+function cancelRepeatCaseApi(data) {
+ return $$.ax.request({ url: `caseRepeatInfo/cancelRepeatCase`, type: 'post', service: 'mediate', data });
+}
+
+const Repeat = () => {
+ const caseId = $$.getQueryString('caseId');
+ const repeatId = $$.getQueryString('repeatId');
+ const caseTaskId = $$.getQueryString('caseTaskId');
+
+ const [caseData, setCaseData] = useState({});
+ const [hisData, setHisData] = useState([]);
+
+ // 获取重复事项信息
+ async function getRepeatCaseInfo() {
+ global.setSpinning(true);
+ const res = await getRepeatCaseInfoApi({ caseId, repeatId });
+ global.setSpinning(false);
+ if (res.type) {
+ setCaseData(res.data.mainCaseInfo);
+ setHisData(res.data.repeatCaseInfoList || []);
+ }
+ }
+
+ // 删除重复事项
+ async function handleDelete(item) {
+ try {
+ global.setSpinning(true);
+ const res = await cancelRepeatCaseApi({
+ caseId: item.caseId,
+ repeatId,
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.showToast({ content: '删除成功' });
+ getRepeatCaseInfo();
+ }
+ } catch (error) {
+ global.setSpinning(false);
+ }
+ }
+
+ // 设为主体
+ async function handleSetMain(item) {
+ try {
+ global.setSpinning(true);
+ const res = await saveRepeatCaseApi({
+ caseId: item.caseId,
+ repeatId,
+ isMain: 1,
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.showToast({ content: '设置成功' });
+ getRepeatCaseInfo();
+ }
+ } catch (error) {
+ global.setSpinning(false);
+ }
+ }
+
+ useEffect(() => {
+ getRepeatCaseInfo();
+ }, []);
+
+ return (
+ <NavBarPage title="重复事项合并">
+ <Scrollbars style={{ height: 'calc(100vh - 104px)' }}>
+ <div className="repeat">
+ <div className="repeat-title">主体事项</div>
+ <div className="repeat-content">
+ <div className="repeat-item-header">
+ <div>
+ <div className="repeat-item-title2">
+ 登记时间：<span className="repeat-item-value">{caseData.createTime}</span>
+ </div>
+ <div className="repeat-item-subtitle">事项编号：{caseData.caseRef}</div>
+ </div>
+ <div className="repeat-item-status">
+ <span className="public-color">{caseData.statusName}</span>
+ </div>
+ </div>
+ <div className="repeat-item-divider"></div>
+
+ <div className="repeat-item">
+ <div className="repeat-item-title">事项来源</div>
+ <div className="repeat-item-value">{caseData.caseSource || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">数据来源</div>
+ <div className="repeat-item-value">{caseData.dataSource || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">申请方</div>
+ <div className="repeat-item-value">
+ {caseData?.plaintiffList?.map((i) => (
+ <span key={i.id}>
+ {i.trueName || '-'}
+ {i.certiNo ? `（${i.certiNo}）` : ''}
+ </span>
+ ))}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">被申请方</div>
+ <div className="repeat-item-value">
+ {caseData?.defendantList?.map((i) => (
+ <span key={i.id}>
+ {i.trueName || '-'}
+ {i.certiNo ? `（${i.certiNo}）` : ''}
+ </span>
+ ))}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">问题属地</div>
+ <div className="repeat-item-value">
+ {caseData?.queAreaName || '-'}
+ {caseData?.queRoadName ? `/${caseData?.queRoadName}` : ''}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">纠纷发生地</div>
+ <div className="repeat-item-value">{caseData.addr || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">登记机构</div>
+ <div className="repeat-item-value">{caseData.inputUnitName || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">承办部门</div>
+ <div className="repeat-item-value">{caseData.mediateUnitName || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">经办人</div>
+ <div className="repeat-item-value">{caseData.mediator || '-'}</div>
+ </div>
+ </div>
+
+ <div style={{ marginTop: '12px' }} className="repeat-title">
+ 重复列表（{hisData.length}）
+ </div>
+ {/* 重复列表 */}
+ <div className="repeat-list">
+ {hisData.map((item) => (
+ <div key={item.caseId} className="repeat-list-item">
+ <div className="repeat-list-item-header">
+ <div className="repeat-list-item-header-left">
+ <div className="repeat-item-title2">
+ 登记时间：<span className="repeat-item-value">{item.inputTime}</span>
+ </div>
+ <div className="repeat-item-subtitle">事项编号：{item.caseRef}</div>
+ </div>
+ <div className="repeat-list-item-header-right">相似度{item.similarity}%</div>
+ </div>
+ <div className="repeat-item-divider"></div>
+
+ <div className="repeat-item">
+ <div className="repeat-item-title">事项来源</div>
+ <div className="repeat-item-value">{item.caseSource || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">数据来源</div>
+ <div className="repeat-item-value">{item.dataSource || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">申请方</div>
+ <div className="repeat-item-value">
+ {item?.plaintiffList?.map((i) => (
+ <span key={i.id}>
+ {i.trueName || '-'}
+ {i.certiNo ? `（${i.certiNo}）` : ''}
+ </span>
+ ))}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">被申请方</div>
+ <div className="repeat-item-value">
+ {item?.defendantList?.map((i) => (
+ <span key={i.id}>
+ {i.trueName || '-'}
+ {i.certiNo ? `（${i.certiNo}）` : ''}
+ </span>
+ ))}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">问题属地</div>
+ <div className="repeat-item-value">
+ {item?.queAreaName || '-'}
+ {item?.queRoadName ? `/${item?.queRoadName}` : ''}
+ </div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">纠纷发生地</div>
+ <div className="repeat-item-value">{item.addr || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">登记机构</div>
+ <div className="repeat-item-value">{item.inputUnitName || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">承办部门</div>
+ <div className="repeat-item-value">{item.mediateUnitName || '-'}</div>
+ </div>
+ <div className="repeat-item">
+ <div className="repeat-item-title">经办人</div>
+ <div className="repeat-item-value">{item.mediator || '-'}</div>
+ </div>
+
+ <div className="repeat-item-divider"></div>
+
+ <div className="repeat-list-item-footer">
+ <div className="btn btn-delete" onClick={() => handleDelete(item)}>
+ 删除
+ </div>
+ <div className="btn btn-primary" onClick={() => handleSetMain(item)}>
+ 设为主体
+ </div>
+ <div className="btn btn-view" onClick={() => {}}>
+ 查看
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ </Scrollbars>
+ <div className="repeat-bottom-button">
+ <div className="repeat-bottom-button-left">
+ <div className="repeat-bottom-button-add">
+ <img src={repeat_1} alt="添加" />
+ 添加
+ </div>
+ <div className="repeat-bottom-button-cancel">
+ 取消合并
+ </div>
+ </div>
+ <div className="repeat-bottom-button-submit">
+ 提交
+ </div>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default Repeat;
diff --git a/src/views/repeat/index.less b/src/views/repeat/index.less
new file mode 100644
index 0000000..e503385
--- /dev/null
+++ b/src/views/repeat/index.less
@@ -0,0 +1,213 @@
+@import (reference) 'dingtalk-theme/dingtalk-x/mob.less';
+
+.repeat {
+ display: flex;
+ flex-direction: column;
+ padding: 12px 16px;
+
+ &-title {
+ font-size: 16px;
+ color: #000000;
+ margin-bottom: 10px;
+ }
+
+ &-header {
+ background-color: #fff;
+ padding: 16px;
+ margin-bottom: 8px;
+
+ &-title {
+ font-size: 18px;
+ font-weight: 600;
+ color: #171a1d;
+ line-height: 26px;
+ }
+ }
+
+ &-content {
+ background: #eff8ff;
+ border: 1px solid #1a6fb8;
+ border-radius: 8px;
+ padding: 8px 12px;
+ }
+
+ &-list {
+ &-item {
+ background: #fff;
+ border-radius: 8px;
+ padding: 12px;
+ margin-bottom: 8px;
+
+ &-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 8px;
+
+ &-left {
+ flex: 1;
+ }
+
+ &-right {
+ color: #1a6fb8;
+ font-size: 14px;
+ }
+ }
+
+ &-footer {
+ display: flex;
+ justify-content: flex-end;
+ margin-top: 12px;
+ gap: 8px;
+
+ .btn {
+ width: 80px;
+ height: 32px;
+ border-radius: 16px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+
+ &-delete {
+ border: 1px solid #ff4d4f;
+ color: #ff4d4f;
+ }
+
+ &-primary {
+ border: 1px solid #1a6fb8;
+ color: #1a6fb8;
+ }
+
+ &-view {
+ background: #1a6fb8;
+ color: #fff;
+ }
+ }
+ }
+ }
+ }
+
+ &-item {
+ display: flex;
+ align-items: flex-start;
+ font-size: 14px;
+ margin-bottom: 4px;
+ line-height: 22px;
+
+ &-header {
+ margin-bottom: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+
+ &-title {
+ color: rgba(23, 26, 29, 0.6);
+ width: 84px;
+ flex-shrink: 0;
+ }
+
+ &-title2 {
+ color: rgba(23, 26, 29, 0.6);
+ flex-shrink: 0;
+ }
+
+ &-value {
+ color: #171a1d;
+ }
+
+ &-subtitle {
+ font-size: 12px;
+ color: rgba(23, 26, 29, 0.6);
+ margin-top: 2px;
+ }
+
+ &-status {
+ font-size: 14px;
+ }
+
+ &-divider {
+ height: 1px;
+ background-color: #e0e0e0;
+ margin: 8px 0;
+ }
+
+ &-footer {
+ display: flex;
+ justify-content: flex-end;
+ }
+
+ &-button {
+ width: 60px;
+ height: 30px;
+ border-radius: 100px;
+ background-color: #1a6fb8;
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+ }
+ }
+}
+
+.repeat-bottom-button {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 68px;
+ background: #fff;
+ display: flex;
+ align-items: center;
+ padding: 0 12px;
+ box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1);
+
+ &-left {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ flex: 1;
+ }
+
+ &-add {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ color: #666;
+ font-size: 14px;
+ width: 28px;
+
+ img {
+ width: 20px;
+ height: 20px;
+ }
+ }
+
+ &-cancel {
+ height: 42px;
+ flex: 1;
+ border: 1px solid #ff4d4f;
+ border-radius: 8px;
+ color: #ff4d4f;
+ font-size: 17px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ &-submit {
+ height: 44px;
+ flex: 1;
+ background: #2b6de5;
+ border-radius: 8px;
+ color: #fff;
+ font-size: 17px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 12px;
+ }
+}
diff --git a/src/views/selectPerson/index.jsx b/src/views/selectPerson/index.jsx
new file mode 100644
index 0000000..681d057
--- /dev/null
+++ b/src/views/selectPerson/index.jsx
@@ -0,0 +1,387 @@
+/*
+ * @Company: hugeInfo
+ * @Author: claude
+ * @Date: 2025-04-09 14:32:15
+ * @LastEditTime: 2025-05-19 16:29:32
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 选择人员页面
+ */
+import React, { useState, useEffect } from 'react';
+import { NavBar, SearchBar, List, Checkbox, Toast } from 'dingtalk-design-mobile';
+import { SearchOutlined, RightArrow2Outlined } from 'dd-icons';
+
+import { useHistory, useLocation } from 'react-router-dom';
+import { Scrollbars } from 'react-custom-scrollbars';
+
+import NavBarPage from '../../components/NavBarPage';
+import * as $$ from '../../utils/utility';
+
+import './index.less';
+
+// 选择指派人员
+function userChooseApi(searchData) {
+ return $$.ax.request({ url: 'ctUser/userChoose', data: searchData, type: 'get', service: 'cust' });
+}
+
+function choosePrincipalApi(submitData) {
+ return $$.ax.request({ url: `caseInfoUnfold/choosePrincipal`, data: submitData, type: 'get', service: 'mediate' });
+}
+
+//删除经办人
+function deletePrincipalApi(caseId, caseTaskId) {
+ return $$.ax.request({ url: `caseInfoUnfold/deletePrincipal?caseId=${caseId}&caseTaskId=${caseTaskId}`, type: 'get', service: 'mediate' });
+}
+
+// 联合处置选择部门
+function unitChooseApi(searchData) {
+ return $$.ax.request({ url: 'ctUnit/unitChoose', data: searchData, type: 'get', service: 'cust' });
+}
+
+const SelectPerson = () => {
+ // 1:指派经办人 2:联合处置选择部门 3.选择承办部门 4.选择配合部门
+ const type = $$.getQueryString('type');
+ // 是否可以多选
+ const isMultiple = $$.getQueryString('isMultiple') || false;
+ const caseId = $$.getQueryString('caseId');
+ const caseTaskId = $$.getQueryString('caseTaskId');
+
+ const history = useHistory();
+ const location = useLocation();
+
+ // 状态定义
+ const [keyword, setKeyword] = useState(''); // 搜索关键词
+ const [loading, setLoading] = useState(false); // 加载状态
+ const [selectedPersons, setSelectedPersons] = useState([]); // 已选人员
+
+ const [title, setTitle] = useState(''); // 标题
+
+ const [subTitle, setSubTitle] = useState(''); // 副标题
+ // 数据定义
+ const [data, setData] = useState([]); // 数据
+ // 市一级
+ const [cityList, setCityList] = useState([]);
+ // 区一级
+ const [areaList, setAreaList] = useState([]);
+ // 街道一级
+ const [streetList, setStreetList] = useState([]);
+ const [personList, setPersonList] = useState([]); // 人员列表
+ // 部门一级
+ const [departments, setDepartments] = useState([]); // 部门列表
+ const [currentDeptId, setCurrentDeptId] = useState(''); // 当前选中部门ID
+
+ // 获取部门列表
+ async function userChoose() {
+ global.setSpinning(true);
+ const res = type === '1' ? await userChooseApi({ roleCode: '22_00024-4' }) : await unitChooseApi();
+ global.setSpinning(false);
+ console.log(res, 'res');
+ if (res.type) {
+ setData(res.data || []);
+ // 设置市级数据
+ setCityList(res.data || []);
+ }
+ }
+
+ // 判断是否选中（考虑chainList）
+ const isSelected = (item) => {
+ if (!item.chainList) {
+ return selectedPersons.some((p) => p.value === item.value);
+ }
+ return selectedPersons.some((p) => p.chainList && p.chainList.includes(item.value));
+ };
+
+ // 处理市级数据选择
+ const handleCitySelect = (item) => {
+ if (!item.checkable) {
+ setAreaList(item.children || []);
+ setStreetList([]);
+ setPersonList([]);
+ } else {
+ handleSelectPerson(item);
+ }
+ };
+
+ // 处理区级数据选择
+ const handleAreaSelect = (item) => {
+ if (!item.checkable) {
+ setStreetList(item.children || []);
+ setPersonList([]);
+ } else {
+ handleSelectPerson(item);
+ }
+ };
+
+ // 处理街道级数据选择
+ const handleStreetSelect = (item) => {
+ if (!item.checkable) {
+ setPersonList(item.children || []);
+ } else {
+ handleSelectPerson(item);
+ }
+ };
+
+ // 处理人员选择
+ const handlePersonSelect = (item) => {
+ if (item.checkable) {
+ handleSelectPerson(item);
+ }
+ };
+
+ // 选择/取消选择人员（优化版）
+ const handleSelectPerson = (person) => {
+ // 承办部门单选
+ if (type === '3') {
+ setSelectedPersons([
+ {
+ ...person,
+ chainList: person.chainList || [person.value],
+ },
+ ]);
+ return;
+ }
+
+ // 配合部门多选
+ if (type === '4') {
+ const index = selectedPersons.findIndex((item) => {
+ if (item.chainList && person.chainList) {
+ return item.chainList.join(',') === person.chainList.join(',');
+ }
+ return item.value === person.value;
+ });
+
+ let newSelected = [...selectedPersons];
+
+ if (index > -1) {
+ newSelected.splice(index, 1);
+ } else {
+ newSelected.push({
+ ...person,
+ chainList: person.chainList || [person.value],
+ });
+ }
+
+ setSelectedPersons(newSelected);
+ return;
+ }
+
+ // 原有的选择逻辑
+ if (!isMultiple && selectedPersons.length > 0 && !selectedPersons.some((p) => p.value === person.value)) {
+ $$.showToast({ type: 'fail', content: '当前为单选模式，请先取消已选人员' });
+ return;
+ }
+
+ const index = selectedPersons.findIndex((item) => {
+ if (item.chainList && person.chainList) {
+ return item.chainList.join(',') === person.chainList.join(',');
+ }
+ return item.value === person.value;
+ });
+
+ let newSelected = [...selectedPersons];
+
+ if (index > -1) {
+ newSelected.splice(index, 1);
+ } else {
+ if (!isMultiple) {
+ newSelected = [
+ {
+ ...person,
+ chainList: person.chainList || [person.value],
+ },
+ ];
+ } else {
+ newSelected.push({
+ ...person,
+ chainList: person.chainList || [person.value],
+ });
+ }
+ }
+
+ setSelectedPersons(newSelected);
+ };
+
+ // 渲染级联项
+ const renderCascadeItem = (item, level) => {
+ const isItemSelected = isSelected(item);
+ const hasChildren = item.children && item.children.length > 0;
+
+ return (
+ <div
+ key={item.value}
+ className={`cascade-item ${item.checkable ? 'checkable' : ''} ${isItemSelected ? 'selected' : ''}`}
+ onClick={() => {
+ switch (level) {
+ case 'city':
+ handleCitySelect(item);
+ break;
+ case 'area':
+ handleAreaSelect(item);
+ break;
+ case 'street':
+ handleStreetSelect(item);
+ break;
+ case 'person':
+ handlePersonSelect(item);
+ break;
+ default:
+ break;
+ }
+ }}
+ >
+ <span className="item-name">{item.label}</span>
+ {!item.checkable && hasChildren && (
+ <span className="arrow-right">
+ <RightArrow2Outlined />
+ </span>
+ )}
+ {item.checkable && isItemSelected && <span className="check-icon">✓</span>}
+ </div>
+ );
+ };
+
+ // 获取人员列表
+ function getPersonList() {}
+ // 选择部门
+ const handleSelectDept = (deptId) => {
+ setCurrentDeptId(deptId);
+ getPersonList(deptId);
+ };
+
+ // 搜索
+ const handleSearch = (value) => {
+ setKeyword(value);
+ getPersonList(currentDeptId, value);
+ };
+
+ // 确认选择
+ const handleConfirm = () => {
+ if (selectedPersons.length === 0) {
+ $$.showToast({ type: 'fail', content: `请至少选择一个${type === '1' ? '人员' : '部门'}` });
+ return;
+ }
+
+ switch (type) {
+ case '1':
+ if (!isMultiple && selectedPersons.length > 1) {
+ $$.showToast({ type: 'info', content: '当前为单选模式，请只选择一名人员' });
+ return;
+ }
+ if (caseId) {
+ choosePrincipal(selectedPersons);
+ } else {
+ $$.setLocal('selectPerson', selectedPersons);
+ history.goBack();
+ }
+ break;
+ case '2':
+ $$.setLocal('selectDept', selectedPersons);
+ history.goBack();
+ break;
+ case '3':
+ if (selectedPersons.length > 1) {
+ $$.showToast({ type: 'info', content: '承办部门只能选择一个' });
+ return;
+ }
+ $$.setLocal('mainDept', selectedPersons);
+ history.goBack();
+ break;
+ case '4':
+ $$.setLocal('cooperateDepts', selectedPersons);
+ history.goBack();
+ break;
+ default:
+ break;
+ }
+ };
+
+ async function choosePrincipal(selectedPersons) {
+ let nowData = selectedPersons[0];
+ global.setSpinning(true);
+ const res = await choosePrincipalApi({ userId: nowData.value, caseId, caseTaskId });
+ global.setSpinning(false);
+ if (res.type) {
+ $$.setLocal('selectPerson', true);
+ history.goBack();
+ }
+ }
+
+ // 返回上一页
+ const handleBack = () => {
+ history.goBack();
+ };
+
+ // 初始化
+ useEffect(() => {
+ let text = '';
+ let subText = '';
+ switch (type) {
+ case '1':
+ text = '指派经办人';
+ subText = '经办人姓名';
+ break;
+ case '2':
+ text = '选择配合部门';
+ subText = '配合部门';
+ break;
+ case '3':
+ text = '选择承办部门';
+ subText = '承办部门';
+ break;
+ case '4':
+ text = '选择配合部门';
+ subText = '配合部门（可多选）';
+ break;
+ default:
+ break;
+ }
+ setTitle(text);
+ setSubTitle(subText);
+ userChoose();
+ // 如果有预选人员，设置已选状态
+ if (location.state?.preSelectedPersons) {
+ setSelectedPersons(location.state.preSelectedPersons);
+ }
+ }, []);
+
+ return (
+ <NavBarPage title={title}>
+ <div className="select-person">
+ <div className="select-person-search">
+ <SearchBar placeholder={`请输入${subTitle}`} value={keyword} onChange={handleSearch} cancelText="查询" />
+ </div>
+ <Scrollbars style={{ height: 'calc(100vh - 160px)', backgroundColor: '#F2F2F2' }}>
+ <div className="select-person-cascade">
+ {/* 市级数据 */}
+ <div className="cascade-level">{cityList.map((item) => renderCascadeItem(item, 'city'))}</div>
+
+ {/* 区级数据 */}
+ {areaList.length > 0 && <div className="cascade-level">{areaList.map((item) => renderCascadeItem(item, 'area'))}</div>}
+
+ {/* 街道级数据 */}
+ {streetList.length > 0 && <div className="cascade-level">{streetList.map((item) => renderCascadeItem(item, 'street'))}</div>}
+
+ {/* 人员列表 */}
+ {personList.length > 0 && <div className="cascade-level">{personList.map((item) => renderCascadeItem(item, 'person'))}</div>}
+ </div>
+ </Scrollbars>
+ <div className="select-person-footer">
+ <div className="selected-info">
+ 已选：<span className="selected-count">{selectedPersons.length}</span>
+ {type === '1' ? '人' : '个部门'}
+ </div>
+ <div className="selectPerson-buttons">
+ <button className="cancel-btn" onClick={handleBack}>
+ 取消
+ </button>
+ <button className="confirm-btn" onClick={handleConfirm}>
+ 确定
+ </button>
+ </div>
+ </div>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default SelectPerson;
diff --git a/src/views/selectPerson/index.less b/src/views/selectPerson/index.less
new file mode 100644
index 0000000..b4fe611
--- /dev/null
+++ b/src/views/selectPerson/index.less
@@ -0,0 +1,215 @@
+.select-person {
+ display: flex;
+ flex-direction: column;
+ background: #fff;
+
+ :global(.dtm-nav-bar) {
+ background-color: #fff;
+ border-bottom: 1px solid #eee;
+ }
+
+ :global(.dtm-list-item) {
+ padding-left: 12px;
+
+ .dtm-list-line {
+ padding-right: 12px;
+ }
+
+ .dtm-list-thumb {
+ margin-right: 12px;
+ }
+ }
+
+ .select-person-search {
+ background-color: #fff;
+
+ :global(.dtm-search-bar) {
+ height: 36px;
+ border-radius: 18px;
+ background-color: #f5f5f5;
+ }
+
+ :global(.dtm-search-bar-input) {
+ height: 36px;
+
+ .dtm-search-bar-synthetic-ph {
+ height: 36px;
+ line-height: 36px;
+
+ .dtm-search-bar-synthetic-ph-placeholder {
+ color: #999;
+ }
+ }
+ }
+ }
+
+ .select-person-content {
+ flex: 1;
+ display: flex;
+ overflow: hidden;
+
+ .select-person-sidebar {
+ width: 90px;
+ background-color: #f8f8f8;
+ overflow-y: auto;
+ border-right: 1px solid #eee;
+
+ .dept-item {
+ padding: 12px 8px;
+ color: #333;
+ text-align: center;
+ border-bottom: 1px solid #eee;
+
+ &.active {
+ color: #1a6fb8;
+ background-color: #fff;
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 3px;
+ height: 16px;
+ background-color: #1a6fb8;
+ }
+ }
+ }
+ }
+
+ .select-person-list {
+ flex: 1;
+ overflow-y: auto;
+ background-color: #fff;
+
+ .person-info {
+ display: flex;
+ flex-direction: column;
+ }
+
+ .person-name {
+ color: #333;
+ font-weight: 500;
+ }
+
+ .person-dept {
+ font-size: 12px;
+ color: #999;
+ margin-top: 4px;
+ }
+
+ .empty-data {
+ padding: 40px 0;
+ text-align: center;
+ color: #999;
+ }
+ }
+ }
+
+ .select-person-footer {
+ height: 52px;
+ background-color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0 16px;
+ border-top: 1px solid #eee;
+
+ .selected-info {
+ color: #666;
+
+ .selected-count {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+ }
+
+ .selectPerson-buttons {
+ display: flex;
+ gap: 12px;
+ padding: 8px 0px;
+ border-radius: 16px 16px 0 0;
+ position: relative;
+
+ button {
+ height: 36px;
+ border-radius: 18px;
+ padding: 0 16px;
+ border: none;
+ }
+
+ .cancel-btn {
+ background-color: #f5f5f5;
+ color: #666;
+ font-size: 14px;
+ }
+
+ .confirm-btn {
+ background-color: #1a6fb8;
+ color: #fff;
+ }
+ }
+ }
+
+ .select-person-cascade {
+ display: flex;
+ height: 100%;
+ background: #fff;
+
+ .cascade-level {
+ flex: 1;
+ height: 100%;
+ overflow-y: auto;
+ border-right: 1px solid #f0f0f0;
+ background: #fff;
+
+ &:last-child {
+ border-right: none;
+ }
+
+ .cascade-item {
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 12px 16px;
+ color: #333;
+ border-bottom: 1px solid #f0f0f0;
+ cursor: pointer;
+
+ &:active {
+ background-color: #f5f5f5;
+ }
+
+ &.checkable {
+ color: #666;
+ }
+
+ &.selected {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+
+ .item-name {
+ flex: 1;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .arrow-right {
+ margin-left: 8px;
+ color: #999;
+ font-size: 16px;
+ }
+
+ .check-icon {
+ margin-left: 8px;
+ color: #1a6fb8;
+ }
+ }
+ }
+ }
+}
diff --git a/src/views/selfInspection/Agentperson/index.jsx b/src/views/selfInspection/Agentperson/index.jsx
new file mode 100644
index 0000000..e83905c
--- /dev/null
+++ b/src/views/selfInspection/Agentperson/index.jsx
@@ -0,0 +1,712 @@
+import React, { useState, useEffect } from 'react';
+import NavBarPage from '../../../components/NavBarPage';
+
+import { Radio, Message, Tag } from '@arco-design/web-react';
+import { DocsOutlined, SettingOutlined } from 'dd-icons';
+import { ax, setLocal, getLocal, clearLocal } from '../../../utils/utility';
+import { idCardphoto } from '../../../assets/img/idcard.png';
+import './index.less';
+import { Checkbox, Space } from 'dingtalk-design-mobile';
+import { useHistory, useLocation } from 'react-router-dom';
+import fileUploadIcon from '../../../assets/img/file_upload.png';
+import fileDeleteIcon from '../../../assets/img/file_delete.png';
+
+import {
+ List,
+ Form,
+ InputItem,
+ Button,
+ TextareaItem,
+ DatePicker,
+ Rate,
+ Slider,
+ Stepper,
+ Switch,
+ Select,
+ Upload,
+ Toast,
+} from 'dingtalk-design-mobile';
+
+const COLORS = ['red', 'orangered', 'orange', 'gold', 'lime', 'green', 'cyan', 'blue', 'arcoblue', 'purple', 'pinkpurple', 'magenta', 'gray'];
+
+const COLORS_CUSTOM = [
+ '#f53f3f',
+ '#7816ff',
+ '#00b42a',
+ '#165dff',
+ '#ff7d00',
+ '#eb0aa4',
+ '#7bc616',
+ '#86909c',
+ '#b71de8',
+ '#0fc6c2',
+ '#ffb400',
+ '#168cff',
+ '#ff5722',
+];
+
+const Agentperson = () => {
+ const [form] = Form.useForm(); // 使用 Form.useForm 创建表单实例
+ const history = useHistory();
+ const location = useLocation(); // 获取location对象以解析URL参数
+ const [currentRole, setCurrentRole] = useState('applicantAgent'); // 默认为申请方代理人
+ const [isFromCaseDesClick, setIsFromCaseDesClick] = useState(false); // 记录是否从caseDes弹窗点击进入
+ const [agentObjects, setAgentObjects] = useState([]); // 用于存储代理对象列表
+ const [defaultAgentObject, setDefaultAgentObject] = useState(''); // 默认选中的代理对象
+ const [nameValue, setNameValue] = useState(''); // 添加state来跟踪姓名字段
+ const [idCardFiles, setIdCardFiles] = useState([]); // 存储身份证明材料文件
+ const [authorizationFiles, setAuthorizationFiles] = useState([]); // 存储授权委托书文件
+
+ // 在组件加载时从URL参数获取当前角色和代理对象数据
+ useEffect(() => {
+ try {
+ // 解析URL参数
+ const queryParams = new URLSearchParams(location.search);
+ const role = queryParams.get('role');
+ const from = queryParams.get('from');
+
+ // 设置角色信息
+ if (role) {
+ setCurrentRole(role);
+
+ // 检查是否是从caseDes弹窗点击进入的
+ if (from === 'casedes') {
+ setIsFromCaseDesClick(true);
+
+ // 只有当是从caseDes弹窗点击进入时才重置表单
+ form.resetFields();
+ }
+ }
+
+ // 从缓存中获取可用的代理对象列表
+ // 这里我们需要获取对应角色的当事人作为代理对象
+ const personCacheKey = 'case_personnel_cache';
+ const cachedPersons = getLocal(personCacheKey) || [];
+
+ // 过滤出当事人（applicant或respondent），确保排除代理人角色
+ const filteredObjects = cachedPersons.filter((person) => {
+ // 确保只显示当事人，排除所有代理人
+ const isAgent = person.role === 'applicantAgent' || person.role === 'respondentAgent';
+ if (isAgent) return false;
+
+ // 如果当前角色是申请方代理人，则只显示申请方当事人
+ const currentRoleValue = role || currentRole;
+ if (currentRoleValue === 'applicantAgent') {
+ return person.role === 'applicant';
+ }
+ // 如果当前角色是被申请方代理人，则只显示被申请方当事人
+ else if (currentRoleValue === 'respondentAgent') {
+ return person.role === 'respondent';
+ }
+ return false;
+ });
+
+ // 转换为Radio组件可用的格式
+ const objects = filteredObjects.map((person) => {
+ let displayName = '';
+ if (person.selectedType === 'natural' && person.formData) {
+ displayName = person.formData.trueName || person.formData.name || '未命名自然人';
+ } else if ((person.selectedType === 'legal' || person.selectedType === 'nonlegal') && person.formData) {
+ displayName = person.formData.companyName || '未命名组织';
+ }
+
+ return {
+ value: person.timestamp.toString(), // 使用时间戳作为唯一标识
+ label: displayName,
+ data: person, // 存储完整数据以便后续使用
+ };
+ });
+
+ setAgentObjects(objects);
+
+ // 如果有代理对象，则设置第一个为默认选中
+ if (objects.length > 0) {
+ setDefaultAgentObject(objects[0].value);
+ form.setFieldsValue({
+ agentObject: objects[0].value,
+ });
+ }
+
+ // 设置表单初始值
+ form.setFieldsValue({
+ card: '身份证',
+ nation: 'han',
+ gender: 'male',
+ risk: 'no',
+ agent_relationship: 'qinshu',
+ agent_type: 'yiban',
+ });
+ } catch (error) {
+ console.error('读取角色信息或代理对象数据失败:', error);
+ }
+ }, [form, currentRole, location]);
+
+ const onFinish = (values) => {
+ console.log('表单提交:', values);
+
+ try {
+ // 获取整个表单的值并打印
+ const formValues = form.getFieldsValue(true);
+ console.log('整个表单的值:', formValues);
+ console.log('姓名字段值:', formValues.name);
+
+ // 检查name字段是否存在于formValues中
+ if (!formValues.hasOwnProperty('name')) {
+ console.error('表单中没有name字段');
+ Toast.fail({
+ content: '表单数据缺失，请重新填写姓名',
+ duration: 1.5,
+ });
+ return;
+ }
+
+ // 合并所有表单数
+ const allFormData = {
+ ...formValues, // 获取主表单所有字段值
+ ...values, // 合并当前提交的表单数据
+ };
+
+ // 获取选中的代理对象信息
+ const selectedAgentObject = agentObjects.find((obj) => obj.value === allFormData.agentObject);
+ let agentObjectInfo = null;
+ if (selectedAgentObject) {
+ agentObjectInfo = {
+ name: selectedAgentObject.label,
+ id: selectedAgentObject.value,
+ type: selectedAgentObject.data.selectedType,
+ role: selectedAgentObject.data.role,
+ };
+ }
+
+ // 准备文件信息数据，只保存必要的信息以便缓存
+ const idCardFileInfos = idCardFiles.map((file) => ({
+ name: file.name,
+ size: file.size,
+ uid: file.uid,
+ type: file.type,
+ lastModified: file.lastModified,
+ }));
+
+ const authorizationFileInfos = authorizationFiles.map((file) => ({
+ name: file.name,
+ size: file.size,
+ uid: file.uid,
+ type: file.type,
+ lastModified: file.lastModified,
+ }));
+
+ // 将文件信息添加到表单数据中
+ const formDataWithFiles = {
+ ...allFormData,
+ agentObjectInfo, // 添加代理对象的详细信息
+ idCardFilesInfo: idCardFileInfos,
+ authorizationFilesInfo: authorizationFileInfos,
+ };
+
+ // 保存当前表单数据
+ const formDataToCache = {
+ selectedType: 'natural', // 代理人都是自然人类型
+ formData: formDataWithFiles,
+ timestamp: new Date().getTime(), // 添加时间戳，便于排序和显示
+ role: currentRole, // 添加角色信息
+ };
+
+ // 记录日志，便于排查问题
+ console.log('保存到缓存的数据:', formDataToCache);
+ console.log('代理人姓名:', formDataToCache.formData.name);
+
+ // 保存到临时键
+ setLocal('agent_info_form_data', formDataToCache);
+
+ // 同时更新人员缓存列表
+ const personCacheKey = 'case_personnel_cache';
+ const currentCachedPersons = getLocal(personCacheKey) || [];
+
+ // 添加新记录到缓存列表中
+ currentCachedPersons.push(formDataToCache);
+
+ // 保存更新后的缓存列表
+ setLocal(personCacheKey, currentCachedPersons);
+
+ // 设置一个标志，表示数据已更新，需要caseDes页面刷新
+ setLocal('case_personnel_updated', true);
+
+ Toast.success({
+ content: '保存成功',
+ duration: 1,
+ });
+
+ // 清空文件列表
+ setIdCardFiles([]);
+ setAuthorizationFiles([]);
+
+ // 保存成功后跳转到caseDes页面
+ console.log('准备跳转到NaturePersonNone页面');
+ setTimeout(() => {
+ history.push('/gzdyh/NaturePersonNone');
+ }, 500); // 添加短暂延迟确保跳转成功
+ } catch (error) {
+ console.error('保存失败:', error);
+ Toast.fail({
+ content: '保存失败',
+ duration: 1,
+ });
+ }
+ };
+
+ // 处理身份证识别结果
+ const handleIdCardSuccess = (result) => {
+ console.log('身份证识别结果:', result);
+ form.setFieldsValue({
+ name: result.name,
+ cardNumber: result.idNumber,
+ address: result.address,
+ gender: result.gender === '男' ? 'male' : 'female',
+ nation: result.nation,
+ });
+ Toast.show('身份证信息识别成功');
+ };
+ const RadioGroup = Radio.Group;
+
+ // 根据角色获取标题
+ const getTitle = () => {
+ switch (currentRole) {
+ case 'applicantAgent':
+ return '添加申请方代理人';
+ case 'respondentAgent':
+ return '添加被申请方代理人';
+ default:
+ return '添加申请方代理人';
+ }
+ };
+
+ // 渲染代理对象列表
+ const renderAgentObjectsList = () => {
+ if (agentObjects.length === 0) {
+ return (
+ <div className="agent-form__empty-tip">
+ <p className="agent-form__empty-text">
+ {currentRole === 'applicantAgent' ? '没有找到申请方当事人，请先添加申请方当事人' : '没有找到被申请方当事人，请先添加被申请方当事人'}
+ </p>
+ </div>
+ );
+ }
+
+ return (
+ <Radio.Group
+ defaultValue={defaultAgentObject}
+ className="agent-form__radio-group"
+ onChange={(value) => {
+ console.log('选择的代理对象:', value);
+ form.setFieldsValue({ agentObject: value });
+ }}
+ >
+ {agentObjects.map((object) => (
+ <div className="agent-form__radio-item" key={object.value}>
+ <Radio value={object.value} className="agent-form__radio" />
+ <span className="agent-form__radio-label">{object.label}</span>
+ </div>
+ ))}
+ </Radio.Group>
+ );
+ };
+
+ // 处理身份证明材料上传
+ const handleIdCardUpload = (files) => {
+ console.log('身份证明材料上传:', files);
+ // 钉钉上传组件可能会触发多次onChange，我们只取最新的文件
+ if (files && files.file) {
+ // 处理单个文件上传
+ const newFile = files.file;
+ // 检查文件是否已存在
+ const isExist = idCardFiles.some((f) => f.uid === newFile.uid);
+ if (!isExist) {
+ setIdCardFiles([...idCardFiles, newFile]);
+ }
+ }
+ };
+
+ // 处理授权委托书上传
+ const handleAuthorizationUpload = (files) => {
+ console.log('代理人授权委托书上传:', files);
+ // 钉钉上传组件可能会触发多次onChange，我们只取最新的文件
+ if (files && files.file) {
+ // 处理单个文件上传
+ const newFile = files.file;
+ // 检查文件是否已存在
+ const isExist = authorizationFiles.some((f) => f.uid === newFile.uid);
+ if (!isExist) {
+ setAuthorizationFiles([...authorizationFiles, newFile]);
+ }
+ }
+ };
+
+ // 处理文件预览
+ const handlePreview = (file) => {
+ console.log('预览文件:', file);
+ // 这里添加文件预览逻辑
+ };
+
+ // 处理文件删除
+ const handleDelete = (file, type) => {
+ if (type === 'idCard') {
+ setIdCardFiles(idCardFiles.filter((f) => f !== file));
+ } else if (type === 'authorization') {
+ setAuthorizationFiles(authorizationFiles.filter((f) => f !== file));
+ }
+ };
+
+ // 渲染文件列表
+ const renderFileList = (files, type) => {
+ if (!Array.isArray(files) || files.length === 0) return null;
+ return (
+ <div className="agent-form__file-list">
+ {files.map((file, index) => (
+ <div key={index} className="agent-form__file-item">
+ <img src={fileUploadIcon} alt="file" className="agent-form__file-icon" />
+ <div className="agent-form__file-info">
+ <div className="agent-form__file-name">{file.name}</div>
+ <div className="agent-form__file-meta">
+ <span className="agent-form__file-size">{(file.size / 1024).toFixed(1)}K</span>
+ </div>
+ </div>
+ <div className="agent-form__file-actions">
+ <span className="agent-form__delete-btn" onClick={() => handleDelete(file, type)}>
+ <img src={fileDeleteIcon} alt="删除" className="agent-form__delete-icon" />
+ </span>
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ return (
+ <NavBarPage leftContentVisible={true} title={getTitle()}>
+ <div className="agent-form__section">
+ <Form form={form} className="agent-form" onFinish={onFinish}>
+ <Form.Item
+ name="agentObject"
+ label="代理对象"
+ layout="vertical"
+ rules={[{ required: true, message: '请选择代理对象' }]}
+ className="agent-form__object-item"
+ >
+ <div className="agent-form__select-container">{renderAgentObjectsList()}</div>
+ </Form.Item>
+
+ <Form.Item
+ name="agent_relationship"
+ label="委托关系"
+ layout="horizontal"
+ rules={[{ message: '请选择委托关系', required: true }]}
+ className="agent-form__relationship-item"
+ >
+ <div className="agent-form__select-container">
+ <Select
+ mode="single"
+ placeholder="请选择委托关系"
+ defaultValue="qinshu"
+ onChange={console.log}
+ options={[
+ { label: '亲属', value: 'qinshu' },
+ { label: '监护人', value: 'jianhu' },
+ { label: '律师', value: 'lvshi' },
+ { label: '社会团体推荐的公民', value: 'shehui' },
+ { label: '所在单位推荐的人', value: 'danwei' },
+ { label: '法律工作者', value: 'falu' },
+ ]}
+ />
+ </div>
+ </Form.Item>
+
+ <Form.Item
+ name="agent_type"
+ label="委托类型"
+ layout="horizontal"
+ rules={[{ message: '请选择委托类型', required: true }]}
+ className="agent-form__type-item"
+ >
+ <div className="agent-form__select-container">
+ <Select
+ mode="single"
+ placeholder="请选择委托类型"
+ defaultValue="yiban"
+ onChange={console.log}
+ options={[
+ { label: '一般授权代理', value: 'yiban' },
+ { label: '特别授权代理', value: 'tebie' },
+ { label: '共同授权代理', value: 'gongtong' },
+ { label: '转委托代理', value: 'zhuanwei' },
+ ]}
+ />
+ </div>
+ </Form.Item>
+
+ <div className="agent-form__divider"></div>
+
+ <div className="agent-form__two-column">
+ <div className="agent-form__left-column" layout="vertical">
+ <div className="agent-form__field-wrapper">
+ <Form.Item
+ name="name"
+ label="代理人姓名"
+ className="agent-form__name-item"
+ required={true}
+ layout="vertical"
+ rules={[{ required: true, message: '请填写代理人姓名' }]}
+ >
+ <div className="agent-form__input-wrapper">
+ <InputItem
+ placeholder="请填写"
+ value={nameValue}
+ onChange={(value) => {
+ console.log('Input onChange 事件触发, 值:', value);
+ // 手动更新name值
+ setNameValue(value);
+ // 如果输入内容不为空，设置表单字段值
+ if (value && value.trim() !== '') {
+ form.setFieldsValue({ name: value });
+ console.log('已更新表单name字段:', value);
+ }
+ }}
+ />
+ </div>
+ </Form.Item>
+ </div>
+ <div className="agent-form__field-wrapper">
+ <Form.Item name="phone" label="联系方式" required={true} layout="vertical">
+ <div className="agent-form__textarea-wrapper">
+ <TextareaItem placeholder="请填写手机号码" count={11} />
+ </div>
+ </Form.Item>
+ </div>
+ </div>
+ </div>
+
+ <div className="agent-form__divider"></div>
+
+ <Form.Item name="card" label="证件类型" layout="horizontal" rules={[{ message: '请选择证件类型' }]}>
+ <div className="agent-form__select-container">
+ <Select
+ mode="single"
+ placeholder="身份证"
+ defaultValue="idcard"
+ onChange={console.log}
+ options={[
+ { label: '身份证', value: 'idcard' },
+ { label: '户口本', value: 'hukou' },
+ { label: '护照', value: 'passport' },
+ { label: '港澳通行证', value: 'gangao' },
+ { label: '台胞证', value: 'taibao' },
+ { label: '军官证', value: 'jun' },
+ ]}
+ />
+ </div>
+ </Form.Item>
+
+ <div className="agent-form__field-wrapper">
+ <Form.Item name="cardNumber" label="证件号码" layout="vertical" rules={[{ message: '请填写证件号码' }]}>
+ <div className="agent-form__textarea-wrapper">
+ <TextareaItem placeholder="请填写完整证件号码" count={24} />
+ </div>
+ </Form.Item>
+ </div>
+
+ <div className="agent-form__field-wrapper">
+ <Form.Item name="address" label="户籍地址" layout="vertical" rules={[{ message: '请填写详细地址' }]}>
+ <div className="agent-form__textarea-wrapper">
+ <TextareaItem placeholder="请填写详细地址" />
+ </div>
+ </Form.Item>
+ </div>
+
+ <div className="agent-form__field-wrapper">
+ <Form.Item name="workAddress" label="工作单位" layout="vertical" rules={[{ message: '请填写单位全名' }]}>
+ <div className="agent-form__textarea-wrapper">
+ <TextareaItem placeholder="请填写单位全名" />
+ </div>
+ </Form.Item>
+ </div>
+
+ <Form.Item name="nation" label="民族" layout="horizontal" rules={[{ message: '汉族' }]}>
+ <div className="agent-form__select-container">
+ <Select
+ mode="single"
+ placeholder="汉族"
+ defaultValue="han"
+ onChange={console.log}
+ options={[
+ { label: '汉族', value: 'han' },
+ { label: '蒙古族', value: 'menggu' },
+ { label: '回族', value: 'hui' },
+ { label: '藏族', value: 'zang' },
+ { label: '维吾尔族', value: 'weiwuer' },
+ { label: '苗族', value: 'miao' },
+ { label: '彝族', value: 'yizu' },
+ { label: '壮族', value: 'zhuang' },
+ { label: '布依族', value: 'buyi' },
+ { label: '朝鲜族', value: 'chaoxian' },
+ { label: '满族', value: 'man' },
+ { label: '侗族', value: 'dong' },
+ { label: '瑶族', value: 'yao' },
+ { label: '白族', value: 'bai' },
+ { label: '土家族', value: 'tujia' },
+ { label: '哈尼族', value: 'hani' },
+ { label: '哈萨克族', value: 'hasake' },
+ { label: '傣族', value: 'dai' },
+ { label: '黎族', value: 'li' },
+ { label: '傈僳族', value: 'lisu' },
+ { label: '佤族', value: 'wa' },
+ { label: '畲族', value: 'she' },
+ { label: '高山族', value: 'gaoshan' },
+ { label: '拉祜族', value: 'lahu' },
+ { label: '水族', value: 'shui' },
+ { label: '东乡族', value: 'dongxiang' },
+ { label: '纳西族', value: 'naxi' },
+ { label: '景颇族', value: 'jingpo' },
+ { label: '柯尔克孜族', value: 'keerkezi' },
+ { label: '土族', value: 'tu' },
+ { label: '达斡尔族', value: 'dawoer' },
+ { label: '仫佬族', value: 'mulao' },
+ { label: '羌族', value: 'qiang' },
+ { label: '布朗族', value: 'bulang' },
+ { label: '撒拉族', value: 'sala' },
+ { label: '毛南族', value: 'maonan' },
+ { label: '仡佬族', value: 'yilao' },
+ { label: '锡伯族', value: 'xibo' },
+ { label: '阿昌族', value: 'achang' },
+ { label: '普米族', value: 'pumi' },
+ { label: '塔吉克族', value: 'tajike' },
+ { label: '怒族', value: 'nu' },
+ { label: '乌孜别克族', value: 'wuzibieke' },
+ { label: '俄罗斯族', value: 'eluo' },
+ { label: '鄂温克族', value: 'wengke' },
+ { label: '德昂族', value: 'dengang' },
+ { label: '保安族', value: 'baoan' },
+ { label: '裕固族', value: 'yugong' },
+ { label: '京族', value: 'jing' },
+ { label: '塔塔尔族', value: 'tatala' },
+ { label: '独龙族', value: 'dulong' },
+ { label: '鄂伦春族', value: 'elunchun' },
+ { label: '赫哲族', value: 'hezhe' },
+ { label: '门巴族', value: 'menba' },
+ { label: '珞巴族', value: 'luoba' },
+ { label: '基诺族', value: 'jinuo' },
+ ]}
+ />
+ </div>
+ </Form.Item>
+
+ <Form.Item name="gender" label="性别" layout="horizontal" rules={[{ message: '请选择性别' }]}>
+ <div className="agent-form__select-container">
+ <Radio.Group defaultValue="male" className="agent-form__radio-group">
+ <Radio value="female"></Radio>
+ <span>女</span>
+ <Radio value="male"></Radio>
+ <span>男</span>
+ </Radio.Group>
+ </div>
+ </Form.Item>
+
+ <div className="agent-form__divider"></div>
+
+ <Form.Item
+ name="risk"
+ label={
+ <span className="agent-form__risk-label">
+ <img
+ src={require('../../../assets/img/riskMask.png')}
+ alt="警告"
+ className="agent-form__risk-icon"
+ />
+ 是否有个人极端倾向
+ </span>
+ }
+ layout="horizontal"
+ className="agent-form__risk-item"
+ rules={[{ message: '请选择是否有极端倾向' }]}
+ >
+ <div className="agent-form__select-container">
+ <Radio.Group layout="horizontal" defaultValue="no" className="agent-form__radio-group">
+ <Radio value="yes"></Radio>
+ <span>是</span>
+ <Radio value="no"></Radio>
+ <span>否</span>
+ </Radio.Group>
+ </div>
+ </Form.Item>
+
+ <div className="agent-form__divider"></div>
+
+ <Form.Item name="idCardMaterials" label="身份证明材料" className="agent-form__upload-item">
+ <div className="agent-form__upload-wrapper">
+ <div className="agent-form__upload-button-wrapper">
+ <Upload
+ listType="picture"
+ accept="image/*"
+ type="form-upload"
+ action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+ className="agent-form__upload-button agent-form__idcard-upload"
+ onChange={handleIdCardUpload}
+ showUploadList={false}
+ />
+ </div>
+ </div>
+ </Form.Item>
+
+ {/* 身份证明材料文件列表 */}
+ {renderFileList(idCardFiles, 'idCard')}
+
+ <div className="agent-form__divider"></div>
+
+ <Form.Item name="authorizationDoc" label="代理人授权委托书" className="agent-form__upload-item agent-form__auth-upload-item">
+ <div className="agent-form__upload-wrapper">
+ <div className="agent-form__upload-button-wrapper">
+ <Upload
+ listType="picture"
+ accept="image/*"
+ type="form-upload"
+ action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
+ className="agent-form__upload-button agent-form__auth-upload"
+ onChange={handleAuthorizationUpload}
+ showUploadList={false}
+ />
+ </div>
+ </div>
+ </Form.Item>
+
+ {/* 授权委托书文件列表 */}
+ {renderFileList(authorizationFiles, 'authorization')}
+
+ <div className="agent-form__divider"></div>
+
+ <div className="agent-form__button-wrapper">
+ <Button
+ htmlType="submit"
+ type="primary"
+ size="large"
+ className="agent-form__submit-button"
+ onClick={(e) => {
+ console.log('保存按钮被点击');
+
+ // 手动更新name字段值
+ if (nameValue && nameValue.trim() !== '') {
+ form.setFieldsValue({ name: nameValue });
+ console.log('在提交前设置name字段:', nameValue);
+ }
+
+ // 直接调用表单提交，使用表单原生提交机制
+ form.submit();
+ }}
+ >
+ 保存
+ </Button>
+ </div>
+ </Form>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default Agentperson;
diff --git a/src/views/selfInspection/Agentperson/index.less b/src/views/selfInspection/Agentperson/index.less
new file mode 100644
index 0000000..b59cba4
--- /dev/null
+++ b/src/views/selfInspection/Agentperson/index.less
@@ -0,0 +1,1303 @@
+// 变量定义
+@primary-color: #1A6FB8;
+@text-color: #171A1D;
+@text-color-secondary: #333333;
+@background-color: #FFFFFF;
+@border-color: #EEEEEE;
+@error-color: #FF0000;
+@shadow-color: rgba(0, 0, 0, 0.05);
+@font-family: PingFang SC, PingFang SC-400;
+
+// 尺寸变量
+@border-radius: 8px;
+@spacing-xs: 4px;
+@spacing-sm: 8px;
+@spacing-md: 12px;
+@spacing-lg: 16px;
+@font-size-sm: 14px;
+@font-size-md: 15px;
+@font-size-lg: 16px;
+@line-height: 23px;
+
+// 混合器
+.flex-center() {
+ display: flex;
+ align-items: center;
+}
+
+.flex-between() {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.text-ellipsis() {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
+
+.form-label() {
+ font-size: @font-size-md;
+ font-family: @font-family;
+ font-weight: 400;
+ color: @text-color;
+ line-height: @line-height;
+}
+
+.dtm-button {
+ // width: 343px;
+ // height: 44px;
+ // line-height: 44px;
+ // display: block; // 确保按钮为块级元素
+ // background: #1a6fb8;
+ // border-radius: 8px; // 增加圆角半径
+ // font-size: 16px;
+ // font-weight: 400;
+ // color: #ffffff;
+ // border: none;
+ // margin-left: auto;
+ // margin-right: auto;
+
+ // &:active {
+ // opacity: 0.9; // 点击效果
+ // }
+}
+
+.form-section {
+ position: relative;
+ padding-bottom: 80px; // 为固定按钮留出空间
+ height: 100%;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+
+ .form-button-wrapper {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ background: @background-color;
+ padding: @spacing-lg;
+ z-index: 100;
+ box-shadow: 0 -2px 8px @shadow-color;
+ }
+
+ .dtm-form-item-required-brief:before {
+ top: 8px;
+ }
+ .agent-object-section {
+ width: 100%;
+ background: @background-color;
+
+ .agent-object-title {
+ margin-bottom: @spacing-md;
+ .flex-center();
+
+ .required-star {
+ color: @error-color;
+ margin-right: @spacing-xs;
+ }
+
+ span:last-child {
+ width: 60px;
+ height: @line-height;
+ .form-label();
+ }
+ }
+ }
+
+ .agent-label-title {
+ padding-left: @spacing-lg;
+ padding-top: @spacing-md;
+ margin-bottom: @spacing-sm;
+ .flex-center();
+
+ .required-star {
+ color: @error-color;
+ margin-right: @spacing-xs;
+ }
+
+ span:last-child {
+ .form-label();
+ }
+ }
+
+ .arco-radio-group {
+ padding-left: 17px;
+
+ .arco-radio {
+ margin-bottom: 0;
+ }
+
+ .arco-radio-wrapper {
+ font-size: @font-size-sm;
+ color: @text-color-secondary;
+ }
+
+ .arco-radio-checked .arco-radio-mask {
+ border-color: @primary-color;
+ background-color: @primary-color;
+ }
+ }
+
+ .agent-radio-group {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+
+ padding-left: 0;
+
+ .radio-item {
+ display: flex;
+ align-items: center;
+ padding: 0 !important;
+ width: 100%;
+ margin-bottom: 0;
+
+ .arco-radio {
+ margin-right: @spacing-sm;
+ }
+
+ span {
+ line-height: normal;
+ width: auto;
+ max-width: calc(100% - 30px);
+ height: @line-height;
+ .form-label();
+ .text-ellipsis();
+ margin-left: @spacing-sm;
+ }
+
+ .radio-label {
+ display: inline-block;
+ vertical-align: middle;
+ margin-left: @spacing-xs;
+ }
+ }
+ }
+
+ // 添加代理对象表单样式
+ .agent-object-form-item {
+ margin-top: @spacing-md;
+ .dtm-form-item-label,
+ .dd-form-item-label {
+ white-space: nowrap;
+ overflow: visible;
+ width: 100%;
+ min-width: 100%;
+ .form-label();
+ }
+
+ .dtm-form-item-control {
+ flex: 1;
+ width: 100%;
+ }
+
+ .dtm-form-item-default-label {
+ width: auto !important;
+ flex: 0 0 auto !important;
+ white-space: nowrap !important;
+ min-width: 140px !important;
+ max-width: none !important;
+ overflow: visible !important;
+ }
+
+ .dtm-form-item-default-field {
+ width: 100% !important;
+ flex: 1 1 auto !important;
+ }
+ }
+
+ .agent-relationship-form-item,
+ .agent-type-form-item {
+ .dtm-form-item-label,
+ .dd-form-item-label {
+ white-space: nowrap;
+ overflow: visible;
+ width: 100%;
+ min-width: 100%;
+ .form-label();
+ }
+
+ .dtm-form-item-control {
+ flex: 1;
+ width: 100%;
+ }
+
+ .dtm-form-item-default-label {
+ width: 100% !important;
+ flex: 1 1 auto !important;
+ }
+
+ .dtm-form-item-default-field {
+ width: 100% !important;
+ flex: 1 1 auto !important;
+ }
+ }
+
+ // 添加样式防止标签文字换行显示
+ .risk-tendency-label {
+ width: auto !important;
+ min-width: 140px !important;
+ white-space: nowrap;
+ .form-label();
+ }
+}
+
+.dd-form {
+ width: 100%;
+ background: @background-color;
+
+ // 代理人姓名样式
+ .agent-name-form-item {
+ .dd-form-item-label {
+ width: 75px;
+ height: @line-height;
+ .form-label();
+ }
+ }
+
+ // 添加两列布局样式
+ .form-two-column-layout {
+ display: flex;
+ width: 100%;
+ margin: 12px, 0;
+
+ .form-left-column {
+ flex: 1;
+ padding-right: 8px;
+ width: 70%;
+ }
+
+ .form-right-column {
+ flex: 1;
+ padding-left: 8px;
+ width: 30%;
+
+ .idcard-label {
+ display: inline-block;
+ width: 75px;
+ height: @line-height;
+ .form-label();
+ border-radius: 4px;
+ margin-right: 16px;
+ text-align: center;
+ cursor: pointer;
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+
+ // 调整IdcardOCR组件样式
+ .form-idcard-wrapper {
+ margin-top: -5px;
+ .idcard-ocr-main {
+ width: 100%;
+ min-height: 10px;
+ margin-bottom: 16px;
+ background-color: @background-color;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 0;
+ box-sizing: border-box;
+
+ .idcard-ocr-main-title {
+ display: inline-block;
+ width: auto;
+ margin-top: 0px;
+ text-align: right;
+
+ &-top {
+ color: @primary-color;
+ font-size: 16px;
+ height: @line-height;
+ text-align: right;
+ width: auto;
+ }
+
+ &-bottom {
+ display: none;
+ }
+ }
+ }
+ }
+
+ .dtm-form .dtm-list-item {
+ background: @background-color;
+ }
+
+ .dd-form-item {
+ position: relative;
+ }
+
+ .input-container {
+ position: relative;
+ display: flex;
+ align-items: center;
+
+ .card-type-label {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+
+ .id-recognition {
+ display: flex;
+ align-items: center;
+ color: @primary-color;
+ font-size: 14px;
+ cursor: pointer;
+
+ .id-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 4px;
+ }
+ }
+ }
+ }
+ .upload-container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-right: 0;
+ width: 100%;
+ background-color: @background-color;
+ }
+
+ // 全局表单标签样式，确保标签和星号对齐
+ .dd-field-item {
+ .dd-field-label {
+ display: flex;
+ align-items: center;
+
+ &::before {
+ line-height: 1;
+ vertical-align: middle;
+ }
+ }
+ }
+}
+
+// 图标样式
+.natural-icon {
+ background: url('../../../assets/img/Frame.png') no-repeat center;
+ background-size: contain;
+}
+
+.legal-icon {
+ background: url('../../../assets/img/Frame2.png') no-repeat center;
+ background-size: contain;
+}
+
+.org-icon {
+ background: url('../../../assets/img/Frame3.png') no-repeat center;
+ background-size: contain;
+}
+
+.risk-label-red {
+ color: @error-color !important;
+}
+
+.color-selector {
+ width: 100%;
+ padding: 16px;
+ background: @background-color;
+
+ .color-grid {
+ display: grid;
+ grid-template-columns: repeat(3, 1fr);
+ gap: 12px;
+
+ .color-tag {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 32px;
+ margin: 0;
+ border-radius: 4px;
+ }
+ }
+}
+
+.tag-container {
+ display: flex;
+ flex-direction: column; // 改为纵向排列
+
+ background: @background-color;
+
+ .tag-title {
+ font-size: 15px;
+ color: @text-color;
+ margin-bottom: 16px;
+ text-align: left; // 确保文字左对齐
+ }
+
+ .tag-list {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px;
+ }
+
+ .arco-tag {
+ border-radius: 16px;
+ padding: 4px 12px;
+ font-size: 14px;
+ border: none;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+}
+
+.custom-idcard-ocr .idcard-ocr-main-img {
+ display: none !important;
+}
+
+/* 或者可以替换为简单的边框样式 */
+.custom-idcard-ocr .idcard-ocr-main {
+ background: none;
+ border: none;
+ padding: 0;
+ border-radius: 4px;
+}
+
+/* 隐藏原始文字样式 */
+.custom-idcard-ocr .idcard-ocr-main-title {
+ opacity: 0;
+ position: absolute;
+ z-index: 1;
+ height: 1px;
+ width: 1px;
+ overflow: hidden;
+}
+
+.form-component-wrapper {
+ width: 100%;
+ position: relative;
+
+ &.form-input-wrapper,
+ &.form-textarea-wrapper,
+ &.form-idcard-wrapper,
+ &.form-button-wrapper,
+ &.form-upload-wrapper {
+ // 保持原有样式不变，只是提供一个容器
+ box-sizing: border-box;
+ display: block;
+ }
+}
+
+.card-select-container {
+ width: 100%;
+ padding: 0;
+ box-sizing: border-box;
+
+ // 让选择器宽度一致
+ .dtm-select {
+ width: 100%;
+ }
+
+ // 代理对象列表样式
+ .agent-radio-group {
+ width: 100%;
+ padding-left: 0 !important;
+
+ .radio-item {
+ width: 100%;
+ padding: 8px 0;
+ margin-bottom: 0;
+ align-items: center;
+
+ span {
+ margin-left: 8px;
+ width: calc(100% - 30px);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ }
+ }
+
+ // 无代理对象提示样式
+ .no-agent-objects {
+ width: 100%;
+ top: 10px;
+
+ p {
+ margin: 0;
+ }
+ }
+}
+
+.id-upload-wrapper {
+ background-color: @background-color;
+ margin-top: 8px;
+ width: 100%;
+ position: relative;
+}
+
+.id-upload-container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ background-color: @background-color;
+ position: relative;
+ padding-bottom: 10px;
+ margin-bottom: 20px;
+
+ .upload-label {
+ width: 140px;
+ height: @line-height;
+ .form-label();
+ }
+
+ .id-upload-button-wrapper {
+ position: absolute;
+ right: 0;
+ top: 0;
+ height: 47px;
+ width: 40px;
+ display: block;
+ align-items: center;
+ justify-content: center;
+ background-color: @background-color;
+ }
+
+ .id-upload-button {
+ width: 24px;
+ height: 24px;
+
+ .dd-upload-input {
+ display: none;
+ }
+
+ .dd-upload-button {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ }
+
+ .dd-upload-list {
+ display: block;
+ position: absolute;
+ left: 0;
+ top: 30px;
+ width: 100%;
+ }
+
+ .dd-icon {
+ font-size: 24px;
+ color: #cccccc;
+ margin-right: 0;
+ }
+
+ .dd-icon-plus-circle::before,
+ .dd-icon-add::before {
+ color: #cccccc;
+ font-size: 22px;
+ }
+ }
+}
+
+/* 遮罩层样式优化 */
+.ocr-overlay {
+ z-index: 10;
+ transition: background-color 0.2s ease;
+
+ &:active {
+ background-color: rgba(26, 111, 184, 0.2) !important;
+ }
+}
+
+// 调整label样式使其更明显可点击
+.idcard-label {
+ color: @primary-color !important;
+ font-weight: 500;
+ text-decoration: underline;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.8;
+ }
+}
+
+// 添加模态框文本样式
+.idcard-ocr-main-text {
+ padding: 0 16px 16px;
+ text-align: left;
+
+ p {
+ margin: 8px 0;
+ font-size: 14px;
+ color: #4e5969;
+ line-height: 1.5;
+
+ &:first-child {
+ color: @primary-color;
+ font-weight: 500;
+ margin-bottom: 8px;
+ }
+ }
+}
+
+/* 身份证明材料上传组件样式 */
+.id-card-upload {
+ .dd-upload-list {
+ display: block;
+ margin-top: 10px;
+ position: absolute;
+ left: 0;
+ top: 35px;
+ width: 100%;
+ overflow: hidden;
+ }
+
+ .dd-upload-list-item {
+ margin-top: 8px;
+ border-radius: 4px;
+ background-color: #f0f2f5;
+ padding: 4px 8px;
+ border-left: 3px solid @primary-color;
+ }
+
+ .dd-upload-list-item-name {
+ color: @primary-color;
+ font-size: 14px;
+ }
+}
+
+/* 代理人授权委托书上传组件样式 */
+.auth-doc-upload {
+ .dd-upload-list {
+ display: block;
+ margin-top: 10px;
+ position: absolute;
+ left: 0;
+ top: 35px;
+ width: 100%;
+ overflow: hidden;
+ }
+
+ .dd-upload-list-item {
+ margin-top: 8px;
+ border-radius: 4px;
+ background-color: #f7f8fa;
+ padding: 4px 8px;
+ border-left: 3px solid #ff7d00;
+ }
+
+ .dd-upload-list-item-name {
+ color: #ff7d00;
+ font-size: 14px;
+ }
+}
+
+/* 上传组件样式调整 */
+.upload-form-item {
+ .dtm-form-item-label {
+ width: auto;
+ min-width: 120px;
+ font-size: 15px;
+ font-family: @font-family;
+ font-weight: 400;
+ text-align: LEFT;
+ color: @text-color;
+ line-height: @line-height;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .dtm-form-item-control {
+ flex: 1;
+ width: auto;
+ position: relative;
+ }
+
+ .dtm-upload {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+
+ .id-upload-button {
+ position: relative;
+
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ border-color: @primary-color;
+ color: @primary-color;
+ }
+ }
+}
+
+/* 专门针对代理人授权委托书的样式 */
+.auth-doc-upload-item {
+ .dtm-form-item-label {
+ white-space: nowrap;
+ min-width: 140px;
+ }
+
+ .dtm-upload {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+}
+
+/* 上传按钮样式优化 */
+.id-upload-button {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ border-color: @primary-color;
+ color: @primary-color;
+ }
+
+ .dd-upload-button,
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
+}
+
+/* 对所有表单项标签统一处理，防止文本换行 */
+.form-section {
+ .dtm-form-item-label,
+ .dd-form-item-label {
+ white-space: nowrap;
+ overflow: visible;
+ }
+}
+
+/* 修复代理对象标签和星号对齐问题 */
+.agent-object-form-item {
+ .dd-field-label {
+ display: flex;
+ align-items: center;
+ top: 16px;
+ }
+}
+
+/* 修复单选框和文字的垂直对齐问题 */
+.radio-item {
+ display: flex;
+ align-items: center;
+
+ .arco-radio {
+ margin-right: 8px;
+ }
+
+ span {
+ line-height: normal;
+ }
+}
+
+.ap-card-select-container {
+ width: 100%;
+ padding: 0;
+ box-sizing: border-box;
+
+ // 让选择器宽度一致
+ .dtm-select {
+ width: 100%;
+ }
+
+ // 代理对象列表样式
+ .agent-radio-group {
+ width: 100%;
+ padding-left: 0 !important;
+
+ .radio-item {
+ width: 100%;
+ padding: 8px 0;
+ margin-bottom: 0;
+ align-items: center;
+
+ span {
+ margin-left: 8px;
+ width: calc(100% - 30px);
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ }
+ }
+
+ // 无代理对象提示样式
+ .no-agent-objects {
+ width: 100%;
+ top: 10px;
+
+ p {
+ margin: 0;
+ }
+ }
+}
+
+.ap-id-upload-wrapper {
+ background-color: @background-color;
+ margin-top: 8px;
+ width: 375px;
+ position: relative;
+}
+
+.ap-id-upload-container {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ background-color: @background-color;
+ position: relative;
+ padding-bottom: 10px;
+ margin-bottom: 20px;
+
+ .upload-label {
+ width: 140px;
+ height: @line-height;
+ font-size: 15px;
+ color: @text-color;
+ font-family: @font-family;
+ font-weight: 400;
+ text-align: left;
+ }
+
+ .id-upload-button-wrapper {
+ position: absolute;
+ right: 16px;
+ top: 0;
+ height: 47px;
+ width: 40px;
+ display: block;
+ align-items: center;
+ justify-content: center;
+ background-color: @background-color;
+ }
+
+ .id-upload-button {
+ width: 24px;
+ height: 24px;
+
+ .dd-upload-input {
+ display: none;
+ }
+
+ .dd-upload-button {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 24px;
+ height: 24px;
+ }
+
+ .dd-upload-list {
+ display: block;
+ position: absolute;
+ left: 0;
+ top: 30px;
+ width: 100%;
+ }
+
+ .dd-icon {
+ font-size: 24px;
+ color: #cccccc;
+ margin-right: 0;
+ }
+
+ .dd-icon-plus-circle::before,
+ .dd-icon-add::before {
+ color: #cccccc;
+ font-size: 22px;
+ }
+ }
+}
+
+/* 遮罩层样式优化 */
+.ocr-overlay {
+ z-index: 10;
+ transition: background-color 0.2s ease;
+
+ &:active {
+ background-color: rgba(26, 111, 184, 0.2) !important;
+ }
+}
+
+/* 身份证明材料上传组件样式 */
+.id-card-upload {
+ .dd-upload-list {
+ display: block;
+ margin-top: 10px;
+ position: absolute;
+ left: 0;
+ top: 35px;
+ width: 100%;
+ overflow: hidden;
+ }
+
+ .dd-upload-list-item {
+ margin-top: 8px;
+ border-radius: 4px;
+ background-color: #f0f2f5;
+ padding: 4px 8px;
+ border-left: 3px solid @primary-color;
+ }
+
+ .dd-upload-list-item-name {
+ color: @primary-color;
+ font-size: 14px;
+ }
+}
+
+/* 代理人授权委托书上传组件样式 */
+.auth-doc-upload {
+ .dd-upload-list {
+ display: block;
+ margin-top: 10px;
+ position: absolute;
+ left: 0;
+ top: 35px;
+ width: 100%;
+ overflow: hidden;
+ }
+
+ .dd-upload-list-item {
+ margin-top: 8px;
+ border-radius: 4px;
+ background-color: #f7f8fa;
+ padding: 4px 8px;
+ border-left: 3px solid #ff7d00;
+ }
+
+ .dd-upload-list-item-name {
+ color: #ff7d00;
+ font-size: 14px;
+ }
+}
+
+/* 上传组件样式调整 */
+.upload-form-item {
+ .dtm-form-item-label {
+ width: auto;
+ min-width: 120px;
+ font-size: 15px;
+ font-family: @font-family;
+ font-weight: 400;
+ text-align: LEFT;
+ color: @text-color;
+ line-height: @line-height;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .dtm-form-item-control {
+ flex: 1;
+ width: auto;
+ position: relative;
+ }
+
+ .dtm-upload {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+
+ .id-upload-button {
+ position: relative;
+
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ border-color: @primary-color;
+ color: @primary-color;
+ }
+ }
+}
+
+/* 专门针对代理人授权委托书的样式 */
+.auth-doc-upload-item {
+ .dtm-form-item-label {
+ white-space: nowrap;
+ min-width: 140px;
+ }
+
+ .dtm-upload {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+}
+
+/* 上传按钮样式优化 */
+.id-upload-button {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ border-color: @primary-color;
+ color: @primary-color;
+ }
+
+ .dd-upload-button,
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
+}
+
+/* 对所有表单项标签统一处理，防止文本换行 */
+.form-section {
+ .dtm-form-item-label,
+ .dd-form-item-label {
+ white-space: nowrap;
+ overflow: visible;
+ }
+}
+
+/* 修复代理对象标签和星号对齐问题 */
+.agent-object-form-item {
+ .dd-field-label {
+ display: flex;
+ align-items: center;
+ }
+}
+
+/* 修复单选框和文字的垂直对齐问题 */
+.radio-item {
+ display: flex;
+ align-items: center;
+
+ .arco-radio {
+ margin-right: 8px;
+ }
+
+ span {
+ line-height: normal;
+ }
+}
+
+/* 右对齐上传按钮样式 */
+.right-aligned-upload {
+ position: relative;
+ display: flex;
+ justify-content: flex-end;
+ width: 100%;
+
+ .dd-upload-button,
+ .dtm-upload-button {
+ position: absolute;
+ right: 16px !important;
+ top: 0;
+ }
+
+ .dd-icon-plus-circle::before,
+ .dd-icon-add::before {
+ color: @primary-color;
+ font-size: 22px;
+ }
+
+ /* 文件上传后的列表也保持靠右 */
+ .dd-upload-list,
+ .dtm-upload-list {
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 16px;
+ width: 100%;
+ }
+}
+
+/* 保证上传按钮位置 */
+.upload-form-item {
+ .dtm-form-item-control {
+ position: relative;
+
+ .dtm-upload,
+ .dd-upload {
+ width: 100%;
+ display: flex;
+ justify-content: flex-end;
+ }
+ }
+}
+
+/* 直接针对dingtalk设计按钮的样式 */
+.dd-upload-button,
+.dtm-upload-button {
+ position: absolute !important;
+ right: 16px !important;
+ top: 8px !important;
+ width: 24px !important;
+ height: 24px !important;
+ border: none !important;
+ background: transparent !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ display: flex !important;
+ align-items: center !important;
+ justify-content: center !important;
+}
+
+/* 调整加号图标 */
+.dd-icon-plus-circle,
+.dd-icon-add,
+.dtm-icon-plus-circle,
+.dtm-icon-add {
+ color: @primary-color !important;
+ font-size: 24px !important;
+}
+
+/* 更精准地控制上传表单项的布局 */
+.upload-form-item {
+ position: relative;
+ margin-bottom: 12px !important;
+
+ .dtm-form-item-label-text,
+ .dd-form-item-label-text {
+ position: relative;
+ left: 16px;
+ }
+
+ .dtm-form-item-control,
+ .dd-form-item-control {
+ width: 100% !important;
+ padding-right: 16px !important;
+ box-sizing: border-box !important;
+ position: relative !important;
+ min-height: 40px !important;
+ }
+}
+
+/* 清除任何可能影响位置的浮动或定位 */
+.dtm-upload-list,
+.dd-upload-list {
+ clear: both !important;
+ width: 100% !important;
+}
+
+/* 上传控制容器样式 */
+.upload-control-container {
+ width: 100%;
+ position: relative;
+ min-height: 40px;
+ display: flex;
+ justify-content: flex-end;
+ padding-right: 16px;
+ box-sizing: border-box;
+
+ .dd-upload,
+ .dtm-upload {
+ position: absolute;
+ right: 16px;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ }
+
+ .dd-upload-button,
+ .dtm-upload-button {
+ position: absolute;
+ right: 0;
+ top: 0;
+ width: 24px;
+ height: 24px;
+ }
+
+ .dd-icon-plus-circle,
+ .dd-icon-add,
+ .dtm-icon-plus-circle,
+ .dtm-icon-add {
+ position: absolute;
+ right: 0;
+ top: 0;
+ font-size: 24px;
+ color: #cccccc;
+ }
+}
+
+/* 文件列表样式 */
+.file-list {
+ margin-top: 8px;
+ padding: 0 16px;
+}
+
+.file-item {
+ display: flex;
+ align-items: center;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ padding: 10px;
+ margin-bottom: 8px;
+ position: relative;
+}
+
+.file-icon {
+ width: 24px;
+ height: 24px;
+ margin-right: 10px;
+}
+
+.file-info {
+ flex: 1;
+ overflow: hidden;
+}
+
+.file-name {
+ font-size: 14px;
+ color: #333;
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.file-size-preview {
+ display: flex;
+ justify-content: space-between;
+ font-size: 12px;
+ color: #999;
+}
+
+.file-size {
+ color: #999;
+}
+
+.preview-text {
+ color: @primary-color;
+}
+
+.file-actions {
+ display: flex;
+ align-items: center;
+}
+
+.delete-btn-wrapper {
+ display: inline-block;
+ padding: 4px;
+ cursor: pointer;
+}
+
+.delete-icon {
+ width: 16px;
+ height: 16px;
+}
diff --git a/src/views/selfInspection/NaturePersonNone/index.jsx b/src/views/selfInspection/NaturePersonNone/index.jsx
new file mode 100644
index 0000000..95f793a
--- /dev/null
+++ b/src/views/selfInspection/NaturePersonNone/index.jsx
@@ -0,0 +1,443 @@
+import React, { useState, useEffect } from 'react';
+import NavBarPage from '../../../components/NavBarPage';
+import ProcessFlow from '../components/ProcessFlow';
+import { WriteNoteOutlined, ApplyOutlined } from 'dd-icons';
+import * as $$ from '../../../utils/utility';
+import './index.less';
+import { useHistory } from 'react-router-dom';
+import { Form, Button, Toast, Modal } from 'dingtalk-design-mobile';
+import { general_user_add_blue, lettersVisits_1 } from '../../../assets/img';
+const NaturePersonNone = () => {
+ const [currentForm, setCurrentForm] = useState('dispute'); // 直接设置初始表单为描述纠纷
+ const [guideVisible, setGuideVisible] = useState(false); // 添加指引弹窗可见状态
+ const [personAdded, setPersonAdded] = useState(false);
+ const [visible, setVisible] = useState(false);
+ const [cachedForms, setCachedForms] = useState([]); // 存储缓存的表单数据
+ const [hasPersonnel, setHasPersonnel] = useState(false); // 是否有人员信息的标志
+ const history = useHistory();
+
+ const [tooltipText, setTooltipText] = useState('');
+ const [tooltipPosition, setTooltipPosition] = useState({ top: 0, left: 0 });
+
+ // // 加载所有缓存的人员信息
+ useEffect(() => {
+ let cachedData = $$.getLocal('case_personnel_cacheList') || [];
+ if (cachedData.length > 0) {
+ setCachedForms(cachedData);
+ setHasPersonnel(cachedData.length > 0);
+ $$.clearLocal('case_personnel_cacheList');
+ }
+ }, [$$.getLocal('case_personnel_cacheList')]);
+
+ const handleAddPerson = () => {
+ setVisible(true);
+ };
+
+ const handleClose = () => {
+ setVisible(false);
+ };
+
+ const handleSaveDraft = () => {
+ Toast.show('保存草稿');
+ };
+
+ // 跳转到描述纠纷页面
+ const navigateToCaseDes = () => {
+ if (cachedForms.length > 0) {
+ $$.setSessionStorage('saveData', { personList: cachedForms });
+ history.push('/gzdyh/caseDes');
+ } else {
+ Toast.fail('请先添加人员信息');
+ }
+ };
+
+ // 按照角色类型排序功能
+ const sortCachedFormsByRole = (forms) => {
+ // 排序顺序: 申请方当事人，申请方代理人，被申请方当事人，被申请方代理人
+ const roleOrder = {
+ 'applicant': 1,
+ 'applicantAgent': 2,
+ 'respondent': 3,
+ 'respondentAgent': 4,
+ };
+
+ return [...forms].sort((a, b) => {
+ return (roleOrder[a.role] || 99) - (roleOrder[b.role] || 99);
+ });
+ };
+
+ // 定义节点状态：0-未开始，1-进行中，2-已完成
+ const [nodeStatus, setNodeStatus] = useState([1, 0, 0]);
+
+ // 节点配置
+ const nodes = [
+ { id: 0, label: '填写人员' },
+ { id: 1, label: '描述纠纷' },
+ { id: 2, label: '上报矛盾' },
+ ];
+
+ // 渲染缓存的表单数据
+ const renderCachedForms = () => {
+ // 对人员数据按角色排序
+ const sortedForms = sortCachedFormsByRole(cachedForms);
+ return (
+ <div>
+ {sortedForms.map((cachedForm, index) => {
+ let personType = '';
+ let idCardNumber = '';
+ let agentObjectInfo = null;
+
+ if (cachedForm.perClass === '09_01001-1') {
+ personType = '自然人';
+ } else if (cachedForm.perClass === '09_01001-2') {
+ personType = '法人';
+ } else if (cachedForm.perClass === '09_01001-3') {
+ personType = '非法人组织';
+ }
+
+ return (
+ <React.Fragment key={index}>
+ <div className="card-container">
+ <div
+ className="cached-form-card"
+ onClick={() => {
+ // 跳转到readperson页面查看详情
+ // history.push(`/gzdyh/readperson?id=${cachedForm.timestamp}`);
+ }}
+ >
+ {/* 删除图标 */}
+ <div className="delete-icons">
+ <div
+ className="delete-icon-wrapper"
+ onClick={(e) => {
+ $$.confirmModal({
+ title: '删除确认',
+ subtitle: (
+ <span>
+ 确定删除当前<span style={{ color: 'var(--theme_primary1_color)' }}>{cachedForm?.trueName}</span>吗？
+ </span>
+ ),
+ onOk: () => {
+ // 将当前当事人从缓存中删除
+ const updatedForms = cachedForms.filter((form) => form.id !== cachedForm.id);
+ setCachedForms(updatedForms);
+ // 更新状态
+ setHasPersonnel(updatedForms.length > 0);
+ setPersonAdded(updatedForms.length > 0);
+ },
+ });
+ }}
+ >
+ <img src={require('../../../assets/img/Rectangle 812.png')} alt="删除" className="delete-icon" />
+ <img src={require('../../../assets/img/remove_1.png')} alt="删除图标" className="delete-icon-overlay" />
+ </div>
+ </div>
+ {cachedForm?.perType === '15_020008-1' && (
+ <div className="applicant-badge">
+ <span className="applicant-text">申请方</span>
+ </div>
+ )}
+ {cachedForm?.perType === '15_020008-2' && (
+ <div className="respondent-badge">
+ <span className="respondent-text">被申</span>
+ <span className="respondent-text">请方</span>
+ </div>
+ )}
+ <div className="content-wrapper">
+ <div className="cached-form-content">
+ <div className="cached-form-name-phone">
+ <span className="cached-form-name">{cachedForm?.trueName || '-'}</span>
+ {cachedForm?.mobile && <span className="cached-form-phone">{cachedForm?.mobile || '-'}</span>}
+ </div>
+ </div>
+ <div className="cached-form-header">
+ <div className="cached-form-type">
+ {cachedForm?.perType === '24_00006-1' || cachedForm?.perType === '24_00006-2' ? (
+ <>
+ 代理对象：
+ <span style={{ marginLeft: '2px', color: '#86909C', fontSize: '12px' }}>{agentObjectInfo?.name || '未知对象'}</span>
+ </>
+ ) : (
+ <>
+ <span
+ style={{
+ display: 'inline-flex',
+ alignItems: 'center',
+ height: '20px',
+ marginLeft: '0px',
+ }}
+ >
+ <span
+ style={{
+ fontSize: '12px',
+ lineHeight: '20px',
+ color: ' rgba(23,26,29,0.60)',
+ marginLeft: '0px',
+ }}
+ >
+ 自然人
+ </span>
+ <span
+ style={{
+ color: ' rgba(23,26,29,0.60)',
+ fontSize: '11px',
+ lineHeight: '12px',
+ marginLeft: '4px',
+ }}
+ >
+ |
+ </span>
+ <span
+ style={{
+ color: 'rgba(23,26,29,0.60)',
+ fontSize: '12px',
+ lineHeight: '20px',
+ }}
+ >
+ {cachedForm.certiNo || '-'}
+ </span>
+ </span>
+ </>
+ )}
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ {index < sortedForms.length - 1 && <div className="card-separator"></div>}
+ </React.Fragment>
+ );
+ })}
+ </div>
+ );
+ };
+
+ // 渲染人员表单
+ const renderPersonnelForm = () => {
+ return (
+ <div className="case-info-block case-personnel">
+ <div className="block-content">
+ {/* 显示缓存的人员表单数据 */}
+ {renderCachedForms()}
+
+ <div className="add-personnel-container">
+ <div
+ className="add-personnel-btn1"
+ onClick={() => {
+ console.log('添加人员信息');
+ // 显示弹窗
+ setVisible(true);
+ }}
+ >
+ <img src={general_user_add_blue} alt="用户图标" style={{ marginRight: '8px' }} />
+ <span>添加人员信息</span>
+ </div>
+ </div>
+ </div>
+ </div>
+ );
+ };
+
+ // 有人员时的渲染显示
+ const renderPersonPage = () => (
+ <div>
+ <NavBarPage
+ leftContentVisible={true}
+ title="登记"
+ rightContentFunc={handleSaveDraft}
+ rightChildren={
+ <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+ <img style={{ width: '14px', height: '14px' }} src={lettersVisits_1} alt="保存草稿" />
+ 保存草稿
+ </div>
+ }
+ >
+ <div className="case-info-put-container">
+ {renderPersonnelForm()}
+ <div className="bottom-button-area">
+ <Button className="save-button" type="primary" onClick={navigateToCaseDes}>
+ <p className="save-button-text">下一步</p>
+ </Button>
+ </div>
+ </div>
+ </NavBarPage>
+ {/* 导航弹窗 */}
+ <div className="case-process-container">
+ <ProcessFlow nodes={nodes} nodeStatus={nodeStatus} />
+ </div>
+ </div>
+ );
+
+ // 渲染没有人员时的初始页面
+ const renderEmptyPersonnelPage = () => (
+ <div className="first">
+ <NavBarPage
+ leftContentVisible={true}
+ title="登记"
+ rightContentFunc={handleSaveDraft}
+ rightContentText="保存草稿"
+ rightIcon={<WriteNoteOutlined />}
+ >
+ <div className="self-inspection-container">
+ <div className="person-placeholder">
+ <div className="person-image">
+ <img src={require('../../../assets/img/Group.png')} alt="人员占位图" />
+ </div>
+ <p className="add-person-text">请先添加当事人</p>
+ <div className="add-person-btn" onClick={handleAddPerson}>
+ <img src={require('../../../assets/img/general_user-add.png')} alt="用户图标" />
+ <span>添加人员信息</span>
+ </div>
+ </div>
+ </div>
+ </NavBarPage>
+ </div>
+ );
+
+ return (
+ <>
+ {hasPersonnel ? renderPersonPage() : renderEmptyPersonnelPage()}
+
+ {/* 添加人员弹窗 */}
+ <Modal visible={visible} title="添加人员" onClose={handleClose} className="person-modal">
+ <div className="modal-wrapper">
+ <div className="person-modal-content">
+ <div className="person-modal-wrapper">
+ <div className="modal-main-content">
+ <div className="modal-option-item blue-bg">
+ <div className="option-content">
+ <div className="content-item-a">
+ <span className="item-title">申请方当事人</span>
+ </div>
+ <div className="content-item-b">
+ <span className="item-desc">主动提出纠纷诉求的一方</span>
+ </div>
+ <div className="content-item-c">
+ <Button
+ className="item-button"
+ onClick={() => {
+ setVisible(false);
+ // 需要将cachedForms放入缓存
+ $$.setLocal('case_personnel_cache', cachedForms);
+ history.push('/gzdyh/legalPerson?perType=15_020008-1&perTypeName=申请方当事人&edit=false');
+ }}
+ >
+ 添加
+ </Button>
+ </div>
+ </div>
+ <img src={require('../../../assets/img/zxperson1.png')} alt="选项图标" className="option-image" />
+ </div>
+ <div className="modal-option-item blue-bg">
+ <div className="option-content">
+ <div className="content-item-a">
+ <span className="item-title">申请方代理人</span>
+ </div>
+ <div className="content-item-b">
+ <span className="item-desc">代表申请方处理纠纷的人</span>
+ </div>
+ <div className="content-item-c">
+ <Button
+ className="item-button"
+ onClick={(e) => {
+ // 检查是否已存在申请方当事人
+ const applicantExists = cachedForms.some((form) => form.perType === '15_020008-1');
+ if (!applicantExists) {
+ $$.showToast({
+ type: 'fail',
+ mask: true,
+ icon: <ApplyOutlined />,
+ content: '请先添加申请方当事人',
+ });
+ return;
+ }
+ // 使用URL参数传递角色和来源信息
+ setVisible(false);
+ setPersonAdded(true);
+ // 需要将cachedForms放入缓存
+ $$.setLocal('case_personnel_cache', cachedForms);
+ history.push('/gzdyh/Agentperson?perType=24_00006-1&perTypeName=申请方代理人&edit=false'); // 使用URL参数传递角色信息
+ }}
+ >
+ 添加
+ </Button>
+ </div>
+ </div>
+ <img src={require('../../../assets/img/zxperson2.png')} alt="选项图标" className="option-image" />
+ </div>
+ <div className="modal-option-item orange-bg">
+ <div className="option-content">
+ <div className="content-item-a">
+ <span className="item-title">被申请方当事人</span>
+ </div>
+ <div className="content-item-b">
+ <span className="item-desc">被动应对纠纷诉求的一方</span>
+ </div>
+ <div className="content-item-c">
+ <Button
+ className="item-button"
+ onClick={() => {
+ setVisible(false);
+ // 需要将cachedForms放入缓存
+ $$.setLocal('case_personnel_cache', cachedForms);
+ history.push('/gzdyh/legalPerson?perType=15_020008-2&perTypeName=被申请方当事人&edit=false');
+ }}
+ >
+ 添加
+ </Button>
+ </div>
+ </div>
+ <img src={require('../../../assets/img/zxperson3.png')} alt="选项图标" className="option-image" />
+ </div>
+ <div className="modal-option-item orange-bg">
+ <div className="option-content">
+ <div className="content-item-a">
+ <span className="item-title">被申请方代理人</span>
+ </div>
+ <div className="content-item-b">
+ <span className="item-desc">代表被申请方处理纠纷的人</span>
+ </div>
+ <div className="content-item-c">
+ <Button
+ className="item-button"
+ onClick={(e) => {
+ // 检查是否已存在申请方当事人
+ const applicantExists = cachedForms.some((form) => form.perType === '15_020008-2');
+ if (!applicantExists) {
+ $$.showToast({
+ type: 'fail',
+ content: '请先添加被申请方当事人',
+ });
+ return;
+ }
+ setVisible(false);
+ setPersonAdded(true);
+ // 需要将cachedForms放入缓存
+ $$.setLocal('case_personnel_cache', cachedForms);
+ history.push('/gzdyh/Agentperson?perType=24_00006-2&perTypeName=被申请方代理人&edit=false'); // 使用URL参数传递角色信息
+ }}
+ >
+ 添加
+ </Button>
+ </div>
+ </div>
+ <img src={require('../../../assets/img/zxperson4.png')} alt="选项图标" className="option-image" />
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div
+ className="cancel-button"
+ onClick={() => {
+ handleClose();
+ }}
+ >
+ <span className="cancel-icon">×</span>
+ </div>
+ </Modal>
+ </>
+ );
+};
+
+export default NaturePersonNone;
diff --git a/src/views/selfInspection/NaturePersonNone/index.less b/src/views/selfInspection/NaturePersonNone/index.less
new file mode 100644
index 0000000..e3a9cef
--- /dev/null
+++ b/src/views/selfInspection/NaturePersonNone/index.less
@@ -0,0 +1,777 @@
+.self-inspection-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ height: 774px;
+ width: 375px;
+ background-color: #f2f2f2;
+
+ .person-placeholder {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ width: 375px;
+ height: 666px;
+
+ .person-image {
+ width: 128px;
+ height: 128px;
+ display: flex;
+ justify-content: center;
+ }
+
+ .add-person-text {
+ font-size: 16px;
+ width: 112px;
+ height: 24px;
+ color: #171a1d;
+ margin: 16px 0 !important;
+ text-align: center;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ line-height: 24px;
+ }
+
+ .add-person-btn {
+ width: 164px;
+ height: 44px;
+ border-radius: 22.5px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 15px;
+ background: #fff;
+ border: 1px solid #e5e6eb;
+ transition: all 0.3s;
+
+ &:hover {
+ background: #f2f3f5;
+ }
+
+ img {
+ width: 18px;
+ height: 17px;
+ margin-right: 8px;
+ }
+
+ span {
+ font-size: 15px;
+ // color: #1D2129;
+ line-height: 1;
+ }
+ }
+ }
+}
+
+// 弹窗相关样式
+.person-modal {
+ // Modal 整体样式
+ width: 100%;
+ padding: 0 12px;
+ margin: 0 auto;
+ position: relative;
+ transform: translateY(0px); // 将弹窗上移距离从-90px改为-70px
+
+ & .dtm-modal-header {
+ text-align: left;
+ padding: 0px 16px 12px;
+ position: relative;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 16px;
+ right: 16px;
+ height: 1px;
+ background: none;
+ border-bottom: 1px dashed rgba(126, 134, 142, 0.24);
+ }
+
+ & .dtm-modal-title {
+ text-align: left;
+ font-size: 17px;
+ }
+ }
+
+ & .dtm-modal-body {
+ padding: 10px 16px 12px !important;
+ box-sizing: border-box;
+ position: relative;
+ }
+
+ .modal-wrapper {
+ position: relative;
+ width: 100%;
+ height: 556px;
+ }
+
+ // 关闭按钮样式
+ .cancel-button {
+ position: fixed;
+ bottom: -45px;
+ left: 50%;
+ transform: translateX(-50%);
+ width: 27px;
+ height: 27px;
+ background: transparent;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ z-index: 1000;
+ border: 1px solid #ffffff;
+
+ .cancel-icon {
+ width: 27px;
+ height: 27px;
+ line-height: 27px;
+ color: #ffffff;
+ object-fit: contain;
+ }
+ }
+
+ // 弹窗内容区域
+ .person-modal-content {
+ width: 100%;
+ height: 100%;
+ margin: 0 auto;
+ padding: 0;
+ box-sizing: border-box;
+
+ .person-modal-wrapper {
+ width: 100%;
+ height: 556px;
+ display: flex;
+ justify-content: center;
+
+ .modal-main-content {
+ width: 319px;
+ height: 556px;
+ display: flex;
+ flex-direction: column;
+ gap: 10px;
+ padding: 0;
+ margin: 0;
+
+ .modal-option-item {
+ width: 100%;
+ height: 122px;
+ border-radius: 6px;
+ position: relative;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ box-sizing: border-box;
+ padding: 0 10px 0 16px;
+ margin: 6px 0;
+
+ .option-content {
+ flex: 1;
+ height: 122px;
+ display: flex;
+ flex-direction: column;
+ box-sizing: border-box;
+ position: relative;
+ align-items: flex-start;
+ justify-content: flex-start;
+
+ .content-item-a {
+ margin-top: 12px;
+ width: 120px;
+ align-self: flex-start;
+ padding-left: 0;
+ margin-left: 0;
+ text-align: left;
+
+ .item-title {
+ font-size: 16px;
+ color: #ffffff;
+ font-weight: 400;
+ line-height: 22px;
+ font-family: PingFang SC, PingFang SC-400;
+ padding-left: 0;
+ margin-left: 0;
+ text-align: left;
+ }
+ }
+
+ .content-item-b {
+ margin-top: 4px;
+ width: 168px;
+ padding-left: 0;
+ margin-left: 0;
+ text-align: left;
+
+ .item-desc {
+ font-size: 14px;
+ color: rgba(255, 255, 255, 0.8);
+ line-height: 20px;
+ font-family: PingFang SC, PingFang SC-400;
+ text-align: left;
+ }
+ }
+
+ .content-item-c {
+ position: absolute;
+ bottom: 0px;
+ left: 0;
+ height: 32px;
+ margin-bottom: 16px;
+
+ .item-button {
+ width: 60px;
+ height: 32px;
+ background: transparent;
+ border: 1px solid #ffffff;
+ border-radius: 100px;
+ color: #ffffff;
+ font-size: 14px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+ }
+ }
+
+ .option-image {
+ width: 80px;
+ height: 80px;
+ object-fit: contain;
+ margin-right: 5px;
+ }
+
+ &.blue-bg {
+ background-color: #1f68c7;
+ }
+
+ &.orange-bg {
+ background-color: #d46b08;
+ }
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+ }
+ }
+}
+
+// 简洁弹窗样式
+.simple-modal-content {
+ .modal-tip {
+ font-size: 16px;
+ color: #333;
+ margin-bottom: 16px;
+ text-align: center;
+ }
+
+ .input-group {
+ margin-bottom: 20px;
+ }
+
+ .modal-buttons {
+ display: flex;
+ justify-content: flex-end;
+ }
+}
+
+.modal-container {
+ position: relative;
+
+ .modal-content {
+ width: 351px;
+ padding-top: 81px;
+ padding-bottom: 129px;
+ height: 601px;
+ display: flex;
+ flex-direction: column;
+ gap: 12px;
+ }
+
+ .modal-option {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 122px;
+ padding: 16px;
+ border-radius: 8px;
+ transition: all 0.3s ease;
+
+ .add-btn {
+ width: 60px;
+ height: 30px;
+ border-radius: 15px;
+ font-size: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 0;
+ margin-top: auto;
+ background: transparent;
+ border: 1px solid #ffffff;
+ color: #ffffff;
+ }
+
+ .option-text {
+ font-size: 16px;
+ font-family: PingFang SC, PingFang SC-500;
+ font-weight: 500;
+ line-height: 24px;
+ margin-bottom: 4px;
+ color: #ffffff;
+ }
+
+ .option-desc {
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ line-height: 20px;
+ margin-bottom: auto;
+ color: rgba(255, 255, 255, 0.8);
+ }
+
+ &:hover {
+ opacity: 0.9;
+ transform: translateY(-2px);
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ }
+
+ &:active {
+ transform: translateY(0);
+ opacity: 1;
+ }
+
+ .option-info {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ justify-content: space-between;
+ }
+
+ .option-icon {
+ width: 48px;
+ height: 48px;
+ object-fit: contain;
+ }
+ }
+}
+
+/** 案件信息区块样式 */
+.case-info-put-container {
+ margin-top: 82px !important;
+
+ .case-info-block {
+ background-color: #f2f2f2;
+ margin-bottom: 8px; // 区块之间的间隔
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+
+ .block-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #171a1d;
+ margin-bottom: 12px;
+ }
+
+ > .block-content {
+ padding: 8px;
+ min-height: 40px;
+ }
+ }
+
+ /* 添加人员信息按钮样式 */
+ .add-personnel-btn1 {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ // padding: 8px 16px;
+ width: 352px;
+ height: 44px;
+ background: #ffffff !important;
+ border: 0.5px solid #1a6fb8 !important;
+ border-radius: 22.5px !important;
+
+ span {
+ color: #1a6fb8;
+ font-size: 15px;
+ }
+ }
+
+ /* 添加人员信息容器 */
+ .add-personnel-container {
+ display: flex;
+ justify-content: center;
+ padding: 15px 0 10px;
+ background: #f2f2f2;
+ }
+
+ /* 添加人员信息图标 */
+ .add-personnel-icon {
+ width: 18px;
+ height: 17px;
+ vertical-align: middle;
+ margin-right: 8px;
+ position: relative;
+ }
+
+ /* 添加人员信息文本 */
+ .add-personnel-text {
+ margin-bottom: 2px;
+ }
+}
+
+/* 缓存表单容器样式 - 用于包裹所有人员信息卡片 */
+.cached-forms-container {
+ display: flex;
+ flex-direction: column;
+ background-color: #f2f2f2;
+}
+
+/* 卡片外层容器样式 */
+.card-container {
+ background: #f2f2f2;
+ display: flex;
+}
+
+/* 缓存表单卡片样式 - 单个人员信息卡片 */
+.cached-form-card {
+ position: relative;
+ padding: 12px 16px 12px 0;
+ background: #ffffff;
+ transition: background-color 0.2s;
+
+ &:active {
+ background-color: #f5f7fa;
+ }
+
+ /* 添加指示点击的箭头 */
+
+ /* 删除图标容器 */
+ .delete-icons {
+ position: absolute;
+ top: 0;
+ right: 0;
+ display: flex;
+ z-index: 10;
+
+ .delete-icon-wrapper {
+ width: 25px;
+ height: 25px;
+ display: flex;
+ justify-content: center;
+ position: relative;
+
+ img {
+ width: 20px;
+ height: 20px;
+ }
+
+ .delete-icon-overlay {
+ position: absolute;
+ left: 9px;
+ width: 12px;
+ height: 12px;
+ z-index: 2;
+ }
+
+ &:hover {
+ opacity: 0.8;
+ }
+ }
+ }
+
+ /* 申请方角色标识 */
+ .applicant-badge {
+ width: 48px;
+ height: 48px;
+ margin: 0px 8px;
+ background: #3491fa;
+ border-radius: 4px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-shrink: 0;
+
+ .applicant-text {
+ width: 42px;
+ height: 22px;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: center;
+ color: #ffffff;
+ line-height: 22px;
+ }
+ }
+
+ /* 被申请方角色标识 */
+ .respondent-badge {
+ width: 48px;
+ height: 48px;
+ margin: 0px 8px;
+ background: #d46b08;
+ border-radius: 4px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ flex-shrink: 0;
+ padding: 2px 0;
+ box-sizing: border-box;
+
+ .respondent-text {
+ width: 28px;
+ height: 22px;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: center;
+ color: #ffffff;
+ line-height: 22px;
+ display: block;
+ }
+ }
+
+ /* 卡片内容区域样式 */
+ .content-wrapper {
+ flex: 1;
+ overflow: hidden;
+ }
+
+ .cached-form-content {
+ margin-bottom: 4px;
+
+ /* 姓名和电话区域 */
+ .cached-form-name-phone {
+ display: flex;
+ align-items: center;
+
+ /* 姓名样式 */
+ .cached-form-name {
+ font-size: 14px;
+ color: #171a1d;
+ font-weight: 400;
+ }
+
+ /* 电话样式 */
+ .cached-form-phone {
+ margin-left: 12px;
+ color: #86909c;
+ font-size: 14px;
+ flex-shrink: 0;
+ }
+ }
+ }
+
+ /* 卡片头部样式 */
+ .cached-form-header {
+ /* 人员类型样式 */
+ .cached-form-type {
+ font-size: 12px;
+ color: #86909c;
+
+ span {
+ margin-left: 6px;
+ color: #0e5fd8;
+ font-size: 12px;
+ }
+ }
+ }
+}
+
+/* 分隔线样式 */
+.card-separator {
+ background-color: #f2f3f5;
+ height: 0px;
+ width: 100%;
+}
+
+/* 底部保存按钮区域样式 */
+.bottom-button-area {
+ width: 100%;
+ height: 68px;
+ // background-color: #ffffff;
+ background-color: #ffffff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ z-index: 100;
+
+ /* 保存按钮样式 */
+ .save-button {
+ width: 343px;
+ height: 44px;
+ background-color: #1a6fb8;
+ border-color: #1a6fb8;
+ // border-radius: 22px;
+ font-size: 16px;
+ padding: 0;
+ margin: 0;
+
+ &:active {
+ background-color: #155ea1;
+ border-color: #155ea1;
+ }
+ }
+
+ /* 按钮文本样式 */
+ .save-button-text {
+ font-size: 17px;
+ color: #ffffff;
+ height: 24px;
+ letter-spacing: 0px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ margin-top: 8px;
+ padding: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+}
+
+.first {
+ margin-top: -44px;
+ background: #f2f3f5;
+ .self-inspection-container {
+ height: 100vh;
+ padding-top: 44px;
+ box-sizing: border-box;
+ display: flex;
+ flex-direction: column;
+ background: #f2f3f5;
+
+ .person-placeholder {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ padding: 20px;
+ text-align: center;
+
+ .person-image {
+ img {
+ width: 130px;
+ height: auto;
+ }
+ }
+
+ .add-person-text {
+ margin-bottom: 20px;
+ font-size: 16px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 1.5;
+ }
+
+ .add-person-btn {
+ width: 160px;
+ height: 42px;
+ background: #1a6fb8;
+ color: #ffffff;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 22px;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+/* 确认提示弹窗样式 */
+.confirmModal-title {
+ font-size: 17px;
+ color: #1d2129;
+ font-weight: 400;
+ text-align: center;
+ font-family: PingFang SC, PingFang SC-400;
+ line-height: 24px;
+}
+
+.confirmModal-subtitle {
+ font-size: 14px;
+ color: #86909c;
+ text-align: center;
+}
+
+/* 添加前置条件提示框样式 */
+.prerequisite-tooltip {
+ position: fixed;
+ z-index: 9999;
+ width: 128px;
+ pointer-events: none;
+
+ .tooltip-content {
+ background-color: rgba(0, 0, 0, 0.75);
+ color: white;
+ padding: 12px;
+ border-radius: 4px;
+ font-size: 14px;
+ text-align: center;
+ position: relative;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+ height: 108px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ box-sizing: border-box;
+
+ .tooltip-icon {
+ margin-right: 6px;
+ color: white;
+ }
+ }
+
+ /* 移除尖锐三角形部分 */
+ .tooltip-arrow {
+ display: none;
+ }
+}
+
+.add-personnel-container {
+ display: flex;
+ justify-content: center;
+ padding: 15px 0 10px;
+ background: #f2f2f2;
+}
+
+.add-personnel-btn {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ padding: 8px 16px;
+ border-radius: 4px;
+ background: #fff;
+ border: 1px solid #e5e6eb;
+ transition: all 0.3s;
+
+ &:hover {
+ background: #f2f3f5;
+ }
+
+ img {
+ width: 18px;
+ height: 17px;
+ margin-right: 8px;
+ }
+
+ span {
+ font-size: 14px;
+ color: #1d2129;
+ line-height: 1;
+ }
+}
diff --git a/src/views/selfInspection/caseDes/index.jsx b/src/views/selfInspection/caseDes/index.jsx
new file mode 100644
index 0000000..5c4bd16
--- /dev/null
+++ b/src/views/selfInspection/caseDes/index.jsx
@@ -0,0 +1,143 @@
+import NavBarPage from '../../../components/NavBarPage';
+import ProcessFlow from '../components/ProcessFlow';
+import './index.less';
+import React, { useState } from 'react';
+import { useHistory } from 'react-router-dom';
+//
+import { Form, Button, TextareaItem, DatePicker, Select, Toast } from 'dingtalk-design-mobile';
+import { WriteEditOutlined } from 'dd-icons';
+import BasicInfoForm from '../components/BasicInfoForm';
+import FormCacheManager from '../components/FormCacheManager';
+import * as $$ from '../../../utils/utility';
+
+const CaseDes = () => {
+ const [form] = Form.useForm();
+ const history = useHistory();
+
+ const [currentForm, setCurrentForm] = useState('dispute'); // 直接设置初始表单为描述纠纷
+ const [guideVisible, setGuideVisible] = useState(false); // 添加指引弹窗可见状态
+ const [submitting, setSubmitting] = useState(false); // 提交状态
+ const [formData, setFormData] = useState({}); // 表单数据
+
+ // 保存草稿
+ const handleSaveDraft = async () => {
+ try {
+ console.log('保存草稿');
+ } catch (error) {
+ setSubmitting(false);
+ console.error('保存草稿失败:', error);
+ }
+ };
+
+ const onFinish = (values) => {
+ console.log('触发了保存');
+ };
+
+ // 表单缓存更新回调
+ const handleCacheUpdated = (formData) => {
+ console.log('表单缓存已更新:', formData);
+ };
+
+ // 不应该被FormCacheManager自动更新的字段列表
+ const excludedFields = ['caseType', 'caseTypeName', 'caseTypeFirst', 'caseTypeFirstName'];
+
+ // 处理下一步按钮点击
+ const handleNext = () => {
+ form
+ .validateFields()
+ .then((values) => {
+ if (currentForm === 'dispute') {
+ // 保存纠纷描述表单数据
+ console.log('保存纠纷描述表单:', values);
+ setCurrentForm('report');
+ setNodeStatus([2, 2, 1]); // 更新节点状态
+ } else if (currentForm === 'report') {
+ // 保存上报矛盾表单数据并提交
+ console.log('提交所有表单数据:', values);
+ // 这里可以添加提交到后端的逻辑
+ Toast.success('提交成功');
+ // 提交成功后返回上一页
+ history.goBack();
+ }
+ })
+ .catch((error) => {
+ console.error('表单验证失败:', error);
+ Toast.fail('请填写必填项');
+ });
+ };
+
+ // 处理预览按钮点击
+ const handlePreview = () => {
+ const saveData = $$.getSessionStorage('saveData') || {};
+ let nowData = { ...saveData, ...formData };
+ $$.setSessionStorage('saveData', nowData);
+ history.push('/gzdyh/preview');
+ };
+
+ // 处理上一步按钮点击
+ const handlePrevious = () => {
+ history.goBack();
+ };
+
+ // 表单数据变化
+ const handleGuideClick = (values, name) => {
+ console.log('指引弹窗处理函数', values, name);
+ setFormData(values);
+ };
+
+ // 定义节点状态：0-未开始，1-进行中，2-已完成
+ const [nodeStatus, setNodeStatus] = useState([
+ 2, // 第一个节点 - 已完成
+ 1, // 第二个节点 - 进行中
+ 0, // 第三个节点 - 未开始
+ ]);
+
+ // 节点配置
+ const nodes = [
+ { id: 0, label: '填写人员' },
+ { id: 1, label: '描述纠纷' },
+ { id: 2, label: '上报矛盾' },
+ ];
+
+ return (
+ <>
+ <NavBarPage
+ title="登记"
+ leftContentVisible={true}
+ rightContentFunc={handleSaveDraft}
+ rightChildren={
+ <>
+ <WriteEditOutlined />
+ 保存草稿
+ </>
+ }
+ leftContentFunc={
+ currentForm === 'report'
+ ? () => {
+ // 返回到纠纷描述状态
+ setCurrentForm('dispute');
+ // 更新节点状态
+ setNodeStatus([2, 1, 0]);
+ }
+ : history.goBack
+ }
+ />
+ <div className="case-process-container">
+ <ProcessFlow nodes={nodes} nodeStatus={nodeStatus} />
+ </div>
+
+ <div className="case-info-container">{currentForm === 'dispute' && <BasicInfoForm onGuideClick={handleGuideClick} />}</div>
+
+ <div className="bottom-button-area">
+ <Button className="previous-button" onClick={handlePrevious} disabled={submitting}>
+ 上一步
+ </Button>
+ <Button className="preview-button" type="primary" onClick={handlePreview} disabled={submitting}>
+ 预览
+ </Button>
+ </div>
+ </>
+ );
+};
+
+export default CaseDes;
diff --git a/src/views/selfInspection/caseDes/index.less b/src/views/selfInspection/caseDes/index.less
new file mode 100644
index 0000000..80bc60d
--- /dev/null
+++ b/src/views/selfInspection/caseDes/index.less
@@ -0,0 +1,757 @@
+/** 导航栏高度设置 */
+// .navBarPage-height {
+// min-height: 0px;
+// }
+
+/** 流程容器 */
+.case-process-container {
+ position: absolute;
+ top: 44px;
+ width: 100%;
+ height: 82px;
+}
+
+/** 案件信息区块样式 */
+.case-info-container {
+ margin-top: 89px;
+ padding-bottom: 68px;
+
+ .case-info-block {
+ background-color: #fff;
+ margin-bottom: 8px; // 区块之间的间隔
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.05);
+
+ .block-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #171A1D;
+ margin-bottom: 12px;
+ }
+
+ >.block-content {
+ padding: 0px;
+ min-height: 40px;
+ }
+ }
+
+ /* 添加人员信息按钮样式 */
+ .add-personnel-btn {
+ width: 352px;
+ height: 44px;
+ background: #ffffff !important;
+ border: 0.5px solid #1a6fb8 !important;
+ border-radius: 22.5px !important;
+
+ span {
+ color: #1a6fb8;
+ }
+ }
+
+ /* 添加人员信息容器 */
+ .add-personnel-container {
+ display: flex;
+ justify-content: center;
+ padding: 15px 0 10px;
+ background: #F2F2F2;
+ }
+
+ /* 添加人员信息图标 */
+ .add-personnel-icon {
+ width: 18px;
+ height: 17px;
+ vertical-align: middle;
+ margin-right: 8px;
+ position: relative;
+ top: 2px;
+ }
+
+ /* 添加人员信息文本 */
+ .add-personnel-text {
+ vertical-align: middle;
+ position: relative;
+ top: 2px;
+ }
+}
+
+/* 缓存表单容器样式 - 用于包裹所有人员信息卡片 */
+.cached-forms-container {
+ display: flex;
+ flex-direction: column;
+ background-color: #f2f2f2;
+ gap: 10px;
+}
+
+/* 卡片外层容器样式 */
+.card-container {
+ background: #f2f2f2;
+ display: flex;
+}
+
+/* 缓存表单卡片样式 - 单个人员信息卡片 */
+.cached-form-card {
+ width: 351px;
+ height: 72px;
+ padding: 12px,12px;
+ background: #ffffff;
+ border-radius: 8px;
+ box-sizing: border-box;
+ margin: 0 auto;
+ display: flex;
+ align-items: center;
+ position: relative;
+
+ /* 删除图标容器 */
+ .delete-icons {
+ position: absolute;
+ top: 0;
+ right: 0;
+ display: flex;
+ z-index: 10;
+
+ .delete-icon-wrapper {
+ width: 20px;
+ height: 20px;
+ margin-top: 0px;
+ display: flex;
+ justify-content: center;
+ position: relative;
+
+ img {
+ width: 18px;
+ height: 18px;
+ }
+
+ .delete-icon-overlay {
+ position: absolute;
+ left: 5px;
+ width: 12px;
+ height: 12px;
+ z-index: 2;
+ }
+
+ &:hover {
+ opacity: 0.8;
+ }
+ }
+ }
+
+ /* 申请方角色标识 */
+ .applicant-badge {
+ width: 48px;
+ height: 48px;
+ margin: 0px 8px;
+ background: #3491fa;
+ border-radius: 4px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-shrink: 0;
+
+ .applicant-text {
+ width: 42px;
+ height: 22px;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: center;
+ color: #ffffff;
+ line-height: 22px;
+ }
+ }
+
+ /* 被申请方角色标识 */
+ .respondent-badge {
+ width: 48px;
+ height: 48px;
+ margin: 0px 8px;
+ background: #D46B08;
+ border-radius: 4px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ flex-shrink: 0;
+ padding: 2px 0;
+ box-sizing: border-box;
+
+ .respondent-text {
+ width: 28px;
+ height: 22px;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: center;
+ color: #ffffff;
+ line-height: 22px;
+ display: block;
+ }
+ }
+
+ /* 卡片内容区域样式 */
+ .content-wrapper {
+ flex: 1;
+ overflow: hidden;
+ }
+
+ .cached-form-content {
+ margin-bottom: 4px;
+
+ /* 姓名和电话区域 */
+ .cached-form-name-phone {
+ display: flex;
+ align-items: center;
+
+ /* 姓名样式 */
+ .cached-form-name {
+ font-size: 14px;
+ color: #171A1D;
+ font-weight: 400;
+
+ }
+
+ /* 电话样式 */
+ .cached-form-phone {
+ margin-left: 12px;
+ color: #86909C;
+ font-size: 14px;
+ flex-shrink: 0;
+ }
+ }
+ }
+
+ /* 卡片头部样式 */
+ .cached-form-header {
+ /* 人员类型样式 */
+ .cached-form-type {
+ font-size: 12px;
+ color: #86909C;
+
+ span {
+ margin-left: 6px;
+ color: #0e5fd8;
+ font-size: 12px;
+ }
+ }
+ }
+}
+
+/* 分隔线样式 */
+.card-separator {
+ background-color: #f2f3f5;
+ height: 8px;
+ width: 100%;
+}
+
+/** 事项概况区块样式 */
+.case-overview, .case-application {
+ position: relative;
+ height: 179px;
+ background: #fff;
+ #caseOverview, #applicationText{
+ height: 100%;
+ }
+ .dtm-textarea-item-desktop{
+ padding: 0px;
+ border: 0px;
+ }
+
+ >.block-content {
+ height: 143px;
+ padding: 16px;
+ padding-bottom: 0;
+
+ .dtm-textarea-item-control{
+ height: 100px;
+ margin-bottom: 8px;
+ }
+
+ // 隐藏组件自带的计数器，使用自定义计数器显示
+ .dtm-textarea-item-count{
+ left: 0px;
+ }
+
+ .overview-form-item, .application-form-item {
+ margin-bottom: 0;
+ >.dtm-list-item{
+ min-height: 47px;
+ }
+ }
+ }
+
+ .overview-button-area {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0;
+ background-color: #ffffff;
+ // border-top: 1px solid #ebedf0;
+ z-index: 10; // 确保按钮区域在上层
+
+ .word-count {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+ font-size: 12px;
+ color: #86909c;
+ width: 183px;
+ // width: 50%;
+ height: 100%;
+ padding-left: 16px;
+
+ .count-wrapper {
+ display: flex;
+ align-items: center;
+ }
+
+ .current-count {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+
+ .total-count {
+ margin-left: 2px;
+ }
+ }
+
+ .overview-actions {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ width: 192px;
+ // width: 50%;
+ height: 100%;
+ background: rgba(182,221,241,0.46);
+ border-top-left-radius: 18px;
+
+ .action-button {
+ height: 100%;
+ padding: 0 8px;
+ font-size: 12px;
+ color: #1A6FB8;
+ background: transparent;
+ border-color: #1A6FB8;
+ border-radius: 4px;
+ margin: 0px;
+ display: flex;
+ align-items: center;
+ flex-direction: row;
+ justify-content: flex-start;
+ padding: 7px 12px;
+ width: 100%;
+ box-sizing: border-box;
+
+ .action-icon {
+ display: inline-block;
+ vertical-align: middle;
+ margin: 4 0px;
+ margin-right: 4px;
+
+ img {
+ width: 11px;
+ height: 11px;
+ display: block;
+ }
+ }
+
+ .action-text {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ line-height: 22px;
+ }
+ }
+
+ .action-button-split{
+ color: #b6ddf1;
+ width: 1px;
+ }
+ }
+ }
+}
+
+/** 重大矛盾纠纷区块样式 */
+.case-major-dispute {
+ position: relative;
+ height: auto;
+ background: #fff;
+ .dtm-form-item-default{
+ >.dtm-form-item-default-label{
+ width: 50%;
+ flex: 0 0 50%;
+ }
+ >.dtm-form-item-default-field{
+ width: 50%;
+ flex: 0 1 50%;
+ }
+ }
+
+
+ // 覆盖Radio组件默认样式
+ .major-dispute-radio-group {
+ .dtm-radio-inner {
+ border-color: #1a6fb8;
+ }
+
+ .dtm-radio-checked .dtm-radio-inner {
+ border-color: #1a6fb8;
+ background-color: #1a6fb8;
+ }
+ }
+}
+
+
+
+/* 申请材料和证据材料区块样式 */
+.case-application-materials, .case-evidence-materials {
+ > .dtm-list-item{
+ min-height: 47px;
+ > .dtm-list-line {
+ min-height: 47px;
+ padding: 0px;
+ > .dtm-list-content{
+ > .dtm-form-item-default{
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ padding-right: 16px;
+
+ > .dtm-form-item-default-label{
+ flex: 3;
+ width: 100%;
+ min-width: 0;
+ padding-right: 12px;
+ word-break: break-word;
+ white-space: normal;
+ }
+ > .dtm-form-item-default-field{
+ flex: 1;
+ /* 上传容器样式 */
+ > .upload-container {
+ /* 上传按钮容器样式 */
+ .upload-button-container {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ justify-content: flex-end;
+ .dtm-upload{
+ justify-content: flex-end;
+ display: flex;
+ .dtm-list-item{
+ min-height: 47px;
+ .dtm-list-line{
+ padding: 0%;
+ min-height: 47px;
+ padding-right: 0;
+ }
+ }
+ }
+ .dtm-divider{
+ width: 0%;
+ min-width: 0;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ /* 文件列表区域样式 */
+ .file-list {
+ padding: 0 16px;
+
+ /* 单个文件项样式 */
+ .file-item {
+ display: flex;
+ align-items: center;
+ padding: 13px 0;
+
+ /* 文件图标样式 */
+ .file-icon {
+ width: 42px;
+ height: 48px;
+ margin-right: 16px;
+ }
+
+ /* 文件信息区域样式 */
+ .file-info {
+ flex: 1;
+ min-width: 0;
+
+ /* 文件名称样式 */
+ .file-name {
+ font-size: 14px;
+ color: #171a1d;
+ line-height: 20px;
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ /* 文件大小和预览区域样式 */
+ .file-size-preview {
+ display: flex;
+ align-items: center;
+ font-size: 12px;
+ line-height: 17px;
+
+ /* 文件大小样式 */
+ .file-size {
+ color: rgba(23, 26, 29, 0.6);
+ margin-right: 4px;
+ }
+
+ /* 预览文本样式 */
+ .preview-text {
+ color: #1a6fb8;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+
+ /* 文件操作区域样式 */
+ .file-actions {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 12px;
+ height: 100%;
+
+ /* 删除按钮包装器样式 */
+ .delete-btn-wrapper {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ height: 100%;
+
+ /* 删除图标样式 */
+ .delete-icon {
+ width: 16px;
+ height: 16px;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+/** 底部按钮区域样式 */
+.bottom-button-area {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 68px;
+ background-color: #fff;
+ box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.1);
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 12px;
+ box-sizing: border-box;
+ z-index: 999;
+
+ .previous-button {
+ width: 123px;
+ height: 44px;
+ background-color: #ffffff;
+ color: #1a6fb8;
+ border: 1px solid #1a6fb8;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ }
+
+ .preview-button {
+ width: 204px;
+ height: 44px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ border: none;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ }
+}
+
+.person-modal {
+
+ /* 选项项样式 */
+ .modal-option-item {
+ width: 307px;
+ height: 104px;
+ border-radius: 8px;
+ padding: 10px 15px;
+ margin-bottom: 20px;
+ position: relative;
+ overflow: hidden;
+ display: flex;
+
+ /* 蓝色背景 - 申请方相关选项 */
+ &.blue-bg {
+ background: rgba(182, 221, 241, 0.46);
+
+ .item-title, .item-button {
+ color: #1A6FB8;
+ }
+
+ .item-button {
+ background-color: transparent;
+ border-color: #1A6FB8;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+
+ /* 橙色背景 - 被申请方相关选项 */
+ &.orange-bg {
+ background: rgba(255, 204, 112, 0.25);
+
+ .item-title, .item-button {
+ color: #FF830B;
+ }
+
+ .item-button {
+ background-color: transparent;
+ border-color: #FF830B;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+
+ /* 选项内容区域 */
+ .option-content {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+
+ /* 标题部分 */
+ .content-item-a {
+ .item-title {
+ font-size: 16px;
+ font-weight: 500;
+ /* 颜色由父级blue-bg或orange-bg控制 */
+ }
+ }
+
+ /* 描述部分 */
+ .content-item-b {
+ .item-desc {
+ font-size: 14px;
+ color: #86909C;
+ line-height: 20px;
+ }
+ }
+
+ /* 按钮部分 */
+ .content-item-c {
+ .item-button {
+ height: 28px;
+ padding: 0 12px;
+ font-size: 14px;
+ border-radius: 4px;
+ /* 颜色由父级blue-bg或orange-bg控制 */
+ }
+ }
+ }
+
+ /* 选项图标 */
+ .option-image {
+ position: absolute;
+ right: 0px;
+ top: 20px;
+ width: 72px;
+ height: 72px;
+ }
+ }
+}
+
+.first{
+ margin-top: -44px;
+ background: #f2f3f5;
+ .self-inspection-container {
+ height: 100vh;
+ padding-top: 44px;
+ box-sizing: border-box;
+ display: flex;
+ flex-direction: column;
+ background: #F2F3F5;
+
+ .person-placeholder {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ padding: 20px;
+ text-align: center;
+ .person-image {
+
+ img {
+ width: 130px;
+ height: auto;
+ }
+ }
+
+ .add-person-text {
+ margin-bottom: 20px;
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 1.5;
+ }
+
+ .add-person-btn {
+ width: 160px;
+ height: 36px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ border-radius: 18px;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+/* 问题属地选择器样式 */
+.jurisdiction-location-item{
+ > .dtm-list-line{
+ > .dtm-list-content{
+ > .dtm-form-item-default{
+ .dtm-form-item-default-field{
+ > .dtm-list-item{
+ > .dtm-list-line {
+ > .dtm-list-extra{
+ color: rgba(23, 26, 29, 0.9); /* 设置颜色为#171A1D，不透明度为90% */
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+
+
diff --git a/src/views/selfInspection/components/BasicInfoForm/index.jsx b/src/views/selfInspection/components/BasicInfoForm/index.jsx
new file mode 100644
index 0000000..6a77e44
--- /dev/null
+++ b/src/views/selfInspection/components/BasicInfoForm/index.jsx
@@ -0,0 +1,546 @@
+import React, { useState, useEffect } from 'react';
+import { Button, Modal, Drawer } from 'dingtalk-design-mobile';
+import { useHistory, useLocation } from 'react-router-dom';
+import { caseDesPicture, caseDesVoice, riskMask, guide } from '../../../../assets/img';
+import useCharacterCounter from '../CharacterCounter';
+import CustomFormView from '../../../../components/CustomFormView';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+const BasicInfoForm = ({ onGuideClick }) => {
+ const history = useHistory();
+ const location = useLocation();
+ const MAX_LENGTH = 100; // 事项概况最大字符数
+ const APP_MAX_LENGTH = 2000; // 事项申请最大字符数
+ const [caseLevel, setCaseLevel] = useState({ level1: false, level2: false, level3: false });
+ const [caseTypeFirstName, setCaseTypeFirstName] = useState('');
+ const [disputeTypeName, setDisputeTypeName] = useState('');
+ const [disputeLocationText, setDisputeLocationText] = useState('');
+ const [selectedLocation, setSelectedLocation] = useState([]);
+ const [disputeLocation, setDisputeLocation] = useState([]);
+ const [peopleNum, setPeopleNum] = useState('');
+ const [amount, setAmount] = useState('');
+ const [textValue, setTextValue] = useState('');
+ const [appTextValue, setAppTextValue] = useState('');
+ const [majorStatus, setMajorStatus] = useState({ yes: false, no: false });
+ const [applicationFiles, setApplicationFiles] = useState([]);
+ const [evidenceFiles, setEvidenceFiles] = useState([]);
+ const [pictureModalVisible, setPictureModalVisible] = useState(false);
+ const [guideVisible, setGuideVisible] = useState(false);
+ const [currentPictureType, setCurrentPictureType] = useState();
+ const [formData, setFormData] = useState({ caseLevel: '3', occurTime: new Date(), majorStatus: 0 });
+
+ // 使用字符计数器
+ const { charCount, isExceeded: overviewCounter } = useCharacterCounter(textValue, 100);
+ const { charCount: appCharCount, isExceeded: applicationCounter } = useCharacterCounter(appTextValue, 2000);
+
+ useEffect(() => {
+ const data = $$.getSessionStorage('selectedLocation');
+ if (data) {
+ // 处理时间数据
+ const formattedData = {
+ ...data,
+ occurTime: data.occurTime ? new Date(data.occurTime) : new Date(),
+ };
+ setFormData({ ...formData, ...formattedData });
+ $$.clearSessionStorage('selectedLocation');
+ }
+ }, [$$.getSessionStorage('selectedLocation')]);
+
+ // 自动设置当前时间为纠纷发生时间
+ useEffect(() => {
+ // 获取当前时间
+ const currentDateTime = new Date();
+ setFormData({ ...formData, occurTime: currentDateTime });
+ }, []); // 只在组件挂载时执行一次
+
+ // 保存数据到缓存
+ const saveToCache = (data) => {
+ localStorage.setItem('basicInfoFormData', JSON.stringify(data));
+ };
+
+ // 处理事项等级变化
+ const handleCaseLevelChange = (value) => {
+ const newCaseLevel = {
+ level1: value === 'level1',
+ level2: value === 'level2',
+ level3: value === 'level3',
+ };
+ setCaseLevel(newCaseLevel);
+ saveToCache({ ...getFormData(), caseLevel: newCaseLevel });
+ };
+
+ // 处理纠纷类型选择
+ const handleDisputeTypeSelect = (value) => {
+ if (value && value.length > 0) {
+ const [firstLevel, secondLevel] = value;
+ setCaseTypeFirstName(firstLevel);
+ setDisputeTypeName(secondLevel);
+ saveToCache({
+ ...getFormData(),
+ caseTypeFirstName: firstLevel,
+ disputeTypeName: secondLevel,
+ });
+ }
+ };
+
+ // 转换纠纷类型数据格式
+ const transformCaseTypeData = (data) => {
+ return data.map((item) => ({
+ label: item.label,
+ value: item.value,
+ children: item.children
+ ? item.children.map((child) => ({
+ label: child.label,
+ value: child.value,
+ }))
+ : [],
+ }));
+ };
+
+ // 处理纠纷发生地点选择
+ const handleDisputeLocationSelect = () => {
+ // 导航到地点选择器页面
+ $$.setSessionStorage('selectedLocationData', JSON.stringify(formData));
+ history.push('/gzdyh/locationPicker');
+ };
+
+ // 处理问题属地选择
+ const handleJurisdictionLocationSelect = (value) => {};
+
+ // 处理涉及人数变化
+ const handlePeopleNumChange = (value) => {
+ setPeopleNum(value);
+ saveToCache({ ...getFormData(), peopleNum: value });
+ };
+
+ // 处理涉及金额变化
+ const handleAmountChange = (value) => {
+ setAmount(value);
+ saveToCache({ ...getFormData(), amount: value });
+ };
+
+ // 处理文本变化
+ const handleTextChange = (value) => {
+ setTextValue(value);
+ saveToCache({ ...getFormData(), textValue: value });
+ };
+
+ // 处理申请文本变化
+ const handleAppTextChange = (value) => {
+ setAppTextValue(value);
+ saveToCache({ ...getFormData(), appTextValue: value });
+ };
+
+ // 处理重大矛盾纠纷状态变化
+ const handleMajorStatusChange = (status) => {
+ const newMajorStatus = { ...majorStatus, [status]: !majorStatus[status] };
+ setMajorStatus(newMajorStatus);
+ saveToCache({ ...getFormData(), majorStatus: newMajorStatus });
+ };
+
+ // 处理申请材料上传
+ const handleApplicationUpload = (file) => {
+ const newFiles = [...applicationFiles, file];
+ setApplicationFiles(newFiles);
+ saveToCache({ ...getFormData(), applicationFiles: newFiles });
+ };
+
+ // 处理证据材料上传
+ const handleEvidenceUpload = (file) => {
+ const newFiles = [...evidenceFiles, file];
+ setEvidenceFiles(newFiles);
+ saveToCache({ ...getFormData(), evidenceFiles: newFiles });
+ };
+
+ // 确保日期格式正确
+ const formatDate = (date) => {
+ if (!date) return null;
+ try {
+ // 如果是字符串，尝试转换为日期对象
+ const dateObj = typeof date === 'string' ? new Date(date) : date;
+ // 验证日期是否有效
+ if (isNaN(dateObj.getTime())) {
+ return new Date(); // 如果无效，返回当前日期
+ }
+ return dateObj;
+ } catch (e) {
+ console.error('日期格式化错误:', e);
+ return new Date();
+ }
+ };
+
+ // 获取表单数据
+ const getFormData = () => {
+ return {
+ caseLevel,
+ caseTypeFirstName,
+ disputeTypeName,
+ disputeLocationText,
+ disputeLocation,
+ selectedLocation,
+ peopleNum,
+ amount,
+ textValue,
+ appTextValue,
+ majorStatus,
+ applicationFiles,
+ evidenceFiles,
+ // occurTime,
+ };
+ };
+
+ // 指引弹窗处理函数
+ const handleGuideClick = () => {
+ setGuideVisible(true);
+ };
+
+ // 关闭指引弹窗
+ const handleGuideClose = () => {
+ setGuideVisible(false);
+ };
+
+ // 跳转到语音识别页面 - 通用方法
+ const handleVoiceRecognition = (title, callback) => {
+ // 使用URL查询参数而非state传递数据
+ // 存储回调函数类型到sessionStorage
+ const callbackType = title === '事项概况' ? 'overview' : 'application';
+ sessionStorage.setItem('voiceCallbackType', callbackType);
+
+ // 构建带查询参数的URL
+ history.push(`/gzdyh/voiceRecognition?title=${encodeURIComponent(title)}`);
+ };
+
+ // 获取地区标签
+ const getAreaLabels = (areaValues) => {
+ const areaLabels = [];
+ if (Array.isArray(areaValues)) {
+ // 递归查找多级区域的名称
+ let currentList = $$.threelocationSelectList.threelocationSelect || [];
+ areaValues.forEach((areaCode) => {
+ const found = currentList.find((item) => item.value === areaCode);
+ if (found) {
+ areaLabels.push(found.label);
+ currentList = found.children || [];
+ }
+ });
+ }
+ return areaLabels;
+ };
+
+ // 获取纠纷类型标签
+ const getCaseTypeLabels = (caseTypeValues) => {
+ const typeLabels = [];
+ if (Array.isArray(caseTypeValues)) {
+ // 递归查找多级类型的名称
+ let currentList = transformCaseTypeData($$.caseTypeList.caseTypeSelect) || [];
+ caseTypeValues.forEach((typeCode) => {
+ const found = currentList.find((item) => item.value === typeCode);
+ if (found) {
+ typeLabels.push(found.label);
+ currentList = found.children || [];
+ }
+ });
+ }
+ return typeLabels;
+ };
+
+ // 打开图片识别弹窗
+ const handlePictureButtonClick = (type) => {
+ setCurrentPictureType(type);
+ setPictureModalVisible(true);
+ };
+
+ // 关闭图片识别弹窗
+ const handlePictureModalClose = () => {
+ setPictureModalVisible(false);
+ };
+
+ // 处理图片识别来源选择
+ const handlePictureSourceSelect = (source) => {
+ // 这里实现实际的图片识别逻辑
+ console.log(`选择了${source}方式进行图片识别，当前文本区域：${currentPictureType}`);
+ setPictureModalVisible(false);
+ };
+
+ // 表单配置
+ const formConfig = [
+ {
+ list: [
+ {
+ type: 'radio',
+ label: (
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <span>事项等级</span>
+ <img
+ src={guide}
+ alt="指引"
+ style={{
+ width: '15px',
+ height: '15px',
+ marginLeft: '5px',
+ cursor: 'pointer',
+ }}
+ onClick={handleGuideClick}
+ />
+ </div>
+ ),
+ name: 'caseLevel',
+ list: $$.selectOption.caseLevelList,
+ },
+ {
+ type: 'cascader',
+ name: 'myCaseType',
+ label: '纠纷类型',
+ placeholder: '选择',
+ require: true,
+ list: transformCaseTypeData($$.caseTypeList.caseTypeSelect),
+ },
+ {
+ type: 'date',
+ name: 'occurTime',
+ label: '纠纷发生时间',
+ placeholder: '选择',
+ require: true,
+ format: 'YYYY-MM-DD HH:mm',
+ },
+ {
+ type: 'navigation',
+ name: 'addr',
+ label: '纠纷发生地点',
+ placeholder: '选择',
+ require: true,
+ onClick: handleDisputeLocationSelect,
+ },
+ {
+ type: 'cascader',
+ name: 'que',
+ label: '问题属地',
+ placeholder: '选择',
+ require: true,
+ cols: 2,
+ list: $$.threelocationSelectList.threelocationSelect,
+ },
+ {
+ type: 'text',
+ name: 'peopleNum',
+ label: '涉及人数（人）',
+ placeholder: '请填写',
+ },
+ {
+ type: 'text',
+ name: 'amount',
+ label: '涉及金额（元）',
+ placeholder: '请填写',
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'textarea',
+ name: 'caseDes',
+ label: '事项概况',
+ placeholder: '请完整描述事项概况，应具备5要素：发生时间+发生地点+人物情况+事项起因+事项经过',
+ require: true,
+ tabs: 5,
+ customActions: (
+ <div className="overview-button-area">
+ <div className="word-count">
+ <div className="count-wrapper">
+ <span className="current-count" style={{ color: overviewCounter.isExceeded ? '#F53F3F' : 'inherit' }}>
+ {charCount}
+ </span>
+ <span className="total-count" style={{ color: overviewCounter.isExceeded ? '#F53F3F' : 'inherit' }}>
+ /{MAX_LENGTH} 字
+ </span>
+ </div>
+ </div>
+ <div className="overview-actions">
+ <Button className="action-button picture-button" onClick={() => handlePictureButtonClick('overview')}>
+ <div className="action-icon">
+ <img src={caseDesPicture} alt="图片识别" />
+ </div>
+ <div className="action-text">图片识别</div>
+ </Button>
+ <div className="action-button-split">|</div>
+ <Button className="action-button voice-button" onClick={() => handleVoiceRecognition('事项概况', handleTextChange)}>
+ <div className="action-icon">
+ <img src={caseDesVoice} alt="语音识别" />
+ </div>
+ <div className="action-text">语音识别</div>
+ </Button>
+ </div>
+ </div>
+ ),
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'textarea',
+ name: 'caseClaim',
+ label: '事项申请',
+ placeholder: '希望相关部门如何处理，建议分条描述，如请求1，请求2...',
+ require: true,
+ value: appTextValue,
+ tabs: 5,
+ customActions: (
+ <div className="overview-button-area">
+ <div className="word-count">
+ <div className="count-wrapper">
+ <span className="current-count" style={{ color: applicationCounter.isExceeded ? '#F53F3F' : 'inherit' }}>
+ {appCharCount}
+ </span>
+ <span className="total-count" style={{ color: applicationCounter.isExceeded ? '#F53F3F' : 'inherit' }}>
+ /{APP_MAX_LENGTH} 字
+ </span>
+ </div>
+ </div>
+ <div className="overview-actions">
+ <Button className="action-button picture-button" onClick={() => handlePictureButtonClick('application')}>
+ <div className="action-icon">
+ <img src={caseDesPicture} alt="图片识别" />
+ </div>
+ <div className="action-text">图片识别</div>
+ </Button>
+ <div className="action-button-split">|</div>
+ <Button className="action-button voice-button" onClick={() => handleVoiceRecognition('事项申请', handleAppTextChange)}>
+ <div className="action-icon">
+ <img src={caseDesVoice} alt="语音识别" />
+ </div>
+ <div className="action-text">语音识别</div>
+ </Button>
+ </div>
+ </div>
+ ),
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'radio',
+ name: 'majorStatus',
+ label: (
+ <div className="major-dispute-label">
+ <img src={riskMask} alt="风险标识" className="risk-icon" />
+ <span className="major-dispute-text">是否重大矛盾纠纷</span>
+ </div>
+ ),
+ list: [
+ { value: 0, label: '否' },
+ { value: 1, label: '是' },
+ ],
+ },
+ ],
+ },
+ ];
+
+ // 处理表单值变化
+ const handleFormChange = (values, name) => {
+ console.log('表单值变化:', values, name);
+ // 处理时间数据
+ let formattedValues = {
+ ...values,
+ occurTime: values.occurTime ? new Date(values.occurTime) : formData.occurTime,
+ };
+
+ // 在这里处理问题属地信息
+ if (values?.que && values.que.length >= 2) {
+ const areaLabels = getAreaLabels(values.que);
+ formattedValues = {
+ ...formattedValues,
+ queArea: values.que[0],
+ queAreaName: areaLabels[0],
+ queRoad: values.que[1],
+ queRoadName: areaLabels[1],
+ };
+ }
+
+ // 处理纠纷类型
+ if (values?.myCaseType && values.myCaseType.length >= 2) {
+ const typeLabels = getCaseTypeLabels(values.myCaseType);
+ formattedValues = {
+ ...formattedValues,
+ caseType: values.myCaseType[1], // 二级类型值作为caseType
+ caseTypeFirst: values.myCaseType[0], // 一级类型值
+ caseTypeName: typeLabels[1] || '', // 二级类型名称
+ caseTypeFirstName: typeLabels[0] || '', // 一级类型名称
+ };
+ }
+
+ onGuideClick(formattedValues, name);
+ setFormData({ ...formData, ...formattedValues });
+ };
+
+ return (
+ <>
+ <CustomFormView formConfig={formConfig} formData={formData} onChange={handleFormChange} />
+
+ <div className="audit-section">
+ {/* <DingUpload
+ title="附件材料"
+ subtitle="可添加上报申请相关附件"
+ fileList={applicationFiles}
+ mainId={caseId}
+ ownerId={reportForm?.id || ''}
+ ownerType="22_00018-512"
+ multiple={true}
+ maxCount={9}
+ /> */}
+ </div>
+
+ {/* 图片识别弹窗 */}
+ <Modal visible={pictureModalVisible} onClose={handlePictureModalClose} className="picture-recognition-modal" maskClosable={true}>
+ <div className="picture-modal-content">
+ <div className="picture-modal-intro">
+ <div className="picture-modal-title">识别图片</div>
+ <div className="picture-modal-desc">仅支持图片，请选择图片来源</div>
+ </div>
+ <div className="picture-modal-options">
+ <div className="picture-modal-option" onClick={() => handlePictureSourceSelect('相册')}>
+ 手机相册
+ </div>
+ <div className="picture-modal-option" onClick={() => handlePictureSourceSelect('拍照')}>
+ 拍照上传
+ </div>
+ </div>
+ <div className="picture-modal-cancel" onClick={handlePictureModalClose}>
+ 取消操作
+ </div>
+ </div>
+ </Modal>
+
+ {/* 事项等级指引弹窗 */}
+ <Drawer
+ visible={guideVisible}
+ onClose={handleGuideClose}
+ className="guide-drawer"
+ placement="bottom"
+ height="auto"
+ contentStyle={{ padding: '0' }}
+ header={null}
+ >
+ <div className="guide-content" style={{ textAlign: 'left', padding: '16px' }}>
+ <div style={{ fontSize: '16px', fontWeight: 500, marginBottom: '16px' }}>
+ 事项等级<span style={{ color: '#1A6FB8' }}>-指引</span>
+ </div>
+ <span style={{ display: 'block', marginBottom: '12px', fontSize: '16px', fontWeight: 500 }}>一级重点事件</span>
+ <p style={{ marginBottom: '8px', fontSize: '14px', lineHeight: '1.5' }}>
+ 1、5人（含5人）以上到非接待场所聚集、滞留、静坐、游行或准备上访；
+ </p>
+ <p style={{ marginBottom: '8px', fontSize: '14px', lineHeight: '1.5' }}>
+ 2、拉横幅、穿着"状衣"、呼喊口号、呼喊标语、堵塞交通非法占据公共场所、扰乱公共秩序、向他人散发传单等上访材料；
+ </p>
+ <p style={{ marginBottom: '8px', fontSize: '14px', lineHeight: '1.5' }}>3、拖欠工资、劳资纠纷涉及人数5人以上；</p>
+ <p style={{ marginBottom: '8px', fontSize: '14px', lineHeight: '1.5' }}>4、拖欠工资总金额5万元以上，经济合同外涉金额20万元以上；</p>
+ <p style={{ marginBottom: '8px', fontSize: '14px', lineHeight: '1.5' }}>5、扬言到市赴省进京越级上访；</p>
+ </div>
+ </Drawer>
+ </>
+ );
+};
+
+export default BasicInfoForm;
diff --git a/src/views/selfInspection/components/BasicInfoForm/index.less b/src/views/selfInspection/components/BasicInfoForm/index.less
new file mode 100644
index 0000000..d55df5a
--- /dev/null
+++ b/src/views/selfInspection/components/BasicInfoForm/index.less
@@ -0,0 +1,682 @@
+.dtm-list-item{
+ min-height: 47px;
+}
+.dtm-list-line{
+ padding-top: 0px;
+ padding-bottom: 0px;
+}
+/** 基本信息选择样式 */
+.case-basic-info {
+ > .block-content {
+ > .dtm-list-item .basic-form-item{
+ min-height: 47px;
+ height: 47px;
+ > .dtm-list-line {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+
+ > .dtm-list-content {
+ flex: 3; // 占比为3
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ >.dtm-list-brief{
+ height: 0px;
+ }
+ >.dtm-form-item-default{
+ >.dtm-form-item-default-label {
+ // width: 60px;
+ height: 23px;
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: LEFT;
+ color: #171a1d;
+ line-height: 23px;
+ .dtm-select-placeholder{
+ // width: 30px;
+ height: 23px;
+ // background: rgba(23,26,29,0.40);
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: RIGHT;
+ color: rgba(23,26,29,0.40);
+ line-height: 23px;
+ }
+ }
+ }
+ }
+
+ > .dtm-list-brief {
+ flex: 1; // 占比为1
+ text-align: right;
+ margin-left: 8px;
+ color: #86909C;
+ font-size: 14px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ }
+ }
+ .dispute-time-item{
+ .dtm-date-picker-form-inner-node-content{
+ font-size: 15px;
+ }
+ }
+
+ /* 涉及人数和涉及金额输入框样式 */
+ .involved-people-item, .involved-amount-item {
+ padding: 12px 16px;
+ .dtm-list-line{
+ padding: 0px;
+ height: 50px;
+ }
+ }
+
+ /* 事项等级样式 */
+ .item-level-item {
+ .dtm-form-item-default{
+ >.dtm-form-item-default-label{
+ width: 50%;
+ flex: 0 0 30%;
+ }
+ >.dtm-form-item-default-field{
+ width: 50%;
+ flex: 0 70%;
+ }
+ }
+
+ // 覆盖Checkbox组件默认样式
+ .dtm-checkbox-wrapper {
+ margin-right: 16px;
+
+ .dtm-checkbox-checked .dtm-checkbox-inner {
+ border-color: #1a6fb8;
+ background-color: #1a6fb8;
+ }
+
+ .dtm-checkbox-inner {
+ border-color: #1a6fb8;
+ }
+ }
+ }
+ > .dtm-list-brief{
+ height: 0px;
+ }
+ }
+}
+
+/* 问题属地选择器样式 */
+.jurisdiction-location-item{
+ > .dtm-list-line{
+ > .dtm-list-content{
+ > .dtm-form-item-default{
+ > .dtm-form-item-default-field{
+ > div{
+ >.dtm-list-item{
+ > .dtm-list-line {
+ display: flex;
+ justify-content: flex-end;
+ padding: 0px;
+ > .dtm-list-extra{
+ font-size: 15px !important;
+ height: 23px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: RIGHT;
+ color: rgba(23,26,29,0.40)!important;
+ line-height: 23px !important;
+
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+
+
+/** 事项概况区块样式 */
+.case-overview, .case-application {
+ position: relative;
+ height: 179px;
+ background: #fff;
+
+ #caseOverview, #applicationText{
+ height: 100%;
+ }
+ .dtm-textarea-item-desktop{
+ padding: 0px;
+ border: 0px;
+ }
+
+ >.block-content {
+ // height: 143px;
+ padding: 16px;
+ padding-bottom: 0;
+ >.overview-form-item{
+ >.case-overview-item{
+ >.dtm-list-line{
+ padding-top: 12px;
+ }
+ }
+ }
+ >.application-form-item{
+ >.application-text-item{
+ >.dtm-list-line{
+ padding-top: 12px;
+ }
+ }
+ }
+ .dtm-textarea-item-control{
+ // height: 100px;
+ margin-bottom: 8px;
+ }
+ .dtm-list-brief{
+ padding-bottom: 0px;
+ }
+ // 隐藏组件自带的计数器，使用自定义计数器显示
+ .dtm-textarea-item-count{
+ left: 0px;
+ height: 0px;
+ }
+ .dtm-form-item-help{
+ margin-top: 0px;
+ padding-top: 0px;
+ height: 0px;
+ }
+ }
+
+ .overview-button-area {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0;
+ background-color: #ffffff;
+ // border-top: 1px solid #ebedf0;
+ z-index: 10; // 确保按钮区域在上层
+
+ .word-count {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+ font-size: 12px;
+ color: #86909c;
+ width: 183px;
+ // width: 50%;
+ height: 100%;
+ padding-left: 16px;
+
+ .count-wrapper {
+ display: flex;
+ align-items: center;
+ }
+
+ .current-count {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+
+ .total-count {
+ margin-left: 2px;
+ }
+ }
+
+ .overview-actions {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ width: 192px;
+ // width: 50%;
+ height: 100%;
+ background: rgba(182,221,241,0.46);
+ border-top-left-radius: 18px;
+
+ .action-button {
+ height: 100%;
+ padding: 0 8px;
+ font-size: 12px;
+ color: #1A6FB8;
+ background: transparent;
+ border-color: #1A6FB8;
+ border-radius: 4px;
+ margin: 0px;
+ display: flex;
+ align-items: center;
+ flex-direction: row;
+ justify-content: flex-start;
+ padding: 7px 12px;
+ width: 100%;
+ box-sizing: border-box;
+
+ .action-icon {
+ display: inline-block;
+ vertical-align: middle;
+ margin: 4 0px;
+ margin-right: 4px;
+
+ img {
+ width: 11px;
+ height: 11px;
+ display: block;
+ }
+ }
+
+ .action-text {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ line-height: 22px;
+ }
+ }
+
+ .action-button-split{
+ color: #b6ddf1;
+ width: 1px;
+ }
+ }
+ }
+}
+
+/** 重大矛盾纠纷区块样式 */
+.case-major-dispute {
+ position: relative;
+ height: auto;
+ background: #fff;
+ .dtm-form-item-default{
+ >.dtm-form-item-default-label{
+ width: 50%;
+ flex: 0 0 50%;
+ }
+ >.dtm-form-item-default-field{
+ width: 50%;
+ flex: 0 1 50%;
+ }
+ }
+
+ /* 重大矛盾纠纷标签样式 */
+ .major-dispute-label {
+ display: flex;
+ align-items: center;
+
+ .risk-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 6px;
+ }
+
+ .major-dispute-text {
+ color: #F53F3F;
+ font-weight: 500;
+ }
+ }
+
+ // 覆盖Radio组件默认样式
+ .major-dispute-radio-group {
+ .dtm-radio-inner {
+ border-color: #1a6fb8;
+ }
+
+ .dtm-radio-checked .dtm-radio-inner {
+ border-color: #1a6fb8;
+ background-color: #1a6fb8;
+ }
+ }
+}
+
+.flex-center(@axis: both) {
+ display: flex;
+ justify-content: center; // 水平居中
+ align-items: center; // 垂直居中
+ flex-direction: @axis; // 可选参数，调整主轴方向
+}
+
+/* 申请材料和证据材料区块样式 */
+.case-application-materials{
+ min-height: 74px;
+}
+.case-evidence-materials{
+ min-height: 95px;
+}
+.case-application-materials, .case-evidence-materials {
+
+ margin-bottom: 8px;
+ padding-right: 16px;
+ /* 说明文本样式 */
+ .materials-description {
+ padding: 0 16px;
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 14px;
+ // margin-top: -8px;
+ margin-bottom: 12px;
+ }
+ .upload-form-item{
+ margin-bottom: 0px !important;
+ }
+
+ > .dtm-list-item{
+ padding-top: 12px;
+ padding-bottom: 4px;
+ min-height: 0px;
+ > .dtm-list-line {
+ min-height: 0px;
+ padding: 0px;
+ > .dtm-list-content{
+ > .dtm-form-item-default{
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ padding-right: 16px;
+
+ > .dtm-form-item-default-label{
+ flex: 3;
+ width: 100%;
+ min-width: 0;
+ padding-right: 12px;
+ word-break: break-word;
+ white-space: normal;
+ }
+ > .dtm-form-item-default-field{
+ flex: 1;
+ /* 上传容器样式 */
+ > .upload-container {
+ /* 上传按钮容器样式 */
+ .upload-button-container {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ justify-content: flex-end;
+ .dtm-upload{
+ justify-content: flex-end;
+ display: flex;
+ .dtm-list-item{
+ min-height: 0px;
+ .dtm-list-line{
+ padding: 0%;
+ min-height: 0px;
+ padding-right: 0;
+ .dd-icon{
+ .flex-center();
+ }
+ }
+ }
+ }
+ .dtm-divider{
+ width: 0px;
+ min-width: 0;
+ height: 0px;
+ margin: 0px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ /* 文件列表区域样式 */
+ .file-list {
+ // padding: 0 16px;
+ padding: 0px;
+ padding-left: 16px;
+
+ /* 单个文件项样式 */
+ .file-item {
+ display: flex;
+ align-items: center;
+ padding: 13px 0;
+
+ /* 文件图标样式 */
+ .file-icon {
+ width: 42px;
+ height: 48px;
+ margin-right: 16px;
+ }
+
+ /* 文件信息区域样式 */
+ .file-info {
+ flex: 1;
+ min-width: 0;
+
+ /* 文件名称样式 */
+ .file-name {
+ font-size: 14px;
+ color: #171a1d;
+ line-height: 20px;
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ /* 文件大小和预览区域样式 */
+ .file-size-preview {
+ display: flex;
+ align-items: center;
+ font-size: 12px;
+ line-height: 17px;
+
+ /* 文件大小样式 */
+ .file-size {
+ color: rgba(23, 26, 29, 0.6);
+ margin-right: 4px;
+ }
+
+ /* 预览文本样式 */
+ .preview-text {
+ color: #1a6fb8;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+
+ /* 文件操作区域样式 */
+ .file-actions {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 12px;
+ height: 100%;
+
+ /* 删除按钮包装器样式 */
+ .delete-btn-wrapper {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ height: 100%;
+
+ /* 删除图标样式 */
+ .delete-icon {
+ width: 16px;
+ height: 16px;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+
+// /* 选择器高度统一样式 */
+// .selector-height {
+// height: 23px;
+// }
+
+/* 指引弹窗样式 */
+.guide-modal {
+ width: 100%;
+ position: fixed;
+ bottom: 0;
+ height: 330px;
+}
+
+/* 图片识别弹窗样式 */
+.picture-recognition-modal {
+ width: 270px;
+ .dtm-modal-root {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .dtm-modal-wrap {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .dtm-modal-content {
+ width: 270px !important;
+ height: 222px;
+ border-radius: 8px;
+ background: #ffffff;
+ padding: 0;
+ overflow: hidden;
+ .dtm-modal-body{
+ padding: 0px;
+ }
+
+ .picture-modal-content {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ text-align: center;
+
+ .picture-modal-intro {
+ height: 89px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ padding: 20px 16px;
+ border-bottom: 1px solid #f0f0f0;
+
+ .picture-modal-title {
+ font-size: 17px;
+ font-weight: 500;
+ color: #1D2129;
+ line-height: 24px;
+ margin-bottom: 4px;
+ }
+
+ .picture-modal-desc {
+ font-size: 15px;
+ color: #4E5969;
+ line-height: 22px;
+ }
+ }
+
+ .picture-modal-options {
+ display: flex;
+ flex-direction: column;
+
+ .picture-modal-option {
+ height: 43px;
+ line-height: 43px;
+ font-size: 16px;
+ color: #1A6FB8;
+ cursor: pointer;
+ border-bottom: 1px solid #f0f0f0;
+
+ &:active {
+ background-color: rgba(0,0,0,0.05);
+ }
+ }
+ }
+
+ .picture-modal-cancel {
+ height: 44px;
+ line-height: 44px;
+ font-size: 16px;
+ color: #171A1D;
+ cursor: pointer;
+ border-bottom: 1px solid #f0f0f0;
+
+ &:active {
+ background-color: rgba(0,0,0,0.05);
+ }
+ }
+ }
+ }
+}
+
+/* 纠纷发生地点选择器样式 */
+.dispute-location-item {
+ padding-right: 16px;
+ .location-selector {
+ width: 100%;
+ cursor: pointer;
+ }
+ >.dtm-list-line{
+ padding: 0px;
+ }
+}
+
+/* 纠纷类型选择器样式 */
+.dispute-type-item {
+ padding-right: 16px;
+ .location-selector {
+ width: 100%;
+ cursor: pointer;
+ }
+ >.dtm-list-line{
+ padding: 0px;
+ }
+}
+
+/* 自定义选择器样式 */
+.custom-selector {
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ padding: 0px;
+ height: 40px;
+ // border: 1px solid #E4E8EB;
+ border-radius: 4px;
+ // background-color: #F5F7FA;
+ width: 100%;
+ position: relative;
+}
+
+.selector-placeholder {
+// color: #8E8E93;
+ color: rgba(23,26,29,0.40);
+ font-size: 15px;
+ margin-right: 8px;
+ max-width: 130px; // 限制最大宽度
+ white-space: nowrap; // 不换行
+ overflow: hidden; // 隐藏溢出部分
+ text-overflow: ellipsis; // 使用省略号
+ display: inline-block; // 确保省略号正常工作
+}
+
+.selector-arrow {
+ color: #8E8E93;
+ font-size: 12px;
+ width: 16px;
+ height: 16px;
+ .dt__icon{
+ width: 16px;
+ height: 16px;
+ }
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/components/CaseSubmitService/index.js b/src/views/selfInspection/components/CaseSubmitService/index.js
new file mode 100644
index 0000000..0e870fa
--- /dev/null
+++ b/src/views/selfInspection/components/CaseSubmitService/index.js
@@ -0,0 +1,142 @@
+import * as $$ from '../../../../utils/utility';
+
+/**
+ * 验证并填充案件数据，确保所有必要参数都存在
+ * @param {Object} data - 原始案件数据
+ * @returns {Object} - 填充后的案件数据
+ */
+export const validateAndFillCaseData = (data) => {
+ // 创建一个新对象，避免修改原始数据
+ const result = { ...data };
+
+ // 检查案件ID，这是最重要的
+ if (!result.id) {
+ // 尝试从sessionStorage获取
+ const newCaseId = sessionStorage.getItem('newCaseId');
+ if (newCaseId) {
+ result.id = newCaseId;
+ console.log('从sessionStorage获取案件ID:', newCaseId);
+ } else {
+ // 如果没有，生成一个本地ID
+ result.id = $$.getBusinessId();
+ console.warn('未找到案件ID，使用本地生成的ID:', result.id);
+ }
+ }
+
+ // 设置基本信息默认值
+ const defaultValues = {
+ caseLevel: result.caseLevel || "3", // 默认三级
+ peopleNum: result.peopleNum || 1, // 默认1人
+ occurTime: result.occurTime || $$.timeFormat(new Date()), // 当前时间
+ majorStatus: typeof result.majorStatus === 'number' ? result.majorStatus : 0, // 默认非重大案件
+ amount: result.amount || 0, // 默认金额0
+ caseTypeFirst: result.caseTypeFirst || "",
+ caseTypeFirstName: result.caseTypeFirstName || "",
+ caseType: result.caseType || "",
+ caseTypeName: result.caseTypeName || "",
+ queArea: result.queArea || "",
+ queAreaName: result.queAreaName || "",
+ queRoad: result.queRoad || "",
+ queRoadName: result.queRoadName || "",
+ caseDes: result.caseDes || "",
+ caseClaim: result.caseClaim || "",
+ addr: result.addr || "",
+ fileInfoList: result.fileInfoList || [],
+ personList: result.personList || [],
+ agentList: result.agentList || [],
+ isSelfAccept: typeof result.isSelfAccept === 'number' ? result.isSelfAccept : 0,
+ isDraft: typeof result.isDraft === 'number' ? result.isDraft : 0,
+ operateType: typeof result.operateType === 'number' ? result.operateType : 0,
+ canal: result.canal || "22_00001-3", // 默认自行排查
+ canalName: result.canalName || "自行排查" // 默认自行排查
+ };
+
+ // 将默认值应用到结果对象上
+ Object.keys(defaultValues).forEach(key => {
+ result[key] = result[key] || defaultValues[key];
+ });
+
+ // 检查personList中的每个人是否有id
+ if (result.personList && result.personList.length > 0) {
+ result.personList = result.personList.map(person => {
+ if (!person.id) {
+ return {
+ ...person,
+ id: $$.getBusinessId()
+ };
+ }
+ return person;
+ });
+ }
+
+ // 如果personList为空，添加一个默认的申请方当事人
+ if (!result.personList || result.personList.length === 0) {
+ result.personList = [{
+ extreme: 0,
+ nation: "09_00005-1",
+ nationName: "汉族",
+ sex: "09_00003-1",
+ sexName: "男",
+ trueName: "默认申请人",
+ perType: "15_020008-1",
+ perClass: "09_01001-1",
+ perTypeName: "申请方当事人",
+ perClassName: "自然人",
+ id: $$.getBusinessId()
+ }];
+ }
+
+ console.log('验证并填充后的案件数据:', result);
+ return result;
+};
+
+/**
+ * 案件登记提交
+ * @param {Object} submitData - 提交的表单数据
+ * @returns {Promise} - 请求的Promise对象
+ */
+export const submitCaseRegister = (submitData) => {
+ return $$.ax.request({
+ url: 'caseInfo/caseRegister',
+ type: 'post',
+ data: submitData,
+ service: 'mediate'
+ });
+};
+
+/**
+ * 自行受理案件
+ * @param {Object} data - 案件数据
+ * @returns {Promise} - 请求的Promise对象
+ */
+export const selfAcceptCase = (data) => {
+ // 验证并填充案件数据
+ const validatedData = validateAndFillCaseData(data);
+
+ // 生产环境调用真实API
+ return submitCaseRegister({
+ ...validatedData,
+ isSelfAccept: 1, // 表示自行受理
+ isDraft: 0, // 非草稿状态
+ operateType: 0, // 操作类型
+ });
+};
+
+/**
+ * 提交正式案件
+ * @param {Object} data - 案件数据
+ * @returns {Promise} - 请求的Promise对象
+ */
+export const submitFormalCase = (data) => {
+ // 验证并填充案件数据
+ const validatedData = validateAndFillCaseData(data);
+
+ // 生产环境调用真实API
+ return submitCaseRegister({
+ ...validatedData,
+ isSelfAccept: 0, // 表示提交
+ isDraft: 0, // 非草稿状态
+ operateType: 0, // 操作类型
+ });
+};
+
diff --git a/src/views/selfInspection/components/CaseSubmitService/service.js b/src/views/selfInspection/components/CaseSubmitService/service.js
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/views/selfInspection/components/CaseSubmitService/service.js
diff --git a/src/views/selfInspection/components/CharacterCounter/index.jsx b/src/views/selfInspection/components/CharacterCounter/index.jsx
new file mode 100644
index 0000000..5832d0f
--- /dev/null
+++ b/src/views/selfInspection/components/CharacterCounter/index.jsx
@@ -0,0 +1,90 @@
+import React from 'react';
+
+/**
+ * CharacterCounter - 字符计数逻辑组件
+ * 只处理字符计数逻辑，不包含任何样式
+ *
+ * @param {string} value - 要计数的文本值
+ * @param {number} maxLength - 允许的最大字符数
+ * @param {function} onChange - 文本变化时的回调函数
+ * @param {function} onCountChange - 字符数量变化时的回调函数
+ * @param {function} setFormValue - 设置表单值的函数
+ * @param {string} formFieldName - 表单字段名
+ * @returns {Object} - 返回字符数相关的数据和更新方法
+ */
+const useCharacterCounter = (props) => {
+ const {
+ value,
+ maxLength,
+ onChange,
+ onCountChange,
+ setFormValue,
+ formFieldName
+ } = props;
+
+ // 计算字符数的函数（中文占2个，其他占1个）
+ const countCharacters = (str) => {
+ if (!str) return 0;
+ let count = 0;
+ for (let i = 0; i < str.length; i++) {
+ const char = str.charCodeAt(i);
+ if (char >= 0x4e00 && char <= 0x9fa5) {
+ count += 1; // 中文占1个字符（基于客户需求调整）
+ } else {
+ count += 1; // 其他字符占1个字符
+ }
+ }
+ return count;
+ };
+
+ // 处理文本变化
+ const handleTextChange = (textValue) => {
+ if (typeof textValue === 'string') { // 允许空字符串通过验证
+ const count = countCharacters(textValue);
+ const isExceeded = count > maxLength;
+
+ // 更新文本值 - 即使超出也更新文本，但返回超出标记
+ if (onChange) {
+ onChange(textValue);
+ }
+
+ // 更新字符计数 - 即使超出也更新计数
+ if (onCountChange) {
+ onCountChange(count);
+ }
+
+ // 更新表单值
+ if (setFormValue && formFieldName) {
+ setFormValue({ [formFieldName]: textValue });
+ }
+
+ // 返回结果包含超出标记
+ return {
+ success: !isExceeded,
+ isExceeded,
+ count
+ };
+ }
+ return {
+ success: false,
+ isExceeded: false,
+ count: 0
+ };
+ };
+
+ // 检查当前是否超出字数限制
+ const checkIsExceeded = () => {
+ const count = countCharacters(value);
+ return count > maxLength;
+ };
+
+ return {
+ countCharacters,
+ handleTextChange,
+ currentCount: countCharacters(value),
+ maxLength,
+ isExceeded: checkIsExceeded()
+ };
+};
+
+export default useCharacterCounter;
\ No newline at end of file
diff --git a/src/views/selfInspection/components/CharacterCounter/index.less b/src/views/selfInspection/components/CharacterCounter/index.less
new file mode 100644
index 0000000..f9aa5c9
--- /dev/null
+++ b/src/views/selfInspection/components/CharacterCounter/index.less
@@ -0,0 +1,118 @@
+.character-counter {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+
+ .textarea-container {
+ flex: 1;
+ width: 100%;
+ min-height: 100px;
+
+ .dtm-textarea-item-control {
+ height: 100%;
+ margin-bottom: 8px;
+ }
+
+ // 隐藏组件自带的计数器，使用自定义计数器显示
+ .dtm-textarea-item-count {
+ left: 0px;
+ height: 0px;
+ }
+
+ .dtm-form-item-help {
+ margin-top: 0px;
+ padding-top: 0px;
+ height: 0px;
+ }
+ }
+
+ .counter-footer {
+ position: relative;
+ height: 36px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0;
+ background-color: #ffffff;
+ z-index: 10; // 确保按钮区域在上层
+
+ .word-count {
+ display: flex;
+ align-items: center;
+ justify-content: flex-start;
+ font-size: 12px;
+ color: #86909c;
+ width: 183px;
+ height: 100%;
+ padding-left: 16px;
+
+ .count-wrapper {
+ display: flex;
+ align-items: center;
+ }
+
+ .current-count {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+
+ .total-count {
+ margin-left: 2px;
+ }
+ }
+
+ .action-buttons {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ width: 192px;
+ height: 100%;
+ background: rgba(182,221,241,0.46);
+ border-top-left-radius: 18px;
+
+ .action-button {
+ height: 100%;
+ padding: 0 8px;
+ font-size: 12px;
+ color: #1A6FB8;
+ background: transparent;
+ border-color: #1A6FB8;
+ border-radius: 4px;
+ margin: 0px;
+ display: flex;
+ align-items: center;
+ flex-direction: row;
+ justify-content: flex-start;
+ padding: 7px 12px;
+ width: 100%;
+ box-sizing: border-box;
+
+ .action-icon {
+ display: inline-block;
+ vertical-align: middle;
+ margin: 4 0px;
+ margin-right: 4px;
+
+ img {
+ width: 11px;
+ height: 11px;
+ display: block;
+ }
+ }
+
+ .action-text {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ line-height: 22px;
+ }
+ }
+
+ .action-button-split {
+ color: #b6ddf1;
+ width: 1px;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/components/DingUpload/index.jsx b/src/views/selfInspection/components/DingUpload/index.jsx
new file mode 100644
index 0000000..b819240
--- /dev/null
+++ b/src/views/selfInspection/components/DingUpload/index.jsx
@@ -0,0 +1,172 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 17:30:00
+ * @LastEditTime: 2025-04-14 18:05:37
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 通用附件上传查看组件
+ */
+import React, { useState, useEffect } from 'react';
+import { Upload, Modal } from 'dingtalk-design-mobile';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+const appUrl = $$.appUrl;
+
+/**
+ * 通用附件上传查看组件
+ * @param {Object} props 组件属性
+ * @param {Array} props.fileList 文件列表
+ * @param {Function} props.onChange 文件列表变化回调
+ * @param {String} props.mainId 主ID，用于上传接口
+ * @param {String} props.ownerId 文件所属ID，用于上传接口
+ * @param {String} props.ownerType 文件所属类型，用于上传接口
+ * @param {String} props.title 标题
+ * @param {Boolean} props.disabled 是否禁用上传功能
+ * @param {Boolean} props.viewOnly 是否只查看模式（不显示上传和删除）
+ * @param {String} props.subtitle 副标题
+ * @param {String} props.accept 接受的文件类型
+ * @param {String} props.tipText 提示文本
+ * @param {String} props.btnText 按钮文本
+ * @returns {JSX.Element}
+ */
+const DingUpload = ({
+ fileList = [],
+ onChange,
+ mainId = '',
+ ownerId = '',
+ ownerType = '',
+ title = '附件材料',
+ disabled = false,
+ viewOnly = false,
+ subtitle = '',
+ accept = '*',
+ tipText = '支持扩展名：.rar .zip .doc .docx .pdf .jpg，30M以内',
+ btnText = '上传文件',
+}) => {
+ const [files, setFiles] = useState([]);
+ const [imageVisible, setImageVisible] = useState(false);
+ const [previewImage, setPreviewImage] = useState('');
+
+ useEffect(() => {
+ setFiles(fileList);
+ }, [fileList]);
+
+ // 处理文件列表变化
+ const handleChange = (info) => {
+ setFiles(info.fileList);
+ if (onChange) {
+ onChange(info);
+ }
+
+ // 处理上传状态变化
+ if (info?.file?.status === 'done') {
+ $$.showToast({ content: '上传成功' });
+ } else if (info?.file?.status === 'error') {
+ $$.showToast({ content: '抱歉! 网络错误' });
+ }
+ };
+
+ // 预览文件
+ const handlePreview = async (file) => {
+ console.log('file', file);
+ // 如果是图片类型，则打开图片预览
+ if (file.type && file.type.startsWith('image/')) {
+ let src = '';
+ if (file.url) {
+ src = file.url;
+ } else if (file.response && file.response.data && file.response.data[0] && file.response.data[0].showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.response.data[0].showUrl}`;
+ } else if (file.showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ }
+ window.open(src);
+ // setPreviewImage(src);
+ // setImageVisible(true);
+ } else {
+ // 其他类型文件，通过URL打开
+ let src = '';
+ if (file.url) {
+ src = file.url;
+ } else if (file.response && file.response.data && file.response.data && file.response.data[0] && file.response.data[0].showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.response.data[0].showUrl}`;
+ } else if (file.showUrl) {
+ src = `${appUrl.fileUrl}/${appUrl.sys}/${file.showUrl}`;
+ }
+
+ window.open(src);
+ }
+ };
+
+ // 删除文件
+ const handleRemove = async (file) => {
+ // 需要调用删除接口
+ try {
+ if (file.id || (file.response && file.response.data && file.response.data[0] && file.response.data[0].id)) {
+ const fileId = file.id || file.response.data[0].id;
+ const res = await $$.ax.request({
+ url: `fileInfo/deleteFileById`,
+ type: 'get',
+ data: { id: fileId },
+ service: 'sys',
+ });
+
+ if (res.type) {
+ $$.showToast({ content: '删除成功' });
+ } else {
+ $$.showToast({ content: '删除失败' });
+ return false; // 阻止删除操作
+ }
+ }
+ return true;
+ } catch (error) {
+ $$.showToast({ content: '删除失败' });
+ return false; // 阻止删除操作
+ }
+ };
+
+ return (
+ <div className="lagalPerson-ding-upload-container">
+ {viewOnly && (
+ <div className="ding-upload-label">
+ <div className="ding-upload-title">{title}</div>
+ <div className="ding-upload-subtitle">{subtitle}</div>
+ </div>
+ )}
+ <Upload
+ label={
+ <div className="ding-upload-label">
+ <div className="ding-upload-title">{title}</div>
+ <div className="ding-upload-subtitle">{subtitle}</div>
+ </div>
+ }
+ onPreview={handlePreview}
+ fileList={files}
+ type="form-upload"
+ accept={accept}
+ previewContent="预览"
+ action={`${appUrl.fileUrl}/${appUrl.sys}/api/web/fileInfo/upload?mainId=${mainId}&ownerId=${ownerId}&ownerType=${ownerType}`}
+ headers={{ Authorization: $$.getSessionStorage('customerSystemToken') }}
+ onChange={handleChange}
+ disabled={disabled || viewOnly}
+ onRemove={viewOnly ? null : handleRemove}
+ showUploadList={{
+ showRemoveIcon: !viewOnly,
+ showUploadBtn: !viewOnly,
+ }}
+ uploadLabel={tipText}
+ uploadBtnLabel={btnText}
+ className={viewOnly ? 'ding-upload-preview-only' : ''}
+ />
+
+ <Modal visible={imageVisible} onClose={() => setImageVisible(false)} className="ding-upload-image-preview">
+ <div className="ding-upload-image-wrapper">
+ <img src={previewImage} alt="预览图片" />
+ </div>
+ </Modal>
+ </div>
+ );
+};
+
+export default DingUpload;
diff --git a/src/views/selfInspection/components/DingUpload/index.less b/src/views/selfInspection/components/DingUpload/index.less
new file mode 100644
index 0000000..3885a2a
--- /dev/null
+++ b/src/views/selfInspection/components/DingUpload/index.less
@@ -0,0 +1,114 @@
+/*
+ * @Company: hugeInfo
+ * @Author: lwh
+ * @Date: 2025-04-10 17:30:00
+ * @LastEditTime: 2025-04-14 16:44:32
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 通用附件上传查看组件样式
+ */
+
+.legalPerson-ding-upload-container {
+ width: 100%;
+ background-color: #fff;
+ border-radius: 4px;
+
+ & .dtm-upload-disabled {
+ display: none;
+ }
+
+ .ding-upload-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 4px;
+ text-align: left;
+ }
+
+ .ding-upload-label {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ align-items: top;
+ }
+
+ .ding-upload-subtitle {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.4);
+ }
+ :global {
+ .ddm-upload-form {
+ .ddm-upload-form-text {
+ color: #999;
+ }
+
+ .ddm-upload-form-remove {
+ color: #999;
+
+ &:hover {
+ color: #f5222d;
+ }
+ }
+
+ .ddm-upload-form-file-name {
+ color: #333;
+ }
+
+ .ddm-upload-form-preview {
+ color: #1a6fb8;
+ }
+
+ .ddm-upload-form-upload-button {
+ background-color: #f5f5f5;
+ border: 1px dashed #d9d9d9;
+ color: #666;
+
+ &:hover {
+ border-color: #1a6fb8;
+ color: #1a6fb8;
+ }
+ }
+ }
+ }
+ & .dtm-upload-form-upload-btn {
+ align-items: flex-start;
+ }
+
+ & .dtm-upload-list {
+ margin-top: 10px;
+ }
+}
+
+.ding-upload-preview-only {
+ :global {
+ .ddm-upload-form {
+ .ddm-upload-form-upload-button {
+ display: none;
+ }
+ }
+ }
+}
+
+.ding-upload-image-preview {
+ :global {
+ .ddm-dialog-content {
+ padding: 0;
+ }
+ }
+
+ .ding-upload-image-wrapper {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.7);
+
+ img {
+ max-width: 100%;
+ max-height: 80vh;
+ object-fit: contain;
+ }
+ }
+}
diff --git a/src/views/selfInspection/components/FormCacheManager/index.jsx b/src/views/selfInspection/components/FormCacheManager/index.jsx
new file mode 100644
index 0000000..22ba0d9
--- /dev/null
+++ b/src/views/selfInspection/components/FormCacheManager/index.jsx
@@ -0,0 +1,131 @@
+import { useEffect, useRef } from 'react';
+
+/**
+ * 表单缓存管理器组件 - 仅提供逻辑功能，无UI渲染
+ *
+ * @param {Object} props 组件属性
+ * @param {Object} props.form 表单实例，用于获取表单数据
+ * @param {string} props.cacheKey 缓存的键名
+ * @param {string} props.storageType 存储类型，可选值: 'sessionStorage'|'localStorage'，默认为'sessionStorage'
+ * @param {Array} props.fieldsToWatch 需要监听变化的字段列表，如果为空则监听所有字段
+ * @param {Array} props.excludedFields 不应该被自动更新的字段列表，这些字段的值将被保留
+ * @param {number} props.debounceTime 防抖时间（毫秒），默认为500毫秒
+ * @param {Function} props.onCacheUpdated 缓存更新后的回调函数
+ * @returns {null} 不渲染任何UI元素
+ */
+const FormCacheManager = ({
+ form,
+ cacheKey = 'form_cache',
+ storageType = 'sessionStorage',
+ fieldsToWatch = [],
+ excludedFields = [],
+ debounceTime = 500,
+ onCacheUpdated
+}) => {
+ // 使用ref保存定时器
+ const timerRef = useRef(null);
+
+ // 存储表单数据到指定的存储中
+ const saveFormToCache = (formData) => {
+ try {
+ const storage = storageType === 'localStorage' ? localStorage : sessionStorage;
+
+ // 获取现有缓存数据
+ let existingCache = {};
+ try {
+ const existingCacheStr = storage.getItem(cacheKey);
+ if (existingCacheStr) {
+ existingCache = JSON.parse(existingCacheStr);
+ }
+ } catch (error) {
+ console.error('读取现有缓存失败:', error);
+ }
+
+ // 从现有缓存中提取需要保留的字段
+ const preservedFields = {};
+ if (excludedFields.length > 0 && Object.keys(existingCache).length > 0) {
+ excludedFields.forEach(field => {
+ if (existingCache[field] !== undefined) {
+ preservedFields[field] = existingCache[field];
+ }
+ });
+ }
+
+ // 合并新表单数据和需要保留的字段
+ const updatedCache = {
+ ...formData,
+ ...preservedFields // 保留的字段会覆盖formData中的同名字段
+ };
+
+ // 保存更新后的缓存
+ storage.setItem(cacheKey, JSON.stringify(updatedCache));
+
+ if (onCacheUpdated && typeof onCacheUpdated === 'function') {
+ onCacheUpdated(updatedCache);
+ }
+
+ console.log(`表单数据已缓存到${storageType}，键名: ${cacheKey}，保留的字段:`, preservedFields);
+ } catch (error) {
+ console.error('缓存表单数据失败:', error);
+ }
+ };
+
+ // 创建防抖函数
+ const debouncedUpdate = () => {
+ if (timerRef.current) clearTimeout(timerRef.current);
+ timerRef.current = setTimeout(() => {
+ if (form) {
+ const currentValues = form.getFieldsValue(fieldsToWatch.length > 0 ? fieldsToWatch : true);
+ saveFormToCache(currentValues);
+ }
+ }, debounceTime);
+ };
+
+ // 设置初始保存
+ useEffect(() => {
+ // 确保form存在
+ if (!form) {
+ console.error('FormCacheManager: form属性是必需的');
+ return;
+ }
+
+ // 给表单一些时间初始化，然后再进行第一次缓存
+ // 这样可以避免覆盖之前的缓存
+ const initTimer = setTimeout(() => {
+ // 初始保存一次表单值
+ debouncedUpdate();
+ }, 500); // 延迟500ms，确保表单已完全初始化
+
+ // 组件卸载时清除定时器
+ return () => {
+ if (timerRef.current) clearTimeout(timerRef.current);
+ clearTimeout(initTimer);
+ };
+ }, [form, cacheKey, storageType, fieldsToWatch, excludedFields, debounceTime, onCacheUpdated]);
+
+ // 监听表单控件的DOM事件
+ useEffect(() => {
+ if (!form || !form.getFieldInstance) return;
+
+ const formNode = document.querySelector('form');
+ if (!formNode) return;
+
+ // 监听表单元素的输入和变化事件
+ const handleFormChange = () => {
+ debouncedUpdate();
+ };
+
+ formNode.addEventListener('input', handleFormChange);
+ formNode.addEventListener('change', handleFormChange);
+
+ return () => {
+ formNode.removeEventListener('input', handleFormChange);
+ formNode.removeEventListener('change', handleFormChange);
+ };
+ }, [form]);
+
+ // 逻辑组件不需要渲染任何内容
+ return null;
+};
+
+export default FormCacheManager;
\ No newline at end of file
diff --git a/src/views/selfInspection/components/LocationPicker/index.jsx b/src/views/selfInspection/components/LocationPicker/index.jsx
new file mode 100644
index 0000000..d39c7a2
--- /dev/null
+++ b/src/views/selfInspection/components/LocationPicker/index.jsx
@@ -0,0 +1,167 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory } from 'react-router-dom';
+import { Button } from 'dingtalk-design-mobile';
+import { WriteEditOutlined } from 'dd-icons';
+import NavBarPage from '../../../../components/NavBarPage';
+import CustomFormView from '../../../../components/CustomFormView';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+//选择纠纷发生地的字典值
+function getRegionTreeApi(data) {
+ return $$.ax.request({ url: `syRegion/getRegionTree`, type: 'get', service: 'sys', data });
+}
+
+const LocationPicker = () => {
+ const history = useHistory();
+ const [isManualInput, setIsManualInput] = useState(false);
+ const [selectedArea, setSelectedArea] = useState('');
+ const [detailLocation, setDetailLocation] = useState('');
+ const [regionTree, setRegionTree] = useState([]);
+ const [formData, setFormData] = useState({});
+
+ // 加载缓存数据
+ useEffect(() => {
+ getRegionTree();
+ // 尝试从sessionStorage读取之前的数据
+ const cachedLocation = JSON.parse($$.getSessionStorage('selectedLocationData'));
+ if (cachedLocation) {
+ setSelectedArea(cachedLocation.area || '');
+ setDetailLocation(cachedLocation.detailLocation || '');
+ setFormData({
+ ...cachedLocation,
+ area: cachedLocation.area || '',
+ detailLocation: cachedLocation.detailLocation || '',
+ });
+ $$.clearSessionStorage('selectedLocationData');
+ }
+ }, []);
+
+ const getRegionTree = async () => {
+ global.setSpinning(true);
+ const res = await getRegionTreeApi();
+ global.setSpinning(false);
+ if (res.type) {
+ setRegionTree(res?.data[0]?.children || []);
+ }
+ };
+
+ // 切换到手动填写
+ const handleManualInput = () => {
+ setIsManualInput(true);
+ };
+
+ // 处理表单数据变化
+ const handleFormChange = (values, name) => {
+ console.log('表单值变化:', values, name);
+ setFormData({ ...formData, ...values });
+ };
+
+ // 保存并返回
+ const handleSave = () => {
+ // 验证表单
+ if (!formData.area) {
+ $$.showToast({ type: 'fail', content: '请选择区域' });
+ return;
+ }
+ if (!formData.detailLocation) {
+ $$.showToast({ type: 'fail', content: '请输入具体地点' });
+ return;
+ }
+ // 构造区域的中文名称
+ let areaLabels = [];
+ if (Array.isArray(formData.area)) {
+ // 递归查找多级区域的名称
+ let currentList = regionTree;
+ formData.area.forEach((areaCode) => {
+ const found = currentList.find((item) => item.value === areaCode);
+ if (found) {
+ areaLabels.push(found.label);
+ currentList = found.children || [];
+ }
+ });
+ }
+ // 构造完整的地点信息
+ const locationData = {
+ ...formData,
+ area: formData.area,
+ detailLocation: formData.detailLocation,
+ que: [formData.area[0], formData.area[1]],
+ queArea: formData.area[0],
+ queAreaName: areaLabels[0],
+ queRoad: formData.area[1],
+ queRoadName: areaLabels[1],
+ addr: `${areaLabels.join('')}${formData.detailLocation}`, // 完整地址
+ };
+ // 保存到sessionStorage以便传递回表单页面
+ sessionStorage.setItem('selectedLocation', JSON.stringify(locationData));
+ // 返回上一页
+ history.goBack();
+ };
+
+ // CustomFormView的配置
+ const formConfig = [
+ {
+ list: [
+ {
+ type: 'cascader',
+ name: 'area',
+ label: '选择区域',
+ placeholder: '请选择',
+ cols: 3,
+ require: true,
+ list: regionTree,
+ value: selectedArea,
+ },
+ {
+ type: 'text',
+ name: 'detailLocation',
+ label: '纠纷发生具体地点',
+ placeholder: '请填写具体地点',
+ require: true,
+ value: detailLocation,
+ },
+ ],
+ },
+ ];
+
+ return (
+ <>
+ <NavBarPage
+ title="纠纷发生地点"
+ leftContentFunc={() => history.goBack()}
+ rightContentFunc={handleManualInput}
+ rightChildren={
+ <>
+ <WriteEditOutlined />
+ 手动填写
+ </>
+ }
+ />
+
+ <div className="location-picker-container">
+ {!isManualInput ? (
+ <div className="placeholder-container">
+ {/* 占位内容，可以添加地图或其他选择界面 */}
+ <div className="placeholder-content">地点选择区域（占位）</div>
+ </div>
+ ) : (
+ <div className="manual-input-container">
+ <CustomFormView formConfig={formConfig} formData={formData} onChange={handleFormChange} />
+ </div>
+ )}
+
+ {/* 底部保存按钮 */}
+ {isManualInput && (
+ <div className="bottom-bar">
+ <Button type="primary" className="save-button" onClick={handleSave}>
+ 保存
+ </Button>
+ </div>
+ )}
+ </div>
+ </>
+ );
+};
+
+export default LocationPicker;
diff --git a/src/views/selfInspection/components/LocationPicker/index.less b/src/views/selfInspection/components/LocationPicker/index.less
new file mode 100644
index 0000000..b9b6a52
--- /dev/null
+++ b/src/views/selfInspection/components/LocationPicker/index.less
@@ -0,0 +1,141 @@
+.location-picker-container {
+ display: flex;
+ flex-direction: column;
+ min-height: calc(100vh - 56px);
+ background-color: #f5f7fa;
+ margin-top: 0px;
+
+ /* 占位区样式 */
+ .placeholder-container {
+ width: 100%;
+ flex: 1;
+ background-color: #ffffff;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .placeholder-content {
+ color: #86909c;
+ font-size: 16px;
+ }
+ }
+
+ /* 手动输入区域样式 */
+ .manual-input-container {
+ width: 100%;
+ background-color: #f5f7fa;
+ // padding: 12px 0;
+
+ /* 区域选择样式 */
+ .area-selection-container {
+ background-color: #ffffff;
+ // margin-bottom: 12px;
+ // padding-left: 16px;
+ padding-right: 16px;
+
+ .area-form-item {
+ // padding-top: 12px;
+ height: 47px;
+ .dtm-list-line{
+ padding: 0px;
+ .dtm-list-content{
+ height: 47px;
+ .dtm-select{
+ .dtm-select-default-item{
+ .dtm-list-content{
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ }
+ }
+ .dtm-select-placeholder{
+ display: flex;
+ align-items: center;
+ height: 100%;
+ justify-content: flex-end;
+ }
+ }
+ }
+ }
+
+ .dtm-form-item-default-label {
+ height: 23px;
+ font-size: 15px;
+ font-weight: 400;
+ color: #171a1d;
+ line-height: 23px;
+ }
+
+ .dtm-select-placeholder {
+ height: 23px;
+ font-size: 15px;
+ font-weight: 400;
+ color: rgba(23,26,29,0.40);
+ line-height: 23px;
+ }
+ }
+ }
+
+ /* 具体地点输入样式 */
+ .detail-location-container {
+ background-color: #ffffff;
+ // padding-left: 16px;
+ // padding-right: 16px;
+ height: 74px;
+
+ .detail-form-item {
+ padding-top: 12px;
+
+ .dtm-form-item-default-label {
+ height: 23px;
+ font-size: 15px;
+ font-weight: 400;
+ color: #171a1d;
+ line-height: 23px;
+ margin-bottom: 8px;
+ }
+
+ .dtm-input-item {
+ height: 23px;
+ // border: 1px solid #e5e6eb;
+ // border-radius: 4px;
+ // padding: 0 12px;
+
+ input {
+ font-size: 15px !important;
+ color: #171a1d;
+ }
+
+ &::placeholder {
+ color: rgba(23,26,29,0.40);
+ }
+ }
+ }
+ }
+ }
+
+ /* 底部保存按钮样式 */
+ .bottom-bar {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 12px 16px;
+ background-color: #ffffff;
+ box-shadow: 0 -1px 4px rgba(0,0,0,0.08);
+
+ .save-button {
+ width: 100%;
+ height: 44px;
+ background-color: #1a6fb8;
+ border-color: #1a6fb8;
+ border-radius: 4px;
+ font-size: 16px;
+ font-weight: 500;
+
+ &:active {
+ background-color: darken(#1a6fb8, 10%);
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/components/Preview/index.jsx b/src/views/selfInspection/components/Preview/index.jsx
new file mode 100644
index 0000000..22583b5
--- /dev/null
+++ b/src/views/selfInspection/components/Preview/index.jsx
@@ -0,0 +1,451 @@
+import React, { useEffect, useState } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Button, Toast } from 'dingtalk-design-mobile';
+import { selfAcceptCase, submitFormalCase } from '../CaseSubmitService/index';
+import { WriteNoteOutlined, WriteEditOutlined, RightArrow2Outlined } from 'dd-icons';
+import { lettersVisits_1, riskMask, preview_1, preview_2 } from '../../../../assets/img';
+import NavBarPage from '../../../../components/NavBarPage';
+import DingUpload from '../../../../components/DingUpload';
+import caseTypeSelect from '../../../../utils/caseTypeSelect';
+import * as $$ from '../../../../utils/utility';
+import './index.less';
+
+// 自行排查接口
+function submitDispute(data) {
+ return $$.ax.request({ url: `caseInfo/caseRegister`, type: 'post', service: 'mediate', data });
+}
+
+// ai分析是否为重复来访案件
+function getRepeatResultApi(data) {
+ return $$.ax.request({ urlAi: `case-law/getRepeatResult`, data, typeAi: 'post', service: 'mediate' });
+}
+
+const Preview = () => {
+ const history = useHistory();
+ const [formData, setFormData] = useState({});
+ const [submitting, setSubmitting] = useState(false); // 添加提交状态
+ const [activeTab, setActiveTab] = useState(0);
+ const [submit, setSubmit] = useState(false);
+
+ // 在组件加载时获取表单数据
+ useEffect(() => {
+ const saveData = $$.getSessionStorage('saveData');
+ if (saveData) {
+ console.log('预览页面加载的表单数据:', saveData);
+ setFormData(saveData);
+ $$.clearSessionStorage('saveData');
+ }
+ }, [$$.getSessionStorage('saveData')]);
+
+ // 处理返回按钮点击
+ const handleBack = () => {
+ history.goBack();
+ };
+
+ // 处理修改按钮点击
+ const handleEdit = () => {
+ console.log('点击修改按钮');
+ history.goBack();
+ };
+
+ // 自行受理按钮点击
+ const handleSelfHandle = async () => {
+ $$.confirmModal({
+ title: '提示',
+ subtitle: '确定自行受理吗？',
+ onOk: async () => {
+ const caseId = sessionStorage.getItem('newCaseId');
+ reauestSubmit(
+ {
+ ...formData,
+ id: caseId,
+ amount: formData.amount ? Number(formData.amount) : 0,
+ peopleNum: formData.peopleNum ? Number(formData.peopleNum) : 0,
+ occurTime: formData.occurTime ? $$.timeFormat(formData.occurTime) : '',
+ isSelfAccept: 1,
+ isDraft: 0,
+ operateType: 0,
+ canal: '22_00001-3',
+ canalName: '自行排查',
+ },
+ true
+ );
+ },
+ });
+ };
+
+ // 提交按钮点击
+ function handleSubmit() {
+ // 操作二次确认弹框
+ $$.confirmModal({
+ title: '提示',
+ subtitle: '确定提交吗？',
+ onOk: async () => {
+ const caseId = sessionStorage.getItem('newCaseId');
+ if (caseId && !formData.id) {
+ formData.id = caseId;
+ }
+ global.setSpinning(true);
+ const res = await submitFormalCase({
+ ...formData,
+ amount: formData.amount ? Number(formData.amount) : 0,
+ peopleNum: formData.peopleNum ? Number(formData.peopleNum) : 0,
+ occurTime: formData.occurTime ? $$.timeFormat(formData.occurTime) : '',
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ // 提交成功后展示新页面
+ setSubmit(true);
+ // 清除sessionStorage中的案件ID
+ sessionStorage.removeItem('newCaseId');
+ }
+ },
+ });
+ }
+
+ //提交请求
+ const reauestSubmit = async (data, isSelfAccept) => {
+ let plaintiffsCertiNo =
+ data.personList
+ ?.filter((item) => item.perType === '15_020008-1')
+ ?.map((item) => item.certiNo)
+ ?.join(',') || '';
+ let plaintiffs =
+ data.personList
+ ?.filter((item) => item.perType === '15_020008-1')
+ ?.map((item) => item.trueName)
+ ?.join(',') || '';
+ let defendantsCertiNo =
+ data.personList
+ ?.filter((item) => item.perType === '15_020008-2')
+ ?.map((item) => item.certiNo)
+ ?.join(',') || '';
+ let defendants =
+ data.personList
+ ?.filter((item) => item.perType === '15_020008-2')
+ ?.map((item) => item.trueName)
+ ?.join(',') || '';
+ global.setSpinning(true);
+ // AI重复案件接口
+ const res = await getRepeatResultApi({
+ caseId: data.id,
+ address: data.address,
+ caseDes: data.caseDes,
+ caseClaim: data?.caseClaim,
+ plaintiffs,
+ defendants,
+ plaintiffsCertiNo,
+ defendantsCertiNo,
+ });
+ global.setSpinning(false);
+ if (res.type) {
+ if (res.data?.length < 1) {
+ submitDisputeApi(data, isSelfAccept);
+ } else {
+ // 这里展示重复案件
+ // setRepeatData({ hisData: res.data, isSelfAccept, newData: data, visible: true });
+ // console.log(repeatData, 'repeatData');
+ }
+ }
+ };
+
+ // 提交自行排查接口
+ async function submitDisputeApi(data, isSelfAccept) {
+ global.setSpinning(true);
+ const res = await submitDispute(data);
+ global.setSpinning(false);
+ if (res.type) {
+ $$.clearSessionStorage('saveData');
+ $$.clearSessionStorage('newCaseId');
+ if (isSelfAccept) {
+ // 自行受理
+ let id = res.data;
+ // 提示窗
+ $$.showToast({
+ content: '受理成功，请即使跟进办理',
+ duration: 2,
+ });
+ history.push(`/gzdyh/flow?caseTaskId=${id}&caseId=${data.id}&editShow=true&moutedTab=sxbl&leftFunction=home`);
+ } else {
+ // 提交
+ setSubmit(true);
+ }
+ }
+ }
+
+ return (
+ <>
+ {submit ? (
+ <NavBarPage title="登记">
+ <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', backgroundColor: '#fff', height: 'calc(100vh - 44px)' }}>
+ <div style={{ marginTop: '20%', display: 'flex', justifyContent: 'center' }}>
+ <img src={preview_1} alt="提交成功" />
+ </div>
+ <div style={{ fontSize: '16px', color: '#1D2129' }}>提交成功</div>
+ <Button
+ style={{
+ width: '134px',
+ height: '44px',
+ backgroundColor: '#1A6FB8',
+ color: '#fff',
+ border: 'none',
+ borderRadius: '22px',
+ fontSize: '16px',
+ marginTop: '20px',
+ display: 'flex',
+ alignItems: 'center',
+ justifyContent: 'center',
+ }}
+ onClick={() => {
+ history.push('/gzdyh/home');
+ }}
+ >
+ <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+ <img src={preview_2} alt="返回首页" />
+ 返回首页
+ </div>
+ </Button>
+ </div>
+ </NavBarPage>
+ ) : (
+ <NavBarPage
+ title="登记"
+ rightChildren={
+ <div style={{ display: 'flex', alignItems: 'center', gap: '4px' }}>
+ <img style={{ width: '14px', height: '14px' }} src={lettersVisits_1} alt="保存草稿" />
+ 保存草稿
+ </div>
+ }
+ rightContentFunc={handleBack}
+ >
+ {/* 人员信息、纠纷基本信息、事项材料 */}
+ <div className="preview-tab">
+ <div className="preview-tab-bar">
+ <div className={`preview-tab-item${activeTab === 0 ? ' preview-tab-item-active' : ''}`} onClick={() => setActiveTab(0)}>
+ 人员信息
+ </div>
+ <div className={`preview-tab-item${activeTab === 1 ? ' preview-tab-item-active' : ''}`} onClick={() => setActiveTab(1)}>
+ 纠纷基本情况
+ </div>
+ <div className={`preview-tab-item${activeTab === 2 ? ' preview-tab-item-active' : ''}`} onClick={() => setActiveTab(2)}>
+ 事项材料
+ </div>
+ </div>
+ </div>
+
+ {/* 预览区域 */}
+ <div className="preview-container">
+ {/* 根据activeTab渲染内容 */}
+ {activeTab === 0 && (
+ <div className="preview-area">
+ {formData.personList?.map((cachedForm, idx) => (
+ <div key={idx} className="card-container">
+ <div
+ className="cached-form-card"
+ onClick={() => {
+ // 跳转到readperson页面查看详情
+ // history.push(`/gzdyh/readperson?id=${cachedForm.timestamp}`);
+ }}
+ >
+ {cachedForm?.perType === '15_020008-1' && (
+ <div className="applicant-badge">
+ <span className="applicant-text">申请方</span>
+ </div>
+ )}
+ {cachedForm?.perType === '15_020008-2' && (
+ <div className="respondent-badge">
+ <span className="respondent-text">被申</span>
+ <span className="respondent-text">请方</span>
+ </div>
+ )}
+ <div className="content-wrapper">
+ <div className="cached-form-content">
+ <div className="cached-form-name-phone">
+ <span className="cached-form-name">{cachedForm?.trueName || '-'}</span>
+ {cachedForm?.mobile && <span className="cached-form-phone">{cachedForm?.mobile || '-'}</span>}
+ </div>
+ </div>
+ <div className="cached-form-header">
+ <div className="cached-form-type">
+ {cachedForm?.perType === '24_00006-1' || cachedForm?.perType === '24_00006-2' ? (
+ <>
+ 代理对象：
+ <span style={{ marginLeft: '2px', color: '#86909C', fontSize: '12px' }}>{cachedForm?.name || '未知对象'}</span>
+ </>
+ ) : (
+ <>
+ <span
+ style={{
+ display: 'inline-flex',
+ alignItems: 'center',
+ height: '20px',
+ marginLeft: '0px',
+ }}
+ >
+ <span
+ style={{
+ fontSize: '12px',
+ lineHeight: '20px',
+ color: ' rgba(23,26,29,0.60)',
+ marginLeft: '0px',
+ }}
+ >
+ 自然人
+ </span>
+ <span
+ style={{
+ color: ' rgba(23,26,29,0.60)',
+ fontSize: '11px',
+ lineHeight: '12px',
+ marginLeft: '4px',
+ }}
+ >
+ |
+ </span>
+ <span
+ style={{
+ color: 'rgba(23,26,29,0.60)',
+ fontSize: '12px',
+ lineHeight: '20px',
+ }}
+ >
+ {cachedForm.certiNo || '-'}
+ </span>
+ </span>
+ </>
+ )}
+ </div>
+ </div>
+ </div>
+
+ {/* 右侧箭头 */}
+ <div className="right-arrow">
+ <RightArrow2Outlined style={{ color: 'rgba(23, 26, 29, 0.6)' }} />
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ )}
+ {activeTab === 1 && (
+ <div className="preview-area" style={{ padding: '10px 0 0 0' }}>
+ <div className="record-detail">
+ <div className="record-detail-item">
+ <div className="record-detail-label">事项等级</div>
+ <div className="record-detail-value">
+ {formData.caseLevel === '1' ? '一级' : formData.caseLevel === '2' ? '二级' : formData.caseLevel === '3' ? '三级' : '-'}
+ </div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">纠纷类型</div>
+ <div className="record-detail-value">
+ {formData?.caseTypeFirstName ? `${formData.caseTypeFirstName}/${formData.caseTypeName}` : '-'}
+ </div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">纠纷发生时间</div>
+ <div className="record-detail-value">{formData.occurTime ? $$.timeFormat(formData.occurTime) : '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">纠纷发生地点</div>
+ <div className="record-detail-value">{formData.addr || '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">问题属地</div>
+ <div className="record-detail-value">{formData.queAreaName ? `${formData.queAreaName}/${formData.queRoadName}` : '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">涉及人数（人）</div>
+ <div className="record-detail-value">{formData.peopleNum || '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">涉及金额（元）</div>
+ <div className="record-detail-value">{formData.amount || '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">事项概况</div>
+ <div className="record-detail-value">{formData.caseDes || '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label">申请事项</div>
+ <div className="record-detail-value">{formData.caseClaim || '-'}</div>
+ </div>
+ <div className="record-detail-item">
+ <div className="record-detail-label" style={{ display: 'flex', alignItems: 'center', gap: '8px', color: '#F53F3F' }}>
+ <img src={riskMask} alt="风险标识" className="risk-icon" />
+ <span className="major-dispute-text">是否重大矛盾纠纷</span>
+ </div>
+ <div className="record-detail-value">{formData.majorStatus === '1' ? '是' : '否'}</div>
+ </div>
+ </div>
+ </div>
+ )}
+ {activeTab === 2 && (
+ <div className="preview-area" style={{ padding: '10px 0 0 0' }}>
+ <div className="record-detail">
+ <div className="record-detail-item">
+ <div className="record-detail-label">申请材料</div>
+ <div className="record-detail-value">
+ {formData.fileList && formData.fileList.length > 0 ? (
+ <div className="dbcb-detail-section">
+ <DingUpload
+ fileList={formData.fileList.map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '0KB',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ />
+ </div>
+ ) : (
+ '-'
+ )}
+ </div>
+ </div>
+ </div>
+ <div className="record-detail" style={{ marginTop: '10px' }}>
+ <div className="record-detail-item">
+ <div className="record-detail-label">证据材料</div>
+ <div className="record-detail-value">
+ {formData.fileList && formData.fileList.length > 0 ? (
+ <div className="dbcb-detail-section">
+ <DingUpload
+ fileList={formData.fileList.map((file) => ({
+ id: file.id || Date.now().toString(),
+ name: file.name || '附件',
+ size: file.size || '0KB',
+ showUrl: file.url || '',
+ }))}
+ viewOnly={true}
+ />
+ </div>
+ ) : (
+ '-'
+ )}
+ </div>
+ </div>
+ </div>
+ </div>
+ )}
+ {/* 底栏按钮区域 */}
+ <div className="button-area">
+ <div className="edit-button">
+ <WriteEditOutlined style={{ fontSize: '15px' }} />
+ 修改
+ </div>
+ <Button className="self-handle-button" onClick={handleSelfHandle} disabled={submitting}>
+ 自行受理
+ </Button>
+ <Button className="submit-button" onClick={handleSubmit} disabled={submitting}>
+ 提交
+ </Button>
+ </div>
+ </div>
+ </NavBarPage>
+ )}
+ </>
+ );
+};
+
+export default Preview;
diff --git a/src/views/selfInspection/components/Preview/index.less b/src/views/selfInspection/components/Preview/index.less
new file mode 100644
index 0000000..2a995cf
--- /dev/null
+++ b/src/views/selfInspection/components/Preview/index.less
@@ -0,0 +1,170 @@
+.preview-container {
+ display: flex;
+ flex-direction: column;
+ min-height: calc(100vh - 56px);
+ background-color: #F2F2F2;
+ position: relative;
+
+ /* 预览区域样式 */
+ .preview-area {
+ flex: 1;
+ background-color: #F2F2F2;
+ width: 100%;
+ padding: 12px;
+ box-sizing: border-box;
+ margin-bottom: 80px;
+ margin-top: 64px;
+ height: calc(100vh - 56px - 80px - 64px);
+ overflow-y: auto;
+
+ .preview-content {
+ .preview-section {
+ background-color: #ffffff;
+ border-radius: 8px;
+ padding: 16px;
+ margin-bottom: 12px;
+
+ .section-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #171a1d;
+ margin-bottom: 12px;
+ position: relative;
+ padding-left: 12px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 3px;
+ height: 16px;
+ width: 4px;
+ background-color: #1a6fb8;
+ border-radius: 2px;
+ }
+ }
+
+ .section-content {
+ .info-item {
+ display: flex;
+ margin-bottom: 12px;
+ font-size: 14px;
+ line-height: 22px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .info-label {
+ color: #86909c;
+ min-width: 110px;
+ margin-right: 12px;
+ }
+
+ .info-value {
+ color: #171a1d;
+ flex: 1;
+ }
+ }
+
+ .text-content {
+ font-size: 14px;
+ line-height: 22px;
+ color: #171a1d;
+ word-break: break-word;
+ }
+ }
+ }
+ }
+ }
+
+ /* 底栏按钮区域样式 */
+ .button-area {
+ position: fixed;
+ left: 0;
+ bottom: 0;
+ width: 100vw;
+ z-index: 100;
+ padding: 12px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 68px;
+ background-color: #ffffff;
+ box-sizing: border-box;
+ box-shadow: 0 -1px 8px rgba(0, 0, 0, 0.08);
+
+ .edit-button {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ width: 28px;
+ font-size: 14px;
+ color: #171a1d;
+ margin-right: 8px;
+ gap: 2px;
+ }
+
+ .self-handle-button {
+ width: 116px;
+ height: 44px;
+ background-color: #ffffff;
+ color: #1a6fb8;
+ border: 1px solid #1a6fb8;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ margin: 0 8px;
+ }
+
+ .submit-button {
+ flex: 1;
+ height: 44px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ border: none;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ margin: 0 8px;
+
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+ }
+}
+
+.preview-tab {
+ background-color: #fff;
+ border-radius: 8px;
+ padding: 8px 12px;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ width: 100vw;
+ z-index: 99;
+ box-sizing: border-box;
+}
+
+.preview-tab-bar {
+ display: flex;
+ background: #5fa6d4;
+ overflow: hidden;
+}
+
+.preview-tab-item {
+ flex: 1;
+ text-align: center;
+ padding: 12px 0;
+ color: #fff;
+ background: #5fa6d4;
+ font-size: 14px;
+ cursor: pointer;
+}
+
+.preview-tab-item-active {
+ background: #1a6fb8;
+ color: #e6f7ff;
+}
diff --git a/src/views/selfInspection/components/ProcessFlow/index.jsx b/src/views/selfInspection/components/ProcessFlow/index.jsx
new file mode 100644
index 0000000..fc4175a
--- /dev/null
+++ b/src/views/selfInspection/components/ProcessFlow/index.jsx
@@ -0,0 +1,64 @@
+import React from 'react';
+import './index.less';
+
+/**
+ * 流程进度组件
+ * @param {Object} props
+ * @param {Array} props.nodes - 节点配置数组
+ * @param {Array} props.nodeStatus - 节点状态数组: 0-未开始，1-进行中，2-已完成
+ */
+const ProcessFlow = ({ nodes, nodeStatus }) => {
+ // 获取节点图标的类名
+ const getIconClassName = (status) => {
+ switch(status) {
+ case 2: return "node-icon node-icon-completed";
+ case 1: return "node-icon node-icon-in-progress";
+ case 0: return "node-icon node-icon-not-started";
+ default: return "node-icon node-icon-not-started";
+ }
+ };
+
+ // 获取节点文本的类名
+ const getTextClassName = (status) => {
+ switch(status) {
+ case 2: return "node-text node-text-completed";
+ case 1: return "node-text node-text-in-progress";
+ case 0: return "node-text node-text-not-started";
+ default: return "node-text node-text-not-started";
+ }
+ };
+
+ // 获取连接线的类名
+ const getConnectorClassName = (status) => {
+ switch(status) {
+ case 2: return "node-connector connector-completed";
+ case 1: return "node-connector connector-in-progress";
+ case 0: return "node-connector connector-not-started";
+ default: return "node-connector connector-not-started";
+ }
+ };
+
+ return (
+ <div className="process-flow-container">
+ {nodes.map((node, index) => (
+ <React.Fragment key={node.id}>
+ <div className="process-node">
+ <div className={getIconClassName(nodeStatus[index])}>
+ {nodeStatus[index] !== 2 ? index + 1 : ''}
+ </div>
+ <div className={getTextClassName(nodeStatus[index])}>
+ {node.label}
+ </div>
+ </div>
+
+ {/* 最后一个节点不需要连接线 */}
+ {index < nodes.length - 1 && (
+ <div className={getConnectorClassName(nodeStatus[index])}></div>
+ )}
+ </React.Fragment>
+ ))}
+ </div>
+ );
+};
+
+export default ProcessFlow;
\ No newline at end of file
diff --git a/src/views/selfInspection/components/ProcessFlow/index.less b/src/views/selfInspection/components/ProcessFlow/index.less
new file mode 100644
index 0000000..70ef2e1
--- /dev/null
+++ b/src/views/selfInspection/components/ProcessFlow/index.less
@@ -0,0 +1,132 @@
+/** 流程容器 */
+.process-flow-container {
+ width: 100%;
+ height: 82px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ background-color: #ffffff;
+
+ /** 流程节点 */
+ .process-node {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ /** 节点图标基础样式 */
+ .node-icon {
+ width: 24px;
+ height: 24px;
+ border-radius: 50%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-bottom: 8px;
+ color: #fff;
+ }
+
+ /** 节点文本基础样式 */
+ .node-text {
+ font-size: 14px;
+ line-height: 22px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ }
+ }
+
+ /** 节点连接线基础样式 */
+ .node-connector {
+ width: 80px;
+ height: 2px;
+ margin: 0 4px;
+ position: relative;
+ top: -16px; // 使连接线与图标中心对齐：-(24px高度 + 8px底部margin) / 2
+ }
+}
+
+/**
+ * 节点状态样式
+ * 包含三种状态：已完成、进行中、未开始
+ */
+
+/** 1. 已完成状态样式 */
+.node-icon-completed {
+ background-color: #e8f3ff;
+ &::after {
+ content: "";
+ width: 12px;
+ height: 12px;
+ background-image: url('../../../../assets/img/suceess.png');
+ background-size: contain;
+ background-repeat: no-repeat;
+ background-position: center;
+ display: inline-block;
+ }
+}
+
+.node-text-completed {
+ color: #171A1D;
+ opacity: 1;
+}
+
+.connector-completed {
+ background-color: #1a6fb8;
+}
+
+/** 2. 进行中状态样式 */
+.node-icon-in-progress {
+ background-color: #1a6fb8;
+ color: white;
+}
+
+.node-text-in-progress {
+ color: #1A6FB8;
+ opacity: 1;
+}
+
+.connector-in-progress {
+ background-color: #e8f3ff;
+}
+
+/** 3. 未开始状态样式 */
+.node-icon-not-started {
+ background-color: #86909c;
+ color: white;
+}
+
+.node-text-not-started {
+ color: #171A1D;
+ opacity: 0.4;
+}
+
+.connector-not-started {
+ background-color: #86909c;
+}
+
+/**
+ * 以下是旧版样式，保留以便向后兼容
+ * 建议后续迭代移除
+ */
+.node-icon-active {
+ background-color: #1890ff;
+}
+
+.node-icon-inactive {
+ background-color: #ccc;
+}
+
+.node-text-active {
+ color: #1890ff;
+}
+
+.node-text-inactive {
+ color: #999;
+}
+
+.connector-active {
+ background-color: #1890ff;
+}
+
+.connector-inactive {
+ background-color: #ccc;
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/components/UploadFile/index.jsx b/src/views/selfInspection/components/UploadFile/index.jsx
new file mode 100644
index 0000000..324ed5a
--- /dev/null
+++ b/src/views/selfInspection/components/UploadFile/index.jsx
@@ -0,0 +1,117 @@
+/*
+ * @Company: hugeInfo
+ * @Author: ldh
+ * @Date: 2022-09-16 18:58:01
+ * @LastEditTime: 2024-12-04 11:12:44
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 文件上传
+ */
+import React, { useRef } from 'react';
+import { ax, showToast } from '../../../../../utils/utility';
+
+function uploadFileApi(submitData, ownerId, ownerType) {
+ return ax.request({ url: `attachment/uploadFile?ownerId=${ownerId}&ownerType=${ownerType}`, type: 'post', data: submitData, service: 'ninex' });
+}
+
+// ocr身份证识别
+function OCRFileApi(submitData) {
+ return ax.request({ url: `ocrIdcard`, type: 'post', data: submitData, service: 'ocr' });
+}
+
+const UploadFile = ({ children, ownerId, ownerType, OCRshow, accept = 'image/*', capture, maxCount = 9, onSuccessCallback, disabled = false }) => {
+ const fileRef = useRef();
+
+ let _maxCount = OCRshow ? 1 : parseInt(maxCount);
+
+ // 文件上传
+ function handleUploadFile(e) {
+ let files = e.target.files;
+ if (files.length > _maxCount) {
+ showToast({ content: `只可同时上传${_maxCount}个文件` });
+ return;
+ }
+ if (_maxCount === 1) {
+ let file = e.target.files[0] || {};
+ let formdata = new FormData();
+ formdata.append('files', file);
+ uploadFile(formdata);
+ } else {
+ let submit = [];
+ for (let i = 0; i < files.length; i++) {
+ let formdata = new FormData();
+ formdata.append('files', files[i]);
+ submit.push(formdata);
+ }
+ uploadFiles(submit);
+ }
+ }
+
+ function onPreview(params) {
+ console.log(params);
+ }
+
+ // 点击上传
+ function handleClickUpload() {
+ fileRef.current.click();
+ }
+
+ // 上传文件
+ async function uploadFile(submitData) {
+ global.setSpinning(true);
+ const res = OCRshow ? await OCRFileApi(submitData) : await uploadFileApi(submitData, ownerId, ownerType);
+ global.setSpinning(false);
+ if (res.type) {
+ showToast({ type: 'success', content: OCRshow ? '识别成功' : '上传成功' });
+ onSuccessCallback && onSuccessCallback(res.data);
+
+ }
+ // fileRef.current.value = '';
+ }
+
+ // 多个文件上传
+ async function uploadFiles(submitData) {
+ global.setSpinning(true);
+ let apiArr = submitData.map((x) => uploadFileApi(x, ownerId, ownerType));
+ ax.ax.all(apiArr).then(
+ ax.ax.spread(function (...res) {
+ global.setSpinning(false);
+ let successNum = 0,
+ failNum = 0,
+ resData = [];
+ res.forEach((x) => {
+ if (x.type) {
+ successNum = successNum + 1;
+ resData.push(x.data[0]);
+ } else {
+ failNum = failNum + 1;
+ }
+ });
+ showToast({ content: `上传成功${successNum},失败${failNum}` });
+ onSuccessCallback && onSuccessCallback(resData);
+ })
+ );
+ fileRef.current.value = '';
+ }
+
+ return (
+ <>
+ <input
+ type="file"
+ name="file"
+ disabled={disabled}
+ ref={fileRef}
+ accept="image/gif,image/jpeg"
+ capture={capture}
+ onChange={handleUploadFile}
+ onPreview={onPreview}
+ style={{ display: 'none' }}
+ multiple={_maxCount > 1 ? true : false}
+
+ />
+ <div onClick={handleClickUpload}>{children}</div>
+ </>
+ );
+};
+
+export default UploadFile;
diff --git a/src/views/selfInspection/components/UploadFile/index.less b/src/views/selfInspection/components/UploadFile/index.less
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/src/views/selfInspection/components/UploadFile/index.less
diff --git a/src/views/selfInspection/components/VoiceRecognition/index.jsx b/src/views/selfInspection/components/VoiceRecognition/index.jsx
new file mode 100644
index 0000000..61be1b4
--- /dev/null
+++ b/src/views/selfInspection/components/VoiceRecognition/index.jsx
@@ -0,0 +1,149 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Button, Toast, TextareaItem } from 'dingtalk-design-mobile';
+import NavBarPage from '../../../../components/NavBarPage';
+import useCharacterCounter from '../CharacterCounter';
+import './index.less';
+
+const VoiceRecognition = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const [recognizedText, setRecognizedText] = useState('');
+ const [isRecording, setIsRecording] = useState(false);
+ const [charCount, setCharCount] = useState(0);
+
+ // 从URL查询参数中获取标题
+ const queryParams = new URLSearchParams(location.search);
+ const pageTitle = queryParams.get('title') || '语音识别';
+
+ // 根据标题设置不同的字数限制和提示文本
+ const getConfig = () => {
+ if (pageTitle === '事项概况') {
+ return {
+ maxLength: 2000,
+ placeholder: '请完整描述事项概况，应具备5要素：发生时间+发生地点+人物情况+事项起因+事项经过'
+ };
+ } else if (pageTitle === '事项申请') {
+ return {
+ maxLength: 500,
+ placeholder: '希望相关部门如何处理，建议分条描述，如请求1，请求2...'
+ };
+ }
+ return {
+ maxLength: 1000,
+ placeholder: '请说话，系统将自动转换为文字'
+ };
+ };
+
+ const { maxLength, placeholder } = getConfig();
+
+ // 使用字符计数组件
+ const characterCounter = useCharacterCounter({
+ value: recognizedText,
+ maxLength: maxLength,
+ onChange: setRecognizedText,
+ onCountChange: setCharCount
+ });
+
+ // 处理文本变化
+ const handleTextChange = (value) => {
+ characterCounter.handleTextChange(value);
+ };
+
+ // 开始语音识别
+ const handleStartRecording = () => {
+ setIsRecording(true);
+ Toast.show('开始录音...');
+ // 这里应该是实际开始录音的代码
+ // 实际项目中应该调用语音识别API
+
+ // 模拟获取识别结果 - 实际项目中应删除
+ setTimeout(() => {
+ setIsRecording(false);
+ const simulatedText = '这是语音识别的示例文本，实际项目中应该是真实的识别结果。';
+ handleTextChange(simulatedText);
+ }, 2000);
+ };
+
+ // 结束语音识别
+ const handleStopRecording = () => {
+ setIsRecording(false);
+ Toast.show('录音已停止');
+ };
+
+ // 保存并返回
+ const handleSave = () => {
+ if (recognizedText) {
+ // 从sessionStorage获取回调类型
+ const callbackType = sessionStorage.getItem('voiceCallbackType');
+
+ // 通过自定义事件传递识别结果
+ window.dispatchEvent(new CustomEvent('voiceRecognitionComplete', {
+ detail: {
+ text: recognizedText,
+ type: callbackType
+ }
+ }));
+ }
+ history.goBack();
+ };
+
+ return (
+ <NavBarPage title={pageTitle} leftContentFunc={() => history.goBack()}>
+ <div className="voice-recognition-container">
+ {/* 输入区域 */}
+ <div className="input-area">
+ <div className="form-item">
+ <div className="form-label">{pageTitle}</div>
+ <div className="textarea-container">
+ <TextareaItem
+ placeholder={placeholder}
+ rows={10}
+ className="recognition-textarea"
+ value={recognizedText}
+ onChange={handleTextChange}
+ />
+ </div>
+ <div className="word-count">
+ <div className="count-wrapper">
+ <span className="current-count" style={{ color: characterCounter.isExceeded ? '#F53F3F' : '#1a6fb8' }}>{charCount}</span>
+ <span className="total-count" style={{ color: characterCounter.isExceeded ? '#F53F3F' : 'inherit' }}>/{maxLength} 字</span>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ {/* 按钮功能区域 */}
+ <div className="button-area">
+ {recognizedText ? (
+ <>
+ <Button
+ className="save-button"
+ onClick={handleSave}
+ >
+ 保存
+ </Button>
+ <Button
+ className="voice-button"
+ onTouchStart={handleStartRecording}
+ onTouchEnd={handleStopRecording}
+ >
+ 按住说话
+ </Button>
+ </>
+ ) : (
+ <Button
+ className="voice-button center"
+ onTouchStart={handleStartRecording}
+ onTouchEnd={handleStopRecording}
+ >
+ 按住说话
+ </Button>
+ )}
+ </div>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default VoiceRecognition;
\ No newline at end of file
diff --git a/src/views/selfInspection/components/VoiceRecognition/index.less b/src/views/selfInspection/components/VoiceRecognition/index.less
new file mode 100644
index 0000000..44d77d4
--- /dev/null
+++ b/src/views/selfInspection/components/VoiceRecognition/index.less
@@ -0,0 +1,134 @@
+.voice-recognition-container {
+ display: flex;
+ flex-direction: column;
+ min-height: calc(100vh - 56px);
+ background-color: #f8f8f8;
+
+ /* 输入区域样式 */
+ .input-area {
+ width: 100%;
+ height: 640px;
+ background-color: #ffffff;
+ padding: 16px;
+ box-sizing: border-box;
+
+ .form-item {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+
+ .form-label {
+ font-size: 15px;
+ font-weight: 400;
+ color: #171a1d;
+ margin-bottom: 12px;
+ line-height: 23px;
+ }
+
+ .textarea-container {
+ flex: 1;
+ position: relative;
+
+ .recognition-textarea {
+ width: 100%;
+ height: 100%;
+ border: none;
+ padding: 0;
+
+ .dtm-textarea-item-control {
+ height: calc(100% - 24px);
+ font-size: 15px;
+ line-height: 1.5;
+ color: #171a1d;
+ }
+
+ .dtm-textarea-item-desktop {
+ padding: 0;
+ border: none;
+ }
+
+ .dtm-textarea-item-count {
+ display: none;
+ }
+ }
+ }
+
+ .word-count {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ font-size: 12px;
+ color: #86909c;
+ margin-top: 8px;
+
+ .count-wrapper {
+ display: flex;
+ align-items: center;
+ }
+
+ .current-count {
+ color: #1a6fb8;
+ font-weight: 500;
+ }
+
+ .total-count {
+ margin-left: 2px;
+ }
+ }
+ }
+ }
+
+ /* 按钮功能区域样式 */
+ .button-area {
+ padding: 12px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-top: 16px;
+ height: 68px;
+ background-color: #ffffff;
+ box-sizing: border-box;
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
+
+ .save-button {
+ width: 123px;
+ height: 44px;
+ background-color: #ffffff;
+ color: #1a6fb8;
+ border: 1px solid #1a6fb8;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ margin-left: 0px;
+ }
+
+ .voice-button {
+ width: 204px;
+ height: 44px;
+ background-color: #1a6fb8;
+ color: #ffffff;
+ border: none;
+ border-radius: 8px;
+ font-size: 16px;
+ font-weight: 500;
+ margin-right: 0px;
+
+ &.center {
+ width: 204px;
+ margin: 0 auto;
+ }
+ }
+ }
+}
+
+@keyframes pulse {
+ 0% {
+ transform: scale(1);
+ }
+ 50% {
+ transform: scale(1.05);
+ }
+ 100% {
+ transform: scale(1);
+ }
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/disputeTypePicker/index.jsx b/src/views/selfInspection/disputeTypePicker/index.jsx
new file mode 100644
index 0000000..9176473
--- /dev/null
+++ b/src/views/selfInspection/disputeTypePicker/index.jsx
@@ -0,0 +1,356 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Input, Toast } from 'dingtalk-design-mobile';
+import { SearchOutlined } from 'dd-icons';
+import NavBarPage from '../../../components/NavBarPage';
+import caseTypeSelect from '../../../utils/caseTypeSelect';
+import './index.less';
+
+const DisputeTypePicker = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const [searchValue, setSearchValue] = useState('');
+ const [selectedCategory, setSelectedCategory] = useState(''); // 初始设为空字符串
+ const [searchResults, setSearchResults] = useState([]);
+ const [showSearchResults, setShowSearchResults] = useState(false);
+ const searchCategoryId = 'search-results-category'; // 搜索结果分类的唯一ID
+
+ // 组件初始化时设置默认选中的分类
+ useEffect(() => {
+ try {
+ if (caseTypeSelect && Array.isArray(caseTypeSelect.caseTypeSelect) && caseTypeSelect.caseTypeSelect.length > 0) {
+ // 默认选中第一个分类
+ setSelectedCategory(caseTypeSelect.caseTypeSelect[0].value);
+ }
+ } catch (error) {
+ console.error('初始化分类选择失败:', error);
+ }
+ }, []);
+
+ // 处理返回按钮
+ const handleBack = () => {
+ history.goBack();
+ };
+
+ // 高亮搜索关键词
+ const highlightText = (text, keyword) => {
+ if (!keyword.trim()) return text;
+
+ const parts = text.split(new RegExp(`(${keyword})`, 'gi'));
+ return (
+ <>
+ {parts.map((part, index) =>
+ part.toLowerCase() === keyword.toLowerCase() ?
+ <span key={index} className="highlight-text">{part}</span> :
+ part
+ )}
+ </>
+ );
+ };
+
+ // 处理搜索
+ const handleSearch = () => {
+ if (!searchValue.trim()) {
+ setShowSearchResults(false);
+ return;
+ }
+
+ const results = [];
+ caseTypeSelect.caseTypeSelect.forEach(category => {
+ if (category && Array.isArray(category.children) && category.children.length > 0) {
+ category.children.forEach(item => {
+ if (item && item.label && item.label.includes(searchValue)) {
+ results.push({
+ ...item,
+ categoryName: category.label || '未分类',
+ categoryValue: category.value
+ });
+ }
+ });
+ }
+ });
+
+ setSearchResults(results);
+ setShowSearchResults(true);
+
+ // 不管是否有搜索结果，只要执行了搜索，都选中"搜索结果"分类
+ setSelectedCategory(searchCategoryId);
+ };
+
+ // 处理搜索输入变化
+ const handleSearchInputChange = (value) => {
+ setSearchValue(value);
+ if (!value) {
+ // 当搜索框清空时，如果之前在搜索结果页面，则切换到第一个分类
+ if (selectedCategory === searchCategoryId && caseTypeSelect.caseTypeSelect.length > 0) {
+ setSelectedCategory(caseTypeSelect.caseTypeSelect[0].value);
+ }
+ setShowSearchResults(false);
+ }
+ };
+
+ // 处理分类选择
+ const handleCategorySelect = (categoryValue) => {
+ setSelectedCategory(categoryValue);
+ // 如果选择了非搜索结果分类，则清除搜索状态和搜索框内容
+ if (categoryValue !== searchCategoryId) {
+ setShowSearchResults(false);
+ setSearchValue(''); // 清空搜索框内容
+ }
+ };
+
+ // 处理类型选择
+ const handleTypeSelect = (type) => {
+ // 检查type是否包含必要的属性
+ if (!type || !type.value || !type.label) {
+ Toast.fail({
+ content: '选择的类型数据不完整',
+ duration: 2,
+ });
+ return;
+ }
+
+ // 构造完整的选择信息，包括一级案由和二级案件
+ const selectedTypeInfo = {
+ // 二级案件信息
+ value: type.value, // 二级案件的value，对应表单中的caseType
+ label: type.label, // 二级案件的label，对应表单中的caseTypeName
+
+ // 一级案由信息
+ caseTypeFirst: type.categoryValue, // 一级案由的value
+ caseTypeFirstName: type.categoryName // 一级案由的label
+ };
+
+ console.log('将要保存的纠纷类型信息:', selectedTypeInfo);
+
+ // 将选择的完整纠纷类型信息存储到 sessionStorage
+ try {
+ sessionStorage.setItem('selectedDisputeType', JSON.stringify(selectedTypeInfo));
+
+ // 同时更新caseDes_form_cache缓存
+ const formCacheKey = 'caseDes_form_cache';
+ const existingCache = sessionStorage.getItem(formCacheKey);
+ let formCache = {};
+
+ if (existingCache) {
+ try {
+ formCache = JSON.parse(existingCache);
+ } catch (parseError) {
+ console.error('解析表单缓存失败:', parseError);
+ // 继续使用空对象
+ }
+ }
+
+ // 更新caseDes_form_cache中的纠纷类型相关字段
+ const updatedCache = {
+ ...formCache,
+ // 确保使用统一的字段名，与BasicInfoForm组件中使用的保持一致
+ caseType: selectedTypeInfo.value, // 二级案件value
+ caseTypeName: selectedTypeInfo.label, // 二级案件label
+ caseTypeFirst: selectedTypeInfo.caseTypeFirst, // 一级案由value
+ caseTypeFirstName: selectedTypeInfo.caseTypeFirstName // 一级案由label
+ };
+
+ // 保存更新后的缓存
+ sessionStorage.setItem(formCacheKey, JSON.stringify(updatedCache));
+ console.log('成功更新表单缓存中的纠纷类型数据:', {
+ caseType: updatedCache.caseType,
+ caseTypeName: updatedCache.caseTypeName,
+ caseTypeFirst: updatedCache.caseTypeFirst,
+ caseTypeFirstName: updatedCache.caseTypeFirstName
+ });
+
+ Toast.success({
+ content: `已选择${selectedTypeInfo.caseTypeFirstName}/${type.label}`,
+ duration: 1,
+ });
+
+ // 返回上一页
+ history.goBack();
+ } catch (error) {
+ console.error('保存选择数据失败:', error);
+ Toast.fail({
+ content: '保存选择失败，请重试',
+ duration: 2,
+ });
+ }
+ };
+
+ // 渲染左侧分类导航
+ const renderCategoryNav = () => {
+ const categories = [...caseTypeSelect.caseTypeSelect];
+
+ // 只要执行过搜索操作就添加"搜索结果"分类，不管是否有搜索结果
+ const searchResultsCategory = showSearchResults ?
+ [{
+ value: searchCategoryId,
+ label: '搜索结果'
+ }] : [];
+
+ return (
+ <div className="category-nav">
+ {[...searchResultsCategory, ...categories].map(category => (
+ <div
+ key={category.value}
+ className={`category-nav-item ${selectedCategory === category.value ? 'active' : ''}`}
+ onClick={() => handleCategorySelect(category.value)}
+ >
+ {category.label}
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ // 渲染右侧类型列表
+ const renderTypeList = () => {
+ // 如果当前选中的是搜索结果分类，则显示搜索结果
+ if (selectedCategory === searchCategoryId && showSearchResults) {
+ return renderSearchResults();
+ }
+
+ const currentCategory = caseTypeSelect.caseTypeSelect.find(item => item.value === selectedCategory);
+
+ if (!currentCategory) return null;
+
+ // 确保children存在且是一个数组
+ const children = Array.isArray(currentCategory.children) ? currentCategory.children : [];
+
+ return (
+ <div className="type-list">
+ <div className="type-category-title">{currentCategory.label}</div>
+ <div className="type-items">
+ {children.length > 0 ? (
+ children.map((type, index) => {
+ // 为每个类型项添加一级案由信息
+ const typeWithCategory = {
+ ...type,
+ categoryName: currentCategory.label,
+ categoryValue: currentCategory.value
+ };
+
+ return (
+ <div
+ key={type.value || `type-${Math.random()}`}
+ className="type-item"
+ onClick={() => handleTypeSelect(typeWithCategory)}
+ >
+ <div className="type-item-icon">
+ <div className="inner-icon"></div>
+ </div>
+ <div className="type-item-label">{type.label}</div>
+ </div>
+ );
+ })
+ ) : (
+ <div className="no-items">暂无数据</div>
+ )}
+ </div>
+ </div>
+ );
+ };
+
+ // 渲染搜索结果
+ const renderSearchResults = () => {
+ if (searchResults.length === 0) {
+ // 返回空内容，但保留容器
+ return <div className="search-results"></div>;
+ }
+
+ // 按一级案由分组
+ const groupedResults = searchResults.reduce((acc, type) => {
+ const categoryItem = caseTypeSelect.caseTypeSelect.find(cat => cat.value === type.categoryValue);
+ const categoryName = categoryItem ? categoryItem.label : '未分类';
+
+ if (!acc[categoryName]) {
+ acc[categoryName] = {
+ categoryValue: type.categoryValue,
+ items: []
+ };
+ }
+
+ acc[categoryName].items.push(type);
+ return acc;
+ }, {});
+
+ return (
+ <div className="search-results">
+ {Object.entries(groupedResults).map(([categoryName, group]) => (
+ <div key={categoryName} className="search-category">
+ <div className="type-category-title">{categoryName}</div>
+ <div className="type-items">
+ {group.items.map((type) => {
+ // 为搜索结果添加一级案由信息
+ const typeWithCategory = {
+ ...type,
+ categoryName: categoryName,
+ categoryValue: group.categoryValue
+ };
+
+ return (
+ <div
+ key={type.value}
+ className="type-item"
+ onClick={() => handleTypeSelect(typeWithCategory)}
+ >
+ <div className="type-item-icon">
+ <div className="inner-icon"></div>
+ </div>
+ <div className="type-item-label">
+ {highlightText(type.label, searchValue)}
+ </div>
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ ))}
+ </div>
+ );
+ };
+
+ return (
+ <div className="dispute-type-picker">
+ <NavBarPage
+ leftContentVisible={true}
+ title="选择纠纷类型"
+ leftContentFunc={handleBack}
+ />
+
+ <div className="main-container">
+ {/* 搜索区域 */}
+ <div className="search-container">
+ <div className="search-context">
+ <div className="search-icon">
+ <SearchOutlined />
+ </div>
+ <Input
+ placeholder="搜索纠纷类型"
+ value={searchValue}
+ onChange={(value) => {
+ handleSearchInputChange(value);
+ }}
+ onKeyPress={(e) => {
+ if (e.key === 'Enter') {
+ handleSearch();
+ }
+ }}
+ />
+ <div className="search-button" onClick={handleSearch}>
+ <p className="search-split">|</p>
+ <p className="search-text">查询</p>
+ </div>
+ </div>
+ </div>
+
+ {/* 类型选择区域 - 不再使用showSearchResults控制显示，而是通过选中的category类型控制 */}
+ <div className="category-container">
+ {renderCategoryNav()}
+ {renderTypeList()}
+ </div>
+ </div>
+ </div>
+ );
+};
+
+export default DisputeTypePicker;
\ No newline at end of file
diff --git a/src/views/selfInspection/disputeTypePicker/index.less b/src/views/selfInspection/disputeTypePicker/index.less
new file mode 100644
index 0000000..2f67be1
--- /dev/null
+++ b/src/views/selfInspection/disputeTypePicker/index.less
@@ -0,0 +1,239 @@
+.dispute-type-picker {
+ width: 100%;
+ height: 100vh;
+ background-color: #f5f7fa;
+ display: flex;
+ flex-direction: column;
+}
+
+.main-container {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+}
+
+/* 搜索区域样式 */
+.search-container {
+ padding: 12px 12px;
+ height: 60px;
+ background-color: #fff;
+ border-bottom: 1px solid #e8e8e8;
+ margin-bottom: 0px;
+
+
+ .search-context {
+ display: flex;
+ align-items: center;
+ height: 36px;
+ width: 351px;
+ background: #f5f7fa;
+ border-radius: 4px;
+ // padding: 0 12px;
+
+ .search-icon {
+ // margin-right: 8px;
+ margin: 0px;
+ width: 32px;
+ color: #86909c;
+ }
+
+ .dtm-input-item {
+ flex: 1;
+ border: none;
+ background: transparent;
+ height: 24px;
+ font-size: 16px;
+ .dtm-input-item-input{
+ font-size: 16px !important;
+ }
+ }
+
+ .search-button {
+ display: flex;
+ align-items: center;
+ margin-left: 8px;
+ cursor: pointer;
+
+ .search-split {
+ color: #e4e8eb;
+ margin-right: 8px;
+ }
+
+ .search-text {
+ color: #1a6fb8;
+ font-size: 14px;
+ }
+ }
+ }
+}
+
+/* 分类导航和类型列表容器 */
+.category-container {
+ display: flex;
+ flex: 1;
+ overflow: hidden;
+ width: 375px; /* 假设设备宽度为375px，常见移动设备宽度 */
+}
+
+/* 左侧分类导航样式 */
+.category-nav {
+ width: 108px;
+ min-width: 108px;
+ max-width: 108px;
+ background-color: #f5f7fa;
+ overflow-y: auto;
+
+ .category-nav-item {
+ height: 46px;
+ display: flex;
+ align-items: center;
+ padding: 0 16px;
+ font-size: 14px;
+ color: #171a1d;
+ position: relative;
+
+ &.active {
+ background-color: #fff;
+ color: #1a6fb8;
+ font-weight: 500;
+
+ &::before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ height: 46px;
+ width: 3px;
+ background-color: #1a6fb8;
+ border-radius: 0 2px 2px 0;
+ }
+ }
+ }
+}
+
+/* 右侧类型列表样式 */
+.type-list {
+ width: 267px;
+ min-width: 267px;
+ max-width: 267px;
+ background-color: #fff;
+ overflow-y: auto;
+ padding: 17px 0 17px 17px;
+ box-sizing: border-box;
+ height: calc(100vh - 60px); /* 减去头部导航栏高度 */
+ min-height: calc(100vh - 60px);
+
+ .type-category-title {
+ display: none; /* 隐藏标题 */
+ }
+
+ .type-items {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: flex-start;
+ }
+
+ .type-item {
+ width: 64px;
+ margin-right: 21px;
+ margin-bottom: 12px;
+ font-size: 14px;
+ color: #171a1d;
+ text-align: center;
+
+ &:nth-child(3n) {
+ margin-right: 0;
+ }
+
+ .type-item-icon {
+ width: 64px;
+ height: 64px;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ margin-bottom: 8px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ .inner-icon {
+ width: 32px;
+ height: 32px;
+ background-color: #e8e8e8;
+ border-radius: 2px;
+ }
+ }
+
+ .type-item-label {
+ width: 64px;
+ text-align: center;
+ word-break: break-word;
+ word-wrap: break-all;
+ font-size: 14px;
+ line-height: 1.3;
+ max-height: 36px;
+ display: -webkit-box;
+ -webkit-line-clamp: 2;
+ -webkit-box-orient: vertical;
+ overflow: hidden;
+ }
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+
+ .no-items {
+ width: 100%;
+ height: 60px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: #86909c;
+ font-size: 14px;
+ }
+}
+
+/* 搜索高亮文本样式 */
+.highlight-text {
+ color: #1a6fb8;
+ font-weight: 500;
+}
+
+/* 搜索结果样式 */
+.search-results {
+ flex: 1;
+ background-color: #fff;
+ overflow-y: auto;
+
+ .search-result-item {
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+
+ .result-name {
+ font-size: 15px;
+ color: #171a1d;
+ margin-bottom: 4px;
+ }
+
+ .result-category {
+ font-size: 13px;
+ color: #86909c;
+ }
+ }
+
+ .no-results {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding-top: 100px;
+
+ .no-results-text {
+ color: #86909c;
+ font-size: 14px;
+ margin-top: 16px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/views/selfInspection/legalPerson/CustomFormExample.jsx b/src/views/selfInspection/legalPerson/CustomFormExample.jsx
new file mode 100644
index 0000000..8a284a9
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/CustomFormExample.jsx
@@ -0,0 +1,140 @@
+import React, { useState, useEffect } from 'react';
+import { Button, Toast } from 'dingtalk-design-mobile';
+import CustomFormView from '../../../components/CustomFormView';
+import { transfer } from './partyInfoForm';
+import NavBarPage from '../../../components/NavBarPage';
+import dd from 'gdt-jsapi';
+
+const CustomFormExample = () => {
+ // 获取表单配置
+ const formConfig = transfer();
+
+ // 表单数据状态
+ const [formData, setFormData] = useState({});
+
+ // 处理表单变更
+ const handleFormChange = (newValues, name) => {
+ setFormData(newValues);
+ console.log('表单数据变更:', name, newValues);
+ };
+
+ // 处理人员选择
+ const handleSelectPerson = (name, url) => {
+ Toast.info({
+ content: `正在选择: ${name}`,
+ });
+
+ // 这里可以调用钉钉选人接口
+ dd.biz.contact.complexPicker({
+ title: '选择人员',
+ corpId: '',
+ multiple: true,
+ limitTips: '最多选择10个人',
+ maxUsers: 10,
+ responseUserOnly: true,
+ success: (res) => {
+ const selectedNames = res.users.map(user => user.name).join(',');
+ setFormData({
+ ...formData,
+ [name]: selectedNames
+ });
+ }
+ });
+ };
+
+ // 处理文件上传
+ const handleUpload = (item) => {
+ Toast.info({
+ content: '选择文件上传',
+ });
+
+ // 这里可以调用钉钉上传文件接口
+ dd.biz.util.uploadAttachment({
+ type: 'image',
+ compression: true,
+ multiple: true,
+ max: 9,
+ spaceId: item.ownerType || '',
+ success: (res) => {
+ if (res.data && res.data.length > 0) {
+ const fileList = res.data.map((file, index) => ({
+ id: `temp_${Date.now()}_${index}`,
+ name: file.fileName || `附件${index + 1}`,
+ url: file.spaceId,
+ type: file.fileType
+ }));
+
+ const newFileList = [...(formData.fileList || []), ...fileList];
+ setFormData({
+ ...formData,
+ fileList: newFileList
+ });
+ }
+ }
+ });
+ };
+
+ // 表单提交
+ const handleSubmit = () => {
+ // 检查必填字段
+ let missingRequired = false;
+
+ formConfig.forEach(group => {
+ group.list.forEach(item => {
+ if (item.require && (!formData[item.name] || formData[item.name] === '')) {
+ missingRequired = true;
+ Toast.info({
+ content: `请填写必填项: ${item.label}`,
+ });
+ return;
+ }
+ });
+ });
+
+ if (missingRequired) {
+ return;
+ }
+
+ // 提交表单数据
+ Toast.success({
+ content: '表单提交成功',
+ });
+
+ console.log('提交的表单数据:', formData);
+ };
+
+ return (
+ <div className="custom-form-example">
+ <NavBarPage
+ title="自定义表单示例"
+ leftButton={() => {}}
+ />
+
+ <CustomFormView
+ formConfig={formConfig}
+ formData={formData}
+ onChange={handleFormChange}
+ onSelectPerson={handleSelectPerson}
+ onUpload={handleUpload}
+ />
+
+ <div style={{
+ padding: '16px',
+ position: 'fixed',
+ bottom: 0,
+ left: 0,
+ right: 0,
+ background: '#fff',
+ boxShadow: '0 -2px 8px rgba(0, 0, 0, 0.1)'
+ }}>
+ <Button type="primary" block onClick={handleSubmit}>
+ 提交
+ </Button>
+ </div>
+
+ <div style={{ height: '70px' }} />
+ </div>
+ );
+};
+
+export default CustomFormExample;
\ No newline at end of file
diff --git a/src/views/selfInspection/legalPerson/index copy.jsx b/src/views/selfInspection/legalPerson/index copy.jsx
new file mode 100644
index 0000000..75e3ef9
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/index copy.jsx
@@ -0,0 +1,194 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import NavBarPage from '../../../components/NavBarPage';
+import PartyInfo from './partyInfo';
+import { Input, Button, Toast } from 'dingtalk-design-mobile';
+import { SearchOutlined,WriteEditOutlined } from 'dd-icons';
+import './index.less';
+import * as $$ from '../../../utils/utility';
+
+const LegalPerson = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const [isSelectPage, setIsSelectPage] = useState(false);
+ const [searchValue, setSearchValue] = useState('');
+ const [selectedType, setSelectedType] = useState('natural');
+ const [isManualInput, setIsManualInput] = useState(false);
+ const [showList, setShowList] = useState(false);
+ const [selectedCompany, setSelectedCompany] = useState(null);
+ const [searchKeyword, setSearchKeyword] = useState('');
+ const [currentRole, setCurrentRole] = useState('applicant'); // 默认角色为申请方当事人
+ const [isFromCaseDesClick, setIsFromCaseDesClick] = useState(false); // 记录是否从caseDes弹窗点击进入
+
+ // 在组件加载时从URL参数获取当前角色和来源标志
+ useEffect(() => {
+ try {
+ // 解析URL参数
+ const queryParams = new URLSearchParams(location.search);
+ const role = queryParams.get('role');
+ const from = queryParams.get('from');
+
+ // 设置角色信息
+ if (role) {
+ setCurrentRole(role);
+ }
+
+ // 设置来源标志
+ if (from === 'casedes') {
+ setIsFromCaseDesClick(true);
+ }
+
+ // 如果是从caseDes弹窗点击进入，清空任何可能的选中公司
+ if (from === 'casedes') {
+ setSelectedCompany(null);
+ }
+ } catch (error) {
+ console.error('读取URL参数失败:', error);
+ }
+ }, [location]);
+
+ const handleSearch = () => {
+ setSearchKeyword(searchValue);
+ setShowList(true);
+ };
+
+ // 高亮显示搜索文本的函数
+ const highlightText = (text, keyword) => {
+ if (!keyword.trim() || !text.includes(keyword)) {
+ return <span>{text}</span>;
+ }
+
+ const parts = text.split(new RegExp(`(${keyword})`, 'gi'));
+ return (
+ <span className="text-container">
+ {parts.map((part, index) =>
+ part.toLowerCase() === keyword.toLowerCase() ?
+ <span key={index} className="highlight-text">{part}</span> :
+ <span key={index}>{part}</span>
+ )}
+ </span>
+ );
+ };
+
+ const handleBack = () => {
+ if (isManualInput) {
+ setIsManualInput(false);
+ } else {
+ history.goBack();
+ }
+ };
+
+ // 处理公司卡片点击事件
+ const handleCompanySelect = (company) => {
+ setSelectedCompany(company);
+ setIsSelectPage(false);
+ setIsManualInput(true);
+
+ // 选择公司后提示用户
+ Toast.success({
+ content: '已选择企业',
+ duration: 1,
+ });
+ };
+
+ const testSelectList = [
+ ];
+
+ return (
+ <>
+ {isSelectPage ? (
+ <>
+ <NavBarPage leftContentVisible={true} title={selectedType === 'legal' ? "选择企业" : "选择组织"} leftContentFunc={setIsSelectPage} rightContentFunc={() => {
+ setIsSelectPage(false);
+ setIsManualInput(true);
+ }} rightChildren={<><WriteEditOutlined />手动填写</>}/>
+ <div className='main-container'>
+ <div className="search-container">
+ <div className='search-context'>
+ <div className="search-icon">
+ <SearchOutlined />
+ </div>
+ <Input
+ placeholder="企业名称/统一社会信用代码"
+ value={searchValue}
+ onChange={(value) => setSearchValue(value)}
+ />
+
+ <div className='search-button' onClick={handleSearch}>
+ <p className='search-split'>|</p>
+ <p className='search-text'>查询</p>
+ </div>
+ </div>
+ </div>
+ {showList ? (
+ <div className='company-list'>
+ {testSelectList.map((item, index) => (
+ <div key={index} className='company-item'
+ onClick={() => handleCompanySelect(item)}>
+ <div className='company-title'>
+ {highlightText(item.title, searchKeyword)}
+ </div>
+ <div className='company-info'>
+ <div>
+ <span className="label">统一社会信用代码：</span>
+ <span className="value">{highlightText(item.creditCode, searchKeyword)}</span>
+ </div>
+ <div>
+ <span className="label">法定代表人：</span>
+ <span className="value">{highlightText(item.legalPerson, searchKeyword)}</span>
+ </div>
+ <div>
+ <span className="label">企业所在地：</span>
+ <span className="value">{highlightText(item.companyLocation, searchKeyword)}</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ ) : (
+ <div className='select-none'>
+ <div className='select-icon'>
+ </div>
+ <div className='select-icon-text'>
+ 暂无数据
+ </div>
+ </div>
+ )}
+ </div>
+ </>
+ ) : (
+ <>
+ <NavBarPage leftContentVisible={true} title={getTitle(currentRole)} leftContentFunc={handleBack} />
+ <PartyInfo
+ setIsSelectPage={setIsSelectPage}
+ selectedType={selectedType}
+ setSelectedType={setSelectedType}
+ isManualInput={isManualInput}
+ setIsManualInput={setIsManualInput}
+ selectedCompany={selectedCompany}
+ role={currentRole} // 传递角色信息给PartyInfo组件
+ isFromCaseDes={isFromCaseDesClick} // 传递是否从caseDes点击进入的标志给PartyInfo组件
+ />
+ </>
+ )}
+ </>
+ );
+};
+
+// 根据角色获取标题
+function getTitle(role) {
+ switch (role) {
+ case 'applicant':
+ return '添加申请方当事人';
+ case 'applicantAgent':
+ return '添加申请方代理人';
+ case 'respondent':
+ return '添加被申请方当事人';
+ case 'respondentAgent':
+ return '添加被申请方代理人';
+ default:
+ return '添加申请方当事人';
+ }
+}
+
+export default LegalPerson;
diff --git a/src/views/selfInspection/legalPerson/index.jsx b/src/views/selfInspection/legalPerson/index.jsx
new file mode 100644
index 0000000..5eacf76
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/index.jsx
@@ -0,0 +1,201 @@
+import React, { useState, useEffect } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import NavBarPage from '../../../components/NavBarPage';
+import PartyInfo from './partyInfo';
+import { Input, Button, Toast } from 'dingtalk-design-mobile';
+import { SearchOutlined, WriteEditOutlined } from 'dd-icons';
+import './index.less';
+import * as $$ from '../../../utils/utility';
+
+function getIdApi() {
+ return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
+}
+
+const LegalPerson = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const perType = $$.getQueryString('perType');
+ const perTypeName = $$.getQueryString('perTypeName');
+ const edit = $$.getQueryString('edit');
+
+ const [isSelectPage, setIsSelectPage] = useState(false);
+ const [searchValue, setSearchValue] = useState('');
+ const [selectedType, setSelectedType] = useState('natural');
+ const [isManualInput, setIsManualInput] = useState(false);
+ const [showList, setShowList] = useState(false);
+ const [selectedCompany, setSelectedCompany] = useState(null);
+ const [searchKeyword, setSearchKeyword] = useState('');
+ const [isFromCaseDesClick, setIsFromCaseDesClick] = useState(false); // 记录是否从caseDes弹窗点击进入
+ const [newId, setNewId] = useState('');
+ // 编辑的对象
+ const [editObj, setEditObj] = useState({});
+
+ async function getId() {
+ const res = await getIdApi();
+ if (res.type) {
+ setNewId(res.data);
+ setEditObj({ id: res.data || '', perType, perTypeName });
+ }
+ }
+
+ //
+ useEffect(() => {
+ if (edit === 'false') {
+ getId();
+ } else {
+ // 获取编辑的对象
+ const newData = $$.getLocal('case_personnel_data');
+ setEditObj(newData);
+ }
+ }, []);
+
+ const handleSearch = () => {
+ setSearchKeyword(searchValue);
+ setShowList(true);
+ };
+
+ // 高亮显示搜索文本的函数
+ const highlightText = (text, keyword) => {
+ if (!keyword.trim() || !text.includes(keyword)) {
+ return <span>{text}</span>;
+ }
+
+ const parts = text.split(new RegExp(`(${keyword})`, 'gi'));
+ return (
+ <span className="text-container">
+ {parts.map((part, index) =>
+ part.toLowerCase() === keyword.toLowerCase() ? (
+ <span key={index} className="highlight-text">
+ {part}
+ </span>
+ ) : (
+ <span key={index}>{part}</span>
+ )
+ )}
+ </span>
+ );
+ };
+
+ const handleBack = () => {
+ if (isManualInput) {
+ setIsManualInput(false);
+ } else {
+ history.goBack();
+ }
+ };
+
+ // 处理公司卡片点击事件
+ const handleCompanySelect = (company) => {
+ setSelectedCompany(company);
+ setIsSelectPage(false);
+ setIsManualInput(true);
+
+ // 选择公司后提示用户
+ Toast.success({
+ content: '已选择企业',
+ duration: 1,
+ });
+ };
+
+ const testSelectList = [];
+
+ return (
+ <>
+ {isSelectPage ? (
+ <>
+ <NavBarPage
+ leftContentVisible={true}
+ title={selectedType === 'legal' ? '选择企业' : '选择组织'}
+ leftContentFunc={setIsSelectPage}
+ rightContentFunc={() => {
+ setIsSelectPage(false);
+ setIsManualInput(true);
+ }}
+ rightChildren={
+ <>
+ <WriteEditOutlined />
+ 手动填写
+ </>
+ }
+ />
+ <div className="main-container">
+ <div className="search-container">
+ <div className="search-context">
+ <div className="search-icon">
+ <SearchOutlined />
+ </div>
+ <Input placeholder="企业名称/统一社会信用代码" value={searchValue} onChange={(value) => setSearchValue(value)} />
+
+ <div className="search-button" onClick={handleSearch}>
+ <p className="search-split">|</p>
+ <p className="search-text">查询</p>
+ </div>
+ </div>
+ </div>
+ {showList ? (
+ <div className="company-list">
+ {testSelectList.map((item, index) => (
+ <div key={index} className="company-item" onClick={() => handleCompanySelect(item)}>
+ <div className="company-title">{highlightText(item.title, searchKeyword)}</div>
+ <div className="company-info">
+ <div>
+ <span className="label">统一社会信用代码：</span>
+ <span className="value">{highlightText(item.creditCode, searchKeyword)}</span>
+ </div>
+ <div>
+ <span className="label">法定代表人：</span>
+ <span className="value">{highlightText(item.legalPerson, searchKeyword)}</span>
+ </div>
+ <div>
+ <span className="label">企业所在地：</span>
+ <span className="value">{highlightText(item.companyLocation, searchKeyword)}</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ ) : (
+ <div className="select-none">
+ <div className="select-icon"></div>
+ <div className="select-icon-text">暂无数据</div>
+ </div>
+ )}
+ </div>
+ </>
+ ) : (
+ <>
+ <NavBarPage leftContentVisible={true} title={(edit === 'true' ? '修改' : '添加') + getTitle(perType)} leftContentFunc={handleBack} />
+ <PartyInfo
+ setIsSelectPage={setIsSelectPage}
+ selectedType={selectedType}
+ setSelectedType={setSelectedType}
+ isManualInput={isManualInput}
+ setIsManualInput={setIsManualInput}
+ selectedCompany={selectedCompany}
+ role={perType} // 传递角色信息给PartyInfo组件
+ editObj={editObj}
+ isFromCaseDes={isFromCaseDesClick} // 传递是否从caseDes点击进入的标志给PartyInfo组件
+ />
+ </>
+ )}
+ </>
+ );
+};
+
+// 根据角色获取标题
+function getTitle(role) {
+ switch (role) {
+ case '15_020008-1':
+ return '申请方当事人';
+ case '24_00006-1':
+ return '申请方代理人';
+ case '15_020008-2':
+ return '被申请方当事人';
+ case '24_00006-2':
+ return '被申请方代理人';
+ default:
+ return '';
+ }
+}
+
+export default LegalPerson;
diff --git a/src/views/selfInspection/legalPerson/index.less b/src/views/selfInspection/legalPerson/index.less
new file mode 100644
index 0000000..4287456
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/index.less
@@ -0,0 +1,304 @@
+/* 企业列表样式，用于选择企业页面 */
+.company-list {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ width: 100%;
+ padding-top: 0;
+ margin-top: 0;
+ gap: 8px;
+ /* 单个企业卡片项样式 */
+ .company-item {
+ background-color: #ffffff;
+ width: 319px;
+ height: 101px;
+ background: #ffffff;
+ border-radius: 2px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+ padding: 12px;
+ // margin: 0px 12px;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ text-align: left;
+ gap: 4px;
+
+ /* 企业卡片内容区域样式 */
+ .item-content {
+ font-size: 14px;
+ color: rgba(23, 26, 29, 0.6);
+ line-height: 20px;
+ }
+
+ /* 企业名称样式 */
+ .company-title {
+ font-size: 15px;
+ font-weight: 400;
+ color: #171a1d;
+ line-height: 23px;
+ width: 100%;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ // margin-bottom: 8px;
+ }
+
+ /* 企业信息区域样式 */
+ .company-info {
+ width: 100%;
+
+ div {
+ font-size: 14px;
+ line-height: 22px;
+ margin-bottom: 4px;
+ width: 100%;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ /* 标签样式，如"统一社会信用代码："*/
+ span.label {
+ color: rgba(23, 26, 29, 0.6);
+ margin-right: 4px;
+ }
+
+ /* 值样式，显示实际信息 */
+ span.value {
+ color: rgba(23, 26, 29, 0.85);
+ }
+ }
+ }
+ }
+}
+
+/* 选择列表样式，用于从搜索结果中选择企业 */
+.select-list {
+ margin-top: 52px;
+ padding: 0 16px;
+ background: #ffffff;
+
+ /* 列表项样式 */
+ .list-item {
+ padding: 16px 0;
+ border-bottom: 1px solid #f2f3f5;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ /* 企业名称样式 */
+ .company-name {
+ font-size: 16px;
+ font-weight: 500;
+ color: #171a1d;
+ line-height: 24px;
+ margin-bottom: 8px;
+ }
+
+ /* 企业信息样式 */
+ .company-info {
+ font-size: 14px;
+ color: rgba(23,26,29,0.6);
+ line-height: 20px;
+ margin-bottom: 4px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+}
+
+/* 主容器样式，位于导航栏下方 */
+.main-container {
+ position: absolute;
+ top: 44px;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+}
+
+/* 无选择状态样式，显示"暂无数据"的空状态 */
+.select-none {
+ width: 100%;
+ // padding-top: 64px;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+
+ /* 空状态图标样式 */
+ .select-icon {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ height: calc(100vh - 120px);
+
+ &::before {
+ content: "";
+ width: 260px;
+ height: 260px;
+ background: url('../../../assets/img/select_null.png') center/cover no-repeat;
+ }
+ }
+
+ /* 空状态文本样式 */
+ .select-icon-text {
+ text-align: center;
+ margin-top: -150px;
+ // width: 68px;
+ height: 25px;
+ // background: rgba(23,26,29,0.40);
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: CENTER;
+ color: rgba(23,26,29,0.40);
+ line-height: 25px;
+ }
+}
+
+/* 搜索容器样式 */
+.search-container {
+ width: 100%;
+ height: 52px;
+ background-color: #ffffff;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-bottom: 12px;
+ box-sizing: border-box;
+}
+
+/* 搜索框上下文样式 */
+.search-context {
+ width: 351px;
+ height: 36px;
+ background: #f2f3f5;
+ border-radius: 5px;
+ display: flex;
+ align-items: center;
+
+ /* 搜索图标样式 */
+ .search-icon {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-left: 6px;
+ width: 24px;
+ }
+
+ /* 钉钉输入框样式覆盖 */
+ .dtm-input-item{
+ margin-left: 6px;
+ flex: 1;
+ background: #f2f3f5;
+ .dtm-input-item-input{
+ background-color: #f2f3f5;
+ border: none;
+ outline: none;
+ }
+ .dtm-input-item-desktop-input{
+ padding: 0px;
+ background: #f2f3f5;
+ border: none;
+ outline: none;
+ label{
+ .dtm-input-item-input{
+ background-color: #f2f3f5;
+ border: none;
+ outline: none;
+ }
+ }
+ }
+ }
+}
+
+/* 高亮文本样式，用于搜索结果中匹配的关键词 */
+.highlight-text {
+ color: #1a6fb8;
+ font-weight: 500;
+}
+
+/* 搜索按钮样式 */
+.search-button {
+ display: flex;
+ align-items: center;
+ padding: 0 8px;
+ /* 搜索按钮分隔线 */
+ .search-split{
+ opacity: 0.3;
+ }
+ /* 搜索按钮文本 */
+ .search-text{
+ height: 24px;
+ font-size: 16px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: LEFT;
+ color: #1a6fb8;
+ line-height: 24px;
+ }
+ p{
+ margin-left: 8px;
+ }
+}
+
+/* 表单项标签样式，用于包含识别按钮的标签 */
+.form-item-label {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+
+ /* 营业执照识别按钮样式 */
+ .license-recognition-btn {
+ background: none;
+ color: #1a6fb8;
+ border: none;
+ height: 32px;
+ padding: 0;
+ font-size: 14px;
+ white-space: nowrap;
+ line-height: 32px;
+ display: flex;
+ align-items: center;
+ min-width: 100px;
+
+ /* 身份证图标样式 */
+ .id-card-icon {
+ font-size: 16px;
+ margin-right: 4px;
+ flex-shrink: 0;
+ }
+
+ /* 按钮文本样式 */
+ .dtm-button-text {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ padding: 0;
+ margin: 0;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ color: #1a6fb8;
+ line-height: 32px;
+ flex: 1;
+ }
+
+ /* 按钮激活状态样式 */
+ &:active {
+ opacity: 0.8;
+ }
+ }
+}
+
+
+
diff --git a/src/views/selfInspection/legalPerson/partyInfo.jsx b/src/views/selfInspection/legalPerson/partyInfo.jsx
new file mode 100644
index 0000000..e672d32
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/partyInfo.jsx
@@ -0,0 +1,556 @@
+import React, { useState, useEffect } from 'react';
+import './index.less';
+import './partyInfo.less';
+import DingUpload from '../components/DingUpload';
+import { Radio, Message, Space } from '@arco-design/web-react';
+import * as $$ from '../../../utils/utility';
+import { AchieveFilled, AgencyOutlined, Preview, Delete, WarningFilled } from 'dd-icons';
+import { ax, showToast, setLocal, isDebug, clearLocal, getQueryString, catchApiError, confirmModal } from '../../../utils/utility';
+import { InputItem, Button, TextareaItem, DatePicker, Rate, Slider, Stepper, Switch, Select, Upload, Toast, Card } from 'dingtalk-design-mobile';
+import CustomFormView from '../../../components/CustomFormView';
+import fileUploadIcon from '../../../assets/img/file_upload.png';
+import fileDeleteIcon from '../../../assets/img/file_delete.png';
+import { useHistory } from 'react-router-dom';
+
+// 设置缓存的键名
+const PARTY_INFO_CACHE_KEY = 'party_info_form_data';
+// 设置表单是否已清空的标志键名
+const FORM_CLEARED_FLAG_KEY = 'party_info_form_cleared';
+
+const appUrl = $$.appUrl;
+
+// 获取新的时间ID接口
+function getNewTimeCaseId() {
+ return $$.ax.request({ url: `caseUtils/getNewTimeCaseId`, type: 'get', service: 'utils' });
+}
+
+const PartyInfo = ({
+ setIsSelectPage,
+ selectedType,
+ setSelectedType,
+ isManualInput,
+ setIsManualInput,
+ selectedCompany,
+ role = 'applicant',
+ isFromCaseDes = false,
+ mainId,
+ editObj,
+ setMainId,
+}) => {
+ const [formValues, setFormValues] = useState(editObj);
+ const [businessLicenseFiles, setBusinessLicenseFiles] = useState([]);
+ const [legalPersonFiles, setLegalPersonFiles] = useState([]);
+ const [idCardMaterialFiles, setIdCardMaterialFiles] = useState([]);
+ const [idCardMaterialResponses, setIdCardMaterialResponses] = useState([]);
+ const [cachedNaturalPersons, setCachedNaturalPersons] = useState([]);
+ const [caseId, setCaseId] = useState(''); // 存储从接口获取的ID
+ const history = useHistory();
+
+ // 设置表单初始值
+ useEffect(() => {
+ if (selectedType === 'natural') {
+ setFormValues((prev) => ({
+ ...editObj,
+ ...prev,
+ // 民族默认值：汉族
+ nation: '09_00005-1',
+ nationName: '汉族',
+ // 性别默认值：男
+ sex: '09_00003-1',
+ sexName: '男',
+ // 是否有个人极端倾向默认值：否
+ extreme: '1',
+ extremeName: '否',
+ }));
+ }
+ }, [selectedType, editObj]);
+
+ // 根据 selectedType 获取当事人类型信息
+
+ const handleSubmit = () => {
+ // natural 对应 09_01001-1
+ // legal 对应 09_01001-2
+ // nonlegal 对应 09_01001-3
+ let perClass = '';
+ let perClassName = '';
+
+ switch (selectedType) {
+ case 'natural':
+ perClass = '09_01001-1';
+ perClassName = '自然人';
+ break;
+ case 'legal':
+ perClass = '09_01001-2';
+ perClassName = '法人';
+ break;
+ case 'nonlegal':
+ perClass = '09_01001-3';
+ perClassName = '非法人组织';
+ break;
+ default:
+ break;
+ }
+
+ console.log('提交表单:', { ...formValues, perClass, perClassName });
+ // 将之前保存的数据与现在的数据一起保存
+ const dataList = $$.getLocal('case_personnel_cache');
+ if (dataList) {
+ dataList.push({ ...formValues, perClass, perClassName });
+ } else {
+ dataList = [{ ...formValues, perClass, perClassName }];
+ }
+ $$.setLocal('case_personnel_cacheList', dataList);
+ history.goBack(-1);
+ };
+
+ const handleFormChange = (data, name) => {
+ setFormValues({ ...formValues, ...data });
+ };
+
+ const handleSelectPerson = (name, value) => {
+ setFormValues({ ...formValues, [name]: value });
+ };
+
+ const handleUpload = (name, value) => {
+ setFormValues({ ...formValues, [name]: value });
+ };
+
+ const handleTypeSelect = (type) => {
+ setSelectedType(type);
+ if (type !== 'legal') {
+ setIsManualInput(false);
+ }
+ };
+
+ // 渲染缓存的自然人卡片
+ const renderCachedNaturalPersons = () => {
+ // 不显示历史填写记录
+ return null;
+ };
+
+ // 构建自然人表单配置
+ const getNaturalPersonFormConfig = () => [
+ {
+ list: [
+ {
+ type: 'textBrief',
+ name: 'trueName',
+ label: '姓名',
+ placeholder: '请填写',
+ require: true,
+ itemStyle: {
+ paddingTop: '12px',
+ },
+ },
+ {
+ type: 'textBrief',
+ name: 'mobile',
+ label: '联系方式',
+ placeholder: '请填写手机号码',
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'select',
+ name: 'certiType',
+ desc: 'certiTypeName',
+ placeholder: '请选择',
+ label: '证件类型',
+ list: $$.selectOption.cardType,
+ },
+ {
+ type: 'textBrief',
+ name: 'certiNo',
+ label: '证件号码',
+ placeholder: '请填写完整证件号码',
+ },
+ {
+ type: 'textarea',
+ name: 'addr',
+ label: '联系地址',
+ placeholder: '请填写详细地址',
+ tabs: 2,
+ },
+ {
+ type: 'textarea',
+ name: 'placeAddr',
+ label: '户籍地址',
+ placeholder: '请填写详细地址',
+ tabs: 2,
+ },
+ {
+ type: 'textarea',
+ name: 'workUnit',
+ label: '工作单位',
+ placeholder: '请填写单位全名',
+ tabs: 2,
+ },
+ {
+ type: 'select',
+ name: 'nation',
+ desc: 'nationName',
+ placeholder: '请选择',
+ label: '民族',
+ list: $$.selectOption.nation,
+ },
+ {
+ type: 'radio',
+ name: 'sex',
+ desc: 'sexName',
+ label: '性别',
+ list: $$.selectOption.sex,
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'radio',
+ name: 'extreme',
+ label: (
+ <span style={{ color: '#F53F3F' }}>
+ <img src={require('../../../assets/img/riskMask.png')} style={{ marginRight: '4px' }} />
+ 是否有个人极端倾向
+ </span>
+ ),
+ list: [
+ { label: '是', value: '0' },
+ { label: '否', value: '1' },
+ ],
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'dingUpload',
+ name: 'idCardMaterial',
+ label: '身份证明材料',
+ placeholder: '请上传',
+ mainId: new Date().getTime(),
+ ownerType: '22_00018-202',
+ ownerId: formValues.id || '',
+ },
+ ],
+ },
+ ];
+
+ // 构建法人表单配置
+ const getLegalPersonFormConfig = () => [
+ {
+ list: [
+ {
+ type: 'textBrief',
+ name: 'companyName',
+ label: '企业名称',
+ placeholder: '请填写',
+ require: true,
+ itemStyle: {
+ paddingTop: '12px',
+ },
+ },
+ {
+ type: 'textBrief',
+ name: 'contactPhone',
+ label: '联系方式',
+ placeholder: '请填写手机号码',
+ require: true,
+ },
+ {
+ type: 'textBrief',
+ name: 'companyLocation',
+ label: '组织所在地',
+ placeholder: '请填写',
+ },
+ {
+ type: 'textBrief',
+ name: 'creditCode',
+ label: '统一社会信用代码',
+ placeholder: '请填写',
+ },
+ {
+ type: 'select',
+ name: 'companyType',
+ label: '企业类型',
+ list: [
+ { label: 'A', value: '1' },
+ { label: 'B', value: '2' },
+ { label: 'C', value: '3' },
+ ],
+ },
+ {
+ type: 'textBrief',
+ name: 'legalRepresentative',
+ label: '法定代表人',
+ placeholder: '请填写',
+ },
+ {
+ type: 'textBrief',
+ name: 'address',
+ label: '住所',
+ placeholder: '请填写',
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'dingUpload',
+ name: 'businessLicense',
+ label: '企业登记材料',
+ placeholder: '请上传',
+ ownerType: '22_00018-203',
+ ownerId: caseId || '',
+ },
+ {
+ type: 'dingUpload',
+ name: 'legalPersonId',
+ label: '法定代表人身份证明材料',
+ placeholder: '请上传',
+ ownerType: '22_00018-204',
+ ownerId: caseId || '',
+ },
+ ],
+ },
+ ];
+
+ // 构建非法人组织表单配置
+ const getNonLegalFormConfig = () => [
+ {
+ list: [
+ {
+ type: 'textBrief',
+ name: 'companyName',
+ label: '组织名称',
+ placeholder: '请填写',
+ require: true,
+ itemStyle: {
+ paddingTop: '12px',
+ },
+ },
+ {
+ type: 'textBrief',
+ name: 'contactPhone',
+ label: '联系方式',
+ placeholder: '请填写手机号码',
+ require: true,
+ },
+ {
+ type: 'textBrief',
+ name: 'companyLocation',
+ label: '组织所在地',
+ placeholder: '请填写',
+ },
+ {
+ type: 'textBrief',
+ name: 'creditCode',
+ label: '统一社会信用代码',
+ placeholder: '请填写',
+ },
+ {
+ type: 'select',
+ name: 'companyType',
+ label: '组织类型',
+ list: [
+ { label: 'A', value: '1' },
+ { label: 'B', value: '2' },
+ { label: 'C', value: '3' },
+ ],
+ },
+ {
+ type: 'textBrief',
+ name: 'legalRepresentative',
+ label: '负责人',
+ placeholder: '请填写',
+ },
+ {
+ type: 'textBrief',
+ name: 'address',
+ label: '住所',
+ placeholder: '请填写',
+ },
+ ],
+ },
+ {
+ list: [
+ {
+ type: 'dingUpload',
+ name: 'businessLicense',
+ label: '组织登记材料',
+ placeholder: '请上传',
+ ownerType: '22_00018-203',
+ ownerId: caseId || '',
+ },
+ {
+ type: 'dingUpload',
+ name: 'legalPersonId',
+ label: '负责人身份证明材料',
+ placeholder: '请上传',
+ ownerType: '22_00018-204',
+ ownerId: caseId || '',
+ },
+ ],
+ },
+ ];
+
+ // 从接口获取新的ID
+ const getAppId = async () => {
+ try {
+ // 先尝试从sessionStorage获取新案件ID
+ const storedCaseId = sessionStorage.getItem('newCaseId');
+
+ if (storedCaseId) {
+ setCaseId(storedCaseId);
+ // 如果外部提供了setMainId方法，也更新外部的mainId
+ if (setMainId) {
+ setMainId(storedCaseId);
+ }
+ return;
+ }
+
+ // 如果sessionStorage中没有，再从接口获取
+ const res = await getNewTimeCaseId();
+ if (res.type && res.data) {
+ console.log('从接口获取新案件ID:', res.data);
+ setCaseId(res.data);
+ // 如果外部提供了setMainId方法，也更新外部的mainId
+ if (setMainId) {
+ setMainId(res.data);
+ }
+ // 存储到sessionStorage，以便其他组件使用
+ sessionStorage.setItem('newCaseId', res.data);
+ } else {
+ $$.showToast({ content: '获取案件ID失败' });
+ }
+ } catch (error) {
+ console.error('获取ID错误:', error);
+ $$.showToast({ content: '获取案件ID失败' });
+ }
+ };
+
+ // 组件挂载时获取新ID
+ useEffect(() => {
+ // 如果已有mainId则使用现有的，否则获取新ID
+ if (mainId) {
+ setCaseId(mainId);
+ } else {
+ getAppId();
+ }
+ }, []);
+
+ return (
+ <div className="party-info-container">
+ <div className="content-wrapper">
+ <div className="personnel-type section">
+ <div className="personnel-type-title">人员类型</div>
+ <div className="personnel-type-content">
+ <div className={`type-option ${selectedType === 'natural' ? 'selected' : ''}`} onClick={() => handleTypeSelect('natural')}>
+ {selectedType === 'natural' && <AchieveFilled className="selected-icon" />}
+ <div className="type-icon natural-person"></div>
+ <div className="type-name">自然人</div>
+ </div>
+ <div className={`type-option ${selectedType === 'legal' ? 'selected' : ''}`} onClick={() => handleTypeSelect('legal')}>
+ {selectedType === 'legal' && <AchieveFilled className="selected-icon" />}
+ <div className="type-icon legal-person"></div>
+ <div className="type-name">法人</div>
+ </div>
+ <div className={`type-option ${selectedType === 'nonlegal' ? 'selected' : ''}`} onClick={() => handleTypeSelect('nonlegal')}>
+ {selectedType === 'nonlegal' && <AchieveFilled className="selected-icon" />}
+ <div className="type-icon non-legal-person"></div>
+ <div className="type-name">非法人组织</div>
+ </div>
+ </div>
+ </div>
+
+ {/* 自然人 */}
+ {selectedType === 'natural' && (
+ <div className="natural-person-content-wrapper">
+ <CustomFormView
+ formConfig={getNaturalPersonFormConfig()}
+ formData={formValues}
+ onChange={handleFormChange}
+ onSelectPerson={handleSelectPerson}
+ onUpload={handleUpload}
+ />
+ </div>
+ )}
+
+ {/* 法人 */}
+ {selectedType === 'legal' && (
+ <>
+ {!isManualInput ? (
+ <>
+ <div id="companyInfo" onClick={() => setIsSelectPage(true)}>
+ <div
+ className="select-company-item"
+ style={{ padding: '0 0 0 16px', backgroundColor: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
+ >
+ <div className="select-company-label">企业信息</div>
+ <div className="select-company-value">
+ <Select mode="single" placeholder="请选择" />
+ </div>
+ </div>
+ </div>
+ </>
+ ) : (
+ <>
+ <CustomFormView
+ formConfig={getLegalPersonFormConfig()}
+ formData={formValues}
+ onChange={handleFormChange}
+ onSelectPerson={handleSelectPerson}
+ onUpload={handleUpload}
+ />
+ </>
+ )}
+ </>
+ )}
+
+ {/* 非法人组织 */}
+ {selectedType === 'nonlegal' && (
+ <>
+ {!isManualInput ? (
+ <>
+ <div id="companyInfo" onClick={() => setIsSelectPage(true)}>
+ <div
+ className="select-company-item"
+ style={{ padding: '0 0 0 16px', backgroundColor: '#fff', display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}
+ >
+ <div className="select-company-label">组织信息</div>
+ <div className="select-company-value">
+ <Select mode="single" placeholder="请选择" options={[]} />
+ </div>
+ </div>
+ </div>
+ </>
+ ) : (
+ <>
+ <CustomFormView
+ formConfig={getNonLegalFormConfig()}
+ formData={formValues}
+ onChange={handleFormChange}
+ onSelectPerson={handleSelectPerson}
+ onUpload={handleUpload}
+ />
+ </>
+ )}
+ </>
+ )}
+ </div>
+
+ <div style={{ backgroundColor: '#f2f3f5', height: '8px', width: '100%' }}></div>
+
+ {(isManualInput || selectedType === 'natural') && (
+ <div className="bottom-button-area">
+ <Button className="save-button" type="primary" onClick={handleSubmit}>
+ <p className="save-button-text">保存</p>
+ </Button>
+ </div>
+ )}
+ </div>
+ );
+};
+
+export default PartyInfo;
diff --git a/src/views/selfInspection/legalPerson/partyInfo.less b/src/views/selfInspection/legalPerson/partyInfo.less
new file mode 100644
index 0000000..f855882
--- /dev/null
+++ b/src/views/selfInspection/legalPerson/partyInfo.less
@@ -0,0 +1,830 @@
+/* 当事人信息页面的主容器 */
+.party-info-container {
+ position: absolute;
+ top: 44px;
+ width: 100%;
+ padding-bottom: 68px;
+
+ /* 内容区包装器，用于表单及所有区块的排列 */
+ .content-wrapper {
+ display: flex;
+ flex-direction: column;
+ /* 每个表单区块的通用样式 */
+ .section {
+ background-color: #ffffff;
+ }
+
+ /* 两行布局样式，用于姓名和联系方式 */
+ .form-two-column-layout {
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ margin-bottom: 8px;
+ padding: 12px 0;
+ background-color: #ffffff;
+
+ /* 姓名和联系方式的表单项样式 */
+ .dtm-form-item-required-label::before {
+ display: inline-block;
+ margin-right: 4px;
+ color: #ff0000;
+ font-size: 15px;
+ line-height: 1;
+ content: '*';
+ vertical-align: middle;
+ }
+
+ .dtm-form-item-default-label {
+ display: flex;
+ align-items: center;
+ padding: 12px 0;
+ }
+
+ .dtm-form-item-default {
+ padding: 0;
+ }
+
+ .form-component-wrapper {
+ width: 100%;
+
+ &.form-input-wrapper,
+ &.form-textarea-wrapper {
+ box-sizing: border-box;
+ display: block;
+ }
+ }
+ }
+
+ /* 企业信息下拉选择区域样式 */
+ #companyInfo {
+ min-height: 47px;
+ height: 47px;
+ .dtm-form-item-default-label {
+ font-size: 15px;
+ }
+ > .dtm-list-item {
+ min-height: 47px;
+ height: 47px;
+ padding-right: 16px;
+ > .dtm-list-line {
+ min-height: 47px;
+ padding: 0px;
+ }
+ }
+ }
+ /* 人员类型选择区域样式 */
+ .personnel-type {
+ height: 132px;
+ padding-left: 16px;
+ margin-bottom: 8px;
+
+ /* 人员类型标题样式 */
+ &-title {
+ padding-top: 12px;
+ padding-bottom: 8px;
+ width: 60px;
+ height: 23px;
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ color: #171a1d;
+ line-height: 23px;
+ }
+
+ /* 人员类型选项容器 */
+ &-content {
+ display: flex;
+
+ /* 每个类型选项的样式 */
+ .type-option {
+ display: flex;
+ margin-right: 16px;
+ width: 104px;
+ height: 63px;
+ flex-direction: column;
+ align-items: center;
+ cursor: pointer;
+ border: 1px solid #e8e8e8;
+ border-radius: 8px;
+ padding-top: 9px;
+
+ /* 选中状态样式 */
+ &.selected {
+ border-color: #1a6fb8;
+ position: relative;
+
+ /* 选中图标样式 */
+ .selected-icon {
+ position: absolute;
+ top: 5px;
+ right: 5px;
+ color: #1a6fb8;
+ font-size: 16px;
+ z-index: 1;
+ }
+
+ /* 选中状态下的类型图标样式 */
+ .type-icon {
+ &.natural-person {
+ background: url('../../../assets/img/natural_person_1.png') center/cover no-repeat;
+ }
+
+ &.legal-person {
+ background: url('../../../assets/img/legal_person_1.png') center/cover no-repeat;
+ }
+
+ &.non-legal-person {
+ background: url('../../../assets/img/unincorporated_org_1.png') center/cover no-repeat;
+ }
+ }
+
+ /* 选中状态下的类型名称样式 */
+ .type-name {
+ color: #1a6fb8;
+ }
+ }
+ /* 默认状态下的类型图标样式 */
+ .type-icon {
+ width: 32px;
+ height: 32px;
+ background-color: #f5f5f5;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ &.natural-person {
+ background: url('../../../assets/img/natural_person_0.png') center/cover no-repeat;
+ }
+
+ &.legal-person {
+ background: url('../../../assets/img/legal_person_0.png') center/cover no-repeat;
+ }
+
+ &.non-legal-person {
+ background: url('../../../assets/img/unincorporated_org_0.png') center/cover no-repeat;
+ }
+ }
+
+ /* 类型名称样式 */
+ .type-name {
+ padding-top: 4px;
+ padding-bottom: 5px;
+ line-height: 23px;
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ color: #171a1d 60%;
+ text-align: center;
+ }
+ }
+ }
+ }
+
+ //自然人表单区域样式
+ .natural-person-content-wrapper {
+ //自然人表单内容样式
+ .dtm-list-content {
+ width: 100%;
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ color: #171a1d;
+ line-height: 23px;
+ }
+ //自然人表单项样式
+ .dtm-form-item-default {
+ font-size: 15px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ color: #171a1d;
+ line-height: 23px;
+ }
+ // 身份证明材料特殊样式
+ .id-card-materials-item {
+ .dtm-form-item-default {
+ min-height: 47px;
+ padding: 0;
+ }
+
+ .dtm-list-content {
+ width: 100%;
+ }
+
+ .dtm-list-line {
+ min-height: 47px;
+ padding: 0;
+ }
+
+ .dtm-form-item-default-field {
+ text-align: right;
+ padding-right: 14px;
+ margin-right: 16px;
+ }
+
+ .dtm-upload {
+ width: auto !important;
+ justify-content: flex-end;
+ }
+ }
+
+ // 身份证明材料文件列表容器样式
+ .id-card-files-container {
+ padding: 0 16px;
+ margin-bottom: 8px;
+ background-color: #ffffff;
+
+ .file-item {
+ display: flex;
+ align-items: center;
+ padding: 12px 0;
+ border-bottom: 1px solid #f2f3f5;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .file-icon {
+ width: 36px;
+ height: 42px;
+ margin-right: 12px;
+ flex-shrink: 0;
+ }
+
+ .file-info {
+ flex: 1;
+ min-width: 0;
+
+ .file-name {
+ font-size: 14px;
+ color: #171a1d;
+ line-height: 20px;
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ .file-size-preview {
+ display: flex;
+ align-items: center;
+ font-size: 12px;
+ line-height: 17px;
+
+ .file-size {
+ color: rgba(23, 26, 29, 0.6);
+ margin-right: 8px;
+ }
+
+ .preview-text {
+ color: #1a6fb8;
+ cursor: pointer;
+ }
+ }
+ }
+
+ .file-actions {
+ margin-left: 8px;
+
+ .delete-btn-wrapper {
+ cursor: pointer;
+
+ .delete-icon {
+ width: 16px;
+ height: 16px;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ /* 企业信息区域样式 */
+ .company-info {
+ margin-bottom: 8px;
+ .dtm-list-line {
+ padding: 12px 0px;
+ padding-right: 16px;
+ height: 50px;
+ }
+ .dtm-list-content {
+ // height: 47px;
+ padding: 0px;
+ .form-item-label {
+ padding: 0px;
+ }
+ }
+
+ /* 表单项标签容器样式 */
+ .form-item-label {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ // min-height: 47px;
+ width: 100%;
+
+ /* 标签文本样式 */
+ .form-item-label-text {
+ flex: 1;
+ width: 50%;
+ font-size: 15px;
+ }
+
+ /* 营业执照识别按钮样式 */
+ .license-recognition-btn {
+ font-size: 15px;
+ flex: 1;
+ width: 50%;
+ text-align: right;
+ padding: 0;
+ background: none;
+ border: none;
+ color: #1a6fb8;
+ margin: 0px;
+ .dtm-button-text {
+ // 靠右显示
+ justify-content: flex-end;
+ }
+
+ .id-card-icon {
+ margin-right: 4px;
+ }
+ }
+ }
+ }
+
+ /* 企业详细信息区域样式 */
+ .company-detail {
+ margin-bottom: 8px;
+ padding-right: 16px;
+ .dtm-list-item {
+ .dtm-list-line {
+ height: 74px;
+ padding: 0px;
+ }
+ }
+ .company-type-item {
+ .dtm-list-item {
+ min-height: 47px;
+ .dtm-list-line {
+ height: 47px;
+ padding: 0px;
+ }
+ }
+ }
+ }
+ .flex-center(@axis: both) {
+ display: flex;
+ justify-content: center; // 水平居中
+ align-items: center; // 垂直居中
+ flex-direction: @axis; // 可选参数，调整主轴方向
+ }
+ /* 企业登记材料和法定代表人身份证明材料区域样式 */
+ .registration-materials,
+ .legal-identity {
+ margin-bottom: 8px;
+ padding-right: 16px;
+ > .dtm-list-item {
+ min-height: 47px;
+ > .dtm-list-line {
+ min-height: 47px;
+ padding: 0px;
+ > .dtm-list-content {
+ > .dtm-form-item-default {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ width: 100%;
+ padding-right: 16px;
+
+ > .dtm-form-item-default-label {
+ flex: 3;
+ width: 100%;
+ min-width: 0;
+ padding-right: 12px;
+ word-break: break-word;
+ white-space: normal;
+ }
+ > .dtm-form-item-default-field {
+ flex: 1;
+ /* 上传容器样式 */
+ > .upload-container {
+ /* 上传按钮容器样式 */
+ .upload-button-container {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ justify-content: flex-end;
+ .dtm-upload {
+ justify-content: flex-end;
+ display: flex;
+ .dtm-list-item {
+ min-height: 47px;
+ .dtm-list-line {
+ padding: 0%;
+ min-height: 47px;
+ padding-right: 0;
+ .dd-icon {
+ .flex-center();
+ }
+ }
+ }
+ }
+ .dtm-divider {
+ width: 0px;
+ min-width: 0;
+ height: 0px;
+ margin: 0px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ /* 文件列表区域样式 */
+ .file-list {
+ padding: 0px;
+ padding-left: 16px;
+
+ /* 单个文件项样式 */
+ .file-item {
+ display: flex;
+ align-items: center;
+ padding: 13px 0;
+ // border-bottom: 1px solid #f2f3f5;
+
+ // &:last-child {
+ // border-bottom: none;
+ // }
+
+ /* 文件图标样式 */
+ .file-icon {
+ width: 42px;
+ height: 48px;
+ margin-right: 16px;
+ // flex-shrink: 0;
+ }
+
+ /* 文件信息区域样式 */
+ .file-info {
+ flex: 1;
+ min-width: 0;
+
+ /* 文件名称样式 */
+ .file-name {
+ font-size: 14px;
+ color: #171a1d;
+ line-height: 20px;
+ margin-bottom: 4px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
+
+ /* 文件大小和预览区域样式 */
+ .file-size-preview {
+ display: flex;
+ align-items: center;
+ font-size: 12px;
+ line-height: 17px;
+
+ /* 文件大小样式 */
+ .file-size {
+ color: rgba(23, 26, 29, 0.6);
+ margin-right: 4px;
+ }
+
+ /* 预览文本样式 */
+ .preview-text {
+ color: #1a6fb8;
+ cursor: pointer;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+
+ /* 文件操作区域样式 */
+ .file-actions {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 12px;
+ height: 100%;
+
+ /* 删除按钮包装器样式 */
+ .delete-btn-wrapper {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ height: 100%;
+
+ /* 删除图标样式 */
+ .delete-icon {
+ width: 16px;
+ height: 16px;
+
+ &:active {
+ opacity: 0.8;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ /* 反映诉求记录样式 */
+ .complaint-record {
+ background-color: #ffffff;
+ margin-bottom: 8px;
+
+ .complaint-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #171a1d;
+ margin-bottom: 12px;
+ text-align: left;
+ }
+
+ .complaint-stats {
+ .stats-item {
+ display: flex;
+ width: 300px;
+ margin-bottom: 8px;
+ font-size: 15px;
+ color: #4e5969;
+ line-height: 22px;
+ text-align: left;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+ }
+ }
+
+ /* 底部保存按钮区域样式 */
+ .bottom-button-area {
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 68px;
+ background-color: #ffffff;
+ z-index: 100;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 0;
+ margin: 0;
+ box-sizing: border-box;
+
+ /* 保存按钮样式 */
+ .save-button {
+ width: 343px;
+ height: 44px;
+ margin: 12px 0;
+ background: #1a6fb8;
+ border-radius: 8px;
+ padding: 0;
+
+ /* 保存按钮文本样式 */
+ &-text {
+ margin-top: 8px;
+ height: 24px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 17px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: center;
+ color: #ffffff;
+ }
+ }
+ }
+}
+
+/* 表单项标签样式，用于包含识别按钮的标签 */
+.form-item-label {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+
+ /* 营业执照识别按钮样式 */
+ .license-recognition-btn {
+ background: none;
+ color: #1a6fb8;
+ border: none;
+ height: 32px;
+ padding: 0;
+ font-size: 14px;
+ white-space: nowrap;
+ line-height: 32px;
+ display: flex;
+ align-items: center;
+ min-width: 100px;
+
+ /* 身份证图标样式 */
+ .id-card-icon {
+ font-size: 16px;
+ margin-right: 4px;
+ flex-shrink: 0;
+ }
+
+ /* 按钮文本样式 */
+ .dtm-button-text {
+ display: flex;
+ align-items: center;
+ height: 100%;
+ padding: 0;
+ margin: 0;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ text-align: left;
+ color: #1a6fb8;
+ line-height: 32px;
+ flex: 1;
+ }
+
+ /* 按钮激活状态样式 */
+ &:active {
+ opacity: 0.8;
+ }
+ }
+}
+
+/* 人员标签相关样式 */
+.card-select-container {
+ .label {
+ align-items: center;
+ justify-content: center;
+ width: 30px;
+ height: 24px;
+ border-radius: 4px;
+ font-size: 14px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ color: #ffffff;
+ padding: 8px;
+ margin-right: 8px;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ position: relative;
+ }
+
+ /* 标签被选中状态的样式 */
+ .label-selected {
+ transform: scale(1.1);
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+ }
+
+ .label-selected::after {
+ content: '✓';
+ position: absolute;
+ top: -5px;
+ right: -5px;
+ width: 15px;
+ height: 15px;
+ background-color: #fff;
+ border-radius: 50%;
+ color: #000;
+ font-size: 10px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-weight: bold;
+ }
+
+ /* 每个标签的不同背景色 */
+ .label:nth-child(1) {
+ background-color: #c874d9; /* 精 */
+ }
+
+ .label:nth-child(2) {
+ background-color: #4cd987; /* 流 */
+ }
+
+ .label:nth-child(3) {
+ background-color: #e6be41; /* 毒 */
+ }
+
+ .label:nth-child(4) {
+ background-color: #d95e94; /* 矫 */
+ }
+
+ .label:nth-child(5) {
+ background-color: #20b0b8; /* 刑 */
+ }
+
+ .label:nth-child(6) {
+ background-color: #377eee; /* 少 */
+ }
+
+ .label:nth-child(7) {
+ background-color: #5d9cee; /* 潜 */
+ }
+
+ .label:nth-child(8) {
+ background-color: #6764d7; /* 涉 */
+ }
+}
+
+// 添加缓存的自然人卡片样式
+.cached-natural-persons {
+ margin: 10px 16px;
+
+ .cache-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 10px;
+ }
+
+ .person-card {
+ background-color: #fff;
+ border-radius: 8px;
+ padding: 12px;
+ margin-bottom: 10px;
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
+
+ &:active {
+ background-color: #f5f5f5;
+ }
+
+ .person-info {
+ .person-name {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-bottom: 8px;
+ }
+
+ .person-details {
+ .detail-item {
+ display: flex;
+ margin-bottom: 4px;
+ font-size: 14px;
+
+ .detail-label {
+ color: #666;
+ margin-right: 8px;
+ min-width: 70px;
+ }
+
+ .detail-value {
+ color: #333;
+ flex: 1;
+ word-break: break-all;
+ }
+ }
+ }
+ }
+ }
+}
+
+/* Select组件样式调整 */
+:global {
+ .dtm-select {
+ .dtm-select-selector {
+ display: flex;
+ align-items: center;
+ height: 100%;
+
+ .dtm-select-selection-item {
+ display: flex;
+ align-items: center;
+ line-height: 1;
+ height: 100%;
+ padding: 0;
+ }
+
+ .dtm-select-arrow {
+ display: flex;
+ align-items: center;
+ margin-top: 0;
+ height: 100%;
+ position: absolute;
+ right: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ }
+ }
+ }
+
+ /* 全局InputItem样式调整 */
+ .dtm-input-item-input {
+ margin-bottom: 8px;
+ }
+}
diff --git a/src/views/selfInspection/readperson/index.jsx b/src/views/selfInspection/readperson/index.jsx
new file mode 100644
index 0000000..9c7b2e5
--- /dev/null
+++ b/src/views/selfInspection/readperson/index.jsx
@@ -0,0 +1,464 @@
+import React, { useState, useEffect } from 'react';
+import NavBarPage from '../../../components/NavBarPage';
+import { useLocation, useHistory } from 'react-router-dom';
+import { getLocal } from '../../../utils/utility';
+import './index.less';
+import {
+ List,
+ Form,
+ Input,
+ Button,
+ TextareaItem,
+ DatePicker,
+ Rate,
+ Slider,
+ Stepper,
+ Switch,
+ Select,
+ Upload,
+ Toast,
+ Tag,
+} from 'dingtalk-design-mobile';
+
+const Readperson = () => {
+ const location = useLocation();
+ const history = useHistory();
+ const [personData, setPersonData] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [personType, setPersonType] = useState('');
+ const [personRole, setPersonRole] = useState('');
+
+ useEffect(() => {
+ try {
+ // 从URL获取参数
+ const queryParams = new URLSearchParams(location.search);
+ const personId = queryParams.get('id');
+
+ if (!personId) {
+ Toast.fail('未找到人员信息');
+ setLoading(false);
+ return;
+ }
+
+ // 从缓存中获取人员信息
+ const personCacheKey = 'case_personnel_cache';
+ const cachedPersons = getLocal(personCacheKey) || [];
+
+ // 根据ID查找对应的人员数据
+ const targetPerson = cachedPersons.find(person => person.timestamp.toString() === personId);
+
+ if (!targetPerson) {
+ Toast.fail('未找到对应的人员信息');
+ setLoading(false);
+ return;
+ }
+
+ // 设置人员数据
+ setPersonData(targetPerson);
+
+ // 设置人员类型
+ switch (targetPerson.selectedType) {
+ case 'natural':
+ setPersonType('自然人');
+ break;
+ case 'legal':
+ setPersonType('法人');
+ break;
+ case 'nonlegal':
+ setPersonType('非法人组织');
+ break;
+ default:
+ setPersonType('未知类型');
+ }
+
+ // 设置角色类型
+ switch (targetPerson.role) {
+ case 'applicant':
+ setPersonRole('申请方当事人');
+ break;
+ case 'applicantAgent':
+ setPersonRole('申请方代理人');
+ break;
+ case 'respondent':
+ setPersonRole('被申请方当事人');
+ break;
+ case 'respondentAgent':
+ setPersonRole('被申请方代理人');
+ break;
+ default:
+ setPersonRole('未知角色');
+ }
+
+ setLoading(false);
+ } catch (error) {
+ console.error('加载人员信息失败:', error);
+ Toast.fail('加载人员信息失败');
+ setLoading(false);
+ }
+ }, [location]);
+
+ // 渲染自然人信息
+ const renderNaturalPerson = () => {
+ const formData = personData?.formData || {};
+
+ return (
+ <div className="person-info-container">
+ <div className="info-section">
+ <div className="info-item">
+ <span className="item-label">联系方式：</span>
+ <span className="item-value">{formData.phone || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">证件类型：</span>
+ <span className="item-value">
+ {formData.card === 'idcard' ? '身份证' :
+ formData.card === 'hukou' ? '户口本' :
+ formData.card === 'passport' ? '护照' :
+ formData.card === 'gangao' ? '港澳通行证' :
+ formData.card === 'taibao' ? '台胞证' :
+ formData.card === 'jun' ? '军官证' : '其他'}
+ </span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">证件号码：</span>
+ <span className="item-value">{formData.cardNumber || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">性别：</span>
+ <span className="item-value">{formData.gender === 'male' ? '男' : '女'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">民族：</span>
+ <span className="item-value">
+ {formData.nation === 'han' ? '汉族' :
+ formData.nation ? formData.nation : '无'}
+ </span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">联系地址：</span>
+ <span className="item-value">{formData.contactAddress || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">户籍地址：</span>
+ <span className="item-value">{formData.address || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">工作单位：</span>
+ <span className="item-value">{formData.workAddress || '无'}</span>
+ </div>
+ </div>
+
+ {personData.role.includes('Agent') && (
+ <div className="info-section">
+ <div className="section-title">代理信息</div>
+ <div className="info-item">
+ <span className="item-label">代理对象：</span>
+ <span className="item-value">{formData.agentObjectInfo?.name || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">委托关系：</span>
+ <span className="item-value">
+ {formData.agent_relationship === 'qinshu' ? '亲属' :
+ formData.agent_relationship === 'jianhu' ? '监护人' :
+ formData.agent_relationship === 'lvshi' ? '律师' :
+ formData.agent_relationship === 'shehui' ? '社会团体推荐的公民' :
+ formData.agent_relationship === 'danwei' ? '所在单位推荐的人' :
+ formData.agent_relationship === 'falu' ? '法律工作者' : '无'}
+ </span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">委托类型：</span>
+ <span className="item-value">
+ {formData.agent_type === 'yiban' ? '一般授权代理' :
+ formData.agent_type === 'tebie' ? '特别授权代理' :
+ formData.agent_type === 'gongtong' ? '共同授权代理' :
+ formData.agent_type === 'zhuanwei' ? '转委托代理' : '无'}
+ </span>
+ </div>
+ </div>
+ )}
+
+ {formData.risk && (
+ <div className="info-section">
+ <div className="section-title risk-title">风险评估</div>
+ <div className="info-item">
+ <span className="item-label">
+ <span style={{color: '#F53F3F', display: 'inline-flex', alignItems: 'center'}}>
+ <img
+ src={require("../../../assets/img/riskMask.png")}
+ alt="警告"
+ style={{
+ width: '15px',
+ height: '15px',
+ marginRight: '4px',
+ verticalAlign: 'middle'
+ }}
+ />
+ 是否有个人极端倾向：
+ </span>
+ </span>
+ <span className="item-value risk-value" style={{ color: '#171A1D' }}>{formData.risk === 'yes' ? '是' : '否'}</span>
+ </div>
+ </div>
+ )}
+
+ {((formData.idCardFilesInfo && formData.idCardFilesInfo.length > 0) ||
+ (formData.authorizationFilesInfo && formData.authorizationFilesInfo.length > 0)) && (
+ <div className="info-section">
+ <div className="section-title">附件材料</div>
+ {formData.idCardFilesInfo && formData.idCardFilesInfo.length > 0 && (
+ <div className="info-item">
+ <span className="item-label">身份证明材料：</span>
+ <div className="files-list">
+ {formData.idCardFilesInfo.map((file, index) => (
+ <div key={index} className="file-item">
+ <div className="file-link-icon">
+ <img
+ src={require("../../../assets/img/link_picture.png")}
+ alt="链接"
+ />
+ </div>
+ <div className="file-info">
+ <div className="file-name">{file.name}</div>
+ <div className="file-size-preview">
+ <span className="file-size">{(file.size / 1024).toFixed(1)}K</span>
+ <span className="preview-text">预览</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ )}
+
+ {formData.authorizationFilesInfo && formData.authorizationFilesInfo.length > 0 && (
+ <div className="info-item">
+ <span className="item-label">授权委托书：</span>
+ <div className="files-list">
+ {formData.authorizationFilesInfo.map((file, index) => (
+ <div key={index} className="file-item">
+ <div className="file-link-icon">
+ <img
+ src={require("../../../assets/img/link_picture.png")}
+ alt="链接"
+ />
+ </div>
+ <div className="file-info">
+ <div className="file-name">{file.name}</div>
+ <div className="file-size-preview">
+ <span className="file-size">{(file.size / 1024).toFixed(1)}K</span>
+ <span className="preview-text">预览</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ )}
+ </div>
+ )}
+ </div>
+ );
+ };
+
+ // 渲染法人信息
+ const renderLegalPerson = () => {
+ const formData = personData?.formData || {};
+
+ return (
+ <div className="person-info-container">
+ <div className="info-section">
+ <div className="section-title">基本信息</div>
+ <div className="info-item">
+ <span className="item-label">企业名称：</span>
+ <span className="item-value">{formData.companyName || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">统一社会信用代码：</span>
+ <span className="item-value">{formData.creditCode || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">联系人：</span>
+ <span className="item-value">{formData.contactName || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">联系电话：</span>
+ <span className="item-value">{formData.contactPhone || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">地址：</span>
+ <span className="item-value">{formData.address || '无'}</span>
+ </div>
+ </div>
+
+ {formData.legalRepName && (
+ <div className="info-section">
+ <div className="section-title">法定代表人信息</div>
+ <div className="info-item">
+ <span className="item-label">姓名：</span>
+ <span className="item-value">{formData.legalRepName || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">证件号码：</span>
+ <span className="item-value">{formData.legalRepIdCard || '无'}</span>
+ </div>
+ </div>
+ )}
+
+ {formData.businessLicenseInfo && formData.businessLicenseInfo.length > 0 && (
+ <div className="info-section">
+ <div className="section-title">附件材料</div>
+ <div className="info-item">
+ <span className="item-label">营业执照：</span>
+ <div className="files-list">
+ {formData.businessLicenseInfo.map((file, index) => (
+ <div key={index} className="file-item">
+ <div className="file-link-icon">
+ <img
+ src={require("../../../assets/img/link_picture.png")}
+ alt="链接"
+ />
+ </div>
+ <div className="file-info">
+ <div className="file-name">{file.name}</div>
+ <div className="file-size-preview">
+ <span className="file-size">{(file.size / 1024).toFixed(1)}K</span>
+ <span className="preview-text">预览</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ )}
+ </div>
+ );
+ };
+
+ // 渲染非法人组织信息
+ const renderNonLegalPerson = () => {
+ const formData = personData?.formData || {};
+
+ return (
+ <div className="person-info-container">
+ <div className="info-section">
+ <div className="section-title">基本信息</div>
+ <div className="info-item">
+ <span className="item-label">组织名称：</span>
+ <span className="item-value">{formData.companyName || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">组织代码：</span>
+ <span className="item-value">{formData.creditCode || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">联系人：</span>
+ <span className="item-value">{formData.contactName || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">联系电话：</span>
+ <span className="item-value">{formData.contactPhone || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">地址：</span>
+ <span className="item-value">{formData.address || '无'}</span>
+ </div>
+ </div>
+
+ {formData.responsiblePerson && (
+ <div className="info-section">
+ <div className="section-title">负责人信息</div>
+ <div className="info-item">
+ <span className="item-label">姓名：</span>
+ <span className="item-value">{formData.responsiblePerson || '无'}</span>
+ </div>
+ <div className="info-item">
+ <span className="item-label">证件号码：</span>
+ <span className="item-value">{formData.responsiblePersonId || '无'}</span>
+ </div>
+ </div>
+ )}
+
+ {formData.organizationCertInfo && formData.organizationCertInfo.length > 0 && (
+ <div className="info-section">
+ <div className="section-title">附件材料</div>
+ <div className="info-item">
+ <span className="item-label">组织证明：</span>
+ <div className="files-list">
+ {formData.organizationCertInfo.map((file, index) => (
+ <div key={index} className="file-item">
+ <div className="file-link-icon">
+ <img
+ src={require("../../../assets/img/link_picture.png")}
+ alt="链接"
+ />
+ </div>
+ <div className="file-info">
+ <div className="file-name">{file.name}</div>
+ <div className="file-size-preview">
+ <span className="file-size">{(file.size / 1024).toFixed(1)}K</span>
+ <span className="preview-text">预览</span>
+ </div>
+ </div>
+ </div>
+ ))}
+ </div>
+ </div>
+ </div>
+ )}
+ </div>
+ );
+ };
+
+ const renderPersonInfo = () => {
+ if (loading) {
+ return <div className="loading-info">加载人员信息中...</div>;
+ }
+
+ if (!personData) {
+ return <div className="no-data-info">未找到人员信息</div>;
+ }
+
+ // 根据人员类型渲染不同的信息
+ switch (personData.selectedType) {
+ case 'natural':
+ return renderNaturalPerson();
+ case 'legal':
+ return renderLegalPerson();
+ case 'nonlegal':
+ return renderNonLegalPerson();
+ default:
+ return <div className="no-data-info">未知人员类型</div>;
+ }
+ };
+
+ // 返回按钮处理
+ const handleBack = () => {
+ history.goBack();
+ };
+
+ return (
+ <div className="readperson-container">
+ <NavBarPage
+ title={`查看${personRole}`}
+ leftContentVisible={true}
+ leftContentFunc={handleBack}
+ >
+ <div className="person-role-type">
+ <div className="person-name">
+ {personData?.selectedType === 'natural' ? personData?.formData?.name :
+ personData?.selectedType === 'legal' || personData?.selectedType === 'nonlegal' ?
+ personData?.formData?.companyName : '未知'}
+ </div>
+ <div className="person-identity">
+ {personRole}
+ </div>
+ </div>
+ {renderPersonInfo()}
+ </NavBarPage>
+ </div>
+ );
+};
+
+export default Readperson;
diff --git a/src/views/selfInspection/readperson/index.less b/src/views/selfInspection/readperson/index.less
new file mode 100644
index 0000000..de6ab46
--- /dev/null
+++ b/src/views/selfInspection/readperson/index.less
@@ -0,0 +1,151 @@
+.readperson-container {
+ background-color: #f5f7fa;
+ min-height: 100vh;
+
+ .person-role-type {
+ display: flex;
+ padding: 16px;
+ background-color: #fff;
+ margin-bottom: 1px;
+ align-items: center;
+
+ .person-name {
+ width: auto;
+ min-width: 40px;
+ max-width: 75%;
+ height: 24px;
+ font-size: 16px;
+ font-family: PingFang SC, PingFang SC-400;
+ font-weight: 400;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ .person-identity {
+ margin-left: 8px;
+ font-size: 14px;
+ color: #1a6fb8;
+ background-color: #E8F3FF;;
+ padding: 2px 8px;
+ border-radius: 4px;
+ }
+
+ .dtm-tag {
+ margin-right: 8px;
+ }
+ }
+
+ .person-info-container {
+ padding: 0 0 24px 0;
+
+ .info-section {
+ background-color: #fff;
+ margin-bottom: 0;
+ padding: 16px;
+ border-radius: 4px;
+
+ .section-title {
+ display: none;
+ }
+
+ .info-item {
+ display: block;
+ margin-bottom: 16px;
+ font-size: 14px;
+ line-height: 22px;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .item-label {
+ display: block;
+ width: 100%;
+ color: #86909C;
+ margin-bottom: 4px;
+ }
+
+ .item-value {
+ display: block;
+ width: 100%;
+ color: #1D2129;
+ word-break: break-all;
+
+ &.risk-value {
+ color: #F53F3F;
+ font-weight: 500;
+ }
+ }
+
+ .files-list {
+ width: 100%;
+ margin-top: 4px;
+
+ .file-item {
+ display: flex;
+ margin-bottom: 12px;
+ border: 1px dashed #D9E0FF;
+ border-radius: 4px;
+ padding: 12px;
+ background-color: #F5F7FF;
+ align-items: center;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ .file-link-icon {
+ width: 40px;
+ height: 40px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-right: 10px;
+
+ img {
+ width: 24px;
+ height: 24px;
+ object-fit: contain;
+ }
+ }
+
+ .file-info {
+ flex: 1;
+
+ .file-name {
+ color: #333;
+ font-size: 14px;
+ margin-bottom: 4px;
+ }
+
+ .file-size-preview {
+ display: flex;
+ font-size: 12px;
+
+ .file-size {
+ color: #999;
+ margin-right: 12px;
+ }
+
+ .preview-text {
+ color: #1a6fb8;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .loading-info, .no-data-info {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 200px;
+ color: #86909C;
+ font-size: 14px;
+ }
+}
diff --git a/src/views/workStatistics/MyChartBar.jsx b/src/views/workStatistics/MyChartBar.jsx
new file mode 100644
index 0000000..b3160b0
--- /dev/null
+++ b/src/views/workStatistics/MyChartBar.jsx
@@ -0,0 +1,176 @@
+/*
+ * @Company: hugeInfo
+ * @Author: AI
+ * @Date: 2025-04-17 16:30:00
+ * @LastEditTime: 2025-04-23 16:41:01
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 柱状图组件
+ */
+import React, { useEffect, useRef } from 'react';
+import * as echarts from 'echarts/core';
+import { BarChart } from 'echarts/charts';
+import { GridComponent, TooltipComponent, LegendComponent } from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
+
+echarts.use([BarChart, GridComponent, TooltipComponent, LegendComponent, CanvasRenderer]);
+
+/**
+ * data: array, // 数据
+ * dataAxis: array, // x轴
+ * barColor: array, // 柱状图颜色
+ * isStacked: boolean, // 是否堆叠柱状图
+ */
+const MyChartBar = ({ data = [], dataAxis = [], barColor = ['#5fa6d4', '#1a6fb8'], isStacked = false }) => {
+ const chartRef = useRef(null);
+ const chartInstance = useRef(null);
+
+ useEffect(() => {
+ if (chartRef.current) {
+ if (!chartInstance.current) {
+ chartInstance.current = echarts.init(chartRef.current);
+ }
+ renderChart();
+ }
+
+ return () => {
+ if (chartInstance.current) {
+ chartInstance.current.dispose();
+ chartInstance.current = null;
+ }
+ };
+ }, [data, dataAxis, isStacked]);
+
+ const renderChart = () => {
+ if (!chartInstance.current) return;
+
+ let series = [];
+ let legendData = [];
+
+ if (isStacked) {
+ // 堆叠柱状图模式（化解成功和化解不成功）
+ series = [
+ {
+ name: '化解成功',
+ type: 'bar',
+ stack: 'total',
+ barWidth: '40%',
+ itemStyle: {
+ color: barColor[0]
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: data.map(item => item.resolveNum)
+ },
+ {
+ name: '化解不成功',
+ type: 'bar',
+ stack: 'total',
+ barWidth: '40%',
+ itemStyle: {
+ color: barColor[1]
+ },
+ emphasis: {
+ focus: 'series'
+ },
+ data: data.map(item => item.unResolveNum)
+ }
+ ];
+ legendData = ['化解成功', '化解不成功'];
+ } else {
+ // 普通柱状图模式
+ series = [
+ {
+ name: '数量',
+ type: 'bar',
+ barWidth: '40%',
+ itemStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: barColor[0]
+ },
+ {
+ offset: 1,
+ color: barColor[1]
+ }
+ ])
+ },
+ data: data.map(item => item.caseNum)
+ }
+ ];
+ // legendData = ['数量'];
+ }
+
+ const option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ },
+ formatter: function(params) {
+ let result = `${params[0].axisValue}<br/>`;
+ params.forEach(item => {
+ result += `${item.seriesName}: ${item.value}<br/>`;
+ });
+ return result;
+ }
+ },
+ legend: {
+ data: legendData,
+ bottom: 0,
+ itemWidth: 10,
+ itemHeight: 10
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '10%',
+ top: '3%',
+ containLabel: true
+ },
+ xAxis: [
+ {
+ type: 'category',
+ data: dataAxis,
+ axisTick: {
+ alignWithLabel: true
+ },
+ axisLabel: {
+ color: '#666',
+ interval: 0,
+ rotate: dataAxis.length > 5 ? 40 : 0
+ }
+ }
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ axisLine: {
+ show: false
+ },
+ axisTick: {
+ show: false
+ },
+ splitLine: {
+ lineStyle: {
+ type: 'dashed',
+ color: '#eee'
+ }
+ },
+ axisLabel: {
+ color: '#666'
+ }
+ }
+ ],
+ series: series
+ };
+
+ chartInstance.current.setOption(option);
+ };
+
+ return <div ref={chartRef} style={{ width: '100%', height: '100%' }} />;
+};
+
+export default MyChartBar;
diff --git a/src/views/workStatistics/MyLTopChartPie.jsx b/src/views/workStatistics/MyLTopChartPie.jsx
new file mode 100644
index 0000000..bee4277
--- /dev/null
+++ b/src/views/workStatistics/MyLTopChartPie.jsx
@@ -0,0 +1,152 @@
+/*
+ * @Company: hugeInfo
+ * @Author: AI
+ * @Date: 2025-04-17 16:30:00
+ * @LastEditTime: 2025-04-23 16:41:01
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 饼图组件
+ */
+import React, { useEffect, useRef } from 'react';
+import * as echarts from 'echarts/core';
+import { PieChart } from 'echarts/charts';
+import { LegendComponent, TooltipComponent } from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
+
+echarts.use([PieChart, LegendComponent, TooltipComponent, CanvasRenderer]);
+
+/**
+ * data: array, // 数据 [{name: '名称', value: 数值, rate: '百分比'}]
+ */
+const MyLTopChartPie = (props) => {
+ const { data = [], showInside = false, adjustLegend = false } = props;
+ const chartRef = useRef(null);
+ const chartInstance = useRef(null);
+
+ // 饼图颜色
+ const colorList = [
+ '#3f6fd1', // 市场监管
+ '#d23d24', // 教育医疗
+ '#c44f92', // 劳动社保
+ '#0ab068', // 城市管理
+ '#f2923b', // 交通运输
+ '#4894c5', // 公共服务
+ '#8a5cd8', // 其他
+ '#5dc4b7', // 房屋管理
+ '#f8cc48', // 土地资源
+ '#ac8765' // 备用色
+ ];
+
+ useEffect(() => {
+ if (chartRef.current) {
+ if (!chartInstance.current) {
+ chartInstance.current = echarts.init(chartRef.current);
+ }
+ renderChart();
+ }
+
+ return () => {
+ if (chartInstance.current) {
+ chartInstance.current.dispose();
+ chartInstance.current = null;
+ }
+ };
+ }, [data]);
+
+ // 渲染图表
+ const renderChart = () => {
+ if (!chartInstance.current) return;
+
+ const option = {
+ tooltip: {
+ trigger: 'item',
+ formatter: '{a} <br/>{b}: {c} ({d}%)'
+ },
+ legend: {
+ orient: adjustLegend ? 'vertical' : 'horizontal',
+ right: adjustLegend ? '0%' : 'center',
+ top: adjustLegend ? 'center' : 'bottom',
+ itemWidth: 10,
+ itemHeight: 10,
+ textStyle: {
+ color: '#333',
+ fontSize: 12,
+ },
+ formatter: function(name) {
+ // 找到对应的数据项
+ const item = data.find(item => item.name === name);
+ if (!item) return name;
+
+ // 如果文本过长，进行截断
+ let displayName = name;
+ if (name.length > 8) {
+ displayName = name.substring(0, 7) + '...';
+ }
+
+ return `${displayName} (${item.rate}%)`;
+ }
+ },
+ color: [
+ '#245DA2','#3491FA','#5470c6', '#91cc75', '#fac858', '#ee6666', '#73c0de',
+ '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc'
+ ],
+ series: [
+ {
+ name: '纠纷类型',
+ type: 'pie',
+ radius: '65%',
+ center: ['28%', '50%'],
+ avoidLabelOverlap: true,
+ itemStyle: {
+ borderRadius: 4,
+ borderColor: '#fff',
+ borderWidth: 1
+ },
+ label: showInside ? {
+ show: true,
+ position: 'inside',
+ formatter: function(params) {
+ // 只有占比较大的扇区才显示标签
+ if (params.percent > 5) {
+ // 名称过长则截断
+ let name = params.name;
+ if (name.length > 4) {
+ name = name.substring(0, 3) + '...';
+ }
+ return `${name}\n${params.value}`;
+ } else {
+ return '';
+ }
+ },
+ fontSize: 12,
+ color: '#fff'
+ } : {
+ show: false
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: 14,
+ fontWeight: 'bold'
+ }
+ },
+ labelLine: {
+ show: false
+ },
+ data: data.map(item => ({
+ name: item.name,
+ value: item.value
+ }))
+ }
+ ]
+ };
+
+ chartInstance.current.setOption(option);
+ };
+
+ return (
+ <div ref={chartRef} style={{ width: '100%', height: '100%' }}></div>
+ );
+};
+
+export default MyLTopChartPie;
diff --git a/src/views/workStatistics/areaIndex.jsx b/src/views/workStatistics/areaIndex.jsx
new file mode 100644
index 0000000..ec83e47
--- /dev/null
+++ b/src/views/workStatistics/areaIndex.jsx
@@ -0,0 +1,1187 @@
+/*
+ * @Company: hugeInfo
+ * @Author: AI
+ * @Date: 2025-04-17 16:30:00
+ * @LastEditTime: 2025-04-23 16:41:01
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 工作统计
+ */
+import React, { useEffect, useState } from 'react';
+import { Drawer, Tabs, Button, Select, Modal, Picker, List } from 'dingtalk-design-mobile';
+import { ArrowOutlined, SettingOutlined, CloseOutlined } from 'dd-icons';
+import * as $$ from '../../utils/utility';
+import caseTypeSelect from '../../utils/caseTypeSelect';
+import NavBarPage from '../../components/NavBarPage';
+import MyChartBar from './MyChartBar';
+import MyLTopChartPie from './MyLTopChartPie';
+import CalendarRangeTwoDay from '../../components/CalendarRangeTwoDay';
+import { workStatistics_3, workStatistics_4, workStatistics_5,applyClose_1,caseQuery_2 } from '../../assets/img';
+import './areaIndex.less';
+import WorkStatisticsTabs from '../../components/WorkStatisticsTabs';
+import { useHistory, useLocation } from 'react-router-dom';
+
+// 获取工作统计数据
+function getWorkStatisticsApi(data) {
+ return $$.ax.request({ url: 'caseInfo/statistics', type: 'get', data, service: 'mediate' });
+}
+
+// 获取超时办件数量
+function getTimeoutTaskApi(data) {
+ return $$.ax.request({ url: 'analysis/timeoutTask', type: 'get', data, service: 'mediate' });
+}
+
+// 获取超时办件列表
+function getTimeoutListApi(data) {
+ return $$.ax.request({ url: 'analysis/pageQuantity', type: 'get', data, service: 'mediate' });
+}
+
+const AreaStatistics = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const [currentTab, setCurrentTab] = useState('区域工作统计');
+
+ // 事项来源选项
+ const canalOptions = [
+ { value: '22_00001-1', label: '大厅来访' },
+ { value: '22_00001-2', label: '线上来访' },
+ { value: '22_00001-3', label: '自行排查' },
+ { value: '22_00001-4', label: '协同推送' }
+ ];
+
+ // 事项等级选项
+ const caseLevelOptions = [
+ { value: '1', label: '一级' },
+ { value: '2', label: '二级' },
+ { value: '3', label: '三级' }
+ ];
+
+ // 新增：时间类型选项
+ const dateTypeOptions = [
+ { value: 'custom', label: '自定义' },
+ { value: 'lastMonth', label: '上月' },
+ { value: 'lastWeek', label: '上周' },
+ { value: 'thisMonth', label: '本月' },
+ { value: 'thisWeek', label: '本周' },
+ { value: 'thisYear', label: '本年度' },
+ { value: 'lastYear', label: '上年度' }
+ ];
+
+ const [loading, setLoading] = useState(false);
+ const [settingVisible, setSettingVisible] = useState(false);
+ const [datePickerVisible, setDatePickerVisible] = useState(false);
+ const [currentDateType, setCurrentDateType] = useState('');
+ const [activeStatTab, setActiveStatTab] = useState('total');
+
+ // 超时办件状态
+ const [timeoutData, setTimeoutData] = useState({
+ fpcs: 0, // 分派超时数量
+ slcs: 0, // 受理超时数量
+ dbcs: 0 // 督办回复超时数量
+ });
+ const [activeTimeoutTab, setActiveTimeoutTab] = useState(1); // 1-分派超时，2-受理超时，3-督办回复超时
+ const [activeSuperviseTab, setActiveSuperviseTab] = useState(0); // 0-未督办/未回复，1-已督办/已回复
+ const [timeoutList, setTimeoutList] = useState([]); // 超时办件列表
+ const [timeoutPagination, setTimeoutPagination] = useState({
+ page: 1,
+ size: 5,
+ total: 0,
+ totalPages: 0
+ });
+
+ // 查询参数
+ const [queryParams, setQueryParams] = useState({
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ closeStart: '',
+ closeEnd: '',
+ canal: '',
+ caseLevel: '',
+ caseType: ''
+ });
+
+ // 统计数据
+ const [statistics, setStatistics] = useState({
+ totalNum: 0,
+ processNum: 0,
+ finishNum: 0,
+ rejectNum: 0,
+ resolveNum: 0,
+ resolveRate: '0',
+ unResolveNum: 0,
+ toDayTotalNum: 0,
+ toDayProcessNum: 0,
+ toDayRejectNum: 0,
+ toDayFinishNum: 0,
+ momTotalRate: '0',
+ yoyTotalRate: '0',
+ momProcessRate: '0',
+ yoyProcessRate: '0',
+ momRejectRate: '0',
+ yoyRejectRate: '0',
+ momFinishNumRate: '0',
+ yoyFinishNumRate: '0',
+ momResolveRate: '0',
+ yoyResolveRate: '0',
+ typeList: [],
+ timeList: [],
+ oneLevelNum: 0, // 一级事项数量
+ twoLevelNum: 0, // 二级事项数量
+ threeLevelNum: 0, // 三级事项数量
+ areaList: []
+ });
+
+ const [dateTypeModalVisible, setDateTypeModalVisible] = useState(false);
+ const [dateTypeTarget, setDateTypeTarget] = useState(''); // 'create' or 'close'
+
+ // 计算时间范围
+ const getDateRangeByType = (type) => {
+ const now = new Date();
+ let start, end;
+ switch (type) {
+ case 'lastMonth': {
+ const year = now.getMonth() === 0 ? now.getFullYear() - 1 : now.getFullYear();
+ const month = now.getMonth() === 0 ? 11 : now.getMonth() - 1;
+ start = new Date(year, month, 1);
+ end = new Date(year, month + 1, 0);
+ break;
+ }
+ case 'thisMonth': {
+ start = new Date(now.getFullYear(), now.getMonth(), 1);
+ end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+ break;
+ }
+ case 'lastWeek': {
+ const day = now.getDay() || 7;
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day);
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day - 6);
+ break;
+ }
+ case 'thisWeek': {
+ const day = now.getDay() || 7;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 7);
+ break;
+ }
+ case 'thisYear': {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = new Date(now.getFullYear(), 11, 31);
+ break;
+ }
+ case 'lastYear': {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ break;
+ }
+ default:
+ start = end = now;
+ }
+ return [$$.myTimeFormat(start, 'YYYY-MM-DD'), $$.myTimeFormat(end, 'YYYY-MM-DD')];
+ };
+
+ // 检查值是否以特定字符开头，防止null错误
+ const startsWithSafe = (value, char) => {
+ return value && typeof value === 'string' && value.startsWith(char);
+ };
+
+ // 初始化加载数据
+ useEffect(() => {
+ fetchStatisticsData();
+ fetchTimeoutData();
+ }, []);
+
+ // 监听路由变化
+ useEffect(() => {
+ const path = window.location.pathname;
+ if (path === '/gzdyh/workStatistics') {
+ setCurrentTab('个人工作统计');
+ } else if (path === '/gzdyh/areaStatistics') {
+ setCurrentTab('区域工作统计');
+ }
+ }, [window.location.pathname]);
+
+ // 获取统计数据
+ const fetchStatisticsData = async () => {
+ global.setSpinning(true);
+ setLoading(true);
+ try {
+ const res = await getWorkStatisticsApi({
+ ...queryParams,
+ workType: 3
+ });
+ if (res.type && res.data) {
+ // 确保所有需要的字段都存在，避免null错误
+ const data = {
+ ...statistics,
+ ...res.data,
+ // 确保这些字段不为null
+ momTotalRate: res.data.momTotalRate || '0',
+ yoyTotalRate: res.data.yoyTotalRate || '0',
+ momProcessRate: res.data.momProcessRate || '0',
+ yoyProcessRate: res.data.yoyProcessRate || '0',
+ momRejectRate: res.data.momRejectRate || '0',
+ yoyRejectRate: res.data.yoyRejectRate || '0',
+ momFinishNumRate: res.data.momFinishNumRate || '0',
+ yoyFinishNumRate: res.data.yoyFinishNumRate || '0',
+ momResolveRate: res.data.momResolveRate || '0',
+ yoyResolveRate: res.data.yoyResolveRate || '0',
+ resolveRate: res.data.resolveRate || '0',
+ oneLevelNum: res.data.oneLevelNum || 0, // 确保一级事项数量存在
+ twoLevelNum: res.data.twoLevelNum || 0, // 确保二级事项数量存在
+ threeLevelNum: res.data.threeLevelNum || 0, // 确保三级事项数量存在
+ timeList: Array.isArray(res.data.timeList) ? res.data.timeList : [],
+ typeList: Array.isArray(res.data.typeList) ? res.data.typeList : [],
+ areaList: Array.isArray(res.data.areaList) ? res.data.areaList : []
+ };
+ setStatistics(data);
+ }
+ } catch (error) {
+ console.error('获取工作统计数据失败', error);
+ } finally {
+ setLoading(false);
+ global.setSpinning(false);
+ }
+ };
+
+ // 获取超时办件数量
+ const fetchTimeoutData = async () => {
+ try {
+ const res = await getTimeoutTaskApi(queryParams);
+ if (res.type && res.data) {
+ setTimeoutData({
+ fpcs: res.data.fpcs || 0,
+ slcs: res.data.slcs || 0,
+ dbcs: res.data.dbcs || 0
+ });
+ // 初始化加载分派超时的未督办列表
+ fetchTimeoutList(1, 0, 1);
+ }
+ } catch (error) {
+ console.error('获取超时办件数量失败', error);
+ }
+ };
+
+ // 获取超时办件列表
+ const fetchTimeoutList = async (queryType, turnaroundType, page = 1) => {
+ try {
+ setLoading(true);
+ const params = {
+ ...queryParams,
+ queryType,
+ turnaroundType,
+ page,
+ size: timeoutPagination.size
+ };
+
+ const res = await getTimeoutListApi(params);
+ if (res.type && res.data) {
+ // 设置列表数据
+ setTimeoutList(res.data.content || []);
+ // 设置分页信息
+ setTimeoutPagination({
+ ...timeoutPagination,
+ page,
+ total: res.data.totalElements || 0,
+ totalPages: res.data.totalPages || 0
+ });
+ }
+ } catch (error) {
+ console.error('获取超时办件列表失败', error);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ // 打开设置抽屉
+ const handleOpenSetting = () => {
+ setSettingVisible(true);
+ };
+
+ // 关闭设置抽屉
+ const handleCloseSetting = () => {
+ setSettingVisible(false);
+ };
+
+ // 重置筛选条件
+ const handleResetFilter = () => {
+ setQueryParams({
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ closeStart: '',
+ closeEnd: '',
+ canal: '',
+ caseLevel: '',
+ caseType: ''
+ });
+ };
+
+ // 应用筛选条件
+ const handleApplyFilter = () => {
+ fetchStatisticsData();
+ fetchTimeoutData(); // 更新超时办件数据
+ setSettingVisible(false);
+ };
+
+ // 处理日期选择
+ const handleOpenDatePicker = (type) => {
+ setCurrentDateType(type);
+ setDatePickerVisible(true);
+ };
+
+ // 处理日期变更
+ const handleDateChange = (dates) => {
+ if (!dates || dates.length !== 2) return;
+
+ const formatDate = (date) => {
+ if (!date || !date.key) return '';
+ return date.key;
+ };
+
+ const formattedStart = formatDate(dates[0]);
+ const formattedEnd = formatDate(dates[1]);
+
+ switch (currentDateType) {
+ case 'create':
+ setQueryParams(prev => ({
+ ...prev,
+ createStart: formattedStart,
+ createEnd: formattedEnd
+ }));
+ break;
+ case 'close':
+ setQueryParams(prev => ({
+ ...prev,
+ closeStart: formattedStart,
+ closeEnd: formattedEnd
+ }));
+ break;
+ default:
+ break;
+ }
+ setDatePickerVisible(false);
+ };
+
+ // 日历组件操作处理
+ const handleCalendarClick = (type, action) => {
+ if (action === 'onClose') {
+ setDatePickerVisible(false);
+ } else if (action === 'submit') {
+ setDatePickerVisible(false);
+ }
+ };
+
+ // 获取统计时间类型显示文本（当月、当年、当日）
+ const getTimeTypeText = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return '当日';
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ // 检查是否为整月
+ if (
+ startDate.getDate() === 1 &&
+ endDate.getDate() === new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate() &&
+ startDate.getMonth() === endDate.getMonth() &&
+ startDate.getFullYear() === endDate.getFullYear()
+ ) {
+ return '当月';
+ }
+
+ // 检查是否为整年
+ if (
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear()
+ ) {
+ return '当年';
+ }
+
+ return '当日';
+ };
+
+ // 判断是否为整月或整年
+ const isFullMonthOrYear = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return false;
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ // 检查是否为整月
+ const isFullMonth =
+ startDate.getDate() === 1 &&
+ endDate.getDate() === new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate() &&
+ startDate.getMonth() === endDate.getMonth() &&
+ startDate.getFullYear() === endDate.getFullYear();
+
+ // 检查是否为整年
+ const isFullYear =
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear();
+
+ return isFullMonth || isFullYear;
+ };
+
+ // 判断是否为整年
+ const isFullYear = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return false;
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ return (
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear()
+ );
+ };
+
+ // 获取对比文本（月同比/年同比）
+ const getCompareText = () => {
+ return isFullYear() ? '年同比' : '月同比';
+ };
+
+ // 获取环比文本（月环比/年环比）
+ const getRatioText = () => {
+ return isFullYear() ? '年环比' : '月环比';
+ };
+
+ // 获取事项来源文本
+ const getCanalText = () => {
+ if (!queryParams.canal) return '全部';
+ const option = canalOptions.find(item => item.value === queryParams.canal);
+ return option ? option.label : '全部';
+ };
+
+ // 获取筛选条件显示信息
+ const getFilterInfoText = () => {
+ const info = [];
+
+ // 添加登记时间
+ if (queryParams.createStart && queryParams.createEnd) {
+ info.push(`登记时间：${queryParams.createStart.replace(/-/g, '.')}–${queryParams.createEnd.replace(/-/g, '.')}`);
+ }
+
+ // 添加事项来源
+ info.push(`事项来源：${getCanalText()}`);
+
+ return info;
+ };
+
+ // 清除单个筛选条件
+ const clearFilterItem = (type) => {
+ switch (type) {
+ case 'create':
+ setQueryParams(prev => ({
+ ...prev,
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD')
+ }));
+ break;
+ case 'close':
+ setQueryParams(prev => ({
+ ...prev,
+ closeStart: '',
+ closeEnd: ''
+ }));
+ break;
+ case 'canal':
+ setQueryParams(prev => ({
+ ...prev,
+ canal: ''
+ }));
+ break;
+ case 'caseLevel':
+ setQueryParams(prev => ({
+ ...prev,
+ caseLevel: ''
+ }));
+ break;
+ case 'caseType':
+ setQueryParams(prev => ({
+ ...prev,
+ caseType: ''
+ }));
+ break;
+ case 'area':
+ setQueryParams(prev => ({
+ ...prev,
+ queCity: '',
+ queArea: '',
+ queRoad: '',
+ queVillage: ''
+ }));
+ break;
+ default:
+ break;
+ }
+
+ // 清除后立即更新数据
+ setTimeout(() => {
+ fetchStatisticsData();
+ }, 0);
+ };
+
+ // 渲染同比环比的图标和数据
+ const renderRateWithIcon = (rate) => {
+ if (!rate) return '0%';
+
+ // 去掉+/-符号
+ const rateValue = rate.replace(/[+\-]/g, '');
+ const isPositive = !startsWithSafe(rate, '-');
+
+ return (
+ <span className={isPositive ? 'up' : 'down'}>
+ <img src={isPositive ? workStatistics_3 : workStatistics_4} alt="" className="rate-icon" />
+ {rateValue}%
+ </span>
+ );
+ };
+
+ // 渲染化解统计图表
+ const renderChartByTab = () => {
+ // 确保timeList是数组
+ const areaList = Array.isArray(statistics.areaList) ? statistics.areaList : [];
+
+ switch (activeStatTab) {
+ case 'total':
+ return (
+ <MyChartBar
+ data={areaList.map(item => ({
+ caseNum: item.caseNum || 0,
+ name: item.areaName || ''
+ }))}
+ dataAxis={areaList.map(item => item.areaName || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ case 'processing':
+ return (
+ <MyChartBar
+ data={areaList.map(item => ({
+ caseNum: item.resolveingNum || 0,
+ name: item.areaName || ''
+ }))}
+ dataAxis={areaList.map(item => item.areaName || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ case 'finished':
+ return (
+ <MyChartBar
+ data={areaList.map(item => ({
+ resolveNum: item.resolveNum || 0,
+ unResolveNum: item.unResolveNum || 0,
+ name: item.areaName || ''
+ }))}
+ dataAxis={areaList.map(item => item.areaName || '')}
+ barColor={['#08979C', '#F2657D']}
+ isStacked={true}
+ />
+ );
+ case 'rejected':
+ return (
+ <MyChartBar
+ data={areaList.map(item => ({
+ caseNum: item.rejectNum || 0,
+ name: item.areaName || ''
+ }))}
+ dataAxis={areaList.map(item => item.areaName || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ default:
+ return null;
+ }
+ };
+
+ // 处理超时类型切换
+ const handleTimeoutTabChange = (type) => {
+ setActiveTimeoutTab(type);
+ setActiveSuperviseTab(0); // 重置为未督办/未回复
+ setTimeoutPagination({...timeoutPagination, page: 1}); // 重置分页
+ fetchTimeoutList(type, 0, 1);
+ };
+
+ // 处理督办/回复状态切换
+ const handleSuperviseTabChange = (type) => {
+ setActiveSuperviseTab(type);
+ setTimeoutPagination({...timeoutPagination, page: 1}); // 重置分页
+ fetchTimeoutList(activeTimeoutTab, type, 1);
+ };
+
+ // 处理页码变更
+ const handlePageChange = (newPage) => {
+ fetchTimeoutList(activeTimeoutTab, activeSuperviseTab, newPage);
+ };
+
+ // 处理详情跳转
+ const handleDetailClick = (caseTaskId, caseId) => {
+ window.location.href = `#/gzdyh/flow?caseTaskId=${caseTaskId}&caseId=${caseId}&editShow=false`;
+ };
+
+ // 格式化超时时间
+ const formatTimeLimit = (hours) => {
+ if (!hours && hours !== 0) return '';
+
+ const days = Math.floor(hours / 24);
+ const remainHours = hours % 24;
+
+ if (days > 0 && remainHours > 0) {
+ return `超${days}天${remainHours}小时`;
+ } else if (days > 0) {
+ return `超${days}天`;
+ } else {
+ return `超${remainHours}小时`;
+ }
+ };
+
+ // 打开时间类型弹窗
+ const handleOpenDateTypeModal = (target) => {
+ setDateTypeTarget(target);
+ setDateTypeModalVisible(true);
+ };
+
+ // 选择时间类型
+ const handleDateTypeSelect = (type) => {
+ setDateTypeModalVisible(false);
+ if (type === 'custom') {
+ handleOpenDatePicker(dateTypeTarget);
+ } else {
+ const [start, end] = getDateRangeByType(type);
+ if (dateTypeTarget === 'create') {
+ setQueryParams(prev => ({ ...prev, createStart: start, createEnd: end }));
+ } else if (dateTypeTarget === 'close') {
+ setQueryParams(prev => ({ ...prev, closeStart: start, closeEnd: end }));
+ }
+ }
+ };
+
+ // 在组件内增加一个方法用于获取label
+ const getCaseTypeLabel = (value) => {
+ if (!value) return '';
+ let label = '';
+ caseTypeSelect.caseTypeSelect.forEach(item => {
+ if (item.value === value) {
+ label = item.label;
+ } else if (item.children) {
+ const child = item.children.find(child => child.value === value);
+ if (child) label = child.label;
+ }
+ });
+ return label;
+ };
+
+ return (
+ <NavBarPage
+ title={currentTab}
+ leftContentFunc={() => { history.replace('/gzdyh/home'); }}
+ >
+ <WorkStatisticsTabs />
+ <div className="area-statistics">
+ {/* 筛选条件展示区域 */}
+ <div className="filter-info-section">
+ <div className="filter-info-title">筛选条件</div>
+ <div className="filter-settings" onClick={handleOpenSetting}>
+ <img src={workStatistics_5} alt="" className="settings-icon" />
+ <span>设置</span>
+ </div>
+ </div>
+
+ {/* 筛选条件内容 */}
+ <div className="filter-conditions">
+ {queryParams.createStart && queryParams.createEnd && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">登记时间：{queryParams.createStart.replace(/-/g, '.')}~{queryParams.createEnd.replace(/-/g, '.')}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('create')} />
+ </div>
+ )}
+ {queryParams.closeStart && queryParams.closeEnd && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">办结时间：{queryParams.closeStart.replace(/-/g, '.')}~{queryParams.closeEnd.replace(/-/g, '.')}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('close')} />
+ </div>
+ )}
+ {queryParams.canal && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">事项来源：{getCanalText()}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('canal')} />
+ </div>
+ )}
+ {queryParams.caseLevel && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">事项等级：{caseLevelOptions.find(i=>i.value===queryParams.caseLevel)?.label||''}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('caseLevel')} />
+ </div>
+ )}
+ {queryParams.caseType && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">纠纷类型：{caseTypeSelect.caseTypeSelect.find(i => i.value === queryParams.caseType)?.label || ''}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('caseType')} />
+ </div>
+ )}
+ {(queryParams.queCity||queryParams.queArea||queryParams.queRoad||queryParams.queVillage) && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">问题属地：已选择</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('area')} />
+ </div>
+ )}
+ </div>
+
+
+ {/* 工作总览 */}
+ <div className="work-overview-section">
+ <div className="work-overview-title">工作总览</div>
+ <div className="work-overview-cards">
+ {/* 第一行卡片：总登记、化解中、不予受理 */}
+ <div className="card-row">
+ {/* 总登记卡片 - 蓝色 */}
+ <div className="overview-card total-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayTotalNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyTotalRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momTotalRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.totalNum || 0}</div>
+ <div className="card-name">总登记</div>
+ </div>
+
+ {/* 化解中卡片 - 蓝色 */}
+ <div className="overview-card process-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayProcessNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyProcessRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momProcessRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.processNum || 0}</div>
+ <div className="card-name">化解中</div>
+ </div>
+
+ {/* 不予受理卡片 - 粉色 */}
+ <div className="overview-card reject-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayRejectNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyRejectRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momRejectRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.rejectNum || 0}</div>
+ <div className="card-name">不予受理</div>
+ </div>
+ </div>
+
+ {/* 第二行卡片：已结案、化解成功率 */}
+ <div className="card-row">
+ {/* 已结案卡片 - 黄色 */}
+ <div className="overview-card finish-card">
+ <div className="card-left-content">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayFinishNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyFinishNumRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momFinishNumRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.finishNum || 0}</div>
+ <div className="card-name">已结案</div>
+ </div>
+ <div className="card-right-content">
+ <div className="resolve-success">
+ <div className="resolve-value">{statistics.resolveNum || 0}</div>
+ <div className="resolve-label">化解成功</div>
+ </div>
+ <div className="resolve-fail">
+ <div className="resolve-value">{statistics.unResolveNum || 0}</div>
+ <div className="resolve-label">化解不成功</div>
+ </div>
+ </div>
+ </div>
+
+ {/* 化解成功率卡片 - 绿色 */}
+ <div className="overview-card resolve-rate-card">
+ <div className="rate-value">{statistics.resolveRate || '0'}%</div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyResolveRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momResolveRate)}
+ </div>
+ </div>
+ )}
+ <div className="rate-label">化解成功率</div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ {/* 化解统计区域 */}
+ <div className="work-statistics-section">
+ <div className="work-statistics-section-title">化解统计</div>
+ <div className="work-statistics-tabs">
+ <div className={`tab-item ${activeStatTab === 'total' ? 'active' : ''}`} onClick={() => setActiveStatTab('total')}>
+ 总登记
+ </div>
+ <div className={`tab-item ${activeStatTab === 'processing' ? 'active' : ''}`} onClick={() => setActiveStatTab('processing')}>
+ 化解中
+ </div>
+ <div className={`tab-item ${activeStatTab === 'finished' ? 'active' : ''}`} onClick={() => setActiveStatTab('finished')}>
+ 已结案
+ </div>
+ <div className={`tab-item ${activeStatTab === 'rejected' ? 'active' : ''}`} onClick={() => setActiveStatTab('rejected')}>
+ 不予受理
+ </div>
+ </div>
+ <div className="work-statistics-chart">
+ {renderChartByTab()}
+ </div>
+ </div>
+
+ {/* 纠纷类型区域 */}
+ <div className="work-statistics-section">
+ <div className="work-statistics-section-title">纠纷类型</div>
+ <div className="work-statistics-pie">
+ <MyLTopChartPie
+ data={(statistics.typeList || []).map(item => ({
+ name: item.caseTypeName || '',
+ value: item.caseNum || 0,
+ rate: item.caseRate || '0'
+ }))}
+ showInside={true}
+ adjustLegend={true}
+ />
+ </div>
+ </div>
+
+ {/* 事项等级区域 */}
+ <div className="case-level-section">
+ <div className="case-level-title">事项等级</div>
+ <div className="case-level-list">
+ <div className="case-level-item">
+ <div className="level-name">三级</div>
+ <div className="level-bar-container">
+ <div
+ className="level-bar"
+ style={{
+ width: `${Math.min(100, (statistics.threeLevelNum || 0) / (statistics.totalNum || 1) * 100)}%`
+ }}
+ ></div>
+ </div>
+ <div className="level-count">{statistics.threeLevelNum || 0}</div>
+ </div>
+ <div className="case-level-item">
+ <div className="level-name">二级</div>
+ <div className="level-bar-container">
+ <div
+ className="level-bar"
+ style={{
+ width: `${Math.min(100, (statistics.twoLevelNum || 0) / (statistics.totalNum || 1) * 100)}%`
+ }}
+ ></div>
+ </div>
+ <div className="level-count">{statistics.twoLevelNum || 0}</div>
+ </div>
+ <div className="case-level-item">
+ <div className="level-name">一级</div>
+ <div className="level-bar-container">
+ <div
+ className="level-bar"
+ style={{
+ width: `${Math.min(100, (statistics.oneLevelNum || 0) / (statistics.totalNum || 1) * 100)}%`
+ }}
+ ></div>
+ </div>
+ <div className="level-count">{statistics.oneLevelNum || 0}</div>
+ </div>
+ </div>
+ </div>
+
+ {/* 超时办件区域 */}
+ <div className="timeout-section">
+ <div className="timeout-title">超时办件</div>
+ {/* 类型选项卡 */}
+ <div className="timeout-tabs">
+ <div
+ className={`timeout-tab ${activeTimeoutTab === 1 ? 'active' : ''}`}
+ onClick={() => handleTimeoutTabChange(1)}
+ >
+ 分派超时<span className="count">({timeoutData.fpcs})</span>
+ </div>
+ <div
+ className={`timeout-tab ${activeTimeoutTab === 2 ? 'active' : ''}`}
+ onClick={() => handleTimeoutTabChange(2)}
+ >
+ 受理超时<span className="count">({timeoutData.slcs})</span>
+ </div>
+ <div
+ className={`timeout-tab ${activeTimeoutTab === 3 ? 'active' : ''}`}
+ onClick={() => handleTimeoutTabChange(3)}
+ >
+ 督办回复超时<span className="count">({timeoutData.dbcs})</span>
+ </div>
+ </div>
+
+ {/* 督办/回复状态选项卡 */}
+ <div className="supervise-tabs">
+ <div
+ className={`supervise-tab ${activeSuperviseTab === 0 ? 'active' : ''}`}
+ onClick={() => handleSuperviseTabChange(0)}
+ >
+ {activeTimeoutTab === 3 ? '未回复' : '未督办'}
+ </div>
+ <div
+ className={`supervise-tab ${activeSuperviseTab === 1 ? 'active' : ''}`}
+ onClick={() => handleSuperviseTabChange(1)}
+ >
+ {activeTimeoutTab === 3 ? '已回复' : '已督办'}
+ </div>
+ </div>
+
+ {/* 列表表头 */}
+ <div className="timeout-list-header">
+ <div className="header-seq">序</div>
+ <div className="header-time">流转时间</div>
+ <div className="header-dept">分派部门</div>
+ <div className="header-applicant">申请方</div>
+ <div className="header-action">操作</div>
+ </div>
+
+ {/* 超时列表 */}
+ <div className="timeout-list">
+ {timeoutList.length > 0 ? (
+ timeoutList.map((item, index) => (
+ <div className="timeout-item" key={index}>
+ <div className="item-seq">{(timeoutPagination.page - 1) * timeoutPagination.size + index + 1}</div>
+ <div className="item-time">
+ <span className="time-str">{item.turnaroundTime ? $$.myTimeFormat(new Date(item.turnaroundTime), 'YYYY-MM-DD HH:mm') : ''}</span>
+ {activeSuperviseTab === 0 && (
+ <span className="timeout-tag red">
+ {formatTimeLimit(item.timeLimit)}
+ </span>
+ )}
+ {activeSuperviseTab === 1 && activeTimeoutTab !== 3 && item.supNum > 0 && (
+ <span className="timeout-tag green">已回复</span>
+ )}
+ {activeSuperviseTab === 1 && activeTimeoutTab !== 3 && !(item.supNum > 0) && (
+ <span className="timeout-tag red">未回复</span>
+ )}
+ </div>
+ <div className="item-dept">{item.candeUnitName || '-'}</div>
+ <div className="item-applicant">{item.plaintiffs || '-'}</div>
+ <div className="item-action">
+ <span className="detail-btn" onClick={() => handleDetailClick(item.caseTaskId, item.caseId)}>详情</span>
+ </div>
+ </div>
+ ))
+ ) : (
+ <div className="area-empty">
+ <img src={caseQuery_2} alt="暂无数据" className="area-empty-image" />
+ <div className="area-empty-text">暂无数据</div>
+ </div>
+ )}
+ </div>
+
+ {/* 分页控制 */}
+ {timeoutList.length > 0 && timeoutPagination.totalPages > 1 && (
+ <div className="pagination">
+ {timeoutPagination.page > 1 && (
+ <div className="pagination-btn" onClick={() => handlePageChange(timeoutPagination.page - 1)}>
+ 上一页
+ </div>
+ )}
+ <div className="pagination-info">{timeoutPagination.page}/{timeoutPagination.totalPages}</div>
+ {timeoutPagination.page < timeoutPagination.totalPages && (
+ <div className="pagination-btn" onClick={() => handlePageChange(timeoutPagination.page + 1)}>
+ 下一页
+ </div>
+ )}
+ </div>
+ )}
+ </div>
+
+ {/* 设置筛选条件抽屉 */}
+ <Modal
+ visible={settingVisible}
+ onClose={handleCloseSetting}
+ className="custom-filter-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="custom-filter-content">
+ <div className="filter-item full-row">
+ <div className="filter-label">问题属地</div>
+ <div className="filter-selector"
+ onClick={() => {
+ // 在这里打开地区选择弹窗
+ // 由于地区选择较复杂，可以使用现有的Picker组件或者自定义实现
+ // 这里先简化处理
+ }}
+ >
+ {queryParams.queCity || queryParams.queArea || queryParams.queRoad || queryParams.queVillage
+ ? `已选择地区`
+ : '请选择'}
+ </div>
+ </div>
+ <div className="filter-item">
+ <div className="filter-label">登记时间</div>
+ <div
+ className="filter-selector"
+ onClick={() => handleOpenDateTypeModal('create')}
+ >
+ {queryParams.createStart && queryParams.createEnd ?
+ `${queryParams.createStart}~${queryParams.createEnd}` :
+ '请选择日期范围'
+ }
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">办结时间</div>
+ <div
+ className="filter-selector"
+ onClick={() => handleOpenDateTypeModal('close')}
+ >
+ {queryParams.closeStart && queryParams.closeEnd ?
+ `${queryParams.closeStart}~${queryParams.closeEnd}` :
+ '请选择日期范围'
+ }
+ </div>
+ </div>
+
+ <div className="filter-item full-row">
+ <div className="filter-label">事项来源</div>
+ <div className="canal-radio-group">
+ <div
+ className={`canal-radio${!queryParams.canal ? ' checked' : ''}`}
+ onClick={() => setQueryParams(prev => ({ ...prev, canal: '' }))}
+ >全部{!queryParams.canal && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}</div>
+ {canalOptions.map(opt => (
+ <div
+ key={opt.value}
+ className={`canal-radio${queryParams.canal === opt.value ? ' checked' : ''}`}
+ onClick={() => setQueryParams(prev => ({ ...prev, canal: opt.value }))}
+ >{opt.label}{queryParams.canal === opt.value && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}</div>
+ ))}
+ </div>
+ </div>
+
+
+ <div className="filter-item full-row">
+ <div className="filter-label">纠纷类型</div>
+ <Picker
+ data={caseTypeSelect.caseTypeSelect}
+ cols={2}
+ cascade={true}
+ title="纠纷类型"
+ value={queryParams.caseType ? [queryParams.caseType] : []}
+ okText="确定"
+ onChange={valArr => {
+ // valArr为数组，只有一级时长度为1，二级时长度为2
+ const value = valArr[valArr.length - 1];
+ setQueryParams(prev => ({ ...prev, caseType: value }));
+ }}
+ extra={<span className="select-color">请选择</span>}
+ >
+ <List.Item className="filter-selector">
+ {getCaseTypeLabel(queryParams.caseType) || '请选择'}
+ </List.Item>
+ </Picker>
+ </div>
+ </div>
+
+ <div className="custom-filter-buttons">
+ <Button className="filter-reset" onClick={handleResetFilter}>重置</Button>
+ <Button className="filter-apply" type="primary" onClick={handleApplyFilter}>统计</Button>
+ </div>
+ </Modal>
+
+ {/* 日期选择弹窗 */}
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="date-picker-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择日期范围</div>
+ <CloseOutlined className="modal-close" onClick={() => setDatePickerVisible(false)} />
+ </div>
+ <CalendarRangeTwoDay
+ CalendaronClick={handleCalendarClick}
+ onClickDate={handleDateChange}
+ />
+ </Modal>
+
+ {/* 时间类型选择底部弹窗 */}
+ <Modal
+ visible={dateTypeModalVisible}
+ onClose={() => setDateTypeModalVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择时间类型</div>
+ <CloseOutlined className="modal-close" onClick={() => setDateTypeModalVisible(false)} />
+ </div>
+ <div className="date-type-modal-content">
+ {dateTypeOptions.map(opt => (
+ <div
+ key={opt.value}
+ className="date-type-modal-item"
+ onClick={() => handleDateTypeSelect(opt.value)}
+ >
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default AreaStatistics;
diff --git a/src/views/workStatistics/areaIndex.less b/src/views/workStatistics/areaIndex.less
new file mode 100644
index 0000000..cd76e12
--- /dev/null
+++ b/src/views/workStatistics/areaIndex.less
@@ -0,0 +1,940 @@
+/* 工作统计页面样式 */
+.area-statistics {
+ background-color: #f5f5f5;
+ min-height: 100vh;
+ padding-bottom: 12px;
+
+ /* 筛选条件展示区域样式 */
+ .filter-info-section {
+ margin: 0;
+ background: #fff;
+ padding: 12px 16px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ position: relative;
+ border-bottom: 1px solid #f0f0f0;
+
+ .filter-info-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ position: relative;
+ padding-left: 10px;
+ flex-shrink: 0;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .filter-settings {
+ display: flex;
+ align-items: center;
+ color: #1A6FB8;
+ font-size: 15px;
+ flex-shrink: 0;
+ cursor: pointer;
+
+ .settings-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 4px;
+ }
+ }
+ }
+
+ /* 筛选条件内容样式 */
+ .filter-conditions {
+ background: #fff;
+ padding: 0 16px 12px;
+ display: flex;
+ flex-wrap: wrap;
+
+ .filter-info-item {
+ display: inline-flex;
+ align-items: center;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ padding: 4px 12px;
+ margin-right: 8px;
+ margin-bottom: 4px;
+
+ .filter-info-text {
+ font-size: 13px;
+ color: #555;
+ }
+
+ .filter-info-clear {
+ margin-left: 4px;
+ color: #999;
+ font-size: 12px;
+
+ }
+ }
+ }
+
+ /* 工作总览样式 */
+ .work-overview-section {
+ margin-top: 8px;
+ padding: 8px 12px 12px 12px;
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .work-overview-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin: 0px 0px 7px 0px;
+ position: relative;
+ padding-left: 10px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .work-overview-cards {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+
+ .card-row {
+ display: flex;
+ gap: 6px;
+
+ .overview-card {
+ padding: 8px 0px;
+ color: rgba(23, 26, 29, 0.6);
+ text-align: center;
+
+ .card-day-data {
+ font-size: 13px;
+ margin-bottom: 5px;
+ }
+
+ .card-month-rates {
+ font-size: 12px;
+ margin-bottom: 8px;
+
+ .month-compare, .month-ratio {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .rate-icon {
+ width: 10px;
+ height: 10px;
+ margin-right: 2px;
+ }
+
+ .up {
+ color: #f5222d;
+ display: flex;
+ align-items: center;
+ }
+
+ .down {
+ color: #52c41a;
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+
+ .card-value {
+ font-size: 24px;
+ font-weight: bold;
+ margin-top: auto;
+ margin-bottom: 4px;
+ }
+
+ .card-name {
+ font-size: 14px;
+ }
+ }
+ }
+
+ /* 总登记卡片 - 蓝色 */
+ .total-card {
+ background-color: #e6f7ff;
+ flex: 1;
+ .card-day-data {
+ color: #1A6FB8;
+ }
+
+ .card-value {
+ color: #1677ff;
+ }
+ }
+
+ /* 化解中卡片 - 蓝色 */
+ .process-card {
+ background-color: #e6f7ff;
+ flex: 1;
+ .card-day-data {
+ color: #1A6FB8;
+ }
+
+ .card-value {
+ color: #1677ff;
+ }
+ }
+
+ /* 不予受理卡片 - 粉色 */
+ .reject-card {
+ background-color: #ffece8;
+ flex: 1;
+ .card-day-data {
+ color: #F53F3F;
+ }
+
+ .card-value {
+ color: #f5222d;
+ }
+ }
+
+ /* 已结案卡片 - 黄色 */
+ .finish-card {
+ background-color: #fffbe6;
+ display: flex;
+ flex: 2;
+
+ .card-left-content {
+ flex: 1;
+ text-align: center;
+
+ .card-day-data {
+ color: #EF6C24;
+ }
+
+ .card-value {
+ color: #faad14;
+ }
+ }
+
+ .card-right-content {
+ flex: 1;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ border-left: 1px solid rgba(0, 0, 0, 0.06);
+
+ .resolve-success, .resolve-fail {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin: 4px 8px;
+
+ .resolve-value {
+ font-size: 16px;
+ font-weight: bold;
+ margin-bottom: 2px;
+ }
+
+ .resolve-label {
+ font-size: 12px;
+ }
+ }
+
+ .resolve-success .resolve-value {
+ color: #52c41a;
+ }
+
+ .resolve-fail .resolve-value {
+ color: #f5222d;
+ }
+ }
+ }
+
+ /* 化解成功率卡片 - 绿色 */
+ .resolve-rate-card {
+ background-color: rgba(0, 186, 70, 0.1);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ flex: 1;
+
+ .rate-value {
+ font-size: 22px;
+ font-weight: bold;
+ color: #52c41a;
+ margin-bottom: 4px;
+ }
+
+ .card-month-rates {
+ font-size: 12px;
+ margin-bottom: 4px;
+
+ .month-compare, .month-ratio {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .rate-icon {
+ width: 10px;
+ height: 10px;
+ margin-right: 2px;
+ }
+
+ .up {
+ color: #f5222d;
+ display: flex;
+ align-items: center;
+ }
+
+ .down {
+ color: #52c41a;
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+
+ .rate-label {
+ font-size: 13px;
+ }
+ }
+ }
+ }
+
+ /* 化解统计区域样式 */
+ .work-statistics-section {
+ margin-top: 8px;
+ padding: 8px 12px 12px 12px;
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .work-statistics-section-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ position: relative;
+ padding-left: 10px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .work-statistics-tabs {
+ display: flex;
+ border-bottom: 1px solid #eee;
+ margin-bottom: 12px;
+
+ .tab-item {
+ padding: 8px 16px;
+ font-size: 14px;
+ color: #666;
+ position: relative;
+ cursor: pointer;
+
+ &.active {
+ color: #1677ff;
+ font-weight: 500;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: -1px;
+ left: 0;
+ width: 100%;
+ height: 2px;
+ background-color: #1677ff;
+ border-radius: 1px 1px 0 0;
+ }
+ }
+ }
+ }
+
+ .work-statistics-chart {
+ height: 240px;
+ margin-top: 12px;
+ }
+
+ .work-statistics-pie {
+ height: 280px;
+ margin-top: 12px;
+ }
+ }
+
+ /* 筛选抽屉样式 */
+ .filter-drawer {
+ .filter-content {
+ padding: 16px;
+
+ .filter-item {
+ margin-bottom: 16px;
+
+ .filter-label {
+ margin-bottom: 8px;
+ font-size: 14px;
+ color: #333;
+ }
+
+ .filter-date-picker {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 10px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ color: #666;
+ font-size: 14px;
+
+ .filter-arrow {
+ display: inline-block;
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: rotate(45deg);
+ }
+ }
+ }
+ }
+
+ .filter-actions {
+ display: flex;
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 12px 16px;
+ background: #fff;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
+
+ .filter-reset-btn, .filter-apply-btn {
+ flex: 1;
+ margin: 0 8px;
+ }
+ }
+ }
+
+ /* 日期选择弹窗样式 */
+ .date-picker-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: unset;
+ }
+
+ .am-modal-header {
+ display: none;
+ }
+
+ .am-modal-body {
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-start;
+ top: 44px;
+ overflow: visible;
+ height: calc(100% - 44px);
+ z-index: 999;
+ }
+
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+
+ .calendar-container {
+ height: 80vh;
+ }
+ }
+
+ /* 时间类型选择弹窗样式 */
+ .date-type-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: unset;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-start;
+ top: 44px;
+ overflow: visible;
+ height: calc(100% - 44px);
+ z-index: 999;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .date-type-modal-content {
+ background: #fff;
+ border-radius: 0;
+ padding: 8px 0;
+ min-height: 0;
+ box-shadow: none;
+ }
+ .date-type-modal-item {
+ font-size: 16px;
+ color: #222;
+ padding: 16px;
+ text-align: center;
+ border-bottom: 1px solid #f0f0f0;
+ cursor: pointer;
+ transition: background 0.2s;
+ &:last-child {
+ border-bottom: none;
+ }
+ &:active {
+ background: #f5f7fa;
+ }
+ }
+ }
+
+ /* 事项等级区域样式 */
+ .case-level-section {
+ margin-top: 8px;
+ padding: 8px 12px 1px 12px;
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .case-level-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ position: relative;
+ padding-left: 10px;
+ padding-bottom: 10px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 40%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .case-level-list {
+ .case-level-item {
+ display: flex;
+ align-items: center;
+ margin-bottom: 16px;
+
+ .level-name {
+ width: 40px;
+ font-size: 14px;
+ color: #333;
+ flex-shrink: 0;
+ }
+
+ .level-bar-container {
+ flex: 1;
+ height: 16px;
+ background-color: #f0f2f5;
+ // border-radius: 4px;
+ overflow: hidden;
+ margin: 0 16px;
+ position: relative;
+
+ .level-bar {
+ height: 100%;
+ // background-color: #1677ff;
+ background: linear-gradient(90deg,#1a6fb8, #5fa6d4 100%);
+ // border-radius: 4px;
+ }
+ }
+
+ .level-count {
+ font-size: 14px;
+ color: #999;
+ width: 40px;
+ text-align: right;
+ }
+ }
+ }
+ }
+
+ /* 超时办件区域样式 */
+ .timeout-section {
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .timeout-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin-top: 8px;
+ position: relative;
+ padding-left: 10px;
+ padding: 8px 0 8px 26px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 16px;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .timeout-tabs {
+ display: flex;
+ margin-bottom: 12px;
+ overflow-x: auto;
+ padding: 0 10px;
+
+ .timeout-tab {
+ flex: 1;
+ height: 36px;
+ line-height: 36px;
+ text-align: center;
+ font-size: 14px;
+ color: #1A6FB8;
+ padding: 0 8px;
+ cursor: pointer;
+ white-space: nowrap;
+ border: 1px solid #1A6FB8;
+
+ &:last-child {
+ margin-right: 0;
+ }
+
+ &.active {
+ color: #fff;
+ background: #1A6FB8;
+ }
+
+ .count {
+ margin-left: 4px;
+ font-weight: 500;
+ }
+ }
+ }
+
+ .supervise-tabs {
+ display: flex;
+ margin-bottom: 12px;
+ padding: 0 16px;
+
+ .supervise-tab {
+ padding: 0px 8px 0px 8px;
+ font-size: 13px;
+ color: #666;
+ background: #f5f5f5;
+ border-radius: 12px;
+ margin-right: 8px;
+ cursor: pointer;
+ border: 1px solid #1A6FB8;
+
+ &.active {
+ color: #1677ff;
+ background: #e6f7ff;
+ font-weight: 500;
+ }
+ }
+ }
+
+ .timeout-list-header {
+ display: flex;
+ padding: 10px 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background-color: #f5f5f5;
+ font-size: 14px;
+ color: #333;
+
+ .header-seq {
+ width: 20px;
+ flex-shrink: 0;
+ }
+
+ .header-time {
+ flex: 2;
+ margin-left: 4px;
+ }
+
+ .header-dept {
+ flex: 1;
+ }
+
+ .header-applicant {
+ flex: 1;
+ margin-left: 10px;
+ }
+
+ .header-action {
+ width: 60px;
+ text-align: center;
+ flex-shrink: 0;
+ }
+ }
+
+ .timeout-list {
+ padding: 0 16px;
+
+ .timeout-item {
+ padding: 4px 0;
+ border-bottom: 1px solid #f0f0f0;
+ display: flex;
+ align-items: center;
+
+ &:last-child {
+ border-bottom: none;
+ }
+
+ .item-seq {
+ width: 20px;
+ flex-shrink: 0;
+ font-size: 14px;
+ color: #666;
+ }
+
+ .item-time {
+ flex: 2;
+
+ .time-str {
+ font-size: 14px;
+ color: #666;
+ display: block;
+ margin-left: 4px;
+ }
+
+ .timeout-tag {
+ display: inline-block;
+ padding: 2px 8px;
+ font-size: 12px;
+ border-radius: 10px;
+ margin-top: 4px;
+
+ &.red {
+ color: #f5222d;
+ background: #fff1f0;
+ }
+
+ &.green {
+ color: #52c41a;
+ background: #f6ffed;
+ }
+ }
+ }
+
+ .item-dept {
+ flex: 1;
+ font-size: 13px;
+ color: #333;
+ word-break: break-all;
+ }
+
+ .item-applicant {
+ flex: 1;
+ font-size: 13px;
+ color: #333;
+ word-break: break-all;
+ margin-left: 10px;
+ }
+
+ .item-action {
+ width: 60px;
+ flex-shrink: 0;
+ text-align: center;
+
+ .detail-btn {
+ padding: 2px 12px;
+ font-size: 13px;
+ color: #1677ff;
+ background: #fff;
+ border: 1px solid #1677ff;
+ border-radius: 12px;
+ cursor: pointer;
+ }
+ }
+ }
+ }
+
+ .pagination {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin-top: 16px;
+ padding-bottom: 16px;
+ font-size: 14px;
+ color: #666;
+
+ .pagination-info {
+ margin: 0 16px;
+ }
+
+ .pagination-btn {
+ height: 28px;
+ width: 68px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #1A6FB8;
+ background: #fff;
+ border: 1px solid #1A6FB8;
+ border-radius: 4px;
+ cursor: pointer;
+ margin: 0 8px;
+
+ &:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+ }
+ }
+ }
+ }
+ }
+
+ .area-empty {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ position: relative;
+ padding-bottom: 50px;
+ z-index: 0;
+
+ .area-empty-icon {
+ width: 260px;
+ height: 260px;
+ padding-top: 120px;
+ border: 1px dashed rgba(23, 26, 29, 0.1);
+ border-radius: 8px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ img {
+ width: 120px;
+ height: 120px;
+ object-fit: contain;
+ }
+ }
+
+ .area-loading-text,
+ .area-empty-text {
+ color: rgba(23, 26, 29, 0.4);
+ font-size: 16px;
+ }
+ .area-empty-image {
+ width: 200px;
+ height: 200px;
+ }
+ }
\ No newline at end of file
diff --git a/src/views/workStatistics/index.jsx b/src/views/workStatistics/index.jsx
new file mode 100644
index 0000000..61354a9
--- /dev/null
+++ b/src/views/workStatistics/index.jsx
@@ -0,0 +1,997 @@
+/*
+ * @Company: hugeInfo
+ * @Author: AI
+ * @Date: 2025-04-17 16:30:00
+ * @LastEditTime: 2025-05-23 15:29:34
+ * @LastEditors: lwh
+ * @Version: 1.0.0
+ * @Description: 工作统计
+ */
+import React, { useEffect, useState } from 'react';
+import { useHistory, useLocation } from 'react-router-dom';
+import { Drawer, Tabs, Button, Select, Modal, Picker, List } from 'dingtalk-design-mobile';
+import { ArrowOutlined, SettingOutlined, CloseOutlined } from 'dd-icons';
+import * as $$ from '../../utils/utility';
+import caseTypeSelect from '../../utils/caseTypeSelect';
+import NavBarPage from '../../components/NavBarPage';
+import MyChartBar from './MyChartBar';
+import MyLTopChartPie from './MyLTopChartPie';
+import CalendarRangeTwoDay from '../../components/CalendarRangeTwoDay';
+import ModalDown from '../../components/ModalDown';
+import { workStatistics_3, workStatistics_4, workStatistics_5, applyClose_1 } from '../../assets/img';
+import './index.less';
+import WorkStatisticsTabs, { getCurrentTabKeyByLocation } from '../../components/WorkStatisticsTabs';
+
+// 获取工作统计数据
+function getWorkStatisticsApi(data) {
+ return $$.ax.request({ url: 'caseInfo/workStatistics', type: 'get', data, service: 'mediate' });
+}
+
+const WorkStatistics = () => {
+ const history = useHistory();
+ const location = useLocation();
+ const currentTab = getCurrentTabKeyByLocation(location);
+
+ // 事项来源选项
+ const canalOptions = [
+ { value: '22_00001-1', label: '大厅来访' },
+ { value: '22_00001-2', label: '线上来访' },
+ { value: '22_00001-3', label: '自行排查' },
+ { value: '22_00001-4', label: '协同推送' },
+ ];
+
+ // 事项等级选项
+ const caseLevelOptions = [
+ { value: '1', label: '一级' },
+ { value: '2', label: '二级' },
+ { value: '3', label: '三级' },
+ ];
+
+ // 新增：时间类型选项
+ const dateTypeOptions = [
+ { value: 'custom', label: '自定义' },
+ { value: 'lastMonth', label: '上月' },
+ { value: 'lastWeek', label: '上周' },
+ { value: 'thisMonth', label: '本月' },
+ { value: 'thisWeek', label: '本周' },
+ { value: 'thisYear', label: '本年度' },
+ { value: 'lastYear', label: '上年度' },
+ ];
+
+ const [loading, setLoading] = useState(false);
+ const [settingVisible, setSettingVisible] = useState(false);
+ const [datePickerVisible, setDatePickerVisible] = useState(false);
+ const [currentDateType, setCurrentDateType] = useState('');
+ const [activeStatTab, setActiveStatTab] = useState('total');
+ const [dateTypeModalVisible, setDateTypeModalVisible] = useState(false);
+ const [dateTypeTarget, setDateTypeTarget] = useState(''); // 'create' or 'close'
+ const userInfo = $$.getSessionStorage('customerSystemUser');
+
+ const [screenModal, setScreenModal] = useState({
+ dataList: [
+ {
+ title: '登记时间',
+ column: '1',
+ type: 'rangePicker',
+ key: ['createTimeStart', 'createTimeEnd'],
+ },
+ ],
+ visible: false,
+ });
+
+ // 查询参数
+ const [queryParams, setQueryParams] = useState({
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ closeStart: '',
+ closeEnd: '',
+ canal: '',
+ caseLevel: '',
+ caseType: '',
+ });
+
+ // 临时筛选条件（用于抽屉中的操作，不立即生效）
+ const [tempFilterParams, setTempFilterParams] = useState({
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ closeStart: '',
+ closeEnd: '',
+ canal: '',
+ caseLevel: '',
+ caseType: '',
+ });
+
+ // 统计数据
+ const [statistics, setStatistics] = useState({
+ totalNum: 0,
+ processNum: 0,
+ finishNum: 0,
+ rejectNum: 0,
+ resolveNum: 0,
+ resolveRate: '0',
+ unResolveNum: 0,
+ toDayTotalNum: 0,
+ toDayProcessNum: 0,
+ toDayRejectNum: 0,
+ toDayFinishNum: 0,
+ momTotalRate: '0',
+ yoyTotalRate: '0',
+ momProcessRate: '0',
+ yoyProcessRate: '0',
+ momRejectRate: '0',
+ yoyRejectRate: '0',
+ momFinishNumRate: '0',
+ yoyFinishNumRate: '0',
+ momResolveRate: '0',
+ yoyResolveRate: '0',
+ typeList: [],
+ timeList: [],
+ });
+
+ // 视图切换相关
+ const [viewDrawerVisible, setViewDrawerVisible] = useState(false);
+ const [selectedView, setSelectedView] = useState('个人工作统计'); // 默认选中
+ const viewOptions = [
+ { label: '个人工作统计', value: '个人工作统计' },
+ { label: '部门工作统计', value: '部门工作统计' },
+ { label: '区域工作统计', value: '区域工作统计' },
+ ];
+
+ // 检查值是否以特定字符开头，防止null错误
+ const startsWithSafe = (value, char) => {
+ return value && typeof value === 'string' && value.startsWith(char);
+ };
+
+ // 初始化加载数据
+ useEffect(() => {
+ fetchStatisticsData();
+ }, [location, queryParams]);
+
+ // 监听路由变化
+ useEffect(() => {
+ const path = window.location.pathname;
+ if (path === '/gzdyh/workStatistics') {
+ // setCurrentTab('个人工作统计');
+ } else if (path === '/gzdyh/areaStatistics') {
+ // setCurrentTab('区域工作统计');
+ }
+ }, [window.location.pathname]);
+
+ // 获取统计数据
+ const fetchStatisticsData = async () => {
+ global.setSpinning(true);
+ setLoading(true);
+ try {
+ const res = await getWorkStatisticsApi({
+ ...queryParams,
+ workType: currentTab === '个人工作统计' ? 1 : 2,
+ });
+ if (res.type && res.data) {
+ // 确保所有需要的字段都存在，避免null错误
+ const data = {
+ ...statistics,
+ ...res.data,
+ // 确保这些字段不为null
+ momTotalRate: res.data.momTotalRate || '0',
+ yoyTotalRate: res.data.yoyTotalRate || '0',
+ momProcessRate: res.data.momProcessRate || '0',
+ yoyProcessRate: res.data.yoyProcessRate || '0',
+ momRejectRate: res.data.momRejectRate || '0',
+ yoyRejectRate: res.data.yoyRejectRate || '0',
+ momFinishNumRate: res.data.momFinishNumRate || '0',
+ yoyFinishNumRate: res.data.yoyFinishNumRate || '0',
+ momResolveRate: res.data.momResolveRate || '0',
+ yoyResolveRate: res.data.yoyResolveRate || '0',
+ resolveRate: res.data.resolveRate || '0',
+ timeList: Array.isArray(res.data.timeList) ? res.data.timeList : [],
+ typeList: Array.isArray(res.data.typeList) ? res.data.typeList : [],
+ };
+ setStatistics(data);
+ }
+ } catch (error) {
+ console.error('获取工作统计数据失败', error);
+ } finally {
+ setLoading(false);
+ global.setSpinning(false);
+ }
+ };
+
+ // 打开设置抽屉时，将当前查询参数同步到临时参数
+ const handleOpenSetting = () => {
+ setTempFilterParams({ ...queryParams });
+ setSettingVisible(true);
+ };
+
+ // 关闭设置抽屉
+ const handleCloseSetting = () => {
+ setSettingVisible(false);
+ };
+
+ // 重置筛选条件（只重置临时参数）
+ const handleResetFilter = () => {
+ setTempFilterParams({
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ closeStart: '',
+ closeEnd: '',
+ canal: '',
+ caseLevel: '',
+ caseType: '',
+ });
+ };
+
+ // 应用筛选条件（将临时参数更新到正式查询参数）
+ const handleApplyFilter = () => {
+ setQueryParams({ ...tempFilterParams });
+ setSettingVisible(false);
+ };
+
+ // 处理日期选择
+ const handleOpenDatePicker = (type) => {
+ setCurrentDateType(type);
+ setDatePickerVisible(true);
+ };
+
+ // 处理日期变更
+ const handleDateChange = (dates) => {
+ if (!dates || dates.length !== 2) return;
+
+ const formatDate = (date) => {
+ if (!date || !date.key) return '';
+ return date.key;
+ };
+
+ const formattedStart = formatDate(dates[0]);
+ const formattedEnd = formatDate(dates[1]);
+
+ switch (currentDateType) {
+ case 'create':
+ setTempFilterParams((prev) => ({
+ ...prev,
+ createStart: formattedStart,
+ createEnd: formattedEnd,
+ }));
+ break;
+ case 'close':
+ setTempFilterParams((prev) => ({
+ ...prev,
+ closeStart: formattedStart,
+ closeEnd: formattedEnd,
+ }));
+ break;
+ default:
+ break;
+ }
+ setDatePickerVisible(false);
+ };
+
+ // 日历组件操作处理
+ const handleCalendarClick = (type, action) => {
+ if (action === 'onClose') {
+ setDatePickerVisible(false);
+ } else if (action === 'submit') {
+ setDatePickerVisible(false);
+ }
+ };
+
+ // 获取统计时间类型显示文本（当月、当年、当日）
+ const getTimeTypeText = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return '当日';
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ // 检查是否为整月
+ if (
+ startDate.getDate() === 1 &&
+ endDate.getDate() === new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate() &&
+ startDate.getMonth() === endDate.getMonth() &&
+ startDate.getFullYear() === endDate.getFullYear()
+ ) {
+ return '当月';
+ }
+
+ // 检查是否为整年
+ if (
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear()
+ ) {
+ return '当年';
+ }
+
+ return '当日';
+ };
+
+ // 判断是否为整月或整年
+ const isFullMonthOrYear = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return false;
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ // 检查是否为整月
+ const isFullMonth =
+ startDate.getDate() === 1 &&
+ endDate.getDate() === new Date(endDate.getFullYear(), endDate.getMonth() + 1, 0).getDate() &&
+ startDate.getMonth() === endDate.getMonth() &&
+ startDate.getFullYear() === endDate.getFullYear();
+
+ // 检查是否为整年
+ const isFullYear =
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear();
+
+ return isFullMonth || isFullYear;
+ };
+
+ // 判断是否为整年
+ const isFullYear = () => {
+ if (!queryParams.createStart || !queryParams.createEnd) return false;
+
+ const startDate = new Date(queryParams.createStart);
+ const endDate = new Date(queryParams.createEnd);
+
+ return (
+ startDate.getMonth() === 0 &&
+ startDate.getDate() === 1 &&
+ endDate.getMonth() === 11 &&
+ endDate.getDate() === 31 &&
+ startDate.getFullYear() === endDate.getFullYear()
+ );
+ };
+
+ // 获取对比文本（月同比/年同比）
+ const getCompareText = () => {
+ return isFullYear() ? '年同比' : '月同比';
+ };
+
+ // 获取环比文本（月环比/年环比）
+ const getRatioText = () => {
+ return isFullYear() ? '年环比' : '月环比';
+ };
+
+ // 获取事项来源文本
+ const getCanalText = () => {
+ if (!queryParams.canal) return '全部';
+ const option = canalOptions.find((item) => item.value === queryParams.canal);
+ return option ? option.label : '全部';
+ };
+
+ // 获取筛选条件显示信息
+ const getFilterInfoText = () => {
+ const info = [];
+
+ // 添加登记时间
+ if (queryParams.createStart && queryParams.createEnd) {
+ info.push(`登记时间：${queryParams.createStart.replace(/-/g, '.')}–${queryParams.createEnd.replace(/-/g, '.')}`);
+ }
+
+ // 添加事项来源
+ info.push(`事项来源：${getCanalText()}`);
+
+ return info;
+ };
+
+ // 清除单个筛选条件
+ const clearFilterItem = (type) => {
+ switch (type) {
+ case 'create':
+ setQueryParams((prev) => ({
+ ...prev,
+ createStart: $$.myTimeFormat(new Date(new Date().getFullYear(), new Date().getMonth(), 1), 'YYYY-MM-DD'),
+ createEnd: $$.myTimeFormat(new Date(), 'YYYY-MM-DD'),
+ }));
+ break;
+ case 'close':
+ setQueryParams((prev) => ({
+ ...prev,
+ closeStart: '',
+ closeEnd: '',
+ }));
+ break;
+ case 'canal':
+ setQueryParams((prev) => ({
+ ...prev,
+ canal: '',
+ }));
+ break;
+ case 'caseLevel':
+ setQueryParams((prev) => ({
+ ...prev,
+ caseLevel: '',
+ }));
+ break;
+ case 'caseType':
+ setQueryParams((prev) => ({
+ ...prev,
+ caseType: '',
+ }));
+ break;
+ case 'area':
+ setQueryParams((prev) => ({
+ ...prev,
+ queCity: '',
+ queArea: '',
+ queRoad: '',
+ queVillage: '',
+ }));
+ break;
+ default:
+ break;
+ }
+
+ // 清除后立即更新数据
+ setTimeout(() => {
+ fetchStatisticsData();
+ }, 0);
+ };
+
+ // 渲染同比环比的图标和数据
+ const renderRateWithIcon = (rate) => {
+ if (!rate) return '0%';
+
+ // 去掉+/-符号
+ const rateValue = rate.replace(/[+\-]/g, '');
+ const isPositive = !startsWithSafe(rate, '-');
+
+ return (
+ <span className={isPositive ? 'up' : 'down'}>
+ <img src={isPositive ? workStatistics_3 : workStatistics_4} alt="" className="rate-icon" />
+ {rateValue}%
+ </span>
+ );
+ };
+
+ // 渲染化解统计图表
+ const renderChartByTab = () => {
+ // 确保timeList是数组
+ const timeList = Array.isArray(statistics.timeList) ? statistics.timeList : [];
+
+ switch (activeStatTab) {
+ case 'total':
+ return (
+ <MyChartBar
+ data={timeList.map((item) => ({
+ caseNum: item.totalNum || 0,
+ name: item.timeStr || '',
+ }))}
+ dataAxis={timeList.map((item) => item.timeStr || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ case 'processing':
+ return (
+ <MyChartBar
+ data={timeList.map((item) => ({
+ caseNum: item.processNum || 0,
+ name: item.timeStr || '',
+ }))}
+ dataAxis={timeList.map((item) => item.timeStr || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ case 'finished':
+ return (
+ <MyChartBar
+ data={timeList.map((item) => ({
+ resolveNum: item.resolveNum || 0,
+ unResolveNum: item.unResolveNum || 0,
+ name: item.timeStr || '',
+ }))}
+ dataAxis={timeList.map((item) => item.timeStr || '')}
+ barColor={['#08979C', '#F2657D']}
+ isStacked={true}
+ />
+ );
+ case 'rejected':
+ return (
+ <MyChartBar
+ data={timeList.map((item) => ({
+ caseNum: item.rejectNum || 0,
+ name: item.timeStr || '',
+ }))}
+ dataAxis={timeList.map((item) => item.timeStr || '')}
+ barColor={['#5fa6d4', '#1a6fb8']}
+ />
+ );
+ default:
+ return null;
+ }
+ };
+
+ // 计算时间范围
+ const getDateRangeByType = (type) => {
+ const now = new Date();
+ let start, end;
+ switch (type) {
+ case 'lastMonth': {
+ const year = now.getMonth() === 0 ? now.getFullYear() - 1 : now.getFullYear();
+ const month = now.getMonth() === 0 ? 11 : now.getMonth() - 1;
+ start = new Date(year, month, 1);
+ end = new Date(year, month + 1, 0);
+ break;
+ }
+ case 'thisMonth': {
+ start = new Date(now.getFullYear(), now.getMonth(), 1);
+ end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
+ break;
+ }
+ case 'lastWeek': {
+ const day = now.getDay() || 7;
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day);
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day - 6);
+ break;
+ }
+ case 'thisWeek': {
+ const day = now.getDay() || 7;
+ start = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 1);
+ end = new Date(now.getFullYear(), now.getMonth(), now.getDate() - day + 7);
+ break;
+ }
+ case 'thisYear': {
+ start = new Date(now.getFullYear(), 0, 1);
+ end = new Date(now.getFullYear(), 11, 31);
+ break;
+ }
+ case 'lastYear': {
+ start = new Date(now.getFullYear() - 1, 0, 1);
+ end = new Date(now.getFullYear() - 1, 11, 31);
+ break;
+ }
+ default:
+ start = end = now;
+ }
+ return [$$.myTimeFormat(start, 'YYYY-MM-DD'), $$.myTimeFormat(end, 'YYYY-MM-DD')];
+ };
+
+ // 打开时间类型弹窗
+ const handleOpenDateTypeModal = (target) => {
+ setDateTypeTarget(target);
+ setDateTypeModalVisible(true);
+ };
+
+ // 选择时间类型
+ const handleDateTypeSelect = (type) => {
+ setDateTypeModalVisible(false);
+ if (type === 'custom') {
+ handleOpenDatePicker(dateTypeTarget);
+ } else {
+ const [start, end] = getDateRangeByType(type);
+ if (dateTypeTarget === 'create') {
+ setTempFilterParams((prev) => ({ ...prev, createStart: start, createEnd: end }));
+ } else if (dateTypeTarget === 'close') {
+ setTempFilterParams((prev) => ({ ...prev, closeStart: start, closeEnd: end }));
+ }
+ }
+ };
+
+ // 在组件内增加一个方法用于获取label
+ const getCaseTypeLabel = (value) => {
+ if (!value) return '';
+ let label = '';
+ caseTypeSelect.caseTypeSelect.forEach((item) => {
+ if (item.value === value) {
+ label = item.label;
+ } else if (item.children) {
+ const child = item.children.find((child) => child.value === value);
+ if (child) label = child.label;
+ }
+ });
+ return label;
+ };
+
+ // 筛选重置 确定
+ function handleScreen(data, list) {
+ console.log(data, list);
+ // let submitData = { ...data };
+ setScreenModal({ dataList: list, visible: false });
+ // setModalTop({ dataList: list, visible: false });
+ // getListData({ ...data, page: 1, size: 10 }, 'spin');
+ // // getListData({ ...search, ...submitData, page: 1, }, "spin");
+ }
+
+ function modalClick() {}
+
+ return (
+ <NavBarPage
+ title={currentTab}
+ rightContentFunc={() => setViewDrawerVisible(true)}
+ rightChildren={userInfo.ctUseroleList?.some((item) => item.roleCode === '22_00024-2' || item.roleCode === '22_00024-3') ? '切换视图' : ''}
+ >
+ {/* <WorkStatisticsTabs /> */}
+ <div className="work-statistics">
+ {/* 筛选条件展示区域 */}
+ <div className="filter-info-section">
+ <div className="filter-info-title">筛选条件</div>
+ <div className="filter-settings" onClick={handleOpenSetting}>
+ <img src={workStatistics_5} alt="" className="settings-icon" />
+ <span>设置</span>
+ </div>
+ </div>
+
+ {/* 筛选条件内容 */}
+ <div className="filter-conditions">
+ {queryParams.createStart && queryParams.createEnd && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">
+ 登记时间：{queryParams.createStart.replace(/-/g, '.')}~{queryParams.createEnd.replace(/-/g, '.')}
+ </span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('create')} />
+ </div>
+ )}
+ {queryParams.closeStart && queryParams.closeEnd && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">
+ 办结时间：{queryParams.closeStart.replace(/-/g, '.')}~{queryParams.closeEnd.replace(/-/g, '.')}
+ </span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('close')} />
+ </div>
+ )}
+ {queryParams.canal && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">事项来源：{getCanalText()}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('canal')} />
+ </div>
+ )}
+ {queryParams.caseLevel && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">事项等级：{caseLevelOptions.find((i) => i.value === queryParams.caseLevel)?.label || ''}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('caseLevel')} />
+ </div>
+ )}
+ {queryParams.caseType && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">纠纷类型：{getCaseTypeLabel(queryParams.caseType) || ''}</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('caseType')} />
+ </div>
+ )}
+ {(queryParams.queCity || queryParams.queArea || queryParams.queRoad || queryParams.queVillage) && (
+ <div className="filter-info-item">
+ <span className="filter-info-text">问题属地：已选择</span>
+ <CloseOutlined className="filter-info-clear" onClick={() => clearFilterItem('area')} />
+ </div>
+ )}
+ </div>
+
+ {/* 工作总览 */}
+ <div className="work-overview-section">
+ <div className="work-overview-title">工作总览</div>
+ <div className="work-overview-cards">
+ {/* 第一行卡片：总登记、化解中、不予受理 */}
+ <div className="card-row">
+ {/* 总登记卡片 - 蓝色 */}
+ <div className="overview-card total-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayTotalNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyTotalRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momTotalRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.totalNum || 0}</div>
+ <div className="card-name">总登记</div>
+ </div>
+
+ {/* 化解中卡片 - 蓝色 */}
+ <div className="overview-card process-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayProcessNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyProcessRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momProcessRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.processNum || 0}</div>
+ <div className="card-name">化解中</div>
+ </div>
+
+ {/* 不予受理卡片 - 粉色 */}
+ <div className="overview-card reject-card">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayRejectNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyRejectRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momRejectRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.rejectNum || 0}</div>
+ <div className="card-name">不予受理</div>
+ </div>
+ </div>
+
+ {/* 第二行卡片：已结案、化解成功率 */}
+ <div className="card-row">
+ {/* 已结案卡片 - 黄色 */}
+ <div className="overview-card finish-card">
+ <div className="card-left-content">
+ <div className="card-day-data">
+ {getTimeTypeText()}+{statistics.toDayFinishNum || 0}
+ </div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyFinishNumRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momFinishNumRate)}
+ </div>
+ </div>
+ )}
+ <div className="card-value">{statistics.finishNum || 0}</div>
+ <div className="card-name">已结案</div>
+ </div>
+ <div className="card-right-content">
+ <div className="resolve-success">
+ <div className="resolve-value">{statistics.resolveNum || 0}</div>
+ <div className="resolve-label">化解成功</div>
+ </div>
+ <div className="vertical-divider"></div>
+ <div className="resolve-fail">
+ <div className="resolve-value">{statistics.unResolveNum || 0}</div>
+ <div className="resolve-label">化解不成功</div>
+ </div>
+ </div>
+ </div>
+
+ {/* 化解成功率卡片 - 绿色 */}
+ <div className="overview-card resolve-rate-card">
+ <div className="rate-value">{statistics.resolveRate || '0'}%</div>
+ {isFullMonthOrYear() && (
+ <div className="card-month-rates">
+ <div className="month-compare">
+ {getCompareText()} {renderRateWithIcon(statistics.yoyResolveRate)}
+ </div>
+ <div className="month-ratio">
+ {getRatioText()} {renderRateWithIcon(statistics.momResolveRate)}
+ </div>
+ </div>
+ )}
+ <div className="rate-label">化解成功率</div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ {/* 化解统计区域 */}
+ <div className="work-statistics-section">
+ <div className="work-statistics-section-title">化解统计</div>
+ <div className="work-statistics-tabs">
+ <div className={`tab-item ${activeStatTab === 'total' ? 'active' : ''}`} onClick={() => setActiveStatTab('total')}>
+ 总登记
+ </div>
+ <div className={`tab-item ${activeStatTab === 'processing' ? 'active' : ''}`} onClick={() => setActiveStatTab('processing')}>
+ 化解中
+ </div>
+ <div className={`tab-item ${activeStatTab === 'finished' ? 'active' : ''}`} onClick={() => setActiveStatTab('finished')}>
+ 已结案
+ </div>
+ <div className={`tab-item ${activeStatTab === 'rejected' ? 'active' : ''}`} onClick={() => setActiveStatTab('rejected')}>
+ 不予受理
+ </div>
+ </div>
+ <div className="work-statistics-chart">{renderChartByTab()}</div>
+ </div>
+
+ {/* 纠纷类型区域 */}
+ <div className="work-statistics-section">
+ <div className="work-statistics-section-title">纠纷类型</div>
+ <div className="work-statistics-pie">
+ <MyLTopChartPie
+ data={(statistics.typeList || []).map((item) => ({
+ name: item.caseTypeName || '',
+ value: item.caseNum || 0,
+ rate: item.caseRate || '0',
+ }))}
+ showInside={true}
+ adjustLegend={true}
+ />
+ </div>
+ </div>
+
+ {/* 设置筛选条件抽屉 */}
+ <Drawer
+ visible={settingVisible}
+ onClose={handleCloseSetting}
+ className="custom-filter-drawer"
+ position="top"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="custom-filter-content">
+ <div className="filter-item">
+ <div className="filter-label">登记时间</div>
+ <div className="filter-selector" onClick={() => handleOpenDateTypeModal('create')}>
+ {tempFilterParams.createStart && tempFilterParams.createEnd ? `${tempFilterParams.createStart}~${tempFilterParams.createEnd}` : '请选择日期范围'}
+ </div>
+ </div>
+
+ <div className="filter-item">
+ <div className="filter-label">办结时间</div>
+ <div className="filter-selector" onClick={() => handleOpenDateTypeModal('close')}>
+ {tempFilterParams.closeStart && tempFilterParams.closeEnd ? `${tempFilterParams.closeStart}~${tempFilterParams.closeEnd}` : '请选择日期范围'}
+ </div>
+ </div>
+
+ <div className="filter-item full-row">
+ <div className="filter-label">事项来源</div>
+ <div className="canal-radio-group">
+ <div
+ className={`canal-radio${!tempFilterParams.canal ? ' checked' : ''}`}
+ onClick={() => setTempFilterParams((prev) => ({ ...prev, canal: '' }))}
+ >
+ 全部{!tempFilterParams.canal && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}
+ </div>
+ {canalOptions.map((opt) => (
+ <div
+ key={opt.value}
+ className={`canal-radio${tempFilterParams.canal === opt.value ? ' checked' : ''}`}
+ onClick={() => setTempFilterParams((prev) => ({ ...prev, canal: opt.value }))}
+ >
+ {opt.label}
+ {tempFilterParams.canal === opt.value && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}
+ </div>
+ ))}
+ </div>
+ </div>
+
+ <div className="filter-item full-row">
+ <div className="filter-label">事项等级</div>
+ <div className="canal-radio-group">
+ <div
+ className={`canal-radio${!tempFilterParams.caseLevel ? ' checked' : ''}`}
+ onClick={() => setTempFilterParams((prev) => ({ ...prev, caseLevel: '' }))}
+ >
+ 全部{!tempFilterParams.caseLevel && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}
+ </div>
+ {caseLevelOptions.map((opt) => (
+ <div
+ key={opt.value}
+ className={`canal-radio${tempFilterParams.caseLevel === opt.value ? ' checked' : ''}`}
+ onClick={() => setTempFilterParams((prev) => ({ ...prev, caseLevel: opt.value }))}
+ >
+ {opt.label}
+ {tempFilterParams.caseLevel === opt.value && <img src={applyClose_1} alt="选中" className="audit-radio-checked" />}
+ </div>
+ ))}
+ </div>
+ </div>
+
+ <div className="filter-item full-row">
+ <div className="filter-label">纠纷类型</div>
+ <Picker
+ data={caseTypeSelect.caseTypeSelect}
+ cols={2}
+ cascade={true}
+ title="纠纷类型"
+ value={tempFilterParams.caseType ? [tempFilterParams.caseType] : []}
+ okText="确定"
+ onOk={(valArr) => {
+ // 支持选中第一级或第二级
+ const value = valArr.filter(Boolean).slice(-1)[0];
+ setTempFilterParams((prev) => ({ ...prev, caseType: value }));
+ }}
+ >
+ <List.Item className="filter-selector">
+ {getCaseTypeLabel(tempFilterParams.caseType) || <div className="filter-item-select">请选择</div>}
+ </List.Item>
+ </Picker>
+ </div>
+ </div>
+
+ <div className="custom-filter-buttons">
+ <Button className="filter-reset" onClick={handleResetFilter}>
+ 重置
+ </Button>
+ <Button className="filter-apply" type="primary" onClick={handleApplyFilter}>
+ 统计
+ </Button>
+ </div>
+ </Drawer>
+
+ {/* 日期选择弹窗 */}
+ <Modal
+ visible={datePickerVisible}
+ onClose={() => setDatePickerVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择日期范围</div>
+ <CloseOutlined className="modal-close" onClick={() => setDatePickerVisible(false)} />
+ </div>
+ <CalendarRangeTwoDay CalendaronClick={handleCalendarClick} onClickDate={handleDateChange} />
+ </Modal>
+
+ {/* 时间类型选择底部弹窗 */}
+ <Modal
+ visible={dateTypeModalVisible}
+ onClose={() => setDateTypeModalVisible(false)}
+ className="date-type-modal"
+ position="bottom"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="modal-header">
+ <div className="modal-title">选择时间类型</div>
+ <CloseOutlined className="modal-close" onClick={() => setDateTypeModalVisible(false)} />
+ </div>
+ <div className="date-type-modal-content">
+ {dateTypeOptions.map((opt) => (
+ <div key={opt.value} className="date-type-modal-item" onClick={() => handleDateTypeSelect(opt.value)}>
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Modal>
+
+ {/* 切换视图底部抽屉 */}
+ <Drawer
+ visible={viewDrawerVisible}
+ onClose={() => setViewDrawerVisible(false)}
+ position="bottom"
+ className="switch-view-drawer"
+ maskClosable={true}
+ popup
+ transparent={false}
+ >
+ <div className="switch-view-header">
+ <span className="switch-view-close" onClick={() => setViewDrawerVisible(false)}>
+ ×
+ </span>
+ <span className="switch-view-title">切换视图</span>
+ <span
+ className="switch-view-confirm"
+ onClick={() => {
+ setViewDrawerVisible(false);
+ }}
+ >
+ 确定
+ </span>
+ </div>
+ <div className="switch-view-list">
+ {viewOptions.map((opt) => (
+ <div
+ key={opt.value}
+ className={`switch-view-item${selectedView === opt.value ? ' active' : ''}`}
+ onClick={() => setSelectedView(opt.value)}
+ >
+ {opt.label}
+ </div>
+ ))}
+ </div>
+ </Drawer>
+ </div>
+ </NavBarPage>
+ );
+};
+
+export default WorkStatistics;
diff --git a/src/views/workStatistics/index.less b/src/views/workStatistics/index.less
new file mode 100644
index 0000000..ddae054
--- /dev/null
+++ b/src/views/workStatistics/index.less
@@ -0,0 +1,885 @@
+/* 工作统计页面样式 */
+.work-statistics {
+ background-color: #f5f5f5;
+ min-height: 100vh;
+ padding-bottom: 12px;
+
+ /* 筛选条件展示区域样式 */
+ .filter-info-section {
+ margin: 0;
+ background: #fff;
+ padding: 12px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ position: relative;
+
+ .filter-info-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ position: relative;
+ padding-left: 10px;
+ flex-shrink: 0;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .filter-settings {
+ display: flex;
+ align-items: center;
+ color: #1A6FB8;
+ font-size: 15px;
+ flex-shrink: 0;
+ cursor: pointer;
+
+ .settings-icon {
+ width: 16px;
+ height: 16px;
+ margin-right: 4px;
+ }
+ }
+ }
+
+ /* 筛选条件内容样式 */
+ .filter-conditions {
+ background: #fff;
+ padding: 0 12px 12px;
+ display: flex;
+ flex-wrap: wrap;
+
+ .filter-info-item {
+ display: inline-flex;
+ align-items: center;
+ background-color: #f5f7fa;
+ border-radius: 4px;
+ padding: 4px 12px;
+ margin-right: 8px;
+ margin-bottom: 4px;
+
+ .filter-info-text {
+ font-size: 13px;
+ color: #555;
+ }
+
+ .filter-info-clear {
+ margin-left: 4px;
+ color: #999;
+ font-size: 12px;
+ }
+ }
+ }
+
+ /* 工作总览样式 */
+ .work-overview-section {
+ margin-top: 8px;
+ padding: 8px 12px 12px 12px;
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .work-overview-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ margin: 0px 0px 7px 0px;
+ position: relative;
+ padding-left: 10px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .work-overview-cards {
+ display: flex;
+ flex-direction: column;
+ gap: 6px;
+
+ .card-row {
+ display: flex;
+ gap: 6px;
+
+ .overview-card {
+ padding: 8px 0px;
+ color: rgba(23, 26, 29, 0.6);
+ text-align: center;
+
+ .card-day-data {
+ font-size: 13px;
+ margin-bottom: 5px;
+ }
+
+ .card-month-rates {
+ font-size: 12px;
+ margin-bottom: 8px;
+
+ .month-compare, .month-ratio {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .rate-icon {
+ width: 10px;
+ height: 10px;
+ margin-right: 2px;
+ }
+
+ .up {
+ color: #f5222d;
+ display: flex;
+ align-items: center;
+ }
+
+ .down {
+ color: #52c41a;
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+
+ .card-value {
+ font-size: 24px;
+ font-weight: bold;
+ margin-top: auto;
+ margin-bottom: 4px;
+ }
+
+ .card-name {
+ font-size: 14px;
+ }
+ }
+ }
+
+ /* 总登记卡片 - 蓝色 */
+ .total-card {
+ background-color: #e6f7ff;
+ flex: 1;
+ .card-day-data {
+ color: #1A6FB8;
+ }
+
+ .card-value {
+ color: #1677ff;
+ }
+ }
+
+ /* 化解中卡片 - 蓝色 */
+ .process-card {
+ background-color: #e6f7ff;
+ flex: 1;
+ .card-day-data {
+ color: #1A6FB8;
+ }
+
+ .card-value {
+ color: #1677ff;
+ }
+ }
+
+ /* 不予受理卡片 - 粉色 */
+ .reject-card {
+ background-color: #ffece8;
+ flex: 1;
+ .card-day-data {
+ color: #F53F3F;
+ }
+
+ .card-value {
+ color: #f5222d;
+ }
+ }
+
+ /* 已结案卡片 - 黄色 */
+ .finish-card {
+ background-color: #fffbe6;
+ display: flex;
+ flex: 2;
+
+ .card-left-content {
+ width: 82px;
+ text-align: center;
+
+ .card-day-data {
+ color: #EF6C24;
+ }
+
+ .card-value {
+ color: #faad14;
+ }
+ }
+
+ .card-right-content {
+ flex: 1;
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ .vertical-divider {
+ width: 1px;
+ height: 32px;
+ background: rgba(126,134,142,0.16);
+ margin: 0;
+ }
+
+ .resolve-success, .resolve-fail {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin: 4px 8px;
+
+ .resolve-value {
+ font-size: 16px;
+ font-weight: bold;
+ margin-bottom: 2px;
+ }
+
+ .resolve-label {
+ font-size: 12px;
+ }
+ }
+
+ .resolve-success .resolve-value {
+ color: #52c41a;
+ }
+
+ .resolve-fail .resolve-value {
+ color: #f5222d;
+ }
+ }
+ }
+
+ /* 化解成功率卡片 - 绿色 */
+ .resolve-rate-card {
+ // background-color: #f6ffed;
+ background-color: rgba(0, 186, 70, 0.1);
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ flex: 1;
+
+ .rate-value {
+ font-size: 22px;
+ font-weight: bold;
+ color: #52c41a;
+ margin-bottom: 4px;
+ }
+
+ .card-month-rates {
+ font-size: 12px;
+ margin-bottom: 4px;
+
+ .month-compare, .month-ratio {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ .rate-icon {
+ width: 10px;
+ height: 10px;
+ margin-right: 2px;
+ }
+
+ .up {
+ color: #f5222d;
+ display: flex;
+ align-items: center;
+ }
+
+ .down {
+ color: #52c41a;
+ display: flex;
+ align-items: center;
+ }
+ }
+ }
+
+ .rate-label {
+ font-size: 13px;
+ }
+ }
+ }
+ }
+
+ /* 化解统计区域样式 */
+ .work-statistics-section {
+ margin-top: 8px;
+ padding: 8px 12px 12px 12px;
+ background: #fff;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+
+ .work-statistics-section-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ position: relative;
+ padding-left: 10px;
+
+ &:before {
+ content: '';
+ position: absolute;
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+ width: 4px;
+ height: 14px;
+ background-color: #1A6FB8;
+ }
+ }
+
+ .work-statistics-tabs {
+ display: flex;
+ border-bottom: 1px solid #eee;
+ margin-bottom: 12px;
+
+ .tab-item {
+ padding: 8px 16px;
+ font-size: 14px;
+ color: #666;
+ position: relative;
+ cursor: pointer;
+
+ &.active {
+ color: #1677ff;
+ font-weight: 500;
+
+ &::after {
+ content: '';
+ position: absolute;
+ bottom: -1px;
+ left: 0;
+ width: 100%;
+ height: 2px;
+ background-color: #1677ff;
+ border-radius: 1px 1px 0 0;
+ }
+ }
+ }
+ }
+
+ .work-statistics-chart {
+ height: 240px;
+ margin-top: 12px;
+ }
+
+ .work-statistics-pie {
+ height: 280px;
+ margin-top: 12px;
+ }
+ }
+
+ /* 筛选抽屉样式 */
+ .filter-drawer {
+ .filter-content {
+ padding: 16px;
+
+ .filter-item {
+ margin-bottom: 16px;
+
+ .filter-label {
+ margin-bottom: 8px;
+ font-size: 14px;
+ color: #333;
+ }
+
+ .filter-date-picker {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 10px 12px;
+ border: 1px solid #ddd;
+ border-radius: 4px;
+ color: #666;
+ font-size: 14px;
+
+ .filter-arrow {
+ display: inline-block;
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: rotate(45deg);
+ }
+ }
+ }
+ }
+
+ .filter-actions {
+ display: flex;
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ padding: 12px 16px;
+ background: #fff;
+ box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.05);
+
+ .filter-reset-btn, .filter-apply-btn {
+ flex: 1;
+ margin: 0 8px;
+ }
+ }
+ }
+
+ /* 日期选择弹窗样式 */
+ .date-picker-modal {
+ width: 100vw;
+ min-width: 100vw;
+ max-width: 100vw;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ height: 400px;
+ max-height: 80vh;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 400px;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: 400px;
+ max-height: 80vh;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .calendar-container {
+ height: 100%;
+ }
+ }
+}
+
+.custom-filter-modal .dtm-modal-body {
+ padding: 0 15px 0px !important;
+}
+
+/* 筛选弹窗样式 */
+.custom-filter-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ top: 44px;
+ left: 0;
+ right: 0;
+ z-index: 999;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: unset;
+ }
+
+ .am-modal-header {
+ display: none;
+ }
+
+ .am-modal-body {
+ flex: 1;
+ overflow: hidden;
+ display: flex;
+ flex-direction: column;
+ }
+
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-start;
+ top: 44px;
+ overflow: visible;
+ height: calc(100% - 192px);
+ z-index: 999;
+ }
+
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+}
+
+/* 确保导航栏在弹窗之上 */
+:global {
+ .navbar-page {
+ .navbar {
+ z-index: 1003;
+ position: relative;
+ }
+ }
+}
+
+.navBarPage-navbar {
+ z-index: 1003 !important;
+}
+
+.custom-filter-content {
+ padding: 12px;
+ margin-top: 44px;
+ flex: 1;
+ overflow-y: auto;
+ -webkit-overflow-scrolling: touch;
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-between;
+ background: #FFFFFF;
+
+ .filter-item {
+ width: calc(50% - 8px);
+ margin-bottom: 16px;
+
+ .filter-label {
+ font-size: 15px;
+ color: #171A1D;
+ margin-bottom: 8px;
+ font-weight: normal;
+ text-align: left;
+ }
+
+ .filter-selector {
+ position: relative;
+ height: 40px;
+ display: flex;
+ align-items: center;
+ padding: 0 6px;
+ background: #F2F3F5;
+ border-radius: 4px;
+ color: #999;
+ font-size: 14px;
+
+ .filter-arrow {
+ position: absolute;
+ right: 12px;
+ top: 50%;
+ width: 8px;
+ height: 8px;
+ border-right: 1px solid #999;
+ border-bottom: 1px solid #999;
+ transform: translateY(-50%) rotate(45deg);
+ }
+ }
+
+ & .dtm-input, .dtm-select {
+ height: 40px;
+ border-radius: 4px !important;
+ background-color: #FFFFFF !important;
+ width: 100% !important;
+ border: none !important;
+ box-shadow: none !important;
+
+ input {
+ background-color: #FFFFFF !important;
+ font-size: 14px;
+
+ &::placeholder {
+ color: #999;
+ }
+ }
+ }
+ }
+ .filter-item.full-row {
+ width: 100%;
+ }
+}
+
+.custom-filter-buttons {
+ display: flex;
+ padding: 12px;
+ border-top: 1px solid #eee;
+ background: #FFFFFF;
+ position: sticky;
+ bottom: 0;
+
+ .filter-reset {
+ width: 120px;
+ height: 44px;
+ margin-right: 12px;
+ border: 1px solid #1A6FB8;
+ color: #1A6FB8;
+ background-color: #FFFFFF;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+
+ .filter-apply {
+ flex: 1;
+ height: 44px;
+ background-color: #1A6FB8;
+ color: #FFFFFF;
+ border-radius: 4px;
+ font-size: 16px;
+ }
+}
+
+.canal-radio-group {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 8px 12px;
+ margin-top: 8px;
+}
+.canal-radio {
+ flex: 0 0 calc(50% - 6px);
+ box-sizing: border-box;
+ height: 40px;
+ background: #f5f7fa;
+ border-radius: 6px;
+ border: 1px solid transparent;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 15px;
+ color: #333;
+ cursor: pointer;
+ position: relative;
+ transition: border-color 0.2s, background 0.2s;
+}
+.canal-radio.checked {
+ background: #f5f7fa;
+ border: 1px solid #1a6fb8;
+ color: #1a6fb8;
+}
+.canal-radio-dot {
+ display: inline-block;
+ width: 18px;
+ height: 18px;
+ border-radius: 50%;
+ border: 1.5px solid #1a6fb8;
+ background: #fff;
+ margin-left: 8px;
+ position: relative;
+}
+.canal-radio.checked .canal-radio-dot::after {
+ content: '';
+ display: block;
+ width: 10px;
+ height: 10px;
+ background: #1a6fb8;
+ border-radius: 50%;
+ position: absolute;
+ left: 3.5px;
+ top: 3.5px;
+}
+.filter-item-select {
+ color: #999;
+ text-align: left;
+ font-size: 14px;
+ padding-left: 6px;
+}
+
+/* 时间类型选择弹窗样式 */
+.date-type-modal {
+ width: 100%;
+ margin: 0;
+ border-radius: 0;
+ position: fixed;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+ top: auto;
+ height: auto;
+ max-height: 80vh;
+
+ :global {
+ .am-modal-content {
+ padding-top: 0 !important;
+ display: flex;
+ flex-direction: column;
+ border-radius: 0;
+ position: relative;
+ max-height: 80vh;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-header {
+ display: none;
+ }
+ .am-modal-body {
+ flex: 1 1 auto;
+ overflow: auto;
+ display: flex;
+ flex-direction: column;
+ }
+ .am-modal-wrap {
+ display: flex;
+ align-items: flex-end;
+ top: auto;
+ bottom: 0;
+ overflow: visible;
+ height: auto;
+ z-index: 999;
+ width: 100vw;
+ min-width: 100vw;
+ }
+ .am-modal-mask {
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 998;
+ }
+ }
+ .modal-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px;
+ border-bottom: 1px solid #f0f0f0;
+ background: #fff;
+ .modal-title {
+ font-size: 16px;
+ font-weight: 500;
+ color: #333;
+ }
+ .modal-close {
+ font-size: 16px;
+ color: #999;
+ cursor: pointer;
+ }
+ }
+ .date-type-modal-content {
+ background: #fff;
+ border-radius: 0;
+ padding: 8px 0;
+ min-height: 0;
+ box-shadow: none;
+ }
+ .date-type-modal-item {
+ font-size: 16px;
+ color: #222;
+ padding: 16px;
+ text-align: center;
+ border-bottom: 1px solid #f0f0f0;
+ cursor: pointer;
+ transition: background 0.2s;
+ &:last-child {
+ border-bottom: none;
+ }
+ &:active {
+ background: #f5f7fa;
+ }
+ }
+}
+
+.switch-view-drawer {
+ .switch-view-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 18px 16px 0 16px;
+ font-size: 18px;
+ font-weight: 500;
+ .switch-view-close {
+ font-size: 22px;
+ cursor: pointer;
+ color: #999;
+ }
+ .switch-view-title {
+ flex: 1;
+ text-align: center;
+ color: #222;
+ font-size: 17px;
+ font-weight: 500;
+ }
+ .switch-view-confirm {
+ color: #1a6fb8;
+ font-size: 16px;
+ cursor: pointer;
+ }
+ }
+ .switch-view-list {
+ margin-top: 18px;
+ .switch-view-item {
+ text-align: center;
+ font-size: 17px;
+ color: #222;
+ padding: 16px 0;
+ border-bottom: 1px solid #f2f3f5;
+ cursor: pointer;
+ &.active {
+ color: #1a6fb8;
+ background: #f5faff;
+ font-weight: 600;
+ }
+ &:last-child {
+ border-bottom: none;
+ }
+ }
+ }
+}
\ No newline at end of file
--
Gitblit v1.8.0