QueryOrder.vue 6.4 KB
<template>
    <section>
        <el-col :span="24" class="toolbar" style="padding-bottom: 0px">
                <el-form :inline="true" :model="formInline">
                    <el-form-item>
                        <el-input v-model="formInline.user" placeholder="用户编号"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <div class="block">
                            <el-date-picker
                                    v-model="formInline.date1"
                                    type="daterange"
                                    align="right"
                                    unlink-panels
                                    value-format="yyyy-MM-dd"
                                    range-separator="至"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期"
                                    :picker-options="pickerOptions">
                            </el-date-picker>
                        </div>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" v-on:click="QueryOrder()">查询</el-button>
                    </el-form-item>
                </el-form>
        </el-col>
        <el-table
                :data="tableData"
                stripe
                style="width: 100%">
            <el-table-column
                    prop="ordernumber"
                    label="订单号"
                    width="150">
            </el-table-column>
            <el-table-column
                    prop="payuserid"
                    label="用户编号"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="payusername"
                    label="用户名称"
                    width="90">
            </el-table-column>
            <el-table-column
                    prop="paylocationname"
                    label="房间号码"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="paytime"
                    label="充值日期"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="payType"
                    label="充值类型">
            </el-table-column>
            <el-table-column
                    prop="payFees"
                    label="充值金额"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="payfees"
                    label="支付方式"
                    width="100">
            </el-table-column>
            <el-table-column
                    prop="payStatus"
                    label="支付状态"
                    width="100">
            </el-table-column>
            <el-table-column
                    fixed="right"
                    label="操作"
                    width="180">
                <template slot-scope="scope">
                    <el-button @click="Pay(scope.row)" type="primary" size="mini">去完成</el-button>
                    <el-button type="text" size="small">移除订单</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--工具条-->
        <el-col :span="24" class="toolbar">
            <!--<el-button type="danger" @click="batchRemove" :disabled="this.sels.length===0">批量删除</el-button>-->
            <el-pagination layout="total, prev, pager, next" @current-change="handleCurrentChange" :page-size="5" :total="total" style="float:right;">
            </el-pagination>
        </el-col>

     </section>
</template>
<script>
    import { getOrder,addOrder,ediOrder,delOrder} from '../../api/empt/PayOrder';
    export default {
        data() {
            return {
                total: 0,
                pageNum: 1,
                pageSize: 5,

                pickerOptions: {
                    shortcuts: [{
                        text: '最近一周',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近一个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近三个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                            picker.$emit('pick', [start, end]);
                        }
                    }]},
                formInline: {
                    user: '',
                    date1:'',

                },
                tableData: [],
            }
        },
        mounted() {
            this.QueryOrder();
        },
        methods: {
            handleCurrentChange(val) {
                this.pageNum = val;
            },
            QueryOrder(){
                let params = {
                    pageNum: this.pageNum,
                    pageSize: this.pageSize,
                };
                getOrder(params).then(res=>{
                    let resData = res.data;
                    this.total = resData.total;
                    this.tableData = resData.list;
                }).catch((error) => {
                    if(null!= error.response && error.response!==undefined){
                        let status= error.response.status;
                        let msg = error.response.statusText;
                        alert(status+msg);
                    }else {
                        alert(error);
                    }
                })
            },
            Pay(row){
                this.$router.push({name:'缴水电费订单',params:{row,Edistatus:'update'}})
            },
        },

    }
</script>