index.vue 10 KB
<template>
  <div class="app-container">
    <el-button @click="test()" />
    <el-form ref="form" :model="queryParams" inline>
      <el-form-item label="仓库编码" size="small">
        <el-input
          v-model="queryParams.code"
          clearable
          size="small"
          style="width: 240px"
          @clear="handleQuery"
        ></el-input>
      </el-form-item>
      <el-form-item label="名称" size="small">
        <el-input
          v-model="queryParams.name"
          clearable
          size="small"
          style="width: 240px"
          @clear="handleQuery"
        ></el-input>
      </el-form-item>
      <el-form-item size="small">
        <el-button
          size="small"
          icon="el-icon-search"
          type="primary"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button
          size="small"
          icon="el-icon-refresh"
          @click="resetParams('form')"
          >重置</el-button
        >
      </el-form-item>
    </el-form>

    <el-row style="margin-top: 6px" :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['']"
          >新增
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['']"
          >修改
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          icon="el-icon-delete"
          size="mini"
          :disabled="single"
          @click="handleDelete"
          v-hasPermi="['']"
          >删除
        </el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="openPrint"
          v-hasPermi="['']"
          >打印
        </el-button>
      </el-col>
      <div class="top-right-btn">
        <el-row>
          <el-tooltip
            class="item"
            effect="dark"
            content="隐藏搜索"
            placement="top"
          >
            <el-button icon="el-icon-search" circle></el-button>
          </el-tooltip>
          <el-tooltip class="item" effect="dark" content="刷新" placement="top">
            <el-button icon="el-icon-refresh" circle></el-button>
          </el-tooltip>
        </el-row>
      </div>
    </el-row>
    <el-table
      ref="multipleTable"
      :data="tableData"
      :header-cell-style="{
        'text-align': 'center',
        background: '#F8F8F9',
        color: '#515A6E',
      }"
      :cell-style="{ 'text-align': 'center' }"
      tooltip-effect="dark"
      style="width: 100%"
      v-loading="loading"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column prop="id" label="id"></el-table-column>
      <el-table-column prop="code" label="物料编码"></el-table-column>
      <el-table-column prop="name" label="名称"></el-table-column>
      <el-table-column prop="type" label="物料类别">
        <temple slot-scope="scope">
          <el-tag type="info">{{
            scope.row.type | transferType(scope.row.companyCode)
          }}</el-tag>
        </temple>
      </el-table-column>
      <el-table-column prop="abcClass" label="ABC分类"></el-table-column>
      <el-table-column prop="spec" label="规格"></el-table-column>
      <el-table-column prop="locatingRule" label="定位规则"></el-table-column>
      <el-table-column prop="attentionTo" label="分配规则"></el-table-column>
      <el-table-column
        prop="replenishmentRule"
        label="补货规则"
      ></el-table-column>
      <el-table-column prop="emptyLocRule" label="空货位规则"></el-table-column>
      <el-table-column prop="receivingFlow" label="入库流程"></el-table-column>
      <el-table-column prop="shippingFlow" label="出库流程"></el-table-column>
      <el-table-column
        prop="attributeTemplateCode"
        label="属性模板"
      ></el-table-column>
      <el-table-column
        prop="trackSerialNum"
        label="记录序列号"
      ></el-table-column>
      <el-table-column prop="autoGenSerialNum" label="自动生成序列号">
        <temple slot-scope="scope">
          <el-tag type="info">{{
            scope.row.autoGenSerialNum | transferAutoGenSerialNum
          }}</el-tag>
        </temple>
      </el-table-column>
      <el-table-column
        prop="autoGenSerialNumFormat"
        label="自动生成序列号表达式"
      ></el-table-column>
      <el-table-column
        prop="snTemplateCode"
        label="序列号模板"
      ></el-table-column>
      <el-table-column prop="enable" label="状态">
        <template slot-scope="scope">
          <el-tag :type="scope.row.enable | statusFilter">{{
            scope.row.enable
          }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="isMix" label="是否允许混放">
        <temple slot-scope="scope">
          <el-tag type="info">{{ scope.row.isMix | transferIsMix }}</el-tag>
        </temple>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            >删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-pagination
      :current-page="queryParams.pageNum"
      :page-size="queryParams.pageSize"
      :page-sizes="[10, 20, 50, 100]"
      :total="pageSize"
    />

    <itemCRUDDialog :show.sync="diaOpen" :title="title" :switch="switch1" />
    <printDialog :show.sync="diaOpenPrint" :tableData="printData" />
  </div>
</template>

<script>
// companyCode
// type
// locatingRule
// allocationRule
// replenishmentRule
// emptyLocRule
// receivingFlow
// shippingFlow
import {
  queryList,
  edit,
  add,
  remove,
} from "@/api/config/InventoryInfo/material";
import { queryList as queryType } from "@/api/config/InventoryInfo/materialType";
import {} from "@/api/config/InventoryInfo/company";
import itemCRUDDialog from "@/views/config/inventoryInfo/supplies/material/dialog/itemCRUDDialog";
import printDialog from "@/views/config/inventoryInfo/supplies/material/dialog/printDialog";

import { getDicts } from "@/api/system/dict/data";

export default {
  name: "material",
  components: {
    itemCRUDDialog,
    printDialog,
  },
  filters: {
    statusFilter(status) {
      const statusMap = {
        正常: "success",
        停用: "gray",
      };
      return statusMap[status];
    },
  },
  data() {
    return {
      that: this,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      //表格数据
      tableData: [],
      //打印数据
      printData: [],
      // 非单个禁用
      single: true,
      //非多个禁用
      multiple: true,
      // 对话框标题
      title: "",
      //弹窗显示开关
      diaOpen: false,
      diaOpenPrint: false,
      pageNum: 1,
      pageSize: "",
      loading: true,
      date: [],
      //弹窗下拉框数据
      selectValue: [],
      //增加与修改转换开关
      switch1: "",
      //临时存放标签样式
      labelType: "",
      dict: [],
      ids: [],
      tips: false,
    };
  },
  created() {
    this.handleQuery();
  },
  methods: {
    test() {
      alert(this.labelType);
    },
    handleQuery() {
      this.loading = true;
      getDicts("sys_normal_disable").then((dictData) => {
        this.dict = [];
        for (let i = 0; i < dictData.data.length; i++) {
          this.dict.push({
            dictValue: dictData.data[i].dictValue,
            dictLabel: dictData.data[i].dictLabel,
            listClass: dictData.data[i].listClass,
          });
        }
      });
      queryList(this.queryParams).then((res) => {
        this.tableData = res.rows;
        this.pageSize = res.total;
        this.loading = false;
        this.tableData.forEach((item) => {
          if (item.enable == true) {
            item.enable = "正常";
          } else if (item.enable == false) {
            item.enable = "停用";
          }
        });
      });
    },
    filterData() {
      return this.single;
    },
    // 清空查询列表
    resetParams(formName) {
      this.queryParams.code = "";
      this.queryParams.name = "";
      this.$refs[formName].resetFields();
      this.handleQuery();
    },

    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.id);
      this.printData = selection.map((item) => {
        item.code, item.name, item.type, item.spec;
      });
      console.log(this.printData);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    /**打开打印对话框*/
    openPrint() {
      this.diaOpenPrint = true;
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.switch1 = false;
      this.title = "添加货主";
      this.diaOpen = true;
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.switch1 = true;
      const code = row.code;
      queryList(code).then((response) => {
        this.diaForm = response.rows[0];
        this.title = "修改货主";
        this.diaOpen = true;
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const code = row.code || this.ids;
      this.$confirm('是否确认删除货主编号为"' + code + '"的数据项?', "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(function () {
          return remove(code);
        })
        .then(() => {
          this.handleQuery();
          this.msgSuccess("删除成功");
        })
        .catch(function () {});
    },
    /**打印按钮操作*/
  },
};
</script>

<style scoped>
</style>