<template>
  <div>
    <div class="query-box appProval">
      <ul>
        <li><span><em>所属公司</em>
					<el-select :disabled="IsParentCompany!=1" v-model="QueryMsg.BranchId" @change="getList()"  >
			            <el-option
                    v-for="item in companyList"
                    :label='item.BName'
                    :value='item.Id'
                    :key='item.Id'>
			            </el-option>
			        </el-select>
				</span></li>
        <li>
          <!-- <input type="button" class="hollowFixedBtn" value="查询" @click="getList()"/> -->
        </li>
      </ul>
    </div>
    <div class="flexOne">
      <div class="approval_title">出勤休假(4)</div>
      <div class="approval_list" v-loading='loading'>
        <div class="approval_item" v-for="(item,index) in dataList">
          <img :src="item.Icon" width="86" style="float: left;margin: 17px 20px 0 0;" />
          <div class="approval_desDiv">
            <p class="tit">{{item.Name}}</p>
            <p class="des" v-html="item.describe"></p>
            <p class="tim">{{item.UpdateTime}}</p>
          </div>
          <div class="approval_fwDiv">
            <p>可见范围</p>
            <p class="updateP">全部可见</p>
          </div>
          <div class="approval_doDiv">
            <p>
              <button v-if='item.Status==1'  class="normalBtn" @click="goUrl('ApprovalProcess',item.Id)">审批流程</button> &nbsp;&nbsp;
              <button v-if='item.Status==1' @click="updateTempStatus(item.Id,item.TemplateType,item.Status)" class="hollowFixedBtn">{{$t('fnc.tingyong')}}</button>
              <button v-if='item.Status==2' @click="updateTempStatus(item.Id,item.TemplateType,item.Status)" class="hollowFixedBtn">{{$t('fnc.qiyong')}}</button>
            </p>
          </div>
        </div>
      </div>

    </div>
  </div>
</template>

<script>
  import {
    getTemplateList
  } from '../../api/administration/administration';
  import {
    getSchoolDropdown //校区下拉
  } from '../../api/school/index'
  export default {
    data() {
      return {
        loading:true,
        //请求数据
        QueryMsg: {
          BranchId: '-1'
        },
        //返回数据
        dataList: [],
        companyList: [],
        IsParentCompany:2
      }
    },
    methods: {
      getList() {
        let describe = ['适用于请假申请，<br/>精确扣减出勤时间，并同步考勤报表', '适用于出差申请，<br/>精确汇总至考勤报表', '适用于外出申请，<br/>精确汇总至考勤报表', '当员工考勤出现缺卡时，可发起补卡审批，<br/>审批通过后考勤报表中的缺卡记录改为正常']
        // this.apipost('WorkFlow_get_GetTemplateList', {BranchId:this.QueryMsg.BranchId}, res => {
        //   if(res.data.resultCode == 1) {
        //     this.loading=false;
        //     this.dataList = res.data.data[0].List;
        //     this.dataList.forEach((item, index) => {
        //       item.describe = describe[index]
        //     })
        //
        //   }
        // }, err => {})
        getTemplateList({BranchId:this.QueryMsg.BranchId}).then(res => {
          if(res.Code == 1) {
            this.dataList = res.Data[0].List;
            this.dataList.forEach((item, index) => {
              item.describe = describe[index]
            })
          }
        }).catch(() => {
        })
      },
      getCompanyList() {
        getSchoolDropdown({}).then(res => {
          if(res.Code == 1) {
            res.Data.forEach(x => {
              var obj = {
                Id: '',
                BName: ''
              }
              obj.Id = x.SId.toString();
              obj.BName = x.SName;
              this.companyList.push(obj);
            })
          }

        }).catch(() => {

        })
      },
      updateTempStatus(id, type, status) {
        if(status == 1) {
          this.$confirm('是否停用?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.apipost('WorkFlow_post_SetTemplate', {
              Id: id,
              TemplateType: type,
              Status: 2,
              BranchId:this.QueryMsg.BranchId
            }, res => {
              if(res.data.resultCode == 1) {
                this.$message.success("已经停用")
                this.getList()
              } else {
                this.$message.error("操作失败")
              }
            }, err => {})
          }).catch(() => {
            this.$message.info('已取消停用')
          });
        }
        if(status == 2) {
          this.$confirm('是否启用?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.apipost('WorkFlow_post_SetTemplate', {
              Id: id,
              TemplateType: type,
              Status: 1,
              BranchId:this.QueryMsg.BranchId
            }, res => {
              if(res.data.resultCode == 1) {
                this.$message.success("启用成功")
                this.getList()
              } else {
                this.$message.error("操作失败")
              }
            }, err => {})
          }).catch(() => {
            this.$message.info('已取消启用')

          });
        }
      },
      goUrl (path,id) {
        this.$router.push({ name: path,query:{"id":id,"Bid":this.QueryMsg.BranchId} })
      }
    },
    mounted() {
      let userInfo = this.getLocalStorage();
      this.QueryMsg.BranchId=userInfo.School_Id.toString();
      let RefBranchId=this.$route.query.Bid;
      if(RefBranchId!=null){
        this.QueryMsg.BranchId=RefBranchId.toString();
      }
      this.getCompanyList();
      this.getList()
    }
  }
</script>

<style>
  @import "../financial/css/cssReset.css";

  .approval_title {
    height: 14px;
    line-height: 14px;
    padding-left: 15px;
    border-left: 3px solid #E95252;
    margin: 30px 0;
  }

  .appProval .el-input__inner{
    height: 34px!important;
  }

  .approval_desDiv {
    float: left;
    width: 450px;
    height: 120px;
    padding: 15px 0;
    border-right: 1px dotted #DCDFE6;
  }

  .approval_item {
    height: 160px;
    padding: 20px;
    background: #fff;
    overflow: auto;
    border-radius: 8px;
    margin-bottom: 10px;
  }

  .approval_item p.tit {
    font-size: 18px;
    color: #333;
  }

  .approval_item p.des {
    font-size: 14px;
    color: #666;
    line-height: 22px;
  }

  .approval_item p.tim {
    font-size: 14px;
    color: #999;
    line-height: 22px;
  }

  .approval_fwDiv {
    float: left;
    width: 520px;
    height: 120px;
    padding: 50px 0;
    border-right: 1px dotted #DCDFE6;
  }

  .approval_fwDiv>p {
    text-align: center;
    font-size: 16px;
    color: #333;
  }

  .approval_fwDiv>p.updateP {
    font-size: 14px;
    color: #666;
    line-height: 24px;
  }

  .approval_doDiv {
    float: left;
    width: 500px;
  }

  .approval_doDiv>p {
    text-align: center;
    line-height: 120px;
  }
</style>
