406 lines
11 KiB
Vue
406 lines
11 KiB
Vue
<template>
|
|
<div class="app-container">
|
|
<!-- left -->
|
|
<div class="left-container">
|
|
<head-form :form-config="headFormConfig" @headBtnClick="btnClick" />
|
|
<base-table
|
|
:top-btn-config="topBtnConfig"
|
|
:page="listQuery.current"
|
|
:limit="listQuery.size"
|
|
:height="tableH"
|
|
:high-index="highIndex"
|
|
:table-config="tableProps"
|
|
:table-data="list"
|
|
:is-loading="listLoading"
|
|
@clickTopBtn="clickTopBtn"
|
|
@selectRow="selectRow"
|
|
>
|
|
<method-btn
|
|
v-if="tableBtn.length"
|
|
slot="handleBtn"
|
|
:method-list="tableBtn"
|
|
:width="trueWidth"
|
|
@clickBtn="handleClick"
|
|
/>
|
|
</base-table>
|
|
<pagination
|
|
v-show="total > 0"
|
|
:total="total"
|
|
:page.sync="listQuery.current"
|
|
:limit.sync="listQuery.size"
|
|
@pagination="getList()"
|
|
/>
|
|
</div>
|
|
<!-- right -->
|
|
<div class="right-container">
|
|
<top-title
|
|
:base-title="this.$t('module.equipmentManager.inspectionManage.inspectionItem')"
|
|
style="font-size: 14px; padding-bottom: 14px;"
|
|
/>
|
|
<base-table
|
|
:page="1"
|
|
:limit="999"
|
|
:height="tableHR"
|
|
:table-config="tablePropsR"
|
|
:table-data="listR"
|
|
:is-loading="listLoading"
|
|
@emitFun="updateStatus"
|
|
>
|
|
<method-btn
|
|
v-if="tableBtn.length"
|
|
slot="handleBtn"
|
|
:method-list="tableBtnR"
|
|
:width="trueWidthR"
|
|
@clickBtn="handleClickR"
|
|
/>
|
|
</base-table>
|
|
</div>
|
|
<einspectionitem-add v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getList" />
|
|
<einspectionitemlog-add v-if="addOrUpdateVisibleR" ref="addOrUpdateR" @refreshDataList="getInspectionItem" />
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import HeadForm from '@/components/basicData/HeadForm'
|
|
import i18n from '@/lang'
|
|
import topTitle from '@/components/TopTitle'
|
|
import BaseTable from '@/components/BaseTable'
|
|
import Pagination from '@/components/Pagination'
|
|
import MethodBtn from '@/components/BaseTable/subcomponents/MethodBtn'
|
|
import { tableHeight } from '@/utils/index'
|
|
import {
|
|
equipmentList,
|
|
inspectionLog,
|
|
einspectionLogD,
|
|
einspectionItList,
|
|
einspectionItemLogU
|
|
} from '@/api/equipment/inspectionManager'
|
|
import einspectionitemAdd from './components/einspectionitemAdd.vue'
|
|
import einspectionitemlogAdd from './components/einspectionitemlogAdd.vue'
|
|
import { timeFormatter } from '@/filters'
|
|
import StatusBtn from './components/statusBtn.vue'
|
|
import statusTag from './components/statusTag.vue'
|
|
// import newBasicData from '@/filters/newBasicData'
|
|
|
|
import { Random } from 'mockjs'
|
|
|
|
const topBtnConfig = [
|
|
{
|
|
type: 'add',
|
|
btnName: 'btn.add'
|
|
}
|
|
]
|
|
const tableBtn = [
|
|
{
|
|
type: 'detail',
|
|
btnName: 'btn.detail'
|
|
},
|
|
{
|
|
type: 'edit',
|
|
btnName: 'btn.edit'
|
|
},
|
|
{
|
|
type: 'delete',
|
|
btnName: 'btn.delete'
|
|
}
|
|
]
|
|
const tableBtnR = [
|
|
{
|
|
type: 'detail',
|
|
btnName: 'btn.detail'
|
|
},
|
|
{
|
|
type: 'edit',
|
|
btnName: 'btn.edit'
|
|
}
|
|
]
|
|
const tableProps = [
|
|
// {
|
|
// prop: 'createTime',
|
|
// label: i18n.t('module.equipmentManager.inspectionManage.addTime'),
|
|
// filter: timeFormatter
|
|
// },
|
|
{
|
|
prop: 'equipmentName',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.equipmentName')
|
|
},
|
|
{
|
|
prop: 'inspectionStartTime',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.startTime'),
|
|
filter: timeFormatter,
|
|
width: 160
|
|
},
|
|
{
|
|
prop: 'inspectionEndTime',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.endTime'),
|
|
filter: timeFormatter,
|
|
width: 160
|
|
},
|
|
// {
|
|
// prop: 'source',
|
|
// label: i18n.t('module.equipmentManager.inspectionManage.source'),
|
|
// filter: newBasicData('1523941494259912706')
|
|
// },
|
|
{
|
|
prop: 'inspectionWorker',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.inspectionWorker'),
|
|
width: 150
|
|
}
|
|
]
|
|
const tablePropsR = [
|
|
{
|
|
prop: 'inspectionItem',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.inspectionItem')
|
|
},
|
|
{
|
|
prop: 'inspectionContent',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.inspectionContent')
|
|
},
|
|
{
|
|
prop: 'status',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.completion'),
|
|
subcomponent: StatusBtn,
|
|
emitFullData: true
|
|
},
|
|
{
|
|
prop: 'type',
|
|
label: i18n.t('module.equipmentManager.inspectionManage.type'),
|
|
subcomponent: statusTag,
|
|
width: 100
|
|
}
|
|
]
|
|
export default {
|
|
name: 'InspectionRecord',
|
|
components: { HeadForm, Pagination, BaseTable, MethodBtn, topTitle, einspectionitemAdd, einspectionitemlogAdd },
|
|
data() {
|
|
return {
|
|
topBtnConfig,
|
|
tableBtn,
|
|
trueWidth: 110,
|
|
trueWidthR: 80,
|
|
tableH: tableHeight(280),
|
|
highIndex: true,
|
|
list: [],
|
|
total: 0,
|
|
listLoading: false,
|
|
tableProps,
|
|
listQuery: {
|
|
current: 1,
|
|
size: 20,
|
|
equipmentId: '',
|
|
startTime: '',
|
|
endTime: ''
|
|
},
|
|
headFormConfig: [
|
|
{
|
|
type: 'select',
|
|
label: this.$t('module.equipmentManager.inspectionManage.equipmentName'),
|
|
selectOptions: [],
|
|
param: 'equipmentId',
|
|
width: 200,
|
|
filterable: true
|
|
},
|
|
{
|
|
type: 'datePicker',
|
|
label: this.$t('module.basicData.knowledge.time'),
|
|
dateType: 'daterange',
|
|
format: 'yyyy-MM-dd',
|
|
valueFormat: 'yyyy-MM-dd',
|
|
rangeSeparator: '-',
|
|
startPlaceholder: this.$t('module.basicData.knowledge.startTime'),
|
|
endPlaceholder: this.$t('module.basicData.knowledge.endTime'),
|
|
param: 'searchTime'
|
|
},
|
|
{
|
|
type: 'button',
|
|
btnName: 'btn.search',
|
|
name: 'search',
|
|
color: 'primary'
|
|
}
|
|
],
|
|
headFormValue: {},
|
|
equipmentInspectionId: '',
|
|
tableHR: tableHeight(280),
|
|
tablePropsR,
|
|
listR: [],
|
|
tableBtnR,
|
|
|
|
addOrUpdateVisible: false,
|
|
addOrUpdateVisibleR: false
|
|
}
|
|
},
|
|
mounted() {
|
|
window.addEventListener('resize', () => {
|
|
this.tableH = tableHeight(280)
|
|
this.tableR = tableHeight(280)
|
|
})
|
|
this.getEquipmentList()
|
|
this.getList()
|
|
},
|
|
methods: {
|
|
// 获取设备list
|
|
getEquipmentList() {
|
|
equipmentList({
|
|
current: 1,
|
|
size: 999
|
|
}).then(res => {
|
|
if (res.data) {
|
|
this.headFormConfig[0].selectOptions = res.data
|
|
}
|
|
})
|
|
},
|
|
handleClick(raw) {
|
|
if (raw.type === 'delete') {
|
|
this.$confirm(
|
|
`${this.$t('module.basicData.visual.TipsBefore')}[${raw.data.equipmentName}]?`,
|
|
this.$t('module.basicData.visual.Tips'),
|
|
{
|
|
confirmButtonText: this.$t('module.basicData.visual.confirmButtonText'),
|
|
cancelButtonText: this.$t('module.basicData.visual.cancelButtonText'),
|
|
type: 'warning'
|
|
}
|
|
)
|
|
.then(() => {
|
|
einspectionLogD({
|
|
id: raw.data.id
|
|
}).then(res => {
|
|
this.$message({
|
|
message: this.$t('module.basicData.visual.success'),
|
|
type: 'success',
|
|
duration: 1500,
|
|
onClose: () => {
|
|
this.listQuery.current = 1
|
|
this.getList()
|
|
}
|
|
})
|
|
})
|
|
})
|
|
.catch(() => {})
|
|
} else if (raw.type === 'detail') {
|
|
this.addNew(raw.data.id, 'detail')
|
|
} else if (raw.type === 'edit') {
|
|
this.addNew(raw.data.id, 'edit')
|
|
}
|
|
},
|
|
getList() {
|
|
this.listLoading = true
|
|
this.listQuery.equipmentId = this.headFormValue.equipmentId
|
|
this.listQuery.startTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[0] + 'T00:00:00' : ''
|
|
this.listQuery.endTime = this.headFormValue.searchTime ? this.headFormValue.searchTime[1] + 'T23:59:59' : ''
|
|
inspectionLog(this.listQuery).then(res => {
|
|
if (res.data.records) {
|
|
// this.list = res.data.records
|
|
// 11-mes 修改模拟时间
|
|
this.list = res.data.records.map(item => {
|
|
let startDate = 2022 + '-' + '11-' + Random.integer(1, 29)
|
|
let startHour = Random.integer(1, 22)
|
|
return {
|
|
...item,
|
|
inspectionStartTime:
|
|
startDate + ' ' + (startHour < 10 ? '0' + startHour : '' + startHour) + Random.datetime(':mm:ss'),
|
|
inspectionEndTime:
|
|
startDate +
|
|
' ' +
|
|
(startHour + 1 < 10 ? +'0' + (startHour + 1) : 1 + startHour + '') +
|
|
Random.datetime(':mm:ss')
|
|
}
|
|
})
|
|
// console.log('list;', this.list)
|
|
this.equipmentInspectionId = this.list[0].id
|
|
|
|
this.getInspectionItem()
|
|
} else {
|
|
this.list = []
|
|
this.listR.splice(0, this.listR.length)
|
|
}
|
|
this.total = res.data.total
|
|
this.listLoading = false
|
|
})
|
|
},
|
|
getInspectionItem() {
|
|
if (this.equipmentInspectionId) {
|
|
this.listR.splice(0, this.listR.length)
|
|
einspectionItList({
|
|
equipmentInspectionId: this.equipmentInspectionId
|
|
}).then(res => {
|
|
if (res.data) {
|
|
this.listR = res.data
|
|
} else {
|
|
this.listR.splice(0, this.listR.length)
|
|
}
|
|
})
|
|
}
|
|
},
|
|
selectRow(val) {
|
|
// 点击左侧列表
|
|
this.equipmentInspectionId = val.id
|
|
this.getInspectionItem()
|
|
},
|
|
// 新增
|
|
addNew(id, name) {
|
|
this.addOrUpdateVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.addOrUpdate.init(id, name)
|
|
})
|
|
},
|
|
btnClick(val) {
|
|
this.headFormValue = val
|
|
// 如果点击的是搜索栏的其他按钮在这里继续写判断
|
|
if (this.headFormValue.btnName === 'search') {
|
|
this.listQuery.current = 1
|
|
this.getList()
|
|
}
|
|
},
|
|
clickTopBtn(val) {
|
|
if (val === 'add') {
|
|
this.addNew() // 新增
|
|
}
|
|
},
|
|
// 右侧切换启停状态
|
|
updateStatus(val) {
|
|
einspectionItemLogU({
|
|
id: val.data.id,
|
|
status: val.data.status
|
|
}).then(res => {
|
|
this.$message({
|
|
message: this.$t('module.basicData.visual.success'),
|
|
type: 'success',
|
|
duration: 1500,
|
|
onClose: () => {
|
|
this.getInspectionItem()
|
|
}
|
|
})
|
|
})
|
|
},
|
|
handleClickR(raw) {
|
|
if (raw.type === 'detail' || raw.type === 'edit') {
|
|
this.addOrUpdateVisibleR = true
|
|
this.$nextTick(() => {
|
|
this.$refs.addOrUpdateR.init(raw.data.id, raw.type)
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.app-container {
|
|
padding-top: 0;
|
|
.left-container {
|
|
display: inline-block;
|
|
// width: 500px;
|
|
width: 50%;
|
|
border-right: 8px solid #f2f4f9;
|
|
height: 100%;
|
|
padding-top: 16px;
|
|
}
|
|
.right-container {
|
|
display: inline-block;
|
|
// width: calc(100% - 510px);
|
|
width: 49%;
|
|
vertical-align: top;
|
|
height: 100%;
|
|
padding-top: 23px;
|
|
}
|
|
}
|
|
</style>
|