Merge branch 'master-500-dev-lushangqing' into 'master-500-dev'

【159】柱线图增加导出数据功能（导出为.csv 文件）



See merge request !94

@@ -86,6 +86,14 @@ export const monitorCustomBarLineChart = {
               ],
               value: 'vertical'
             },
+            {
+              type: 'el-input-number',
+              label: '工具栏右边距',
+              name: 'rightMargin',
+              required: false,
+              placeholder: '',
+              value: 150
+            },
           ]
         },
       ],

@@ -35,7 +35,7 @@ export default {
         },
         toolbox:{
           show:true,
-          right:10,
+          right:150,
           y:5,
           orient:'vertical',
         },
@@ -628,28 +628,20 @@ export default {
       this.options.color = arrColor;
       this.options = Object.assign({}, this.options);
     },
-    //数据视图导出
-    handleExport(){
-      console.log("+++++")
-    },
     //设置数据视图
     setOptionsToolbox(){
       let that=this;
       const optionsSetup = this.optionsSetup;
       const dataView=this.optionsSetup.dataView;
-      this.options.toolbox.show=(dataView==undefined || dataView=='undefined')?true:dataView;
-      this.options.toolbox.toolBoxOrient=this.optionsSetup.toolBoxOrient?this.optionsSetup.toolBoxOrient:'vertical';
+      let rightMargin=this.optionsSetup.rightMargin;
+      this.options.toolbox.right=rightMargin?rightMargin:'150'
+      this.options.toolbox.show=((dataView==undefined || dataView=='undefined')?true:dataView) || ((that.optionsSetup.download==undefined || that.optionsSetup.download=='undefined')?true:that.optionsSetup.download);
+      this.options.toolbox.orient=this.optionsSetup.toolBoxOrient?this.optionsSetup.toolBoxOrient:'horizontal';
       this.options.toolbox.feature= {
         dataView: {
-          show: true, title: '数据视图', readOnly: true, optionToContent: function (opt) {
+          show: (dataView==undefined || dataView=='undefined')?true:dataView, title: '数据视图', readOnly: true, optionToContent: function (opt) {
             let series = opt.series;
-            console.log("***",opt)
             let str='';
-            if(that.optionsSetup.download){
-              str+=`<div style="position: absolute;right: 10px;top: 6px;color:#1e9fff;cursor: pointer;">
-              <span id="handleButton" >导出</span>
-            </div>`;
-            }
             let table =str+ '<table '+that.dataViewTable+'  class="dataViewTable"><thead>' +
               '<tr class="dataViewTr"><td '+that.dataViewThead+'>日期</td>';
             for(let i=0;i<series.length;i++){
@@ -666,6 +658,41 @@ export default {
             table += '</tbody></table>';
             return table;
           }
+        },
+        myTool:{
+          show: (that.optionsSetup.download==undefined || that.optionsSetup.download=='undefined')?true:that.optionsSetup.download,//是否显示
+          title:'导出数据',
+          icon:'path://M992 96H576V75.9c0-40.3-36.9-70.6-76.4-62.8l-448 88.7C21.6 107.7 0 134 0 164.6v694.7c0 30.6 21.7 57 51.8 62.8l448 87.1c39.5 7.7 76.2-22.6 76.2-62.8V928h416c17.7 0 32-14.3 32-32V128c0-17.7-14.3-32-32-32zM134.9 662.5l75.4-142.1c2.4-4.5 2.5-9.9 0.3-14.5l-69.5-143c-2.3-4.8 0.6-10.5 5.8-11.4l45.2-7.9c7.3-1.3 14.5 2.6 17.5 9.4l38.9 90.6c3.7 8.8 6.9 18.5 9.6 29.3h0.8c2.8-10 6.3-20.6 10.5-31.9l52.1-113.2c2.2-4.8 6.6-8.2 11.8-9.1l67.1-11.8c6.6-1.2 11.6 5.8 8.4 11.7L306.9 504.1c-2.6 4.8-2.6 10.7 0 15.5l104.8 189c3.3 5.9-1.8 12.9-8.4 11.8l-72.7-12.8c-5.2-0.9-9.6-4.3-11.8-9.1l-56.5-123.7c-2-4.5-4.1-12.5-6.3-24h-0.8c-1.1 5.6-3.5 13.5-7.2 23.9l-47.3 98.4c-3.1 6.5-10.1 10.1-17.2 8.8l-43-7.5c-5.3-1.2-8.2-7.1-5.6-11.9zM960 856c0 4.4-3.6 8-8 8H576v-88c0-4.4 3.6-8 8-8h96c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8h-96c-4.4 0-8-3.6-8-8v-32c0-4.4 3.6-8 8-8h96c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8h-96c-4.4 0-8-3.6-8-8v-32c0-4.4 3.6-8 8-8h96c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8h-96c-4.4 0-8-3.6-8-8v-32c0-4.4 3.6-8 8-8h96c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8h-96c-4.4 0-8-3.6-8-8v-32c0-4.4 3.6-8 8-8h96c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8h-96c-4.4 0-8-3.6-8-8v-88h376c4.4 0 8 3.6 8 8v688z',
+          onclick:(opt)=>{
+            let series=opt.option.series;
+            let xAxis=opt.option.xAxis;
+            let arr=['日期'];
+            for(let i=0;i<series.length;i++){
+               arr.push(series[i].name?series[i].name:'');
+            }
+            let theadStr='';
+            if(arr.length>1){
+              theadStr=arr.join(',') +'\n'
+            }
+            let tbodyStr='';
+            for(let j=0;j<series[0].data.length;j++){
+              let arr1=[];
+              let arr2=[];
+              arr1.push(xAxis[0].data[j])
+              for(let i=0;i<series.length;i++){
+                arr2.push(series[i].data[j])
+              }
+              let arrc=arr1.concat(arr2)
+              tbodyStr += arrc.join(',') + '\n';
+            }
+            let aType="data:text/csv;charset=utf-8,\ufeff"+theadStr+tbodyStr;
+            let link=document.createElement("a");
+            link.setAttribute("href",aType);
+            let date=new Date().getTime();
+            let filename=new Date(date).toLocaleDateString();
+            link.setAttribute("download",filename+".csv");
+            link.click();
+          }
         }
       }
     },