Merge branch 'master' of http://118.190.145.217:3000/xiaojincai/zky-admin

src/views/Index.vue

@@ -5,32 +5,39 @@
         <div class="item-img">
           <img src="../assets/book.png" alt="" />
           <span class="text">
-            期刊总数 <br /><span class="count">{{form.journal_total}}</span></span
+            期刊总数 <br /><span class="count">{{
+              form.journal_total
+            }}</span></span
           >
         </div>
         <div class="item-img">
           <img src="../assets/network.png" alt="" />
           <span class="text">
-            文章发布量 <br /><span class="count">{{form.article_total}}</span></span
+            文章发布量 <br /><span class="count">{{
+              form.article_total
+            }}</span></span
           >
         </div>
       </div>
       <div class="header-item">
         <div class="item-text">
           <div>
-            <span class="text">会议举办次数</span><span class="count">{{form.conference_total}}</span>
+            <span class="text">会议举办次数</span
+            ><span class="count">{{ form.conference_total }}</span>
           </div>
           <div>
             <span class="text">活动举办次数</span>
-            <span class="count">{{form.activity_total}}</span>
+            <span class="count">{{ form.activity_total }}</span>
           </div>
         </div>
         <div class="item-text">
           <div>
-            <span class="text">总阅读次数</span><span class="count">{{form.article_readnum}}</span>
+            <span class="text">总阅读次数</span
+            ><span class="count">{{ form.article_readnum }}</span>
           </div>
           <div>
-            <span class="text">转发次数</span><span class="count">{{form.article_forwardnum}}</span>
+            <span class="text">转发次数</span
+            ><span class="count">{{ form.article_forwardnum }}</span>
           </div>
         </div>
       </div>
@@ -80,10 +87,10 @@
               <span>文章标题</span>
               <span>阅读次数</span>
             </div>
-            <div class="con2" v-for="(item, index) in list" :key="index">
+            <div class="con2" v-for="(item, index) in form.article_readnum_top5" :key="index">
               <span>{{ index + 1 }}</span>
-              <span>{{ item.article_header }}</span>
-              <span>{{ item.count }}</span>
+              <span>{{ item.name }}</span>
+              <span>{{ item.read_num }}</span>
             </div>
             <div></div>
           </div>
@@ -113,7 +120,8 @@ import echarts from "echarts";
 export default {
   data() {
     return {
-      form:{},
+      //   chartData: [],
+      form: {},
       list: [
         { article_header: "中国生态效率时空演化研究", count: "132" },
         { article_header: "中国生态效率时空演化研究", count: "132" },
@@ -123,6 +131,8 @@ export default {
       ],
     };
   },
+  computed: {
+  },
   methods: {
     getEcharts() {
       var myChart = this.$echarts.init(this.$refs.subject);
@@ -161,7 +171,7 @@ export default {
         // },
         series: [
           {
-            name: "访问来源",
+            name: "期刊数量",
             type: "pie",
             radius: "55%",
             center: ["50%", "50%"],
@@ -174,7 +184,7 @@ export default {
             // ].sort(function (a, b) {
             //   return a.value - b.value;
             // }),
-            data: this.form.subject_journal,
+            data: this.form.subject_journal.sort(function(a,b){return a.value-b.value}),
             roseType: "radius",
             label: {
               color: "rgba(102, 102, 102,1)",
@@ -222,7 +232,8 @@ export default {
         xAxis: [
           {
             type: "category",
-            data: ["Mon", "Tue", "Wed", "Thu"],
+            // data: ["Mon", "Tue", "Wed", "Thu"],
+            data: this.form.organizer_journal_x,
 
             axisTick: {
               alignWithLabel: true,
@@ -236,7 +247,8 @@ export default {
             },
             axisLabel: {
               formatter: function (val) {
-                return "中国科"; //对每个标签处理后的结果（通过js字符串方法处理）
+                // return "中国科"; //对每个标签处理后的结果（通过js字符串方法处理）
+                return val;
               },
               // x轴字体颜色
               textStyle: {
@@ -277,10 +289,11 @@ export default {
         ],
         series: [
           {
-            name: "直接访问",
+            name: "期刊数量",
             type: "bar",
             barWidth: "40%",
-            data: [10, 52, 200, 334],
+            // data: [10, 52, 200, 334],
+            data: this.form.organizer_journal_y,
             itemStyle: {
               //柱形图圆角，鼠标移上去效果，如果只是一个数字则说明四个参数全部设置为那么多
               normal: {
@@ -327,7 +340,8 @@ export default {
           axisLine: {
             show: false,
           },
-          data: ["应用物理", "应用物理", "应用物理", "应用物理", "应用物理"],
+        //   data: ["应用物理", "应用物理", "应用物理", "应用物理", "应用物理"],
+          data: this.form.journal_article_x,
         },
         series: [
           // {
@@ -336,9 +350,10 @@ export default {
           //     data: [18203, 23489, 29034, 104970, 131744]
           // },
           {
-            name: "2012年",
+            name: "文章数量",
             type: "bar",
-            data: [19325, 23438, 31000, 121594, 134141],
+            // data: [19325, 23438, 31000, 121594, 134141],
+            data: this.form.journal_article_y,
             barWidth: "30%",
             itemStyle: {
               //柱形图圆角，鼠标移上去效果，如果只是一个数字则说明四个参数全部设置为那么多
@@ -401,15 +416,17 @@ export default {
             type: "pie",
             radius: "55%",
             center: ["50%", "50%"],
-            data: [
-              { value: 335, name: "直接访问" },
-              { value: 310, name: "邮件营销" },
-              { value: 274, name: "联盟广告" },
-              { value: 235, name: "视频广告" },
-              { value: 400, name: "搜索引擎" },
-            ].sort(function (a, b) {
-              return a.value - b.value;
-            }),
+            // data: [
+            //   { value: 335, name: "直接访问" },
+            //   { value: 310, name: "邮件营销" },
+            //   { value: 274, name: "联盟广告" },
+            //   { value: 235, name: "视频广告" },
+            //   { value: 400, name: "搜索引擎" },
+            // ].sort(function (a, b) {
+            //   return a.value - b.value;
+            // }),
+            // data:this.form.journal_article.sort(function(a,b){return a.value-b.value}),
+            data:this.form.journal_article,
             roseType: "radius",
             label: {
               color: "rgba(102, 102, 102,1)",
@@ -457,11 +474,12 @@ export default {
               // type:'dotted',
             },
           },
-          data: ["", "", "", "", "", "", ""],
+        //   data: ["1", "2", "3", "", "", "", ""],
+          data: this.form.pubtime_article_x,
           axisLabel: {
             formatter: function (val) {
-              console.log(val, "");
-              return "中国科学院成都生物研究所  中国科学院成都生物研究所"; //对每个标签处理后的结果（通过js字符串方法处理）
+            //   return "中国科学院成都生物研究所  中国科学院成都生物研究所"; //对每个标签处理后的结果（通过js字符串方法处理）
+            return val
             },
             // x轴字体颜色
             textStyle: {
@@ -492,7 +510,8 @@ export default {
         },
         series: [
           {
-            data: [50, 200, 20, 300, 150, 300, 100],
+            // data: [50, 200, 20, 300, 150, 300, 100],
+            data: this.form.pubtime_article_y,
             type: "line",
             symbol: "none", //取消折点圆圈
             areaStyle: {
@@ -539,7 +558,8 @@ export default {
         xAxis: [
           {
             type: "category",
-            data: ["", "", "", "", "", ""],
+            // data: ["", "", "", "", "", ""],
+            data: this.form.organizer_conference_x,
 
             axisTick: {
               alignWithLabel: true,
@@ -553,8 +573,8 @@ export default {
             },
             axisLabel: {
               formatter: function (val) {
-                console.log(val, "");
-                return "中国科"; //对每个标签处理后的结果（通过js字符串方法处理）
+                // return "中国科"; //对每个标签处理后的结果（通过js字符串方法处理）
+                return val;
               },
               // x轴字体颜色
               textStyle: {
@@ -595,10 +615,11 @@ export default {
         ],
         series: [
           {
-            name: "直接访问",
+            name: "会议数量",
             type: "bar",
             barWidth: "40%",
-            data: [50, 52, 200, 334, 45, 190, 240],
+            // data: [50, 52, 200, 334, 45, 190, 240],
+            data: this.form.organizer_conference_y,
             itemStyle: {
               //柱形图圆角，鼠标移上去效果，如果只是一个数字则说明四个参数全部设置为那么多
               normal: {
@@ -629,11 +650,11 @@ export default {
               // type:'dotted',
             },
           },
-          data: ["1", "1", "1", "1", "1", "1", "1"],
+        //   data: ["1", "1", "1", "1", "1", "1", "1"],
+          data: this.form.pubtime_conference_x,
           axisLabel: {
             formatter: function (val) {
-              //data对应每一项数据
-              return "中国科学院成都生物研究所  中国科学院成都生物研究所"; //对每个标签处理后的结果（通过js字符串方法处理）
+              return val;
             },
             // x轴字体颜色
             textStyle: {
@@ -664,7 +685,8 @@ export default {
         },
         series: [
           {
-            data: [50, 200, 20, 300, 150, 300, 100],
+            // data: [50, 200, 20, 300, 150, 300, 100],
+            data: this.form.pubtime_conference_y,
             type: "line",
             symbol: "none", //取消折点圆圈
             areaStyle: {
@@ -701,15 +723,54 @@ export default {
     },
     getData() {
       this.$api.getIndexData({}).then((res) => {
-          this.form = res.data.data;
-          this.$set(this.form,"subject_journal",res.data.data.subject_journal)
+        this.form = res.data.data;
+        let organizer_journal_x = [];
+        let organizer_journal_y = [];
+        let journal_article_x = [];
+        let journal_article_y = [];
+        let pubtime_article_x = [];
+        let pubtime_article_y = [];
+        let organizer_conference_x = [];
+        let organizer_conference_y = [];
+        let pubtime_conference_x = [];
+        let pubtime_conference_y = [];
+        this.form.organizer_journal.forEach((item,index)=>{
+            organizer_journal_x.push(item.name)
+            organizer_journal_y.push(item.value)
+        })
+        this.form.journal_article.forEach((item,index)=>{
+            journal_article_x.push(item.journal_name)
+            journal_article_y.push(item.count)
+        })
+        this.form.pubtime_article.forEach((item,index)=>{
+            pubtime_article_x.push(item.publish_time)
+            pubtime_article_y.push(item.count)
+        })
+        this.form.organizer_conference.forEach((item,index)=>{
+            organizer_conference_x.push(item.organizer_name)
+            organizer_conference_y.push(item.count)
+        })
+        this.form.pubtime_conference.forEach((item,index)=>{
+            pubtime_conference_x.push(item.publish_time)
+            pubtime_conference_y.push(item.count)
+        })
+        this.form.organizer_journal_x = organizer_journal_x
+        this.form.organizer_journal_y = organizer_journal_y
+        this.form.journal_article_x = journal_article_x
+        this.form.journal_article_y = journal_article_y
+        this.form.pubtime_article_x = pubtime_article_x
+        this.form.pubtime_article_y = pubtime_article_y
+        this.form.organizer_conference_x = organizer_journal_x
+        this.form.organizer_conference_y = organizer_journal_y
+        this.form.pubtime_conference_x = pubtime_conference_x
+        this.form.pubtime_conference_y = pubtime_conference_y
+        this.getEcharts();
       });
     },
   },
   mounted() {
-    this.getEcharts();
   },
-  created() {
+  created(){
     this.getData();
   },
 };