<template>
  <div class="app-container">
    <search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" />
    <base-table v-loading="dataListLoading" :table-props="tableProps" :table-data="tableData" />
    <line-chart ref="lineChart" />
    <!-- <pagination
			:limit.sync="listQuery.pageSize"
			:page.sync="listQuery.pageNo"
			:total="listQuery.total"
			@pagination="getDataList" /> -->
  </div>
</template>

<script>
// import basicPage from '../../mixins/basic-page';
import { parseTime } from '../../mixins/code-filter';
import { getCT } from '@/api/core/analysis/index';
import { getProductionLinePage } from '@/api/core/base/productionLine';
import lineChart from '../LineChart'
// import { getWorkshopSectionPage } from '@/api/core/base/workshopSection';

// const tableProps = [
// 	// {
//   //   prop: 'lineName',
// 	// 	label: '产线',
// 	// 	align: 'center',
// 	// },
//   // {
//   //   prop: 'sum',
//   //   label: '合计',
//   //   align: 'center',
//   // },
//   // {
//   //   prop: 'dynamicValue',
//   //   label: 'dynamicName',
//   //   align: 'center',
//   //   children:[

//   //   ]
//   // }
// ];

export default {
  components: {
    lineChart,
  },
  // mixins: [basicPage],
  data() {
    return {
      urlOptions: {
        getDataListURL: getCT,
      },
      tableProps: [],
      dataListLoading: false,
      tableData: [],
      listQuery: {
        // time: ''
        endTime: undefined,
        lineId:undefined,
        startTime:undefined
      },
      xData: [],
      yData: [],
      optionArrUrl: [getProductionLinePage],
      formConfig: [
        {
          type: 'select',
          label: '产线',
          selectOptions: [],
          param: 'lineIds',
          defaultSelect: '',
          multiple: true,
          filterable: true,
        },
        {
          type: 'datePicker',
          label: '时间',
          dateType: 'datetime',
          format: 'yyyy-MM-dd',
          valueFormat: 'yyyy-MM-dd HH:mm:ss',
          rangeSeparator: '-',
          startPlaceholder: '开始时间',
          endPlaceholder: '结束时间',
          param: 'time',
        },
        {
          type: 'button',
          btnName: '搜索',
          name: 'search',
          color: 'primary',
        }
      ],
    };
  },
  created() {
    this.getArr();
  },
  methods: {
    getArr() {
      const params = {
        page: 1,
        limit: 500,
      };
      this.optionArrUrl.forEach((item, index) => {
        item(params).then((response) => {
          this.formConfig[index].selectOptions = response.data.list
        });
      });
    },
    getData() {
      this.listQuery.lineId = '1672847052717821953'
      this.listQuery.startTime = '1693497600000';
      this.listQuery.endTime = '1693843200000';
      this.urlOptions.getDataListURL(this.listQuery).then(res => {
        console.log(res)
        let arr = [
          {
            prop: 'sectionName',
            label: '工段',
            align: 'center',
          },
          {
            prop: 'equName',
            label: '设备',
            align: 'center',
          },
        ]
        let eqArr= []
        res.data.data.forEach((ele, index) => {
          console.log(ele);
          eqArr.push(ele.equName)
        })
        console.log(eqArr)
        // console.log(res.data.nameData.slice(1))
        res.data.nameData.forEach(item => {
          if (eqArr[0] === item.parentId) {
            const props = {
              'prop': item.name,
              'label': item.name,
              'align': 'center'
            }
          }
          arr[2].children.push(props)
        })
        let obj = {
          lineName: res.data.data[0].lineName,
          sum: res.data.data[0].sum,
        }
        res.data.data[0].data[0].children.forEach((item, index) => {
          console.log(item)
          // let data = 'data' + Number(index+1)
          obj['' + item.dynamicName + ''] = item.dynamicValue
        })
        this.tableData = [obj]
        console.log(this.tableData)
        console.log(arr)
        this.tableProps = arr
        let xData = []

        res.data.nameData.forEach(item => {
          xData.push(item.name)
          // arr[2].children.push(props)
        })
        let yData = []
        res.data.data[0].data[0].children.forEach((item, index) => {
          // console.log(item)
          yData.push(item.dynamicValue)
          // let data = 'data' + Number(index+1)
          // obj['' + item.dynamicName + ''] = item.dynamicValue
        })
        console.log(this.yData)
        this.$refs.lineChart.initChart(xData, yData)
        // this.total = response.data.total;
        // this.dataListLoading = false;
      });
    },
    buttonClick(val) {
      // console.log(val)
      switch (val.btnName) {
        case 'search':
          // this.listQuery.pageNo = 1;
          // this.listQuery.pageSize = 10;
          this.getData()
          break;
        case 'reset':
          this.$refs.searchBarForm.resetForm();
          this.listQuery = {
            pageSize: 10,
            pageNo: 1,
            total: 1,
          };
          this.getDataList();
          break;
        default:
          console.log(val);
      }
    },
  },
};
</script>
