feat:事件弹窗显示调整

shuishen

2025-04-16 a7e6761ba0cfccdf33ed552eb2d3b783c8e4ab4a

 src/components/CommonDateTime.vue

@@ -8,13 +8,14 @@
      start-placeholder="开始日期"
      end-placeholder="结束日期"
      @change="change"
      disabled
    />
    <div class="time-card">
      <div
        class="card-item"
        :class="item === checked ? 'active' : ''"
        v-for="(item, index) in timeList"
        @click="timeClick(item)"
        @click="timeClick(item,index)"
      >
        {{ timeListStr[index] }}
      </div>
@@ -24,14 +25,17 @@

<script setup>
import dayjs from 'dayjs';
import { useStore } from 'vuex'
import { ref, defineEmits } from 'vue';

const store = useStore()
const emit = defineEmits(['change']);

const model = defineModel();

let timeList = ['today', 'week', 'month', 'year'];
let timeListStr = ['今日', '本周', '本月', '本年'];
let timeListEnum = ['TODAY', 'CURRENT_WEEK', 'CURRENT_MONTH', 'CURRENT_YEAR'];
let checked = ref('today');

const getDateRange = unit => {
@@ -49,14 +53,27 @@
};

const change = value => {
  emit('change', value);
  // todo 待对接
  // emit('change', value);
};

let timeClick = item => {
let timeClick = (item,index) => {
  checked.value = item;
  model.value = dateRanges[item];
  emit('change', model.value);
  const newDateRange = dateRanges[item];
  model.value = newDateRange;
  emit('change', newDateRange, timeListEnum[index],checked.value);
};
onMounted(() => {
  // 如果父组件传入了值，就使用父组件的值 by cpz
  if (model.value && model.value.length === 2) {
    // 根据传入的日期判断是哪个时间范围
    const startDate = model.value[0];
    const endDate = model.value[1];
    if (startDate !== endDate) {
      checked.value = 'week';
    }
  }
});
</script>

<style scoped lang="scss">