<template> <div class="water-analysis-page" :key="isFlag"> <div class="top"> <el-form label-width="auto" ref="ruleForm" inline :model="tableData" v-show="showSearch" > <el-form-item label="项目名称:" prop="projectName"> <el-input clearable v-model="tableData.projectName" placeholder="请输入项目名称" style="width: 240px" ></el-input> </el-form-item> <el-form-item> <el-button type="primary" icon="Search" @click="searchForm"> 查询</el-button > <el-button icon="Refresh" @click="resectClcik"> 重置</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(4)" v-hasPermi="['system:post:add']" >新增</el-button > </el-col> <right-toolbar v-model:showSearch="showSearch" @queryTable="searchForm" ></right-toolbar> </el-row> </div> <todoDon ref="todoDonRef"></todoDon> <el-dialog v-model="visible" title="Gis配置新增" :modal-append-to-body="false" :close-on-click-modal="false" width="70%" > <tableDalgo v-if="visible" ref="tableDalgoRef" :typeList="typeList" @onModalClose="onModalClose" ></tableDalgo> <template #footer> <div class="dialog-footer"> <el-button type="primary" @click="submit">保存</el-button> <el-button @click="visible = false">关闭</el-button> </div> </template> </el-dialog> </div> </template> <script setup> import tableDalgo from "./tableDalgo.vue"; import todoDon from "./todoDon.vue"; import { downloadBlob, formatDate, formatMonths } from "@/utils/projectTable"; import emgBox from "@/utils/ElMessageBox"; const todoDonRef = ref(null); const showList = ref([ { stName: "是", stCode: 0 }, { stName: "否", stCode: 1 }, ]); const ruleForm = ref(null); let typeList = ref({}); const { proxy } = getCurrentInstance(); const { ownership } = proxy.useDict("ownership"); const showSearch = ref(true); import { reactive } from "vue"; const activeName = ref("first"); const tableDalgoRef = ref(); let visible = ref(false); let isFlag = ref(1); //动态组件 let dataForm = reactive({ date: formatMonths(new Date()), tableData: { pageNum: 1, pageSize: 10 }, tableDateTwo: "", tableLoading: true, }); let { tableData } = toRefs(dataForm); //获取列表数据 //切换table const handleClick = ({ props }, event) => { tableData.value.name = props.name; todoDonRef.value.search(tableData.value); }; //搜索 const searchForm = () => { todoDonRef.value.search(tableData.value); }; //重置 function resectClcik() { tableData.value={pageNum: 1,pageSize: 10} todoDonRef.value.search(tableData.value); }; // 查看上报数据 const onCheck = (ty) => { // typeList.value.type = ty visible.value = true; nextTick(()=>{ tableDalgoRef.value.desertFilds() }) }; function onModalClose() { visible.value = false; isFlag.value++; } function submit() { tableDalgoRef.value.submit(); } onMounted(() => { // getTableData(Date.parse(date.value)); }); </script> <style lang="scss" scoped> .water-analysis-page { padding: 20px; height: 90vh; } :deep(.el-dialog__body) { background-color: #eef1fb; height: 750px; overflow: auto; } </style>