优化称重页面与机台选择布局

This commit is contained in:
FinleyHsu
2026-08-06 11:12:40 +08:00
parent 3b856f0c11
commit f1c0c91686
2 changed files with 20 additions and 16 deletions
+13 -4
View File
@@ -145,9 +145,12 @@ h1 em { font-style: normal; color: var(--green); }
.identity-operation-panel { flex: 1.1 1 0; } .identity-operation-panel { flex: 1.1 1 0; }
.identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; } .identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; }
.identity-person-panel .identity-card h3 { font-size: 24px; } .identity-person-panel .identity-card h3 { font-size: 24px; }
.identity-operation-panel .machine-select-row { min-height: 72px; } .identity-machine-card { min-height: 88px; padding: 13px; box-shadow: none; }
.identity-operation-panel .machine-select-row b { font-size: 20px; } .identity-machine-card.selected { border-color: #a9cbbb; background: #fbfefc; }
.identity-machine-card h3 { font-size: 24px; }
.machine-select-action { margin-left: auto; border: 0; border-radius: 9px; background: var(--green); color: white; padding: 11px 14px; font-size: 13px; font-weight: 800; }
.identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; } .identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; }
.identity-confirm { margin-top: 14px; }
.identity-back { position: absolute; top: 0; left: 0; z-index: 1; } .identity-back { position: absolute; top: 0; left: 0; z-index: 1; }
.identity-material-compact { min-height: 42px; justify-content: flex-start; gap: 8px; margin: 0 0 12px; padding: 8px 12px; } .identity-material-compact { min-height: 42px; justify-content: flex-start; gap: 8px; margin: 0 0 12px; padding: 8px 12px; }
.identity-material-compact small, .identity-material-compact b, .identity-material-compact em { display: inline; } .identity-material-compact small, .identity-material-compact b, .identity-material-compact em { display: inline; }
@@ -801,8 +804,8 @@ h1 em { font-style: normal; color: var(--green); }
.identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; } .identity-person-panel .identity-card { min-height: 88px; padding: 13px; box-shadow: none; }
.identity-person-panel .identity-card h3 { font-size: 24px; } .identity-person-panel .identity-card h3 { font-size: 24px; }
.identity-person-panel .identity-card p { font-size: 16px; } .identity-person-panel .identity-card p { font-size: 16px; }
.identity-operation-panel .machine-select-row { min-height: 72px; } .identity-machine-card { min-height: 88px; }
.identity-operation-panel .machine-select-row b { font-size: 20px; } .identity-machine-card h3 { font-size: 24px; }
.identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; } .identity-operation-panel .full-primary { margin-top: 14px; padding: 13px 16px; font-size: 15px; }
.identity-material-compact { min-height: 36px; margin: 0 0 10px; padding: 7px 11px; border-radius: 10px; } .identity-material-compact { min-height: 36px; margin: 0 0 10px; padding: 7px 11px; border-radius: 10px; }
.identity-material-compact b { font-size: 14px; } .identity-material-compact b { font-size: 14px; }
@@ -818,4 +821,10 @@ h1 em { font-style: normal; color: var(--green); }
@media (orientation: landscape) { @media (orientation: landscape) {
.weight-number span { font-size: 128px !important; } .weight-number span { font-size: 128px !important; }
footer.production-footer { min-height: 40px; height: 40px; padding: 0 24px; justify-content: center; text-align: center; }
.machine-option-list { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: flex-start; }
.machine-option-list > button { width: 32%; flex: 0 0 32%; margin: 0 0 8px; padding: 9px 8px; }
.machine-option-list > button > span { width: 24px; height: 24px; }
.machine-option-list > button b { font-size: 12px; }
.machine-option-list > button i { display: none; }
} }
+7 -12
View File
@@ -891,10 +891,6 @@ export default function Home() {
<small>WOER · SMART SCALE</small> <small>WOER · SMART SCALE</small>
</span> </span>
</button> </button>
<div className="status-pill">
<span className="status-dot" />
{t("online")}
</div>
</header> </header>
<div className="content"> <div className="content">
@@ -956,17 +952,16 @@ export default function Home() {
</section> </section>
<section className="identity-operation-panel"> <section className="identity-operation-panel">
<div className="identity-panel-heading"><span>{t("machineNo")}</span></div> <div className="identity-panel-heading"><span>{t("machineNo")}</span></div>
<div className={machine ? "machine-select-row selected" : "machine-select-row"}> <div className={machine ? "identity-card identity-machine-card selected" : "identity-card identity-machine-card"}>
<span className="machine-select-icon">▣</span> <div className="avatar">▣</div>
<span><small>{machine ? t("selectedMachine") : t("machineNo")}</small><b>{machine || t("noMachine")}</b></span> <div><small>{machine ? t("selectedMachine") : t("machineNo")}</small><h3>{machine || t("noMachine")}</h3><p>{machine ? t("selectedMachine") : t("selectMachine")}</p></div>
<button onClick={() => { setMachineQuery(""); setMachineKeypadOpen(false); setMachineModalOpen(true); }}>{t("selectMachine")}</button> <button className="machine-select-action" onClick={() => { setMachineQuery(""); setMachineKeypadOpen(false); setMachineModalOpen(true); }}>{t("selectMachine")}</button>
<button className="machine-refresh" onClick={() => void refreshMachines()} disabled={machineLoading}>↻ {t("refreshMachine")}</button>
</div> </div>
<button className="full-primary" disabled={!employee.name || !machine} onClick={beginWeighing}>
{t("confirmWeigh")} <span>→</span>
</button>
</section> </section>
</div> </div>
<button className="full-primary identity-confirm" disabled={!employee.name || !machine} onClick={beginWeighing}>
{t("confirmWeigh")} <span>→</span>
</button>
{notice && <div className="notice">ⓘ {notice}</div>} {notice && <div className="notice">ⓘ {notice}</div>}
</div> </div>
)} )}