|
| 1 | +<template> |
| 2 | + <div class="iptv-container"> |
| 3 | + <div> |
| 4 | + <el-input |
| 5 | + type="textarea" |
| 6 | + :rows="2" |
| 7 | + placeholder="source" |
| 8 | + @change="hanldeTrans" |
| 9 | + v-model="source"></el-input> |
| 10 | + <!-- <el-button size="mini" type="success" @click="hanldeTrans">点击转换</el-button> --> |
| 11 | + <el-button size="mini" type="info" @click="getData" v-if="selectedList.length > 0"> |
| 12 | + 下载json |
| 13 | + </el-button> |
| 14 | + <el-button size="mini" @click="fetchData" v-if="this.list.length > 0 && !nowIsCheck"> |
| 15 | + 检查链接是否正常 |
| 16 | + </el-button> |
| 17 | + <div v-if="nowIsCheck && !isCheckOver">正在检查,进度{{nowCheckCount}}/{{this.list.length}}</div> |
| 18 | + <el-button size="mini" type="warning" v-if="isCheckOver" @click="autoSelect"> |
| 19 | + 自动选择 |
| 20 | + </el-button> |
| 21 | + <el-input |
| 22 | + v-if="selectedData !== ''" |
| 23 | + type="textarea" |
| 24 | + size="mini" |
| 25 | + :rows="2" |
| 26 | + v-model="selectedData"></el-input> |
| 27 | + </div> |
| 28 | + <div> |
| 29 | + <el-table |
| 30 | + ref="dataTable" |
| 31 | + @selection-change="handleSelectionChange" |
| 32 | + :data="list" |
| 33 | + style="width: 100%"> |
| 34 | + <el-table-column |
| 35 | + type="selection" |
| 36 | + width="55"> |
| 37 | + </el-table-column> |
| 38 | + <el-table-column |
| 39 | + label="status" width="70"> |
| 40 | + <template slot-scope="scope"> |
| 41 | + <div v-if="scope.row.status === 0"> |
| 42 | + <el-tag type="info">未检查</el-tag> |
| 43 | + </div> |
| 44 | + <div v-else-if="scope.row.status === 1"> |
| 45 | + <el-tag type="success">可用</el-tag> |
| 46 | + </div> |
| 47 | + <div v-else-if="scope.row.status === 2"> |
| 48 | + <el-tag type="danger">不可用</el-tag> |
| 49 | + </div> |
| 50 | + </template> |
| 51 | + </el-table-column> |
| 52 | + <el-table-column |
| 53 | + label="tvg-language"> |
| 54 | + <template slot-scope="scope"> |
| 55 | + <div>{{scope.row.name}}</div> |
| 56 | + <!-- <img height="20" :src="scope.row.tvgLogo" > --> |
| 57 | + </template> |
| 58 | + </el-table-column> |
| 59 | + <el-table-column |
| 60 | + prop="url" |
| 61 | + label="url"> |
| 62 | + </el-table-column> |
| 63 | + <el-table-column |
| 64 | + prop="tvgId" |
| 65 | + label="tvg-id" width="120"> |
| 66 | + </el-table-column> |
| 67 | + <el-table-column |
| 68 | + prop="tvgCountry" |
| 69 | + label="tvg-country" width="100"> |
| 70 | + </el-table-column> |
| 71 | + <el-table-column |
| 72 | + label="tvg-language" width="120"> |
| 73 | + <template slot-scope="scope"> |
| 74 | + <el-tag |
| 75 | + type="success" size="mini" |
| 76 | + v-for="(value,index) in scope.row.tvgLanguage" :key="index"> |
| 77 | + {{value}} |
| 78 | + </el-tag> |
| 79 | + </template> |
| 80 | + </el-table-column> |
| 81 | + <el-table-column |
| 82 | + prop="groupTitle" |
| 83 | + label="group-title" width="100"> |
| 84 | + </el-table-column> |
| 85 | + </el-table> |
| 86 | + </div> |
| 87 | + </div> |
| 88 | +</template> |
| 89 | +<script> |
| 90 | +import { fetchGet } from '../utils/axios'; |
| 91 | +
|
| 92 | +export default { |
| 93 | + data() { |
| 94 | + return { |
| 95 | + source: '', |
| 96 | + list: [], |
| 97 | + isCheckOver: false, |
| 98 | + firstTitle: '', |
| 99 | + selectedData: '', |
| 100 | + selectedList: [], |
| 101 | + nowCheckCount: 0, |
| 102 | + nowIsCheck: false, |
| 103 | + }; |
| 104 | + }, |
| 105 | + watch: { |
| 106 | + nowCheckCount(newVal) { |
| 107 | + if (newVal === this.list.length) { |
| 108 | + this.isCheckOver = true; |
| 109 | + } |
| 110 | + }, |
| 111 | + }, |
| 112 | + methods: { |
| 113 | + handleSelectionChange(val) { |
| 114 | + this.selectedList = val; |
| 115 | + this.selectedData = ''; |
| 116 | + }, |
| 117 | + getData() { |
| 118 | + let name = `${this.firstTitle}\n`; |
| 119 | + for (let i = 0; i < this.selectedList.length; i += 1) { |
| 120 | + name += `${this.selectedList[i].originalData}\n`; |
| 121 | + } |
| 122 | + this.selectedData = name; |
| 123 | + }, |
| 124 | + autoSelect() { |
| 125 | + for (let i = 0; i < this.list.length; i += 1) { |
| 126 | + if (this.list[i].status === 1) { |
| 127 | + this.selectedList.push(this.list[i]); |
| 128 | + this.$refs.dataTable.toggleRowSelection(this.list[i]); |
| 129 | + } |
| 130 | + } |
| 131 | + }, |
| 132 | + hanldeTrans() { |
| 133 | + this.isCheckOver = false; |
| 134 | + this.firstTitle = ''; |
| 135 | + if (this.source === '') { |
| 136 | + return; |
| 137 | + } |
| 138 | + this.parseList(); |
| 139 | + }, |
| 140 | + fetchData() { |
| 141 | + this.nowCheckCount = 0; |
| 142 | + this.nowIsCheck = false; |
| 143 | + this.isCheckOver = false; |
| 144 | + for (let i = 0; i < this.list.length; i += 1) { |
| 145 | + this.nowIsCheck = true; |
| 146 | + fetchGet(this.list[i].url).then((res) => { |
| 147 | + console.log(res); |
| 148 | + this.list[i].status = 1; |
| 149 | + this.nowCheckCount += 1; |
| 150 | + }).catch((err) => { |
| 151 | + console.log(err); |
| 152 | + this.list[i].status = 2; |
| 153 | + this.nowCheckCount += 1; |
| 154 | + }); |
| 155 | + } |
| 156 | + }, |
| 157 | + parseList() { |
| 158 | + if (this.source !== '') { |
| 159 | + this.list = []; |
| 160 | + const spiStr = this.source.split('\n'); |
| 161 | + this.firstTitle = spiStr[0]; |
| 162 | + if (spiStr.length > 1) { |
| 163 | + const len = (spiStr.length - 1) / 2; |
| 164 | + for (let i = 1; i < len; i += 1) { |
| 165 | + const index = 1 + (i * 2); |
| 166 | + this.parseRowToData(spiStr[index], spiStr[index + 1]); |
| 167 | + } |
| 168 | + } |
| 169 | + } |
| 170 | + }, |
| 171 | + parseRowToData(one, two) { |
| 172 | + const row = { |
| 173 | + url: two, |
| 174 | + groupTitle: this.pregValue(one, 'group-title'), |
| 175 | + tvgLogo: this.pregValue(one, 'tvg-logo'), |
| 176 | + tvgLanguage: this.parseLanguages(this.pregValue(one, 'tvg-language')), |
| 177 | + tvgCountry: this.pregValue(one, 'tvg-country'), |
| 178 | + tvgId: this.pregValue(one, 'tvg-id'), |
| 179 | + status: 0, |
| 180 | + name: this.parseName(one), |
| 181 | + originalData: `${one}\n${two}`, |
| 182 | + }; |
| 183 | + this.list.push(row); |
| 184 | + }, |
| 185 | + pregValue(str, name) { |
| 186 | + let regex; |
| 187 | + if (name === 'group-title') { |
| 188 | + regex = /group-title="(.*)"/mg; |
| 189 | + } else if (name === 'tvg-logo') { |
| 190 | + regex = /tvg-logo="(.*)"/mg; |
| 191 | + } else if (name === 'tvg-language') { |
| 192 | + regex = /tvg-language="(.*)"/mg; |
| 193 | + } else if (name === 'tvg-country') { |
| 194 | + regex = /tvg-country="(.*)"/mg; |
| 195 | + } else if (name === 'tvg-id') { |
| 196 | + regex = /tvg-id="(.*)"/mg; |
| 197 | + } |
| 198 | + let m; |
| 199 | + let value; |
| 200 | + while ((m = regex.exec(str)) !== null) { |
| 201 | + if (m.index === regex.lastIndex) { |
| 202 | + regex.lastIndex++; |
| 203 | + } |
| 204 | + m.forEach((match, groupIndex) => { |
| 205 | + if (groupIndex === 1) { |
| 206 | + value = match; |
| 207 | + } |
| 208 | + }); |
| 209 | + } |
| 210 | + return value.split('" ')[0]; |
| 211 | + }, |
| 212 | + parseName(name) { |
| 213 | + const row = name.split(','); |
| 214 | + return row[row.length - 1]; |
| 215 | + }, |
| 216 | + parseLanguages(name) { |
| 217 | + return name.split(';'); |
| 218 | + }, |
| 219 | + }, |
| 220 | +}; |
| 221 | +</script> |
| 222 | +<style lang="sass" scoped> |
| 223 | +.iptv-container |
| 224 | +</style> |
0 commit comments