| <template> | 
|   <div class="bg"> | 
|     <!--  工单信息  --> | 
|     <V-WorkOrderInfo :info="info"></V-WorkOrderInfo> | 
|     <!--  扫码投料/产出  --> | 
|     <!-- <div class="details_cz"> | 
|             <div class="details_cz_smtl" @click="jump1('tl')" v-if="proxy.$auth('h5:workorderinput:create')"> | 
|                 <img src="@/assets/icon/gongdan_ic_saoma@2x.png" alt="" /> | 
|                 <span>扫码投料</span> | 
|             </div> | 
|             <div style="width: 20px"></div> | 
|             <div class="details_cz_smtl" @click="jump1('cc')" v-if="proxy.$auth('h5:workorderoutput:create')"> | 
|                 <img src="@/assets/icon/gongdan_ic_saoma@2x.png" alt="" /> | 
|                 <span>扫码产出</span> | 
|             </div> | 
|         </div> --> | 
|     <div class="bg_cate"> | 
|       <div @click="clickIten(index)" :class="typeView == index ? 'bg_cate_item active' : 'bg_cate_item'" | 
|         v-for="(item, index) in cate" :key="index">{{ item.name }}</div> | 
|     </div> | 
|     <!--  投料明细/合格产出明细/不良产出明细  --> | 
|     <div class="bg_list" v-if="typeView === 0"> | 
|       <div class="bg_list_item"> | 
|         <div class="bg_list_item_top"> | 
|           <div class="bg_list_item_top_left"> | 
|             <div class="bg_list_item_top_left_x"></div> | 
|             <span>投料明细</span> | 
|             <!-- <span class="blue left">{{tlTotal()}}</span> --> | 
|           </div> | 
|           <div class="bg_list_item_top_right" @click="jumpTL" | 
|             v-if="proxy.$auth('h5:workorderinput:create') && (info.bomType !== 1 || info.bomType == 0 || !info.bomType)"> | 
|             <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> | 
|             <span>手动录入</span> | 
|           </div> | 
|         </div> | 
|         <template v-if="feedingData && feedingData.length > 0"> | 
|           <van-swipe-cell v-for="(item, index) in feedingData" :key="index"> | 
|             <div class="bg_list_item_h"> | 
|               <div class="bg_list_item_num"> | 
|                 <div class="bg_list_item_num_item"> | 
|                   <!-- <span>{{item.code}}</span> --> | 
|                   <div class="bg_list_item_num_item_wl"> | 
|                     <span> {{ item.materialName }}{{ item.procedureName ? ` | ${item.procedureName}` : '' | 
|                     }}</span> | 
|                     <div class="bg_list_item_num_item_wl_lx"> | 
|                       <span class="green" v-if="item.qualityType == 0">合格 / </span> | 
|                       <span class="yellow" v-if="item.qualityType == 1">不良 / </span> | 
|                       <span class="red" v-if="item.qualityType == 2">报废 / </span> | 
|                       <span>{{ item.locationName }}</span> | 
|                       <span>{{ item.batch ? ` / ${item.batch}` : '' }}</span> | 
|                     </div> | 
|                   </div> | 
|                   <div class="bg_list_item_num_item_sr"> | 
|                     <input v-model="item.num" :disabled="!proxy.$auth('h5:workorderinput:update')" | 
|                       @blur="change(item.id, item.num, 'T', item.maxNum, item, item.unitAttribute)" type="number" /> | 
|                     <span>{{ item.unitName }}</span> | 
|                   </div> | 
|                 </div> | 
|               </div> | 
|             </div> | 
|   | 
|             <template #right v-if="proxy.$auth('h5:workorderinput:delete')"> | 
|               <van-button style="height: 100%;" square text="删除" @click="deleItem(item.id, 'T')" type="danger" /> | 
|             </template> | 
|           </van-swipe-cell> | 
|         </template> | 
|         <template v-else> | 
|           <div class="kong"> | 
|             <span>暂无数据</span> | 
|           </div> | 
|         </template> | 
|       </div> | 
|       <div class="bg_list_item"> | 
|         <div class="bg_list_item_top"> | 
|           <div class="bg_list_item_top_left"> | 
|             <div class="bg_list_item_top_left_x"></div> | 
|             <span>产出明细</span> | 
|           </div> | 
|         </div> | 
|         <!-- <template v-if="produceData && produceData.length > 0"> --> | 
|         <!-- v-for="(item, index) in produceData" :key="index" --> | 
|         <van-swipe-cell> | 
|           <div class="bg_list_item_h"> | 
|             <div class="bg_list_item_num"> | 
|               <div class="bg_list_item_num_item"> | 
|                 <span>良品数({{ info.umodel ? info.umodel.name : '' }})</span> | 
|                 <div class="bg_list_item_num_item_sr"> | 
|                   <!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" --> | 
|                   <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" --> | 
|                   <input type="number" v-model="produceFrom.qualified" | 
|                     @blur="changeCC('0', produceFrom.qualified, produceFrom.qualifiedId)" placeholder="请输入" /> | 
|                   <span v-if="info.umodel">{{ info.umodel.name }}</span> | 
|                 </div> | 
|               </div> | 
|             </div> | 
|           </div> | 
|         </van-swipe-cell> | 
|         <van-swipe-cell> | 
|           <div class="bg_list_item_h"> | 
|             <div class="bg_list_item_num"> | 
|               <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" --> | 
|               <div class="bg_list_item_num_item"> | 
|                 <span>不良数({{ info.umodel ? info.umodel.name : '' }})</span> | 
|                 <div class="bg_list_item_num_item_sr"> | 
|                   <!-- :disabled="!proxy.$auth('h5:workorderoutput:update')" --> | 
|                   <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" --> | 
|                   <input type="number" v-model="produceFrom.undesirable" | 
|                     @blur="changeCC('1', produceFrom.undesirable, produceFrom.undesirableId)" placeholder="请输入" /> | 
|                   <span v-if="info.umodel">{{ info.umodel.name }}</span> | 
|                 </div> | 
|               </div> | 
|             </div> | 
|           </div> | 
|         </van-swipe-cell> | 
|         <van-swipe-cell v-if="produceFrom.undesirable > 0"> | 
|           <div class="bg_list_item_h"> | 
|             <div class="bg_list_item_num"> | 
|               <div class="bg_list_item_num_item" @click="show = true"> | 
|                 <span>不良项</span> | 
|                 <div class="bg_list_item_num_item_sr"> | 
|                   <span class="wulll" :style="{ color: from.defectiveName ? '#305ED5' : '' }">{{ from.defectiveName ? | 
|                     from.defectiveName : '设置' }}</span> | 
|                   <img src="@/assets/icon/ic_ar@2x.png" alt="" /> | 
|                 </div> | 
|               </div> | 
|             </div> | 
|           </div> | 
|         </van-swipe-cell> | 
|         <!-- </template> | 
|                     <template v-else> | 
|                         <div class="kong"> | 
|                             <span>暂无数据</span> | 
|                         </div> | 
|                     </template> --> | 
|       </div> | 
|       <div class="bg_plan" @click="TimeShow = true"> | 
|         <div class="bg_plan_label"> | 
|           <span>报工时长</span> | 
|         </div> | 
|         <div class="bg_plan_label_val"> | 
|           <span :style="{ color: from.durationName ? '#333' : '' }">{{ from.durationName ? from.durationName : '请选择' }}</span> | 
|           <img src="@/assets/icon/ic_ar@2x.png" alt="" /> | 
|         </div> | 
|       </div> | 
|       <div class="bg_list_item" v-if="arrType && arrType.length > 0"> | 
|         <div class="bg_list_item_top"> | 
|           <div class="bg_list_item_top_left"> | 
|             <div class="bg_list_item_top_left_x"></div> | 
|             <span>工资绩效</span> | 
|           </div> | 
|         </div> | 
|         <div class="bg_list_item_h"> | 
|           <div class="bg_list_item_num"> | 
|             <div class="bg_list_item_num_item"> | 
|               <span>计件方式</span> | 
|               <div class="bg_list_item_num_item_list"> | 
|                 <div :class="item.active ? 'bg_list_item_num_item_list_item active' : 'bg_list_item_num_item_list_item'" | 
|                   v-for="(item, index) in arrType" :key="index" @click="clickPerformanceType(index)">{{ item.name }}</div> | 
|                 <!-- <div class="bg_list_item_num_item_list_item active" v-if="infoBox.type == 0">计件</div> | 
|                                     <div class="bg_list_item_num_item_list_item active" v-if="infoBox.type == 1">计时</div> --> | 
|               </div> | 
|             </div> | 
|           </div> | 
|           <div class="bg_list_item_num"> | 
|             <div class="bg_list_item_num_item"> | 
|               <span>工资单价</span> | 
|               <div class="bg_list_item_num_item_sr"> | 
|                 <span class="color1">{{ (arrType[from.index].salary / 10 / 10).toFixed(2) }}元/{{ arrType[from.index].type == | 
|                   0 ? '件' : '时' }}</span> | 
|                 <!-- <span class="color1">{{infoBox.salary / 100}}元/{{infoBox.type == 0 ? '件' : '时'}}</span> --> | 
|               </div> | 
|             </div> | 
|           </div> | 
|           <div class="bg_list_item_num"> | 
|             <div class="bg_list_item_num_item"> | 
|               <span>预计工资</span> | 
|               <div class="bg_list_item_num_item_sr"> | 
|                 <span class="color1">{{ expectedSalary }}元</span> | 
|               </div> | 
|             </div> | 
|           </div> | 
|           <div class="bg_list_item_num"> | 
|             <div class="bg_list_item_num_item"> | 
|               <span>达标率</span> | 
|               <div class="bg_list_item_num_item_sr"> | 
|                 <span class="color1">{{ complianceRate }}%</span> | 
|               </div> | 
|             </div> | 
|           </div> | 
|         </div> | 
|       </div> | 
|       <!-- <div class="bg_list_item"> | 
|                 <div class="bg_list_item_top"> | 
|                     <div class="bg_list_item_top_left"> | 
|                         <div class="bg_list_item_top_left_x"></div> | 
|                         <span>合格产出明细</span> | 
|                         <span class="blue left">{{ccTotal()}}</span> | 
|                     </div> | 
|                     <div class="bg_list_item_top_right" @click="jumpCC" v-if="proxy.$auth('h5:workorderoutput:create')"> | 
|                         <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> | 
|                         <span>手动录入</span> | 
|                     </div> | 
|                 </div> | 
|                 <template v-if="produceData && produceData.length > 0"> | 
|                     <van-swipe-cell v-for="(item, index) in produceData" :key="index"> | 
|                         <div class="bg_list_item_num"> | 
|                             <div class="bg_list_item_num_item"> | 
|                                 <span>{{item.code}}</span> | 
|                                 <div class="bg_list_item_num_item_sr"> | 
|                                     <input v-model="item.num" :disabled="!proxy.$auth('h5:workorderoutput:update')" @blur="change(item.id, item.num, 'C', item.maxNum, item)" type="number" /> | 
|                                     <span>{{item.company}}</span> | 
|                                 </div> | 
|                             </div> | 
|                         </div> | 
|                         <template #right v-if="proxy.$auth('h5:workorderoutput:delete')"> | 
|                             <van-button style="height: 100%;" square text="删除" @click="deleItem(item.id, 'C')" type="danger" /> | 
|                         </template> | 
|                     </van-swipe-cell> | 
|                 </template> | 
|                 <template v-else> | 
|                     <div class="kong"> | 
|                         <span>暂无数据</span> | 
|                     </div> | 
|                 </template> | 
|             </div> | 
|   | 
|             <div class="bg_list_item"> | 
|                 <div class="bg_list_item_top"> | 
|                     <div class="bg_list_item_top_left"> | 
|                         <div class="warning"></div> | 
|                         <span>不良产出明细</span> | 
|                         <span class="yellow left">{{blTotal()}}</span> | 
|                     </div> | 
|                 </div> | 
|                 <template v-if="undesirable && undesirable.length > 0"> | 
|                     <van-swipe-cell v-for="(item, index) in undesirable" :key="index"> | 
|                         <div class="bg_list_item_num"> | 
|                             <div class="bg_list_item_num_item"> | 
|                                 <span>{{item.code}}</span> | 
|                                 <div class="bg_list_item_num_item_sr"> | 
|                                     <input v-model="item.num" :disabled="!proxy.$auth('h5:workorderoutput:update')" @blur="change(item.id, item.num, 'C', item.maxNum, item)" type="number" /> | 
|                                     <span>{{item.company}}</span> | 
|                                 </div> | 
|                             </div> | 
|                         </div> | 
|                         <template #right v-if="proxy.$auth('h5:workorderoutput:delete')"> | 
|                             <van-button style="height: 100%;" square text="删除" @click="deleItem(item.id, 'C')" type="danger" /> | 
|                         </template> | 
|                     </van-swipe-cell> | 
|                 </template> | 
|                 <template v-else> | 
|                     <div class="kong"> | 
|                         <span>暂无数据</span> | 
|                     </div> | 
|                 </template> | 
|             </div> | 
|   | 
|             <div class="bg_list_item"> | 
|                 <div class="bg_list_item_top"> | 
|                     <div class="bg_list_item_top_left"> | 
|                         <div class="error"></div> | 
|                         <span>报废产出明细</span> | 
|                         <span class="red left">{{bfTotal()}}</span> | 
|                     </div> | 
|                 </div> | 
|                 <template v-if="scrap && scrap.length > 0"> | 
|                     <van-swipe-cell v-for="(item, index) in scrap" :key="index"> | 
|                         <div class="bg_list_item_num"> | 
|                             <div class="bg_list_item_num_item"> | 
|                                 <span>{{item.code}}</span> | 
|                                 <div class="bg_list_item_num_item_sr"> | 
|                                     <input v-model="item.num" :disabled="!proxy.$auth('h5:workorderoutput:update')" @blur="change(item.id, item.num, 'C', item.maxNum, item)" type="number" /> | 
|                                     <span>{{item.company}}</span> | 
|                                 </div> | 
|                             </div> | 
|                         </div> | 
|                         <template #right v-if="proxy.$auth('h5:workorderoutput:delete')"> | 
|                             <van-button style="height: 100%;" square text="删除" @click="deleItem(item.id, 'C')" type="danger" /> | 
|                         </template> | 
|                     </van-swipe-cell> | 
|                 </template> | 
|                 <template v-else> | 
|                     <div class="kong"> | 
|                         <span>暂无数据</span> | 
|                     </div> | 
|                 </template> | 
|             </div> --> | 
|     </div> | 
|     <div class="details_dj" v-if="typeView === 1"> | 
|       <!-- <div class="details_dj_title"> | 
|                 <div class="details_dj_title_left"> | 
|                     <div class="details_x"></div> | 
|                     <span>生产点检</span> | 
|                 </div> | 
|                 <div class="details_dj_title_right" @click="jumpdj" v-if="proxy.$auth('h5:workorder:processRecord')"> | 
|                     <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> | 
|                     <span>手动录入</span> | 
|                 </div> | 
|             </div> --> | 
|       <div class="details_dj_list"> | 
|         <van-list v-model:loading="loading" :finished="finished" finished-text="没有更多了~" @load="pageDJs"> | 
|           <van-swipe-cell v-for="(item, index) in djData" :key="index"> | 
|             <div class="details_dj_list_item"> | 
|               <span>{{ item.attrName }}:{{ item.val }}</span> | 
|               <span>{{ item.userName }} {{ item.createTime }}</span> | 
|             </div> | 
|             <template #right> | 
|               <van-button square type="danger" style="height: 100%;" @click="dele(item.id)" text="删除" /> | 
|             </template> | 
|           </van-swipe-cell> | 
|         </van-list> | 
|       </div> | 
|     </div> | 
|     <!--  报工按钮  --> | 
|     <template v-if="info.status === 2 || info.procedureNeedcheck === 1"> | 
|       <div class="bh_zw"></div> | 
|       <div class="bg_footer"> | 
|         <div class="bg_footer_submit" v-if="typeView == 0" @click="submit">确认报工</div> | 
|         <!-- proxy.$auth('h5:workorder:processRecord') &&  --> | 
|         <div class="bg_footer_submit1" @click="jumpdj" v-if="typeView == 1"> | 
|           <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> | 
|           <span>新增点检</span> | 
|         </div> | 
|       </div> | 
|     </template> | 
|     <!--  扫码组件  --> | 
|     <v-ScanCode :openCode="openCode" :infos="['请扫描工装码']" @closePopup="closePopup" @onDecode="onDecode" /> | 
|     <!--  报工统计数据  --> | 
|     <van-popup v-model:show="statistics" round :closeable="true" position="bottom"> | 
|       <div class="tg"> | 
|         <div class="tg_header">请确认报工信息</div> | 
|         <div class="tg_table"> | 
|           <div class="tg_table_header"> | 
|             <div class="tg_table_header_item">类型</div> | 
|             <div class="tg_table_header_item">物料名称</div> | 
|             <!-- <div class="tg_table_header_item">工装数量</div> --> | 
|             <div class="tg_table_header_item">物料数量</div> | 
|           </div> | 
|           <div class="nr" v-if="statisticsData.length > 0"> | 
|             <div class="tg_table_nr" v-for="(item, index) in statisticsData" :key="index"> | 
|               <div class="tg_table_nr_item">{{ item.name }}</div> | 
|               <div class="tg_table_nr_item">{{ item.materialName }}</div> | 
|               <!-- <div class="tg_table_nr_item">{{item.gznum}}</div> --> | 
|               <div class="tg_table_nr_item" :style="item.name === '工单未投料' ? 'color: #DE5243' : ''">{{ item.num }}</div> | 
|             </div> | 
|           </div> | 
|           <div class="nr" v-else> | 
|             <div class="tg_table_nr"> | 
|               <div class="tg_table_nr_item1">暂无数据</div> | 
|             </div> | 
|           </div> | 
|         </div> | 
|         <div class="tg_footer"> | 
|           <button class="tg_footer_qr" @click="submitBG" | 
|             v-if="proxy.$auth('h5:workorderoutput:confirm') && isSubmit">确认报工</button> | 
|           <div class="tg_footer_fh" @click="gofh" v-else-if="!isSubmit">返回修改</div> | 
|         </div> | 
|       </div> | 
|     </van-popup> | 
|     <!-- 时间 --> | 
|     <van-popup v-model:show="TimeShow" round position="bottom" :style="{ height: '50%' }"> | 
|       <van-datetime-picker v-model="from.time" type="time" title="选择时间" @confirm="onConfirm2" @cancel="onCancel2" /> | 
|     </van-popup> | 
|     <!-- 选择不良项 --> | 
|     <van-popup v-model:show="show" round position="bottom"> | 
|       <div class="bl"> | 
|         <div class="bl_head"> | 
|           <img src="@/assets/icon/ic_close@2x.png" style="opacity: 0;" alt="" /> | 
|           <span>不良项</span> | 
|           <!-- <span>确认</span> --> | 
|           <img src="@/assets/icon/ic_close@2x.png" @click="show = false" alt="" /> | 
|         </div> | 
|         <div class="bl_list"> | 
|           <div class="bl_list_item" v-for="(item, i) in cateList" :key="i" @click="changeChecked(i)"> | 
|             <div class="bl_list_item_left"> | 
|               <input type="checkbox" :checked="item.active" /> | 
|               <span>{{ item.name }}</span> | 
|             </div> | 
|             <div class="bl_list_item_right"> | 
|               <input type="number" @click.stop v-model="item.num" placeholder="0" /> | 
|             </div> | 
|           </div> | 
|         </div> | 
|         <div class="bl_footer" @click="onConfirm3">确认</div> | 
|       </div> | 
|     </van-popup> | 
|   </div> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
| import { getCurrentInstance, nextTick, onMounted, ref, reactive, computed, onActivated } from 'vue' | 
| import { useRouter, useRoute } from "vue-router" | 
| import { Dialog, Toast } from 'vant' | 
| import { REGULAR } from '@/utils/utils' | 
| import { categoryExtList, queryOne, queryList } from '@/apis/PlanningAPI' | 
| import { | 
|   getBarcodeContent, | 
|   queryById, | 
|   getOrocessRecord, | 
|   deleteCT, | 
|   updateById, | 
|   comfirmDone, | 
|   comfirmDoneStandard, | 
|   getListByCondition, | 
|   allForStandard, | 
|   pageDJ, | 
|   deletedj, | 
|   dealWorkorderRecordStandard, | 
|   getWorkorderRecordListStandard | 
| } from '@/apis/WorkOrderAPI' | 
| import { QRCodeType } from '@/enum' | 
| const { proxy }: any = getCurrentInstance() | 
| const { $Bus } = getCurrentInstance().appContext.config.globalProperties | 
| import VWorkOrderInfo from '@/components/common/WorkOrderInfo.vue' | 
|   | 
| const router = useRouter() | 
| const route = useRoute() | 
|   | 
| let TimeShow = ref(false) | 
|   | 
| let from: any = reactive({ | 
|   time: '', | 
|   defective: [], | 
|   defectiveName: '', | 
|   durationName: '0小时0分钟', | 
|   duration: 0, | 
|   index: 0 | 
| }) | 
|   | 
| let cate = ref([{ name: '生产' }, { name: '点检' }]) | 
| let typeView = ref(0) | 
|   | 
| const clickIten = (i: number) => { | 
|   typeView.value = i | 
|   if (i === 1) { | 
|     finished.value = false | 
|     page.capacity = 1 | 
|     pageDJs() | 
|   } | 
| } | 
|   | 
| // 预计工资 | 
| const expectedSalary = computed(() => { | 
|   if (arrType.value.length === 0) return 0; | 
|   // 按件计算 | 
|   if (arrType.value[from.index].type == 0) { | 
|     if (!produceFrom.qualified) return 0 | 
|     if (arrType.value[from.index].unqualified == 1) {   // 是否计入不良品 | 
|       let total = Number(produceFrom.qualified) + Number(produceFrom.undesirable) | 
|       return (total * (arrType.value[from.index].salary / 100)).toFixed(2) || 0 | 
|     } else { | 
|       return (Number(produceFrom.qualified) * (arrType.value[from.index].salary / 100)).toFixed(2) || 0 | 
|     } | 
|   } else { | 
|     if (!from.duration) return 0; | 
|     let h = (from.duration / 60 / 60).toFixed(2) | 
|     return (Number(h) * (arrType.value[from.index].salary / 10 / 10)).toFixed(2) || 0 | 
|   } | 
| }) | 
|   | 
| // 达标率 | 
| const complianceRate = computed(() => { | 
|   if (arrType.value.length === 0) return 0; | 
|   if (!produceFrom.qualified && !produceFrom.undesirable) return 0; | 
|   if (!from.duration) return 0; | 
|   if (!arrType.value[from.index].num) return 0; | 
|   // 按件计算 | 
|   // if (infoBox.value.type == 0) { | 
|   if (arrType.value[from.index].unqualified == 1) {   // 是否计入不良品 | 
|     let a = ((Number(produceFrom.qualified) + Number(produceFrom.undesirable)) / (from.duration / 3600)).toFixed(2) | 
|     let b = (arrType.value[from.index].num / (arrType.value[from.index].times / 3600)).toFixed(2) | 
|     console.log(a) | 
|     console.log(b) | 
|     return ((Number(a) / Number(b)) * 100).toFixed(2) | 
|     // let total = (Number(from.qualified) + Number(from.undesirable)) / ((from.duration * 60 * 60) * infoBox.value.num / ) | 
|     // return total * infoBox.value.salary; | 
|   } else { | 
|     let a = (produceFrom.qualified / (from.duration / 3600)).toFixed(2) | 
|     let b = (arrType.value[from.index].num / (arrType.value[from.index].times / 3600)).toFixed(2) | 
|     console.log(a) | 
|     console.log(b) | 
|     return ((Number(a) / Number(b)) * 100).toFixed(2) | 
|     // return Number(from.qualified) * infoBox.value.salary; | 
|   } | 
|   // } else { | 
|   //     console.log('按时长') | 
|   // } | 
| }) | 
|   | 
| const loading = ref(false); | 
| const finished = ref(false); | 
| let show = ref(false) | 
| // 点检数据 | 
| let djData: any = ref([]) | 
| // 分页查询数据 | 
| let page = reactive({ | 
|   capacity: 10, | 
|   page: 0 | 
| }) | 
|   | 
| let infoBox: any = ref(null)     // 工资绩效 | 
|   | 
| // 产出合格/不良 | 
| let produceFrom: any = reactive({ | 
|   qualifiedId: '', | 
|   qualified: '',  // 合格 | 
|   undesirableId: '', | 
|   undesirable: '' // 不良 | 
| }) | 
|   | 
| let cateList: any = ref([])  // 不良项 | 
|   | 
| // 详情数据 | 
| const info: any = ref({}) | 
|   | 
| // 判断是否能提交 | 
| let isSubmit: any = ref<boolean>(false) | 
|   | 
| // 不良明细 | 
| let undesirable: any = ref([]) | 
|   | 
| // 报废明细 | 
| let scrap: any = ref([]) | 
|   | 
| // 扫码类型 | 
| let type: any = ref('') | 
|   | 
| let arrType: any = ref([]) | 
|   | 
| // 统计数据 | 
| let statisticsData: any = ref([ | 
|   // { | 
|   //     name: '工单投料', | 
|   //     materialName: '黄沙', | 
|   //     num: 0 | 
|   // }, | 
|   // { | 
|   //     name: '工单合格产出', | 
|   //     materialName: '黄沙', | 
|   //     num: 0 | 
|   // }, | 
|   // { | 
|   //     name: '工单不良产出', | 
|   //     materialName: '黄沙', | 
|   //     num: 0 | 
|   // }, | 
|   // { | 
|   //     name: '工单未投料', | 
|   //     materialName: '黄沙', | 
|   //     num: 0 | 
|   // } | 
| ]) | 
|   | 
| // 投料数据 | 
| const feedingData: any = ref([]) | 
|   | 
| // 产出数据 | 
| const produceData: any = ref([]) | 
|   | 
| // 控制扫码显示隐藏 | 
| const openCode = ref<boolean>(false) | 
|   | 
| // 控制报工统计 | 
| const statistics = ref<boolean>(false) | 
|   | 
| const changeChecked = (i: number) => { | 
|   cateList.value[i].active = !cateList.value[i].active | 
| } | 
|   | 
| const getData = () => { | 
|   categoryExtList({ | 
|     cateType: "3" | 
|   }).then(res => { | 
|     if (res.code === 200) { | 
|       res.data.forEach((item: any) => { | 
|         item.active = false | 
|         item.num = '' | 
|       }) | 
|       cateList.value = res.data | 
|     } | 
|   }) | 
| } | 
|   | 
| const onConfirm2 = (e: string) => { | 
|   let h = Number(e.substring(0, 2)) | 
|   let m = Number(e.substring(3, 5)) | 
|   let s = 0 | 
|   if (h > 0) { | 
|     s += h * 60 * 60 | 
|   } | 
|   if (m > 0) { | 
|     s += m * 60 | 
|   } | 
|   from.duration = s | 
|   from.durationName = `${h}小时${m}分钟` | 
|   TimeShow.value = false | 
| } | 
|   | 
| const onCancel2 = () => { | 
|   TimeShow.value = false | 
| } | 
|   | 
| const onConfirm3 = () => { | 
|   let isOpen = false | 
|   cateList.value.forEach((item: any, index: number) => { | 
|     if (item.active) { | 
|       isOpen = true | 
|     } | 
|   }) | 
|   if (!isOpen) return Toast('请选择不良项') | 
|   let arr: any = [] | 
|   let total: any = 0 | 
|   let name: any = '' | 
|   cateList.value.forEach((item: any, index: number) => { | 
|     if (item.active) { | 
|       if (item.num <= 0) { | 
|         return Toast('不良数量必须大于0') | 
|       } | 
|       total = total += item.num | 
|       arr.push(item) | 
|       name += item.name + item.num + ';' | 
|     } | 
|   }) | 
|   if (total !== produceFrom.undesirable) return Toast('不良数必须等于产出不良数') | 
|   from.defective = arr | 
|   from.defectiveName = name | 
|   show.value = false | 
| } | 
|   | 
| // 投料统计 | 
| const tlTotal = (): string => { | 
|   if (feedingData.value.length > 0) { | 
|     let total: number = 0 | 
|     feedingData.value.forEach((element: any) => { | 
|       total = total + element.num | 
|     }) | 
|     return `${total}` | 
|   } | 
|   return '' | 
| } | 
|   | 
| // 修改产出 | 
| const changeCC = (downType: string, num: number, recordId: string) => { | 
|   if (!num) return | 
|   if ((produceFrom.qualified + produceFrom.undesirable) > info.value.planNum) { | 
|     return Toast.fail({ message: '产出数量不能大于计划数量', duration: 2000 }) | 
|   } | 
|   if (num >= 0) { | 
|     from.defective = [] | 
|     from.defectiveName = '' | 
|     // dealWorkorderRecordStandard({ | 
|     //     downType, num, recordId, workorderId: route.query.id | 
|     // }).then(res => { | 
|     //     if (res.code === 200) { | 
|     //         getOrocessRecordCC() | 
|     //     } | 
|     // }) | 
|   } else { | 
|     if (downType == 0) { | 
|       produceFrom.qualified = 0 | 
|     } else { | 
|       produceFrom.undesirable = 0 | 
|     } | 
|     Toast.fail({ message: '产出数量不能小于0', duration: 2000 }) | 
|   } | 
| } | 
|   | 
| // 跳转点检 | 
| const jumpdj = () => { | 
|   router.push({ name: 'spotCheck', query: { id: route.query.id } }) | 
| } | 
|   | 
| // 删除点检 | 
| const dele = (id: string | number): void => { | 
|   deletedj(id) | 
|     .then(res => { | 
|       if (res.code === 200) { | 
|         djData.value = [] | 
|         finished.value = false | 
|         page.page = 1 | 
|         djData.value = [] | 
|         pageDJs() | 
|       } | 
|     }) | 
| } | 
|   | 
| // 点检数据 | 
| const pageDJs = () => { | 
|   if (!finished.value) { | 
|     page.page = page.page + 1 | 
|     loading.value = true | 
|     pageDJ({ | 
|       capacity: page.capacity, | 
|       page: page.page, | 
|       model: { | 
|         workorderId: route.query.id | 
|       } | 
|     }).then(res => { | 
|       if (res.code === 200 && res.data && res.data.records.length !== 0) { | 
|         djData.value.push(...res.data.records) | 
|       } else { | 
|         finished.value = true | 
|       } | 
|       loading.value = false | 
|     }).catch(err => { | 
|       loading.value = false | 
|       finished.value = true | 
|     }) | 
|   } | 
| } | 
|   | 
| // 统计 | 
| const ccTotal = (): string => { | 
|   if (produceData.value.length > 0) { | 
|     let total: number = 0 | 
|     produceData.value.forEach((element: any) => { | 
|       total = total + element.num | 
|     }) | 
|     return `${total}${produceData.value[0].company}` | 
|   } | 
|   return '' | 
| } | 
|   | 
| // 统计 | 
| const blTotal = (): string => { | 
|   if (undesirable.value.length > 0) { | 
|     let total: number = 0 | 
|     undesirable.value.forEach((element: any) => { | 
|       total = total + element.num | 
|     }) | 
|     return `${total}${undesirable.value[0].company}` | 
|   } | 
|   return '' | 
| } | 
|   | 
| // 统计 | 
| const bfTotal = (): string => { | 
|   if (scrap.value.length > 0) { | 
|     let total: number = 0 | 
|     scrap.value.forEach((element: any) => { | 
|       total = total + element.num | 
|     }) | 
|     return `${total}${scrap.value[0].company}` | 
|   } | 
|   return '' | 
| } | 
|   | 
| // 切换绩效类型 | 
| const clickPerformanceType = (i: number) => { | 
|   from.index = i | 
|   arrType.value.forEach((item: any, index: number) => { | 
|     if (i === index) { | 
|       from.type = item.id | 
|     } | 
|     item.active = index === i | 
|   }) | 
| } | 
|   | 
| // 删除产出/投料 | 
| const deleItem = (id: any, type: string) => { | 
|   Dialog.confirm({ | 
|     title: '提示', | 
|     message: '确定删除此条记录吗?', | 
|   }).then(() => { | 
|     deleteCT(id) | 
|       .then(res => { | 
|         if (res.code === 200 && type === 'C') { | 
|           getOrocessRecordCC() | 
|         } else if (res.code === 200 && type === 'T') { | 
|           getOrocessRecords() | 
|         } | 
|       }) | 
|   }).catch(() => { | 
|     // on cancel | 
|   }) | 
| } | 
|   | 
| // 跳转手动产出 | 
| const jumpCC = () => { | 
|   router.push({ name: 'manualOutput', query: { id: route.query.id, num: produceData.value.length > 0 ? produceData.value[0].num : '' } }) | 
| } | 
|   | 
| // 跳转手动投料 | 
| const jumpTL = () => { | 
|   router.push({ name: 'manualFeeding', query: { id: route.query.id } }) | 
| } | 
|   | 
| // 关闭扫码组件 | 
| const closePopup = (): void => { | 
|   openCode.value = false | 
| } | 
|   | 
| // 获取扫码值 | 
| const onDecode = (data: string[]): void => { | 
|   getBarcodeContent({ | 
|     barcode: data[0] | 
|   }).then(res => { | 
|     if (res.code === 200) { | 
|       if (res.data.barcodeType === QRCodeType.GZ) { | 
|         if (type.value === 'tl') {    // 投料操作 | 
|           getListByCondition({ id: res.data.id }) | 
|             .then(gz => { | 
|               if (gz.code === 200) { | 
|                 if (gz.data[0].status !== 1) { | 
|                   router.push({ name: 'codeScanningFeeding', query: { id: route.query.id, gzId: res.data.id } }) | 
|                 } else { | 
|                   Toast.fail({ message: '扫描的工装状态不能为空', duration: 2000 }) | 
|                 } | 
|               } | 
|             }) | 
|         } | 
|         if (type.value === 'cc') {    // 产出操作 | 
|           router.push({ name: 'codeScanningOutput', query: { id: route.query.id, gzId: res.data.id } }) | 
|         } | 
|       } else { | 
|         Toast({ message: '请扫描正确的篮筐码', duration: 2000 }) | 
|       } | 
|     } | 
|   }) | 
|   nextTick(() => { | 
|     openCode.value = false | 
|   }) | 
| } | 
|   | 
| // 跳转手动投料 | 
| const jump = () => { | 
|   router.push({ name: 'manualFeeding', query: { id: route.query.id } }) | 
| } | 
|   | 
| // 跳转扫码投料 | 
| const jump1 = (types: string) => { | 
|   type.value = types | 
|   openCode.value = true | 
| } | 
|   | 
| // 查询工单详情 | 
| const queryByIds = () => { | 
|   queryById(route.query.id).then(res => { | 
|     if (res.code === 200) { | 
|       info.value = res.data | 
|       // 获取工资绩效数据 | 
|       queryList({ | 
|         deleted: 0, | 
|         departId: res.data.factoryId, | 
|         materialId: res.data.materialId, | 
|         procedureId: res.data.procedureId | 
|       }).then((result: any) => { | 
|         if (result.code === 200) { | 
|           if (result.data && result.data.length > 0) { | 
|             result.data.forEach((item: any, index: number) => { | 
|               item.name = item.type == 0 ? '计件' : '计时' | 
|               item.id = item.type | 
|               item.active = index == 0 | 
|             }) | 
|             arrType.value = result.data | 
|           } else { | 
|             arrType.value = [] | 
|           } | 
|           // infoBox.value = result.data | 
|         } | 
|         // if (result.code === 200) { | 
|         //     infoBox.value = result.data | 
|         // } | 
|       }) | 
|     } | 
|   }) | 
| } | 
|   | 
| // 查询工单生产记录---投料 | 
| const getOrocessRecords = () => { | 
|   feedingData.value = [] | 
|   allForStandard({ | 
|     workorderId: route.query.id, | 
|     type: 0 | 
|   }).then(res => { | 
|     if (res.code === 200) { | 
|       feedingData.value = res.data | 
|       // res.data.forEach((item: any) => { | 
|       //     feedingData.value.push({ id: item.id, company: item.umodel.name, gz: item.amodel.code, name: item.mmodel.name, code: item.amodel.code + ' - ' + item.mmodel.name, num: item.num, ynum: item.num, maxNum: item.amodel.num }) | 
|       // }) | 
|     } | 
|   }) | 
| } | 
|   | 
| // 查询工单生产记录---产出 | 
| const getOrocessRecordCC = () => { | 
|   produceData.value = [] | 
|   undesirable.value = [] | 
|   scrap.value = [] | 
|   getWorkorderRecordListStandard({ | 
|     workorderId: route.query.id | 
|   }).then(res => { | 
|     if (res.code === 200) { | 
|       if (res.data.length > 0) { | 
|         res.data.forEach((item: any) => { | 
|           if (item.doneType === 1) { | 
|             produceFrom.undesirable = item.num | 
|             produceFrom.undesirableId = item.id | 
|           } else { | 
|             produceFrom.qualified = item.num | 
|             produceFrom.qualifiedId = item.id | 
|           } | 
|         }) | 
|       } | 
|       // res.data.forEach((item: any) => { | 
|       //     if (item.doneType === 0 || !item.doneType) { // 合格 | 混合 | 
|   | 
|       //         produceData.value.push({ id: item.id, company: item.umodel.name, name: item.mmodel.name, code: item.amodel.code + ' - ' + item.mmodel.name, num: item.num, ynum: item.num, maxNum: item.amodel.num }) | 
|       //     } else if (item.doneType === 1) { // 不良 | 
|       //         undesirable.value.push({ id: item.id, company: item.umodel.name, name: item.mmodel.name, code: item.amodel.code + ' - ' + item.mmodel.name, num: item.num, ynum: item.num, maxNum: item.amodel.num }) | 
|       //     } else if (item.doneType === 2) { // 报废 | 
|       //         scrap.value.push({ id: item.id, company: item.umodel.name, name: item.mmodel.name, code: item.amodel.code + ' - ' + item.mmodel.name, num: item.num, ynum: item.num, maxNum: item.amodel.num }) | 
|       //     } | 
|       // }) | 
|     } | 
|   }) | 
| } | 
|   | 
| // 编辑投料/产出 | 
| const change = (id: any, num: any, type: any, maxNum: number, item: object, unitAttribute: number): void => { | 
|   let obj: any = item | 
|   if (type === 'T') { | 
|     if (unitAttribute == 0 && num != '') { | 
|       if (!REGULAR.positiveInteger.test(num)) { | 
|         obj.num = obj.ynum | 
|         Toast({ message: '只能输入正整数' }) | 
|         return | 
|       } | 
|     } | 
|     if (unitAttribute == 1 && num != '') { | 
|       if (!REGULAR.number.test(num)) { | 
|         Toast({ message: '只能输入正整数或小数(最多四位)' }) | 
|         obj.num = obj.ynum | 
|         return | 
|       } | 
|     } | 
|     if (num > maxNum) { | 
|       obj.num = obj.ynum | 
|       Toast.fail({ message: '超出工装总数' }) | 
|       return | 
|     } | 
|   } else if (type === 'C' && num > info.value.planNum) { | 
|     obj.num = obj.ynum | 
|     Toast.fail({ message: '产出数量不能超过计划数量' }) | 
|     return | 
|   } | 
|   updateById({ id: id, num: num }).then(res => { | 
|     if (res.code === 200 && type === 'T') { | 
|       getOrocessRecords() | 
|     } else if (res.code === 200 && type === 'C') { | 
|       // getOrocessRecordCC() | 
|     } | 
|   }) | 
| } | 
|   | 
| // 确认报工 | 
| const submit = () => { | 
|   if (info.value.bomType === 1) {  // 拉式 | 
|     console.log('拉式') | 
|     statisticsData.value = [] | 
|     if (produceFrom.qualified <= 0 && produceFrom.undesirable <= 0) { | 
|       Toast.fail({ message: '产出明细不能为空' }) | 
|       return | 
|     } | 
|     if (info.value.hasBom === 0) { | 
|       console.log('无bom') | 
|       // let data: any = [ | 
|       //     { name: '工单投料', gznum: feedingData.value.length, wlmc: feedingData.value.length > 0 ? feedingData.value[0].name : '', wlnum: 0 }, | 
|       //     { name: '工单合格产出', gznum: produceData.value.length, wlmc: produceData.value.length > 0 ? produceData.value[0].name : '', wlnum: 0 }, | 
|       //     { name: '工单不良产出', gznum: 0, wlmc: '', wlnum: 0 }, | 
|       //     { name: '工单未投料', gznum: '', wlmc: feedingData.value.length > 0 ? feedingData.value[0].name : '', wlnum: 0 } | 
|       // ] | 
|       // if (undesirable.value.length > 0) {   // 判断有没有不良 | 
|       //     data[2].wlmc = undesirable.value[0].name | 
|       //     data[2].gznum = data[2].gznum + undesirable.value.length | 
|       // } | 
|       // if (scrap.value.length > 0) {   // 判断有没有不良 | 
|       //     data[2].wlmc = scrap.value[0].name | 
|       //     data[2].gznum = data[2].gznum + scrap.value.length | 
|       // } | 
|       // let tl: number = 0 | 
|       // let cc: number = 0 | 
|       // let bl: number = 0 | 
|       // undesirable.value.forEach((item: any) => {  // 不良 | 
|       //     bl = bl + item.num | 
|       // }) | 
|       // scrap.value.forEach((item: any) => {  // 报废 | 
|       //     bl = bl + item.num | 
|       // }) | 
|       // if (produceData.value.length > 0) {   // 判断有没有合格产出 | 
|       //     produceData.value.forEach((item: any) => {  // 产出 | 
|       //         cc = cc + item.num | 
|       //     }) | 
|       // } | 
|       // feedingData.value.forEach((item: any) => {  // 投料 | 
|       //     tl = tl + item.num | 
|       // }) | 
|       // data[0].wlnum = tl.toString() + info.value.umodel.name | 
|       // if (produceData.value.length > 0) { | 
|       //     data[1].wlnum = cc.toString() + info.value.umodel.name | 
|       // } | 
|       // data[2].wlnum = bl.toString() + info.value.umodel.name | 
|       // let total: number = info.value.planNum - (Number(cc) + Number(bl)) | 
|       // data[data.length - 1].wlnum = (info.value.planNum - Number(cc) - Number(bl)).toString() + info.value.umodel.name | 
|       // if (total === 0) { | 
|       //     isSubmit.value = true | 
|       // } else { | 
|       //     isSubmit.value = false | 
|       // } | 
|   | 
|       let arr: any = [] | 
|       let tl = 0 | 
|       let res = getGroupNum(feedingData.value) | 
|       for (let i in res) { | 
|         let num = 0 | 
|         res[i].forEach((item: any) => { | 
|           num += item.num | 
|         }) | 
|         arr.push({ name: '工单投料', materialName: i + res[i][0].procedureName, num: num }) | 
|       } | 
|       feedingData.value.forEach((item: any) => { | 
|         tl += item.num | 
|       }) | 
|       statisticsData.value = [...statisticsData.value, ...arr] | 
|       statisticsData.value.push({ name: '工单合格产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.qualified }) | 
|       statisticsData.value.push({ name: '工单不良产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.undesirable }) | 
|       statisticsData.value.push({ name: '工单未投料', materialName: '', num: info.value.planNum - Number(produceFrom.qualified) - Number(produceFrom.undesirable) }) | 
|       let total: number = info.value.planNum - (Number(produceFrom.qualified) + Number(produceFrom.undesirable)) | 
|       if (total === 0) { | 
|         isSubmit.value = true | 
|       } else { | 
|         isSubmit.value = false | 
|       } | 
|       // if (Number(tl) <= info.value.planNum) { | 
|       //   let total: number = Number(tl) - Number(cc) - Number(bl)  // 是否有余 | 
|       //   data[data.length - 1].wlnum = (Number(tl) - Number(cc) - Number(bl)).toString() + info.value.umodel.name | 
|       //   if (total === 0) { | 
|       //     isSubmit.value = true | 
|       //   } else { | 
|       //     isSubmit.value = false | 
|       //   } | 
|       // } else { | 
|       //   isSubmit.value = false | 
|       // } | 
|       // statisticsData.value = data | 
|     } else if (info.value.hasBom === 1) {  // 有bom情况 | 
|       console.log('有bom') | 
|       // let cc: number = 0 | 
|       // let bl: number = 0 | 
|       // let newData: any = {} | 
|       // if (feedingData.value.length > 0) {  // 投料 | 
|       //     feedingData.value.forEach((e: any) => { | 
|       //         if (Object.keys(newData).indexOf('' + e.name) === -1) { | 
|       //             newData[e.name] = [] | 
|       //         } | 
|       //         newData[e.name].push(e) | 
|       //     }) | 
|       //     for (let key in newData) { | 
|       //         let obj = { name: '工单投料', gznum: newData[key].length, wlmc: key, wlnum: 0, num: 0 } | 
|       //         newData[key].forEach((item: any) => { | 
|       //             obj.wlnum = obj.wlnum + item.num | 
|       //             obj.num = item.num | 
|       //         }) | 
|       //         obj.wlnum = obj.wlnum.toString() + newData[key][0].company as never | 
|       //         statisticsData.value.push(obj) | 
|       //     } | 
|       // } | 
|       // if (produceData.value.length > 0) {  // 产出 | 
|       //     produceData.value.forEach((item: any) => { | 
|       //         cc = cc + item.num | 
|       //     }) | 
|       //     statisticsData.value.push({ name: '工单合格产出', gznum: produceData.value.length, wlmc: info.value.mmodel.name, wlnum: cc + info.value.umodel.name, num: cc }) | 
|       // } | 
|       // if (undesirable.value.length > 0 || scrap.value.length > 0) {  // 不良/报废 | 
|       //     undesirable.value.forEach((item: any) => { | 
|       //         bl = bl + item.num | 
|       //     }) | 
|       //     scrap.value.forEach((item: any) => { | 
|       //         bl = bl + item.num | 
|       //     }) | 
|       //     statisticsData.value.push({ name: '工单不良产出', gznum: undesirable.value.length + scrap.value.length, wlmc: info.value.mmodel.name, wlnum: bl + info.value.umodel.name, num: bl }) | 
|       // } | 
|       // let totaltl: number = 0 | 
|       // let totalcc: number = 0 | 
|       // let totalbl: number = 0 | 
|       // statisticsData.value.forEach((item: any) => { | 
|       //     if (item.name === '工单投料') { | 
|       //         totaltl = totaltl + item.num | 
|       //     } else if (item.name === '工单合格产出') { | 
|       //         totalcc = totalcc + item.num | 
|       //     } else if (item.name === '工单不良产出') { | 
|       //         totalbl = totalbl + item.num | 
|       //     } | 
|       // }) | 
|       // isSubmit.value = totalcc + totalbl <= info.value.planNum; | 
|       let arr: any = [] | 
|       let tl = 0 | 
|       let res = getGroupNum(feedingData.value) | 
|       for (let i in res) { | 
|         let num = 0 | 
|         res[i].forEach((item: any) => { | 
|           num += item.num | 
|         }) | 
|         arr.push({ name: '工单投料', materialName: i, num: num }) | 
|       } | 
|       feedingData.value.forEach((item: any) => { | 
|         tl += item.num | 
|       }) | 
|       statisticsData.value = [...statisticsData.value, ...arr] | 
|       statisticsData.value.push({ name: '工单合格产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.qualified }) | 
|       statisticsData.value.push({ name: '工单不良产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.undesirable }) | 
|       isSubmit.value = produceFrom.qualified + produceFrom.undesirable <= info.value.planNum; | 
|     } | 
|   } else { | 
|     console.log('推式') | 
|     if (feedingData.value.length === 0) { | 
|       Toast.fail({ message: '投料明细不能为空' }) | 
|       return | 
|     } | 
|     if (produceFrom.qualified <= 0 && produceFrom.undesirable <= 0) { | 
|       Toast.fail({ message: '产出明细不能为空' }) | 
|       return | 
|     } | 
|     statisticsData.value = [] | 
|     if (info.value.hasBom === 0) { | 
|       console.log('无bom') | 
|       // let data: any = [ | 
|       //     { name: '工单投料', gznum: feedingData.value.length, wlmc: feedingData.value.length > 0 ? feedingData.value[0].name : '', wlnum: 0 }, | 
|       //     { name: '工单合格产出', gznum: produceData.value.length, wlmc: produceData.value.length > 0 ? produceData.value[0].name : '', wlnum: 0 }, | 
|       //     { name: '工单不良产出', gznum: 0, wlmc: '', wlnum: 0 }, | 
|       //     { name: '工单未投料', gznum: '', wlmc: feedingData.value.length > 0 ? feedingData.value[0].name : '', wlnum: 0 } | 
|       // ] | 
|       // if (undesirable.value.length > 0) {   // 判断有没有不良 | 
|       //     data[2].wlmc = undesirable.value[0].name | 
|       //     data[2].gznum = data[2].gznum + undesirable.value.length | 
|       // } | 
|       // if (scrap.value.length > 0) {   // 判断有没有不良 | 
|       //     data[2].wlmc = scrap.value[0].name | 
|       //     data[2].gznum = data[2].gznum + scrap.value.length | 
|       // } | 
|       // let tl = 0 | 
|       // let cc = 0 | 
|       // let bl = 0 | 
|       // undesirable.value.forEach((item: any) => {  // 不良 | 
|       //     bl = bl + item.num | 
|       // }) | 
|       // scrap.value.forEach((item: any) => {  // 报废 | 
|       //     bl = bl + item.num | 
|       // }) | 
|       // if (produceData.value.length > 0) {   // 判断有没有合格产出 | 
|       //     produceData.value.forEach((item: any) => {  // 产出 | 
|       //         cc = cc + item.num | 
|       //     }) | 
|       // } | 
|       // feedingData.value.forEach((item: any) => {  // 投料 | 
|       //     tl = tl + item.num | 
|       // }) | 
|       // data[0].wlnum = tl.toString() + info.value.umodel.name | 
|       // if (produceData.value.length > 0) { | 
|       //     data[1].wlnum = cc.toString() + info.value.umodel.name | 
|       // } | 
|       // data[2].wlnum = bl.toString() + info.value.umodel.name | 
|       // if (Number(tl) <= info.value.planNum) { | 
|       //     let total: number = Number(tl) - Number(cc) - Number(bl)  // 是否有余 | 
|       //     data[data.length - 1].wlnum = (Number(tl) - Number(cc) - Number(bl)).toString() + info.value.umodel.name | 
|       //     if (total === 0) { | 
|       //         isSubmit.value = true | 
|       //     } else { | 
|       //         isSubmit.value = false | 
|       //     } | 
|       // } else { | 
|       //     isSubmit.value = false | 
|       // } | 
|       // statisticsData.value = data | 
|       let arr: any = [] | 
|       let tl = 0 | 
|       let res = getGroupNum(feedingData.value) | 
|       for (let i in res) { | 
|         let num = 0 | 
|         res[i].forEach((item: any) => { | 
|           num += item.num | 
|         }) | 
|         arr.push({ name: '工单投料', materialName: i + '-' + res[i][0].procedureName, num: num }) | 
|       } | 
|       feedingData.value.forEach((item: any) => { | 
|         tl += item.num | 
|       }) | 
|       statisticsData.value = [...statisticsData.value, ...arr] | 
|       statisticsData.value.push({ name: '工单合格产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.qualified }) | 
|       statisticsData.value.push({ name: '工单不良产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.undesirable }) | 
|       if (Number(tl) <= info.value.planNum) { | 
|         let total: number = Number(tl) - Number(produceFrom.qualified) - Number(produceFrom.undesirable)  // 是否有余 | 
|         statisticsData.value.push({ name: '工单未投料', materialName: '', num: (Number(tl) - Number(produceFrom.qualified) - Number(produceFrom.undesirable)).toFixed(2) }) | 
|         if (total === 0) { | 
|           isSubmit.value = true | 
|         } else { | 
|           isSubmit.value = false | 
|         } | 
|       } else { | 
|         isSubmit.value = false | 
|       } | 
|     } else if (info.value.hasBom === 1) {  // 有bom情况 | 
|       console.log('有bom') | 
|       let arr: any = [] | 
|       let tl = 0 | 
|       let res = getGroupNum(feedingData.value) | 
|       for (let i in res) { | 
|         let num = 0 | 
|         res[i].forEach((item: any) => { | 
|           num += item.num | 
|         }) | 
|         arr.push({ name: '工单投料', materialName: i, num: num }) | 
|       } | 
|       feedingData.value.forEach((item: any) => { | 
|         tl += item.num | 
|       }) | 
|       statisticsData.value = [...statisticsData.value, ...arr] | 
|       statisticsData.value.push({ name: '工单合格产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.qualified }) | 
|       statisticsData.value.push({ name: '工单不良产出', materialName: info.value.mmodel.name + '-' + info.value.procedureName, num: produceFrom.undesirable }) | 
|       // isSubmit.value = produceFrom.qualified + produceFrom.undesirable <= info.value.planNum; | 
|       isSubmit.value = true | 
|     } | 
|   } | 
|   statistics.value = true | 
| } | 
|   | 
| // 根据某个字段进行分组 | 
| const getGroupNum = (arr: any) => { | 
|   let newArry: any = {}; | 
|   for (let i = 0; i < arr.length; i++) { | 
|     if (newArry[arr[i].materialName]) { | 
|       newArry[arr[i].materialName].push(arr[i]) | 
|     } else { | 
|       newArry[arr[i].materialName] = [arr[i]] | 
|     } | 
|   } | 
|   return newArry; | 
| } | 
|   | 
| // 返回修改 | 
| const gofh = () => { | 
|   statistics.value = false | 
| } | 
|   | 
| // 确认报工 | 
| const submitBG = () => { | 
|   // if (!from.duration || from.duration <= 0) { | 
|   //     return Toast('报工时长不能为空') | 
|   // } | 
|   let createUnqualifiedDTOList = from.defective.map((item: any) => { | 
|     return { | 
|       categoryId: item.id, | 
|       unQualifiedNum: item.num | 
|     } | 
|   }) | 
|   let createWorkorderRecordDTO = { | 
|     workorderId: route.query.id, | 
|     duration: from.duration ? from.duration : 0, | 
|     qualifiedNum: produceFrom.qualified ? produceFrom.qualified : 0, | 
|     unQualifiedNum: produceFrom.undesirable ? produceFrom.undesirable : 0 | 
|   } | 
|   // id: route.query.id | 
|   comfirmDoneStandard({ | 
|     createUnqualifiedDTOList, | 
|     createWorkorderRecordDTO | 
|   }).then(res => { | 
|     if (res.code === 200) { | 
|       Toast.success({ message: '报工成功', forbidClick: true, duration: 2000 }) | 
|       setTimeout(() => { | 
|         router.go(-2) | 
|       }, 2000) | 
|     } | 
|   }) | 
| } | 
|   | 
| onActivated(() => { | 
|   // $Bus.on('callback1', (res: any)=>{ | 
|   //     console.log(res) | 
|   //     if (res == 1) { | 
|   //         djData.value = [] | 
|   //         finished.value = false | 
|   //         page.page = 1 | 
|   //         djData.value = [] | 
|   //         pageDJs() | 
|   //     } | 
|   // }) | 
|   // queryByIds() | 
|   // getOrocessRecords() | 
|   // getData() | 
| }) | 
|   | 
| onMounted(() => { | 
|   // $Bus.on('callback1', (res: any)=>{ | 
|   //     if (res == 1) { | 
|   //         djData.value = [] | 
|   //         finished.value = false | 
|   //         page.page = 1 | 
|   //         djData.value = [] | 
|   //         pageDJs() | 
|   //     } | 
|   // }) | 
|   // pageDJs() | 
|   | 
|   queryByIds() | 
|   getOrocessRecords() | 
|   getData() | 
|   | 
|   // getOrocessRecordCC() | 
| }) | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
| .bg { | 
|   width: 100%; | 
|   /*height: 100%;*/ | 
|   position: absolute; | 
|   background: #F7F7F7; | 
|   | 
|   .bg_plan { | 
|     width: 100%; | 
|     // height: 98px; | 
|     padding: 30px; | 
|     box-sizing: border-box; | 
|     background: #FFFFFF; | 
|     margin-bottom: 40px; | 
|     display: flex; | 
|     align-items: center; | 
|     justify-content: space-between; | 
|   | 
|     span { | 
|       font-size: 30px; | 
|       font-family: PingFangSC-Regular, PingFang SC; | 
|       font-weight: 400; | 
|       color: #222222; | 
|   | 
|       b { | 
|         color: red; | 
|       } | 
|     } | 
|   | 
|     .bg_plan_nr { | 
|       display: flex; | 
|       flex-direction: column; | 
|   | 
|       span { | 
|         font-size: 24px; | 
|         font-family: PingFangSC-Regular, PingFang SC; | 
|         font-weight: 400; | 
|         color: #666666; | 
|         margin-top: 20px; | 
|   | 
|         &:first-child { | 
|           font-size: 32px; | 
|           font-family: PingFangSC-Medium, PingFang SC; | 
|           font-weight: 500; | 
|           color: #333333; | 
|           margin-top: 0 !important; | 
|         } | 
|       } | 
|     } | 
|   | 
|     .bg_plan_label_val { | 
|       display: flex; | 
|       align-items: center; | 
|   | 
|       span { | 
|         font-size: 28px; | 
|         font-family: PingFangSC-Regular, PingFang SC; | 
|         font-weight: 400; | 
|         color: #999999; | 
|       } | 
|   | 
|       img { | 
|         width: 12px; | 
|         height: 24px; | 
|         margin-left: 20px; | 
|       } | 
|     } | 
|   } | 
|   | 
|   .details_cz { | 
|     width: 100%; | 
|     padding: 30px; | 
|     box-sizing: border-box; | 
|     display: flex; | 
|     align-items: center; | 
|     justify-content: space-between; | 
|   | 
|     .details_cz_sdtl { | 
|       width: 330px; | 
|       height: 76px; | 
|       background: #FFFFFF; | 
|       border-radius: 36px; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|   | 
|       img { | 
|         width: 28px; | 
|         height: 28px; | 
|         margin-right: 14px; | 
|       } | 
|   | 
|       span { | 
|         font-size: 26px; | 
|         font-weight: 400; | 
|         color: #222222; | 
|       } | 
|     } | 
|   | 
|     .details_cz_smtl { | 
|       /*width: 330px;*/ | 
|       flex: 1; | 
|       height: 76px; | 
|       background: $nav-color; | 
|       border-radius: 36px; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|   | 
|       img { | 
|         width: 28px; | 
|         height: 28px; | 
|         margin-right: 14px; | 
|       } | 
|   | 
|       span { | 
|         font-size: 26px; | 
|         font-weight: 400; | 
|         color: #ffffff; | 
|       } | 
|     } | 
|   } | 
|   | 
|   .bg_cate { | 
|     width: 100%; | 
|     height: 88px; | 
|     background: #FFFFFF; | 
|     margin-top: 20px; | 
|     display: flex; | 
|     align-items: center; | 
|   | 
|     .active { | 
|       box-sizing: border-box; | 
|       color: #305ED5 !important; | 
|       border-bottom: 2PX solid #305ED5; | 
|     } | 
|   | 
|     .bg_cate_item { | 
|       flex: 1; | 
|       height: 100%; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|       font-size: 30px; | 
|       font-family: PingFangSC-Regular, PingFang SC; | 
|       font-weight: 400; | 
|       color: #555555; | 
|     } | 
|   } | 
|   | 
|   .bg_list { | 
|     width: 100%; | 
|     display: flex; | 
|     flex-direction: column; | 
|     margin-top: 30px; | 
|   | 
|     .bg_list_item { | 
|       display: flex; | 
|       flex-direction: column; | 
|       margin-bottom: 40px; | 
|   | 
|       .kong { | 
|         text-align: center; | 
|         padding: 30px 0; | 
|         background: #ffffff; | 
|         font-size: 25px; | 
|   | 
|         span { | 
|           color: #474747; | 
|         } | 
|       } | 
|   | 
|       .bg_list_item_top { | 
|         display: flex; | 
|         align-items: center; | 
|         justify-content: space-between; | 
|         padding-left: 30px; | 
|         padding-right: 30px; | 
|         margin-bottom: 30px; | 
|   | 
|         .bg_list_item_top_left { | 
|           display: flex; | 
|           align-items: center; | 
|   | 
|           .left { | 
|             margin-left: 12px; | 
|             font-size: 28px; | 
|           } | 
|   | 
|           .warning { | 
|             width: 8px; | 
|             height: 30px; | 
|             border-radius: 2px; | 
|             margin-right: 12px; | 
|             background: $nav-stateColor5 !important; | 
|           } | 
|   | 
|           .error { | 
|             width: 8px; | 
|             height: 30px; | 
|             border-radius: 2px; | 
|             margin-right: 12px; | 
|             background: $nav-stateColor4 !important; | 
|           } | 
|   | 
|           .bg_list_item_top_left_x { | 
|             width: 8px; | 
|             height: 30px; | 
|             background: $nav-color; | 
|             border-radius: 2px; | 
|             margin-right: 12px; | 
|           } | 
|   | 
|           span { | 
|             font-size: 32px; | 
|             font-weight: 500; | 
|             color: #222222; | 
|             display: flex; | 
|             align-items: center; | 
|           } | 
|         } | 
|   | 
|         .bg_list_item_top_right { | 
|           display: flex; | 
|           align-items: center; | 
|   | 
|           img { | 
|             width: 28px; | 
|             height: 28px; | 
|             margin-right: 12px; | 
|           } | 
|   | 
|           span { | 
|             font-size: 28px; | 
|             font-weight: 400; | 
|             color: $nav-color; | 
|           } | 
|         } | 
|       } | 
|   | 
|       .bg_list_item_h { | 
|         width: 100%; | 
|         padding: 0 30px; | 
|         box-sizing: border-box; | 
|         background: white; | 
|   | 
|         .bg_list_item_num { | 
|           width: 100%; | 
|           min-height: 98px; | 
|           background: white; | 
|           display: flex; | 
|           justify-content: center; | 
|           align-items: center; | 
|           border-bottom: 1PX solid #E5E5E5; | 
|   | 
|           &:last-child { | 
|             border: none !important; | 
|           } | 
|   | 
|           .kong { | 
|             text-align: center; | 
|             font-size: 25px; | 
|             padding: 30px 0; | 
|             background: #ffffff; | 
|           } | 
|   | 
|           .bg_list_item_num_item { | 
|             width: 100%; | 
|             height: 100%; | 
|             display: flex; | 
|             align-items: center; | 
|             // height: 118px; | 
|             padding: 15px 0; | 
|             box-sizing: border-box; | 
|             justify-content: space-between; | 
|             border-bottom: 1px solid #E5E5E5; | 
|   | 
|             &:last-child { | 
|               border: none; | 
|             } | 
|   | 
|             .bg_list_item_num_item_list { | 
|               display: flex; | 
|               align-items: center; | 
|   | 
|               .active { | 
|                 background: #305ED5 !important; | 
|                 color: #FFFFFF !important; | 
|               } | 
|   | 
|               .bg_list_item_num_item_list_item { | 
|                 width: 116px; | 
|                 height: 62px; | 
|                 line-height: 62px; | 
|                 text-align: center; | 
|                 background: #F2F2F2; | 
|                 border-radius: 8px; | 
|                 font-size: 26px; | 
|                 font-family: PingFangSC-Regular, PingFang SC; | 
|                 font-weight: 400; | 
|                 color: #333333; | 
|                 margin-right: 20px; | 
|   | 
|                 &:last-child { | 
|                   margin: 0 !important; | 
|                 } | 
|               } | 
|             } | 
|   | 
|             .bg_list_item_num_item_wl { | 
|               flex-shrink: 0; | 
|               display: flex; | 
|               flex-direction: column; | 
|   | 
|               span { | 
|                 font-size: 34px; | 
|                 color: #222222; | 
|               } | 
|   | 
|               .bg_list_item_num_item_wl_lx { | 
|                 margin-top: 10px; | 
|   | 
|                 span { | 
|                   color: #222222; | 
|                   font-size: 28px; | 
|                 } | 
|               } | 
|             } | 
|   | 
|             .warning { | 
|               color: $nav-stateColor5 !important; | 
|             } | 
|   | 
|             .err { | 
|               color: $nav-stateColor4 !important; | 
|             } | 
|   | 
|             img { | 
|               width: 12px; | 
|               height: 24px; | 
|               margin-left: 20px; | 
|             } | 
|   | 
|             span { | 
|               flex-shrink: 0; | 
|               overflow: hidden; | 
|               text-overflow: ellipsis; | 
|               white-space: nowrap; | 
|   | 
|               b { | 
|                 font-size: 30px; | 
|                 color: red; | 
|                 margin-right: 5px; | 
|               } | 
|   | 
|               .warning { | 
|                 color: $nav-stateColor5 !important; | 
|                 margin-right: 5px; | 
|               } | 
|   | 
|               .err { | 
|                 color: $nav-stateColor4 !important; | 
|                 margin-right: 5px; | 
|               } | 
|   | 
|               &:nth-child(1) { | 
|                 font-size: 30px; | 
|                 font-weight: 400; | 
|                 color: #222222; | 
|               } | 
|   | 
|               &:nth-child(2) { | 
|                 font-size: 28px; | 
|                 font-weight: 400; | 
|                 color: #333333; | 
|                 flex-shrink: 0; | 
|               } | 
|             } | 
|   | 
|             .bg_list_item_num_item_sr { | 
|               flex: 1; | 
|               display: flex; | 
|               align-items: center; | 
|               justify-content: flex-end; | 
|   | 
|               .color1 { | 
|                 font-size: 28px; | 
|                 font-family: PingFangSC-Regular, PingFang SC; | 
|                 font-weight: 400; | 
|                 color: #333333; | 
|               } | 
|   | 
|               input::-webkit-input-placeholder { | 
|                 font-size: 28px; | 
|               } | 
|   | 
|               input { | 
|                 text-align: right; | 
|                 width: 180px; | 
|                 height: 60px; | 
|                 border-radius: 8px; | 
|                 border: 1PX solid #E5E5E5; | 
|                 margin-right: 20px; | 
|                 font-size: 28px; | 
|                 font-weight: 400; | 
|                 color: #333333; | 
|                 padding: 0 30px | 
|               } | 
|   | 
|               .wulll { | 
|                 width: 400px; | 
|                 text-align: right; | 
|                 overflow: hidden; | 
|                 white-space: nowrap; | 
|                 text-overflow: ellipsis; | 
|               } | 
|   | 
|               span { | 
|                 font-size: 28px; | 
|                 font-family: PingFangSC-Regular, PingFang SC; | 
|                 font-weight: 400; | 
|                 color: #999999; | 
|               } | 
|             } | 
|           } | 
|         } | 
|       } | 
|     } | 
|   } | 
|   | 
|   .details_dj { | 
|     display: flex; | 
|     flex-direction: column; | 
|   | 
|     .details_dj_title { | 
|       width: 100%; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: space-between; | 
|       padding: 0 30px 30px 30px; | 
|       box-sizing: border-box; | 
|   | 
|       .details_dj_title_left { | 
|         display: flex; | 
|         align-items: center; | 
|   | 
|         .details_x { | 
|           width: 8px; | 
|           height: 30px; | 
|           background: $nav-color; | 
|           border-radius: 2px; | 
|           margin-right: 12px; | 
|         } | 
|   | 
|         span { | 
|           font-size: 32px; | 
|           font-weight: 500; | 
|           color: #222222; | 
|         } | 
|       } | 
|   | 
|       .details_dj_title_right { | 
|         display: flex; | 
|         align-items: center; | 
|   | 
|         img { | 
|           width: 28px; | 
|           height: 28px; | 
|           margin-right: 12px; | 
|         } | 
|   | 
|         span { | 
|           font-size: 28px; | 
|           font-weight: 400; | 
|           color: $nav-color; | 
|         } | 
|       } | 
|     } | 
|   | 
|     .details_dj_list { | 
|       width: 100%; | 
|       /*padding: 30px;*/ | 
|       box-sizing: border-box; | 
|       background: #ffffff; | 
|       display: flex; | 
|       flex-direction: column; | 
|   | 
|       .details_dj_list_item { | 
|         display: flex; | 
|         flex-direction: column; | 
|         border-bottom: 1px solid #E5E5E5; | 
|         padding: 30px; | 
|   | 
|         /*margin: 30px;*/ | 
|         /*padding-bottom: 30px;*/ | 
|         /*margin-bottom: 30px !important;*/ | 
|         span { | 
|           &:nth-child(1) { | 
|             font-size: 28px; | 
|             font-weight: 400; | 
|             color: #222222; | 
|           } | 
|   | 
|           &:nth-child(2) { | 
|             font-size: 24px; | 
|             font-weight: 400; | 
|             color: #999999; | 
|             margin-top: 24px; | 
|           } | 
|         } | 
|       } | 
|     } | 
|   } | 
|   | 
|   .bh_zw { | 
|     height: 160px; | 
|   } | 
|   | 
|   .bg_footer { | 
|     position: fixed; | 
|     bottom: 0; | 
|     left: 0; | 
|     width: 100%; | 
|     padding: 0 30px 60px 30px; | 
|     box-sizing: border-box; | 
|   | 
|     .bg_footer_submit1 { | 
|       width: 690px; | 
|       height: 76px; | 
|       background: #FFFFFF; | 
|       border-radius: 36px; | 
|       border: 1px solid #E5E5E5; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|   | 
|       img { | 
|         width: 28px; | 
|         height: 28px; | 
|         margin-right: 12px; | 
|       } | 
|   | 
|       span { | 
|         font-size: 26px; | 
|         font-family: PingFangSC-Regular, PingFang SC; | 
|         font-weight: 400; | 
|         color: #305ED5; | 
|       } | 
|     } | 
|   | 
|     .bg_footer_submit { | 
|       width: 690px; | 
|       height: 88px; | 
|       background: $nav-color; | 
|       box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); | 
|       border-radius: 8px; | 
|       font-size: 30px; | 
|       font-weight: 500; | 
|       color: #FFFFFF; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|     } | 
|   } | 
|   | 
|   .tg { | 
|     width: 100%; | 
|     height: 800px; | 
|     padding: 30px; | 
|     box-sizing: border-box; | 
|   | 
|     .tg_header { | 
|       width: 100%; | 
|       height: 45px; | 
|       text-align: center; | 
|       line-height: 45px; | 
|       font-size: 30px; | 
|       font-weight: 500; | 
|       color: #222222; | 
|     } | 
|   | 
|     .tg_table { | 
|       width: 100%; | 
|       margin-top: 40px; | 
|   | 
|       .tg_table_header { | 
|         width: 100%; | 
|         height: 72px; | 
|         background: #EFF2FC; | 
|         display: flex; | 
|         align-items: center; | 
|   | 
|         .tg_table_header_item { | 
|           flex: 1; | 
|           font-size: 26px; | 
|           font-weight: 500; | 
|           color: #333333; | 
|           display: flex; | 
|           align-items: center; | 
|           justify-content: center; | 
|         } | 
|       } | 
|     } | 
|   | 
|     .nr { | 
|       width: 100%; | 
|       max-height: calc(100% - 133px); | 
|       overflow-x: scroll; | 
|   | 
|       .tg_table_nr { | 
|         width: 100%; | 
|         padding: 24px 10px; | 
|         box-sizing: border-box; | 
|         display: flex; | 
|         align-items: center; | 
|         background: white; | 
|         box-shadow: inset 0px -2px 0px 0px #E5E5E5; | 
|   | 
|         .tg_table_nr_item { | 
|           flex: 1; | 
|           font-size: 26px; | 
|           font-weight: 500; | 
|           color: #333333; | 
|           display: flex; | 
|           align-items: center; | 
|           justify-content: center; | 
|         } | 
|   | 
|         .tg_table_nr_item1 { | 
|           flex: 1; | 
|           font-size: 26px; | 
|           font-weight: 500; | 
|           color: #333333; | 
|           display: flex; | 
|           align-items: center; | 
|           justify-content: center; | 
|         } | 
|       } | 
|     } | 
|   } | 
|   | 
|   .tg_footer { | 
|     width: calc(100% - 60px); | 
|     position: fixed; | 
|     bottom: 0; | 
|     display: flex; | 
|     justify-content: space-between; | 
|     align-items: center; | 
|     box-sizing: border-box; | 
|     padding-bottom: 40px; | 
|   | 
|     .tg_footer_fh { | 
|       width: 100%; | 
|       height: 88px; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|       background: rgba(66, 117, 252, 0.05); | 
|       border-radius: 8px; | 
|       border: 1PX solid #4275FC; | 
|       font-size: 32px; | 
|       font-weight: 500; | 
|       color: $nav-color; | 
|     } | 
|   | 
|     .tg_footer_qr { | 
|       width: 100%; | 
|       height: 88px; | 
|       border: none; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: center; | 
|       background: $nav-color; | 
|       border-radius: 8px; | 
|       font-size: 32px; | 
|       font-weight: 500; | 
|       color: #FFFFFF; | 
|     } | 
|   } | 
|   | 
|   .bl { | 
|     width: 100%; | 
|     height: 800px; | 
|     padding: 30px; | 
|     box-sizing: border-box; | 
|     display: flex; | 
|     flex-direction: column; | 
|   | 
|     .bl_head { | 
|       width: 100%; | 
|       height: 50px; | 
|       display: flex; | 
|       align-items: center; | 
|       justify-content: space-between; | 
|   | 
|       span { | 
|         font-size: 28px; | 
|         color: #222222; | 
|   | 
|         &:nth-child(2) { | 
|           font-size: 32px !important; | 
|         } | 
|       } | 
|   | 
|       img { | 
|         width: 28px; | 
|         height: 28px; | 
|       } | 
|     } | 
|   | 
|     .bl_footer { | 
|       width: 100%; | 
|       height: 88px; | 
|       line-height: 88px; | 
|       text-align: center; | 
|       background: #305ED5; | 
|       border-radius: 8px; | 
|       font-size: 32px; | 
|       font-family: PingFangSC-Medium, PingFang SC; | 
|       font-weight: 500; | 
|       color: #FFFFFF; | 
|       margin-top: 30px; | 
|     } | 
|   | 
|     .bl_list { | 
|       width: 100%; | 
|       height: calc(100% - 168px); | 
|       overflow-y: scroll; | 
|       margin-top: 30px; | 
|   | 
|       .bl_list_item { | 
|         width: 100%; | 
|         height: 96px; | 
|         display: flex; | 
|         align-items: center; | 
|         justify-content: space-between; | 
|         border-bottom: 1PX solid #E5E5E5; | 
|   | 
|         &:last-child { | 
|           border: none !important; | 
|         } | 
|   | 
|         .bl_list_item_left { | 
|           flex: 1; | 
|           display: flex; | 
|           align-items: center; | 
|   | 
|           input { | 
|             width: 30px; | 
|             height: 30px; | 
|             border: 1PX solid #CCCCCC; | 
|             margin: 0 !important; | 
|           } | 
|   | 
|           span { | 
|             font-size: 30px; | 
|             color: #222222; | 
|             margin-left: 10px; | 
|           } | 
|         } | 
|   | 
|         .bl_list_item_right { | 
|           flex: 1; | 
|           height: 50px; | 
|           text-align: right; | 
|   | 
|           input { | 
|             padding-left: 5px; | 
|             width: 160px; | 
|             height: 100%; | 
|             padding: 0 30px; | 
|             box-sizing: border-box; | 
|             text-align: right; | 
|             font-size: 28px; | 
|             color: #333333; | 
|             border-radius: 10px; | 
|             border: 1PX solid #CCCCCC; | 
|   | 
|             &::-webkit-input-placeholder { | 
|               font-size: 28px; | 
|               font-family: PingFangSC-Regular, PingFang SC; | 
|               font-weight: 400; | 
|               color: #999999; | 
|             } | 
|           } | 
|         } | 
|       } | 
|     } | 
|   } | 
| }</style> |