@live-change/balance-frontend 0.9.31 → 0.9.33

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.
Files changed (4) hide show
  1. package/front/src/Balance.vue +43 -38
  2. package/front/src/Index.vue +15 -12
  3. package/front/src/components/OperationsList.vue +6 -6
  4. package/package.json +39 -39
package/front/src/Balance.vue CHANGED
@@ -1,6 +1,6 @@
1
1
  <template>
2
2
  <div class="w-full">
3
- <div class="surface-card shadow-1 border-round p-3 mb-1">
3
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 mb-1">
4
4
  <div class="text-xl">Balance: {{ balance.owner }}</div>
5
5
  <div>
6
6
  Amount:
@@ -11,21 +11,21 @@
11
11
  <BalanceDisplay :available="true" ownerType="balanceTest_balance" :owner="name" />
12
12
  </div>
13
13
  </div>
14
- <div class="surface-card shadow-1 border-round p-3 text-xl mb-1 mt-2 text-xl">
14
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 text-xl mb-1 mt-2 text-xl">
15
15
  Operations:
16
16
  </div>
17
- <div v-if="startedOperations.length === 0" class="surface-card shadow-1 border-round p-3 mb-1">
17
+ <div v-if="startedOperations.length === 0" class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 mb-1">
18
18
  No operations started
19
19
  </div>
20
20
  <div v-for="operation of startedOperations"
21
- class="surface-card shadow-1 border-round mb-1 flex flex-row align-items-center">
22
- <div class="flex-1 flex-grow pl-3">
21
+ class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border mb-1 flex flex-row items-center">
22
+ <div class="flex-1 flex-grow pl-4">
23
23
  {{ operation.cause }}
24
24
  </div>
25
- <div class="w-15rem text-right pl-3 font-semibold mr-3">
25
+ <div class="w-60 text-right pl-4 font-semibold mr-4">
26
26
  {{ operation.createdAt }}
27
27
  </div>
28
- <div class="w-10rem text-right pl-3 font-semibold mr-3"
28
+ <div class="w-40 text-right pl-4 font-semibold mr-4"
29
29
  :class="operation.change > 0 ? 'text-green-500' : 'text-red-500'">
30
30
  {{ operation.change > 0 ? '+' : '-' }} <CurrencyDisplay :value="Math.abs(+operation.change)" />
31
31
  </div>
@@ -37,65 +37,69 @@
37
37
  </div>
38
38
 
39
39
  <div class="flex flex-row">
40
- <div class="surface-card shadow-1 border-round p-3 text-xl mt-3 flex-1">
40
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 text-xl mt-4 flex-1">
41
41
  <div class="text-xl mb-2">Start operation</div>
42
42
  <command-form service="balanceTest" action="startOperation"
43
43
  :parameters="{ balance: balance.id }"
44
44
  v-slot="{ data }" reset-on-done>
45
- <div class="col-12 md:col-6 py-1">
46
- <div class="p-field mb-3">
47
- <label for="email" class="block text-900 font-medium mb-2">
45
+ <div class="col-span-12 md:col-span-6 py-1">
46
+ <div class="p-field mb-4">
47
+ <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
48
48
  Name
49
49
  </label>
50
50
  <InputText id="name" type="text" class="w-full"
51
- aria-describedby="email-help" :class="{ 'p-invalid': data.nameError }"
51
+ aria-describedby="email-help" :invalid="!!data.nameError"
52
52
  v-model="data.name" />
53
- <small v-if="data.nameError" id="email-help" class="p-error">
53
+ <Message v-if="data.nameError" severity="error" variant="simple" size="small">
54
54
  {{ t(`errors.${data.nameError}`) }}
55
- </small>
55
+ </Message>
56
56
  </div>
57
57
  </div>
58
- <div class="col-12 md:col-6 py-1">
59
- <div class="p-field mb-3">
60
- <label for="email" class="block text-900 font-medium mb-2">
58
+ <div class="col-span-12 md:col-span-6 py-1">
59
+ <div class="p-field mb-4">
60
+ <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
61
61
  Change
62
62
  </label>
63
63
  <InputNumber id="name" type="text" class="w-full" :min="-1000000" :max="1000000" showButtons :step="1000"
64
- aria-describedby="email-help" :class="{ 'p-invalid': data.changeError }"
64
+ aria-describedby="email-help" :invalid="!!data.changeError"
65
65
  v-model="data.change" />
66
- <small v-if="data.changeError" id="email-help" class="p-error">
66
+ <Message v-if="data.changeError" severity="error" variant="simple" size="small">
67
67
  {{ t(`errors.${data.changeError}`) }}
68
- </small>
68
+ </Message>
69
69
  </div>
70
70
  </div>
71
71
  <Button label="Start operation" icon="pi pi-plus" type="submit" />
72
72
  </command-form>
73
73
  </div>
74
- <div class="surface-card shadow-1 border-round p-3 text-xl mt-3 flex-1 ml-2">
74
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 text-xl mt-4 flex-1 ml-2">
75
75
  <div class="text-xl mb-2">Do instant operation</div>
76
76
  <command-form service="balanceTest" action="doOperation"
77
77
  :parameters="{ balance: balance.id }"
78
78
  v-slot="{ data }" reset-on-done>
79
- <div class="col-12 md:col-6 py-1">
80
- <div class="p-field mb-3">
81
- <label for="email" class="block text-900 font-medium mb-2">
79
+ <div class="col-span-12 md:col-span-6 py-1">
80
+ <div class="p-field mb-4">
81
+ <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
82
82
  Name
83
83
  </label>
84
84
  <InputText id="name" type="text" class="w-full"
85
- aria-describedby="name-help" :class="{ 'p-invalid': data.nameError }"
85
+ aria-describedby="name-help" :invalid="!!data.nameError"
86
86
  v-model="data.name" />
87
- <small v-if="data.nameError" id="name-help" class="p-error">{{ t(`errors.${data.nameError}`) }}</small>
87
+ <Message v-if="data.nameError" severity="error" variant="simple" size="small">
88
+ {{ t(`errors.${data.nameError}`) }}
89
+ </Message>
88
90
  </div>
89
91
  </div>
90
- <div class="col-12 md:col-6 py-1">
91
- <div class="p-field mb-3">
92
- <label for="email" class="block text-900 font-medium mb-2">
92
+ <div class="col-span-12 md:col-span-6 py-1">
93
+ <div class="p-field mb-4">
94
+ <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
93
95
  Change
94
96
  </label>
95
97
  <InputNumber id="name" type="text" class="w-full" :min="-1000000" :max="1000000" showButtons :step="1000"
96
- aria-describedby="change-help" :class="{ 'p-invalid': data.changeError }"
98
+ aria-describedby="change-help" :invalid="!!data.changeError"
97
99
  v-model="data.change" />
98
- <small v-if="data.changeError" id="change-help" class="p-error">{{ t(`errors.${data.changeError}`) }}</small>
100
+ <Message v-if="data.changeError" severity="error" variant="simple" size="small">
101
+ {{ t(`errors.${data.changeError}`) }}
102
+ </Message>
99
103
  </div>
100
104
  </div>
101
105
  <Button label="Do operation" icon="pi pi-plus" type="submit" />
@@ -103,27 +107,27 @@
103
107
  </div>
104
108
  </div>
105
109
 
106
- <div class="surface-card shadow-1 border-round p-3 text-xl mb-1 mt-2 text-xl">
110
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 text-xl mb-1 mt-2 text-xl">
107
111
  Finished operations:
108
112
  </div>
109
113
  <OperationsList ownerType="balanceTest_balance" :owner="name" state="finished" />
110
114
 
111
- <!-- <div v-if="finishedOperations.length === 0" class="surface-card shadow-1 border-round p-3 mb-1">
115
+ <!-- <div v-if="finishedOperations.length === 0" class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 mb-1">
112
116
  No operations finished
113
117
  </div>
114
118
  <div v-for="operation of finishedOperations"
115
- class="surface-card shadow-1 border-round mb-1 flex flex-row align-items-center">
116
- <div class="flex-1 flex-grow pl-3 py-1">
119
+ class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border mb-1 flex flex-row items-center">
120
+ <div class="flex-1 flex-grow pl-4 py-1">
117
121
  {{ operation.cause }}
118
122
  </div>
119
- <div class="w-15rem text-right pl-3 font-semibold mr-3">
123
+ <div class="w-60 text-right pl-4 font-semibold mr-4">
120
124
  {{ operation.updatedAt ?? operation.createdAt }}
121
125
  </div>
122
- <div class="w-10rem text-right pl-3 font-semibold mr-3"
126
+ <div class="w-40 text-right pl-4 font-semibold mr-4"
123
127
  :class="operation.change > 0 ? 'text-green-500' : 'text-red-500'">
124
128
  {{ operation.change > 0 ? '+' : '-' }} {{ Math.abs(operation.change) }}
125
129
  </div>
126
- <div class="w-10rem text-right pl-3 font-semibold mr-3">
130
+ <div class="w-40 text-right pl-4 font-semibold mr-4">
127
131
  {{ operation.amountAfter }}
128
132
  </div>
129
133
  </div>-->
@@ -133,6 +137,7 @@
133
137
 
134
138
  <script setup>
135
139
 
140
+ import Message from "primevue/message"
136
141
  import InputText from "primevue/inputtext"
137
142
  import BalanceDisplay from './components/BalanceDisplay.vue'
138
143
  import OperationsList from './components/OperationsList.vue'
package/front/src/Index.vue CHANGED
@@ -1,16 +1,16 @@
1
1
  <template>
2
2
  <div class="w-full">
3
- <div class="surface-card shadow-1 border-round p-3 text-xl mb-1">
3
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 text-xl mb-1">
4
4
  All balances:
5
5
  </div>
6
- <div v-for="balance in allBalances" class="surface-card shadow-1 border-round flex flex-row align-items-center mt-1">
7
- <div class="flex-1 flex-grow pl-3">
6
+ <div v-for="balance in allBalances" class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border flex flex-row items-center mt-1">
7
+ <div class="flex-1 flex-grow pl-4">
8
8
  {{ balance.owner }}
9
9
  </div>
10
- <div class="w-10rem">
10
+ <div class="w-40">
11
11
  Amount: {{ balance.amount }}
12
12
  </div>
13
- <div class="w-10rem">
13
+ <div class="w-40">
14
14
  Available: {{ balance.available }}
15
15
  </div>
16
16
  <div>
@@ -20,21 +20,23 @@
20
20
  <Button @click="() => deleteBalance(balance)" label="Delete" icon="pi pi-trash" severity="danger" />
21
21
  </div>
22
22
  </div>
23
- <div v-if="allBalances.length === 0" class="surface-card shadow-1 border-round p-3 flex flex-row">
23
+ <div v-if="allBalances.length === 0" class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 flex flex-row">
24
24
  No balances found
25
25
  </div>
26
- <div class="surface-card shadow-1 border-round p-3 mt-3">
26
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border p-4 mt-4">
27
27
  <div class="text-xl mb-2">Add balance</div>
28
28
  <command-form service="balanceTest" action="createBalance" v-slot="{ data }" reset-on-done>
29
- <div class="col-12 md:col-6 py-1">
30
- <div class="p-field mb-3">
31
- <label for="email" class="block text-900 font-medium mb-2">
29
+ <div class="col-span-12 md:col-span-6 py-1">
30
+ <div class="p-field mb-4">
31
+ <label for="email" class="block text-surface-900 dark:text-surface-0 font-medium mb-2">
32
32
  Name
33
33
  </label>
34
34
  <InputText id="name" type="text" class="w-full"
35
- aria-describedby="name-help" :class="{ 'p-invalid': data.nameError }"
35
+ aria-describedby="name-help" :invalid="!!data.nameError"
36
36
  v-model="data.name" />
37
- <small v-if="data.nameError" id="name-help" class="p-error">{{ t(`errors.${data.nameError}`) }}</small>
37
+ <Message v-if="data.nameError" severity="error" variant="simple" size="small">
38
+ {{ t(`errors.${data.nameError}`) }}
39
+ </Message>
38
40
  </div>
39
41
  </div>
40
42
  <Button label="Add balance" icon="pi pi-plus" type="submit" />
@@ -46,6 +48,7 @@
46
48
  <script setup>
47
49
 
48
50
  import InputText from "primevue/inputtext"
51
+ import Message from "primevue/message"
49
52
 
50
53
  import {
51
54
  defineProps, defineEmits, defineModel, toRefs, computed, watch, ref, watchEffect, onUnmounted,
package/front/src/components/OperationsList.vue CHANGED
@@ -5,13 +5,13 @@
5
5
  loadTopSensorSize="1500px" loadBottomSensorSize="1500px"
6
6
  dropTopSensorSize="1000px" dropBottomSensorSize="1000px">
7
7
  <template #empty>
8
- <div class="text-xl text-800 my-3 mx-3">
8
+ <div class="text-xl text-surface-800 dark:text-surface-50 my-4 mx-4">
9
9
  No operations done yet...
10
10
  </div>
11
11
  </template>
12
12
  <template #default="{ item: operation }">
13
- <div class="surface-card shadow-1 border-round mb-1 flex flex-row align-items-center">
14
- <div class="flex-1 flex-grow-1 pl-3 py-1" style="min-width: 10rem">
13
+ <div class="bg-surface-0 dark:bg-surface-900 shadow-sm rounded-border mb-1 flex flex-row items-center">
14
+ <div class="flex-1 grow pl-4 py-1" style="min-width: 10rem">
15
15
  <slot name="operationCause" v-bind="operation">
16
16
  <InjectComponent :request="{ name: 'balanceOperationCause', causeType: operation.causeType }"
17
17
  :props="operation">
@@ -21,15 +21,15 @@
21
21
  </InjectComponent>
22
22
  </slot>
23
23
  </div>
24
- <time class="w-10rem text-right pl-3 font-medium mr-3"
24
+ <time class="w-40 text-right pl-4 font-medium mr-4"
25
25
  :datetime="operation.updatedAt ?? operation.createdAt">
26
26
  {{ d(operation.updatedAt ?? operation.createdAt, 'shortTime') }}
27
27
  </time>
28
- <div class="w-10rem text-right pl-3 font-semibold mr-3"
28
+ <div class="w-40 text-right pl-4 font-semibold mr-4"
29
29
  :class="operation.change > 0 ? 'text-green-500' : 'text-red-500'">
30
30
  {{ operation.change > 0 ? '+' : '-' }} <CurrencyDisplay :value="Math.abs(operation.change)" :currency="currency" />
31
31
  </div>
32
- <div class="w-10rem text-right pl-3 font-semibold mr-3">
32
+ <div class="w-40 text-right pl-4 font-semibold mr-4">
33
33
  <CurrencyDisplay :value="operation.amountAfter" :currency="currency" />
34
34
  </div>
35
35
  </div>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@live-change/balance-frontend",
3
- "version": "0.9.31",
3
+ "version": "0.9.33",
4
4
  "scripts": {
5
5
  "memDev": "node server/start.js memDev --enableSessions --initScript ./init.js --dbAccess",
6
6
  "localDevInit": "rm tmp.db; node server/start.js localDev --enableSessions --initScript ./init.js",
@@ -35,41 +35,41 @@
35
35
  "@codemirror/language": "6.10.1",
36
36
  "@dotenvx/dotenvx": "0.27.0",
37
37
  "@fortawesome/fontawesome-free": "^6.7.2",
38
- "@live-change/access-control-frontend": "^0.9.31",
39
- "@live-change/access-control-service": "^0.9.31",
40
- "@live-change/backup-service": "^0.9.31",
41
- "@live-change/blog-frontend": "^0.9.31",
42
- "@live-change/blog-service": "^0.9.31",
43
- "@live-change/cli": "^0.9.31",
44
- "@live-change/content-frontend": "^0.9.31",
45
- "@live-change/content-service": "^0.9.31",
46
- "@live-change/dao": "^0.9.31",
47
- "@live-change/dao-vue3": "^0.9.31",
48
- "@live-change/dao-websocket": "^0.9.31",
49
- "@live-change/db-client": "^0.9.31",
50
- "@live-change/email-service": "^0.9.31",
51
- "@live-change/framework": "^0.9.31",
52
- "@live-change/frontend-auto-form": "^0.9.31",
53
- "@live-change/frontend-base": "^0.9.31",
54
- "@live-change/geoip-service": "^0.9.31",
55
- "@live-change/image-frontend": "^0.9.31",
56
- "@live-change/locale-settings-service": "^0.9.31",
57
- "@live-change/password-authentication-service": "^0.9.31",
58
- "@live-change/prosemirror-service": "^0.9.31",
59
- "@live-change/secret-code-service": "^0.9.31",
60
- "@live-change/secret-link-service": "^0.9.31",
61
- "@live-change/session-service": "^0.9.31",
62
- "@live-change/task-service": "^0.9.31",
63
- "@live-change/upload-frontend": "^0.9.31",
64
- "@live-change/url-frontend": "^0.9.31",
65
- "@live-change/url-service": "^0.9.31",
66
- "@live-change/user-frontend": "^0.9.31",
67
- "@live-change/user-identification-service": "^0.9.31",
68
- "@live-change/user-service": "^0.9.31",
69
- "@live-change/vote-service": "^0.9.31",
70
- "@live-change/vue3-components": "^0.9.31",
71
- "@live-change/vue3-ssr": "^0.9.31",
72
- "@live-change/wysiwyg-frontend": "^0.9.31",
38
+ "@live-change/access-control-frontend": "^0.9.33",
39
+ "@live-change/access-control-service": "^0.9.33",
40
+ "@live-change/backup-service": "^0.9.33",
41
+ "@live-change/blog-frontend": "^0.9.33",
42
+ "@live-change/blog-service": "^0.9.33",
43
+ "@live-change/cli": "^0.9.33",
44
+ "@live-change/content-frontend": "^0.9.33",
45
+ "@live-change/content-service": "^0.9.33",
46
+ "@live-change/dao": "^0.9.33",
47
+ "@live-change/dao-vue3": "^0.9.33",
48
+ "@live-change/dao-websocket": "^0.9.33",
49
+ "@live-change/db-client": "^0.9.33",
50
+ "@live-change/email-service": "^0.9.33",
51
+ "@live-change/framework": "^0.9.33",
52
+ "@live-change/frontend-auto-form": "^0.9.33",
53
+ "@live-change/frontend-base": "^0.9.33",
54
+ "@live-change/geoip-service": "^0.9.33",
55
+ "@live-change/image-frontend": "^0.9.33",
56
+ "@live-change/locale-settings-service": "^0.9.33",
57
+ "@live-change/password-authentication-service": "^0.9.33",
58
+ "@live-change/prosemirror-service": "^0.9.33",
59
+ "@live-change/secret-code-service": "^0.9.33",
60
+ "@live-change/secret-link-service": "^0.9.33",
61
+ "@live-change/session-service": "^0.9.33",
62
+ "@live-change/task-service": "^0.9.33",
63
+ "@live-change/upload-frontend": "^0.9.33",
64
+ "@live-change/url-frontend": "^0.9.33",
65
+ "@live-change/url-service": "^0.9.33",
66
+ "@live-change/user-frontend": "^0.9.33",
67
+ "@live-change/user-identification-service": "^0.9.33",
68
+ "@live-change/user-service": "^0.9.33",
69
+ "@live-change/vote-service": "^0.9.33",
70
+ "@live-change/vue3-components": "^0.9.33",
71
+ "@live-change/vue3-ssr": "^0.9.33",
72
+ "@live-change/wysiwyg-frontend": "^0.9.33",
73
73
  "@vueuse/core": "^12.3.0",
74
74
  "codeceptjs-assert": "^0.0.5",
75
75
  "compression": "^1.7.5",
@@ -79,7 +79,7 @@
79
79
  "pretty-bytes": "^6.1.1",
80
80
  "primeflex": "^3.3.1",
81
81
  "primeicons": "^7.0.0",
82
- "primevue": "^3.52.0",
82
+ "primevue": "^4.2.5",
83
83
  "rollup-plugin-node-builtins": "^2.1.2",
84
84
  "rollup-plugin-visualizer": "5.14.0",
85
85
  "serialize-javascript": "^6.0.2",
@@ -91,7 +91,7 @@
91
91
  "vue3-scroll-border": "0.1.6"
92
92
  },
93
93
  "devDependencies": {
94
- "@live-change/codeceptjs-helper": "^0.9.31",
94
+ "@live-change/codeceptjs-helper": "^0.9.33",
95
95
  "codeceptjs": "^3.6.10",
96
96
  "generate-password": "1.7.1",
97
97
  "playwright": "1.49.1",
@@ -102,5 +102,5 @@
102
102
  "author": "Michał Łaszczewski <michal@laszczewski.pl>",
103
103
  "license": "ISC",
104
104
  "description": "",
105
- "gitHead": "4e12be9d3f339492bb9ddc3c6c77581e52d1ba60"
105
+ "gitHead": "c6eaa7764dc12b9489b74386b1227b71d0640e09"
106
106
  }