个人订单
Showing
5 changed files
with
484 additions
and
129 deletions
| 1 | // dev | 1 | // dev |
| 2 | // const baseUrl_api = 'http://192.168.1.125:8787' | 2 | const baseUrl_api = 'http://192.168.1.134:8787' |
| 3 | // const baseUrl_api = 'http://47.98.186.233:8787' | 3 | // const baseUrl_api = 'http://47.98.186.233:8787' |
| 4 | const baseUrl_api = 'https://tk001.wxjylt.com/stage-api/' | 4 | // const baseUrl_api = 'https://tk001.wxjylt.com/stage-api/' |
| 5 | const loginImage_api = 'https://tk001.wxjylt.com/stage-api' | 5 | const loginImage_api = 'https://tk001.wxjylt.com/stage-api' |
| 6 | const payUrl = 'https://wxpay.cmbc.com.cn/mobilePlatform/appserver/lcbpPay.do' | 6 | const payUrl = 'https://wxpay.cmbc.com.cn/mobilePlatform/appserver/lcbpPay.do' |
| 7 | 7 | ... | ... |
| ... | @@ -110,10 +110,13 @@ | ... | @@ -110,10 +110,13 @@ |
| 110 | const searchNoData = ref(false) | 110 | const searchNoData = ref(false) |
| 111 | const pageType = ref('') | 111 | const pageType = ref('') |
| 112 | onLoad((option) => { | 112 | onLoad((option) => { |
| 113 | if(option.pageType ){ | 113 | if(option.pageType){ |
| 114 | pageType.value = option.pageType || '' | 114 | pageType.value = option.pageType || '' |
| 115 | }else{ | 115 | } |
| 116 | if(option.chosen){ | ||
| 116 | chosen = JSON.parse(decodeURIComponent(option.chosen || '[]')) | 117 | chosen = JSON.parse(decodeURIComponent(option.chosen || '[]')) |
| 118 | } | ||
| 119 | if(option.ec){ | ||
| 117 | ec = option.ec | 120 | ec = option.ec |
| 118 | } | 121 | } |
| 119 | 122 | ... | ... |
| ... | @@ -1029,11 +1029,16 @@ function checkDialogs() { | ... | @@ -1029,11 +1029,16 @@ function checkDialogs() { |
| 1029 | const memberInfoData = app.globalData.memberInfo || {} | 1029 | const memberInfoData = app.globalData.memberInfo || {} |
| 1030 | 1030 | ||
| 1031 | // 密码长期未更新提示: changePassFlag='1' && activeStatus=1 && authenticationStatus=2 | 1031 | // 密码长期未更新提示: changePassFlag='1' && activeStatus=1 && authenticationStatus=2 |
| 1032 | // 只提示一次 | ||
| 1032 | if (app.globalData.changePassFlag == '1' && | 1033 | if (app.globalData.changePassFlag == '1' && |
| 1033 | app.globalData.memberInfo?.activeStatus == '1' && | 1034 | app.globalData.memberInfo?.activeStatus == '1' && |
| 1034 | app.globalData.authenticationStatus == 2) { | 1035 | app.globalData.authenticationStatus == 2) { |
| 1036 | const hasShown = uni.getStorageSync('passwordTipShown') | ||
| 1037 | if (!hasShown) { | ||
| 1038 | uni.setStorageSync('passwordTipShown', true) | ||
| 1035 | passwordTipPopup.value.open() | 1039 | passwordTipPopup.value.open() |
| 1036 | } | 1040 | } |
| 1041 | } | ||
| 1037 | 1042 | ||
| 1038 | // 绑定手机号条件: changePassFlag='1' && activeStatus=1 && authenticationStatus=2 && phonenumber为空 && checkFlag=1 | 1043 | // 绑定手机号条件: changePassFlag='1' && activeStatus=1 && authenticationStatus=2 && phonenumber为空 && checkFlag=1 |
| 1039 | if (app.globalData.changePassFlag === '1' && | 1044 | if (app.globalData.changePassFlag === '1' && | ... | ... |
| ... | @@ -454,7 +454,7 @@ const goToOrder = () => { | ... | @@ -454,7 +454,7 @@ const goToOrder = () => { |
| 454 | return | 454 | return |
| 455 | } | 455 | } |
| 456 | uni.navigateTo({ | 456 | uni.navigateTo({ |
| 457 | url: '/personal/order' | 457 | url: '/personal/order?perId=' + userInfo.value.perId |
| 458 | }); | 458 | }); |
| 459 | }; | 459 | }; |
| 460 | 460 | ... | ... |
| 1 | <template> | 1 | <template> |
| 2 | <view :class="{ 'no-scroll': isPopupOpen }" class="order-page"> | 2 | <view :class="{ 'no-scroll': isPopupOpen }" class="order-page"> |
| 3 | <!-- 搜索栏 --> | ||
| 4 | <view class="search-bar"> | ||
| 5 | <uni-easyinput | ||
| 6 | v-model="queryParams.wfCode" | ||
| 7 | :input-border="false" | ||
| 8 | class="search-input" | ||
| 9 | placeholder="搜索缴费编号" | ||
| 10 | placeholderStyle="font-size:30rpx;color:#999" | ||
| 11 | prefixIcon="search" | ||
| 12 | @blur="handelSearch" | ||
| 13 | @clear="handelSearch"> | ||
| 14 | </uni-easyinput> | ||
| 15 | <view class="add-btn" @click="handelSearch"> | ||
| 16 | <text class="add-text">搜索</text> | ||
| 17 | </view> | ||
| 18 | </view> | ||
| 19 | |||
| 3 | <!-- 订单列表 --> | 20 | <!-- 订单列表 --> |
| 4 | <scroll-view | 21 | <scroll-view |
| 5 | :enhanced="true" | 22 | :enhanced="true" |
| 6 | :scroll-enabled="!isPopupOpen" | 23 | :scroll-enabled="!isPopupOpen" |
| 7 | :show-scrollbar="false" | 24 | :show-scrollbar="false" |
| 8 | class="order-list-scroll" | 25 | class="order-list-scroll" |
| 26 | lower-threshold="200" | ||
| 9 | scroll-y | 27 | scroll-y |
| 28 | @scrolltolower="loadMore" | ||
| 10 | > | 29 | > |
| 11 | <view class="order-list"> | 30 | <view class="order-list"> |
| 12 | <!-- 有数据才循环 --> | 31 | <!-- 有数据才循环 --> |
| ... | @@ -14,39 +33,58 @@ | ... | @@ -14,39 +33,58 @@ |
| 14 | <view | 33 | <view |
| 15 | v-for="(item, index) in list" | 34 | v-for="(item, index) in list" |
| 16 | :key="index" | 35 | :key="index" |
| 17 | class="order-card" | 36 | class="order-card-new" |
| 37 | @click="goToDetail(item)" | ||
| 18 | > | 38 | > |
| 19 | <!-- 订单头部:日期 + 状态 --> | 39 | <!-- 订单头部:日期 + 状态 --> |
| 20 | <view class="card-header"> | 40 | <view class="card-header"> |
| 21 | <view class="date"> | 41 | <view class="date"> |
| 22 | <!-- <image v-if="item.payTime" :src="config.baseUrl_api + '/fs/static/calendar@2x.png'" mode="widthFix" --> | 42 | <view class="data-header"> |
| 23 | <!-- style="width:30rpx;height:30rpx;"/> --> | 43 | <text class="member-label">个人会员·</text> |
| 24 | <!-- <text v-if="item.payTime" class="date-text">{{ item.payTime }}</text> --> | 44 | <text class="value">{{ item.orderName || '——' }}</text> |
| 25 | <text class="value text-primary">{{ item.wfCode || '——' }}</text> | ||
| 26 | </view> | 45 | </view> |
| 27 | <view | 46 | <text :class="{ |
| 28 | :class="{ | 47 | 'status-wait': item.auditStatus == 0, |
| 29 | success: item.payStatus == 1, | 48 | 'status-pending': item.auditStatus == 1, |
| 30 | danger: item.payStatus == 2, | 49 | 'status-success': item.auditStatus == 2, |
| 31 | pending: item.payStatus == 0 | 50 | 'status-danger': item.auditStatus == 3 |
| 32 | }" | 51 | }" |
| 33 | class="status-tag" | 52 | class="status-tag ">{{ getAuditStatusText(item.auditStatus) }} |
| 34 | > | 53 | </text> |
| 35 | {{ getStatusText(item.payStatus) }} | ||
| 36 | </view> | 54 | </view> |
| 37 | </view> | 55 | </view> |
| 38 | 56 | <view class="card-header"> | |
| 39 | <!-- 订单编号、缴费编号 --> | 57 | <view class="date"> |
| 40 | <view class="info-row"> | 58 | <view class="data-header"> |
| 41 | <text class="label">订单编号:</text> | 59 | <text class="value"> |
| 42 | <text class="value">{{ item.tradeNo || '——' }}</text> | 60 | <text class="tradeNo">订单编号:</text> |
| 61 | {{ item.tradeNo || '——' }} | ||
| 62 | </text> | ||
| 63 | </view> | ||
| 64 | </view> | ||
| 65 | </view> | ||
| 66 | <view class="card-header"> | ||
| 67 | <view class="date"> | ||
| 68 | <view class="data-header"> | ||
| 69 | <text class="value"> | ||
| 70 | <text class="tradeNo">缴费编号:</text> | ||
| 71 | {{ item.wfCode || '——' }} | ||
| 72 | </text> | ||
| 73 | </view> | ||
| 74 | </view> | ||
| 75 | </view> | ||
| 76 | <view class="member-time"> | ||
| 77 | <view class="label"> | ||
| 78 | <text class="star">★</text> | ||
| 79 | {{ `${filterTime(item.genTime)}个人会员缴费办理` }} | ||
| 80 | </view> | ||
| 81 | <view class="price"> | ||
| 82 | <view>¥{{ item.price || '0.00' }}</view> | ||
| 83 | <view class="person">共{{ item.content?.yearCount || 0 }}年</view> | ||
| 43 | </view> | 84 | </view> |
| 44 | <view class="info-row"> | ||
| 45 | <text class="label">支付时间:</text> | ||
| 46 | <text class="value">{{ item.payTime || '' }}</text> | ||
| 47 | </view> | 85 | </view> |
| 48 | 86 | ||
| 49 | <!-- 核心:个人会员仅展示缴费年限 --> | 87 | <!-- 核心:展示缴费年限 --> |
| 50 | <view v-if="item.content" class="info-section flex f-j-s"> | 88 | <view v-if="item.content" class="info-section flex f-j-s"> |
| 51 | <view class="single-info"> | 89 | <view class="single-info"> |
| 52 | <view class="label">缴费年限:</view> | 90 | <view class="label">缴费年限:</view> |
| ... | @@ -54,31 +92,46 @@ | ... | @@ -54,31 +92,46 @@ |
| 54 | </view> | 92 | </view> |
| 55 | <view class="line"></view> | 93 | <view class="line"></view> |
| 56 | <view class="single-info"> | 94 | <view class="single-info"> |
| 57 | <view class="label">缴费方式</view> | 95 | <view class="label">订单状态</view> |
| 58 | <view class="value">{{ item.ziZhangBu ? '对公转账' : '民生付' }}</view> | 96 | <view :class="item.effect == 1 ? 'text-success' : 'text-warning'" class="value"> |
| 97 | {{ item.effect == 1 ? '已生效' : '未生效' }} | ||
| 98 | </view> | ||
| 99 | </view> | ||
| 100 | <view class="line"></view> | ||
| 101 | <view class="single-info"> | ||
| 102 | <view class="label">缴费状态</view> | ||
| 103 | <view | ||
| 104 | :class="{ | ||
| 105 | 'text-primary': item.payStatus == 0, | ||
| 106 | 'text-success': item.payStatus == 1, | ||
| 107 | 'text-danger': item.payStatus == 2 | ||
| 108 | }" | ||
| 109 | class="value" | ||
| 110 | > | ||
| 111 | {{ item.payStatus == 0 ? '待缴费' : item.payStatus == 1 ? '缴费成功' : '订单取消' }} | ||
| 59 | </view> | 112 | </view> |
| 60 | </view> | 113 | </view> |
| 61 | |||
| 62 | <!-- 费用合计 --> | ||
| 63 | <view class="total-row"> | ||
| 64 | <text class="label">费用合计:</text> | ||
| 65 | <text class="amount">¥{{ (Number(item.price) || 0).toFixed(2) }}</text> | ||
| 66 | </view> | 114 | </view> |
| 67 | 115 | ||
| 68 | <!-- 按钮组:靠右紧凑展示 --> | 116 | <!-- 按钮组 --> |
| 69 | <view class="btn-group"> | 117 | <view class="btn-group"> |
| 70 | <!-- <button class="btn btn-delete" @click="handleDelete(item)">删除</button>--> | 118 | <view> |
| 71 | <!-- 已缴费:申请开票/已开票 --> | 119 | <text class="more" @click.stop="goToDetail(item)">更多</text> |
| 72 | <template v-if="item.payStatus == 1"> | 120 | </view> |
| 73 | <button :disabled="item.invoiceStatus === 1" class="btn btn-invoice" @click="makeInvoiceFN(item)"> | 121 | <view class="btn-flex"> |
| 74 | {{ item.invoiceStatus === 1 ? '已开票' : '申请开票' }} | 122 | <button class="btn btn-info" @click.stop="goToDetail(item)">查看明细</button> |
| 123 | <!-- 已缴费:申请开票/已开票(需要审核通过才能开票) --> | ||
| 124 | <template v-if="item.payStatus == 1 && item.invoiceStatus != 1 && item.auditStatus == 2 && item.price > 0"> | ||
| 125 | <button :disabled="item.invoiceStatus === 1" class="btn btn-view-invoice" | ||
| 126 | @click.stop="makeInvoiceFN(item)"> | ||
| 127 | 开票 | ||
| 75 | </button> | 128 | </button> |
| 76 | </template> | 129 | </template> |
| 77 | <!-- <!– 未缴费:去缴费 + 取消订单 –>--> | 130 | <!-- 已开票:查看发票 --> |
| 78 | <!-- <template v-if="item.payStatus == 0">--> | 131 | <template v-if="item.invoiceStatus == 1"> |
| 79 | <!-- <button class="btn btn-cancel" @click="handleCancel(item)">取消订单</button>--> | 132 | <button class="btn btn-invoice" @click.stop="viewInvoice(item)">查看发票</button> |
| 80 | <!-- <button class="btn btn-pay" @click="handlePay(item)">去缴费</button>--> | 133 | </template> |
| 81 | <!-- </template>--> | 134 | </view> |
| 82 | </view> | 135 | </view> |
| 83 | </view> | 136 | </view> |
| 84 | </view> | 137 | </view> |
| ... | @@ -95,6 +148,46 @@ | ... | @@ -95,6 +148,46 @@ |
| 95 | </view> | 148 | </view> |
| 96 | </scroll-view> | 149 | </scroll-view> |
| 97 | 150 | ||
| 151 | <!-- 发票查看弹窗 --> | ||
| 152 | <view v-if="showInvoicePopup" class="invoice-popup-mask" @click="closeInvoicePopup"> | ||
| 153 | <view class="invoice-popup-content" @click.stop> | ||
| 154 | <view class="invoice-popup-header"> | ||
| 155 | <text class="invoice-popup-title">发票信息</text> | ||
| 156 | <view class="invoice-popup-close" @click.stop="closeInvoicePopup">✕</view> | ||
| 157 | </view> | ||
| 158 | <view class="invoice-popup-body"> | ||
| 159 | <view class="invoice-info-list"> | ||
| 160 | <view class="invoice-info-row"> | ||
| 161 | <view class="invoice-info-label">发票类型</view> | ||
| 162 | <view :class="{ 'vat-type': invoiceData.invoiceType == 2 }" class="invoice-type-badge"> | ||
| 163 | {{ invoiceData.invoiceType == 1 ? '普通发票' : '增值税专用发票' }} | ||
| 164 | </view> | ||
| 165 | </view> | ||
| 166 | <view class="invoice-info-row"> | ||
| 167 | <text class="invoice-info-label">发票抬头</text> | ||
| 168 | <text class="invoice-info-value">{{ invoiceData.invoiceBuyerName || '—' }}</text> | ||
| 169 | </view> | ||
| 170 | <view v-if="invoiceData.invoiceBuyerTaxno" class="invoice-info-row"> | ||
| 171 | <text class="invoice-info-label">纳税人识别号</text> | ||
| 172 | <text class="invoice-info-value">{{ invoiceData.invoiceBuyerTaxno }}</text> | ||
| 173 | </view> | ||
| 174 | <view class="invoice-info-row"> | ||
| 175 | <text class="invoice-info-label">接收邮箱</text> | ||
| 176 | <text class="invoice-info-value">{{ invoiceData.invoicePushPhone || '—' }}</text> | ||
| 177 | </view> | ||
| 178 | <view class="invoice-info-row"> | ||
| 179 | <text class="invoice-info-label">开票时间</text> | ||
| 180 | <text class="invoice-info-value">{{ invoiceData.invoiceTime || '—' }}</text> | ||
| 181 | </view> | ||
| 182 | <view class="invoice-info-row"> | ||
| 183 | <text class="invoice-info-label">开票金额</text> | ||
| 184 | <text class="invoice-info-value">¥{{ invoiceData.price || '—' }}</text> | ||
| 185 | </view> | ||
| 186 | </view> | ||
| 187 | </view> | ||
| 188 | </view> | ||
| 189 | </view> | ||
| 190 | |||
| 98 | <!-- 自定义删除确认弹窗 --> | 191 | <!-- 自定义删除确认弹窗 --> |
| 99 | <view v-if="showDelPopup" class="popup-mask" @touchmove.stop.prevent @click.stop="closeDelPopup"> | 192 | <view v-if="showDelPopup" class="popup-mask" @touchmove.stop.prevent @click.stop="closeDelPopup"> |
| 100 | <view class="custom-modal" @click.stop> | 193 | <view class="custom-modal" @click.stop> |
| ... | @@ -123,10 +216,11 @@ | ... | @@ -123,10 +216,11 @@ |
| 123 | 216 | ||
| 124 | <script setup> | 217 | <script setup> |
| 125 | import {ref, reactive, onMounted, computed} from 'vue'; | 218 | import {ref, reactive, onMounted, computed} from 'vue'; |
| 126 | import {onReachBottom} from '@dcloudio/uni-app' | 219 | import {onReachBottom, onShow, onLoad} from '@dcloudio/uni-app' |
| 127 | import {useUserStore} from "@/store/modules/user"; | 220 | import {useUserStore} from "@/store/modules/user"; |
| 128 | import * as api from '@/common/api.js' | 221 | import * as api from '@/common/api.js' |
| 129 | import config from '@/config.js' | 222 | import config from '@/config.js' |
| 223 | import dayjs from 'dayjs' | ||
| 130 | 224 | ||
| 131 | const userStore = useUserStore() | 225 | const userStore = useUserStore() |
| 132 | // 数据与分页配置 | 226 | // 数据与分页配置 |
| ... | @@ -136,21 +230,22 @@ const hasMore = ref(true); | ... | @@ -136,21 +230,22 @@ const hasMore = ref(true); |
| 136 | const pageNum = ref(1); | 230 | const pageNum = ref(1); |
| 137 | const pageSize = ref(10); | 231 | const pageSize = ref(10); |
| 138 | const userInfo = computed(() => userStore.user) | 232 | const userInfo = computed(() => userStore.user) |
| 233 | |||
| 139 | // 查询参数(固定为个人会员类型) | 234 | // 查询参数(固定为个人会员类型) |
| 140 | const queryParams = reactive({ | 235 | const queryParams = reactive({ |
| 141 | pageNum: 1, | 236 | pageNum: 1, |
| 142 | pageSize: 10, | 237 | pageSize: 10, |
| 143 | type: '0', // 0表示个人会员 | 238 | type: '0', |
| 144 | subType: '1', //0道馆 1个人 | 239 | // subType: '1', |
| 145 | // queryType: '1', | 240 | // perId: '' |
| 146 | // payStatus: '', | ||
| 147 | perId: '' | ||
| 148 | }); | 241 | }); |
| 149 | 242 | ||
| 150 | // 弹窗控制 | 243 | // 弹窗控制 |
| 151 | const showDelPopup = ref(false); | 244 | const showDelPopup = ref(false); |
| 152 | const showCancelPopup = ref(false); | 245 | const showCancelPopup = ref(false); |
| 153 | const isPopupOpen = ref(false); | 246 | const isPopupOpen = ref(false); |
| 247 | const showInvoicePopup = ref(false); | ||
| 248 | const invoiceData = ref({}); | ||
| 154 | 249 | ||
| 155 | // 弹窗内容 | 250 | // 弹窗内容 |
| 156 | const delModalContent = ref(''); | 251 | const delModalContent = ref(''); |
| ... | @@ -159,27 +254,66 @@ const cancelModalContent = ref(''); | ... | @@ -159,27 +254,66 @@ const cancelModalContent = ref(''); |
| 159 | // 当前操作的订单 | 254 | // 当前操作的订单 |
| 160 | const currentOrder = ref(null); | 255 | const currentOrder = ref(null); |
| 161 | 256 | ||
| 257 | // 是否需要刷新 | ||
| 258 | const needRefresh = ref(false); | ||
| 259 | |||
| 260 | // 审核状态文本映射 | ||
| 261 | const getAuditStatusText = (status) => { | ||
| 262 | const map = { | ||
| 263 | 0: '待提交', | ||
| 264 | 1: '审核中', | ||
| 265 | 2: '审核通过', | ||
| 266 | 3: '审核拒绝' | ||
| 267 | }; | ||
| 268 | return map[status] || ''; | ||
| 269 | }; | ||
| 270 | onLoad((options) => { | ||
| 271 | // queryParams.perId = options.perId || userInfo.value.perId | ||
| 272 | initData(); | ||
| 273 | }) | ||
| 274 | const filterTime = (row) => { | ||
| 275 | if (!row) return '' | ||
| 276 | return dayjs(row).format('YYYY年MM月DD日') | ||
| 277 | } | ||
| 278 | |||
| 162 | // 页面挂载初始化 | 279 | // 页面挂载初始化 |
| 163 | onMounted(() => { | 280 | onMounted(() => { |
| 164 | // 获取用户信息 | 281 | initData(); |
| 165 | // if (userInfo.value && userInfo.value.perId) { | 282 | }); |
| 166 | // queryParams.perId = userInfo.value.perId; | ||
| 167 | // initData(); | ||
| 168 | // } else { | ||
| 169 | // uni.showToast({title: '获取用户信息失败', icon: 'none'}); | ||
| 170 | // } | ||
| 171 | 283 | ||
| 284 | // 页面显示时刷新数据(从开票页面返回时) | ||
| 285 | onShow(() => { | ||
| 286 | if (needRefresh.value) { | ||
| 287 | needRefresh.value = false; | ||
| 288 | pageNum.value = 1; | ||
| 289 | list.value = []; | ||
| 290 | hasMore.value = true; | ||
| 172 | initData(); | 291 | initData(); |
| 292 | } | ||
| 173 | }); | 293 | }); |
| 174 | 294 | ||
| 175 | // 小程序原生触底加载 | 295 | // 小程序原生触底加载 |
| 176 | onReachBottom(() => { | 296 | onReachBottom(() => { |
| 177 | if (!loading.value && hasMore.value && !isPopupOpen.value) { | 297 | if (!loading.value && hasMore.value && !isPopupOpen.value) { |
| 178 | pageNum.value++; | 298 | loadMore(); |
| 179 | initData(); | ||
| 180 | } | 299 | } |
| 181 | }); | 300 | }); |
| 182 | 301 | ||
| 302 | // 上拉加载更多 | ||
| 303 | const loadMore = () => { | ||
| 304 | if (loading.value || !hasMore.value || isPopupOpen.value) return; | ||
| 305 | pageNum.value++; | ||
| 306 | initData(); | ||
| 307 | }; | ||
| 308 | |||
| 309 | // 搜索 | ||
| 310 | const handelSearch = () => { | ||
| 311 | pageNum.value = 1; | ||
| 312 | list.value = []; | ||
| 313 | hasMore.value = true; | ||
| 314 | initData(); | ||
| 315 | }; | ||
| 316 | |||
| 183 | // 状态文本映射 | 317 | // 状态文本映射 |
| 184 | const getStatusText = (status) => { | 318 | const getStatusText = (status) => { |
| 185 | const map = { | 319 | const map = { |
| ... | @@ -196,9 +330,9 @@ const initData = async () => { | ... | @@ -196,9 +330,9 @@ const initData = async () => { |
| 196 | queryParams.pageNum = pageNum.value; | 330 | queryParams.pageNum = pageNum.value; |
| 197 | try { | 331 | try { |
| 198 | const res = await api.orderList(queryParams); | 332 | const res = await api.orderList(queryParams); |
| 199 | if (!res || !res.rows) { | 333 | if (!res || !res.rows || res.rows.length === 0) { |
| 200 | list.value = []; | ||
| 201 | hasMore.value = false; | 334 | hasMore.value = false; |
| 335 | loading.value = false; | ||
| 202 | return; | 336 | return; |
| 203 | } | 337 | } |
| 204 | // 安全解析content字段 | 338 | // 安全解析content字段 |
| ... | @@ -222,11 +356,18 @@ const initData = async () => { | ... | @@ -222,11 +356,18 @@ const initData = async () => { |
| 222 | } catch (e) { | 356 | } catch (e) { |
| 223 | console.error('订单加载异常:', e); | 357 | console.error('订单加载异常:', e); |
| 224 | uni.showToast({title: '加载失败', icon: 'none'}); | 358 | uni.showToast({title: '加载失败', icon: 'none'}); |
| 359 | hasMore.value = false; | ||
| 225 | } finally { | 360 | } finally { |
| 226 | loading.value = false; | 361 | loading.value = false; |
| 227 | } | 362 | } |
| 228 | }; | 363 | }; |
| 229 | 364 | ||
| 365 | // 查看明细/详情 | ||
| 366 | const goToDetail = (item) => { | ||
| 367 | const form = encodeURIComponent(JSON.stringify(item)); | ||
| 368 | uni.navigateTo({url: `/personalVip/orderDetail?rangeId=${item.sourceId || item.id}&type=${queryParams.type}`}); | ||
| 369 | }; | ||
| 370 | |||
| 230 | // 删除订单 | 371 | // 删除订单 |
| 231 | const handleDelete = (item) => { | 372 | const handleDelete = (item) => { |
| 232 | currentOrder.value = item; | 373 | currentOrder.value = item; |
| ... | @@ -270,7 +411,30 @@ const handlePay = async (item) => { | ... | @@ -270,7 +411,30 @@ const handlePay = async (item) => { |
| 270 | 411 | ||
| 271 | // 申请开票 | 412 | // 申请开票 |
| 272 | const makeInvoiceFN = (item) => { | 413 | const makeInvoiceFN = (item) => { |
| 273 | uni.navigateTo({url: `/pages/invoice/apply?orderId=${item.id}&amount=${item.price}&type=1`}); | 414 | needRefresh.value = true; |
| 415 | uni.navigateTo({ | ||
| 416 | url: `/pages/invoice/apply?orderId=${item.id}&amount=${item.price}&type=1` | ||
| 417 | }); | ||
| 418 | }; | ||
| 419 | |||
| 420 | // 查看发票 | ||
| 421 | const viewInvoice = (item) => { | ||
| 422 | invoiceData.value = { | ||
| 423 | invoiceType: item.invoiceType || 1, | ||
| 424 | invoiceBuyerName: item.invoiceTitle || item.invoiceBuyerName || '—', | ||
| 425 | invoiceBuyerTaxno: item.invoiceTaxno || item.invoiceBuyerTaxno || '', | ||
| 426 | invoicePushPhone: item.invoiceEmail || item.invoicePushPhone || '—', | ||
| 427 | price: item.price || '-', | ||
| 428 | invoiceTime: item.invoiceTime || '—' | ||
| 429 | }; | ||
| 430 | showInvoicePopup.value = true; | ||
| 431 | isPopupOpen.value = true; | ||
| 432 | }; | ||
| 433 | |||
| 434 | // 关闭发票弹窗 | ||
| 435 | const closeInvoicePopup = () => { | ||
| 436 | showInvoicePopup.value = false; | ||
| 437 | isPopupOpen.value = false; | ||
| 274 | }; | 438 | }; |
| 275 | 439 | ||
| 276 | // 取消订单 | 440 | // 取消订单 |
| ... | @@ -317,6 +481,42 @@ const closeCancelPopup = () => { | ... | @@ -317,6 +481,42 @@ const closeCancelPopup = () => { |
| 317 | } | 481 | } |
| 318 | } | 482 | } |
| 319 | 483 | ||
| 484 | /* 搜索栏 */ | ||
| 485 | .search-bar { | ||
| 486 | display: flex; | ||
| 487 | align-items: center; | ||
| 488 | padding: 20rpx 30rpx; | ||
| 489 | background-color: #ffffff; | ||
| 490 | margin-bottom: 0; | ||
| 491 | |||
| 492 | .search-input { | ||
| 493 | flex: 1; | ||
| 494 | margin-right: 20rpx; | ||
| 495 | |||
| 496 | :deep(.uni-easyinput__content) { | ||
| 497 | border-radius: 40rpx; | ||
| 498 | background-color: #f5f7fa; | ||
| 499 | height: 76rpx; | ||
| 500 | padding: 0 24rpx; | ||
| 501 | } | ||
| 502 | |||
| 503 | :deep(.uni-easyinput__content-input) { | ||
| 504 | font-size: 28rpx; | ||
| 505 | color: #333; | ||
| 506 | } | ||
| 507 | } | ||
| 508 | |||
| 509 | .add-btn { | ||
| 510 | display: flex; | ||
| 511 | align-items: center; | ||
| 512 | padding: 10rpx 30rpx; | ||
| 513 | background-color: #AD181F; | ||
| 514 | border-radius: 40rpx; | ||
| 515 | font-size: 28rpx; | ||
| 516 | color: #ffffff; | ||
| 517 | } | ||
| 518 | } | ||
| 519 | |||
| 320 | // 滚动列表容器 | 520 | // 滚动列表容器 |
| 321 | .order-list-scroll { | 521 | .order-list-scroll { |
| 322 | flex: 1; | 522 | flex: 1; |
| ... | @@ -327,75 +527,106 @@ const closeCancelPopup = () => { | ... | @@ -327,75 +527,106 @@ const closeCancelPopup = () => { |
| 327 | // 订单列表 | 527 | // 订单列表 |
| 328 | .order-list { | 528 | .order-list { |
| 329 | padding: 20rpx; | 529 | padding: 20rpx; |
| 530 | } | ||
| 330 | 531 | ||
| 331 | .order-card { | 532 | .order-card-new { |
| 332 | background: #fff; | 533 | background: #fff; |
| 333 | margin-bottom: 20rpx; | 534 | margin-bottom: 20rpx; |
| 334 | padding: 20rpx; | 535 | padding: 20rpx; |
| 335 | box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04); | 536 | box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04); |
| 336 | border-radius: 12rpx; | 537 | border-radius: 12rpx; |
| 337 | } | 538 | display: flex; |
| 338 | } | 539 | flex-direction: column; |
| 339 | 540 | ||
| 340 | // 卡片头部 | 541 | // 卡片头部 |
| 341 | .card-header { | 542 | .card-header { |
| 342 | display: flex; | 543 | display: flex; |
| 343 | justify-content: space-between; | 544 | justify-content: space-between; |
| 344 | align-items: center; | 545 | align-items: center; |
| 345 | padding-bottom: 20rpx; | 546 | padding-bottom: 10rpx; |
| 346 | 547 | ||
| 347 | .date { | 548 | .date { |
| 549 | width: 100%; | ||
| 348 | display: flex; | 550 | display: flex; |
| 349 | align-items: center; | 551 | align-items: center; |
| 552 | justify-content: space-between; | ||
| 350 | gap: 8rpx; | 553 | gap: 8rpx; |
| 351 | font-size: 26rpx; | 554 | font-size: 26rpx; |
| 352 | 555 | ||
| 556 | .data-header { | ||
| 557 | display: flex; | ||
| 558 | } | ||
| 559 | |||
| 560 | .member-label { | ||
| 561 | color: #c30d23; | ||
| 562 | font-size: 28rpx; | ||
| 563 | font-weight: bold; | ||
| 564 | } | ||
| 565 | |||
| 566 | .value { | ||
| 567 | color: #000; | ||
| 568 | font-size: 28rpx; | ||
| 569 | font-weight: bold; | ||
| 570 | |||
| 571 | .tradeNo { | ||
| 572 | color: #999; | ||
| 573 | font-size: 26rpx; | ||
| 574 | } | ||
| 575 | } | ||
| 576 | |||
| 353 | .date-text { | 577 | .date-text { |
| 354 | color: #666; | 578 | color: #666; |
| 355 | } | 579 | } |
| 356 | } | 580 | } |
| 357 | 581 | ||
| 358 | .status-tag { | 582 | .status-tag { |
| 359 | font-size: 22rpx; | 583 | font-size: 26rpx; |
| 360 | padding: 6rpx 16rpx; | 584 | |
| 361 | border-radius: 20rpx; | 585 | &.status-wait { |
| 586 | color: #597ef7; | ||
| 587 | } | ||
| 588 | |||
| 589 | &.status-pending { | ||
| 590 | color: #faad14; | ||
| 591 | } | ||
| 362 | 592 | ||
| 363 | &.success { | 593 | &.status-success { |
| 364 | background: #e6f7ef; | ||
| 365 | color: #52c41a; | 594 | color: #52c41a; |
| 366 | border: 1rpx solid rgba(82, 196, 26, 0.3); | ||
| 367 | } | 595 | } |
| 368 | 596 | ||
| 369 | &.danger { | 597 | &.status-danger { |
| 370 | background: #fff1f0; | ||
| 371 | color: #ff4d4f; | 598 | color: #ff4d4f; |
| 372 | border: 1rpx solid rgba(232, 52, 29, 0.3); | ||
| 373 | } | 599 | } |
| 374 | |||
| 375 | &.pending { | ||
| 376 | background: #fff7e6; | ||
| 377 | color: #faad14; | ||
| 378 | border: 1rpx solid rgba(250, 173, 20, 0.3); | ||
| 379 | } | 600 | } |
| 380 | } | 601 | } |
| 381 | } | ||
| 382 | 602 | ||
| 383 | // 基础信息行 | 603 | .member-time { |
| 384 | .info-row { | 604 | width: 100%; |
| 385 | display: flex; | 605 | display: flex; |
| 386 | align-items: center; | 606 | justify-content: space-between; |
| 387 | margin-bottom: 20rpx; | 607 | padding-bottom: 10rpx; |
| 388 | font-size: 26rpx; | ||
| 389 | 608 | ||
| 390 | .label { | 609 | .label { |
| 610 | font-size: 26rpx; | ||
| 391 | color: #999; | 611 | color: #999; |
| 392 | flex-shrink: 0; | 612 | |
| 393 | width: 140rpx; | 613 | .star { |
| 614 | color: #000; | ||
| 615 | font-size: 28rpx; | ||
| 616 | } | ||
| 394 | } | 617 | } |
| 395 | 618 | ||
| 396 | .value { | 619 | .price { |
| 397 | color: #333; | 620 | font-size: 30rpx; |
| 398 | word-break: break-all; | 621 | color: #000; |
| 622 | font-weight: bold; | ||
| 623 | |||
| 624 | .person { | ||
| 625 | font-size: 24rpx; | ||
| 626 | color: #999; | ||
| 627 | text-align: right; | ||
| 628 | } | ||
| 629 | } | ||
| 399 | } | 630 | } |
| 400 | } | 631 | } |
| 401 | 632 | ||
| ... | @@ -403,21 +634,25 @@ const closeCancelPopup = () => { | ... | @@ -403,21 +634,25 @@ const closeCancelPopup = () => { |
| 403 | background: #f3f6fc; | 634 | background: #f3f6fc; |
| 404 | display: flex; | 635 | display: flex; |
| 405 | align-items: center; | 636 | align-items: center; |
| 406 | padding: 0 40rpx; | 637 | justify-content: space-between; |
| 407 | justify-content: space-around; | 638 | padding: 0 20rpx; |
| 408 | margin: 20rpx 0; | 639 | min-height: 100rpx; |
| 640 | border-radius: 20rpx; | ||
| 409 | } | 641 | } |
| 410 | 642 | ||
| 411 | .line { | 643 | .line { |
| 412 | width: 1rpx; | 644 | width: 1rpx; |
| 413 | height: 90%; | 645 | height: 60rpx; |
| 414 | background: #eee; | 646 | background: #e5e5e5; |
| 647 | flex-shrink: 0; | ||
| 415 | } | 648 | } |
| 416 | 649 | ||
| 417 | .single-info { | 650 | .single-info { |
| 651 | flex: 1; | ||
| 418 | padding: 16rpx 20rpx; | 652 | padding: 16rpx 20rpx; |
| 419 | border-radius: 8rpx; | 653 | border-radius: 8rpx; |
| 420 | font-size: 26rpx; | 654 | font-size: 26rpx; |
| 655 | text-align: center; | ||
| 421 | 656 | ||
| 422 | .label { | 657 | .label { |
| 423 | color: #999; | 658 | color: #999; |
| ... | @@ -429,63 +664,83 @@ const closeCancelPopup = () => { | ... | @@ -429,63 +664,83 @@ const closeCancelPopup = () => { |
| 429 | font-weight: 500; | 664 | font-weight: 500; |
| 430 | text-align: center; | 665 | text-align: center; |
| 431 | margin-top: 10rpx; | 666 | margin-top: 10rpx; |
| 667 | |||
| 668 | &.text-primary { | ||
| 669 | color: #597ef7; | ||
| 432 | } | 670 | } |
| 433 | } | ||
| 434 | 671 | ||
| 435 | // 费用合计 | 672 | &.text-success { |
| 436 | .total-row { | 673 | color: #52c41a; |
| 437 | display: flex; | 674 | } |
| 438 | justify-content: space-between; | ||
| 439 | align-items: center; | ||
| 440 | margin: 0 0 16rpx; | ||
| 441 | padding: 8rpx 0; | ||
| 442 | font-size: 26rpx; | ||
| 443 | 675 | ||
| 444 | .label { | 676 | &.text-danger { |
| 445 | color: #333; | 677 | color: #ff4d4f; |
| 446 | } | 678 | } |
| 447 | 679 | ||
| 448 | .amount { | 680 | &.text-warning { |
| 449 | color: #EB6100; | 681 | color: #faad14; |
| 450 | font-weight: 600; | 682 | } |
| 451 | font-size: 28rpx; | ||
| 452 | } | 683 | } |
| 453 | } | 684 | } |
| 454 | 685 | ||
| 455 | // 按钮组 | 686 | // 按钮组 |
| 456 | .btn-group { | 687 | .btn-group { |
| 457 | display: flex; | 688 | display: flex; |
| 458 | justify-content: flex-end; | 689 | justify-content: space-between; |
| 459 | align-items: center; | 690 | align-items: center; |
| 460 | gap: 16rpx; | 691 | gap: 16rpx; |
| 461 | width: 100%; | 692 | width: 100%; |
| 693 | margin-top: 20rpx; | ||
| 694 | |||
| 695 | .more { | ||
| 696 | color: #666; | ||
| 697 | } | ||
| 698 | |||
| 699 | .btn-flex { | ||
| 700 | display: flex; | ||
| 701 | justify-content: flex-end; | ||
| 702 | gap: 16rpx; | ||
| 703 | } | ||
| 462 | 704 | ||
| 463 | .btn { | 705 | .btn { |
| 464 | padding: 12rpx 32rpx; | 706 | width: 160rpx; |
| 465 | border-radius: 40rpx; | 707 | height: 50rpx; |
| 466 | font-size: 24rpx; | 708 | line-height: 50rpx; |
| 467 | line-height: 1.5; | 709 | padding: 0; |
| 710 | border-radius: 20rpx; | ||
| 711 | font-size: 28rpx; | ||
| 468 | white-space: nowrap; | 712 | white-space: nowrap; |
| 469 | display: inline-block; | 713 | font-weight: bold; |
| 470 | margin: 0; | ||
| 471 | border: none; | 714 | border: none; |
| 472 | width: 80px; | ||
| 473 | background: transparent; | 715 | background: transparent; |
| 716 | text-align: center; | ||
| 717 | margin: 0; | ||
| 474 | 718 | ||
| 475 | &::after { | 719 | &::after { |
| 476 | border: none; | 720 | border: none; |
| 721 | display: none; | ||
| 477 | } | 722 | } |
| 478 | 723 | ||
| 479 | &.btn-delete { | 724 | &.btn-delete { |
| 480 | background: #fff; | 725 | background: #fff; |
| 481 | color: #e4393c; | 726 | color: #c30d23; |
| 482 | border: 1rpx solid #e4393c; | 727 | border: 1rpx solid #c30d23; |
| 483 | } | 728 | } |
| 484 | 729 | ||
| 485 | &.btn-invoice { | 730 | &.btn-invoice { |
| 486 | background: #fff; | 731 | background: #fff; |
| 487 | color: #e4393c; | 732 | color: #c30d23; |
| 488 | border: 1rpx solid #e4393c; | 733 | border: 1rpx solid #c30d23; |
| 734 | } | ||
| 735 | |||
| 736 | &.btn-view-invoice { | ||
| 737 | color: #c30d23; | ||
| 738 | border: 1rpx solid #c30d23; | ||
| 739 | } | ||
| 740 | |||
| 741 | &.btn-info { | ||
| 742 | color: #444; | ||
| 743 | border: 1rpx solid #666; | ||
| 489 | } | 744 | } |
| 490 | 745 | ||
| 491 | &.btn-cancel { | 746 | &.btn-cancel { |
| ... | @@ -495,9 +750,8 @@ const closeCancelPopup = () => { | ... | @@ -495,9 +750,8 @@ const closeCancelPopup = () => { |
| 495 | } | 750 | } |
| 496 | 751 | ||
| 497 | &.btn-pay { | 752 | &.btn-pay { |
| 498 | background: linear-gradient(90deg, #FF755A, #F51722); | 753 | color: #c30d23; |
| 499 | color: #fff; | 754 | border: 1rpx solid #c30d23; |
| 500 | border: none; | ||
| 501 | } | 755 | } |
| 502 | 756 | ||
| 503 | &:disabled { | 757 | &:disabled { |
| ... | @@ -515,6 +769,99 @@ const closeCancelPopup = () => { | ... | @@ -515,6 +769,99 @@ const closeCancelPopup = () => { |
| 515 | font-size: 26rpx; | 769 | font-size: 26rpx; |
| 516 | } | 770 | } |
| 517 | 771 | ||
| 772 | // 发票弹窗样式 | ||
| 773 | .invoice-popup-mask { | ||
| 774 | position: fixed; | ||
| 775 | top: 0; | ||
| 776 | left: 0; | ||
| 777 | right: 0; | ||
| 778 | bottom: 0; | ||
| 779 | background-color: rgba(0, 0, 0, 0.5); | ||
| 780 | display: flex; | ||
| 781 | align-items: center; | ||
| 782 | justify-content: center; | ||
| 783 | z-index: 999; | ||
| 784 | } | ||
| 785 | |||
| 786 | .invoice-popup-content { | ||
| 787 | width: 600rpx; | ||
| 788 | background: #fff; | ||
| 789 | border-radius: 20rpx; | ||
| 790 | overflow: hidden; | ||
| 791 | box-shadow: 0 10rpx 30rpx rgba(0, 0, 0, 0.2); | ||
| 792 | } | ||
| 793 | |||
| 794 | .invoice-popup-header { | ||
| 795 | display: flex; | ||
| 796 | justify-content: space-between; | ||
| 797 | align-items: center; | ||
| 798 | padding: 30rpx; | ||
| 799 | background: linear-gradient(135deg, #AD181F 0%, #E4393C 100%); | ||
| 800 | |||
| 801 | .invoice-popup-title { | ||
| 802 | font-size: 32rpx; | ||
| 803 | font-weight: 600; | ||
| 804 | color: #fff; | ||
| 805 | } | ||
| 806 | |||
| 807 | .invoice-popup-close { | ||
| 808 | width: 44rpx; | ||
| 809 | height: 44rpx; | ||
| 810 | display: flex; | ||
| 811 | align-items: center; | ||
| 812 | justify-content: center; | ||
| 813 | font-size: 28rpx; | ||
| 814 | color: rgba(255, 255, 255, 0.8); | ||
| 815 | } | ||
| 816 | } | ||
| 817 | |||
| 818 | .invoice-popup-body { | ||
| 819 | padding: 30rpx; | ||
| 820 | } | ||
| 821 | |||
| 822 | .invoice-type-badge { | ||
| 823 | display: inline-flex; | ||
| 824 | align-items: center; | ||
| 825 | padding: 8rpx 24rpx; | ||
| 826 | background: linear-gradient(135deg, #FF755A 0%, #F51722 100%); | ||
| 827 | color: #fff; | ||
| 828 | border-radius: 30rpx; | ||
| 829 | font-size: 24rpx; | ||
| 830 | font-weight: 500; | ||
| 831 | |||
| 832 | &.vat-type { | ||
| 833 | background: linear-gradient(135deg, #6aaaf2 0%, #178cd7 100%); | ||
| 834 | } | ||
| 835 | } | ||
| 836 | |||
| 837 | .invoice-info-list { | ||
| 838 | .invoice-info-row { | ||
| 839 | display: flex; | ||
| 840 | justify-content: space-between; | ||
| 841 | align-items: flex-start; | ||
| 842 | padding: 24rpx 0; | ||
| 843 | border-bottom: 1rpx dashed #eee; | ||
| 844 | |||
| 845 | &:last-child { | ||
| 846 | border-bottom: none; | ||
| 847 | } | ||
| 848 | |||
| 849 | .invoice-info-label { | ||
| 850 | font-size: 26rpx; | ||
| 851 | color: #999; | ||
| 852 | flex-shrink: 0; | ||
| 853 | } | ||
| 854 | |||
| 855 | .invoice-info-value { | ||
| 856 | font-size: 26rpx; | ||
| 857 | color: #333; | ||
| 858 | text-align: right; | ||
| 859 | word-break: break-all; | ||
| 860 | max-width: 340rpx; | ||
| 861 | } | ||
| 862 | } | ||
| 863 | } | ||
| 864 | |||
| 518 | // 弹窗遮罩层 | 865 | // 弹窗遮罩层 |
| 519 | .popup-mask { | 866 | .popup-mask { |
| 520 | position: fixed; | 867 | position: fixed; | ... | ... |
-
Please register or sign in to post a comment