Skip to content

jijin / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
fd3f4520 by zhangmeng
Options

H5适配

1 parent 514607a8
Expand all
Inline Side-by-side
Showing 5 changed files with 173 additions and 97 deletions
src/viewsPc/booking/pay.vue
......@@ -469,11 +469,11 @@
<div v-if="payType == '2'&&wePayCodeUrl">
<div class="payImgbox flexCenter">
<div>
<img :src="wePayCodeUrl" class="border" width="260">
<img class="mt20" src="@/assets/img/sm.png">
<img :src="wePayCodeUrl" class="border payImg1" width="260">
<img class="mt20 payImg2" src="@/assets/img/sm.png">
</div>
<div class="ml20">
<img height="360" src="@/assets/img/rr.jpg">
<img class="payImg3" height="360" src="@/assets/img/rr.jpg">
</div>
</div>
<div v-if="language==0" class="tip text-center text-danger">
......@@ -1161,4 +1161,24 @@ const showSJ = () => {
.price {
color: orange;
}
@media screen and (max-width: 768px) {
.payImgbox {
width: 100%;
.payImg1 {
width: 40vw;
}
.payImg2 {
width: 40vw;
}
.payImg3 {
width: 40vw;
height: auto;
}
}
}
</style>
......
src/viewsPc/booking/ticket/addInvoice.vue
......@@ -22,7 +22,7 @@
<div>
<p>票档：{{ ticketForm.extJson?.atName }}</p>
<p>场馆：{{ ticketForm.extJson?.atsName }}</p>
<p>场次：{{ ticketForm.extJson?.sessionType =='1000'? '日间场' : '夜间场' }}</p>
<p>场次：{{ ticketForm.extJson?.sessionType == '1000' ? '日间场' : '夜间场' }}</p>
<p>票型：{{ ticketForm.extJson?.atstName }}</p>
</div>
<div>
......@@ -34,14 +34,14 @@
<el-col :lg="8" :md="12" :sm="12" :xs="24">联系方式：{{ ticketForm.phone }}
</el-col>
<el-col :lg="8" :md="12" :sm="12" :xs="24">
共计:{{ (totalMoney*1).toFixed(2) }}{{
共计:{{ (totalMoney * 1).toFixed(2) }}{{
paymentType == 1 ? '￥' : '€'
}}
</el-col>
</el-row>
</div>
</div>
<div class="leftboderTT">
{{ paymentType != 3 ? '开票信息' : 'Invoice information' }}
</div>
......@@ -51,15 +51,17 @@
class="mw500"
>
<el-form-item :label="language==0 ?'开票金额':'Amount'">
<span class="bigprice">{{ paymentType != 3 ? '¥' : '€' }}{{ paymentType != 3?ticketForm.total:ticketForm.totalEn }}</span>
<span class="bigprice">{{
paymentType != 3 ? '¥' : '€'
}}{{ paymentType != 3 ? ticketForm.total : ticketForm.totalEn }}</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>
......@@ -101,7 +103,7 @@
</el-form-item>
</div>
</el-form>
<div v-if="remark" class="tip">
<label>{{ paymentType != 3 ? '开票须知' : 'Invoice Notice' }}:</label>
<div v-html="remark" />
......@@ -109,7 +111,7 @@
</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">
......@@ -119,7 +121,7 @@
</el-row>
</el-card>
<div style="height: 60px;" />
</div>
</div>
<address-list-dialog ref="dialogAddressListRef" @submit="getAddress" />
......@@ -224,13 +226,13 @@ async function getTickInfo() {
// message.value = JSON.parse(ticketForm.value.extJson.message)
// console.log(message.value)
paymentType.value = ticketForm.value.paymentType
await getDetail(ticketForm.value.activeId)
// console.log(ticketForm.value)
} catch (e) {
console.log(e)
} finally {
}
}
......@@ -339,7 +341,7 @@ function goBack() {
.border-info {
position: relative;
& > label {
position: absolute;
right: 0;
......@@ -349,7 +351,7 @@ function goBack() {
padding: 5px 15px;
font-size: 14px;
}
.poPrice {
position: absolute;
bottom: 0px;
......@@ -404,12 +406,12 @@ function goBack() {
.ccitemBox {
overflow: auto;
label {
margin: 10px 0;
display: block;
min-height: 30px;
span {
color: #FF8124;
font-family: DIN Alternate;
......@@ -424,12 +426,12 @@ function goBack() {
font-size: 15px;
color: #666;
margin: 5px 0 10px;
label {
font-size: 16px;
color: #000;
}
span {
font-size: 13px;
}
......@@ -475,4 +477,5 @@ function goBack() {
line-height: 1;
font-family: "DIN Alternate";
}
</style>
......
src/viewsPc/booking/ticket/confirmOrder.vue
......@@ -12,8 +12,8 @@
<div class="name">{{ TickForm.name }}</div>
<div class="address">{{ TickForm.address }}</div>
</div>
<div class="ticket_info mb20">
<div class="tit_box">
<div class="line" />
......@@ -21,12 +21,12 @@
{{ languageFormat(language, "订票信息", "Ticket Info") }}
</div>
</div>
<div class="form">
<el-form ref="formRef" :model="orderForm" :rules="rules" label-width="140px">
<el-form ref="formRef" :model="orderForm" :rules="rules" label-position="top" label-width="130px">
<div v-if="TickForm2.ticketType == '1'">
<el-form-item :label="language == 0 ? '桌号' : 'Table'">
<!-- <el-popover :width="400" placement="right" trigger="hover">-->
<!-- <template #reference>-->
<!-- <div class="text-primary underline pointer" @click="showImg">-->
......@@ -39,7 +39,7 @@
<!-- />-->
<!-- </el-popover>-->
<!-- -->
<el-radio-group v-model="currDesk">
<el-radio-button
v-for="(it, index) in deskList" :key="index" :disabled="it.status!=0" :label="it.deskNo"
......@@ -105,7 +105,7 @@
</div>
</div>
</el-col>
<el-col :lg="8" class="right">
<div class="tit_box">
<div class="line" />
......@@ -113,7 +113,7 @@
{{ languageFormat(language, "订单明细", "Order summary") }}
</div>
</div>
<div class="detail">
<div class="detail_top">
<div class="time">
......@@ -148,14 +148,14 @@
<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: 30px">
<el-image
......@@ -256,7 +256,7 @@ onMounted(() => {
tickImg.value = route.query.tickImg
customerList()
getDetail()
getActivityTypeVoById({
id: route.params.latstId
}).then((res) => {
......@@ -292,12 +292,12 @@ function changeGroup(e) {
}).then(res => {
if (res.data.length > 0) {
const names = _.map(res.data, (d) => d.name).join(',')
ElMessage({
message: language.value == 0 ? `${names} 已购买该票` : 'The user has purchased the ticket',
type: 'error'
})
_.each(res.data, (d) => {
_.remove(orderForm.value.customerIds, (c) => c == d.id)
_.find(personnelList.value, (p) => p.id == d.id).disabled = true
......@@ -319,7 +319,7 @@ async function paymentHandle() {
useStore.setVisitor()
return
}
if (TickForm2.value.ticketType == '1') {
if (currSeat.value.length == 0) {
ElMessage({
......@@ -336,9 +336,9 @@ async function paymentHandle() {
return
}
}
await formRef.value.validate()
await ElMessageBox.confirm(language.value == 0 ? '确认提交订单吗？' : 'Confirm to submit the order?', {
confirmButtonText: language.value == 0 ? '确定' : 'Confirm',
cancelButtonText: language.value == 0 ? '取消' : 'Cancel',
......@@ -359,7 +359,7 @@ async function paymentHandle() {
seatNo: tempSeat.seatNo
})
})
const res = await submitOrderTicket({
activeId: orderForm.value.activeId,
orderName: TickForm2.value.ticketTypeName,
......@@ -406,7 +406,7 @@ async function paymentHandle() {
} catch (e) {
ElMessage.error(language.value == 0 ? '下单失败,' : 'Order failure')
} finally {
}
})
}
......@@ -450,7 +450,7 @@ div {
//padding: 20px 0;
width: 1200px;
margin: 20px auto;
.tag_t {
padding: 1px 10px;
font-weight: 400;
......@@ -460,7 +460,7 @@ div {
border: 1px solid #453dea;
margin-left: 5px;
}
.title {
padding: 11px;
text-align: center;
......@@ -468,18 +468,18 @@ div {
font-size: 18px;
color: #ffffff;
}
.content {
background-color: #fff;
}
.line {
width: 4px;
height: 18px;
background: linear-gradient(180deg, #493ceb 0%, #8623fc 100%);
border-radius: 4px;
}
.left {
.info {
background: rgba(69, 61, 234, 0.04);
......@@ -487,54 +487,54 @@ div {
border: 1px solid #d3d1f6;
padding: 20px 0 28px 33px;
margin-bottom: 20px;
.name {
font-weight: 500;
font-size: 18px;
color: #000000;
margin-bottom: 20px;
}
.address {
font-weight: 400;
font-size: 14px;
color: #929aa0;
}
}
.ticket_info {
.tit_box {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 14px;
.txt {
font-weight: bold;
font-size: 16px;
color: #493ceb;
}
}
.form {
min-height: 464px;
padding: 20px 60px;
border-radius: 5px;
border: 1px solid #dcdfe6;
.p_box {
display: flex;
width: 100%;
gap: 10px;
max-width: 400px;
.people {
width: 100%;
background: #fbfcfd;
border-radius: 2px;
border: 1px solid #dcdfe6;
padding: 0 14px;
.prople_item {
display: flex;
justify-content: space-between;
......@@ -543,30 +543,30 @@ div {
border-bottom: 1px solid #dcdfe6;
width: 100%;
position: relative;
&:last-child {
border: none;
}
.name {
font-size: 16px;
//color: #929aa0;
margin-bottom: 20px;
.tag_t {
position: absolute;
right: 30px;
padding: 8px;
}
}
.idcard {
font-size: 10px;
color: #929aa0;
}
}
}
.btn {
width: 90px;
height: 40px;
......@@ -585,30 +585,30 @@ div {
}
}
}
.right {
.tit_box {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
.txt {
font-weight: bold;
font-size: 16px;
color: #493ceb;
}
}
.detail {
padding: 15px 26px;
border-radius: 5px;
border: 1px solid #dcdfe6;
.detail_top {
padding-bottom: 13px;
border-bottom: 1px solid #dcdfe6;
.time {
font-weight: 500;
font-size: 20px;
......@@ -616,13 +616,13 @@ div {
line-height: 25px;
margin-bottom: 8px;
}
.ticket {
font-size: 16px;
color: #2d373f;
}
}
.detail_center {
margin-top: 14px;
display: flex;
......@@ -630,26 +630,26 @@ div {
padding-bottom: 13px;
border-bottom: 1px solid #dcdfe6;
gap: 8px;
.ticket {
font-size: 16px;
color: #2d373f;
}
}
.detail_b {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
.sum_txt {
font-weight: 600;
font-size: 18px;
color: #2d373f;
line-height: 25px;
}
.price_num {
font-weight: 600;
font-size: 36px;
......@@ -659,7 +659,7 @@ div {
}
}
}
.footer {
display: flex;
justify-content: space-between;
......@@ -669,20 +669,20 @@ div {
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
margin-top: 9px;
padding: 0 30px;
.label {
font-size: 16px;
color: #7b7f83;
line-height: 22px;
}
.value {
font-size: 22px;
color: #ff8124;
line-height: 30px;
font-weight: 600;
}
.pay {
width: 200px;
height: 40px;
......@@ -696,7 +696,7 @@ div {
cursor: pointer;
user-select: none;
}
.goBack {
width: 200px;
height: 40px;
......@@ -725,12 +725,6 @@ div {
cursor: pointer
}
@media screen and (max-width: 768px) {
.container {
width: 100%;
}
}
.rightBox {
.info {
background: rgba(69, 61, 234, 0.04);
......@@ -741,4 +735,49 @@ div {
margin-top: 30px;
}
}
@media screen and (max-width: 768px) {
.container {
width: 100%;
:deep(.form) {
padding: 30px 0 !important;
form {
padding: 10px;
}
}
.footer {
display: block;
width: 100%;
height: auto;
padding: 20px;
div {
width: 100%;
}
.goBack {
width: 140px;
position: relative;
height: 40px;
top: 0;
left: 0%;
margin: 10px 0;
}
.pay {
width: 140px;
position: relative;
height: 40px;
top: -50px;
left: 55%;
}
}
}
}
</style>
......
src/viewsPc/booking/ticket/peopleManage.vue
......@@ -7,7 +7,7 @@
<span>
{{ languageFormat(language, "观影人管理", "Viewers") }}
</span>
<span class="fr" style="cursor: pointer" @click="$router.go(-1)">
{{ language == 0 ? '返回' : 'Back' }}
</span>
......@@ -25,12 +25,12 @@
</div>
</div>
</div>
<el-dialog
v-model="show"
:title="language==0?'新增观影人':'New moviegoers'"
center
width="700"
style="max-width: 700px;min-width: 350px;"
>
<el-form
ref="formRef" :model="form" :rules="rules" label-width="100px" size="large"
......@@ -50,13 +50,20 @@
<el-input v-model="form.idCard" :placeholder="language==0?'请输入证件号':'Please enter the ID after ah'" />
</el-form-item>
</el-form>
<span class="dialog-footer">
<div class="dialog-footer">
<div style="text-align: center">
<el-button class="can_pay" @click="show = false">{{ language == 0 ? '取 消' : 'cancel' }}</el-button>
<el-button class="pay" type="primary" @click="submit">{{ language == 0 ? '确 定' : 'confirm' }}</el-button>
<el-button class="can_pay marginBtn" @click="show = false">{{
language == 0 ? '取 消' : 'cancel'
}}
</el-button>
<el-button class="pay marginBtn" type="primary" @click="submit">{{
language == 0 ? '确 定' : 'confirm'
}}
</el-button>
</div>
</span>
</div>
<br>
</el-dialog>
</el-card>
......@@ -114,7 +121,7 @@ function submit() {
useStore().setVisitor()
return
}
formRef.value.validate((valid) => {
if (valid) {
aadCustomer(form.value).then(res => {
......@@ -173,12 +180,12 @@ div {
:deep(.el-dialog) {
padding: 0;
.el-dialog__header {
height: 50px;
line-height: 50px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
.el-dialog__title {
color: #fff;
}
......@@ -219,7 +226,7 @@ div {
//}
width: 1200px;
margin: 20px auto;
.title {
position: relative;
padding: 11px;
......@@ -227,7 +234,7 @@ div {
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
font-size: 18px;
color: #ffffff;
.add_btn {
position: absolute;
left: 20px;
......@@ -247,32 +254,32 @@ div {
cursor: pointer;
}
}
.content {
min-height: 590px;
background-color: #fff;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
padding: 20px;
.people_box {
display: flex;
flex-wrap: wrap;
gap: 20px;
.people_item {
width: 275px;
height: 137px;
background: #ffffff;
border: 1px solid #dcdfe6;
padding: 16px;
.name {
font-weight: 600;
font-size: 16px;
color: #2d373f;
line-height: 22px;
}
.idcard {
font-size: 16px;
color: #95a1a6;
......@@ -280,7 +287,7 @@ div {
margin-top: 12px;
margin-bottom: 17px;
}
.btn {
width: 69px;
height: 32px;
......@@ -302,5 +309,12 @@ div {
.container {
width: 100%;
}
form {
margin: 20px 20px 0 0 !important;
}
}
.marginBtn {
margin: 5px
}
</style>
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!