票务修改

zhangmeng
Showing 3 changed files with 104 additions and 86 deletions
src/viewsPc/booking/ticket/addInvoice.vue
src/viewsPc/booking/ticket/confirmOrder.vue
src/viewsPc/booking/ticket/index.vue
--- a/src/viewsPc/booking/ticket/addInvoice.vue
View file @6191820
+++ b/src/viewsPc/booking/ticket/addInvoice.vue
View file @6191820
 <template>
  <div>
    <div class="box">
      <el-card :body-style="{ padding: '0px' }" class="mt20">
        <div slot="header">
          <div class="bg-lineg">
            <div class="pl-back" @click="goBack">
              <el-icon>
-                <ArrowLeftBold/>
+                <ArrowLeftBold />
              </el-icon>
              返回
            </div>
@@ -25,20 +24,20 @@
                <p>票档：{{ ticketForm.extJson?.ticketType?.name }}</p>
                <p>时间：{{ ticketForm.extJson?.ticketDate.name }}</p>
                <p>通票：{{
-                    paymentType != 3 ? '¥' : '€'
+                  paymentType != 3 ? '¥' : '€'
-                  }}
+                }}
                  {{
                    paymentType != 3 ? ticketForm.extJson?.ticketDate.price : ticketForm.extJson?.ticketDate.priceEn
                  }}
                  /1张</p>
                <p>优惠票：{{
-                    paymentType != 3 ? '¥' : '€'
+                  paymentType != 3 ? '¥' : '€'
-                  }}
+                }}
                  {{
                    paymentType != 3 ? ticketForm.extJson?.ticketDate.rebatePrice : ticketForm.extJson?.ticketDate.rebatePriceEn
                  }}
                  /1张</p>
                <p class="poPrice">{{ paymentType != 3 ? '¥' : '€' }}{{ totalMoney }}</p>
              </div>
              <div>
@@ -73,69 +72,75 @@
                </el-row>
              </div>
            </div>
            <div class="leftboderTT">
              {{ paymentType != 3 ? '开票信息' : 'Invoice information' }}
            </div>
            <div class="border-rr mt20 pd20">
-              <el-form ref="formRef" :label-width="paymentType != 3 ?'100':'150'" :model="form" :rules="rules"
+              <el-form
-                       class="mw500">
+                ref="formRef" :label-width="paymentType != 3 ?'100':'150'" :model="form" :rules="rules"
+                class="mw500"
+              >
                <el-form-item :label="language==0 ?'开票金额':'Amount'">
                  <span class="bigprice">{{ paymentType != 3 ? '¥' : '€' }}{{ totalMoney }}</span>
                </el-form-item>
                <el-form-item :label="language==0 ?`发票形式`:'Invoice Form'" prop="invoiceForm" required>
                  <el-radio-group v-model="form.invoiceForm">
                    <el-radio value="1">{{ language == 0 ? '电子发票' : 'E-invoice' }}</el-radio>
                  </el-radio-group>
                </el-form-item>
                <el-form-item :label="language==0 ?`发票类型`:'Invoice Type'" prop="invoiceType" required>
                  <el-radio-group v-model="form.invoiceType">
                    <el-radio value="0">{{ language == 0 ? '企业' : 'Company' }}</el-radio>
                    <el-radio value="1">{{ language == 0 ? '个人非企业' : 'Individual' }}</el-radio>
                  </el-radio-group>
                </el-form-item>
-                <el-form-item v-if="form.invoiceType=='0'" :label="language==0 ?`发票抬头`:'Invoice Title'"
+                <el-form-item
-                              prop="invoiceTitle"
+                  v-if="form.invoiceType=='0'" :label="language==0 ?`发票抬头`:'Invoice Title'"
-                              required>
+                  prop="invoiceTitle"
-                  <el-input v-model="form.invoiceTitle"/>
+                  required
+                >
+                  <el-input v-model="form.invoiceTitle" />
                </el-form-item>
-                <el-form-item v-if="form.invoiceType=='0'" :label="language==0 ?`税号`:'Duty Paragraph'"
+                <el-form-item
-                              prop="invoiceTfn"
+                  v-if="form.invoiceType=='0'" :label="language==0 ?`税号`:'Duty Paragraph'"
-                              required>
+                  prop="invoiceTfn"
-                  <el-input v-model="form.invoiceTfn"/>
+                  required
+                >
+                  <el-input v-model="form.invoiceTfn" />
                </el-form-item>
                <el-form-item v-if="form.invoiceForm=='1'" :label="`邮箱`" prop="invoiceEmail" required>
-                  <el-input v-model="form.invoiceEmail"/>
+                  <el-input v-model="form.invoiceEmail" />
                </el-form-item>
                <el-form-item label="备注" prop="remarks">
-                  <el-input v-model="form.remarks" type="textarea"/>
+                  <el-input v-model="form.remarks" type="textarea" />
                </el-form-item>
                <div v-if="form.invoiceForm=='3'&&form.invoiceType=='0'">
                  <el-form-item :label="`地址`" prop="invoiceAddress" required>
-                    <el-input v-model="form.invoiceAddress"/>
+                    <el-input v-model="form.invoiceAddress" />
                  </el-form-item>
                  <el-form-item :label="`电话`" prop="invoicePhone" required>
-                    <el-input v-model="form.invoicePhone"/>
+                    <el-input v-model="form.invoicePhone" />
                  </el-form-item>
                  <el-form-item :label="`开户行`" prop="invoiceBank" required>
-                    <el-input v-model="form.invoiceBank"/>
+                    <el-input v-model="form.invoiceBank" />
                  </el-form-item>
                  <el-form-item :label="`账户`" prop="invoiceAccount" required>
-                    <el-input v-model="form.invoiceAccount"/>
+                    <el-input v-model="form.invoiceAccount" />
                  </el-form-item>
                </div>
              </el-form>
              <div v-if="remark" class="tip">
                <label>{{ paymentType != 3 ? '开票须知' : 'Invoice Notice' }}:</label>
-                <div v-html="remark"/>
+                <div v-html="remark" />
              </div>
            </div>
          </el-col>
        </el-row>
        <el-row align="middle" class="pd20" justify="center">
          <el-col :span="12" class="text-center">
            <el-button class="btn-lineG w200px" round size="large" type="primary" @click="submit">
@@ -144,33 +149,33 @@
          </el-col>
        </el-row>
      </el-card>
-      <div style="height: 60px;"></div>
+      <div style="height: 60px;" />
    </div>
  </div>
-  <address-list-dialog ref="dialogAddressListRef" @submit="getAddress"/>
+  <address-list-dialog ref="dialogAddressListRef" @submit="getAddress" />
  <!-- 开票须知 -->
 </template>
 <script setup>
-import {useRouter, useRoute} from "vue-router";
+import { useRouter, useRoute } from 'vue-router'
-import {ref, onMounted} from "vue";
+import { ref, onMounted } from 'vue'
-import {useStorage} from "@vueuse/core/index";
+import { useStorage } from '@vueuse/core/index'
-import AddressListDialog from "@/viewsPc/booking/component/addressList"
+import AddressListDialog from '@/viewsPc/booking/component/addressList'
 import dayjs from 'dayjs'
-import {ElMessage, ElMessageBox} from "element-plus";
+import { ElMessage, ElMessageBox } from 'element-plus'
-import useUserStore from "@/store/modules/user";
+import useUserStore from '@/store/modules/user'
-import {getCurrentInstance} from "@vue/runtime-core";
+import { getCurrentInstance } from '@vue/runtime-core'
 import {
  addressList,
  editInvoice,
  getInvoiceDetail,
  getBaseInfoByActiveId,
  getTicketOrderInfo,
-  getTicketInfoByActivityId, submitInvoice,
+  getTicketInfoByActivityId, submitInvoice
-} from "@/apiPc/booking";
+} from '@/apiPc/booking'
-const {proxy} = getCurrentInstance()
+const { proxy } = getCurrentInstance()
 const user = useUserStore().user
 const language = useStorage('language', 0)
 const router = useRouter()
@@ -188,32 +193,32 @@ const totalMoney = ref(0)
 const remark = ref('')
 const rules = ref({
  invoiceType: [
-    {required: true, message: language.value == 0 ? '请选择发票类型' : 'Please select invoice type', trigger: 'change'}
+    { required: true, message: language.value == 0 ? '请选择发票类型' : 'Please select invoice type', trigger: 'change' }
  ],
  invoiceEmail: [
-    {required: true, message: language.value == 0 ? '请输入邮箱' : 'Please enter email', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入邮箱' : 'Please enter email', trigger: 'blur' }
  ],
  invoiceForm: [
-    {required: true, message: language.value == 0 ? '请选择发票形式' : 'Please select invoice form', trigger: 'change'}
+    { required: true, message: language.value == 0 ? '请选择发票形式' : 'Please select invoice form', trigger: 'change' }
  ],
  invoiceTitle: [
-    {required: true, message: language.value == 0 ? '请输入发票抬头' : 'Please enter invoice title', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入发票抬头' : 'Please enter invoice title', trigger: 'blur' }
  ],
  invoiceTfn: [
-    {required: true, message: language.value == 0 ? '请输入税号' : 'Please enter TFN', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入税号' : 'Please enter TFN', trigger: 'blur' }
  ],
  invoiceAddress: [
-    {required: true, message: language.value == 0 ? '请输入地址' : 'Please enter address', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入地址' : 'Please enter address', trigger: 'blur' }
  ],
  invoicePhone: [
-    {required: true, message: language.value == 0 ? '请输入电话' : 'Please enter phone', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入电话' : 'Please enter phone', trigger: 'blur' }
  ],
  invoiceBank: [
-    {required: true, message: language.value == 0 ? '请输入开户行' : 'Please enter bank', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入开户行' : 'Please enter bank', trigger: 'blur' }
  ],
  invoiceAccount: [
-    {required: true, message: language.value == 0 ? '请输入账户' : 'Please enter account', trigger: 'blur'}
+    { required: true, message: language.value == 0 ? '请输入账户' : 'Please enter account', trigger: 'blur' }
-  ],
+  ]
 })
 const isEdit = ref(false)
 const ticketForm = ref({})
@@ -233,20 +238,20 @@ onMounted(() => {
    isEdit.value = true
    getList()
  }
-// 获取票务订单信息
+  // 获取票务订单信息
  getTickInfo()
 })
 // 票务订单详情
 async function getTickInfo() {
-  const res = await getTicketOrderInfo({orderId: route.query.orderId})
+  const res = await getTicketOrderInfo({ orderId: route.query.orderId })
  ticketForm.value = res.data
  try {
    ticketForm.value.extJson = JSON.parse(ticketForm.value.extJson)
    ticketForm.value.extJson.ticketDate = JSON.parse(ticketForm.value.extJson.ticketDate)
    ticketForm.value.extJson.ticketType = JSON.parse(ticketForm.value.extJson.ticketType)
    cptId = ticketForm.value.extJson.ticketDate.activityId
-    totalMoney.val = ticketForm.value.extJson.total
+    totalMoney.value.val = ticketForm.value.extJson.total
    message.value = JSON.parse(ticketForm.value.extJson.message)
    console.log(message.value)
    paymentType.value = ticketForm.value.paymentType
@@ -256,19 +261,19 @@ async function getTickInfo() {
  } catch (e) {
    console.log(e)
  } finally {
  }
 }
 async function getDetail(activeId) {
-  const res = await getTicketInfoByActivityId({activityId: activeId})
+  const res = await getTicketInfoByActivityId({ activityId: activeId })
  matchForm.value = res.data
  console.log(matchForm.value)
 }
 function getList() {
  getInvoiceDetail(invoiceId.value).then(res => {
-    form.value = res.data;
+    form.value = res.data
    totalMoney.value = form.value.total
  })
 }
@@ -313,14 +318,14 @@ function submit() {
 function update() {
  editInvoice(form.value).then(res => {
-    //返回列表
+    // 返回列表
    backList()
  })
 }
 function add() {
  submitInvoice(form.value).then(res => {
-    //返回列表
+    // 返回列表
    backList()
  })
 }
@@ -365,7 +370,7 @@ function goBack() {
 .border-info {
  position: relative;
  & > label {
    position: absolute;
    right: 0;
@@ -375,7 +380,7 @@ function goBack() {
    padding: 5px 15px;
    font-size: 14px;
  }
  .poPrice {
    position: absolute;
    bottom: 0px;
@@ -430,12 +435,12 @@ function goBack() {
 .ccitemBox {
  overflow: auto;
  label {
    margin: 10px 0;
    display: block;
    min-height: 30px;
    span {
      color: #FF8124;
      font-family: DIN Alternate;
@@ -450,12 +455,12 @@ function goBack() {
  font-size: 15px;
  color: #666;
  margin: 5px 0 10px;
  label {
    font-size: 16px;
    color: #000;
  }
  span {
    font-size: 13px;
  }
--- a/src/viewsPc/booking/ticket/confirmOrder.vue
View file @6191820
+++ b/src/viewsPc/booking/ticket/confirmOrder.vue
View file @6191820
@@ -13,20 +13,6 @@
              <div class="address">{{ TickForm.address }}</div>
            </div>
-            <div class="info">
-              <div class="name">{{ TickForm2.ticketTypeName }}</div>
-              <div class="address">
-                {{ TickForm2.stadiumName }} ｜
-                <span v-if="TickForm2.sessionType=='1000'">{{ language == 0 ? '日间场' : 'Day' }}</span>
-                <span v-else>{{ language == 0 ? '夜间场' : 'Night' }}</span>
-                ｜ {{ TickForm2.ticketName }}
-              </div>
-              <div v-if="TickForm2.ticketType=='0'" class="address">{{
-                language == 0 ? '剩余数量' : 'Remaining Quantity'
-              }}： {{ leftCount }}
-              </div>
-            </div>
            <div class="ticket_info mb20">
              <div class="tit_box">
@@ -153,9 +139,25 @@
                </div>
              </div>
            </div>
-            <!--            场馆布局图-->
+            <div class="rightBox">
+              <div class="info">
+                <div class="name">{{ TickForm2.ticketTypeName }}</div>
+                <div class="address">
+                  {{ TickForm2.stadiumName }} ｜
+                  <span v-if="TickForm2.sessionType=='1000'">{{ language == 0 ? '日间场' : 'Day' }}</span>
+                  <span v-else>{{ language == 0 ? '夜间场' : 'Night' }}</span>
+                  ｜ {{ TickForm2.ticketName }}
+                </div>
+                <div v-if="TickForm2.ticketType=='0'" class="address">{{
+                  language == 0 ? '剩余数量' : 'Remaining Quantity'
+                }}： {{ leftCount }}
+                </div>
+              </div>
+            </div>
-            <div style="margin-top: 95px">
+            <!--            场馆布局图-->
+            <div style="margin-top: 30px">
              <el-image
                :preview-src-list="[fillImgUrl(tickImg)]"
                :src="fillImgUrl(tickImg)"
@@ -709,4 +711,15 @@ div {
    width: 100%;
  }
 }
+.rightBox {
+  .info {
+    background: rgba(69, 61, 234, 0.04);
+    border-radius: 8px;
+    border: 1px solid #d3d1f6;
+    padding: 20px 0 28px 33px;
+    margin-bottom: 20px;
+    margin-top: 30px;
+  }
+}
 </style>
--- a/src/viewsPc/booking/ticket/index.vue
View file @6191820
+++ b/src/viewsPc/booking/ticket/index.vue
View file @6191820
@@ -183,7 +183,7 @@
                  class="son"
                  fit="cover"
                  preview-teleported
-                  style="width:200px"
+                  style="width:190px;height: 135px"
                />
              </div>
            </div>
@@ -409,8 +409,8 @@ function selectTick(v) {
  selectForm.value.price = v.price
  selectForm.value.priceEn = v.priceEn
  // console.log(v)
+  showUrl.value = v.images
-  handleImage()
+  show.value = true
 }
 function toSelectSeat() {
@@ -789,7 +789,7 @@ getmatchData()
 .son {
  position: absolute;
  top: 0;
-  left: 30px;
+  left: 50px;
 }
 .remarks {