element ui dataPicker 日期范围选择控件实现限制选择时间范围为前后的第7天

可以使用 `picker-options` 属性来配置 `DatePicker` 组件。其中，`picker-options` 可以传入一个对象，用于配置日期选择器的行为。具体来说，可以使用 `disabledDate` 属性来禁用不合法的日期。

以下是一个示例代码，可以实现禁用日期选择范围，只允许选择前后7天的日期：

<template>
  <div>
    <el-date-picker
      v-model="date"
      type="date"
      :picker-options="pickerOptions"
      placeholder="选择日期">
    </el-date-picker>
  </div>
</template>

<script>
export default {
  data() {
    return {
      date: '',
      pickerOptions: {
        disabledDate(time) {
          const now = new Date();
          const sevenDaysBefore = new Date(now.getTime() - 7 * 24 * 60 * 60 * 1000);
          const sevenDaysAfter = new Date(now.getTime() + 7 * 24 * 60 * 60 * 1000);
          return time.getTime() < sevenDaysBefore || time.getTime() > sevenDaysAfter;
        }
      }
    };
  }
};
</script>

在以上示例中，我们在 `pickerOptions` 对象中定义了一个 `disabledDate` 方法。该方法接收一个 `time` 参数，表示当前正在考虑的日期。然后，我们获取了当前日期 `now`，以及前后7天的日期 `sevenDaysBefore` 和 `sevenDaysAfter`，并根据这些日期判断当前考虑的日期是否合法。如果当前日期早于7天前或晚于7天后，则该日期会被禁用。

你可以将以上示例代码复制到你的项目中进行测试。