<!--
  @description: 报表统计-平台运营情况-搜索条件
  @Modifier：肖文龙
  @routerPath:
  @date：  2021/01/31
-->
<template>
  <div>
    <el-form ref="searchForm" :model="searchForm" inline>
      <el-form-item v-if="roleFlag()" label="采购单位">
        <el-input v-model="searchForm.orgName" @focus="organSelect" />
      </el-form-item>
      <el-form-item label="统计间隔">
        <el-date-picker
          v-model="searchForm.timeDate"
          popper-class="reportChart_date-picker"
          :value-format="elValueFormat"
          :unlink-panels="true"
          range-separator="至"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
          type="daterange"
          @change="timeDateChange"
        />
      </el-form-item>
      <el-form-item class="fr">
        <el-button type="primary" round @click="search">
          统计
        </el-button>
        <el-button type="primary" round @click="resetForm('searchForm')">
          重置
        </el-button>
      </el-form-item>
    </el-form>
    <!-- 所属机构弹框 -->
    <organTree-dialog ref="organTree" :btn-round="false" :single-choice="true" @call-back="organTree" />
  </div>
</template>
<script>
/* 混入 */
import { reportChartSearch } from './../../mixins/reportChartSearch.js'// 搜索公共方法
/* 组件 */
import organTreeDialog from '@/views/common/user/organizationTree/organTree-dialog' // 采购单位选择
export default {
  components: {
    'organTree-dialog': organTreeDialog // 采购单位选择
  },
  mixins: [reportChartSearch],
  data() {
    return {
      // 查询条件
      searchForm: {
        timeDate: [], // 时间-不传给后端
        statisticalStartTime: '', // 统计开始时间
        statisticalEndTime: '', // 统计结束时间
        orgName: '', // 采购单位名称
        orgId: '', // 采购单位ID
        orgCode: ''// 采购单位编码
      }
    }
  },
  methods: {
    // 选择时间
    timeDateChange(val) {
      this.searchForm.statisticalStartTime = this.$Moment(val[0]).format(this.momentDate)
      this.searchForm.statisticalEndTime = this.$Moment(val[1]).format(this.momentDate)
    },
    // 选择机构
    organSelect() {
      this.$refs.organTree.open({
        title: '选择机构', // 弹框标题
        dialog: true, // 弹窗状态
        selectCodes: this.searchForm.orgId && this.searchForm.orgId.split(',')// 当前选中的供货范围Code
      })
    },
    // 选择机构
    organTree(data) {
      // 选择
      this.$set(this.searchForm, 'orgName', data.labels)
      this.$set(this.searchForm, 'orgCode', data.codes)
      this.$set(this.searchForm, 'orgId', data.keys)
    },
    /**
     * 搜索
     *  @param {searchForm} Object 查询条件
    */
    search() {
      const data = { ...this.searchForm }
      // 删除不需要的内容
      delete data.timeDate
      delete data.orgName
      // delete data.orgId
      // 获取父组件实例
      this.parentVm('', data)
    }
  }
}
</script>
<style lang="less" scoped>
</style>
