@epxing/business 5.3.0-beta.2 → 5.3.0-beta.4

package/src/views/JvmMemoryMonitor.vue

@@ -0,0 +1,284 @@
+<template>
+  <section class="jvm-memory">
+    <div class="jvm-memory__toolbar">
+      <div><h2>内存监控</h2><p>当前 JVM 的内存使用、GC 与请求保护状态</p></div>
+      <div class="jvm-memory__actions">
+        <el-switch v-model="autoRefresh" active-text="自动刷新" @change="changeRefresh" />
+        <el-button size="small" icon="el-icon-refresh" :loading="loading" @click="refresh">刷新</el-button>
+        <el-button size="small" icon="el-icon-document" :loading="jstackLoading" @click="captureJstack">获取 jstack</el-button>
+      </div>
+    </div>
+    <el-alert v-if="error" :title="error" type="error" :closable="false" show-icon />
+    <el-alert v-else-if="stale" title="采样数据已过期，请检查 JVM 监控线程或网络。下方保留最后一次采样。" type="warning" :closable="false" show-icon />
+    <template v-if="snapshot">
+      <div class="jvm-memory__status">
+        <el-tag :type="statusType">{{ statusText }}</el-tag>
+        <span>采样时间：{{ time(snapshot.sampledAt) }}</span>
+        <span>采样间隔：{{ snapshot.sampleIntervalMs / 1000 }} 秒</span>
+        <span>保护策略：{{ snapshot.rejectRequests ? '高压时拒绝新请求' : '仅监控' }}</span>
+      </div>
+      <div class="jvm-memory__summary-row">
+        <div class="jvm-memory__panel jvm-memory__policy">
+          <h3>监控与保护规则</h3>
+          <p>预警 {{ ratio(snapshot.warningThreshold) }}；连续 {{ snapshot.highSamples }} 次达到 {{ ratio(snapshot.rejectThreshold) }}，或单次达到 {{ ratio(snapshot.emergencyThreshold) }} 时进入保护。</p>
+          <p>连续 {{ snapshot.recoverySamples }} 次降至 {{ ratio(snapshot.recoveryThreshold) }} 以下后恢复。保护期间新业务请求返回 503，已接收的请求继续执行。</p>
+          <p>压力取堆内存、有明确上限的非堆内存池及已配置预算的直接内存使用率的最大值。监控不主动触发 GC，也不采集对象明细。</p>
+          <small>实例 {{ snapshot.instanceId }} · JVM 启动于 {{ time(snapshot.startedAt) }}。只展示本次请求命中的 JVM，切换实例时清空趋势。</small>
+        </div>
+        <div v-if="snapshot.risk" class="jvm-memory__panel jvm-memory__risk">
+          <div class="jvm-memory__chart-title"><h3>溢出与死锁风险预测</h3><span>{{ snapshot.risk.reason }}</span></div>
+          <p>内存风险：<el-tag size="small" :type="riskType(snapshot.risk.memoryRisk)">{{ snapshot.risk.memoryRisk }}</el-tag>
+           <span class="jvm-memory__risk-gap">死锁风险：</span><el-tag size="small" :type="riskType(snapshot.risk.deadlockRisk)">{{ snapshot.risk.deadlockRisk }}</el-tag></p>
+          <p v-if="snapshot.risk.memoryGrowthBytesPerSecond > 0">最近窗口堆增长 {{ bytesPerSecond(snapshot.risk.memoryGrowthBytesPerSecond) }}；预计达到拒绝线 {{ seconds(snapshot.risk.predictedSecondsToReject) }}，达到紧急线 {{ seconds(snapshot.risk.predictedSecondsToEmergency) }}。</p>
+          <p v-else>最近窗口未观察到持续堆增长，预测仅供预警参考。</p>
+        </div>
+      </div>
+      <div v-if="snapshot.heap" class="jvm-memory__cards">
+        <div class="jvm-memory__card">
+          <span>堆内存</span><strong>{{ bytes(snapshot.heap.used) }}</strong>
+          <el-progress :percentage="percent(snapshot.heap.used, snapshot.heap.max)" :color="pressureColor" />
+          <small>上限 {{ bytes(snapshot.heap.max) }} · 已提交 {{ bytes(snapshot.heap.committed) }}</small>
+        </div>
+        <div class="jvm-memory__card">
+          <span>非堆内存</span><strong>{{ bytes(snapshot.nonHeap.used) }}</strong>
+          <small>上限 {{ bytes(snapshot.nonHeap.max) }} · 已提交 {{ bytes(snapshot.nonHeap.committed) }}</small>
+        </div>
+        <div class="jvm-memory__card">
+          <span>直接 / 映射缓冲区</span><strong>{{ bytes(snapshot.directBytes) }}</strong>
+          <small>映射 {{ bytes(snapshot.mappedBytes) }}</small>
+          <small>直接内存预算 {{ snapshot.directMemoryLimitBytes ? bytes(snapshot.directMemoryLimitBytes) : '未配置，仅监控' }}</small>
+        </div>
+        <div class="jvm-memory__card">
+          <span>GC 累计次数 / 耗时</span><strong>{{ snapshot.gcCount }} 次</strong>
+          <small>{{ (snapshot.gcTimeMillis / 1000).toFixed(2) }} 秒 · JVM 启动以来累计</small>
+          <small>已拒绝请求 {{ snapshot.rejectedRequests }} 次</small>
+        </div>
+      </div>
+      <div class="jvm-memory__panel">
+        <div class="jvm-memory__chart-title"><h3>内存压力趋势</h3><span>当前 {{ (snapshot.pressureRatio * 100).toFixed(1) }}% · 当前页面最近 60 个采样点</span></div>
+        <svg v-if="history.length > 1" class="jvm-memory__chart" viewBox="0 0 600 120" preserveAspectRatio="none" role="img" aria-label="内存压力趋势，橙色虚线为保护阈值">
+          <line x1="0" :y1="120 * (1 - snapshot.rejectThreshold)" x2="600" :y2="120 * (1 - snapshot.rejectThreshold)" stroke="#e6a23c" stroke-dasharray="5 5" />
+          <polyline :points="trendPoints" fill="none" stroke="#3074ef" stroke-width="2" vector-effect="non-scaling-stroke" />
+        </svg>
+        <p v-else class="jvm-memory__empty">{{ snapshot.enabled ? '等待下一次采样形成趋势' : '监控已关闭' }}</p>
+        <div class="jvm-memory__chart-title"><small>{{ history.length ? time(history[0].sampledAt) : '—' }}</small><small>{{ time(snapshot.sampledAt) }}</small></div>
+      </div>
+      <div v-if="snapshot.threads" class="jvm-memory__panel jvm-memory__threads">
+        <div class="jvm-memory__chart-title"><h3>线程监控</h3><span>采样 {{ time(snapshot.threads.sampledAt) }}</span></div>
+        <div class="jvm-memory__thread-grid">
+          <span>活动线程 <strong>{{ snapshot.threads.live }}</strong></span>
+          <span>峰值线程 <strong>{{ snapshot.threads.peak }}</strong></span>
+          <span>RUNNABLE <strong>{{ snapshot.threads.runnable }}</strong></span>
+          <span>BLOCKED <strong>{{ snapshot.threads.blocked }}</strong></span>
+          <span>WAITING <strong>{{ snapshot.threads.waiting + snapshot.threads.timedWaiting }}</strong></span>
+          <span>死锁线程 <strong :class="{ 'is-danger': snapshot.threads.deadlocked > 0 }">{{ snapshot.threads.deadlocked }}</strong></span>
+          <span>线程栈估算 <strong>{{ snapshot.threads.stackBytesEstimated ? bytes(snapshot.threads.stackBytesEstimate) : '未知' }}</strong></span>
+        </div>
+        <p>线程栈是按活动线程数和 Xss 参数估算的保留空间，不等于实际 RSS；死锁扫描按 30 秒周期执行。</p>
+      </div>
+    </template>
+    <p v-else-if="!loading && !error" class="jvm-memory__empty">暂无采样数据</p>
+    <el-dialog v-model="jstackVisible" width="80%" append-to-body>
+      <template #title>
+        <div class="jvm-memory__dialog-title">
+          <span>JVM jstack（有界快照）</span>
+          <span class="jvm-memory__dialog-actions">
+            <el-button size="small" icon="el-icon-document-copy" :disabled="!jstackSnapshot" @click="copyJstack">复制</el-button>
+          </span>
+        </div>
+      </template>
+      <div v-if="jstackSnapshot" class="jvm-memory__jstack-meta">线程 {{ jstackSnapshot.threadCount }}，输出 {{ jstackSnapshot.includedThreads }} 条，栈空间估算 {{ jstackSnapshot.stackBytesEstimated ? bytes(jstackSnapshot.stackBytesEstimate) : '未知' }}</div>
+      <pre v-if="jstackSnapshot" class="jvm-memory__jstack">{{ jstackSnapshot.text }}</pre>
+    </el-dialog>
+  </section>
+</template>
+
+<script>
+import axios from 'axios'
+import { markRaw } from 'vue'
+
+export default {
+  name: 'epx-jvm-memory-monitor',
+  data () {
+    return {
+      snapshot: null,
+      history: [],
+      autoRefresh: true,
+      loading: false,
+      error: '',
+      stale: false,
+      active: false,
+      timer: null,
+      // 取消并作废离开页面前的请求，避免迟到响应重启轮询。
+      pendingRequest: null,
+      jstackLoading: false,
+      jstackVisible: false,
+      jstackSnapshot: null
+    }
+  },
+  computed: {
+    statusText () {
+      if (this.error || this.stale) return '状态未知'
+      const states = { NORMAL: '正常', WARNING: '内存预警', PROTECTED: this.snapshot.rejecting ? '请求保护中' : '高内存压力（仅监控）', STARTING: '等待采样', DISABLED: '监控已关闭' }
+      return states[this.snapshot.state] || '状态未知'
+    },
+    statusType () {
+      if (this.error || this.stale || !this.snapshot.enabled) return 'info'
+      return this.snapshot.state === 'PROTECTED' ? 'danger' : this.snapshot.state === 'WARNING' ? 'warning' : 'success'
+    },
+    pressureColor () {
+      return this.snapshot.pressureRatio >= this.snapshot.rejectThreshold ? '#f56c6c' : '#3074ef'
+    },
+    trendPoints () {
+      return this.history.map((point, index) => `${index * 600 / Math.max(1, this.history.length - 1)},${120 * (1 - Math.min(1, Math.max(0, point.pressureRatio)))}`).join(' ')
+    }
+  },
+  mounted () {
+    document.addEventListener('visibilitychange', this.onVisibilityChange)
+    this.activate()
+  },
+  activated () { this.activate() },
+  deactivated () { this.active = false; this.stop() },
+  beforeUnmount () {
+    this.active = false
+    this.stop()
+    document.removeEventListener('visibilitychange', this.onVisibilityChange)
+  },
+  methods: {
+    activate () {
+      if (this.active) return
+      this.active = true
+      if (!document.hidden) this.refresh()
+    },
+    stop () {
+      clearTimeout(this.timer)
+      this.timer = null
+      if (this.pendingRequest) this.pendingRequest.cancel()
+      this.pendingRequest = null
+      this.loading = false
+    },
+    onVisibilityChange () {
+      if (document.hidden) this.stop()
+      else if (this.active && this.autoRefresh) this.refresh()
+    },
+    changeRefresh () {
+      this.stop()
+      if (this.autoRefresh) this.refresh()
+    },
+    async refresh () {
+      if (!this.active || document.hidden || this.loading) return
+      clearTimeout(this.timer)
+      this.loading = true
+      const request = markRaw(axios.CancelToken.source())
+      this.pendingRequest = request
+      try {
+        // FM_SYSTEM 返回共享的最新 JVM 快照；接口不查询业务数据、不即时采样。
+        const data = await this.$http.get({ entityId: 'FM_SYSTEM', action: 'getJvmMemoryStatus' }, { timeout: 8000, cancelToken: request.token })
+        if (this.pendingRequest !== request) return
+        if (!data || !data.instanceId || !data.state) throw new Error('监控数据格式异常')
+        if (this.snapshot && this.snapshot.instanceId !== data.instanceId) this.history = []
+        this.snapshot = data
+        this.error = ''
+        this.stale = data.enabled && data.sampledAt > 0 && Date.now() - data.sampledAt > Math.max(30000, data.sampleIntervalMs * 3)
+        const last = this.history[this.history.length - 1]
+        if (data.sampledAt > 0 && (!last || last.sampledAt !== data.sampledAt)) {
+          this.history.push({ sampledAt: data.sampledAt, pressureRatio: data.pressureRatio })
+          if (this.history.length > 60) this.history.shift()
+        }
+      } catch (error) {
+        if (this.pendingRequest === request && !axios.isCancel(error)) this.error = (error && (error.msg || error.message)) || '内存监控获取失败'
+      } finally {
+        if (this.pendingRequest === request) {
+          this.pendingRequest = null
+          this.loading = false
+          if (this.active && this.autoRefresh && !document.hidden) {
+            this.timer = setTimeout(this.refresh, Math.max(10000, (this.snapshot && this.snapshot.sampleIntervalMs) || 0))
+          }
+        }
+      }
+    },
+    async captureJstack () {
+      if (this.jstackLoading) return
+      this.jstackLoading = true
+      try {
+        this.jstackSnapshot = await this.$http.get({ entityId: 'FM_SYSTEM', action: 'getJvmJstack' }, { timeout: 15000 })
+        this.jstackVisible = true
+      } catch (error) {
+        this.$message.error((error && (error.msg || error.message)) || 'jstack 获取失败')
+      } finally {
+        this.jstackLoading = false
+      }
+    },
+    async copyJstack () {
+      if (!this.jstackSnapshot || !this.jstackSnapshot.text) return
+      const text = this.jstackSnapshot.text
+      try {
+        if (navigator.clipboard && navigator.clipboard.writeText) {
+          await navigator.clipboard.writeText(text)
+        } else {
+          const input = document.createElement('textarea')
+          input.value = text
+          input.setAttribute('readonly', '')
+          input.style.position = 'fixed'
+          input.style.opacity = '0'
+          document.body.appendChild(input)
+          input.select()
+          document.execCommand('copy')
+          document.body.removeChild(input)
+        }
+        this.$message.success('jstack 已复制')
+      } catch (error) {
+        this.$message.error('复制失败，请手动选择文本复制')
+      }
+    },
+    bytes (value) {
+      if (value == null || value < 0) return '未限定'
+      return value >= 1073741824 ? `${(value / 1073741824).toFixed(2)} GB` : `${(value / 1048576).toFixed(1)} MB`
+    },
+    percent (used, max) { return max > 0 ? Math.min(100, Math.max(0, Math.round(used / max * 1000) / 10)) : 0 },
+    ratio (value) { return `${Math.round(value * 100)}%` },
+    riskType (value) { return value === 'HIGH' || value === 'DETECTED' ? 'danger' : value === 'WATCH' ? 'warning' : 'success' },
+    seconds (value) { return value == null || value < 0 ? '暂不可预测' : `${value} 秒` },
+    bytesPerSecond (value) { return `${this.bytes(value)}/秒` },
+    time (value) { return value > 0 ? new Date(value).toLocaleString() : '—' }
+  }
+}
+</script>
+
+<style scoped>
+.jvm-memory { padding: 24px; background: var(--epx-bg-card, #f3f5fa); color: var(--epx-text, #303133); min-height: 100%; box-sizing: border-box; }
+.jvm-memory h2, .jvm-memory h3, .jvm-memory p { margin: 0; }
+.jvm-memory h2 { font-size: 21px; margin-bottom: 8px; }
+.jvm-memory h3 { font-size: 15px; }
+.jvm-memory small, .jvm-memory__toolbar p { color: var(--epx-text-secondary, #727987); font-size: 13px; }
+.jvm-memory__toolbar, .jvm-memory__chart-title { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
+.jvm-memory__toolbar { margin-bottom: 20px; }
+.jvm-memory__actions, .jvm-memory__status { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
+.jvm-memory__status { margin: 18px 0; font-size: 13px; color: var(--epx-text, #606266); }
+.jvm-memory__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
+.jvm-memory__summary-row + .jvm-memory__cards { margin-top: 18px; }
+.jvm-memory__card, .jvm-memory__panel { background: var(--epx-bg-card, #fff); border: 1px solid var(--epx-border, #ebeef5); border-radius: 6px; padding: 20px; }
+.jvm-memory__card { display: flex; flex-direction: column; gap: 12px; }
+.jvm-memory__card strong { font-size: 27px; font-weight: 600; }
+.jvm-memory__panel { margin-top: 18px; }
+.jvm-memory__summary-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
+.jvm-memory__summary-row .jvm-memory__panel { margin-top: 18px; }
+.jvm-memory__chart-title span { color: var(--epx-text-secondary, #727987); font-size: 13px; }
+.jvm-memory__chart { width: 100%; height: 160px; margin: 18px 0 10px; }
+.jvm-memory__empty { padding: 40px 0; text-align: center; color: var(--epx-text-secondary, #909399); }
+.jvm-memory__policy { line-height: 1.9; font-size: 13px; }
+.jvm-memory__policy h3 { margin-bottom: 8px; }
+.jvm-memory__policy small { overflow-wrap: anywhere; }
+.jvm-memory__threads p, .jvm-memory__risk p { margin-top: 10px; color: var(--epx-text-secondary, #727987); font-size: 13px; }
+.jvm-memory__thread-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
+.jvm-memory__thread-grid span { padding: 12px; background: var(--epx-bg-card, #f7f8fa); border-radius: 4px; color: var(--epx-text, #606266); }
+.jvm-memory__thread-grid strong { display: block; margin-top: 6px; color: var(--epx-text, #303133); font-size: 20px; }
+.jvm-memory__thread-grid .is-danger { color: var(--el-color-danger, #f56c6c); }
+.jvm-memory__jstack-meta { color: var(--epx-text, #606266); margin-bottom: 12px; }
+.jvm-memory__dialog-title { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-right: 42px; }
+.jvm-memory__dialog-actions { display: inline-flex; gap: 6px; }
+.jvm-memory__jstack { max-height: 60vh; overflow: auto; padding: 14px; background: #1f2430; color: #d7dae0; white-space: pre-wrap; word-break: break-word; }
+@media (max-width: 1100px) { .jvm-memory__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
+@media (max-width: 900px) { .jvm-memory__summary-row { grid-template-columns: 1fr; } }
+@media (max-width: 650px) { .jvm-memory { padding: 14px; } .jvm-memory__cards { grid-template-columns: 1fr; } .jvm-memory__thread-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .jvm-memory__toolbar, .jvm-memory__chart-title { align-items: flex-start; flex-direction: column; } }
+</style>

package/src/views/Module.vue

@@ -1,210 +1,4 @@
-<template>
-  <div ref="module" id="module" class="module">
-    <!-- 显示module页面 -->
-    <!-- <epx-router-view v-if="initRoute" :init-route="initRoute"></epx-router-view> -->
-    <!-- 创建容器 -->
-    <epx-page
-      @changeRouter="changeRouter"
-      @back="back"
-      v-if="showPage"
-      :pageId="moduleRouter.pageId"
-      :flag="moduleRouter.flag"
-      :metaId="moduleRouter.metaId"
-      :component="moduleRouter.component"
-      :router="moduleRouter"
-      :current-query="moduleRouter"
-   />
-  </div>
-</template>
-
-<script>
-// 容器页面
-import { DELETE_MODULE_ROUTER, SET_ROUTER } from '@epxing/core/src/store/actions'
-import { mapState } from 'vuex'
-export default {
-  name: 'epx-module',
-  props: {
-    router: {
-      type: Object,
-      default () {
-        return {}
-      }
-    }
-  },
-  data () {
-    return {
-      showPage: false,
-      moduleIndexPage: '',
-      moduleRouters: [],
-      initRoute: null
-    }
-  },
-  computed: {
-    ...mapState({
-      // routers: state => state.router.moduleRouters,
-      // route: state => state.router.moduleRoute,
-      user: state => state.user.user
-    }),
-    pageId () {
-      return this.route.pageId || this.moduleIndexPage
-    },
-    // moduleRouters () {
-    //   const { children = [] } = this.router
-    //   return children
-    // },
-    moduleRouter () {
-      return this.moduleRouters[this.moduleRouters.length - 1] || {}
-    }
-  },
-  watch: {
-    $routers: {
-      handler (routers) {
-        routers.forEach(item => {
-          if (item.key === this.router.key) {
-            const { children = [] } = item
-            this.moduleRouters = [...children]
-          }
-        })
-      },
-      deep: true
-    },
-    moduleRouter: {
-      handler (v, oldV) {
-        // 页面更改、刷新页面
-        if (!(v.pageId === oldV.pageId && v.flag === oldV.flag && v.metaId === oldV.metaId && v.component === oldV.component)) {
-          this.reloadPageDebounce()
-        }
-      },
-      deep: true
-    }
-  },
-  provide () {
-    return {
-      $changeRouter: this.changeRouter,
-      $reloadPage: this.reloadPage,
-      $backPage: this.$popModuleRoute
-    }
-  },
-  methods: {
-    reloadPage () {
-      this.showPage = false
-      this.$nextTick(() => {
-        if (this.moduleRouter.pageId || this.moduleRouter.flag || this.moduleIndexPage || this.moduleRouter.component) {
-          const timer = setTimeout(() => {
-            this.showPage = true
-            clearTimeout(timer)
-          }, 0)
-        }
-      })
-    },
-    getModule () {
-      let { moduleId } = this.$route.query
-      if (this.router.query) {
-        moduleId = this.router.query.moduleId
-      }
-      if (!moduleId) {
-        if (this.user.currentRoleEntity) {
-          const { MENU: USER_MENU } = this.user.currentRoleEntity.data
-          moduleId = USER_MENU
-        }
-      }
-      // 获取当前模块信息
-      // 如果当前模块没绑定页面，获取其子模块页面
-      this.$http.get({
-        entityId: 'FM_MODULE',
-        id: moduleId
-      })
-        .then(data => {
-          if (data) {
-            const module = data.data || {}
-            const date = new Date().getTime()
-            // 初始化模块首页
-            // this.$pushModuleRoute({
-            //   pageId: module.MAIN_PAGE
-            // })
-            if (!this.router.query) {
-              this.$createPage({
-                key: this.$routers.length === 0 ? 'nav-' + date : date,
-                moduleId: module.ID,
-                title: module.NAME,
-                openType: '1'
-              })
-              this.initRoute = {
-                key: this.$routers.length === 0 ? 'nav-' + date : date,
-                moduleId: module.ID,
-                title: module.NAME
-              }
-            } else {
-              if (!this.router.children || this.router.children.length === 0) {
-                const router = {
-                  ...this.router,
-                  children: [
-                    { key: date, pageId: module.MAIN_PAGE, moduleId: moduleId }
-                  ]
-                }
-                this.initRoute = { key: date, pageId: module.MAIN_PAGE, moduleId: moduleId }
-                this.$store.commit(SET_ROUTER, { key: this.router.key, router })
-              }
-            }
-            // this.$createPage({
-            //   pageId: module.MAIN_PAGE
-            // })
-          }
-        })
-    },
-    addListenerRouter () {
-      // ⚠️ T17 修复轮 2（定向复审 N4）：这里原来还有两行
-      //   this.$bus.on('push', this.pushModuleRoute) / this.$bus.on('pop', this.popModuleRoute)
-      // 两个 handler **在本组件里恒为 `undefined`**：它们全仓只定义在 `@epxing/core/src/Container.vue`
-      // （:204-213），而本组件**没有 mixins/extends**，globalProperties 里也没有。
-      // 往总线塞 `undefined` 只会让 `emit('push')` 抛 `h is not a function`，从来没做过事 ⇒ 删掉。
-      // （两个不带 handler 的 off 是挂载侧既有行为，本次不动。）
-      this.$bus.off('push')
-      this.$bus.off('pop')
-    },
-    removeListenerRouter () {
-      // ⚠️ T17 修复轮 2（定向复审 N4，顶回②的安全性论断被推翻）：修复轮 1 认定这里「本来就传了
-      // handler，是安全的」。计数没错（该按原修法改的确实是 5 个文件不是 6 个），**但安全性论断错了**：
-      // `this.pushModuleRoute` / `this.popModuleRoute` 都是 `undefined`，而 `vue.bus.js` 的 off
-      // 判的是 `if (!callback)` ⇒ `off(event, undefined)` 走「删光该事件全部监听」那条分支，
-      // 与裸 `off('push')` 完全等价、一样连坐删掉别人的监听。
-      // 本组件从来没有成功注册过任何 handler，没有东西可摘 ⇒ 两行 off 一并删掉，只留 commit。
-      // 把二级路由清空
-      this.$store.commit(DELETE_MODULE_ROUTER)
-    },
-    changeRouter (v) {
-      // const { mode, router } = v
-      // if (mode === 'replace') {
-      //   this.$popModuleRoute()
-      // }
-      // this.$pushModuleRoute(router)
-    },
-    back () {
-      this.$popModuleRoute()
-    }
-  },
-  created () {
-    this.getModule()
-    this.addListenerRouter()
-    this.reloadPageDebounce = this.$_.debounce(this.reloadPage, 20)
-  },
-  beforeUnmount () {
-    this.removeListenerRouter()
-  }
-}
-</script>
-
-<style scoped>
-.module {
-  width: 100%;
-  height: 100%;
-  padding: 16px;
-  box-sizing: border-box;
-  position: relative;
-}
-@media only screen and (max-width: 992px) {
-  .module{
-    padding: 0;
-  }
-}
-</style>
+<script>
+// 保留业务包旧路径，基础路由页统一由 core 提供。
+export { default } from '@epxing/core/src/views/Module.vue'
+</script>

package/src/views/WikiBinding.vue

@@ -30,6 +30,14 @@
             <el-button size="small" @click="view = 'intake'">⬆ 上传原始文件</el-button>
             <el-button size="small" @click="view = 'config'">⚙ 配置</el-button>
           </template>
+          <template #doc-ops>
+            <span class="wiki-binding__doc-sep"></span>
+            <el-button v-if="space.SOURCE_TYPE && space.SOURCE_TYPE !== 'db'" type="success" plain size="small" icon="el-icon-refresh" :loading="syncing" @click="doSync">同步远端</el-button>
+            <el-button type="primary" size="small" icon="el-icon-s-tools" :loading="inspecting" @click="doInspect">
+              {{ inspecting ? '检查中…' : '体检与索引维护' }}
+            </el-button>
+            <el-button type="primary" plain size="small" icon="el-icon-share" @click="shareWiki">分享</el-button>
+          </template>
         </epx-wiki-site>
       </div>
 
@@ -205,6 +213,8 @@ export default {
       // 「这个空间里到底有什么」。配置收进右上角按钮
       view: 'content',
       contentHeight: 0,
+      syncing: false,
+      inspecting: false,
       form: { scope: '', retrieval: 'exact' }
     }
   },
@@ -393,6 +403,31 @@ export default {
       })
     },
 
+    shareWiki () {
+      const site = this.$refs.wikiSite
+      if (site) site.share()
+    },
+
+    doSync () {
+      this.syncing = true
+      this.$http.update({ action: 'sync', entityId: WIKI_META, wikiId: this.space.ID })
+        .then(d => {
+          this.$message.success((d && d.message) || '同步完成')
+          this.refreshWiki()
+          this.load()
+        })
+        .catch(e => this.$message.error((e && e.message) || '同步失败'))
+        .finally(() => { this.syncing = false })
+    },
+
+    doInspect () {
+      this.inspecting = true
+      this.$http.update({ action: 'inspect', entityId: WIKI_META, wikiId: this.space.ID, maintain: 'true' })
+        .then(d => this.$message.success((d && d.message) || '体检与索引维护完成'))
+        .catch(e => this.$message.error((e && e.message) || '体检与索引维护失败'))
+        .finally(() => { this.inspecting = false })
+    },
+
     /** 从入库记录点击生成页时，回到内容视图并打开同一页。 */
     openGeneratedPage (path) {
       this.view = 'content'
@@ -410,6 +445,13 @@ export default {
 .wiki-binding {
   padding: var(--padding-large) 0;
 
+  &__doc-sep {
+    flex: none;
+    width: 1px;
+    height: 16px;
+    background: var(--epx-bg, #e3e3e3);
+  }
+
   // 未绑定态：虚线框 + 居中，与设计稿 .bindbox 一致。
   // 虚线是有意的——它表示「这里还空着，等你填」，实线框看着像一块已经配好的内容
   &__bindbox {

package/types/app.d.ts

@@ -0,0 +1 @@
+export { App as default } from './index'

package/types/dept-find.d.ts

@@ -1 +1 @@
-export { DeptFind as default } from './index'
+export { DeptFind as default } from './index'

package/types/index.d.ts

@@ -1,14 +1,15 @@
-import type { App, DefineComponent, Plugin } from 'vue'
-export declare const UserFind: DefineComponent<any, any, any>
-export declare const DeptFind: DefineComponent<any, any, any>
-export declare const HeaderNav: DefineComponent<any, any, any>
-export declare const EntityTreeManage: DefineComponent<any, any, any>
-export declare const PageCatalog: DefineComponent<any, any, any>
-export declare const ReportFormList: DefineComponent<any, any, any>
-export declare const ReportFormListPage: DefineComponent<any, any, any>
-export declare const ExcelPreviewPage: DefineComponent<any, any, any>
-export declare function install(app: App): void
-declare const plugin: Plugin
-export default plugin
-export declare const systemComponents: Record<string, import('vue').Component>
-export declare const routeComponents: Record<string, import('vue').Component>
+import type { App as VueApp, DefineComponent, Plugin } from 'vue'
+export declare const App: DefineComponent<any, any, any>
+export declare const UserFind: DefineComponent<any, any, any>
+export declare const DeptFind: DefineComponent<any, any, any>
+export declare const HeaderNav: DefineComponent<any, any, any>
+export declare const EntityTreeManage: DefineComponent<any, any, any>
+export declare const PageCatalog: DefineComponent<any, any, any>
+export declare const ReportFormList: DefineComponent<any, any, any>
+export declare const ReportFormListPage: DefineComponent<any, any, any>
+export declare const ExcelPreviewPage: DefineComponent<any, any, any>
+export declare function install(app: VueApp): void
+declare const plugin: Plugin
+export default plugin
+export declare const systemComponents: Record<string, import('vue').Component>
+export declare const routeComponents: Record<string, import('vue').Component>

package/types/popup.d.ts

@@ -1,2 +1,2 @@
-declare const popup: import('vue').Plugin
-export default popup
+declare const popup: import('vue').Plugin
+export default popup

package/types/route-components.d.ts

@@ -1 +1 @@
-export { routeComponents as default } from './index'
+export { routeComponents as default } from './index'

package/types/user-find.d.ts

@@ -1 +1 @@
-export { UserFind as default } from './index'
+export { UserFind as default } from './index'