订单,绩效时间搜索调整

This commit is contained in:
2025-02-19 13:41:00 +08:00
parent 0055abebdc
commit 3a3d8c7bab
3 changed files with 242 additions and 64 deletions

View File

@@ -7,8 +7,7 @@
<el-col :span="8">
<el-form-item label="时间范围">
<el-date-picker v-model="searchForm.jobDatetime" :clearable="false" type="datetimerange"
range-separator="" start-placeholder="开始日期" end-placeholder="结束日期"
value-format="YYYY-MM-DD HH:mm:ss"
range-separator="" start-placeholder="开始日期" end-placeholder="结束日期" :shortcuts="shortcuts"
:default-value="[dayjs().startOf('day').add(8, 'hour'), dayjs().endOf('day').subtract(16, 'hour')]" />
</el-form-item>
</el-col>
@@ -22,8 +21,8 @@
<el-col :span="8">
<el-form-item label="班次选择">
<el-radio-group v-model="searchForm.shift" @change="handleShiftChange">
<el-radio-button value="白班">当日白班</el-radio-button>
<el-radio-button value="晚班">当日晚班</el-radio-button>
<el-radio-button value="白班">切换白班</el-radio-button>
<el-radio-button value="晚班">切换晚班</el-radio-button>
</el-radio-group>
</el-form-item>
</el-col>
@@ -68,7 +67,65 @@ const tableData = ref([])
// 工序号选项
const processOptions = ['物料领用', '机械加工', '中间检查', '手工研磨', '机研磨', '精研磨', '入库检查', '出货']
// 日期选择器快捷选项
const shortcuts = [
{
text: '今天白班',
value: () => {
return [dayjs().startOf('day').hour(8).minute(0).second(0), dayjs().startOf('day').hour(20).minute(0).second(0)]
},
},
{
text: '今天晚班',
value: () => {
return [dayjs().startOf('day').hour(20).minute(0).second(0), dayjs().add(1, 'day').startOf('day').hour(8).minute(0).second(0)]
},
},
{
text: '昨天白班',
value: () => {
return [dayjs().subtract(1, 'day').startOf('day').hour(8).minute(0).second(0), dayjs().subtract(1, 'day').startOf('day').hour(20).minute(0).second(0)]
},
},
{
text: '昨天晚班',
value: () => {
return [dayjs().subtract(1, 'day').startOf('day').hour(20).minute(0).second(0), dayjs().startOf('day').hour(8).minute(0).second(0)]
},
},
{
text: '本周',
value: () => {
const startOfWeek = dayjs().startOf('week');
const endOfWeek = dayjs().endOf('week');
return [startOfWeek, endOfWeek];
},
},
{
text: '上周',
value: () => {
const startOfLastWeek = dayjs().subtract(1, 'week').startOf('week');
const endOfLastWeek = dayjs().subtract(1, 'week').endOf('week');
return [startOfLastWeek, endOfLastWeek];
},
},
{
text: '本月',
value: () => {
const startOfLastMonth = dayjs().startOf('month');
const endOfLastMonth = dayjs().endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
{
text: '上月',
value: () => {
const startOfLastMonth = dayjs().subtract(1, 'month').startOf('month');
const endOfLastMonth = dayjs().subtract(1, 'month').endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
];
// 搜索条件
const searchForm = ref({
worker: '',

View File

@@ -1,5 +1,9 @@
<template>
<el-form :model="queryParams" ref="queryRef" :inline="true" label-width="100px">
<el-form-item label="单据日期">
<el-date-picker v-model="queryParams.importDate" type="datetimerange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" :shortcuts="shortcuts" />
</el-form-item>
<el-form-item label="订单扫描号">
<el-input v-model="queryParams.orderNoMes" placeholder="请输入订单扫描号" clearable />
</el-form-item>
@@ -15,57 +19,51 @@
:value="option.dictValue" />
</el-select>
</el-form-item>
<el-form-item label="销售地区">
<el-input v-model="queryParams.salesArea" placeholder="请输入销售地区" clearable />
</el-form-item>
<el-form-item label="是否非标">
<el-select v-model="queryParams.specordindicator" placeholder="请选择" clearable>
<el-option v-for="option in boolOptions" :key="option.dictValue" :label="option.dictLabel"
:value="option.dictValue" />
</el-select>
</el-form-item>
<el-form-item label="单据日期">
<el-date-picker v-model="queryParams.importDate" type="datetimerange" range-separator="至" start-placeholder="开始日期"
end-placeholder="结束日期" :default-time="[new Date(2000, 1, 1, 8, 0, 0), new Date(2000, 1, 1, 20, 0, 0)]"
:shortcuts="shortcuts" value-format="YYYY-MM-DD HH:mm:ss" />
<el-form-item label="销售地区">
<el-input v-model="queryParams.salesArea" placeholder="请输入销售地区" clearable />
</el-form-item>
<el-form-item>
<el-button type="primary" @click="handleQuery">查询</el-button>
<el-button @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<vxe-table :data="dataList" v-loading="loading" height="600" border header-cell-class-name="el-table-header-cell"
highlight-current-row row-key="id">
<vxe-column type="expand">
<template #default="{ row }">
<div>
<vxe-table :data="row.children" height="300" border row-key="id">
<vxe-table :data="dataList" v-loading="loading" height="600" border :cell-class-name="cellClassName"
header-cell-class-name="el-table-header-cell">
<vxe-column type="seq" width="70" align="center"></vxe-column>
<vxe-column type="expand" title="子工单" align="center" width="80">
<template #content="{ row }">
<div class="inner-box">
<vxe-table :data="row.children" height="300" border>
<vxe-column type="seq" width="50" align="center" />
<vxe-column field="workorderDate" title="工单日期" align="center" :formatter="formatTime" />
<vxe-column field="workorder" title="工单号" align="center" width="160" />
<vxe-column field="productionName" title="主体品名" />
<vxe-column field="productionCode" title="主体型号" />
<vxe-column field="stoveCode" title="炉号" />
<vxe-column field="planNum" align="center" title="计划数量" />
<vxe-column field="workorderDate" title="工单日期">
<template #default="{ row }">
<span v-if="row.workorderDate != '' && row.workorderDate != null">{{
proxy.dayjs(row.workorderDate).format('YYYY-MM-DD') }}</span>
</template>
</vxe-column>
<vxe-column field="priority" title="优先级" align="center">
<template #default="{ row }">
<dict-tag :options="options.priorityOptions" :value="row.priority" />
</template>
</vxe-column>
<vxe-column field="materialName" title="材料型号" />
<vxe-column field="materialCode" title="材料编码" />
<vxe-column field="planNum" align="center" title="计划数量" />
<vxe-column field="shipmentNum" align="center" title="完成数量" />
<vxe-column field="materialtextureCode" title="材质" />
<vxe-column field="drawingCode" title="图号" />
<vxe-column field="version" title="版本" />
<vxe-column field="status" title="状态">
<vxe-column field="priority" title="优先级" align="center">
<template #default="{ row }">
<dict-tag :options="options.statusOptions" :value="row.status" />
<dict-tag :options="priorityOptions" :value="row.priority" />
</template>
</vxe-column>
<vxe-column field="version" title="版本" align="center" />
<vxe-column field="status" title="状态" align="center">
<template #default="{ row }">
<dict-tag :options="statusOptions" :value="row.status" />
</template>
</vxe-column>
<vxe-column field="workshopCode" title="车间" />
@@ -73,32 +71,40 @@
</div>
</template>
</vxe-column>
<vxe-column field="orderNoMes" title="订单扫描号" align="center" show-overflow min-width="150" />
<vxe-column field="purchaseOrderErp" title="采购订单号" align="center" show-overflow min-width="150" />
<vxe-column field="materialName" title="物料" align="center" show-overflow min-width="150" />
<vxe-column field="materialCode" title="物料号" align="center" show-overflow min-width="120" />
<vxe-column field="demandQuantity" title="需求数量" align="center" min-width="100" />
<vxe-column field="deliveryDate" title="交货日期" show-overflow min-width="120" />
<vxe-column field="startDate" title="基本开始日期" show-overflow min-width="120" />
<vxe-column field="endDate" title="基本结束日期" show-overflow min-width="120" />
<vxe-column field="deliveryQuantity" title="实际交货数量" align="center" min-width="120" />
<vxe-column field="orderindicator" title="订单是否完成" align="center" show-overflow min-width="120">
<vxe-column field="importDate" title="导入日期" min-width="120" align="center" :formatter="formatTime" />
<vxe-column field="orderNoMes" title="订单扫描号" min-width="140" />
<vxe-column field="purchaseOrderErp" title="采购订单号" min-width="140" />
<vxe-column field="orderindicator" title="订单是否完成" align="center" min-width="120">
<template #default="{ row }">
<dict-tag :options="boolOptions" :value="row.orderindicator" />
</template>
</vxe-column>
<vxe-column field="routeCode" title="计划产线" align="center" show-overflow min-width="120" />
<vxe-column field="specordindicator" title="是否非标" align="center" show-overflow min-width="100">
<vxe-column field="materialCode" title="物料号" min-width="120" />
<vxe-column field="demandQuantity" title="需求数量" align="center" min-width="100" />
<vxe-column field="deliveryQuantity" title="实际交货数量" align="center" min-width="120" />
<vxe-column align="center" title="完成进度" min-width="200">
<template #default="{ row }">
<el-progress :stroke-width="18" :percentage="getPercentage(row.demandQuantity, row.deliveryQuantity)"
:color="customColors" />
</template>
</vxe-column>
<vxe-column field="deliveryDate" title="交货日期" min-width="120" align="center" :formatter="formatTime" />
<vxe-column field="startDate" title="基本开始日期" min-width="160" align="center" />
<vxe-column field="endDate" title="基本结束日期" min-width="160" align="center" />
<vxe-column field="materialName" title="物料" min-width="120" />
<vxe-column field="specordindicator" title="是否非标" align="center" min-width="100">
<template #default="{ row }">
<dict-tag :options="boolOptions" :value="row.specordindicator" />
</template>
</vxe-column>
<vxe-column field="routeCode" title="计划产线" align="center" min-width="120" />
<vxe-column field="kdType" title="类型" align="center" min-width="100" />
<vxe-column field="documentDate" title="单据日期" show-overflow min-width="120" />
<vxe-column field="seller" title="售达方" align="center" show-overflow min-width="120" />
<vxe-column field="salesArea" title="销售地区" align="center" show-overflow min-width="120" />
<vxe-column field="remark" title="备注" align="center" show-overflow min-width="150" />
<vxe-column field="importDate" title="导入日期" show-overflow min-width="120" />
<vxe-column field="documentDate" title="单据日期" min-width="120" />
<vxe-column field="seller" title="售达方" align="center" min-width="120" />
<vxe-column field="salesArea" title="销售地区" align="center" min-width="120" />
<vxe-column field="remark" title="备注" align="center" min-width="150" />
</vxe-table>
</template>
@@ -106,7 +112,7 @@
import { listOrderProgress } from '@/api/orderPurchaseManagement/orderProgress.js'
import { reactive, ref } from 'vue'
import dayjs from 'dayjs'
const { proxy } = getCurrentInstance()
const queryParams = reactive({
pageNum: 1,
pageSize: 10,
@@ -127,18 +133,50 @@ const loading = ref(false)
const showSearch = ref(true)
const shortcuts = [
{
text: '白班',
text: '今天',
value: () => {
return [dayjs().startOf('day').hour(8).minute(0).second(0).toISOString(), dayjs().startOf('day').hour(20).minute(0).second(0).toISOString()]
return [dayjs().startOf('day'), dayjs().endOf('day')];
},
},
{
text: '晚班',
text: '昨天',
value: () => {
return [dayjs().startOf('day').hour(20).minute(0).second(0).toISOString(), dayjs().add(1, 'day').startOf('day').hour(8).minute(0).second(0).toISOString()]
return [dayjs().subtract(1, 'day').startOf('day'), dayjs().subtract(1, 'day').endOf('day')];
},
},
]
{
text: '本周',
value: () => {
const startOfWeek = dayjs().startOf('week');
const endOfWeek = dayjs().endOf('week');
return [startOfWeek, endOfWeek];
},
},
{
text: '上周',
value: () => {
const startOfLastWeek = dayjs().subtract(1, 'week').startOf('week');
const endOfLastWeek = dayjs().subtract(1, 'week').endOf('week');
return [startOfLastWeek, endOfLastWeek];
},
},
{
text: '本月',
value: () => {
const startOfLastMonth = dayjs().startOf('month');
const endOfLastMonth = dayjs().endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
{
text: '上月',
value: () => {
const startOfLastMonth = dayjs().subtract(1, 'month').startOf('month');
const endOfLastMonth = dayjs().subtract(1, 'month').endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
];
// 工单状态 选项列表 格式 eg:{ dictLabel: '标签', dictValue: '0'}
const statusOptions = [
@@ -188,6 +226,10 @@ const kdTypeOptions = [
// Add your kdType options here
]
const formatTime = ({ cellValue }) => {
return dayjs(cellValue).format("YYYY-MM-DD")
}
function getList() {
loading.value = true
listOrderProgress(queryParams).then(res => {
@@ -222,6 +264,30 @@ function sortChange(column) {
handleQuery()
}
// 计算完成百分数
function getPercentage(planNum, completeNum) {
try {
return planNum === 0 ? 0 : Math.round((completeNum / planNum) * 100);
} catch (error) {
return 0;
}
}
// 获取进度条颜色
const customColors = [
{ color: '#f56c6c', percentage: 60 },
{ color: '#e6a23c', percentage: 80 },
{ color: '#5cb87a', percentage: 100 },
]
const cellClassName = ({ row, column }) => {
if (row.orderindicator === 0) {
return 'cell-red'
} else {
return ""
}
}
handleQuery()
</script>
@@ -230,4 +296,12 @@ handleQuery()
font-size: 12px;
color: #999;
}
::v-deep(.cell-red) {
background-color: rgb(255, 220, 220, 0.5);
}
.inner-box {
padding: 20px;
}
</style>

View File

@@ -1,9 +1,9 @@
<template>
<div>
<el-form :model="queryParams" label-position="right" inline ref="queryRef" v-show="showSearch">
<el-form-item label="单据日期区间">
<el-date-picker v-model="queryParams.importDate" type="daterange" range-separator="-" start-placeholder="开始日期"
end-placeholder="结束日期" :clearable="false" value-format="YYYY-MM-DD" />
<el-form-item label="单据日期">
<el-date-picker v-model="queryParams.importDate" type="datetimerange" range-separator=""
start-placeholder="开始日期" end-placeholder="结束日期" :shortcuts="shortcuts" />
</el-form-item>
<el-form-item label="订单扫描号">
<el-input v-model="queryParams.orderNoMes" placeholder="请输入订单扫描号" clearable @keyup.enter.native="handleQuery" />
@@ -21,15 +21,15 @@
:value="option.dictValue" />
</el-select>
</el-form-item>
<el-form-item label="销售地区">
<el-input v-model="queryParams.salesArea" placeholder="请输入销售地区" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item label="是否非标">
<el-select v-model="queryParams.specordindicator" placeholder="请选择" clearable>
<el-option v-for="option in boolOptions" :key="option.dictValue" :label="option.dictLabel"
:value="option.dictValue" />
</el-select>
</el-form-item>
<el-form-item label="销售地区">
<el-input v-model="queryParams.salesArea" placeholder="请输入销售地区" clearable @keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button icon="search" type="primary" @click="handleQuery">{{ $t('btn.search') }}</el-button>
<el-button icon="refresh" @click="resetQuery">{{ $t('btn.reset') }}</el-button>
@@ -306,7 +306,7 @@ import {
downloadTemplate // 添加下载模板API
} from '@/api/orderPurchaseManagement/orderpurchase.js'
const { proxy } = getCurrentInstance()
import dayjs from 'dayjs'
const queryParams = reactive({
pageNum: 1,
pageSize: 10,
@@ -318,7 +318,7 @@ const queryParams = reactive({
materialCode: '',
orderindicator: -2,
salesArea: '',
specordindicator: '',
specordindicator: -2,
})
const columns = ref([
@@ -350,6 +350,53 @@ const columns = ref([
{ visible: false, align: 'center', type: '', prop: 'updatedTime', label: '更新时间', showOverflowTooltip: true },
])
const shortcuts = [
{
text: '今天',
value: () => {
return [dayjs().startOf('day'), dayjs().endOf('day')];
},
},
{
text: '昨天',
value: () => {
return [dayjs().subtract(1, 'day').startOf('day'), dayjs().subtract(1, 'day').endOf('day')];
},
},
{
text: '本周',
value: () => {
const startOfWeek = dayjs().startOf('week');
const endOfWeek = dayjs().endOf('week');
return [startOfWeek, endOfWeek];
},
},
{
text: '上周',
value: () => {
const startOfLastWeek = dayjs().subtract(1, 'week').startOf('week');
const endOfLastWeek = dayjs().subtract(1, 'week').endOf('week');
return [startOfLastWeek, endOfLastWeek];
},
},
{
text: '本月',
value: () => {
const startOfLastMonth = dayjs().startOf('month');
const endOfLastMonth = dayjs().endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
{
text: '上月',
value: () => {
const startOfLastMonth = dayjs().subtract(1, 'month').startOf('month');
const endOfLastMonth = dayjs().subtract(1, 'month').endOf('month');
return [startOfLastMonth, endOfLastMonth];
},
},
];
const total = ref(0)
const dataList = ref([])
const queryRef = ref()