<template>
  <div class="app-container">

    <el-form ref="form" :model="form" label-width="180px">
        <el-form-item label="每日自动同步：">
          

          <el-col :span="20">
            <el-switch v-model="form.delivery"></el-switch>
          </el-col>
       
          <el-col :span="4">
           <el-select v-model="form.cmo"  >
            <el-option  v-for="item in companyArr" :key="item.id" :label="item.name" :value="item.name"/> 
          </el-select>
 
          </el-col>



        </el-form-item>


   



        

        <el-form-item label="">
          <el-col :span="6">
            <el-select v-model="form.region" placeholder=""  @change="change_select">
              <el-option v-for="item in selectArr"  :key="item.id" :label="item.name" :value="item.id" /> 
            </el-select>

          
          </el-col>
          <el-col :span="6">
              <el-time-picker
                v-model="time1"
                :picker-options="{
                  selectableRange: '00:00:00 - 23:59:59'
                }"
                @change = "change_time1"
                placeholder="任意时间点">
              </el-time-picker>

          </el-col>
        </el-form-item>
        <!-- <el-form-item label="活动时间">
          <el-col :span="11">
            <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
          </el-col>
          <el-col class="line" :span="2">-</el-col>
          <el-col :span="11">
            <el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker>
          </el-col>
        </el-form-item> -->
       
        <el-form-item label="同步内容：">
          下载数据
          <el-checkbox-group v-model="form.type" @change="change_auto1">
              <el-checkbox v-for="item in autoArr1" :key="item.id" :label="item" :value="item.name">{{ item.name }}</el-checkbox>
          </el-checkbox-group>
          上传数据
          <el-checkbox-group v-model="form.type" @change="change_auto1">
              <el-checkbox v-for="item in autoArr2" :key="item.id" :label="item" :value="item.name">{{ item.name }}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>


        <el-divider></el-divider>

        <el-form-item label="手动同步：">
          <el-button class="successBorder" @click="handleSearch">立刻同步</el-button>
        </el-form-item>

        <el-form-item label="同步内容：">
          下载数据
          <el-checkbox-group v-model="form.type" @change="change_auto1">
              <el-checkbox v-for="item in autoArr1" :key="item.id" :label="item" :value="item.name">{{ item.name }}</el-checkbox>
          </el-checkbox-group>
          上传数据
          <el-checkbox-group v-model="form.type" @change="change_auto1">
              <el-checkbox v-for="item in autoArr2" :key="item.id" :label="item" :value="item.name">{{ item.name }}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
       
       
      </el-form>
 

   
  </div>

</template>

<script>
import { GetDataByName, PostDataByName, failproccess, checkButtons } from '@/api/common'
import Cookies from 'js-cookie'
import Pagination from '@/components/Pagination'
export default {
  name: 'DataSynchronization',
  components: { Pagination },
  data() {
    return {
      isRoleEdit: [],
      companyArr: [
        { id: '公司1', name: '公司1' }, 
        { id: '公司2', name: '公司2' },
        { id: '公司3', name: '公司3' } 
      ],
      autoArr1: [
        { id: '栏舍', name: '栏舍' }, 
        { id: '配方', name: '配方' },
        { id: '饲料', name: '饲料' },
        { id: '饲料分类', name: '饲料分类' },
        { id: '牲畜类别', name: '牲畜类别' },
        { id: '驾驶员', name: '驾驶员' }
      ],
      autoArr2: [
        { id: '栏舍', name: '栏舍' }, 
        { id: '配方', name: '配方' },
        { id: '搅拌数据', name: '饲料' },
        { id: '发料数据', name: '饲料分类' },
        { id: '剩料数据', name: '牲畜类别' },
        { id: '干物质信息', name: '干物质信息' },
        { id: '滨州筛', name: '滨州筛' },
        { id: '粪便筛', name: '粪便筛' },
        { id: '计划完成车次', name: '计划完成车次' },
        { id: '实际完成车次', name: '实际完成车次' },
        { id: '计划重量', name: '计划重量' },
        { id: '完成重量', name: '完成重量' },
        { id: '准确率', name: '准确率' },
      ],

      time1:"",
time2:"",
time3:"",
       form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        },


      table: {
        getdataListParm: {
          name: 'getPastureList',
          page: 1,
          offset: 1,
          pagecount: parseInt(Cookies.get('pageCount')),
          returntype: 'Map',
          parammaps: {
            'pastureid': Cookies.get('pastureid'),
            'phone': '',
            'contact': '',
            'address': '',
            'pastureName': '',
            enable: ''
          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true,
        temp: {}
      },
      requestParam: {},
      arrowDown: true,
      arrowUp: false,
      rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
      cellStyle: { padding: 0 + 'px' }

    }
  },

  created() {
 
    this.getButtons()
  },
  mounted() {
  
  },
  methods: {
    getButtons() {
      const Edit = 'RanchInformation'
      const isRoleEdit = checkButtons(JSON.parse(sessionStorage.getItem('buttons')), Edit)
      this.isRoleEdit = isRoleEdit
    },

    onSubmit() {
        console.log('submit!');
      },
       change_auto1() {
        console.log('submit!');
      },
    handleEnableChange() {
      console.log('点击了是否启用')
    },
    handleConfirmStartChange() {
      console.log('点击了确认开始')
    },
    handleSearch() {
      console.log('点击了查询')
      this.getList()
      this.table.getdataListParm.offset = 1
      this.arrowDown = true
      this.arrowUp = false
    },

    change_time1(){
      console.log(this.time1)
    },

    change_select(){
      console.log(this.time1)
    },
 
  }
}
</script>
<style lang="scss" scoped>
  .search{margin-top:10px;}
  
 
