1、车间看板页面缩放和拖拽时增加辅助线
2、驱动参数管理页面调整英文名称字段验证输入字数长度由2-18位调整为为仅验证非空
3、设备日志页面采样周期字段默认值由1000调整为100
4、设备日志页面设备日志列表中若时段状态为关机则不弹出工作曲线
5、设备综合效率分析页面增加表格数据加载动画
6、jQuery.table2excel组件导出表格数据功能增加日期格式的转换
7、设备日志页面工作曲线Y轴增加颜色区分,与对应数据颜色保持一致
8、设备管理页面表单填写界面设备功率增加计量单位kw
| | |
| | | if( rc.flag.length > 0 ) { |
| | | tempRows += "<td> </td>"; // exclude it!! |
| | | } else { |
| | | tempRows += "<td"; |
| | | // 匹配格式为'yyyy-mm'的日期字符串数据,若有其他需求后期再增加 |
| | | var regexPattern = /^\d{4}-\d{2}$/; |
| | | if($(q).html().match(regexPattern)){ |
| | | tempRows += "<td style=\"mso-number-format:'yyyy-mm';\""; |
| | | }else{ |
| | | tempRows += "<td"; |
| | | if(additionalStyles){ |
| | | tempRows += " style='" + additionalStyles + "'"; |
| | | } |
| | | } |
| | | if( rc.rows > 0) { |
| | | tempRows += " rowspan='" + rc.rows + "' "; |
| | | } |
| | | if( rc.cols > 0) { |
| | | tempRows += " colspan='" + rc.cols + "' "; |
| | | } |
| | | if(additionalStyles){ |
| | | tempRows += " style='" + additionalStyles + "'"; |
| | | } |
| | | tempRows += ">" + $(q).html() + "</td>"; |
| | | } |
| | |
| | | |
| | | <a-col :span="7" class="device-status-info"> |
| | | <!--<a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"--> |
| | | <!--@click="handleScreenDevive(item)">--> |
| | | <!--<div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div>--> |
| | | <!--<div class="status-square" :style="{ backgroundColor: item.color }"></div>--> |
| | | <!--<!–<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>–>--> |
| | | <!--<div>{{getDeviceNumberByStatus(item.value) }}</div>--> |
| | | <!--@click="handleScreenDevive(item)">--> |
| | | <!--<div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div>--> |
| | | <!--<div class="status-square" :style="{ backgroundColor: item.color }"></div>--> |
| | | <!--<!–<a-checkbox :checked="item.checked" @change="checkboxChange(item)"></a-checkbox>–>--> |
| | | <!--<div>{{getDeviceNumberByStatus(item.value) }}</div>--> |
| | | <!--</a-space>--> |
| | | <a-space v-for="item in deviceStatusList" :key="item.value" class="single-status-info"> |
| | | <div :style="{color:item.checked?'#1890FF':'#fff'}">{{ item.label }}</div> |
| | |
| | | <!--拖拽设备区域--> |
| | | <div class="content-container" ref="deviceContainerRef" style="overflow: auto"> |
| | | <img :src="imgSrc" width="1920" height="900"> |
| | | <div class="guideline guidelineX" :style="{top:guidelineXTop+'px',display:showGuideline}"></div> |
| | | <div class="guideline guidelineY" :style="{left:guidelineYLeft+'px',display:showGuideline}"></div> |
| | | <VueDragResize |
| | | v-for="(item, index) in deviceList" |
| | | :key="item.equipmentId" |
| | |
| | | :isDraggable="isDraggable" |
| | | :isResizable="isResizable" |
| | | :stickSize="6" |
| | | @deactivated="showGuideline = 'none'" |
| | | > |
| | | <div class="single-device" :style="{ width: item.vw + 'px', height: item.vh + 'px' }" |
| | | @click="openDetail(item)"> |
| | |
| | | timingAcquisition: null, // 定时刷新是否开启 |
| | | parentH: 5000,//父级高度 |
| | | parentW: 1920,//父级宽度 |
| | | showGuideline: 'none', |
| | | guidelineXTop: 0, |
| | | guidelineYLeft: 0, |
| | | deviceList: [ |
| | | // { |
| | | // equipmentId: '123213213123232',// 设备ID |
| | |
| | | // } else { |
| | | // this.deviceList[index].fontSize = 12 |
| | | // } |
| | | this.showGuideline = 'block' |
| | | this.deviceList[index].vw = newRect.width |
| | | this.deviceList[index].vh = newRect.height |
| | | this.deviceList[index].coordinateTop = newRect.top |
| | | this.deviceList[index].coordinateLeft = newRect.left |
| | | this.guidelineXTop = newRect.top + newRect.height / 2 |
| | | this.guidelineYLeft = newRect.left + newRect.width / 2 |
| | | }, |
| | | |
| | | /** |
| | |
| | | width: 100%; |
| | | background-repeat: no-repeat; |
| | | background-size: 100% 100%; |
| | | position: relative; |
| | | |
| | | .guideline{ |
| | | position: absolute; |
| | | border: 1px dashed #ccc; |
| | | } |
| | | |
| | | .guidelineX { |
| | | width: 1920px; |
| | | left: 0; |
| | | } |
| | | |
| | | .guidelineY { |
| | | top: 0; |
| | | height: 900px; |
| | | } |
| | | |
| | | .single-device { |
| | | position: absolute; |
| | |
| | | |
| | | </a-col> |
| | | <a-col :span="12"> |
| | | <a-form-model-item label="设备功率" :labelCol="labelCol" :wrapperCol="wrapperCol"> |
| | | <a-form-model-item label="设备功率(kw)" :labelCol="labelCol" :wrapperCol="wrapperCol"> |
| | | <a-input :disabled="disableSubmit" :readOnly="disableSubmit" allow-clear placeholder="请输入设备功率" |
| | | v-model="model.devicePower"/> |
| | | </a-form-model-item> |
| | |
| | | }, |
| | | labelCol: { |
| | | xs: { span: 24 }, |
| | | sm: { span: 6 }, |
| | | sm: { span: 8 }, |
| | | }, |
| | | wrapperCol: { |
| | | xs: { span: 24 }, |
| | |
| | | <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="5" :sm="5" :xs="5"> |
| | | <a-form-item label="驱动类型"> |
| | | <a-auto-complete |
| | | v-model="queryParam.driveType" |
| | | :data-source="driveTypeList" |
| | | placeholder="请选择驱动类型" |
| | | :filter-option="filterOption" |
| | | /> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="7" :sm="7" :xs="7"> |
| | | <a-form-item label="时间"> |
| | | <a-range-picker |
| | | :placeholder="['开始时间', '结束时间']" |
| | | format="YYYY-MM" |
| | | :value="dates" |
| | | :mode="['month', 'month']" |
| | | @panelChange="dateParamChange" |
| | | @change="handleDateChange" |
| | | /> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="2" :sm="2" :xs="2"> |
| | | <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-space> |
| | | </a-col> |
| | | </a-row> |
| | | </a-form> |
| | | <!-- 查询区域 --> |
| | | <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="5" :sm="5" :xs="5"> |
| | | <a-form-item label="驱动类型"> |
| | | <a-auto-complete |
| | | v-model="queryParam.driveType" |
| | | :data-source="driveTypeList" |
| | | placeholder="请选择驱动类型" |
| | | :filter-option="filterOption" |
| | | /> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="7" :sm="7" :xs="7"> |
| | | <a-form-item label="时间"> |
| | | <a-range-picker |
| | | :placeholder="['开始时间', '结束时间']" |
| | | format="YYYY-MM" |
| | | :value="dates" |
| | | :mode="['month', 'month']" |
| | | @panelChange="dateParamChange" |
| | | @change="handleDateChange" |
| | | /> |
| | | </a-form-item> |
| | | </a-col> |
| | | <a-col :md="2" :sm="2" :xs="2"> |
| | | <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-space> |
| | | </a-col> |
| | | </a-row> |
| | | </a-form> |
| | | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div id="EfficiencyShift" style="flex:1;overflow: hidden"> |
| | | <a-table :columns="columns" rowKey="id" :dataSource="dataSource.records" :pagination="false" :scroll="{x:'max-content',y:scrollY}" bordered></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 id="EfficiencyShift" style="flex:1;overflow: hidden"> |
| | | <a-table :columns="columns" rowKey="id" :dataSource="dataSource.records" :loading="tableLoading" |
| | | :pagination="false" :scroll="{x:'max-content',y:scrollY}" bordered></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> |
| | | |
| | |
| | | align: 'center', |
| | | width: 100, |
| | | dataIndex: 'shift', |
| | | ellipsis: true, |
| | | ellipsis: true |
| | | }, |
| | | { |
| | | title: '每班小时', |
| | |
| | | ], |
| | | dataSource: [], |
| | | driveTypeList: [], |
| | | scrollY:465, |
| | | scrollY: 465, |
| | | tableLoading: false |
| | | } |
| | | }, |
| | | props: { nodeTree: '', Type: '', nodePeople: '' }, |
| | |
| | | this.loadData() |
| | | this.getDriveTypeByApi() |
| | | }, |
| | | mounted(){ |
| | | window.addEventListener('resize',this.handleWindowResize) |
| | | mounted() { |
| | | window.addEventListener('resize', this.handleWindowResize) |
| | | this.handleWindowResize() |
| | | }, |
| | | beforeDestroy(){ |
| | | window.removeEventListener('resize',this.handleWindowResize) |
| | | beforeDestroy() { |
| | | window.removeEventListener('resize', this.handleWindowResize) |
| | | }, |
| | | watch: { |
| | | Type(valmath) { |
| | |
| | | }, |
| | | methods: { |
| | | dateParamChange(value) { |
| | | console.log('dateParamChangeValue',value) |
| | | console.log('dateParamChangeValue', value) |
| | | this.dates = value |
| | | this.queryParam.startTime = moment(this.dates[0]).format('YYYY-MM') |
| | | this.queryParam.endTime = moment(this.dates[1]).format('YYYY-MM') |
| | | }, |
| | | handleDateChange(value){ |
| | | console.log('handleDateChangeValue',value) |
| | | if(!value.length) { |
| | | handleDateChange(value) { |
| | | console.log('handleDateChangeValue', value) |
| | | if (!value.length) { |
| | | delete this.queryParam.startTime |
| | | delete this.queryParam.endTime |
| | | this.dates = [] |
| | |
| | | |
| | | searchReset() { |
| | | this.queryParam = { |
| | | pageSize: 20, |
| | | pageSize: 10000, |
| | | pageNo: 1 |
| | | } |
| | | this.dates = [] |
| | |
| | | }, |
| | | |
| | | loadData() { |
| | | getAction(this.url.list, this.queryParam).then(res => { |
| | | if (res.success) { |
| | | this.dataSource = res.result |
| | | } |
| | | }) |
| | | this.tableLoading = true |
| | | getAction(this.url.list, this.queryParam) |
| | | .then(res => { |
| | | if (res.success) { |
| | | this.dataSource = res.result |
| | | this.tableLoading = false |
| | | } |
| | | }) |
| | | .finally(() => { |
| | | this.tableLoading = false |
| | | }) |
| | | }, |
| | | |
| | | /** |
| | |
| | | /** |
| | | * 当浏览器可视窗口尺寸发生改变时触发 |
| | | */ |
| | | 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) |
| | | 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 |
| | | } |
| | | } |
| | |
| | | margin: 20px 0; |
| | | } |
| | | |
| | | .device_list{ |
| | | .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: 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: 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: 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 (min-width: 1280px) and (max-width: 1400px) { |
| | | .device_list { |
| | | height: 564px !important; |
| | | } |
| | | } |
| | | @media screen and (max-width: 1280px){ |
| | | .device_list{ |
| | | height: 564px!important; |
| | | |
| | | @media screen and (max-width: 1280px) { |
| | | .device_list { |
| | | height: 564px !important; |
| | | } |
| | | } |
| | | |
| | |
| | | import { getAction } from '@/api/manage' |
| | | // import {mapActions} from 'vuex' |
| | | export default { |
| | | components: { |
| | | components: { |
| | | LogList, |
| | | WorkLogList, |
| | | AlarmLogList, |
| | |
| | | }, |
| | | searchQuery() { |
| | | // console.log(this.queryParams.collectTime) |
| | | if (this.queryParams.collectTime != undefined) { |
| | | this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD') |
| | | if (!this.queryParams.equipmentId || !this.queryParams.equipmentName) { |
| | | this.$notification.warning({ |
| | | message: '消息', |
| | | description: '请选择设备' |
| | | }) |
| | | return false |
| | | } |
| | | this.queryChart() |
| | | } else { |
| | | // this.$message.warning("请选择时间") |
| | | console.log('触发提示') |
| | | this.queryParams.collectTimeStr = this.queryParams.collectTime.format('YYYY-MM-DD') |
| | | if (!this.queryParams.equipmentId || !this.queryParams.equipmentName) { |
| | | this.$notification.warning({ |
| | | message: '消息', |
| | | description: '请选择时间' |
| | | description: '请选择设备' |
| | | }) |
| | | return false |
| | | } |
| | | this.queryChart() |
| | | // this.queryList() |
| | | }, |
| | | searchReset() { |
| | | this.queryParams = {} |
| | | this.queryParams = { |
| | | collectTime : moment() |
| | | } |
| | | // this.queryList() |
| | | this.equipment = {} |
| | | this.queryChart() |
| | |
| | | <!-- table区域-begin --> |
| | | <div class="table_logList"> |
| | | <a-table ref="table" bordered size="middle" :rowKey="(record,index)=>{return index}" :columns="columns" |
| | | :dataSource="dataList" :pagination="ipagination" :loading="loadingequip" @change="handleTableChange" :customRow="rowClick"> |
| | | :dataSource="dataList" :pagination="ipagination" :loading="loadingequip" @change="handleTableChange" |
| | | :customRow="rowClick"> |
| | | <template slot="status" slot-scope="status"> |
| | | <div v-if="status == '3' || status == '23'" style="color: #00ee00;width: 100%; height: 100%;">运行</div> |
| | | <div v-else-if="status == '1' || status == '2'" style="color: #ffea91;width: 100%; height: 100%;">待机</div> |
| | |
| | | JeecgListMixin |
| | | } from '@/mixins/JeecgListMixin' |
| | | import moment from 'moment' |
| | | |
| | | export default { |
| | | name: 'LogList', |
| | | mixins: [JeecgListMixin], |
| | |
| | | required: true, |
| | | default: [] |
| | | }, |
| | | loadingequip:{ |
| | | type:Boolean, |
| | | loadingequip: { |
| | | type: Boolean, |
| | | default: false |
| | | } |
| | | }, |
| | | watch:{ |
| | | |
| | | }, |
| | | watch: {}, |
| | | data() { |
| | | return { |
| | | statusName: '', |
| | | disabled: true, |
| | | disableMixinCreated: true, |
| | | loading: false, |
| | | ipagination:{ |
| | | ipagination: { |
| | | current: 1, |
| | | pageSize: 100, |
| | | pageSizeOptions: ['100', '500', '1000'], |
| | | showTotal: (total, range) => { |
| | | return range[0] + "-" + range[1] + " 共" + total + "条" |
| | | return range[0] + '-' + range[1] + ' 共' + total + '条' |
| | | }, |
| | | showQuickJumper: true, |
| | | showSizeChanger: true, |
| | |
| | | { |
| | | title: '开始时间', |
| | | align: 'center', |
| | | dataIndex: 'startTime', |
| | | dataIndex: 'startTime' |
| | | // defaultSortOrder:'descend', |
| | | // sorter: (a, b) => {return a.startTime>b.startTime?1:-1} |
| | | }, |
| | | { |
| | | title: '结束时间', |
| | | align: 'center', |
| | | dataIndex: 'endTime', |
| | | dataIndex: 'endTime' |
| | | // defaultSortOrder:'descend', |
| | | // sorter: (a, b) => {return a.endTime>b.endTime?1:-1} |
| | | }, |
| | |
| | | title: '持续时间', |
| | | align: 'center', |
| | | dataIndex: 'duration', |
| | | customRender:(t,r,index) =>{ |
| | | customRender: (t, r, index) => { |
| | | // console.log(t) |
| | | var ss = parseInt(t) |
| | | if(ss>=3600){ |
| | | if (ss >= 3600) { |
| | | // 根据秒数转换成对应的时分秒 |
| | | const hour = parseInt(ss / 3600) < 10 ? '0' + parseInt(ss / 3600) : parseInt(ss / 3600) |
| | | const min = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60) |
| | | const sec = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60) |
| | | if(min == '00') { |
| | | if(sec == '00'){ |
| | | if (min == '00') { |
| | | if (sec == '00') { |
| | | return hour + '小时' |
| | | }else{ |
| | | return hour + '小时'+ sec + '秒' |
| | | } else { |
| | | return hour + '小时' + sec + '秒' |
| | | } |
| | | |
| | | }else{ |
| | | if(sec == '00') { |
| | | } else { |
| | | if (sec == '00') { |
| | | return hour + '小时' + min + '分' |
| | | }else{ |
| | | } else { |
| | | return hour + '小时' + min + '分' + sec + '秒' |
| | | } |
| | | } |
| | |
| | | // } |
| | | // return hour + '小时' + min + '分' + sec + '秒' |
| | | |
| | | }else if(60<ss && ss<3600){ |
| | | } else if (60 < ss && ss < 3600) { |
| | | const min1 = parseInt(ss % 3600 / 60) < 10 ? '0' + parseInt(ss % 3600 / 60) : parseInt(ss % 3600 / 60) |
| | | const sec1 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60) |
| | | return min1 + '分' + sec1 + "秒" |
| | | }else{ |
| | | return min1 + '分' + sec1 + '秒' |
| | | } else { |
| | | const sec2 = parseInt(ss % 3600 % 60) < 10 ? '0' + parseInt(ss % 3600 % 60) : parseInt(ss % 3600 % 60) |
| | | return sec2 + '秒' |
| | | } |
| | |
| | | //分页、排序、筛选变化时触发 |
| | | //TODO 筛选 |
| | | if (Object.keys(sorter).length > 0) { |
| | | this.isorter.column = sorter.field; |
| | | this.isorter.order = "ascend" == sorter.order ? "asc" : "desc" |
| | | this.isorter.column = sorter.field |
| | | this.isorter.order = 'ascend' == sorter.order ? 'asc' : 'desc' |
| | | } |
| | | this.ipagination = pagination; |
| | | this.ipagination = pagination |
| | | // this.loadData(); |
| | | }, |
| | | /** |
| | |
| | | * @param record 点击的当前行数据 |
| | | * @returns {{on: {click: on.click}}} 添加事件对象 |
| | | */ |
| | | rowClick(record){ |
| | | rowClick(record) { |
| | | return { |
| | | on:{ |
| | | click:()=>{ |
| | | const timeObj={ |
| | | start:moment(record.startTime), |
| | | end:moment(record.endTime) |
| | | on: { |
| | | click: () => { |
| | | // 关机状态设备日志不弹出工作曲线 |
| | | if (record.status === 0) return |
| | | const timeObj = { |
| | | start: moment(record.startTime), |
| | | end: moment(record.endTime) |
| | | } |
| | | this.$bus.$emit('tableRowRecord',timeObj) |
| | | this.$bus.$emit('tableRowRecord', timeObj) |
| | | } |
| | | } |
| | | } |
| | |
| | | |
| | | <style lang="less" scoped> |
| | | @import '~@assets/less/common.less'; |
| | | @media screen and (min-width: 1920px){ |
| | | .table_logList{ |
| | | height: 417px!important; |
| | | |
| | | @media screen and (min-width: 1920px) { |
| | | .table_logList { |
| | | height: 417px !important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1680px) and (max-width: 1920px){ |
| | | .table_logList{ |
| | | height: 417px!important; |
| | | |
| | | @media screen and (min-width: 1680px) and (max-width: 1920px) { |
| | | .table_logList { |
| | | height: 417px !important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1400px) and (max-width: 1680px){ |
| | | .table_logList{ |
| | | height: 266px!important; |
| | | |
| | | @media screen and (min-width: 1400px) and (max-width: 1680px) { |
| | | .table_logList { |
| | | height: 266px !important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (min-width: 1280px) and (max-width: 1400px){ |
| | | .table_logList{ |
| | | height: 360px!important; |
| | | |
| | | @media screen and (min-width: 1280px) and (max-width: 1400px) { |
| | | .table_logList { |
| | | height: 360px !important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | | @media screen and (max-width: 1280px){ |
| | | .table_logList{ |
| | | height: 170px!important; |
| | | |
| | | @media screen and (max-width: 1280px) { |
| | | .table_logList { |
| | | height: 170px !important; |
| | | overflow: scroll; |
| | | } |
| | | } |
| | |
| | | temp.push({ label: item.chineseName, value: item.id, englishName: item.englishName }) |
| | | } |
| | | that.plainOptions = temp |
| | | |
| | | if (temp.length > 0) { |
| | | that.option = [temp[0].value] |
| | | let param = { |
| | | driveType: that.node.driveType, |
| | | equipmentId: that.node.equipmentId, |
| | | date: that.queryParams.paramDateStr, |
| | | start: that.queryParams.startStr, |
| | | end: that.queryParams.endStr, |
| | | interval: that.queryParams.period, |
| | | codeTypeId: that.option.join(',') |
| | | } |
| | | that.initChart(param) |
| | | } |
| | | let param = { |
| | | driveType: that.node.driveType, |
| | | equipmentId: that.node.equipmentId, |
| | | date: that.queryParams.paramDateStr, |
| | | start: that.queryParams.startStr, |
| | | end: that.queryParams.endStr, |
| | | interval: that.queryParams.period, |
| | | codeTypeId: that.option.join(',') |
| | | } |
| | | that.initChart(param) |
| | | } |
| | | }) |
| | | }, |
| | |
| | | this.queryParams = { |
| | | equipmentId: node.equipmentId, |
| | | equipmentName: node.equipmentName, |
| | | period: 1000, |
| | | period: 100, |
| | | paramDate: paramDate, |
| | | paramDateStr: paramDate.format('yyyy-MM-DD'), |
| | | start: start, |
| | |
| | | position: 'left', |
| | | boundaryGap: [0, '15%'], |
| | | axisLine: { |
| | | show: true |
| | | // lineStyle:{ |
| | | // color:'#000000' |
| | | // } |
| | | show: true, |
| | | lineStyle:{ |
| | | color:'#5470C6' |
| | | } |
| | | } |
| | | }, |
| | | { |
| | |
| | | position: 'left', |
| | | boundaryGap: [0, '15%'], |
| | | axisLine: { |
| | | show: true |
| | | // lineStyle:{ |
| | | // color:'#000000' |
| | | // } |
| | | show: true, |
| | | lineStyle:{ |
| | | color:'#91CC75' |
| | | } |
| | | } |
| | | }, |
| | | { |
| | |
| | | position: 'left', |
| | | boundaryGap: [0, '15%'], |
| | | axisLine: { |
| | | show: true |
| | | // lineStyle:{ |
| | | // color:'#000000' |
| | | // } |
| | | show: true, |
| | | lineStyle:{ |
| | | color:'#FAC858' |
| | | } |
| | | } |
| | | } |
| | | ], |
| | |
| | | temp.push(item) |
| | | } |
| | | } |
| | | console.log('temp',temp) |
| | | getAction(this.url.workChart, param).then((res) => { |
| | | if (JSON.stringify(res.result) == '[]' || res.result == null) { |
| | | // this.$message.warning('无数据!') |
| | |
| | | symbol: 'circle', |
| | | symbolSize: 10, |
| | | yAxisIndex: i, |
| | | |
| | | data: itemLine |
| | | } |
| | | result.push(line) |
| | | |
| | | } |
| | | console.log('result===========',result) |
| | | console.log('legend=============',lengenddata) |
| | | // option.yAxis = Yarr; |
| | | option.series = result |
| | | option.legend = lengenddata |
| | |
| | | ], |
| | | englishName: [ |
| | | { required: true, message: '请输入英文名称!' }, |
| | | { pattern: /^.{2,18}$/, message: '请输入2到18位任意字符!' ,trigger:'blur'}, |
| | | // { pattern: /^.{2,24}$/, message: '请输入2到24位任意字符!' ,trigger:'blur'}, |
| | | ], |
| | | showFlag: [ |
| | | { required: true, message: '请输入显示标志!' }, |