<template>
  <div class="container">
    <van-config-provider :theme-vars="themeVars">
      <van-form @submit="onSubmit">
        <div class="title_tab">班次岗位</div>
        <van-field v-model="normalForm.bcmc" required name="班次" is-link readonly label="班次" placeholder="请选择班次"
          input-align="right" :rules="[{ required: true, message: '请选择班次' }]" @click="showbcPicker = true" />

        <van-field readonly v-if="qzsj" v-model="qzsj" input-align="right" label="班次时段" />

        <van-field v-if="normalForm.xffwlx === '2'" v-model="normalForm.kfdMc" name="picker" label="执勤岗"
          input-align="right" is-link readonly placeholder="请选择执勤岗" @click="showkfdPicker = true"
          :rules="[{ required: true, message: '请选择执勤岗' }]" />

        <div class="title_tab">人员车辆</div>
        <van-field v-model="normalForm.jzMc" name="选择警组" input-align="right" label="选择警组" is-link readonly
          placeholder="请选择警组" :rules="[{ required: true, message: '请选择警组' }]" @click="showjzPicker = true" />

        <van-field v-model="normalForm.fzrXm" required readonly input-align="right" name="picker" label="负责人"
          placeholder="请选择负责人" @click="showfzrPicker = true" :rules="[{ required: true, message: '请选择负责人' }]" is-link />

        <van-cell class="mulSelect" title="民警" color="#1989fa">
          <template #right-icon>
            <van-icon @click.stop="showDialogfn('mj')" name="add-o" color="#1989fa" size="22" />
          </template>
          <template #default>
            <div class="selected-box">
              <div class="check-item-tag" v-for="(item, index) in list.mj" :key="index">
                <van-tag color="#7232dd" closeable @close="deleteCheckTag(item, index, 'mj')" plain>{{ item.text
                  }}</van-tag>
                <!-- <van-badge>
                  <van-tag color="#7232dd" plain>{{ item.text }}</van-tag>
                  <template #content>
                    <van-icon
                      name="cross"
                      class="badge-icon"
                      @click="deleteCheckTag(item, index, 'mj')"
                    />
                  </template>
                </van-badge> -->
              </div>
            </div>
          </template>
        </van-cell>
        <van-cell class="mulSelect" title="辅警" color="#1989fa">
          <template #right-icon>
            <van-icon @click.stop="showDialogfn('fj')" name="add-o" color="#1989fa" size="22" />
          </template>
          <template #default>
            <div class="selected-box">
              <div class="check-item-tag" v-for="(item, index) in list.fj" :key="index">
                <van-tag closeable @close="deleteCheckTag(item, index, 'fj')" color="#7232dd" plain>{{ item.text
                  }}</van-tag>
                <!-- <van-badge>
                  <template #content>
                    <van-icon
                      name="cross"
                      class="badge-icon"
                      @click="deleteCheckTag(item, index, 'fj')"
                    />
                  </template>
                </van-badge> -->
              </div>
            </div>
          </template>
        </van-cell>
        <div class="title_tab">装备</div>
        <van-cell class="mulSelect" title="智能装备" color="#1989fa">
          <template #right-icon>
            <van-icon @click.stop="showDialogfn('zn')" name="add-o" color="#1989fa" size="22" />
          </template>
          <template #default>
            <div class="selected-box">
              <div class="check-item-tag" v-for="(item, index) in list.zn" :key="index">
                <van-tag closeable @close="deleteCheckTag(item, index, 'zn')" color="#7232dd" plain>{{ item.text ||
                  item.sbmc }}</van-tag>
                <!-- <van-badge>
                  <template #content>
                    <van-icon
                      name="cross"
                      class="badge-icon"
                      @click="deleteCheckTag(item, index, 'zn')"
                    />
                  </template>
                </van-badge> -->
              </div>
            </div>
          </template>
        </van-cell>
        <van-cell class="mulSelect" title="警用器械" color="#1989fa">
          <template #right-icon>
            <van-icon @click.stop="showDialogfn('jy')" name="add-o" color="#1989fa" size="22" />
          </template>
          <template #default>
            <div class="selected-box">
              <div class="check-item-tag" v-for="(item, index) in list.jy" :key="index">
                <van-tag closeable @close="deleteCheckTag(item, index, 'jy')" color="#7232dd" plain>{{ item.text ||
                  item.qxmc }} * {{ item.qxsl }}</van-tag>
                <!-- <van-badge>
                  <template #content>
                    <van-icon
                      name="cross"
                      class="badge-icon"
                      @click="deleteCheckTag(item, index, 'jy')"
                    />
                  </template>
                </van-badge> -->
              </div>
            </div>
          </template>
        </van-cell>
        <div class="title_tab">巡逻</div>
        <van-cell class="mulSelect" title="巡防车辆" color="#1989fa">
          <template #right-icon>
            <van-icon @click.stop="showDialogfn('cl')" name="add-o" color="#1989fa" size="22" />
          </template>
          <template #default>
            <div class="selected-box">
              <div class="check-item-tag" v-for="(item, index) in list.cl" :key="index">
                <van-tag color="#7232dd" closeable @close="deleteCheckTag(item, index, 'cl')" plain>{{ item.text ||
                  item.jdchphm }}</van-tag>
                <!-- <van-badge>
                  <template #content>
                    <van-icon
                      name="cross"
                      class="badge-icon"
                      @click="deleteCheckTag(item, index, 'cl')"
                    />
                  </template>
                </van-badge> -->
              </div>
            </div>
          </template>
        </van-cell>
        <van-field class="change" name="radio" label="巡逻方式">
          <template #input>
            <van-radio-group v-model="normalForm.xlfs" direction="horizontal" :disabled="disable">
              <van-radio shape="square" checked-color="#3e6ee8" name="1">步巡</van-radio>
              <van-radio shape="square" checked-color="#3e6ee8" name="0">车巡</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field class="change" name="radio" label="着装类型">
          <template #input>
            <van-radio-group v-model="normalForm.zzlx" direction="horizontal" :disabled="disable">
              <van-radio shape="square" checked-color="#3e6ee8" name="0">制服</van-radio>
              <van-radio shape="square" checked-color="#3e6ee8" name="1">便衣</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-field class="change" name="radio" label="武装类型">
          <template #input>
            <van-radio-group v-model="normalForm.wzlx" direction="horizontal" :disabled="disable">
              <van-radio shape="square" checked-color="#3e6ee8" name="0">武装</van-radio>
              <van-radio shape="square" checked-color="#3e6ee8" name="1">非武装</van-radio>
            </van-radio-group>
          </template>
        </van-field>
        <van-row>
          <van-col span="24">
            <van-field rows="3" type="textarea" v-model="normalForm.bz" name="备注" placeholder="备注信息" />
          </van-col>
        </van-row>
        <div v-if="route.query.zt == 0" style="margin: 16px 0; padding: 0 5vw">
          <van-button :loading="loading" round @click="submit" block type="primary">
            开始报备
          </van-button>
        </div>
        <div style="padding: 0 5vw" v-else>
          <van-button style="margin: 16px 0" :loading="loading" round @click="editFn(1)" block type="primary">
            修改
          </van-button>
          <van-button style="margin: 16px 0" :loading="loading" round @click="editFn(0)" block type="success">
            结束报备
          </van-button>
        </div>
      </van-form>
    </van-config-provider>
    <!-- 班次 -->
    <van-popup v-model:show="showbcPicker" position="bottom">
      <van-picker :columns="bcList" @confirm="onbcConfirm" @cancel="showbcPicker = false" />
    </van-popup>
    <van-popup v-model:show="showksPicker" position="bottom">
      <van-datetime-picker v-model="normalForm.ksTime" type="time" title="选择时间" :min-hour="0" :max-hour="23"
        @confirm="onksConfirm" @change="ksChange" @cancel="showksPicker = false" />
    </van-popup>
    <van-popup v-model:show="showjsPicker" position="bottom">
      <van-datetime-picker v-model="normalForm.jsTime" type="time" title="选择时间" :min-hour="0" :max-hour="23"
        @confirm="onjsConfirm" @change="jsChange" @cancel="showjsPicker = false" />
    </van-popup>
    <van-popup v-model:show="showxfqPicker" position="bottom">
      <van-picker :columns="list.xfqList" :columns-field-names="filedxfqNames" @confirm="onxfqConfirm"
        @cancel="showxfqPicker = false" />
    </van-popup>
    <van-popup v-model:show="showkfdPicker" position="bottom">
      <van-picker :columns="list.kfdList" :columns-field-names="filedkfdNames" @confirm="onkfdConfirm"
        @cancel="showkfdPicker = false" />
    </van-popup>
    <!-- 警组 -->
    <van-popup v-model:show="showjzPicker" position="bottom">
      <van-picker :columns="list.jzList" :columns-field-names="customJzFieldName" @confirm="onjzConfirm"
        @cancel="showjzPicker = false" />
    </van-popup>
    <!-- 负责人 -->
    <van-popup v-model:show="showfzrPicker" position="bottom">
      <van-search v-model="list.phone" placeholder="请输入负责人电话号码" @update:model-value="getMJList()" />
      <van-picker :columns="list.fzrList" @confirm="onfzrConfirm" @cancel="showfzrPicker = false"
        :columns-field-names="customfzrFieldNamed" />
    </van-popup>
    <van-popup v-model:show="selfDefinedPopup" :style="{ width: '80%' }">
      <div class="popupTitle">{{ popupTitle }}</div>
      <van-search v-model="list.text" :placeholder="`请输入`" @update:model-value="getJYList(popupTitle)" />
      <div class="check-data-box">
        <van-checkbox-group v-model="checkedList">
          <van-cell-group inset>
            <van-cell v-for="(item, index) in list.mulChooseList" clickable :key="item" :title="`${item.text}`">
              <template #right-icon>
                <van-checkbox :name="item.text" :ref="(el) => (checkboxRefs[index] = el)"
                  @click="toggle(item, index)" />
              </template>
              <template #label v-if="popupTitle === '选择警用器械'">
                数量：
                <van-stepper @change="changeTo(item, index)" v-model="item.sl" integer />
              </template>
            </van-cell>
          </van-cell-group>
        </van-checkbox-group>
      </div>
      <div class="popbtn-box">
        <van-button style="flex: 1" type="default" size="small" @click="selfDefinedPopup = false">取消
        </van-button>
        <van-button style="flex: 1" type="primary" size="small" @click="popSure">确定</van-button>
      </div>
    </van-popup>
    <van-popup v-model:show="showtsfaPicker" position="bottom">
      <van-search v-model="list.famc" placeholder="请输入申请人" @update:model-value="getPoliceList" />
      <van-picker :columns="list.tsfaList" :columns-field-names="customFieldtsfaName" @confirm="ontsfaConfirm"
        @cancel="showtsfaPicker = false" />
    </van-popup>
  </div>
</template>

<script setup>
import { getItem } from "../../../../utils/storage";
import {
  selectDeckList,
  addXFBB,
  editXFBB,
  queryJzList,
  tbJcglXfll,
  getQwdj,
  getQwbc,
  getXfq,
  getPbinfo,
  getBbinfo,
  getKfdInfo,
} from "../../../../api/report.js";
import {
  selectNextPage,
  sysUser,
  getZnzb,
  selectJyqx,
  getXfclList,
  selectKfdList,
} from "../../../../api/patrolBasicInfo";
import {
  getBxdList,
  getMybbToday,
  getMybbTodayNew,
  getMyXfpbToday,
  getBcxx,
  getKfd,
  getXfqs,
  getXlfa,
  finishReport,
} from "../../../../api/common";
import { timeFormat } from "../../../../utils/index";
import { computed, ref, reactive, onMounted, watch } from "vue";
import { useRouter, useRoute } from "vue-router";
import { hintToast } from "../../../../utils/tools.js";
//主题色
const themeType = ref(getStorage("themeSetting"));
const themeVars = ref({
  cellBackgroundColor: themeType.value == "light" ? "#fff" : "#041634",
  fieldInputTextColor: themeType.value == "light" ? "#333" : "#fff",
  fieldLabelColor: themeType.value == "light" ? "#333" : "#fff",
  cellTextColor: themeType.value == "light" ? "#333" : "#fff",
  radioLabelColor: themeType.value == "light" ? "#333" : "#fff",
  cellBorderColor: themeType.value == "light" ? "#dbdbdb" : "#001e6b",
});
const router = useRouter();
const route = useRoute();
const userInfo = getItem("userInfo");
const qzsj = ref("");
const normalForm = reactive({
  bbzt: "0",
  xfrq: timeFormat(new Date()),
  xlfs: "1",
  zzlx: "1",
  wzlx: "2",
  qwdjLabel: "",
  qwdj: "",
  startEndDate: "",
  ksDate: "",
  jsDate: "",
  ksTime: "",
  jsTime: "",
  kssj: "",
  jssj: "",
  jzLabel: "",
  jzMc: "",
  jzId: "",
  xfbmLabel: "",
  xfbm: "",
  xfbmdm: "",
  ssbm: userInfo.deptName,
  ssbmdm: userInfo.deptList[0].deptCode,
  fzrXm: "",
  fzrSfzh: "",
  fzrLxdh: "",
  fzrId: "",
  znzbList: [],
  jyqxList: [],
  clList: [],
  jlList: [],
  bz: "",
  jgts: 0,
  bcmc: "",
  xfbm: "",
  xfbmdm: "",
  xffwid: "",
  xffwlx: "",
  xlfaLx: "01", //巡逻方案xlfaLx
  xfqMc: "",
  kfdMc: "",
  xlfaMc: "",
  xlfaId: "",
  famc: "",
  bbzt: "",
});
const list = reactive({
  columns: [],
  jzList: [],
  ssbmList: [],
  fzrList: [],
  phone: "",
  fzrTotal: 0,
  mjList: [],
  fjList: [],
  fjXm: "",
  mjXm: "",
  zbList: [],
  jyqxList: [],
  clList: [],
  cph: "",
  sbmc: "",
  qxMc: "",
  text: "",
  mulChooseList: [],
  mj: [],
  fj: [],
  zn: [],
  jy: [],
  cl: [],
  scoutsRangeList: [
    {
      text: "巡防区",
      value: "巡防区",
      children: [],
    },
    {
      text: "执勤岗",
      value: "执勤岗",
      children: [],
    },
  ],
  xfqList: [],
  kfdList: [],
  rcfaList: [],
  tsfaList: [],
  bxdMc: "",
  famc: "",
});
function getPbxx() {
  const id = route.query.bbid;
  if (route.query.zt == 1) {
    getBbinfo(id).then((res) => {
      qzsj.value = res.kssj + "-" + res.jssj;
      const data = res;
      getBcxxList(data.qwbcId);
      normalForm.qwbcId = data.qwbcId;
      normalForm.kssj = data.kssj;
      normalForm.jssj = data.jssj;
      normalForm.jzMc = data.jzMc;
      normalForm.jzId = data.jzId;
      normalForm.id = data.id;
      normalForm.jh = data.jh;
      normalForm.fzrXm = data.fzrXm;
      normalForm.fzrSfzh = data.fzrSfzh;
      normalForm.fzrLxdh = data.fzrLxdh;
      normalForm.fzrId = data.fzrId;
      normalForm.bblx = data.bblx;
      normalForm.xlfs = data.xlfs;
      normalForm.zzlx = data.zzlx;
      normalForm.wzlx = data.wzlx;
      // normalForm.xlfaLx=data.xlfaLx
      list.mj = data.jlList
        .filter((item) => item.jllx == "01")
        .map((item) => {
          return { ...item, text: item.jlxm };
        });
      list.fj = data.jlList
        .filter((item) => item.jllx == "02")
        .map((item) => {
          return { ...item, text: item.jlxm };
        });
      list.zn = data.znzbList;
      list.jy = data.jyqxList;
      list.cl = data.clList;
      normalForm.xffwid = data.xffwid;
      normalForm.xffwlx = "2";
      // 查询快返点的详细信息
      getKfdInfo({ id: data.xffwid }).then((res) => {
        normalForm.kfdMc = res.kfdMc;
      });
    });
  } else {
    getPbinfo(route.query.pbid).then((res) => {
      qzsj.value = res.kssj + "-" + res.jssj;
      const data = res;
      getBcxxList(data.qwbcId);
      normalForm.qwbcId = data.qwbcId;
      normalForm.id = data.id;
      normalForm.kssj = data.kssj;
      normalForm.jssj = data.jssj;
      normalForm.jzMc = data.jzMc;
      normalForm.jzId = data.jzId;
      normalForm.jh = data.jh;
      normalForm.fzrXm = data.fzrXm;
      normalForm.fzrSfzh = data.fzrSfzh;
      normalForm.fzrLxdh = data.fzrLxdh;
      normalForm.fzrId = data.fzrId;
      normalForm.bblx = data.bblx;
      normalForm.xlfs = data.xlfs;
      normalForm.zzlx = data.zzlx;
      normalForm.wzlx = data.wzlx;
      // normalForm.xlfaLx=data.xlfaLx
      list.mj = data.jlList
        .filter((item) => item.jllx == "01")
        .map((item) => {
          return { ...item, text: item.jlxm };
        });
      list.fj = data.jlList
        .filter((item) => item.jllx == "02")
        .map((item) => {
          return { ...item, text: item.jlxm };
        });
      list.zn = data.znzbList;
      list.jy = data.jyqxList;
      list.cl = data.clList;
      normalForm.xffwid = data.xffwid;
      normalForm.xffwlx = "2";
      // 查询快返点的详细信息
      getKfdInfo({ id: data.xffwid }).then((res) => {
        normalForm.kfdMc = res.kfdMc;
      });
    });
  }
}
onMounted(() => {
  // getIsReport();
  getXUJZList();
  getDepts();
  getMJList();
  getFj();
  getMJ();
  getznzbs();
  getJyqx();
  getCl();
  getQwLevel();
  getQwbcList();
  getSourtRange();
  getFaList();
  getPbxx();
});
// 判断已报备还是未报备
function getIsReport() {
  let flag = route.query.reportTitle;
  if (route.query.reportType === "01") {
    if (flag === "报备") {
      getMyXfpbToday().then((res1) => {
        normalForm.bbzt = "0";
        normalForm.ksTime = res1.kssj;
        normalForm.jsTime = res1.jssj;
        normalForm.fzrXm = res1.fzrXm;
        normalForm.fzrId = res1.fzrId;
        normalForm.jzMc = res1.jzMc;
        normalForm.wzlx = res1.wzlx;
        normalForm.xffwlx = res1.xffwlx;
        normalForm.jzId = res1.jzId;
        normalForm.qwbcId = res1.pbId;
        normalForm.xffwid = res1.xffwid;
        normalForm.zqsc = res1.zqsc;
        normalForm.xfrq = timeFormat(new Date());
        getXffwList(res1.xffwid);
        normalForm.xlfs = res1.xlfs;
        normalForm.fzrLxdh = res1.fzrLxdh;
        normalForm.fzrSfzh = res1.fzrSfzh;
        normalForm.bz = res1.bz;
        normalForm.kssj = res1.kssj;
        normalForm.jssj = res1.jssj;
        normalForm.jd = "104.13407";
        normalForm.wd = "29.99572";
        // normalForm.xlfaMc = res1.xlfaMc
        normalForm.famc = res1.xlfaMc;
        normalForm.xlfaLx = res1.xlfaLx ? res1.xlfaLx : "01";
        normalForm.xlfaId = res1.xlfaId;
        if (normalForm.xlfaLx === "02") {
          normalForm.xlfaMc = res1.xlfaMc;
        }
        getBcxxList(res1.qwbcId);
        list.cl = JSON.parse(res1.pbcl);
        if (list.cl.length > 0) {
          normalForm.xlfs = "0";
        }
        list.cl.forEach((ele) => {
          ele.text = ele.jdchphm;
        });
        list.fj = JSON.parse(res1.pbfj);
        list.fj.forEach((f) => {
          f.text = f.jlxm;
        });
        list.mj = JSON.parse(res1.pbmj);
        list.mj.forEach((m) => {
          m.text = m.jlxm;
        });
        list.zn = JSON.parse(res1.txzb);
        list.zn.forEach((m) => {
          m.text = m.sbmc;
        });
        list.jy = JSON.parse(res1.jyqx);
        list.jy.forEach((m) => {
          m.text = m.qxmc;
          m.qxsl = m.sl;
        });
      });
    } else if (flag === "已报备") {
      getMybbTodayNew().then((res2) => {
        getBcxxList(res2.qwbcId);
        normalForm.xffwlx = res2.xffwlx;
        normalForm.xffwid = res2.xffwid;
        getXffwList(res2.xffwid);
        normalForm.id = res2.id;
        normalForm.ksTime = res2.bbkssj ? res2.bbkssj.split(" ")[1] : "";
        normalForm.jsTime = res2.bbjssj ? res2.bbjssj.split(" ")[1] : "";
        normalForm.fzrXm = res2.fzrXm;
        normalForm.fzrId = res2.fzrId;
        normalForm.jzMc = res2.jzMc;
        normalForm.bz = res2.bz;
        normalForm.famc = res2.xlfaMc;
        normalForm.xlfaLx = res2.xlfaLx ? res2.xlfaLx : "01";
        normalForm.xlfaId = res2.xlfaId;
        normalForm.kssj = res2.kssj;
        normalForm.jssj = res2.jssj;
        normalForm.jzId = res2.jzId;
        normalForm.xfpbId = res2.qwbcId;
        normalForm.zqsc = res2.zqsc;
        normalForm.jd = "104.13407";
        normalForm.wd = "29.99572";
        normalForm.xfrq = timeFormat(new Date());
        // normalForm.xlfaMc = res2.xlfaMc
        if (res2.xlfaLx === "02") {
          normalForm.xlfaMc = res2.xlfaMc;
        }
        list.cl = JSON.parse(res2.pbcl);
        if (list.cl.length > 0) {
          normalForm.xlfs = "0";
        }
        list.cl.forEach((ele) => {
          ele.text = ele.jdchphm;
        });
        list.fj = JSON.parse(res2.pbfj);
        list.fj.forEach((f) => {
          f.text = f.jlxm;
        });
        list.mj = JSON.parse(res2.pbmj);
        list.mj.forEach((m) => {
          m.text = m.jlxm;
        });
        list.zn = JSON.parse(res2.txzb);
        list.zn.forEach((m) => {
          m.text = m.sbmc;
        });
        list.jy = JSON.parse(res2.jyqx);
        list.jy.forEach((m) => {
          m.text = m.qxmc;
          m.qxsl = m.qxsl;
        });
        normalForm.wzlx = res2.wzlx;
        normalForm.xffwlx = res2.xffwlx;
        normalForm.xlfs = res2.xlfs;
        normalForm.xffwid = res2.xffwid;
      });
    }
  }
}
watch(normalForm.xlfaLx, (newVal) => {
  if (newVal === "01") {
    normalForm.xlfaMc = normalForm.xfqMc;
  }
});
// 查询班次信息
function getBcxxList(val) {
  getBcxx(val).then((res) => {
    normalForm.bcmc = res.bcmc ? res.bcmc : "";
  });
}
// 查询巡防范围通过id查询
function getXffwList(val) {
  if (normalForm.xffwlx === "1") {
    getXfqs({
      id: val,
    }).then((res) => {
      normalForm.xfqMc = res.xfqMc;
      if (normalForm.xlfaLx === "01") {
        normalForm.xlfaMc = normalForm.xfqMc;
      }
    });
  } else if (normalForm.xffwlx === "2") {
    getKfd({
      id: val,
    }).then((res) => {
      normalForm.kfdMc = res.kfdMc;
    });
  }
}
// 勤务等级
const showqwPicker = ref(false);

function getQwLevel() {
  getQwdj({
    pageSize: 200,
    pageCurrent: 1,
    fbzt: 1,
  }).then((res) => {
    qwdjList.value = res.records;
    qwdjList.value.forEach((item) => {
      if (item.qwdj === "01") {
        item.text = "一级勤务";
      } else if (item.qwdj === "02") {
        item.text = "二级勤务";
      } else if (item.qwdj === "03") {
        item.text = "三级勤务";
      } else if (item.qwdj === "04") {
        item.text = "日常勤务";
      }
    });
  });
}
const qwdjList = ref([]);

function onqwConfirm(value) {
  normalForm.qwdjLabel = value.text;
  normalForm.qwdj = value.value;
  showqwPicker.value = false;
}
// 选择勤务班次
const showbcPicker = ref(false);

function onbcConfirm(val) {
  qzsj.value = val.kssj + "-" + val.jssj;
  normalForm.bcmc = val.bcmc;
  normalForm.qwbcId = val.id;
  normalForm.zqsc = val.zqsc;
  normalForm.ksTime = val.kssj;
  normalForm.kssj = val.kssj;
  normalForm.jssj = val.jssj;
  normalForm.jsTime = val.jssj;
  showbcPicker.value = false;
}
const bcList = ref([]);

function getQwbcList() {
  getQwbc({
    pageSize: 200,
    pageCurrent: 1,
    bcmc: "",
    bclx: "02",
  }).then((res) => {
    bcList.value = res.records;
    bcList.value.forEach((item) => {
      item.text = item.bcmc;
    });
  });
}
// 开始结束日期
const calendarShow = ref(false);

function onCalendarConfirm(values) {
  // normalForm.startEndDate = timeFormat(values[0]) + '至' + timeFormat(values[1])
  // normalForm.ksDate = timeFormat(values[0])
  // normalForm.jsDate = timeFormat(values[1])
  normalForm.xfrq = timeFormat(values) + " " + "00:00:00";
  calendarShow.value = false;
}
// 开始时间
const showksPicker = ref(false);

function onksConfirm(val) {
  normalForm.kssj = val + ":" + "00";
  // normalForm.kssj = normalForm.ksDate + ' ' + normalForm.ksTime
  showksPicker.value = false;
}

function ksChange(val) {
  normalForm.kssj = val + ":" + "00";
}
// 结束时间
const showjsPicker = ref(false);

function onjsConfirm(val) {
  normalForm.jssj = val + ":" + "00";
  // normalForm.jssj = normalForm.jsDate + ' ' + normalForm.jsTime
  showjsPicker.value = false;
}

function jsChange(val) {
  normalForm.jssj = val + ":" + "00";
}
// 巡防范围
const showsrPicker = ref(false);

function onsrChange(value) {
  normalForm.xffwid =
    value.selectedOptions[value.selectedOptions.length - 1].id;
  normalForm.xffwlx = value.selectedOptions[0].text;
}
// 选择警组
const showjzPicker = ref(false);

function onjzConfirm(val) {
  list.mj = [];
  list.fj = [];
  list.cl = [];
  list.zn = [];
  list.jy = [];
  normalForm.jzMc = val.jzMc;
  normalForm.jzId = val.id;
  normalForm.fzrXm = val.ddMjxm;
  normalForm.fzrLxdh = val.ddDh;
  normalForm.fzrSfzh = val.ddMjsfzh;
  normalForm.fzrId = val.ddMjid;
  // normalForm.xbdm = val.
  normalForm.jh = val.ddMjjh;
  normalForm.ssbm = val.ssbm;
  normalForm.ssbmdm = val.ssbmdm;
  // 民警辅警已有赋值
  val.jzryList.forEach((m) => {
    if (m.jllx === "01") {
      list.mj.push({
        jh: m.jh,
        jllx: m.jllx,
        jlxm: m.jlxm,
        text: m.jlxm,
        nl: m.nl,
        qwjzId: m.qwjzId,
        jlId: m.ryId,
        sfzh: m.sfzh,
        xbdm: m.xbdm,
        xm: m.jlxm,
        jh: m.jh,
        lxdh: m.lxdh,
      });
    }
    if (m.jllx === "02") {
      list.fj.push({
        jh: m.jh,
        jllx: m.jllx,
        jlxm: m.jlxm,
        text: m.jlxm,
        nl: m.nl,
        qwjzId: m.qwjzId,
        jlId: m.ryId,
        sfzh: m.sfzh,
        xbdm: m.xbdm,
        xm: m.jlxm,
        jh: m.jh,
        lxdh: m.lxdh,
      });
    }
  });
  // 车辆
  if (val.clList.length > 0) {
    normalForm.xlfs = "0";
    val.clList.forEach((c) => {
      list.cl.push({
        clId: c.clId,
        jdchphm: c.jdchphm,
        text: c.jdchphm,
        jdchpzldm: c.jdchpzldm,
        qwjzId: c.qwjzId,
      });
    });
  }

  // 警用器械
  val.jyqxList.forEach((j) => {
    list.jy.push({
      qxid: j.qxid,
      qxmc: j.qxmc,
      text: j.qxmc,
      qxsl: j.sl ? j.sl : 1,
      qxlx: j.qxlx,
      qwjzId: j.qwjzId,
    });
  });
  // 智能装备
  val.txzbList.forEach((z) => {
    list.zn.push({
      sbmc: z.sbmc,
      text: z.sbmc,
      txzblx: z.txzblx,
      txzbId: z.zbId,
      qwjzId: z.qwjzId,
      hh: z.hh,
    });
  });
  showjzPicker.value = false;
}
const customJzFieldName = {
  text: "jzMc",
};
// 查询警组
function getXUJZList() {
  queryJzList({
    pageSize: 20,
    pageCurrent: 1,
  }).then((res) => {
    list.jzList = res.records;
  });
}
// 巡防部门
const showxfPicker = ref(false);

function onxfConfirm(val) {
  showxfPicker.value = false;
}
const customFieldNamed = {
  text: "orgName",
  value: "orgName",
  children: "childDeptList",
};
const showbmPicker = ref(false);

function onChange(value, selectedOptions) {
  normalForm.ssbmdm =
    value.selectedOptions[value.selectedOptions.length - 1].id;
}
// 查询部门
function getDepts() {
  selectNextPage({}).then((res) => {
    list.ssbmList = [res.records[0]];
  });
}
// 选择负责人
const showfzrPicker = ref(false);

function onfzrConfirm(val) {
  normalForm.fzrXm = val.loginName;
  normalForm.fzrSfzh = val.idEntityCard;
  normalForm.fzrLxdh = val.mobile;
  normalForm.fzrId = val.id;
  normalForm.xbdm = val.sex;
  showfzrPicker.value = false;
}
const customfzrFieldNamed = {
  text: "loginName",
};
// 查询负责人
function getMJList() {
  sysUser({
    current: 1,
    size: 50,
    phone: list.phone,
  }).then((res) => {
    list.fzrList = res.records;
    list.fzrTotal = res.total;
  });
}

// 查询民警辅警 智能装备 警用器械 巡防车辆
function getJYList(val) {
  switch (val) {
    case "选择民警":
      list.mjXm = list.text;
      getMJ();
      list.mulChooseList = list.mjList;
      break;
    case "选择辅警":
      list.fjXm = list.text;
      getFj();
      list.mulChooseList = list.fjList;
      break;
    case "选择智能装备":
      list.sbmc = list.text;
      getznzbs();
      list.mulChooseList = list.zbList;
      break;
    case "选择警用器械":
      list.qxMc = list.text;
      getJyqx();
      list.mulChooseList = list.jyqxList;
      break;
    case "选择巡防车辆":
      list.cph = list.text;
      getCl();
      list.mulChooseList = list.clList;
      break;
  }
}
// 民警
function getMJ() {
  tbJcglXfll({
    pageCurrent: 1,
    pageSize: 50,
    fl: "01", // 民警
    xm: list.mjXm,
  }).then((res) => {
    list.mjList = res.records;
    list.mjList.forEach((item) => {
      item.text = item.xm;
    });
  });
}
// 辅警
function getFj() {
  tbJcglXfll({
    pageCurrent: 1,
    pageSize: 50,
    fl: "02", // 辅警
    xm: list.fjXm,
  }).then((res) => {
    list.fjList = res.records;
    list.fjList.forEach((item) => {
      item.text = item.xm;
    });
  });
}
// 智能装备
function getznzbs() {
  // 智能装备
  getZnzb({
    pageNo: 1,
    pageSize: 50,
    sbmc: list.sbmc,
  }).then((res) => {
    list.zbList = res.records;
    list.zbList.forEach((item) => {
      item.text = item.sbmc;
    });
  });
}

function getJyqx() {
  // 警用器械
  selectJyqx({
    pageNo: 1,
    pageSize: 50,
    qxMc: list.qxMc,
  }).then((res) => {
    list.jyqxList = res.records;
    list.jyqxList.forEach((item) => {
      item.text = item.qxMc;
      item.jysl = 1;
    });
  });
}

function getCl() {
  // 巡防车辆
  getXfclList({
    pageCurrent: 1,
    pageSize: 50,
    cph: list.cph,
  }).then((res) => {
    list.clList = res.records;
    list.clList.forEach((item) => {
      item.text = item.cph;
    });
  });
}
// 弹框标题
const checkList = reactive({});
const checkedList = ref([]);
const checkboxRefs = ref([]);
const popupTitle = ref("");
const selfDefinedPopup = ref(false);

function showDialogfn(val) {
  list.text = "";
  switch (val) {
    case "mj":
      popupTitle.value = "选择民警";
      checkedList.value = list.mj.map((el) => el.text);
      list.mulChooseList = list.mjList;
      break;
    case "fj":
      popupTitle.value = "选择辅警";
      checkedList.value = list.fj.map((el) => el.text);
      list.mulChooseList = list.fjList;
      break;
    case "zn":
      popupTitle.value = "选择智能装备";
      checkedList.value = list.zn.map((el) => el.text);
      list.mulChooseList = list.zbList;
      break;
    case "jy":
      popupTitle.value = "选择警用器械";
      // if (list.jy && list.jy.length > 0) {
      checkedList.value = list.jy.map((el) => el.text);
      list.mulChooseList = list.jyqxList;
      // }
      break;
    case "cl":
      popupTitle.value = "选择巡防车辆";
      checkedList.value = list.cl.map((el) => el.text);
      list.mulChooseList = list.clList;
      break;
  }
  selfDefinedPopup.value = true;
}

function popSure() {
  selfDefinedPopup.value = false;
}
function changeTo(item, index) {
  list.jy[list.jy.map((e) => e.text).indexOf(item.text)].qxsl = item.sl;
}
const toggle = (item, index) => {
  switch (popupTitle.value) {
    case "选择民警":
      if (!list.mj.map((m) => m.jlId).includes(item.ryid)) {
        list.mj.push({
          jh: item.jh,
          jllx: item.fl,
          jlxm: item.xm,
          sfzh: item.sfzh,
          xm: item.xm,
          lxdh: item.lxdh,
          xbdm: item.xbdm,
          jlzt: "1",
          id: item.ryid,
          text: item.xm,
          nl: 0,
          qwjzId: "",
          jlId: item.ryid,
        });
      } else {
        list.mj.splice(list.mj.map((m1) => m1.jlxm).indexOf(item.jlxm), 1);
      }
      break;
    case "选择辅警":
      if (!list.fj.map((f) => f.jlId).includes(item.ryid)) {
        list.fj.push({
          jh: item.jh,
          jllx: item.fl,
          jlxm: item.xm,
          text: item.xm,
          id: item.id,
          sfzh: item.sfzh,
          xm: item.xm,
          jlzt: "1",
          lxdh: item.lxdh,
          xbdm: item.xbdm,
          nl: 0,
          qwjzId: "",
          jlId: item.id,
        });
      } else {
        list.fj.splice(list.fj.map((f1) => f1.jlxm).indexOf(item.jlxm), 1);
      }
      break;
    case "选择智能装备":
      if (!list.zn.map((z) => z.text).includes(item.text)) {
        list.zn.push({
          sbmc: item.sbmc,
          text: item.sbmc,
          txzblx: item.scode,
          txzbId: item.id,
          hh: item.sbbh,
        });
      } else {
        list.zn.splice(list.zn.map((f1) => f1.text).indexOf(item.text), 1);
      }
      break;
    case "选择警用器械":
      if (!list.jy.map((j) => j.text).includes(item.text)) {
        list.jy.push({
          qxid: item.id,
          qxmc: item.qxMc,
          text: item.qxMc,
          qxsl: item.sl ? item.sl : 1,
          qxlx: item.scode,
        });
      } else {
        list.jy.splice(list.jy.map((f1) => f1.text).indexOf(item.text), 1);
      }
      if (item.scode === "01") {
        normalForm.wzlx = "1";
      }
      break;
    case "选择巡防车辆":
      if (!list.cl.map((c) => c.clId).includes(item.cid)) {
        list.cl.push({
          clId: item.cid,
          jdchphm: item.cph,
          text: item.cph,
          jdchpzldm: item.cllx,
        });
        normalForm.xlfs = "0";
      } else {
        list.cl.splice(list.cl.map((f1) => f1.text).indexOf(item.text), 1);
      }
      break;
  }
};

function deleteCheckTag(item, index, val) {
  switch (val) {
    case "mj":
      list.mj.splice(index, 1);
      break;
    case "fj":
      list.fj.splice(index, 1);
      break;
    case "zn":
      list.zn.splice(index, 1);
      break;
    case "jy":
      list.jy.splice(index, 1);
      list.jyqxList.forEach((el) => {
        if (el.id === item.qxid) {
          el.qxsl = 1;
        }
      });
      if (!list.jy.map((j) => j.scode).includes("01")) {
        normalForm.wzlx = "2";
      }
      break;
    case "cl":
      list.cl.splice(index, 1);
      if (list.cl == false) {
        normalForm.xlfs = "1";
      }
      break;
  }
}
// 查询巡防范围
function getSourtRange() {
}

// 日常方案
const customFieldqjxmName = {
  text: "bxdMc",
};
const showrcfaPicker = ref(false);

function onrcfaConfirm(val) {
  normalForm.xlfaMc = val.bxdMc;
  normalForm.xlfaId = val.id;
  showrcfaPicker.value = false;
}

function getFaList() {
  getBxdList({
    pageSize: 50,
    pageCurrent: 1,
    bxdMc: list.bxdMc,
  }).then((res) => {
    list.rcfaList = res.records;
  });
  getXlfa({
    pageSize: 50,
    pageCurrent: 1,
    famc: list.famc,
  }).then((res) => {
    list.tsfaList = res.records;
  });
}
// 特殊方案
const showtsfaPicker = ref(false);
const customFieldtsfaName = {
  text: "famc",
};

function ontsfaConfirm(val) {
  normalForm.xlfaMc = val.famc;
  normalForm.xlfaId = val.id;
  showtsfaPicker.value = false;
}
// 巡防区
const filedxfqNames = {
  text: "xfqMc",
};
const showxfqPicker = ref(false);

function onxfqConfirm(val) {
  normalForm.xfqMc = val.xfqMc;
  normalForm.xffwid = val.id;
  normalForm.xlfaMc = val.xfqMc;
  showxfqPicker.value = false;
}
// 执勤岗
const filedkfdNames = {
  text: "",
};
const showkfdPicker = ref(false);

function onkfdConfirm(val) {
  normalForm.kfdMc = val.kfdMc;
  normalForm.xffwid = val.id;
  showkfdPicker.value = false;
}

// 新增报备接口
function submit() {
  // if (route.query.reportTitle === "报备") {
  if (route.query.zt == 0) {
    normalForm.jlList = [...list.mj, ...list.fj];
    normalForm.clList = list.cl;
    normalForm.jyqxList = list.jy;
    normalForm.znzbList = list.zn;
    normalForm.bblx = "01";
    addXFBB(normalForm).then((res) => {
      finishReport({
        bbzt: "0",
        id: res,
      }).then((res) => { });
      router.go(-1);
    });
    // } else if (route.query.reportTitle === "已报备") {
  } else if (route.query.zt == 0) {
    finishReport({
      bbzt: "1",
      id: normalForm.id,
    }).then((res) => {
      router.go(-1);
      // router.push("/home");
    });
  }
}
function editFn(e) {
  if (e == 1) {
    normalForm.jlList = [...list.mj, ...list.fj];
    normalForm.clList = list.cl;
    normalForm.jyqxList = list.jy;
    normalForm.znzbList = list.zn;
    normalForm.bblx = "01";
    editXFBB(normalForm).then((res) => {
      hintToast("报备修改成功")
      router.go(-1);
    });
  } else {
    finishReport({
      bbzt: "1",
      id: normalForm.id,
    }).then((res) => {
      hintToast("报备结束成功")
      router.go(-1);
    });
  }
}
</script>

<style lang="scss" scoped>
.popupTitle {
  text-align: center;
  background-color: rgb(11, 137, 247);
  height: 6vh;
  line-height: 6vh;
}

.popbtn-box {
  width: 100%;
  display: flex;
  justify-content: space-around;
}

.check-item-tag {
  display: inline-block;
  margin: 0 6px;
}

.check-data-box {
  height: 25vh;
  overflow: auto;
}

.time-box {
  display: flex;
}

::v-deep .mulSelect .van-cell__title,
.van-cell__value {
  flex: unset;
}

::v-deep .mulSelect .van-cell__value {
  flex: 1;
}

.title_tab {
  padding-left: 7vw;
  position: relative;
  margin: 2vw 0;
  letter-spacing: 2px;
}

.title_tab::after {
  content: "";
  position: absolute;
  top: 0;
  left: 5vw;
  bottom: 0;
  width: 4px;
  background: #3b6be7;
  border-radius: 2px;
}

.van-cell:after {
  display: none;
}

.van-cell {
  background: #e4e9f6;
  box-sizing: border-box;
  border-radius: 4px;
  padding: 6px;
  margin: 8px 5%;
  width: 90%;
  overflow: hidden;
  color: var(--van-cell-text-color);
  font-size: var(--van-cell-font-size);
  line-height: var(--van-cell-line-height);
}

.popupTitle {
  color: #fff;
}
</style>
