monitor_v3 / anji-plus-report · Commits

Go to a project

Authored by 鲁尚清
Commit 5c12e04656ff5553875eb79d927f46b8dc2615b8 2 parents cad8a1f4 4a1d9318

Merge branch 'master' of http://192.168.1.136:82/monitor_v3/anji-plus-report int… 

…o master-ajreport-lushangqing
Inline Side-by-side
Showing 15 changed files with 157 additions and 50 deletions
@@ -19,4 +19,4 @@ npm run build:prod @@ -19,4 +19,4 @@ npm run build:prod
19 - [avue](https://www.avuejs.com/): 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动 19 - [avue](https://www.avuejs.com/): 用该组件包裹后可以变成拖拽组件,采用相对于父类绝对定位;用键盘的上下左右也可以控制移动
20 - [vue-echarts](https://www.npmjs.com/package/vue-echarts/): vue-echarts是封装后的vue插件,基于 ECharts v4.0.1+ 开发 20 - [vue-echarts](https://www.npmjs.com/package/vue-echarts/): vue-echarts是封装后的vue插件,基于 ECharts v4.0.1+ 开发
21 - [vue-superslide](https://www.npmjs.com/package/vue-super-slider/): Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本 21 - [vue-superslide](https://www.npmjs.com/package/vue-super-slider/): Vue-SuperSlide(Github) 是 SuperSlide 的 Vue 封装版本
22 -- [vuedraggable](https://github.com/SortableJS/Vue.Draggable/): 是一款基于Sortable.js实现的vue拖拽插件。  
  22 + - [vuedraggable](https://github.coqsam/SortableJS/Vue.Draggable/): 是一款基于Sortable.js实现的vue拖拽插件。
@@ -61,7 +61,7 @@ const devWebpackConfig = merge(baseWebpackConfig, { @@ -61,7 +61,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
61 filename: 'index.html', 61 filename: 'index.html',
62 template: 'index.html', 62 template: 'index.html',
63 inject: true, 63 inject: true,
64 - favicon: resolve('static/favicon.ico'), 64 + favicon: resolve('static/hg.png'),
65 title: 'vue-admin-template' 65 title: 'vue-admin-template'
66 }) 66 })
67 ] 67 ]
@@ -60,7 +60,7 @@ const webpackConfig = merge(baseWebpackConfig, { @@ -60,7 +60,7 @@ const webpackConfig = merge(baseWebpackConfig, {
60 filename: config.build.index, 60 filename: config.build.index,
61 template: 'index.html', 61 template: 'index.html',
62 inject: true, 62 inject: true,
63 - favicon: resolve('static/favicon.ico'), 63 + favicon: resolve('static/hg.png'),
64 title: 'vue-admin-template', 64 title: 'vue-admin-template',
65 minify: { 65 minify: {
66 removeComments: true, 66 removeComments: true,
1 'use strict' 1 'use strict'
2 module.exports = { 2 module.exports = {
3 NODE_ENV: '"production"', 3 NODE_ENV: '"production"',
4 - BASE_API: '"./"' 4 + BASE_API: '"http://192.168.0.69:9095"'
5 } 5 }
@@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
4 <head> 4 <head>
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 <meta name="viewport" content="width=device-width,initial-scale=1.0"> 6 <meta name="viewport" content="width=device-width,initial-scale=1.0">
7 - <title>AJ-Report</title> 7 + <title>鸿果页面设计器</title>
8 <link rel='stylesheet' href='./static/luckysheet/plugins/css/pluginsCss.css' /> 8 <link rel='stylesheet' href='./static/luckysheet/plugins/css/pluginsCss.css' />
9 <link rel='stylesheet' href='./static/luckysheet/plugins/plugins.css' /> 9 <link rel='stylesheet' href='./static/luckysheet/plugins/plugins.css' />
10 <link rel='stylesheet' href='./static/luckysheet/css/luckysheet.css' /> 10 <link rel='stylesheet' href='./static/luckysheet/css/luckysheet.css' />
@@ -2,6 +2,39 @@ import request from '@/utils/request' @@ -2,6 +2,39 @@ import request from '@/utils/request'
2 import { getShareToken, getToken } from "@/utils/auth"; 2 import { getShareToken, getToken } from "@/utils/auth";
3 import axios from 'axios'; 3 import axios from 'axios';
4 4
  5 +/**
  6 + * 获取url参数
  7 + * <p>
  8 + * 作者： Wang
  9 + * 时间：2022/1/27 16:15
  10 + */
  11 +function getQueryVariable(variable) {
  12 + var query = window.location.search.substring(1);
  13 + if (query == '') {
  14 + query = document.location.href
  15 + let args = query.split('?');
  16 + let arr = [];
  17 + if (args && args.length > 1) {
  18 + arr = args[1].split('&')
  19 + }
  20 + for (var i = 0; i < arr.length; i++) {
  21 + var pair = arr[i].split("=");
  22 + if (pair[0] == variable) {
  23 + return pair[1];
  24 + }
  25 + }
  26 + return (false);
  27 + }
  28 + var vars = query.split("&");
  29 + for (var i = 0; i < vars.length; i++) {
  30 + var pair = vars[i].split("=");
  31 + if (pair[0] == variable) {
  32 + return pair[1];
  33 + }
  34 + }
  35 + return (false);
  36 +}
  37 +
5 // 保存大屏设计 38 // 保存大屏设计
6 export function insertDashboard(data) { 39 export function insertDashboard(data) {
7 return request({ 40 return request({
@@ -39,6 +72,16 @@ export function detailBysetId(data) { @@ -39,6 +72,16 @@ export function detailBysetId(data) {
39 72
40 // 获取动态数据 73 // 获取动态数据
41 export function getData(data) { 74 export function getData(data) {
  75 + let contextData = data.contextData;
  76 + if(contextData && Object.keys(contextData).length > 0){
  77 + for(var item in contextData ){
  78 + let val = getQueryVariable(item);
  79 + if(val && val != false){
  80 + contextData[item] = val;
  81 + }
  82 + }
  83 + data.contextData = contextData;
  84 + }
42 return request({ 85 return request({
43 url: 'reportDashboard/getData', 86 url: 'reportDashboard/getData',
44 method: 'post', 87 method: 'post',

31.1 KB | W: | H:

368 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
1 <template> 1 <template>
2 <el-scrollbar wrap-class="scrollbar-wrapper"> 2 <el-scrollbar wrap-class="scrollbar-wrapper">
3 <div class="admin-title" @click="goBigScreen"> 3 <div class="admin-title" @click="goBigScreen">
4 - <img src="../../../../../static/logo-dp.png" width="50" class="mt10" /> 4 + <img src="../../../../../static/hg.png" width="50" class="mt10" />
5 </div> 5 </div>
6 <el-menu :show-timeout="200" :default-active="$route.path" :collapse="isCollapse" mode="vertical"> 6 <el-menu :show-timeout="200" :default-active="$route.path" :collapse="isCollapse" mode="vertical">
7 <sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" /> 7 <sidebar-item v-for="route in routes" :key="route.path" :item="route" :base-path="route.path" />
@@ -15,7 +15,7 @@ @@ -15,7 +15,7 @@
15 <!-- 左侧组件栏--> 15 <!-- 左侧组件栏-->
16 <el-tab-pane label="工具栏"> 16 <el-tab-pane label="工具栏">
17 <!-- <el-divider content-position="center">html</el-divider>--> 17 <!-- <el-divider content-position="center">html</el-divider>-->
18 - <draggable 18 +<!-- <draggable
19 v-for="widget in widgetTools" 19 v-for="widget in widgetTools"
20 :key="widget.code" 20 :key="widget.code"
21 @end="evt => widgetOnDragged(evt, widget.code)" 21 @end="evt => widgetOnDragged(evt, widget.code)"
@@ -26,7 +26,43 @@ @@ -26,7 +26,43 @@
26 </span> 26 </span>
27 <span class="tools-item-text">{{ widget.label }}</span> 27 <span class="tools-item-text">{{ widget.label }}</span>
28 </div> 28 </div>
29 - </draggable> 29 + </draggable>-->
  30 + <el-collapse v-model="activeNames" accordion>
  31 + <el-collapse-item name="system" class="collaps_header">
  32 + <template slot="title">
  33 + &nbsp;&nbsp;<i class="header-icon el-icon-s-tools"></i>&nbsp;&nbsp;系统组件
  34 + </template>
  35 + <draggable
  36 + v-for="widget in widgetTools"
  37 + :key="widget.code"
  38 + @end="evt => widgetOnDragged(evt, widget.code)"
  39 + >
  40 + <div class="tools-item">
  41 + <span class="tools-item-icon">
  42 + <i class="iconfont" :class="widget.icon"></i>
  43 + </span>
  44 + <span class="tools-item-text">{{ widget.label }}</span>
  45 + </div>
  46 + </draggable>
  47 + </el-collapse-item>
  48 + <el-collapse-item name="monitor">
  49 + <template slot="title">
  50 + &nbsp;&nbsp;<i class="header-icon el-icon-s-check"></i>&nbsp;&nbsp;监控自定义组件
  51 + </template>
  52 + <draggable
  53 + v-for="widget in monitorTools"
  54 + :key="widget.code"
  55 + @end="evt => widgetOnDragged(evt, widget.code)"
  56 + >
  57 + <div class="tools-item">
  58 + <span class="tools-item-icon">
  59 + <i class="iconfont" :class="widget.icon"></i>
  60 + </span>
  61 + <span class="tools-item-text">{{ widget.label }}</span>
  62 + </div>
  63 + </draggable>
  64 + </el-collapse-item>
  65 + </el-collapse>
30 </el-tab-pane> 66 </el-tab-pane>
31 <!-- 左侧图层--> 67 <!-- 左侧图层-->
32 <el-tab-pane label="图层"> 68 <el-tab-pane label="图层">
@@ -286,7 +322,7 @@ import { @@ -286,7 +322,7 @@ import {
286 importDashboard, 322 importDashboard,
287 exportDashboard 323 exportDashboard
288 } from "@/api/bigscreen"; 324 } from "@/api/bigscreen";
289 -import { widgetTools, getToolByCode } from "./tools/index"; 325 +import { widgetTools,monitorTools, getToolByCode } from "./tools/index";
290 import widget from "./widget/widget.vue"; 326 import widget from "./widget/widget.vue";
291 import dynamicForm from "./designerComponents/dynamicForm.vue"; 327 import dynamicForm from "./designerComponents/dynamicForm.vue";
292 import draggable from "vuedraggable"; 328 import draggable from "vuedraggable";
@@ -312,6 +348,8 @@ export default { @@ -312,6 +348,8 @@ export default {
312 grade: false, 348 grade: false,
313 layerWidget: [], 349 layerWidget: [],
314 widgetTools: widgetTools, // 左侧工具栏的组件图标，将js变量加入到当前作用域 350 widgetTools: widgetTools, // 左侧工具栏的组件图标，将js变量加入到当前作用域
  351 + monitorTools:monitorTools,
  352 + activeNames:'monitor',
315 widthLeftForTools: 200, // 左侧工具栏宽度 353 widthLeftForTools: 200, // 左侧工具栏宽度
316 widthLeftForToolsHideButton: 15, // 左侧工具栏折叠按钮宽度 354 widthLeftForToolsHideButton: 15, // 左侧工具栏折叠按钮宽度
317 widthLeftForOptions: 300, // 右侧属性配置区 355 widthLeftForOptions: 300, // 右侧属性配置区
@@ -879,6 +917,17 @@ export default { @@ -879,6 +917,17 @@ export default {
879 </script> 917 </script>
880 918
881 <style scoped lang="scss"> 919 <style scoped lang="scss">
  920 +.collaps_header{
  921 +
  922 +}
  923 +.collaps_header>div{
  924 + background-color: none!important;
  925 + color: white!important;
  926 +}
  927 +.el-collapse-item__content1{
  928 + background-color: none!important;
  929 + color: white!important;
  930 +}
882 .mr10 { 931 .mr10 {
883 margin-right: 10px; 932 margin-right: 10px;
884 } 933 }
@@ -1279,4 +1328,5 @@ li { @@ -1279,4 +1328,5 @@ li {
1279 /deep/ .vue-ruler-v { 1328 /deep/ .vue-ruler-v {
1280 opacity: 0.3; 1329 opacity: 0.3;
1281 } 1330 }
  1331 +
1282 </style> 1332 </style>
1 /* 1 /*
2 * @Descripttion: 文本json文件 2 * @Descripttion: 文本json文件
3 - * @version: 3 + * @version:
4 * @Author: qianlishi 4 * @Author: qianlishi
5 * @Date: 2021-08-29 06:52:13 5 * @Date: 2021-08-29 06:52:13
6 * @LastEditors: qianlishi 6 * @LastEditors: qianlishi
@@ -179,4 +179,4 @@ export const widgetText = { @@ -179,4 +179,4 @@ export const widgetText = {
179 }, 179 },
180 ], 180 ],
181 } 181 }
182 - }  
  182 + }
1 /* 1 /*
2 * @Descripttion: 主文件 2 * @Descripttion: 主文件
3 - * @version: 3 + * @version:
4 * @Author: qianlishi 4 * @Author: qianlishi
5 * @Date: 2021-08-29 06:43:07 5 * @Date: 2021-08-29 06:43:07
6 * @LastEditors: qianlishi 6 * @LastEditors: qianlishi
7 * @LastEditTime: 2021-08-29 08:00:59 7 * @LastEditTime: 2021-08-29 08:00:59
8 */ 8 */
9 -import { widgetTool } from "./main" 9 +import { widgetTool,monitor } from "./main"
10 const screenConfig = { 10 const screenConfig = {
11 code: 'screen', 11 code: 'screen',
12 type: 'screen', 12 type: 'screen',
@@ -70,6 +70,10 @@ const widgetTools = [ @@ -70,6 +70,10 @@ const widgetTools = [
70 ...widgetTool 70 ...widgetTool
71 ] 71 ]
72 72
  73 +const monitorTools = [
  74 + ...monitor
  75 +]
  76 +
73 const getToolByCode = function (code) { 77 const getToolByCode = function (code) {
74 // 获取大屏底层设置属性 78 // 获取大屏底层设置属性
75 if (code == 'screen') { 79 if (code == 'screen') {
@@ -79,7 +83,12 @@ const getToolByCode = function (code) { @@ -79,7 +83,12 @@ const getToolByCode = function (code) {
79 var item = widgetTools.find(function (item, index, arrs) { 83 var item = widgetTools.find(function (item, index, arrs) {
80 return item.code === code 84 return item.code === code
81 }) 85 })
  86 + if(!item){
  87 + item = monitorTools.find(function (item, index, arrs) {
  88 + return item.code === code
  89 + })
  90 + }
82 return item 91 return item
83 } 92 }
84 93
85 -export {widgetTools, getToolByCode} 94 +export {widgetTools,monitorTools, getToolByCode}
@@ -41,38 +41,43 @@ import {monitorDetailTable} from "./echartsConfigJson/monitorConfigJson/monitor- @@ -41,38 +41,43 @@ import {monitorDetailTable} from "./echartsConfigJson/monitorConfigJson/monitor-
41 import {monitorBgBorder} from "./echartsConfigJson/monitorConfigJson/monitor-bg-border"; 41 import {monitorBgBorder} from "./echartsConfigJson/monitorConfigJson/monitor-bg-border";
42 import {monitorGaugeRate} from "./echartsConfigJson/monitorConfigJson/monitor-gauge-rate"; 42 import {monitorGaugeRate} from "./echartsConfigJson/monitorConfigJson/monitor-gauge-rate";
43 43
44 -export const widgetTool = [  
45 - // type=html类型的组件  
46 - widgetText,  
47 - widgetMarquee,  
48 - widgetHref,  
49 - widgetTime,  
50 - widgetImage,  
51 - // widgetSliders,  
52 - widgetVideo,  
53 - widgetTable,  
54 - widgetIframe,  
55 - // widgetUniversal,  
56 - widgetBarchart,  
57 - widgetGradientBarchart,  
58 - widgetLinechart,  
59 - widgetBarlinechart,  
60 - widgetPiechart,  
61 - widgetFunnel,  
62 - widgetGauge,  
63 - widgetMap,  
64 - WidgetPieNightingale,  
65 - widgetPiePercentage,  
66 - widgetAirbubbleMap,  
67 - widgetBarStack,  
68 - widgetLineStack,  
69 - widgetBarCompare,  
70 - widgetLineCompare,  
71 - widgetDecoratePie,  
72 - monitorHealthStatus,  
73 - monitorResourceStatus,  
74 - monitorBasicInformation,  
75 - monitorDetailTable,  
76 - monitorBgBorder,  
77 - monitorGaugeRate  
78 -] 44 +
  45 +export const {widgetTool,monitor} = {
  46 + widgetTool : [
  47 + // type=html类型的组件
  48 + widgetText,
  49 + widgetMarquee,
  50 + widgetHref,
  51 + widgetTime,
  52 + widgetImage,
  53 + // widgetSliders,
  54 + widgetVideo,
  55 + widgetTable,
  56 + widgetIframe,
  57 + // widgetUniversal,
  58 + widgetBarchart,
  59 + widgetGradientBarchart,
  60 + widgetLinechart,
  61 + widgetBarlinechart,
  62 + widgetPiechart,
  63 + widgetFunnel,
  64 + widgetGauge,
  65 + widgetMap,
  66 + WidgetPieNightingale,
  67 + widgetPiePercentage,
  68 + widgetAirbubbleMap,
  69 + widgetBarStack,
  70 + widgetLineStack,
  71 + widgetBarCompare,
  72 + widgetLineCompare,
  73 + widgetDecoratePie
  74 + ],
  75 + monitor:[
  76 + monitorHealthStatus,
  77 + monitorResourceStatus,
  78 + monitorBasicInformation,
  79 + monitorDetailTable,
  80 + monitorBgBorder,
  81 + monitorGaugeRate
  82 + ]
  83 +}
@@ -189,7 +189,7 @@ export default { @@ -189,7 +189,7 @@ export default {
189 viewDesign(val) { 189 viewDesign(val) {
190 var routeUrl = this.$router.resolve({ 190 var routeUrl = this.$router.resolve({
191 path: "/bigscreen/viewer", 191 path: "/bigscreen/viewer",
192 - query: { reportCode: val.reportCode } 192 + query: { reportCode: val.reportCode ,test:1}
193 }); 193 });
194 window.open(routeUrl.href, "_blank"); 194 window.open(routeUrl.href, "_blank");
195 } 195 }