<template>
  <div class="rule_category_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>
          <van-field v-model="data.name" label="分类名称" name="名称" placeholder="请输入名称" v-validate="'required'" required />
        </van-cell-group>
        <van-cell-group>
          <CategorySelectorCell title="选择父级分类" v-model="rule_cate" :max="2" :multi="false"></CategorySelectorCell>
        </van-cell-group>
      </scroller>
    </div>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import CategorySelectorCell from '@/components/common/CategorySelectorCell'
  export default {
    name: "rule_category_add",
    components: {
      CategorySelectorCell
    },
    data(){
      return {
        data: {
          name: '',
          pid: 0
        },
        rule_cate: [],
      }
    },
    watch: {
      rule_cate(val){
        if(val.length > 0){
          this.data.pid = val[0].id
        }else{
          this.data.pid = 0
        }
      }
    },
    methods: {
      data_verify(){
        let self = this
        console.log(self.data.rule_list)
        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
        self.send_loading = true
        self.$toast.loading({
          message: '正在处理'
        })
        request('post','/api/integral/rule',self.data).then(res => {
          self.send_loading = false
          self.$toast.clear()
          self.$toast('创建成功')
          setTimeout(() => {
            self.$keep_alive_update('add_item_info', {})
            self.$route_back()
          }, 500)
        }).catch(e => {
          self.send_loading = false
          self.$toast.clear()
        })
      }
    },
    created(){
      if (this.$route.query.rule_id) {
        this.$nextTick(() => {
          this.rule_cate = [{id: this.$route.query.rule_id*1, name: this.$route.query.rule_name}]
        })
      }
    }
  }
</script>
<style scoped>
  .body_com{height: calc(100% - 0.92rem); position: relative;}
</style>
