huangjiaqi/datie-bom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

html逻辑优化

Browse Source
This commit is contained in:
Jimmy
2026-05-25 16:32:53 +08:00
parent 031ec4d289
commit 66eecd0daa
6 changed files with 212 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
web_ui/templates/bom_compare.html
View File

@@ -425,10 +425,10 @@
originalTableData: [],
// 默认设定期间，方便测试
periodA_start: '2023-01-01',
periodA_end: '2023-12-31',
periodB_start: '2024-01-01',
periodB_end: '2024-12-31'
periodA_start: '2025-01-01',
periodA_end: '2025-12-31',
periodB_start: '2026-01-01',
periodB_end: '2026-12-31'
}
},
mounted() {

67
web_ui/templates/home.html
View File

@@ -145,22 +145,26 @@
</div>
<div class="action-group">
<div v-if="globalTaskName" style="position: absolute; top: -30px; width: 100%; text-align: center; color: #E6A23C; font-weight: bold; font-size: 14px;">
<i class="el-icon-loading"></i> 系统忙碌中：正在执行 {{ globalTaskName }}，在此期间无法发起新的抓取。
</div>
<el-button
type="success"
:icon="syncing ? '' : 'el-icon-refresh'"
:loading="syncing"
:icon="isSystemBusy ? 'el-icon-loading' : 'el-icon-refresh'"
:disabled="isSystemBusy"
@click="syncReceipts"
round>
<span v-text="syncing ? '正在后台同步增量数据，请稍候...' : '读取最新收货明细报表'"></span>
<span v-text="syncing ? '请求已发送...' : '读取最新收货明细报表'"></span>
</el-button>
<el-button
type="primary"
:icon="syncingBom ? '' : 'el-icon-refresh-right'"
:loading="syncingBom"
:icon="isSystemBusy ? 'el-icon-loading' : 'el-icon-refresh-right'"
:disabled="isSystemBusy"
@click="syncBom"
round>
<span v-text="syncingBom ? '正在后台抓取 BOM 树，耗时较长，请稍候...' : '读取最新 BOM 表'"></span>
<span v-text="syncingBom ? '请求已发送...' : '读取最新 BOM 表'"></span>
</el-button>
</div>
</div>
@@ -171,24 +175,53 @@
data() {
return {
syncing: false,
syncingBom: false
syncingBom: false,
isSystemBusy: false,
globalTaskName: "",
statusTimer: null
}
},
mounted() {
// 页面加载时立刻检查一次
this.checkTaskStatus();
// 之后每隔 3 秒轮询一次后端状态
this.statusTimer = setInterval(this.checkTaskStatus, 3000);
},
beforeDestroy() {
if (this.statusTimer) {
clearInterval(this.statusTimer);
}
},
methods: {
checkTaskStatus() {
axios.get('/api/task_status')
.then(res => {
this.isSystemBusy = res.data.is_busy;
this.globalTaskName = res.data.task_name;
})
.catch(err => {
// 忽略检查错误
});
},
syncReceipts() {
this.syncing = true;
axios.post('/api/sync_receipts')
.then(res => {
if (res.data.success) {
this.$message.success('明细同步成功！' + res.data.message);
this.$message.success('已触发！' + res.data.message);
// 立即主动检查一次状态更新按钮
setTimeout(this.checkTaskStatus, 500);
} else {
this.$message.error('同步失败：' + res.data.message);
this.$message.error('触发失败：' + res.data.message);
}
})
.catch(err => {
this.$message.error('请求发生异常，请检查后端日志。');
console.error(err);
if (err.response && err.response.status === 409) {
this.$message.warning(err.response.data.message);
} else {
this.$message.error('请求发生异常，请检查后端日志。');
}
})
.finally(() => {
this.syncing = false;
@@ -200,14 +233,18 @@
axios.post('/api/sync_bom')
.then(res => {
if (res.data.success) {
this.$message.success('BOM 同步成功！' + res.data.message);
this.$message.success('已触发！' + res.data.message);
setTimeout(this.checkTaskStatus, 500);
} else {
this.$message.error('同步失败：' + res.data.message);
this.$message.error('触发失败：' + res.data.message);
}
})
.catch(err => {
this.$message.error('请求发生异常，这可能需要较长时间，请检查控制台日志。');
console.error(err);
if (err.response && err.response.status === 409) {
this.$message.warning(err.response.data.message);
} else {
this.$message.error('请求发生异常，请检查后端日志。');
}
})
.finally(() => {
this.syncingBom = false;