<template>
|
<a-card :bordered="false">
|
<div :bordered="false" style="height: 100%">
|
<!-- 查询区域 -->
|
<div class="table-page-search-wrapper">
|
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
<a-row :gutter="24">
|
<a-col :md="4" :sm="4">
|
<a-form-item label="车间">
|
<a-input v-model="queryParam.productionName" allowClear placeholder="请输入车间"></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :md="4" :sm="4">
|
<a-form-item label="工段">
|
<a-input v-model="queryParam.sectionName" allowClear placeholder="请输入工段"></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :md="4" :sm="4">
|
<a-form-item label="设备编号">
|
<a-input v-model="queryParam.equipmentId" allowClear placeholder="请输入设备编号"></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :md="4" :sm="4">
|
<a-form-item label="设备名称">
|
<a-input v-model="queryParam.equipmentName" allowClear placeholder="请输入设备名称"></a-input>
|
</a-form-item>
|
</a-col>
|
<a-col :lg="5" :md="5" :sm="5" :xs="5">
|
<a-space>
|
<a-button type="primary" @click="loadData" icon="search">查询</a-button>
|
<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
|
</a-space>
|
</a-col>
|
</a-row>
|
</a-form>
|
</div>
|
|
<!-- 操作按钮区域· -->
|
<div class="table-operator" style="border-top: 5px">
|
<a-button @click="handleAdd" type="primary" icon="plus">添加台账</a-button>
|
<a-upload name="file" :showUploadList="false" :multiple="false" :headers="tokenHeader"
|
:action="importExcelUrl"
|
@change="handleImportExcel">
|
<a-button type="primary" icon="import">导入</a-button>
|
</a-upload>
|
<a-button type="primary" icon="download" @click="handleExportXls('MDC设备实施台账')">导出</a-button>
|
<a-dropdown v-if="selectedRowKeys.length > 0">
|
<a-menu slot="overlay" @click="handleMenuClick">
|
<a-menu-item key="1">
|
<a-icon type="delete" @click="batchDel"/>
|
删除
|
</a-menu-item>
|
</a-menu>
|
<a-button style="margin-left: 8px">
|
批量操作
|
<a-icon type="down"/>
|
</a-button>
|
</a-dropdown>
|
</div>
|
|
<a-table :columns="columns" :data-source="dataList" bordered :pagination="ipagination" :scroll="{x:'max-content'}"
|
:expandRowByClick="true" @change="handleTableChange"
|
rowKey="id" @expand="handleExpandChange" :loading="outerDataLoading"
|
>
|
<span slot="isMdcInstall" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="isMdcHardwareInstall" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="isDncInstall" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="isDncHardwareInstall" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="action" slot-scope="text, record">
|
<a @click.stop="handleAdd(record.id,'sub_')">新增记录</a>
|
<a-divider type="vertical"/>
|
<a-dropdown>
|
<a class="ant-dropdown-link">
|
更多 <a-icon type="down"/>
|
</a>
|
<a-menu slot="overlay">
|
<a-menu-item>
|
<a @click="handleEdit(record)">编辑台账</a>
|
</a-menu-item>
|
|
<a-menu-item>
|
<a href="javascript:;" @click="handleDetail(record)">台账详情</a>
|
</a-menu-item>
|
|
<a-menu-item>
|
<a-popconfirm title="确定删除此台账吗?" @confirm="() => handleDelete(record.id)">
|
<a>删除台账</a>
|
</a-popconfirm>
|
</a-menu-item>
|
</a-menu>
|
</a-dropdown>
|
</span>
|
|
<a-table
|
slot="expandedRowRender"
|
slot-scope="row"
|
:columns="innerColumns"
|
:data-source="row.innerDataList"
|
:pagination="false"
|
rowKey="id"
|
:loading="innerDataLoading"
|
>
|
<span slot="mdcFunctionStatus" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="mdcModuleStatus" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="dncFunctionStatus" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="dncModuleStatus" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="maintenanceResult" slot-scope="text">{{text | formatIsInstallAndStatus}}</span>
|
<span slot="innerAction" slot-scope="text, record">
|
<a @click="handleEdit(record,'sub_')">编辑记录</a>
|
<a-divider type="vertical"/>
|
<a-dropdown>
|
<a class="ant-dropdown-link">
|
更多 <a-icon type="down"/>
|
</a>
|
<a-menu slot="overlay">
|
<a-menu-item>
|
<a href="javascript:;" @click="handleDetail(record,'sub_')">记录详情</a>
|
</a-menu-item>
|
|
<a-menu-item>
|
<a-popconfirm title="确定删除此变更记录吗?" @confirm="() => handleDelete(record.id,'sub')">
|
<a>删除记录</a>
|
</a-popconfirm>
|
</a-menu-item>
|
</a-menu>
|
</a-dropdown>
|
</span>
|
</a-table>
|
</a-table>
|
</div>
|
|
<MdcImplementLedgersModal ref="modalForm" @ok="loadData"/>
|
<MdcImplementLedgersSubModal ref="sub_modalForm" @ok="loadData"/>
|
</a-card>
|
</template>
|
|
<script>
|
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
import { putAction, getAction } from '@/api/manage'
|
import MdcImplementLedgersModal from './modules/MdcEquipmentImplementLedger/MdcImplementLedgersModal'
|
import MdcImplementLedgersSubModal from './modules/MdcEquipmentImplementLedger/MdcImplementLedgersSubModal'
|
import { deleteAction } from '@/api/manage'
|
|
const columns = [
|
{ title: '公司', dataIndex: 'companyName', key: 'companyName', align: 'center', width: 100 },
|
{ title: '车间', dataIndex: 'productionName', key: 'productionName', align: 'center', width: 120 },
|
{ title: '工段', dataIndex: 'sectionName', key: 'sectionName', align: 'center', width: 180 },
|
{ title: '设备编号', dataIndex: 'equipmentId', key: 'equipmentId', align: 'center', width: 100 },
|
{ title: '设备名称', dataIndex: 'equipmentName', key: 'equipmentName', align: 'center', width: 100 },
|
{ title: '设备型号', dataIndex: 'equipmentModel', key: 'equipmentModel', align: 'center', width: 150 },
|
{ title: '设备系统类型', dataIndex: 'controlSystem', key: 'controlSystem', align: 'center', width: 150 },
|
{ title: '设备责任人', dataIndex: 'responsible', key: 'responsible', align: 'center', width: 150 },
|
{ title: '设备安放位置', dataIndex: 'equipmentPosition', key: 'equipmentPosition', align: 'center', width: 150 },
|
{ title: '设备安放时间', dataIndex: 'placementTime', key: 'placementTime', align: 'center', width: 150 },
|
{
|
title: 'MDC安装情况',
|
dataIndex: 'isMdcInstall',
|
key: 'isMdcInstall',
|
align: 'center',
|
width: 150,
|
scopedSlots: { customRender: 'isMdcInstall' }
|
},
|
{
|
title: 'MDC硬件安装情况',
|
dataIndex: 'isMdcHardwareInstall',
|
key: 'isMdcHardwareInstall',
|
align: 'center',
|
width: 150,
|
scopedSlots: { customRender: 'isMdcHardwareInstall' }
|
},
|
{ title: 'MDC安装时间', dataIndex: 'mdcInstallTime', key: 'mdcInstallTime', align: 'center', width: 150 },
|
{
|
title: 'DNC安装情况',
|
dataIndex: 'isDncInstall',
|
key: 'isDncInstall',
|
align: 'center',
|
width: 150,
|
scopedSlots: { customRender: 'isDncInstall' }
|
},
|
{
|
title: 'DNC硬件安装情况',
|
dataIndex: 'isDncHardwareInstall',
|
key: 'isDncHardwareInstall',
|
align: 'center',
|
width: 150,
|
scopedSlots: { customRender: 'isDncHardwareInstall' }
|
},
|
{ title: 'DNC安装时间', dataIndex: 'dncInstallTime', key: 'dncInstallTime', align: 'center', width: 150 },
|
{
|
title: '操作',
|
dataIndex: 'action',
|
scopedSlots: { customRender: 'action' },
|
align: 'center',
|
width: 200
|
}
|
]
|
|
const innerColumns = [
|
{
|
title: '变更记录',
|
dataIndex: 'rowIndex',
|
key: 'rowIndex',
|
align: 'center',
|
customRender: function(t, r, index) {
|
return parseInt(index) + 1
|
}
|
},
|
{ title: '变更时间', dataIndex: 'alterTime', key: 'alterTime', align: 'center' },
|
{ title: '变更原因', dataIndex: 'alterReason', key: 'alterReason', align: 'center ' },
|
{ title: '设备位置确认', dataIndex: 'locationStatus', key: 'locationStatus', align: 'center' },
|
{ title: '设备网络确认', dataIndex: 'networkStatus', key: 'networkStatus', align: 'center' },
|
{
|
title: 'MDC功能确认',
|
dataIndex: 'mdcFunctionStatus',
|
key: 'mdcFunctionStatus',
|
scopedSlots: { customRender: 'mdcFunctionStatus' },
|
align: 'center'
|
},
|
{
|
title: 'MDC模块确认',
|
dataIndex: 'mdcModuleStatus',
|
key: 'mdcModuleStatus',
|
scopedSlots: { customRender: 'mdcModuleStatus' },
|
align: 'center'
|
},
|
{
|
title: 'DNC功能确认',
|
dataIndex: 'dncFunctionStatus',
|
key: 'dncFunctionStatus',
|
scopedSlots: { customRender: 'dncFunctionStatus' },
|
align: 'center'
|
},
|
{
|
title: 'DNC模块确认',
|
dataIndex: 'dncModuleStatus',
|
key: 'dncModuleStatus',
|
scopedSlots: { customRender: 'dncModuleStatus' },
|
align: 'center'
|
},
|
{ title: '反馈人', dataIndex: 'feedbackBy', key: 'feedbackBy', align: 'center' },
|
{ title: '反馈时间', dataIndex: 'feedbackTime', key: 'feedbackTime', align: 'center' },
|
{ title: '维护人员', dataIndex: 'maintenanceBy', key: 'maintenanceBy', align: 'center' },
|
{ title: '处理时间', dataIndex: 'maintenanceTime', key: 'maintenanceTime', align: 'center' },
|
{ title: '处理过程描述', dataIndex: 'maintenanceRemark', key: 'maintenanceRemark', align: 'center' },
|
{
|
title: '处理结果',
|
dataIndex: 'maintenanceResult',
|
key: 'maintenanceResult',
|
scopedSlots: { customRender: 'maintenanceResult' },
|
align: 'center'
|
},
|
{
|
title: '操作',
|
dataIndex: 'innerAction',
|
scopedSlots: { customRender: 'innerAction' },
|
align: 'center',
|
width: 200
|
}
|
]
|
|
export default {
|
name: 'MdcEquipmentImplementLedger',
|
components: { MdcImplementLedgersModal, MdcImplementLedgersSubModal },
|
mixins: [JeecgListMixin],
|
data() {
|
return {
|
// 禁用mixins中的create钩子
|
disableMixinCreated: true,
|
/* table加载状态 */
|
outerDataLoading: false,
|
innerDataLoading: false,
|
queryParam: {},
|
dataList: [],
|
url: {
|
mdcImplementLedgersList: '/mdc/mdcImplementLedgers/list',
|
mdcImplementLedgersSubList: '/mdc/mdcImplementLedgersSub/list',
|
exportXlsUrl: '/mdc/mdcImplementLedgers/exportXls',
|
importExcelUrl: '/mdc/mdcImplementLedgers/importExcel'
|
},
|
columns,
|
innerColumns,
|
hasRequestAlarmCodeList: []
|
}
|
},
|
/**
|
* 生命周期 挂载前
|
* */
|
created() {
|
this.loadData()
|
},
|
computed: {
|
importExcelUrl: function() {
|
return `${window._CONFIG['domianURL']}${this.url.importExcelUrl}`
|
}
|
},
|
filters: {
|
numFilter(value) {
|
if (value) {
|
return parseFloat((value * 100).toFixed(2))
|
} else {
|
return '0'
|
}
|
},
|
|
formatIsInstallAndStatus(value) {
|
return value === 'Y' ? '是' : '否'
|
},
|
|
/**
|
* 格式化时间
|
* @param seconds 秒数
|
* @returns '' 格式化后时间字符串
|
*/
|
getFormattedTime(seconds) {
|
var hours = Math.floor(seconds / 3600)
|
var minutes = Math.floor((seconds % 3600) / 60)
|
var secs = seconds % 60
|
|
if (hours === 0) {
|
if (minutes === 0) {
|
return secs === 0 ? 0 : `${secs}秒`
|
} else {
|
if (secs === 0) {
|
return `${minutes}分`
|
}
|
return `${minutes}分 ${secs}秒`
|
}
|
} else {
|
if (minutes === 0 && secs === 0) {
|
return `${hours}小时`
|
} else if (minutes !== 0 && secs === 0) {
|
return `${hours}小时 ${minutes}分`
|
}
|
}
|
return `${hours}小时 ${minutes}分 ${secs}秒`
|
}
|
},
|
methods: {
|
loadData() {
|
this.outerDataLoading = true
|
this.dataList = []
|
const params = this.getQueryParams()
|
getAction(this.url.mdcImplementLedgersList, params).then(res => {
|
if (res.success) {
|
this.dataList = res.result.records
|
this.hasRequestAlarmCodeList = []
|
if (res.result.total) this.ipagination.total = res.result.total
|
else this.ipagination.total = 0
|
}
|
}).finally(() => {
|
this.outerDataLoading = false
|
})
|
},
|
|
handleAdd: function(implementId = '', param = '') {
|
this.$refs[param + 'modalForm'].add(implementId)
|
this.$refs[param + 'modalForm'].title = !param ? '新增台账' : '新增变更记录'
|
this.$refs[param + 'modalForm'].disableSubmit = false
|
},
|
|
handleEdit: function(record, param = '') {
|
this.$refs[param + 'modalForm'].edit(record)
|
this.$refs[param + 'modalForm'].title = !param ? '编辑台账' : '编辑变更记录'
|
this.$refs[param + 'modalForm'].disableSubmit = false
|
},
|
|
/**
|
* 点击表格中详情按钮事件
|
* @param record 选中的当前行数据
|
*/
|
handleDetail: function(record, param = '') {
|
console.log(this.$refs[param + 'modalForm'])
|
this.$refs[param + 'modalForm'].edit(record)
|
this.$refs[param + 'modalForm'].title = !param ? '台账详情' : '变更记录详情'
|
this.$refs[param + 'modalForm'].disableSubmit = true
|
// 调用抽屉表单组件中的清除表单验证方法
|
// this.$refs[param + 'modalForm'].removeValidate()
|
},
|
|
handleDelete: function(id, param) {
|
var that = this
|
let url
|
if (param != 'sub') {
|
url = '/mdc/mdcImplementLedgers/delete'
|
} else {
|
url = '/mdc/mdcImplementLedgersSub/delete'
|
}
|
deleteAction(url, { id: id }).then((res) => {
|
if (res.success) {
|
//重新计算分页问题
|
that.reCalculatePage(1)
|
that.$notification.success({
|
message: '消息',
|
description: res.message
|
})
|
that.loadData()
|
} else {
|
that.$notification.warning({
|
message: '消息',
|
description: res.message
|
})
|
}
|
})
|
},
|
|
/**
|
* 自定义表格行触发
|
* @param expanded 当前行是否为展开状态
|
* @param record 当前行信息
|
*/
|
handleExpandChange(expanded, record) {
|
let _this = this
|
// 当展开时若该行未被展开过才会请求后台数据,展开过的数据会被缓存无需重复请求
|
if (expanded && !this.hasRequestAlarmCodeList.includes(record.id)) {
|
this.innerDataLoading = true
|
getAction(this.url.mdcImplementLedgersSubList, { implementId: record.id }).then(res => {
|
if (res.success) {
|
_this.dataList.forEach(item => {
|
if (item.id === record.id) {
|
item.innerDataList = res.result.records
|
}
|
})
|
_this.hasRequestAlarmCodeList.push(record.id)
|
}
|
})
|
.finally(() => {
|
_this.innerDataLoading = false
|
})
|
}
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
/deep/ .ant-table-body tr:not(.ant-table-expanded-row) td {
|
/*padding-top: 10px;*/
|
/*padding-bottom: 10px;*/
|
/*cursor: pointer;*/
|
}
|
|
/deep/ .ant-table-fixed-right .ant-table-expanded-row {
|
display: none;
|
}
|
</style>
|