yinchuan-community-all/mini-program/garden-wxapp/pages/index/access-record/comps/card.vue

<template>
    <view class="history">
        <u-time-line>
            <u-time-line-item nodeTop="2" v-for="(item,index) in list" :key="index">
                <template v-slot:node>
                    <view class="u-node bg-white">
                        <u-icon name="clock-fill" color="#5064eb" :size="28"></u-icon>
                    </view>
                </template>
                <template v-slot:content>
                    <view>
                        <view class="">{{item.openTime}}</view>
                        <view style="width: 636rpx;">
                            <view class="content">
                                <view class="flex justify-between">
                                    <view class="">
                                        <view class="nav-title">
                                            <text class="">人员姓名：</text>
                                            <text class="">{{item.userName}}</text>
                                        </view>
                                        <view v-if="item.temperature" class="nav-title">
                                            <text>测量体温：</text>
                                            <text class="text-red">{{item.temperature}} ℃</text>
                                        </view>
                                        <view class="nav-title">
                                            <text>所属企业：</text>
                                            <text>{{item.enterpriseName}}</text>
                                        </view>
                                        <!-- <view class="nav-title">
                                            <text >开门地址：</text>
                                            <text>{{item.deviceAddress}}</text>
                                        </view> -->
                                    </view>
                                    <view class="" v-if="item.faceUrl">
                                        <image @click="$util.preview(item.faceUrl)" :src="item.faceUrl"
                                               style="width: 110rpx;height: 110rpx;border-radius: 10rpx;"
                                               mode=""></image>
                                    </view>
                                </view>
                                <view class="nav-title">
                                    <text>开门方式：</text>
                                    <text v-if="item.openType==1">人脸识别开门</text>
                                    <text v-if="item.openType==2">小程序一键开门</text>
                                </view>
                            </view>

                        </view>
                    </view>
                </template>
            </u-time-line-item>
        </u-time-line>
    </view>
</template>

<script>
    export default {
        props: {
            list: {
                type: Array
            }
        },
        data() {
            return {};
        },
        onLoad() {

        },
        methods: {}
    };
</script>

<style lang="scss" scoped>
    page {
        background-color: #FFFFFF;
    }

    .nav-title {
        font-size: 28 upx;
        font-weight: 300;
        padding-top: 20 rpx;
    }

    .history {
        box-sizing: border-box;
        padding: 40 rpx 20 rpx 20 rpx 50 rpx;
    }

    .content {
        box-shadow: 0 8 rpx 10 rpx rgba(234, 234, 234, 0.5), 8 rpx 0 rpx 10 rpx rgba(234, 234, 234, .5), -8rpx 0 rpx 10 rpx rgba(234, 234, 234, .5);
        background-color: #FFFFFF;
        padding: 20 rpx;
        border-radius: 10 rpx;
        margin: 20 rpx 0;
    }
</style>