Skip to content

F
fk-spider-web
Commit 33062b3a by yzh
Options

feat：任务信息，状态监控接完，删除展示差查询

parent 5b14a4c2
Showing with 325 additions and 225 deletions
src/api/apiPaths.ts
......@@ -105,4 +105,17 @@ export const spiderDataApi = {
ituList: '/itu/list',
ituDetail: '/itu/detail',
ituDataDelete: '/itu/delete',
} as const
\ No newline at end of file
stList: '/spaceTrack/list',
stDetail: '/spaceTrack/detail',
stDataDelete: '/sspaceTrackt/delete',
} as const
// 爬虫数据相关接口
export const dataApi = {
dataStatistics: '/statistic/dataStatistics',
taskStatistics: '/statistic/taskStatistics',
performanceStatistics: '/statistic/performanceStatistics',
} as const
src/api/spiderData.ts
......@@ -54,4 +54,31 @@ export function deleteItuData(data: UserQueryParams) {
method: POST,
data
}) as unknown as Promise<ApiResponse>
}
// 获取st数据列表
export function getStlist(data: UserQueryParams) {
return request({
url: spiderDataApi.stList,
method: POST,
data
}) as unknown as Promise<ApiResponse>
}
// 获取st数据详情
export function getStDetail(data: UserQueryParams) {
return request({
url: spiderDataApi.stDetail,
method: POST,
data
}) as unknown as Promise<ApiResponse>
}
// 删除st数据
export function deleteStData(data: UserQueryParams) {
return request({
url: spiderDataApi.stDataDelete,
method: POST,
data
}) as unknown as Promise<ApiResponse>
}
\ No newline at end of file
src/api/staticData.ts 0 → 100644
import { request, POST } from '@/utils/request'
import type { ApiResponse, QueryParams } from '@/utils/request'
import { dataApi } from './apiPaths'
// 获取爬虫静态数据列表
export function getStatsDataList(params: QueryParams): Promise<ApiResponse> {
return request({
url: dataApi.dataStatistics,
method: POST,
params
}) as unknown as Promise<ApiResponse>
}
// 获取爬虫任务列表
export function getSpiderTaskList(params: QueryParams): Promise<ApiResponse> {
return request({
url: dataApi.taskStatistics,
method: POST,
params
}) as unknown as Promise<ApiResponse>
}
// 获取爬虫任务列表
export function getPerformanceList(params: QueryParams): Promise<ApiResponse> {
return request({
url: dataApi.performanceStatistics,
method: POST,
params
}) as unknown as Promise<ApiResponse>
}
\ No newline at end of file
src/components/Export/index.vue
<template>
<el-dialog v-model="exportDialogVisible" title="导出" width="250" center align-center @close="close" draggable>
<div class="text-center">
<span style="color: #fff;font-size: 15px;">确定导出吗？</span>
<el-dialog v-model="exportDialogVisible" title="导出" width="400" center align-center @close="close" draggable>
<div class="text-center p-0 gap-3">
<!-- <span style="color: #fff;font-size: 15px;">请选择导出数据时间与数据类型。</span>
<br> -->
<el-date-picker v-model="timeValue" type="datetimerange" format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始时间"
end-placeholder="结束时间" date-format="YYYY/MM/DD ddd" time-format="A hh:mm:ss" style="width: 270px"
value-format="YYYY-MM-DD HH:mm:ss" />
<el-checkbox-group v-model="checkList">
<el-checkbox label="DSN数据" value="dsn" />
<el-checkbox label="ITU数据" value="itu" />
<el-checkbox label="ST数据" value="st" />
</el-checkbox-group>
</div>
<template #footer>
<div class="dialog-footer">
......@@ -30,7 +39,8 @@ const props = defineProps({
})
const emit = defineEmits(['update:dialogVisible', 'confirm'])
const exportDialogVisible = ref(props.dialogVisible)
const checkList = ref([])
const timeValue = ref('')
// 导出方法
const handleExport = () => {
emit('confirm')
......
src/utils/request.ts
......@@ -88,10 +88,9 @@ export interface QueryParams {
size?: number
project?: string
spider?: string
scrapydServerId: string
scrapydServerId?: string
order_prop?: string
order_type?: string
[key: string]: any
}
// 请求函数
......@@ -119,4 +118,6 @@ export interface UserQueryParams {
spider?: string
cron?: string
options?: string
sat_name?: string
ntc_id?: string
}
\ No newline at end of file
src/views/os-dataDisplay/components/allDataTab.vue
......@@ -58,7 +58,7 @@
<div>
<el-table :data="tableData" style="width: 100%" border :row-style="{ height: '45px' }"
:header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }">
<el-table-column type="selection" width="40" />
<!-- <el-table-column type="selection" width="40" /> -->
<el-table-column property="number" label="序号" width="55" />
<el-table-column property="targetName" label="目标名称" show-overflow-tooltip />
<el-table-column property="stationPosition" label="站点位置" show-overflow-tooltip />
......
src/views/os-dataDisplay/components/dsnData/dsnDataTab.vue
......@@ -7,7 +7,7 @@
</el-form-item>
<el-form-item>
<div>
<el-input placeholder="请输入" style="width: 220px" />
<el-input placeholder="请输入" style="width: 200px" />
</div>
</el-form-item>
<el-form-item>
......@@ -15,25 +15,20 @@
</el-form-item>
<el-form-item>
<el-date-picker v-model="timeValue" type="datetimerange" format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始时间"
end-placeholder="结束时间" date-format="YYYY/MM/DD ddd" time-format="A hh:mm:ss" />
end-placeholder="结束时间" date-format="YYYY/MM/DD ddd" time-format="A hh:mm:ss" style="width: 275px" value-format="YYYY-MM-DD HH:mm:ss"/>
</el-form-item>
<el-form-item>
<el-text class="mx-1">站点名称:</el-text>
</el-form-item>
<el-form-item>
<el-input placeholder="请输入" style="width: 220px" />
<el-input placeholder="请输入" style="width: 200px" />
</el-form-item>
<br></br>
<el-form-item>
<!-- <br></br> -->
<!-- <el-form-item>
<el-space>
<el-button type="primary" @click="handleExport">导出最近</el-button>
</el-space>
</el-form-item>
<el-form-item>
<el-space>
<el-button type="primary" @click="handleExport">导出选中</el-button>
</el-space>
</el-form-item>
</el-form-item> -->
<el-form-item>
<el-space>
<el-button type="primary">查询</el-button>
......@@ -45,25 +40,45 @@
<div class="m-t-5" />
<div>
<el-table :data="tableData" style="width: 100%" border :row-style="{ height: '41px' }"
<el-table :data="tableData" style="width: 100%" border :row-style="{ height: '50px' }"
:header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }">
<el-table-column type="selection" width="40" />
<el-table-column property="number" label="序号" width="55" />
<el-table-column property="targetName" label="目标名称" show-overflow-tooltip />
<el-table-column property="distance" label="距离(km)" show-overflow-tooltip />
<!-- <el-table-column type="selection" width="40" /> -->
<el-table-column property="number" label="序号" width="55" type="index" />
<el-table-column property="targets[0].name" label="目标名称" show-overflow-tooltip />
<!-- <el-table-column property="distance" label="距离(km)" show-overflow-tooltip />
<el-table-column property="roundTripTime" label="往返光时(s)" show-overflow-tooltip />
<el-table-column property="stationName" label="站点名称" show-overflow-tooltip />
<el-table-column property="targetAzimuth" label="目标方位" show-overflow-tooltip />
<el-table-column property="targetElevation" label="目标俯仰" show-overflow-tooltip />
<el-table-column property="targetDistance" label="目标距离" show-overflow-tooltip />
<el-table-column property="windSpeed" label="风速(km/hr)" show-overflow-tooltip />
<el-table-column property="upSignalSource" label="上行信号来源" show-overflow-tooltip />
<el-table-column property="upSignalFrequencyBand" label="上行信号频段" show-overflow-tooltip />
<el-table-column property="upSignalLaunchPower" label="上行发射功率" show-overflow-tooltip />
<el-table-column property="downSignalSignalSource" label="下行信号来源" show-overflow-tooltip />
<el-table-column property="downSignalFrequencyBand" label="下行信号频段" show-overflow-tooltip />
<el-table-column property="downSignalReceptionPower" label="下行接收功率" show-overflow-tooltip />
<el-table-column property="dataTime" label="数据时间" show-overflow-tooltip />
<el-table-column property="stationName" label="站点名称" show-overflow-tooltip /> -->
<el-table-column property="azimuthAngle" label="目标方位" show-overflow-tooltip />
<el-table-column property="elevationAngle" label="目标俯仰" show-overflow-tooltip />
<!-- <el-table-column property="targetDistance" label="目标距离" show-overflow-tooltip /> -->
<el-table-column property="windSpeed" label="风速(km/hr)" show-overflow-tooltip >
<!-- <template #default="scope">
{{ scope.row.windSpeed === '' ? '-' : scope.row.windSpeed }}
</template> -->
</el-table-column>
<el-table-column property="targets[0].name" label="上行信号来源" show-overflow-tooltip/>
<el-table-column property="signals[0].band" label="上行信号频段" show-overflow-tooltip>
<!-- <template #default="scope">
{{ scope.row.signals.length === 0 ? '-' : scope.row.signals[0].band }}
</template> -->
</el-table-column>
<el-table-column property="signals[0].power" label="上行发射功率" show-overflow-tooltip>
<!-- <template #default="scope">
{{ scope.row.signals.length === 0 ? '-' : scope.row.signals[0].power }}
</template> -->
</el-table-column>
<el-table-column property="targets[0].name" label="下行信号来源" show-overflow-tooltip/>
<el-table-column property="signals[1].band" label="下行信号频段" show-overflow-tooltip>
<!-- <template #default="scope">
{{ scope.row.signals.length === 0 ? '-' : scope.row.signals[1].band }}
</template> -->
</el-table-column>
<el-table-column property="signals[1].power" label="下行接收功率" show-overflow-tooltip>
<!-- <template #default="scope">
{{ scope.row.signals.length === 0 ? '-' : scope.row.signals[1].power }}
</template> -->
</el-table-column>
<!-- <el-table-column property="dataTime" label="数据时间" show-overflow-tooltip /> -->
<el-table-column label="操作" width="60">
<template #default="scope">
<el-button type="primary" plain link @click="handleDetails(scope.row)">
......@@ -257,10 +272,10 @@ const handleDetails = (row: any) => {
}
const getData = async () => {
console.log('getData');
const res = await getDsnlist({page:pageObj.value.pageNo,size:pageObj.value.pageSize})
tableData.value = res.data.list
pageObj.value.total = res.data.total
console.log(res);
tableData.value = res.data.list[0].dishes
// pageObj.value.total = res.data[0].dishes.length
}
const handleClose = () => {
......
src/views/os-dataDisplay/components/dsnData/dsnTab.vue
<template>
<div class="text-left p-s">
<!-- <div class="text-left p-s">
<div class="segmentedStyle">
<el-segmented v-model="mode" :options="sizeOptions" style="margin-bottom: 1rem" size="small" />
</div>
</div>
<dsnDataTab v-if="mode === 'DSN数据'">
</div> -->
<dsnDataTab>
</dsnDataTab>
<newsDataTab v-if="mode === '新闻'">
</newsDataTab>
<!-- <newsDataTab v-if="mode === '新闻'">
</newsDataTab> -->
</template>
<script setup lang="ts">
......
src/views/os-dataDisplay/components/stDataTab.vue
......@@ -7,7 +7,7 @@
</el-form-item>
<el-form-item>
<div>
<el-input placeholder="请输入" style="width: 220px" />
<el-input placeholder="请输入" style="width: 210px" />
</div>
</el-form-item>
<el-form-item>
......@@ -15,34 +15,23 @@
</el-form-item>
<el-form-item>
<el-date-picker v-model="timeValue" type="datetimerange" format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始时间"
end-placeholder="结束时间" date-format="YYYY/MM/DD ddd" time-format="A hh:mm:ss" />
end-placeholder="结束时间" date-format="YYYY/MM/DD ddd" time-format="A hh:mm:ss" style="width: 250px"
value-format="YYYY-MM-DD HH:mm:ss" />
</el-form-item>
<el-form-item>
<el-text class="mx-1">站点名称:</el-text>
</el-form-item>
<el-form-item>
<el-input placeholder="请输入" style="width: 220px" />
</el-form-item>
<br></br>
<el-form-item>
<el-text class="mx-1">NORAD CAT ID:</el-text>
</el-form-item>
<el-form-item>
<el-input placeholder="请输入" style="width: 188.5px" />
<el-input placeholder="请输入" style="width: 180.5px" />
</el-form-item>
<el-form-item>
<!-- <el-form-item>
<el-space>
<el-button type="primary" @click="handleExport">导出最近</el-button>
</el-space>
</el-form-item>
</el-form-item> -->
<el-form-item>
<el-space>
<el-button type="primary" @click="handleExport">导出选中</el-button>
</el-space>
</el-form-item>
<el-form-item>
<el-space>
<el-button type="primary">查询</el-button>
<el-button type="primary" @click="handleSearch">查询</el-button>
</el-space>
</el-form-item>
</el-form>
......@@ -51,24 +40,26 @@
<div class="m-t-5" />
<div>
<el-table :data="tableData" style="width: 100%" border :row-style="{ height: '42.5px' }"
<el-table :data="tableData" style="width: 100%" border :row-style="{ height: '43.5px' }"
:header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }">
<el-table-column type="selection" width="40" />
<el-table-column property="number" label="序号" width="55" />
<el-table-column property="NoradCatID" label="Norad Cat ID" show-overflow-tooltip />
<el-table-column property="targetName" label="目标名称" show-overflow-tooltip />
<el-table-column property="intleds" label="INTLDES" show-overflow-tooltip />
<el-table-column property="type" label="类型" show-overflow-tooltip />
<el-table-column property="belongCountry" label="所属国家" width="82" show-overflow-tooltip />
<el-table-column property="runningTime" label="运行时间" show-overflow-tooltip />
<el-table-column property="site" label="SITE" show-overflow-tooltip />
<el-table-column property="failTime" label="失效时间" show-overflow-tooltip />
<el-table-column property="period" label="周期" show-overflow-tooltip />
<el-table-column property="perigee" label="近地点" show-overflow-tooltip />
<el-table-column property="apogee" label="远地点" show-overflow-tooltip />
<el-table-column property="incl" label="INCL" show-overflow-tooltip />
<el-table-column property="rcs" label="RCS" show-overflow-tooltip />
<el-table-column property="tle" label="TLE" show-overflow-tooltip />
<!-- <el-table-column type="selection" width="40" /> -->
<el-table-column property="number" label="序号" width="55" type="index" />
<el-table-column property="data[0].NORAD_CAT_ID" label="Norad Cat ID" show-overflow-tooltip />
<el-table-column property="data[0].OBJECT_NAME" label="目标名称" show-overflow-tooltip />
<!-- <el-table-column property="intleds" label="INTLDES" show-overflow-tooltip /> -->
<el-table-column property="data[0].OBJECT_TYPE" label="类型" show-overflow-tooltip />
<el-table-column property="data[0].COUNTRY_CODE" label="所属国家" width="82" show-overflow-tooltip />
<!-- <el-table-column property="runningTime" label="运行时间" show-overflow-tooltip /> -->
<el-table-column property="data[0].SITE" label="SITE" show-overflow-tooltip />
<!-- <el-table-column property="failTime" label="失效时间" show-overflow-tooltip /> -->
<el-table-column property="data[0].PERIOD" label="周期" show-overflow-tooltip />
<el-table-column property="data[0].PERIAPSIS" label="近地点" show-overflow-tooltip />
<el-table-column property="data[0].APOAPSIS" label="远地点" show-overflow-tooltip />
<!-- <el-table-column property="incl" label="INCL" show-overflow-tooltip /> -->
<el-table-column property="data[0].RCS_SIZE" label="RCS" show-overflow-tooltip />
<el-table-column property="data[0].TLE_LINE0" label="TLE_LINE0" show-overflow-tooltip />
<el-table-column property="data[0].TLE_LINE1" label="TLE_LINE1" show-overflow-tooltip />
<el-table-column property="data[0].TLE_LINE2" label="TLE_LINE2" show-overflow-tooltip />
<el-table-column label="操作" width="60">
<template #default="scope">
<el-button type="primary" plain link @click="handleDetails(scope.row)">
......@@ -106,8 +97,8 @@
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="INTLDES:" label-position="left">
<el-input v-model="intleds" />
<el-form-item label="周期(min):" label-position="left">
<el-input v-model="period" />
</el-form-item>
</el-col>
<el-col :span="12">
......@@ -116,7 +107,7 @@
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<!-- <el-row :gutter="20">
<el-col :span="12">
<el-form-item label="运行时间:" label-position="left">
<el-input v-model="workTime" />
......@@ -127,7 +118,7 @@
<el-input v-model="failTime" />
</el-form-item>
</el-col>
</el-row>
</el-row> -->
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="记录时间:" label-position="left">
......@@ -154,18 +145,6 @@
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="周期(min):" label-position="left">
<el-input v-model="period" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="INCL:" label-position="left">
<el-input v-model="incl" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="RCS:" label-position="left">
<el-input v-model="rcs" />
</el-form-item>
......@@ -191,9 +170,10 @@
</template>
<script setup lang="ts">
import { ref } from 'vue'
import { onMounted, ref } from 'vue'
import Pagination from '@/components/pagination/index.vue'
import exportDialog from '@/components/Export/index.vue'
import { getStlist, getStDetail, deleteStData } from '@/api/spiderData'
const showDeleteDialog = ref(false)
const timeValue = ref('')
......@@ -206,10 +186,6 @@ const targetName = ref('')
const intleds = ref('')
// 类型
const type = ref('')
// 运行时间
const workTime = ref('')
// 失效时间
const failTime = ref('')
// 记录时间
const recordTime = ref('')
// 所属国家
......@@ -229,63 +205,36 @@ const site = ref('')
// TLE
const tle = ref('')
const tableData = ref([
{
number: '1',
NoradCatID: '1358',
targetName: 'SL-1 R/B',
intleds: '1957-001A',
type: 'ROCKET BODY',
belongCountry: 'RUS',
runningTime: '1957-10-14',
site: 'TTMTR',
failTime: '1958-12-01',
period: '96.19',
perigee: '214',
apogee: '938',
incl: '65.14',
rcs: 'LARGE',
tle: '-',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
{
name: '1',
},
])
const tableData = ref([])
const pageObj = ref({
total: 10,
pageSize: 10,
pageNo: 1
})
const handleDetails = (row: any) => {
console.log(row);
const handleDetails = async (row: any) => {
// console.log(row);
const res = await getStDetail({ id: row._id })
NoradCatID.value = res.data.data[0].NORAD_CAT_ID
targetName.value = res.data.data[0].OBJECT_NAME
type.value = res.data.data[0].OBJECT_TYPE
period.value = res.data.data[0].PERIOD
intleds.value = res.data.data[0].INTLDES
recordTime.value = res.data.data[0].CREATION_DATE
belongCountry.value = res.data.data[0].COUNTRY_CODE
perigee.value = res.data.data[0].PERIAPSIS
apogee.value = res.data.data[0].APOAPSIS
rcs.value = res.data.data[0].RCS_SIZE
site.value = res.data.data[0].SITE
tle.value = `${res.data.data[0].TLE_LINE0}
${res.data.data[0].TLE_LINE1}
${res.data.data[0].TLE_LINE2}`
detailVisibleValue.value = true
}
const getData = () => {
console.log('getData');
const getData = async () => {
const res = await getStlist({ page: pageObj.value.pageNo, size: pageObj.value.pageSize })
pageObj.value.total = res.data.total
tableData.value = res.data.list
// console.log(res);
}
const handleClose = () => {
detailVisibleValue.value = false
......@@ -296,6 +245,15 @@ const handleExportConfirm = () => {
const handleExport = () => {
showDeleteDialog.value = true
}
const handleSearch = async () => {
console.log(timeValue.value);
//const res = await getStlist({sat_name: targetName.value,ntc_id: snsId.value,times: timeValue.value})
// tableData.value = res.data
}
onMounted(() => {
getData()
})
</script>
<style scoped lang="scss">
......@@ -332,6 +290,10 @@ const handleExport = () => {
</style>
<style>
.el-textarea__inner {
color: #FFFFFF;
}
.el-input {
--el-input-text-color: #FFFFFF;
}
......
src/views/os-dataDisplay/index.vue
......@@ -4,11 +4,13 @@
<div class="text-left p-4 ">
<div class="custom-style">
<el-segmented v-model="mode" :options="sizeOptions" style="margin-bottom: 1rem" size="default" />
<el-button type="primary" @click="handleExport
">导出最近</el-button>
</div>
</div>
<!-- 综合数据页面组件 -->
<allDataTab v-if="mode === '综合数据'">
</allDataTab>
<!-- <allDataTab v-if="mode === '综合数据'">
</allDataTab> -->
<!-- DSN数据页面组件 -->
<dsnDataTab v-if="mode === 'DSN数据'">
</dsnDataTab>
......@@ -19,6 +21,8 @@
<stDataTab v-if="mode === 'ST数据'">
</stDataTab>
</div>
<exportDialog v-model:dialogVisible="showDeleteDialog" @confirm="handleExportConfirm" />
</template>
<script setup lang="ts">
......@@ -29,17 +33,26 @@ import allDataTab from './components/allDataTab.vue'
import ituDataTab from './components/ituDataTab.vue'
import stDataTab from './components/stDataTab.vue'
import dsnDataTab from './components/dsnData/dsnTab.vue'
import exportDialog from '@/components/Export/index.vue'
const mode = ref('综合数据')
const sizeOptions = ['综合数据', 'DSN数据', 'ITU数据', 'ST数据']
const mode = ref('DSN数据')
const showDeleteDialog = ref(false)
const sizeOptions = ['DSN数据', 'ITU数据', 'ST数据']
const route = useRoute()
const router = useRouter()
const modeValue = ref<any>('数据展示')
const goToStatus = () => {
router.push({
path: '/osStatus/list',
})
}
const handleExport = () => {
showDeleteDialog.value = true
}
const handleExportConfirm = () => {
}
onMounted(() => {
console.log('数据展示');
console.log(route.query);
......
src/views/os-spiderManager/index.vue
......@@ -36,11 +36,12 @@ const pageObj = ref({
pageNo: 1
})
const handleDetails = (row: any) => {
console.log(row);
// console.log(row);
router.push({
path: '/osTaskInformation/list',
query: {
jump: 'yes'
jump: 'yes',
spiderType: row.spider
}
})
}
......
src/views/os-status/components/dataCard.vue
......@@ -6,13 +6,13 @@
<span>数据统计</span>
</div>
<div class="wordStyle">
<span>总数据量: {{ totalDataNumber }} 1230</span>
<span>总数据量: {{ totalDataNumber }}</span>
</div>
<div class="wordStyle">
<span>采集的页面数量: {{ totalPageNumber }} 85</span>
<span>采集的页面数量: {{ totalPageNumber }}</span>
</div>
<div class="wordStyle">
<span>采集的目标数量: {{ totalTargetNumber }} 569</span>
<span>采集的目标数量: {{ totalTargetNumber }}</span>
</div>
</div>
<div class="dataCard" @click="goToTaskRecordPage">
......@@ -20,13 +20,13 @@
<span>任务执行统计</span>
</div>
<div class="wordStyle">
<span>任务执行成功统计: {{ successTask }} 36</span>
<span>任务执行成功统计: {{ successTask }}</span>
</div>
<div class="wordStyle">
<span>任务执行失败统计: {{ failTask }} 0</span>
<span>任务执行失败统计: {{ failTask }}</span>
</div>
<div class="wordStyle">
<span>任务异常数统计: {{ unusualTask }} 1</span>
<span>任务异常数统计: {{ unusualTask }}</span>
</div>
</div>
<div class="dataCard">
......@@ -34,13 +34,13 @@
<span>性能统计</span>
</div>
<div class="wordStyle">
<span>平均成功率: {{ speed }} 98%</span>
<span>平均成功率: {{ speed }}</span>
</div>
<div class="wordStyle">
<span>平均错误率: {{ errorRate }} 0%</span>
<span>平均错误率: {{ errorRate }}</span>
</div>
<div class="wordStyle">
<span>平均异常率: {{ errorRate }} 2%</span>
<span>平均异常率: {{ unusualRate }}</span>
</div>
</div>
</div>
......@@ -49,42 +49,20 @@
<script lang="ts" setup>
import { useRouter } from 'vue-router';
import { getStatsDataList, getSpiderTaskList, getPerformanceList } from '@/api/staticData';
import { onMounted, ref } from 'vue';
const router = useRouter()
const totalDataNumber = ref('')
const totalPageNumber = ref('')
const totalTargetNumber = ref('')
const successTask = ref('')
const failTask = ref('')
const unusualTask = ref('')
const speed = ref('')
const errorRate = ref('')
const unusualRate = ref('')
const router = useRouter();
defineProps({
totalDataNumber: {
type: String,
default: ''
},
totalPageNumber: {
type: String,
default: ''
},
totalTargetNumber: {
type: String,
default: ''
},
successTask: {
type: String,
default: ''
},
failTask: {
type: String,
default: ''
},
unusualTask: {
type: String,
default: ''
},
speed: {
type: String,
default: ''
},
errorRate: {
type: String,
default: ''
}
})
const goToAllDataPage = () => {
router.push({
path: '/osDataDisplay/list',
......@@ -105,7 +83,27 @@ const goToTaskRecordPage = () => {
})
}
const getData = async () => {
const staticData = await getStatsDataList({})
const spiderTask = await getSpiderTaskList({})
const performance = await getPerformanceList({})
totalDataNumber.value = staticData.data.totalData
totalPageNumber.value = staticData.data.ituPage
totalTargetNumber.value = staticData.data.spaceTrackItemCount
successTask.value = spiderTask.data.successCount
failTask.value = spiderTask.data.failCount
unusualTask.value = spiderTask.data.exceptionCount
speed.value = performance.data.success
errorRate.value = performance.data.error
unusualRate.value = performance.data.exception
console.log(staticData);
console.log(spiderTask);
console.log(performance);
}
onMounted(() => {
getData();
})
</script>
<style lang="scss" scoped>
......
src/views/os-taskInformation/components/addTaskDialog.vue
......@@ -3,11 +3,12 @@
align-center @close="handleClose" draggable>
<el-form :model="ruleForm" :rules="rules" ref="ruleFormRef" label-width="100px">
<el-form-item label="任务名称:" v-if="currentMode === AddMode.ADD_TASK" prop="taskName">
<el-input v-model="ruleForm.taskName" placeholder="请输入任务名称"style="width: 90%" />
<el-input v-model="ruleForm.taskName" placeholder="请输入任务名称" style="width: 90%" />
</el-form-item>
<el-form-item label="所属爬虫:" v-if="currentMode === AddMode.ADD_TASK" prop="spiderTypeValue">
<el-select v-model="ruleForm.spiderTypeValue" placeholder="请选择所属爬虫" style="width: 90%">
<el-option v-for="item in spiderTypeOptions" :key="item.value" :label="item.label" :value="item.value" />
<el-option v-for="item in spiderTypeOptions" :key="item.value" :label="item.label"
:value="item.value" />
</el-select>
</el-form-item>
<el-form-item label="执行频率:" prop="cronExpression">
......
src/views/os-taskInformation/components/taskCard.vue
......@@ -13,15 +13,15 @@
</el-select>
</div>
</el-form-item>
<el-form-item>
<!-- <el-form-item>
<el-text class="mx-1" style="color: #fff;">任务名称:</el-text>
</el-form-item>
<el-form-item>
<el-input v-model="taskName" placeholder="请输入" style="width: 220px" />
</el-form-item>
</el-form-item> -->
<el-form-item>
<el-space>
<el-button type="primary" @Click="getData">查询</el-button>
<el-button type="primary" @Click="search">查询</el-button>
</el-space>
</el-form-item>
<el-form-item>
......@@ -53,7 +53,7 @@
<el-space>
<span class="wordStyle">启用/停止: </span>
<el-switch v-model="task.status" :active-value="'running'" :inactive-value="'paused'"
@change="(newStatus:any) => changeStatus(task, newStatus)" />
@change="(newStatus: any) => changeStatus(task, newStatus)" />
<span class="wordStyle">执行频率: {{ task.frequency }} </span>
</el-space>
</el-form-item>
......@@ -71,6 +71,7 @@
<el-space>
<span class="wordStyle">失败次数: 个; </span>
<span class="wordStyle">异常记录: 个</span>
<span class="wordStyle">所属爬虫: </span>
</el-space>
</el-form-item>
</div>
......@@ -79,22 +80,22 @@
</div>
<addTaskDialog v-model:dialogVisible="showTaskDialog" @confirm="handleEdit" :mode="editMode" @getTaskList="getData"
:jobId="jobId" :cron="frequency" :spiderType="spiderType" :options="taskOptions" />
:jobId="jobId" :cron="frequency" :spiderType="belongSpiderType" :options="taskOptions" />
<deleteDialog v-model:dialogVisible="showDeleteDialog" @get-user-list="getData" :jobId="jobId" />
</template>
<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import { ref, onMounted, watch } from 'vue'
import { useRouter } from 'vue-router'
import addTaskDialog from './addTaskDialog.vue'
import { getSpiderTaskList, resumeSpiderTask, pauseSpiderTask } from '@/api/spiderTask'
import { DeleteMode } from '@/components/Delete/enum.ts'
import { AddMode } from './enum'
import deleteDialog from './deleteDialog.vue'
defineProps({
successTask: {
const props = defineProps({
spiderType: {
type: String,
default: ''
},
......@@ -127,7 +128,7 @@ const searchCondition = ref({
})
const taskName = ref('')
const taskValue = ref('')
const spiderType = ref('')
const belongSpiderType = ref('')
const router = useRouter()
const frequency = ref('')
const editMode = ref(AddMode.UPDATE_TASK)
......@@ -148,7 +149,7 @@ const deleteTask = (task: any) => {
const editTask = (task: any) => {
jobId.value = task.id
taskOptions.value = JSON.stringify(JSON.parse(task.kwargs.options))
spiderType.value = task.kwargs.spider
belongSpiderType.value = task.kwargs.spider
frequency.value = task.kwargs.cron
editMode.value = AddMode.UPDATE_TASK
showTaskDialog.value = true
......@@ -165,12 +166,12 @@ const goToTaskRecord = () => {
})
}
const changeStatus = async (task: any, newStatus: string) => {
if (newStatus === "running") {
await resumeSpiderTask({ job_id: task.id });
} else if (newStatus === "paused") {
await pauseSpiderTask({ job_id: task.id });
}
await getData();
if (newStatus === "running") {
await resumeSpiderTask({ job_id: task.id });
} else if (newStatus === "paused") {
await pauseSpiderTask({ job_id: task.id });
}
// await getData();
};
const handleEdit = () => {
......@@ -180,14 +181,26 @@ const openTaskDialog = () => {
showTaskDialog.value = true
}
const getData = async () => {
if (props.spiderType !== '') {
const res = await getSpiderTaskList({ spiders: props.spiderType, options: JSON.stringify({ jobName: taskName.value }) })
taskList.value = res.data
}else{
const res = await getSpiderTaskList({ spiders: searchCondition.value.spiders ? [searchCondition.value.spiders] : [], options: JSON.stringify({ jobName: taskName.value }) })
taskList.value = res.data
}
}
const search = async () => {
const res = await getSpiderTaskList({ spiders: searchCondition.value.spiders ? [searchCondition.value.spiders] : [], options: JSON.stringify({ jobName: taskName.value }) })
taskList.value = res.data
}
onMounted(() => {
if (props.spiderType !== '') {
searchCondition.value.spiders = props.spiderType
}
getData()
})
</script>
<style lang="scss" scoped>
......@@ -222,10 +235,12 @@ onMounted(() => {
.cardStyle {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
// justify-content:center;
justify-content: space-between;
margin-top: 1.5%;
padding: 8px;
padding: 18px;
height: 26vh;
}
// 任务卡片样式
......@@ -286,4 +301,8 @@ onMounted(() => {
.el-input {
color: #FFFFFF;
}
.el-select__placeholder {
color: #FFFFFF;
}
</style>
\ No newline at end of file
src/views/os-taskInformation/index.vue
<template>
<div>
<div class="backStyle" v-if="route.query.jump === 'yes'" @click="goToTaskInformation" />
<div class="m-t-10" />
<div class="m-t-8" />
<div >
<taskCard successTask="100" failTask="10" unusualTask="1" />
<taskCard :spiderType="spiderType" failTask="10" unusualTask="1" />
<!-- <div class="pagination w-full flex flex-row-reverse pr-18 m-t-0">
<Pagination :total="pageObj.total" v-model:page="pageObj.pageNo" v-model:limit="pageObj.pageSize"
@pagination="getData" />
......@@ -23,6 +23,7 @@ import { AddMode } from './components/enum'
const route = useRoute()
const router = useRouter()
const spiderType = ref<any>(route.query.spiderType)
const taskValue = ref('')
const taskList = ref([])
const taskOptions = [
......@@ -48,6 +49,12 @@ const pageObj = ref({
const goToTaskInformation = () => {
router.push({ path: '/osSpiderManager/list' })
}
onMounted(async () => {
// if(route.query.spiderType){
// spiderType.value = route.query.spiderType
// }
})
</script>
<style scoped>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment