质量报表优化
This commit is contained in:
@@ -26,103 +26,107 @@ import Layout from '@/layout'
|
||||
|
||||
// 公共路由
|
||||
export const constantRoutes = [{
|
||||
path: '/redirect',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
children: [{
|
||||
path: '/redirect/:path(.*)',
|
||||
component: (resolve) => require(['@/views/redirect'], resolve)
|
||||
}]
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
component: (resolve) => require(['@/views/login'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
path: '/redirect',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
children: [{
|
||||
path: '/redirect/:path(.*)',
|
||||
component: (resolve) => require(['@/views/redirect'], resolve)
|
||||
}]
|
||||
},
|
||||
{
|
||||
path: '/register',
|
||||
component: (resolve) => require(['@/views/register'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/404',
|
||||
component: (resolve) => require(['@/views/error/404'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/401',
|
||||
component: (resolve) => require(['@/views/error/401'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
component: Layout,
|
||||
redirect: 'index',
|
||||
children: [{
|
||||
path: 'index',
|
||||
component: (resolve) => require(['@/views/index'], resolve),
|
||||
name: 'Index',
|
||||
meta: { title: '首页', icon: 'dashboard', affix: true }
|
||||
}],
|
||||
},
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
redirect: 'noredirect',
|
||||
children: [{
|
||||
path: 'profile',
|
||||
component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
|
||||
name: 'Profile',
|
||||
meta: { title: '个人中心', icon: 'user' }
|
||||
}]
|
||||
},
|
||||
path: '/login',
|
||||
component: (resolve) => require(['@/views/login'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/echarts',
|
||||
component: (resolve) => require(['@/views/components/Echarts'], resolve),
|
||||
hidden: true
|
||||
},{
|
||||
path: '/icons',
|
||||
component: (resolve) => require(['@/views/components/icons/index'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
// 质量检验中的初次检验
|
||||
{
|
||||
path: '/firstFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/firstFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/againFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/againFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/thirtyFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/thirtyFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/WmPolishWorkOrder',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/WmPolishWorkOrder.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/PolishReport',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishReport.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/PolishFQC',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
|
||||
path: '/register',
|
||||
component: (resolve) => require(['@/views/register'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/404',
|
||||
component: (resolve) => require(['@/views/error/404'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/401',
|
||||
component: (resolve) => require(['@/views/error/401'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
component: Layout,
|
||||
redirect: 'index',
|
||||
children: [{
|
||||
path: 'index',
|
||||
component: (resolve) => require(['@/views/index'], resolve),
|
||||
name: 'Index',
|
||||
meta: { title: '首页', icon: 'dashboard', affix: true }
|
||||
}],
|
||||
},
|
||||
{
|
||||
path: '/user',
|
||||
component: Layout,
|
||||
hidden: true,
|
||||
redirect: 'noredirect',
|
||||
children: [{
|
||||
path: 'profile',
|
||||
component: (resolve) => require(['@/views/system/user/profile/index'], resolve),
|
||||
name: 'Profile',
|
||||
meta: { title: '个人中心', icon: 'user' }
|
||||
}]
|
||||
},
|
||||
{
|
||||
path: '/echarts',
|
||||
component: (resolve) => require(['@/views/components/Echarts'], resolve),
|
||||
hidden: true
|
||||
}, {
|
||||
path: '/icons',
|
||||
component: (resolve) => require(['@/views/components/icons/index'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
// 质量检验中的初次检验
|
||||
{
|
||||
path: '/firstFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/firstFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/againFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/againFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/thirtyFQC',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/thirtyFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/WmPolishWorkOrder',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/WmPolishWorkOrder.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/PolishReport',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishReport.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/polishManagement/PolishFQC',
|
||||
component: (resolve) => require(['@/views/wmsManagement/WmPolishInventory/PolishFQC.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
{
|
||||
path: '/qualityManagement/FQC/qualityStatistics',
|
||||
component: (resolve) => require(['@/views/qualityManagement/FQC/qualityStatistics.vue'], resolve),
|
||||
hidden: true
|
||||
},
|
||||
]
|
||||
|
||||
export default new Router({
|
||||
base: process.env.VUE_APP_ROUTER_PREFIX,
|
||||
mode: 'history', // 去掉url中的#
|
||||
// scrollBehavior: () => ({ y: 0 }),
|
||||
routes: constantRoutes
|
||||
base: process.env.VUE_APP_ROUTER_PREFIX,
|
||||
mode: 'history', // 去掉url中的#
|
||||
// scrollBehavior: () => ({ y: 0 }),
|
||||
routes: constantRoutes
|
||||
})
|
||||
179
src/views/qualityManagement/FQC/flex/index.js
Normal file
179
src/views/qualityManagement/FQC/flex/index.js
Normal file
@@ -0,0 +1,179 @@
|
||||
/// ===================== 大屏宽高自定义（百度搜索结果） ============================
|
||||
import {
|
||||
getCurrentInstance,
|
||||
onMounted,
|
||||
onUnmounted,
|
||||
ref,
|
||||
watch
|
||||
} from 'vue';
|
||||
const {
|
||||
proxy
|
||||
} = getCurrentInstance()
|
||||
const screenWidth = ref(null)
|
||||
const screenHeight = ref(null)
|
||||
onMounted(() => {
|
||||
proxy.$nextTick(() => {
|
||||
// 监控屏幕尺寸变化
|
||||
var bodyStyle = document.createElement('style')
|
||||
// 这里根据具体的设计稿尺寸来定
|
||||
bodyStyle.innerHTML = `body{width:1920px; height:1080px!important;}`
|
||||
document.documentElement.firstElementChild.appendChild(bodyStyle)
|
||||
screenWidth.value = document.body.clientWidth
|
||||
screenHeight.value = document.body.clientHeight
|
||||
window.onresize = () => {
|
||||
return (() => {
|
||||
screenWidth.value = document.documentElement.clientWidth
|
||||
screenHeight.value = document.documentElement.clientHeight
|
||||
})()
|
||||
}
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if (e.code == 'F11') {
|
||||
screenWidth.value = document.documentElement.clientWidth
|
||||
screenHeight.value = document.documentElement.clientHeight
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
watch(
|
||||
screenWidth,
|
||||
(newValue, oldValue) => {
|
||||
// console.log("val", val);
|
||||
let docWidth = document.documentElement.clientWidth
|
||||
let docHeight = document.documentElement.clientHeight
|
||||
var designWidth = 1920, // 这里根据具体的设计稿尺寸来定
|
||||
designHeight = 1080, // 这里根据具体的设计稿尺寸来定
|
||||
widthRatio = docWidth / designWidth,
|
||||
heightRatio = docHeight / designHeight
|
||||
document.body.style =
|
||||
`transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;`
|
||||
// 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
|
||||
setTimeout(function() {
|
||||
var lateWidth = document.documentElement.clientWidth,
|
||||
lateHeight = document.documentElement.clientHeight
|
||||
if (lateWidth === docWidth) return
|
||||
|
||||
widthRatio = lateWidth / designWidth
|
||||
heightRatio = lateHeight / designHeight
|
||||
document.body.style = 'transform:scale(' + widthRatio + ',' + heightRatio +
|
||||
');transform-origin:left top;overflow: hidden;'
|
||||
}, 0)
|
||||
}, {
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
)
|
||||
watch(
|
||||
screenHeight,
|
||||
(newValue, oldValue) => {
|
||||
// console.log("val", val);
|
||||
let docWidth = document.documentElement.clientWidth
|
||||
let docHeight = document.documentElement.clientHeight
|
||||
var designWidth = 1920, // 这里根据具体的设计稿尺寸来定
|
||||
designHeight = 1080, // 这里根据具体的设计稿尺寸来定
|
||||
widthRatio = docWidth / designWidth,
|
||||
heightRatio = docHeight / designHeight
|
||||
document.body.style =
|
||||
`transform:scale(${widthRatio},${heightRatio});transform-origin:left top;overflow: hidden;`
|
||||
// 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
|
||||
setTimeout(function() {
|
||||
var lateWidth = document.documentElement.clientWidth,
|
||||
lateHeight = document.documentElement.clientHeight
|
||||
if (lateWidth === docWidth) return
|
||||
|
||||
widthRatio = lateWidth / designWidth
|
||||
heightRatio = lateHeight / designHeight
|
||||
document.body.style = 'transform:scale(' + widthRatio + ',' + heightRatio +
|
||||
');transform-origin:left top;overflow: hidden;'
|
||||
}, 0)
|
||||
}, {
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
)
|
||||
window.addEventListener('resize', () => {
|
||||
window.location.reload()
|
||||
})
|
||||
/// ================================================================
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/// ===================== AI智能优化自适应结果（1.0） ===========================
|
||||
import {
|
||||
getCurrentInstance,
|
||||
onMounted,
|
||||
onUnmounted,
|
||||
ref
|
||||
} from 'vue';
|
||||
const {
|
||||
proxy
|
||||
} = getCurrentInstance();
|
||||
const screenWidth = ref(null);
|
||||
const screenHeight = ref(null);
|
||||
const resizeObserver = new ResizeObserver((entries) => {
|
||||
if (entries.length > 0) {
|
||||
const {
|
||||
width,
|
||||
height
|
||||
} = entries[0].contentRect;
|
||||
// 更新屏幕尺寸
|
||||
screenWidth.value = width;
|
||||
screenHeight.value = height;
|
||||
|
||||
// 调用debounce函数
|
||||
updateStyleDebounced();
|
||||
}
|
||||
});
|
||||
// debounce函数
|
||||
const resizeTimeout = ref(null);
|
||||
|
||||
function debounce(func, wait) {
|
||||
return function() {
|
||||
clearTimeout(resizeTimeout.value);
|
||||
resizeTimeout.value = setTimeout(func, wait);
|
||||
};
|
||||
}
|
||||
// 用于更新页面的transform样式
|
||||
function updateStyle() {
|
||||
const docWidth = document.documentElement.clientWidth;
|
||||
const docHeight = document.documentElement.clientHeight;
|
||||
const designWidth = 1920; // 设计稿宽度
|
||||
const designHeight = 1080; // 设计稿高度
|
||||
const widthRatio = docWidth / designWidth;
|
||||
const heightRatio = docHeight / designHeight;
|
||||
document.body.style.transform = `scale(${widthRatio},${heightRatio})`;
|
||||
document.body.style.transformOrigin = 'left top';
|
||||
document.body.style.overflow = 'hidden';
|
||||
// 处理浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
|
||||
setTimeout(function() {
|
||||
const lateWidth = document.documentElement.clientWidth;
|
||||
const lateHeight = document.documentElement.clientHeight;
|
||||
if (lateWidth !== docWidth) {
|
||||
const lateWidthRatio = lateWidth / designWidth;
|
||||
const lateHeightRatio = lateHeight / designHeight;
|
||||
document.body.style.transform = `scale(${lateWidthRatio},${lateHeightRatio})`;
|
||||
}
|
||||
}, 10);
|
||||
}
|
||||
const updateStyleDebounced = debounce(updateStyle, 150);
|
||||
onMounted(() => {
|
||||
proxy.$nextTick(() => {
|
||||
// 监控屏幕尺寸变化
|
||||
resizeObserver.observe(document.documentElement);
|
||||
|
||||
// 初始化屏幕尺寸
|
||||
screenWidth.value = document.documentElement.clientWidth;
|
||||
screenHeight.value = document.documentElement.clientHeight;
|
||||
});
|
||||
});
|
||||
onUnmounted(() => {
|
||||
// 清除监听
|
||||
resizeObserver.disconnect();
|
||||
// 清除debounce函数中设置的timeout
|
||||
clearTimeout(resizeTimeout.value);
|
||||
// resizeObserver.unobserve(document.documentElement);
|
||||
});
|
||||
|
||||
/// ===============================================================
|
||||
543
src/views/qualityManagement/FQC/qualityStatistics-backup.vue
Normal file
543
src/views/qualityManagement/FQC/qualityStatistics-backup.vue
Normal file
@@ -0,0 +1,543 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 搜索部分 -->
|
||||
<div>
|
||||
<el-form :model="search" inline size="mini" label-width="80px">
|
||||
<el-form-item label="开始日期">
|
||||
<el-date-picker :clearable="false" :style="{ width: inputWidth }" v-model="search.starttime" type="datetime" placeholder="选择日期时间" align="right" :picker-options="pickerOptions">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束日期">
|
||||
<el-date-picker :clearable="false" :style="{ width: inputWidth }" v-model="search.endtime" type="datetime" placeholder="选择日期时间" align="right" :picker-options="pickerOptions">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="工单号">
|
||||
<el-input v-model.trim="search.workorderid" placeholder="输入工单号" :style="{ width: inputWidth }"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="零件号">
|
||||
<el-input v-model.trim="search.partnumber" placeholder="输入零件号" :style="{ width: inputWidth }"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品描述">
|
||||
<el-input v-model.trim="search.product_description" placeholder="输入产品描述" :style="{ width: inputWidth }"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班组">
|
||||
<el-select v-model="search.team" placeholder="输入班组" :style="{ width: inputWidth }">
|
||||
<el-option label="A班" value="A"> </el-option>
|
||||
<el-option label="B班" value="B"> </el-option>
|
||||
<el-option label="" value=""> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报表类型">
|
||||
<el-select v-model="search.reportType" placeholder="请选择" :style="{ width: inputWidth }">
|
||||
<el-option v-for="item in reportType_options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label=" ">
|
||||
<el-button size="mini" type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
|
||||
<el-button size="mini" type="warning" @click="exportAllDataEvent(false)">日生产报表导出</el-button>
|
||||
<el-button size="mini" type="success" @click="exportAllDataEvent(true)">缺陷详情导出</el-button>
|
||||
<!-- <el-button size="mini" type="success" @click="exportDataEvent">缺陷详情导出</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div style="width: 100%; display: flex; justify-content: flex-end">
|
||||
<pagination :pageSizes="[12, 60, 120, 300]" :total="pagination.total" :page.sync="pagination.pageNum" :limit.sync="pagination.pageSize" @pagination="getList" />
|
||||
</div>
|
||||
<div style="width: 100%">
|
||||
<div style="font-size: 20px;text-align: center; margin 0 auto">
|
||||
{{ reportType_options[search.reportType].label }} 共 {{ realTotal }} 条
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格部分 -->
|
||||
<vxe-table @menu-click="contextMenuClickEvent" :menu-config="tableMenu" border resizable show-overflow :header-cell-style="headerCellStyle" ref="xTable" :column-config="{ resizable: true }" :row-config="{ isHover: true, isCurrent: true, height: 20 }" :loading="loading" :data="QualityStatisticsTable" :merge-cells="mergeCells" :cell-style="cellStyle" size="mini" align="center" max-height="800px" :export-config="{}">
|
||||
<vxe-colgroup title="订单信息" align="center" fixed="left">
|
||||
<vxe-column field="workorderId" title="工单号" width="140px" sortable></vxe-column>
|
||||
<vxe-column field="finishedPartNumber" title="零件号" min-width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="color" title="颜色" min-width="100px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="productDescription" title="描述" min-width="100px" :show-overflow="false"></vxe-column>
|
||||
<vxe-column field="requireNumber" title="生 产 投 入 数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="team" title="班次" sortable></vxe-column>
|
||||
<vxe-column field="qualifiedNumber" title="合 格 数" min-width="60px"></vxe-column>
|
||||
<vxe-column title="合格率" min-width="70px">
|
||||
<template #default="{ row }"> {{ offsetRate(row.qualifiedRate) }}% </template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paoguangTotal" title="抛光总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="damoTotal" title="打磨总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="baofeiTotal" title="报废总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="startTime" title="开始时间" width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="endTime" title="结束时间" width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="remark" title="备注" width="60px"></vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="油漆" align="center">
|
||||
<vxe-column field="paintSuokong" title="缩 孔" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintSuokong) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paintZhengkong" title="针 孔" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintZhengkong) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paintShiguang" title="失 光" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintShiguang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paintSecha" title="色 差" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintSecha) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paintDianzi" title="点 子" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintDianzi) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paintOther" title="其 他" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.paintOther) }}</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="设备" align="center">
|
||||
<vxe-column field="deviceShuiban" title="水 斑" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceShuiban) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceZandian" title="脏 点" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceZandian) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceBianxing" title="变 形" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceBianxing) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceYouzhu" title="油 珠" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceYouzhu) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceTuoluo" title="脱 落" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceTuoluo) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceZhuangshang" title="撞 伤" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceZhuangshang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="deviceOther" title="其 他" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.deviceOther) }}</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="毛坯" align="center">
|
||||
<vxe-column field="blankMaoci" title="毛 刺" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankMaoci) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="blankSuoyin" title="缩 印" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankSuoyin) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="blankCanshuang" title="擦 伤" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankCanshuang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="blankShaying" title="砂 印" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankShaying) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="blankZangdian" title="脏 点" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankZangdian) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="blankDamo" title="打 磨" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.blankDamo) }}</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="程序" align="center">
|
||||
<vxe-column field="programLiuguang" title="流 挂" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.programLiuguang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="programSeqiqueqi" title="色 漆 缺 漆" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.programSeqiqueqi) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="programQingqiqueqi" title="清 漆 缺 漆" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.programQingqiqueqi) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="programJupi" title="桔 皮" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.programJupi) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="programOther" title="其 他" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.programOther) }}</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="班组操作" align="center">
|
||||
<vxe-column field="teamTuoluocanshuang" title="脱 落 擦 伤" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamTuoluocanshuang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="teamQingqiqikuai" title="清 漆 漆 块" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamQingqiqikuai) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="teamSeqiqikuai" title="色 漆 漆 块" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamSeqiqikuai) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="teamFahua" title="发 花" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamFahua) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="teamLiangbang" title="亮 斑" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamLiangbang) }}</template>
|
||||
</vxe-column>
|
||||
<vxe-column field="teamPenglou" title="喷 漏" min-width="60px">
|
||||
<template #default="{ row }"> {{ offsetValue(row.teamPenglou) }}</template>
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
GetQualityStatisticsTable_first,
|
||||
GetQualityStatisticsTable_again,
|
||||
GetQualityStatisticsTable_final,
|
||||
GetQualityStatisticsTable_total,
|
||||
deleteStatisticsTable,
|
||||
downloadStatisticsTableExcel
|
||||
} from '@/api/qualityManagement/qualityStatistics_V2'
|
||||
export default {
|
||||
name: 'QualityStatistics',
|
||||
data() {
|
||||
return {
|
||||
inputWidth: '180px',
|
||||
pickerOptions: {
|
||||
shortcuts: [
|
||||
{
|
||||
text: '今天',
|
||||
onClick(picker) {
|
||||
picker.$emit('pick', new Date())
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '昨天',
|
||||
onClick(picker) {
|
||||
const date = new Date()
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24)
|
||||
picker.$emit('pick', date)
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '一周前',
|
||||
onClick(picker) {
|
||||
const date = new Date()
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
|
||||
picker.$emit('pick', date)
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
search: {
|
||||
starttime: null,
|
||||
endtime: null,
|
||||
team: null,
|
||||
workorderid: null,
|
||||
partnumber: null,
|
||||
reportType: 0,
|
||||
product_description: '',
|
||||
},
|
||||
reportType_options: [
|
||||
{ label: '首检报表', value: 0 },
|
||||
{ label: '抛光报表', value: 1 },
|
||||
{ label: '包装报表', value: 2 },
|
||||
{ label: '总报表', value: 3 },
|
||||
],
|
||||
pagination: {
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 60,
|
||||
},
|
||||
realTotal: 0,
|
||||
loading: false,
|
||||
QualityStatisticsTable: [],
|
||||
mergeCells: [
|
||||
// { row: 0, col: 0, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 1, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 2, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 3, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 4, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 5, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 6, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 7, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 8, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 9, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 10, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 11, rowspan: 3, colspan: 0 },
|
||||
],
|
||||
hiddenCells: [],
|
||||
// 列表对照表
|
||||
tableCellDict: [],
|
||||
// 右键菜单
|
||||
tableMenu: {
|
||||
header: {
|
||||
options: [
|
||||
[
|
||||
{ code: 'hideColumn', name: '隐藏列', disabled: false },
|
||||
{ code: 'showAllColumn', name: '取消所有隐藏列', disabled: false },
|
||||
],
|
||||
],
|
||||
},
|
||||
body: {
|
||||
options: [
|
||||
[
|
||||
// { code: 'copy', name: '复制', prefixIcon: 'vxe-icon-copy', disabled: false },
|
||||
// { code: 'reload', name: '刷新', disabled: false },
|
||||
// { code: 'insertAt', name: '插入', disabled: false },
|
||||
{ code: 'remove', name: '删除', disabled: false },
|
||||
// { code: 'save', name: '保存', prefixIcon: 'vxe-icon-save', disabled: false },
|
||||
{ code: 'update', name: '修改', disabled: false },
|
||||
],
|
||||
],
|
||||
},
|
||||
visibleMethod: this.visibleMethod,
|
||||
},
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'search.starttime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsStartTime', JSON.stringify(newValue))
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
}
|
||||
},
|
||||
'search.endtime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsEndTime', JSON.stringify(newValue))
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
const QualityStatisticsStartTime = JSON.parse(window.sessionStorage.getItem("QualityStatisticsStartTime"));
|
||||
const QualityStatisticsEndTime = JSON.parse(window.sessionStorage.getItem("QualityStatisticsEndTime"));
|
||||
if (this.search.starttime == null) {
|
||||
if (QualityStatisticsStartTime) {
|
||||
this.search.starttime = QualityStatisticsStartTime;
|
||||
} else {
|
||||
this.search.starttime = this.$dayjs().startOf('day').toDate();
|
||||
}
|
||||
}
|
||||
if (this.search.endtime == null) {
|
||||
if (QualityStatisticsEndTime) {
|
||||
this.search.endtime = QualityStatisticsEndTime;
|
||||
} else {
|
||||
this.search.endtime = this.$dayjs().endOf('day').toDate();
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
//todo 设置表合并行
|
||||
mergeTable(num) {
|
||||
this.mergeCells = []
|
||||
for (let i = 0; i < this.QualityStatisticsTable.length; i = i + num) {
|
||||
let count = 13 - this.hiddenCells.length;
|
||||
for (let j = 0; j < count; j++) {
|
||||
this.mergeCells.push({ row: i, col: j, rowspan: num, colspan: 0 })
|
||||
}
|
||||
// if(this.hiddenCells.includes('工单号')){
|
||||
|
||||
// }
|
||||
// this.mergeCells.push({ row: i, col: 10, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 11, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 12, rowspan: num, colspan: 0 })
|
||||
}
|
||||
},
|
||||
|
||||
//todo 获取统计数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 30000)
|
||||
let query = { ...this.search, ...this.pagination }
|
||||
delete query['reportType']
|
||||
delete query['total']
|
||||
switch (this.search.reportType) {
|
||||
case 0:
|
||||
GetQualityStatisticsTable_first(query).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.QualityStatisticsTable = res.data.item1
|
||||
this.pagination.total = res.data.item2
|
||||
this.realTotal = parseInt(res.data.item2 / 3)
|
||||
this.mergeTable(3)
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
break
|
||||
case 1:
|
||||
GetQualityStatisticsTable_again(query).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.QualityStatisticsTable = res.data.item1
|
||||
this.pagination.total = res.data.item2
|
||||
this.realTotal = parseInt(res.data.item2 / 2)
|
||||
this.mergeTable(2)
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
break
|
||||
case 2:
|
||||
GetQualityStatisticsTable_final(query).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.QualityStatisticsTable = res.data.item1
|
||||
this.pagination.total = res.data.item2
|
||||
this.realTotal = parseInt(res.data.item2 / 3)
|
||||
this.mergeTable(3)
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
break
|
||||
case 3:
|
||||
GetQualityStatisticsTable_total(query).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.QualityStatisticsTable = res.data.item1
|
||||
this.pagination.total = res.data.item2
|
||||
this.realTotal = parseInt(res.data.item2 / 3)
|
||||
this.mergeTable(3)
|
||||
this.loading = false
|
||||
}
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
|
||||
//todo 设置表头颜色
|
||||
headerCellStyle() {
|
||||
return {
|
||||
backgroundColor: '#2D3D51',
|
||||
color: '#ffffff',
|
||||
border: '1px solid #161823',
|
||||
fontSize: '18px',
|
||||
}
|
||||
},
|
||||
|
||||
cellStyle() {
|
||||
return {
|
||||
border: '1px solid #161823',
|
||||
fontSize: '16px',
|
||||
fontWeight: '700',
|
||||
}
|
||||
},
|
||||
|
||||
//todo 导出excel
|
||||
exportDataEvent() {
|
||||
this.$refs.xTable.openExport()
|
||||
},
|
||||
// 导出全部数据
|
||||
exportAllDataEvent(isShowDetail = false) {
|
||||
let data = { ...this.search, ...this.pagination };
|
||||
data.type = this.search.reportType + 1;
|
||||
data.isShowDetail = isShowDetail;
|
||||
let fileName = this.reportType_options[this.search.reportType].label + (isShowDetail ? '-缺陷详情' : '-日生产报表') + '.xlsx';
|
||||
downloadStatisticsTableExcel(data).then(res => {
|
||||
console.log(res);
|
||||
let blobURL = URL.createObjectURL(res.data)
|
||||
//创建标签
|
||||
let link = document.createElement('a')
|
||||
//设置href
|
||||
link.href = blobURL
|
||||
//设置a标签的行为是download,不然就跳转了,同时设置名字是"test.ppt"
|
||||
link.download = fileName;
|
||||
//隐藏a标签，他只是下载，没必要出现
|
||||
link.style.display = "none"
|
||||
//模拟点击
|
||||
link.click()
|
||||
//最后，把这个URL进行销毁,免得他占内存
|
||||
URL.revokeObjectURL()
|
||||
})
|
||||
// this.download('/mes/qc/statistics/downloadStatisticsTableExcel');
|
||||
},
|
||||
// 合格率去除小数
|
||||
offsetRate(num) {
|
||||
if (num === null) {
|
||||
return ''
|
||||
}
|
||||
return parseInt(num)
|
||||
},
|
||||
// 数据去除0
|
||||
offsetValue(num) {
|
||||
if (num === 0 || num === '0') {
|
||||
return ''
|
||||
}
|
||||
return num
|
||||
},
|
||||
// 右键菜单
|
||||
contextMenuClickEvent({ menu, row, column }) {
|
||||
const $table = this.$refs.xTable
|
||||
switch (menu.code) {
|
||||
case 'hideColumn':
|
||||
this.hideColumn(column);
|
||||
break
|
||||
case 'showAllColumn':
|
||||
this.resetColumn()
|
||||
break
|
||||
case 'remove':
|
||||
this.removeData(row)
|
||||
// $table.remove(row)
|
||||
case 'update':
|
||||
this.updateData(row)
|
||||
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() {
|
||||
if (this.search.reportType === 3) {
|
||||
this.mergeTable(2);
|
||||
} else {
|
||||
this.mergeTable(3);
|
||||
}
|
||||
|
||||
},
|
||||
// 删除数据
|
||||
removeData(row) {
|
||||
this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
const deleteData = {
|
||||
workorderid: row.workorderId,
|
||||
}
|
||||
deleteStatisticsTable(deleteData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!',
|
||||
})
|
||||
this.getList()
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败!请检查!',
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
//修改数据
|
||||
updateDate(row) {
|
||||
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
@@ -4,11 +4,27 @@
|
||||
<div>
|
||||
<el-form :model="search" inline size="mini" label-width="80px">
|
||||
<el-form-item label="开始日期">
|
||||
<el-date-picker :clearable="false" :style="{ width: inputWidth }" v-model="search.starttime" type="datetime" placeholder="选择日期时间" align="right" :picker-options="pickerOptions">
|
||||
<el-date-picker
|
||||
:clearable="false"
|
||||
:style="{ width: inputWidth }"
|
||||
v-model="search.starttime"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间"
|
||||
align="right"
|
||||
:picker-options="pickerOptions"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="结束日期">
|
||||
<el-date-picker :clearable="false" :style="{ width: inputWidth }" v-model="search.endtime" type="datetime" placeholder="选择日期时间" align="right" :picker-options="pickerOptions">
|
||||
<el-date-picker
|
||||
:clearable="false"
|
||||
:style="{ width: inputWidth }"
|
||||
v-model="search.endtime"
|
||||
type="datetime"
|
||||
placeholder="选择日期时间"
|
||||
align="right"
|
||||
:picker-options="pickerOptions"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="工单号">
|
||||
@@ -20,28 +36,44 @@
|
||||
<el-form-item label="产品描述">
|
||||
<el-input v-model.trim="search.product_description" placeholder="输入产品描述" :style="{ width: inputWidth }"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="班组">
|
||||
<el-select v-model="search.team" placeholder="输入班组" :style="{ width: inputWidth }">
|
||||
<el-option label="A班" value="A"> </el-option>
|
||||
<el-option label="B班" value="B"> </el-option>
|
||||
<el-option label="" value=""> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报表类型">
|
||||
<el-select v-model="search.reportType" placeholder="请选择" :style="{ width: inputWidth }">
|
||||
<el-option v-for="item in reportType_options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label=" ">
|
||||
<el-button size="mini" type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
|
||||
<el-button size="mini" type="warning" @click="exportAllDataEvent(false)">日生产报表导出</el-button>
|
||||
<el-button size="mini" type="success" @click="exportAllDataEvent(true)">缺陷详情导出</el-button>
|
||||
<!-- <el-button size="mini" type="success" @click="exportDataEvent">缺陷详情导出</el-button> -->
|
||||
</el-form-item>
|
||||
<div>
|
||||
<el-form-item label="班组">
|
||||
<el-select v-model="search.team" placeholder="输入班组" :style="{ width: inputWidth }">
|
||||
<el-option label="A班" value="A"> </el-option>
|
||||
<el-option label="B班" value="B"> </el-option>
|
||||
<el-option label="" value=""> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报表类型">
|
||||
<el-select v-model="search.reportType" placeholder="请选择" :style="{ width: inputWidth }">
|
||||
<el-option v-for="item in reportType_options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序方式">
|
||||
<el-select v-model="search.sortType" placeholder="请选择排序方式" :style="{ width: inputWidth }">
|
||||
<el-option label="开始时间" :value="0"> </el-option>
|
||||
<el-option label="合格率" :value="1"> </el-option>
|
||||
<el-option label="物料描述" :value="2"> </el-option>
|
||||
<el-option label="零件号" :value="3"> </el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label=" ">
|
||||
<el-button size="mini" type="primary" icon="el-icon-search" @click="getList">搜索</el-button>
|
||||
<el-button size="mini" type="warning" @click="exportAllDataEvent(false)">日生产报表导出</el-button>
|
||||
<el-button size="mini" type="success" @click="exportAllDataEvent(true)">缺陷详情导出</el-button>
|
||||
<!-- <el-button size="mini" type="success" @click="exportDataEvent">缺陷详情导出</el-button> -->
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<div style="width: 100%; display: flex; justify-content: flex-end">
|
||||
<pagination :pageSizes="[12, 60, 120, 300]" :total="pagination.total" :page.sync="pagination.pageNum" :limit.sync="pagination.pageSize" @pagination="getList" />
|
||||
<pagination
|
||||
:pageSizes="[12, 30, 60, 300]"
|
||||
:total="pagination.total"
|
||||
:page.sync="pagination.pageNum"
|
||||
:limit.sync="pagination.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
<div style="width: 100%">
|
||||
<div style="font-size: 20px;text-align: center; margin 0 auto">
|
||||
@@ -49,24 +81,45 @@
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格部分 -->
|
||||
<vxe-table @menu-click="contextMenuClickEvent" :menu-config="tableMenu" border resizable show-overflow :header-cell-style="headerCellStyle" ref="xTable" :column-config="{ resizable: true }" :row-config="{ isHover: true, isCurrent: true, height: 20 }" :loading="loading" :data="QualityStatisticsTable" :merge-cells="mergeCells" :cell-style="cellStyle" size="mini" align="center" max-height="800px" :export-config="{}">
|
||||
<!--
|
||||
:scroll-y="{ enabled: true, gt: 0 }"
|
||||
:scroll-x="{ enabled: true, gt: 0 }"
|
||||
-->
|
||||
<vxe-table
|
||||
@menu-click="contextMenuClickEvent"
|
||||
:menu-config="tableMenu"
|
||||
border
|
||||
resizable
|
||||
:header-cell-style="headerCellStyle"
|
||||
ref="xTable"
|
||||
:column-config="{ resizable: true }"
|
||||
:loading="loading"
|
||||
:data="QualityStatisticsTable"
|
||||
:merge-cells="mergeCells"
|
||||
:cell-style="cellStyle"
|
||||
size="mini"
|
||||
align="center"
|
||||
height="860px"
|
||||
:export-config="{}"
|
||||
:row-config="{ isHover: true, isCurrent: true, height: 60 }"
|
||||
>
|
||||
<vxe-colgroup title="订单信息" align="center" fixed="left">
|
||||
<vxe-column field="workorderId" title="工单号" width="140px" sortable></vxe-column>
|
||||
<vxe-column field="finishedPartNumber" title="零件号" min-width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="color" title="颜色" min-width="100px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="productDescription" title="描述" min-width="100px" :show-overflow="false"></vxe-column>
|
||||
<vxe-column field="requireNumber" title="生 产 投 入 数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="team" title="班次" sortable></vxe-column>
|
||||
<vxe-column field="qualifiedNumber" title="合 格 数" min-width="60px"></vxe-column>
|
||||
<vxe-column title="合格率" min-width="70px">
|
||||
<vxe-column field="workorderId" title="工单号" width="120px"></vxe-column>
|
||||
<vxe-column field="finishedPartNumber" title="零件号" width="180px"></vxe-column>
|
||||
<vxe-column field="color" title="颜色" width="100px"></vxe-column>
|
||||
<vxe-column field="productDescription" title="描述" width="100px"></vxe-column>
|
||||
<vxe-column field="requireNumber" title="投入数" width="80px"></vxe-column>
|
||||
<vxe-column field="team" title="班次"></vxe-column>
|
||||
<vxe-column field="qualifiedNumber" title="合格数" width="80px"></vxe-column>
|
||||
<vxe-column title="合格率" width="80px">
|
||||
<template #default="{ row }"> {{ offsetRate(row.qualifiedRate) }}% </template>
|
||||
</vxe-column>
|
||||
<vxe-column field="paoguangTotal" title="抛光总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="damoTotal" title="打磨总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="baofeiTotal" title="报废总数" min-width="60px"></vxe-column>
|
||||
<vxe-column field="startTime" title="开始时间" width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="endTime" title="结束时间" width="120px" :show-overflow="false" sortable></vxe-column>
|
||||
<vxe-column field="remark" title="备注" width="60px"></vxe-column>
|
||||
<vxe-column field="startTime" title="开始时间" width="120px"></vxe-column>
|
||||
<vxe-column field="endTime" title="结束时间" width="120px"></vxe-column>
|
||||
<vxe-column field="remark" title="备注" width="60px"> </vxe-column>
|
||||
</vxe-colgroup>
|
||||
|
||||
<vxe-colgroup title="油漆" align="center">
|
||||
@@ -174,27 +227,25 @@
|
||||
</vxe-column>
|
||||
</vxe-colgroup>
|
||||
</vxe-table>
|
||||
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
GetQualityStatisticsTable_first,
|
||||
GetQualityStatisticsTable_again,
|
||||
GetQualityStatisticsTable_final,
|
||||
GetQualityStatisticsTable_total,
|
||||
deleteStatisticsTable,
|
||||
downloadStatisticsTableExcel
|
||||
} from '@/api/qualityManagement/qualityStatistics_V2'
|
||||
export default {
|
||||
name: 'QualityStatistics',
|
||||
data() {
|
||||
return {
|
||||
inputWidth: '180px',
|
||||
pickerOptions: {
|
||||
shortcuts: [
|
||||
import {
|
||||
GetQualityStatisticsTable_first,
|
||||
GetQualityStatisticsTable_again,
|
||||
GetQualityStatisticsTable_final,
|
||||
GetQualityStatisticsTable_total,
|
||||
deleteStatisticsTable,
|
||||
downloadStatisticsTableExcel,
|
||||
} from '@/api/qualityManagement/qualityStatistics_V2'
|
||||
export default {
|
||||
name: 'QualityStatistics',
|
||||
data() {
|
||||
return {
|
||||
inputWidth: '180px',
|
||||
pickerOptions: {
|
||||
shortcuts: [
|
||||
{
|
||||
text: '今天',
|
||||
onClick(picker) {
|
||||
@@ -216,147 +267,159 @@
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
|
||||
picker.$emit('pick', date)
|
||||
},
|
||||
}, ],
|
||||
},
|
||||
search: {
|
||||
starttime: null,
|
||||
endtime: null,
|
||||
team: null,
|
||||
workorderid: null,
|
||||
partnumber: null,
|
||||
reportType: 0,
|
||||
product_description: '',
|
||||
},
|
||||
reportType_options: [
|
||||
{ label: '首检报表', value: 0 },
|
||||
{ label: '抛光报表', value: 1 },
|
||||
{ label: '包装报表', value: 2 },
|
||||
{ label: '总报表', value: 3 },
|
||||
],
|
||||
pagination: {
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 60,
|
||||
},
|
||||
realTotal: 0,
|
||||
loading: false,
|
||||
QualityStatisticsTable: [],
|
||||
mergeCells: [
|
||||
// { row: 0, col: 0, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 1, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 2, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 3, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 4, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 5, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 6, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 7, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 8, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 9, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 10, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 11, rowspan: 3, colspan: 0 },
|
||||
],
|
||||
hiddenCells: [],
|
||||
// 列表对照表
|
||||
tableCellDict: [],
|
||||
// 右键菜单
|
||||
tableMenu: {
|
||||
header: {
|
||||
options: [
|
||||
[
|
||||
{ code: 'hideColumn', name: '隐藏列', disabled: false },
|
||||
{ code: 'showAllColumn', name: '取消所有隐藏列', disabled: false },
|
||||
],
|
||||
],
|
||||
},
|
||||
body: {
|
||||
options: [
|
||||
[
|
||||
// { code: 'copy', name: '复制', prefixIcon: 'vxe-icon-copy', disabled: false },
|
||||
// { code: 'reload', name: '刷新', disabled: false },
|
||||
// { code: 'insertAt', name: '插入', disabled: false },
|
||||
{ code: 'remove', name: '删除', disabled: false },
|
||||
// { code: 'save', name: '保存', prefixIcon: 'vxe-icon-save', disabled: false },
|
||||
{ code: 'update', name: '修改', disabled: false },
|
||||
],
|
||||
],
|
||||
},
|
||||
search: {
|
||||
starttime: null,
|
||||
endtime: null,
|
||||
team: null,
|
||||
workorderid: null,
|
||||
partnumber: null,
|
||||
sortType: 0,
|
||||
reportType: 0,
|
||||
product_description: '',
|
||||
},
|
||||
reportType_options: [
|
||||
{ label: '首检报表', value: 0 },
|
||||
{ label: '抛光报表', value: 1 },
|
||||
{ label: '包装报表', value: 2 },
|
||||
{ label: '总报表', value: 3 },
|
||||
],
|
||||
pagination: {
|
||||
total: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 30,
|
||||
},
|
||||
realTotal: 0,
|
||||
loading: false,
|
||||
QualityStatisticsTable: [],
|
||||
mergeCells: [
|
||||
// { row: 0, col: 0, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 1, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 2, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 3, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 4, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 5, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 6, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 7, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 8, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 9, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 10, rowspan: 3, colspan: 0 },
|
||||
// { row: 0, col: 11, rowspan: 3, colspan: 0 },
|
||||
],
|
||||
hiddenCells: [],
|
||||
// 列表对照表
|
||||
tableCellDict: [],
|
||||
// 右键菜单
|
||||
tableMenu: {
|
||||
header: {
|
||||
options: [
|
||||
[
|
||||
{ code: 'hideColumn', name: '隐藏列', disabled: false },
|
||||
{ code: 'showAllColumn', name: '取消所有隐藏列', disabled: false },
|
||||
],
|
||||
},
|
||||
visibleMethod: this.visibleMethod,
|
||||
],
|
||||
},
|
||||
body: {
|
||||
options: [
|
||||
[
|
||||
// { code: 'copy', name: '复制', prefixIcon: 'vxe-icon-copy', disabled: false },
|
||||
// { code: 'reload', name: '刷新', disabled: false },
|
||||
// { code: 'insertAt', name: '插入', disabled: false },
|
||||
{ code: 'remove', name: '删除', disabled: false },
|
||||
// { code: 'save', name: '保存', prefixIcon: 'vxe-icon-save', disabled: false },
|
||||
{ code: 'update', name: '修改', disabled: false },
|
||||
],
|
||||
],
|
||||
},
|
||||
visibleMethod: this.visibleMethod,
|
||||
},
|
||||
|
||||
// 自适应
|
||||
screenWidth: '1920px',
|
||||
screenHeight: '1080px',
|
||||
resizeObserver: null,
|
||||
resizeTimeout: null,
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'search.starttime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsStartTime', JSON.stringify(newValue))
|
||||
} catch (err) {}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'search.starttime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsStartTime', JSON.stringify(newValue))
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
'search.endtime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsEndTime', JSON.stringify(newValue))
|
||||
} catch (err) {}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
this.initReload()
|
||||
this.reloadWindows()
|
||||
},
|
||||
onUnmounted() {
|
||||
// 清除监听
|
||||
this.resizeObserver.disconnect()
|
||||
// 清除debounce函数中设置的timeout
|
||||
clearTimeout(this.resizeTimeout)
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
// 缓存历史记录
|
||||
const QualityStatisticsStartTime = JSON.parse(window.sessionStorage.getItem('QualityStatisticsStartTime'))
|
||||
const QualityStatisticsEndTime = JSON.parse(window.sessionStorage.getItem('QualityStatisticsEndTime'))
|
||||
if (this.search.starttime == null) {
|
||||
if (QualityStatisticsStartTime) {
|
||||
this.search.starttime = QualityStatisticsStartTime
|
||||
} else {
|
||||
this.search.starttime = this.$dayjs().startOf('day').toDate()
|
||||
}
|
||||
},
|
||||
'search.endtime'(newValue, oldValue) {
|
||||
if (newValue != null && newValue != oldValue) {
|
||||
try {
|
||||
window.sessionStorage.setItem('QualityStatisticsEndTime', JSON.stringify(newValue))
|
||||
} catch (err) {
|
||||
|
||||
}
|
||||
}
|
||||
if (this.search.endtime == null) {
|
||||
if (QualityStatisticsEndTime) {
|
||||
this.search.endtime = QualityStatisticsEndTime
|
||||
} else {
|
||||
this.search.endtime = this.$dayjs().endOf('day').toDate()
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getList()
|
||||
//todo 设置表合并行
|
||||
mergeTable(num) {
|
||||
this.mergeCells = []
|
||||
for (let i = 0; i < this.QualityStatisticsTable.length; i = i + num) {
|
||||
let count = 13 - this.hiddenCells.length
|
||||
for (let j = 0; j < count; j++) {
|
||||
this.mergeCells.push({ row: i, col: j, rowspan: num, colspan: 0 })
|
||||
}
|
||||
// if(this.hiddenCells.includes('工单号')){
|
||||
|
||||
// }
|
||||
// this.mergeCells.push({ row: i, col: 10, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 11, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 12, rowspan: num, colspan: 0 })
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
const QualityStatisticsStartTime = JSON.parse(window.sessionStorage.getItem("QualityStatisticsStartTime"));
|
||||
const QualityStatisticsEndTime = JSON.parse(window.sessionStorage.getItem("QualityStatisticsEndTime"));
|
||||
if (this.search.starttime == null) {
|
||||
if (QualityStatisticsStartTime) {
|
||||
this.search.starttime = QualityStatisticsStartTime;
|
||||
} else {
|
||||
this.search.starttime = this.$dayjs().startOf('day').toDate();
|
||||
}
|
||||
}
|
||||
if (this.search.endtime == null) {
|
||||
if (QualityStatisticsEndTime) {
|
||||
this.search.endtime = QualityStatisticsEndTime;
|
||||
} else {
|
||||
this.search.endtime = this.$dayjs().endOf('day').toDate();
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
//todo 设置表合并行
|
||||
mergeTable(num) {
|
||||
this.mergeCells = []
|
||||
for (let i = 0; i < this.QualityStatisticsTable.length; i = i + num) {
|
||||
let count = 13 - this.hiddenCells.length;
|
||||
for (let j = 0; j < count; j++) {
|
||||
this.mergeCells.push({ row: i, col: j, rowspan: num, colspan: 0 })
|
||||
}
|
||||
// if(this.hiddenCells.includes('工单号')){
|
||||
|
||||
// }
|
||||
// this.mergeCells.push({ row: i, col: 10, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 11, rowspan: num, colspan: 0 })
|
||||
// this.mergeCells.push({ row: i, col: 12, rowspan: num, colspan: 0 })
|
||||
}
|
||||
},
|
||||
|
||||
//todo 获取统计数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 30000)
|
||||
let query = { ...this.search, ...this.pagination }
|
||||
delete query['reportType']
|
||||
delete query['total']
|
||||
switch (this.search.reportType) {
|
||||
//todo 获取统计数据
|
||||
getList() {
|
||||
this.loading = true
|
||||
setTimeout(() => {
|
||||
this.loading = false
|
||||
}, 30000)
|
||||
let query = { ...this.search, ...this.pagination }
|
||||
delete query['reportType']
|
||||
delete query['total']
|
||||
switch (this.search.reportType) {
|
||||
case 0:
|
||||
GetQualityStatisticsTable_first(query).then((res) => {
|
||||
if (res.code == 200) {
|
||||
@@ -401,143 +464,195 @@
|
||||
}
|
||||
})
|
||||
break
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
|
||||
//todo 设置表头颜色
|
||||
headerCellStyle() {
|
||||
return {
|
||||
backgroundColor: '#2D3D51',
|
||||
color: '#ffffff',
|
||||
border: '1px solid #161823',
|
||||
fontSize: '18px',
|
||||
}
|
||||
},
|
||||
//todo 设置表头颜色
|
||||
headerCellStyle() {
|
||||
return {
|
||||
backgroundColor: '#2D3D51',
|
||||
color: '#ffffff',
|
||||
border: '1px solid #161823',
|
||||
fontSize: '18px',
|
||||
}
|
||||
},
|
||||
|
||||
cellStyle() {
|
||||
return {
|
||||
border: '1px solid #161823',
|
||||
fontSize: '16px',
|
||||
fontWeight: '700',
|
||||
}
|
||||
},
|
||||
cellStyle() {
|
||||
return {
|
||||
border: '1px solid #161823',
|
||||
fontSize: '16px',
|
||||
fontWeight: '700',
|
||||
}
|
||||
},
|
||||
|
||||
//todo 导出excel
|
||||
exportDataEvent() {
|
||||
this.$refs.xTable.openExport()
|
||||
},
|
||||
// 导出全部数据
|
||||
exportAllDataEvent(isShowDetail = false) {
|
||||
let data = { ...this.search, ...this.pagination };
|
||||
data.type = this.search.reportType + 1;
|
||||
data.isShowDetail = isShowDetail;
|
||||
let fileName = this.reportType_options[this.search.reportType].label + (isShowDetail ? '-缺陷详情' : '-日生产报表') + '.xlsx';
|
||||
downloadStatisticsTableExcel(data).then(res => {
|
||||
console.log(res);
|
||||
let blobURL = URL.createObjectURL(res.data)
|
||||
//创建标签
|
||||
let link = document.createElement('a')
|
||||
//设置href
|
||||
link.href = blobURL
|
||||
//设置a标签的行为是download,不然就跳转了,同时设置名字是"test.ppt"
|
||||
link.download = fileName;
|
||||
//隐藏a标签，他只是下载，没必要出现
|
||||
link.style.display = "none"
|
||||
//模拟点击
|
||||
link.click()
|
||||
//最后，把这个URL进行销毁,免得他占内存
|
||||
URL.revokeObjectURL()
|
||||
})
|
||||
// this.download('/mes/qc/statistics/downloadStatisticsTableExcel');
|
||||
},
|
||||
// 合格率去除小数
|
||||
offsetRate(num) {
|
||||
if (num === null) {
|
||||
return ''
|
||||
}
|
||||
return parseInt(num)
|
||||
},
|
||||
// 数据去除0
|
||||
offsetValue(num) {
|
||||
if (num === 0 || num === '0') {
|
||||
return ''
|
||||
}
|
||||
return num
|
||||
},
|
||||
// 右键菜单
|
||||
contextMenuClickEvent({ menu, row, column }) {
|
||||
const $table = this.$refs.xTable
|
||||
switch (menu.code) {
|
||||
//todo 导出excel
|
||||
exportDataEvent() {
|
||||
this.$refs.xTable.openExport()
|
||||
},
|
||||
// 导出全部数据
|
||||
exportAllDataEvent(isShowDetail = false) {
|
||||
let data = { ...this.search, ...this.pagination }
|
||||
data.type = this.search.reportType + 1
|
||||
data.isShowDetail = isShowDetail
|
||||
let fileName = this.reportType_options[this.search.reportType].label + (isShowDetail ? '-缺陷详情' : '-日生产报表') + '.xlsx'
|
||||
downloadStatisticsTableExcel(data).then((res) => {
|
||||
console.log(res)
|
||||
let blobURL = URL.createObjectURL(res.data)
|
||||
//创建标签
|
||||
let link = document.createElement('a')
|
||||
//设置href
|
||||
link.href = blobURL
|
||||
//设置a标签的行为是download,不然就跳转了,同时设置名字是"test.ppt"
|
||||
link.download = fileName
|
||||
//隐藏a标签，他只是下载，没必要出现
|
||||
link.style.display = 'none'
|
||||
//模拟点击
|
||||
link.click()
|
||||
//最后，把这个URL进行销毁,免得他占内存
|
||||
URL.revokeObjectURL()
|
||||
})
|
||||
// this.download('/mes/qc/statistics/downloadStatisticsTableExcel');
|
||||
},
|
||||
// 合格率去除小数
|
||||
offsetRate(num) {
|
||||
if (num === null) {
|
||||
return ''
|
||||
}
|
||||
return parseInt(num)
|
||||
},
|
||||
// 数据去除0
|
||||
offsetValue(num) {
|
||||
if (num === 0 || num === '0') {
|
||||
return ''
|
||||
}
|
||||
return num
|
||||
},
|
||||
// 右键菜单
|
||||
contextMenuClickEvent({ menu, row, column }) {
|
||||
const $table = this.$refs.xTable
|
||||
switch (menu.code) {
|
||||
case 'hideColumn':
|
||||
this.hideColumn(column);
|
||||
this.hideColumn(column)
|
||||
break
|
||||
case 'showAllColumn':
|
||||
this.resetColumn()
|
||||
break
|
||||
case 'remove':
|
||||
this.removeData(row)
|
||||
// $table.remove(row)
|
||||
// $table.remove(row)
|
||||
case 'update':
|
||||
this.updateData(row)
|
||||
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() {
|
||||
if (this.search.reportType === 3) {
|
||||
this.mergeTable(2);
|
||||
} else {
|
||||
this.mergeTable(3);
|
||||
}
|
||||
|
||||
},
|
||||
// 删除数据
|
||||
removeData(row) {
|
||||
this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
const deleteData = {
|
||||
workorderid: row.workorderId,
|
||||
}
|
||||
deleteStatisticsTable(deleteData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!',
|
||||
})
|
||||
this.getList()
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败!请检查!',
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
//修改数据
|
||||
updateDate(row) {
|
||||
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
}
|
||||
// 隐藏列
|
||||
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() {
|
||||
if (this.search.reportType === 3) {
|
||||
this.mergeTable(2)
|
||||
} else {
|
||||
this.mergeTable(3)
|
||||
}
|
||||
},
|
||||
// 删除数据
|
||||
removeData(row) {
|
||||
this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}).then(() => {
|
||||
const deleteData = {
|
||||
workorderid: row.workorderId,
|
||||
}
|
||||
deleteStatisticsTable(deleteData).then((res) => {
|
||||
if (res.code === 200) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '删除成功!',
|
||||
})
|
||||
this.getList()
|
||||
} else {
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: '删除失败!请检查!',
|
||||
})
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
//修改数据
|
||||
updateDate(row) {},
|
||||
|
||||
initReload() {
|
||||
this.resizeObserver = new ResizeObserver((entries) => {
|
||||
if (entries.length > 0) {
|
||||
const { width, height } = entries[0].contentRect
|
||||
// 更新屏幕尺寸
|
||||
this.screenWidth = width
|
||||
this.screenHeight = height
|
||||
// 调用debounce函数
|
||||
this.updateStyleDebounced()
|
||||
}
|
||||
})
|
||||
},
|
||||
reloadWindows() {
|
||||
this.$nextTick(() => {
|
||||
// 监控屏幕尺寸变化
|
||||
this.resizeObserver.observe(document.documentElement)
|
||||
// 初始化屏幕尺寸
|
||||
this.screenWidth = document.documentElement.clientWidth
|
||||
this.screenHeight = document.documentElement.clientHeight
|
||||
})
|
||||
},
|
||||
debounce(func, wait) {
|
||||
return function () {
|
||||
clearTimeout(this.resizeTimeout)
|
||||
this.resizeTimeout = setTimeout(func, wait)
|
||||
}
|
||||
},
|
||||
updateStyle() {
|
||||
const docWidth = document.documentElement.clientWidth
|
||||
const docHeight = document.documentElement.clientHeight
|
||||
const designWidth = 1920 // 设计稿宽度
|
||||
const designHeight = 1080 // 设计稿高度
|
||||
const widthRatio = docWidth / designWidth
|
||||
const heightRatio = docHeight / designHeight
|
||||
document.body.style.transform = `scale(${widthRatio},${heightRatio})`
|
||||
document.body.style.transformOrigin = 'left top'
|
||||
document.body.style.overflow = 'hidden'
|
||||
// 处理浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
|
||||
setTimeout(function () {
|
||||
const lateWidth = document.documentElement.clientWidth
|
||||
const lateHeight = document.documentElement.clientHeight
|
||||
if (lateWidth !== docWidth) {
|
||||
const lateWidthRatio = lateWidth / designWidth
|
||||
const lateHeightRatio = lateHeight / designHeight
|
||||
document.body.style.transform = `scale(${lateWidthRatio},${lateHeightRatio})`
|
||||
}
|
||||
}, 10)
|
||||
},
|
||||
updateStyleDebounced() {
|
||||
this.debounce(this.updateStyle(), 150)
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
<style lang="scss" scoped>
|
||||
.app-container {
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user