Stories.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556
  1. <template>
  2. <div>
  3. <div class="card stories-card">
  4. <div class="card-header bg-white">
  5. <p class="mb-0 d-flex align-items-center justify-content-between">
  6. <span class="text-muted font-weight-bold">Stories</span>
  7. <a class="text-dark small" href="/account/activity">See All</a>
  8. </p>
  9. </div>
  10. <div class="card-body loader text-center" style="height: 120px;">
  11. <div class="spinner-border" role="status">
  12. <span class="sr-only">Loading…</span>
  13. </div>
  14. </div>
  15. <div class="card-body pt-2 contents" style="max-height: 120px; overflow-y: scroll;">
  16. <div id="stories">
  17. </div>
  18. </div>
  19. </div>
  20. </div>
  21. </template>
  22. <style type="text/css" scoped>
  23. </style>
  24. <script type="text/javascript">
  25. export default {
  26. data() {
  27. return {
  28. stories: [],
  29. }
  30. },
  31. beforeMount() {
  32. //this.fetchStories();
  33. },
  34. mounted() {
  35. },
  36. methods: {
  37. fetchStories() {
  38. axios.get('/api/v2/stories')
  39. .then(res => {
  40. this.stories = res.data;
  41. $('.stories-card .loader').hide();
  42. var stories = pixelfed.stories.create('stories');
  43. stories.update(this.stories);
  44. });
  45. }
  46. }
  47. }
  48. </script>