index.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <div class="layout-page" :style="themeStyle">
  3. <v-header :title="$t('help.a1')"></v-header>
  4. <main class="layout-main">
  5. <template v-for="parentItem in list">
  6. <v-link
  7. tag="div"
  8. :to="{path:'/pages/help/sort',query:{id:parentItem.id,title:parentItem.name}}"
  9. class="p-md color-light fn-20 "
  10. :key="parentItem.id"
  11. >{{parentItem.name}}</v-link>
  12. <div class="m-x-md m-b-md p-md bg-panel-4 rounded box-shadow" :key="parentItem.id+'s'">
  13. <v-link
  14. tag="div"
  15. :to="{path:'/pages/help/detail',query:{id:item.id}}"
  16. class="item p-y-xs border-b d-flex justify-between"
  17. v-for="item in parentItem.article"
  18. :key="item.id"
  19. >
  20. <div class="eps-1 color-light">{{item.title}}</div>
  21. <van-icon name="arrow" />
  22. </v-link>
  23. </div>
  24. </template>
  25. </main>
  26. </div>
  27. </template>
  28. <script>
  29. import College from "@/api/college";
  30. import {mapGetters} from 'vuex'
  31. export default {
  32. name: "help",
  33. data() {
  34. return {
  35. list: [],
  36. };
  37. },
  38. computed: {
  39. ...mapGetters(['themeStyle'])
  40. },
  41. methods: {
  42. college() {
  43. College.college().then((res) => {
  44. this.list = res.data.categoryList;
  45. });
  46. },
  47. },
  48. created() {
  49. this.college();
  50. },
  51. };
  52. </script>