Skip to content

Commit c5e2d77

Browse files
Merge pull request #2273 from appbaseio/ma.fix.vue-examples
fix: vue-examples - reactive-list
2 parents facc8e0 + 6fc4390 commit c5e2d77

File tree

131 files changed

+4214
-3033
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

131 files changed

+4214
-3033
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>AI Answer Demo</title>
8+
</head>
9+
<body>
10+
<div id="app"></div>
11+
<script type="module" src="/src/main.js"></script>
12+
</body>
13+
</html>
Lines changed: 14 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,22 @@
11
{
2-
"name": "ai-answer",
3-
"version": "0.1.0",
2+
"name": "example-vue3",
43
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
56
"scripts": {
6-
"serve": "vue-cli-service serve",
7-
"build": "vue-cli-service build",
8-
"lint": "vue-cli-service lint"
7+
"serve": "volar-preview-vite",
8+
"build": "vue-tsc && vite build",
9+
"preview": "vite preview"
910
},
1011
"dependencies": {
11-
"@appbaseio/reactivesearch-vue": "3.3.0",
12-
"vue": "^3.2.5"
12+
"@appbaseio/reactivesearch-vue": "3.3.0",
13+
"vue": "^3.3.9",
14+
"vuejs-paginate": "^2.1.0"
1315
},
1416
"devDependencies": {
15-
"@vue/cli-plugin-babel": "^5.0.8",
16-
"@vue/cli-service": "^5.0.8",
17-
"@vue/compiler-sfc": "^3.1.0"
18-
},
19-
"eslintConfig": {
20-
"root": true,
21-
"env": {
22-
"node": true
23-
},
24-
"extends": [
25-
"plugin:vue/essential",
26-
"eslint:recommended"
27-
],
28-
"rules": {},
29-
"parserOptions": {
30-
"parser": "babel-eslint"
31-
}
32-
},
33-
"browserslist": [
34-
"> 1%",
35-
"last 2 versions",
36-
"not ie <= 8"
37-
]
17+
"@codesandbox/vue-preview": "^0.1.1-alpha.16",
18+
"@vitejs/plugin-vue": "^4.5.0",
19+
"@vue/babel-preset-app": "^5.0.8",
20+
"vite": "^5.0.4"
21+
}
3822
}

packages/vue/examples/ai-answer/src/App.vue

Lines changed: 90 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,41 @@
11
<template>
2-
<div id="app">
3-
<reactive-base
4-
app="good-books-ds"
5-
url="https://a03a1cb71321:75b6603d-9456-4a5a-af6b-a487b309eb61@appbase-demo-ansible-abxiydt-arc.searchbase.io"
6-
themePreset="light"
7-
>
8-
<search-box
9-
className="result-list-container"
10-
componentId="BookSensor"
11-
:dataField="['original_title', 'original_title.search']"
12-
:URLParams="true"
13-
:size="10"
14-
:enablePopularSuggestions="true"
15-
:popularSuggestionsConfig="{ size: 3, minChars: 2, index: 'good-books-ds' }"
16-
:enableRecentSuggestions="true"
17-
:recentSuggestionsConfig="{
18-
size: 3,
19-
index: 'good-books-ds',
20-
minChars: 4,
21-
}"
22-
:enableAI="false"
23-
:autosuggest="true"
24-
/>
25-
<a-i-answer
26-
className="ai-answer"
27-
componentId="AIComponent"
28-
:react="{ and: ['BookSensor'] }"
29-
title="AI Chat Box"
30-
:showSourceDocuments="true"
31-
:onSourceClick="
32-
(sourceObj) => {
33-
// perform any side effects
34-
console.log('sourceObj', sourceObj);
35-
}
36-
"
37-
>
38-
<!-- <template v-slot:render="{ loading, data, error }">
2+
<div id="app">
3+
<reactive-base
4+
app="good-books-ds"
5+
url="https://a03a1cb71321:75b6603d-9456-4a5a-af6b-a487b309eb61@appbase-demo-ansible-abxiydt-arc.searchbase.io"
6+
theme-preset="light"
7+
>
8+
<search-box
9+
:data-field="['original_title', 'original_title.search']"
10+
:urlparams="true"
11+
:size="10"
12+
:enable-popular-suggestions="true"
13+
:popular-suggestions-config="{ size: 3, minChars: 2, index: 'good-books-ds' }"
14+
:enable-recent-suggestions="true"
15+
:recent-suggestions-config="{
16+
size: 3,
17+
index: 'good-books-ds',
18+
minChars: 4,
19+
}"
20+
:enable-ai="false"
21+
:autosuggest="true"
22+
class-name="result-list-container"
23+
component-id="BookSensor"
24+
/>
25+
<a-i-answer
26+
:react="{ and: ['BookSensor'] }"
27+
:show-source-documents="true"
28+
:on-source-click="
29+
(sourceObj) => {
30+
// perform any side effects
31+
console.log('sourceObj', sourceObj);
32+
}
33+
"
34+
class-name="ai-answer"
35+
component-id="AIComponent"
36+
title="AI Chat Box"
37+
>
38+
<!-- <template v-slot:render="{ loading, data, error }">
3939
<div v-if="loading">loading...</div>
4040
<pre v-else-if="error">{{ JSON.stringify(error) }}</pre>
4141
<div
@@ -60,58 +60,66 @@
6060
<div>{{ JSON.stringify(errorParam) }}</div>
6161
<button v-on:click="handleRetry">fff</button>
6262
</template> -->
63-
</a-i-answer>
64-
<reactive-list
65-
componentId="SearchResult"
66-
dataField="original_title.keyword"
67-
className="result-list-container"
68-
:pagination="true"
69-
:size="5"
70-
:react="{ and: ['BookSensor'] }"
71-
>
72-
<template #renderItem="{ item }">
73-
<div :id="item._id" class="flex book-content" :key="item._id">
74-
<img :src="item.image" alt="Book Cover" class="book-image" />
75-
<div class="flex column justify-center ml20">
76-
<div class="book-header">{{ item.original_title }}</div>
77-
<div class="flex column justify-space-between">
78-
<div>
79-
<div>
80-
by <span class="authors-list">{{ item.authors }}</span>
81-
</div>
82-
<div class="ratings-list flex align-center">
83-
<span class="stars">
84-
<i
85-
v-for="(item, index) in Array(
86-
item.average_rating_rounded,
87-
).fill('x')"
88-
class="fas fa-star"
89-
:key="index"
90-
/>
91-
</span>
92-
<span class="avg-rating"
93-
>({{ item.average_rating }} avg)</span
94-
>
95-
</div>
96-
</div>
97-
<span class="pub-year"
98-
>Pub {{ item.original_publication_year }}</span
99-
>
100-
</div>
101-
</div>
102-
</div>
103-
</template>
104-
</reactive-list>
105-
</reactive-base>
106-
</div>
63+
</a-i-answer>
64+
<reactive-list
65+
:pagination="true"
66+
:size="5"
67+
:react="{ and: ['BookSensor'] }"
68+
component-id="SearchResult"
69+
data-field="original_title.keyword"
70+
class-name="result-list-container"
71+
>
72+
<template #renderItem="{ item }">
73+
<div
74+
:id="item._id"
75+
:key="item._id"
76+
class="flex book-content">
77+
<img
78+
:src="item.image"
79+
alt="Book Cover"
80+
class="book-image" >
81+
<div class="flex column justify-center ml20">
82+
<div class="book-header">{{ item.original_title }}</div>
83+
<div class="flex column justify-space-between">
84+
<div>
85+
<div>
86+
by <span class="authors-list">{{ item.authors }}</span>
87+
</div>
88+
<div class="ratings-list flex align-center">
89+
<span class="stars">
90+
<i
91+
v-for="(item, index) in Array(
92+
item.average_rating_rounded,
93+
).fill('x')"
94+
:key="index"
95+
class="fas fa-star"
96+
/>
97+
</span>
98+
<span
99+
class="avg-rating"
100+
>({{ item.average_rating }} avg)</span
101+
>
102+
</div>
103+
</div>
104+
<span
105+
class="pub-year"
106+
>Pub {{ item.original_publication_year }}</span
107+
>
108+
</div>
109+
</div>
110+
</div>
111+
</template>
112+
</reactive-list>
113+
</reactive-base>
114+
</div>
107115
</template>
108116

109117
<script>
110118
import './styles.css';
111119
import { ReactiveBase, ReactiveList, SearchBox, AIAnswer } from '@appbaseio/reactivesearch-vue';
112120
113121
export default {
114-
name: 'app',
122+
name: 'App',
115123
components: { ReactiveBase, ReactiveList, SearchBox, AIAnswer },
116124
methods: {
117125
getMessageStyle(message) {
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
/* eslint-disable import/no-extraneous-dependencies */
2+
import { defineConfig } from 'vite'
3+
import vue from '@vitejs/plugin-vue'
4+
5+
// https://vitejs.dev/config/
6+
export default defineConfig({
7+
optimizeDeps: {
8+
include: [
9+
'@appbaseio/reactivecore',
10+
'@appbaseio/reactivesearch-vue',
11+
'fast-deep-equal',
12+
],
13+
},
14+
plugins: [vue()],
15+
build: {
16+
rollupOptions: {
17+
input: 'src/main.js'
18+
},
19+
commonjsOptions: {
20+
include: [/reactivecore/, /reactivesearch/, /node_modules/],
21+
},
22+
}
23+
})
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Analytics with Hook Demo</title>
8+
</head>
9+
<body>
10+
<div id="app"></div>
11+
<script type="module" src="/src/main.js"></script>
12+
</body>
13+
</html>
Lines changed: 14 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,22 @@
11
{
2-
"name": "analytics-with-hook-vue",
3-
"version": "0.1.0",
2+
"name": "example-vue3",
43
"private": true,
4+
"version": "0.0.0",
5+
"type": "module",
56
"scripts": {
6-
"serve": "vue-cli-service serve",
7-
"build": "vue-cli-service build",
8-
"lint": "vue-cli-service lint"
7+
"serve": "volar-preview-vite",
8+
"build": "vue-tsc && vite build",
9+
"preview": "vite preview"
910
},
1011
"dependencies": {
11-
"@appbaseio/reactivesearch-vue": "3.3.0",
12-
"vue": "^3.2.5"
12+
"@appbaseio/reactivesearch-vue": "3.3.0",
13+
"vue": "^3.3.9",
14+
"vuejs-paginate": "^2.1.0"
1315
},
1416
"devDependencies": {
15-
"@vue/cli-plugin-babel": "^5.0.8",
16-
"@vue/cli-service": "^5.0.8",
17-
"@vue/compiler-sfc": "^3.1.0"
18-
},
19-
"eslintConfig": {
20-
"root": true,
21-
"env": {
22-
"node": true
23-
},
24-
"extends": [
25-
"plugin:vue/essential",
26-
"eslint:recommended"
27-
],
28-
"rules": {},
29-
"parserOptions": {
30-
"parser": "babel-eslint"
31-
}
32-
},
33-
"browserslist": [
34-
"> 1%",
35-
"last 2 versions",
36-
"not ie <= 8"
37-
]
17+
"@codesandbox/vue-preview": "^0.1.1-alpha.16",
18+
"@vitejs/plugin-vue": "^4.5.0",
19+
"@vue/babel-preset-app": "^5.0.8",
20+
"vite": "^5.0.4"
21+
}
3822
}

0 commit comments

Comments
 (0)