Merge remote-tracking branch 'origin/v1.0' into publish

# Conflicts:
#	src/utils/common.tsx

@@ -86,13 +86,19 @@ const ProductionDetail: React.FC = () => {
                     }}}
                     }}}
                 />
                 />
                 {
                 {
-                    filePathItem?.type === 'mp4' ? <div className={'production-detail-video-box'}>
-                        <VideoPlay
-                            key={filePathItem?.url || ''}
-                            url={filePathItem?.url || ''}
-                            className={'production-detail-video'}
-                        />
-                    </div> : filePathItem?.type === 'pdf' ? <PdfPreview url={filePathItem?.url || ''}/> : ''
+                    filePathItem ? sxPreViewList?.map((item: any) => {
+                        return <div key={item?.url} className={`production-detail-item ${item?.url !== filePathItem?.url ? 'hidden' : ''}`}>
+                            {
+                                item?.type === 'mp4' ? <div className={'production-detail-video-box'}>
+                                    <VideoPlay
+                                        key={item?.url || ''}
+                                        url={item?.url || ''}
+                                        className={'production-detail-video'}
+                                    />
+                                </div> : item?.type === 'pdf' ? <PdfPreview url={item?.url || ''}/> : ''
+                            }
+                        </div>
+                    }) : ''
                 }
                 }
             </div>
             </div>
         </div>
         </div>

@@ -5,6 +5,15 @@
   position: relative;
   position: relative;
   width: 100%;
   width: 100%;
   height: calc(100vh - 88px);
   height: calc(100vh - 88px);
+  &-item {
+    position: relative;
+    width: 100%;
+    height: calc(100vh - 88px);
+    &.hidden {
+      display: none;
+    }
+  }
+
   &-video-box {
   &-video-box {
     position: absolute;
     position: absolute;
     top: 0;
     top: 0;
@@ -21,4 +30,4 @@
     max-height: 100%;
     max-height: 100%;
     height: auto;
     height: auto;
   }
   }
-}
+}