feat: PivotModel 양방향 바인딩 기능 구현

[Seungwoo321]

Summary

PivotModel 양방향 바인딩 기능을 구현하여 Vue 3의 v-model 패턴을 지원합니다.

주요 변경사항

• ✨ VPivottableUi 컴포넌트에 v-model:pivotModel 지원 추가
• 🐛 필터 변경사항이 즉시 PivotModel에 반영되도록 수정 (valueFilter 비교 로직 추가)
• 🔧 props 정의를 Partial<DefaultPropsType>로 변경하여 pivotModel 사용 시 개별 props를 선택적으로 만듦
• 📦 PivotModel 유틸리티 함수 추가 (비교, 생성, 복제)
• 🎯 PivotModel 히스토리 관리를 위한 composable 추가 (usePivotModelHistory)
• 💾 PivotModel 직렬화/역직렬화 유틸리티 추가
• 📚 한글/영어 문서 업데이트

PivotModel 인터페이스

interface PivotModelInterface {
  rows: string[]
  cols: string[]
  vals: string[]
  aggregatorName: string
  rendererName: string
  heatmapMode?: 'full' | 'col' | 'row' | ''
  valueFilter: Record<string, any>
  rowOrder: 'key_a_to_z' | 'value_a_to_z' | 'value_z_to_a'
  colOrder: 'key_a_to_z' | 'value_a_to_z' | 'value_z_to_a'
  timestamp?: number
  version?: string
}

사용 예시

<template>
  <VuePivottableUi
    v-model:pivot-model="pivotModel"
    :data="data"
    :renderers="renderers"
    @change="onPivotModelChange"
  />
</template>

<script setup>
const pivotModel = ref({
  rows: ['Category'],
  cols: ['Date'],
  vals: ['Amount'],
  aggregatorName: 'Sum',
  rendererName: 'Table',
  valueFilter: {},
  rowOrder: 'key_a_to_z',
  colOrder: 'key_a_to_z',
  heatmapMode: ''
})
</script>

Test plan

• 기본 양방향 바인딩 동작 확인
• 필터 체크박스 변경 시 즉시 반영 확인
• 드래그 앤 드롭 후 PivotModel 업데이트 확인
• pivotModel prop 제공 시 개별 props 오버라이드 확인
• TypeScript 타입 검사 통과 확인
• ESLint 검사 통과 확인
• 빌드 성공 확인

🤖 Generated with Claude Code