From 7df64634d3d7b292713eebfa008c40b3f5f9f65f Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期二, 20 九月 2022 15:57:03 +0800 Subject: [PATCH] 修改 --- src/views/goalManagement/targetDecompositionYear/component/Dailog.vue | 268 +++++++++++++++++++++++++++++++++++++++-------------- 1 files changed, 198 insertions(+), 70 deletions(-) diff --git a/src/views/goalManagement/targetDecompositionYear/component/Dailog.vue b/src/views/goalManagement/targetDecompositionYear/component/Dailog.vue index c3e39c9..c728ad6 100644 --- a/src/views/goalManagement/targetDecompositionYear/component/Dailog.vue +++ b/src/views/goalManagement/targetDecompositionYear/component/Dailog.vue @@ -1,118 +1,234 @@ <template> - <el-dialog v-model="dialogVisible" title="目标分解" width="50%" draggable> + <el-dialog v-model="dialogVisible" :before-close="resetForm" :fullscreen="full" title="目标分解" width="60%" draggable> + <el-button @click="toggleFullscreen" size="small" class="pot" :icon="FullScreen"></el-button> <el-form :model="form" label-width="120px"> <el-row> <el-col :span="11"> - <el-form-item label="安全目标指标"> - <el-input v-model="form.name"> - <template #append> <el-button :icon="Search" @click="daiInpt" /> </template - ></el-input> + <el-form-item label="安全目标指标" size="default"> + <el-input v-model="form.qName" :disabled="disabled"> + <template #append> + <el-button :icon="Search" @click="daiInpt" /> + </template> + </el-input> </el-form-item> </el-col> <el-col :span="11" :offset="2"> - <el-form-item label="目标指标编号"> - <el-input v-model="form.name" /> + <el-form-item label="目标指标编号" size="default"> + <el-input v-model="form.indexNum" disabled /> </el-form-item> </el-col> </el-row> <el-row> <el-col :span="11"> - <el-form-item label="年度"> - <el-input v-model="form.name" /> + <el-form-item label="年度" size="default"> + <el-input v-model="form.year" disabled /> </el-form-item> </el-col> <el-col :span="11" :offset="2"> - <el-form-item label="指标值"> - <el-input v-model="form.name" /> + <el-form-item label="指标值" size="default"> + <el-input v-model="form.value" disabled /> </el-form-item> </el-col> </el-row> </el-form> - <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> + <el-tabs v-model="activeName" class="demo-tabs"> <el-tab-pane label="目标指标分解" name="1"> - <el-button type="primary" size="default" @click="daiAdd">新增</el-button> + <el-button type="primary" size="default" @click="daiAdd('新增')" :disabled="disabled">新增</el-button> </el-tab-pane> </el-tabs> - <el-table :data="tableData" style="width: 100%"> - <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="address" label="上报人" /> + <el-table :data="formUp.targetDivideDetailList" style="width: 100%"> + <el-table-column align="center" property="dutyDepartmentName" label="责任部门" width="180" /> + <el-table-column align="center" property="value" label="考核指标" width="180" /> + <el-table-column align="center" property="makerDepartmentName" label="制定人部门" /> + <el-table-column align="center" property="makeDate" :formatter="timeDate" label="制定日期" /> + <el-table-column align="center" property="commitPersonName" label="上报人" /> <el-table-column align="center" label="操作"> - <template #default> - <el-button link type="primary">查看</el-button> + <template #default="scope"> + <el-button link type="primary" @click="daiAdd('查看', scope.row)">查看</el-button> + <el-button link :disabled="disabled" type="primary" @click="daiAdd('修改', scope.row)">修改</el-button> + <el-button link :disabled="disabled" type="primary" @click="Delete(scope.row)">删除</el-button> </template> </el-table-column> </el-table> <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 @click="resetForm" size="default">关闭</el-button> + <el-button type="primary" v-if="disabled == false" @click="submitForm" size="default">确定</el-button> </span> </template> </el-dialog> - <DailogAdd ref="Show"></DailogAdd> - <DailogSearch ref="Shows"></DailogSearch> + <DailogAdd ref="Show" @onAdd="add"></DailogAdd> + <DailogSearch ref="Shows" @backNum="onNumber"></DailogSearch> </template> <script lang="ts"> import { defineComponent, ref, reactive } from 'vue'; -import { Search } from '@element-plus/icons-vue'; -import DailogAdd from './DailogAdd.vue' -import DailogSearch from '../../../../components/DailogSearch/DailogSearch.vue' +import { timeDate } from '/@/assets/index.ts'; +import { Search, FullScreen } from '@element-plus/icons-vue'; +import DailogAdd from './DailogAdd.vue'; +import { ElMessageBox, ElMessage, ElButton, ElInput, TabsPaneContext } from 'element-plus'; +import DailogSearch from '../../../../components/DailogSearch/DailogSearch.vue'; +import { goalManagementApi } from '/@/api/goalManagement'; +import { emit } from 'process'; +import { deepClone } from '/@/utils/other'; export default defineComponent({ - components:{DailogAdd,DailogSearch}, - setup() { + components: { DailogAdd, DailogSearch }, + setup(props, { emit }) { const dialogVisible = ref<boolean>(false); - const form = reactive({ - name: '', - region: '', - date1: '', - date2: '', - delivery: false, - type: [], - resource: '', - desc: '', + const form = ref({ + qName: '', + indexNum: '', + year: '', + value: '', + targetDivideDetailList: [], }); - const openDailog = (type: string, value: any, projectList: any, projectId: string) => { + const targetType = ref(); + const disabled = ref(false); + const titles = ref(); + const openDailog = (title: string, type: any, id: number) => { dialogVisible.value = true; + titles.value = title; + targetType.value = type; + disabled.value = title == '查看' ? true : false; + if (title == '查看' || title == '修改') { + goalManagementApi() + .getTargetMngDetail(id) + .then((res) => { + if (res.data.code == 200) { + form.value = res.data.data; + formUp.targetDivideDetailList = form.value.targetDivideDetailList; + for(let i=0;i<formUp.targetDivideDetailList.length;i++){ + formUp.targetDivideDetailList[i].makeDate=timeC(formUp.targetDivideDetailList[i].makeDate) + } + } else { + ElMessage.error(res.data.msg); + } + }); + } + }; + const timeC = (timestamp: any) => { + let a = new Date(timestamp).getTime(); + const date = new Date(a); + const Y = date.getFullYear() + '-'; + const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; + const D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' '; + const h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':'; + const m = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes(); + const s = date.getSeconds(); // 秒 + const dateString = Y + M + D + h + m +`:${s}`; + // console.log('dateString', dateString); // > dateString 2021-07-06 14:23 + return dateString; + }; + const onNumber = (val: object) => { + form.value = val; }; // 导航 const activeName = ref('1'); // 表格 - 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 tableData = ref([]); // 新增弹窗 - const Show=ref() - const daiAdd=()=>{ - Show.value.openDailog() - } + const index = ref<any>(); + const Show = ref(); + const daiAdd = (title: string, data: any) => { + index.value = formUp.targetDivideDetailList.indexOf(data); + Show.value.openDailog(title, data); + }; + const formUp = reactive({ + targetId: '', //关联的目标指标/外键 + delTargetDivideDetails: '', //要删除的目标指标分解ID,多个用逗号隔开 + targetDivideDetailList: [], //目标指标分解列表 + }); + + const add = (val: any) => { + const item = deepClone(val); + console.log(item) + if (index.value == -1) { + formUp.targetDivideDetailList.push(item); + } else { + formUp.targetDivideDetailList[index.value] = item; + } + + // let obj=JSON.parse(JSON.stringify(form.value)) + }; + // 新增 + const submitForm = () => { + formUp.delTargetDivideDetails = arr.value.toString(); + formUp.targetId = form.value.id; + dialogVisible.value = false; + for(let i=0;i<formUp.targetDivideDetailList.length;i++){ + delete formUp.targetDivideDetailList[i].dutyDepartmentName + delete formUp.targetDivideDetailList[i].makerDepartmentName + } + goalManagementApi() + .gettargetDivideDetail(formUp) + .then((res) => { + if (res.data.code == 200) { + ElMessage({ + message: res.data.msg, + type: 'success', + }); + emit('addList'); + } else { + ElMessage.error(res.data.msg); + } + }); + form.value = { + qName: '', + indexNum: '', + year: '', + value: '', + targetDivideDetailList: [], + }; + tableData.value = []; + formUp.targetId = ''; + formUp.delTargetDivideDetails = ''; + formUp.targetDivideDetailList = []; + }; + const arr = ref([]); + // 删除 + const Delete = (data: any) => { + formUp.targetDivideDetailList.splice(form.value.targetDivideDetailList.indexOf(data), 1); + formUp.targetId = data.targetId; + arr.value.push(data.id); + }; // 安全目标指标弹窗 - const Shows=ref() - const daiInpt=()=>{ - Shows.value.openDailog() - } + const Shows = ref(); + const daiInpt = () => { + Shows.value.openDailog(targetType.value); + }; + // 关闭 + const resetForm = () => { + dialogVisible.value = false; + form.value = { + qName: '', + indexNum: '', + year: '', + value: '', + targetDivideDetailList: [], + }; + tableData.value = []; + formUp.targetId = ''; + formUp.delTargetDivideDetails = ''; + formUp.targetDivideDetailList = []; + }; + //全屏 + const full = ref(false); + const toggleFullscreen = () => { + if (full.value == false) { + full.value = true; + } else { + full.value = false; + } + }; + // 时间格式处理 + // const timeDate = (data: any) => { + // let result = new Date(data).getTime(); + // return result; + // }; return { + timeC, + index, + timeDate, + arr, form, dialogVisible, openDailog, @@ -123,6 +239,18 @@ Shows, daiInpt, Search, + full, + toggleFullscreen, + FullScreen, + onNumber, + targetType, + disabled, + resetForm, + titles, + add, + formUp, + submitForm, + Delete, }; }, }); -- Gitblit v1.9.2