<template>
  <div class="refund-list-con">
    <!-- <Card>
      <div class="search-con">
        <Input
          placeholder="用户UID / 账号"
          class="search-input"
          v-model="searchContent.uid"
          style="width: 200px"
          clearable
        />
        <Input
          placeholder="订单编号"
          class="search-input"
          v-model="searchContent.oid"
          style="width: 200px"
          clearable
        />
        <Select
          placeholder="订单状态"
          class="search-input"
          v-model="searchContent.orderState"
        >
          <Option value>全部</Option>
          <Option
            v-for="(item, index) of RefundOrderState"
            :value="item"
            :key="'state-option-' + index"
            >{{ OrderStateObj[item].label }}</Option
          >
        </Select>
        <DatePicker
          placeholder="申请时间"
          v-model="createTime"
          type="daterange"
          placement="bottom-start"
          class="search-date"
          @on-change="handleDateChange(createTime)"
          :editable="false"
          separator=" ~ "
        ></DatePicker>
        <ButtonGroup class="search-btngroup">
          <Button @click="handleSearch" type="primary">搜索</Button>
          <Button type="primary" @click="handleRefresh">
            <Icon type="md-refresh" />
          </Button>
        </ButtonGroup>
      </div>
      <tables
        ref="tables"
        class="order-table-con"
        pagable
        v-model="tableData"
        :columns="columns"
        :currentPage="searchContent.pageNum"
        :pageSize="searchContent.pageSize"
        :totalSize="totalSize"
        :loading="loading"
        @on-change="handleCurrentChange"
      />
    </Card>

    <Modal
      v-model="refundModal"
      title="退款审核："
      :width="400"
      class-name="vertical-center-modal"
      @on-cancel="handleCancelRefund"
    >
      <Form
        ref="refundForm"
        :model="refundForm"
        :rules="refundRules"
        :label-width="90"
      >
        <FormItem label="退款原因：">
          <span>{{ refundForm.reason || "--" }}</span>
        </FormItem>
        <FormItem label="审核结果：" prop="type">
          <RadioGroup v-model="refundForm.type">
            <Radio label="1">
              <span>通 过</span>
            </Radio>
            <Radio label="0">
              <span>不通过</span>
            </Radio>
          </RadioGroup>
        </FormItem>
        <FormItem label="备注：">
          <Input
            placeholder="请输入..."
            v-model="refundForm.comm"
            type="textarea"
            :rows="6"
          />
        </FormItem>
      </Form>
      <div slot="footer">
        <Button
          @click="handleRefundSubmit"
          :loading="refundLoading"
          type="primary"
          long
          >确 定</Button
        >
      </div>
    </Modal> -->
  </div>
</template>

<script>
// import Tables from '_c/tables'
// import { formatTime } from '@/libs/tools'
// import { OrderState, OrderStateObj } from '@/enums'
// import OrderTableExpand from './order-table-expand'
// export default {
//   inject: ['reload'],
//   components: {
//     Tables,
//     OrderTableExpand
//   },
//   computed: {
//     isBrand () {
//       return this.$store.getters.isBrand
//     }
//   },
//   data () {
//     return {
//       OrderState,
//       OrderStateObj,
//       RefundOrderState: [
//         OrderState.APPLY_REFUND,
//         OrderState.UN_REFUND,
//         OrderState.REFUND_SUCCESS,
//         OrderState.REFUND_FAIL
//       ],
//       searchContent: {
//         oid: '',
//         uid: '',
//         orderState: '',
//         timeHead: '',
//         timeTail: '',
//         goodsName: '',
//         pageNum: 1,
//         pageSize: 10
//       },
//       createTime: [],
//       seriesList: [],

//       columns: [
//         {
//           type: 'expand',
//           width: 50,
//           render: (h, params) => {
//             return h(OrderTableExpand, {
//               props: {
//                 data: params.row.detail || []
//               }
//             })
//           }
//         },
//         { title: '订单编号', key: 'oid', minWidth: 200, align: 'center' },
//         { title: '用户UID', key: 'xlsId', width: 120, align: 'center' },
//         { title: '用户账号', key: 'account', width: 120, align: 'center' },
//         { title: '总价', key: 'total', width: 120, align: 'center' },
//         { title: '支付金额', key: 'payAmount', width: 120, align: 'center' },
//         {
//           title: '状态',
//           key: 'name',
//           align: 'center',
//           width: 150,
//           render: (h, params) => {
//             let obj = OrderStateObj[params.row.orderState]
//             return h(
//               'Tag',
//               {
//                 props: {
//                   color: obj.color
//                 }
//               },
//               obj.label
//             )
//           }
//         },
//         {
//           title: '申请时间',
//           align: 'center',
//           width: 180,
//           render: (h, params) => {
//             return h('span', formatTime(params.row.returnTime))
//           }
//         },
//         {
//           title: '操作',
//           key: 'name',
//           align: 'center',
//           width: 150,
//           render: (h, params) => {
//             let refundBtn = h(
//               'Button',
//               {
//                 props: {
//                   type: 'warning',
//                   size: 'small'
//                 },
//                 on: {
//                   click: this.handleRefund(params.row)
//                 }
//               },
//               '退款处理'
//             )
//             const emptySpan = h('span', '--')
//             return params.row.orderState == OrderState.APPLY_REFUND &&
//               this.isBrand
//               ? refundBtn
//               : emptySpan
//           }
//         }
//       ],
//       tableData: [],
//       totalSize: 0,
//       loading: true,

//       refundModal: false,
//       refundForm: {
//         oid: '',
//         reason: '',
//         type: '',
//         comm: ''
//       },
//       refundRules: {
//         type: { required: true, message: '不能为空！', trigger: 'change' }
//       },
//       refundLoading: false
//     }
//   },
//   methods: {
//     requestData () {
//       this.loading = true
//       this.api({
//         apiName: 'getRefundOrderList',
//         postdata: this.searchContent,
//         complete: () => {
//           this.loading = false
//         },
//         success: (res) => {
//           this.tableData = res.data.records
//           this.totalSize = res.data.total
//         }
//       })
//     },
//     handleSearch () {
//       this.searchContent.pageNum = 1
//       this.requestData()
//     },
//     handleRefresh () {
//       this.reload()
//     },
//     handleCurrentChange (pageNum) {
//       this.searchContent.pageNum = pageNum
//       this.requestData()
//     },
//     handleDateChange (createTime) {
//       if (
//         createTime &&
//         createTime.length == 2 &&
//         createTime[0] &&
//         createTime[1]
//       ) {
//         this.searchContent.timeHead = new Date(createTime[0]).getTime()
//         this.searchContent.timeTail =
//           new Date(createTime[1]).getTime() + 24 * 60 * 60 * 1000 - 1
//       } else {
//         this.searchContent.timeHead = ''
//         this.searchContent.timeTail = ''
//       }
//     },

//     handleRefund (row) {
//       return () => {
//         this.refundForm.oid = row.oid
//         this.refundForm.reason = row.returnReason
//         this.refundModal = true
//       }
//     },
//     handleRefundSubmit () {
//       this.$refs.refundForm.validate((valid) => {
//         if (valid) {
//           this.refundLoading = true
//           this.api({
//             apiName: 'orderRefund',
//             postdata: this.refundForm,
//             success: (res) => {
//               this.handleCancelRefund()
//               this.$Notice.success({ title: '审核成功！' })
//               this.requestData()
//             },
//             complete: () => {
//               this.refundLoading = false
//             }
//           })
//         }
//       })
//     },
//     handleCancelRefund () {
//       this.refundModal = false
//       this.$refs.refundForm.resetFields()
//       this.refundForm.reason = ''
//       this.refundForm.oid = ''
//       this.refundForm.type = ''
//       this.refundForm.comm = ''
//     }
//   },
//   created () {
//     if (!this.isBrand) {
//       this.columns.splice(2, 0, {
//         title: '品牌方',
//         key: 'brandName',
//         width: 150,
//         align: 'center'
//       })
//     }
//     this.requestData()
//   }
// }
// </script>

// <style lang="less">
// .refund-list-con .search-con {
//   padding: 10px 0;
//   .search {
//     &-col {
//       display: inline-block;
//       width: 150px;
//       margin-right: 5px;
//     }
//     &-input {
//       display: inline-block;
//       width: 150px;
//       margin-right: 5px;
//     }
//     &-date {
//       margin-right: 5px;
//     }
//     &-btngroup {
//       margin-right: 5px;
//     }
//   }
// }
// .refund-list-con .order-table-con {
//   .ivu-table-expanded-cell {
//     padding: 0 40px 10px 40px;
//   }
// }
// .vertical-center-modal {
//   display: flex;
//   align-items: center;
//   justify-content: center;

//   .ivu-modal {
//     top: 0;
//   }
// }
// </style>
