erp-el-element/Dialog/settlementok.vue

<!--
 * @Author: your name
 * @Date: 2021-01-30 11:18:29
 * @LastEditTime: 2021-05-06 16:49:33
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \aiguo_erp_vue\src\components\Dialog\addbrand.vue
-->
<template>
<div class="bodydialog">
  <el-dialog
    :visible.sync="settleshow"
    :close-on-click-modal="false"
    width="450px"
    :before-close="handleClose"
  >
    <div style='width:100%;display:flex;flex-direction:column;'>
       <div style="display:flex;flex-direction:column;align-items:center;justify-content:center;">
            <i class="el-icon-success" style="color:#7ed321;font-size: 45px;"></i>
            <span style="font-weight: bold;font-size:20px">结算成功</span>
       </div>
        <h3 style="color:#d0021b;text-align:center">{{settleform.moneytext}}</h3>
        <el-row>
            <el-col :span="24">
              <div class="items">
                <span>用户:</span>
                <span>{{settleform.user_info}}</span>
              </div>
            </el-col>
            <el-col :span="24">
              <div class="items">
                <span>支付方式:</span>
                <span>{{settleform.zftext}}( {{settleform.zfzh}})</span>
              </div>
            </el-col>
            <el-col :span="24">
              <div class="items">
                <span>核销金额:</span>
                <span>{{settleform.amount}}</span>
              </div>
            </el-col>
            <el-col :span="24">
              <div class="items">
                <span>优惠金额:</span>
                <span>{{settleform.discount_amount ? '-'+settleform.discount_amount :'/'}}</span>
              </div>
            </el-col>
            <el-col :span="24">
              <div class="items">
                <span>手续费:</span>
                <span>{{settleform.poundage ? settleform.poundage :'/'}}</span>
              </div>
            </el-col>
            <el-col :span="24">
              <div class="items">
                <span>第三方交易号:</span>
                <span>{{settleform.pay_three_id}}</span>
              </div>
            </el-col>
        </el-row>
        <div class="items">
            <span style="font-size:18px">ERP交易流水号:</span>
            <el-row >
                <el-col v-for="(item,i) in settleform.zfdata" :key="i" >
                    {{item}}
                </el-col>
            </el-row>
        </div>
    </div>
    <span slot="footer" class="dialog-footer">
      <el-button size="small"  @click="handleClose">确 定</el-button
      >
    </span>
  </el-dialog>
</div>
</template>

<script>
export default {
  name: "settlementok",
  data() {
    return {
    };
  },
  props: {
    settleshow: {
      type: Boolean,
      default: () => {
        return false;
      },
    },
    settleform: {
      type: Object,
      default: () => {
        return {};
      },
    },
    Input: {
      type: Array,
      default: () => {
        return [];
      },
    },
    ruleForm: {
      type: Object,
      default: () => {
        return {};
      },
    },
    rules: {
      type: Object,
      default: () => {
        return {};
      },
    },
  },
  methods: {
    handleClose() {
      this.$emit("update:settleshow", false);
    },
    resetForm() {
      this.$emit("update:settleshow", false);
    },
  },
};
</script>

<style lang="scss" scoped>
.bodydialog ::v-deep  .el-dialog__footer{
    text-align: center;
}
.items{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom: 5px;
  span{
      font-size: 18px;
  }
}
</style>