Teams/shanghaigangxiangtuzhuangVUE
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
赵正易
2025-01-14 09:41:40 +08:00
parent c8d9b12e54
commit 3326dcfc79
6 changed files with 855 additions and 448 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
QualityReport.vue Normal file
View File

@@ -0,0 +1,87 @@
<script>
export default {
methods: {
/** 提交按钮 */
submitForm: function () {
this.$refs["form"].validate((valid) => {
if (valid) {
console.log(JSON.stringify(this.form));
if (this.form.id != undefined && this.opertype === 2) {
updateQcGp12ServiceStatistics(this.form)
.then((res) => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
})
.catch((err) => {
//TODO 错误逻辑
});
} else {
addQcGp12ServiceStatistics(this.form)
.then((res) => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
})
.catch((err) => {
//TODO 错误逻辑
});
}
}
});
},
/** 新增表单校验规则 */
rules: {
id: [
{ required: true, message: "序号不能为空", trigger: "blur" }
],
workOrder: [
{ required: true, message: "工单号不能为空", trigger: "blur" }
],
partNumber: [
{ required: true, message: "零件号不能为空", trigger: "blur" }
],
description: [
{ required: true, message: "零件描述不能为空", trigger: "blur" }
],
specification: [
{ required: true, message: "规格不能为空", trigger: "blur" }
],
color: [
{ required: true, message: "颜色不能为空", trigger: "blur" }
],
team: [
{ required: true, message: "班组不能为空", trigger: "blur" }
],
siteNo: [
{ required: true, message: "站点号不能为空", trigger: "blur" }
],
comNo: [
{ required: true, message: "串口号不能为空", trigger: "blur" }
],
startTime: [
{ required: true, message: "开始时间不能为空", trigger: "change" }
],
endTime: [
{ required: true, message: "结束时间不能为空", trigger: "change" }
],
requireNumber: [
{ required: true, message: "投入数不能为空", trigger: "blur" }
],
qualifiedNumber: [
{ required: true, message: "合格数不能为空", trigger: "blur" }
],
qualifiedRate: [
{ required: true, message: "合格率不能为空", trigger: "blur" }
],
damoNumber: [
{ required: true, message: "打磨数不能为空", trigger: "blur" }
],
baofeiNumber: [
{ required: true, message: "报废数不能为空", trigger: "blur" }
],
},
},
};
</script>

12
src/api/qualityManagement/gp12/qcGp12ServiceStatistics.js
View File

@@ -12,6 +12,18 @@ export function listQcGp12ServiceStatistics(query) {
})
}
/**
* 质量GP12统计报表业务模块改造查询
* @param {查询条件} data
*/
export function GetReviseList(query) {
return request({
url: '/mes/qc/gp12/QcGp12ServiceStatistics/GetReviseList',
method: 'post',
data: query,
})
}
/**
* 新增质量GP12统计报表业务模块
* @param data

422
src/views/qualityManagement/gp12/report/QualityReport.vue Normal file
View File

@@ -0,0 +1,422 @@
<template>
<div class="app-container">
<!-- :model属性用于表单验证使用 比如下面的el-form-item 的 prop属性用于对表单值进行验证操作 -->
<el-form :model="queryParams" size="small" label-position="right" inline ref="queryForm"
:label-width="labelWidth" @submit.native.prevent>
<el-form-item label="开始日期" prop="startTime">
<el-date-picker v-model="queryParams.startTime" @change="selectChange" :clearable="false" type="date"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
<el-form-item label="结束日期" prop="endTime">
<el-date-picker v-model="queryParams.endTime" @change="selectChange" :clearable="false" type="date"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
<el-form-item label="工单号" prop="workOrder">
<el-input v-model="queryParams.workOrder" placeholder="请输入工单号" />
</el-form-item>
<el-form-item label="零件号" prop="partNumber">
<el-input v-model="queryParams.partNumber" placeholder="请输入零件号" />
</el-form-item>
<el-form-item label="物料描述" prop="description">
<el-input v-model="queryParams.description" placeholder="请输入物料描述" />
</el-form-item>
<el-form-item label="站点" prop="siteNo">
<el-select v-model="queryParams.siteNo" placeholder="请选择站点" @change="selectChange">
<el-option v-for="item in siteOptions" :key="item.code" :label="item.name" :value="item.code">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="班组" prop="team">
<el-select v-model="queryParams.team" placeholder="请选择班组" @change="selectChange">
<el-option v-for="item in teamOptions" :key="item.code" :label="item.name" :value="item.code">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="排序类别" prop="statisticsOrderType">
<el-select v-model="queryParams.statisticsOrderType">
<el-option label="工单号" :value="1" />
<el-option label="零件号" :value="2" />
<el-option label="合格率" :value="3" />
<el-option label="开始时间" :value="4" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 统计数据区域 -->
<div v-if="statistics" class="statistics-box">
<div>总工单: {{ statistics.totalListCount }}</div>
<div>总投入: {{ statistics.totalRequireNumber }}</div>
<div>总合格: {{ statistics.totalQualifiedNumber }}</div>
<div>合格率: {{ statistics.qualifiedRate }}</div>
<div>抛光数: {{ statistics.totalPolishNumber }}</div>
<div>打磨数: {{ statistics.totalDamoNumber }}</div>
<div>报废数: {{ statistics.totalBaofeiNumber }}</div>
</div>
<!-- 数据区域 -->
<vxe-table size="mini" ref="xTable" border height="860px" :scroll-y="{ gt: 500 }" :data="dataList"
:loading="loading" :row-config="{ isHover: true, isCurrent: true, height: 60 }"
:column-config="{ resizable: true }" :header-cell-style="headerCellStyle" :merge-cells="mergeCells"
:cell-style="cellStyle" @menu-click="contextMenuClickEvent" :menu-config="tableMenu">
<vxe-colgroup title="工单信息" align="center" fixed="left">
<vxe-column field="workOrder" title="工单号" align="center" width="100px" />
<vxe-column field="partNumber" title="零件号" align="center" width="100px" />
<vxe-column field="description" title="零件描述" align="center" width="100px" />
<vxe-column field="specification" title="规格" align="center" />
<vxe-column field="color" title="颜色" align="center" />
<vxe-column field="siteNo" title="站点" align="center" />
<vxe-column field="team" title="班组" align="center" />
<vxe-column field="requireNumber" title="投入数" align="center" />
<vxe-column field="qualifiedNumber" title="合格数" align="center" />
<vxe-column field="qualifiedRate" title="合格率" align="center" width="60px" />
<vxe-column field="polishNumber" title="抛光数" align="center" />
<vxe-column field="damoNumber" title="打磨数" align="center" />
<vxe-column field="baofeiNumber" title="报废数" align="center" />
<vxe-column field="isOnetime" title="是否一次合格" align="center">
<template #default="{ row }">
{{ row.isOnetime == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isBack" title="是否返工件" align="center">
<template #default="{ row }">
{{ row.isBack == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isPolish" title="是否抛光件" align="center">
<template #default="{ row }">
{{ row.isPolish == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isOut" title="是否其他" align="center">
<template #default="{ row }">
{{ row.isOut == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="startTime" title="开始时间" align="center" width="100px" />
<vxe-column field="endTime" title="结束时间" align="center" width="100px" />
<vxe-column field="groupSort" title="类别" align="center" width="60px">
<template #default="{ row }">
<span v-if="row.groupSort == 1">抛光</span>
<span v-if="row.groupSort == 2">打磨</span>
<span v-if="row.groupSort == 3">报废</span>
</template>
</vxe-column>
</vxe-colgroup>
<!-- 展示缺陷记录 -->
<vxe-colgroup v-for="group, index in groupTable" :key="index" :title="group.groupName" align="center">
<vxe-column v-for="defect, index in group.children" :key="index" :field="defect.code"
:title="defect.name" align="center">
</vxe-column>
</vxe-colgroup>
</vxe-table>
<!-- <pagination class="mt10" background :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" /> -->
</div>
</template>
<script>
import {
listQcGp12ServiceStatistics,
addQcGp12ServiceStatistics,
delQcGp12ServiceStatistics,
updateQcGp12ServiceStatistics,
getQcGp12ServiceStatistics,
GetReviseList
} from '@/api/qualityManagement/gp12/qcGp12ServiceStatistics.js';
import * as QcGp12Api from '@/api/qualityManagement/gp12/qcGp12Service.js';
export default {
name: "qcgp12servicestatistics",
data() {
return {
labelWidth: "100px",
formLabelWidth: "100px",
// 选中id数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 遮罩层
loading: false,
// 显示搜索条件
showSearch: true,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
statisticsOrderType: 1,
team: '',
siteNo: '',
startTime: '',
endTime: '',
sort: undefined,
sortType: undefined,
},
// 弹出层标题
title: "",
// 操作类型 1、add 2、edit
opertype: 0,
// 是否显示弹出层
open: false,
// 表单参数
form: {},
// 是否一次合格选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isOnetimeOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否返工件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isBackOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否抛光件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isPolishOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否外部件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isOutOptions: [{ dictLabel: '是', dictValue: 1 }],
// 系统类别选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
typeOptions: [],
// 系统状态选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
statusOptions: [],
sessionKey: '_MES_QualityReport_KEY',
mergeColunmNumber: 19,
teamOptions: [],
siteOptions: [],
// 缺陷项列表渲染
groupTable: [],
// 数据列表
statistics: null,
dataList: [],
mergeCells: [],
hiddenCells: [],
// 右键菜单
tableMenu: {
header: {
options: [
[
{ code: 'hideColumn', name: '隐藏列', disabled: false },
{ code: 'showAllColumn', name: '取消所有隐藏列', disabled: false },
],
],
},
visibleMethod: this.visibleMethod,
},
// 总记录数
total: 0,
};
},
created() {
this.init();
},
computed: {
},
methods: {
async init() {
const [teams, sites, groups] = await Promise.all([
QcGp12Api.GetGroupOptions(),
QcGp12Api.GetStieOptions(),
QcGp12Api.GetDefectInitOptions()
]);
this.teamOptions = teams.data;
this.siteOptions = sites.data;
this.groupTable = groups.data;
this.getLocalStorage();
this.getList();
},
//todo 设置表合并行
mergeTable(num) {
// 待合并数量
this.mergeCells = []
for (let i = 0; i < this.dataList.length; i = i + num) {
let count = this.mergeColunmNumber - this.hiddenCells.length
for (let j = 0; j < count; j++) {
this.mergeCells.push({ row: i, col: j, rowspan: num, colspan: 0 })
}
}
},
selectChange() {
this.setLocalStorage()
},
setLocalStorage() {
const data = {
team: this.queryParams.team,
site: this.queryParams.siteNo,
startTime: this.queryParams.startTime,
endTime: this.queryParams.endTime
}
localStorage.setItem(this.sessionKey, JSON.stringify(data));
},
getLocalStorage() {
const data = JSON.parse(localStorage.getItem(this.sessionKey));
if (data) {
this.queryParams.team = data.team
this.queryParams.siteNo = data.site
this.queryParams.startTime = data.startTime
this.queryParams.endTime = data.endTime
} else {
this.queryParams.startTime = this.$dayjs().startOf('day')
this.queryParams.endTime = this.$dayjs().endOf('day')
}
},
// 查询数据
getList() {
this.loading = true;
GetReviseList(this.queryParams).then(res => {
if (res.code == 200) {
this.dataList = res.data.list;
this.statistics = res.data.statistics;
this.mergeTable(3);
this.loading = false;
}
})
},
// 右键菜单
contextMenuClickEvent({ menu, row, column }) {
const $table = this.$refs.xTable
switch (menu.code) {
case 'hideColumn':
this.hideColumn(column)
break
case 'showAllColumn':
this.resetColumn()
break
}
},
// 隐藏列
hideColumn(column) {
const $table = this.$refs.xTable
$table.hideColumn(column)
this.hiddenCells.push(column.title)
this.resetMergeTable()
},
// 取消所有隐藏列
resetColumn() {
const $table = this.$refs.xTable
this.hiddenCells = []
$table.resetColumn()
this.resetMergeTable()
},
resetMergeTable() {
this.mergeTable(3)
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 重置数据表单
reset() {
this.form = {
id: undefined,
workOrder: undefined,
partNumber: undefined,
description: undefined,
specification: undefined,
color: undefined,
team: undefined,
siteNo: undefined,
comNo: undefined,
isOnetime: undefined,
isBack: undefined,
isPolish: undefined,
isOut: undefined,
startTime: undefined,
endTime: undefined,
label: undefined,
requireNumber: undefined,
qualifiedNumber: undefined,
qualifiedRate: undefined,
damoNumber: undefined,
baofeiNumber: undefined,
groupCode: undefined,
groupSort: undefined,
groupDefectJson: undefined,
type: undefined,
status: undefined,
remark: undefined,
createdBy: undefined,
createdTime: undefined,
updatedBy: undefined,
updatedTime: undefined,
};
this.resetForm("form");
},
// 重置查询操作
resetQuery() {
this.timeRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length != 1
this.multiple = !selection.length;
},
// 自定义排序
sortChange(column) {
if (column.prop == null || column.order == null) {
this.queryParams.sort = undefined;
this.queryParams.sortType = undefined;
} else {
this.queryParams.sort = column.prop;
this.queryParams.sortType = column.order;
}
this.handleQuery();
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
//todo 设置表头颜色
headerCellStyle() {
return {
backgroundColor: '#2D3D51',
color: '#ffffff',
border: '1px solid #161823',
fontSize: '16px',
}
},
cellStyle() {
return {
border: '1px solid #161823',
padding: '0',
fontSize: '14px',
fontWeight: '600',
}
},
},
};
</script>
<style scoped>
/* 添加一些样式以提高可读性 */
:root {
--table-header-bg: #2D3D51;
--table-header-color: #ffffff;
--table-border-color: #161823;
--table-font-size: 14px;
--table-font-weight: 600;
--statistics-font-size: 20px;
}
.vxe-table--header-wrapper th {
background-color: var(--table-header-bg);
color: var(--table-header-color);
border: 1px solid var(--table-border-color);
font-size: 16px;
}
.vxe-table--body-wrapper td {
padding: 6px 0;
border: 1px solid var(--table-border-color);
font-size: var(--table-font-size);
font-weight: var(--table-font-weight);
}
.statistics-box {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
font-size: var(--statistics-font-size);
}
</style>

31
src/views/qualityManagement/gp12/touchScreen/main/index.vue
View File

@@ -52,19 +52,24 @@ export default {
// { label: 'Profile', icon: 'mdi-account' }
],
currentMenu: 0,
menuList: [{
name: '质量',
icon: 'clipboard-list'
}, {
name: '记录',
icon: 'file-document'
}, {
name: '工具',
icon: 'toolbox'
}, {
name: '调试',
icon: 'usb-port'
}]
menuList: [
{
name: '质量',
icon: 'clipboard-list'
},
{
name: '记录',
icon: 'file-document'
},
// {
// name: '工具',
// icon: 'toolbox'
// },
// {
// name: '调试',
// icon: 'usb-port'
// }
]
};
},
computed: {

745
src/views/qualityManagement/gp12/touchScreen/record/index.vue
View File

@@ -1,319 +1,123 @@
<template>
<div class="app-container">
<div class="record-container">
<!-- :model属性用于表单验证使用 比如下面的el-form-item 的 prop属性用于对表单值进行验证操作 -->
<el-form :model="queryParams" size="small" label-position="right" inline ref="queryForm"
:label-width="labelWidth" @submit.native.prevent>
<el-form-item label="开始日期" prop="startTime">
<el-date-picker v-model="queryParams.startTime" @change="selectChange" :clearable="false" type="date"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
<el-form-item label="结束日期" prop="endTime">
<el-date-picker v-model="queryParams.endTime" @change="selectChange" :clearable="false" type="date"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
<el-form-item label="工单号" prop="workOrder">
<el-input v-model="queryParams.workOrder" placeholder="请输入工单号" />
</el-form-item>
<el-form-item label="零件号" prop="partNumber">
<el-input v-model="queryParams.partNumber" placeholder="请输入零件号" />
</el-form-item>
<el-form-item label="开始时间" prop="startTime">
<el-date-picker v-model="queryParams.startTime" type="datetime" placeholder="选择日期时间"></el-date-picker>
<el-form-item label="物料描述" prop="description">
<el-input v-model="queryParams.description" placeholder="请输入物料描述" />
</el-form-item>
<el-form-item label="站点" prop="siteNo">
<el-select v-model="queryParams.siteNo" placeholder="请选择站点" @change="selectChange">
<el-option v-for="item in siteOptions" :key="item.code" :label="item.name" :value="item.code">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="班组" prop="team">
<el-select v-model="queryParams.team" placeholder="请选择班组" @change="selectChange">
<el-option v-for="item in teamOptions" :key="item.code" :label="item.name" :value="item.code">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="排序类别" prop="statisticsOrderType">
<el-select v-model="queryParams.statisticsOrderType">
<el-option label="工单号" :value="1" />
<el-option label="零件号" :value="2" />
<el-option label="合格率" :value="3" />
<el-option label="开始时间" :value="4" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 统计数据区域 -->
<div v-if="statistics" class="statistics-box">
<div>总工单: {{ statistics.totalListCount }}</div>
<div>总投入: {{ statistics.totalRequireNumber }}</div>
<div>总合格: {{ statistics.totalQualifiedNumber }}</div>
<div>合格率: {{ statistics.qualifiedRate }}</div>
<div>抛光数: {{ statistics.totalPolishNumber }}</div>
<div>打磨数: {{ statistics.totalDamoNumber }}</div>
<div>报废数: {{ statistics.totalBaofeiNumber }}</div>
</div>
<!-- 数据区域 -->
<vxe-table size="mini" :data="dataList" :loading="loading" ref="xTable" border height="500px">
<vxe-colgroup title="工单信息" align="center" fixed="left">
<vxe-column field="workOrder" title="工单号" align="center" />
<vxe-column field="partNumber" title="零件号" align="center" />
<vxe-column field="description" title="零件描述" align="center" />
<vxe-column field="specification" title="规格" align="center" />
<vxe-column field="color" title="颜色" align="center" />
<vxe-column field="siteNo" title="站点" align="center" />
<vxe-column field="team" title="班组" align="center" />
<vxe-column field="requireNumber" title="投入数" align="center" />
<vxe-column field="qualifiedNumber" title="合格数" align="center" />
<vxe-column field="qualifiedRate" title="合格率" align="center" />
<vxe-column field="damoNumber" title="打磨数" align="center" />
<vxe-column field="baofeiNumber" title="报废数" align="center" />
<vxe-column field="isOnetime" title="是否一次合格" align="center">
<template #default="{ row }">
<el-tag v-if="row.isOnetime == 1">是</el-tag>
</template>
</vxe-column>
<vxe-column field="isBack" title="是否返工件" align="center">
<template #default="{ row }">
<el-tag v-if="row.isBack == 1">是</el-tag>
</template>
</vxe-column>
<vxe-column field="isPolish" title="是否抛光件" align="center">
<template #default="{ row }">
<el-tag v-if="row.isPolish == 1">是</el-tag>
</template>
</vxe-column>
<vxe-column field="isOut" title="是否其他" align="center">
<template #default="{ row }">
<el-tag v-if="row.isOut == 1">是</el-tag>
</template>
</vxe-column>
<vxe-column field="startTime" title="开始时间" align="center" />
<vxe-column field="endTime" title="结束时间" align="center" />
<vxe-column field="groupSort" title="类别" align="center">
<template #default="{ row }">
<span v-if="row.groupSort == 1">抛光</span>
<span v-if="row.groupSort == 2">打磨</span>
<span v-if="row.groupSort == 3">报废</span>
</template>
</vxe-column>
</vxe-colgroup>
<!-- <vxe-column prop="groupDefectJson" title="同组缺陷记录" align="center" :show-overflow-tooltip="true" /> -->
<!-- <vxe-column prop="title" title="箱标签记录" align="center" :show-overflow-tooltip="true" /> -->
<!-- <vxe-column prop="siteNo" title="站点号" align="center" :show-overflow-tooltip="true" /> -->
<!-- <vxe-column prop="comNo" title="串口号" align="center" :show-overflow-tooltip="true" /> -->
<!-- <vxe-column prop="groupCode" title="同组标识" align="center" :show-overflow-tooltip="true" /> -->
<vxe-column title="操作" align="center" width="140">
<vxe-table size="mini" ref="xTable" border height="500px" :scroll-y="{ gt: 400 }" :data="dataList"
:loading="loading" :row-config="{ isHover: true, isCurrent: true, height: 60 }"
:column-config="{ resizable: true }" :header-cell-style="headerCellStyle" :merge-cells="mergeCells"
:cell-style="cellStyle" @menu-click="contextMenuClickEvent" :menu-config="tableMenu">
<vxe-column fixed="left" field="workOrder" title="工单号" align="center" width="100px" />
<vxe-column fixed="left" field="partNumber" title="零件号" align="center" width="100px" />
<vxe-column fixed="left" field="description" title="描述" align="center" width="100px" />
<vxe-column fixed="left" field="requireNumber" title="投入数" align="center" />
<vxe-column fixed="left" field="qualifiedNumber" title="合格数" align="center" />
<vxe-column fixed="left" field="qualifiedRate" title="合格率" align="center" width="60px" />
<vxe-column fixed="left" field="polishNumber" title="抛光数" align="center" />
<vxe-column fixed="left" field="damoNumber" title="打磨数" align="center" />
<vxe-column fixed="left" field="baofeiNumber" title="报废数" align="center" />
<vxe-column field="specification" title="规格" align="center" />
<vxe-column field="color" title="颜色" align="center" />
<vxe-column field="siteNo" title="站点" align="center" />
<vxe-column field="team" title="班组" align="center" />
<vxe-column field="isOnetime" title="一次" align="center">
<template #default="{ row }">
<el-button size="mini" type="success" icon="el-icon-edit" title="编辑"
@click="handleUpdate(row)"></el-button>
<el-button size="mini" type="danger" icon="el-icon-delete" title="删除"
@click="handleDelete(row)"></el-button>
{{ row.isOnetime == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isBack" title="返工件" align="center">
<template #default="{ row }">
{{ row.isBack == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isPolish" title="抛光件" align="center">
<template #default="{ row }">
{{ row.isPolish == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="isOut" title="其他" align="center">
<template #default="{ row }">
{{ row.isOut == 1 ? '是' : '' }}
</template>
</vxe-column>
<vxe-column field="startTime" title="开始" align="center" width="100px" />
<vxe-column field="endTime" title="结束" align="center" width="100px" />
<vxe-column field="groupSort" title="类别" align="center" width="60px">
<template #default="{ row }">
<span v-if="row.groupSort == 1">抛光</span>
<span v-if="row.groupSort == 2">打磨</span>
<span v-if="row.groupSort == 3">报废</span>
</template>
</vxe-column>
<!-- 展示缺陷记录 -->
<vxe-colgroup v-for="group, index in groupTable" :key="index" :title="group.groupName" align="center">
<vxe-column v-for="defect, index in group.children" :key="index" :field="defect.code"
:title="defect.name" align="center">
</vxe-column>
</vxe-colgroup>
</vxe-table>
<pagination class="mt10" background :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" />
<!-- 添加或修改质量GP12统计报表业务模块对话框 -->
<el-dialog :title="title" :lock-scroll="false" :visible.sync="open">
<el-form ref="form" :model="form" :rules="rules" :label-width="formLabelWidth">
<el-row :gutter="20">
<el-col :lg="12">
<el-form-item label="序号" prop="id">
<el-input-number v-model.number="form.id" controls-position="right" placeholder="请输入序号"
:disabled="title == '修改数据'" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="工单号" prop="workOrder">
<el-input v-model="form.workOrder" placeholder="请输入工单号" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="零件号" prop="partNumber">
<el-input v-model="form.partNumber" placeholder="请输入零件号" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="零件描述" prop="description">
<el-input v-model="form.description" placeholder="请输入零件描述" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="规格" prop="specification">
<el-input v-model="form.specification" placeholder="请输入规格" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="颜色" prop="color">
<el-input v-model="form.color" placeholder="请输入颜色" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="班组" prop="team">
<el-input v-model="form.team" placeholder="请输入班组" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="站点号" prop="siteNo">
<el-input v-model="form.siteNo" placeholder="请输入站点号" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="串口号" prop="comNo">
<el-input v-model="form.comNo" placeholder="请输入串口号" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="是否一次合格" prop="isOnetime">
<el-radio-group v-model="form.isOnetime">
<el-radio v-for="item in isOnetimeOptions" :key="item.dictValue"
:label="parseInt(item.dictValue)">{{ item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="是否返工件" prop="isBack">
<el-radio-group v-model="form.isBack">
<el-radio v-for="item in isBackOptions" :key="item.dictValue"
:label="parseInt(item.dictValue)">{{ item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="是否抛光件" prop="isPolish">
<el-radio-group v-model="form.isPolish">
<el-radio v-for="item in isPolishOptions" :key="item.dictValue"
:label="parseInt(item.dictValue)">{{ item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="是否外部件" prop="isOut">
<el-radio-group v-model="form.isOut">
<el-radio v-for="item in isOutOptions" :key="item.dictValue"
:label="parseInt(item.dictValue)">{{ item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="开始时间" prop="startTime">
<el-date-picker v-model="form.startTime" type="datetime"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="结束时间" prop="endTime">
<el-date-picker v-model="form.endTime" type="datetime"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="箱标签记录" prop="label">
<el-input v-model="form.label" placeholder="请输入箱标签记录" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="投入数" prop="requireNumber">
<el-input v-model="form.requireNumber" placeholder="请输入投入数" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="合格数" prop="qualifiedNumber">
<el-input v-model="form.qualifiedNumber" placeholder="请输入合格数" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="合格率" prop="qualifiedRate">
<el-input v-model="form.qualifiedRate" placeholder="请输入合格率" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="打磨数" prop="damoNumber">
<el-input v-model="form.damoNumber" placeholder="请输入打磨数" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="报废数" prop="baofeiNumber">
<el-input v-model="form.baofeiNumber" placeholder="请输入报废数" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="同组标识" prop="groupCode">
<el-input v-model="form.groupCode" placeholder="请输入同组标识" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="同组顺序" prop="groupSort">
<el-input v-model="form.groupSort" placeholder="请输入同组顺序" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="同组缺陷记录" prop="groupDefectJson">
<el-input v-model="form.groupDefectJson" placeholder="请输入同组缺陷记录" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="系统类别" prop="type">
<el-select v-model="form.type" placeholder="请选择系统类别">
<el-option v-for="item in typeOptions" :key="item.dictValue" :label="item.dictLabel"
:value="item.dictValue"></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="系统状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio v-for="item in statusOptions" :key="item.dictValue" :label="item.dictValue">{{
item.dictLabel }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="系统备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入系统备注" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="创建人" prop="createdBy">
<el-input v-model="form.createdBy" placeholder="请输入创建人" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="创建时间" prop="createdTime">
<el-date-picker v-model="form.createdTime" type="datetime"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="更新人" prop="updatedBy">
<el-input v-model="form.updatedBy" placeholder="请输入更新人" />
</el-form-item>
</el-col>
<el-col :lg="12">
<el-form-item label="更新时间" prop="updatedTime">
<el-date-picker v-model="form.updatedTime" type="datetime"
placeholder="选择日期时间"></el-date-picker>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="cancel">取 消</el-button>
<el-button type="primary" @click="submitForm">确 定</el-button>
</div>
</el-dialog>
<!-- <pagination class="mt10" background :total="total" :page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize" @pagination="getList" /> -->
</div>
</template>
<script>
import {
listQcGp12ServiceStatistics,
addQcGp12ServiceStatistics,
delQcGp12ServiceStatistics,
updateQcGp12ServiceStatistics,
getQcGp12ServiceStatistics,
GetReviseList
} from '@/api/qualityManagement/gp12/qcGp12ServiceStatistics.js';
import * as QcGp12Api from '@/api/qualityManagement/gp12/qcGp12Service.js';
export default {
name: "qcgp12servicestatistics",
data() {
@@ -334,6 +138,11 @@ export default {
queryParams: {
pageNum: 1,
pageSize: 10,
statisticsOrderType: 1,
team: '',
siteNo: '',
startTime: '',
endTime: '',
sort: undefined,
sortType: undefined,
},
@@ -345,84 +154,139 @@ export default {
open: false,
// 表单参数
form: {},
columns: [
{ index: 0, key: 'id', label: `序号`, checked: true },
{ index: 1, key: 'workOrder', label: `工单号`, checked: true },
{ index: 2, key: 'partNumber', label: `零件号`, checked: true },
{ index: 3, key: 'description', label: `零件描述`, checked: true },
{ index: 4, key: 'specification', label: `规格`, checked: true },
{ index: 5, key: 'color', label: `颜色`, checked: true },
{ index: 6, key: 'team', label: `班组`, checked: true },
{ index: 7, key: 'siteNo', label: `站点号`, checked: true },
{ index: 8, key: 'comNo', label: `串口号`, checked: true },
{ index: 9, key: 'isOnetime', label: `是否一次合格`, checked: false },
{ index: 10, key: 'isBack', label: `是否返工件`, checked: false },
{ index: 11, key: 'isPolish', label: `是否抛光件`, checked: false },
{ index: 12, key: 'isOut', label: `是否外部件`, checked: false },
{ index: 13, key: 'startTime', label: `开始时间`, checked: false },
{ index: 14, key: 'endTime', label: `结束时间`, checked: false },
{ index: 15, key: 'label', label: `箱标签记录`, checked: false },
{ index: 16, key: 'requireNumber', label: `投入数`, checked: false },
{ index: 17, key: 'qualifiedNumber', label: `合格数`, checked: false },
{ index: 18, key: 'qualifiedRate', label: `合格率`, checked: false },
{ index: 19, key: 'damoNumber', label: `打磨数`, checked: false },
{ index: 20, key: 'baofeiNumber', label: `报废数`, checked: false },
{ index: 21, key: 'groupCode', label: `同组标识`, checked: false },
{ index: 22, key: 'groupSort', label: `同组顺序`, checked: false },
{ index: 23, key: 'groupDefectJson', label: `同组缺陷记录`, checked: false },
{ index: 24, key: 'type', label: `系统类别`, checked: false },
{ index: 25, key: 'status', label: `系统状态`, checked: false },
{ index: 26, key: 'remark', label: `系统备注`, checked: false },
{ index: 27, key: 'createdBy', label: `创建人`, checked: false },
{ index: 28, key: 'createdTime', label: `创建时间`, checked: false },
{ index: 29, key: 'updatedBy', label: `更新人`, checked: false },
{ index: 30, key: 'updatedTime', label: `更新时间`, checked: false },
],
// 是否一次合格选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isOnetimeOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否返工件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isBackOptions: [],
isBackOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否抛光件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isPolishOptions: [],
isPolishOptions: [{ dictLabel: '是', dictValue: 1 }],
// 是否外部件选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
isOutOptions: [],
isOutOptions: [{ dictLabel: '是', dictValue: 1 }],
// 系统类别选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
typeOptions: [],
// 系统状态选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
statusOptions: [],
sessionKey: '_MES_QualityReport_KEY',
mergeColunmNumber: 19,
teamOptions: [],
siteOptions: [],
// 缺陷项列表渲染
groupTable: [],
// 数据列表
statistics: null,
dataList: [],
mergeCells: [],
hiddenCells: [],
// 右键菜单
tableMenu: {
header: {
options: [
[
{ code: 'hideColumn', name: '隐藏列', disabled: false },
{ code: 'showAllColumn', name: '取消所有隐藏列', disabled: false },
],
],
},
visibleMethod: this.visibleMethod,
},
// 总记录数
total: 0,
// 提交按钮是否显示
btnSubmitVisible: true,
// 表单校验
rules: {
id: [
{ required: true, message: "序号不能为空", trigger: "blur" }
],
},
};
},
created() {
// 列表数据查询
this.getList();
var dictParams = [
];
this.init();
},
computed: {
},
methods: {
async init() {
const [teams, sites, groups] = await Promise.all([
QcGp12Api.GetGroupOptions(),
QcGp12Api.GetStieOptions(),
QcGp12Api.GetDefectInitOptions()
]);
this.teamOptions = teams.data;
this.siteOptions = sites.data;
this.groupTable = groups.data;
this.getLocalStorage();
this.getList();
},
//todo 设置表合并行
mergeTable(num) {
// 待合并数量
this.mergeCells = []
for (let i = 0; i < this.dataList.length; i = i + num) {
let count = this.mergeColunmNumber - this.hiddenCells.length
for (let j = 0; j < count; j++) {
this.mergeCells.push({ row: i, col: j, rowspan: num, colspan: 0 })
}
}
},
selectChange() {
this.setLocalStorage()
},
setLocalStorage() {
const data = {
team: this.queryParams.team,
site: this.queryParams.siteNo,
startTime: this.queryParams.startTime,
endTime: this.queryParams.endTime
}
localStorage.setItem(this.sessionKey, JSON.stringify(data));
},
getLocalStorage() {
const data = JSON.parse(localStorage.getItem(this.sessionKey));
if (data) {
this.queryParams.team = data.team
this.queryParams.siteNo = data.site
this.queryParams.startTime = data.startTime
this.queryParams.endTime = data.endTime
} else {
this.queryParams.startTime = this.$dayjs().startOf('day')
this.queryParams.endTime = this.$dayjs().endOf('day')
}
},
// 查询数据
getList() {
this.loading = true;
listQcGp12ServiceStatistics(this.queryParams).then(res => {
GetReviseList(this.queryParams).then(res => {
if (res.code == 200) {
this.dataList = res.data.result;
this.total = res.data.totalNum;
this.dataList = res.data.list;
this.statistics = res.data.statistics;
this.mergeTable(3);
this.loading = false;
}
})
},
// 右键菜单
contextMenuClickEvent({ menu, row, column }) {
const $table = this.$refs.xTable
switch (menu.code) {
case 'hideColumn':
this.hideColumn(column)
break
case 'showAllColumn':
this.resetColumn()
break
}
},
// 隐藏列
hideColumn(column) {
const $table = this.$refs.xTable
$table.hideColumn(column)
this.hiddenCells.push(column.title)
this.resetMergeTable()
},
// 取消所有隐藏列
resetColumn() {
const $table = this.$refs.xTable
this.hiddenCells = []
$table.resetColumn()
this.resetMergeTable()
},
resetMergeTable() {
this.mergeTable(3)
},
// 取消按钮
cancel() {
this.open = false;
@@ -494,98 +358,113 @@ export default {
this.queryParams.pageNum = 1;
this.getList();
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加";
this.opertype = 1;
//todo 设置表头颜色
headerCellStyle() {
return {
backgroundColor: '#2D3D51',
color: '#ffffff',
border: '1px solid #161823',
fontSize: '16px',
}
},
/** 删除按钮操作 */
handleDelete(row) {
const Ids = row.id || this.ids;
this.$confirm('是否确认删除参数编号为"' + Ids + '"的数据项？')
.then(function () {
return delQcGp12ServiceStatistics(Ids);
})
.then(() => {
this.handleQuery();
this.msgSuccess("删除成功");
})
.catch(() => { });
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const id = row.id || this.ids;
getQcGp12ServiceStatistics(id).then((res) => {
const { code, data } = res;
if (code == 200) {
this.open = true;
this.title = "修改数据";
this.opertype = 2;
this.form = {
...data,
};
}
});
},
// 是否一次合格字典翻译
isOnetimeFormat(row, column) {
return this.selectDictLabel(this.isOnetimeOptions, row.isOnetime);
},
// 是否返工件字典翻译
isBackFormat(row, column) {
return this.selectDictLabel(this.isBackOptions, row.isBack);
},
// 是否抛光件字典翻译
isPolishFormat(row, column) {
return this.selectDictLabel(this.isPolishOptions, row.isPolish);
},
// 是否外部件字典翻译
isOutFormat(row, column) {
return this.selectDictLabel(this.isOutOptions, row.isOut);
},
// 系统类别字典翻译
typeFormat(row, column) {
return this.selectDictLabel(this.typeOptions, row.type);
},
// 系统状态字典翻译
statusFormat(row, column) {
return this.selectDictLabel(this.statusOptions, row.status);
},
/** 提交按钮 */
submitForm: function () {
this.$refs["form"].validate((valid) => {
if (valid) {
console.log(JSON.stringify(this.form));
if (this.form.id != undefined && this.opertype === 2) {
updateQcGp12ServiceStatistics(this.form)
.then((res) => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
})
.catch((err) => {
//TODO 错误逻辑
});
} else {
addQcGp12ServiceStatistics(this.form)
.then((res) => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
})
.catch((err) => {
//TODO 错误逻辑
});
}
}
});
cellStyle() {
return {
border: '1px solid #161823',
padding: '0',
fontSize: '14px',
fontWeight: '600',
}
},
},
};
</script>
</script>
<style scoped>
/* 添加一些样式以提高可读性 */
:root {
--table-header-bg: #2D3D51;
--table-header-color: #ffffff;
--table-border-color: #161823;
--table-font-size: 14px;
--table-font-weight: 600;
--statistics-font-size: 20px;
--button-bg-color: #409EFF;
/* 蓝色按钮背景 */
--button-text-color: #ffffff;
/* 白色按钮文字 */
--input-bg-color: #ffffff;
/* 白色输入框背景 */
--input-text-color: #333333;
/* 深色输入框文字 */
}
.record-container {
width: 90vw;
/* 使用视口宽度的90% */
max-width: 1200px;
/* 设置最大宽度 */
background-color: #ffffff;
margin: 0 auto;
/* 居中对齐 */
padding: 20px;
/* 添加内边距 */
box-sizing: border-box;
/* 包含内边距和边框 */
}
@media (max-width: 768px) {
.record-container {
width: 95vw;
/* 在小屏幕设备上使用视口宽度的95% */
}
}
.vxe-table--header-wrapper th {
background-color: var(--table-header-bg);
color: var(--table-header-color);
border: 1px solid var(--table-border-color);
font-size: 16px;
}
.vxe-table--body-wrapper td {
padding: 6px 0;
border: 1px solid var(--table-border-color);
font-size: var(--table-font-size);
font-weight: var(--table-font-weight);
}
.statistics-box {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
color: #161823;
font-size: var(--statistics-font-size);
}
/* 调整按钮和输入框大小 */
.el-form-item {
margin-bottom: 20px;
/* 增加表单项之间的间距 */
}
.el-input__inner {
padding: 10px 15px;
/* 增加输入框的内边距 */
font-size: 16px;
/* 增加输入框的字体大小 */
background-color: var(--input-bg-color);
/* 白色输入框背景 */
color: var(--input-text-color);
/* 深色输入框文字 */
border: 1px solid #dcdcdc;
/* 边框颜色 */
}
.el-date-editor.el-input,
.el-select {
width: 100%;
/* 使日期选择器和下拉选择器占满宽度 */
}
</style>

6
src/views/qualityManagement/gp12/touchScreen/workorder/index.vue
View File

@@ -415,8 +415,10 @@ export default {
},
getLocalStorage() {
const data = JSON.parse(localStorage.getItem(this.sessionKey));
this.team = data.team
this.site = data.site
if (data) {
this.team = data.team
this.site = data.site
}
},
doMounted() {
const options = { passive: true };