| <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> |