<template>
  <div class="app-container calendar-list-container">
    <div class="filter-container">
      <el-form ref="queryForm" :model="listQuery" label-width="100px">
        <el-row>
          <el-col :span="4">
            <el-form-item label="手机号">
              <el-input v-model.number="listQuery.mobile" placeholder="请输入手机号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="注册终端">
              <el-select class="filter-item" v-model="listQuery.channel" placeholder="请选注册终端">
                <el-option :key="undefined" label="无" :value="undefined"></el-option>
                <el-option v-for="(val, key, index) in mobileList " :key="val.id" :label="val.name"
                           :value="val.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="会员类型">
              <el-select class="filter-item" v-model="listQuery.memberLevel" placeholder="请选会员类型">
                <el-option :key="undefined" label="无" :value="undefined"></el-option>
                <el-option v-for="(val, key, index) in memberLevelist " :key="val.id" :label="val.name"
                           :value="val.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="5">
            <el-form-item label="注册时间" prop="bookDateRange">
              <el-date-picker
                v-model="listQuery.registrationDate "
                type="daterange"
                :editable="true"
                format="yyyy-MM-dd"
                placeholder="请选择注册时间范围">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="3">
            <el-form-item label="用户来源">
              <el-select class="filter-item" v-model="listQuery.source" placeholder="请选用户来源">
                <el-option :key="undefined" label="无" :value="undefined"></el-option>
                <el-option v-for="(val, key, index) in sourceList" :key="val.id" :label="val.name"
                           :value="val.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-button class="filter-item" type="primary" v-waves icon="search" @click="handleFilter">搜索</el-button>
      <el-button class="filter-item"  style="margin-left: 10px;" @click="newMember"
                 type="primary" icon="edit">新增会员
      </el-button>

      <el-button class="filter-item"  style="margin-left: 10px;" @click="bulkUpload"
                 type="primary" icon="edit">批量导入会员
      </el-button>
    </div>
    <el-table :key='tableKey' :data="list" v-loading.body="listLoading" border fit highlight-current-row
              style="width: 100%">
      <el-table-column align="center" label="用户id" width="150">
        <template scope="scope">
          <span>{{scope.row.userId}}</span>
        </template>
      </el-table-column>
      <el-table-column width="200" align="center" label="手机号">
        <template scope="scope">
          <span>{{scope.row.username}}</span>
        </template>
      </el-table-column>
      <el-table-column width="110" align="center" label="注册终端">
        <template scope="scope">
          <span>{{scope.row.channel}}</span>
        </template>
      </el-table-column>
      <el-table-column width="110" align="center" label="来源">
        <template scope="scope">
          <span>{{scope.row.source}}</span>
        </template>
      </el-table-column>
      <el-table-column width="100" align="center" label="真实姓名">
        <template scope="scope">
          <span>{{scope.row.realName}}</span>
        </template>
      </el-table-column>
      <el-table-column width="180" align="center" label="会员类型">
        <template scope="scope">
          <span>{{scope.row.memberName}}</span>
        </template>
      </el-table-column>
      <el-table-column width="200" align="center" label="加入时间">
        <template scope="scope">
          <span>{{scope.row.timeOfMembership}}</span>
        </template>
      </el-table-column>
      <el-table-column width="200" align="center" label="免费总天数">
        <template scope="scope">
          <span>{{scope.row.totalNumber}}</span>
        </template>
      </el-table-column>
      <el-table-column width="200" align="center" label="剩余天数">
        <template scope="scope">
          <span>{{scope.row.rentFreeDays}}</span>
        </template>
      </el-table-column>
      <!--      <el-table-column width="200" align="center" label="会员">-->
      <!--        <template scope="scope">-->
      <!--          <span>{{scope.row.updName}}</span>-->
      <!--        </template>-->
      <!--      </el-table-column>-->
      <el-table-column align="center" label="操作" width="400">
        <template scope="scope">
          <el-button  size="small" type="success" @click="viewDetails(scope.row)">查看详情
          </el-button>
          <el-button v-if="scope.row.status!=1" size="small" type="success" @click=" setMember(scope.row)">设置会员信息
          </el-button>
          <el-button  v-if="scope.row.status!=1" size="small" type="success" @click="userOrder(scope.row)">用户订单
          </el-button>
          <el-button  v-if="scope.row.status!=1"  size="small" type="danger" @click="disable(scope.row)">设为禁用
          </el-button>
          <el-button   v-if="scope.row.status==1" size="small" type="danger" @click="available(scope.row)">取消禁用
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <div v-show="!listLoading" class="pagination-container">
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                     :current-page.sync="listQuery.page" :page-sizes="[10,20,30, 50]" :page-size="listQuery.limit"
                     layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
    </div>
    <!--    用户详细信息窗口-->
    <el-dialog title="用户详情" :visible.sync="detailsDialogFormVisible" type="text" label-width="95px">
      <el-form :model="userDetails"  ref="form" label-width="95px">
        <el-row>
          <el-row>
            <el-form-item   label="基础信息">
              <span v-if="userDetails.status!=1">(状态-正常)</span>
              <span v-if="userDetails.status==1">(状态-已禁用)</span>
            </el-form-item>
          </el-row>
          <el-row>
            <el-col :span="6">
              <div class="demo-type">
                <el-avatar  :size="60"
                           src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"
                           @error="errorHandler">
                  <img :src="userDetails.headimgurl"/>
                </el-avatar>
              </div>
            </el-col>
            <el-col :span="18">
              <el-row>
                <el-col :span="6">
                  <el-form-item label="用户Id:">
                    <span>{{userDetails.userId}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="昵称:">
                    <span>{{userDetails.nickName}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="手机号:">
                    <span>{{userDetails.username}}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="6">
                  <el-form-item label="注册终端:">
                    <span>{{userDetails.channel}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="注册时间:">
                    <span>{{userDetails.createTime}}</span>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="最近登录时间:">
                    <span>{{userDetails.lastTime}}</span>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
        </el-row>
        <el-row>
          <el-row>
            <el-form-item v-if="userManager_btn_del" v label="实名认证状态">
              <span v-if="userDetails.certificationStatus==1">(状态-未认证)</span>
              <span v-if="userDetails.certificationStatus!=1">(状态-已认证)</span>
            </el-form-item>
          </el-row>
          <el-row>
            <el-col :span="6">
              <el-form-item label="真实姓名: ">
                <span>{{userDetails.realName}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="身份证号: ">
                <span>{{userDetails.idNumber}}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="性别: ">
                <span>{{userDetails.sex}}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
        <el-row>
          <el-row>
            <el-form-item v label="会员信息">
            </el-form-item>

          </el-row>
          <el-row>
            <el-row>
              <el-col :span="6">
                <el-form-item label="会员类型:">
                  <span>{{userDetails.memberName}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="有效期:">
                  <span>{{userDetails.validTime}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="充值次数:">
                  <span>{{userDetails.buyCount}}次</span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="加入时间:">
                  <span>{{userDetails.timeOfMembership}}</span>
                </el-form-item>
              </el-col>

            </el-row>
            <el-row>
              <el-col :span="8">
                <el-form-item label="最近充值时间:">
                  <span>{{userDetails.recentRecharge}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="赠送总天数:">
                  <span>{{userDetails.totalNumber}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="剩余总天数:">
                  <span>{{userDetails.rentFreeDays}}</span>
                </el-form-item>
              </el-col>
            </el-row>

          </el-row>
        </el-row>
        <el-row>
          <el-row>
            <el-form-item  v label="用户来源">
            </el-form-item>
          </el-row>
          <el-row>

            <el-row>
              <el-col :span="6">
                <el-form-item label="来源:">
                  <span>{{userDetails.source}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="邀请人账号:">
                  <span>{{userDetails.inviter}}</span>
                </el-form-item>
              </el-col>
              <el-col :span="6">
                <el-form-item label="所属地区:">
                  <span>{{userDetails.cityName}}</span>
                </el-form-item>
              </el-col>
            </el-row>
          </el-row>
        </el-row>

      </el-form>


      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="closeMembershipWindow">确 定</el-button>
      </div>
    </el-dialog>


    <!--    设置会员信息窗口-->
    <el-dialog title="设置会员信息" :visible.sync="setMemberArea" class="member">
      <el-form :model="userMembershipInformation" ref="userMembership" label-width="100px">
        <el-row>
          <el-col :span="16">
            <el-form-item label="会员等级" prop="memberLevel">
              <el-select class="filter-item" v-model="userMembershipInformation.memberLevel" placeholder="请选择会员等级">
                <el-option v-for="(val, key, index) in memberLevelist " :key="val.id" :label="val.name"
                           :value="val.id"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="有效期" prop="validTime">
              <el-radio-group v-model="validityType">
                <el-radio-button label="无"></el-radio-button>
                <el-radio-button label="永久"></el-radio-button>
                <el-radio-button label="自定义"></el-radio-button>
              </el-radio-group>
              <dir></dir>
              <div class="block" v-if="validityType=='自定义'">
                <el-date-picker
                  v-model="validTime"
                  type="datetime"
                  placeholder="请选择注册时间范围">
                </el-date-picker>
              </div>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="充值次数/次" prop="buyCount">
              <el-input type="text" :disabled="true" v-model="userMembershipInformation.buyCount"
                        placeholder="请填写充值次数"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="赠送天数/天" prop="totalNumber">
              <el-input type="text" v-model="userMembershipInformation.totalNumber" placeholder="请填写赠送天数"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="16">
            <el-form-item label="剩余天数/天" prop="rentFreeDays" placeholder="请填写剩余天数">
              <el-input type="text" v-model="userMembershipInformation.rentFreeDays"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancelSetMemberArea('userMembership')">取消</el-button>
        <el-button type="primary" @click="saveMember('userMembership')">确 定</el-button>
      </div>
    </el-dialog>


    <!--    新建会员窗口-->
    <el-dialog title="新建会员" :visible.sync="newMemberArea" width="10%">
      <el-form :model="newMemberObject" :rules="newMemberObjectVerify" ref="nmo" label-width="100px">
        <el-form-item label="会员等级">
          <el-select class="filter-item" v-model="newMemberObject.memberLevel" placeholder="选择会员等级">
            <el-option :key="undefined" label="无" :value="undefined"></el-option>
            <el-option v-for="(val, key, index) in memberLevelist " :key="val.id" :label="val.name"
                       :value="val.id"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="手机号" placeholder="手机号" prop="phone">
          <el-input size="small " type="text" v-model="newMemberObject.phone"></el-input>
        </el-form-item>
        <el-form-item label="免费天数" placeholder="免费天数" prop="totalNumber">
          <el-input size="small " type="text" v-model="newMemberObject.totalNumber"></el-input>
        </el-form-item>
        <el-form-item label="剩余天数" placeholder="剩余天数" prop="rentFreeDays">
          <el-input size="small " type="text" v-model="newMemberObject.rentFreeDays"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancelNewMemberArea('nmo')">取消</el-button>
        <el-button type="primary" @click="setNewMemberObject('nmo')">确 定</el-button>
      </div>
    </el-dialog>


    <!--    用户订单窗口-->
    <el-dialog title="用户订单详情" :visible.sync="userOrderForm">
      <div class="filter-container">
        <el-form ref="queryForm" :model="orderQuery" label-width="100px">
          <el-row>
            <el-col :span="7">
              <el-form-item label="订单类型">
                <el-select class="filter-item" v-model="orderQuery.type" placeholder="请选订单装太">
                  <el-option :key="undefined" label="所有订单" :value="undefined"></el-option>
                  <el-option v-for="(val, key, index) in orderTypeList " :key="val.id" :label="val.name"
                             :value="val.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-form-item label="订单状态">
                <el-select class="filter-item" v-model="orderQuery.status" placeholder="请选会员类型">
                  <el-option :key="undefined" label="所有订单" :value="undefined"></el-option>
                  <el-option v-for="(val, key, index) in orderStatusList " :key="val.id" :label="val.name"
                             :value="val.id"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="7">
              <el-button class="filter-item" type="primary" v-waves icon="search" @click="userOrder">搜索</el-button>
            </el-col>
          </el-row>

        </el-form>

      </div>
      <el-form :model="userOrderMessage" ref="alterUserOrder" label-width="100px">

        <el-table
          :data="orderData"
          style="width: 100%"
          :row-class-name="tableRowClassName">
          <el-table-column
            prop="no"
            label="订单号"
            style="width: 100%" align="center">
          </el-table-column>
          <el-table-column
            prop="type"
            label="订单类型"
            width="180" align="center">
          </el-table-column>
          <el-table-column
            prop="status"
            label="订单状态" align="center">
          </el-table-column>
          <el-table-column
            prop="crtTime"
            label="下单时间" align="center">
          </el-table-column>
          <el-table-column
            prop="updTime"
            label="修改时间" align="center">
          </el-table-column>
          <el-table-column
            label="操作"
            align="center">
            <el-button size="small" type="success">查看详情
            </el-button>
          </el-table-column>
        </el-table>
      </el-form>
      <div v-show="!orderListLoading" class="pagination-container">
        <el-pagination @size-change="orderSizeChange" @current-change="orderCurrentChange"
                       :current-page.sync="orderQuery.page" :page-sizes="[10,20,30, 50]" :page-size="orderQuery.limit"
                       layout="total, sizes, prev, pager, next, jumper" :total="orderTotal"></el-pagination>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="cancelOrder('alterUserOrder')">确 定</el-button>
      </div>
    </el-dialog>


    <!--批量导入会员窗口-->
    <el-dialog title="导入会员" :visible.sync="bulkUploadMember">
      <el-form :model="fileForm">
        <el-form-item label="上传文件" :label-width="formLabelWidth">
          <el-button type="primary" icon="el-icon-download">
            <a class="el-icon-download" :href="BASE_API+'/api/admin/admin/member/app/unauth/user/excel_model/dowload'">下载模板
            </a>
          </el-button>

          <el-upload
            ref="uploadExcel"
            :limit=limitNum
            action="1111"
            :headers="getHeaderWithToken"
            accept=".xlsx"
            :http-request="upLoad"
            :on-remove="handleRemove"
            :before-remove="beforeRemove"
            :before-upload="beforeUploadFile"
            :on-change="fileChange"
            :on-exceed="exceedFile"
            :file-list="fileList">

            <el-button size="small" type="primary" icon="el-icon-edit">上传文件<i class="el-icon-upload el-icon--right">
            </i></el-button>
            <div slot="tip" class="el-upload__tip">只能上传xlsx(Excel2007以上版本)文件，且不超过10M</div>
          </el-upload>
          <el-button size="small" class="filter-item" type="primary" @click="cancelNotDeleteForm">取消</el-button>
        </el-form-item>
      </el-form>

    </el-dialog>

    <!--    <book-info-viewer ref="bookInfoViewer"></book-info-viewer>-->
    <!--    <acc-item-selector :selectedAccItem="selectedAccItem" :isReadOnly="true" ref="accItemSelector"></acc-item-selector>-->
  </div>
</template>

<script>
  import {
    appPage,
    seveObj,
    setDisable,
    setAvailable
  } from 'src/api/admin/userManagement/index';
  import {getToken} from 'src/utils/auth';
  import {mapGetters} from 'vuex';
  import {getUserMemberByUserId} from 'src/api/admin/baseUserMember/index';
  import {timestamp2Date} from 'src/utils/dateUtils';
  import {page} from 'src/api/order/memeber';
  import {
    UploadMembershipList,
    saveNewMemberObject
  } from 'src/api/admin/UserMember/index';

  export default {
    name: 'user',
    data() {
      return {
        orderData: [],
        validTime: '',
        userMembershipInformation: {
          memberLevel: undefined,
          validTime: '',
          buyCount: undefined,
          totalNumber: undefined,
          rentFreeDays: undefined,
          id: undefined,
          userId: undefined
        },
        saveUserId: undefined,
        validityType: '无',
        userOrderMessage: {},
        mobileList: [{id: 1, name: 'app'}, {id: 2, name: "小程序"}],
        memberLevelist: [{id: 1, name: '普通会员'}, {id: 2, name: '黄金会员'}, {id: 3, name: '钻石会员'}],
        sourceList: [{id: 1, name: '自来'}, {id: 2, name: '用户邀请'}],
        orderStatusList: [
          {id: 1, name: '删除'},
          {id: 2, name: '创建订单'},
          {id: 3, name: '取消'},
          {id: 4, name: '待付款'},
          {id: 5, name: '待出行'},
          {id: 6, name: '出行中'},
          {id: 7, name: '已完成'}
        ],
        orderTypeList: [
          {id: 1, name: '旅游'},
          {id: 2, name: '租车'},
          {id: 3, name: '会员订单'}
        ],
        BASE_API: process.env.BASE_API,
        userDetails: {},
        limitNum: 1,
        formLabelWidth: '80px',
        fileForm: {
          file: ''
        },
        fileList: [],
        errorHandler: true,
        list: null,
        total: null,
        orderTotal: null,
        listLoading: true,
        orderListLoading: true,
        newMemberObject: {
          phone: undefined,
          memberLevel: undefined,
          totalNumber: undefined,
          rentFreeDays: undefined
        },
        orderQuery: {
          limit: 10,
          page: 1,
          userId: undefined,
          type: undefined,
          status: undefined
        },
        newMemberObjectVerify: {
          phone: [
            {
              required: true,
              message: '手机号',
              trigger: 'blur'
            },
          ],
          memberLevel: [
            {
              required: true,
              message: '会员等级',
              trigger: 'blur'
            },
          ],
          totalNumber: [
            {
              required: true,
              message: '免费天数',
              trigger: 'blur'
            },
          ],
          rentFreeDays: [
            {
              required: true,
              message: '剩余总天天数',
              trigger: 'blur'
            },
          ],
        },

        listQuery: {
          page: 1,
          limit: 20,
          mobileList: undefined,
          mobile: undefined,
          memberLevel: undefined,
          source: undefined,
          channel: undefined,
          registrationTimeEnd: undefined,
          registrationTimeBegin: undefined,
          registrationDate: undefined
        },

        source: {
          0: '自来',
          1: '用户邀请'
        },
        terminal: {
          1: 'app',
          2: '小程序'
        },
        orderStatus: {
          0: '删除',
          1: '创建订单',
          2: '取消',
          3: '待付款',
          4: '待出行',
          5: '出行中',
          6: '已完成',
        },
        orderType: {
          1: '旅游',
          2: '租车',
          3: '会员订单'
        },
        detailsDialogFormVisible: false,
        setMemberArea: false,
        newMemberArea: false,
        userOrderForm: false,
        bulkUploadMember: false,
        dialogStatus: '',
        userManager_btn_del: false,
        myGroups: [],
        loading: false,

        tableKey: 0,
        selectedAccItem: undefined
      }
    },
    created() {
      this.getList();
    }
    ,
    computed: {
      ...
        mapGetters([
          'elements'
        ]),
      /**
       * 获取token
       */
      getHeaderWithToken() {
        return {Authorization: getToken()};
      },
    }
    ,
    methods: {

      /**
       *  上传
       */
      upLoad(file) {
        var form = new FormData();
        // 文件对象
        form.append("file", file.file);
        UploadMembershipList(form)
          .then(res => {
            if (res.rel) {
              this.$notify.success({
                title: '上传成功',
                message: `success`
              })
            } else {
              this.$notify.warning({
                title: '上传失败',
                message: `failed`
              })
            }
            this.getList();
          })
      },
      //excel上传
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePreview(file) {
        console.log(file);
      },
      beforeRemove(file, fileList) {
        return this.$confirm(`确定移除 ${file.name}？`);
      },

      // 文件超出个数限制时的钩子
      exceedFile(files, fileList) {
        this.$notify.warning({
          title: '警告',
          message: `只能选择 ${this.limitNum} 个文件，当前共选择了 ${files.length + fileList.length} 个`
        });
      },
      // 文件状态改变时的钩子
      fileChange(file, fileList) {
        console.log('change')
        console.log(file)
        this.fileForm.file = file.raw
        console.log(this.fileForm.file)
        console.log(fileList)
      },
      // 上传文件之前的钩子, 参数为上传的文件,若返回 false 或者返回 Promise 且被 reject，则停止上传
      beforeUploadFile(file) {
        console.log('before upload')
        console.log(file)
        let extension = file.name.substring(file.name.lastIndexOf('.') + 1)
        let size = file.size / 1024 / 1024
        if (extension !== 'xlsx') {
          this.$notify.warning({
            title: '警告',
            message: `只能上传Excel 2007以上版本（即后缀是.xlsx）的文件`
          });
        }
        if (size > 10) {
          this.$notify.warning({
            title: '警告',
            message: `文件大小不得超过10M`
          });
        }
      },
      /**
       *  弹出导入窗体
       */
      bulkUpload() {
        this.bulkUploadMember = true
      },
      /**
       * 获取用户列表
       */
      getList() {

        let query = JSON.parse(JSON.stringify(this.listQuery))
        query.source = query.source ? query.source - 1 : ''
        JSON.stringify(query)
        appPage(query)
          .then(response => {
            for (let listKey of response.data.list) {

              listKey = this.getListKey(listKey)
            }
            this.list = response.data.list;
            this.total = response.data.total;
            this.listLoading = false;
          })
      },
      /**
       * 处理返回的列表的参数
       */
      getListKey(listKey) {
        listKey.timeOfMembership = listKey.timeOfMembership ? timestamp2Date(listKey.timeOfMembership) : '';
        listKey.recentRecharge = listKey.recentRecharge ? timestamp2Date(listKey.recentRecharge) : '';
        listKey.lastTime = listKey.lastTime ? timestamp2Date(listKey.lastTime) : '';
        listKey.createTime = listKey.createTime ? timestamp2Date(listKey.createTime) : '';
        listKey.buyCount = listKey.buyCount ? listKey.buyCount : 0;
        listKey.channel = this.terminal[listKey.channel];
        listKey.source = this.source[listKey.source];
        listKey.validTime = listKey.validTime ? ((listKey.validTime == 0) ? '永久' : listKey.validTime) : '无';
      },

      /**
       *查询
       */
      handleFilter() {

        this.listQuery.registrationTimeBegin = this.listQuery.registrationDate ? (new Date(this.listQuery.registrationDate[0]).getTime()) / 1000 : null
        this.listQuery.registrationTimeEnd = this.listQuery.registrationDate ? (new Date(this.listQuery.registrationDate[1]).getTime()) / 1000 : null
        alert(JSON.stringify(this.listQuery))
        this.getList();
      }
      ,
      handleSizeChange(val) {
        this.listQuery.limit = val;
        this.getList();
      }
      ,
      handleCurrentChange(val) {
        this.listQuery.page = val;
        this.getList();
      }
      ,
      handleCreate() {
        this.dialogStatus = 'create';
        // this.dialogFormVisible = true;
      },
      /**
       * 查看会员详细信息
       * @param row
       */
      viewDetails(row) {
        this.userDetails = row
        this.detailsDialogFormVisible = true
      }
      ,
      /**
       * 显示设置会员窗口
       * @param row
       */
      setMember(row) {
        this.userMembershipInformation = {}
        this.saveUserId = row.userId
        getUserMemberByUserId(row.userId).then(response => {
          if (response.data.validTime == 0) {
            this.validityType = '永久'
          } else if (response.data.validTime) {
            this.validityType = '自定义'
            response.data.validTime = timestamp2Date(response.data.validTime);

          } else {
            this.validityType = '无'
          }
          this.userMembershipInformation = response.data
          this.validTime = response.data.validTime
          console.log(this.userMembershipInformation)
          this.setMemberArea = true
        })
        this.userMembershipInformation.userId = this.saveUserId
      },
      /**
       * 提交会员修改
       * @param formName
       */
      saveMember(formName) {
        let date = new Date(this.validTime);
        this.userMembershipInformation.validTime = date.getTime()

        console.log(this.userMembershipInformation)
        seveObj(this.userMembershipInformation).then(res => {
          if (res.rel) {
            this.$notify.success({
              title: '修改成功',
              message: `success`
            })
          } else {
            this.$notify.warning({
              title: '修改成功',
              message: `failed`
            })
          }
          this.setMemberArea = false
          this.$refs[formName].resetFields()
          this.getList();
        })
      },
      /**
       * 显示新增会员窗口
       * @param row
       */
      newMember() {
        this.newMemberArea = true
      },
      /**
       * 提交新增会员
       *
       */
      setNewMemberObject(formName) {
        saveNewMemberObject(this.newMemberObject)
          .then(res => {
              if (res.rel) {
                this.$notify.success({
                  title: '新增成功',
                  message: `success`
                })
              } else {
                this.$notify.warning({
                  title: '新增失败',
                  message: `failed`
                })
              }
              this.newMemberArea = false
              this.$refs[formName].resetFields()
              this.getList();
            }
          )

      },
      create(formName) {
        const set = this.$refs;
        if (!this.form.state2 || this.form.state2 == "全部") {
          this.form.companyId = undefined;
        }
        set[formName].validate(valid => {
          if (valid) {
            addObj(this.form)
              .then(() => {
                // this.dialogFormVisible = false;
                this.getList();
                this.$notify({
                  title: '成功',
                  message: '创建成功',
                  type: 'success',
                  duration: 2000
                });
              })
          } else {
            return false;
          }
        });
      }
      ,
      /**
       * 关闭窗口,清除批量上传
       */
      cancelNotDeleteForm() {
        this.bulkUploadMember = false;
        this.$refs.uploadExcel.clearFiles();
      },
      closeMembershipWindow() {
        this.detailsDialogFormVisible = false;
      },

      /**
       * 关闭窗口,需要清除表单
       */
      //设置会员
      cancelSetMemberArea(formName) {
        this.setMemberArea = false
        this.validityType = '永久'
        this.$refs[formName].resetFields();
      },
      //新增会员
      cancelNewMemberArea(formName) {
        this.newMemberArea = false
        this.$refs[formName].resetFields();
      },
      /**
       * 获取用户订单列表
       */
      userOrder(row) {
        this.saveUserId = row.userId ? row.userId : this.saveUserId
        this.orderQuery.userId = this.saveUserId
        let query = JSON.parse(JSON.stringify(this.orderQuery))
        query.status = query.status ? query.status - 1 : null
        alert(JSON.stringify(query))

        page(query).then(
          res => {

            this.disposeOrderList(res.data.data)
            this.orderData = res.data.data
            this.orderTotal = res.data.totalCount
            this.userOrderForm = true;
            this.orderListLoading = false
          })
      },
      /**
       * 点击确定按钮,关闭订单列表
       */
      cancelOrder(formName) {
        this.userOrderForm = false
        if (!this.$refs[formName]) {
          this.$refs[formName].resetFields();
        }
      },
      /**
       * 处理响应数据
       */
      disposeOrderList(data) {
        if (data) {
          for (let key of data) {
            key.type = key.type ? this.orderType[key.type] : '/';
            key.status = key.status ? this.orderStatus[key.status] : '/';
          }
          return null;
        }
      },
      orderSizeChange(val) {
        this.orderQuery.limit = val;
        this.userOrder(this.orderQuery);
      },
      orderCurrentChange(val) {
        this.orderQuery.page = val;
        this.userOrder(this.orderQuery);
      },
      disable(obj){
        setDisable(obj.userId).then(res=> {
            if (res.rel){
              this.$notify.success({
                title: '成功',
                message: `success`
              })
            }else {
              this.$notify.warning({
                title: '失败',
                message: `failed`
              })
            }
            this.getList()


          })
      },
      /**
       * 设置为禁用取消禁用
       */
      available(obj){
        setAvailable(obj.userId).then(res=>{
            if (res.rel){
              this.$notify.success({
                title: '成功',
                message: `success`
              })
            }else {
              this.$notify.warning({
                title: '失败',
                message: `failed`
              })
            }
            this.getList()
        })
      },
      tableRowClassName({row, rowIndex}) {
        if (rowIndex/2==0) {
          return 'warning-row';
        }
        // else if (rowIndex === 3) {
        //   return 'success-row';
        // }
        return '';
      }
    }
  }
</script>
<style>
  .member .el-dialog--small {
    width: 500px;
  }
</style>

