优化

ghsApp/src/admin/tools/calculator.vue

@@ -19,7 +19,7 @@
 						</view>
 						<view class="calc-formula">
 							<block v-if="tokens.length === 0 && isEmptyCalcInput">
-								<text class="calc-placeholder">输入数字 · 运算符可连按修改</text>
+								<text class="calc-placeholder">输入数字</text>
 							</block>
 							<view v-else class="calc-formula-inner">
 								<block v-for="(t, idx) in tokens" :key="'tok-' + idx">
@@ -133,23 +133,35 @@
 								<view class="numpad-key" data-char="00" @tap="onNumpadTap">00</view>
 							</view>
 							<view class="numpad-row numpad-row-actions">
-								<view class="numpad-key numpad-key-action-dual numpad-key-action-muted" @tap.stop="tapClearCalculator">
+								<view
+									class="numpad-key numpad-key-action-dual numpad-key-action-muted"
+									@tap.stop="tapClearCalculator"
+								>
 									<text class="numpad-key-text">清空</text>
 								</view>
-								<view class="numpad-key numpad-key-danger numpad-key-action-dual" data-action="backspace" @tap="onNumpadTap">
+								<view
+									class="numpad-key numpad-key-danger numpad-key-action-dual"
+									data-action="backspace"
+									@tap="onNumpadTap"
+								>
 									<text class="numpad-key-text">删除</text>
 								</view>
 							</view>
 						</view>
 						<view class="numpad-op-col">
 							<view class="numpad-key numpad-key-op" data-action="calc-mul" @tap="onNumpadTap">×</view>
-							<view class="numpad-key numpad-key-op" data-action="calc-add" @tap="onNumpadTap">+</view>
+							<view
+								class="numpad-key numpad-key-op numpad-key-op-add"
+								data-action="calc-add"
+								@tap="onNumpadTap"
+							>
+								+
+							</view>
 							<view class="numpad-key numpad-key-op" data-action="calc-sub" @tap="onNumpadTap">−</view>
 							<view class="numpad-key numpad-key-op" data-action="calc-div" @tap="onNumpadTap">÷</view>
-							<view class="numpad-key numpad-key-op numpad-key-op-muted" data-action="calc-clear" @tap="onNumpadTap">全清</view>
 						</view>
 					</view>
-			</view>
+				</view>
 		</view>
 
 		<uni-popup ref="calcHistoryPopup" type="center" background-color="#ffffff" @change="onCalcHistoryPopupChange">
@@ -709,10 +721,11 @@ export default {
 			}
 			return true
 		},
+		/** 金额展示：最多两位小数，不保留小数末尾多余的 0 */
 		formatMoney(n) {
 			const x = Number(n)
-			if (isNaN(x)) return '0.00'
-			return x.toFixed(2)
+			if (isNaN(x)) return '0'
+			return parseFloat(x.toFixed(2)).toString()
 		},
 		formatChangeAmount(n) {
 			const x = Number(n)
@@ -980,13 +993,6 @@ export default {
 				this.pressCalcOp('÷')
 				return
 			}
-			if (action === 'calc-clear') {
-				this.clearStack()
-				this.keyboardTarget = 'calc'
-				this.checkType = 3
-				this.price = 0
-				return
-			}
 			if (action === 'backspace') {
 				this.typing({ backspace: true })
 			} else if (char !== undefined && char !== null && char !== '') {
@@ -1172,17 +1178,20 @@ export default {
 
 <style lang="scss" scoped>
 .calc-page {
-	min-height: 100vh;
+	height: 100%;
 	background: #f4f6f8;
 	box-sizing: border-box;
 	display: flex;
 	flex-direction: column;
+	overflow: hidden;
 }
 
+/* 上 4/7 内容区，下 3/7 数字键区（随屏高同比伸缩） */
 .calc-scroll {
-	flex: 1;
+	flex: 4;
+	flex-basis: 0;
 	min-height: 0;
-	height: 0;
+	width: 100%;
 }
 
 .calc-sheet {
@@ -1264,8 +1273,8 @@ export default {
 }
 
 .calc-formula {
-	min-height: 72upx;
-	font-size: 30upx;
+	min-height: 88upx;
+	font-size: 38upx;
 	color: #333;
 	text-align: center;
 	line-height: 1.45;
@@ -1282,17 +1291,20 @@ export default {
 }
 
 .calc-placeholder {
-	font-size: 26upx;
+	font-size: 32upx;
 	color: #9aa4b2;
 }
 
 .calc-num {
+	font-size: 40upx;
+	font-weight: 600;
 	color: #1a1a1a;
 }
 
 .calc-op {
+	font-size: 40upx;
+	font-weight: 700;
 	color: #09c567;
-	font-weight: 600;
 }
 
 .calc-total-row {
@@ -1551,34 +1563,42 @@ export default {
 }
 
 .safe-bottom-spacer {
-	height: 310upx;
+	height: 24upx;
 }
 
 .numpad-dock {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 0;
+	flex: 3;
+	flex-basis: 0;
+	min-height: 0;
+	width: 100%;
+	display: flex;
+	flex-direction: column;
+	box-sizing: border-box;
 	background: linear-gradient(180deg, transparent 0%, #eceef1 22%, #dcdfe4 100%);
-	padding: 18upx 16upx 12upx;
-	z-index: 50;
+	padding: 12upx 16upx 10upx;
 	box-shadow: 0 -4upx 24upx rgba(0, 0, 0, 0.06);
 }
 
 .safe-area-padding {
-	padding-bottom: constant(safe-area-inset-bottom);
-	padding-bottom: env(safe-area-inset-bottom);
+	padding-bottom: calc(10upx + constant(safe-area-inset-bottom));
+	padding-bottom: calc(10upx + env(safe-area-inset-bottom));
 }
 
 .numpad {
 	width: 100%;
+	flex: 1;
+	min-height: 0;
+	display: flex;
+	flex-direction: column;
 	background: #e2e5ea;
 	border-radius: 14upx;
-	padding: 14upx;
+	padding: 10upx;
 	box-sizing: border-box;
 }
 
 .numpad-grid-wrap {
+	flex: 1;
+	min-height: 0;
 	display: flex;
 	flex-direction: row;
 	align-items: stretch;
@@ -1587,39 +1607,47 @@ export default {
 .numpad-digits {
 	flex: 1;
 	min-width: 0;
+	min-height: 0;
 	display: flex;
 	flex-direction: column;
 }
 
 .numpad-row {
+	flex: 1;
+	min-height: 0;
 	display: flex;
 	flex-direction: row;
-	margin-top: 12upx;
+	align-items: stretch;
 }
 
-.numpad-row:first-child {
-	margin-top: 0;
+.numpad-row + .numpad-row {
+	margin-top: 8upx;
 }
 
 .numpad-op-col {
 	width: 25%;
 	flex-shrink: 0;
+	min-height: 0;
 	display: flex;
 	flex-direction: column;
 	margin-left: 10upx;
 }
 
+.numpad-op-col .numpad-key {
+	margin-left: 0;
+}
+
 .numpad-op-col .numpad-key-op + .numpad-key-op {
-	margin-top: 12upx;
+	margin-top: 8upx;
 }
 
 .numpad-key-op {
 	flex: 1;
+	min-height: 0;
 	display: flex;
 	align-items: center;
 	justify-content: center;
-	min-height: 86upx;
-	font-size: 36upx;
+	font-size: 44upx;
 	font-weight: 600;
 	line-height: 1;
 	border-radius: 12upx;
@@ -1631,19 +1659,24 @@ export default {
 	padding: 0;
 }
 
-.numpad-key-op-muted {
-	font-size: 24upx;
-	background: linear-gradient(180deg, #e8eaef 0%, #dce0e6 100%);
-	color: #3d4654;
+/* + 纵向约占两格，浅色略偏主色、不抢眼 */
+.numpad-key-op-add {
+	flex: 2;
+	background: linear-gradient(180deg, #f7fcfa 0%, #e9f4ee 100%);
+	color: #178a5c;
+	box-shadow: 0 3upx 0 #b5d9c8;
 }
 
 .numpad-key {
 	flex: 1;
-	min-height: 86upx;
-	line-height: 86upx;
+	min-width: 0;
+	min-height: 0;
+	display: flex;
+	align-items: center;
+	justify-content: center;
 	text-align: center;
-	font-size: 34upx;
-	font-weight: 500;
+	font-size: 42upx;
+	font-weight: 600;
 	margin-left: 10upx;
 	color: #1a2430;
 	background: linear-gradient(180deg, #fff 0%, #f5f7fa 100%);
@@ -1661,22 +1694,19 @@ export default {
 	margin-left: 0;
 }
 
-.numpad-row-actions {
-	margin-top: 16upx;
-}
-
 .numpad-key-muted {
 	color: #4a5666;
-	font-size: 40upx;
+	font-size: 46upx;
 }
 
 .numpad-key-text {
-	font-size: 28upx;
+	font-size: 34upx;
+	font-weight: 600;
 }
 
 .numpad-key-action-muted {
-	font-size: 26upx !important;
-	color: #3d5266 !important;
+	font-size: 32upx !important;
+	color: #3d4654 !important;
 	background: linear-gradient(180deg, #eef1f6 0%, #e2e7ee 100%) !important;
 }