https://www.tomamin.co.jp/tomamin/wp-content/themes/tomamin-theme/assets/js/sidebar.js?ver=1788941619

1(() => {
2    // Vueが読み込まれていなければ何もしない
3    if (!window.Vue) {
4        console.warn("Vue is not loaded");
5        return;
6    }
7
8    const { createApp, ref, onMounted } = Vue;
9
10    const el = document.getElementById("right-side-app");
11    if (!el) {
12        console.warn("#right-side not found");
13        return;
14    }
15
16    createApp({
17        setup() {
18            const isUserActive = ref(false);
19            const checkIsUserActive = async () => {
20                isUserActive.value = await nikkan.auth.isUserActive();
21            };
22            // --- お知らせ (Announcements) ---
23            const newsItems = ref([]);
24            const isNewsLoading = ref(false);
25            const newsErrorMsg = ref("");
26
27            const fetchNews = async () => {
28                isNewsLoading.value = true;
29                newsErrorMsg.value = "";
30                try {
31                    const url = new URL(nikkan.apiUrls.publishedEntries, window.location.origin);
32                    url.searchParams.set("PageNo", "1");
33                    url.searchParams.set("PageSize", "3");
34                    url.searchParams.set("MainCategorySlug", "お知らせ");
35                    url.searchParams.set("OrderBy", "orderDateTime desc, publishDateTime desc");
36
37                    const res = await fetch(url.toString(), {
38                        headers: { "Accept": "application/json" }
39                    });
40                    if (!res.ok) throw new Error(`HTTP error! status: ${res.status}`);
41                    
42                    const data = await res.json();
43                    newsItems.value = Array.isArray(data) ? data : (data?.items || []);
44                } catch (e) {
45                    console.error("News fetch error:", e);
46                    newsErrorMsg.value = "お知らせの取得に失敗しました。";
47                } finally {
48                    isNewsLoading.value = false;
49                }
50            };
51
52            // --- アクセスランキング (Ranking) ---
53            const rankingItems = ref([]);
54            const isRankingLoading = ref(false);
55            const rankingErrorMsg = ref("");
56            const isRankingExpanded = ref(false);
57            const rankingPeriod = ref("");
58
59            const getRankingPeriod = () => {
60                const now = new Date();
61                const oneWeekAgo = new Date();
62                oneWeekAgo.setDate(now.getDate() - 7);
63
64                const formatDate = (date) => {
65                    return `${date.getMonth() + 1}/${date.getDate()}`;
66                };
67
68                return `${formatDate(oneWeekAgo)}～${formatDate(now)}`;
69            };
70
71            // --- 紙面ビューアー (Paper Viewer) ---
72            const paperItems = ref([]);
73            const latestPaper = ref(null);
74            const latestPaperImage = ref("");
75            const isPaperLoading = ref(false);
76            const paperErrorMsg = ref("");
77
78            const getDayOfWeek = (date) => {
79                const days = ["日", "月", "火", "水", "木", "金", "土"];
80                return `（${days[date.getDay()]}）`;
81            };
82
83            const fetchPapers = async () => {
84                isPaperLoading.value = true;
85                paperErrorMsg.value = "";
86                try {
87                    // 直近7件の紙面を取得
88                    const listUrl = new URL(nikkan.apiUrls.publishedPapers, window.location.origin);
89                    listUrl.searchParams.set("PageSize", "7");
90                    listUrl.searchParams.set("OrderBy", "publishDate desc");
91
92                    const listRes = await fetch(listUrl.toString(), {
93                        headers: { "Accept": "application/json" }
94                    });
95                    if (!listRes.ok) throw new Error("紙面リストの取得に失敗しました。");
96
97                    const papers = await listRes.json();
98                    const items = Array.isArray(papers) ? papers : (papers?.items || []);
99                    
100                    if (items.length > 0) {
101                        // 最新の紙面情報を保持
102                        const first = items[0];
103                        const publishDate = new Date(first.publish_date_time);
104                        latestPaper.value = {
105                            dateMain: `${publishDate.getFullYear()}年 ${publishDate.getMonth() + 1}月 ${publishDate.getDate()}日`,
106                            dateSub: getDayOfWeek(publishDate)
107                        };
108
109                        latestPaperImage.value = first.top_page?.image_data?.url_thumb_m;
110
111                        // リスト用データ加工
112                        paperItems.value = items.map(p => {
113                            const d = new Date(p.publish_date_time);
114                            return {
115                                id: p.id,
116                                date: `${d.getMonth() + 1}月${d.getDate()}日`,
117                                day: getDayOfWeek(d),
118                                link: `/viewer/?paper=1&date=${p.publish_date}`,
119                            };
120                        });
121                    }
122                } catch (e) {
123                    console.error("Paper fetch error:", e);
124                    paperErrorMsg.value = "紙面データの取得に失敗しました。";
125                } finally {

126                    isPaperLoading.value = false;
127                }
128            };
129
130            const fetchRanking = async () => {
131                isRankingLoading.value = true;
132                rankingErrorMsg.value = "";
133                try {
134                    // 以前見つからなかった /Entries/Ranking を使用
135                    const url = new URL(nikkan.apiBaseUrl + "/Entries/Ranking", window.location.origin);
136                    url.searchParams.set("RankingType", "Last7days");
137                    url.searchParams.set("Count", "10");
138
139                    const res = await fetch(url.toString(), {
140                        headers: { "Accept": "application/json" }
141                    });
142                    if (!res.ok) throw new Error(`HTTP error! status: ${res.status}`);
143
144                    const data = await res.json();
145                    rankingItems.value = Array.isArray(data) ? data : [];
146                } catch (e) {
147                    console.error("Ranking fetch error:", e);
148                    rankingErrorMsg.value = "ランキングの取得に失敗しました。";
149                } finally {
150                    isRankingLoading.value = false;
151                }
152            };
153
154            onMounted(() => {
155                // ログイン状態を確認
156                checkIsUserActive();
157
158                fetchNews();
159                fetchRanking();
160                fetchPapers();
161                rankingPeriod.value = getRankingPeriod();
162            });
163
164            return {
165                isUserActive,
166                // News
167                items: newsItems, // template-parts 使用変数名に合わせる
168                isNewsLoading,
169                newsErrorMsg,
170                
171                // Ranking
172                rankingItems,
173                isRankingLoading,
174                rankingErrorMsg,
175                isRankingExpanded,
176                rankingPeriod,
177
178                // Paper Viewer
179                paperItems,
180                latestPaper,
181                latestPaperImage,
182                isPaperLoading,
183                paperErrorMsg
184            };
185        }
186    }).mount(el);
187})();