222 lines
8.1 KiB
Vue
222 lines
8.1 KiB
Vue
<template>
|
||
<el-card class="hl-card" style="position: relative">
|
||
<template #header>
|
||
<span>详情页</span>
|
||
</template>
|
||
<el-form ref="formRef" :model="formData" label-width="160px" v-loading="formLoading">
|
||
<!-- 基础信息 -->
|
||
<el-card class="hl-card-info">
|
||
<template #header>
|
||
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">基础信息</span>
|
||
</template>
|
||
|
||
<el-row>
|
||
<el-col :span="24">
|
||
<el-row>
|
||
|
||
<el-col :span="6">
|
||
<el-row>
|
||
<el-col :span="24">
|
||
<el-form-item label="采购单号" prop="purchaseNo">
|
||
<el-input class="!w-300px" placeholder="系统自动生成" v-model="formData.purchaseNo" disabled />
|
||
</el-form-item>
|
||
</el-col>
|
||
</el-row>
|
||
</el-col>
|
||
</el-row>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
|
||
<!-- 需求单信息 -->
|
||
<el-card class="hl-card-info">
|
||
<template #header>
|
||
<div class="hl-card-info-icona"></div><span class="hl-card-info-text">采购单信息</span>
|
||
</template>
|
||
<el-row>
|
||
<el-col>
|
||
<el-card class="hl-incard">
|
||
<el-table :data="formData.matBoomDOList" class="hl-table" v-loading="loading">
|
||
<el-table-column type="index" label="序号" fixed align="center" min-width="60" />
|
||
<el-table-column prop="projectName" min-width="200" label="项目名称" align="center"/>
|
||
<el-table-column prop="projectName" min-width="200" label="子项目编码" align="center"/>
|
||
<el-table-column prop="boomName" min-width="200" label="物料名称" align="center"/>
|
||
<el-table-column prop="procedureName" min-width="120" label="工序" align="center"/>
|
||
<el-table-column prop="composition" min-width="120" label="材质" align="center"/>
|
||
<el-table-column prop="boomAmount" min-width="100" label="需求数量" align="center"/>
|
||
<el-table-column prop="purchaseAmount" min-width="100" label="采购数量" align="center"/>
|
||
<el-table-column prop="requireTime" min-width="200" label="需要完成日期" align="center" :formatter="dateFormatter1"/>
|
||
<el-table-column prop="arriveTime" min-width="200" label="预计到货日期" align="center" :formatter="dateFormatter1"/>
|
||
<el-table-column prop="supplierName" min-width="100" label="供应商" align="center"/>
|
||
<el-table-column prop="description" min-width="200" label="技术要求" align="center"/>
|
||
<el-table-column prop="theWeight" min-width="100" label="理论重量(吨)" align="center"/>
|
||
<el-table-column prop="estimatedPrice" min-width="100" label="预估总价" align="center"/>
|
||
</el-table>
|
||
<Pagination :total="total" v-model:page="queryParams.pageNo" v-model:limit="queryParams.pageSize"
|
||
@pagination="getList" />
|
||
</el-card>
|
||
</el-col>
|
||
</el-row>
|
||
</el-card>
|
||
</el-form>
|
||
<div class="hl-footer text-center">
|
||
<template v-if="formData.type === 'check'">
|
||
<el-button @click="approve" size="large">批 准</el-button>
|
||
<el-button @click="handleReject" size="large">驳 回</el-button>
|
||
<el-button @click="cancel" size="large">取 消</el-button>
|
||
</template>
|
||
<template v-if="formData.type === 'detail'">
|
||
<el-button @click="cancel" size="large">取 消</el-button>
|
||
</template>
|
||
</div>
|
||
</el-card>
|
||
|
||
<!-- 表单弹窗：物料列表 -->
|
||
</template>
|
||
<script setup lang="ts">
|
||
import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
|
||
import * as MaterialPlanApi from '@/api/heli/materialplan'
|
||
import * as MaterialPlanDetailApi from '@/api/heli/materialplandetail'
|
||
import * as MaterialPlanBoomApi from '@/api/heli/materialplanboom'
|
||
import type { UploadUserFile } from 'element-plus'
|
||
import * as PlanApi from '@/api/heli/plan'
|
||
import * as PlanSubApi from '@/api/heli/plansub'
|
||
import * as ProjectOrderApi from '@/api/heli/projectorder'
|
||
import * as UserApi from '@/api/system/user'
|
||
import * as MaterialApi from '@/api/heli/material'
|
||
import { deleteFile, downloadFile, getFilePage } from '@/api/infra/file'
|
||
import download from '@/utils/download'
|
||
import { getAccessToken, getTenantId } from '@/utils/auth'
|
||
import {dateFormatter, dateFormatter1, formatDate} from '@/utils/formatTime'
|
||
import { useUserStore } from '@/store/modules/user'
|
||
import { useTagsViewStore } from '@/store/modules/tagsView'
|
||
import MaterialSelect from '@/views/heli/hlvuestyle/materialSelect.vue'
|
||
import booms from './boom.vue'
|
||
import * as PartPurchaseOrderApi from "@/api/heli/partpurchaseorder";
|
||
import { ElMessageBox } from 'element-plus'
|
||
import { ref } from 'vue'
|
||
|
||
const reload: any = inject('reload')
|
||
const { t } = useI18n() // 国际化
|
||
const message = useMessage() // 消息弹窗
|
||
const { query } = useRoute()
|
||
const router = useRouter()
|
||
const tagsViewStore = useTagsViewStore()
|
||
|
||
const dialogVisible = ref(false) // 弹窗的是否展示
|
||
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
|
||
const formData = ref({
|
||
id: undefined,
|
||
purchaseNo: undefined,
|
||
projectId: undefined,
|
||
projectPlanId: undefined,
|
||
projectPlanNo: undefined,
|
||
projectCode: undefined,
|
||
auditor: undefined,
|
||
createTime: new Date(),
|
||
status: undefined,
|
||
description: undefined,
|
||
boomItemDOList: [],
|
||
boomItemRemoveList: [],
|
||
matBoomDOList: [],
|
||
matItemRemoveList: [],
|
||
attachments: [],
|
||
type: undefined,
|
||
})
|
||
|
||
const formRef = ref() // 表单 Ref
|
||
const subFormRef = ref() // 表单 Ref
|
||
const loading = ref(true) // 列表的加载中
|
||
const total = ref(0) // 列表的总页数
|
||
const subBoomFormLoading = ref(false)
|
||
const subBoomFormRef = ref()
|
||
const updateParams = reactive({
|
||
id: query.id,
|
||
reason: undefined
|
||
})
|
||
|
||
|
||
|
||
const approve = async () => {
|
||
const checkParams = await PartPurchaseOrderApi.getPurchaseOrderMake(query.id)
|
||
if (checkParams.status != 1){
|
||
message.warning("该单据状态非待审核，请刷新界面！");
|
||
return;
|
||
}
|
||
|
||
await PartPurchaseOrderApi.updatePurchaseOrderMake(formData.value.id)
|
||
message.success("提交成功");
|
||
getList();
|
||
}
|
||
|
||
const handleReject = async () => {
|
||
const checkParams = await PartPurchaseOrderApi.getPurchaseOrderMake(query.id)
|
||
if (checkParams.status != 1){
|
||
message.warning("该单据状态非待审核，请刷新界面！");
|
||
return;
|
||
}
|
||
|
||
try {
|
||
const { value, action } = await ElMessageBox.prompt('请输入驳回原因', '提示', {
|
||
confirmButtonText: '确定',
|
||
cancelButtonText: '取消',
|
||
inputPattern: /.+/, // 至少输入一个字符
|
||
inputErrorMessage: '内容不能为空'
|
||
})
|
||
|
||
if (action === 'confirm') {
|
||
reject(value) // 将输入内容传入 reject 方法
|
||
}
|
||
} catch (err) {
|
||
// 用户点击取消或输入不合法时会进入这里
|
||
console.log('操作取消或输入无效')
|
||
}
|
||
}
|
||
|
||
// 假设这是你要调用的 reject 方法
|
||
const reject = async(reason) => {
|
||
console.log('驳回原因:', reason)
|
||
updateParams.reason = reason
|
||
// 这里可以执行提交驳回逻辑
|
||
await PartPurchaseOrderApi.updatePurchaseOrderMakeNo(updateParams)
|
||
message.success("已驳回");
|
||
getList();
|
||
}
|
||
|
||
const cancel = async () => {
|
||
router.push({ path: '/purchase/PartPurchaseCheck'}).then(() => {
|
||
window.close();
|
||
});
|
||
}
|
||
|
||
const closeForm = async () => {
|
||
router.push({ path: '/purchase/management' })
|
||
tagsViewStore.delVisitedView(router.currentRoute.value)
|
||
}
|
||
const userList = ref<UserApi.UserVO[]>([]) // 用户列表
|
||
|
||
const queryParams = reactive({
|
||
pageNo: 1,
|
||
pageSize: 10,
|
||
purchaseOrderId: query.id
|
||
})
|
||
// 页面数据加载初始化
|
||
onMounted(async () => {
|
||
// 获取物料需求计划信息
|
||
formData.value = await PartPurchaseOrderApi.getPurchaseOrderMake(query.id)
|
||
formData.value.type = query.type
|
||
getList();
|
||
})
|
||
const getList = async () => {
|
||
loading.value = true
|
||
try {
|
||
const data = await PartPurchaseOrderApi.getPartPage(queryParams)
|
||
formData.value.matBoomDOList = data.list
|
||
total.value = data.total
|
||
} finally {
|
||
loading.value = false
|
||
}
|
||
}
|
||
|
||
</script>
|