<template>
	<picker @change="toChange" :value="index" :range="datalist" range-key="dispName">
		<view v-if="showBtn" class="cancelBtn">取消订单</view >
		<view v-if="showSelete" style="display: flex;align-items: center;justify-content: space-between;">
			<input class="form-input" :disabled="disabled" v-model="selected" placeholder-class="form-input-placeholder placeholder" :placeholder="placeholderText" />
			<u-icon name="arrow-right" color="#c0c4cc"></u-icon>
		</view>
	</picker>
</template>

<script>
import { getLookUpDatas, listLookUp } from '@/api/data'
export default {
  name: 'v-select',
  data () {
    return {
      selected: '',
      datalist: [],
      placeholderText: '请选择',
      lookUp: [],
	  index: 0,
    }
  },
  props: {
    disabled: {
      type: [Boolean, String],
      default: false
    },
    multiple: {
      type: [Boolean, String],
      default: false
    },
    value: [String, Number, Array],
    code: {
      type: String,
      required: true
    },
    placeholder: {
      type: String,
      default: ''
    },
    size: [String],
	showSelete:{
		type: [Boolean, String],
		default: true
	},
	showBtn:{
		type: [Boolean, String],
		default: false
	}
  },
  computed: {
    getVal () {
      return this.value
    },
    // getPlaceholderText () {
    //   let _this = this
    //   for (let i = 0; i < _this.lookUp.length; i++) {
    //     if (_this.lookUp[i].code == _this.code) {
    //       if (this.placeholder === '') _this.placeholderText = _this.lookUp[i].name
    //       break
    //     }
    //   }
    //   return _this.placeholderText
    // }
  },
  created () {
    if (this.code) {
      if (this.placeholder) {
        this.placeholderText = this.placeholder
      }
      getLookUpDatas({
        type: this.code
      }).then(result => {
		  console.log(result, 'result')
        if (result && result.status + '' === '200') {
          this.datalist = result.data
          
        }
      })
    } else {
      // console.log('请确认传递类型')
    }
    // 获取所有数据字典
    this.lookUp = this.$store.state.vuex_allLookUp
  },
  methods: {
    getDataList (){
      return this.datalist
    },
    getOptionName (val) {
      return this.datalist.find((item) => {
        return item.code == val
      })
    },
    getCodeByName (dispName) {
      return this.datalist.find((item) => {
        return item.dispName == dispName
      })
    },
	resetVal(){
		this.selected = ''
		this.index = 0
	},
	// 赋值
	setVal(code){
		let index = this.datalist.findIndex(item=>{
			return item.code == code
		})
		console.log(this.datalist,code,index)
		this.index = index
		this.selected = this.datalist[index].dispName
	},
    toChange (e) {
		this.index = e.target.value
		this.selected = this.datalist[this.index].dispName
        this.$emit('itemChange', this.datalist[this.index].code)
    }
  }

}
</script>

<style scoped>
	.cancelBtn{
		/* width: 345px; */
		padding: 20rpx 270rpx;
		height: 84upx;
		display: flex;
		justify-content: center;
		align-items: center;
		background: #E5E5E5;
		color: #666;
		border-radius: 16upx;
		font-size: 36upx;
		font-weight: 500;
	}
	/* .placeholder{
		color:"#c0c4cc" !important
	} */
</style>
