Browse Source

不感兴趣

pull/19/head
zyronon 4 years ago
parent
commit
2155e84e3e
  1. 81
      src/assets/data/resource.js
  2. 1
      src/assets/img/icon/add.svg
  3. BIN
      src/assets/img/icon/epe.webp
  4. 1
      src/assets/img/icon/hepai.svg
  5. 1
      src/assets/img/icon/href.svg
  6. 1
      src/assets/img/icon/sina.svg
  7. 2
      src/components/Footer.vue
  8. 302
      src/components/Other.vue
  9. 2
      src/components/Share.vue
  10. 67
      src/components/Video.vue
  11. 11
      src/components/slide/SlideColumnVirtualList.vue
  12. 3
      src/pages/home/Index.vue
  13. 744
      src/pages/home/Index2.vue
  14. 3
      src/pages/me/VideoDetail.vue
  15. 7
      src/pages/me/userinfo/EditUserInfo.vue

81
src/assets/data/resource.js

@ -266,83 +266,6 @@ export default { @@ -266,83 +266,6 @@ export default {
"is_private": 0
}
},
{
"id": "080a3b3d-0f76-4427-9ec9-661e1621cb1a",
video: 'http://douyin.ttentau.top/4.mp4',
"video_data_size": 37824020,
"duration": 312474,
"desc": "男子野外露营遇到三只豹子,结局出乎意料",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 141000,
"comment_count": 8827,
"download_count": 431,
"play_count": 0,
"share_count": 44000,
"forward_count": 22,
"collect_count": 1341,
"sort": 311,
"is_top": 0,
city: '开封市',
address: '',
"musicId": "02792e4a-d4b3-4b30-8e1e-fa0bd0eabe1b",
"create_time": "1630423884",
"creator_id": "93864497380",
"status": 1,
"topics": [
{
"id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
"name": "DOU+小助手",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
{
"id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
"name": "抖音小助手",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
],
"music": {
"id": "cde50af2-628c-4d28-b9c6-67237a62518e",
"cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
"mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
"title": "@印象网开封新闻创作的原声-印象网开封新闻",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
"author": {
"id": "93864497380",
"unique_id_modify_time": "1630393144",
"unique_id": "dyg141319",
"favoriting_count": 0,
"avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
"city": "",
"province": null,
"country": "",
"location": "",
"birthday": "1990-01-01",
"cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 0,
"follower_count": 0,
"aweme_count": 0,
"nickname": "印象网开封新闻",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": null,
"is_private": 0
}
},
{
"id": "08a90c93-807b-4a7a-aad3-68f75d65a9c8",
video: 'http://douyin.ttentau.top/3.mp4',
@ -508,7 +431,7 @@ export default { @@ -508,7 +431,7 @@ export default {
"collect_count": 1,
"sort": 8,
"is_top": 0,
"city": "350100",
"city": "",
"musicId": "9db983b3-b68c-465b-85f5-030f5646e01f",
"create_time": "1630391758",
"creator_id": "54884802577",
@ -1230,6 +1153,6 @@ export default { @@ -1230,6 +1153,6 @@ export default {
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
}
},
],
}

1
src/assets/img/icon/add.svg

@ -1 +0,0 @@ @@ -1 +0,0 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1539617695563" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2801" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M590.769231 571.076923h324.923077c15.753846 0 29.538462-13.784615 29.538461-29.538461v-59.076924c0-15.753846-13.784615-29.538462-29.538461-29.538461H590.769231c-11.815385 0-19.692308-7.876923-19.692308-19.692308V108.307692c0-15.753846-13.784615-29.538462-29.538461-29.538461h-59.076924c-15.753846 0-29.538462 13.784615-29.538461 29.538461V433.230769c0 11.815385-7.876923 19.692308-19.692308 19.692308H108.307692c-15.753846 0-29.538462 13.784615-29.538461 29.538461v59.076924c0 15.753846 13.784615 29.538462 29.538461 29.538461H433.230769c11.815385 0 19.692308 7.876923 19.692308 19.692308v324.923077c0 15.753846 13.784615 29.538462 29.538461 29.538461h59.076924c15.753846 0 29.538462-13.784615 29.538461-29.538461V590.769231c0-11.815385 7.876923-19.692308 19.692308-19.692308z" p-id="2802"></path></svg>

Before

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/assets/img/icon/epe.webp

Binary file not shown.

Before

Width:  |  Height:  |  Size: 633 B

1
src/assets/img/icon/hepai.svg

@ -1 +0,0 @@ @@ -1 +0,0 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1539702397110" class="icon" style="" viewBox="0 0 1306 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="21378" xmlns:xlink="http://www.w3.org/1999/xlink" width="255.078125" height="200"><defs><style type="text/css"></style></defs><path d="M0 358.982899c26.670259-186.69181 154.22367-278.298351 318.303739-328.160139 175.675834-53.340517 348.452727-38.266023 510.793432 51.601153 78.851199 43.484117 142.048117 103.782093 174.516258 189.590752 45.223482 120.016164 13.914918 225.537622-72.473529 314.82501-92.186329 95.08527-209.88334 140.88854-339.176115 153.064093-60.877764 5.797882-122.335317-0.579788-183.792869-2.898941-16.813859-0.579788-30.148988 0.579788-44.643694 10.436188-66.095858 43.484117-137.989599 73.053317-215.681222 87.548023-16.813859 2.898941-37.686235 12.755341-49.282-8.117035-12.175553-21.452165 6.377671-34.787294 18.553223-48.702211 30.728776-33.047929 59.718188-66.675647 75.952258-111.899129-17.973435-12.755341-36.526659-25.510682-53.920306-38.845811C66.675647 570.025815 15.654282 499.871439 2.898941 405.945746c-0.579788-2.898941-1.739365-5.218094-2.898941-8.117035C0 385.073369 0 371.73824 0 358.982899zM287.574963 681.345155c1.159576 1.159576 2.319153 2.319153 2.898941 3.478729 19.7128-13.335129 39.4256-26.670259 59.718188-38.845811 7.537247-4.058518 17.393647-7.537247 25.510682-6.377671 67.255435 12.175553 134.51087 19.133012 202.925881 10.436188 102.622517-12.755341 197.127999-45.223482 275.39941-115.957646 92.186329-84.069294 103.202305-197.707787 28.409623-290.473904-31.308564-38.266023-69.574588-67.255435-113.638493-89.287388C648.783031 92.860101 521.809408 79.524971 390.777268 106.775018c-91.606541 18.553223-174.516258 56.819247-239.452539 126.973623-60.297976 64.936282-75.37247 150.74494-37.106447 226.697198 23.191529 46.383058 59.1384 81.750141 102.042729 110.159764 30.148988 19.7128 61.457553 37.106447 93.345905 56.819247C302.069668 645.978073 295.11221 663.37172 287.574963 681.345155z" p-id="21379"></path><path d="M1304.52352 589.158827c-12.755341 37.106447-22.611741 75.952258-40.005388 111.31934-30.148988 60.297976-79.430988 104.361882-136.250234 139.728964-15.654282 9.8564-19.133012 17.973435-8.696823 32.468141 22.031953 30.148988 44.063906 60.877764 66.675647 90.446964 4.638306 6.377671 12.755341 11.015976 15.074494 17.973435 3.478729 9.8564 7.537247 23.191529 4.058518 31.308564-2.898941 6.377671-18.553223 12.755341-26.670259 11.015976-45.80327-11.015976-91.606541-20.872376-135.090658-37.686235-37.686235-14.494706-71.313952-37.106447-107.840611-55.079882-9.276612-4.638306-22.031953-8.117035-31.888353-6.957459-113.638493 16.23407-225.537622 9.8564-333.958021-29.5692-38.266023-13.914918-74.792682-33.047929-112.478917-49.861788 0.579788-2.319153 1.159576-4.638306 1.739365-6.957459 38.845811 0 78.271411 2.898941 117.117223-0.579788 161.181128-13.335129 306.707974-66.095858 422.085832-183.792869 102.622517-105.521458 142.627905-230.755716 107.260823-376.282562-0.579788-1.739365-0.579788-4.058518-0.579788-12.755341 28.409623 20.872376 55.079882 37.106447 78.851199 57.399035 61.457553 53.920306 106.101246 118.276799 117.697011 201.766304 0 1.739365 2.319153 3.478729 3.478729 5.218094C1304.52352 548.57365 1304.52352 568.866238 1304.52352 589.158827z" p-id="21380"></path></svg>

Before

Width:  |  Height:  |  Size: 3.3 KiB

1
src/assets/img/icon/href.svg

File diff suppressed because one or more lines are too long

Before

Width:  |  Height:  |  Size: 5.9 KiB

1
src/assets/img/icon/sina.svg

@ -1 +0,0 @@ @@ -1 +0,0 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1539704331644" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="35930" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M759.466667 499.2c-38.4-8.533333-21.333333-29.866667-21.333334-29.866667s38.4-64-8.533333-110.933333c-59.733333-59.733333-200.533333 8.533333-200.533333 8.533333-55.466667 17.066667-38.4-8.533333-29.866667-51.2 0-46.933333-17.066667-132.266667-157.866667-81.066666-140.8 51.2-264.533333 221.866667-264.533333 221.866666-85.333333 115.2-72.533333 204.8-72.533333 204.8 21.333333 196.266667 226.133333 247.466667 388.266666 260.266667 174.933333 12.8 396.8-59.733333 465.066667-204.8 68.266667-149.333333-59.733333-209.066667-98.133333-217.6z m-358.4 366.933333c-166.4 8.533333-302.933333-76.8-302.933334-187.733333 0-110.933333 136.533333-204.8 302.933334-209.066667 166.4-8.533333 302.933333 59.733333 302.933333 174.933334 0 110.933333-136.533333 217.6-302.933333 221.866666z m-34.133334-324.266666c-170.666667 21.333333-149.333333 179.2-149.333333 179.2s0 46.933333 46.933333 76.8c98.133333 55.466667 200.533333 21.333333 251.733334-46.933334 51.2-68.266667 21.333333-230.4-149.333334-209.066666z m-42.666666 221.866666c-29.866667 4.266667-55.466667-12.8-55.466667-42.666666 0-25.6 21.333333-55.466667 55.466667-55.466667 34.133333-4.266667 59.733333 17.066667 59.733333 42.666667 0 29.866667-25.6 51.2-59.733333 55.466666z m102.4-85.333333c-8.533333 8.533333-25.6 8.533333-29.866667-4.266667-4.266667-8.533333-4.266667-25.6 8.533333-34.133333 12.8-8.533333 25.6-8.533333 29.866667 4.266667 4.266667 12.8 0 25.6-8.533333 34.133333z m413.866666-247.466667c12.8 0 25.6-8.533333 25.6-21.333333v-4.266667c21.333333-187.733333-153.6-153.6-153.6-153.6-17.066667 0-25.6 12.8-25.6 29.866667 0 17.066667 12.8 29.866667 25.6 29.866667 128-29.866667 98.133333 93.866667 98.133334 93.866666 0 12.8 12.8 25.6 29.866666 25.6z m-21.333333-324.266666c-59.733333-12.8-119.466667 0-136.533333 0h-4.266667c-17.066667 4.266667-29.866667 21.333333-29.866667 38.4 0 21.333333 17.066667 38.4 38.4 38.4 0 0 21.333333-4.266667 38.4-8.533334 12.8-4.266667 136.533333-4.266667 200.533334 98.133334 34.133333 76.8 12.8 128 12.8 136.533333 0 0-8.533333 21.333333-8.533334 38.4 0 21.333333 17.066667 38.4 38.4 38.4 17.066667 0 34.133333-4.266667 38.4-34.133333 68.266667-217.6-81.066667-320-187.733333-345.6z" fill="#ffffff" p-id="35931"></path></svg>

Before

Width:  |  Height:  |  Size: 2.5 KiB

2
src/components/Footer.vue

@ -5,7 +5,7 @@ @@ -5,7 +5,7 @@
<img v-if="isRefresh1 " src="../assets/img/icon/refresh1.png" alt="" class="refresh">
</div>
<div class="l-button" @click="refresh(2)">
<span v-if="!isRefresh2" :class="{active:currentTab === 2}">关注</span>
<span v-if="!isRefresh2" :class="{active:currentTab === 2}">同城</span>
<img v-if="isRefresh2" src="../assets/img/icon/refresh1.png" alt="" class="refresh">
</div>
<div class="l-button" @click="tab(3)">

302
src/components/Other.vue

@ -1,302 +0,0 @@ @@ -1,302 +0,0 @@
<template>
<div class="me">
<div class="container">
<!--<div class="header" v-bind:style="{height:height/2+'px'}">-->
<div class="header">
<div class="top pt20p pl10p pr10p">
<img src="../assets/img/icon/next.svg" alt="" @click="$emit('back')">
<img src="../assets/img/icon/more.svg" alt="">
</div>
<div class="bottom">
<div class="container pr10p pl10p pt10p">
<div class="head">
<img src="../assets/img/icon/head-image.jpeg" class="head-image ml20p">
<div class="other-buttons" v-if="false">
<div class="attention">
关注
</div>
<div class="more-attention">
-
</div>
</div>
<div class="my-buttons ">
<div class="collect">
<img src="../assets/img/icon/star-white.png" alt="">
<span class="mr5p">收藏</span>
</div>
<div class="add-friend">
<img src="../assets/img/icon/add-friend-white.svg" alt="">
</div>
<div class="qr-code">
<img src="../assets/img/icon/qr-code-white.svg" alt="">
</div>
</div>
</div>
<div class="description">
<p class="name f22 mt5p mb5p">ttentau</p>
<div class="number mb10p">
<span>抖音号605128307</span>
<div class="jrtt">
<img src="../assets/img/icon/sina.svg" alt="">
<span>头条主页</span>
<img src="../assets/img/icon/next.svg" alt="">
</div>
</div>
<div class="signature f12 mb10p">
<span>填写个性签名更容易获得别人关注哦</span>
</div>
<div class="info f10 mb10p">
<div class="age">
<img src="../assets/img/icon/person.svg" alt="">
<span>22</span>
</div>
<div class="location">
<span>上海</span>
</div>
<div class="school">
四川理工大学
</div>
</div>
<div class="heat mb10p">
<span>8获赞</span>
<span>38关注</span>
<span>42粉丝</span>
</div>
</div>
<div class="tabset">
<div class="tab active" @click="toggleTab($event,0)">
<span>作品1</span>
</div>
<div class="tab" @click="toggleTab($event,1)">
<span>动态6</span>
</div>
<div class="tab" @click="toggleTab($event,2)">
<span>喜欢6</span>
</div>
</div>
</div>
</div>
</div>
<div class="content oh">
<div class="video-container" v-for="item of videos" v-bind:style="{'height':width/3*1.2+'px'}">
<video src="http://qy9rc9xff.hn-bkt.clouddn.com/0.mp4" poster="../assets/img/poster/src1-bg.png"></video>
<div class="love">
<img src="../assets/img/icon/love.svg" alt="">
<span class="ml5p">72.3w</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import Footer from './Footer.vue'
export default {
name: "Other",
components: {
Footer
},
data() {
return {
height: 0,
width: 0,
videos: [{}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}, {}],
}
},
created() {
this.height = window.screen.height
this.width = window.screen.width
},
methods: {
toggleTab(e, index) {
let childNodes = e.target.parentElement.childNodes
childNodes.forEach(function (item) {
item.classList.remove('active')
})
e.target.classList.add('active')
},
}
}
</script>
<style scoped lang="less">
.me {
color: white;
.header {
background: gray;
.top {
/*height: 30%;*/
height: 100px;
display: flex;
justify-content: space-between;
background: url("../assets/img/icon/top-bg.jpg");
img {
border-radius: 50%;
padding: 5px;
background: #524a4a;
height: 20px;
width: 20px;
&:nth-child(1) {
transform: rotate(180deg);
}
}
}
.bottom {
background-image: url("../assets/img/icon/head-image.jpeg");
background-position: center;
background-size: cover;
background-repeat: no-repeat;
/*height: 60%;*/
.container {
height: 100%;
background-color: #2e3244ed;
position: relative;
.head {
width: 100%;
right: 10px;
position: absolute;
top: -8px;
display: flex;
justify-content: space-between;
align-items: center;
.head-image {
background: black;
padding: 5px;
border-radius: 50%;
width: 60px;
height: 60px;
}
.my-buttons {
div {
display: flex;
align-items: center;
float: left;
border-radius: 2px;
background: #676767;
margin-right: 5px;
img {
padding: 6px;
height: 20px;
}
span {
color: #cdcdcd;
}
}
}
}
.description {
margin-top: 60px;
color: white;
.number {
padding-bottom: 10px;
border-bottom: 1px solid gray;
.jrtt {
float: right;
img {
height: 10px;
width: 10px;
}
span {
margin: 0 5px;
}
}
}
.info {
display: flex;
align-items: center;
div {
display: flex;
align-items: center;
float: left;
border-radius: 2px;
background: #676767;
margin-right: 5px;
padding: 2px 4px;
img {
height: 10px;
margin-right: 3px;
}
span {
color: #cdcdcd;
}
}
}
.heat {
span {
margin-right: 10px;
}
}
}
.tabset {
display: flex;
justify-content: space-around;
.tab {
padding-top: 10px;
padding-bottom: 10px;
text-align: center;
width: 30%;
&.active {
border-bottom: 2px solid gold;
}
}
}
}
}
}
.content {
.video-container {
width: 33%;
float: left;
position: relative;
overflow: hidden;
border: .5px solid black;
video {
width: 100%;
}
.love {
position: absolute;
bottom: 10px;
left: 10px;
display: flex;
align-items: center;
img {
height: 20px;
}
}
}
}
}
</style>

2
src/components/Share.vue

@ -109,7 +109,7 @@ @@ -109,7 +109,7 @@
<span>动态壁纸</span>
</div>
<!-- todo-->
<div class="tool" @click="$emit('dislike')">
<div class="tool" @click="closeShare($emit('dislike'))">
<img src="../assets/img/icon/components/video/dislike.png" alt="">
<span>不感兴趣</span>
</div>

67
src/components/Video.vue

@ -13,7 +13,7 @@ @@ -13,7 +13,7 @@
<!-- @click.stop="togglePlayVideo" -->
<div :style="{opacity:isMove ? 0:1}" class="normal">
<div class="toolbar mb1r">
<div class="avatar-ctn mb2r">
<div class="avatar-ctn mb4r">
<img class="avatar" :src="lVideo.author.avatar" alt=""
@click.stop="$emit('goUserInfo')">
<transition name="fade">
@ -52,13 +52,27 @@ @@ -52,13 +52,27 @@
/>
</div>
<div class="content ml1r mb1r" v-if="!isMy">
<div class="name mb1r" @click="$emit('goUserInfo')">@{{ lVideo.author.nickname }}</div>
<div class="location-wrapper" v-if=" lVideo.city || lVideo.address">
<div class="location">
<img src="../assets/img/icon/location.webp" alt="">
<span>{{ lVideo.city }}</span>
<template v-if="lVideo.address && lVideo.address">
<div class="gang"></div>
</template>
<span>{{ lVideo.address }}</span>
</div>
</div>
<div class="name mb1r fb" @click.stop="$emit('goUserInfo')">@{{ lVideo.author.nickname }}</div>
<div class="description mb1r">
{{ lVideo.desc }}
</div>
<div class="music" @click.stop="$nav('/music')">
<img src="../assets/img/icon/music.svg" alt="" class="music-image">
<BaseMarquee :key="name" :name="name" :isPlay="isPlay" :text="lVideo.music.title"/>
<BaseMarquee :key="name"
:name="name"
:isPlay="isPlay"
:text="lVideo.music.title"
@click.stop="$emit('goMusic')"/>
</div>
</div>
<div v-else class="comment-status">
@ -172,8 +186,7 @@ export default { @@ -172,8 +186,7 @@ export default {
clickTimer: null,
dbClickTimer: null,
isDbClick: false,
videoPoster: `?vframe/jpg/offset/1/w/${document.body.clientWidth}`
// videoPoster: `?vframe/jpg/offset/1/w/${document.body.clientWidth}/h/${document.body.clientHeight - 50}`
videoPoster: `?vframe/jpg/offset/0/w/${document.body.clientWidth}`
}
},
mounted() {
@ -359,8 +372,8 @@ export default { @@ -359,8 +372,8 @@ export default {
}
.pause {
width: 4.5rem;
height: 4.5rem;
width: 10rem;
height: 10rem;
opacity: 0.5;
position: absolute;
margin: auto;
@ -397,7 +410,7 @@ export default { @@ -397,7 +410,7 @@ export default {
.normal {
position: absolute;
bottom: 1rem;
bottom: 0;
width: 100%;
transition: all .3s;
@ -467,13 +480,15 @@ export default { @@ -467,13 +480,15 @@ export default {
justify-content: center;
align-items: center;
@width: 3.5rem;
img {
width: 40px;
height: 40px;
width: @width;
height: @width;
}
span {
font-size: 11px;
font-size: 1.2rem;
}
}
@ -488,6 +503,36 @@ export default { @@ -488,6 +503,36 @@ export default {
position: absolute;
bottom: 0;
width: 75%;
//display: flex;
//flex-direction: column;
.location-wrapper {
display: flex;
.location {
margin-bottom: 1rem;
display: flex;
align-items: center;
font-size: 1.2rem;
padding: .4rem;
border-radius: .3rem;
background: @second-btn-color-tran;
.gang {
height: .8rem;
width: 1.5px;
margin: 0 .5rem;
background: gray;
}
img {
margin-right: .7rem;
width: 1.8rem;
}
}
}
.music {
position: relative;

11
src/components/slide/SlideColumnVirtualList.vue

@ -11,6 +11,7 @@ @@ -11,6 +11,7 @@
</template>
<script>
import * as Vue from 'vue'
import Dom from "../../utils/dom";
export default {
name: "SlideColumnVirtualList",
@ -117,6 +118,12 @@ export default { @@ -117,6 +118,12 @@ export default {
this.checkChildren()
},
methods: {
dislike(item) {
let currentItem = new Dom(`.video-slide-item-${this.currentSlideItemIndex}`)
let replaceItem = this.getInsEl(item, this.currentSlideItemIndex, true)
new Dom(replaceItem).css('top', currentItem.css('top'))
$(currentItem.els[0]).replaceWith(replaceItem)
},
getInsEl(item, index, play = false) {
// console.log('index',index,play)
let slideVNode = this.renderSlide(item, index, play)
@ -200,7 +207,7 @@ export default { @@ -200,7 +207,7 @@ export default {
if (this.currentSlideItemIndex === 0 && !this.isDrawDown) return
if (this.currentSlideItemIndex === this.list.length - 1 && this.isDrawDown) return this.$attrs['onEnd'] && this.$emit('end')
this.$stopPropagation(e)
e && this.$stopPropagation(e)
this.$setCss(this.slideList, 'transition-duration', `300ms`)
let endTime = Date.now()
@ -214,6 +221,8 @@ export default { @@ -214,6 +221,8 @@ export default {
} else {
this.currentSlideItemIndex -= 1
}
console.log('gapTime', this.currentSlideItemIndex)
// console.log(this.slideItems.length)
let that = this
if (this.isDrawDown) {

3
src/pages/home/Index.vue

@ -85,13 +85,12 @@ @@ -85,13 +85,12 @@
<script>
import Comment from '../../components/Comment.vue'
import Other from '../../components/Other.vue'
import Share from '../../components/Share.vue'
import Footer from "../../components/Footer.vue"
export default {
name: "HomeIndex",
components: {Footer, Comment, Share, Other},
components: {Footer, Comment, Share,},
data() {
return {
height: 0,

744
src/pages/home/Index2.vue

@ -93,7 +93,7 @@ @@ -93,7 +93,7 @@
</SlideItem>
<SlideItem>
<SlideColumnVirtualList
ref="slideList"
ref="virtualList"
:list="videos"
:renderSlide="render"
v-model:active-index="videoActiveIndex"
@ -216,746 +216,7 @@ export default { @@ -216,746 +216,7 @@ export default {
},
data() {
return {
webVideos: [
{
"id": "034ae83b-ca0a-401a-b7c6-cf78361bae7b",
// "cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/48e513ae1df94a6cb0e23eabdacfdb64~c5_300x400.webp?from=4257465056_large",
'cover': 'http://douyin.ttentau.top/0.mp4?vframe/jpg/offset/1/w/375/h/812',
"dynamic_cover": "https://p3.douyinpic.com/obj/tos-cn-p-0015/80e3288d63094603beaaf2f0e1568e19_1577426215?from=4257465056_large",
// "origin_cover": "https://p3.douyinpic.com/tos-cn-p-0015/be6a2e67b69646778749e932c6d456b6_1577426215~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459040102120742003404DFC4&biz_tag=feed_cover",
'origin_cover': 'http://douyin.ttentau.top/0.mp4?vframe/jpg/offset/1/w/375/h/762',
video: 'http://douyin.ttentau.top/0.mp4',
"video_data_size": 26829508,
"duration": 427780,
"desc": "几人到深山探险,发现里面一只动物昆虫都没有,知道原因后都怕了 #看电影",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 381,
"comment_count": 20,
"download_count": 6,
"play_count": 0,
"share_count": 2,
"forward_count": 0,
"collect_count": 3,
"sort": 195,
"is_top": 0,
"city": "",
"musicId": "2ee213c6-3e3f-4758-ba5a-7f1c955604a4",
"create_time": "1630423555",
"creator_id": "93864497380",
"status": 1,
"topics": [
{
"id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
"name": "看电影",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
}
],
"music": {
"id": "cde50af2-628c-4d28-b9c6-67237a62518e",
"cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
"mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
"title": "@穷电影创作的原声",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
"author": {
"id": "93864497380",
"unique_id_modify_time": "1630393144",
"unique_id": "dyg141319",
"favoriting_count": 0,
"avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
"city": "",
"province": null,
"country": "",
"location": "",
"birthday": "1990-01-01",
"cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 0,
"follower_count": 0,
"aweme_count": 0,
"nickname": "穷电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": null,
"is_private": 0
}
},
{
"id": "0423ff88-ea37-40f6-ab88-0a90759b12ab",
"cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/9208072278a34d01b3836cce1e0fca9a~c5_300x400.jpeg?from=4257465056_large",
"dynamic_cover": "https://p9.douyinpic.com/obj/tos-cn-p-0015/9208072278a34d01b3836cce1e0fca9a?from=4257465056_large",
"origin_cover": "https://p3.douyinpic.com/tos-cn-p-0015/9ecfae1dda2141d19f3e2396d18c4f52_1610439608~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440160102120461454502506A&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/1.mp4',
"video_data_size": 6038796,
"duration": 90927,
"desc": "几分钟看科幻片《寄生异种》 #我的观影报告 #抖音电影",
"allow_download": 1,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 117,
"comment_count": 2,
"download_count": 0,
"play_count": 0,
"share_count": 2,
"forward_count": 1,
"collect_count": 0,
"sort": 48,
"is_top": 0,
"city": "350100",
"musicId": "f1e564f2-8461-48c1-824b-06bb4d3c5d82",
"create_time": "1630392647",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
"name": "我的观影报告",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
{
"id": "41821c6d-e14f-47f1-a391-f0b1f42afbe1",
"name": "抖音电影",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
},
{
"id": "05042932-a921-4c7b-9f88-618bb3100e51",
"cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/3d6a0342b7f247ed999a13bd566b360e~c5_300x400.jpeg?from=4257465056_large",
"dynamic_cover": "https://p26.douyinpic.com/obj/tos-cn-p-0015/3d6a0342b7f247ed999a13bd566b360e?from=4257465056_large",
"origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/48891e08b43e47e2a3af9f3945cf941f_1607739586~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440220102120691615D029CD1&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/2.mp4',
"video_data_size": 8996120,
"duration": 118703,
"desc": "美女失去记忆,被囚禁在密室内,没想到逃出去后才是她噩梦的开始 #我的观影报告",
"allow_download": 1,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 4378,
"comment_count": 96,
"download_count": 25,
"play_count": 0,
"share_count": 34,
"forward_count": 1,
"collect_count": 22,
"sort": 64,
"is_top": 0,
"city": "350100",
"musicId": "a8c50095-998c-436c-883c-51b3b53fb504",
"create_time": "1630392882",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
"name": "我的观影报告",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
},
{
"id": "080a3b3d-0f76-4427-9ec9-661e1621cb1a",
"cover": "https://p11.douyinpic.com/img/tos-cn-p-0015/c3bbe172b24844eb8e576a1897e04435~c5_300x400.webp?from=4257465056_large",
"dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/12fc583b6eaa49b4a0086664c8f54a5d?from=4257465056_large",
"origin_cover": "https://p26.douyinpic.com/tos-cn-p-0015/e7db9fba822c4d81b4ec4614f5c60cae~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459170102040221632C04B06F&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/3.mp4',
"video_data_size": 37824020,
"duration": 312474,
"desc": "夫妇二人来到一个诡异小镇,看到一个孩子的手,被吓到了 #看电影 ",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 123907,
"comment_count": 2346,
"download_count": 431,
"play_count": 0,
"share_count": 267,
"forward_count": 22,
"collect_count": 1341,
"sort": 311,
"is_top": 0,
"city": "",
"musicId": "02792e4a-d4b3-4b30-8e1e-fa0bd0eabe1b",
"create_time": "1630423884",
"creator_id": "93864497380",
"status": 1,
"topics": [
{
"id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
"name": "看电影",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
}
],
"music": {
"id": "cde50af2-628c-4d28-b9c6-67237a62518e",
"cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
"mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
"title": "@穷电影创作的原声",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
"author": {
"id": "93864497380",
"unique_id_modify_time": "1630393144",
"unique_id": "dyg141319",
"favoriting_count": 0,
"avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
"city": "",
"province": null,
"country": "",
"location": "",
"birthday": "1990-01-01",
"cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 0,
"follower_count": 0,
"aweme_count": 0,
"nickname": "穷电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": null,
"is_private": 0
}
},
{
"id": "08a90c93-807b-4a7a-aad3-68f75d65a9c8",
"cover": "https://p29.douyinpic.com/img/tos-cn-p-0015/1ce2018b919d49cfbdc380e9b7bc17ce~c5_300x400.jpeg?from=4257465056_large",
"dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/1ce2018b919d49cfbdc380e9b7bc17ce?from=4257465056_large",
"origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/697621dc8ff247aba499fdaedcf172fb_1606272887~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=2021083114402801021219919632028316&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/4.mp4',
"video_data_size": 12371092,
"duration": 139652,
"desc": "茂密森林中却没有一个动物或昆虫,专家进去研究,被吓得转身就跑 #我的观影报告",
"allow_download": 1,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 245,
"comment_count": 10,
"download_count": 0,
"play_count": 0,
"share_count": 0,
"forward_count": 0,
"collect_count": 2,
"sort": 74,
"is_top": 0,
"city": "350100",
"musicId": "6e1325da-1af4-4d5e-8a33-3a4a69ff50a3",
"create_time": "1630392893",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
"name": "我的观影报告",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
},
{
"id": "09c9b531-4381-4542-b7bc-ca6e59389ee1",
"cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/3099e1f9facb4f11a8d07221b39b9ffb_1575186937~c5_300x400.webp?from=4257465056_large",
"dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/f80ce3457bf34f66be9254df9544f9d8_1575186867?from=4257465056_large",
"origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/af2ef1dd2e864379a7a475b1db005b62_1575186867~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459070102112011425F04ED8F&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/5.mp4',
"video_data_size": 16916839,
"duration": 384068,
"desc": "男子在沙漠无意中召唤出可怕怪物,怪物的能力让他很绝望 #看电影",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 550,
"comment_count": 37,
"download_count": 3,
"play_count": 0,
"share_count": 3,
"forward_count": 0,
"collect_count": 5,
"sort": 208,
"is_top": 0,
"city": "",
"musicId": "b71c6566-10d9-4db0-b231-8b3e818bb191",
"create_time": "1630423585",
"creator_id": "93864497380",
"status": 1,
"topics": [
{
"id": "85ceda30-898f-4b57-b891-0e58b3ab99a9",
"name": "看电影",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
}
],
"music": {
"id": "cde50af2-628c-4d28-b9c6-67237a62518e",
"cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
"mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
"title": "@穷电影创作的原声",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
"author": {
"id": "93864497380",
"unique_id_modify_time": "1630393144",
"unique_id": "dyg141319",
"favoriting_count": 0,
"avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
"city": "",
"province": null,
"country": "",
"location": "",
"birthday": "1990-01-01",
"cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 0,
"follower_count": 0,
"aweme_count": 0,
"nickname": "穷电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": null,
"is_private": 0
}
},
{
"id": "0aeeb9f4-5160-4d07-a468-a1fddd2a425c",
"cover": "https://p11.douyinpic.com/img/tos-cn-i-0004/b8d9811844d14f28a5d71b13ea30d89a~c5_300x400.jpeg?from=4257465056_large",
"dynamic_cover": "https://p29.douyinpic.com/obj/tos-cn-i-0004/b8d9811844d14f28a5d71b13ea30d89a?from=4257465056_large",
"origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/ac6b1eb1b6994ee1a284401f422f4d93_1627866958~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108301444360102111780824E10113C&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/6.mp4',
"video_data_size": 26944285,
"duration": 276000,
"desc": "2100年人口锐减,文明疯狂倒退,现今科技成了神话般的存在 #抖音电影#我的观影报告 ",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 47,
"comment_count": 1,
"download_count": 0,
"play_count": 0,
"share_count": 1,
"forward_count": 0,
"collect_count": 1,
"sort": 8,
"is_top": 0,
"city": "350100",
"musicId": "9db983b3-b68c-465b-85f5-030f5646e01f",
"create_time": "1630391758",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "d15b72d0-5b8c-489b-a921-0fc236eec705",
"name": "抖音电影#我的观影报告",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
},
{
"id": "0b1fb9c4-9d5c-40f7-9a01-1310674cbfeb",
"cover": "https://p3.douyinpic.com/img/tos-cn-p-0015/bffc96dac41548d99a23e555d2bd3d62~c5_300x400.jpeg?from=4257465056_large",
"dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/bffc96dac41548d99a23e555d2bd3d62?from=4257465056_large",
"origin_cover": "https://p1.douyinpic.com/tos-cn-p-0015/813c7bded67f4e3da0972f85be32eb3f_1608893061~tplv-dy-360p.jpeg?from=4257465056&s=&se=false&sh=&sc=&l=202108311440220102120691615D029CD1&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/7.mp4',
"video_data_size": 9321536,
"duration": 129583,
"desc": "几分钟看科幻片《登月先锋》 #我的观影报告 #抖音电影",
"allow_download": 1,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 175,
"comment_count": 4,
"download_count": 0,
"play_count": 0,
"share_count": 2,
"forward_count": 0,
"collect_count": 2,
"sort": 57,
"is_top": 0,
"city": "350100",
"musicId": "e1c8d672-1831-47b4-87c4-da7e5c4250b9",
"create_time": "1630392882",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "c10178eb-441f-4dc7-93b6-eaae1b6248cc",
"name": "我的观影报告",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
{
"id": "41821c6d-e14f-47f1-a391-f0b1f42afbe1",
"name": "抖音电影",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
},
{
"id": "0ba38940-a395-474a-a7f6-b45c123f9c4d",
"cover": "https://p9.douyinpic.com/img/tos-cn-p-0015/9f47c686c9224036b82f5c7b147e6119~c5_300x400.webp?from=4257465056_large",
"dynamic_cover": "https://p26.douyinpic.com/obj/tos-cn-p-0015/fde5131f00e54106877d06f775cd21ca_1572239688?from=4257465056_large",
"origin_cover": "https://p11.douyinpic.com/tos-cn-p-0015/8a757ad4df69407f8d0d443eaa0b60a2_1572239690~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459110102112011425F04EF3F&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/8.mp4',
"video_data_size": 25251313,
"duration": 449263,
"desc": "",
"allow_download": 0,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 192,
"comment_count": 17,
"download_count": 1,
"play_count": 0,
"share_count": 1,
"forward_count": 0,
"collect_count": 2,
"sort": 257,
"is_top": 0,
"city": "",
"musicId": "c2a75580-1c5e-47b2-b13e-63362a95aea7",
"create_time": "1630423745",
"creator_id": "93864497380",
"status": 1,
"topics": [
{
"id": "f4209ab6-5117-4401-8070-919fd8ac2cd5",
"name": "电影",
"creator_id": "93864497380",
"create_time": "1630423745",
"status": 1
}
],
"music": {
"id": "cde50af2-628c-4d28-b9c6-67237a62518e",
"cover": "https://p29.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_100x100.jpeg?from=116350172",
"mp3": "https://sf3-cdn-tos.douyinstatic.com/obj/ies-music/1658584661080088.mp3",
"title": "@穷电影创作的原声",
"creator_id": "93864497380",
"create_time": "1630423555",
"status": 1
},
"author": {
"id": "93864497380",
"unique_id_modify_time": "1630393144",
"unique_id": "dyg141319",
"favoriting_count": 0,
"avatar": "https://p26.douyinpic.com/img/tos-cn-avt-0015/f4de202ff2e41b523838a4a767aebd16~c5_1080x1080.jpeg?from=116350172",
"city": "",
"province": null,
"country": "",
"location": "",
"birthday": "1990-01-01",
"cover": "https://p3.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 0,
"follower_count": 0,
"aweme_count": 0,
"nickname": "穷电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": null,
"is_private": 0
}
},
{
"id": "0be47c89-f6e8-4d5d-820a-072e75c52fbf",
"cover": "https://p5-ipv6.douyinpic.com/img/tos-cn-p-0015/1941731e18714268a52855ce869e3092_1572771120~c5_300x400.webp?from=4257465056_large",
"dynamic_cover": "https://p11.douyinpic.com/obj/tos-cn-p-0015/55b40ca5368a49eca282fb868c8fb98b_1572771083?from=4257465056_large",
"origin_cover": "https://p5-ipv6.douyinpic.com/tos-cn-p-0015/cd59468a8d0149aeb5291966004ae4e0_1572771088~tplv-dy-360p.webp?from=4257465056&s=&se=false&sh=&sc=&l=202108311459110102112011425F04EF3F&biz_tag=feed_cover",
video: 'http://douyin.ttentau.top/9.mp4',
"video_data_size": 17839401,
"duration": 262127,
"desc": "灰姑娘被前男友羞辱,霸道总裁看不下去充当男友,瞬间让渣男无地自容#西瓜放映厅",
"allow_download": 1,
"allow_duet": 0,
"allow_react": 0,
"allow_music": 1,
"allow_douplus": 1,
"allow_share": 1,
"digg_count": 116899,
"comment_count": 2204,
"download_count": 704,
"play_count": 0,
"share_count": 946,
"forward_count": 36,
"collect_count": 856,
"sort": 252,
"is_top": 0,
"city": "",
"musicId": "11e5f2b6-3ecc-4f6c-ae95-609313b9e22a",
"create_time": "1630423745",
"creator_id": "54884802577",
"status": 1,
"topics": [
{
"id": "6e2d8f8b-a7f3-43ca-861c-882abd9eeaf6",
"name": "西瓜放映厅",
"creator_id": "93864497380",
"create_time": "1630423585",
"status": 1
}
],
"music": {
"id": "8ce2cb26-4772-4c7b-91d9-a2580c667c21",
"cover": "https://p3.douyinpic.com/aweme/100x100/85f000239e43c3c985b5.jpeg?from=116350172",
"mp3": "https://sf6-cdn-tos.douyinstatic.com/obj/ies-music/6995889105167076132.mp3",
"title": "@喵嗷污说电影创作的原声",
"creator_id": "54884802577",
"create_time": "1630391758",
"status": 1
},
"author": {
"id": "54884802577",
"unique_id_modify_time": "1630393144",
"unique_id": "mmaawu",
"favoriting_count": 0,
"avatar": "https://p6.douyinpic.com/aweme/1080x1080/85f000239e43c3c985b5.jpeg?from=116350172",
"city": "上海",
"province": "上海",
"country": "中国",
"location": "上海",
"birthday": "1988-01-01",
"cover": "https://p9.douyinpic.com/obj/c8510002be9a3a61aad2?from=116350172",
"following_count": 1111,
"follower_count": 2222,
"aweme_count": 3333,
"nickname": "喵嗷污说电影",
"phone": "",
"sex": "0",
"last_login_time": "1630423555",
"create_time": "1630423555",
"status": 1,
"desc": "108线网红,福州人在上海,没有更新就是在吃土",
"is_private": 0
}
}
],
videos: [],
isCommenting: false,
isSharing: false,
canMove: true,
@ -984,7 +245,7 @@ export default { @@ -984,7 +245,7 @@ export default {
loading: false,
render: (item, itemIndex, play) => {
return (
<div className="base-slide-item video-slide-item" data-index={itemIndex}>
<div className={`base-slide-item video-slide-item video-slide-item-${itemIndex}`} data-index={itemIndex}>
<Video1
isPlay={play}
video={item}
@ -1028,6 +289,7 @@ export default { @@ -1028,6 +289,7 @@ export default {
}, 400)
},
dislike() {
this.$refs.virtualList.dislike(this.videos[10])
this.$notice('操作成功,将减少此类视频的推荐')
},
async getData() {

3
src/pages/me/VideoDetail.vue

@ -152,7 +152,6 @@ @@ -152,7 +152,6 @@
<script>
import Comment from '../../components/Comment.vue'
import Other from '../../components/Other.vue'
import Share from '../../components/Share.vue'
import Footer from "../../components/Footer.vue"
import src1Bg from '../../assets/img/poster/src1-bg.png'
@ -162,7 +161,7 @@ import FromBottomDialog from "../../components/dialog/FromBottomDialog"; @@ -162,7 +161,7 @@ import FromBottomDialog from "../../components/dialog/FromBottomDialog";
export default {
name: "VideoDetail",
components: {
Footer, Comment, Share, Other, Search,
Footer, Comment, Share, Search,
FromBottomDialog
},
data() {

7
src/pages/me/userinfo/EditUserInfo.vue

@ -11,8 +11,8 @@ @@ -11,8 +11,8 @@
<div class="userinfo">
<div class="change-avatar">
<div class="avatar-ctn" @click="showAvatarDialog">
<img class="avatar" src="../../../assets/img/icon/head-image.jpeg" alt="">
<img class="change" src="../../../assets/img/icon/back.png" alt="">
<img class="avatar" src="../../../assets/img/icon/avatar/6.png" alt="">
<img class="change" src="../../../assets/img/icon/me/camera-light.png" alt="">
</div>
<span>点击更换头像</span>
</div>
@ -179,7 +179,7 @@ export default { @@ -179,7 +179,7 @@ export default {
align-items: center;
flex-direction: column;
margin: 3rem 0;
@avatar-width: 7rem;
@avatar-width: 8rem;
.avatar-ctn {
position: relative;
@ -200,6 +200,7 @@ export default { @@ -200,6 +200,7 @@ export default {
}
.change {
width: 2.8rem;
z-index: 9;
position: relative;
}

Loading…
Cancel
Save