<template>
  <div class="set_basics_box boxMinHeight" v-loading="loading">
    <el-row>
      <el-col :span="16">
        <el-form :model="basics_info" ref="basics_info" :rules="basics_info_rules" label-width="140px">
          <div class="basics_title" style="font-size:18px;color:#303133;padding:0 0 0 32px; margin-bottom: 30px" v-if="!isEntrance">系统设置
          <span class="blue cursor" style="padding-left: 20px;font-size: 14px;" @click="$openUrl(4)">详细说明</span></div>
          <div class="basics_title" style="font-size:18px;color:#303133;padding:0 0 0 32px; margin-bottom: 30px" v-else>基础分、工龄分
            <span class="blue cursor" style="padding-left: 20px;font-size: 14px;" @click="$openUrl(3)">详细说明</span>
          </div>
          <template v-if="isEntrance">
            <el-form-item prop="base_point">
              <template slot="label">
                <span>基础分</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px;">设置分值后，系统将为全部员工自动加上此项基础分；此项基础分仅加一次，计入每个员工的累计总分。</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-input  style="width: 150px;"  v-model.number="basics_info.base_point" min="0" placeholder="请输入基础分分值" type="Number"></el-input>
            </el-form-item>
            <el-form-item prop="service_point">
              <template slot="label">
                <span>工龄分</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">首次加分=员工已在职的月份数*工龄分，未满一个月的不加分；后续加分按已设置的工龄分值每月自动累加</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-input style="width: 150px;" v-model.number="basics_info.service_point" min="0" placeholder="请输入基础分分值" type="Number"></el-input>
            </el-form-item>
          </template>
          <template v-else>
            <el-form-item prop="a2b">
              <template slot="label">
                <span>A分转B分</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">
                    设置后，每奖扣1条A分，额外产生一条分值按比例转换后的B分记录，如设置1A分=10B分时，因表现出色奖10A分的同时，额外奖100B分。
                  </div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <div class="flex-box-ce fontColorA">
                <div>1A分 =</div>
                <div  style="margin: 0 20px;width: 150px;"><el-input v-model.number="basics_info.a2b" min="0" placeholder="请输入基础分分值" type="Number"></el-input></div>
                <div>B分</div>
                <span class="blue cursor" style="padding-left: 20px;font-size: 14px;" @click="$openUrl(17)">为什么要用A分转B分?</span>
              </div>
            </el-form-item>
            <el-form-item prop="rule_limit_check">
              <template slot="label">
                <span>积分审批</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">勾选开启后，根据积分规则制度的奖扣B分、审批积分，均不受权限分限制，可直接提交通过</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.rule_limit_check">规则内不验证权限分</el-checkbox>
<!--              <el-checkbox v-model="basics_info.rule_limit_check">规则内打分免审（仅对B分有效）</el-checkbox>-->
            </el-form-item>
            <el-form-item prop="task_review">
              <template slot="label">
                <span>管理者奖扣</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">系统默认的管理者奖扣目标只包含管理者主动给员工奖扣的积分；开启后，审批员工申请的积分和任务也会计入Ta的奖扣分目标内</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.task_review">审批打分计入管理者奖扣分任务</el-checkbox>
            </el-form-item>
            <el-form-item prop="look_dept_ranking">
              <template slot="label">
                <span>排名展示</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">部门管理员和员工只能看自己所在部门的排名(自定义排名除外)</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.look_dept_ranking">部门管理员和员工只能看自己所在部门的排名(自定义排名除外)</el-checkbox>
            </el-form-item>
            <el-form-item prop="look_dept_ranking">
              <template slot="label">
                <span>修改审批人</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">设置后，默认是录入对象的直接部门上级，不可修改</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.change_reviewer">积分申请时，不允许修改审批人</el-checkbox>
            </el-form-item>
            <el-form-item prop="look_dept_ranking">
              <template slot="label">
                <span>不参与排名人员</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px">
                    ● 阶段排名<br/>
                    ● 累计B分排名<br/>
                    ● 考勤分排名<br/>
                    ● 自定义排名除外<br/>
                    设置成功后，设置中的人员将不在排名中显示
                  </div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <div style="position: relative;width: 400px; cursor: pointer;">
                <el-input style="width: 400px;" auto-complete="off" v-model="employeeName" placeholder="请选择人员"></el-input>
                <div @click="show_employee_selector = true" style=" position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: 9;"></div>
                <EmployeeSelector
                  :selected="employee_selected"
                  :visible.sync="show_employee_selector"
                  @confirm="employee_confirm"
                />
              </div>
            </el-form-item>
            <el-form-item prop="look_dept_ranking">
              <template slot="label">
                <span>必选积分规则</span>
                <el-tooltip placement="top">
                  <div slot="content" style="width: 300px;">开启后，申请积分或奖扣积分时，必须选择积分规则提交，此配置不影响积分审批和任务发布。</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.specified_rule_item" >提交积分时，必须选择积分规则</el-checkbox>
            </el-form-item>
            <el-form-item prop="appeal">
              <template slot="label">
                <span>积分申诉</span>
                <el-tooltip placement="top">
                  <div slot="content">开启可对个人积分提起申诉审批,通过后自动撤销积分事件</div>
                  <span class="tips">?</span>
                </el-tooltip>
              </template>
              <el-checkbox v-model="basics_info.appeal">开启</el-checkbox>
            </el-form-item>
          </template>
          <el-form-item>
            <el-button type="primary" :loading="save_loading" @click="save('basics_info')">保存</el-button>
          </el-form-item>
        </el-form>
      </el-col>
    </el-row>
  </div>
</template>
<script>
  import EmployeeSelector from '@/components/EmployeeSelector';
  import Template from "../../../examine/components/Template.vue";
export default {
  components:{Template, EmployeeSelector},
  data() {
    return {
      loading: false,
      save_loading: false,
      basics_info: {},
      basics_info_rules: {},
      // 录入对象
      employee_id: '',
      employeeName: '',
      employee_list: [],

      employee_selected: { dept: [], employee: [] },
      show_employee_selector: false,
    };
  },
  watch: {},
  props:{
    isEntrance:{
      type:Boolean,
      default:false
    }
  },
  methods: {
    // 选择对象
    employee_confirm(data) {
      this.employeeName='';
      let employee_id=[];
      if (data.employee !== null && data.employee.length != 0) {
        data.employee.forEach(item=>{
          this.employeeName+=item.name+'、';
          employee_id.push(item.id);
        })
        this.employee_selected.employee = data.employee;
      }else{
        this.employee_selected.employee = [];
      }
      this.employee_id=employee_id;
    },
    get_basics() {
      this.loading = true;
      this.$axiosUser('get', '/api/pro/integral/site/config').then(res => {
          if (res.data.code === 1) {
            var resData = res.data.data;
            resData.rule_limit_check = new Number(resData.rule_limit_check).valueOf()  === 0;
            resData.task_review = new Number(resData.task_review).valueOf() === 1;
            resData.look_dept_ranking = new Number(resData.look_dept_ranking).valueOf() === 1;
            resData.change_reviewer = new Number(resData.change_reviewer).valueOf() === 1;
            resData.specified_rule_item = new Number(resData.specified_rule_item).valueOf() === 1;
            resData.appeal = new Number(resData.appeal).valueOf() === 1;
            this.basics_info = resData;
            if(resData.not_in_rank){
              this.employee_selected.employee = resData.not_in_rank;
              this.employeeName='';
              let employee_id=[];
              resData.not_in_rank.forEach(item=>{
                this.employeeName+=item.name+'、';
                employee_id.push(item.id);
              })
              this.employee_id=employee_id;
            }
          }
        }).finally(() => {
          this.loading = false;
        });
    },
    save(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          this.save_loading = true;
          let data = JSON.parse(JSON.stringify(this.basics_info));
          this.basics_info.rule_limit_check ? (data.rule_limit_check = 0) : (data.rule_limit_check = 1);
          this.basics_info.task_review ? (data.task_review = 1) : (data.task_review = 0);
          this.basics_info.look_dept_ranking ? (data.look_dept_ranking = 1) : (data.look_dept_ranking = 0);
          this.basics_info.change_reviewer ? (data.change_reviewer = 1) : (data.change_reviewer = 0);
          this.basics_info.specified_rule_item ? (data.specified_rule_item = 1) : (data.specified_rule_item = 0);
          this.basics_info.appeal ? (data.appeal = 1) : (data.appeal = 0);
          data.not_in_rank=JSON.stringify(this.employee_selected.employee);
          this.$axiosUser('post', '/api/pro/integral/site/config', data, 'v2').then(res => {
              if (res.data.code === 1) {
                this.$message.success(res.data.msg);
              } else {
                this.$message.error(res.data.msg);
              }
          }).finally(() => {
            this.save_loading = false;
            this.$store.dispatch('getUserInfo')
          });
        }
      });
    }
  },
  mounted() {
    this.get_basics();
  }
};
</script>
<style scoped lang="scss">
.set_basics_box {
  padding: 20px;
  background: #fff;
}
/deep/ .el-message--info {
  font-size: 20px;
}
.el-form-item__error {
  left: 50px;
}
.tips {
  background: #409EFF;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}
</style>
