Jelajahi Sumber

页面底部导航菜单栏控制

lifanagju_citu 1 bulan lalu
induk
melakukan
bb0753029b
3 mengubah file dengan 40 tambahan dan 41 penghapusan
  1. 36 35
      components/payPopup/index.vue
  2. 3 6
      components/positionItem/index.vue
  3. 1 0
      pages/index/jobFair.vue

+ 36 - 35
components/payPopup/index.vue

@@ -3,7 +3,7 @@
     <uni-popup ref="popup" :is-mask-click="false" borderRadius="10px 10px 0 0" background-color="#eee" @change="popupChange">
       <view class="popup-content">
         <view class="popup-content-close">
-          <view class="icon" @tap="closePayPopup">
+          <view class="icon" @tap="handleClose">
             <uni-icons
               type="closeempty"
               color="#999"
@@ -59,6 +59,10 @@ const props = defineProps({
     type: String,
     default: '支付'
   },
+  tabBar: { // 页面底部导航菜单栏控制
+    type: Boolean,
+    default: true
+  },
 })
 
 const payType = [
@@ -100,22 +104,6 @@ const channelValue = ref('')
 const radioChange = (e) => {
   channelValue.value = e?.detail?.value || ''
 }
-
-const tabBarShow = (show = false) => { // 显示/隐藏 TabBar
-  console.log('tabBarShow:', show ? '展示' : '隐藏')
-  const currentPage = getCurrentPages()
-  if (!currentPage) return
-  const currentTabBar = currentPage[0]?.getTabBar?.()
-  currentTabBar?.setData({ show })
-}
-
-const popup = ref()
-const closePayPopup = () => {
-  tabBarShow(true)
-  popup.value.close()
-  emit('close')
-}
-
 const query = ref(null)
 const amount = ref('') // 支付金额
 const handleOpen = async (val) => {
@@ -123,7 +111,6 @@ const handleOpen = async (val) => {
   await getPayMethodsList()
   query.value = val
   amount.value = Number(val?.price) ? Number(val?.price)/100 : 0
-  tabBarShow(false)
   popup.value.open('bottom')
 }
 
@@ -223,12 +210,12 @@ const checkPayStatus = async (id) => {
     payLoading = true
     const res = await getOrderPayStatus({ id })
     if (res?.data?.status === 10) {
-      console.log('轮询支付状态:支付成功', res.data.status)
+      console.log('支付成功', res.data.status)
       if (interTimer) clearInterval(interTimer); interTimer = null
-      uni.showToast({ title: '支付成功', icon: 'none'})
+      // uni.showToast({ title: '支付成功', icon: 'none'})
+      popup.value.close()
       setTimeout(async () => {
         emit('paySuccess')
-        closePayPopup()
       }, 1500)
     }
   } catch (error) {
@@ -275,8 +262,6 @@ const weChatMiniProgramPay = async () => {
       // 用户支付成功
       console.log('用户支付成功')
       initIntervalFun()
-      popup.value.close()
-      tabBarShow(true)
     },
     fail: (err) => {
       if (err.errMsg === 'requestPayment:fail cancel') {
@@ -329,30 +314,46 @@ const setOrderCreated = async () => {
   handlePay(true) // 避免死循环
 }
 
-const pageHide = ref(false)
-onShow(() => {
-  console.log('onShow')
-  pageHide.value = false
-})
-onHide(() => {
-  console.log('onHide')
-  pageHide.value = true
-  closePayPopup() // 关闭支付弹窗
-})
+const popup = ref()
+const handleClose = () => { // 手动关闭emit
+  console.log('手动关闭')
+  popup.value.close()
+  emit('close')
+}
+
+const tabBarShow = (show = false) => { // 显示/隐藏 TabBar
+  console.log(' 显示/隐藏 TabBar:', show ? '展示' : '隐藏')
+  const currentPage = getCurrentPages()
+  if (!currentPage) return
+  const currentTabBar = currentPage[0]?.getTabBar?.()
+  currentTabBar?.setData({ show })
+}
 
+// 显示/隐藏 TabBar
 const popupChange = (e) => {
-  console.log('popupChange:', )
+  console.log('popupChange支付弹窗状态', e)
   if (!e || e.show === undefined) return
+  if (!props.tabBar) return // 页面没有底部导航菜单栏
   if (e.show) {
     // 支付弹窗打开
     tabBarShow(false)
   } else {
     // 支付弹窗关闭
     tabBarShow(true)
-    if (interTimer) clearInterval(interTimer)
   }
 }
 
+const pageHide = ref(false)
+onShow(() => {
+  console.log('onShow')
+  pageHide.value = false
+})
+onHide(() => {
+  console.log('onHide')
+  pageHide.value = true // 支付的时候会AppHide,不能清空轮询
+  popup.value.close()
+})
+
 defineExpose({
 	handleOpen
 })

+ 3 - 6
components/positionItem/index.vue

@@ -27,7 +27,7 @@
       <button type="primary" size="default" class="send-button" @click="getSubmitParams">提 交</button>
     </view>
     <!-- 支付 -->
-    <payPopup v-if="showPay" ref="payRef" :amount="amount" @paySuccess="paySuccess" @close="payClose"></payPopup>
+    <payPopup ref="payRef" :tabBar="false" @paySuccess="paySuccess" @close="payClose"></payPopup>
   </view>
 </template>
 
@@ -136,7 +136,6 @@ const saveEmit = async (retry) => {
     if (isStudent.value) handleSaveExtend() // 保存扩展信息
     // status:99为待支付职位,弹窗支付
     if (submitParams?.status && submitParams?.status === '99') {
-      showPay.value = true
       uni.showToast({ title: '当前可发布职位额度不足,请支付', icon: 'none', duration: 2000 })
       nextTick(() => {
         // 金额*100,页面展示/100
@@ -152,7 +151,6 @@ const saveEmit = async (retry) => {
     console.log('error:', error)
     // 可发布职位额度不足时,将status设为99重新提交
     if (error?.msg === '企业额度已超过') {
-      showPay.value = true
       submitParams.status = '99'
       setTimeout(() => {
         if (!retry) saveEmit(true) // true:重新提交避免死循环
@@ -164,13 +162,12 @@ const saveEmit = async (retry) => {
 }
 
 const payRef = ref(null)
-const showPay = ref(false)
 const paySuccess = () => {
   uni.switchTab({ url: '/pages/index/position' })
-  setTimeout(() => { uni.showToast({ title: '发布成功', icon: 'success' }) }, 1000)
+  setTimeout(() => { uni.showToast({ title: '发布成功', icon: 'success', duration: 2000 }) }, 1000)
 }
 const payClose = () => {
-  setTimeout(() => { uni.showToast({ title: '您已取消支付,请前往待支付查看!', icon: 'none', duration: 2000 }) }, 500)
+  setTimeout(() => { uni.showToast({ title: '您已取消支付,请前往待发布查看!', icon: 'none', duration: 3000 }) }, 500)
   uni.switchTab({ url: '/pages/index/position' }) // 不支持传参
 }
 

+ 1 - 0
pages/index/jobFair.vue

@@ -97,6 +97,7 @@ const handleToJobFairEnterprises = async (val) => {
 
 // 支付成功
 const paySuccess = () => {
+  uni.showToast({ title: '支付成功', icon: 'success', duration: 2000 })
   handleToJobFairEnterprises(itemData.value)
 }
 </script>