<template>
  <form-option title="手册配置">
    <el-form :inline="true" :model="query" ref="form" label-width="80px">
      <el-form-item label="更新时间:" prop="updateTime" >
        <el-date-picker v-model="query.updateTime" range-separator="至"
                        type="daterange" start-placeholder="开始日期"
                        end-placeholder="结束日期"
        ></el-date-picker>
      </el-form-item>
      <el-form-item label="更新人员:" prop="update_user_id">
        <template>
          <el-select v-model="query.update_user_id" placeholder="请选择">
            <el-option
                v-for="item in updatePersons"
                :key="item.user_id"
                :label="item.user_name"
                :value="item.user_id"
            >
            </el-option>
          </el-select>
        </template>
      </el-form-item>
      <el-button class="ml" icon="el-icon-refresh-right" @click="resetForm">重置</el-button>
      <el-button type="primary" icon="el-icon-search" @click="handleQuery">查询</el-button>
    </el-form>
  </form-option>
</template>

<script>
import FormOption from '@/component/FormOption'
import {DateTime} from "luxon"
import { getUpdateUser } from '@/api/book'

export default {
  components: {
    FormOption
  },
  data() {
    return {
      query: {
        updateTime: "",
        update_user_id: null
      },
      updatePersons: null
    }
  },
  mounted() {
    this.getUpdatePersons()
  },
  methods: {
    resetForm() {
      this.$refs.form.resetFields()
      this.$emit('reset')
    },
    getUpdatePersons() {
      getUpdateUser().then(res => {
        console.log(res)
         this.updatePersons = res && res.filter(item => {
           return item !==null
         })
      })
    },
    handleQuery() {
      let queryString = ""
      let expressions = []
      if (this.query.update_user_id) {
        expressions.push("update_user_id" + "==" + "'" + this.query.update_user_id + "'")
      }

      if (this.query.updateTime && this.query.updateTime.length === 2) {
        expressions.push('update_time' + ">" + "'" + DateTime.fromJSDate(this.query.updateTime[0]).toFormat("yyyy-LL-dd HH:mm:ss") + "'")
        expressions.push('update_time' + "<" + "'" + DateTime.fromJSDate(this.query.updateTime[1]).toFormat("yyyy-LL-dd") + " 23:59:59'")
      }

      if (expressions.length !== 0) {
        queryString = expressions.reduce(function(previousValue, currentValue, index, array) {
          return previousValue + ";" + currentValue
        })
      }

      this.$emit('query', queryString)
    }
  }
}
</script>