304 lines
8.1 KiB
Vue
304 lines
8.1 KiB
Vue
<template>
|
|
<page-container>
|
|
<!-- 页面操作栏 -->
|
|
<template #ops>
|
|
<a-row>
|
|
<a-col :span="18">
|
|
<a-input-search v-model:value="searchKey" :placeholder="`请输入`" allow-clear enter-button
|
|
@search="loadData()"></a-input-search>
|
|
</a-col>
|
|
<a-col :span="6">
|
|
<a-button type="primary" style="margin-left: 10px" @click="formDrawer?.show()">
|
|
<template #icon>
|
|
<icon-font type="icon-plus" />
|
|
</template>
|
|
申请扫码
|
|
</a-button>
|
|
|
|
</a-col>
|
|
</a-row>
|
|
</template>
|
|
<!-- 页面表格内容 -->
|
|
<div style="min-height: calc(100vh - 305px)">
|
|
<!-- 表格行 -->
|
|
<a-table :columns="columns" :data-source="auditPage?.records" bordered :pagination="pagination" :loading="loading"
|
|
row-key="key">
|
|
<template #bodyCell="{ column, record }">
|
|
<template v-if="column.dataIndex === 'auditType'">
|
|
{{ record.auditType === 'ALL' ? '全部盘点' : '部分盘点' }}
|
|
</template>
|
|
<template v-if="column.dataIndex === 'reviewResult'">
|
|
<template v-if="record.reviewResult === 'WAIT_SCAN'"> 待扫码</template>
|
|
<template v-if="record.reviewResult === 'WAIT_SUBMIT'"> 待提交</template>
|
|
<template v-if="record.reviewResult === 'WAIT_REVIEW'"> 待审核 </template>
|
|
<template v-if="record.reviewResult === 'PASS'"> 审核通过</template>
|
|
<template v-if="record.reviewResult === 'REJECT'"> 退回</template>
|
|
</template>
|
|
<template v-if="column.dataIndex === 'operation'">
|
|
<a-button type="link" @click="showModal(record.id)" v-if="record.reviewResult === 'WAIT_SCAN'
|
|
|| record.reviewResult === 'REJECT'">
|
|
<template #icon>
|
|
<icon-font type="icon-edit" />
|
|
</template>
|
|
开始扫码
|
|
</a-button>
|
|
<a-button type="link" style="margin-left: 10px" @click="showResultModal(record.id)"
|
|
v-if="record.reviewResult === 'WAIT_SUBMIT' || record.reviewResult === 'WAIT_SCAN'">
|
|
<template #icon>
|
|
<icon-font type="icon-plus" />
|
|
</template>
|
|
生成结果
|
|
</a-button>
|
|
<a-button type="link" style="margin-left: 10px" v-if="record.reviewResult === 'WAIT_REVIEW'">
|
|
<template #icon>
|
|
<icon-font type="icon-plus" />
|
|
</template>
|
|
审核
|
|
</a-button>
|
|
</template>
|
|
</template>
|
|
|
|
</a-table>
|
|
</div>
|
|
</page-container>
|
|
|
|
<!-- 新增申请抽屉 -->
|
|
<form-drawer ref="formDrawer" v-model="applyForm" :form-items="items" :config="formConfig"
|
|
:disabled-fields=disabledFields @ok="doSave" title="扫码盘点" />
|
|
<!-- 盘点作业弹窗 -->
|
|
<a-modal v-model:open="open" title="盘点作业" width="100%" wrap-class-name="full-modal" @ok="handleOk"
|
|
:confirm-loading="confirmLoading">
|
|
<scan-form ref="scanFormRef" :apply-id="applyIdRef" :total-value="88"></scan-form>
|
|
</a-modal>
|
|
<!-- 盘点结果弹窗 -->
|
|
<a-modal v-model:open="openResult" title="盘点异常数据：" okText= "提交审核" @ok="submitHandle" width="80%" :confirm-loading="confirmLoading">
|
|
<result-form ref="handleResultRef" :apply-id="applyIdRef"></result-form>
|
|
</a-modal>
|
|
|
|
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import api from '@/api';
|
|
import { IPage } from '@/api/api'
|
|
import FormDrawer from '@/components/form-render/form-drawer.vue'
|
|
import { config, formItems } from './form'
|
|
import { notification } from 'ant-design-vue'
|
|
import dayjs from 'dayjs';
|
|
import { useUserStore } from '@/stores/user'
|
|
import scanForm from '../component/scanForm.vue'
|
|
import resultForm from '../stocktaking/resultForm.vue'
|
|
|
|
|
|
const searchKey = ref('')
|
|
const userStore = useUserStore()
|
|
const scanFormRef = ref(); // 盘点作业弹窗组件
|
|
const handleResultRef = ref(); // 盘点结果弹窗组件
|
|
const confirmLoading = ref(false) // 盘点作业弹窗提交按钮loading
|
|
// 新增申请表单对象
|
|
const applyForm = ref<Partial<material.AuditApplyInfo>>({
|
|
auditType: 'ALL',
|
|
applicant: userStore.userName,
|
|
type: 'AUDIT',
|
|
applyDate: dayjs() + '',
|
|
isConfirm: false,
|
|
reviewResult: 'WAIT_SCAN'
|
|
|
|
})
|
|
|
|
//列表数据
|
|
const auditPage = ref<IPage<material.ApplyForm>>()
|
|
const loading = ref(false)
|
|
|
|
//新增申请的下拉框选择对象
|
|
const materialList = ref<Array<{ value: string | undefined, label: string | undefined }>>([])
|
|
const personList = ref<Array<{ value: string | undefined, label: string | undefined }>>([])
|
|
const required = ref(false)
|
|
api.materialApi.material.all((data) => {
|
|
materialList.value = data.map(item => {
|
|
return {
|
|
value: item?.id + '',
|
|
label: item?.name
|
|
}
|
|
})
|
|
})
|
|
api.aclApi.user.all((data) => {
|
|
personList.value = data.map(item => {
|
|
return {
|
|
value: item?.name,
|
|
label: item?.fullName
|
|
}
|
|
})
|
|
})
|
|
|
|
//是否必填
|
|
const disabledFields = computed(() => {
|
|
if (applyForm.value?.auditType !== 'ALL') {
|
|
required.value = true
|
|
}
|
|
return applyForm.value?.auditType === 'ALL' ? ['materials'] : []
|
|
})
|
|
|
|
//抽屉组件
|
|
const formDrawer = ref<typeof FormDrawer>()
|
|
const formConfig = computed(() => {
|
|
return config
|
|
})
|
|
//表单配置
|
|
const items = computed(() => {
|
|
return formItems(materialList.value, required, personList.value)
|
|
})
|
|
// 加载数据的方法
|
|
const loadData = async (page = 1, size = 10) => {
|
|
loading.value = true
|
|
api.materialApi.apply.searchAuditPage(
|
|
{
|
|
page: page,
|
|
size: size,
|
|
reviewResults: ['WAIT_SUBMIT', 'WAIT_SCAN', 'WAIT_REVIEW', 'PASS'],
|
|
}, (data) => {
|
|
auditPage.value = data
|
|
loading.value = false
|
|
});
|
|
}
|
|
//初始加载
|
|
loadData()
|
|
|
|
//表格列
|
|
const columns = [
|
|
{
|
|
title: '申请ID',
|
|
dataIndex: 'id',
|
|
},
|
|
{
|
|
title: '盘点类型',
|
|
dataIndex: 'auditType',
|
|
},
|
|
{
|
|
title: '申请人',
|
|
dataIndex: 'applicant',
|
|
},
|
|
{
|
|
title: '盘点人',
|
|
dataIndex: 'taker',
|
|
},
|
|
{
|
|
title: '任务状态',
|
|
dataIndex: 'reviewResult',
|
|
},
|
|
{
|
|
title: '盘点审核人',
|
|
dataIndex: 'reviewer',
|
|
},
|
|
|
|
{
|
|
title: '创建时间',
|
|
dataIndex: 'createdTime',
|
|
},
|
|
{
|
|
title: '操作',
|
|
dataIndex: 'operation',
|
|
width: 400,
|
|
}
|
|
]
|
|
|
|
//分页信息
|
|
const pagination = computed(() => {
|
|
return {
|
|
current: auditPage.value?.current,
|
|
pageSize: auditPage.value?.size,
|
|
total: auditPage.value?.total,
|
|
onChange: (page: number, pageSize: number) => {
|
|
loadData(page, pageSize)
|
|
},
|
|
}
|
|
})
|
|
|
|
// 新增申请保存
|
|
const doSave = (_data: material.AuditApplyInfo) => {
|
|
api.materialApi.apply.auditApply(_data, () => {
|
|
formDrawer.value?.close()
|
|
notification.success({
|
|
message: '操作成功',
|
|
description: '盘点申请保存成功,页面将自动刷新!',
|
|
onClose: () => {
|
|
loadData(1)
|
|
},
|
|
})
|
|
})
|
|
|
|
}
|
|
|
|
// 盘点作业弹窗相关
|
|
const open = ref<boolean>(false);
|
|
const applyIdRef = ref();
|
|
const showModal = (applyId: number) => {
|
|
open.value = true;
|
|
applyIdRef.value = applyId;
|
|
|
|
};
|
|
// 盘点作业提交数据
|
|
|
|
|
|
//关闭弹窗 提交数据
|
|
const handleOk = () => {
|
|
confirmLoading.value = true;
|
|
if (scanFormRef.value) {
|
|
const data = scanFormRef.value.getApplyData();
|
|
api.materialApi.apply.saveScanData(applyIdRef.value, data, () => {
|
|
open.value = false;
|
|
confirmLoading.value = false;
|
|
loadData(1)
|
|
})
|
|
}
|
|
|
|
};
|
|
|
|
// 盘点结果弹窗相关
|
|
const openResult = ref<boolean>(false);
|
|
const showResultModal = (applyId: number) => {
|
|
window.console.log("点击传参" + applyId);
|
|
openResult.value = true;
|
|
applyIdRef.value = applyId;
|
|
};
|
|
|
|
// 盘点结果提交数据
|
|
const submitHandle = () => {
|
|
confirmLoading.value = true;
|
|
const handleData =handleResultRef.value.getTableData();
|
|
api.materialApi.apply.updateReviewResult(applyIdRef.value, handleData, () => {
|
|
openResult.value = false;
|
|
loadData(1)
|
|
});
|
|
confirmLoading.value = false;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
<style lang="less">
|
|
.full-modal {
|
|
.ant-modal {
|
|
max-width: 100%;
|
|
top: 0;
|
|
padding-bottom: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
.ant-modal-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: calc(100vh);
|
|
}
|
|
|
|
.ant-modal-body {
|
|
flex: 1;
|
|
}
|
|
}
|
|
</style>
|