<template>
  <div class="box-center">
    <!-- 头 -->
    <div class="app-top">
      <div class="app-titel" style="margin-top: 5px">
        <div class="div-lab">
          <div class="label">添加时间</div>
          <el-date-picker
            v-model="time"
            type="daterange"
            class="div-inp"
            range-separator="-"
            start-placeholder="开始日期"
            :default-time="['00:00:00', '23:59:59']"
            value-format="yyyy-MM-dd"
            end-placeholder="结束日期"
            @change="timeChange"
          >
          </el-date-picker>
        </div>

        <div class="div-lab">
          <el-input
            v-model="changeValue"
            clearable
            placeholder="请输入"
            @change="selectChange"
            style="width: 363px"
          >
            <el-select
              v-model="selflag"
              slot="prepend"
              class="input-with-select"
              style="width: 115px"
              placeholder="请选择"
              @change="selChange"
            >
              <el-option label="设备编号" value="1"></el-option>
              <!-- <el-option label="版本号" value="2"></el-option> -->
              <el-option label="批次号" value="3"></el-option>
              <el-option label="代理商名称" value="4"></el-option>
              <el-option label="公司名称" value="5"></el-option>
              <el-option label="楼盘名称" value="6"></el-option>
            </el-select>
          </el-input>
        </div>

        <!-- <div class="div-lab">
          <div class="label">售出状态</div>
          <el-select
            class="div-inp"
            multiple
            clearable
            collapse-tags
            v-model="searchForm.keywordsId"
            placeholder="请选择"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div> -->

        <div class="div-lab">
          <div class="label">领用状态</div>
          <el-select
            class="div-inp"
            clearable
            collapse-tags
            v-model="searchForm.receiveType"
            placeholder="请选择"
          >
            <el-option
              v-for="item in receiveTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>

        <div class="div-lab">
          <div class="label">在线状态</div>
          <el-select
            class="div-inp"
            clearable
            collapse-tags
            v-model="searchForm.onLine"
            placeholder="请选择"
          >
            <el-option
              v-for="item in onlineList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>

        <div class="div-lab">
          <div class="label">录音状态</div>
          <el-select
            class="div-inp"
            clearable
            collapse-tags
            v-model="searchForm.simAudioStatus"
            placeholder="请选择"
          >
            <el-option
              v-for="item in audioStatusList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>

        <div class="div-lab">
          <div class="label">上传状态</div>
          <el-select
            class="div-inp"

            clearable
            collapse-tags
            v-model="searchForm.uploadStatus"
            placeholder="请选择"
          >
            <el-option
              v-for="item in uploadStatusList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>

        <div class="div-lab">
          <div class="label">关机状态</div>
          <el-select
            class="div-inp"
            
            clearable
            collapse-tags
            v-model="searchForm.offStatus"
            placeholder="请选择"
          >
            <el-option
              v-for="item in offStatusList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
      </div>

      <!-- <div class="app-titel" style="margin-top: 15px">
        <div class="label">设备电量：</div>
        <div>
          <el-input v-model="value"></el-input>
        </div>
        <div class="label">是否在线：</div>
        <div>
          <el-select v-model="value" placeholder="请选择">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </div>
      </div> -->
      <div class="app-titel" style="margin-top: 15px">
        <!-- <div class="label" style="color: #ffffff">筛选相关：</div> -->
        <div style="margin-left: 20px">
          <el-button style="background: #2671e2; color: #ffffff" @click="screen"
            >筛选</el-button
          >
        </div>
        <div style="margin-left: 20px">
          <el-button @click="reset">清空筛选条件</el-button>
        </div>
        <div style="margin-left: 20px">
          <el-button
            @click="openAllLight()"
            type="primary"
            :disabled="multipleSelection.length == 0"
            >批量开启指示灯</el-button
          >
        </div>
        <div style="margin-left: 20px">
          <el-button
            @click="closeAllLight()"
            type="primary"
            :disabled="multipleSelection.length == 0"
            >批量关闭指示灯</el-button
          >
        </div>
        <div style="margin-left: 20px">
          <el-button
            @click="Batchreturn()"
            type="primary"
            :disabled="multipleSelection.length == 0"
            >批量归还</el-button
          >
        </div>
        <div style="margin-left: 20px">
          <el-button
            @click="infoMasstransfer()"
            type="primary"
            :disabled="multipleSelection.length == 0"
            >批量转移</el-button
          >
        </div>
        <div style="margin-left: 20px">
          <el-button
            @click="zkequipmentUnbind()"
            type="primary"
            :disabled="multipleSelection.length == 0"
            >批量解绑</el-button
          >
        </div>
      </div>
    </div>

    <!-- 表格 -->
    <div class="cen-tab">
      <div class="tongji">
        在线设备：{{ onLineCount || 0 }} 正在工作设备：{{
          workingCount || 0
        }}
        离线设备：{{ offLineCount || 0 }}
      </div>
      <el-table
        :data="tableData"
        stripe
        @selection-change="handleSelectionChange"
        style="width: 100%"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column type="index" label="序号" align="center">
        </el-table-column>
        <el-table-column prop="imei" label="设备编号" align="center">
        </el-table-column>
        <el-table-column prop="houseName" label="楼盘" align="center">
        </el-table-column>
        <el-table-column prop="userName" label="领用人" align="center">
        </el-table-column>
        <el-table-column prop="onLine" label="在线状态" align="center">
          <template slot-scope="{ row }">
            {{ row.onLine == 1 ? "在线" : "离线" }}
          </template>
        </el-table-column>
        <el-table-column prop="date" label="离线天数" align="center">
        </el-table-column>
        <el-table-column prop="simAudioStatus" label="录音状态" align="center">
          <template slot-scope="{ row }">
            {{ row.simAudioStatus ? "开启" : "关闭" }}
          </template>
        </el-table-column>
        <el-table-column
          prop="simAudioUploadStatus"
          label="上传状态"
          align="center"
        >
          <template slot-scope="{ row }">
            {{ row.simAudioUploadStatus ? "上传中" : "无上传" }}
          </template>
        </el-table-column>
        <el-table-column prop="lightStatus" label="开机指示灯" align="center">
          <template slot-scope="{ row }">
            {{ row.lightStatus == "on" ? "开启" : "关闭" }}
          </template>
        </el-table-column>

        <el-table-column
          prop="name"
          label="电池电量"
          width="200"
          align="center"
        >
          <template slot-scope="{ row }">
            <el-progress
              :percentage="row.electricity / 1"
              :color="customColors"
            ></el-progress>
          </template>
        </el-table-column>
        <el-table-column prop="signalDevice" label="信号强度" align="center">
        </el-table-column>
        <el-table-column prop="name" label="待上传文件" align="center">
        </el-table-column>
        <el-table-column
          width="150"
          prop="updateTime"
          label="更新时间"
          align="center"
        >
        </el-table-column>
        <el-table-column
          prop="openTime"
          width="150"
          label="开机时间"
          align="center"
        >
        </el-table-column>
        <el-table-column
          prop="closeTime"
          width="150"
          label="关机时间"
          align="center"
        >
        </el-table-column>
        <el-table-column prop="offStatus" label="关机类型" align="center">
          <template slot-scope="{ row }">
            {{
              row.lightStatus == 1
                ? "正常关机"
                : row.lightStatus == 1
                ? "低电关机"
                : "异常关机"
            }}
          </template>
        </el-table-column>
        <!--  scope -->
        <el-table-column label="操作" align="center" fixed="right" width="200">
          <template slot-scope="{ row }">
            <!-- <div style="color: #2671e2" @click="toinifoThereturn()">
              修改指示灯状态
            </div> -->
            <el-dropdown @command="handleCommand($event, row)">
              <span style="color: #409eff; font-size: 12px; margin-left: 10px">
                更多<i class="el-icon-arrow-down el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown">
                <!-- <el-dropdown-item command="toinifoThereturn" v-if="row.receiveType == 2" >归还</el-dropdown-item> -->
                <el-dropdown-item command="toinifoThereturn" v-if="row.userName"
                  >归还</el-dropdown-item
                >
                <el-dropdown-item command="receive" v-if="!row.userName"
                  >领用</el-dropdown-item
                >
                <el-dropdown-item command="lightStatusChange"
                  >{{
                    row.lightStatus == "on" ? "关闭" : "开启"
                  }}指示灯</el-dropdown-item
                >
                <el-dropdown-item command="wifiShow">WiFi管理</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
        </el-table-column>
      </el-table>
      <div style="display: flex; justify-content: flex-end; margin-top: 10px">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10, 20, 30, 40]"
          :page-size="size"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        >
        </el-pagination>
      </div>
    </div>
    <el-dialog
      title="领用"
      :visible.sync="receiveVisible"
      @close="resetReceive"
    >
      <el-form
        :model="receiveForm"
        label-position="labelPosition"
        ref="receiveForm"
        :rules="receiveRules"
        label-width="100px"
      >
        <el-form-item label="楼盘" prop="batchId">
          <el-input
            v-model="receiveForm.bindHouseName"
            style="width: 80%"
            disabled
          ></el-input>
        </el-form-item>
        <el-form-item label="顾问" prop="batchId">
          <el-select
            v-model="receiveForm.accountId"
            style="width: 80%"
            placeholder="请选择"
          >
            <el-option
              v-for="item in userList"
              :key="item.accountId"
              :label="item.name"
              :value="item.accountId"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="receiveVisible = false">取 消</el-button>
        <el-button type="primary" @click="saveReceive()">保存</el-button>
      </div>
    </el-dialog>

    <el-dialog
      title="批量转移"
      width="40%"
      :visible.sync="dialogVisible5"
      @close="resetBind"
    >
      <el-form
        :model="bindForm"
        label-position="labelPosition"
        ref="allbindForm"
        :rules="bindRules"
        label-width="140px"
      >
        <el-form-item label="楼盘" prop="houseId">
          <el-select
            filterable
            v-model="bindForm.houseId"
            style="width: 80%"
            placeholder="请选择"
            @change="houseChange"
          >
            <el-option
              v-for="item in houseList"
              :key="item.id"
              :label="item.propertyName"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible5 = false">取 消</el-button>
        <el-button type="primary" @click="Masstransfer()">保存</el-button>
      </div>
    </el-dialog>

    <el-dialog title="WiFi管理" width="40%" :visible.sync="wifiVisible">
      <el-form
        :model="wifiForm"
        :rules="wifiRule"
        ref="wifiForm"
        label-width="100px"
        class="demo-ruleForm"
      >
        <el-form-item label="设备号" prop="imei">
          <el-input v-model="wifiForm.imei" disabled></el-input>
        </el-form-item>
        <div>主WiFi</div>
        <el-form-item label="wifi名称" prop="masterWifiName">
          <el-input v-model="wifiForm.masterWifiName"></el-input>
        </el-form-item>
        <el-form-item label="wifi密码" prop="masterWifiPassword">
          <el-input
            v-model="wifiForm.masterWifiPassword"
            show-password
          ></el-input>
        </el-form-item>
        <div>备用一</div>
        <el-form-item label="wifi名称" prop="spareOneWifiName">
          <el-input v-model="wifiForm.spareOneWifiName"></el-input>
        </el-form-item>
        <el-form-item label="wifi密码" prop="spareOneWifiPassword">
          <el-input
            v-model="wifiForm.spareOneWifiPassword"
            show-password
          ></el-input>
        </el-form-item>
        <div>备用二</div>
        <el-form-item label="wifi名称" prop="spareTwoWifiName">
          <el-input v-model="wifiForm.spareTwoWifiName"></el-input>
        </el-form-item>
        <el-form-item label="wifi密码" prop="spareTwoWifiPassword">
          <el-input
            v-model="wifiForm.spareTwoWifiPassword"
            show-password
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="wifiVisible = false" type="primary"
            >取消</el-button
          >
          <el-button @click="wifiEdit">确定</el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [
        {
          value: "1",
          label: "全部",
        },
        {
          value: "2",
          label: "在线",
        },
        {
          value: "3",
          label: "离线",
        },
      ],
      onlineList: [
        {
          value: "0",
          label: "离线",
        },
        {
          value: "1",
          label: "在线",
        },
      ],
      audioStatusList: [
        {
          value: true,
          label: "开启",
        },
        {
          value: false,
          label: "关闭",
        },
      ],
      uploadStatusList: [
        {
          value: true,
          label: "无上传",
        },
        {
          value: false,
          label: "上传中",
        },
      ],
      equipmentStatusList: [
        {
          value: "0",
          label: "已验收",
        },
        {
          value: "1",
          label: "未验收",
        },
        {
          value: "2",
          label: "维修中",
        },
        {
          value: "3",
          label: "更换中",
        },
        {
          value: "4",
          label: "已报损",
        },
      ],
      offStatusList: [
        {
          value: "1",
          label: "正常关机",
        },
        {
          value: "2",
          label: "低电关机",
        },
        {
          value: "3",
          label: "异常关机",
        },
      ],
      receiveTypeList: [
        {
          value: "1",
          label: "未领用",
        },
        {
          value: "2",
          label: "使用中",
        },
        {
          value: "3",
          label: "已归还",
        },
      ],
      options1: [],
      houseList: [],
      searchForm: {
        name: "",
        imei: "", //设备号
        batchId: "", //批次号
        // equipmentType: "", //设备类型
        receiveType: "", //领用状态
        defaultTransliteration: "", //转写方式
        startDate: "", //开始时间
        endDate: "", //结束时间
        agentName: "", //代理商名称
        orgName: "", //公司名称
        houseName: "", //楼盘名称
        acceptanceStatus: "", //设备状态
        simAudioStatus: "", //录音状态
        uploadStatus: "", //上传状态
        offStatus: "", //关机状态
        onLine: "",
      },
      bindRules: {
        houseId: [{ required: true, message: "请选择楼盘", trigger: "blur" }],
      },
      bindForm: {
        remark: "",
        houseId: "",
        // choic: "3",
      },
      wifiForm: {
        // imei:"",
        // masterWifiName:"",
        // masterWifiPassword:'',
        // spareOneWifiName:"",
        // spareOneWifiPassword:'',
        // spareTwoWifiName:'',
        // spareTwoWifiPassword:'',
      },
      receiveForm: {
        houseId: "",
        bindHouseName: "",
        accountId: "",
      },
      receiveRules: {},
      wifiRule: {
        masterWifiPassword: [
          { min: 8, max: 16, message: "长度在 8 到 16 位", trigger: "blur" },
        ],
        spareOneWifiPassword: [
          { min: 8, max: 16, message: "长度在 8 到 16 位", trigger: "blur" },
        ],
        spareTwoWifiPassword: [
          { min: 8, max: 16, message: "长度在 8 到 16 位", trigger: "blur" },
        ],
      },
      addRules: {
        houseId: [{ required: true, message: "请选择楼盘", trigger: "blur" }],
        batchId: { required: true, message: "请选择顾问", trigger: "blur" },
      },
      receiveVisible: false,
      currentPage: 1,
      size: 10,
      total: 10,
      value: "",
      input: "",
      time: [],
      selflag: "1",
      changeValue: "",
      tableData: [],
      multipleSelection: [],
      userList: [],
      onLineCount: "",
      offLineCount: "",
      workingCount: "",
      dialogVisible5: false,
      wifiVisible: false,
      customColors: [
        { color: "#f56c6c", percentage: 20 },
        { color: "#e6a23c", percentage: 40 },
        { color: "#5cb87a", percentage: 60 },
        { color: "#1989fa", percentage: 80 },
        { color: "#6f7ad3", percentage: 100 },
      ],
    };
  },
  mounted() {
    this.getTableList();
    // 获取列表
    this.zkhousePage();
  },
  methods: {
    // wifi
    wifiShow(row) {
      this.wifiVisible = true;
      // 获取wifi数据
      this.wifiFindById(row.id);
    },
    //
    wifiFindById(id) {
      this.$api.api
        .wifiFindById({
          id,
        })
        .then((res) => {
          // console.log(res);
          // this.wifiForm=res.data
          this.wifiForm = {
            imei: res.data.imei,
            masterWifiName: res.data.masterWifiName,
            masterWifiPassword: res.data.masterWifiPassword,
            spareOneWifiName: res.data.spareOneWifiName,
            spareOneWifiPassword: res.data.spareOneWifiPassword,
            spareTwoWifiName: res.data.spareTwoWifiName,
            spareTwoWifiPassword: res.data.spareTwoWifiPassword,
          };
          if (!res.data.receiveType) {
            this.wifiForm.id = res.data.id;
          }
        });
    },
    wifiEdit() {
      // console.log(this.wifiForm);
      // return
      this.$refs.wifiForm.validate((valid) => {
        if (valid) {
          if (
            this.wifiForm.masterWifiName &&
            !this.wifiForm.masterWifiPassword
          ) {
            this.$message.warning("请检查主WiFi密码是否填写");
            return;
          }
          if (
            this.wifiForm.spareOneWifiName &&
            !this.wifiForm.spareOneWifiPassword
          ) {
            this.$message.warning("请检查备用一密码是否填写");
            return;
          }
          if (
            this.wifiForm.spareTwoWifiName &&
            !this.wifiForm.spareTwoWifiPassword
          ) {
            this.$message.warning("请检查备用二密码是否填写");
            return;
          }
          this.$api.api.wifiUpdate(this.wifiForm).then((res) => {
            // console.log(res);
            this.$message.success("修改成功");
            this.wifiVisible = false;
          });
        }
      });
    },
    resetWifi() {},
    getTableList() {
      this.$api.api
        .equipmentZxOnFindByPage({
          size: this.size,
          current: this.currentPage,
          orgType: localStorage.getItem("orgType"),
          orgCode: localStorage.getItem("orgCode"),
          agentId: localStorage.getItem("agentId"),
          houseId: localStorage.getItem("houseId"),
          ...this.searchForm,
        })
        .then((res) => {
          // console.log(res);
          this.tableData = res.data.list.records;
          this.onLineCount = res.data.onLineCount;
          this.offLineCount = res.data.offLineCount;
          this.workingCount = res.data.workingCount;
          this.total = res.data.list.total;
        });
    },
    //批量
    Batchreturn() {
      this.$confirm("确认批量归还吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let str = [];
          this.multipleSelection.map((item) => {
            str.push(item.imei);
          });
          this.$api.api
            .zkequipmentEquipmentBack({
              imeis: str.join(","),
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "批量归还成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消批量归还",
          });
        });
    },
    zkequipmentUnbind() {
      this.$confirm("确认批量解绑吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let str = [];
          this.multipleSelection.map((item) => {
            if (item.receiveType != 2) {
              str.push(item.imei);
            }
          });
          console.log(str);
          this.$api.api
            .zkequipmentUnbind({
              imeis: str.join(","),
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    zkhousePage() {
      this.$api.api
        .findHouseByUser({
          orgType: localStorage.getItem("orgType"),
        })
        .then((res) => {
          // console.log(res)
          this.houseList = res.data;
          // this.searchForm.houseId = res.data[0].id;
          // 列表获取
          // this.correctFindbypage();
        });
    },
    //批量转移
    infoMasstransfer() {
      this.dialogVisible5 = true;
    },
    houseChange(e) {
      console.log(e);
      let idx = this.houseList.findIndex((item) => item.id == e);
      if (idx != -1) {
        this.bindForm.orgCode = this.houseList[idx].orgCode;
      }
    },
    Masstransfer() {
      this.$refs.allbindForm.validate((valid) => {
        if (valid) {
          console.log(this.bindForm);
          let arr = [];
          this.multipleSelection.map((item) => arr.push(item.imei));
          let obj = {
            houseId: this.bindForm.houseId,
            orgCode: this.bindForm.orgCode,
            imeis: arr.join(","),
          };
          this.$api.api.zkequipmentBind(obj).then((res) => {
            console.log(res);
            this.$message.success("绑定成功");
            this.getTableList();
            this.dialogVisible5 = false;
          });
        }
      });
    },
    resetBind() {
      this.bindForm = {
        remark: "",
        houseId: "",
      };
    },
    screen() {
      this.currentPage = 1;
      // console.log(this.searchForm);
      this.getTableList();
    },
    reset() {
      this.changeValue = "";
      this.searchForm = {
        name: "",
        imei: "", //设备号
        batchId: "", //批次号
        // equipmentType: "", //设备类型
        receiveType: "", //领用状态
        defaultTransliteration: "", //转写方式
        startDate: "", //开始时间
        endDate: "", //结束时间
        agentName: "", //代理商名称
        orgName: "", //公司名称
        houseName: "", //楼盘名称
        acceptanceStatus: "", //设备状态
        simAudioStatus: "", //录音状态
        uploadStatus: "", //上传状态
        offStatus: "", //关机状态
        onLine: "",
      };
      this.getTableList();
    },
    receive(row) {
      this.receiveVisible = true;
      // this.bindForm.imeis = row.imei;
      this.receiveForm.houseId = row.propertyId;
      this.receiveForm.bindHouseName = row.bindHouseName;
      this.receiveForm.imei = row.imei;
      this.getUserByHouseId(row.propertyId);
    },
    saveReceive() {
      this.$refs.receiveForm.validate((valid) => {
        if (valid) {
          this.$api.api.equipmentReceiving(this.receiveForm).then((res) => {
            // console.log(res);
            this.receiveVisible = false;
            this.getTableList();
            this.$message({
              type: "success",
              message: "领用成功!",
            });
          });
        }
      });
    },
    resetReceive() {
      this.receiveForm = {
        houseId: "",
        bindHouseName: "",
        accountId: "",
      };
    },
    handleCommand(e, row) {
      console.log(row);
      this[e](row);
    },
    // 顾问列表
    getUserByHouseId(houseId) {
      this.$api.api
        .getUserByHouseId({
          houseId,
        })
        .then((res) => {
          // console.log(res);
          this.userList = res.data;
        });
    },
    // 指示灯开启关闭
    lightStatusChange(row) {
      this.$confirm(
        `确认${row.lightStatus == "on" ? "关闭" : "开启"}指示灯吗?`,
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        }
      )
        .then(() => {
          this.$api.api
            .batchOperateIndicator({
              imeis: row.imei,
              lightStatus: row.lightStatus == "on" ? "off" : "on",
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    openAllLight() {
      this.$confirm(`确认开启指示灯吗?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let str = [];
          this.multipleSelection.map((item) => {
            str.push(item.imei);
          });
          this.$api.api
            .batchOperateIndicator({
              imeis: str.join(","),
              lightStatus: "on",
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    closeAllLight() {
      this.$confirm(`确认关闭指示灯吗?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          let str = [];
          this.multipleSelection.map((item) => {
            str.push(item.imei);
          });
          this.$api.api
            .batchOperateIndicator({
              imeis: str.join(","),
              lightStatus: "off",
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "操作成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消操作",
          });
        });
    },
    //归还
    toinifoThereturn(row) {
      this.$confirm("确认归还吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$api.api
            .zkequipmentEquipmentBack({
              imeis: row.imei,
            })
            .then((res) => {
              this.$message({
                type: "success",
                message: "归还成功!",
              });
              this.getTableList();
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消归还",
          });
        });
    },
    timeChange(e) {
      if (e) {
        this.searchForm.startDate = e[0];
        this.searchForm.endDate = e[1];
      }
    },
    selChange() {
      this.changeValue = "";
      this.searchForm.imei = "";
      this.searchForm.batchId = "";
      this.searchForm.agentName = "";
      this.searchForm.orgName = "";
      this.searchForm.houseName = "";
    },
    selectChange(e) {
      this.searchForm.imei = "";
      this.searchForm.batchId = "";
      this.searchForm.agentName = "";
      this.searchForm.orgName = "";
      this.searchForm.houseName = "";
      if (!e) retun;
      if (this.selflag == 1) {
        // 设备编号
        this.searchForm.imei = e;
      }
      if (this.selflag == 3) {
        // 批次号
        this.searchForm.batchId = e;
      }
      if (this.selflag == 4) {
        // 代理商名称
        this.searchForm.agentName = e;
      }
      if (this.selflag == 5) {
        // 公司名称
        this.searchForm.orgName = e;
      }
      if (this.selflag == 6) {
        // 楼盘名称
        this.searchForm.houseName = e;
      }
    },
    // //批量归还
    // toinifoThereturn() {
    //   this.$confirm("确认更改吗?", "提示", {
    //     confirmButtonText: "确定",
    //     cancelButtonText: "取消",
    //     type: "warning",
    //   })
    //     .then(() => {
    //       this.$message({
    //         type: "success",
    //         message: "更改成功!",
    //       });
    //     })
    //     .catch(() => {
    //       this.$message({
    //         type: "info",
    //         message: "更改归还",
    //       });
    //     });
    // },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.size = val;
      this.getTableList();
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage = val;
      this.getTableList();
    },
  },
};
</script>

<style scoped="scoped" lang="scss" >
.box-center {
  width: 100%;
  padding: 15px;
  min-width: 1200px;
  padding-bottom: 100px;
}
.tongji {
  padding-bottom: 10px;
  font-size: 16px;
  color: red;
}
.cen-tab {
  width: 100%;
  padding: 15px;
  background: #ffffff;
  margin-top: 15px;
}
.tophove {
  color: #ffffff;
  background: #2671e2;
}
.app-top {
  width: 100%;
  background: #ffffff;
  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
  border-radius: 4px;
  padding-top: 15px;
  padding-bottom: 15px;
  .app-titel {
    width: 100%;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    .label {
      font-size: 14px;
      font-weight: 400;
      color: #32363d;
      line-height: 32px;
      margin-left: 15px;
      min-width: 100px;
    }
    .toptimeqhuan {
      height: 30px;
      background: #ffffff;
      display: flex;
      align-items: center;
    }
    .toptimeqhuan div {
      padding-left: 20px;
      padding-right: 20px;
      text-align: center;
      line-height: 30px;
      font-size: 14px;
      margin-right: 15px;
      border-radius: 4px;
      border: 1px solid #e0e0e0;
    }
  }
}
.div-lab {
  display: flex;
  margin: 5px;
}
.div-inp {
  width: 250px;
}
</style>
