运管立项

src/api/yg/bzhjs.js

@@ -26,6 +26,13 @@ export function getBzhjs(id) {
   })
 }
 
+export function getChart() {
+  return request({
+    url: '/sz/bzhjs/chart',
+    method: 'get'
+  })
+}
+
 // 新增水闸标准化建设
 export function addBzhjs(data) {
   return request({

src/api/yg/dike/bzhjs.js

@@ -18,6 +18,13 @@ export function listBzhjs(query) {
   })
 }
 
+export function getChart() {
+  return request({
+    url: '/df/bzhjs/chart',
+    method: 'get'
+  })
+}
+
 // 查询堤防标准化建设详细
 export function getBzhjs(id) {
   return request({

src/api/yg/dike/fzr.js

@@ -8,6 +8,14 @@ export function getPie() {
   })
 }
 
+export function getPercent() {
+  return request({
+    url: '/df/fzr/percent',
+    method: 'get',
+  })
+}
+
+
 // 柱状图图
 export function getHistogram() {
   return request({

src/api/yg/fzr.js

@@ -8,6 +8,14 @@ export function getPie() {
   })
 }
 
+export function getPercent() {
+  return request({
+    url: '/yg/fzr/percent',
+    method: 'get',
+  })
+}
+
+
 // 柱状图图
 export function getHistogram() {
   return request({

src/api/yg/jbxx.js

@@ -8,6 +8,8 @@ export function getPie() {
   })
 }
 
+
+
 // 柱状图图
 export function getHistogram() {
   return request({

src/components/linkNameSelect/linkRes.vue

@@ -16,7 +16,7 @@
       multiple
     >
       <el-option
-        v-for="dict in dikeNameOptions"
+        v-for="dict in resNameOptions"
         :key="dict.id"
         :label="dict.resName"
         :value="dict.resCode"
@@ -39,7 +39,7 @@
       :disabled="disabled"
     >
       <el-option
-        v-for="dict in dikeNameOptions"
+        v-for="dict in resNameOptions"
         :key="dict.id"
         :label="dict.resName"
         :value="dict.resCode"
@@ -55,16 +55,16 @@ export default {
   data() {
     return {
       loading: false,
-      dikeNameOptions: [],
+      resNameOptions: [],
       // 堤防查询参数
-      dikeNameQueryParams: {
+      resNameQueryParams: {
         pageNum: 1,
         pageSize: 10,
         ids: null,
         data: {
           status:6,
-          dikeName: null,
+          resName: null,
-          dikeCode: null,
+          resCode: null,
         },
         cv:{
           name:'resCode',
@@ -83,11 +83,11 @@ export default {
   },
   created() {
     if (this.form.resName) {
-      this.dikeNameQueryParams.cv.value = this.form.resName;
+      this.resNameQueryParams.cv.value = this.form.resName;
     }
-    listBase(this.dikeNameQueryParams).then((res) => {
+    listBase(this.resNameQueryParams).then((res) => {
       console.log(111, res);
-      this.dikeNameOptions = res.records;
+      this.resNameOptions = res.records;
     });
   },
   methods: {
@@ -96,13 +96,13 @@ export default {
       return true;
     },
     reset() {
-      this.dikeNameQueryParams = {
+      this.resNameQueryParams = {
         pageNum: 1,
         pageSize: 10,
         ids: null,
         data: {
-          dikeName: null,
+          resName: null,
-          dikeCode: null,
+          resCode: null,
         },
         // 排序方式
         params: {
@@ -117,8 +117,8 @@ export default {
       // console.log(1111, this.form);
       // if (!keyWork) {
       this.reset();
-      listBase(this.dikeNameQueryParams).then((res) => {
+      listBase(this.resNameQueryParams).then((res) => {
-        this.dikeNameOptions = res.records;
+        this.resNameOptions = res.records;
       });
       // }else{
 
@@ -128,21 +128,21 @@ export default {
       this.selectLoading = true;
       if (query !== "") {
         // console.log(444, query);
-        this.dikeNameQueryParams.data.dikeName = query;
+        this.resNameQueryParams.data.resName = query;
       } else {
         this.reset();
       }
-      listBase(this.dikeNameQueryParams).then((res) => {
+      listBase(this.resNameQueryParams).then((res) => {
-        this.dikeNameOptions = res.records;
+        this.resNameOptions = res.records;
         this.selectLoading = false;
       });
     },
     selectSearch() {
-      this.dikeNameQueryParams.pageNum += 1;
+      this.resNameQueryParams.pageNum += 1;
-      listBase(this.dikeNameQueryParams).then((res) => {
+      listBase(this.resNameQueryParams).then((res) => {
         // console.log(111, res);
-        this.dikeNameOptions = [...this.dikeNameOptions, ...res.records];
+        this.resNameOptions = [...this.resNameOptions, ...res.records];
-        // console.log(111, this.dikeNameOptions);
+        // console.log(111, this.resNameOptions);
       });
     },
     chooseDike(item) {

src/views/dike/managementGuarantee/standardizationConstruction/dataCharts.vue

@@ -8,6 +8,8 @@
 </template>
 <script>
 import { getPie, getHistogram } from "@/api/yg/dike/fzr";
+import { getChart } from "@/api/yg/dike/bzhjs";
+
 import * as echarts from "echarts";
 export default {
   data() {
@@ -18,7 +20,11 @@ export default {
     };
   },
   created() {
-    this.getData();
+    getChart().then(res=>{
+      console.log(res.data,6777777777)
+      this.barChartData=res.data
+      this.barInit();
+    })
   },
   methods: {
     async getData() {

src/views/dike/managementGuarantee/standardizationConstruction/listPage/index.vue

@@ -146,6 +146,7 @@
         min-width="120"
       >
         <template slot-scope="scope">
+          {{getScore(scope.row)}}
         </template>
       </el-table-column>
 
@@ -266,7 +267,7 @@
       </el-form>
       <div class="listTitle">
         <span>评价表</span>
-        <span>总分：100</span>
+        <span>总分：{{ this.sum }}</span>
         <!-- <span class="addBtn" @click="handleAddList('0')">
             <i class="el-icon-plus"></i>
             添加
@@ -681,17 +682,27 @@
         <!-- 奖惩措施管理 -->
         <div class="score-table">
           <div class="score-header">奖惩措施管理</div>
-          <div class="score-content">
+
-            <!-- Empty content as per the example -->
-          </div>
         </div>
 
         <!-- 奖励机制和惩处措施表格 -->
         <div class="score-table-grid">
           <div class="grid-header">奖励机制</div>
-          <div class="grid-content">111</div>
+          <div class="grid-content">
+            <el-input
+              v-model="jlForm.jljz" placeholder="请输入奖励机制"
+            >
+
+            </el-input>
+          </div>
           <div class="grid-header">惩处措施</div>
-          <div class="grid-content"></div>
+          <div class="grid-content">
+            <el-input
+              v-model="jlForm.cccs" placeholder="请输入惩处措施"
+            >
+            </el-input>
+
+          </div>
         </div>
       </div>
 
@@ -741,6 +752,7 @@ export default {
       total: 0,
       // 堤防标准化建设表格数据
       bzhjsList: [],
+      jlForm:{},
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -750,6 +762,7 @@ export default {
       // 工程规模字典
       projectScaleOptions: [],
       dikeNameOptions: [],
+      sum:1050,
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -820,6 +833,29 @@ export default {
     });
   },
   methods: {
+    getScore(row){
+      if (row.score) {
+       const  evalForm = JSON.parse(row.score);
+        const value = Object.values(evalForm.score);
+        const sum=1050-value.reduce((a, b) => {
+          // 确保每个值都是数字
+          return a + Number(b);
+        }, 0);
+        if (sum>=900){
+          return '一级'
+        }
+        if (sum>=800){
+          return '二级'
+        }
+        if (sum>=700){
+          return '三级'
+        }
+        if (sum<700){
+          return '四级'
+        }
+      }else
+      return '一级'
+    },
     handleIncentive(){
       console.log(111)
       this.dialogVisible = true;
@@ -1016,6 +1052,11 @@ export default {
         }
         if (this.form.score) {
           this.evalForm = JSON.parse(this.form.score);
+          const value = Object.values(this.evalForm.score);
+          this.sum=this.sum-value.reduce((a, b) => {
+            // 确保每个值都是数字
+            return a + Number(b);
+          }, 0);
         }
         this.open = true;
         this.title = "修改堤防标准化建设";

src/views/dike/safetyManage/responsiblePersonManage/components/percentageCharts.vue

@@ -0,0 +1,220 @@
+<template>
+  <div class="chart-container">
+    <div ref="chartRef" class="echarts-box"></div>
+<!--    <div class="chart-legend">-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block green"></div>-->
+<!--        <span>良好 (>=100%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block yellow"></div>-->
+<!--        <span>一般 (>=70% 且 <100%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block orange"></div>-->
+<!--        <span>较差 (>=30% 且 <70%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block red"></div>-->
+<!--        <span>严重不足 (<30%)</span>-->
+<!--      </div>-->
+<!--    </div>-->
+  </div>
+</template>
+
+<script>
+import * as echarts from 'echarts';
+import { getPercent} from '@/api/yg/dike/fzr'
+
+export default {
+  name: 'ResponsibilityRateChart',
+  props: {
+    chartData: {
+      type: Array,
+      default: () => [
+        { cityName: '南京市', implementationRate: 93.3 },
+        { cityName: '苏州市', implementationRate: 100 },
+        { cityName: '无锡市', implementationRate: 66.7 },
+        { cityName: '常州市', implementationRate: 33.3 },
+        { cityName: '镇江市', implementationRate: 11.1 },
+        { cityName: '扬州市', implementationRate: 85.7 },
+        { cityName: '泰州市', implementationRate: 100 },
+        { cityName: '盐城市', implementationRate: 120 },  // 超过100%的例子
+        { cityName: '徐州市', implementationRate: 0 },    // 0%的例子
+        { cityName: '连云港市', implementationRate: 50 }
+      ]
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions: {}
+    };
+  },
+  watch: {
+    chartData: {
+      handler(newVal) {
+        this.initChart();
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    getPercent().then(res=>{
+      this.initChart(res);
+    })
+    window.addEventListener('resize', this.resizeChart);
+  },
+  beforeDestroy() {
+    window.removeEventListener('resize', this.resizeChart);
+    if (this.chart) {
+      this.chart.dispose();
+      this.chart = null;
+    }
+  },
+  methods: {
+    initChart(res) {
+      console.log(5555,res.data)
+
+      if (!res.data || res.data.length === 0) return;
+
+      if (!this.chart) {
+        this.chart = echarts.init(this.$refs.chartRef);
+      }
+      const adcdData=Object.entries(res.data)
+      const cities = adcdData.map(([key, value]) =>{
+          return key
+      })
+      const rates =adcdData.map(([key, value]) =>{
+        return value
+      })
+      // const cities = this.chartData.map(item => item.cityName);
+      // const rates = this.chartData.map(item => item.implementationRate);
+
+      // 根据落实率设置不同的颜色
+      const itemColors = rates.map(rate => {
+        if (rate >= 100) return '#52c41a'; // 绿色 - 良好
+        if (rate >= 70) return '#faad14';  // 黄色 - 一般
+        if (rate >= 30) return '#fa8c16';  // 橙色 - 较差
+        return '#f5222d';                  // 红色 - 严重不足
+      });
+
+      this.chartOptions = {
+        tooltip: {
+          trigger: 'axis',
+          formatter: '{b}: {c}%',
+          axisPointer: {
+            type: 'shadow'
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          data: cities,
+          axisLabel: {
+            interval: 0,
+            rotate: 30,
+            textStyle: {
+              fontSize: 12
+            }
+          }
+        },
+        yAxis: {
+          type: 'value',
+          name: '落实率(%)',
+          axisLabel: {
+            formatter: '{value}%'
+          }
+        },
+        series: [
+          {
+            name: '责任人落实率',
+            type: 'bar',
+            data: rates,
+            barWidth: '40%',
+            itemStyle: {
+              color: function(params) {
+                return itemColors[params.dataIndex];
+              }
+            },
+            label: {
+              show: true,
+              position: 'top',
+              formatter: '{c}%'
+            }
+          }
+        ]
+      };
+
+      this.chart.setOption(this.chartOptions);
+    },
+    resizeChart() {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    }
+  }
+};
+</script>
+
+<style scoped>
+.chart-container {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.chart-title {
+  font-size: 18px;
+  font-weight: bold;
+  margin-bottom: 20px;
+  color: #303133;
+}
+
+.echarts-box {
+  width: 100%;
+  height: 400px;
+}
+
+.chart-legend {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+  flex-wrap: wrap;
+}
+
+.legend-item {
+  display: flex;
+  align-items: center;
+  margin: 0 10px;
+}
+
+.color-block {
+  width: 15px;
+  height: 15px;
+  margin-right: 5px;
+  border-radius: 2px;
+}
+
+.green {
+  background-color: #52c41a;
+}
+
+.yellow {
+  background-color: #faad14;
+}
+
+.orange {
+  background-color: #fa8c16;
+}
+
+.red {
+  background-color: #f5222d;
+}
+</style>

src/views/dike/safetyManage/responsiblePersonManage/index.vue

@@ -10,18 +10,43 @@
         {{ item.routeName }}
       </el-breadcrumb-item>
     </el-breadcrumb>
+    <div class="page-title">
+      <el-row>
+        <el-col :span="24">
+          <h2 class="title-text">
+            <i class="el-icon-data-analysis"></i>
+            责任人统计
+          </h2>
+        </el-col>
+      </el-row>
+    </div>
+
     <dataCharts ref="dataCharts" />
 
+
+    <div class="page-title">
+      <el-row>
+        <el-col :span="24">
+          <h2 class="title-text">
+            <i class="el-icon-data-analysis"></i>
+            责任人落实率统计
+          </h2>
+        </el-col>
+      </el-row>
+    </div>
+    <percentage-charts ref="percentageCharts"/>
     <list :chartEleGetData="chartEleGetData" />
   </div>
 </template>
 <script>
 import list from "./components/list.vue";
 import dataCharts from "./components/dataCharts.vue";
+import percentageCharts from './components/percentageCharts.vue'
 export default {
   components: {
     list,
     dataCharts,
+    percentageCharts
   },
   data() {
     return {

src/views/dike/safetyManage/safetyAppraisal/components/listSafetyDetection.vue

@@ -83,11 +83,11 @@
               :on-success="(_, fileList) => submitUpload(fileList, 'fileList1')"
               :file-list="fileList1"
             >
-              <el-button size="small" type="primary" plain>
+              <el-button size="small" type="primary" plain v-if="!detailDsable">
                 <i class="el-icon-upload el-icon--right"></i>
                 点击上传
               </el-button>
-              <div slot="tip" class="el-upload__tip">
+              <div slot="tip" class="el-upload__tip" v-if="!detailDsable">
                 支持jpg/png文件等，不超过100M
               </div>
             </el-upload>
@@ -112,11 +112,11 @@
               :on-success="(_, fileList) => submitUpload(fileList, 'fileList2')"
               :file-list="fileList2"
             >
-              <el-button size="small" type="primary" plain>
+              <el-button size="small" type="primary" plain v-if="!detailDsable">
                 <i class="el-icon-upload el-icon--right"></i>
                 点击上传
               </el-button>
-              <div slot="tip" class="el-upload__tip">
+              <div slot="tip" class="el-upload__tip" v-if="!detailDsable">
                 支持jpg/png文件等，不超过100M
               </div>
             </el-upload>
@@ -125,8 +125,8 @@
       </el-form>
     </el-row>
     <div class="btnList">
-      <el-button type="primary" @click="submitForm">保 存</el-button>
+      <el-button type="primary" @click="submitForm" v-if="!detailDsable">保 存</el-button>
-      <el-button @click="cancel">取 消</el-button>
+      <el-button @click="cancel" v-if="!detailDsable">取 消</el-button>
     </div>
   </div>
 </template>

src/views/res/safetyManage/safeProduction/components/list.vue

@@ -7,6 +7,9 @@
       v-show="showSearch"
       label-width="68px"
     >
+      <el-form-item label="水库名称" prop="resName">
+        <link-res :form="queryParams.data"        />
+      </el-form-item>
       <el-form-item label="巡查类型" prop="inspectionType">
         <el-select
           v-model="queryParams.data.inspectionType"
@@ -23,6 +26,7 @@
           />
         </el-select>
       </el-form-item>
+
       <el-form-item>
         <!-- <el-button
           type="cyan"
@@ -48,6 +52,17 @@
           >新增隐患</el-button
         >
       </el-col>
+      <el-col :span="1.5"
+         v-if="this.queryParams.data.resCode"
+      >
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAnQuan"
+        >查看安保巡查报告</el-button
+        >
+      </el-col>
       <el-col :span="1.5">
         <el-button
           type="success"
@@ -332,6 +347,89 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+
+    <el-dialog
+      :title="title1"
+      :visible.sync="open1"
+      width="1200px"
+      append-to-body
+      :close-on-click-modal="false"
+    >
+      <el-table
+        v-loading="loading1"
+        :data="yhxxListByCode"
+      >
+        <el-table-column
+          label="序号"
+          type="index"
+          width="50"
+          align="center"
+          fixed
+        />
+        <el-table-column
+          label="发现时间"
+          align="center"
+          prop="findTime"
+          sortable
+          min-width="120"
+        >
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.findTime, "{y}-{m}-{d}") }}</span>
+          </template>
+        </el-table-column>
+       <el-table-column
+          label="隐患详情"
+          align="center"
+          prop="dangerDetail"
+          min-width="120"
+        />
+        <el-table-column
+          label="所属仪器"
+          align="center"
+          prop="instrument"
+          min-width="120"
+        />
+        <el-table-column
+        label="地点"
+        align="center"
+        prop="address"
+        min-width="120"
+      />
+        <el-table-column
+          label="提出人"
+          align="center"
+          prop="proposer"
+          min-width="120"
+        />
+
+        <el-table-column label="图片" align="center" prop="file" min-width="120">
+          <template slot-scope="scope">
+            <div
+              v-for="(item, index) in JSON.parse(scope.row.photo)"
+              :key="item + index"
+            >
+              <i class="el-icon-document"></i>
+              {{ item.name }}
+              <i
+                class="el-icon-download"
+                @click="downloadFile(scope.row.photo, index)"
+                style="cursor: pointer"
+              ></i>
+            </div>
+          </template>
+        </el-table-column>
+
+
+      </el-table>
+
+      <pagination
+        v-show="total1 > 0"
+        :total="total1"
+        :page.sync="queryParams.pageNum"
+        :limit.sync="queryParams.pageSize"
+        @pagination="handleAnQuan"
+      />
+    </el-dialog>
   </div>
 </template>
 
@@ -363,8 +461,10 @@ export default {
       loading: true,
       // 选中数组
       ids: [],
+      total1:[],
       // 非单个禁用
       single: true,
+      loading1:false,
       // 非多个禁用
       multiple: true,
       // 显示搜索条件
@@ -379,8 +479,11 @@ export default {
       open: false,
       // 水库项目
       resNameOptions: [],
+      yhxxListByCode:[],
+      open1:false,
       // 巡查类型字典
       inspectionTypeOptions: [],
+      title1:'',
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -437,7 +540,22 @@ export default {
       this.inspectionTypeOptions = response.data;
     });
   },
+  watch:{
+    'queryParams.data.resCode':{
+        handler(newVal, oldVal) {
+              this.handleQuery()
+          },
+
+             immediate: true,
+             deep: true
+      }
+  },
   methods: {
+    downloadFile(item, index) {
+      let file = JSON.parse(item)[index];
+      this.handlePreview(file);
+    },
+
     handleResolve(row) {
       this.reset();
       this.isResolve = true;
@@ -460,12 +578,25 @@ export default {
     /** 查询水库隐患信息列表 */
     getList() {
       this.loading = true;
+      this.queryParams.data.resName=null
       listYhxx(this.queryParams).then((response) => {
         this.yhxxList = response.records;
         this.total = response.total;
         this.loading = false;
       });
     },
+    handleAnQuan(){
+      this.open1=true,
+        this.title1="水库安保巡查记录报告-"+this.queryParams.data.resName
+        this.loading1=true
+      this.queryParams.data.inspectionType=1
+      this.queryParams.data.resName=null
+      listYhxx(this.queryParams).then((response) => {
+        this.yhxxListByCode = response.records;
+        this.total1 = response.total;
+        this.loading1 = false;
+      });
+    },
     // 巡查类型字典翻译
     inspectionTypeFormat(row, column) {
       return this.selectDictLabel(

src/views/sluice/managementGuarantee/standardizationConstruction/dataCharts.vue

@@ -7,7 +7,7 @@
   </div>
 </template>
 <script>
-import { getPie, getHistogram } from "@/api/yg/dike/fzr";
+import { getChart } from "@/api/yg/bzhjs";
 import * as echarts from "echarts";
 export default {
   data() {
@@ -17,23 +17,19 @@ export default {
     };
   },
   created() {
-    this.getData();
+
+    getChart().then(res=>{
+      console.log(res.data,6777777777)
+      this.barChartData=res.data
+      this.barInit();
+    })
   },
   methods: {
     async getData() {
       // const res1 = await getPie();
-      const res2 = await getHistogram();
       // for (let key in res1[0]) {
       //   this.pieChartData.push({ value: res1[0][key], name: key });
       // }
-
-      this.barChartData = {
-        "汕头市": {0: "1", 1: "1",2: '1',3:'1',4:"1",5:'1',6:'1',7:'1'},
-        "佛山市": {0: "1", 1: "1",2: '1',3:'1',4:"1",5:'1',6:'1',7:'1'},
-        "珠海市": {0: "1", 1: "1",2: '1',3:'1',4:"1",5:'1',6:'1',7:'1'},
-        "广州市": {0: "1", 1: "1",2: '1',3:'1',4:"1",5:'1',6:'1',7:'1'},
-        "中山市": {0: "1", 1: "1",2: '1',3:'1',4:"1",5:'1',6:'1',7:'1'},
-      };
       // this.pieInit();
       this.barInit();
       // console.log("pieChartData", this.pieChartData);
@@ -204,11 +200,6 @@ export default {
             type: "bar",
             data: Object.values(this.barChartData).map((res) => res["5"]),
             barMaxWidth: "10%",
-          }, {
-            name: "档潮闸",
-            type: "bar",
-            data: Object.values(this.barChartData).map((res) => res["5"]),
-            barMaxWidth: "10%",
           },
           {
             name: "排(冲)沙闸",

src/views/sluice/managementGuarantee/standardizationConstruction/listPage/index.vue

@@ -71,6 +71,15 @@
           >删除</el-button
         >
       </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-delete"
+          size="mini"
+          @click="handleIncentive"
+        >奖惩管理</el-button
+        >
+      </el-col>
       <right-toolbar
         :showSearch.sync="showSearch"
         @queryTable="getList"
@@ -130,7 +139,16 @@
         :formatter="$formatAdcd"
         min-width="120"
       />
-
+      <el-table-column
+        label="等级"
+        align="center"
+        prop="adcd"
+        min-width="120"
+      >
+        <template slot-scope="scope">
+          {{getScore(scope.row)}}
+        </template>
+      </el-table-column>
       <el-table-column
         label="操作"
         align="center"
@@ -181,6 +199,58 @@
       @pagination="getList"
     />
 
+
+    <el-dialog
+      title="考核标准与等级划分管理"
+      :visible="dialogVisible"
+      width="600px"
+      center
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+    >
+      <div class="score-dialog-content">
+        <!-- 广东省司价标准 -->
+        <div class="score-table">
+          <div class="score-header">广东省司价标准</div>
+          <div class="score-content">
+            (一: 900 分以上, 前四类 85%; 二: 800 分以上,前四类 75%; 三: 700 分以上,前四类 65%;
+            不达标 700 分以下, 前四类 65%)
+          </div>
+        </div>
+
+        <!-- 奖惩措施管理 -->
+        <div class="score-table">
+          <div class="score-header">奖惩措施管理</div>
+
+        </div>
+
+        <!-- 奖励机制和惩处措施表格 -->
+        <div class="score-table-grid">
+          <div class="grid-header">奖励机制</div>
+          <div class="grid-content">
+            <el-input
+              v-model="jlForm.jljz" placeholder="请输入奖励机制"
+            >
+
+            </el-input>
+          </div>
+          <div class="grid-header">惩处措施</div>
+          <div class="grid-content">
+            <el-input
+              v-model="jlForm.cccs" placeholder="请输入惩处措施"
+            >
+            </el-input>
+
+          </div>
+        </div>
+      </div>
+
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="primary" class="submit-btn" @click="dialogVisible = false">提交</el-button>
+        </div>
+      </template>
+    </el-dialog>
     <!-- 添加或修改水闸标准化建设对话框 -->
     <el-dialog
       :title="title"
@@ -246,6 +316,15 @@
             添加
           </span> -->
       </div>
+
+      <div class="listTitle">
+        <span>评价表</span>
+        <span>总分：{{ this.sum }}</span>
+        <!-- <span class="addBtn" @click="handleAddList('0')">
+            <i class="el-icon-plus"></i>
+            添加
+          </span> -->
+      </div>
       <div class="tableBox">
         <table class="infoTable" border="1">
           <tbody>
@@ -657,6 +736,7 @@ export default {
   },
   data() {
     return {
+      dialogVisible: false,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -667,6 +747,7 @@ export default {
       multiple: true,
       // 显示搜索条件
       showSearch: true,
+      jlForm:{},
       // 总条数
       total: 0,
       // 水闸标准化建设表格数据
@@ -709,6 +790,7 @@ export default {
           { required: true, message: "请选择水闸名称", trigger: "change" },
         ],
       },
+      sum:1050,
       // 请求头
       headers: {
         shuili: "water " + getToken(),
@@ -746,6 +828,33 @@ export default {
     });
   },
   methods: {
+    handleIncentive(){
+      console.log(111)
+      this.dialogVisible = true;
+    },
+    getScore(row){
+      if (row.score) {
+        const  evalForm = JSON.parse(row.score);
+        const value = Object.values(evalForm.score);
+        const sum=1050-value.reduce((a, b) => {
+          // 确保每个值都是数字
+          return a + Number(b);
+        }, 0);
+        if (sum>=900){
+          return '一级'
+        }
+        if (sum>=800){
+          return '二级'
+        }
+        if (sum>=700){
+          return '三级'
+        }
+        if (sum<700){
+          return '四级'
+        }
+      }else
+        return '一级'
+    },
     diffScore(name, value) {
       // console.log("value", name, value);
       var rep = new RegExp("^[0-9]*[1-9][0-9]*$");
@@ -937,6 +1046,11 @@ export default {
         }
         if (this.form.score) {
           this.evalForm = JSON.parse(this.form.score);
+          const value = Object.values(this.evalForm.score);
+          this.sum=this.sum-value.reduce((a, b) => {
+            // 确保每个值都是数字
+            return a + Number(b);
+          }, 0);
         }
         this.open = true;
         this.title = "修改水闸标准化建设";
@@ -1123,4 +1237,69 @@ export default {
     }
   }
 }
+
+.score-dialog-content {
+  padding: 5px;
+}
+.score-table {
+  border: 1px solid #dcdfe6;
+  margin-bottom: 20px;
+}
+
+.score-header {
+  font-weight: bold;
+  padding: 10px;
+  border-bottom: 1px solid #dcdfe6;
+  background-color: #f5f7fa;
+}
+
+.score-content {
+  padding: 10px;
+  min-height: 30px;
+}
+
+.score-table-grid {
+  display: grid;
+  grid-template-columns: 100px 1fr;
+  border: 1px solid #dcdfe6;
+}
+
+.grid-header {
+  padding: 10px;
+  font-weight: bold;
+  border-bottom: 1px solid #dcdfe6;
+  border-right: 1px solid #dcdfe6;
+  background-color: #f5f7fa;
+}
+
+.grid-header:last-of-type {
+  border-top: 1px solid #dcdfe6;
+}
+
+.grid-content {
+  padding: 10px;
+  min-height: 30px;
+  border-bottom: 1px solid #dcdfe6;
+}
+
+.grid-content:last-of-type {
+  border-top: 1px solid #dcdfe6;
+}
+
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.submit-btn {
+  background-color: #ffeb3b;
+  border-color: #ffeb3b;
+  color: black;
+}
+
+.submit-btn:hover {
+  background-color: #ffe500;
+  border-color: #ffe500;
+  color: black;
+}
 </style>

src/views/sluice/safetyManage/responsiblePersonManage/components/percentageCharts.vue

@@ -0,0 +1,218 @@
+<template>
+  <div class="chart-container">
+    <div ref="chartRef" class="echarts-box"></div>
+<!--    <div class="chart-legend">-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block green"></div>-->
+<!--        <span>良好 (>=100%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block yellow"></div>-->
+<!--        <span>一般 (>=70% 且 <100%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block orange"></div>-->
+<!--        <span>较差 (>=30% 且 <70%)</span>-->
+<!--      </div>-->
+<!--      <div class="legend-item">-->
+<!--        <div class="color-block red"></div>-->
+<!--        <span>严重不足 (<30%)</span>-->
+<!--      </div>-->
+<!--    </div>-->
+  </div>
+</template>
+
+<script>
+import { getPercent} from '@/api/yg/fzr'
+import * as echarts from 'echarts';
+
+export default {
+  name: 'ResponsibilityRateChart',
+  props: {
+    chartData: {
+      type: Array,
+      default: () => [
+        { cityName: '南京市', implementationRate: 93.3 },
+        { cityName: '苏州市', implementationRate: 100 },
+        { cityName: '无锡市', implementationRate: 66.7 },
+        { cityName: '常州市', implementationRate: 33.3 },
+        { cityName: '镇江市', implementationRate: 11.1 },
+        { cityName: '扬州市', implementationRate: 85.7 },
+        { cityName: '泰州市', implementationRate: 100 },
+        { cityName: '盐城市', implementationRate: 120 },  // 超过100%的例子
+        { cityName: '徐州市', implementationRate: 0 },    // 0%的例子
+        { cityName: '连云港市', implementationRate: 50 }
+      ]
+    }
+  },
+  data() {
+    return {
+      chart: null,
+      chartOptions: {}
+    };
+  },
+  watch: {
+    chartData: {
+      handler(newVal) {
+        this.initChart();
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    getPercent().then(res=>{
+      console.log(res.data,1111)
+      this.initChart(res);
+    })
+
+    window.addEventListener('resize', this.resizeChart);
+  },
+  beforeDestroy() {
+    window.removeEventListener('resize', this.resizeChart);
+    if (this.chart) {
+      this.chart.dispose();
+      this.chart = null;
+    }
+  },
+  methods: {
+    initChart(res) {
+      if (!res.data || res.data === 0) return;
+
+      if (!this.chart) {
+        this.chart = echarts.init(this.$refs.chartRef);
+      }
+
+      const adcdData=Object.entries(res.data)
+      const cities = adcdData.map(([key, value]) =>{
+        return key
+      })
+      const rates =adcdData.map(([key, value]) =>{
+        return value
+      })
+      // 根据落实率设置不同的颜色
+      const itemColors = rates.map(rate => {
+        if (rate >= 100) return '#52c41a'; // 绿色 - 良好
+        if (rate >= 70) return '#faad14';  // 黄色 - 一般
+        if (rate >= 30) return '#fa8c16';  // 橙色 - 较差
+        return '#f5222d';                  // 红色 - 严重不足
+      });
+
+      this.chartOptions = {
+        tooltip: {
+          trigger: 'axis',
+          formatter: '{b}: {c}%',
+          axisPointer: {
+            type: 'shadow'
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: {
+          type: 'category',
+          data: cities,
+          axisLabel: {
+            interval: 0,
+            rotate: 30,
+            textStyle: {
+              fontSize: 12
+            }
+          }
+        },
+        yAxis: {
+          type: 'value',
+          name: '落实率(%)',
+          axisLabel: {
+            formatter: '{value}%'
+          }
+        },
+        series: [
+          {
+            name: '责任人落实率',
+            type: 'bar',
+            data: rates,
+            barWidth: '40%',
+            itemStyle: {
+              color: function(params) {
+                return itemColors[params.dataIndex];
+              }
+            },
+            label: {
+              show: true,
+              position: 'top',
+              formatter: '{c}%'
+            }
+          }
+        ]
+      };
+
+      this.chart.setOption(this.chartOptions);
+    },
+    resizeChart() {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    }
+  }
+};
+</script>
+
+<style scoped>
+.chart-container {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.chart-title {
+  font-size: 18px;
+  font-weight: bold;
+  margin-bottom: 20px;
+  color: #303133;
+}
+
+.echarts-box {
+  width: 100%;
+  height: 400px;
+}
+
+.chart-legend {
+  display: flex;
+  justify-content: center;
+  margin-top: 20px;
+  flex-wrap: wrap;
+}
+
+.legend-item {
+  display: flex;
+  align-items: center;
+  margin: 0 10px;
+}
+
+.color-block {
+  width: 15px;
+  height: 15px;
+  margin-right: 5px;
+  border-radius: 2px;
+}
+
+.green {
+  background-color: #52c41a;
+}
+
+.yellow {
+  background-color: #faad14;
+}
+
+.orange {
+  background-color: #fa8c16;
+}
+
+.red {
+  background-color: #f5222d;
+}
+</style>

src/views/sluice/safetyManage/responsiblePersonManage/index.vue

@@ -10,18 +10,40 @@
         {{ item.routeName }}
       </el-breadcrumb-item>
     </el-breadcrumb>
+    <div class="page-title">
+      <el-row>
+        <el-col :span="24">
+          <h2 class="title-text">
+            <i class="el-icon-data-analysis"></i>
+            责任人统计
+          </h2>
+        </el-col>
+      </el-row>
+    </div>
     <dataCharts ref="dataCharts" />
-
+    <div class="page-title">
+      <el-row>
+        <el-col :span="24">
+          <h2 class="title-text">
+            <i class="el-icon-data-analysis"></i>
+            责任人落实率统计
+          </h2>
+        </el-col>
+      </el-row>
+    </div>
+    <percent-chart/>
     <list :chartEleGetData="chartEleGetData" />
   </div>
 </template>
 <script>
 import list from "./components/list.vue";
 import dataCharts from "./components/dataCharts.vue";
+import percentChart from './components/percentageCharts.vue'
 export default {
   components: {
     list,
     dataCharts,
+    percentChart
   },
   data() {
     return {

src/views/sluice/safetyManage/safetyAppraisal/components/listSafetyDetection.vue

@@ -9,13 +9,14 @@
         </el-col>
         <el-col :span="12">
           <el-form-item label="闸门数量" prop="holesNumber">
-            <el-input v-model="form.holesNumber" placeholder="请输入闸门数量" />
+            <el-input v-model="form.holesNumber" placeholder="请输入闸门数量" :disabled="detailDsable"/>
           </el-form-item>
         </el-col>
         <el-col :span="12">
           <el-form-item label="启闭机数量" prop="hoistNumber">
             <el-input
               v-model="form.hoistNumber"
+              :disabled="detailDsable"
               placeholder="请输入启闭机数量"
             />
           </el-form-item>
@@ -25,6 +26,7 @@
             <el-select
               v-model="form.gateType"
               placeholder="请选择闸门型式"
+              :disabled="detailDsable"
               style="width: 100%"
             >
               <el-option
@@ -41,6 +43,7 @@
             <el-select
               v-model="form.hoistType"
               placeholder="请选择启闭机型式"
+              :disabled="detailDsable"
               style="width: 100%"
             >
               <el-option
@@ -56,6 +59,7 @@
           <el-form-item label="安全评价" prop="evaluate">
             <el-input
               v-model="form.evaluate"
+              :disabled="detailDsable"
               placeholder="请输入闸门和启闭机安全评价"
               type="textarea"
             />
@@ -79,11 +83,11 @@
               :on-success="(_, fileList) => submitUpload(fileList, 'fileList1')"
               :file-list="fileList1"
             >
-              <el-button size="small" type="primary" plain>
+              <el-button size="small" type="primary" plain v-if="!detailDsable">
                 <i class="el-icon-upload el-icon--right"></i>
                 点击上传
               </el-button>
-              <div slot="tip" class="el-upload__tip">
+              <div slot="tip" class="el-upload__tip" v-if="!detailDsable">
                 支持jpg/png文件等，不超过100M
               </div>
             </el-upload>
@@ -107,11 +111,11 @@
               :on-success="(_, fileList) => submitUpload(fileList, 'fileList2')"
               :file-list="fileList2"
             >
-              <el-button size="small" type="primary" plain>
+              <el-button size="small" type="primary" plain v-if="!detailDsable">
                 <i class="el-icon-upload el-icon--right"></i>
                 点击上传
               </el-button>
-              <div slot="tip" class="el-upload__tip">
+              <div slot="tip" class="el-upload__tip" v-if="!detailDsable">
                 支持jpg/png文件等，不超过100M
               </div>
             </el-upload>
@@ -120,8 +124,8 @@
       </el-form>
     </el-row>
     <div class="btnList">
-      <el-button type="primary" @click="submitForm">保 存</el-button>
+      <el-button type="primary" @click="submitForm" v-if="!detailDsable">保 存</el-button>
-      <el-button @click="cancel">取 消</el-button>
+      <el-button @click="cancel" v-if="!detailDsable">取 消</el-button>
     </div>
   </div>
 </template>
@@ -140,7 +144,7 @@ import { getFileStream } from "@/api/system/upload";
 
 export default {
   name: "Aqjc",
-  props: ["wagaName", "szrwId"],
+  props: ["wagaName", "szrwId","detailDsable"],
   data() {
     return {
       // 遮罩层

src/views/sluice/safetyManage/safetyAppraisal/list.vue

@@ -188,6 +188,12 @@
                 : "修改填报"
             }}
           </el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleDetial(scope.row)"
+          >查看报告</el-button>
           <el-button
             size="mini"
             type="text"
@@ -196,14 +202,14 @@
             v-hasPermi="['sz:szrw:examine']"
             >审核</el-button
           >
-          <!-- <el-button
+          <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['sz:szrw:remove']"
             >删除</el-button
-          > -->
+          >
         </template>
       </el-table-column>
     </el-table>
@@ -216,6 +222,23 @@
       @pagination="getList"
     />
 
+    <el-dialog
+      title="查看报告"
+      :visible.sync="openDetial"
+      width="1200px"
+      append-to-body
+      :close-on-click-modal="false"
+      @close="close"
+    >
+      <listSafetyDetection
+        :szrwId="szrwId"
+        :wagaName="wagaName"
+        :detailDsable="detailDsable"
+        @closeParentTabs="closeTabs"
+        @cancelParent="cancel"
+      />
+    </el-dialog>
+
     <!-- 添加或修改水闸鉴定任务关联对话框 -->
     <el-dialog
       :title="title"
@@ -351,6 +374,7 @@ export default {
       emActiveName: "listBaseInfoEm",
       // 遮罩层
       loading: true,
+      openDetial:false,
       // 选中数组
       ids: [],
       // 非单个禁用
@@ -366,6 +390,7 @@ export default {
       // 弹出层标题
       title: "",
       emTitle: "",
+      detailDsable:false,
       // 是否显示弹出层
       open: false,
       emOpen: false,
@@ -421,6 +446,17 @@ export default {
     });
   },
   methods: {
+    handleDetial(row){
+      this.openDetial = true;
+      this.szrwId = row.id;
+      this.wagaName = row.wageName;
+      this.detailDsable = true;
+
+    },
+    closeTabs() {
+      // 当接收到子组件的关闭通知时，将 open 设置为 false
+      this.open = false;
+    },
     pass() {
       this.form.status = "3";
       updateSzrw(this.form).then((response) => {