diff --git a/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.js b/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.js index 5dbbd96..3a43ecc 100644 --- a/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.js +++ b/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.js @@ -133,21 +133,34 @@ const CurveAnalysis = () => {
-
月度风险趋势分析
+
+ + 月度风险趋势分析 +
-
风险等级分布
+
+ + 风险等级分布 +
-
风险类型分布
+
+ + 风险类型分布 +
+
+ + 风险处理率 +
diff --git a/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.less b/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.less index 61a313e..2d009b3 100644 --- a/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.less +++ b/src/pages/business_envInformation_monthly/components/content_component_fxwt/CurveAnalysis.less @@ -2,80 +2,124 @@ display: flex; flex-direction: column; gap: 12px; - padding: 10px; - background: #f7f8fb; + // padding: 10px; + background: transparent; height: 100%; box-sizing: border-box; -} -.filtersRow { - display: flex; - flex-wrap: wrap; - gap: 16px; - align-items: center; - background: #fff; - padding: 12px 16px; - border-radius: 6px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); - font-size: 13px; - color: #666; -} + .filtersRow { + display: flex; + flex-wrap: wrap; + gap: 16px; + align-items: center; + background: #fff; + padding: 12px 16px; + // border-radius: 6px; + // box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); + font-size: 13px; + color: #666; -.checkGroup { - display: flex; - gap: 10px; - align-items: center; -} + .checkGroup { + display: flex; + gap: 10px; + align-items: center; -.filterItem { - display: flex; - gap: 8px; - align-items: center; -} + input[type="checkbox"] { + appearance: none; + width: 14px; + height: 14px; + margin: 0; + border: 1px solid #d9d9d9; + border-radius: 3px; + background: #fff; + position: relative; + cursor: pointer; + } -.filterItem select, -.checkGroup select { - height: 30px; - border: 1px solid #d9d9d9; - border-radius: 4px; - padding: 0 8px; - background: #fff; -} + input[type="checkbox"]:checked { + background-color: rgba(0, 212, 138, 1); + border-color: rgba(0, 212, 138, 1); + } -.topRow, -.bottomRow { - display: grid; - grid-template-columns: 2fr 1fr; - gap: 12px; -} + input[type="checkbox"]:checked::after { + content: ''; + position: absolute; + top: 1px; + left: 4px; + width: 4px; + height: 7px; + border: 2px solid #fff; + border-top: 0; + border-left: 0; + transform: rotate(45deg); + } + } -.bottomRow { - grid-template-columns: 2fr 1fr; -} + .filterItem { + display: flex; + gap: 8px; + align-items: center; -.panel { - background: #fff; - border-radius: 8px; - padding: 12px 12px 4px 12px; - box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04); - min-height: 260px; - display: flex; - flex-direction: column; -} + select { + height: 30px; + border: 1px solid #d9d9d9; + border-radius: 4px; + padding: 0 8px; + background: #fff; + } + } + + .checkGroup select { + height: 30px; + border: 1px solid #d9d9d9; + border-radius: 4px; + padding: 0 8px; + background: #fff; + } + } + + .topRow, + .bottomRow { + display: grid; + grid-template-columns: 2fr 1fr; + gap: 12px; + } + + .bottomRow { + grid-template-columns: 2fr 1fr; + } + + .panel { + background: #fff; + padding: 12px 12px 4px 12px; + min-height: 260px; + display: flex; + flex-direction: column; + + .panelHeader { + font-size: 14px; + font-weight: 600; + color: #333; + margin-bottom: 4px; + display: flex; + align-items: center; + gap: 6px; -.panelHeader { - font-size: 14px; - font-weight: 600; - color: #333; - margin-bottom: 4px; -} + .panelHeaderIcon { + width: 3px; + height: 16px; + background: rgba(0, 157, 111, 1); + } + } + } -label { - display: inline-flex; - align-items: center; - gap: 4px; -} + label { + display: inline-flex; + align-items: center; + gap: 4px; + } -input[type="checkbox"] { - margin: 0; -} + input[type="checkbox"] { + margin: 0; + } +} \ No newline at end of file diff --git a/src/pages/business_envInformation_monthly/components/fxwt.js b/src/pages/business_envInformation_monthly/components/fxwt.js index 95d1405..e7573b5 100644 --- a/src/pages/business_envInformation_monthly/components/fxwt.js +++ b/src/pages/business_envInformation_monthly/components/fxwt.js @@ -10,7 +10,7 @@ const Fxwt = () => { const menuItems = [ { key: 'riskIssueBoard', label: '风险问题看板' }, { key: 'riskMap', label: '风险地图' }, - { key: 'curveAnalysis', label: '曲式分析' } + { key: 'curveAnalysis', label: '趋势分析' } ]; const renderContent = () => { diff --git a/src/pages/business_environmental_activities/components/StatisticsAnalysis.less b/src/pages/business_environmental_activities/components/StatisticsAnalysis.less index 9774599..1f72a35 100644 --- a/src/pages/business_environmental_activities/components/StatisticsAnalysis.less +++ b/src/pages/business_environmental_activities/components/StatisticsAnalysis.less @@ -7,66 +7,66 @@ flex-direction: column; gap: 12px; min-height: 100%; -} -.toolbar { - display: flex; - align-items: center; - justify-content: space-between; - background: #fff; - border-radius: 10px; - padding: 10px 12px; - box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04); -} + .toolbar { + display: flex; + align-items: center; + justify-content: space-between; + background: #fff; + border-radius: 10px; + padding: 10px 12px; + box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04); -.toolbarFilters { - display: flex; - align-items: center; - gap: 10px; - flex-wrap: wrap; - justify-content: flex-end; -} + .toolbarFilters { + display: flex; + align-items: center; + gap: 10px; + flex-wrap: wrap; + justify-content: flex-end; + } -.filterLabel { - color: #666; - font-size: 13px; -} + .filterLabel { + color: #666; + font-size: 13px; + } -.select { - width: 120px; + .select { + width: 120px; - :global(.ant-select-selector) { - border-radius: 6px !important; - height: 34px; - box-shadow: none !important; + :global(.ant-select-selector) { + border-radius: 6px !important; + height: 34px; + box-shadow: none !important; + } + } } -} -.rowThree { - display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 12px; -} + .rowThree { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 12px; + } -.rowTwo { - display: grid; - grid-template-columns: 2fr 1fr; - gap: 12px; -} + .rowTwo { + display: grid; + grid-template-columns: 2fr 1fr; + gap: 12px; + } -.card, -.cardWide { - background: #fff; - border-radius: 10px; - box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04); - padding: 10px 12px 6px; - display: flex; - flex-direction: column; -} + .card, + .cardWide { + background: #fff; + border-radius: 10px; + box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04); + padding: 10px 12px 6px; + display: flex; + flex-direction: column; -.cardTitle { - font-size: 14px; - font-weight: 600; - color: #333; - margin-bottom: 4px; + .cardTitle { + font-size: 14px; + font-weight: 600; + color: #333; + margin-bottom: 4px; + } + } }