mkm/OfficeApp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增图片懒加载,图片未加载完成时动画显示

Browse Source
This commit is contained in:
weipengfei 2023-07-25 17:15:45 +08:00
parent 2033417bf8
commit 786b34086b
1 changed files with 32 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
components/company/company.vue
View File

@ -103,15 +103,30 @@
<block v-if="!skeleton"> <block v-if="!skeleton">
<view class="title">资质信息</view> <view class="title">资质信息</view>
<view class="image_box" style="background-color: #fff;border-radius: 7px 7px 7px 7px;"> <view class="image_box" style="background-color: #fff;border-radius: 7px 7px 7px 7px;">
<image class="bottom" @click="priview(company.qualification.business_license)" <u--image class="image" @click="priview(company.qualification.business_license)"
:src="company.qualification.business_license" v-if="company.qualification.business_license"></image> :src="company.qualification.business_license" v-if="company.qualification.business_license" :lazy-load="true">
<image class="bottom" @click="priview(company.qualification.business_licenseB)" <template v-slot:loading>
:src="company.qualification.business_licenseB" v-if="company.qualification.business_licenseB"></image> <u-loading-icon color="#333"></u-loading-icon>
<image class="top" @click="priview(company.qualification.bank_account)" </template>
:src="company.qualification.bank_account" v-if="company.qualification.bank_account"></image> </u--image>
<image class="top" @click="priview(company.qualification.bank_accountB)" <u--image class="image" @click="priview(company.qualification.business_licenseB)"
:src="company.qualification.bank_accountB" v-if="company.qualification.bank_accountB"></image> :src="company.qualification.business_licenseB" v-if="company.qualification.business_licenseB" :lazy-load="true">
<template v-slot:loading>
<u-loading-icon color="#333"></u-loading-icon>
</template>
</u--image>
<u--image class="image" @click="priview(company.qualification.bank_account)"
:src="company.qualification.bank_account" v-if="company.qualification.bank_account" :lazy-load="true">
<template v-slot:loading>
<u-loading-icon color="#333"></u-loading-icon>
</template>
</u--image>
<u--image class="image" @click="priview(company.qualification.bank_accountB)"
:src="company.qualification.bank_accountB" v-if="company.qualification.bank_accountB" :lazy-load="true">
<template v-slot:loading>
<u-loading-icon color="#333"></u-loading-icon>
</template>
</u--image>
</view> </view>
</block> </block>
</view> </view>
@ -390,13 +405,17 @@
justify-content: space-between; justify-content: space-between;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
padding: 28rpx;
image { .image {
padding-bottom: 20rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
margin-bottom: 28rpx;
image{
width: 650rpx; width: 650rpx;
height: 455rpx; height: 455rpx;
background-color: #7f7f7f;
}
} }
} }
} }