Merge branch 'main' of http://49.232.154.205:10100/liujingchao/fad_oa

ruoyi-ui/src/api/hrm/myApply.js

@@ -0,0 +1,9 @@
+import request from '@/utils/request'
+
+export function listMyApply(query) {
+  return request({
+    url: '/hrm/my-apply/list',
+    method: 'get',
+    params: query
+  })
+}

ruoyi-ui/src/api/oa/projectCompare.js

@@ -0,0 +1,18 @@
+import request from '@/utils/request'
+
+export function listTravelCompare (start, end, nickName, workPlace, pageNum, pageSize) {
+  return request({
+    url: '/oa/projectReport/travel-compare',
+    method: 'get',
+    params: {
+      ...(start ? { start } : {}),
+      ...(end ? { end } : {}),
+      ...(nickName ? { nickName } : {}),
+      ...(workPlace ? { workPlace } : {}),
+      pageNum,
+      pageSize,
+      orderByColumn: 'compareDate',
+      isAsc: 'desc'
+    }
+  })
+}

ruoyi-ui/src/views/hrm/myApply.vue

@@ -0,0 +1,323 @@
+<template>
+  <div class="my-apply-page">
+    <section class="stats-strip">
+      <el-card shadow="never" class="stat-card">
+        <div class="stat-label">总申请</div>
+        <div class="stat-value">{{ summary.total }}</div>
+      </el-card>
+      <el-card shadow="never" class="stat-card">
+        <div class="stat-label">审批中</div>
+        <div class="stat-value warning">{{ summary.running }}</div>
+      </el-card>
+      <el-card shadow="never" class="stat-card">
+        <div class="stat-label">已通过</div>
+        <div class="stat-value success">{{ summary.approved }}</div>
+      </el-card>
+    </section>
+
+    <section class="filters">
+      <el-card shadow="never" class="filter-card">
+        <div class="filter-row">
+          <el-select v-model="query.bizType" placeholder="申请类型" clearable size="small" style="width: 130px" @change="handleFilterChange">
+            <el-option label="全部" value="" />
+            <el-option label="请假" value="leave" />
+            <el-option label="出差" value="travel" />
+            <el-option label="用印" value="seal" />
+            <el-option label="报销" value="reimburse" />
+            <el-option label="拨款" value="appropriation" />
+          </el-select>
+          <el-select v-model="query.status" placeholder="状态" clearable size="small" style="width: 130px" @change="handleFilterChange">
+            <el-option label="全部" value="" />
+            <el-option label="草稿" value="draft" />
+            <el-option label="审批中" value="running" />
+            <el-option label="已通过" value="approved" />
+            <el-option label="已驳回" value="rejected" />
+            <el-option label="已撤销" value="revoked" />
+          </el-select>
+          <el-input v-model="query.keyword" placeholder="输入申请标题/备注关键词" size="small" clearable style="width: 260px" @keyup.enter.native="handleFilterChange" />
+          <el-button type="primary" size="small" icon="el-icon-search" @click="handleFilterChange">查询</el-button>
+          <el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+        </div>
+      </el-card>
+    </section>
+
+    <section class="content">
+      <el-card shadow="never" class="table-card">
+        <div slot="header" class="card-header">
+          <span>申请列表</span>
+          <el-button size="mini" icon="el-icon-refresh" @click="loadList">刷新</el-button>
+        </div>
+
+        <el-table :data="list" v-loading="loading" stripe @row-dblclick="goDetail" empty-text="暂无申请记录">
+          <el-table-column label="申请类型" min-width="100">
+            <template slot-scope="scope">
+              <el-tag :type="getTypeTagType(scope.row.bizType)">{{ getTypeText(scope.row.bizType) }}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="申请名称" min-width="240" show-overflow-tooltip>
+            <template slot-scope="scope">
+              {{ getRowTitle(scope.row) }}
+            </template>
+          </el-table-column>
+          <el-table-column label="发起人" min-width="140" show-overflow-tooltip>
+            <template slot-scope="scope">
+              {{ scope.row.nickName || '-' }}
+            </template>
+          </el-table-column>
+          <el-table-column label="状态" min-width="110">
+            <template slot-scope="scope">
+              <el-tag :type="statusType(scope.row)" size="small">{{ statusText(scope.row) }}</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="发起时间" prop="createTime" min-width="160">
+            <template slot-scope="scope">{{ formatDate(scope.row.createTime) }}</template>
+          </el-table-column>
+          <el-table-column label="操作" min-width="180" fixed="right">
+            <template slot-scope="scope">
+              <el-button type="text" size="mini" @click="goDetail(scope.row)">详情</el-button>
+              <el-button
+                v-if="showEarlyEndButton(scope.row)"
+                type="text"
+                size="mini"
+                style="color: #e6a23c"
+                :loading="earlyEndLoadingId === scope.row.bizId"
+                @click.stop="handleEarlyEnd(scope.row)"
+              >
+                提前结束
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <div class="pagination-wrapper">
+          <el-pagination
+            :current-page="query.pageNum"
+            :page-size="query.pageSize"
+            :page-sizes="[10, 20, 50, 100]"
+            :total="total"
+            layout="total, sizes, prev, pager, next, jumper"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          />
+        </div>
+      </el-card>
+    </section>
+  </div>
+</template>
+
+<script>
+import { listMyApply } from '@/api/hrm/myApply'
+import { earlyEndTravel } from '@/api/hrm/travel'
+import applyTypeMinix from '@/views/hrm/minix/applyTypeMinix.js'
+
+export default {
+  name: 'HrmMyApply',
+  mixins: [applyTypeMinix],
+  data () {
+    return {
+      loading: false,
+      earlyEndLoadingId: null,
+      list: [],
+      total: 0,
+      summary: {
+        total: 0,
+        running: 0,
+        approved: 0
+      },
+      query: {
+        pageNum: 1,
+        pageSize: 50,
+        bizType: '',
+        status: '',
+        keyword: ''
+      }
+    }
+  },
+  created () {
+    this.loadList()
+  },
+  methods: {
+    getRowTitle (row) {
+      return row.title || row.remark || '-'
+    },
+    isTravelCompleted (row) {
+      if (!row || row.bizType !== 'travel') return false
+      const endTime = row.endTime ? new Date(row.endTime).getTime() : 0
+      const now = Date.now()
+      return Boolean(row.actualEndTime) || (endTime && endTime <= now)
+    },
+    showEarlyEndButton (row) {
+      if (!row || row.bizType !== 'travel') return false
+      if (row.actualEndTime) return false
+      const endTime = row.endTime ? new Date(row.endTime).getTime() : 0
+      return row.status === 'approved' && endTime > Date.now()
+    },
+    statusText (row) {
+      const status = row?.status
+      if (row?.bizType === 'travel' && status === 'approved') {
+        return this.isTravelCompleted(row) ? '已完成' : '进行中'
+      }
+      const map = { draft: '草稿', running: '审批中', pending: '审批中', approved: '已通过', rejected: '已驳回', revoked: '已撤销', finished: '已完成' }
+      return map[status] || status || '-'
+    },
+    statusType (row) {
+      const status = row?.status
+      if (row?.bizType === 'travel' && status === 'approved') {
+        return this.isTravelCompleted(row) ? 'success' : 'warning'
+      }
+      const map = { draft: 'info', running: 'warning', pending: 'warning', approved: 'success', rejected: 'danger', revoked: 'danger', finished: 'success' }
+      return map[status] || 'info'
+    },
+    formatDate (val) {
+      if (!val) return ''
+      const d = new Date(val)
+      const p = n => (n < 10 ? `0${n}` : n)
+      return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`
+    },
+    handleFilterChange () {
+      this.query.pageNum = 1
+      this.loadList()
+    },
+    resetQuery () {
+      this.query = { pageNum: 1, pageSize: 10, bizType: '', status: '', keyword: '' }
+      this.loadList()
+    },
+    async loadList () {
+      this.loading = true
+      try {
+        const res = await listMyApply({
+          pageNum: this.query.pageNum,
+          pageSize: this.query.pageSize,
+          bizType: this.query.bizType || undefined,
+          status: this.query.status || undefined,
+          keyword: this.query.keyword || undefined
+        })
+        this.list = res.rows || []
+        this.total = res.total || 0
+        this.summary.total = res.total || 0
+        this.summary.running = (res.rows || []).filter(i => ['running', 'pending'].includes(i.status) || (i.bizType === 'travel' && i.status === 'approved' && !this.isTravelCompleted(i))).length
+        this.summary.approved = (res.rows || []).filter(i => i.status === 'approved' && !(i.bizType === 'travel' && !this.isTravelCompleted(i))).length
+      } catch (err) {
+        console.error('加载我的申请失败:', err)
+        this.$message.error('加载我的申请失败')
+        this.list = []
+        this.total = 0
+      } finally {
+        this.loading = false
+      }
+    },
+    handleSizeChange (val) {
+      this.query.pageSize = val
+      this.query.pageNum = 1
+      this.loadList()
+    },
+    handleCurrentChange (val) {
+      this.query.pageNum = val
+      this.loadList()
+    },
+    async handleEarlyEnd (row) {
+      this.$confirm('确认提前结束本次出差吗？结束后的实际时间将记录为当前时间。', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(async () => {
+        this.earlyEndLoadingId = row.bizId
+        try {
+          await earlyEndTravel(row.bizId)
+          this.$message.success('提前结束成功')
+          await this.loadList()
+        } catch (error) {
+          this.$message.error(error.message || '提前结束失败')
+        } finally {
+          this.earlyEndLoadingId = null
+        }
+      }).catch(() => {})
+    },
+    goDetail (row) {
+      if (!row) return
+      const routeMap = {
+        leave: '/hrm/HrmLeaveDetail',
+        travel: '/hrm/HrmTravelDetail',
+        seal: '/hrm/HrmSealDetail',
+        reimburse: '/hrm/HrmReimburseDetail',
+        appropriation: '/hrm/HrmAppropriationDetail'
+      }
+      const path = routeMap[row.bizType]
+      if (!path) {
+        this.$message.warning('暂不支持该申请类型的详情页')
+        return
+      }
+      this.$router.push({ path, query: { bizId: row.bizId } })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.my-apply-page {
+  padding: 16px 20px 32px;
+  background: #f8f9fb;
+}
+
+.stats-strip {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 12px;
+  margin-bottom: 16px;
+}
+
+.stat-card {
+  border: 1px solid #e6e8ed;
+  border-radius: 10px;
+  background: #fff;
+  text-align: center;
+}
+
+.stat-label {
+  font-size: 12px;
+  color: #8a8f99;
+}
+
+.stat-value {
+  margin-top: 4px;
+  font-size: 22px;
+  font-weight: 800;
+  color: #2b2f36;
+}
+
+.warning { color: #e6a23c; }
+.success { color: #67c23a; }
+
+.filter-card,
+.table-card {
+  border: 1px solid #d7d9df;
+  border-radius: 10px;
+}
+
+.filter-row {
+  display: flex;
+  gap: 10px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-weight: 700;
+  color: #2b2f36;
+}
+
+.pagination-wrapper {
+  margin-top: 16px;
+  display: flex;
+  justify-content: flex-end;
+}
+
+@media (max-width: 1200px) {
+  .stats-strip {
+    grid-template-columns: 1fr;
+  }
+}
+</style>

ruoyi-ui/src/views/hrm/requests/travelDetail.vue

@@ -15,7 +15,6 @@
           </el-button>
           <span class="hint-text">提前结束将把当前时间记录为实际结束时间</span>
         </div>
-         <!-- ===== 新增：显示已提前结束的信息 ===== -->
         <div v-if="detail.actualEndTime" class="early-end-info">
           <el-alert
             type="info"
@@ -26,6 +25,16 @@
             </template>
           </el-alert>
         </div>
+        <div v-else-if="isTravelCompleted(detail)" class="early-end-info">
+          <el-alert
+            type="success"
+            :closable="false"
+            show-icon>
+            <template slot="default">
+              该出差已完成
+            </template>
+          </el-alert>
+        </div>
         <!-- 出差时间与行程 -->
         <div class="block-title">出差时间与行程</div>
         <el-card class="inner-card" shadow="never">
@@ -95,14 +104,19 @@ export default {
       const p = n => (n < 10 ? `0${n}` : n)
       return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`
     },
-    // 新增：处理提前结束
-     showEarlyEndButton(detail) {
+    isTravelCompleted (detail) {
+      if (!detail) return false
+      const endTime = detail.endTime ? new Date(detail.endTime).getTime() : 0
+      const now = Date.now()
+      return Boolean(detail.actualEndTime) || (endTime && endTime <= now)
+    },
+    showEarlyEndButton(detail) {
       if (!detail) return false
-      // 已经提前结束的不显示
       if (detail.actualEndTime) return false
-      // 只有已通过或进行中状态才显示
       const status = detail.status
-      return status === 'approved' || status === 'in_progress'
+      const endTime = detail.endTime ? new Date(detail.endTime).getTime() : 0
+      const now = Date.now()
+      return status === 'approved' && endTime > now
     },
 
      handleEarlyEnd() {
@@ -116,10 +130,8 @@ export default {
           const bizId = this.currentBizId
           await earlyEndTravel(bizId)
           this.$message.success('提前结束成功')
-          // 刷新页面
-          setTimeout(() => {
-            location.reload()
-          }, 1000)
+          this.$emit('refresh')
+          this.$forceUpdate()
         } catch (error) {
           this.$message.error(error.message || '提前结束失败')
         } finally {

ruoyi-ui/src/views/oa/project/dashboard2/index.vue

@@ -158,9 +158,47 @@
             </div>
           </div>
 
-          <!-- 下：进度板块 — Tab1 进度明细表（默认）；Tab2 原思维导图 + 图例 -->
+          <!-- 下：进度板块 — 与进度中心(step) 同款的简要信息条 + Tab -->
           <div class="panel schedule-panel">
-            <el-tabs v-model="scheduleViewTab" class="schedule-panel-tabs">
+            <div v-if="currentProjectId" class="schedule-board-summary schedule-board-summary--pace-like">
+              <el-row>
+                <div>
+                  <el-row>
+                    <el-col :span="12">
+                      <div style="font-size: small;">
+                        <span style="color:#d0d0d0 ">项目名：</span>
+                        <el-popover placement="bottom" trigger="hover" width="800">
+                          <template slot="reference">
+                            <span style="color: #409eff;">{{ projectDisplayName }}</span>
+                          </template>
+                          <ProjectInfo :info="projectDetail || {}" />
+                        </el-popover>
+                      </div>
+                    </el-col>
+                    <el-col :span="12">
+                      <div style="font-size: small;">
+                        <span style="color:#d0d0d0 ">项目负责人：</span>
+                        <span>{{ projectManagerName }}</span>
+                      </div>
+                    </el-col>
+                    <el-col :span="12">
+                      <div style="font-size: small;">
+                        <span style="color:#d0d0d0 ">当前进度：</span>
+                        <span>{{ dashboardScheduleSummary }}</span>
+                      </div>
+                    </el-col>
+                    <el-col :span="12">
+                      <div style="font-size: small;">
+                        <span style="color:#d0d0d0 ">项目状态：</span>
+                        <span v-if="projectIsTop" style="color: #ff4d4f;">重点关注</span>
+                        <span v-else>一般项目</span>
+                      </div>
+                    </el-col>
+                  </el-row>
+                </div>
+              </el-row>
+            </div>
+            <el-tabs v-model="scheduleViewTab" class="schedule-panel-tabs" @tab-click="onScheduleTabClick">
               <el-tab-pane label="进度明细" name="list">
                 <!-- 进度数据：表格自然撑开高度，由 .progress-table-scroll 单独承担纵向/横向滚动 -->
                 <div class="progress-table-pane" v-loading="xmindLoading">
@@ -206,6 +244,7 @@
                         <el-empty :image-size="80" description="暂无进度步骤数据"></el-empty>
                       </div>
                       <xmind
+                        ref="dashboardMindXmind"
                         v-else-if="scheduleViewTab === 'mind'"
                         :list="stepList"
                         height="100%"
@@ -243,10 +282,11 @@
 <script>
 import { mapState } from 'vuex'
 import Xmind from '@/views/oa/project/pace/components/xmind.vue'
+import ProjectInfo from '@/components/fad-service/ProjectInfo/index.vue'
 
 export default {
   name: 'OaProjectDashboard2',
-  components: { Xmind },
+  components: { Xmind, ProjectInfo },
   dicts: ['sys_work_type', 'sys_sort_grade'],
   data () {
     return {
@@ -265,8 +305,31 @@ export default {
       'projectTotal',
       'taskQuery',
       'taskList',
-      'stepList'
+      'stepList',
+      'projectDetail'
     ]),
+    projectDisplayName () {
+      const p = this.projectDetail
+      return (p && p.projectName) ? String(p.projectName) : ''
+    },
+    projectManagerName () {
+      const p = this.projectDetail
+      return (p && p.functionary) ? String(p.functionary) : ''
+    },
+    projectIsTop () {
+      const p = this.projectDetail
+      if (!p) return false
+      const top = p.isTop
+      return top === true || top === 1 || top === '1'
+    },
+    /** 与 pace/step 中 scheduleSummary 文案规则一致 */
+    dashboardScheduleSummary () {
+      const list = this.stepList || []
+      const totalCount = list.length
+      const completedCount = list.filter((item) => item.status === 2).length
+      const pendingCount = list.filter((item) => item.status === 1).length
+      return `已完成（${completedCount}）+ 待验收（${pendingCount}） / 总节点数（${totalCount}）`
+    },
     filteredTaskList () {
       const list = this.taskList || []
       const code = (this.taskQuery.projectCode || '').trim().toLowerCase()
@@ -304,6 +367,19 @@ export default {
     this.getProjectList()
   },
   methods: {
+    /** 进度导图挂在 Tab 内，切换为可见后触发 ECharts 重新测量，避免线上画布宽/高为 0 */
+    onScheduleTabClick (tab) {
+      if (!tab || tab.name !== 'mind') return;
+      this.$nextTick(() => {
+        requestAnimationFrame(() => {
+          const comp = this.$refs.dashboardMindXmind;
+          if (comp && typeof comp.scheduleResize === 'function') {
+            comp.scheduleResize();
+          }
+        });
+      });
+    },
+
     async getProjectList () {
       this.projectLoading = true
       try {
@@ -360,6 +436,16 @@ export default {
       } finally {
         this.pageLoading = false
         this.xmindLoading = false
+        if (this.scheduleViewTab === 'mind') {
+          this.$nextTick(() => {
+            requestAnimationFrame(() => {
+              const comp = this.$refs.dashboardMindXmind
+              if (comp && typeof comp.scheduleResize === 'function') {
+                comp.scheduleResize()
+              }
+            })
+          })
+        }
       }
     },
 
@@ -666,16 +752,18 @@ export default {
   padding: 0;
 }
 
-.schedule-panel-tabs {
-  flex: 1 1 0%;
-  min-height: 0;
-  display: flex;
-  flex-direction: column;
-  
+.schedule-board-summary--pace-like {
+  flex-shrink: 0;
+  padding: 10px 12px 8px;
+  border-bottom: 1px solid #ebeef5;
 }
 
-/* Element Tabs 根节点参与纵向 flex，才能把剩余高度交给内容区 */
-.schedule-panel-tabs :deep(.el-tabs) {
+/*
+ * schedule-panel-tabs 与 .el-tabs 在同一 DOM 节点上，不能用「.schedule-panel-tabs :deep(.el-tabs)」后代选择器（永远匹配不到）。
+ * 生产包合并 CSS 后，Element 全局 .el-tabs 可能后加载并盖住单独的 .schedule-panel-tabs，导致 flex 丢失。
+ * 使用双类选择器提高命中与优先级。
+ */
+.schedule-panel-tabs.el-tabs {
   flex: 1 1 0%;
   min-height: 0;
   display: flex;
@@ -683,13 +771,13 @@ export default {
   height: 100%;
 }
 
-.schedule-panel-tabs :deep(.el-tabs__header) {
+.schedule-panel-tabs.el-tabs :deep(.el-tabs__header) {
   margin-bottom: 0;
   padding: 0 12px;
   flex-shrink: 0;
 }
 
-.schedule-panel-tabs :deep(.el-tabs__content) {
+.schedule-panel-tabs.el-tabs :deep(.el-tabs__content) {
   flex: 1 1 0%;
   min-height: 0;
   overflow: hidden;
@@ -699,9 +787,11 @@ export default {
 }
 
 /* 当前激活的 pane 占满内容区高度，子元素才能算出可滚动区域 */
-.schedule-panel-tabs :deep(.el-tab-pane) {
+.schedule-panel-tabs.el-tabs :deep(.el-tab-pane) {
   flex: 1 1 0%;
   min-height: 0;
+  min-width: 0;
+  width: 100%;
   overflow: hidden;
   display: flex;
   flex-direction: column;
@@ -710,6 +800,8 @@ export default {
 .schedule-tab-pane-inner {
   flex: 1 1 0%;
   min-height: 0;
+  min-width: 0;
+  width: 100%;
   height: 100%;
   box-sizing: border-box;
   display: flex;
@@ -719,19 +811,24 @@ export default {
 .schedule-tab-pane-inner--mind {
   min-height: 280px;
   overflow: hidden;
+  width: 100%;
+  min-width: 0;
 }
 
-/* 进度明细 Tab：占满下方板块；内部仅滚动区参与滚动 */
+/* 进度明细 Tab：表格与面板四边留白，避免贴边 */
 .progress-table-pane {
   flex: 1 1 0%;
   min-height: 0;
   width: 100%;
-  height:300px;
+  height: 300px;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  padding: 8px 12px 10px;
-  
+  padding: 14px 18px 18px;
+}
+
+.progress-table-pane :deep(.el-empty) {
+  padding: 24px 8px;
 }
 
 .progress-table-scroll {
@@ -740,6 +837,8 @@ export default {
   min-width: 0;
   overflow: auto;
   -webkit-overflow-scrolling: touch;
+  /* 表格与滚动容器边缘再留一线间距，滚动条不压表格边框 */
+  padding: 2px 4px 4px 2px;
 }
 
 .progress-step-el-table {
@@ -751,7 +850,10 @@ export default {
   flex-direction: row;
   align-items: stretch;
   flex: 1;
+  flex-basis: 0;
   min-height: 0;
+  min-width: 0;
+  width: 100%;
 }
 
 .task-table-wrap {
@@ -804,7 +906,7 @@ export default {
 }
 
 .xmind-wrap {
-  flex: 1;
+  flex: 1 1 0%;
   min-width: 0;
   position: relative;
   padding: 0;

ruoyi-ui/src/views/oa/project/pace/components/xmind.vue

@@ -106,7 +106,9 @@ export default {
       return {
         width: '100%',
         height: this.height,
-        minHeight: this.dashboardMode ? '300px' : '240px'
+        minHeight: this.dashboardMode ? '300px' : '240px',
+        /* 看板嵌在横向 flex 内，避免 min-width:auto 把可用宽压成 0 */
+        ...(this.dashboardMode ? { minWidth: 0, boxSizing: 'border-box' } : {})
       }
     }
   },
@@ -118,37 +120,92 @@ export default {
       clickEvent: null, // 新增：存储点击事件句柄，用于销毁解绑
       users: [],
       supplierList: [],
+      chartResizeObserver: null,
+      chartResizeObserverRaf: null
     };
   },
   watch: {
-    // 监听列表数据变化，自动更新图表
     list: {
       deep: true,
       handler () {
-        if (this.chartInstance) {
+        this.$nextTick(() => {
           this.initChart();
-        }
+        });
       }
     }
   },
   mounted () {
     this.initChart();
-    this.$nextTick(() => this.resizeChart());
+    this.deferResizeChart();
     window.addEventListener('resize', this.resizeChart);
+    this.$nextTick(() => {
+      this.bindChartResizeObserver();
+    });
   },
   beforeDestroy () {
     window.removeEventListener('resize', this.resizeChart);
-    // 新增：解绑Echarts点击事件，防止内存泄漏
+    this.unbindChartResizeObserver();
     if (this.chartInstance && this.clickEvent) {
       this.chartInstance.off('click', this.clickEvent);
     }
-    // 销毁图表实例，防止内存泄漏
     this.chartInstance?.dispose();
   },
   methods: {
-    // 优化：增加防抖处理-窗口自适应，避免频繁触发
     resizeChart () {
-      this.chartInstance?.resize()
+      this.chartInstance?.resize();
+    },
+
+    /**
+     * 供综合看板在切换 Tab 后调用：Tab 从 display:none 变为可见后需重新测量画布。
+     */
+    scheduleResize () {
+      this.deferResizeChart();
+    },
+
+    /**
+     * el-tab / flex 布局下首帧常为 0 宽高，生产环境更明显；延迟到布局稳定后再 resize。
+     */
+    deferResizeChart () {
+      this.$nextTick(() => {
+        this.$nextTick(() => {
+          requestAnimationFrame(() => {
+            this.resizeChart();
+            requestAnimationFrame(() => this.resizeChart());
+          });
+        });
+      });
+    },
+
+    bindChartResizeObserver () {
+      if (!this.dashboardMode || typeof ResizeObserver === 'undefined') {
+        return;
+      }
+      const el = this.$refs.chart;
+      if (!el) {
+        return;
+      }
+      this.unbindChartResizeObserver();
+      this.chartResizeObserver = new ResizeObserver(() => {
+        if (this.chartResizeObserverRaf != null) {
+          cancelAnimationFrame(this.chartResizeObserverRaf);
+        }
+        this.chartResizeObserverRaf = requestAnimationFrame(() => {
+          this.chartResizeObserverRaf = null;
+          this.resizeChart();
+        });
+      });
+      this.chartResizeObserver.observe(el);
+    },
+
+    unbindChartResizeObserver () {
+      if (this.chartResizeObserverRaf != null) {
+        cancelAnimationFrame(this.chartResizeObserverRaf);
+        this.chartResizeObserverRaf = null;
+      }
+      if (this.chartResizeObserver) {
+        this.chartResizeObserver.disconnect();
+        this.chartResizeObserver = null;
+      }
     },
 
     handleSubmit () {
@@ -288,11 +345,13 @@ export default {
       };
     },
 
-    // 初始化图表
     initChart () {
-      // 初始化图表实例
+      const dom = this.$refs.chart;
+      if (!dom) {
+        return;
+      }
       if (!this.chartInstance) {
-        this.chartInstance = echarts.init(this.$refs.chart);
+        this.chartInstance = echarts.init(dom);
       }
       // 重要：先解绑已有点击事件，防止多次绑定导致弹窗多次触发
       if (this.clickEvent) {
@@ -422,8 +481,8 @@ export default {
           }
         ]
       };
-      // 渲染图表
       this.chartInstance?.setOption(option, true);
+      this.deferResizeChart();
 
       this.clickEvent = (params) => {
         const data = params.data;
@@ -461,12 +520,16 @@ export default {
   flex-direction: column;
   height: 100%;
   min-height: 0;
+  width: 100%;
+  min-width: 0;
 }
 
 /* 与综合看板折线图区域一致：白底、细边框、轻圆角 */
 .xmind-box--dashboard .xmind-container {
   flex: 1;
   min-height: 0;
+  min-width: 0;
+  width: 100%;
   background: #fff;
   border: 1px solid #ebeef5;
   border-radius: 6px;

ruoyi-ui/src/views/oa/project/travelCompare.vue

@@ -0,0 +1,239 @@
+<template>
+  <div class="travel-compare-page">
+    <el-card shadow="never" class="filter-card">
+      <div class="filter-row">
+        <div class="filter-item">
+          <span class="filter-label">姓名</span>
+          <el-input
+            v-model="queryParams.nickName"
+            clearable
+            size="small"
+            placeholder="请输入姓名"
+            style="width: 180px"
+          />
+        </div>
+        <div class="filter-item">
+          <span class="filter-label">地点</span>
+          <el-input
+            v-model="queryParams.workPlace"
+            clearable
+            size="small"
+            placeholder="请输入报工地点"
+            style="width: 200px"
+          />
+        </div>
+        <div class="filter-item">
+          <span class="filter-label">时间</span>
+          <el-date-picker
+            v-model="dateRange"
+            type="daterange"
+            range-separator="至"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+            value-format="yyyy-MM-dd"
+            size="small"
+            clearable
+          />
+        </div>
+        <el-button type="primary" size="small" icon="el-icon-search" @click="handleQuery">查询</el-button>
+        <el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
+      </div>
+    </el-card>
+
+    <el-card shadow="never" class="table-card">
+      <div slot="header" class="card-header">
+        <span>报工审核</span>
+        <el-button size="mini" icon="el-icon-refresh" @click="loadList">刷新</el-button>
+      </div>
+
+      <el-table :data="list" v-loading="loading" stripe empty-text="暂无比对记录">
+        <el-table-column label="姓名" prop="nickName" min-width="140" />
+        <el-table-column label="日期" prop="compareDate" min-width="120">
+          <template slot-scope="scope">{{ formatDate(scope.row.compareDate) }}</template>
+        </el-table-column>
+        <el-table-column label="是否出差" min-width="120">
+          <template slot-scope="scope">
+            {{ scope.row.isTrip === 1 ? '是' : '否' }}
+          </template>
+        </el-table-column>
+        <el-table-column label="报工地点" prop="workPlace" min-width="180" show-overflow-tooltip />
+        <el-table-column label="实际出差地点" prop="travelPlace" min-width="180" show-overflow-tooltip />
+        <el-table-column label="机器比对结果" min-width="140">
+          <template slot-scope="scope">
+            <span
+              :class="[
+                'result-tag',
+                scope.row.compareResult === '通过' ? 'pass' : (scope.row.compareResult === '异常' ? 'fail' : 'neutral')
+              ]"
+            >
+              {{ scope.row.compareResult }}
+            </span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <div class="pagination-wrap">
+        <el-pagination
+          background
+          :current-page="pageNum"
+          :page-size="pageSize"
+          :total="total"
+          layout="total, prev, pager, next, sizes, jumper"
+          :page-sizes="[10, 20, 50, 100]"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { listTravelCompare } from '@/api/oa/projectCompare'
+
+export default {
+  name: 'OaProjectTravelCompare',
+  data () {
+    return {
+      loading: false,
+      list: [],
+      total: 0,
+      pageNum: 1,
+      pageSize: 50,
+      dateRange: [],
+      queryParams: {
+        nickName: '',
+        workPlace: ''
+      }
+    }
+  },
+  created () {
+    this.loadList()
+  },
+  methods: {
+    formatDateOnly (date) {
+      const p = n => (n < 10 ? `0${n}` : `${n}`)
+      return `${date.getFullYear()}-${p(date.getMonth() + 1)}-${p(date.getDate())}`
+    },
+    formatDate (val) {
+      if (!val) return '-'
+      const d = new Date(val)
+      if (Number.isNaN(d.getTime())) return '-'
+      return this.formatDateOnly(d)
+    },
+    handleQuery () {
+      this.pageNum = 1
+      this.loadList()
+    },
+    async loadList () {
+      this.loading = true
+      try {
+        const [start, end] = this.dateRange || []
+        const res = await listTravelCompare(
+          start || null,
+          end || null,
+          this.queryParams.nickName,
+          this.queryParams.workPlace,
+          this.pageNum,
+          this.pageSize
+        )
+        this.list = res?.rows || []
+        this.total = res?.total || 0
+      } catch (err) {
+        console.error('加载报工审核失败:', err)
+        this.$message.error('加载报工审核失败')
+        this.list = []
+        this.total = 0
+      } finally {
+        this.loading = false
+      }
+    },
+    handleCurrentChange (pageNum) {
+      this.pageNum = pageNum
+      this.loadList()
+    },
+    handleSizeChange (pageSize) {
+      this.pageSize = pageSize
+      this.pageNum = 1
+      this.loadList()
+    },
+    resetQuery () {
+      this.pageNum = 1
+      this.pageSize = 50
+      this.queryParams.nickName = ''
+      this.queryParams.workPlace = ''
+      this.dateRange = []
+      this.loadList()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.travel-compare-page {
+  padding: 16px 20px 32px;
+}
+
+.filter-card,
+.table-card {
+  border: 1px solid #d7d9df;
+  border-radius: 10px;
+  margin-bottom: 16px;
+}
+
+.filter-row {
+  display: flex;
+  gap: 16px;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.filter-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.filter-label {
+  color: #606266;
+  font-size: 14px;
+  white-space: nowrap;
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-weight: 700;
+  color: #2b2f36;
+}
+
+.pagination-wrap {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 16px;
+}
+
+.result-tag {
+  display: inline-block;
+  padding: 4px 10px;
+  border-radius: 4px;
+  font-size: 12px;
+  line-height: 1;
+}
+
+.pass {
+  background: #e8f7ee;
+  color: #1f8b4c;
+}
+
+.fail {
+  background: #fdecec;
+  color: #d93026;
+}
+
+.neutral {
+  background: #eef2f7;
+  color: #5c6b7a;
+}
+</style>