agentworkshop 0.7.23 → 0.7.24

package/.output/server/package.json

@@ -1,6 +1,6 @@
 {
   "name": "agentworkshop-prod",
-  "version": "0.7.23",
+  "version": "0.7.24",
   "type": "module",
   "private": true,
   "dependencies": {

package/app/app.vue

@@ -8,6 +8,13 @@ const store = useAppStore()
 const config = useRuntimeConfig().public
 const runtimeCfg = useRuntimeConfigStore()
 
+// SSR 首帧 antd token 跟随服务端 theme.mode:store 默认深色,若服务端配置为浅色而客户端
+// 挂载后才翻转,cssinjs 的 hash 相同样式不会重新注入,浅色下组件会缺 padding/格线等基础样式。
+const site = useSiteConfig()
+if (import.meta.server) {
+  store.isDark = (site.themeMode ?? 'dark') !== 'light'
+}
+
 const antdLocale = computed(() => (locale.value.startsWith('en') ? enUS : zhCN))
 
 /** 将 hex 向白混合(lighten),供暗色模式强调色提亮 */

package/app/assets/css/main.css

@@ -1219,7 +1219,7 @@ ul.task-list {
   border-radius: var(--radius-chip);
 }
 
-/* 表格:表头 Inter 小标(caption-uppercase),行线 hairline */
+/* 表格:表头 Inter 小标(caption-uppercase),行线 hairline;禁止竖向格线(操作台横向扫描语言) */
 .ant-table {
   background: transparent;
 }
@@ -1234,14 +1234,25 @@ ul.task-list {
   border-bottom: 1px solid var(--line-strong) !important;
 }
 
+.ant-table .ant-table-thead > tr > th,
+.ant-table .ant-table-tbody > tr > td {
+  border-inline-end: none !important;
+}
+
 .ant-table .ant-table-tbody > tr > td {
   border-bottom-color: var(--divider-hair);
+  font-variant-numeric: tabular-nums;
 }
 
 .ant-table .ant-table-tbody > tr:hover > td {
   background: var(--hover-tint) !important;
 }
 
+/* 空态:收敛默认内边距,与玻璃卡同族 */
+.ant-table .ant-table-placeholder {
+  background: transparent;
+}
+
 /* 描述列表:标签 Inter 小标、值等宽 */
 .ant-descriptions .ant-descriptions-item-label {
   font-family: var(--font-body);

package/app/pages/monitor.vue

@@ -293,73 +293,50 @@ const processColumns = computed(() => [
     </a-card>
 
     <template v-else>
-      <!-- 概要统计 -->
-      <a-row
-        :gutter="[16, 16]"
-        class="summary"
-      >
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.channels') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.channels ?? '–' }}
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.agents') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.agents ?? '–' }}
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.aliveProcesses') }}
-            </p>
-            <p class="stat-value aw-mono">
-              {{ snapshot?.counts.aliveProcesses ?? '–' }}
-              <span
-                v-if="(snapshot?.counts.orphanProcesses ?? 0) > 0"
-                class="orphan-badge"
-              >
-                +{{ snapshot?.counts.orphanProcesses }} {{ t('monitor.orphan') }}
-              </span>
-            </p>
-          </a-card>
-        </a-col>
-        <a-col
-          :xs="12"
-          :md="6"
-        >
-          <a-card class="aw-panel stat">
-            <p class="stat-label">
-              {{ t('monitor.server') }}
-            </p>
-            <p class="stat-value aw-mono small">
-              PID {{ snapshot?.serverPid ?? '–' }} · {{ snapshot ? uptimeText(snapshot.uptimeMs) : '' }}
-            </p>
-            <p class="stat-updated">
-              {{ lastUpdated }} · {{ t('monitor.updated') }} {{ snapshot?.generatedAt ?? '' }}
-            </p>
-          </a-card>
-        </a-col>
-      </a-row>
+      <!-- 概要统计(CSS grid:antd Grid 样式在部分构建下缺失,col 会退化 100% 宽) -->
+      <div class="stat-grid">
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.channels') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.channels ?? '–' }}
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.agents') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.agents ?? '–' }}
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.aliveProcesses') }}
+          </p>
+          <p class="stat-value aw-mono">
+            {{ snapshot?.counts.aliveProcesses ?? '–' }}
+            <span
+              v-if="(snapshot?.counts.orphanProcesses ?? 0) > 0"
+              class="orphan-badge"
+            >
+              +{{ snapshot?.counts.orphanProcesses }} {{ t('monitor.orphan') }}
+            </span>
+          </p>
+        </a-card>
+        <a-card class="aw-panel stat">
+          <p class="stat-label">
+            {{ t('monitor.server') }}
+          </p>
+          <p class="stat-value aw-mono small">
+            PID {{ snapshot?.serverPid ?? '–' }} · {{ snapshot ? uptimeText(snapshot.uptimeMs) : '' }}
+          </p>
+          <p class="stat-updated">
+            {{ lastUpdated }} · {{ t('monitor.updated') }} {{ snapshot?.generatedAt ?? '' }}
+          </p>
+        </a-card>
+      </div>
 
       <!-- ChannelRuntime 表 -->
       <a-card
@@ -603,10 +580,21 @@ const processColumns = computed(() => [
   align-items: center;
 }
 
-.summary {
+.stat-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 14px;
   margin-bottom: 16px;
 }
 
+@media (max-width: 1100px) {
+  .stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
+}
+
+@media (max-width: 640px) {
+  .stat-grid { grid-template-columns: 1fr; }
+}
+
 .stat {
   height: 100%;
 }

package/app/pages/permissions/index.vue

@@ -129,12 +129,12 @@ onMounted(load)
 
 <template>
   <div class="perm-page">
-    <header class="pg-head">
+    <header class="aw-page-head">
       <div>
         <p class="aw-kicker">
           agentworkshop / permissions
         </p>
-        <h1 class="pg-title">
+        <h1>
           {{ $t('permissions.title') }}
         </h1>
         <p class="pg-sub">
@@ -149,85 +149,90 @@ onMounted(load)
       />
     </header>
 
-    <a-table
-      :data-source="filteredUsers"
-      :loading="loading"
-      row-key="id"
-      size="middle"
-      :pagination="{ pageSize: 12, showSizeChanger: false }"
+    <a-card
+      :bordered="false"
+      class="table-card"
     >
-      <a-table-column
-        :title="$t('permissions.colUser')"
-        data-index="name"
+      <a-table
+        :data-source="filteredUsers"
+        :loading="loading"
+        row-key="id"
+        size="middle"
+        :pagination="{ pageSize: 12, showSizeChanger: false }"
       >
-        <template #default="{ record }">
-          <a @click.prevent="openDetail(record)">{{ record.name }}</a>
-        </template>
-      </a-table-column>
-      <a-table-column
-        :title="$t('permissions.colEmail')"
-        data-index="email"
-      />
-      <a-table-column
-        :title="$t('permissions.colRole')"
-        data-index="role"
-      >
-        <template #default="{ record }">
-          <a-tag :color="record.role === 'admin' ? 'green' : record.role === 'editor' ? 'blue' : 'default'">
-            {{ record.role }}
-          </a-tag>
-        </template>
-      </a-table-column>
-      <a-table-column
-        :title="$t('permissions.colStatus')"
-        data-index="status"
-      >
-        <template #default="{ record }">
-          <a-tag :color="record.status === 'active' ? 'cyan' : 'red'">
-            {{ record.status === 'active' ? $t('permissions.active') : record.status }}
-          </a-tag>
-        </template>
-      </a-table-column>
-      <a-table-column
-        :title="$t('permissions.colChannels')"
-        data-index="channels"
-      >
-        <template #default="{ record }">
-          {{ record.channels.length }}
-        </template>
-      </a-table-column>
-      <a-table-column
-        :title="$t('permissions.colGrants')"
-        data-index="grants"
-      >
-        <template #default="{ record }">
-          <a-tag
-            v-for="g in record.grants"
-            :key="g.lineId"
-            style="margin-bottom: 2px"
-          >
-            {{ (lines.find(l => l.id === g.lineId)?.name ?? g.lineId).slice(0, 14) }} · {{ modeTag(g.mode) }}
-          </a-tag>
-          <span
-            v-if="!record.grants.length"
-            class="dim"
-          >—</span>
-        </template>
-      </a-table-column>
-      <a-table-column
-        :title="$t('permissions.colOps')"
-        :width="90"
-      >
-        <template #default="{ record }">
-          <a-button
-            size="small"
-            @click="openDetail(record)"
-          >
-            {{ $t('permissions.manage') }}
-          </a-button>
-        </template>
-      </a-table-column>
-    </a-table>
+        <a-table-column
+          :title="$t('permissions.colUser')"
+          data-index="name"
+        >
+          <template #default="{ record }">
+            <a @click.prevent="openDetail(record)">{{ record.name }}</a>
+          </template>
+        </a-table-column>
+        <a-table-column
+          :title="$t('permissions.colEmail')"
+          data-index="email"
+        />
+        <a-table-column
+          :title="$t('permissions.colRole')"
+          data-index="role"
+        >
+          <template #default="{ record }">
+            <a-tag :color="record.role === 'admin' ? 'green' : record.role === 'editor' ? 'blue' : 'default'">
+              {{ record.role }}
+            </a-tag>
+          </template>
+        </a-table-column>
+        <a-table-column
+          :title="$t('permissions.colStatus')"
+          data-index="status"
+        >
+          <template #default="{ record }">
+            <a-tag :color="record.status === 'active' ? 'cyan' : 'red'">
+              {{ record.status === 'active' ? $t('permissions.active') : record.status }}
+            </a-tag>
+          </template>
+        </a-table-column>
+        <a-table-column
+          :title="$t('permissions.colChannels')"
+          data-index="channels"
+        >
+          <template #default="{ record }">
+            {{ record.channels.length }}
+          </template>
+        </a-table-column>
+        <a-table-column
+          :title="$t('permissions.colGrants')"
+          data-index="grants"
+        >
+          <template #default="{ record }">
+            <a-tag
+              v-for="g in record.grants"
+              :key="g.lineId"
+              style="margin-bottom: 2px"
+            >
+              {{ (lines.find(l => l.id === g.lineId)?.name ?? g.lineId).slice(0, 14) }} · {{ modeTag(g.mode) }}
+            </a-tag>
+            <span
+              v-if="!record.grants.length"
+              class="dim"
+            >—</span>
+          </template>
+        </a-table-column>
+        <a-table-column
+          :title="$t('permissions.colOps')"
+          :width="90"
+        >
+          <template #default="{ record }">
+            <a-button
+              size="small"
+              @click="openDetail(record)"
+            >
+              {{ $t('permissions.manage') }}
+            </a-button>
+          </template>
+        </a-table-column>
+      </a-table>
+    </a-card>
 
     <a-drawer
       v-model:open="drawerOpen"
@@ -313,9 +318,8 @@ onMounted(load)
 
 <style scoped lang="css">
 .perm-page { max-width: 1180px; margin: 0 auto; padding: 24px 20px 48px; }
-.pg-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
-.pg-title { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: .5px; }
-.pg-sub { margin: 4px 0 0; opacity: .6; font-size: 12px; }
+.pg-sub { margin: 8px 0 0; font-size: 12.5px; color: var(--ink-faint); }
+.table-card { margin-bottom: 16px; }
 .dim { opacity: .45; }
 .sec { margin: 20px 0 8px; font-size: 13px; font-weight: 700; }
 .detail dt { margin-top: 8px; font-size: 11px; opacity: .5; }

package/app/pages/plugins/index.vue

@@ -88,12 +88,12 @@ onMounted(load)
 
 <template>
   <div class="plugins-page">
-    <header class="pg-head">
+    <header class="aw-page-head">
       <div>
         <p class="aw-kicker">
           agentworkshop / plugins
         </p>
-        <h1 class="pg-title">
+        <h1>
           {{ $t('plugins.title') }}
         </h1>
         <p class="pg-sub">
@@ -136,7 +136,10 @@ onMounted(load)
       v-if="!plugins.length && !loading"
       class="pg-empty"
     >
-      {{ $t('plugins.empty') }}
+      <span class="i-tabler-puzzle pg-empty-ico" />
+      <p class="pg-empty-t">
+        {{ $t('plugins.empty') }}
+      </p>
     </div>
 
     <div class="pg-grid aw-stagger">
@@ -232,14 +235,16 @@ onMounted(load)
 
 <style scoped lang="css">
 .plugins-page { max-width: 1080px; margin: 0 auto; padding: 24px 20px 48px; }
-.pg-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
-.pg-title { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: .5px; }
-.pg-sub { margin: 4px 0 0; opacity: .6; font-size: 12px; }
+.pg-sub { margin: 8px 0 0; opacity: .6; font-size: 12.5px; }
 .pg-stats { display: flex; align-items: center; gap: 14px; font-size: 12px; opacity: .85; }
 .pg-stats b { font-size: 15px; }
 .pg-failures { margin-bottom: 16px; }
 .fail-line { font-family: ui-monospace, monospace; font-size: 11px; }
-.pg-empty { padding: 48px 0; text-align: center; opacity: .55; }
+.pg-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 56px 24px;
+  text-align: center; border: 1px dashed var(--line-strong); border-radius: var(--radius-panel);
+  background: var(--paper-deep); }
+.pg-empty-ico { font-size: 30px; color: var(--ink-fainter); }
+.pg-empty-t { margin: 0; font-size: 12.5px; color: var(--ink-faint); }
 .pg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
 .pg-card { position: relative; padding: 14px 16px; border: 1px solid var(--aw-border, rgba(128, 152, 199, .25));
   border-radius: 12px; background: var(--aw-card, rgba(255, 255, 255, .04)); cursor: pointer;