crm-mobile/pages_log/favour.vue

<template>
  <view class="uni-app">
    <view class="status-bar" />
    <view class="main-container">
      <wk-nav-bar :title="navTitle" />

      <scroll-view scroll-y class="list">
        <view
          v-for="user in dataList"
          :key="user.userId"
          class="list-item">
          <view class="left">
            <wk-avatar
              :avatar="user.img"
              :name="user.realname"
              :preview="false"
              class="wk-avatar" />
          </view>
          <view class="right">
            <view class="username">
              {{ user.realname }}
            </view>
            <!-- <view class="desc">
							<view class="dept">
								销售福
							</view>
							<view class="time">
								2021-03-14 12:00
							</view>
						</view> -->
          </view>
        </view>
      </scroll-view>
    </view>
  </view>
</template>

<script>
  import { deepCopy } from '@/utils/lib.js'

  export default {
    name: 'JournalFavourList',
    data() {
      return {
        dataList: []
      }
    },
    computed: {
      navTitle() {
        return `获得${this.dataList.length}个赞`
      }
    },
    onShow() {
      this.dataList = deepCopy(getApp().globalData.cacheDataBridge || [])
      getApp().globalData.cacheDataBridge = null
      if (this.$isEmpty(this.dataList)) {
        this.$Router.navigateBack()
      }
    },
    methods: {}
  }
</script>

<style scoped lang="scss">
	.list {
		position: relative;
		width: 100%;
		height: 100%;
		background-color: white;
		overflow: hidden;
		margin-top: 15rpx;

		.list-item {
			padding: 18rpx 32rpx;
			@include left;
			.left {
				width: 90rpx;
				height: 90rpx;
				::v-deep wk-avatar, .wk-avatar {
					width: 90rpx;
					height: 90rpx;
				}
			}
			.right {
				flex: 1;
				margin-left: 20rpx;
				flex-direction: column;
				@include left;
				.username {
					width: 100%;
					font-size: $wk-font-large;
					color: $dark;
				}
				.desc {
					width: 100%;
					font-size: $wk-font-base;
					color: $light;
					@include left;
					.dept {
						flex: 1;
					}
					.time {}
				}
			}
		}
	}
</style>