@geode/opengeodeweb-front 9.3.0 → 9.3.1

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.
@@ -2,10 +2,10 @@
2
2
  <v-stepper-content :step="step_index + 1">
3
3
  <v-row
4
4
  align="center"
5
- class="step-container"
5
+ class="mb-4 py-2"
6
6
  @click="set_current_step(step_index)"
7
7
  >
8
- <v-col cols="auto" class="icon-container">
8
+ <v-col cols="auto" class="d-flex justify-center align-center">
9
9
  <v-icon
10
10
  v-if="current_step_index > step_index"
11
11
  icon="mdi-check-circle"
@@ -22,25 +22,29 @@
22
22
  color="grey"
23
23
  />
24
24
  </v-col>
25
- <v-col class="title-container">
26
- <p class="step-title font-weight-bold">
25
+ <v-col>
26
+ <p class="m-0 font-weight-bold">
27
27
  {{ steps[step_index].step_title }}
28
28
  </p>
29
29
  </v-col>
30
- <v-col
30
+ <v-chip-group
31
31
  v-if="
32
32
  steps[step_index].chips.length && current_step_index >= step_index
33
33
  "
34
- class="chips-container"
34
+ column
35
+ class="d-flex flex-wrap ma-2 overflow-y-auto"
36
+ multiple
37
+ style="max-height: 150px"
35
38
  >
36
39
  <v-chip
37
40
  v-for="(chip, chip_index) in steps[step_index].chips"
38
41
  :key="chip_index"
39
- class="step-chip"
42
+ class="ma-1"
43
+ :title="chip"
40
44
  >
41
- {{ chip }}
45
+ {{ truncate(chip, 50) }}
42
46
  </v-chip>
43
- </v-col>
47
+ </v-chip-group>
44
48
  </v-row>
45
49
  <component
46
50
  v-if="step_index == current_step_index"
@@ -55,6 +59,13 @@
55
59
  </template>
56
60
 
57
61
  <script setup>
62
+ function truncate(text, maxLength) {
63
+ if (text.length > maxLength) {
64
+ return text.slice(0, maxLength) + "..."
65
+ }
66
+ return text
67
+ }
68
+
58
69
  const props = defineProps({
59
70
  step_index: { type: Number, required: true },
60
71
  })
@@ -80,33 +91,3 @@
80
91
  stepper_tree.current_step_index--
81
92
  }
82
93
  </script>
83
-
84
- <style scoped>
85
- .step-container {
86
- margin-bottom: 16px;
87
- padding: 8px;
88
- }
89
-
90
- .icon-container {
91
- display: flex;
92
- justify-content: center;
93
- align-items: center;
94
- }
95
-
96
- .title-container {
97
- margin-left: 8px;
98
- }
99
-
100
- .step-title {
101
- margin: 0;
102
- }
103
-
104
- .chips-container {
105
- display: flex;
106
- gap: 4px;
107
- }
108
-
109
- .step-chip {
110
- background-color: #f5f5f5;
111
- }
112
- </style>
@@ -1,7 +1,14 @@
1
1
  <template>
2
- <v-stepper-vertical v-model="current_step_index" class="stepper-container">
2
+ <v-stepper-vertical
3
+ v-model="current_step_index"
4
+ class="pa-4 ma-0"
5
+ elevation="1"
6
+ rounded
7
+ >
3
8
  <v-stepper-items>
4
- <Step v-for="(step, index) in steps" :key="step" :step_index="index" />
9
+ <v-col cols="12">
10
+ <Step v-for="(step, index) in steps" :key="step" :step_index="index" />
11
+ </v-col>
5
12
  </v-stepper-items>
6
13
  </v-stepper-vertical>
7
14
  </template>
@@ -10,14 +17,3 @@
10
17
  const stepper_tree = inject("stepper_tree")
11
18
  const { steps, current_step_index } = toRefs(stepper_tree)
12
19
  </script>
13
-
14
- <style scoped>
15
- .stepper-container {
16
- max-width: 600px;
17
- margin: 0 auto;
18
- padding: 16px;
19
- background-color: #f9f9f9;
20
- border-radius: 8px;
21
- border: 1px solid #e0e0e0;
22
- }
23
- </style>
package/package.json CHANGED
@@ -36,7 +36,7 @@
36
36
  },
37
37
  "description": "OpenSource Vue/Vuetify framework for web applications",
38
38
  "type": "module",
39
- "version": "9.3.0",
39
+ "version": "9.3.1",
40
40
  "main": "./nuxt.config.js",
41
41
  "dependencies": {
42
42
  "@geode/opengeodeweb-back": "5.4.0",