@givolt/i3-composer-agent 2.2.2 → 2.3.0

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelDetail.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelDetail.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" title="模型详情" data-bind-size="(760)" data-on-close="(emit('close'))"><div class="detail-heading"><div><h2>{{ (model.name) }}</h2><p class="mono muted">{{ (model.alias) }}</p></div><template data-component="ModelStatus" data-bind-model="(model)"></template></div><template data-component="Space" wrap="" class="detail-tags"><template data-component="Tag">平台统一接入</template><template data-component="Tag" data-each="cap in (model.capabilities)" data-bind-key="(cap)">{{ (cap) }}</template></template><template data-component="Descriptions" data-bind-items="(items)" data-bind-column="({ xs: 1, sm: 2, md: 2, lg: 2, xl: 2, xxl: 2 })" size="middle" bordered=""></template><section data-if="(session.readable('model:view', 'platform'))" class="drawer-section"><div class="section-heading"><h2>配置发布</h2><template data-component="Button" type="link" data-on-click="(emit('action', 'release', model))">查看发布</template></div><template data-component="Alert" show-icon="" data-bind-type="(model.publishState === 'failed' ? 'error' : 'info')" data-bind-title="('配置 v' + model.version + ' · ' + ({ draft: '待测试或发布', review: '评审中', published: '已发布', failed: '发布失败' }[model.publishState]))" data-bind-description="(model.liveVersion !== model.version ? '当前生效配置与草稿分别保留，新草稿不会自动覆盖当前运行版本。' : '当前配置已经发布，启停状态单独管理。')"></template></section><section class="drawer-section"><div class="section-heading"><h2>使用授权</h2><template data-component="Button" type="link" data-bind-disabled="(!session.can('model:grant', 'platform'))" data-on-click="(emit('action', 'grant', model))">管理授权</template></div><div data-each="g in (model.grants)" data-bind-key="(g.tenantId)" class="grant-scope"><h3>{{ (tenantLabel(g.tenantId)) }}</h3><p><template data-component="Tag" data-each="project in (g.projects)" data-bind-key="(project)">{{ (project) }}</template></p><p class="muted">Agent：{{ (g.agents.map(modelAgentLabel).join('、') || '未授权') }}</p></div><p data-if="(!model.grants.length)" class="muted">尚未分配使用授权</p><p>共享月额度：{{ (fmtNumber(model.quota)) }} Token</p></section><section data-if="(session.readable('model:view', 'platform'))" class="drawer-section"><div class="section-heading"><h2>资源引用 · {{ (model.references.length) }}</h2><template data-component="Button" type="link" data-on-click="(emit('action', 'references', model))">查看引用</template></div><p class="muted">{{ (model.references.length ? '被引用的模型不能直接删除，请先调整关联资源。' : '当前没有资源引用。') }}</p></section><template data-component="RecordMetadata" data-bind-record="(model)"></template><template data-slot="footer"><div class="drawer-footer"><template data-component="Button" data-on-click="(emit('close'))">关闭</template><template data-component="Space"><template data-component="Button" data-bind-disabled="(!session.can('model:edit', 'platform') || model.publishState === 'review')" data-on-click="(emit('action', 'edit', model))">编辑配置</template><template data-component="Button" type="primary" data-bind-disabled="(!session.can('model:test', 'platform') || model.publishState === 'review')" data-on-click="(emit('action', 'test', model))">连接测试</template></template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelDetail.js

@@ -0,0 +1,23 @@
+import { modelAgentLabel } from "../agents/registry.js";
+import { Drawer, Descriptions, Tag, Button, Space, Alert } from "../../runtime/widgets.js";
+import { computed } from '../../runtime/state.js';
+import { h } from '../../runtime/dom.js';
+import { fmtNumber } from "./data.js";
+import { useSession } from "../shared/session.js";
+import { tenantLabel } from "../shared/policy.js";
+import RecordMetadata from "../shared/RecordMetadata.js";
+import ModelStatus from "./ModelStatus.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelDetail', propKeys: ["model"], template: new URL('./ModelDetail.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props, emit = __emit, session = useSession();
+        const items = computed(() => [
+            { key: 'alias', label: '模型标识', content: props.model.alias }, { key: 'provider', label: '供应商', content: props.model.provider },
+            { key: 'type', label: '模型类型', content: props.model.kind === 'chat' ? '对话模型' : '向量模型' },
+            { key: 'version', label: '生效版本', content: props.model.liveVersion ? 'v' + props.model.liveVersion : '尚未发布' },
+            { key: 'endpoint', label: '服务地址', content: h('span', { class: 'mono wrap-anywhere' }, props.model.endpoint), span: 'filled' },
+            { key: 'credential', label: '凭据引用', content: h('span', { class: 'mono wrap-anywhere' }, props.model.credential), span: 'filled' },
+            { key: 'price', label: '演示单价', content: '输入 ¥' + props.model.inputPrice + ' / 输出 ¥' + props.model.outputPrice + '（每百万 Token）', span: 'filled' },
+            ...(props.model.kind === 'embedding' ? [{ key: 'dimension', label: '向量维度', content: props.model.dimension + ' 维' }] : []),
+        ]);
+        return { modelAgentLabel, Drawer, Descriptions, Tag, Button, Space, Alert, computed, h, fmtNumber, useSession, tenantLabel, RecordMetadata, ModelStatus, props, emit, session, items };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelEditor.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelEditor.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" data-bind-title="(model ? '编辑模型' : '接入模型')" data-bind-size="(720)" data-bind-mask="({ closable: false })" data-bind-keyboard="(!saving)" data-bind-closable="(!saving)" data-on-close="(close)"><template data-slot="extra"><template data-component="Button" size="small" type="text" data-bind-disabled="(saving)" data-on-click="(session.state = 'expired')">模拟登录失效</template></template><template data-component="Alert" class="form-intro" type="info" show-icon="" title="平台统一管理接入配置" data-bind-description="(model ? '保存生成新草稿；当前生效版本继续保留。新配置需测试并通过发布评审后生效。' : '保存为平台配置草稿，完成测试与发布评审后再启用并分配使用授权。')"></template><template data-component="Alert" data-if="(error)" class="form-intro" type="error" show-icon="" data-bind-title="(error)"></template><template data-component="ProForm" name="model-editor" data-bind-form="(form)" data-bind-grid="({ gutter: 24 })" data-bind-disabled="(saving || !store.canEdit)" data-bind-label-col="({ style: { width: '88px' } })" data-bind-wrapper-col="({ flex: 'auto' })" class="editor-form"></template><template data-component="RecordMetadata" data-if="(model)" data-bind-record="(model)"></template><template data-slot="footer"><div class="drawer-footer"><span class="muted">保存草稿不会直接发布</span><template data-component="Space"><template data-component="Button" data-bind-disabled="(saving)" data-on-click="(close)">取消</template><template data-component="Button" type="primary" data-bind-loading="(saving)" data-bind-disabled="(!store.canEdit)" data-on-click="(save)">保存草稿</template></template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelEditor.js

@@ -0,0 +1,78 @@
+import { confirmAction } from "../shell/confirmation.js";
+import { computed, ref } from '../../runtime/state.js';
+import { Alert, Button, Drawer, Space, message } from "../../runtime/widgets.js";
+import { ProForm, useForm } from "../../runtime/widgets.js";
+import { clone, credentials, providers } from "./data.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import { metadata } from "../shared/policy.js";
+import RecordMetadata from "../shared/RecordMetadata.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelEditor', propKeys: ["model"], template: new URL('./ModelEditor.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props;
+        const emit = __emit;
+        const store = useModels(), session = useSession(), saving = ref(false), error = ref('');
+        const initial = props.model ? clone(props.model) : {
+            ...metadata(session.actor, '', 'platform'), grants: [], references: [], publishState: 'draft',
+            id: crypto.randomUUID(), name: '', alias: '', provider: '', kind: 'chat', endpoint: '', credential: '', capabilities: ['文本'],
+            inputPrice: 0, outputPrice: 0, enabled: false, health: 'untested', projects: [], agents: [], quota: 1000000, version: 1, updatedAt: '',
+        };
+        const form = useForm(clone(initial));
+        const required = (label) => [{ required: true, whitespace: true, message: `请输入${label}` }];
+        form.fields.value = [
+            { path: 'name', label: '模型名称', component: 'input', placeholder: '例如：报修分诊模型', span: 12, xs: 24, sm: 12, rules: required('模型名称') },
+            { path: 'alias', label: '模型标识', component: 'input', placeholder: '例如：triage-chat', span: 12, xs: 24, sm: 12, extra: '小写字母、数字、短横线，2–64 位', rules: [...required('模型标识'), { pattern: /^[a-z][a-z0-9-]{1,63}$/, message: '请输入 2–64 位有效模型标识' }, { validator: async (_rule, value) => { if (store.models.some(m => m.id !== initial.id && m.alias === value?.trim()))
+                            throw new Error('模型标识已存在，请更换'); } }] },
+            { path: 'provider', label: '供应商', component: 'select', placeholder: '请选择供应商', options: providers.map(x => ({ label: x, value: x })), span: 12, xs: 24, sm: 12, rules: [{ required: true, message: '请选择供应商' }] },
+            { path: 'kind', label: '模型类型', component: 'select', options: [{ label: '对话模型', value: 'chat' }, { label: '向量模型', value: 'embedding' }], allowClear: false, span: 12, xs: 24, sm: 12 },
+            { path: 'endpoint', label: '服务地址', component: 'input', placeholder: 'https://models.example.invalid/v1', span: 24, extra: '填写服务端点；原型不会向该地址发送请求。', rules: [...required('服务地址'), { type: 'url', message: '请输入完整有效的 HTTP 或 HTTPS 地址' }, { pattern: /^https?:\/\//, message: '请输入 HTTP 或 HTTPS 地址' }] },
+            { path: 'credential', label: '凭据引用', component: 'select', options: credentials, placeholder: '请选择受管凭据', span: 24, extra: '仅选择演示凭据引用，不填写真实 API Key。', rules: [{ required: true, message: '请选择凭据引用' }] },
+            { path: 'capabilities', label: '声明能力', component: 'select', mode: 'multiple', options: ['文本', '工具调用', '推理', '视觉'].map(x => ({ label: x, value: x })), span: 24, hidden: computed(() => form.formData.kind === 'embedding'), rules: computed(() => form.formData.kind === 'chat' ? [{ required: true, type: 'array', min: 1, message: '请选择至少一项能力' }] : []) },
+            { path: 'dimension', label: '向量维度', component: 'input-number', min: 1, max: 65536, precision: 0, span: 24, hidden: computed(() => form.formData.kind !== 'embedding'), rules: computed(() => form.formData.kind === 'embedding' ? [{ required: true, message: '请输入向量维度' }] : []) },
+            { path: 'inputPrice', label: '输入单价', component: 'input-number', min: 0, precision: 4, span: 12, xs: 24, sm: 12, extra: '元 / 百万 Token（演示）', rules: [{ required: true, type: 'number', min: 0, message: '请输入有效的非负输入单价' }] },
+            { path: 'outputPrice', label: '输出单价', component: 'input-number', min: 0, precision: 4, span: 12, xs: 24, sm: 12, extra: '元 / 百万 Token（演示）', hidden: computed(() => form.formData.kind === 'embedding'), rules: computed(() => form.formData.kind === 'chat' ? [{ required: true, type: 'number', min: 0, message: '请输入有效的非负输出单价' }] : []) },
+        ];
+        function close() {
+            if (saving.value)
+                return;
+            if (JSON.stringify(form.formData) !== JSON.stringify(initial))
+                confirmAction({ title: '放弃未保存的修改？', content: '关闭后本次输入不会保存。', okText: '放弃修改', cancelText: '继续编辑', onOk: () => emit('close') });
+            else
+                emit('close');
+        }
+        async function save() {
+            if (!store.canEdit)
+                return;
+            try {
+                await form.formRef.value?.validate();
+            }
+            catch {
+                return;
+            }
+            saving.value = true;
+            await new Promise(resolve => setTimeout(resolve, 400));
+            const value = clone(form.formData);
+            value.name = value.name.trim();
+            value.alias = value.alias.trim();
+            value.endpoint = value.endpoint.trim();
+            value.version = props.model ? props.model.version + 1 : 1;
+            if (value.kind === 'embedding') {
+                value.capabilities = ['向量'];
+                value.outputPrice = 0;
+            }
+            else
+                delete value.dimension;
+            try {
+                error.value = '';
+                if (store.save(value, !props.model))
+                    emit('saved', value.id);
+            }
+            catch (e) {
+                error.value = e.message;
+            }
+            finally {
+                saving.value = false;
+            }
+        }
+        return { confirmAction, computed, ref, Alert, Button, Drawer, Space, message, ProForm, useForm, clone, credentials, providers, useModels, useSession, metadata, RecordMetadata, props, emit, store, session, saving, error, initial, form, required, close, save };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelGrant.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelGrant.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" title="管理模型使用授权" data-bind-size="(660)" data-bind-mask="({ closable: false })" data-on-close="(!saving &amp;&amp; emit('close'))"><h2>{{ (model.name) }}</h2><template data-component="Alert" class="form-intro" type="info" show-icon="" title="模型配置由平台维护" description="所选 Agent 会获准在该租户的全部所选项目中使用此模型，候选项随项目联动。调用须同时匹配租户、项目和 Agent。使用授权不包含编辑源配置或转授权；全部留空表示撤销使用授权。"></template><template data-component="ProForm" name="model-grant" data-bind-form="(form)" data-bind-disabled="(saving || !session.can('model:grant', 'platform'))" data-bind-grid="({ gutter: 24 })" data-bind-label-col="({ style: { width: '104px' } })" data-bind-wrapper-col="({ flex: 'auto' })"></template><template data-component="Alert" data-if="(error)" type="error" show-icon="" data-bind-title="(error)"></template><template data-slot="footer"><div class="drawer-footer"><span class="muted">授权关系与资源引用分别管理</span><template data-component="Space"><template data-component="Button" data-bind-disabled="(saving)" data-on-click="(emit('close'))">取消</template><template data-component="Button" type="primary" data-bind-loading="(saving)" data-bind-disabled="(!session.can('model:grant', 'platform'))" data-on-click="(save)">保存授权</template></template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelGrant.js

@@ -0,0 +1,55 @@
+import { computed, ref, watch } from '../../runtime/state.js';
+import { Alert, Button, Drawer, Space } from "../../runtime/widgets.js";
+import { ProForm, useForm } from "../../runtime/widgets.js";
+import { agentCatalog, projectCatalog } from "./data.js";
+import { useModels } from "./store.js";
+import { modelAgentEntries, modelProjectEntries } from "../agents/registry.js";
+import { useSession } from "../shared/session.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelGrant', propKeys: ["model"], template: new URL('./ModelGrant.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props, emit = __emit;
+        const store = useModels(), session = useSession(), saving = ref(false), error = ref(''), expected = props.model.recordVersion;
+        const group = (tenant) => props.model.grants.find(g => g.tenantId === tenant);
+        const form = useForm({ heatingProjects: [...(group('heating')?.projects || [])], heatingAgents: [...(group('heating')?.agents || [])], northProjects: [...(group('north')?.projects || [])], northAgents: [...(group('north')?.agents || [])], quota: props.model.quota });
+        const catalog = computed(() => { const entries = new Map(agentCatalog.map(a => [a.value, { ...a, label: a.value }])); for (const a of modelAgentEntries()) {
+            const old = entries.get(a.value);
+            entries.set(a.value, { ...a, projects: [...new Set([...(old?.projects || []), ...a.projects])] });
+        } return [...entries.values()]; });
+        const projects = computed(() => [...projectCatalog, ...modelProjectEntries()].filter((a, i, all) => all.findIndex(b => b.value === a.value && b.tenantId === a.tenantId) === i));
+        const options = (p) => catalog.value.filter(a => p.length && p.every(v => a.projects.includes(v))).map(a => ({ label: a.label, value: a.value }));
+        form.fields.value = [
+            { path: 'heatingProjects', label: '供热 · 项目', component: 'select', mode: 'multiple', span: 24, options: computed(() => projects.value.filter(p => p.tenantId === 'heating').map(p => ({ label: p.value, value: p.value }))), placeholder: '选择供热事业部项目' },
+            { path: 'heatingAgents', label: '供热 · Agent', component: 'select', mode: 'multiple', span: 24, options: computed(() => options(form.formData.heatingProjects)), disabled: computed(() => !form.formData.heatingProjects.length), placeholder: '选择在上述项目中允许使用的 Agent' },
+            { path: 'northProjects', label: '北方 · 项目', component: 'select', mode: 'multiple', span: 24, options: computed(() => projects.value.filter(p => p.tenantId === 'north').map(p => ({ label: p.value, value: p.value }))), placeholder: '选择北方能源项目' },
+            { path: 'northAgents', label: '北方 · Agent', component: 'select', mode: 'multiple', span: 24, options: computed(() => options(form.formData.northProjects)), disabled: computed(() => !form.formData.northProjects.length), placeholder: '选择在上述项目中允许使用的 Agent' },
+            { path: 'quota', label: '共享月额度', component: 'input-number', span: 24, min: 1, max: 10000000000, precision: 0, extra: 'Token；沿用所选范围共享额度的演示口径，正式扣减规则待 spec。', rules: [{ required: true, message: '请输入额度' }] },
+        ];
+        watch(() => form.formData.heatingProjects, p => { form.formData.heatingAgents = form.formData.heatingAgents.filter(a => options(p).some(o => o.value === a)); }, { deep: true });
+        watch(() => form.formData.northProjects, p => { form.formData.northAgents = form.formData.northAgents.filter(a => options(p).some(o => o.value === a)); }, { deep: true });
+        async function save() {
+            if (saving.value)
+                return;
+            try {
+                await form.formRef.value?.validate();
+            }
+            catch {
+                return;
+            }
+            saving.value = true;
+            error.value = '';
+            try {
+                await new Promise(r => setTimeout(r, 350));
+                const d = form.formData;
+                const grants = [{ tenantId: 'heating', projects: d.heatingProjects, agents: d.heatingAgents }, { tenantId: 'north', projects: d.northProjects, agents: d.northAgents }].filter(g => g.projects.length || g.agents.length);
+                store.grant(props.model.id, grants, Number(d.quota), expected);
+                emit('close');
+            }
+            catch (e) {
+                error.value = e.message;
+            }
+            finally {
+                saving.value = false;
+            }
+        }
+        return { computed, ref, watch, Alert, Button, Drawer, Space, ProForm, useForm, agentCatalog, projectCatalog, useModels, modelAgentEntries, modelProjectEntries, useSession, props, emit, store, session, saving, error, expected, group, form, catalog, projects, options, save };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelReferences.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelReferences.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" data-bind-title="(deleting ? '删除模型' : '资源引用')" data-bind-size="(600)" data-on-close="(emit('close'))"><h2>{{ (model.name) }}</h2><template data-component="Alert" data-if="(deleting)" class="form-intro" data-bind-type="(reason ? 'warning' : 'info')" show-icon="" data-bind-title="(reason || '确认删除此模型？')" description="删除后从可用列表移除，基础信息和操作记录仍保留。提交时会再次检查资源引用。"></template><section class="drawer-section"><h2>引用此模型的资源 · {{ (model.references.length) }}</h2><div data-each="item in (model.references)" data-bind-key="(item.name)" class="reference-row"><div><strong>{{ (item.name) }}</strong><p class="muted">{{ (item.kind) }} · {{ (item.version) }}</p></div><template data-component="Tag">正在引用</template></div><p data-if="(!model.references.length)" class="muted">当前没有资源引用。授权关系不等同于资源引用。</p></section><template data-component="Alert" data-if="(error)" type="error" data-bind-title="(error)"></template><template data-slot="footer"><div class="drawer-footer"><template data-component="Button" data-on-click="(emit('close'))">返回</template><template data-component="Button" data-if="(deleting)" danger="" type="primary" data-bind-disabled="(!!reason || !session.can('model:delete', 'platform'))" data-on-click="(remove)">确认删除</template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelReferences.js

@@ -0,0 +1,26 @@
+import { ref, computed } from '../../runtime/state.js';
+import { Alert, Button, Drawer, Tag } from "../../runtime/widgets.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import { assertDelete } from "./domain.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelReferences', propKeys: ["model", "deleting"], template: new URL('./ModelReferences.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props, emit = __emit;
+        const store = useModels(), session = useSession(), error = ref('');
+        const expected = props.model.recordVersion;
+        const reason = computed(() => { try {
+            assertDelete(props.model);
+            return '';
+        }
+        catch (e) {
+            return e.message;
+        } });
+        function remove() { try {
+            store.remove(props.model.id, expected);
+            emit('close');
+        }
+        catch (e) {
+            error.value = e.message;
+        } }
+        return { ref, computed, Alert, Button, Drawer, Tag, useModels, useSession, assertDelete, props, emit, store, session, error, expected, reason, remove };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelRelease.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelRelease.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" title="配置发布" data-bind-size="(640)" data-bind-mask="({ closable: false })" data-on-close="(!busy &amp;&amp; emit('close'))"><div class="detail-heading"><div><h2>{{ (model.name) }}</h2><p class="mono muted">{{ (model.alias) }}</p></div><template data-component="Tag" data-bind-color="(model.publishState === 'published' ? 'green' : 'blue')">{{ ({ draft: '待发布', review: '评审中', published: '已发布', failed: '发布失败' }[model.publishState]) }}</template></div><div class="version-comparison"><div><span>当前生效版本</span><strong>{{ (model.liveVersion ? 'v' + model.liveVersion : '尚未发布') }}</strong><small>{{ (model.publishedBy || '平台初始配置') }} {{ (model.publishedAt ? formatDate(model.publishedAt) : '') }}</small></div><div><span>本次配置</span><strong>v{{ (model.version) }}</strong><small>{{ (model.testedVersion === model.version ? '本版本模拟测试通过' : '等待本版本测试') }}</small></div></div><section class="drawer-section"><h2>变更内容</h2><p data-if="(!changes.length)">与当前发布版本一致</p><div data-else="" class="config-diff"><table><thead><tr><th>字段</th><th>当前生效</th><th>待发布</th></tr></thead><tbody><tr data-each="d in (diff)" data-bind-key="(d.key)"><th>{{ (d.label) }}</th><td>{{ (d.before) }}</td><td>{{ (d.after) }}</td></tr></tbody></table></div><p class="muted">配置草稿、测试结果和发布结果分别记录。发布成功前，当前生效配置保持不变。</p></section><template data-component="Alert" data-if="(model.requestId)" class="form-intro" type="info" show-icon="" title="发布申请（演示）" data-bind-description="(model.requestId + ' · 申请人：' + model.requestName)"></template><template data-component="Alert" data-if="(model.publishState === 'review' &amp;&amp; !session.can('model:publish', 'platform'))" class="form-intro" type="info" show-icon="" title="等待配置审核员评审" description="可在页头切换到配置审核员，查看同一申请并给出评审结果。"></template><section data-if="(model.publishState === 'review' &amp;&amp; session.can('model:publish', 'platform'))" class="drawer-section"><label for="release-note" class="answer-label">评审意见</label><template data-component="Input.TextArea" id="release-note" data-model-value="(note)" data-bind-rows="(3)" data-bind-maxlength="(500)" placeholder="请说明发布或退回的理由"></template></section><template data-component="Alert" data-if="(model.publishNote)" class="form-intro" data-bind-type="(model.publishState === 'failed' ? 'error' : model.publishState === 'published' ? 'success' : 'warning')" show-icon="" data-bind-title="(model.publishNote)"></template><template data-component="Alert" data-if="(error)" type="error" show-icon="" data-bind-title="(error)"></template><p class="muted">本页模拟配置评审与发布，不提交真实 GitLab PR 或修改运行环境。</p><template data-slot="footer"><div class="drawer-footer"><template data-component="Button" data-bind-disabled="(busy)" data-on-click="(emit('close'))">关闭</template><template data-component="Space" data-if="(model.publishState === 'review' &amp;&amp; session.can('model:publish', 'platform'))"><template data-component="Button" danger="" data-bind-disabled="(busy)" data-on-click="(act('reject'))">退回修改</template><template data-component="Button" type="primary" data-bind-loading="(busy)" data-on-click="(act('approve'))">同意并发布</template></template><template data-component="Button" data-else="" type="primary" data-bind-loading="(busy)" data-bind-disabled="(!session.can('model:edit', 'platform') || model.publishState === 'review' || model.liveVersion === model.version || model.testedVersion !== model.version)" data-on-click="(act('submit'))">提交发布申请</template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelRelease.js

@@ -0,0 +1,38 @@
+import { ref, computed } from '../../runtime/state.js';
+import { Alert, Button, Drawer, Input, Space, Tag } from "../../runtime/widgets.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import { formatDate } from "../shared/policy.js";
+import { modelConfigKeys } from "./domain.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelRelease', propKeys: ["model"], template: new URL('./ModelRelease.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props, emit = __emit;
+        const store = useModels(), session = useSession(), note = ref(''), error = ref(''), busy = ref(false);
+        const labels = { name: '名称', alias: '标识', provider: '供应商', kind: '类型', endpoint: '服务地址', credential: '凭据引用', capabilities: '能力', inputPrice: '输入价格', outputPrice: '输出价格', dimension: '向量维度' };
+        const changes = computed(() => modelConfigKeys.filter(k => JSON.stringify(props.model[k]) !== JSON.stringify(props.model.liveConfig?.[k])).map(k => labels[k]));
+        const diff = computed(() => modelConfigKeys.filter(k => JSON.stringify(props.model[k]) !== JSON.stringify(props.model.liveConfig?.[k])).map(k => ({ key: k, label: labels[k], before: display(props.model.liveConfig?.[k]), after: display(props.model[k]) })));
+        function display(value) { return value === undefined || value === '' ? '未设置' : Array.isArray(value) ? value.join('、') : String(value); }
+        async function act(action) {
+            if (busy.value)
+                return;
+            const expected = props.model.recordVersion, actor = session.actor.id;
+            busy.value = true;
+            error.value = '';
+            try {
+                await new Promise(r => setTimeout(r, 500));
+                if (actor !== session.actor.id)
+                    throw new Error('身份已改变，请重新核对。');
+                if (action === 'submit')
+                    store.submit(props.model.id, expected);
+                else
+                    store.review(props.model.id, expected, action === 'approve', note.value);
+            }
+            catch (e) {
+                error.value = e.message;
+            }
+            finally {
+                busy.value = false;
+            }
+        }
+        return { ref, computed, Alert, Button, Drawer, Input, Space, Tag, useModels, useSession, formatDate, modelConfigKeys, props, emit, store, session, note, error, busy, labels, changes, diff, display, act };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelStatus.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelStatus.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<div class="model-status"><div><span class="status-dot" data-bind-class="(model.enabled ? (model.health === 'error' ? 'error' : 'success') : 'neutral')"></span><span>{{ (model.enabled ? '已启用' : '已停用') }}</span></div><span class="health-text" data-bind-class="(model.health)">{{ (healthText) }}</span></div>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelStatus.js

@@ -0,0 +1,7 @@
+import { computed } from '../../runtime/state.js';
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelStatus', propKeys: ["model"], template: new URL('./ModelStatus.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props;
+        const healthText = computed(() => ({ normal: '连接正常', error: '连接异常', untested: '未测试' })[props.model.health]);
+        return { computed, props, healthText };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelTable.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelTable.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<section class="filter-panel panel" aria-label="模型筛选"><template data-component="ProForm" name="model-search" data-bind-form="(filters)" data-bind-grid="({ gutter: 24 })" class="filter-form" data-on-keydown.enter.prevent="(search)"></template><div class="filter-actions"><template data-component="Button" data-on-click="(search)">查询</template><template data-component="Button" data-on-click="(reset)">重置</template></div></section><section class="panel model-table-panel" aria-label="已接入模型列表"><template data-component="Result" data-if="(store.scene === 'error')" status="warning" title="模型列表加载失败"><template data-slot="extra"><template data-component="Button" type="primary" data-on-click="(retry)">重试</template></template></template><template data-component="ProTable" data-else="" data-bind-table="(table)" data-bind-search="(async () =&gt; { })" data-bind-control="(false)" data-bind-table-container="(false)" data-bind-loading="(loading)" data-bind-row-selection="(selection.rowSelection.value)" row-key="id" size="middle" data-bind-scroll="({ x: 'max-content' })" data-bind-pagination="({ showTotal: (n) =&gt; '共 ' + n + ' 条', showSizeChanger: true, pageSizeOptions: [10, 20, 50, 100] })" data-bind-locale="({ emptyText: h(Empty, { description: store.scene === 'empty' ? '还没有接入模型' : '没有符合条件的模型' }, { default: () =&gt; h(Button, { onClick: store.scene === 'empty' ? () =&gt; emit('create') : reset, disabled: store.scene === 'empty' &amp;&amp; !store.canEdit }, () =&gt; store.scene === 'empty' ? '接入第一个模型' : '清除筛选') }) })"><template data-slot="button-bar"><div class="list-heading"><h2>已接入模型 · {{ (filtered.length) }}</h2><template data-component="ListBatchBar" data-bind-count="(selection.keys.value.length)" data-bind-allowed="(session.can('model:delete', 'platform'))" data-on-remove="(batchDelete)" data-on-clear="(selection.clear)"></template></div></template><template data-slot="toolbar"><div class="table-tools"><template data-component="Select" data-model-value="(sort)" aria-label="模型排序" data-bind-options="([{ label: '创建时间倒序', value: 'created' }, { label: '修改时间倒序', value: 'updated' }, { label: '名称排序', value: 'name' }])"></template><template data-component="ColumnSettings" data-bind-preferences="(prefs)"></template><template data-component="Button" aria-label="刷新模型列表" data-bind-loading="(loading)" data-on-click="(refresh)"><template data-component="ReloadOutlined"></template></template></div></template></template></section><template data-component="ListDeleteDialog" data-if="(deleteTargets.length)" data-model-targets="(deleteTargets)" label="模型" data-bind-check="(store.checkRemove)" data-bind-submit="(store.removeMany)" data-on-close="(deleteTargets = [])" data-on-deleted="(deleted)"></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelTable.js

@@ -0,0 +1,72 @@
+import { computed, onMounted, ref, watch } from '../../runtime/state.js';
+import { h } from '../../runtime/dom.js';
+import { Button, Empty, Result, Tag, Select } from "../../runtime/widgets.js";
+import { ReloadOutlined } from "../../runtime/icons.js";
+import { ProForm, ProTable, useForm, useTable } from "../../runtime/widgets.js";
+import { providers } from "./data.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import { formatDate } from "../shared/policy.js";
+import { useColumns } from "../shared/columns.js";
+import ColumnSettings from "../shared/ColumnSettings.js";
+import { useListSelection } from "../shared/listSelection.js";
+import ListBatchBar from "../shared/ListBatchBar.js";
+import ListDeleteDialog from "../shared/ListDeleteDialog.js";
+import ModelStatus from "./ModelStatus.js";
+import RowActions from "./RowActions.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelTable', propKeys: [], template: new URL('./ModelTable.html', import.meta.url).href, setup(__props, __emit) {
+        const emit = __emit, store = useModels(), session = useSession(), loading = ref(false), sort = ref('created');
+        const applied = ref({ keyword: '', provider: '', status: '' });
+        const filters = useForm({ ...applied.value }, [
+            { path: 'keyword', label: '模型名称', component: 'input', placeholder: '搜索名称或标识', span: 9, xs: 24, md: 9 },
+            { path: 'provider', label: '供应商', component: 'select', placeholder: '全部供应商', options: providers.map(p => ({ label: p, value: p })), span: 8, xs: 24, md: 8 },
+            { path: 'status', label: '状态', component: 'select', placeholder: '全部状态', options: [{ label: '已启用', value: 'enabled' }, { label: '已停用', value: 'disabled' }, { label: '待发布', value: 'draft' }, { label: '评审中', value: 'review' }, { label: '连接异常', value: 'error' }], span: 7, xs: 24, md: 7 },
+        ]);
+        const filtered = computed(() => {
+            if (store.scene !== 'normal')
+                return [];
+            const q = applied.value.keyword.trim().toLowerCase(), status = applied.value.status;
+            return store.models.filter(m => (!q || (m.name + ' ' + m.alias).toLowerCase().includes(q)) && (!applied.value.provider || m.provider === applied.value.provider) &&
+                (!status || status === 'enabled' && m.enabled || status === 'disabled' && !m.enabled || status === 'error' && m.health === 'error' || status === m.publishState))
+                .sort((a, b) => sort.value === 'name' ? a.name.localeCompare(b.name, 'zh-CN') : ((sort.value === 'updated' ? b.updatedAt : b.createdAt).localeCompare(sort.value === 'updated' ? a.updatedAt : a.createdAt) || a.id.localeCompare(b.id)));
+        });
+        const render = (fn) => (_, m) => fn(m);
+        const prefs = useColumns('models', [
+            { key: 'name', label: '模型', locked: true }, { key: 'provider', label: '供应商', defaultVisible: true }, { key: 'capabilities', label: '能力', defaultVisible: true },
+            { key: 'scope', label: '授权范围', defaultVisible: true }, { key: 'status', label: '状态', defaultVisible: true }, { key: 'version', label: '生效 / 草稿', defaultVisible: true },
+            { key: 'createdBy', label: '创建人' }, { key: 'createdAt', label: '创建时间' }, { key: 'createdDept', label: '创建部门' }, { key: 'updatedBy', label: '修改人' }, { key: 'updatedAt', label: '修改时间' }, { key: 'actions', label: '操作', locked: true },
+        ]);
+        const table = useTable({ pageParam: { current: 1, pageSize: 10, total: 0 }, columns: [
+                { key: 'name', title: '模型', dataIndex: 'name', width: 215, render: render(m => h('div', { class: 'model-name-cell' }, [h('button', { class: 'text-button model-link', onClick: () => emit('action', 'detail', m) }, m.name), h('span', { class: 'mono muted' }, m.alias)])) },
+                { key: 'provider', title: '供应商', dataIndex: 'provider', width: 145 },
+                { key: 'capabilities', title: '能力', width: 155, render: render(m => h('div', { class: 'capabilities' }, m.capabilities.map(c => h(Tag, { bordered: false }, () => c)))) },
+                { key: 'scope', title: '授权范围', width: 130, render: render(m => h('button', { class: 'text-button scope-link', onClick: () => emit('action', session.can('model:grant', 'platform') ? 'grant' : 'detail', m) }, m.grants.length ? m.grants.length + ' 个租户 · ' + m.projects.length + ' 个项目' : '暂未授权')) },
+                { key: 'status', title: '状态', width: 130, render: render(m => h(ModelStatus, { model: m })) },
+                { key: 'version', title: '生效 / 草稿', width: 140, render: render(m => h('div', { class: 'model-name-cell' }, [h('span', m.liveVersion ? '生效 v' + m.liveVersion : '尚未发布'), h('span', { class: 'muted' }, m.liveVersion === m.version ? '无待发布变更' : 'v' + m.version + ' · ' + ({ draft: '待发布', review: '评审中', failed: '发布失败', published: '已发布' }[m.publishState]))])) },
+                { key: 'createdBy', title: '创建人', dataIndex: 'createdBy', width: 105 }, { key: 'createdAt', title: '创建时间', dataIndex: 'createdAt', width: 180, render: (v) => formatDate(String(v)) },
+                { key: 'createdDept', title: '创建部门', dataIndex: 'createdDept', width: 140 }, { key: 'updatedBy', title: '修改人', dataIndex: 'updatedBy', width: 105 },
+                { key: 'updatedAt', title: '修改时间', dataIndex: 'updatedAt', width: 180, render: (v) => formatDate(String(v)) },
+                { key: 'actions', title: '操作', fixed: 'right', width: 120, render: render(m => h(RowActions, { model: m, onAction: (a, x) => emit('action', a, x) })) },
+            ] });
+        const deleteTargets = ref([]);
+        const selection = useListSelection(table.dataSource, computed(() => JSON.stringify([applied.value, sort.value, session.key, store.scene, table.pageParam.current, table.pageParam.pageSize])), computed(() => session.can('model:delete', 'platform')), m => m.name);
+        function batchDelete() { deleteTargets.value = selection.selected.value.map(m => ({ id: m.id, name: m.name, recordVersion: m.recordVersion })); }
+        function deleted() { deleteTargets.value = []; selection.clear(); }
+        const catalog = new Map(table.columns.value.map(c => [c.key, c]));
+        watch(prefs.keys, keys => { table.columns.value = keys.map(k => catalog.get(k)).filter(Boolean); }, { immediate: true });
+        watch([filtered, () => table.pageParam.current, () => table.pageParam.pageSize], () => {
+            const size = table.pageParam.pageSize || 10, max = Math.max(1, Math.ceil(filtered.value.length / size));
+            if ((table.pageParam.current || 1) > max)
+                table.setPageParam({ current: max });
+            const start = ((table.pageParam.current || 1) - 1) * size;
+            table.dataSource.value = filtered.value.slice(start, start + size);
+            table.setPageParam({ total: filtered.value.length });
+        }, { immediate: true });
+        async function refresh() { selection.clear(); loading.value = true; await new Promise(r => setTimeout(r, 300)); loading.value = false; }
+        function search() { applied.value = { keyword: filters.formData.keyword || '', provider: filters.formData.provider || '', status: filters.formData.status || '' }; table.setPageParam({ current: 1 }); }
+        function reset() { filters.setFormData({ keyword: '', provider: '', status: '' }); search(); }
+        function retry() { store.scene = 'normal'; refresh(); }
+        onMounted(refresh);
+        return { computed, onMounted, ref, watch, h, Button, Empty, Result, Tag, Select, ReloadOutlined, ProForm, ProTable, useForm, useTable, providers, useModels, useSession, formatDate, useColumns, ColumnSettings, useListSelection, ListBatchBar, ListDeleteDialog, ModelStatus, RowActions, emit, store, session, loading, sort, applied, filters, filtered, render, prefs, table, deleteTargets, selection, batchDelete, deleted, catalog, refresh, search, reset, retry };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelTester.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelTester.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<template data-component="Drawer" data-bind-open="(true)" title="模型连接测试" data-bind-size="(640)" data-on-close="(close)"><div class="detail-heading"><div><h2>{{ (model.name) }}</h2><p class="mono muted">{{ (model.alias) }} · v{{ (model.version) }}</p></div><template data-component="Tag">模拟测试</template></div><template data-component="Alert" type="info" show-icon="" title="本次测试仅演示交互，不会调用真实模型。" description="可切换成功与失败场景，观察结果和后续操作。"></template><section class="drawer-section"><h2>模拟结果</h2><template data-component="RadioGroup" data-model-value="(outcome)" data-bind-disabled="(running)" data-bind-options="([{ label: '连接成功', value: 'success' }, { label: '连接超时', value: 'failure' }])"></template></section><section class="drawer-section"><template data-component="Steps" data-bind-current="(result === 'success' ? 3 : stage)" data-bind-status="(result === 'failure' ? 'error' : 'process')" data-bind-items="(stages)" size="small"></template></section><div data-if="(running)" class="test-wait" role="status"><template data-component="LoadingOutlined" spin=""></template><h2>正在验证模型接入</h2><p>正在模拟{{ (stages[stage]?.title) }}…</p></div><div data-else-if="(result)" class="test-result" data-bind-class="(result)" role="status"><template data-component="CheckCircleOutlined" data-if="(result === 'success')"></template><template data-component="CloseCircleOutlined" data-else=""></template><h2>{{ (result === 'success' ? '模型连接测试通过' : '模型连接超时') }}</h2><p>{{ (result === 'success' ? '配置与声明能力已通过模拟检查。' : '请检查服务地址、凭据引用及供应商服务状态。') }}</p><p data-if="(result === 'success')" class="muted">模拟响应耗时：480 ms · 此数值不代表真实性能</p><p data-else="" class="mono muted">DEMO_CONNECTION_TIMEOUT · 模拟错误</p></div><div data-else="" class="test-wait"><p class="muted">开始测试后，这里将显示各项检查结果。</p></div><template data-component="Alert" data-if="(error)" type="error" show-icon="" data-bind-title="(error)"></template><template data-component="Alert" data-if="(result === 'success')" type="info" show-icon="" title="测试通过后，请前往“配置发布”提交评审。" description="本地测试不代表真实协议兼容或发布成功；正式验证需要分别覆盖工具调用、结构化输出、流式、usage 和错误语义。"></template><template data-slot="footer"><div class="drawer-footer"><template data-component="Button" data-on-click="(close)">{{ (running ? '取消测试并关闭' : '关闭') }}</template><template data-component="Button" type="primary" data-bind-loading="(running)" data-bind-disabled="(!session.can('model:test', 'platform'))" data-on-click="(run)">{{ (result ? '重新测试' : '开始测试') }}</template></div></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelTester.js

@@ -0,0 +1,46 @@
+import { computed, onBeforeUnmount, ref } from '../../runtime/state.js';
+import { Alert, Button, Drawer, RadioGroup, Steps, Tag, Space, message } from "../../runtime/widgets.js";
+import { CheckCircleOutlined, CloseCircleOutlined, LoadingOutlined } from "../../runtime/icons.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelTester', propKeys: ["model"], template: new URL('./ModelTester.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props;
+        const emit = __emit;
+        const store = useModels(), running = ref(false), stage = ref(0), outcome = ref(props.model.health === 'error' ? 'failure' : 'success');
+        const session = useSession(), error = ref('');
+        const result = ref(null);
+        let timer;
+        const stages = computed(() => [{ title: '检查配置' }, { title: '验证连接' }, { title: props.model.kind === 'embedding' ? '向量能力' : '声明能力' }]);
+        function run() {
+            if (!session.can('model:test', 'platform') || running.value)
+                return;
+            running.value = true;
+            stage.value = 0;
+            result.value = null;
+            const version = props.model.version, id = props.model.id, chosen = outcome.value;
+            timer = setInterval(() => {
+                if (stage.value < 2)
+                    stage.value++;
+                else {
+                    clearInterval(timer);
+                    timer = undefined;
+                    running.value = false;
+                    try {
+                        store.test(id, version, chosen === 'success');
+                        result.value = chosen;
+                        error.value = '';
+                    }
+                    catch (e) {
+                        result.value = null;
+                        error.value = e.message;
+                    }
+                }
+            }, 450);
+        }
+        function close() { if (timer)
+            clearInterval(timer); timer = undefined; emit('close'); }
+        onBeforeUnmount(() => { if (timer)
+            clearInterval(timer); });
+        return { computed, onBeforeUnmount, ref, Alert, Button, Drawer, RadioGroup, Steps, Tag, Space, message, CheckCircleOutlined, CloseCircleOutlined, LoadingOutlined, useModels, useSession, props, emit, store, running, stage, outcome, session, error, result, timer, stages, run, close };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelsPage.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/ModelsPage.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<div class="page-heading"><div><h1>模型管理</h1><p>平台统一接入，按租户、项目与 Agent 分配使用授权。</p></div><template data-component="Button" type="primary" data-bind-disabled="(!session.can('model:edit', 'platform'))" data-on-click="(create)"><template data-component="PlusOutlined"></template>接入模型</template></div><template data-component="Alert" data-if="(!session.readable('model:view', 'platform'))" class="page-alert" type="info" show-icon="" title="当前展示本租户已获授权的模型" description="接入配置由平台维护；使用授权不包含编辑或转授权权限。"></template><template data-component="Alert" data-if="(store.persistenceError)" class="page-alert" type="warning" show-icon="" title="浏览器暂时无法保存演示数据，请保留当前输入后重试。"></template><template data-component="Tabs" data-model-active-key="(tab)" data-bind-items="(tabs)" class="model-tabs"></template><template data-component="ModelTable" data-if="(tab === 'list')" data-on-action="(action)" data-on-create="(create)"></template><template data-component="UsagePanel" data-else-if="(tab === 'usage')"></template><template data-component="AuditPanel" data-else-if="(session.can('model:audit', 'platform'))"></template><template data-component="ModelEditor" data-if="(overlay === 'edit')" data-bind-model="(selected)" data-on-close="(close)" data-on-saved="(saved)"></template><template data-component="ModelDetail" data-if="(overlay === 'detail' &amp;&amp; selected)" data-bind-model="(selected)" data-on-close="(close)" data-on-action="(action)"></template><template data-component="ModelTester" data-if="(overlay === 'test' &amp;&amp; selected)" data-bind-model="(selected)" data-on-close="(close)"></template><template data-component="ModelGrant" data-if="(overlay === 'grant' &amp;&amp; selected)" data-bind-model="(selected)" data-on-close="(close)"></template><template data-component="ModelRelease" data-if="(overlay === 'release' &amp;&amp; selected)" data-bind-model="(selected)" data-on-close="(close)"></template><template data-component="ModelReferences" data-if="((overlay === 'references' || overlay === 'delete') &amp;&amp; selected)" data-bind-model="(selected)" data-bind-deleting="(overlay === 'delete')" data-on-close="(close)"></template><template data-component="Drawer" data-if="(overlay === 'detail' &amp;&amp; !selected)" data-bind-open="(true)" title="模型访问" data-bind-size="(600)" data-on-close="(close)"><template data-component="Result" status="403" title="无法访问此模型" sub-title="记录不存在、已被删除或不在当前授权范围。"><template data-slot="extra"><template data-component="Button" data-on-click="(close)">返回列表</template></template></template></template>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/ModelsPage.js

@@ -0,0 +1,52 @@
+import { confirmAction } from "../shell/confirmation.js";
+import { computed, ref, watch } from '../../runtime/state.js';
+import { useRoute, useRouter } from "../../runtime/router.js";
+import { Alert, Button, Tabs, Result, Drawer, message } from "../../runtime/widgets.js";
+import { PlusOutlined } from "../../runtime/icons.js";
+import { useModels } from "./store.js";
+import { useSession } from "../shared/session.js";
+import ModelTable from "./ModelTable.js";
+import ModelEditor from "./ModelEditor.js";
+import ModelDetail from "./ModelDetail.js";
+import ModelTester from "./ModelTester.js";
+import ModelGrant from "./ModelGrant.js";
+import ModelRelease from "./ModelRelease.js";
+import ModelReferences from "./ModelReferences.js";
+import UsagePanel from "./UsagePanel.js";
+import AuditPanel from "./AuditPanel.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'ModelsPage', propKeys: [], template: new URL('./ModelsPage.html', import.meta.url).href, setup(__props, __emit) {
+        const store = useModels(), session = useSession(), route = useRoute(), router = useRouter(), tab = ref('list'), selectedId = ref(null);
+        const overlay = ref(null), selected = computed(() => store.models.find(m => m.id === selectedId.value));
+        const tabs = computed(() => [{ key: 'list', label: '模型列表' }, { key: 'usage', label: '用量概览' }, ...(session.can('model:audit', 'platform') ? [{ key: 'audit', label: '操作记录' }] : [])]);
+        function close() { overlay.value = null; selectedId.value = null; if (route.query.model)
+            router.replace('/models'); }
+        watch(() => session.actorId, () => { close(); tab.value = 'list'; });
+        watch(() => route.query.model, id => { if (typeof id === 'string') {
+            selectedId.value = id;
+            overlay.value = 'detail';
+        } }, { immediate: true });
+        function create() { if (session.can('model:edit', 'platform')) {
+            selectedId.value = null;
+            overlay.value = 'edit';
+        } }
+        function action(name, model) {
+            selectedId.value = model.id;
+            if (name === 'toggle') {
+                confirmAction({ title: model.enabled ? '停用' + model.name : '启用' + model.name, content: model.enabled ? '停用后阻止新调用。当前生效版本与历史记录保留；在途任务策略仍待运行契约验证。' : '启用已发布的配置。草稿保存或测试成功不能替代发布。', okText: model.enabled ? '确认停用' : '确认启用', cancelText: '取消', okButtonProps: { danger: model.enabled }, onOk: () => { try {
+                        store.toggle(model.id, model.recordVersion);
+                        message.success('状态已更新（演示）');
+                    }
+                    catch (e) {
+                        message.error(e.message);
+                        return Promise.reject(e);
+                    } } });
+                return;
+            }
+            overlay.value = name;
+            if (name === 'detail')
+                router.replace({ path: '/models', query: { model: model.id } });
+        }
+        function saved(id) { selectedId.value = id; overlay.value = 'detail'; message.success('草稿已保存，当前生效版本保持不变'); }
+        return { confirmAction, computed, ref, watch, useRoute, useRouter, Alert, Button, Tabs, Result, Drawer, message, PlusOutlined, useModels, useSession, ModelTable, ModelEditor, ModelDetail, ModelTester, ModelGrant, ModelRelease, ModelReferences, UsagePanel, AuditPanel, store, session, route, router, tab, selectedId, overlay, selected, tabs, close, create, action, saved };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/RowActions.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/RowActions.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<div class="row-actions"><template data-component="Button" type="text" class="link-button" data-bind-disabled="(!session.can('model:test', 'platform') || model.publishState === 'review')" data-bind-aria-label="('测试' + model.name)" data-on-click="(emit('action', 'test', model))">测试</template><template data-component="ListMore" data-bind-name="(model.name)" data-bind-items="(items)" data-on-action="(emit('action', $event, model))"></template></div>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/RowActions.js

@@ -0,0 +1,19 @@
+import { computed } from '../../runtime/state.js';
+import { Button } from "../../runtime/widgets.js";
+import ListMore from "../shared/ListMore.js";
+import { useSession } from "../shared/session.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'RowActions', propKeys: ["model"], template: new URL('./RowActions.html', import.meta.url).href, setup(__props, __emit) {
+        const props = __props, emit = __emit, session = useSession();
+        const items = computed(() => [
+            { key: 'detail', label: '查看详情' },
+            { key: 'edit', label: '编辑配置', disabled: !session.can('model:edit', 'platform') || props.model.publishState === 'review' },
+            { key: 'release', label: props.model.publishState === 'review' ? '查看发布申请' : '配置发布', disabled: !session.readable('model:view', 'platform') },
+            { key: 'grant', label: '使用授权', disabled: !session.can('model:grant', 'platform') },
+            { key: 'references', label: '资源引用', disabled: !session.readable('model:view', 'platform') },
+            { type: 'divider' },
+            { key: 'toggle', label: props.model.enabled ? '停用模型' : '启用模型', disabled: !session.can('model:status', 'platform') },
+            { key: 'delete', label: '删除模型', danger: true, disabled: !session.can('model:delete', 'platform') },
+        ]);
+        return { computed, Button, ListMore, useSession, props, emit, session, items };
+    } });

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/UsagePanel.html

@@ -0,0 +1,2 @@
+<!-- 来源：src/models/UsagePanel.vue；HTML / 原生 DOM 绑定，不含 Vue 运行时。 -->
+<section class="panel usage-panel"><div class="section-heading"><h2>模型用量</h2><div class="usage-filters"><template data-component="Select" data-model-value="(period)" aria-label="用量周期" data-bind-options="([{ label: '最近 7 天', value: 7 }, { label: '最近 30 天', value: 30 }])"></template><template data-component="Select" data-model-value="(project)" aria-label="用量项目" data-bind-options="([{ label: '全部项目', value: 'all' }, ...projects.map(p =&gt; ({ label: p, value: p }))])"></template></div></div><template data-component="Alert" type="info" show-icon="" title="演示用量与价格，仅用于确认展示口径；不代表真实账单。"></template><div class="usage-metrics"><div><span>Token 总量</span><strong>{{ (fmtNumber(totals.tokens)) }}</strong><small>输入 + 输出</small></div><div><span>模型调用</span><strong>{{ (fmtNumber(totals.requests)) }}</strong><small>次 · 所选周期</small></div><div><span>估算费用</span><strong>{{ (money(totals.cost)) }}</strong><small>人民币 · 按演示单价计算</small></div></div><template data-component="ProTable" data-bind-table="(table)" data-bind-table-container="(false)" data-bind-control="(false)" row-key="id" data-bind-scroll="({ x: 780 })" data-bind-pagination="({ showTotal: (t) =&gt; `共 ${t} 条`, hideOnSinglePage: false })"></template><p class="muted">估算公式：输入 Token × 输入单价 + 输出 Token × 输出单价；单价以每百万 Token 计。</p></section>

package/skills/i3-ui-prototype/assets/templates/enterprise-admin/reference/src/models/UsagePanel.js

@@ -0,0 +1,30 @@
+import { computed, ref, watch } from '../../runtime/state.js';
+import { h } from '../../runtime/dom.js';
+import { Alert, Select } from "../../runtime/widgets.js";
+import { ProTable, useTable } from "../../runtime/widgets.js";
+import { fmtNumber } from "./data.js";
+import { useModels } from "./store.js";
+import { createComponent } from '../../runtime/dom.js';
+export default createComponent({ name: 'UsagePanel', propKeys: [], template: new URL('./UsagePanel.html', import.meta.url).href, setup(__props, __emit) {
+        const store = useModels(), period = ref(7), project = ref('all');
+        const projects = computed(() => [...new Set(store.models.flatMap(m => m.projects))]);
+        const rows = computed(() => store.models.map(m => {
+            const i = Number(m.id.replace('demo-', '')) - 1;
+            const included = project.value === 'all' || m.projects.includes(project.value);
+            const factor = (period.value === 7 ? 1 : 4) * (project.value === 'all' ? Math.max(1, m.projects.length) : 1);
+            const requests = m.id.startsWith('demo-') && m.projects.length && included ? (680 + (5 - i) * 147) * factor : 0;
+            const input = requests * 1120, output = m.kind === 'embedding' ? 0 : requests * 360;
+            return { id: m.id, name: m.name, requests, input, output, cost: (input * m.inputPrice + output * m.outputPrice) / 1000000 };
+        }).filter(r => project.value === 'all' || r.requests > 0));
+        const totals = computed(() => rows.value.reduce((a, x) => ({ tokens: a.tokens + x.input + x.output, requests: a.requests + x.requests, cost: a.cost + x.cost }), { tokens: 0, requests: 0, cost: 0 }));
+        const money = (n) => `¥${n.toLocaleString('zh-CN', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+        const table = useTable({ columns: [
+                { title: '模型', dataIndex: 'name', width: 210 },
+                { title: '调用次数', dataIndex: 'requests', align: 'right', render: (text) => fmtNumber(Number(text)) },
+                { title: '输入 Token', dataIndex: 'input', align: 'right', render: (text) => fmtNumber(Number(text)) },
+                { title: '输出 Token', dataIndex: 'output', align: 'right', render: (text) => fmtNumber(Number(text)) },
+                { title: '估算费用（元）', dataIndex: 'cost', align: 'right', width: 180, render: (text) => h('strong', money(Number(text))) },
+            ] });
+        watch(rows, () => { table.dataSource.value = rows.value; table.setPageParam({ total: rows.value.length }); }, { immediate: true });
+        return { computed, ref, watch, h, Alert, Select, ProTable, useTable, fmtNumber, useModels, store, period, project, projects, rows, totals, money, table };
+    } });