com-stack.vue 2.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <!-- 第一行统计数据 -->
  2. <template>
  3. <div>
  4. <div class="btn-box">
  5. <el-popover placement="top-start" trigger="hover">
  6. <el-button slot="reference" type="primary" size="small" @click="sa.open('https://jq.qq.com/?_wv=1027&k=5DHN5Ib')">QQ群(782974737)</el-button>
  7. <div style="text-align: center;">
  8. <img src="http://dev33-yxzj.oss-cn-beijing.aliyuncs.com/dyc/img/2020/01/17/157924554064970545739.png" style="width: 150px; height: 150px;" >
  9. </div>
  10. </el-popover>
  11. <!-- <el-button type="primary" size="small" @click="sa.open('https://jq.qq.com/?_wv=1027&k=5DHN5Ib')">QQ群(782974737)</el-button> -->
  12. <el-button type="success" size="small" @click="sa.open('https://github.com/click33/sa-admin')">GitHub 地址 (求star)</el-button>
  13. <el-button type="danger" size="small" @click="sa.open('https://gitee.com/click33/sa-admin')">Gitee 地址</el-button>
  14. <!-- <el-button type="info" size="small" @click="sa_admin.showMenuById('1-11')">意见吐槽</el-button> -->
  15. <el-button type="info" size="small" @click="sa.open('http://sa-app.dev33.cn/wall.html?name=sa-admin')">需求征集</el-button>
  16. <el-popover placement="top-start" trigger="hover">
  17. <el-button slot="reference" type="warning" size="small">打赏</el-button>
  18. <div style="text-align: center;">
  19. <h3 style="margin-bottom: 14px;">请作者喝杯咖啡</h3>
  20. <img src="http://oss.dev33.cn/sa-admin/ds-zfb.jpg" style="width: 150px; height: 150px; cursor: pointer;"
  21. @click="sa.showImage('http://oss.dev33.cn/sa-admin/ds-zfb.jpg', '400px', '400px')" />
  22. <img src="http://oss.dev33.cn/sa-admin/ds-wx.jpg" style="width: 150px; height: 150px; cursor: pointer;"
  23. @click="sa.showImage('http://oss.dev33.cn/sa-admin/ds-wx.jpg', '400px', '400px')" />
  24. </div>
  25. </el-popover>
  26. </div>
  27. <div>
  28. <el-table ref="data-table" :data="frameList" size="small" border>
  29. <el-table-column label="技术栈" prop="name"></el-table-column>
  30. <el-table-column label="框架" prop="value"></el-table-column>
  31. <el-table-column label="链接">
  32. <template slot-scope="s">
  33. <el-link type="primary" :href="s.row.link" target="_blank">{{s.row.link}}</el-link>
  34. </template>
  35. </el-table-column>
  36. </el-table>
  37. </div>
  38. </div>
  39. </template>
  40. <script>
  41. module.exports = {
  42. data() {
  43. return {
  44. // 技术栈集合
  45. frameList: [
  46. {name: '基础框架', value: 'Vue @2.6.10', link: 'https://cn.vuejs.org/'},
  47. {name: 'UI框架', value: 'Element-UI @2.13.0', link: 'https://element.eleme.cn/#/zh-CN'},
  48. {name: 'web弹层', value: 'layer @3.1.1', link: 'http://layer.layui.com/'},
  49. {name: '图表引擎', value: 'ECharts @4.2.1', link: 'https://echarts.baidu.com/'},
  50. {name: '富文本编辑器', value: 'wangEditor @3.1.1', link: 'http://www.wangeditor.com/'},
  51. ],
  52. }
  53. },
  54. methods: {
  55. },
  56. created() {
  57. }
  58. }
  59. </script>
  60. <style scoped>
  61. .btn-box{margin-bottom: 4px; }
  62. .btn-box .el-button{margin-bottom: 10px; }
  63. </style>