<template>
    <div class="app-container">
        <el-form
            :model="queryParams"
            ref="queryForm"
            :inline="true"
            v-show="showSearch"
        >
            <el-form-item label="订单编号"  label-position="right" label-width="145px" prop="orderIndex">
                <el-input
                    v-model="queryParams.orderIndex"
                    placeholder="请输入订单编号"
                    clearable
                    size="small"
                    maxlength="30"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="商家编号"
                label-position="right" label-width="145px"
                prop="merchantIndex"

            >
                <el-input
                    v-model="queryParams.merchantIndex"
                    placeholder="请输入商家编号"
                    clearable
                    size="small"
                    maxlength="30"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="服务主题"
                label-position="right" label-width="145px"
                prop="goodsName"

            >
                <el-input
                    v-model="queryParams.goodsName"
                    placeholder="请输入服务主题"
                    clearable
                    size="small"
                    maxlength="20"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="服务类型"
                label-position="right" label-width="145px"
                prop="categoryId"

            >
                <el-cascader
                    v-model="queryParams.categoryId"
                    :options="categoryList"
                    :props="optionProps"
                    size="small"
                    clearable
                ></el-cascader>
            </el-form-item>
            <el-form-item label="服务人员手机号"  label-position="right" label-width="145px" prop="serverId">
                <el-input
                    v-model="queryParams.serverPhone"
                    placeholder="请输入服务人员手机号"
                    clearable
                    maxlength="11"
                    size="small"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="服务人员姓名"
                label-position="right"
                label-width="145px"
                prop="serverName"

            >
                <el-input
                    v-model="queryParams.serverName"
                    placeholder="请输入服务人员姓名"
                    clearable
                    size="small"
                    maxlength="10"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="店铺名称"
                label-position="right"
                label-width="145px"
                prop="merchantName"

            >
                <el-input
                    v-model="queryParams.merchantName"
                    placeholder="请输入店铺名称"
                    clearable
                    size="small"
                    maxlength="20"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item label="顾客手机号"
            label-position="right"
            label-width="145px"
             prop="serverId">
                <el-input
                    v-model="queryParams.memberPhone"
                    placeholder="请输入顾客手机号"
                    clearable
                    size="small"
                    maxlength="11"
                    @keyup.enter.native="handleQuery"
                />
            </el-form-item>
            <el-form-item
                label="服务类型主体"
                label-position="right" label-width="145px"
                prop="merchantType"

            >
                <el-select
                    v-model="queryParams.merchantType"
                    placeholder="请选择"
                    clearable
                    size="small"
                    @keyup.enter.native="handleQuery"
                >
                    <el-option label="全部" value=""></el-option>
                    <el-option label="商家" value="0"></el-option>
                    <!-- <el-option label="个体" value="1"></el-option> -->
                </el-select>
            </el-form-item>
            <el-form-item
                label="是否追加服务"
                label-position="right" label-width="145px"
                prop="homeAdd"

            >
                <el-select v-model="queryParams.homeAdd">
                    <el-option
                        v-for="item in addStatusOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    >
                    </el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="状态" label-position="right" label-width="145px">
                <el-select
                    v-model="queryParams.orderState"
                    placeholder="请选择"
                    size="small"
                    @keyup.enter.native="handleQuery"
                >
                    <el-option
                        v-for="item in statusList"
                        :key="item.decodeValue"
                        :label="item.decodeValue"
                        :value="item.decodeId"
                    >
                    </el-option>
                </el-select>
                <!-- <el-select
                    v-model="queryParams.status"
                    placeholder="请选择"
                    clearable
                    size="small"
                    @keyup.enter.native="handleQuery"
                >
                    <el-option label="全部" value=""></el-option>
                    <template >
                        <el-option
                            v-for="status in statusList"
                            :key="status.decodeValue"
                            :label="status.decodeValue"
                            :value="status.decodeId"
                        ></el-option>
                    </template>
                </el-select> -->
            </el-form-item>
            <el-form-item label="下单日期" label-position="right" label-width="145px">
                <el-date-picker
                    v-model="searchDate"
                    type="daterange"
                    value-format="yyyy-MM-dd HH:mm:ss"
                    align="left"
                    unlink-panels
                    range-separator="至"
                    start-placeholder="开始日期"
                    end-placeholder="结束日期"
                    clearable
                    size="small"
                    style="width: 220px;x"
                    :default-time="['00:00:00', '23:59:59']"
                >
                </el-date-picker>
            </el-form-item>

            <el-form-item>
                <el-button
                    type="primary"
                    size="small"
                    icon="el-icon-search"
                    @click="handleQuery"
                    plain
                    >搜索</el-button
                >
                <el-button
                    icon="el-icon-refresh"
                    size="small"
                    @click="resetQuery"
                    >重置</el-button
                >
            </el-form-item>
        </el-form>

        <el-table v-loading="loading" :data="dataList" border stripe>
            <!-- <el-table-column label="序号" align="center" type="index" /> -->
            <el-table-column
                label="订单编号"
                align="center"
                prop="orderIndex"
                width="180"
                show-overflow-tooltip
            />
            <el-table-column
                label="商家编号"
                align="center"
                prop="merchantIndex"
                width="180"
                show-overflow-tooltip
            />
            <el-table-column
                label="店铺名称"
                align="center"
                prop="merchantNameJoin"
                width="150"
                show-overflow-tooltip
            />
            <el-table-column
                label="服务编号"
                align="center"
                prop="goodsIndex"
                width="180px"
                show-overflow-tooltip
            />
            <el-table-column
                label="服务主题"
                align="center"
                prop="goodsName"
                width="80px"
                show-overflow-tooltip
            />
            <el-table-column
                label="服务类型"
                align="center"
                prop="categoryName"
                width="80px"
            />
            <el-table-column
                label="单价"
                align="center"
                prop="goodsServerPrice"
                width="100"
            />
            <el-table-column
                label="数量"
                align="center"
                prop="goodsCounts"
                width="100"
            />
            <el-table-column
                label="订单金额"
                align="center"
                prop="orderAmount"
                width="100"
            />
            <el-table-column
                label="支付金额"
                align="center"
                prop="totalAmount"
                width="100"
            />
            <el-table-column
                label="服务人员手机号"
                align="center"
                prop="serverPhone"
                width="120"
                show-overflow-tooltip
            />
            <el-table-column
                label="服务人员姓名"
                align="center"
                prop="serverName"
                width="100"
                show-overflow-tooltip
            />
            <el-table-column
                label="顾客手机号"
                align="center"
                prop="memberPhone"
                width="110"
                show-overflow-tooltip
            />
            <el-table-column
                label="上门时间"
                align="center"
                prop="appointmentStartTime"
                width="160"
                show-overflow-tooltip
            >
                <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.appointmentStartTime) }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="下单时间"
                align="center"
                prop="createTime"
                width="160"
            >
                <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.createTime) }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="服务主体类型"
                align="center"
                prop="merchantType"
            >
                <template slot-scope="scope">
                    <span v-if="scope.row.merchantType == '0'">商家</span>
                    <span v-if="scope.row.merchantType == '1'">个人</span>
                </template>
            </el-table-column>
            <el-table-column
                label="是否追加服务"
                align="center"
                prop="addAmount"
            >
                <template slot-scope="scope">
                    <span v-if="scope.row.addAmount == null">否</span>
                    <span v-else>是</span>
                </template>
            </el-table-column>

            <el-table-column
                label="状态"
                align="center"
                prop="statusName"
                width="120"
            >

            <template slot-scope="scope" style="max">
                <el-tag type="danger" v-if="scope.row.orderState=='099'">{{scope.row.statusName}}</el-tag>
                <el-tag type="success" v-if="scope.row.orderState=='000'">{{scope.row.statusName}}</el-tag>
                <el-tag type="primary" v-if="scope.row.orderState=='001'">{{scope.row.statusName}}</el-tag>
                <el-tag type="warning" v-if="scope.row.orderState=='002'">{{scope.row.statusName}}</el-tag>
                 <el-tag type="warning" v-if="scope.row.orderState=='003'">{{scope.row.statusName}}</el-tag>
                <el-tag type="success" v-if="scope.row.orderState=='004'">{{scope.row.statusName}}</el-tag>
                <el-tag type="danger" v-if="scope.row.orderState=='005'">{{scope.row.statusName}}</el-tag>
                <el-tag type="danger" v-if="scope.row.orderState=='006'">{{scope.row.statusName}}</el-tag>
                <el-tag type="info" v-if="scope.row.orderState=='007'">{{scope.row.statusName}}</el-tag>
            </template>
            </el-table-column>

            <el-table-column
                label="操作"
                align="center"
                width="220"
                fixed="right"
            >
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-view"
                        @click="tosee(scope.row)"
                        v-hasPermi="['shop:audit:audit']"
                        >查看详情
                    </el-button>
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-circle-check"
                        @click="doRefund(scope.row)"
                        v-hasPermi="['shop:audit:audit']"
                        v-if="scope.row.orderState == '005' && scope.row.status =='001'"
                        >审核退款
                    </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"
        />

        <!-- 审核退款原因对话框 -->
        <el-dialog
            :title="title"
            :visible.sync="open"
            width="600px"
            append-to-body
        >
            <el-form ref="form" :model="form" label-width="120px">
                <el-form-item label="申请退款金额">
                    <div>{{ form.payMoney }}元</div>
                </el-form-item>
                <el-form-item label="申请退款原因">
                    <div>{{ form.refundReason }}</div>
                </el-form-item>
                <el-divider></el-divider>
                <el-form-item label="审核结果">
                    <el-radio v-model="form.status" label="004"
                        >同意退款</el-radio
                    >
                    <el-radio v-model="form.status" label="003"
                        >拒绝退款</el-radio
                    >
                </el-form-item>
                <el-form-item label="审核退款金额" v-if="form.status == '004'">
                    <el-input-number
                        v-model="form.refundMoney"
                        :min=0
                        :max=999999.99
                        maxlength="9" 
                        @keyup.native="clearNoNum"
                        clearable
                        placeholder="可填写的最大数值为999999.99"
                    >
                        <template slot="append">元</template>
                    </el-input-number>
                </el-form-item>
                <el-form-item label="审核结果描述">
                    <el-input
                        type="textarea"
                        :rows="3"
                        maxlength="100" 
                        show-word-limit
                        v-model="form.refundResult"
                        placeholder="请输入审核结果描述"
                    />
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitForm">确 定</el-button>
                <el-button @click="cancel">取 消</el-button>
            </div>
        </el-dialog>

    <el-dialog
            title="家政订单详情"
            :visible.sync="orderOpen"
            width="950px"
            :close-on-click-modal="false"
            :modal-append-to-body="false"
        >

        <div style="width: 900px; margin: 0 auto; word-spacing: 2em">
    <el-row :gutter="20">
      <el-col :span="24">
        <el-card style="margin-top: 10px">
          <el-row :gutter="10" type="flex">
            <el-col :span="8">
              <!-- <span
                >订单状态
                {{
                  dict["003"] &&
                  dict["003"].filter(
                    ({ value }) => value === order.orderState
                  )[0].label
                }}
                </span> -->
                <span>订单状态  </span><span style="letter-spacing: normal; color: #333333;line-height: normal; font-weight: 700;">{{order.refStatus}}</span>
            </el-col>
            <el-col :span="16" style="cursor: pointer">
              <span style="color: rgb(64, 158, 255);" @click="seeOrderStatus()">订单跟踪></span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

      <el-col :span="24">
        <el-card>
          <el-row :gutter="10" type="flex">
               <el-col :span="3">服务主题</el-col>
            <el-col :span="21" style="margin-bottom: 20px">

              <!-- <span @click="toServerProject">{{order.gname}}></span> -->
              <span class="span-detailed-info" >{{ order.goodsName }}</span>
            </el-col>
             </el-row>
             <el-row>
            <el-col :span="3" css="span-label">预约的服务人员</el-col>
            <el-col :span="3">
              <span class="span-color-size">{{ order.serverName }}</span>
            </el-col>
            <el-col :span="4">
              <span class="span-color-size">{{ order.serverPhone }}</span>
            </el-col>
            <el-col :span="4">
              <el-tag type="info" effect="dark" size="medium">{{ this.serverUser.serverLevel }}</el-tag>
            </el-col>
            <el-col :span="4">
              <el-tag type="info" effect="dark" size="medium">{{ this.serverUser.serverAge }}年工龄</el-tag>
            </el-col>
             <el-col :span="4">
                <span css="span-label">好评率 </span><span class="span-color" >{{ this.serverUser.rate }}</span>
            </el-col>
             </el-row>
        </el-card>
      </el-col>

      <el-col :span="24">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="24" style="margin-bottom: 20px">
              <span css="span-label">上门时间 </span><span class="span-color-size" > {{ order.appointmentStartTime }}</span>
            </el-col>

            <el-col :span="12">
              <span css="span-label">顾客信息 </span><span class="span-color-size">{{ member.name }} {{ member.phone }}</span>
            </el-col>
            <el-col :span="12">
              <span class="span-color-size"
                ><i class="el-icon-location-information" />{{ member.address
                }}{{ member.detailed }}</span
              >
            </el-col>
            <el-col :span="24" style="margin-top: 20px">
              <span css="span-label">备注</span><span class="span-color-size"> {{ order.memo }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

      <el-col :span="24">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="12">
              <span>订单编号 </span><span  class="span-detailed-info">{{ order.orderIndex }} </span>
              <el-button
                size="mini"
                class="orderIndex"
                :data-clipboard-text="order.orderIndex"
                >复制</el-button
              >
            </el-col>

            <el-col :span="12" style="margin-bottom: 20px">
              <span>下单时间 </span><span class="span-detailed-info">{{ order.createTime }}</span>
            </el-col>

            <el-col :span="12">
              <span >服务类别 </span><span  class="span-detailed-info">{{order.parentName == null?"":order.parentName+"—"}}{{ order.categoryName }}</span>
            </el-col>
            <el-col :span="12" style="margin-bottom: 20px">
              <span>数量 </span><span  class="span-detailed-info">{{ order.goodsCounts }}{{ order.otherUnit }}</span>
            </el-col>

            <el-col :span="12">
              <span>服务单价 </span><span class="span-color" >{{ order.price }}</span><span  class="span-detailed-info">元/{{ order.otherUnit }}</span>
            </el-col>
            <el-col :span="12">
              <span>订单金额 </span><span class="span-color" >￥{{ order.orderAmount }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

      <el-col :span="24" v-if="order.beanAmount">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="24">
              <span>优金豆 </span><span style="color: #D9001B;">-￥{{ order.beanAmount/100 }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>
       <el-col :span="24" v-if="order.couponAmount">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="24">
              <span>优惠券 </span><span style="color: #D9001B;">-￥{{ order.couponAmount }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>
      <el-col :span="24" v-if="order.addCount > 0">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="24" style="margin-bottom: 20px">
              <span class="span-detailed-info"> <b>追加服务 </b></span>
            </el-col>
            <el-col :span="12">
              <span>追加数量</span><span class="span-detailed-info"> {{ order.addCount }}{{ order.otherUnit }}</span>
            </el-col>
            <el-col :span="12">
              <span>金额  </span><span class="span-color" >￥{{ order.addAmount }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

        <el-col
        :span="24"
        v-if="
          order.maintenanceAmount != null &&
          order.maintenanceAmount != '' &&
          order.maintenanceAmount != undefined
        "
      >
        <el-card>
          <el-row :gutter="10">
            <el-col :span="12">
              <span>收取维修/配件费 </span>
            </el-col>

            <el-col :span="12" style="margin-bottom: 20px">
              <span>收取金额 {{ order.maintenanceAmount }}元</span>
            </el-col>
            <el-col :span="12">
              <span>费用说明 {{ order.maintenanceRemark }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

      <el-col>
        <el-card
          :span="24"
          style="background-color: rgb(127, 127, 127); color: white"
        >
          <el-row :gutter="10">
            <el-col :span="12">
              <span
                >服务数量
                {{
                  parseInt(order.addCount) + parseInt(order.goodsCounts)
                }}{{ order.otherUnit }}</span
              >
            </el-col>

            <el-col :span="12">
              <span>订单实付 ￥{{ order.totalAmount }}</span>
            </el-col>
          </el-row>
        </el-card>
      </el-col>

      <el-col
        :span="24"
         v-if="refundOpen">
        <el-card>
          <el-row :gutter="10">
            <el-col :span="24" style="margin-bottom: 20px">
              <span class="span-detailed-info"> <b>退款信息 </b></span>
            </el-col>
            <el-col :span="12" style="margin-bottom: 10px">
              <span>退款金额</span><span class="span-detailed-info"> {{ refund === undefined ? "" : refund.payMoney }}元</span>
            </el-col>
            <!-- <el-col :span="12" style="margin-bottom: 20px">
              <span
                >退款原因
                {{ refund === undefined ? "" : refund.refundReason }}</span
              >
            </el-col>
            <el-col :span="12">
              <span
                >审核结果
                {{ refund === undefined ? "" : refund.refundResult }}</span
              >
            </el-col> -->
        </el-row>
        <el-row :gutter="10" style="margin-bottom: 10px">
            <el-col :span="24">
              <span>退款原因</span><span class="span-detailed-info">  {{ refund === undefined ? "" : refund.refundReason }}</span>
            </el-col>
        </el-row>
        <el-row :gutter="10">
            <el-col :span="24">
              <span>审核结果</span><span class="span-detailed-info">  {{ refund === undefined ? "" : refund.refundResult }}</span>
            </el-col>
        </el-row>
        </el-card>
      </el-col>


    </el-row>

    <!--订单跟踪-->
    <el-dialog title="订单跟踪" :visible.sync="recordOpen" width="600px" :modal-append-to-body="true" :append-to-body="true">
      <ul>
        <li :key="item.id" v-for="item in orderRecord">
          <el-row>
            <el-col :span="12">
               {{item.operateInfo}}
              <!-- {{ checkCode(item) }} -->
            </el-col>

            <el-col :span="12">
              {{ item.createTime }}
            </el-col>
          </el-row>

          <el-divider></el-divider>
        </li>
      </ul>
    </el-dialog>
  </div>
    </el-dialog>

    </div>
</template>

<script>
import { orderList, getRefundInfo, doRefund } from "@/api/order/adminOrder";
import { categoryTree } from "@/api/basic/category";
import { getCodeList } from "@/api/basic/code";
import { getOrder, getAddress } from "@/api/system/order";
import { getUser } from "../../../api/system/ServiceUserService";
import { listCode } from "../../../api/system/dict/code";
import { listRecord } from "../../../api/system/orderRecord";
import { listRefund } from "../../../api/system/orderRefund";
import { mapGetters } from "vuex";
import ClipboardJS from "clipboard";

export default {
    name: "adminMember",
    data() {
        return {
            refundOpen: false,
            order: {},
            activeNames: ["1"],
            imgSrc: "",
            goodsList: [],
            member: {},
            serverUser: {},
            recordOpen: false,
            orderRecord: [],
            refStatusOptions: [],
            refund: {},
            clipboard: null,
            showSearch: true,
            loading: true,
            total: 0,
            dataList: [],
            //订单详情
            orderOpen:false,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                beginTime: "",
                endTime: "",
                merchantId: "",
                merchantIndex: "",
                merchantName: "",
                goodsId: "",
                goodsName: "",
                name: "",
                serverPhone: "",
                memberPhone: "",
                categoryId: [],
                merchantType: "",
                orderType: "",
                isAdd: "",
                status: "",
            },
            form: {},
            // 弹出层标题
            title: "",
            open: false,

            searchDate: [],
            categoryList: [],
            statusList: [],
            optionProps: {
                value: "categoryId",
                label: "categoryName",
                children: "childrenCategory",
            },
            //追加服务选择框
            addStatusOptions: [
                {
                    label: "全部",
                    value: "",
                },
                {
                    label: "是",
                    value: "1",
                },
                {
                    label: "否",
                    value: "0",
                },
            ],
        };
    },
      computed: {
    ...mapGetters(["dict"]),
  },
    mounted() {
        this.clipboard = new ClipboardJS(".orderIndex");
        this.clipboard.on("success", (e) => {
        this.$message.success("复制成功");
      e.clearSelection();
    });
    },
     destroyed() {
    // 销毁Clipboard实例，避免在其它页面或组件中实例化Clipboard后造成再次监听，产生重复回调
    this.clipboard.destroy();
  },
    created() {

        if (this.$route.query.pageNum) {
            console.log(this.queryParams.pageNum)
            this.queryParams.pageNum = parseInt(this.$route.query.pageNum)
            console.log(this.queryParams.pageNum)
         }

        if (this.$route.query.orderIndex) {
            this.queryParams.orderIndex = this.$route.query.orderIndex
        }

        if (this.$route.query.merchantIndex) {
            this.queryParams.merchantIndex = this.$route.query.merchantIndex
        }

        if (this.$route.query.goodsName) {
            this.queryParams.goodsName = this.$route.query.goodsName
        }

        // if (this.$route.query.categoryId) {
        //     this.queryParams.categoryId = this.$route.query.categoryId
        // }

        if (this.$route.query.serverPhone) {
            this.queryParams.serverPhone = this.$route.query.serverPhone
        }

        if (this.$route.query.serverName) {
            this.queryParams.serverName = this.$route.query.serverName
        }

        if (this.$route.query.merchantName) {
            this.queryParams.merchantName = this.$route.query.merchantName
        }

        if (this.$route.query.memberPhone) {
            this.queryParams.memberPhone = this.$route.query.memberPhone
        }

        if (this.$route.query.merchantType) {
            this.queryParams.merchantType = this.$route.query.merchantType
        }

        if (this.$route.query.homeAdd) {
            this.queryParams.homeAdd = this.$route.query.homeAdd
        }

        if (this.$route.query.orderState) {
            this.queryParams.orderState = this.$route.query.orderState
        }

        if (this.$route.query) {
             if (this.$route.query.beginTime) {
                // console.log("==========",this.$route.query.params)
                // console.log("1",this.$route.query.params.beginTime)
                // console.log(typeof(this.dateRange))
                this.searchDate[0]=this.$route.query.beginTime
                this.searchDate[1]=this.$route.query.endTime
                console.log("-------",this.searchDate)
             }

        }




        // this.getList();
        this.categoryTree();
        this.getCodeList();
    },
    methods: {
        /** 查询待审核列表 */
        getList() {

            this.$store.state.tagsView.visitedViews.forEach(element => {
                if (this.$route.path === element.path) {
                    element.query = this.queryParams
                }
            });

            this.loading = true;
            if (this.searchDate == null) {
                this.searchDate = "";
            }
            const [searchBegin, searchEnd] = this.searchDate;
            let sBegin = searchBegin;
            let sEnd = searchEnd;
            if (typeof searchBegin == "undefined") {
                var start = new Date()
                start.setTime(start.getTime()-3600 * 1000 * 24 * 30)
                this.searchDate = [start,new Date()]
                sBegin = this.timeStamp2String(start)
            }
            if (typeof searchEnd == "undefined") {
                sEnd = this.timeStamp2String(new Date())
                this.searchDate=[sBegin,sEnd]
            }
            this.queryParams.beginTime = sBegin;
            this.queryParams.endTime = sEnd;
            // 级联选择器绑定的参数queryParams.categoryId是一个数组，需要将最后一个层级分类的id 重新赋值给查询参数categoryId
            if (
                this.queryParams.categoryId &&
                this.queryParams.categoryId.length > 1
            ) {
                this.queryParams.categoryId =
                    this.queryParams.categoryId[
                        this.queryParams.categoryId.length - 1
                    ];
            }
            // 查询家政订单列表
            this.queryParams.orderType = "001";
            orderList(this.queryParams)
                .then((response) => {
                    console.log(response);
                    this.dataList = response.rows;

                    this.total = parseInt(response.total);
                })
                .catch((err) => {
                    console.log(err);
                })
                .finally(() => {
                    this.loading = false;
                });
        },
        categoryTree() {
            categoryTree()
                .then((res) => {
                    if (res.code == 200) {
                        this.categoryList = res.data
                         if (this.$route.query.categoryId) {
                    //             this.queryParams.categoryId= [36,37]

                        for(var i=0 ;i<this.categoryList.length;i++){
                            for(var t=0 ;t<this.categoryList[i].childrenCategory.length;t++){
                                if(this.categoryList[i].childrenCategory[t].categoryId == this.$route.query.categoryId){
                                    console.log("=======")
                                    console.log(this.categoryList[i].childrenCategory[t])

                                    this.queryParams.categoryId= [this.categoryList[i].categoryId,this.categoryList[i].childrenCategory[t].categoryId]
                                    console.log(this.queryParams.categoryId)
                                    // this.categoryId[0]=this.$route.query.categoryList[i].categoryId
                                    // this.categoryId[1]=this.$route.query.categoryList[i].childrenCategory[t].categoryId
                                }
                            }



                     }
                    }
                     this.getList();
                        this.categoryList = res.data;
                    } else {
                        this.$message.error("获取分类列表失败");
                    }
                    console.log(res);
                })
                .catch((err) => {
                    this.$message.error("获取分类列表失败");
                    console.log(err);
                });
        },
        getCodeList() {
            getCodeList("003")
                .then((res) => {
                    if (res.code == 200) {
                        this.statusList = res.data;
                    } else {
                        this.$message.error("获取状态列表失败");
                    }
                })
                .catch((err) => {
                    console.log(err);
                    this.$message.error("获取状态列表失败");
                });
        },
        handleCategory(value) {
            console.log(value);
            this.queryParams.categoryId = value[value.length - 1];
            console.log(this.queryParams.categoryId);
        },
        // 表单重置
        reset() {
            this.form = {
                orderId: null,
                refundMoney: null,
                refundReason: null,
                refundResult: null,
                status: null,
            };
            this.resetForm("form");
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.searchDate = [];
            this.queryParams = {
                pageNum: 1,
                pageSize: 10,
                beginTime: "",
                endTime: "",
                merchantId: "",
                merchantIndex: "",
                merchantName: "",
                goodsId: "",
                name: "",
                serverPhone: "",
                memberPhone: "",
                categoryId: [],
                merchantType: "",
                isAdd: "",
                status: "",
            };
            this.handleQuery();
        },

        parseAddress(row) {
            if (row.addressList != null && row.addressList.length > 0) {
                return row.addressList[0].address + row.addressList[0].detailed;
            } else {
                return "--";
            }
        },
        // 点击审核退款
        doRefund(row) {
            // this.$message.error("退款功能暂未开通");
            // return;
            getRefundInfo({
                orderId: row.orderId,
            }).then((res) => {
                if (res.code == 200) {
                    this.form = res.data;
                    this.open = true;
                    this.title = "退款审核";
                } else {
                    this.$message.error("获取退款信息失败");
                }
            }).catch((err) => {
              console.log("-----------------")
                console.log(err);
                this.$message.error("获取退款信息失败");
            });
        },
        //控制只能输入小数点后2位
        clearNoNum(obj) {
            var t = obj.target.value.charAt(0);
            //先把非数字的都替换掉，除了数字和.
            obj.target.value = obj.target.value.replace(/[^\d.]/g, "");
            //第一位0开头，0后面为数字，则过滤掉0，取后面的数字
            obj.target.value = obj.target.value.replace(/^0+(\d)/, "$1");
            //必须保证第一个为数字而不是.
            obj.target.valuee = obj.target.value.replace(/^\./g, "");
            //保证只有出现一个.而没有多个.
            obj.target.value = obj.target.value.replace(/\.{2,}/g, ".");
            //保证.只出现一次，而不能出现两次以上
            obj.target.value = obj.target.value
                .replace(".", "$#$")
                .replace(/\./g, "")
                .replace("$#$", ".");
            obj.target.value = obj.target.value.replace(
                /^(\-)*(\d+)\.(\d\d).*$/,
                "$1$2.$3"
            ); //只能输入两个小数
            //如果第一位是负号，则允许添加   如果不允许添加负号 可以把这块注释掉
            // if (t == '-') {
            //   obj.target.value = '-' + obj.target.value;
            // }
        },
        // 退款提交按钮
        submitForm() {
            if (
                this.form.refundResult == null ||
                this.form.refundResult == ""
            ) {
                return this.$message.error("审核结果描述必填");
            }
            if (this.form.status == null || this.form.status == "") {
                return this.$message.error("审核结果必选");
            }
            doRefund(this.form).then((res) => {
                if (res.code == 200) {
                    // 关闭审核弹框
                    this.open = false;
                    this.$message.success("审核完成");
                    // 刷新页面
                    this.getList(); 
                    this.form = {};
                    location.reload();
                } else {
                    this.$message.error(res.msg);
                }
            }).catch((err) => {
                console.log(err);
                // this.$message.error("操作失败")
            });
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        //详情页面跳转
        tosee(row) {
            // this.$router.push({
            //     path: "/adminOrder/order/detail",
            //     query: { id: row.orderId },
            // });
        getOrder(row.orderId).then((response) => {
            this.order = response.data;
            this.queryAdress();
            this.getServicceUser();
            this.getRefStatus();
            this.getRefund();
        });
             //显示详情弹框
            this.orderOpen=true;
        },
        timeStamp2String(datetime){

            var year = datetime.getFullYear();
            var month = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
            var date = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
            var hour = datetime.getHours()< 10 ? "0" + datetime.getHours() : datetime.getHours();
            var minute = datetime.getMinutes()< 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
            var second = datetime.getSeconds()< 10 ? "0" + datetime.getSeconds() : datetime.getSeconds();
            return year + "-" + month + "-" + date+" "+hour+":"+minute+":"+second;
        },
        checkCode({ preState, nowState }) {
      let result = nowState;
      switch (nowState) {
        case "000":
          result = "提交订单";
          break;
        case "001":
          result = "支付成功";
          break;
        case "002":
          result = preState === "001" ? "开始服务" : "追加服务";
          break;
        case "003":
          result = "完成服务";
          break;
        case "004":
          result = preState === "005" ? "顾客取消平台退款" : "确认完成";
          break;
        case "005":
          result = "顾客申请平台退款";
          break;
        case "006":
          result = preState === "005" ? "平台已退款" : "商家已退款";
          break;
        case "007":
          result = "平台拒绝退款";
          break;
        case "099":
          result = "未支付取消订单";
          break;
      }
      return result;
    },
        toServerProject() {
      this.$router.push("/merchant/service");
    },
    queryAdress() {
      getAddress(this.order.orderId).then((res) => {
        this.member = res.data;
      });
    },
    getServicceUser() {
      if (this.order.serverId) {
        getUser(this.order.serverId).then((res) => {
          this.serverUser = res.data;
          this.serverUser.rate = parseFloat(this.serverUser.rate || 0) + "%";
          let params = {
            codeValue: "服务等级",
          };
          listCode(params).then((res) => {
            for (let i in res.rows) {
              if (this.serverUser.serverLevel == res.rows[i].decodeId) {
                this.serverUser.serverLevel = res.rows[i].decodeValue;
              }
            }
          });
        });
      }
    },

    seeOrderStatus() {
      listRecord(this.order).then((res) => {
        this.orderRecord = res.rows;
        this.recordOpen = true;
      });
    },
    /** 获取订单退款子状态和信息*/
    getRefStatus() {
      let param = {
        codeValue: "退款状态",
      };
      listCode(param).then((res) => {
        this.refStatusOptions = res.rows;
      });
    },
    getRefund() {
      listRefund({ ...this.order, createTime: null }).then((res) => {
        this.refund = res.rows[0];
        if (this.refund) {
            this.refundOpen = true;
        }
      });
    },
    },
};
</script>

<style scoped>
 /deep/.el-tabs__item {
    padding: 10px;
    height: auto;
    line-height: 1.8;
}
</style>
<style lang="scss" scoped>
.tabs_label {
    text-align: center;
    span {
        line-height: 28px;
    }
}
.dateTable {
    .el-col {
        display: table;
        margin: 5px 0;
    }
    .grid-content {
        border-radius: 4px;
        height: 58px;
        border: 1px solid #ccc;
        display: table-cell;
        width: 100%;
        vertical-align: middle;
        text-align: center;
        cursor: pointer;
        p {
            margin: 0;
            padding: 0;
            line-height: 2;
            font-size: 12px;
        }
        p:first-child {
            font-size: 14px;
        }
    }
    .grid-content:hover {
        background: #f2f8fe;
    }
    .grid-content.cur {
        background: #dddddd;
    }
    .grid-content.cur:hover {
        background: #dddddd;
        cursor: auto;
    }
    .highlight {
        background-color: #409eff !important;
        color: #fff;
    }
    .booked {
        background-color: #d7d7d7 !important;
    }
    .text {
        font-size: 20px;
        margin: 50px 0 50px 0;
        text-align: center;
        color: rgb(255, 0, 0);
    }
}
.el-card {
  margin-bottom: 20px;
  background-color: #f4f4f4;
  color:#737373;
  font-size:14px;

}

li {
  list-style-type: none;
}
ul {
  padding-inline-start: 0px;
}
.span-color{

    font-size:16px;
    font-weight: bold;
    color: #F59A23;
}
.span-color-size {
    font-size:16px;
    font-weight: bold;
    color: #f59a23;
    line-height: 14px;
}
.span-detailed-info{
    color:black;
}

.gatePass {
    margin-left: 135px;
}
.qrCodeDialog {
    display: flex;
    justify-content: center;
    align-items: center;
}
   </style>
