<template>
  <div>
    <div class="fill-width mb-3">
      <a-card style="width: 100%; height: 100px; margin-bottom: 12px">
        <Search @getData="getData" />
      </a-card>
      <a-card style="width: 100%; height: 600px; margin-bottom: 12px" title="平车记录">
        <Day :list="list" v-if="list.length > 0" />
        <a-empty v-else />
      </a-card>
      <a-card style="width: 100%; height: auto">
        <Table :list="list" />
      </a-card>
    </div>
  </div>
</template>

<script>
import { mapActions } from 'vuex';
import Day from 'components/Day/Day.vue';
import Search from 'components/Search/Search.vue';
import Table from 'components/Table/Table.vue';
import { weightList } from 'config/api';
export default {
  name: 'Index',
  components: { Day, Search, Table },
  data() {
    return {
      list: [],
      str: '',
      disProgress: true,
    };
  },

  async created() {
    await this.getData();
  },

  methods: {
    async getData(timeData) {
      const hide = this.$message.loading('正在获取数据...', 0);
      try {
        this.disProgress = true;
        const params = {
          param: {
            carId: 1,
            startTime: timeData && timeData.startTime ? timeData.startTime : Date.parse(new Date()) - 3600 * 30 * 24 * 1000,
            endTime: timeData && timeData.endTime ? timeData.endTime : Date.parse(new Date()),
          },
        };
        const res = await weightList(params);
        const { code, data, msg } = res.data;
        if (code === 200) {
          let { list } = this;
          list = data;
          this.list = [...list];
          setTimeout(hide, 500);
          this.$message.success('获取数据成功');
          // this.list = data;
          this.disProgress = false;
        } else {
          this.$message.error(msg);
        }
      } catch (error) {
        this.$message.error(error);
      }
    },
  },
};
</script>

<style lang="stylus" scoped>
.weight-box {
  margin-top: 14px;
  text-align: left;
  padding-left: 10%;
  padding-top: 10px;
  font-size: 18px;
  font-weight: bold;
}

.progress {
  z-index: 1001;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  margin: 0;
  height: 8px;
}
</style>
