8-22标准库修改完成

XiaoRuby

2023-08-22 6665e9f2c8676b812bf7579e4201ba37b0fdb5fc

 src/views/standardLibrary/index.vue

@@ -20,37 +20,8 @@
      </div>
      <div class="library-table" style="width: 80%">
        <div class="table-header">
          <div class="search-bar">
            <el-form ref="form" :inline="true" :model="searchData">
              <el-form-item>
                <span>原材料编码：</span>
                <el-input
                  v-model="searchData.keyword"
                  placeholder="请输入人员名称/原材料名称"
                >
                  <i slot="prefix" class="el-input__icon el-icon-search" />
                </el-input>
              </el-form-item>
              <el-form-item>
                <span>原材料名称：</span>
                <el-input
                  v-model="searchData.keyword"
                  placeholder="请输入原材料名称"
                >
                  <i slot="prefix" class="el-input__icon el-icon-search" />
                </el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="filteredTableData"
                  >查询</el-button
                >
                <el-button type="primary" plain @click="resetBtn"
                  >重置</el-button
                >
              </el-form-item>
            </el-form>
          </div>
          <div class="serve-btn">
            <span class="tipMsg">{{ msg !== "" ? msg : "" }}</span>
            <el-button
              type="primary"
              icon="el-icon-plus"
@@ -60,7 +31,6 @@
            <el-button
              class="top_div_button"
              icon="el-icon-delete-solid"
              size="small"
              style="color: #00a5ff"
              @click="deleteListClick"
              >删除</el-button
@@ -68,42 +38,6 @@
          </div>
        </div>
        <div class="table-box">
          <!-- <el-table
            ref="tableData"
            row-key="id"
            max-height="680"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
            :cell-style="{ textAlign: 'left' }"
            :header-cell-style="{
              border: '0px',
              background: '#f5f7fa',
              color: '#606266',
              boxShadow: 'inset 0 1px 0 #ebeef5',
              textAlign: 'left',
            }"
            :data="tableData"
            style="width: 100%"
          >
            <el-table-column type="index" label="序号" width="100px">
              <template v-if="scope.row.index + 1" slot-scope="scope">
                {{ scope.row.index + 1 }}
              </template>
            </el-table-column>
            <el-table-column prop="father" label="名称" width="320px">
              <template slot-scope="scope">
                <el-tag
                  size="mini"
                  :type="scope.row.father ? '' : 'success'"
                  :style="{ borderRadius: '40%', marginRight: '12px' }"
                  >{{ scope.row.father ? "01" : "02" }}</el-tag
                >
                {{ scope.row.father || scope.row.name }}
              </template>
            </el-table-column>
            <el-table-column prop="unit" label="单位" width="300px" />
            <el-table-column prop="required" label="标准" width="300px" />
            <el-table-column prop="internal" label="内控制" width="300px" />
          </el-table> -->
          <el-table
            :data="tableData"
            style="width: 100%; margin-bottom: 20px"
@@ -142,22 +76,30 @@
              label="单位"
              sortable
            ></el-table-column>
            <el-table-column label="标准值" sortable>
              <template scope="scope">
                <el-input
                  v-if="scope.row.edit === true || scope.row.code === '[2]'"
                  @blur="requiredOnfocus(scope)"
                  v-model="scope.row.required"
                  placeholder="请输入标准值"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="internal" label="内控值" sortable>
              <template scope="scope">
                <el-input
                  v-if="scope.row.edit === true || scope.row.code === '[2]'"
                  @blur="requiredOnfocus(scope)"
                  v-model="scope.row.internal"
                  placeholder="请输入内控值"
                ></el-input>
              </template>
            </el-table-column>
          </el-table>
          <!-- 弹出表单页 -->
          <div>
            <!--  -->
          </div>
          <div>
            <!-- 分页器 -->
            <!-- <el-pagination
              :current-page="pageParams.pageNo"
              :page-sizes="[10, 15, 20, 25]"
              :page-size="pageParams.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="pageParams.total"
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
            /> -->
          </div>
        </div>
      </div>
@@ -210,11 +152,11 @@
import {
  getMaterialList,
  getProductList,
  getProductSonList,
  addMaterial,
  addStandards,
  addSpecifications,
  deleteListApi,
  blurUpdateApi,
} from "@/api/standardLibrary";

import { selectproductModelApi } from "@/api/basicData/index";
@@ -222,6 +164,8 @@
  data() {
    return {
      deleteList: [],
      msg: "",
      isAllSelect: false,
      addTreeFormVisible: false,
      filterText: "",
      // 标准库bom树
@@ -232,18 +176,8 @@
        label: "name",
        value: "id",
      },
      // 查询条件
      searchData: {
        keyword: "",
      },
      tableData: [],
      oldtableData: [],
      // 分页参数
      pageParams: {
        pageNo: 1,
        pageSize: 12,
        total: 0,
      },
      tablespecifications: [],
      // 选中的节点数据
      selectData: {},
@@ -269,17 +203,13 @@
    // 获取bom树的标准数据
    async getStandardTree() {
      const { data } = await getMaterialList();
      console.log(data);
      this.standardTree = data.map((item) => {
        let name = null;
        switch (item.type) {
          case 1:
          case 0:
            name = "原材料";
            break;
          case 2:
            name = "半成品";
            break;
          case 3:
          case 1:
            name = "成品";
            break;
        }
@@ -289,19 +219,17 @@
          name,
        };
      });
      console.log(this.standardTree);
      // formTypeOptions
      // 默认第一个四级节点搜索，新增配置项
      const treeOptions = JSON.parse(JSON.stringify(this.standardTree));
      this.getDefault(treeOptions, 0);
      console.log(treeOptions);
      this.formTypeOptions = treeOptions;
      this.$nextTick().then(() => {
        const firstNode = document.querySelector(
          ".el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node"
        );
        firstNode.click();
        // console.log(firstNode)
        // console.log(firstNode);
      });
    },
    getDefault(arr, index) {
@@ -313,22 +241,13 @@
            item.children = null;
          }
        }
        // else {
        //   // if ('children' in item) {
        //   //   //
        //   // } else {
        //   //   // console.log(index, item)
        //   // }
        // }
      }
    },
    // 点击bom树节点方法
    async nodeClick(data, node, element) {
      // console.log('data', data)
      // console.log('children' in data)
      // 是子节点
      if (node.level === 4) {
        console.log(data, node);
        this.getParentData(node.parent, node.data.name);
        // 存下选中节点
        this.selectData = data;
        // eslint-disable-next-line prefer-const
@@ -338,55 +257,38 @@
        return;
      }
    },
    async getTableByClick(data) {
      // eslint-disable-next-line prefer-const
      let {
        data: { row, total },
      } = await getProductList({
        pageNo: this.pageParams.pageNo,
        pageSize: this.pageParams.pageSize,
        specificationsId: data.id,
      });
      // console.log(row)
      this.pageParams.total = total;
      row = row.map((item, index) => ({ ...item, index }));
      for (const item of row) {
        if (item.children) {
          const res = await getProductSonList({ fatherName: item.father });
          item.children = res.data;
          item.id = item.father;
    // 获取树路径
    getParentData(node, name) {
      if (node !== null) {
        if (node.data.name !== undefined) {
          this.msg = node.data.name + " > " + name;
        }
        this.getParentData(node.parent, this.msg);
      }
      this.tableData = row;
    },
    async getTableByClick(data) {
      await getProductList({
        specificationsId: data.id,
      }).then((res) => {
        res.data.forEach((i) => {
          if (i.name === undefined) {
            i.name = i.children[0].name;
            i.unit = i.children[0].unit;
            i.id = i.children[0].id;
            i.required = i.children[0].required;
            i.internal = i.children[0].internal;
            i.edit = true;
            delete i.children;
          }
        });
        this.tableData = res.data;
        console.log(`output->this.tableData`, this.tableData);
        this.selectDataList();
      });
    },
    specificationDetails(row) {
      // 跳转产品规格详情页
      this.$router.push(`/standardLibrary/SpecificationDetails/${row.id}`);
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.pageParams.pageSize = val;
      this.getTableByClick(this.selectData);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.pageParams.pageNo = val;
      this.getTableByClick(this.selectData);
    },
    // 查询按钮
    filteredTableData() {
      this.oldtableData = this.tableData;
      // 根据输入的关键字得到过滤后的数据，如果有就把过滤后的数据展示在页面上
      const filteredtabledata = this.tableData.filter((item) => {
        return item.name.includes(this.searchData.keyword);
      });
      // console.log('filteredtabledata', filteredtabledata)
      this.tableData = filteredtabledata;
    },
    // 重置按钮
    resetBtn() {
      this.searchData.keyword = "";
      this.tableData = this.oldtableData;
    },
    renderContent(h, { node, data, store }) {
      // console.log('data', data)
@@ -501,20 +403,18 @@
      // 自定义
      if (this.isAllSelect) {
        val.forEach((i) => {
          let isExist = false;
          this.deleteList.findIndex((c) => {
            if (c === i.id) {
              isExist = true;
            }
          });
          if (!isExist && i.id !== undefined) {
          if (i.id !== undefined) {
            this.deleteList.push(i.id);
          } else {
            i.children.forEach((c) => {
              this.deleteList.push(c.id);
            });
          }
        });
      } else {
        this.deleteList.splice(0, this.deleteList.length);
      }
      // 自定义结束
      console.log(`output->this.`, this.deleteList);
    },
    //选择某行
    selectTr(selection, row) {
@@ -523,9 +423,26 @@
        this.isAllSelect = row.isChecked;
        this.toggleSelect(row, row.isChecked, "tr");
      });

      if (row.isChecked === true) {
        this.deleteList.push(row.id);
        if (row.children !== undefined) {
          row.children.forEach((i) => {
            this.deleteList.push(i.id);
          });
        } else {
          this.deleteList.push(row.id);
        }
      } else if (row.isChecked === false) {
        if (row.children !== undefined) {
          row.children.forEach((i) => {
            this.deleteList.findIndex((c, index) => {
              if (c === i.id) {
                this.deleteList.splice(index, 1);
                return;
              }
            });
          });
        }
        this.deleteList.findIndex((c, index) => {
          if (c === row.id) {
            this.deleteList.splice(index, 1);
@@ -574,6 +491,22 @@
          message: res.message,
          type: "success",
        });
        this.getTableByClick(this.selectData);
      });
    },
    async requiredOnfocus(scope) {
      let obj = {
        id: scope.row.id,
        required: scope.row.required,
        internal: scope.row.internal,
      };

      await blurUpdateApi(obj).then((res) => {
        this.$message({
          message: res.message,
          type: "success",
        });
        this.getTableByClick(this.selectData);
      });
    },
  },
@@ -587,13 +520,6 @@
    padding-left: 23px !important;
  }
}
// .dialogform {
//   transform: translate(-50%, -50%);
//   top: 50% !important;
//   left: 50% !important;
//   width: 1000px;
//   height: 800px;
// }
.standard-library-main {
  width: 100vh;
  height: 100%;
@@ -654,6 +580,7 @@
      .table-header {
        display: flex;
        justify-content: space-between;
        width: 100%;
        .el-form-item {
          margin-bottom: 30px !important;
        }
@@ -665,12 +592,6 @@
        display: flex;
        flex-direction: column;
        justify-content: space-between;

        .el-table {
          // flex: 1;
          // max-height: 680px;
          // overflow-y: scroll;
        }
        > div:nth-child(3) {
          // height: 20px;
          display: flex;
@@ -689,4 +610,43 @@
    }
  }
}
.search-bar {
  .el-input {
    position: relative;
    font-size: 0.07292rem;
    display: inline-block;
    width: 70%;
  }
}
.firstDiv {
  float: left;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #eff5ff;
  margin-top: 5px;
  justify-content: center;
  display: flex;
  align-items: center;
  margin-right: 8px;
}
.el-tag.el-tag {
  border-color: transparent;
  background-color: transparent;
}
.el-tag.el-tag:hover {
  border-color: transparent;
  background-color: transparent;
}
.serve-btn {
  width: 100%;
  padding-bottom: 6px;
  text-align: right;
}
.tipMsg {
  float: left;
  font-size: 16px;
  font-weight: 500;
  color: #999999;
}
</style>