123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170 |
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <title>相册</title>
- <link rel="shortcut icon" href="/static//static/images/favicon.ico" type="image/x-icon">
- <link rel="icon" href="/static//static/images/favicon.ico" type="image/x-icon">
- <link rel="stylesheet" href="/static/css/swiper-bundle.min.css">
- <link rel="stylesheet" href="/static/css/font-awesome.min.css">
- <link rel="stylesheet" href="/static/css/magnific-popup.min.css">
- <link rel="stylesheet" href="/static/css/animate.min.css">
- <link rel="stylesheet" href="/static/css/main.css">
- </head>
- <body>
- <div class="menu-overlay"></div>
- <main class="main">
- <section class="gallery">
- @include('__sidebar', ['foldersTree'=> $foldersTree,'active'=>true])
- <div class="update-content">
- <div class="update-log" >
- <a href="/update-log">
- <div class="timestamp"><i class="fa fa-volume-up"></i> <span class="update-time"> </span></div>
- <div class="message"> <span class="action"> </span> <span class="model"> </span> <span class="highlight log-content"> </span></div>
- </a>
- </div>
- </div>
- <div class="content-page gallery-content gallery-wrap">
- <div class="content-inner">
- <div class="title-wrapper text-center">
- <h2 class="title">{{$album['title']}}</h2>
- <div class="subtitle">
- <p></p>
- </div>
- </div>
- <div class="album-tab">
- @foreach($showTabs as $tab)
- <a href="#album-{{$tab['column']}}" @if($loop->first)class="is-active"@endif column={{$tab['column']}}>{{$tab['title']}}</a>
- @endforeach
- </div>
- <!-- Album Animals START -->
- <div class="gallery-album-line">
- <a href="javascript:void(0);" class="download-all">下载全部 <i class="fa fa-download"></i></a>
- <a href="javascript:history.back();" class="gallery-album-prev"><i class="fa fa-angle-double-left"></i> 返回 </a>
- </div>
- @foreach($showTabs as $tab)
- <div class="grid-album @if($loop->first)gallery-album is-active @endif" id="album-{{$tab['column']}}">
- <div class="grid-sizer"></div>
- @php
- $content = json_decode($album[$tab['column']], true);
- @endphp
- @if (empty($content))
- 数据为空
- @endif
- @if ($tab['column'] == 'video' || $tab['column'] == 'pdf')
- @if ($tab['column'] == 'video' && empty($content) == false)
- <table class="album_table">
- <thead>
- <tr>
- <th>图片</th>
- <th width="15%">操作</th>
- </tr>
- </thead>
- <tbody>
- @foreach($content as $item)
- <tr>
- <td>
- <a href="{{ossUrl($item['cover'])}}" target="_blank">
- <img src="{{ossUrl($item['cover'])}}?x-oss-process=image/resize,w_100" width="100">
- </a>
- </td>
- <td>
- <button data-src="{{$item['video_src']}}" class="video-btn">播放</button>
- <a href="{{$item['video_src']}}" download class="download-btn" target="_blank"><button>下载</button></a>
- </td>
- </tr>
- @endforeach
- </tbody>
- </table>
- @endif
- @if ($tab['column'] == 'pdf' && empty($content) == false)
- <table class="album_table">
- <thead>
- <tr>
- <th>PDF标题</th>
- <th width="15%">操作</th>
- </tr>
- </thead>
- <tbody>
- @foreach($content as $item)
- <tr>
- <td>{{$item['pdf_title']}}</td>
- <td>
- <a href="{{$item['pdf_src']}}" download class="download-btn" target="_blank"><button>下载</button></a>
- </td>
- </tr>
- @endforeach
- </tbody>
- </table>
- @endif
- @else
- @foreach($content as $item)
- <div class="grid-item album-item">
- <div class="album-thumb album-thumb-detail">
- <img data-src="{{ossUrl($item)}}" src="{{ossUrl($item)}}?x-oss-process=image/resize,m_fill,w_380,h_380" alt="1">
- <div class="album-mask">
- <!-- 下载图标 -->
- <a href="{{ossUrl($item)}}" download class="download-icon" target="_blank">
- <i class="fa fa-cloud-download"></i>
- </a>
- </div>
- </div>
- </div>
- @endforeach
- @endif
- </div>
- @endforeach
- <!-- Album Animals END -->
- </div><!-- end container-inner -->
- </div>
- <!-- 视频遮罩层 -->
- <div id="overlay" class="overlay">
- <div class="video-container">
- <video id="videoPlayer" controls>
- Your browser does not support the video tag.
- </video>
- </div>
- </div>
- </section> <!-- end gallery -->
- </main>
- <footer class="site-footer">
- <div class="footer-copyright">
- © 2025 <strong>mietub</strong>. All rights reserved.
- </div>
- </footer>
- <script src="/static/js/jquery-3.7.0.min.js"></script>
- <script src="/static/js/swiper-bundle.min.js"></script>
- <script src="/static/js/wow.min.js"></script>
- <script src="/static/js/masonry.pkgd.min.js"></script>
- <script src="/static/js/imagesloaded.pkgd.min.js"></script>
- <script src="/static/js/magnific-popup.min.js"></script>
- <script src="/static/js/blazy.min.js"></script>
- <script src="/static/js/parazoom.min.js"></script>
- <script src="/static/js/script.js"></script>
- </body>
- </html>
|