2024-03-12 21:38:33 +08:00

443 lines
14 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="fullHeight">
<div class="searchBox whiteBlock">
<!-- 仓库管理工器具管理 -->
<el-form :inline="true" ref="searchForm" :model="searchForm" size="medium">
<el-form-item label="设备编号">
<el-input clearable v-model="searchForm.devSn" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="工器具名称">
<el-input clearable v-model="searchForm.toolName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="工器具状态">
<el-select clearable v-model="searchForm.toolStatus" placeholder="请选择">
<el-option v-for="(item, index) in toolTypeOptions" :key="index" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" plain @click="searchList">{{ $t('message.energyManage.waybill.query') }}</el-button>
<el-button type="warning" plain @click="refresh">{{ $t('message.deviceManage.refresh') }}</el-button>
<el-button type="primary" size="medium" @click="add">新增</el-button>
</el-form-item>
</el-form>
</div>
<div class="table_wrap whiteBlock">
<el-table class="tables" :data="List">
<el-table-column type="index" label="设备序号" width="100" align="center"></el-table-column>
<el-table-column prop="devSn" align="center" label="设备编号"></el-table-column>
<el-table-column prop="toolName" align="center" label="工器具名称"></el-table-column>
<el-table-column prop="toolStatus" align="center" label="工器具状态">
<template slot-scope="scope" v-if="scope.row.toolStatus">
<div>
{{ toolTypeOptions[scope.row.toolStatus - 1].label }}
</div>
</template>
</el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="exitTime" align="center" label="离场时间"></el-table-column>
<el-table-column label="操作" align="center" width="270px">
<template slot-scope="scope">
<div class="tableBtns">
<!-- <div class="operationText" @click.stop="openDetail(scope.row)">
<i class="el-icon-tickets" style="color: #8dacfa; font-size: 16px; margin-right: 2px"></i>
<span style="white-space: nowrap;">详情</span>
</div> -->
<div @click="edit(scope.row)" class="operationText">
<img src="@/assets/images/icon-edit.png" width="15px" height="15px" />
<span style="white-space: nowrap;">编辑</span>
</div>
<div @click="deleteDev(scope.row)" class="operationText">
<img src="@/assets/images/icon-delete.png" width="15px" height="15px" />
<span style="white-space: nowrap;">删除</span>
</div>
<div @click="checkTodayData(scope.row)" class="operationText">
<img src="@/assets/images/review.png" width="15px" height="15px" />
<span style="white-space: nowrap;">历史数据</span>
</div>
</div>
</template>
</el-table-column>
</el-table>
<el-pagination
class="pagerBox"
@size-change="SizeChange"
@current-change="CurrentChange"
:current-page="pagInfo.pageNo"
:page-sizes="$store.state.PAGESIZRS"
:page-size="pagInfo.pageSize"
layout="total, sizes, prev, pager, next"
:total="Number(pagInfo.total)"
background
></el-pagination>
</div>
<el-dialog :modal-append-to-body="false" @close="close" :title="title" :visible.sync="dialogShow" width="667px">
<div class="dialog_content">
<el-form size="medium" ref="addEditForm" :model="addEditForm" :rules="addEditRules" label-width="120px" class="dialogFormBox">
<el-form-item label="设备编号" prop="devSn">
<el-input :disabled="isDetail" v-model="addEditForm.devSn" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="工器具名称" prop="toolName">
<el-input :disabled="isDetail" v-model="addEditForm.toolName" placeholder="请输入"></el-input>
</el-form-item>
<el-form-item label="工器具状态" prop="toolStatus">
<el-select :disabled="isDetail" v-model="addEditForm.toolStatus" placeholder="请选择" clearable>
<el-option v-for="(item, index) in toolTypeOptions" :key="index" :label="item.label" :value="item.value"> </el-option>
</el-select>
</el-form-item>
<el-form-item label="时间" prop="entryTime">
<el-date-picker
:disabled="isDetail"
value-format="yyyy-MM-dd HH:mm:ss"
v-model="addEditForm.entryTime"
type="datetime"
placeholder="请选择时间"
>
</el-date-picker>
</el-form-item>
<div class="dialog-footer">
<el-button class="cancleBtn" @click="dialogShow = false" icon="el-icon-circle-close" size="medium"
>{{ $t('message.deviceManage.cancel') }}
</el-button>
<el-button type="primary" icon="el-icon-circle-check" @click="submit" size="medium"
>{{ $t('message.deviceManage.save') }}
</el-button>
</div>
</el-form>
</div>
</el-dialog>
<el-dialog
:modal-append-to-body="false"
:title="$t('message.POverview.toolHistory')"
:visible.sync="dialogTableVisible"
width="78%"
>
<vue-scroll class="scroll" style="height: 540px">
<el-table :data="tableData2" style="width: 100%" :show-header="true">
<el-table-column type="index" label="序号" width="100" align="center"></el-table-column>
<el-table-column prop="toolStatus" align="center" label="工器具状态">
<template slot-scope="scope">
<span v-if="scope.row.toolStatus === 1">入库</span>
<span v-else-if="scope.row.toolStatus === 2">出库</span>
</template>
</el-table-column>
<el-table-column prop="toolName" align="center" label="工器具名称"></el-table-column>
<el-table-column prop="entryTime" align="center" label="进场时间"></el-table-column>
<el-table-column prop="exitTime" align="center" label="离场时间"></el-table-column>
</el-table>
</vue-scroll>
<el-pagination
class="pagerBox"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="pageNo2"
:page-size="pageSize2"
layout="total, sizes, prev, pager, next"
:total="Number(total2)"
background
></el-pagination>
</el-dialog>
</div>
</template>
<script>
import { rtToolPageHistory, rtToolAdd, rtToolDelete, rtToolEdit, rtToolPage } from '@/assets/js/api/workTicketManage.js'
import { checkPhone } from '@/assets/js/util.js'
export default {
mounted() {},
created() {
this.getList()
// this.getDutyPerson()
},
data() {
return {
devSn: '',
pageNo2: 1,
pageSize2: 10,
total2: 0,
tableData2: [],
fileUrl: '',
enterpriseListData: [],
teamListData: [],
departmentListData: [],
dialogTableVisible: false,
isDetail: false, //是否详情
// dutyList: [], // 负责人
fileUplodList: [],
title: '',
dialogShow: false,
pagInfo: {
pageNo: 1, //页数
pageSize: 10, //条数
total: 0 //总条数
},
// 工器具状态1 在场 2 离场
toolTypeOptions: [
{
label: '在场',
value: 1
},
{
label: '离场',
value: 2
}
],
List: [],
addEditForm: {
devSn: '',
entryTime: '',
exitTime: '',
projectSn: '',
toolName: '',
toolStatus: 0,
updateTime: ''
},
addEditRules: {
toolName: [
{
required: true,
message: '必填',
trigger: 'blur'
}
],
devSn: [
{
required: true,
message: '必填',
trigger: 'blur'
}
]
},
searchForm: {
toolName: '',
devSn: '',
toolStatus: ''
}
}
},
methods: {
changeCompany() {
this.formInline.departmentId = ''
this.formInline.teamId = ''
this.getDepartmentList()
this.getTeamList()
},
// 负责人下拉回调
// dutySelectChange(e) {
// const item = this.dutyList.find(item => item.userId === e)
// this.addEditForm.dutyUserName = item.realName
// console.log('下拉选择', e, this.addEditForm.dutyUserName)
// },
//查询负责人下拉
// getDutyPerson() {
// let data = {
// projectSn: this.$store.state.projectSn
// }
// getCrewListDataApi(data).then(res => {
// if (res.code == 200) {
// this.dutyList = res.result
// console.log('获取负责人下拉', this.dutyList)
// } else {
// this.$message.error(res.message)
// }
// })
// },
//查询列表
getList() {
rtToolPage({
pageNo: this.pagInfo.pageNo,
pageSize: this.pagInfo.pageSize,
projectSn: this.$store.state.projectSn,
devSn: this.searchForm.devSn,
toolName: this.searchForm.toolName,
toolStatus: this.searchForm.toolStatus,
}).then(result => {
if (result.success) {
this.List = result.result.records
this.pagInfo.total = result.result.total
}
})
},
add() {
this.title = '新增'
this.dialogShow = true
this.fileUplodList = []
this.close()
},
edit(obj) {
this.title = '编辑'
this.dialogShow = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
// this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
openDetail(obj) {
this.title = '详情'
this.dialogShow = true
this.isDetail = true
this.addEditForm = JSON.parse(JSON.stringify(obj))
// this.fileUplodList = JSON.parse(obj.equipmentPicture)
},
submit() {
// if (this.addEditForm.contactNumber) {
// if (!checkPhone(this.addEditForm.contactNumber)) {
// this.$message.error('请输入正确的手机号码')
// return
// }
// }
let params = JSON.parse(JSON.stringify(this.addEditForm))
params.projectSn = this.$store.state.projectSn
// params.equipmentPicture = JSON.stringify(this.fileUplodList)
// if (this.fileUplodList.length > 0) {
// this.$message.error('请上传照片')
// return false
// }
this.$refs.addEditForm.validate(valid => {
if (valid) {
if (this.title == '新增') {
rtToolAdd(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
} else if (this.title == '编辑') {
rtToolEdit(params).then(result => {
if (result.success) {
this.$message.success(result.message)
this.getList()
}
})
}
this.dialogShow = false
} else {
return false
}
})
},
deleteDev(obj) {
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
rtToolDelete({ id: obj.id }).then(res => {
if (res.success) {
this.getList()
this.$message({
type: 'success',
message: '删除成功!'
})
} else {
this.$message({
type: 'error',
message: res.message
})
}
})
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 历史数据弹窗
checkTodayData(obj){
this.dialogTableVisible = true
this.pageNo2 = 1
this.pageSize2 = 10
this.devSn = obj.devSn
this.getPageList()
},
//获取历史数据列表
getPageList() {
console.log(this.startTime)
let data = {
projectSn: this.$store.state.projectSn,
pageNo: this.pageNo2,
pageSize: this.pageSize2,
devSn: this.devSn
}
rtToolPageHistory(data).then((res) => {
if (res.code == 200) {
this.tableData2 = res.result.records
this.total2 = res.result.total
this.$nextTick(() => {
this.$previewRefresh()
})
}
})
},
// 删除
handleRemove(file, fileList) {
this.fileUplodList = fileList
},
handleExceed(file, fileList) {
console.log('超出限制', file)
this.$message.warning('只能上传一张图片')
},
handleSuccess(res, file, type) {
if (res.status == 'SUCCESS') {
this.fileUplodList.push({
name: file.name,
url: this.$store.state.FILEURL + file.response.data[0].imageUrl
})
}
},
close() {
this.isDetail = false
this.addEditForm = {}
this.fileUplodList = []
this.$nextTick(() => {
this.$refs.addEditForm.clearValidate()
})
},
SizeChange(val) {
this.pagInfo.pageSize = val
this.getList()
},
CurrentChange(val) {
this.pagInfo.pageNo = val
this.getList()
},
searchList() {
this.pagInfo.pageNo = 1 //页数
this.getList()
},
refresh() {
this.searchForm = {}
this.pagInfo.pageNo = 1 //页数
this.pagInfo.pageSize = 10 //条数
this.getList()
},
//选择条数
handleSizeChange(val) {
this.pageSize2 = val
this.getPageList()
},
//选择分页
handleCurrentChange(val) {
this.pageNo2 = val
this.getPageList()
},
}
}
</script>
<style lang="less" scoped>
.tables2 {
min-height: auto;
}
.textStyle {
width: 140px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>