1

src/api/biz/index.js

@@ -85,5 +85,13 @@ export default {
    */
   libraryList(params) {
     return fetch('/wutong-library/library/page', params)
+  },
+  /**
+   * 获取公众号文章阅读排行
+   * @param params
+   * @returns {Promise | Promise<unknown>}
+   */
+  getPublicArticlePag(params) {
+    return fetch('/wutong-base/publicarticle/bigPag', params)
   }
 }

src/views/home/components/chart2.vue

@@ -1,10 +1,17 @@
 <template>
-  <div>
+  <div class="flex">
+    <div class="block flex-center ml-5">
+      <div class="y">1.</div>
+      <div class="y1">2.</div>
+      <div class="y1">3.</div>
+      <div class="font-10 bold white mt-5">4.</div>
+      <div class="font-10 bold white mt-5">5.</div>
+    </div>
     <charts
       style="margin-top: -40px"
       id="bizchart2"
       height="250px"
-      width="440px"
+      width="430px"
       :option="option"
     />
   </div>
@@ -26,8 +33,8 @@ export default {
         },
         legend: {},
         grid: {
-          left: '3%',
-          right: '4%',
+          left: '1%',
+          right: '5%',
           bottom: '3%',
           containLabel: true
         },
@@ -56,24 +63,24 @@ export default {
             show: false
           },
           type: 'category',
-          data: ['5.', '4.', '3.', '2.', '1.'],
+          data: [],
           axisLine: {
-            show:false,
+            show:true,
             lineStyle: {
               color: "#a4a2a2",
             }
           },
           axisLabel: {
-            // inside: true,
-            // color: '#fff',
+            inside: true,
+            color: '#fff',
             textStyle: {
-              fontSize: "20",
+              fontSize: "15",
               color: function(params,index) {
-               if (index > 1){
-                 return '#FFA100'
-               }else {
+               // if (index > 1){
+               //   return '#FFA100'
+               // }else {
                  return '#FFFFFF'
-               }
+               // }
               },
               fontWeight:'bold'
             },
@@ -95,10 +102,10 @@ export default {
                 barBorderRadius: 20,
                 color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [{
                   offset: 1,
-                  color: 'rgba(134,73,24,0.74)'
+                  color: 'rgba(134,73,24,0.3)'
                 }, {
                   offset: 0,
-                  color: 'rgba(245,126,31,0.74)'
+                  color: 'rgba(245,126,31,0.3)'
                 }]),
               }
             }
@@ -108,15 +115,58 @@ export default {
     }
   },
   created() {
-    // this.timingAcquisition()
+    this.getPublicArticlePag()
   },
   methods: {
-    timingAcquisition() {
-      setInterval(() => {
-
-      }, 10000)
+    getPublicArticlePag() {
+      this.$api.biz.getPublicArticlePag({ current: 1, size: 5}).then(res=>{
+        if (res.code===200){
+          let l = 100
+          let s = 100
+          this.option.yAxis.data = []
+          this.option.series[0].data = []
+          res.data.records.map((item,index)=>{
+            if (index === 0){
+              l = item.intPageReadCount * 0.8
+              s = item.intPageReadCount * 0.5
+            }
+            let title=''
+            if(item.intPageReadCount >= l){
+              if (item.title.length >= 16){
+                title = item.title.substring(0,14)+"..."
+              }else {
+                title=item.title
+              }
+            }else if(item.intPageReadCount >= s) {
+              if (item.title.length >= 11){
+                title = item.title.substring(0,8)+"..."
+              }else {
+                title = item.title
+              }
+            }
+            this.option.yAxis.data.push(title)
+            this.option.series[0].data.push(item.intPageReadCount)
+          })
+          this.option.yAxis.data.reverse()
+          this.option.series[0].data.reverse()
+        }
+      })
     },
 
   }
 }
 </script>
+<style>
+.y {
+  font-size: 20px;
+  font-weight: bold;
+  color: #ffa100;
+  margin-top: 24px;
+}
+.y1 {
+  font-size: 20px;
+  font-weight: bold;
+  color: #ffa100;
+  margin-top: 10px;
+}
+</style>

src/views/home/components/chart4.vue

@@ -100,15 +100,21 @@ export default {
     }
   },
   created() {
-    this.timingAcquisition()
+    this.getPublicArticlePag()
   },
   methods: {
-    timingAcquisition() {
-      setInterval(() => {
-
-      }, 10000)
-    },
-
+    getPublicArticlePag() {
+      this.$api.biz.getPublicArticlePag({current: 1, size: 5}).then(res => {
+        if (res.code === 200) {
+          this.option.series[0].data=[]
+          this.option.series[1].data=[]
+          res.data.records.map(item=>{
+            this.option.series[0].data.push(item.shareCount)
+            this.option.series[1].data.push(item.addToFavCount)
+          })
+        }
+      })
+    }
   }
 }
 </script>

src/views/home/index.vue

@@ -268,8 +268,16 @@ export default {
     const user = userStore()
     return { user }
   },
-  created() {},
-  methods: {}
+  created() {
+    // this.timingAcquisition()
+  },
+  methods: {
+    timingAcquisition() {
+      setInterval(() => {
+        location.reload()
+      }, 900000)
+    }
+  }
 }
 </script>