{% extends "base.html" %}

{% block title %}MCP 中心{% endblock %}

{% block content %}
  <section class="page-header">
    <span class="eyebrow">MCP Connectors</span>
    <h1 class="page-title">外部 MCP 能力导入与协同接入中心</h1>
    <p class="page-lead">MCP 页面说明平台不是封闭工作台，它可以导入法规源、飞书通知、模板服务和企业数据源，但仍服务于注册审核这一条主线。</p>
  </section>

  <section class="card-grid">
    {% for connector in mcp_connectors %}
      <article class="panel" style="padding: 20px;">
        <div class="badge-row">
          <span class="pill">{{ connector.kind }}</span>
          <span class="pill {% if connector.status == '已连接' %}pill-success{% elif connector.status == '待验证' %}pill-signal{% else %}pill-danger{% endif %}">{{ connector.status }}</span>
        </div>
        <h3 style="margin-top: 16px;">{{ connector.name }}</h3>
        <p class="muted">鉴权方式：{{ connector.auth }}</p>
        <p>最近同步：{{ connector.sync }}</p>
      </article>
    {% endfor %}
  </section>

  <section class="layout-two-columns">
    <article class="panel">
      <div class="section-heading">
        <div>
          <h2 class="section-title">导入向导</h2>
          <p class="section-copy">原型用一个简洁流程展示外部能力如何进入平台。</p>
        </div>
      </div>
      <div class="flow-strip">
        <article class="flow-node">
          <div class="flow-index">01</div>
          <h3>选择能力类型</h3>
          <p>法规源、协同工具、模板服务或企业主数据。</p>
        </article>
        <article class="flow-node">
          <div class="flow-index">02</div>
          <h3>完成鉴权</h3>
          <p>支持 API Key、App Token、文件轮询和 MCP Bridge。</p>
        </article>
        <article class="flow-node">
          <div class="flow-index">03</div>
          <h3>定义输入输出契约</h3>
          <p>明确它向 Agent 暴露什么能力、返回什么结构。</p>
        </article>
        <article class="flow-node">
          <div class="flow-index">04</div>
          <h3>纳入审核编排</h3>
          <p>由 Skill 或 Agent 任务按需调用，不在页面层散落实现。</p>
        </article>
      </div>
    </article>

    <article class="panel">
      <h2 class="section-title">本题重点接入建议</h2>
      <ul class="detail-list">
        <li class="detail-item"><strong>飞书任务通知</strong> 把高风险项和责任人通知闭环到群聊机器人或会话入口。</li>
        <li class="detail-item"><strong>Word 模板服务</strong> 用于报送版式输出与模板回填能力。</li>
        <li class="detail-item"><strong>法规规则源</strong> 为后续规则包更新和版本治理提供自动化入口。</li>
      </ul>
    </article>
  </section>
{% endblock %}