web server

web-server/views/application-detail.ejs

@@ -0,0 +1,120 @@
+<%- include('partials/page-start') %>
+
+<section class="page">
+  <div class="page-header">
+    <div>
+      <div class="breadcrumb"><a href="/applications">Applications</a><span>/</span><span><%= application.code %></span></div>
+      <h1><%= application.name %></h1>
+      <p><%= application.notes %></p>
+    </div>
+    <div class="page-actions">
+      <button
+        class="btn btn-secondary"
+        type="button"
+        data-app-edit
+        data-app-id="<%= application.id %>"
+        data-app-code="<%= application.code %>"
+        data-app-name="<%= application.name %>"
+        data-app-version="<%= application.version %>"
+        data-app-status="<%= application.status %>"
+        data-app-notes="<%= application.notes %>"
+        data-app-packages="<%= JSON.stringify(application.packages.map((pkg) => ({ packageId: pkg.packageId, selectedVersionId: pkg.selectedVersionId }))) %>"
+      >
+        <span class="material-symbols-outlined">edit</span>
+        Sửa App
+      </button>
+      <form method="post" action="/applications/<%= application.id %>/release" data-confirm-submit="Chuyển app <%= application.code %> sang Released?">
+        <input type="hidden" name="returnTo" value="<%= currentPath %>">
+        <button class="btn btn-primary" type="submit" <%= application.status === 'Released' ? 'disabled' : '' %>>
+          <span class="material-symbols-outlined">archive</span>
+          Đóng gói
+        </button>
+      </form>
+      <form method="post" action="/applications/<%= application.id %>/delete" data-confirm-submit="Xóa app <%= application.code %> khỏi hệ thống?">
+        <button class="btn btn-danger" type="submit">
+          <span class="material-symbols-outlined">delete</span>
+          Xóa
+        </button>
+      </form>
+    </div>
+  </div>
+
+  <div class="detail-grid">
+    <section class="panel">
+      <div class="panel-header">
+        <div>
+          <h2>Thông tin App</h2>
+          <p>Thông tin dùng ở danh sách và pipeline đóng gói.</p>
+        </div>
+      </div>
+      <dl class="detail-list">
+        <div><dt>Code</dt><dd><%= application.code %></dd></div>
+        <div><dt>Version</dt><dd><strong><%= application.version %></strong></dd></div>
+        <div><dt>Package count</dt><dd><%= application.packageCount %></dd></div>
+        <div><dt>Created date</dt><dd><%= application.createdAt %></dd></div>
+        <div><dt>Created by</dt><dd><%= application.createdBy %></dd></div>
+        <div><dt>Status</dt><dd><span class="badge <%= helpers.statusClass(application.status) %>"><%= application.status %></span></dd></div>
+      </dl>
+    </section>
+
+    <section class="panel wide-panel">
+      <div class="panel-header">
+        <div>
+          <h2>Package trong App</h2>
+          <p>Mỗi package có thể chọn version cụ thể cho app này.</p>
+        </div>
+      </div>
+      <div class="table-wrap compact">
+        <table>
+          <thead>
+            <tr>
+              <th>Package</th>
+              <th>Type</th>
+              <th>Selected version</th>
+              <th class="action-col">Actions</th>
+            </tr>
+          </thead>
+          <tbody>
+            <% application.packages.forEach((pkg) => { %>
+              <tr>
+                <td>
+                  <strong><%= pkg.name %></strong>
+                  <span class="table-subtitle"><%= pkg.code %></span>
+                </td>
+                <td><span class="badge <%= helpers.packageTypeClass(pkg.type) %>"><%= helpers.packageTypeLabel(pkg.type) %></span></td>
+                <td><%= pkg.selectedVersion %></td>
+                <td class="action-col">
+                  <div class="action-group">
+                    <button
+                      class="icon-button subtle"
+                      type="button"
+                      title="Đổi version"
+                      data-app-edit
+                      data-app-id="<%= application.id %>"
+                      data-app-code="<%= application.code %>"
+                      data-app-name="<%= application.name %>"
+                      data-app-version="<%= application.version %>"
+                      data-app-status="<%= application.status %>"
+                      data-app-notes="<%= application.notes %>"
+                      data-app-packages="<%= JSON.stringify(application.packages.map((item) => ({ packageId: item.packageId, selectedVersionId: item.selectedVersionId }))) %>"
+                    >
+                      <span class="material-symbols-outlined">swap_horiz</span>
+                    </button>
+                    <form method="post" action="/applications/<%= application.id %>/packages/<%= pkg.packageId %>/delete" data-confirm-submit="Gỡ package <%= pkg.code %> khỏi app?">
+                      <button class="icon-button danger" type="submit" title="Gỡ package" aria-label="Gỡ package <%= pkg.name %>">
+                        <span class="material-symbols-outlined">link_off</span>
+                      </button>
+                    </form>
+                  </div>
+                </td>
+              </tr>
+            <% }) %>
+          </tbody>
+        </table>
+      </div>
+    </section>
+  </div>
+</section>
+
+<%- include('partials/edit-app-modal') %>
+<%- include('partials/page-end') %>