<template>
  <div class="bg-filtrate">
    <span class="bg-filtrate-text">{{ name }}：</span>
    <div class="bg-filtrate-list">
      <el-date-picker
        v-model="useTime"
        type="daterange"
        value-format="yyyy-MM-dd"
        range-separator="~"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
        @change="change">
      </el-date-picker>
    </div>
  </div>
</template>

<script setup>
import { reactive, ref, onBeforeMount, toRefs, computed, watch } from "vue";
const props = defineProps({
  name: {
    type: String,
    default: "",
  },
  time: {
    type: String,
    default: "",
  },
});

const emit = defineEmits(["update:time"]);

const useTime = computed({
  get() {
    return props.time;
  },
  set(value) {
    emit("update:time", value);
  },
});
</script>
