zh пре 8 месеци
родитељ
комит
5acc72cda1
1 измењених фајлова са 80 додато и 7 уклоњено
  1. 80 7
      src/views/piece/dashboard/index.vue

+ 80 - 7
src/views/piece/dashboard/index.vue

@@ -1,26 +1,99 @@
 <template>
 <template>
-  <button @click="_openCamera">打开相机</button>
-  <button @click="_openGallery">打开相册选择图片并返回路径</button>
-  <button @click="_openImageEditor">打开图片编辑器</button>
+  <div>
+    <button @click="_openCamera">打开相机</button>
+    <button @click="_openGallery">打开相册选择图片并返回路径</button>
+    <button @click="_openImageEditor">打开图片编辑器</button>
+
+    <!-- 显示图片的容器 -->
+    <div v-if="imageUrl" class="image-preview">
+      <img :src="imageUrl" alt="Selected Image" />
+    </div>
+  </div>
 </template>
 </template>
 
 
 <script setup>
 <script setup>
-import { openCamera, openGallery, openImageEditor } from '@/utils/android'
 import { ref } from 'vue'
 import { ref } from 'vue'
 
 
 const imagePath = ref('')
 const imagePath = ref('')
+const imageUrl = ref('')
+
 const _openCamera = () => {
 const _openCamera = () => {
-  imagePath.value = openCamera()
+  if (!window.android) {
+    alert('Android 接口不可用')
+    return
+  }
+  window.android.openCamera()
 }
 }
 
 
 const _openGallery = () => {
 const _openGallery = () => {
-  openGallery()
+  if (!window.android) {
+    alert('Android 接口不可用')
+    return
+  }
+  window.android.openGallery()
 }
 }
 
 
 const _openImageEditor = () => {
 const _openImageEditor = () => {
-  openImageEditor(imagePath.value)
+  if (!window.android) {
+    alert('Android 接口不可用')
+    return
+  }
+  if (!imagePath.value) {
+    alert('请先选择图片')
+    return
+  }
+  window.android.openImageEditor(imagePath.value)
+}
+
+// 这个函数应该由 Android 调用
+window.handleImageResult = (path) => {
+  imagePath.value = path
+  // 如果是文件路径,直接使用
+  if (path.startsWith('file://') || path.startsWith('/storage')) {
+    imageUrl.value = path
+  }
+  // 如果是 base64,直接使用
+  else if (path.startsWith('data:image')) {
+    imageUrl.value = path
+  }
+}
+
+// 处理 Blob 数据
+window.handleImageBlob = (base64) => {
+  const blob = base64ToBlob(base64, 'image/jpeg')
+  imageUrl.value = URL.createObjectURL(blob)
+}
+
+// 将 base64 转换为 Blob
+const base64ToBlob = (base64, mimeType) => {
+  const byteCharacters = atob(base64.split(',')[1])
+  const byteNumbers = new Array(byteCharacters.length)
+  for (let i = 0; i < byteCharacters.length; i++) {
+    byteNumbers[i] = byteCharacters.charCodeAt(i)
+  }
+  const byteArray = new Uint8Array(byteNumbers)
+  return new Blob([byteArray], { type: mimeType })
 }
 }
 </script>
 </script>
 
 
 <style scoped lang="sass">
 <style scoped lang="sass">
+button
+  margin: 10px
+  padding: 8px 16px
+  background: #42b983
+  color: white
+  border: none
+  border-radius: 4px
+  cursor: pointer
+
+
+.image-preview
+  margin-top: 20px
+  img
+    max-width: 100%
+    max-height: 400px
+    border: 1px solid #ddd
+    border-radius: 4px
+
+
 </style>
 </style>