|
|
@@ -0,0 +1,316 @@
|
|
|
+<template>
|
|
|
+ <el-popover
|
|
|
+ placement="bottom"
|
|
|
+ :visible="visible"
|
|
|
+ :width="800"
|
|
|
+ trigger="click"
|
|
|
+ >
|
|
|
+ <template #reference>
|
|
|
+ <div
|
|
|
+ v-text="program || '请选择节目'"
|
|
|
+ class="el-input__inner"
|
|
|
+ @click="visible = !visible"
|
|
|
+ style="height: 33px;line-height: 33px;min-width: 220px;cursor: pointer;"
|
|
|
+ ></div>
|
|
|
+ </template>
|
|
|
+ <el-form :inline="true" size="small" :model="form" class="demo-form-inline">
|
|
|
+ <el-form-item label="">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.data"
|
|
|
+ type="daterange"
|
|
|
+ @change="dateChange"
|
|
|
+ range-separator="-"
|
|
|
+ :disabled-date="disabledDate"
|
|
|
+ start-placeholder="开始时间"
|
|
|
+ end-placeholder="结束时间"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <local-popver
|
|
|
+ placeholder="请选择频道"
|
|
|
+ @changeEvent="changeChannel"
|
|
|
+ :list="channelList"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <local-popver
|
|
|
+ placeholder="请选择时间"
|
|
|
+ @changeEvent="changeTime"
|
|
|
+ :list="timeList"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <local-popver
|
|
|
+ placeholder="请选择星期"
|
|
|
+ @changeEvent="changeWeek"
|
|
|
+ :list="weeks"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="">
|
|
|
+ <el-select
|
|
|
+ v-model="form.times"
|
|
|
+ @change="changeTimes"
|
|
|
+ style="width: 120px;"
|
|
|
+ class="programsinput"
|
|
|
+ placeholder="请选择频次"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in firstFrequency"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <el-table
|
|
|
+ ref="table"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ :data="tableList"
|
|
|
+ height="300"
|
|
|
+ >
|
|
|
+ <el-table-column type="selection" width="55" />
|
|
|
+ <el-table-column
|
|
|
+ property="epg_name"
|
|
|
+ show-overflow-tooltip
|
|
|
+ label="节目"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ property="tv_name"
|
|
|
+ show-overflow-tooltip
|
|
|
+ label="频道"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ property="weekday"
|
|
|
+ show-overflow-tooltip
|
|
|
+ label="星期"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ property="start_time"
|
|
|
+ show-overflow-tooltip
|
|
|
+ label="时间"
|
|
|
+ width="300"
|
|
|
+ >
|
|
|
+ <template #default="scope">
|
|
|
+ {{ scope.row.start_time.replace(/:00$/, "") }} -
|
|
|
+ {{ scope.row.end_time.replace(/:00$/, "") }}
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-pagination
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :currentPage="page"
|
|
|
+ layout="prev, pager, next"
|
|
|
+ :total="total"
|
|
|
+ ></el-pagination>
|
|
|
+ <div class="progtamsfooter">
|
|
|
+ <el-row class="mb-4">
|
|
|
+ <el-button @click="visible = false">取消</el-button>
|
|
|
+ <el-button type="primary" @click="onSubmit">确定</el-button>
|
|
|
+ </el-row>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+// @ is an alias to /src
|
|
|
+
|
|
|
+import config from "@/config/index";
|
|
|
+
|
|
|
+import localPopver from "./popver.vue";
|
|
|
+import { ElNotification } from "element-plus";
|
|
|
+let selectTable = [];
|
|
|
+export default {
|
|
|
+ name: "Channel",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ form: {
|
|
|
+ times: 0,
|
|
|
+ },
|
|
|
+ program: "",
|
|
|
+ li: [],
|
|
|
+ page: 1,
|
|
|
+ visible: false,
|
|
|
+ size: 10,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ props: ["list"],
|
|
|
+ emits: ["change"],
|
|
|
+ watch: {
|
|
|
+ list() {
|
|
|
+ if (!this.list || !this.list.length) return;
|
|
|
+ this.li = this.list;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ selectTable = [];
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ channelList() {
|
|
|
+ return this.li.map(v => {
|
|
|
+ return {
|
|
|
+ name: v.tv_name,
|
|
|
+ id: v.tv_id,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ tableList() {
|
|
|
+ let l = [],
|
|
|
+ n = 0,
|
|
|
+ channel = (this.form.channel || []).join(",") + ",",
|
|
|
+ data = this.form.data || [],
|
|
|
+ time = this.form.time || [],
|
|
|
+ week = this.form.week || [],
|
|
|
+ rtmes = this.form.times || 0;
|
|
|
+ if (channel === ",") channel = "";
|
|
|
+ for (let i = 0; i < this.li.length; i++) {
|
|
|
+ const v = this.li[i],
|
|
|
+ exg = new RegExp(v.tv_name + ",", "g");
|
|
|
+ if (channel && !exg.test(channel)) continue;
|
|
|
+ for (let o = 0; o < (v.epg_list || []).length; o++) {
|
|
|
+ const item = (v.epg_list || [])[o];
|
|
|
+ if (data.length && !this.At(item.start_time, item.end_time, data))
|
|
|
+ continue;
|
|
|
+ if (time.length && !this.Attime(item.start_time, item.end_time, time))
|
|
|
+ continue;
|
|
|
+ if (week.length && !this.Atweek(item.weekday)) continue;
|
|
|
+ if (rtmes != 0 && item.is_live != rtmes ) continue;
|
|
|
+ ++n;
|
|
|
+ if (n <= this.page * this.size - this.size) continue;
|
|
|
+ if (n > this.page * this.size) break;
|
|
|
+ l.push(item);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return l;
|
|
|
+ },
|
|
|
+ total() {
|
|
|
+ let t = 0,
|
|
|
+ channel = (this.form.channel || []).join(",") + ",",
|
|
|
+ data = this.form.data || [],
|
|
|
+ time = this.form.time || [],
|
|
|
+ week = this.form.week || [],
|
|
|
+ rtmes = this.form.times || 0;
|
|
|
+ if (channel === ",") channel = "";
|
|
|
+ for (let i = 0; i < this.li.length; i++) {
|
|
|
+ const v = this.li[i],
|
|
|
+ exg = new RegExp(v.tv_name + ",", "g");
|
|
|
+ if (channel && !exg.test(channel)) continue;
|
|
|
+ for (let o = 0; o < (v.epg_list || []).length; o++) {
|
|
|
+ const item = (v.epg_list || [])[o];
|
|
|
+ if (data.length > 0 && !this.At(item.start_time, item.end_time, data))
|
|
|
+ continue;
|
|
|
+ if (time.length && !this.Attime(item.start_time, item.end_time, time))
|
|
|
+ continue;
|
|
|
+ if (week.length && !this.Atweek(item.weekday)) continue;
|
|
|
+ if (rtmes != 0 && item.is_live != rtmes ) continue;
|
|
|
+ t++;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return t;
|
|
|
+ },
|
|
|
+
|
|
|
+ timeList() {
|
|
|
+ let li = new Array(24);
|
|
|
+ li.fill(0);
|
|
|
+ for (let i = 0; i < 24; i++) {
|
|
|
+ li[i] = {
|
|
|
+ name: i,
|
|
|
+ id: i,
|
|
|
+ };
|
|
|
+ }
|
|
|
+ return li;
|
|
|
+ },
|
|
|
+ weeks() {
|
|
|
+ return config.weeks.map(v => {
|
|
|
+ return {
|
|
|
+ name: v.label,
|
|
|
+ id: v.value,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ firstFrequency() {
|
|
|
+ return config.frequency;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ selectTable = val || [];
|
|
|
+ },
|
|
|
+ onSubmit() {
|
|
|
+ if (selectTable.length > 1)
|
|
|
+ return ElNotification({
|
|
|
+ message: "请选择一个节目",
|
|
|
+ title: "Warning",
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ this.visible = false;
|
|
|
+ this.program = selectTable[0].epg_name
|
|
|
+ this.$emit("change", selectTable);
|
|
|
+ },
|
|
|
+ disabledDate(time) {
|
|
|
+ return time.getTime() > Date.now();
|
|
|
+ },
|
|
|
+ handleCurrentChange(p) {
|
|
|
+ this.page = p;
|
|
|
+ },
|
|
|
+ dateChange() {
|
|
|
+ this.page = 1;
|
|
|
+ },
|
|
|
+ changeChannel(li) {
|
|
|
+ this.page = 1;
|
|
|
+ this.form.channel = li;
|
|
|
+ },
|
|
|
+ changeTime(li) {
|
|
|
+ this.page = 1;
|
|
|
+ this.form.time = li;
|
|
|
+ },
|
|
|
+ changeWeek(li) {
|
|
|
+ this.page = 1;
|
|
|
+ this.form.week = li;
|
|
|
+ },
|
|
|
+ changeTimes(li) {
|
|
|
+ this.page = 1;
|
|
|
+ console.log(li);
|
|
|
+ },
|
|
|
+ At(sT, eT, rang) {
|
|
|
+ if (!rang.length) return false;
|
|
|
+ let s = new Date(sT.split(" ")[0] + " 00:00:00");
|
|
|
+ let e = new Date(eT.split(" ")[0] + " 00:00:00");
|
|
|
+ let start = s <= rang[1] - 0 && s >= rang[0] - 0;
|
|
|
+ let end = e <= rang[1] - 0 && e >= rang[0] - 0;
|
|
|
+ return start || end;
|
|
|
+ },
|
|
|
+ Attime(sT, eT, rang) {
|
|
|
+ let out = false;
|
|
|
+ if (!rang.length) return out;
|
|
|
+ let s = sT.split(" ")[1].split(":");
|
|
|
+ let e = eT.split(" ")[1].split(":");
|
|
|
+ for (let i = 0; i < rang.length; i++) {
|
|
|
+ const v = rang[i];
|
|
|
+ if (v === s[0] - 0 || v === e[0] - 0) {
|
|
|
+ out = true;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return out;
|
|
|
+ },
|
|
|
+ Atweek(w) {
|
|
|
+ const exg = new RegExp(w + ",", "g"),
|
|
|
+ weeks = (this.form.week || []).join(",") + ",";
|
|
|
+ return exg.test(weeks);
|
|
|
+ },
|
|
|
+ },
|
|
|
+ components: { localPopver },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+.programsinput .el-input__inner {
|
|
|
+ border: none;
|
|
|
+}
|
|
|
+.progtamsfooter {
|
|
|
+ padding: 10px 0;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+</style>
|
liyongli