feat(P4): precompute移植+app.js sources双向回填+回归1003/1003+验收体积/文件/data.json

site/sources/calendar/vue3.txt

@@ -0,0 +1,67 @@
+<template>
+  <div class="aa-calendar">
+    <div class="aa-calendar-head">
+      <button class="aa-calendar-nav" @click="prev">‹</button>
+      <span class="aa-calendar-title">{{ viewY }} 年 {{ viewM + 1 }} 月</span>
+      <button class="aa-calendar-nav" @click="next">›</button>
+    </div>
+    <div class="aa-calendar-week">
+      <span class="aa-calendar-weekday" v-for="w in weeks" :key="w">{{ w }}</span>
+    </div>
+    <div class="aa-calendar-grid">
+      <div v-for="(c, i) in cells" :key="i" class="aa-calendar-cell"
+           :class="{ 'is-out': c.out, 'is-today': c.today, 'is-selected': c.key === selected }"
+           @click="pick(c)">{{ c.day }}</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed } from 'vue';
+const props = defineProps({ modelValue: { type: String, default: '' } });
+const emit = defineEmits(['update:modelValue', 'change']);
+
+const weeks = ['日', '一', '二', '三', '四', '五', '六'];
+const n = new Date();
+const viewY = ref(n.getFullYear());
+const viewM = ref(n.getMonth());
+const selected = ref(props.modelValue);
+const today = fmt(n);
+
+function fmt(dt) {
+  const p = x => (x < 10 ? '0' + x : '' + x);
+  return dt.getFullYear() + '-' + p(dt.getMonth() + 1) + '-' + p(dt.getDate());
+}
+const cells = computed(() => {
+  const first = new Date(viewY.value, viewM.value, 1).getDay();
+  const days = new Date(viewY.value, viewM.value + 1, 0).getDate();
+  const prevDays = new Date(viewY.value, viewM.value, 0).getDate();
+  const arr = [];
+  for (let i = 0; i < first; i++) {
+    let pd = prevDays - first + 1 + i, pm = viewM.value - 1, py = viewY.value;
+    if (pm < 0) { pm = 11; py--; }
+    arr.push({ day: pd, out: true, key: fmt(new Date(py, pm, pd)) });
+  }
+  for (let d = 1; d <= days; d++) {
+    const k = fmt(new Date(viewY.value, viewM.value, d));
+    arr.push({ day: d, out: false, today: k === today, key: k });
+  }
+  const tail = (7 - (arr.length % 7)) % 7;
+  for (let t = 1; t <= tail; t++) {
+    let nm = viewM.value + 1, ny = viewY.value; if (nm > 11) { nm = 0; ny++; }
+    arr.push({ day: t, out: true, key: fmt(new Date(ny, nm, t)) });
+  }
+  return arr;
+});
+function prev() { viewM.value--; if (viewM.value < 0) { viewM.value = 11; viewY.value--; } }
+function next() { viewM.value++; if (viewM.value > 11) { viewM.value = 0; viewY.value++; } }
+function pick(c) {
+  selected.value = c.key;
+  viewY.value = parseInt(c.key.slice(0, 4), 10);
+  viewM.value = parseInt(c.key.slice(5, 7), 10) - 1;
+  emit('update:modelValue', c.key);
+  emit('change', c.key);
+}
+</script>
+
+<style src="./Calendar.css"></style>