<template>
  <div class="main_root">
    <div class="search_header">
      <div class="search_left">
        <Input
          v-model="searchForm.name"
          placeholder="请输入名称"
          search
          @on-search="searchList()"
          style="width: 200px"
        />
      </div>
      <Button type="primary" class="primary_btn" @click="toAdd()">新建</Button>
    </div>
    <div class="table_wrap">
      <Table :columns="columns" :data="searchForm.list">
        <template slot-scope="{ row }" slot="actionSlot">
          <div class="action_list">
            <div @click="toEdit(row, 1)">查看</div>
            <div @click="toEdit(row, 2)">编辑</div>
            <div class="action_del" @click="toDel(row)">删除</div>
            <div @click="toEmpower(row)">授权</div>
          </div>
        </template>
      </Table>
    </div>
    <div class="page_wrap">
      <Page
        :transfer="true"
        :total="searchForm.total"
        :current="searchForm.page"
        :page-size="searchForm.size"
        :page-size-opts="[10, 20, 40, 60]"
        @on-change="pageChange"
        @on-page-size-change="pageSizeChange"
        show-total
        show-sizer
      ></Page>
    </div>
    <!-- 授权 -->
    <Modal
      class="modal1"
      :mask-closable="false"
      v-model="empowerInfo.show"
      title="授权"
    >
      <div class="empowerInfo">
        <div class="view_title">{{ empowerInfo.name }}</div>
        <div class="schoolname">
          <Checkbox v-model="empowerInfo.checked"></Checkbox
          >{{ empowerInfo.schoolInfo.name }}
        </div>
        <div class="school_list">
          <CheckboxGroup v-model="empowerInfo.classids">
            <Checkbox
              class="school_item"
              :label="classItem.id"
              v-for="classItem in empowerInfo.schoolInfo.children"
              :key="classItem.id"
              >{{ classItem.name }}</Checkbox
            >
          </CheckboxGroup>
        </div>
      </div>

      <div slot="footer" style="text-align: right">
        <Button @click="empowerInfo.show = false">关闭</Button>
        <Button type="primary" class="primary_btn" @click="saveEmpowerInfo()"
          >保存</Button
        >
      </div>
    </Modal>
    <!-- 编辑 -->
    <Modal
      class="modal5"
      :mask-closable="false"
      v-model="strategyInfo.show"
      :title="strategyInfo.model"
    >
      <div class="content" v-if="strategyInfo.show">
        <div class="titles">
          <div class="require">策略名称</div>
          <Input
            v-model.trim="strategyInfo.name"
            :disabled="strategyInfo.model === '查看'"
            style="width: 400px"
            placeholder="请输入策略名称"
          ></Input>
        </div>
        <div class="strategy_list">
          <div class="strategy_title">
            <div>
              <span
                style="font-size: 26px"
                class="ivu-icon iconfont icon-shijian"
              ></span
              >时间限制策略
            </div>
            <div>
              <Checkbox
                v-if="strategyInfo.model != '查看'"
                v-model="strategyInfo.hastime"
                @on-change="HandleIsShowChange(strategyInfo.hastime, 1)"
                >启用</Checkbox
              >
            </div>
          </div>
          <div style="margin-bottom: 10px" v-if="strategyInfo.hastime">
            <TimeStrategy
              v-if="strategyInfo.model != '查看'"
              :times="strategyInfo.padTimes"
              @timesChange="timesChange"
            ></TimeStrategy>
            <div class="showtime" v-if="strategyInfo.model === '查看'">
              <div
                style="line-height: 30px; font-size: 16px; margin-bottom: 10px"
              >
                设备生效时间
              </div>
              <div class="week">
                <div class="day" v-for="item in weeks" :key="item.id">
                  <div class="day_title">{{ item.title }}</div>
                  <div class="day_content">
                    <div
                      class="time"
                      v-for="(sitem, index) in getDay(item.id)"
                      :key="index"
                    >
                      {{ getTime(sitem.starttime) }}-{{
                        getTime(sitem.stoptime)
                      }}
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="nodata" v-else>未设置时间限制策略</div>
        </div>
        <div class="strategy_list">
          <div class="strategy_title">
            <div>
              <span class="ivu-icon iconfont icon-yingyongcelve"></span>应用策略
            </div>
            <div>
              <Checkbox
                v-if="strategyInfo.model != '查看'"
                v-model="strategyInfo.hasapp"
                @on-change="HandleIsShowChange(strategyInfo.hasapp, 2)"
                >启用</Checkbox
              >
            </div>
          </div>
          <div class="strategy_content" v-if="strategyInfo.hasapp">
            <div class="strategy_top">
              <span>授权应用</span>
            </div>
            <div
              class="strategy_bottom"
              style="min-height: 160px"
              v-if="padApps.length > 0"
            >
              <div class="app_list" v-for="item in padApps" :key="item.appid">
                <img :src="$api.baseImageUrl + item.appIcon" />
                <div>{{ item.appName }}</div>
                <Checkbox
                  class="checked"
                  :disabled="strategyInfo.model === '查看'"
                  v-model="item.checked"
                ></Checkbox>
              </div>
            </div>
          </div>
          <div class="nodata" v-else>未设置应用策略</div>
        </div>
        <div class="strategy_list">
          <div class="strategy_title">
            <div>
              <span class="ivu-icon iconfont icon-shezhi"></span>设备策略
            </div>
            <div>
              <Checkbox
                v-if="strategyInfo.model != '查看'"
                v-model="strategyInfo.hasdevice"
                @on-change="HandleIsShowChange(strategyInfo.hasdevice, 3)"
                >启用</Checkbox
              >
            </div>
          </div>
          <div class="strategy_content" v-if="strategyInfo.hasdevice">
            <div class="strategy_top">
              <span>设备功能管理</span>
            </div>
            <div class="strategy_bottom" style="min-height: 160px">
              <div
                class="device_list"
                v-for="item in padDevices"
                :key="item.pdorder"
              >
                <div class="icon">
                  <span :class="[item.icon]"></span>
                </div>
                <div class="title">{{ item.pdtype }}</div>
                <i-switch
                  size="large"
                  v-model="item.enabled"
                  :disabled="strategyInfo.model === '查看'"
                  :true-value="1"
                  :false-value="2"
                >
                  <span slot="open">开启</span>
                  <span slot="close">关闭</span>
                </i-switch>
              </div>
            </div>
          </div>
          <div class="nodata" v-else>未设置设备策略</div>
        </div>
        <div class="strategy_list">
          <div class="strategy_title">
            <div>
              <span
                style="font-size: 18px"
                class="ivu-icon iconfont icon-wifi"
              ></span
              >Wifi白名单策略
            </div>
            <div>
              <Checkbox
                v-if="strategyInfo.model != '查看'"
                v-model="strategyInfo.haswifi"
                @on-change="HandleIsShowChange(strategyInfo.haswifi, 4)"
                >启用</Checkbox
              >
            </div>
          </div>
          <div class="strategy_content" v-if="strategyInfo.haswifi">
            <div class="strategy_top">
              <span>SSID</span>
              <span v-if="strategyInfo.model != '查看'">
                <Input
                  v-model.trim="ssidName"
                  placeholder="请输入SSID"
                  style="width: 260px; margin: 0 10px"
                />
                <Button type="primary" class="primary_btn" @click="AddWifi()"
                  >添加</Button
                >
              </span>
            </div>
            <div class="strategy_bottom" style="min-height: 76px">
              <div
                class="padWifis"
                v-for="(item, index) in strategyInfo.padWifis"
                :key="index"
              >
                <div class="title">{{ item }}</div>
                <img
                  v-if="strategyInfo.model != '查看'"
                  @click="delWifi(item)"
                  class="del"
                  src="../../../assets/img/guanbi_red.png"
                />
              </div>
            </div>
          </div>
          <div class="nodata" v-else>未设置Wifi白名单</div>
        </div>
        <div class="strategy_list">
          <div class="strategy_title">
            <div>
              <span class="ivu-icon iconfont icon-weiguiguanli"></span>违规处理
            </div>
            <div>
              <Checkbox
                v-if="strategyInfo.model != '查看'"
                v-model="strategyInfo.hasviolate"
                @on-change="HandleIsShowChange(strategyInfo.hasviolate, 5)"
                >启用</Checkbox
              >
            </div>
          </div>
          <Table
            v-if="strategyInfo.hasviolate"
            class="table"
            :columns="columns1"
            :data="padViolates"
          >
            <template slot-scope="{ row }" slot="violationEvents">
              <Checkbox
                :disabled="strategyInfo.model === '查看'"
                class="checked"
                v-model="row.checked"
                @on-change="headleStrategy(row, 'checked')"
              ></Checkbox>
              <span
                style="display: inline-block; width: 120px; text-align: left"
                >{{ row.title }}</span
              >
            </template>
            <template slot-scope="{ row }" slot="noticed">
              <Checkbox
                :disabled="strategyInfo.model === '查看'"
                class="checked"
                v-model="row.noticed"
                @on-change="headleStrategy(row, 'noticed')"
                >通知管理员</Checkbox
              >
            </template>
            <template slot-scope="{ row }" slot="violationHandling">
              <RadioGroup
                v-model="row.handleMethod"
                @on-change="headleStrategy(row, 'handleMethod')"
              >
                <Radio
                  style="margin-right: 20px"
                  :disabled="strategyInfo.model === '查看'"
                  label="锁定"
                  >锁定</Radio
                >
                <Radio
                  :disabled="strategyInfo.model === '查看'"
                  label="恢复出厂设置"
                  >恢复出厂设置</Radio
                >
              </RadioGroup>
            </template>
          </Table>
          <div class="nodata" v-if="!strategyInfo.hasviolate">
            未设置违规处理
          </div>
        </div>
      </div>
      <div slot="footer" style="text-align: right">
        <Button @click="strategyInfo.show = false">关闭</Button>
        <Button
          v-if="strategyInfo.model != '查看'"
          style="margin-left: 10px"
          type="primary"
          class="primary_btn"
          @click="save()"
          >保存</Button
        >
      </div>
    </Modal>
    <Spin fix v-if="showLoading" style="background-color: transparent">
      <Icon type="ios-loading" size="18" class="demo-spin-icon-load"></Icon>
      <div>加载中</div>
    </Spin>
  </div>
</template>

<script>
import {
  class_list_strategy,
  stPad_add,
  stPad_add_empower,
  stPad_delete,
  stPad_detail,
  stPad_edit,
  stPad_list
} from "@/api/stPad";
import { app_list_sel } from "@/api/appgroup";
import TimeStrategy from "@/components/TimeStrategy/TimeStrategy";
import { padDevices, padViolates } from "@/utils";
export default {
  components: {
    TimeStrategy
  },
  data() {
    return {
      showLoading: false,
      searchForm: {
        name: "",
        page: 1,
        size: 10,
        list: [],
        total: 0
      },
      empowerInfo: {
        show: false,
        name: "",
        checked: false,
        padid: null,
        schoolid: null,
        classids: [],
        schoolInfo: {}
      },
      strategyInfo: {
        model: "add", //add添加/edit编辑/see查看
        name: null,
        userid: null,
        rversion: null,
        padid: null,
        show: false,
        hastime: false, // 是否开启时间策略：0否 1是
        padTimes: [], // 平板策略时间
        hasapp: false, //是否开启应用策略：0否 1是
        padApps: [], //appid集合
        hasdevice: false, //是否开启设备策略：0否 1是
        padDevices: [], //授权应用
        haswifi: false, //是否开启wifi白名单策略：0否 1是
        padWifis: [], //wifi白名单
        hasviolate: false, //是否开启违规通知：0否 1是
        padViolates: [] //设备违规
      },
      padDevices,
      padViolates,
      columns1: [
        {
          title: "违规事件",
          slot: "violationEvents",
          align: "center"
        },
        {
          title: "是否通知",
          slot: "noticed",
          align: "center"
        },
        {
          title: "违规处理",
          slot: "violationHandling",
          align: "center"
        }
      ],
      columns2: [
        {
          title: "操作",
          slot: "active",
          align: "center",
          width: 120
        },
        {
          title: "策略名称",
          key: "name",
          align: "center"
        },
        {
          title: "更新时间",
          key: "updatetime",
          align: "center"
        }
      ],
      weeks: [
        {
          title: "星期日",
          id: 7
        },
        {
          title: "星期一",
          id: 1
        },
        {
          title: "星期二",
          id: 2
        },
        {
          title: "星期三",
          id: 3
        },
        {
          title: "星期四",
          id: 4
        },
        {
          title: "星期五",
          id: 5
        },
        {
          title: "星期六",
          id: 6
        }
      ],
      ssidName: "",
      columns: [
        {
          title: "序号",
          align: "center",
          width: 70,
          render: (h, params) => {
            return h(
              "span",
              params.index +
                (this.searchForm.page - 1) * this.searchForm.size +
                1
            );
          }
        },
        {
          title: "策略名称",
          key: "name",
          align: "center"
        },
        {
          title: "操作人",
          key: "updatename",
          align: "center"
        },
        {
          title: "操作时间",
          key: "updatetime",
          align: "center"
        },
        {
          title: "操作",
          slot: "actionSlot",
          width: 280,
          align: "center"
        }
      ]
    };
  },
  computed: {
    powerParams() {
      return this.$store.getters.powerParams;
    }
  },
  created() {
    this.searchList();
  },
  methods: {
    headleStrategy(row, key) {
      this.padViolates.forEach((item) => {
        if (item.violateType === row.violateType) {
          item[key] = row[key];
        }
      });
    },
    HandleIsShowChange(show, type) {
      if (!show) {
        if (type === 1) {
          this.strategyInfo.padTimes = []; // 平板策略时间
        } else if (type === 2) {
          this.padApps.forEach((item) => {
            item.checked = false;
          });
        } else if (type === 3) {
          this.padDevices.forEach((item) => {
            item.enabled = item.pdorder === 1 ? 1 : item.pdorder === 2 ? 1 : 2;
          });
        } else if (type === 4) {
          this.strategyInfo.padWifis = []; //wifi白名单
        } else if (type === 5) {
          this.padViolates.forEach((item) => {
            item.checked = false;
            item.noticed = false;
            item.handleMethod = "";
          });
        }
      }
    },
    stPadChange(row) {
      //切换选择
      this.stPadInfo.list.forEach((item) => {
        item.checked = item.padid === row.padid ? true : false;
      });
    },
    getTime(time) {
      return time;
    },
    getDay(id) {
      //获取当天时间
      let arr = this.strategyInfo.padTimes.filter((v) => v.week === id);
      return arr;
    },
    timesChange(times) {
      this.strategyInfo.padTimes = times;
    },
    save() {
      if (!this.strategyInfo.name) {
        this.$Message.error("请输入策略名称!");
        return;
      }
      if (
        !this.strategyInfo.hastime &&
        !this.strategyInfo.hasapp &&
        !this.strategyInfo.hasdevice &&
        !this.strategyInfo.haswifi &&
        !this.strategyInfo.hasviolate
      ) {
        this.$Message.error("请选择策略!");
        return;
      }
      let padDevices = [],
        padViolates = [],
        padApps = [];
      //获取授权应用
      for (let item of this.padApps) {
        if (item.checked) {
          padApps.push(item.appid);
        }
      }

      //获取设备
      for (let item of this.padDevices) {
        padDevices.push({
          pdtype: item.pdtype,
          pdorder: item.pdorder,
          enabled: item.enabled
        });
      }
      //获取违规处理
      for (let item of this.padViolates) {
        if (item.checked) {
          padViolates.push({
            violateType: item.violateType,
            handleMethod: item.handleMethod || "",
            noticed: item.noticed ? 1 : 0
          });
        }
      }
      if (this.strategyInfo.hastime) {
        if (this.strategyInfo.padTimes.length === 0) {
          this.$Message.error("请选择时间限制!");
          return;
        }
      }
      if (this.strategyInfo.hasapp) {
        if (padApps.length === 0) {
          this.$Message.error("请选择授权应用!");
          return;
        }
      }
      if (this.strategyInfo.hasdevice) {
        if (padDevices.length === 0) {
          this.$Message.error("请选择设备!");
          return;
        }
      }
      if (this.strategyInfo.haswifi) {
        if (this.strategyInfo.padWifis.length === 0) {
          this.$Message.error("请输入SSID!");
          return;
        }
      }
      if (this.strategyInfo.hasviolate) {
        if (padViolates.length === 0) {
          this.$Message.error("请选择违规事件!");
          return;
        }
        //违规处理选项
        for (let item of padViolates) {
          if (!item.handleMethod) {
            this.$Message.error("请选择违规处理!");
            return;
          }
        }
      }
      let form = {
        name: this.strategyInfo.name,
        sttype: 0, //0公共 1学校策略 2班级策略 3个人策略
        objectid: this.powerParams.objectid,
        hastime: this.strategyInfo.hastime ? 1 : 0,
        hasapp: this.strategyInfo.hasapp ? 1 : 0,
        hasdevice: this.strategyInfo.hasdevice ? 1 : 0,
        haswifi: this.strategyInfo.haswifi ? 1 : 0,
        hasviolate: this.strategyInfo.hasviolate ? 1 : 0,
        padTimes: this.strategyInfo.hastime ? this.strategyInfo.padTimes : [],
        padDevices: this.strategyInfo.hasdevice ? padDevices : [],
        padViolates: this.strategyInfo.hasviolate ? padViolates : [],
        padWifis: this.strategyInfo.haswifi ? this.strategyInfo.padWifis : [],
        padApps: this.strategyInfo.hasapp ? padApps : []
      };
      if (this.strategyInfo.model === "编辑") {
        //编辑
        form.padid = this.strategyInfo.padid;
        form.rversion = this.strategyInfo.rversion;
      }
      let api = this.strategyInfo.model === "编辑" ? stPad_edit : stPad_add;
      this.showLoading = true;
      api(form).then((res) => {
        this.showLoading = false;
        if (res.code === 0) {
          this.$Message.success(res.msg);
          this.searchList();
          this.strategyInfo.show = false;
        } else {
          this.$Message.error(res.msg);
        }
      });
    },
    delWifi(val) {
      //删除wifi白名单
      this.strategyInfo.padWifis = this.strategyInfo.padWifis.filter(
        (v) => v != val
      );
    },
    AddWifi() {
      //添加wifi白名单
      if (!this.ssidName) {
        return;
      }
      this.strategyInfo.padWifis.push(this.ssidName);
      this.strategyInfo.padWifis = Array.from(
        new Set(this.strategyInfo.padWifis)
      );
      this.ssidName = "";
    },
    saveEmpowerInfo() {
      //保存授权
      if (this.empowerInfo.classids.length === 0 && !this.empowerInfo.checked) {
        this.$Message.error("请选择学校/班级!");
        return;
      }
      let form = {
        padid: this.empowerInfo.padid
      };
      if (this.empowerInfo.checked) {
        form.schoolid = this.empowerInfo.schoolid;
      }
      if (this.empowerInfo.classids.length > 0) {
        form.classids = this.empowerInfo.classids;
      }
      this.empowerInfo.show = true;
      stPad_add_empower(form).then((data) => {
        if (data.code === 0) {
          this.empowerInfo.show = false;
          this.$Message.success(data.msg);
          this.searchList();
        } else {
          this.$Message.error(data.msg);
        }
      });
    },
    // 搜索
    searchList() {
      this.searchForm.page = 1;
      this.getList();
    },
    // 页码改变
    pageChange(page) {
      this.searchForm.page = page;
      this.getList();
    },
    // 每页显示数量改变
    pageSizeChange(size) {
      this.searchForm.size = size;
      this.searchForm.page = 1;
      this.getList();
    },
    initData() {
      //数据初始化
      this.strategyInfo.padTimes = []; // 平板策略时间
      this.strategyInfo.padWifis = []; //wifi白名单
      this.padDevices.forEach((item) => {
        item.enabled = item.pdorder === 1 ? 1 : item.pdorder === 2 ? 1 : 2;
      });
      this.padViolates.forEach((item) => {
        item.checked = false;
        item.noticed = false;
        item.handleMethod = "";
      });
      this.padApps.forEach((item) => {
        item.checked = false;
      });
    },
    // 获取列表
    getList() {
      this.showLoading = true;
      stPad_list({
        size: this.searchForm.size,
        page: this.searchForm.page,
        name: this.searchForm.name,
        schoolid: this.powerParams.objectid
      }).then((res) => {
        this.showLoading = false;
        if (res.code === 0) {
          this.searchForm.list = res.obj.data;
          this.searchForm.total = res.obj.total;
        } else {
          this.$Message.error(res.msg);
        }
      });
    },
    // 新建
    async toAdd() {
      await this.getAppList();
      this.initData();
      this.strategyInfo = {
        model: "新建", //添加
        name: null,
        padid: null,
        rversion: null,
        show: true,
        hastime: false, // 是否开启时间策略：0否 1是
        padTimes: [], // 平板策略时间
        hasapp: false, //是否开启应用策略：0否 1是
        padApps: [], //appid集合
        hasdevice: false, //是否开启设备策略：0否 1是
        padDevices: [], //授权应用
        haswifi: false, //是否开启wifi白名单策略：0否 1是
        padWifis: [], //wifi白名单
        hasviolate: false, //是否开启违规通知：0否 1是
        padViolates: [] //设备违规
      };
    },
    async getAppList() {
      //获取应用列表
      this.showLoading = true;
      let res = await app_list_sel({
        rtype: this.powerParams.rtype,
        objectid: this.powerParams.objectid
      });
      this.showLoading = false;
      if (res.code === 0) {
        this.padApps = res.obj.map((v) => {
          v.checked = false;
          return v;
        });
      } else {
        this.$Message.error(res.msg);
      }
    },
    // 编辑
    async toEdit(row, type) {
      //type 1查看 2编辑
      await this.getAppList();
      this.initData();
      this.showLoading = true;
      stPad_detail({ padid: row.padid }).then((res) => {
        this.showLoading = false;
        if (res.code === 0) {
          //数据回显
          this.strategyInfo.model = type === 1 ? "查看" : "编辑";
          this.strategyInfo.name = res.obj.name;
          this.strategyInfo.username = row.username;
          this.strategyInfo.padid = res.obj.padid;
          this.strategyInfo.userid = row.userid;
          this.strategyInfo.rversion = res.obj.rversion;
          this.strategyInfo.hastime = res.obj.hastime ? true : false;
          this.strategyInfo.hasapp = res.obj.hasapp ? true : false;
          this.strategyInfo.hasdevice = res.obj.hasdevice ? true : false;
          this.strategyInfo.haswifi = res.obj.haswifi ? true : false;
          this.strategyInfo.hasviolate = res.obj.hasviolate ? true : false;
          if (this.strategyInfo.hastime) {
            this.strategyInfo.padTimes = res.obj.padTimes || [];
          }
          if (this.strategyInfo.hasapp) {
            //回显应用策略
            this.padApps.forEach((item) => {
              let ishas = res.obj.padApps.some((v) => {
                return v.appid === item.appid;
              });
              item.checked = ishas ? true : false;
            });
          }
          if (this.strategyInfo.hasdevice) {
            //回显设备策略
            this.padDevices.forEach((item) => {
              let obj = res.obj.padDevices.filter((v) => {
                return v.pdtype === item.pdtype;
              })[0] || { enabled: 2 };
              item.enabled = obj.enabled;
            });
          }
          if (this.strategyInfo.padWifis) {
            this.strategyInfo.padWifis = res.obj.padWifis || [];
          }
          if (this.strategyInfo.hasviolate) {
            //回显违规处理
            this.padViolates.forEach((item) => {
              let arr = res.obj.padViolates.filter((v) => {
                return v.violateType === item.violateType;
              });
              item.checked = arr.length > 0 ? true : false;
              item.noticed = arr.length > 0 && arr[0].noticed ? true : false;
              item.handleMethod = arr.length > 0 ? arr[0].handleMethod : "";
            });
          }
          this.strategyInfo.show = true;
        } else {
          this.$Message.error(res.msg);
        }
      });
    },
    // 删除
    toDel(row) {
      this.$Modal.confirm({
        title: "提示",
        content: "确定要删除用户【" + row.name + "】上的个人策略吗？",
        onOk: () => {
          this.showLoading = true;
          stPad_delete({
            padid: row.padid,
            rversion: row.rversion
          }).then((res) => {
            this.showLoading = false;
            if (res.code === 0) {
              this.searchList();
            } else {
              this.$Message.error(res.msg);
            }
          });
        },
        onCancel: () => {}
      });
    },
    toEmpower(row) {
      //授权
      this.showLoading = true;
      class_list_strategy({
        schoolid: this.powerParams.objectid,
        st: "pad"
      }).then((res) => {
        this.showLoading = false;
        if (res.code === 0) {
          this.empowerInfo = {
            show: true,
            name: row.name,
            schoolInfo: res.obj,
            checked: false,
            padid: row.padid,
            schoolid: res.obj.id,
            classids: []
          };
        } else {
          this.$Message.error(res.msg);
        }
      });
    }
  }
};
</script>

<style lang="less" scoped>
.search_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 16px 16px;
  .search_left {
    display: flex;
    justify-content: flex-start;
    align-items: center;
  }
}
.view_title {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 16px;
  font-size: 18px;
  font-weight: bold;
  text-align: center;
}
.empowerInfo {
  .schoolname {
    color: #253a70;
    font-size: 16px;
    font-weight: 600;
    line-height: 40px;
    font-family: "SourceHanSansCN";
  }
  .school_list {
    display: flex;
    flex-wrap: wrap;
    .school_item {
      color: #253a70;
      font-size: 16px;
      font-weight: 500;
      font-family: "SourceHanSansCN";
      margin: 0 20px 16px 0;
    }
  }
}
.content {
  .titles {
    height: 40px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    .require {
      width: 80px;
      color: #253a70;
      font-size: 16px;
      font-weight: 400;
      font-family: "SourceHanSansCN";
      margin-right: 10px;
      &::before {
        content: "*" !important;
        display: inline-block;
        margin-right: 4px;
        line-height: 1;
        font-family: SimSun;
        font-size: 14px;
        color: #ed4014;
      }
    }
  }
  .strategy_list {
    font-family: "SourceHanSansCN";
    .strategy_title {
      height: 40px;
      font-size: 16px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      div:first-of-type {
        font-weight: bold;
        span {
          font-size: 22px;
          color: #339dff;
          margin-right: 4px;
        }
      }
      div:last-of-type {
      }
    }
    .strategy_content {
      border-radius: 6px 6px 0 0;
      border: 1px solid #ced9f2;
      .strategy_top {
        display: flex;
        height: 46px;
        align-items: center;
        background: #edf3ff;
        padding-left: 20px;
        border-bottom: 1px solid #ced9f2;
        span {
          font-size: 16px;
          color: #253a70;
          font-weight: 400;
          font-family: "SourceHanSansCN";
        }
      }
      .strategy_bottom {
        display: flex;
        flex-wrap: wrap;
        padding: 20px;
        .app_list {
          margin: 0 16px 16px 0;
          width: 100px;
          height: 110px;
          border-radius: 10px;
          border: 1px solid #798cb51a;
          background: #ffffff;
          text-align: center;
          position: relative;
          img {
            margin: 16px 0;
            width: 40px;
            height: 40px;
            object-fit: cover;
          }
          .checked {
            position: absolute;
            right: 2px;
            top: 8px;
            /deep/ .ivu-checkbox-inner {
              border-radius: 50%;
            }
          }
          &:hover {
            cursor: pointer;
            box-shadow: 10px 10px 20px 0 #339dff26;
          }
        }
        .device_list {
          display: flex;
          height: 80px;
          align-items: center;
          margin-right: 40px;
          .icon {
            width: 56px;
            height: 56px;
            border-radius: 6px;
            border: 1px solid #e5e5e5;
            display: flex;
            align-items: center;
            justify-content: center;
            span {
              font-size: 28px;
              color: #339dff;
            }
          }
          .title {
            width: 92px;
            margin: 0 10px;
          }
        }
        .padWifis {
          border-radius: 5px;
          border: 1px solid #339dff;
          background: #eaf5ff;
          padding: 4px 20px 4px 16px;
          height: 26px;
          margin: 0 20px 10px 0;
          position: relative;
          .title {
            line-height: 14px;
          }
          img {
            width: 16px;
            height: 16px;
            object-fit: cover;
            position: absolute;
            right: -4px;
            top: -8px;
            cursor: pointer;
          }
        }
      }
    }
    .nodata {
      color: #798cb5;
      font-size: 16px;
      line-height: 30px;
    }
  }
  .showtime {
    .week {
      display: flex;
      width: 100%;
      .day {
        width: 14.2%;
        border: 1px solid #ced9f2;
        border-right: none;
        &:last-of-type {
          border-right: 1px solid #ced9f2;
        }
        .day_title {
          width: 100%;
          height: 40px;
          line-height: 40px;
          background: #edf3ff;
          border-bottom: 1px solid #ced9f2;
          text-align: center;
        }
        .day_content {
          min-height: 50px;
          padding: 10px;
          .time {
            height: 30px;
            line-height: 30px;
            border-radius: 6px;
            background: #dbeeff;
            text-align: center;
            color: #339dff;
            font-size: 14px;
            font-weight: 500;
            margin-top: 10px;
            font-family: "SourceHanSansCN";
          }
        }
      }
    }
  }
}
</style>
