index.vue

<template>
	<div class="eibs-tab">
    <el-row>
      <c-col :span="8" style="padding-right:20px;">
        <el-form-item label="统一社会信用代码" prop="unionOrgCode" style="width: 100%">
          <c-input disabled v-model="model.unionOrgCode"></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="8" style="padding-right:20px;">
        <el-form-item label="平台订单编号" prop="orderNo" style="width: 100%">
          <c-input disabled v-model="model.orderNo"></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="8" style="text-align: right">
        <el-button size="small" type="primary" @click="queryGdye()">余额查询</el-button>
      </c-col>
    </el-row>
    <!-- 报关单参考余额查询表格 -->
    <el-row>
			<c-col :span="24">
				<el-table :data="bgdlst" :highlight-current-row="true" border size="small" style="width:100%">
          <el-table-column label="报关单号" prop="customNo" min-width="160px"></el-table-column>
					<el-table-column label="币种" prop="customCurrency" min-width="70px">
            <template slot-scope="scope">
              <c-select
                disabled
                v-model="scope.row.customCurrency"
                style="width: 100%"
                :code="codes.cur"
              >
            </c-select>
          </template>
          </el-table-column>
          <el-table-column label="参考可付金额" prop="remainderValue" min-width="130px">
            <template slot-scope="scope">
                {{ moneyFormat(scope.row.remainderValue, scope.row.customCurrency) }}
            </template>
				  </el-table-column>
          <el-table-column label="报关金额" prop="customAmount" min-width="130px">
            <template slot-scope="scope">
                {{ moneyFormat(scope.row.customAmount, scope.row.customCurrency) }}
            </template>
				  </el-table-column>
					<el-table-column fixed="right" prop="op" label="操作" width="380px">
						<template slot-scope="scope">
							<el-button size="small" type="text" @click="queryGdmx(scope.row)">关单明细</el-button>
							<el-button size="small" type="text" @click="queryYzbg(scope.row)">产生验真报告</el-button>
              <el-button size="small" type="text" @click="queryImage(scope.row)">产生关单PDF</el-button>
							<el-button size="small" type="text" @click="queryPdf(scope.row)">PDF列表</el-button>
						</template>
					</el-table-column>
				</el-table>
			</c-col>
		</el-row>
		<el-row>
      <c-collapse v-model="activeNames">
        <el-collapse-item title="验真报告" name="yzbg">
          <c-content>
            <m-infos :model="yzbglst" :codes="codes"/>
					</c-content>
        </el-collapse-item>
        <el-collapse-item title="关单PDF" name="gdpdf">
          <c-content>
            <m-infos :model="gdpdflst" :codes="codes"/>
					</c-content>
        </el-collapse-item>
      </c-collapse>
		</el-row>
    <!-- 查看关单明细弹框 -->
		<message-view ref="msgView"></message-view>
	</div>
</template>
<script>
import commonDepend from "~/mixin/commonDepend.js";
import event from "../event";
import infos from "./infos";
import MessageView from "~/components/business/docpan/views/MessageView";

export default {
  inject: ["root"],
  mixins: [commonDepend, event],
  components: {
    "m-infos": infos,
    "message-view": MessageView
  },
  props: ["model", "codes"],
  data() {
    return {
      activeNames: ["yzbg", "gdpdf"],
      bgdlst: [],
      yzbglst: [],
      gdpdflst: []
    };
  },
  computed: {},
  methods: {}
};
</script>
<style scoped lang="less">
.eibs-tab {
  padding: 16px;
  /deep/ .el-col .el-divider--horizontal {
    margin-top: 10px;
  }
  .formItemLabel /deep/ .el-form-item__label {
    text-align: left;
    font-weight: bold;
  }
  .messageLabel /deep/ .el-form-item__label {
    text-align: left;
    font-weight: bold;
    font-size: 12px;
  }
  /deep/ .el-button--orange {
    background: #99ffff;
    border-color: #99ffff;
  }
}
</style>