生产管控迁移遗漏

zhangwencui

2026-01-19 187041ecb09b7b1e911e12423e4db90b5d1d2d28

生产管控迁移遗漏

 src/components/PageHeader/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,53 @@
<template>
  <div class="page-header-wrapper">
    <el-page-header @back="handleBack" :content="content">
      <template #icon v-if="$slots.icon">
        <slot name="icon"></slot>
      </template>
      <template #title v-if="$slots.title">
        <slot name="title"></slot>
      </template>
      <template #content v-if="$slots.content">
        <slot name="content"></slot>
      </template>
      <template #extra>
        <slot name="extra">
          <slot name="right-button"></slot>
        </slot>
      </template>
    </el-page-header>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router'

const props = defineProps({
  content: {
    type: String,
    default: ''
  }
})

const emit = defineEmits(['back'])

const router = useRouter()

const handleBack = () => {
  emit('back')
  // é»˜è®¤è¿”回到上一级
  router.back()
}
</script>

<style scoped>
.page-header-wrapper {
  margin-bottom: 16px;
}

.page-header-wrapper :deep(.el-page-header__extra) {
  display: flex;
  align-items: center;
  gap: 8px;
}
</style>

 src/main.js

@@ -52,6 +52,8 @@
import DictTag from "@/components/DictTag";
// è¡¨æ ¼ç»„件
import PIMTable from "@/components/PIMTable/PIMTable.vue";
// é¡µé¢å¤´éƒ¨ç»„件
import PageHeader from "@/components/PageHeader/index.vue";

import { getToken } from "@/utils/auth";
import {
@@ -93,6 +95,7 @@
app.component("RightToolbar", RightToolbar);
app.component("Editor", Editor);
app.component("PIMTable", PIMTable);
app.component("PageHeader", PageHeader);

app.use(router);
app.use(store);

 src/views/productionManagement/productStructure/Detail/index.vue

@@ -22,13 +22,11 @@
        </el-button>
      </template>
    </PageHeader>
    <el-table
        :data="tableData"
        border
        :preserve-expanded-content="false"
        :default-expand-all="true"
        style="width: 100%"
    >
    <el-table :data="tableData"
              border
              :preserve-expanded-content="false"
              :default-expand-all="true"
              style="width: 100%">
      <el-table-column type="expand">
        <template #default="props">
          <el-form ref="form"
@@ -36,7 +34,7 @@
            <el-table :data="dataValue.dataList"
                      style="width: 100%">
              <el-table-column prop="productName"
                               label="产品"/>
                               label="产品" />
              <el-table-column prop="model"
                               label="规格">
                <template #default="{ row, $index }">
@@ -123,7 +121,9 @@
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column label="操作" fixed="right" width="100">
              <el-table-column label="操作"
                               fixed="right"
                               width="100">
                <template #default="{ row, $index }">
                  <el-button v-if="dataValue.isEdit"
                             type="danger"
@@ -136,11 +136,13 @@
          </el-form>
        </template>
      </el-table-column>
      <el-table-column label="BOM编号" prop="bomNo" />
      <el-table-column label="产品名称" prop="productName" />
      <el-table-column label="规格型号" prop="model" />
      <el-table-column label="BOM编号"
                       prop="bomNo" />
      <el-table-column label="产品名称"
                       prop="productName" />
      <el-table-column label="规格型号"
                       prop="model" />
    </el-table>

    <product-select-dialog v-if="dataValue.showProductDialog"
                           v-model:model-value="dataValue.showProductDialog"
                           @confirm="handleProduct" />
@@ -148,103 +150,107 @@
</template>

<script setup lang="ts">
import {
  computed,
  defineAsyncComponent,
  defineComponent,
  onMounted,
  reactive,
  ref,
} from "vue";
import { queryList, add } from "@/api/productionManagement/productStructure.js";
import { listProcessBom } from "@/api/productionManagement/productionOrder.js";
import { list } from "@/api/productionManagement/productionProcess";
import { ElMessage } from "element-plus";
import {useRoute, useRouter} from "vue-router";
  import {
    computed,
    defineAsyncComponent,
    defineComponent,
    onMounted,
    reactive,
    ref,
  } from "vue";
  import { queryList, add } from "@/api/productionManagement/productStructure.js";
  import { listProcessBom } from "@/api/productionManagement/productionOrder.js";
  import { list } from "@/api/productionManagement/productionProcess";
  import { ElMessage } from "element-plus";
  import { useRoute, useRouter } from "vue-router";

defineComponent({
  name: "StructureEdit",
});
  defineComponent({
    name: "StructureEdit",
  });

const ProductSelectDialog = defineAsyncComponent(
  const ProductSelectDialog = defineAsyncComponent(
    () => import("@/views/basicData/product/ProductSelectDialog.vue")
);
const form = ref();
  );
  const form = ref();

const route = useRoute()
const router = useRouter()
const routeId = computed({
  get() {
    return route.query.id;
  },
  const route = useRoute();
  const router = useRouter();
  const routeId = computed({
    get() {
      return route.query.id;
    },

  set(val) {
    emit('update:router', val)
  }
});
    set(val) {
      emit("update:router", val);
    },
  });

// ä»Žè·¯ç”±å‚数获取产品信息
const routeBomNo = computed(() => route.query.bomNo || '');
const routeProductName = computed(() => route.query.productName || '');
const routeProductModelName = computed(() => route.query.productModelName || '');
const routeOrderId = computed(() => route.query.orderId);
const pageType = computed(() => route.query.type);
const isOrderPage = computed(() => pageType.value === 'order' && routeOrderId.value);
  // ä»Žè·¯ç”±å‚数获取产品信息
  const routeBomNo = computed(() => route.query.bomNo || "");
  const routeProductName = computed(() => route.query.productName || "");
  const routeProductModelName = computed(
    () => route.query.productModelName || ""
  );
  const routeOrderId = computed(() => route.query.orderId);
  const pageType = computed(() => route.query.type);
  const isOrderPage = computed(
    () => pageType.value === "order" && routeOrderId.value
  );

const dataValue = reactive({
  dataList: [],
  productOptions: [],
  processOptions: [],
  showProductDialog: false,
  currentRowIndex: null,
  loading: false,
  isEdit: false,
});
  const dataValue = reactive({
    dataList: [],
    productOptions: [],
    processOptions: [],
    showProductDialog: false,
    currentRowIndex: null,
    loading: false,
    isEdit: false,
  });

const tableData = reactive([
  {
    productName: "",
    model: "",
    bomNo: "",
  }
])
  const tableData = reactive([
    {
      productName: "",
      model: "",
      bomNo: "",
    },
  ]);

const openDialog = index => {
  dataValue.currentRowIndex = index;
  dataValue.showProductDialog = true;
};
  const openDialog = index => {
    dataValue.currentRowIndex = index;
    dataValue.showProductDialog = true;
  };

const fetchData = async () => {
  if (isOrderPage.value) {
    // è®¢å•æƒ…况：使用订单的产品结构接口
    const { data } = await listProcessBom({ orderId: routeOrderId.value });
    dataValue.dataList = data || [];
  } else {
    // éžè®¢å•æƒ…况：使用原来的接口
    const { data } = await queryList(routeId.value);
    dataValue.dataList = data || [];
  }
};
  const fetchData = async () => {
    if (isOrderPage.value) {
      // è®¢å•æƒ…况：使用订单的产品结构接口
      const { data } = await listProcessBom({ orderId: routeOrderId.value });
      dataValue.dataList = data || [];
    } else {
      // éžè®¢å•æƒ…况：使用原来的接口
      const { data } = await queryList(routeId.value);
      dataValue.dataList = data || [];
    }
  };

const fetchProcessOptions = async () => {
  const { data } = await list(routeId.value);
  dataValue.processOptions = data;
};
  const fetchProcessOptions = async () => {
    const { data } = await list(routeId.value);
    dataValue.processOptions = data;
  };

const handleProduct = row => {
  if (row?.length > 1) {
    ElMessage.error("只能选择一个产品");
  }
  dataValue.dataList[dataValue.currentRowIndex].productName =
  const handleProduct = row => {
    if (row?.length > 1) {
      ElMessage.error("只能选择一个产品");
    }
    dataValue.dataList[dataValue.currentRowIndex].productName =
      row[0].productName;
  dataValue.dataList[dataValue.currentRowIndex].model = row[0].model;
  dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id;
  dataValue.dataList[dataValue.currentRowIndex].unit = row[0].unit || "";
  dataValue.showProductDialog = false;
};
    dataValue.dataList[dataValue.currentRowIndex].model = row[0].model;
    dataValue.dataList[dataValue.currentRowIndex].productModelId = row[0].id;
    dataValue.dataList[dataValue.currentRowIndex].unit = row[0].unit || "";
    dataValue.showProductDialog = false;
  };

const submit = () => {
  form.value
  const submit = () => {
    form.value
      .validate(valid => {
        dataValue.loading = true;
        if (valid) {
@@ -253,8 +259,8 @@
            productStructureList: dataValue.dataList || [],
          }).then(res => {
            router.push({
              path: '/productionManagement/productionManagement/productStructure/index',
            })
              path: "/productionManagement/productionManagement/productStructure/index",
            });
            ElMessage.success("保存成功");
            dataValue.loading = false;
          });
@@ -263,38 +269,38 @@
      .finally(() => {
        dataValue.loading = false;
      });
};
  };

const addItem = () => {
  dataValue.dataList.push({
    productName: "",
    productId: "",
    model: undefined,
    productModelId: undefined,
    processId: "",
    unitQuantity: 0,
    demandedQuantity: 0,
    unit: "",
  });
};
  const addItem = () => {
    dataValue.dataList.push({
      productName: "",
      productId: "",
      model: undefined,
      productModelId: undefined,
      processId: "",
      unitQuantity: 0,
      demandedQuantity: 0,
      unit: "",
    });
  };

const cancelEdit = () => {
  dataValue.isEdit = false;
  dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined);
};

onMounted(() => {
  // ä»Žè·¯ç”±å‚数回显数据
  tableData[0].productName = routeProductName.value;
  tableData[0].model = routeProductModelName.value;
  tableData[0].bomNo = routeBomNo.value;
  
  // è®¢å•æƒ…况下禁用编辑
  if (isOrderPage.value) {
  const cancelEdit = () => {
    dataValue.isEdit = false;
  }
  
  fetchData();
  fetchProcessOptions();
});
    dataValue.dataList = dataValue.dataList.filter(item => item.id !== undefined);
  };

  onMounted(() => {
    // ä»Žè·¯ç”±å‚数回显数据
    tableData[0].productName = routeProductName.value;
    tableData[0].model = routeProductModelName.value;
    tableData[0].bomNo = routeBomNo.value;

    // è®¢å•æƒ…况下禁用编辑
    if (isOrderPage.value) {
      dataValue.isEdit = false;
    }

    fetchData();
    fetchProcessOptions();
  });
</script>