<template>
  <div>
    <el-row>
      <el-col class="date">
        <el-date-picker
          v-model="value1"
          @change="handeldate"
          value-format="yyyy-MM-dd"
          type="date"
          :placeholder="$t(`placeholder.data`)"
         
        >
        </el-date-picker>
      </el-col>
    </el-row>
    <div v-loading="profitLoading">
      <div class="tableAnnotation">{{ $t(`home.figure`) }}</div>
      <el-row>
        <el-col :span="24">
          <div
            id="profitData"
            style="width: 100%; min-height: 700px"
          ></div>
        </el-col>
      </el-row>

      <el-row>
        <div class="tableAnnotation">{{ $t(`home.figure2`) }}</div>
        <el-col :span="24">
          <div id="profitPieChart" style="width: 100%; min-height: 700px"></div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
import indeJs from "./index";
export default {
  mixins: [indeJs],
};
</script>

<style scoped>
.tableAnnotation {
  color: rgba(0, 0, 0, 0.6);
  padding: 2px 0px;
  font-size: 13px;

  padding-left: 30px;
}
.date {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  margin-bottom: 30px;
  padding: 10px 10px;
  display: flex;
  justify-content: right;
}
</style>
<style >
.date .el-input__inner {
  margin: 0 !important;
}
</style>