baozhida-deliver-medicine/src/views/IceCreamFreezer/IceTracingManagement.vue

<template>
  <!-- 冰排追溯管理 -->
  <div>
    <actionBar :operateList="operateList" :formList="formList" :ruleForm="searchRuleForm" @openModel="openModel"
      @searchProtocol="searchProtocol" @handleScroll="handleScroll"></actionBar>
    <div class="card_content">
      <!-- 表单 -->
      <tables :tableList="tableList" :tableData="tableData" @buttonData="buttonData"></tables>
      <!-- 分页 -->
      <div v-if="Total">
        <pagination :total="Total" :currentPage="Pagination.PageIndex" @changeSize="changeSize"
          @changeCurrent="changeCurrent">
        </pagination>
      </div>
    </div>
    <!-- 历史记录 -->
    <div class="card_history">
      <el-dialog top="5vh" title="历史记录" :visible.sync="historyVisible" width="90%" :close-on-click-modal="false"
        @close="closeHistory">
        <tables :historyFlag="true" :tableList="historyList" :tableData="historyData" @buttonData="historyButton">
        </tables>
        <!-- 分页 -->
        <div v-if="historyTotal">
          <pagination :total="historyTotal" :currentPage="historyPagination.PageIndex" @changeSize="historySize"
            @changeCurrent="historyCurrent">
          </pagination>
        </div>
        <el-dialog width="500px" title="编辑" :visible.sync="innerVisible" append-to-body :close-on-click-modal="false"
          @close="closeNested">
          <forms ref="editRules" :formNewList="editRuleList" :ruleForm="editRuleForm" :iceBank="true" labelWidth="100px"
            @handleScroll="handleScroll" @remoteMethod="remoteMethod" :key="Math.random()"></forms>
          <div slot="footer" class="dialog-footer">
            <el-button @click="innerVisible = false">取消</el-button>
            <el-button type="primary" @click="submit">提交</el-button>
          </div>
        </el-dialog>
      </el-dialog>
    </div>
    <!-- 出入库 -->
    <el-dialog :title="staffTitle" :visible.sync="staffDialogVisible" width="600px" :close-on-click-modal="false"
      @close="closeDialog">
      <forms ref="childRules" :formNewList="formRuleList" :ruleForm="ruleForm" :iceTracing="true" :iceBank="true"
        labelWidth="100px" @handleScroll="handleScroll" @remoteMethod="remoteMethod">
      </forms>
      <span slot="footer" class="dialog-footer" v-if="operationType != 'logs'">
        <el-button plain @click="staffDialogVisible = false">取 消</el-button>
        <el-button type="primary" :loading="confirmLoading" @click="handleAdd">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
  import {
    getIceRaftNewest,
    iceraftIn,
    iceraftOut,
    getIceRaftRecord,
    putIceRaftRecord,
    delIceRaftRecord
  } from '@/api/iceRaft'
  import {
    getIcelocker,
  } from '@/api/refrigerator'
  import {
    getCoolerBox
  } from '@/api/incubator.js'
  import actionBar from '@/components/actionBar'
  import tables from '@/components/tables'
  import pagination from '@/components/pagination'
  import forms from '@/components/forms'
  import {
    employee,
    historyRecord,
    iceRaftRules,
    freezerRules,
    editRules
  } from "./iceRaft.js";
  export default {
    name: 'IceManagement',
    components: {
      actionBar,
      tables,
      pagination,
      forms
    },
    data() {
      return {
        operateList: [{
          type: 'come',
          title: '入库',
        }, {
          type: 'goOut',
          title: '出库',
        }],
        formList: [{
          type: 'input',
          label: '编号',
          field: 'code',
          placeholder: '请输入编号',
        }, {
          type: 'select',
          label: '状态',
          field: 'status',
          placeholder: '请选择状态',
          options: [{
            bgcolor: '#606266',
            label: '未入库',
            value: '0',
          }, {
            bgcolor: '#409EFF',
            label: '冷冻中',
            value: '1',
          }, {
            bgcolor: '#67C23A',
            label: '待使用',
            value: '2',
          }, {
            bgcolor: '#E6A23C',
            label: '使用中',
            value: '3',
          }, {
            bgcolor: '#909399',
            label: '已结束',
            value: '4',
          }]
        }, {
          type: 'select',
          label: '冷冻柜',
          field: 'iceLockerId',
          placeholder: '请选择冷冻柜',
          options: []
        }, {
          type: 'select',
          label: '保温箱',
          field: 'coolerBoxId',
          placeholder: '请选择保温箱',
          options: []
        }, ],
        searchRuleForm: {
          code: '',
          status: '',
          iceLockerId: null,
          coolerBoxId: null,
        },
        searchValue: {},
        tableList: employee(),
        tableData: [],
        Total: 0,
        Pagination: {
          PageIndex: 1,
          PageSize: 10,
        },
        // 历史记录
        historyList: historyRecord(),
        historyData: [],
        historyTotal: 0,
        historyPagination: {
          PageIndex: 1,
          PageSize: 10,
        },
        operationType: '',
        staffTitle: '添加',
        staffDialogVisible: false,
        formRuleList: {},
        ruleForm: {
          iceLockerId: '',
          freezeClaim: '',
          coolerBoxId: '',
          code: [],
        },
        confirmLoading: false,
        historyVisible: false,

        page: 1,
        staffName: '',
        limitNo: true,
        limitNoil: true,
        eventSource: null,
        timer: null, //定时器名称
        iceRaftId: null,

        innerVisible: false,
        editRuleList: {},
        editRuleForm: {
          code: '',
          status: '',
          inStorageTime: '',
          outStorageTime: '',
          freezeClaim: '',
          iceLockerId: '',
          coolerBoxId: '',
        },
        iceRaftCode: '',
        coldCupboard: {
          field: 'iceLockerId',
          label: '冷冻柜',
          placeholder: '请选择冷冻柜',
          type: 'searchSelect',
          colWidth: 24,
          multiple: false,
          rules: [{
            required: true,
            message: '请选择冷冻柜',
            trigger: 'blur'
          }],
          options: [],
        },
        thermostat: {
          field: 'coolerBoxId',
          label: '保温箱',
          placeholder: '请选择保温箱',
          type: 'searchSelect',
          colWidth: 24,
          rules: [{
            required: true,
            message: '请选择保温箱',
            trigger: 'blur'
          }],
          options: [],
        }
      }
    },
    beforeDestroy() {
      clearInterval(this.timer); // 清除定时器
      this.timer = null;
    },
    mounted() {
      this.getList()
      this.getFreezer()
      this.getIncubator()
    },
    methods: {
      // 搜索
      searchProtocol(value) {
        this.Pagination.PageIndex = 1
        this.searchValue = value
        this.getList()
      },
      // 获取冰排列表
      getList() {
        var params = {
          page: this.Pagination.PageIndex,
          pageSize: this.Pagination.PageSize,
          ...this.searchValue
        }
        getIceRaftNewest(params).then(res => {
          if (res.code == 200) {
            this.tableData = res.data.list
            this.Total = res.data.count
            this.timer = setTimeout(() => {
              this.getList();
            }, 60000)
          }
        })
      },
      // 弹窗表单添加
      handleAdd() {
        let flag = this.$refs['childRules'].validateForm();
        if (flag) {
          const params = {
            ...this.ruleForm,
          }
          if (this.operationType == 'come') {
            delete params.coolerBoxId
            params.iceLockerId = Number(params.iceLockerId)
            params.freezeClaim = Number(params.freezeClaim)
            iceraftIn(params).then(res => {
              if (res.code == 200) {
                this.$message({
                  message: res.msg,
                  type: 'success'
                });
                this.staffDialogVisible = false
                this.getList()
              }
            })
          } else if (this.operationType == 'goOut') {
            delete params.iceLockerId
            delete params.freezeClaim
            params.coolerBoxId = Number(params.coolerBoxId)
            iceraftOut(params).then(res => {
              if (res.code == 200) {
                this.$message({
                  message: res.msg,
                  type: 'success'
                });
                this.staffDialogVisible = false
                this.getList()
              }
            })
          }
        } else {
          this.$message.error('表单信息不完整，请继续填写完整');
        }
      },
      openModel(type) {
        this.operationType = type
        this.staffDialogVisible = true
        this.page = 1
        if (type == 'come') {
          this.staffTitle = '入库'
          this.formRuleList = iceRaftRules()
          this.coldCupboard.options = []
          this.formRuleList.unshift(this.coldCupboard)
          this.limitNo = true
          this.getFreezer()
        } else if (type == 'goOut') {
          this.staffTitle = '出库'
          this.formRuleList = freezerRules()
          this.thermostat.options = []
          this.formRuleList.unshift(this.thermostat)
          this.limitNoil = true
          this.getIncubator()
        }
        this.$forceUpdate()
      },
      // 重置冷冻柜、保温箱
      resetSelect() {
        this.page = 1
        this.limitNo = true
        this.limitNoil = true
        this.staffName = ''
      },
      // 触底事件
      handleScroll(type) {
        if (this.operationType == 'come') {
          if (this.limitNo) {
            this.getFreezer()
          }
        } else if (this.operationType == 'goOut') {
          if (this.limitNoil) {
            this.getIncubator()
          }
        } else if (this.operationType == 'edit') {
          if (this.deposit) {
            if (this.limitNo) {
              this.getFreezer()
            }
          } else {
            if (this.limitNoil) {
              this.getIncubator()
            }
          }
        } else {
          if (type == 'iceLockerId' && this.limitNo) {
            this.getFreezer()
          } else if (type == 'coolerBoxId' && this.limitNoil) {
            this.getIncubator()
          }
        }
      },
      // 搜索
      remoteMethod(value) {
        this.resetSelect()
        this.staffName = value
        if (this.operationType == 'edit') {
          this.editRuleList.forEach(item => {
            if (item.type == 'searchSelect') {
              item.options = []
            }
          })
          if (this.deposit) {
            this.getFreezer()
          } else {
            this.getIncubator()
          }
        } else {
          if (this.operationType == 'come') {
            this.formRuleList.forEach(item => {
              if (item.type == 'searchSelect') {
                item.options = []
              }
            })
            this.getFreezer()
          } else if (this.operationType == 'goOut') {
            this.getIncubator()
          }
        }
      },
      // 获取冷冻柜列表
      getFreezer() {
        let arrList = []
        let params = {
          page: this.page,
          pageSize: 10,
          status: '2',
          name: this.staffName,
        }
        getIcelocker(params).then(res => {
          if (res.code == 200) {
            let arr = res.data.list
            let arrList = []
            arr.forEach(item1 => {
              var arrData = {
                label: null,
                value: null,
              }
              arrData.label = item1.name
              arrData.value = item1.id
              arrList.push(arrData)
            })
            if (this.limitNo == true) {
              if (this.operationType != '') {
                if (this.operationType == 'come' || this.operationType == 'goOut') {
                  this.formRuleList.forEach(item => {
                    if (item.type == 'searchSelect') {
                      item.options = item.options.concat(arrList)
                    }
                  })
                } else if (this.operationType == 'edit') {
                  this.editRuleList.forEach(item => {
                    if (item.type == 'searchSelect') {
                      item.options = item.options.concat(arrList)
                    }
                  })
                }
              } else {
                this.formList.forEach(item => {
                  if (item.field == 'iceLockerId') {
                    item.options = item.options.concat(arrList)
                  }
                })
              }
            }
            if (arrList.length >= 10) {
              this.page = ++this.page;
            } else {
              // 已经没数据了 不需要增加数据
              this.limitNo = false;
            }
          }
        })
      },
      // 获取保温箱列表
      getIncubator() {
        let arrList = []
        let params = {
          page: this.page,
          pageSize: 10,
          status: '2',
          name: this.staffName,
        }
        getCoolerBox(params).then(res => {
          if (res.code == 200) {
            let arr = res.data.list
            let arrList = []
            arr.forEach(item1 => {
              var arrData = {
                label: null,
                value: null,
              }
              arrData.label = item1.name
              arrData.value = item1.id
              arrList.push(arrData)
            })
            if (this.limitNoil == true) {
              if (this.operationType != '') {
                if (this.operationType == 'come' || this.operationType == 'goOut') {
                  this.formRuleList.forEach(item => {
                    if (item.type == 'searchSelect') {
                      item.options = item.options.concat(arrList)
                    }
                  })
                } else if (this.operationType == 'edit') {
                  this.editRuleList.forEach(item => {
                    if (item.type == 'searchSelect') {
                      item.options = item.options.concat(arrList)
                    }
                  })
                }
              } else {
                this.formList.forEach(item => {
                  if (item.field == 'coolerBoxId') {
                    item.options = item.options.concat(arrList)
                  }
                })
              }
              // this.thermostat.options = this.thermostat.options.concat(arrList)
            }
            if (arrList.length >= 10) {
              this.page = ++this.page;
            } else {
              // 已经没数据了 不需要增加数据
              this.limitNoil = false;
            }
          }
        })
      },
      // 冰排列表
      buttonData(row, type) {
        this.operationType = type
        this.iceRaftId = row.id
        this.iceRaftCode = row.code
        if (type == 'logs') {
          this.historyVisible = true
          this.getHistory()
        }
      },
      // 获取历史记录列表
      getHistory(iceRaftId) {
        var params = {
          page: this.historyPagination.PageIndex,
          pageSize: this.historyPagination.PageSize,
          iceRaftId: this.iceRaftId,
          // ...this.searchValue
        }
        getIceRaftRecord(params).then(res => {
          if (res.code == 200) {
            this.historyData = res.data.list
            this.historyTotal = res.data.count
          }
        })
      },
      // 历史记录操作
      historyButton(row, type) {
        this.operationType = type
        this.limitNo = true
        if (type == 'edit') {
          this.innerVisible = true
          this.page = 1
          this.editRuleList = editRules()
          if (row.outStorageTime == '') {
            this.deposit = true
            this.getFreezer()
            this.editRuleList.push(this.coldCupboard)
            // 冷冻柜
            this.editRuleForm.iceLockerId = String(row.iceLockerId)
          } else {
            this.deposit = false
            this.getIncubator()
            this.editRuleList.push(this.thermostat)
            // 保温箱
            this.editRuleForm.coolerBoxId = String(row.coolerBoxId)
          }
          this.editRuleForm.id = row.id
          this.editRuleForm.code = this.iceRaftCode
          this.editRuleForm.status = row.status
          this.editRuleForm.inStorageTime = row.inStorageTime
          this.editRuleForm.outStorageTime = row.outStorageTime
          this.editRuleForm.freezeClaim = row.freezeClaim
          if (row.status == '3') {
            this.editRuleList.forEach(item => {
              if (item.field == 'freezeClaim') {
                item.disabled = true
              }
            })
          }
        } else if (type == 'del') {
          this.delHistory(row.id)
        }
      },
      // 编辑历史记录提交
      submit() {
        let flag = this.$refs['editRules'].validateForm();
        if (flag) {
          this.$confirm('确定修改该冰排信息吗, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            let param = {
              id: '',
              iceLockerId: '',
              coolerBoxId: '',
              freezeClaim: '',
            }
            param.id = this.editRuleForm.id
            param.iceLockerId = Number(this.editRuleForm.iceLockerId)
            param.coolerBoxId = Number(this.editRuleForm.coolerBoxId)
            param.freezeClaim = Number(this.editRuleForm.freezeClaim)
            if (this.editRuleForm.outStorageTime == '') {
              delete param.coolerBoxId
            } else {
              delete param.iceLockerId
            }
            putIceRaftRecord(param).then(res => {
              if (res.code == 200) {
                this.innerVisible = false
                this.$message({
                  type: 'success',
                  message: res.msg
                });
                this.getHistory()
              }
            })
          }).catch(() => {
            // console.log('取消修改')
          });
        } else {
          this.$message.error('表单信息不完整，请继续填写完整');
        }
      },
      // 删除历史记录
      delHistory(id) {
        this.$confirm('确定删除该冰排信息吗, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          delIceRaftRecord({
            id: id
          }).then(res => {
            if (res.code == 200) {
              this.$message({
                message: '删除成功，请重新入库该冰排！',
                type: 'warning'
              });
              const precisePage = Math.ceil((this.historyTotal - 1) / this.historyPagination.PageSize)
              this.historyPagination.PageIndex = this.historyPagination.PageIndex > precisePage ? precisePage : this
                .historyPagination.PageIndex
              this.historyPagination.PageIndex = this.historyPagination.PageIndex < 1 ? 1 : this.historyPagination.PageIndex
              this.getHistory()
              this.getList()
            }
          })
        }).catch(() => {
          // console.log('已取消删除')
        });
      },
      changeSize(val) {
        this.Pagination.PageSize = val
        this.getList()
      },
      changeCurrent(val) {
        this.Pagination.PageIndex = val
        this.getList()
      },
      // 历史记录分页
      historySize(val) {
        this.historyPagination.PageSize = val
        this.getHistory()
      },
      historyCurrent(val) {
        this.historyPagination.PageIndex = val
        this.getHistory()
      },
      // 关闭历史记录
      closeHistory() {
        this.historyPagination.PageIndex = 1
        this.historyVisible = false
        this.getList()
      },
      // 嵌套弹窗
      closeNested() {
        this.staffName = ''
        this.editRuleList.forEach(item => {
          if (item.type == 'searchSelect') {
            item.options = []
          }
        })
      },
      // 清空表单
      closeDialog() {
        this.resetSelect()
        this.ruleForm.code = []
        this.$refs.childRules.resetCheck();
        this.coldCupboard.options = []
        this.thermostat.options = []
      },
    }
  }
</script>

<style lang="scss" scoped>
</style>