Commit e8f46dc2 authored by 刘飞's avatar 刘飞

看板添加进度条

parent ad094813
...@@ -46,11 +46,12 @@ export default { ...@@ -46,11 +46,12 @@ export default {
{ ID: 3, Text: "Panle1" ,name:"panle1",src:require("@/assets/image/panle1.jpg")}, { ID: 3, Text: "Panle1" ,name:"panle1",src:require("@/assets/image/panle1.jpg")},
{ ID: 4, Text: "Panle2" ,name:"panle2",src:require("@/assets/image/panle2.jpg")}, { ID: 4, Text: "Panle2" ,name:"panle2",src:require("@/assets/image/panle2.jpg")},
{ ID: 5, Text: "Table1" ,name:"table1",src:require("@/assets/image/table1.jpg")}, { ID: 5, Text: "Table1" ,name:"table1",src:require("@/assets/image/table1.jpg")},
{ ID: 6, Text: "pie" ,name:"pie",src:require("@/assets/image/table1.jpg")}, // { ID: 6, Text: "Table2" ,name:"table2",src:require("@/assets/image/table1.jpg")},
{ ID: 7, Text: "radar" ,name:"雷达图",src:require("@/assets/image/table1.jpg")}, // { ID: 6, Text: "pie" ,name:"pie",src:require("@/assets/image/table1.jpg")},
{ ID: 8, Text: "bar" ,name:"柱状图",src:require("@/assets/image/table1.jpg")}, // { ID: 7, Text: "radar" ,name:"雷达图",src:require("@/assets/image/table1.jpg")},
{ ID: 9, Text: "scatter" ,name:"散点图",src:require("@/assets/image/table1.jpg")}, // { ID: 8, Text: "bar" ,name:"柱状图",src:require("@/assets/image/table1.jpg")},
{ ID: 10, Text: "chartLine" ,name:"折线图",src:require("@/assets/image/table1.jpg")}, // { ID: 9, Text: "scatter" ,name:"散点图",src:require("@/assets/image/table1.jpg")},
// { ID: 10, Text: "chartLine" ,name:"折线图",src:require("@/assets/image/table1.jpg")},
], ],
RefreshTypeCombox: [ RefreshTypeCombox: [
......
...@@ -99,7 +99,7 @@ ...@@ -99,7 +99,7 @@
<el-input-number v-model="ruleForm.RefreshTime" :min="0"></el-input-number> <el-input-number v-model="ruleForm.RefreshTime" :min="0"></el-input-number>
</el-form-item> </el-form-item>
<el-form-item label="刷新类别" v-if="ruleForm.ChartType==5"> <el-form-item label="刷新类别" v-if="ruleForm.ChartType==5 || ruleForm.ChartType==6">
<el-select v-model="ruleForm.RefreshType" placeholder="请选择容器刷新类别"> <el-select v-model="ruleForm.RefreshType" placeholder="请选择容器刷新类别">
<el-option <el-option
v-for="item in comboxstore.RefreshTypeCombox" v-for="item in comboxstore.RefreshTypeCombox"
......
...@@ -80,6 +80,7 @@ import comFoot from "@/views/chart/foot"; ...@@ -80,6 +80,7 @@ import comFoot from "@/views/chart/foot";
import Panle1 from "@/views/chart/Panle1"; import Panle1 from "@/views/chart/Panle1";
import Panle2 from "@/views/chart/Panle2"; import Panle2 from "@/views/chart/Panle2";
import Table1 from "@/views/chart/Table1"; import Table1 from "@/views/chart/Table1";
import Table2 from "@/views/chart/Table1";
import pie from "@/views/chart/echarts/pie/index"; import pie from "@/views/chart/echarts/pie/index";
export default { export default {
name: "board", name: "board",
...@@ -89,6 +90,7 @@ export default { ...@@ -89,6 +90,7 @@ export default {
Panle1, Panle1,
Panle2, Panle2,
Table1, Table1,
Table2,
pie pie
}, },
data() { data() {
......
...@@ -83,6 +83,7 @@ import comFoot from "@/views/chart/foot"; ...@@ -83,6 +83,7 @@ import comFoot from "@/views/chart/foot";
import Panle1 from "@/views/chart/Panle1"; import Panle1 from "@/views/chart/Panle1";
import Panle2 from "@/views/chart/Panle2"; import Panle2 from "@/views/chart/Panle2";
import Table1 from "@/views/chart/Table1"; import Table1 from "@/views/chart/Table1";
import Table2 from "@/views/chart/Table2";
import pie from "@/views/chart/echarts/pie/index"; import pie from "@/views/chart/echarts/pie/index";
import radar from "@/views/chart/echarts/radar/index"; import radar from "@/views/chart/echarts/radar/index";
import bar from "@/views/chart/echarts/bar/index"; import bar from "@/views/chart/echarts/bar/index";
...@@ -96,6 +97,7 @@ export default { ...@@ -96,6 +97,7 @@ export default {
Panle1, Panle1,
Panle2, Panle2,
Table1, Table1,
Table2,
pie, pie,
radar, radar,
bar, bar,
...@@ -155,13 +157,15 @@ export default { ...@@ -155,13 +157,15 @@ export default {
methods: { methods: {
Load(id) { Load(id) {
console.log("请求数据。。。") console.log("请求数据。。。")
// console.log('sdfsdff'+this.GetLayout().TagData);
var me = this; var me = this;
Axios({ Axios({
method: "get", method: "get",
url: me.Api.get.url, url: me.Api.get.url,
params: { MID: id } params: { MID: id }
}).then(res => { }).then(res => {
console.log('rows'+JSON.stringify(res))
if (res.success) { if (res.success) {
me.ruleForm = res.rows[0]; me.ruleForm = res.rows[0];
console.log(JSON.stringify( me.ruleForm)) console.log(JSON.stringify( me.ruleForm))
......
<template> <template>
<div style="font-size:30px" :style="{color:chart.FontColor,background:chart.BackgroundColor}"> <div style="font-size:30px" :style="{color:chart.FontColor,background:chart.BackgroundColor}">
<div style="width:100%"> <div style="width:100%">
<table style="width:100%;height:100%"> <table style="width:100%;height:100%;border-collapse:collapse">
<tr style="height:8%" :style="{fontSize:chart.FontSize1!=0?chart.FontSize1+'px':'30px'}"> <tr style="height:8%" :style="{fontSize:chart.FontSize1!=0?chart.FontSize1+'px':'30px'}">
<td <td
v-for="(item,index) in titlestore" v-for="(item,index) in titlestore"
class="tableclass" class="tableclass"
:key="index" :key="index"
:style="{color:item.Color,width:item.Width+'%'}" :style="{color:item.Color,width:item.Width+'%',border:'1px'+' solid '+item.Color,borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
>{{item.Key}}</td> >{{item.Key}}</td>
</tr> </tr>
<!-- <el-progress :text-inside="true" :stroke-width="20" color="#000" :percentage="90" status="exception"></el-progress> -->
<template v-for="(item,index) in itemdata"> <template v-for="(item,index) in itemdata">
<tr <tr
:key="index" :key="index"
...@@ -19,9 +20,17 @@ ...@@ -19,9 +20,17 @@
<td <td
:key="index1" :key="index1"
class="tableclass" class="tableclass"
:style="{width:getwidth(obj)+'%'}" :style="{width:getwidth(obj)+'%',border:'1px'+' solid '+getfontcolor(item),borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
v-if="obj.Key.indexOf('_')>0" v-if="obj.Key.indexOf('_')>0 && obj.Key.indexOf('_percent')<0"
>{{obj.Value}}</td> >{{obj.Value}}</td>
<td
:key="index1"
class="tableclass"
:style="{width:getwidth(obj)+'%',border:'1px'+' solid '+getfontcolor(item),borderColor:boardstore.BorderColor==null?'red':boardstore.BorderColor}"
v-if="obj.Key.indexOf('_percent')>0"
>
<el-progress :text-inside="true" :stroke-width="20" :color="obj.Key.indexOf('#') ? '#'+obj.Value.split('#')[1] : '#409EFF'" :percentage="obj.Key.indexOf('#') ? parseInt(obj.Value.split('#')[0]) : parseInt(obj.Value)" status="exception"></el-progress>
</td>
</template> </template>
</tr> </tr>
</template> </template>
...@@ -206,6 +215,7 @@ export default { ...@@ -206,6 +215,7 @@ export default {
if (this.chart.RefreshType == 1) { if (this.chart.RefreshType == 1) {
this.itemdata = me._changeDataType(res.rows); this.itemdata = me._changeDataType(res.rows);
} }
console.log('itemdata'+JSON.stringify(me.itemdata))
} else { } else {
console.log(res.message); console.log(res.message);
} }
...@@ -319,6 +329,10 @@ export default { ...@@ -319,6 +329,10 @@ export default {
}; };
</script> </script>
<style > <style >
.el-progress-bar{
display: flex;
align-items: center;
}
.seamless-warp { .seamless-warp {
height: 95%; height: 95%;
overflow: hidden; overflow: hidden;
...@@ -346,6 +360,8 @@ table { ...@@ -346,6 +360,8 @@ table {
} }
.tableclass { .tableclass {
text-align: center; text-align: center;
box-sizing: border-box;
padding:0 10px;
/* border:1px solid blue; */ /* border:1px solid blue; */
/* display: inline-block; */ /* display: inline-block; */
/* 不换行 */ /* 不换行 */
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment