eric
/
Eric-ontology


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272
							<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>格士立 AI 市场中枢</title>
  <link rel="stylesheet" href="/static/styles.css?v=7">
</head>
<body>
  <header class="app-header">
    <div class="brand-block">
      <span class="brand-mark" aria-hidden="true">G</span>
      <div>
        <strong>GESLI</strong>
        <span>格士立物流科技</span>
      </div>
    </div>

    <nav class="view-switcher" aria-label="工作台视图">
      <button class="view-tab is-active" type="button" data-view="market">AI 市场中枢</button>
      <button class="view-tab" type="button" data-view="mock">Mock 数据台</button>
      <button class="view-tab" type="button" data-view="operations">履约操作台</button>
    </nav>

    <div class="system-status">
      <span class="status-dot" aria-hidden="true"></span>
      <span id="systemStatus">本地知识图谱</span>
    </div>
  </header>

  <main>
    <section id="marketView" class="app-view is-active" aria-labelledby="marketTitle">
      <aside class="inquiry-rail">
        <div class="rail-heading">
          <span class="section-index">01</span>
          <div>
            <h1 id="marketTitle">客户询价</h1>
            <p id="inquiryState">待生成</p>
          </div>
        </div>

        <form id="inquiryForm" class="inquiry-form">
          <label class="field field-wide">
            <span>客户</span>
            <select id="customer" name="customer" required></select>
          </label>

          <label class="field">
            <span>起运地</span>
            <select id="origin" name="origin" required></select>
          </label>

          <label class="field">
            <span>目的地</span>
            <select id="destination" name="destination" required></select>
          </label>

          <label class="field">
            <span>货物名称</span>
            <input id="cargoName" name="cargo_name" type="text" required>
          </label>

          <label class="field">
            <span>货量</span>
            <input id="cargoVolume" name="cargo_volume" type="number" min="0.1" step="0.1" required>
          </label>

          <label class="field">
            <span>询价日期</span>
            <input id="evaluationDate" name="evaluation_date" type="date" required>
          </label>

          <label class="field">
            <span>要求起运</span>
            <input id="departureDate" name="requested_departure_date" type="date" required>
          </label>

          <label class="field">
            <span>最长运输天数</span>
            <input id="maxTransitDays" name="max_transit_days" type="number" min="1" step="1" required>
          </label>

          <label class="field">
            <span>目标报价 CNY</span>
            <input id="targetAmount" name="target_amount" type="number" min="1" step="100" required>
          </label>

          <label class="field field-wide">
            <span>路由偏好</span>
            <select id="routeType" name="preferred_route_type"></select>
          </label>

          <label class="toggle-row field-wide">
            <input id="dangerousGoods" name="dangerous_goods" type="checkbox">
            <span class="toggle-control" aria-hidden="true"></span>
            <span>危险品运输需求</span>
          </label>

          <button id="recommendBtn" class="primary-command field-wide" type="button">
            <span>生成市场方案</span>
            <span aria-hidden="true">→</span>
          </button>
        </form>

        <div class="rail-foot">
          <span>决策模式</span>
          <strong>规则引擎 · 可解释</strong>
        </div>
      </aside>

      <div class="market-workspace">
        <section class="decision-header" aria-label="决策摘要">
          <div>
            <span class="section-kicker">MARKET DECISION / 实时</span>
            <h2 id="decisionTitle">正在加载市场上下文</h2>
          </div>
          <button id="auditBtn" class="secondary-command" type="button" disabled>查看决策审计</button>
        </section>

        <section id="pipeline" class="pipeline" aria-label="决策管线"></section>

        <section id="recommendationBand" class="recommendation-band is-loading" aria-live="polite">
          <div class="loading-block">
            <span class="loading-line"></span>
            <span class="loading-line short"></span>
          </div>
        </section>

        <section class="candidate-section">
          <div class="section-heading">
            <div>
              <span class="section-index">02</span>
              <h2>候选方案</h2>
            </div>
            <span id="candidateMeta" class="section-meta">等待计算</span>
          </div>
          <div id="candidateGrid" class="candidate-grid"></div>
        </section>

        <section class="rejected-section">
          <div class="section-heading">
            <div>
              <span class="section-index">03</span>
              <h2>硬条件过滤</h2>
            </div>
            <span id="rejectedMeta" class="section-meta">0 个淘汰候选</span>
          </div>
          <div id="rejectedList" class="rejected-list"></div>
        </section>
      </div>
    </section>

    <section id="mockView" class="app-view mock-view" aria-labelledby="mockTitle">
      <div class="mock-heading">
        <div>
          <span class="section-kicker">LOCAL RDF / VOLATILE DATA</span>
          <h1 id="mockTitle">Mock 数据台</h1>
          <p>当前内存图中的客户、路线、产品、供应商、报价与供应商合作信息</p>
        </div>
        <div class="mock-actions">
          <span class="volatile-label">重启即清空动态数据</span>
          <button id="resetMockBtn" class="secondary-command" type="button">重置内存数据</button>
        </div>
      </div>

      <section id="mockSummary" class="data-summary" aria-label="本地数据统计"></section>

      <section class="mock-generator" aria-labelledby="mockGeneratorTitle">
        <div class="generator-copy">
          <span class="section-index">01</span>
          <div>
            <h2 id="mockGeneratorTitle">动态补充样本</h2>
            <p id="mockStatus">印度目的港样本，仅写入当前进程的 RDF Graph</p>
          </div>
        </div>
        <div class="generator-controls">
          <label class="compact-field route-field">
            <span>目标路线</span>
            <select id="mockRoute"></select>
          </label>
          <label class="compact-field">
            <span>供应商数量</span>
            <input id="mockSupplierCount" type="number" min="1" max="8" value="4">
          </label>
          <label class="compact-field">
            <span>客户数量</span>
            <input id="mockCustomerCount" type="number" min="0" max="5" value="2">
          </label>
          <button id="generateMockBtn" class="primary-command" type="button">
            <span>添加一批 Mock 数据</span><span aria-hidden="true">+</span>
          </button>
        </div>
      </section>

      <section class="catalog-section">
        <div class="catalog-heading">
          <div>
            <span class="section-index">02</span>
            <h2>数据目录</h2>
          </div>
          <nav class="catalog-tabs" aria-label="Mock 数据分类">
            <button class="catalog-tab is-active" type="button" data-catalog="routes">路线供给</button>
            <button class="catalog-tab" type="button" data-catalog="customers">客户画像</button>
            <button class="catalog-tab" type="button" data-catalog="quotes">供应商报价</button>
            <button class="catalog-tab" type="button" data-catalog="strategies">市场策略</button>
          </nav>
        </div>
        <div id="mockCatalogTable" class="catalog-table"></div>
      </section>

      <section class="source-section">
        <div>
          <span class="section-index">03</span>
          <h2>加载来源</h2>
        </div>
        <div id="mockSources" class="source-list"></div>
      </section>
    </section>

    <section id="operationsView" class="app-view operations-view" aria-labelledby="operationsTitle">
      <div class="operations-heading">
        <div>
          <span class="section-kicker">GLOBAL SHIPMENT / 履约</span>
          <h1 id="operationsTitle">青岛出口操作台</h1>
          <p>订单、节点、异常、风险与关键时限</p>
        </div>
        <button id="refreshBtn" class="secondary-command" type="button">刷新数据</button>
      </div>

      <div class="operations-layout">
        <section class="panel">
          <div class="panel-title"><h2>订单状态</h2><span id="ordersCount">0</span></div>
          <div id="orders" class="table-wrap"></div>
        </section>
        <section class="panel">
          <div class="panel-title"><h2>风险订单</h2><span id="risksCount">0</span></div>
          <div id="risks" class="table-wrap"></div>
        </section>
        <section class="panel wide">
          <div class="panel-title"><h2>标准流程</h2><span>1–14</span></div>
          <div id="flow" class="timeline"></div>
        </section>
        <section class="panel wide">
          <div class="panel-title"><h2>节点时间状态</h2><span id="nodeTimesCount">0</span></div>
          <div id="nodeTimes" class="table-wrap"></div>
        </section>
        <section class="panel">
          <div class="panel-title"><h2>订单关键时限</h2><span id="cutoffsCount">0</span></div>
          <div id="cutoffs" class="table-wrap"></div>
        </section>
        <section class="panel">
          <div class="panel-title"><h2>异常影响</h2><span id="exceptionMapCount">0</span></div>
          <div id="exceptionMap" class="table-wrap"></div>
        </section>
      </div>
    </section>
  </main>

  <dialog id="auditDialog" class="audit-dialog">
    <div class="dialog-heading">
      <div>
        <span class="section-kicker">DECISION EXPLAINED</span>
        <h2>这次方案为什么这样选</h2>
      </div>
      <button id="closeAuditBtn" class="icon-command" type="button" aria-label="关闭">×</button>
    </div>
    <div id="auditContent" class="audit-content"></div>
  </dialog>

  <script src="/static/app.js?v=8"></script>
</body>
</html>