<template> <div class="water-analysis-page"> <div class="top"> <el-form ref="ruleForm" inline :model="tableData" v-show="showSearch"> <el-form-item v-for="i in queryClouns" :label="i.label" :prop="i.prop"> <el-select v-if="i.prop == 'fundSource'" clearable v-model="tableData.fundSource" :placeholder="i.placeholder" > <el-option v-for="dict in fund_source" :key="dict.stCode" :label="dict.label" :value="dict.value" ></el-option> </el-select> <el-date-picker v-else-if="i.prop == 'quoteDate'" :placeholder="i.placeholder" value-format="YYYY-MM-DD" clearable v-model="tableData.quoteDate" type="date" align="right" ></el-date-picker> <el-input v-else style="width: 240px" clearable v-model="tableData[i.prop]" :placeholder="i.placeholder" ></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)" >新增</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="项目概算新增" :modal-append-to-body="false" :close-on-click-modal="false" width="51%" > <tableDalgo :key="isFlag" ref="tableDalgoRef" :typeList="typeList" @onModalClose="onModalClose" ></tableDalgo> <template #footer> <div class="dialog-footer"> <el-button @click="open2" type="primary">保 存</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 emgBox from "@/utils/ElMessageBox"; const { proxy } = getCurrentInstance(); const { fund_source } = proxy.useDict("fund_source"); const todoDonRef = ref(null); const ruleForm = ref(null); let typeList = ref({}); const tableDalgoRef = ref(); const showSearch = ref(true); let visible = ref(false); let isFlag = ref(1); const queryClouns = [ { label: "项目名称:", prop: "projectName", placeholder: "请输入项目名称" }, { label: "资金来源:", prop: "fundSource", placeholder: "请选择项资金来源", }, { label: "联系人:", prop: "contactUser", placeholder: "请输入联系人", }, { label: "技术人员:", prop: "techUser", placeholder: "请输入技术人员" }, { label: "报价日期:", prop: "quoteDate", placeholder: "请选择报价日期" }, ]; //动态组件 let dataForm = reactive({ tableData: {}, tableDateTwo: "", tableLoading: true, }); let { tableData } = toRefs(dataForm); //获取列表数据 //搜索 const searchForm = () => { todoDonRef.value.search(tableData.value); }; //重置 const resectClcik = () => { ruleForm.value.resetFields(); todoDonRef.value.search(tableData.value); }; // 新增 const onCheck = (ty) => { visible.value = true; typeList.value.type = ty; nextTick(() => { tableDalgoRef.value.resetFiled(); }); }; //保存 function open2() { tableDalgoRef.value.submit(); } function onModalClose() { visible.value = false; todoDonRef.value.search(tableData.value); } onMounted(() => {}); </script> <style lang="scss" scoped> .water-analysis-page { padding: 20px; overflow-y: hidden; } :deep(.el-dialog__body) { background-color: #eef1fb; height: 520px; overflow: auto; } </style>