projects/mes-zjl #384
4
.env.dev
4
.env.dev
@ -14,9 +14,9 @@ VUE_APP_TITLE = MES系统
|
||||
# 芋道管理系统/开发环境
|
||||
# VUE_APP_BASE_API = 'http://100.64.0.26:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.0.33:48082'
|
||||
VUE_APP_BASE_API = 'http://192.168.1.164:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.164:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.2.173:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.49:48082'
|
||||
VUE_APP_BASE_API = 'http://192.168.1.81:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.8:48082'
|
||||
# VUE_APP_BASE_API = 'http://192.168.4.159:48080'
|
||||
# VUE_APP_BASE_API = 'http://192.168.1.56:48082'
|
||||
|
||||
@ -1,218 +1,215 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
|
||||
<!-- 搜索工作栏 -->
|
||||
<search-bar
|
||||
:formConfigs="formConfig"
|
||||
ref="searchBarForm"
|
||||
@headBtnClick="buttonClick"
|
||||
/>
|
||||
<!-- 列表 -->
|
||||
<base-table
|
||||
:page="queryParams.pageNo"
|
||||
:limit="queryParams.pageSize"
|
||||
:table-props="tableProps"
|
||||
:table-data="list"
|
||||
:max-height="tableH"
|
||||
>
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="80"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick"
|
||||
/>
|
||||
</base-table>
|
||||
<pagination
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
:total="total"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<!-- 新增 -->
|
||||
<base-dialog
|
||||
:dialogTitle="addOrEditTitle"
|
||||
:dialogVisible="centervisible"
|
||||
@cancel="handleCancel"
|
||||
@confirm="handleConfirm"
|
||||
:before-close="handleCancel"
|
||||
>
|
||||
<energy-plc-add ref="energyPlc" @successSubmit="successSubmit" />
|
||||
</base-dialog>
|
||||
</div>
|
||||
<div class="app-container">
|
||||
<!-- 搜索工作栏 -->
|
||||
<search-bar
|
||||
:formConfigs="formConfig"
|
||||
ref="searchBarForm"
|
||||
@headBtnClick="buttonClick" />
|
||||
<!-- 列表 -->
|
||||
<base-table
|
||||
:page="queryParams.pageNo"
|
||||
:limit="queryParams.pageSize"
|
||||
:table-props="tableProps"
|
||||
:table-data="list"
|
||||
:max-height="tableH">
|
||||
<method-btn
|
||||
v-if="tableBtn.length"
|
||||
slot="handleBtn"
|
||||
:width="80"
|
||||
label="操作"
|
||||
:method-list="tableBtn"
|
||||
@clickBtn="handleClick" />
|
||||
</base-table>
|
||||
<pagination
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
:total="total"
|
||||
@pagination="getList" />
|
||||
<!-- 新增 -->
|
||||
<base-dialog
|
||||
:dialogTitle="addOrEditTitle"
|
||||
:dialogVisible="centervisible"
|
||||
@cancel="handleCancel"
|
||||
@confirm="handleConfirm"
|
||||
:before-close="handleCancel">
|
||||
<energy-plc-add ref="energyPlc" @successSubmit="successSubmit" />
|
||||
</base-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getEnergyPlcPage, deleteEnergyPlc } from "@/api/base/energyPlc";
|
||||
import { getEnergyPlcPage, deleteEnergyPlc } from '@/api/base/energyPlc';
|
||||
// import { publicFormatter } from '@/utils/dict'
|
||||
import EnergyPlcAdd from './components/energyPlcAdd.vue'
|
||||
import EnergyPlcAdd from './components/energyPlcAdd.vue';
|
||||
import tableHeightMixin from '@/mixins/tableHeightMixin';
|
||||
const tableProps = [
|
||||
{
|
||||
prop: 'plcTableName',
|
||||
label: '关联表名'
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: '关联表编码',
|
||||
minWidth: 150,
|
||||
showOverflowtooltip: true
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
label: '标识名'
|
||||
},
|
||||
{
|
||||
prop: 'enName',
|
||||
label: '英文标识名'
|
||||
},
|
||||
{
|
||||
prop: 'collection',
|
||||
label: '是否采集'
|
||||
},
|
||||
{
|
||||
prop: 'description',
|
||||
label: '描述',
|
||||
showOverflowtooltip: true
|
||||
}
|
||||
]
|
||||
{
|
||||
prop: 'plcTableName',
|
||||
label: '关联表名',
|
||||
},
|
||||
{
|
||||
prop: 'code',
|
||||
label: '关联表编码',
|
||||
minWidth: 150,
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'name',
|
||||
label: '标识名',
|
||||
},
|
||||
{
|
||||
prop: 'enName',
|
||||
label: '英文标识名',
|
||||
},
|
||||
{
|
||||
prop: 'collection',
|
||||
label: '是否采集',
|
||||
},
|
||||
{
|
||||
prop: 'description',
|
||||
label: '描述',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
];
|
||||
export default {
|
||||
name: "EnergyPlc",
|
||||
components: { EnergyPlcAdd },
|
||||
data() {
|
||||
return {
|
||||
formConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: '标识名',
|
||||
placeholder: '标识名',
|
||||
param: 'name'
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '查询',
|
||||
name: 'search',
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
type: 'separate'
|
||||
},
|
||||
{
|
||||
type: this.$auth.hasPermi('base:energy-plc:create') ? 'button' : '',
|
||||
btnName: '新增',
|
||||
name: 'add',
|
||||
color: 'success',
|
||||
plain: true
|
||||
}
|
||||
],
|
||||
tableProps,
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('base:energy-plc:update')
|
||||
? {
|
||||
type: 'edit',
|
||||
btnName: '编辑'
|
||||
}
|
||||
: undefined,
|
||||
this.$auth.hasPermi('base:energy-plc:delete')
|
||||
? {
|
||||
type: 'delete',
|
||||
btnName: '删除'
|
||||
}
|
||||
: undefined
|
||||
].filter((v) => v),
|
||||
tableH: this.tableHeight(260),
|
||||
collectionList: [
|
||||
{value: 0,label: '否'},
|
||||
{value: 1,label: '是'}
|
||||
],
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 班次基础信息列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
addOrEditTitle: "",
|
||||
// 是否显示弹出层
|
||||
centervisible: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 20,
|
||||
name: null
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.tableH = this.tableHeight(260)
|
||||
})
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
case 'search':
|
||||
this.queryParams.pageNo = 1;
|
||||
this.queryParams.name = val.name
|
||||
this.getList()
|
||||
break
|
||||
default:
|
||||
this.addOrEditTitle = '新增'
|
||||
this.centervisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.energyPlc.init()
|
||||
})
|
||||
}
|
||||
},
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
getEnergyPlcPage(this.queryParams).then(response => {
|
||||
let arr = response.data.list || [];
|
||||
arr&&arr.map(item => {
|
||||
this.collectionList.map(i => {
|
||||
if (item.collection === i.value) {
|
||||
item.collection = i.label
|
||||
}
|
||||
})
|
||||
})
|
||||
this.list = arr
|
||||
this.total = response.data.total;
|
||||
});
|
||||
},
|
||||
handleClick(val) {
|
||||
switch (val.type) {
|
||||
case 'edit':
|
||||
this.addOrEditTitle = '编辑'
|
||||
this.$nextTick(() => {
|
||||
this.$refs.energyPlc.init(val.data.id)
|
||||
})
|
||||
this.centervisible = true
|
||||
break
|
||||
default:
|
||||
this.handleDelete(val.data)
|
||||
}
|
||||
},
|
||||
handleCancel() {
|
||||
this.$refs.energyPlc.formClear()
|
||||
this.centervisible = false
|
||||
this.addOrEditTitle = ''
|
||||
},
|
||||
handleConfirm() {
|
||||
this.$refs.energyPlc.submitForm()
|
||||
},
|
||||
successSubmit() {
|
||||
this.handleCancel()
|
||||
this.getList()
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$modal.confirm('是否确认删除关联表名为"' + row.name + '"的数据项?').then(function() {
|
||||
return deleteEnergyPlc(row.id);
|
||||
}).then(() => {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {});
|
||||
}
|
||||
}
|
||||
name: 'EnergyPlc',
|
||||
components: { EnergyPlcAdd },
|
||||
mixins: [tableHeightMixin],
|
||||
data() {
|
||||
return {
|
||||
formConfig: [
|
||||
{
|
||||
type: 'input',
|
||||
label: '标识名',
|
||||
placeholder: '标识名',
|
||||
param: 'name',
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
btnName: '查询',
|
||||
name: 'search',
|
||||
color: 'primary',
|
||||
},
|
||||
{
|
||||
type: 'separate',
|
||||
},
|
||||
{
|
||||
type: this.$auth.hasPermi('base:energy-plc:create') ? 'button' : '',
|
||||
btnName: '新增',
|
||||
name: 'add',
|
||||
color: 'success',
|
||||
plain: true,
|
||||
},
|
||||
],
|
||||
tableProps,
|
||||
tableBtn: [
|
||||
this.$auth.hasPermi('base:energy-plc:update')
|
||||
? {
|
||||
type: 'edit',
|
||||
btnName: '编辑',
|
||||
}
|
||||
: undefined,
|
||||
this.$auth.hasPermi('base:energy-plc:delete')
|
||||
? {
|
||||
type: 'delete',
|
||||
btnName: '删除',
|
||||
}
|
||||
: undefined,
|
||||
].filter((v) => v),
|
||||
collectionList: [
|
||||
{ value: 0, label: '否' },
|
||||
{ value: 1, label: '是' },
|
||||
],
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 班次基础信息列表
|
||||
list: [],
|
||||
// 弹出层标题
|
||||
addOrEditTitle: '',
|
||||
// 是否显示弹出层
|
||||
centervisible: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNo: 1,
|
||||
pageSize: 20,
|
||||
name: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
buttonClick(val) {
|
||||
switch (val.btnName) {
|
||||
case 'search':
|
||||
this.queryParams.pageNo = 1;
|
||||
this.queryParams.name = val.name;
|
||||
this.getList();
|
||||
break;
|
||||
default:
|
||||
this.addOrEditTitle = '新增';
|
||||
this.centervisible = true;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.energyPlc.init();
|
||||
});
|
||||
}
|
||||
},
|
||||
/** 查询列表 */
|
||||
getList() {
|
||||
getEnergyPlcPage(this.queryParams).then((response) => {
|
||||
let arr = response.data.list || [];
|
||||
arr &&
|
||||
arr.map((item) => {
|
||||
this.collectionList.map((i) => {
|
||||
if (item.collection === i.value) {
|
||||
item.collection = i.label;
|
||||
}
|
||||
});
|
||||
});
|
||||
this.list = arr;
|
||||
this.total = response.data.total;
|
||||
});
|
||||
},
|
||||
handleClick(val) {
|
||||
switch (val.type) {
|
||||
case 'edit':
|
||||
this.addOrEditTitle = '编辑';
|
||||
this.$nextTick(() => {
|
||||
this.$refs.energyPlc.init(val.data.id);
|
||||
});
|
||||
this.centervisible = true;
|
||||
break;
|
||||
default:
|
||||
this.handleDelete(val.data);
|
||||
}
|
||||
},
|
||||
handleCancel() {
|
||||
this.$refs.energyPlc.formClear();
|
||||
this.centervisible = false;
|
||||
this.addOrEditTitle = '';
|
||||
},
|
||||
handleConfirm() {
|
||||
this.$refs.energyPlc.submitForm();
|
||||
},
|
||||
successSubmit() {
|
||||
this.handleCancel();
|
||||
this.getList();
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
this.$modal
|
||||
.delConfirm(row.name)
|
||||
.then(function () {
|
||||
return deleteEnergyPlc(row.id);
|
||||
})
|
||||
.then(() => {
|
||||
this.queryParams.pageNo = 1;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess('删除成功');
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
649
src/views/quality/currentData copy/index.vue
Normal file
649
src/views/quality/currentData copy/index.vue
Normal file
@ -0,0 +1,649 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 搜索工作栏 -->
|
||||
<!-- 列表 -->
|
||||
<el-row>
|
||||
<el-col class="custom-tabs">
|
||||
<el-tabs
|
||||
v-model="activeName"
|
||||
:stretch="true"
|
||||
@tab-click="handleTabClick">
|
||||
<el-tab-pane :label="'\u2002表格数据\u2002'" name="table">
|
||||
<!-- 列表 -->
|
||||
<div class="blue-title">
|
||||
产品名：{{ productDetail.name }} 产品规格：{{
|
||||
productDetail.specifications
|
||||
}}
|
||||
</div>
|
||||
<base-table
|
||||
class="base-table__margin"
|
||||
:table-props="productProps"
|
||||
:page="1"
|
||||
:limit="10"
|
||||
:table-data="list"></base-table>
|
||||
<div v-for="(item, index) in downProps" :key="index">
|
||||
<div class="blue-title">
|
||||
工单名称:{{ list[index].workOrderName }}
|
||||
</div>
|
||||
<base-table
|
||||
class="base-table__margin"
|
||||
:table-props="item"
|
||||
:page="1"
|
||||
:limit="10"
|
||||
:table-data="downList[index]"></base-table>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u3000图形数据\u3000'"
|
||||
name="chart"
|
||||
style="overflow: inherit">
|
||||
<SearchBar
|
||||
:formConfigs="searchBarFormConfig"
|
||||
ref="search-bar"
|
||||
@headBtnClick="handleSearchBarBtnClick" />
|
||||
<div id="main" style="height: 500px; width: 1000px"></div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 分页组件 -->
|
||||
<!-- <pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList" /> -->
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<!-- <base-dialog
|
||||
:dialogTitle="title"
|
||||
:dialogVisible="open"
|
||||
width="50%"
|
||||
@close="cancel"
|
||||
@cancel="cancel"
|
||||
@confirm="submitForm">
|
||||
<DialogForm v-if="open" ref="form" v-model="form" />
|
||||
</base-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getInspectionData,
|
||||
getProductList,
|
||||
getWorkOrderList,
|
||||
} from '@/api/monitoring/statisticalData';
|
||||
// import Editor from '@/components/Editor';
|
||||
import moment from 'moment';
|
||||
// import DialogForm from './dialogForm.vue';
|
||||
import * as echarts from 'echarts';
|
||||
// import basicPageMixin from '@/mixins/lb/basicPageMixin';
|
||||
export default {
|
||||
name: 'statisticalData',
|
||||
// components: {
|
||||
// DialogForm,
|
||||
// },
|
||||
// mixins: [basicPageMixin],
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
dynamicProps: [],
|
||||
downProps: [],
|
||||
downList: [],
|
||||
productDetail: {
|
||||
name: null,
|
||||
specifications: null,
|
||||
},
|
||||
activeName: 'table',
|
||||
searchBarFormConfig: [
|
||||
{
|
||||
type: 'label',
|
||||
label: '当前检测数据柱状图',
|
||||
// placeholder: '请选择工单号',
|
||||
// param: 'workOrderId',
|
||||
// selectOptions: [],
|
||||
},
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: '产品',
|
||||
// placeholder: '请选择产品',
|
||||
// param: 'productionId',
|
||||
// selectOptions: [],
|
||||
// },
|
||||
// {
|
||||
// type: 'input',
|
||||
// label: '检测内容',
|
||||
// placeholder: '请输入检测内容',
|
||||
// param: 'inspectionDetContent',
|
||||
// },
|
||||
// {
|
||||
// type: 'datePicker',
|
||||
// label: '时间段',
|
||||
// dateType: 'daterange', // datetimerange
|
||||
// // format: 'yyyy-MM-dd HH:mm:ss',
|
||||
// format: 'yyyy-MM-dd',
|
||||
// valueFormat: 'timestamp',
|
||||
// rangeSeparator: '-',
|
||||
// startPlaceholder: '开始日期',
|
||||
// endPlaceholder: '结束日期',
|
||||
// defaultTime: ['00:00:00', '23:59:59'],
|
||||
// param: 'checkTime',
|
||||
// // width: 350,
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: '查询',
|
||||
// name: 'search',
|
||||
// color: 'primary',
|
||||
// },
|
||||
// {
|
||||
// type: 'separate',
|
||||
// },
|
||||
// // {
|
||||
// // type: this.$auth.hasPermi(
|
||||
// // 'base:quality-inspection-record:create'
|
||||
// // )
|
||||
// // ? 'button'
|
||||
// // : '',
|
||||
// // btnName: '新增',
|
||||
// // name: 'add',
|
||||
// // plain: true,
|
||||
// // color: 'success',
|
||||
// // },
|
||||
],
|
||||
// tableBtn: [
|
||||
// this.$auth.hasPermi('base:quality-inspection-record:update')
|
||||
// ? {
|
||||
// type: 'edit',
|
||||
// btnName: '修改',
|
||||
// }
|
||||
// : undefined,
|
||||
// this.$auth.hasPermi('base:quality-inspection-record:delete')
|
||||
// ? {
|
||||
// type: 'delete',
|
||||
// btnName: '删除',
|
||||
// }
|
||||
// : undefined,
|
||||
// ].filter((v) => v),
|
||||
// tableProps: [
|
||||
// {
|
||||
// prop: 'createTime',
|
||||
// label: '添加时间',
|
||||
// fixed: true,
|
||||
// width: 180,
|
||||
// filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'inspectionDetContent',
|
||||
// label: '检测内容',
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'lineName',
|
||||
// label: '产线',
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'checkPerson',
|
||||
// label: '检测人员',
|
||||
// },
|
||||
// {
|
||||
// // width: 160,
|
||||
// prop: 'checkTime',
|
||||
// label: '检测时间',
|
||||
// filter: (val) =>
|
||||
// val != null ? moment(val).format('yyyy-MM-DD HH:mm:ss') : '-',
|
||||
// },
|
||||
// {
|
||||
// width: 90,
|
||||
// prop: 'source',
|
||||
// label: '来源',
|
||||
// filter: (val) => ['未知', '手动', '自动'][val],
|
||||
// },
|
||||
// ],
|
||||
// 搜索框需要的 keys, 与上面 queryParams 的除 pageNo, pageSize 之外的 key 一一对应
|
||||
|
||||
// searchBarKeys: ['inspectionDetContent', 'checkTime', 'productionLineId'],
|
||||
// form: {
|
||||
// id: undefined,
|
||||
// inspectionDetId: undefined,
|
||||
// inspectionDetContent: undefined,
|
||||
// productionLineId: undefined,
|
||||
// sectionId: undefined,
|
||||
// checkPerson: undefined,
|
||||
// checkTime: undefined,
|
||||
// source: undefined,
|
||||
// explainText: undefined,
|
||||
// remark: undefined,
|
||||
// },
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
workOrderId: undefined,
|
||||
productId: undefined,
|
||||
startTime: undefined,
|
||||
endTime: undefined,
|
||||
// productionLineId: null,
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
// this.getProductLineList();
|
||||
},
|
||||
computed: {
|
||||
productProps() {
|
||||
return [
|
||||
{
|
||||
// width: 160,
|
||||
prop: 'workOrderName',
|
||||
label: '工单名称',
|
||||
},
|
||||
...this.dynamicProps,
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumInput',
|
||||
label: '上片总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumOutput',
|
||||
label: '下片总数',
|
||||
// subcomponent: {
|
||||
// name: 'TextOnly',
|
||||
// props: {
|
||||
// injectData: {
|
||||
// type: Object,
|
||||
// default: () => ({}),
|
||||
// },
|
||||
// },
|
||||
// data() {
|
||||
// return {
|
||||
// text: '比例',
|
||||
// };
|
||||
// },
|
||||
// methods: {
|
||||
// handleEmit(payload) {
|
||||
// console.log('handleEmit', payload);
|
||||
// },
|
||||
// },
|
||||
// render(h) {
|
||||
// return h('el-button', { props: { type: 'text' } }, this.text);
|
||||
// },
|
||||
// },
|
||||
},
|
||||
];
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (this.$route.params.startTime && this.$route.params.endTime) {
|
||||
this.searchBarFormConfig[0].defaultSelect = [
|
||||
this.$route.params.startTime,
|
||||
this.$route.params.endTime,
|
||||
];
|
||||
this.queryParams.param = {};
|
||||
this.$set(
|
||||
this.queryParams.param,
|
||||
'startTime',
|
||||
this.$route.params.startTime
|
||||
);
|
||||
this.$set(this.queryParams.param, 'endTime', this.$route.params.endTime);
|
||||
} else {
|
||||
this.searchBarFormConfig[0].defaultSelect = [];
|
||||
}
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
handleTabClick() {
|
||||
if (this.activeName === 'chart') {
|
||||
var chartDom = document.getElementById('main');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
let arrXAxis = [];
|
||||
this.list.forEach((ele) => {
|
||||
arrXAxis.push(ele.workOrderName);
|
||||
});
|
||||
this.downList.forEach((ele) => {
|
||||
ele.forEach((item) => {
|
||||
if (ele.length !== 0 && item.productionline) {
|
||||
arrXAxis.push('产线' + item.productionline);
|
||||
}
|
||||
});
|
||||
});
|
||||
let arrYAxis = [];
|
||||
this.list.forEach((ele) => {
|
||||
// console.log(ele);
|
||||
arrYAxis.push(ele.sumInput);
|
||||
});
|
||||
this.downList.forEach((ele) => {
|
||||
ele.forEach((item) => {
|
||||
console.log(item);
|
||||
// if (ele.length !== 0 && item.productionline) {
|
||||
arrYAxis.push(item.sumInput);
|
||||
// }
|
||||
});
|
||||
});
|
||||
// console.log(arrXAxis);
|
||||
option = {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: arrXAxis,
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: arrYAxis,
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
barWidth: '20',
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top',
|
||||
},
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.2)',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
}
|
||||
},
|
||||
/** 获取搜索栏的产线列表 */
|
||||
// async getDict() {
|
||||
// const res = await getProductList()
|
||||
// const result = await getWorkOrderList()
|
||||
// console.log(res);
|
||||
// this.searchBarFormConfig[1].selectOptions = res.data.map((item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id:item.id
|
||||
// }
|
||||
// })
|
||||
// this.searchBarFormConfig[0].selectOptions = result.data.map((item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id: item.id
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getProductLineList() {
|
||||
// this.$axios('/base/production-line/listAll').then((response) => {
|
||||
// this.searchBarFormConfig[0].selectOptions = response.data.map(
|
||||
// (item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id: item.id,
|
||||
// };
|
||||
// }
|
||||
// );
|
||||
// });
|
||||
// },
|
||||
getList() {
|
||||
this.getDataList();
|
||||
// this.getDict()
|
||||
},
|
||||
/** 查询列表 */
|
||||
async getDataList() {
|
||||
this.loading = true;
|
||||
// 执行查询
|
||||
this.downProps = [];
|
||||
const res = await getInspectionData(this.queryParams);
|
||||
console.log(res);
|
||||
this.productDetail.name = res.data[0].productName;
|
||||
this.productDetail.specifications = res.data[0].specifications;
|
||||
// this.productName = res.data[0].productName
|
||||
this.dynamicProps = this.filterNameData(res.data[0].upPart.nameData);
|
||||
console.log(this.dynamicProps);
|
||||
this.list = this.filterData(res.data[0].upPart.data);
|
||||
console.log(this.list);
|
||||
res.data[0].downPart.forEach((ele) => {
|
||||
// console.log(ele.data);
|
||||
let arr = this.downFilterNameData(ele.nameData);
|
||||
if (arr.length !== 0) {
|
||||
let propArr = [
|
||||
{
|
||||
// width: 160,
|
||||
prop: 'inspectionContent',
|
||||
label: '检测内容',
|
||||
},
|
||||
...arr,
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumInput',
|
||||
label: '原片总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumScrap',
|
||||
label: '未通过检测总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'scrapRatio',
|
||||
label: '报废比例',
|
||||
},
|
||||
];
|
||||
this.downProps.push(propArr);
|
||||
}
|
||||
// this.downProps = []
|
||||
});
|
||||
res.data[0].downPart.forEach((ele) => {
|
||||
// console.log(ele.data);
|
||||
let arr = this.downFilterData(ele.data);
|
||||
if (arr.length !== 0) {
|
||||
this.downList.push(arr);
|
||||
}
|
||||
// this.downProps = []
|
||||
});
|
||||
|
||||
// console.log(this.downList);
|
||||
},
|
||||
downFilterNameData(nameData) {
|
||||
const ndSet = new Set();
|
||||
nameData.forEach((nd) => {
|
||||
ndSet.add(nd.name);
|
||||
});
|
||||
return Array.from(ndSet.values())
|
||||
.sort()
|
||||
.map((name) => ({
|
||||
prop: name,
|
||||
label: name,
|
||||
}));
|
||||
// })
|
||||
},
|
||||
downFilterData(data) {
|
||||
return data.map((item) => {
|
||||
const { data: innerData } = item;
|
||||
const keyValuePairs = {};
|
||||
innerData.map((d) => {
|
||||
keyValuePairs[d.dynamicName] = d.dynamicValue;
|
||||
});
|
||||
return {
|
||||
inspectionContent: item.inspectionContent,
|
||||
...keyValuePairs,
|
||||
sumInput: item.sumInput,
|
||||
scrapRatio: item.scrapRatio,
|
||||
sumScrap: item.sumScrap,
|
||||
};
|
||||
});
|
||||
},
|
||||
filterNameData(nameData) {
|
||||
// console.log(upData);
|
||||
// upData.forEach((ele) => {
|
||||
const ndSet = new Set();
|
||||
|
||||
nameData.forEach((nd) => {
|
||||
ndSet.add(nd.name);
|
||||
});
|
||||
return Array.from(ndSet.values())
|
||||
.sort()
|
||||
.map((name) => ({
|
||||
prop: name,
|
||||
label: name,
|
||||
}));
|
||||
// })
|
||||
},
|
||||
filterData(data) {
|
||||
return data.map((item) => {
|
||||
const { data: innerData } = item;
|
||||
const keyValuePairs = {};
|
||||
innerData.map((d) => {
|
||||
keyValuePairs[d.dynamicName] = d.dynamicValue;
|
||||
});
|
||||
return {
|
||||
inspectionContent: item.inspectionContent,
|
||||
workOrderName: item.workOrderName,
|
||||
...keyValuePairs,
|
||||
sumInput: item.sumInput,
|
||||
sumOutput: item.sumOutput,
|
||||
};
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
handleSearchBarBtnClick(val) {
|
||||
if (val.btnName === 'search') {
|
||||
this.queryParams.workOrderId = val.workOrderId
|
||||
? val.workOrderId
|
||||
: undefined;
|
||||
this.queryParams.productId = val.productId ? val.productId : undefined;
|
||||
this.queryParams.startTime = val.checkTime
|
||||
? val.checkTime[0]
|
||||
: undefined;
|
||||
this.queryParams.endTime = val.checkTime ? val.checkTime[1] : undefined;
|
||||
|
||||
this.getList();
|
||||
}
|
||||
console.log(val);
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
// handleQuery() {
|
||||
// this.queryParams.pageNo = 1;
|
||||
// this.getList();
|
||||
// },
|
||||
// /** 重置按钮操作 */
|
||||
// resetQuery() {
|
||||
// this.resetForm('queryForm');
|
||||
// this.handleQuery();
|
||||
// },
|
||||
// /** 新增按钮操作 */
|
||||
// handleAdd() {
|
||||
// this.reset();
|
||||
// this.open = true;
|
||||
// this.title = '添加质量检查信息记录表';
|
||||
// },
|
||||
// /** 修改按钮操作 */
|
||||
// handleUpdate(row) {
|
||||
// this.reset();
|
||||
// const id = row.id;
|
||||
// getQualityInspectionRecord(id).then((response) => {
|
||||
// /** 因为后端返回的时间是时间戳格式，需转换 */
|
||||
// const info = {}
|
||||
// Object.keys(this.form).forEach(key => {
|
||||
// info[key] = response.data[key]
|
||||
// });
|
||||
// this.form = info;
|
||||
// this.open = true;
|
||||
// this.title = '修改质量检查信息记录表';
|
||||
// });
|
||||
// },
|
||||
// /** 提交按钮 */
|
||||
// submitForm() {
|
||||
// this.$refs['form'].validate((valid) => {
|
||||
// if (!valid) {
|
||||
// return;
|
||||
// }
|
||||
// // 修改的提交
|
||||
// if (this.form.id != null) {
|
||||
// updateQualityInspectionRecord(this.form).then((response) => {
|
||||
// this.$modal.msgSuccess('修改成功');
|
||||
// this.open = false;
|
||||
// this.getList();
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// // 添加的提交
|
||||
// createQualityInspectionRecord(this.form).then((response) => {
|
||||
// this.$modal.msgSuccess('新增成功');
|
||||
// this.open = false;
|
||||
// this.getList();
|
||||
// });
|
||||
// });
|
||||
// },
|
||||
// /** 删除按钮操作 */
|
||||
// handleDelete(row) {
|
||||
// const id = row.id;
|
||||
// this.$modal
|
||||
// .confirm('是否确认删除"' + row.inspectionDetContent + '"?')
|
||||
// .then(function () {
|
||||
// return deleteQualityInspectionRecord(id);
|
||||
// })
|
||||
// .then(() => {
|
||||
// this.getList();
|
||||
// this.$modal.msgSuccess('删除成功');
|
||||
// })
|
||||
// .catch(() => {});
|
||||
// },
|
||||
// /** 导出按钮操作 */
|
||||
// handleExport() {
|
||||
// // 处理查询参数
|
||||
// let params = { ...this.queryParams };
|
||||
// params.pageNo = undefined;
|
||||
// params.pageSize = undefined;
|
||||
// this.$modal
|
||||
// .confirm('是否确认导出所有质量检查信息记录表数据项?')
|
||||
// .then(() => {
|
||||
// this.exportLoading = true;
|
||||
// return exportQualityInspectionRecordExcel(params);
|
||||
// })
|
||||
// .then((response) => {
|
||||
// this.$download.excel(response, '质量检查信息记录表.xls');
|
||||
// this.exportLoading = false;
|
||||
// })
|
||||
// .catch(() => {});
|
||||
// },
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
:deep(.custom-tabs) {
|
||||
.el-tabs__header {
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.el-tabs__item {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 36px !important;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
.blue-title {
|
||||
position: relative;
|
||||
padding: 4px 0;
|
||||
padding-left: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
font-weight: 700;
|
||||
margin-bottom: 12px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 6px;
|
||||
height: 16px;
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
background: #0b58ff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
125
src/views/quality/currentData/baseChart.vue
Normal file
125
src/views/quality/currentData/baseChart.vue
Normal file
@ -0,0 +1,125 @@
|
||||
<template>
|
||||
<div id="currentDataChart" style="width: 100%; height: 300px"></div>
|
||||
</template>
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
import resize from '@/utils/chartMixins/resize';
|
||||
export default {
|
||||
name: 'BaseChart',
|
||||
mixins: [resize],
|
||||
data() {
|
||||
return {
|
||||
chartDom: '',
|
||||
chart: '',
|
||||
};
|
||||
},
|
||||
// props: {
|
||||
// chartData: {
|
||||
// type: Array,
|
||||
// required: true,
|
||||
// default: () => {
|
||||
// return [];
|
||||
// },
|
||||
// },
|
||||
// },
|
||||
// watch: {
|
||||
// chartData: function () {
|
||||
// this.getChart();
|
||||
// },
|
||||
// },
|
||||
mounted() {
|
||||
window.addEventListener('resize', () => {
|
||||
this.getChart();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
getChart() {
|
||||
if (
|
||||
this.chart !== null &&
|
||||
this.chart !== '' &&
|
||||
this.chart !== undefined
|
||||
) {
|
||||
this.chart.dispose(); // 页面多次刷新会出现警告，Dom已经初始化了一个实例，这是销毁实例
|
||||
}
|
||||
this.chartDom = document.getElementById('currentDataChart');
|
||||
this.chart = echarts.init(this.chartDom);
|
||||
// if (this.chartData.length === 0) {
|
||||
// return false;
|
||||
// }
|
||||
var option = {
|
||||
color: [
|
||||
'#288AFF',
|
||||
'#73DE93',
|
||||
'#FFCE6A',
|
||||
'#63BDFF',
|
||||
'#7164FF',
|
||||
'#FF6860',
|
||||
'#FF9747',
|
||||
'#B0EB42',
|
||||
'#D680FF',
|
||||
'#0043D2',
|
||||
],
|
||||
// legend: {
|
||||
// data: keys,
|
||||
// right: '1%',
|
||||
// },
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
},
|
||||
grid: {
|
||||
left: '1%',
|
||||
right: '1%',
|
||||
bottom: '3%',
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ['1', '2', '3', '4', '5'],
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [50, 30, 40, 50, 60],
|
||||
type: 'bar',
|
||||
stack: 'a',
|
||||
barWidth: 20,
|
||||
name: '产线1',
|
||||
},
|
||||
{
|
||||
data: [30, 50, 44, 52, 39],
|
||||
type: 'bar',
|
||||
stack: 'a',
|
||||
barWidth: 20,
|
||||
name: '产线2',
|
||||
},
|
||||
{
|
||||
data: [53, 33, 43, 53, 63],
|
||||
type: 'bar',
|
||||
stack: 'a',
|
||||
barWidth: 20,
|
||||
name: '产线3',
|
||||
},
|
||||
{
|
||||
data: [35, 39, 44, 65, 45],
|
||||
type: 'bar',
|
||||
stack: 'a',
|
||||
barWidth: 20,
|
||||
name: '产线4',
|
||||
},
|
||||
{
|
||||
data: [50, 30, 40, 50, 60],
|
||||
type: 'bar',
|
||||
stack: 'a',
|
||||
barWidth: 20,
|
||||
name: '产线5',
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
option && this.chart.setOption(option);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
167
src/views/quality/currentData/currentTest.vue
Normal file
167
src/views/quality/currentData/currentTest.vue
Normal file
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<div>
|
||||
<base-table
|
||||
:table-props="tableProps"
|
||||
:page="1"
|
||||
:limit="1000"
|
||||
:table-data="list" />
|
||||
<div class="orderBox">
|
||||
<div class="title">
|
||||
<span>工单：工单1</span>
|
||||
<span>产品名称：名称1</span>
|
||||
<span>规格：规格1</span>
|
||||
</div>
|
||||
<div class="custom-tabs">
|
||||
<el-tabs v-model="activeName" :stretch="true">
|
||||
<el-tab-pane :label="'\u2002表格\u2002'" name="table">
|
||||
<!-- 列表 -->
|
||||
<base-table
|
||||
:table-props="tableProps2"
|
||||
:page="1"
|
||||
:limit="1000"
|
||||
:table-data="list2" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane
|
||||
:label="'\u3000图表\u3000'"
|
||||
name="chart"
|
||||
style="overflow: inherit">
|
||||
<baseChart />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import BaseChart from './baseChart.vue';
|
||||
export default {
|
||||
name: 'CurrentTest',
|
||||
components: { BaseChart },
|
||||
data() {
|
||||
return {
|
||||
activeName: 'table',
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'workOrderName',
|
||||
label: '工单名称',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'prodName',
|
||||
label: '产品名称',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line1',
|
||||
label: '产线1',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line2',
|
||||
label: '产线2',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line3',
|
||||
label: '产线3',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'total',
|
||||
label: '上片总数',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'total2',
|
||||
label: '下片总数',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
],
|
||||
list: [
|
||||
{ workOrderName: '工单1' },
|
||||
{ workOrderName: '工单2' },
|
||||
{ workOrderName: '工单3' },
|
||||
{ workOrderName: '工单4' },
|
||||
{ workOrderName: '工单5' },
|
||||
{ workOrderName: '工单6' },
|
||||
],
|
||||
tableProps2: [
|
||||
{
|
||||
prop: 'workOrderName',
|
||||
label: '检测内容',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'prodName',
|
||||
label: '原片总数',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line1',
|
||||
label: '产线1',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line2',
|
||||
label: '产线2',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'line3',
|
||||
label: '产线3',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'total',
|
||||
label: '未通过检测总数',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
{
|
||||
prop: 'total2',
|
||||
label: '报废比例',
|
||||
showOverflowtooltip: true,
|
||||
},
|
||||
],
|
||||
list2: [
|
||||
{ workOrderName: '工单1' },
|
||||
{ workOrderName: '工单2' },
|
||||
{ workOrderName: '工单3' },
|
||||
{ workOrderName: '工单4' },
|
||||
{ workOrderName: '工单5' },
|
||||
{ workOrderName: '工单6' },
|
||||
],
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.orderBox {
|
||||
padding-top: 16px;
|
||||
}
|
||||
.title {
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 300px;
|
||||
font-size: 14px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
:deep(.custom-tabs) {
|
||||
.el-tabs__header {
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.el-tabs__item {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 36px !important;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
179
src/views/quality/currentData/hourData.vue
Normal file
179
src/views/quality/currentData/hourData.vue
Normal file
@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<base-table
|
||||
:table-props="tableProps"
|
||||
:table-data="list"
|
||||
:max-height="tableH" />
|
||||
</template>
|
||||
<script>
|
||||
import tableHeightMixin from '@/mixins/tableHeightMixin';
|
||||
export default {
|
||||
name: 'HourData',
|
||||
mixins: [tableHeightMixin],
|
||||
data() {
|
||||
return {
|
||||
heightNum: 200,
|
||||
tableProps: [
|
||||
{
|
||||
prop: 'name',
|
||||
lable: '检测内容',
|
||||
},
|
||||
{
|
||||
label: '2024-01-01 01:00:00',
|
||||
children: [
|
||||
{
|
||||
prop: 'line1-1',
|
||||
label: '产线1',
|
||||
},
|
||||
{
|
||||
prop: 'line1-2',
|
||||
label: '产线2',
|
||||
},
|
||||
{
|
||||
prop: 'line1-3',
|
||||
label: '产线3',
|
||||
},
|
||||
{
|
||||
prop: 'line1-4',
|
||||
label: '产线4',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '2024-01-01 02:00:00',
|
||||
children: [
|
||||
{
|
||||
prop: 'line2-1',
|
||||
label: '产线1',
|
||||
},
|
||||
{
|
||||
prop: 'line2-2',
|
||||
label: '产线2',
|
||||
},
|
||||
{
|
||||
prop: 'line2-3',
|
||||
label: '产线3',
|
||||
},
|
||||
{
|
||||
prop: 'line2-4',
|
||||
label: '产线4',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '2024-01-01 03:00:00',
|
||||
children: [
|
||||
{
|
||||
prop: 'line3-1',
|
||||
label: '产线1',
|
||||
},
|
||||
{
|
||||
prop: 'line3-2',
|
||||
label: '产线2',
|
||||
},
|
||||
{
|
||||
prop: 'line3-3',
|
||||
label: '产线3',
|
||||
},
|
||||
{
|
||||
prop: 'line3-4',
|
||||
label: '产线4',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
list: [
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
{
|
||||
name: '磨边缺陷数',
|
||||
'line1-1': 1,
|
||||
'line1-2': 2,
|
||||
'line1-3': 3,
|
||||
'line1-4': 4,
|
||||
'line2-1': 5,
|
||||
'line2-2': 6,
|
||||
'line2-3': 7,
|
||||
'line2-4': 8,
|
||||
'line3-1': 9,
|
||||
'line3-2': 10,
|
||||
'line3-3': 11,
|
||||
'line3-4': 12,
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -1,622 +1,88 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 搜索工作栏 -->
|
||||
<!-- 列表 -->
|
||||
<el-row>
|
||||
<el-col class="custom-tabs">
|
||||
<el-tabs v-model="activeName" :stretch="true" @tab-click="handleTabClick">
|
||||
<el-tab-pane :label="'\u2002表格数据\u2002'" name="table">
|
||||
<!-- 列表 -->
|
||||
<div class="blue-title">产品名：{{ productDetail.name }} 产品规格：{{ productDetail.specifications }}</div>
|
||||
<base-table class="base-table__margin" :table-props="productProps" :page="1" :limit="10" :table-data="list">
|
||||
</base-table>
|
||||
<div v-for="(item,index) in downProps" :key="index">
|
||||
<div class="blue-title">工单名称:{{ list[index].workOrderName }}</div>
|
||||
<base-table class="base-table__margin" :table-props="item" :page="1" :limit="10"
|
||||
:table-data="downList[index]">
|
||||
</base-table>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane :label="'\u3000图形数据\u3000'" name="chart" style="overflow: inherit">
|
||||
<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" @headBtnClick="handleSearchBarBtnClick" />
|
||||
<div id="main" style="height: 500px;width: 1000px;"></div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 分页组件 -->
|
||||
<!-- <pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNo"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList" /> -->
|
||||
|
||||
<!-- 对话框(添加 / 修改) -->
|
||||
<!-- <base-dialog
|
||||
:dialogTitle="title"
|
||||
:dialogVisible="open"
|
||||
width="50%"
|
||||
@close="cancel"
|
||||
@cancel="cancel"
|
||||
@confirm="submitForm">
|
||||
<DialogForm v-if="open" ref="form" v-model="form" />
|
||||
</base-dialog> -->
|
||||
</div>
|
||||
<div class="currentDataContainer">
|
||||
<div class="topBox">
|
||||
<el-menu
|
||||
:default-active="activeName"
|
||||
mode="horizontal"
|
||||
@select="handleSelect">
|
||||
<el-menu-item index="currentTest">当前检测数据</el-menu-item>
|
||||
<el-menu-item index="24hour">24小时检测数据</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="bottomBox">
|
||||
<!-- 当前检测数据 -->
|
||||
<div v-if="activeName === 'currentTest'">
|
||||
<CurrentTest />
|
||||
</div>
|
||||
<!-- 24小时检测数据 -->
|
||||
<div v-if="activeName === '24hour'">
|
||||
<HourData />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getInspectionData,
|
||||
getProductList,
|
||||
getWorkOrderList
|
||||
} from '@/api/monitoring/statisticalData';
|
||||
// import Editor from '@/components/Editor';
|
||||
import moment from 'moment';
|
||||
// import DialogForm from './dialogForm.vue';
|
||||
import * as echarts from 'echarts';
|
||||
// import basicPageMixin from '@/mixins/lb/basicPageMixin';
|
||||
import CurrentTest from './currentTest.vue';
|
||||
import HourData from './hourData.vue';
|
||||
export default {
|
||||
name: 'statisticalData',
|
||||
// components: {
|
||||
// DialogForm,
|
||||
// },
|
||||
// mixins: [basicPageMixin],
|
||||
name: 'currentData',
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
dynamicProps: [],
|
||||
downProps: [],
|
||||
downList: [],
|
||||
productDetail: {
|
||||
name: null,
|
||||
specifications:null,
|
||||
},
|
||||
activeName: 'table',
|
||||
searchBarFormConfig: [
|
||||
{
|
||||
type: 'label',
|
||||
label: '当前检测数据柱状图',
|
||||
// placeholder: '请选择工单号',
|
||||
// param: 'workOrderId',
|
||||
// selectOptions: [],
|
||||
},
|
||||
// {
|
||||
// type: 'select',
|
||||
// label: '产品',
|
||||
// placeholder: '请选择产品',
|
||||
// param: 'productionId',
|
||||
// selectOptions: [],
|
||||
// },
|
||||
// {
|
||||
// type: 'input',
|
||||
// label: '检测内容',
|
||||
// placeholder: '请输入检测内容',
|
||||
// param: 'inspectionDetContent',
|
||||
// },
|
||||
// {
|
||||
// type: 'datePicker',
|
||||
// label: '时间段',
|
||||
// dateType: 'daterange', // datetimerange
|
||||
// // format: 'yyyy-MM-dd HH:mm:ss',
|
||||
// format: 'yyyy-MM-dd',
|
||||
// valueFormat: 'timestamp',
|
||||
// rangeSeparator: '-',
|
||||
// startPlaceholder: '开始日期',
|
||||
// endPlaceholder: '结束日期',
|
||||
// defaultTime: ['00:00:00', '23:59:59'],
|
||||
// param: 'checkTime',
|
||||
// // width: 350,
|
||||
// },
|
||||
// {
|
||||
// type: 'button',
|
||||
// btnName: '查询',
|
||||
// name: 'search',
|
||||
// color: 'primary',
|
||||
// },
|
||||
// {
|
||||
// type: 'separate',
|
||||
// },
|
||||
// // {
|
||||
// // type: this.$auth.hasPermi(
|
||||
// // 'base:quality-inspection-record:create'
|
||||
// // )
|
||||
// // ? 'button'
|
||||
// // : '',
|
||||
// // btnName: '新增',
|
||||
// // name: 'add',
|
||||
// // plain: true,
|
||||
// // color: 'success',
|
||||
// // },
|
||||
],
|
||||
// tableBtn: [
|
||||
// this.$auth.hasPermi('base:quality-inspection-record:update')
|
||||
// ? {
|
||||
// type: 'edit',
|
||||
// btnName: '修改',
|
||||
// }
|
||||
// : undefined,
|
||||
// this.$auth.hasPermi('base:quality-inspection-record:delete')
|
||||
// ? {
|
||||
// type: 'delete',
|
||||
// btnName: '删除',
|
||||
// }
|
||||
// : undefined,
|
||||
// ].filter((v) => v),
|
||||
// tableProps: [
|
||||
// {
|
||||
// prop: 'createTime',
|
||||
// label: '添加时间',
|
||||
// fixed: true,
|
||||
// width: 180,
|
||||
// filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'inspectionDetContent',
|
||||
// label: '检测内容',
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'lineName',
|
||||
// label: '产线',
|
||||
// },
|
||||
// {
|
||||
// // width: 128,
|
||||
// prop: 'checkPerson',
|
||||
// label: '检测人员',
|
||||
// },
|
||||
// {
|
||||
// // width: 160,
|
||||
// prop: 'checkTime',
|
||||
// label: '检测时间',
|
||||
// filter: (val) =>
|
||||
// val != null ? moment(val).format('yyyy-MM-DD HH:mm:ss') : '-',
|
||||
// },
|
||||
// {
|
||||
// width: 90,
|
||||
// prop: 'source',
|
||||
// label: '来源',
|
||||
// filter: (val) => ['未知', '手动', '自动'][val],
|
||||
// },
|
||||
// ],
|
||||
// 搜索框需要的 keys, 与上面 queryParams 的除 pageNo, pageSize 之外的 key 一一对应
|
||||
|
||||
// searchBarKeys: ['inspectionDetContent', 'checkTime', 'productionLineId'],
|
||||
// form: {
|
||||
// id: undefined,
|
||||
// inspectionDetId: undefined,
|
||||
// inspectionDetContent: undefined,
|
||||
// productionLineId: undefined,
|
||||
// sectionId: undefined,
|
||||
// checkPerson: undefined,
|
||||
// checkTime: undefined,
|
||||
// source: undefined,
|
||||
// explainText: undefined,
|
||||
// remark: undefined,
|
||||
// },
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
workOrderId: undefined,
|
||||
productId: undefined,
|
||||
startTime: undefined,
|
||||
endTime: undefined,
|
||||
// productionLineId: null,
|
||||
},
|
||||
return {
|
||||
activeName: 'currentTest',
|
||||
};
|
||||
},
|
||||
created() {
|
||||
// this.getProductLineList();
|
||||
},
|
||||
computed: {
|
||||
productProps() {
|
||||
return [
|
||||
{
|
||||
// width: 160,
|
||||
prop: 'workOrderName',
|
||||
label: '工单名称',
|
||||
},
|
||||
...this.dynamicProps,
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumInput',
|
||||
label: '上片总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumOutput',
|
||||
label: '下片总数',
|
||||
// subcomponent: {
|
||||
// name: 'TextOnly',
|
||||
// props: {
|
||||
// injectData: {
|
||||
// type: Object,
|
||||
// default: () => ({}),
|
||||
// },
|
||||
// },
|
||||
// data() {
|
||||
// return {
|
||||
// text: '比例',
|
||||
// };
|
||||
// },
|
||||
// methods: {
|
||||
// handleEmit(payload) {
|
||||
// console.log('handleEmit', payload);
|
||||
// },
|
||||
// },
|
||||
// render(h) {
|
||||
// return h('el-button', { props: { type: 'text' } }, this.text);
|
||||
// },
|
||||
// },
|
||||
},
|
||||
];
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
if (this.$route.params.startTime && this.$route.params.endTime) {
|
||||
this.searchBarFormConfig[0].defaultSelect = [
|
||||
this.$route.params.startTime,
|
||||
this.$route.params.endTime,
|
||||
];
|
||||
this.queryParams.param = {};
|
||||
this.$set(
|
||||
this.queryParams.param,
|
||||
'startTime',
|
||||
this.$route.params.startTime
|
||||
);
|
||||
this.$set(this.queryParams.param, 'endTime', this.$route.params.endTime);
|
||||
} else {
|
||||
this.searchBarFormConfig[0].defaultSelect = [];
|
||||
}
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
handleTabClick() {
|
||||
if (this.activeName === 'chart') {
|
||||
var chartDom = document.getElementById('main');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
let arrXAxis = []
|
||||
this.list.forEach((ele) => {
|
||||
arrXAxis.push(ele.workOrderName)
|
||||
})
|
||||
this.downList.forEach((ele) => {
|
||||
ele.forEach((item) => {
|
||||
if (ele.length !==0 && item.productionline) {
|
||||
arrXAxis.push('产线' + item.productionline)
|
||||
|
||||
}
|
||||
})
|
||||
})
|
||||
let arrYAxis = []
|
||||
this.list.forEach((ele) => {
|
||||
// console.log(ele);
|
||||
arrYAxis.push(ele.sumInput)
|
||||
})
|
||||
this.downList.forEach((ele) => {
|
||||
ele.forEach((item) => {
|
||||
console.log(item);
|
||||
// if (ele.length !== 0 && item.productionline) {
|
||||
arrYAxis.push(item.sumInput)
|
||||
// }
|
||||
})
|
||||
})
|
||||
// console.log(arrXAxis);
|
||||
option = {
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: arrXAxis
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: arrYAxis,
|
||||
type: 'bar',
|
||||
showBackground: true,
|
||||
barWidth: '20',
|
||||
label: {
|
||||
show: true,
|
||||
position: 'top'
|
||||
},
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.2)'
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
option && myChart.setOption(option);
|
||||
}
|
||||
},
|
||||
/** 获取搜索栏的产线列表 */
|
||||
// async getDict() {
|
||||
// const res = await getProductList()
|
||||
// const result = await getWorkOrderList()
|
||||
// console.log(res);
|
||||
// this.searchBarFormConfig[1].selectOptions = res.data.map((item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id:item.id
|
||||
// }
|
||||
// })
|
||||
// this.searchBarFormConfig[0].selectOptions = result.data.map((item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id: item.id
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
// getProductLineList() {
|
||||
// this.$axios('/base/production-line/listAll').then((response) => {
|
||||
// this.searchBarFormConfig[0].selectOptions = response.data.map(
|
||||
// (item) => {
|
||||
// return {
|
||||
// name: item.name,
|
||||
// id: item.id,
|
||||
// };
|
||||
// }
|
||||
// );
|
||||
// });
|
||||
// },
|
||||
getList() {
|
||||
this.getDataList()
|
||||
// this.getDict()
|
||||
},
|
||||
/** 查询列表 */
|
||||
async getDataList() {
|
||||
this.loading = true;
|
||||
// 执行查询
|
||||
this.downProps= []
|
||||
const res = await getInspectionData(this.queryParams)
|
||||
console.log(res);
|
||||
this.productDetail.name = res.data[0].productName
|
||||
this.productDetail.specifications = res.data[0].specifications
|
||||
// this.productName = res.data[0].productName
|
||||
this.dynamicProps = this.filterNameData(res.data[0].upPart.nameData)
|
||||
console.log(this.dynamicProps)
|
||||
this.list = this.filterData(res.data[0].upPart.data)
|
||||
console.log(this.list)
|
||||
res.data[0].downPart.forEach((ele) => {
|
||||
// console.log(ele.data);
|
||||
let arr = this.downFilterNameData(ele.nameData)
|
||||
if (arr.length !== 0) {
|
||||
let propArr = [{
|
||||
// width: 160,
|
||||
prop: 'inspectionContent',
|
||||
label: '检测内容',
|
||||
},
|
||||
...arr,
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumInput',
|
||||
label: '原片总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'sumScrap',
|
||||
label: '未通过检测总数',
|
||||
},
|
||||
{
|
||||
// width: 128,
|
||||
prop: 'scrapRatio',
|
||||
label: '报废比例',
|
||||
}]
|
||||
this.downProps.push(propArr)
|
||||
}
|
||||
// this.downProps = []
|
||||
})
|
||||
res.data[0].downPart.forEach((ele) => {
|
||||
// console.log(ele.data);
|
||||
let arr =this.downFilterData(ele.data)
|
||||
if (arr.length !== 0) {
|
||||
this.downList.push(arr)
|
||||
}
|
||||
// this.downProps = []
|
||||
})
|
||||
|
||||
// console.log(this.downList);
|
||||
},
|
||||
downFilterNameData(nameData) {
|
||||
const ndSet = new Set();
|
||||
nameData.forEach((nd) => {
|
||||
ndSet.add(nd.name);
|
||||
});
|
||||
return Array.from(ndSet.values())
|
||||
.sort()
|
||||
.map((name) => ({
|
||||
prop: name,
|
||||
label: name,
|
||||
}));
|
||||
// })
|
||||
},
|
||||
downFilterData(data) {
|
||||
return data.map((item) => {
|
||||
const { data: innerData } = item;
|
||||
const keyValuePairs = {};
|
||||
innerData.map((d) => {
|
||||
keyValuePairs[d.dynamicName] = d.dynamicValue;
|
||||
});
|
||||
return {
|
||||
inspectionContent: item.inspectionContent,
|
||||
...keyValuePairs,
|
||||
sumInput: item.sumInput,
|
||||
scrapRatio: item.scrapRatio,
|
||||
sumScrap: item.sumScrap
|
||||
};
|
||||
});
|
||||
},
|
||||
filterNameData(nameData) {
|
||||
// console.log(upData);
|
||||
// upData.forEach((ele) => {
|
||||
const ndSet = new Set();
|
||||
|
||||
nameData.forEach((nd) => {
|
||||
ndSet.add(nd.name);
|
||||
});
|
||||
return Array.from(ndSet.values())
|
||||
.sort()
|
||||
.map((name) => ({
|
||||
prop: name,
|
||||
label: name,
|
||||
}));
|
||||
// })
|
||||
},
|
||||
filterData(data) {
|
||||
return data.map((item) => {
|
||||
const { data: innerData } = item;
|
||||
const keyValuePairs = {};
|
||||
innerData.map((d) => {
|
||||
keyValuePairs[d.dynamicName] = d.dynamicValue;
|
||||
});
|
||||
return {
|
||||
inspectionContent: item.inspectionContent,
|
||||
workOrderName: item.workOrderName,
|
||||
...keyValuePairs,
|
||||
sumInput: item.sumInput,
|
||||
sumOutput: item.sumOutput,
|
||||
};
|
||||
});
|
||||
},
|
||||
/** 取消按钮 */
|
||||
handleSearchBarBtnClick(val) {
|
||||
if (val.btnName === 'search') {
|
||||
this.queryParams.workOrderId = val.workOrderId ? val.workOrderId : undefined
|
||||
this.queryParams.productId = val.productId ? val.productId : undefined
|
||||
this.queryParams.startTime = val.checkTime ? val.checkTime[0] : undefined
|
||||
this.queryParams.endTime = val.checkTime ? val.checkTime[1] : undefined
|
||||
|
||||
this.getList()
|
||||
}
|
||||
console.log(val);
|
||||
}
|
||||
/** 搜索按钮操作 */
|
||||
// handleQuery() {
|
||||
// this.queryParams.pageNo = 1;
|
||||
// this.getList();
|
||||
// },
|
||||
// /** 重置按钮操作 */
|
||||
// resetQuery() {
|
||||
// this.resetForm('queryForm');
|
||||
// this.handleQuery();
|
||||
// },
|
||||
// /** 新增按钮操作 */
|
||||
// handleAdd() {
|
||||
// this.reset();
|
||||
// this.open = true;
|
||||
// this.title = '添加质量检查信息记录表';
|
||||
// },
|
||||
// /** 修改按钮操作 */
|
||||
// handleUpdate(row) {
|
||||
// this.reset();
|
||||
// const id = row.id;
|
||||
// getQualityInspectionRecord(id).then((response) => {
|
||||
// /** 因为后端返回的时间是时间戳格式，需转换 */
|
||||
// const info = {}
|
||||
// Object.keys(this.form).forEach(key => {
|
||||
// info[key] = response.data[key]
|
||||
// });
|
||||
// this.form = info;
|
||||
// this.open = true;
|
||||
// this.title = '修改质量检查信息记录表';
|
||||
// });
|
||||
// },
|
||||
// /** 提交按钮 */
|
||||
// submitForm() {
|
||||
// this.$refs['form'].validate((valid) => {
|
||||
// if (!valid) {
|
||||
// return;
|
||||
// }
|
||||
// // 修改的提交
|
||||
// if (this.form.id != null) {
|
||||
// updateQualityInspectionRecord(this.form).then((response) => {
|
||||
// this.$modal.msgSuccess('修改成功');
|
||||
// this.open = false;
|
||||
// this.getList();
|
||||
// });
|
||||
// return;
|
||||
// }
|
||||
// // 添加的提交
|
||||
// createQualityInspectionRecord(this.form).then((response) => {
|
||||
// this.$modal.msgSuccess('新增成功');
|
||||
// this.open = false;
|
||||
// this.getList();
|
||||
// });
|
||||
// });
|
||||
// },
|
||||
// /** 删除按钮操作 */
|
||||
// handleDelete(row) {
|
||||
// const id = row.id;
|
||||
// this.$modal
|
||||
// .confirm('是否确认删除"' + row.inspectionDetContent + '"?')
|
||||
// .then(function () {
|
||||
// return deleteQualityInspectionRecord(id);
|
||||
// })
|
||||
// .then(() => {
|
||||
// this.getList();
|
||||
// this.$modal.msgSuccess('删除成功');
|
||||
// })
|
||||
// .catch(() => {});
|
||||
// },
|
||||
// /** 导出按钮操作 */
|
||||
// handleExport() {
|
||||
// // 处理查询参数
|
||||
// let params = { ...this.queryParams };
|
||||
// params.pageNo = undefined;
|
||||
// params.pageSize = undefined;
|
||||
// this.$modal
|
||||
// .confirm('是否确认导出所有质量检查信息记录表数据项?')
|
||||
// .then(() => {
|
||||
// this.exportLoading = true;
|
||||
// return exportQualityInspectionRecordExcel(params);
|
||||
// })
|
||||
// .then((response) => {
|
||||
// this.$download.excel(response, '质量检查信息记录表.xls');
|
||||
// this.exportLoading = false;
|
||||
// })
|
||||
// .catch(() => {});
|
||||
// },
|
||||
},
|
||||
components: {
|
||||
CurrentTest,
|
||||
HourData,
|
||||
},
|
||||
methods: {
|
||||
handleSelect(name) {
|
||||
this.activeName = name;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
:deep(.custom-tabs) {
|
||||
.el-tabs__header {
|
||||
margin-bottom: 8px;
|
||||
display: inline-block;
|
||||
transform: translateY(-12px);
|
||||
}
|
||||
|
||||
.el-tabs__content {
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
.el-tabs__item {
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
line-height: 36px !important;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
.blue-title {
|
||||
position: relative;
|
||||
padding: 4px 0;
|
||||
padding-left: 12px;
|
||||
font-size: 14px;
|
||||
color: #606266;
|
||||
font-weight: 700;
|
||||
margin-bottom: 12px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 6px;
|
||||
height: 16px;
|
||||
width: 4px;
|
||||
border-radius: 1px;
|
||||
background: #0b58ff;
|
||||
}
|
||||
.currentDataContainer {
|
||||
width: 100%;
|
||||
min-height: calc(100vh - 120px - 8px);
|
||||
background: rgba(242, 244, 249, 1);
|
||||
.topBox {
|
||||
.el-menu {
|
||||
background-color: #f2f4f9;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.el-menu.el-menu--horizontal {
|
||||
border-bottom: none;
|
||||
width: 100%;
|
||||
.el-menu-item {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
width: calc((100% / 2) - 4px);
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: rgba(22, 22, 22, 0.65);
|
||||
text-align: center;
|
||||
}
|
||||
:first-child {
|
||||
margin-right: 8px;
|
||||
}
|
||||
.el-menu-item.is-active {
|
||||
border-width: 4px;
|
||||
color: #161616;
|
||||
}
|
||||
}
|
||||
.el-tabs__active-bar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.bottomBox {
|
||||
min-height: calc(100vh - 184px);
|
||||
background: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -231,7 +231,7 @@ export default {
|
||||
searchBarFormConfig: [
|
||||
{
|
||||
type: 'select',
|
||||
label: '工单',
|
||||
label: '工单名称',
|
||||
selectOptions: [],
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
|
||||
@ -202,6 +202,7 @@ export default {
|
||||
selectOptions: [],
|
||||
filterable: true,
|
||||
clearable: false,
|
||||
defaultSelect: '',
|
||||
},
|
||||
{
|
||||
// parent: 'dateFilterType',
|
||||
@ -246,7 +247,6 @@ export default {
|
||||
},
|
||||
created() {
|
||||
this.getWorkOrder();
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 准备工厂数据 */
|
||||
@ -262,7 +262,16 @@ export default {
|
||||
id: item.id,
|
||||
};
|
||||
});
|
||||
this.searchBarFormConfig[0].defaultSelect =
|
||||
this.searchBarFormConfig[0].selectOptions[0].id;
|
||||
this.queryParams.workOrderId =
|
||||
this.searchBarFormConfig[0].selectOptions[0].id;
|
||||
} else {
|
||||
this.searchBarFormConfig[0].selectOptions = [];
|
||||
this.searchBarFormConfig[0].defaultSelect = '';
|
||||
this.queryParams.workOrderId = '';
|
||||
}
|
||||
this.getList();
|
||||
},
|
||||
/** 查询列表 */
|
||||
async getList() {
|
||||
@ -284,14 +293,11 @@ export default {
|
||||
});
|
||||
},
|
||||
handleSearchBarBtnClick({ btnName, ...payload }) {
|
||||
console.log(btnName);
|
||||
console.log(payload);
|
||||
this.queryParams.workOrderId = payload.workOrderId || null;
|
||||
this.queryParams.recordTime = payload.recordTime || undefined;
|
||||
if (btnName == 'search') {
|
||||
this.queryParams.workOrderId = payload.workOrderId || null;
|
||||
this.queryParams.recordTime = payload.recordTime || undefined;
|
||||
this.getList();
|
||||
} else {
|
||||
// this.queryParams.recordTime = null;
|
||||
this.exportExcel();
|
||||
console.log('导出');
|
||||
}
|
||||
|
||||
@ -111,9 +111,10 @@ export default {
|
||||
type: 'select',
|
||||
label: '工单名称',
|
||||
selectOptions: [],
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
param: 'workOrderId',
|
||||
defaultSelect: '',
|
||||
filterable: true,
|
||||
clearable: false,
|
||||
},
|
||||
{
|
||||
type: 'datePicker',
|
||||
@ -153,7 +154,6 @@ export default {
|
||||
// AddOrUpdate,
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getDict();
|
||||
},
|
||||
methods: {
|
||||
@ -172,6 +172,11 @@ export default {
|
||||
};
|
||||
});
|
||||
console.log(this.formConfig[0].selectOptions);
|
||||
this.formConfig[0].defaultSelect =
|
||||
this.formConfig[0].selectOptions[0].id || '';
|
||||
this.listQuery.workOrderId =
|
||||
this.formConfig[0].selectOptions[0].id || '';
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
handleExport() {
|
||||
|
||||
@ -115,7 +115,6 @@ export default {
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getDict();
|
||||
},
|
||||
methods: {
|
||||
@ -135,7 +134,9 @@ export default {
|
||||
});
|
||||
this.formConfig[0].defaultSelect =
|
||||
this.formConfig[0].selectOptions[0].id || '';
|
||||
console.log(this.formConfig[0].selectOptions);
|
||||
this.listQuery.workOrderId =
|
||||
this.formConfig[0].selectOptions[0].id || '';
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
buttonClick(val) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user