集成开发
This commit is contained in:
朱昊天
41
klp-ui/src/views/micro/pages/split/components/Inventory.vue
Normal file
41
klp-ui/src/views/micro/pages/split/components/Inventory.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<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 { SPLIT_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'SplitInventory',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 分条集成库存直接复用钢卷基础查询面板，仅切换到分条成品链路库区。
|
||||
querys: {
|
||||
dataType: 1,
|
||||
status: 0,
|
||||
},
|
||||
warehouseOptions: SPLIT_WAREHOUSE_OPTIONS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.inventory-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
40
klp-ui/src/views/micro/pages/split/components/Processing.vue
Normal file
40
klp-ui/src/views/micro/pages/split/components/Processing.vue
Normal file
@@ -0,0 +1,40 @@
|
||||
<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 { SPLIT_PROCESSING_TABS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'SplitProcessing',
|
||||
components: {
|
||||
DoPage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 纵剪分条 WIP 目前仅复用现有“纵剪分条工序”能力，不额外引入不存在的合卷/修复页签。
|
||||
activeTab: 'process',
|
||||
tabs: SPLIT_PROCESSING_TABS,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.processing-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
93
klp-ui/src/views/micro/pages/split/components/Quality.vue
Normal file
93
klp-ui/src/views/micro/pages/split/components/Quality.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<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 { SPLIT_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'SplitQuality',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 品质页复用现有异常/次品/O 卷查询逻辑，只切换分条成品链路库区范围。
|
||||
activeTab: 'abnormal',
|
||||
abnormalQuerys: {
|
||||
dataType: 1,
|
||||
orderByAbnormal: true,
|
||||
},
|
||||
defectQuerys: {
|
||||
dataType: 1,
|
||||
OnlyScrap: true,
|
||||
},
|
||||
oilQuerys: {
|
||||
dataType: 1,
|
||||
status: 0,
|
||||
qualityStatus: 'O',
|
||||
},
|
||||
warehouseOptions: SPLIT_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>
|
||||
68
klp-ui/src/views/micro/pages/split/components/Report.vue
Normal file
68
klp-ui/src/views/micro/pages/split/components/Report.vue
Normal file
@@ -0,0 +1,68 @@
|
||||
<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/split/comprehensive.vue'
|
||||
import DayReport from '@/views/wms/report/split/day.vue'
|
||||
import MonthReport from '@/views/wms/report/split/month.vue'
|
||||
import YearReport from '@/views/wms/report/split/year.vue'
|
||||
import LossReport from '@/views/wms/report/split/loss.vue'
|
||||
import OutReport from '@/views/wms/report/split/out.vue'
|
||||
import TeamReport from '@/views/wms/report/split/team.vue'
|
||||
|
||||
export default {
|
||||
name: 'SplitReport',
|
||||
components: {
|
||||
Comprehensive,
|
||||
DayReport,
|
||||
MonthReport,
|
||||
YearReport,
|
||||
LossReport,
|
||||
OutReport,
|
||||
TeamReport,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 报表页直接复用 wms/report/split 下的既有报表资源。
|
||||
activeTab: 'comprehensive',
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.report-container {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.report-tabs {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
80
klp-ui/src/views/micro/pages/split/components/Shipping.vue
Normal file
80
klp-ui/src/views/micro/pages/split/components/Shipping.vue
Normal file
@@ -0,0 +1,80 @@
|
||||
<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 { SPLIT_WAREHOUSE_OPTIONS } from '../config'
|
||||
|
||||
export default {
|
||||
name: 'SplitShipping',
|
||||
components: {
|
||||
BasePage,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 发货板块沿用现有钢卷发运能力，仅将过滤库区限定为分条成品链路。
|
||||
activeTab: 'waybill',
|
||||
waybillQuerys: {
|
||||
dataType: 1,
|
||||
includeBindInfo: true,
|
||||
},
|
||||
shipQuerys: {
|
||||
dataType: 1,
|
||||
status: 1,
|
||||
},
|
||||
warehouseOptions: SPLIT_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>
|
||||
34
klp-ui/src/views/micro/pages/split/config.js
Normal file
34
klp-ui/src/views/micro/pages/split/config.js
Normal file
@@ -0,0 +1,34 @@
|
||||
// 纵剪分条集成页公共配置。
|
||||
// 分条模块与镀锌/脱脂不同：WIP 关注待分条工序链路，库存/发货/品质更关注分条成品去向。
|
||||
|
||||
// 纵剪分条成品链路逻辑库区：
|
||||
// 1. 酸连轧分条成品
|
||||
// 2. 退火分条成品
|
||||
// 3. 镀锌分条成品
|
||||
// 4. 拉矫分条成品
|
||||
// 5. 包装用内部仓
|
||||
export const SPLIT_WAREHOUSE_OPTIONS = [
|
||||
{ value: '1988150210872930306', label: '酸连轧分条成品' },
|
||||
{ value: '1988150800092950529', label: '退火分条成品' },
|
||||
{ value: '1988150380649967617', label: '镀锌分条成品' },
|
||||
{ value: '1988151027466170370', label: '拉矫分条成品' },
|
||||
{ value: '2027272581575487489', label: '包装用内部仓' },
|
||||
]
|
||||
|
||||
// 纵剪分条 WIP 复用现有 WMS 工序组件。
|
||||
// 这里沿用现有工序页签定义：首项“原料库”由原模块保留空 value 作为前置入口占位。
|
||||
export const SPLIT_PROCESSING_TABS = [
|
||||
{
|
||||
title: '纵剪分条工序',
|
||||
name: 'process',
|
||||
label: '纵剪分条工序',
|
||||
tabs: [
|
||||
{ value: '', label: '原料库' },
|
||||
{ value: '1988150210872930306', label: '酸连轧分条成品' },
|
||||
{ value: '1988150800092950529', label: '退火分条成品' },
|
||||
{ value: '1988150380649967617', label: '镀锌分条成品' },
|
||||
{ value: '1988151027466170370', label: '拉矫分条成品' },
|
||||
],
|
||||
useSpecialSplit: true,
|
||||
},
|
||||
]
|
||||
131
klp-ui/src/views/micro/pages/split/index.vue
Normal file
131
klp-ui/src/views/micro/pages/split/index.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div class="split-container">
|
||||
<div class="split-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="split-content">
|
||||
<component :is="currentComponent" />
|
||||
</div>
|
||||
</div>
|
||||
</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: 'SplitSystem',
|
||||
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;
|
||||
}
|
||||
|
||||
.split-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: calc(100vh - 84px);
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.split-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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.split-content {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user