优化

@@ -19,4 +19,4 @@ npm run build:prod
 - [avue](https://www.avuejs.com/): 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动
 - [avue](https://www.avuejs.com/): 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动
 - [vue-echarts](https://www.npmjs.com/package/vue-echarts/): vue-echarts是封装后的vue插件,基于 ECharts v4.0.1+ 开发
 - [vue-echarts](https://www.npmjs.com/package/vue-echarts/): vue-echarts是封装后的vue插件,基于 ECharts v4.0.1+ 开发
 - [vue-superslide](https://www.npmjs.com/package/vue-super-slider/): Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本
 - [vue-superslide](https://www.npmjs.com/package/vue-super-slider/): Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本
-- [vuedraggable](https://github.com/SortableJS/Vue.Draggable/): 是一款基于Sortable.js实现的vue拖拽插件。
+  - [vuedraggable](https://github.coqsam/SortableJS/Vue.Draggable/): 是一款基于Sortable.js实现的vue拖拽插件。

 'use strict'
 'use strict'
 module.exports = {
 module.exports = {
   NODE_ENV: '"production"',
   NODE_ENV: '"production"',
-  BASE_API: '"./"'
+  BASE_API: '"http://192.168.0.69:9095"'
 }
 }

@@ -2,6 +2,39 @@ import request from '@/utils/request'
 import { getShareToken, getToken } from "@/utils/auth";
 import { getShareToken, getToken } from "@/utils/auth";
 import axios from 'axios';
 import axios from 'axios';
 
 
+/**
+ * 获取url参数
+ * <p>
+ * 作者： Wang
+ * 时间：2022/1/27 16:15
+ */
+function getQueryVariable(variable) {
+  var query = window.location.search.substring(1);
+  if (query == '') {
+    query = document.location.href
+    let args = query.split('?');
+    let arr = [];
+    if (args && args.length > 1) {
+      arr = args[1].split('&')
+    }
+    for (var i = 0; i < arr.length; i++) {
+      var pair = arr[i].split("=");
+      if (pair[0] == variable) {
+        return pair[1];
+      }
+    }
+    return (false);
+  }
+  var vars = query.split("&");
+  for (var i = 0; i < vars.length; i++) {
+    var pair = vars[i].split("=");
+    if (pair[0] == variable) {
+      return pair[1];
+    }
+  }
+  return (false);
+}
+
 // 保存大屏设计
 // 保存大屏设计
 export function insertDashboard(data) {
 export function insertDashboard(data) {
   return request({
   return request({
@@ -39,6 +72,16 @@ export function detailBysetId(data) {
 
 
 // 获取动态数据
 // 获取动态数据
 export function getData(data) {
 export function getData(data) {
+  let contextData = data.contextData;
+  if(contextData && Object.keys(contextData).length > 0){
+    for(var item in contextData ){
+      let val = getQueryVariable(item);
+      if(val && val != false){
+        contextData[item] = val;
+      }
+    }
+    data.contextData = contextData;
+  }
   return request({
   return request({
     url: 'reportDashboard/getData',
     url: 'reportDashboard/getData',
     method: 'post',
     method: 'post',

@@ -15,6 +15,23 @@
         <!-- 左侧组件栏-->
         <!-- 左侧组件栏-->
         <el-tab-pane label="工具栏">
         <el-tab-pane label="工具栏">
           <!-- <el-divider content-position="center">html</el-divider>-->
           <!-- <el-divider content-position="center">html</el-divider>-->
+<!--          <draggable
+            v-for="widget in widgetTools"
+            :key="widget.code"
+            @end="evt => widgetOnDragged(evt, widget.code)"
+          >
+            <div class="tools-item">
+              <span class="tools-item-icon">
+                <i class="iconfont" :class="widget.icon"></i>
+              </span>
+              <span class="tools-item-text">{{ widget.label }}</span>
+            </div>
+          </draggable>-->
+          <el-collapse v-model="activeNames" accordion>
+            <el-collapse-item name="system" class="collaps_header">
+              <template slot="title">
+                &nbsp;&nbsp;<i class="header-icon el-icon-s-tools"></i>&nbsp;&nbsp;系统组件
+              </template>
               <draggable
               <draggable
                 v-for="widget in widgetTools"
                 v-for="widget in widgetTools"
                 :key="widget.code"
                 :key="widget.code"
@@ -27,6 +44,25 @@
                   <span class="tools-item-text">{{ widget.label }}</span>
                   <span class="tools-item-text">{{ widget.label }}</span>
                 </div>
                 </div>
               </draggable>
               </draggable>
+            </el-collapse-item>
+            <el-collapse-item name="monitor">
+              <template slot="title">
+                &nbsp;&nbsp;<i class="header-icon el-icon-s-check"></i>&nbsp;&nbsp;监控自定义组件
+              </template>
+              <draggable
+                v-for="widget in monitorTools"
+                :key="widget.code"
+                @end="evt => widgetOnDragged(evt, widget.code)"
+              >
+                <div class="tools-item">
+              <span class="tools-item-icon">
+                <i class="iconfont" :class="widget.icon"></i>
+              </span>
+                  <span class="tools-item-text">{{ widget.label }}</span>
+                </div>
+              </draggable>
+            </el-collapse-item>
+          </el-collapse>
         </el-tab-pane>
         </el-tab-pane>
         <!-- 左侧图层-->
         <!-- 左侧图层-->
         <el-tab-pane label="图层">
         <el-tab-pane label="图层">
@@ -286,7 +322,7 @@ import {
   importDashboard,
   importDashboard,
   exportDashboard
   exportDashboard
 } from "@/api/bigscreen";
 } from "@/api/bigscreen";
-import { widgetTools, getToolByCode } from "./tools/index";
+import { widgetTools,monitorTools, getToolByCode } from "./tools/index";
 import widget from "./widget/widget.vue";
 import widget from "./widget/widget.vue";
 import dynamicForm from "./designerComponents/dynamicForm.vue";
 import dynamicForm from "./designerComponents/dynamicForm.vue";
 import draggable from "vuedraggable";
 import draggable from "vuedraggable";
@@ -312,6 +348,8 @@ export default {
       grade: false,
       grade: false,
       layerWidget: [],
       layerWidget: [],
       widgetTools: widgetTools, // 左侧工具栏的组件图标，将js变量加入到当前作用域
       widgetTools: widgetTools, // 左侧工具栏的组件图标，将js变量加入到当前作用域
+      monitorTools:monitorTools,
+      activeNames:'monitor',
       widthLeftForTools: 200, // 左侧工具栏宽度
       widthLeftForTools: 200, // 左侧工具栏宽度
       widthLeftForToolsHideButton: 15, // 左侧工具栏折叠按钮宽度
       widthLeftForToolsHideButton: 15, // 左侧工具栏折叠按钮宽度
       widthLeftForOptions: 300, // 右侧属性配置区
       widthLeftForOptions: 300, // 右侧属性配置区
@@ -879,6 +917,17 @@ export default {
 </script>
 </script>
 
 
 <style scoped lang="scss">
 <style scoped lang="scss">
+.collaps_header{
+
+}
+.collaps_header>div{
+  background-color: none!important;
+  color: white!important;
+}
+.el-collapse-item__content1{
+  background-color: none!important;
+  color: white!important;
+}
 .mr10 {
 .mr10 {
   margin-right: 10px;
   margin-right: 10px;
 }
 }
@@ -1279,4 +1328,5 @@ li {
 /deep/ .vue-ruler-v {
 /deep/ .vue-ruler-v {
   opacity: 0.3;
   opacity: 0.3;
 }
 }
+
 </style>
 </style>

@@ -6,7 +6,7 @@
  * @LastEditors: qianlishi
  * @LastEditors: qianlishi
  * @LastEditTime: 2021-08-29 08:00:59
  * @LastEditTime: 2021-08-29 08:00:59
  */
  */
-import { widgetTool } from "./main"
+import { widgetTool,monitor } from "./main"
 const screenConfig = {
 const screenConfig = {
   code: 'screen',
   code: 'screen',
   type: 'screen',
   type: 'screen',
@@ -70,6 +70,10 @@ const widgetTools = [
   ...widgetTool
   ...widgetTool
 ]
 ]
 
 
+const monitorTools = [
+  ...monitor
+]
+
 const getToolByCode = function (code) {
 const getToolByCode = function (code) {
   // 获取大屏底层设置属性
   // 获取大屏底层设置属性
   if (code == 'screen') {
   if (code == 'screen') {
@@ -79,7 +83,12 @@ const getToolByCode = function (code) {
   var item = widgetTools.find(function (item, index, arrs) {
   var item = widgetTools.find(function (item, index, arrs) {
     return item.code === code
     return item.code === code
   })
   })
+  if(!item){
+    item = monitorTools.find(function (item, index, arrs) {
+      return item.code === code
+    })
+  }
   return item
   return item
 }
 }
 
 
-export {widgetTools, getToolByCode}
+export {widgetTools,monitorTools, getToolByCode}

@@ -40,7 +40,9 @@ import {monitorBasicInformation} from "./echartsConfigJson/monitorConfigJson/mon
 import {monitorDetailTable} from "./echartsConfigJson/monitorConfigJson/monitor-detail-table";
 import {monitorDetailTable} from "./echartsConfigJson/monitorConfigJson/monitor-detail-table";
 import {monitorBgBorder} from "./echartsConfigJson/monitorConfigJson/monitor-bg-border";
 import {monitorBgBorder} from "./echartsConfigJson/monitorConfigJson/monitor-bg-border";
 
 
-export const widgetTool = [
+
+export const {widgetTool,monitor} = {
+  widgetTool : [
     // type=html类型的组件
     // type=html类型的组件
     widgetText,
     widgetText,
     widgetMarquee,
     widgetMarquee,
@@ -67,10 +69,13 @@ export const widgetTool = [
     widgetLineStack,
     widgetLineStack,
     widgetBarCompare,
     widgetBarCompare,
     widgetLineCompare,
     widgetLineCompare,
-  widgetDecoratePie,
+    widgetDecoratePie
+  ],
+  monitor:[
     monitorHealthStatus,
     monitorHealthStatus,
     monitorResourceStatus,
     monitorResourceStatus,
     monitorBasicInformation,
     monitorBasicInformation,
     monitorDetailTable,
     monitorDetailTable,
     monitorBgBorder
     monitorBgBorder
-]
+  ]
+}

@@ -189,7 +189,7 @@ export default {
     viewDesign(val) {
     viewDesign(val) {
       var routeUrl = this.$router.resolve({
       var routeUrl = this.$router.resolve({
         path: "/bigscreen/viewer",
         path: "/bigscreen/viewer",
-        query: { reportCode: val.reportCode }
+        query: { reportCode: val.reportCode ,test:1}
       });
       });
       window.open(routeUrl.href, "_blank");
       window.open(routeUrl.href, "_blank");
     }
     }