mirror of
https://github.com/cuiocean/ZY-Player.git
synced 2026-05-08 23:12:13 +08:00
Film页面,列表视图用el-table实现,感谢buvta贡献
This commit is contained in:
@@ -28,8 +28,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="listpage-body" id="film-body" infinite-wrapper>
|
||||
<div class="body-box" v-show="!show.find">
|
||||
<div class="show-picture" v-if="setting.view === 'picture'">
|
||||
<div class="show-picture" v-if="setting.view === 'picture' && !show.find">
|
||||
<Waterfall ref="waterfall" :list="list" :gutter="20" :width="240"
|
||||
:breakpoints="{ 1200: { rowPerView: 4 } }"
|
||||
animationEffect="fadeInUp"
|
||||
@@ -56,29 +55,70 @@
|
||||
</template>
|
||||
</Waterfall>
|
||||
<infinite-loading force-use-infinite-wrapper :identifier="infiniteId" @infinite="infiniteHandler"></infinite-loading>
|
||||
</div>
|
||||
<div class="show-table" v-if="setting.view === 'table'">
|
||||
<div class="zy-table">
|
||||
<div class="tBody">
|
||||
<ul>
|
||||
<li v-for="(i, j) in list" :key="j" @click="detailEvent(site, i)" v-show="!setting.excludeR18Films || !containsR18Keywords(i.type)">
|
||||
<span class="name">{{i.name}}</span>
|
||||
<span class="type">{{i.type}}</span>
|
||||
<span class="time">{{i.year}}</span>
|
||||
<span class="note">{{i.note}}</span>
|
||||
<span class="last">{{i.last}}</span>
|
||||
<span class="operate">
|
||||
<span class="btn" @click.stop="playEvent(site, i)">播放</span>
|
||||
<span class="btn" @click.stop="starEvent(site, i)">收藏</span>
|
||||
<span class="btn" @click.stop="shareEvent(site, i)">分享</span>
|
||||
<span class="btn" @click.stop="downloadEvent(site, i)">下载</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
<infinite-loading force-use-infinite-wrapper :identifier="infiniteId" @infinite="infiniteHandler"></infinite-loading>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="show-table" v-if="setting.view === 'table' && !show.find">
|
||||
<el-table size="mini"
|
||||
:data="list.filter(res => !setting.excludeR18Films || !containsR18Keywords(res.type))"
|
||||
height="100%"
|
||||
row-key="id"
|
||||
@row-click="(row) => detailEvent(site, row)"
|
||||
style="width: 100%">
|
||||
<el-table-column
|
||||
prop="name"
|
||||
label="片名">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="director"
|
||||
label="导演"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="type"
|
||||
label="类型"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="year"
|
||||
label="上映"
|
||||
align="center"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="area"
|
||||
label="地区"
|
||||
align="center"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="lang"
|
||||
label="语言"
|
||||
align="center"
|
||||
width="100">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
prop="note"
|
||||
label="备注">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
label="操作"
|
||||
header-align="center"
|
||||
align="right"
|
||||
width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click.stop="playEvent(site, scope.row)" type="text">播放</el-button>
|
||||
<el-button @click.stop="starEvent(site, scope.row)" type="text">收藏</el-button>
|
||||
<el-button @click.stop="shareEvent(site, scope.row)" type="text">分享</el-button>
|
||||
<el-button @click.stop="downloadEvent(site, scope.row)" type="text">下载</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<infinite-loading
|
||||
slot="append"
|
||||
:identifier="infiniteId"
|
||||
@infinite="infiniteHandler"
|
||||
force-use-infinite-wrapper=".el-table__body-wrapper">
|
||||
<div slot="no-more">数据量过少时请重复操作一次,以防网站抽风</div>
|
||||
</infinite-loading>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="show-table" v-show="show.find">
|
||||
<el-table size="mini"
|
||||
|
||||
Reference in New Issue
Block a user