Newer
Older
CallCenterFront / src / views / statistic / caseStatistic / components / caseHandleSearch.vue
StephanieGitHub on 24 Apr 2020 2 KB MOD: 统计模块
<!--事件处理统计查询框-->
<template>
  <div>
    <search-area :need-clear="false" :need-search-more="false" :size="size" type="default" search-more-type="default" @search="search">
      <chart-tools v-model="timeRange"/>
      <!--一般查询条件-->
      <search-item>
        <el-date-picker
          v-model="timeRange"
          :size="size"
          type="daterange"
          range-separator="至"
          value-format="yyyy-MM-dd"
          start-placeholder="处理开始时间"
          end-placeholder="处理结束时间"/>
      </search-item>
    </search-area>
  </div>
</template>

<script>
import SearchArea from '../../../../components/SearchArea/SearchArea'
import SearchItem from '../../../../components/SearchArea/SearchItem'
import { getDayTime } from '@/utils/dateutils'
import ChartTools from '../../components/chartTools'
export default {
  name: 'CaseHandleSearch',
  components: { ChartTools, SearchItem, SearchArea },
  props: {
    size: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      listQuery: {
        startTime: '',
        endTime: ''
      },
      timeRange: []
    }
  },
  watch: {
    timeRange(val) {
      if (this.timeRange && this.timeRange.length === 2) {
        this.listQuery.startTime = this.timeRange[0]
        this.listQuery.endTime = this.timeRange[1]
      }
    }
  },
  methods: {
    search() {
      this.$emit('search', this.listQuery)
    },
    changeDate(date) {
      let startDate, endDate
      if (date === 'today') { // 选择今日
        startDate = getDayTime(new Date().getTime())
        endDate = startDate
      } else if (date === 'week') {
        startDate = getDayTime(new Date().getTime() - 24 * 6 * 60 * 60 * 1000)
        endDate = new Date()
      } else if (date === 'month') {
        startDate = getDayTime(new Date().getTime() - 24 * 29 * 60 * 60 * 1000)
        endDate = new Date()
      } else if (date === 'season') {
        startDate = getDayTime(new Date().getTime() - 24 * 89 * 60 * 60 * 1000)
        endDate = new Date()
      } else if (date === 'year') {
        startDate = getDayTime(new Date().getTime() - 24 * 365 * 60 * 60 * 1000)
        endDate = new Date()
      }
      this.listQuery.compare = false
      this.timeRange = [startDate.Format('yyyy-MM-dd'), endDate.Format('yyyy-MM-dd')]
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.level-txt{
  margin-left:20px;
  color: #909399;
  font-size:15px;
  line-height: 32px
}
.level-radio{
  margin-right: 20px;
  color: #909399;
  line-height: 32px;
}
.level-radio label{
  vertical-align: middle;
}

</style>