great_webui/src/views/order/groupBuyingMr/dialog/childOrder.vue

<!--
 * @Description: 新增/编辑弹框
-->
<template>
  <el-dialog
    :title="subTitle"
    v-if="isShow"
    :visible.sync="isShow"
    width="90%"
    append-to-body
    :close-on-click-modal="false"
    @close="cancel"
  >
    <div class="dialog">
      <!-- 表格 -->
      <el-button class="addBtn" type="primary" v-if="orderList.length < 3" @click="addChildOrder">添加子订单</el-button>
      <div class="app-container-table-info">
        <el-table ref="tables" v-loading="isLoading" height="500px" :data="orderList" border>
          <el-table-column label="序号" align="center" type="index" width="60"></el-table-column>
          <el-table-column label="订单号" align="center" prop="id" width="170" />
          <el-table-column label="票档" align="center" prop="seatTypeName" />
          <el-table-column label="团购数量" align="center" prop="quantity" />
          <el-table-column label="应收金额" align="center" prop="orderPrice">
            <template slot-scope="scope">
              <span>￥{{ scope.row.orderPrice }}</span>
            </template>
          </el-table-column>
          <el-table-column label="实收金额" align="center" prop="realPrice">
            <template slot-scope="scope">
              <span v-if="scope.row.status != 0">￥{{ scope.row.realPrice }}</span>
            </template>
          </el-table-column>
          <el-table-column label="支付方式" align="center" prop="type">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.pay_way_type" :value="scope.row.payWay"/>
            </template>
          </el-table-column>
          <el-table-column label="支付时间" align="center" prop="payTime" width="160" >
            <template slot-scope="scope">
              <span>{{ parseTime(scope.row.payTime) }}</span>
            </template>
          </el-table-column>
          <el-table-column label="支付单号" align="center" prop="paymentId" />
          <el-table-column label="订单状态" align="center" prop="status">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.order_status_type" :value="scope.row.status"/>
            </template>
          </el-table-column>
          <el-table-column label="商户退款单号" align="center" prop="refundPaymentId" />
          <el-table-column label="已核销票数" align="center" prop="usedTotal">
            <template slot-scope="scope">
              <span>{{ scope.row.usedTotal }}</span>
            </template>
          </el-table-column>
          <el-table-column label="已核销金额" align="center" prop="usedPriceTotal">
            <template slot-scope="scope">
              <span>{{ scope.row.usedPriceTotal }}</span>
            </template>
          </el-table-column>
          <el-table-column label="退票数量" align="center" prop="refundTotal">
            <template slot-scope="scope">
              <span>{{ scope.row.refundTotal }}</span>
            </template>
          </el-table-column>
          <el-table-column label="退票金额" align="center" prop="refundPriceTotal">
            <template slot-scope="scope">
              <span>{{ scope.row.refundPriceTotal && scope.row.refundPriceTotal !=0 ?('-' + scope.row.refundPriceTotal) : '' }}</span>
            </template>
          </el-table-column>
          <el-table-column label="是否成功开票" align="center">
            <template slot-scope="scope">
              <el-tag type="danger" v-if="scope.row.ifSuccessInvoice  == '0'">否</el-tag>
              <el-tag type="success" v-else-if="scope.row.ifSuccessInvoice  == '1'">是</el-tag>
            </template>
          </el-table-column>
          <el-table-column label="开票时间" align="center" prop="invoiceTime">
            <template slot-scope="scope">
              <span>{{ scope.row.invoiceTime }}</span>
            </template>
          </el-table-column>
          <el-table-column label="是否其他团队代付" align="center" prop="ifRepay">
            <template slot-scope="scope">
              <el-tag type="danger" v-if="scope.row.ifRepay  == '0'">否</el-tag>
              <el-tag type="success" v-else-if="scope.row.ifRepay  == '1'">是</el-tag>
              <span v-else></span>
            </template>
          </el-table-column>
          <el-table-column label="操作" align="center" fixed="right" width="180px" class-name="small-padding fixed-width">
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                @click="openDetails(scope.row,'normal')"
                v-hasPermi="['groupBuyingMr:groupBuyingMr:details']"
              >详情</el-button>
              <el-button size="mini" type="text" v-if="scope.row.status === 0" @click="payOrder(scope.row)">代客下单</el-button>
              <el-button size="mini" type="text" v-if="scope.row.status == 3 || scope.row.status == 7" @click="handleOpenPrint(scope.row)">打印小票</el-button>
              <el-button size="mini" type="text" v-if="scope.row.status == 3 || scope.row.status == 7" @click="handlePayOrCredit(scope.row)">修改凭证</el-button>
              <el-button size="mini" type="text" v-if="scope.row.status == 7" @click="handleInvoicing(scope.row)">开具发票</el-button>
              <el-button size="mini" type="text" v-if="scope.row.status === 0" @click="closedOrder(scope.row)">关闭订单</el-button>
            </template>
          </el-table-column>
        </el-table>

        <!-- <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"
        /> -->
      </div>
      
    </div>
  </el-dialog>
</template>

<script>
import { 
  pageList,
} from '@/api/order/groupBuyingMr';
import { orderInfoCancel } from '@/api/windowTicketSales/ticketingSales';

export default {
  name: "ChildOrder",
  dicts: ['order_status_type','pay_way_type'],
  data() {
    return {
      model: "ORDER",
      isShow: false,
      loading: false,
      isLoading: false,
      subTitle: "子订单信息",
      orderList: [],
      orderInfo: {}
      
    };
  },
  methods: {
    // 打开弹框
    openDialog(title, obj, type) {
      this.isShow = true;
      this.subTitle = title;
      this.orderInfo = obj;
      this.getChildOrderApi(obj);
    },
    /** 获取子订单 */
    getChildOrderApi(row) {
      this.loading = true;
      let params = {
        masterOrderId: row.id,
        pageNum: 1,
        pageSize: 100,
      };
      pageList(params).then(response => {
        this.orderList = response.data.rows;
        this.isLoading = false;
      }).catch(()=>{
        this.orderList = [];
        this.isLoading = false;
      })
    },
    // 添加子订单
    addChildOrder() {
      this.$emit('addChild', this.orderInfo)
      this.isShow = false;
    },
    // 查看子订单详情
    openDetails(row) {
      this.$emit('orderInfo', row)
      this.isShow = false;
    },
    // 代课下单
    payOrder(row) {
      this.$emit('payOrder', row)
      this.isShow = false;
    },
    // 修改凭证
    handlePayOrCredit(row) {
      this.$emit('handPayOrCredit', row)
      this.isShow = false;
    },
    // 打印小票
    handleOpenPrint(row) {
      this.$emit('handleOpen', [row])
      this.isShow = false;
    },
    // 开具发票
    handleInvoicing(row) {
      this.$emit('handleInvoicing', row)
      this.isShow = false;
    },
    // 关闭订单
    closedOrder(row) {
      this.$confirm("是否关闭" + row.id + "的订单?", '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        orderInfoCancel({ orderId: row.id}).then((res) => {
          if (res.code == 200) {
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.getList();
          }
        });
      }).catch(() => {});

    },
    // 关闭弹框
    cancel() {
      this.isShow = false;
    },
    
    
  },
};
</script>

<style lang="scss" scoped>
.dialog {
  padding: 0 10px;
  max-height: 85vh;
  overflow-y: auto;
  .addBtn {
    float: right;
    margin: 10px 0;
  }
}

</style>