开票

张猛
Showing 2 changed files with 59 additions and 56 deletions
pages/invoice/apply.vue
personal/order.vue
--- a/pages/invoice/apply.vue
View file @11fa390
+++ b/pages/invoice/apply.vue
View file @11fa390
@@ -6,9 +6,9 @@
        <text class="label">发票类型</text>
        <view class="type-select">
          <view
+            :class="{ active: form.invoiceType === '2' }"
            class="type-option"
-            :class="{ active: form.invoiceType === '1' }"
+            @click="form.invoiceType = '2'"
-            @click="form.invoiceType = '1'"
          >
            <view class="type-icon">个</view>
            <view class="type-info">
@@ -17,9 +17,10 @@
            </view>
          </view>
          <view
+            v-if="type==0"
+            :class="{ active: form.invoiceType === '1' }"
            class="type-option"
-            :class="{ active: form.invoiceType === '2' }"
+            @click="form.invoiceType = '1'"
-            @click="form.invoiceType = '2'"
          >
            <view class="type-icon enterprise">企</view>
            <view class="type-info">
@@ -29,30 +30,30 @@
          </view>
        </view>
      </view>
      <!-- 发票抬头 -->
      <view class="form-item column">
        <text class="label">发票抬头</text>
        <input
-          class="input"
          v-model="form.name"
+          class="input"
          placeholder="请输入公司全称或个人姓名"
        />
        <text class="hint">请确保发票抬头与公司营业执照或个人身份证上的名称一致。</text>
      </view>
      <!-- 纳税人识别号（企业才显示） -->
-      <view class="form-item column" v-if="form.invoiceType === '2'">
+      <view v-if="form.invoiceType === '1'" class="form-item column">
        <text class="label">纳税人识别号</text>
        <input
-          class="input"
          v-model="form.taxno"
-          placeholder="请输入纳税人识别号"
+          class="input"
          maxlength="20"
+          placeholder="请输入纳税人识别号"
        />
        <text class="hint">企业税务登记证上的号码，一般为 15、18 或 20 位</text>
      </view>
      <!-- 接收方式 -->
      <view class="form-item">
        <text class="label">接收方式</text>
@@ -67,29 +68,29 @@
          </view>
        </view>
      </view>
      <!-- 开票金额 -->
      <!-- <view class="form-item">
        <text class="label">开票金额</text>
        <text class="amount">¥ {{ (Number(form.amount)).toFixed(2) }}</text>
      </view> -->
      <!-- 接收邮箱 -->
      <view class="form-item column">
        <text class="label">接收邮箱号码</text>
        <input
-          class="input"
          v-model="form.phone"
+          class="input"
          placeholder="请输入接收发票的邮箱号码"
          type="text"
        />
        <text class="hint">电子发票将在 3-5 个工作日内发送至该邮箱</text>
      </view>
    </view>
    <!-- 提交按钮 -->
    <view class="btn-wrap">
-      <view class="submit-btn" :class="{ loading: submitting }" @click="handleSubmit">
+      <view :class="{ loading: submitting }" class="submit-btn" @click="handleSubmit">
        {{ submitting ? '提交中...' : '提交申请' }}
      </view>
    </view>
@@ -97,15 +98,15 @@
 </template>
 <script setup>
-import { ref, reactive } from 'vue';
+import {ref, reactive} from 'vue';
-import { onLoad } from '@dcloudio/uni-app';
+import {onLoad} from '@dcloudio/uni-app';
-import { outputInvoiceNo } from '@/common/api.js';
+import {outputInvoiceNo} from '@/common/api.js';
 const submitting = ref(false);
+const type = ref(0) //1个人订单只开普票
 // 表单数据（与PC端字段完全对齐）
 const form = reactive({
-  invoiceType: '1', // 1=个人 2=企业
+  invoiceType: '2', // 1=企业 2=个人
  deliveryMethod: '1', // 接收方式：1=电子发票
  name: '',        // 发票抬头
  taxno: '',       // 纳税人识别号
@@ -123,46 +124,48 @@ onLoad((options) => {
  if (options.invoiceType) {
    form.invoiceType = options.invoiceType;
  }
+  type.value = options.type ?? 0
+  console.log(options)
 });
 // 表单验证
 const validateForm = () => {
  // 发票抬头校验
  if (!form.name) {
-    uni.showToast({ title: '请输入发票抬头', icon: 'none' });
+    uni.showToast({title: '请输入发票抬头', icon: 'none'});
    return false;
  }
  if (form.name.length < 2 || form.name.length > 100) {
-    uni.showToast({ title: '发票抬头长度在2-100个字符之间', icon: 'none' });
+    uni.showToast({title: '发票抬头长度在2-100个字符之间', icon: 'none'});
    return false;
  }
  // 企业必须填纳税人识别号
-  if (form.invoiceType === '2' && !form.taxno) {
+  if (form.invoiceType === '1' && !form.taxno) {
-    uni.showToast({ title: '请输入纳税人识别号', icon: 'none' });
+    uni.showToast({title: '请输入纳税人识别号', icon: 'none'});
    return false;
  }
  // 纳税人识别号格式校验（同PC）
-  if (form.invoiceType === '2') {
+  if (form.invoiceType === '1') {
    const taxReg = /^[A-Z0-9]{15}$|^[A-Z0-9]{18}$|^[A-Z0-9]{20}$/;
    if (!taxReg.test(form.taxno)) {
-      uni.showToast({ title: '纳税人识别号格式不正确', icon: 'none' });
+      uni.showToast({title: '纳税人识别号格式不正确', icon: 'none'});
      return false;
    }
  }
  // 邮箱校验
  if (!form.phone) {
-    uni.showToast({ title: '请输入接收邮箱', icon: 'none' });
+    uni.showToast({title: '请输入接收邮箱', icon: 'none'});
    return false;
  }
  const phoneReg = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
  if (!phoneReg.test(form.phone)) {
-    uni.showToast({ title: '请输入正确的邮箱地址', icon: 'none' });
+    uni.showToast({title: '请输入正确的邮箱地址', icon: 'none'});
    return false;
  }
  return true;
 };
@@ -170,7 +173,7 @@ const validateForm = () => {
 const handleSubmit = async () => {
  if (submitting.value) return;
  if (!validateForm()) return;
  submitting.value = true;
  console.log('提交表单数据:', form);
  try {
@@ -206,19 +209,19 @@ const handleSubmit = async () => {
  padding: 24rpx;
  margin-bottom: 20rpx;
  border-radius: 16rpx;
  &.column {
    display: flex;
    flex-direction: column;
  }
  .label {
    font-size: 28rpx;
    color: #333;
    font-weight: 500;
    margin-bottom: 16rpx;
  }
  .input {
    width: 100%;
    font-size: 28rpx;
@@ -239,18 +242,18 @@ const handleSubmit = async () => {
      line-height: 80rpx;
    }
  }
  .form-item.column .input {
    width: 100%;
    display: block;
  }
  .hint {
    font-size: 24rpx;
    color: #909399;
    margin-top: 8rpx;
  }
  .amount {
    font-size: 32rpx;
    color: #AD181F;
@@ -273,12 +276,12 @@ const handleSubmit = async () => {
  border: 2rpx solid #e4e7ed;
  border-radius: 12rpx;
  background: #fafafa;
  &.active {
    border-color: #AD181F;
    background: #FFF5F5;
  }
  .type-icon {
    width: 60rpx;
    height: 60rpx;
@@ -291,28 +294,28 @@ const handleSubmit = async () => {
    color: #409eff;
    font-weight: 600;
    margin-right: 16rpx;
    &.enterprise {
      background: #f0f6ff;
      color: #1561CB;
    }
  }
  &.active .type-icon {
    background: #AD181F;
    color: #fff;
  }
  .type-info {
    display: flex;
    flex-direction: column;
    .type-name {
      font-size: 28rpx;
      font-weight: 600;
      color: #303133;
    }
    .type-desc {
      font-size: 22rpx;
      color: #909399;
@@ -333,12 +336,12 @@ const handleSubmit = async () => {
  border: 2rpx solid #e4e7ed;
  border-radius: 12rpx;
  background: #fafafa;
  &.active {
    border-color: #AD181F;
    background: #FFF5F5;
  }
  .method-icon {
    width: 60rpx;
    height: 60rpx;
@@ -352,30 +355,30 @@ const handleSubmit = async () => {
    font-weight: 600;
    margin-right: 16rpx;
  }
  &.active .method-icon {
    background: #AD181F;
    color: #fff;
  }
  .method-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    .method-name {
      font-size: 28rpx;
      font-weight: 600;
      color: #303133;
    }
    .method-desc {
      font-size: 22rpx;
      color: #909399;
      margin-top: 4rpx;
    }
  }
  .method-tag {
    font-size: 20rpx;
    color: #67C23A;
@@ -407,7 +410,7 @@ const handleSubmit = async () => {
  font-size: 32rpx;
  text-align: center;
  font-weight: 500;
  &.loading {
    background: #c0c4cc;
  }
--- a/personal/order.vue
View file @11fa390
+++ b/personal/order.vue
View file @11fa390
@@ -269,7 +269,7 @@ const handlePay = async (item) => {
 // 申请开票
 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}&type=1`});
 };
 // 取消订单