feat(download): enhance Docker tab with architecture support

Author: SkyBird233

components/download/DownloadDetails.vue

@@ -55,8 +55,11 @@ const dialogTab = ref(props.initialTab);
     <el-tab-pane
       :label="t('DownloadDetails.downloadDockerContainers')"
       name="docker">
-      <DownloadDetailsDocker />
+      <DownloadDetailsDocker :arch-code="isaInfo.title" />
     </el-tab-pane>
-    <el-tab-pane :label="t('DownloadDetails.downloadVmImages')" name="vm" disabled />
+    <el-tab-pane
+      :label="t('DownloadDetails.downloadVmImages')"
+      name="vm"
+      disabled />
   </el-tabs>
 </template>

components/download/DownloadDetailsDocker.vue

@@ -1,17 +1,38 @@
-<script setup>
+<script setup lang="ts">
 const { t } = useI18n();
+
+type ArchCode =
+  | 'amd64'
+  | 'arm64'
+  | 'loongarch64'
+  | 'ppc64el'
+  | 'riscv64'
+  | 'loongson3';
+const { archCode } = defineProps<{ archCode: ArchCode }>();
+
+const archMapDocker: Record<ArchCode, string> = {
+  amd64: 'amd64',
+  arm64: 'arm64',
+  loongarch64: 'loong64',
+  ppc64el: 'ppc64le',
+  riscv64: 'riscv64',
+  loongson3: 'mips64le/loongson3'
+};
 </script>
 
 <template>
   <div class="flex flex-col gap-2">
     <p>
       {{ t('DownloadDetailsDocker.text1') }}
-      <AppLink to="https://hub.docker.com/r/aosc/aosc-os" target="_blank">Docker Hub</AppLink>
+      <AppLink to="https://hub.docker.com/r/aosc/aosc-os" target="_blank">
+        Docker Hub
+      </AppLink>
       {{ t('DownloadDetailsDocker.text2') }}
     </p>
 
     <p>{{ t('DownloadDetailsDocker.text3') }}</p>
-    <CopyButton :content="`docker pull aosc/aosc-os`"/>
+    <CopyButton
+      :content="`docker pull aosc/aosc-os --platform linux/${archMapDocker[archCode]}`" />
   </div>
 </template>