<template>
  <bml-cell link :title="title" :footer="footer" @click="select()">
  </bml-cell>
</template>

<script>
    import bmlCell from './bml-cell.vue';
    const picker = weex.requireModule('picker')
    module.exports = {
        name: 'bml-cell-picker',
        components: {bmlCell},
        props: {
            items: {
                type: Array
            },
            title: {
                type: String
            },
            // 是否可选
            disabled: {
                type: Boolean,
                default: false
            },
            value: {
                type: Object
            },
            valueItem: {
              type: String,
              default: 'value'
            },
            nameItem: {
              type: String,
              default: 'name'
            }
        },
        data () {
            return {
              footer:'',
              pickItems: this.initList()
            }
        },
        watch: {
        },
        computed: {
            
        },
        created () {
          for(var i in this.items){
              // 设置初始值
              if(this.items[i][this.valueItem]==this.value){
                this.footer = this.items[i][this.nameItem]
                break;
              }
            }
        },
        methods: {
          initList(){
            let _items = []
            if(!this.items){
              return _items;
            }

            for(var i in this.items){
              _items.push(this.items[i][this.nameItem])
            }

            return _items;
          },
          //点击筛选操作
          select(){
              if(this.disabled) return;
              let that = this
              let index = 0;
              if(this.value){
                index = this.items.findIndex(function (item) {
                  return item[that.valueItem] == that.value
                })
              }
             
              picker.pick({
                index: index,
                title: this.title,
                items:this.pickItems
                },event => {
                  if(event.result==='success'){
                    this.value = this.items[event.data][that.valueItem]
                    this.footer = this.items[event.data][that.nameItem]
                    this.$emit("input", this.value);
                    this.$emit("change", this.items[event.data]);
                  }
              })
          }
        }
    }
</script>

<style lang="scss" src="../css/picker.scss"/>