first

src/views/index/invoicingNotify.vue

@@ -0,0 +1,94 @@
+<template>
+<div class="wrap">
+<div class="itemWrap" v-for="(item,index) in 3" :key="index">
+  <div class="item line1">
+    <div class="itemTime">
+      <span class="title">开票月份:</span>
+      <span class="content">2023年7月</span>
+    </div>
+    <div class="orderNum">
+      <span class="title">总案件数:</span>
+      <span class="content">86</span>
+    </div>
+    <div class="checkBtn" @click="goPage('invoicingDetail')">查看
+    </div>
+  </div>
+  <div class="item">
+    <span class="title">批次号:</span>
+    <span class="content">PC230626124283</span>
+  </div>
+  <div class="item">
+    <span class="title">结算总金额:</span>
+    <span class="content">1238元</span>
+  </div>
+  <div class="item">
+    <span class="title">扣款金额:</span>
+    <span class="content">2300元</span>
+  </div>
+  <div class="item">
+    <span class="title">扣款原因:</span>
+    <span class="content"  style="color: #FF8F37;">调度不及时导致客户等待时间过长</span>
+  </div>
+  <div class="item">
+    <span class="title">最终开票金额:</span>
+    <span class="content">1008元</span>
+  </div>
+</div>
+</div>
+</template>
+
+<script>
+import {myMixins} from "@/utils/myMixins"
+export default {
+  name: "invoicingNotify",
+  mixins:[myMixins],
+  methods:{
+    checkDetail(index){
+      console.log("查看详情"+index)
+
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+@import "@/styles/mixin.scss";
+.wrap{
+  @include wh(100%,100%);
+  background-color: #F4F5F7;
+  overflow-y: auto;
+}
+.itemWrap{
+  background: #FFFFFF;
+  @include wh(100%,194px);
+  box-sizing: border-box;
+  padding: 14px 25px 18px 29px;
+  @include flexBetween;
+  margin-bottom: 10px;
+  .item{
+    @include fontWeightSize(400,12px);
+    span{
+      display: inline-block;
+    }
+    .title{
+      opacity: .5;
+      //width:55px;
+    }
+    .content{}
+  }
+  .line1{
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    .checkBtn{
+      background: #354D93;
+      border-radius: 3px;
+      @include wh(48px,18px);
+      line-height: 18px;
+      text-align: center;
+      color: #FFFFFF;
+    }
+  }
+}
+
+</style>