<template>
  <div class="propagate">
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/all_aedia/overview' }"
        >全媒体平台</el-breadcrumb-item
      >
      <el-breadcrumb-item>传播排行</el-breadcrumb-item>
    </el-breadcrumb>
    <el-form
      size="small"
      :inline="true"
      :model="search"
      class="demo-form-inline"
    >
      <el-form-item label="中心">
        <el-select v-model="search.center">
          <el-option label="创新中心" value="1" />
          <el-option label="新闻中心" value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="部门">
        <el-select v-model="search.department">
          <el-option label="部门1" value="1" />
          <el-option label="部门2" value="2" />
        </el-select>
      </el-form-item>
      <el-form-item label="日期">
        <el-date-picker
          v-model="search.date"
          type="daterange"
          range-separator="-"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
        />
      </el-form-item>
    </el-form>

    <el-table border :data="tableData" stripe style="width: 100%">
      <el-table-column align="center" header-align="center" type="index" label="排行" width="50" />
      <el-table-column align="center" header-align="center" prop="" label="标题" />
      <el-table-column align="center" header-align="center" prop="" label="融合号" />
      <el-table-column align="center" header-align="center" prop="" label="发布时间" />
      <el-table-column align="center" header-align="center" prop="" label="传播量" />
      <el-table-column align="center" header-align="center" prop="" label="观看用户数" />
      <el-table-column align="center" header-align="center" prop="" label="人均停留时长(秒)" />
      <el-table-column align="center" header-align="center" prop="" label="点赞数" />
      <el-table-column align="center" header-align="center" prop="" label="评论数" />
    </el-table>
    <br />
    <el-pagination layout="prev, pager, next" :total="1000" />
  </div>
</template>
<script>
import { getArticleCnt } from "@/api/index";

export default {
  name: 'propagate',
  data() {
    return {
      search: {
        center: '',
        department: '',
        date: [],
      },
      tableData: [],
    };
  },
  mounted() {
    this.setTableData()
  },
  methods: {
    setTableData() {
      getArticleCnt({ type: 'center' })
        .then((res) => {
            console.log(res)
        })
        .catch((err) => {
          console.log("catch", err);
        });
    },
  },
  components: {},
};
</script>
<style lang="scss">
.propagate {
  width: 100%;
  height: 100vh;
  padding: 1em;
}
</style>
