集成开发
This commit is contained in:
朱昊天
42
klp-ui/src/views/micro/pages/zinc/components/Inventory.vue
Normal file
42
klp-ui/src/views/micro/pages/zinc/components/Inventory.vue
Normal file
@@ -0,0 +1,42 @@
|
||||
<template>
|
||||
<div class="inventory-container">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:querys="querys"
|
||||
:showControl="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasePage from '@/views/wms/coil/panels/base.vue'
|
||||
import { ZINC_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'ZincInventory',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 镀锌集成库存直接复用钢卷基础查询面板，仅切换逻辑库区范围。
|
||||
querys: {
|
||||
dataType: 1,
|
||||
status: 0,
|
||||
},
|
||||
// 这里使用镀锌主链路库区，避免把技术部/废品库等外围库区混入集成入口。
|
||||
warehouseOptions: ZINC_WAREHOUSE_OPTIONS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.inventory-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
41
klp-ui/src/views/micro/pages/zinc/components/Processing.vue
Normal file
41
klp-ui/src/views/micro/pages/zinc/components/Processing.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div class="processing-container">
|
||||
<el-tabs v-model="activeTab" type="border-card">
|
||||
<el-tab-pane v-for="tab in tabs" :key="tab.name" :label="tab.title" :name="tab.name">
|
||||
<DoPage
|
||||
v-if="activeTab === tab.name"
|
||||
:label="tab.label"
|
||||
:tabs="tab.tabs"
|
||||
:useSpecialSplit="tab.useSpecialSplit"
|
||||
/>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DoPage from '@/views/wms/coil/panels/do.vue'
|
||||
import { ZINC_PROCESSING_TABS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'ZincProcessing',
|
||||
components: {
|
||||
DoPage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 镀锌 WIP 复用现有工序待办组件，只切换为镀锌工序标签与对应逻辑库区。
|
||||
activeTab: 'process',
|
||||
// 配置集中定义在 config.js，便于后续同步调整工序名称与库区映射。
|
||||
tabs: ZINC_PROCESSING_TABS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.processing-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
97
klp-ui/src/views/micro/pages/zinc/components/Quality.vue
Normal file
97
klp-ui/src/views/micro/pages/zinc/components/Quality.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<div class="quality-container">
|
||||
<el-tabs v-model="activeTab" class="quality-tabs">
|
||||
<el-tab-pane label="异常钢卷" name="abnormal">
|
||||
<div v-if="activeTab === 'abnormal'" class="tab-content">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:querys="abnormalQuerys"
|
||||
:labelType="'2'"
|
||||
:hideType="false"
|
||||
:showAbnormal="true"
|
||||
:showControl="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="次品钢卷" name="defect">
|
||||
<div v-if="activeTab === 'defect'" class="tab-content">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:querys="defectQuerys"
|
||||
:hideType="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="O卷" name="oil">
|
||||
<div v-if="activeTab === 'oil'" class="tab-content">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:querys="oilQuerys"
|
||||
:hideType="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasePage from '@/views/wms/coil/panels/base.vue'
|
||||
import { ZINC_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'ZincQuality',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 品质页复用现有异常/次品/O 卷查询逻辑，只切换镀锌库区范围。
|
||||
activeTab: 'abnormal',
|
||||
abnormalQuerys: {
|
||||
// 异常钢卷默认按异常信息排序，便于品质人员优先处理。
|
||||
dataType: 1,
|
||||
orderByAbnormal: true,
|
||||
},
|
||||
defectQuerys: {
|
||||
// 次品钢卷使用现有 scrap 口径。
|
||||
dataType: 1,
|
||||
OnlyScrap: true,
|
||||
},
|
||||
oilQuerys: {
|
||||
// O 卷通过质量状态过滤，不额外增加专用接口。
|
||||
dataType: 1,
|
||||
status: 0,
|
||||
qualityStatus: 'O',
|
||||
},
|
||||
// 品质板块的库区范围与镀锌集成其余板块一致，保证筛选口径统一。
|
||||
warehouseOptions: ZINC_WAREHOUSE_OPTIONS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.quality-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.quality-tabs {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
69
klp-ui/src/views/micro/pages/zinc/components/Report.vue
Normal file
69
klp-ui/src/views/micro/pages/zinc/components/Report.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<div class="report-container">
|
||||
<el-tabs v-model="activeTab" class="report-tabs">
|
||||
<el-tab-pane label="综合报表" name="comprehensive">
|
||||
<Comprehensive v-if="activeTab === 'comprehensive'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="日报表" name="day">
|
||||
<DayReport v-if="activeTab === 'day'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="月报表" name="month">
|
||||
<MonthReport v-if="activeTab === 'month'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="年报表" name="year">
|
||||
<YearReport v-if="activeTab === 'year'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="损耗报表" name="loss">
|
||||
<LossReport v-if="activeTab === 'loss'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="产出报表" name="out">
|
||||
<OutReport v-if="activeTab === 'out'" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="班报表" name="team">
|
||||
<TeamReport v-if="activeTab === 'team'" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Comprehensive from '@/views/wms/report/zinc/comprehensive.vue'
|
||||
import DayReport from '@/views/wms/report/zinc/day.vue'
|
||||
import MonthReport from '@/views/wms/report/zinc/month.vue'
|
||||
import YearReport from '@/views/wms/report/zinc/year.vue'
|
||||
import LossReport from '@/views/wms/report/zinc/loss.vue'
|
||||
import OutReport from '@/views/wms/report/zinc/out.vue'
|
||||
import TeamReport from '@/views/wms/report/zinc/team.vue'
|
||||
|
||||
export default {
|
||||
name: 'ZincReport',
|
||||
components: {
|
||||
Comprehensive,
|
||||
DayReport,
|
||||
MonthReport,
|
||||
YearReport,
|
||||
LossReport,
|
||||
OutReport,
|
||||
TeamReport,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 报表页直接复用 wms/report/zinc 下的既有报表资源，
|
||||
// 集成页只负责聚合入口，不额外改写报表查询逻辑。
|
||||
activeTab: 'comprehensive',
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.report-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.report-tabs {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
83
klp-ui/src/views/micro/pages/zinc/components/Shipping.vue
Normal file
83
klp-ui/src/views/micro/pages/zinc/components/Shipping.vue
Normal file
@@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<div class="shipping-container">
|
||||
<el-tabs v-model="activeTab" class="shipping-tabs">
|
||||
<el-tab-pane label="配卷情况" name="waybill">
|
||||
<div class="tab-content">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:showWaybill="true"
|
||||
:showNewExport="true"
|
||||
:querys="waybillQuerys"
|
||||
:showStatus="false"
|
||||
:hideType="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showControl="false"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="发货记录" name="ship">
|
||||
<div class="tab-content">
|
||||
<BasePage
|
||||
:qrcode="false"
|
||||
:querys="shipQuerys"
|
||||
:showStatus="false"
|
||||
:hideType="false"
|
||||
:useWarehouseIds="true"
|
||||
:warehouseOptions="warehouseOptions"
|
||||
:showControl="false"
|
||||
:showExportTime="true"
|
||||
:showMaterialType="true"
|
||||
/>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import BasePage from '@/views/wms/coil/panels/base.vue'
|
||||
import { ZINC_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'ZincShipping',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 发货板块沿用现有钢卷发运能力，仅将过滤库区限定为镀锌工序链路。
|
||||
activeTab: 'waybill',
|
||||
waybillQuerys: {
|
||||
// 配卷情况需要带上发货绑定信息，便于直接查看配卷结果。
|
||||
dataType: 1,
|
||||
includeBindInfo: true,
|
||||
},
|
||||
shipQuerys: {
|
||||
// 发货记录仅查看已发货数据。
|
||||
dataType: 1,
|
||||
status: 1,
|
||||
},
|
||||
// 发货板块与库存/WIP 保持相同库区口径，避免统计口径不一致。
|
||||
warehouseOptions: ZINC_WAREHOUSE_OPTIONS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.shipping-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.shipping-tabs {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.tab-content {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
42
klp-ui/src/views/micro/pages/zinc/config.js
Normal file
42
klp-ui/src/views/micro/pages/zinc/config.js
Normal file
@@ -0,0 +1,42 @@
|
||||
// 镀锌工序集成页公共配置。
|
||||
// 这里统一维护五个板块共用的逻辑库区，避免各子页面重复定义后产生偏差。
|
||||
|
||||
// 镀锌工序相关逻辑库区：
|
||||
// 1. 镀锌原料库：镀锌工序入口原料
|
||||
// 2. 镀锌成品库：镀锌工序产出成品
|
||||
// 3. 镀锌纵剪分条原料库：后续分条前的原料库区
|
||||
// 4. 镀锌待打包：镀锌工序产出后待包装库区
|
||||
export const ZINC_WAREHOUSE_OPTIONS = [
|
||||
{ value: '1988150263284953089', label: '镀锌原料库' },
|
||||
{ value: '1988150323162836993', label: '镀锌成品库' },
|
||||
{ value: '1988150487185289217', label: '镀锌纵剪分条原料库' },
|
||||
{ value: '2056545127927787522', label: '镀锌待打包' },
|
||||
]
|
||||
|
||||
// 镀锌工序 WIP 直接复用现有 WMS 工序组件：
|
||||
// - 镀锌工序、镀锌修复工序走 specialSplit 流程
|
||||
// - 镀锌合卷走普通待办流程
|
||||
export const ZINC_PROCESSING_TABS = [
|
||||
{
|
||||
title: '镀锌工序',
|
||||
name: 'process',
|
||||
label: '镀锌工序',
|
||||
// 镀锌工序和修复工序都需要限制在镀锌主链路库区范围内操作。
|
||||
tabs: ZINC_WAREHOUSE_OPTIONS,
|
||||
useSpecialSplit: true,
|
||||
},
|
||||
{
|
||||
title: '合卷',
|
||||
name: 'merge',
|
||||
label: '镀锌合卷',
|
||||
// 合卷沿用待办单模式，不需要传入库区页签。
|
||||
useSpecialSplit: false,
|
||||
},
|
||||
{
|
||||
title: '镀锌修复',
|
||||
name: 'repair',
|
||||
label: '镀锌修复工序',
|
||||
tabs: ZINC_WAREHOUSE_OPTIONS,
|
||||
useSpecialSplit: true,
|
||||
},
|
||||
]
|
||||
@@ -1,5 +1,133 @@
|
||||
<template>
|
||||
<div>
|
||||
镀锌子系统
|
||||
<div class="zinc-container">
|
||||
<div class="zinc-sidebar">
|
||||
<el-menu :default-active="activeMenu" class="sidebar-menu" @select="handleMenuSelect">
|
||||
<!-- 镀锌集成页按需求只保留五个核心业务板块 -->
|
||||
<el-menu-item index="inventory">
|
||||
<i class="el-icon-box"></i>
|
||||
<span slot="title">库存</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="processing">
|
||||
<i class="el-icon-s-operation"></i>
|
||||
<span slot="title">WIP</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="report">
|
||||
<i class="el-icon-document"></i>
|
||||
<span slot="title">报表</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="shipping">
|
||||
<i class="el-icon-truck"></i>
|
||||
<span slot="title">发货</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item index="quality">
|
||||
<i class="el-icon-warning-outline"></i>
|
||||
<span slot="title">品质</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
<div class="zinc-content">
|
||||
<component :is="currentComponent" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Inventory from './components/Inventory.vue'
|
||||
import Processing from './components/Processing.vue'
|
||||
import Report from './components/Report.vue'
|
||||
import Shipping from './components/Shipping.vue'
|
||||
import Quality from './components/Quality.vue'
|
||||
|
||||
export default {
|
||||
name: 'ZincSystem',
|
||||
components: {
|
||||
Inventory,
|
||||
Processing,
|
||||
Report,
|
||||
Shipping,
|
||||
Quality,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 默认先展示库存板块，与酸轧集成入口保持一致。
|
||||
activeMenu: 'inventory',
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentComponent() {
|
||||
// 集成页只作为业务导航壳，具体业务能力由各子组件承载。
|
||||
const componentMap = {
|
||||
inventory: 'Inventory',
|
||||
processing: 'Processing',
|
||||
report: 'Report',
|
||||
shipping: 'Shipping',
|
||||
quality: 'Quality',
|
||||
}
|
||||
return componentMap[this.activeMenu]
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
handleMenuSelect(index) {
|
||||
// 左侧菜单切换时，仅替换右侧业务面板，不做额外路由跳转。
|
||||
this.activeMenu = index
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.zinc-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.zinc-sidebar {
|
||||
width: 100px;
|
||||
background-color: #fff;
|
||||
border-right: 1px solid #e4e7ed;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-shadow: 2px 0 8px rgba(0, 0, 0, 0.05);
|
||||
|
||||
.sidebar-menu {
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
border-right: none;
|
||||
|
||||
::v-deep .el-menu-item {
|
||||
color: #606266;
|
||||
padding: 0 20px;
|
||||
font-size: 14px;
|
||||
|
||||
&:hover {
|
||||
background-color: #ecf5ff;
|
||||
color: #409eff;
|
||||
}
|
||||
|
||||
&.is-active {
|
||||
background-color: #ecf5ff;
|
||||
color: #409eff;
|
||||
border-right: 3px solid #409eff;
|
||||
}
|
||||
|
||||
i {
|
||||
font-size: 18px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.zinc-content {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user