pxl/tk-page-Fan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善功能

Browse Source
This commit is contained in:
没复习
2025-04-10 18:11:03 +08:00
parent b71c2bd071
commit 0bbe30bc7e
9 changed files with 324 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/HomeView.vue
View File

@@ -45,7 +45,7 @@
<el-form label-position="left" label-width="100px" :model="formData">
<div class="from-input-item1">
<img src="@/assets/password.png" alt="">
<img src="@/assets/username.png" alt="">
<el-input style="height: 25px;" v-model="formData.userId" placeholder="账号" clearable
@keyup.enter="onSubmit" />
</div>

90
src/views/hosts/hostsList.vue
View File

@@ -10,11 +10,13 @@
style="margin-left: 50px;" />
<el-button class="serch-button" style="margin-left: 50px;" type="primary" @click="serch">查询</el-button>
<el-button class="put-button" :disabled="tableData.length == 0" type="primary"
@click="exportList">导出Excel数据</el-button>
</div>
<div class="hostTable center-justify">
<el-table size="small" :data="tableData" stripe v-loading="loading">
<el-table-column prop="hostId" label="主播id" width="200">
<el-table :data="tableData" stripe v-loading="loading" height="500">
<el-table-column fixed prop="hostId" label="主播id" width="200">
<template #default="scope">
<div class="hostIdText" @click="openHTML(scope.row.hostId)"> {{ scope.row.hostId }}</div>
@@ -25,7 +27,11 @@
{{ scope.row.hostName }}
</template>
</el-table-column>
<el-table-column prop="hostlevel" label="等级" width="120">
<template #default="scope">
{{ scope.row.hostlevel }}
</template>
</el-table-column>
<el-table-column v-for="label in labelList" :key="label.paramCode" :prop="label.paramCode"
:label="label.paramCodeMeaning" width="120">
<template #default="scope">
@@ -33,7 +39,8 @@
placement="bottom" :width="600" trigger="hover">
<div style="height: 300px;">
<component :is="EChartsComponent" v-if="isPopoverVisible[`${scope.row.hostId}-${label.paramCode}`]"
:title="label.paramCodeMeaning" :id="scope.row.hostId" :dataType="label.paramCode"></component>
:title="label.paramCodeMeaning" :id="scope.row.hostId" :dataType="label.paramCode"
:time="searchForm.time"></component>
</div>
<template #reference>
<span @mouseover="openPopover(scope.row.hostId, label.paramCode)"
@@ -46,7 +53,9 @@
<el-popover v-else placement="bottom" :width="500" trigger="hover">
<div style="height: 300px;">
<component :is="EChartsComponent" v-if="isPopoverVisible[`${scope.row.hostId}-${label.paramCode}`]"
:title="label.paramCodeMeaning" :id="scope.row.hostId" :dataType="label.paramCode"></component>
:title="label.paramCodeMeaning" :id="scope.row.hostId" :dataType="label.paramCode"
:time="searchForm.time">
</component>
</div>
<template #reference>
<!-- 鼠标移入时开启 -->
@@ -69,8 +78,9 @@
</el-table>
</div>
<div class="center-justify" style="margin-top: 30px;">
<el-pagination :default-current-page="4" v-model:current-page="page" background layout="prev, pager, next"
:total="total" @change="serch" />
<el-pagination v-model:current-page="page" v-model:page-size="pageSize" background
layout="sizes, prev, pager, next" :total="total" :page-sizes="[10, 20, 50, 100]"
@size-change="handleSizeChange" @current-change="handleCurrentChange" />
</div>
</div>
</div>
@@ -78,8 +88,9 @@
<script setup>
// import { getToken, setToken, removeToken } from '@/utils/storage'
import { tkhostdata, dicts, tkhostdetail } from '@/api/account';
import { tkhostdata, dicts, tkhostdetail, exporthosts, downList } from '@/api/account';
import { usePythonBridge, } from '@/utils/pythonBridge'
import { getUser } from '@/utils/storage'
import { ref, reactive, onMounted } from 'vue';
import EChartsComponent from '@/components/EChartsComponent.vue';
@@ -127,13 +138,50 @@ onMounted(() => {
})
function serch() {
console.log("pageSize.value", pageSize.value)
console.log("page.value", page.value)
console.log("searchForm.value.country", searchForm.value.country)
console.log("time.value", searchForm.value.time)
getlist();
}
function exportList() {
downList('export/hostsinfo',
{
searchTime: searchForm.value.time,
region: searchForm.value.country,
pageSize: pageSize.value,
page: page.value,
userId: getUser().userId,
userType: getUser().userType
}
);
// exporthosts({
// searchTime: searchForm.value.time,
// region: searchForm.value.country,
// pageSize: pageSize.value,
// page: page.value,
// userId: getUser().userId,
// userType: getUser().userType
// }).then(res => {
// const blob = new Blob([res], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
// const url = window.URL.createObjectURL(blob);
// const a = document.createElement('a');
// a.href = url;
// a.download = 'table-data.xlsx'; // 下载的文件名
// document.body.appendChild(a);
// a.click();
// a.remove();
// window.URL.revokeObjectURL(url);
// })
}
function handleSizeChange(val) {
console.log(`${val} items per page`)
getlist();
}
function handleCurrentChange(val) {
console.log(`current page: ${val}`)
getlist();
}
//获取主播列表
const getlist = () => {
loading.value = true
@@ -141,17 +189,17 @@ const getlist = () => {
searchTime: searchForm.value.time,
region: searchForm.value.country,
pageSize: pageSize.value,
page: page.value
page: page.value,
userId: getUser().userId,
userType: getUser().userType
}).then(res => {
loading.value = false
total.value = res.total
tableData.value = []
res.records.forEach(item => {
item = { ...item, ...item.infoMap }
console.log(item)
tableData.value.push(item)
})
console.log(tableData.value)
})
}
@@ -208,7 +256,7 @@ function openHTML(id) {
<style lang="less">
.main {
box-sizing: border-box;
height: 100vh;
// height: 100vh;
width: 100%;
padding: 40px;
@@ -228,6 +276,16 @@ function openHTML(id) {
height: 47px;
background: #E7CA92;
border-radius: 10px;
border: none;
}
.put-button {
width: 132px;
height: 47px;
background: #E7CA92;
border-radius: 10px;
border: none;
}
}

109
src/views/hosts/workbenches.vue
View File

@@ -14,13 +14,13 @@
<div>
<el-card class="box-card-num center-justify" v-for="(item, index) in 2" :key="index">
<el-card class="box-card-num" v-for="(item, index) in 2" :key="index">
<div class="center-justify">
<div class="from-input-item">
<div class="from-input-item-title center-justify">
公会账号：
</div>
<el-input :disabled="!(isTk || tkData[index].code == 1)" v-model="tkData[index].account"
<el-input :disabled="!(isTk && tkData[index].code == 0)" v-model="tkData[index].account"
style="height: 50px;" placeholder="请输入登录账号" clearable />
</div>
@@ -28,18 +28,18 @@
<div class="from-input-item-title center-justify">
公会密码：
</div>
<el-input :disabled="!(isTk || tkData[index].code == 1)" v-model="tkData[index].password"
<el-input :disabled="!(isTk && tkData[index].code == 0)" v-model="tkData[index].password"
style="height: 50px;" type="password" placeholder="请输入登录密码" show-password />
</div>
<el-button class="open-login" style="margin-left: 60px;"
:disabled="!(isTk || tkData[index].code == 1)" type="primary"
:disabled="!(isTk && tkData[index].code == 0)" type="primary"
@click="loginTK(index)">登录tk</el-button>
<div v-if="tkData[index].code == 0" class="loginState" style="background-color: red;"></div>
<div v-else class="loginState" style="background-color: green;"></div>
<div v-if="tkData[index].code == 0" class="loginState"></div>
<div v-if="tkData[index].code == 1" class="loginState" style="background-color: green;"></div>
</div>
<div class="todayCount">今日已查询次数：{{ tkData[index].num }}</div>
</el-card>
</div>
@@ -51,7 +51,7 @@
<template #header>
<div class="card-header">
<span class="center-justify"><img src="@/assets/worklogo.png">工作台 </span>
<div>当前网络:{{ countryData }}
<div style="margin-right: 120px;">当前网络:{{ countryData }}
<!-- <el-button class="reset-button" @click="reset">重置数据</el-button> -->
</div>
</div>
@@ -116,11 +116,12 @@
import { ref, onMounted } from 'vue';
// import { useIPCountry } from '@/utils/useIPCountry';
import { usePythonBridge, } from '@/utils/pythonBridge'
import { setNumData, getNumData, getUser } from '@/utils/storage'
import { setNumData, getNumData, getUser, setTkUser, getTkUser } from '@/utils/storage'
import { ElMessage, ElMessageBox } from 'element-plus'
import { getCountryName } from '@/utils/countryUtil'
import { tkaccountuseinfo } from '@/api/account'
//导入python交互方法
const { fetchDataConfig, fetchDataCount, loginBackStage, loginTikTok } = usePythonBridge();
const { fetchDataConfig, fetchDataCount, loginBackStage, loginTikTok, backStageloginStatus, backStageloginStatusCopy } = usePythonBridge();
//ip国家
let countryData = ref('');
@@ -137,6 +138,10 @@ let hostData = ref({
//是否开启tk
let isTk = ref(false);
//设置状态轮询定时器
let statusTimer = ref(null);
let statusTimerCopy = ref(null);
//tk账号信息
let tkData = ref([
@@ -145,12 +150,15 @@ let tkData = ref([
password: '',
index: 1,
code: 0,
num: 0
},
{
account: '',
password: '',
index: 2,
code: 0,
num: 0
},
]);
@@ -176,7 +184,18 @@ onMounted(() => {
if (getNumData()) {
pyData.value = getNumData();
}
if (getTkUser()) {
tkData.value = getTkUser();
tkData.value[0].code = 0;
tkData.value[1].code = 0;
}
tkData.value[0].num = tkaccountuse(tkData.value[0].account)
tkData.value[1].num = tkaccountuse(tkData.value[1].account)
getIpInfo()
//查询次数查询
})
@@ -277,18 +296,23 @@ const reset = () => {
const loginTK = (index) => {
loginBackStage(JSON.stringify({
setTkUser(tkData.value)
loginBackStage({
account: tkData.value[index].account,
password: tkData.value[index].password,
index: index
})).then((res) => {
// let data = JSON.parse(res);
// if (data.code == 1) {
// tkData.value[data.index].code = 1;
// }
}).catch((err) => {
})
if (index == 0) {
statusTimer = setInterval(() => {
getloginStatus();
}, 2000)
} else if (index == 1) {
statusTimerCopy = setInterval(() => {
getloginStatusCopy();
}, 2000)
}
}
const openTK = () => {
@@ -297,9 +321,38 @@ const openTK = () => {
loginTikTok();
}
function jszhuru() {
isTk.value = true;
tkData[index].code = 1;
function getloginStatus() {
backStageloginStatus().then((res) => {
const data = JSON.parse(res);
tkData.value[data.index].code = data.code
if (data.code == 1) {
clearInterval(statusTimer);
statusTimer = null;
}
})
}
function getloginStatusCopy() {
backStageloginStatusCopy().then((res) => {
const data = JSON.parse(res);
tkData.value[data.index].code = data.code
if (data.code == 1) {
clearInterval(statusTimer);
statusTimer = null;
}
})
}
function tkaccountuse(id) {
let num = 0;
tkaccountuseinfo({ userId: id }).then((res) => {
num = res
console.log(num)
})
return num
}
</script>
@@ -346,15 +399,20 @@ function jszhuru() {
}
.box-card-num {
width: 897px;
height: 145px;
background: #FFFFFF;
box-shadow: 0px 0px 21px 0px rgba(183, 183, 183, 0.33);
border-radius: 24px;
margin-bottom: 30px;
padding-top: 18px;
box-sizing: border-box;
.todayCount {
padding: 15px 21px;
font-size: 14px;
}
}
.from-input-item {
@@ -382,7 +440,7 @@ function jszhuru() {
width: 15px;
height: 15px;
border-radius: 50%;
background-color: red;
background-color: #b90000;
margin-left: 15px;
}
@@ -424,6 +482,7 @@ label {
height: 47px;
background: #E7CA92;
border-radius: 10px;
border: none;
}
.reset-button {