HJ_openHarmony_process/entry/src/main/ets/view/ProcessReportingDialog.ets

//工序报工
import ProcessRequest from '../common/util/request/ProcessRequest'
import { BindTaskSeqVO } from '../viewmodel/BindTaskSeqVO'
import TaskSeqVO from '../viewmodel/process/TaskSeqInfo'
import ReportInfo from '../viewmodel/ReportInfo'
import RequestParamModel from '../viewmodel/RequestParamModel'
import WorkOrderInfo from '../viewmodel/WorkOrderInfo'

@CustomDialog
export struct ProcessReportingDialog{
  private scrollerList: Scroller = new Scroller()
  //查询报工
  @Link reportList: ReportInfo[]
  //当前工单号
  @State currentWorkOrderCode:string = ''
  //当前工序号
  @State currentOperationId:string = ''
  //当前工位
  @State currentStationId:string = ''
  //选择的按钮索引(默认加载全部)
  @State addReportingClick: number = 1
  //从首页传来的工单
  @Prop selectWorkOder: WorkOrderInfo = {}
  //工序名字
  @Prop selectProcessName:string = '正面三防'
  //当前工序已报工数量
  @State reportedNum:number = 0
  //计划报工数量
  @State planReportNum:number = 0
  //扫描的流水号/序列/铭牌号
  @State scanSeqValue: string = ''
  @State userName:string = '王德发'
  @State currentReporterIndex: number = 0; // 记录当前点击的报工人索引
  @Consume ('bindTaskSeq') bindTaskSeq: BindTaskSeqVO[]

  controller: CustomDialogController
  onConfirm: () => void = () => {}
  //选择报工人
  onSelectReporter: (index:number) => void = () => {}
  //选择报工数量
  onSelectReportNum: (index:number) => void = () => {}
  //选择不良品数量
  onSelectUnqualified: (index:number) => void = () => {}


  updateReporterName(index: number, name: string) {
    if (this.reportList[index]) {
      this.reportList[index].userName = name;
      // 强制刷新界面
      this.reportList = [...this.reportList];
    }
  }

  //加载第一个报工人（无法删除）
  loadFirstReport=async ()=>{
    const firstReporter:ReportInfo= {}
    firstReporter.userName = this.userName
    this.reportList.push(firstReporter)
  }

  onQueryTask = async (currentStateList: Array<number>): Promise<number> => {
    let res = await ProcessRequest.post('/api/v1/plan/task/list', {
      stationId: this.currentStationId,
      workOrderCode: this.currentWorkOrderCode,
      operationId: this.currentOperationId,
      stateList: currentStateList
    } as RequestParamModel) as TaskSeqVO[];
    return res.length;
  }

  async handleAllClick(): Promise<void> {
   this.planReportNum = await this.onQueryTask([]);
  }

  async handleReportedClick(): Promise<void> {
    this.reportedNum = await this.onQueryTask([2]);
  }

  aboutToAppear(): void {
    this.loadFirstReport()
  }


  build() {
    Column() {
      Column() {
        Text("工序报工")
          .fontColor($r('app.color.FFFFFF'))
          .fontSize($r('app.float.fontSize_30'))
      }
      .height('8%')
      .width('100%')
      .justifyContent(FlexAlign.Center)


      Column(){
          Row(){
            Column({space:3}){
              Text(this.selectWorkOder.materialName)
                .fontSize($r('app.float.fontSize_24'))
                .fontColor($r('app.color.FFFFFF'))
              Text(this.selectWorkOder.materialCode)
                .fontSize($r('app.float.fontSize_12'))
                .fontColor($r('app.color.FFFFFF'))
                .fontWeight(FontWeight.Lighter)
              Row(){
                Text("工单 ")
                  .fontSize($r('app.float.fontSize_16'))
                  .fontColor($r('app.color.FFFFFF'))
                  .fontWeight(FontWeight.Lighter)
                Text(this.selectWorkOder.workOrderCode)
                  .fontSize($r('app.float.fontSize_16'))
                  .fontColor($r('app.color.FFFFFF'))
              }
            }
            .height('100%')
            .width('30%')
            .justifyContent(FlexAlign.End)
            .alignItems(HorizontalAlign.Start)
            Row(){
              Text('工序')
                .fontSize($r('app.float.fontSize_16'))
                .fontColor($r('app.color.FFFFFF'))
                .fontWeight(FontWeight.Lighter)
              Text(this.selectProcessName)
                .fontSize($r('app.float.fontSize_16'))
                .fontColor($r('app.color.FFFFFF'))
            }
            .height('100%')
            .width('40%')
            .justifyContent(FlexAlign.Center)
            .alignItems(VerticalAlign.Bottom)
            Column(){
              Row(){
                Text(`${this.reportedNum}/`)
                  .fontSize($r('app.float.fontSize_38'))
                  .fontColor($r('app.color.FFFFFF'))
                Text(`${this.planReportNum}`)
                  .fontSize($r('app.float.fontSize_38'))
                  .fontColor($r('app.color.60FFFFFF'))
              }
              Text('当前工序已报工/计划')
                .fontSize($r('app.float.fontSize_12'))
                .fontColor($r('app.color.FFFFFF'))
                .fontWeight(FontWeight.Lighter)

            }
            .height('100%')
            .width('30%')
            .justifyContent(FlexAlign.End)
            .alignItems(HorizontalAlign.End)
          }
          .height('10%')
          .width('96%')
          .margin({left:'2%',right:'2%'})
          Row(){
            Image($r('app.media.process_reporting_add'))
              .width($r('app.float.virtualSize_24'))
              .height($r('app.float.virtualSize_24'))
              .fillColor($r('app.color.0A84FF'))
            Text('添加报工人')
              .fontColor($r('app.color.0A84FF'))
              .fontSize($r('app.float.fontSize_24'))
              .margin({left:'4%'})
          }
          .height('8%')
          .width('14%')
          .margin({left:'2%',top:'1.5%',bottom:'1.5%'})
          .justifyContent(FlexAlign.Center)
          .backgroundColor($r('app.color.20FFFFFF'))
          .borderRadius($r('app.float.virtualSize_16'))
          .scale({ x: this.addReportingClick, y: this.addReportingClick })
          .animation({
            duration: 200,
            curve: Curve.Linear
          })
          .onClick(() => {
            this.addReportingClick = 0.9;
            setTimeout(() => {
              this.addReportingClick = 1;
              const newReporter:ReportInfo= {}
              this.reportList.push(newReporter)
            }, 200);
          })
          Column(){
            List({space: 8, scroller:this.scrollerList}) {
              ForEach(this.reportList, (item:ReportInfo,index) => {
                ListItem() {
                  Row(){
                    Column(){
                      Text(`报工人${index}`)
                        .fontColor($r('app.color.FFFFFF'))
                        .fontSize($r('app.float.fontSize_16'))
                        .fontWeight(FontWeight.Regular)
                        .height('30%')
                        .margin({left:'2%'})
                      Row(){
                        Text(item.userName)
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .margin({left:'8%'})
                          .width('82%')
                          .textAlign(TextAlign.Start)
                        Text(">")
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .textAlign(TextAlign.Start)
                          .width('10%')
                      }
                      .justifyContent(FlexAlign.Start)
                      .borderRadius($r('app.float.virtualSize_16'))
                      .height('70%')
                      .enabled(index!=0)
                      .backgroundColor($r('app.color.20FFFFFF'))
                      .onClick(()=>{
                        this.onSelectReporter(index)
                        this.currentReporterIndex = index;
                      })
                    }
                    .width('29%')
                    .height('100%')
                    .alignItems(HorizontalAlign.Start)
                    Column(){
                      Text(`报工数量`)
                        .fontColor($r('app.color.FFFFFF'))
                        .fontSize($r('app.float.fontSize_16'))
                        .fontWeight(FontWeight.Regular)
                        .height('30%')
                        .margin({left:'2%'})
                      Row(){
                        Text(item.reportNum)
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .margin({left:'8%'})
                          .width('82%')
                          .textAlign(TextAlign.Start)
                        Text(">")
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .textAlign(TextAlign.Start)
                          .width('10%')
                      }
                      .justifyContent(FlexAlign.Start)
                      .borderRadius($r('app.float.virtualSize_16'))
                      .height('70%')
                      .backgroundColor($r('app.color.20FFFFFF'))
                      .onClick(()=>{
                        this.onSelectReportNum(index)
                      })
                    }
                    .width('29%')
                    .height('100%')
                    .alignItems(HorizontalAlign.Start)
                    .margin({left:'2%',right:'2%'})
                    Column(){
                      Text(`不良品数量`)
                        .fontColor($r('app.color.FFFFFF'))
                        .fontSize($r('app.float.fontSize_16'))
                        .fontWeight(FontWeight.Regular)
                        .height('30%')
                        .margin({left:'2%'})
                      Row(){
                        Text(item.unqualifiedNum)
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .margin({left:'8%'})
                          .width('82%')
                          .textAlign(TextAlign.Start)
                        Text(">")
                          .fontColor($r('app.color.FFFFFF'))
                          .fontSize($r('app.float.fontSize_24'))
                          .textAlign(TextAlign.Start)
                          .width('10%')
                      }
                      .justifyContent(FlexAlign.Start)
                      .borderRadius($r('app.float.virtualSize_16'))
                      .backgroundColor($r('app.color.20FFFFFF'))
                      .height('70%')
                      .onClick(()=>{
                        this.onSelectUnqualified(index)
                      })
                    }
                    .width('29%')
                    .alignItems(HorizontalAlign.Start)
                    .height('100%')
                    if(index>0)
                    {
                      Column(){
                        Image($r('app.media.process_delete_seq'))
                          .width($r('app.float.virtualSize_48'))
                          .height($r('app.float.virtualSize_48'))
                          .fillColor($r('app.color.FF453A'))
                          .margin({top:'35%'})
                          .onClick(()=>{
                            this.reportList.splice(index,1)
                            this.bindTaskSeq = this.bindTaskSeq.filter(i => i.userName !== item.userName);
                          })
                      }
                      .width('9%')
                      .alignItems(HorizontalAlign.Center)
                      .height('100%')
                    }
                  }
                  .height('100%')
                }.height('20%')
              })
            }
            .width('98%')
            .height('100%')
            .margin({left:'2%'})
          }
          .height('74%')
          .width('100%')

        }
      .justifyContent(FlexAlign.Start)
      .alignItems(HorizontalAlign.Start)
      .width('100%')
      .height('84%')

      Column() {
        Divider()
          .vertical(false)
          .strokeWidth(1)
          .color($r('app.color.15FFFFFF'))
        Row() {
          Row() {
            Text('取消')
              .fontColor($r('app.color.60FFFFFF'))
              .fontSize($r('app.float.fontSize_30'))
          }
          .justifyContent(FlexAlign.Center)
          .width('50%')
          .onClick(() => this.controller.close())
          Divider()
            .vertical(true)
            .strokeWidth(1)
            .color($r('app.color.15FFFFFF'))
          Row() {
            Text('确认报工')
              .fontColor($r('app.color.007AFF'))
              .fontSize($r('app.float.fontSize_30'))
          }
          .justifyContent(FlexAlign.Center)
          .width('50%')
          .onClick(() => {
            this.controller.close();
          })
        }
      }
      .width('100%')
      .height('8%')

    }
    .height('71%')
    .width('62%')
    .backgroundColor($r('app.color.2A2A2A'))
    .justifyContent(FlexAlign.End)
    .alignItems(HorizontalAlign.Start)
    .borderColor($r('app.color.000000'))
    .borderWidth(1)
    .borderRadius($r('app.float.virtualSize_16'))
  }
}