<template>
  <a @click="showCreateDialog" :class="{'integral-create-application-btn':true}">

<el-button type="primary" plain v-if="btn_type == 1">固定积分</el-button>
    <el-dialog
      append-to-body
      title="固定积分"
      :visible.sync="dialogCreateVisible"
      :close-on-click-modal="false"
      @open="initialCreateDialog"
      width="650px">


      <el-scrollbar wrap-class="column-wrapper scrollable-items-container" :native="false" style="height: 300px;">








        <el-form  @submit.native.prevent>
          <el-form-item v-for="(val,index) in list" :key="index" :label="val.name" label-width="100px">

            <el-checkbox-group v-model="val.checked" :disabled="true">
              <el-checkbox v-for="i in val.item" :label="i.id" :key="i.id">{{i.content}}</el-checkbox>
            </el-checkbox-group>

          </el-form-item>


</el-form>





      </el-scrollbar>
      <div slot="footer" class="dialog-footer" v-if="false">
        <el-button @click="dialogCreateVisible = false">取 消</el-button>
        <el-button type="primary" @click="submitCreateForm">确 定</el-button>
      </div>
    </el-dialog>
    <div class="card-panel" v-if="btn_type==0">
      <div class="tpzs2"></div>
      <div class="card-panel-description">
        <div class="card-panel-text">固定积分</div>
        <div class="card-panel-text2">每月固定加分项</div>
      </div>
    </div>
  </a>
</template>
<script>
  export default {
    props: {
      btn_type: {
        type: Number,
        default: 0
      },
    },
    data(){
      return {
        dialogCreateVisible:false,
        list:[]
      }
    },
    created(){
      this.get_rules()
    },
    methods: {
      showCreateDialog(){
        this.dialogCreateVisible = true
        this.get_rules()
      },
      initialCreateDialog(){},
      submitCreateForm(){},
      get_rules(){
        let self = this
        this.$http('get','/integral.php/ajax_request_common/get_fixed_rule').then((ret)=>{
          self.list = ret.data.data
        })
      }
    }
  }
</script>

<style>


  .integral-create-application-btn  .tpzs2 {
    margin: 0 auto;
    width: 40px;
    height: 40px;
    background-image: url(/images/jfsq.png);
    background-size: 100%;
  }
  .integral-create-application-btn .card-panel-description {
    width: 100%;
    text-align: center;
    color:#666;
  }
  .integral-create-application-btn .card-panel-text {
    line-height: 40px;
    font-size: 20px;
    font-weight: bold;
  }

  .integral-create-application-btn .card-panel-text2 {
    font-size: 14px;
    line-height: 20px;
    color: rgba(102, 102, 102, 1);
  }

</style>
