|
@@ -0,0 +1,118 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="halfSon">
|
|
|
|
+ <!-- 搜索 -->
|
|
|
|
+ <div class="formSearch">
|
|
|
|
+ <el-form :inline="true" :model="formInline" class="demo-form-inline">
|
|
|
|
+ <el-form-item label="订单id">
|
|
|
|
+ <el-input maxlength="20" v-model="formInline.orderId" placeholder="请输入" />
|
|
|
|
+ </el-form-item>
|
|
|
|
+ <el-form-item>
|
|
|
|
+ <el-button type="primary" plain @click="searchOrder">查询</el-button>
|
|
|
|
+ <el-button type="info" plain @click="resetData">重置</el-button>
|
|
|
|
+ </el-form-item>
|
|
|
|
+ </el-form>
|
|
|
|
+ </div>
|
|
|
|
+ <!-- 表格 -->
|
|
|
|
+ <div class="tableBox">
|
|
|
|
+ <el-table ref="multipleTable" v-loading="tableLoading" :data="tableData" border stripe :header-cell-style="{ background: '#EEF3FF', color: '#333333' }"
|
|
|
|
+ tooltip-effect="dark" style="width: 100%">
|
|
|
|
+ <el-table-column prop="orderId" label="订单id" width="150">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column label="消息状态" width="250">
|
|
|
|
+ <template slot-scope="scope">
|
|
|
|
+ <span v-if="scope.row.code == -1">下单中</span>
|
|
|
|
+ <span v-if="scope.row.code == 1">下单成功</span>
|
|
|
|
+ <span v-if="scope.row.code == 2">已退款</span>
|
|
|
|
+ <span v-if="scope.row.code == -2">退款中</span>
|
|
|
|
+ </template>
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="msg" label="消息" width="250">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="systemErro" label="系统错误" width="250">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="createTime" label="订单创建时间" width="=300">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ <el-table-column prop="updateTime" label="订单更新时间" width="300">
|
|
|
|
+ </el-table-column>
|
|
|
|
+ </el-table>
|
|
|
|
+ <div class="fenye">
|
|
|
|
+ <el-pagination :current-page="formInline.page" :page-sizes="[10, 20, 50, 100]" :page-size="10"
|
|
|
|
+ layout="total, sizes, prev, pager, next, jumper" :total="total" @size-change="handleSizeChange"
|
|
|
|
+ @current-change="handleCurrentChange" />
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import { halfOrder } from "@/api/order"
|
|
|
|
+export default {
|
|
|
|
+ data() {
|
|
|
|
+ return {
|
|
|
|
+ tableData: [],
|
|
|
|
+ formInline:{
|
|
|
|
+ orderId:"",
|
|
|
|
+ page:1,
|
|
|
|
+ pageSize:10
|
|
|
|
+ },
|
|
|
|
+ total:0,
|
|
|
|
+ tableLoading:false
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ created(){
|
|
|
|
+ this.getHalfOrder()
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ // 请求数据的函数
|
|
|
|
+ async getHalfOrder(){
|
|
|
|
+ // 开始加载状态
|
|
|
|
+ this.tableLoading = true
|
|
|
|
+ let res = await halfOrder(this.formInline);
|
|
|
|
+ const { data } = res
|
|
|
|
+ this.tableData = data.records
|
|
|
|
+ this.total = data.records.length
|
|
|
|
+ this.tableLoading = false
|
|
|
|
+ },
|
|
|
|
+ // 条数的改变事件
|
|
|
|
+ handleSizeChange(val){
|
|
|
|
+ this.formInline.pageSize = val
|
|
|
|
+ this.getHalfOrder()
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ // 分页的点击事件
|
|
|
|
+ handleCurrentChange(val){
|
|
|
|
+ this.formInline.page = val
|
|
|
|
+ this.getHalfOrder()
|
|
|
|
+ },
|
|
|
|
+ // 查询订单
|
|
|
|
+ searchOrder(){
|
|
|
|
+ this.getHalfOrder()
|
|
|
|
+ },
|
|
|
|
+ // 重置订单
|
|
|
|
+ resetData(){
|
|
|
|
+ this.formInline.orderId = ""
|
|
|
|
+ this.getHalfOrder()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.halfSon {
|
|
|
|
+ padding: 30px 0 0 30px;
|
|
|
|
+
|
|
|
|
+ .formSearch {
|
|
|
|
+ margin-bottom: 30px;
|
|
|
|
+ }
|
|
|
|
+ .fenye{
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+ justify-content: center;
|
|
|
|
+ margin: 50px 0;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+::v-deep .el-table__cell{
|
|
|
|
+ text-align: center;
|
|
|
|
+}
|
|
|
|
+</style>
|