<template>
  <div class="rule_item_add_box">
    <van-nav-bar title="创建规则" left-text="返回" @click-left="$route_back" left-arrow right-text="保存" @click-right="data_verify"></van-nav-bar>
    <div class="body_com has_header">
      <scroller>
        <van-cell-group class="choose">
        <CategorySelectorCell required title="选择分类" v-model="rule_cate" :max="2" :multi="false"></CategorySelectorCell>
        </van-cell-group>
        <van-cell-group>
          <van-cell required>
            <Mtextarea required v-model="item.remark" placeholder="输入规则内容" :text_max="100" :imgs_max="3"></Mtextarea>
          </van-cell>
        </van-cell-group>
        <van-cell-group>
          <van-cell title="分值" class="cell-right-4rem">
            <van-radio-group v-model="item.range_type" direction="horizontal" slot="right-icon">
              <van-radio :name="1">固定分</van-radio>
              <van-radio :name="2">范围分</van-radio>
            </van-radio-group>
          </van-cell>
          <van-field label="固定分值" v-if="item.range_type == 1" v-model="item.min_point" placeholder="输入分值"/>
          <van-field label="最小分值" v-if="item.range_type == 2" v-model="item.min_point" placeholder="输入最小分值"/>
          <van-field label="最大分值" v-if="item.range_type == 2" v-model="item.max_point" placeholder="输入最大分值"/>
        </van-cell-group>
        <van-cell-group>
          <van-cell title="积分类型" class="cell-right-4rem">
            <van-radio-group v-model="item.pt_id" direction="horizontal" slot="right-icon">
              <van-radio v-for="(item, index) in types_list" :name="item.id" :key="index">{{item.name}}</van-radio>
            </van-radio-group>
          </van-cell>
        </van-cell-group>
        <van-cell-group>
          <van-cell title="奖扣周期" class="cell-right-4rem">
            <van-radio-group slot="right-icon" v-model="item.cycle_type" direction="horizontal">
              <van-radio :name="1">关闭</van-radio>
              <van-radio :name="2">开启</van-radio>
            </van-radio-group>
          </van-cell>

          <van-cell title="考勤挂钩" class="cell-right-4rem" v-show="item.cycle_type == 2">
            <van-radio-group slot="right-icon" v-model="item.is_attendance" direction="horizontal">
              <van-radio :name="0">否</van-radio>
              <van-radio :name="1">是</van-radio>
            </van-radio-group>
          </van-cell>
        </van-cell-group>
      </scroller>
    </div>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import Mtextarea from '@/components/common/Mtextarea'
  import CategorySelectorCell from '@/components/common/CategorySelectorCell'
  export default {
    name: "rule_item_add",
    components: {
      Mtextarea, CategorySelectorCell
    },
    data() {
      return {
        data: {
          items: []
        },
        rule_cate: [],
        item: {
          rule_id: 0,
          prize_type: 1,
          range_type: 1,
          min_point: 0,
          max_point: 0,
          remark: '',
          is_attendance: 0,
          cycle_type: 1,
          pt_id: 0,
        },
        send_loading: false,
        types_list: []
      }
    },
    watch: {
      rule_cate(val){
        if(val.length > 0){
          this.item.rule_id = val[0].id
        }else{
          this.item.rule_id = 0
        }
      }
    },
    methods: {
      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.rule_cate.length == 0){
          self.$notify({type: 'danger', message: '请选择分类'});
          return false
        }
        if(self.item.remark == ''){
          self.$notify({type: 'danger', message: '请输入规则内容'});
          return false
        }
        self.data.items = []
        if(self.item.range_type == 1){
          self.item.max_point = self.item.min_point
        }
        self.data.items.push(self.item)
        self.send_loading = true
        self.$toast.loading({
          message: '正在处理'
        })
        request('post','/api/integral/rule/items',self.data).then(res => {
          self.send_loading = false
          self.$toast.clear()
          if (res.data.code == 1) {
            self.$toast('创建成功')
            setTimeout(() => {
              self.$keep_alive_update('add_item_info', {})
              self.$route_back()
            }, 500)

          } else {
            self.$toast(res.data.msg)
          }

        }).catch(e => {
          self.send_loading = false
          self.$toast.clear()
        })
      },
      get_point_types() {
        let self = this
        request('get','/api/integral/types').then(res => {
          if (res.data.code == 1) {
            self.types_list = []
            for (let i in res.data.data.list) {
              if (res.data.data.list[i].code != 'JX') {
                if(res.data.data.list[i].code == 'BF'){
                  self.item.pt_id = res.data.data.list[i].id
                }
                self.types_list.push(res.data.data.list[i])
              }
            }
          }
        }).catch(e => {
        })
      }
    },
    created() {
      if (this.$route.query.rule_id) {
        this.item.rule_id = this.$route.query.rule_id
        this.$nextTick(() => {
          this.rule_cate = [{id: this.item.rule_id*1, name: this.$route.query.rule_name}]
        })

      }
      this.get_point_types()
    }
  }
</script>
<style scoped>
  .body_com {
    height: calc(100% - 0.92rem);
    position: relative;
  }
</style>
