md

src/views/emis/emisSettleBill/panel/BillDetailPanelReadOnly.vue

@@ -0,0 +1,173 @@
+<template>
+ <div>
+
+  <div style="margin-bottom:20px">
+  <el-descriptions  :title="$t('账单信息')"  size="mini"  :column="4">
+      <el-descriptions-item label="账单名称">{{ settleBillItem.settleBillName }}</el-descriptions-item>
+      <el-descriptions-item label="账单编号">{{ settleBillItem.settleBillNo }}</el-descriptions-item>
+      <el-descriptions-item label="账单月份">{{ settleBillItem.billMonth }}</el-descriptions-item>
+      <el-descriptions-item label="应收金额">{{ settleBillItem.recMoney }}</el-descriptions-item>
+      <el-descriptions-item label="总票数">{{ settleBillItem.sendPieceSum }}</el-descriptions-item>
+      <el-descriptions-item label="总件数">{{ settleBillItem.pieceNumber }}</el-descriptions-item>
+      <el-descriptions-item label="结算重量">{{ settleBillItem.feeWeight }}</el-descriptions-item>
+      <el-descriptions-item label="月结编号" v-if="settleBillItem.settleType==2">{{ settleBillItem.custNo }}</el-descriptions-item>
+      <el-descriptions-item label="月结客户" v-if="settleBillItem.settleType==2">{{ settleBillItem.custName }}</el-descriptions-item>
+      <el-descriptions-item label="账单类型" >
+        <span v-if="settleBillItem.settleType==1">现金账单</span>
+        <span v-if="settleBillItem.settleType==2">月结账单</span>
+      </el-descriptions-item>
+      <el-descriptions-item label="销售联系人">{{ settleBillItem.salesmen }}</el-descriptions-item>
+      <el-descriptions-item label="回款联系人">{{ settleBillItem.payee }}</el-descriptions-item>
+
+    </el-descriptions>
+  </div>
+
+    <div style="margin-bottom:20px">
+                  <div style="font-weight:500;margin-bottom:20px">收款状态:<span>未收款</span></div>
+                  <div>总应收:<span style="color:red;font-weight:500;">{{ settleBillItem.recMoney }}</span>,已收:<span style="color:blue;font-weight:500;">{{ settleBillItem.recedMoney }}</span></div>
+                  <div>
+                    <PayRecordList :settleBillNo="settleBillNo"> </PayRecordList>
+                  </div>
+              </div>
+              <div style="margin-bottom:20px">
+                  <div style="font-weight:500;margin-bottom:20px">开票状态:<span>未开票</span></div>
+                  <div>最高可开票金额:<span style="color:red;font-weight:500;">{{ settleBillItem.recMoney }}</span>,已开票:<span style="color:blue;font-weight:500;"></span></div>
+                  <div>
+                    <InvoiceRecordList :settleBillNo="settleBillNo"> </InvoiceRecordList>
+                  </div>
+              </div>
+
+
+ </div>
+</template>
+
+<script>
+import { getInfoBySettleBillNo } from "@/api/emis/emisSettleBill";
+import PayRecordList from '@/views/emis/emisSettlePayRecord/panel/PayRecordList.vue';
+import InvoiceRecordList from '@/views/emis/emisSettleInvoiceRecord/panel/InvoiceRecordList.vue';
+
+export default {
+  name: "BillDetailPanel",
+  props:{
+    settleBillNo:{
+        type:String
+    }
+  },
+  components: {
+    PayRecordList,
+    InvoiceRecordList
+ },
+  dicts: [
+  ],
+  data() {
+    return {
+      loading: false,
+      settleBillItem:null,
+    };
+  },
+  watch: {
+      "settleBillNo": {
+        handler (newValue, oldValue) {
+          this.initData();
+        },
+        deep: true
+      }
+  },
+  created() {
+    this.initData();
+  },
+  methods: {
+    initData(){
+      this.loading = true;
+      getInfoBySettleBillNo(this.settleBillNo).then(response => {
+        this.settleBillItem = response.data;
+       this.loading = false;
+      });
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+
+  .el-descriptions-item__content{
+    font-weight:bold;
+    color: #000;
+  }
+
+  .el-form-item__label {
+      color: #000;
+  }
+
+  .el-input-group__append {
+      padding: 0 4px;
+  }
+
+  .el-row{
+        display:flex;
+        flex-wrap: wrap;
+        // padding-right: 10px;
+  }
+
+  .el-form-item__label {
+    font-size: 12px!important;
+  }
+
+
+  .platform-auto-complete {
+    .el-autocomplete-suggestion__wrap {
+      padding: 5px 0;
+      ul li {
+        pointer-events: none; // 阻止可点击事件
+        .default {
+          text-align: center;
+          color: #999;
+        }
+        &:hover {
+          background-color: #fff;
+        }
+      }
+    }
+  }
+
+  .el-collapse {
+      border-top: none!important;
+      border-bottom: none!important;
+  }
+
+  .el-table .el-table__cell:first-child .cell {
+    padding: 0px;
+  }
+
+  .el-table .cell {
+      padding: 0px;
+  }
+
+  .cargoList{
+    .el-input__inner {
+        height: 28px;
+        line-height: 28px;
+        border: none;
+        background: #ffffcd;
+        font-size: 10px;
+        padding: 0px;
+        text-align: center;
+    }
+  }
+
+  .el-descriptions__title{
+    font-size: 12px;
+  }
+
+  .el-collapse-item__content {
+      padding-bottom: 0px;
+  }
+  .el-collapse-item__header{
+    pointer-events: none;
+  }
+
+  .el-collapse-item__arrow {
+    pointer-events: auto;
+  }
+
+</style>