<template>
  <div class="app-container">
    <el-form inline :model="dataForm">
      <el-form-item>
        <el-select v-model="dataForm.actId" placeholder="请选择活动名" clearable filterable @change="getDataList()">
          <el-option
            v-for="item in actList"
            :key="item.actId"
            :label="item.name"
            :value="item.actId">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-refresh-left" @click="getDataList">搜索</el-button>
      </el-form-item>
      <el-form-item>
        <el-button icon="el-icon-refresh-left" @click="resetSearch">重置</el-button>
      </el-form-item>
      <el-form-item>
        <el-button @click="save" style="float: right">保存</el-button>
      </el-form-item>
    </el-form>
    <el-table :data="dataList" border v-loading="dataListLoading" style="width: 100%;">
      <el-table-column
        prop="branName"
        header-align="center"
        align="center"
        label="承包单位"
        v-if="loginContractorId === 1">
      </el-table-column>
      <el-table-column
        prop="actId"
        header-align="center"
        align="center"
        width="400"
        label="活动名">
        <template slot-scope="scope">
          <span v-if="scope.row.actId === 110">入库审批流程</span>
          <span v-if="scope.row.actId === 120">出库审批流程</span>
          <span v-if="scope.row.actId === 130">货转审批流程</span>
          <span v-if="scope.row.actId === 140">调拨审批流程</span>
          <span v-if="scope.row.actId === 150">计算仓储费审批流程</span>
          <span v-if="scope.row.actId === 210">对账审批流程</span>
          <span v-if="scope.row.actId === 220">收费审批流程</span>
          <span v-if="scope.row.actId === 230">付费审批流程</span>
          <span v-if="scope.row.actId === 310">协议仓储费审批流程</span>
          <span v-if="scope.row.actId === 320">协议计划费审批流程</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="reviewConditions"
        header-align="center"
        align="center"
        width="250"
        label="审核条件">
        <template slot-scope="scope">
          <span v-if="scope.row.reviewConditions === 'O'">
            正常流程
          </span>
          <span v-if="scope.row.reviewConditions === 'I'">
            非正常流程
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="pathId"
        header-align="center"
        align="center"
        label="审核路径">
        <template slot-scope="scope">
          <el-select v-model="scope.row.pathId" placeholder="审核路径" filterable style="width: 100%">
            <el-option
              v-for="item in optionsPathIds"
              :key="item.id"
              :label="item.pathName"
              :value="item.id">
            </el-option>
          </el-select>
        </template>
      </el-table-column>
    </el-table>
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="dataForm.pageNum"
      :limit.sync="dataForm.pageSize"
      @pagination="getDataList"
    />
  </div>
</template>

<script>
import {addCharge,preservation} from '@/api/system/auditConfiguration'
export default {
  data () {
    return {
      dataForm: {
        branchId: this.$store.state.user.loginContractorId,
        actId: null,
        pageNum: 1,
        pageSize: 10,
      },
      total:0,
      dataList: [],
      optionsBranch: [],
      optionsPathIds: [],
      dataListLoading: false,
      loginContractorId: null,
      totalPage: 0,
      actList: [{
        name: '入库', actId: 110
      },{
        name: '出库', actId: 120
      },{
        name: '货转', actId: 130
      },{
        name: '调拨', actId: 140
      },{
        name: '计算仓储费', actId: 150
      },{
        name: '对账', actId: 210
      },{
        name: '收费', actId: 220
      },{
        name: '付费', actId: 230
      },{
        name: '仓储费', actId: 310
      },{
        name: '计划费', actId: 320
      }
      ]
    }
  },
  activated () {

    // this.$http({
    //   url: this.$http.adornUrl('/sys/user/getLoginContractorId'),
    //   method: 'post'
    // }).then(({data}) => {
    //   this.loginContractorId = data.loginContractorId
    //   this.$set(this.dataForm, 'branchId', data.loginContractorId)
    // })


    // this.$http({
    //   url: this.$http.adornUrl('/engineering/bbranchs/selectBranchs'),
    //   method: 'post',
    //   data: ({postAddr: 'audit'})
    // }).then(({data}) => {
    //   if (typeof data.list !== 'undefined' && data.list !== null) {
    //     if (typeof data.list.branchs !== 'undefined' && data.list.branchs !== null) {
    //       this.optionsBranch = data.list.branchs
    //     }
    //   }
    // })
    this.$nextTick(function () {
      this.getDataList()
    })
  },
  methods: {
    // 获取数据列表
    getDataList () {
      console.log(this.dataForm)
      addCharge(this.dataForm).then(data =>{
        console.log(data)
        this.dataList = data.auditPathAct
        this.optionsPathIds = data.auditPath
        this.total = data.count
      })
    },
    // 保存
    save () {
      let formData = new window.FormData()
      formData.append('auditPathsActs', JSON.stringify(this.dataList))
      preservation(formData).then(data =>{
        console.log(data)
        this.$message.success('保存成功');
      })
    },
    // 每页数
    sizeChangeHandle (val) {
      this.dataForm.size = val
      this.dataForm.current = 1
      this.getDataList()
    },
    // 当前页
    currentChangeHandle (val) {
      this.dataForm.current = val
      this.getDataList()
    },
    resetSearch () {
      this.dataForm.actId = null
      this.dataForm.current = 1
      this.dataForm.size = 10
      this.getDataList()
    }
  }
}
</script>
