个人会员缴费

张猛
Showing 1 changed file with 56 additions and 49 deletions
personal/order.vue
--- a/personal/order.vue
View file @bb44003
+++ b/personal/order.vue
View file @bb44003
 <template>
-  <view class="order-page" :class="{ 'no-scroll': isPopupOpen }">
+  <view :class="{ 'no-scroll': isPopupOpen }" class="order-page">
    <!-- 订单列表 -->
-    <scroll-view 
+    <scroll-view
-      scroll-y 
+      :enhanced="true"
-      class="order-list-scroll" 
-      :enhanced="true" 
-      :show-scrollbar="false"
      :scroll-enabled="!isPopupOpen"
+      :show-scrollbar="false"
+      class="order-list-scroll"
+      scroll-y
    >
      <view class="order-list">
        <!-- 有数据才循环 -->
@@ -19,21 +19,22 @@
            <!-- 订单头部：日期 + 状态 -->
            <view class="card-header">
              <view class="date">
-                <image :src="config.baseUrl_api + '/fs/static/calendar@2x.png'" v-if="item.payTime" mode="widthFix" style="width:30rpx;height:30rpx;"/>
+                <image v-if="item.payTime" :src="config.baseUrl_api + '/fs/static/calendar@2x.png'" mode="widthFix"
-                <text class="date-text" v-if="item.payTime">{{ item.payTime }}</text>
+                       style="width:30rpx;height:30rpx;"/>
+                <text v-if="item.payTime" class="date-text">{{ item.payTime }}</text>
              </view>
              <view
-                class="status-tag"
                :class="{
                  success: item.payStatus == 1,
                  danger: item.payStatus == 2,
                  pending: item.payStatus == 0
                }"
+                class="status-tag"
              >
                {{ getStatusText(item.payStatus) }}
              </view>
            </view>
            <!-- 订单编号、缴费编号 -->
            <view class="info-row">
              <text class="label">订单编号：</text>
@@ -43,9 +44,9 @@
              <text class="label">缴费编号：</text>
              <text class="value">{{ item.wfCode || '——' }}</text>
            </view>
            <!-- 核心：个人会员仅展示缴费年限 -->
-            <view class="info-section flex f-j-s" v-if="item.content">
+            <view v-if="item.content" class="info-section flex f-j-s">
              <view class="single-info">
                <view class="label">缴费年限：</view>
                <view class="value">{{ item.content.yearCount || 0 }}</view>
@@ -56,43 +57,43 @@
                <view class="value">民生付</view>
              </view>
            </view>
            <!-- 费用合计 -->
            <view class="total-row">
              <text class="label">费用合计：</text>
              <text class="amount">¥{{ (Number(item.price) || 0).toFixed(2) }}</text>
            </view>
            <!-- 按钮组：靠右紧凑展示 -->
            <view class="btn-group">
-              <button class="btn btn-delete" @click="handleDelete(item)">删除</button>
+              <!--              <button class="btn btn-delete" @click="handleDelete(item)">删除</button>-->
              <!-- 已缴费：申请开票/已开票 -->
              <template v-if="item.payStatus == 1">
-                <button class="btn btn-invoice" @click="makeInvoiceFN(item)" :disabled="item.invoiceStatus === 1">
+                <button :disabled="item.invoiceStatus === 1" class="btn btn-invoice" @click="makeInvoiceFN(item)">
                  {{ item.invoiceStatus === 1 ? '已开票' : '申请开票' }}
                </button>
              </template>
-              <!-- 未缴费：去缴费 + 取消订单 -->
+              <!--              &lt;!&ndash; 未缴费：去缴费 + 取消订单 &ndash;&gt;-->
-              <template v-if="item.payStatus == 0">
+              <!--              <template v-if="item.payStatus == 0">-->
-                <button class="btn btn-cancel" @click="handleCancel(item)">取消订单</button>
+              <!--                <button class="btn btn-cancel" @click="handleCancel(item)">取消订单</button>-->
-                <button class="btn btn-pay" @click="handlePay(item)">去缴费</button>
+              <!--                <button class="btn btn-pay" @click="handlePay(item)">去缴费</button>-->
-              </template>
+              <!--              </template>-->
            </view>
          </view>
        </view>
        <!-- 空状态 -->
-         <view v-else class="empty">
+        <view v-else class="empty">
-          <image class="empty-img" mode="aspectFit" :src="config.baseUrl_api + '/fs/static/nodata.png'"></image>
+          <image :src="config.baseUrl_api + '/fs/static/nodata.png'" class="empty-img" mode="aspectFit"></image>
          <text class="empty-text">暂无订单记录</text>
        </view>
        <!-- 加载/无更多提示 -->
-        <view class="loading-tip" v-if="loading">加载中...</view>
+        <view v-if="loading" class="loading-tip">加载中...</view>
-        <view class="no-more" v-if="!loading && !hasMore && list.length">没有更多了</view>
+        <view v-if="!loading && !hasMore && list.length" class="no-more">没有更多了</view>
      </view>
    </scroll-view>
    <!-- 自定义删除确认弹窗 -->
    <view v-if="showDelPopup" class="popup-mask" @touchmove.stop.prevent @click.stop="closeDelPopup">
      <view class="custom-modal" @click.stop>
@@ -104,7 +105,7 @@
        </view>
      </view>
    </view>
    <!-- 自定义取消订单确认弹窗 -->
    <view v-if="showCancelPopup" class="popup-mask" @touchmove.stop.prevent @click.stop="closeCancelPopup">
      <view class="custom-modal" @click.stop>
@@ -120,11 +121,12 @@
 </template>
 <script setup>
-import { ref, reactive, onMounted,computed } from 'vue';
+import {ref, reactive, onMounted, computed} from 'vue';
-import { onReachBottom } from '@dcloudio/uni-app'
+import {onReachBottom} from '@dcloudio/uni-app'
-import { useUserStore } from "../store/modules/user";
+import {useUserStore} from "../store/modules/user";
 import * as api from '@/common/api.js'
 import config from '@/config.js'
 const userStore = useUserStore()
 // 数据与分页配置
 const list = ref([]);
@@ -158,12 +160,14 @@ const currentOrder = ref(null);
 // 页面挂载初始化
 onMounted(() => {
  // 获取用户信息
-  if (userInfo.value && userInfo.value.perId) {
+  // if (userInfo.value && userInfo.value.perId) {
-    queryParams.perId = userInfo.value.perId;
+  //   queryParams.perId = userInfo.value.perId;
-    initData();
+  //   initData();
-  } else {
+  // } else {
-    uni.showToast({ title: '获取用户信息失败', icon: 'none' });
+  //   uni.showToast({title: '获取用户信息失败', icon: 'none'});
-  }
+  // }
+  initData();
 });
 // 小程序原生触底加载
@@ -215,7 +219,7 @@ const initData = async () => {
    hasMore.value = list.value.length < (res.total || 0);
  } catch (e) {
    console.error('订单加载异常：', e);
-    uni.showToast({ title: '加载失败', icon: 'none' });
+    uni.showToast({title: '加载失败', icon: 'none'});
  } finally {
    loading.value = false;
  }
@@ -234,13 +238,13 @@ const confirmDel = async () => {
  if (!currentOrder.value) return;
  try {
    await api.deleteOrder(currentOrder.value.id);
-    uni.showToast({ title: '删除成功', icon: 'success' });
+    uni.showToast({title: '删除成功', icon: 'success'});
    pageNum.value = 1;
    list.value = [];
    initData();
    closeDelPopup();
  } catch (e) {
-    uni.showToast({ title: '删除失败', icon: 'error' });
+    uni.showToast({title: '删除失败', icon: 'error'});
  }
 };
@@ -255,16 +259,16 @@ const closeDelPopup = () => {
 const handlePay = async (item) => {
  if (item.payStatus !== 0) return;
  try {
-    await api.goPay({ id: item.id });
+    await api.goPay({id: item.id});
-    uni.navigateTo({ url: `/pages/pay/pay?orderId=${item.id}` });
+    uni.navigateTo({url: `/pages/pay/pay?orderId=${item.id}`});
  } catch (e) {
-    uni.showToast({ title: '发起支付失败', icon: 'none' });
+    uni.showToast({title: '发起支付失败', icon: 'none'});
  }
 };
 // 申请开票
 const makeInvoiceFN = (item) => {
-  uni.navigateTo({ url: `/pages/invoice/apply?orderId=${item.id}amount=${item.price}` });
+  uni.navigateTo({url: `/pages/invoice/apply?orderId=${item.id}amount=${item.price}`});
 };
 // 取消订单
@@ -280,13 +284,13 @@ const confirmCancel = async () => {
  if (!currentOrder.value) return;
  try {
    await api.cancelPay(currentOrder.value.id);
-    uni.showToast({ title: '取消成功', icon: 'success' });
+    uni.showToast({title: '取消成功', icon: 'success'});
    pageNum.value = 1;
    list.value = [];
    initData();
    closeCancelPopup();
  } catch (e) {
-    uni.showToast({ title: '取消失败', icon: 'error' });
+    uni.showToast({title: '取消失败', icon: 'error'});
  }
 };
@@ -402,15 +406,18 @@ const closeCancelPopup = () => {
  justify-content: space-around;
  margin: 20rpx 0;
 }
-.line{
+.line {
  width: 1rpx;
  height: 90%;
  background: #eee;
 }
 .single-info {
  padding: 16rpx 20rpx;
  border-radius: 8rpx;
  font-size: 26rpx;
  .label {
    color: #999;
    text-align: center;
@@ -590,4 +597,4 @@ const closeCancelPopup = () => {
    border: none;
  }
 }
-</style>
\ No newline at end of file
+</style>