Showing
4 changed files
with
17 additions
and
14 deletions
| ... | ... | @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; |
| 2 | 2 | import './index.less'; |
| 3 | 3 | |
| 4 | 4 | interface pdfPreviewProps { |
| 5 | - url: string | |
| 5 | + url?: string | |
| 6 | 6 | } |
| 7 | 7 | |
| 8 | 8 | const pdfPreview = (props: pdfPreviewProps) => { |
| ... | ... | @@ -19,13 +19,11 @@ const pdfPreview = (props: pdfPreviewProps) => { |
| 19 | 19 | <div className={'pdfPreview'}> |
| 20 | 20 | {/* pdf属性 page 跳转到指定页码,navpanes 控制左侧的缩略图预览导航是否默认打开。0-关闭,1-打开*/} |
| 21 | 21 | {/* navpanes=0&scrollbars=0&toolbar=0&statusbar=0 去除缩略图和工具栏 */} |
| 22 | - {/* frameborder=0 和view=FitH,top 为全屏展示 */} | |
| 22 | + {/* view=FitH,top 为全屏展示 */} | |
| 23 | 23 | <iframe |
| 24 | 24 | title="pdf-preview" |
| 25 | 25 | style={{ width: '100%', height: '100%' }} |
| 26 | - frameborder="0" | |
| 27 | 26 | src={`${filePath}#page=1&navpanes=0&scrollbars=0&toolbar=0&statusbar=0&view=FitH,top`} |
| 28 | - // src={`${filePath}`} | |
| 29 | 27 | /> |
| 30 | 28 | </div> |
| 31 | 29 | ); | ... | ... |
| ... | ... | @@ -7,12 +7,13 @@ import {useSearchParams} from "react-router-dom"; |
| 7 | 7 | import {getCarouselSettings} from "@/api/apiConfig"; |
| 8 | 8 | import _ from 'lodash'; |
| 9 | 9 | import { useNavigate } from 'react-router-dom'; |
| 10 | +import {ListType} from "@/pages/production/list"; | |
| 10 | 11 | |
| 11 | 12 | |
| 12 | 13 | const ProductionDetail: React.FC = () => { |
| 13 | 14 | let navigate = useNavigate(); |
| 14 | 15 | const [title, setTitle] = useState<string>(''); |
| 15 | - const [filePathItem, setFilePathItem] = useState(); | |
| 16 | + const [filePathItem, setFilePathItem] = useState<ListType>(); | |
| 16 | 17 | // 自动预览 定时器 |
| 17 | 18 | const [preViewTimer, setPreViewTimer] = useState<any>(null); |
| 18 | 19 | |
| ... | ... | @@ -21,7 +22,7 @@ const ProductionDetail: React.FC = () => { |
| 21 | 22 | // // 通过 get 方法获取目标参数 |
| 22 | 23 | const name = params.get("name") || ""; |
| 23 | 24 | |
| 24 | - const sxPreViewList = localStorage.getItem('sxPreViewListStorage') ? JSON.parse(localStorage.getItem('sxPreViewListStorage')) : []; | |
| 25 | + const sxPreViewList: any[] = JSON.parse(localStorage.getItem('sxPreViewListStorage') || "[]") || []; | |
| 25 | 26 | |
| 26 | 27 | useEffect(() => { |
| 27 | 28 | if (sxPreViewList?.length) { |
| ... | ... | @@ -77,14 +78,14 @@ const ProductionDetail: React.FC = () => { |
| 77 | 78 | <div className={'sxjx-content-main sxjx-layout-main-unfoot'}> |
| 78 | 79 | <div className={'production-detail'}> |
| 79 | 80 | <NavBar showBack={true} title={title} customBack={{onClick: () => { |
| 80 | - const _url = localStorage.getItem('sxListPath'); | |
| 81 | + const _url = localStorage.getItem('sxListPath') || ''; | |
| 81 | 82 | navigate(_url, { replace: true }); |
| 82 | 83 | }}} |
| 83 | 84 | /> |
| 84 | 85 | { |
| 85 | 86 | filePathItem?.type === 'mp4' ? <div className={'production-detail-video-box'}> |
| 86 | 87 | <VideoPlay |
| 87 | - key={filePathItem?.url} | |
| 88 | + key={filePathItem?.url || ''} | |
| 88 | 89 | url={filePathItem?.url || ''} |
| 89 | 90 | className={'production-detail-video'} |
| 90 | 91 | /> | ... | ... |
| ... | ... | @@ -10,14 +10,15 @@ import {getFilePreview, getProductBook} from "@/api/apiConfig"; |
| 10 | 10 | import {SpinLoading, Checkbox, Toast} from 'antd-mobile' |
| 11 | 11 | import { useNavigate, useLocation } from "react-router-dom"; |
| 12 | 12 | |
| 13 | -interface ListType { | |
| 13 | +export interface ListType { | |
| 14 | 14 | id: string; |
| 15 | 15 | fileId: string; |
| 16 | 16 | name: string; |
| 17 | + url?: string; | |
| 17 | 18 | type: 'pdf' | 'mp4' | string |
| 18 | 19 | } |
| 19 | 20 | |
| 20 | -type CheckboxValue = string; | |
| 21 | +type CheckboxValue = string | number; | |
| 21 | 22 | |
| 22 | 23 | const ProductionList: React.FC = () => { |
| 23 | 24 | const [title, setTitle] = useState<string>(''); |
| ... | ... | @@ -49,7 +50,7 @@ const ProductionList: React.FC = () => { |
| 49 | 50 | setShow(false); |
| 50 | 51 | getProductBook({pro_line: id}).then((res: any) => { |
| 51 | 52 | setShow(true); |
| 52 | - let _checkItems = []; | |
| 53 | + let _checkItems: CheckboxValue[] = []; | |
| 53 | 54 | const _list = res?.product_book?.map((item: any) => { |
| 54 | 55 | _checkItems.push(item?.id); |
| 55 | 56 | const _arr = item?.guide_book_file_info_?.[0]?.name?.split('.') || []; |
| ... | ... | @@ -63,6 +64,7 @@ const ProductionList: React.FC = () => { |
| 63 | 64 | setList(_list) |
| 64 | 65 | setCheckItems(_checkItems) |
| 65 | 66 | }).catch((e: any) => { |
| 67 | + console.log('e', e) | |
| 66 | 68 | setShow(true); |
| 67 | 69 | setList([]) |
| 68 | 70 | }) |
| ... | ... | @@ -98,17 +100,18 @@ const ProductionList: React.FC = () => { |
| 98 | 100 | // 使用Promise.all来并行地解决这些promise |
| 99 | 101 | Promise.all(promises) |
| 100 | 102 | .then((results: any) => { |
| 101 | - let sxPreViewList = _arr?.map((it: ListType, index: number) => { | |
| 103 | + let sxPreViewList: ListType[] = _arr?.map((it: ListType, index: number) => { | |
| 102 | 104 | return { |
| 103 | 105 | ...it, |
| 104 | - url: results?.[index] | |
| 106 | + url: results?.[index] || '' | |
| 105 | 107 | } |
| 106 | 108 | }) |
| 107 | 109 | localStorage.setItem('sxPreViewListStorage', JSON.stringify(sxPreViewList)); |
| 108 | 110 | localStorage.setItem('sxListPath', `${location?.pathname}${location?.search}`); |
| 109 | 111 | navigate(`/production/detail?name=${sxPreViewList?.[0]?.name}`, { replace: true }); |
| 110 | 112 | }) |
| 111 | - .catch(err => { | |
| 113 | + .catch((e: any) => { | |
| 114 | + console.log('e', e) | |
| 112 | 115 | localStorage.setItem('sxPreViewListStorage', ''); |
| 113 | 116 | localStorage.setItem('sxListPath', ''); |
| 114 | 117 | }); | ... | ... |