下载完成

web/client/src/layout/actions/global.js

@@ -41,6 +41,7 @@ export function initApiRoot () {
                iotVcmpWeb:res.iotVcmpWeb,
                pomsMonitor:res.pomsMonitor,
                dcWeb:res.dcWeb,
+               qiniu:res.qiniu,
             }
          })
       });

web/client/src/layout/reducers/global.js

@@ -14,6 +14,7 @@ function global (state = {
    iotVcmpWeb: '',
    pomsMonitor:'',
    dcWeb:'',
+   qiniu:{}
 }, action) {
    const payload = action.payload;
    switch (action.type) {
@@ -36,6 +37,7 @@ function global (state = {
             iotVcmpWeb: payload.iotVcmpWeb,
             pomsMonitor:payload.pomsMonitor,
             dcWeb:payload.dcWeb,
+            qiniu:payload.qiniu,
          }).toJS();
          case PEPPROJECTID:
             return Immutable.fromJS(state).merge({

web/client/src/sections/means/containers/projectMeans.jsx

@@ -10,7 +10,7 @@ import './style.less'
 
 
 const Rest = (props) => {
-   const { dispatch, actions, user, loading, clientHeight, overallProjectId } = props
+   const { dispatch, actions, user, qiniu, loading, clientHeight, overallProjectId } = props
    const { install, means } = actions
    const [pomsList, setPomsList] = useState([]);  //项目
    const [showPomsList, setShowPomsList] = useState([]);  //项目
@@ -26,6 +26,8 @@ const Rest = (props) => {
    const [dataSource, setDataSource] = useState([])  //表格数据
    const [query, setQuery] = useState({ limit: 10, page: 0 })
    const [count, setCount] = useState(0)
+   const [videoModalV, setVideoModalV] = useState(false);
+   const [videoUrl, setvideoUrl] = useState(null);
 
 
 
@@ -101,10 +103,8 @@ const Rest = (props) => {
             }
          })
       }
-      console.log(treeData);
       treeDataList(treeData)
       let datas = params || query
-      console.log(fileIds);
       dispatch(means.folderFileList({ fileId: JSON.stringify(fileIds), ...datas })).then((res => {
          if (res.success) {
             setDataSource(res.payload.data?.rows || [])
@@ -165,7 +165,7 @@ const Rest = (props) => {
          title: '文件名',
          dataIndex: 'name',
          key: 'name',
-         render: (text) => text?.length > 30 ? <div title={text}>{text.slice(0,30)}...</div> : text
+         render: (text) => text?.length > 30 ? <div title={text}>{text.slice(0, 30)}...</div> : text
       },
       {
          title: '文件大小',
@@ -197,7 +197,7 @@ const Rest = (props) => {
                   下载
                </a></Button>
                <Button theme='borderless' type='primary' style={{ marginRight: 8 }} onClick={() => {
-
+                  preview(r.url)
                }}>
                   预览
                </Button>
@@ -244,6 +244,18 @@ const Rest = (props) => {
       },
    ];
 
+   const preview = (url) => {
+      let link = encodeURI(`${qiniu}/${url}`)
+      if (url.indexOf("pdf") !== -1) {
+         window.open(link)
+      } else if (url.indexOf("png") !== -1 || url.indexOf("jpg") !== -1) {
+         setVideoModalV(true)
+         setvideoUrl(link)
+      } else {
+         window.open(`https://view.officeapps.live.com/op/view.aspx?src=${link}`)
+      }
+   }
+
    return (
       // <div>
       <div style={{ width: '100%', height: clientHeight - 72, display: 'flex', }}>
@@ -464,7 +476,27 @@ const Rest = (props) => {
                </div> */}
             </div>
          </div>
-
+         {
+            videoModalV ?
+               <Modal
+                  visible={true}
+                  destroyOnClose
+                  closable={false}
+                  onCancel={() => {
+                     setVideoModalV(false)
+                     setvideoUrl('')
+                  }} width={400}
+                  footer={null}>
+                  <img src={videoUrl} style={{ width: 350 }} />
+                  <div style={{ display: 'flex', justifyContent: 'flex-end' }}>
+                     <Button theme='solid' type='secondary' onClick={() => {
+                        setVideoModalV(false)
+                        setvideoUrl('')
+                     }}>关闭</Button>
+                  </div>
+               </Modal>
+               : ''
+         }
       </div >
       // </div>
    )
@@ -472,14 +504,14 @@ const Rest = (props) => {
 
 function mapStateToProps (state) {
    const { auth, global, members, webSocket } = state;
-
    return {
       //   loading: members.isRequesting,
       user: auth.user,
       actions: global.actions,
       overallProjectId: global.pepProjectId,
       //   socket: webSocket.socket
-      clientHeight: global.clientHeight
+      clientHeight: global.clientHeight,
+      qiniu: global.qiniu?.domain
    };
 }
 

web/routes/attachment/index.js

@@ -19,7 +19,7 @@ module.exports = {
    entry: function (app, router, opts) {
 
       const getApiRoot = async function (ctx) {
-         const { apiUrl, iotVcmpWeb, pomsMonitor, dcWeb } = opts;
+         const { apiUrl, iotVcmpWeb, pomsMonitor, dcWeb,qiniu } = opts;
 
          ctx.status = 200;
          ctx.body = {
@@ -27,6 +27,7 @@ module.exports = {
             iotVcmpWeb: iotVcmpWeb,
             pomsMonitor: pomsMonitor,
             dcWeb: dcWeb,
+            qiniu:qiniu
          };
       };