<template>
  <div>
    <van-cell-group v-if="list.length > 0">
      <div v-if="title" class="tip" slot="title">{{title}}</div>
      <van-field required @input="go" :label="item.name" v-for="(item,index) in list" type="digit" :key="index" v-model="item.point" :placeholder="'请输入'+item.name" >
        <template slot="right-icon" v-if="iconShow">
          <smallTip :icon="icon" class="small_tip" :position="position">
            <slot></slot>
          </smallTip>
        </template>
      </van-field>
    </van-cell-group>
  </div>
</template>
<script>
  import smallTip from '@/components/common/smallTip'
  // import Vue from 'vue'

  export default {
    model: {
      prop: 'arr',
      event: 'updateArr'
    },
    props:{
      arr: {
        type: Array,
        default: () => {return []}
      },
      title: {
        type: String,
        default: ''
      },
      rightIcon:{
        type: String,
        default: ''
      },
      rightIconPosition:{
        type: String,
        default: ''
      },
      rightShow: {
        type: Boolean,
        default: () => { return true }
      }
    },
    name: "integralTypes",
    components:{
      smallTip
    },
    // 数据
    data(){
      let rightIcon = this.rightIcon || ''
      let rightIconPosition = this.rightIconPosition || ''
      let rightShow = this.rightShow
      return {
        list: [],
        icon: rightIcon,
        position: rightIconPosition,
        iconShow: rightShow
      }
    },
    watch:{
      arr:function(val){
        this.list = JSON.parse(JSON.stringify(val))
      }
    },
    methods:{
      go(){
        this.$emit('updateArr', this.list)
      }
    },
    created() {
      this.list = JSON.parse(JSON.stringify(this.arr))
    }
  };
</script>
<style scoped>
</style>
