<template>
  <div>
    <van-popup class="all_popup" v-model="show" position="right" :style="{ height: '100vh',width: '100vw' }">
      <van-nav-bar :title="title" left-text="返回" @click-left="close" left-arrow></van-nav-bar>
      <div class="body_com has_header">
        <scroller>
          <van-cell-group>
            <van-cell v-for="(item,index) in info.detail" :title="item.key" :value="item.value"></van-cell>
          </van-cell-group>
          <van-cell-group>
            <div class="tip">审批以最高积分为准</div>
            <van-cell class="efficiency_list" :title="info.employee_name" size="large">
              <!-- :label="'月平衡分：'+info.base_point" -->
              <template slot="icon">
                <van-image :src="info.employee_img_url?info.employee_img_url:'static/images/e66f.jpg'" round width="1rem" height="1rem" style="margin-right: 0.12rem;" type="contain"  />
              </template>
              <template slot="title">
                <div class="team_info">
                  <span style="display:block;font-size:0.32rem;font-weight:bold;color:#303133">白忱尔</span>
                  <span style="display:block;font-size:0.28rem;color:#909399;">技术部</span>
                </div>
              </template>
              <template slot="right-icon">
                <div class="team_record">
                  <span style="display:block;font-size:0.32rem;font-weight:bold;color:#303133">120</span>
                  <span style="display:block;font-size:0.28rem;color:#909399;">月平衡分</span>
                </div>
              </template>
            </van-cell>
          </van-cell-group>

          <van-cell-group>
            <van-cell title="积分分类" @click="show_rule = true" required is-link :value="info.rule_name"></van-cell>
            <!-- integral_remark -->
            <van-cell title="选择细则" @click="show_cate = true" required is-link :value="info.item_name"></van-cell>
            <!-- cate_confirm_remark -->
            <div class="cate_tip" v-if="info.item_name">
              <span class="left">{{info.item_name}}</span>
              <span class="right">积分：{{info.point}}</span>
            </div>
          </van-cell-group>
          <van-cell-group>
            <van-field required label="积分" type="text" v-model="info.point" placeholder="请输入积分" />
            <!-- ^[1-9]\d*|-[1-9]\d*$ -->
          </van-cell-group>

          <van-cell-group>
            <EmployeeSelectorCell title="添加审批人" v-model="employee_list" :multi="false"></EmployeeSelectorCell>
          </van-cell-group>
          <div style="padding: 0.32rem">
            <van-button type="primary" block @click="adopt">通过</van-button>
          </div>
        </scroller>
        <!-- 选择规则分类 -->
        <RuleCategorySelector
        :can_select_rule="false"
        :can_select_category="true"
        :multi="false"
        :visible.sync="show_rule"
        @confirm="rule_confirm"/>

        <!-- 选择规则细则 -->
        <RuleCategorySelector
        :can_select_rule="true"
        :can_select_category="false"
        :multi="false"
        :visible.sync="show_cate"
        @confirm="cate_confirm"/>
      </div>
    </van-popup>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import RuleCategorySelector from '@/components/common/RuleCategorySelector'
  import EmployeeSelectorCell from '@/components/common/EmployeeSelectorCell'
  import Vue from 'vue'
  import {Image} from 'vant'
  Vue.use(Image)
  export default {
    // 数据
    props:{
      show: {
        type: Boolean,
        default: false
      },
      info:{
        type: Object,
        default: () => {}
      }
    },
    name: "applicationOne",
    data(){
      return {
        title: '积分审批',
        show_rule: false,
        show_cate: false,
        employee_list: [],
        get_id: this.$route.query.review_id,
        user_info: this.$store.getters.user_info,
        point_power: {},
        remark: ''
      }
    },
    mounted(){

    },
    // 组件
    components: {
      RuleCategorySelector,EmployeeSelectorCell
    },
    // 方法
    methods:{
      // 加载
      showLoading () {
        this.$toast.loading({
          loadingType: "spinner",
          message: '正在处理'
        })
      },
      // 关闭弹窗
      close(){
        this.$emit('update:show', false)
      },
      // 通过
      adopt(){
        let self = this
        self.point_power.point_limit.forEach(v => {
          if(v.pt_id == self.info.pt_id){
           if(parseInt(v.point) < parseInt(self.info.point)){
             if(self.employee_list[0]){ self.sub() }else{
              self.$notify({ type: 'danger', message: '您的积分权限不够，请指定下一个审批人' });
             }
            }else{
              self.sub()
            }
          }
        });
      },
      // 选择规则确认
      rule_confirm(d){
        d.cate.forEach(v => {
          this.info.rule_name = v.name
          this.info.rule_id = v.id
        });
      },
      // 选择细则确认
      cate_confirm(d){
        let max_point , min_point
        d.rule.forEach(v => {
          this.info.item_name = v.remark
          this.info.item_id = v.rule_id
          max_point = v.max_point
          min_point = v.min_point
        });
        if(max_point == min_point){
          this.info.point = max_point
        }
      },
      sub(){
        let self = this
        if(!self.info.item_id){
          self.info.item_id = '0'
        }
        let data = {
          review_id: self.get_id,
          action: "complete",
          rule_id: self.info.rule_id,
          item_id: self.info.item_id,
          point: self.info.point,
          reviewer_id: self.user_info.employee_detail.id,
          remark: self.remark,
          ticket_count: '0'
        }
        self.showLoading()
        request('post','/api/integral/review',data).then((res) => {
          if(res.data.code == 1){
            self.$toast.clear()
            this.$emit('update:adopt', true)
          }else{
            self.$toast.clear()
            self.$toast(res.data.msg)
          }
        }).catch((e) => {
          self.$toast.clear()
        })
      },
      // 获取积分权限
      get_point_power(){
        let self = this
        self.showLoading()
        request('get','/api/integral/employee/limit',{employee_id: self.user_info.employee_detail.id}).then((res) => {
          if(res.data.code == '1'){
            self.point_power = res.data.data
          }else{
            self.$toast(res.data.msg)
          }
        })
      },
      // 获取
    },
    // 生命周期 --- 创建完成
    created() {
      this.get_point_power()
    },
    //
    keep_alive_update: {
      //运用缓存更新方法来完成返回后的更新
      update_demo_list: function (vm, data) {
        for(let i in vm.list){
          if(vm.list[i].id == data.id){
            vm.list[i].name = data.name
          }
        }
      }
    },
  };
</script>
<style scoped>
.body_com{height: calc(100% - 1rem); position: relative;}
.all_popup{
  background-color: rgb(245, 245, 245);
}
.tip{
  color: #303133;
  font-size: .36rem;
  padding: 0 0.32rem;
}
.cate_tip{
  font-size: 0.32rem;
  color: #adadad;
  padding: 0.1rem 0.32rem;
  display: list-item;
}
.cate_tip .left{
  float: left;
}
.cate_tip .right{
  float: right;
}
</style>
