周报列表

package.json

@@ -34,7 +34,9 @@
     "echarts": "^4.2.1",
     "element-ui": "2.12.0",
     "file-saver": "^2.0.5",
+    "html2canvas": "^1.4.1",
     "js-cookie": "^2.2.0",
+    "jspdf": "^2.5.1",
     "jszip": "^3.9.1",
     "jszip-utils": "^0.1.0",
     "less-loader": "^6.0.0",

public/cdn/js/circliful.js

@@ -0,0 +1,96 @@
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        define(factory);// AMD
+    } else if (typeof exports === 'object' && typeof module !== 'undefined') {
+        module.exports = factory(); // CommonJS
+    } else {
+        window.Progressbar = factory(); // Browser globals
+    }
+}(this, function () {
+    function Progressbar(options){
+        this.id = options.id;
+        this.value = options.value || 0;
+        this.width = options.width || 200;
+        this.height = options.height || 200;
+        this.bgColor = options.bgColor || '#F0ECEC';
+        this.barColor = options.barColor || '#F9A825';
+        this.fontColor = options.fontColor || '#606266';
+        this.text = options.text || '%'
+        if(options.init){
+            this.init();
+        }
+    }
+    Progressbar.prototype.init = function(){
+        console.log(this.id, '创建的id')
+        var canvas = document.getElementById(this.id);
+        console.log(canvas, '找没找到', document.getElementById(this.id))
+        if(!canvas.getContext) {
+            throw new Error('your browser does not support canvas')
+        }
+
+        if(!this.id){
+            throw new Error('your need pass id ')
+        }
+
+        var width = parseInt(this.width);
+        var height = parseInt(this.height);
+        canvas.setAttribute('width',width);
+        canvas.setAttribute('height',height);
+
+        var ctx = canvas.getContext("2d");
+
+        var startAngle = 3 / 2 * Math.PI;
+        var percentage = 0;
+        var diffAngle = 0;
+        var cx = width / 2;
+        var cy = height / 2;
+        var timer = setInterval(draw, 50);
+        var value = this.value;
+        var bgColor = this.bgColor;
+        var barColor = this.barColor;
+        var fontColor = this.fontColor;
+        var text = this.text;
+
+        function draw(){
+            diffAngle = (percentage / 100) * Math.PI * 2;
+
+            //清除矩形区域
+            ctx.clearRect(0, 0, width, height);
+
+            ctx.beginPath();
+
+            //设置线段宽度
+            ctx.lineWidth = 15;
+
+            //绘制圆
+            ctx.arc(cx, cy, 50, 0, 2 * Math.PI, false);
+
+            //设置填充色
+            ctx.fillStyle = '#FFF';
+            ctx.fill();
+
+            //绘制图形轮廓
+            ctx.strokeStyle = bgColor;
+            ctx.stroke();
+
+            //绘制百分比进度
+            ctx.beginPath();
+            ctx.arc(cx, cy, 50, startAngle, diffAngle + startAngle, false);
+            ctx.strokeStyle = barColor;
+            ctx.stroke();
+
+            //绘制百分比文字
+            ctx.fillStyle = fontColor;
+            ctx.textAlign = 'center';
+            ctx.font = '16px serif';
+            ctx.fillText(percentage + text, cx, cy + 6);
+
+            if (percentage >= value) {
+                clearTimeout(timer);
+            }
+
+            percentage++;
+        }
+    }
+    return Progressbar;
+}));

public/index.html

@@ -15,6 +15,7 @@
   <link rel="stylesheet" href="<%= BASE_URL %>cdn/avue/avue.css">
   <link rel="stylesheet" href="<%= BASE_URL %>cdn/avue/index.css">
   <link rel="icon" href="<%= BASE_URL %>icon1.png">
+  <script src="<%= BASE_URL %>cdn/js/circliful.js"></script>
   <title>AI销讲助手</title>
   <style>
     .el-message .el-icon-success {

src/api/modules/http.js

@@ -1193,4 +1193,14 @@ export function	monthlygetOrgCodeList(params) {
     method: 'get',
     params
   })
+}
+
+
+// 智能报告详情
+export function	monthlyFindDataById(params) {
+  return request({
+    url: 'autoSR/monthly/findDataById',
+    method: 'get',
+    params
+  })
 }

src/router/page/index.js

@@ -57,6 +57,10 @@ export default [{
     {
       path: '/Statistics/createReport',
       component: () => import(/* webpackChunkName: "views" */"@/views/Statistics/createReport")
+    },
+    {
+      path: '/Statistics/reportDetail',
+      component: () => import(/* webpackChunkName: "views" */"@/views/Statistics/reportDetail")
     }
 
   ]

src/views/Statistics/intelligentReporting.vue

@@ -493,8 +493,12 @@ export default {
 
     // 跳转详情
     toDetail(row) {
-      localStorage.setItem("monthlyDetailId", row.id);
-      window.location.href = "${jypath}/monthly/detail";
+      this.$router.push({
+        path: '/Statistics/reportDetail',
+        query: {
+          id: row.id
+        }
+      })
     },
 
     // 生成报告
@@ -512,10 +516,6 @@ export default {
     },
     // 跳转页面
     goCreatReport(data) {
-      // if (data) {
-      //   localStorage.setItem("ruleId", data.id);
-      // }
-      // window.location.href = "${jypath}/monthly/rule";
       this.$router.push({
         path: '/Statistics/createReport',
         query: {