feat(数据查看): 隐藏报表期/所属地区+冻结收窄为市州与企业名称、网约车按市州竖排、市州月报显示项目名称、列名补单位、数值千分位与同比按百分比显示

zhizhijie

9 天以前 4e8766d35771bc71c858583b768600a2169a46c0

 traffic-audit-web/src/views/AuditResult.vue

@@ -50,13 +50,29 @@
          <div class="sev-card sev-pending"><b>{{ severityStats.pending }}</b> 待处理</div>
          <div class="sev-card sev-done"><b>{{ severityStats.done }}</b> 已处理</div>
        </div>
        <el-form v-if="!focusMode" :inline="true" style="margin-top:8px;flex:none">
        <div v-if="!focusMode" class="audit-filter-bar">
        <el-form :inline="true">
          <el-form-item label="筛选"></el-form-item>
          <el-form-item label="企业名称">
            <el-input v-model="enterpriseFilter" placeholder="输入企业名称关键字" clearable style="width:200px" @keyup.enter.native="queryResults"></el-input>
          </el-form-item>
          <el-form-item label="审核规则">
            <el-select v-model="ruleFilter" placeholder="全部规则" clearable style="width:180px">
              <el-option v-for="rn in ruleOptions" :key="rn" :label="rn" :value="rn"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="问题范围">
            <el-radio-group v-model="issueScope" size="small" @change="updateBatchSelection">
              <el-radio-button label="verify">仅需核实</el-radio-button>
              <el-radio-button label="all">含提醒型</el-radio-button>
            </el-radio-group>
            <span class="hint">提醒型仅提示变化、不需处理，导出默认不含</span>
          </el-form-item>
          <el-form-item label="状态">
            <el-select v-model="statusScope" style="width:110px" @change="updateBatchSelection">
              <el-option label="全部" value="all"></el-option>
              <el-option label="待处理" value="pending"></el-option>
              <el-option label="已处理" value="handled"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="视图">
@@ -74,9 +90,11 @@
            <el-button size="small" plain @click="statsCollapsed = !statsCollapsed">{{ statsCollapsed ? '展开' : '收起' }}规则统计</el-button>
          </el-form-item>
          <el-form-item>
            <span style="color:#909399;font-size:12px">共 {{ results.length }} 条问题，{{ mergedResults.length }} 家企业</span>
            <span style="color:#303133;font-size:13px;font-weight:600">当前筛选 {{ filteredResults.length }} 条 / {{ mergedResults.length }} 家企业</span>
            <span style="color:#909399;font-size:12px;margin-left:8px">（共 {{ results.length }} 条问题）</span>
          </el-form-item>
        </el-form>
        </div>
        <div v-if="ruleStats.length && !statsCollapsed && !focusMode" class="rule-stats" style="flex:none">
          <div class="stats-cards">
            <div v-for="rs in sortedRuleStats" :key="rs.ruleId" class="stat-card"
@@ -98,45 +116,52 @@
          共 {{ results.length }} 条问题，{{ mergedResults.length }} 家企业
        </div>
        <div class="table-area" style="flex:1;min-height:0">
        <!-- 明细视图：一条问题一张卡片 -->
        <!-- 明细视图：一条问题一行（与导出模板 Sheet“审核结果”同款） -->
        <div v-if="viewMode === 'detail'" class="detail-cards-wrap" v-loading="loading">
          <div class="detail-toolbar">
            <el-checkbox :value="allSelected" :indeterminate="someSelected" @change="toggleSelectAll">全选当前 {{ filteredResults.length }} 条</el-checkbox>
            <span class="toolbar-tip">勾选后可批量确认 / 忽略</span>
          </div>
          <div v-for="row in filteredResults" :key="row.id" class="detail-card"
               :class="{ 'card-red': row.alertLevel === 'RED', 'card-yellow': row.alertLevel === 'YELLOW', 'card-done': row.status !== 'PENDING' }">
            <div class="card-head">
              <el-checkbox v-model="row._selected" @change="updateBatchSelection"></el-checkbox>
              <div class="card-ent">
                <div class="ent-name">{{ row.enterpriseName || row.city || '未知企业' }}</div>
                <div class="ent-sub">{{ row.reportPeriod }}</div>
              </div>
              <el-tag :type="row.alertLevel === 'RED' ? 'danger' : 'warning'" size="small" effect="dark">{{ row.alertLevel }}</el-tag>
              <el-tag :type="statusType(row.status)" size="small" effect="plain" class="status-tag">
                <i :class="statusIcon(row.status)"></i> {{ statusText(row.status) }}
              </el-tag>
              <span class="spacer"></span>
              <el-link v-if="dataType(reportType)" type="primary" :underline="false" size="mini" @click="openMonthReport(row)">数据</el-link>
              <el-button v-if="row.status === 'PENDING'" size="mini" type="success" icon="el-icon-check" round @click="review(row, 'CONFIRMED')">确认</el-button>
              <el-button v-if="row.status === 'PENDING'" size="mini" type="info" icon="el-icon-close" round plain @click="review(row, 'IGNORED')">忽略</el-button>
              <span v-else class="done-text">已处理</span>
          <el-table :data="filteredResults" border stripe height="100%"
            :header-cell-style="{ background: '#F5F7FA', color: '#303133', fontWeight: 600 }">
            <el-table-column width="40">
              <template slot-scope="{ row }">
                <el-checkbox v-model="row._selected" @change="updateBatchSelection"></el-checkbox>
              </template>
            </el-table-column>
            <el-table-column prop="reportPeriod" label="报表期" width="90"></el-table-column>
            <el-table-column label="企业/市州" min-width="200" show-overflow-tooltip>
              <template slot-scope="{ row }">{{ row.enterpriseName || row.city || '未知企业' }}</template>
            </el-table-column>
            <el-table-column prop="ruleCode" label="规则编码" width="100"></el-table-column>
            <el-table-column prop="ruleName" label="审核规则" min-width="150" show-overflow-tooltip></el-table-column>
            <el-table-column label="等级" width="76">
              <template slot-scope="{ row }">
                <el-tag :type="row.alertLevel === 'RED' ? 'danger' : 'warning'" size="mini">{{ row.alertLevel }}</el-tag>
              </template>
            </el-table-column>
            <el-table-column prop="actualValue" label="实际值" min-width="230" show-overflow-tooltip></el-table-column>
            <el-table-column prop="thresholdValue" label="阈值/基准" min-width="140" show-overflow-tooltip></el-table-column>
            <el-table-column prop="deviation" label="偏差说明" min-width="170" show-overflow-tooltip></el-table-column>
            <el-table-column label="状态" width="92">
              <template slot-scope="{ row }">
                <el-tag :type="statusType(row.status)" size="mini">
                  <i :class="statusIcon(row.status)"></i> {{ statusText(row.status) }}
                </el-tag>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="185" align="right">
              <template slot-scope="{ row }">
                <el-link v-if="dataType(reportType)" type="primary" :underline="false" size="mini" @click="openMonthReport(row)">数据</el-link>
                <el-button v-if="row.status === 'PENDING'" size="mini" type="success" icon="el-icon-check" round @click="review(row, 'CONFIRMED')">确认</el-button>
                <el-button v-if="row.status === 'PENDING'" size="mini" type="info" icon="el-icon-close" round plain @click="review(row, 'IGNORED')">忽略</el-button>
                <span v-else class="done-text">已处理</span>
              </template>
            </el-table-column>
            <div slot="empty">
              <el-empty description="当前筛选条件下没有问题数据"></el-empty>
            </div>
            <div class="card-body">
              <div class="rule-title">
                <b>{{ row.ruleName }}</b>
                <span class="rule-code">{{ row.ruleCode }}</span>
              </div>
              <div class="card-details">
                <div class="detail-line"><span class="dt-label">实际</span><span class="dt-val">{{ row.actualValue }}</span></div>
                <div class="detail-line"><span class="dt-label">基准</span><span class="dt-val">{{ row.thresholdValue }}</span></div>
                <div class="detail-line"><span class="dt-label">差异</span><span class="dt-val dt-warn">{{ row.deviation }}</span></div>
              </div>
            </div>
          </div>
          <div v-if="!filteredResults.length" class="empty-tip">
            <el-empty description="当前筛选条件下没有问题数据"></el-empty>
          </div>
          </el-table>
        </div>
        <!-- 合并视图 -->
        <el-table v-else :data="mergedResults" border stripe v-loading="loading" height="100%"
@@ -334,7 +359,7 @@
  data() {
    return {
      period: '', reportType: 'H2032', loading: false, marking: false, results: [], ruleStats: [], statsCollapsed: false,
      enterpriseFilter: '', ruleFilter: '', viewMode: 'merged', batchSelection: [], focusMode: false,
      enterpriseFilter: '', ruleFilter: '', viewMode: 'merged', issueScope: 'verify', statusScope: 'all', batchSelection: [], focusMode: false,
      explainDrafts: {}, savingExplainId: null, expandedExplain: null,
      monthVisible: false, monthLoading: false, monthType: '', monthPeriod: '', monthKeyword: '', monthRecords: [], monthColumns: []
    }
@@ -347,7 +372,7 @@
    },
    severityStats() {
      const s = { red: 0, yellow: 0, pending: 0, done: 0 }
      this.results.forEach(r => {
      this.filteredResults.forEach(r => {
        if (r.alertLevel === 'RED') s.red++
        else if (r.alertLevel === 'YELLOW') s.yellow++
        if (r.status === 'PENDING') s.pending++
@@ -367,10 +392,14 @@
    filteredResults() {
      const kw = (this.enterpriseFilter || '').trim()
      const rule = this.ruleFilter
      if (!kw && !rule) return this.results
      const scope = this.issueScope || 'verify'
      const st = this.statusScope || 'all'
      return this.results.filter(r => {
        if (kw && !(r.enterpriseName || '').includes(kw)) return false
        if (rule && r.ruleName !== rule) return false
        if (scope === 'verify' && this.isReminderRow(r)) return false
        if (st === 'pending' && r.status !== 'PENDING') return false
        if (st === 'handled' && (!r.status || r.status === 'PENDING')) return false
        return true
      })
    },
@@ -397,6 +426,9 @@
    }
  },
  methods: {
    isReminderRow(r) {
      return !!(r && r.ruleCode === 'RULE_004')
    },
    dataType(t) { return DATA_TYPE_MAP[t] || '' },
    explainType(t) { return EXPLAIN_TYPES.indexOf(t) >= 0 },
    openMonthReport(row) {
@@ -577,7 +609,26 @@
    },
    exportExcel() {
      if (!this.period) { this.$message.warning('请选择报表期'); return }
      window.open('/api/audit/export?period=' + this.period + '&reportType=' + this.reportType)
      const params = {
        period: this.period,
        reportType: this.reportType,
        onlyVerify: this.issueScope !== 'all',
        status: this.statusScope || 'all'
      }
      api.get('/audit/export', { params, responseType: 'blob' })
        .then(res => this.downloadBlob(res, '审核结果_' + this.period + '.xlsx'))
        .catch(() => this.$message.error('导出失败：请确认该报表期已有审核结果'))
    },
    downloadBlob(res, fileName) {
      const blob = res instanceof Blob ? res : 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 = fileName
      document.body.appendChild(a)
      a.click()
      window.URL.revokeObjectURL(url)
      document.body.removeChild(a)
    },
    review(row, status) {
      if (status === 'IGNORED') {
@@ -741,4 +792,9 @@
.mr-sec-tab th { background: #F5F7FA; font-weight: 600; }
.mr-note { margin: 6px 12px 12px; background: #FDF6EC; border: 1px solid #FAECD8; border-radius: 4px; padding: 8px 10px; font-size: 12px; color: #8a6d3b; white-space: pre-wrap; word-break: break-all; }
.mr-note-line { margin: 2px 0; }

.audit-filter-bar { background:#FAFAFA; border:1px solid #EBEEF5; border-radius:8px; padding:2px 12px 0; margin-top:8px; flex:none; }
.audit-filter-bar .el-form-item { margin-bottom:6px; }
.audit-filter-bar .el-form-item__label { color:#606266; font-weight:600; }
.hint { color:#909399; font-size:12px; margin-left:6px; white-space:nowrap; }
</style>