大一测试

scanpages/hj/materials_detail.vue

@@ -56,14 +56,35 @@
 				<text class="desc-text">{{ info.MaterialDef }}</text>
 			</view>
 		</view>
+
+		<!-- 打印按钮栏 -->
+		<view class="print-bar">
+			<view class="print-btn" @click="showPrint = true">
+				<u-icon name="printer" :size="32" color="#fff" />
+				<text class="print-btn__text">打印二维码</text>
+			</view>
+		</view>
+
+		<!-- 打印弹窗 -->
+		<nbd-print-prop
+			v-model="showPrint"
+			:labelWidth="50"
+			:labelHeight="30"
+			:margin="2"
+			:barcodeText="info.MaterialCode || ''"
+			:barcodeTopText="[info.MaterialName, info.MaterialSpec].filter(Boolean).join(' ') || ''"
+			:barcodeBottomText="[info.Code, info.HeatNo, info.BatchNo].filter(Boolean).join(' ') || ''"
+		/>
 	</view>
 </template>
 
 <script setup>
-	import { ref } from 'vue'
-	import { onLoad } from '@dcloudio/uni-app'
-	import { reqMaterialInfoByMaterialCode } from '@/api/hj.js'
-	const info = ref({})
+import { ref, computed } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+import { reqMaterialInfoByMaterialCode } from '@/api/hj.js'
+
+const info = ref({})
+const showPrint = ref(false)
 
 	onLoad((opt) => {
 		if (opt.id) {
@@ -94,7 +115,7 @@
 	.detail-page {
 		min-height: 100vh;
 		background: $bg;
-		padding-bottom: 48rpx;
+		padding-bottom: 160rpx;
 	}
 
 	// ===== 代码标识区 =====
@@ -228,6 +249,41 @@
 		line-height: 1.6;
 	}
 
+	// ===== 打印按钮栏 =====
+	.print-bar {
+		position: fixed;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		z-index: 100;
+		padding: 20rpx 24rpx;
+		padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
+		background: linear-gradient(180deg, rgba($bg, 0) 0%, $bg 20%);
+	}
+
+	.print-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		gap: 12rpx;
+		padding: 24rpx;
+		background: linear-gradient(135deg, $primary, #5a9aff);
+		border-radius: 14rpx;
+		box-shadow: 0 6rpx 24rpx rgba($primary, 0.3);
+
+		&:active {
+			opacity: 0.9;
+			transform: scale(0.98);
+		}
+
+		&__text {
+			font-size: 30rpx;
+			font-weight: 600;
+			color: #fff;
+			letter-spacing: 2rpx;
+		}
+	}
+
 	// ===== 批次追溯网格 =====
 	.trace-grid {
 		display: flex;