|
@@ -1,79 +1,36 @@
|
|
<template>
|
|
<template>
|
|
<div class="live-room" style="min-height: 100vh; overflow: hidden">
|
|
<div class="live-room" style="min-height: 100vh; overflow: hidden">
|
|
<!-- 78 -->
|
|
<!-- 78 -->
|
|
- <van-sticky
|
|
|
|
- offset-top="0"
|
|
|
|
- style="height: 44px; width: 100%"
|
|
|
|
- :style="{ height: params.liveState != '1' ? '78px' : '44px' }"
|
|
|
|
- >
|
|
|
|
- <van-tabs
|
|
|
|
- v-model="params.liveState"
|
|
|
|
- color="#01C1B5"
|
|
|
|
- line-width="16px"
|
|
|
|
- line-height="4px"
|
|
|
|
- class="van-hairline--bottom"
|
|
|
|
- @change="onSearch"
|
|
|
|
- >
|
|
|
|
|
|
+ <van-sticky offset-top="0" style="height: 44px; width: 100%" :style="{ height: params.liveState != '1' ? '88px' : '44px' }">
|
|
|
|
+ <van-tabs v-model="params.liveState" color="#01C1B5" line-width="16px" line-height="4px" class="van-hairline--bottom" @change="onSearch">
|
|
<van-tab name="1" title="直播中"></van-tab>
|
|
<van-tab name="1" title="直播中"></van-tab>
|
|
<van-tab name="0" title="未开始"> </van-tab>
|
|
<van-tab name="0" title="未开始"> </van-tab>
|
|
<van-tab name="2" title="已结束"> </van-tab>
|
|
<van-tab name="2" title="已结束"> </van-tab>
|
|
</van-tabs>
|
|
</van-tabs>
|
|
|
|
|
|
- <div
|
|
|
|
- v-if="params.liveState != '1'"
|
|
|
|
- class="titleWrap week"
|
|
|
|
- style="height: 22px; line-height: 22px; padding: 13px 0.28rem"
|
|
|
|
- @click="showCalendar = true"
|
|
|
|
- >
|
|
|
|
|
|
+ <div v-if="params.liveState != '1'" class="titleWrap week" style="height: 22px; line-height: 22px; padding: 13px 0.28rem" @click="showCalendar = true">
|
|
<!-- <div class="calendar">
|
|
<!-- <div class="calendar">
|
|
<div>{{ params.startTime }}~{{ params.endTime }}</div>
|
|
<div>{{ params.startTime }}~{{ params.endTime }}</div>
|
|
</div> -->
|
|
</div> -->
|
|
<van-row style="color: #01c1b5">
|
|
<van-row style="color: #01c1b5">
|
|
<van-col span="10" class="flex">
|
|
<van-col span="10" class="flex">
|
|
- <img
|
|
|
|
- src="./images/icon_calendar.png"
|
|
|
|
- style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
|
- />
|
|
|
|
|
|
+ <img src="./images/icon_calendar.png" style="width: 14px; height: 14px; margin-right: 8px" />
|
|
{{ params.startTime }}</van-col
|
|
{{ params.startTime }}</van-col
|
|
>
|
|
>
|
|
<van-col span="4" class="flex" style="height: 22px">
|
|
<van-col span="4" class="flex" style="height: 22px">
|
|
<span class="calendar-line"></span>
|
|
<span class="calendar-line"></span>
|
|
</van-col>
|
|
</van-col>
|
|
<van-col span="10" class="flex">
|
|
<van-col span="10" class="flex">
|
|
- <img
|
|
|
|
- src="./images/icon_calendar.png"
|
|
|
|
- style="width: 14px; height: 14px; margin-right: 8px"
|
|
|
|
- />
|
|
|
|
|
|
+ <img src="./images/icon_calendar.png" style="width: 14px; height: 14px; margin-right: 8px" />
|
|
{{ params.endTime }}
|
|
{{ params.endTime }}
|
|
</van-col>
|
|
</van-col>
|
|
</van-row>
|
|
</van-row>
|
|
</div>
|
|
</div>
|
|
</van-sticky>
|
|
</van-sticky>
|
|
|
|
|
|
- <van-calendar
|
|
|
|
- v-model="showCalendar"
|
|
|
|
- :minDate="minDate"
|
|
|
|
- color="#01C1B5"
|
|
|
|
- :default-date="[
|
|
|
|
- dayjs(params.startTime).toDate(),
|
|
|
|
- dayjs(params.endTime).toDate(),
|
|
|
|
- ]"
|
|
|
|
- type="range"
|
|
|
|
- @confirm="onConfirm"
|
|
|
|
- :first-day-of-week="1"
|
|
|
|
- get-container="body"
|
|
|
|
- />
|
|
|
|
|
|
+ <van-calendar v-model="showCalendar" :minDate="minDate" color="#01C1B5" :default-date="[dayjs(params.startTime).toDate(), dayjs(params.endTime).toDate()]" type="range" @confirm="onConfirm" :first-day-of-week="1" get-container="body" />
|
|
|
|
|
|
- <van-list
|
|
|
|
- v-model="loading"
|
|
|
|
- v-if="dataShow"
|
|
|
|
- style="margin-top: 0.15rem"
|
|
|
|
- key="ing"
|
|
|
|
- :finished="finished"
|
|
|
|
- finished-text=" "
|
|
|
|
- :immediate-check="false"
|
|
|
|
- @load="getList()"
|
|
|
|
- >
|
|
|
|
|
|
+ <van-list v-model="loading" v-if="dataShow" style="margin-top: 0.15rem" key="ing" :finished="finished" finished-text=" " :immediate-check="false" @load="getList()">
|
|
<div v-for="(item, index) in dataList" :key="index">
|
|
<div v-for="(item, index) in dataList" :key="index">
|
|
<live-room :item="item" />
|
|
<live-room :item="item" />
|
|
</div>
|
|
</div>
|
|
@@ -115,22 +72,9 @@ export default {
|
|
};
|
|
};
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
- this.hiddenProperty =
|
|
|
|
- "hidden" in document
|
|
|
|
- ? "hidden"
|
|
|
|
- : "webkitHidden" in document
|
|
|
|
- ? "webkitHidden"
|
|
|
|
- : "mozHidden" in document
|
|
|
|
- ? "mozHidden"
|
|
|
|
- : null;
|
|
|
|
- this.visibilityChangeEvent = this.hiddenProperty.replace(
|
|
|
|
- /hidden/i,
|
|
|
|
- "visibilitychange"
|
|
|
|
- );
|
|
|
|
- document.addEventListener(
|
|
|
|
- this.visibilityChangeEvent,
|
|
|
|
- this.onVisibilityChange
|
|
|
|
- );
|
|
|
|
|
|
+ this.hiddenProperty = "hidden" in document ? "hidden" : "webkitHidden" in document ? "webkitHidden" : "mozHidden" in document ? "mozHidden" : null;
|
|
|
|
+ this.visibilityChangeEvent = this.hiddenProperty.replace(/hidden/i, "visibilitychange");
|
|
|
|
+ document.addEventListener(this.visibilityChangeEvent, this.onVisibilityChange);
|
|
|
|
|
|
document.title = "直播间";
|
|
document.title = "直播间";
|
|
this.getList();
|
|
this.getList();
|
|
@@ -206,10 +150,7 @@ export default {
|
|
},
|
|
},
|
|
beforeDestroy() {
|
|
beforeDestroy() {
|
|
clearInterval(this.pageStatusTimer);
|
|
clearInterval(this.pageStatusTimer);
|
|
- document.removeEventListener(
|
|
|
|
- this.visibilityChangeEvent,
|
|
|
|
- this.onVisibilityChange
|
|
|
|
- );
|
|
|
|
|
|
+ document.removeEventListener(this.visibilityChangeEvent, this.onVisibilityChange);
|
|
},
|
|
},
|
|
};
|
|
};
|
|
</script>
|
|
</script>
|