elizebeth/src/xt_pages/stock/warehouseManage/query.vue

<template>
  <div class="main-contain">
    <div class="position">
      <bread-crumb :crumbs="crumbs"></bread-crumb>
    </div>
    <div class="app-container">
      <div
        style="
          justify-content: space-between;
          margin: 0px 0 12px 0;
          display: flex;
          align-items: center;
        "
      >
        <div>
          <el-input
            size="small"
            style="width: 200px; margin-left: 10px"
            class="filter-item"
            v-model.trim="keyword"
            placeholder=""
          />
          <el-button
            size="small"
            class="filter-item"
            type="primary"
            icon="el-icon-search"
            @click="search"
            >搜索</el-button
          >
        </div>
        <div>
          <el-button size="small" type="primary" @click="AddWareHouse(1)">新增</el-button>
          <el-button size="small" type="primary" @click="toPrint">设置</el-button>
        </div>
      </div>

      <el-table
        :row-style="{ color: '#303133' }"
        :header-cell-style="{
          backgroundColor: 'rgb(245, 247, 250)',
          color: '#606266',
        }"
        :data="tableData"
        :class="signAndWeighBoxPatients"
        border
      >
        <el-table-column label="仓库编号" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.StorehouseCode ? scope.row.StorehouseCode : "" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="仓库名称" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.StorehouseName ? scope.row.StorehouseName : "" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="仓库地址" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.StorehouseAddress ? scope.row.StorehouseAddress : "" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="仓库管理员" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.StorehouseAdminName ? scope.row.StorehouseAdminName : "" }}</span>
          </template>
        </el-table-column>
        <el-table-column label="状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.StorehouseStatus == 1">启用</span>
            <span v-if="scope.row.StorehouseStatus == 0">禁用</span>
          </template>
        </el-table-column>

        <el-table-column label="操作" align="center" width="260px">
          <template slot-scope="scope">
            <el-tooltip class="item" content="编辑" placement="top-start">
              <el-button
                icon="el-icon-edit-outline"
                size="small"
                type="primary"
                @click="toEdit(scope.row,2)"
              >
              </el-button>
            </el-tooltip>

            <el-tooltip class="item" :content="scope.row.StorehouseStatus == 1?'禁用':'启用'" placement="top-start">
              <el-button
                v-if="scope.row.StorehouseStatus == 0"
                size="small"
                type="primary"
                @click="toDisable2(scope.row, scope.row.$index)"
                ><img
                  src="../../../assets/purchase/set.png"
                  alt=""
                  style="width: 12px"
                />
              </el-button>
              <!-- 0:禁用  1:启用 -->
              <el-button
                v-if="scope.row.StorehouseStatus == 1"
                size="small"
                type="danger"
                @click="toDisable(scope.row, scope.row.$index)"
                ><img
                  src="../../../assets/purchase/ban.png"
                  alt=""
                  style="width: 12px"
                />
              </el-button>
            </el-tooltip>

            <el-tooltip class="item" content="删除" placement="top-start">
              <el-button
                icon="el-icon-delete"
                size="small"
                type="danger"
                @click="toDelete(scope.row, scope.row.$index)"
              >
              </el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[10, 50, 100, 200, 500, 1000]"
        :page-size="10"
        background
        align="right"
        style="margin-top: 20px"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      >
      </el-pagination>
    </div>

    <AddWareHouse ref="AddWareHouse" @init="initData" ></AddWareHouse>
  </div>
</template>

<script>
import BreadCrumb from "@/xt_pages/components/bread-crumb";
import { getDictionaryDataConfig, getDataConfig } from "@/utils/data";
import { storehouselist,updatestatus,deletestorehouse } from "@/api/warehouse";
import AddWareHouse from "./components/AddWareHouse.vue";
export default {
  name: "stockIn",
  created() {
    var types = getDictionaryDataConfig("system", "drug_type");
    var arr = [];
    var obj = { id: 0, name: "全部" };
    arr.push(obj);
    arr.push(...types);
    this.drugType = arr;
    this.getlist();
  },
  components: {
    BreadCrumb,
    AddWareHouse,
  },
  data() {
    return {
      content:"禁用",
      Disable_:0,
      crumbs: [
        { path: false, name: "库房管理" },
        { path: "/stock/warehousequery", name: "仓库管理" },
      ],
      keyword: "",
      total: 0,
      multipleSelection: [],
      signAndWeighBoxPatients: "sign-and-weigh-box-patients",
      page: 1,
      limit: 10,
      tableData: [],
      drugType: [],
      stockOutData: [],
    };
  },
  methods: {
    initData() {
      let params = {
        limit: this.limit,
        page: this.page,
        keyword:this.keyword,
      };
      //请求分页接口
      storehouselist(params).then((response) => {
        console.log("fenyeeeeeeeeeeeeeeeeeee")
        if (response.data.state == 1) {
          this.tableData = response.data.data.list;
          this.total = response.data.data.total;
          console.log("this.tableData",this.tableData)
        }
      });
    },

    getlist() {
      var params = {
        keyword: this.keyword,
        page: this.page,
        limit: this.limit,
      };
      //请求分页接口
      storehouselist(params).then((response) => {
        if (response.data.state == 1) {
          this.tableData = response.data.data.list;
          this.total = response.data.data.total;
        }
      });
    },
    handleSizeChange(val) {
      this.limit = val;
      this.getlist();
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getlist();
    },

    startTimeChange: function (val) {
      var time = this.getTimestamp(val) - this.getTimestamp(this.end_time);

      if (time > 0) {
        this.$message.error("开始时间不能大于结束时间");
        this.start_time = "";
      } else {
        this.getlist();
      }
    },
    endTimeChange: function (val) {
      var time = this.getTimestamp(val) - this.getTimestamp(this.start_time);
      if (time < 0) {
        this.$message.error("结束时间不能小于开始时间");
        this.end_time = "";
      } else {
        this.getlist();
      }
    },

    search: function () {
      this.getlist();
    },
    // 新增仓库
    AddWareHouse(val) {
      this.$nextTick(() => {
        this.$refs.AddWareHouse.show(1, val);
      })
    },
    // 编辑仓库
    toEdit(data,val) {
      this.$nextTick(() => {
        this.$refs.AddWareHouse.show(data, val);
      })
    },
    // 禁用仓库
    toDisable(val, index) {
      var params = {
        id:val.ID,
      };
      this.$confirm("是否确定将此仓库禁用?", "禁用仓库信息", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
        updatestatus(params).then((res) => {
          if (res.data.state == 1) {
            this.$message.success(res.data.data.list);
            this.Disable_= 1
          }else {
            this.$message.error(res.data.msg);
          }
        })//刷新
        .then(() =>{
          this.initData();
        })
        .catch((err) => {
          console.log(err)
        })
        }).catch(() => {});
    },
    // 启用仓库
    toDisable2(val, index) {
      var params = {
        id:val.ID,
      };
      this.$confirm("是否确定将此仓库启用?", "启用仓库信息", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
        updatestatus(params).then((res) => {
          if (res.data.state == 1) {
            this.$message.success(res.data.data.list);
            this.Disable_= 1
          }else {
            this.$message.error(res.data.msg);
          }
        })//刷新
          .then(() =>{
            this.initData();
          })
          .catch((err) => {
            console.log(err)
          })
      }).catch(() => {});
    },
    //删除仓库
    toDelete(val, index) {
      var params = {
        id:val.ID,
      };
      this.$confirm("是否确定将此仓库删除?", "删除仓库信息", {
        confirmButtonText: "确 定",
        cancelButtonText: "取 消",
        type: "warning",
      }).then(() => {
        deletestorehouse(params).then((res) => {
          if (res.data.state == 1) {
            this.$message.success(res.data.data.list);
          }else {
            this.$message.error(res.data.msg);
          }
        })//刷新
          .then(() =>{
            this.initData();
          })
          .catch((err) => {
            console.log(err)
          })
      }).catch(() => {});
    },

    formatJson(filterVal, jsonData) {
      return jsonData.map((v) => filterVal.map((j) => v[j]));
    },
    changeTypeName() {
      this.getlist();
    },

    //路由跳转 ----- 仓库设置
    toPrint() {
      this.$router.push({ path: "/stock/waresetting" });
    },

    getTimestamp(time) {
      // 把时间日期转成时间戳
      return new Date(time).getTime() / 1000;
    },
    getDictionaryDataConfig(module, filed_name) {
      return getDictionaryDataConfig(module, filed_name);
    },
    getDataConfig(module, filed_name) {
      return getDataConfig(module, filed_name);
    },
  },
};
</script>

<style rel="stylesheet/css" lang="scss" scoped>
.information {
  border: 1px #dcdfe6 solid;
  padding: 30px 20px 30px 20px;

  .border {
    border-bottom: 1px #dcdfe6 solid;
    margin: 0px 0 20px 0;
  }
}

.title {
  background: #409eff;
  height: 44px;
  line-height: 44px;
  padding: 0 0 0 10px;
  color: #fff;
  margin: 0 0 10px 0;
}

.edit_separater {
  border-top: 1px solid rgb(233, 233, 233);
  margin-top: 15px;
  margin-bottom: 15px;
}
</style>

<style>
.sign-and-weigh-box .sign-and-weigh-box-patients .cell {
  font-size: 12px;
}

.sign-and-weigh-box .sign-and-weigh-box-patients .current-row > td {
  background: #6fb5fa;
}

.count {
  color: #bd2c00;
}
.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;
}
</style>