@live-change/user-frontend 0.9.30 → 0.9.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -4,9 +4,11 @@
|
|
|
4
4
|
<div>
|
|
5
5
|
<h1>Notifications settings</h1>
|
|
6
6
|
</div>
|
|
7
|
+
<pre>{{ settings }}</pre>
|
|
8
|
+
<pre>{{ clientConfig }}</pre>
|
|
7
9
|
<div v-for="notificationType in settings">
|
|
8
10
|
<div>
|
|
9
|
-
<h2>{{ notificationType.type }}</h2>
|
|
11
|
+
<h2>{{ t(`notifications.types.${notificationType.type}.name`) }}</h2>
|
|
10
12
|
</div>
|
|
11
13
|
<div>
|
|
12
14
|
<div v-for="contact in notificationType.contacts"
|
|
@@ -40,13 +42,16 @@
|
|
|
40
42
|
import { api as useApi, live, path, actions } from '@live-change/vue3-ssr'
|
|
41
43
|
const api = useApi()
|
|
42
44
|
|
|
45
|
+
import { useI18n } from 'vue-i18n'
|
|
46
|
+
const { t } = useI18n()
|
|
47
|
+
|
|
43
48
|
const clientConfig = api.getServiceDefinition('notification')?.clientConfig
|
|
44
49
|
|
|
45
50
|
const notificationApi = actions().notification
|
|
46
51
|
|
|
47
52
|
|
|
48
53
|
const contactTypesIcons = {
|
|
49
|
-
email: 'pi-
|
|
54
|
+
email: 'pi-envelope',
|
|
50
55
|
web: 'pi-globe',
|
|
51
56
|
phone: 'pi-phone'
|
|
52
57
|
}
|
|
@@ -89,7 +94,11 @@
|
|
|
89
94
|
const settings = computed(() => clientConfig.notificationTypes.map(notificationType => {
|
|
90
95
|
const contacts = allContacts.map(contactsData => contactsData.list.value.map(contact => {
|
|
91
96
|
const contactType = contactsData.type
|
|
92
|
-
const settingSource = computed(() =>
|
|
97
|
+
const settingSource = computed(() => {
|
|
98
|
+
const userSetting = contact.settings.find(s => s.notificationType === notificationType)
|
|
99
|
+
//const defaultSetting = clientConfig.defaultSettings.find(s => s.notificationType === notificationType)
|
|
100
|
+
return userSetting
|
|
101
|
+
})
|
|
93
102
|
const setting = synchronized({
|
|
94
103
|
source: settingSource,
|
|
95
104
|
update: notificationApi.setOrUpdateNotificationSetting,
|
|
@@ -104,7 +113,8 @@
|
|
|
104
113
|
contactType,
|
|
105
114
|
contact: contact[contactType],
|
|
106
115
|
settingSource,
|
|
107
|
-
setting
|
|
116
|
+
setting,
|
|
117
|
+
|
|
108
118
|
}
|
|
109
119
|
})).flat()
|
|
110
120
|
return {
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="flex flex-row align-items-center">
|
|
3
|
+
<AutoComplete v-model="selectedCountry" dropdown optionLabel="name"
|
|
4
|
+
:suggestions="filteredCountries" @complete="searchCountry"
|
|
5
|
+
class="mr-2 w-14rem">
|
|
6
|
+
<template #option="slotProps">
|
|
7
|
+
<div class="flex align-items-center">
|
|
8
|
+
<img :alt="slotProps.option.name"
|
|
9
|
+
src="../../public/images/flag_placeholder.png"
|
|
10
|
+
:class="`flag flag-${slotProps.option.code.toLowerCase()} mr-2`"
|
|
11
|
+
style="width: 18px; height: 12.27px" />
|
|
12
|
+
<div>{{ slotProps.option.name }}</div>
|
|
13
|
+
</div>
|
|
14
|
+
</template>
|
|
15
|
+
</AutoComplete>
|
|
16
|
+
</div>
|
|
17
|
+
</template>
|
|
18
|
+
|
|
19
|
+
<script setup>
|
|
20
|
+
|
|
21
|
+
import AutoComplete from 'primevue/autocomplete'
|
|
22
|
+
|
|
23
|
+
import countries from '../utils/countries.js'
|
|
24
|
+
|
|
25
|
+
import { defineProps, defineModel, toRefs, ref, computed, watch } from 'vue'
|
|
26
|
+
|
|
27
|
+
const phoneInput = ref()
|
|
28
|
+
|
|
29
|
+
const value = defineModel({
|
|
30
|
+
type: String,
|
|
31
|
+
required: true
|
|
32
|
+
})
|
|
33
|
+
|
|
34
|
+
const props = defineProps({
|
|
35
|
+
id: {
|
|
36
|
+
type: String,
|
|
37
|
+
required: true
|
|
38
|
+
},
|
|
39
|
+
})
|
|
40
|
+
|
|
41
|
+
const selectedCountry = ref()
|
|
42
|
+
watch(value, (newValue) => {
|
|
43
|
+
if(!newValue) return
|
|
44
|
+
const found = countries.find((country) => newValue.startsWith(country.name))
|
|
45
|
+
if(found) selectedCountry.value = found
|
|
46
|
+
})
|
|
47
|
+
|
|
48
|
+
const filteredCountries = ref(countries)
|
|
49
|
+
function searchCountry(event) {
|
|
50
|
+
if(!event) return
|
|
51
|
+
const numbers = event.query.replace(/[^\d]/g, '')
|
|
52
|
+
console.log("Search country", event.query, numbers, selectedCountry.value)
|
|
53
|
+
filteredCountries.value = countries.filter((country) =>
|
|
54
|
+
country.name.toLowerCase().startsWith(event.query.toLowerCase())
|
|
55
|
+
|| country.code.toLowerCase().startsWith(event.query.toLowerCase())
|
|
56
|
+
|| (numbers.length > 0 && country.dial_code.replace(/[^\d]/g, '').startsWith(numbers))
|
|
57
|
+
)
|
|
58
|
+
console.log("Found", filteredCountries.value)
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
watch(selectedCountry, (country) => {
|
|
62
|
+
value.value = country?.name || country
|
|
63
|
+
})
|
|
64
|
+
|
|
65
|
+
import { usePath, live } from '@live-change/vue3-ssr'
|
|
66
|
+
const path = usePath()
|
|
67
|
+
const geoIpPath = path.geoIp.myCountry({})
|
|
68
|
+
|
|
69
|
+
const myCountry = await live(geoIpPath)
|
|
70
|
+
|
|
71
|
+
if(selectedCountry.value == null) {
|
|
72
|
+
selectedCountry.value = countries.find(c => c.code.toLowerCase() === myCountry.value.toLowerCase())
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
</script>
|
|
76
|
+
|
|
77
|
+
|
|
78
|
+
<style scoped lang="scss">
|
|
79
|
+
@use "../utils/flags.scss";
|
|
80
|
+
</style>
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
|
|
13
13
|
<SettingsMenuItem name="user:locale" icon="language" label="Language and Locale" class="hidden md:block" />
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
<SettingsMenuItem name="user:notificationsSettings" icon="exclamation-circle" label="Notifications" />
|
|
16
16
|
|
|
17
17
|
</ul>
|
|
18
18
|
|
package/index.js
CHANGED
|
@@ -19,7 +19,8 @@ export { GoogleAccess }
|
|
|
19
19
|
|
|
20
20
|
export * from "./front/src/phone/phoneNumber.js"
|
|
21
21
|
import PhoneInput from "./front/src/phone/PhoneInput.vue"
|
|
22
|
-
|
|
22
|
+
import CountryInput from './front/src/phone/CountryInput.vue'
|
|
23
|
+
export { PhoneInput, CountryInput }
|
|
23
24
|
|
|
24
25
|
export * from './front/src/connected/connected.js'
|
|
25
26
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@live-change/user-frontend",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.32",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"memDev": "node --inspect --expose-gc server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
|
|
6
6
|
"localDevInit": "rm tmp.db; node server/start.js localDev --enableSessions --initScript ./init.js",
|
|
@@ -22,29 +22,29 @@
|
|
|
22
22
|
},
|
|
23
23
|
"type": "module",
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@live-change/cli": "^0.9.
|
|
26
|
-
"@live-change/dao": "^0.9.
|
|
27
|
-
"@live-change/dao-vue3": "^0.9.
|
|
28
|
-
"@live-change/dao-websocket": "^0.9.
|
|
29
|
-
"@live-change/email-service": "^0.9.
|
|
30
|
-
"@live-change/framework": "^0.9.
|
|
31
|
-
"@live-change/identicon-service": "^0.9.
|
|
32
|
-
"@live-change/image-frontend": "^0.9.
|
|
33
|
-
"@live-change/message-authentication-service": "^0.9.
|
|
34
|
-
"@live-change/notification-service": "^0.9.
|
|
35
|
-
"@live-change/password-authentication-service": "^0.9.
|
|
36
|
-
"@live-change/pattern": "^0.9.
|
|
37
|
-
"@live-change/secret-code-service": "^0.9.
|
|
38
|
-
"@live-change/secret-link-service": "^0.9.
|
|
39
|
-
"@live-change/security-frontend": "^0.9.
|
|
40
|
-
"@live-change/security-service": "^0.9.
|
|
41
|
-
"@live-change/session-service": "^0.9.
|
|
42
|
-
"@live-change/timer-service": "^0.9.
|
|
43
|
-
"@live-change/upload-service": "^0.9.
|
|
44
|
-
"@live-change/user-identification-service": "^0.9.
|
|
45
|
-
"@live-change/user-service": "^0.9.
|
|
46
|
-
"@live-change/vue3-components": "^0.9.
|
|
47
|
-
"@live-change/vue3-ssr": "^0.9.
|
|
25
|
+
"@live-change/cli": "^0.9.32",
|
|
26
|
+
"@live-change/dao": "^0.9.32",
|
|
27
|
+
"@live-change/dao-vue3": "^0.9.32",
|
|
28
|
+
"@live-change/dao-websocket": "^0.9.32",
|
|
29
|
+
"@live-change/email-service": "^0.9.32",
|
|
30
|
+
"@live-change/framework": "^0.9.32",
|
|
31
|
+
"@live-change/identicon-service": "^0.9.32",
|
|
32
|
+
"@live-change/image-frontend": "^0.9.32",
|
|
33
|
+
"@live-change/message-authentication-service": "^0.9.32",
|
|
34
|
+
"@live-change/notification-service": "^0.9.32",
|
|
35
|
+
"@live-change/password-authentication-service": "^0.9.32",
|
|
36
|
+
"@live-change/pattern": "^0.9.32",
|
|
37
|
+
"@live-change/secret-code-service": "^0.9.32",
|
|
38
|
+
"@live-change/secret-link-service": "^0.9.32",
|
|
39
|
+
"@live-change/security-frontend": "^0.9.32",
|
|
40
|
+
"@live-change/security-service": "^0.9.32",
|
|
41
|
+
"@live-change/session-service": "^0.9.32",
|
|
42
|
+
"@live-change/timer-service": "^0.9.32",
|
|
43
|
+
"@live-change/upload-service": "^0.9.32",
|
|
44
|
+
"@live-change/user-identification-service": "^0.9.32",
|
|
45
|
+
"@live-change/user-service": "^0.9.32",
|
|
46
|
+
"@live-change/vue3-components": "^0.9.32",
|
|
47
|
+
"@live-change/vue3-ssr": "^0.9.32",
|
|
48
48
|
"@vueuse/core": "^12.3.0",
|
|
49
49
|
"codeceptjs-assert": "^0.0.5",
|
|
50
50
|
"codeceptjs-video-helper": "0.1.3",
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
"wtfnode": "^0.9.1"
|
|
66
66
|
},
|
|
67
67
|
"devDependencies": {
|
|
68
|
-
"@live-change/codeceptjs-helper": "^0.9.
|
|
68
|
+
"@live-change/codeceptjs-helper": "^0.9.32",
|
|
69
69
|
"codeceptjs": "^3.6.10",
|
|
70
70
|
"generate-password": "1.7.1",
|
|
71
71
|
"playwright": "1.49.1",
|
|
@@ -76,5 +76,5 @@
|
|
|
76
76
|
"author": "Michał Łaszczewski <michal@laszczewski.pl>",
|
|
77
77
|
"license": "BSD-3-Clause",
|
|
78
78
|
"description": "",
|
|
79
|
-
"gitHead": "
|
|
79
|
+
"gitHead": "41022fc283020e2da3e82aa27274401052d2379a"
|
|
80
80
|
}
|