| | |
| | | <el-row> |
| | | <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-col :span="4"> |
| | | <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" /> |
| | | </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" :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> |
| | |
| | | <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 ref="multipleTableRef" :data="scope.row.takecareDetailList" 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="takecareDate" align="center" label="保养日期" sortable /> |
| | | <el-table-column property="name" 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 ref="multipleTableRef" :data="scope.row.testDetailList" 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> |
| | | </el-tab-pane> |
| | | </el-tab-pane> |
| | | <el-tab-pane label="设备维修" name="fourth"> |
| | | <el-table ref="multipleTableRef" :data="tableData" style="width: 100%"> |
| | | <el-table ref="multipleTableRef" :data="scope.row.repaireDetailList" 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-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> |
| | | <template #default="scope"> |
| | | <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> |
| | | <el-button link type="primary" size="default" :icon="Delete" @click="onDelete(scope.row.id)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | v-model:currentPage="currentPage4" |
| | | v-model:page-size="pageSize4" |
| | | :page-sizes="[100, 200, 300, 400]" |
| | | :small="small" |
| | | :disabled="disabled" |
| | | :background="background" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="400" |
| | | @size-change="handleSizeChange" |
| | |
| | | </div> |
| | | </el-col> |
| | | </el-row> |
| | | <updata ref="Show"></updata> |
| | | <Dailog ref="ShowD"></Dailog> |
| | | <!-- <updata ref="Show"></updata> --> |
| | | <Dailog ref="openAdd"></Dailog> |
| | | </div> |
| | | </template> |
| | | <script lang="ts"> |
| | | 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} from 'element-plus'; |
| | | 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, Plus, Delete, Download, Refresh, Upload } from '@element-plus/icons-vue'; |
| | | interface Tree { |
| | | 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, id); |
| | | }; |
| | | // 删除 |
| | | 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 = { |
| | | const props = { |
| | | value: 'id', |
| | | lable: 'typeName', |
| | | children: 'childList', |
| | | value: 'id', |
| | | }; |
| | | // 树形 |
| | | const listApiTree = () => { |
| | | const listApiTree = () => { |
| | | facilityManagementApi() |
| | | .getequipmentTypeMngTreeData() |
| | | .then((res) => { |
| | |
| | | return data.label.includes(value); |
| | | }; |
| | | |
| | | const data=ref([]) |
| | | onMounted(()=>{ |
| | | listApiTree() |
| | | }) |
| | | 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 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(false) |
| | | } |
| | | const activeName=ref("first") |
| | | // const Show=ref() |
| | | // const openUp=()=>{ |
| | | // Show.value.openDialog() |
| | | // } |
| | | return { |
| | | listApiTree, |
| | | activeName, |
| | | handleClick, |
| | | 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, |