| | |
| | | <template> |
| | | <a-card :bordered="false" class="device_list"> |
| | | <div class="device_list"> |
| | | <!-- 查询区域 --> |
| | | <div style="width: 100%; background-color: #fff" class="table-page-search-wrapper"> |
| | | <div style=" background-color: #fff;overflow: auto" class="table-page-search-wrapper"> |
| | | <a-form layout="inline" @keyup.enter.native="searchQuery"> |
| | | <a-row :gutter="24"> |
| | | <a-row :gutter="24" style="width: 100%;"> |
| | | <a-col :md="7" :sm="7"> |
| | | <a-form-item label="时间"> |
| | | <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD HH:mm:ss" showTime/> |
| | | <a-range-picker @change="dateParamChange" v-model="dates" format="YYYY-MM-DD HH:mm:ss"/> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="4" :sm="4"> |
| | | <a-col :md="5" :sm="5"> |
| | | <a-form-item label="设备编号"> |
| | | <a-input placeholder="输入设备编号查询" v-model="queryParams.equipmentId"></a-input> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="4" :sm="4" :xs="4"> |
| | | <a-col :md="5" :sm="5" :xs="5"> |
| | | <a-form-item label="设备名称"> |
| | | <a-input placeholder="输入设备名称查询" v-model="queryParams.equipmentName"></a-input> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="2" :sm="3" :xs="3"> |
| | | <a-button type="primary" @click="searchQuery" icon="search">查询</a-button> |
| | | </a-col> |
| | | <a-col :md="2" :sm="2" :xs="2"> |
| | | <a-button type="primary" @click="searchReset" icon="reload">重置</a-button> |
| | | <a-space> |
| | | <a-button type="primary" @click="searchQuery" icon="search">查询</a-button> |
| | | <a-button type="primary" @click="searchReset" icon="reload">重置</a-button> |
| | | </a-space> |
| | | </a-col> |
| | | <!--<a-col :md="2" :sm="3" :xs="3">--> |
| | | <!--<a-button type="primary" @click="searchQuery" icon="search">查询</a-button>--> |
| | | <!--</a-col>--> |
| | | <!--<a-col :md="2" :sm="2" :xs="2">--> |
| | | <!--<a-button type="primary" @click="searchReset" icon="reload">重置</a-button>--> |
| | | <!--</a-col>--> |
| | | <!--<a-col :lg="2" :md="3" :sm="3" :xs="3">--> |
| | | <!--<a-button type="primary" @click="exportExcel" icon="download">导出</a-button>--> |
| | | <!--</a-col>--> |
| | |
| | | </div> |
| | | |
| | | <!-- table区域-begin --> |
| | | <div id="DeviceList"> |
| | | <div id="DeviceList" style="flex: 1;overflow: hidden"> |
| | | <a-table ref="table" bordered size="middle" rowKey="id" :columns="columns" |
| | | :scroll="{x:1000}" :dataSource="dataSource" :pagination="ipagination" :loading="loading" |
| | | :dataSource="dataSource" :pagination="ipagination" :loading="loading" |
| | | :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}" |
| | | @change="handleTableChange"> |
| | | @change="handleTableChange" :scroll="{x:'max-content',y:scrollY}"> |
| | | <span slot="action" slot-scope="text, record"> |
| | | <a @click="handleEdit(record)">编辑</a> |
| | | <a-divider type="vertical" /> |
| | |
| | | <!--<device-repair-model-edit ref="modalFormedit" @ok="modalFormOk"></device-repair-model-edit>--> |
| | | <!--<repair-model ref="repairModelFrom" @ok="modalFormOk"></repair-model>--> |
| | | |
| | | </a-card> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | |
| | | queryParamEquip:{}, |
| | | queryParamPeople:{}, |
| | | dataStartsoucre:[], |
| | | scrollY:465, |
| | | /* 分页参数 */ |
| | | ipagination:{ |
| | | current: 1, |
| | | pageSize: 30, |
| | | pageSizeOptions: ['30', '50', '100'], |
| | | showTotal: (total, range) => { |
| | | return range[0] + "-" + range[1] + " 共" + total + "条" |
| | | }, |
| | | showQuickJumper: true, |
| | | showSizeChanger: true, |
| | | total: 0 |
| | | }, |
| | | columns: [ |
| | | { |
| | | title: '设备编号', |
| | | align: 'center', |
| | | dataIndex: 'equipmentId' |
| | | dataIndex: 'equipmentId', |
| | | width:200 |
| | | }, |
| | | { |
| | | title: '设备名称', |
| | | align: 'center', |
| | | dataIndex: 'equipmentName', |
| | | width:250 |
| | | // defaultSortOrder:'descend', |
| | | // sorter: (a, b) => {return a.equipmentName>b.equipmentName?1:-1} |
| | | }, |
| | |
| | | title: '时间', |
| | | align: 'center', |
| | | dataIndex: 'torqueDate', |
| | | width:250 |
| | | // scopedSlots:{customRender:'startTime'}, |
| | | // customRender:(text,row,index) => { |
| | | // return moment(text).format("YYYY-MM-DD HH:mm:ss") |
| | |
| | | { |
| | | title: '扭矩值', |
| | | align: 'center', |
| | | dataIndex: 'torqueValue' |
| | | dataIndex: 'torqueValue', |
| | | width:150 |
| | | }, |
| | | { |
| | | title: '进给参数', |
| | | align: 'center', |
| | | dataIndex: 'feedParameter', |
| | | width:150 |
| | | }, |
| | | { |
| | | title: '备注', |
| | | align: 'center', |
| | | dataIndex: 'notes' |
| | | dataIndex: 'notes', |
| | | width:250 |
| | | }, |
| | | { |
| | | title: '操作', |
| | | dataIndex: 'action', |
| | | scopedSlots: {customRender: 'action'}, |
| | | align: "center", |
| | | width: 150 |
| | | width: 150, |
| | | fixed:'right' |
| | | } |
| | | ], |
| | | url: { |
| | |
| | | Type(valmath){ |
| | | this.dataList = []; |
| | | this.queryParams.typeTree = valmath |
| | | console.log(valmath,'触发Type的watch方法') |
| | | // console.log(this.queryParams.typeTree) |
| | | }, |
| | | nodeTree(val) { //监听currSelected 变化,将变化后的数值传递给 getCurrSelected 事件 |
| | |
| | | onOk(value) { |
| | | console.log('onOk: ', value); |
| | | }, |
| | | /** |
| | | * 查询区域重置按钮 |
| | | */ |
| | | searchReset() { |
| | | if(this.queryParams.typeTree == "1"){ |
| | | console.log('第一个的typeTree',this.queryParams.typeTree) |
| | | this.typeTree = this.queryParams.typeTree |
| | | this.typeParent = this.queryParams.parentId |
| | | this.typeEquipment = this.queryParams.equipmentId |
| | |
| | | this.dates = [] |
| | | this.queryParams.typeTree = this.typeTree |
| | | this.queryParams.parentId = this.typeParent |
| | | console.log('进入第一个') |
| | | if(this.queryParams.parentId != ""){ |
| | | this.queryParams.equipmentId = "" |
| | | }else{ |
| | |
| | | }else{ |
| | | this.queryParams.equipmentId = this.queryParamEquip.equipmentId |
| | | } |
| | | |
| | | } |
| | | |
| | | this.ipagination.current = 1 |
| | | this.ResetloadData(); |
| | | }else{ |
| | | console.log('进入第二个') |
| | | console.log('第二个的typeTree',this.queryParams.typeTree) |
| | | this.typeTree = this.queryParams.typeTree |
| | | this.typeParent = this.queryParams.parentId |
| | | // this.typeEquipment = this.queryParams.equipmentId |
| | |
| | | if(this.queryParams.typeTree == "1"){ |
| | | this.queryParams.parentId = this.queryParamEquip.parentId |
| | | // this.queryParams.equipmentId = this.queryParamEquip.equipmentId |
| | | |
| | | }else{ |
| | | this.queryParams.parentId = this.queryParamPeople.parentId |
| | | |
| | | // this.queryParams.equipmentId = "" |
| | | } |
| | | this.dataSource = []; |
| | |
| | | param.equipmentId = this.queryParams.equipmentId; |
| | | param.startTime = this.queryParam.startTime; |
| | | param.endTime = this.queryParam.endTime; |
| | | // console.log(param); |
| | | console.log('param',param); |
| | | getAction(this.url.list,param).then((res) => { |
| | | if(res.success){ |
| | | this.dataSource = res.result.records||res.result; |
| | |
| | | exclude_inputs: true |
| | | }); |
| | | }, |
| | | |
| | | /** |
| | | * 当浏览器可视窗口尺寸发生改变时触发 |
| | | */ |
| | | handleWindowResize(){ |
| | | const boxHeight = +window.getComputedStyle(document.getElementById('DeviceList')).height.slice(0,-2) |
| | | const tableHeadHeight = +window.getComputedStyle(document.querySelector('.ant-table-thead th')).height.slice(0,-2) |
| | | this.scrollY = boxHeight - tableHeadHeight - 50 |
| | | } |
| | | // /** |
| | | // * 车间选中项取消后触发此事件,由BaseTree组件由事件总线触发 |
| | | // * @param value 提示信息 |
| | | // */ |
| | | // treeClearSelected(value){ |
| | | // this.queryParams.equipmentId='' |
| | | // this.queryParams.parentId='' |
| | | // this.ResetloadData() |
| | | // } |
| | | }, |
| | | created() { |
| | | this.queryParam.typeTree = "1" |
| | | // this.$bus.$on('treeClearSelected',this.treeClearSelected) |
| | | }, |
| | | mounted(){ |
| | | window.addEventListener('resize',this.handleWindowResize) |
| | | this.handleWindowResize() |
| | | }, |
| | | beforeDestroy(){ |
| | | window.removeEventListener('resize',this.handleWindowResize) |
| | | } |
| | | } |
| | | </script> |
| | |
| | | <style lang="less" scoped> |
| | | @import '~@assets/less/common.less'; |
| | | |
| | | .device_list{ |
| | | overflow: hidden; |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | |
| | | @media screen and (min-width: 1920px){ |
| | | .device_list{ |
| | | height: 811px!important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1680px) and (max-width: 1920px){ |
| | | .device_list{ |
| | | height: 811px!important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1400px) and (max-width: 1680px){ |
| | | .device_list{ |
| | | height: 663px!important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1280px) and (max-width: 1400px){ |
| | | .device_list{ |
| | | height: 564px!important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (max-width: 1280px){ |
| | | .device_list{ |
| | | height: 564px!important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | </style> |