<template>
  <app-frame :data="frameParams">
    <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/data_banner.png" alt="" />
    <div class="dataList">
      <a href="/public/WM_11_Vue3组件化开发（一）.pdf" download="111.pdf" class="part">
        <div class="item">
          <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/pdf.png" alt="" />
          <p class="doc">招生简章.pdf</p>
          <p class="p1">最新更新</p>
          <p class="p2">下载</p>
        </div>
      </a>
      <a href="/public/WM_11_Vue3组件化开发（一）.pdf" download="111.pdf" class="part">
        <div class="item">
          <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/doc.png" alt="" />
          <p class="doc">常见问题.docx</p>
          <p class="p1">最新更新</p>
          <p class="p2">下载</p>
        </div>
      </a>
      <a href="/public/WM_11_Vue3组件化开发（一）.pdf" download="111.pdf" class="part">
        <div class="item">
          <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/doc.png" alt="" />
          <p class="doc">推荐信要求.docx</p>
          <p class="p1">最新更新</p>
          <p class="p2">下载</p>
        </div>
      </a>
      <a href="/public/WM_11_Vue3组件化开发（一）.pdf" download="111.pdf" class="part">
        <div class="item">
          <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/doc.png" alt="" />
          <p class="doc">申请材料清单.docx</p>
          <p class="p1">最新更新</p>
          <p class="p2">下载</p>
        </div>
      </a>
      <a href="/public/WM_11_Vue3组件化开发（一）.pdf" download="111.pdf" class="part">
        <div class="item">
          <img src="https://webapp-pub.oss-cn-beijing.aliyuncs.com/project/marywood/doc.png" alt="" />
          <p class="doc">英文简历模板.docx</p>
          <p class="p1">最新更新</p>
          <p class="p2">下载</p>
        </div>
      </a>
    </div>
  </app-frame>
</template>
<script>
import appFrame from '@/components/appFrame'
export default {
  layout: 'normal',
  components: { appFrame },
  data() {
    return {
      frameParams: {
        slider: [
          {
            name: this.$t('menu.dataDownload'),
            path: '/dataDownload/dataDownload'
          }
        ]
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.dataList {
  width: 900px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-left: 50px;
  padding-bottom: 73px;
  .item {
    flex: 1;
    width: 424px;
    height: 201px;
    min-width: 424px;
    max-width: 424px;
    margin-right: 15px;
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: #f9f8f8;
    .doc {
      font-size: 16px;
      font-weight: 400;
      line-height: 34px;
      color: #333333;
    }
    .p1 {
      font-size: 14px;
      font-weight: 400;
      line-height: 34px;
      color: #999999;
    }
    .p2 {
      font-size: 16px;
      font-weight: 500;
      line-height: 34px;
      color: #aa1941;
    }
  }
}
</style>
