| | |
| | | <div class="search_thing"> |
| | | <div class="search_label">流程编号:</div> |
| | | <div class="search_input"><el-input v-model="search.deviceNumber" clearable placeholder="请输入" size="small" |
| | | @keyup.enter.native="getAllMessage(clickNodeVal.value)"></el-input></div> |
| | | @keyup.enter.native="getAllMessage(clickNodeVal.value)"></el-input></div> |
| | | </div> |
| | | <div class="search_thing" style="padding-left: 30px;"> |
| | | <div class="search_thing" style="padding-left: 20px;"> |
| | | <el-button size="small" @click="resetSearch">重 置</el-button> |
| | | <el-button size="small" type="primary" @click="getAllMessage(clickNodeVal.value)">查 询</el-button> |
| | | </div> |
| | | <div class="btns"> |
| | | <el-button size="small" type="primary" @click="dialogVisible = true; add()">添加维护记录</el-button> |
| | | <el-button :loading="outLoading" size="small" type="primary" @click="handleDownOne">导出</el-button> |
| | | <el-button :loading="outLoading" size="small" type="primary" @click="handleDown">导出</el-button> |
| | | </div> |
| | | </div> |
| | | <div class="tables" style="margin-top: 10px;"> |
| | | <div class="tables" style="margin-top: 16px;"> |
| | | <el-table ref="table" :data="MaintainParam" height="calc(100vh - 20em)"> |
| | | <el-table-column label="序号" type="index" width="120"> |
| | | <template v-slot="scope"> |
| | |
| | | <el-table-column label="提交人" min-width="150" prop="name" /> |
| | | <el-table-column label="提交日期" min-width="150" prop="date"> |
| | | </el-table-column> |
| | | <el-table-column fixed="right" label="操作" width="110"> |
| | | <el-table-column fixed="right" label="操作" width="150"> |
| | | <template slot-scope="scope"> |
| | | <el-button size="small" type="text" @click="handleViewClick(scope.row)">查看</el-button> |
| | | <el-button size="small" type="text" @click="handleDeleteClick(scope.$index, scope.row)">删除</el-button> |
| | |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination :current-page="1" :page-size="search.size" :page-sizes="[10, 20, 30, 50, 100]" |
| | | :total="search.total" layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange"> |
| | | :total="search.total" layout="->,total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange" |
| | | @current-change="handleCurrentChange"> |
| | | </el-pagination> |
| | | </div> |
| | | <!-- 新建维护 --> |
| | | <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :visible.sync="dialogVisible" title="添加维护记录" |
| | | top="5vh" width="60%"> |
| | | <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :visible.sync="dialogVisible" |
| | | title="添加维护记录" |
| | | top="5vh" width="60%"> |
| | | <el-form ref="form" :model="formData" label-width="130px"> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | |
| | | <el-col :span="12"> |
| | | <el-form-item label="管理编号:" prop="managementNumber"> |
| | | <el-input v-model="formData.managementNumber" clearable disabled placeholder="请输入" |
| | | size="small"></el-input> |
| | | size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item :rules="[{ required: true, message: '请输入维护内容', trigger: 'blur' }]" label="维护内容:" |
| | | prop="content"> |
| | | <el-input v-model="formData.content" placeholder="请输入" size="small" type="textarea"></el-input> |
| | | prop="content"> |
| | | <el-input v-model="formData.content" :disabled="!this.editMode" placeholder="请输入" size="small" type="textarea"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item :rules="[{ required: true, message: '请输入维护时间', trigger: 'blur' }]" label="维护时间:" prop="date"> |
| | | <el-date-picker v-model="formData.date" format="yyyy-MM-dd" placeholder="选择日期" size="small" |
| | | style="width:100%" type="date" value-format="yyyy-MM-dd"> |
| | | <el-form-item :rules="[{ required: true, message: '请选择维护时间', trigger: 'blur' }]" label="维护时间:" prop="date"> |
| | | <el-date-picker v-model="formData.date" format="yyyy-MM-dd" placeholder="选择日期" |
| | | size="small" |
| | | :disabled="!this.editMode" |
| | | style="width:100%" type="date" value-format="yyyy-MM-dd"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item :rules="[{ required: true, message: '请输入维护时间', trigger: 'blur' }]" label="维护类型:" |
| | | prop="maintenanceType"> |
| | | <el-form-item :rules="[{ required: true, message: '请选择维护类型', trigger: 'blur' }]" label="维护类型:" |
| | | prop="maintenanceType"> |
| | | <el-radio-group v-model="formData.maintenanceType" :disabled="!this.editMode"> |
| | | <el-radio :label="0">使用前后维护</el-radio> |
| | | <el-radio :label="1">计划中维护</el-radio> |
| | |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item :rules="[{ required: true, message: '请选择下次维护时间', trigger: 'blur' }]" label="下次维护时间:" |
| | | prop="nextDate"> |
| | | <el-date-picker v-model="formData.nextDate" :picker-options="{ disabledDate: this.disabledDate }" |
| | | format="yyyy-MM-dd" placeholder="选择日期" size="small" style="width:100%" type="date" |
| | | value-format="yyyy-MM-dd"> |
| | | prop="nextDate"> |
| | | <el-date-picker |
| | | v-model="formData.nextDate" |
| | | :disabled="!this.editMode" |
| | | :picker-options="{ disabledDate: this.disabledDate }" |
| | | format="yyyy-MM-dd" |
| | | placeholder="选择日期" size="small" |
| | | style="width:90%" |
| | | type="date" |
| | | value-format="yyyy-MM-dd"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item :rules="[{ required: true, message: '请输入维护人', trigger: 'blur' }]" label="维护人:" prop="name"> |
| | | <el-input v-model="formData.name" clearable placeholder="请输入" size="small"></el-input> |
| | | <el-input v-model="formData.name" clearable placeholder="请输入" :disabled="!this.editMode" size="small"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="备注:"> |
| | | <el-input v-model="formData.comments" placeholder="请输入" size="small" type="textarea"></el-input> |
| | | <el-input v-model="formData.comments" placeholder="请输入" :disabled="!this.editMode" size="small" type="textarea"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | |
| | | <script> |
| | | import { |
| | | exportMaintenanceRecord, |
| | | deleteDeviceMaintenance, |
| | | selectDeviceByCode, |
| | | addDeviceMaintenance, |
| | | getDeviceMaintenancePage, |
| | | } from '@/api/cnas/resourceDemand/device.js' |
| | | addMaintain, |
| | | deleteMaintain, |
| | | deviceMaintenanceExport, getDeviceMaintenancePage, |
| | | selectDeviceByCode |
| | | } from "@/api/cnas/resourceDemand/device"; |
| | | |
| | | export default { |
| | | props: { |
| | | clickNodeVal: { |
| | |
| | | }, |
| | | methods: { |
| | | //下次维护日期:禁用在维护日期前的日期 |
| | | disabledDate(time) { |
| | | disabledDate(time){ |
| | | let selectDate = this.formData.date |
| | | if (selectDate) { |
| | | if(selectDate){ |
| | | let oldDate = new Date(selectDate) |
| | | return time <= oldDate.getTime() |
| | | } |
| | | return false |
| | | }, |
| | | //导出 |
| | | handleDown() { |
| | | this.outLoading = true |
| | | deviceMaintenanceExport({deviceId: this.clickNodeVal.value}).then(res => { |
| | | this.outLoading = false |
| | | const blob = new Blob([res], { type: 'application/octet-stream' }); |
| | | this.$download.saveAs(blob, '设备维护.xlsx') |
| | | }) |
| | | }, |
| | | handleSizeChange(val) { |
| | | this.search.size = val |
| | |
| | | this.dialogVisible = true; |
| | | this.formData = row; |
| | | }, |
| | | // 导出 |
| | | handleDownOne() { |
| | | this.outLoading = true |
| | | exportMaintenanceRecord({ deviceId: this.clickNodeVal.value }).then(res => { |
| | | this.outLoading = false |
| | | const blob = new Blob([res], { type: 'application/octet-stream' }); |
| | | this.$download.saveAs(blob, '设备维护保养记录.doc') |
| | | }) |
| | | }, |
| | | //操作详情删除 |
| | | handleDeleteClick(index, row) { |
| | | this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', { |
| | |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | deleteDeviceMaintenance({ id: row.id }).then(res => { |
| | | deleteMaintain({id: row.id}).then(res => { |
| | | this.MaintainParam.splice(index, 1); |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | }); |
| | | }) |
| | | // this.MaintainParam.splice(index, 1); |
| | | this.getAllMessage(this.clickNodeVal.value) |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | }); |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | |
| | | }, |
| | | //点击后可编辑 |
| | | add() { |
| | | selectDeviceByCode({ id: this.clickNodeVal.value }).then(res => { |
| | | selectDeviceByCode({id: this.clickNodeVal.value}).then(res => { |
| | | this.formData.deviceName = res.data.deviceName |
| | | this.formData.managementNumber = res.data.managementNumber |
| | | this.$nextTick(() => { |
| | |
| | | this.$refs['form'].validate((valid) => { |
| | | if (valid) { |
| | | this.formData.deviceId = this.clickNodeVal.value; |
| | | addDeviceMaintenance(this.formData).then(res => { |
| | | addMaintain(this.formData).then(res => { |
| | | if (res.code == 200) { |
| | | this.$message.success('添加成功'); |
| | | this.getAllMessage(this.clickNodeVal.value) |
| | | // this.MaintainParam.push(this.formData) |
| | | this.dialogVisible = false; |
| | | this.formData = {}; //清空表单 |
| | | this.getAllMessage(this.clickNodeVal.value) |
| | | } |
| | | }) |
| | | // this.MaintainParam.push(this.formData) |
| | | } |
| | | }) |
| | | }, |
| | |
| | | }, |
| | | //获取表单设备维护信息 |
| | | getAllMessage(deviceId) { |
| | | getDeviceMaintenancePage({ |
| | | deviceId, |
| | | ...this.search |
| | | }).then(res => { |
| | | const params = { |
| | | deviceId: deviceId, |
| | | size: this.search.size, |
| | | current: this.search.current, |
| | | deviceNumber: this.search.deviceNumber, |
| | | } |
| | | getDeviceMaintenancePage(params).then(res => { |
| | | if (res.code == 200) { |
| | | this.MaintainParam = res.data.records |
| | | this.search.total = res.data.total |
| | |
| | | |
| | | .search { |
| | | background-color: #fff; |
| | | height: 40px; |
| | | display: flex; |
| | | align-items: center; |
| | | position: relative; |
| | | margin-top: 10px; |
| | | } |
| | | |
| | | .search_thing { |
| | |
| | | transform: translate(0, -50%); |
| | | } |
| | | |
| | | .form .search_label { |
| | | width: 120px; |
| | | } |
| | | </style> |