云模管理系统图表修改

.idea/misc.xml

@@ -12,5 +12,5 @@
       </list>
     </option>
   </component>
-  <component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="false" project-jdk-name="1.8.0_171" project-jdk-type="JavaSDK" />
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_1_8" default="false" project-jdk-name="1.8" project-jdk-type="JavaSDK" />
 </project>

ys_int/src/i18n/lang/en.js

@@ -138,6 +138,7 @@ const lang = {
         theoryCycle: "Theoretical Cycle",
         changeIp: "Change IP",
         IPWrong: "IP address format is incorrect",
+        exportExcel: 'Export Excel',
 	},
 	// 项目管理
     project: {

ys_int/src/i18n/lang/zh.js

@@ -138,6 +138,7 @@ const lang = {
         theoryCycle: "理论周期",
         changeIp: "切换IP",
         IPWrong: "IP地址格式不正确",
+        exportExcel: '导出Excel',
 	},
 	// 项目管理
     project: {

ys_int/src/port.js

@@ -113,6 +113,7 @@ export default {
         setPacket: '/mouldequipment/use',// 云平台下行配置数据包接口
         openingAndClosingTimesChart: '/mouldhistory/openingAndClosingTimesChart', //获取云模盒的每日开合次数图表 (时间/次数)
         openingAndClosingTimesChartCycle: '/mouldhistory/openingAndClosingTimesChartCycle', //获取云模盒的每日开合次数周期 (时间/次数)
+        exportExcel: '/mouldhistory/exportExcel', // 导出excel
     },
     file: {
         view: '/pdffile/getPdfFile' // 文件预览

ys_int/src/views/detection/maintenance.vue

@@ -41,9 +41,16 @@
             </el-col>
             
             <!-- 开合周期 -->
-            <el-col :span="24" class="title">{{$t('runTest.openCycle')}}</el-col>
+            <el-col :span="24" class="title">
+                {{$t('runTest.openCycle')}}
+                <el-button size="small" type="primary" @click="openExport" style="float:right;margin-right: 16px;">
+                    {{$t('runTest.exportExcel')}}
+                </el-button>
+                <el-date-picker v-model="openCycle" style="float:right;width:125px;margin-right:20px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
+                        @change='changeOpen(2)' size="mini" :clearable="false" type="date" :placeholder="$t('el.datepicker.selectDate')"></el-date-picker>
+            </el-col>
             <el-col :span="24">
-                <el-col :span="11">
+                <!-- <el-col :span="11">
                     <div style="padding:0 20px">
                         <b style="font-size:20px;text-align:center;margin-bottom:20px;">{{$t('runTest.openNumChart')}}</b>
                         <el-date-picker v-model="openNum" style="float:right;width:125px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
@@ -54,13 +61,19 @@
                 <el-col :span="11" :offset="2">
                     <div style="padding:0 20px">
                         <b style="font-size:20px;text-align:center;margin-bottom:20px;">{{$t('runTest.openCycleChart')}}</b>
-                        <!-- <el-date-picker v-model="openCycle" style="float:right;width:210px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
-                        @change='changeOpen(2)' size="mini" :clearable="false" type="daterange" 
-                        :start-placeholder="$t('el.datepicker.startDate')" :end-placeholder="$t('el.datepicker.endDate')"></el-date-picker> -->
                         <el-date-picker v-model="openCycle" style="float:right;width:125px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
                         @change='changeOpen(2)' size="mini" :clearable="false" type="date" :placeholder="$t('el.datepicker.selectDate')"></el-date-picker>
                     </div>
                     <div id="myChart2" :style="{ height: '300px'}"></div>
+                </el-col> -->
+
+                <el-col :span="24">
+                    <!-- <div style="padding:0 20px">
+                        <b style="font-size:20px;text-align:center;margin-bottom:20px;">{{$t('runTest.openCycleChart')}}</b>
+                        <el-date-picker v-model="openCycle" style="float:right;width:125px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" 
+                        @change='changeOpen(2)' size="mini" :clearable="false" type="date" :placeholder="$t('el.datepicker.selectDate')"></el-date-picker>
+                    </div> -->
+                    <div id="myChart2" :style="{ height: '300px'}"></div>
                 </el-col>
             </el-col>
 
@@ -160,6 +173,23 @@
                 <el-button type="primary" @click.native="warningArrangement" :loading="warningLoading">{{$t('runTest.process')}}</el-button>
             </div>
         </el-dialog>
+
+         <!--导出界面-->
+        <el-dialog :title="$t('runTest.exportExcel')" v-if="exportFormVisible" :visible.sync="exportFormVisible" width="450px">
+            <div style="text-align:center;">
+                <el-date-picker v-model="exportTime" type="daterange" format="yyyy-MM-dd" value-format="yyyy-MM-dd" :range-separator="$t('mold.to')" :start-placeholder="$t('el.datepicker.startDate')" :end-placeholder="$t('el.datepicker.endDate')"></el-date-picker>
+            </div>
+            <div style="margin:40px 0 0 0;text-align:center;">
+                <el-radio-group v-model="exportType">
+                    <el-radio label="开合次数数据"></el-radio>
+                    <el-radio label="开合历史数据"></el-radio>
+                </el-radio-group>
+            </div>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="exportFormVisible = false">{{$t('el.messagebox.cancel')}}</el-button>
+                <el-button type="primary" @click="exportExcel">{{$t('el.messagebox.confirm')}}</el-button>
+            </span>
+        </el-dialog>
     </section>
 </template>
 
@@ -237,6 +267,10 @@
                 },
                 echarts1: {},
                 echarts2: {},
+
+                exportFormVisible: false,
+                exportTime: [],
+                exportType: '开合次数数据',
             };
         },
         methods: {
@@ -323,8 +357,7 @@
                 res => {
                     if (res.code == "ok") {
                         this.detail = res.data.vo;
-                        this.getEcharts1();
-                        this.getEcharts2();
+                        this.getEcharts();
                         this.mouldName = res.data.vo.modelName;
                         this.mouldState = res.data.vo.state;
                         this.requirement = res.data.vo.isMaintain == 1;
@@ -473,10 +506,10 @@
             },
 
             // 绘制折线图
-            getEcharts1() {
-                this.http.post( this.port.base.openingAndClosingTimesChart, {
-                    equipmentNo: this.detail.equipmentNo,//"898602B5191730002945",
-                    time: this.openNum
+            getEcharts() {
+                this.http.post( this.port.base.openingAndClosingTimesChartCycle, {
+                    equipmentNo: this.detail.equipmentNo,
+                    time: this.openCycle
                 },
                 res => {
                     if (res.code == "ok") {
@@ -484,42 +517,106 @@
                             tooltip: {
                                 trigger: 'axis'
                             },
-                            // grid: {
-                            //     left: '3%',
-                            //     right: '4%',
-                            //     bottom: '6%',
-                            //     containLabel: true
-                            // },
+                            legend: {
+                                data:[this.$t('runTest.maxOpenCycle'),this.$t('runTest.minOpenCycle'),this.$t('runTest.avgOpenCycle'),this.$t('runTest.theoryCycle')]
+                            },
+                            toolbox: {
+                                right: '20',
+                                feature: {
+                                    saveAsImage: {show: true}
+                                }
+                            },
                             xAxis: {
                                 type: 'category',
-                                boundaryGap: false,
                                 data: []
                             },
-                            yAxis: {
-                                name: this.$t('runTest.frequency') ,//+ '（‰）'
-                                type: 'value'
-                            },
-                            dataZoom: [{
-                                type: 'inside',
-                                start: 0,
-                                end: 10
-                            }, {
-                                start: 0,
-                                end: 10,
-                                handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
-                                handleSize: '80%',
-                                handleStyle: {
-                                    color: '#fff',
-                                    shadowBlur: 3,
-                                    shadowColor: 'rgba(0, 0, 0, 0.6)',
-                                    shadowOffsetX: 2,
-                                    shadowOffsetY: 2
+                            yAxis: [
+                                {
+                                    name: this.$t('runTest.sec') + '（s）',
+                                    type: 'value'
+                                },
+                                {
+                                    name: this.$t('runTest.openNum'),
+                                    type: 'value'
+                                },
+                            ],
+                            dataZoom: [
+                                {
+                                    type: 'inside',
+                                    start: 0,
+                                    end: 30
+                                }, {
+                                    start: 0,
+                                    end: 30,
+                                    handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+                                    handleSize: '80%',
+                                    handleStyle: {
+                                        color: '#fff',
+                                        shadowBlur: 3,
+                                        shadowColor: 'rgba(0, 0, 0, 0.6)',
+                                        shadowOffsetX: 2,
+                                        shadowOffsetY: 2
+                                    }
                                 }
-                            }],
+                            ],
                             series: [
                                 {
-                                    name: this.$t('runTest.openNum'),
+                                    name: this.$t('runTest.maxOpenCycle'),
+                                    type: 'line',
+                                    data:[],
+                                    itemStyle : { 
+                                        normal : { 
+                                            color: "#d93a49", //改变折线点的颜色
+                                            lineStyle:{ 
+                                                color: "#d93a49" //改变折线颜色
+                                            } 
+                                        } 
+                                    }
+                                },
+                                {
+                                    name: this.$t('runTest.minOpenCycle'),
+                                    type:'line',
+                                    data:[],
+                                    itemStyle : { 
+                                        normal : { 
+                                            color: "#67E0E3", //改变折线点的颜色
+                                            lineStyle:{ 
+                                                color: "#67E0E3" //改变折线颜色
+                                            } 
+                                        } 
+                                    }
+                                },
+                                {
+                                    name: this.$t('runTest.avgOpenCycle'),
                                     type: 'line',
+                                    data:[],
+                                    itemStyle : { 
+                                        normal : { 
+                                            color: "#7fb80e", //改变折线点的颜色
+                                            lineStyle:{ 
+                                                color: "#7fb80e" //改变折线颜色
+                                            } 
+                                        } 
+                                    }
+                                },
+                                {
+                                    name: this.$t('runTest.theoryCycle'),
+                                    type: 'line',
+                                    data:[],
+                                    itemStyle : { 
+                                        normal : { 
+                                            color: "#f58220", //改变折线点的颜色
+                                            lineStyle:{ 
+                                                color: "#f58220" //改变折线颜色
+                                            } 
+                                        } 
+                                    }
+                                },
+                                {
+                                    name: this.$t('runTest.openNum'),
+                                    type: 'bar',
+                                    barWidth : 30,
+                                    yAxisIndex: 1,
                                     data: [],
                                     itemStyle : { 
                                         normal : { 
@@ -540,154 +637,38 @@
                                 }
                             ]
                         },
-                        list = res.data, 
+                        cycle = res.data.cycle,
+                        runtime = res.data.runtime,
                         xData = [], 
+                        avg = [],
+                        max = [],
+                        min = [],
+                        the = [],
                         sData = [];
 
-                        for(var i in list) {
-                            xData.push(list[i].timeSlot);
-                            sData.push(list[i].runtime)
-                        }
-                        option.xAxis.data = xData;
-                        option.series[0].data = sData;
-
-                        this.drawEchart(1,JSON.stringify(option))
-                    } else {
-                        this.$message({
-                            message: res.msg,
-                            type: "error"
-                        });
-                    }
-                },
-                error => {
-                    this.$message({
-                        message: error,
-                        type: "error"
-                    });
-                });
-            },
-            
-            getEcharts2() {
-                this.http.post( this.port.base.openingAndClosingTimesChartCycle, {
-                    equipmentNo: this.detail.equipmentNo,//"898602B5191730002945",
-                    // startTime: this.openCycle[0],
-                    // endTime: this.openCycle[1]
-                    time: this.openCycle
-                },
-                res => {
-                    if (res.code == "ok") {
-                        var option = {
-                            tooltip: {
-                                trigger: 'axis'
-                            },
-                            // grid: {
-                            //     left: '3%',
-                            //     right: '4%',
-                            //     bottom: '3%',
-                            //     containLabel: true
-                            // },
-                            legend: {
-                                data:[this.$t('runTest.maxOpenCycle'),this.$t('runTest.minOpenCycle'),this.$t('runTest.avgOpenCycle'),this.$t('runTest.theoryCycle')]
-                            },
-                            xAxis: {
-                                type: 'category',
-                                boundaryGap: false,
-                                data: []
-                            },
-                            yAxis: {
-                                name: this.$t('runTest.sec') + '（s）',
-                                type: 'value'
-                            },
-                            dataZoom: [{
-                                type: 'inside',
-                                start: 0,
-                                end: 10
-                            }, {
-                                start: 0,
-                                end: 10,
-                                handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
-                                handleSize: '80%',
-                                handleStyle: {
-                                    color: '#fff',
-                                    shadowBlur: 3,
-                                    shadowColor: 'rgba(0, 0, 0, 0.6)',
-                                    shadowOffsetX: 2,
-                                    shadowOffsetY: 2
-                                }
-                            }],
-                            series: [{
-                                name: this.$t('runTest.maxOpenCycle'),
-                                type: 'line',
-                                // stack: this.$t('runTest.openCycle'),
-                                data:[],
-                                itemStyle : { 
-                                    normal : { 
-                                        color: "#d93a49", //改变折线点的颜色
-                                        lineStyle:{ 
-                                            color: "#d93a49" //改变折线颜色
-                                        } 
-                                    } 
-                                }
-                            },
-                            {
-                                name: this.$t('runTest.minOpenCycle'),
-                                type:'line',
-                                // stack: this.$t('runTest.openCycle'),
-                                data:[],
-                                itemStyle : { 
-                                    normal : { 
-                                        color: "#009ad6", //改变折线点的颜色
-                                        lineStyle:{ 
-                                            color: "#009ad6" //改变折线颜色
-                                        } 
-                                    } 
-                                }
-                            },
-                            {
-                                name: this.$t('runTest.avgOpenCycle'),
-                                type: 'line',
-                                // stack: this.$t('runTest.openCycle'),
-                                data:[],
-                                itemStyle : { 
-                                    normal : { 
-                                        color: "#7fb80e", //改变折线点的颜色
-                                        lineStyle:{ 
-                                            color: "#7fb80e" //改变折线颜色
-                                        } 
-                                    } 
-                                }
-                            },
-                            {
-                                name: this.$t('runTest.theoryCycle'),
-                                type: 'line',
-                                // stack: this.$t('runTest.openCycle'),
-                                data:[],
-                                itemStyle : { 
-                                    normal : { 
-                                        color: "#f58220", //改变折线点的颜色
-                                        lineStyle:{ 
-                                            color: "#f58220" //改变折线颜色
-                                        } 
-                                    } 
-                                }
-                            }]
-                        },
-                        list = res.data, 
-                        xData = [], 
-                        avg = [] , max = [] , min = [] , the = [];
-
-                        for(var i in list) {
+                        for(var i in cycle) {
                             xData.push(i);
-                            max.push(list[i].maxCycle/1000);
-                            min.push(list[i].minCycle/1000);
-                            avg.push(list[i].avgCycle/1000);
-                            the.push(list[i].theoryCycle/1000);
+                            max.push(cycle[i].maxCycle/1000);
+                            min.push(cycle[i].minCycle/1000);
+                            avg.push(cycle[i].avgCycle/1000);
+                            the.push(cycle[i].theoryCycle/1000);
+                            if(runtime.length == 0) {
+                                sData.push(0)
+                            } else {
+                                for(var j in runtime) {
+                                    if(i == j) {
+                                        sData.push(runtime[j].runtime);
+                                        break
+                                    }
+                                }
+                            }
                         }
                         option.xAxis.data = xData;
                         option.series[0].data = max;
                         option.series[1].data = min;
                         option.series[2].data = avg;
                         option.series[3].data = the;
+                        option.series[4].data = sData;
 
                         this.drawEchart(2,JSON.stringify(option));
                     } else {
@@ -705,22 +686,53 @@
                 });
             },
             
-
             drawEchart(type,option) {
-                let myChart = this.echarts.init(document.getElementById("myChart" + type));
-                if(type == 1) {
-                    this.echarts1 = myChart;
-                } else {
-                    this.echarts2 = myChart;
-                }
+                let myChart = this.echarts.init(document.getElementById("myChart2"));
+                this.echarts2 = myChart;
                 myChart.setOption(JSON.parse(option));
             },
 
             changeOpen(type) {
-                if(type == 1) {
-                    this.getEcharts1();
-                } else if(type == 2) {
-                    this.getEcharts2();
+                this.getEcharts();
+            },
+
+            openExport() {
+                this.exportType = '开合次数数据';
+                this.exportTime = [];
+                this.exportFormVisible = true;
+            },
+
+            exportExcel() {
+                if(this.exportTime[0] == null || this.exportTime[1] == null){
+                    this.$message({
+                        message: this.$t('mold.noTime'),
+                        type: "error"
+                    });
+                }else{
+                    this.exportFormVisible = false;
+                    this.http.get( this.port.base.exportExcel+ "?equipmentNo=" + this.detail.equipmentNo 
+                        + "&startTime=" + this.exportTime[0]
+                        + "&endTime=" + this.exportTime[1]
+                        + "&type=" + (this.exportType=='开合次数数据'?0:1),
+                    res => {
+                        if (res.code == "ok") {
+                            let a = document.createElement('a')
+                            a.setAttribute('download', res.data.split("/")[2]);
+                            a.setAttribute("href", res.data);
+                            a.click();
+                        } else {
+                            this.$message({
+                                message: res.msg,
+                                type: "error"
+                            });
+                        }
+                    },
+                    error => {
+                        this.$message({
+                            message: error,
+                            type: "error"
+                        });
+                    });
                 }
             },
         },