From 3326dcfc79bb76c27771be4a819dbece0d634ca2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=B5=B5=E6=AD=A3=E6=98=93?= <zhaozhengyi1b@126.com>
Date: Tue, 14 Jan 2025 09:41:40 +0800
Subject: [PATCH] 1

---
 QualityReport.vue                             |  87 ++
 .../gp12/qcGp12ServiceStatistics.js           |  12 +
 .../gp12/report/QualityReport.vue             | 422 ++++++++++
 .../gp12/touchScreen/main/index.vue           |  31 +-
 .../gp12/touchScreen/record/index.vue         | 745 ++++++++----------
 .../gp12/touchScreen/workorder/index.vue      |   6 +-
 6 files changed, 855 insertions(+), 448 deletions(-)
 create mode 100644 QualityReport.vue
 create mode 100644 src/views/qualityManagement/gp12/report/QualityReport.vue

diff --git a/QualityReport.vue b/QualityReport.vue
new file mode 100644
index 0000000..81395c3
--- /dev/null
+++ b/QualityReport.vue
@@ -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>
\ No newline at end of file
diff --git a/src/api/qualityManagement/gp12/qcGp12ServiceStatistics.js b/src/api/qualityManagement/gp12/qcGp12ServiceStatistics.js
index 2161957..12a8030 100644
--- a/src/api/qualityManagement/gp12/qcGp12ServiceStatistics.js
+++ b/src/api/qualityManagement/gp12/qcGp12ServiceStatistics.js
@@ -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
diff --git a/src/views/qualityManagement/gp12/report/QualityReport.vue b/src/views/qualityManagement/gp12/report/QualityReport.vue
new file mode 100644
index 0000000..5bc7791
--- /dev/null
+++ b/src/views/qualityManagement/gp12/report/QualityReport.vue
@@ -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>
\ No newline at end of file
diff --git a/src/views/qualityManagement/gp12/touchScreen/main/index.vue b/src/views/qualityManagement/gp12/touchScreen/main/index.vue
index 37b1ca5..f5a1f5d 100644
--- a/src/views/qualityManagement/gp12/touchScreen/main/index.vue
+++ b/src/views/qualityManagement/gp12/touchScreen/main/index.vue
@@ -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: {
diff --git a/src/views/qualityManagement/gp12/touchScreen/record/index.vue b/src/views/qualityManagement/gp12/touchScreen/record/index.vue
index bac1743..a633562 100644
--- a/src/views/qualityManagement/gp12/touchScreen/record/index.vue
+++ b/src/views/qualityManagement/gp12/touchScreen/record/index.vue
@@ -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>
\ No newline at end of file
+</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>
\ No newline at end of file
diff --git a/src/views/qualityManagement/gp12/touchScreen/workorder/index.vue b/src/views/qualityManagement/gp12/touchScreen/workorder/index.vue
index 49cd8a9..35a7ae6 100644
--- a/src/views/qualityManagement/gp12/touchScreen/workorder/index.vue
+++ b/src/views/qualityManagement/gp12/touchScreen/workorder/index.vue
@@ -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 };