From db9da55085de9447e2cc3783ccf7b3ec01f82f70 Mon Sep 17 00:00:00 2001
From: 快乐的昕的电脑 <快乐的昕的电脑@DESKTOP-C2BQPQU>
Date: 星期三, 03 十二月 2025 16:14:45 +0800
Subject: [PATCH] 第一行实时计算寿命比%
---
components/machine.vue | 311 ++++++++++++++++++++++++++++-----------------------
1 files changed, 168 insertions(+), 143 deletions(-)
diff --git a/components/machine.vue b/components/machine.vue
index c237153..6095314 100644
--- a/components/machine.vue
+++ b/components/machine.vue
@@ -19,11 +19,11 @@
</view>
<view class="item">
<!-- 璋冩満寮�濮嬫寜閽紝maStartTime鏈夊�兼椂绂佺敤 -->
- <button :class="maStartTime ? 'btn-disabled' : 'btn-blue'"
- :disabled="!!maStartTime"
- @click="handleMaStartTime">
- 璋冩満寮�濮�
- </button>
+ <button :class="maStartTime ? 'btn-disabled' : 'btn-blue'"
+ :disabled="!!maStartTime"
+ @click="handleMaStartTime">
+ 璋冩満寮�濮�(=涓婂垁瀹屾垚)
+ </button>
<!-- 鏄剧ず璋冩満寮�濮嬫椂闂� -->
<input class="txt-inp" v-model="maStartTime" placeholder="鐐瑰嚮鎸夐挳甯﹀嚭璋冩満鏃堕棿" disabled="true" />
</view>
@@ -257,12 +257,20 @@
})
}
},
- mounted() {
- // 椤甸潰鍔犺浇鏃讹紝鍚姩瀹氭椂鍣紝姣忛殧5鍒嗛挓鑷姩淇濆瓨锛堝綋鍓嶇ず渚嬩娇鐢� 30s锛屽彲鏀瑰洖 5 鍒嗛挓锛�
- this.autoSaveTimer = setInterval(() => {
- this.save(); // 鐩存帴璋冪敤宸叉湁鐨勪繚瀛樻柟娉曪紙save 宸茶繑鍥� Promise锛�
- }, 1 * 30 * 1000); // 30绉�
- },
+ mounted() {
+ // 椤甸潰鍔犺浇鏃讹紝鍚姩瀹氭椂鍣紝姣忛殧30绉掕嚜鍔ㄤ繚瀛�
+ this.autoSaveTimer = setInterval(() => {
+ // 1. 璋冩満瀹屾垚鏃堕棿鏈変簡灏变笉鑷姩淇濆瓨
+ if (this.maEndTime) {
+ return;
+ }
+ // 2. 閫佹鏃堕棿涓虹┖涔熶笉鑷姩淇濆瓨
+ if (!this.maShoutTime) {
+ return;
+ }
+ this.save(); // 婊¤冻鏉′欢鎵嶈嚜鍔ㄤ繚瀛�
+ }, 1 * 30 * 1000); // 30绉�
+ },
beforeDestroy() {
// 椤甸潰鍗歌浇鏃舵竻鐞嗗畾鏃跺櫒
clearInterval(this.autoSaveTimer);
@@ -271,157 +279,174 @@
</script>
<style scoped>
- /* 椤甸潰鏁翠綋甯冨眬 */
- .page {
- padding: 8px;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- box-sizing: border-box;
- height: 100%;
- }
+ /* 椤甸潰鏁翠綋甯冨眬 */
+ .page {
+ padding: 8px;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-between;
+ box-sizing: border-box;
+ height: 100%;
+ }
- /* 鍙充笂瑙掑埛鏂版寜閽� */
- .top-right {
- position: absolute;
- top: 8px;
- right: 40px;
- z-index: 1000;
- }
+ /* 鍙充笂瑙掑埛鏂版寜閽� */
+ .top-right {
+ position: absolute;
+ top: 8px;
+ right: 40px;
+ width: 200px;
+ z-index: 1000;
+ }
- .refresh-btn {
- padding: 8px 16px;
- background-color: #00A2E9;
- color: white;
- border: none;
- font-size: 16px;
- border-radius: 5px;
- }
+ .refresh-btn {
+ padding: 8px 16px;
+ background-color: #00A2E9;
+ color: white;
+ border: none;
+ font-size: 24px;
+ border-radius: 5px;
+ }
- label {
- margin-right: 10px;
- font-size: 16px;
- }
+ label {
+ margin-right: 10px;
+ font-size: 24px;
+ }
- /* 涓棿鐘舵�侀儴鍒嗗竷灞� */
- .middle-section {
- display: flex;
- flex-direction: column;
- margin-bottom: 8px;
- }
+ /* 涓棿鐘舵�侀儴鍒嗗竷灞� */
+ .middle-section {
+ display: flex;
+ flex-direction: column;
+ margin-bottom: 8px;
+ }
- .item {
- display: flex;
- flex-direction: row;
- align-items: flex-start;
- margin-bottom: 10px;
- }
+ .item {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ margin-bottom: 10px;
+ gap: 10px;
+ }
- .item h4 {
- font-size: 14px;
- line-height: 1.4;
- margin: 0;
- padding: 5px 0;
- }
+ .item h4 {
+ font-size: 24px;
+ line-height: 1.4;
+ margin: 0;
+ padding: 5px 0;
+ }
- button {
- width: 100%;
- padding: 10px;
- font-size: 16px;
- border: none;
- text-align: center;
- min-height: 40px;
- }
+ button {
+ width: 50%;
+ flex-shrink: 0;
+ padding: 10px;
+ font-size: 24px;
+ border: none;
+ text-align: center;
+ min-height: 40px;
+ }
- .btn-disabled {
- background-color: #ccc;
- color: white;
- }
+ .btn-disabled {
+ background-color: #ccc;
+ color: white;
+ }
- .btn-blue {
- background-color: #00A2E9;
- color: white;
- }
+ .btn-blue {
+ background-color: #00A2E9;
+ color: white;
+ }
- input {
- margin-top: 0;
- padding: 8px;
- font-size: 15px;
- border: 1px solid #ccc;
- width: 100%;
- box-sizing: border-box;
- }
+ input {
+ margin-top: 0;
+ padding: 8px;
+ font-size: 24px;
+ border: 1px solid #ccc;
+ width: 50%;
+ flex-grow: 1;
+ box-sizing: border-box;
+ }
- /* 搴曢儴淇濆瓨/鍙栨秷鎸夐挳甯冨眬 */
- .bottom-section {
- display: flex;
- justify-content: space-between;
- margin-top: 10px;
- padding-top: 10px;
- }
+ /* 搴曢儴淇濆瓨/鍙栨秷鎸夐挳甯冨眬 */
+ .bottom-section {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 10px;
+ padding-top: 10px;
+ }
- .save-btn,
- .cancel-btn {
- width: 48%;
- padding: 12px;
- background-color: #00A2E9;
- color: white;
- font-size: 18px;
- border: none;
- text-align: center;
- min-height: 45px;
- }
+ .save-btn,
+ .cancel-btn {
+ width: 48%;
+ padding: 12px;
+ background-color: #00A2E9;
+ color: white;
+ font-size: 24px;
+ border: none;
+ text-align: center;
+ min-height: 45px;
+ }
- .txt-inp {
- height: 40px;
- padding: 8px;
- font-size: 15px;
- width: 100%;
- box-sizing: border-box;
- margin-top: 0;
- }
+ .txt-inp {
+ height: 80px; /* 澧炲ぇ楂樺害 */
+ padding: 12px; /* 澧炲ぇ鍐呰竟璺� */
+ font-size: 24px; /* 澧炲ぇ瀛椾綋 */
+ width: 50%;
+ flex-grow: 1;
+ box-sizing: border-box;
+ margin-top: 0;
+ }
- /* 閽堝1280*717灞忓箷鐨勭壒瀹氫紭鍖� */
- @media screen and (max-width: 1280px) and (max-height: 800px) {
- .page {
- padding: 6px;
- }
+ /* 閽堝1280*717灞忓箷鐨勭壒瀹氫紭鍖� */
+ @media screen and (max-width: 1280px) and (max-height: 800px) {
+ .page {
+ padding: 6px;
+ }
- .middle-section {
- margin-bottom: 6px;
- }
+ .middle-section {
+ margin-bottom: 6px;
+ }
- .item {
- margin-bottom: 8px;
- }
+ .item {
+ margin-bottom: 8px;
+ }
- .item h4 {
- font-size: 13px;
- padding: 3px 0;
- }
+ .item h4 {
+ font-size: 24px;
+ padding: 3px 0;
+ }
- button {
- padding: 8px;
- font-size: 15px;
- min-height: 38px;
- }
+ button {
+ padding: 8px;
+ font-size: 24px;
+ min-height: 38px;
+ }
- .txt-inp {
- height: 38px;
- padding: 6px;
- font-size: 14px;
- }
+ .txt-inp {
+ height: 46px;
+ padding: 10px;
+ font-size: 24px;
+ }
- .bottom-section {
- margin-top: 8px;
- padding-top: 8px;
- }
+ .bottom-section {
+ margin-top: 8px;
+ padding-top: 8px;
+ }
- .save-btn,
- .cancel-btn {
- padding: 10px;
- font-size: 17px;
- min-height: 42px;
- }
- }
+ .save-btn,
+ .cancel-btn {
+ padding: 10px;
+ font-size: 24px;
+ min-height: 42px;
+ }
+
+ input {
+ font-size: 24px;
+ }
+
+ .refresh-btn {
+ font-size: 24px;
+ }
+
+ label {
+ font-size: 24px;
+ }
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3