From ce73915e3f9316f563a90882c2e640d479be0732 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=83=AD=E6=89=BF?= <guocheng@xinyingpower.com>
Date: Tue, 8 Apr 2025 17:26:59 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=BB=9F=E8=AE=A1=E6=8A=A5?=
 =?UTF-8?q?=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Sidebar.vue            |   4 +
 src/router/index.js                   |  12 +
 src/utils/api/index.js                |   9 +
 src/views/statisticalReport/index.vue | 575 ++++++++++++++++++++++++++
 4 files changed, 600 insertions(+)
 create mode 100644 src/views/statisticalReport/index.vue

diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue
index ae15b7e..2cb2351 100644
--- a/src/components/Sidebar.vue
+++ b/src/components/Sidebar.vue
@@ -127,6 +127,10 @@ export default {
               index: "/reportData",
               title: "数据报表",
             },
+            {
+              index: "/statisticalReport",
+              title: "统计报表",
+            }
           ],
         },
         {
diff --git a/src/router/index.js b/src/router/index.js
index 033cbe6..11bccfb 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -273,6 +273,18 @@ const routes = [
         name: "icing",
         meta: { title: "覆冰监测", keepAlive: true, requiresAuth: true },
       },
+      //数据报表
+      {
+        path: "/statisticalReport",
+        component: () => import("../views/statisticalReport/index.vue"),
+        name: "statisticalReport",
+        meta: {
+          title: "统计报表",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      }
     ],
   },
   {
diff --git a/src/utils/api/index.js b/src/utils/api/index.js
index da29936..a58e7d1 100644
--- a/src/utils/api/index.js
+++ b/src/utils/api/index.js
@@ -1051,3 +1051,12 @@ export function deletePresetApi(data) {
     },
   });
 }
+
+//统计报表查询
+export function getStatisticalReport(data){
+  return request({
+    url: "/xymanager/getPhotoStat",
+    method: "post",
+    data
+  });
+}
\ No newline at end of file
diff --git a/src/views/statisticalReport/index.vue b/src/views/statisticalReport/index.vue
new file mode 100644
index 0000000..3b6c458
--- /dev/null
+++ b/src/views/statisticalReport/index.vue
@@ -0,0 +1,575 @@
+<template>
+    <div class="statisticalReport">
+        <div class="searchMain">
+            <div class="searchBox" ref="searchref">
+                <el-form :inline="true" :model="formdata" class="demo-form-inline">
+                    <el-form-item label="电压等级">
+                        <el-select v-model="formdata.dyid" @change="getSearchxl">
+                            <el-option v-for="item in dyOptions" :key="item.id" :label="item.name" :value="item.id">
+                                {{ item.name }}
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="线路名称">
+                        <el-select v-model="formdata.lineid" @change="getSearchgt" filterable>
+                            <el-option v-for="item in xlOptions" :key="item.id" :label="item.name"
+                                :value="item.id"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="杆塔名称">
+                        <el-select v-model="formdata.towerid" @change="getSearchzz" filterable>
+                            <el-option v-for="item in gtOptions" :key="item.id" :label="item.name"
+                                :value="item.id"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="装置名称">
+                        <el-select v-model="formdata.termid" @change="getSearchtd" filterable>
+                            <el-option v-for="item in zzOptions" :key="item.id" :label="item.name" :value="item.id">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="通道">
+                        <el-select v-model="formdata.channelid">
+                            <el-option v-for="item in tdOptions" :key="item.id" :label="item.alias !== null && item.alias !== ''
+                                ? item.alias
+                                : item.name
+                                " :value="item.id"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="开始日期">
+                        <el-date-picker v-model="formdata.starttime" type="datetime" placeholder="开始日期"
+                            value-format="timestamp" :picker-options="pickerOptions" default-time="00:00:00">
+                        </el-date-picker>
+                    </el-form-item>
+                    <el-form-item label="结束日期">
+                        <el-date-picker v-model="formdata.endtime" type="datetime" default-time="23:59:59"
+                            placeholder="结束日期" value-format="timestamp" :picker-options="pickerOptions" class="ml10">
+                        </el-date-picker>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-input v-model="formdata.search" placeholder="请输入线路/杆塔/设备名称" clearable></el-input>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" @click="onSubmit">查询</el-button>
+                    </el-form-item>
+                </el-form>
+            </div>
+            <div class="pictureBox">
+                <div class="deviceTable">
+                    <el-table ref="multipleTable" border :data="picList" tooltip-effect="dark" stripe
+                        style="width: 100%" height="calc(120%)" v-loading="loading" highlight-current-row>
+                        <template slot="empty">
+                            <el-empty :image-size="160" description="暂无数据"></el-empty>
+                        </template>
+                        <el-table-column prop="cmdid" label="装置" show-overflow-tooltip
+                            min-width="15%"></el-table-column>
+
+                        <el-table-column label="通道信息" min-width="80%">
+                            <!-- 分行显示 -->
+                            <template slot-scope="scope">
+                                <el-table :data='scope.row.presetList'>
+                                    <el-table-column prop='channelId' label="通道-预置位" width="100px" align="center">
+                                        <template slot-scope="scope">
+                                            <span>{{ scope.row.channelId }}-{{ scope.row.presetId }}</span>
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column prop='hours' label="预计拍照" width="100px" align="center">
+                                        <template slot-scope="scope">
+                                            <span>{{ scope.row.hours.length * 2 }}</span>
+                                        </template>
+                                    </el-table-column>
+                                    <el-table-column prop='total' label="拍照总数" width="100px"
+                                        align="center"></el-table-column>
+                                    <el-table-column prop='presets' label="多出图片" :formatter="handlePresetsMany"
+                                        min-width="35%"></el-table-column>
+                                    <el-table-column prop='presets' label="缺少图片" :formatter="handlePresetsFew"
+                                        min-width="65%"></el-table-column>
+
+                                </el-table>
+                            </template>
+                        </el-table-column>
+
+                        <!-- <el-table-column fixed="right" label="操作" width="200">
+                            <template slot-scope="scope">
+                                <el-button @click.native.stop="handleResive(scope.row)" type="text">修改</el-button>
+                                <el-button type="text" class="deleteText"
+                                    @click.native.stop="handleDelete(scope.row)">删除</el-button>
+                            </template>
+                        </el-table-column> -->
+                    </el-table>
+                    <!-- <div class="pageNation">
+                        <el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange"
+                            :current-page="page" :page-size="pageSize" layout="sizes, prev, pager, next, jumper,total"
+                            :total="total" background>
+                        </el-pagination>
+                    </div> -->
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import {
+    getSearchInfo,
+    getRealtimePhoto,
+    deletePicList,
+    getStatisticalReport,
+} from "@/utils/api/index";
+import defaultImage from "../../assets/img/nodatapic2.jpg";
+export default {
+    name: "statisticalReport",
+    data() {
+        return {
+            pickerOptions: {
+                disabledDate(date) {
+                    return date.getTime() > Date.now(); // 禁用大于今天的日期
+                },
+            },
+
+            picList: [],
+            dyOptions: [{ id: -1, name: "全部" }], //电压数据
+            xlOptions: [{ id: -1, name: "全部" }], //线路数据
+            gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
+            zzOptions: [{ id: -1, name: "全部" }], //装置数据
+            tdOptions: [{ id: -1, name: "全部", alias: null }], //通道数据
+            formdata: {
+                dyid: -1,
+                lineid: -1,
+                towerid: -1,
+                channelid: -1,
+                termid: -1,
+                search: "",
+            },
+            tdTermid: "",
+            page: 1, // 当前页数
+            pageSize: 20, // 每页数量
+            total: 0, //总条数
+            loading: false,
+            signtype: 0, //0第一次查询
+        };
+    },
+    created() {
+        var that = this;
+        document.onkeydown = function (e) {
+            var key = window.event.keyCode;
+            if (key === 13) {
+                that.onSubmit(); // 触发事件
+            }
+        };
+    },
+    mounted() {
+        this.$set(this.formdata, "endtime", new Date().getTime());
+        if (JSON.stringify(this.$route.query) === "{}") {
+            this.$set(
+                this.formdata,
+                "starttime",
+                new Date(new Date().toLocaleDateString()).getTime()
+            );
+
+            this.getSearchdy();
+        } else {
+            this.getSearchdy();
+            this.formdata.dyid = this.$route.query.dyId;
+            this.formdata.lineid = this.$route.query.lineId;
+            this.formdata.towerid = this.$route.query.towerId;
+            this.formdata.channelid = this.$route.query.channelId;
+            this.formdata.termid = this.$route.query.termId;
+            this.$set(this.formdata, "starttime", Number(this.$route.query.date));
+            this.getPicData();
+        }
+    },
+    methods: {
+        //照片多的处理
+        handlePresetsMany(row, column, cellValue) {
+            if (row.wrongCount == 0) {
+                return "无";
+            } else {
+                var txt = "";
+                row.hours.forEach(data => {
+                    if (data.base < data.timeList.length) {
+                        let hour = parseInt(data.hour.substring(11,13));
+                        txt += hour + "点" + data.wrongDetail + "张 , ";
+                        return;
+                    }
+                });
+                if ("" == txt) {
+                    return "无";
+                } else {
+                    return txt;
+                }
+            }
+        },
+        //照片少的处理
+        handlePresetsFew(row, column, cellValue) {
+            if (row.wrongCount == 0) {
+                return "无";
+            } else {
+                var txt = "";
+                row.hours.forEach(data => {
+                    if (data.base > data.timeList.length) {
+                        let hour = data.hour.substring(11,13);
+                        //记录大于30之后的
+                        let da = 0;
+                        //记录大于30之前的
+                        let xi = 0;
+                        data.timeList.forEach(timedata => {
+                            let min = parseInt(timedata.substring(11,13));
+                            if ( min > 30 ) {
+                                da++;
+                            } else if ( min < 30 ) {
+                                xi++;
+                            }
+                        });
+                        if ( da == 0 ) {
+                            txt += hour + ":30点少1张 , ";
+                        }
+                        if ( xi == 0 ) {
+                            txt += hour + ":00点少1张 , ";
+                        }
+                        return;
+                    }
+                });
+                if ("" == txt) {
+                    return "无";
+                } else {
+                    return txt;
+                }
+            }
+        },
+        setDefaultImage(e) {
+            e.target.src = defaultImage;
+        },
+        //获取电压信息
+        getSearchdy() {
+            getSearchInfo({ type: 1 })
+                .then((res) => {
+                    this.dyOptions = this.dyOptions.concat(res.data.list);
+                    console.log(this.dyOptions);
+                    if (JSON.stringify(this.$route.query) === "{}") {
+                        this.formdata.dyid = this.dyOptions[0].id;
+                    } else {
+                        this.formdata.dyid = Number(this.$route.query.dyId);
+                    }
+                    this.getSearchxl();
+                })
+                .catch((err) => { });
+        },
+        //获取线路数据
+        getSearchxl() {
+            getSearchInfo({ type: 2, id: this.formdata.dyid })
+                .then((res) => {
+                    this.xlOptions = [{ id: -1, name: "全部" }];
+                    this.xlOptions = this.xlOptions.concat(res.data.list);
+
+                    if (JSON.stringify(this.$route.query) === "{}") {
+                        this.formdata.lineid = this.xlOptions[0].id;
+                    } else {
+                        this.formdata.lineid = Number(this.$route.query.lineId);
+                    }
+                    this.getSearchgt();
+                })
+                .catch((err) => { });
+        },
+        //获取杆塔数据
+        getSearchgt() {
+            getSearchInfo({ type: 3, id: this.formdata.lineid })
+                .then((res) => {
+                    this.gtOptions = [{ id: -1, name: "全部" }];
+                    this.gtOptions = this.gtOptions.concat(res.data.list);
+                    // this.formdata.towerid = this.gtOptions[0].id;
+                    if (JSON.stringify(this.$route.query) === "{}") {
+                        this.formdata.towerid = this.gtOptions[0].id;
+                    } else {
+                        this.formdata.towerid = Number(this.$route.query.towerId);
+                    }
+
+                    this.getSearchzz();
+                })
+                .catch((err) => { });
+        },
+        //获取装置数据
+        getSearchzz() {
+            getSearchInfo({ type: 4, id: this.formdata.towerid })
+                .then((res) => {
+                    this.zzOptions = [{ id: -1, name: "全部" }];
+                    this.zzOptions = this.zzOptions.concat(res.data.list);
+                    // this.formdata.termid = this.zzOptions[0].id;
+                    console.log("切换了杆塔");
+                    // console.log(this.formdata.termid);
+                    // console.log(this.zzOptions[0].id);
+                    // this.formdata.termid = this.zzOptions[0].id;
+                    // console.log(this.formdata.termid);
+                    if (JSON.stringify(this.$route.query) === "{}") {
+                        this.formdata.termid = this.zzOptions[0].id;
+                    } else {
+                        this.formdata.termid = Number(this.$route.query.termId);
+                    }
+
+                    this.getSearchtd();
+                })
+                .catch((err) => { });
+        },
+        //获取通道数据
+        getSearchtd() {
+            getSearchInfo({ type: 5, id: this.formdata.termid })
+                .then((res) => {
+                    this.tdOptions = [{ id: -1, name: "全部", alias: null }];
+                    this.tdOptions = this.tdOptions.concat(res.data.list);
+
+                    if (JSON.stringify(this.$route.query) === "{}") {
+                        this.formdata.channelid = this.tdOptions[0].id;
+                    } else {
+                        this.formdata.channelid = Number(this.$route.query.channelId);
+                    }
+
+                    //this.getPicData();
+                })
+                .catch((err) => { });
+        },
+        getSearchtdAlone() {
+            getSearchInfo({ type: 5, id: this.tdTermid })
+                .then((res) => {
+                    this.tdOptions = [{ id: -1, name: "全部", alias: null }];
+                    this.tdOptions = this.tdOptions.concat(res.data.list);
+                })
+                .catch((err) => { });
+        },
+        //获取图片列表
+        getPicData() {
+            this.loading = true;
+            this.$set(this.formdata, "pageindex", this.page);
+            this.$set(this.formdata, "pagesize", this.pageSize);
+            // console.log(this.formdata);
+            getStatisticalReport(this.formdata).then((res) => {
+                this.picList = [];
+                //presetList
+                let dataList = res.data;
+                dataList.forEach(a => {
+                    var presetList = [];
+                    a.channels.forEach(b => {
+                        b.presets.forEach(c => {
+                            c.channelId = b.channelId;
+                            presetList.push(c);
+                        });
+                    });
+                    a.presetList = presetList;
+                });
+                this.picList = dataList;
+                this.loading = false;
+                // console.log(res.data);
+            }).catch((err) => {
+                this.loading = false;
+                console.log(err);
+            });
+        },
+        //查询
+        onSubmit() {
+            if (this.formdata.starttime > this.formdata.endtime) {
+                return this.$message({
+                    duration: 1500,
+                    showClose: true,
+                    message: "开始日期不能大于结束日期",
+                    type: "warning",
+                });
+            }
+            this.page = 1;
+            this.getPicData();
+        },
+
+        //点击分页
+        handleCurrentChange(val) {
+            this.page = val;
+            //this.picList = [];
+            this.getPicData();
+        },
+        //每页条数
+        handleSizeChange(val) {
+            this.pageSize = val;
+            this.getPicData();
+        },
+        deletePic(val) {
+            console.log(val);
+            let deleteArr = [];
+            deleteArr.push(val.picid);
+            console.log(deleteArr);
+            deletePicList({ list: deleteArr })
+                .then((res) => {
+                    console.log(res);
+                    this.$confirm("此操作将永久删除该图片, 是否继续?", "提示", {
+                        confirmButtonText: "确定",
+                        cancelButtonText: "取消",
+                        type: "warning",
+                    })
+                        .then(() => {
+                            this.$message({
+                                type: "success",
+                                showClose: true,
+                                message: "删除成功!",
+                            });
+                            this.getPicData();
+                        })
+                        .catch(() => {
+                            this.$message({
+                                type: "info",
+                                showClose: true,
+                                message: "已取消删除",
+                            });
+                        });
+                })
+                .catch((err) => { });
+        },
+    },
+};
+</script>
+<style lang="less">
+.statisticalReport {
+    width: calc(100% - 24px);
+    height: calc(100% - 24px);
+    padding: 12px 12px;
+    background: #fff;
+
+    .deviceTable {
+        height: calc(100% - 94px);
+        //background: #fcc;
+    }
+
+    .searchMain {
+        border: 1px solid #dddddd;
+        height: calc(100% - 22px);
+        padding: 12px;
+        border-radius: 4px;
+
+        .ml10 {
+            margin-left: 10px;
+        }
+    }
+
+    .pictureBox {
+        // display: flex;
+        // // justify-content: space-around;
+        // flex-wrap: wrap;
+        height: calc(100% - 135px);
+        // max-height: calc(100% - 135px);
+
+        border: 1px solid #eee;
+
+        .picShowBox {
+            height: 100%;
+            overflow: auto;
+        }
+
+        .imgList {
+            width: calc((100% - 104px) / 4);
+            position: relative;
+            display: inline-block;
+            margin: 8px;
+            position: relative;
+            padding: 4px;
+            border-radius: 3px;
+            background: #fff;
+            height: 200px;
+
+            .el-card__body {
+                padding: 0px;
+                height: 100%;
+            }
+
+            .bigpic {
+                width: 100%;
+                height: 100%;
+                //background-size: 100% 100%;
+                position: relative;
+
+                .el-image {
+                    width: 100%;
+                    height: 100%;
+
+                    .el-image__placeholder {
+                        background: url(../../assets/img/nopicbg.png) no-repeat center;
+                        background-size: 20% 20%;
+                    }
+
+                    img {
+                        cursor: pointer;
+                        width: 100%;
+                        height: 200px;
+                    }
+                }
+
+                &:hover {
+                    .deleteBox {
+                        display: block;
+                    }
+                }
+            }
+
+            .caption {
+                position: absolute;
+                bottom: 0px;
+                background: #169e8ca1;
+                width: calc(100% - 8px);
+                padding: 4px;
+                color: #333;
+
+                .infoTop {
+                    font-size: 16px;
+                    color: #fff;
+                    font-weight: normal;
+                    margin-top: 2px;
+                    padding-left: 5px;
+                    padding-right: 5px;
+                }
+
+                .infoBottom {
+                    color: #fff;
+                    font-size: 12px;
+                    font-weight: normal;
+                    margin-top: 6px;
+                    padding-left: 5px;
+                    padding-right: 5px;
+                }
+            }
+
+            .deleteBox {
+                position: absolute;
+                right: 4px;
+                top: 4px;
+                z-index: 2;
+                display: none;
+
+                .el-button {
+                    width: auto;
+                    background: rgba(0, 0, 0, 0.5);
+                    border: 1px solid transparent;
+                    color: #fff;
+                    font-size: 16px;
+                    padding: 3px;
+                }
+
+                &:hover {
+                    .el-button {
+                        background: #f56c6c;
+                        //color: #f56c6c;
+                    }
+                }
+            }
+        }
+
+        .el-loading-mask {
+            background-color: rgba(255, 255, 255, 0.4);
+        }
+
+        .noPicBox {
+            display: flex;
+            width: 100%;
+            height: calc(100% - 86px);
+            overflow: auto;
+
+            .el-empty {
+                margin: auto;
+            }
+        }
+    }
+}
+</style>
\ No newline at end of file