import { TimeAndTitle } from '../common/component/TimeAndTitle'; import router from '@ohos.router'; import WorkOrderInfo from '../viewmodel/WorkOrderInfo'; import CommonConstants from '../common/constants/CommonConstants'; import ProcessRequest from '../common/util/request/ProcessRequest'; import RequestParamModel from '../viewmodel/RequestParamModel'; import OperationInfo from '../viewmodel/process/OperationInfo'; import { SelectWorkOrderDialog } from '../view/SelectWorkOrderDialog'; import { SwitchingProductDialog, taskSeqItem } from '../view/SwitchingProductDialog'; import TaskSeqVO from '../viewmodel/process/TaskSeqInfo'; import promptAction from '@ohos.promptAction'; import { LoginInfoDialog } from '../view/LoginInfoDialog'; import { SwitchingDeptDialog, SwitchingProductLineDialog, SwitchingStationDialog } from '../view/SwitchingStationViews'; import { SwitchingUserDialog } from '../view/SwitchingUserDialog'; import OperationComponent from '../viewmodel/process/OperationComponent'; import ProcessInfo from '../viewmodel/process/ProcessInfo'; import { MaterialCollectView } from '../view/process/MaterialCollectView'; import { WorkOrderPage } from '../viewmodel/WorkOrderPage'; import { UserInfo } from '../viewmodel/UserInfo'; import { CompleteReceiveDialog } from '../view/CompleteReceiveDialog'; import { WorkInstructionsDialog } from '../view/WorkInstructionsDialog'; import connection from '@ohos.net.connection'; import { ReportWorkNumDialog } from '../view/ReportWorkNumDialog'; import { ProcessReportingDialog } from '../view/ProcessReportingDialog'; import { JoinPersonNameDialog } from '../view/JoinPersonNameDialog'; import ReportInfo from '../viewmodel/ReportInfo'; import { BindTaskSeqVO } from '../viewmodel/process/BindTaskSeqVO'; import { MqttClientOptions, MqttConnectOptions } from '@ohos/mqtt'; import MqttManager from '../common/util/mqtt'; import { DefectNumReportDialog } from '../view/DefectNumReportDialog'; import { SelfInspectView } from '../view/process/SelfInspectView'; import { MultiMediaCollect } from '../view/process/MultiMediaCollect'; import { BarcodeAssociationDialog } from '../view/BarcodeAssociationDialog'; import WorkOrderSeq from '../viewmodel/WorkOrderSeq'; import { USBDeviceManager } from '../common/util/UsbDevice'; import { InAndOutBoundDialog } from '../view/InAndOutBoundDialog'; import { LittleMaterialRequestDialog } from '../view/LittleMaterialRequestDialog'; import { PictureDrawingDialog } from '../view/PictureDrawingDialog'; import { AuxiliaryOperationView } from '../view/AuxiliaryOperationView'; import { BusinessError } from '@ohos.base'; import window from '@ohos.window'; import { DeviceInspectionDialog } from '../view/DeviceInspectionDialog'; import preferencesUtil from '../common/util/PerferencesUtil'; import TimeUtil from '../common/util/TimeUtil'; import ProcessDeviceDailyCheck from '../viewmodel/process/ProcessDeviceDailyCheck'; import { DeviceCheckView } from '../view/process/DeviceCheckView'; // 声明接受参数的类型 interface Params { // 辅助操作标志 auxiliaryOperationFlag?: boolean, } @Entry @Component struct ProcessIndex { // 工单列表 @State workOrders: WorkOrderInfo[] = [] // 选中工单 @State selectWorkOder: WorkOrderInfo = {} // 工位通知数量 @State noticeNum: number = 100 // 扫描或手动输入的流水/序列/铭牌号 @State scanCode: string = '' // 当前流转卡号 @State seqNo: string = '' //是否打开底部抽屉 @State isAuxiliaryViewOpen:boolean = false // 选中工序id @State selectOperationId: string = '' // 绩效模式(0:计时 1:计件) @State operationPerformance: string = '' // 选中工序名称 selectOperationName: string = '' //选择的按钮索引(默认加载全部) @State selectedButtonIndex: number = 0 // 流转卡号信息集合 @State taskSeqArray: TaskSeqVO[] = [] // 工序组件(工步) @State opComponents: OperationComponent[] = [] // 选中的工序组件类型 @State selectComponentType: string = '' // 工序组件状态数组(0:未完成) @State componentStates: number[] = [] // 工序组件对应的图标 componentResMap: Map = new Map([ ['1', $r('app.media.process_component_material_collect')], ['2', $r('app.media.process_component_record_item')], ['3', $r('app.media.process_component_multi_media_collect')], ['4', $r('app.media.process_component_esop')], ['5', $r('app.media.process_component_self_inspect')], ['6', $r('app.media.process_component_device_record')], ['7', $r('app.media.process_component_fastening')], ['9', $r('app.media.process_component_label_bind')], ['10', $r('app.media.process_component_form')], ['11', $r('app.media.process_component_auto_test')], ['12', $r('app.media.process_component_device_record')], ]) // 扫码开工后的生产过程信息 @State process: ProcessInfo = {} // 扫码开工状态(0:未开工 1:已开工) @State @Watch('queryByScanState') scanState: number = 0 // 工单下流转卡号列表 @State seqList: WorkOrderSeq[] = [] // 设备每日点检 @State deviceChecks: ProcessDeviceDailyCheck[] = [] private scrollerList: Scroller = new Scroller() @Provide('currentDept') currentDept:string = '' @Provide('currentProductLine') currentProductLine:string = '' @Provide('currentStation') currentStation:string = '' @Provide('stationIp') stationIp:string = '' @Provide('currentPLCode') currentPLCode:string = '' @Provide('currentOrgId') currentOrgId:number = 0 @Provide('currentStationId') @Watch('refreshWorkOrder') currentStationId: string = '' @Provide('currentUserName') currentUserName: string ='' @Provide('currentUserId') currentUserId: number = 0 // 报工人、报工流水号和不良流水号 @Provide('bindTaskSeq') bindTaskSeq: BindTaskSeqVO[] = [] @State reportList: ReportInfo[] = [] @State currentReporterIndex:number =0 @State currentReportNumIndex:number =0 @State currentDefectIndex:number =0 // mqtt是否连接 @State isConnected: boolean = false // 工位发生改变则可能需要重新选择工单 async refreshWorkOrder() { if (!this.selectWorkOder || !this.selectWorkOder.workOrderCode) { return } console.log('hhtest', '执行刷新------' +this.currentStationId) let queryRes = await ProcessRequest.post('/api/v1/plan/workOrder/taskPage2', { stationId: this.currentStationId, queryComplete: 0, } as RequestParamModel) as WorkOrderPage; this.workOrders = queryRes?.records??[] if (this.workOrders) { let clearFlag: boolean = true for (const element of this.workOrders) { console.log('hhtest', '工单编码-----------------' + element.workOrderCode) if (element.workOrderCode! === this.selectWorkOder.workOrderCode) { clearFlag = false break } } if (clearFlag) { this.selectWorkOder = {} this.clearSelectData() this.selectOrderController.open() console.log('hhtest', '选择工单被清空-----------------') } } else { this.selectWorkOder = {} this.clearSelectData() this.selectOrderController.open() console.log('hhtest', '选择工单被清空-----------------') } } async queryByScanState() { if (this.scanState === 1) { await this.scanCodeToStartWork() } else { await this.getComponentsForNotStartWork() } } // 扫码开工 async scanCodeToStartWork() { this.process = await ProcessRequest.post('/api/v1/process/info/scan', { operationId: this.selectOperationId, qrCode: this.scanCode, workOrderCode: this.selectWorkOder.workOrderCode!, stationId: this.currentStationId } as RequestParamModel) this.opComponents = [] if (this.process && this.process.id) { this.opComponents = await ProcessRequest.get(`/api/v1/process/opCompent/get/${this.selectOperationId!}/${this.process?.id!}`) if (this.opComponents) { for (const element of this.opComponents) { if (CommonConstants.OPERATION_COMPONENT_TYPE.has(element.compentType!)) { element.compentType = CommonConstants.OPERATION_COMPONENT_TYPE.get(element.compentType!) } } } // 过滤掉点检工步 this.opComponents = this.opComponents.filter(item => item.compentType !== '5'); this.opComponents.unshift({ compentName:'自检', compentType: '5', deleted:0, operationId: this.selectOperationId, processRouteId: this.process?.id, remark:'', sortNum:0 }) } // 保存此流转卡号到数据库中 let seqNos: string[] = [] seqNos = await preferencesUtil.get(CommonConstants.PREFERENCE_INSTANCE_NAME, this.selectWorkOder.workOrderCode!, seqNos) if (seqNos.includes(this.seqNo)) { return } seqNos.push(this.seqNo) preferencesUtil.put(CommonConstants.PREFERENCE_INSTANCE_NAME, this.selectWorkOder.workOrderCode!, seqNos) } // 未开工查询工序组件(工步) async getComponentsForNotStartWork() { this.opComponents = await ProcessRequest.get('/api/v1/op/compent/get/' + this.selectOperationId) if (this.opComponents) { for (const element of this.opComponents) { if (CommonConstants.OPERATION_COMPONENT_TYPE.has(element.compentType!)) { element.compentType = CommonConstants.OPERATION_COMPONENT_TYPE.get(element.compentType!) } } } // 过滤掉点检工步 this.opComponents = this.opComponents.filter(item => item.compentType !== '5'); this.opComponents.unshift({ compentName: '自检', compentType: '5', deleted: 0, operationId: this.selectOperationId, processRouteId: '0', remark: '', sortNum: 0 }) } // 清除选中的相关数据(工单不做处理) clearSelectData() { this.selectOperationId = '' this.seqNo = '' this.seqList = [] this.scanState = 0 this.process = {} this.opComponents = [] this.taskSeqArray = [] this.handleAllClick() } handleAllClick():void { this.onQueryTask([]) } handleReportedClick():void{ this.onQueryTask([2]) } handleUnreportedClick():void{ this.onQueryTask([-1,0,1]) } onQueryTask = async (currentStateList: Array)=>{ if (!this.selectWorkOder.workOrderCode || !this.currentStationId || !this.selectOperationId) { return } this.taskSeqArray = await ProcessRequest.post('/api/v1/plan/task/list', { stationId: this.currentStationId, workOrderCode: this.selectWorkOder.workOrderCode!, operationId: this.selectOperationId, stateList: currentStateList } as RequestParamModel) as TaskSeqVO[]; } connectMQTT = async ()=> { const clientOptions: MqttClientOptions = { url: 'mqtt://192.168.1.3:1883', // 替换实际IP clientId: `process_client_${Date.now()}`, persistenceType: 1, // 使用英文逗号 // 建议开启自动重连 }; // MQTT连接配置 const connectOptions: MqttConnectOptions = { cleanSession: true, connectTimeout: 30, keepAliveInterval: 60, userName: 'optional_username', password: 'optional_password' }; try { MqttManager.init(clientOptions); this.isConnected = await MqttManager.connect(connectOptions); if (this.isConnected ) { console.info('hhtest', 'MQTT connected successfully'); await MqttManager.subscribe(CommonConstants.mqttSubscribeTopic1); await MqttManager.subscribe(CommonConstants.mqttSubscribeTopic3); if (CommonConstants.mqttSubscribeTopic1 != CommonConstants.mqttSubscribeTopic2) { await MqttManager.subscribe(CommonConstants.mqttSubscribeTopic2); } } else { console.error('hhtest', 'MQTT connection failed'); } } catch (err) { console.error('hhtest', `MQTT error: ${JSON.stringify(err)}`); } } connectUsbDevice=async()=>{ return USBDeviceManager.getInstance(); } onPageShow() { console.log('hhtest', '------------------------------') const params = router.getParams() as Params; // 获取传递过来的参数对象 if (params && params.auxiliaryOperationFlag) { this.isAuxiliaryViewOpen = true } } async aboutToAppear() { // 获取工位ip this.stationIp = CommonConstants.STATION_DEFAULT_IP try { const netHandle = connection.getDefaultNetSync(); if (netHandle) { let connectionProperties = await connection.getConnectionProperties(netHandle) if (connectionProperties && connectionProperties.linkAddresses) { connectionProperties.linkAddresses.forEach((address: connection.LinkAddress, index: number) => { this.stationIp = address.address.address if (address.address.address.startsWith(CommonConstants.ipPrefix)) { // todo 部署时放开注释 // CommonConstants.mqttSubscribeTopic1 = 'station' + address.address.address.replace(CommonConstants.ipPrefix, '') + '/data/devices' // CommonConstants.mqttSubscribePublish = 'station' + address.address.address.replace(CommonConstants.ipPrefix, '') + '/cmd/devices' } }) } } } catch (err) { console.log('hhtest', err); } // 创建mqtt连接和usb设备连接 this.connectMQTT() this.connectUsbDevice() // 判断是否选中工单,未选择则选则工单 if (!this.selectWorkOder || !this.selectWorkOder.workOrderCode) { this.selectOrderController.open() } //判断今日是否进行设备点检,否则先进行点检 this.deviceChecks = await ProcessRequest.post('/api/v1/process/deviceDailyCheck/list', { stationIp: this.stationIp, createDate: TimeUtil.getCurrentDate() } as RequestParamModel) if (!this.deviceChecks || this.deviceChecks.length <= 0) { this.deviceInspectionController.open() } // todo 删除 let token:string = await ProcessRequest.post('api/auth/aioLogin', { password: '123456', userName: 'admin', } as RequestParamModel) ; if (token && token.length > 0) { CommonConstants.AUTH_TOKEN = token this.currentUserName = 'admin' } this.currentProductLine = '配件产线01' this.currentPLCode = 'PL000018' this.currentStationId = '66' this.currentStation = '装配工位' let res:UserInfo = await ProcessRequest.get('/api/auth') ; this.currentUserId = res.id! as number // ---------------删除以上内容------------------ } build() { Stack() { Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center }) { //时间和导航标 Row() { TimeAndTitle() }.width('100%') .height('3.4%') .alignItems(VerticalAlign.Bottom) .justifyContent(FlexAlign.End) Row() { Image($r('app.media.general_return')) .height($r('app.float.virtualSize_56')) .width($r('app.float.virtualSize_56')) .fillColor($r('app.color.FFFFFF')) Text('生产执行') .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_30')) .fontWeight(FontWeight.Medium) } .height('4%') .width('94.8%') .justifyContent(FlexAlign.Start) .onClick(() => { // router.back() window.getLastWindow(getContext()).then((data) => { //获取窗口对象 let windowClass = data; windowClass.minimize((err: BusinessError) => { const errCode: number = err.code; if (errCode) { console.error('Failed to minimize the window. Cause: ' + JSON.stringify(err)); return; } console.info('Succeeded in minimizing the window.'); }); console.info('Succeeded in obtaining the top window. Data: ' + JSON.stringify(data)); }); return true; }) Row().height('2.8%') // 主要操作栏 Row() { // 左侧选择工单、工位、人员;工序查看 Column() { if (this.selectWorkOder && this.selectWorkOder.workOrderCode) { Column() { Text(this.selectWorkOder.materialName!) .fontWeight(FontWeight.Medium) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_24')) .width('88.9%') Text(this.selectWorkOder.materialCode!) .fontWeight(FontWeight.Lighter) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_12')) .width('88.9%') Row() { Text('工单:') .fontWeight(FontWeight.Lighter) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_12')) Text(this.selectWorkOder.workOrderCode!) .fontWeight(FontWeight.Bold) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_16')) } .width('88.9%') } .width('100%') .height('12.4%') .justifyContent(FlexAlign.Center) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { this.selectOrderController.open() }) } else { Button('请选择工单', { type: ButtonType.Normal }) .width('100%') .height('12.4%') .fontWeight(FontWeight.Medium) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_24')) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { this.selectOrderController.open() }) } // 登录信息(工位、人员信息) Row() { Row().width('5.6%') Column() { Text(this.currentStation) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Regular) .fontColor($r('app.color.FFFFFF')) Text(this.currentUserName) .fontSize($r('app.float.fontSize_12')) .fontWeight(FontWeight.Lighter) .fontColor($r('app.color.FFFFFF')) } .width('48.8%') .height('100%') .justifyContent(FlexAlign.Center) .alignItems(HorizontalAlign.Start) Row() { Text(this.noticeNum > 99 ? '99+' : this.noticeNum.toString()) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Bold) .fontColor($r('app.color.FFFFFF')) .textAlign(TextAlign.Center) .height('42.3%') .width('42%') .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) } .width('40%') .height('100%') .justifyContent(FlexAlign.End) Row().width('5.6%') } .width('100%') .height('8.1%') .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { this.loginInfoController.open() }) // 工序 Column({ space: 4 }) { Row() { Text('工序') .fontWeight(FontWeight.Medium) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_24')) } .width('83.4%') .height('8.4%') .alignItems(VerticalAlign.Bottom) List() { ForEach(this.selectWorkOder.ops!, (item: OperationInfo, index: number) => { ListItem() { Column() { Row() { Row() { Text((index + 1).toString()) .fontSize($r('app.float.fontSize_16')) .fontColor(this.selectOperationId === item.operationId ? $r('app.color.90000000') : $r('app.color.FFFFFF')) .fontWeight(FontWeight.Bold) } .width('14.6%') .height('80%') .justifyContent(FlexAlign.Center) Row() { Text(item.operationName) .fontSize($r('app.float.fontSize_16')) .fontColor(this.selectOperationId === item.operationId ? $r('app.color.90000000') : $r('app.color.FFFFFF')) .fontWeight(FontWeight.Regular) .padding({ left: 5 }) } .width('70.8%') .height('100%') .alignItems(VerticalAlign.Center) .justifyContent(FlexAlign.Start) Row() { 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(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%') .justifyContent(FlexAlign.Center) } .width('100%') .height('70%') .borderRadius($r('app.float.virtualSize_40')) .backgroundImage(this.selectOperationId === item.operationId ? $r('app.media.process_select_operation') : $r('app.media.process_no_select_operation')) .backgroundImageSize(ImageSize.Cover) .onClick(() => { if (!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId) { return } this.selectOperationId = item.operationId! this.selectOperationName = item.operationName! this.operationPerformance = item.performance! if (!item.exists) { promptAction.showToast({ message: `${item.operationName}需要在${item.stationName}工位上生产`, duration: 1500, bottom: 100 }) if (this.scanCode) { // 未开工查询工序组件 this.getComponentsForNotStartWork() } } else if (this.scanState === 0 && this.scanCode) { // 未开工查询工序组件 this.getComponentsForNotStartWork() } else if (this.scanState === 1) { this.scanCodeToStartWork() } if (!this.seqNo || this.seqNo.length <= 0) { this.handleAllClick() } }) if (index < (this.selectWorkOder?.ops && this.selectWorkOder?.ops?.length ? this.selectWorkOder?.ops!.length : 0) - 1) { Row() { Divider() .vertical(true) .color($r('app.color.60FFFFFF')) .padding({ right: '15%' }) } .justifyContent(FlexAlign.Center) .width('20%') .layoutWeight(1) } } .width('100%') .height('10.6%') .alignItems(HorizontalAlign.Start) } }) } .width('83.4%') .height('88.6%') .alignListItem(ListItemAlign.Center) } .width('100%') .height('77.2%') .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .opacity(!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId ? 0.3 : 1) } .height('100%') .width('19.8%') .justifyContent(FlexAlign.SpaceBetween) // 右侧生产操作栏 if (this.opComponents.length <= 0) { // 没有工序组件则展示扫码页面 Column() { Row() { Text('录入流水号') .fontSize($r('app.float.fontSize_30')) .fontWeight(FontWeight.Medium) .fontColor($r('app.color.FFFFFF')) } .height('10%') .width('97.2%') .justifyContent(FlexAlign.Start) Row() { 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) => { if (!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId) { return } this.scanCode = value }) .onSubmit(async () => { if (!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId || !this.scanCode) { return } // 流转卡号是否有效 let seqNoFlag = false for (const element of this.taskSeqArray) { if (element.seqNo === this.scanCode) { seqNoFlag = true break; } } if (!seqNoFlag) { promptAction.showToast({ message: `${this.scanCode}不是有效的流水号`, duration: 1500, bottom: 100 }) this.scanCode = '' return } // 查询工序组件 this.getComponentsForNotStartWork() this.seqNo = this.scanCode // 保存此流转卡号到数据库中 let seqNos: string[] = [] seqNos = await preferencesUtil.get(CommonConstants.PREFERENCE_INSTANCE_NAME, this.selectWorkOder.workOrderCode, seqNos) if (seqNos.includes(this.seqNo)) { return } seqNos.push(this.seqNo) preferencesUtil.put(CommonConstants.PREFERENCE_INSTANCE_NAME, this.selectWorkOder.workOrderCode, seqNos) }) } .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('100%') .height('87.7%') .justifyContent(FlexAlign.Center) } .width('79.1%') .height('100%') .justifyContent(FlexAlign.Center) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .opacity(!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId ? 0.3 : 1) } else { Column() { List({ space: 4 }) { ForEach(this.opComponents, (item: OperationComponent, index: number) => { ListItem() { Column() { Stack() { Image(this.selectComponentType === item.compentType! ? $r('app.media.process_component_state_select') : (this.componentStates.length >= (index + 1) && this.componentStates[index] === 1 ? $r('app.media.process_component_state_finish') : $r('app.media.process_component_state_no_select'))) .height(this.selectComponentType === item.compentType! ? '100%' : '90%') .width('100%') .objectFit(ImageFit.Fill) .borderRadius($r('app.float.fontSize_16')) Column({ space: 2 }) { Image(this.componentResMap.get(item.compentType!)) .height($r('app.float.virtualSize_24')) .width($r('app.float.virtualSize_24')) .fillColor(this.selectComponentType === item.compentType! ? $r('app.color.99000000') : (this.componentStates.length >= (index + 1) && this.componentStates[index] === 1 ? $r('app.color.30D158') : $r('app.color.FFFFFF'))) Text(item.compentName!) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Regular) .fontColor(this.selectComponentType === item.compentType! ? $r('app.color.99000000') : (this.componentStates.length >= (index + 1) && this.componentStates[index] === 1 ? $r('app.color.30D158') : $r('app.color.FFFFFF'))) } .width('100%') .height('90%') .justifyContent(FlexAlign.Center) } .width('100%') .height('100%') .alignContent(Alignment.Top) .onClick(() => { this.selectComponentType = item.compentType! }) } .height('100%') .width('12.5%') } }) } .listDirection(Axis.Horizontal) .height('9.3%') .width('79.1%') // 不同工序组件(工步)展示不同页面 Column() { if (this.selectComponentType === '1') { MaterialCollectView({ scanState: this.scanState, seqNo: this.seqNo, selectWorkOder: this.selectWorkOder, selectOperationId: this.selectOperationId, process: this.process, }) } else if (this.selectComponentType === '3' && this.scanState == 1) { MultiMediaCollect({ seqNo: this.seqNo, selectOperationId: this.selectOperationId, process: this.process, }) } else if (this.selectComponentType === '5') { SelfInspectView({ scanState: this.scanState, seqNo: this.seqNo, selectOperationId: this.selectOperationId, process: this.process, }) } else if (this.selectComponentType === '6') { DeviceCheckView({ deviceChecks: this.deviceChecks, scanState: this.scanState, seqNo: this.seqNo, selectOperationId: this.selectOperationId, process: this.process, }) } } .width('79.1%') .height('90.7%') .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) } } } .height('80%') .width('94.8%') .justifyContent(FlexAlign.SpaceBetween) // 底部按钮和抽屉 Stack() { Column() { Blank() Stack() { Image($r('app.media.process_drawer_thumbnail')) .width('100%') .height('100%') Image($r('app.media.process_drawer_switch')) .width($r('app.float.virtualSize_48')) .height($r('app.float.virtualSize_48')) .fillColor($r('app.color.60FFFFFF')) } .width('100%') .height('47%') } .width('100%') .height('100%') Row() { Row({ space: 4 }) { Image($r('app.media.process_work_instruction')) .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')) .fontWeight(FontWeight.Medium) } .width('10%') .height('58.3%') .justifyContent(FlexAlign.Center) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { if (!this.selectWorkOder.workOrderCode) { return } this.workInstructionsController.open() }) Row().width('1.5%') Row({ space: 4 }) { Image($r('app.media.process_complete_reception')) .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')) .fontWeight(FontWeight.Medium) } .width('10%') .height('58.3%') .justifyContent(FlexAlign.Center) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { if (!this.selectWorkOder.workOrderCode) { return } this.completeReceiveController.open() }) Blank() .onClick(() => { this.isAuxiliaryViewOpen = true }) Column({ space: 2 }) { Row() { Text((this.selectWorkOder && this.selectWorkOder.workOrderCode) ? parseInt(this.selectWorkOder.completeNum!) + '/' + parseInt(this.selectWorkOder.planNum) : '') .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Lighter) } .width('100%') .height('50%') .justifyContent(FlexAlign.End) .alignItems(VerticalAlign.Bottom) Row() { if (this.seqNo.length > 0) { Text('S/N ') .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Lighter) Text(this.seqNo) .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_16')) .fontWeight(FontWeight.Bold) } } .width('100%') .height('50%') .justifyContent(FlexAlign.End) .alignItems(VerticalAlign.Top) } .width('10.8%') .height('100%') Row().width('1%') Row({ space: 4 }) { Image($r('app.media.process_switch')) .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')) .fontWeight(FontWeight.Medium) } .width('10%') .height('58.3%') .justifyContent(FlexAlign.Center) .backgroundColor($r('app.color.20FFFFFF')) .borderRadius($r('app.float.fontSize_16')) .onClick(() => { if (!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId || !this.selectOperationId) { return } this.switchingProductDialogController.open() }) Row().width('1.5%') Row({ space: 4 }) { Image(this.scanState === 1 ? $r('app.media.process_report') : $r('app.media.process_start_work')) .width($r('app.float.virtualSize_24')) .height($r('app.float.virtualSize_24')) .fillColor($r('app.color.FFFFFF')) Text(this.scanState === 1 ? '工序报工' : '工序开工') .fontColor($r('app.color.FFFFFF')) .fontSize($r('app.float.fontSize_24')) .fontWeight(FontWeight.Medium) } .width('10%') .height('58.3%') .justifyContent(FlexAlign.Center) .backgroundColor(this.scanState === 1 ? $r('app.color.30D158') : $r('app.color.0A84FF')) .borderRadius($r('app.float.fontSize_16')) .onClick(async () => { if (!this.scanCode || this.scanCode.length <= 0) { promptAction.showToast({ message: `请先扫描流水/序列/铭牌号`, duration: 1500, bottom: 100 }) return } if (!this.selectOperationId || this.selectOperationId.length <= 0) { promptAction.showToast({ message: `请先选择工序`, duration: 1500, bottom: 100 }) return } if (this.scanState === 0) { this.scanState = 1 // this.scanCodeToStartWork() } else if (this.scanState === 1) { this.processReportingController.open() } }) } .height('90.6%') .width('100%') .padding({ left: '2.6%', right: '2.6%' }) .opacity(!this.selectWorkOder.workOrderCode || !this.currentUserName || !this.currentStationId ? 0.3 : 1) } .width('100%') .height('9.8%') .alignContent(Alignment.Top) } .width('100%') .height('100%') .backgroundColor($r('app.color.000000')) if (this.isAuxiliaryViewOpen) { Column() { AuxiliaryOperationView({ workOrderCode: this.selectWorkOder?.workOrderCode!, seqList: this.seqList, isAuxiliaryViewOpen:this.isAuxiliaryViewOpen, process: this.process, openLittleMaterialRequestDialog: ()=>{ this.littleMaterialRequestController.open() }, openBarcodeAssociationDialog: ()=>{ this.barcodeAssociationController.open() }, openInAndOutBoundDialog: ()=>{ this.inAndOutBoundController.open() }, openPictureDrawingDialog: ()=>{ this.pictureDrawingController.open() }, openDeviceInspectionDialog: ()=>{ this.deviceInspectionController.open() }, }) .height('93.5%') .width('100%') } .height('100%') .width('100%') .justifyContent(FlexAlign.End) //向下滑动关闭抽屉 .gesture( GestureGroup( GestureMode.Sequence, PanGesture({ direction: PanDirection.Down }) .onActionStart(() => { this.isAuxiliaryViewOpen = false }) ) ) .transition( TransitionEffect.OPACITY .combine(TransitionEffect.translate({ y: 1000 })) .animation({ duration:1500, curve: Curve.EaseOut }) ) .opacity(this.isAuxiliaryViewOpen ? 1 : 0) .translate({ y: this.isAuxiliaryViewOpen ? 0 : 1000 }) } } .height('100%') .width('100%') //向上滑动打开抽屉 .gesture( GestureGroup( GestureMode.Sequence, PanGesture({ direction: PanDirection.Up }) .onActionStart(() => { this.isAuxiliaryViewOpen = true }) ) ) } @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(); }) } // 选择工单弹窗控制器 selectOrderController: CustomDialogController = new CustomDialogController({ builder: SelectWorkOrderDialog({ selectWorkOder: this.selectWorkOder, onConfirm: ()=>{ this.clearSelectData() } }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 选择工位和用户弹窗控制器 loginInfoController: CustomDialogController = new CustomDialogController({ builder: LoginInfoDialog({ scanState: this.scanState, opComponents: this.opComponents, selectComponentType: this.selectComponentType, searchDept:()=>{this.SwitchingDeptController.open()}, searchStation:()=>{this.SwitchingStationController.open()}, searchProductLine:()=>{this.SwitchingProductLineController.open()}, }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) //切换部门弹窗控制器 SwitchingDeptController: CustomDialogController = new CustomDialogController({ builder: SwitchingDeptDialog({}), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 工序报工-报工数量弹窗 ReportWorkNumController: CustomDialogController = new CustomDialogController({ builder: ReportWorkNumDialog({ userName: this.reportList[this.currentReportNumIndex].userName, currentOperationId: this.selectOperationId, currentWorkOrderCode: this.selectWorkOder.workOrderCode!, onConfirm:(num:number)=>{ const index = this.currentReportNumIndex; if (this.reportList[index]) { this.reportList[index].reportNum = String(num); this.reportList = [...this.reportList]; } } }), autoCancel: true, customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', }) // 工序报工-不良品报工弹窗 defectNumReportController: CustomDialogController = new CustomDialogController({ builder: DefectNumReportDialog({ userName: this.reportList[this.currentDefectIndex].userName, onConfirm:(num:number)=>{ const index = this.currentDefectIndex; if (this.reportList[index]) { this.reportList[index].defectNum = String(num); this.reportList = [...this.reportList]; } } }), autoCancel: true, customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', }) // 工序报工-添加参与人员 JoinPersonNameController: CustomDialogController = new CustomDialogController({ builder: JoinPersonNameDialog({ reportList:this.reportList, currentReporterIndex:this.currentReporterIndex, }), autoCancel: true, customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', }) // 工序报工弹窗 processReportingController: CustomDialogController = new CustomDialogController({ builder: ProcessReportingDialog({ onSelectReporter:(index:number)=>{ this.currentReporterIndex = index; this.JoinPersonNameController.open(); }, onSelectReportNum:(index:number)=>{ if (!this.reportList[index]?.userName?.trim()) { promptAction.showToast({ message: '请先添加用户', duration: 2000 }); return; } this.currentReportNumIndex = index this.ReportWorkNumController.open() }, onSelectDefectNum:(index:number)=>{ if (!this.reportList[index]?.userName?.trim()) { promptAction.showToast({ message: '请先添加用户', duration: 2000 }); return; } this.currentDefectIndex = index this.defectNumReportController.open() }, clearSelectData:()=>{ this.clearSelectData() }, reportList:this.reportList, selectWorkOder: this.selectWorkOder, selectOperationName: this.selectOperationName, selectOperationId: this.selectOperationId, process: this.process, operationPerformance: this.operationPerformance, }), autoCancel: true, customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', }) // 切换产线弹窗控制器 SwitchingProductLineController: CustomDialogController = new CustomDialogController({ builder: SwitchingProductLineDialog({}), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 切换工位弹窗控制器 SwitchingStationController: CustomDialogController = new CustomDialogController({ builder: SwitchingStationDialog({}), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) //切换用户弹窗控制器 switchingUserController: CustomDialogController = new CustomDialogController({ builder: SwitchingUserDialog({}), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 切换产品弹窗控制器 switchingProductDialogController: CustomDialogController = new CustomDialogController({ builder: SwitchingProductDialog({ scanState:this.scanState, process:this.process, scanSeqValue: this.scanCode, selectWorkOder:this.selectWorkOder, currentOperationId:this.selectOperationId, opComponents:this.opComponents, seqNo:this.seqNo, }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 作业指导弹窗控制器 workInstructionsController: CustomDialogController = new CustomDialogController({ builder: WorkInstructionsDialog({ materialCode: this.selectWorkOder.materialCode!, }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 齐套接收弹窗控制器 completeReceiveController: CustomDialogController = new CustomDialogController({ builder: CompleteReceiveDialog({ currentWorkOrderCode: this.selectWorkOder.workOrderCode!, currentOperationId: this.selectOperationId }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 零星叫料弹窗控制器 littleMaterialRequestController: CustomDialogController = new CustomDialogController({ builder: LittleMaterialRequestDialog({ process: this.process, selectWorkOder: this.selectWorkOder, }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 仓储操作弹窗控制器 inAndOutBoundController: CustomDialogController = new CustomDialogController({ builder: InAndOutBoundDialog({ }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 条码关联弹窗控制器 barcodeAssociationController: CustomDialogController = new CustomDialogController({ builder: BarcodeAssociationDialog({ workOrderCode: this.selectWorkOder?.workOrderCode!, seqList: this.seqList }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 图纸资料弹窗控制器 pictureDrawingController: CustomDialogController = new CustomDialogController({ builder: PictureDrawingDialog({ materialCode: this.selectWorkOder?.materialCode! }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) // 设备点检弹窗 deviceInspectionController: CustomDialogController = new CustomDialogController({ builder: DeviceInspectionDialog({ deviceChecks: this.deviceChecks, }), autoCancel: true, // 点击遮罩关闭 customStyle: true, alignment:DialogAlignment.Center, maskColor: 'rgba(0,0,0,0.8)', // 黑色遮罩 }) }