@pactor-app/skills 1.24.0

package/prd-to-app/template/src/server/yaml/common/dashboard.yaml

@@ -0,0 +1,498 @@
+dsl: "1.0"
+page:
+  id: dashboard
+  title: 仪表盘
+  name: dashboard
+  description: GateWeave 运营概览：核心指标、趋势分析、用量构成
+state:
+  range:
+    start: 2026-09-22
+    end: 2026-09-28
+  trendMetric: requests
+dataSources:
+  dashboard:
+    type: http
+    autoLoad: true
+    request:
+      method: GET
+      url: /api/data/dashboard
+      params:
+        start: ${state.range.start}
+        end: ${state.range.end}
+body:
+  type: Page
+  children:
+    - type: Flex
+      props:
+        justify: space-between
+        align: center
+      children:
+        - type: Flex
+          props:
+            align: baseline
+            gap: middle
+          children:
+            - type: Typography
+              props:
+                variant: h3
+                text: 仪表盘
+            - type: Typography
+              props:
+                variant: muted
+                text: GateWeave — 运营概览
+        - type: Flex
+          props:
+            align: center
+            gap: middle
+          children:
+            - type: Text
+              props:
+                text: 实时 ${data.dashboard.realtime.rpm} RPM · ${data.dashboard.realtime.tpm} TPM
+                type: secondary
+                className: tabular-nums
+            - type: Button
+              props:
+                text: ↻ 刷新
+                size: small
+              events:
+                onClick:
+                  - action: reload
+                    params:
+                      dataSource: dashboard
+                  - action: message
+                    params:
+                      messageType: success
+                      text: 看板数据已刷新
+    - type: Card
+      children:
+        - type: Flex
+          props:
+            align: center
+            gap: middle
+          children:
+            - type: Text
+              props:
+                text: 分析时间范围
+                strong: true
+            - type: DatePicker
+              props:
+                mode: range
+                value: ${state.range}
+                placeholder: 选择时间范围
+                style:
+                  width: 280
+                presets:
+                  - label: 今天
+                    days: 1
+                  - key: thisWeek
+                  - key: thisMonth
+                  - label: 近3天
+                    days: 3
+                  - label: 近7天
+                    days: 7
+                  - label: 近14天
+                    days: 14
+                  - label: 近30天
+                    days: 30
+              events:
+                onChange:
+                  - action: setState
+                    condition: ${event}
+                    params:
+                      range: ${event}
+                  - action: reload
+                    condition: ${event}
+                    params:
+                      dataSource: dashboard
+    - type: Typography
+      props:
+        variant: h4
+        text: 核心概览 · ${state.range.start} — ${state.range.end}
+    - type: Grid
+      props:
+        columns: 4
+        gap: 16
+      children:
+        - type: Card
+          props:
+            className: stat-card
+          children:
+            - type: Flex
+              props:
+                justify: space-between
+                align: start
+              children:
+                - type: Statistic
+                  props:
+                    title: 请求量
+                    value: ${data.dashboard.stats.requests}
+                - type: Icon
+                  props:
+                    name: chart
+                    size: lg
+                    className: stat-card-icon
+            - type: Typography
+              props:
+                variant: muted
+                text: ${data.dashboard.stats.activeClients} 位活跃客户端 ·
+                  ${data.dashboard.stats.tokens} Token
+        - type: Card
+          props:
+            className: stat-card
+          children:
+            - type: Flex
+              props:
+                justify: space-between
+                align: start
+              children:
+                - type: Statistic
+                  props:
+                    title: 成功率
+                    value: ${data.dashboard.stats.successRate}
+                    suffix: "%"
+                - type: Icon
+                  props:
+                    name: check-circle
+                    size: lg
+                    className: stat-card-icon
+            - type: Button
+              props:
+                text: ${data.dashboard.stats.failures} 个失败 · 错误率
+                  ${data.dashboard.stats.errorRate}%
+                variant: link
+                size: small
+                style:
+                  alignSelf: flex-start
+                className: p-0
+              events:
+                onClick:
+                  - action: message
+                    params:
+                      messageType: info
+                      text: 跳转调用日志（失败筛选，演示：目标页建设中）
+        - type: Card
+          props:
+            className: stat-card
+          children:
+            - type: Flex
+              props:
+                justify: space-between
+                align: start
+              children:
+                - type: Statistic
+                  props:
+                    title: 平均响应时间
+                    value: ${data.dashboard.stats.avgLatency}
+                    suffix: " ms"
+                - type: Icon
+                  props:
+                    name: clock
+                    size: lg
+                    className: stat-card-icon
+            - type: Button
+              props:
+                text: 查看可靠性分析 →
+                variant: link
+                size: small
+                style:
+                  alignSelf: flex-start
+                className: p-0
+              events:
+                onClick:
+                  - action: message
+                    params:
+                      messageType: info
+                      text: 跳转供应商可用性（演示：目标页建设中）
+        - type: Card
+          props:
+            className: stat-card
+          children:
+            - type: Flex
+              props:
+                justify: space-between
+                align: start
+              children:
+                - type: Statistic
+                  props:
+                    title: 计费金额
+                    value: ${data.dashboard.stats.cost}
+                - type: Icon
+                  props:
+                    name: credit-card
+                    size: lg
+                    className: stat-card-icon
+            - type: Typography
+              props:
+                variant: muted
+                text: 平均每次 ${data.dashboard.stats.avgCost}
+    - type: Card
+      props:
+        title: 趋势分析
+      children:
+        - type: Flex
+          props:
+            justify: space-between
+            align: center
+          children:
+            - type: Typography
+              props:
+                variant: muted
+                text: 观察流量变化与异常峰值
+            - type: ToggleGroup
+              props:
+                value: ${state.trendMetric}
+                options:
+                  - label: 请求
+                    value: requests
+                  - label: Token
+                    value: tokens
+                  - label: 费用
+                    value: cost
+                  - label: 延迟
+                    value: latency
+              events:
+                onChange:
+                  - action: setState
+                    condition: ${event}
+                    params:
+                      trendMetric: ${event}
+        - type: AreaChart
+          props:
+            data: ${data.dashboard.trend}
+            xKey: t
+            yKeys: ${data.dashboard.metricKeys[state.trendMetric]}
+            style:
+              height: 320
+    - type: Grid
+      props:
+        columns: 2
+        gap: 16
+      children:
+        - type: Card
+          props:
+            title: 用量构成 · 模型
+          children:
+            - type: Typography
+              props:
+                variant: muted
+                text: 按请求量分布，识别主要模型流量来源
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[0].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.models[0].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[0].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[1].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.models[1].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[1].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[2].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.models[2].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[2].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[3].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.models[3].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.models[3].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Button
+              props:
+                text: 查看全部 → 模型用量
+                variant: link
+                size: small
+                style:
+                  alignSelf: flex-start
+                className: p-0
+              events:
+                onClick:
+                  - action: message
+                    params:
+                      messageType: info
+                      text: 跳转模型用量（演示：目标页建设中）
+        - type: Card
+          props:
+            title: 用量构成 · 客户端
+          children:
+            - type: Typography
+              props:
+                variant: muted
+                text: 按请求量分布，识别主要客户端流量来源
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[0].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.clients[0].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[0].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[1].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.clients[1].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[1].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[2].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.clients[2].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[2].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Flex
+              props:
+                align: center
+                gap: middle
+              children:
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[3].name}
+                    style:
+                      width: 110
+                - type: Progress
+                  props:
+                    value: ${data.dashboard.clients[3].percent}
+                    style:
+                      flex: 1
+                - type: Text
+                  props:
+                    text: ${data.dashboard.clients[3].percent}%
+                    type: secondary
+                    className: tabular-nums
+                    style:
+                      width: 40
+                      textAlign: right
+            - type: Button
+              props:
+                text: 查看全部 → 客户端用量
+                variant: link
+                size: small
+                style:
+                  alignSelf: flex-start
+                className: p-0
+              events:
+                onClick:
+                  - action: message
+                    params:
+                      messageType: info
+                      text: 跳转客户端用量（演示：目标页建设中）

package/prd-to-app/template/src/server/yaml/common/login.yaml

@@ -0,0 +1,84 @@
+# 登录页 DSL：卡片结构 + 提交/错误提示/跳转闭环，视觉样式在 app/login.css。
+# 全屏渐变外壳（login-page 类）由 sitemap.yaml 的 login 布局提供，
+# 提交动作为内置 request（POST /api/auth/login 写会话 cookie）+ app.reload
+# 整页重载，sitemap 端点按已登录会话重新下发。
+dsl: "1.0"
+page:
+  id: login
+  title: 登录
+  name: login
+  description: 登录页
+
+body:
+  type: Card
+  props:
+    className: login-card
+  children:
+    - type: Text
+      props:
+        text: RESTRICTED ACCESS
+        className: login-eyebrow
+    - type: Text
+      props:
+        text: 管理后台登录
+        className: login-heading
+    - type: Text
+      props:
+        text: 仅已分配平台审核角色的管理人员可以访问。
+        type: secondary
+        className: login-subtitle
+    - type: Form
+      props:
+        name: login
+        style: { marginTop: 16 }
+      events:
+        onSubmit:
+          - id: loginResult
+            action: request
+            params:
+              method: POST
+              url: http://localhost:9011/api/auth/login
+              body:
+                username: ${event.username}
+                password: ${event.password}
+          - action: if
+            params:
+              condition: ${actions.loginResult == null || actions.loginResult.token == null}
+              then:
+                - action: message
+                  params:
+                    messageType: error
+                    text: 用户名或密码错误（演示账号 admin / pactor123）
+          - action: if
+            params:
+              condition: ${actions.loginResult != null && actions.loginResult.token != null}
+              then:
+                - action: message
+                  params:
+                    messageType: success
+                    text: 登录成功，正在跳转…
+                - action: app.reload
+                  params: { to: / }
+      children:
+        - type: Input
+          props:
+            name: username
+            label: 用户名
+            placeholder: 请输入用户名
+            rules:
+              - { required: true, message: 请输入用户名 }
+        - type: Input
+          props:
+            name: password
+            label: 密码
+            type: password
+            placeholder: 请输入密码
+            rules:
+              - { required: true, message: 请输入密码 }
+        - type: Button
+          props:
+            text: 登 录
+            variant: primary
+            submit: true
+            size: large
+            style: { width: 100%, marginTop: 8 }