From 8b739ce9e80fce73da0f36408aaeec85318b806b Mon Sep 17 00:00:00 2001
From: zhizhijie <zhizhijie@users.noreply.gitee.com>
Date: 星期二, 22 九月 2026 17:31:09 +0800
Subject: [PATCH] docs(交接): 统一 09-22 关机快照(合并同事版本,修正运行状态为实测:8090/8080 在运行)

---
 traffic-audit-web/src/views/DataView.vue |  105 ++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 100 insertions(+), 5 deletions(-)

diff --git a/traffic-audit-web/src/views/DataView.vue b/traffic-audit-web/src/views/DataView.vue
index cdf1f2f..d72dc3a 100644
--- a/traffic-audit-web/src/views/DataView.vue
+++ b/traffic-audit-web/src/views/DataView.vue
@@ -17,8 +17,10 @@
       <el-main>
         <h3>瀵煎叆鏁版嵁鏌ョ湅</h3>
         <div class="toolbar">
-          <span class="toolbar-label">鎶ヨ〃鏈�</span>
-          <el-date-picker v-model="period" type="month" placeholder="鎶ヨ〃鏈燂紙鍏ㄩ儴锛�" value-format="yyyy-MM" clearable style="width:150px" @change="doQuery"></el-date-picker>
+          <template v-if="!isRollup">
+            <span class="toolbar-label">鎶ヨ〃鏈�</span>
+            <el-date-picker v-model="period" type="month" placeholder="鎶ヨ〃鏈燂紙鍏ㄩ儴锛�" value-format="yyyy-MM" clearable style="width:150px" @change="doQuery"></el-date-picker>
+          </template>
           <span class="toolbar-sep"></span>
           <span class="toolbar-label">鏁版嵁绫诲瀷</span>
           <el-select v-model="type" size="small" style="width:300px" placeholder="閫夋嫨鏁版嵁绫诲瀷" filterable
@@ -27,6 +29,26 @@
               <el-option v-for="t in g.types" :key="t.value" :label="t.label" :value="t.value"></el-option>
             </el-option-group>
           </el-select>
+          <template v-if="canRollup">
+            <span class="toolbar-label">瑙嗗浘</span>
+            <el-radio-group v-model="viewMode" size="small" @change="onViewChange">
+              <el-radio-button label="detail">鏄庣粏</el-radio-button>
+              <el-radio-button label="rollup">鎸夊競宸炴眹鎬�</el-radio-button>
+            </el-radio-group>
+          </template>
+          <template v-if="isRollup">
+            <span class="toolbar-label">璧锋鏈�</span>
+            <el-date-picker v-model="from" type="month" placeholder="璧峰鏈�" value-format="yyyy-MM" style="width:130px"></el-date-picker>
+            <span>~</span>
+            <el-date-picker v-model="to" type="month" placeholder="缁撴潫鏈�" value-format="yyyy-MM" style="width:130px"></el-date-picker>
+            <span class="toolbar-label">鎺掑悕</span>
+            <el-select v-model="rankMode" size="small" style="width:150px">
+              <el-option label="鐣欑┖" value="blank"></el-option>
+              <el-option label="鎸夌疮璁″�奸噸鎺�" value="recompute"></el-option>
+            </el-select>
+            <el-button type="primary" size="small" @click="loadSummary">姹囨��</el-button>
+            <el-button type="success" size="small" icon="el-icon-download" @click="exportSummary">瀵煎嚭 Excel</el-button>
+          </template>
           <template v-if="hasPeriodType">
             <span class="toolbar-label">鍙e緞</span>
             <el-select v-model="periodType" size="small" style="width:110px" @change="doQuery">
@@ -35,11 +57,13 @@
               <el-option label="绱" value="CUMULATIVE"></el-option>
             </el-select>
           </template>
-          <el-input v-model="keyword" placeholder="浼佷笟/甯傚窞鍚嶇О" clearable style="width:180px" @keyup.enter.native="doQuery"></el-input>
-          <el-button type="primary" size="small" @click="doQuery">鏌ヨ</el-button>
+          <template v-if="!isRollup">
+            <el-input v-model="keyword" placeholder="浼佷笟/甯傚窞鍚嶇О" clearable style="width:180px" @keyup.enter.native="doQuery"></el-input>
+            <el-button type="primary" size="small" @click="doQuery">鏌ヨ</el-button>
+          </template>
           <el-button size="small" icon="el-icon-full-screen" @click="toggleFullscreen">鍏ㄥ睆鏌ョ湅</el-button>
         </div>
-        <div class="load-hint">鍏� {{ total }} 鏉¤褰曪紝宸插姞杞� {{ records.length }} 鏉�</div>
+        <div class="load-hint">鍏� {{ total }} 鏉¤褰曪紝宸插姞杞� {{ records.length }} 鏉�<span v-if="isRollup && summaryHint" class="rollup-hint">銆�|銆�{{ summaryHint }}</span></div>
         <div class="table-wrap" ref="tableWrap">
           <div class="table-area">
             <el-table :data="records" border v-loading="loading" size="small" style="width:100%" height="100%">
@@ -108,6 +132,12 @@
       type: 'h2032',
       period: '',
       periodType: '',
+      viewMode: 'detail',
+      rollupTypes: [],
+      from: '',
+      to: '',
+      rankMode: 'blank',
+      summaryHint: '',
       keyword: '',
       page: 1,
       size: 50,
@@ -119,6 +149,12 @@
     }
   },
   computed: {
+    canRollup() {
+      return (this.rollupTypes || []).some(t => t.type === this.type)
+    },
+    isRollup() {
+      return this.viewMode === 'rollup' && this.canRollup
+    },
     // 瑙勪笂瑙勪笅鎷嗗垎绛夎〃鏈�"鍙e緞"鍒楋紙褰撴湀/绱锛夛紝鎶婂畠鍋氭垚涓婃柟绛涢�夎�屼笉鏄〃鏍煎垪
     hasPeriodType() {
       return (this.columns || []).some(c => c.prop === 'periodType')
@@ -168,10 +204,67 @@
       }
       this.doQuery()
     },
+    loadRollupTypes() {
+      api.get('/data/rollupTypes').then(res => {
+        // 鎷︽埅鍣ㄥ凡杩斿洖鍝嶅簲浣擄紝鏁� res.data 鍗崇被鍨嬫暟缁�
+        this.rollupTypes = (res && res.data) || []
+      }).catch(() => { this.rollupTypes = [] })
+    },
+    onViewChange() {
+      this.records = []
+      this.total = 0
+      if (this.isRollup) {
+        if (!this.to) this.to = this.period || this.defaultMonth()
+        if (!this.from) this.from = this.to.substring(0, 4) + '-01'
+        this.loadSummary()
+      } else {
+        this.summaryHint = ''
+        this.doQuery()
+      }
+    },
+    defaultMonth() {
+      const now = new Date()
+      return now.getFullYear() + '-' + ('0' + (now.getMonth() + 1)).slice(-2)
+    },
+    loadSummary() {
+      if (!this.from || !this.to) { this.$message.warning('璇峰厛閫夋嫨璧锋鏈�'); return }
+      this.loading = true
+      api.get('/data/summary', { params: { type: this.type, from: this.from, to: this.to, rankMode: this.rankMode }, timeout: 120000 })
+        .then(res => {
+          const d = res.data || {}
+          this.columns = d.columns || []
+          this.records = d.records || []
+          this.total = this.records.length
+          this.summaryHint = (d.label || '') + '銆�' + d.from + ' ~ ' + d.to + ' 绱锛涘悓姣斿熀鏁� ' + d.lastFrom + ' ~ ' + d.lastTo
+            + '锛涙帓鍚嶅彛寰勶細' + (d.rankMode === 'recompute' ? '鎸夌疮璁″�奸噸鎺�' : '鐣欑┖')
+        })
+        .catch(e => { if (!e || !e._toast) this.$message.error('姹囨�绘煡璇㈠け璐�') })
+        .finally(() => { this.loading = false })
+    },
+    exportSummary() {
+      if (!this.from || !this.to) { this.$message.warning('璇峰厛閫夋嫨璧锋鏈�'); return }
+      api.get('/data/export', {
+        params: { type: this.type, from: this.from, to: this.to, rankMode: this.rankMode },
+        responseType: 'blob', timeout: 180000
+      }).then(res => {
+        const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
+        const url = window.URL.createObjectURL(blob)
+        const a = document.createElement('a')
+        a.href = url
+        a.download = '鎸夊競宸炴眹鎬籣' + this.type + '_' + this.from + '_' + this.to + '.xlsx'
+        document.body.appendChild(a)
+        a.click()
+        document.body.removeChild(a)
+        window.URL.revokeObjectURL(url)
+        this.$message.success('姹囨�昏〃宸插鍑�')
+      }).catch(() => this.$message.error('瀵煎嚭澶辫触'))
+    },
     onTypeSelect() {
       const g = this.modules.find(x => x.types.some(t => t.value === this.type))
       if (g) this.activeModule = g.key
       this.periodType = ''
+      this.viewMode = 'detail'
+      this.summaryHint = ''
       this.doQuery()
     },
     doQuery() {
@@ -303,6 +396,7 @@
     if (q.type) this.type = q.type
     if (q.period) this.period = q.period
     if (q.keyword) this.keyword = q.keyword
+    this.loadRollupTypes()
     this.loadData()
     window.addEventListener('scroll', this.onScroll, { passive: true })
     if (this.$refs.tableWrap) {
@@ -330,6 +424,7 @@
 #app .toolbar-label { color:#606266; font-weight:600; white-space:nowrap; }
 #app .toolbar-sep { width:1px; height:22px; background:#DCDFE6; margin:0 2px; }
 #app .load-hint { color:#909399; font-size:12px; margin-bottom:6px; }
+#app .rollup-hint { color:#409EFF; }
 #app .table-wrap { display:flex; flex-direction:column; height:calc(100vh - 250px); min-height:300px; }
 #app .table-area { flex:1 1 auto; min-height:0; overflow:hidden; }
 #app .table-area .el-table { width:100%; height:100%; }

--
Gitblit v1.9.1