<template>
|
<view class="op-scheduling">
|
<PageHeader title="工序排产" />
|
|
<view class="search_form">
|
<u-form>
|
<view class="form-row">
|
<u-form-item label="客户名称" label-width="80">
|
<up-input v-model="searchForm.customerName" placeholder="请输入" clearable @change="handleQuery" />
|
</u-form-item>
|
<u-form-item label="项目名称" label-width="80">
|
<up-input v-model="searchForm.projectName" placeholder="请输入" clearable @change="handleQuery" />
|
</u-form-item>
|
</view>
|
<view class="form-row">
|
<u-form-item label="状态" label-width="80">
|
<up-input v-model="statusDisplay" placeholder="请选择状态" readonly @click="showStatusPicker = true" />
|
</u-form-item>
|
</view>
|
<view class="form-actions">
|
<u-button type="primary" @click="handleQuery" size="small">搜索</u-button>
|
</view>
|
</u-form>
|
</view>
|
|
<!-- 顶部操作已移除 -->
|
|
<view class="list_container">
|
<u-loading-icon v-if="tableLoading" text="加载中..."></u-loading-icon>
|
<view v-else>
|
<view v-if="!tableData || tableData.length === 0" class="empty">暂无数据</view>
|
<view v-else class="card_list">
|
<view v-for="item in tableData" :key="item.id" class="card_item">
|
<view class="card_header">
|
<u-tag :type="statusType(item.status)" size="mini">{{ statusText(item.status) }}</u-tag>
|
<text class="card_title">{{ item.projectName }}</text>
|
</view>
|
<view class="card_body">
|
<view class="row"><text class="label">派工日期</text><text class="value">{{ item.schedulingDate }}</text></view>
|
<view class="row"><text class="label">派工人</text><text class="value">{{ item.schedulingUserName }}</text></view>
|
<view class="row"><text class="label">合同号</text><text class="value">{{ item.salesContractNo }}</text></view>
|
<view class="row"><text class="label">客户合同号</text><text class="value">{{ item.customerContractNo }}</text></view>
|
<view class="row"><text class="label">客户名称</text><text class="value">{{ item.customerName }}</text></view>
|
<view class="row"><text class="label">产品大类</text><text class="value">{{ item.productCategory }}</text></view>
|
<view class="row"><text class="label">规格型号</text><text class="value">{{ item.specificationModel }}</text></view>
|
<view class="row"><text class="label">绑定机器</text><text class="value">{{ item.speculativeTradingName }}</text></view>
|
<view class="row inline">
|
<view class="col"><text class="label">单位</text><text class="value">{{ item.unit }}</text></view>
|
<view class="col"><text class="label">排产总数</text><text class="value">{{ item.schedulingNum }}</text></view>
|
<view class="col"><text class="label">已排产数量</text><text class="value">{{ item.successNum }}</text></view>
|
<view class="col"><text class="label">待排产数量</text><text class="value">{{ item.pendingNum }}</text></view>
|
</view>
|
</view>
|
<view class="card_actions">
|
<u-button
|
type="primary"
|
size="small"
|
@click="openForm('add', item)"
|
:disabled="item.pendingNum == 0"
|
>工序排产</u-button>
|
<u-button
|
type="error"
|
plain
|
size="small"
|
class="ml8"
|
@click="handleCancel(item)"
|
:disabled="item.status == 3"
|
>取消排产</u-button>
|
</view>
|
</view>
|
</view>
|
|
|
</view>
|
</view>
|
|
<form-dia ref="formDia" @close="handleQuery"></form-dia>
|
|
<!-- 状态选择器（up 系列） -->
|
<up-action-sheet
|
:show="showStatusPicker"
|
:actions="statusActions"
|
title="选择状态"
|
@select="onStatusSelect"
|
@close="showStatusPicker = false"
|
/>
|
</view>
|
</template>
|
|
<script setup>
|
import { onMounted, ref, reactive, toRefs, nextTick, getCurrentInstance, computed } from 'vue'
|
import PageHeader from '@/components/PageHeader.vue'
|
import FormDia from './components/formDia.vue'
|
import dayjs from 'dayjs'
|
import { listPageProcess, productionDispatchDelete } from '@/api/productionManagement/operationScheduling.js'
|
|
const data = reactive({
|
searchForm: {
|
staffName: "",
|
status: 1,
|
entryDate: null, // 录入日期
|
entryDateStart: undefined,
|
entryDateEnd: undefined,
|
},
|
});
|
const { searchForm } = toRefs(data);
|
const tableData = ref([])
|
const tableLoading = ref(false)
|
const page = reactive({
|
current: -1,
|
size: -1,
|
});
|
const formDia = ref()
|
const { proxy } = getCurrentInstance()
|
|
// 状态选择器
|
const showStatusPicker = ref(false)
|
const statusOptions = ref([
|
{ label: '待排产', value: 1 },
|
{ label: '排产中', value: 2 },
|
{ label: '已排产', value: 3 }
|
])
|
const statusActions = computed(() => statusOptions.value.map(o => ({ name: o.label, value: o.value })))
|
const statusDisplay = ref('')
|
|
// 日期范围筛选已移除
|
|
// picker handlers
|
const onStatusSelect = (item) => {
|
if (item) {
|
searchForm.value.status = item.value
|
statusDisplay.value = item.name
|
handleQuery()
|
}
|
showStatusPicker.value = false
|
}
|
// 日期范围回调已移除
|
|
// status display helpers
|
const statusText = (s) => {
|
if (s == 3) return '已排产'
|
if (s == 1) return '待排产'
|
return '排产中'
|
}
|
const statusType = (s) => {
|
if (s == 3) return 'success'
|
if (s == 1) return 'primary'
|
return 'warning'
|
}
|
|
// 查询列表
|
/** 搜索按钮操作 */
|
const handleQuery = () => {
|
page.current = -1;
|
page.size = -1;
|
getList();
|
};
|
// changeDaterange 已移除
|
const getList = () => {
|
tableLoading.value = true;
|
const params = { ...searchForm.value, ...page };
|
params.entryDate = undefined
|
listPageProcess(params).then(res => {
|
tableLoading.value = false;
|
tableData.value = res.data.records.map(item => ({
|
...item,
|
pendingNum: (Number(item.schedulingNum) || 0) - (Number(item.successNum) || 0)
|
}));
|
}).catch(err => {
|
tableLoading.value = false;
|
})
|
};
|
// 取消多选相关逻辑，采用卡片内单条操作
|
|
// 打开弹框
|
const openForm = (type, row) => {
|
if (!row) {
|
uni.showToast({ title: '未找到数据', icon: 'none' })
|
return;
|
}
|
if ((Number(row.pendingNum) || 0) === 0) {
|
uni.showToast({ title: '无需再排产', icon: 'none' })
|
return;
|
}
|
nextTick(() => {
|
formDia.value?.openDialog(type, row)
|
})
|
};
|
|
// 单条取消排产
|
const handleCancel = (row) => {
|
if (!row) return
|
if (row.status == 3) {
|
uni.showToast({ title: '已排产数据不能取消排产', icon: 'none' })
|
return
|
}
|
uni.showModal({
|
title: '删除提示',
|
content: '是否确认取消排产？',
|
success: (res) => {
|
if (res.confirm) {
|
tableLoading.value = true
|
productionDispatchDelete([row.id])
|
.then(() => {
|
uni.showToast({ title: '取消排产成功', icon: 'success' })
|
getList()
|
})
|
.finally(() => {
|
tableLoading.value = false
|
})
|
}
|
}
|
})
|
}
|
|
onMounted(() => {
|
getList();
|
// 初始化显示字段
|
const cur = statusOptions.value.find(o => o.value === searchForm.value.status)
|
statusDisplay.value = cur ? cur.label : ''
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.op-scheduling {
|
padding-bottom: 12px;
|
}
|
.search_form {
|
margin: 12px;
|
background: #fff;
|
border-radius: 8px;
|
padding: 10px;
|
}
|
.form-row {
|
display: flex;
|
gap: 12px;
|
}
|
.form-actions {
|
display: flex;
|
justify-content: flex-end;
|
}
|
.table_actions {
|
display: flex;
|
gap: 8px;
|
padding: 0 12px 10px 12px;
|
justify-content: flex-end;
|
}
|
.list_container {
|
padding: 0 12px;
|
}
|
.empty {
|
text-align: center;
|
color: #888;
|
padding: 20px 0;
|
}
|
.card_list {
|
display: flex;
|
flex-direction: column;
|
gap: 10px;
|
}
|
.card_item {
|
background: #fff;
|
border-radius: 10px;
|
padding: 10px;
|
box-shadow: 0 2px 8px rgba(0,0,0,0.05);
|
}
|
.card_header {
|
display: flex;
|
align-items: center;
|
gap: 8px;
|
margin-bottom: 6px;
|
}
|
.card_title { font-weight: 500; color: #333; margin-left: auto; }
|
.card_body .row { display: flex; justify-content: space-between; padding: 4px 0; }
|
.card_body .row.inline { display: flex; gap: 10px; flex-wrap: wrap; }
|
.card_body .row.inline .col { min-width: 45%; display: flex; justify-content: space-between; }
|
.label { color: #666; font-size: 12px; }
|
.value { color: #333; font-size: 12px; }
|
.card_actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 8px; }
|
.ml8 { margin-left: 8px; }
|
|
</style>
|
