From 4079d1c5a3efb6b31879d9f80dd067cc01b11e91 Mon Sep 17 00:00:00 2001
From: CD配唱片 <CD配唱片>
Date: 星期三, 07 五月 2025 11:28:02 +0800
Subject: [PATCH] 对接bom静态页及联调接口
---
src/views/basicData/bom/index.vue | 491 ++++++++++++++++++++++++++++++++++++------------------
1 files changed, 325 insertions(+), 166 deletions(-)
diff --git a/src/views/basicData/bom/index.vue b/src/views/basicData/bom/index.vue
index 5f530bf..1f8c94e 100644
--- a/src/views/basicData/bom/index.vue
+++ b/src/views/basicData/bom/index.vue
@@ -1,210 +1,369 @@
<template>
<div class="app-container">
- <el-form :model="queryParams" ref="queryRef" :rules="rules" :inline="true" v-show="showSearch" label-width="68px">
- <el-row :gutter="20">
- <el-col :span="6">
- <el-form-item label="鏂欏彿" prop="itemCode">
- <el-input
- v-model="queryParams.itemCode"
- placeholder="璇疯緭鍏ユ枡鍙�"
- clearable
- @keyup.enter="handleQuery"
- />
- </el-form-item>
- </el-col>
- <el-col :span="18" style="text-align: right;">
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ <el-row :gutter="20">
+ <el-form
+ :model="queryParams"
+ ref="queryRef"
+ :rules="rules"
+ :inline="true"
+ v-show="showSearch"
+ :label-width="locale === 'zh' ? '90px' : '120px'"
+ >
+ <el-row :gutter="20">
+ <el-col :span="10">
+ <el-form-item :label="$t('plan.query.itemNumber')" prop="itemCode">
+ <el-input
+ style="width: 240px"
+ v-model="queryParams.itemCode"
+ :placeholder="`${$t('common.common.placeholder')}${$t(
+ 'plan.query.itemNumber'
+ )}`"
+ clearable
+ @keyup.enter="handleQuery"
+ />
</el-form-item>
- </el-col>
- </el-row>
- </el-form>
+ </el-col>
+ <el-col :span="8">
+ <el-form-item
+ label="閫傜敤宸ュ巶"
+ prop="orgCode"
+ >
+ <el-select
+ clearable
+ v-model="queryParams.orgCode"
+ style="width: 160px"
+ placeholder="璇疯緭鍏ラ�傜敤宸ュ巶"
+ >
+ <el-option
+ v-for="plant in plantList"
+ :key="plant.id"
+ :label="plant.plantName"
+ :value="plant.plantCode"
+ >
+ </el-option>
+ </el-select>
+ </el-form-item>
+ </el-col>
+ <el-col :span="6" style="text-align: right">
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">{{
+ $t("common.common.query")
+ }}</el-button>
+ <el-button icon="Refresh" @click="resetQuery">{{
+ $t("common.common.reset")
+ }}</el-button>
+ </el-form-item>
+ </el-col>
+ </el-row>
+ </el-form>
+ </el-row>
+ <el-row :gutter="10" class="mb8">
+ <el-col :span="1.5">
+ <el-button
+ type="success"
+ plain
+ icon="Refresh"
+ @click="handleRefresh"
+ v-hasPermi="['apsPartRouteStat:edit']"
+ >{{ $t("common.common.update") }}</el-button
+ >
+ </el-col>
+ <right-toolbar
+ v-model:showSearch="showSearch"
+ @queryTable="getList"
+ ></right-toolbar>
+ </el-row>
<HxlhTable
- style="width: 100%"
- :columns="columns"
- :data="bomList"
- :loading="loading"
- :height="height"
- :treeConfig="treeConfig"
- :row-style="getRowStyle"
+ style="width: 100%"
+ :columns="columns"
+ :data="bomList"
+ :loading="loading"
+ :height="height"
+ @on-checkbox="handleCheckboxChange"
+ :page="page"
+ @changePageNo="changePageNo"
+ @changePageSize="changePageSize"
>
+ <!-- :expand-config="expandConfig"
+ :subGridOptions="subGridOptions" -->
+ <template #buttons="{ row }">
+ <el-button
+ type="primary"
+ link
+ @click="handleCheckView(row)"
+ v-hasPermi="['aps:calendar:update']"
+ >鏌ョ湅</el-button
+ >
+ </template>
</HxlhTable>
+ <el-dialog :title="title" v-model="openDialog" width="900px" append-to-body>
+ <HxlhTable
+ style="width: 100%"
+ :columns="subGridOptions"
+ :data="subList"
+ :loading="loadingSub"
+ :height="heightSub"
+ >
+ </HxlhTable>
+ </el-dialog>
</div>
</template>
-<script setup name="ApsBom">
-import { listApsBom } from "@/api/basicData/bom/bom";
+<script setup name="ApsPlatePlan">
+import {
+ listApsBomHeaderList,
+ listApsBomLineList,
+} from "@/api/basicData/bom/bom.js";
import { listAll_plant } from "@/api/basicData/plant";
-import axios from 'axios';
-import HxlhTable from '@/components/HxlhTable'
-
+import HxlhTable from "@/components/HxlhTable/index.vue";
+import { ElMessage } from "element-plus";
+import { useI18n } from "vue-i18n"; //瑕佸湪js涓娇鐢ㄥ浗闄呭寲
+const { t, locale } = useI18n();
const { proxy } = getCurrentInstance();
-
+// 鍒嗛〉灞炴��
+const page = ref({
+ total: 0,
+ current: 1,
+ size: 10,
+});
+const plantList = ref([]);
const bomList = ref([]);
-const open = ref(false);
+const subList = ref([]);
const loading = ref(false);
+const loadingSub = ref(false);
const showSearch = ref(true);
-
-const treeConfig= {
- transform: true,
- rowField: 'bomId',
- parentField: 'parentBomId'
-}
-
+const total = ref(0);
+const height = ref(document.documentElement.clientHeight - 270 + "px;");
+const heightSub = ref(document.documentElement.clientHeight - 320 + "px;");
+// 琛ㄦ牸閰嶇疆
+const columns = ref([]);
+const subGridOptions = ref([]);
+const openDialog = ref(false);
const data = reactive({
- form: {},
queryParams: {
+ pageNum: 1,
+ pageSize: 10,
itemCode: null,
+ orgCode:""
},
- rules: {
- itemCode: [
- { required: true, message: "鏂欏彿涓嶈兘涓虹┖", trigger: "blur" }
- ],
- }
+ rules: {},
});
-// 琛ㄦ牸閰嶇疆
-const columns = ref([
- {
- title: 'bomId',
- field: 'bomId',
- minWidth: 20, treeNode: true
- },
- {
- title: 'parentBomId',
- field: 'parentBomId',
- },
- {
- title: '鏂欏彿',
- field: 'itemCode',
- },
- {
- title: '鐗╂枡鎻忚堪',
- field: 'itemName',
- },
- {
- title: '鐢熸晥鏃ユ湡',
- field: 'startDate',
- },
- {
- title: '澶辨晥鏃ユ湡',
- field: 'endDate',
- },
- {
- title: '閫傜敤宸ュ巶',
- field: 'orgCode',
- formatter: (({ cellValue, row, column }) => {
- if (cellValue) {
- for(let i=0;i<plantList.value.length;i++){
- if(cellValue===plantList.value[i].plantCode){
- return plantList.value[i].plantName
+const { queryParams, rules } = toRefs(data);
+watch(
+ locale,
+ (newLocale) => {
+ rules.value = {
+ itemCode: [
+ {
+ required: true,
+ message: `${t("common.common.placeholder")}${t(
+ "plan.query.itemNumber"
+ )}`,
+ trigger: "blur",
+ },
+ ],
+ };
+ columns.value = [
+ // {
+ // field: "expand",
+ // type: "expand",
+ // width: 60,
+ // align: "center",
+ // slots: { content: "expandContent" },
+ // },
+ // { type: "checkbox", width: 60, align: "center" },
+ {
+ title: "BOM_Header_ID",
+ field: "bomHeaderId",
+ },
+ {
+ title: t("basic.table.parentPartNumber"),
+ field: "itemCode",
+ },
+ {
+ title: t("basic.table.parentMaterialDescription"),
+ field: "itemName",
+ },
+ {
+ title: t("basic.table.effectiveDate"),
+ field: "startDate",
+ },
+ {
+ title: t("basic.table.expiringDate"),
+ field: "endDate",
+ },
+ {
+ title: t("basic.table.integrationDate"),
+ field: "createTime",
+ },
+ {
+ title: t("basic.table.applicableFactories"),
+ field: "orgCode",
+ formatter: ({ cellValue, row, column }) => {
+ if (cellValue) {
+ for (let i = 0; i < plantList.value.length; i++) {
+ if (cellValue === plantList.value[i].plantCode) {
+ return plantList.value[i].plantName;
+ }
+ }
}
- }
- }
- return '';
- })
+ },
+ },
+ {
+ title: "鎿嶄綔",
+ width: 100,
+ fixed: "right",
+ slots: { default: "buttons" },
+ align: "center",
+ },
+ ];
+ subGridOptions.value = [
+ {
+ title: "BOM_Line_ID",
+ field: "bomLineId",
+ width: 150,
+ align: "center",
+ },
+ {
+ title: "BOM_Header_ID",
+ field: "bomHeaderId",
+ width: 150,
+ align: "center",
+ },
+ {
+ title: t("plan.table.itemNumber"),
+ field: "itemCode",
+ width: 100,
+ align: "center",
+ },
+ {
+ title: t("basic.table.materialDescription"),
+ field: "itemName",
+ width: 100,
+ align: "center",
+ },
+ {
+ title: t("basic.table.usage"),
+ field: "num",
+ width: 100,
+ align: "center",
+ },
+ {
+ title: t("basic.table.effectiveDate"),
+ field: "startDate",
+ width: 150,
+ align: "center",
+ },
+ {
+ title: t("basic.table.expiringDate"),
+ field: "endDate",
+ width: 200,
+ align: "center",
+ },
+ {
+ title: t("basic.table.integrationDate"),
+ field: "createTime",
+ width: 200,
+ align: "center",
+ },
+ {
+ title: t("basic.table.applicableFactories"),
+ field: "orgCode",
+ width: 90,
+ align: "center",
+ formatter: ({ cellValue, row, column }) => {
+ if (cellValue) {
+ for (let i = 0; i < plantList.value.length; i++) {
+ if (cellValue === plantList.value[i].plantCode) {
+ return plantList.value[i].plantName;
+ }
+ }
+ }
+ },
+ },
+ ];
},
- {
- title: '鍒涘缓鏃堕棿',
- field: 'createTime',
- },
-]);
+ { immediate: true, deep: true }
+);
-// 瀹氫箟涓�涓嚱鏁版潵鑾峰彇琛岀殑灞傜骇
-const getRowLevel = (row, dataMap) => {
- let level = 0
- let parentBomId = row.parentBomId
- while (parentBomId!== null) {
- const parentRow = dataMap.get(parentBomId)
- if (parentRow) {
- level++
- parentBomId = parentRow.parentBomId
- } else {
- break
- }
- }
- return level
+function changePageNo(currentPage) {
+ queryParams.value.pageNum = currentPage;
+ page.value.current = currentPage;
+ getList();
+}
+function changePageSize(pageSize) {
+ page.value.current = 1;
+ queryParams.value.pageNum = 1;
+ queryParams.value.pageSize = pageSize;
+ getList();
}
-// 瀹氫箟涓�涓嚱鏁版潵璁剧疆琛岀殑鏍峰紡
-const getRowStyle = (row, rowIndex) => {
- if (!Array.isArray(bomList.value)) {
- console.error('bomList 涓嶆槸涓�涓暟缁勭被鍨�');
- return {};
- }
- const dataMap = new Map(bomList.value.map(item => [item.bomId, item]))
- const level = getRowLevel(row.row, dataMap)
- const colors = ['#f0f9ff', '#e6f7ff', '#bae7ff', '#91d5ff', '#69c0ff']
- return {
- backgroundColor: colors[level % colors.length]
- }
-}
-
-const { queryParams, form, rules } = toRefs(data);
-
-const queryPlants = ref({status: 1});
-const plantList = ref([]);
-const height = ref(document.documentElement.clientHeight - 180 + "px;")
-
-/** 鏌ヨBOM鏁版嵁绠＄悊鍒楄〃 */
+/** 鏌ヨ闆朵欢璁″垝绠＄悊鍒楄〃 */
function getList() {
+ page.value.current = 1;
+ queryParams.value.pageNum = 1;
loading.value = true;
- axios.all([
- listAll_plant(queryPlants.value),
- listApsBom(queryParams.value)
- ])
- .then(axios.spread((response1, response2) => {
- plantList.value = response1.data;
- bomList.value = response2.rows;
+ listApsBomHeaderList(queryParams.value)
+ .then((response) => {
+ console.log(response, "listApsBomHeaderList");
+ bomList.value = response.rows;
+ page.value.total = response.total;
loading.value = false;
- }))
- .catch(error => {
- console.error('璇锋眰鍑洪敊:', error);
+ })
+ .catch(() => {
+ loading.value = false;
});
-}
-
-// 鍙栨秷鎸夐挳
-function cancel() {
- open.value = false;
- reset();
-}
-
-// 琛ㄥ崟閲嶇疆
-function reset() {
- form.value = {
- id: null,
- bomId: null,
- parentBomId: null,
- itemCode: null,
- itemName: null,
- startDate: null,
- endDate: null,
- orgCode: null,
- delFlag: null,
- createBy: null,
- createTime: null,
- updateBy: null,
- updateTime: null
- };
- proxy.resetForm("ApsBomRef");
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
function handleQuery() {
- proxy.$refs["queryRef"].validate(valid => {
+ proxy.$refs["queryRef"].validate((valid) => {
if (valid) {
- getList();
- }
+ getList();
+ }
});
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
function resetQuery() {
+ page.value.current = 1;
+ page.value.total = 0;
+ queryParams.value.pageNum = 1;
proxy.resetForm("queryRef");
- bomList.value = null;
+ bomList.value = [];
+ subList.value = [];
}
-console.log("123");
+function handleCheckView(row) {
+ openDialog.value = true;
+ listApsBomLineList({ bomHeaderId: row.bomHeaderId }).then((data) => {
+ console.log(data, "listApsBomLineList");
+ subList.value = data.rows;
+ });
+}
+
+// /*瀹氫箟涓嬫媺浜岀骇琛�*/
+// const expandConfig = ref({
+// lazy: true,
+// loadMethod({ row }) {
+// // 璋冪敤鎺ュ彛
+// return listProcessRoute({ workOrderNo: row.documentNumber }).then(
+// (data) => {
+// row.subList = data.rows;
+// }
+// );
+// },
+// });
+
+onMounted(async () => {
+ const res = await listAll_plant({});
+ plantList.value = res.data;
+});
</script>
+<style lang="css" scoped>
+h4 {
+ font-weight: bold;
+}
+</style>
--
Gitblit v1.9.3