template-manager.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
  1. <template>
  2. <div class="app-container">
  3. <el-card class="box-card">
  4. <el-table border :data="dataList">
  5. <el-table-column label="ID" prop="id" width="120" />
  6. <el-table-column label="模板名称" prop="title" />
  7. <el-table-column
  8. label="操作"
  9. align="center"
  10. class-name="small-padding fixed-width"
  11. width="180"
  12. >
  13. <template slot-scope="scope">
  14. <el-button
  15. size="mini"
  16. type="text"
  17. icon="el-icon-download"
  18. @click="handleView(scope.row)"
  19. >下载</el-button
  20. >
  21. </template>
  22. </el-table-column>
  23. </el-table>
  24. </el-card>
  25. </div>
  26. </template>
  27. <script>
  28. export default {
  29. data() {
  30. return {
  31. dataList: [
  32. {
  33. id: 1,
  34. title: "乐团退费模板",
  35. url: "https://oss.dayaedu.com/daya/202203/乐团退费模板.xlsx",
  36. },
  37. ],
  38. };
  39. },
  40. methods: {
  41. // 下载模板
  42. handleView(row) {
  43. window.location.href = row.url;
  44. },
  45. },
  46. };
  47. </script>
  48. <style scoped></style>