|
@@ -1,5 +1,8 @@
|
|
|
<template>
|
|
|
<div class="log-calendar">
|
|
|
+ <div class="loading-container" v-if="loading">
|
|
|
+ <van-loading size="24px" />
|
|
|
+ </div>
|
|
|
<van-calendar
|
|
|
title="手机端仅能查看近三个月内填报情况"
|
|
|
:show-title="true"
|
|
@@ -11,6 +14,7 @@
|
|
|
:formatter="formatter"
|
|
|
@confirm="jumpDetail"
|
|
|
:show-subtitle="false"
|
|
|
+ v-if="!loading"
|
|
|
/>
|
|
|
</div>
|
|
|
</template>
|
|
@@ -20,6 +24,9 @@ import { http } from "../http";
|
|
|
/**
|
|
|
* @description 日报详情
|
|
|
*/
|
|
|
+
|
|
|
+const loading = ref(false);
|
|
|
+
|
|
|
// 限制日期范围
|
|
|
const minDate = moment().subtract(2, "months").startOf("month").toDate();
|
|
|
const maxDate = moment().toDate();
|
|
@@ -27,6 +34,7 @@ const maxDate = moment().toDate();
|
|
|
const logObj = ref<any>({});
|
|
|
const dayOfWorkObj = ref<any>({});
|
|
|
onMounted(async () => {
|
|
|
+ loading.value = true;
|
|
|
const logList = await http.getLogList("daily");
|
|
|
|
|
|
logList.map((item: any) => {
|
|
@@ -45,6 +53,7 @@ onMounted(async () => {
|
|
|
isWorkday: item.isworkday === 1 ? true : false,
|
|
|
};
|
|
|
});
|
|
|
+ loading.value = false;
|
|
|
});
|
|
|
// 格式化日历
|
|
|
const formatter = (day: any) => {
|
|
@@ -118,4 +127,11 @@ const jumpDetail = (day: any) => {
|
|
|
:deep(.not-fill) {
|
|
|
color: red;
|
|
|
}
|
|
|
+.loading-container {
|
|
|
+ width: 100%;
|
|
|
+ height: 400px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
</style>
|