From 5a1616f169d75ece07d2d12a8edac3e5f660a920 Mon Sep 17 00:00:00 2001 From: Your Name <123456> Date: 星期四, 08 九月 2022 09:36:16 +0800 Subject: [PATCH] 合并 --- src/views/goalManagement/targetClassification/index.vue | 261 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 261 insertions(+), 0 deletions(-) diff --git a/src/views/goalManagement/targetClassification/index.vue b/src/views/goalManagement/targetClassification/index.vue index e69de29..8c59970 100644 --- a/src/views/goalManagement/targetClassification/index.vue +++ b/src/views/goalManagement/targetClassification/index.vue @@ -0,0 +1,261 @@ +<template> + <div> + <!-- <el-form :model="ruleForm" status-icon label-width="20px" class="topTitle"> + <el-row> + <el-col :span="4"> + <el-form-item> + <el-input v-model="ruleForm.searchParams.qName" size="default" placeholder="安全目标指标" /> + </el-form-item> + </el-col> + <el-col :span="4"> + <el-form-item> + <el-input v-model="ruleForm.searchParams.indexNum" size="default" placeholder="目标指标编号" /> + </el-form-item> + </el-col> + <el-col :span="16"> + <el-form-item> + <el-button type="primary" size="default" @click="listApi">查询</el-button> + <el-button size="default" @click="resetForm">重置</el-button> + </el-form-item> + </el-col> + </el-row> + </el-form> --> + <div class="minCenter"> + <div class="btns"> + <div> + <el-button size="default" type="primary" :icon="Plus" @click="openD('新建')">新建</el-button> + <el-button size="default" type="warning" :disabled="warning" :icon="EditPen" plain @click="openD('修改', deletAll[0])">修改</el-button> + <el-button size="default" type="danger" :disabled="danger" :icon="Delete" plain @click="onDeleteAll">删除</el-button> + </div> + </div> + <el-table ref="multipleTableRef" :data="tableData" @selection-change="handleSelectionChange" style="width: 100%"> + <el-table-column label="序号" align="center" type="index" width="70" /> + <el-table-column type="selection" align="center" width="55" /> + <el-table-column label="名称" align="center" property="typeName" sortable /> + <el-table-column property="memo" align="center" label="描述" sortable /> + <!-- <el-table-column property="year" label="年度" align="center" sortable show-overflow-tooltip /> + <el-table-column property="value" label="指标值" align="center" sortable show-overflow-tooltip /> --> + <el-table-column label="操作" align="center" sortable show-overflow-tooltip> + <template #default="scope"> + <el-button link type="primary" size="small" :icon="View" @click="openD('查看', scope.row.id)">查看</el-button> + <el-button link type="primary" size="small" :icon="EditPen" @click="openD('修改', scope.row.id)">修改</el-button> + <el-button link type="primary" size="small" :icon="Delete" @click="onDelete(scope.row.id)">删除</el-button> + </template> + </el-table-column> + </el-table> + <div class="pages"> + <el-pagination + v-model:currentPage="currentPage4" + v-model:page-size="pageSize4" + :page-sizes="[10, 20, 30, 40]" + layout="total, sizes, prev, pager, next, jumper" + :total="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </div> + </div> + <DailogClass ref="Show" @onAdd="add"></DailogClass> + </div> +</template> +<script lang="ts"> +import DailogClass from '/@/components/DailogClass/index.vue'; +import { ref, toRefs, reactive, onMounted, defineComponent } from 'vue'; +import { ElMessageBox, ElMessage, ElButton, ElInput, TabsPaneContext, FormInstance } from 'element-plus'; +import { Plus, Delete, Upload, Download, Refresh, View, EditPen } from '@element-plus/icons-vue'; +import { goalManagementApi } from '/@/api/goalManagement'; +export default defineComponent({ + components: { ElButton, ElInput,DailogClass }, + setup() { + // 搜索条件 + const ruleForm = reactive({ + pageSize: 10, + pageIndex: 1, + searchParams: { + typeName: '', ////分类名称 + }, + }); + // 下方导航与表格 + const tableData = ref([]); + const currentPage4 = ref(); + const pageSize4 = ref(); + const total = ref(); + // const resetForm = () => { + // ruleForm.searchParams.qName = ''; + // ruleForm.searchParams.indexNum = ''; + // listApi(); + // }; + const listApi = () => { + goalManagementApi() + .gettargetClassList(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(() => { + listApi(); + }); + + const handleSizeChange = (val: number) => { + // console.log(`${val} items per page`); + ruleForm.pageSize = val; + listApi(); + }; + const handleCurrentChange = (val: number) => { + // console.log(`current page: ${val}`); + ruleForm.pageIndex = val; + listApi(); + }; + const activeNames = ref('1'); + // 打开弹窗 + const Show = ref(); + const openD = (title: String, id: number) => { + Show.value.openDailog(title, ruleForm.searchParams.targetType,id); + }; + // 删除 + const onDelete = (id: number) => { + let arr = []; + arr.push(id); + ElMessageBox.confirm('确定删除所选项吗?', 'Warning', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + goalManagementApi() + .gettargetClassDelete(arr) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + message: res.data.msg, + type: 'success', + }); + listApi(); + } else { + ElMessage.error(res.data.msg); + } + }); + }) + .catch(() => { + // ElMessage({ + // type: 'info', + // message: 'Delete canceled', + // }); + }); + }; + // 批量删除 + const warning = ref(true); + const danger = ref(true); + const deletAll = ref(); + const handleSelectionChange = (val: any) => { + let valId = JSON.parse(JSON.stringify(val)); + let arr = []; + for (let i = 0; i < valId.length; i++) { + arr.push(valId[i].id); + } + deletAll.value = arr; + if (val.length == 1) { + warning.value = false; + danger.value = false; + } else if (val.length == 0) { + warning.value = true; + danger.value = true; + } else { + warning.value = true; + danger.value = false; + } + }; + const onDeleteAll = () => { + ElMessageBox.confirm('确定删除所选项吗?', 'Warning', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + goalManagementApi() + .gettargetClassDelete(deletAll.value) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + message: res.data.msg, + type: 'success', + }); + listApi(); + } else { + ElMessage.error(res.data.msg); + } + }); + }) + .catch(() => { + ElMessage({ + type: 'info', + message: 'Delete canceled', + }); + }); + }; + const add = () => { + listApi(); + }; + return { + listApi, + add, + // resetForm, + tableData, + currentPage4, + pageSize4, + total, + ruleForm, + handleSizeChange, + handleCurrentChange, + Show, + openD, + activeNames, + onDelete, + warning, + danger, + deletAll, + handleSelectionChange, + onDeleteAll, + Plus, + Delete, + Upload, + Download, + Refresh, + View, + EditPen, + }; + }, +}); +</script> +<style scoped> +.topTitle { + background-color: #fff; + padding: 20px 0px 20px 0px; +} +.minCenter { + width: 100%; + background-color: #fff; + margin-top: 10px; + padding: 0 20px; +} +.btns { + padding: 20px 0px 10px 0px; + display: flex; + justify-content: space-between; +} +.pages { + padding: 20px 0; + display: flex; + justify-content: right; +} +.tableC { + margin: 0 10%; +} +</style> -- Gitblit v1.9.2