From b8fa9e826bd2e2a19d8b02e6ffa6ad71f9aaeced Mon Sep 17 00:00:00 2001 From: wangyunfei <1224056307@qq,com> Date: Mon, 29 Sep 2025 18:23:05 +0800 Subject: [PATCH] =?UTF-8?q?=E8=AE=BE=E5=A4=87=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/business_basic/eqicon1.png | Bin 0 -> 1710 bytes src/assets/business_basic/eqicon2.png | Bin 0 -> 1461 bytes src/assets/business_basic/eqicon3.png | Bin 0 -> 2019 bytes src/assets/business_basic/eqicon4.png | Bin 0 -> 1572 bytes src/assets/business_basic/export1.png | Bin 0 -> 485 bytes src/assets/business_basic/import1.png | Bin 0 -> 422 bytes src/pages/business_basic/basic.js | 8 +- .../business_basic/module/EvaluationReport.js | 14 - .../module/EvaluationReport.less | 2 +- .../module/ResponsibilityImplementation.js | 439 +++++++++++++++--- .../module/ResponsibilityImplementation.less | 405 +++++++++++++++- .../business_basic/module/RiskAssessment.js | 59 +-- .../business_basic/module/RiskAssessment.less | 8 +- 13 files changed, 778 insertions(+), 157 deletions(-) create mode 100644 src/assets/business_basic/eqicon1.png create mode 100644 src/assets/business_basic/eqicon2.png create mode 100644 src/assets/business_basic/eqicon3.png create mode 100644 src/assets/business_basic/eqicon4.png create mode 100644 src/assets/business_basic/export1.png create mode 100644 src/assets/business_basic/import1.png diff --git a/src/assets/business_basic/eqicon1.png b/src/assets/business_basic/eqicon1.png new file mode 100644 index 0000000000000000000000000000000000000000..03c5873da0635b7c8c1347f0eb7cfc50ed3ce062 GIT binary patch literal 1710 zcmV;f22uHmP)@9YfV;NalkV0(z}nX8A&kW7}rY7o*3QEbDuJ9=RvV~eVbl)>#<16iq~GYep8 z$Tljho(gM&38WWQ7pa6G{AhhaBOvlxYz}RN!Dx$Okt7Je*-ny*f(OwMJO~5fH2>;y zt+%Zt1|eHvFry=iMUzW71G{5zRE>@(p0C8XKwbg^87)e&amo#c@Y7)+92|7vh|-B8 zN+*seoj9U&;)v3T026T2SFM=Lp?ngDu%Cd_zeiyhrD1;d^Y2S*(~W!Gh-++tykt@NL~db!LOJDkVFwk~ zpKh|DqKXR$o?Ga``CbJ-wdTOiFhp63clMI#SaUji5&iwVgvwIfSy_TLilS_yvU;@U z8n#9Syg4dMRUw)Fxa%;^oOw^1*4nZ%mog@_|>r4bC^l+}$ zxM8B^P36$mV^2vc?GYp+Lnzl8GfY%*h(mM;wx+ue(YR!yD3)@BmH=XI*YAvpCnSlU zgGX!3DL8fFh|-B8N++hYFh;Xr8iyAbxiBR}&=&{lcP7xk&?w8k9-(QMHeeRwa^wsu!7cA zE35cQdTiL0IhHCoS!8|pvNsh?TWEwa*zrypX~PTAn+P(b)EJ2+TNoBawKOF+>`Ty3 z#cPZG>t846cZJskT?45oULG;IHGi-arv~=0*6tI7PaLL zCd$-1l^ALrWEZqkPm$|kGOZWKgQ$kkMkvZBFcGz<%Lao9bRa|0FXj#Tb)bzrOhRpX zSx;wX8cGTV8;{8!Aw$Nl%o~F5V0C00lH8*p+~Rb%e+X1}flry4=R%U6@-1yuetI~W z>gV2k*oC>yr9GV}qx$YCT&%=Hgaf|~zZl33fb{%MlC_+fWBOns= z5)W*Q-z|H+0@}643`@Oy4~~=-a)wT&yS`ja1T!baPGlI)lmz4#aW)fGAfD#yP*D$d;?u z2;q`$L5>s#xDy^8htu7s_y2sD43h?nk}l0092_jezYD2kK9{#KeE=szIu%$o?6ilF1Ym1ULX(B2et8EYHEyDX=AY9pCbQDyTI~)cXsAEZ|SBKW|s;3W|(Q_laLAXUP$J{@AsQG z?+@VP|h7gJoHW0;y}P&GKtqN)eK`jh5*J~>j5y0@;BJUkv}e^(Zx#}KxVwKD`# zxs#ynNFXifhrw;Ivj$by5@WL@o~zH;EaLs+Y^<@G)Eus&CmCa>4Oua>zQSr$Q3!ba zfRvUra9xL&=o`_7FOTZVNE|O2vJ|sE!bH_YDZ)F5=Oks|vPNQh)v~HSXx1)F)O~v> zCgTiVW^w_uGfRPkW^KYml^ex7z6?(@HIH~wN4;5_kYXMV5lDt|b$jb~-XxNmfw>cZ zz-bX*ltp||7V$+{#FlTp&3L6bfVQI&!a-X<0*`47hyT5)eS7v-{R`xY;}OLrz1l3> zEh&veP*7hcwYD9RTahP@i{g>wG<8w(81lq%QBFkCdU#|ZPyAwT5nq%=?mAJQ{gT4D zD=CO(TZRXA(RnUuNLu~iY}qe%_~H79nlPqrUg$~S{qt(herqLFMu_m2hN~lrOM2~- zMEW{7wK^eq@`=EPe(NQD_+k*EacxAcm6Um_AAd7geiMu%~KKEVt@YFf~x;nj4sTN1}r5tU66r=gtOQJL-)VGrdUBXF+I7w&NeN@ysO!tfnBqPl&+M^kV;{ zm=rV?4wixe603-iJ}H2~i`VSgDYE(S;Dhvu%C1{Krc5&yo?Ou1C@#?Ab1PWE7OCAO zMUe+XH|^U_tp#PY) ziL6n79NI%y_UC$5K1tt8P?VMf)+h_A{NpmIH(#*%l$2I&98OPH-umF0O P00000NkvXXu0mjfD>1SP literal 0 HcmV?d00001 diff --git a/src/assets/business_basic/eqicon3.png b/src/assets/business_basic/eqicon3.png new file mode 100644 index 0000000000000000000000000000000000000000..a00929feeaaea073225c48907beca4ceb50d8c83 GIT binary patch literal 2019 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 Wn2M!SiZkf|000063r literal 0 HcmV?d00001 diff --git a/src/assets/business_basic/export1.png b/src/assets/business_basic/export1.png new file mode 100644 index 0000000000000000000000000000000000000000..b2beef14b0bfd2204a887cfc571a7c6dadefcefb GIT binary patch literal 485 zcmV}D2Y1PBcH z9oFlW{LSpV86zC2)L6Sj`Ux^5r3`<6yzu-S&GPcPEEep-9JDUNZAE&kdcmwRK0Xv? zvB|C)hz8ZsfKe8O00(H%kh2drQ^!96A(>1Ng74EPm*lpWH6`u2Aeb|(mcj@glt1<& zl5qz#M0=Q<3$%lAv1uFEc>5$sw{wG17(XJ=NlkNs%Jo%}#b5lqnmF&dK&8ggW!FaK z=6dKayo1By`UlsWQv)mzq02A`CQdICWE|m^$n5eRtiJgQW~K2}5L@g?A&M6PKz#&u zOT(vuWM;H?B|JYjH4cn(wQ8F=%>^<_M~SaEDhSav`{ZiK zO~qDJn(H@(+P?>e+r&|=Fg$?Bia%6r_c_FXl0VCBS!ntov{bxEvOAK~3aW6Yl#-FD bSNi@BCI6VNLmABe00000NkvXXu0mjf6!OdQ literal 0 HcmV?d00001 diff --git a/src/assets/business_basic/import1.png b/src/assets/business_basic/import1.png new file mode 100644 index 0000000000000000000000000000000000000000..21358ae77ab9422f5b064b1246adac86d7b93109 GIT binary patch literal 422 zcmV;X0a^ZuP)YY4;CiYX*iV_U~Rp|H|_zU3p zIXQk7!V!{nyY-tu#tJ%Uy&8r@@WjUmo!flY2^M9qS5pF70z%Lk79qeVn|>=i7$tp^ zUv0Mws`XtXEJ-;#wZC0Mfb`ufvNva`nm|bke^DBHWzz=Mf5&i=Pj{dQ11?Qq0=YBd z1GuNFSfgEVRt8*_1tNW!V9;1tru(=z$yoR74^%i(Kb6;XbmN^RfU2u8kbY?br4kl2 zNCL2#ndYRs_Dxa};W=~=C+nI`AGz7*oYi~it_PIAlm`_*xnp;(DU~Mq1)}JFy2N2n Q { onClick={() => handleModuleClick("organization")} >组织机构管理 - + */}
diff --git a/src/pages/business_basic/module/EvaluationReport.js b/src/pages/business_basic/module/EvaluationReport.js index e98bee6..6c1f076 100644 --- a/src/pages/business_basic/module/EvaluationReport.js +++ b/src/pages/business_basic/module/EvaluationReport.js @@ -544,20 +544,6 @@ const EvaluationReport = () => {
- {/* 块4 */} -
-
-
未处理预警
-
65
-
- ↑ - 较昨日 +2 -
-
-
- 未处理预警 -
-
diff --git a/src/pages/business_basic/module/EvaluationReport.less b/src/pages/business_basic/module/EvaluationReport.less index 9ac7a4d..5c71c1e 100644 --- a/src/pages/business_basic/module/EvaluationReport.less +++ b/src/pages/business_basic/module/EvaluationReport.less @@ -27,7 +27,7 @@ flex: 1; height: 100%; display: flex; - background: linear-gradient(170.5deg, #EBEFF4 6.87%, #FFFFFF 92.55%); + background: linear-gradient(170.5deg, #F5F7FF 6.87%, #FFFFFF 47.65%); border-radius: 4px; border: 2px solid #FFFFFF; diff --git a/src/pages/business_basic/module/ResponsibilityImplementation.js b/src/pages/business_basic/module/ResponsibilityImplementation.js index f9235eb..d78336f 100644 --- a/src/pages/business_basic/module/ResponsibilityImplementation.js +++ b/src/pages/business_basic/module/ResponsibilityImplementation.js @@ -1,17 +1,21 @@ import React from 'react'; import { Card, Statistic, Table,Row, Input,Button,Col, Select} from 'antd'; -import { PhoneOutlined, IdcardOutlined } from '@ant-design/icons'; +import { PhoneOutlined, IdcardOutlined, PlusOutlined } from '@ant-design/icons'; import StandardTable from '@/components/StandardTable'; import styles from './ResponsibilityImplementation.less'; import upload from '@/assets/business_basic/upload.png'; import download from '@/assets/business_basic/download.png'; +import import1 from '@/assets/business_basic/import1.png'; import fire_fighting1 from '@/assets/business_basic/fire_fighting1.png'; import fire_fighting2 from '@/assets/business_basic/fire_fighting2.png'; import fire_fighting3 from '@/assets/business_basic/fire_fighting3.png'; import frameIcon from '@/assets/business_basic/Frame.png'; import background1 from '@/assets/business_basic/background1.png'; +import export1 from '@/assets/business_basic/export1.png'; + + const ResponsibilityImplementation = () => { @@ -26,99 +30,271 @@ const ResponsibilityImplementation = () => { title:"编号", dataIndex:"id", key:"id", - width:60, + width:80, }, { - title:"责任区域", - dataIndex:"zrqy", - key:"zrqy", + title:"组织代码", + dataIndex:"orgCode", + key:"orgCode", width:120, }, { - title:"设备型号", - dataIndex:"sbxh", - key:"sbxh", + title:"组织类型", + dataIndex:"orgType", + key:"orgType", width:120, }, { - title:"危险源类型", - dataIndex:"wxlylx", - key:"wxlylx", - width:120, + title:"负责人", + dataIndex:"manager", + key:"manager", + width:100, }, { - title:"责任人", - dataIndex:"zrr", - key:"zrr", + title:"所属部门", + dataIndex:"department", + key:"department", width:120, }, { - title:"联系方式", - dataIndex:"lxfs", - key:"lxfs", + title:"创建时间", + dataIndex:"createTime", + key:"createTime", width:120, }, { - title:"巡检频率", - dataIndex:"xjpl", - key:"xjpl", - width:120, - }, - { - title:"最近巡检", - dataIndex:"zjxj", - key:"zjxj", - width:120, + title:"人员规模", + dataIndex:"staffCount", + key:"staffCount", + width:100, }, { title:"状态", - dataIndex:"zt", - key:"zt", - width:120, + dataIndex:"status", + key:"status", + width:80, + render: (text, record) => { + const getStatusStyle = (status) => { + if (status === '正常') { + return { + color: '#44BB5F', + backgroundColor: '#D8F7DE', + padding: '4px 8px', + borderRadius: '4px', + fontSize: '12px', + display: 'inline-block' + }; + } else if (status === '信息不全') { + return { + color: '#FF8800', + backgroundColor: '#FFF3E9', + padding: '4px 8px', + borderRadius: '4px', + fontSize: '12px', + display: 'inline-block' + }; + } + return {}; + }; + + return ( + + {text} + + ); + } }, { title:"操作", - dataIndex:"cz", - key:"cz", + dataIndex:"action", + key:"action", width:120, - render: (text, record) => { // ======== 渲染操作列 ======== - const handleView = (record) => { // ======== 定义查看函数 ======== - console.log('查看记录:', record); // ======== 打印记录信息到控制台 ======== - // 这里可以添加查看详情的逻辑 // ======== 注释：可以添加查看详情的逻辑 ======== - }; // ======== 函数结束 ======== + render: (text, record) => { + const handleEdit = (record) => { + console.log('编辑记录:', record); + }; - return ( // ======== 返回按钮组件 ======== - // ======== 查看按钮，点击时调用handleView函数 ======== - ); // ======== return语句结束 ======== - } // ======== render函数结束 ======== + const handleDelete = (record) => { + console.log('删除记录:', record); + }; + + return ( +
+ + +
+ ); + } } ]; - // 生成20条假数据 - const generateMockData = () => { // ======== 定义生成假数据的函数 ======== - const data = []; // ======== 创建空数组存储数据 ======== - const areas = ['生产车间A区', '生产车间B区', '储罐区', '配电室', '锅炉房', '化学品仓库', '实验室', '办公区']; // ======== 责任区域选项 ======== - const devices = ['压力容器', '储罐', '反应釜', '压缩机', '泵类设备', '电气设备', '管道系统', '安全阀']; // ======== 设备型号选项 ======== - const statuses = ['正常', '维护中', '故障', '停用', '检修']; // ======== 状态选项 ======== - const names = ['张三', '李四', '王五', '赵六', '孙七', '周八', '吴九', '郑十', '钱十一', '陈十二']; // ======== 责任人姓名选项 ======== - - for (let i = 1; i <= 20; i++) { // ======== 循环生成20条数据 ======== - data.push({ // ======== 添加一条数据到数组 ======== - key: i.toString(), // ======== 唯一标识 ======== - id: `WX${String(i).padStart(3, '0')}`, // ======== 编号：WX001, WX002... ======== - zrqy: areas[Math.floor(Math.random() * areas.length)], // ======== 随机选择责任区域 ======== - sbxh: devices[Math.floor(Math.random() * devices.length)], // ======== 随机选择设备型号 ======== - zrr: names[Math.floor(Math.random() * names.length)], // ======== 随机选择责任人 ======== - zt: statuses[Math.floor(Math.random() * statuses.length)], // ======== 随机选择状态 ======== - }); // ======== 数据对象结束 ======== - } // ======== 循环结束 ======== - return data; // ======== 返回生成的数据数组 ======== - }; // ======== 函数结束 ======== - - const tableData = generateMockData(); // ======== 调用函数生成假数据 ======== + // 固定的假数据 + const tableData = [ + { + key: '1', + id: '01', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-19 14:32:15', + staffCount: '15人', + status: '正常' + }, + { + key: '2', + id: '02', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-18 09:25:43', + staffCount: '20人', + status: '正常' + }, + { + key: '3', + id: '03', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-17 16:48:22', + staffCount: '25人', + status: '信息不全' + }, + { + key: '4', + id: '04', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-16 11:15:37', + staffCount: '18人', + status: '正常' + }, + { + key: '5', + id: '05', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-15 08:42:56', + staffCount: '22人', + status: '正常' + }, + { + key: '6', + id: '06', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-14 13:27:18', + staffCount: '16人', + status: '信息不全' + }, + { + key: '7', + id: '07', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-13 15:33:29', + staffCount: '19人', + status: '正常' + }, + { + key: '8', + id: '08', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-12 10:56:44', + staffCount: '21人', + status: '正常' + }, + { + key: '9', + id: '09', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-11 17:19:52', + staffCount: '17人', + status: '信息不全' + }, + { + key: '10', + id: '10', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-10 12:41:07', + staffCount: '23人', + status: '正常' + }, + { + key: '11', + id: '11', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-09 14:08:33', + staffCount: '24人', + status: '正常' + }, + { + key: '12', + id: '12', + orgCode: 'DH002', + orgType: '义务消防队', + manager: '张明', + department: '安全管理部', + createTime: '2024-12-08 16:52:14', + staffCount: '26人', + status: '信息不全' + } + ]; return ( -
+
{/* 警告提示框 */}
警告 @@ -172,7 +348,8 @@ const ResponsibilityImplementation = () => {
- + + +
- - + + +
{/* 第三个大块：表格 */}
{ selectedRows={[]} // ======== 选中的行数据，初始为空数组 ======== onSelectRow={() => {}} // ======== 行选择事件处理函数 ======== onChange={() => {}} // ======== 表格变化事件处理函数 ======== + pagination={{ + currentPage: 1, + pageSize: 5, + total: tableData.length, + showSizeChanger: false, + showQuickJumper: true, + showTotal: (total, range) => + `共 ${total} 条`, + locale: { + jump_to: '前往', + page: '页', + items_per_page: '条/页', + } + }} />
diff --git a/src/pages/business_basic/module/ResponsibilityImplementation.less b/src/pages/business_basic/module/ResponsibilityImplementation.less index c6d7b35..19e59b3 100644 --- a/src/pages/business_basic/module/ResponsibilityImplementation.less +++ b/src/pages/business_basic/module/ResponsibilityImplementation.less @@ -1,4 +1,4 @@ -.containerR { +.XcontainerR { padding: 8px 6px; height: 100%; display: flex; @@ -277,11 +277,13 @@ display: flex; flex-direction: column; gap: 8px; + .infoBlock { width: 100%; display: flex; justify-content: flex-start; white-space: nowrap; + .nameText { font-size: 12px; font-weight: 500; @@ -305,16 +307,16 @@ margin-left: 10px; margin-right: 10px; } - + .infoText { font-size: 10px; font-weight: 400; color: #666666; - + } - + } - + .tagContainer { display: flex; gap: 8px; @@ -331,6 +333,7 @@ white-space: nowrap; margin-left: 10px; } + .tagBlue2 { background-color: #D5E5FF; color: #1269FF; @@ -339,8 +342,9 @@ padding: 4px 8px; border-radius: 4px; white-space: nowrap; - + } + .tagBlue3 { background-color: #D5E5FF; color: #1269FF; @@ -350,7 +354,7 @@ border-radius: 4px; white-space: nowrap; margin-left: 10px; - + } .tagYellow { @@ -389,12 +393,12 @@ border-radius: 2px; cursor: pointer; padding: 2px 15px; - + &:hover { background-color: #0f5ae0; } } - + .deleteBtn { height: 80%; background-color: #FF5F60; @@ -405,14 +409,298 @@ border-radius: 2px; cursor: pointer; padding: 2px 15px; - + + &:hover { + background-color: #ff4a4b; + } + } + } + + + } + + // 第二个块的样式 + .backgroundContainer2 { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + gap: 8px; + + .infoBlock2 { + width: 100%; + display: flex; + justify-content: flex-start; + white-space: nowrap; + + .nameText2 { + font-size: 12px; + font-weight: 500; + color: #333333; + margin-left: 10px; + margin-right: 10px; + margin-top: 15px; + } + + .unitText2 { + font-size: 10px; + font-weight: 400; + color: #666666; + margin-top: 18px; + } + + .infoIcon2 { + font-size: 10px; + color: #666666; + margin-left: 10px; + margin-right: 10px; + } + + .infoText2 { + font-size: 10px; + font-weight: 400; + color: #666666; + } + } + + .tagContainer2 { + display: flex; + gap: 8px; + align-items: center; + } + + .tagBlue4 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + margin-left: 10px; + } + + .tagBlue5 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + } + + .tagBlue6 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + margin-left: 10px; + } + + .tagGreen { + background-color: #E8F5E8; + color: #52C41A; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + } + + .actionBlock2 { + width: 100%; + height: 50%; + background-color: #BDD6FDCC; + display: flex; + align-items: center; + justify-content: center; + } + + .buttonContainer2 { + display: flex; + gap: 15px; + align-items: center; + justify-content: center; + width: 100%; + + .editBtn2 { + height: 80%; + background-color: #1269FF; + color: #fff; + font-size: 10px; + font-weight: 400; + border: none; + border-radius: 2px; + cursor: pointer; + padding: 2px 15px; + + &:hover { + background-color: #0f5ae0; + } + } + + .deleteBtn2 { + height: 80%; + background-color: #FF5F60; + color: #fff; + font-size: 10px; + font-weight: 400; + border: none; + border-radius: 2px; + cursor: pointer; + padding: 2px 15px; + &:hover { background-color: #ff4a4b; } } } + } + + // 第三个块的样式 + .backgroundContainer3 { + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + gap: 8px; + + .infoBlock3 { + width: 100%; + display: flex; + justify-content: flex-start; + white-space: nowrap; + + .nameText3 { + font-size: 12px; + font-weight: 500; + color: #333333; + margin-left: 10px; + margin-right: 10px; + margin-top: 15px; + } + + .unitText3 { + font-size: 10px; + font-weight: 400; + color: #666666; + margin-top: 18px; + } + + .infoIcon3 { + font-size: 10px; + color: #666666; + margin-left: 10px; + margin-right: 10px; + } + + .infoText3 { + font-size: 10px; + font-weight: 400; + color: #666666; + } + } + + .tagContainer3 { + display: flex; + gap: 8px; + align-items: center; + } + + .tagBlue7 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + margin-left: 10px; + } + + .tagBlue8 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + } + + .tagBlue9 { + background-color: #D5E5FF; + color: #1269FF; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + margin-left: 10px; + } + + .tagOrange { + background-color: #FFF2E8; + color: #FF7A00; + font-size: 10px; + font-weight: 400; + padding: 4px 8px; + border-radius: 4px; + white-space: nowrap; + } + + .actionBlock3 { + width: 100%; + height: 50%; + background-color: #BDD6FDCC; + display: flex; + align-items: center; + justify-content: center; + } + + .buttonContainer3 { + display: flex; + gap: 15px; + align-items: center; + justify-content: center; + width: 100%; + + .editBtn3 { + height: 80%; + background-color: #1269FF; + color: #fff; + font-size: 10px; + font-weight: 400; + border: none; + border-radius: 2px; + cursor: pointer; + padding: 2px 15px; + + &:hover { + background-color: #0f5ae0; + } + } - + .deleteBtn3 { + height: 80%; + background-color: #FF5F60; + color: #fff; + font-size: 10px; + font-weight: 400; + border: none; + border-radius: 2px; + cursor: pointer; + padding: 2px 15px; + + &:hover { + background-color: #ff4a4b; + } + } + } } } } @@ -420,7 +708,6 @@ } } - .containerTwo { flex: 1; background-color: white; @@ -431,6 +718,7 @@ border-radius: 4px; .containerTwoTitle { + margin-top: 5px; margin-bottom: 15px; .titleLeft { @@ -455,6 +743,7 @@ justify-content: space-between; align-items: center; margin-bottom: 15px; + padding: 0px 20px; .searchSection { flex: 1; @@ -462,7 +751,7 @@ :global(.ant-input) { height: 32px; - border-radius: 4px; + border-radius: 4px 0px 0px 4px; border: 1px solid #d9d9d9; &:focus { @@ -495,23 +784,106 @@ color: #2E4CD4; } } + + .addBtn { + display: flex; + align-items: center; + gap: 4px; + height: 28px; + border: 1px solid #DFE4F6; + border-radius: 4px; + color: #2E4CD4; + font-weight: 500; + font-size: 12px; + padding: 0px 8px; + background: transparent; + cursor: pointer; + transition: all 0.2s; + + &:hover { + background-color: #F0F2FF; + border-color: #2E4CD4; + } + + .addIcon { + width: 12px; + height: 12px; + font-size: 12px; + } + } + + .importBtn { + display: flex; + align-items: center; + gap: 4px; + height: 28px; + border: 1px solid #DFE4F6; + border-radius: 4px; + color: #2E4CD4; + font-weight: 500; + font-size: 12px; + padding: 0px 8px; + background: transparent; + cursor: pointer; + transition: all 0.2s; + + &:hover { + background-color: #F0F2FF; + border-color: #2E4CD4; + } + + .importIcon { + width: 12px; + height: 12px; + } + } + + .exportBtn { + display: flex; + align-items: center; + gap: 4px; + height: 28px; + border: 1px solid #DFE4F6; + border-radius: 4px; + color: #2E4CD4; + font-weight: 500; + font-size: 12px; + padding: 0px 8px; + background: transparent; + cursor: pointer; + transition: all 0.2s; + + &:hover { + background-color: #F0F2FF; + border-color: #2E4CD4; + } + + .exportIcon { + width: 12px; + height: 12px; + } + } } } .containerTwoTable { flex: 1; overflow: hidden; + padding: 0px 20px; :global(.ant-table) { font-size: 12px; } + :global(.ant-pagination-options-quick-jumper input) { + text-align: center !important; + } :global(.ant-table-thead > tr > th) { background-color: #f5f5fa; font-weight: 500; font-size: 14px; color: #333333; - border-bottom: 1px solid #f0f0f0; + border-bottom: 1px solid #f0f0f0; padding: 8px 12px; text-align: center; } @@ -523,7 +895,7 @@ } :global(.ant-table-tbody > tr:hover > td) { - background-color: #f5f5f5; + // background-color: #f5f5f5; } :global(.ant-pagination) { @@ -622,4 +994,5 @@ color: #333333; font-weight: 500; } -} \ No newline at end of file +} + diff --git a/src/pages/business_basic/module/RiskAssessment.js b/src/pages/business_basic/module/RiskAssessment.js index ad4430f..f8209a8 100644 --- a/src/pages/business_basic/module/RiskAssessment.js +++ b/src/pages/business_basic/module/RiskAssessment.js @@ -14,7 +14,10 @@ import map1 from '@/assets/safe_majorHazard/online_monitoring/map.png'; import risk1 from '@/assets/safe_majorHazard/online_monitoring/risk1.png'; import risk2 from '@/assets/safe_majorHazard/online_monitoring/risk2.png'; import risk3 from '@/assets/safe_majorHazard/online_monitoring/risk3.png'; - +import eqicon1 from '@/assets/business_basic/eqicon1.png'; +import eqicon2 from '@/assets/business_basic/eqicon2.png'; +import eqicon3 from '@/assets/business_basic/eqicon3.png'; +import eqicon4 from '@/assets/business_basic/eqicon4.png'; const RiskAssessment = () => { const chartRef = useRef(null); @@ -500,77 +503,47 @@ const RiskAssessment = () => { {/* 块1 */}
-
总危险源数量
-
65
-
- ↑ - 较昨日 +2 -
+
设备总数
+
1280
- 总危险源数量 + 设备总数
{/* 块2 */}
-
高风险设备
-
65
-
- ↑ - 较昨日 +2 -
+
正常运行
+
480
- 高风险设备 + 高风险设备
{/* 块3 */}
-
今日预警次数
-
65
-
- ↑ - 较昨日 +2 -
+
需要维护
+
347
- 今日预警次数 + 今日预警次数
{/* 块4 */}
-
未处理预警
-
65
-
- ↑ - 较昨日 +2 -
+
故障设备
+
289
- 未处理预警 + 未处理预警
- {/* 块5 */} -
-
-
已处理预警
-
65
-
- - 已完成 -
-
-
- 已处理预警 -
-
diff --git a/src/pages/business_basic/module/RiskAssessment.less b/src/pages/business_basic/module/RiskAssessment.less index ab8ffe0..e2d9b2d 100644 --- a/src/pages/business_basic/module/RiskAssessment.less +++ b/src/pages/business_basic/module/RiskAssessment.less @@ -29,7 +29,7 @@ flex: 1; height: 100%; display: flex; - background: linear-gradient(170.5deg, #EBEFF4 6.87%, #FFFFFF 92.55%); + background: linear-gradient(170.5deg, #F5F7FF 6.87%, #FFFFFF 47.65%); border-radius: 4px; border: 2px solid #FFFFFF; @@ -47,7 +47,7 @@ font-family: PingFang SC; font-weight: 400; font-size: 12px; - color: #666666; + color: #333333; line-height: 1.2; } @@ -92,10 +92,10 @@ .blockImage { // width: 80%; - height: 130%; + height: 65%; // height: 80%; object-fit: contain; - margin-right: -10px; + margin-right: -5px; } } }