1386 lines
41 KiB
Vue
1386 lines
41 KiB
Vue
<template>
|
||
<div>
|
||
<div class="titleBox">
|
||
<div class="title">巡防报备</div>
|
||
<div class="btnBox">
|
||
<el-button type="primary" @click="add">
|
||
<el-icon style="vertical-align: middle">
|
||
<CirclePlus />
|
||
</el-icon>
|
||
<span style="vertical-align: middle">手动报备</span>
|
||
</el-button>
|
||
<el-button :disabled="ids.length == 0" typeof="danger" @click="batchDelete">
|
||
<el-icon style="vertical-align: middle">
|
||
<Delete />
|
||
</el-icon>
|
||
<span style="vertical-align: middle">批量删除</span>
|
||
</el-button>
|
||
</div>
|
||
</div>
|
||
<div class="searchBox" ref="searchBox">
|
||
<el-form :model="listQuery" :inline="true">
|
||
<el-form-item label="巡防部门">
|
||
<MOSTY.Department width="180px" clearable filterable v-model="listQuery.ssbmdm" />
|
||
</el-form-item>
|
||
<el-form-item label="负责人">
|
||
<el-input v-model="listQuery.fzrXm" placeholder="请输入负责人姓名"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="巡防日期范围">
|
||
<el-date-picker v-model="Qzrq" type="daterange" unlink-panels range-separator="至" start-placeholder="开始日期"
|
||
end-placeholder="结束日期" @change="upQzrq" format="YYYY-MM-DD" value-format="YYYY-M-D HH:mm:ss" />
|
||
</el-form-item>
|
||
<el-form-item label="巡防报备范围">
|
||
<el-date-picker v-model="xfbbRange" type="datetimerange" unlink-panels range-separator="至"
|
||
start-placeholder="开始日期" end-placeholder="结束日期" @change="upxfbb" format="YYYY-MM-DD HH:mm:ss"
|
||
value-format="YYYY-MM-DD HH:mm:ss" />
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button @click="handleFilter"> 查询 </el-button>
|
||
<el-button @click="reset()"> 重置 </el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<div class="cntBox-bb">
|
||
<div class="tabBox">
|
||
<el-table :data="tableData" border @selection-change="handleSelectionChange" row-key="id" style="width: 100%"
|
||
:key="keyCount" :height="tableHeight" v-loading="loadingTable" element-loading-background="rgba(0,0,0,0.3)"
|
||
element-loading-text="数据加载中。。">
|
||
<el-table-column type="selection" width="40" align="center" />
|
||
<el-table-column type="index" show-overflow-tooltip align="center" width="60px" label="序号" />
|
||
<el-table-column prop="ssbm" show-overflow-tooltip align="center" label="巡防部门" />
|
||
<el-table-column prop="xfrq" show-overflow-tooltip align="center" label="巡防日期">
|
||
<template #default="{ row }">
|
||
<div> {{ row.xfrq ? row.xfrq.substring(0, 10) : row.xfrq }} </div>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="kssj" show-overflow-tooltip align="center" label="计划开始时间" v-if="!isShowMap" />
|
||
<el-table-column prop="jssj" show-overflow-tooltip align="center" label="计划结束时间" v-if="!isShowMap" />
|
||
<el-table-column prop="bbkssj" show-overflow-tooltip align="center" label="报备开始时间" />
|
||
<el-table-column prop="bbjssj" show-overflow-tooltip align="center" label="报备结束时间" />
|
||
|
||
<el-table-column prop="fzrXm" show-overflow-tooltip align="center" label="负责人" v-if="!isShowMap" />
|
||
<el-table-column prop="jlList" show-overflow-tooltip align="center" label="民警" v-if="!isShowMap">
|
||
<template #default="{ row }">
|
||
<el-tag class="mx-1" v-for="item in row.jlList" v-show="item.jllx == '01'" :key="item.id">{{ item.jlxm
|
||
}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="jlList" show-overflow-tooltip align="center" label="辅警" v-if="!isShowMap">
|
||
<template #default="{ row }">
|
||
<el-tag class="mx-1" v-for="item in row.jlList" v-show="item.jllx == '02'" :key="item.id">{{ item.jlxm
|
||
}}</el-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="wzlx" show-overflow-tooltip align="center" label="武装类型" v-if="!isShowMap">
|
||
<template #default="{ row }">
|
||
<dict-tag :options="D_BZ_WZLX" :value="row.wzlx" :tag="false"></dict-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column prop="xfsc" show-overflow-tooltip align="center" label="巡逻时长">
|
||
<template #default="{ row }">
|
||
<span v-if="row.xfsc">{{ (row.xfsc / 3600).toFixed(2) + "/h" }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column prop="xflc" show-overflow-tooltip align="center" label="巡逻里程">
|
||
<template #default="{ row }">
|
||
<span v-if="row.xflc">{{ (row.xflc / 1000).toFixed(2) + "/KM" }}</span>
|
||
</template>
|
||
</el-table-column>
|
||
|
||
<el-table-column prop="bblx" show-overflow-tooltip align="center" label="报备类型" v-if="!isShowMap">
|
||
<template #default="{ row }">
|
||
<dict-tag :options="D_BZ_BBFS" :value="row.bblx" :tag="false"></dict-tag>
|
||
</template>
|
||
</el-table-column>
|
||
<el-table-column label="操作" align="right" fixed="right" :width="isShowMap ? '200px' : '320px'">
|
||
<template #default="{ row }">
|
||
<el-button @click="handleBPH(row)" size="small" style="margin-bottom:4px;"
|
||
v-if="!isShowMap && !row.bphbbid">上报扁平化</el-button>
|
||
<el-button @click="deleteBPH(row)" type="danger" size="small" style="margin-bottom:4px;"
|
||
v-if="!isShowMap && row.bphbbid">删除扁平化</el-button>
|
||
<el-button @click="lookGj(row, 'gjhf')" size="small" style="margin-bottom:4px;">轨迹回放</el-button>
|
||
<el-button @click="lookGj(row, 'clgj')" size="small" style="margin-bottom:4px;">车辆轨迹</el-button>
|
||
<el-button @click="infDate(row)" size="small" v-if="!isShowMap" style="margin-bottom:4px;">详情</el-button>
|
||
<el-button v-if="row.bbzt != 1 && row.bbzt != 0 && !isShowMap" @click="update(row)" size="small"
|
||
style="margin-bottom:4px;">修改</el-button>
|
||
<el-button v-if="row.bbzt != 0 && row.bbzt != 1 && !isShowMap" size="small" @click="baoBei(row, '0')"
|
||
style="margin-bottom:4px;">报备</el-button>
|
||
<el-button v-if="row.bbzt == 0 && !isShowMap" size="small" @click="baoBei(row, '1')"
|
||
style="margin-bottom:4px;">结束报备</el-button>
|
||
<el-button type="danger" size="small" @click="delDictItem(row)" v-if="!isShowMap"
|
||
style="margin-bottom:4px;">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</el-table>
|
||
<div class="fenye" :style="{ top: tableHeight + 'px' }">
|
||
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||
:current-page="listQuery.pageCurrent" :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.pageSize"
|
||
layout="total, sizes, prev, pager, next, jumper" :total="total">
|
||
</el-pagination>
|
||
</div>
|
||
</div>
|
||
<div class="mapbox" v-if="isShowMap" :style="{ height: tableHeight + 50 + 'px' }">
|
||
<!-- 轨迹回放 -->
|
||
<MapDialog v-model:modelValue="isShowMap" :lxtype="typeGj" :data="gJDate" />
|
||
</div>
|
||
</div>
|
||
<div v-if="dialogFormVisible" class="dialog">
|
||
<div class="head_box">
|
||
<span class="title">{{ title }}</span>
|
||
<div>
|
||
<el-button v-if="isDetail" type="primary" size="small" @click="submit" :loading="btnLoading">{{ infoLoad ?
|
||
"开始报备"
|
||
: "结束报备" }}</el-button>
|
||
<el-button size="small" @click="close">关闭</el-button>
|
||
</div>
|
||
</div>
|
||
<el-form ref="elform" :model="form" :rules="rules" :inline="true" label-position="top">
|
||
<el-form-item label="巡防部门" prop="ssbmdm" style="width: 100%;">
|
||
<MOSTY.Department style="width: 100%" :placeholder="form.ssbm" clearable filterable v-model="form.ssbmdm" />
|
||
</el-form-item>
|
||
<el-form-item label="巡防日期" prop="xfrq">
|
||
<el-date-picker :disabled="ischooseTime" style="width: 100%" v-model="form.xfrq" placeholder="请选择"
|
||
format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
|
||
</el-form-item>
|
||
<el-form-item prop="xffwlx" label="巡防范围类型">
|
||
<el-radio-group v-model="form.xffwlx" @change="rad(form.xffwlx)">
|
||
<el-radio label="1">巡防区</el-radio>
|
||
<el-radio label="2">快反点</el-radio>
|
||
<el-radio label="3">检查站</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="巡防区" v-if="form.xffwlx == '1'">
|
||
<el-select @change="fxChange" v-model="form.xf" clearable multiple placeholder="请选择巡防区">
|
||
<el-option v-for="item in xfList.xfqList" :key="item.id" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="快反点" v-if="form.xffwlx == '2'">
|
||
<el-select @change="fxChange" v-model="form.xffwid" clearable placeholder="请选择快反点">
|
||
<el-option v-for="item in xfList.kfdList" :key="item.id" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
<el-form-item label="检查站" v-if="form.xffwlx == '3'">
|
||
<el-select @change="fxChange" v-model="form.xffwid" clearable placeholder="请选择检查站">
|
||
<el-option v-for="item in xfList.jczList" :key="item.id" :label="item.label" :value="item.value" />
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
<el-form-item style="width: 100%" label="班次选择" prop="qwbcId">
|
||
<el-radio-group @change="setQwbc" v-model="form.qwbcId">
|
||
<el-radio style="margin: 8px" v-for="item in qwbaDataList" :key="item.id" :label="item.id">
|
||
<div class="tags" :style="{ borderColor: item.bcys }">
|
||
<span>{{ setHm(item.kssj) }}-{{ setHm(item.jssj) }}</span>
|
||
<span>{{ item.bcmc }}</span>
|
||
</div>
|
||
</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item prop="kssj" label="开始时间">
|
||
<el-time-picker style="width: 100%" v-model="form.kssj" placeholder="请选择" format="HH:mm:ss"
|
||
value-format="HH:mm:ss" @change="setJgts" />
|
||
</el-form-item>
|
||
<el-form-item prop="jssj" label="结束时间">
|
||
<el-time-picker style="width: 100%" v-model="form.jssj" placeholder="请选择" format="HH:mm:ss"
|
||
value-format="HH:mm:ss" @change="setJgts" />
|
||
</el-form-item>
|
||
<el-form-item label="选择警组" prop="jzId">
|
||
<el-select v-model="form.jzId" filterable style="width: 100%" placeholder="请选择警组" @change="setJz">
|
||
<el-option v-for="item in jzData" :key="item.id" :label="item.jzMc" :value="item.id"></el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
|
||
<el-form-item label="负责人" prop="fzrXm">
|
||
<el-input readonly @click="chooseUserVisible = true" v-model="form.fzrXm" placeholder="请选择负责人" clearable
|
||
style="width: 100%" />
|
||
</el-form-item>
|
||
<el-form-item label="身份证" prop="fzrSfzh">
|
||
<el-input style="width: 100%" v-model="form.fzrSfzh" placeholder="请填写负责人身份证号"></el-input>
|
||
</el-form-item>
|
||
<el-form-item label="负责人电话" prop="fzrLxdh">
|
||
<el-input style="width: 100%" v-model="form.fzrLxdh" placeholder="请填写负责人电话"></el-input>
|
||
</el-form-item>
|
||
<el-form-item style="width: 100%" label="民警" prop="">
|
||
<div :class="mjData.length === 0 ? 'ipt mj' : 'ipt'" @click.stop="mjVisible = true">
|
||
<el-tag v-for="tag in mjData" :key="tag.id" class="mx-1" closable :type="tag.type"
|
||
@close="handleClose(tag)">
|
||
{{ tag.jlxm }}
|
||
</el-tag>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item style="width: 100%" label="辅警" prop="">
|
||
<div :class="fjData.length === 0 ? 'ipt fj' : 'ipt'" @click.stop="fjVisible = true">
|
||
<el-tag v-for="tag in fjData" :key="tag.id" class="mx-1" closable :type="tag.type"
|
||
@close="handleClosefj(tag)">
|
||
{{ tag.jlxm }}
|
||
</el-tag>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item style="width: 100%" label="智能装备" prop="">
|
||
<div :class="znzbData.length === 0 ? 'ipt znzb' : 'ipt'" @click.stop="znzbVisible = true">
|
||
<el-tag v-for="tag in znzbData" :key="tag.id" class="mx-1" closable :type="tag.type"
|
||
@close="handleCloseZb(tag)">
|
||
{{ tag.sbmc }}
|
||
</el-tag>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item style="width: 100%" label="常用装备" prop="">
|
||
<div :class="jyqxData.length === 0 ? 'ipt jyqx' : 'ipt'" @click.stop="jyqxVisible = true">
|
||
<el-tag v-for="tag in jyqxData" :key="tag.id" class="mx-1" closable :type="tag.type"
|
||
@close="handleCloseQx(tag)">
|
||
{{ tag.qxmc }}
|
||
</el-tag>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item style="width: 100%" label="巡防车辆" prop="">
|
||
<div :class="jyclData.length === 0 ? 'ipt cl' : 'ipt'" @click.stop="jyclVisible = true">
|
||
<el-tag v-for="tag in jyclData" :key="tag.id" class="mx-1" closable :type="tag.type"
|
||
@close="handleCloseCl(tag)">
|
||
{{ tag.jdchphm }}
|
||
</el-tag>
|
||
</div>
|
||
</el-form-item>
|
||
<el-form-item v-for="item in jyqxData" :key="item.qxid" :label="item.qxmc">
|
||
<el-input-number style="width: 100%" v-model="item.qxsl" class="mx-4" :min="0" />
|
||
</el-form-item>
|
||
<div style="width: 100%"></div>
|
||
<el-form-item label="巡逻方式" prop="xlfs">
|
||
<el-radio-group v-model="form.xlfs" class="ml-4">
|
||
<el-radio v-for="(item, index) in D_BZ_XLFS" :label="item.value" :key="index">{{ item.label }}</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="武装类型" prop="wzlx">
|
||
<el-radio-group v-model="form.wzlx" class="ml-4">
|
||
<el-radio v-for="(item, index) in D_BZ_WZLX" :label="item.value" :key="index">{{ item.label }}</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="着装类型" prop="zzlx">
|
||
<el-radio-group v-model="form.zzlx" class="ml-4">
|
||
<el-radio v-for="(item, index) in D_BZ_ZZLX" :key="index" :label="item.value">{{ item.label }}</el-radio>
|
||
</el-radio-group>
|
||
</el-form-item>
|
||
<el-form-item label="备注" style="width: 100%">
|
||
<el-input v-model="form.bz" placeholder="请输入关键字" show-word-limit type="textarea" />
|
||
</el-form-item>
|
||
</el-form>
|
||
</div>
|
||
<ChooseUser v-model="chooseUserVisible" @choosedUsers="hanlderChoose" />
|
||
<MjLoad v-model="mjVisible" @choosedUsers="hanlderChooseMj" />
|
||
<FjLoad v-model="fjVisible" @choosedUsers="hanlderChooseFj" />
|
||
<JyqxLoad v-model="jyqxVisible" @choosedUsers="hanlderChooseJyqx" />
|
||
<JyclLoad v-model="jyclVisible" @choosedUsers="hanlderChooseJycl" />
|
||
<ZnzbLoad v-model="znzbVisible" @choosedUsers="hanlderChooseZnzb" />
|
||
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { qcckGet, qcckPost } from "@/api/qcckApi.js";
|
||
import emitter from "@/utils/eventBus.js";
|
||
import ChooseUser from "@/components/MyComponents/ChooseUser";
|
||
import MapDialog from './mapDialog.vue'
|
||
import MjLoad from "@/components/MyComponents/ChooseJz/MjLoad.vue";
|
||
import FjLoad from "@/components/MyComponents/ChooseJz/FjLoad.vue";
|
||
import JyqxLoad from "@/components/MyComponents/ChooseJz/JyqxLoad.vue";
|
||
import JyclLoad from "@/components/MyComponents/ChooseJz/JzclLoad.vue";
|
||
import ZnzbLoad from "@/components/MyComponents/ChooseJz/ZnzbLoad.vue";
|
||
import { getQwbc } from "@/api/service/shift.js";
|
||
import * as MOSTY from "@/components/MyComponents/index";
|
||
import { selectDeptPage } from "@/api/user-manage";
|
||
import { getqwdj } from "@/api/service/grade.js";
|
||
import { getXfbb, addXfbb, deleteXfbb, getXfbbInfo, updateXfbb, xfbb, getMybbTodayNew, getMyXfpbToday } from "@/api/service/watchmanFiling.js";
|
||
import { getJzList } from "@/api/basicsmanage/servicejz.js";
|
||
import { getKfd } from "@/api/basicsmanage/quick-rebate.js";
|
||
import { getXfqy } from "@/api/basicsmanage/patrolArea.js";
|
||
import { ref, reactive, onMounted, onUnmounted, getCurrentInstance, watch, nextTick } from "vue";
|
||
const { proxy } = getCurrentInstance();
|
||
const { D_BZ_ZZLX, D_BZ_WZLX, D_BZ_XLFS, D_BZ_BBFS } = proxy.$dict("D_BZ_ZZLX", "D_BZ_WZLX", "D_BZ_XLFS", "D_BZ_BBFS");
|
||
const gJDate = ref({})
|
||
const D_BZ_DJQW = ref([]);
|
||
const qwbaDataList = ref([]); //勤务班次数据
|
||
const searchBox = ref(null); // 搜索盒子
|
||
const Qzrq = ref([]);
|
||
const xfbbRange = ref([]);
|
||
const typeGj = ref('') //轨迹回放类型
|
||
const jzData = ref([]); //警组列表数据
|
||
const tableHeight = ref(); // 表格高度
|
||
const loadingTable = ref(true);
|
||
const chackAdd = ref(false);
|
||
const qwbcD = ref([]); //勤务班次单选数据
|
||
const cascader = ref(null);
|
||
const ids = ref([]); //批量删除的ID
|
||
const tableData = ref([]); //表格数据
|
||
const depList = ref([]); //部门数据
|
||
const infoLoad = ref(false);
|
||
const btnLoading = ref(false); //按钮截流
|
||
const keyCount = ref(0); //tabel组件刷新值
|
||
const chooseUserVisible = ref(false);
|
||
const title = ref("新增巡防报备");
|
||
const elform = ref(null);
|
||
const total = ref(0);
|
||
const mjVisible = ref(false); //民警弹窗
|
||
const mjData = ref([]);
|
||
const fjVisible = ref(false); //辅警弹窗
|
||
const fjData = ref([]);
|
||
const jyqxVisible = ref(false); //常用装备弹窗
|
||
const jyqxData = ref([]);
|
||
const jyclVisible = ref(false); //警用车辆弹窗
|
||
const jyclData = ref([]);
|
||
const znzbVisible = ref(false); //智能装备弹窗
|
||
const znzbData = ref([]);
|
||
const dialogFormVisible = ref(false); //弹窗
|
||
|
||
const isShowMap = ref(false) //展示地图
|
||
|
||
//搜索数据
|
||
const listQuery = ref({
|
||
pageCurrent: 1,
|
||
pageSize: 20
|
||
});
|
||
//表单数据
|
||
const form = ref({});
|
||
//级联选择器配置
|
||
const props = {
|
||
expandTrigger: "children",
|
||
children: "childDeptList",
|
||
label: "orgName",
|
||
value: "id",
|
||
checkStrictly: true,
|
||
emitPath: false
|
||
};
|
||
watch(() => isShowMap.value, (val) => {
|
||
emitter.emit('closeMeun')
|
||
})
|
||
function upQzrq(val) {
|
||
listQuery.value.ksXfrq = val ? val[0] : '';
|
||
listQuery.value.jsXfrq = val ? val[1] : '';
|
||
}
|
||
function upxfbb(val) {
|
||
listQuery.value.bbkssj = val ? val[0] : '';
|
||
listQuery.value.bbjssj = val ? val[1] : '';
|
||
}
|
||
//表单验证
|
||
const rules = reactive({
|
||
ssbmdm: [
|
||
{
|
||
required: true,
|
||
message: "请选择部门",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
xfrq: [
|
||
{
|
||
required: true,
|
||
message: "请选择巡防日期",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
xffwlx: [
|
||
{
|
||
required: true,
|
||
message: "请选择巡防范围类型",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
qwbcId: [
|
||
{
|
||
required: true,
|
||
message: "请选择巡防排班",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
jssj: [
|
||
{
|
||
required: true,
|
||
message: "请选择结束时间",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
kssj: [
|
||
{
|
||
required: true,
|
||
message: "请选择开始时间",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
jzId: [
|
||
{
|
||
required: true,
|
||
message: "请选择警组",
|
||
trigger: "change"
|
||
}
|
||
],
|
||
fzrXm: [
|
||
{
|
||
required: true,
|
||
message: "请选择负责人",
|
||
trigger: "change"
|
||
}
|
||
]
|
||
});
|
||
//选择用户
|
||
const hanlderChoose = (users) => {
|
||
const user = users[0];
|
||
form.value.fzrXm = user.userName;
|
||
form.value.fzrSfzh = user.idEntityCard;
|
||
form.value.fzrLxdh = user.mobile;
|
||
form.value.fzrId = user.id;
|
||
};
|
||
|
||
const nowYear = ref(new Date().getFullYear());
|
||
const nowmonth = ref(new Date().getMonth() + 1);
|
||
const nowDay = ref(new Date().getDate());
|
||
const nowtime = ref("");
|
||
const xfList = reactive({
|
||
xfqList: [],
|
||
kfdList: [],
|
||
jczList: []
|
||
});
|
||
const xffwList = ref([]); //用户选中的巡防类型数
|
||
// 获取当天的报备信息或排班信息 没有报备信息则查询排班
|
||
const ischooseTime = ref(false);
|
||
//选中的巡防区
|
||
function fxChange(val) {
|
||
xffwList.value = [];
|
||
if (form.value.xffwlx == "1") {
|
||
val.forEach((item) => {
|
||
xfList.xfqList.forEach((el) => {
|
||
if (item == el.value)
|
||
xffwList.value.push({
|
||
fwMc: el.label,
|
||
glbid: el.value,
|
||
id: el.value,
|
||
qwlx: "1",
|
||
xffwlx: form.value.xffwlx
|
||
});
|
||
});
|
||
});
|
||
} else if (form.value.xffwlx == "2") {
|
||
val.forEach((item) => {
|
||
xfList.kfdList.forEach((el) => {
|
||
if (item == el.value)
|
||
xffwList.value.push({
|
||
fwMc: el.label,
|
||
glbid: el.value,
|
||
id: el.value,
|
||
qwlx: "1",
|
||
xffwlx: form.value.xffwlx
|
||
});
|
||
});
|
||
});
|
||
} else if (form.value.xffwlx == "3") {
|
||
val.forEach((item) => {
|
||
xfList.jczList.forEach((el) => {
|
||
if (item == el.value)
|
||
xffwList.value.push({
|
||
fwMc: el.label,
|
||
glbid: el.value,
|
||
id: el.value,
|
||
qwlx: "1",
|
||
xffwlx: form.value.xffwlx
|
||
});
|
||
});
|
||
});
|
||
}
|
||
}
|
||
//选择巡防区
|
||
function rad(item, index) {
|
||
form.value.xf = null;
|
||
form.value.xffwList = [];
|
||
switch (item.value) {
|
||
case "1":
|
||
form.value.xf = [];
|
||
break;
|
||
case "2":
|
||
form.value.xf = "";
|
||
break;
|
||
case "3":
|
||
form.value.zqList.xf = "";
|
||
break;
|
||
}
|
||
}
|
||
function getTodayInfo() {
|
||
getMybbTodayNew().then((res) => {
|
||
if (res === null) {
|
||
getMyXfpbToday().then((respb) => {
|
||
if (respb !== null) {
|
||
let time_month = nowmonth.value; //现在的月份
|
||
let time_day = nowDay.value; //现在的天数
|
||
if (nowmonth.value < 10) {
|
||
time_month = 0 + "" + nowmonth.value;
|
||
}
|
||
if (nowDay.value < 10) {
|
||
time_day = 0 + "" + nowDay.value;
|
||
}
|
||
nowtime.value = nowYear.value + "-" + time_month + "-" + time_day;
|
||
infoLoad.value = true;
|
||
form.value = respb;
|
||
mjData.value = !form.value.pbmj ? [] : JSON.parse(form.value.pbmj);
|
||
fjData.value = !form.value.pbfj ? [] : JSON.parse(form.value.pbfj);
|
||
jyclData.value = !form.value.pbcl ? [] : JSON.parse(form.value.pbcl);
|
||
znzbData.value = !form.value.txzb ? [] : JSON.parse(form.value.txzb);
|
||
jyqxData.value = !form.value.jyqx ? [] : JSON.parse(form.value.jyqx);
|
||
form.value.xfrq = nowtime.value;
|
||
ischooseTime.value = true;
|
||
form.value.xffwlx = respb.xffwlx;
|
||
try {
|
||
form.value.xf = respb.xffwid.split(",");
|
||
} catch (error) {
|
||
form.value.xf = respb.xffwid;
|
||
}
|
||
fxChange(form.value.xf);
|
||
}
|
||
});
|
||
} else {
|
||
infoLoad.value = false;
|
||
form.value = res;
|
||
mjData.value = !form.value.pbmj ? [] : JSON.parse(form.value.pbmj);
|
||
fjData.value = !form.value.pbfj ? [] : JSON.parse(form.value.pbfj);
|
||
jyclData.value = !form.value.pbcl ? [] : JSON.parse(form.value.pbcl);
|
||
znzbData.value = !form.value.txzb ? [] : JSON.parse(form.value.txzb);
|
||
jyqxData.value = !form.value.jyqx ? [] : JSON.parse(form.value.jyqx);
|
||
ischooseTime.value = false;
|
||
form.value.xffwlx = res.xffwlx;
|
||
try {
|
||
form.value.xf = res.xffwid.split(",");
|
||
} catch (error) {
|
||
form.value.xf = res.xffwid;
|
||
}
|
||
fxChange(form.value.xf);
|
||
}
|
||
});
|
||
}
|
||
//巡防范围配置
|
||
const propsXffw = {
|
||
lazy: true,
|
||
lazyLoad(node, resolve) {
|
||
const { level, value } = node;
|
||
let nodes = [];
|
||
if (value == "1") {
|
||
getXfqy({ pageCurrent: 1, pageSize: 1000 }).then((res) => {
|
||
nodes = res.records.map((item) => {
|
||
return { value: item.id, label: item.xfqMc, leaf: level >= 1 };
|
||
});
|
||
resolve(nodes);
|
||
});
|
||
} else if (value == "2") {
|
||
getKfd({ pageNum: 1, pageSize: 100, dwlxs: "01" }).then((res) => {
|
||
nodes = res.records.map((item) => {
|
||
return { value: item.kfdId, label: item.kfdMc, leaf: level >= 1 };
|
||
});
|
||
resolve(nodes);
|
||
});
|
||
} else if (value == "3") {
|
||
getKfd({ pageNum: 1, pageSize: 100, dwlxs: "02" }).then((res) => {
|
||
nodes = res.records.map((item) => {
|
||
return { value: item.kfdId, label: item.kfdMc, leaf: level >= 1 };
|
||
});
|
||
resolve(nodes);
|
||
});
|
||
}
|
||
}
|
||
};
|
||
//获取勤务等级
|
||
function getQwDj() {
|
||
let params = { fbzt: "1", pageCurrent: 1, pageSize: 1000 };
|
||
getqwdj(params).then((res) => {
|
||
D_BZ_DJQW.value = res.records.map((item) => {
|
||
let data = "一级勤务";
|
||
if (item.qwdj == "01") {
|
||
data = "一级勤务";
|
||
} else if (item.qwdj == "02") {
|
||
data = "二级勤务";
|
||
} else if (item.qwdj == "03") {
|
||
data = "三级勤务";
|
||
} else {
|
||
data = "日常勤务";
|
||
}
|
||
return { value: item.qwdj, label: data };
|
||
});
|
||
});
|
||
}
|
||
// 时分秒截取
|
||
function setHm(item) {
|
||
return item.split(":")[0] + ":" + item.split(":")[1];
|
||
}
|
||
//搜索
|
||
function handleFilter() {
|
||
listQuery.value.pageNum = 1
|
||
getListData();
|
||
}
|
||
|
||
//巡防力量弹框相关
|
||
function handleClose(tag) {
|
||
mjData.value.splice(mjData.value.indexOf(tag), 1);
|
||
}
|
||
//选择民警
|
||
function hanlderChooseMj(arr) {
|
||
const jzryList = arr.map((item) => {
|
||
return {
|
||
jlId: item.id,
|
||
jllx: item.fl,
|
||
jlxm: item.xm,
|
||
sfzh: item.sfzh,
|
||
lxdh: item.lxdh,
|
||
xbdm: item.xbdm,
|
||
xl: item.lx ? item.lx : "04"
|
||
};
|
||
});
|
||
mjData.value = jzryList;
|
||
}
|
||
function handleClosefj(tag) {
|
||
fjData.value.splice(fjData.value.indexOf(tag), 1);
|
||
}
|
||
function getQwbcData() {
|
||
let params = {
|
||
pageCurrent: 1,
|
||
pageSize: 1000,
|
||
bclx: "02"
|
||
};
|
||
getQwbc(params).then((res) => {
|
||
qwbaDataList.value = res.records.map((item) => {
|
||
return {
|
||
bcys: item.bcys,
|
||
kssj: item.kssj,
|
||
jssj: item.jssj,
|
||
id: item.id,
|
||
zqsc: item.zqsc,
|
||
bcmc: item.bcmc
|
||
};
|
||
});
|
||
});
|
||
}
|
||
function setQwbc() {
|
||
qwbaDataList.value.forEach((v) => {
|
||
if (v.id == form.value.qwbcId) {
|
||
form.value.kssj = v.kssj;
|
||
form.value.jssj = v.jssj;
|
||
form.value.qwbcId = v.id;
|
||
form.value.zqsc = v.zqsc;
|
||
qwbcD.value = [v];
|
||
}
|
||
});
|
||
}
|
||
//选择辅警
|
||
function hanlderChooseFj(arr) {
|
||
const jzryList = arr.map((item) => {
|
||
return {
|
||
jlId: item.id,
|
||
jllx: item.fl,
|
||
jlxm: item.xm,
|
||
sfzh: item.sfzh,
|
||
lxdh: item.lxdh,
|
||
xbdm: item.xbdm,
|
||
xl: item.lx
|
||
};
|
||
});
|
||
fjData.value = jzryList;
|
||
}
|
||
function handleCloseCl(tag) {
|
||
jyclData.value.splice(jyclData.value.indexOf(tag), 1);
|
||
}
|
||
//选择警用车辆
|
||
function hanlderChooseJycl(arr) {
|
||
const clList = arr.map((item) => {
|
||
return {
|
||
clId: item.cid,
|
||
jdchphm: item.cph,
|
||
jdchpzldm: item.cplx,
|
||
gpsId: item.gpsId
|
||
};
|
||
});
|
||
jyclData.value = clList;
|
||
}
|
||
function handleCloseZb(tag) {
|
||
znzbData.value.splice(znzbData.value.indexOf(tag), 1);
|
||
}
|
||
//选择智能装备
|
||
function hanlderChooseZnzb(arr) {
|
||
const txzbList = arr.map((item) => {
|
||
return {
|
||
txzblx: item.scode,
|
||
zbId: item.id,
|
||
sbmc: item.sbmc,
|
||
hh: item.sbbh,
|
||
sbbh: item.sbbh,
|
||
sfrh: item.sfrh,
|
||
sfzy: item.sfzy,
|
||
sfxt: item.sfxt
|
||
};
|
||
});
|
||
znzbData.value = txzbList;
|
||
}
|
||
function handleCloseQx(tag) {
|
||
jyqxData.value.splice(jyqxData.value.indexOf(tag), 1);
|
||
}
|
||
|
||
//切换警组
|
||
function setJz() {
|
||
jzData.value.forEach((v) => {
|
||
if (form.value.jzId == v.id) {
|
||
form.value.fzrXm = v.ddMjxm;
|
||
form.value.fzrId = v.ddMjid;
|
||
form.value.jzMc = v.jzMc;
|
||
form.value.fzrSfzh = v.ddMjsfzh;
|
||
form.value.fzrLxdh = v.ddDh;
|
||
jyqxData.value = v.jyqxList.map((item) => {
|
||
return {
|
||
qxid: item.qxId,
|
||
qxlx: item.scode,
|
||
qxsl: item.qxsl,
|
||
qxmc: item.qxmc
|
||
};
|
||
});
|
||
jyclData.value = v.clList.map((item) => {
|
||
return {
|
||
clId: item.clId,
|
||
jdchphm: item.jdchphm,
|
||
jdchpzldm: item.jdchpzldm,
|
||
gpsId: item.gpsId
|
||
};
|
||
});
|
||
fjData.value = [];
|
||
mjData.value = [];
|
||
v.jzryList.forEach((item) => {
|
||
if (item.jllx == "01") {
|
||
mjData.value.push({
|
||
jlId: item.ryId,
|
||
jllx: item.jllx,
|
||
jlxm: item.jlxm,
|
||
sfzh: item.sfzh,
|
||
lxdh: item.lxdh,
|
||
xbdm: item.xbdm
|
||
});
|
||
} else {
|
||
fjData.value.push({
|
||
jlId: item.ryid,
|
||
jllx: item.jllx,
|
||
jlxm: item.jlxm,
|
||
sfzh: item.sfzh,
|
||
lxdh: item.lxdh,
|
||
xbdm: item.xbdm
|
||
});
|
||
}
|
||
});
|
||
znzbData.value = v.txzbList.map((item) => {
|
||
return {
|
||
txzblx: item.txzblx,
|
||
zbId: item.zbId,
|
||
sbmc: item.sbmc,
|
||
hh: item.hh,
|
||
sbbh: item.sbbh,
|
||
sfrh: item.sfrh,
|
||
sfzy: item.sfzy,
|
||
sfxt: item.sfxt
|
||
};
|
||
});
|
||
}
|
||
});
|
||
}
|
||
function setJgts() {
|
||
if (form.value.kssj && form.value.jssj) {
|
||
let start =
|
||
form.value.kssj.split(":")[0] * 3600 +
|
||
form.value.kssj.split(":")[1] * 60 +
|
||
orm.value.kssj.split(":")[2] * 1;
|
||
let end =
|
||
form.value.jssj.split(":")[0] * 3600 +
|
||
form.value.jssj.split(":")[1] * 60 +
|
||
orm.value.jssj.split(":")[2] * 1;
|
||
if (start <= end) {
|
||
form.value.jgts = 1;
|
||
} else {
|
||
form.value.jgts = 0;
|
||
}
|
||
}
|
||
}
|
||
//选择常用装备
|
||
function hanlderChooseJyqx(arr) {
|
||
const jyqxList = arr.map((item) => {
|
||
return { qxid: item.id, qxlx: item.scode, qxsl: 1, qxmc: item.qxMc };
|
||
});
|
||
jyqxData.value = jyqxList;
|
||
}
|
||
// 获取警组列表
|
||
function getJzData() {
|
||
let params = {
|
||
pageCurrent: 1,
|
||
pageSize: 1000
|
||
};
|
||
getJzList(params).then((res) => {
|
||
jzData.value = res.records;
|
||
});
|
||
}
|
||
//重置
|
||
function reset() {
|
||
Qzrq.value = [];
|
||
xfbbRange.value = [];
|
||
listQuery.value = {
|
||
pageCurrent: 1,
|
||
pageSize: 20
|
||
};
|
||
getListData();
|
||
}
|
||
//新增表单重置
|
||
function resetForm() {
|
||
form.value = {
|
||
xlfs: "1",
|
||
wzlx: "1",
|
||
zzlx: "1",
|
||
xffwlx: "1",
|
||
xf: ""
|
||
};
|
||
}
|
||
//新增
|
||
function add() {
|
||
getTodayInfo();
|
||
isDetail.value = true;
|
||
infoLoad.value = true;
|
||
chackAdd.value = true;
|
||
jyclData.value = [];
|
||
mjData.value = [];
|
||
fjData.value = [];
|
||
jyqxData.value = [];
|
||
znzbData.value = [];
|
||
resetForm();
|
||
title.value = "新增巡防报备";
|
||
dialogFormVisible.value = true;
|
||
}
|
||
|
||
// 轨迹回放
|
||
function lookGj(row, type) {
|
||
console.log(row.clList, type);
|
||
if (type == 'clgj' && row.clList && row.clList.length == 0) {
|
||
isShowMap.value = false;
|
||
return proxy.$message({ type: "info", message: '该数据没有报备车辆' });
|
||
} else {
|
||
nextTick(() => {
|
||
isShowMap.value = true;
|
||
typeGj.value = type
|
||
gJDate.value = row;
|
||
})
|
||
}
|
||
}
|
||
|
||
//详情
|
||
const isDetail = ref(true);
|
||
function infDate(row) {
|
||
isDetail.value = false;
|
||
infoLoad.value = false;
|
||
chackAdd.value = false;
|
||
jyclData.value = [];
|
||
mjData.value = [];
|
||
fjData.value = [];
|
||
jyqxData.value = [];
|
||
znzbData.value = [];
|
||
getXfbbInfo(row.id).then((res) => {
|
||
form.value = JSON.parse(JSON.stringify(res));
|
||
console.log(form.value);
|
||
if (res.xffwlx && res.xffwid) {
|
||
form.value.xffwlx = res.xffwlx;
|
||
try {
|
||
form.value.xf = res.xffwid.split(",");
|
||
} catch (error) {
|
||
form.value.xf = res.xffwid;
|
||
}
|
||
}
|
||
res.clList.forEach((v) => {
|
||
jyclData.value.push(v);
|
||
});
|
||
res.jyqxList.forEach((v) => {
|
||
jyqxData.value.push(v);
|
||
});
|
||
res.jlList.forEach((v) => {
|
||
if (v.jllx == "01") {
|
||
mjData.value.push(v);
|
||
} else {
|
||
fjData.value.push(v);
|
||
}
|
||
});
|
||
res.znzbList.forEach((v) => {
|
||
znzbData.value.push(v);
|
||
});
|
||
title.value = "巡防报备详情";
|
||
dialogFormVisible.value = true;
|
||
});
|
||
}
|
||
//修改
|
||
function update(row) {
|
||
isDetail.value = true;
|
||
infoLoad.value = true;
|
||
chackAdd.value = false;
|
||
jyclData.value = [];
|
||
mjData.value = [];
|
||
fjData.value = [];
|
||
jyqxData.value = [];
|
||
znzbData.value = [];
|
||
getXfbbInfo(row.id).then((res) => {
|
||
form.value = JSON.parse(JSON.stringify(res));
|
||
if (res.xffwlx && res.xffwid) {
|
||
form.value.xffwlx = [res.xffwlx, res.xffwid];
|
||
}
|
||
res.clList.forEach((v) => {
|
||
jyclData.value.push(v);
|
||
});
|
||
res.jyqxList.forEach((v) => {
|
||
jyqxData.value.push(v);
|
||
});
|
||
res.jlList.forEach((v) => {
|
||
if (v.jllx == "01") {
|
||
mjData.value.push(v);
|
||
} else {
|
||
fjData.value.push(v);
|
||
}
|
||
});
|
||
res.znzbList.forEach((v) => {
|
||
znzbData.value.push(v);
|
||
});
|
||
title.value = "巡防报备修改";
|
||
dialogFormVisible.value = true;
|
||
});
|
||
}
|
||
// 获取当天日期
|
||
function nowDateFn() {
|
||
let now = new Date();
|
||
let year = now.getFullYear();
|
||
let month = now.getMonth() + 1;
|
||
let date = now.getDate();
|
||
if ((month + "").length == 1) {
|
||
month = "0" + month;
|
||
}
|
||
if ((date + "").length == 1) {
|
||
date = "0" + date;
|
||
}
|
||
return year + "-" + month + "-" + date;
|
||
}
|
||
//报备
|
||
function baoBei(row, zt) {
|
||
let text = "报备";
|
||
if (zt == 1) {
|
||
text = "结束报备";
|
||
const bbjssj = "";
|
||
} else {
|
||
text = "开始报备";
|
||
}
|
||
proxy
|
||
.$confirm(`是否${text}？`)
|
||
.then(() => {
|
||
xfbb({ id: row.id, bbzt: zt }).then(() => {
|
||
proxy.$message({
|
||
type: "success",
|
||
message: `${text}成功`
|
||
});
|
||
getListData();
|
||
});
|
||
})
|
||
.catch(() => {
|
||
proxy.$message.info("已取消操作");
|
||
});
|
||
}
|
||
|
||
// 确定是否上报
|
||
function handleBPH(row) {
|
||
proxy.$confirm("确定是否上报？", "警告", { type: "warning" }).then(() => {
|
||
qcckPost({}, '/mosty-jmxf/tbQwXfbb/sbBph?bbid=' + row.id).then(() => {
|
||
proxy.$message({ type: "success", message: "上报成功" });
|
||
getListData();
|
||
});
|
||
}).catch(() => {
|
||
proxy.$message.info("已取消");
|
||
});
|
||
}
|
||
// 确定是否删除上报
|
||
function deleteBPH(row) {
|
||
proxy.$confirm("确定是否删除上报？", "警告", { type: "warning" }).then(() => {
|
||
loadingTable.value = true;
|
||
qcckPost({}, '/mosty-jmxf/tbQwXfbb/dlBph?bbid=' + row.id).then(() => {
|
||
proxy.$message({ type: "success", message: "删除成功" });
|
||
getListData();
|
||
}).catch(() => {
|
||
loadingTable.value = true;
|
||
});
|
||
}).catch(() => {
|
||
proxy.$message.info("已取消");
|
||
});
|
||
}
|
||
|
||
//删除
|
||
function delDictItem(row) {
|
||
proxy
|
||
.$confirm("确定删除报备数据？", "警告", { type: "warning" })
|
||
.then(() => {
|
||
deleteXfbb([row.id]).then(() => {
|
||
proxy.$message({
|
||
type: "success",
|
||
message: "删除成功"
|
||
});
|
||
getListData();
|
||
});
|
||
})
|
||
.catch(() => {
|
||
proxy.$message.info("已取消");
|
||
});
|
||
}
|
||
//批量数据
|
||
const handleSelectionChange = (val) => {
|
||
ids.value = [];
|
||
if (val) {
|
||
val.forEach((item) => {
|
||
ids.value.push(item.id);
|
||
});
|
||
}
|
||
};
|
||
function batchDelete() {
|
||
proxy
|
||
.$confirm("确定批量删除报备数据？", "警告", { type: "warning" })
|
||
.then(() => {
|
||
deleteXfbb(ids.value).then(() => {
|
||
proxy.$message({
|
||
type: "success",
|
||
message: "删除成功"
|
||
});
|
||
getListData();
|
||
});
|
||
})
|
||
.catch(() => {
|
||
proxy.$message.info("已取消");
|
||
});
|
||
}
|
||
//获取列表数据
|
||
function getListData() {
|
||
loadingTable.value = true;
|
||
getXfbb(listQuery.value)
|
||
.then((res) => {
|
||
tableData.value = res.records;
|
||
total.value = res.total;
|
||
loadingTable.value = false;
|
||
})
|
||
.catch(() => {
|
||
loadingTable.value = false;
|
||
});
|
||
}
|
||
//关闭弹窗
|
||
function close() {
|
||
dialogFormVisible.value = false;
|
||
}
|
||
//提交
|
||
function submit() {
|
||
if (infoLoad.value) {
|
||
elform.value.validate((valid) => {
|
||
if (valid) {
|
||
let params = JSON.parse(JSON.stringify(form.value));
|
||
params.xfbmdm = params.ssbmdm;
|
||
params.jlList = [...fjData.value, ...mjData.value];
|
||
params.znzbList = znzbData.value;
|
||
params.jyqxList = jyqxData.value;
|
||
params.clList = jyclData.value;
|
||
if (form.value.xffwlx) {
|
||
params.xffwList = xffwList.value;
|
||
}
|
||
btnLoading.value = true;
|
||
D_BZ_DJQW.value.forEach((v) => {
|
||
if (v.value == params.qwdjId) {
|
||
params.qwdj = v.label;
|
||
}
|
||
});
|
||
if (chackAdd.value) {
|
||
addXfbb(params).then((res) => {
|
||
btnLoading.value = false;
|
||
xfbb({ id: res, bbzt: 0 }).then(() => {
|
||
proxy.$message({ type: "success", message: `新增成功` });
|
||
dialogFormVisible.value = false;
|
||
getListData();
|
||
});
|
||
}).catch(() => {
|
||
btnLoading.value = false;
|
||
});
|
||
} else {
|
||
updateXfbb(params).then(() => {
|
||
btnLoading.value = false;
|
||
proxy.$message({
|
||
type: "success",
|
||
message: "修改成功"
|
||
});
|
||
dialogFormVisible.value = false;
|
||
getListData();
|
||
}).catch(() => {
|
||
btnLoading.value = false;
|
||
});;
|
||
}
|
||
}
|
||
});
|
||
} else {
|
||
// 结束报备
|
||
xfbb({ id: form.value.id, bbzt: 1 }).then(() => {
|
||
proxy.$message({
|
||
type: "success",
|
||
message: `结束报备成功`
|
||
});
|
||
dialogFormVisible.value = false;
|
||
getListData();
|
||
});
|
||
}
|
||
}
|
||
/**
|
||
* pageSize 改变触发
|
||
*/
|
||
const handleSizeChange = (currentSize) => {
|
||
listQuery.value.pageSize = currentSize;
|
||
getListData();
|
||
};
|
||
|
||
/**
|
||
* 页码改变触发
|
||
*/
|
||
const handleCurrentChange = (currentPage) => {
|
||
listQuery.value.pageCurrent = currentPage;
|
||
getListData();
|
||
};
|
||
// 表格高度计算
|
||
const tabHeightFn = () => {
|
||
tableHeight.value = window.innerHeight - searchBox.value.offsetHeight - 240;
|
||
};
|
||
onMounted(() => {
|
||
getQwbcData();
|
||
getJzData();
|
||
selectDeptPage({}).then((res) => {
|
||
depList.value = res.records;
|
||
});
|
||
getListData();
|
||
proxy.mittBus.on("mittFn", (data) => {
|
||
keyCount.value = data;
|
||
});
|
||
tabHeightFn();
|
||
window.onresize = function () {
|
||
tabHeightFn();
|
||
};
|
||
//查询出所有巡防数据
|
||
getXfqy({ pageCurrent: 1, pageSize: 1000 }).then((res) => {
|
||
xfList.xfqList = res.records.map((item) => {
|
||
return { value: item.id, label: item.xfqMc };
|
||
});
|
||
});
|
||
getKfd({ pageNum: 1, pageSize: 100, dwlxs: "01" }).then((res) => {
|
||
xfList.kfdList = res.records.map((item) => {
|
||
return { value: item.kfdId, label: item.kfdMc };
|
||
});
|
||
});
|
||
getKfd({ pageNum: 1, pageSize: 100, dwlxs: "02" }).then((res) => {
|
||
xfList.jczList = res.records.map((item) => {
|
||
return { value: item.kfdId, label: item.kfdMc };
|
||
});
|
||
});
|
||
});
|
||
onUnmounted(() => {
|
||
proxy.mittBus.off("mittFn");
|
||
});
|
||
watch(
|
||
() => jyclData.value,
|
||
(val) => {
|
||
if (val != null && val.length > 0) {
|
||
form.value.xlfs = "0";
|
||
} else {
|
||
form.value.xlfs = "1";
|
||
}
|
||
},
|
||
{ deep: true }
|
||
);
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
@import "~@/assets/css/layout.scss";
|
||
@import "~@/assets/css/element-plus.scss";
|
||
|
||
.min {
|
||
position: relative;
|
||
}
|
||
|
||
.min::after {
|
||
position: absolute;
|
||
top: 0;
|
||
right: 12px;
|
||
bottom: 0;
|
||
content: "分钟";
|
||
}
|
||
|
||
.tongji {
|
||
line-height: 28px;
|
||
color: #81c3ed;
|
||
|
||
>span {
|
||
font-size: 24px;
|
||
}
|
||
}
|
||
|
||
.echarts {
|
||
height: 160px;
|
||
color: #81c3ed;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.item {
|
||
width: 23%;
|
||
}
|
||
}
|
||
|
||
.chooce-bc {
|
||
width: 100%;
|
||
min-height: 120px;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
|
||
.chooce-bc-top {
|
||
padding: 12px;
|
||
flex: 1;
|
||
border: 1px solid #03438b;
|
||
|
||
.bc-title {
|
||
width: 100%;
|
||
height: 30px;
|
||
font-size: 14px;
|
||
color: #fff;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.colose {
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
}
|
||
|
||
.choose-bc-bottom {
|
||
padding: 12px;
|
||
flex: 1;
|
||
border: 1px solid #03438b;
|
||
|
||
.bc-title {
|
||
width: 100%;
|
||
height: 30px;
|
||
font-size: 14px;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
.chooce-bc-btn-box {
|
||
height: 120px;
|
||
overflow: hidden;
|
||
overflow-y: auto;
|
||
|
||
.chooce-bc-btn-item {
|
||
float: left;
|
||
cursor: pointer;
|
||
margin-right: 7px;
|
||
margin-bottom: 4px;
|
||
line-height: 12px;
|
||
text-align: center;
|
||
font-size: 12px;
|
||
padding: 4px;
|
||
background: orange;
|
||
border-radius: 10px;
|
||
|
||
.item {
|
||
line-height: 14px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.from_label {
|
||
width: 100%;
|
||
line-height: 2.5em;
|
||
text-indent: -68px;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.ipt {
|
||
border: 1px solid rgb(7, 85, 188);
|
||
width: 100%;
|
||
line-height: 32px;
|
||
min-height: 32px;
|
||
border-radius: 4px;
|
||
position: relative;
|
||
background: #001238;
|
||
}
|
||
|
||
.mj::after {
|
||
content: "请选择民警";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 12px;
|
||
color: #c0c4cc;
|
||
}
|
||
|
||
.fj::after {
|
||
content: "请选择辅警";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 12px;
|
||
color: #c0c4cc;
|
||
}
|
||
|
||
.cl::after {
|
||
content: "请选择车辆";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 12px;
|
||
color: #c0c4cc;
|
||
}
|
||
|
||
.znzb::after {
|
||
content: "请选择智能装备";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 12px;
|
||
color: #c0c4cc;
|
||
}
|
||
|
||
.jyqx::after {
|
||
content: "请选择常用装备";
|
||
position: absolute;
|
||
top: 0;
|
||
left: 12px;
|
||
color: #c0c4cc;
|
||
}
|
||
|
||
.tags {
|
||
padding: 4px 12px;
|
||
border-radius: 4px;
|
||
color: #fff;
|
||
border: 2px solid;
|
||
display: flex;
|
||
flex-direction: column-reverse;
|
||
align-content: center;
|
||
align-items: center;
|
||
|
||
>span {
|
||
line-height: 1em;
|
||
font-size: 12px;
|
||
}
|
||
}
|
||
|
||
.cntBox-bb {
|
||
display: flex;
|
||
height: 100%;
|
||
|
||
.tabBox {
|
||
flex: 1;
|
||
height: 100%;
|
||
}
|
||
|
||
.mapbox {
|
||
width: 1000px;
|
||
padding: 0 10px;
|
||
box-sizing: border-box;
|
||
}
|
||
}
|
||
|
||
::v-deep .el-form--inline .el-form-item {
|
||
margin-right: 8px;
|
||
}
|
||
|
||
::v-deep .el-date-editor--datetimerange.el-input__inner {
|
||
width: 356px;
|
||
}
|
||
</style>
|