elizebeth/src/xt_pages/stock/drugs/drugInventory.vue

<template>
  <div class="main-contain" style="height: 100%">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div
      class="app-container"
      style="height: calc(100vh - 118px); overflow: hidden"
    >
      <el-tabs
        v-model="activeName"
        style="height: 100%; display: flex; flex-direction: column"
        @tab-click="handleClick"
      >
        <el-tab-pane label="药品盘点" name="first" v-if="first">
          <drug-inventory></drug-inventory>
        </el-tab-pane>
        <el-tab-pane label="盘点列表" name="second" v-if="second">
          <inventory-details ref="child"></inventory-details>
        </el-tab-pane>

        <el-tab-pane label="报损列表" name="three" v-if="three">
          <drug-damaged ref="childOne"></drug-damaged>
        </el-tab-pane>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import BreadCrumb from "../../components/bread-crumb";
import drugInventory from "./inventory";
import inventoryDetails from "./inventoryDetails";
import drugDamaged from "./drugDamaged.vue";
export default {
  name: "stockModifyPrice",
  components: {
    BreadCrumb,
    drugInventory,
    inventoryDetails,
    drugDamaged,
  },
  data() {
    return {
      crumbs: [
        { path: false, name: "库存管理" },
        { path: false, name: "药品管理" },
        { path: false, name: "药品盘点" },
      ],
      activeName: "first",
      first: true,
      second: true,
      three: true,
    };
  },
  methods: {
    handleClick() {
      if (this.activeName == "second") {
        this.$refs.child.getlist();
      }
      if (this.activeName == "three") {
        this.$refs.childOne.getlist();
      }
    },
  },
  created() {
    if (this.$route.path == "/Pharmacy/drugs/drugInventory") {
      this.crumbs = [
        { path: false, name: "药品管理" },
        { path: false, name: "药品管理" },
        { path: false, name: "药品盘点" },
      ];
    }
  },
  mounted() {},
};
</script>

<style rel="stylesheet/scss" lang="scss">
.app-container {
  // margin: 20px;
  font-size: 15px;
}
.modifyDialog {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
  .el-form-item {
    width: 33%;
  }
}
.el-table td,
.el-table th.is-leaf,
.el-table--border,
.el-table--group {
  border-color: #d0d3da;
}
.el-table--border::after,
.el-table--group::after,
.el-table::before {
  background-color: #d0d3da;
}
::-webkit-scrollbar {
  height: 20px !important;
}
.el-tabs__content {
  overflow-y: auto;
}
</style>