component.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <style>
  2. .page-component {
  3. padding-bottom: 95px;
  4. }
  5. .page-component {
  6. .content {
  7. margin-left: -1px;
  8. > {
  9. h3 {
  10. margin: 45px 0 15px;
  11. }
  12. table {
  13. border-collapse: collapse;
  14. width: 100%;
  15. background-color: #fff;
  16. color: #5e6d82;
  17. font-size: 14px;
  18. margin-bottom: 45px;
  19. strong {
  20. font-weight: normal;
  21. }
  22. th {
  23. text-align: left;
  24. border-top: 1px solid #eaeefb;
  25. background-color: #EFF2F7;
  26. }
  27. td, th {
  28. border-bottom: 1px solid #eaeefb;
  29. padding: 10px;
  30. }
  31. th:first-child, td:first-child {
  32. padding-left: 10px;
  33. }
  34. }
  35. }
  36. }
  37. }
  38. </style>
  39. <template>
  40. <div class="page-container page-component">
  41. <el-row>
  42. <el-col :span="6">
  43. <side-nav :data="navsData[lang]" :base="`/${ lang }/component`"></side-nav>
  44. </el-col>
  45. <el-col :span="18">
  46. <router-view class="content"></router-view>
  47. <footer-nav></footer-nav>
  48. </el-col>
  49. </el-row>
  50. </div>
  51. </template>
  52. <script>
  53. import navsData from '../../nav.config.json';
  54. export default {
  55. data() {
  56. return {
  57. lang: this.$route.meta.lang,
  58. navsData
  59. };
  60. }
  61. };
  62. </script>