From 9f2882f17b22eddc1c78c4033481c64ac5f395d6 Mon Sep 17 00:00:00 2001 From: shj <1790240199@qq.com> Date: 星期六, 30 七月 2022 17:20:17 +0800 Subject: [PATCH] 对接 --- src/views/facilityManagement/ProductionEquipment/index.vue | 429 +++++++++++++++++++++++++++++++---------------------- 1 files changed, 249 insertions(+), 180 deletions(-) diff --git a/src/views/facilityManagement/ProductionEquipment/index.vue b/src/views/facilityManagement/ProductionEquipment/index.vue index 4cdae93..c932fbc 100644 --- a/src/views/facilityManagement/ProductionEquipment/index.vue +++ b/src/views/facilityManagement/ProductionEquipment/index.vue @@ -4,35 +4,32 @@ <el-row> <el-col :span="4"> <el-form-item size="default"> - <el-input v-model="ruleForm.pass" placeholder="装置设施名称" /> - </el-form-item> - </el-col> - <el-col :span="4"> - <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="4"> <el-form-item> - <el-button size="default" type="primary" @click="submitForm(ruleFormRef)">查询</el-button> - <el-button size="default" @click="resetForm(ruleFormRef)">重置</el-button> + <el-button size="default" type="primary" @click="listApi">查询</el-button> + <el-button size="default" @click="resetForm">重置</el-button> </el-form-item> </el-col> </el-row> </el-form> <el-row> <el-col :span="4"> + <el-input v-model="filterText" style="height: 30px" placeholder="请输入关键字" /> <div class="tree"> - <el-input v-model="filterText" style="height: 30px" placeholder="Filter keyword" /> - <el-tree ref="treeRef" class="filter-tree" :data="data" :props="defaultProps" default-expand-all :filter-node-method="filterNode" /> + + <!-- <el-tree ref="treeRef" class="filter-tree" :data="data" :props="props" :filter-node-method="filterNode" /> --> + <el-tree ref="treeRef" :data="data" :props="props" @node-click="handleNodeClick" :filter-node-method="filterNode" /> </div> </el-col> <el-col :span="20"> <div class="btns"> <div> - <el-button size="default" type="primary" :icon="Plus" @click="openD">新建</el-button> - <el-button size="default" type="warning" plain :icon="EditPen">修改</el-button> - <el-button size="default" type="danger" :icon="Delete" plain>删除</el-button> + <el-button size="default" type="primary" :icon="Plus" @click="openD('新建')">新建</el-button> + <el-button size="default" :disabled="warning" type="warning" plain :icon="EditPen">修改</el-button> + <el-button size="default" :disabled="danger" type="danger" :icon="Delete" @click="onDeleteAll" plain>删除</el-button> </div> <div> <!-- <el-button size="default" :icon="Upload" @click="openUp"></el-button> @@ -44,61 +41,59 @@ <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> <el-table-column type="selection" align="center" width="55" /> <el-table-column type="expand"> - <template #default> - <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" style="margin: 0 5%"> + <template #default="scope"> + <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClicks" style="margin: 0 5%"> <el-tab-pane label="设备保养" name="first"> - <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> - <el-table-column property="name" align="center" label="保养情况" sortable /> - <el-table-column property="name" align="center" label="保养负责人" sortable /> - <el-table-column property="name" align="center" label="保养日期" sortable /> - <el-table-column property="name" align="center" label="保养负责人单位" sortable /> + <el-table ref="multipleTableRef" :data="scope.row.takecareDetailList" style="width: 100%"> + <el-table-column property="takecareMemo" align="center" label="保养情况" sortable /> + <el-table-column property="leadingPersonId" align="center" label="保养负责人" sortable /> + <el-table-column property="takecareDate" align="center" label="保养日期" sortable /> + <el-table-column property="leadingPersonDepartmentId" align="center" label="保养负责人单位" sortable /> </el-table> </el-tab-pane> <el-tab-pane label="设备检查" name="second" - ><el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> - <el-table-column property="name" align="center" label="检查人" sortable /> - <el-table-column property="name" align="center" label="检查日期" sortable /> + ><el-table ref="multipleTableRef" :data="scope.row.checkDetailList" style="width: 100%"> + <el-table-column property="leadingPersonId" align="center" label="检查人" sortable /> + <el-table-column property="createTime" align="center" label="检查日期" sortable /> <el-table-column property="name" align="center" label="检查人部门" sortable /> - <el-table-column property="name" align="center" label="检查结果" sortable /> + <el-table-column property="takecareMemo" align="center" label="检查结果" sortable /> <el-table-column property="name" align="center" label="检查状态" sortable /> </el-table ></el-tab-pane> <el-tab-pane label="设备检测" name="third"> - <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> - <el-table-column property="name" align="center" label="检测人" sortable /> - <el-table-column property="name" align="center" label="检测日期" sortable /> - <el-table-column property="name" align="center" label="检测人单位" sortable /> - <el-table-column property="name" align="center" label="检测内容" sortable /> - <el-table-column property="name" align="center" label="检测结果" sortable /> - <el-table-column property="name" align="center" label="检测状态" sortable /> + <el-table ref="multipleTableRef" :data="scope.row.testDetailList" style="width: 100%"> + <el-table-column property="testPersonId" align="center" label="检测人" sortable /> + <el-table-column property="testDate" align="center" label="检测日期" sortable /> + <el-table-column property="testPersonDepartmentId" align="center" label="检测人单位" sortable /> + <el-table-column property="testMemo" align="center" label="检测内容" sortable /> + <el-table-column property="testResult" align="center" label="检测结果" sortable /> + <el-table-column property="testStatus" align="center" label="检测状态" sortable /> </el-table> - </el-tab-pane> + </el-tab-pane> <el-tab-pane label="设备维修" name="fourth"> - <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> - <el-table-column property="name" align="center" label="设施异常项" sortable /> - <el-table-column property="name" align="center" label="维修状态" sortable /> - <el-table-column property="name" align="center" label="维修情况" sortable /> - <el-table-column property="name" align="center" label="维修负责人" sortable /> - <el-table-column property="name" align="center" label="维修负责人单位" sortable /> - <el-table-column property="name" align="center" label="维修开始日期" sortable /> - <el-table-column property="name" align="center" label="维修结束日期" sortable /> + <el-table ref="multipleTableRef" :data="scope.row.repaireDetailList" style="width: 100%"> + <el-table-column property="exceptionInfo" align="center" label="设施异常项" sortable /> + <el-table-column property="repairStatus" align="center" label="维修状态" sortable /> + <el-table-column property="repairMemo" align="center" label="维修情况" sortable /> + <el-table-column property="repairPersonId" align="center" label="维修负责人" sortable /> + <el-table-column property="repairPersonDepartmentId" align="center" label="维修负责人单位" sortable /> + <el-table-column property="repairStartDate" align="center" label="维修开始日期" sortable /> + <el-table-column property="repairEndDate" align="center" label="维修结束日期" sortable /> </el-table> </el-tab-pane> </el-tabs> </template> </el-table-column> - <el-table-column label="装置设施名称" align="center" sortable> - <template #default="scope">{{ scope.row.date }}</template> - </el-table-column> - <el-table-column property="name" align="center" label="装置设施位号" sortable /> - <el-table-column property="name" align="center" label="装置设施用途" sortable /> - <el-table-column property="address" label="装置设施型号" align="center" sortable show-overflow-tooltip /> - <el-table-column property="address" label="类型/类别外键" align="center" sortable show-overflow-tooltip /> - <el-table-column property="address" label="设施部位" align="center" sortable show-overflow-tooltip /> + <el-table-column property="qName" label="装置设施名称" align="center" sortable /> + <el-table-column property="positionNum" align="center" label="装置设施位号" sortable /> + <el-table-column property="qUsage" align="center" label="装置设施用途" sortable /> + <el-table-column property="model" label="装置设施型号" align="center" sortable show-overflow-tooltip /> + <el-table-column property="equipmentTypeId" label="类型/类别外键" align="center" sortable show-overflow-tooltip /> + <el-table-column property="setPart" label="设施部位" align="center" sortable show-overflow-tooltip /> <el-table-column label="操作" align="center" width="250"> - <template #default> - <el-button link type="primary" size="default" :icon="View">查看</el-button> - <el-button link type="primary" size="default" :icon="EditPen">修改</el-button> - <el-button link type="primary" size="default" :icon="Delete">删除</el-button> + <template #default="scope"> + <el-button link type="primary" size="default" :icon="View" @click="openD('查看', scope.row.id)">查看</el-button> + <el-button link type="primary" size="default" :icon="EditPen" @click="openD('修改', scope.row.id)">修改</el-button> + <el-button link type="primary" size="default" :icon="Delete" @click="onDelete(scope.row.id)">删除</el-button> </template> </el-table-column> </el-table> @@ -106,12 +101,9 @@ <el-pagination 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" /> @@ -119,164 +111,241 @@ </div> </el-col> </el-row> - <updata ref="Show"></updata> - <Dailog ref="ShowD"></Dailog> + <!-- <updata ref="Show"></updata> --> + <Dailog ref="openAdd" @navAddorUpdata="onAddorUpdata"></Dailog> </div> </template> <script lang="ts"> -import { defineComponent, ref, reactive, watch } from 'vue'; -import updata from '/@/components/updata/updata.vue' -import Dailog from '/@/components/equipmentDailog/Dailog.vue' -import { ElTree, TabsPaneContext } from 'element-plus'; -import { EditPen, Plus, Delete, Download, Refresh, Upload } from '@element-plus/icons-vue'; +import { defineComponent, ref, reactive, watch, onMounted } from 'vue'; +import updata from '/@/components/updata/updata.vue'; +import Dailog from '/@/components/equipmentDailog/Dailog.vue'; +import { ElTree, TabsPaneContext, ElMessage, ElMessageBox } from 'element-plus'; +import { facilityManagementApi } from '/@/api/facilityManagement'; +import { EditPen, View, Plus, Delete, Download, Refresh, Upload } from '@element-plus/icons-vue'; interface Tree { - id: number; label: string; children?: Tree[]; } export default defineComponent({ - components:{updata,Dailog}, + components: { updata, Dailog }, setup() { + // 搜索条件 const ruleForm = reactive({ - pass: '', - checkPass: '', + pageSize: 10, + pageIndex: 1, + searchParams: { + qName: '', ////名称 + positionNum: '', ////位号 + infoType: 0, ////具体类型(页面左侧的导航栏使用) 0:仪器仪表信息 1:生产设备设施 2:安全设备设施 + }, }); + // 重置 + const resetForm = () => { + ruleForm.searchParams.qName = ''; + listApi(); + }; + const listApi = () => { + facilityManagementApi() + .getequipmentInfoList(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 onAddorUpdata = () => { + listApi(); + }; + // 表格 + const tableData = ref(); + const currentPage4 = ref(); + const pageSize4 = ref(); + const total = ref(); + 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 openAdd = ref(); + const openD = (title: String, id: number) => { + openAdd.value.openDailog(title,false,id,1); + }; + // 删除 + const onDelete = (id: number) => { + ElMessageBox.confirm('确定删除所选项吗?', 'Warning', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + }) + .then(() => { + facilityManagementApi() + .getequipmentInfoDelete(id) + .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.toString(); + 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(() => { + facilityManagementApi() + .getequipmentInfoDelete(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 filterText = ref(''); const treeRef = ref<InstanceType<typeof ElTree>>(); - - const defaultProps = { - children: 'children', - label: 'label', + // 树形 + const listApiTree = () => { + facilityManagementApi() + .getequipmentTypeMngTreeData() + .then((res) => { + if (res.data.code == 200) { + data.value= res.data.data; + } else { + ElMessage({ + showClose: true, + message: res.data.msg, + type: 'error', + }); + } + }); }; - + const props = { + label: 'typeName', + children: 'childList', + value: 'id', + } watch(filterText, (val) => { treeRef.value!.filter(val); }); const filterNode = (value: string, data: Tree) => { if (!value) return true; - return data.label.includes(value); + return data.typeName.includes(value); }; - - const data: Tree[] = [ - { - id: 1, - label: 'Level one 1', - children: [ - { - id: 4, - label: 'Level two 1-1', - children: [ - { - id: 9, - label: 'Level three 1-1-1', - }, - { - id: 10, - label: 'Level three 1-1-2', - }, - ], - }, - ], - }, - { - id: 2, - label: 'Level one 2', - children: [ - { - id: 5, - label: 'Level two 2-1', - }, - { - id: 6, - label: 'Level two 2-2', - }, - ], - }, - { - id: 3, - label: 'Level one 3', - children: [ - { - id: 7, - label: 'Level two 3-1', - }, - { - id: 8, - label: 'Level two 3-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', - }, - { - date: '2016-05-08', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - { - date: '2016-05-06', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - { - date: '2016-05-07', - name: 'Tom', - address: 'No. 189, Grove St, Los Angeles', - }, - ]; - const activeName = ref('first'); - - const handleClick = (tab: TabsPaneContext, event: Event) => { + const handleNodeClick=(data: Tree)=>{ + ruleForm.searchParams.positionNum=data.id + listApi(); + } + const data=ref([]) + onMounted(() => { + listApiTree(); + }); + const handleClicks = (tab: TabsPaneContext, event: Event) => { console.log(tab, event); }; - const Show=ref() - const openUp=()=>{ - Show.value.openDialog() - } - const ShowD=ref() - const openD=()=>{ - ShowD.value.openDailog(true) - } + + const activeName = ref('first'); + // const Show=ref() + // const openUp=()=>{ + // Show.value.openDialog() + // } return { - activeName, - handleClick, + handleNodeClick, ruleForm, + resetForm, + listApi, + onAddorUpdata, + tableData, + currentPage4, + pageSize4, + total, + handleSizeChange, + handleCurrentChange, + onDelete, + warning, + danger, + deletAll, + handleSelectionChange, + onDeleteAll, + listApiTree, + handleClicks, filterText, treeRef, - defaultProps, + props, filterNode, data, - tableData, - Show, - openUp, - ShowD, + openAdd, openD, + activeName, Plus, EditPen, Delete, Download, Refresh, + View, Upload, }; }, -- Gitblit v1.9.2