✨ feat: 捐书数字空间微信浏览器兼容问题

@@ -55,7 +55,7 @@ import Cookies from 'js-cookie'
 import icon_avatar from '@images/que-touxiang@2x.png'
 
 import MyButton from '@/components/MyButton/index.vue'
-import { ref, reactive, onMounted } from 'vue'
+import { ref, reactive, onMounted, watch, nextTick } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import axios from '@/utils/axios';
 import $ from 'jquery'
@@ -63,6 +63,69 @@ import { Toast } from 'vant';
 const $route = useRoute();
 const $router = useRouter();
 
+const props = defineProps({
+  item: Object,
+  showPopup: Boolean
+})
+
+const emit = defineEmits(['on-close']);
+
+let donate_number = ref(1)
+const donateBook = () => {
+  // 爱心捐书接口
+  axios.post('/srv/?a=add_donate', {
+    book_id: props.item.book_id,
+    qty: donate_number.value,
+    donate_name: props.item.perf_name,
+  })
+  .then(res => {
+    if (res.data.code === 1) {
+      console.warn(res.data.data);
+      closeBtn();
+
+      // 交易成功跳转回调页面
+      // TEMP: 临时传参 donate_id
+      $router.push({
+        path: '/client/wechatpayCallback',
+        query: {
+          donate_id: res.data.data.id
+        }
+      })
+    } else {
+      console.warn(res);
+      if (!res.data.show) return false;
+      Toast({
+        icon: 'close',
+        message: res.data.msg
+      });
+    }
+  })
+  .catch(err => {
+    console.error(err); 
+  })
+}
+
+const show = ref(false);
+let popupHeight = ref('60%');
+
+watch(() => props.showPopup, (v) => {
+  show.value = v
+  // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
+  nextTick(() => {
+    let height = $('.donate-wrapper').height();
+    popupHeight.value = height + 10 + 'px';
+  })
+})
+
+const closeBtn = () => {
+  emit('on-close', false)
+  show.value = false;
+}
+
+const cancelDonate = () => { 
+  closeBtn();
+}
+
 // TODO: 微信支付
 
 onMounted(() => {
@@ -74,70 +137,14 @@ onMounted(() => {
 import mixin from 'common/mixin';
 
 export default {
-  props: ['showPopup', 'item'],
   mixins: [mixin.init],
   data() {
     return {
-      popupHeight: '60%',
-      show: false,
-      donate_number: 1,
     }
   },
   mounted() {
   },
-  watch: {
-    showPopup(value, pre) {
-      if (value) {
-        this.show = value;
-        // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
-        this.$nextTick(() => {
-          let height = $('.donate-wrapper').height();
-          this.popupHeight = height + 10 + 'px';
-        })
-      }
-    }
-  },
   methods: {
-    closeBtn() {
-      this.$emit('on-close', false)
-      this.show = false;
-    },
-    cancelDonate() { 
-      this.closeBtn();
-    },
-    donateBook() {
-      // 爱心捐书接口
-      axios.post('/srv/?a=add_donate', {
-        book_id: this.item.book_id,
-        qty: this.donate_number,
-        donate_name: this.item.perf_name,
-      })
-      .then(res => {
-        if (res.data.code === 1) {
-          console.warn(res.data.data);
-          this.closeBtn();
-
-          // 交易成功跳转回调页面
-          // TEMP: 临时传参 donate_id
-          this.$router.push({
-            path: '/client/wechatpayCallback',
-            query: {
-              donate_id: res.data.data.id
-            }
-          })
-        } else {
-          console.warn(res);
-          if (!res.data.show) return false;
-          Toast({
-            icon: 'close',
-            message: res.data.msg
-          });
-        }
-      })
-      .catch(err => {
-        console.error(err); 
-      })
-    },
   }
 }
 </script>