<template>
  <el-form
    ref="editRef"
    class="info"
    :model="dialogForm"
    :inline="true"
    :rules="rules"
  >
    <div class="bblxItem">
      <div class="btItem">巡防部门</div>
      <div class="info">
        <el-form-item label="巡防部门" prop="ssbmdm">
          <MOSTY.Department
            width="180px"
            clearable
            filterable
            v-model="dialogForm.ssbmdm"
          />
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">巡防范围</div>
      <div class="info">
        <el-form-item prop="xffwlx" label="">
          <el-radio-group v-model="dialogForm.xffwlx" @change="changeType">
            <el-radio
              v-for="it in props.dic.D_ZDY_XFFWLX"
              :key="it"
              :label="it.dm"
              >{{ it.zdmc }}</el-radio
            >
          </el-radio-group>
        </el-form-item>
      </div>
    </div>

    <div class="bblxItem">
      <div class="btItem">
        <span v-if="dialogForm.xffwlx == '01'">巡区设置</span>
        <span v-if="dialogForm.xffwlx == '02'">快反点设置</span>
        <span v-if="dialogForm.xffwlx == '03'">检查站设置</span>
        <span v-if="dialogForm.xffwlx == '04'">警务站设置</span>
        <span v-if="dialogForm.xffwlx == '05'">护学岗设置</span>
        <span v-if="dialogForm.xffwlx == '06'">必巡线</span>
        <span v-if="dialogForm.xffwlx == '07'">必巡点</span>
      </div>
      <div class="info">
        <el-form-item v-if="dialogForm.xffwlx == '01'">
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{ isRadio: true, lx: 'xfq' }"
            @change="changeXq"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item v-if="dialogForm.xffwlx == '02'">
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{ rowKey: 'kfdId', isRadio: true, lx: 'kfd' }"
            @change="changeXq"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item v-if="dialogForm.xffwlx == '03'">
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{ rowKey: 'id', isRadio: true, lx: 'jcz' }"
            @change="changeXq"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item v-if="dialogForm.xffwlx == '04'">
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{ lx: 'jwz', rowKey: 'jwzId', isRadio: true }"
            @change="changejwz"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item
          prop="xfqyMc"
          v-if="['01', '02', '03'].includes(dialogForm.xffwlx)"
        >
          <el-input
            :placeholder="
              dialogForm.xffwlx == '01'
                ? '巡区名称'
                : dialogForm.xffwlx == '02'
                ? '快反点'
                : '检查站'
            "
            readonly
            v-model="dialogForm.xfqyMc"
          ></el-input>
        </el-form-item>
        <el-form-item prop="xfqyMc" v-if="['04'].includes(dialogForm.xffwlx)">
          <el-input
            placeholder="警务站"
            readonly
            v-model="dialogForm.jwzMc"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="必巡点"
          label-width="96px"
          v-if="['01', '07'].includes(dialogForm.xffwlx)"
        >
          <ChooseTable
            :deptment="props.dep"
            v-if="!isDetail"
            :configer="{ lx: 'bxd', placement: 'bottom' }"
            v-model="dialogForm.bxdList"
            :dic="props.dic"
          />
          <el-tag
            type="primary"
            v-for="itchid in dialogForm.bxdList"
            :key="itchid"
            >{{ itchid.xqmc }}</el-tag
          >
        </el-form-item>

        <el-form-item
          label="必巡线"
          label-width="96px"
          v-if="['01', '06'].includes(dialogForm.xffwlx)"
        >
          <ChooseTable
            :deptment="props.dep"
            v-if="!isDetail"
            :configer="{
              lx: 'bxx',
              rowKey: 'id',
              isRadio: true,
              placement: 'bottom'
            }"
            @change="changeDw"
            v-model="dialogForm.bxxList"
            :dic="props.dic"
          />
          <el-tag
            type="primary"
            v-for="itchid in dialogForm.bxxList"
            :key="itchid"
            >{{ itchid.xqmc }}</el-tag
          >
          <template v-if="dialogForm.xffwlx == '06'">
            <div v-for="it in dialogForm.bxdList" :key="it">
              <span v-if="dialogForm.bxdList.length > 0">关联点位：</span>
              <span class="dwBox">{{ it.xqmc }}</span>
            </div>
          </template>
        </el-form-item>

        <el-form-item label-width="96px" v-if="dialogForm.xffwlx == '05'">
          <ChooseTable
            :deptment="props.dep"
            v-if="!isDetail"
            :configer="{ lx: 'hxg' }"
            v-model="dialogForm.hxgList"
            :dic="props.dic"
          />
          <el-tag
            type="primary"
            v-for="itchid in dialogForm.hxgList"
            :key="itchid"
            >{{ itchid.xxMc }}</el-tag
          >
        </el-form-item>
      </div>
    </div>

    <div class="bblxItem">
      <div class="btItem">警组设置</div>
      <div class="info">
        <el-form-item>
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{
              isRadio: true,
              rowKey: 'id',
              lx: 'jz',
              jzlx: props.bblx
            }"
            @change="changeJz"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item prop="jzMc" label=" ">
          <el-input
            placeholder="警组名称"
            readonly
            v-model="dialogForm.jzMc"
          ></el-input>
        </el-form-item>
      </div>
    </div>

    <div class="bblxItem">
      <div class="btItem">班次设置</div>
      <div class="info">
        <el-form-item>
          <ChooseTable
            v-if="!isDetail"
            :deptment="props.dep"
            :configer="{ isRadio: true, lx: 'zbbc', bclx: props.bblx }"
            @change="changeBc"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item prop="bcMc" label=" ">
          <el-input placeholder="班次名称" readonly v-model="dialogForm.bcMc" />
        </el-form-item>
        <el-form-item>
          <span class="f16">(</span>
        </el-form-item>
        <el-form-item prop="bcKssj">
          <el-time-picker
            v-model="dialogForm.bcKssj"
            format="HH:mm:ss"
            value-format="HH:mm:ss"
          />
        </el-form-item>
        <el-form-item style="width: 20px">
          <span class="f16">至</span>
        </el-form-item>
        <el-form-item prop="bcKtsDict" style="width: 90px">
          <MOSTY.Select
            :dictEnum="props.dic.D_QW_BC_KTS"
            placeholder="跨天数"
            v-model="dialogForm.bcKtsDict"
            style="width: 100%"
          />
        </el-form-item>
        <el-form-item prop="bcJssj">
          <el-time-picker
            v-model="dialogForm.bcJssj"
            format="HH:mm:ss"
            value-format="HH:mm:ss"
          />
        </el-form-item>
        <el-form-item>
          <span class="f16">)</span>
        </el-form-item>
        <el-form-item
          v-if="
            dialogForm.bcKtsDict != '01' &&
            dialogForm.bcKtsDict != '02' &&
            dialogForm.bcKtsDict != '03'
          "
        >
          <ChooseTable
            :deptment="props.dep"
            v-if="!isDetail"
            :configer="{ isRadio: true, lx: 'mj', placement: 'left' }"
            @change="changeShr"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item
          prop="shrXm"
          v-if="
            dialogForm.bcKtsDict != '01' &&
            dialogForm.bcKtsDict != '02' &&
            dialogForm.bcKtsDict != '03'
          "
        >
          <el-input
            placeholder="审核人"
            readonly
            v-model="dialogForm.shrXm"
          ></el-input>
        </el-form-item>
      </div>
    </div>

    <div class="bblxItem">
      <div class="btItem">负责人</div>
      <div class="info">
        <el-form-item>
          <ChooseTable
            :deptment="props.dep"
            @change="handleFzr"
            v-if="!isDetail"
            :configer="{ lx: 'mj', rowKey: 'id', isRadio: true }"
            :dic="props.dic"
          />
        </el-form-item>
        <el-form-item prop="fzrXm">
          <el-input
            readonly
            v-model="dialogForm.fzrXm"
            placeholder="负责人"
            clearable
          />
        </el-form-item>
        <el-form-item prop="fzrSfzh">
          <el-input
            readonly
            v-model="dialogForm.fzrSfzh"
            placeholder="身份证"
            clearable
          />
        </el-form-item>
        <el-form-item prop="fzrLxdh">
          <el-input
            readonly
            v-model="dialogForm.fzrLxdh"
            placeholder="负责人电话"
            clearable
          />
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">智能装备</div>
      <div class="info">
        <el-form-item label="执法记录仪" label-width="96px" prop="tcList">
          <ChooseTable
            :deptment="props.dep"
            v-if="!isDetail"
            :configer="{ lx: 'zfjly' }"
            v-model="dialogForm.tcList"
            :dic="props.dic"
          />
          <div style="min-width: 100px;">  <el-tag
            type="primary"
            v-for="itchid in dialogForm.tcList"
            :key="itchid"
            >{{ itchid.sbmc }}</el-tag
          ></div>
         
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">终端报备</div>
      <div class="info">
        <ChooseTable
          :deptment="props.dep"
          v-if="!isDetail"
          :configer="{ lx: 'zdsb' }"
          v-model="dialogForm.zdList"
          :dic="props.dic"
        />
        <el-tag type="primary" v-for="it in dialogForm.zdList" :key="it.id">{{
          it.sbmc
        }}</el-tag>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">警用器械</div>
      <div class="info">
        <el-form-item
          :label="item.zdmc"
          :label-width="120"
          v-for="(item, index) in dialogForm.qxList"
          :key="index"
        >
          <el-input-number
            v-model="item.qxsl"
            :min="0"
            :max="1000"
          ></el-input-number>
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">巡逻方式</div>
      <div class="info">
        <CheckBox :data="baseInfo.xlfs" @changeData="changeDataxl" />
        <div
          class="gapline"
          v-if="baseInfo.xlfs.hasChoose.includes('车巡')"
        ></div>
        <!-- 车辆 -->
        <div v-if="baseInfo.xlfs.hasChoose.includes('车巡')">
          <ChooseTable
            style="background-color: red"
            class="dinw"
            :deptment="props.dep"
            v-if="!isDetail"
            v-model="dialogForm.clList"
            :configer="{ lx: 'cl', selectName: '选择车辆' }"
            @change="changeCl"
            :dic="props.dic"
          />
        </div>
        <div
          v-if="baseInfo.xlfs.hasChoose.includes('车巡') && dialogForm.clList"
        >
          <dl class="dl-car" v-for="item in dialogForm.clList" :key="item.cid">
            <dt class="flex just-between align-center">
              <div>{{ item.cph }}</div>
              <div @click="closeCl(item)">
                <el-icon><Close /></el-icon>
              </div>
            </dt>
            <dd class="flex dir-column pr20 pt10">
              <el-form-item
                v-for="it in item.tcryListStr"
                :label="it.label"
                :key="it.vlaue"
              >
                <div class="flex">
                  <div class="num">{{ it.list ? it.list.length : 0 }}</div>
                  <ChooseTable
                    :deptment="props.dep"
                    v-if="!isDetail"
                    :configer="{
                      lx: it.label == '同行辅警' ? 'fj' : 'mj',
                      placement: 'top-start'
                    }"
                    v-model="it.list"
                    :key="it"
                    :dic="props.dic"
                  />
                  <div class="peolist">
                    <el-tag
                      type="primary"
                      v-for="itchid in it.list"
                      :key="itchid"
                      >{{ itchid.xm }}</el-tag
                    >
                  </div>
                </div>
              </el-form-item>
            </dd>
          </dl>
        </div>
        <div
          class="gapline"
          v-if="baseInfo.xlfs.hasChoose.includes('步巡')"
        ></div>
        <!-- 人员 -->
        <dl class="dl-car" v-if="baseInfo.xlfs.hasChoose.includes('步巡')">
          <dt class="peo">
            <span>步巡人员</span>
          </dt>
          <dd class="info flex dir-column pt10">
            <el-form-item prop="zbmjStr" label="当班民警">
              <div class="flex">
                <div class="num">
                  {{ dialogForm.zbmjStr ? dialogForm.zbmjStr.length : 0 }}
                </div>
                <ChooseTable
                  :deptment="props.dep"
                  v-if="!isDetail"
                  :configer="{ lx: 'mj', placement: 'top-start' }"
                  v-model="dialogForm.zbmjStr"
                  :dic="props.dic"
                />
                <div class="peolist">
                  <el-tag
                    type="primary"
                    v-for="item in dialogForm.zbmjStr"
                    :key="item"
                    >{{ item.xm }}</el-tag
                  >
                </div>
              </div>
            </el-form-item>
            <el-form-item prop="zbfjStr" label="当班辅警">
              <div class="flex">
                <div class="num">
                  {{ dialogForm.zbfjStr ? dialogForm.zbfjStr.length : 0 }}
                </div>
                <ChooseTable
                  :deptment="props.dep"
                  v-if="!isDetail"
                  :configer="{ lx: 'fj', placement: 'top-start' }"
                  v-model="dialogForm.zbfjStr"
                  :dic="props.dic"
                />
                <div class="peolist">
                  <el-tag
                    type="primary"
                    v-for="item in dialogForm.zbfjStr"
                    :key="item"
                    >{{ item.xm }}</el-tag
                  >
                </div>
              </div>
            </el-form-item>
          </dd>
        </dl>
      </div>
    </div>

    <div class="bblxItem">
      <div class="btItem">武装着装</div>
      <div class="info">
        <el-form-item label="武装类型">
          <MOSTY.Radio
            :options="props.dic.D_BZ_WZLX"
            placeholder="类型"
            v-model="dialogForm.xfwzlx"
          />
        </el-form-item>
        <el-form-item prop="xfzzlx" label="着装类型">
          <MOSTY.Radio
            :options="props.dic.D_BZ_ZZLX"
            placeholder="类型"
            v-model="dialogForm.xfzzlx"
          />
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem">
      <div class="btItem">备注</div>
      <div class="info">
        <el-form-item style="width: 100%">
          <el-input
            v-model="dialogForm.bz"
            placeholder="请输入关键字"
            show-word-limit
            type="textarea"
          />
        </el-form-item>
      </div>
    </div>
    <div class="bblxItem" v-if="!isDetail">
      <div class="btItem"></div>
      <div class="info subBtn">
        <el-button @click="saveForm" v-loading="loading">报备</el-button>
        <el-button
          @click="dialogForm.value.xffwlx = '1'"
          v-if="props.text == '日历'"
          >重置</el-button
        >
      </div>
    </div>
  </el-form>
</template>

<script setup>
import { servicePost, serviceGet } from "@/api/serviceApi.js";
import { ElMessage } from "element-plus";
import * as MOSTY from "@/components/MyComponents/index";
import ChooseTable from "@/components/chooseList/chooseTable.vue";
import emitter from "@/utils/eventBus.js";
import CheckBox from "@/components/checkBox/index";
import {
  reactive,
  ref,
  getCurrentInstance,
  defineProps,
  watch,
  defineEmits,
  computed
} from "vue";
const { proxy } = getCurrentInstance();
const props = defineProps({
  bblx: {
    type: String,
    default: "01"
  },
  text: String,
  data: Object,
  dic: Object,
  isDetail: {
    type: Boolean,
    default: false
  },
  dep: Object
});
const emits = defineEmits(["updateList", "update:modelValue"]);
const editRef = ref();
const multipleTable = ref([]);
const baseInfo = reactive({
  xlfs: {
    list: ["车巡", "步巡"],
    hasChoose: []
  }
});
const loading = ref(false);
const activeName = ref("");
const dialogForm = ref({
  xffwlx: "01"
});
watch(
  () => props.dic.D_JCGL_JYQX_QXLX,
  (val) => {
    dialogForm.value.qxList = val || [];
    dialogForm.value.qxList.forEach((v) => {
      v.qxsl = 0;
    });
  },
  { immediate: true }
);

const rules = reactive({
  bcKssj: [{ required: true, message: "请选择开始时间", trigger: ["change"] }],
  bcJssj: [{ required: true, message: "请选择结束时间", trigger: ["change"] }],
  lx: [{ required: true, message: "请选择类型", trigger: ["change"] }],
  xlfs: [{ required: true, message: "请填写巡逻方式", trigger: ["change"] }],
  ssbmdm: [{ required: true, message: "请选择部门", trigger: ["change"] }],
  bcMc: [{ required: true, message: "请选班次", trigger: ["change"] }],
  jzMc: [{ required: true, message: "请选择警组", trigger: ["change"] }],
  shrXm: [
    { required: true, message: "请选择审核人", trigger: ["change", "blur"] }
  ],
  tcList: [
    { required: true, message: "请选择执法记录仪", trigger: ["change", "blur"] }
  ],
  xlfs: [{ required: true, message: "请选择警组", trigger: ["change"] }]
});
// 选择班次
const changeBc = (val) => {
  dialogForm.value.bcMc = val ? val[0].bcMc : "";
  dialogForm.value.bcId = val ? val[0].id : "";
  dialogForm.value.bcKssj = val ? val[0].bcKssj : "";
  dialogForm.value.bcJssj = val ? val[0].bcJssj : "";
  dialogForm.value.bcKtsDict = val ? val[0].bcKtsDict : "";
};
// 选择巡区 - 检查站 - 快反点
const changeXq = (val) => {
  console.log(val);
  dialogForm.value.xfqyMc = val
    ? val[0].xqmc || val[0].kfdMc || val[0].jczmc
    : "";
  dialogForm.value.xfqyId = val ? val[0].id || val[0].kfdId : "";
};

// 警务站
const changejwz = (val) => {
  console.log(val);
  dialogForm.value.jwzMc = val[0].jwzMc;
  dialogForm.value.jwzLx = val[0].jwzLx;
  dialogForm.value.jwzId = val[0].jwzId;
  dialogForm.value.jwzDz = val[0].jwzDz;
  dialogForm.value.xfqyId = val[0].jwzId;
  dialogForm.value.xfqyMc = val[0].jwzMc;
};

// 删除车辆
const closeCl = (item) => {
  dialogForm.value.clList = dialogForm.value.clList.filter((el) => {
    return el.cid != item.cid;
  });
};

// 处理负责人
const handleFzr = (val) => {
  dialogForm.value.fzrXm = val.length > 0 ? val[0].xm : "";
  dialogForm.value.fzrSfzh = val.length > 0 ? val[0].sfzh : "";
  dialogForm.value.fzrLxdh = val.length > 0 ? val[0].lxdh : "";
};

// 选择警组
const changeJz = (val) => {
  console.log(val);
  val.forEach((item) => {
    dialogForm.value.jzMc = item.jzMc;
    dialogForm.value.jzId = item.id;
    dialogForm.value.fzrXm = item.ddMjxm;
    dialogForm.value.fzrSfzh = item.ddMjsfzh;
    dialogForm.value.fzrLxdh = item.ddDh;
    dialogForm.value.xfzzlx = item.xfzzlx;
    dialogForm.value.xfwzlx = item.xfwzlx;

    dialogForm.value.bcMc = item.bcMc;
    dialogForm.value.bcKtsDict = item.bcKtsDict;
    dialogForm.value.bcId = item.glQwbcId;
    dialogForm.value.bcKssj = item.bcKssj;
    dialogForm.value.bcJssj = item.bcJssj;

    dialogForm.value.clList = item.zbclStr ? JSON.parse(item.zbclStr) : [];
    dialogForm.value.zdList = item.zbzdsbStr ? JSON.parse(item.zbzdsbStr) : [];

    let sblist = item.tcsbStr ? JSON.parse(item.tcsbStr) : [];
    
    dialogForm.value.tcList = sblist.filter((v) => {
      return v.sblx == "06";
    });
    const zbzbStr = item.zbzbStr ? JSON.parse(item.zbzbStr) : [];
    dialogForm.value.qxList = zbzbStr.length>0? zbzbStr: props.dic.D_JCGL_JYQX_QXLX.map((item) =>{return {
      ...item,qxsl:0
    }} );
    dialogForm.value.zbmjStr = item.zbmjStr ? JSON.parse(item.zbmjStr) : [];
    dialogForm.value.zbfjStr = item.zbfjStr ? JSON.parse(item.zbfjStr) : [];
    dialogForm.value.clList.forEach((item) => {
      item.tcryListStr = item.tcryList;
    });

    let xlfs = item.xfxlfs ? item.xfxlfs.split(",") : [];
    baseInfo.xlfs.hasChoose = xlfs.map((it) => {
      return props.dic.D_BZ_XLFS.find((v) => v.value == it).label;
    });
  });
};

// 切换按钮
const changeDataxl = (val) => {
  baseInfo.xlfs.hasChoose = val;
};

//车辆选择
const changeCl = (val) => {
  val.forEach((item) => {
    item.tcryListStr = props.dic.D_BZ_RYXFBBZW;
  });
  dialogForm.value.clList = dialogForm.value.clList.concat(val);
  dialogForm.value.clList = Array.from(
    new Set(dialogForm.value.clList.map(JSON.stringify))
  ).map(JSON.parse);
};
// watch(()=>dialogForm.value.clList,(val,oldel)=>{
// console.log(val,oldel);
// let arrList=[]
// for (let i = 0; i < val.length; i++) {
//  console.log(val[i].tcryListStr)
// }
// },{deep:true})
// 关联点位
const changeDw = (val) => {
  let newList = JSON.parse(JSON.stringify(val));
  let arr = [];
  newList.forEach((v) => {
    v.glbxd = v.glbxd ? JSON.parse(v.glbxd) : [];
    arr = arr.concat(v.glbxd);
  });
  dialogForm.value.bxdList = arr;
};

// 处理数据
const handleRylist = (arr, text) => {
  let list = arr?.map((it) => {
    return {
      ryId: it.ryid,
      xfllId: it.id,
      ryJzlx: it.lx,
      ryMfjlb: it.fl,
      rySfzh: it.sfzh,
      ryXm: it.xm,
      ryXfbbzw: handleDic(text)
    };
  });
  return list;
};

// 处理字典
const handleDic = (val) => {
  let obj = props.dic.D_BZ_RYXFBBZW.find((v) => {
    return v.label == val;
  });
  return obj ? obj.dm : "";
};

// 提交
const saveForm = () => {
  editRef.value.validate((valid) => {
    if (!valid) return;
    let params = { ...dialogForm.value };
    params.bbSjBbrq = props.data.year;
    let arr = [];
    baseInfo.xlfs.hasChoose.forEach((it) => {
      let obj = props.dic.D_BZ_XLFS.find((v) => v.label == it);
      if (obj) arr.push(obj.value);
    });
    params.xfxlfs = arr.join(",");
    let zbmj = handleRylist(dialogForm.value.zbmjStr, "当班民警");
    let zbfj = handleRylist(dialogForm.value.zbfjStr, "同行辅警");
    params.ryList = [];
    params.ryList = params.ryList.concat(zbmj, zbfj);
    // console.log(dialogForm.value.ryList, dialogForm.value.clList);

    // if (!dialogForm.value.ryList && dialogForm.value.clList.length == 0) {
    //   proxy.$message.warning("请选择巡逻方式和人员");
    //   return;
    // }
    params.clList = params.clList.map((item) => {
      item.tcryList = [];
      item.tcryListStr = item.tcryListStr?.map((it) => {
        it.list = it.list?.map((iv) => {
          let obj = {
            ryCzclId: item.cid || item.clId,
            ryId: iv.ryid,
            ryJzlx: iv.lx,
            xfllId: iv.id,
            ryMfjlb: iv.fl,
            rySfzh: iv.sfzh,
            ryXm: iv.xm,
            ryXfbbzw: it.dm
          };
          item.tcryList.push(obj);
          return {
            xm: iv.xm,
            sfzh: iv.sfzh,
            fl: iv.fl,
            id: iv.id,
            ryid: iv.ryid
          };
        });
        return {
          label: it.label,
          vlaue: it.dm,
          list: it.list,
          ryXfbbzw: it.dm,
          dm: it.dm,
          cid: it.cid
        };
      });
      let val = {
        clId: item.cid || item.clId,
        clmc: item.clmc,
        cph: item.cph,
        cplx: item.cplx,
        tcryList: item.tcryList,
        tcryListStr: JSON.stringify(item.tcryListStr)
      };
      if (props.text == "列表") val.id = item.id;
      return val;
    });

    if (params.bxdList) {
      params.bxdList = params.bxdList.map((v) => {
        return {
          bxdLx: v.xqlx,
          bxdMc: v.xqmc,
          bxdid: v.id,
          dkdz: "",
          jd: v.zxdJd,
          wd: v.zxdWd
        };
      });
    }
    if (params.bxxList) {
      params.bxxList = params.bxxList.map((v) => {
        return { bxxLx: v.xqlx, bxxMc: v.xqmc, bxxid: v.id };
      });
    }

    loading.value = true;
    let url =
      props.text == "日历"
        ? "/mosty-qwzx/tbQwglXfbb/save"
        : "/mosty-qwzx/tbQwglXfbb/update";
    let message = props.text == "日历" ? "新增成功" : "修改成功";
    servicePost(params, url)
      .then((res) => {
        loading.value = false;
        proxy.$message.success(message);
        emits("updateList");
      })
      .catch(() => {
        loading.value = false;
      });
  });
};

// 切换类型清空数据
const changeType = () => {
  dialogForm.value.xfqyMc = "";
  dialogForm.value.xfqyId = "";
  dialogForm.value.jwzMc = "";
  dialogForm.value.jwzLx = "";
  dialogForm.value.jwzId = "";
  dialogForm.value.jwzDz = "";
  dialogForm.value.bxdList = [];
  dialogForm.value.bxxList = [];
  dialogForm.value.hxgList = [];
};

// 回显数据
const showData = (val) => {
  dialogForm.value = JSON.parse(JSON.stringify(val));
  // 巡逻方式
  let xlfs = val.xfxlfs ? val.xfxlfs.split(",") : [];
  let arr = xlfs.map((it) => {
    return props.dic.D_BZ_XLFS.find((v) => v.value == it).label;
  });
  baseInfo.xlfs.hasChoose = arr;
  dialogForm.value.zbmjStr = []; //值班民警 01
  dialogForm.value.zbfjStr = []; //值班辅警 02
  if (dialogForm.value.ryList && dialogForm.value.ryList.length > 0) {
    dialogForm.value.ryList.forEach((item) => {
      let obj = {
        id: item.xfllId,
        ryid: item.ryId,
        lx: item.ryJzlx,
        fl: item.ryMfjlb,
        sfzh: item.rySfzh,
        xm: item.ryXm
      };
      if (item.ryMfjlb == "01") dialogForm.value.zbmjStr.push(obj); //值班民警
      if (item.ryMfjlb == "02") dialogForm.value.zbfjStr.push(obj); //值班辅警
    });
  }
  // c车辆
  if (dialogForm.value.clList && dialogForm.value.clList.length > 0) {
    dialogForm.value.clList.forEach((item) => {
      item.tcryListStr = JSON.parse(item.tcryListStr);
    });
  }
  // 必巡线
  if (dialogForm.value.bxxList) {
    dialogForm.value.bxxList = dialogForm.value.bxxList.map((v) => {
      return { xqlx: v.bxxLx, xqmc: v.bxxMc, id: v.bxxid };
    });
  }
  // 必巡点
  if (dialogForm.value.bxdList) {
    dialogForm.value.bxdList = dialogForm.value.bxdList.map((v) => {
      return {
        xqlx: v.bxdLx,
        xqmc: v.bxdMc,
        id: v.bxdid,
        zxdJd: v.jd,
        zxdWd: v.wd
      };
    });
  }
};
watch(
  () => props.data,
  (val) => {
    if (val && val.info) showData(val.info);
  },
  { immediate: true }
);
</script>

<style lang="scss" scoped>
.bblxItem {
  width: 100%;
  line-height: 40px;
  min-height: 40px;
  display: flex;
  .btItem {
    width: 180px;
    padding: 7px 0;
    background: #e9e9e9;
    color: #000;
    margin-top: 1px;
    text-align: center;
  }
  .info {
    flex: 1;
    background: #f2f2f2;
    margin-top: 1px;
    padding: 10px;
    box-sizing: border-box;
    .gapline {
      height: 1px;
      border-top: 1px dashed #e2e2e2;
      margin: 4px 0;
    }
    .dl-car {
      min-width: 200px;
      display: inline-block;
      border: solid 1px #66cbff;
      margin: 20px 30px 0 0;
      padding: 0;
      border-radius: 5px;
      position: relative;
      dt {
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #0380c0;
        padding: 0 10px 0 40px;
        box-sizing: border-box;
        font-weight: 600;
        box-sizing: border-box;
        border-bottom: solid 1px #66cbff;
        background: #e3f5ff;
        height: 30px;
        border-radius: 5px 5px 0 0;
      }
      .peo {
        border-bottom: solid 1px #01d608;
        background: #dbf3cf;
        color: #339d00;
      }
    }
    .dl-car::before {
      position: absolute;
      content: "";
      top: -18px;
      left: -18px;
      width: 52px;
      height: 49px;
      background: url("~@/assets/images/peo.png");
    }
  }

  .num {
    width: 50px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    border: 1px solid #d2d2d2;
    background-color: #e7e7e7;
    border-radius: 4px;
    margin-right: 10px;
  }
  .subBtn {
    padding-left: 100px;
    box-sizing: border-box;
  }
}

::v-deep .el-form-item--default {
  margin-bottom: 0;
}
::v-deep .el-form-item {
  margin-bottom: 10px;
}
::v-deep .el-form--inline .el-form-item {
  margin-right: 20px;
  margin-top: 10px;
}
::v-deep .el-input__inner {
  border: 1px solid #d2d2d2;
  background-color: #f9f9f9;
}
.deBtn {
  padding: 0px 10px;
  background: rgb(35, 176, 241);
  border-radius: 18px;
  color: #fff;
  cursor: pointer;
}
.dwBox {
  padding: 1px 4px;
  box-sizing: border-box;
  border-radius: 2px;
  border: 1px solid #0072ff;
  margin: 0 4px;
}
</style>
