ShutongInterconnectedChemicalCloudPlatform/src/views/sysworkflow/lowcodepage/runApp/regularPage/myToDoPage.vue

<!--
@ 作者: 秦东
@ 时间: 2024-05-31 10:50:09
@ 备注: 待我处理
-->
<script lang='ts' setup>
import { gainAppTaskList } from "@/api/DesignForm/requestapi"
import { taskflowquery } from '@/api/DesignForm/type'

import LookAndOperateLogInfo from '@/views/taskplatform/taskmanagement/lookFlowInfoApp.vue'


const props = defineProps({
	pickAppMenu:{
		type:Object,
		default(){
			return {}
		}
	}
});
const loadingTd = ref(false)
const searckFormRefTd  = ref(ElForm);	//表单
const taskFlowAryTd = ref<any>([])  //记录数组
//搜索条件参数
const selectInfoTd = reactive<taskflowquery>({
	page: 1,
	pagesize: 20,
	class: 2,
	id:props.pickAppMenu.appkey
})
const totalstd = ref<number>(0)	//总共多少条记录

//初始化数据
const initData = () =>{
	selectInfoTd.page = 1;
	selectInfoTd.pagesize = 15;
	selectInfoTd.title = ""
	selectInfoTd.class = 2;
	selectInfoTd.state = 0;
}
//重置表单
const resetQueryTd = () =>{
	searckFormRefTd.value.resetFields();
	initData();
}
/**
@ 作者: 秦东
@ 时间: 2024-06-07 09:28:35
@ 功能: 加载数据
*/
const getToDoList = () =>{
	gainAppTaskList(selectInfoTd)
		.then((data) =>{
			console.log("加载数据--->",data)
			totalstd.value = data.data.total
			taskFlowAryTd.value = data.data.list
		})
}
onMounted(() =>{
	getToDoList()
})
/**
@ 作者: 秦东
@ 时间: 2024-06-17 08:13:56
@ 功能: 搜索
*/
const getToDoListTd = () =>{
	getToDoList()
}


const flowLogInfo = ref<any>()
const darwOpenOrClose = ref(false)
/**
@ 作者: 秦东
@ 时间: 2024-06-17 14:46:51
@ 功能: 查看表单详情
*/
const lookFlowInfo = (val:any,types:number) =>{
	flowLogInfo.value = val
	darwOpenOrClose.value = true
}
const searchQuery = () =>{}
</script>
<template>
	<div ref="myappbox" class="app_box">
		<LookAndOperateLogInfo v-if="darwOpenOrClose" v-model:isshow="darwOpenOrClose" :flow-log-info="flowLogInfo" :drawer-with="drawerMyWith" @getmytodolist="getToDoListTd" />
		<div class="app-container">
			<div class="search">
				<div class="titleBox">
					代办事宜 
				</div>
				<el-form ref="searckFormRefTd" :model="selectInfoTd" :inline="true">
					<el-form-item label="任务标题" prop="name">
						<el-input
							v-model="selectInfoTd.title"
							placeholder="请输入任务标题"
							clearable
							@keyup.enter="searchQuery"
						/>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="getToDoListTd()"><i-ep-search />搜索</el-button>
						<el-button @click="resetQueryTd()"><i-ep-refresh />重置</el-button>
					</el-form-item>
				</el-form> 
				                               	
			</div>
			<el-card shadow="never">
				<el-table
					v-loading="loadingTd"
					element-loading-text="Loading..."
					highlight-current-row
					:data="taskFlowAryTd"
					border
					class="table_box"
				>
					<el-table-column fixed label="标题" prop="title" width="500" />
					<el-table-column  label="创建人" prop="creater" width="150" align="center">
						<template #default="scope">
							{{ scope.row.creatorInfo.name }}（<el-text  type="info">{{ scope.row.creatorInfo.number }}</el-text>）	
						</template>
					</el-table-column>
					<el-table-column  label="发起日期" prop="startDate" align="center"  width="200" />
					<el-table-column  label="状态" prop="status"  align="center"  width="120" >
						
						<template #default="scope">
							<el-tag
								v-if="scope.row.status==1"
								class="mx-1"
								effect="plain"
								round
							>
								草稿
							</el-tag>
							<el-tag
								v-else-if="scope.row.status==2"
								type="danger"
								class="mx-1"
								effect="plain"
								round
							>
								驳回
							</el-tag>
							<el-tag
								v-else-if="scope.row.status==3"
								type="success"
								class="mx-1"
								effect="plain"
								round
							>
								审批中
							</el-tag>
							<el-tag
								v-else-if="scope.row.status==4"
								type="info"
								class="mx-1"
								effect="plain"
								round
							>
								归档
							</el-tag>
							<el-tag
								v-else
								type="info"
								class="mx-1"
								effect="plain"
								round
							>
								删除
							</el-tag>
						</template>
					</el-table-column>
					<el-table-column  label="当前节点及操作人" prop="currentStep"  >
						<template #default="scope">
							<el-text v-if="scope.row.currentNodeName" type="success">{{ scope.row.currentNodeName }}：</el-text><el-text v-for="(item,index) in scope.row.currentNodeUser" :key="index" type="warning">{{ item.name }}({{ item.number }})</el-text>
						</template>
					</el-table-column>
					<el-table-column fixed="right" align="center" label="操作" width="100" >
						<template #default="scope">
							<el-tooltip
								class="box-item"
								effect="dark"
								content="查看详情"
								placement="top-end"
							>
								<el-button type="primary" size="small" class="fa fa-eye" @click="lookFlowInfo(scope.row,2)" />
							</el-tooltip>
						</template>
					</el-table-column>
				</el-table>	
				<pagination
					v-model:total="totalstd"
					v-model:page="selectInfoTd.page"
					v-model:limit="selectInfoTd.pagesize"
					@pagination="getToDoListTd"
				/>
			
			</el-card>
		</div>
	</div>
</template>
<style  lang='scss' scoped>
.app_box{
	width:100%;
	overflow: hidden;
	overflow-y: auto;
	.search{
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.titleBox{
		font-size: 20px;
   	 	margin-top: -20px;
	}
}
.box-card {
  	width: 100%;
}
.table_box{
	width: 100%;
	height: calc(100vh - 260px);
}
</style>