From 40c5811eec34cd262dda750c0f8948a73cf040ea Mon Sep 17 00:00:00 2001 From: Seungwoo321 Date: Mon, 14 Apr 2025 09:30:06 +0900 Subject: [PATCH 1/3] feat: update attrValues #19 --- .../pivottable-ui/VPivottableUi.vue | 62 +++++------------ src/composables/index.js | 1 + src/composables/usePivotDataProcessing.js | 66 +++++++++++++++++++ 3 files changed, 83 insertions(+), 46 deletions(-) create mode 100644 src/composables/usePivotDataProcessing.js diff --git a/src/components/pivottable-ui/VPivottableUi.vue b/src/components/pivottable-ui/VPivottableUi.vue index 7316920..3a8ec75 100644 --- a/src/components/pivottable-ui/VPivottableUi.vue +++ b/src/components/pivottable-ui/VPivottableUi.vue @@ -104,7 +104,7 @@ import VAggregatorCell from './VAggregatorCell.vue' import VDragAndDropCell from './VDragAndDropCell.vue' import { VPivottable } from '@/' import { computed, ref, toRefs, watch } from 'vue' -import { usePropsState } from '@/composables' +import { usePropsState, usePivotDataProcessing } from '@/composables' import TableRenderer from '../pivottable/renderer/index' const props = defineProps({ @@ -153,7 +153,14 @@ const pivotUiState = ref({ }) const propsRefs = toRefs(props) -const { state, updateState, updateMultiple } = usePropsState(propsRefs) +const { state, updateState } = usePropsState(propsRefs) +const { allFilters } = usePivotDataProcessing( + computed(() => props.data), + { + derivedAttributes: computed(() => props.derivedAttributes) + } +) + const rendererItems = computed(() => Object.keys(state.value.renderers).length ? state.value.renderers : TableRenderer) const aggregatorItems = computed(() => state.value.aggregators) const rowAttrs = computed(() => { @@ -170,8 +177,14 @@ const colAttrs = computed(() => { !state.value.hiddenFromDragDrop.includes(e) ) }) +const attributeNames = computed(() => { + return Object.keys(allFilters.value).filter(e => + !state.value.hiddenAttributes.includes(e) && + !state.value.hiddenFromAggregators.includes(e) + ) +}) const unusedAttrs = computed(() => { - return state.value.attributes + return attributeNames.value .filter( e => !state.value.rows.includes(e) && @@ -182,48 +195,6 @@ const unusedAttrs = computed(() => { .sort(sortAs(state.value.unusedOrder)) }) -const materializeInput = nextData => { - if (props.data === nextData) { - return - } - const newState = { - data: nextData, - attrValues: {}, - materializedInput: [] - } - - let recordsProcessed = 0 - PivotData.forEachRecord( - newState.data, - props.derivedAttributes, - function (record) { - newState.materializedInput.push(record) - for (const attr of Object.keys(record)) { - if (!(attr in newState.attrValues)) { - newState.attrValues[attr] = {} - if (recordsProcessed > 0) { - newState.attrValues[attr].null = recordsProcessed - } - } - } - for (const attr in newState.attrValues) { - const value = attr in record ? record[attr] : 'null' - if (!(value in newState.attrValues[attr])) { - newState.attrValues[attr][value] = 0 - } - newState.attrValues[attr][value]++ - } - recordsProcessed++ - } - ) - - updateMultiple({ - ...state.value, - ...newState, - ...pivotUiState.value - }) -} - const onMoveFilterBoxToTop = ({ attribute }) => { updateState('maxZIndex', state.value.maxZIndex++) updateState('zIndices', { @@ -256,7 +227,6 @@ const pivotData = computed(() => new PivotData(state.value)) watch(() => props.data, value => { updateState('unusedOrder', props.unusedAttrs) - materializeInput(value) }) diff --git a/src/composables/index.js b/src/composables/index.js index 3c5f459..a1b8a5f 100644 --- a/src/composables/index.js +++ b/src/composables/index.js @@ -1,2 +1,3 @@ export { usePivotData, providePivotData } from './pivotData' export { usePropsState } from './usePropsState' +export { usePivotDataProcessing } from './usePivotDataProcessing' diff --git a/src/composables/usePivotDataProcessing.js b/src/composables/usePivotDataProcessing.js new file mode 100644 index 0000000..09fabdd --- /dev/null +++ b/src/composables/usePivotDataProcessing.js @@ -0,0 +1,66 @@ +import { ref, watch } from 'vue' +import { PivotData } from '@/helper/utilities.js' + +export function usePivotDataProcessing (dataSource, options) { + const rawData = ref(null) + const allFilters = ref({}) + const materializedInput = ref([]) + + function processData (data) { + if (!data || rawData.value === data) return + + rawData.value = data + const newAllFilters = {} + const newMaterializedInput = [] + + let recordsProcessed = 0 + + PivotData.forEachRecord( + data, + options.derivedAttributes.value, + function (record) { + newMaterializedInput.push(record) + + for (const attr of Object.keys(record)) { + if (!(attr in newAllFilters)) { + newAllFilters[attr] = {} + if (recordsProcessed > 0) { + newAllFilters[attr].null = recordsProcessed + } + } + } + + for (const attr in newAllFilters) { + const value = attr in record ? record[attr] : 'null' + if (!(value in newAllFilters[attr])) { + newAllFilters[attr][value] = 0 + } + newAllFilters[attr][value]++ + } + + recordsProcessed++ + } + ) + + allFilters.value = newAllFilters + materializedInput.value = newMaterializedInput + + return { + AllFilters: newAllFilters, + materializedInput: newMaterializedInput + } + } + + watch(() => dataSource.value, processData, { immediate: true }) + + watch(() => options.derivedAttributes.value, () => { + processData(dataSource.value) + }) + + return { + rawData, + allFilters, + materializedInput, + processData + } +} From b7dfdce7fda25c716c4a0ef7d3510c31c9cf2e04 Mon Sep 17 00:00:00 2001 From: Seungwoo321 Date: Mon, 14 Apr 2025 10:44:34 +0900 Subject: [PATCH 2/3] feat: rename usePivotDataProcessing to useMaterializeInput --- src/components/pivottable-ui/VPivottableUi.vue | 5 +++-- src/composables/index.js | 2 +- .../{usePivotDataProcessing.js => useMaterializeInput.js} | 2 +- 3 files changed, 5 insertions(+), 4 deletions(-) rename src/composables/{usePivotDataProcessing.js => useMaterializeInput.js} (96%) diff --git a/src/components/pivottable-ui/VPivottableUi.vue b/src/components/pivottable-ui/VPivottableUi.vue index f014aeb..e6f051f 100644 --- a/src/components/pivottable-ui/VPivottableUi.vue +++ b/src/components/pivottable-ui/VPivottableUi.vue @@ -107,7 +107,7 @@ import VAggregatorCell from './VAggregatorCell.vue' import VDragAndDropCell from './VDragAndDropCell.vue' import { VPivottable } from '@/' import { computed, ref, toRefs, watch } from 'vue' -import { usePropsState, usePivotDataProcessing } from '@/composables' +import { usePropsState, useMaterializeInput } from '@/composables' import TableRenderer from '../pivottable/renderer/index' const props = defineProps({ @@ -145,6 +145,7 @@ const props = defineProps({ default: false } }) +// TODO const pivotUiState = ref({ unusedOrder: props.unusedAttrs, zIndices: {}, @@ -157,7 +158,7 @@ const pivotUiState = ref({ const propsRefs = toRefs(props) const { state, updateState } = usePropsState(propsRefs) -const { allFilters } = usePivotDataProcessing( +const { allFilters } = useMaterializeInput( computed(() => props.data), { derivedAttributes: computed(() => props.derivedAttributes) diff --git a/src/composables/index.js b/src/composables/index.js index a1b8a5f..5f18d43 100644 --- a/src/composables/index.js +++ b/src/composables/index.js @@ -1,3 +1,3 @@ export { usePivotData, providePivotData } from './pivotData' export { usePropsState } from './usePropsState' -export { usePivotDataProcessing } from './usePivotDataProcessing' +export { useMaterializeInput } from './useMaterializeInput' diff --git a/src/composables/usePivotDataProcessing.js b/src/composables/useMaterializeInput.js similarity index 96% rename from src/composables/usePivotDataProcessing.js rename to src/composables/useMaterializeInput.js index 09fabdd..114bab9 100644 --- a/src/composables/usePivotDataProcessing.js +++ b/src/composables/useMaterializeInput.js @@ -1,7 +1,7 @@ import { ref, watch } from 'vue' import { PivotData } from '@/helper/utilities.js' -export function usePivotDataProcessing (dataSource, options) { +export function useMaterializeInput (dataSource, options) { const rawData = ref(null) const allFilters = ref({}) const materializedInput = ref([]) From 02989b1986e26758e5a828cd6a787e5b8a3c5ca3 Mon Sep 17 00:00:00 2001 From: Seungwoo321 Date: Mon, 14 Apr 2025 10:59:27 +0900 Subject: [PATCH 3/3] feat: update props attributeNames --- src/components/pivottable-ui/VPivottableUi.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/pivottable-ui/VPivottableUi.vue b/src/components/pivottable-ui/VPivottableUi.vue index e6f051f..3632d48 100644 --- a/src/components/pivottable-ui/VPivottableUi.vue +++ b/src/components/pivottable-ui/VPivottableUi.vue @@ -32,7 +32,7 @@ :aggregatorName="state.aggregatorName" :rowOrder="state.rowOrder" :colOrder="state.colOrder" - :attributeNames="state.attributeNames" + :attributeNames="attributeNames" :hiddenFromAggregators="state.hiddenFromAggregators" :vals="state.vals" @update:aggregatorName="onUpdateAggregatorName"