From 58e556554e429ce9d671232f9fbe112338527eea Mon Sep 17 00:00:00 2001
From: haiyangcui <cuiocean@gmail.com>
Date: Mon, 19 Oct 2020 12:26:32 +0200
Subject: [PATCH] =?UTF-8?q?IPTV=E6=90=9C=E7=B4=A2=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/scss/style.scss |  3 +++
 src/components/IPTV.vue    | 16 ++++++++++++++--
 src/lib/element/index.js   |  3 ++-
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/src/assets/scss/style.scss b/src/assets/scss/style.scss
index c3491f9..e95a3ba 100644
--- a/src/assets/scss/style.scss
+++ b/src/assets/scss/style.scss
@@ -228,6 +228,9 @@
           cursor: pointer;
         }
       }
+      .el-input{
+        width: 200px;
+      }
     }
     .listpage-body{
       height: calc(100% - 40px);
diff --git a/src/components/IPTV.vue b/src/components/IPTV.vue
index 8573878..df287ca 100644
--- a/src/components/IPTV.vue
+++ b/src/components/IPTV.vue
@@ -2,15 +2,20 @@
   <div class="listpage" id="IPTV">
     <div class="listpage-content">
       <div class="listpage-header">
-        <!-- <el-button @click.stop="addSite" type="text">添加</el-button> -->
+        <el-button type="text">总频道数:{{iptvList.length}}</el-button>
         <el-button @click.stop="exportSites" type="text">导出</el-button>
         <el-button @click.stop="importSites" type="text">导入</el-button>
         <el-button @click.stop="removeAllSites" type="text">清空</el-button>
         <el-button @click.stop="resetSitesEvent" type="text">重置</el-button>
+        <el-input
+          placeholder="搜索"
+          v-model.trim="searchTxt" >
+         <i slot="prefix" class="el-input__icon el-icon-search"></i>
+        </el-input>
       </div>
       <div class="listpage-body" id="iptv-table">
         <el-table
-              :data="iptvList"
+              :data="filteredTableData"
               row-key="id"
               @row-click="playEvent"
               style="width: 100%">
@@ -72,6 +77,13 @@ export default {
       set (val) {
         this.SET_VIDEO(val)
       }
+    },
+    filteredTableData () {
+      if (this.searchTxt) {
+        return this.iptvList.filter(x => x.name.toLowerCase().includes(this.searchTxt.toLowerCase()))
+      } else {
+        return this.iptvList
+      }
     }
   },
   watch: {
diff --git a/src/lib/element/index.js b/src/lib/element/index.js
index 75064b3..0bca7fa 100644
--- a/src/lib/element/index.js
+++ b/src/lib/element/index.js
@@ -1,6 +1,7 @@
 import Vue from 'vue'
-import { Message, Button, Table, TableColumn } from 'element-ui'
+import { Message, Button, Table, TableColumn, Input } from 'element-ui'
 Vue.use(Button)
 Vue.use(Table)
 Vue.use(TableColumn)
+Vue.use(Input)
 Vue.prototype.$message = Message