refactor: 重构多个组件以支持 Vue 3 语法和功能

- 将多个组件转换为 `<script setup>` 语法，提升可读性和性能
- 优化状态管理和事件处理逻辑，简化代码结构
- 更新样式和布局以适应新组件结构
- 添加新功能和修复已知问题，提升用户体验

pages/product/licencePhoto.vue

@@ -9,41 +9,35 @@
   </div>
 </template>
 
-<script>
-import { getLicencePhoto } from "@/api/store.js";
-export default {
-  data() {
-    return {
-      storeData: {},
-    };
-  },
-  onLoad(options) {
-    this.getStoreLicencePhoto(options.id);
-  },
-  methods: {
-    async getStoreLicencePhoto(id) {
-      let res = await getLicencePhoto(id);
-      if (res.data.success) {
-        this.storeData = res.data.result;
-      }
-    },
+<script setup lang="ts">
+import { ref } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
+import { getLicencePhoto } from '@/api/store.js'
 
-    /**
-     * 点击图片放大或保存
-     */
-    preview() {
-      uni.previewImage({
-        current: 0,
-        urls: [this.storeData.licencePhoto],
-        longPressActions: {
-          itemList: ["保存图片"],
-          success: function (data) {},
-          fail: function (err) {},
-        },
-      });
+const storeData = ref<any>({})
+
+async function getStoreLicencePhoto(id: string) {
+  const res = await getLicencePhoto(id)
+  if (res.data.success) {
+    storeData.value = res.data.result
+  }
+}
+
+function preview() {
+  uni.previewImage({
+    current: 0,
+    urls: [storeData.value.licencePhoto],
+    longPressActions: {
+      itemList: ['保存图片'],
+      success: function () {},
+      fail: function () {},
     },
-  },
-};
+  })
+}
+
+onLoad((options: any) => {
+  getStoreLicencePhoto(options.id)
+})
 </script>
 
 <style lang="scss" scoped>
@@ -53,4 +47,4 @@ export default {
     margin: 20rpx 0;
   }
 }
-</style>
+</style>