<template>
  <!-- 充装枪管理 -->
  <div>
    <actionBar menuTitle="充装枪管理" :operateList="operateList" :formList="formList" :ruleForm="searchRuleForm"
      @openModel="openModel" @searchProtocol="searchProtocol"></actionBar>
    <tables :key="Math.random()" :suspension="false" :tableList="tableList" :tableData="tableData"
      @buttonData="buttonData"></tables>
    <!-- 分页 -->
    <div class="paging_bottom" v-if="Total">
      <pagination :total="Total" :currentPage="Pagination.PageIndex" @changeSize="changeSize"
        @changeCurrent="changeCurrent">
      </pagination>
    </div>
    <el-dialog :title="staffTitle" :visible.sync="staffDialogVisible" width="600px" :close-on-click-modal="false"
      @close="closeDialog">
      <forms ref="childRules" :formNewList="formRuleList" :ruleForm="ruleForm" labelWidth="100px"></forms>
      <span slot="footer" class="dialog-footer">
        <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 {
    getUser
  } from '@/api/user'
  import {
    getFillGun,
    getFillGunDetails,
    addFillGun,
    putFillGun,
    delFillGun
  } from '@/api/filling'
  import actionBar from '@/components/actionBar'
  import tables from '@/components/tables'
  import pagination from '@/components/pagination'
  import forms from '@/components/forms'
  import {
    formRules,
    employee
  } from "./fillingGun.js";
  export default {
    components: {
      actionBar,
      tables,
      pagination,
      forms
    },
    data() {
      return {
        staffTitle: '添加',
        staffDialogVisible: false,
        Pagination: {
          PageIndex: 1,
          PageSize: 10,
        },
        operateList: [{
          type: 'add',
          title: '添加',
          icon: 'el-icon-plus',
        }],
        formList: [ {
          type: 'input',
          label: '充装枪编号',
          field: 'gunCode',
          placeholder: '请输入充装枪编号',
        },{
          type: 'input',
          label: '扫描枪编号',
          field: 'scanGunCode',
          placeholder: '请输入扫描枪编号',
        }, {
          type: 'select',
          label: '充装人员',
          field: 'personCode',
          placeholder: '充装人员',
          options: [],
        }],
        searchRuleForm: {
          gunCode: '',
          scanGunCode: '',
          personCode: '',
        },
        tableList: employee(),
        tableData: [],
        Total: 0,
        formRuleList: [],
        ruleForm: {},
        operationType: '',
        searchValue: {},
        confirmLoading: false,
      }
    },
    mounted() {
      const dataList = formRules();
      this.formRuleList = dataList;
      this.getList()
    },
    methods: {
      // 搜索
      searchProtocol(value) {
        this.searchValue = value
        this.getList()
      },
      // 获取订单列表
      getList() {
        var params = {
          page: this.Pagination.PageIndex,
          pageSize: this.Pagination.PageSize,
          ...this.searchValue
        }
        getFillGun(params).then(res => {
          // console.log(res,32)
          if (res.code == 200) {
            this.tableData = res.data.list
            this.Total = res.data.count
            this.fillingPersonnel()
          }
        })
      },
      openModel(type) {
        if (type == 'add') {
          this.staffTitle = '添加'
        }
        this.staffDialogVisible = true
      },
      // 添加充装枪
      handleAdd() {
        let flag = this.$refs['childRules'].validateForm();
        if (flag) {
          this.confirmLoading = true
          if (this.operationType == 'edit') {
            this.ruleForm['id'] = this.fillingId
            putFillGun(this.ruleForm).then(res => {
              if (res.code == 200) {
                this.getList()
                this.staffDialogVisible = false
                this.confirmLoading = false
                this.$message({
                  message: res.msg,
                  type: 'success'
                });
              }
            })
          } else {
            addFillGun(this.ruleForm).then(res => {
              if (res.code == 200) {
                this.getList()
                this.staffDialogVisible = false
                this.confirmLoading = false
                this.$message({
                  message: res.msg,
                  type: 'success'
                });
              }
            })
          }
        } else {
          this.$message.error('表单信息不完整，请继续填写完整');
        }
      },
      // 获取充装人员
      fillingPersonnel() {
        getUser({
          userType: 5,
        }).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.nickName
              arrData.value = item1.provUserId
              arrList.push(arrData)
            })
            this.formList.forEach((item, index) => {
              if (item.field == 'personCode') {
                item.options = arrList
              }
            })
            this.formRuleList.forEach(item2 => {
              if (item2.field == 'personCode') {
                item2.options = arrList
              }
            })
            this.tableList.forEach(item3 => {
              if (item3.field == 'personCode') {
                item3.options = arrList
              }
            })
          }
        })
      },
      buttonData(row, type) {
        this.fillingId = row.id
        this.operationType = type
        if (type == 'edit') {
          this.$set(this.ruleForm, 'gunCode', row.gunCode)
          this.$set(this.ruleForm, 'scanGunCode', row.scanGunCode)
          this.$set(this.ruleForm, 'personCode', row.personCode)
          this.$set(this.ruleForm, 'remark', row.remark)
          this.staffDialogVisible = true
          this.staffTitle = '编辑'
        } else if (type == 'del') {
          this.getCancel(row.id)
        }
      },
      // 删除充装枪
      getCancel(ID) {
        this.$confirm('此操作将永久删除该项, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          delFillGun({
            id: ID,
          }).then((res) => {
            if (res.code == 200) {
              this.$message({
                message: res.msg,
                type: 'success'
              });
              this.getList()
            }
          })
        }).catch(() => {
          // console.log('取消')
        });
      },
      changeSize(val) {
        this.Pagination.PageSize = val
        this.getList()
      },
      changeCurrent(val) {
        this.Pagination.PageIndex = val
        this.getList()
      },
      closeDialog() {
        this.ruleForm = {}
        this.$refs.childRules.resetCheck();
      }
    }
  }
</script>

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