|
4 | 4 | <ScotNavBar style="z-index: 99;"/>
|
5 | 5 | <v-main style="max-height: 100vh">
|
6 | 6 | <QuickSettingsDrawer />
|
7 |
| - <v-dialog v-if="searchResults != undefined" :value="showSearchOverlay"> |
8 |
| - <v-card rounded :light="darkMode" :dark="!darkMode" v-click-outside="onClickOutsideOverlay" elevation="5"> |
9 |
| - <v-card-title class="text-decoration-underline">Search Results</v-card-title> |
10 |
| - <v-card-subtitle> {{ searchResults.length }} results </v-card-subtitle> |
11 |
| - <v-list two-line> |
12 |
| - <v-list-item v-for="(result, index) in searchResults" :key="result.entry_id" :href="constructSearchLink(result.target_type, result.target_id, result.entry_id)" :link=true target="_blank"> |
13 |
| - <v-list-item-icon> |
14 |
| - <v-icon> mdi-magnify</v-icon> |
15 |
| - </v-list-item-icon> |
16 |
| - <v-list-item-content> |
17 |
| - <v-list-item-title class="text-decoration-underline" v-html="result.target_type.charAt(0).toUpperCase() + result.target_type.slice(1) + ' ' + result.target_id + ' : ' + result.parent_text"></v-list-item-title> |
18 |
| - <v-list-item-subtitle> |
19 |
| - <i> |
20 |
| - {{ "Entry " }} |
21 |
| - <b>{{ result.entry_id}} </b> |
22 |
| - </i> |
23 |
| - </v-list-item-subtitle> |
24 |
| - <v-list-item-subtitle v-html="result.entry_text"> |
25 |
| - </v-list-item-subtitle> |
26 |
| - <v-divider inset |
27 |
| - v-if="index < searchResults.length - 1" |
28 |
| - :key="index"></v-divider> |
29 |
| - </v-list-item-content> |
30 |
| - </v-list-item> |
31 |
| - </v-list> |
32 |
| - </v-card> |
33 |
| - </v-dialog> |
34 |
| - <router-view> |
35 |
| - </router-view> |
| 7 | + <SearchDialog v-if="showSearchOverlay"/> |
| 8 | + <router-view></router-view> |
36 | 9 | </v-main>
|
37 | 10 | <v-footer app padless>
|
38 | 11 | <v-card elevation=0 width="100%" class="text-center">
|
|
43 | 16 | <v-snackbar v-model="showErrorPopup"
|
44 | 17 | multi-line>
|
45 | 18 | {{ errorText }}
|
46 |
| - |
47 | 19 | <template v-slot:action="{ attrs }">
|
48 | 20 | <v-btn color="red"
|
49 | 21 | text
|
|
62 | 34 | import Component from 'vue-class-component';
|
63 | 35 | import ScotNavBar from '@/components/NavigationComponents/ScotNavBar.vue'
|
64 | 36 | import QuickSettingsDrawer from '@/components/UserSettingsComponent/QuickSettingsDrawer.vue'
|
65 |
| - import { Action, Getter, Mutation } from 'vuex-class'; |
| 37 | + import SearchDialog from '@/components/IRElementComponents/SearchDialog.vue' |
| 38 | + import { Getter, Mutation } from 'vuex-class'; |
66 | 39 | import { Watch } from 'vue-property-decorator'
|
67 | 40 | import { IRElementType } from './store/modules/IRElements/types';
|
68 | 41 |
|
69 | 42 | @Component({
|
70 | 43 | components: {
|
71 | 44 | ScotNavBar,
|
72 |
| - QuickSettingsDrawer |
| 45 | + QuickSettingsDrawer, |
| 46 | + SearchDialog |
73 | 47 | },
|
74 | 48 | })
|
75 | 49 | export default class App extends Vue {
|
|
78 | 52 | @Getter('darkMode', { 'namespace': 'user' }) darkMode: boolean
|
79 | 53 | @Getter('firehose', { 'namespace': 'user' }) firehose: EventSource | undefined
|
80 | 54 | @Getter('error') error: boolean
|
81 |
| - @Getter('searchResults', { 'namespace': 'user' }) searchResults: any |
82 |
| - @Action('clearSearchResults', { 'namespace': 'user' }) clearSearchResults: CallableFunction |
83 | 55 | @Getter('errorText') errorText: string
|
84 | 56 | @Getter('showSearchOverlay', { 'namespace': 'user' }) showSearchOverlay: boolean
|
85 |
| - @Action('changeShowSearchOverlay', { 'namespace': 'user' }) changeShowSearchOverlay: CallableFunction |
86 | 57 | @Mutation('clearError') clearError: CallableFunction
|
87 | 58 | metaInfo() {
|
88 | 59 | return { meta: [{ "http-equiv": "Content-Security-Policy", "content": "upgrade-insecure-requests" }] }
|
|
104 | 75 | }
|
105 | 76 | }
|
106 | 77 |
|
107 |
| - constructSearchLink(targetType: string, targetId: number, entryId: number): string { |
108 |
| - return window.location.protocol + "//" + window.location.host + "/#/" + this.targetTypePluralized(targetType) + "/" + targetId + "/" + entryId |
109 |
| - } |
110 |
| -
|
111 |
| - targetTypePluralized(targetType: string): string | null { |
112 |
| - if (targetType == IRElementType.Entity.toLowerCase()) { |
113 |
| - return "entities" |
114 |
| - } |
115 |
| - else if (targetType == IRElementType.Dispatch.toLowerCase()) { |
116 |
| - return "dispatches" |
117 |
| - } |
118 |
| - else if (targetType == IRElementType.EntityClass.toLowerCase()) { |
119 |
| - return "entity classes" |
120 |
| - } |
121 |
| - else if (targetType == IRElementType.Entry.toLowerCase()) { |
122 |
| - return "entries" |
123 |
| - } |
124 |
| - else { |
125 |
| - return targetType + "s" |
126 |
| - } |
127 |
| - } |
128 |
| -
|
129 |
| - async onClickOutsideOverlay() { |
130 |
| - await this.changeShowSearchOverlay({ value: false }) |
131 |
| - } |
132 |
| -
|
133 | 78 | @Watch('darkMode')
|
134 | 79 | onDarkModeChange() {
|
135 | 80 | this.$vuetify.theme.dark = this.darkMode
|
136 | 81 | }
|
| 82 | +
|
137 | 83 | transitionName() {
|
138 | 84 | if (this.$route.meta && this.$route.meta.transitionName != undefined) {
|
139 | 85 | return this.$route.meta.transitionName
|
|
0 commit comments