<template>
  <div class="rule_item_edit_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>
          <van-cell>
            <Mtextarea v-model="item.remark" placeholder="输入规则内容" :text_max="300" :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" class="radio_button" direction="horizontal" slot="right-icon">
              <van-radio class="list" :name="1">固定分</van-radio>
              <van-radio class="list" :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 class="choose">
          <CategorySelectorCell required title="选择分类" v-model="rule_cate" :max="2" :multi="false"></CategorySelectorCell>
        </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" class="radio_button">
              <van-radio v-for="(item, index) in types_list" class="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">
            <template slot="right-icon">
              <van-switch v-model="cycle" size="24" />
            </template>
          </van-cell> 
          -->
          <!-- 
          <van-cell title="考勤挂钩" class="cell-right-4rem" v-show="item.cycle_type == 2">
            <van-radio-group class="radio_button" slot="right-icon" v-model="item.is_attendance" direction="horizontal">
              <van-radio class="list" :name="0">否</van-radio>
              <van-radio class="list" :name="1">是</van-radio>
            </van-radio-group>
          </van-cell> 
          -->
        </van-cell-group>
        <div style="padding:0.32rem;">
          <van-button size="large" @click="del" type="danger">删除</van-button>
        </div>
      </scroller>
    </div>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import Mtextarea from '@/components/common/Mtextarea'
  import CategorySelectorCell from '@/components/common/CategorySelectorCell'
  import Vue from 'vue';
  import { Switch } from 'vant';

  Vue.use(Switch);
  export default {
    name: "rule_item_edit",
    components: {
      Mtextarea, CategorySelectorCell
    },
    data() {
      return {
        data: {
          items: []
        },
        cycle: false,
        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: [],
        id: 0
      }
    },
    watch: {
      cycle(val){
        if(val){
          this.item.cycle_type = 2
        }else{
          this.item.cycle_type = 1
        }
      },
      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()
          }
        })
      },
      del() {
        let self = this
        this.$dialog.confirm({
          title: '删除规则信息',
          message: '确定要删除当前规则信息吗？'
        }).then(() => {
          self.$toast.loading({
            mask: true,
            message: '处理中...'
          })
          request('delete','/api/integral/rule/items',{item_id: self.id}).then((res) => {
            self.$toast.clear()
            if (res.data.code == 1) {
              self.$toast.success('删除成功')
              self.$keep_alive_update('delete_item_info', self.item)
              setTimeout(() => {
                self.$route_back()
              }, 300)
            } else {
              self.$toast(res.data.msg)
            }
          })
        }).catch(() => {
          // on cancel
        })
      },
      send() {
        let self = this
        self.data.items = []
        if(self.item.range_type == 1){
          self.item.max_point = self.item.min_point
        }
        if(self.item.range_type == 1 && self.item.min_point == 0){
          self.$notify({type: 'danger', message: '固定积分必须是个正整数'});
          return false
        }
        
        self.data.items.push(self.item)
        self.send_loading = true
        self.$toast.loading({
          message: '正在处理'
        })
        self.item.item_id = self.item.id
        request('put','/api/integral/rule/items',self.item).then(res => {
          self.send_loading = false
          self.$toast.clear()
          if (res.data.code == 1) {
            self.$toast.success('修改成功')
            self.$keep_alive_update('update_item_info', self.item)
            setTimeout(() => {
              self.$route_back()
            }, 300)
          } else {
            self.$toast(res.data.msg)
          }

        }).catch(e => {
          self.send_loading = false
          self.$toast.clear()
        })
      },
      get_point_types() {
        let self = this
        self.types_list = []
        let list = this.$store.getters.point_types
        for (let i in list) {
          if (list[i].code != 'JX') {
            if(list[i].code == 'BF'){
              self.item.pt_id = list[i].id
            }
            self.types_list.push(list[i])
          }
        }
      }
    },
    created() {
      if (this.$route.query.id) {
        this.id = this.$route.query.id
        this.item = JSON.parse(localStorage.getItem('rule_'+this.id))
        if(this.item.cycle_type == 2){
          this.cycle = true
        }
        if(this.item.rule_id){
          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>
