BOM前台页面代码提交

dy

2025-04-23 25aa7a5b88a12dd176130d67d2a01650a3ffe843

BOM前台页面代码提交

 src/api/basicData/bom/bom.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,44 @@
import request from '@/utils/request'

// æŸ¥è¯¢BOM数据管理列表
export function listApsBom(query) {
  return request({
    url: '/aps/ApsBom/list',
    method: 'get',
    params: query
  })
}

// æŸ¥è¯¢BOM数据管理详细
export function getApsBom(id) {
  return request({
    url: '/ApsBom/ApsBom/' + id,
    method: 'get'
  })
}

// æ–°å¢žBOM数据管理
export function addApsBom(data) {
  return request({
    url: '/ApsBom/ApsBom',
    method: 'post',
    data: data
  })
}

// ä¿®æ”¹BOM数据管理
export function updateApsBom(data) {
  return request({
    url: '/ApsBom/ApsBom',
    method: 'put',
    data: data
  })
}

// åˆ é™¤BOM数据管理
export function delApsBom(id) {
  return request({
    url: '/ApsBom/ApsBom/' + id,
    method: 'delete'
  })
}

 src/components/HxlhTable/index.vue

@@ -27,6 +27,8 @@
            :scroll-x="{enabled: true}"
            :scroll-y="{enabled: true}"
            :expand-config="expandConfig"
            :tree-config="treeConfig"
            :row-style="rowStyle"
            @sort-change="sortChange"
            @page-change="pagerChange"
            @form-submit="findList"
@@ -153,7 +155,20 @@
  default :()=>{
    return {}
  }
},
treeConfig: {
    type: Object,
    default: () => {
    return {}
}
},
rowStyle: {
    type: Function,
    default: () => {
    return {}
    }
},

})



 src/views/basicData/bom/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,210 @@
<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-form-item>
        </el-col>
      </el-row>
    </el-form>

    <HxlhTable
        style="width: 100%"
        :columns="columns"
        :data="bomList"
        :loading="loading"
        :height="height"
        :treeConfig="treeConfig"
        :row-style="getRowStyle"
    >
    </HxlhTable>
  </div>
</template>

<script setup name="ApsBom">
import { listApsBom } from "@/api/basicData/bom/bom";
import { listAll_plant } from "@/api/basicData/plant";
import axios from 'axios';
import HxlhTable from '@/components/HxlhTable'

const { proxy } = getCurrentInstance();

const bomList = ref([]);
const open = ref(false);
const loading = ref(false);
const showSearch = ref(true);

const treeConfig= {
  transform: true,
  rowField: 'bomId',
  parentField: 'parentBomId'
}

const data = reactive({
  form: {},
  queryParams: {
    itemCode: null,
  },
  rules: {
    itemCode: [
      { required: true, message: "料号不能为空", trigger: "blur" }
    ],
  }
});

// è¡¨æ ¼é…ç½® 
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
          }
        }
      }
      return '';
    })
  },
  {
    title: '创建时间',
    field: 'createTime',
  },
]);

// å®šä¹‰ä¸€ä¸ªå‡½æ•°æ¥èŽ·å–行的层级
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
}

// å®šä¹‰ä¸€ä¸ªå‡½æ•°æ¥è®¾ç½®è¡Œçš„样式
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() {
  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;
      loading.value = false;
    }))
    .catch(error => {
      console.error('请求出错:', error);
    });
}

// å–消按钮
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 => {
    if (valid) {
        getList();
      }
  });
}

/** é‡ç½®æŒ‰é’®æ“ä½œ */
function resetQuery() {
  proxy.resetForm("queryRef");
  bomList.value = null;
}

console.log("123");
</script>

 src/views/basicData/materialManagement/index.vue

@@ -165,7 +165,6 @@
    width: 150,
    formatter: (({ cellValue, row, column }) => {
      if (cellValue) {
        console.log(plantList.value);
        for(let i=0;i<plantList.value.length;i++){
          if(cellValue===plantList.value[i].plantCode){
            return plantList.value[i].plantName