看板模板

FTT.Board.VueUI/src/views/board/chartDemo1/index.vue

@@ -88,9 +88,7 @@
 	.el-row {
 		margin-bottom: 20px;
 
-		&:last-child {
-			margin-bottom: 0;
-		}
+		
 	}
 
 	.el-col {

FTT.Board.VueUI/src/views/board/chartDemo1/left.vue

@@ -2,32 +2,40 @@
   <div class="main-left">
     <div class="border-container">
       <div class="name-title">
-				===
+        <a v-if="chartListLeft[0].tittle">{{chartListLeft[0].tittle}}</a>
+        <a v-else>===</a>
       </div>
       <div id="radar1">
-				<component :is="left1" > </component>
+        <component :is="left1" :id="chartListLeft[0].id "></component>
         <!-- <Edubalance /> -->
-				
       </div>
       <Border />
     </div>
     <div class="border-container">
       <div class="name-title">
-				===
+        <a v-if="chartListLeft[1].tittle">{{chartListLeft[1].tittle}}</a>
+        <a v-else>===</a>
       </div>
       <div id="graduateyear1">
-				
-				<component :is="left2" > </component>
+        <component :is="left2" :id="chartListLeft[1].id "></component>
       </div>
       <ul class="three-pie clearfix">
         <li>
           <div id="sexrate1">
-							<component :is="left3" > </component>
+            <div class="name-title">
+              <a v-if="chartListLeft[2].tittle">{{chartListLeft[2].tittle}}</a>
+              <a v-else>===</a>
+            </div>
+            <component :is="left3" :id=" chartListLeft[2].id "></component>
           </div>
         </li>
         <li>
           <div id="householdrate1">
-							<component :is="left4" > </component>
+            <div class="name-title">
+              <a v-if="chartListLeft[3].tittle">{{chartListLeft[3].tittle}}</a>
+              <a v-else>===</a>
+            </div>
+            <component :is="left4" :id="chartListLeft[3].id "></component>
           </div>
         </li>
       </ul>
@@ -37,22 +45,22 @@
 </template>
 
 <script>
-	import Border from "../chartDemo/border";
-	import Pie from '../../chart/echarts/pie';
-	import Bar from '../../chart/echarts/bar';
-	import chartLine from '../../chart/echarts/line';
-	import Radar from '../../chart/echarts/radar';
-	import Scatter from '../../chart/echarts/scatter';
-	import Graduateyear from '../../chart/echarts/graduateyear';
-	import Sexrate from '../../chart/echarts/sexrate';
-	import Householdrate from '../../chart/echarts/householdrate';
-	import Courserate from '../../chart/echarts/courserate';
-	import Professionrate from '../../chart/echarts/professionrate'
-	import Changedetail from '../../chart/echarts/changedetail'
-	import Juniorservice from '../../chart/echarts/juniorservice'
-	import Edubalance from '../../chart/echarts/edubalance'			
-	
-	export default {
+import Border from "../chartDemo/border";
+import Pie from "../../chart/echarts/pie";
+import Bar from "../../chart/echarts/bar";
+import chartLine from "../../chart/echarts/line";
+import Radar from "../../chart/echarts/radar";
+import Scatter from "../../chart/echarts/scatter";
+import Graduateyear from "../../chart/echarts/graduateyear";
+import Sexrate from "../../chart/echarts/sexrate";
+import Householdrate from "../../chart/echarts/householdrate";
+import Courserate from "../../chart/echarts/courserate";
+import Professionrate from "../../chart/echarts/professionrate";
+import Changedetail from "../../chart/echarts/changedetail";
+import Juniorservice from "../../chart/echarts/juniorservice";
+import Edubalance from "../../chart/echarts/edubalance";
+
+export default {
   components: {
     Pie,
     Border,
@@ -72,16 +80,15 @@
   data() {
     return {
       chart: {
-					BackgroundColor: "#040f3c",
-					
+        BackgroundColor: "#040f3c"
       },
-				id:'id3',
-				chartListLeft:[],
-				left1:'',
-				left2:'',
-				left3:'',
-				left4:''
-			}
+      id: "id3",
+      chartListLeft: JSON.parse(localStorage.getItem("chartListLeft")),
+      left1: "",
+      left2: "",
+      left3: "",
+      left4: ""
+    };
   },
   //  props:[
   // 		'chartListLeft'
@@ -93,82 +100,71 @@
 
   mounted() {
     this.$nextTick(() => {
-				this.chartListLeft = JSON.parse(localStorage.getItem("chartListLeft")) 
+      //	this.chartListLeft =
       this.left1 = this.chartListLeft[0].chartTypeId;
       this.left2 = this.chartListLeft[1].chartTypeId;
       this.left3 = this.chartListLeft[2].chartTypeId;
       this.left4 = this.chartListLeft[3].chartTypeId;
-				console.log("vvvvvvvvvvvvv"+this.left1)
+      console.log("vvvvvvvvvvvvv" + this.left1);
     });
-			
-
-
-
-		},
-		methods: {
-			
-
-
   },
-
-	}
+  methods: {}
+};
 </script>
 
 <style scoped>
-	.main-left {
+.main-left {
   float: left;
   width: 100%;
   padding: 0 10px;
   box-sizing: border-box;
-	}
+}
 
-	.border-container {
+.border-container {
   position: relative;
   margin-top: 15px;
   padding: 10px;
   border: 1px solid #54dcf2;
-	}
-
+}
 
-
-	.name-title {
+.name-title {
   font-size: 20px;
   color: #00ffff;
-	}
+}
 
-	#radar1 {
+#radar1 {
   height: 275px;
-	}
+}
 
-	#dormitorydetail1 {
+#dormitorydetail1 {
   height: 135px;
-	}
+}
 
-	#graduateyear1 {
+#graduateyear1 {
   height: 192px;
-	}
+}
 
-	.three-pie {
+.three-pie {
   border-top: 1px solid #2c768a;
   margin: -10px;
   margin-top: 10px;
   height: 266px;
-	}
+}
 
-	.three-pie li {
+.three-pie li {
   float: left;
   width: 50%;
   border-right: 1px solid #2c768a;
   box-sizing: border-box;
-	}
+}
 
-	.three-pie li:last-child {
+.three-pie li:last-child {
   border-right: none;
-	}
+}
 
-	#sexrate1,
-	#householdrate1 {
-		width:100%;
+#sexrate1,
+#householdrate1 {
+  width: 100%;
   height: 266px;
-	}
+}
 </style>

FTT.Board.VueUI/src/views/board/chartDemo1/main.vue

@@ -2,7 +2,11 @@
   <div class="main-middle">
     <div class="border-container">
       <div id="mapadd1">
-				<component :is="main1" > </component>
+		  <div class="name-title">
+            <a v-if="chartListMain[2].tittle">{{chartListMain[2].tittle}}</a>
+            <a v-else>===</a>
+          </div>
+        <component :is="main1" :id="chartListMain[0].id "></component>
       </div>
 
       <Border />
@@ -11,27 +15,30 @@
       <ul class="teacher-pie clearfix">
         <li>
           <div class="name-title">
-						=======
+            <a v-if="chartListMain[1].tittle">{{chartListMain[1].tittle}}</a>
+            <a v-else>===</a>
           </div>
           <div id="courserate1">
-						<component :is="main2" > </component>
+            <component :is="main2" :id=" chartListMain[1].id "></component>
           </div>
         </li>
         <li>
           <div class="name-title">
-						=======
+            <a v-if="chartListMain[2].tittle">{{chartListMain[2].tittle}}</a>
+            <a v-else>===</a>
           </div>
           <div id="professionrate1">
-						<component :is="main3" > </component>
+            <component :is="main3" :id=" chartListMain[2].id "></component>
           </div>
         </li>
       </ul>
 
       <div class="name-title">
-				===
+        <a v-if="chartListMain[3].tittle">{{chartListMain[3].tittle}}</a>
+        <a v-else>===</a>
       </div>
       <div id="changedetail1">
-				<component :is="main4" > </component>
+        <component :is="main4" :id=" chartListMain[3].id "></component>
       </div>
       <Border />
     </div>
@@ -39,22 +46,22 @@
 </template>
 
 <script>
-	import Border from "../chartDemo/border";
-	import Pie from '../../chart/echarts/pie';
-	import Bar from '../../chart/echarts/bar';
-	import chartLine from '../../chart/echarts/line';
-	import Radar from '../../chart/echarts/radar';
-	import Scatter from '../../chart/echarts/scatter';
-	import Graduateyear from '../../chart/echarts/graduateyear';
-	import Sexrate from '../../chart/echarts/sexrate';
-	import Householdrate from '../../chart/echarts/householdrate';
-	import Courserate from '../../chart/echarts/courserate';
-	import Professionrate from '../../chart/echarts/professionrate'
-	import Changedetail from '../../chart/echarts/changedetail'
-	import Juniorservice from '../../chart/echarts/juniorservice'
-	import Edubalance from '../../chart/echarts/edubalance'			
-	
-	export default {
+import Border from "../chartDemo/border";
+import Pie from "../../chart/echarts/pie";
+import Bar from "../../chart/echarts/bar";
+import chartLine from "../../chart/echarts/line";
+import Radar from "../../chart/echarts/radar";
+import Scatter from "../../chart/echarts/scatter";
+import Graduateyear from "../../chart/echarts/graduateyear";
+import Sexrate from "../../chart/echarts/sexrate";
+import Householdrate from "../../chart/echarts/householdrate";
+import Courserate from "../../chart/echarts/courserate";
+import Professionrate from "../../chart/echarts/professionrate";
+import Changedetail from "../../chart/echarts/changedetail";
+import Juniorservice from "../../chart/echarts/juniorservice";
+import Edubalance from "../../chart/echarts/edubalance";
+
+export default {
   components: {
     Pie,
     Border,
@@ -74,119 +81,106 @@
   data() {
     return {
       chart: {
-					BackgroundColor: "#040f3c",
-					
+        BackgroundColor: "#040f3c"
       },
-				id:'id3',
-				chartListMain:[],
-				main1:'',
-				main2:'',
-				main3:'',
-				main4:''
-			}
+      id: "id3",
+      chartListMain: JSON.parse(localStorage.getItem("chartListMain")),
+      main1: "",
+      main2: "",
+      main3: "",
+      main4: ""
+    };
   },
 
-		
   mounted() {
     this.$nextTick(() => {
-				this.chartListMain = JSON.parse(localStorage.getItem("chartListMain")) 
+      //this.chartListMain =
       this.main1 = this.chartListMain[0].chartTypeId;
       this.main2 = this.chartListMain[1].chartTypeId;
       this.main3 = this.chartListMain[2].chartTypeId;
       this.main4 = this.chartListMain[3].chartTypeId;
-				console.log("vvvvvvvvvvvvv"+this.main1)
+      console.log("vvvvvvvvvvvvv" + this.main1);
     });
-			
-
-
-
   },
-		methods: {
-			
-
-
-		},
-
-	}
+  methods: {}
+};
 </script>
 
 <style scoped>
-	.main-middle {
-
+.main-middle {
   padding: 0 10px;
-	}
+}
 
-	.border-container {
+.border-container {
   position: relative;
   margin-top: 15px;
   padding: 10px;
   border: 1px solid #54dcf2;
-	}
-
+}
 
-	.name-title {
+.name-title {
   font-size: 20px;
   color: #00ffff;
-	}
+}
 
-	#mapadd1 {
+#mapadd1 {
   height: 304px;
-	}
+}
 
-	.number-show {
+.number-show {
   position: absolute;
   top: 20%;
   right: 5%;
-	}
+}
 
-	.number-show span.span-name {
+.number-show span.span-name {
   font-size: 14px;
   color: #fffd51;
-	}
+}
 
-	.number-show span.span-number-show {
+.number-show span.span-number-show {
   font-size: 18px;
   color: #54b5b5;
   font-style: italic;
-	}
+}
 
-	.number-show li {
+.number-show li {
   line-height: 25px;
-	}
+}
 
-	#teacherrate1,
-	#courserate1,
-	#professionrate1 {
+#teacherrate1,
+#courserate1,
+#professionrate1 {
   height: 200px;
-	}
+}
 
-	#agelist1 {
+#agelist1 {
   height: 130px;
-	}
+}
 
-	#changedetail1 {
+#changedetail1 {
   height: 229px;
-	}
+}
 
-	.teacher-pie li:last-child {
+.teacher-pie li:last-child {
   border-right: none;
-	}
+}
 
-	.teacher-pie li .name-title {
+.teacher-pie li .name-title {
   padding-left: 10px;
   padding-top: 10px;
-	}
+}
 
-	.teacher-pie li {
+.teacher-pie li {
   float: left;
   width: 50%;
   border-right: 1px solid #2c768a;
   box-sizing: border-box;
-	}
+}
 
-	.teacher-pie {
+.teacher-pie {
   border-bottom: 1px solid #2c768a;
   margin: -10px;
   margin-bottom: 0;
-	}
+}
 </style>

FTT.Board.VueUI/src/views/board/chartDemo1/right.vue

 <template>
   <div class="main-right">
     <div class="border-container">
-      <div class="name-title">===</div>
+      <div class="name-title">
+        <a v-if="chartListRight[0].tittle">{{chartListRight[0].tittle}}</a>
+        <a v-else>===</a>
+      </div>
       <div style=" height: 275px;">
-        <component :is="right1"></component>
+        <component :is="right1" :id=" chartListRight[0].id "></component>
       </div>
       <Border />
     </div>
     <div class="border-container">
-      <div class="name-title">===</div>
+      <div class="name-title">
+        <a v-if="chartListRight[1].tittle">{{chartListRight[1].tittle}}</a>
+        <a v-else>===</a>
+      </div>
       <div id="juniorservice1">
-        <component :is="right2"></component>
+        <component :is="right2" :id=" chartListRight[1].id "></component>
       </div>
       <Border />
     </div>
     <div class="border-container">
-      <div class="name-title">===</div>
+      <div class="name-title">
+        <a v-if="chartListRight[2].tittle">{{chartListRight[2].tittle}}</a>
+        <a v-else>===</a>
+      </div>
       <div id="edubalance1">
-        <component :is="right3"></component>
+        <component :is="right3" :id="chartListRight[2].id "></component>
       </div>
       <Border />
     </div>
@@ -63,7 +72,7 @@ export default {
         BackgroundColor: "#040f3c"
       },
 
-      chartListRight: [],
+      chartListRight: JSON.parse(localStorage.getItem("chartListRight")),
       right1: "",
       right2: "",
       right3: ""
@@ -72,7 +81,7 @@ export default {
 
   mounted() {
     this.$nextTick(() => {
-      this.chartListRight = JSON.parse(localStorage.getItem("chartListRight"));
+      // this.chartListRight = ;
       this.right1 = this.chartListRight[0].chartTypeId;
       this.right2 = this.chartListRight[1].chartTypeId;
       this.right3 = this.chartListRight[2].chartTypeId;

FTT.Board.VueUI/src/views/chart/echarts/bar/index.vue

@@ -15,7 +15,7 @@ export default {
     return {
       width: 0,
       height: 0,
-      id: "love"
+    //  id: "love"
     };
   },
   mounted() {
@@ -31,7 +31,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //	props: ['chart', 'id'],
+  	props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/changedetail/index.vue

@@ -12,7 +12,7 @@ var echarts = require("echarts");
 export default {
   data() {
     return {
-      id: "changedetail",
+    //  id: "changedetail",
      
     };
   },
@@ -25,7 +25,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/courserate/index.vue

@@ -12,7 +12,7 @@ var echarts = require("echarts");
 export default {
   data() {
     return {
-      id: "courserate",
+      
       data: [
           {
             name: "FK",
@@ -65,7 +65,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/edubalance/index.vue

@@ -12,7 +12,7 @@ var echarts = require("echarts");
 export default {
   data() {
     return {
-      id: "edubalance",
+     // id: "edubalance",
      
     };
   },
@@ -25,7 +25,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+ props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/graduateyear/index.vue

@@ -13,7 +13,7 @@ export default {
   name: "radar",
   data() {
     return {
-      id: "graduateyear"
+    //  id: "graduateyear"
     };
   },
   mounted() {
@@ -25,7 +25,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/householdrate/index.vue

@@ -5,14 +5,12 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
 
 export default {
   data() {
     return {
-      id: "householdrate",
+    //  id: "householdrate",
       data: [
             {
                 name: 'FK',
@@ -60,7 +58,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/juniorservice/index.vue

@@ -5,14 +5,11 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
-
 export default {
   data() {
     return {
-      id: "juniorservice",
+    //  id: "juniorservice",
      
     };
   },
@@ -25,7 +22,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/line/index.vue

@@ -5,10 +5,7 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
-
 export default {
   name: "radar",
   data() {
@@ -95,7 +92,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/pie/index.vue

@@ -5,17 +5,14 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
-
 export default {
   name: "pie",
   data() {
     return {
       width: 0,
       height: 0,
-      id: "pie"
+     // id: "pie"
     };
   },
   mounted() {
@@ -31,7 +28,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  // props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/professionrate/index.vue

@@ -12,7 +12,7 @@ var echarts = require("echarts");
 export default {
   data() {
     return {
-      id: "professionrate",
+     // id: "professionrate",
       data: [
         {
           name: "FK",
@@ -54,7 +54,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/radar/index.vue

@@ -6,21 +6,18 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
-
 export default {
   name: "radar1",
   data() {
     return {
       width: 0,
       height: 0,
-      id: "radar1"
+     // id: "radar1"
     };
   },
   mounted() {
-    console.log(this.width, this.height);
+    console.log(this.id);
 
     this.$nextTick(() => {
       this.setCharcts();
@@ -28,7 +25,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
- // props: ["chart", "id"],
+ props: ["id"],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/scatter/index.vue

@@ -5,10 +5,7 @@
 </template>
 
 <script>
-import Axios from "@/function/axios.js";
-import qs from "qs";
 var echarts = require("echarts");
-
 export default {
   name: "radar",
   data() {
@@ -71,7 +68,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //	props: ['chart', 'id'],
+  props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));

FTT.Board.VueUI/src/views/chart/echarts/sexrate/index.vue

@@ -12,7 +12,7 @@ var echarts = require("echarts");
 export default {
   data() {
     return {
-      id: "sexrate",
+     // id: "sexrate",
       data: [
           {
             name: "PK",
@@ -60,7 +60,7 @@ export default {
   },
 
   //props: [ 'width', 'height','boardstore','chart','id'],
-  //props: ['chart', 'id'],
+ props: [ 'id'],
   methods: {
     setCharcts() {
       var myChart = echarts.init(document.getElementById(this.id));