123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149 |
- <template>
- <view class="card-item" @click="onOpen(dataVal)">
- <template v-if="dataVal">
- <view class="card-img lazy-falls-img">
- <u-image class="service-img" mode="widthFix" loading-icon="@/app/static/ZW/img-load.png" :src="$getImgPath(dataVal.informationThumbnail)"></u-image>
-
- <!-- <u-lazy-load threshold="500" border-radius="10" :image="$getImgPath(dataVal.informationThumbnail)"
- height="200" :index="`img_${dataVal.informationTypeId}`"></u-lazy-load> -->
- </view>
- <!-- <image :src="dataVal.informationThumbnail" mode="aspectFill"></image> -->
- <view class="card-info-box">
- <text class="card-title zw-two-row">{{dataVal.informationTitle}}</text>
- <view class="card-info">
- <!-- <image class="card-info-icon" src="../../logo.png" mode="scaleToFill"></image> -->
- <text class="card-info-name zw-one-row">{{dataVal.informationAuthor}}</text>
- <view class="card-info-nums" v-if="dataVal.browseNum || dataVal.browseNum === 0">
- <text v-if="dataVal.collectStatus" class="card-collect is-ok iconfont_yige"></text>
- <text v-else class="card-collect iconfont_yige"></text>
- <text class="card-browse">{{getNums(dataVal.browseNum)}}</text>
- </view>
- </view>
- </view>
- </template>
- </view>
- </template>
- <script>
- export default {
- name: "discovery",
- props: {
- idName: {
- type: String,
- default: "informationId"
- },
- dataVal: {
- type: Object,
- default: null
- }
- },
- data() {
- return {
- };
- },
- methods: {
- onOpen(item) {
- uni.navigateTo({
- url: `/pages/government/discoverInfo?informationId=${item[this.idName]}`
- })
- },
- getNums(num) {
- let nums = num + ''
- if (nums > 10000) {
- try {
- const w = nums.slice(0, nums.length - 4);
- const n = nums.substr(nums.length - 4);
- const s = n.slice(0, 1);
- nums = `${w}${s >= 1 ? '.' + s : ''}Íò`
- } catch {}
- }
- return nums
- }
- }
- }
- </script>
- <style lang="scss">
- .card-item {
- margin-top: 20rpx;
- // width: calc(50% - 10rpx);
- width: 100%;
- // min-height: 468rpx;
- background-color: #fff;
- border-radius: 20rpx;
- overflow: hidden;
- .card-img {
- width: 100%;
- // height: 313rpx;
- .service-img{
- width: 100%;
- }
- }
- .card-info-box {
- width: 100%;
- // height: calc(100% - 313rpx);
- height: 175rpx;
- padding: 20rpx;
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- .card-title {
- display: inline-block;
- width: 100%;
- font-size: 28rpx;
- line-height: 1.2;
- }
- }
- .card-info {
- width: 100%;
- // padding: 0 20rpx ;
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- align-items: center;
- .card-info-icon {
- width: 32rpx;
- height: 32rpx;
- }
- .card-info-name {
- flex: 1;
- font-size: 24rpx;
- font-family: Microsoft YaHei, Microsoft YaHei-Regular;
- font-weight: 400;
- color: #999999;
- }
- .card-info-nums {
- flex-shrink: 0;
- display: flex;
- align-items: center;
- .card-collect {
- font-size: 28rpx;
- }
- .is-ok {
- color: red;
- }
- .card-browse {
- padding-left: 10rpx;
- font-size: 28rpx;
- font-family: Microsoft YaHei, Microsoft YaHei-Regular;
- font-weight: 400;
- color: #999999;
- }
- }
- }
- }
- </style>
|