fix: 增加开具发票成功页；修复提交发票表单备注和跟进人不随历史记录回填改变的bug

src/modules/payment/components/InvoiceForm.vue

@@ -95,6 +95,12 @@ export default {
       default() {
         return {}
       }
+    },
+    initData: {
+      type: Object,
+      default() {
+        return {}
+      }
     }
   },
   data() {
@@ -119,7 +125,7 @@ export default {
       }
     }
     return {
-      form: Object.assign({ taxpayer_type: '2' }, defaultForm),
+      form: {},
       rules: {
         // type: { required: true, message: '请选择开票类型', trigger: 'change' },
         taxpayer_type: { required: true, message: '请选择开票人类型', trigger: 'change' },
@@ -141,15 +147,21 @@ export default {
     history: {
       handler(nv) {
         if (nv) {
-          console.log(nv)
           Object.keys(this.form).forEach(key => {
-            this.form[key] = this.history[key]
+            if (key !== 'invoice_remark' && key !== 'sales_rep_user_id_name') {
+              this.form[key] = this.history[key]
+            }
           })
         }
       },
       immediate: true
     }
   },
+  created() {
+    defaultForm.invoice_remark = this.initData.invoice_remark || ''
+    defaultForm.sales_rep_user_id_name = this.initData.sales_rep_user_id_name || ''
+    this.form = Object.assign({ taxpayer_type: 2 }, defaultForm)
+  },
   methods: {
     checkInvoice(rule, value, callback) {
       if (value) {
@@ -170,7 +182,6 @@ export default {
     },
     handleSubmit() {
       this.$refs.ruleForm.validate((valid) => {
-        console.log(valid)
         if (valid) {
           this.$emit('submit', this.form)
         }

src/modules/payment/index.js

@@ -18,13 +18,17 @@ const routes = [
     path: '/h5/payment',
     component: () => import('./views/h5/List.vue')
   },
+  {
+    path: '/h5/payment/details',
+    component: () => import('./views/h5/details.vue')
+  },
   {
     path: '/h5/payment/invoice',
     component: () => import('./views/h5/Invoice.vue')
   },
   {
-    path: '/h5/payment/details',
-    component: () => import('./views/h5/details.vue')
+    path: '/h5/payment/invoice-success',
+    component: () => import('./views/h5/Success.vue')
   }
 ]
 

src/modules/payment/views/h5/Invoice.vue

@@ -73,7 +73,7 @@ export default {
   data() {
     return {
       invoice_type_label: '',
-      form: Object.assign({ taxpayer_type: 2 }, defaultForm),
+      form: {},
       showPicker: false,
       showPopup: false
     }
@@ -98,8 +98,9 @@ export default {
     }
   },
   created() {
-    this.form.invoice_remark = this.query.remark || ''
-    this.form.sales_rep_user_id_name = this.query.name || ''
+    defaultForm.invoice_remark = this.query.remark || ''
+    defaultForm.sales_rep_user_id_name = this.query.name || ''
+    this.form = Object.assign({ taxpayer_type: 2 }, defaultForm)
   },
   methods: {
     phoneValidator(val) {
@@ -139,7 +140,9 @@ export default {
     },
     handleSelect(val) {
       Object.keys(this.form).forEach(key => {
-        this.form[key] = val[key]
+        if (key !== 'invoice_remark' && key !== 'sales_rep_user_id_name') {
+          this.form[key] = val[key]
+        } 
       })
       if (this.form.invoice_type) {
         this.setInvoiceType(this.form.invoice_type)
@@ -150,10 +153,11 @@ export default {
       const params = Object.assign({}, this.form)
       params.payment_id = this.id
       createInvoice(params).then(res => {
-        Toast.success('开具发票成功')
+        // Toast.success('提交成功')
+        const type = this.form.invoice_type === '2' ? '1' : '2'
+        this.$router.push({ path: '/h5/payment/invoice-success', query: { type } })
       }).catch(err => {
-        console.log(err)
-        Toast.fail((err.data && err.data.message) || '开具发票失败')
+        Toast.fail((err.data && err.data.message) || '提交失败')
       })
     }
   }

src/modules/payment/views/h5/List.vue

@@ -56,7 +56,7 @@ export default {
   },
   methods: {
     handleInvoice(val) {
-      this.$router.push({ path: '/h5/payment/invoice', query: { id: val.id, name: val.sales_rep_user_id_name, remark: val.invoice_remark } })
+      this.$router.push({ path: '/h5/payment/invoice', query: { id: val.id, name: val.sales_rep_user_id_name, remark: val.invoice_remark || val.payer_name } })
     },
     handleDetials(val) {
       window.localStorage.setItem('invoiceDetails', JSON.stringify(val))

src/modules/payment/views/h5/Success.vue

+<template>
+  <div class="invoice-success">
+    <h5><i class="el-icon-circle-check" style="margin-right:10px;font-size:18px;"></i>提交成功</h5>
+    <p v-if="type === '1'">开票申请提交成功，请您随时关注邮箱进行收取！</p>
+    <p v-else>开票申请提交成功，请您联系跟进人员获取纸质发票</p>
+  </div>
+</template>
+<script>
+export default {
+  computed: {
+    type() {
+      const query = this.$route.query
+      return query.type || '1'
+    }
+  }
+}
+</script>
+<style scoped>
+.invoice-success{
+  height:200px;
+  background:#16a8f8;
+  padding-top:50px;
+}
+h5, p{
+  font-size:14px;
+  line-height:50px;
+  text-align:center;
+  font-weight:normal;
+  color:#fff;
+}
+h5{
+  font-size:16px;
+}
+h5 i{
+  margin-right:10px;
+  font-size:18px;
+  font-weight:bold;
+}
+</style>

src/modules/payment/views/pc/List.vue

@@ -11,7 +11,7 @@
       </template>
     </app-list>
     <el-drawer title="开具发票" :visible.sync="drawerVisible" :close-on-click-modal="false" :destroy-on-close="true" size="600px" top="15px" @close="handleClose">
-      <invoice-form :history="history" @history="handleHistory" @dialogClose="drawerVisible = false" @submit="fetchCreateInvoice"/>
+      <invoice-form :history="history" :initData="initData" @history="handleHistory" @dialogClose="drawerVisible = false" @submit="fetchCreateInvoice"/>
       <el-dialog title="选择历史开票信息" :visible.sync="dialogVisible" width="460px" top="15px" append-to-body :destroy-on-close="true" center>
         <history-invoice-list v-if="dialogVisible" :hasSearch="true" @select="handleSelect"/>
       </el-dialog>
@@ -42,6 +42,7 @@ export default {
       drawerVisible: false,
       dialogVisible: false,
       payment_id: '',
+      initData: {},
       history: {},
       shareDialogVisible: false,
       shareUrl: ''
@@ -81,8 +82,8 @@ export default {
       this.drawerVisible = true
       this.payment_id = row.id
       this.history = {}
-      if (row.invoice_remark) this.history.invoice_remark = row.invoice_remark
-      if (row.sales_rep_user_id_name) this.history.sales_rep_user_id_name = row.sales_rep_user_id_name
+      this.initData.invoice_remark = row.invoice_remark || row.payer_name
+      this.initData.sales_rep_user_id_name = row.sales_rep_user_id_name
     },
     handleInvoiceQR(row) {
       this.shareUrl = `${import.meta.env.VITE_SHARE_URL}/h5/payment/invoice?id=${row.id}`