|  |  | 
 |  |  |     <div class="analysis-top"> | 
 |  |  |       <div class="title-top">查询条件</div> | 
 |  |  |       <div class="value"> | 
 |  |  |         <el-form ref="form" :model="form" label-width="120px"> | 
 |  |  |         <el-form ref="form" :model="queryParams" label-width="120px"> | 
 |  |  |           <el-form-item label="选择指标名称"> | 
 |  |  |             <el-select v-model="value" filterable placeholder="请选择"> | 
 |  |  |             <el-select | 
 |  |  |               remote | 
 |  |  |               :remote-method="remoteMethod" | 
 |  |  |               default-first-option | 
 |  |  |               v-model="targetvalue" | 
 |  |  |               @change="Labelstatistics" | 
 |  |  |               filterable | 
 |  |  |               placeholder="请选择" | 
 |  |  |             > | 
 |  |  |               <el-option | 
 |  |  |                 v-for="item in options" | 
 |  |  |                 :key="item.value" | 
 |  |  |                 :label="item.label" | 
 |  |  |                 :value="item.value" | 
 |  |  |                 v-for="item in targetList" | 
 |  |  |                 :key="item.id" | 
 |  |  |                 :label="item.targetname" | 
 |  |  |                 :value="item.id" | 
 |  |  |               > | 
 |  |  |               </el-option> | 
 |  |  |             </el-select> | 
 |  |  | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |     <div class="formindex"> | 
 |  |  |       <el-table :data="tableData" border style="width: 100%"> | 
 |  |  |         <el-table-column prop="date" label="指标名称"> </el-table-column> | 
 |  |  |         <el-table-column prop="name" label="单项名称"> </el-table-column> | 
 |  |  |         <el-table-column prop="address" label="单项出现次数"> </el-table-column> | 
 |  |  |         <el-table-column prop="times" label="指标出现次数"> | 
 |  |  |       <el-table | 
 |  |  |         v-loading="loading" | 
 |  |  |         :data="tableData" | 
 |  |  |         :span-method="objectSpanMethod" | 
 |  |  |         border | 
 |  |  |         :summary-method="getSummaries" | 
 |  |  |         show-summary | 
 |  |  |         style="width: 100%" | 
 |  |  |       > | 
 |  |  |         <el-table-column prop="targetname" label="指标名称"> </el-table-column> | 
 |  |  |         <el-table-column prop="targetShowCount" label="指标出现次数"> | 
 |  |  |         </el-table-column> | 
 |  |  |         <el-table-column prop="proportion" label="占比"> </el-table-column> | 
 |  |  |         <el-table-column prop="matchedtext" label="单项名称"> </el-table-column> | 
 |  |  |         <el-table-column prop="count" label="单项选中次数"> </el-table-column> | 
 |  |  |         <el-table-column prop="percentage" label="占比"> | 
 |  |  |           <template slot-scope="scope"> | 
 |  |  |             <span>{{ (Number(scope.row.percentage) * 100).toFixed(2) }}%</span> | 
 |  |  |           </template> | 
 |  |  |         </el-table-column> | 
 |  |  |       </el-table> | 
 |  |  |     </div> | 
 |  |  |   </div> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import { gettargetInfo, Labelstatistics } from "@/api/AiCentre/index"; | 
 |  |  | export default { | 
 |  |  |   name: "indexanalysis", | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       options: [ | 
 |  |  |       targetList: [ | 
 |  |  |         { | 
 |  |  |           value: "选项1", | 
 |  |  |           label: "发热有无", | 
 |  |  | 
 |  |  |           name: "有", | 
 |  |  |           address: 1, | 
 |  |  |           times: 2, | 
 |  |  |           proportion: "50%", | 
 |  |  |           proportion: "50", | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           date: "发热有无", | 
 |  |  |           name: "无", | 
 |  |  |           address: 1, | 
 |  |  |           times: 2, | 
 |  |  |           proportion: "50%", | 
 |  |  |           proportion: "50", | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           date: "发热有无", | 
 |  |  |           name: "其他", | 
 |  |  |           address: 0, | 
 |  |  |           times: 2, | 
 |  |  |           proportion: "0%", | 
 |  |  |           proportion: "0", | 
 |  |  |         }, | 
 |  |  |       ], | 
 |  |  |       targetvalue: "", | 
 |  |  |       queryParams: { | 
 |  |  |         pageNum: 1, | 
 |  |  |         pageSize: 66, | 
 |  |  |         scriptType: "1", | 
 |  |  |       }, | 
 |  |  |     }; | 
 |  |  |   }, | 
 |  |  |  | 
 |  |  |   created() {}, | 
 |  |  |   created() { | 
 |  |  |     this.getList(); | 
 |  |  |   }, | 
 |  |  |  | 
 |  |  |   methods: {}, | 
 |  |  |   methods: { | 
 |  |  |     getList() { | 
 |  |  |       this.loading = true; | 
 |  |  |       gettargetInfo(this.queryParams).then((res) => { | 
 |  |  |         this.targetList = res.rows; | 
 |  |  |         this.Labelstatistics(res.rows[0].id); | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     Labelstatistics(id) { | 
 |  |  |       console.log(id, "id"); | 
 |  |  |  | 
 |  |  |       Labelstatistics(id).then((res) => { | 
 |  |  |         if (res.data.length > 0) { | 
 |  |  |           this.tableData = res.data; | 
 |  |  |         } else { | 
 |  |  |           gettargetInfo({ id: id }).then((res) => { | 
 |  |  |             console.log(res, "替换展示值"); | 
 |  |  |             this.tableData = []; | 
 |  |  |             res.rows[0].targetoptionList.forEach((item) => { | 
 |  |  |               this.tableData.push({ | 
 |  |  |                 targetname: res.rows[0].targetname, | 
 |  |  |                 targetShowCount:0, | 
 |  |  |                 count:0, | 
 |  |  |                 percentage:0, | 
 |  |  |                 matchedtext:item.targetvalue, | 
 |  |  |               }); | 
 |  |  |             }); | 
 |  |  |           }); | 
 |  |  |         } | 
 |  |  |         this.loading = false; | 
 |  |  |       }); | 
 |  |  |     }, | 
 |  |  |     remoteMethod(value) { | 
 |  |  |       const illnessqueryParams = { | 
 |  |  |         pageNum: 1, | 
 |  |  |         pageSize: 66, | 
 |  |  |         targetname: value, | 
 |  |  |         scriptType: "1", | 
 |  |  |       }; | 
 |  |  |       setTimeout(() => { | 
 |  |  |         gettargetInfo(illnessqueryParams).then((res) => { | 
 |  |  |           this.targetList = res.rows; | 
 |  |  |         }); | 
 |  |  |       }, 200); | 
 |  |  |     }, | 
 |  |  |     objectSpanMethod({ row, column, rowIndex, columnIndex }) { | 
 |  |  |       if (columnIndex === 0 || columnIndex === 1) { | 
 |  |  |         const totalRows = this.tableData.length; | 
 |  |  |         if (rowIndex === 0) { | 
 |  |  |           return [totalRows, 1]; | 
 |  |  |         } else { | 
 |  |  |           // 其他行隐藏 | 
 |  |  |           return [0, 0]; | 
 |  |  |         } | 
 |  |  |       } | 
 |  |  |     }, | 
 |  |  |     getSummaries(param) { | 
 |  |  |       const { columns, data } = param; | 
 |  |  |       const sums = []; | 
 |  |  |       columns.forEach((column, index) => { | 
 |  |  |         console.log(data, "data"); | 
 |  |  |  | 
 |  |  |         if (index === 0) { | 
 |  |  |           sums[index] = "合计"; // 修改为“合计”更符合语义 | 
 |  |  |           return; | 
 |  |  |         } | 
 |  |  |         if (column.property === "percentage") { | 
 |  |  |           // 对占比列进行特殊处理 | 
 |  |  |           const values = data.map((item) => Number(item[column.property])); | 
 |  |  |           const total = values.reduce((prev, curr) => { | 
 |  |  |             const value = Number(curr); | 
 |  |  |             if (!isNaN(value)) { | 
 |  |  |               return prev + value; | 
 |  |  |             } else { | 
 |  |  |               return prev; | 
 |  |  |             } | 
 |  |  |           }, 0); | 
 |  |  |           sums[index] = `${total * 100}%`; // 直接添加百分号 | 
 |  |  |         } else if (column.property === "targetShowCount") { | 
 |  |  |           sums[index] = data[0].targetShowCount + " 次"; // 为次数相关列添加单位 | 
 |  |  |         } else { | 
 |  |  |           const values = data.map((item) => Number(item[column.property])); | 
 |  |  |           if (!values.every((value) => isNaN(value))) { | 
 |  |  |             sums[index] = values.reduce((prev, curr) => { | 
 |  |  |               const value = Number(curr); | 
 |  |  |               if (!isNaN(value)) { | 
 |  |  |                 return prev + curr; | 
 |  |  |               } else { | 
 |  |  |                 return prev; | 
 |  |  |               } | 
 |  |  |             }, 0); | 
 |  |  |             if (column.property === "count") { | 
 |  |  |               sums[index] += " 次"; // 为次数相关列添加单位 | 
 |  |  |             } | 
 |  |  |           } else { | 
 |  |  |             sums[index] = "/"; | 
 |  |  |           } | 
 |  |  |         } | 
 |  |  |       }); | 
 |  |  |       return sums; | 
 |  |  |     }, | 
 |  |  |   }, | 
 |  |  | }; | 
 |  |  | </script> | 
 |  |  |  | 
 |  |  | 
 |  |  |     0 0 6px 0 rgba(0, 0, 0, 0.04); | 
 |  |  |   margin: 15px; | 
 |  |  |   .title-top { | 
 |  |  |     background-color: #00bbd3; | 
 |  |  |     background-color: #6784f2; | 
 |  |  |     color: #fff; | 
 |  |  |     padding: 10px 20px; | 
 |  |  |     font-size: 20px; |