<template> <div class="water-analysis-page"> <div class="top"> <el-form ref="ruleForm" inline :model="tableData" v-show="showSearch"> <el-form-item label="项目名称:" prop="projectName"> <el-input clearable style="width: 240px" v-model="tableData.projectName" placeholder="请输入项目名称" ></el-input> </el-form-item> <!-- <el-form-item label="整改发起时间:" prop="abarbeitungStartTime"> <el-date-picker v-model="tableData.abarbeitungStartTime" type="daterange" unlink-panels range-separator="至" start-placeholder="开始时间:" end-placeholder="结束时间" /> </el-form-item> --> <el-form-item label="部门:" prop="chargeDepartment"> <el-input clearable v-model="tableData.chargeDepartment" style="width: 220px" placeholder="请输入部门" ></el-input> </el-form-item> <el-form-item label="方案名称:" prop="scenarioName"> <el-input clearable v-model="tableData.scenarioName" style="width: 220px" placeholder="请输入方案名称" ></el-input> </el-form-item> <el-form-item label="审核状态:"> <el-select v-model="tableData.status" placeholder="请选择审核状态" clearable > <el-option v-for="dict in dangerous_status" :key="dict.value" :label="dict.label" :value="dict.value" /> </el-select> </el-form-item> <el-form-item label="编制时间:" prop="compilationEndTime"> <el-date-picker v-model="tableData.timer" type="daterange" unlink-panels style="width: 220px" range-separator="至" start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" /> </el-form-item> <el-form-item> <el-button type="primary" icon="Search" @click="searchForm"> 查询</el-button > <el-button icon="Refresh" @click="resetQuery">重置</el-button> </el-form-item> </el-form> <el-row :gutter="10" class="mb8"> <el-col :span="1.5"> <el-button type="primary" plain icon="Plus" @click="onCheck('add')" v-hasPermi="['system:post:add']" >新增</el-button > </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="searchForm" ></right-toolbar> </el-row> </div> <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" style="margin-top: -10px" type="border-card" > <el-tab-pane label="待办列表" name="todo"> </el-tab-pane> <el-tab-pane label="已办列表" name="done"> </el-tab-pane> <el-tab-pane label="我的" name="main"> </el-tab-pane> <todoDon :key="todoDonKey" :todoList="todoList" :tableData="tableData" :getInfoList="getInfoList" ref="todoDonRef" > <template #pagination> <pagination v-show="todoList.total > 0" :total="todoList.total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination=" getInfoList({ pageNum: queryParams.pageNum, pageSize: queryParams.pageSize, queryScope: todoList.queryScope, }) " /> </template> </todoDon> </el-tabs> <el-dialog v-model="visible" title="危大工程审批新增" :modal-append-to-body="false" :close-on-click-modal="false" width="68%" > <tableDalgo ref="tableDalgoRef" :typeList="typeList" @onModalClose="onModalClose" ></tableDalgo> <template #footer> <div class="dialog-footer"> <el-button @click="open2" type="primary">保 存</el-button> <el-button @click="submitClict" type="success">提 交</el-button> <el-button @click="closed">关闭</el-button> </div> </template> </el-dialog> </div> <!-- 查看详情弹框 --> </template> <script setup> import { reactive } from "vue"; import tableDalgo from "./engineeringApprovalComponents/tableDalgo.vue"; import todoDon from "./engineeringApprovalComponents/todoDon.vue"; import { getInfo, getInfoMamin } from "@/api/engineeringApproval"; const { proxy } = getCurrentInstance(); const { project_operation_pattern, dangerous_status } = proxy.useDict( "project_operation_pattern", "dangerous_status" ); const todoDonRef = ref(null); let typeList = ref({}); const showSearch = ref(true); const activeName = ref("todo"); let visible = ref(false); const todoDonKey = ref(0); const todoList = ref([]); const tableDalgoRef = ref(); //动态组件 let tableData = ref({ pageNum: 1, pageSize: 10, queryScope: "todo" }); const queryParams=ref({ pageNum: 1, pageSize: 10}) //切换table const handleClick = ({ props: { name } }, event) => { tableData.value.queryScope = name; getInfoList(tableData.value); }; //搜索 const searchForm = () => { if (tableData.value?.timer?.length > 0) { tableData.value.compilationStartTime = tableData.value.timer[0]; tableData.value.compilationEndTime = tableData.value.timer[1]; } getInfoList(tableData.value); }; // 新增 const onCheck = (v) => { typeList.value.type = v; visible.value = true; nextTick(()=> { tableDalgoRef.value.resetFiled(); }) }; //关闭 function onModalClose() { visible.value = false; getInfoList(tableData.value); } function open2() { tableDalgoRef.value.submit(); } //新增提交 function submitClict() { tableDalgoRef.value.submit(6); } function closed() { tableDalgoRef.value.closed(); } const getInfoList = async (prams) => { console.log("pramsprams", prams) if (prams.queryScope == "main") { let { data, total } = await getInfoMamin(prams); todoList.value = data; todoList.value.total = total; todoList.value.queryScope = prams.queryScope; } else { let { data, total } = await getInfo(prams); todoList.value = data; todoList.value.total = total; todoList.value.queryScope = prams.queryScope; } todoDonKey.value++; }; /** 重置按钮操作 */ function resetQuery() { tableData.value = {queryScope: tableData.value.queryScope, pageNum: 1, pageSize: 10,}; getInfoList(tableData.value); } onMounted(() => { getInfoList(tableData.value); }); </script> <style lang="scss" scoped> .water-analysis-page { padding: 20px; height: 90vh; .top { margin-bottom: 15px; } } ::v-deep .el-dialog__body { background-color: #eef1fb; height: 700px; overflow: auto; } </style>