移动端V1.0
This commit is contained in:
425
pages/Approval/index.vue
Normal file
425
pages/Approval/index.vue
Normal file
@@ -0,0 +1,425 @@
|
||||
<template>
|
||||
<view class="approval">
|
||||
<!-- 选项卡切换 -->
|
||||
<view class="tab-bar">
|
||||
<view v-for="(tab, index) in tabs" :key="index" class="tab-item" :class="{ active: currentTab == index }"
|
||||
@tap="handleChange(index)">
|
||||
{{ tab }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="content" v-if="processes.length!==0">
|
||||
<view class="list">
|
||||
<view class="item" v-for="(process,index) in processes" :key="index">
|
||||
<view class="top">
|
||||
<view>
|
||||
流程名称: {{process.procDefName}}
|
||||
</view>
|
||||
<view>
|
||||
当前节点: {{process.taskName}}
|
||||
</view>
|
||||
<view>
|
||||
<text v-if="currentTab==0">
|
||||
办理人: {{process.assigneeName}}
|
||||
<text class="dept">{{process.assigneeDeptName}}</text>
|
||||
</text>
|
||||
<text v-else>
|
||||
流程发起人: {{process.startUserName}}
|
||||
<text class="dept">{{process.startDeptName}}</text>
|
||||
</text>
|
||||
</view>
|
||||
<view>
|
||||
流程状态: <text
|
||||
:class="process.finishTime==null?'proceed-status':'finish-status'">{{process.finishTime==null?'进行中':'已完成'}}</text>
|
||||
</view>
|
||||
<view>
|
||||
提交时间: {{process.createTime}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<button class="primary" @click="toDetails(process)"
|
||||
v-show="currentTab==0||currentTab==2">详情</button>
|
||||
<button class="warn" v-if="currentTab==1" @tap="toDetails(process)">处理任务</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="loading-more" v-if="currentPage<totalPages">
|
||||
<uni-load-more status="loading" />
|
||||
</view>
|
||||
<view class="loading-more" v-else>
|
||||
没有更多数据了~~~
|
||||
</view>
|
||||
</view>
|
||||
<view class="empty" v-else-if="processes.length==0&&topLoading==false">
|
||||
<image src="@/static/empty.png" mode="widthFix"></image>
|
||||
暂时没有数据
|
||||
</view>
|
||||
<view class="loading-more-top" v-if="topLoading">
|
||||
<uni-load-more style="padding-top: 90px;" status="loading" />
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
myProcess,
|
||||
todoList,
|
||||
finishedList,
|
||||
stopProcess
|
||||
} from "@/api/task.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
currentTab: 0, // 默认选中的标签索引
|
||||
tabs: ['我发起的', '待办任务', '已办任务'], // 标签列表
|
||||
processes: [],
|
||||
totalPages: 0,
|
||||
currentPage: 1,
|
||||
loading: false, // 加载状态标志
|
||||
topLoading: true,
|
||||
role: uni.getStorageSync("roles")
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.tab) {
|
||||
this.currentTab = option.tab;
|
||||
}
|
||||
this.getList();
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (this.loading) {
|
||||
return;
|
||||
}
|
||||
const scrollTop = e.scrollTop;
|
||||
let windowHeight;
|
||||
if (uni.getSystemInfoSync) {
|
||||
windowHeight = uni.getSystemInfoSync().windowHeight;
|
||||
} else {
|
||||
windowHeight = window.innerHeight;
|
||||
}
|
||||
let scrollHeight;
|
||||
if (uni.getSystemInfoSync) {
|
||||
scrollHeight = windowHeight * 2;
|
||||
} else {
|
||||
scrollHeight = Math.max(
|
||||
document.body.scrollHeight,
|
||||
document.documentElement.scrollHeight,
|
||||
document.documentElement.offsetHeight
|
||||
);
|
||||
}
|
||||
if (scrollHeight - scrollTop - windowHeight <= 0) {
|
||||
if (this.currentPage == this.totalPages) {
|
||||
|
||||
} else {
|
||||
this.currentPage++;
|
||||
this.getList();
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//销假
|
||||
toComplete(procInsId, taskId) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/applyleave/cancellationLeave?procInsId=" + procInsId + "&taskId=" + taskId
|
||||
})
|
||||
},
|
||||
// 标签切换时触发
|
||||
handleChange(index) {
|
||||
if (this.topLoading) return; // 如果正在加载数据，则不执行任何操作
|
||||
this.processes = [];
|
||||
this.currentTab = index;
|
||||
this.currentPage = 1;
|
||||
this.topLoading = true;
|
||||
this.getList();
|
||||
},
|
||||
getList() {
|
||||
this.loading = true;
|
||||
let sdata = {
|
||||
pageNum: this.currentPage,
|
||||
pageSize: 10
|
||||
};
|
||||
console.log(this.processes);
|
||||
if (this.currentTab == 0) {
|
||||
myProcess(sdata).then(res => {
|
||||
if (this.currentPage == 1) {
|
||||
this.processes = res.data.records; // 如果是第一页，直接显示新数据
|
||||
} else {
|
||||
this.processes = this.processes.concat(res.data.records); // 否则追加新数据到列表中
|
||||
}
|
||||
// this.processes = this.processes.concat(res.data.records);
|
||||
this.totalPages = res.data.pages;
|
||||
this.loading = false;
|
||||
this.topLoading = false;
|
||||
})
|
||||
} else if (this.currentTab == 1) {
|
||||
console.log(1);
|
||||
todoList(sdata).then(res => {
|
||||
// this.processes = res.data.records
|
||||
// this.processes = this.processes.concat(res.data.records);
|
||||
if (this.currentPage == 1) {
|
||||
this.processes = res.data.records; // 如果是第一页，直接显示新数据
|
||||
} else {
|
||||
this.processes = this.processes.concat(res.data.records); // 否则追加新数据到列表中
|
||||
}
|
||||
this.totalPages = res.data.pages;
|
||||
this.loading = false;
|
||||
this.topLoading = false;
|
||||
})
|
||||
} else {
|
||||
console.log(2);
|
||||
finishedList(sdata).then(res => {
|
||||
// this.processes = res.data.records;
|
||||
// this.processes = this.processes.concat(res.data.records);
|
||||
if (this.currentPage == 1) {
|
||||
this.processes = res.data.records; // 如果是第一页，直接显示新数据
|
||||
} else {
|
||||
this.processes = this.processes.concat(res.data.records); // 否则追加新数据到列表中
|
||||
}
|
||||
this.totalPages = res.data.pages;
|
||||
this.loading = false;
|
||||
this.topLoading = false;
|
||||
})
|
||||
}
|
||||
},
|
||||
cancelApply(procInsId) {
|
||||
let sdata = {
|
||||
instanceId: procInsId
|
||||
}
|
||||
uni.showModal({
|
||||
confirmText: "确定",
|
||||
cancelText: "放弃",
|
||||
confirmColor: "#aa0000",
|
||||
title: "确定取消吗?",
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
stopProcess(sdata).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '取消成功',
|
||||
duration: 2000,
|
||||
success: res => {
|
||||
this.getList();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
toDetails(process) {
|
||||
let query = {
|
||||
procInsId: process.procInsId,
|
||||
executionId: process.executionId,
|
||||
deployId: process.deployId,
|
||||
taskId: process.taskId,
|
||||
taskName: process.taskName,
|
||||
startUser: process.startUserName + '-' + process.startDeptName,
|
||||
category: process.category,
|
||||
tag: this.currentTab
|
||||
}
|
||||
console.log(process);
|
||||
//休学申请
|
||||
if (process.category == 'quitSchool') {
|
||||
uni.navigateTo({
|
||||
url: `/pages/Approval/handleTask/rtStuQuitSchool/detail?query=${JSON.stringify(query)}`
|
||||
})
|
||||
}
|
||||
//退学申请
|
||||
else if (process.category == 'dropOut') {
|
||||
uni.navigateTo({
|
||||
url: `/pages/Approval/handleTask/rtStuDropOutSchool/detail?query=${JSON.stringify(query)}`
|
||||
})
|
||||
}
|
||||
// 给予退学申请
|
||||
else if (process.category == 'disqualification') {
|
||||
uni.navigateTo({
|
||||
url: `/pages/Approval/handleTask/disqualifiCationIndex/detail?query=${JSON.stringify(query)}`,
|
||||
})
|
||||
}
|
||||
//复学申请
|
||||
else if (process.category == 'reentry') {
|
||||
console.log(this.currentTab);
|
||||
uni.navigateTo({
|
||||
url: `/pages/Approval/handleTask/rtStuReentrySchool/detail?query=${JSON.stringify(query)}`,
|
||||
})
|
||||
}
|
||||
else if (process.category == 'leave' && process.taskName == '提交请假申请'&&this.currentTab==1) {
|
||||
console.log(this.currentTab);
|
||||
uni.navigateTo({
|
||||
url: `/pages/applyleave/editLeave?id=${process.procInsId}&type=task&taskId=${process.taskId}`,
|
||||
})
|
||||
}
|
||||
else {
|
||||
uni.navigateTo({
|
||||
url: `/pages/details/details?query=${JSON.stringify(query)}`,
|
||||
})
|
||||
}
|
||||
// if (this.currentTab == 0 || this.currentTab == 2) {
|
||||
|
||||
// } else {
|
||||
// if (process.category == 'quitSchool') {
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/Approval/handleTask/rtStuQuitSchool/detail??query=${JSON.stringify(query)}`
|
||||
// })
|
||||
// return;
|
||||
// } else if (process.category == 'dropOut') {
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/Approval/handleTask/rtStuDropOutSchool/detail??query=${JSON.stringify(query)}`
|
||||
// })
|
||||
// return;
|
||||
// }
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/details/details?query=${JSON.stringify(query)}`,
|
||||
// })
|
||||
// }
|
||||
},
|
||||
editLeave(procInsId, taskId) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/applyleave/editLeave?id=" + procInsId + "&type=task" + "&taskId=" + taskId
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.loading-more-top {
|
||||
/* #ifdef MP-WEIXIN */
|
||||
padding-top: 80px;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.approval {
|
||||
.tab-bar {
|
||||
position: fixed;
|
||||
z-index: 999;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
background-color: #ffffff;
|
||||
padding: 10px 10px;
|
||||
background-color: white;
|
||||
|
||||
.tab-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
padding: 10px;
|
||||
|
||||
&.active {
|
||||
color: #007aff;
|
||||
border-bottom: 2px solid #007aff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding-top: 200rpx;
|
||||
color: #9E9E9E;
|
||||
font-size: 36rpx;
|
||||
|
||||
image {
|
||||
width: 250rpx;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
padding-top: 58px;
|
||||
|
||||
.list {
|
||||
.item {
|
||||
padding: 20px 10px;
|
||||
border-bottom: 1px solid #EDEDED;
|
||||
|
||||
.top {
|
||||
view {
|
||||
margin-bottom: 10px;
|
||||
|
||||
.dept {
|
||||
background-color: #f4f4f5;
|
||||
padding: 3px;
|
||||
border-radius: 4px;
|
||||
color: #909399;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.proceed-status {
|
||||
background-color: #1890ff;
|
||||
color: white;
|
||||
padding: 2px 3px;
|
||||
border-radius: 5px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.finish-status {
|
||||
background-color: #4CD964;
|
||||
color: white;
|
||||
padding: 2px 3px;
|
||||
border-radius: 5px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
view:first-child {
|
||||
font-size: 40rpx;
|
||||
color: black;
|
||||
}
|
||||
|
||||
view:not(:first-child) {
|
||||
color: #555555;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 25px;
|
||||
|
||||
button {
|
||||
margin: 0;
|
||||
background-color: transparent;
|
||||
margin-right: 10px;
|
||||
padding: 0px 10px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 28rpx;
|
||||
|
||||
&.primary {
|
||||
border: 1px solid #007aff;
|
||||
color: #007aff;
|
||||
}
|
||||
|
||||
&.warn {
|
||||
border: 1px solid #ff0000;
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
&.success {
|
||||
border: 1px solid #4CD964;
|
||||
color: #4CD964;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.loading-more {
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user