MrShi
9 小时以前 ce06ca62a0dd65d4a8fb57126948449c804ad77e
small-program/shop/pages/Invoice-request/Invoice-request.vue
@@ -48,7 +48,7 @@
         <view class="form-row input-row">
            <text class="row-label">税号</text>
            <input
               v-model="form.taxNo"
               v-model="form.taxId"
               class="row-input"
               type="text"
               placeholder="输入纳税人识别号或社会统一征信代码"
@@ -59,7 +59,9 @@
         <template v-if="titleType === 'company'">
            <view class="divider"></view>
            <view class="form-row input-row">
               <text class="row-label">开户银行</text>
               <text class="row-label">
                  <text v-if="isSpecialInvoice" class="required-star">*</text>开户银行
               </text>
               <input
                  v-model="form.bankName"
                  class="row-input"
@@ -71,7 +73,9 @@
            <view class="divider"></view>
            <view class="form-row input-row">
               <text class="row-label">银行账号</text>
               <text class="row-label">
                  <text v-if="isSpecialInvoice" class="required-star">*</text>银行账号
               </text>
               <input
                  v-model="form.bankAccount"
                  class="row-input"
@@ -83,9 +87,11 @@
            <view class="divider"></view>
            <view class="form-row input-row">
               <text class="row-label">企业地址</text>
               <text class="row-label">
                  <text v-if="isSpecialInvoice" class="required-star">*</text>企业地址
               </text>
               <input
                  v-model="form.companyAddress"
                  v-model="form.companyAddr"
                  class="row-input"
                  type="text"
                  placeholder="开具专票时必填"
@@ -95,7 +101,9 @@
            <view class="divider"></view>
            <view class="form-row input-row">
               <text class="row-label">企业电话</text>
               <text class="row-label">
                  <text v-if="isSpecialInvoice" class="required-star">*</text>企业电话
               </text>
               <input
                  v-model="form.companyPhone"
                  class="row-input"
@@ -108,8 +116,8 @@
      </view>
      <view class="detail-card">
         <view class="form-row detail-row" @tap="detailChecked = !detailChecked">
            <text class="row-label">抬头类型</text>
         <view class="form-row detail-row" :class="{ disabled: isSpecialInvoice }" @tap="handleDetailCheck">
            <text class="row-label">发票明细</text>
            <view class="detail-check">
               <view class="check-circle" :class="{ active: detailChecked }">
                  <u-icon v-if="detailChecked" name="checkbox-mark" size="12" color="#ffffff"></u-icon>
@@ -158,14 +166,15 @@
   export default {
      data() {
         return {
            orderNo: '202607131742520001',
            amount: '125.00',
            orderId: '',
            orderNo: '',
            amount: '',
            invoiceType: 'normal',
            tempInvoiceType: 'normal',
            showInvoiceTypePopup: false,
            titleType: 'personal',
            selectedTitle: '',
            detailChecked: false,
            detailChecked: true,
            invoiceTypeOptions: [
               {
                  label: '电子普通发票',
@@ -179,10 +188,10 @@
               }
            ],
            form: {
               taxNo: '',
               taxId: '',
               bankName: '',
               bankAccount: '',
               companyAddress: '',
               companyAddr: '',
               companyPhone: ''
            }
         };
@@ -191,7 +200,15 @@
         invoiceTypeLabel() {
            const current = this.invoiceTypeOptions.find((item) => item.value === this.invoiceType);
            return current ? current.label : '电子普通发票';
         },
         isSpecialInvoice() {
            return this.invoiceType === 'special';
         }
      },
      onLoad(options) {
         this.orderId = options.id || '';
         this.orderNo = options.orderNo || '';
         this.amount = options.invoiceAmount || '';
      },
      methods: {
         openInvoiceTypePopup() {
@@ -206,6 +223,40 @@
            this.showInvoiceTypePopup = false;
         },
         goConfirmInvoiceIssuance() {
            if (this.isSpecialInvoice) {
               if (!this.form.bankName) {
                  uni.showToast({ title: '请填写开户银行', icon: 'none' });
                  return;
               }
               if (!this.form.bankAccount) {
                  uni.showToast({ title: '请填写银行账号', icon: 'none' });
                  return;
               }
               if (!this.form.companyAddr) {
                  uni.showToast({ title: '请填写企业地址', icon: 'none' });
                  return;
               }
               if (!this.form.companyPhone) {
                  uni.showToast({ title: '请填写企业电话', icon: 'none' });
                  return;
               }
            }
            const invoiceData = {
               invoiceType: this.invoiceTypeLabel,
               titleType: this.titleType,
               titleTypeText: this.titleType === 'company' ? '企业' : '个人/事业单位',
               title: this.selectedTitle,
               content: '明细',
               amount: this.amount ? `¥${this.amount}` : '',
               taxNo: this.form.taxId,
               bankName: this.form.bankName,
               bankAccount: this.form.bankAccount,
               companyAddress: this.form.companyAddr,
               companyPhone: this.form.companyPhone,
               orderId: this.orderId,
               orderNo: this.orderNo
            }
            uni.setStorageSync('invoiceFormData', invoiceData)
            uni.navigateTo({
               url: '/shop/pages/confirm-invoice-issuance/confirm-invoice-issuance'
            });
@@ -214,15 +265,21 @@
            this.titleType = type;
            this.detailChecked = type === 'company';
         },
         handleDetailCheck() {
            if (this.isSpecialInvoice) return;
            this.detailChecked = !this.detailChecked;
         },
         chooseInvoiceTitle() {
            // #ifdef MP-WEIXIN
            uni.chooseInvoiceTitle({
               type: this.titleType === 'company' ? 0 : 1,
               success: (res) => {
                  console.log(res);
                  this.selectedTitle = res.title || '';
                  this.form.taxNo = res.taxNumber || '';
                  this.form.taxId = res.taxNumber || '';
                  this.form.bankName = res.bankName || '';
                  this.form.bankAccount = res.bankAccount || '';
                  this.form.companyAddress = res.companyAddress || '';
                  this.form.companyAddr = res.companyAddress || '';
                  this.form.companyPhone = res.telephone || '';
                  if (res.type === 1) {
@@ -293,10 +350,15 @@
   .row-label {
      flex-shrink: 0;
      width: 150rpx;
      width: 195rpx;
      font-size: 34rpx;
      line-height: 48rpx;
      color: #4a4a4a;
   }
   .required-star {
      color: #ff4d4f;
      margin-right: 4rpx;
   }
   .row-value {
@@ -401,6 +463,10 @@
      justify-content: space-between;
   }
   .detail-row.disabled {
      opacity: 0.6;
   }
   .invoice-type-popup {
      padding: 24rpx 24rpx calc(env(safe-area-inset-bottom) + 24rpx);
      background: #ffffff;