@@ -89,15 +89,15 @@ class="w-full max-w-full items-end"
89
89
< div class = " flex justify-center gap-5" >
90
90
< div class = " flex items-center gap-2" >
91
91
< span class = " h-3.5 w-3.5 rounded-sm bg-green-500 opacity-80" >< / span>
92
-
92
+
93
93
< p class = " text-xs dark:text-gray-300" >
94
94
@lang (' admin::app.dashboard.index.revenue.won-revenue' )
95
95
< / p>
96
96
< / div>
97
-
97
+
98
98
< div class = " flex items-center gap-2" >
99
99
< span class = " h-3.5 w-3.5 rounded-sm bg-red-500 opacity-80" >< / span>
100
-
100
+
101
101
< p class = " text-xs dark:text-gray-300" >
102
102
@lang (' admin::app.dashboard.index.revenue.lost-revenue' )
103
103
< / p>
@@ -118,7 +118,7 @@ class="w-full max-w-full items-end"
118
118
report: [],
119
119
120
120
isLoading: true ,
121
-
121
+
122
122
chart: undefined ,
123
123
}
124
124
},
@@ -151,15 +151,15 @@ class="w-full max-w-full items-end"
151
151
})
152
152
.catch (error => {});
153
153
},
154
-
154
+
155
155
prepare () {
156
156
if (this .chart ) {
157
157
this .chart .destroy ();
158
158
}
159
159
160
160
this .chart = new Chart (document .getElementById (this .$ .uid + ' _chart' ), {
161
161
type: ' bar' ,
162
-
162
+
163
163
data: {
164
164
labels: [
165
165
" @lang (' admin::app.dashboard.index.revenue.won-revenue' )" ,
@@ -178,27 +178,26 @@ class="w-full max-w-full items-end"
178
178
' rgba(239, 68, 68, 0.8)' ,
179
179
],
180
180
181
- barThickness: [42 ,42 ],
182
-
183
- borderWidth: 1
181
+ barPercentage: 0.8 ,
182
+ categoryPercentage: 0.7 ,
184
183
}],
185
184
},
186
-
185
+
187
186
options: {
188
- aspectRatio: 7 ,
187
+ aspectRatio: 5 ,
189
188
190
189
indexAxis: ' y' ,
191
-
190
+
192
191
plugins: {
193
192
legend: {
194
193
display: false ,
195
194
},
196
195
},
197
-
196
+
198
197
scales: {
199
198
x: {
200
199
beginAtZero: true ,
201
-
200
+
202
201
ticks: {
203
202
stepSize: 500 ,
204
203
},
@@ -210,20 +209,33 @@ class="w-full max-w-full items-end"
210
209
211
210
y: {
212
211
beginAtZero: true ,
213
-
212
+
214
213
ticks: {
215
- display: false ,
214
+ display: false ,
216
215
},
217
216
218
217
border: {
219
218
dash: [8 , 4 ],
220
219
}
221
220
}
221
+ },
222
+
223
+ maintainAspectRatio: true ,
224
+
225
+ responsive: true ,
226
+
227
+ layout: {
228
+ padding: {
229
+ left: 0 ,
230
+ right: 0 ,
231
+ top: 0 ,
232
+ bottom: 0
233
+ }
222
234
}
223
235
}
224
236
});
225
237
}
226
238
}
227
239
});
228
240
</script >
229
- @endPushOnce
241
+ @endPushOnce
0 commit comments