<template> 
 | 
    <div class="page"> 
 | 
        <V-WorkOrderInfo :info="info"></V-WorkOrderInfo> 
 | 
        <div class="page_h"></div> 
 | 
        <div class="page_lx_item padding"> 
 | 
            <span>检验类型</span> 
 | 
            <div class="page_lx_item_is"> 
 | 
                <div class="page_lx_item_is_i" :class="{ 'active': item.active }" v-for="(item, index) in typeList" :key="index" @click="clickTag(index)"> 
 | 
                    <span>{{item.name}}</span> 
 | 
                </div> 
 | 
            </div> 
 | 
        </div> 
 | 
        <div class="page_h"></div> 
 | 
        <div class="page_list" v-for="(item, index) in data" :key="index"> 
 | 
            <div class="page_list_header"> 
 | 
                <div class="page_list_header_left"> 
 | 
                    <div class="page_list_header_left_h"></div> 
 | 
                    <span>{{item.gzbm}}</span> 
 | 
                </div> 
 | 
                <div class="page_list_header_right" @click="dele(index)"> 
 | 
                    <img src="@/assets/icon/zhongjian_ic_delete.png" alt="" /> 
 | 
                    <span>删除</span> 
 | 
                </div> 
 | 
            </div> 
 | 
            <div class="page_list_item"> 
 | 
                <span>合格数量</span> 
 | 
                <div class="page_list_item_ipt"> 
 | 
                    <input v-model="item.qualified" type="number" /> 
 | 
                    <span v-if="info.umodel">{{info.umodel.name}}</span> 
 | 
                </div> 
 | 
            </div> 
 | 
            <van-swipe-cell v-for="(childer, i) in item.poorList" :key="i"> 
 | 
                <div class="page_list_box"> 
 | 
                    <div class="page_list_item1"> 
 | 
                        <span>不良数量</span> 
 | 
                        <div class="page_list_item_ipt"> 
 | 
                            <input v-model="childer.unqualified" placeholder="0" type="number" /> 
 | 
                            <span v-if="info.umodel">{{info.umodel.name}}</span> 
 | 
                        </div> 
 | 
                    </div> 
 | 
                    <div class="page_list_item1" v-show="childer.unqualified > 0" @click="openGZ(index, i)"> 
 | 
                        <span>不良工装</span> 
 | 
                        <div class="page_content_item_is"> 
 | 
                            <span :style="childer.defectiveToolingName ? 'color: #000;' : ''">{{childer.defectiveToolingName ? childer.defectiveToolingName : '点击选择工装'}}</span> 
 | 
                            <van-icon name="arrow" color="#999999" size="18" /> 
 | 
                        </div> 
 | 
                    </div> 
 | 
                    <div class="page_content_sm" v-show="childer.unqualified > 0"> 
 | 
                        <div class="page_content_sm_box" @click="openSM('1', index, i)"> 
 | 
                            <img src="@/assets/icon/jianyan_ic_saoma@2x.png" alt="" /> 
 | 
                            <span>扫描工装</span> 
 | 
                        </div> 
 | 
                    </div> 
 | 
                    <div class="page_list_item1" v-show="childer.unqualified > 0" @click="openBL(index, i)"> 
 | 
                        <span>不良说明</span> 
 | 
                        <div class="page_content_item_is"> 
 | 
                            <span :style="childer.defectDescriptionName ? 'color: #000;' : ''">{{childer.defectDescriptionName ? childer.defectDescriptionName : '点击选择不良原因'}}</span> 
 | 
                            <van-icon name="arrow" color="#999999" size="18" /> 
 | 
                        </div> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <template #right> 
 | 
                    <van-button style="height: 100%;" square type="danger" text="删除" @click="dele(index, i)" /> 
 | 
                </template> 
 | 
            </van-swipe-cell> 
 | 
            <div class="page_list_add"> 
 | 
                <img src="@/assets/icon/gongdan_ic_shoudong@2x.png" alt="" /> 
 | 
                <span @click="addItem(index)">添加不良</span> 
 | 
            </div> 
 | 
        </div> 
 | 
<!--        <van-swipe-cell v-for="(item, index) in data" :key="index">--> 
 | 
<!--            <div class="page_content">--> 
 | 
<!--                <div class="page_content_title">--> 
 | 
<!--                    <span>{{item.gzbm}}</span>--> 
 | 
<!--                    <span @click="addItem(index)">添加不良 +</span>--> 
 | 
<!--                </div>--> 
 | 
<!--                <div class="page_content_item">--> 
 | 
<!--                    <span>合格数量</span>--> 
 | 
<!--                    <div class="page_content_item_i">--> 
 | 
<!--                        <input v-model="item.qualified" type="number" />--> 
 | 
<!--                        <span v-if="info.umodel">{{info.umodel.name}}</span>--> 
 | 
<!--                    </div>--> 
 | 
<!--                </div>--> 
 | 
<!--                <div class="page_content_list" v-for="(childer, i) in item.poorList" :key="i">--> 
 | 
<!--                    <div class="page_content_item">--> 
 | 
<!--                        <span>不良数量</span>--> 
 | 
<!--                        <div class="page_content_item_i">--> 
 | 
<!--                            <input v-model="childer.unqualified" placeholder="0" type="number" />--> 
 | 
<!--                            <span v-if="info.umodel">{{info.umodel.name}}</span>--> 
 | 
<!--                        </div>--> 
 | 
<!--                    </div>--> 
 | 
<!--                    <div class="page_content_item" v-show="childer.unqualified > 0" @click="openGZ(index)">--> 
 | 
<!--                        <span>不良工装</span>--> 
 | 
<!--                        <div class="page_content_item_is">--> 
 | 
<!--                            <span :style="childer.defectiveToolingName ? 'color: #000;' : ''">{{childer.defectiveToolingName ? childer.defectiveToolingName : '点击选择工装'}}</span>--> 
 | 
<!--                            <van-icon name="arrow" color="#999999" size="18" />--> 
 | 
<!--                        </div>--> 
 | 
<!--                    </div>--> 
 | 
<!--                    <div class="page_content_sm" v-show="childer.unqualified > 0">--> 
 | 
<!--                        <div class="page_content_sm_box" @click="openSM('1', index)">--> 
 | 
<!--                            <img src="@/assets/icon/jianyan_ic_saoma@2x.png" alt="" />--> 
 | 
<!--                            <span>扫描工装</span>--> 
 | 
<!--                        </div>--> 
 | 
<!--                    </div>--> 
 | 
<!--                    <div class="page_content_item" v-show="childer.unqualified > 0" @click="openBL(index)">--> 
 | 
<!--                        <span>不良说明</span>--> 
 | 
<!--                        <div class="page_content_item_is">--> 
 | 
<!--                            <span :style="childer.defectDescriptionName ? 'color: #000;' : ''">{{childer.defectDescriptionName ? childer.defectDescriptionName : '点击选择不良原因'}}</span>--> 
 | 
<!--                            <van-icon name="arrow" color="#999999" size="18" />--> 
 | 
<!--                        </div>--> 
 | 
<!--                    </div>--> 
 | 
<!--                </div>--> 
 | 
<!--            </div>--> 
 | 
<!--            <template #right>--> 
 | 
<!--                <van-button square class="buton" type="danger" text="删除" @click="dele(index)" />--> 
 | 
<!--            </template>--> 
 | 
<!--            <div class="page_h"></div>--> 
 | 
<!--        </van-swipe-cell>--> 
 | 
        <div class="page_remark"> 
 | 
            <textarea v-model="remark" placeholder="请输入检验备注说明信息,非必填"></textarea> 
 | 
        </div> 
 | 
        <div class="page_zw"></div> 
 | 
        <div class="page_footer"> 
 | 
            <div class="page_footer_jx" @click="openSM('2')">继续检验</div> 
 | 
            <button v-preventReClick class="page_footer_tj" @click="submit">提交</button> 
 | 
        </div> 
 | 
        <!--    工装    --> 
 | 
<!--        <van-popup v-model:show="show" position="bottom" round :style="{ height: '50%' }">--> 
 | 
<!--            <van-search v-model="value" @blur="changeValue" placeholder="请输入搜索关键词" />--> 
 | 
<!--            <van-picker--> 
 | 
<!--                title="选择工装"--> 
 | 
<!--                :columns="value ? dataList : columns"--> 
 | 
<!--                @confirm="onConfirm"--> 
 | 
<!--                @cancel="onCancel"--> 
 | 
<!--            />--> 
 | 
<!--        </van-popup>--> 
 | 
        <!--    不良原因    --> 
 | 
        <van-popup v-model:show="show1" position="bottom" round :style="{ height: '40%' }"> 
 | 
            <van-picker 
 | 
                title="选择不良原因" 
 | 
                :columns="columns1" 
 | 
                @confirm="onConfirm1" 
 | 
                @cancel="onCancel1" 
 | 
            /> 
 | 
        </van-popup> 
 | 
        <!--    扫码    --> 
 | 
        <v-ScanCode 
 | 
            :openCode="openCode" 
 | 
            :infos="['请扫描工装码']" 
 | 
            @closePopup="closePopup" 
 | 
            @onDecode="onDecode" /> 
 | 
        <!--    提交弹框    --> 
 | 
        <van-popup v-model:show="subShow" position="bottom" round :style="{ height: '40%' }"> 
 | 
            <div class="result"> 
 | 
                <div class="result_title">请确认检验数据</div> 
 | 
                <div class="result_content"> 
 | 
                    <div class="result_content_iten"> 
 | 
                        <span>检验率:</span>  
 | 
                        <span>{{rate.inspectionRate}}%</span> 
 | 
                    </div> 
 | 
                    <div class="result_content_iten"> 
 | 
                        <span>不良率:</span>  
 | 
                        <span>{{rate.defectiveRate}}%</span> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div class="result_box"> 
 | 
                    <div class="result_box_label">检验结果</div> 
 | 
                    <div class="result_box_nr"> 
 | 
                        <div class="result_box_nr_item" :class="{'actives': item.active}" v-for="(item, index) in cate" :key="index" @click="chageCate(index)">{{item.name}}</div> 
 | 
                    </div> 
 | 
                </div> 
 | 
                <div class="result_footer"> 
 | 
                    <div class="result_footer_qx" @click="close">取消</div> 
 | 
                    <button class="result_footer_qr" v-preventReClick @click="submit1">提交</button> 
 | 
                </div> 
 | 
            </div> 
 | 
        </van-popup> 
 | 
        <!--  工装器具  --> 
 | 
        <Tooling :show="gzShow" :attribute="Attribute.HH" @close="close1" @value="getValue" /> 
 | 
    </div> 
 | 
</template> 
 | 
  
 | 
<script setup lang="ts"> 
 | 
    import { ref, reactive, onMounted, nextTick, watch } from 'vue' 
 | 
    import { useRoute, useRouter } from "vue-router" 
 | 
    import { createJY, upload, uploadTest } from '@/apis/QualityAPI' 
 | 
    import { Toast } from 'vant' 
 | 
    import { QRCodeType, Attribute } from '@/enum' 
 | 
    import { queryById, getListByCondition, checkAllList, getBarcodeContent, getEndCheckAP } from '@/apis/WorkOrderAPI' 
 | 
    import VWorkOrderInfo from '@/components/common/WorkOrderInfo.vue' 
 | 
    import Tooling from '@/components/common/Tooling.vue' 
 | 
  
 | 
    const route = useRoute() 
 | 
  
 | 
    const router = useRouter() 
 | 
  
 | 
    // 区分扫码 
 | 
    let index = ref<string>() 
 | 
  
 | 
    let gzShow = ref<boolean>(false) 
 | 
  
 | 
    // 区分插入数据 
 | 
    let i = ref<number>() 
 | 
    let ii = ref<number>() 
 | 
  
 | 
    // 控制不良显示隐藏 
 | 
    const isShow = ref<boolean>(false) 
 | 
  
 | 
    // 控制扫码显示隐藏 
 | 
    const openCode = ref<boolean>(false) 
 | 
  
 | 
    // 提交弹框 
 | 
    let subShow = ref<boolean>(false) 
 | 
  
 | 
    // 工装弹框显示隐藏 
 | 
    const show = ref<boolean>(false) 
 | 
  
 | 
    // 不良原因弹框显示隐藏 
 | 
    const show1 = ref<boolean>(false) 
 | 
  
 | 
    // 工装下拉数据 
 | 
    const columns: any = ref([]) 
 | 
  
 | 
    // 不良原因下拉数据 
 | 
    const columns1: any = ref([]) 
 | 
  
 | 
    // 工单详情数据 
 | 
    let info: any = ref({}) 
 | 
  
 | 
    let remark = ref<string>('')    // 备注 
 | 
  
 | 
    // 工装器具详情 
 | 
    let infos: any = ref({}) 
 | 
  
 | 
    // 搜索工装 
 | 
    let value = ref<string>('') 
 | 
  
 | 
    // 搜索工装暂存数据 
 | 
    let dataList = ref<Array<object>>([]) 
 | 
  
 | 
    // 检验率/不良率 
 | 
    let rate = reactive({ 
 | 
        inspectionRate: 0, 
 | 
        defectiveRate: 0 
 | 
    }) 
 | 
  
 | 
    // 检验提交数据 
 | 
    let data: any = reactive([ 
 | 
        { 
 | 
            gzid: '',   // 工装id 
 | 
            gzbm: '',   // 工装编码 
 | 
            gzmc: '',   // 工装名称 
 | 
            total: 0,   // 工装总数 
 | 
            qualified: '',   // 合格 
 | 
            poorList: [   // 不良集合 
 | 
                { 
 | 
                    unqualified: '',      // 不合格 
 | 
                    defectiveTooling: '',   // 不合格工装 
 | 
                    defectiveToolingName: '',   // 不合格工装名称 
 | 
                    defectDescription: '',  // 不合格说明 
 | 
                } 
 | 
            ], 
 | 
            defectDescriptionName: ''  // 不良原因名称 
 | 
        } 
 | 
    ]) 
 | 
  
 | 
    // 检验类型 
 | 
    const typeList: any = ref([ 
 | 
        { name: '检具检', active: true, id: 0 }, 
 | 
        { name: '外观检', active: false, id: 1 } 
 | 
    ]) 
 | 
  
 | 
    // 类型 
 | 
    const cate: any = ref([ 
 | 
        { name: '合格', active: true, id: 0 }, 
 | 
        { name: '不合格', active: false, id: 1 } 
 | 
    ]) 
 | 
  
 | 
    // 添加不良工装 
 | 
    const addItem = (i: number) => { 
 | 
        data[i].poorList.push({ 
 | 
            unqualified: '',      // 不合格 
 | 
            defectiveTooling: '',   // 不合格工装 
 | 
            defectiveToolingName: '',   // 不合格工装名称 
 | 
            defectDescription: '',  // 不合格说明 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    const close1 = () => { 
 | 
        gzShow.value = false 
 | 
    } 
 | 
  
 | 
    // 获取工装数据 
 | 
    const getValue = (item: any) => { 
 | 
        data[i.value as number].poorList[ii.value as number].defectiveTooling = item.id 
 | 
        data[i.value as number].poorList[ii.value as number].defectiveToolingName = item.code 
 | 
        gzShow.value = false 
 | 
    } 
 | 
  
 | 
    // 关闭统计弹框 
 | 
    const close = () => { 
 | 
        subShow.value = false 
 | 
    } 
 | 
  
 | 
    // 切换检验结果 
 | 
    const chageCate = (i: number) => { 
 | 
        cate.value.forEach((item: any, index: number) => { 
 | 
            item.active = i === index; 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    // 删除对应检验 
 | 
    const dele = (index: number, i: number): void => { 
 | 
        if (data[index].poorList.length === 1) { 
 | 
            Toast.fail({ message: '至少需要一项内容' }) 
 | 
            return 
 | 
        } 
 | 
        data[index].poorList.splice(i, 1) 
 | 
    } 
 | 
  
 | 
    // 模糊搜索 
 | 
    const changeValue = (val: any): void => { 
 | 
        dataList.value = [] 
 | 
        let { _value } = val.target 
 | 
        if (!_value) return 
 | 
        columns.value.forEach((item: any) => { 
 | 
            if (item.text.indexOf(_value) !== -1) { 
 | 
                dataList.value.push(item) 
 | 
            } 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    // 获取扫码值 
 | 
    const onDecode = (datas: string[]): void => { 
 | 
        if (index.value === '1') { 
 | 
            getBarcodeContent({ 
 | 
                barcode: datas[0] 
 | 
            }).then(res => { 
 | 
                if (res.code === 200) { 
 | 
                    if (res.data.barcodeType === QRCodeType.GZ) { 
 | 
                        getListByCondition({ 
 | 
                            id: res.data.id 
 | 
                        }).then(res => { 
 | 
                            if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                                if (info.value.type === 2) {    // 返工返修 
 | 
                                    if (res.data[0].smodelLabel === Attribute.BF) { 
 | 
                                        if (res.data[0].status !== 0) { 
 | 
                                            data[i.value as number].poorList[ii.value as number].defectiveTooling = res.data[0].id 
 | 
                                            data[i.value as number].poorList[ii.value as number].defectiveToolingName = res.data[0].code 
 | 
                                        } else { 
 | 
                                            Toast.fail({ message: '扫描的工装状态不能为已报废' }) 
 | 
                                        } 
 | 
                                    } else { 
 | 
                                        Toast.fail({ message: '只能扫描报废属性的工装' }) 
 | 
                                    } 
 | 
                                } else { 
 | 
                                    if (res.data[0].smodelLabel === Attribute.BL || res.data[0].smodelLabel === Attribute.BF) { 
 | 
                                        if (res.data[0].status !== 0) { 
 | 
                                            data[i.value as number].poorList[ii.value as number].defectiveTooling = res.data[0].id 
 | 
                                            data[i.value as number].poorList[ii.value as number].defectiveToolingName = res.data[0].code 
 | 
                                        } else { 
 | 
                                            Toast.fail({ message: '扫描的工装状态不能为已报废' }) 
 | 
                                        } 
 | 
                                    } else { 
 | 
                                        Toast.fail({ message: '只能扫描不良或者报废属性的工装' }) 
 | 
                                    } 
 | 
                                } 
 | 
                            } 
 | 
                        }) 
 | 
                    } else { 
 | 
                        Toast.fail({ message: '请扫描正确的工装码' }) 
 | 
                    } 
 | 
                } 
 | 
            }) 
 | 
        } else if (index.value === '2') { 
 | 
            getBarcodeContent({ 
 | 
                barcode: datas[0] 
 | 
            }).then(res => { 
 | 
                if (res.code === 200) { 
 | 
                    if (res.data.barcodeType === QRCodeType.GZ) { 
 | 
                        getEndCheckAP({ 
 | 
                            appliancesId: res.data.id, 
 | 
                            workOrderId: route.query.gdId 
 | 
                        }).then(res => { 
 | 
                            if (res.code === 200) { 
 | 
                                // if (res.data[0].workorderId === info.value.id) { 
 | 
                                data.push({ 
 | 
                                    gzid: res.data.appliancesId, 
 | 
                                    gzbm: res.data.appliancesCode, 
 | 
                                    gzmc: '', 
 | 
                                    total: res.data.appliancesNum, 
 | 
                                    qualified: '', 
 | 
                                    poorList: [   // 不良集合 
 | 
                                        { 
 | 
                                            unqualified: '',      // 不合格 
 | 
                                            defectiveTooling: '',   // 不合格工装 
 | 
                                            defectiveToolingName: '',   // 不合格工装名称 
 | 
                                            defectDescription: '',  // 不合格说明 
 | 
                                        } 
 | 
                                    ], 
 | 
                                    defectDescriptionName: '' 
 | 
                                }) 
 | 
                                // } else { 
 | 
                                //     Toast.fail({ message: '此工装不在当前工单下', duration: 2000 }) 
 | 
                                // } 
 | 
                            } 
 | 
                        }) 
 | 
                        // getListByCondition({ 
 | 
                        //     id: res.data.id 
 | 
                        // }).then(res => { 
 | 
                        //     if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                        //         // if (res.data[0].workorderId === info.value.id) { 
 | 
                        //             data.push({ 
 | 
                        //                 gzid: res.data[0].id, 
 | 
                        //                 gzbm: res.data[0].code, 
 | 
                        //                 gzmc: res.data[0].mmodelName, 
 | 
                        //                 total: res.data[0].num, 
 | 
                        //                 qualified: '', 
 | 
                        //                 unqualified: '', 
 | 
                        //                 defectiveTooling: '', 
 | 
                        //                 defectiveToolingName: '', 
 | 
                        //                 defectDescription: '', 
 | 
                        //                 defectDescriptionName: '' 
 | 
                        //             }) 
 | 
                        //         // } else { 
 | 
                        //         //     Toast.fail({ message: '此工装不在当前工单下', duration: 2000 }) 
 | 
                        //         // } 
 | 
                        //     } 
 | 
                        // }) 
 | 
                    } else { 
 | 
                        Toast.fail({ message: '请扫描正确的工装码' }) 
 | 
                    } 
 | 
                } 
 | 
            }) 
 | 
        } 
 | 
        nextTick(() => { 
 | 
            openCode.value = false 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    // 关闭扫码组件 
 | 
    const closePopup = (): void => { 
 | 
        openCode.value = false 
 | 
    } 
 | 
  
 | 
    // 确认选择工装 
 | 
    const onConfirm = (value: any) => { 
 | 
        data[i.value as number].defectiveTooling = value.id 
 | 
        data[i.value as number].defectiveToolingName = value.text 
 | 
        show.value = false 
 | 
    } 
 | 
  
 | 
    // 关闭工装弹框 
 | 
    const onCancel = () => { 
 | 
        show.value = false 
 | 
    } 
 | 
  
 | 
    // 确认选择不良原因 
 | 
    const onConfirm1 = (value: any) => { 
 | 
        data[i.value as number].poorList[ii.value as number].defectDescription = value.id 
 | 
        data[i.value as number].poorList[ii.value as number].defectDescriptionName = value.text 
 | 
        show1.value = false 
 | 
    } 
 | 
  
 | 
    // 关闭不良原因弹框 
 | 
    const onCancel1 = () => { 
 | 
        show1.value = false 
 | 
    } 
 | 
  
 | 
    // 打开工装 
 | 
    const openGZ = (index: number, indexTow: number): void => { 
 | 
        // show.value = true 
 | 
        gzShow.value = true 
 | 
        i.value = index 
 | 
        ii.value = indexTow 
 | 
    } 
 | 
  
 | 
    // 继续检验 
 | 
    const openSM = (type: string, Index: number, indexTwo: number): void => { 
 | 
        i.value = Index 
 | 
        ii.value = indexTwo 
 | 
        index.value = type 
 | 
        openCode.value = true 
 | 
    } 
 | 
  
 | 
    // 打开不良原因 
 | 
    const openBL = (index: number, indexTwo: number): void => { 
 | 
        i.value = index 
 | 
        ii.value = indexTwo 
 | 
        show1.value = true 
 | 
    } 
 | 
  
 | 
    // 切换类型 
 | 
    const clickTag = (index: number): void => { 
 | 
        typeList.value.forEach((item: any, i: number) => { 
 | 
            item.active = index === i; 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    // 获取工单详情 
 | 
    const queryByIds = () => { 
 | 
        queryById(route.query.gdId) 
 | 
            .then(res => { 
 | 
                if (res.code === 200) { 
 | 
                    info.value = res.data 
 | 
                    let router: any = route.query.type 
 | 
                } 
 | 
            }) 
 | 
    } 
 | 
  
 | 
    // 查询工装器具详情 
 | 
    const getListByConditions = (id: any): void => { 
 | 
        getEndCheckAP({ 
 | 
            appliancesId: route.query.gzId, 
 | 
            workOrderId: route.query.gdId 
 | 
        }).then(res => { 
 | 
            if (res.code === 200) { 
 | 
                // infos.value = res.data[0] 
 | 
                data[0].gzid = res.data.appliancesId 
 | 
                data[0].gzbm = res.data.appliancesCode 
 | 
                // data[0].gzmc = res.data[0].mmodelName 
 | 
                data[0].total = res.data.appliancesNum 
 | 
            } 
 | 
        }) 
 | 
        // getListByCondition({ 
 | 
        //     id 
 | 
        // }).then(res => { 
 | 
        //     if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
        //         infos.value = res.data[0] 
 | 
        //         data[0].gzid = Number(id) 
 | 
        //         data[0].gzbm = res.data[0].code 
 | 
        //         data[0].gzmc = res.data[0].mmodelName 
 | 
        //         data[0].total = res.data[0].num 
 | 
        //     } 
 | 
        // }) 
 | 
    } 
 | 
  
 | 
    // 不良原因数据 
 | 
    const checkAllLists = () => { 
 | 
        checkAllList({ bmodelCateType: '3' }) 
 | 
            .then(res => { 
 | 
                if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                    res.data.forEach((item: any) => { 
 | 
                        columns1.value.push({ text: item.combinationName, id: item.id }) 
 | 
                    }) 
 | 
                } 
 | 
            }) 
 | 
    } 
 | 
  
 | 
    /*** 
 | 
     * 查询不良/报废工装 
 | 
     * APPLIANCE_OFFTEST 不良 
 | 
     * APPLIANCE_USELESS 报废 
 | 
     * APPLIANCE_MIX 混合 
 | 
     */ 
 | 
    const getListByConditions1 = () => { 
 | 
        getListByCondition({ 
 | 
            smodelLabel: 'APPLIANCE_MIX' 
 | 
        }).then(res => { 
 | 
            if (res.code === 200 && res.data && res.data.length !== 0) { 
 | 
                res.data.forEach((item: any) => { 
 | 
                    columns.value.push({ text: item.code, id: item.id }) 
 | 
                }) 
 | 
            } 
 | 
        }) 
 | 
    } 
 | 
  
 | 
    // 数组分组 
 | 
    const sortClass = (sortData: any): Array<any> => { 
 | 
        const groupBy = (array: any, f: any) => { 
 | 
            let groups: any = {}; 
 | 
            array.forEach((o: any) => { 
 | 
                let group: any = JSON.stringify(f(o)); 
 | 
                groups[group] = groups[group] || []; 
 | 
                groups[group].push(o); 
 | 
            }); 
 | 
            return Object.keys(groups).map((group) => { 
 | 
                return groups[group]; 
 | 
            }); 
 | 
        }; 
 | 
        const sorted = groupBy(sortData, (item: any) => { 
 | 
            return item.gzbm; // 返回需要分组的对象 
 | 
        }); 
 | 
        return sorted; 
 | 
    } 
 | 
  
 | 
    // 提交检验 
 | 
    const submit = () => { 
 | 
        let isOpen: boolean = true 
 | 
        // 判断合格和不良加起来是否大于0 
 | 
        let num: number = 0 
 | 
        data.forEach((item: any) => { 
 | 
            num = num + (item.qualified ? item.qualified : 0) 
 | 
            item.poorList.forEach((element: any, i: number) => { 
 | 
                num = num + (element.unqualified ? element.unqualified : 0) 
 | 
                if (element.unqualified && element.unqualified > 0) { 
 | 
                    if (element.defectiveTooling === '' || element.defectDescription === '') { 
 | 
                        Toast.fail({ message: `工装[${item.gzbm}]不良说明或不良工装不能为空` }) 
 | 
                        isOpen = false 
 | 
                        return; 
 | 
                    } 
 | 
                } 
 | 
                if (i === item.poorList.length - 1) { 
 | 
                    if (num === 0) { 
 | 
                        Toast.fail({ message: `工装[${item.gzbm}]合格数量和不良数量不能同时为0` }) 
 | 
                        isOpen = false 
 | 
                        return 
 | 
                    } 
 | 
                } 
 | 
            }) 
 | 
        }) 
 | 
        let totalNum: number = 0 
 | 
        data.forEach((element: any) => { 
 | 
            totalNum = totalNum + (element.qualified ? element.qualified : 0) 
 | 
            element.poorList.forEach((elementTwo: any) => { 
 | 
                totalNum = totalNum + (elementTwo.unqualified ? elementTwo.unqualified : 0) 
 | 
            }) 
 | 
        }) 
 | 
        if (totalNum > info.value.planNum) { 
 | 
            Toast.fail({ message: '合格和不良总和不能大于工单计划数量' }) 
 | 
            return 
 | 
        } 
 | 
        // 数组分组 
 | 
        // let res = sortClass(data) 
 | 
        // console.log(res) 
 | 
        // let total: number = 0 
 | 
        // // 判断工装是否超出总数 
 | 
        // res.forEach((item: any) => { 
 | 
        //     let total: number = 0  // 工装总数 
 | 
        //     let num: number = 0  // 已投入数量 
 | 
        //     item.forEach((item1: any, index: number) => { 
 | 
        //         total = item1.total 
 | 
        //         num = num + (item1.qualified ? item1.qualified : 0) + (item1.unqualified ? item1.unqualified : 0) 
 | 
        //         if (item.length - 1 === index) { 
 | 
        //             if (num > total) { 
 | 
        //                 Toast.fail({ message: `工装[${item1.gzbm}]已超出最大数量` }) 
 | 
        //                 isOpen = false 
 | 
        //                 return 
 | 
        //             } 
 | 
        //         } 
 | 
        //     }) 
 | 
        // }) 
 | 
        let total: number = 0   // 检验合格数量+检验不良数量 
 | 
        let total1: number = 0   // 检验不良数量 
 | 
        data.forEach((item: any) => { 
 | 
            total = total + (item.qualified ? item.qualified : 0) 
 | 
            item.poorList.forEach((element: any) => { 
 | 
                total = total + (element.unqualified ? element.unqualified : 0) 
 | 
                total1 = total1 + (element.unqualified ? element.unqualified : 0) 
 | 
            }) 
 | 
        }) 
 | 
        rate.inspectionRate = (total / info.value.planNum * 100).toFixed(2) as any 
 | 
        rate.defectiveRate = (total1 / total * 100).toFixed(2) as any 
 | 
        if (isOpen) subShow.value = true 
 | 
    } 
 | 
  
 | 
    // 提交终检 
 | 
    const submit1 = () => { 
 | 
        let obj: any = { 
 | 
            checkType: '', 
 | 
            downType: '', 
 | 
            num: 0, 
 | 
            remark: remark.value, 
 | 
            workOrderId: Number(route.query.gdId), 
 | 
            endCheckDetailBeanList: [] 
 | 
        } 
 | 
        typeList.value.forEach((item: any) => { 
 | 
            if (item.active) { 
 | 
                obj.checkType = item.id 
 | 
            } 
 | 
        }) 
 | 
        cate.value.forEach((item: any) => { 
 | 
            if (item.active) { 
 | 
                obj.downType = item.id 
 | 
            } 
 | 
        }) 
 | 
        data.forEach((item: any, index: number) => { 
 | 
            obj.num = obj.num + (item.qualified ? item.qualified : 0) 
 | 
            obj.endCheckDetailBeanList.push({ 
 | 
                appliancesId: item.gzid, 
 | 
                appliancesNum: item.total, 
 | 
                num: item.qualified ? item.qualified : 0, 
 | 
                // checkInfo: '', 
 | 
                // qualifiedAppliancesId: '', 
 | 
                qualifiedNum: item.qualified ? item.qualified : 0, 
 | 
                // unQualifiedNum: 0, 
 | 
                endCheckUnQualifiedBeanList: [] 
 | 
            }) 
 | 
            item.poorList.forEach((element: any) => { 
 | 
                obj.num = obj.num + (element.unqualified ? element.unqualified : 0) 
 | 
                obj.endCheckDetailBeanList[index].num = obj.endCheckDetailBeanList[index].num + (element.unqualified ? element.unqualified : 0) 
 | 
                // obj.endCheckDetailBeanList.unQualifiedNum = element.unqualified ? element.unqualified : 0 
 | 
                // obj.endCheckDetailBeanList.qualifiedAppliancesId = element.defectiveTooling 
 | 
                // obj.endCheckDetailBeanList.checkInfo = element.defectDescriptionName 
 | 
                if (element.unqualified) { 
 | 
                  obj.endCheckDetailBeanList[index].endCheckUnQualifiedBeanList.push({ 
 | 
                    checkInfo: element.defectDescriptionName, 
 | 
                    qualifiedAppliancesId: element.defectiveTooling, 
 | 
                    unQualifiedNum: element.unqualified 
 | 
                  }) 
 | 
                } 
 | 
            }) 
 | 
        }) 
 | 
        // console.log(obj) 
 | 
        uploadTest(obj) 
 | 
            .then(res => { 
 | 
                if (res.code === 200) { 
 | 
                    Toast.success({ message: '检验成功', duration: 2000, forbidClick: true }) 
 | 
                    setTimeout(() => { 
 | 
                        router.go(-1) 
 | 
                    }, 2000) 
 | 
                } 
 | 
            }) 
 | 
    } 
 | 
  
 | 
    // 监听选择工装 
 | 
    watch(() => show.value, (news, old) => { 
 | 
        if (!news) { 
 | 
            dataList.value = [] 
 | 
            value.value = '' 
 | 
        } 
 | 
    }) 
 | 
  
 | 
    const addNum = (num1: number, num2: number): number => { 
 | 
        num1 == undefined ? num1 = 0 : '' 
 | 
        num2 == undefined ? num2 = 0 : '' 
 | 
        let sq1, sq2, m; 
 | 
        try { 
 | 
            sq1 = num1.toString().split(".")[1].length; 
 | 
        } catch (e) { 
 | 
            sq1 = 0; 
 | 
        } 
 | 
        try { 
 | 
            sq2 = num2.toString().split(".")[1].length; 
 | 
        } catch (e) { 
 | 
            sq2 = 0; 
 | 
        } 
 | 
        m = Math.pow(10, Math.max(sq1, sq2)); 
 | 
        return (num1 * m + num2 * m) / m; 
 | 
    } 
 | 
  
 | 
  
 | 
    onMounted(() => { 
 | 
        queryByIds() 
 | 
        getListByConditions(route.query.gzId) 
 | 
        checkAllLists() 
 | 
        getListByConditions1() 
 | 
    }) 
 | 
</script> 
 | 
  
 | 
<style scoped> 
 | 
    .buton { 
 | 
        height: calc(100% - 20px) !important; 
 | 
    } 
 | 
</style> 
 | 
  
 | 
<style lang="scss" scoped> 
 | 
    .page { 
 | 
        width: 100%; 
 | 
        background: #F7F7F7; 
 | 
        height: 100%; 
 | 
        position: absolute; 
 | 
        .page_info { 
 | 
            padding: 30px; 
 | 
            background: white; 
 | 
            .page_info_title { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                .purple { 
 | 
                    color: $nav-color !important; 
 | 
                } 
 | 
                .green { 
 | 
                    color: $nav-stateColor6 !important; 
 | 
                } 
 | 
                .yellow { 
 | 
                    color: $nav-stateColor1 !important; 
 | 
                } 
 | 
                span { 
 | 
                    &:first-child { 
 | 
                        font-size: 32px; 
 | 
                        font-weight: 500; 
 | 
                        color: #333333; 
 | 
                    } 
 | 
                    &:last-child { 
 | 
                        font-size: 26px; 
 | 
                        font-weight: 400; 
 | 
                        color: #03AF76; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_info_code { 
 | 
                margin: 24px 0; 
 | 
                font-size: 24px; 
 | 
                font-weight: 400; 
 | 
                color: #666666; 
 | 
            } 
 | 
            .page_info_nr { 
 | 
                padding: 30px; 
 | 
                background: #F7F7F7; 
 | 
                border-radius: 16px; 
 | 
                display: flex; 
 | 
                justify-content: space-between; 
 | 
                flex-wrap: wrap; 
 | 
                .page_info_nr_item { 
 | 
                    width: 50%; 
 | 
                    display: flex; 
 | 
                    align-items: flex-start; 
 | 
                    margin-top: 24px; 
 | 
                    &:nth-child(1) { 
 | 
                        margin-top: 0; 
 | 
                    } 
 | 
                    &:nth-child(2) { 
 | 
                        margin-top: 0; 
 | 
                    } 
 | 
                    span { 
 | 
                        &:nth-child(1) { 
 | 
                            font-size: 24px; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                            flex-shrink: 0; 
 | 
                        } 
 | 
                        &:nth-child(2) { 
 | 
                            font-size: 24px; 
 | 
                            font-weight: 400; 
 | 
                            color: #222222; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_info_yq { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                margin-top: 30px; 
 | 
                .page_info_yq_nr { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    span { 
 | 
                        &:nth-child(1) { 
 | 
                            font-size: 26px; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                        } 
 | 
                        &:nth-child(2) { 
 | 
                            font-size: 26px; 
 | 
                            font-weight: 400; 
 | 
                            color: #222222; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_h { 
 | 
            height: 20px; 
 | 
        } 
 | 
        .padding { 
 | 
            padding: 0 30px; 
 | 
        } 
 | 
        .page_lx_item { 
 | 
            background: white; 
 | 
            height: 98px; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            justify-content: space-between; 
 | 
            span { 
 | 
                font-size: 30px; 
 | 
                font-weight: 400; 
 | 
                color: #222222; 
 | 
            } 
 | 
            .page_lx_item_is { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                .active { 
 | 
                    background: $nav-color !important; 
 | 
                    span { 
 | 
                        color: #ffffff !important; 
 | 
                    } 
 | 
                } 
 | 
                .page_lx_item_is_i { 
 | 
                    padding: 18px 32px; 
 | 
                    background: #F2F2F2; 
 | 
                    border-radius: 8px; 
 | 
                    margin-right: 20px; 
 | 
                    &:last-child { 
 | 
                        margin: 0; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 26px; 
 | 
                        font-weight: 400; 
 | 
                        color: #333333; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_lx_item_i { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                span { 
 | 
                    font-size: 28px; 
 | 
                    font-weight: 400; 
 | 
                    color: #999999; 
 | 
                    margin-right: 10px; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_content { 
 | 
            padding: 30px 30px 0 30px; 
 | 
            background: white; 
 | 
            .page_content_title { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                span { 
 | 
                    &:first-child { 
 | 
                        font-size: 32px; 
 | 
                        font-weight: 500; 
 | 
                        color: $nav-color; 
 | 
                    } 
 | 
                    &:last-child { 
 | 
                        font-size: 26px; 
 | 
                        font-weight: 500; 
 | 
                        color: $nav-color; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_content_list { 
 | 
                .page_content_item { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: space-between; 
 | 
                    height: 98px; 
 | 
                    border-bottom: 1px solid #E5E5E5; 
 | 
                    &:last-child { 
 | 
                        border: none; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 30px; 
 | 
                        font-weight: 400; 
 | 
                        color: #222222; 
 | 
                    } 
 | 
                    .page_content_item_is { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #999999; 
 | 
                            margin-right: 10px; 
 | 
                        } 
 | 
                    } 
 | 
                    .page_content_item_i { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        input { 
 | 
                            padding: 0 30px; 
 | 
                            text-align: right; 
 | 
                            width: 180px; 
 | 
                            height: 60px; 
 | 
                            border-radius: 8px; 
 | 
                            border: 1PX solid #CCCCCC; 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #000000; 
 | 
                            margin-right: 20px; 
 | 
                        } 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_content_item { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                height: 98px; 
 | 
                border-bottom: 1px solid #E5E5E5; 
 | 
                &:last-child { 
 | 
                    border: none; 
 | 
                } 
 | 
                span { 
 | 
                    font-size: 30px; 
 | 
                    font-weight: 400; 
 | 
                    color: #222222; 
 | 
                } 
 | 
                .page_content_item_is { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #999999; 
 | 
                        margin-right: 10px; 
 | 
                    } 
 | 
                } 
 | 
                .page_content_item_i { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    input { 
 | 
                        padding: 0 30px; 
 | 
                        text-align: right; 
 | 
                        width: 180px; 
 | 
                        height: 60px; 
 | 
                        border-radius: 8px; 
 | 
                        border: 1PX solid #CCCCCC; 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #000000; 
 | 
                        margin-right: 20px; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #666666; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_content_sm { 
 | 
                width: 100%; 
 | 
                text-align: right; 
 | 
                margin-top: 20px; 
 | 
                display: flex; 
 | 
                justify-content: flex-end; 
 | 
                .page_content_sm_box { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    img { 
 | 
                        width: 28px; 
 | 
                        height: 28px; 
 | 
                        margin-right: 12px; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: $nav-color; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_lx { 
 | 
            padding: 0 30px; 
 | 
            background: white; 
 | 
            .page_lx_item { 
 | 
                height: 98px; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                border-bottom: 1px solid #E5E5E5; 
 | 
                &:last-child { 
 | 
                    border: none; 
 | 
                } 
 | 
                span { 
 | 
                    font-size: 30px; 
 | 
                    font-weight: 400; 
 | 
                    color: #222222; 
 | 
                } 
 | 
                .page_lx_item_is { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    .active { 
 | 
                        background: $nav-color !important; 
 | 
                        span { 
 | 
                            color: #ffffff !important; 
 | 
                        } 
 | 
                    } 
 | 
                    .page_lx_item_is_i { 
 | 
                        padding: 18px 32px; 
 | 
                        background: #F2F2F2; 
 | 
                        border-radius: 8px; 
 | 
                        margin-right: 20px; 
 | 
                        &:last-child { 
 | 
                            margin: 0; 
 | 
                        } 
 | 
                        span { 
 | 
                            font-size: 26px; 
 | 
                            font-weight: 400; 
 | 
                            color: #333333; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
                .page_lx_item_i { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #999999; 
 | 
                        margin-right: 10px; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_remark { 
 | 
            width: 100%; 
 | 
            height: 200px; 
 | 
            padding: 30px; 
 | 
            box-sizing: border-box; 
 | 
            background: #ffffff; 
 | 
            textarea { 
 | 
                width: 100%; 
 | 
                height: 100%; 
 | 
                resize: none; 
 | 
                padding: 10px; 
 | 
                box-sizing: border-box; 
 | 
                font-size: 26px; 
 | 
                color: black; 
 | 
                border-radius: 10px; 
 | 
                border: 1PX solid #bdbdbd; 
 | 
            } 
 | 
        } 
 | 
        .page_zw { 
 | 
            height: 160px; 
 | 
        } 
 | 
        .page_footer { 
 | 
            width: 100%; 
 | 
            padding: 0 30px 67px 30px; 
 | 
            box-sizing: border-box; 
 | 
            display: flex; 
 | 
            align-items: center; 
 | 
            justify-content: space-between; 
 | 
            position: fixed; 
 | 
            bottom: 0; 
 | 
            left: 0; 
 | 
            .page_footer_jx { 
 | 
                width: 334px; 
 | 
                height: 88px; 
 | 
                background: #FFFFFF; 
 | 
                box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); 
 | 
                border-radius: 8px; 
 | 
                font-size: 30px; 
 | 
                font-weight: 500; 
 | 
                color: #4275FC; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: center; 
 | 
            } 
 | 
            .page_footer_tj { 
 | 
                width: 334px; 
 | 
                height: 88px; 
 | 
                border: none; 
 | 
                background: #4275FC; 
 | 
                box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08); 
 | 
                border-radius: 8px; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: center; 
 | 
                font-size: 30px; 
 | 
                font-weight: 500; 
 | 
                color: #FFFFFF; 
 | 
            } 
 | 
        } 
 | 
        .result { 
 | 
            width: 100%; 
 | 
            height: 100%; 
 | 
            position: relative; 
 | 
            padding: 30px; 
 | 
            box-sizing: border-box; 
 | 
            .result_title { 
 | 
                font-size: 30px; 
 | 
                text-align: center; 
 | 
            } 
 | 
            .result_box { 
 | 
                margin-top: 60px; 
 | 
                display: flex; 
 | 
                flex-direction: column; 
 | 
                .result_box_label { 
 | 
                    font-size: 26px; 
 | 
                    margin-bottom: 20px; 
 | 
                } 
 | 
                .result_box_nr { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    .actives { 
 | 
                        background: $nav-color !important; 
 | 
                        color: white !important; 
 | 
                    } 
 | 
                    .result_box_nr_item { 
 | 
                        padding: 20px 30px; 
 | 
                        font-size: 26px; 
 | 
                        background: #F2F2F2; 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        justify-content: center; 
 | 
                        margin-right: 20px; 
 | 
                        margin-bottom: 20px; 
 | 
                        border-radius: 10px; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .result_content { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                margin-top: 80px; 
 | 
                .result_content_iten { 
 | 
                    flex: 1; 
 | 
                    span { 
 | 
                        &:first-child { 
 | 
                            font-size: 26px; 
 | 
                        } 
 | 
                        &:last-child { 
 | 
                            font-size: 26px; 
 | 
                            color: $nav-color; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .result_footer { 
 | 
                padding: 0 30px 30px 30px; 
 | 
                box-sizing: border-box; 
 | 
                position: absolute; 
 | 
                bottom: 0; 
 | 
                left: 0; 
 | 
                width: 100%; 
 | 
                height: 100px; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                .result_footer_qx { 
 | 
                    width: 49%; 
 | 
                    height: 88px; 
 | 
                    background: #FFFFFF; 
 | 
                    box-shadow: 0 0 12px 0 rgba(0,0,0,0.0800); 
 | 
                    border-radius: 8px; 
 | 
                    font-size: 30px; 
 | 
                    font-weight: 500; 
 | 
                    color: $nav-color; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: center; 
 | 
                } 
 | 
                .result_footer_qr { 
 | 
                    width: 49%; 
 | 
                    height: 88px; 
 | 
                    background: $nav-color; 
 | 
                    box-shadow: 0 0 12px 0 rgba(0,0,0,0.0800); 
 | 
                    border-radius: 8px; 
 | 
                    font-size: 30px; 
 | 
                    font-weight: 500; 
 | 
                    color: #ffffff; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: center; 
 | 
                    border: none; 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
        .page_list { 
 | 
            .page_list_header { 
 | 
                width: 100%; 
 | 
                height: 80px; 
 | 
                padding: 0 30px; 
 | 
                /*padding: 0 30px;*/ 
 | 
                box-sizing: border-box; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                .page_list_header_left { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    span { 
 | 
                        font-size: 32px; 
 | 
                        font-weight: 500; 
 | 
                        color: #222222; 
 | 
                    } 
 | 
                    .page_list_header_left_h { 
 | 
                        width: 8px; 
 | 
                        height: 30px; 
 | 
                        background: $nav-color; 
 | 
                        border-radius: 2px; 
 | 
                        margin-right: 12px; 
 | 
                    } 
 | 
                } 
 | 
                .page_list_header_right { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    img { 
 | 
                        width: 26px; 
 | 
                        height: 26px; 
 | 
                        margin-right: 8px; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 26px; 
 | 
                        font-weight: 400; 
 | 
                        color: $nav-stateColor4; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_list_item { 
 | 
                width: 100%; 
 | 
                height: 98px; 
 | 
                background: #FFFFFF; 
 | 
                margin-bottom: 20px; 
 | 
                padding: 0 30px; 
 | 
                box-sizing: border-box; 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: space-between; 
 | 
                span { 
 | 
                    font-size: 30px; 
 | 
                    font-weight: 400; 
 | 
                    color: #222222; 
 | 
                } 
 | 
                .page_list_item_ipt { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    input { 
 | 
                        padding: 0 30px; 
 | 
                        text-align: right; 
 | 
                        width: 180px; 
 | 
                        height: 60px; 
 | 
                        border-radius: 8px; 
 | 
                        border: 1PX solid #CCCCCC; 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #000000; 
 | 
                        margin-right: 20px; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: #666666; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_list_box { 
 | 
                width: 100%; 
 | 
                height: auto; 
 | 
                background: white; 
 | 
                /*margin-bottom: 20px;*/ 
 | 
                .page_list_item1 { 
 | 
                    width: 100%; 
 | 
                    height: 98px; 
 | 
                    background: #FFFFFF; 
 | 
                    padding: 0 30px; 
 | 
                    box-sizing: border-box; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: space-between; 
 | 
                    border-bottom: 1PX solid #E5E5E5; 
 | 
                    &:last-child { 
 | 
                        border: none; 
 | 
                    } 
 | 
                    .page_content_item_is { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #999999; 
 | 
                            margin-right: 10px; 
 | 
                        } 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 30px; 
 | 
                        font-weight: 400; 
 | 
                        color: #222222; 
 | 
                    } 
 | 
                    .page_list_item_ipt { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        input { 
 | 
                            padding: 0 30px; 
 | 
                            text-align: right; 
 | 
                            width: 180px; 
 | 
                            height: 60px; 
 | 
                            border-radius: 8px; 
 | 
                            border: 1PX solid #CCCCCC; 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #000000; 
 | 
                            margin-right: 20px; 
 | 
                        } 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
                .page_list_item { 
 | 
                    width: 100%; 
 | 
                    height: 98px; 
 | 
                    background: #FFFFFF; 
 | 
                    margin-bottom: 20px; 
 | 
                    padding: 0 30px; 
 | 
                    box-sizing: border-box; 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    justify-content: space-between; 
 | 
                    .page_content_item_is { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #999999; 
 | 
                            margin-right: 10px; 
 | 
                        } 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 30px; 
 | 
                        font-weight: 400; 
 | 
                        color: #222222; 
 | 
                    } 
 | 
                    .page_list_item_ipt { 
 | 
                        display: flex; 
 | 
                        align-items: center; 
 | 
                        input { 
 | 
                            padding: 0 30px; 
 | 
                            text-align: right; 
 | 
                            width: 180px; 
 | 
                            height: 60px; 
 | 
                            border-radius: 8px; 
 | 
                            border: 1PX solid #CCCCCC; 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #000000; 
 | 
                            margin-right: 20px; 
 | 
                        } 
 | 
                        span { 
 | 
                            font-size: 28px; 
 | 
                            font-weight: 400; 
 | 
                            color: #666666; 
 | 
                        } 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
            .page_list_add { 
 | 
                display: flex; 
 | 
                align-items: center; 
 | 
                justify-content: center; 
 | 
                /*margin: 0 0 30px 0;*/ 
 | 
                height: 80px; 
 | 
                background: #F7F7F7; 
 | 
                img { 
 | 
                    width: 28px; 
 | 
                    height: 28px; 
 | 
                    margin-right: 12px; 
 | 
                } 
 | 
                span { 
 | 
                    font-size: 28px; 
 | 
                    font-weight: 400; 
 | 
                    color: $nav-color; 
 | 
                } 
 | 
            } 
 | 
            .page_content_sm { 
 | 
                width: 100%; 
 | 
                margin-top: 20px; 
 | 
                padding: 0 30px; 
 | 
                display: flex; 
 | 
                box-sizing: border-box; 
 | 
                justify-content: flex-end; 
 | 
                .page_content_sm_box { 
 | 
                    display: flex; 
 | 
                    align-items: center; 
 | 
                    img { 
 | 
                        width: 28px; 
 | 
                        height: 28px; 
 | 
                        margin-right: 12px; 
 | 
                    } 
 | 
                    span { 
 | 
                        font-size: 28px; 
 | 
                        font-weight: 400; 
 | 
                        color: $nav-color; 
 | 
                    } 
 | 
                } 
 | 
            } 
 | 
        } 
 | 
    } 
 | 
</style> 
 |