fyindr
/
siimee
보기 4
좋아요 3
포크 1
코드 풀 리퀘스트 1 릴리즈 4 위키 Activity
소스 검색

Merge branch 'homeVue-template' of fyindr/siimee into dev

tags/0.0.1^2
jcarbajal 3 년 전
부모
0aec6ab009 d08a2fed02
커밋
46ffe9d811
6개의 변경된 파일과 40개의 추가작업 그리고 36개의 파일을 삭제
통합 보기 변경상태 보기
  1. 1
    1
      frontend/index.html
  2. 6
    25
      frontend/src/App.vue
  3. 1
    1
      frontend/src/components/Messages.vue
  4. 5
    3
      frontend/src/components/ProfileCardList.vue
  5. 1
    0
      frontend/src/utils/mixins.js
  6. 26
    6
      frontend/src/views/HomeView.vue

+ 1
- 1
frontend/index.html 파일 보기

6 
         <title>Vite App</title>
 6 
         <title>Vite App</title>
7 
     </head>
 7 
     </head>
8 
     <body>
 8 
     <body>
9 
-        <div id="app"></div>
9 
+        <div id="app" style="width:90%;margin:5%;"></div>
10 
         <script>
 10 
         <script>
11 
             // DUMB shim
 11 
             // DUMB shim
12 
             var global = window
 12 
             var global = window

+ 6
- 25
frontend/src/App.vue 파일 보기

1 
 <template lang="pug">
 1 
 <template lang="pug">
2 
 w-app
 2 
 w-app
3 
-    w-drawer(v-model="openDrawer")
4 
-    w-flex.my12(:gap="3" align-center wrap)
5 
-        w-button.ma1(@click="$waveui.notify('Information.')" bg-color="info") Notify info
6 
-        w-button.ma1(@click="$waveui.notify('Success!', 'success')" bg-color="success") Notify success
7 
-        w-button.ma1(@click="$waveui.notify('Warning!', 'warning')" bg-color="warning") Notify warning
8 
-        w-button.ma1(@click="$waveui.notify('Error :(', 'error', 0)" bg-color="error") Permanent error
9 
-    w-flex.my12(align-center wrap)
10 
-        w-spinner(bounce)
11 
-        w-input Label
12 
-        w-checkbox Single option
13 
-    w-flex.my12
3 
+    div.nav(style="display: flex; justify-content: space-between;")
4 
+        header
5 
+            h2 home - profile: {{ getPid }}
6 
+        w-drawer(v-model="openDrawer")
7 
+            h2 content
14 
         w-button(@click="openDrawer = true" outline="")
 8 
         w-button(@click="openDrawer = true" outline="")
15 
-            | Open drawer
16 
-    w-flex.my12(grow column)
17 
-        w-slider(:model-value="40" thumb-label step-label :step="20" color="primary-light3").mt12
18 
-        .mt4 v-model:
19 
-            code.ml1 {{ sliderVal }}
20 
-    w-flex.my12(:gap="3" align-center wrap)
21 
-        | Show menu on:
22 
-        w-menu
23 
-            template(#activator="{ on }")
24 
-                w-button(v-on="on") Show menu
25 
-            | Menu content
26 
-        w-badge.mr10(bg-color="error")
27 
-            template(#badge) 3
28 
-            w-icon(color="grey-light1" size="2.5em") mdi mdi-email
9 
+            | Active Chats
29 
     SideBar(
 10 
     SideBar(
30 
         v-if="showSidebar"
 11 
         v-if="showSidebar"
31 
         :pid="getPid"
 12 
         :pid="getPid"

+ 1
- 1
frontend/src/components/Messages.vue 파일 보기

7 
         :key='profile.profile_id'
7 
         :key='profile.profile_id'
8 
         :class="[pid == profile.profile_id ? 'active' : '', 'sidebar__message', 'f-col', 'start']"
 8 
         :class="[pid == profile.profile_id ? 'active' : '', 'sidebar__message', 'f-col', 'start']"
9 
     )
 9 
     )
10 
-    img(:src='profile.avatar')
10 
+    img(:src='profile.avatar' style="max-height:100px")
11 
     .message__right
 11 
     .message__right
12 
         h4.message__name {{ profile.name }}
 12 
         h4.message__name {{ profile.name }}
13 
         p.message__content {{ profile.metadata.rawMetadata || &quot;Hello I&apos;m using tinder!&quot; }}
 13 
         p.message__content {{ profile.metadata.rawMetadata || &quot;Hello I&apos;m using tinder!&quot; }}

+ 5
- 3
frontend/src/components/ProfileCardList.vue 파일 보기

1 
 <template lang="pug">
 1 
 <template lang="pug">
2 
-section.profile-card-list
2 
+section.profile-card-list(:style="{'display': 'flex', 'overflow':'auto',}")
3 
     .swipe(
 3 
     .swipe(
4 
         v-if="!isGrid"
 4 
         v-if="!isGrid"
5 
         :config="config"
 5 
         :config="config"
8 
         v-for="(profile, i) in loadedProfiles"
 8 
         v-for="(profile, i) in loadedProfiles"
9 
         :style="{ 'z-index': 1000-i }"
 9 
         :style="{ 'z-index': 1000-i }"
10 
     )
 10 
     )
11 
-        .card.randomize(
12 
-            :style="{ 'background-image': `url(${profile.avatar})`, 'top': `${randomize(10)}px`, 'right': `${randomize(20)}px`, 'transform': `rotate(${randomize(7)}deg)` }"
11 
+
12 
+        w-card.card.randomize(
13 
+            :image="`${profile.avatar}`"
14 
+            :style="{'top': `${randomize(10)}px`, 'right': `${randomize(20)}px`, 'transform': `rotate(${randomize(7)}deg)`}"
13 
         )
 15 
         )
14 
             .card--content
 16 
             .card--content
15 
                 p(style="color: magenta;") profile: {{ profile.pid }}
 17 
                 p(style="color: magenta;") profile: {{ profile.pid }}

+ 1
- 0
frontend/src/utils/mixins.js 파일 보기

11 
 const cardMixin = {
 11 
 const cardMixin = {
12 
     data: () => ({
 12 
     data: () => ({
13 
         cards: [],
 13 
         cards: [],
14 
+        matches: [],
14 
         loading: true,
 15 
         loading: true,
15 
     }),
 16 
     }),
16 
     watch: {
 17 
     watch: {

+ 26
- 6
frontend/src/views/HomeView.vue 파일 보기

1 
 <template lang="pug">
 1 
 <template lang="pug">
2 
-main.view--home
3 
-    header
4 
-        h2 home - profile: {{ pid }}
5 
-
2 
+main.view--home(style="display:flex; flex-direction:column; gap: 40px; margin-top: 1em;")
3 
+    h2 Match Queue
6 
     article(v-if="cards.length && !loading")
 4 
     article(v-if="cards.length && !loading")
7 
         ProfileCardList(:profiles="cards" :pid="pid" @reload="getCards")
 5 
         ProfileCardList(:profiles="cards" :pid="pid" @reload="getCards")
8
6
9 
     p(v-else) Loading...
 7 
     p(v-else) Loading...
10
8
11 
-    MainNav(@show-sidebar="$emit('show-sidebar')")
9 
+    h2 Matches
10 
+    article(v-if="matches.length && !loading")
11 
+        ProfileCardList(:profiles="matches" :pid="pid" @reload="getCards")
12 
+
13 
+    p(v-else-if="matches.length===0") No matches.
14 
+    p(v-else) Loading...
15 
+
12 
 </template>
 16 
 </template>
13
17
14 
 <script>
 18 
 <script>
15 
 import ProfileCardList from '../components/ProfileCardList.vue'
 19 
 import ProfileCardList from '../components/ProfileCardList.vue'
16
20
17 
 import { Card } from '../entities'
 21 
 import { Card } from '../entities'
18 
-import { fetchQueueByProfileId } from '../services'
22 
+import { fetchQueueByProfileId, fetchMembershipsByProfileId } from '../services'
19 
 import { mixins } from '../utils'
 23 
 import { mixins } from '../utils'
20
24
21 
 /** Callback used to format incoming into card */
 25 
 /** Callback used to format incoming into card */
33 
     })
 37 
     })
34 
 }
 38 
 }
35
39
40 
+const converGroupingToCard = grouping => {
41 
+    if (grouping.type !== 'grouping') {
42 
+        console.error(`Cannot convert ${grouping} to Card. Invalid entity.`)
43 
+    }
44 
+    if (!grouping.profile.isValid()) {
45 
+        console.warn(`Profile in ${grouping} is not a valid profile.`)
46 
+    }
47 
+    return new Card({
48 
+        pid: grouping.profile.profile_id,
49 
+        name: grouping.profile.user_name,
50 
+        avatar: grouping.profile.profile_media[0],
51 
+    })
52 
+}
53 
+
36 
 export default {
 54 
 export default {
37 
     name: 'HomeView',
 55 
     name: 'HomeView',
38 
     components: { ProfileCardList },
 56 
     components: { ProfileCardList },
44 
             try {
 62 
             try {
45 
                 const queueList = await fetchQueueByProfileId(this.pid)
 63 
                 const queueList = await fetchQueueByProfileId(this.pid)
46 
                 this.cards = this._reformat(queueList, convertToCard)
 64 
                 this.cards = this._reformat(queueList, convertToCard)
65 
+                const matchList = await fetchMembershipsByProfileId(this.pid)
66 
+                this.matches = this._reformat(matchList, converGroupingToCard)
47 
             } catch (err) {
 67 
             } catch (err) {
48 
                 console.error(err)
 68 
                 console.error(err)
49 
             }
 69 
             }

Write Preview
Loading…
취소
저장