udiwms-vue-frame/src/views/system/dept/invWarehouse.vue

<template>
  <div>
    <el-card>
      <el-form :inline="true" :model="query" class="query-form" size="mini">
        <el-form-item class="query-form-item" label="仓库名称:">
          <el-input
            v-model="query.name"
            clearable
            placeholder="仓库名称"
          ></el-input>
        </el-form-item>
        <el-form-item class="query-form-item" label="仓库状态:">
          <el-select v-model="query.status" placeholder="仓库状态" clearable>
            <el-option label="全部" value=""></el-option>
            <el-option label="正常" value='1'></el-option>
            <el-option label="禁用" value='0'></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button-group style="margin-left: 10px;display:flex;">
            <el-button type="primary" icon="el-icon-refresh" @click="onReset">重置</el-button>
            <el-button type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
          </el-button-group>
        </el-form-item>
      </el-form>
      <el-table
        :data="list"
        border
        highlight-current-row
        @current-change="handSubInvCurrentChange"
        style="width: 100%;">
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column
          prop="name"
          label="仓库名称"
        >
        </el-table-column>
        <el-table-column
          prop="code"
          label="仓库编码"
        >
        </el-table-column>
        <el-table-column
          prop="parentName"
          label="所属部门"
        >
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button
              type="text"
              size="small" :disabled="!configParms.basicInv"
              @click.native.stop="addUser(scope.row)"
            >新增用户
            </el-button
            >
            <el-button
              type="text"
              size="small" :disabled="!configParms.basicInv"
              @click.native.stop="selsectBussinessType(scope.row)"
            >新增单据类型
            </el-button
            >
            <el-button
              type="text"
              size="small"
              @click.native.stop="invSpaceManage(scope.row)"
            >新增货位
            </el-button
            >
            <el-button
              type="text"
              size="small" :disabled="!configParms.basicInv"
              @click.native.stop="handleSubForm( scope.row, 'edit')"
            >编辑
            </el-button
            >
            <el-button
              type="text"
              size="small"
              :disabled="!configParms.basicInv"
              @click.native.stop="handleSubDel(scope.row)"
            >删除
            </el-button
            >
          </template>

        </el-table-column>
      </el-table>
    </el-card>
    <el-tabs type="border-card" style="margin: 15px">
      <el-tab-pane>
        <span slot="label">{{ currentRow.name }}-用户列表</span>
        <el-table
          :data="userData"
          key="row.id"
          border
          style="width: 100%"
          highlight-current-row
          @current-change="loadUserBusType"
        >
          <el-table-column label="序号" type="index"></el-table-column>
          <el-table-column
            prop="username"
            label="账号"
            min-width="20%">
          </el-table-column>
          <el-table-column
            prop="employeeName"
            label="用户名"
            min-width="30%">
          </el-table-column>
          <el-table-column
            label="操作"
            min-width="30%"
          >
            <template slot-scope="scope">

              <el-button
                type="text"
                size="small" :disabled="!configParms.basicInv"
                @click.native="rmInvUser(scope.row)">
                移除
              </el-button>

              <el-button
                type="text"
                size="small" :disabled="!configParms.basicInv"
                @click.native="rmInvUser(scope.row)">
                授权
              </el-button>


              <el-button
                type="text"
                size="small" :disabled="!configParms.basicInv"
                @click.native="relBusttype(scope.row)">
                管理单据类型
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">{{ currentRow.name }}-单据类型</span>
        <el-table v-loading="loading" :data="userBussinessTypeList" ref="typeList"
                  border
                  style="width: 100%">
          <el-table-column label="单据类型名称" prop="name"></el-table-column>
          <el-table-column label="单据类型编码" prop="action"></el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                :disabled="!configParms.basicInv"
                @click.native.stop="delWarehouseBussinessType(scope.row.id)"
              >移除
              </el-button
              >
            </template>

          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">{{ currentRow.name }}-货位信息</span>
        <invSpaceManage :invInfo="currentInvInfo"></invSpaceManage>
      </el-tab-pane>
    </el-tabs>
    <!--添加用户弹窗-->
    <el-dialog
      v-if="userFormVisible"
      title="仓库信息-添加用户"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="userFormVisible"
    >
      <el-table v-loading="userloading" :data="selectUserList"
                ref="selectUserList"
                @selection-change="handleUserSelectionChange"
                border
                style="width: 100%">
        <el-table-column
          type="selection"
          :reserve-selection="false"
          width="55">
        </el-table-column>
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column label="账号" prop="userName"></el-table-column>
        <el-table-column label="用户名" prop="employeeName"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="userFormVisible = !userFormVisible"
        >取消
        </el-button
        >
        <el-button
          type="primary"
          @click.native="addUserData()"
        >选入
        </el-button>
      </div>
      <pagination
        v-show="selectUserToatl>0"
        :total="selectUserToatl"
        :page.sync="selectUserQuery.page"
        :limit.sync="selectUserQuery.limit"
        @pagination="getSelectUser"
      />
    </el-dialog>

    <!--添加单据类型弹窗-->
    <el-dialog
      title="仓库关联单据类型"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="userBussinessTypeFormVisible"
    >
      <el-row type="flex" justify="end">
        <el-button-group style="display: flex;margin-bottom: 15px; margin-right: 50px">
          <el-button
            type="primary"
            @click.native="addBussinessType()"
            :loading="loading"
          >选入
          </el-button
          >
        </el-button-group>
      </el-row>

      <div slot="footer" class="dialog-footer">
        <el-button @click.native="userBussinessTypeFormVisible = !userBussinessTypeFormVisible"
        >取消
        </el-button
        >
      </div>

    </el-dialog>


    <!--选入单据类型弹窗-->
    <el-dialog
      title="单据类型"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="bussinessTypeFormVisible"
    >
      <el-table v-loading="loading" :data="bussinessTypeList" ref="typeList"
                @selection-change="handleBussinessTypeSelectionChange"
                style="width: 100%">
        <el-table-column
          type="selection"
          :reserve-selection="true"
          width="55">
        </el-table-column>
        <el-table-column label="单据类型编码" prop="action" fixed></el-table-column>
        <el-table-column label="单据类型名称" prop="name" fixed></el-table-column>
      </el-table>

      <el-pagination
        :page-size="bussinessTypeQuery.limit"
        @current-change="getBussinessType"
        layout="prev, pager, next"
        :total="bussinessTypeTotal"
        :current-page="bussinessTypeQuery.page"
      >
      </el-pagination>

      <div slot="footer" class="dialog-footer">
        <el-button @click.native="bussinessTypeFormVisible = !bussinessTypeFormVisible"
        >取消
        </el-button
        >
        <el-button
          type="primary"
          @click.native="addBussinessTypeData()"
        >提交
        </el-button>
      </div>

    </el-dialog>

    <!--    用户业务单据类型关联-->
    <el-dialog
      title="业务类型关联"
      :visible.sync="relBusUserVisile"
      width="70%"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      v-if="relBusUserVisile"
    >
      <relBusUserDialog :inputQuery="curSeleUser" :closeDialog="cancelRelBusDiaolog"></relBusUserDialog>
    </el-dialog>

    <!--编辑表单界面-->
    <el-dialog
      :title="formMap[formName]"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :visible.sync="subFormVisible"
      :before-close="hideForm"
      width="60%"
      top="5vh"
    >
      <el-form :model="subData" ref="dataForm">
        <el-form-item label="所属仓库" prop="pid">
          <el-select v-model="subData.parentId" placeholder="顶级" disabled>
            <el-option
              v-for="item in mergeList"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            >
                          <span style="float: left"
                          ><span v-html="item.html"></span>{{ item.name }}</span
                          >
            </el-option>
          </el-select>
        </el-form-item>

        <el-row :gutter="20" class="el-row" type="flex">
          <el-col :span="12" class="el-col">
            <el-form-item label="分库编码" prop="title" class="query-form-item">
              <el-input
                disabled
                v-model="subData.code" style="width: 80%"
                auto-complete="off"
              ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12" class="el-col">
            <el-form-item label="分库名称" prop="name" class="query-form-item">
              <el-input
                v-model="subData.name" style="width: 80%"
                auto-complete="off"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-table :data="sysSubList" style="width: 100%; margin-bottom: 30px;" border>
          <el-table-column label="序号" type="index"></el-table-column>
          <el-table-column
            label="第三方系统名称"
            prop="sysName"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="第三方仓库ID"
            prop="thirdId"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            label="第三方仓库名称"
            prop="thirdName"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column label="操作" fixed="right">
            <template slot-scope="scope">
              <el-button
                type="text"
                size="small"
                :disabled="!configParms.basicInv"
                @click="intentSubSelect(scope.row)"
              >关联
              </el-button
              >
              <el-button type="text" size="small" @click.native.stop="unbindSubThrWarehouse(scope.row)"
                         :disabled="scope.row.thirdId=='' ||scope.row.thirdId==null ||!configParms.basicInv"
              >解绑
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click.native="hideForm">取消</el-button>
        <el-button
          type="primary"
          @click.native="forSubSubmit()"
          :loading="formLoading"
        >提交
        </el-button
        >
      </div>
    </el-dialog>


    <!--货位管理-->
    <el-dialog
      title="货位管理"
      :visible.sync="invSpaceManageVisible"
      width="70%"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      v-if="invSpaceManageVisible"
    >
      <invSpaceManage :invInfo="currentInvInfo"></invSpaceManage>
    </el-dialog>

  </div>
</template>

<script>
import {
  filterSubAll, saveSubWarehouse, deleteSubWarehouse,
  getSubThrsysDetail, bindThrSubWarehouse, unbindSubThrWarehouse
} from "@/api/system/invSubWarehouse";
import {filterThrList} from "@/api/thrsys/thrInvWarehouse";
import {getHospitalUserList, selectNotSelectUser} from "@/api/auth/authUser";
import {getJoinBussinessType} from "@/api/basic/bussinessType";
import {formatDate} from "@/utils/date";
import axios from "axios";
import store from "@/store";
import {findConfig} from "@/api/thrsys/spsSyncStatus";
import {isBlank} from "@/utils/strUtil";
import relBusUserDialog from "./invWarehouseRelBusTypes";
import {selectSysParamByKey} from "@/api/system/param/systemParamConfig";
import {filterUserBusTypeList} from "@/api/basic/invRelBusTypes";
import invSpaceManage from "@/views/inventory/InvSpaceManage";
import {
  addWarehouseUser, deleteWarehouseBussinessType,
  saveWarehouseUser,
  warehouseBussinessTypeList,
  warehouseUserList
} from "@/api/system/invWarehouse";
import {superSearch} from "@/api/biz/udiInfo";

export default {
  data() {
    return {
      query: {
        id: null,
        pid: null,
        name: null,
        code: null,
        status: "1",
        advanceType: null,
        isDefault: null
      },
      userQuery: {
        code: null,
        page: 1,
        limit: 10
      },
      loading: true,
      list: [],
      userData: [],
      userTotal: 0,
      selectUserList: [],
      selectUserToatl: 0,
      selectAddUser: [],
      configParms: {},
      mutiInvMode: true,
      subRadioCheck: null,
      currentCode: null,
      currentRow: {name: "仓库"},
      curSeleUser: null,
      selectUserQuery: {
        code: null,
        page: 1,
        limit: 10
      },
      userloading: false,
      userFormVisible: false,
      subData: {},

      relBusUserVisile: false,

      userBussinessTypeList: [],
      userBussinessTypeFormVisible: false,

      bussinessTypeQuery: {
        enabled: true,
        page: 1,
        limit: 10,
        ids: ""
      },

      busQuery: {
        code: null,
        page: 1,
        limit: 10
      },
      formName: null,
      formMap: {
        addTop: "添加分库",
        add: "添加货位",
        edit: "编辑"
      },
      subFormVisible: false,

      selectBussinessTypeList: [],
      bussinessTypeFormVisible: false,

      //管理货位
      currentInvInfo: {
        invStorageCode: null,
        invWarehouseCode: null
      },
      invSpaceManageVisible: false,
      sysList: [],
      sysSubList: [],
    };
  },
  methods: {
    onReset() {
      this.$router.push({
        path: "",
      });
      this.query = {
        name: "",
        status: "",
      };
      this.userQuery.page = 1;
      this.busQuery.page = 1;
      this.getList();
    },
    //提交查询
    onSubmit() {
      this.getList();
    },
    //获取仓库信息
    getList() {
      this.loading = true;
      filterSubAll(this.query)
        .then((response) => {
          this.loading = false;
          this.list = response.data || [];
        })
        .catch(() => {
          this.loading = false;
          this.list = [];
        });
    },
    //获取配置信息
    getSyncConfig() {
      findConfig()
        .then((response) => {
          if (response.code == 20000) {
            this.configParms = response.data;
          }
        })
        .catch(() => {
        });


      let query = {
        paramKey: "muti_inv_mode",
      };
      selectSysParamByKey(query).then((response) => {
        if (response.code == 20000) {
          if (response.data.paramValue == "1") {
            this.mutiInvMode = true;
          } else {
            this.mutiInvMode = false;
          }
        }
      });
    },


    handSubInvCurrentChange(row) {
      this.currentCode = row.code;
      this.currentRow = row;
      this.curSeleUser = null;

      //加载用户信息
      this.loadLinkData(row)

      //加载单据类型
      this.selsectBussinessType(row);

      //加载货位信息
      this.invSpaceManage(row);
    },


    loadLinkData(row) {
      this.userQuery.page = 1;
      this.userQuery.code = row.code;
      this.curSeleUser = null;
      //加载用户数据
      this.loadUserList();
    },

    loadUserList(val) {
      if (val != null) {
        this.userQuery.page = val;
      }
      //加载用户数据
      warehouseUserList(this.userQuery).then((res) => {
        this.userData = res.data.list;
        this.userTotal = res.data.total;
      }).catch((error) => {
        this.$message.error("用户数据加载失败")
      });
    },

    //添加仓库关联用户
    addUser(row) {
      this.currentCode = row.code;
      this.userFormVisible = true;
      this.selectUserQuery.code = row.code;
      this.selectUserQuery.page = 1;
      this.getSelectUser();
    },

    handleUserSelectionChange(val) {
      this.selectAddUser = val;
    },

    getSelectUser() {
      selectNotSelectUser(this.selectUserQuery).then((res) => {
        this.selectUserList = res.data.list;
        this.selectUserToatl = res.data.total;
      }).catch((error) => {
        this.$message.error("用户数据加载失败")
      });
    },

    addUserData() {
      let query = {
        code: this.currentCode,
        userList: JSON.stringify(this.selectAddUser)
      };
      addWarehouseUser(query).then((res) => {
        if (res.code === 20000) {
          this.userFormVisible = false;
          this.$message.success("添加成功");
          this.userQuery = {
            code: this.currentCode,
            page: 1,
            limit: 10
          }
          //重新加载数据
          warehouseUserList(this.userQuery).then((res) => {
            this.userData = res.data.list;
            this.userTotal = res.data.total;
          }).catch((error) => {
            this.userData = [];
            this.userTotal = 0;
          });
        } else {
          this.$message.error(res.message);
        }
      }).catch((error) => {
        this.$message.error("添加失败");
      });
    },


    //移除仓库关联用户
    rmInvUser() {
      this.$confirm("确定移除该关联用户信息?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.loading = true;
        })
        .catch(() => {
        });
    },

    relBusttype(row) {
      this.curSeleUser = row;
      this.relBusUserVisile = true;
    },

    cancelRelBusDiaolog() {
      this.relBusUserVisile = false;
      this.getUserBusTypeList(1);
    },


    selsectBussinessType() {
      var busQuery = {
        code: this.currentCode,
        page: 1,
        limit: 50
      }
      warehouseBussinessTypeList(busQuery).then((res) => {
        this.userBussinessTypeList = res.data.list;
      }).catch((error) => {
        this.$message.error("单据类型数据加载失败")
      });
    },


    delWarehouseBussinessType(id) {
      let params = {id: id};
      deleteWarehouseBussinessType(params).then((res) => {
        if (res.code == 20000) {
          this.$message.success("已移除");
          this.bussinessTypeData = [];
          this.selectWhouseBussinessType();
          var busQuerys = {
            code: this.currentCode,
            page: 1,
            limit: 10
          }
          warehouseBussinessTypeList(busQuerys).then((res) => {
            this.bussinessTypeData = res.data.list;
          }).catch((error) => {
            this.$message.error("单据类型数据加载失败")
          });

        } else {
          this.$message.error(res.message);
        }
      }).catch((error) => {
        this.$message.error("移除失败");
      })
    },

    addBussinessType(row) {
      var action = [];
      for (var i = 0; i < this.userBussinessTypeList.length; i++) {
        action.push(this.userBussinessTypeList[i].action);
      }
      this.bussinessTypeFormVisible = true;
      this.bussinessTypeQuery.page = 1;
      this.getBussinessType(1, action);
    },
    getBussinessType(val, obj) {
      if (val != null) {
        this.bussinessTypeQuery.page = val;
      }
      if (obj != undefined) {
        var action = obj.toString();
        this.bussinessTypeQuery.ids = action;
      }

      this.bussinessTypeQuery.code = this.busQuery.code;
      getJoinBussinessType(this.bussinessTypeQuery).then((res) => {
        this.selectBussinessTypeList = [];
        this.bussinessTypeList = res.data.list;
        this.bussinessTypeTotal = res.data.total;
        var that = this;
        that.$nextTick(() => {
          if (that.$refs.typeList) {
            that.$refs.typeList.clearSelection();
          }
          that.bussinessTypeList.forEach(row => {
            if (row.checkSelect == true) {
              that.$refs.typeList.toggleRowSelection(row, true);
            }
          });
        });
      }).catch((error) => {
      });
    },

    invSpaceManage(row) {
      this.currentInvInfo = {
        invStorageCode: row.parentId,
        invWarehouseCode: row.code
      };
    },

    handleSubForm(data, formName) {
      this.subFromName = formName;

      if (formName === "edit") {
        this.subData = JSON.parse(JSON.stringify(data));
      } else if (formName === "add") {
        this.subData = {};
        this.subData.parentId = data.code;
      }
      ;
      this.subFormVisible = true;
      this.getSubThrsysDetailData();
    },

    getSubThrsysDetailData() {
      let params = {
        id: this.subData.code,
      };
      getSubThrsysDetail(params)
        .then((response) => {
          this.loading = false;
          this.sysSubList = response.data.list || [];
        })
        .catch(() => {
          this.loading = false;
          this.sysSubList = [];
        });
    },

    // 隐藏表单
    hideForm() {
      // 更改值
      this.formVisible = false;
      this.subFormVisible = false;
      // this.loadSubData(this.currentCode);
      return true;
    },

  },
  mounted() {
  },
  components: {
    relBusUserDialog,
    invSpaceManage
  },
  created() {
    this.getList();
    this.getSyncConfig();
  }
};
</script>

<style type="text/scss" lang="scss">

</style>