处置进展调整

src/store/riskTable.js

@@ -7,7 +7,7 @@ export const useRiskTableStore = defineStore('riskTable', {
       bigRiskTableShow: false, //大风险列表
       disposalShow: false, //处置事件
 
-      currentBackground:1,
+      currentBackground:1, // 处置进展 tab
       comeFrom: 0, // 存储当前高亮按钮的索引
     }
   },

src/views/left/comp/dispose/RiskProfile.vue

@@ -3,16 +3,6 @@
   <div class="risk_profile_container">
     <!-- 1.==================== -->
     <HeaderBoxContent :headerObj="headerObj"></HeaderBoxContent>
-    <!-- <div class="risk_profile_header">
-      <div class="risk_profile_title">
-
-        <img src="../../../../assets/img/levelC.png" alt="" />
-        <div class="risk_profile_name">05-2024-1210-01-不明原因肺炎</div>
-        <div class="risk_profile_type">风险个案</div>
-      </div>
-      <div class="risk_profile_change_btn">
-      </div>
-    </div> -->
 
     <!-- 2.============================== -->
     <div class="risk_profile_info">
@@ -50,7 +40,10 @@
       <div class="risk_summary_header">
         <TowLevelTitle :title="'风险概括'"></TowLevelTitle>
 
-        <div class="risk_summary_tag" @click="openAIDialogHandle"><img src="../../../../assets/img/动态评估.png" alt="">动态评估</div>
+        <div class="risk_summary_tag" @click="openAIDialogHandle">
+          <img src="../../../../assets/img/动态评估.png" alt="" />
+          动态评估
+        </div>
       </div>
       <div class="risk_summary_content">
         <div class="risk_bg risk_bg_color">
@@ -193,13 +186,13 @@
       </div>
     </div>
 
-
     <!-- 动态评估 弹窗 -->
-    <AiPublicRiskDialog v-if="dialogStore.riskAIDialogOpen2"> </AiPublicRiskDialog>
+    <AiPublicRiskDialog v-if="dialogStore.riskAIDialogOpen2"></AiPublicRiskDialog>
   </div>
 </template>
 <script setup>
-import AiPublicRiskDialog  from './dialog/AiPublicRiskDialog'
+import { getRiskTimeEchartsOption, getRiskAreaEchartsOption } from './echarts/echartsOption'
+import AiPublicRiskDialog from './dialog/AiPublicRiskDialog'
 import HeaderBoxContent from './common/HeaderBoxContent'
 import * as echarts from 'echarts'
 import { ref, watch, computed, reactive, toRefs, onBeforeMount, onMounted } from 'vue'
@@ -208,7 +201,7 @@ import { useDialogStore } from '@/store/dialog'
 let dialogStore = useDialogStore()
 
 const headerObj = ref({
-  tabTitle:'风险概况',
+  tabTitle: '风险概况',
   level: 'C',
   title: '05-2024-1210-01-不明原因肺炎',
   typeList: ['风险个案']
@@ -238,82 +231,34 @@ const timeButtons = ref([
   { id: 2, name: '报告时间', active: true }
 ])
 
-function openAIDialogHandle () {
-   dialogStore.closeAllDialog()
-   dialogStore.setRiskAI2DialogOpen(true)
+function openAIDialogHandle() {
+  dialogStore.closeAllDialog()
+  dialogStore.setRiskAI2DialogOpen(true)
 }
 
 //4.时间分布 地区分布
+
+// 绑定 ECharts 容器
+const timeChart = ref(null)
+const areaChart = ref(null)
+
 // 初始化时间分布图（蓝色渐变）
 const initTimeChart = () => {
   if (!timeChart.value) return
   const chart = echarts.init(timeChart.value)
-  chart.setOption({
-    tooltip: { trigger: 'axis' },
-    grid: { left: '10%', right: '5%', top: '15%', bottom: '18%' }, // 调整四周距离
-    xAxis: {
-      type: 'category',
-      data: ['12/04', '12/05', '12/06', '12/07', '12/08', '12/09', '12/10'],
-      axisLine: { lineStyle: { color: '#4A90E2' } } // X 轴颜色
-    },
-    yAxis: {
-      type: 'value',
-      axisLine: { lineStyle: { color: '#4A90E2' } }, // Y 轴颜色
-      splitLine: { lineStyle: { type: 'dashed', color: '#ccc' } } // Y 轴背景横线虚线
-    },
-    series: [
-      {
-        type: 'bar',
-        data: [3, 6, 2, 9, 5, 8, 10],
-        barWidth: 30,
-        itemStyle: {
-          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-            { offset: 0, color: 'rgba(63, 174, 253, 0)' },
-            { offset: 1, color: '#3FAEFD' }
-          ])
-        },
-        barBackgroundStyle: { color: 'rgba(74, 144, 226, 0.2)' } // 背景透明色
-      }
-    ]
-  })
+  const option = getRiskTimeEchartsOption()
+  chart.setOption(option)
 }
 
 // 初始化地区分布图（黄色渐变）
 const initAreaChart = () => {
   if (!areaChart.value) return
   const chart = echarts.init(areaChart.value)
-  chart.setOption({
-    tooltip: { trigger: 'axis' },
-    grid: { left: '10%', right: '5%', top: '15%', bottom: '18%' }, // 调整四周距离
-    xAxis: {
-      type: 'category',
-      data: ['长宁区', '闵行区'],
-      axisLine: { lineStyle: { color: '#FBA541' } } // X 轴颜色
-    },
-    yAxis: {
-      type: 'value',
-      axisLine: { lineStyle: { color: '#FBA541' } }, // Y 轴颜色
-      splitLine: { lineStyle: { type: 'dashed', color: '#ccc' } } // Y 轴背景横线虚线
-    },
-    series: [
-      {
-        type: 'bar',
-        data: [5, 9],
-        barWidth: 30,
-        itemStyle: {
-          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
-            { offset: 0, color: 'rgba(251,165,65,0)' },
-            { offset: 1, color: '#FBA541' }
-          ])
-        }
-      }
-    ]
-  })
+  const option = getRiskAreaEchartsOption()
+  chart.setOption(option)
 }
 
-// 绑定 ECharts 容器
-const timeChart = ref(null)
-const areaChart = ref(null)
+
 
 // 5.核心流调
 const flowData = ref([
@@ -532,7 +477,7 @@ onMounted(() => {
     .risk_summary_header {
       width: 100%;
       position: relative;
-      >img{
+      > img {
         margin-right: 5px;
         width: 14px;
         height: 14px;

src/views/left/comp/dispose/echarts/echartsOption.js

@@ -0,0 +1,65 @@
+import * as echarts from "echarts";
+import "echarts-wordcloud";
+
+// 时间分布
+export const getRiskTimeEchartsOption = () => {
+  return {
+    tooltip: { trigger: 'axis' },
+    grid: { left: '10%', right: '5%', top: '15%', bottom: '18%' }, // 调整四周距离
+    xAxis: {
+      type: 'category',
+      data: ['12/04', '12/05', '12/06', '12/07', '12/08', '12/09', '12/10'],
+      axisLine: { lineStyle: { color: '#4A90E2' } } // X 轴颜色
+    },
+    yAxis: {
+      type: 'value',
+      axisLine: { lineStyle: { color: '#4A90E2' } }, // Y 轴颜色
+      splitLine: { lineStyle: { type: 'dashed', color: '#ccc' } } // Y 轴背景横线虚线
+    },
+    series: [
+      {
+        type: 'bar',
+        data: [3, 6, 2, 9, 5, 8, 10],
+        barWidth: 30,
+        itemStyle: {
+          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+            { offset: 0, color: 'rgba(63, 174, 253, 0)' },
+            { offset: 1, color: '#3FAEFD' }
+          ])
+        },
+        barBackgroundStyle: { color: 'rgba(74, 144, 226, 0.2)' } // 背景透明色
+      }
+    ]
+  };
+};
+
+export const getRiskAreaEchartsOption = () => {
+  return {
+    tooltip: { trigger: 'axis' },
+    grid: { left: '10%', right: '5%', top: '15%', bottom: '18%' }, // 调整四周距离
+    xAxis: {
+      type: 'category',
+      data: ['长宁区', '闵行区'],
+      axisLine: { lineStyle: { color: '#FBA541' } } // X 轴颜色
+    },
+    yAxis: {
+      type: 'value',
+      axisLine: { lineStyle: { color: '#FBA541' } }, // Y 轴颜色
+      splitLine: { lineStyle: { type: 'dashed', color: '#ccc' } } // Y 轴背景横线虚线
+    },
+    series: [
+      {
+        type: 'bar',
+        data: [5, 9],
+        barWidth: 30,
+        itemStyle: {
+          color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
+            { offset: 0, color: 'rgba(251,165,65,0)' },
+            { offset: 1, color: '#FBA541' }
+          ])
+        }
+      }
+    ]
+  };
+};
+

src/views/left/dialog/ProgressInDisposalDialog.vue

@@ -22,8 +22,6 @@
 
       <!-- 3.标准处置流程 -->
       <StandardDisposalProcess v-if="activeIndex === 2"></StandardDisposalProcess>
-
-  
     </div>
   </div>
 </template>
@@ -111,12 +109,22 @@ function handleRowClick() {}
       padding: 4px 20px;
       background: url(../../../assets/img/dispose_tab_bg.png) no-repeat;
       background-size: 100% 100%;
-      // dispose_tab_bg_active
+      font-family: Alibaba PuHuiTi 3, Alibaba PuHuiTi 30;
+      font-weight: normal;
+      font-size: 14px;
+      color: #9ffdff;
+      font-style: normal;
+      text-transform: none;
+      > img {
+        width: 44px;
+        height: 44px;
+      }
     }
 
     .dispose_table_container_btn_active {
       background: url(../../../assets/img/dispose_tab_bg_active.png) no-repeat;
       background-size: 100% 100%;
+      
     }
   }
 

src/views/left/dialog/components/DisposalProgressContent.vue

@@ -32,7 +32,7 @@ register({
 register({
   shape: 'custom-vue-children-node',
   width: 121,
-  height: 60,
+  height: 46,
   component: ProgressChildrenNode,
   getComponent(node) {
     return {

src/views/left/dialog/components/common/ProgressChildrenNode.vue

@@ -66,7 +66,7 @@ export default {
   // padding:  2px;
   width: 112px;
   // min-width: 134px;
-  // height: 46px;
+  height: 46px;
   background: rgba(16, 154, 255, 0.15);
   border-radius: 6px 6px 6px 6px;
   border: 1px solid #109aff;

src/views/right/components/handleProcess/comp/RightLegend.vue

@@ -83,7 +83,7 @@
       <div class="icon-box">
         <img src="../../../../../assets/img/Component 240(6).png" />
       </div>
-      <el-select class="legend-select" placeholder="请选择"></el-select>
+      <el-select class="legend-select" placeholder="请选择" ></el-select>
     </div>
 
     <div class="legend-item">