修改主操作栏

entry/src/main/ets/pages/Index.ets

@@ -7,6 +7,9 @@ import RequestParamModel from '../viewmodel/RequestParamModel';
 import OperationInfo from '../viewmodel/process/OperationInfo';
 import { SelectOrderDialog } from '../view/SelectOrderDialog';
 import image from '@ohos.multimedia.image';
+import { SwitchingProductDialog, taskSeqItem } from '../view/SwitchingProductDialog';
+import TaskSeqVO from '../viewmodel/process/TaskSeqInfo';
+import promptAction from '@ohos.promptAction';
 
 @Entry
 @Component
@@ -14,133 +17,21 @@ struct Index {
   // 工单列表
   @State workOrders: WorkOrderInfo[] = []
   // 选中工单
-  @State selectWorkOder: WorkOrderInfo = {
-  beforeNum: '0.00',
-  completeNum:'0.00',
-  inventoryNum:'0.00',
-  materialCode:'GAS-RTA',
-  materialModel: 'N2纯度99.9999%，露点<-70°C',
-  materialName:'快速退火气体',
-  ops:[
-    {
-      exists:false,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GX-SFZB',
-      operationId:'679',
-      operationName:'三防准备',
-      operationSort:0,
-      selfCheck:0,
-      seqs:[],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    },
-    {
-      exists:false,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GX-CXSL',
-      operationId:'680',
-      operationName:'程序烧录',
-      operationSort:1,
-      selfCheck:0,
-      seqs:[],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    },
-    {
-      exists:true,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GX-WGJC',
-      operationId:'681',
-      operationName:'外观检测',
-      operationSort:2,
-      selfCheck:0,
-      seqs:[
-        {
-          currentTask:'当前进度:包装工位1(三防准备)',
-          seqNo:'10.25.0022-0001',
-          state:'0'
-        }
-      ],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    },
-    {
-      exists:false,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GX-JY',
-      operationId:'682',
-      operationName:'检验',
-      operationSort:3,
-      selfCheck:0,
-      seqs:[],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    },
-    {
-      exists:false,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GJ-WWSF',
-      operationId:'683',
-      operationName:'委外三防',
-      operationSort:4,
-      selfCheck:0,
-      seqs:[],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    },
-    {
-      exists:false,
-      firstCheck:0,
-      inspection:0,
-      mutualInspection:0,
-      opComplete:false,
-      operationCode:'GJ-GDWCC',
-      operationId:'677',
-      operationName:'高低温存储',
-      operationSort:5,
-      selfCheck:0,
-      seqs:[],
-      specialInspection:0,
-      workOrderCode:'10.25.0022'
-    }
-  ],
-  orderCode:'DD2505140001',
-  orderName:'GAS-RTA',
-  planNum:'1.00',
-  planStartEnd:'2025-05-16 08:26:00',
-  planStartWhen:'2025-05-16 08:00:00',
-  processRouteCode:'GAS-RTA',
-  processRouteId:147,
-  processRouteName:'GAS-RTA',
-  productLineId:'18',
-  productLineName:'配件产线01',
-  workOrderCode:'10.25.0022',
-  workOrderState:'3',
-  workshopId:'0',
-  workshopName:'青半002'
-}
+  @State selectWorkOder: WorkOrderInfo = {}
   // 工位通知数量
   @State noticeNum: number = 100
-  // 扫描或手动输入的物料编码
+  // 扫描或手动输入的流水/序列/铭牌号
   @State scanCode: string = ''
   // 当前流转卡号
   @State seqNo: string = ''
+  // 选中工序id
+  @State selectOperationId: string = ''
+  //选择的按钮索引(默认加载全部)
+  @State selectedButtonIndex: number = 0
+  // 流转卡号信息集合
+  @State taskSeqArray: TaskSeqVO[] = []
 
+  private scrollerList: Scroller = new Scroller()
   pageNo: number = 1
   pageSize: number = 9
 
@@ -151,6 +42,36 @@ struct Index {
     maskColor: 'rgba(0,0,0,0.8)',  // 黑色遮罩
   })
 
+  switchingProductDialogController: CustomDialogController = new CustomDialogController({
+    builder: SwitchingProductDialog({
+      scanSeqValue: this.scanCode
+    }),
+    autoCancel: true, // 点击遮罩关闭
+    customStyle: true,
+    maskColor: 'rgba(0,0,0,0.8)',  // 黑色遮罩
+  })
+
+  handleAllClick():void {
+    this.onQueryTask([])
+  }
+
+  handleReportedClick():void{
+    this.onQueryTask([2])
+  }
+
+  handleUnreportedClick():void{
+    this.onQueryTask([-1,0,1])
+  }
+
+  onQueryTask = async (currentStateList: Array<number>)=>{
+    this.taskSeqArray = await ProcessRequest.post('/api/v1/plan/task/list', {
+      stationId: CommonConstants.STATION_ID.toString(),
+      workOrderCode: this.selectWorkOder.workOrderCode!,
+      operationId: this.selectOperationId,
+      stateList: currentStateList
+    } as RequestParamModel) as TaskSeqVO[];
+  }
+
   async aboutToAppear() {
     if (!this.selectWorkOder || !this.selectWorkOder.workOrderCode) {
       this.selectOrderController.open()
@@ -297,7 +218,7 @@ struct Index {
                       Row() {
                         Text((index + 1).toString())
                           .fontSize($r('app.float.fontSize_16'))
-                          .fontColor($r('app.color.FFFFFF'))
+                          .fontColor(this.selectOperationId === item.operationId ? $r('app.color.90000000') : $r('app.color.FFFFFF'))
                           .fontWeight(FontWeight.Bold)
                       }
                       .width('14.6%')
@@ -306,7 +227,7 @@ struct Index {
                       Row() {
                         Text(item.operationName)
                           .fontSize($r('app.float.fontSize_16'))
-                          .fontColor( $r('app.color.FFFFFF'))
+                          .fontColor(this.selectOperationId === item.operationId ? $r('app.color.90000000') : $r('app.color.FFFFFF'))
                           .fontWeight(FontWeight.Regular)
                           .padding({left: 5})
                       }
@@ -315,10 +236,11 @@ struct Index {
                       .alignItems(VerticalAlign.Center)
                       .justifyContent(FlexAlign.Start)
                       Row() {
-                        Image($r('app.media.process_complete'))
+                        Image(this.selectOperationId === item.operationId ? $r('app.media.process_current_operation') : (item.isEnd! ? $r('app.media.process_complete') : ''))
                           .width($r('app.float.virtualSize_24'))
                           .height($r('app.float.virtualSize_24'))
-                          .fillColor($r('app.color.FFFFFF'))
+                          .fillColor(this.selectOperationId === item.operationId ? $r('app.color.90000000') : $r('app.color.FFFFFF'))
+                          .opacity(this.selectOperationId != item.operationId && !item.isEnd ? 0 : 1)
                       }
                       .width('14.6%')
                       .height('100%')
@@ -327,10 +249,20 @@ struct Index {
                     .width('100%')
                     .height('70%')
                     .borderRadius($r('app.float.virtualSize_40'))
-                    .backgroundImage($r('app.media.process_no_select_operation'))
+                    .backgroundImage(this.selectOperationId === item.operationId ? $r('app.media.process_select_operation') : $r('app.media.process_no_select_operation'))
                     .backgroundImageSize(ImageSize.Cover)
                     .onClick(() => {
-
+                      this.selectOperationId = item.operationId!
+                      if (!item.exists) {
+                        promptAction.showToast({
+                          message: `${item.operationName}需要在${item.stationName}工位上生产`,
+                          duration: 1500,
+                          bottom: 100
+                        })
+                      }
+                      if (!this.seqNo || this.seqNo.length <= 0) {
+                        this.handleAllClick()
+                      }
                     })
 
                     if (index < this.selectWorkOder.ops!.length - 1) {
@@ -364,41 +296,93 @@ struct Index {
         .width('19.8%')
         .justifyContent(FlexAlign.SpaceBetween)
         // 右侧生产操作栏
-        Column({space: 5}) {
+        Column() {
           Row() {
-            Text('扫描流水/序列/铭牌号')
-              .fontSize($r('app.float.fontSize_16'))
-              .fontWeight(FontWeight.Regular)
+            Text('录入流水号')
+              .fontSize($r('app.float.fontSize_30'))
+              .fontWeight(FontWeight.Medium)
               .fontColor($r('app.color.FFFFFF'))
           }
-          .width('25%')
+          .height('10%')
+          .width('97.2%')
+          .justifyContent(FlexAlign.Start)
           Row() {
-            Row().width('3.4%')
-            // 左侧二维码图标
-            Image($r('app.media.material_qr_code')) // 请替换为您的二维码图片资源
-              .width($r('app.float.virtualSize_24'))
-              .height($r('app.float.virtualSize_24'))
-              .fillColor($r('app.color.FFFFFF'))
-            // 扫码输入框
-            TextInput({ placeholder: '请扫描物料编码', text: this.scanCode })
-              .type(InputType.Normal)
-              .placeholderFont({ size: $r('app.float.fontSize_16')})
-              .placeholderColor($r('app.color.30FFFFFF'))
-              .fontSize($r('app.float.fontSize_16'))
-              .fontColor($r('app.color.FFFFFF'))
-              .enableKeyboardOnFocus(false)
-              .onChange((value: string) => {
-                this.scanCode = value
-              })
-              .onSubmit(async () => {
+            Column({space: 8}) {
+              Row() {
+                this.buildButton(0, '全部', () => this.handleAllClick())
+                this.buildButton(1, '已报工', () => this.handleReportedClick())
+                this.buildButton(2, '未报工', () => this.handleUnreportedClick())
+              }
+              .width('72%')
+              .height('5.3%')
+              .justifyContent(FlexAlign.Start)
 
-              })
+              List({space: 4, scroller: this.scrollerList}) {
+                ForEach(this.taskSeqArray, (item:TaskSeqVO) => {
+                  ListItem() {
+                    taskSeqItem({
+                      item:item,
+                      scanSeqValue: this.scanCode,
+                      selectedButtonIndex: this.selectedButtonIndex
+                    })
+                  }
+                })
+              }
+              .width('72%')
+              .height('94.7%')
+            }
+            .width('52.9%')
+            .height('100%')
+            .alignItems(HorizontalAlign.End)
+            .padding({right: '2.6%'})
+            Divider()
+              .vertical(true)
+              .color($r('app.color.15FFFFFF'))
+              .height('100%')
+
+            Column({space: 5}) {
+              Row().height('37%')
+              Row() {
+                Text('扫描流水/序列/铭牌号')
+                  .fontSize($r('app.float.fontSize_16'))
+                  .fontWeight(FontWeight.Regular)
+                  .fontColor($r('app.color.FFFFFF'))
+              }
+              .width('62%')
+              Row() {
+                Row().width('3.4%')
+                // 左侧二维码图标
+                Image($r('app.media.material_qr_code')) // 请替换为您的二维码图片资源
+                  .width($r('app.float.virtualSize_24'))
+                  .height($r('app.float.virtualSize_24'))
+                  .fillColor($r('app.color.FFFFFF'))
+                // 扫码输入框
+                TextInput({ placeholder: '请扫描物料编码', text: this.scanCode })
+                  .type(InputType.Normal)
+                  .placeholderFont({ size: $r('app.float.fontSize_16')})
+                  .placeholderColor($r('app.color.30FFFFFF'))
+                  .fontSize($r('app.float.fontSize_16'))
+                  .fontColor($r('app.color.FFFFFF'))
+                  .enableKeyboardOnFocus(false)
+                  .onChange((value: string) => {
+                    this.scanCode = value
+                  })
+                  .onSubmit(async () => {
+
+                  })
+              }
+              .width('65%')
+              .height('6.5%')
+              .borderRadius($r('app.float.virtualSize_16'))
+              .backgroundColor($r('app.color.000000'))
+              .justifyContent(FlexAlign.Start)
+            }
+            .width('52.9%')
+            .height('100%')
           }
-          .width('26.4%')
-          .height('6.5%')
-          .borderRadius($r('app.float.virtualSize_16'))
-          .backgroundColor($r('app.color.000000'))
-          .justifyContent(FlexAlign.Start)
+          .width('100%')
+          .height('87.7%')
+          .justifyContent(FlexAlign.Center)
         }
         .width('79.1%')
         .height('100%')
@@ -509,6 +493,9 @@ struct Index {
           .justifyContent(FlexAlign.Center)
           .backgroundColor($r('app.color.20FFFFFF'))
           .borderRadius($r('app.float.fontSize_16'))
+          .onClick(()=>{
+            this.switchingProductDialogController.open()
+          })
           Row().width('1.5%')
           Row({space: 4}) {
             Image($r('app.media.process_start_work'))
@@ -538,4 +525,34 @@ struct Index {
     .height('100%')
     .backgroundColor($r('app.color.000000'))
   }
+
+  @Builder
+  buildButton(index: number, text: string, onClick: () => void) {
+    Row({space: 5}){
+      if(this.selectedButtonIndex === index) {
+        Image($r('app.media.process_radio_check'))
+          .width($r('app.float.virtualSize_24'))
+          .height($r('app.float.virtualSize_24'))
+          .fillColor($r('app.color.0A84FF'))
+      } else {
+        Image($r('app.media.process_radio_no_check'))
+          .width($r('app.float.virtualSize_24'))
+          .height($r('app.float.virtualSize_24'))
+          .fillColor($r('app.color.FFFFFF'))
+      }
+      Text(text)
+        .fontSize($r('app.float.fontSize_16'))
+        .fontColor($r('app.color.FFFFFF'))
+    }
+    .justifyContent(FlexAlign.Center)
+    .width('24.3%')
+    .height('100%')
+    .backgroundColor(this.selectedButtonIndex === index ? $r('app.color.200A84FF') : $r('app.color.20FFFFFF')) // 选中蓝/未选中灰
+    .borderRadius($r('app.float.virtualSize_16'))
+    .margin({ right:'3%'})
+    .onClick(() => {
+      this.selectedButtonIndex = index
+      onClick();
+    })
+  }
 }

entry/src/main/ets/view/SwitchingProductDialog.ets

@@ -16,7 +16,7 @@ export struct SwitchingProductDialog{
   //选择的按钮索引(默认加载全部)
   @State selectedButtonIndex: number = 0
   //扫描的流水号/序列/铭牌号
-  @State scanSeqValue:string = ''
+  @Link scanSeqValue: string
 
   controller: CustomDialogController
   onQueryTask=async (currentStateList:Array<number>)=>{
@@ -161,7 +161,7 @@ export struct SwitchingProductDialog{
          .margin({right:'20%'})
          .justifyContent(FlexAlign.Start)
          Column(){
-           List({space: 8,scroller:this.scrollerList}) {
+           List({space: 8, scroller:this.scrollerList}) {
              ForEach(this.queryTaskSeq, (item:TaskSeqVO) => {
                ListItem() {
                  taskSeqItem({
@@ -169,6 +169,9 @@ export struct SwitchingProductDialog{
                    scanSeqValue:this.scanSeqValue,
                    selectedButtonIndex:this.selectedButtonIndex
                  })
+                   .onClick(()=>{
+                     this.scanSeqValue = item.seqNo!
+                   })
                }
              })
            }
@@ -276,7 +279,7 @@ export struct SwitchingProductDialog{
 }
 
 @Component
-struct taskSeqItem{
+export struct taskSeqItem{
   @Prop item: TaskSeqVO
   @Link scanSeqValue:string
   @State scaleValue : number = 1
@@ -292,13 +295,13 @@ struct taskSeqItem{
         .fontSize($r('app.float.fontSize_16'))
         .fontColor($r('app.color.FFFFFF'))
         .textAlign(TextAlign.Start)
-      if(this.selectedButtonIndex!=2)
-      {
+      Blank()
+      if(this.selectedButtonIndex != 2) {
         Text(`报工时间：${this.item.updated}`)
           .fontSize($r('app.float.fontSize_16'))
           .fontColor($r('app.color.60FFFFFF'))
           .fontWeight(FontWeight.Lighter)
-          .margin({ left:'35%'})
+          .margin({ right:'2%'})
       }
     }.width('100%')
     .justifyContent(FlexAlign.Start)

entry/src/main/ets/viewmodel/process/OperationInfo.ets

@@ -27,4 +27,10 @@ export default class OperationInfo {
   inspection?: number
   // 是否首检
   firstCheck?: number
+  // 工单下工序是否完成
+  isEnd?: boolean
+  // 工位id
+  stationId?: string
+  // 工位名称
+  stationName?: string
 }

entry/src/main/resources/base/media/process_current_operation.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24">
+  <path fill-opacity=".9" fill-rule="evenodd" d="M12 19a7 7 0 1 0 0-14 7 7 0 0 0 0 14Zm0 2a9 9 0 1 0 0-18 9 9 0 0 0 0 18Z" clip-rule="evenodd"/>
+  <path fill-opacity=".9" d="M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/>
+</svg>