<template>
  <div>
    <van-nav-bar title="记分记录" left-text="返回" @click-left="$route_back" left-arrow></van-nav-bar>
    <div class="body_com has_header integral_noteone_box">
      <scroller>
        <van-cell-group>
          <van-cell>
            <Mtextarea class="integral_noteone_des" v-model="process.remark" placeholder="说点什么(必填)" :text_max="90"></Mtextarea>
          </van-cell>
        </van-cell-group>

        <div class="integral_noteone_score">
          <span>任务执行过程可以记录奖分和扣分，任务完成后可提供评分参考</span>
          <!-- <span>觉得<span> {{employee_name}} </span>今日工作表现不错，加分鼓励！</span>
          <span>分数在审批时作为参考</span> -->
        </div>
        <van-cell-group>
          <!-- <div class="integral_noteone_choose">
            <span class="title">计分</span>
            <span style="margin-right: 0.16rem" :class="isActive?'active':''" @click="del_class">加</span>
            <span :class="isActive?'':'active'" @click="add_class">减</span>
          </div> -->
           <NumberInput
              v-model="process.point"
              title="计分"
              name="计分"
            ></NumberInput>
        </van-cell-group>
        <div style="padding:0.32rem;">
          <van-button size="large" @click="data_verify" type="info" >提交</van-button>
        </div>
      </scroller>
    </div>
  </div>
</template>
<script>
import request from '@/utils/request'
import Mtextarea from '@/components/common/Mtextarea'
import moment from 'moment'
import NumberInput from '@/components/common/NumberInput'
export default {
  name: 'integral_noteone',
  components: {
    Mtextarea,
    NumberInput
  },
  data () {
    return {
      activeNames: ['1'],
      intergral_record: 0,
      data: {
        work_id: 0,
        process: []
      },
      employee_name: '',
      process: {
        recorder_id: this.$store.getters.user_info.id,
        recorder: this.$store.getters.user_info.name,
        remark: '',
        point: 0,
        img_url: this.$store.getters.user_info.img_url,
        time: moment().format('YYYY-MM-DD HH:mm')
      },
      radio: '',
      isActive: true
    }
  },
  methods: {
    add_class () {
      this.isActive = false
    },
    del_class () {
      this.isActive = true
    },
    show_rule_selector () {
      this.show_dept_selector = true
    },
    data_verify () {
      let self = this
      self.$validator.validateAll().then(result => {
        if (!result) {
          self.$notify({ type: 'danger', message: self.$validator.errors.items[0].msg })
        } else {
          self.send()
        }
      })
    },
    send () {
      let self = this
      if (self.process.point == 0) {
        self.$toast('请输入分数')
        return
      }
      self.send_loading = true
      self.$toast.loading({
        message: '正在处理'
      })
      let _data = []
      let data = JSON.parse(localStorage.getItem('task_process_array'))
      let process = JSON.parse(JSON.stringify(this.process))
      this.isActive === false ? process.point = process.point * -1 : process.point = process.point * 1
      _data.push(process)

      for (let i in data) {
        _data.push(data[i])
      }
      self.data.process = _data
      request('post','/api/integral/work', self.data).then(res => {
        if (res.data.code == 1) {
          self.send_loading = false
          self.$toast.clear()
          self.$toast.success(res.data.msg)
          // 通知详情更新进度
          self.$keep_alive_update('update_task_detail', self.data)
          setTimeout(() => {
            self.$route_back()
          }, 500)
        } else {
          self.$toast(res.data.msg)
        }
      }).catch(e => {
        self.send_loading = false
        self.$toast.clear()
      })
    }
  },
  created () {
    if (this.$route.query.work_id) {
      this.data.work_id = this.$route.query.work_id
    }
    if (this.$route.query.employee_name) {
      this.employee_name = this.$route.query.employee_name
    }
  }
}
</script>
<style scoped>
  .body_com{height: calc(100% - 0.92rem); position: relative;}
  .integral_noteone_box .intergral_record{
    margin-top:0.2rem;
  }
  .integral_noteone_box .intergral_record /deep/ .van-cell{
    padding: 0.32rem !important;
  }
  .integral_noteone_box .intergral_record /deep/ .van-cell__right-icon{
    color:#E4E7ED;
  }
  .integral_noteone_box .integral_noteone_score{
    padding:0.28rem 0.32rem 0;
    font-size:0.28rem;
    color:#909399;
  }
  .integral_noteone_box .integral_noteone_choose{
    position:relative;
    display:block;
    padding:0.32rem;
  }
  .integral_noteone_box .integral_noteone_choose .title{
    display: inline-block;
    text-align: left;
    width:0.76rem;
    font-size:0.36rem;
    padding-right:0.9rem;
    color:#303133;
    border:none;
   }
  .integral_noteone_box .integral_noteone_choose span{
    position: relative;
    display: inline-block;
    text-align: center;
    width:1.08rem;
    height:0.52rem;
    font-size:0.32rem;
    color:#C0C4CC;
    border:0.02rem #C0C4CC solid;
    border-radius:0.28rem;
  }
  .integral_noteone_box .integral_noteone_choose .active{
    color:#26A2FF;
    border:0.02rem #26A2FF solid;
  }
</style>
