jiangxucong
/
dq-emgms
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
main
wangyunfei 2 months ago
parent d3d4a393c6
commit 687f3f602c
7 changed files with 143 additions and 61 deletions
Show Stats Download Patch File Download Diff File

9
src/assets/business_Emergency/bgDrill2.svg
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 564 KiB

6
src/assets/business_Emergency/dutylog1.svg
Unescape Escape View File

@ -0,0 +1,6 @@
<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.85 4.6875H9.15C7.71783 4.6875 6.34432 5.25643 5.33162 6.26912C4.31893 7.28182 3.75 8.65533 3.75 10.0875V39.7875C3.75 40.4966 3.88967 41.1988 4.16105 41.854C4.43243 42.5091 4.83019 43.1044 5.33162 43.6059C5.83306 44.1073 6.42835 44.5051 7.08351 44.7765C7.73867 45.0478 8.44086 45.1875 9.15 45.1875H38.85C40.2822 45.1875 41.6557 44.6186 42.6684 43.6059C43.6811 42.5932 44.25 41.2197 44.25 39.7875V10.0875C44.25 8.65533 43.6811 7.28182 42.6684 6.26912C41.6557 5.25643 40.2822 4.6875 38.85 4.6875Z" fill="#0065F3"/>
<path opacity="0.4" d="M50.1 15.9375H20.4C18.9678 15.9375 17.5943 16.5064 16.5816 17.5191C15.5689 18.5318 15 19.9053 15 21.3375V51.0375C15 52.4697 15.5689 53.8432 16.5816 54.8559C17.5943 55.8686 18.9678 56.4375 20.4 56.4375H50.1C51.5322 56.4375 52.9057 55.8686 53.9184 54.8559C54.9311 53.8432 55.5 52.4697 55.5 51.0375V21.3375C55.5 19.9053 54.9311 18.5318 53.9184 17.5191C52.9057 16.5064 51.5322 15.9375 50.1 15.9375Z" fill="#82B6FA"/>
<path opacity="0.4" d="M20.4 16.4062H50.1C51.4078 16.4062 52.6621 16.9258 53.5869 17.8506C54.5117 18.7754 55.0312 20.0297 55.0312 21.3375V51.0375C55.0312 52.3453 54.5117 53.5996 53.5869 54.5244C52.6621 55.4492 51.4078 55.9688 50.1 55.9688H20.4C19.0922 55.9688 17.8379 55.4492 16.9131 54.5244C15.9883 53.5996 15.4688 52.3453 15.4688 51.0375V21.3375C15.4688 20.0297 15.9883 18.7754 16.9131 17.8506C17.8379 16.9258 19.0922 16.4062 20.4 16.4062ZM55.9688 21.3375C55.9688 19.781 55.3504 18.2883 54.2498 17.1877C53.1492 16.0871 51.6565 15.4688 50.1 15.4688H20.4C18.8435 15.4688 17.3508 16.0871 16.2502 17.1877C15.1496 18.2883 14.5312 19.781 14.5312 21.3375V51.0375C14.5313 52.594 15.1496 54.0867 16.2502 55.1873C17.3508 56.2879 18.8435 56.9062 20.4 56.9062H50.1C51.6565 56.9062 53.1492 56.2879 54.2498 55.1873C55.3504 54.0867 55.9688 52.594 55.9688 51.0375V21.3375Z" fill="white"/>
<path d="M33.4556 48.5658C34.1381 48.9689 34.6744 48.6998 34.6744 47.8833V38.3892C34.6744 37.5727 34.1259 36.7561 33.4556 36.353L25.5937 31.4658C24.9112 31.1977 24.375 31.4658 24.375 32.1483V41.6442C24.375 42.4598 24.9234 43.2773 25.5937 43.6795L33.4556 48.5667V48.5658ZM26.8125 28.4798C26.13 28.883 26.13 29.4305 26.8125 29.8327L34.5525 34.7198C35.235 35.123 36.1856 35.123 36.8559 34.8539L44.595 30.9173C45.2775 30.5152 45.2775 29.9667 44.595 29.5645L36.4416 24.6773C35.8931 24.2742 34.8084 24.2742 34.1381 24.6773L26.8125 28.4798ZM36.8559 47.8833C36.8559 48.6998 37.4044 48.968 38.0747 48.5658L45.8137 44.6292C46.4963 44.227 47.0325 43.4105 47.0325 42.5939V33.0877C47.0325 32.2702 46.4841 32.002 45.8137 32.4042L38.0747 36.3417C37.3922 36.7439 36.8559 37.5605 36.8559 38.3761V47.8833Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

6
src/assets/business_Emergency/dutylog2.svg
Unescape Escape View File

@ -0,0 +1,6 @@
<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.85 4.6875H9.15C7.71783 4.6875 6.34432 5.25643 5.33162 6.26912C4.31893 7.28182 3.75 8.65533 3.75 10.0875V39.7875C3.75 40.4966 3.88967 41.1988 4.16105 41.854C4.43243 42.5091 4.83019 43.1044 5.33162 43.6059C5.83306 44.1073 6.42835 44.5051 7.08351 44.7765C7.73867 45.0478 8.44086 45.1875 9.15 45.1875H38.85C40.2822 45.1875 41.6557 44.6186 42.6684 43.6059C43.6811 42.5932 44.25 41.2197 44.25 39.7875V10.0875C44.25 8.65533 43.6811 7.28182 42.6684 6.26912C41.6557 5.25643 40.2822 4.6875 38.85 4.6875Z" fill="#0065F3"/>
<path opacity="0.4" d="M50.2328 15.9375H20.5328C19.1006 15.9375 17.7271 16.5064 16.7144 17.5191C15.7017 18.5318 15.1328 19.9053 15.1328 21.3375V51.0375C15.1328 52.4697 15.7017 53.8432 16.7144 54.8559C17.7271 55.8686 19.1006 56.4375 20.5328 56.4375H50.2328C51.665 56.4375 53.0385 55.8686 54.0512 54.8559C55.0639 53.8432 55.6328 52.4697 55.6328 51.0375V21.3375C55.6328 19.9053 55.0639 18.5318 54.0512 17.5191C53.0385 16.5064 51.665 15.9375 50.2328 15.9375Z" fill="#82B6FA"/>
<path d="M49.1649 44.6469L37.6046 24.6288C37.407 24.2895 37.124 24.008 36.7838 23.8123C36.4437 23.6166 36.0582 23.5137 35.6659 23.5137C35.2736 23.5137 34.8881 23.6166 34.548 23.8123C34.2078 24.008 33.9248 24.2895 33.7272 24.6288L22.1825 44.6469C21.9886 44.977 21.8878 45.3536 21.8907 45.7366C21.8936 46.1196 22.0003 46.4946 22.1992 46.8218C22.3982 47.1489 22.682 47.4159 23.0205 47.5943C23.359 47.7726 23.7395 47.8558 24.1215 47.8348H47.2273C47.6093 47.8558 47.9898 47.7726 48.3283 47.5943C48.6668 47.4159 48.9506 47.1489 49.1496 46.8218C49.3486 46.4946 49.4552 46.1196 49.4581 45.7366C49.4611 45.3536 49.3602 44.977 49.1663 44.6469H49.1649ZM35.7535 44.982C35.3055 44.9815 34.876 44.8028 34.5595 44.4853C34.2431 44.1678 34.0655 43.7374 34.066 43.2888C34.0665 42.8402 34.245 42.4102 34.5621 42.0934C34.8793 41.7765 35.3091 41.5988 35.7572 41.5993C35.979 41.5996 36.1986 41.6435 36.4035 41.7288C36.6084 41.814 36.7945 41.9388 36.9511 42.096C37.1078 42.2532 37.2321 42.4398 37.3167 42.6451C37.4014 42.8504 37.4449 43.0704 37.4446 43.2925C37.4444 43.5146 37.4005 43.7345 37.3153 43.9396C37.2302 44.1447 37.1056 44.331 36.9485 44.4879C36.7915 44.6448 36.6051 44.7692 36.4001 44.854C36.1951 44.9387 35.9753 44.9822 35.7535 44.982ZM37.4695 38.3483C37.469 38.797 37.2906 39.2272 36.9735 39.5444C36.6564 39.8615 36.2265 40.0396 35.7783 40.0396C35.5597 40.0383 35.3435 39.9932 35.1425 39.907C34.9415 39.8208 34.7598 39.6952 34.608 39.5376C34.4563 39.3799 34.3376 39.1935 34.2588 38.9893C34.1801 38.785 34.143 38.5671 34.1497 38.3483V31.2478C34.143 31.0289 34.1801 30.811 34.2588 30.6068C34.3376 30.4025 34.4563 30.2161 34.608 30.0585C34.7598 29.9009 34.9415 29.7753 35.1425 29.6891C35.3435 29.6028 35.5597 29.5577 35.7783 29.5564C36.2265 29.5564 36.6564 29.7346 36.9735 30.0517C37.2906 30.3688 37.469 30.799 37.4695 31.2478V38.3483Z" fill="white"/>
<path opacity="0.4" d="M20.4 16.4062H50.1C51.4078 16.4062 52.6621 16.9258 53.5869 17.8506C54.5117 18.7754 55.0312 20.0297 55.0312 21.3375V51.0375C55.0312 52.3453 54.5117 53.5996 53.5869 54.5244C52.6621 55.4492 51.4078 55.9688 50.1 55.9688H20.4C19.0922 55.9688 17.8379 55.4492 16.9131 54.5244C15.9883 53.5996 15.4688 52.3453 15.4688 51.0375V21.3375C15.4688 20.0297 15.9883 18.7754 16.9131 17.8506C17.8379 16.9258 19.0922 16.4062 20.4 16.4062ZM55.9688 21.3375C55.9688 19.781 55.3504 18.2883 54.2498 17.1877C53.1492 16.0871 51.6565 15.4688 50.1 15.4688H20.4C18.8435 15.4688 17.3508 16.0871 16.2502 17.1877C15.1496 18.2883 14.5312 19.781 14.5312 21.3375V51.0375C14.5313 52.594 15.1496 54.0867 16.2502 55.1873C17.3508 56.2879 18.8435 56.9062 20.4 56.9062H50.1C51.6565 56.9062 53.1492 56.2879 54.2498 55.1873C55.3504 54.0867 55.9688 52.594 55.9688 51.0375V21.3375Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

6
src/assets/business_Emergency/dutylog3.svg
Unescape Escape View File

@ -0,0 +1,6 @@
<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.85 4.6875H9.15C7.71783 4.6875 6.34432 5.25643 5.33162 6.26912C4.31893 7.28182 3.75 8.65533 3.75 10.0875V39.7875C3.75 40.4966 3.88967 41.1988 4.16105 41.854C4.43243 42.5091 4.83019 43.1044 5.33162 43.6059C5.83306 44.1073 6.42835 44.5051 7.08351 44.7765C7.73867 45.0478 8.44086 45.1875 9.15 45.1875H38.85C40.2822 45.1875 41.6557 44.6186 42.6684 43.6059C43.6811 42.5932 44.25 41.2197 44.25 39.7875V10.0875C44.25 8.65533 43.6811 7.28182 42.6684 6.26912C41.6557 5.25643 40.2822 4.6875 38.85 4.6875Z" fill="#0065F3"/>
<path opacity="0.4" d="M50.1 15.9375H20.4C18.9678 15.9375 17.5943 16.5064 16.5816 17.5191C15.5689 18.5318 15 19.9053 15 21.3375V51.0375C15 52.4697 15.5689 53.8432 16.5816 54.8559C17.5943 55.8686 18.9678 56.4375 20.4 56.4375H50.1C51.5322 56.4375 52.9057 55.8686 53.9184 54.8559C54.9311 53.8432 55.5 52.4697 55.5 51.0375V21.3375C55.5 19.9053 54.9311 18.5318 53.9184 17.5191C52.9057 16.5064 51.5322 15.9375 50.1 15.9375Z" fill="#82B6FA"/>
<path d="M35.5 24C42.4037 24 48 29.5962 48 36.5C48 43.4037 42.4037 49 35.5 49C28.5962 49 23 43.4037 23 36.5C23 29.5962 28.5962 24 35.5 24ZM41.9275 31.02C41.6739 30.8065 41.3458 30.7025 41.0156 30.7309C40.6853 30.7592 40.3798 30.9176 40.1662 31.1712L33.0825 39.5875L30.8112 37.02L30.7 36.9075C30.4618 36.6925 30.1501 36.5772 29.8293 36.5857C29.5086 36.5942 29.2033 36.7257 28.9769 36.9529C28.7504 37.1802 28.6199 37.4859 28.6126 37.8067C28.6053 38.1275 28.7216 38.4389 28.9375 38.6762L32.17 42.33L32.2762 42.4363C32.401 42.5473 32.5468 42.6323 32.705 42.6861C32.8632 42.7398 33.0305 42.7614 33.1972 42.7494C33.3638 42.7374 33.5264 42.6921 33.6752 42.6162C33.8241 42.5403 33.9562 42.4353 34.0637 42.3075L42.08 32.7812L42.1725 32.655C42.3377 32.3994 42.404 32.0922 42.3589 31.7912C42.3138 31.4902 42.1604 31.216 41.9275 31.02Z" fill="white"/>
<path opacity="0.4" d="M20.4 16.4062H50.1C51.4078 16.4062 52.6621 16.9258 53.5869 17.8506C54.5117 18.7754 55.0312 20.0297 55.0312 21.3375V51.0375C55.0312 52.3453 54.5117 53.5996 53.5869 54.5244C52.6621 55.4492 51.4078 55.9688 50.1 55.9688H20.4C19.0922 55.9688 17.8379 55.4492 16.9131 54.5244C15.9883 53.5996 15.4688 52.3453 15.4688 51.0375V21.3375C15.4688 20.0297 15.9883 18.7754 16.9131 17.8506C17.8379 16.9258 19.0922 16.4062 20.4 16.4062ZM55.9688 21.3375C55.9688 19.781 55.3504 18.2883 54.2498 17.1877C53.1492 16.0871 51.6565 15.4688 50.1 15.4688H20.4C18.8435 15.4688 17.3508 16.0871 16.2502 17.1877C15.1496 18.2883 14.5312 19.781 14.5312 21.3375V51.0375C14.5313 52.594 15.1496 54.0867 16.2502 55.1873C17.3508 56.2879 18.8435 56.9062 20.4 56.9062H50.1C51.6565 56.9062 53.1492 56.2879 54.2498 55.1873C55.3504 54.0867 55.9688 52.594 55.9688 51.0375V21.3375Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

18
src/assets/business_Emergency/dutylog4.svg
Unescape Escape View File

@ -0,0 +1,18 @@
<svg width="60" height="60" viewBox="0 0 60 60" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M38.85 4.6875H9.15C7.71783 4.6875 6.34432 5.25643 5.33162 6.26912C4.31893 7.28182 3.75 8.65533 3.75 10.0875V39.7875C3.75 40.4966 3.88967 41.1988 4.16105 41.854C4.43243 42.5091 4.83019 43.1044 5.33162 43.6059C5.83306 44.1073 6.42835 44.5051 7.08351 44.7765C7.73867 45.0478 8.44086 45.1875 9.15 45.1875H38.85C40.2822 45.1875 41.6557 44.6186 42.6684 43.6059C43.6811 42.5932 44.25 41.2197 44.25 39.7875V10.0875C44.25 8.65533 43.6811 7.28182 42.6684 6.26912C41.6557 5.25643 40.2822 4.6875 38.85 4.6875Z" fill="#0065F3"/>
<path opacity="0.4" d="M50.1 15.9375H20.4C18.9678 15.9375 17.5943 16.5064 16.5816 17.5191C15.5689 18.5318 15 19.9053 15 21.3375V51.0375C15 52.4697 15.5689 53.8432 16.5816 54.8559C17.5943 55.8686 18.9678 56.4375 20.4 56.4375H50.1C51.5322 56.4375 52.9057 55.8686 53.9184 54.8559C54.9311 53.8432 55.5 52.4697 55.5 51.0375V21.3375C55.5 19.9053 54.9311 18.5318 53.9184 17.5191C52.9057 16.5064 51.5322 15.9375 50.1 15.9375Z" fill="#82B6FA"/>
<g clip-path="url(#clip0_2365_25431)">
<g clip-path="url(#clip1_2365_25431)">
<path d="M35.5 23.8438C28.5104 23.8438 22.8438 29.5104 22.8438 36.5C22.8438 43.4896 28.5104 49.1562 35.5 49.1562C42.4896 49.1562 48.1562 43.4896 48.1562 36.5C48.1562 29.5104 42.4896 23.8438 35.5 23.8438ZM41.251 38.8018H34.35C33.7146 38.8018 33.1999 38.2871 33.1999 37.6517V29.5973C33.1999 29.2923 33.3211 28.9998 33.5368 28.7841C33.7524 28.5684 34.045 28.4472 34.35 28.4472C34.655 28.4472 34.9475 28.5684 35.1632 28.7841C35.3788 28.9998 35.5 29.2923 35.5 29.5973V36.5H41.2535C41.5588 36.5002 41.8514 36.6217 42.0671 36.8377C42.2827 37.0537 42.4038 37.3465 42.4036 37.6517C42.4033 37.9569 42.2819 38.2496 42.0659 38.4653C41.8499 38.6809 41.5571 38.802 41.2518 38.8018H41.251Z" fill="white"/>
</g>
</g>
<path opacity="0.4" d="M20.4 16.4062H50.1C51.4078 16.4062 52.6621 16.9258 53.5869 17.8506C54.5117 18.7754 55.0312 20.0297 55.0312 21.3375V51.0375C55.0312 52.3453 54.5117 53.5996 53.5869 54.5244C52.6621 55.4492 51.4078 55.9688 50.1 55.9688H20.4C19.0922 55.9688 17.8379 55.4492 16.9131 54.5244C15.9883 53.5996 15.4688 52.3453 15.4688 51.0375V21.3375C15.4688 20.0297 15.9883 18.7754 16.9131 17.8506C17.8379 16.9258 19.0922 16.4062 20.4 16.4062ZM55.9688 21.3375C55.9688 19.781 55.3504 18.2883 54.2498 17.1877C53.1492 16.0871 51.6565 15.4688 50.1 15.4688H20.4C18.8435 15.4688 17.3508 16.0871 16.2502 17.1877C15.1496 18.2883 14.5312 19.781 14.5312 21.3375V51.0375C14.5313 52.594 15.1496 54.0867 16.2502 55.1873C17.3508 56.2879 18.8435 56.9062 20.4 56.9062H50.1C51.6565 56.9062 53.1492 56.2879 54.2498 55.1873C55.3504 54.0867 55.9688 52.594 55.9688 51.0375V21.3375Z" fill="white"/>
<defs>
<clipPath id="clip0_2365_25431">
<rect width="27" height="27" fill="white" transform="translate(22 23)"/>
</clipPath>
<clipPath id="clip1_2365_25431">
<rect width="27" height="27" fill="white" transform="translate(22 23)"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

125
src/pages/business_emergencyDuty/components/DutyLog.js
Unescape Escape View File

@ -1,6 +1,7 @@
import React, { useState } from 'react'; import React, { useState, useEffect } from 'react';
import { Input, Button, Select, message, Modal, Tag } from 'antd'; import { Input, Button, Select, message, Modal, Tag } from 'antd';
import { SearchOutlined, PlusOutlined } from '@ant-design/icons'; import { SearchOutlined, PlusOutlined } from '@ant-design/icons';
import ReactECharts from 'echarts-for-react';
import StandardTable from '@/components/StandardTable'; import StandardTable from '@/components/StandardTable';
import styles from './DutyLog.less'; import styles from './DutyLog.less';
@ -90,16 +91,73 @@ const DutyLog = () => {
}, },
]; ];
// 事件类型分布数据 const [chartReady, setChartReady] = useState(false);
// 确保DOM准备好后再渲染图表
useEffect(() => {
const timer = setTimeout(() => {
setChartReady(true);
}, 100);
return () => clearTimeout(timer);
}, []);
// 事件类型分布数据（根据图片描述调整颜色）
const eventTypeData = [ const eventTypeData = [
{ name: '交通事故', value: 10, color: '#52C41A' }, { name: '交通事故', value: 10, color: '#4A90E2' }, // 浅蓝色
{ name: '自然灾害', value: 15, color: '#FAAD14' }, { name: '自然灾害', value: 15, color: '#52C41A' }, // 绿色
{ name: '社会安全', value: 8, color: '#FF7A45' }, { name: '社会安全', value: 8, color: '#FAAD14' }, // 黄色
{ name: '电力故障', value: 5, color: '#F5222D' }, { name: '电力故障', value: 5, color: '#FF7A45' }, // 橙色
{ name: '火灾隐患', value: 3, color: '#CF1322' }, { name: '火灾隐患', value: 3, color: '#F5222D' }, // 红色
{ name: '设施故障', value: 7, color: '#1890FF' }, { name: '设施故障', value: 7, color: '#1890FF' }, // 深蓝色
]; ];
// ECharts 玫瑰图配置（空心饼图）
const roseChartOption = {
tooltip: {
trigger: 'item',
formatter: '{b}: {c} ({d}%)'
},
legend: {
show: false
},
series: [
{
type: 'pie',
radius: ['40%', '70%'], // 空心饼图：内半径40%，外半径70%
center: ['50%', '50%'],
roseType: 'area', // 玫瑰图类型：使用面积表示数值
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 4,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false
},
labelLine: {
show: false
},
emphasis: {
label: {
show: true,
fontSize: 14,
fontWeight: 'bold'
},
scale: true,
scaleSize: 5
},
data: eventTypeData.map(item => ({
value: item.value,
name: item.name,
itemStyle: {
color: item.color
}
}))
}
]
};
// 表格列配置 // 表格列配置
const columns = [ const columns = [
{ {
@ -226,45 +284,17 @@ const DutyLog = () => {
); );
}; };
// 渲染饼图（简化版） // 渲染玫瑰图（使用 ECharts）
const renderPieChart = () => { const renderRoseChart = () => {
const total = eventTypeData.reduce((sum, item) => sum + item.value, 0);
let currentAngle = 0;
return ( return (
<div className={styles.pieChartContainer}> <div className={styles.pieChartContainer}>
<svg viewBox="0 0 200 200" className={styles.pieSvg}> {chartReady && (
{eventTypeData.map((item, index) => { <ReactECharts
const percentage = (item.value / total) * 100; option={roseChartOption}
const angle = (percentage / 100) * 360; style={{ height: '100%', width: '100%' }}
const largeArc = percentage > 50 ? 1 : 0; opts={{ renderer: 'canvas' }}
/>
const x1 = 100 + 60 * Math.cos((currentAngle * Math.PI) / 180); )}
const y1 = 100 + 60 * Math.sin((currentAngle * Math.PI) / 180);
const x2 = 100 + 60 * Math.cos(((currentAngle + angle) * Math.PI) / 180);
const y2 = 100 + 60 * Math.sin(((currentAngle + angle) * Math.PI) / 180);
const path = [
`M 100 100`,
`L ${x1} ${y1}`,
`A 60 60 0 ${largeArc} 1 ${x2} ${y2}`,
`Z`,
].join(' ');
currentAngle += angle;
return (
<path
key={index}
d={path}
fill={item.color}
stroke="#fff"
strokeWidth="2"
/>
);
})}
<circle cx="100" cy="100" r="30" fill="#fff" />
</svg>
<div className={styles.pieLegend}> <div className={styles.pieLegend}>
{eventTypeData.map((item, index) => ( {eventTypeData.map((item, index) => (
<div key={index} className={styles.legendItem}> <div key={index} className={styles.legendItem}>
@ -281,9 +311,10 @@ const DutyLog = () => {
}; };
return ( return (
<div className={styles.container}> <div className={styles.containerDutyLog}>
{/* A块：顶部统计卡片 */} {/* A块：顶部统计卡片 */}
<div className={styles.blockA}> <div className={styles.blockA}>
<div className={styles.statCard}> <div className={styles.statCard}>
<div className={styles.statIcon}> <div className={styles.statIcon}>
<div className={styles.cubeIcon}></div> <div className={styles.cubeIcon}></div>
@ -330,7 +361,7 @@ const DutyLog = () => {
<div className={styles.leftTop}> <div className={styles.leftTop}>
<div className={styles.sectionTitle}>事件类型分布</div> <div className={styles.sectionTitle}>事件类型分布</div>
<div className={styles.chartWrapper}> <div className={styles.chartWrapper}>
{renderPieChart()} {renderRoseChart()}
</div> </div>
</div> </div>
{/* 下部分：最近值班日志 */} {/* 下部分：最近值班日志 */}

34
src/pages/business_emergencyDuty/components/DutyLog.less
Unescape Escape View File

@ -1,6 +1,6 @@
.container { .containerDutyLog {
padding: 20px; padding: 15px 0px 15px 5px;
background: #F5F5F5; background: transparent;
height: 100vh; height: 100vh;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -9,20 +9,23 @@
// A块：顶部统计卡片区域 // A块：顶部统计卡片区域
.blockA { .blockA {
width: 100%; width: 100%;
height: 20%; height: 18%;
display: flex; display: flex;
gap: 16px; gap: 16px;
margin-bottom: 16px; margin-bottom: 16px;
background: linear-gradient(135deg, #E6F4FF 0%, #BAE0FF 100%); background: url('@/assets/business_Emergency/bgDrill2.svg') no-repeat center center;
background-size: 100% 100%;
border-radius: 2px; border-radius: 2px;
padding: 16px; padding: 16px;
.statCard { .statCard {
flex: 1; flex: 1;
height: 100%; height: 100%;
background: #FFFFFF; background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(208, 225, 255, 0.6) 100%);
border-radius: 2px; border-radius: 2px;
padding: 20px; border: 2px solid #FFFFFF;
// padding: 20px;
margin: 0px 20px 0px 5px ;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 16px; gap: 16px;
@ -165,10 +168,13 @@
align-items: center; align-items: center;
gap: 24px; gap: 24px;
width: 100%; width: 100%;
height: 200px;
position: relative;
.pieSvg { // ECharts 图表容器
width: 160px; >div:first-child {
height: 160px; width: 200px;
height: 200px;
flex-shrink: 0; flex-shrink: 0;
} }
@ -366,7 +372,7 @@
} }
} }
.ant-table-thead > tr > th { .ant-table-thead>tr>th {
background: #F5F5FA; background: #F5F5FA;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
@ -375,13 +381,13 @@
border-radius: 0; border-radius: 0;
} }
.ant-table-tbody > tr > td { .ant-table-tbody>tr>td {
color: #666666; color: #666666;
font-size: 13px; font-size: 13px;
text-align: center; text-align: center;
} }
.ant-table-tbody > tr:hover > td { .ant-table-tbody>tr:hover>td {
background: #F5F5F5; background: #F5F5F5;
} }
@ -409,4 +415,4 @@
} }
} }
} }
} }
Write Preview
Loading…
Cancel
Save