加css样式解决白屏问题

This commit is contained in:
liyuetong
2021-08-05 17:15:24 +08:00
parent 9c12e43147
commit 45d99f47cd

View File

@@ -1,88 +1,90 @@
<template> <template>
<div class="sale-list-container pb50"> <div class="sale-list-container pb50 box">
<van-sticky> <div class="section">
<van-tabs :line-width="45" v-model="active" @change="tabChange" sticky> <van-sticky>
<van-tab name="notApproved" title="未审批"></van-tab> <van-tabs :line-width="45" v-model="active" @change="tabChange" sticky>
<van-tab name="approvalRecord" title="审批记录"></van-tab> <van-tab name="notApproved" title="审批"></van-tab>
</van-tabs> <van-tab name="approvalRecord" title="审批记录"></van-tab>
</van-sticky> </van-tabs>
<div class="fs12 p10 bg-white" v-if="active == 'approvalRecord'"> </van-sticky>
<van-button <div class="fs12 p10 bg-white" v-if="active == 'approvalRecord'">
round <van-button
:plain="plainStatus=='0'" round
size="small" :plain="plainStatus=='0'"
class="mr5" size="small"
type="danger" class="mr5"
@click="approvalRecordSwitch('1')" type="danger"
>已通过</van-button> @click="approvalRecordSwitch('1')"
<van-button >已通过</van-button>
round <van-button
:plain="plainStatus=='1'" round
size="small" :plain="plainStatus=='1'"
class="mr5" size="small"
type="danger" class="mr5"
@click="approvalRecordSwitch('0')" type="danger"
>未通过</van-button> @click="approvalRecordSwitch('0')"
</div> >未通过</van-button>
<div v-if="isSuccess"> </div>
<div v-if="claimApprovalList.length > 0"> <div v-if="isSuccess">
<div v-for="(item, index) in claimApprovalList" :key="index"> <div v-if="claimApprovalList.length > 0">
<div <div v-for="(item, index) in claimApprovalList" :key="index">
class="fs12 mt20 mb5 text-center" <div
v-if="active == 'notApproved'" class="fs12 mt20 mb5 text-center"
>赔案批次号&nbsp;&nbsp;&nbsp;&nbsp;{{ item.clmBatchNo }}</div> v-if="active == 'notApproved'"
<div >赔案批次号&nbsp;&nbsp;&nbsp;&nbsp;{{ item.clmBatchNo }}</div>
class="fs12 mt20 mb5 text-center" <div
v-if="active == 'approvalRecord'" class="fs12 mt20 mb5 text-center"
>{{ item.approvalDate }}</div> v-if="active == 'approvalRecord'"
<div class="bg-white pv15 pr15 pl10 mt15"> >{{ item.approvalDate }}</div>
<van-collapse v-model="activeNames"> <div class="bg-white pv15 pr15 pl10 mt15">
<van-collapse-item :name="item01.id" v-for="(item01, index01) in item.claimApprovalSearchLst" :key="index01"> <van-collapse v-model="activeNames">
<template #title> <van-collapse-item :name="item01.id" v-for="(item01, index01) in item.claimApprovalSearchLst" :key="index01">
<span class="w30 h30 inline-b" v-if="active == 'notApproved'" @click.stop="checkBoxSwitch(item01.id,item01.isChecked)"> <template #title>
<i :class="item01.isChecked=='0'?'checked':'nochecked'"></i> <span class="w30 h30 inline-b" v-if="active == 'notApproved'" @click.stop="checkBoxSwitch(item01.id,item01.isChecked)">
</span> <i :class="item01.isChecked=='0'?'checked':'nochecked'"></i>
<span class="ml5 mr10 fwb w80 inline-b v-middle" style="word-break: break-all;">{{index01+1}}.{{item01.insuredName}}</span> </span>
<span class="mr10 fwb">{{item01.caseEndDate}}</span> <span class="ml5 mr10 fwb w80 inline-b v-middle" style="word-break: break-all;">{{index01+1}}.{{item01.insuredName}}</span>
<span class="mr10 fwb">{{item01.getMoney}}</span> <span class="mr10 fwb">{{item01.caseEndDate}}</span>
</template> <span class="mr10 fwb">{{item01.getMoney}}</span>
<div class="pb10 pt10 border-gb" style="border-top: 1px solid #dadada;"> </template>
<div class="w130 inline-b">赔案号</div> <div class="pb10 pt10 border-gb" style="border-top: 1px solid #dadada;">
<span class="fs14 c-gray-dark ml20">{{ item01.clmNo }}</span> <div class="w130 inline-b">赔案号</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item01.clmNo }}</span>
<div v-for="(item02, index02) in item01.claimPayeeLst" :key="index02"> </div>
<div class="pb10 pt10 border-gb"> <div v-for="(item02, index02) in item01.claimPayeeLst" :key="index02">
<div class="w130 inline-b">领款人</div> <div class="pb10 pt10 border-gb">
<span class="fs14 c-gray-dark ml20">{{ item02.payeeName }}</span> <div class="w130 inline-b">领款人</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item02.payeeName }}</span>
<div class="pb10 pt10 border-gb"> </div>
<div class="w130 inline-b">领款金额</div> <div class="pb10 pt10 border-gb">
<span class="fs14 c-gray-dark ml20">{{ item02.payMoney }}</span> <div class="w130 inline-b">领款金额</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item02.payMoney }}</span>
<div class="pb10 pt10 border-gb"> </div>
<div class="w130 inline-b">先前支付失败次数</div> <div class="pb10 pt10 border-gb">
<span class="fs14 c-gray-dark ml20">{{ item02.getCount }}</span> <div class="w130 inline-b">先前支付失败次数</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item02.getCount }}</span>
<div class="pb10 pt10 border-gb"> </div>
<div class="w130 inline-b">上一次支付失败原因</div> <div class="pb10 pt10 border-gb">
<span class="fs14 c-gray-dark ml20">{{ item02.lastFailReason }}</span> <div class="w130 inline-b">上一次支付失败原因</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item02.lastFailReason }}</span>
<div class="pb10 pt10 border-gb"> </div>
<div class="w130 inline-b">上一次支付失败日期</div> <div class="pb10 pt10 border-gb">
<span class="fs14 c-gray-dark ml20">{{ item02.lastFailDate }}</span> <div class="w130 inline-b">上一次支付失败日期</div>
</div> <span class="fs14 c-gray-dark ml20">{{ item02.lastFailDate }}</span>
</div> </div>
</van-collapse-item> </div>
</van-collapse> </van-collapse-item>
</div> </van-collapse>
</div> </div>
<div class="h50 inline-b"></div> </div>
<div class="h50 inline-b"></div>
</div>
</div>
<div v-else class="text-center">
<img class="mt40" src="@/assets/images/pic_page-non.png" />
<div class="fs17 mt40" v-if="active == 'notApproved'">暂无未审批信息</div>
<div class="fs17 mt40" v-if="active == 'approvalRecord'">暂无审批记录</div>
</div> </div>
</div>
<div v-else class="text-center">
<img class="mt40" src="@/assets/images/pic_page-non.png" />
<div class="fs17 mt40" v-if="active == 'notApproved'">暂无未审批信息</div>
<div class="fs17 mt40" v-if="active == 'approvalRecord'">暂无审批记录</div>
</div> </div>
<div class="bottom-btn bg-white pt10 pb10 flex justify-content-s" style="border-top: 1px solid #dadada;" v-if="active == 'notApproved'"> <div class="bottom-btn bg-white pt10 pb10 flex justify-content-s" style="border-top: 1px solid #dadada;" v-if="active == 'notApproved'">
<div> <div>
@@ -94,7 +96,7 @@
<van-button type="danger" round size="small" @click="passHandle" v-no-more-click="1000">通过{{passNum}}</van-button> <van-button type="danger" round size="small" @click="passHandle" v-no-more-click="1000">通过{{passNum}}</van-button>
<van-button class="ml10 mr10" plain type="danger" round size="small" @click="refuseHandle" v-no-more-click="1000">拒绝{{refuseNum}}</van-button> <van-button class="ml10 mr10" plain type="danger" round size="small" @click="refuseHandle" v-no-more-click="1000">拒绝{{refuseNum}}</van-button>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
@@ -411,4 +413,14 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
vertical-align: middle; vertical-align: middle;
} }
.box{
height: 100vh;
overflow: hidden;
}
.section{
height: 100%;
overflow-x: hidden;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
</style> </style>