空箱入库

entry/src/main/ets/entryability/EntryAbility.ts

@@ -40,7 +40,7 @@ export default class EntryAbility extends UIAbility {
       windowClass.setWindowLayoutFullScreen(true)
     })
 
-    windowStage.loadContent('pages/menu', (err) => {
+    windowStage.loadContent('pages/Menu', (err) => {
       if (err.code) {
         hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
         return;

entry/src/main/ets/pages/EmptyBoxStorage.ets

@@ -5,7 +5,9 @@ import router from '@ohos.router';
 @Component
 struct emptyBoxStorage {
   @State materialBoxID: string = 'LX-00010';
-
+  @State isMaterialBoxExist: Boolean = true;
+  @State isPrinterOnline: Boolean = true;
+  @State isRfidOnline: Boolean = true;
   build() {
     Row() {
       Column() {
@@ -43,98 +45,264 @@ struct emptyBoxStorage {
               Text("生成编号")
                 .fontColor($r('app.color.FFFFFF'))
                 .fontSize($r('app.float.fontSize_15_2'))
+                .margin({top:'3%'})
               Row(){
                 Stack() {
-                  Image($r('app.media.identified_material_box'))
+                  Image(this.isMaterialBoxExist? $r('app.media.identified_material_box'):$r('app.media.not_identified_material_box'))
                     .width('100%')
                     .height('100%')
+                    .borderRadius($r('app.float.virtualSize_6_4'))
                     .objectFit(ImageFit.Contain)
-                  Text("lx-0010")
-                    .fontSize(16)
+                  Text("LX-00010")
+                    .fontSize($r('app.float.fontSize_19_2'))
                     .fontColor($r('app.color.FFFFFF'))
                     .position({
-                      x: '50%', // 水平位置
-                      y: '68%', // 垂直位置
-
+                      x: '38%', // 水平位置
+                      y: '80%', // 垂直位置
+                    })
+                  Text("已生成新编号")
+                    .fontSize($r('app.float.fontSize_6'))
+                    .fontColor($r('app.color.60FFFFFF'))
+                    .position({
+                      x: '45%', // 水平位置
+                      y: '87%', // 垂直位置
                     })
                 }
               }
-              .height('60%')
+              .margin({top:'3%'})
+              .height('75%')
               .width('100%')
-              Button() {
+              Button({type:ButtonType.Normal}) {
                 Row() {
                   Image($r('app.media.material_qr_code'))
-                    .width(20)
-                    .height(20)
+                    .width('15%')
+                    .height('45%')
                     .margin({ right: 8 })
-                    .fillColor('#0A84FF')
+                    .fillColor($r('app.color.0A84FF'))
                   Text("生成料箱编号")
-                    .fontSize(16)
-                    .fontColor('#0A84FF') // 图片中的蓝色
+                    .fontSize($r('app.float.fontSize_12'))
+                    .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
                 }
                 .justifyContent(FlexAlign.Center)
               }
-              .width('50%')
-              .height('10%')
+              .margin({top:'10%'})
+              .width('35%')
+              .height('6%')
               .backgroundColor($r('app.color.20FFFFFF'))
-              .borderRadius(8)
+              .borderRadius($r('app.float.virtualSize_6_4'))
               .onClick(() => {
                 // 按钮点击事件处理
               })
             }
-            .width('50%')
-
+            .height('100%')
+            .width('45%')
+            .justifyContent(FlexAlign.Start)
             Column(){
-              Text("打印条码：")
-              Row(){}.height('20%')
-              Button("打印")
-                .width('80%')
-              Path()
-                .width('100%')
-                .strokeWidth(1)
-                .stroke(Color.Black)
-                .commands('M0 0 L600 0')
-                .margin({top:'5%',bottom:'5%'})
-              Text("写入磁卡：")
-              Row(){}.height('25%')
-              Text("当前编码：无编码").height('10%')
-              Button("写入")
-                .width('80%')
+              Text("打印条码")
+                .fontColor($r('app.color.FFFFFF'))
+                .fontSize($r('app.float.fontSize_15_2'))
+                .margin({top:'3%'})
+              Column(){
+                Image(this.isPrinterOnline? $r('app.media.printer_online'):$r('app.media.printer_offline'))
+                  .width('100%')
+                  .height('40%')
+                  .borderRadius($r('app.float.virtualSize_6_4'))
+                  .objectFit(ImageFit.Contain)
+                //.margin({top:'3%'})
+                Button({type:ButtonType.Normal}) {
+                  Row() {
+                    Image($r('app.media.material_qr_code'))
+                      .width('15%')
+                      .height('50%')
+                      .margin({ right: 8 })
+                      .fillColor($r('app.color.0A84FF'))
+                    Text("打印编号")
+                      .fontSize($r('app.float.fontSize_12'))
+                      .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
+                  }
+                  .justifyContent(FlexAlign.Center)
+                }
+                .margin({top:'6%'})
+                .width('35%')
+                .height('8%')
+                .backgroundColor($r('app.color.20FFFFFF'))
+                .borderRadius($r('app.float.virtualSize_6_4'))
+                .onClick(() => {
+                  // 按钮点击事件处理
+                })
+                Divider()
+                  .margin({top:'3%'})
+                  .vertical(false)
+                  .strokeWidth(1)
+                  .color($r('app.color.10FFFFFF'))
+                  .width('100%')
+                Text("写入磁卡")
+                  .fontColor($r('app.color.FFFFFF'))
+                  .fontSize($r('app.float.fontSize_15_2'))
+                  .margin({top:'3%'})
+                Image(this.isRfidOnline? $r('app.media.rfid_online'):$r('app.media.rfid_offline'))
+                  .width('100%')
+                  .height('40%')
+                  .margin({top:'1%'})
+                  .borderRadius($r('app.float.virtualSize_6_4'))
+                  .objectFit(ImageFit.Contain)
+              }
+             // .margin({top:'3%'})
+              .height('75%')
+              .width('100%')
+              .justifyContent(FlexAlign.Start)
+              Row(){
+                Text("当前编号：")
+                  .fontColor($r('app.color.FFFFFF'))
+                  .fontSize($r('app.float.fontSize_9_6'))
+                  .margin({top:'3%'})
+                Text("LX-00010")
+                  .fontColor($r('app.color.0A84FF'))
+                  .fontSize($r('app.float.fontSize_9_6'))
+                  .margin({top:'3%'})
+              }.height('5%')
+              .margin({top:'2%'})
+              Button({type:ButtonType.Normal}) {
+                Row() {
+                  Image($r('app.media.material_qr_code'))
+                    .width('15%')
+                    .height('45%')
+                    .margin({ right: 8 })
+                    .fillColor($r('app.color.0A84FF'))
+                  Text("写入磁卡")
+                    .fontSize($r('app.float.fontSize_12'))
+                    .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
+                }
+                .justifyContent(FlexAlign.Center)
+              }
+              .margin({top:'3%'})
+              .width('35%')
+              .height('6%')
+              .backgroundColor($r('app.color.20FFFFFF'))
+              .borderRadius($r('app.float.virtualSize_6_4'))
+              .onClick(() => {
+                // 按钮点击事件处理
+              })
             }
-            .justifyContent(FlexAlign.SpaceEvenly)
-            .width('50%')
+            .justifyContent(FlexAlign.Start)
+            .width('45%')
+            .height('100%')
           }
           .width('60%')
-          .height('80%')
+          .height('85%')
+          .justifyContent(FlexAlign.SpaceAround)
           .backgroundColor($r('app.color.10FFFFFF'))
-          Row(){
+
+          Column(){
             Column(){
               Text("空箱入库")
+                .fontColor($r('app.color.FFFFFF'))
+                .fontSize($r('app.float.fontSize_15_2'))
+                .margin({top:'3%'})
               Column(){
-                Text('物料：0').textAlign(TextAlign.End).width('100%')
-                Row(){}.border({width:1}).width('90%').height('50%')
-                Text("料箱重量").textAlign(TextAlign.Start).width('100%')
-                Text("12.56kg").textAlign(TextAlign.Start).width('100%')
-                Text("料箱编号").textAlign(TextAlign.Start).width('100%')
-                Text("LX-0010").textAlign(TextAlign.Start).width('100%')
+                Stack() {
+                  Image($r('app.media.drawer_in_box')) // 替换为您的电梯图片资源
+                    .width('100%')
+                    .height('100%')
+                    .borderRadius($r('app.float.virtualSize_6_4'))
+                    .objectFit(ImageFit.Contain)
+                  // 文字信息层（左下角）
+                  Column() {
+                    Row(){
+                      Image($r('app.media.material_weight'))
+                        .width('5%')
+                        .height('30%')
+                        .fillColor($r('app.color.30D158'))
+                      Text("15Kg")
+                        .margin({left:10})
+                        .fontSize($r('app.float.fontSize_15_2'))
+                        .fontColor($r('app.color.30D158')) // 绿色文字
+                    }
+                    Row(){
+                      Image($r('app.media.material_rfid'))
+                        .width('5%')
+                        .height('30%')
+                        .fillColor($r('app.color.30D158'))
+
+                      Text("LX-00010")
+                        .margin({left:10})
+                        .fontSize($r('app.float.fontSize_15_2'))
+                        .fontColor($r('app.color.30D158')) // 绿色文字
+                    }
+                  }.height('19%').alignItems(HorizontalAlign.Start).justifyContent(FlexAlign.SpaceEvenly)
+                  .position({ x: '3%', y: '78%' })
+
+                  // 右上角物料信息
+                  Text("物料: 0")
+                    .fontSize(16)
+                    .fontColor(Color.White)
+                    .position({ x: '80%', y: '5%' })
+
+                  // 右侧纵向时间信息
+                  Column({ space: 12 }) {
+                    Text("12-12-12")
+                    Text("12:12-12")
+                    Text("12:12 12")
+                  }
+                  .position({ x: '85%', y: '30%' })
+                  .alignItems(HorizontalAlign.End)
+                }
+                .width('95%')
+                .height('100%') // 根据实际需求调整
               }
-              .height('65%')
-              .width('95%')
-              .border({width:1})
-              .justifyContent(FlexAlign.SpaceAround)
+              .height('75%')
+              .width('100%')
+              .margin({top:'2%'})
+              //.justifyContent(FlexAlign.SpaceAround)
               Row(){
-                Button("伸出").width('40%')
-                Button("缩回").width('40%')
+                Button({type:ButtonType.Normal}) {
+                    Text("伸出")
+                      .fontSize($r('app.float.fontSize_12'))
+                      .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
+                }
+                .margin({top:'6%'})
+                .width('35%')
+                .height('8%')
+                .backgroundColor($r('app.color.20FFFFFF'))
+                .borderRadius($r('app.float.virtualSize_6_4'))
+                .onClick(() => {
+                  // 按钮点击事件处理
+                })
+                Button({type:ButtonType.Normal}) {
+                  Text("缩回")
+                    .fontSize($r('app.float.fontSize_12'))
+                    .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
+                }
+                .margin({top:'6%'})
+                .width('35%')
+                .height('8%')
+                .backgroundColor($r('app.color.20FFFFFF'))
+                .borderRadius($r('app.float.virtualSize_6_4'))
+                .onClick(() => {
+                  // 按钮点击事件处理
+                })
               }.width('100%')
               .justifyContent(FlexAlign.SpaceAround)
-              Button("空箱入库").width('90%')
+              Button({type:ButtonType.Normal}) {
+                Text("空箱入库")
+                  .fontSize($r('app.float.fontSize_12'))
+                  .fontColor($r('app.color.0A84FF')) // 图片中的蓝色
+              }
+              .margin({top:'6%'})
+              .width('35%')
+              .height('8%')
+              .backgroundColor($r('app.color.20FFFFFF'))
+              .borderRadius($r('app.float.virtualSize_6_4'))
+              .onClick(() => {
+                // 按钮点击事件处理
+              })
             }
-            .width('90%')
-            .height('90%')
-            .justifyContent(FlexAlign.SpaceEvenly)
+            .width('100%')
+            .height('100%')
+            .justifyContent(FlexAlign.Start)
           }
-          .width('35%')
-          .height('80%')
+          .width('32%')
+          .height('85%')
           .backgroundColor($r('app.color.10FFFFFF'))
           .justifyContent(FlexAlign.Center)
         }