Skip to content

罗鑫霖 / vion-tools

Go to a project
Commit 65ead378 by 李君
Options

数据重放

1 parent 4af6d4ad
Inline Side-by-side
Showing 5 changed files with 206 additions and 495 deletions
src/Request/PublicAxiosInstance.js
......@@ -15,7 +15,7 @@ const axiosInstance = axios.create(
axiosInstance.interceptors.request.use(
config => {
// Cookies.set('atoken','3f719c88-cfe6-42f6-b2c7-a6b355c46c10')
// Cookies.set('atoken','1a1fea7a-7ff1-4055-811d-32603abbba06')
if(!Cookies.get('atoken')){
ElMessage({
message: `登录过期，请重新登录`,
......
src/router/index.js
......@@ -49,6 +49,10 @@ const menuRoute = [
path: 'SystemLog',
component: () => import("@/views/SystemLog/index.vue"),
},
{
path: 'DataReplay',
component: () => import("@/views/DataReplay/DataReplay.vue"),
},
]
},
]
......
src/views/DataReplay/DataReplay.js 0 → 100644
import axiosInstance from "@/Request/PublicAxiosInstance"
import {filterEmptyValueInObject} from "@/PublicUtil/PublicUtil"
class DataReplay {
getRematch(data) {
return axiosInstance.request(
{
method: 'POST',
url: `/rematch`,
data: data
}
)
}
}
const DataReplayApi = new DataReplay()
export default DataReplayApi
src/views/DataReplay/DataReplay.vue
<template>
<a-form :model="queryForm" layout="inline" :label-col="{ style: { width: '100px' } }">
<a-form-item label="集团:" style="padding: 5px 0">
<a-select v-model:value="queryForm.account_id"
style="width: 280px"
mode="multiple"
:maxTagCount="1"
@change="onAccountChange"
:options="accountList"
optionFilterProp="label"
show-search
>
<a-select v-model:value="queryForm.accountId" style="width: 280px" @change="onAccountChange"
:options="accountList" optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="广场:" style="padding: 5px 0">
<a-select v-model:value="queryForm.plaza_id"
style="width: 280px"
mode="multiple"
:maxTagCount="1"
@change="onPlazaChange"
:options="plazaList"
optionFilterProp="label"
show-search
>
<a-select v-model:value="queryForm.mallId" style="width: 280px" :options="plazaList"
optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="监控点名称:" style="padding: 5px 0">
<a-select v-model:value="queryForm.gate_id"
style="width: 280px"
mode="multiple"
:maxTagCount="1"
@change="onGateChange"
:options="gateList"
optionFilterProp="label"
show-search
>
<template #dropdownRender="{ menuNode: menu }">
<v-nodes :vnodes="menu"/>
<a-divider style="margin: 4px 0"/>
<div
@mousedown="e => e.preventDefault()"
>
<a-button @click="selectAll('监控点名称')" type="link">全选</a-button>
<a-button @click="clearAll('监控点名称')" type="link">清空</a-button>
</div>
</template>
</a-select>
<a-form-item label="日期:" style="padding: 5px 0">
<a-range-picker v-model:value="queryForm.repairDate" style="width: 280px" />
</a-form-item>
<a-form-item label="设备通道号:" style="padding: 5px 0">
<a-select v-model:value="queryForm.channel_id"
style="width: 280px"
mode="multiple"
:maxTagCount="1"
:options="channelList"
optionFilterProp="label"
show-search
>
<template #dropdownRender="{ menuNode: menu }">
<v-nodes :vnodes="menu"/>
<a-divider style="margin: 4px 0"/>
<div
@mousedown="e => e.preventDefault()"
>
<a-button @click="selectAll('设备通道号')" type="link">全选</a-button>
<a-button @click="clearAll('设备通道号')" type="link">清空</a-button>
</div>
</template>
<a-form-item label="是否重提:" style="padding: 5px 0">
<a-select v-model:value="queryForm.reExtractFeature" style="width: 280px">
<a-select-option value="true">是</a-select-option>
<a-select-option value="false">否</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="修补日期:" style="padding: 5px 0">
<a-date-picker v-model:value="queryForm.repairDate" style="width: 280px"/>
</a-form-item>
<a-form-item label="参考日期:" style="padding: 5px 0">
<a-date-picker v-model:value="queryForm.referenceDate" style="width: 280px"/>
</a-form-item>
<a-form-item label="开始时间:" style="padding: 5px 0">
<a-time-picker v-model:value="queryForm.startTime" style="width: 280px"/>
</a-form-item>
<a-form-item label="结束时间:" style="padding: 5px 0">
<a-time-picker v-model:value="queryForm.endTime" style="width: 280px"/>
</a-form-item>
<a-form-item label="数据波动比例:" style="padding: 5px 0">
<a-input v-model:value="queryForm.minFactor" style="width: 129px"/>
至
<a-input v-model:value="queryForm.maxFactor" style="width: 129px"/>
</a-form-item>
<a-form-item style="padding: 5px 0">
<a-button type="primary" @click="preview" :loading="isLoading">预览</a-button>
<a-form-item label="是否重读:" style="padding: 5px 0">
<a-select v-model:value="queryForm.reTrack" style="width: 280px">
<a-select-option value="true">是</a-select-option>
<a-select-option value="false">否</a-select-option>
</a-select>
</a-form-item>
<a-form-item style="padding: 5px 0">
<a-button type="primary" @click="repair" :loading="isLoading">修补</a-button>
<a-button type="primary" @click="preview" :loading="isLoading">添加</a-button>
</a-form-item>
</a-form>
<div style="display:flex; justify-content: flex-end;padding: 3px">
<a-button @click="suspendRepair" type="primary">暂停修复</a-button>
</div>
<a-table :dataSource="dataList" v-loading="isLoading" :columns="columns" :pagination="false">
<!-- <a-table :dataSource="dataList" v-loading="isLoading" :columns="columns" :pagination="false">
<template #status="{ text }">
<span :class="getClass(text)">{{ text }}</span>
</template>
<template #operation="{ record }">
<div>
<a-button @click="deleteRecord(record)" type="primary" danger>删除任务</a-button>
</div>
</template>
</a-table>
</a-table> -->
</template>
<script>
import {reactive, ref, toRaw} from 'vue'
import moment from 'moment'
import snapshotRecordApi from '@/views/SnapshotCluster/SnapshotRecord/SnapshotRecordApi'
import {isArray} from '@/PublicUtil/Judgment'
import {filterEmptyValueInObject, formatDate, formatTime} from '@/PublicUtil/PublicUtil'
import dataRepairApi from '@/views/DataRepair/DataRepairApi'
import {PlusOutlined} from '@ant-design/icons-vue'
const columns = [
{
title: '监控点名称',
dataIndex: 'gatename',
align: 'center',
},
{
title: '设备号',
dataIndex: 'deviceSerialnum',
align: 'center',
},
{
title: '通道号',
dataIndex: 'channelSerialnum',
align: 'center',
},
{
title: '参考范围数据条数',
dataIndex: 'sourceCount',
align: 'center',
},
{
title: '修复范围数据条数',
dataIndex: 'targetCount',
align: 'center',
},
{
title: '参考范围客流量',
dataIndex: 'sourceInnum',
align: 'center',
},
{
title: '修复范围客流量',
dataIndex: 'targetInnum',
align: 'center',
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
slots: {
customRender: 'status',
import {
reactive,
ref,
toRaw
} from 'vue'
import moment from 'moment'
import snapshotRecordApi from '@/views/SnapshotCluster/SnapshotRecord/SnapshotRecordApi'
import {
isArray
} from '@/PublicUtil/Judgment'
import {
filterEmptyValueInObject,
formatDate,
formatTime
} from '@/PublicUtil/PublicUtil'
import dataReplayApi from '@/views/DataReplay/DataReplay.js'
import {
PlusOutlined
} from '@ant-design/icons-vue'
const columns = [{
title: '监控点名称',
dataIndex: 'gatename',
align: 'center',
},
},
{
title: '操作',
dataIndex: 'operation',
align: 'center',
slots: {
customRender: 'operation',
{
title: '设备号',
dataIndex: 'deviceSerialnum',
align: 'center',
},
},
]
export default {
components: {
PlusOutlined,
VNodes: (_, {attrs}) => {
return attrs.vnodes
{
title: '通道号',
dataIndex: 'channelSerialnum',
align: 'center',
},
},
setup() {
// scalar
const isLoading = ref(false)
const isSuspended = ref(false)
// sequence
const resultList = ref([])
const accountList = ref([])
const plazaList = ref([])
const zoneList = ref([])
const gateList = ref([])
const channelList = ref([])
const dataList = ref([])
const queryForm = reactive(
{
account_id: [],
plaza_id: [],
gate_id: [],
channel_id: [],
repairDate: moment(moment().format('YYYY-MM-DD'), 'YYYY-MM-DD'),
referenceDate: moment(moment().format('YYYY-MM-DD'), 'YYYY-MM-DD'),
startTime: moment('00:00:00', 'HH:mm:ss'),
endTime: moment('23:59:59', 'HH:mm:ss'),
minFactor: 0.85,
maxFactor: 1.2,
{
title: '参考范围数据条数',
dataIndex: 'sourceCount',
align: 'center',
},
{
title: '修复范围数据条数',
dataIndex: 'targetCount',
align: 'center',
},
{
title: '参考范围客流量',
dataIndex: 'sourceInnum',
align: 'center',
},
{
title: '修复范围客流量',
dataIndex: 'targetInnum',
align: 'center',
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
slots: {
customRender: 'status',
},
},
{
title: '操作',
dataIndex: 'operation',
align: 'center',
slots: {
customRender: 'operation',
},
},
]
export default {
components: {
PlusOutlined,
VNodes: (_, {
attrs
}) => {
return attrs.vnodes
},
},
setup() {
// scalar
const isLoading = ref(false)
const isSuspended = ref(false)
// sequence
const accountList = ref([])
const plazaList = ref([])
const dataList = ref([])
const queryForm = reactive({
accountId: '',
mallId: '',
repairDate: [moment().format('YYYY-MM-DD'),moment().format('YYYY-MM-DD')],
reExtractFeature:'true',
reTrack:'true'
})
const onAccountChange = function() {
getPlazaList()
}
)
const onAccountChange = function() {
getPlazaList()
queryForm.gate_id = []
gateList.value = []
queryForm.channel_id = []
channelList.value = []
}
const onPlazaChange = function() {
getGateList()
queryForm.channel_id = []
channelList.value = []
}
const onGateChange = function() {
getChannelList()
}
const getPlazaList = function() {
queryForm.plaza_id = []
plazaList.value = []
snapshotRecordApi.getPlazaList(
{
account_id: queryForm.account_id.toString()
}
).then(
(r) => {
if (isArray(r))
{
for (const item of r)
{
plazaList.value.push(
{
value: item.id,
label: item.name,
}
)
}
}
}
)
}
const getAccountList = function() {
queryForm.account_id = []
accountList.value = []
snapshotRecordApi.getAccountList().then(
(r) => {
if (isArray(r))
{
for (const item of r)
{
accountList.value.push(
{
const getPlazaList = function() {
queryForm.mallId = ''
plazaList.value = []
snapshotRecordApi.getPlazaList({
account_id: queryForm.accountId.toString()
}).then(
(r) => {
if (isArray(r)) {
for (const item of r) {
plazaList.value.push({
value: item.id,
label: item.name,
}
)
})
}
if(r&&r.length){
queryForm.mallId=r[0].id
}
}
}
}
)
}
const getGateList = async function() {
queryForm.gate_id = []
gateList.value = []
let tempList = []
for (const account of queryForm.account_id)
{
for (const plaza of queryForm.plaza_id)
{
const r = await dataRepairApi.getGateList(
{
accountIds: account,
mallIds: plaza,
}
)
)
}
if (isArray(r))
{
for (const item of r)
{
tempList.push(
{
const getAccountList = function() {
queryForm.accountId = ''
accountList.value = []
snapshotRecordApi.getAccountList().then(
(r) => {
if (isArray(r)) {
for (const item of r) {
accountList.value.push({
value: item.id,
label: item.name,
}
)
})
}
if(r&&r.length){
queryForm.accountId=r[0].id
getPlazaList()
}
}
}
}
}
gateList.value = [...new Set(tempList)]
}
const getChannelList = async function() {
queryForm.channel_id = []
channelList.value = []
let tempList = []
for (const gate of queryForm.gate_id)
{
const r = await dataRepairApi.getChannelList(
{
gateId: gate,
}
)
if (isArray(r))
{
for (const item of r)
{
tempList.push(
{
value: item,
label: item,
}
)
}
}
}
channelList.value = tempList
}
const floatToPercent = function(floatNum) {
if (!floatNum)
{
return 0
}
let formatNum = Math.floor(floatNum * 100)
return formatNum >= 100 ? 100 : formatNum
}
const preview = async function() {
isLoading.value = true
isSuspended.value = false
dataList.value = []
const rawData = toRaw(queryForm)
for (const channelId of rawData.channel_id)
{
if (isSuspended.value === true)
{
isLoading.value = false
return
}
const data = filterEmptyValueInObject(
{
channelSerialnum: channelId,
maxFactor: rawData.maxFactor,
minFactor: rawData.minFactor,
targetStartDate: formatDate(rawData.repairDate) + ' ' + formatTime(rawData.startTime),
targetEndDate: formatDate(rawData.repairDate) + ' ' + formatTime(rawData.endTime),
sourceStartDate: formatDate(rawData.referenceDate) + ' ' + formatTime(rawData.startTime),
sourceEndDate: formatDate(rawData.referenceDate) + ' ' + formatTime(rawData.endTime),
}
)
const r = await dataRepairApi.preview(data)
r.data.status = '未执行'
dataList.value.push(r.data)
}
isLoading.value = false
isSuspended.value = false
}
const repair = async function() {
isLoading.value = true
isSuspended.value = false
dataList.value = []
const rawData = toRaw(queryForm)
for (const channelId of rawData.channel_id)
{
if (isSuspended.value === true)
{
isLoading.value = false
return
}
const data = filterEmptyValueInObject(
{
channelSerialnum: channelId,
maxFactor: rawData.maxFactor,
minFactor: rawData.minFactor,
targetStartDate: formatDate(rawData.repairDate) + ' ' + formatTime(rawData.startTime),
targetEndDate: formatDate(rawData.repairDate) + ' ' + formatTime(rawData.endTime),
sourceStartDate: formatDate(rawData.referenceDate) + ' ' + formatTime(rawData.startTime),
sourceEndDate: formatDate(rawData.referenceDate) + ' ' + formatTime(rawData.endTime),
const preview = function() {
isLoading.value = true
const rawData = toRaw(queryForm)
console.log(rawData.repairDate)
dataReplayApi.getRematch(filterEmptyValueInObject({
accountId: rawData.accountId.toString(),
mallId: rawData.mallId.toString(),
reExtractFeature: rawData.reExtractFeature,
reTrack: rawData.reTrack,
startDate:rawData.repairDate[0],
endDate:rawData.repairDate[1],
})).then(
(r) => {
console.log(r)
}
)
const r = await dataRepairApi.repair(data)
if (r.msg_code === 200)
{
r.data.status = '已修复'
}
else
{
r.data.status = '未执行'
}
dataList.value.push(r.data)
}
isLoading.value = false
isSuspended.value = false
}
const getClass = function(text) {
switch (text)
{
case '已修复':
{
return 'success'
}
case '未执行':
{
return 'failed'
}
default:
{
break
}
}
}
const deleteRecord = function({channelSerialnum}) {
if (channelSerialnum === undefined)
{
return
}
dataList.value = dataList.value.filter(
item => item.channelSerialnum !== channelSerialnum
)
queryForm.channel_id = queryForm.channel_id.filter(
item => item !== channelSerialnum
)
}
const suspendRepair = function() {
if (isLoading.value === true)
{
isSuspended.value = true
}
}
const selectAll = function(text) {
switch (text)
{
case '监控点名称':
{
queryForm.gate_id = []
for (const item of gateList.value)
{
queryForm.gate_id.push(item.value)
}
onGateChange()
break
}
case '设备通道号':
{
queryForm.channel_id = []
for (const item of channelList.value)
{
queryForm.channel_id.push(item.value)
}
break
}
default:
{
break
}
const __main = function() {
getAccountList()
}
}
const clearAll = function(text) {
switch (text)
{
case '监控点名称':
{
queryForm.gate_id = []
onGateChange()
break
}
case '设备通道号':
{
queryForm.channel_id = []
break
}
default:
{
break
}
__main()
return {
// scalar
isLoading,
// sequence
accountList,
plazaList,
dataList,
queryForm,
columns,
// function
onAccountChange,
preview,
}
}
const __main = function() {
getAccountList()
}
__main()
return {
// scalar
isLoading,
// sequence
accountList,
plazaList,
zoneList,
gateList,
channelList,
resultList,
dataList,
queryForm,
columns,
// function
onAccountChange,
onPlazaChange,
onGateChange,
preview,
repair,
getClass,
deleteRecord,
suspendRepair,
selectAll,
clearAll,
}
}
}
</script>
<style lang="less" scoped>
@import "./DataRepair.less";
</style>
src/views/Main/Main.vue
......@@ -85,6 +85,12 @@
<span style="padding: 0 5px">系统日志</span>
</div>
</a-menu-item>
<a-menu-item :key="'/Main/DataReplay'">
<div class="flex-vertical-center">
<img :src="require('./Icons/2.svg')" style="height: auto;width:20px"/>
<span style="padding: 0 5px">数据重放</span>
</div>
</a-menu-item>
</a-menu>
</el-aside>
<el-main>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!