<template>
|
<div class="device_list">
|
<!-- 查询区域 -->
|
<div class="seach-content">
|
<div class="table-page-search-wrapper">
|
<a-form layout="inline" @keyup.enter.native="searchQuery">
|
<a-row :gutter="24">
|
<a-col :md="4" :sm="4" :xs="4">
|
<a-form-item label="驱动类型">
|
<a-auto-complete
|
v-model="queryParam.driveType"
|
:data-source="driveTypeList"
|
placeholder="请选择驱动类型"
|
:filter-option="filterOption"
|
allowClear
|
/>
|
</a-form-item>
|
</a-col>
|
|
<a-col :md="4" :sm="4" :xs="4">
|
<a-form-item label="设备级别">
|
<j-dict-select-tag placeholder="请选择设备级别" dictCode="device_level" v-model="queryParam.deviceLevel"
|
allow-clear/>
|
</a-form-item>
|
</a-col>
|
<a-col :md="4" :sm="4" :xs="4">
|
<a-form-item label="设备种类">
|
<j-dict-select-tag placeholder="请选择设备种类" dictCode="device_category" v-model="queryParam.deviceCategory"
|
allow-clear/>
|
</a-form-item>
|
</a-col>
|
|
<a-col :md="5" :sm="5" :xs="5">
|
<a-form-item label="时间">
|
<a-range-picker
|
:placeholder="['开始时间', '结束时间']"
|
format="YYYY-MM-DD"
|
:value="dates"
|
@change="dateParamChange"
|
/>
|
</a-form-item>
|
</a-col>
|
|
<a-col :md="4" :sm="4" :xs="4">
|
<a-space>
|
<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
|
<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>
|
<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>
|
<a-button type="primary" icon="printer" v-print="'#EfficiencyShift'" v-has="'deviceProcess:print'">打印</a-button>
|
</a-space>
|
</a-col>
|
</a-row>
|
</a-form>
|
|
</div>
|
</div>
|
|
<div class="container" id="EfficiencyShift" style="flex:1;overflow: hidden">
|
<a-table :columns="columns" rowKey="equipmentId" :dataSource="dataSource" :scroll="{x:'max-content',y:scrollY}" :pagination="false" bordered>
|
<span slot="duration" slot-scope="text">{{getFormattedTime(text)}}</span>
|
</a-table>
|
</div>
|
<!--<div class="pagination">-->
|
<!--<a-pagination-->
|
<!--:total=dataSource.total-->
|
<!--:show-total="(total, range) => `${range[0]}-${range[1]} 共 ${total} 条`"-->
|
<!--:page-size="+queryParam.pageSize"-->
|
<!--:default-current="1"-->
|
<!--:current=+queryParam.pageNo-->
|
<!--show-size-changer-->
|
<!--:pageSizeOptions="['20','30','40','50']"-->
|
<!--@change="handlePageNoChange"-->
|
<!--@showSizeChange="handlePageSizeChange"-->
|
<!--/>-->
|
<!--</div>-->
|
</div>
|
</template>
|
|
<script>
|
import moment from 'moment'
|
import { putAction, getAction } from '@/api/manage'
|
import $ from 'jquery'
|
import '@/components/table2excel/table2excel'
|
import { ajaxGetDictItems, getDictItemsFromCache, duplicateCheck } from '@/api/api'
|
import api from '@/api/mdc'
|
|
export default {
|
name: 'DeviceProcessReportList',
|
components: {},
|
data() {
|
return {
|
typeTree: '',
|
typeParent: 1,
|
typeEquipment: 1,
|
allowClear: true,
|
allowClearSu: true,
|
dates: [moment().subtract('days', 1), moment().subtract('days', 1)],
|
identifying: [],
|
queryParam: {
|
pageSize: 20,
|
pageNo: 1
|
},
|
queryParamEquip: {},
|
queryParamPeople: {},
|
url: {
|
list: '/mdc/mdcProcessCount/list'
|
},
|
columns: [
|
{
|
title: '序号',
|
dataIndex: '',
|
key: 'rowIndex',
|
width: 60,
|
align: 'center',
|
customRender: function(t, r, index) {
|
return parseInt(index) + 1
|
}
|
// fixed: 'left'
|
},
|
{
|
title: '设备统一编号',
|
align: 'center',
|
dataIndex: 'equipmentId',
|
width: 200
|
},
|
{
|
title: '设备名称',
|
align: 'center',
|
width: 200,
|
dataIndex: 'equipmentName'
|
},
|
{
|
title: '驱动类型',
|
align: 'center',
|
width: 100,
|
dataIndex: 'driveType'
|
},
|
{
|
title: '程序号',
|
align: 'center',
|
width: 100,
|
dataIndex: 'sequenceNumber'
|
},
|
{
|
title: '加工件数',
|
align: 'center',
|
width: 100,
|
dataIndex: 'processCount'
|
},
|
{
|
title: '持续时间',
|
dataIndex: 'duration',
|
align: 'center',
|
scopedSlots: { customRender: 'duration' },
|
width: 150
|
},
|
// {
|
// title: '日期',
|
// dataIndex: 'theDate',
|
// align: 'center',
|
// width: 110
|
// }
|
],
|
dataSource: [],
|
driveTypeList: [],
|
scrollY:465
|
}
|
},
|
props: { nodeTree: '', Type: '', nodePeople: '' },
|
created() {
|
this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD')
|
this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD')
|
this.queryParam.typeTree = '1'
|
this.loadData()
|
this.getDriveTypeByApi()
|
},
|
mounted(){
|
window.addEventListener('resize',this.handleWindowResize)
|
this.handleWindowResize()
|
},
|
beforeDestroy(){
|
window.removeEventListener('resize',this.handleWindowResize)
|
},
|
watch: {
|
Type(valmath) {
|
this.dataList = []
|
this.queryParam.typeTree = valmath
|
},
|
nodeTree(val) { //监听currSelected 变化，将变化后的数值传递给 getCurrSelected 事件
|
console.log(val)
|
if (JSON.stringify(val) != '{}') {
|
if (val.equipmentId != null) {
|
this.queryParamEquip.parentId = ''
|
this.queryParamEquip.equipmentId = val.equipmentId
|
} else {
|
this.queryParamEquip.parentId = val.key
|
this.queryParamEquip.equipmentId = ''
|
}
|
this.searchQuery()
|
}
|
},
|
nodePeople(val) {
|
if (JSON.stringify(val) != '{}') {
|
if (val.equipmentId != null) {
|
this.queryParamPeople.parentId = val.equipmentId
|
this.queryParamPeople.equipmentId = ''
|
} else {
|
this.queryParamPeople.parentId = val.key
|
this.queryParamPeople.equipmentId = ''
|
}
|
this.searchQuery()
|
}
|
}
|
},
|
filters: {
|
numFilter(value) {
|
if (value) {
|
return parseFloat((value * 100).toFixed(2))
|
} else {
|
return '0'
|
}
|
}
|
},
|
methods: {
|
dateParamChange(value) {
|
this.dates = value
|
if(!value.length) {
|
delete this.queryParam.startTime
|
delete this.queryParam.endTime
|
}else{
|
this.queryParam.startTime = moment(this.dates[0]).format('YYYYMMDD')
|
this.queryParam.endTime = moment(this.dates[1]).format('YYYYMMDD')
|
}
|
},
|
|
exportExcel() {
|
$('#EfficiencyShift').table2excel({
|
exclude: '.noExl',
|
name: 'Excel Document Name',
|
filename: '设备加工工件报表',
|
exclude_img: true,
|
fileext: '.xls',
|
exclude_links: true,
|
exclude_inputs: true
|
})
|
},
|
|
searchQuery() {
|
if (this.queryParam.typeTree == '1') {
|
this.queryParam.parentId = this.queryParamEquip.parentId
|
this.queryParam.equipmentId = this.queryParamEquip.equipmentId
|
} else {
|
this.queryParam.parentId = this.queryParamPeople.parentId
|
this.queryParam.equipmentId = ''
|
}
|
this.queryParam.pageNo = 1
|
this.loadData()
|
},
|
|
searchReset() {
|
this.queryParam = {
|
pageSize: 20,
|
pageNo: 1
|
}
|
this.dates = []
|
this.loadData()
|
},
|
|
loadData() {
|
getAction(this.url.list, this.queryParam).then(res => {
|
if (res.success) {
|
this.dataSource = res.result
|
}
|
})
|
},
|
|
/**
|
* 调用接口获取控制系统类型
|
*/
|
getDriveTypeByApi() {
|
api.getDriveTypeApi().then((res) => {
|
this.driveTypeList = res.result.map(item => item.value)
|
})
|
},
|
|
/**
|
* 格式化时间
|
* @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}秒`
|
},
|
|
/**
|
* 分页器页数发生改变时触发
|
* @param page 改变后页数
|
* @param pageSize 改变后每页展示数据条数
|
*/
|
handlePageNoChange(page, pageSize) {
|
this.queryParam.pageNo = page
|
this.loadData()
|
},
|
|
/**
|
* 分页器每页展示数据条数发生改变时触发
|
* @param current 改变后页数
|
* @param size 改变后每页展示数据条数
|
*/
|
handlePageSizeChange(current, size) {
|
this.queryParam.pageSize = size
|
this.loadData()
|
},
|
|
/**
|
* 联想输入框筛选功能
|
* @param input 输入的内容
|
* @param option 配置
|
* @returns {boolean} 判断是否筛选
|
*/
|
filterOption(input, option) {
|
return (
|
option.componentOptions.children[0].text.toUpperCase().indexOf(input.toUpperCase()) >= 0
|
)
|
},
|
|
/**
|
* 当浏览器可视窗口尺寸发生改变时触发
|
*/
|
handleWindowResize(){
|
const boxHeight = +window.getComputedStyle(document.getElementById('EfficiencyShift')).height.slice(0,-2)
|
const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2)
|
this.scrollY = boxHeight - tableHeadHeight
|
}
|
}
|
}
|
</script>
|
<style scoped>
|
.pagination {
|
display: flex;
|
justify-content: end;
|
margin: 20px 0;
|
}
|
|
.device_list{
|
overflow: hidden;
|
display: flex;
|
flex-direction: column;
|
}
|
|
@media screen and (min-width: 1920px){
|
.device_list{
|
height: 811px!important;
|
}
|
}
|
@media screen and (min-width: 1680px) and (max-width: 1920px){
|
.device_list{
|
height: 811px!important;
|
}
|
}
|
@media screen and (min-width: 1400px) and (max-width: 1680px){
|
.device_list{
|
height: 663px!important;
|
}
|
}
|
@media screen and (min-width: 1280px) and (max-width: 1400px){
|
.device_list{
|
height: 564px!important;
|
}
|
}
|
@media screen and (max-width: 1280px){
|
.device_list{
|
height: 564px!important;
|
}
|
}
|
|
</style>
|
