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-05-15 18:29:53 +08:00
parent dcd677bbab
commit 17d2251a70
6 changed files with 227 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/api/account.js
View File

@@ -45,3 +45,7 @@ export function upholdinfo(data) {
export function getCountryinfo(data) {
return postAxios({ url: 'api/tkinfo/countryinfo', data })
}
//查看名字
export function accountName(str) {
return postAxios({ url: 'api/account/accountName?accounts=' + str })
}

8
src/utils/axios.js
View File

@@ -16,9 +16,9 @@ const router = useRouter();
let baseURL = ''
if (process.env.NODE_ENV === 'development') {
// 生产环境
// baseURL = "http://api.tkpage.vvtiktok.cn"
baseURL = "http://api.tkpage.vvtiktok.cn"
// baseURL = "http://120.26.251.180:8085/"
baseURL = "http://192.168.0.111:8085/"
// baseURL = "http://192.168.0.103:8085/"
} else {
// 测试环境
// baseURL = "http://120.26.251.180:8085/"
@@ -97,8 +97,8 @@ export function postAxios({ url, data }) {
} else {
console.log(err)
ElMessage.error('报错啦');
reject(err)
ElMessage.error('报错啦' + err.response.status);
// reject(err)
}

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

@@ -2,12 +2,23 @@
<div class="hostList">
<div>
<div style="display: flex;">
<el-select v-model="searchForm.country" filterable placeholder="选择国家" size="large" style="width: 240px">
<el-select v-model="searchForm.country" filterable placeholder="选择国家" size="large" style="width: 160px">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<div></div>
<el-date-picker v-model="searchForm.time" type="date" value-format="YYYYMMDD" placeholder="选择查询时间" size="large"
style="margin-left: 50px;" />
style="margin-left: 50px;width: 160px;" />
<el-input v-model="searchForm.hostId" placeholder="请输入主播id" size="large"
style="width: 160px; margin-left: 50px;" clearable />
<el-select v-if="userInfo.userType == 3" v-model="searchForm.belongYn" filterable placeholder="分配情况"
style="width: 120px; margin-left: 50px;">
<el-option
v-for="item in [{ label: '全部', value: '' }, { label: '未分配', value: '0' }, { label: '已分配', value: '1' }]"
:key="item.value" :label="item.label" :value="item.value" />
</el-select>
<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"
@@ -35,6 +46,28 @@
{{ scope.row.hostName }}
</template>
</el-table-column> -->
<el-table-column v-if="userInfo.userType == 3" prop="belongBy" label="分配情况" width="120">
<template #default="scope">
<el-popover v-if="scope.row.belongBy" placement="bottom" :width="200" trigger="hover"
@show="openAccountName(scope.row.belongBy)">
<template #reference>
<!-- <div @click="openAccountName(scope.row.belongBy)"> -->
<div style="color: green;">
{{ scope.row.belongBy == null || scope.row.belongBy == '' ? "未分配" : "已分配" }}
</div>
</template>
<div v-for="str in staffId" :key="str">
{{ str }}
</div>
<!-- <el-table :data="gridData">
<el-table-column width="150" property="date" label="date" />
<el-table-column width="100" property="name" label="name" />
</el-table> -->
</el-popover>
<div v-show="!scope.row.belongBy">未分配</div>
</template>
</el-table-column>
<el-table-column prop="hostlevel" label="等级" width="120">
<template #default="scope">
{{ scope.row.hostlevel }}
@@ -147,37 +180,77 @@
</template>
</el-dialog>
<!-- <el-dialog v-model="hostNameVisible" title="分配情况" align-center>
{{ staffId }}
<template #footer>
<span class="dialog-footer">
<el-button type="primary" @click="hostNameVisible = false">
确定
</el-button>
</span>
</template>
</el-dialog> -->
<el-dialog v-model="filterdialogVisible" width="800px" :before-close="handleClose">
<el-row :gutter="20">
<el-col :span="8">
<label>选择筛选条件</label>
<el-select v-model="searchForm.dataType" filterable placeholder="筛选条件" style="width: 240px">
<el-option v-for="item in filterOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-row :gutter="20" v-for="item in filterOptions" :key="item.type">
<el-col :span="4">
<!-- <label>选择筛选条件</label> -->
<div style="height: 100%;padding-top: 10px;" class="center-justify">
{{ item.label }}
</div>
</el-col>
<el-col :span="8">
<div v-if="!(searchForm.dataType == 'InvitationType')"><label>最小值</label></div>
<el-col :span="10">
<div v-if="!(item.type == 'InvitationType')"><label>最小值</label></div>
<div v-else><label>普票/金票</label></div>
<el-input v-show="!(searchForm.dataType == 'InvitationType')" type="number" v-model="searchForm.dataStart"
placeholder="请输入最小值" />
<el-select v-show="(searchForm.dataType == 'InvitationType')" v-model="searchForm.dataStart" filterable
placeholder="请选择" style="width: 240px">
<el-option v-for="item in [{ label: '普票', value: '1' }, { label: '金票', value: '2' }]" :key="item.value"
:label="item.label" :value="item.value" />
<el-input v-show="!(item.type == 'InvitationType')" oninput="if(value.length>10)value=value.slice(0,10)"
type="number" v-model.number="item.dataStart" placeholder="请输入最小值" />
<el-select v-show="(item.type == 'InvitationType')" v-model="item.dataStart" filterable placeholder="请选择"
style="width: 240px">
<el-option
v-for="item in [{ label: '全部', value: '' }, { label: '普票', value: '1' }, { label: '金票', value: '2' }]"
:key="item.value" :label="item.label" :value="item.value" />
</el-select>
</el-col>
<el-col :span="10">
<div v-show="!(item.type == 'InvitationType')"><label>最大值</label></div>
<el-input v-show="!(item.type == 'InvitationType')" oninput="if(value.length>10)value=value.slice(0,10)"
type="number" v-model.number="item.dataEnd" placeholder="请输入最大值" />
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="4">
<!-- <label>选择筛选条件</label> -->
<div style="height: 100%;padding-top: 10px;" class="center-justify">
排序
</div>
</el-col>
<el-col :span="10">
<div><label>排序类型</label></div>
<el-select v-model="sortData.sortType" filterable placeholder="请选择" style="width: 240px">
<el-option v-for="item in filterOptions" :key="item.value" :label="item.label" :value="item.type" />
</el-select>
</el-col>
<el-col :span="8">
<div v-show="!(searchForm.dataType == 'InvitationType')"><label>最大值</label></div>
<el-col :span="10">
<div><label>升序/降序</label></div>
<el-input v-show="!(searchForm.dataType == 'InvitationType')" type="number" v-model="searchForm.dataEnd"
placeholder="请输入最大值" />
<el-select v-model="sortData.sortForm" filterable placeholder="请选择" style="width: 240px">
<el-option v-for="item in [{ label: '升序', value: 'asc' }, { label: '降序', value: 'desc' }]" :key="item.value"
:label="item.label" :value="item.value" />
</el-select>
</el-col>
</el-row>
<template #footer>
<span class="dialog-footer">
<!-- <el-button @click="filterdialogVisible = false">取消</el-button> -->
<el-button type="primary" @click="handelClick">
确认
@@ -193,7 +266,7 @@
<script setup>
// import { getToken, setToken, removeToken } from '@/utils/storage'
import { tkhostdata, dicts, tkhostdetail, downList, getStaffList, managerhosts, upholdinfo, getCountryinfo } from '@/api/account';
import { tkhostdata, dicts, tkhostdetail, downList, getStaffList, managerhosts, upholdinfo, getCountryinfo, accountName } from '@/api/account';
import { usePythonBridge, } from '@/utils/pythonBridge'
import { getUser, setSerch, getSerch } from '@/utils/storage'
import { ref, reactive, onMounted } from 'vue';
@@ -213,8 +286,10 @@ const multipleTableRef = ref(null)
let labelList = ref([])
const tableData = ref([])
//选择国家
//主播列表传参
const searchForm = ref({
hostId: '',
belongYn: '',
country: '',
// time: new Date().toISOString().split('T')[0].replace(/-/g, ''),
time: '',
@@ -222,7 +297,8 @@ const searchForm = ref({
dataStart: '',
dataEnd: '',
})
//排序
let sortData = ref({ sortForm: 'desc', sortType: 'hostcoins' })
//员工选择列表
let staffOptions = ref([])
//筛选条件选择列表
@@ -233,11 +309,15 @@ let staffValue = ref('')
let selectHostList = ref([])
//分配弹窗是否弹出
let dialogFormVisible = ref(false)
//分配情况弹窗是否弹出
let hostNameVisible = ref(false)
//备注弹窗是否弹出
let commentVisible = ref(false)
//筛选弹窗是否弹出
let filterdialogVisible = ref(false)
//分配的员工
let staffId = ref({})
//备注信息
let commentInfo = ref('')
//备注信息主播
@@ -277,11 +357,22 @@ function exportList() {
searchForm.value.dataEnd = searchForm.value.dataStart
}
exportToExcel({
hostId: searchForm.value.hostId == '' ? null : searchForm.value.hostId,
belongYn: searchForm.value.belongYn == '' ? null : searchForm.value.belongYn,
searchTime: searchForm.value.time == '' ? null : searchForm.value.time,
region: searchForm.value.country == '' ? null : searchForm.value.country,
dataType: searchForm.value.dataType == '' ? null : searchForm.value.dataType,
dataStart: searchForm.value.dataStart == '' ? null : searchForm.value.dataStart,
dataEnd: searchForm.value.dataEnd == '' ? null : searchForm.value.dataEnd,
sortType: sortData.value.sortType,
sortForm: sortData.value.sortForm,
conditions: filterOptions.value.map(option => {
return {
...option,
dataEnd: option.dataEnd == '' ? null : option.dataEnd,
dataStart: option.dataStart == '' ? null : option.dataStart
};
}),
// dataType: searchForm.value.dataType == '' ? null : searchForm.value.dataType,
// dataStart: searchForm.value.dataStart == '' ? null : searchForm.value.dataStart,
// dataEnd: searchForm.value.dataEnd == '' ? null : searchForm.value.dataEnd,
pageSize: pageSize.value,
page: page.value,
userId: userInfo.value.userId,
@@ -317,6 +408,7 @@ function handleCurrentChange(val) {
//选择行
function handleSelectionChange(data) {
console.log(data)
selectHostList.value = []
data.forEach(item => {
selectHostList.value.push(item.hostId)
})
@@ -335,11 +427,22 @@ const getlist = () => {
loading.value = true
console.log(searchForm.value)
tkhostdata({
hostId: searchForm.value.hostId == '' ? null : searchForm.value.hostId,
belongYn: searchForm.value.belongYn == '' ? null : searchForm.value.belongYn,
searchTime: searchForm.value.time == '' ? null : searchForm.value.time,
region: searchForm.value.country == '' ? null : searchForm.value.country,
dataType: searchForm.value.dataType == '' ? null : searchForm.value.dataType,
dataStart: searchForm.value.dataStart == '' ? null : searchForm.value.dataStart,
dataEnd: searchForm.value.dataEnd == '' ? null : searchForm.value.dataEnd,
sortType: sortData.value.sortType,
sortForm: sortData.value.sortForm,
conditions: filterOptions.value.map(option => {
return {
...option,
dataEnd: option.dataEnd == '' ? null : option.dataEnd,
dataStart: option.dataStart == '' ? null : option.dataStart
};
}),
// dataType: searchForm.value.dataType == '' ? null : searchForm.value.dataType,
// dataStart: searchForm.value.dataStart == '' ? null : searchForm.value.dataStart,
// dataEnd: searchForm.value.dataEnd == '' ? null : searchForm.value.dataEnd,
pageSize: pageSize.value,
page: page.value,
userId: userInfo.value.userId,
@@ -363,25 +466,34 @@ const getlist = () => {
}
function handelClick() {
setSerch({ dataType: searchForm.value.dataType, dataStart: searchForm.value.dataStart, dataEnd: searchForm.value.dataEnd })
filterOptions.value.forEach(item => {
if (item.type == 'InvitationType') {
item.dataEnd = item.dataStart
}
})
setSerch(filterOptions.value)
console.log(filterOptions.value)
filterdialogVisible.value = false
}
function handleClose(done) {
console.log('关闭')
searchForm.value = {
dataType: '',
dataStart: '',
dataEnd: '',
}
// searchForm.value = {
// dataType: '',
// dataStart: '',
// dataEnd: '',
// }
done()
}
function getSerchStorage() {
if (getSerch()) {
searchForm.value.dataType = getSerch().dataType
searchForm.value.dataStart = getSerch().dataStart
searchForm.value.dataEnd = getSerch().dataEnd
// filterOptions.value = getSerch()
}
}
@@ -431,11 +543,17 @@ const getdictionary = () => {
// labelList.value = res.records
labelList.value = res
console.log(labelList.value)
labelList.value.forEach(item => {
filterOptions.value.push({
value: item.paramCode,
label: item.paramCodeMeaning
})
if (item.paramCodeMeaning != '获取时间') {
filterOptions.value.push({
type: item.paramCode,
label: item.paramCodeMeaning,
dataStart: '',
dataEnd: ''
})
}
})
})
@@ -531,13 +649,24 @@ function openHTML(id) {
})
}
function openAccountName(idStr) {
if (idStr) {
hostNameVisible.value = true
accountName(idStr).then(res => {
staffId.value = JSON.stringify(res).replace(/[{}"]/g, '') // 移除所有 {} 和 "
.split(',') // 按逗号分割成数组
console.log(res)
})
}
}
</script>
<style lang="less">
.hostList {
box-sizing: border-box;
// height: 100vh;
width: 100%;
padding: 40px;
/* 页面无法选中 */

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

@@ -6,6 +6,7 @@
<div>有效主播: <span>{{ hostData.validAnchorsCount }}</span></div>
<div> 已查询: <span>{{ hostData.checkedDataCount }}</span></div>
<div>可邀请: <span>{{ hostData.canInvitationCount }}</span></div>
<div>运行时间: <span>{{ formattedTime }}</span></div>
</div>
<div class="center-line" style="padding-top: 15vh;">
@@ -113,7 +114,7 @@
</template>
<script setup>
import { ref, onMounted } from 'vue';
import { ref, onMounted, computed } from 'vue';
import { usePythonBridge, } from '@/utils/pythonBridge'
import { setNumData, getNumData, getUser, setTkUser, getTkUser } from '@/utils/storage'
import { ElMessage, ElMessageBox } from 'element-plus'
@@ -132,7 +133,6 @@ let hostData = ref({
validAnchorsCount: 0,
canInvitationCount: 0,
checkedDataCount: 0,
});
//是否开启tk
// let isTk = ref(true);
@@ -179,6 +179,7 @@ let pyData = ref({
//按钮提交状态
let submitting = ref(true);
onMounted(() => {
//从缓存获取数据
if (getNumData()) {
@@ -194,7 +195,6 @@ onMounted(() => {
tkaccountuse(tkData.value[1].account, 1)
getIpInfo()
//查询次数查询
})
@@ -281,7 +281,9 @@ const submit = () => {
tenantId: getUser().tenantId,
userId: getUser().userId,
})).then((res) => {
//开始计时器
startTimer();
//开启查询次数
getHostTimer.value = setInterval(() => {
fetchDataCount().then((res) => {
hostData.value = JSON.parse(res);
@@ -318,6 +320,7 @@ const unsubmit = () => {
tenantId: getUser().tenantId,
userId: getUser().userId,
})).then((res) => {
pauseTimer();
pyData.value.isStart = true;
clearInterval(getHostTimer.value);
getHostTimer.value = null;
@@ -401,6 +404,44 @@ function tkaccountuse(id, index) {
})
}
const isRunning = ref(false);
const totalSeconds = ref(0);
//定时器
let timerCrawl = null;
//清空时间 并开始运行
const startTimer = () => {
resetTimer();
if (isRunning.value) return;
isRunning.value = true;
timerCrawl = setInterval(() => {
totalSeconds.value++;
}, 1000);
};
//结束运行 暂停
const pauseTimer = () => {
isRunning.value = false;
clearInterval(timerCrawl);
};
//清空时间
const resetTimer = () => {
isRunning.value = false;
clearInterval(timerCrawl);
totalSeconds.value = 0;
};
// 格式化时间为 HH:MM:SS
const formattedTime = computed(() => {
const hours = Math.floor(totalSeconds.value / 3600);
const minutes = Math.floor((totalSeconds.value % 3600) / 60);
const seconds = totalSeconds.value % 60;
return [
hours.toString().padStart(2, '0'),
minutes.toString().padStart(2, '0'),
seconds.toString().padStart(2, '0')
].join(':');
});
</script>
<style scoped lang="less">
@@ -435,7 +476,7 @@ function tkaccountuse(id, index) {
background: #FFFFFF;
box-shadow: 0px 0px 21px 0px rgba(183, 183, 183, 0.33);
border-radius: 24px;
padding-top: 60px;
// padding-top: 60px;
box-sizing: border-box;
div {