<template>
|
<view>
|
<up-popup v-model:show="dialogFormVisible" mode="bottom" round="12" :customStyle="{ height: '70vh' }" @close="closeDia">
|
<view class="dia-container">
|
<view class="dia-header">
|
<text class="title">生产报工</text>
|
</view>
|
|
<scroll-view class="rows" scroll-y>
|
<up-form :model="form" label-width="120" ref="formRef">
|
<up-form-item label="排产数量">
|
<up-input v-model="form.schedulingNum" placeholder="请输入" disabled />
|
</up-form-item>
|
<up-form-item label="本次生产数量" prop="finishedNum">
|
<up-input v-model="form.finishedNum" type="number" placeholder="请输入" @change="changeNum" />
|
</up-form-item>
|
<up-form-item label="待生产数量">
|
<up-input v-model="form.pendingNum" placeholder="请输入" disabled />
|
</up-form-item>
|
<up-form-item label="生产人" @click="openUserPicker">
|
<up-input v-model="form.schedulingUserName" placeholder="选择人员" readonly @click="openUserPicker" />
|
<template #right>
|
<up-icon name="arrow-right" @click="openUserPicker"></up-icon>
|
</template>
|
</up-form-item>
|
<up-form-item label="生产日期" @click="openDatePicker">
|
<up-input v-model="form.schedulingDate" placeholder="请选择日期" readonly @click="openDatePicker" />
|
<template #right>
|
<up-icon name="calendar" @click="openDatePicker"></up-icon>
|
</template>
|
</up-form-item>
|
</up-form>
|
</scroll-view>
|
|
<view class="dia-footer">
|
<up-button type="primary" @click="submitForm">确认</up-button>
|
<up-button @click="closeDia">取消</up-button>
|
</view>
|
</view>
|
</up-popup>
|
|
<!-- 日期选择器 -->
|
<up-popup :show="datePicker.show" mode="bottom" @close="datePicker.show = false">
|
<up-datetime-picker :show="true" v-model="datePicker.value" mode="date" @confirm="onDateConfirm" @cancel="datePicker.show = false" />
|
</up-popup>
|
|
<!-- 人员选择器 -->
|
<up-action-sheet :show="userPicker.show" :actions="userActionList" title="选择人员" @select="onUserSelect" @close="userPicker.show = false" />
|
</view>
|
</template>
|
|
<script setup>
|
import { ref, reactive, toRefs, getCurrentInstance, computed } from "vue";
|
import { userListNoPageByTenantId } from "@/api/system/user.js";
|
import { productionReport, productionReportUpdate } from "@/api/productionManagement/productionReporting.js";
|
const { proxy } = getCurrentInstance()
|
|
const emit = defineEmits(['close'])
|
|
const userList = ref([])
|
const dialogFormVisible = ref(false);
|
const operationType = ref('')
|
const data = reactive({
|
form: {
|
successNum: "",
|
schedulingNum: "",
|
finishedNum: "",
|
schedulingUserId: "",
|
schedulingUserName: "",
|
schedulingDate: "",
|
},
|
rules: {
|
schedulingNum: [{ required: true, message: "请输入", trigger: "blur" },],
|
},
|
});
|
const { form, rules } = toRefs(data);
|
|
// pickers
|
const datePicker = ref({ show: false, value: Date.now() })
|
const userPicker = ref({ show: false })
|
const userActionList = computed(() => userList.value.map(u => ({ name: u.nickName, value: u.userId })))
|
|
// 打开弹框
|
const openDialog = (type, row) => {
|
operationType.value = type;
|
dialogFormVisible.value = true;
|
userListNoPageByTenantId().then((res) => {
|
userList.value = res.data;
|
});
|
form.value = { ...row, schedulingUserName: row.schedulingUserName || '' }
|
// 初始化：本次生产数量置空，待生产 = 排产数量
|
const sched = Number(form.value.schedulingNum) || 0
|
form.value.finishedNum = ''
|
form.value.pendingNum = sched
|
}
|
|
const changeNum = (value) => {
|
const sched = Number(form.value.schedulingNum) || 0
|
let num = Number(value)
|
if (isNaN(num) || num < 0) num = 0
|
if (num > sched) {
|
num = sched
|
uni.showToast({ title: '本次生产数量不可大于排产数量', icon: 'none' })
|
}
|
form.value.finishedNum = String(num)
|
form.value.pendingNum = sched - num
|
}
|
|
const openDatePicker = () => {
|
datePicker.value.value = Date.now()
|
datePicker.value.show = true
|
}
|
const onDateConfirm = (e) => {
|
const d = new Date(e.value)
|
const y = d.getFullYear(); const m = String(d.getMonth()+1).padStart(2, '0'); const day = String(d.getDate()).padStart(2, '0')
|
form.value.schedulingDate = `${y}-${m}-${day}`
|
datePicker.value.show = false
|
}
|
const openUserPicker = () => { userPicker.value.show = true }
|
const onUserSelect = (item) => {
|
if (item) {
|
form.value.schedulingUserId = item.value
|
form.value.schedulingUserName = item.name
|
}
|
userPicker.value.show = false
|
}
|
|
// 提交产品表单
|
const submitForm = () => {
|
// 简化校验：仅确保必填字段
|
if (!form.value.finishedNum || !form.value.schedulingUserId || !form.value.schedulingDate) {
|
uni.showToast({ title: '请完善必填信息', icon: 'none' })
|
return
|
}
|
form.value.staffState = 1
|
const req = operationType.value === 'add' ? productionReport : productionReportUpdate
|
req(form.value).then(() => {
|
uni.showToast({ title: '提交成功', icon: 'success' })
|
closeDia()
|
})
|
}
|
|
// 关闭弹框
|
const closeDia = () => {
|
dialogFormVisible.value = false;
|
emit('close')
|
};
|
|
defineExpose({
|
openDialog,
|
});
|
</script>
|
|
<style scoped lang="scss">
|
.dia-container { padding: 12px; height: 100%; display: flex; flex-direction: column; }
|
.dia-header { display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
|
.title { font-weight: 600; font-size: 16px; color: #333; }
|
.rows { flex: 1; min-height: 0; overflow-y: auto; }
|
.dia-footer { display: flex; gap: 10px; justify-content: flex-end; padding-top: 8px; }
|
</style>
|
