<template>
|
<div class="app-container">
|
<el-card header="基础数据检测">
|
<el-checkbox-group v-model="selectedModules">
|
<el-checkbox label="sales">销售模块</el-checkbox>
|
<el-checkbox label="purchase">采购模块</el-checkbox>
|
<el-checkbox label="quality">质量模块</el-checkbox>
|
</el-checkbox-group>
|
<div style="margin-top: 16px">
|
<el-button type="primary" @click="handleCheck" :loading="checking">
|
开始检测
|
</el-button>
|
</div>
|
</el-card>
|
|
<el-card v-if="checkResult" header="检测结果" style="margin-top: 16px">
|
<el-alert
|
:title="`通过 ${checkResult.passedItems} / ${checkResult.totalItems} 项`"
|
:type="checkResult.passedItems === checkResult.totalItems ? 'success' : 'warning'"
|
:closable="false"
|
show-icon
|
/>
|
<el-table :data="checkResult.items" style="margin-top: 12px" border>
|
<el-table-column prop="module" label="模块" width="100" />
|
<el-table-column prop="itemName" label="检测项" width="160" />
|
<el-table-column prop="minRequired" label="最低要求" width="80" align="center" />
|
<el-table-column prop="currentCount" label="当前数量" width="80" align="center" />
|
<el-table-column label="状态" width="80" align="center">
|
<template #default="{ row }">
|
<el-tag :type="row.passed ? 'success' : 'danger'">
|
{{ row.passed ? "通过" : "未通过" }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column prop="message" label="提示" min-width="200" />
|
</el-table>
|
</el-card>
|
</div>
|
</template>
|
|
<script setup>
|
import { ref } from "vue";
|
import { ElMessage } from "element-plus";
|
import { dataCheck } from "@/api/mock/dataCheck.js";
|
|
const selectedModules = ref(["sales", "purchase", "quality"]);
|
const checking = ref(false);
|
const checkResult = ref(null);
|
|
const handleCheck = async () => {
|
if (selectedModules.value.length === 0) {
|
ElMessage.warning("请至少选择一个模块");
|
return;
|
}
|
checking.value = true;
|
try {
|
const res = await dataCheck(selectedModules.value);
|
checkResult.value = res.data;
|
} finally {
|
checking.value = false;
|
}
|
};
|
</script>
|
|
<style scoped></style>
|
