工单 告警 报事 修改
This commit is contained in:
@@ -16,29 +16,37 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 列表区 -->
|
||||
<view class="oa-list">
|
||||
<view v-for="(item, idx) in list" :key="idx" class="oa-card" @click="goToDetail(item)">
|
||||
<view class="card-row">
|
||||
<view class="card-type">{{ item.type }}</view>
|
||||
<view class="card-status-tag" :class="item.statusClass">{{ item.status }}</view>
|
||||
</view>
|
||||
<view class="card-info">
|
||||
<view class="card-leave-type">请假类型:<text class="card-leave-type">{{ item.leaveType }}</text></view>
|
||||
<view class="card-leave-type">
|
||||
<text>开始时间:{{ item.startTime }}</text>
|
||||
<view class="oa-list-container">
|
||||
<scroll-view
|
||||
v-for="(tab, idx) in tabs"
|
||||
:key="idx"
|
||||
v-show="idx === activeTab"
|
||||
class="oa-list-scroll"
|
||||
scroll-y
|
||||
:refresher-enabled="false">
|
||||
<view v-for="(item, index) in tabData[idx]" :key="index" class="oa-card" @click="goToDetail(item)">
|
||||
<view class="card-row">
|
||||
<view class="card-type">{{ item.type }}</view>
|
||||
<view class="card-status-tag" :class="item.statusClass">{{ item.status }}</view>
|
||||
</view>
|
||||
<view class="card-leave-type">
|
||||
<text>结束时间:{{ item.endTime }}</text>
|
||||
<view class="card-info">
|
||||
<view class="card-leave-type">请假类型:<text class="card-leave-type">{{ item.leaveType }}</text></view>
|
||||
<view class="card-leave-type">
|
||||
<text>开始时间:{{ item.startTime }}</text>
|
||||
</view>
|
||||
<view class="card-leave-type">
|
||||
<text>结束时间:{{ item.endTime }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-footer">
|
||||
<view class="card-user">
|
||||
<view class="user-avatar" :style="{backgroundColor: item.avatarColor}">{{ item.avatarText }}</view>
|
||||
<text class="user-name">{{ item.userName }}</text>
|
||||
</view>
|
||||
<text class="card-datetime">{{ item.dateTime }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="card-footer">
|
||||
<view class="card-user">
|
||||
<view class="user-avatar" :style="{backgroundColor: item.avatarColor}">{{ item.avatarText }}</view>
|
||||
<text class="user-name">{{ item.userName }}</text>
|
||||
</view>
|
||||
<text class="card-datetime">{{ item.dateTime }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -64,7 +72,7 @@
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.loadTabData(this.activeTab); // 初始化加载当前tab数据
|
||||
this.loadAllTabsData(); // 预加载所有标签页数据
|
||||
},
|
||||
methods: {
|
||||
goBack() {
|
||||
@@ -78,9 +86,12 @@
|
||||
},
|
||||
async changeTab(idx) {
|
||||
this.activeTab = idx;
|
||||
// 移除切换标签时的加载逻辑,避免重复调用接口
|
||||
/*
|
||||
if (!this.tabLoaded[idx]) {
|
||||
await this.loadTabData(idx);
|
||||
}
|
||||
*/
|
||||
},
|
||||
async loadTabData(idx) {
|
||||
this.loading = true;
|
||||
@@ -221,6 +232,19 @@
|
||||
this.$set(this.tabData, idx, data);
|
||||
this.$set(this.tabLoaded, idx, true);
|
||||
this.loading = false;
|
||||
},
|
||||
|
||||
// 添加预加载所有标签页数据的方法
|
||||
async loadAllTabsData() {
|
||||
// 并行加载所有标签页数据,提高加载速度
|
||||
const loadPromises = [0, 1, 2].map((index) => {
|
||||
return this.loadTabData(index);
|
||||
});
|
||||
|
||||
await Promise.all(loadPromises);
|
||||
|
||||
// 标记所有标签页已加载
|
||||
this.tabLoaded = [true, true, true];
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -232,6 +256,7 @@
|
||||
background: #f7f7f7;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
}
|
||||
.oa-back {
|
||||
position: absolute;
|
||||
@@ -248,6 +273,7 @@
|
||||
.oa-search {
|
||||
background: #fff;
|
||||
padding: 20rpx 30rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
@@ -304,6 +330,24 @@
|
||||
margin: 0 auto;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.oa-list-container {
|
||||
flex: 1;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.oa-list-scroll {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 0 35rpx;
|
||||
overflow-y: auto;
|
||||
padding-bottom: 50rpx;
|
||||
height: calc(100vh - 80rpx - 32rpx - 150rpx); /* 减去顶部区域高度 */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.oa-list {
|
||||
margin: 25rpx 0 0 0;
|
||||
|
Reference in New Issue
Block a user