Wance/frontend_hmi
14
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复路径引用 bug

Browse Source
This commit is contained in:
tao
2025-12-17 16:48:34 +08:00
parent f58d71ee05
commit ac35b819a7
6 changed files with 3 additions and 497 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
components.d.ts vendored
View File

@@ -31,7 +31,6 @@ declare module 'vue' {
ExecutionResult: typeof import('./src/components/common/ExecutionResult/index.vue')['default']
ILucideActivity: typeof import('~icons/lucide/activity')['default']
ILucideCamera: typeof import('~icons/lucide/camera')['default']
ILucideCircleX: typeof import('~icons/lucide/circle-x')['default']
ILucideCpu: typeof import('~icons/lucide/cpu')['default']
ILucideDatabase: typeof import('~icons/lucide/database')['default']
ILucideEdit: typeof import('~icons/lucide/edit')['default']

2
src/views/Line1/L1-data-list/index.vue
View File

@@ -133,7 +133,7 @@
import { ref, reactive, onMounted } from "vue";
import { message } from "ant-design-vue";
import { getL1Data, exportData } from "@/api/line1/data";
import type { QueryParams } from "@/api/data/model";
import type { QueryParams } from "@/api/line1/data/model";
import type { L1Data } from "./types";
import type { Dayjs } from "dayjs";
import { download } from "@/utils/download";

69
src/views/Line1/L4-data-list/data.ts
View File

@@ -1,69 +0,0 @@
import type { TableColumnType, TableColumnsType } from "ant-design-vue";
const INDEX_COLUMN: TableColumnType = {
key: "index",
title: "序号",
width: 60,
fixed: true,
align: "center",
} as const;
// 定义操作列配置
const ACTION_COLUMN: TableColumnType = {
key: "action",
title: "操作",
width: 120,
ellipsis: true,
fixed: "right",
align: "center",
} as const;
// 使用 Record 类型确保键值对的安全性
export const fields: Record<string, string> = {
processInfoId: "加工信息ID",
pltNo: "PLT No",
processF1: "加工F1",
processF2: "加工F2",
goodProductF1: "良品F1",
goodProductF2: "良品F2",
electricalResult: "电气检测结果",
engraveResult: "印字检测结果",
qrCode: "二维码",
qrCodeLevel: "二维码等级",
pressure15Riveting: "压力1_5#_铆接",
height15Riveting: "高度1_5#_铆接",
pressure25Magnet1: "压力2_5#_磁石1",
height25Magnet1: "高度2_5#_磁石1",
pressure36Magnet2: "压力3_6#_磁石2",
height36Magnet2: "高度3_6#_磁石2",
torque47AxisInsert: "扭矩4_7#_轴旋入",
height47AxisInsert: "高度4_7#_轴旋入",
pressure58LowerCase: "压力5_8#_下壳装入",
height58LowerCase: "高度5_8#_下壳装入",
pressure69UpperCase: "压力6_9#_上壳装入",
height69UpperCase: "高度6_9#_上壳装入",
height79HeightCheck: "高度7_9#_高度检测",
pressure79Laser: "压力7_9#_激光",
height89Laser: "高度8_9#_激光",
value19DcrUpper: "数値1_9#_DCR(上)",
value29DcrLower: "数値2_9#_DCR(下)",
value39LcrUpperLs: "数値3_9#_LCR(上)LS",
value49LcrLowerQ: "数値4_9#_LCR(下)Q",
value59LcrLowerLs: "数値5_9#_LCR(下)LS",
value69LcrLowerQ: "数値6_9#_LCR(下)Q",
value79IrR: "数値7_9#_IR R",
value89IrI: "数値8_9#_IR I",
createTime: "创建时间"
} as const;
// 导出完整的列配置
export const columns: TableColumnsType = [
INDEX_COLUMN,
...Object.entries(fields).map(([key, title]) => ({
key,
title,
width: 150,
ellipsis: true,
})),
ACTION_COLUMN,
];

318
src/views/Line1/L4-data-list/index.vue
View File

@@ -1,318 +0,0 @@
<template>
<div class="l4-data-container">
<div class="page-header">
<h1 class="page-title">L4数据列表</h1>
</div>
<!-- 筛选区域 -->
<div class="filter-section">
<a-form layout="inline" :model="formData">
<a-form-item label="日期范围">
<a-range-picker v-model:value="formData.dateRange" :placeholder="['开始日期', '结束日期']"
format="YYYY-MM-DD HH:mm:ss" show-time />
</a-form-item>
<a-form-item>
<a-space>
<a-button type="primary" @click="handleSearch" :loading="loading">
<template #icon>
<i-lucide-search />
</template>
搜索
</a-button>
<a-button @click="handleReset">
<template #icon>
<i-lucide-refresh-cw />
</template>
重置
</a-button>
</a-space>
</a-form-item>
</a-form>
</div>
<!-- 数据表格 -->
<div class="table-section">
<a-table :columns="columns" :data-source="tableData" :loading="loading" :pagination="pagination"
@change="handleTableChange" row-key="id" size="middle" :scroll="{ x: 1200 }">
<template #bodyCell="{ column, record, index }">
<template v-if="column.key === 'index'">{{ index + 1 }}</template>
<template v-if="column.key === 'createTime'">
{{ formatDateTime(record.createTime) }}
</template>
<!-- <template v-else-if="column.key === 'processF1'">
<a-tag :color="record.processF1 === 1 ? 'green' : 'red'">
{{ record.processF1 === 1 ? '已加工' : '未加工' }}
</a-tag>
</template>
<template v-else-if="column.key === 'processF2'">
<a-tag :color="record.processF2 === 1 ? 'green' : 'red'">
{{ record.processF2 === 1 ? '已加工' : '未加工' }}
</a-tag>
</template>
<template v-else-if="column.key === 'goodProductF1'">
<a-tag :color="record.goodProductF1 === 1 ? 'green' : 'red'">
{{ record.goodProductF1 === 1 ? '良品' : '不良品' }}
</a-tag>
</template>
<template v-else-if="column.key === 'goodProductF2'">
<a-tag :color="record.goodProductF2 === 1 ? 'green' : 'red'">
{{ record.goodProductF2 === 1 ? '良品' : '不良品' }}
</a-tag>
</template>
<template v-else-if="column.key === 'electricalResult'">
<a-tag :color="getElectricalResultColor(record.electricalResult)">
{{ getElectricalResultText(record.electricalResult) }}
</a-tag>
</template>
<template v-else-if="column.key === 'engraveResult'">
<a-tag :color="record.engraveResult === 0 ? 'green' : 'red'">
{{ record.engraveResult === 0 ? '良品' : '不良品' }}
</a-tag>
</template> -->
<template v-else-if="column.key === 'action'">
<a-button type="link" size="small" @click="handleView(record as L4Data)">
查看详情
</a-button>
</template>
<template v-else>
{{ record[column.key as string] }}
</template>
</template>
</a-table>
</div>
<!-- 详情弹窗 -->
<a-modal v-model:open="detailModalVisible" title="L4数据详情" width="800px" :footer="null">
<div v-if="selectedRecord" class="detail-content">
<a-descriptions :column="2" bordered>
<a-descriptions-item v-for="(value, key) in selectedRecord" :key="key"
:label="columns.find((col) => col.key === key)?.title || key">
<template v-if="key === 'createTime'">
{{ formatDateTime(value) }}
</template>
<!-- <template v-else-if="key === 'processF1'">
<a-tag :color="value === 1 ? 'green' : 'red'">
{{ value === 1 ? '已加工' : '未加工' }}
</a-tag>
</template>
<template v-else-if="key === 'processF2'">
<a-tag :color="value === 1 ? 'green' : 'red'">
{{ value === 1 ? '已加工' : '未加工' }}
</a-tag>
</template>
<template v-else-if="key === 'goodProductF1'">
<a-tag :color="value === 1 ? 'green' : 'red'">
{{ value === 1 ? '良品' : '不良品' }}
</a-tag>
</template>
<template v-else-if="key === 'goodProductF2'">
<a-tag :color="value === 1 ? 'green' : 'red'">
{{ value === 1 ? '良品' : '不良品' }}
</a-tag>
</template>
<template v-else-if="key === 'electricalResult'">
<a-tag :color="getElectricalResultColor(value)">
{{ getElectricalResultText(value) }}
</a-tag>
</template>
<template v-else-if="key === 'engraveResult'">
<a-tag :color="value === 0 ? 'green' : 'red'">
{{ value === 0 ? '良品' : '不良品' }}
</a-tag>
</template> -->
<template v-else>
{{ value }}
</template>
</a-descriptions-item>
</a-descriptions>
</div>
</a-modal>
</div>
</template>
<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue';
import { message } from 'ant-design-vue';
import { getL4Data } from '@/api/data';
import { columns } from './data';
import type { QueryParams } from '@/api/data/model';
import type { L4Data } from './types';
import type { Dayjs } from 'dayjs';
import { idText } from 'typescript';
type DateRangeType = [Dayjs, Dayjs] | undefined;
// 响应式数据
const loading = ref(false);
const tableData = ref<L4Data[]>([]);
const detailModalVisible = ref(false);
const selectedRecord = ref<L4Data | null>(null);
// 筛选参数
const formData = reactive<{ dateRange: DateRangeType }>({
dateRange: undefined,
});
// 分页配置
const pagination = reactive({
current: 1,
pageSize: 10,
total: 0,
showSizeChanger: true,
showQuickJumper: true,
showTotal: (total: number, range: [number, number]) =>
`共 ${total} 条记录，当前显示第 ${range[0]}-${range[1]} 条`,
});
// 电气检测结果颜色
const getElectricalResultColor = (result: number) => {
switch (result) {
case 7: return 'green';
case 0: return 'red';
case 1: return 'orange';
case 3: return 'purple';
default: return 'default';
}
};
// 电气检测结果文本
const getElectricalResultText = (result: number) => {
switch (result) {
case 0: return 'DCR不良';
case 1: return 'LCR不良';
case 3: return 'IR不良';
case 7: return '良品';
default: return '未知';
}
};
// 获取数据
const fetchData = async () => {
loading.value = true;
try {
const params: QueryParams = {
pageNum: pagination.current,
pageSize: pagination.pageSize,
orderByColumn: 'id',
isAsc: 'desc'
};
// 添加日期范围筛选
if (formData.dateRange && formData.dateRange.length === 2) {
params.createTimeBegin = formData.dateRange[0].format("YYYY-MM-DD HH:mm:ss");
params.createTimeEnd = formData.dateRange[1].format("YYYY-MM-DD HH:mm:ss");
}
const response = await getL4Data(params);
if (response.code === 200) {
tableData.value = response.rows || [];
pagination.total = response.total || 0;
} else {
message.error(response.msg || "获取数据失败");
}
} catch (error) {
console.error("获取L4数据失败:", error);
message.error("获取数据失败，请稍后重试");
} finally {
loading.value = false;
}
};
// 搜索处理
const handleSearch = () => {
pagination.current = 1;
fetchData();
};
// 重置处理
const handleReset = () => {
formData.dateRange = undefined;
pagination.current = 1;
fetchData();
};
// 表格变化处理（分页、排序等）
const handleTableChange = (paginationInfo: any) => {
pagination.current = paginationInfo.current;
pagination.pageSize = paginationInfo.pageSize;
fetchData();
};
// 查看详情
const handleView = (record: L4Data) => {
selectedRecord.value = record;
detailModalVisible.value = true;
};
// 日期时间格式化
const formatDateTime = (dateTime: string | number) => {
if (!dateTime) return '-';
return new Date(dateTime).toLocaleString('zh-CN', {
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
});
};
// 组件挂载时获取数据
onMounted(() => {
fetchData();
});
</script>
<style scoped lang="scss">
.l4-data-container {
padding: 20px;
background: #f5f5f5;
min-height: 100vh;
}
.page-header {
margin-bottom: 20px;
.page-title {
font-size: 24px;
font-weight: 600;
color: #1f2937;
margin: 0;
}
}
.filter-section {
background: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
margin-bottom: 20px;
}
.table-section {
background: white;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.detail-content {
max-height: 500px;
overflow-y: auto;
}
:deep(.ant-table-thead > tr > th) {
background: #f8fafc;
font-weight: 600;
}
:deep(.ant-table-tbody > tr:hover > td) {
background: #f0f9ff;
}
:deep(.ant-descriptions-item-label) {
font-weight: 600;
background: #f8fafc;
}
</style>

106
src/views/Line1/L4-data-list/types.ts
View File

@@ -1,106 +0,0 @@
export interface L4Data {
/** 加工信息ID */
processInfoId: number;
/** PLT No */
pltNo: number;
/** 加工F1, 0：未加工 */
processF1: 0 | 1;
/** 加工F2, 1：已加工 */
processF2: 0 | 1;
/** 良品F1, 0：不良品 */
goodProductF1: 0 | 1;
/** 良品F2, 1：良品 */
goodProductF2: 0 | 1;
/**
* 电气检测结果
* 0-DCR不良, 1-LCR不良, 3-IR不良, 7-良品
*/
electricalResult: 0 | 1 | 3 | 7;
/** 印字检测结果, 0-良品, 1-不良品 */
engraveResult: 0 | 1;
/** 二维码 */
qrCode: string;
/** 二维码等级 */
qrCodeLevel: string;
/** 压力1_5#_铆接 */
pressure15Riveting: number;
/** 高度1_5#_铆接 */
height15Riveting: number;
/** 压力2_5#_磁石1 */
pressure25Magnet1: number;
/** 高度2_5#_磁石1 */
height25Magnet1: number;
/** 压力3_6#_磁石2 */
pressure36Magnet2: number;
/** 高度3_6#_磁石2 */
height36Magnet2: number;
/** 扭矩4_7#_轴旋入 */
torque47AxisInsert: number;
/** 高度4_7#_轴旋入 */
height47AxisInsert: number;
/** 压力5_8#_下壳装入 */
pressure58LowerCase: number;
/** 高度5_8#_下壳装入 */
height58LowerCase: number;
/** 压力6_9#_上壳装入 */
pressure69UpperCase: number;
/** 高度6_9#_上壳装入 */
height69UpperCase: number;
/** 高度7_9#_高度检测 */
height79HeightCheck: number;
/** 压力7_9#_激光 */
pressure79Laser: number;
/** 高度8_9#_激光 */
height89Laser: number;
/** 数値1_9#_DCR(上) */
value19DcrUpper: number;
/** 数値2_9#_DCR(下) */
value29DcrLower: number;
/** 数値3_9#_LCR(上)LS */
value39LcrUpperLs: number;
/** 数値4_9#_LCR(下)Q */
value49LcrLowerQ: number;
/** 数値5_9#_LCR(下)LS */
value59LcrLowerLs: number;
/** 数値6_9#_LCR(下)Q */
value69LcrLowerQ: number;
/** 数値7_9#_IR R */
value79IrR: number;
/** 数値8_9#_IR I */
value89IrI: number;
/** 创建时间 (ISO 8601) */
createTime: string;
}

4
src/views/Line1/alarm-records/index.vue
View File

@@ -73,8 +73,8 @@
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { message } from "ant-design-vue";
import { getAlarmRecords } from "@/api/data";
import type { QueryParams } from "@/api/data/model";
import { getAlarmRecords } from "@/api/line1/data";
import type { QueryParams } from "@/api/line1/data/model";
import type { AlarmRecord } from "./types";
import type { Dayjs } from "dayjs";
import { columns } from "./data";