<template>
  <u-dropdown-item :title="label">
    <view class="bg-white p-30rpx">
      <u-input v-model="status" :placeholder="placeholder" class="flex-1" />
      <view class="my-20rpx">
        <u-line></u-line>
      </view>
      <u-button type="primary" @click="handleChange">确定</u-button>
    </view>
  </u-dropdown-item>
</template>
<script>
export default {
  props: {
    label: {
      type: String,
      default: '',
    },
    value: {
      type: [Array, Object, String, Number],
    },
    placeholder: {
      type: [Array, String],
      default: '请输入',
    },
    isOpen: {
      type: Boolean,
    },
  },
  computed: {
    // status: {
    //   get() {
    //     console.log(this.value);
    //     return this.value
    //   },
    //   set(val) {
    //     // this.$emit('change', val)
    //     // this.$emit('input', val)
    //   },
    // },
  },
  data() {
    return {
      status: '',
    }
  },
  methods: {
    handleChange() {
      this.$emit('change', this.status)
      this.$emit('close-dropdown', this.status)
    },
  },
  watch: {
    isOpen: {
      handler(e) {
        this.status = this.value
      },
      immediate: true,
    },
  },
}
</script>
