From 4b5b989a31cbbd9f7738450516eed2f146bf1f1e Mon Sep 17 00:00:00 2001
From: zhangxiaoxu123 <819527061@qq.com>
Date: 星期二, 03 一月 2023 21:10:38 +0800
Subject: [PATCH] 添加中间页面
---
src/components/page/invoice/middlePge.vue | 52 ------------
src/components/page/invoice/invoiceForm.vue | 151 ++++++++++++++++++++++---------------
2 files changed, 93 insertions(+), 110 deletions(-)
diff --git a/src/components/page/invoice/invoiceForm.vue b/src/components/page/invoice/invoiceForm.vue
index 224a2a3..c8cbb7d 100644
--- a/src/components/page/invoice/invoiceForm.vue
+++ b/src/components/page/invoice/invoiceForm.vue
@@ -1,71 +1,77 @@
<template>
<div class="invoiceForm-wrap">
- <div class="title">璁㈠崟鍙戠エ</div>
- <div class="invoiceForm-main">
- <div class="invoiceForm-main-inside">
- <div class="invoice-date-box">
- <el-date-picker
- :editable="false"
- format="yyyy-MM"
- value-format="yyyy-MM"
- v-model="date"
- type="month"
- @change="changeDate"
- placeholder="閫夋嫨鏃ユ湡">
- </el-date-picker>
- </div>
- <van-list
- v-model="loading"
- :finished="finished"
- finished-text="娌℃湁鏇村浜�"
- :offset="50"
- :immediate-check="false"
- @load="onLoad"
- >
-
- <div v-for="(item,index) in invoiceData" :key="index">
- <el-checkbox
- v-model="item.isShow"
- class="invoiceForm-block"
- @change="handleCheckedCitiesChange(invoiceData)">
- <div>
- <div class="invoiceForm-content">
-
- <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
- <use xlink:href="#icon-shijian3"></use>
- </svg>
- {{item.enterTime}}
- </div>
- <div class="invoiceForm-content">
-
- <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
- <use xlink:href="#icon-shijian3"></use>
- </svg>
- {{item.outTime}}
- </div>
- <div class="invoiceForm-content">
- <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
- <use xlink:href="#icon-dizhi1"></use>
- </svg>
- {{item.address}}
- </div>
- </div>
- <div class="money-main">
- <h1 class="money-box">{{item.money}}<font class="money-small">鍏�</font></h1>
- </div>
- </el-checkbox>
+ <div v-if="isWeiXin ">
+ <div class="title">璁㈠崟鍙戠エ</div>
+ <div class="invoiceForm-main">
+ <div class="invoiceForm-main-inside">
+ <div class="invoice-date-box">
+ <el-date-picker
+ :editable="false"
+ format="yyyy-MM"
+ value-format="yyyy-MM"
+ v-model="date"
+ type="month"
+ @change="changeDate"
+ placeholder="閫夋嫨鏃ユ湡">
+ </el-date-picker>
</div>
- </van-list>
- <div class="fapiao-btn">
- <el-checkbox v-model="checkAll" @change="handleCheckAllChange">鍏ㄩ��</el-checkbox>
- <div class="fapiao-right">
- <span class="money">閲戦锛�<font class="big">{{countMoney}}</font>鍏�</span>
- <el-button size="mini" @click="seeInvoice">涓嬭浇鍙戠エ</el-button>
+ <van-list
+ v-model="loading"
+ :finished="finished"
+ finished-text="娌℃湁鏇村浜�"
+ :offset="50"
+ :immediate-check="false"
+ @load="onLoad"
+ >
+
+ <div v-for="(item,index) in invoiceData" :key="index">
+ <el-checkbox
+ v-model="item.isShow"
+ class="invoiceForm-block"
+ @change="handleCheckedCitiesChange(invoiceData)">
+ <div>
+ <div class="invoiceForm-content">
+
+ <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
+ <use xlink:href="#icon-shijian3"></use>
+ </svg>
+ {{item.enterTime}}
+ </div>
+ <div class="invoiceForm-content">
+
+ <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
+ <use xlink:href="#icon-shijian3"></use>
+ </svg>
+ {{item.outTime}}
+ </div>
+ <div class="invoiceForm-content">
+ <svg class="iconSvg" style="font-size: 12px" aria-hidden="true">
+ <use xlink:href="#icon-dizhi1"></use>
+ </svg>
+ {{item.address}}
+ </div>
+ </div>
+ <div class="money-main">
+ <h1 class="money-box">{{item.money}}<font class="money-small">鍏�</font></h1>
+ </div>
+ </el-checkbox>
+ </div>
+ </van-list>
+ <div class="fapiao-btn">
+ <el-checkbox v-model="checkAll" @change="handleCheckAllChange">鍏ㄩ��</el-checkbox>
+ <div class="fapiao-right">
+ <span class="money">閲戦锛�<font class="big">{{countMoney}}</font>鍏�</span>
+ <el-button size="mini" @click="seeInvoice">涓嬭浇鍙戠エ</el-button>
+ </div>
</div>
</div>
</div>
</div>
-
+ <div class="middlePge-wrap" v-else>
+ <div class="middlePge-main">
+ <img src="../../../assets/images/middlePage.png" alt="">
+ </div>
+ </div>
</div>
</template>
@@ -78,6 +84,7 @@
},
data() {
return {
+ isWeiXin: false,
date:'',
checkedInvoices: [1,2],
invoiceData:[],
@@ -92,12 +99,22 @@
}
},
created() {
+ this.checkWeiXin()
this.date = this.$byutil.dateFormat(new Date(), "yyyy-MM");
},
mounted() {
this.getByCarNo()
},
methods: {
+ checkWeiXin() {
+ let userAgent = navigator.userAgent;
+ console.log(userAgent)
+ if (userAgent.includes("MicroMessenger")) {
+ this.isWeiXin = true
+ } else {
+ this.isWeiXin = false
+ }
+ },
onLoad() {
this.loading = true
this.current += 1
@@ -270,6 +287,18 @@
top: 2px;
}
}
+ .middlePge-wrap{
+ width: 100%;
+ height: 100%;
+ background: rgba(0,0,0,0.7);
+ .middlePge-main{
+ width: 100%;
+ height: 100%;
+ img{
+ width: 100%;
+ }
+ }
+ }
.iconSvg{
width: 3.2vw /* 24/7.5 */;
height: 3.2vw /* 24/7.5 */;
diff --git a/src/components/page/invoice/middlePge.vue b/src/components/page/invoice/middlePge.vue
index 04300ca..4aec5b2 100644
--- a/src/components/page/invoice/middlePge.vue
+++ b/src/components/page/invoice/middlePge.vue
@@ -1,21 +1,7 @@
<template>
<div class="middlePge-wrap">
<div class="middlePge-main">
- <div class="middlePge-block">
- <div class="num">1</div>
- <div class="wenzi-box">
- <h1>鐐瑰嚮鍙充笂瑙掔殑</h1>
- <div>...</div>
- <h1>鎸夐挳</h1>
- </div>
- </div>
- <div class="middlePge-block">
- <div class="num">2</div>
- <div class="wenzi-box">
- <h1>閫夋嫨</h1>
- <div>鍦ㄦ祻瑙堝櫒涓墦寮�</div>
- </div>
- </div>
+ <img src="../../../assets/images/middlePage.png" alt="">
</div>
</div>
</template>
@@ -38,40 +24,8 @@
.middlePge-main{
width: 100%;
height: 100%;
- display: flex;
- flex-direction: column;
- padding: 18.67vw /* 140/7.5 */ 5.33vw /* 40/7.5 */;
- box-sizing: border-box;
- .middlePge-block{
- display: flex;
- margin-top: 6.67vw /* 50/7.5 */;
- .num{
- width: 5.33vw /* 40/7.5 */;
- height: 5.33vw /* 40/7.5 */;
- background: #f84e01;
- border-radius: 50%;
- line-height: 5.33vw;
- text-align: center;
- color: #fff;
- }
- .wenzi-box{
- display: flex;
- h1{
- font-size: 3.73vw /* 28/7.5 */;
- color: #fff;
- font-weight: normal;
- letter-spacing: 2px;
- }
- div{
- display: block;
- border-radius: 1.33vw /* 10/7.5 */;
- box-shadow: 0 0 10px rgba(0,0,0,1);
- padding: 0 2.67vw /* 20/7.5 */;
- color: #fff;
- background-image: linear-gradient(to bottom,#49545a,#202227);
- margin: 0 2px;
- }
- }
+ img{
+ width: 100%;
}
}
}
--
Gitblit v1.9.1