From 99b062eeca471bdcbfcacd88e308fab9972cd6ec Mon Sep 17 00:00:00 2001
From: WXL (wul) <wl_5969728@163.com>
Date: 星期二, 19 八月 2025 14:21:33 +0800
Subject: [PATCH] 展示优化
---
src/views/sfstatistics/analyse/index.vue | 168 +++++++++++++++++++++++++++++++++++++++++++++++++------
1 files changed, 149 insertions(+), 19 deletions(-)
diff --git a/src/views/sfstatistics/analyse/index.vue b/src/views/sfstatistics/analyse/index.vue
index c4b52eb..601d735 100644
--- a/src/views/sfstatistics/analyse/index.vue
+++ b/src/views/sfstatistics/analyse/index.vue
@@ -3,14 +3,22 @@
<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>
@@ -19,24 +27,37 @@
</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: "鍙戠儹鏈夋棤",
@@ -56,29 +77,138 @@
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>
@@ -89,7 +219,7 @@
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;
--
Gitblit v1.9.3