|
|
<template>
|
|
|
<div class="dv-repair-panel">
|
|
|
<div class="dv-repair-panel__header">
|
|
|
<div class="dv-repair-panel__title">
|
|
|
<span>{{ dialogTitle }}</span>
|
|
|
<dict-tag
|
|
|
v-if="formType === 'detail' && formData.status !== undefined"
|
|
|
class="ml-8px"
|
|
|
:type="DICT_TYPE.ERP_AUDIT_STATUS"
|
|
|
:value="formData.status"
|
|
|
/>
|
|
|
</div>
|
|
|
<el-button text @click="closeForm">
|
|
|
<Icon icon="ep:close" />
|
|
|
</el-button>
|
|
|
</div>
|
|
|
<div class="dv-repair-dialog" v-loading="formLoading">
|
|
|
<el-form
|
|
|
ref="formRef"
|
|
|
:model="formData"
|
|
|
:rules="formRules"
|
|
|
label-width="auto"
|
|
|
:disabled="disabled"
|
|
|
>
|
|
|
<el-form-item prop="code">
|
|
|
<template #label>
|
|
|
<span>
|
|
|
{{ t('ErpStock.In.no') }}
|
|
|
<el-tooltip :content="t('ErpStock.In.no')" placement="top">
|
|
|
<Icon icon="ep:question-filled" />
|
|
|
</el-tooltip>
|
|
|
</span>
|
|
|
</template>
|
|
|
<el-row :gutter="10" style="width: 100%">
|
|
|
<el-col :xs="24" :sm="18" :md="16" :lg="14" :xl="12">
|
|
|
<el-input
|
|
|
:disabled="formData.isCode == true || formType === 'update'"
|
|
|
v-model="formData.no"
|
|
|
:placeholder="t('common.code')"
|
|
|
/>
|
|
|
</el-col>
|
|
|
<el-col :xs="24" :sm="6" :md="4" :lg="3" :xl="2">
|
|
|
<div>
|
|
|
<el-switch
|
|
|
v-model="formData.isCode"
|
|
|
:disabled="formType === 'update'"
|
|
|
/>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-form-item>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="t('ErpStock.In.inType')" prop="inType">
|
|
|
<el-select
|
|
|
v-model="formData.inType"
|
|
|
clearable
|
|
|
filterable
|
|
|
:placeholder="t('ErpStock.In.placeholderInType')"
|
|
|
class="!w-1/1"
|
|
|
@change="handleInTypeChange"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in options"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
:disabled="item.disabled"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="t('ErpStock.In.inTime')" prop="inTime">
|
|
|
<el-date-picker
|
|
|
v-model="formData.inTime"
|
|
|
type="date"
|
|
|
value-format="x"
|
|
|
:placeholder="t('ErpStock.In.placeholderInTime')"
|
|
|
class="!w-1/1"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="t('ErpStock.In.stockUser')" prop="stockUserId">
|
|
|
<el-select
|
|
|
v-model="formData.stockUserId"
|
|
|
clearable
|
|
|
filterable
|
|
|
:placeholder="t('ErpStock.In.placeholderStockUser')"
|
|
|
class="!w-1/1"
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="item in userList"
|
|
|
:key="String(item.id)"
|
|
|
:label="item.nickname"
|
|
|
:value="String(item.id)"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="t('ErpStock.In.remark')" prop="remark">
|
|
|
<el-input
|
|
|
type="textarea"
|
|
|
v-model="formData.remark"
|
|
|
:rows="1"
|
|
|
:placeholder="t('ErpStock.In.placeholderRemark')"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col :span="8">
|
|
|
<el-form-item :label="t('ErpStock.In.file')" prop="fileUrl">
|
|
|
<UploadFile :is-show-tip="false" v-model="formData.fileUrl" :limit="1" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-form>
|
|
|
<!-- 子表的表单 -->
|
|
|
<ContentWrap>
|
|
|
<el-tabs v-model="subTabsName" class="-mt-15px -mb-10px">
|
|
|
<el-tab-pane :label="t('ErpStock.In.list')" name="item">
|
|
|
<StockInItemForm
|
|
|
ref="itemFormRef"
|
|
|
:items="formData.items"
|
|
|
:in-type="formData.inType"
|
|
|
:disabled="disabled"
|
|
|
/>
|
|
|
</el-tab-pane>
|
|
|
<el-tab-pane v-if="showAuditRecordTab" :label="t('ErpStock.In.auditRecord')" name="auditRecord">
|
|
|
<el-table
|
|
|
v-loading="auditRecordLoading"
|
|
|
:data="auditRecordList"
|
|
|
border
|
|
|
size="small"
|
|
|
:stripe="true"
|
|
|
:show-overflow-tooltip="true"
|
|
|
>
|
|
|
<el-table-column label="变更前状态" prop="fromStatus" align="center" min-width="110">
|
|
|
<template #default="scope">
|
|
|
<dict-tag :type="DICT_TYPE.ERP_AUDIT_STATUS" :value="scope.row.fromStatus" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="变更后状态" prop="toStatus" align="center" min-width="110">
|
|
|
<template #default="scope">
|
|
|
<dict-tag :type="DICT_TYPE.ERP_AUDIT_STATUS" :value="scope.row.toStatus" />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="目标审核人" prop="targetUserName" min-width="120" />
|
|
|
<el-table-column label="操作人" prop="creatorName" min-width="120" />
|
|
|
<el-table-column label="操作时间" prop="createTime" :formatter="dateFormatter" min-width="170" />
|
|
|
<el-table-column label="备注" prop="remark" min-width="160" show-overflow-tooltip />
|
|
|
</el-table>
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</ContentWrap>
|
|
|
</div>
|
|
|
<div class="dv-repair-footer">
|
|
|
<el-button @click="closeForm">{{ t('common.cancel') }}</el-button>
|
|
|
<el-button @click="submitForm" type="primary" :disabled="formLoading" v-if="!disabled">
|
|
|
{{ t('common.ok') }}
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
|
|
|
import { dateFormatter, getNowDateTime } from '@/utils/formatTime'
|
|
|
import { StockInApi, StockInApproveRecordVO, StockInVO } from '@/api/erp/stock/in'
|
|
|
import StockInItemForm from './components/StockInItemForm.vue'
|
|
|
import { SupplierApi, SupplierVO } from '@/api/erp/purchase/supplier'
|
|
|
import { getSimpleUserList, type UserVO } from '@/api/system/user'
|
|
|
import { useUserStore } from '@/store/modules/user'
|
|
|
|
|
|
/** ERP 其它入库单 表单 */
|
|
|
defineOptions({ name: 'StockInForm' })
|
|
|
|
|
|
const { t } = useI18n() // 国际化
|
|
|
const message = useMessage()
|
|
|
const userStore = useUserStore()
|
|
|
|
|
|
const dialogTitle = ref('') // 弹窗的标题
|
|
|
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
|
|
const formType = ref('') // 表单的类型：create - 新增；update - 修改；detail - 详情
|
|
|
const formData = ref({
|
|
|
id: undefined,
|
|
|
supplierId: undefined,
|
|
|
inTime: undefined,
|
|
|
inType: undefined,
|
|
|
remark: undefined,
|
|
|
fileUrl: '',
|
|
|
items: [],
|
|
|
isCode: undefined,
|
|
|
no: undefined,
|
|
|
stockUserId: undefined,
|
|
|
status: undefined
|
|
|
})
|
|
|
const formRules = reactive({
|
|
|
inTime: [{ required: true, message: t('ErpStock.In.validatorInTimeRequired'), trigger: 'blur' }],
|
|
|
inType: [{ required: true, message: t('ErpStock.In.validatorInTypeRequired'), trigger: 'blur' }],
|
|
|
stockUserId: [{ required: true, message: t('ErpStock.In.validatorStockUserRequired'), trigger: 'change' }]
|
|
|
})
|
|
|
const disabled = computed(() => formType.value === 'detail')
|
|
|
const formRef = ref() // 表单 Ref
|
|
|
const supplierList = ref<SupplierVO[]>([]) // 供应商列表
|
|
|
const userList = ref<UserVO[]>([]) // 经办人列表
|
|
|
const WAREHOUSE_DOCUMENT_TYPES = 'warehouse_document_types'
|
|
|
const options = computed(() => getStrDictOptions(WAREHOUSE_DOCUMENT_TYPES))
|
|
|
watch(options, (items) => {
|
|
|
if (formType.value === 'create' && !formData.value.inType && items.length) {
|
|
|
formData.value.inType = items[0].value
|
|
|
}
|
|
|
})
|
|
|
/** 子表的表单 */
|
|
|
const subTabsName = ref('item')
|
|
|
const itemFormRef = ref()
|
|
|
const auditRecordLoading = ref(false)
|
|
|
const auditRecordList = ref<StockInApproveRecordVO[]>([])
|
|
|
const showAuditRecordTab = computed(() => formType.value === 'detail' && Number(formData.value.status) !== 0)
|
|
|
|
|
|
// 用于取消未完成的异步操作
|
|
|
const openRequestId = ref(0)
|
|
|
|
|
|
/** 关闭表单 */
|
|
|
const closeForm = () => {
|
|
|
openRequestId.value++
|
|
|
emit('closed')
|
|
|
}
|
|
|
|
|
|
/** 打开弹窗 */
|
|
|
const open = async (type: string, id?: number) => {
|
|
|
const currentRequestId = ++openRequestId.value
|
|
|
dialogTitle.value = t('action.' + type)
|
|
|
formType.value = type
|
|
|
subTabsName.value = 'item'
|
|
|
resetForm()
|
|
|
// 修改时，设置数据
|
|
|
if (id) {
|
|
|
formLoading.value = true
|
|
|
try {
|
|
|
formData.value = await StockInApi.getStockIn(id)
|
|
|
formData.value.stockUserId = normalizeUserId(formData.value.stockUserId)
|
|
|
if (type === 'detail' && Number(formData.value.status) !== 0) {
|
|
|
await getAuditRecordList(id)
|
|
|
}
|
|
|
if (currentRequestId !== openRequestId.value) return
|
|
|
} finally {
|
|
|
formLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
// 加载供应商列表
|
|
|
const [suppliers, users] = await Promise.all([
|
|
|
SupplierApi.getSupplierSimpleList(),
|
|
|
getSimpleUserList()
|
|
|
])
|
|
|
supplierList.value = suppliers
|
|
|
userList.value = users ?? []
|
|
|
}
|
|
|
|
|
|
const getAuditRecordList = async (id: number) => {
|
|
|
auditRecordLoading.value = true
|
|
|
try {
|
|
|
auditRecordList.value = await StockInApi.getApproveRecordList(id)
|
|
|
} finally {
|
|
|
auditRecordLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const normalizeUserId = (value: any) => {
|
|
|
if (value === undefined || value === null || value === '') return undefined
|
|
|
return String(value)
|
|
|
}
|
|
|
|
|
|
const getCurrentStockUserId = () => {
|
|
|
const userId = userStore.getUser?.id
|
|
|
return userId ? String(userId) : undefined
|
|
|
}
|
|
|
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
|
|
|
|
|
const handleInTypeChange = () => {
|
|
|
formData.value.items = []
|
|
|
nextTick(() => {
|
|
|
itemFormRef.value?.resetItems?.()
|
|
|
})
|
|
|
}
|
|
|
|
|
|
/** 提交表单 */
|
|
|
const emit = defineEmits(['success', 'closed']) // 定义 success 事件，用于操作成功后的回调
|
|
|
const submitForm = async () => {
|
|
|
// 校验表单
|
|
|
await formRef.value.validate()
|
|
|
await itemFormRef.value.validate()
|
|
|
// 提交请求
|
|
|
formLoading.value = true
|
|
|
try {
|
|
|
const data = {
|
|
|
...formData.value,
|
|
|
items: normalizeItemsForSubmit(formData.value.items)
|
|
|
} as unknown as StockInVO
|
|
|
if (formType.value === 'create') {
|
|
|
await StockInApi.createStockIn(data)
|
|
|
message.success(t('common.createSuccess'))
|
|
|
} else {
|
|
|
await StockInApi.updateStockIn(data)
|
|
|
message.success(t('common.updateSuccess'))
|
|
|
}
|
|
|
emit('success')
|
|
|
closeForm()
|
|
|
} finally {
|
|
|
formLoading.value = false
|
|
|
}
|
|
|
}
|
|
|
|
|
|
const normalizeItemsForSubmit = (items: any[] = []) => {
|
|
|
return items.map((item) => {
|
|
|
const { relatedTask, palletId, palletCode, taskCode, taskName, productCode, productUnitName, stockCount, totalPrice, ...rest } = item
|
|
|
const relateTask = item.relateTask === true || item.relateTask === 1 || item.relateTask === '1'
|
|
|
return {
|
|
|
...rest,
|
|
|
relateTask,
|
|
|
taskId: relateTask ? item.taskId : null,
|
|
|
pallets: Array.isArray(item.pallets) ? item.pallets : []
|
|
|
}
|
|
|
})
|
|
|
}
|
|
|
|
|
|
/** 重置表单 */
|
|
|
const resetForm = () => {
|
|
|
formData.value = {
|
|
|
id: undefined,
|
|
|
supplierId: undefined,
|
|
|
inTime: getNowDateTime().valueOf(),
|
|
|
inType: options.value[0]?.value,
|
|
|
remark: undefined,
|
|
|
fileUrl: undefined,
|
|
|
items: [],
|
|
|
isCode: true,
|
|
|
no: undefined,
|
|
|
stockUserId: getCurrentStockUserId(),
|
|
|
status: undefined
|
|
|
}
|
|
|
auditRecordList.value = []
|
|
|
formRef.value?.resetFields()
|
|
|
}
|
|
|
|
|
|
onBeforeUnmount(() => {
|
|
|
openRequestId.value++
|
|
|
})
|
|
|
</script>
|
|
|
<style scoped lang="scss">
|
|
|
.dv-repair-panel {
|
|
|
background: #fff;
|
|
|
border-radius: 12px;
|
|
|
box-shadow: var(--el-box-shadow-light);
|
|
|
}
|
|
|
|
|
|
.dv-repair-panel__header {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: space-between;
|
|
|
padding: 16px 20px;
|
|
|
border-bottom: 1px solid #ebeef5;
|
|
|
}
|
|
|
|
|
|
.dv-repair-panel__title {
|
|
|
color: #1f2937;
|
|
|
font-size: 18px;
|
|
|
font-weight: 600;
|
|
|
}
|
|
|
|
|
|
.dv-repair-dialog {
|
|
|
max-height: calc(100vh - 220px);
|
|
|
padding: 20px 20px 0;
|
|
|
padding-right: 16px;
|
|
|
overflow-y: auto;
|
|
|
}
|
|
|
|
|
|
.dv-repair-footer {
|
|
|
display: flex;
|
|
|
justify-content: flex-end;
|
|
|
gap: 12px;
|
|
|
width: 100%;
|
|
|
padding: 16px 20px 20px;
|
|
|
border-top: 1px solid #ebeef5;
|
|
|
}
|
|
|
|
|
|
@media (max-width: 1200px) {
|
|
|
.dv-repair-dialog :deep(.el-col) {
|
|
|
max-width: 100%;
|
|
|
flex: 0 100%;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@media (max-width: 768px) {
|
|
|
.dv-repair-panel__header {
|
|
|
padding: 14px 16px;
|
|
|
}
|
|
|
|
|
|
.dv-repair-dialog {
|
|
|
max-height: none;
|
|
|
padding: 16px 16px 0;
|
|
|
overflow-y: visible;
|
|
|
}
|
|
|
|
|
|
.dv-repair-footer {
|
|
|
padding: 16px;
|
|
|
}
|
|
|
}
|
|
|
</style>
|