开票模块功能迁移

src/pages/parkingFee/components/officeBlue/parkingReceipt/parkingApplication.vue

@@ -1,77 +1,44 @@
 <template>
   <div>
-    <div class="scroll-Y" scroll-y>
+    <div class="scroll-Y">
       <div class="push-box">
         <div class="choose-invoice-header lines" @click="changeHeader">
           <div class="invoice-header-info" v-if="headerInfo.titleName">
-            <div
-              class="invoice-header-name"
-              :class="headerInfo.invoiceTitleType == 'COMPANY' ? 'header-name' : ''"
-            >
+            <div class="invoice-header-name" :class="headerInfo.invoiceTitleType == 'COMPANY' ? 'header-name' : ''">
               <div>
                 {{ headerInfo.titleName }}
-                <span class="isDefault" v-if="headerInfo.defaultOrNot"
-                >默认</span
-                >
+                <span class="isDefault" v-if="headerInfo.defaultOrNot">默认</span>
               </div>
-              <img
-                class="invoice-header-arrow"
-                :src="arrowIcon"
-                mode="widthFix"
-              />
-            </div>
-            <div v-if="headerInfo.invoiceTitleType == 'COMPANY'" class="duty-paragraph">
-              税号：{{ headerInfo.taxNo }}
+              <img class="invoice-header-arrow" :src="arrowIcon" mode="widthFix" />
             </div>
+            <div v-if="headerInfo.invoiceTitleType == 'COMPANY'" class="duty-paragraph">税号：{{ headerInfo.taxNo }}</div>
           </div>
           <div class="invoice-header-info" v-else>
             <div class="invoice-header-name">
               <div>请选择发票抬头</div>
-              <img
-                class="invoice-header-arrow"
-                :src="arrowIcon"
-                mode="widthFix"
-              />
+              <img class="invoice-header-arrow" :src="arrowIcon" mode="widthFix" />
             </div>
             <div class="duty-paragraph">未选择发票抬头</div>
           </div>
         </div>
-        <div class="tab-header" v-if="headerInfo.titleName">
-          发票详情
-        </div>
+        <div class="tab-header" v-if="headerInfo.titleName">发票详情</div>
         <div class="part" v-if="headerInfo.titleName">
           <div class="invoice-header">
-            <!-- <uni-view class="part-item">
-          			<span class="part-item-key">开票订单号</span>
-          			<span class="part-item-value">{{ orderInfo.orderNo }}</span>
-          		</uni-view> -->
             <div class="part-item">
               <span class="part-item-key">发票类型</span>
               <span class="part-item-value">增值税普通发票</span>
             </div>
             <div class="part-item">
               <span class="part-item-key">抬头类型</span>
-              <span class="part-item-value">{{
-                  headerInfo.invoiceTitleType === 'COMPANY' ? '单位' : '个人/非企业单位'
-                }}</span>
+              <span class="part-item-value">{{ headerInfo.invoiceTitleType === 'COMPANY' ? '单位' : '个人/非企业单位' }}</span>
             </div>
-            <div
-              class="part-item"
-              :class="headerInfo.invoiceTitleType == 'COMPANY' ? 'header-name' : ''"
-            >
+            <div class="part-item" :class="headerInfo.invoiceTitleType == 'COMPANY' ? 'header-name' : ''">
               <span class="part-item-key">抬头名称</span>
-              <span class="part-item-value">{{
-                  headerInfo.titleName
-                }}</span>
+              <span class="part-item-value">{{ headerInfo.titleName }}</span>
             </div>
-            <div
-              class="part-item lines"
-              v-if="headerInfo.invoiceTitleType === 'COMPANY'"
-            >
+            <div class="part-item lines" v-if="headerInfo.invoiceTitleType === 'COMPANY'">
               <span class="part-item-key">公司税号</span>
-              <span class="part-item-value">{{
-                  headerInfo.taxNo
-                }}</span>
+              <span class="part-item-value">{{ headerInfo.taxNo }}</span>
             </div>
           </div>
           <div class="invoice-more" v-if="headerInfo.invoiceTitleType === 'COMPANY'">
@@ -85,9 +52,7 @@
             <div class="is-show-more" v-if="isShow">
               <div class="part-item">
                 <span class="part-item-key">公司地址</span>
-                <span class="part-item-value">{{
-                    headerInfo.companyAddress
-                  }}</span>
+                <span class="part-item-value">{{ headerInfo.companyAddress }}</span>
               </div>
               <div class="part-item">
                 <span class="part-item-key">公司电话</span>
@@ -95,15 +60,11 @@
               </div>
               <div class="part-item">
                 <span class="part-item-key">开户银行</span>
-                <span class="part-item-value">{{
-                    headerInfo.depositBank
-                  }}</span>
+                <span class="part-item-value">{{ headerInfo.depositBank }}</span>
               </div>
               <div class="part-item top">
                 <span class="part-item-key">开户账户</span>
-                <span class="part-item-value">{{
-                    headerInfo.depositAccount
-                  }}</span>
+                <span class="part-item-value">{{ headerInfo.depositAccount }}</span>
               </div>
             </div>
           </div>
@@ -112,108 +73,51 @@
           <div class="part-item lines">
             <span class="part-item-key">总金额</span>
             <span class="part-item-value"
-            ><span class="purple">{{ invoiceAmount }} 元</span></span
+              ><span class="purple">{{ invoiceAmount }} 元</span></span
             >
           </div>
           <div class="part-item top" v-if="type == ''">
             <span class="part-item-key"
-            >共<span class="purple">{{ orderQuantity }}笔</span>缴费记录</span
+              >共<span class="purple">{{ orderQuantity }}笔</span>缴费记录</span
             >
             <div class="part-item-value" @click="gotoDetail">
               <span>查看详情</span>
-              <img
-                class="invoice-header-arrow"
-                :src="arrowIcon"
-                mode="widthFix"
-              />
+              <img class="invoice-header-arrow" :src="arrowIcon" mode="widthFix" />
             </div>
           </div>
         </div>
         <div class="tab-header">接收方式</div>
-        <div class="part footer">
+        <div class="part">
           <div class="part-item lines">
-            <span
-              class="part-item-key"
-              style="min-width: 120px; white-space: nowrap"
-            >电子邮箱</span
-            >
+            <span class="part-item-key" style="min-width: 120px; white-space: nowrap">电子邮箱</span>
             <div class="part-item-value">
-              <!-- sota_xu@hafengkeji.com -->
-              <input
-                class="van-field__control"
-                style="white-space: nowrap"
-                type="text"
-                @blur="mailboxChange"
-                placeholder="请输入电子邮箱"
-                v-model="condition.email"
-              />
-              <!-- <textarea
-                rows="1"
-                placeholder="请输入电子邮箱"
-                class="van-field__control"
-                v-model="condition.mailbox"
-              ></textarea> -->
+              <input class="van-field__control" style="white-space: nowrap" type="text" @blur="mailboxChange" placeholder="请输入电子邮箱" v-model="condition.email" />
             </div>
           </div>
           <div class="part-item default-email" @click="changeDefaultEMail">
-            <!-- @click="changeDefaultEMail" -->
-            <van-checkbox v-model="condition.emailAsDefault" @change="emailAsDefaultChange" icon-size="30PX"
-            ><span class="text">保存电子邮箱为默认邮箱</span></van-checkbox
-            >
-            <!-- <van-checkbox-group v-model="isDefaultEMail">
-            <van-checkbox name="a">保存电子邮箱为默认邮箱</van-checkbox>
-            <van-checkbox name="b">复选框 b</van-checkbox>
-          </van-checkbox-group> -->
+            <van-checkbox v-model="condition.emailAsDefault" @change="emailAsDefaultChange" icon-size="30PX"><span class="text">保存电子邮箱为默认邮箱</span></van-checkbox>
           </div>
         </div>
         <div class="tab-header">备注</div>
         <div class="textarea-remark">
-          <!-- <spanarea placeholder-style="color:#999999" placeholder="选填" v-model="condition.remark" /> -->
-          <!-- <input type="text"> -->
-          <textarea
-            rows="3"
-            placeholder-style="color:#999999"
-            placeholder="选填"
-            @blur="storeRemarkChange"
-            v-model="condition.remark"
-          ></textarea>
+          <textarea rows="3" placeholder-style="color:#999999" placeholder="选填" @blur="storeRemarkChange" v-model="condition.remark"></textarea>
         </div>
         <!-- 占位 -->
-        <div
-          style="
-            height: 120px;
-            background-color: transparent;
-            color: transparent;
-            position: relative;
-          "
-        >
-          占位
-        </div>
+        <div style="height: 75px; background-color: transparent; color: transparent; position: relative">占位</div>
       </div>
     </div>
-    <div class="push-btn">
-      <div
-        v-if="headerInfo.titleName || true"
-        :class="{
-          btn: true,
-          'push-again-btn': true,
-          'blue-push-again-btn': custTypeId === 1,
-          'green-push-again-btn': custTypeId === 2,
-        }"s
-        @click="submit"
-      >
-        提交
-      </div>
-      <div v-else class="btn disable-btn" disabled>请选择发票抬头</div>
+    <div class="footer">
+      <k-button v-if="headerInfo.titleName" title="提交" style="margin: 0 auto 30px" disabledColor="#D1D2D9" @click="submit" />
+      <k-button v-else disabled title="请选择发票抬头" style="margin: 0 auto 30px" disabledColor="#D1D2D9" />
     </div>
   </div>
 </template>
 
 <script>
-import parkingApplicationJs from '../../../mixins/parkingReceipt/parkingApplication'
+import parkingApplicationJs from '../../../mixins/parkingReceipt/parkingApplication';
 export default {
-  mixins:[parkingApplicationJs]
-}
+  mixins: [parkingApplicationJs],
+};
 </script>
 
 <style lang="less" scoped>
@@ -222,6 +126,8 @@ export default {
 .scroll-Y {
   width: 100%;
   display: flex;
+  height: 100vh;
+  overflow-y: scroll;
   flex-direction: column;
   // height: 88vh;
   background-color: #f4f7ff;
@@ -482,4 +388,39 @@ export default {
     background-color: #bdbdbd;
   }
 }
+
+.footer {
+  width: 100%;
+  //background-color: #ffffff;
+  background-color: #fafbff;
+  position: fixed;
+  bottom: 0;
+  box-shadow: 0 0 10px 0 hsla(0, 6%, 58%, 0.6);
+  -webkit-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
+  -moz-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
+  //padding-bottom: constant(safe-area-inset-bottom);
+  //padding-bottom: env(safe-area-inset-bottom);
+  //padding-bottom: 20px;
+  //margin: 30px;
+  padding: 30px;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+
+  .push-again-btn {
+    color: #ffffff;
+    // background-image: linear-gradient(to right, #7d4ea1, #40397c);
+    background-color: #064c8a;
+    border-radius: 50px;
+    text-align: center;
+    //padding: 20px 0;
+  }
+
+  .blue-push-again-btn {
+    .color-background-color('blue');
+  }
+
+  .green-push-again-btn {
+    .color-background-color('green');
+  }
+}
 </style>

src/pages/parkingFee/components/officeBlue/parkingReceipt/parkingChangeHeader.vue

@@ -116,16 +116,7 @@
       </div>
     </scroll-view>
     <div class="part footer">
-      <div
-        :class="{
-          'push-again-btn': true,
-          'blue-push-again-btn': custTypeId === 1,
-          'green-push-again-btn': custTypeId === 2,
-        }"
-        @click="submit"
-      >
-        保存
-      </div>
+        <k-button title="保存" style="margin: 0 auto 30px" @click="submit" />
     </div>
   </div>
 </template>
@@ -232,16 +223,20 @@ export default {
 }
 .footer {
   width: 100%;
-  height: 150px;
+  //height: 150px;
   position: fixed;
   bottom: 0px;
+  background-color: #FAFBFF;
+  padding: 30px;
   padding-bottom: constant(safe-area-inset-bottom);
   padding-bottom: env(safe-area-inset-bottom);
-  //padding-bottom: 20px;
   box-shadow: 0 0 10px 0 hsla(0, 6%, 58%, 0.6);
   -webkit-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
   -moz-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
-  // padding-top: 20px;
+  padding: 30px;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  
   .invoive-img {
     text-align: center;
 
@@ -266,24 +261,5 @@ export default {
       }
     }
   }
-
-  .push-again-btn {
-    margin: 25px 30px;
-    //background-image: linear-gradient(to right, #7d4ea1, #40397c);
-    background: #064c8a;
-    border-radius: 45px;
-    //border-radius: 50px;
-    color: #ffffff;
-    text-align: center;
-    padding: 25px 0;
-  }
-
-  .blue-push-again-btn {
-    .color-background-color('blue');
-  }
-
-  .green-push-again-btn {
-    .color-background-color('green');
-  }
 }
 </style>

src/pages/parkingFee/components/officeBlue/parkingReceipt/parkingChooseHeader.vue

@@ -55,16 +55,7 @@
       </div>
     </div>
     <div class="footer">
-      <div
-        :class="{
-          'push-again-btn': true,
-          'blue-push-again-btn': custTypeId === 1,
-          'green-push-again-btn': custTypeId === 2,
-        }"
-        @click="changeHeader('add')"
-      >
-        添加抬头
-      </div>
+      <k-button title="添加抬头" style="margin: 0 auto 30px" disabledColor="#D1D2D9" @click="changeHeader('add')" />
     </div>
   </div>
 </template>
@@ -180,24 +171,29 @@ export default {
 
 .footer {
   width: 100%;
-  background-color: #ffffff;
+  //background-color: #ffffff;
+  background-color: #FAFBFF;
   position: fixed;
   bottom: 0;
   box-shadow: 0 0 10px 0 hsla(0, 6%, 58%, 0.6);
   -webkit-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
   -moz-box-shadow: 0 0 20px 0 hsla(0, 6%, 58%, 0.6);
-  // padding-bottom: constant(safe-area-inset-bottom);
-  // padding-bottom: env(safe-area-inset-bottom);
-  padding-bottom: 20px;
-
+   //padding-bottom: constant(safe-area-inset-bottom);
+   //padding-bottom: env(safe-area-inset-bottom);
+  //padding-bottom: 20px;
+  //margin: 30px;
+  padding: 30px;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  
   .push-again-btn {
-    margin: 20px 60px;
+    
     color: #ffffff;
     // background-image: linear-gradient(to right, #7d4ea1, #40397c);
     background-color: #064c8a;
     border-radius: 50px;
     text-align: center;
-    padding: 20px 0;
+    //padding: 20px 0;
   }
 
   .blue-push-again-btn {

src/pages/parkingFee/components/officeBlue/parkingReceipt/parkingInvoice.vue

@@ -10,7 +10,7 @@
       </div>
       <div class="part-item">
         <span class="part-item-key">开票订单号</span>
-        <span class="part-item-value">{{ order.orderno }}</span>
+        <span class="part-item-value">{{ order.invoiceOrderNo }}</span>
       </div>
       <div class="part-item">
         <span class="part-item-key">发票类型</span>
@@ -19,13 +19,13 @@
       <div class="part-item">
         <span class="part-item-key">开票日期</span>
         <span class="part-item-value">{{
-          order.paperDrewDate ? order.paperDrewDate : '-'
+          order.invoiceDate ? order.invoiceDate : '-'
         }}</span>
       </div>
       <div class="part-item">
         <span class="part-item-key">发票号码</span>
         <span class="part-item-value">{{
-          order.invoiceno ? order.invoiceno : '-'
+          order.invoiceNumber ? order.invoiceNumber : '-'
         }}</span>
       </div>
       <div class="part-item">
@@ -43,12 +43,12 @@
       <div class="part-item">
         <span class="part-item-key">总金额</span>
         <span class="part-item-value"
-          ><span class="purple">¥{{ order.invoiceAmount / 100 }}</span></span
+          ><span class="purple">¥{{ order.invoiceTotalAmount }}</span></span
         >
       </div>
       <div class="part-item">
         <span class="part-item-key"
-          >共<span class="purple-order">{{ order.payNumber }}笔</span
+          >共<span class="purple-order">{{ order.totalOrderCount }}笔</span
           >缴费记录</span
         >
         <div class="part-item-value" @click="gotoRecordDetail">