TALL-MUI-4/pages/checkerList/checkerList.vue

<template>
  <theme class="pt-1 h-full">
    <view class="h-full overflow-y-scroll bg-white mx-5 my-2 rounded-md p-3 text-gray-400">
      <view v-for="item in checkerList" class="flex justify-between">
        <view>
          <view class="pb-2 text-gray-800">
            {{ item.checkerName }}
          </view>
          <view class="pb-1">
            {{ item.remark }}
          </view>
          <view class="pb-2" v-if="item.checkTime > 0">
            {{ dayjs(+item.checkTime).format('MM-DD HH:mm') }}
          </view>
        </view>
        <view>
          <view>{{ item.status === 1 ? '已通过' : '已驳回' }}</view>
          <view v-if="item.score > 0">
            <u-circle-progress active-color="#FA8C16" :percent="item.score" width="90" border-width="7" class="mt-2">
              <view class="u-progress-content">
                <view class="progress-dot text-white text-center">{{ item.score }}</view>
              </view>
            </u-circle-progress>
          </view>
        </view>
      </view>
    </view>
  </theme>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import dayjs from 'dayjs';

const checkerList = ref([]);

onLoad(options => {
  (async function getQueryCheckLog() {
    try {
      const param = { deliverRecordId: options.deliverRecordId };
      const data = await uni.$u.api.queryCheckLog(param);
      checkerList.value = data;
    } catch (error) {
      console.log('error: ', error);
      uni.$ui.showToast('获取检查交付物历史失败');
    }
  }());
});
</script>

<style lang="scss"></style>