mirror of
https://github.com/directus/directus.git
synced 2026-02-06 18:54:57 -05:00
Fix box
This commit is contained in:
@@ -703,6 +703,8 @@ unsaved_changes: Unsaved Changes
|
||||
unsaved_changes_copy: Are you sure you want to leave this page?
|
||||
discard_changes: Discard Changes
|
||||
discard_changes_copy: Are you sure you want to discard all the changes made?
|
||||
show_x_axis: Show X Axis
|
||||
show_y_axis: Show Y Axis
|
||||
keep_editing: Keep Editing
|
||||
page_help_collections_overview: '**Collections Overview** — List of all collections you have access to.'
|
||||
page_help_collections_collection: >-
|
||||
|
||||
@@ -128,7 +128,7 @@ export default defineComponent({
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.workspace-box {
|
||||
.workspace-padding-box {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@@ -168,7 +168,7 @@ export default defineComponent({
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.workspace.editing::before {
|
||||
.workspace-padding-box.editing .workspace::before {
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -74,18 +74,16 @@
|
||||
<insights-navigation />
|
||||
</template>
|
||||
|
||||
<div class="padding-box">
|
||||
<insights-workspace
|
||||
:edit-mode="editMode"
|
||||
:panels="panels"
|
||||
:zoom-to-fit="zoomToFit"
|
||||
:now="now"
|
||||
@update="stagePanelEdits"
|
||||
@move="movePanelID = $event"
|
||||
@delete="deletePanel"
|
||||
@duplicate="duplicatePanel"
|
||||
/>
|
||||
</div>
|
||||
<insights-workspace
|
||||
:edit-mode="editMode"
|
||||
:panels="panels"
|
||||
:zoom-to-fit="zoomToFit"
|
||||
:now="now"
|
||||
@update="stagePanelEdits"
|
||||
@move="movePanelID = $event"
|
||||
@delete="deletePanel"
|
||||
@duplicate="duplicatePanel"
|
||||
/>
|
||||
|
||||
<router-view
|
||||
name="detail"
|
||||
|
||||
@@ -16,6 +16,7 @@ import { isEqual } from 'lodash';
|
||||
import { Filter } from '@/types';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { abbreviateNumber } from '@/utils/abbreviate-number';
|
||||
import { isNil } from 'lodash';
|
||||
|
||||
type MetricOptions = {
|
||||
abbreviate: boolean;
|
||||
@@ -72,7 +73,7 @@ export default defineComponent({
|
||||
);
|
||||
|
||||
const displayValue = computed(() => {
|
||||
if (metric.value === null || metric.value === undefined) return null;
|
||||
if (isNil(metric.value)) return null;
|
||||
|
||||
if (props.options.abbreviate) {
|
||||
return abbreviateNumber(metric.value, props.options.decimals);
|
||||
@@ -85,7 +86,7 @@ export default defineComponent({
|
||||
});
|
||||
|
||||
const color = computed(() => {
|
||||
if (!metric.value) return null;
|
||||
if (isNil(metric.value)) return null;
|
||||
|
||||
let matchingFormat: MetricOptions['conditionalFormatting'][number] | null = null;
|
||||
|
||||
|
||||
@@ -256,6 +256,30 @@ export default definePanel({
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'showXAxis',
|
||||
type: 'boolean',
|
||||
name: '$t:show_x_axis',
|
||||
meta: {
|
||||
interface: 'boolean',
|
||||
width: 'half',
|
||||
},
|
||||
schema: {
|
||||
default_value: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'showYAxis',
|
||||
type: 'boolean',
|
||||
name: '$t:show_y_axis',
|
||||
meta: {
|
||||
interface: 'boolean',
|
||||
width: 'half',
|
||||
},
|
||||
schema: {
|
||||
default_value: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
minWidth: 12,
|
||||
minHeight: 6,
|
||||
|
||||
@@ -53,9 +53,17 @@ export default defineComponent({
|
||||
type: Date,
|
||||
required: true,
|
||||
},
|
||||
showXAxis: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showYAxis: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
},
|
||||
setup(props) {
|
||||
const { d, t, n } = useI18n();
|
||||
const { t, n } = useI18n();
|
||||
|
||||
const fieldsStore = useFieldsStore();
|
||||
|
||||
@@ -66,7 +74,7 @@ export default defineComponent({
|
||||
const chart = ref<ApexCharts>();
|
||||
|
||||
const valueLabel = computed(() => {
|
||||
const field = fieldsStore.getField(props.options.collection, props.options.valueField);
|
||||
const field = fieldsStore.getField(props.options.collection, props.options.valueField)!;
|
||||
const operation = t(props.options.function);
|
||||
return `${field.name} (${operation})`;
|
||||
});
|
||||
@@ -270,6 +278,7 @@ export default defineComponent({
|
||||
},
|
||||
},
|
||||
xaxis: {
|
||||
show: props.showXAxis,
|
||||
type: 'datetime',
|
||||
tooltip: {
|
||||
enabled: false,
|
||||
@@ -298,6 +307,7 @@ export default defineComponent({
|
||||
},
|
||||
},
|
||||
yaxis: {
|
||||
show: props.showXAxis,
|
||||
forceNiceScale: true,
|
||||
min: isNil(props.options.min) ? undefined : Number(props.options.min),
|
||||
max: isNil(props.options.max) ? undefined : Number(props.options.max),
|
||||
|
||||
Reference in New Issue
Block a user