@live-change/url-frontend 0.2.22 → 0.2.23
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.
- package/front/src/UrlsListPage.vue +33 -0
- package/front/src/components/UrlsList.vue +122 -0
- package/front/src/router.js +12 -0
- package/index.js +3 -0
- package/package.json +10 -10
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div class="w-full sm:w-12 md:w-9 lg:w-7 surface-card p-4 shadow-2 border-round">
|
|
3
|
+
<div class="text-center mb-5">
|
|
4
|
+
<div class="text-900 text-3xl font-medium mb-3">
|
|
5
|
+
Urls List
|
|
6
|
+
</div>
|
|
7
|
+
</div>
|
|
8
|
+
<p>{{ targetType }}</p>
|
|
9
|
+
<UrlsList :targetType="targetType" />
|
|
10
|
+
</div>
|
|
11
|
+
</template>
|
|
12
|
+
|
|
13
|
+
<script setup>
|
|
14
|
+
import UrlsList from "./components/UrlsList.vue"
|
|
15
|
+
|
|
16
|
+
const props = defineProps({
|
|
17
|
+
targetType: {
|
|
18
|
+
type: String,
|
|
19
|
+
required: true
|
|
20
|
+
}
|
|
21
|
+
})
|
|
22
|
+
|
|
23
|
+
import { toRefs } from '@vueuse/core'
|
|
24
|
+
|
|
25
|
+
const { targetType } = toRefs(props)
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
</script>
|
|
30
|
+
|
|
31
|
+
<style scoped>
|
|
32
|
+
|
|
33
|
+
</style>
|
|
@@ -0,0 +1,122 @@
|
|
|
1
|
+
<template>
|
|
2
|
+
<div>
|
|
3
|
+
<div v-for="(bucket, bucketIndex) in urlsBuckets.buckets" :key="bucket.id">
|
|
4
|
+
<div v-for="(url, index) in bucket.data"
|
|
5
|
+
:key="url.id"
|
|
6
|
+
:ref="el => bucket.domElements[index] = el"
|
|
7
|
+
class="mb-1">
|
|
8
|
+
<!-- <pre>{{ JSON.stringify(url, null, ' ') }}</pre>-->
|
|
9
|
+
<div class="flex flex-row align-items-center">
|
|
10
|
+
<div class="flex-shrink-0 mr-2">
|
|
11
|
+
<i class="pi pi-globe text-2xl" />
|
|
12
|
+
</div>
|
|
13
|
+
<div class="flex flex-row flex-grow-1 flex-wrap">
|
|
14
|
+
<div class="py-1 flex-grow-0">
|
|
15
|
+
<router-link :to="urlLink(url)">{{ urlLink(url) }}</router-link>
|
|
16
|
+
</div>
|
|
17
|
+
<div v-if="url.type == 'redirect'" class="flex flex-row align-items-center">
|
|
18
|
+
<div class="flex-shrink-0 mr-2 ml-5">
|
|
19
|
+
<i class="pi pi-arrow-right text-2xl" />
|
|
20
|
+
</div>
|
|
21
|
+
<div class="py-1 flex-grow-0">
|
|
22
|
+
<router-link :to="urlLink(url.canonical)">{{ urlLink(url.canonical) }}</router-link>
|
|
23
|
+
</div>
|
|
24
|
+
</div>
|
|
25
|
+
</div>
|
|
26
|
+
<div class="ml-2">
|
|
27
|
+
<router-link v-if="editButtons" :to="editorRoute(targetType, url.target)" class="no-underline">
|
|
28
|
+
<Button icon="pi pi-pencil" class="p-button-rounded p-button-warning mb-1" />
|
|
29
|
+
</router-link>
|
|
30
|
+
</div>
|
|
31
|
+
</div>
|
|
32
|
+
</div>
|
|
33
|
+
</div>
|
|
34
|
+
<scroll-border placement="bottom"
|
|
35
|
+
:load="urlsBuckets.loadBottom"
|
|
36
|
+
:canLoad="urlsBuckets.canLoadBottom" />
|
|
37
|
+
</div>
|
|
38
|
+
</template>
|
|
39
|
+
|
|
40
|
+
<script setup>
|
|
41
|
+
import ScrollBorder from 'vue3-scroll-border'
|
|
42
|
+
import Button from "primevue/button"
|
|
43
|
+
|
|
44
|
+
const props = defineProps({
|
|
45
|
+
targetType: {
|
|
46
|
+
type: String,
|
|
47
|
+
required: true
|
|
48
|
+
},
|
|
49
|
+
urlPrefix: {
|
|
50
|
+
type: String,
|
|
51
|
+
default: '/'
|
|
52
|
+
},
|
|
53
|
+
domain: {
|
|
54
|
+
type: String,
|
|
55
|
+
default: null
|
|
56
|
+
},
|
|
57
|
+
editButtons: {
|
|
58
|
+
type: Boolean,
|
|
59
|
+
default: false
|
|
60
|
+
},
|
|
61
|
+
editorRoute: {
|
|
62
|
+
type: Function,
|
|
63
|
+
default: (objectType, object) => {
|
|
64
|
+
const [service, type] = objectType.split('_')
|
|
65
|
+
const prop = type[0].toLowerCase()+type.slice(1)
|
|
66
|
+
return { name: `${service}:${prop}Editor`, params: { [prop+'Id']: object }}
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
})
|
|
70
|
+
|
|
71
|
+
import { toRefs } from "@vueuse/core"
|
|
72
|
+
const { targetType, urlPrefix, domain, editButtons, editorRoute } = toRefs(props)
|
|
73
|
+
|
|
74
|
+
import { computed } from 'vue'
|
|
75
|
+
import { path, live, actions, api, rangeBuckets, reverseRange } from '@live-change/vue3-ssr'
|
|
76
|
+
import {useHost} from "../../../../frontend-base";
|
|
77
|
+
const urlApi = actions().url
|
|
78
|
+
|
|
79
|
+
const urlPathBaseFunction = computed(() => domain.value
|
|
80
|
+
? (range, p) => p.url.urlsByTargetTypeAndDomain({targetType: targetType.value, domain: domain.value, ...range})
|
|
81
|
+
: (range, p) => {
|
|
82
|
+
console.log("P", p, "RANGE", range)
|
|
83
|
+
return p.url.urlsByTargetType({targetType: targetType.value, ...range})
|
|
84
|
+
}
|
|
85
|
+
)
|
|
86
|
+
|
|
87
|
+
const urlPathFunction = computed(() => (range, p) => urlPathBaseFunction.value(range, p)
|
|
88
|
+
.with(url => url.type.$switch({
|
|
89
|
+
'canonical': null,
|
|
90
|
+
'redirect': p.url.targetOwnedCanonical({ targetType: targetType.value, target: url.target })
|
|
91
|
+
}).$bind('canonical'))
|
|
92
|
+
//.with(url => p.accessControl.myAccessTo({ objectType: targetType, object: url.target }).bind('access'))
|
|
93
|
+
)
|
|
94
|
+
|
|
95
|
+
/*const [ urls ] = await Promise.all([
|
|
96
|
+
live(computed(() => urlPathFunction.value({ limit: 1000 })))
|
|
97
|
+
])*/
|
|
98
|
+
|
|
99
|
+
const [ urlsBuckets ] = await Promise.all([
|
|
100
|
+
rangeBuckets(
|
|
101
|
+
(range, p) => urlPathFunction.value(range, p),
|
|
102
|
+
{ bucketSize: 20 }
|
|
103
|
+
)
|
|
104
|
+
])
|
|
105
|
+
|
|
106
|
+
const urlDomain = useHost()
|
|
107
|
+
|
|
108
|
+
function urlLink(url) {
|
|
109
|
+
let prefix = urlPrefix.value
|
|
110
|
+
if(url.domain && url.domain != urlDomain) {
|
|
111
|
+
//const protocol = typeof window !== 'undefined' ? window.location.protocol : 'https:'
|
|
112
|
+
const port = typeof window !== 'undefined' ? window.location.port : ''
|
|
113
|
+
prefix = '//' + url.domain + (port ? ':' + port : '') + urlPrefix.value
|
|
114
|
+
}
|
|
115
|
+
return prefix + url.path
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
</script>
|
|
119
|
+
|
|
120
|
+
<style scoped>
|
|
121
|
+
|
|
122
|
+
</style>
|
package/front/src/router.js
CHANGED
|
@@ -24,6 +24,18 @@ export function wysiwygRoutes(config = {}) {
|
|
|
24
24
|
}
|
|
25
25
|
}),
|
|
26
26
|
|
|
27
|
+
route({
|
|
28
|
+
name: 'urls:exampleListPage',
|
|
29
|
+
path: prefix + 'list',
|
|
30
|
+
component: () => import("./UrlsListPage.vue"),
|
|
31
|
+
props: {
|
|
32
|
+
targetType: 'example_Example',
|
|
33
|
+
},
|
|
34
|
+
meta: {
|
|
35
|
+
wide: true
|
|
36
|
+
}
|
|
37
|
+
}),
|
|
38
|
+
|
|
27
39
|
...dbAdminRoutes({ prefix: '/_db', route: r => ({ ...r, meta: { ...r.meta, raw: true }}) })
|
|
28
40
|
|
|
29
41
|
]
|
package/index.js
CHANGED
|
@@ -4,6 +4,9 @@ export { Urls }
|
|
|
4
4
|
import UrlsInfo from "./front/src/components/UrlsInfo.vue"
|
|
5
5
|
export { UrlsInfo }
|
|
6
6
|
|
|
7
|
+
import UrlsList from "./front/src/components/UrlsList.vue"
|
|
8
|
+
export { UrlsList }
|
|
9
|
+
|
|
7
10
|
import TakeUrlForm from "./front/src/components/TakeUrlForm.vue"
|
|
8
11
|
export { TakeUrlForm }
|
|
9
12
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@live-change/url-frontend",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.23",
|
|
4
4
|
"scripts": {
|
|
5
5
|
"memDev": "lcli memDev --enableSessions --initScript ./init.js --dbAccess",
|
|
6
6
|
"localDevInit": "rm tmp.db; lcli localDev --enableSessions --initScript ./init.js",
|
|
@@ -21,16 +21,16 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@fortawesome/fontawesome-free": "^6.2.0",
|
|
24
|
-
"@live-change/cli": "0.7.
|
|
24
|
+
"@live-change/cli": "0.7.8",
|
|
25
25
|
"@live-change/dao": "0.5.8",
|
|
26
26
|
"@live-change/dao-vue3": "0.5.8",
|
|
27
27
|
"@live-change/dao-websocket": "0.5.8",
|
|
28
|
-
"@live-change/framework": "0.7.
|
|
29
|
-
"@live-change/password-authentication-service": "0.3.
|
|
30
|
-
"@live-change/prosemirror-service": "0.3.
|
|
31
|
-
"@live-change/secret-code-service": "0.3.
|
|
32
|
-
"@live-change/secret-link-service": "0.3.
|
|
33
|
-
"@live-change/session-service": "0.3.
|
|
28
|
+
"@live-change/framework": "0.7.8",
|
|
29
|
+
"@live-change/password-authentication-service": "0.3.10",
|
|
30
|
+
"@live-change/prosemirror-service": "0.3.10",
|
|
31
|
+
"@live-change/secret-code-service": "0.3.10",
|
|
32
|
+
"@live-change/secret-link-service": "0.3.10",
|
|
33
|
+
"@live-change/session-service": "0.3.10",
|
|
34
34
|
"@live-change/vue3-components": "0.2.16",
|
|
35
35
|
"@live-change/vue3-ssr": "0.2.16",
|
|
36
36
|
"@vueuse/core": "^9.1.0",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"vue3-scroll-border": "0.1.4"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@live-change/codeceptjs-helper": "0.7.
|
|
54
|
+
"@live-change/codeceptjs-helper": "0.7.8",
|
|
55
55
|
"@wdio/selenium-standalone-service": "^7.20.8",
|
|
56
56
|
"codeceptjs": "^3.3.4",
|
|
57
57
|
"generate-password": "1.7.0",
|
|
@@ -63,5 +63,5 @@
|
|
|
63
63
|
"author": "",
|
|
64
64
|
"license": "ISC",
|
|
65
65
|
"description": "",
|
|
66
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "1fd24d66ea25432bff4a9a9cb8435a489bfaa602"
|
|
67
67
|
}
|