From e9342e7796004e4babdf0b085a5ccae791d4a3ae Mon Sep 17 00:00:00 2001
From: wenlele <wen.lele@free-sun.com.cn>
Date: Fri, 16 Sep 2022 10:35:15 +0800
Subject: [PATCH] qiniu

---
 .../problem/components/inspection.jsx         | 34 +++++++++++++++++++
 .../problem/components/statistics.jsx         | 33 ++++++++++--------
 .../sections/problem/containers/dataAlarm.jsx |  7 ++--
 web/config.js                                 | 20 ++++++++++-
 web/middlewares/attachment.js                 | 23 +++++++++++++
 web/package.json                              |  3 +-
 web/routes/attachment/index.js                | 20 +++++++++++
 7 files changed, 122 insertions(+), 18 deletions(-)
 create mode 100644 web/client/src/sections/problem/components/inspection.jsx
 create mode 100644 web/middlewares/attachment.js

diff --git a/web/client/src/sections/problem/components/inspection.jsx b/web/client/src/sections/problem/components/inspection.jsx
new file mode 100644
index 0000000..e7ef8c9
--- /dev/null
+++ b/web/client/src/sections/problem/components/inspection.jsx
@@ -0,0 +1,34 @@
+
+import React, { useState, useEffect, useRef } from "react";
+import { connect } from "react-redux";
+import { DatePicker } from "@douyinfe/semi-ui";
+
+const Inspection = ({ dispatch, actions, route }) => {
+
+   console.log(route);
+   return (
+
+      <div style={{ width: '100%', height: 180, backgroundColor: 'white', marginBottom: 20 }}>
+         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+            <div style={{ width: 190, fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', }}><span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 10px" }}></span>数据异常统计</div>
+            <div style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#BDDBFC' }}><img src="/assets/images/problem/keyboard.png" style={{ width: 30, height: 17, marginRight: 10 }} />开发中，敬请期待！</div>
+         </div>
+
+
+
+         <img src="project/da09f988-4c62-46fc-a532-b4cf053a4b6d/accurate_invest.png" alt="" />
+      </div >
+   )
+}
+
+
+function mapStateToProps (state) {
+   const { auth, global, members } = state;
+   return {
+      // user: auth.user,
+      // actions: global.actions,
+      // global: global,
+      // members: members.data,
+   };
+}
+export default connect(mapStateToProps)(Inspection);
diff --git a/web/client/src/sections/problem/components/statistics.jsx b/web/client/src/sections/problem/components/statistics.jsx
index 2136fa2..6a92d05 100644
--- a/web/client/src/sections/problem/components/statistics.jsx
+++ b/web/client/src/sections/problem/components/statistics.jsx
@@ -1,15 +1,18 @@
 import React, { useState, useEffect, useRef } from "react";
 import { connect } from "react-redux";
 import { DatePicker } from "@douyinfe/semi-ui";
+import Inspection from "./inspection";
 
-const Statistics = ({ dispatch, actions, close, modalName, visible, appData }) => {
-
+const Statistics = ({ dispatch, actions, route }) => {
 
+   console.log(route);
    return (
-      <div style={{ width: '100%', height: 180, backgroundColor: 'white', marginBottom: 20 }}>
-         <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-            <div style={{ width: 190, fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', }}><span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 10px" }}></span>数据异常统计</div>
-            {/* <DatePicker
+      <>{route == 'useAbnormal' ?
+         <Inspection /> :
+         <div style={{ width: '100%', height: 180, backgroundColor: 'white', marginBottom: 20 }}>
+            <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+               <div style={{ width: 190, fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#101531', }}><span style={{ width: 3, height: 20, background: '#005ABD', display: 'inline-block', margin: "0 10px 0 10px" }}></span>数据异常统计</div>
+               {/* <DatePicker
                type="dateTimeRange"
                style={{ width: 405 }}
                // defaultPickerValue={[new Date('2022-08-08 00:00'), new Date('2022-08-09 12:00')]}
@@ -17,23 +20,25 @@ const Statistics = ({ dispatch, actions, close, modalName, visible, appData }) =
                prefix='统计时段：'
                onChange={console.log}
             /> */}
-            <div style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#BDDBFC' }}><img src="/assets/images/problem/keyboard.png" style={{ width: 30, height: 17, marginRight: 10 }} />开发中，敬请期待！</div>
-         </div>
-         {/* <div style={{ width: '100%', display: 'flex', justifyContent: 'space-around', marginTop: 8 }}> */}
-         {/* <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
+               <div style={{ fontSize: 24, fontFamily: 'YouSheBiaoTiHei', color: '#BDDBFC' }}><img src="/assets/images/problem/keyboard.png" style={{ width: 30, height: 17, marginRight: 10 }} />开发中，敬请期待！</div>
+            </div>
+            {/* <div style={{ width: '100%', display: 'flex', justifyContent: 'space-around', marginTop: 8 }}> */}
+            {/* <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
             <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
             <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div>
             <div style={{ width: 'calc(25% - 20px)', height: 126, backgroundColor: '#F2F3F5', display: 'flex', justifyContent: 'center', alignItems: 'center' }}>暂未开放敬请期待</div> */}
 
-         {/* </div> */}
+            {/* </div> */}
 
-         {/* <div style={{ fontSize: 32, fontFamily: 'YouSheBiaoTiHei', fontWeight: 500, color: '#005ABD', textIndent:60, lineHeight: '156px', background: 'url(/assets/images/problem/await.png)', backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', width: 'calc(100% - 40px)', height: 156, margin: '0 0 0 10px' }}>
+            {/* <div style={{ fontSize: 32, fontFamily: 'YouSheBiaoTiHei', fontWeight: 500, color: '#005ABD', textIndent:60, lineHeight: '156px', background: 'url(/assets/images/problem/await.png)', backgroundSize: '100% 100%', backgroundRepeat: 'no-repeat', width: 'calc(100% - 40px)', height: 156, margin: '0 0 0 10px' }}>
          暂未开放   敬请期待
          </div> */}
 
-         <img src="/assets/images/problem/bitmap.png" style={{ width: 'calc(100% - 20px)', height: 156, margin: '0 0 0 10px' }} />
+            <img src="/assets/images/problem/bitmap.png" style={{ width: 'calc(100% - 20px)', height: 156, margin: '0 0 0 10px' }} />
+
+         </div >
+      }</>
 
-      </div >
    )
 }
 
diff --git a/web/client/src/sections/problem/containers/dataAlarm.jsx b/web/client/src/sections/problem/containers/dataAlarm.jsx
index 0bce254..399063b 100644
--- a/web/client/src/sections/problem/containers/dataAlarm.jsx
+++ b/web/client/src/sections/problem/containers/dataAlarm.jsx
@@ -256,12 +256,15 @@ const DataAlarm = ({ match, dispatch, actions, user, loading, socket }) => {
       }
    }
    return (
-      <div style={{minWidth:1000}}>
+      <div style={{ minWidth: 1000 }}>
          {/* 滞留提醒 */}
          <div>
             {abnormalLenght > 0 ? <div style={{ height: 30, fontSize: 12, display: 'flex' }}><IconAlertCircle /><div>当前滞留5个工单即将超时，请尽快处理！</div></div> : ""}
          </div>
-         <Statistics />
+         <Statistics
+            route={route}
+            tableType={tableType}
+         />
          <TableData
             route={route}
             collectData={collectData}
diff --git a/web/config.js b/web/config.js
index 827347b..2337703 100644
--- a/web/config.js
+++ b/web/config.js
@@ -23,8 +23,14 @@ const API_POMS_URL = process.env.API_POMS_URL || flags.apiPomsUrl;
 const API_EMIS_URL = process.env.API_EMIS_URL || flags.apiEmisUrl;
 const API_ANXINYUN_URL = process.env.API_ANXINYUN_URL || flags.apiAnxinyunUrl;
 
+const ANXINCLOUD_QINIU_AK = process.env.ANXINCLOUD_QINIU_AK || flags.qnak;
+const ANXINCLOUD_QINIU_SK = process.env.ANXINCLOUD_QINIU_SK || flags.qnsk;
+const ANXINCLOUD_QINIU_BUCKET_RESOURCE = process.env.ANXINCLOUD_QINIU_BUCKET_RESOURCE || flags.qnbkt;
+const ANXINCLOUD_QINIU_DOMAIN_QNDMN_RESOURCE = process.env.ANXINCLOUD_QINIU_DOMAIN_QNDMN_RESOURCE || flags.qndmn;
 
-if (!API_URL || !API_ANXINYUN_URL) {
+
+if (!API_URL || !API_ANXINYUN_URL || !ANXINCLOUD_QINIU_AK || !ANXINCLOUD_QINIU_SK || !ANXINCLOUD_QINIU_BUCKET_RESOURCE
+   || !ANXINCLOUD_QINIU_DOMAIN_QNDMN_RESOURCE) {
    console.log('缺少启动参数，异常退出');
    args.showHelp();
    process.exit(-1);
@@ -45,6 +51,18 @@ const product = {
          host: API_ANXINYUN_URL,
          match: /^\/_axy\//,
       }
+   }, {
+      entry: require('./middlewares/attachment').entry,
+      opts: {
+         qiniu: {
+            accessKey: ANXINCLOUD_QINIU_AK,
+            secretKey: ANXINCLOUD_QINIU_SK,
+            bucket: ANXINCLOUD_QINIU_BUCKET_RESOURCE,
+            domain: ANXINCLOUD_QINIU_DOMAIN_QNDMN_RESOURCE
+         },
+         maxSize: 20971520, // 20M
+         uploadPath: 'other'
+      }
    }, {
       entry: require('./middlewares/proxy').entry,
       opts: {
diff --git a/web/middlewares/attachment.js b/web/middlewares/attachment.js
new file mode 100644
index 0000000..16eb449
--- /dev/null
+++ b/web/middlewares/attachment.js
@@ -0,0 +1,23 @@
+/**
+ * Created by PengLing on 2018/1/2.
+ */
+'use strict';
+
+const Attachment = require('fs-attachment');
+
+module.exports = {
+    entry: function (app, router, opts) {
+        const attachment = new Attachment(opts);
+
+        app.fs = app.fs || {};
+        app.fs.attachment = attachment;
+
+        app.fs.logger.log('debug', 'init fs.attachment and inject it into app(app.fs.attachment) and runtime ctx(ctx.fs.attachment)');
+
+        return async (ctx, next) => {
+            ctx.fs = ctx.fs || {};
+            ctx.fs.attachment = attachment;
+            await next();
+        };
+    }
+};
diff --git a/web/package.json b/web/package.json
index 27b3bc2..1ed7077 100644
--- a/web/package.json
+++ b/web/package.json
@@ -60,6 +60,7 @@
       "copy-to-clipboard": "^3.3.1",
       "cross-env": "^7.0.3",
       "ezuikit-js": "^0.6.1",
+      "fs-attachment": "^1.0.0",
       "fs-web-server-scaffold": "^1.0.6",
       "koa-better-http-proxy": "^0.2.5",
       "koa-proxy": "^1.0.0-alpha.3",
@@ -79,4 +80,4 @@
       "webpack-dev-server": "^3.11.2",
       "webpack-hot-middleware": "^2.25.0"
    }
-}
\ No newline at end of file
+}
diff --git a/web/routes/attachment/index.js b/web/routes/attachment/index.js
index 7f4a78b..6c02488 100644
--- a/web/routes/attachment/index.js
+++ b/web/routes/attachment/index.js
@@ -29,6 +29,26 @@ module.exports = {
          };
       };
 
+      let download = async function (ctx, next) {
+         const { fetchUrl } = opts.qiniu;
+         if (ctx.path && ctx.path.includes(fetchUrl)) {
+             try {
+                 const { filename } = ctx.request.query;
+                 const fkey = decodeURI(ctx.path.slice(fetchUrl.length + 1)).replace(/\.json$/, '.js');
+                 const publicDownloadUrl = await app.fs.attachment.download(fkey);
+                 ctx.status = 200;
+                 if (filename) ctx.attachment(filename);
+                 ctx.body = request.get(publicDownloadUrl);
+             } catch (err) {
+                 ctx.fs.logger.error(err);
+                 ctx.status = 404;
+                 ctx.body = { error: 'file not found.' }
+             }
+         } else {
+             await next();
+         }
+     }
+
       let upload = async function (ctx, next) {
          try {
             const { files } = await parse(ctx.req);