订单,绩效时间搜索调整
This commit is contained in:
@@ -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: '',
|
||||
|
||||
@@ -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>
|
||||
@@ -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()
|
||||
|
||||
Reference in New Issue
Block a user