主材出站界面优化

src/views/pwoManage/index.vue

@@ -59,7 +59,8 @@ const handleInfeed = (record: any) => {
   router.push({ name: 'Infeed' });
 };
 
-const handleOutfeed = () => {
+const handleOutfeed = (record: any) => {
+  jobStore.setInfo(record);
   router.push({ name: 'Outfeed' });
 };
 
@@ -96,7 +97,7 @@ defineExpose({
         <template v-if="column.key === 'action'">
           <a-space>
             <a-button size="large" type="primary" @click="handleInfeed(record)">进站</a-button>
-            <a-button size="large" type="primary" danger @click="handleOutfeed">出站</a-button>
+            <a-button size="large" type="primary" danger @click="handleOutfeed(record)">出站</a-button>
           </a-space>
         </template>
       </template>

src/views/pwoManage/outfeed/jobReport/index.vue

@@ -1,10 +1,9 @@
 <script setup lang="ts">
-import { ref, onMounted, computed, getCurrentInstance } from 'vue';
+import { ref, reactive, onMounted, computed, getCurrentInstance } from 'vue';
 import { message } from 'ant-design-vue';
 import { useJobStore } from '@/store';
 import type { ColumnsType } from 'ant-design-vue/es/table/interface';
-import { listMainMaterialEntryLog } from '@/api/pwoManage/primaryMaterial'
+import { listMainMaterialEntryLog, listMainMaterialOutboundLog, batchAddMainMaterialOutboundLog, getMainMaterialOutboundLog, updateMainMaterialOutboundLog, delMainMaterialOutboundLog } from "@/api/pwoManage/primaryMaterial";
-import { listMainMaterialOutboundLog } from '@/api/pwoManage/primaryMaterial';
 
 const { proxy } = getCurrentInstance() as any
 const { main_material_ok_level, main_material_ng_level } = proxy.useDict("main_material_ok_level", "main_material_ng_level")
@@ -15,8 +14,12 @@ interface PrimaryMaterialTableItem {
   key: string;
   waferCode: string;
   dieCode: string;
-  result: 'OK' | 'NG';
+  xcoordinates: string;
+  ycoordinates: string;
+  outputResult: 'OK' | 'NG';
   qualityLevel: string;
+  createBy: string;
+  createTime: string;
   [key: string]: any;
 }
 
@@ -24,9 +27,13 @@ const primaryMaterialColumns = [
   { title: '序号', dataIndex: 'index', key: 'index', align: 'center', width: 80 },
   { title: 'Wafer ID', dataIndex: 'waferCode', key: 'waferCode', align: 'center' },
   { title: 'Die ID', dataIndex: 'dieCode', key: 'dieCode', align: 'center' },
-  { title: '结果', dataIndex: 'result', key: 'result', align: 'center' },
+  { title: 'Die X 坐标', dataIndex: 'xcoordinates', key: 'xcoordinates', align: 'center' },
+  { title: 'Die Y 坐标', dataIndex: 'ycoordinates', key: 'ycoordinates', align: 'center' },
+  { title: '结果', dataIndex: 'outputResult', key: 'outputResult', align: 'center' },
   { title: '质量等级', dataIndex: 'qualityLevel', key: 'qualityLevel' },
-  { title: '操作', key: 'action', align: 'center', width: 120 },
+  { title: '创建人', dataIndex: 'createBy', key: 'createBy' },
+  { title: '创建时间', dataIndex: 'createTime', key: 'createTime' },
+  { title: '操作', key: 'action', align: 'center', width: 180 },
 ];
 
 // 总计数据
@@ -34,8 +41,8 @@ const totals = computed(() => {
   let okNum = 0;
   let ngNum = 0;
 
-  primaryMaterialTableData.value.forEach(({ result, qualityLevel }) => {
+  primaryMaterialTableData.value.forEach(({ outputResult, qualityLevel }) => {
-    if (result === 'OK') {
+    if (outputResult === 'OK') {
       okNum++;
     } else {
       ngNum++;
@@ -52,21 +59,120 @@ const fetchPrimaryMaterialList = async () => {
   if (!stationId) return;
   loadingPrimaryMaterialList.value = true;
   try {
-    const { rows } = await listMainMaterialEntryLog({ stationId });
+    const { rows } = await listMainMaterialOutboundLog({ stationId });
     primaryMaterialTableData.value = rows;
   } catch (error: any) {
-    message.error(error.message || '查询治具列表失败');
+    message.error(error.message || '查询失败');
   } finally {
     loadingPrimaryMaterialList.value = false;
   }
 }
 
+const openPickPrimaryMaterial = ref(false);
+interface InfeedMaterialTableItem {
+  key: string;
+  waferCode: string;
+  dieCode: string;
+  result: 'OK' | 'NG';
+  qualityLevel: string;
+  [key: string]: any;
+}
+const infeedMaterialColumns = [
+  { title: '序号', dataIndex: 'index', key: 'index', align: 'center', width: 80 },
+  { title: 'Wafer ID', dataIndex: 'waferCode', key: 'waferCode', align: 'center' },
+  { title: 'Die ID', dataIndex: 'dieCode', key: 'dieCode', align: 'center' },
+  { title: '结果', dataIndex: 'result', key: 'result', align: 'center' },
+  { title: '质量等级', dataIndex: 'qualityLevel', key: 'qualityLevel' },
+];
+const infeedMaterialTableData = ref<InfeedMaterialTableItem[]>([]);
+
+// 挑选主材
+const handlePickPrimaryMaterial = async () => {
+  const stationId = jobStore.jobInfo.id;
+  if (!stationId) return;
+  try {
+    const { rows } = await listMainMaterialEntryLog({ stationId });
+    infeedMaterialTableData.value = rows.map(item => {
+      return {
+        ...item,
+        result: 'OK',
+        qualityLevel: main_material_ok_level.value[0].value || '',
+      }
+    });
+    openPickPrimaryMaterial.value = true;
+  } catch (err: any) {
+    message.error(err.message);
+  }
+}
+
+const openEditRecordModal = ref(false);
+const editingRecord = reactive<any>({});
+// 修改主材出站记录
+const handleEditRecord = (record: any) => {
+  Object.assign(editingRecord, record);
+  openEditRecordModal.value = true;
+}
+
+// 提交修改主材出站记录
+const handleSubmitEdit = async () => {
+  try {
+    await updateMainMaterialOutboundLog(editingRecord);
+    openEditRecordModal.value = false;
+  } catch (err: any) {
+    message.error(err.message || '修改失败');
+  }
+}
+
+// 删除主材出站记录
+const handleDeleteRecord = async (record: any) => {
+  try {
+    await delMainMaterialOutboundLog(record.id);
+    message.success('删除成功');
+  } catch (err: any) {
+    message.error(err.message || '删除失败');
+  }
+}
+
+// 选择主材
+const rowSelection = ref<any[]>([]);
+const selectedKeys = ref<any>([]);
+const handleChangeSelection = (selectedRowKeys: any, selectedRows: InfeedMaterialTableItem[]) => {
+  selectedKeys.value = selectedRowKeys;
+  rowSelection.value = selectedRows.map(item => {
+    return {
+      mainMaterialId: item.waferId ?? item.dieId,
+      result: item.result,
+      qualityLevel: item.qualityLevel,
+    }
+  })
+}
+
+// 提交主材出站
+const submitOutfeed = async () => {
+  const stationCode = jobStore.jobInfo.code;
+
+  try {
+    await batchAddMainMaterialOutboundLog({ stationCode, outbounds: rowSelection.value });
+    message.success("出站成功");
+    handleCancel();
+    fetchPrimaryMaterialList();
+  } catch (err: any) {
+    message.error(err.message || '提交失败');
+  }
+}
+
+// 取消选择主材
+const handleCancel = () => {
+  rowSelection.value = [];
+  selectedKeys.value = [];
+}
+
 // 计算表格高度
 const customTable = ref<HTMLElement | null>(null)
 const tableHeight = ref(200)
 const renderTableHeight = () => {
   if (customTable.value) {
-    tableHeight.value = customTable.value.clientHeight - 50
+    tableHeight.value = customTable.value.clientHeight - 60
     console.log('元素高度：', tableHeight.value)
   }
 }
@@ -85,25 +191,31 @@ fetchPrimaryMaterialList()
 <template>
   <div class="equipment__container">
     <Title name="主材报工" showRefresh @refresh="fetchPrimaryMaterialList" />
+    <a-button size="large" @click="handlePickPrimaryMaterial">选择主材</a-button>
     <div class="table-wrapper" ref="customTable">
       <a-table :dataSource="primaryMaterialTableData" :columns="primaryMaterialColumns as ColumnsType<PrimaryMaterialTableItem>"
-        :pagination="false" bordered sticky size="middle" :scroll="{ y: tableHeight }"
+        :pagination="false" bordered sticky :scroll="{ y: tableHeight }"
         :loading="loadingPrimaryMaterialList">
         <template #bodyCell="{ column, index, record }">
           <template v-if="column.key === 'index'">{{ index + 1 }}</template>
-          <template v-if="column.key === 'result'">
+          <template v-if="column.key === 'outputResult'">
-            <a-switch v-model:checked="record.result" checked-children="NG" checkedValue="NG" un-checked-children="OK" unCheckedValue="OK" />
+            <a-switch v-model:checked="record.outputResult" checked-children="NG" checkedValue="NG" un-checked-children="OK" unCheckedValue="OK" />
           </template>
           <template v-if="column.key === 'qualityLevel'">
-            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-if="record.result === 'OK'">
+            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-if="record.outputResult === 'NG'">
-              <a-select-option v-for="dict in main_material_ok_level" :value="dict.value">{{ dict.label }}</a-select-option>
-            </a-select>
-            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-else>
               <a-select-option v-for="dict in main_material_ng_level" :value="dict.value">{{ dict.label }}</a-select-option>
             </a-select>
+            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-if="record.outputResult === 'OK'">
+              <a-select-option v-for="dict in main_material_ok_level" :value="dict.value">{{ dict.label }}</a-select-option>
+            </a-select>
           </template>
           <template v-if="column.key === 'action'">
-            <a-button @click="">查看明细</a-button>
+            <a-space>
+              <a-button @click="handleEditRecord(record)">修改</a-button>
+              <a-popconfirm title="确定删除该记录?" ok-text="是" cancel-text="否" @confirm="handleDeleteRecord(record)">
+                <a-button danger>删除</a-button>
+              </a-popconfirm>
+            </a-space>
           </template>
         </template>
         <template #summary>
@@ -119,6 +231,61 @@ fetchPrimaryMaterialList()
         </template>
       </a-table>
     </div>
+
+    <a-modal v-model:open="openEditRecordModal" title="修改主材出站记录" @ok="handleSubmitEdit">
+      <a-form :model="editingRecord" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
+        <a-form-item label="Wafer ID">
+          <a-input v-model:value="editingRecord.waferCode" disabled />
+        </a-form-item>
+        <a-form-item label="Die ID">
+          <a-input v-model:value="editingRecord.dieCode" disabled />
+        </a-form-item>
+        <a-form-item label="Die X 坐标">
+          <a-input v-model:value="editingRecord.xcoordinates" disabled />
+        </a-form-item>
+        <a-form-item label="Die Y 坐标">
+          <a-input v-model:value="editingRecord.ycoordinates" disabled />
+        </a-form-item>
+        <a-form-item label="结果" :rules="[{ required: true, message: '请选择结果!' }]">
+          <a-switch v-model:checked="editingRecord.outputResult" checked-children="NG" checkedValue="NG"
+            un-checked-children="OK" unCheckedValue="OK" />
+        </a-form-item>
+        <a-form-item label="质量等级" :rules="[{ required: true, message: '请选择质量等级!' }]">
+          <a-select v-model:value="editingRecord.qualityLevel" style="width: 80%" v-if="editingRecord.outputResult === 'NG'">
+            <a-select-option v-for="dict in main_material_ng_level" :value="dict.value">{{ dict.label
+              }}</a-select-option>
+          </a-select>
+          <a-select v-model:value="editingRecord.qualityLevel" style="width: 80%" v-if="editingRecord.outputResult === 'OK'">
+            <a-select-option v-for="dict in main_material_ok_level" :value="dict.value">{{ dict.label
+              }}</a-select-option>
+          </a-select>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+
+    <a-modal v-model:open="openPickPrimaryMaterial" title="选择主材出站" width="50vw" @ok="submitOutfeed" @cancel="handleCancel">
+      已选择 {{ rowSelection.length }} 条主材
+      <a-table :dataSource="infeedMaterialTableData" :row-selection="{ selectedRowKeys: selectedKeys, onChange: handleChangeSelection }" row-key="id"
+        :columns="infeedMaterialColumns as ColumnsType<InfeedMaterialTableItem>" :pagination="false" bordered sticky>
+        <template #bodyCell="{ column, index, record }">
+          <template v-if="column.key === 'index'">{{ index + 1 }}</template>
+          <template v-if="column.key === 'result'">
+            <a-switch v-model:checked="record.result" checked-children="NG" checkedValue="NG"
+              un-checked-children="OK" unCheckedValue="OK" />
+          </template>
+          <template v-if="column.key === 'qualityLevel'">
+            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-if="record.result === 'NG'">
+              <a-select-option v-for="dict in main_material_ng_level" :value="dict.value">{{ dict.label
+                }}</a-select-option>
+            </a-select>
+            <a-select v-model:value="record.qualityLevel" style="width: 80%" v-if="record.result === 'OK'">
+              <a-select-option v-for="dict in main_material_ok_level" :value="dict.value">{{ dict.label
+                }}</a-select-option>
+            </a-select>
+          </template>
+        </template>
+      </a-table>
+    </a-modal>
   </div>
 </template>