<template>
  <div class="content-box" v-load="loading">
    <div class="left">
      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
      <div class="cameratxt">系统设置</div>
    </div>
    <!-- <div class="system_title">
      <h4>选宿舍缴费设置</h4>
      <span class="wain">（达到设置的缴费金额才支持线上选宿舍操作）</span>
    </div>
    <ul>
      <div class="add">
        <div
          v-if="!updateShow"
          @click="payFeesAdd"
          style="display: flex; align-items: center"
        >
          <img
            style="width: 18px; margin-right: 8px"
            src="@/assets/img/add_1.png"
            alt=""
          />新增
        </div>
      </div>
      <li v-for="(item, index) in params.psvs" :key="item">
        <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="item.isCheck"
          size="large"
        ></el-checkbox>
        <el-select
          style="width: 180px; margin-right: 15px"
          v-model="item.school"
          class="m-2"
          placeholder="请选择校区"
          :disabled="updateShow"
        >
          <el-option
            v-for="i in schoolData"
            :key="i.id"
            :label="i.school"
            :value="i.school"
          />
        </el-select>
        <el-select
          style="width: 180px; margin-right: 15px"
          v-model="item.method"
          class="m-2"
          placeholder="请选择缴费类型"
          :disabled="updateShow"
        >
          <el-option label="全部" value="全部" />
          <el-option label="预收教材费" value="预收教材费" />
          <el-option label="体检费" value="体检费" />
          <el-option label="空调租赁使用费" value="空调租赁使用费" />
          <el-option label="自主定价民办学历教育学费" value="自主定价民办学历教育学费" />
          <el-option label="自主定价民办学历教育住宿费" value="学费" />
        </el-select>
        <el-input
          :disabled="updateShow"
          v-model.trim="item.payAmount"
          class="w-50 m-2"
          placeholder="请输入金额"
          style="width: 180px; margin-right: 15px"
        />
        <div class="delete" v-if="!updateShow" @click="psvs(item, index)">
          <SvgIcon name="delete" color="#fff" size="20"></SvgIcon>
          &nbsp;删除
        </div>
      </li>
    </ul> -->
    
    <!-- <div class="system_title">
      <h4>宿舍开放比例设置</h4>
    </div>
    <ul>
      <div class="add">
        <div
          v-if="!updateShow"
          @click="dormitoryAdd"
          style="display: flex; align-items: center"
        >
          <img
            style="width: 18px; margin-right: 8px"
            src="@/assets/img/add_1.png"
            alt=""
          />新增
        </div>
      </div>
      <li v-for="(item, index) in params.osvs" :key="item">
        <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="item.isCheck"
          size="large"
        ></el-checkbox>
        <el-select
          style="width: 180px; margin-right: 15px"
          v-model="item.school"
          class="m-2"
          :disabled="updateShow"
          placeholder="请选择校区"
        >
          <el-option
            v-for="i in schoolData"
            :key="i.id"
            :label="i.school"
            :value="i.school"
          />
        </el-select>
        <el-select
          style="width: 180px; margin-right: 15px"
          v-model="item.college"
          class="m-2"
          :disabled="updateShow"
          placeholder="请选择所属学院"
        >
          <el-option
            v-for="i in collegeData"
            :key="i.id"
            :label="i.name"
            :value="i.name"
          />
        </el-select>
        <el-input
          v-model.trim="item.openAmount"
          :disabled="updateShow"
          placeholder="请输入占比"
          clearable
          style="width: 180px; margin-right: 20px"
        />
        <div class="delete" v-if="!updateShow" @click="osvs(item, index)">
          <SvgIcon name="delete" color="#fff" size="20"></SvgIcon>
          &nbsp;删除
        </div>
      </li>
    </ul> -->
    <div class="system_title">
      <h4>迎新期间每天限制车位数设置</h4>
    </div>
    <ul>
      <li>
        <!-- <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="params.isCheck"
          size="large"
        ></el-checkbox> -->
        <!-- <el-select
          style="width: 180px; margin-right: 15px"
          v-model="params.school"
          class="m-2"
          placeholder="请选择校区"
          :disabled="updateShow"
        >
          <el-option
            v-for="i in schoolData"
            :key="i.id"
            :label="i.school"
            :value="i.school"
          />
        </el-select> -->
        <span>墨轩湖校区&nbsp;&nbsp;&nbsp;&nbsp;</span>
        <el-input
          :disabled="updateShow"
          v-model.number="params.mxhCarNum"
          class="w-50 m-2"
          placeholder="请输入车位数"
          style="width: 220px; margin-right: 15px"
        />
      </li>
      <li>
        <!-- <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="params.isCheck"
          size="large"
        ></el-checkbox> -->
        <!-- <el-select
          style="width: 180px; margin-right: 15px"
          v-model="params.school"
          class="m-2"
          placeholder="请选择校区"
          :disabled="updateShow"
        >
          <el-option
            v-for="i in schoolData"
            :key="i.id"
            :label="i.school"
            :value="i.school"
          />
        </el-select> -->
        <span>黄家湖校区&nbsp;&nbsp;&nbsp;&nbsp;</span>
        <el-input
          :disabled="updateShow"
          v-model.number="params.hjhCarNum"
          class="w-50 m-2"
          placeholder="请输入车位数"
          style="width: 220px; margin-right: 15px"
        />
      </li>
      <!-- <li>
        <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="params.isCheck"
          size="large"
        ></el-checkbox>
        <el-select
          style="width: 180px; margin-right: 15px"
          v-model="params.school"
          class="m-2"
          placeholder="请选择校区"
          :disabled="updateShow"
        >
          <el-option
            v-for="i in schoolData"
            :key="i.id"
            :label="i.school"
            :value="i.school"
          />
        </el-select>
        <el-input
          :disabled="updateShow"
          v-model.number="params.carNum"
          class="w-50 m-2"
          placeholder="请输入车位数"
          style="width: 220px; margin-right: 15px"
        />
      </li> -->
    </ul>
    <!-- <div class="system_title">
      <h4>到站时间段设置</h4>
    </div>
    <ul>
      <div class="add">
        <div
          v-if="!updateShow"
          @click="stationAdd"
          style="display: flex; align-items: center"
        >
          <img
            style="width: 18px; margin-right: 8px"
            src="@/assets/img/add_1.png"
            alt=""
          />新增
        </div>
      </div>
      <li style="width: 415px" v-for="(item, index) in params.asvs" :key="item">
        <el-checkbox
          :true-value="1"
          :false-value="0"
          :disabled="updateShow"
          v-model="item.isCheck"
          size="large"
        ></el-checkbox>
        <el-time-picker
          v-model="item.times"
          :disabled="updateShow"
          is-range
          range-separator="-"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
          format="HH:mm"
          value-format="HH:mm"
        />
        <div
          v-if="!updateShow"
          @click="asvs(item, index)"
          class="delete"
          style="margin-left: 15px; width: 100px"
        >
          <SvgIcon name="delete" color="#fff" size="20"></SvgIcon>
          &nbsp;删除
        </div>
      </li>
    </ul> -->
    <div class="system_title">
      <h4>系统管理员联系方式设置</h4>
    </div>
    <ul>
      <div class="add">
        <!-- <SvgIcon name="add" color="#fff" size="22"></SvgIcon>&nbsp;新增 -->
        <div
          v-if="!updateShow"
          @click="phoneAdd"
          style="display: flex; align-items: center"
        >
          <img
            style="width: 18px; margin-right: 8px"
            src="@/assets/img/add_1.png"
            alt=""
          />新增
        </div>
      </div>
      <li v-for="(item, index) in phones" :key="item">
        <span style="font-size: 12px">联系电话：</span>
        <el-input
          :disabled="updateShow"
          v-model.trim="item.phone"
          class="w-50 m-2"
          placeholder="请输入联系电话"
          style="width: 220px; margin-right: 15px"
        />
        <div class="delete" v-if="!updateShow" @click="delPhone(item, index)">
          <SvgIcon name="delete" color="#fff" size="20"></SvgIcon>
          &nbsp;删除
        </div>
      </li>
    </ul>
    <div class="system_title">
      <h4>温馨提示文本设置</h4>
    </div>
    <ul>
      <li>
        <div class="warning_title" style="margin-right: 15px">安全告知：</div>
        <!-- <el-input
          v-model="params.safetyNotice"
          placeholder="请输入内容"
          :autosize="{ minRows: 4, maxRows: 8 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        /> -->
        <Richtext
          v-if="richtextShow"
          @richtextClick="richtextClick"
          :fatherMessage="fatherMessage"
        ></Richtext>
        <div v-else style="width: 100%; height: 243px">
          <!-- <Richtext
            @richtextClick="richtextClick"
            :fatherMessage="fatherMessage"
          ></Richtext> -->
        </div>
      </li>
      <li>
        <div class="warning_title">基本信息核对：</div>
        <el-input
          v-model="params.basicVerification"
          placeholder="请输入内容"
          :autosize="{ minRows: 2, maxRows: 4 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        />
      </li>
      <li>
        <div class="warning_title">家庭信息填报：</div>
        <el-input
          v-model="params.familyInfo"
          placeholder="请输入内容"
          :autosize="{ minRows: 2, maxRows: 4 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        />
      </li>
      <li>
        <div class="warning_title">到校信息填报：</div>
        <el-input
          v-model="params.arriveSchool"
          placeholder="请输入内容"
          :autosize="{ minRows: 5, maxRows: 8 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        />
      </li>
      <li>
        <div class="warning_title">未缴费在线选宿舍：</div>
        <el-input
          v-model="params.chooseDormitory"
          placeholder="请输入内容"
          :autosize="{ minRows: 4, maxRows: 10 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        />
      </li>
      <li>
        <div class="warning_title">未缴费车牌预约：</div>
        <el-input
          v-model="params.carOrder"
          placeholder="请输入内容"
          :autosize="{ minRows: 4, maxRows: 8 }"
          type="textarea"
          :disabled="updateShow"
          style="margin-left: 15px"
        />
      </li>
    </ul>
    <ul
      style="margin: 15px 0"
      v-if="store.BtnRole('settingManagementSetting1')"
    >
      <li>
        <el-button
          v-if="updateShow"
          type="primary"
          style="margin-right: 10px; color: #fff"
          color="rgba(38, 151, 255, 1)"
          @click="updateSystem"
          >修改</el-button
        >
        <el-button
          v-if="!updateShow"
          type="primary"
          style="color: #fff"
          color="rgba(38, 151, 255, 1)"
          @click="cancelSystem"
          >取消</el-button
        >
        <el-button
          v-if="!updateShow"
          type="primary"
          style="color: #fff"
          color="rgba(38, 151, 255, 1)"
          @click="saveSystem"
          >保存提交</el-button
        >
      </li>
    </ul>
    <!-- 系统设置新增弹窗 -->
    <el-dialog
      class="addfamilys"
      v-model="addfamilysVisible"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :title="addfamilysTitle"
      align-center
      width="560"
      :before-close="cancelAddfamilys"
      destroy-on-close
      draggable
    >
      <el-form
        ref="addfamilysRef"
        :model="addfamilysRuleForm"
        :rules="addfamilysRules"
        label-width="100px"
        class="demo-ruleForm"
        :size="formSize"
        label-position="right"
        status-icon
      >
        <!-- 先宿舍缴费设置 -->
        <div v-if="addfamilysTitle == '新增选宿舍缴费'">
          <el-form-item label="校区 :" prop="school">
            <el-select
              clearable
              v-model="addfamilysRuleForm.school"
              placeholder="请选择校区名称"
            >
              <el-option
                v-for="i in schoolData"
                :key="i.id"
                :label="i.school"
                :value="i.school"
              />
            </el-select>
          </el-form-item>
          <el-form-item prop="method" label="支付类型 :">
            <el-select
              clearable
              v-model="addfamilysRuleForm.method"
              placeholder="请选择缴费类型"
            >
              <el-option label="全部" value="全部" />
              <el-option label="学杂费" value="学杂费" />
              <el-option label="住宿费" value="住宿费" />
            </el-select>
          </el-form-item>
          <el-form-item label="金额 :" prop="payAmount">
            <el-input
              v-model.number="addfamilysRuleForm.payAmount"
              placeholder="请输入金额"
              clearable
              style="width: 420px"
            />
          </el-form-item>
          <el-form-item label="是否启用 :">
            <el-switch
              :active-value="1"
              :inactive-value="0"
              v-model="addfamilysRuleForm.isCheck"
            />
          </el-form-item>
        </div>
        <!-- 新增宿舍开放比例 -->
        <div v-if="addfamilysTitle == '新增宿舍开放比例'">
          <el-form-item label="校区 :" prop="school">
            <el-select
              clearable
              v-model="addfamilysRuleForm.school"
              placeholder="请选择校区名称"
            >
              <el-option
                v-for="i in schoolData"
                :key="i.id"
                :label="i.school"
                :value="i.school"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="所属学院 :" prop="college">
            <el-select
              v-model="addfamilysRuleForm.college"
              placeholder="请选择所属学院"
              clearable
            >
              <el-option
                v-for="i in collegeData"
                :key="i.id"
                :label="i.name"
                :value="i.name"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="占比 :" prop="openAmount">
            <el-input
              v-model.trim="addfamilysRuleForm.openAmount"
              placeholder="请输入占比"
              clearable
              style="width: 420px"
            />
          </el-form-item>
          <el-form-item label="是否启用 :">
            <el-switch
              :active-value="1"
              :inactive-value="0"
              v-model="addfamilysRuleForm.isCheck"
            />
          </el-form-item>
        </div>
        <!-- 新增到站时间段 -->
        <div v-if="addfamilysTitle == '新增到站时间段'">
          <el-form-item label="时间段 :" prop="times">
            <el-time-picker
              v-model="addfamilysRuleForm.times"
              is-range
              range-separator="-"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              format="HH:mm"
              value-format="HH:mm"
            />
          </el-form-item>
          <el-form-item label="是否启用 :">
            <el-switch
              :active-value="1"
              :inactive-value="0"
              v-model="addfamilysRuleForm.isCheck"
            />
          </el-form-item>
        </div>

        <el-form-item class="options">
          <el-button @click="cancelAddfamilys">取消</el-button>
          <el-button
            color="rgba(0, 97, 255, 1)"
            class="queding"
            type="primary"
            @click="submitAddfamilys(addfamilysRef)"
          >
            确定
          </el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script setup>
import {
  ref,
  watch,
  reactive,
  nextTick,
  onMounted,
  onBeforeMount,
  onUnmounted,
} from "vue";
import { useRouter } from "vue-router";
import { ElMessage, ElMessageBox } from "element-plus";
import { dayjs } from "element-plus";
import lodash from "lodash";
import { https } from "@/utils/request"; // 绝对路径

import { storeToRefs } from "pinia";
import { useCounterStore } from "@/stores/index";
import Richtext from "../richtext/richtext.vue";

const store = useCounterStore();

// 传给子组件的参数
const fatherMessage = ref({
  data: "",
  flag: false,
});
const richtextShow = ref(false);
// 富文本传过来的数据
const richtextClick = (data) => {
  console.log(data, "富文本传过来的数据");
  params.value.safetyNotice = data.html;
  // fatherMessage.value.data=data.html
  // accountRuleForm.contentText = data.text;
};

// 为避免解构时失去响应性
const { name, age, isCollapse, realAge } = storeToRefs(store);

//////////////////////////////////////
// 缴费设置
const payFees = ref([
  { place: [], pay: [], money: "" },
  { place: [], pay: [], money: "" },
]);
// 学校地点
const placeList = ref([
  { name: "墨轩湖", id: 1 },
  { name: "黄家湖", id: 2 },
]);
// 缴费类型
const payMuch = ref([
  { name: "全部", id: 1 },
  { name: "住宿费", id: 2 },
]);
// 缴费多少
const payMoney = ref();
///////////////////////////////////////

// 每天车位限制数
const carNumber = ref();
const schoolData = ref();
const collegeData = ref();

// 添加弹窗
const addfamilysRef = ref();
const addfamilysVisible = ref(false);
const addfamilysTitle = ref();
const addfamilysRuleForm = reactive({
  isCheck: false,
  school: "",
  method: "",
  payAmount: "",

  college: "",
  openAmount: "",

  times: [],
});
const addfamilysRules = reactive({
  school: [{ required: true, message: "校区不能为空", trigger: "blur" }],
  method: [{ required: true, message: "缴费类型不能为空", trigger: "blur" }],
  payAmount: [{ required: true, message: "金额不能为空", trigger: "blur" }],

  college: [{ required: true, message: "学院不能为空", trigger: "blur" }],
  openAmount: [{ required: true, message: "占比不能为空", trigger: "blur" }],

  times: [{ required: true, message: "联系电话不能为空", trigger: "blur" }],
});
const params = ref({
  psvs: [],
  osvs: [],
  // carNum: null,
  hjhCarNum: null,
  mxhCarNum: null,
  asvs: [],
  phones: [],
  safetyNotice: null,
  basicVerification: null,
  familyInfo: null,
  arriveSchool: null,
  chooseDormitory: null,
  carOrder: null,
});

let phones = ref();
const loading = ref();
const updateShow = ref(true);

// 获取账户列表
const getList = async () => {
  loading.value = true;
  let res = await https.get(
    "/welcome/api/systemSetting/querySettings",
    "params"
  );
  console.log(res, "系统设置");
  if (res.code == 200) {
    params.value.psvs = res.data.psvs;
    params.value.osvs = res.data.osvs;
    params.value.hjhCarNum = res.data.hjhCarNum;
    params.value.mxhCarNum = res.data.mxhCarNum;
    res.data.asvs.forEach((i) => {
      i.times = [i.startTime, i.endTime];
    });
    params.value.asvs = res.data.asvs;

    phones.value = res.data.phones.map((i) => {
      return {
        phone: i,
      };
    });
    // params.value.safetyNotice = res.data.safetyNotice; // 公告
    console.log(res.data.safetyNotice);
    richtextShow.value = false;
    setTimeout(() => {
      richtextShow.value = true;
      fatherMessage.value.flag = false;
      fatherMessage.value.data = res.data.safetyNotice;
    }, 50);

    params.value.basicVerification = res.data.basicVerification;
    params.value.familyInfo = res.data.familyInfo;
    params.value.arriveSchool = res.data.arriveSchool;
    params.value.chooseDormitory = res.data.chooseDormitory;
    params.value.carOrder = res.data.carOrder;
    loading.value = false;
  } else {
    loading.value = false;
    ElMessage({
      type: "error",
      showClose: true,
      message: res.message,
      center: true,
    });
  }
};
// 新增号码
const phoneAdd = () => {
  phones.value.push({
    phone: null,
  });
};
const delPhone = (item, index) => {
  console.log(index);

  phones.value = phones.value.filter((i, ind) => {
    return index != ind;
  });
};

const psvs = (item, index) => {
  console.log(item, index);
  params.value.psvs = params.value.psvs.filter((i, ind) => {
    return index != ind;
  });
};
const osvs = (item, index) => {
  console.log(item, index);
  params.value.osvs = params.value.osvs.filter((i, ind) => {
    return index != ind;
  });
};
const asvs = (item, index) => {
  console.log(item, index);
  params.value.asvs = params.value.asvs.filter((i, ind) => {
    return index != ind;
  });
};

const updateSystem = () => {
  updateShow.value = false;
  richtextShow.value = false;
  setTimeout(() => {
    richtextShow.value = true;
    fatherMessage.value.flag = true;
  }, 0);
};
const cancelSystem = () => {
  updateShow.value = true;
  richtextShow.value = false;
  setTimeout(() => {
    richtextShow.value = true;
    fatherMessage.value.flag = false;
  }, 0);
  getList();
};
const saveSystem = async () => {
  params.value.asvs = params.value.asvs.map((i) => {
    return {
      id: i.id,
      isCheck: i.isCheck,
      startTime: i.startTime,
      endTime: i.endTime,
    };
  });
  params.value.phones = phones.value.map((i) => {
    return i.phone;
  });
  let data = params.value;
  console.log(data);

  let res = await https.post(
    "/welcome/api/systemSetting/insertOrUpdateSettings",
    "data",
    data
  );
  if (res.code == 200) {
    updateShow.value = true;
    getList();
    ElMessage({
      type: "success",
      showClose: true,
      message: res.message,
      center: true,
    });
  } else {
    ElMessage({
      type: "error",
      showClose: true,
      message: res.message,
      center: true,
    });
  }
};

// 选宿舍缴费设置
const payFeesAdd = () => {
  addfamilysTitle.value = "新增选宿舍缴费";
  addfamilysVisible.value = true;
  addfamilysRuleForm.isCheck = null;
  addfamilysRuleForm.school = null;
  addfamilysRuleForm.method = null;
  addfamilysRuleForm.payAmount = null;

  addfamilysRuleForm.college = null;
  addfamilysRuleForm.openAmount = null;

  addfamilysRuleForm.times = [];
};
const dormitoryAdd = () => {
  addfamilysTitle.value = "新增宿舍开放比例";
  addfamilysVisible.value = true;
  addfamilysRuleForm.isCheck = null;
  addfamilysRuleForm.school = null;
  addfamilysRuleForm.method = null;
  addfamilysRuleForm.payAmount = null;

  addfamilysRuleForm.college = null;
  addfamilysRuleForm.openAmount = null;

  addfamilysRuleForm.times = [];
};
const stationAdd = () => {
  addfamilysTitle.value = "新增到站时间段";
  addfamilysVisible.value = true;
  addfamilysRuleForm.name = null;
  addfamilysRuleForm.isCheck = null;
  addfamilysRuleForm.school = null;
  addfamilysRuleForm.method = null;
  addfamilysRuleForm.payAmount = null;

  addfamilysRuleForm.college = null;
  addfamilysRuleForm.openAmount = null;

  addfamilysRuleForm.times = [];
};

const cancelAddfamilys = () => {
  addfamilysVisible.value = false;
  addfamilysRef.value;
};

const submitAddfamilys = lodash.debounce(async (formEl) => {
  if (!formEl) return;
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      if (addfamilysTitle.value == "新增选宿舍缴费") {
        params.value.psvs.push({
          isCheck: addfamilysRuleForm.isCheck,
          school: addfamilysRuleForm.school,
          method: addfamilysRuleForm.method,
          payAmount: addfamilysRuleForm.payAmount,
        });
      } else if (addfamilysTitle.value == "新增宿舍开放比例") {
        params.value.osvs.push({
          isCheck: addfamilysRuleForm.isCheck,
          school: addfamilysRuleForm.school,
          college: addfamilysRuleForm.college,
          openAmount: addfamilysRuleForm.openAmount,
        });
      } else if (addfamilysTitle.value == "新增到站时间段") {
        params.value.asvs.push({
          isCheck: addfamilysRuleForm.isCheck,
          startTime: addfamilysRuleForm.times[0],
          endTime: addfamilysRuleForm.times[1],
          times: [addfamilysRuleForm.times[0], addfamilysRuleForm.times[1]],
        });
      }
      addfamilysVisible.value = false;
      console.log(params.value.asvs);
    } else {
      console.log("error submit!", fields);
    }
  });
}, 1000);

const schoolList = async () => {
  let res = await https.get("/welcome/api/welcome-build/schoolGroup", "params");
  console.log(res, "校区数据");
  if (res.code == 200) {
    schoolData.value = res.data;
  } else {
    ElMessage({
      type: "error",
      showClose: true,
      message: res.message,
      center: true,
    });
  }
};
const collegeList = async () => {
  let res = await https.get("/welcome/api/welcomeOrg/getColleges", "params");
  console.log(res, "学院数据");
  if (res.code == 200) {
    collegeData.value = res.data;
  } else {
    ElMessage({
      type: "error",
      showClose: true,
      message: res.message,
      center: true,
    });
  }
};

onMounted(() => {});
onBeforeMount(() => {
  getList();
  schoolList();
  collegeList();
});
onUnmounted(() => {
  // document.removeEventListener("keyup", Enters);
});
</script>

<style scoped lang="scss">
.content-box {
  // min-width: calc(100% - 40px);
  width: calc(100% - 40px);
  height: calc(100% - 105px);
  margin: 20px auto;
  background-color: #fff;
  color: #000;
  display: flex;
  flex-direction: column;
  overflow: auto;
  .left {
    height: 60px;
    margin: 0 30px;
    border-bottom: 1px solid #ccc;
    color: #000;
    font-size: 18px;
    font-weight: 600;

    .cameratxt {
      margin-right: 15px;
      height: 60px;
      line-height: 60px;
    }
  }
  .system_title {
    // width: 100%;
    height: 45px;
    opacity: 1;
    border-radius: 0px 12px 0px 0px;
    background: rgba(247, 251, 255, 1);
    margin: 22px 30px 15px;
    display: flex;
    align-items: center;
    // justify-content: center;
    h4 {
      font-size: 15px;
      padding: 0 5px 0 20px;
    }
    .wain {
      font-size: 13px;
      color: rgba(212, 48, 48, 1);
    }
  }
  ul {
    margin: 0;
    padding: 0 30px 0 40px;
    list-style: none;
    .add {
      color: rgba(0, 97, 255, 1);
      display: flex;
      align-items: center;
      margin-bottom: 10px;
      cursor: pointer;
    }
    .delete {
      display: flex;
      align-items: center;
      color: rgba(212, 48, 48, 1);
      cursor: pointer;
    }
    li {
      display: flex;
      align-items: center;
      margin-bottom: 15px;
      .warning_title {
        font-size: 12px;
        width: 130px;
        text-align: right;
      }
      :deep(.el-checkbox__inner) {
        width: 24px;
        height: 24px;
        margin-right: 15px;
        overflow: hidden;
        &:after {
          width: 30px;
          height: 30px;
          transform: rotate(42deg);
          border: 2px solid transparent;
          left: -11px;
          top: -22px;
        }
      }
      :deep(.el-checkbox__input.is-checked) {
        .el-checkbox__inner:after {
          border-color: #fff;
        }
      }

      :deep(.el-checkbox__input.is-disabled.is-checked) {
        .el-checkbox__inner:after {
          border-color: #b5b5b5;
        }
      }
    }
  }
  :deep(.addfamilys) {
    .el-dialog__body {
      // height: 260px;
      overflow: auto;
      padding: 20px 20px 10px 20px;
      .el-form {
        .el-form-item__content {
          display: flex;
          align-items: normal;
        }
        .options {
          margin-top: 30px;
        }
      }
    }
  }
}
</style>
