Compare commits
4 Commits
8eb0a9fee1
...
projects/q
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
04d5896f6e | ||
|
|
46a23c249c | ||
| 242a52b98e | |||
|
|
945237557f |
4
.env.dev
4
.env.dev
@@ -12,8 +12,8 @@ ENV = 'development'
|
|||||||
VUE_APP_TITLE = 智能监控分析系统
|
VUE_APP_TITLE = 智能监控分析系统
|
||||||
|
|
||||||
# 芋道管理系统/开发环境
|
# 芋道管理系统/开发环境
|
||||||
VUE_APP_BASE_API = 'http://172.16.32.79:48082'
|
# VUE_APP_BASE_API = 'http://172.16.32.79:48082'
|
||||||
# VUE_APP_BASE_API = 'http://line.kszny.picaiba.com'
|
VUE_APP_BASE_API = 'http://line.kszny.picaiba.com'
|
||||||
|
|
||||||
|
|
||||||
# 路由懒加载
|
# 路由懒加载
|
||||||
|
|||||||
@@ -111,3 +111,17 @@ export function getProcessAutoReportNew(data) {
|
|||||||
data: data,
|
data: data,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
export function getProcessAutoReportLastGroup(data) {
|
||||||
|
return request({
|
||||||
|
url: '/monitoring/production-monitor/getProcessAutoReportLastGroup',
|
||||||
|
method: 'post',
|
||||||
|
data: data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
export function getPLlistByFactory(data) {
|
||||||
|
return request({
|
||||||
|
url: 'base/production-line/listByFactory',
|
||||||
|
method: 'post',
|
||||||
|
data: data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
@@ -89,6 +89,31 @@ export default {
|
|||||||
},
|
},
|
||||||
created() {},
|
created() {},
|
||||||
methods: {
|
methods: {
|
||||||
|
dataFormSubmit() {
|
||||||
|
this.$refs["dataForm"].validate((valid) => {
|
||||||
|
if (!valid) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// 修改的提交
|
||||||
|
if (this.dataForm.id) {
|
||||||
|
this.urlOptions.updateURL(this.dataForm).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// 添加的提交
|
||||||
|
this.urlOptions.createURL(this.dataForm).then(response => {
|
||||||
|
if (response.code === 1001033 || response.code === 1001034) {
|
||||||
|
return this.$modal.msgError(response.msg);
|
||||||
|
}
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -120,6 +120,29 @@ export default {
|
|||||||
.label;
|
.label;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
dataFormSubmit() {
|
||||||
|
this.$refs["dataForm"].validate((valid) => {
|
||||||
|
if (!valid) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// 修改的提交
|
||||||
|
if (this.dataForm.id) {
|
||||||
|
this.urlOptions.updateURL(this.dataForm).then(response => {
|
||||||
|
this.$modal.msgSuccess("修改成功");
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// 添加的提交
|
||||||
|
this.urlOptions.createURL(this.dataForm).then(response => {
|
||||||
|
console.log('response', response);
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit("refreshDataList");
|
||||||
|
});
|
||||||
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -7,46 +7,20 @@
|
|||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<search-bar
|
<search-bar :formConfigs="formConfig" ref="searchBarForm" @select-changed="handleSearchBarChanged"
|
||||||
:formConfigs="formConfig"
|
|
||||||
ref="searchBarForm"
|
|
||||||
@select-changed="handleSearchBarChanged"
|
|
||||||
@headBtnClick="buttonClick" />
|
@headBtnClick="buttonClick" />
|
||||||
<div v-if="showData.length">
|
<div v-if="showData.length">
|
||||||
<base-table
|
<base-table class="right-aside" v-loading="dataListLoading" :table-props="tableProps" :page="1" :limit="999"
|
||||||
class="right-aside"
|
|
||||||
v-loading="dataListLoading"
|
|
||||||
:table-props="tableProps"
|
|
||||||
:page="1"
|
|
||||||
:limit="999"
|
|
||||||
:table-data="showData">
|
:table-data="showData">
|
||||||
<method-btn
|
<method-btn v-if="showData.length" slot="handleBtn" :width="80" label="操作" :method-list="tableBtn"
|
||||||
v-if="showData.length"
|
|
||||||
slot="handleBtn"
|
|
||||||
:width="80"
|
|
||||||
label="操作"
|
|
||||||
:method-list="tableBtn"
|
|
||||||
@clickBtn="handleClick" />
|
@clickBtn="handleClick" />
|
||||||
</base-table>
|
</base-table>
|
||||||
<barChart
|
<barChart v-for="item in chartData" :key="item.name + 'echart'" style="margin-top: 50px" height="600px"
|
||||||
v-for="item in chartData"
|
:id="item.name + 'echart'" :title="item.name + ' 节拍趋势图'" :bar-data="item" />
|
||||||
:key="item.name + 'echart'"
|
|
||||||
style="margin-top: 50px"
|
|
||||||
height="600px"
|
|
||||||
:id="item.name + 'echart'"
|
|
||||||
:title="item.name + ' 节拍趋势图'"
|
|
||||||
:bar-data="item" />
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="no-data-bg"></div>
|
<div v-else class="no-data-bg"></div>
|
||||||
<base-dialog
|
<base-dialog :dialogTitle="addOrEditTitle" :dialogVisible="addOrUpdateVisible" @cancel="handleCancel"
|
||||||
:dialogTitle="addOrEditTitle"
|
@confirm="handleConfirm" :before-close="handleCancel" close-on-click-modal top="0" width="50%">
|
||||||
:dialogVisible="addOrUpdateVisible"
|
|
||||||
@cancel="handleCancel"
|
|
||||||
@confirm="handleConfirm"
|
|
||||||
:before-close="handleCancel"
|
|
||||||
close-on-click-modal
|
|
||||||
top="0"
|
|
||||||
width="50%">
|
|
||||||
<eq-detail ref="eqDetail" />
|
<eq-detail ref="eqDetail" />
|
||||||
<slot name="footer">
|
<slot name="footer">
|
||||||
<el-row slot="footer" type="flex" justify="end">
|
<el-row slot="footer" type="flex" justify="end">
|
||||||
@@ -64,7 +38,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import eqDetail from './eq-detail';
|
import eqDetail from './eq-detail';
|
||||||
import { parseTime } from '../../mixins/code-filter';
|
import { parseTime } from '../../mixins/code-filter';
|
||||||
import { getPdList } from '@/api/core/monitoring/auto';
|
import { getPLlistByFactory } from '@/api/core/monitoring/auto';
|
||||||
import { getNewCTNow, getNewCTCharts } from '@/api/core/analysis/index';
|
import { getNewCTNow, getNewCTCharts } from '@/api/core/analysis/index';
|
||||||
import { getFactoryPage } from '@/api/core/base/factory';
|
import { getFactoryPage } from '@/api/core/base/factory';
|
||||||
// import codeFilter from '../../mixins/code-filter'
|
// import codeFilter from '../../mixins/code-filter'
|
||||||
@@ -135,6 +109,8 @@ export default {
|
|||||||
label: '工厂',
|
label: '工厂',
|
||||||
selectOptions: [],
|
selectOptions: [],
|
||||||
param: 'factoryId',
|
param: 'factoryId',
|
||||||
|
collapseTags: true,
|
||||||
|
multiple: true,
|
||||||
onchange: true,
|
onchange: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -142,6 +118,7 @@ export default {
|
|||||||
label: '产线',
|
label: '产线',
|
||||||
selectOptions: [],
|
selectOptions: [],
|
||||||
param: 'lineId',
|
param: 'lineId',
|
||||||
|
collapseTags: true,
|
||||||
multiple: true,
|
multiple: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -183,7 +160,7 @@ export default {
|
|||||||
// 获取当前时间
|
// 获取当前时间
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
// 获取前一天的同一时间
|
// 获取前一天的同一时间
|
||||||
const yesterday = new Date(now.getTime() - 24 * 60 * 60 * 1000);
|
const yesterday = new Date(now.getTime());
|
||||||
// 设置为00:00:00
|
// 设置为00:00:00
|
||||||
yesterday.setHours(0, 0, 0, 0);
|
yesterday.setHours(0, 0, 0, 0);
|
||||||
// 设置为23:59:59
|
// 设置为23:59:59
|
||||||
@@ -232,9 +209,9 @@ export default {
|
|||||||
return exportTableOut;
|
return exportTableOut;
|
||||||
},
|
},
|
||||||
getPdLineList() {
|
getPdLineList() {
|
||||||
getPdList().then((res) => {
|
// getPLlistByFactory().then((res) => {
|
||||||
this.formConfig[1].selectOptions = res.data || [];
|
// this.formConfig[1].selectOptions = res.data || [];
|
||||||
});
|
// });
|
||||||
const params = {
|
const params = {
|
||||||
pageSize: 100,
|
pageSize: 100,
|
||||||
pageNo: 1,
|
pageNo: 1,
|
||||||
@@ -274,7 +251,7 @@ export default {
|
|||||||
handleSearchBarChanged({ param, value }) {
|
handleSearchBarChanged({ param, value }) {
|
||||||
this.listQuery.lineId = [];
|
this.listQuery.lineId = [];
|
||||||
this.$refs.searchBarForm.formInline.lineId = undefined;
|
this.$refs.searchBarForm.formInline.lineId = undefined;
|
||||||
getPdList(value).then((res) => {
|
getPLlistByFactory({ factoryIds: this.$refs.searchBarForm.formInline.factoryId }).then((res) => {
|
||||||
this.formConfig[1].selectOptions = res.data || [];
|
this.formConfig[1].selectOptions = res.data || [];
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -80,7 +80,7 @@
|
|||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
<el-row :gutter="20">
|
<!-- <el-row :gutter="20">
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<el-form-item label=" 基板类型" prop="typeDictValue">
|
<el-form-item label=" 基板类型" prop="typeDictValue">
|
||||||
<el-select :disabled="isdetail" v-model="dataForm.typeDictValue" clearable style="width: 100%"
|
<el-select :disabled="isdetail" v-model="dataForm.typeDictValue" clearable style="width: 100%"
|
||||||
@@ -89,7 +89,7 @@
|
|||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row> -->
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<small-title style="margin: 16px 0; padding-left: 8px" :no-padding="true">
|
<small-title style="margin: 16px 0; padding-left: 8px" :no-padding="true">
|
||||||
|
|||||||
@@ -348,7 +348,7 @@ export default {
|
|||||||
dataListLoading: false,
|
dataListLoading: false,
|
||||||
tableProps,
|
tableProps,
|
||||||
tableBtn: [
|
tableBtn: [
|
||||||
this.$auth.hasPermi(`monitoring:group-off:update`)
|
this.$auth.hasPermi(`monitoring:group-off:detail`)
|
||||||
? {
|
? {
|
||||||
type: 'eq',
|
type: 'eq',
|
||||||
btnName: '详情',
|
btnName: '详情',
|
||||||
|
|||||||
@@ -34,9 +34,9 @@
|
|||||||
<el-tabs v-model="activeLabel" :stretch="true" @tab-click="handleTabClick">
|
<el-tabs v-model="activeLabel" :stretch="true" @tab-click="handleTabClick">
|
||||||
<el-tab-pane :label="'全部数据'" name="table">
|
<el-tab-pane :label="'全部数据'" name="table">
|
||||||
<base-table-s ref="lineCurrentShiftTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'"
|
<base-table-s ref="lineCurrentShiftTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'"
|
||||||
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData" :max-height="300" />
|
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData" :max-height="220" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane :label="'\u3000当天生产折线图\u3000'" name="graph">
|
<el-tab-pane :label="'\u3000生产折线图\u3000'" name="graph">
|
||||||
<div style="height: 230px;" v-if="activeLabel == 'graph'" class="graph">
|
<div style="height: 230px;" v-if="activeLabel == 'graph'" class="graph">
|
||||||
<barChart v-if="tableData && tableData.length > 0" ref="barChart" height="230px"
|
<barChart v-if="tableData && tableData.length > 0" ref="barChart" height="230px"
|
||||||
:bar-data="tableData" />
|
:bar-data="tableData" />
|
||||||
@@ -59,7 +59,7 @@
|
|||||||
<base-table-s ref="lineTodayTable" style="margin-bottom: 16px;" v-if="activeLabelDay == 'table'"
|
<base-table-s ref="lineTodayTable" style="margin-bottom: 16px;" v-if="activeLabelDay == 'table'"
|
||||||
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData2" :max-height="300" />
|
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData2" :max-height="300" />
|
||||||
</el-tab-pane>
|
</el-tab-pane>
|
||||||
<el-tab-pane :label="'\u3000当天生产折线图\u3000'" name="graph">
|
<el-tab-pane :label="'\u3000生产折线图\u3000'" name="graph">
|
||||||
<div style="height: 230px;" v-if="activeLabelDay == 'graph'" class="graph">
|
<div style="height: 230px;" v-if="activeLabelDay == 'graph'" class="graph">
|
||||||
<barChart v-if="tableData2 && tableData2.length > 0" ref="barChart" height="230px"
|
<barChart v-if="tableData2 && tableData2.length > 0" ref="barChart" height="230px"
|
||||||
:bar-data="tableData2" />
|
:bar-data="tableData2" />
|
||||||
@@ -72,50 +72,30 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content-inner" v-if="listQuery.timeType === 3">
|
<div class="content-inner" v-if="listQuery.timeType === 3">
|
||||||
<!-- 当班数据(占1/2剩余高度) -->
|
|
||||||
<div class="content-card energyOverlimitLog">
|
<div class="content-card energyOverlimitLog">
|
||||||
<span class="blue-block"></span>
|
<span class="blue-block"></span>
|
||||||
<span class="tip">上一班数据</span>
|
<span class="tip" v-if="listQuery.startTime && listQuery.endTime">
|
||||||
<el-row style="margin-top: 10px;">
|
<span>{{ reportTypeMap[listQuery.reportType] }}</span>
|
||||||
<el-col class="custom-tabs">
|
<span>
|
||||||
<el-tabs v-model="activeLabel" :stretch="true" @tab-click="handleTabClick">
|
{{ parseTime(listQuery.startTime) }} 至{{
|
||||||
<el-tab-pane :label="'全部数据'" name="table">
|
parseTime(listQuery.endTime) }}
|
||||||
<base-table-s ref="lineCurrentShiftTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'"
|
</span>
|
||||||
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData" :max-height="300" />
|
</span>
|
||||||
</el-tab-pane>
|
<span class="tip" v-else>生产数据 </span>
|
||||||
<el-tab-pane :label="'\u3000当天生产折线图\u3000'" name="graph">
|
<div class="graph">
|
||||||
<div style="height: 230px;" v-if="activeLabel == 'graph'" class="graph">
|
<base-table-s ref="lineCustomTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'" :page="1"
|
||||||
<barChart v-if="tableData && tableData.length > 0" ref="barChart" height="230px"
|
:limit="100" :table-props="tableProps" :max-height="300" :table-data="tableDataCustom" />
|
||||||
:bar-data="tableData" />
|
|
||||||
<div v-else class="no-data-bg"></div>
|
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 当天数据(占1/2剩余高度) -->
|
|
||||||
<div class="content-card energyOverlimitLog">
|
<div class="content-card energyOverlimitLog">
|
||||||
<span class="blue-block"></span>
|
<span class="blue-block"></span>
|
||||||
<span class="tip">当天数据</span>
|
<span class="tip">生产折线图</span>
|
||||||
<el-row style="margin-top: 10px;">
|
<div style="width: 100%;height: 100%;" class="graph">
|
||||||
<el-col class="custom-tabs">
|
<barChart v-if="tableDataCustom && tableDataCustom.length > 0" ref="barChart"
|
||||||
<el-tabs v-model="activeLabelDay" :stretch="true" @tab-click="handleTabClick">
|
:bar-data="tableDataCustom" />
|
||||||
<el-tab-pane :label="'全部数据'" name="table">
|
|
||||||
<base-table-s ref="lineTodayTable" style="margin-bottom: 16px;" v-if="activeLabelDay == 'table'"
|
|
||||||
:page="1" :limit="100" :table-props="tableProps" :table-data="tableData2" :max-height="300" />
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane :label="'\u3000当天生产折线图\u3000'" name="graph">
|
|
||||||
<div style="height: 230px;" v-if="activeLabelDay == 'graph'" class="graph">
|
|
||||||
<barChart v-if="tableData2 && tableData2.length > 0" ref="barChart" height="230px"
|
|
||||||
:bar-data="tableData2" />
|
|
||||||
<div v-else class="no-data-bg"></div>
|
<div v-else class="no-data-bg"></div>
|
||||||
</div>
|
</div>
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<!-- 3.2 时间维度为“自定义”时的内容(两个平分高度的div) -->
|
<!-- 3.2 时间维度为“自定义”时的内容(两个平分高度的div) -->
|
||||||
@@ -129,7 +109,7 @@
|
|||||||
parseTime(listQuery.endTime) }}
|
parseTime(listQuery.endTime) }}
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<span class="tip" v-else>生产表格数据 </span>
|
<span class="tip" v-else>生产数据 </span>
|
||||||
<div class="graph">
|
<div class="graph">
|
||||||
<base-table-s ref="lineCustomTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'" :page="1"
|
<base-table-s ref="lineCustomTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'" :page="1"
|
||||||
:limit="100" :table-props="tableProps" :max-height="300" :table-data="tableDataCustom" />
|
:limit="100" :table-props="tableProps" :max-height="300" :table-data="tableDataCustom" />
|
||||||
@@ -186,7 +166,7 @@
|
|||||||
parseTime(listQuery.endTime) }}
|
parseTime(listQuery.endTime) }}
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<span class="tip" v-else>生产表格数据 </span>
|
<span class="tip" v-else>生产数据 </span>
|
||||||
<base-table-s ref="productCustomTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'" :page="1"
|
<base-table-s ref="productCustomTable" style="margin-bottom: 16px;" v-if="activeLabel == 'table'" :page="1"
|
||||||
:limit="100" :table-props="productTableProps" :table-data="productTableData" :max-height="300" />
|
:limit="100" :table-props="productTableProps" :table-data="productTableData" :max-height="300" />
|
||||||
</div>
|
</div>
|
||||||
@@ -199,7 +179,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import { parseTime } from '@/filter/code-filter';
|
import { parseTime } from '@/filter/code-filter';
|
||||||
import {
|
import {
|
||||||
getLineAuto, getPdList, getPdlAutoReportNewSearchNow, getProductAuto,
|
getLineAuto, getPLlistByFactory, getPdlAutoReportNewSearchNow, getProcessAutoReportLastGroup,
|
||||||
getProcessAutoReportGroup, getProcessAutoReportDay, getProcessAutoReportNew, getPdlAutoReportNewSearchLastGroup
|
getProcessAutoReportGroup, getProcessAutoReportDay, getProcessAutoReportNew, getPdlAutoReportNewSearchLastGroup
|
||||||
} from '@/api/core/monitoring/auto';
|
} from '@/api/core/monitoring/auto';
|
||||||
import { getFactoryPage } from '@/api/core/base/factory';
|
import { getFactoryPage } from '@/api/core/base/factory';
|
||||||
@@ -210,7 +190,160 @@ import barChart from './BarChart.vue';
|
|||||||
import ButtonNav from '@/components/ButtonNav';
|
import ButtonNav from '@/components/ButtonNav';
|
||||||
import { listData } from '@/api/system/dict/data';
|
import { listData } from '@/api/system/dict/data';
|
||||||
// 表格列配置
|
// 表格列配置
|
||||||
const tableProps = [
|
|
||||||
|
export default {
|
||||||
|
components: { barChart, ButtonNav, baseTableS },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: { getDataListURL: getLineAuto },
|
||||||
|
listQuery: {
|
||||||
|
lineId: [],
|
||||||
|
pageSize: 10,
|
||||||
|
pageNo: 1,
|
||||||
|
total: 1,
|
||||||
|
timeType: 1 // 1-当天,2-自定义
|
||||||
|
},
|
||||||
|
isPeriodicReport: false,
|
||||||
|
reportTypeMap: {
|
||||||
|
1: '日报',
|
||||||
|
2: '周报',
|
||||||
|
3: '月报',
|
||||||
|
4: '年报'
|
||||||
|
},
|
||||||
|
activeLabel: 'table', // 当班数据tab
|
||||||
|
activeLabelDay: 'table', // 当天数据tab
|
||||||
|
fileName: '',
|
||||||
|
headFormValue: {},
|
||||||
|
dataListLoading: false,
|
||||||
|
factoryColumns: [],
|
||||||
|
factoryColumnsDay: [],
|
||||||
|
activeName: 'product',
|
||||||
|
tableBtn: [],
|
||||||
|
showData: [],
|
||||||
|
tableData: [],
|
||||||
|
tableData2: [], // 示例数据,实际从接口获取
|
||||||
|
productTableData: [],
|
||||||
|
productTableDataDay: [],
|
||||||
|
tableDataCustom: [],
|
||||||
|
list: [], // 折线图数据
|
||||||
|
timeTypeOptions: {
|
||||||
|
productLine: [ // 按产线监控(包含上一班)
|
||||||
|
{ id: 1, name: '当天' },
|
||||||
|
{ id: 2, name: '自定义' },
|
||||||
|
{ id: 3, name: '上一班' }
|
||||||
|
],
|
||||||
|
product: [ // 按产品监控(不含上一班)
|
||||||
|
{ id: 1, name: '当天' },
|
||||||
|
{ id: 2, name: '自定义' },
|
||||||
|
{ id: 3, name: '上一班' }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '时间维度',
|
||||||
|
selectOptions: [
|
||||||
|
{ id: 1, name: '当天' },
|
||||||
|
{ id: 2, name: '自定义' },
|
||||||
|
{ id: 3, name: '上一班' }
|
||||||
|
],
|
||||||
|
width: 100,
|
||||||
|
onchange: true,
|
||||||
|
// defaultSelect: 1,
|
||||||
|
clearable: false,
|
||||||
|
param: 'timeType'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: '',
|
||||||
|
label: '查询类型',
|
||||||
|
selectOptions: [
|
||||||
|
{ id: 1, name: '统计数据' },
|
||||||
|
{ id: 2, name: '周期性汇总报表' }
|
||||||
|
],
|
||||||
|
width: 120,
|
||||||
|
onchange: true,
|
||||||
|
param: 'searchType'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '工厂',
|
||||||
|
selectOptions: [],
|
||||||
|
param: 'factoryId',
|
||||||
|
multiple: true,
|
||||||
|
onchange: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '产线',
|
||||||
|
selectOptions: [],
|
||||||
|
param: 'lineId',
|
||||||
|
multiple: true,
|
||||||
|
onchange: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '产品工艺',
|
||||||
|
selectOptions: [],
|
||||||
|
param: 'process',
|
||||||
|
multiple: true,
|
||||||
|
labelField: 'label',
|
||||||
|
valueField: 'label',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: '',
|
||||||
|
label: '产品类型',
|
||||||
|
selectOptions: [
|
||||||
|
{ id: 1, name: '面板' },
|
||||||
|
{ id: 2, name: '背板' },
|
||||||
|
],
|
||||||
|
multiple: true,
|
||||||
|
param: 'processType',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: '',
|
||||||
|
label: '报表类型',
|
||||||
|
selectOptions: [
|
||||||
|
{ id: 1, name: '日' },
|
||||||
|
{ id: 2, name: '周' },
|
||||||
|
{ id: 3, name: '月' },
|
||||||
|
{ id: 4, name: '年' }
|
||||||
|
],
|
||||||
|
onchange: true,
|
||||||
|
width: 80,
|
||||||
|
param: 'reportType'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: '',
|
||||||
|
label: '时间范围',
|
||||||
|
dateType: 'datetimerange',
|
||||||
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
valueFormat: 'timestamp',
|
||||||
|
rangeSeparator: '-',
|
||||||
|
startPlaceholder: '开始时间',
|
||||||
|
endPlaceholder: '结束时间',
|
||||||
|
param: 'timeVal',
|
||||||
|
width: 350
|
||||||
|
},
|
||||||
|
{ type: 'button', btnName: '查询', name: 'search', color: 'primary' },
|
||||||
|
{ type: 'separate' },
|
||||||
|
{ type: 'button', btnName: '导出', name: 'export', color: 'warning' },
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '重置',
|
||||||
|
name: 'reset',
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// type: 'label', // 初始隐藏
|
||||||
|
// label: '刷新时间', // 自定义标识
|
||||||
|
// // slot: 'currentTimeSlot', // 自定义插槽名
|
||||||
|
// // width: 200, // 宽度适配
|
||||||
|
// },
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
tableProps() {
|
||||||
|
const props = [
|
||||||
{
|
{
|
||||||
prop: 'factoryName',
|
prop: 'factoryName',
|
||||||
label: '工厂',
|
label: '工厂',
|
||||||
@@ -233,6 +366,12 @@ const tableProps = [
|
|||||||
label: '产品工艺',
|
label: '产品工艺',
|
||||||
fixed: true
|
fixed: true
|
||||||
},
|
},
|
||||||
|
(this.isPeriodicReport ? {
|
||||||
|
prop: 'reportDate',
|
||||||
|
label: '日期',
|
||||||
|
fixed: true,
|
||||||
|
width: 120
|
||||||
|
} : ''),
|
||||||
{
|
{
|
||||||
prop: 'inputN',
|
prop: 'inputN',
|
||||||
label: '投入',
|
label: '投入',
|
||||||
@@ -378,158 +517,9 @@ const tableProps = [
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
return props
|
||||||
export default {
|
|
||||||
components: { barChart, ButtonNav, baseTableS },
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
urlOptions: { getDataListURL: getLineAuto },
|
|
||||||
listQuery: {
|
|
||||||
lineId: [],
|
|
||||||
pageSize: 10,
|
|
||||||
pageNo: 1,
|
|
||||||
total: 1,
|
|
||||||
timeType: 1 // 1-当天,2-自定义
|
|
||||||
},
|
},
|
||||||
reportTypeMap: {
|
|
||||||
1: '日报',
|
|
||||||
2: '周报',
|
|
||||||
3: '月报',
|
|
||||||
4: '年报'
|
|
||||||
},
|
|
||||||
activeLabel: 'table', // 当班数据tab
|
|
||||||
activeLabelDay: 'table', // 当天数据tab
|
|
||||||
fileName: '',
|
|
||||||
headFormValue:{},
|
|
||||||
dataListLoading: false,
|
|
||||||
tableProps,
|
|
||||||
factoryColumns: [],
|
|
||||||
factoryColumnsDay: [],
|
|
||||||
activeName: 'product',
|
|
||||||
tableBtn: [],
|
|
||||||
showData: [],
|
|
||||||
tableData: [],
|
|
||||||
tableData2: [], // 示例数据,实际从接口获取
|
|
||||||
productTableData: [],
|
|
||||||
productTableDataDay: [],
|
|
||||||
tableDataCustom: [],
|
|
||||||
list: [], // 折线图数据
|
|
||||||
timeTypeOptions: {
|
|
||||||
productLine: [ // 按产线监控(包含上一班)
|
|
||||||
{ id: 1, name: '当天' },
|
|
||||||
{ id: 2, name: '自定义' },
|
|
||||||
{ id: 3, name: '上一班' }
|
|
||||||
],
|
|
||||||
product: [ // 按产品监控(不含上一班)
|
|
||||||
{ id: 1, name: '当天' },
|
|
||||||
{ id: 2, name: '自定义' }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
formConfig: [
|
|
||||||
{
|
|
||||||
type: 'select',
|
|
||||||
label: '时间维度',
|
|
||||||
selectOptions: [
|
|
||||||
{ id: 1, name: '当天' },
|
|
||||||
{ id: 2, name: '自定义' },
|
|
||||||
{ id: 3, name: '上一班' }
|
|
||||||
],
|
|
||||||
width: 100,
|
|
||||||
onchange: true,
|
|
||||||
// defaultSelect: 1,
|
|
||||||
clearable: false,
|
|
||||||
param: 'timeType'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: '',
|
|
||||||
label: '查询类型',
|
|
||||||
selectOptions: [
|
|
||||||
{ id: 1, name: '统计数据' },
|
|
||||||
{ id: 2, name: '周期性汇总报表' }
|
|
||||||
],
|
|
||||||
width: 120,
|
|
||||||
onchange: true,
|
|
||||||
param: 'searchType'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'select',
|
|
||||||
label: '工厂',
|
|
||||||
selectOptions: [],
|
|
||||||
param: 'factoryId',
|
|
||||||
multiple: true,
|
|
||||||
onchange: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'select',
|
|
||||||
label: '产线',
|
|
||||||
selectOptions: [],
|
|
||||||
param: 'lineId',
|
|
||||||
multiple: true,
|
|
||||||
onchange: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: 'select',
|
|
||||||
label: '产品工艺',
|
|
||||||
selectOptions: [],
|
|
||||||
param: 'process',
|
|
||||||
multiple: true,
|
|
||||||
labelField: 'label',
|
|
||||||
valueField: 'label',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: '',
|
|
||||||
label: '产品类型',
|
|
||||||
selectOptions: [
|
|
||||||
{ id: 1, name: '面板' },
|
|
||||||
{ id: 2, name: '背板' },
|
|
||||||
],
|
|
||||||
multiple: true,
|
|
||||||
param: 'processType',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: '',
|
|
||||||
label: '报表类型',
|
|
||||||
selectOptions: [
|
|
||||||
{ id: 1, name: '日' },
|
|
||||||
{ id: 2, name: '周' },
|
|
||||||
{ id: 3, name: '月' },
|
|
||||||
{ id: 4, name: '年' }
|
|
||||||
],
|
|
||||||
onchange: true,
|
|
||||||
width: 80,
|
|
||||||
param: 'reportType'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: '',
|
|
||||||
label: '时间范围',
|
|
||||||
dateType: 'datetimerange',
|
|
||||||
format: 'yyyy-MM-dd HH:mm:ss',
|
|
||||||
valueFormat: 'timestamp',
|
|
||||||
rangeSeparator: '-',
|
|
||||||
startPlaceholder: '开始时间',
|
|
||||||
endPlaceholder: '结束时间',
|
|
||||||
param: 'timeVal',
|
|
||||||
width: 350
|
|
||||||
},
|
|
||||||
{ type: 'button', btnName: '查询', name: 'search', color: 'primary' },
|
|
||||||
{ type: 'separate' },
|
|
||||||
{ type: 'button', btnName: '导出', name: 'export', color: 'warning' },
|
|
||||||
{
|
|
||||||
type: 'button',
|
|
||||||
btnName: '重置',
|
|
||||||
name: 'reset',
|
|
||||||
},
|
|
||||||
// {
|
|
||||||
// type: 'label', // 初始隐藏
|
|
||||||
// label: '刷新时间', // 自定义标识
|
|
||||||
// // slot: 'currentTimeSlot', // 自定义插槽名
|
|
||||||
// // width: 200, // 宽度适配
|
|
||||||
// },
|
|
||||||
]
|
|
||||||
};
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
productTableProps() {
|
productTableProps() {
|
||||||
// 当班数据的完整表头(基础列 + 当班动态表头)
|
// 当班数据的完整表头(基础列 + 当班动态表头)
|
||||||
const baseColumns = [
|
const baseColumns = [
|
||||||
@@ -549,20 +539,33 @@ export default {
|
|||||||
prop: 'processType',
|
prop: 'processType',
|
||||||
label: '产品类型',
|
label: '产品类型',
|
||||||
filter: (val) => (val === 1 ? '面板' : '背板'),
|
filter: (val) => (val === 1 ? '面板' : '背板'),
|
||||||
fixed: true,
|
|
||||||
sortable: true,
|
sortable: true,
|
||||||
|
fixed: true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'factoryName',
|
prop: 'factoryName',
|
||||||
label: '工厂',
|
label: '工厂',
|
||||||
fixed: true
|
fixed: true
|
||||||
}
|
},
|
||||||
|
(this.isPeriodicReport ? {
|
||||||
|
prop: 'reportDate',
|
||||||
|
label: '日期',
|
||||||
|
fixed: true,
|
||||||
|
width: 120
|
||||||
|
} : ''),
|
||||||
];
|
];
|
||||||
return [...baseColumns, ...this.factoryColumns];
|
return [...baseColumns, ...this.factoryColumns];
|
||||||
},
|
},
|
||||||
productTablePropsDay() {
|
productTablePropsDay() {
|
||||||
// 当天数据的完整表头(基础列 + 当天动态表头)
|
// 当天数据的完整表头(基础列 + 当天动态表头)
|
||||||
const baseColumns = [
|
const baseColumns = [
|
||||||
|
{
|
||||||
|
prop: 'sizes',
|
||||||
|
label: '规格',
|
||||||
|
width: 105,
|
||||||
|
showOverflowtooltip: true,
|
||||||
|
fixed: true
|
||||||
|
},
|
||||||
{
|
{
|
||||||
prop: 'process',
|
prop: 'process',
|
||||||
label: '产品工艺',
|
label: '产品工艺',
|
||||||
@@ -579,7 +582,13 @@ export default {
|
|||||||
prop: 'factoryName',
|
prop: 'factoryName',
|
||||||
label: '工厂',
|
label: '工厂',
|
||||||
fixed: true
|
fixed: true
|
||||||
}
|
},
|
||||||
|
(this.isPeriodicReport ? {
|
||||||
|
prop: 'reportDate',
|
||||||
|
label: '日期',
|
||||||
|
fixed: true,
|
||||||
|
width: 120
|
||||||
|
} : ''),
|
||||||
];
|
];
|
||||||
return [...baseColumns, ...this.factoryColumnsDay];
|
return [...baseColumns, ...this.factoryColumnsDay];
|
||||||
}
|
}
|
||||||
@@ -702,60 +711,73 @@ export default {
|
|||||||
type: 'label',
|
type: 'label',
|
||||||
label: `刷新时间: ${this.formatCurrentTime()}`,
|
label: `刷新时间: ${this.formatCurrentTime()}`,
|
||||||
};
|
};
|
||||||
this.listQuery.timeType = 1;
|
this.listQuery.timeType = 3;
|
||||||
if (this.$refs.searchBarForm) {
|
if (this.$refs.searchBarForm) {
|
||||||
this.$refs.searchBarForm.formInline.timeType = 1;
|
this.$refs.searchBarForm.formInline.timeType = 3;
|
||||||
}
|
}
|
||||||
if (timeItemIndex > -1) {
|
if (timeItemIndex > -1) {
|
||||||
this.formConfig.splice(timeItemIndex, 1, timeLabel);
|
this.formConfig.splice(timeItemIndex, 1, timeLabel);
|
||||||
} else {
|
} else {
|
||||||
this.formConfig.push(timeLabel);
|
this.formConfig.push(timeLabel);
|
||||||
}
|
}
|
||||||
this.getProductList();
|
this.getProductLastList();
|
||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// 导出表格
|
// 导出表格(改为async方法,支持await调用)
|
||||||
handleExport() {
|
async handleExport() {
|
||||||
// 按产线监控
|
// 按产线监控
|
||||||
if (this.activeName === 'productLine') {
|
if (this.activeName === 'productLine') {
|
||||||
if (this.listQuery.timeType === 1) {
|
if (this.listQuery.timeType === 1) {
|
||||||
// 产线-当天:导出当班 + 当天两个表格(自定义汇总文件名)
|
// 产线-当天:导出当班 + 当天两个表格(自定义汇总文件名)
|
||||||
this.exportMultipleTables([
|
await this.exportMultipleTables([
|
||||||
{ ref: 'lineCurrentShiftTable', name: '产线监控_当班数据' },
|
{ ref: 'lineCurrentShiftTable', name: '产线监控_当班数据' },
|
||||||
{ ref: 'lineTodayTable', name: '产线监控_当天数据' }
|
{ ref: 'lineTodayTable', name: '产线监控_当天数据' }
|
||||||
], '产线监控_当班及当天数据汇总'); // 传入自定义汇总文件名
|
], '产线监控_当班及当天数据汇总'); // 传入自定义汇总文件名
|
||||||
} else if (this.listQuery.timeType === 1) {
|
} else if (this.listQuery.timeType === 3) {
|
||||||
// 产线-当天:导出当班 + 当天两个表格(自定义汇总文件名)
|
// 修复:注释错误,原为“产线-当天”,实际是“产线-上一班”
|
||||||
this.exportMultipleTables([
|
// 产线-上一班:导出单个表格
|
||||||
{ ref: 'lineCurrentShiftTable', name: '产线监控_上一班数据' },
|
await this.exportSingleTable('lineCustomTable', '产线监控_上一班时间数据');
|
||||||
{ ref: 'lineTodayTable', name: '产线监控_当天数据' }
|
|
||||||
], '产线监控_当班及当天数据汇总'); // 传入自定义汇总文件名
|
|
||||||
} else {
|
} else {
|
||||||
// 产线-自定义:导出一个表格(自定义文件名)
|
// 产线-自定义:导出一个表格(自定义文件名)
|
||||||
this.exportSingleTable('lineCustomTable', '产线监控_自定义时间数据');
|
await this.exportSingleTable('lineCustomTable', '产线监控_自定义时间数据');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 按产品监控
|
// 按产品监控
|
||||||
else {
|
else {
|
||||||
if (this.listQuery.timeType === 1) {
|
if (this.listQuery.timeType === 1) {
|
||||||
// 产品-当天:导出当班 + 当天两个表格(自定义汇总文件名)
|
// 产品-当天:导出当班 + 当天两个表格(自定义汇总文件名)
|
||||||
this.exportMultipleTables([
|
await this.exportMultipleTables([
|
||||||
{ ref: 'productCurrentShiftTable', name: '产品监控_当班数据' },
|
{ ref: 'productCurrentShiftTable', name: '产品监控_当班数据' },
|
||||||
{ ref: 'productTodayTable', name: '产品监控_当天数据' }
|
{ ref: 'productCurrentShiftTable', name: '产品监控_当天数据' }
|
||||||
], '产品监控_当班及当天数据汇总'); // 传入自定义汇总文件名
|
], '产品监控_当班及当天数据汇总'); // 传入自定义汇总文件名
|
||||||
|
} else if (this.listQuery.timeType === 3) {
|
||||||
|
// 修复:注释错误,原为“产线-当天”,实际是“产品-上一班”
|
||||||
|
// 产品-上一班:导出单个表格
|
||||||
|
await this.exportSingleTable('productCustomTable', '产品监控_上一班时间数据');
|
||||||
} else {
|
} else {
|
||||||
// 产品-自定义:导出一个表格(自定义文件名)
|
// 产品-自定义:导出一个表格(自定义文件名)
|
||||||
this.exportSingleTable('productCustomTable', '产品监控_自定义时间数据');
|
await this.exportSingleTable('productCustomTable', '产品监控_自定义时间数据');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// 导出单个表格(保持原有逻辑,文件名由调用方传入,已区分不同场景)
|
// 导出单个表格(改为async方法,使用await获取DOM)
|
||||||
exportSingleTable(refName, fileName) {
|
async exportSingleTable(refName, fileName) {
|
||||||
const table = this.getTableDom(refName);
|
try {
|
||||||
if (!table) return;
|
// 关键修复:使用await等待getTableDom返回DOM元素(而非Promise)
|
||||||
|
const table = await this.getTableDom(refName);
|
||||||
|
if (!table) {
|
||||||
|
this.$message.warning(`无法导出:${refName}表格DOM获取失败`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确认table是原生DOM元素后再调用cloneNode
|
||||||
|
if (!(table instanceof HTMLElement)) {
|
||||||
|
this.$message.error(`无法导出:${refName}表格不是合法的DOM元素`);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const clonedTable = table.cloneNode(true);
|
const clonedTable = table.cloneNode(true);
|
||||||
this.adjustTableForExport(clonedTable);
|
this.adjustTableForExport(clonedTable);
|
||||||
@@ -763,16 +785,31 @@ export default {
|
|||||||
const workbook = XLSX.utils.table_to_book(clonedTable);
|
const workbook = XLSX.utils.table_to_book(clonedTable);
|
||||||
const fullName = `${fileName}_${this.formatDate()}.xlsx`;
|
const fullName = `${fileName}_${this.formatDate()}.xlsx`;
|
||||||
XLSX.writeFile(workbook, fullName);
|
XLSX.writeFile(workbook, fullName);
|
||||||
|
} catch (error) {
|
||||||
|
this.$message.error(`导出表格失败:${error.message}`);
|
||||||
|
console.error('单个表格导出错误:', error);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
// 导出多个表格(新增自定义汇总文件名参数,适配不同选项卡)
|
// 导出多个表格(改为async方法,使用await获取DOM)
|
||||||
exportMultipleTables(tables, customSummaryName) {
|
async exportMultipleTables(tables, customSummaryName) {
|
||||||
|
try {
|
||||||
const workbook = XLSX.utils.book_new();
|
const workbook = XLSX.utils.book_new();
|
||||||
let hasValidTable = false;
|
let hasValidTable = false;
|
||||||
|
|
||||||
tables.forEach(({ ref, name }) => {
|
// 遍历表格配置,使用await获取每个表格的DOM
|
||||||
const table = this.getTableDom(ref);
|
for (const { ref, name } of tables) { // 改用for...of循环,支持await
|
||||||
if (!table) return;
|
const table = await this.getTableDom(ref);
|
||||||
|
if (!table) {
|
||||||
|
this.$message.warning(`${ref}表格DOM获取失败,跳过该表格`);
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 确认table是原生DOM元素
|
||||||
|
if (!(table instanceof HTMLElement)) {
|
||||||
|
this.$message.warning(`${ref}表格不是合法的DOM元素,跳过该表格`);
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
|
||||||
hasValidTable = true;
|
hasValidTable = true;
|
||||||
const clonedTable = table.cloneNode(true);
|
const clonedTable = table.cloneNode(true);
|
||||||
@@ -780,30 +817,65 @@ export default {
|
|||||||
|
|
||||||
const worksheet = XLSX.utils.table_to_sheet(clonedTable);
|
const worksheet = XLSX.utils.table_to_sheet(clonedTable);
|
||||||
XLSX.utils.book_append_sheet(workbook, worksheet, name);
|
XLSX.utils.book_append_sheet(workbook, worksheet, name);
|
||||||
});
|
}
|
||||||
|
|
||||||
if (!hasValidTable) {
|
if (!hasValidTable) {
|
||||||
this.$message.warning('未找到有效表格数据');
|
this.$message.warning('未找到有效表格数据,导出失败');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 动态生成汇总文件名:自定义名称 + 日期
|
// 动态生成汇总文件名:自定义名称 + 日期
|
||||||
const fullName = `${customSummaryName}_${this.formatDate()}.xlsx`;
|
const fullName = `${customSummaryName}_${this.formatDate()}.xlsx`;
|
||||||
XLSX.writeFile(workbook, fullName);
|
XLSX.writeFile(workbook, fullName);
|
||||||
|
} catch (error) {
|
||||||
|
this.$message.error(`导出多个表格失败:${error.message}`);
|
||||||
|
console.error('多个表格导出错误:', error);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 辅助方法:获取表格DOM元素(包含表头)
|
|
||||||
getTableDom(refName) {
|
/**
|
||||||
|
* 获取表格DOM元素(支持异步重试)
|
||||||
|
* @param {string} refName - 表格的ref名称
|
||||||
|
* @param {number} retryCount - 当前重试次数(内部使用,外部调用无需传参)
|
||||||
|
* @returns {Promise<HTMLElement|null>} 表格DOM元素Promise
|
||||||
|
*/
|
||||||
|
async getTableDom(refName, retryCount = 0) {
|
||||||
|
// 1. 配置常量,便于维护
|
||||||
|
const maxRetry = 5; // 最大重试次数
|
||||||
|
const retryDelay = 300; // 每次重试延迟时间(ms)
|
||||||
|
|
||||||
|
// 2. 设置激活标签,确保重试时也能执行该逻辑
|
||||||
|
this.activeLabel = 'table';
|
||||||
|
this.activeLabelDay = 'table';
|
||||||
|
// 若需调试,可保留日志
|
||||||
|
// console.log(`[getTableDom-${refName}] activeLabel:`, this.activeLabel, 'activeLabelDay:', this.activeLabelDay);
|
||||||
|
|
||||||
|
// 3. 获取表格组件
|
||||||
const tableComponent = this.$refs[refName];
|
const tableComponent = this.$refs[refName];
|
||||||
|
|
||||||
|
// 4. 表格组件不存在时,处理重试逻辑
|
||||||
if (!tableComponent) {
|
if (!tableComponent) {
|
||||||
this.$message.warning(`未找到${refName}表格`);
|
// 达到最大重试次数,返回失败
|
||||||
|
if (retryCount >= maxRetry) {
|
||||||
|
this.$message.warning(`未找到${refName}表格,已达到最大重试次数(${maxRetry}次)`);
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
// 获取完整表格容器(包含表头和表体)
|
|
||||||
|
// 未达到最大重试次数,延迟后重试
|
||||||
|
this.$message.warning(`未找到${refName}表格,将进行第${retryCount + 1}次重试...`);
|
||||||
|
await new Promise(resolve => setTimeout(resolve, retryDelay));
|
||||||
|
// 递归调用并返回结果
|
||||||
|
return this.getTableDom(refName, retryCount + 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 5. 获取完整表格容器(包含表头和表体)
|
||||||
const tableContainer = tableComponent.$el.querySelector('.el-table');
|
const tableContainer = tableComponent.$el.querySelector('.el-table');
|
||||||
if (!tableContainer) {
|
if (!tableContainer) {
|
||||||
this.$message.warning(`${refName}表格数据为空`);
|
this.$message.warning(`${refName}表格容器不存在(可能表格数据为空)`);
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 6. 成功获取表格DOM,返回结果
|
||||||
return tableContainer;
|
return tableContainer;
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -868,7 +940,7 @@ export default {
|
|||||||
if (mainTable && allHeaderRows.length > 0) {
|
if (mainTable && allHeaderRows.length > 0) {
|
||||||
const newThead = document.createElement('thead');
|
const newThead = document.createElement('thead');
|
||||||
// 按层级添加表头行
|
// 按层级添加表头行
|
||||||
allHeaderRows.forEach(cells => {
|
allHeaderRows.forEach((cells, rowIndex) => {
|
||||||
const newTr = document.createElement('tr');
|
const newTr = document.createElement('tr');
|
||||||
cells.forEach(cell => {
|
cells.forEach(cell => {
|
||||||
// 复制单元格(避免DOM残留引用问题)
|
// 复制单元格(避免DOM残留引用问题)
|
||||||
@@ -879,6 +951,18 @@ export default {
|
|||||||
});
|
});
|
||||||
// 将新表头插入主表体最前面
|
// 将新表头插入主表体最前面
|
||||||
mainTable.insertBefore(newThead, mainTable.firstChild);
|
mainTable.insertBefore(newThead, mainTable.firstChild);
|
||||||
|
|
||||||
|
// ================ 新增:修改第一列表头为“序号” ================
|
||||||
|
// 找到第一层级的第一个表头单元格(<th>)
|
||||||
|
const firstHeaderCell = newThead.querySelector('tr:first-child th:first-child');
|
||||||
|
if (firstHeaderCell) {
|
||||||
|
// 清空原有内容,设置为“序号”
|
||||||
|
firstHeaderCell.innerHTML = ''; // 清空原有内容(包括子元素)
|
||||||
|
firstHeaderCell.textContent = '序号'; // 设置纯文本“序号”(更稳定)
|
||||||
|
// 可选:添加样式(如居中,根据需求调整)
|
||||||
|
// firstHeaderCell.style.textAlign = 'center';
|
||||||
|
}
|
||||||
|
// =============================================================
|
||||||
}
|
}
|
||||||
|
|
||||||
// 7. 合并固定列数据到主表体(仅处理tbody数据)
|
// 7. 合并固定列数据到主表体(仅处理tbody数据)
|
||||||
@@ -909,6 +993,23 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// ================ 可选优化:为tbody第一列添加序号数字 ================
|
||||||
|
// 如果表格体的第一列原本无数据,可补充1、2、3...的序号
|
||||||
|
if (mainTable) {
|
||||||
|
const tbodyRows = mainTable.querySelectorAll('tbody tr');
|
||||||
|
tbodyRows.forEach((row, index) => {
|
||||||
|
const firstTd = row.querySelector('td:first-child');
|
||||||
|
if (firstTd) {
|
||||||
|
// 清空原有内容,设置为序号(index+1,因为索引从0开始)
|
||||||
|
firstTd.innerHTML = '';
|
||||||
|
firstTd.textContent = index + 1;
|
||||||
|
// 可选:居中显示
|
||||||
|
// firstTd.style.textAlign = 'center';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// =============================================================
|
||||||
},
|
},
|
||||||
|
|
||||||
// 辅助方法:格式化日期(用于文件名)
|
// 辅助方法:格式化日期(用于文件名)
|
||||||
@@ -924,7 +1025,9 @@ export default {
|
|||||||
},
|
},
|
||||||
// 获取产线和工厂列表
|
// 获取产线和工厂列表
|
||||||
getPdLineList() {
|
getPdLineList() {
|
||||||
getPdList().then(res => {
|
getPLlistByFactory({
|
||||||
|
factoryIds: this.listQuery.factoryIds
|
||||||
|
}).then(res => {
|
||||||
this.formConfig[3].selectOptions = res.data || [];
|
this.formConfig[3].selectOptions = res.data || [];
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -1071,9 +1174,13 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.getDataList();
|
this.getDataList();
|
||||||
}
|
}
|
||||||
|
} else {
|
||||||
|
if (this.listQuery.timeType === 3) {
|
||||||
|
this.getProductLastList();
|
||||||
} else {
|
} else {
|
||||||
this.getProductList();
|
this.getProductList();
|
||||||
}
|
}
|
||||||
|
}
|
||||||
break;
|
break;
|
||||||
case 'export':
|
case 'export':
|
||||||
this.handleExport();
|
this.handleExport();
|
||||||
@@ -1162,6 +1269,9 @@ export default {
|
|||||||
|
|
||||||
// 格式化数据:lineDetList提取到外层,键名加lineId前缀
|
// 格式化数据:lineDetList提取到外层,键名加lineId前缀
|
||||||
const formatData = (rawList) => {
|
const formatData = (rawList) => {
|
||||||
|
if (!Array.isArray(rawList) || rawList.length === 0) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
return rawList.map(item => {
|
return rawList.map(item => {
|
||||||
// 解构出 lineDetList 和其他字段(rest)
|
// 解构出 lineDetList 和其他字段(rest)
|
||||||
const { lineDetList = [], ...rest } = item;
|
const { lineDetList = [], ...rest } = item;
|
||||||
@@ -1210,6 +1320,9 @@ export default {
|
|||||||
|
|
||||||
// 格式化数据:lineDetList提取到外层,键名加lineId前缀
|
// 格式化数据:lineDetList提取到外层,键名加lineId前缀
|
||||||
const formatData = (rawList) => {
|
const formatData = (rawList) => {
|
||||||
|
if (!Array.isArray(rawList) || rawList.length === 0) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
return rawList.map(item => {
|
return rawList.map(item => {
|
||||||
// 解构出 lineDetList 和其他字段(rest)
|
// 解构出 lineDetList 和其他字段(rest)
|
||||||
const { lineDetList = [], ...rest } = item;
|
const { lineDetList = [], ...rest } = item;
|
||||||
@@ -1270,7 +1383,72 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
async getProductLastList() {
|
||||||
|
console.log('last');
|
||||||
|
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.listQuery.pageSize = 10;
|
||||||
|
this.listQuery.factoryId = this.headFormValue.factoryId || []
|
||||||
|
this.listQuery.process = this.headFormValue.process ? this.headFormValue.process : [];
|
||||||
|
this.listQuery.lineId = undefined;
|
||||||
|
this.listQuery.processType = this.headFormValue.processType ? this.headFormValue.processType : [];
|
||||||
|
this.listQuery.reportType = this.headFormValue.reportType || undefined;
|
||||||
|
this.listQuery.timeType = this.headFormValue.timeType ? this.headFormValue.timeType : this.listQuery.timeType;
|
||||||
|
this.listQuery.searchType = this.headFormValue.searchType || undefined
|
||||||
|
if (this.listQuery.timeType === 3) {
|
||||||
|
const resGroup = await getProcessAutoReportLastGroup(this.listQuery);
|
||||||
|
console.log('resGroup', resGroup);
|
||||||
|
|
||||||
|
// 格式化数据:lineDetList提取到外层,键名加lineId前缀
|
||||||
|
const formatData = (rawList) => {
|
||||||
|
if (!Array.isArray(rawList) || rawList.length === 0) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
return rawList.map(item => {
|
||||||
|
// 解构出 lineDetList 和其他字段(rest)
|
||||||
|
const { lineDetList = [], ...rest } = item;
|
||||||
|
|
||||||
|
// 遍历 lineDetList 中的每一项,逐个格式化并合并
|
||||||
|
const formattedLineData = lineDetList.reduce((acc, lineData) => {
|
||||||
|
// 取当前 lineData 的 lineId 作为前缀(确保存在,否则用空字符串)
|
||||||
|
const lineIdPrefix = lineData.lineId ? String(lineData.lineId) : '';
|
||||||
|
|
||||||
|
// 为当前 lineData 的每个字段添加 lineId 前缀,合并到累加器中
|
||||||
|
Object.entries(lineData).forEach(([key, value]) => {
|
||||||
|
const newKey = lineIdPrefix ? `${lineIdPrefix}${key}` : key;
|
||||||
|
acc[newKey] = value;
|
||||||
|
});
|
||||||
|
|
||||||
|
return acc;
|
||||||
|
}, {}); // 初始值为空对象
|
||||||
|
|
||||||
|
// 合并外层字段和所有格式化后的 lineDetList 字段
|
||||||
|
return { ...rest, ...formattedLineData };
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 处理当班和当天数据(分别存储)
|
||||||
|
this.productTableData = formatData(resGroup.data.list); // 当班数据
|
||||||
|
console.log(this.productTableData, 'productTableData');
|
||||||
|
|
||||||
|
// --------------------------
|
||||||
|
// 生成当班数据的动态表头
|
||||||
|
// --------------------------
|
||||||
|
const groupLineDatas = [];
|
||||||
|
resGroup.data.list.forEach(item => {
|
||||||
|
if (item.lineDetList && item.lineDetList.length) {
|
||||||
|
groupLineDatas.push(...item.lineDetList);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// 去重当班数据的产线(按lineId)
|
||||||
|
const uniqueGroupLines = Array.from(
|
||||||
|
new Map(groupLineDatas.map(line => [line.lineId, line])).values()
|
||||||
|
);
|
||||||
|
// 生成当班数据的表头(一级:产线名,二级:指标)
|
||||||
|
this.factoryColumns = this.generateLineColumns(uniqueGroupLines);
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
// 生成动态表头:一级为产线名,二级为产线数据指标
|
// 生成动态表头:一级为产线名,二级为产线数据指标
|
||||||
generateLineColumns(lines) {
|
generateLineColumns(lines) {
|
||||||
// lines为去重后的产线列表(单个元素为一条产线数据)
|
// lines为去重后的产线列表(单个元素为一条产线数据)
|
||||||
@@ -1366,8 +1544,8 @@ export default {
|
|||||||
},
|
},
|
||||||
// 为当天时调用的接口
|
// 为当天时调用的接口
|
||||||
getLastDayDataList() {
|
getLastDayDataList() {
|
||||||
getPdlAutoReportNewSearchLastGroup().then((response) => {
|
getPdlAutoReportNewSearchLastGroup(this.listQuery).then((response) => {
|
||||||
this.tableData = response.data.classData.map((item, index) => {
|
this.tableDataCustom = response.data.classData.map((item, index) => {
|
||||||
item.originalLossNum = item.original?.lossNum;
|
item.originalLossNum = item.original?.lossNum;
|
||||||
item.originalLossArea = item.original?.lossArea;
|
item.originalLossArea = item.original?.lossArea;
|
||||||
item.edgeLossNum = item.edge?.lossNum;
|
item.edgeLossNum = item.edge?.lossNum;
|
||||||
@@ -1388,7 +1566,7 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
getDayDataList() {
|
getDayDataList() {
|
||||||
getPdlAutoReportNewSearchNow().then((response) => {
|
getPdlAutoReportNewSearchNow(this.listQuery).then((response) => {
|
||||||
this.tableData = response.data.classData.map((item, index) => {
|
this.tableData = response.data.classData.map((item, index) => {
|
||||||
item.originalLossNum = item.original?.lossNum;
|
item.originalLossNum = item.original?.lossNum;
|
||||||
item.originalLossArea = item.original?.lossArea;
|
item.originalLossArea = item.original?.lossArea;
|
||||||
@@ -1452,6 +1630,44 @@ export default {
|
|||||||
// 搜索栏下拉选择变化
|
// 搜索栏下拉选择变化
|
||||||
handleSearchBarChanged({ param, value }) {
|
handleSearchBarChanged({ param, value }) {
|
||||||
if (param === 'timeType') {
|
if (param === 'timeType') {
|
||||||
|
this.isPeriodicReport = false
|
||||||
|
this.tableData2 = []
|
||||||
|
this.tableDataCustom = []
|
||||||
|
this.tableData = []
|
||||||
|
const resetCommon = () => {
|
||||||
|
// 重置搜索表单的筛选条件
|
||||||
|
if (this.$refs.searchBarForm) {
|
||||||
|
const form = this.$refs.searchBarForm.formInline;
|
||||||
|
form.timeVal = undefined;
|
||||||
|
form.timeType = 1;
|
||||||
|
form.reportType = undefined;
|
||||||
|
form.searchType = undefined;
|
||||||
|
form.lineId = undefined;
|
||||||
|
form.factoryId = undefined;
|
||||||
|
form.process = undefined;
|
||||||
|
form.processType = undefined;
|
||||||
|
}
|
||||||
|
// 重置查询参数
|
||||||
|
this.listQuery = {
|
||||||
|
...this.listQuery, // 保留分页等基础参数
|
||||||
|
factoryId: undefined,
|
||||||
|
process: undefined,
|
||||||
|
lineId: undefined,
|
||||||
|
processType: undefined,
|
||||||
|
reportType: undefined,
|
||||||
|
timeType: 1,
|
||||||
|
searchType: undefined,
|
||||||
|
startTime: undefined,
|
||||||
|
endTime: undefined
|
||||||
|
};
|
||||||
|
// 重置表单配置中公共隐藏的项
|
||||||
|
this.formConfig[1].type = ''; // 隐藏查询类型
|
||||||
|
this.formConfig[6].type = ''; // 隐藏报表类型
|
||||||
|
this.formConfig[7].type = ''; // 隐藏时间范围
|
||||||
|
};
|
||||||
|
|
||||||
|
// 3. 执行公共重置
|
||||||
|
resetCommon();
|
||||||
this.listQuery.timeType = value;
|
this.listQuery.timeType = value;
|
||||||
const timeItemIndex = this.formConfig.findIndex(item =>
|
const timeItemIndex = this.formConfig.findIndex(item =>
|
||||||
item.label?.includes('刷新时间')
|
item.label?.includes('刷新时间')
|
||||||
@@ -1482,15 +1698,59 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
} else if (param === 'searchType') {
|
} else if (param === 'searchType') {
|
||||||
|
this.isPeriodicReport = value === 2;
|
||||||
|
if (this.$refs.searchBarForm && this.$refs.searchBarForm.formInline) {
|
||||||
|
const formInline = this.$refs.searchBarForm.formInline;
|
||||||
|
formInline.reportType = ''
|
||||||
|
// 精准判断:只有字段存在时,才置为undefined(不存在则不处理)
|
||||||
|
if ('timeVal' in formInline) {
|
||||||
|
formInline.timeVal = undefined;
|
||||||
|
}
|
||||||
|
if ('timeValWeek' in formInline) {
|
||||||
|
formInline.timeValWeek = undefined;
|
||||||
|
}
|
||||||
|
if ('timeValMonth' in formInline) {
|
||||||
|
formInline.timeValMonth = undefined;
|
||||||
|
}
|
||||||
|
if ('timeValYear' in formInline) {
|
||||||
|
formInline.timeValYear = undefined;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// const formInline = this.$refs.searchBarForm.formInline;
|
||||||
|
this.listQuery.startTime = undefined
|
||||||
|
this.listQuery.endTime = undefined
|
||||||
|
console.log(this.listQuery, 'list');
|
||||||
if (value === 1) {
|
if (value === 1) {
|
||||||
// 统计数据:显示时间范围,隐藏报表类型
|
// 统计数据:显示时间范围,隐藏报表类型
|
||||||
this.formConfig[7].type = 'datePicker';
|
this.formConfig[7] = {
|
||||||
|
type: 'datePicker',
|
||||||
|
label: '时间范围',
|
||||||
|
dateType: 'datetimerange',
|
||||||
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
valueFormat: 'timestamp',
|
||||||
|
rangeSeparator: '-',
|
||||||
|
startPlaceholder: '开始时间',
|
||||||
|
endPlaceholder: '结束时间',
|
||||||
|
param: 'timeVal',
|
||||||
|
width: 350
|
||||||
|
};
|
||||||
this.formConfig[6].type = '';
|
this.formConfig[6].type = '';
|
||||||
this.$refs.searchBarForm.formInline.timeVal = undefined;
|
|
||||||
} else {
|
} else {
|
||||||
// 周期性报表:显示报表类型,隐藏时间范围
|
// 周期性报表:显示报表类型,隐藏时间范围
|
||||||
this.formConfig[6].type = 'select';
|
this.formConfig[6].type = 'select';
|
||||||
this.formConfig[7].type = 'datePicker';
|
this.formConfig[7] = {
|
||||||
|
type: 'datePicker',
|
||||||
|
label: '时间范围',
|
||||||
|
dateType: 'datetimerange',
|
||||||
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
|
valueFormat: 'timestamp',
|
||||||
|
rangeSeparator: '-',
|
||||||
|
startPlaceholder: '开始时间',
|
||||||
|
endPlaceholder: '结束时间',
|
||||||
|
param: 'timeVal',
|
||||||
|
width: 350
|
||||||
|
};
|
||||||
}
|
}
|
||||||
} else if (param === 'reportType') {
|
} else if (param === 'reportType') {
|
||||||
if (this.$refs.searchBarForm && this.$refs.searchBarForm.formInline) {
|
if (this.$refs.searchBarForm && this.$refs.searchBarForm.formInline) {
|
||||||
@@ -1568,7 +1828,9 @@ export default {
|
|||||||
// 切换工厂时刷新产线列表
|
// 切换工厂时刷新产线列表
|
||||||
this.listQuery.lineId = [];
|
this.listQuery.lineId = [];
|
||||||
this.$refs.searchBarForm.formInline.lineId = undefined;
|
this.$refs.searchBarForm.formInline.lineId = undefined;
|
||||||
getPdList(value).then(res => {
|
getPLlistByFactory({
|
||||||
|
factoryIds: value
|
||||||
|
}).then(res => {
|
||||||
this.formConfig[3].selectOptions = res.data || [];
|
this.formConfig[3].selectOptions = res.data || [];
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -101,7 +101,7 @@ const tableProps = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
prop: 'thick',
|
prop: 'thick',
|
||||||
label: '玻璃长度/mm'
|
label: '玻璃厚度/mm'
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|||||||
@@ -358,8 +358,8 @@ export default {
|
|||||||
handleExport() {
|
handleExport() {
|
||||||
// 处理查询参数
|
// 处理查询参数
|
||||||
let params = { ...this.listQuery };
|
let params = { ...this.listQuery };
|
||||||
params.pageNo = undefined;
|
// params.pageNo = undefined;
|
||||||
params.pageSize = undefined;
|
// params.pageSize = undefined;
|
||||||
this.$modal.confirm('是否确认导出下片日志?').then(() => {
|
this.$modal.confirm('是否确认导出下片日志?').then(() => {
|
||||||
this.exportLoading = true;
|
this.exportLoading = true;
|
||||||
return exportDownLogData(params);
|
return exportDownLogData(params);
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -216,7 +216,7 @@ import {
|
|||||||
import { getTree } from '@/api/base/equipment';
|
import { getTree } from '@/api/base/equipment';
|
||||||
import { getEquipmentTypePage } from '@/api/base/equipmentType';
|
import { getEquipmentTypePage } from '@/api/base/equipmentType';
|
||||||
import { getEquipmentOverall } from '@/api/base/equipment';
|
import { getEquipmentOverall } from '@/api/base/equipment';
|
||||||
|
import { getTenantId } from '@/utils/auth'
|
||||||
// import * as XLSX from 'xlsx';
|
// import * as XLSX from 'xlsx';
|
||||||
// import FileSaver from 'file-saver';
|
// import FileSaver from 'file-saver';
|
||||||
import ButtonNav from '@/components/ButtonNav';
|
import ButtonNav from '@/components/ButtonNav';
|
||||||
@@ -569,7 +569,7 @@ export default {
|
|||||||
const token = getAccessToken();
|
const token = getAccessToken();
|
||||||
const headers = new Headers({
|
const headers = new Headers({
|
||||||
Authorization: `Bearer ${token}`,
|
Authorization: `Bearer ${token}`,
|
||||||
'tenant-id': store.getters.userId,
|
'tenant-id': getTenantId(),
|
||||||
'Content-Type': 'text/event-stream',
|
'Content-Type': 'text/event-stream',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -34,28 +34,7 @@ export default {
|
|||||||
mixins: [basicPageMixin],
|
mixins: [basicPageMixin],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// tableBtn: [
|
|
||||||
// this.$auth.hasPermi('base:quality-inspection-type:update')
|
|
||||||
// ? {
|
|
||||||
// type: 'edit',
|
|
||||||
// btnName: '修改',
|
|
||||||
// }
|
|
||||||
// : undefined,
|
|
||||||
// this.$auth.hasPermi('base:quality-inspection-type:delete')
|
|
||||||
// ? {
|
|
||||||
// type: 'delete',
|
|
||||||
// btnName: '删除',
|
|
||||||
// }
|
|
||||||
// : undefined,
|
|
||||||
// ].filter((v) => v),
|
|
||||||
tableProps: [
|
tableProps: [
|
||||||
// {
|
|
||||||
// prop: 'createTime',
|
|
||||||
// label: '添加时间',
|
|
||||||
// fixed: true,
|
|
||||||
// width: 180,
|
|
||||||
// filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
|
||||||
// },
|
|
||||||
{ prop: 'factoryName', label: '工厂' },
|
{ prop: 'factoryName', label: '工厂' },
|
||||||
{ prop: 'lineName', label: '产线' },
|
{ prop: 'lineName', label: '产线' },
|
||||||
{ prop: 'remark', label: '玻璃编号' },
|
{ prop: 'remark', label: '玻璃编号' },
|
||||||
@@ -74,42 +53,7 @@ export default {
|
|||||||
},
|
},
|
||||||
{ prop: 'reason', label: '判等原因' },
|
{ prop: 'reason', label: '判等原因' },
|
||||||
{ prop: 'specifications', label: '规格' },
|
{ prop: 'specifications', label: '规格' },
|
||||||
|
|
||||||
|
|
||||||
// {
|
|
||||||
// label: '操作',
|
|
||||||
// alignt: 'center',
|
|
||||||
// subcomponent: {
|
|
||||||
// render: function (h) {
|
|
||||||
// return h('div', null, [
|
|
||||||
// h(
|
|
||||||
// 'el-button',
|
|
||||||
// {
|
|
||||||
// props: {
|
|
||||||
// icon: 'el-icon-edit',
|
|
||||||
// size: 'mini',
|
|
||||||
// type: 'text',
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// ' 修改'
|
|
||||||
// ),
|
|
||||||
// h(
|
|
||||||
// 'el-button',
|
|
||||||
// {
|
|
||||||
// props: {
|
|
||||||
// icon: 'el-icon-edit',
|
|
||||||
// size: 'mini',
|
|
||||||
// type: 'text',
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// ' 修改'
|
|
||||||
// ),
|
|
||||||
// ]);
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
// },
|
|
||||||
],
|
],
|
||||||
//
|
|
||||||
searchBarFormConfig: [
|
searchBarFormConfig: [
|
||||||
{
|
{
|
||||||
type: 'select',
|
type: 'select',
|
||||||
@@ -135,13 +79,13 @@ export default {
|
|||||||
label: '时间范围',
|
label: '时间范围',
|
||||||
dateType: 'datetimerange',
|
dateType: 'datetimerange',
|
||||||
format: 'yyyy-MM-dd HH:mm:ss',
|
format: 'yyyy-MM-dd HH:mm:ss',
|
||||||
// valueFormat: 'timestamp',
|
valueFormat: 'timestamp',
|
||||||
valueFormat: 'yyyy-MM-dd HH:mm:ss',
|
|
||||||
rangeSeparator: '-',
|
rangeSeparator: '-',
|
||||||
startPlaceholder: '开始时间',
|
startPlaceholder: '开始时间',
|
||||||
endPlaceholder: '结束时间',
|
endPlaceholder: '结束时间',
|
||||||
param: 'timeVal',
|
param: 'timeVal',
|
||||||
width: 350
|
width: 350,
|
||||||
|
defaultSelect: [],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: 'button',
|
||||||
@@ -149,23 +93,9 @@ export default {
|
|||||||
name: 'search',
|
name: 'search',
|
||||||
color: 'primary',
|
color: 'primary',
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// type: 'button',
|
|
||||||
// btnName: '重置',
|
|
||||||
// name: 'reset',
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
type: 'separate',
|
type: 'separate',
|
||||||
},
|
},
|
||||||
// {
|
|
||||||
// type: this.$auth.hasPermi('base:quality-inspection-type:create')
|
|
||||||
// ? 'button'
|
|
||||||
// : '',
|
|
||||||
// btnName: '新增',
|
|
||||||
// name: 'add',
|
|
||||||
// plain: true,
|
|
||||||
// color: 'success',
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
type: this.$auth.hasPermi('base:quality-inspection-type:export')
|
type: this.$auth.hasPermi('base:quality-inspection-type:export')
|
||||||
? 'button'
|
? 'button'
|
||||||
@@ -215,11 +145,55 @@ export default {
|
|||||||
// deep: true
|
// deep: true
|
||||||
// },
|
// },
|
||||||
// },
|
// },
|
||||||
created() {
|
mounted() {
|
||||||
|
const { startTimestamp, endTimestamp } = this.getThreeDaysAgoThisTimeToNowTimeStamps();
|
||||||
|
// 找到时间范围的配置项并赋值(对应你代码中的timeVal参数)
|
||||||
|
this.searchBarFormConfig[3].defaultSelect = [startTimestamp, endTimestamp]; // 赋值给日期选择器
|
||||||
|
this.queryParams.startTime = startTimestamp;
|
||||||
|
this.queryParams.endTime = endTimestamp;
|
||||||
this.getList();
|
this.getList();
|
||||||
this.getDict()
|
this.getDict()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
getThreeDaysAgoThisTimeToNowTimeStamps() {
|
||||||
|
const now = new Date();
|
||||||
|
// 1. 计算三天前的当前时刻(使用setDate直接修改日期,保留时分秒等信息)
|
||||||
|
const threeDaysAgoThisTime = new Date(now); // 复制当前日期对象,避免修改原对象
|
||||||
|
threeDaysAgoThisTime.setDate(threeDaysAgoThisTime.getDate() - 3); // 日期减3天,时分秒保持和当前一致
|
||||||
|
|
||||||
|
// 2. 获取时间戳(毫秒级和秒级)
|
||||||
|
// 开始时间戳:三天前的当前时刻
|
||||||
|
const startTimestamp = threeDaysAgoThisTime.getTime(); // 毫秒级
|
||||||
|
const startTimestampSec = Math.floor(startTimestamp / 1000); // 秒级
|
||||||
|
// 结束时间戳:当前时刻
|
||||||
|
const endTimestamp = now.getTime(); // 毫秒级
|
||||||
|
const endTimestampSec = Math.floor(endTimestamp / 1000); // 秒级
|
||||||
|
|
||||||
|
// 封装日期格式化函数,转换为yyyy-MM-dd HH:mm:ss格式
|
||||||
|
const formatDateTime = (date) => {
|
||||||
|
const y = date.getFullYear();
|
||||||
|
// 月份是从0开始的,所以要+1;补零确保是两位
|
||||||
|
const m = String(date.getMonth() + 1).padStart(2, '0');
|
||||||
|
const d = String(date.getDate()).padStart(2, '0');
|
||||||
|
const h = String(date.getHours()).padStart(2, '0');
|
||||||
|
const min = String(date.getMinutes()).padStart(2, '0');
|
||||||
|
const s = String(date.getSeconds()).padStart(2, '0');
|
||||||
|
return `${y}-${m}-${d} ${h}:${min}:${s}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 格式化后的字符串:三天前的当前时刻 和 当前时刻
|
||||||
|
const startDateTimeStr = formatDateTime(threeDaysAgoThisTime);
|
||||||
|
const endDateTimeStr = formatDateTime(now);
|
||||||
|
|
||||||
|
return {
|
||||||
|
startTimestamp, // 三天前当前时刻的毫秒级时间戳
|
||||||
|
endTimestamp, // 当前时刻的毫秒级时间戳
|
||||||
|
startTimestampSec, // 三天前当前时刻的秒级时间戳
|
||||||
|
endTimestampSec, // 当前时刻的秒级时间戳
|
||||||
|
startDateTimeStr, // yyyy-MM-dd HH:mm:ss格式的开始时间字符串
|
||||||
|
endDateTimeStr // yyyy-MM-dd HH:mm:ss格式的结束时间字符串
|
||||||
|
};
|
||||||
|
},
|
||||||
getDict() {
|
getDict() {
|
||||||
getPdList().then(res => {
|
getPdList().then(res => {
|
||||||
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
||||||
@@ -250,11 +224,6 @@ export default {
|
|||||||
this.queryParams.startTime = btn.timeVal ? btn.timeVal[0] : undefined
|
this.queryParams.startTime = btn.timeVal ? btn.timeVal[0] : undefined
|
||||||
this.queryParams.endTime = btn.timeVal ? btn.timeVal[1] : undefined
|
this.queryParams.endTime = btn.timeVal ? btn.timeVal[1] : undefined
|
||||||
this.queryParams.checkNum = btn.checkNum ? btn.checkNum : undefined
|
this.queryParams.checkNum = btn.checkNum ? btn.checkNum : undefined
|
||||||
|
|
||||||
|
|
||||||
// keys.forEach((key) => {
|
|
||||||
// this.queryParams[key] = btn[key] || null;
|
|
||||||
// });
|
|
||||||
this.getList();
|
this.getList();
|
||||||
break;
|
break;
|
||||||
case 'add':
|
case 'add':
|
||||||
@@ -263,10 +232,6 @@ export default {
|
|||||||
case 'export':
|
case 'export':
|
||||||
this.handleExport();
|
this.handleExport();
|
||||||
break;
|
break;
|
||||||
// case 'reset':
|
|
||||||
// this.$refs['search-bar'].resetForm();
|
|
||||||
// this.resetQuery();
|
|
||||||
// break;
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
/** 查询列表 */
|
/** 查询列表 */
|
||||||
|
|||||||
@@ -150,7 +150,8 @@ export default {
|
|||||||
startPlaceholder: '开始时间',
|
startPlaceholder: '开始时间',
|
||||||
endPlaceholder: '结束时间',
|
endPlaceholder: '结束时间',
|
||||||
param: 'timeVal',
|
param: 'timeVal',
|
||||||
width: 350
|
width: 350,
|
||||||
|
defaultSelect: [],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: 'button',
|
||||||
@@ -226,11 +227,56 @@ export default {
|
|||||||
// deep: true
|
// deep: true
|
||||||
// },
|
// },
|
||||||
// },
|
// },
|
||||||
created() {
|
mounted() {
|
||||||
|
|
||||||
|
const { startTimestamp, endTimestamp } = this.getThreeDaysAgoThisTimeToNowTimeStamps();
|
||||||
|
// 找到时间范围的配置项并赋值(对应你代码中的timeVal参数)
|
||||||
|
this.searchBarFormConfig[2].defaultSelect = [startTimestamp, endTimestamp]; // 赋值给日期选择器
|
||||||
|
this.queryParams.startTime = startTimestamp;
|
||||||
|
this.queryParams.endTime = endTimestamp;
|
||||||
this.getList();
|
this.getList();
|
||||||
this.getDict()
|
this.getDict()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
getThreeDaysAgoThisTimeToNowTimeStamps() {
|
||||||
|
const now = new Date();
|
||||||
|
// 1. 计算三天前的当前时刻(使用setDate直接修改日期,保留时分秒等信息)
|
||||||
|
const threeDaysAgoThisTime = new Date(now); // 复制当前日期对象,避免修改原对象
|
||||||
|
threeDaysAgoThisTime.setDate(threeDaysAgoThisTime.getDate() - 3); // 日期减3天,时分秒保持和当前一致
|
||||||
|
|
||||||
|
// 2. 获取时间戳(毫秒级和秒级)
|
||||||
|
// 开始时间戳:三天前的当前时刻
|
||||||
|
const startTimestamp = threeDaysAgoThisTime.getTime(); // 毫秒级
|
||||||
|
const startTimestampSec = Math.floor(startTimestamp / 1000); // 秒级
|
||||||
|
// 结束时间戳:当前时刻
|
||||||
|
const endTimestamp = now.getTime(); // 毫秒级
|
||||||
|
const endTimestampSec = Math.floor(endTimestamp / 1000); // 秒级
|
||||||
|
|
||||||
|
// 封装日期格式化函数,转换为yyyy-MM-dd HH:mm:ss格式
|
||||||
|
const formatDateTime = (date) => {
|
||||||
|
const y = date.getFullYear();
|
||||||
|
// 月份是从0开始的,所以要+1;补零确保是两位
|
||||||
|
const m = String(date.getMonth() + 1).padStart(2, '0');
|
||||||
|
const d = String(date.getDate()).padStart(2, '0');
|
||||||
|
const h = String(date.getHours()).padStart(2, '0');
|
||||||
|
const min = String(date.getMinutes()).padStart(2, '0');
|
||||||
|
const s = String(date.getSeconds()).padStart(2, '0');
|
||||||
|
return `${y}-${m}-${d} ${h}:${min}:${s}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 格式化后的字符串:三天前的当前时刻 和 当前时刻
|
||||||
|
const startDateTimeStr = formatDateTime(threeDaysAgoThisTime);
|
||||||
|
const endDateTimeStr = formatDateTime(now);
|
||||||
|
|
||||||
|
return {
|
||||||
|
startTimestamp, // 三天前当前时刻的毫秒级时间戳
|
||||||
|
endTimestamp, // 当前时刻的毫秒级时间戳
|
||||||
|
startTimestampSec, // 三天前当前时刻的秒级时间戳
|
||||||
|
endTimestampSec, // 当前时刻的秒级时间戳
|
||||||
|
startDateTimeStr, // yyyy-MM-dd HH:mm:ss格式的开始时间字符串
|
||||||
|
endDateTimeStr // yyyy-MM-dd HH:mm:ss格式的结束时间字符串
|
||||||
|
};
|
||||||
|
},
|
||||||
getDict() {
|
getDict() {
|
||||||
getPdList().then(res => {
|
getPdList().then(res => {
|
||||||
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
||||||
|
|||||||
@@ -98,8 +98,8 @@ export default {
|
|||||||
|
|
||||||
init(data) {
|
init(data) {
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
this.factoryName = data.factoryName || '';
|
this.factoryName = data.factoryName || '未知工厂';
|
||||||
this.lineName = data.lineName || '';
|
this.lineName = data.lineName || '未知产线';
|
||||||
|
|
||||||
if (data.startTime && data.endTime) {
|
if (data.startTime && data.endTime) {
|
||||||
const start = moment(data.startTime).format('yyyy-MM-DD HH:mm:ss');
|
const start = moment(data.startTime).format('yyyy-MM-DD HH:mm:ss');
|
||||||
|
|||||||
@@ -152,7 +152,8 @@ export default {
|
|||||||
startPlaceholder: '开始时间',
|
startPlaceholder: '开始时间',
|
||||||
endPlaceholder: '结束时间',
|
endPlaceholder: '结束时间',
|
||||||
param: 'timeVal',
|
param: 'timeVal',
|
||||||
width: 350
|
width: 350,
|
||||||
|
defaultSelect: [],
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: 'button',
|
type: 'button',
|
||||||
@@ -225,11 +226,56 @@ export default {
|
|||||||
// deep: true
|
// deep: true
|
||||||
// },
|
// },
|
||||||
// },
|
// },
|
||||||
created() {
|
mounted() {
|
||||||
|
|
||||||
|
const { startTimestamp, endTimestamp } = this.getThreeDaysAgoThisTimeToNowTimeStamps();
|
||||||
|
// 找到时间范围的配置项并赋值(对应你代码中的timeVal参数)
|
||||||
|
this.searchBarFormConfig[2].defaultSelect = [startTimestamp, endTimestamp]; // 赋值给日期选择器
|
||||||
|
this.queryParams.startTime = startTimestamp;
|
||||||
|
this.queryParams.endTime = endTimestamp;
|
||||||
this.getList();
|
this.getList();
|
||||||
this.getDict()
|
this.getDict()
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
getThreeDaysAgoThisTimeToNowTimeStamps() {
|
||||||
|
const now = new Date();
|
||||||
|
// 1. 计算三天前的当前时刻(使用setDate直接修改日期,保留时分秒等信息)
|
||||||
|
const threeDaysAgoThisTime = new Date(now); // 复制当前日期对象,避免修改原对象
|
||||||
|
threeDaysAgoThisTime.setDate(threeDaysAgoThisTime.getDate() - 3); // 日期减3天,时分秒保持和当前一致
|
||||||
|
|
||||||
|
// 2. 获取时间戳(毫秒级和秒级)
|
||||||
|
// 开始时间戳:三天前的当前时刻
|
||||||
|
const startTimestamp = threeDaysAgoThisTime.getTime(); // 毫秒级
|
||||||
|
const startTimestampSec = Math.floor(startTimestamp / 1000); // 秒级
|
||||||
|
// 结束时间戳:当前时刻
|
||||||
|
const endTimestamp = now.getTime(); // 毫秒级
|
||||||
|
const endTimestampSec = Math.floor(endTimestamp / 1000); // 秒级
|
||||||
|
|
||||||
|
// 封装日期格式化函数,转换为yyyy-MM-dd HH:mm:ss格式
|
||||||
|
const formatDateTime = (date) => {
|
||||||
|
const y = date.getFullYear();
|
||||||
|
// 月份是从0开始的,所以要+1;补零确保是两位
|
||||||
|
const m = String(date.getMonth() + 1).padStart(2, '0');
|
||||||
|
const d = String(date.getDate()).padStart(2, '0');
|
||||||
|
const h = String(date.getHours()).padStart(2, '0');
|
||||||
|
const min = String(date.getMinutes()).padStart(2, '0');
|
||||||
|
const s = String(date.getSeconds()).padStart(2, '0');
|
||||||
|
return `${y}-${m}-${d} ${h}:${min}:${s}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 格式化后的字符串:三天前的当前时刻 和 当前时刻
|
||||||
|
const startDateTimeStr = formatDateTime(threeDaysAgoThisTime);
|
||||||
|
const endDateTimeStr = formatDateTime(now);
|
||||||
|
|
||||||
|
return {
|
||||||
|
startTimestamp, // 三天前当前时刻的毫秒级时间戳
|
||||||
|
endTimestamp, // 当前时刻的毫秒级时间戳
|
||||||
|
startTimestampSec, // 三天前当前时刻的秒级时间戳
|
||||||
|
endTimestampSec, // 当前时刻的秒级时间戳
|
||||||
|
startDateTimeStr, // yyyy-MM-dd HH:mm:ss格式的开始时间字符串
|
||||||
|
endDateTimeStr // yyyy-MM-dd HH:mm:ss格式的结束时间字符串
|
||||||
|
};
|
||||||
|
},
|
||||||
getDict() {
|
getDict() {
|
||||||
getPdList().then(res => {
|
getPdList().then(res => {
|
||||||
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
this.searchBarFormConfig[1].selectOptions = res.data || [];
|
||||||
|
|||||||
Reference in New Issue
Block a user