Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
1175159b by 杨炀
Options

no message

1 parent 92d4c6c8
Expand all
Inline Side-by-side
Showing 11 changed files with 453 additions and 22 deletions
src/apiPc/booking.js
......@@ -320,3 +320,18 @@ export function getPhotoOrderInfoByLogex(data) {
params:data
})
}
export function getInvoiceDetailBills(invoiceId) {
return request({
url: `/ota/norder/list`,
method: 'get',
params:{
invoiceId:invoiceId
}
})
}
export function getInvoiceDetail(invoiceId) {
return request({
url: `/ota/invoice/${invoiceId}`,
method: 'get'
})
}
......
src/assets/img/kp.svg 0 → 100644
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1719890698869" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4567" xmlns:xlink="http://www.w3.org/1999/xlink" width="60" height="60"><path d="M919.771429 85.942857h-804.571429c-20.114286 0-36.571429 16.457143-36.571429 36.571429v256c0 20.114286 16.457143 36.571429 36.571429 36.571428h73.142857v475.428572c0 10.971429 5.485714 21.942857 14.628572 29.257143 7.314286 5.485714 14.628571 7.314286 21.942857 7.314285 3.657143 0 7.314286 0 10.971428-1.828571l128-38.4 144.457143 40.228571c5.485714 1.828571 12.8 1.828571 20.114286 0l144.457143-40.228571 126.171428 38.4c10.971429 3.657143 23.771429 1.828571 32.914286-5.485714s14.628571-18.285714 14.628571-29.257143v-475.428572h73.142858c20.114286 0 36.571429-16.457143 36.571428-36.571428v-256c0-20.114286-16.457143-36.571429-36.571428-36.571429z m-256 585.142857h-292.571429v-73.142857h292.571429v73.142857z m0-109.714285h-292.571429v-73.142858h292.571429v73.142858z m219.428571-219.428572h-36.571429v-73.142857c0-20.114286-16.457143-36.571429-36.571428-36.571429h-585.142857c-20.114286 0-36.571429 16.457143-36.571429 36.571429v73.142857h-36.571428v-182.857143h731.428571v182.857143z" fill="#ffffff" p-id="4568"></path></svg>
\ No newline at end of file
src/routerPc/en.js
......@@ -462,6 +462,18 @@ export const constantRoutes = [
component: () => import('@/viewsPc/booking/invoicing'),
name: 'invoice',
meta: { title: '我的发票' }
},
{
path: 'invoiceDetail',
component: () => import('@/viewsPc/booking/invoiceDetail'),
name: 'invoiceDetail',
meta: { title: '发票详情' }
},
{
path: 'addInvoice',
component: () => import('@/viewsPc/booking/addInvoice'),
name: 'addInvoice',
meta: { title: '开发票' }
}
]
},
......
src/viewsPc/booking/Invoicing.vue
<template>
<div>
<div class="box">
<div class="box" style="min-height: 50vh">
<div class="indexTitle">
<h3 class="leftboderTT">{{ language == 0 ? '我的发票' : 'My invoice' }}
<el-button @click="goAdd" type="primary" class="btn-lineG fr">
<el-button @click="goAdd" v-if="activeId!=0" type="primary" class="btn-lineG fr">
{{language == 0 ? '开发票' : 'Invoicing' }}
</el-button>
</h3>
......@@ -42,9 +42,10 @@
</div>
</div>
<el-empty :image="`/img/order_no.png`" :image-size="228" v-if="list?.length == 0"/>
</el-card>
<el-empty :image="`/img/order_no.png`" :image-size="228" v-if="list?.length == 0"/>
<div class="mb60"></div>
</div>
</div>
......@@ -54,21 +55,38 @@
<script setup>
import ChoseBills from './component/choseBills'
import {ref} from 'vue'
import {getInvoiceByActiveId} from "@/apiPc/booking"
import {onMounted, ref} from 'vue'
import {getBaseInfoByActiveId, getInvoiceByActiveId} from "@/apiPc/booking"
import {getCurrentInstance} from "@vue/runtime-core"
import {useStorage} from "@vueuse/core/index";
import useUserStore from "@/store/modules/user";
const router = useRouter()
const route = useRoute()
const language = useStorage('language', 0)
const {proxy} = getCurrentInstance()
const list = ref([])
const form = ref({})
const activeId = ref('0')
const user = useUserStore().user
const query = ref({
createById: user.userId
})
getList()
onMounted(()=>{
if(route.query.activeId){
activeId.value = route.query.activeId
query.value.activeId = activeId.value
getBase()
}
getList()
})
function getBase() {
getBaseInfoByActiveId(activeId.value).then(res => {
form.value = res.data || null
}).catch(err => {
form.value = null
})
}
function getList() {
if (!user) {
useUserStore().setReLogin()
......@@ -89,14 +107,46 @@ function goAdd() {
proxy.$refs['dialogChoseBillsRef'].open(obj)
}
function editDetail(item) {
function showDetail(item) {
router.push({
name:'invoiceDetail',
query:{
invoiceId:item.id
}
})
}
function editDetail(item) {
router.push({
name:'addInvoice',
query:{
invoiceId:item.id,
isEdit:true,
activeId: activeId.value,
kpType: form.value.kpType
}
})
}
function getChoosed(list) {
console.log(list)
if (list.length > 0) {
// 去开票
let ids = []
let totalMoney = 0
for(let c of list){
ids.push(c.id);
totalMoney = (totalMoney + c.total)
}
// 去开票 必须有activeId 才能获取开票类型
router.push({
path: '/booking/addInvoice',
query: {
orders: encodeURIComponent(JSON.stringify(list)),
activeId: activeId.value,
kpType: form.value.kpType,
totalMoney:totalMoney
}
})
}
}
......
src/viewsPc/booking/component/choseBills.vue
<template>
<el-dialog v-model="show" :title="title" width="1000px" append-to-body @close="close">
<el-table height="50vh" ref="allBills" :data="tableData" v-loading="loading" @selection-change="handleSelectionChange">
<el-table-column type="selection" :label="language==0?'选择':'Selection'" :selectable="selectable"/>
<el-table-column type="selection" :label="language==0?'选择':'Selection'"/>
<el-table-column prop="id" :label="language==0?'订单号':'No.'"></el-table-column>
<el-table-column prop="id" :label="language==0?'订单类型':'Order Type'">
<template #default="scope">
<span v-if="scope.row.orderType == '0'">{{language==0?'酒店订单':'Hotel Order'}}</span>
<span v-if="scope.row.orderType == '1'">{{language==0?'接送订单':'Car Order'}}</span>
<span v-if="scope.row.orderType == '2'">{{language==0?'餐饮订单':'Food Order'}}</span>
</template>
<el-table-column prop="orderTypeStr" width="100" :label="language==0?'订单类型':'Order Type'">
</el-table-column>
<el-table-column prop="id" :label="language==0?'订单明细':'Detail'">
<el-table-column :label="language==0?'订单明细':'Detail'" min-width="200">
<template #default="scope">
<div v-if="scope.row.orderType == 0">
<p>{{scope.row.messageObj.roomName}}</p>
......@@ -30,6 +25,14 @@
</p>
</div>
</div>
<div v-if="scope.row.orderType == 3 || scope.row.orderType == 4">
<div>
{{language==0?'套餐名称：':''}}{{scope.row.messageObj.packageName}}
</div>
<div>
{{language==0?'预约时间：':''}}{{scope.row.deliveryTime.slice(0,10)}} {{scope.row.messageObj.timePeriod}}
</div>
</div>
</template>
</el-table-column>
<el-table-column prop="total" :label="language==0?'金额':'Amount'"></el-table-column>
......@@ -56,9 +59,11 @@ import {getCurrentInstance} from "@vue/runtime-core";
import {useStorage} from "@vueuse/core/index";
import {getCanInvoiceBills} from "@/apiPc/booking";
import {ElMessage} from "element-plus";
import useUserStore from "@/store/modules/user";
const {proxy} = getCurrentInstance()
const emit = defineEmits([ 'transfer'])
const language= useStorage('language',0)
const user = useUserStore().user || {}
const data = reactive({
tableData: [],
show: false,
......@@ -66,8 +71,8 @@ const data = reactive({
title: '选择开票订单',
query:{
// activeId:'',
// createById:'',
// invoiced:'1',
createById:user.userId,
invoiced:'1',
status:1
},
total:0
......@@ -94,7 +99,7 @@ const getList = () => {
tableData.value = res.rows
total.value = res.total
for (var b of tableData.value) {
for (let b of tableData.value) {
b.messageObj = JSON.parse(b.message)
}
})
......
src/viewsPc/booking/invoiceDetail.vue 0 → 100644
<template>
<div>
<div class="box">
<el-card :body-style="{ padding: '0px' }" class="mt20">
<div slot="header">
<div class="bg-lineg">{{ language == 0 ? '发票开具' : 'Invoice application' }}</div>
</div>
<el-row class="pd20" :gutter="20">
<el-col :span="24">
<!--已选订单-->
<div class="border-info" v-for="b in list" :key="b.id">
<label class="blueTag" v-if="b.orderType == 0"> 酒店订单</label>
<label class="orangeTag" v-if="b.orderType == 1"> 接送订单</label>
<label class="purpleTag" v-if="b.orderType == 2"> 餐饮订单</label>
<label class="pinkTag" v-if="b.orderType == 3">化妆订单</label>
<label class="yellowTag" v-if="b.orderType == 4">拍照订单</label>
<h3>{{ b.name }}</h3>
<!-- 酒店订单-->
<div v-if="b.orderType == 0">
<p>{{b.messageObj.roomInfo}}</p>
<p>{{b.messageObj.roomStayDate}}</p>
<p class="poPrice">¥{{b.total}}</p>
</div>
<!-- 接送订单-->
<div v-if="b.orderType == 1">
<p v-for="(car,index) in b.messageObj.carsList" :key="index" v-show="car.num>0">
<span>{{car.name}}：{{car.num}} 辆</span>
</p>
<p class="poPrice">¥{{b.total}}</p>
</div>
<!-- 餐饮订单-->
<div v-if="b.orderType == 2">
<p v-for="(n,index) in b.messageObj.foodsList" :key="index">
<span v-if="n.num > 0">
{{n.name}}({{n.categoryName}}) <span>{{n.num}} 份</span>
</span>
</p>
<p class="poPrice">¥{{b.total}}</p>
</div>
<div v-if="b.orderType == 3 || b.orderType == 4">
<div>
{{language==0?'套餐名称：':''}}{{b.messageObj.packageName}}
</div>
<div>
{{language==0?'预约时间：':''}}{{b.deliveryTime.slice(0,10)}} {{b.messageObj.timePeriod}}
</div>
<p class="poPrice">¥{{b.total}}</p>
</div>
</div>
<div class="leftboderTT">{{ language == 0 ? '开票信息' : 'Invoice information' }}</div>
<div class="border-rr mt20 pd20">
<el-form class="mw500" :model="form" :label-width="language == 0 ?'100':'150'" :rules="rules" ref="formRef">
<el-form-item :label="'开票金额'">
<span class="bigprice">¥{{totalMoney}}</span>
</el-form-item>
<el-form-item :label="`发票形式`" required prop="invoiceForm">
<span v-if="form.invoiceForm=='1'">电子发票</span>
<span v-if="form.invoiceForm=='2'">纸质普票</span>
<span v-if="form.invoiceForm=='3'">纸质专票</span>
</el-form-item>
<el-form-item :label="`邮箱`" v-if="form.invoiceForm=='1'" required prop="address">
{{form.address}}
</el-form-item>
<el-form-item :label="`邮寄地址`" v-else required>
<div class="flexCenter">
<div>
<div class="bigSize">{{nowAddress.contact}} {{nowAddress.phone}}</div>
<div class="smallSize">{{nowAddress.addName}}</div>
</div>
</div>
</el-form-item>
<el-form-item :label="`发票类型`" required prop="invoiceType">
<span v-show="form.invoiceType=='0'"> 企业</span>
<span v-show="form.invoiceType=='1'"> 个人非企业</span>
</el-form-item>
<el-form-item :label="`发票抬头`" required prop="invoiceTitle">
{{form.invoiceTitle}}
</el-form-item>
<el-form-item :label="`税号`" required v-if="form.invoiceType=='0'" prop="invoiceTfn">
{{form.invoiceTfn}}
</el-form-item>
<div v-if="form.invoiceForm=='3'&&form.invoiceType=='0'">
<el-form-item :label="`地址`" required prop="invoiceAddress">
{{form.invoiceAddress}}
</el-form-item>
<el-form-item :label="`电话`" required prop="invoicePhone">
{{form.invoicePhone}}
</el-form-item>
<el-form-item :label="`开户行`" required prop="invoiceBank">
{{form.invoiceBank}}
</el-form-item>
<el-form-item :label="`账户`" required prop="invoiceAccount">
{{form.invoiceAccount}}
</el-form-item>
</div>
</el-form>
</div>
</el-col>
</el-row>
<div class="text-center mb20">
<el-button type="primary" @click="backList" round plain>返回</el-button>
</div>
</el-card>
<div style="height: 60px;"></div>
</div>
</div>
<address-list-dialog ref="dialogAddressListRef" @submit="getAddress"/>
</template>
<script setup>
import {useRouter, useRoute} from "vue-router";
import {ref, reactive, onMounted} from "vue";
import {useStorage} from "@vueuse/core/index";
import AddressListDialog from "./component/addressList"
import dayjs from 'dayjs'
import {ElMessage,ElMessageBox} from "element-plus";
import useUserStore from "@/store/modules/user";
import {getCurrentInstance} from "@vue/runtime-core";
import {addressList, editInvoice, submitInvoice,getInvoiceDetailBills,getInvoiceDetail} from "@/apiPc/booking";
const {proxy} = getCurrentInstance()
const user = useUserStore().user
const language = useStorage('language', 0)
const router = useRouter()
const route = useRoute()
const list = ref([])
const addrList = ref([])
const nowAddress = ref({})
const totalMoney = ref(0)
const form = ref({})
const rules = ref({
invoiceType: [
{required: true, message: language.value==0?'请选择发票类型':'Please select invoice type', trigger: 'change'}
],
address: [
{required: true, message: language.value==0?'请输入邮箱':'Please enter email', trigger: 'blur'}
],
invoiceForm: [
{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'}
],
invoiceTfn: [
{required: true, message: language.value==0?'请输入税号':'Please enter TFN', trigger: 'blur'}
],
invoiceAddress: [
{required: true, message: language.value==0?'请输入地址':'Please enter address', trigger: 'blur'}
],
invoicePhone: [
{required: true, message: language.value==0?'请输入电话':'Please enter phone', trigger: 'blur'}
],
invoiceBank: [
{required: true, message: language.value==0?'请输入开户行':'Please enter bank', trigger: 'blur'}
],
invoiceAccount: [
{required: true, message: language.value==0?'请输入账户':'Please enter account', trigger: 'blur'}
],
})
const isEdit = ref(false)
let invoiceId
onMounted(() => {
if(route.query.activeId){
form.value.activeId = route.query.activeId
}
invoiceId = route.query.invoiceId
getList()
})
function getList() {
getInvoiceDetailBills(invoiceId).then(res => {
// 订单
list.value = res.rows;
for (var bill of list.value) {
bill.messageObj = JSON.parse(bill.message)
}
});
getInvoiceDetail(invoiceId).then(res => {
form.value = res.data;
totalMoney.value = form.value.total
if (form.value.invoiceForm == '1') {
email.value = form.value.address
}
getAddrList()
});
}
function getAddrList() {
addressList(user.userId).then(res=>{
addrList.value = res.rows
if(addrList.value.length>0){
nowAddress.value = addrList.value[0]
}
})
}
function backList() {
router.push({
name: 'invoice'
})
}
</script>
<style scoped lang="scss">
.bigMoney {
font-size: 36px !important;
font-family: 'DIN Alternate';
font-weight: bold;
}
.btn-lineG{font-size: 16px}
.bg-lineg {
height: 40px;
line-height: 40px;
font-size: 18px;
text-align: center;
}
.border-info{position: relative;
&>label{position: absolute;right: 0;top: 0;margin: 0;border-radius: 0 0 0px 15px;
padding: 5px 15px;font-size: 14px;
}
.poPrice{position: absolute;bottom: 0px;right: 10px;font-size: 24px;
line-height: 1;font-family: "DIN Alternate"}
}
.blueTag {
color: #fff;
background-color: #1EC886;
}
.purpleTag {
color: #fff;
background-color: #717bef;
}
.orangeTag {
color: #fff;
background-color: #ff8124;
}
.pinkTag {
color: #fff;
background-color: #f55497;
}
.yellowTag {
color: #fff;
background-color: #bad814;
}
.leftboderTT {
font-weight: 600;
font-size: 16px;
color: #453DEA;
}
.border-rr {
border-radius: 5px;
border: 1px solid #DCDFE6;
}
.room {
font-weight: 400;
font-size: 14px;
color: #929AA0;
}
.ccitemBox {
overflow: auto;
label {
margin: 10px 0;
display: block;
min-height: 30px;
span {
color: #FF8124;
font-family: DIN Alternate;
font-size: 24px;
}
}
}
.ccitem {
display: flex;
justify-content: space-between;
font-size: 15px;
color: #666;
margin: 5px 0 10px;
label {
font-size: 16px;
color: #000;
}
span {
font-size: 13px;
}
}
.red {
color: #FF8124;
}
.tip{font-size: 14px;color: #666;padding: 0 10px;}
.mw500{max-width: 500px;margin: auto}
.bigSize {
font-size: 16px;
margin-bottom: 5px;
}
.smallSize {
font-size: 14px;
color: #999;
}
.flexCenter {
display: flex;
width: 100%;
align-items: center;
justify-content: space-between;
background: #f4f4f4;
padding: 10px;
box-sizing: border-box;
}
.bigprice {
font-size: 26px;
line-height: 1;font-family: "DIN Alternate";
}
</style>
src/viewsPc/center/myReservation.vue
......@@ -6,6 +6,7 @@
</h3>
<!-- <el-button class="fr" type="primary" plain @click="toInvoice">{{ language==0?'发票开具':'Invoice' }}</el-button>-->
<el-button class="fr" type="primary" plain @click="toInvoice">{{ language==0?'我的发票':'My Invoice' }}</el-button>
</div>
<el-empty :image="`/img/order_no.png`" :image-size="228" v-if="list?.length == 0"/>
......
src/viewsPc/match/components/quick-row.vue
......@@ -78,6 +78,11 @@
</el-row>
</div>
<order-remark ref="orderRemarkRef" @submit="goBooking"/>
<div class="fixedKP" @click="addInvoice">
<img src="@/assets/img/kp.svg"/>
开票
</div>
</template>
<script setup>
......@@ -181,10 +186,26 @@ function goBooking(n) {
break;
}
}
function addInvoice(){
router.push({
name: 'invoice',
query: {
activeId: props.matchId
}
})
}
</script>
<style scoped lang="scss">
h4 {
padding: 0 10px;
}
.fixedKP{position: fixed;background: linear-gradient(-90deg, #8623FC, #453DEA);left: 0;
top:450px;cursor: pointer;
color: #fff;border-radius: 50%;width: 60px;height: 60px;text-align: center;
img{width: 26px;height: 26px;display: block;margin:10px auto 0px;}
font-size: 13px;
box-shadow: 0 0 10px rgba(0,0,0,0.6);
}
</style>
......
vite.config.js
......@@ -84,8 +84,8 @@ export default defineConfig(({ mode, command }) => {
'/dev-api': {
// target: 'http://192.168.1.118:8081/',
// target: 'http://192.168.1.131:8081/',
// target: 'https://jijin.wtwuxicenter.com/stage-api',
target: 'https://wdsfwuxicenter.com/stage-api/',
target: 'https://jijin.wtwuxicenter.com/stage-api',
// target: 'https://wdsfwuxicenter.com/stage-api/',
changeOrigin: true,
rewrite: (p) => p.replace(/^\/dev-api/, '')
},
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!