1

src/views/dynamic/parts/two.vue

@@ -29,30 +29,79 @@ export default {
   },
   methods: {
     ...statistics(['query']),
-    init() {
-      var chartDom = document.getElementById('twoChart');
-      var myChart = echarts.init(chartDom);
-      var option;
-      option = {
-        xAxis: {
-          type: 'category',
-          data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
-        },
-        yAxis: {
-          type: 'value',
-        },
-        series: [
-          {
-            data: [120, 200, 150, 80, 70, 110, 130],
-            type: 'bar',
-            showBackground: true,
-            backgroundStyle: {
-              color: 'rgba(180, 180, 180, 0.2)',
+    async init() {
+      let res = await this.query({ type: 'patent' });
+      if (this.$checkRes(res)) {
+        let viewData = res.data.map((i) => i.name);
+        var chartDom = document.getElementById('twoChart');
+        var myChart = echarts.init(chartDom);
+        const option = {
+          title: {},
+          tooltip: { trigger: 'axis' },
+          grid: {
+            y2: 140,
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: [0, 0.01],
+            name: '申请人',
+            data: viewData,
+            axisLabel: {
+              interval: 0, //横轴信息全部显示
+              rotate: -30, //-30度角倾斜显示
+            },
+            axisTick: {
+              // 坐标轴 刻度
+              show: true, // 是否显示
+              inside: true, // 是否朝内
+              length: 3, // 长度
+              lineStyle: {
+                // 默认取轴线的样式
+                color: 'red',
+                width: 1,
+                type: 'solid',
+              },
             },
           },
-        ],
-      };
-      option && myChart.setOption(option);
+          yAxis: {},
+          series: [
+            {
+              name: 'e专利',
+              label: {
+                show: true,
+                position: 'top',
+              },
+              type: 'bar',
+              itemStyle: {
+                normal: {
+                  color: function (params) {
+                    var colorList = [
+                      '#C1232B',
+                      '#B5C334',
+                      '#FCCE10',
+                      '#E87C25',
+                      '#27727B',
+                      '#FE8463',
+                      '#9BCA63',
+                      '#FAD860',
+                      '#F3A43B',
+                      '#60C0DD',
+                      '#778899',
+                      '#00FFFF',
+                      '#FFEFD5',
+                      '#F08080',
+                      '#DCDCDC',
+                    ];
+                    return colorList[params.dataIndex];
+                  },
+                },
+              },
+              data: res.data,
+            },
+          ],
+        };
+        option && myChart.setOption(option);
+      }
     },
   },
   computed: {