标准库第一次编辑

hailin

2023-07-18 8eb564d8a9bb62cdfac2fe65152389e3b74da02d

标准库第一次编辑

 src/api/standardLibrary.js

@@ -8,10 +8,44 @@
  })
}

// 添加标准
// 添加类型
export function addStandards() {
  return request({
    url: '/standards/add',
    method: 'get'
  })
}

// 根据标准查询所有型号 参数IdOrNameOfSerialNumber， standardsId
export function getSerialNumberList(params) {
  return request({
    url: '/serial-number/list',
    method: 'get',
    params
  })
}

// 添加型号
export function addSerialNumber() {
  return request({
    url: '/serial-number/add',
    method: 'get'
  })
}

// 根据型号查询所有产品规格 参数serialNumberId， specificationsName
export function getSpecificationsList(params) {
  return request({
    url: '/specifications/list',
    method: 'get',
    params
  })
}

// 添加产品规格
export function addSpecifications() {
  return request({
    url: '/specifications/add',
    method: 'get'
  })
}

 src/layout/components/Navbar.vue

@@ -1,6 +1,6 @@
<template>
  <div class="navbar">
    <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
    <!-- <hamburger :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" /> -->

    <!-- <breadcrumb class="breadcrumb-container" /> -->

@@ -33,12 +33,12 @@
<script>
import { mapGetters } from 'vuex'
// import Breadcrumb from '@/components/Breadcrumb'
import Hamburger from '@/components/Hamburger'
// import Hamburger from '@/components/Hamburger'

export default {
  components: {
    // Breadcrumb,
    Hamburger
    // Hamburger
  },
  computed: {
    ...mapGetters([

 src/layout/components/Sidebar/Logo.vue

@@ -53,9 +53,10 @@
  & .sidebar-logo-link {
    height: 100%;
    width: 100%;
    padding: 0px 20px;
    padding: 0px;
    box-sizing: border-box;
    text-align: left;
    text-align: center;
    align-items: center;
    & .sidebar-logo {
      // width: 32px;
      // height: 32px;

 src/views/standardLibrary/index.vue

@@ -6,24 +6,25 @@
          v-model="filterText"
          placeholder="输入关键字进行过滤"
        />
        <el-button type="text">全部</el-button>
        <el-tree
          ref="tree"
          class="filter-tree"
          :data="data"
          :data="standardTree"
          :props="defaultProps"
          default-expand-all
          :filter-node-method="filterNode"
        >
        </el-tree>
          @node-click="nodeClick"
        />
      </div>
      <div class="library-table">
        <div class="table-header">
          <div class="search-bar">
            <el-form ref="form" inline="true" :model="searchData">
            <el-form ref="form" :inline="true" :model="searchData">
              <el-form-item>
                <el-input
                  placeholder="请输入人员名称/原材料名称"
                  v-model="searchData.keyword"
                  placeholder="请输入人员名称/原材料名称"
                >
                  <i slot="prefix" class="el-input__icon el-icon-search" />
                </el-input>
@@ -100,14 +101,12 @@
          </el-table>
          <div>
            <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="currentPage"
              :page-sizes="[100, 200, 300, 400]"
              :page-size="100"
              layout="total, sizes, prev, pager, next, jumper"
              :total="400">
            </el-pagination>
              :total="400"
            />
          </div>
        </div>
      </div>
@@ -116,11 +115,13 @@
</template>

<script>
import { getStandardsList, getSerialNumberList, getSpecificationsList } from '@/api/standardLibrary'
export default {
  data() {
    return {
      filterText: '',
      // 标准库bom树
      data: [{
      standardTree: [{
        id: 1,
        label: '一级 1',
        children: [{
@@ -153,7 +154,9 @@
          vel: 'V1.0',
          spe_state: 1
        }
      ]
      ],
      currentPage: 1

    }
  },
  watch: {
@@ -161,10 +164,38 @@
      this.$refs.tree.filter(val)
    }
  },
  created() {
    this.getStandardTree()
  },
  methods: {
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
    async getStandardTree() {
      const { data: standard } = await getStandardsList()// 获取所有标准
      // console.log(standard)// 获取所有标准
      for (const standardItem of standard) {
        const { data: serialNumber } = await getSerialNumberList({ IdOrNameOfSerialNumber: standardItem.name, standardsId: standardItem.id })
        // console.log(children) //所有型号
        // for (const serialNumberItem of serialNumber) {
        //   // const {data} = await getSpecificationsList({})
        // }
        standardItem.children = serialNumber.map(item => ({ id: item.id, label: item.name }))
      }
      this.standardTree = standard.map(item => ({ ...item, label: item.name }))
      console.log(this.standardTree)// 获取所有标准
    },
    async nodeClick(data, node, element) {
      // 数据 节点node对象 节点组件对象
      // console.log(data, node, element)
      // console.log(data.children && data.children?.length !== 0)
      if (!data.children && data.children?.length !== 0) {
        console.log('点击子节点', data)
        const res = await getSpecificationsList({ serialNumberId: data.id, specificationsName: data.label, pageNo: 1, pageSize: 10 })
        console.log(res)
      }
      console.log('点击父节点')
    }
  }
}
@@ -188,27 +219,30 @@
      flex: 2;
      margin-right: 12px;
      .el-tree {
        margin-top: 12px;
        ::v-deep .el-tree-node__content{
          height: 24px !important;
          font-size: 14px;
          display: inline-block !important;
          padding: 2px;
          color: #333;
        }
        ::v-deep .el-tree-node__content:hover{
          background: rgba(58,124,253,0.1) ;
          // opacity: 0.31;
          border-radius: 3px;
          color: #333 !important;
        }
        ::v-deep .el-tree-node:focus>.el-tree-node__content{
          background: rgba(58,124,253,0.1) ;
          // opacity: 0.31;
          border-radius: 3px;
          color: #333 !important;
        }
        // margin-top: 12px;
      }
      // .el-tree {
      //   margin-top: 12px;
      //   ::v-deep .el-tree-node__content{
      //     height: 24px !important;
      //     font-size: 14px;
      //     display: inline-block !important;
      //     padding: 2px;
      //     color: #333;
      //   }
      //   ::v-deep .el-tree-node__content:hover{
      //     background: rgba(58,124,253,0.1) ;
      //     // opacity: 0.31;
      //     border-radius: 3px;
      //     color: #333 !important;
      //   }
      //   ::v-deep .el-tree-node:focus>.el-tree-node__content{
      //     background: rgba(58,124,253,0.1) ;
      //     // opacity: 0.31;
      //     border-radius: 3px;
      //     color: #333 !important;
      //   }
      // }
    }
    .library-table{
      flex: 8;