Commit 2d3c912c authored by sxl's avatar sxl 💬

add:井下巡检合并到银铜

parent 2e7c4ddf
import request from '@/utils/request'
// 查询设备管理列表
export function listDevice(query) {
return request({
url: '/gemho/device/list',
method: 'get',
params: query
})
}
// 查询设备管理详细
export function getDevice(id) {
return request({
url: '/gemho/device/' + id,
method: 'get'
})
}
// 新增设备管理
export function addDevice(data) {
return request({
url: '/gemho/device',
method: 'post',
data: data
})
}
// 修改设备管理
export function updateDevice(data) {
return request({
url: '/gemho/device',
method: 'put',
data: data
})
}
// 删除设备管理
export function delDevice(id) {
return request({
url: '/gemho/device/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
// 查询设备类型列表
export function listDevice(query) {
return request({
url: '/gemho/deviceType/list',
method: 'get',
params: query
})
}
// 查询设备类型详细
export function getDevice(id) {
return request({
url: '/gemho/deviceType/' + id,
method: 'get'
})
}
// 新增设备类型
export function addDevice(data) {
return request({
url: '/gemho/deviceType',
method: 'post',
data: data
})
}
// 修改设备类型
export function updateDevice(data) {
return request({
url: '/gemho/deviceType',
method: 'put',
data: data
})
}
// 删除设备类型
export function delDevice(id) {
return request({
url: '/gemho/deviceType/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
// 查询维修历史列表
export function listMaintain(query) {
return request({
url: '/gemho/maintain/list',
method: 'get',
params: query
})
}
// 查询维修历史详细
export function getMaintain(id) {
return request({
url: '/gemho/maintain/' + id,
method: 'get'
})
}
// 新增维修历史
export function addMaintain(data) {
return request({
url: '/maintain/maintain',
method: 'post',
data: data
})
}
// 修改维修历史
export function updateMaintain(data) {
return request({
url: '/maintain/maintain',
method: 'put',
data: data
})
}
// 删除维修历史
export function delMaintain(id) {
return request({
url: '/gemho/maintain/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
//查询地点巡检列表
export function listLog(query) {
return request({
url: '/gemho/place/list',
method: 'get',
params: query
})
}
//获取地点巡检详细信息
export function getLog(id) {
return request({
url: '/gemho/place/' + id,
method: 'get'
})
}
//新增地点巡检
export function addLog(data) {
return request({
url: '/gemho/place',
method: 'post',
data
})
}
//更新地点巡检
export function updateLog(data) {
return request({
url: '/gemho/place',
method: 'put',
data
})
}
//删除地点巡检
export function delLog(id) {
return request({
url: '/gemho/place/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
//查询巡检记录列表
export function listLog() {
return request({
url: '/gemho/inspection/list',
method: 'get'
})
}
//获取巡检记录详细信息
export function getLog(id) {
return request({
url: '/gemho/inspection/' + id,
method: 'get'
})
}
//新增巡检记录
export function addLog(data) {
return request({
url: '/gemho/inspection',
method: 'post',
data
})
}
//更新巡检记录
export function updateLog(data) {
return request({
url: '/gemho/inspection',
method: 'put',
data
})
}
//删除巡检记录
export function delLog(id) {
return request({
url: '/gemho/inspection/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
//获取巡检任务列表
export function listTask() {
return request({
url: '/inspection/task/list',
method: 'get'
})
}
//获取巡检任务详情
export function getTask(id) {
return request({
url: '/inspection/task/' + id,
method: 'get'
})
}
//删除巡检任务
export function delTask(ids) {
return request({
url: '/inspection/task/' + ids,
method: 'delete'
})
}
//新增巡检任务
export function addTask(data) {
return request({
url: '/inspection/task',
method: 'post',
data
})
}
//更新巡检任务
export function updateTask(data) {
return request({
url: '/inspection/task',
method: 'put',
data
})
}
//导出巡检任务
export function exportTask(data) {
return request({
url: '/inspection/task/export',
method: 'post',
data
})
}
//获取巡检人信息
export function getInspectionUser(query) {
return request({
url: '/system/user/list',
method: 'get',
params: query
})
}
import request from '@/utils/request'
//获取巡检任务列表
export function listTask() {
return request({
url: '/placeInspection/task/list',
method: 'get'
})
}
//获取巡检任务详情
export function getTask(id) {
return request({
url: '/placeInspection/task/' + id,
method: 'get'
})
}
//删除巡检任务
export function delTask(ids) {
return request({
url: '/placeInspection/task/' + ids,
method: 'delete'
})
}
//新增巡检任务
export function addTask(data) {
return request({
url: '/placeInspection/task',
method: 'post',
data
})
}
//更新巡检任务
export function updateTask(data) {
return request({
url: '/placeInspection/task',
method: 'put',
data
})
}
//导出巡检任务
export function exportTask(data) {
return request({
url: '/placeInspection/task/export',
method: 'post',
data
})
}
//获取巡检人信息
export function getInspectionUser(query) {
return request({
url: '/system/user/list',
method: 'get',
params: query
})
}
import request from '@/utils/request'
//查询巡检记录列表
export function listLog(data) {
return request({
url: '/gemho/placeInspection/list',
method: 'get',
params: data
})
}
//获取巡检记录详细信息
export function getLog(id) {
return request({
url: '/gemho/placeInspection/' + id,
method: 'get'
})
}
//新增巡检记录
export function addLog(data) {
return request({
url: '/gemho/placeInspection',
method: 'post',
data
})
}
//更新巡检记录
export function updateLog(data) {
return request({
url: '/gemho/placeInspection',
method: 'put',
data
})
}
//删除巡检记录
export function delLog(id) {
return request({
url: '/gemho/placeInspection/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
// 查询维修历史列表
export function listMaintain(query) {
return request({
url: '/gemho/maintain/list',
method: 'get',
params: query
})
}
// 查询维修历史详细
export function getMaintain(id) {
return request({
url: '/gemho/maintain/' + id,
method: 'get'
})
}
// 新增维修历史
export function addMaintain(data) {
return request({
url: '/gemho/maintain',
method: 'post',
data: data
})
}
// 修改维修历史
export function updateMaintain(data) {
return request({
url: '/gemho/maintain',
method: 'put',
data: data
})
}
// 删除维修历史
export function delMaintain(id) {
return request({
url: '/gemho/maintain/' + id,
method: 'delete'
})
}
import request from '@/utils/request'
// 查询工单派遣列表
export function listWorkOrder(query) {
return request({
url: '/gemho/workOrder/list',
method: 'get',
params: query
})
}
// 查询工单派遣详细
export function getWorkOrder(id) {
return request({
url: '/gemho/workOrder/' + id,
method: 'get'
})
}
// 新增工单派遣
export function addWorkOrder(data) {
return request({
url: '/gemho/workOrder',
method: 'post',
data: data
})
}
// 修改工单派遣
export function updateWorkOrder(data) {
return request({
url: '/gemho/workOrder',
method: 'put',
data: data
})
}
// 删除工单派遣
export function delWorkOrder(id) {
return request({
url: '/gemho/workOrder/' + id,
method: 'delete'
})
}
<template>
<div class="upload-file">
<el-upload
multiple
:action="uploadFileUrl"
:before-upload="handleBeforeUpload"
:data="data"
:limit="limit"
:on-error="handleUploadError"
:on-exceed="handleExceed"
:on-success="handleUploadSuccess"
:headers="headers"
class="upload-file-uploader"
ref="fileUpload"
list-type="picture-card"
v-if="!disabled"
>
<!-- 上传按钮 -->
<el-button size="mini" type="primary">选取文件</el-button>
<div slot="file" slot-scope="{ file }">
<img class="el-upload-list__item-thumbnail" :src="baseUrl + file.url" alt />
<span class="el-upload-list__item-actions">
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
<i class="el-icon-zoom-in"></i>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleDownload(file)">
<i class="el-icon-download"></i>
</span>
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file)">
<i class="el-icon-delete"></i>
</span>
</span>
</div>
<!-- 上传提示 -->
<div class="el-upload__tip" slot="tip" v-if="showTip">
请上传
<template v-if="fileSize">
大小不超过
<b style="color: #f56c6c">{{ fileSize }}MB</b>
</template>
<template v-if="fileType">
格式为
<b style="color: #f56c6c">{{ fileType.join('/') }}</b>
</template>
的文件
</div>
</el-upload>
<!-- 文件列表 -->
<!-- <transition-group
ref="uploadFileList"
class="upload-file-list el-upload-list el-upload-list--text"
name="el-fade-in-linear"
tag="ul"
>
<li
:key="file.url"
class="el-upload-list__item ele-upload-list__item-content"
v-for="(file, index) in fileList"
>
<el-link
:href="`${baseUrl}${file.url}`"
:underline="false"
target="_blank"
>
<span class="el-icon-document"> {{ getFileName(file.name) }} </span>
</el-link>
<div class="ele-upload-list__item-content-action">
<el-link
:underline="false"
@click="handleDelete(index)"
type="danger"
v-if="!disabled"
>删除</el-link
>
</div>
</li>
</transition-group>-->
<el-dialog :visible.sync="dialogVisible" :append-to-body="true">
<img :src="dialogImageUrl" alt />
</el-dialog>
</div>
</template>
<script>
import { getToken } from '@/utils/auth'
import Sortable from 'sortablejs'
export default {
name: 'FileUpload',
props: {
// 值
value: [String, Object, Array],
// 上传接口地址
action: {
type: String,
default: '/common/upload',
},
// 上传携带的参数
data: {
type: Object,
},
// 数量限制
limit: {
type: Number,
default: 4,
},
// 大小限制(MB)
fileSize: {
type: Number,
default: 5,
},
// 文件类型, 例如['png', 'jpg', 'jpeg']
fileType: {
type: Array,
default: () => ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'pdf'],
},
// 是否显示提示
isShowTip: {
type: Boolean,
default: true,
},
// 禁用组件(仅查看文件)
disabled: {
type: Boolean,
default: false,
},
// 拖动排序
drag: {
type: Boolean,
default: true,
},
},
data() {
return {
number: 0,
dialogVisible: false,
uploadList: [],
baseUrl: process.env.VUE_APP_BASE_API,
uploadFileUrl: process.env.VUE_APP_BASE_API + this.action, // 上传文件服务器地址
headers: {
Authorization: 'Bearer ' + getToken(),
},
dialogImageUrl: '',
fileList: [],
}
},
mounted() {
if (this.drag && !this.disabled) {
this.$nextTick(() => {
const element = this.$refs.uploadFileList?.$el || this.$refs.uploadFileList
Sortable.create(element, {
ghostClass: 'file-upload-darg',
onEnd: (evt) => {
const movedItem = this.fileList.splice(evt.oldIndex, 1)[0]
this.fileList.splice(evt.newIndex, 0, movedItem)
this.$emit('input', this.listToString(this.fileList))
},
})
})
}
},
watch: {
value: {
handler(val) {
if (val) {
let temp = 1
// 首先将值转为数组
const list = Array.isArray(val) ? val : this.value.split(',')
// 然后将数组转为对象数组
this.fileList = list.map((item) => {
if (typeof item === 'string') {
item = { name: item, url: item }
}
item.uid = item.uid || new Date().getTime() + temp++
return item
})
} else {
this.fileList = []
return []
}
},
deep: true,
immediate: true,
},
},
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize)
},
},
methods: {
// 上传前校检格式和大小
handleBeforeUpload(file) {
// 校检文件类型
if (this.fileType) {
const fileName = file.name.split('.')
const fileExt = fileName[fileName.length - 1]
const isTypeOk = this.fileType.indexOf(fileExt) >= 0
if (!isTypeOk) {
this.$modal.msgError(`文件格式不正确,请上传${this.fileType.join('/')}格式文件!`)
return false
}
}
// 校检文件名是否包含特殊字符
if (file.name.includes(',')) {
this.$modal.msgError('文件名不正确,不能包含英文逗号!')
return false
}
// 校检文件大小
if (this.fileSize) {
const isLt = file.size / 1024 / 1024 < this.fileSize
if (!isLt) {
this.$modal.msgError(`上传文件大小不能超过 ${this.fileSize} MB!`)
return false
}
}
this.$modal.loading('正在上传文件,请稍候...')
this.number++
return true
},
// 文件个数超出
handleExceed() {
this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`)
},
// 上传失败
handleUploadError(err) {
this.$modal.msgError('上传文件失败,请重试')
this.$modal.closeLoading()
},
// 上传成功回调
handleUploadSuccess(res, file) {
if (res.code === 200) {
this.uploadList.push({ name: res.fileName, url: res.fileName })
const updatedFile = this.$refs.fileUpload.uploadFiles.find((f) => f.uid === file.uid)
if (updatedFile) {
updatedFile.url = res.fileName
updatedFile.name = res.fileName
}
this.uploadedSuccessfully()
} else {
this.number--
this.$modal.closeLoading()
this.$modal.msgError(res.msg)
this.$refs.fileUpload.handleRemove(file)
this.uploadedSuccessfully()
}
},
handleRemove(file) {
this.fileList.forEach((item, index) => {
if (item.url === file.url) {
this.fileList.splice(index, 1)
this.$emit('handleRemove', this.listToString(this.fileList))
}
})
},
handlePictureCardPreview(file) {
this.dialogImageUrl = this.baseUrl + file.url
this.dialogVisible = true
},
handleDownload(file) {
console.log(file)
},
// 删除文件
handleDelete(index) {
this.fileList.splice(index, 1)
this.$emit('input', this.listToString(this.fileList))
},
// 上传结束处理
uploadedSuccessfully() {
if (this.number > 0 && this.uploadList.length === this.number) {
this.fileList = this.fileList.concat(this.uploadList)
this.uploadList = []
this.number = 0
this.$emit('input', this.listToString(this.fileList))
this.$modal.closeLoading()
}
},
// 获取文件名称
getFileName(name) {
// 如果是url那么取最后的名字 如果不是直接返回
if (name.lastIndexOf('/') > -1) {
return name.slice(name.lastIndexOf('/') + 1)
} else {
return name
}
},
// 对象转成指定字符串分隔
listToString(list, separator) {
let strs = ''
separator = separator || ','
for (let i in list) {
strs += list[i].url + separator
}
return strs != '' ? strs.substr(0, strs.length - 1) : ''
},
},
}
</script>
<style scoped lang="scss">
.file-upload-darg {
opacity: 0.5;
background: #c8ebfb;
}
.upload-file-uploader {
margin-bottom: 5px;
}
.upload-file-list .el-upload-list__item {
border: 1px solid #e4e7ed;
line-height: 2;
margin-bottom: 10px;
position: relative;
}
.upload-file-list .ele-upload-list__item-content {
display: flex;
justify-content: space-between;
align-items: center;
color: inherit;
}
.ele-upload-list__item-content-action .el-link {
margin-right: 10px;
}
</style>
This diff is collapsed.
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="" prop="typeName">
<el-input v-model="queryParams.typeName" placeholder="请输入类型名称" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" v-hasPermi="['device:device:add']">新增</el-button>
</el-form-item>
</el-form>
<el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="设备类型" align="center" prop="typeName" />
<el-table-column label="设备管理部门" align="center" prop="typeDeptName" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['device:device:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" v-hasPermi="['device:device:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 添加或修改设备类型对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="类型名称" prop="typeName">
<el-input v-model="form.typeName" placeholder="请输入类型名称" />
</el-form-item>
<el-form-item label="设备管理部门" prop="typeDeptIds">
<treeselect
v-model="form.typeDeptIds"
:options="deptList"
:show-count="true"
:normalizer="normalizer"
placeholder="请输入所属部门"
:multiple="true"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listDevice, getDevice, delDevice, addDevice, updateDevice } from '@/api/device/deviceType'
import { listDept } from '@/api/system/dept'
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
name: 'Device',
components: { Treeselect },
data() {
return {
// 表格树数据
deptList: [],
// 部门树选项
deptOptions: [],
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 设备类型表格数据
deviceList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
typeName: null,
typeDeptIds: null,
location: null,
},
// 表单参数
form: {},
// 表单校验
rules: {},
}
},
created() {
this.getList()
listDept(this.queryParams).then((response) => {
this.deptList = this.handleTree(response.data, 'deptId')
console.log(this.deptList, 'this.deptList')
})
},
methods: {
/** 转换部门数据结构 */
normalizer(node) {
if (node.children && !node.children.length) {
delete node.children
}
return {
id: node.deptId,
label: node.deptName,
children: node.children,
}
},
/** 查询设备类型列表 */
getList() {
this.loading = true
listDevice(this.queryParams).then((response) => {
this.deviceList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
id: null,
typeName: null,
typeDeptIds: null,
location: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = '添加设备类型'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getDevice(id).then((response) => {
this.form = response.data
this.open = true
this.title = '修改设备类型'
})
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateDevice(this.form).then((response) => {
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addDevice(this.form).then((response) => {
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
this.$modal
.confirm('是否确认删除设备类型编号为"' + ids + '"的数据项?')
.then(function () {
return delDevice(ids)
})
.then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
})
.catch(() => {})
},
/** 导出按钮操作 */
// handleExport() {
// this.download('device/device/export', {
// ...this.queryParams
// }, `device_${new Date().getTime()}.xlsx`)
// }
},
}
</script>
<template>
<div class="app-container">
<el-form
:model="queryParams"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="68px"
>
<el-form-item label="" prop="placeName">
<el-input
v-model="queryParams.placeName"
placeholder="请输入地点名称"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery"
>搜索</el-button
>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['device:device:add']"
>新增</el-button
>
<el-button type="warning" plain icon="Download" @click="handleExport"
>批量下载二维码</el-button
>
</el-form-item>
</el-form>
<el-table
v-loading="loading"
:data="placeList"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="地点名称" align="center" prop="placeName" />
<el-table-column label="地点位置" align="center" prop="location" />
<el-table-column label="信息" align="center" prop="information" />
<el-table-column
label="巡检点二维码"
align="center"
class-name="small-padding"
>
<template #default="scope">
<el-button
type="text"
icon="el-icon-download"
@click="handleDownloadQrCode(scope.row)"
>下载二维码</el-button
>
</template>
</el-table-column>
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template #default="scope">
<el-button
link
type="primary"
icon="Edit"
@click="handleUpdate(scope.row)"
>修改</el-button
>
<el-button
link
type="primary"
icon="Delete"
@click="handleDelete(scope.row)"
>删除</el-button
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改设备管理对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="地点名称" prop="placeName">
<el-input v-model="form.placeName" placeholder="请输入地点名称" />
</el-form-item>
<el-form-item label="巡检位置描述" prop="location">
<el-input v-model="form.location" placeholder="请输入巡检位置描述" />
</el-form-item>
<el-form-item label="信息" prop="information">
<el-input v-model="form.information" placeholder="请输入信息" />
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script>
import {
listLog,
getLog,
delLog,
addLog,
updateLog,
} from "@/api/patrol/patrolLocation";
import request from "@/utils/request";
export default {
name: "Device",
data() {
return {
// 表格树数据
deptList: [],
// 部门树选项
deptOptions: [],
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 设备类型表格数据
deviceList: [],
placeList: [],
deviceTypeList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
placeName: null,
},
baseUrl: process.env.VUE_APP_BASE_API,
// 表单参数
form: {},
// 表单校验
rules: {
placeName: [
// 地点名称必填校验
{ required: true, message: "地点名称不能为空", trigger: "blur" },
],
location: [
// 巡检位置描述必填校验
{ required: true, message: "巡检位置描述不能为空", trigger: "blur" },
],
information: [
// 信息必填校验
{ required: true, message: "信息不能为空", trigger: "blur" },
],
},
};
},
created() {
this.getPlaceList();
this.getList();
},
methods: {
// 下载在线图片的函数
downloadOnlineImage(imageUrl, fileName) {
fetch(imageUrl)
.then((response) => response.blob())
.then((blob) => {
const tempUrl = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = tempUrl;
link.download = fileName || "downloaded_image.png";
document.body.appendChild(link);
link.click();
// 清理资源
setTimeout(() => {
URL.revokeObjectURL(tempUrl);
document.body.removeChild(link);
}, 100);
})
.catch((error) => console.error("下载失败:", error));
},
// 新增下载二维码方法
async handleDownloadQrCode(row) {
// 使用示例
const fileurl = "http://192.168.2.13:8080" + row.qrCode;
this.downloadOnlineImage(fileurl, "qr_code.png");
},
getPlaceList() {
listLog(this.queryParams).then((response) => {
this.placeList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/** 查询设备类型列表 */
getList() {
this.loading = true;
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
placeName: null,
location: null,
information: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getPlaceList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加巡检点";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
this.open = true;
this.title = "修改巡检点";
this.form = JSON.parse(JSON.stringify(row));
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateLog(this.form).then((response) => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getPlaceList();
});
} else {
addLog(this.form).then((response) => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getPlaceList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids;
this.$modal
.confirm("是否确认删除?")
.then(function () {
return delLog(ids);
})
.then(() => {
this.getPlaceList();
this.$modal.msgSuccess("删除成功");
})
.catch(() => {});
},
handleExport() {
request({
url: `/gemho/place/downloadQrZip`,
params: this.queryParams,
method: "get",
responseType: "blob", // 关键:指定接收二进制流
}).then((response) => {
// 创建Blob对象并生成临时URL
const blob = new Blob([response], { type: "application/zip" }); // 根据实际图片类型调整
const url = window.URL.createObjectURL(blob);
// 创建并触发下载链接
const a = document.createElement("a");
a.href = url;
a.download = `二维码.zip`; // 文件名使用设备编号+二维码
document.body.appendChild(a);
a.click();
// 清理资源
document.body.removeChild(a);
window.URL.revokeObjectURL(url);
this.$message.success("二维码下载成功");
});
},
},
};
</script>
\ No newline at end of file
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="巡检日期" prop="pollingData">
<el-date-picker clearable v-model="queryParams.pollingData" type="date" value-format="yyyy-MM-dd" placeholder="请选择巡检日期"> </el-date-picker>
</el-form-item>
<el-form-item label="巡检人" prop="inspectionUserId">
<el-select
v-model="queryParams.inspectionUserId"
filterable
remote
reserve-keyword
placeholder="请输入关键词"
:remote-method="remoteMethod"
:loading="loading"
>
<el-option v-for="item in useroptions" :key="item.userId" :label="item.nickName + '/' + item.nickName" :value="item.userId"> </el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="inspectionList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="ID" width="55" align="center" prop="id" />
<el-table-column label="巡检日期" align="center" prop="pollingData" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.pollingData, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="巡检人" align="center" prop="inspectionUserName" />
<el-table-column label="巡检地点" align="center" prop="placeName" />
<el-table-column label="备注" align="center" prop="remark" />
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
</div>
</template>
<script>
import { listLog } from '@/api/patrol/placeInspectionlog'
import { getInspectionUser } from '@/api/patrol/placeInspection'
export default {
name: 'Inspection',
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 巡检记录表格数据
inspectionList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
pollingData: null,
inspectionUserId: null,
placeId: null,
},
//用户列表
useroptions: [],
}
},
created() {
this.getList()
},
methods: {
// 远程搜索
remoteMethod(queryString) {
this.loading = true
getInspectionUser({
userName: queryString,
}).then((response) => {
this.useroptions = response.rows
this.loading = false
})
},
/** 查询巡检记录列表 */
getList() {
this.loading = true
listLog(this.queryParams)
.then((response) => {
this.inspectionList = response.rows
this.total = response.total
this.loading = false
this.useroptions = response.rows
})
.catch(() => {
this.loading = false
})
getInspectionUser({
userName: null,
}).then((response) => {
this.useroptions = response.rows
})
},
// 取消按钮
cancel() {
this.open = false
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
},
}
</script>
This diff is collapsed.
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="巡检日期" prop="pollingData">
<el-date-picker clearable v-model="queryParams.pollingData" type="date" value-format="yyyy-MM-dd" placeholder="请选择巡检日期"> </el-date-picker>
</el-form-item>
<el-form-item label="巡检人" prop="userId">
<el-input v-model="queryParams.userId" placeholder="请输入巡检人" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="报修单编号" prop="repairsId">
<el-input v-model="queryParams.repairsId" placeholder="请输入报修单编号" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="inspectionList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="报修单编号" align="center" prop="repairsId" />
<el-table-column label="巡检日期" align="center" prop="pollingData" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.pollingData, '{y}-{m}-{d}') }}</span>
</template>
</el-table-column>
<el-table-column label="巡检人" align="center" prop="inspectionUserName" />
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="设备状态" align="center" prop="deviceState">
<template slot-scope="scope">
<el-tag v-if="scope.row.deviceState == 1" type="success">正常</el-tag>
<el-tag v-else type="danger">异常</el-tag>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
</el-table>
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
</div>
</template>
<script>
import { listLog, getLog, delLog, addLog, updateLog } from '@/api/patrol/patrolLog'
export default {
name: 'Inspection',
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 巡检记录表格数据
inspectionList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
pollingData: null,
userId: null,
deviceId: null,
deviceState: null,
repairsId: null,
},
// 表单参数
form: {},
// 表单校验
rules: {
userId: [{ required: true, message: '巡检人不能为空', trigger: 'blur' }],
deviceId: [{ required: true, message: '设备id不能为空', trigger: 'blur' }],
},
}
},
created() {
this.getList()
},
methods: {
/** 查询巡检记录列表 */
getList() {
this.loading = true
listLog(this.queryParams).then((response) => {
this.inspectionList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.reset()
},
// 表单重置
reset() {
this.form = {
id: null,
pollingData: null,
userId: null,
deviceId: null,
deviceState: null,
repairsId: null,
createBy: null,
createTime: null,
updateBy: null,
updateTime: null,
remark: null,
}
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = '添加巡检记录'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const id = row.id || this.ids
getLog(id).then((response) => {
this.form = response.data
this.open = true
this.title = '修改巡检记录'
})
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateLog(this.form).then((response) => {
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addLog(this.form).then((response) => {
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const ids = row.id || this.ids
this.$modal
.confirm('是否确认删除巡检记录编号为"' + ids + '"的数据项?')
.then(function () {
return delLog(ids)
})
.then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
})
.catch(() => {})
},
/** 导出按钮操作 */
handleExport() {
this.download(
'inspection/inspection/export',
{
...this.queryParams,
},
`inspection_${new Date().getTime()}.xlsx`
)
},
},
}
</script>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment