From 2b4328392746fc59f5edf98fed629f8db2804e18 Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期三, 27 七月 2022 09:29:23 +0800 Subject: [PATCH] 对接 --- src/components/DailogSearch/DailogSearch.vue | 150 +++++++++++++++++++++++++++++-------------------- 1 files changed, 89 insertions(+), 61 deletions(-) diff --git a/src/components/DailogSearch/DailogSearch.vue b/src/components/DailogSearch/DailogSearch.vue index 562ee42..b1fa129 100644 --- a/src/components/DailogSearch/DailogSearch.vue +++ b/src/components/DailogSearch/DailogSearch.vue @@ -7,51 +7,49 @@ <el-row> <el-col :span="6"> <el-form-item size="default"> - <el-input v-model="ruleForm.pass" placeholder="安全目标指标" /> + <el-input v-model="ruleForm.searchParams.qName" placeholder="安全目标指标" /> </el-form-item> </el-col> <el-col :span="6" :offset="1"> <el-form-item size="default"> - <el-input v-model="ruleForm.checkPass" placeholder="目标指标编号" /> + <el-input v-model="ruleForm.searchParams.indexNum" placeholder="目标指标编号" /> </el-form-item> </el-col> <el-col :span="6" :offset="1"> <el-form-item> - <el-button type="primary" @click="submitForm(ruleFormRef)">查询</el-button> - <el-button @click="resetForm(ruleFormRef)">重置</el-button> + <el-button type="primary" @click="listApi">查询</el-button> + <el-button @click="resetForm">重置</el-button> </el-form-item> </el-col> </el-row> </el-form> - <el-button size="default" :icon="Delete">清除选择</el-button> - <el-table :data="tableData" style="width: 100%; margin-top: 20px"> + <el-button size="default" :icon="Delete" @click="clear">清除选择</el-button> + <el-table :data="tableData" style="width: 100%; margin-top: 20px" @cell-click="radio"> <el-table-column align="center"> <template #default="scope"> - <el-radio-group v-model="radio1" @change="radio"> - <el-radio :label="scope.row.date" size="large">{{null}}</el-radio> + <el-radio-group v-model="radio1"> + <el-radio :label="scope.row.id" size="large">{{ null }}</el-radio> </el-radio-group> </template> </el-table-column> - <el-table-column align="center" prop="date" label="安全目标指标" width="180" /> - <el-table-column align="center" prop="name" label="目标指标编号" width="180" /> - <el-table-column align="center" prop="address" label="年度" /> - <el-table-column align="center" prop="address" label="指标值" /> + <el-table-column align="center" prop="qName" label="安全目标指标" width="180" /> + <el-table-column align="center" prop="indexNum" label="目标指标编号" width="180" /> + <el-table-column align="center" prop="year" label="年度" /> + <el-table-column align="center" prop="value" label="指标值" /> </el-table> <el-pagination style="padding: 20px 0; border-bottom: 1px solid #dedede" v-model:currentPage="currentPage4" v-model:page-size="pageSize4" - :page-sizes="[100, 200, 300, 400]" - :small="small" - :disabled="disabled" - :background="background" + :page-sizes="[10, 20, 30, 40]" layout="total, sizes, prev, pager, next, jumper" - :total="400" + :total="total" @size-change="handleSizeChange" @current-change="handleCurrentChange" /> </el-col> <el-col :span="7"> + <div v-if="dynamicTags[0]==''?false:true"> <el-tag v-for="tag in dynamicTags" :key="tag" @@ -61,87 +59,115 @@ :disable-transitions="false" @close="handleClose(tag)" > - {{ tag }} + {{ tag.qName }} </el-tag> + </div> </el-col> </el-row> <template #footer> <span class="dialog-footer"> <el-button @click="dialogVisible = false" size="default">关闭</el-button> - <el-button type="primary" @click="dialogVisible = false" size="default">确定</el-button> + <el-button type="primary" @click="submitForm" size="default">确定</el-button> </span> </template> </el-dialog> </template> <script lang="ts"> -import { defineComponent, reactive, ref } from 'vue'; -import { Delete,FullScreen } from '@element-plus/icons-vue'; +import { defineComponent, reactive, ref, onMounted } from 'vue'; +import { Delete, FullScreen } from '@element-plus/icons-vue'; +import { ElMessageBox, ElMessage, ElButton, ElInput, TabsPaneContext, FormInstance } from 'element-plus'; +import { goalManagementApi } from '/@/api/goalManagement'; export default defineComponent({ - setup() { + setup(props,{emit}) { const dialogVisible = ref<boolean>(false); - const openDailog = () => { + const openDailog = (type:any) => { dialogVisible.value = true; + ruleForm.searchParams.targetType=type + listApi(); }; // 搜索条件 const ruleForm = reactive({ - pass: '', - checkPass: '', + pageSize: 10, + pageIndex: 1, + searchParams: { + qName: '', ////安全目标指标 + indexNum: '', ////目标指标编号 + targetType: '', ////指标类型 1:年指标 2:月指标 + divideStatus: '', ////分解状态 1:已分解 2:未分解 + }, }); - // 表格 - const tableData = [ - { - date: '2016-05-03', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - { - date: '2016-05-02', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - { - date: '2016-05-04', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - { - date: '2016-05-01', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - ]; - const pageSize4 = ref(100); + // 下方导航与表格 + const tableData = ref([]); + const currentPage4 = ref(); + const pageSize4 = ref(); + const total = ref(); + const resetForm = () => { + ruleForm.searchParams.qName = ''; + ruleForm.searchParams.indexNum = ''; + }; + const listApi = () => { + goalManagementApi() + .getTargetMngList(ruleForm) + .then((res) => { + if (res.data.code == 200) { + tableData.value = res.data.data; + currentPage4.value = res.data.pageIndex; + pageSize4.value = res.data.pageSize; + total.value = res.data.total; + } else { + ElMessage.error(res.data.msg); + } + }); + }; + onMounted(() => { + }); + const handleSizeChange = (val: number) => { - console.log(`${val} items per page`); + // console.log(`${val} items per page`); + ruleForm.pageSize = val; + listApi(); }; const handleCurrentChange = (val: number) => { - console.log(`current page: ${val}`); + // console.log(`current page: ${val}`); + ruleForm.pageIndex = val; + listApi(); }; // 右方点击添加后显示标签 - const dynamicTags = ref(['2016-05-03']); + const dynamicTags = ref(['']); const handleClose = (tag: string) => { dynamicTags.value.splice(dynamicTags.value.indexOf(tag), 1); - radio1.value="" + radio1.value = ''; }; - const radio1=ref('2016-05-03') - const radio=(event:any)=>{ - dynamicTags.value[0]=event + const radio1 = ref(''); + const radio = (event: any) => { + dynamicTags.value[0] = event; + }; + const clear=()=>{ + dynamicTags.value=[''] + radio1.value="" } - //全屏 + //全屏 const full = ref(false); const toggleFullscreen = () => { if (full.value == false) { full.value = true; - }else{ - full.value = false; - } + } else { + full.value = false; + } }; + const submitForm=()=>{ + let obj=JSON.parse(JSON.stringify(dynamicTags.value)) + emit("backNum",obj[0]) + dialogVisible.value = false + } return { dialogVisible, openDailog, ruleForm, tableData, pageSize4, + resetForm, + listApi, handleSizeChange, handleCurrentChange, dynamicTags, @@ -151,7 +177,9 @@ full, toggleFullscreen, Delete, - FullScreen + FullScreen, + clear, + submitForm }; }, }); -- Gitblit v1.9.2