123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187 |
- <template>
- <a-card :bordered="false">
- <!-- 搜索条件 -->
- <div class="orderCenter-searchForm">
- <a-form layout="inline" ref="searchForm">
- <a-row :gutter="48">
- <a-col :span="8">
- <a-form-item label="创建时间">
- <a-range-picker v-model="time" :placeholder="['开始时间','结束时间']" @change="onChange" />
- </a-form-item>
- </a-col>
- <a-col :span="6">
- <a-form-item label="关联订单号">
- <a-input v-model.trim="searchForm.num" placeholder="请输入" allowClear style="width: 200px;" />
- </a-form-item>
- </a-col>
- <a-col :span="6">
- <a-form-item label="网点名称">
- <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;"></v-select>
- </a-form-item>
- </a-col>
- <a-col :span="4">
- <a-button style="margin-right: 10px;" type="primary" @click="$refs.table.refresh(true)">查询</a-button>
- <a-button type="" @click="resetForm">重置</a-button>
- </a-col>
- </a-row>
- <a-row :gutter="48">
- <a-col :span="8">
- <a-form-item label="服务项目">
- <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;"></v-select>
- </a-form-item>
- </a-col>
- <a-col :span="6">
- <a-form-item label="退款状态">
- <v-select v-model="searchForm.name" placeholder="请选择" allowClear style="width: 200px;"></v-select>
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- </div>
- <!-- 合计 -->
- <div class="total">
- <a-alert message="合计: 40单, 实收: 2000元" type="info" show-icon />
- </div>
- <!-- 列表 -->
- <s-table ref="table" size="default" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered>
- <!-- 退款状态 -->
- <span slot="status" slot-scope="text, record">
- <template></template>
- </span>
- </s-table>
- </a-card>
- </template>
- <script>
- import {
- STable,
- VSelect
- } from '@/components'
- export default {
- components: {
- STable,
- VSelect
- },
- data() {
- return {
- // 查询参数
- searchForm: {
- beginDate: null,
- endDate: null,
- name: '',
- num: ''
- },
- time: null,
- columns: [{
- title: '创建时间',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center'
- },
- {
- title: '交易流水号',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center'
- },
- {
- title: '关联订单号',
- dataIndex: 'createTime',
- width: '100',
- align: 'center'
- },
- {
- title: '网点名称',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center'
- },
- {
- title: '退款项目',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center'
- },
- {
- title: '退款金额(¥)',
- dataIndex: 'createTime',
- minWidth: '40',
- align: 'center'
- },
- {
- title: '退款人',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center'
- },
- {
- title: '退款状态',
- dataIndex: 'createTime',
- minWidth: '100',
- align: 'center',
- scopedSlots: {
- customRender: 'status'
- }
- },
- {
- title: '备注',
- dataIndex: 'status',
- minWidth: '100',
- align: 'center',
- },
- ],
- // 加载数据方法 必须为 Promise 对象
- loadData: parameter => {
- // return getTenantsList(Object.assign(parameter, this.searchForm)).then(res => {
- // if (res.status == 200) {
- // const no = (res.data.pageNo - 1) * res.data.pageSize
- // for (let i = 0; i < res.data.list.length; i++) {
- // const _item = res.data.list[i]
- // _item.no = no + i + 1
- // _item.status = _item.status + '' === '1'
- // }
- // return res.data
- // }
- // })
- }
- }
- },
- methods: {
- // 创建时间change
- onChange(dates, dateStrings) {
- if ((dates, dateStrings)) {
- this.searchForm.beginDate = dateStrings[0]
- this.searchForm.endDate = dateStrings[1]
- }
- console.log(this.searchForm.beginDate, this.searchForm.endDate)
- },
- // 重置
- resetForm() {
- this.$refs.searchForm.resetFields()
- this.$refs.table.refresh(true)
- },
- },
- }
- </script>
- <style>
- .orderCenter-searchForm,
- .addButton {
- margin-bottom: 0;
- }
- .orderCenter-searchForm .ant-form-inline .ant-form-item {
- margin-bottom: 15px;
- }
- .total {
- margin-bottom: 15px;
- }
- </style>
|