فهرست منبع

1,完成应用管理页面的设计; 2,优化其它的页面

niujiuru 1 هفته پیش
والد
کامیت
18ed40c25c

+ 1 - 1
web-ui.service/web/pages/page4.html

@@ -11,7 +11,7 @@
 
 <body>
 <div class="app">
-  <main class="view page-time">
+  <main class="view page-gnss">
     <div class="status-bar">
      <div class="status-row">
       <div class="status-item">

+ 1 - 1
web-ui.service/web/pages/page5.html

@@ -66,7 +66,7 @@
         <div class="card camera-card">
           <div class="card-header">
             <h2>拍照测试</h2>
-            <div class="camera-actions">
+            <div class="log-actions">
               <button class="btn" id="btn2" onclick="takeOnePhoto()">单次拍照</button>
               <span style="margin:0 1px;"></span>
               <button class="btn" id="btn3" onclick="startCameraPreview()">连续拍照</button>

+ 105 - 6
web-ui.service/web/pages/page6.html

@@ -11,12 +11,111 @@
 
 <body>
 <div class="app">
-  <div class="card">
-    <div class="icon">🚧</div>
-      <h1>页面6</h1>
-      <h1>敬请期待</h1>
-    <p class="subtitle">该功能正在开发中,敬请期待...</p>
-  </div>
+  <main class="view page-userapp">
+    <div class="status-bar">
+      <div class="status-item">
+        <span class="label">应该管理</span>
+        <span class="value" id="avar1">--</span>
+      </div>
+      <div class="status-item">
+        <span class="label">用户应用</span>
+        <span class="value" id="avar2">--</span>
+      </div>
+    </div>
+
+    <div class="panes">
+      <!-- 左栏 -->
+      <div class="left-pane">
+        <div class="card">
+          <div class="card-header">
+            <h2>应该管理</h2>
+            <div class="log-actions">
+              <button class="btn" id="btn1" title="上传用户应用" onclick="onBtn1Click()">上传</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" id="btn2" title="安装用户应用" onclick="onBtn2Click()">安装</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" id="btn3" title="卸载用户应用" onclick="onBtn3Click()">卸载</button>
+            </div>
+          </div>
+          <div class="card-body">
+            <div class="app-info">
+              <span class="label">用户应用:</span>
+              <span class="value" id="bvar1">--</span>
+            </div>
+            <div class="app-info">
+              <span class="label">文件大小:</span>
+              <span class="value" id="bvar2">--</span>
+            </div>
+            <div class="app-info">
+              <span class="label">上传时间:</span>
+              <span class="value" id="bvar3">--</span>
+            </div>
+           <div class="app-info">
+              <span class="label">校检状态:</span>
+              <span class="value" id="bvar4">--</span>
+            </div>
+          </div>
+        </div>
+        <div class="card">
+          <div class="card-header">
+            <h2>用户应用</h2>
+            <div class="log-actions">
+              <button class="btn" id="btn4" title="启动用户应用" onclick="onBtn4Click()">启动</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" id="btn5" title="停止用户应用" onclick="onBtn5Click()">停止</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" id="btn6" title="重启用户应用" onclick="onBtn6Click()">重启</button>
+            </div>
+          </div>
+          <div class="card-body">
+            <div class="app-info">
+              <span class="label">应用名称:</span>
+              <span class="value" id="cvar1">--</span>
+            </div>
+            <div class="app-info">
+              <span class="label">应用版本:</span>
+              <span class="value" id="cvar2">--</span>
+            </div>
+            <div class="app-info">
+              <span class="label">运行状态:</span>
+              <span class="value" id="cvar3">--</span>
+            </div>
+            <div class="app-info app-desc">
+              <span class="label">应用描述:</span>
+              <span class="value" id="cvar4">--</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- 右栏 -->
+      <div class="right-pane">
+        <div class="card log-card">
+          <div class="card-header">
+            <h2>应该管理</h2>
+            <div class="log-actions">
+              <select class="log-level-select" id="logLevel" title="当前服务日志级别" onchange="setAppInstallLogLevel()">
+                <option value="trace">trace</option>
+                <option value="debug">debug</option>
+                <option value="info" selected>info</option>
+                <option value="error">error</option>
+                <option value="fatal">fatal</option>
+              </select>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" title="复制当前屏显日志" onclick="copyLog('text1')">复制</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" title="清除当前屏显日志" onclick="clearLog('text1')">清除</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" title="下载服务日志文件" onclick="downloadAppInstallLogFile(event)">下载</button>
+              <span style="margin:0 1px;"></span>
+              <button class="btn" title="点击重启应用管理" onclick="restartAppInstallService(event)">重启</button>
+            </div>
+          </div>
+          <div class="output" id="text1">自动实时获取数据...</div>
+        </div>
+      </div>
+      <!-- 结束 -->
+    </div>
+  </main>
 </div>
 </body>
 

+ 1 - 1
web-ui.service/web/static/css/app.css

@@ -243,7 +243,7 @@ p{
 .log-actions {
     display: flex;
     align-items: center;
-    gap: 10px;
+    gap: 4px;
 }
 
 .log-level-select {

+ 1 - 1
web-ui.service/web/static/css/page4.css

@@ -1,5 +1,5 @@
 /* 页面整体布局 */
-.page-time {
+.page-gnss {
     display: flex;
     flex-direction: column;
     gap: 12px;

+ 1 - 1
web-ui.service/web/static/css/page5.css

@@ -51,7 +51,7 @@
 .button-item {
     display: flex;
     align-items: center;
-    gap: 10px;
+    gap: 4px;
     margin-left:auto;
     flex-direction:row;
 }

+ 115 - 1
web-ui.service/web/static/css/page6.css

@@ -1 +1,115 @@
-/* reserved */
+/* 页面整体布局 */
+.page-userapp {
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  overflow: hidden;
+}
+
+/* 顶部的状态栏 */
+.status-bar {
+  display: flex;
+  padding: 8px 12px;
+  background: linear-gradient(180deg, #0f172a, #0b1220);
+  gap: 16px;
+  border: 1px solid rgba(148,163,184,0.15);
+  border-radius: 4px;
+  flex-shrink: 0;
+}
+
+.status-item {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+
+.status-item .label {
+  font-size: 14px;
+}
+
+.status-item .value {
+  font-size: 14px;
+  font-family: ui-monospace, Consolas, monospace;
+}
+
+/* 左右拆分的栏 */
+.panes {
+  display: flex;
+  gap: 12px;
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+}
+
+/* 左侧应用列表 */
+.left-pane {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  overflow: hidden;
+  min-width: 0;
+}
+
+.left-pane .card {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.left-pane .card:nth-child(1),
+.left-pane .card:nth-child(2) {
+  flex: 1;
+}
+
+.card-body {
+  flex: 1;
+  padding: 12px;
+  display: flex;
+  flex-direction: column;
+  gap: 12px;
+  min-height: 0;
+  overflow: hidden;
+}
+
+.app-info {
+  display: flex;
+  gap: 8px;
+  font-size: 14px;
+}
+
+.app-info .label {
+  color: #94a3b8;
+  width: 70px;
+  flex-shrink: 0;
+}
+
+.app-info .value {
+  flex: 1;
+  min-width: 0;
+  font-family: ui-monospace, Consolas, monospace;
+}
+
+.app-desc {
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: row;
+}
+
+.app-desc .value {
+  white-space: pre-wrap;
+  word-break: break-all;
+  overflow-y: auto;
+  line-height: 1.5;
+}
+
+/* 展示服务日志 */
+.right-pane {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+}

+ 6 - 2
web-ui.service/web/static/js/page4.js

@@ -125,8 +125,12 @@ function getGnssStatus() {
       ["var1", "var2", "var3"].forEach(id => {
         setText(id, data[id], "page4");
       });
-      const located = data.var2 !== "" && data.var3 !== "" && data.var2 !== "--" && data.var3 !== "--";
-      setText("var4", located ? "已定位" : "定位中", "page4");
+      if (data.var1 == "--") {
+        setText("var4", "--");
+      } else {
+        const located = data.var2 !== "" && data.var3 !== "" && data.var2 !== "--" && data.var3 !== "--";
+        setText("var4", located ? "已定位" : "定位中", "page4");
+      }
     })
     .catch(e => {
       console.error("getGnssStatus() failed:", e);

+ 8 - 2
web-ui.service/web/static/js/router.js

@@ -33,8 +33,14 @@ const pageHandlers = {
     init: () => window.initPage5?.(),
     exit: () => window.exitPage5?.()
   },
-  page6: {},
-  page7: {},
+  page6: {
+    init: () => window.initPage6?.(),
+    exit: () => window.exitPage6?.()
+  },
+  page7: {
+    init: () => window.initPage7?.(),
+    exit: () => window.exitPage7?.()
+  },
   page8: {
     init: () => window.initPage8?.(),
     exit: () => window.exitPage8?.()