chore: 新增网站地图展示

docs/sitemap.md

@@ -1 +1,75 @@
+---
+layout: page
+---
 
+<script setup>
+import { ref, onMounted } from 'vue';
+const sites = ref([]);
+
+onMounted(() => {
+    function init () {
+         async function fetchAndParseSitemap(url) {
+          try {
+            const response = await fetch(url);
+            const xmlText = await response.text();
+        
+            const parser = new DOMParser();
+            const xmlDoc = parser.parseFromString(xmlText, "application/xml");
+        
+            const urlNodes = xmlDoc.getElementsByTagName("url");
+        
+            const urlsArray = Array.from(urlNodes).map(urlNode => {
+              const locNode = urlNode.getElementsByTagName("loc")[0];
+              const lastmodNode = urlNode.getElementsByTagName("lastmod")[0];
+        
+              return {
+                loc: locNode ? locNode.textContent : null,
+                lastmod: lastmodNode ? lastmodNode.textContent : null
+              };
+            });
+        
+            return urlsArray;
+          } catch (error) {
+            console.error("Error fetching or parsing the sitemap:", error);
+            throw error;
+          }
+        }
+    
+        const sitemapUrl = 'http://192.168.3.128:8080/efe-docs/sitemap.xml';
+        fetchAndParseSitemap(sitemapUrl)
+          .then(urlsArray => {
+            sites.value =  urlsArray.map(v => {
+                v.time = new Date(v.lastmod).toLocaleString();
+                return v
+            });
+            console.log(urlsArray);
+          })
+          .catch(error => console.error(error));
+    }
+    init()
+});
+</script>
+
+<style>
+.sitemap-page {
+    max-width: calc(var(--vp-layout-max-width) - 80px);
+    margin: 0 auto;
+    padding: 32px;
+}
+
+.sitemap-page li a {
+color: #2abdd1;
+}
+.sitemap-page li {
+    margin: 12px;
+}
+</style>
+
+<div class="sitemap-page">
+    <h1>网站地图</h1>
+    <ul>
+        <li v-for="(url) in sites">
+           <a :href="url.loc" target="_blank">{{url.loc}}</a> -- {{url.time}}
+        </li>
+    </ul>
+</div>