实现所有监控展示
This commit is contained in:
@@ -53,6 +53,70 @@
|
||||
<el-icon><Document /></el-icon>
|
||||
<template #title>设备命令日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/feed-usage-records">
|
||||
<el-icon><Food /></el-icon>
|
||||
<template #title>饲料使用记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/medication-logs">
|
||||
<el-icon><FirstAidKit /></el-icon>
|
||||
<template #title>用药记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pending-collections">
|
||||
<el-icon><Clock /></el-icon>
|
||||
<template #title>待采集请求</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pig-batch-logs">
|
||||
<el-icon><Files /></el-icon>
|
||||
<template #title>猪批次日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pig-purchases">
|
||||
<el-icon><ShoppingCart /></el-icon>
|
||||
<template #title>猪只采购记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pig-sales">
|
||||
<el-icon><SoldOut /></el-icon>
|
||||
<template #title>猪只售卖记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pig-sick-logs">
|
||||
<el-icon><Warning /></el-icon>
|
||||
<template #title>病猪日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/pig-transfer-logs">
|
||||
<el-icon><Switch /></el-icon>
|
||||
<template #title>猪只迁移日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/plan-execution-logs">
|
||||
<el-icon><List /></el-icon>
|
||||
<template #title>计划执行日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/raw-material-purchases">
|
||||
<el-icon><Shop /></el-icon>
|
||||
<template #title>原料采购记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/raw-material-stock-logs">
|
||||
<el-icon><Coin /></el-icon>
|
||||
<template #title>原料库存日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/sensor-data">
|
||||
<el-icon><DataLine /></el-icon>
|
||||
<template #title>传感器数据</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/task-execution-logs">
|
||||
<el-icon><Finished /></el-icon>
|
||||
<template #title>任务执行日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/user-action-logs">
|
||||
<el-icon><User /></el-icon>
|
||||
<template #title>用户操作日志</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/weighing-batches">
|
||||
<el-icon><ScaleToOriginal /></el-icon>
|
||||
<template #title>批次称重记录</template>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="/monitor/weighing-records">
|
||||
<el-icon><ScaleToOriginal /></el-icon>
|
||||
<template #title>单次称重记录</template>
|
||||
</el-menu-item>
|
||||
</el-sub-menu>
|
||||
|
||||
</el-menu>
|
||||
@@ -101,22 +165,16 @@
|
||||
<script>
|
||||
import { ref, computed, onMounted, onUnmounted } from 'vue';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { House, Monitor, Calendar, ArrowDown, Menu, Fold, Expand, Setting, Tickets, DataAnalysis, Document } from '@element-plus/icons-vue';
|
||||
import {
|
||||
House, Monitor, Calendar, ArrowDown, Menu, Fold, Expand, Setting, Tickets, DataAnalysis, Document, Food,
|
||||
FirstAidKit, Clock, Files, ShoppingCart, SoldOut, Warning, Switch, List, Shop, Coin, DataLine, Finished, User, ScaleToOriginal
|
||||
} from '@element-plus/icons-vue';
|
||||
|
||||
export default {
|
||||
name: 'MainLayout',
|
||||
components: {
|
||||
House,
|
||||
Monitor,
|
||||
Calendar,
|
||||
ArrowDown,
|
||||
Menu,
|
||||
Fold,
|
||||
Expand,
|
||||
Setting,
|
||||
Tickets,
|
||||
DataAnalysis,
|
||||
Document
|
||||
House, Monitor, Calendar, ArrowDown, Menu, Fold, Expand, Setting, Tickets, DataAnalysis, Document, Food,
|
||||
FirstAidKit, Clock, Files, ShoppingCart, SoldOut, Warning, Switch, List, Shop, Coin, DataLine, Finished, User, ScaleToOriginal
|
||||
},
|
||||
setup() {
|
||||
const route = useRoute();
|
||||
@@ -124,7 +182,6 @@ export default {
|
||||
const isCollapse = ref(false);
|
||||
const username = ref(localStorage.getItem('username') || '管理员');
|
||||
|
||||
// 监听localStorage变化，实时更新用户名
|
||||
const handleStorageChange = () => {
|
||||
username.value = localStorage.getItem('username') || '管理员';
|
||||
};
|
||||
@@ -157,15 +214,31 @@ export default {
|
||||
'/devices': '设备管理',
|
||||
'/device-templates': '设备模板管理',
|
||||
'/plans': '计划管理',
|
||||
'/monitor/device-command-logs': '设备命令日志'
|
||||
'/monitor/device-command-logs': '设备命令日志',
|
||||
'/monitor/feed-usage-records': '饲料使用记录',
|
||||
'/monitor/medication-logs': '用药记录',
|
||||
'/monitor/pending-collections': '待采集请求',
|
||||
'/monitor/pig-batch-logs': '猪批次日志',
|
||||
'/monitor/pig-purchases': '猪只采购记录',
|
||||
'/monitor/pig-sales': '猪只售卖记录',
|
||||
'/monitor/pig-sick-logs': '病猪日志',
|
||||
'/monitor/pig-transfer-logs': '猪只迁移日志',
|
||||
'/monitor/plan-execution-logs': '计划执行日志',
|
||||
'/monitor/raw-material-purchases': '原料采购记录',
|
||||
'/monitor/raw-material-stock-logs': '原料库存日志',
|
||||
'/monitor/sensor-data': '传感器数据',
|
||||
'/monitor/task-execution-logs': '任务执行日志',
|
||||
'/monitor/user-action-logs': '用户操作日志',
|
||||
'/monitor/weighing-batches': '批次称重记录',
|
||||
'/monitor/weighing-records': '单次称重记录',
|
||||
};
|
||||
return routeMap[route.path] || '猪场管理系统';
|
||||
});
|
||||
|
||||
const logout = () => {
|
||||
localStorage.removeItem('jwt_token');
|
||||
localStorage.removeItem('username'); // 清除用户名
|
||||
username.value = '管理员'; // 重置显示
|
||||
localStorage.removeItem('username');
|
||||
username.value = '管理员';
|
||||
router.push('/login');
|
||||
};
|
||||
|
||||
|
||||
48
src/main.js
48
src/main.js
@@ -9,8 +9,27 @@ import Home from './components/Home.vue';
|
||||
import DeviceList from './components/DeviceList.vue';
|
||||
import PlanList from './components/PlanList.vue';
|
||||
import LoginForm from './components/LoginForm.vue';
|
||||
import DeviceTemplateList from './components/DeviceTemplateList.vue'; // 导入设备模板列表组件
|
||||
import DeviceCommandLogView from './views/monitor/DeviceCommandLogView.vue'; // 导入设备命令日志视图
|
||||
import DeviceTemplateList from './components/DeviceTemplateList.vue';
|
||||
|
||||
// --- 统一导入所有监控视图 ---
|
||||
import DeviceCommandLogView from './views/monitor/DeviceCommandLogView.vue';
|
||||
import FeedUsageRecordsView from './views/monitor/FeedUsageRecordsView.vue';
|
||||
import MedicationLogsView from './views/monitor/MedicationLogsView.vue';
|
||||
import PendingCollectionsView from './views/monitor/PendingCollectionsView.vue';
|
||||
import PigBatchLogsView from './views/monitor/PigBatchLogsView.vue';
|
||||
import PigPurchasesView from './views/monitor/PigPurchasesView.vue';
|
||||
import PigSalesView from './views/monitor/PigSalesView.vue';
|
||||
import PigSickLogsView from './views/monitor/PigSickLogsView.vue';
|
||||
import PigTransferLogsView from './views/monitor/PigTransferLogsView.vue';
|
||||
import PlanExecutionLogsView from './views/monitor/PlanExecutionLogsView.vue';
|
||||
import RawMaterialPurchasesView from './views/monitor/RawMaterialPurchasesView.vue';
|
||||
import RawMaterialStockLogsView from './views/monitor/RawMaterialStockLogsView.vue';
|
||||
import SensorDataView from './views/monitor/SensorDataView.vue';
|
||||
import TaskExecutionLogsView from './views/monitor/TaskExecutionLogsView.vue';
|
||||
import UserActionLogsView from './views/monitor/UserActionLogsView.vue';
|
||||
import WeighingBatchesView from './views/monitor/WeighingBatchesView.vue';
|
||||
import WeighingRecordsView from './views/monitor/WeighingRecordsView.vue';
|
||||
// ---------------------------
|
||||
|
||||
// 导入全局样式
|
||||
import './assets/styles/main.css';
|
||||
@@ -19,10 +38,29 @@ import './assets/styles/main.css';
|
||||
const routes = [
|
||||
{ path: '/', component: Home, meta: { requiresAuth: true } },
|
||||
{ path: '/devices', component: DeviceList, meta: { requiresAuth: true } },
|
||||
{ path: '/device-templates', component: DeviceTemplateList, meta: { requiresAuth: true } }, // 添加设备模板路由
|
||||
{ path: '/device-templates', component: DeviceTemplateList, meta: { requiresAuth: true } },
|
||||
{ path: '/plans', component: PlanList, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/device-command-logs', component: DeviceCommandLogView, meta: { requiresAuth: true } }, // 添加设备命令日志路由
|
||||
{ path: '/login', component: LoginForm }
|
||||
{ path: '/login', component: LoginForm },
|
||||
|
||||
// --- 统一注册所有监控路由 ---
|
||||
{ path: '/monitor/device-command-logs', component: DeviceCommandLogView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/feed-usage-records', component: FeedUsageRecordsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/medication-logs', component: MedicationLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pending-collections', component: PendingCollectionsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pig-batch-logs', component: PigBatchLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pig-purchases', component: PigPurchasesView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pig-sales', component: PigSalesView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pig-sick-logs', component: PigSickLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/pig-transfer-logs', component: PigTransferLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/plan-execution-logs', component: PlanExecutionLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/raw-material-purchases', component: RawMaterialPurchasesView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/raw-material-stock-logs', component: RawMaterialStockLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/sensor-data', component: SensorDataView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/task-execution-logs', component: TaskExecutionLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/user-action-logs', component: UserActionLogsView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/weighing-batches', component: WeighingBatchesView, meta: { requiresAuth: true } },
|
||||
{ path: '/monitor/weighing-records', component: WeighingRecordsView, meta: { requiresAuth: true } },
|
||||
// ---------------------------
|
||||
];
|
||||
|
||||
const router = createRouter({
|
||||
|
||||
92
src/views/monitor/FeedUsageRecordsView.vue
Normal file
92
src/views/monitor/FeedUsageRecordsView.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<div class="feed-usage-record-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchFeedUsageRecords"
|
||||
:columnsConfig="feedUsageRecordColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getFeedUsageRecords } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchFeedUsageRecords = async (params) => {
|
||||
return await getFeedUsageRecords(params);
|
||||
};
|
||||
|
||||
// 定义表格的列配置
|
||||
// 根据 swagger, 支持的筛选参数有: feed_formula_id, operator_id, pen_id, start_time, end_time
|
||||
const feedUsageRecordColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '用量(kg)',
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '饲料配方',
|
||||
dataIndex: ['feed_formula', 'name'], // 访问嵌套属性
|
||||
key: 'feed_formula_name',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '配方ID (筛选)',
|
||||
dataIndex: 'feed_formula_id',
|
||||
key: 'feed_formula_id',
|
||||
filterType: 'number',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '猪栏',
|
||||
dataIndex: ['pen', 'name'], // 访问嵌套属性
|
||||
key: 'pen_name',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '猪栏ID (筛选)',
|
||||
dataIndex: 'pen_id',
|
||||
key: 'pen_id',
|
||||
filterType: 'number',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '记录时间',
|
||||
dataIndex: 'recorded_at',
|
||||
key: 'recorded_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.feed-usage-record-view {
|
||||
/* 视图容器样式 */
|
||||
}
|
||||
</style>
|
||||
94
src/views/monitor/MedicationLogsView.vue
Normal file
94
src/views/monitor/MedicationLogsView.vue
Normal file
@@ -0,0 +1,94 @@
|
||||
<template>
|
||||
<div class="medication-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchMedicationLogs"
|
||||
:columnsConfig="medicationLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getMedicationLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchMedicationLogs = async (params) => {
|
||||
return await getMedicationLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const medicationLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '药品名称',
|
||||
dataIndex: ['medication', 'name'], // 嵌套属性
|
||||
key: 'medication_name',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '用量',
|
||||
dataIndex: 'dosage_used',
|
||||
key: 'dosage_used',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '目标数量',
|
||||
dataIndex: 'target_count',
|
||||
key: 'target_count',
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '原因',
|
||||
dataIndex: 'reason',
|
||||
key: 'reason',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '预防', value: '预防' },
|
||||
{ text: '治疗', value: '治疗' },
|
||||
{ text: '保健', value: '保健' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '发生时间',
|
||||
dataIndex: 'happened_at',
|
||||
key: 'happened_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description',
|
||||
key: 'description',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
70
src/views/monitor/PendingCollectionsView.vue
Normal file
70
src/views/monitor/PendingCollectionsView.vue
Normal file
@@ -0,0 +1,70 @@
|
||||
<template>
|
||||
<div class="pending-collections-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPendingCollections"
|
||||
:columnsConfig="pendingCollectionColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPendingCollections } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPendingCollections = async (params) => {
|
||||
return await getPendingCollections(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pendingCollectionColumns = [
|
||||
{
|
||||
title: '关联ID',
|
||||
dataIndex: 'correlation_id',
|
||||
key: 'correlation_id',
|
||||
minWidth: 300,
|
||||
},
|
||||
{
|
||||
title: '设备ID',
|
||||
dataIndex: 'device_id',
|
||||
key: 'device_id',
|
||||
sorter: true,
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '等待中', value: '等待中' },
|
||||
{ text: '已完成', value: '已完成' },
|
||||
{ text: '已超时', value: '已超时' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'created_at',
|
||||
key: 'created_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '完成时间',
|
||||
dataIndex: 'fulfilled_at',
|
||||
key: 'fulfilled_at',
|
||||
sorter: true,
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
99
src/views/monitor/PigBatchLogsView.vue
Normal file
99
src/views/monitor/PigBatchLogsView.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<div class="pig-batch-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPigBatchLogs"
|
||||
:columnsConfig="pigBatchLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPigBatchLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPigBatchLogs = async (params) => {
|
||||
return await getPigBatchLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pigBatchLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '变更类型',
|
||||
dataIndex: 'change_type',
|
||||
key: 'change_type',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '死亡', value: '死亡' },
|
||||
{ text: '淘汰', value: '淘汰' },
|
||||
{ text: '销售', value: '销售' },
|
||||
{ text: '购买', value: '购买' },
|
||||
{ text: '转入', value: '转入' },
|
||||
{ text: '转出', value: '转出' },
|
||||
{ text: '盘点校正', value: '盘点校正' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '变更数量',
|
||||
dataIndex: 'change_count',
|
||||
key: 'change_count',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '变更前数量',
|
||||
dataIndex: 'before_count',
|
||||
key: 'before_count',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '变更后数量',
|
||||
dataIndex: 'after_count',
|
||||
key: 'after_count',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '发生时间',
|
||||
dataIndex: 'happened_at',
|
||||
key: 'happened_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '原因',
|
||||
dataIndex: 'reason',
|
||||
key: 'reason',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
92
src/views/monitor/PigPurchasesView.vue
Normal file
92
src/views/monitor/PigPurchasesView.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<div class="pig-purchases-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPigPurchases"
|
||||
:columnsConfig="pigPurchaseColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPigPurchases } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPigPurchases = async (params) => {
|
||||
return await getPigPurchases(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pigPurchaseColumns = [
|
||||
{
|
||||
title: '采购ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '供应商',
|
||||
dataIndex: 'supplier',
|
||||
key: 'supplier',
|
||||
filterType: 'text',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '采购数量',
|
||||
dataIndex: 'quantity',
|
||||
key: 'quantity',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '单价',
|
||||
dataIndex: 'unit_price',
|
||||
key: 'unit_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '总价',
|
||||
dataIndex: 'total_price',
|
||||
key: 'total_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '采购日期',
|
||||
dataIndex: 'purchase_date',
|
||||
key: 'purchase_date',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
92
src/views/monitor/PigSalesView.vue
Normal file
92
src/views/monitor/PigSalesView.vue
Normal file
@@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<div class="pig-sales-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPigSales"
|
||||
:columnsConfig="pigSaleColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPigSales } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPigSales = async (params) => {
|
||||
return await getPigSales(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pigSaleColumns = [
|
||||
{
|
||||
title: '售卖ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '买方',
|
||||
dataIndex: 'buyer',
|
||||
key: 'buyer',
|
||||
filterType: 'text',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '售卖数量',
|
||||
dataIndex: 'quantity',
|
||||
key: 'quantity',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '单价',
|
||||
dataIndex: 'unit_price',
|
||||
key: 'unit_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '总价',
|
||||
dataIndex: 'total_price',
|
||||
key: 'total_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '售卖日期',
|
||||
dataIndex: 'sale_date',
|
||||
key: 'sale_date',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
106
src/views/monitor/PigSickLogsView.vue
Normal file
106
src/views/monitor/PigSickLogsView.vue
Normal file
@@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<div class="pig-sick-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPigSickLogs"
|
||||
:columnsConfig="pigSickLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPigSickLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPigSickLogs = async (params) => {
|
||||
return await getPigSickLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pigSickLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '猪栏ID',
|
||||
dataIndex: 'pen_id',
|
||||
key: 'pen_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '原因',
|
||||
dataIndex: 'reason',
|
||||
key: 'reason',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '患病', value: '患病' },
|
||||
{ text: '康复', value: '康复' },
|
||||
{ text: '死亡', value: '死亡' },
|
||||
{ text: '淘汰', value: '淘汰' },
|
||||
{ text: '转入', value: '转入' },
|
||||
{ text: '转出', value: '转出' },
|
||||
{ text: '其他', value: '其他' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '治疗地点',
|
||||
dataIndex: 'treatment_location',
|
||||
key: 'treatment_location',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '原地治疗', value: '原地治疗' },
|
||||
{ text: '病猪栏治疗', value: '病猪栏治疗' },
|
||||
],
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
title: '变更数量',
|
||||
dataIndex: 'change_count',
|
||||
key: 'change_count',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '发生时间',
|
||||
dataIndex: 'happened_at',
|
||||
key: 'happened_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
102
src/views/monitor/PigTransferLogsView.vue
Normal file
102
src/views/monitor/PigTransferLogsView.vue
Normal file
@@ -0,0 +1,102 @@
|
||||
<template>
|
||||
<div class="pig-transfer-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPigTransferLogs"
|
||||
:columnsConfig="pigTransferLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPigTransferLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPigTransferLogs = async (params) => {
|
||||
return await getPigTransferLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const pigTransferLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '猪栏ID',
|
||||
dataIndex: 'pen_id',
|
||||
key: 'pen_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '迁移类型',
|
||||
dataIndex: 'type',
|
||||
key: 'type',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '群内调栏', value: '群内调栏' },
|
||||
{ text: '跨群调栏', value: '跨群调栏' },
|
||||
{ text: '销售', value: '销售' },
|
||||
{ text: '死亡', value: '死亡' },
|
||||
{ text: '淘汰', value: '淘汰' },
|
||||
{ text: '新购入', value: '新购入' },
|
||||
{ text: '产房转入', value: '产房转入' },
|
||||
],
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'quantity',
|
||||
key: 'quantity',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '迁移时间',
|
||||
dataIndex: 'transfer_time',
|
||||
key: 'transfer_time',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '关联ID',
|
||||
dataIndex: 'correlation_id',
|
||||
key: 'correlation_id',
|
||||
filterType: 'text',
|
||||
minWidth: 280,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
79
src/views/monitor/PlanExecutionLogsView.vue
Normal file
79
src/views/monitor/PlanExecutionLogsView.vue
Normal file
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div class="plan-execution-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchPlanExecutionLogs"
|
||||
:columnsConfig="planExecutionLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getPlanExecutionLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchPlanExecutionLogs = async (params) => {
|
||||
return await getPlanExecutionLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const planExecutionLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '计划ID',
|
||||
dataIndex: 'plan_id',
|
||||
key: 'plan_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '已开始', value: '已开始' },
|
||||
{ text: '已完成', value: '已完成' },
|
||||
{ text: '失败', value: '失败' },
|
||||
{ text: '已取消', value: '已取消' },
|
||||
{ text: '等待中', value: '等待中' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '开始时间',
|
||||
dataIndex: 'started_at',
|
||||
key: 'started_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '结束时间',
|
||||
dataIndex: 'ended_at',
|
||||
key: 'ended_at',
|
||||
sorter: true,
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '错误信息',
|
||||
dataIndex: 'error',
|
||||
key: 'error',
|
||||
minWidth: 250,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
85
src/views/monitor/RawMaterialPurchasesView.vue
Normal file
85
src/views/monitor/RawMaterialPurchasesView.vue
Normal file
@@ -0,0 +1,85 @@
|
||||
<template>
|
||||
<div class="raw-material-purchases-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchRawMaterialPurchases"
|
||||
:columnsConfig="rawMaterialPurchaseColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getRawMaterialPurchases } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchRawMaterialPurchases = async (params) => {
|
||||
return await getRawMaterialPurchases(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const rawMaterialPurchaseColumns = [
|
||||
{
|
||||
title: '采购ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '原料名称',
|
||||
dataIndex: ['raw_material', 'name'], // 嵌套属性
|
||||
key: 'raw_material_name',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '原料ID',
|
||||
dataIndex: 'raw_material_id',
|
||||
key: 'raw_material_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '供应商',
|
||||
dataIndex: 'supplier',
|
||||
key: 'supplier',
|
||||
filterType: 'text',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '单价',
|
||||
dataIndex: 'unit_price',
|
||||
key: 'unit_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '总价',
|
||||
dataIndex: 'total_price',
|
||||
key: 'total_price',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '采购日期',
|
||||
dataIndex: 'purchase_date',
|
||||
key: 'purchase_date',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
87
src/views/monitor/RawMaterialStockLogsView.vue
Normal file
87
src/views/monitor/RawMaterialStockLogsView.vue
Normal file
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="raw-material-stock-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchRawMaterialStockLogs"
|
||||
:columnsConfig="rawMaterialStockLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getRawMaterialStockLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchRawMaterialStockLogs = async (params) => {
|
||||
return await getRawMaterialStockLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const rawMaterialStockLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '原料ID',
|
||||
dataIndex: 'raw_material_id',
|
||||
key: 'raw_material_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '来源类型',
|
||||
dataIndex: 'source_type',
|
||||
key: 'source_type',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '采购入库', value: '采购入库' },
|
||||
{ text: '饲喂出库', value: '饲喂出库' },
|
||||
{ text: '变质出库', value: '变质出库' },
|
||||
{ text: '售卖出库', value: '售卖出库' },
|
||||
{ text: '杂用领取', value: '杂用领取' },
|
||||
{ text: '手动盘点', value: '手动盘点' },
|
||||
],
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
title: '来源ID',
|
||||
dataIndex: 'source_id',
|
||||
key: 'source_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '变更数量',
|
||||
dataIndex: 'change_amount',
|
||||
key: 'change_amount',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '发生时间',
|
||||
dataIndex: 'happened_at',
|
||||
key: 'happened_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remarks',
|
||||
key: 'remarks',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
72
src/views/monitor/SensorDataView.vue
Normal file
72
src/views/monitor/SensorDataView.vue
Normal file
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div class="sensor-data-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchSensorData"
|
||||
:columnsConfig="sensorDataColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getSensorData } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchSensorData = async (params) => {
|
||||
return await getSensorData(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const sensorDataColumns = [
|
||||
{
|
||||
title: '设备ID',
|
||||
dataIndex: 'device_id',
|
||||
key: 'device_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '传感器类型',
|
||||
dataIndex: 'sensor_type',
|
||||
key: 'sensor_type',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '信号强度', value: '信号强度' },
|
||||
{ text: '电池电量', value: '电池电量' },
|
||||
{ text: '温度', value: '温度' },
|
||||
{ text: '湿度', value: '湿度' },
|
||||
{ text: '重量', value: '重量' },
|
||||
],
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '数据',
|
||||
dataIndex: 'data',
|
||||
key: 'data',
|
||||
// 将数组格式化为逗号分隔的字符串
|
||||
formatter: (row, column, cellValue) => Array.isArray(cellValue) ? cellValue.join(', ') : cellValue,
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '采集时间',
|
||||
dataIndex: 'time',
|
||||
key: 'time',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '区域主控ID',
|
||||
dataIndex: 'regional_controller_id',
|
||||
key: 'regional_controller_id',
|
||||
minWidth: 120,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
93
src/views/monitor/TaskExecutionLogsView.vue
Normal file
93
src/views/monitor/TaskExecutionLogsView.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<div class="task-execution-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchTaskExecutionLogs"
|
||||
:columnsConfig="taskExecutionLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getTaskExecutionLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchTaskExecutionLogs = async (params) => {
|
||||
return await getTaskExecutionLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const taskExecutionLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '任务ID',
|
||||
dataIndex: 'task_id',
|
||||
key: 'task_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '任务名称',
|
||||
dataIndex: ['task', 'name'], // 嵌套属性
|
||||
key: 'task_name',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '计划执行ID',
|
||||
dataIndex: 'plan_execution_log_id',
|
||||
key: 'plan_execution_log_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '已开始', value: '已开始' },
|
||||
{ text: '已完成', value: '已完成' },
|
||||
{ text: '失败', value: '失败' },
|
||||
{ text: '已取消', value: '已取消' },
|
||||
{ text: '等待中', value: '等待中' },
|
||||
],
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '开始时间',
|
||||
dataIndex: 'started_at',
|
||||
key: 'started_at',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '结束时间',
|
||||
dataIndex: 'ended_at',
|
||||
key: 'ended_at',
|
||||
sorter: true,
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '输出',
|
||||
dataIndex: 'output',
|
||||
key: 'output',
|
||||
minWidth: 250,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
100
src/views/monitor/UserActionLogsView.vue
Normal file
100
src/views/monitor/UserActionLogsView.vue
Normal file
@@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<div class="user-action-logs-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchUserActionLogs"
|
||||
:columnsConfig="userActionLogColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getUserActionLogs } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchUserActionLogs = async (params) => {
|
||||
return await getUserActionLogs(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const userActionLogColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '用户名',
|
||||
dataIndex: 'username',
|
||||
key: 'username',
|
||||
filterType: 'text',
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
title: '用户ID',
|
||||
dataIndex: 'user_id',
|
||||
key: 'user_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '操作类型',
|
||||
dataIndex: 'action_type',
|
||||
key: 'action_type',
|
||||
filterType: 'text',
|
||||
minWidth: 130,
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
filterType: 'select',
|
||||
filterOptions: [
|
||||
{ text: '成功', value: '成功' },
|
||||
{ text: '失败', value: '失败' },
|
||||
],
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: 'HTTP方法',
|
||||
dataIndex: 'http_method',
|
||||
key: 'http_method',
|
||||
minWidth: 110,
|
||||
},
|
||||
{
|
||||
title: 'HTTP路径',
|
||||
dataIndex: 'http_path',
|
||||
key: 'http_path',
|
||||
minWidth: 250,
|
||||
},
|
||||
{
|
||||
title: '来源IP',
|
||||
dataIndex: 'source_ip',
|
||||
key: 'source_ip',
|
||||
minWidth: 150,
|
||||
},
|
||||
{
|
||||
title: '操作时间',
|
||||
dataIndex: 'time',
|
||||
key: 'time',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description',
|
||||
key: 'description',
|
||||
minWidth: 250,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
65
src/views/monitor/WeighingBatchesView.vue
Normal file
65
src/views/monitor/WeighingBatchesView.vue
Normal file
@@ -0,0 +1,65 @@
|
||||
<template>
|
||||
<div class="weighing-batches-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchWeighingBatches"
|
||||
:columnsConfig="weighingBatchColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getWeighingBatches } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchWeighingBatches = async (params) => {
|
||||
return await getWeighingBatches(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const weighingBatchColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '猪批次ID',
|
||||
dataIndex: 'pig_batch_id',
|
||||
key: 'pig_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '称重时间',
|
||||
dataIndex: 'weighing_time',
|
||||
key: 'weighing_time',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'description',
|
||||
key: 'description',
|
||||
minWidth: 250,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'created_at',
|
||||
key: 'created_at',
|
||||
sorter: true,
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
79
src/views/monitor/WeighingRecordsView.vue
Normal file
79
src/views/monitor/WeighingRecordsView.vue
Normal file
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<div class="weighing-records-view">
|
||||
<GenericMonitorList
|
||||
:fetchData="fetchWeighingRecords"
|
||||
:columnsConfig="weighingRecordColumns"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import GenericMonitorList from '../../components/GenericMonitorList.vue';
|
||||
import { getWeighingRecords } from '../../api/monitor.js';
|
||||
import { formatRFC3339 } from '../../utils/format.js';
|
||||
|
||||
// 适配通用组件的 fetchData prop
|
||||
const fetchWeighingRecords = async (params) => {
|
||||
return await getWeighingRecords(params);
|
||||
};
|
||||
|
||||
// 定义表格的列，依据 swagger.json
|
||||
const weighingRecordColumns = [
|
||||
{
|
||||
title: '记录ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '批次称重ID',
|
||||
dataIndex: 'weighing_batch_id',
|
||||
key: 'weighing_batch_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '猪栏ID',
|
||||
dataIndex: 'pen_id',
|
||||
key: 'pen_id',
|
||||
filterType: 'number',
|
||||
sorter: true,
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '重量',
|
||||
dataIndex: 'weight',
|
||||
key: 'weight',
|
||||
sorter: true,
|
||||
minWidth: 100,
|
||||
},
|
||||
{
|
||||
title: '称重时间',
|
||||
dataIndex: 'weighing_time',
|
||||
key: 'weighing_time',
|
||||
sorter: true,
|
||||
filterType: 'dateRange',
|
||||
formatter: (row, column, cellValue) => formatRFC3339(cellValue),
|
||||
minWidth: 180,
|
||||
},
|
||||
{
|
||||
title: '操作员ID',
|
||||
dataIndex: 'operator_id',
|
||||
key: 'operator_id',
|
||||
filterType: 'number',
|
||||
minWidth: 120,
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
key: 'remark',
|
||||
minWidth: 200,
|
||||
},
|
||||
];
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 视图容器样式 */
|
||||
</style>
|
||||
Reference in New Issue
Block a user