| <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_list"> | 
|             <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_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> | 
|                         <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_num"> | 
|                             <div class="bg_list_item_num_item"> | 
|                                 <span>良品数</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> | 
|                     </van-swipe-cell> | 
|                     <van-swipe-cell> | 
|                         <div class="bg_list_item_num"> | 
|                             <!-- @blur="change(item.id, item.num, 'C', item.maxNum, item)" --> | 
|                             <div class="bg_list_item_num_item"> | 
|                                 <span>不良数</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> | 
|                     </van-swipe-cell> | 
|                     <!-- <van-swipe-cell> | 
|                         <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>设置 ></span> | 
|                                 </div> | 
|                             </div> | 
|                         </div> | 
|                     </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> | 
|                         <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"> | 
|             <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" @click="submit">确认报工</div> | 
|             </div> | 
|         </template> | 
|         <!--  扫码组件  --> | 
|         <v-ScanCode | 
|             :openCode="openCode" | 
|             :infos="['请扫描工装码']" | 
|             @closePopup="closePopup" | 
|             @onDecode="onDecode" /> | 
|         <!--  报工统计数据  --> | 
|         <van-popup v-model:show="statistics" round :closeable="true" position="bottom" :style="{ height: '53%' }"> | 
|             <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="show" round position="bottom" :style="{ height: '53%' }"> | 
|             <div class="bl"> | 
|                 <div class="bl_head"> | 
|                     <span @click="show = false">取消</span> | 
|                     <span>不良项</span> | 
|                     <span>确认</span> | 
|                 </div> | 
|                 <div class="bl_list"> | 
|                     <div class="bl_list_item" v-for="(item, i) in 12" :key="i"> | 
|                         <div class="bl_list_item_left"> | 
|                             <input type="checkbox" :checked="true" name="" id="" /> | 
|                             <span>有划痕</span> | 
|                         </div> | 
|                         <div class="bl_list_item_right"> | 
|                             <input type="number" placeholder="请输入" /> | 
|                         </div> | 
|                     </div> | 
|                 </div> | 
|             </div> | 
|         </van-popup> | 
|     </div> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
|     import { getCurrentInstance, nextTick, onMounted, ref, reactive } from 'vue' | 
|     import { useRouter, useRoute } from "vue-router" | 
|     import { Dialog, Toast } from 'vant' | 
|     import { REGULAR } from '@/utils/utils' | 
|     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() | 
|     import VWorkOrderInfo from '@/components/common/WorkOrderInfo.vue' | 
|   | 
|     const router = useRouter() | 
|     const route = useRoute() | 
|   | 
|     const loading = ref(false); | 
|     const finished = ref(false); | 
|     let show = ref(false) | 
|     // 点检数据 | 
|     let djData: any = ref([]) | 
|     // 分页查询数据 | 
|     let page = reactive({ | 
|         capacity: 10, | 
|         page: 0 | 
|     }) | 
|   | 
|     // 产出合格/不良 | 
|     let produceFrom = reactive({ | 
|         qualifiedId: '', | 
|         qualified: '',  // 合格 | 
|         undesirableId: '', | 
|         undesirable: '' // 不良 | 
|     }) | 
|   | 
|     // 详情数据 | 
|     const info: any = ref({}) | 
|   | 
|     // 判断是否能提交 | 
|     let isSubmit: any = ref<boolean>(false) | 
|   | 
|     // 不良明细 | 
|     let undesirable: any = ref([]) | 
|   | 
|     // 报废明细 | 
|     let scrap: any = ref([]) | 
|   | 
|     // 扫码类型 | 
|     let type: 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 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 | 
|         console.log(produceFrom.qualified + produceFrom.undesirable) | 
|         if ((produceFrom.qualified + produceFrom.undesirable) > info.value.planNum) { | 
|             return Toast.fail({ message: '产出数量不能大于计划数量', duration: 2000 }) | 
|         } | 
|         if (num >= 0) { | 
|             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 = 0 | 
|                     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 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 | 
|             } | 
|         }) | 
|     } | 
|   | 
|     // 查询工单生产记录---投料 | 
|     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 (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 | 
|             } | 
|             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 = () => { | 
|         comfirmDoneStandard({ | 
|             id: route.query.id | 
|         }).then(res => { | 
|             if (res.code === 200) { | 
|                 Toast.success({ message: '报工成功', forbidClick: true, duration: 2000 }) | 
|                 setTimeout(() => { | 
|                     router.go(-2) | 
|                 }, 2000) | 
|             } | 
|         }) | 
|     } | 
|   | 
|     onMounted(() => { | 
|         pageDJs() | 
|         queryByIds() | 
|         getOrocessRecords() | 
|         getOrocessRecordCC() | 
|     }) | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
|     .bg { | 
|         width: 100%; | 
|         /*height: 100%;*/ | 
|         position: absolute; | 
|         background: #F7F7F7; | 
|         .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_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_num { | 
|                     width: 100%; | 
|                     background: white; | 
|                     padding: 0 30px; | 
|                     box-sizing: border-box; | 
|                     .kong { | 
|                         text-align: center; | 
|                         font-size: 25px; | 
|                         padding: 30px 0; | 
|                         background: #ffffff; | 
|                     } | 
|                     .bg_list_item_num_item { | 
|                         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_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; | 
|                         } | 
|                         span { | 
|                             flex-shrink: 0; | 
|                             overflow: hidden; | 
|                             text-overflow: ellipsis; | 
|                             white-space: nowrap; | 
|                             .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; | 
|                             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 | 
|                             } | 
|                             span { | 
|                                 font-size: 28px; | 
|                                 font-weight: 400; | 
|                                 color: #666666; | 
|                             } | 
|                         } | 
|                     } | 
|                 } | 
|             } | 
|         } | 
|         .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_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: 100%; | 
|             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 { | 
|                 max-height: 400px; | 
|                 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 { | 
|             padding: 30px; | 
|             box-sizing: border-box; | 
|             display: flex; | 
|             flex-direction: column; | 
|             .bl_head { | 
|                 width: 100%; | 
|                 display: flex; | 
|                 align-items: center; | 
|                 justify-content: space-between; | 
|                 span { | 
|                     font-size: 28px; | 
|                     color: #222222; | 
|                     &:nth-child(2) { | 
|                         font-size: 32px !important; | 
|                     } | 
|                 } | 
|             } | 
|             .bl_list { | 
|                 width: 100%; | 
|                 height: 580px; | 
|                 overflow-y: scroll; | 
|                 margin-top: 30px; | 
|                 .bl_list_item { | 
|                     width: 100%; | 
|                     height: 60px; | 
|                     display: flex; | 
|                     align-items: center; | 
|                     justify-content: space-between; | 
|                     margin-bottom: 20px; | 
|                     &:last-child { | 
|                         margin-bottom: 0 !important; | 
|                     } | 
|                     .bl_list_item_left { | 
|                         flex: 1; | 
|                         display: flex; | 
|                         align-items: center; | 
|                         input { | 
|                             width: 30px; | 
|                             height: 30px; | 
|                             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%; | 
|                             font-size: 28px; | 
|                             border-radius: 10px; | 
|                             border: 2px solid #999999 | 
|                         } | 
|                     } | 
|                 } | 
|             } | 
|         } | 
|     } | 
| </style> |