| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <div class="search_form mb20"> |
| | | <div> |
| | | <span class="search_title">工序:</span> |
| | | <el-input v-model="searchForm.process" |
| | | style="width: 240px" |
| | | placeholder="请输入工序搜索" |
| | | @change="handleQuery" |
| | | clearable |
| | | :prefix-icon="Search" /> |
| | | <span style="margin-left: 10px" |
| | | class="search_title">检测日期:</span> |
| | | <el-date-picker v-model="searchForm.entryDate" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | type="daterange" |
| | | placeholder="请选择" |
| | | clearable |
| | | @change="changeDaterange" /> |
| | | <span style="margin-left: 10px" |
| | | class="search_title">生产工单号:</span> |
| | | <el-input v-model="searchForm.workOrderNo" |
| | | style="width: 240px" |
| | | placeholder="请输入生产工单号搜索" |
| | | @change="handleQuery" |
| | | clearable |
| | | :prefix-icon="Search" /> |
| | | <el-button type="primary" |
| | | @click="handleQuery" |
| | | style="margin-left: 10px">搜索</el-button> |
| | | </div> |
| | | <div> |
| | | <el-form ref="searchFormRef" |
| | | :model="searchForm" |
| | | class="demo-form-inline"> |
| | | <el-row :gutter="32"> |
| | | <el-col :span="6"> |
| | | <el-form-item label="名称" |
| | | prop="productName"> |
| | | <el-input v-model="searchForm.productName" |
| | | style="width: 300px" |
| | | placeholder="请输入名称搜索" |
| | | clearable /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="8"> |
| | | <el-form-item label="检验日期" |
| | | prop="entryDate"> |
| | | <el-date-picker v-model="searchForm.entryDate" |
| | | style="width: 360px" |
| | | value-format="YYYY-MM-DD" |
| | | format="YYYY-MM-DD" |
| | | type="daterange" |
| | | start-placeholder="起止日期" |
| | | end-placeholder="起止日期" |
| | | range-separator="-" |
| | | clearable |
| | | @change="changeDaterange" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item> |
| | | <el-button type="primary" |
| | | @click="getList"> |
| | | 搜索 |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <div class="actions"> |
| | | <el-button type="primary" |
| | | @click="openForm('add')">新增</el-button> |
| | | <el-button @click="handleOut">导出</el-button> |
| | |
| | | @pagination="pagination" |
| | | :total="page.total"></PIMTable> |
| | | </div> |
| | | <InspectionFormDia ref="inspectionFormDia" |
| | | @close="handleQuery"></InspectionFormDia> |
| | | <FormDia ref="formDia" |
| | | @close="handleQuery"></FormDia> |
| | | <files-dia ref="filesDia" |
| | | @close="handleQuery"></files-dia> |
| | | <el-dialog v-model="dialogFormVisible" |
| | | title="编辑检验员" |
| | | width="30%" |
| | | @close="closeDia"> |
| | | <el-form :model="form" |
| | | label-width="140px" |
| | | label-position="top" |
| | | :rules="rules" |
| | | ref="formRef"> |
| | | <el-form-item label="检验员:" |
| | | prop="checkName"> |
| | | <el-select v-model="form.checkName" |
| | | placeholder="请选择" |
| | | clearable> |
| | | <el-option v-for="item in userList" |
| | | :key="item.nickName" |
| | | :label="item.nickName" |
| | | :value="item.nickName" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-form> |
| | | <template #footer> |
| | | <div class="dialog-footer"> |
| | | <el-button type="primary" |
| | | @click="submitForm">确认</el-button> |
| | | <el-button @click="closeDia">取消</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script setup> |
| | | import { Search } from "@element-plus/icons-vue"; |
| | | import { |
| | | onMounted, |
| | | ref, |
| | |
| | | getCurrentInstance, |
| | | nextTick, |
| | | } from "vue"; |
| | | import InspectionFormDia from "@/views/qualityManagement/processInspection/components/inspectionFormDia.vue"; |
| | | import FormDia from "@/views/qualityManagement/processInspection/components/formDia.vue"; |
| | | import { ElMessageBox } from "element-plus"; |
| | | import { |
| | | downloadQualityInspect, |
| | | qualityInspectDel, |
| | | qualityInspectListPage, |
| | | qualityInspectUpdate, |
| | | submitQualityInspect, |
| | | } from "@/api/qualityManagement/rawMaterialInspection.js"; |
| | | import FilesDia from "@/views/qualityManagement/processInspection/components/filesDia.vue"; |
| | | import dayjs from "dayjs"; |
| | | import { userListNoPage } from "@/api/system/user.js"; |
| | | import useUserStore from "@/store/modules/user"; |
| | | |
| | | const data = reactive({ |
| | | searchForm: { |
| | | process: "", |
| | | entryDate: undefined, // 录入日期 |
| | | workOrderNo: "", |
| | | productName: "", |
| | | entryDate: undefined, // 检验日期 |
| | | entryDateStart: undefined, |
| | | entryDateEnd: undefined, |
| | | }, |
| | | rules: { |
| | | checkName: [{ required: true, message: "请选择", trigger: "change" }], |
| | | }, |
| | | }); |
| | | const { searchForm } = toRefs(data); |
| | | const tableColumn = ref([ |
| | | { |
| | | label: "检测日期", |
| | | label: "检验日期", |
| | | prop: "checkTime", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "生产工单号", |
| | | prop: "workOrderNo", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "工序", |
| | | prop: "process", |
| | | width: 230, |
| | | }, |
| | | { |
| | | label: "检验员", |
| | | prop: "checkName", |
| | | }, |
| | | { |
| | | label: "产品名称", |
| | | label: "名称", |
| | | prop: "productName", |
| | | minWidth: 160, |
| | | }, |
| | | { |
| | | label: "规格型号", |
| | | prop: "model", |
| | | minWidth: 140, |
| | | }, |
| | | { |
| | | label: "单位", |
| | | prop: "unit", |
| | | label: "材质", |
| | | prop: "material", |
| | | minWidth: 120, |
| | | }, |
| | | { |
| | | label: "总数量", |
| | | label: "数量", |
| | | prop: "quantity", |
| | | width: 100, |
| | | }, |
| | | { |
| | | label: "合格数量", |
| | | prop: "qualifiedQuantity", |
| | | label: "抽检数", |
| | | prop: "samplingCount", |
| | | width: 100, |
| | | }, |
| | | { |
| | | label: "不合格数量", |
| | | prop: "unqualifiedQuantity", |
| | | width: 100, |
| | | }, |
| | | { |
| | | label: "合格率", |
| | | prop: "passRate", |
| | | label: "判定", |
| | | prop: "verdict", |
| | | width: 100, |
| | | dataType: "tag", |
| | | formatType: params => { |
| | | if (!params) return ""; |
| | | const rate = parseFloat(params); |
| | | if (rate < 90) { |
| | | return "danger"; |
| | | } else if (rate === 100) { |
| | | if (params == "合格") { |
| | | return "success"; |
| | | } else { |
| | | return "warning"; |
| | | } |
| | | }, |
| | | }, |
| | | { |
| | | label: "检测单位", |
| | | prop: "checkCompany", |
| | | width: 120, |
| | | }, |
| | | { |
| | | label: "检测结果", |
| | | prop: "checkResult", |
| | | dataType: "tag", |
| | | formatType: params => { |
| | | if (params == "不合格") { |
| | | } else if (params == "不合格") { |
| | | return "danger"; |
| | | } else if (params == "合格") { |
| | | return "success"; |
| | | } else { |
| | | return "danger"; |
| | | return "info"; |
| | | } |
| | | }, |
| | | }, |
| | | { |
| | | label: "提交状态", |
| | | prop: "inspectState", |
| | | width: 100, |
| | | formatData: params => { |
| | | if (params) { |
| | | return "已提交"; |
| | |
| | | label: "操作", |
| | | align: "center", |
| | | fixed: "right", |
| | | width: 280, |
| | | width: 260, |
| | | operation: [ |
| | | { |
| | | name: "编辑", |
| | | type: "text", |
| | | clickFun: row => { |
| | | openForm("edit", row); |
| | | }, |
| | | disabled: row => { |
| | | // 已提交则禁用 |
| | | if (row.inspectState == 1) return true; |
| | | // 如果检验员有值,只有当前登录用户能编辑 |
| | | if (row.checkName) { |
| | | return row.checkName !== userStore.nickName; |
| | | } |
| | | return false; |
| | | }, |
| | | }, |
| | | { |
| | |
| | | clickFun: row => { |
| | | submit(row.id); |
| | | }, |
| | | disabled: row => { |
| | | // 已提交则禁用 |
| | | if (row.inspectState == 1) return true; |
| | | // 如果检验员有值,只有当前登录用户能提交 |
| | | if (row.checkName) { |
| | | return row.checkName !== userStore.nickName; |
| | | } |
| | | return false; |
| | | }, |
| | | }, |
| | | { |
| | | name: "分配检验员", |
| | | type: "text", |
| | | clickFun: row => { |
| | | if (!row.checkName) { |
| | | open(row); |
| | | } else { |
| | | proxy.$modal.msgError("检验员已存在"); |
| | | } |
| | | }, |
| | | disabled: row => { |
| | | return row.inspectState == 1 || row.checkName; |
| | | }, |
| | | }, |
| | | { |
| | | name: "下载", |
| | | type: "text", |
| | | clickFun: row => { |
| | | downLoadFile(row); |
| | | }, |
| | | }, |
| | | // { |
| | | // name: "下载", |
| | | // type: "text", |
| | | // clickFun: row => { |
| | | // downLoadFile(row); |
| | | // }, |
| | | // }, |
| | | ], |
| | | }, |
| | | ]); |
| | | const userList = ref([]); |
| | | const currentRow = ref(null); |
| | | const tableData = ref([]); |
| | | const selectedRows = ref([]); |
| | | const tableLoading = ref(false); |
| | | const dialogFormVisible = ref(false); |
| | | const form = ref({ |
| | | checkName: "", |
| | | }); |
| | | const page = reactive({ |
| | | current: 1, |
| | | size: 100, |
| | |
| | | }); |
| | | const formDia = ref(); |
| | | const filesDia = ref(); |
| | | const inspectionFormDia = ref(); |
| | | const { proxy } = getCurrentInstance(); |
| | | const userStore = useUserStore(); |
| | | |
| | | const changeDaterange = value => { |
| | | searchForm.value.entryDateStart = undefined; |
| | | searchForm.value.entryDateEnd = undefined; |
| | |
| | | qualityInspectListPage({ ...params, inspectType: 1 }) |
| | | .then(res => { |
| | | tableLoading.value = false; |
| | | tableData.value = res.data.records.map(item => { |
| | | const quantity = parseFloat(item.quantity); |
| | | const qualifiedQuantity = parseFloat(item.qualifiedQuantity); |
| | | let passRate = null; |
| | | if (!isNaN(quantity) && !isNaN(qualifiedQuantity) && quantity > 0) { |
| | | passRate = ((qualifiedQuantity / quantity) * 100).toFixed(2) + "%"; |
| | | } |
| | | return { |
| | | ...item, |
| | | passRate: passRate, |
| | | }; |
| | | }); |
| | | tableData.value = res.data.records; |
| | | page.total = res.data.total; |
| | | }) |
| | | .catch(err => { |
| | |
| | | formDia.value?.openDialog(type, row); |
| | | }); |
| | | }; |
| | | // 打开新增检验弹框 |
| | | const openInspectionForm = (type, row) => { |
| | | nextTick(() => { |
| | | inspectionFormDia.value?.openDialog(type, row); |
| | | }); |
| | | }; |
| | | // 打开附件弹框 |
| | | const openFilesFormDia = (type, row) => { |
| | | nextTick(() => { |
| | | filesDia.value?.openDialog(type, row); |
| | | }); |
| | | }; |
| | | // 提价 |
| | | const submit = async id => { |
| | | const res = await submitQualityInspect({ id: id }); |
| | | if (res.code === 200) { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | getList(); |
| | | } |
| | | }; |
| | | const open = async row => { |
| | | let userLists = await userListNoPage(); |
| | | userList.value = userLists.data; |
| | | currentRow.value = row; |
| | | dialogFormVisible.value = true; |
| | | }; |
| | | // 关闭弹框 |
| | | const closeDia = () => { |
| | | proxy.resetForm("formRef"); |
| | | dialogFormVisible.value = false; |
| | | }; |
| | | const submitForm = () => { |
| | | if (currentRow.value) { |
| | | const data = { |
| | | ...form.value, |
| | | id: currentRow.value.id, |
| | | }; |
| | | qualityInspectUpdate(data).then(res => { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | closeDia(); |
| | | getList(); |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 删除 |
| | |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }; |
| | | const downLoadFile = row => { |
| | | downloadQualityInspect({ id: row.id }).then(blobData => { |
| | | const blob = new Blob([blobData], { |
| | | type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document", |
| | | }); |
| | | const downloadUrl = window.URL.createObjectURL(blob); |
| | | |
| | | const link = document.createElement("a"); |
| | | link.href = downloadUrl; |
| | | link.download = "过程检验报告.docx"; |
| | | document.body.appendChild(link); |
| | | link.click(); |
| | | |
| | | document.body.removeChild(link); |
| | | window.URL.revokeObjectURL(downloadUrl); |
| | | }); |
| | | }; |
| | | // 导出 |
| | | const handleOut = () => { |
| | | ElMessageBox.confirm("选中的内容将被导出,是否确认导出?", "导出", { |
| | |
| | | proxy.$modal.msg("已取消"); |
| | | }); |
| | | }; |
| | | |
| | | // 提交 |
| | | const submit = async id => { |
| | | const res = await submitQualityInspect({ id: id }); |
| | | if (res.code === 200) { |
| | | proxy.$modal.msgSuccess("提交成功"); |
| | | getList(); |
| | | } |
| | | }; |
| | | |
| | | const downLoadFile = row => { |
| | | downloadQualityInspect({ id: row.id }).then(blobData => { |
| | | const blob = new Blob([blobData], { |
| | | type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document", |
| | | }); |
| | | const downloadUrl = window.URL.createObjectURL(blob); |
| | | |
| | | const link = document.createElement("a"); |
| | | link.href = downloadUrl; |
| | | link.download = "过程检验报告.docx"; |
| | | document.body.appendChild(link); |
| | | link.click(); |
| | | |
| | | document.body.removeChild(link); |
| | | window.URL.revokeObjectURL(downloadUrl); |
| | | }); |
| | | }; |
| | | onMounted(() => { |
| | | getList(); |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
| | | <style scoped lang="scss"> |
| | | .actions { |
| | | display: flex; |
| | | justify-content: flex-end; |
| | | margin-bottom: 10px; |
| | | } |
| | | </style> |