<template>
  <div class="app-container">
    <!--操作区-->
    <el-button
      v-if="checkRole([1, 2]) || (checkRole([5]) && placeType == 2)"
      type="primary"
      icon="el-icon-plus"
      @click="create"
      >添加设备</el-button
    >
    <!--搜索区-->
    <el-select
      v-if="placeType != 2"
      filterable
      clearable
      v-model="page.data.username"
      placeholder="请选择账号"
      class="margin-left input"
    >
      <el-option
        v-for="item in user_list_search"
        :key="item.id"
        :label="item.username"
        :value="item.username"
      >
      </el-option>
    </el-select>

    <el-select
      filterable
      clearable
      v-model="page.data.sn"
      placeholder="请选择设备编号"
      class="margin-left input"
    >
      <el-option
        v-for="item in machine_list"
        :key="item.sn"
        :label="item.sn"
        :value="item.sn"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.sn"
      placeholder="请选择设备地点"
      class="margin-left input"
    >
      <el-option
        v-for="item in machine_list"
        :key="item.sn"
        :label="item.name"
        :value="item.sn"
      >
      </el-option>
    </el-select>

    <el-select
      filterable
      clearable
      v-model="page.data.faceDeviceTypeId"
      placeholder="请选择设备类型"
      class="margin-left input"
      v-if="checkRole([1, 2])"
    >
      <el-option
        v-for="item in machine_type_list"
        :key="item.faceDeviceTypeId"
        :label="item.name"
        :value="item.faceDeviceTypeId"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.online"
      placeholder="请选择在离线状态"
      class="margin-left input"
    >
      <el-option
        v-for="item in online_list"
        :key="item.id"
        :label="item.name"
        :value="item.id"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.enable"
      placeholder="请选择启用状态"
      class="margin-left input"
    >
      <el-option
        v-for="item in enable_list"
        :key="item.id"
        :label="item.name"
        :value="item.id"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.provinceId"
      @change="chooseProvinceSearch"
      placeholder="请选择省份"
      class="margin-left input"
      :disabled="checkRole([2, 3, 4, 5])"
      v-if="!checkRole([99])"
    >
      <el-option
        v-for="item in province_list_search"
        :key="item.areaCodeId"
        :label="item.name"
        :value="item.areaCodeId"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.cityId"
      @change="chooseCitySearch"
      placeholder="请选择城市"
      class="margin-left input"
      :disabled="checkRole([4, 5])"
      v-if="!checkRole([99])"
    >
      <el-option
        v-for="item in city_list_search"
        :key="item.areaCodeId"
        :label="item.name"
        :value="item.areaCodeId"
      >
      </el-option>
    </el-select>
    <el-select
      filterable
      clearable
      v-model="page.data.areaId"
      placeholder="请选择区域"
      class="margin-left input"
      :disabled="checkRole([5])"
      v-if="!checkRole([99])"
    >
      <el-option
        v-for="item in area_list_search"
        :key="item.areaCodeId"
        :label="item.name"
        :value="item.areaCodeId"
      >
      </el-option>
    </el-select>
    <el-button
      type="primary"
      icon="el-icon-search"
      class="margin-left"
      @click="fetchData"
      >搜索</el-button
    >
    <!--主表格-->
    <el-table
      class="table"
      ref="table_form"
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column label="序号" align="center" width="80px">
        <template slot-scope="scope">
          {{ indexMethod(scope.$index) }}
        </template>
      </el-table-column>
      <el-table-column label="设备编号" align="center">
        <template slot-scope="scope">
          {{ scope.row.sn | matchNull }}
        </template>
      </el-table-column>
      <el-table-column label="设备地点" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.name | matchNull }}</span>
        </template>
      </el-table-column>
      <el-table-column label="设备类型" align="center" v-if="checkRole([1, 2])">
        <template slot-scope="scope">
          <span>{{ scope.row.faceDeviceTypeName | matchNull }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="设备品牌名称"
        align="center"
        v-if="checkRole([1, 2])"
      >
        <template slot-scope="scope">
          <span>{{ scope.row.thirdPartyName | matchNull }}</span>
        </template>
      </el-table-column>
      <el-table-column label="所属账号" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.username | matchNull }}</span>
        </template>
      </el-table-column>
      <el-table-column label="省-市-区" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          {{ scope.row.provinceName | matchNull }}-{{
            scope.row.cityName | matchNull
          }}-{{ scope.row.areaName | matchNull }}
        </template>
      </el-table-column>
      <el-table-column label="设备IP" align="center">
        <template slot-scope="scope">
          {{ scope.row.interIp | matchNull }}
        </template>
      </el-table-column>
      <el-table-column label="APP版本" align="center">
        <template slot-scope="scope">
          {{ scope.row.appVersion | matchNull }}
        </template>
      </el-table-column>
      <el-table-column label="有效人员数量" align="center">
        <template slot-scope="scope">
          {{ scope.row.userCount }}
        </template>
      </el-table-column>
      <el-table-column label="进口/出口" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.pass === 1">进口</el-tag>
          <el-tag type="info" v-else-if="scope.row.pass === 2">出口</el-tag>
          <el-tag v-else>不限</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="在线状态" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.online === 1">在线</el-tag>
          <el-tag type="info" v-else-if="scope.row.online === 0">离线</el-tag>
          <el-tag v-else>未知</el-tag>
        </template>
      </el-table-column>
      <el-table-column label="使用状态" align="center">
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.enable === 1">启用</el-tag>
          <el-tag type="info" v-else-if="scope.row.enable === 0">停用</el-tag>
          <el-tag v-else>其它</el-tag>
        </template>
      </el-table-column>
      <el-table-column class-name="status-col" label="授权状态" align="center">
        <template slot-scope="scope">
          <el-tag type="info" v-if="scope.row.auth === 0">未授权</el-tag>
          <el-tag type="success" v-else-if="scope.row.auth === 1"
            >已授权</el-tag
          >
        </template>
      </el-table-column>
      <el-table-column
        label="所属区域类型"
        align="center"
        v-if="isOpenPrivateArea === 1"
      >
        <template slot-scope="scope">
          <el-tag type="success" v-if="scope.row.adminAreaType === 1"
            >{{tenantEnterpriseName}}公有</el-tag
          >
          <el-tag type="primary" v-if="scope.row.adminAreaType === 2"
            >{{enterpriseName}}公有</el-tag
          >
          <el-tag type="warning" v-if="scope.row.adminAreaType === 3"
            >{{enterpriseName}}私有</el-tag
          >
        </template>
      </el-table-column>
      <el-table-column label="创建时间" align="center">
        <template slot-scope="scope">
          {{ scope.row.createTime }}
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop=""
        label="操作区"
        :width="checkRole([1, 2]) ? '370' : '300'"
        v-if="checkRole([1, 2, 5])"
      >
        <template slot-scope="scope">
          <el-button
            v-if="checkRole([1, 2]) || (checkRole([5]) && placeType === 2)"
            type="danger"
            size="small"
            @click="deleteUser(scope.row.deviceId)"
            >删除</el-button
          >
          <el-button
            v-if="checkRole([1, 2, 5])"
            type="primary"
            size="small"
            @click="update(scope.row)"
            >编辑</el-button
          >
          <el-button
            v-if="checkRole([1, 2])"
            :type="scope.row.auth === 1 ? 'warning' : 'success'"
            size="small"
            @click="
              scope.row.auth === 1
                ? doStopFaceDevice(scope.row.deviceId)
                : doAuthDevice(scope.row.deviceId)
            "
          >
            {{ scope.row.auth === 1 ? "停用" : "授权" }}</el-button
          >
          <el-button
            v-if="checkRole([1, 2, 5])"
            :type="
              scope.row.online === 1 &&
              scope.row.enable === 1 &&
              scope.row.auth === 1
                ? 'primary'
                : 'info'
            "
            plain
            size="small"
            :disabled="
              !(
                scope.row.online === 1 &&
                scope.row.enable === 1 &&
                scope.row.auth === 1
              )
            "
            @click="openIssueAll(scope.row.deviceId)"
          >
            全量下发
          </el-button>
          <el-button
            v-if="checkRole([1, 2, 5])"
            :type="
              scope.row.online === 1 &&
              scope.row.enable === 1 &&
              scope.row.auth === 1
                ? 'primary'
                : 'info'
            "
            plain
            size="small"
            :disabled="
              !(
                scope.row.online === 1 &&
                scope.row.enable === 1 &&
                scope.row.auth === 1
              )
            "
            @click="restart(scope.row.sn)"
          >
            重启
          </el-button>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop=""
        label="操作区"
        width="120"
        v-if="isOpenPrivateArea == 1 && checkRole([99])"
      >
        <template slot-scope="scope">
          <!-- 开启公私有的企业级账号可编辑 -->
          <el-button
            v-if="isOpenPrivateArea == 1 && checkRole([99])"
            type="primary"
            size="small"
            @click="update(scope.row)"
            :disabled="scope.row.adminAreaType === 1"
            >编辑</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!--分页栏-->
    <pagination
      :total="total"
      :page.sync="page.pageNum"
      :limit.sync="page.pageSize"
      @pagination="fetchData"
    />
    <!--对话框-->
    <el-dialog
      :title="dialogTitle[dialogType]"
      :visible.sync="dialogVisible"
      width="800px"
      :close-on-click-modal="false"
    >
      <el-form
        :model="form"
        :rules="rules"
        ref="form"
        label-width="110px"
        label-position="left"
      >
        <div class="flex">
          <el-form-item style="flex: 0.5" label="绑定账号" prop="adminId">
            <el-select
              style="width: 100%"
              filterable
              clearable
              v-model="form.adminId"
              placeholder="请选择账号"
              @change="changeAdminId"
              :disabled="checkRole([99])"
            >
              <el-option
                v-for="item in user_list"
                :key="item.adminId"
                :label="item.username"
                :value="item.adminId"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <template v-if="showPrivateArea">
          <div class="flex">
            <el-form-item
              label="所属区域类型"
              prop="adminAreaType"
              style="flex: 0.5"
            >
              <el-radio-group v-model="form.adminAreaType">
                <!-- <el-radio :label="1" v-if="!checkRole([99])">楼宇公有</el-radio> -->
                <el-radio :label="2">{{enterpriseName}}公有</el-radio>
                <el-radio :label="3">{{enterpriseName}}私有</el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item
              style="flex: 0.5"
              label="选择私有区域"
              prop="privateAreaId"
              v-if="form.adminAreaType === 3"
            >
              <el-select
                style="width: 100%"
                filterable
                clearable
                v-model="form.privateAreaId"
                placeholder="请选择私有区域"
              >
                <el-option
                  v-for="item in private_list"
                  :key="item.privateAreaId"
                  :label="item.privateAreaName"
                  :value="item.privateAreaId"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </div>
        </template>

        <el-form-item
          style="flex: 0.5"
          label="选择场所码"
          prop="adminPlaceInfoId"
          v-if="place_list.length > 0"
        >
          <el-select
            @change="changeSelect"
            style="width: 100%"
            filterable
            clearable
            v-model="form.adminPlaceInfoId"
            placeholder="请选择场所码"
          >
            <el-option
              v-for="item in place_list"
              :key="item.id"
              :label="item.unitAddress"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <div class="flex">
          <el-form-item
            style="flex: 0.5"
            label="设备品牌名称"
            prop="thirdPartyId"
            v-if="checkRole([1, 2])"
          >
            <el-select
              style="width: 100%"
              filterable
              clearable
              v-model="form.thirdPartyId"
              placeholder="请选择设备的品牌名称"
            >
              <el-option
                v-for="item in machine_company_list"
                :key="item.thirdPartyId"
                :label="item.name"
                :value="item.thirdPartyId"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            style="flex: 0.5"
            label="设备类型"
            prop="faceDeviceTypeId"
            v-if="checkRole([1, 2])"
          >
            <el-select
              style="width: 100%"
              filterable
              clearable
              v-model="form.faceDeviceTypeId"
              placeholder="请选择设备类型"
            >
              <el-option
                v-for="item in machine_type_list"
                :key="item.faceDeviceTypeId"
                :label="item.name"
                :value="item.faceDeviceTypeId"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </div>
        <div class="flex">
          <el-form-item
            style="flex: 0.5"
            label="设备编号"
            prop="sn"
            v-if="checkRole([1, 2]) || (checkRole([5]) && placeType === 2)"
          >
            <el-input v-model.trim="form.sn" maxlength="50" show-word-limit />
          </el-form-item>
          <el-form-item label="设备地点" prop="name" style="flex: 0.5">
            <el-input
              v-model.trim="form.name"
              maxlength="50"
              show-word-limit
              :disabled="checkRole([99])"
            />
          </el-form-item>
        </div>
        <div class="flex">
          <el-form-item label="使用状态" prop="enable" style="flex: 0.5">
            <el-radio-group v-model="form.enable" :disabled="checkRole([99])">
              <el-radio :label="0">停用</el-radio>
              <el-radio :label="1">启用</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="进/出口" prop="pass" style="flex: 0.5">
            <el-radio-group v-model="form.pass" :disabled="checkRole([99])">
              <el-radio :label="0">不限</el-radio>
              <el-radio :label="1">进口</el-radio>
              <el-radio :label="2">出口</el-radio>
            </el-radio-group>
          </el-form-item>
        </div>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false"> 取消 </el-button>
        <el-button
          type="primary"
          @click="dialogType === 'add' ? add() : doUpdate()"
        >
          确定
        </el-button>
      </div>
    </el-dialog>
    <!-- 全量下发对话框 -->
    <el-dialog
      title="全量下发"
      :visible.sync="issueAllDialogVisible"
      width="750"
    >
      <el-form
        :model="issueAllForm"
        :rules="issueAllRules"
        ref="form"
        label-width="120px"
        label-position="left"
      >
        <el-form-item label="是否更改有效期" prop="validityPeriodStatus">
          <el-radio-group v-model="issueAllForm.validityPeriodStatus">
            <el-radio :label="0">否</el-radio>
            <el-radio :label="1">是</el-radio>
          </el-radio-group>
        </el-form-item>
        <template v-if="issueAllForm.validityPeriodStatus == 1">
          <div class="flex">
            <el-form-item label="有效期开始时间" prop="startTime">
              <el-date-picker
                v-model="issueAllForm.startTime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item
              style="margin-left: 15px"
              label="有效期结束时间"
              prop="endTime"
            >
              <el-date-picker
                v-model="issueAllForm.endTime"
                type="datetime"
                value-format="yyyy-MM-dd HH:mm:ss"
              >
              </el-date-picker>
            </el-form-item>
          </div>
        </template>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="issueAllDialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="issueAll">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  doAuthFaceDevice,
  doStopFaceDevice,
  doDeleteDevice,
  doEditFaceDevices,
  doGetFaceDevices,
  getFaceDeviceList,
  issueAll,
  restart,
  getMachineCompanyListSearch,
  getMachineTypeListSearch,
} from "@/api/old_api_pengwenbing";
import { checkRole, checkVisitorType } from "@/utils/checkRole";
import { defaultTime } from "@/utils/defaultTime";
import Pagination from "@/components/Pagination";
import {
  getArea,
  getCity,
  getProvince,
  getUserListSearch,
  getPrivateAreaList,
  queryPlaceInfos,
  queryEnterpriseAccount,
  getAdminListNew,
} from "@/api/user_manage"; // secondary package based on el-pagination
import { appointmentPersonIssueAll } from "@/api/ordinary_user";
export default {
  components: { Pagination },
  filters: {
    matchNull(str) {
      return str ? str : "未连接";
    },
  },
  watch: {
    // 所属区域类型
    "form.adminAreaType"(n, o) {
      // 清除私有区域数据
      if (n == 1) {
        // 清除绑定账号和私有区域数据
        this.form.privateAreaId = null;
      } else if (n == 2) {
        this.getAdminListNew(1, 1, 1);
        this.form.privateAreaId = null;
      } else if (n == 3) {
        this.getPrivateAreaList(this.form.adminId);
      }
    },
    "issueAllForm.validityPeriodStatus"(n, o) {
      if (n === 1) {
        this.issueAllForm.startTime = this.defaultTime(0);
        this.issueAllForm.endTime = this.defaultTime(1);
      } else {
        this.issueAllForm.startTime = null;
        this.issueAllForm.endTime = null;
      }
    },
  },
  data() {
    return {
      role: this.$store.getters.role,// 角色
      placeType: this.$store.getters.placeType,
      isOpenPrivateArea: this.$store.getters.isOpenPrivateArea, //是否开启私有区域
      enterpriseName: this.$store.getters.enterpriseName,
      tenantEnterpriseName: this.$store.getters.tenantEnterpriseName,
      // 主表格&主表格加载状态
      list: null,
      listLoading: true,
      // 分页参数
      page: {
        data: {
          username: null,
          sn: null,
          name: null,
          provinceId: null,
          cityId: null,
          areaId: null,
          enable: null,
          online: null,
          thirdPartyId: null,
          faceDeviceTypeId: null,
        },
        pageNum: 1,
        pageSize: 10,
      },
      total: 0,
      // 企业列表
      enterprise_list: [],
      // 场所码列表
      place_list: [],
      // 私有区域列表
      private_list: [],
      // 账号列表
      user_list: [],

      // 账号列表_搜索
      user_list_search: [],
      // 设备列表_搜索
      machine_list: [],
      //省市县列表_搜索
      province_list_search: [],
      city_list_search: [],
      area_list_search: [],
      // 设备品牌名称列表_搜索
      machine_company_list: [],
      // 设备类型列表_搜索
      machine_type_list: [],
      // 在线状态
      online_list: [
        { id: 0, name: "离线" },
        { id: 1, name: "在线" },
      ],
      // 停用启用状态
      enable_list: [
        { id: 0, name: "停用" },
        { id: 1, name: "启用" },
      ],
      // 是否显示对话框
      dialogVisible: false,
      // 对话框标题
      dialogTitle: {
        add: "添加设备",
        update: "编辑设备",
      },
      dialogType: "add",
      // 添加账号参数
      form: {
        adminId: null,
        sn: null,
        name: null,
        enable: 1,
        pass: 0,
        thirdPartyId: null,
        faceDeviceTypeId: null,
        adminPlaceInfoId: null, //场所码
        adminAreaType: 1, //所属区域类型
        privateAreaId: null, //选择私有区域
      },
      form_copy: {},
      // 验证规则
      rules: {
        adminId: [{ required: true, message: "请选择账号", trigger: "blur" }],
        faceDeviceTypeId: [
          { required: true, message: "请选择设备类型", trigger: "blur" },
        ],
        thirdPartyId: [
          { required: true, message: "请选择设备品牌名称", trigger: "blur" },
        ],
        sn: [{ required: true, message: "请输入设备编号", trigger: "blur" }],
        name: [{ required: true, message: "请输入设备地点", trigger: "blur" }],
        enable: [
          { required: true, message: "请选择是否启用", trigger: "blur" },
        ],
        pass: [{ required: true, message: "请选择进/出口", trigger: "blur" }],
        privateAreaId: [
          { required: true, message: "请选择私有区域", trigger: "blur" },
        ],
        adminPlaceInfoId: [
          { required: true, message: "请选择场所码", trigger: "blur" },
        ],
        adminAreaType: [{ required: true, message: "请选择", trigger: "blur" }],
      },
      showPrivateArea: false, //判断账号是否开启私有区域
      issueAllDialogVisible: false, //全量下发弹出框
      issueAllId: null, //设备id
      issueAllForm: {
        validityPeriodStatus: 0,
        startTime: null,
        endTime: null,
      },
      issueAllRules: {
        validityPeriodStatus: [
          { required: true, message: "请选择", trigger: "blur" },
        ],
        startTime: [{ required: true, message: "请选择", trigger: "blur" }],
        endTime: [{ required: true, message: "请选择", trigger: "blur" }],
      },
    };
  },
  created() {
    this.form_copy = JSON.parse(JSON.stringify(this.form));
    this.fetchData();
    this.getAdminListNew(1, 1, 1);
    // this.getUserListSearch();
    this.getFaceDeviceList();
    if (checkRole([1, 2])) {
      this.getMachineCompanyListSearch();
      this.getMachineTypeListSearch();
    }
    this.getAddressListSearch(1);
    if (checkRole([2, 3])) {
      this.getAddressListSearch(2, this.$store.getters.provinceId);
      this.page.data.provinceId = this.$store.getters.provinceId;
    } else if (checkRole([4])) {
      this.getAddressListSearch(2, this.$store.getters.provinceId);
      this.page.data.provinceId = this.$store.getters.provinceId;
      this.getAddressListSearch(3, this.$store.getters.cityId);
      this.page.data.cityId = this.$store.getters.cityId;
    } else if (checkRole([5])) {
      this.getAddressListSearch(2, this.$store.getters.provinceId);
      this.page.data.provinceId = this.$store.getters.provinceId;
      this.getAddressListSearch(3, this.$store.getters.cityId);
      this.page.data.cityId = this.$store.getters.cityId;
      this.page.data.areaId = this.$store.getters.areaId;
    }
  },
  methods: {
    // 查询权限
    checkRole,
    // 查询场景配置
    checkVisitorType,
    // 获取默认时间
    defaultTime,
    // 获取列表数据
    fetchData() {
      this.listLoading = true;
      doGetFaceDevices(this.page).then((res) => {
        this.list = res.data.list;
        this.total = res.data.total;
        this.listLoading = false;
        doGetFaceDevices({ data: { thirdPartyId: null } }).then((res) => {
          this.$emit("updateList", res.data.total > 0 || false);
        });
      });
    },
    // 获取场所码列表
    queryPlaceInfos(adminId, type) {
      queryPlaceInfos(adminId).then((res) => {
        this.place_list = res.data;
        if (this.place_list.length === 0 && !type) {
          this.form.adminPlaceInfoId = null;
        } else if (!type) {
          this.form.adminPlaceInfoId = this.place_list[0].id;
        }
      });
    },
    changeAdminId(n) {
      this.form.privateAreaId = null;
      this.form.adminPlaceInfoId = null;
      this.place_list = [];
      this.user_list.forEach((i) => {
        if (i.adminId == n) {
          if (i.type == 99) {
            this.form.adminAreaType = 2;
          }
          // 判断是否开启私有区域
          if (i.isOpenPrivateArea == 1 && i.type === 99) {
            this.showPrivateArea = true;
            this.getPrivateAreaList(n);
          } else {
            this.showPrivateArea = false;
          }
          if (i.placeCodeStatus) {
            this.queryPlaceInfos(n);
          }
        }
      });
    },
    changeSelect() {
      this.$forceUpdate();
    },
    // 获取私有区域列表
    getPrivateAreaList(adminId) {
      getPrivateAreaList(adminId).then((res) => {
        this.private_list = res.data;
      });
    },
    // 获取账号列表数据
    getAdminListNew(isNeedDistrict, isNeedEnterprise, isNeedPrivateArea) {
      let data = {
        isNeedDistrict, //	是否需要区级账号 1-需要(默认) 2-不需要
        isNeedEnterprise, //	是否需要企业账号 1-需要(默认) 2-不需要
        isNeedPrivateArea, //查询区域类型 1-通用(默认) 2-公有 3-私有
      };
      getAdminListNew(data).then((res) => {
        this.user_list = res.data;
        this.user_list_search = res.data;
      });
    },
    // 获取设备列表-搜索
    getFaceDeviceList() {
      getFaceDeviceList().then((res) => {
        this.machine_list = res.data;
      });
    },
    // 获取设备品牌列表-搜索
    getMachineCompanyListSearch() {
      getMachineCompanyListSearch().then((res) => {
        this.machine_company_list = res.data;
      });
    },
    // 获取设备类型列表-搜索
    getMachineTypeListSearch() {
      getMachineTypeListSearch().then((res) => {
        this.machine_type_list = res.data;
      });
    },
    // 打开添加设备对话框
    create() {
      this.form = JSON.parse(JSON.stringify(this.form_copy));
      this.place_list = [];
      this.showPrivateArea = false;
      this.dialogType = "add";
      this.dialogVisible = true;
      this.$nextTick(() => {
        this.$refs["form"].clearValidate();
      });
    },
    // 确定添加
    add() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          doEditFaceDevices(this.form).then((res) => {
            this.dialogVisible = false;
            this.fetchData();
            this.$message({
              type: "success",
              message: "添加成功!",
            });
          });
        }
      });
    },
    // 删除此设备
    deleteUser(id) {
      this.$confirm("确定要删除此设备吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      }).then(() => {
        doDeleteDevice(id).then((res) => {
          this.fetchData();
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        });
      });
    },
    // 打开编辑对话框
    update(row) {
      this.form = Object.assign(this.form, row);
      this.user_list.forEach((i) => {
        if (i.adminId == row.adminId) {
          // 判断是否开启私有区域
          if (i.type === 99) {
            i.isOpenPrivateArea == 1?this.showPrivateArea = true:this.form.adminAreaType=1

          } else {
            this.showPrivateArea = false;
          }
        }
      });
      this.queryPlaceInfos(this.form.adminId, "update");
      this.dialogType = "update";
      this.dialogVisible = true;
      this.$nextTick(() => {
        this.$refs["form"].clearValidate();
      });
    },
    // 确定编辑
    doUpdate() {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          doEditFaceDevices(this.form).then((res) => {
            this.dialogVisible = false;
            this.fetchData();
            this.$message({
              type: "success",
              message: "编辑成功!",
            });
          });
        }
      });
    },
    // 授权设备
    doAuthDevice(id) {
      this.$confirm("确定授权该设备吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      })
        .then(() => {
          doAuthFaceDevice(id).then((response) => {
            this.fetchData();
            this.$message({
              type: "success",
              message: "授权成功!",
            });
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消授权",
          });
        });
    },
    // 停用设备
    doStopFaceDevice(id) {
      this.$confirm("确定停用该设备吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      })
        .then(() => {
          doStopFaceDevice(id).then((response) => {
            this.fetchData();
            this.$message({
              type: "success",
              message: "停用成功!",
            });
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消停用",
          });
        });
    },
    // 打开全量下发对话框
    openIssueAll(deviceId) {
      this.issueAllDialogVisible = true;
      this.issueAllId = deviceId;
    },
    //全量下发
    issueAll() {
      let data = this.issueAllForm;
      data.deviceId = this.issueAllId;
      if (this.placeType == 1) {
        appointmentPersonIssueAll(data)
          .then((response) => {
            this.issueAllDialogVisible = false;
            this.$message({
              type: "success",
              message: "下发完成!",
            });
          })
          .catch((err) => {
            console.log(err);
          });
      } else {
        issueAll(data)
          .then((response) => {
            this.issueAllDialogVisible = false;
            this.$message({
              type: "success",
              message: "下发完成!",
            });
          })
          .catch(() => {});
      }
    },
    //重启设备
    restart(deviceId) {
      this.$confirm("确定重新启动该设备吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
        center: true,
      })
        .then(() => {
          const loading = this.$loading({
            lock: true,
            text: "设备重启中...",
            spinner: "el-icon-loading",
            background: "rgba(0, 0, 0, 0.7)",
          });
          restart(deviceId)
            .then((response) => {
              loading.close();
              this.fetchData();
              this.$message({
                type: "success",
                message: "已重启!",
              });
            })
            .catch(() => {
              loading.close();
            });
        })
        .catch(() => {
          loading.close();
          this.$message({
            type: "info",
            message: "已取消重启",
          });
        });
    },
    // 获得省市县列表_搜索
    getAddressListSearch(type, code) {
      switch (type) {
        case 1:
          getProvince().then((res) => {
            this.province_list_search = res.data;
          });
          break;
        case 2:
          getCity(code).then((res) => {
            this.city_list_search = res.data;
          });
          break;
        case 3:
          getArea(code).then((res) => {
            this.area_list_search = res.data;
          });
          break;
        default:
          break;
      }
    },
    // 选择省份_搜索
    chooseProvinceSearch(e) {
      this.city_list_search = [];
      this.page.data.cityId = "";
      this.page.data.cityName = "";
      this.area_list_search = [];
      this.page.data.areaId = "";
      this.page.data.areaName = "";
      this.getAddressListSearch(2, e);
      this.getTagList(e);
    },
    // 选择市_搜索
    chooseCitySearch(e) {
      this.area_list = [];
      this.page.data.areaId = "";
      this.page.data.areaName = "";
      this.getAddressListSearch(3, e);
    },
    // 返回列表序号
    indexMethod(index) {
      return (this.page.pageNum - 1) * this.page.pageSize + index + 1;
    },
  },
};
</script>
<style scoped>
.table {
  margin-top: 15px;
}
.flex {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.margin-left {
  margin: 10px 0 0 10px;
}
.input {
  width: 150px;
}
</style>
