lcw
This commit is contained in:
@ -430,10 +430,13 @@
|
||||
|
||||
// 警情闪速动画
|
||||
@keyframes alert-flash {
|
||||
0%, 100% {
|
||||
|
||||
0%,
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
50% {
|
||||
opacity: 0.3;
|
||||
transform: scale(1.05);
|
||||
@ -444,19 +447,25 @@
|
||||
0% {
|
||||
box-shadow: 0 0 0 0 rgba(255, 77, 79, 0.7);
|
||||
}
|
||||
|
||||
70% {
|
||||
box-shadow: 0 0 0 10px rgba(255, 77, 79, 0);
|
||||
}
|
||||
|
||||
100% {
|
||||
box-shadow: 0 0 0 0 rgba(255, 77, 79, 0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes alert-blink {
|
||||
0%, 49% {
|
||||
|
||||
0%,
|
||||
49% {
|
||||
opacity: 1;
|
||||
}
|
||||
50%, 100% {
|
||||
|
||||
50%,
|
||||
100% {
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@ -489,3 +498,9 @@
|
||||
color: #df6c07;
|
||||
animation: alert-flash 1s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.margTop {
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
background-color: #fff;
|
||||
}
|
||||
BIN
src/assets/images/jqjc.mp3
Normal file
BIN
src/assets/images/jqjc.mp3
Normal file
Binary file not shown.
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div :id="mapid" class="map"></div>
|
||||
<div class="changeMap_box" v-if="props.isShow">
|
||||
<!-- <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" /> -->
|
||||
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
|
||||
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
|
||||
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
|
||||
<el-carousel-item>
|
||||
<div class="mapImageItem">
|
||||
@ -30,8 +31,7 @@
|
||||
</el-carousel> -->
|
||||
<!-- 地图缩放 -->
|
||||
<div class="zoomTargetBox">
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
|
||||
</el-input-number>
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -44,7 +44,7 @@ import { getItem } from "@/utils/storage";
|
||||
const conditionRoute = ref(true); //路况
|
||||
const mMap = ref(null); //地图对象
|
||||
const mapUtil = ref(null); //地图工具对象
|
||||
const zoomTarget = ref(6);
|
||||
const zoomTarget = ref(15);
|
||||
|
||||
const props = defineProps({
|
||||
mapid: {
|
||||
@ -70,12 +70,11 @@ const props = defineProps({
|
||||
isShowDraw: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
|
||||
}
|
||||
});
|
||||
try {
|
||||
const userInfo = getItem("deptId")[0].deptCode;
|
||||
} catch (error) {}
|
||||
} catch (error) { }
|
||||
let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
@ -89,66 +88,37 @@ onMounted(() => {
|
||||
|
||||
map = new EliMap({
|
||||
id: props.mapid,
|
||||
crs: "EPSG:3857",
|
||||
crs: "EPSG:4490",
|
||||
style: {
|
||||
glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
center: [94.36,29.65],
|
||||
zoom: 11
|
||||
center: [94.36057012, 29.64276831],
|
||||
zoom: 15
|
||||
},
|
||||
minZoom: 7,
|
||||
minZoom: 5,
|
||||
maxZoom: 18,
|
||||
transformRequest: (url) => {
|
||||
if (url.indexOf("TileMatrix=") != -1) {
|
||||
const arr = url.split("TileMatrix=");
|
||||
const arr1 = arr[1].split("&");
|
||||
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
window.map = map;
|
||||
map.mapboxGLMap.on("load", () => {
|
||||
map.addGaudLayer({
|
||||
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
|
||||
})
|
||||
map.addWMTSLayer(
|
||||
"/PGIS_S_TileMapServer/Maps/XZDJ_DJ/EzMap"
|
||||
,
|
||||
{
|
||||
Service: "getImage",
|
||||
Type: "RGB",
|
||||
ZoomOffset: "0",
|
||||
V: "0.3",
|
||||
Zoom: "{z}",
|
||||
Row: "{y}",
|
||||
Col: "{x}"
|
||||
},
|
||||
{
|
||||
tileSize: 300
|
||||
}
|
||||
);
|
||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// 地图加载完成后发出事件
|
||||
// emit('mapLoaded')
|
||||
});
|
||||
mapUtil.value = new MapUtil(map);
|
||||
// map = new EliMap({
|
||||
// id: props.mapid,
|
||||
// crs: "EPSG:4490",
|
||||
// style: {
|
||||
// glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
// center: [94.36057012, 29.64276831],
|
||||
// zoom: 15
|
||||
// },
|
||||
// minZoom: 7,
|
||||
// maxZoom: 18,
|
||||
// });
|
||||
// window.map = map;
|
||||
// map.mapboxGLMap.on("load", () => {
|
||||
// map.addWMTSLayer(
|
||||
// "/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
|
||||
// ,
|
||||
// {
|
||||
// Service: "getImage",
|
||||
// Type: "RGB",
|
||||
// ZoomOffset: "0",
|
||||
// V: "0.3",
|
||||
// Zoom: "{z}",
|
||||
// Row: "{y}",
|
||||
// Col: "{x}"
|
||||
// },
|
||||
// {
|
||||
// tileSize: 300
|
||||
// }
|
||||
// );
|
||||
// zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// });
|
||||
// mapUtil.value = new MapUtil(map);
|
||||
|
||||
mapUtil.value.Drawplot(); //初始化加载绘制工具
|
||||
|
||||
// 设置地图中心点及图层
|
||||
@ -184,6 +154,10 @@ onMounted(() => {
|
||||
emitter.on("showSquire", (obj) => {
|
||||
mapUtil.value.zdySquire(obj);
|
||||
});
|
||||
// 展示气泡框
|
||||
emitter.on("makerPopup", (obj) => {
|
||||
mapUtil.value.makerPopup(obj);
|
||||
});
|
||||
|
||||
// 绘制图形 - 回显区域
|
||||
emitter.on("drawShape", (res) => {
|
||||
@ -289,7 +263,6 @@ const mapSetLayer = (id, source) => {
|
||||
|
||||
//获取地图绘制的数据
|
||||
const resFun = (coord, type, flag, data) => {
|
||||
|
||||
emitter.emit("coordString", {
|
||||
coord: coord,
|
||||
type: type,
|
||||
@ -303,12 +276,6 @@ const handleZoom = (val) => {
|
||||
map.mapboxGLMap.setZoom(val);
|
||||
};
|
||||
|
||||
emitter.on("map-resize", () => {
|
||||
if (map && map.mapboxGLMap) {
|
||||
map.mapboxGLMap.resize();
|
||||
}
|
||||
});
|
||||
|
||||
// 是否打开或者关闭路况
|
||||
const handleSwitch = (val) => {
|
||||
if (val) {
|
||||
@ -325,6 +292,7 @@ onUnmounted(() => {
|
||||
emitter.off("showPoint");
|
||||
emitter.off("deletePointArea");
|
||||
emitter.off("deletePointAreaOne");
|
||||
emitter.off("makerPopup");
|
||||
emitter.off("drawShape");
|
||||
emitter.off("echoPlane");
|
||||
emitter.off("removeEara");
|
||||
@ -338,7 +306,6 @@ onUnmounted(() => {
|
||||
emitter.off("diffusionCircle");
|
||||
emitter.off("SsCircle");
|
||||
emitter.off("ClearssCircle");
|
||||
emitter.off("map-resize");
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -361,29 +328,35 @@ onUnmounted(() => {
|
||||
right: 398px;
|
||||
bottom: 4px;
|
||||
z-index: 9;
|
||||
|
||||
.mapImageItem {
|
||||
border: 1px solid #08aae8;
|
||||
background: rgb(9, 26, 70);
|
||||
& > img {
|
||||
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
}
|
||||
& > div {
|
||||
|
||||
&>div {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.zoomTargetBox {
|
||||
margin-top: 10px;
|
||||
margin-left: 23px;
|
||||
}
|
||||
|
||||
::v-deep .el-input-number__decrease,
|
||||
::v-deep .el-input-number__increase {
|
||||
background: #133362;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background: #0c1641;
|
||||
}
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
<template>
|
||||
<div :id="mapid" class="map"></div>
|
||||
<div class="changeMap_box" v-if="props.isShow">
|
||||
<el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况"
|
||||
style="--el-switch-color: #13ce66; --el-switch-off-color: #ff4949" />
|
||||
<!-- <el-switch v-model="conditionRoute" @change="handleSwitch" active-text="打开路况" inactive-text="关闭路况" style="--el-switch-color:#13ce66;--el-switch-off-color:#ff4949;" /> -->
|
||||
<!-- <el-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
|
||||
<el-carousel-item>
|
||||
<div class="mapImageItem">
|
||||
@ -31,7 +30,8 @@
|
||||
</el-carousel> -->
|
||||
<!-- 地图缩放 -->
|
||||
<div class="zoomTargetBox">
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom"></el-input-number>
|
||||
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
|
||||
</el-input-number>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -44,7 +44,7 @@ import { getItem } from "@/utils/storage";
|
||||
const conditionRoute = ref(true); //路况
|
||||
const mMap = ref(null); //地图对象
|
||||
const mapUtil = ref(null); //地图工具对象
|
||||
const zoomTarget = ref(15);
|
||||
const zoomTarget = ref(6);
|
||||
|
||||
const props = defineProps({
|
||||
mapid: {
|
||||
@ -70,11 +70,12 @@ const props = defineProps({
|
||||
isShowDraw: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
try {
|
||||
const userInfo = getItem("deptId")[0].deptCode;
|
||||
} catch (error) { }
|
||||
} catch (error) {}
|
||||
let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
@ -88,37 +89,66 @@ onMounted(() => {
|
||||
|
||||
map = new EliMap({
|
||||
id: props.mapid,
|
||||
crs: "EPSG:4490",
|
||||
crs: "EPSG:3857",
|
||||
style: {
|
||||
glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
center: [94.36057012, 29.64276831],
|
||||
zoom: 15
|
||||
center: [94.36,29.65],
|
||||
zoom: 11
|
||||
},
|
||||
minZoom: 5,
|
||||
minZoom: 7,
|
||||
maxZoom: 18,
|
||||
transformRequest: (url) => {
|
||||
if (url.indexOf("TileMatrix=") != -1) {
|
||||
const arr = url.split("TileMatrix=");
|
||||
const arr1 = arr[1].split("&");
|
||||
const nurl = `${arr[0]}&TileMatrix=${Number(arr1[0])}&${arr1[1]}&${arr1[2]}`;
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
window.map = map;
|
||||
map.mapboxGLMap.on("load", () => {
|
||||
map.addWMTSLayer(
|
||||
"/PGIS_S_TileMapServer/Maps/XZDJ_DJ/EzMap"
|
||||
,
|
||||
{
|
||||
Service: "getImage",
|
||||
Type: "RGB",
|
||||
ZoomOffset: "0",
|
||||
V: "0.3",
|
||||
Zoom: "{z}",
|
||||
Row: "{y}",
|
||||
Col: "{x}"
|
||||
},
|
||||
{
|
||||
tileSize: 300
|
||||
}
|
||||
);
|
||||
map.addGaudLayer({
|
||||
url: 'http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}',
|
||||
})
|
||||
zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// 地图加载完成后发出事件
|
||||
// emit('mapLoaded')
|
||||
});
|
||||
mapUtil.value = new MapUtil(map);
|
||||
|
||||
// map = new EliMap({
|
||||
// id: props.mapid,
|
||||
// crs: "EPSG:4490",
|
||||
// style: {
|
||||
// glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||
// center: [94.36057012, 29.64276831],
|
||||
// zoom: 15
|
||||
// },
|
||||
// minZoom: 7,
|
||||
// maxZoom: 18,
|
||||
// });
|
||||
// window.map = map;
|
||||
// map.mapboxGLMap.on("load", () => {
|
||||
// map.addWMTSLayer(
|
||||
// "/PGIS_S_TileMapServer/Maps/XZDJ_SL/EzMap"
|
||||
// ,
|
||||
// {
|
||||
// Service: "getImage",
|
||||
// Type: "RGB",
|
||||
// ZoomOffset: "0",
|
||||
// V: "0.3",
|
||||
// Zoom: "{z}",
|
||||
// Row: "{y}",
|
||||
// Col: "{x}"
|
||||
// },
|
||||
// {
|
||||
// tileSize: 300
|
||||
// }
|
||||
// );
|
||||
// zoomTarget.value = map.mapboxGLMap.getZoom();
|
||||
// });
|
||||
// mapUtil.value = new MapUtil(map);
|
||||
mapUtil.value.Drawplot(); //初始化加载绘制工具
|
||||
|
||||
// 设置地图中心点及图层
|
||||
@ -154,10 +184,6 @@ onMounted(() => {
|
||||
emitter.on("showSquire", (obj) => {
|
||||
mapUtil.value.zdySquire(obj);
|
||||
});
|
||||
// 展示气泡框
|
||||
emitter.on("makerPopup", (obj) => {
|
||||
mapUtil.value.makerPopup(obj);
|
||||
});
|
||||
|
||||
// 绘制图形 - 回显区域
|
||||
emitter.on("drawShape", (res) => {
|
||||
@ -263,6 +289,7 @@ const mapSetLayer = (id, source) => {
|
||||
|
||||
//获取地图绘制的数据
|
||||
const resFun = (coord, type, flag, data) => {
|
||||
|
||||
emitter.emit("coordString", {
|
||||
coord: coord,
|
||||
type: type,
|
||||
@ -276,6 +303,12 @@ const handleZoom = (val) => {
|
||||
map.mapboxGLMap.setZoom(val);
|
||||
};
|
||||
|
||||
emitter.on("map-resize", () => {
|
||||
if (map && map.mapboxGLMap) {
|
||||
map.mapboxGLMap.resize();
|
||||
}
|
||||
});
|
||||
|
||||
// 是否打开或者关闭路况
|
||||
const handleSwitch = (val) => {
|
||||
if (val) {
|
||||
@ -292,7 +325,6 @@ onUnmounted(() => {
|
||||
emitter.off("showPoint");
|
||||
emitter.off("deletePointArea");
|
||||
emitter.off("deletePointAreaOne");
|
||||
emitter.off("makerPopup");
|
||||
emitter.off("drawShape");
|
||||
emitter.off("echoPlane");
|
||||
emitter.off("removeEara");
|
||||
@ -306,6 +338,7 @@ onUnmounted(() => {
|
||||
emitter.off("diffusionCircle");
|
||||
emitter.off("SsCircle");
|
||||
emitter.off("ClearssCircle");
|
||||
emitter.off("map-resize");
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -328,35 +361,29 @@ onUnmounted(() => {
|
||||
right: 398px;
|
||||
bottom: 4px;
|
||||
z-index: 9;
|
||||
|
||||
.mapImageItem {
|
||||
border: 1px solid #08aae8;
|
||||
background: rgb(9, 26, 70);
|
||||
|
||||
&>img {
|
||||
& > img {
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
&>div {
|
||||
& > div {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: -3px;
|
||||
}
|
||||
}
|
||||
|
||||
.zoomTargetBox {
|
||||
margin-top: 10px;
|
||||
margin-left: 23px;
|
||||
}
|
||||
|
||||
::v-deep .el-input-number__decrease,
|
||||
::v-deep .el-input-number__increase {
|
||||
background: #133362;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background: #0c1641;
|
||||
}
|
||||
553
src/components/aboutTable/Search copy.vue
Normal file
553
src/components/aboutTable/Search copy.vue
Normal file
@ -0,0 +1,553 @@
|
||||
<template>
|
||||
<div v-loading="loadingPage" class="pageSearch searchBox main-container"
|
||||
:style="`margin-bottom: ${marginBottom}px;background-color: ${backgroundColor}`">
|
||||
<div class="filter-title">
|
||||
<span class="filter-label"><el-icon>
|
||||
<Filter />
|
||||
</el-icon>筛选条件</span>
|
||||
</div>
|
||||
<div class="content-container">
|
||||
<div class="box">
|
||||
<div v-for="(item, index) in getArr" :key="index" class="item">
|
||||
<div class="label" v-if="item.label">{{ item.label }}</div>
|
||||
<!-- select -->
|
||||
<el-select v-if="item.showType === 'select'" v-model="searchObj[item.prop]" :multiple="item.multiple"
|
||||
:clearable="item.clearable" :filterable="item.filterable" :placeholder="item.placeholder" collapse-tags
|
||||
collapse-tags-tooltip>
|
||||
<el-option v-for="obj in getOptions[item.prop]" :key="obj.value" :label="obj.label || obj.lable"
|
||||
:value="obj.value" />
|
||||
</el-select>
|
||||
<!-- input -->
|
||||
<el-input v-else-if="item.showType === 'input'" class="input" v-model="searchObj[item.prop]"
|
||||
:clearable="item.clearable" :placeholder="item.placeholder" />
|
||||
<!-- input -->
|
||||
<el-input v-else-if="item.showType === 'number'" class="input" v-model="searchObj[item.prop]"
|
||||
:clearable="item.clearable" :placeholder="item.placeholder" type="number" />
|
||||
<!-- 日期段选择器 -->
|
||||
<el-date-picker v-else-if="item.showType === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
|
||||
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
|
||||
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" :disabledDate="disabledDate"
|
||||
value-format="YYYY-MM-DD" />
|
||||
<el-date-picker v-else-if="item.showType === 'datetimerange'" v-model="searchObj[item.prop]"
|
||||
type="datetimerange" unlink-panels :range-separator="item.rangeSeparator || '至'"
|
||||
:start-placeholder="item.startPlaceholder || '开始日期'" :end-placeholder="item.endPlaceholder || '结束日期'"
|
||||
:shortcuts="item.shortcuts" value-format="YYYY-MM-DD HH:mm:ss" />
|
||||
<el-date-picker v-else-if="item.showType === 'date'" v-model="searchObj[item.prop]" type="date"
|
||||
:placeholder="item.placeholder" :disabled-date="disabledDate" :shortcuts="item.shortcuts"
|
||||
value-format="YYYY-MM-DD">
|
||||
</el-date-picker>
|
||||
<el-date-picker v-else-if="item.showType === 'datetime'" v-model="searchObj[item.prop]" type="datetime"
|
||||
:placeholder="item.placeholder" value-format="YYYY-MM-DD HH:mm:ss">
|
||||
</el-date-picker>
|
||||
|
||||
<!-- checkbox -->
|
||||
<template v-else-if="item.showType === 'department'">
|
||||
<MOSTY.Department clearable v-model="searchObj[item.prop]" />
|
||||
</template>
|
||||
<!-- checkbox -->
|
||||
<template v-else-if="item.showType === 'checkbox'">
|
||||
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate"
|
||||
@change="
|
||||
(val) => {
|
||||
handleCheckAllChange(val, item);
|
||||
}
|
||||
">全选</el-checkbox>
|
||||
<el-checkbox-group v-model="searchObj[item.prop]" @change="
|
||||
(val) => {
|
||||
handleCheckedCitiesChange(val, item);
|
||||
}
|
||||
">
|
||||
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</template>
|
||||
<!-- radio -->
|
||||
<el-radio-group v-else-if="item.showType === 'radio'" v-model="searchObj[item.prop]" @change="
|
||||
(val) => {
|
||||
handleRadioChange(val, item);
|
||||
}
|
||||
">
|
||||
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
<!-- 级联选择 -->
|
||||
<el-cascader v-else-if="item.showType === 'cascader'" v-model="searchObj[item.prop]" :props="item.props"
|
||||
:show-all-levels="item.showAllLevels" :clearable="item.clearable" :options="getOptions[item.prop]"
|
||||
:placeholder="item.placeholder" />
|
||||
<div v-if="item.showType === 'Slot'">
|
||||
<slot :name="item.prop"></slot>
|
||||
</div>
|
||||
<div v-if="item.showType === 'defaultSlot'">
|
||||
<slot name="defaultSlot"></slot>
|
||||
</div>
|
||||
<div v-if="item.showType === 'nameSlot'">
|
||||
<slot name="nameSlot"></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<div class="flex">
|
||||
<el-button type="primary" @click="submit" size="small">确定</el-button>
|
||||
<el-button type="" @click="reset" size="small">重置</el-button>
|
||||
<slot> </slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
watchEffect,
|
||||
getCurrentInstance,
|
||||
watch,
|
||||
computed
|
||||
} from "vue";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const props = defineProps({
|
||||
searchArr: {
|
||||
type: Array,
|
||||
default: () => {
|
||||
return [
|
||||
{
|
||||
showType: "select",
|
||||
prop: "selectKey",
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: "选择1"
|
||||
}
|
||||
],
|
||||
defaultVal: "",
|
||||
label: "选择",
|
||||
dict: "" // 字典编码
|
||||
},
|
||||
{
|
||||
showType: "input",
|
||||
prop: "inputKey",
|
||||
defaultVal: "",
|
||||
label: "输入"
|
||||
},
|
||||
{
|
||||
showType: "department",
|
||||
prop: "deptKey",
|
||||
defaultVal: "",
|
||||
label: "输入"
|
||||
},
|
||||
{
|
||||
showType: "daterange",
|
||||
prop: "daterangeKey",
|
||||
defaultVal: "",
|
||||
label: "输入"
|
||||
},
|
||||
{
|
||||
showType: "date",
|
||||
prop: "date",
|
||||
defaultVal: ""
|
||||
},
|
||||
{
|
||||
showType: "checkbox",
|
||||
prop: "checkboxKey1",
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: "选择1"
|
||||
}
|
||||
],
|
||||
defaultVal: ""
|
||||
},
|
||||
{
|
||||
showType: "cascader",
|
||||
prop: "cascaderKey",
|
||||
label: "级联选择",
|
||||
checkStrictly: false, //点击任意选中
|
||||
defaultVal: ""
|
||||
},
|
||||
{
|
||||
showType: "radio",
|
||||
defaultVal: ""
|
||||
},
|
||||
{
|
||||
showType: "defaultTime",
|
||||
prop: "timeField",
|
||||
options: []
|
||||
}
|
||||
];
|
||||
}
|
||||
},
|
||||
marginBottom: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
backgroundColor: {
|
||||
type: String,
|
||||
default: "rgb(255, 255, 255, 1)"
|
||||
},
|
||||
bool: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
});
|
||||
let loadingPage = ref(false);
|
||||
const emit = defineEmits(["submit", "reset"]);
|
||||
let searchObj = reactive({});
|
||||
|
||||
// select 的一些默认配置
|
||||
const selectDefault = {
|
||||
clearable: true, // 是否可以清空
|
||||
filterable: true, // 是否可以筛选
|
||||
multiple: false, // 是否多选
|
||||
placeholder: "请选择"
|
||||
};
|
||||
// 重新定义下拉框的选项
|
||||
let getOptions = reactive({});
|
||||
// input 的一些默认配置
|
||||
const inputDefault = {
|
||||
clearable: true, // 是否可以清空
|
||||
placeholder: "请输入"
|
||||
};
|
||||
const shortcuts = [
|
||||
{
|
||||
text: "今天",
|
||||
value: () => {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 0);
|
||||
return [start, end];
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "昨天",
|
||||
value: () => {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 1);
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24 * 1);
|
||||
return [start, end];
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "最近7天",
|
||||
value: () => {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
||||
return [start, end];
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "最近30天",
|
||||
value: () => {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
||||
return [start, end];
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "最近90天",
|
||||
value: () => {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
||||
return [start, end];
|
||||
}
|
||||
}
|
||||
];
|
||||
// daterange 的一些默认配置
|
||||
const daterangeDefault = {
|
||||
rangeSeparator: "至",
|
||||
startPlaceholder: "开始日期",
|
||||
endPlaceholder: "结束日期",
|
||||
shortcuts: [], // 快捷选择
|
||||
defaultShortcuts: true // 是否显示快捷选择 如果要自定义快捷选择传入一个shortcuts就可以了
|
||||
};
|
||||
// date 的一些默认配置
|
||||
const defaultDate = {
|
||||
clearable: true, // 是否可以清空
|
||||
placeholder: "请输入",
|
||||
shortcuts: [], // 快捷选择
|
||||
defaultShortcuts: true // 是否显示快捷选择 如果要自定义快捷选择传入一个shortcuts就可以了
|
||||
};
|
||||
const dateShortcuts = [
|
||||
{
|
||||
text: "今天",
|
||||
value: new Date()
|
||||
},
|
||||
{
|
||||
text: "昨天",
|
||||
value: () => {
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24);
|
||||
return date;
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "7天前",
|
||||
value: () => {
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
|
||||
return date;
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "30天前",
|
||||
value: () => {
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 30);
|
||||
return date;
|
||||
}
|
||||
},
|
||||
{
|
||||
text: "90天前",
|
||||
value: () => {
|
||||
const date = new Date();
|
||||
date.setTime(date.getTime() - 3600 * 1000 * 24 * 90);
|
||||
return date;
|
||||
}
|
||||
}
|
||||
];
|
||||
// 设置不可选的日期
|
||||
const disabledDate = (time) => {
|
||||
return time.getTime() > Date.now();
|
||||
};
|
||||
// checkbox 的一些默认配置
|
||||
const defaultCheckbox = reactive({
|
||||
defaultVal: [],
|
||||
checkAll: false, // 全选的值
|
||||
isIndeterminate: false, // 控制全选按钮样式
|
||||
showSelectAll: true // 是否显示全选
|
||||
});
|
||||
// 全选复选框的选中与不选中
|
||||
const handleCheckAllChange = (val, obj) => {
|
||||
searchObj[obj.prop] = val ? obj.checkboxValueArr : [];
|
||||
obj.isIndeterminate = false;
|
||||
};
|
||||
// 单个复选框的选中与不选中
|
||||
const handleCheckedCitiesChange = (value, obj) => {
|
||||
const checkedCount = value.length;
|
||||
obj.checkAll = checkedCount === obj.checkboxValueArr.length;
|
||||
obj.isIndeterminate =
|
||||
checkedCount > 0 && checkedCount < obj.checkboxValueArr.length;
|
||||
};
|
||||
//单选
|
||||
const handleRadioChange = (val, obj) => {
|
||||
console.log(val, obj);
|
||||
};
|
||||
// cascader 的一些默认配置
|
||||
let defaultCascader = {
|
||||
filterable: true, // 是否可以搜索
|
||||
clearable: true, // 是否可以清空
|
||||
placeholder: "请选择",
|
||||
checkStrictly: true, // 控制是否父子联动（是否可以选择任意节点）
|
||||
showAllLevels: false, // 是否显示完整路径
|
||||
lazy: false, // 是否懒加载 当设置为false时就要传入options
|
||||
portUrl: "", // 这里必须写 接口地址
|
||||
props: {
|
||||
label: "label",
|
||||
value: "value",
|
||||
children: "children"
|
||||
},
|
||||
options: []
|
||||
};
|
||||
// 在懒加载状态下cascader 的props的一些配置
|
||||
const cascaderLazyProps = reactive({
|
||||
value: "value",
|
||||
label: "label",
|
||||
lazy: false,
|
||||
lazyLoad(node, resolve) {
|
||||
// 这里要根据实际情况修改
|
||||
const { level } = node;
|
||||
let options = [];
|
||||
switch (level) {
|
||||
case 0:
|
||||
options = [
|
||||
{
|
||||
value: 1,
|
||||
label: "选择1",
|
||||
leaf: false // 表示有下一级 必须有这个表示 不然获取不到值
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: "选择2",
|
||||
leaf: false // 表示有下一级
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
label: "选择3",
|
||||
leaf: false // 表示有下一级
|
||||
},
|
||||
{
|
||||
value: 4,
|
||||
label: "选择4",
|
||||
leaf: true // 表示没有下一级了
|
||||
}
|
||||
];
|
||||
break;
|
||||
case 1:
|
||||
options = [
|
||||
{
|
||||
value: 11,
|
||||
label: "选择1_1",
|
||||
leaf: true // 表示没有下一级了
|
||||
},
|
||||
{
|
||||
value: 21,
|
||||
label: "选择2_1",
|
||||
leaf: true // 表示没有下一级了
|
||||
},
|
||||
{
|
||||
value: 31,
|
||||
label: "选择3_1",
|
||||
leaf: true // 表示没有下一级了
|
||||
},
|
||||
{
|
||||
value: 41,
|
||||
label: "选择4_1",
|
||||
leaf: true // 表示没有下一级了
|
||||
}
|
||||
];
|
||||
}
|
||||
resolve(options);
|
||||
}
|
||||
});
|
||||
// 获取到传过来的参数
|
||||
let getArr = reactive([]);
|
||||
const submit = () => {
|
||||
emit("submit", searchObj);
|
||||
};
|
||||
const reset = () => {
|
||||
getArr.forEach((item) => {
|
||||
searchObj[item.prop] = item.defaultVal;
|
||||
});
|
||||
emit("reset", true);
|
||||
emit("submit", searchObj);
|
||||
};
|
||||
|
||||
// 暴露searchObj给父组件
|
||||
defineExpose({
|
||||
searchObj,
|
||||
submit,
|
||||
reset
|
||||
});
|
||||
watchEffect(() => {
|
||||
loadingPage.value = true;
|
||||
let arr = JSON.parse(JSON.stringify(props.searchArr));
|
||||
getArr = arr.map((item) => {
|
||||
switch (item.showType) {
|
||||
case "select":
|
||||
item = { ...selectDefault, ...item };
|
||||
item.options = reactive(item.options);
|
||||
getOptions[item.prop] = item.options;
|
||||
break;
|
||||
case "input":
|
||||
item = { ...inputDefault, ...item };
|
||||
break;
|
||||
case "daterange":
|
||||
item = { ...daterangeDefault, ...item };
|
||||
if (item.defaultShortcuts) item.shortcuts = shortcuts;
|
||||
break;
|
||||
case "date":
|
||||
item = { ...defaultDate, ...item };
|
||||
if (item.defaultShortcuts) {
|
||||
item.shortcuts = dateShortcuts;
|
||||
}
|
||||
break;
|
||||
case "checkbox":
|
||||
item = reactive({ ...defaultCheckbox, ...item });
|
||||
item.checkboxValueArr = item.options.map((obj) => {
|
||||
return obj.value;
|
||||
});
|
||||
break;
|
||||
case "cascader":
|
||||
item = { ...defaultCascader, ...item };
|
||||
if (item.lazy) {
|
||||
cascaderLazyProps.checkStrictly = item.checkStrictly;
|
||||
item.props = { ...cascaderLazyProps, ...(item.props || {}) };
|
||||
delete item.options;
|
||||
} else {
|
||||
item.props = {
|
||||
...defaultCascader.props,
|
||||
...(item.props || {}),
|
||||
...{ checkStrictly: item.checkStrictly }
|
||||
};
|
||||
getOptions[item.prop] = reactive(item.options);
|
||||
}
|
||||
break;
|
||||
}
|
||||
loadingPage.value = false;
|
||||
searchObj[item.prop] = item.defaultVal;
|
||||
return item;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageSearch {
|
||||
.main-container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
display: flex;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
background: linear-gradient(to right, #9ed7ff, #e6f0f8);
|
||||
padding: 5px 15px;
|
||||
|
||||
.filter-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
margin-right: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-line {
|
||||
flex: 1;
|
||||
height: 1px;
|
||||
background-color: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
flex: 1;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
margin-right: 12px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.label {
|
||||
margin: auto;
|
||||
margin-right: 5px;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-date-editor .el-range-separator {
|
||||
color: #333;
|
||||
}
|
||||
</style>
|
||||
@ -1,77 +1,74 @@
|
||||
<template>
|
||||
<div v-loading="loadingPage" class="pageSearch searchBox main-container"
|
||||
:style="`margin-bottom: ${marginBottom}px;background-color: ${backgroundColor}`">
|
||||
<div class="filter-title">
|
||||
<span class="filter-label"><el-icon>
|
||||
<Filter />
|
||||
</el-icon>筛选条件</span>
|
||||
</div>
|
||||
<div class="content-container">
|
||||
<div class="box">
|
||||
<div v-for="(item, index) in getArr" :key="index" class="item">
|
||||
<div class="label" v-if="item.label">{{ item.label }}</div>
|
||||
<div v-loading="loadingPage" class="query-wrap">
|
||||
<div class="query-title">查询条件</div>
|
||||
<div class="query-grid">
|
||||
<div v-for="(item, index) in getArr" :key="index" class="query-cell">
|
||||
<div class="cell-label">{{ item.label }}</div>
|
||||
<div class="cell-control">
|
||||
<!-- select -->
|
||||
<el-select v-if="item.showType === 'select'" v-model="searchObj[item.prop]" :multiple="item.multiple"
|
||||
:clearable="item.clearable" :filterable="item.filterable" :placeholder="item.placeholder" collapse-tags
|
||||
collapse-tags-tooltip>
|
||||
collapse-tags-tooltip class="control-select">
|
||||
<el-option v-for="obj in getOptions[item.prop]" :key="obj.value" :label="obj.label || obj.lable"
|
||||
:value="obj.value" />
|
||||
</el-select>
|
||||
<!-- input -->
|
||||
<el-input v-else-if="item.showType === 'input'" class="input" v-model="searchObj[item.prop]"
|
||||
:clearable="item.clearable" :placeholder="item.placeholder" />
|
||||
<!-- input -->
|
||||
<el-input v-else-if="item.showType === 'number'" class="input" v-model="searchObj[item.prop]"
|
||||
<el-input v-else-if="item.showType === 'input'" class="control-input" v-model="searchObj[item.prop]"
|
||||
:clearable="item.clearable" :placeholder="item.placeholder" />
|
||||
<!-- input -->
|
||||
<el-input v-else-if="item.showType === 'number'" class="control-input" v-model="searchObj[item.prop]"
|
||||
:clearable="item.clearable" :placeholder="item.placeholder" type="number" />
|
||||
<!-- 日期段选择器 -->
|
||||
<el-date-picker v-else-if="item.showType === 'daterange'" v-model="searchObj[item.prop]" type="daterange"
|
||||
unlink-panels :range-separator="item.rangeSeparator" :start-placeholder="item.startPlaceholder"
|
||||
:end-placeholder="item.endPlaceholder" :shortcuts="item.shortcuts" :disabledDate="disabledDate"
|
||||
value-format="YYYY-MM-DD" />
|
||||
value-format="YYYY-MM-DD" class="control-date" />
|
||||
<el-date-picker v-else-if="item.showType === 'datetimerange'" v-model="searchObj[item.prop]"
|
||||
type="datetimerange" unlink-panels :range-separator="item.rangeSeparator || '至'"
|
||||
:start-placeholder="item.startPlaceholder || '开始日期'" :end-placeholder="item.endPlaceholder || '结束日期'"
|
||||
:shortcuts="item.shortcuts" value-format="YYYY-MM-DD HH:mm:ss" />
|
||||
:shortcuts="item.shortcuts" value-format="YYYY-MM-DD HH:mm:ss" class="control-date" />
|
||||
<el-date-picker v-else-if="item.showType === 'date'" v-model="searchObj[item.prop]" type="date"
|
||||
:placeholder="item.placeholder" :disabled-date="disabledDate" :shortcuts="item.shortcuts"
|
||||
value-format="YYYY-MM-DD">
|
||||
value-format="YYYY-MM-DD" class="control-date">
|
||||
</el-date-picker>
|
||||
<el-date-picker v-else-if="item.showType === 'datetime'" v-model="searchObj[item.prop]" type="datetime"
|
||||
:placeholder="item.placeholder" value-format="YYYY-MM-DD HH:mm:ss">
|
||||
:placeholder="item.placeholder" value-format="YYYY-MM-DD HH:mm:ss" class="control-date">
|
||||
</el-date-picker>
|
||||
|
||||
<!-- checkbox -->
|
||||
<template v-else-if="item.showType === 'department'">
|
||||
<MOSTY.Department clearable v-model="searchObj[item.prop]" />
|
||||
<MOSTY.Department clearable v-model="searchObj[item.prop]" class="control-select" />
|
||||
</template>
|
||||
<!-- checkbox -->
|
||||
<template v-else-if="item.showType === 'checkbox'">
|
||||
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate"
|
||||
@change="
|
||||
<div class="checkbox-wrap">
|
||||
<el-checkbox v-if="item.showSelectAll" v-model="item.checkAll" :indeterminate="item.isIndeterminate"
|
||||
@change="
|
||||
(val) => {
|
||||
handleCheckAllChange(val, item);
|
||||
}
|
||||
">全选</el-checkbox>
|
||||
<el-checkbox-group v-model="searchObj[item.prop]" @change="
|
||||
(val) => {
|
||||
handleCheckAllChange(val, item);
|
||||
handleCheckedCitiesChange(val, item);
|
||||
}
|
||||
">全选</el-checkbox>
|
||||
<el-checkbox-group v-model="searchObj[item.prop]" @change="
|
||||
(val) => {
|
||||
handleCheckedCitiesChange(val, item);
|
||||
}
|
||||
">
|
||||
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
" class="checkbox-group">
|
||||
<el-checkbox v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
</template>
|
||||
<!-- radio -->
|
||||
<el-radio-group v-else-if="item.showType === 'radio'" v-model="searchObj[item.prop]" @change="
|
||||
(val) => {
|
||||
handleRadioChange(val, item);
|
||||
}
|
||||
">
|
||||
" class="radio-group">
|
||||
<el-radio v-for="obj in item.options" :key="obj.value" :label="obj.value">{{ obj.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
<!-- 级联选择 -->
|
||||
<el-cascader v-else-if="item.showType === 'cascader'" v-model="searchObj[item.prop]" :props="item.props"
|
||||
:show-all-levels="item.showAllLevels" :clearable="item.clearable" :options="getOptions[item.prop]"
|
||||
:placeholder="item.placeholder" />
|
||||
:placeholder="item.placeholder" class="control-select" />
|
||||
<div v-if="item.showType === 'Slot'">
|
||||
<slot :name="item.prop"></slot>
|
||||
</div>
|
||||
@ -82,16 +79,16 @@
|
||||
<slot name="nameSlot"></slot>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<div class="flex">
|
||||
<el-button type="primary" @click="submit" size="small">确定</el-button>
|
||||
<el-button type="" @click="reset" size="small">重置</el-button>
|
||||
<slot> </slot>
|
||||
</div>
|
||||
</div>
|
||||
<div class="query-action">
|
||||
<div>
|
||||
<slot> </slot>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="primary" @click="submit" size="small">查询</el-button>
|
||||
<el-button type="default" @click="reset" size="small">重置</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -485,69 +482,169 @@ watchEffect(() => {
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pageSearch {
|
||||
.main-container {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.content-container {
|
||||
display: flex;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.filter-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
width: 100%;
|
||||
background: linear-gradient(to right, #9ed7ff, #e6f0f8);
|
||||
padding: 5px 15px;
|
||||
|
||||
.filter-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: bold;
|
||||
color: #000;
|
||||
margin-right: 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.filter-line {
|
||||
flex: 1;
|
||||
height: 1px;
|
||||
background-color: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
flex: 1;
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
margin-right: 12px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.label {
|
||||
margin: auto;
|
||||
margin-right: 5px;
|
||||
white-space: nowrap;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
<style scoped lang="scss">
|
||||
.query-wrap {
|
||||
border: 1px solid #b8d3ff;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-date-editor .el-range-separator {
|
||||
color: #333;
|
||||
.query-title {
|
||||
height: 32px;
|
||||
background: linear-gradient(to right, #9ed7ff, #e6f0f8);
|
||||
line-height: 32px;
|
||||
padding-left: 10px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #0d2148;
|
||||
border-bottom: 1px solid #b8d3ff;
|
||||
}
|
||||
|
||||
.query-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.query-cell {
|
||||
display: flex;
|
||||
min-height: 40px;
|
||||
border-right: 1px solid #b8d3ff;
|
||||
border-bottom: 1px solid #b8d3ff;
|
||||
}
|
||||
|
||||
.query-cell:nth-child(4n) {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
.cell-label {
|
||||
width: 130px;
|
||||
flex-shrink: 0;
|
||||
border-right: 1px solid #b8d3ff;
|
||||
font-size: 14px;
|
||||
color: #0d2148;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.cell-control {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
padding: 4px 8px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cell-control.is-checkbox {
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.control-input,
|
||||
.control-select,
|
||||
.control-date {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.control-input .el-input__wrapper),
|
||||
:deep(.control-select .el-select__wrapper),
|
||||
:deep(.control-date .el-input__wrapper) {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
min-height: 28px;
|
||||
border-radius: 0;
|
||||
box-shadow: 0 0 0 1px #b8d3ff inset;
|
||||
}
|
||||
|
||||
:deep(.control-date.el-date-editor) {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.control-date.el-date-editor .el-range-input) {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
:deep(.control-input .el-input__inner),
|
||||
:deep(.control-select .el-select__placeholder),
|
||||
:deep(.control-date .el-input__inner) {
|
||||
font-size: 14px;
|
||||
color: #0d2148;
|
||||
}
|
||||
|
||||
:deep(.control-date .el-range-input) {
|
||||
font-size: 14px;
|
||||
color: #0d2148;
|
||||
}
|
||||
|
||||
:deep(.control-date .el-range__icon),
|
||||
:deep(.control-date .el-range__close-icon) {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.checkbox-wrap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.checkbox-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.radio-group {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
:deep(.checkbox-wrap .el-checkbox) {
|
||||
margin-right: 0;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.checkbox-wrap .el-checkbox__inner) {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
.query-action {
|
||||
height: 36px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 8px;
|
||||
}
|
||||
|
||||
:deep(.el-button--primary) {
|
||||
background-color: #0f5bbd;
|
||||
border-color: #0f5bbd;
|
||||
}
|
||||
|
||||
:deep(.el-button--primary:hover) {
|
||||
background-color: #1a73e8;
|
||||
border-color: #1a73e8;
|
||||
}
|
||||
|
||||
:deep(.el-button--default) {
|
||||
background-color: #ffffff;
|
||||
border-color: #dcdfe6;
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
:deep(.el-button--default:hover) {
|
||||
color: #409eff;
|
||||
border-color: #c6e2ff;
|
||||
background-color: #ecf5ff;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,6 +26,7 @@ const checkAll = ref(false);
|
||||
const isIndeterminate = ref(true);
|
||||
const hasChecked = ref([]); //已经全选的数据
|
||||
const checkedList = ref([]);
|
||||
const isInit = ref(true); // 标记是否为初始化
|
||||
watch(
|
||||
() => props.data,
|
||||
(val) => {
|
||||
@ -38,16 +39,28 @@ watch(
|
||||
immediate: true
|
||||
}
|
||||
);
|
||||
// 监听hasChecked变化，初始化完成后才触发changeData
|
||||
watch(
|
||||
hasChecked,
|
||||
(val) => {
|
||||
if (isInit.value) {
|
||||
isInit.value = false;
|
||||
return;
|
||||
}
|
||||
emits("changeData", val);
|
||||
},
|
||||
{ deep: true }
|
||||
);
|
||||
// 全选
|
||||
function handleCheckAll(val) {
|
||||
hasChecked.value = val ? checkedList.value : [];
|
||||
isIndeterminate.value = false;
|
||||
emits("changeData", hasChecked.value);
|
||||
// emits 由 watch 处理
|
||||
}
|
||||
// 处理多选框改变
|
||||
function handleCheckedChange(val) {
|
||||
handleChange(val);////判断是否全选
|
||||
emits("changeData", hasChecked.value);
|
||||
// emits 由 watch 处理
|
||||
}
|
||||
//判断是否全选
|
||||
function handleChange(val) {
|
||||
|
||||
@ -23,7 +23,7 @@ import emitter from "@/utils/eventBus.js"; // 导入事件总线
|
||||
import { qcckGet } from '@/api/qcckApi'
|
||||
import Item from './item.vue'
|
||||
import { AudioPlayerClass } from '@/utils/audioPlayer.js'
|
||||
import {getItem} from '@/utils/storage.js'
|
||||
import { getItem } from '@/utils/storage.js'
|
||||
const dataList = ref([])
|
||||
const timekeeping = ref(null)
|
||||
const countdown = ref(0) // 倒计时时间（秒）
|
||||
@ -33,7 +33,8 @@ const audioPlayers = ref({
|
||||
'02': null, // 信息上报
|
||||
'03': null, // 研判审批
|
||||
'04': null, // 研判指令
|
||||
'05': null // 线索下发
|
||||
'05': null, // 线索下发,
|
||||
'06': null, // 警情监测
|
||||
})
|
||||
|
||||
// 音频文件路径映射
|
||||
@ -41,7 +42,8 @@ const audioPaths = {
|
||||
'02': require('@/assets/images/cjyp.mp3'),
|
||||
'03': require('@/assets/images/ypbg.mp3'),
|
||||
'04': require('@/assets/images/ypzl.mp3'),
|
||||
'05': require('@/assets/images/xsyp.mp3')
|
||||
'05': require('@/assets/images/xsyp.mp3'),
|
||||
'06': require('@/assets/images/jqjc.mp3')
|
||||
}
|
||||
|
||||
// 初始化音频播放器
|
||||
@ -119,14 +121,14 @@ const dataModel = () => {
|
||||
if (yjmasg.length > 0) {
|
||||
emitter.emit('openYp', yjmasg[0].obj); // 触发音频播放
|
||||
} else {
|
||||
const data=res.filter(item=>item.sfzList.includes(idEntityCard.value))
|
||||
const infoMasge =data.map(item => {
|
||||
const data = res.filter(item => item.sfzList.includes(idEntityCard.value))
|
||||
const infoMasge = data.map(item => {
|
||||
return {
|
||||
...item.obj,
|
||||
typeMasgeLx: item.type
|
||||
}
|
||||
})
|
||||
console.log(infoMasge);
|
||||
console.log(infoMasge,"xxxxxxxxxxxx");
|
||||
emitter.emit('webSocketMessage', infoMasge)
|
||||
}
|
||||
}
|
||||
|
||||
@ -31,6 +31,14 @@
|
||||
<div class="item-message" v-html="item.zlnr"></div>
|
||||
<div class="item-time">{{ item.xtCjsj || '' }}</div>
|
||||
</div>
|
||||
<div class="test-item" v-if="item.typeMasgeLx == '06'" @click="goDetail(item.id, item.typeMasgeLx)">
|
||||
<div class="item-header">
|
||||
<div class="item-title">{{ item.gxdwmc || '' }}</div>
|
||||
<div class="item-type">{{ informationMap[item.typeMasgeLx] }}</div>
|
||||
</div>
|
||||
<div class="item-message" >{{ item.bcjjnr }}</div>
|
||||
<div class="item-time">{{ item.bjsj || '' }}</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
||||
@ -65,6 +73,9 @@ const goDetail = (id, lx) => {
|
||||
break;
|
||||
case '05':
|
||||
path = '/InstructionInformation'
|
||||
break;
|
||||
case '06':
|
||||
path = '/policeReport'
|
||||
break;
|
||||
}
|
||||
router.push({
|
||||
|
||||
83
src/layout/components/SideBar/SideBarMenu copy 2.vue
Normal file
83
src/layout/components/SideBar/SideBarMenu copy 2.vue
Normal file
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<el-menu class="el-menu-vertical-demo" :collapse="!$store.getters.sidebarOpened" :default-active="activeMenu"
|
||||
:unique-opened="true" background-color="rgba(0, 0, 0, 0)" :text-color="$store.getters.cssVar.menuText"
|
||||
:active-text-color="$store.getters.cssVar.menuActiveText" router>
|
||||
<SideBarItem v-for="item in routes" :key="item.path" :route="item"></SideBarItem>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useStore } from "vuex";
|
||||
import { filterRoutes, generateMenus } from "@/utils/route";
|
||||
import { getItem } from "@/utils/storage";
|
||||
import SideBarItem from "./SideBarItem.vue";
|
||||
const store = useStore();
|
||||
const router = useRouter();
|
||||
const EXCLUDE_NAMES = ["warningLists", "behaviorWarnings", "identityWarnings", "combinedWarnings", "DeploymentAreas", "mpvPeos", "myControls"];
|
||||
const filterRoutesByMenusPermission = (routes, menusSet) => {
|
||||
return routes.reduce((result, route) => {
|
||||
const children = Array.isArray(route.children) ? filterRoutesByMenusPermission(route.children, menusSet) : [];
|
||||
const routeName = route.name ? `${route.name}` : "";
|
||||
const selfMatched = routeName && menusSet.has(routeName);
|
||||
if (selfMatched || children.length > 0) {
|
||||
result.push({ ...route, children });
|
||||
}
|
||||
return result;
|
||||
}, []);
|
||||
};
|
||||
const routes = computed(() => {
|
||||
const fRoutes = filterRoutes(router.getRoutes());
|
||||
const data = fRoutes.filter((item) => !EXCLUDE_NAMES.includes(item.name));
|
||||
const menusPermission = getItem("menusPermission");
|
||||
const menusSet = new Set(Array.isArray(menusPermission) ? menusPermission.map((item) => `${item}`) : []);
|
||||
const permissionFiltered = menusSet.size ? filterRoutesByMenusPermission(data, menusSet) : data;
|
||||
return generateMenus(permissionFiltered);
|
||||
});
|
||||
if (!store.getters.token) {
|
||||
router.push("/login");
|
||||
}
|
||||
if (router.getRoutes().length <= 7 && store.state.permission.routeReady <= 1) {
|
||||
store.commit("user/setIsReady", {});
|
||||
setTimeout(() => {
|
||||
router.go(0);
|
||||
}, 200);
|
||||
}
|
||||
//默认激活项
|
||||
const route = useRoute();
|
||||
const activeMenu = computed(() => {
|
||||
const { path } = route;
|
||||
return path;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-menu-item {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
::v-deep .el-sub-menu__title {
|
||||
height: 48px;
|
||||
color: rgb(255, 255, 255);
|
||||
background-color: rgb(20, 46, 78);
|
||||
}
|
||||
|
||||
::v-deep .el-menu-item.is-active {
|
||||
background-image: linear-gradient(to right, #2356d4 0%, #8efbde 100%);
|
||||
margin: 0 14px;
|
||||
border-radius: 4px;
|
||||
// padding-left: 46px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-sub-menu .el-menu-item {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.el-menu-vertical-demo:not(.el-menu--collapse) {
|
||||
width: 240px;
|
||||
min-height: 400px;
|
||||
}
|
||||
</style>
|
||||
81
src/layout/components/SideBar/SideBarMenu copy.vue
Normal file
81
src/layout/components/SideBar/SideBarMenu copy.vue
Normal file
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<el-menu class="el-menu-vertical-demo" :collapse="!$store.getters.sidebarOpened" :default-active="activeMenu"
|
||||
:unique-opened="true" background-color="rgba(0, 0, 0, 0)" :text-color="$store.getters.cssVar.menuText"
|
||||
:active-text-color="$store.getters.cssVar.menuActiveText" router>
|
||||
<SideBarItem v-for="item in routes" :key="item.path" :route="item"></SideBarItem>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useStore } from "vuex";
|
||||
import { filterRoutes, generateMenus } from "@/utils/route";
|
||||
import SideBarItem from "./SideBarItem.vue";
|
||||
const store = useStore();
|
||||
const router = useRouter();
|
||||
const routes = computed(() => {
|
||||
const fRoutes = filterRoutes(router.getRoutes());
|
||||
|
||||
const data = fRoutes.filter(item => {
|
||||
if (item.name != "warningLists"
|
||||
&& item.name != "behaviorWarnings"
|
||||
&& item.name != "identityWarnings"
|
||||
&& item.name != "combinedWarnings"
|
||||
&& item.name != "DeploymentAreas"
|
||||
&& item.name != "mpvPeos"
|
||||
&& item.name != "myControls") {
|
||||
return item;
|
||||
}
|
||||
}
|
||||
)
|
||||
console.log(data);
|
||||
|
||||
return generateMenus(data);
|
||||
});
|
||||
if (!store.getters.token) {
|
||||
router.push("/login");
|
||||
}
|
||||
if (router.getRoutes().length <= 7 && store.state.permission.routeReady <= 1) {
|
||||
store.commit("user/setIsReady", {});
|
||||
setTimeout(() => {
|
||||
router.go(0);
|
||||
}, 200);
|
||||
}
|
||||
//默认激活项
|
||||
const route = useRoute();
|
||||
const activeMenu = computed(() => {
|
||||
const { path } = route;
|
||||
return path;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .el-menu-item {
|
||||
height: 48px;
|
||||
}
|
||||
|
||||
::v-deep .el-sub-menu__title {
|
||||
height: 48px;
|
||||
color: rgb(255, 255, 255);
|
||||
background-color: rgb(20, 46, 78);
|
||||
}
|
||||
|
||||
::v-deep .el-menu-item.is-active {
|
||||
background-image: linear-gradient(to right, #2356d4 0%, #8efbde 100%);
|
||||
margin: 0 14px;
|
||||
border-radius: 4px;
|
||||
// padding-left: 46px !important;
|
||||
}
|
||||
|
||||
::v-deep .el-sub-menu .el-menu-item {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
}
|
||||
</style>
|
||||
<style>
|
||||
.el-menu-vertical-demo:not(.el-menu--collapse) {
|
||||
width: 240px;
|
||||
min-height: 400px;
|
||||
}
|
||||
</style>
|
||||
@ -16,6 +16,7 @@ const store = useStore();
|
||||
const router = useRouter();
|
||||
const routes = computed(() => {
|
||||
const fRoutes = filterRoutes(router.getRoutes());
|
||||
|
||||
const data = fRoutes.filter(item => {
|
||||
if (item.name != "warningLists"
|
||||
&& item.name != "behaviorWarnings"
|
||||
@ -28,6 +29,8 @@ const routes = computed(() => {
|
||||
}
|
||||
}
|
||||
)
|
||||
console.log(data);
|
||||
|
||||
return generateMenus(data);
|
||||
});
|
||||
if (!store.getters.token) {
|
||||
|
||||
@ -172,6 +172,30 @@ export const publicRoutes = [
|
||||
meta: { title: "预警列表", icon: "article-create" },
|
||||
component: () => import("@/views/backOfficeSystem/fourColorManage/YjData/index.vue"),
|
||||
},
|
||||
{
|
||||
path: "/jqjc",
|
||||
name: "jqjc",
|
||||
meta: { title: "警情监测", icon: "article-create" },
|
||||
children: [
|
||||
{
|
||||
path: "/policeReport",
|
||||
name: "policeReport",
|
||||
component: () => import("@/views/backOfficeSystem/policeReport/index.vue"),
|
||||
meta: {
|
||||
title: "警情信息",
|
||||
icon: "article-create"
|
||||
}
|
||||
}, {
|
||||
path: "/policeSituations",
|
||||
name: "policeSituations",
|
||||
component: () => import("@/views/backOfficeSystem/PoliceIncidentMonitoring/index.vue"),
|
||||
meta: {
|
||||
title: "警情预警监测",
|
||||
icon: "article-create"
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
// {
|
||||
// path: "/fouColorWarning",
|
||||
// name: "fouColorWarning",
|
||||
@ -480,15 +504,7 @@ export const publicRoutes = [
|
||||
icon: "article-ranking"
|
||||
},
|
||||
children: [
|
||||
{
|
||||
path: "/policeReport",
|
||||
name: "policeReport",
|
||||
component: () => import("@/views/backOfficeSystem/policeReport/index.vue"),
|
||||
meta: {
|
||||
title: "警情管理",
|
||||
icon: "article-create"
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
path: "/policeManagement",
|
||||
name: "policeManagement",
|
||||
@ -1266,8 +1282,6 @@ const router = createRouter({
|
||||
//初始化路由表
|
||||
export function resetRouter() {
|
||||
if (store.getters?.routeReady && store.getters?.userInfo?.permission?.menus) {
|
||||
|
||||
|
||||
const menus = store.getters.userInfo.permission.menus;
|
||||
menus.forEach((menu) => {
|
||||
router.removeRoute(menu);
|
||||
|
||||
@ -84,7 +84,6 @@ export default {
|
||||
*/
|
||||
login(ctx, userInfo) {
|
||||
const { userName, password, kaptcha } = userInfo;
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
login({ userName, password: Base64.encode(password), kaptcha }).then((data) => {
|
||||
if (data.deptList.length === 1) {
|
||||
|
||||
@ -4,13 +4,8 @@
|
||||
<div ref="searchBox">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="addEdit('add')">新增</el-button>
|
||||
</template>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
|
||||
@ -2,16 +2,13 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="addEdit('add')">新增</el-button>
|
||||
<!-- <el-button type="danger" size="small" @click="handleRow()">批量删除</el-button> -->
|
||||
</template>
|
||||
</PageTitle>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="addEdit('add')">新增</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -273,7 +270,7 @@ const deleteRow = (id) =>{
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 240;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,17 +2,12 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="addEdit('add')">新增</el-button>
|
||||
<!-- <el-button type="danger" size="small" @click="handleRow()">批量删除</el-button> -->
|
||||
</template>
|
||||
</PageTitle>
|
||||
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -149,7 +144,7 @@ const isShiQzDelet = ref(false)
|
||||
onMounted(() => {
|
||||
getList();
|
||||
tabHeightFn();
|
||||
const isShiQz = getItem('roleList').find(item => item.roleCode == 'JS_777777') != undefined
|
||||
const isShiQz = getItem('roleList').find(item => item.roleCode == 'JS_777777') != undefined
|
||||
if (isShiQz) isShiQzDelet.value = true
|
||||
});
|
||||
|
||||
@ -263,7 +258,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,44 +2,18 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请</el-button>
|
||||
</template>
|
||||
<div class="flex just-center">
|
||||
<el-button size="small" type="primary" v-for="it in D_GS_BK_SQLX" :key="it.dm"
|
||||
@click="handleApplication(it)">{{ it.zdmc }}</el-button>
|
||||
</div>
|
||||
</el-popover> -->
|
||||
<!-- <el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button size="small" type="primary" @click="(visiblefp = !visiblefp), (visible = false)">指定分配</el-button>
|
||||
</template>
|
||||
<div>
|
||||
<el-input readonly v-model="obj.fpmc" @click="chooseUserVisible = true" placeholder="请选择民警"></el-input>
|
||||
<div class="flex just-center mt10">
|
||||
<el-button @click="(visiblefp = false), (obj = {})" size="small">取消</el-button>
|
||||
<el-button type="primary" @click="handlefp" size="small">分配</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover> -->
|
||||
<!-- <el-button size="small" type="primary" @click="handleZxs">转线索</el-button> -->
|
||||
<!-- <el-button size="small" type="primary" @click="handleMove">移交管控</el-button> -->
|
||||
<!-- <el-button size="small" type="primary">导入</el-button> -->
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -328,7 +302,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,10 +3,17 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left> -->
|
||||
<!-- <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请</el-button>
|
||||
@ -30,16 +37,11 @@
|
||||
</el-popover>
|
||||
<el-button size="small" type="primary" @click="handleZxs">转线索</el-button>
|
||||
<el-button size="small" type="primary" @click="handleMove">移交管控</el-button> -->
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
|
||||
<!-- </template>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -315,7 +317,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,46 +3,17 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请
|
||||
</el-button>
|
||||
</template>
|
||||
<div class="flex just-center">
|
||||
<el-button size="small" type="primary" v-for="it in D_GS_BK_SQLX" :key="it.dm"
|
||||
@click="handleApplication(it)">{{ it.zdmc }}</el-button>
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button size="small" type="primary" @click="(visiblefp = !visiblefp), (visible = false)">指定分配</el-button>
|
||||
</template>
|
||||
<div>
|
||||
<el-input readonly v-model="obj.fpmc" @click="chooseUserVisible = true" placeholder="请选择民警"></el-input>
|
||||
<div class="flex just-center mt10">
|
||||
<el-button @click="(visiblefp = false), (obj = {})" size="small">取消</el-button>
|
||||
<el-button type="primary" @click="handlefp" size="small">分配</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
|
||||
<el-button size="small" type="primary" @click="handleZxs">转线索</el-button>
|
||||
<el-button size="small" type="primary" @click="handleMove">移交管控</el-button> -->
|
||||
<!-- <el-button size="small" type="primary" >导入</el-button> -->
|
||||
<el-button type="primary" size="small" @click="addEdit('add', null)">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="addEdit('add', null)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData" fixed="right">
|
||||
@ -317,7 +288,7 @@ const deleteRow = (id) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,10 +3,17 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="addEdit('add', null)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left> -->
|
||||
<!-- <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请
|
||||
@ -30,16 +37,11 @@
|
||||
</el-popover>
|
||||
<el-button size="small" type="primary" @click="handleZxs">转线索</el-button>
|
||||
<el-button size="small" type="primary" @click="handleMove">移交管控</el-button> -->
|
||||
<el-button type="primary" size="small" @click="addEdit('add', null)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
|
||||
<!-- </template>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
|
||||
@ -2,44 +2,18 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <el-popover placement="bottom" :visible="visible" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button type="primary" @click="(visible = !visible), (visiblefp = false)" size="small">布控申请</el-button>
|
||||
</template>
|
||||
<div class="flex just-center">
|
||||
<el-button size="small" type="primary" v-for="it in D_GS_BK_SQLX" :key="it.dm"
|
||||
@click="handleApplication(it)">{{ it.zdmc }}</el-button>
|
||||
</div>
|
||||
</el-popover> -->
|
||||
<!-- <el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
|
||||
<template #reference>
|
||||
<el-button size="small" type="primary" @click="(visiblefp = !visiblefp), (visible = false)">指定分配</el-button>
|
||||
</template>
|
||||
<div>
|
||||
<el-input readonly v-model="obj.fpmc" @click="chooseUserVisible = true" placeholder="请选择民警"></el-input>
|
||||
<div class="flex just-center mt10">
|
||||
<el-button @click="(visiblefp = false), (obj = {})" size="small">取消</el-button>
|
||||
<el-button type="primary" @click="handlefp" size="small">分配</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-popover> -->
|
||||
<!-- <el-button size="small" type="primary" @click="handleZxs">转线索</el-button> -->
|
||||
<!-- <el-button size="small" type="primary" @click="handleMove">移交管控</el-button> -->
|
||||
<!-- <el-button size="small" type="primary">导入</el-button> -->
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -331,7 +305,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -17,7 +17,7 @@
|
||||
<div class="phone-input-container">
|
||||
<div class="inputGroup" v-for="(item, index) in listQuery.ryLxdh" :key="index">
|
||||
<el-input v-model="listQuery.ryLxdh[index]" class="group" placeholder="请输入电话号码" />
|
||||
<div class="flex align-center but" >
|
||||
<div class="flex align-center but">
|
||||
<el-button type="primary" :icon="Plus" circle @click="addPhone" title="添加电话号码"
|
||||
v-if="listQuery.ryLxdh.length - 1 == index" />
|
||||
<el-button type="success" :icon="Minus" circle @click="removePhone(index)" title="删除电话号码" />
|
||||
@ -25,11 +25,25 @@
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<template #gkmjxm>
|
||||
<div>
|
||||
<el-input v-model="listQuery.gkmjxm" class="group" placeholder="请输入管控民警姓名" readonly
|
||||
@click="chooseMarksVisible = true" />
|
||||
</div>
|
||||
</template>
|
||||
<template #gkmjsfzh>
|
||||
<div>
|
||||
<el-input v-model="listQuery.gkmjsfzh" class="group" placeholder="请输入管控民警身份证号" readonly
|
||||
@click="chooseMarksVisible = true" />
|
||||
</div>
|
||||
</template>
|
||||
<!-- { label: "管控民警", prop: "gkmjxm", type: "slot" }, -->
|
||||
<!-- { label: "管控民警身份证号", prop: "gkmjsfzh", type: "slot" }, -->
|
||||
</FormMessage>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" /> -->
|
||||
<ChooseUser v-model="chooseMarksVisible" @choosedUsers="choosed" :roleIds="roleIds" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -37,7 +51,7 @@ import * as rule from "@/utils/rules.js";
|
||||
import * as MOSTY from "@/components/MyComponents/index";
|
||||
import { Plus, Minus } from "@element-plus/icons-vue";
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
||||
import ChooseUser from "@/components/ChooseList/ChooseUser/index.vue";
|
||||
import { ref, reactive, onMounted, getCurrentInstance, watch } from "vue";
|
||||
import { tbGsxtZdryUpdate } from "@/api/zdr.js";
|
||||
const { proxy } = getCurrentInstance();
|
||||
@ -63,12 +77,13 @@ const rules = reactive({
|
||||
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||
ryLxdh: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
|
||||
ryXb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||
zyBm: [{ required: true, message: "请选择职业", trigger: "change" }],
|
||||
ryMz: [{ required: true, message: "请选择民族", trigger: "change" }],
|
||||
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
|
||||
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
|
||||
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
|
||||
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }],
|
||||
zrSsbmdm: [{ required: true, message: "请选择责任单位", trigger: "change" }],
|
||||
// gkmjxm: [{ required: true, message: "请选择管控民警", trigger: "change" }],
|
||||
// gkmjsfzh: [{ required: true, message: "请选择管控民警身份证号", trigger: "change" }],
|
||||
// rylx: [{ required: true, message: "请选择人员类型", trigger: "change" }]
|
||||
});
|
||||
const listQuery = ref({ ryLxdh: [""] }); //表单
|
||||
@ -90,10 +105,12 @@ const formData = ref([
|
||||
{ label: "出生日期", prop: "ryCsrq", type: "date" },
|
||||
{ label: "户籍地区划", prop: "hjdQh", type: "select", options: D_BZ_XZQHDM },
|
||||
{ label: "户籍地详址", prop: "hjdXz", type: "input" },
|
||||
{ label: "户籍地派出所", prop: "hjdPcsdm",depMc:"hjdPcsmc" ,type: "department" },
|
||||
{ label: "户籍地派出所", prop: "hjdPcsdm", depMc: "hjdPcsmc", type: "department" },
|
||||
{ label: "现住地区划", prop: "xzdQh", type: "select", options: D_BZ_XZQHDM },
|
||||
{ label: "现住地详址", prop: "xzdXz", type: "input" },
|
||||
{ label: "现住地派出所", prop: "xzdPcsdm",depMc:"xzdPcsmc" ,type: "department" },
|
||||
{ label: "现住地派出所", prop: "xzdPcsdm", depMc: "xzdPcsmc", type: "department" },
|
||||
{ label: "管控民警", prop: "gkmjxm", type: "slot" },
|
||||
{ label: "民警身份证", prop: "gkmjsfzh", type: "slot" },
|
||||
{ label: "管辖单位", prop: "gxSsbmdm", depMc: 'gxSsbmmc', type: "department" },
|
||||
{ label: "诉求单位", prop: "sqSsbmdm", depMc: 'sqSsbmmc', type: "department" },
|
||||
{ label: "责任单位", prop: "zrSsbmdm", depMc: 'zrSsbmmc', type: "department" },
|
||||
@ -171,17 +188,17 @@ const gettbGsxtZdryUpdate = () => {
|
||||
}
|
||||
elform.value.submit((data) => {
|
||||
tbGsxtZdryUpdate(promes).then((res) => {
|
||||
listQuery.value.ryzp = []
|
||||
proxy.$message({
|
||||
message: '更新成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch((err) => {
|
||||
listQuery.value.ryzp = []
|
||||
proxy.$message({
|
||||
message: '更新成功',
|
||||
type: 'success',
|
||||
})
|
||||
}).catch((err) => {
|
||||
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
});
|
||||
})
|
||||
}).finally(() => {
|
||||
loading.value = false
|
||||
});
|
||||
})
|
||||
|
||||
|
||||
|
||||
@ -246,7 +263,13 @@ const throwData = () => {
|
||||
}
|
||||
});
|
||||
};
|
||||
const choosed = (val) => {
|
||||
roleIds.value = [val[0].id]
|
||||
listQuery.value.gkmjxm = val[0].userName
|
||||
listQuery.value.gkmjsfzh = val[0].idEntityCard
|
||||
console.log(listQuery.value);
|
||||
|
||||
};
|
||||
defineExpose({
|
||||
throwData,
|
||||
});
|
||||
|
||||
@ -37,7 +37,7 @@
|
||||
</template>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -401,7 +401,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,6 +3,7 @@
|
||||
<div class="head_box">
|
||||
<span class="title">线索{{ title }}</span>
|
||||
<div>
|
||||
<el-button type="primary" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
|
||||
<el-button @click="close">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
@ -19,6 +20,7 @@
|
||||
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||
import { qbcjAdd, qbcjUpdate, qbcjSelectByid } from "@/api/Intelligence.js";
|
||||
import { qcckGet, qcckPost } from '@/api/qcckApi'
|
||||
import pursueContent from "@/views/backOfficeSystem/HumanIntelligence/components/pursueContent.vue";
|
||||
import { ref, defineExpose, onMounted, defineEmits, watch, getCurrentInstance } from "vue";
|
||||
const { proxy } = getCurrentInstance()
|
||||
@ -33,6 +35,12 @@ const props = defineProps({
|
||||
const loading = ref(false)
|
||||
const dialogForm = ref(false); //弹窗
|
||||
const formData = ref();
|
||||
const rules = ref({
|
||||
qbmc: [{ required: true, message: "请输入情报标题", trigger: ["blur"] }],
|
||||
zxssj: [{ required: true, message: "请选择转线索时间", trigger: ["blur"] }],
|
||||
qbnr: [{ required: true, message: "请输入情报内容", trigger: ["blur"] }],
|
||||
});
|
||||
|
||||
|
||||
|
||||
watch(() => dialogForm.value, (val) => {
|
||||
@ -48,29 +56,45 @@ watch(() => dialogForm.value, (val) => {
|
||||
}
|
||||
}, { deep: true })
|
||||
const listQuery = ref({}); //表单
|
||||
const elform = ref();
|
||||
onMounted(() => {
|
||||
})
|
||||
const addForm = ref()
|
||||
const msgeDat = ref()
|
||||
const title = ref("")
|
||||
const showPj = ref(false)
|
||||
const disabled = ref(false)
|
||||
// 初始化数据
|
||||
const init = (type, row) => {
|
||||
console.log(row,"测试");
|
||||
|
||||
title.value = type == "add" ? "新增" : type == "info" ? "详情" : "编辑"
|
||||
disabled.value = type == 'info' ? true : false
|
||||
// disabled.value = type == 'info' ? true : false
|
||||
dialogForm.value = true;
|
||||
if (type == 'info' || type == 'edit') {
|
||||
if (type != 'add') {
|
||||
showPj.value = true
|
||||
listQuery.value = row
|
||||
if (type == 'info') {
|
||||
disabled.value = true
|
||||
} else {
|
||||
disabled.value = false
|
||||
}
|
||||
} else {
|
||||
disabled.value = false
|
||||
}
|
||||
};
|
||||
// 新增修改
|
||||
const submit = () => {
|
||||
const promes = { ...listQuery.value }
|
||||
const url = title.value == "新增" ? "/mosty-gsxt/xxcj/zxs/addEntity" : "/mosty-gsxt/xxcj/zxs/updateEntity"
|
||||
qcckPost({...promes,qbly:'0'}, url).then(res => {
|
||||
proxy.$message({
|
||||
message: "操作成功",
|
||||
type: "success",
|
||||
});
|
||||
emit("getList")
|
||||
close()
|
||||
})
|
||||
|
||||
};
|
||||
const close = () => {
|
||||
dialogForm.value = false;
|
||||
listQuery.value = {};
|
||||
};
|
||||
|
||||
defineExpose({ init });
|
||||
@ -185,7 +209,8 @@ defineExpose({ init });
|
||||
color: #f78989;
|
||||
transform: scale(1.1);
|
||||
}
|
||||
::v-deep .el-textarea.is-disabled .el-textarea__inner{
|
||||
|
||||
::v-deep .el-textarea.is-disabled .el-textarea__inner {
|
||||
color: #000;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -2,7 +2,15 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10 mb10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button type="primary" size="small" @click="getDataById('add', null)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
@ -15,9 +23,14 @@
|
||||
<template #cjlx="{ row }">
|
||||
<DictTag :tag="false" :value="row.cjLx" :options="D_BZ_CJLX" />
|
||||
</template>
|
||||
<template #qbly="{ row }">
|
||||
<DictTag :tag="false" :value="row.qbly" :options="D_GS_XS_LY" />
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link size="small" type="primary" @click="getDataById(row)">详情</el-link>
|
||||
<el-link size="small" type="primary" @click="getDataById('info',row)">详情</el-link>
|
||||
<el-link size="small" type="primary" @click="getDataById('edit',row)">编辑</el-link>
|
||||
<el-link size="small" type="danger" @click="handleRow(row.id)">删除</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
|
||||
@ -26,21 +39,21 @@
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
<AddForm ref="addForm" :dict="{ D_BZ_CJLX, D_GS_XS_LX }" />
|
||||
<AddForm ref="addForm" :dict="{ D_BZ_CJLX, D_GS_XS_LX }" @getList="getList" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { useRoute } from 'vue-router'
|
||||
import { xxcjZxsSelectPage } from "@/api/xxcj.js";
|
||||
import { qcckGet, qcckPost } from '@/api/qcckApi'
|
||||
import { reactive, ref, onMounted, getCurrentInstance, watch } from "vue";
|
||||
import AddForm from "./addForm.vue"
|
||||
import { getItem } from '@//utils/storage.js'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_CJLX, D_GS_XS_LX } = proxy.$dict("D_BZ_CJLX", "D_GS_XS_LX"); //获取字典数据
|
||||
const { D_BZ_CJLX, D_GS_XS_LX,D_GS_XS_LY } = proxy.$dict("D_BZ_CJLX", "D_GS_XS_LX","D_GS_XS_LY"); //获取字典数据
|
||||
const detailDiloag = ref();
|
||||
const searchBox = ref(); //搜索框
|
||||
const ids = ref([])
|
||||
@ -90,12 +103,12 @@ const pageData = reactive({
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
},
|
||||
controlsWidth: 100,
|
||||
controlsWidth: 180,
|
||||
tableColumn: [
|
||||
{ label: "情报标题", prop: "qbmc",width:250 },
|
||||
{ label: "编号", prop: "xsBh",width:190 },
|
||||
// { label: "情报类型", prop: "qblx", showSolt: true },
|
||||
// { label: "情报来源", prop: "cjlx", showSolt: true },
|
||||
{ label: "情报来源", prop: "qbly", showSolt: true },
|
||||
{ label: "转线索时间", prop: "zxssj",width:190 },
|
||||
{ label: "情报内容", prop: "qbnr",width:190 },
|
||||
{ label: "所属部门", prop: "ssbm" },
|
||||
@ -126,17 +139,36 @@ const getList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
||||
delete data.times;
|
||||
xxcjZxsSelectPage(data).then(res => {
|
||||
pageData.tableData = res.records || [];
|
||||
pageData.total = res.total;
|
||||
pageData.tableConfiger.loading = false;
|
||||
}).catch(() => { pageData.tableConfiger.loading = false; })
|
||||
}
|
||||
qcckGet(data, "/mosty-gsxt/xxcj/zxs/selectPage").then((res) => {
|
||||
pageData.tableData = res.records || [];
|
||||
pageData.total = res.total;
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
})
|
||||
|
||||
// xxcjZxsSelectPage(data).then(res => {
|
||||
// pageData.tableData = res.records || [];
|
||||
// pageData.total = res.total;
|
||||
// pageData.tableConfiger.loading = false;
|
||||
// }).catch(() => { pageData.tableConfiger.loading = false; })
|
||||
}
|
||||
// 删除
|
||||
const handleRow = (id) => {
|
||||
const promes = {
|
||||
ids: id ? [id] : ids.value
|
||||
}
|
||||
proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => {
|
||||
qcckPost(promes, "/mosty-gsxt/xxcj/zxs/deletes").then(() => {
|
||||
proxy.$message({ type: "success", message: "删除成功" });
|
||||
getList();
|
||||
});
|
||||
})
|
||||
};
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
@ -147,10 +179,8 @@ const getRouter = () => {
|
||||
routerMate.value = route.meta
|
||||
}
|
||||
const addForm = ref(null)
|
||||
const getDataById = (row) => {
|
||||
addForm.value.init('info', row);
|
||||
console.log(row);
|
||||
|
||||
const getDataById = (type,row) => {
|
||||
addForm.value.init(type, row);
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
@ -2,20 +2,22 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<!-- <MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"> -->
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
@ -157,7 +159,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,20 +2,22 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="getDataById('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button size="small" type="primary" @click="getDataById('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -159,7 +161,7 @@ const getList = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -1,18 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button size="small" type="primary" @click="getDataById('add', '')">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -155,7 +157,7 @@ const getList = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,11 +2,8 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Searchs :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" @click="addEdit('add')" size="small">
|
||||
<Searchs :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button type="primary" @click="addEdit('add')" size="small">
|
||||
<el-icon class="vertical-middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
@ -35,10 +32,11 @@
|
||||
<el-icon class="vertical-middle"><Edit /></el-icon>
|
||||
<span class="vertical-middle">情报信息报告</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Searchs>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox" :style="{ height: (pageData.tableHeight + 40) + 'px' }">
|
||||
<div class="margTop" >
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData" @handleCellClick="openXxqk">
|
||||
@ -472,7 +470,7 @@ const openXxqk = (row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 280;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,25 +3,17 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="addEdit('add', null)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button type="danger" size="small" @click="plDelDictItem">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<Dete />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">批量删除</span>
|
||||
</el-button></template>
|
||||
</PageTitle>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="chooseData">
|
||||
@ -65,7 +57,6 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -187,7 +178,7 @@ const clickTag = (val) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,26 +2,18 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" @click="dologCancel()" size="small">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button type="primary" @click="dologCancel()" size="small">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">导出</span>
|
||||
</el-button>
|
||||
</template>
|
||||
<!-- <el-button v-if="qxkz.deptLevel == '01'" type="primary" :disabled="ids.length === 0" @click="batchMark(ids)">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">批量打标</span>
|
||||
</el-button> -->
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -87,7 +79,6 @@
|
||||
|
||||
<script setup>
|
||||
import { qcckPost } from "@/api/qcckApi.js";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -273,7 +264,7 @@ const handleCase = (row) => {
|
||||
}
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox mt10" :style="{height: pageData.tableHeight +30+ 'px'}">
|
||||
<div class="margTop" >
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
|
||||
@ -5,10 +5,9 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
|
||||
<template #jflx="{ row }">
|
||||
<DictTag :tag="false" :value="row.jflx" :options="jflxArr" />
|
||||
</template>
|
||||
@ -144,7 +143,7 @@ addForm.value.init(type, row,);
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,21 +2,17 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10 mb10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" @click="handleRow('add', '')" size="small">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" @click="handleRow('add', '')" size="small">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow('moreDelete', '')">批量删除</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -58,7 +54,6 @@
|
||||
total: pageData.total
|
||||
}"
|
||||
></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 新增区域 -->
|
||||
@ -67,7 +62,6 @@
|
||||
|
||||
<script setup>
|
||||
import AddForm from "./components/addForm.vue";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -218,7 +212,7 @@ const handleSwitch = (row) =>{
|
||||
}
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 272;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,18 +3,16 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch"></Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="AddFrom('add', '')">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -50,7 +48,6 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -175,7 +172,7 @@ const createProcess = (row) => {
|
||||
}
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 300;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,17 +2,14 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">发起布控</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">发起布控</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
|
||||
@ -66,7 +63,6 @@
|
||||
total: pageData.total
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 布控类型 -->
|
||||
<AddBkdx ref="addBkdxForm" @change="getList" :name="route.name" :dic="{
|
||||
@ -83,7 +79,6 @@
|
||||
<script setup>
|
||||
import AddBkdx from "./components/addBkdx.vue";
|
||||
import YjDialog from "./components/yjDialog.vue";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -250,7 +245,7 @@ const openShowHzd = (row) => {
|
||||
}
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -1,19 +1,15 @@
|
||||
<template>
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
</PageTitle>
|
||||
<div class="tabBox">
|
||||
</Search>
|
||||
</div>
|
||||
<div class="tabBox margTop">
|
||||
<ul class="list noScollLine" v-loading="pageData.loading">
|
||||
<li class="list-item" v-for="(item, index) in pageData.list" :key="`tableData${index}`">
|
||||
<div class="top">
|
||||
@ -258,7 +254,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 210;
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox" :style="{height: pageData.tableHeight + 10 +'px'}">
|
||||
<div class="margTop" >
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight" :key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #bglx="{ row }">
|
||||
<DictTag :tag="false" :value="row.bglx" :options="D_BZ_YPLX" />
|
||||
@ -172,7 +172,7 @@ const showPopover = (row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 210;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,20 +2,17 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="getDataById('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button type="primary" size="small" @click="getDataById('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #bglx="{ row }">
|
||||
@ -146,7 +143,7 @@ const getList = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,20 +2,18 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="getDataById('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button size="small" type="primary" @click="getDataById('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #zlzt="{ row }">
|
||||
@ -136,7 +134,7 @@ const getList = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,20 +3,18 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="createReport('add')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" >
|
||||
<el-button size="small" type="primary" @click="createReport('add')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">创建报告</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #bglx="{ row }">
|
||||
@ -173,7 +171,7 @@ const getList = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,15 +3,16 @@
|
||||
<div class="content">
|
||||
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch"> </Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" type="primary" @click="openAddModel('add')" :icon="CirclePlus">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button size="small" type="primary" @click="openAddModel('add')" :icon="CirclePlus">
|
||||
新增模型
|
||||
</el-button>
|
||||
</el-button> </Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<ul class="cntlsit mb10" v-if="show" v-infinite-scroll="load" :style="{ height: listHeight + 'px' }"
|
||||
v-loading="loading">
|
||||
<li class="model-card" v-for="(it, idx) in list" :key="idx">
|
||||
@ -133,7 +134,7 @@ const getLits = () => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
listHeight.value = window.innerHeight - searchBox.value.offsetHeight - 230;
|
||||
listHeight.value = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
<template>
|
||||
<div>
|
||||
<YpHome v-if="showModel == '研判首页'"></YpHome>
|
||||
|
||||
<List v-if="showModel == '四色预警规则' || showModel == '预警规则'" :item="itemData" :dict="{ D_BZ_TPYJLX}"></List>
|
||||
<YjDetail v-if="showModel == '预警列表'" :item="itemData" :dict="{ D_BZ_TPYJLX,D_BZ_YJLX,D_BZ_JQLY }"></YjDetail>
|
||||
<WarningList v-if="showModel == '预警详情'" :item="itemData" :dict="{ D_BZ_YJLX }"/>
|
||||
|
||||
187
src/views/backOfficeSystem/PoliceIncidentMonitoring/addForm.vue
Normal file
187
src/views/backOfficeSystem/PoliceIncidentMonitoring/addForm.vue
Normal file
@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<div class="dialog" v-if="dialogForm">
|
||||
<div class="head_box">
|
||||
<span class="title">{{ title }}警情监测</span>
|
||||
<div>
|
||||
<el-button type="primary" size="small" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
|
||||
<el-button size="small" @click="close">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form_cnt">
|
||||
<FormMessage ref="elform" :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px"
|
||||
:rules="rules">
|
||||
<template #jqzldm>
|
||||
<el-cascader v-model="listQuery.jqzldm" :options="props.dict.jqTree" clearable filterable :show-all-levels="false" :props="{label: 'zdmc', value: 'dm', children: 'itemList',checkStrictly: true }" />
|
||||
</template>
|
||||
</FormMessage>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import * as rule from "@/utils/rules.js";
|
||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, watch, onUnmounted } from "vue";
|
||||
const emit = defineEmits(["getList"]);
|
||||
const props = defineProps({
|
||||
dict: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
});
|
||||
|
||||
const { proxy } = getCurrentInstance();
|
||||
const dialogForm = ref(false); //弹窗
|
||||
const rules = reactive({
|
||||
// jqgjz: [{ required: true, message: "请输入内容关键字", trigger: "blur" }],
|
||||
// gzms: [{ required: true, message: "请输入规则描述", trigger: "blur" }],
|
||||
// jqzldm: [{ required: true, message: "请选择警情子类", trigger: "blur" }],
|
||||
// jqdjdm: [{ required: true, message: "请选择警情等级", trigger: "blur" }],
|
||||
});
|
||||
const listQuery = ref({}); //表单
|
||||
const formData = ref();
|
||||
const loading = ref(false);
|
||||
const elform = ref();
|
||||
const title = ref("");
|
||||
const disabled = ref(false);
|
||||
|
||||
// 初始化数据
|
||||
const init = (type, row) => {
|
||||
title.value = type == 'edit' ? '编辑' : type == 'add' ? '新增' : '详情'
|
||||
dialogForm.value = true;
|
||||
|
||||
formData.value = [
|
||||
{ label: "警情等级", prop: "jqdjdm", type: "select", options: props.dict.D_BZ_JQDJ || [] },
|
||||
{ label: "警情子类", prop: "jqzldm", type: "slot" },
|
||||
{ label: "内容关键字", prop: "jqgjz", type: "textarea", width: "100%" },
|
||||
{ label: "规则描述", prop: "gzms", type: "textarea", width: "100%" },
|
||||
]
|
||||
if (type != 'add') {
|
||||
// 处理级联选择器的回显
|
||||
if (row.jqzldm && props.dict.jqTree) {
|
||||
const fullPath = findFullPath(props.dict.jqTree, row.jqzldm);
|
||||
if (fullPath.length > 0) {
|
||||
listQuery.value = {
|
||||
...row,
|
||||
jqzldm: fullPath
|
||||
};
|
||||
} else {
|
||||
listQuery.value = row;
|
||||
}
|
||||
} else {
|
||||
listQuery.value = row;
|
||||
}
|
||||
if (type == 'detail') {
|
||||
disabled.value = true;
|
||||
} else {
|
||||
disabled.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
// 查找完整的级联路径
|
||||
const findFullPath = (tree, targetValue, currentPath = []) => {
|
||||
for (const node of tree) {
|
||||
const newPath = [...currentPath, node.dm];
|
||||
if (node.dm === targetValue) {
|
||||
return newPath;
|
||||
}
|
||||
if (node.itemList && node.itemList.length > 0) {
|
||||
const result = findFullPath(node.itemList, targetValue, newPath);
|
||||
if (result.length > 0) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
// 提交
|
||||
const submit = () => {
|
||||
// 处理级联选择器的值，只提交最后一个值
|
||||
const promes = {
|
||||
...listQuery.value,
|
||||
jqzldm: Array.isArray(listQuery.value.jqzldm) ? listQuery.value.jqzldm[listQuery.value.jqzldm.length - 1] : listQuery.value.jqzldm
|
||||
}
|
||||
elform.value.submit((data) => {
|
||||
loading.value = true;
|
||||
if (title.value == "新增") {
|
||||
qcckPost(promes, '/mosty-gsxt/jqjczg/addEntity').then(() => {
|
||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||
emit("getList");
|
||||
close();
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
} else {
|
||||
qcckPut(promes, '/mosty-gsxt/jqjczg/editEntity').then(() => {
|
||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||
emit("getList");
|
||||
close();
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
};
|
||||
// 关闭
|
||||
const close = () => {
|
||||
listQuery.value = {};
|
||||
dialogForm.value = false;
|
||||
loading.value = false;
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
onUnmounted(() => {
|
||||
})
|
||||
defineExpose({ init });
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/assets/css/layout.scss";
|
||||
@import "~@/assets/css/element-plus.scss";
|
||||
|
||||
::v-deep .el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
|
||||
color: #0072ff;
|
||||
background: rgba(0, 114, 255, 0.3);
|
||||
}
|
||||
|
||||
.boxlist {
|
||||
width: calc(99% - 50px);
|
||||
margin-top: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.depBox {
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 0 0 0 4px;
|
||||
border-radius: 4px;
|
||||
width: 100%;
|
||||
|
||||
.coolor {
|
||||
color: #d3d3d3;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.zdy-taf {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
min-height: 32px;
|
||||
border: 1px solid #e9e9e9;
|
||||
border-radius: 4px;
|
||||
padding: 0px 5px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.map {
|
||||
height: 520px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
101
src/views/backOfficeSystem/PoliceIncidentMonitoring/gljqLod.vue
Normal file
101
src/views/backOfficeSystem/PoliceIncidentMonitoring/gljqLod.vue
Normal file
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<el-dialog :model-value="modelValue" :title="title" width="80%" @close="closeDialog" destroy-on-close append-to-body
|
||||
:close-on-click-modal="false">
|
||||
<div style="width: 100%;height: 500px;">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :key="pageData.keyCount"
|
||||
:tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #jqdjdm="{ row }">
|
||||
<DictTag :tag="false" :value="row.jqdjdm" :options="dict.D_GS_BQ_DJ" />
|
||||
</template>
|
||||
<template #jqlbdm="{ row }">
|
||||
<DictTag :tag="false" :value="row.jqlbdm" :options="dict.JQLB" />
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<!-- <template #controls="{ row }">
|
||||
<el-link type="primary" size="small" @click="handleAdd('detail', row)">详情</el-link>
|
||||
</template> -->
|
||||
</MyTable>
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="flex just-center">
|
||||
<el-button @click="closeDialog">取消</el-button>
|
||||
<el-button type="primary" @click="submitForm">确认</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
||||
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, watch, onUnmounted, getCurrentInstance } from 'vue'
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||
const { proxy } = getCurrentInstance()
|
||||
const props = defineProps({
|
||||
modelValue: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}, zdsjLod: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
},
|
||||
dict: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
}
|
||||
});
|
||||
|
||||
const pageData = reactive({
|
||||
tableData: [], //表格数据
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
showSelectType: "null", //选择类型
|
||||
loading: false
|
||||
},
|
||||
total: 0,
|
||||
pageConfiger: {
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
}, //分页
|
||||
controlsWidth: 250, //操作栏宽度
|
||||
tableColumn: [
|
||||
{ label: "接警单编号", prop: "jjdbh" },
|
||||
{ label: "报警电话", prop: "bjdh" },
|
||||
{ label: "报警时间", prop: "bjsj" },
|
||||
{ label: "报警内容", prop: "bjnr", showOverflowTooltip: true },
|
||||
{ label: "接警员姓名", prop: "jjyxm" },
|
||||
{ label: "警情级别", prop: "jqdjdm", showSolt: true },
|
||||
{ label: "警情类型", prop: "jqlbdm", showSolt: true },
|
||||
{ label: "警情地址", prop: "jqdz" },
|
||||
{ label: "补充接警内容", prop: "bcjjnr", showOverflowTooltip: true },
|
||||
]
|
||||
});
|
||||
|
||||
|
||||
const emit = defineEmits(["update:modelValue", "addZdsjLodList"]);
|
||||
const title = ref("关联警情");
|
||||
|
||||
watch(() => props.modelValue, (newVal) => {
|
||||
handleGljq()
|
||||
console.log(props.dict);
|
||||
|
||||
})
|
||||
|
||||
// 查询关联警情
|
||||
const handleGljq = () => {
|
||||
qcckGet({ jcgzid: props.zdsjLod.id }, "/mosty-gsxt/lzJcjPjdb/selectList").then((res) => {
|
||||
pageData.tableData = res;
|
||||
pageData.keyCount++;
|
||||
});
|
||||
}
|
||||
const closeDialog = () => {
|
||||
// 关闭对话框时移除事件监听器
|
||||
emit("update:modelValue", false);
|
||||
};
|
||||
|
||||
const submitForm = () => {
|
||||
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
214
src/views/backOfficeSystem/PoliceIncidentMonitoring/index.vue
Normal file
214
src/views/backOfficeSystem/PoliceIncidentMonitoring/index.vue
Normal file
@ -0,0 +1,214 @@
|
||||
<template>
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加规则</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
<!-- 表格 -->
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="handleChooseData">
|
||||
<template #jqdjdm="{ row }">
|
||||
<DictTag :options="D_BZ_JQDJ" :tag="false" :value="row.jqdjdm"></DictTag>
|
||||
</template>
|
||||
<template #jqzldm="{ row }">
|
||||
{{ getJqName(row.jqzldm) }}
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="primary" size="small" @click="handleGljq( row)">关联警情</el-link>
|
||||
<el-link type="primary" size="small" @click="handleAdd('edit', row)">编辑</el-link>
|
||||
<el-link type="primary" size="small" @click="handleAdd('detail', row)">详情</el-link>
|
||||
<el-link type="danger" size="small" @click="handleRow(row.id)">删除</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
|
||||
...pageData.pageConfiger,
|
||||
total: pageData.total
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AddForm ref="addForm" @getList="getList" :dict="{ D_BZ_JQDJ, jqTree }" />
|
||||
<GljqLod v-model="gljqShow" :dict="{D_GS_BQ_DJ,JQLB}" :zdsjLod="zdsjLod" />
|
||||
</template>
|
||||
<script setup>
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||
import GljqLod from "./gljqLod.vue";
|
||||
import AddForm from "./addForm.vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_JQDJ ,D_GS_BQ_DJ,JQLB} = proxy.$dict("D_BZ_JQDJ","D_GS_BQ_DJ","JQLB");
|
||||
const searchBox = ref(); //搜索框
|
||||
const searchConfiger = ref([
|
||||
{
|
||||
label: "内容关键字",
|
||||
prop: "jqgjz",
|
||||
placeholder: "请输入警情内容关键字",
|
||||
showType: "input",
|
||||
},
|
||||
{
|
||||
label: "值班日期",
|
||||
prop: "startTime",
|
||||
placeholder: "请选择值班日期",
|
||||
showType: "datetimerange",
|
||||
}, {
|
||||
label: "警情等级",
|
||||
prop: "jqdjdm",
|
||||
placeholder: "请选择警情等级",
|
||||
showType: "select",
|
||||
options: D_BZ_JQDJ,
|
||||
}
|
||||
]);
|
||||
const queryFrom = ref({});
|
||||
const pageData = reactive({
|
||||
tableData: [], //表格数据
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
showSelectType: "checkbox", //选择类型
|
||||
loading: false
|
||||
},
|
||||
total: 0,
|
||||
pageConfiger: {
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
}, //分页
|
||||
controlsWidth: 250, //操作栏宽度
|
||||
tableColumn: [
|
||||
{ label: "规则描述", prop: "gzms", showOverflowTooltip: true },
|
||||
{ label: "内容关键字", prop: "jqgjz", showOverflowTooltip: true },
|
||||
{ label: "警情等级", prop: "jqdjdm", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "警情类型", prop: "jqzldm", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "录入人姓名", prop: "lrrXm", showOverflowTooltip: true },
|
||||
{ label: "录入人身份证号", prop: "lrrSfzh", showOverflowTooltip: true },
|
||||
{ label: "所属部门", prop: "ssbm" },
|
||||
]
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
getJqTree()
|
||||
getList();
|
||||
tabHeightFn();
|
||||
});
|
||||
|
||||
// 搜索
|
||||
const onSearch = (val) => {
|
||||
queryFrom.value = {
|
||||
...val,
|
||||
startTime: val.startTime ? val.startTime[0] : '',
|
||||
endTime: val.startTime ? val.startTime[1] : ''
|
||||
};
|
||||
pageData.pageConfiger.pageCurrent = 1;
|
||||
getList();
|
||||
};
|
||||
|
||||
const changeNo = (val) => {
|
||||
pageData.pageConfiger.pageCurrent = val;
|
||||
getList();
|
||||
};
|
||||
const changeSize = (val) => {
|
||||
pageData.pageConfiger.pageSize = val;
|
||||
getList();
|
||||
};
|
||||
|
||||
// 获取列表
|
||||
const getList = () => {
|
||||
const promes = {
|
||||
...pageData.pageConfiger,
|
||||
...queryFrom.value,
|
||||
}
|
||||
qcckGet(promes, "/mosty-gsxt/jqjczg/getPageList").then((res) => {
|
||||
pageData.tableData = res.records || [];
|
||||
pageData.total = res.total;
|
||||
pageData.tableConfiger.loading = false;
|
||||
}).catch(() => {
|
||||
pageData.tableConfiger.loading = false;
|
||||
});
|
||||
};
|
||||
// 获取警情树
|
||||
|
||||
const jqTree = ref([])
|
||||
const getJqTree = () => {
|
||||
qcckGet({}, "/mosty-gsxt/lzJcjPjdb/getDictTree").then((res) => {
|
||||
jqTree.value = res
|
||||
});
|
||||
}
|
||||
|
||||
// 根据值获取警情名称
|
||||
const getJqName = (value) => {
|
||||
if (!value || !jqTree.value || jqTree.value.length === 0) {
|
||||
return value || '';
|
||||
}
|
||||
|
||||
const findName = (tree, targetValue) => {
|
||||
for (const node of tree) {
|
||||
if (node.dm === targetValue) {
|
||||
return node.zdmc;
|
||||
}
|
||||
if (node.itemList && node.itemList.length > 0) {
|
||||
const result = findName(node.itemList, targetValue);
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
const name = findName(jqTree.value, value);
|
||||
return name || value;
|
||||
};
|
||||
// 删除
|
||||
const ids = ref([])
|
||||
const handleChooseData = (val) => {
|
||||
ids.value = val.map(item => item.id)
|
||||
}
|
||||
const handleRow = (id) => {
|
||||
const promes = {
|
||||
ids: id ? [id] : ids.value
|
||||
}
|
||||
proxy.$confirm("确定要删除？", "警告", { type: "warning" }).then(() => {
|
||||
qcckDelete(promes, "/mosty-gsxt/jqjczg/deleteEntity").then(() => {
|
||||
proxy.$message({ type: "success", message: "删除成功" });
|
||||
getList();
|
||||
});
|
||||
})
|
||||
};
|
||||
// 值班操作
|
||||
const addForm = ref(null);
|
||||
const handleAdd = (type, row) => {
|
||||
addForm.value.init(type, row);
|
||||
};
|
||||
// 关联警情
|
||||
const gljqShow = ref(false)
|
||||
const zdsjLod = ref()
|
||||
const handleGljq = (row) => {
|
||||
gljqShow.value = true
|
||||
zdsjLod.value=row
|
||||
}
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.el-loading-mask {
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
</style>
|
||||
@ -2,19 +2,15 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch"/>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -211,7 +207,7 @@ const showBtn = (row) => {
|
||||
}
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -114,7 +114,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -9,7 +9,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #sex="{ row }">
|
||||
@ -156,7 +156,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - (searchBox.value?.offsetHeight || 0) - 250;
|
||||
pageData.tableHeight = window.innerHeight - (searchBox.value?.offsetHeight || 0) - 220;
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -3,10 +3,7 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button size="small" v-for="(it,idx) in D_GS_BQ_LB " :key="idx" :type="type == it.zdmc ? 'success':''" @click="chooseListType(it.zdmc)">
|
||||
<span style="vertical-align: middle">{{ it.zdmc }}</span>
|
||||
</el-button>
|
||||
@ -14,11 +11,16 @@
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox" :style="{height:pageData.tableHeight+20+'px'}">
|
||||
<div class="margTop">
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
|
||||
@ -3,22 +3,23 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button size="small" v-for="(it,idx) in D_GS_BQ_LB " :key="idx" :type="type == it.zdmc ? 'success':''" @click="chooseListType(it.zdmc)">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button size="small" v-for="(it,idx) in D_GS_BQ_LB " :key="idx" :type="type == it.zdmc ? 'success':''" @click="chooseListType(it.zdmc)">
|
||||
<span style="vertical-align: middle">{{ it.zdmc }}</span>
|
||||
</el-button>
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</template>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</PageTitle>
|
||||
</template>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox" :style="{height:pageData.tableHeight+20+'px'}">
|
||||
<div class="margTop" >
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
|
||||
@ -3,19 +3,21 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button type="primary" size="small" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
|
||||
</template>
|
||||
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox" :style="{height:pageData.tableHeight+20+'px'}">
|
||||
<div class="margTop" >
|
||||
<MyTable
|
||||
:tableData="pageData.tableData"
|
||||
:tableColumn="pageData.tableColumn"
|
||||
@ -139,7 +141,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 260;
|
||||
window.onresize = function () { tabHeightFn(); };
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -2,8 +2,31 @@
|
||||
<div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button v-for="(item, index) in butList" :key="index" :type="qh == item ? 'primary' : 'default'"
|
||||
@click="qh = item" size="small">{{ item }}</el-button>
|
||||
<!-- -->
|
||||
<template v-for="(item, index) in butList" :key="index">
|
||||
<el-popover placement="right" :width="240" style='height: 300px;' trigger="click" v-if="item == '布控预警'">
|
||||
<template #reference>
|
||||
<el-button :type="butStylChange(qh) ? 'primary' : 'default'" size="small">{{ item }}</el-button>
|
||||
</template>
|
||||
<el-select v-model="value" placeholder="请选择预警类型" @change="qh = value">
|
||||
<el-option label="人像预警" value="人像预警" />
|
||||
<el-option label="车辆预警" value="车辆预警" />
|
||||
<el-option label="区域预警" value="区域预警" />
|
||||
</el-select>
|
||||
</el-popover>
|
||||
<el-popover placement="right" :width="240" style='height: 300px;' trigger="click" v-else-if ="item == '标签预警'">
|
||||
<template #reference>
|
||||
<el-button :type="BqbutStylChange(qh) ? 'primary' : 'default'" size="small">{{ item }}</el-button>
|
||||
</template>
|
||||
<el-select v-model="Bqvalue" placeholder="请选择预警类型" @change="qh = Bqvalue">
|
||||
<el-option label="身份预警" value="身份预警" />
|
||||
<el-option label="行为预警" value="行为预警" />
|
||||
<el-option label="组合预警" value="组合预警" />
|
||||
</el-select>
|
||||
</el-popover>
|
||||
<el-button :type="qh == item ? 'primary' : 'default'" @click="qh = item" size="small" v-else>{{ item
|
||||
}}</el-button>
|
||||
</template>
|
||||
</template>
|
||||
</PageTitle>
|
||||
<FouColorWarning v-if="qh == '预警整合'" />
|
||||
@ -37,10 +60,20 @@ import PoliticalSecurityWarning from "@/views/backOfficeSystem/fourColorManage/w
|
||||
|
||||
import Cs from '@/views/backOfficeSystem/ces/index.vue'
|
||||
import { onMounted, ref } from "vue";
|
||||
|
||||
const butList = ref(["七类重点", '政保预警', "人像预警", "车辆预警", "布控预警", "区域预警", "无人机预警", "预警整合",])
|
||||
// "人像预警", "车辆预警",, "区域预警","无人机预警"
|
||||
const butList = ref(["七类重点", '政保预警', "布控预警", "预警整合"])
|
||||
const qh = ref('预警整合')
|
||||
const value = ref('人像预警')
|
||||
const Bqvalue = ref('身份预警')
|
||||
const butStyle = ref()
|
||||
const hasPermissin = ref(false)
|
||||
const butStylChange = (val) => {
|
||||
return ["人像预警", "车辆预警", "区域预警", "布控预警"].includes(val)
|
||||
|
||||
}
|
||||
const BqbutStylChange = (val) => {
|
||||
return ["身份预警", "行为预警", "组合预警"].includes(val)
|
||||
}
|
||||
onMounted(() => {
|
||||
// rolCode : 市情指领导(JS_666666)、市情指权限(JS_777777)、县情指权限(JS_888888)、县情指领导权限(JS_999999);
|
||||
// depCode : 市情指领导(513030199509084123 )、市情指(340827200404141028)、县情指领导(540421196805217650)、朗县公安局指挥中心（县情指）(540422200010197030)、朗县公安局县城派出所（部门）(513425199305205211)
|
||||
@ -56,7 +89,8 @@ onMounted(() => {
|
||||
})
|
||||
if (hasPermissin.value) {
|
||||
const data = butList.value.filter(item => item !== "预警整合")
|
||||
butList.value = [...data, ...["身份预警", "行为预警", "组合预警", "预警整合"]]
|
||||
// "身份预警", "行为预警", "组合预警"
|
||||
butList.value = [...data, ...["标签预警", "预警整合"]]
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -3,11 +3,18 @@
|
||||
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
</Search>
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<!-- <PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<!-- <el-button>
|
||||
<el-button>
|
||||
<span style="vertical-align: middle">调级</span>
|
||||
</el-button>
|
||||
<el-button>
|
||||
@ -15,17 +22,12 @@
|
||||
</el-button>
|
||||
<el-button>
|
||||
<span style="vertical-align: middle">导入</span>
|
||||
</el-button> -->
|
||||
<el-button size="small" type="primary" @click="addEdit('add', '')">
|
||||
<el-icon style="vertical-align: middle">
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span style="vertical-align: middle">新增</span>
|
||||
</el-button>
|
||||
|
||||
</template>
|
||||
</PageTitle>
|
||||
</PageTitle> -->
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #bqYs="{ row }">
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
</Searchs>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox" >
|
||||
<div class="margTop" >
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #sfcs="{ row }">
|
||||
@ -205,7 +205,7 @@ const openAddFrom = (row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - (searchBox.value?.offsetHeight || 0) - 200;
|
||||
pageData.tableHeight = window.innerHeight - (searchBox.value?.offsetHeight || 0) - 220;
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #czzt="{ row }">
|
||||
@ -146,7 +146,7 @@ const pushAssess = (val) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () { tabHeightFn(); };
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -54,8 +54,8 @@ const dialogForm = ref(false); //弹窗
|
||||
const rules = reactive({
|
||||
jrzbrXm: [{ required: true, message: "请输入今日值班人", trigger: "blur" }],
|
||||
jrzbrLxdh: [{ required: true, message: "请输入今日值班电话", trigger: "blur" }],
|
||||
mrzbrXm: [{ required: true, message: "请输入明日值班人", trigger: "blur" }],
|
||||
mrzbrLxdh: [{ required: true, message: "请输入明日值班电话", trigger: "blur" }],
|
||||
mrzbrXm: [{ required: true, message: "请输入每日值班人", trigger: "blur" }],
|
||||
mrzbrLxdh: [{ required: true, message: "请输入每日值班电话", trigger: "blur" }],
|
||||
kssj: [{ required: true, message: "请选择开始时间", trigger: "blur" }],
|
||||
jssj: [{ required: true, message: "请选择结束时间", trigger: "blur" }],
|
||||
gzrq: [{ required: true, message: "请选择工作日期", trigger: "blur" }],
|
||||
@ -115,6 +115,8 @@ const init = (type, row) => {
|
||||
} else {
|
||||
disabled.value = false;
|
||||
}
|
||||
} else {
|
||||
disabled.value = false;
|
||||
}
|
||||
};
|
||||
// 提交
|
||||
@ -172,7 +174,7 @@ const deleteZdsjLodList = (id) => {
|
||||
pageData.tableData.splice(index, 1);
|
||||
}
|
||||
}
|
||||
// 打开明日值日列表
|
||||
// 打开每日值日列表
|
||||
const toDayContentShow = ref();
|
||||
const toDayContent = ref();
|
||||
const openToDayContent = (type, row) => {
|
||||
@ -200,6 +202,8 @@ const close = () => {
|
||||
listQuery.value = {};
|
||||
dialogForm.value = false;
|
||||
loading.value = false;
|
||||
pageData.tableData = [];
|
||||
toDayJobList.tableData = [];
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
@ -2,18 +2,15 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加完成情况</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="handleChooseData">
|
||||
@ -33,12 +30,10 @@
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AddForm ref="addForm" @getList="getList" :dict="{ D_BZ_ZDSJCZJG }" />
|
||||
|
||||
</template>
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -160,7 +155,7 @@ const handleAdd = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 210;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
@ -172,4 +167,9 @@ const tabHeightFn = () => {
|
||||
.el-loading-mask {
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
.margTop{
|
||||
padding: 10px;
|
||||
margin-top: 10px;
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -33,7 +33,7 @@ const props = defineProps({
|
||||
const listQuery = ref({})
|
||||
const elform = ref()
|
||||
const emit = defineEmits(["update:modelValue", "addZdsjLodList"]);
|
||||
const title = ref("明日工作内容");
|
||||
const title = ref("每日工作内容");
|
||||
const formData = ref([
|
||||
{ label: "工作内容", prop: "gznr", type: "textarea" ,width: "100%" },
|
||||
]);
|
||||
|
||||
@ -5,9 +5,8 @@
|
||||
<div ref="searchBox" class="mt10 mb10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
|
||||
@ -157,7 +156,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 200;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,18 +2,15 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加事件</el-button>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" >
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加事件</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="handleChooseData">
|
||||
@ -33,11 +30,9 @@
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AddForm ref="addForm" @getList="getList" :dict="{D_BZ_ZDSJCZJG}" />
|
||||
</template>
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -162,7 +157,7 @@ addForm.value.init(type, row);
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -2,18 +2,14 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10 mb10">
|
||||
<Search :searchArr="searchConfiger" ref="ces" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" ref="ces" @submit="onSearch" :key="pageData.keyCount">
|
||||
<el-button type="primary" size="small" @click="exportExl">导出</el-button>
|
||||
<el-button type="primary" size="small" @click="getSlect">我的关注</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="heightBox margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="handleChooseData">
|
||||
@ -60,7 +56,6 @@ import { getMultiDictVal } from "@/utils/dict.js"
|
||||
import { exportExlByObj } from "@/utils/exportExcel.js"
|
||||
import YpDialog from "./components/ypDialog.vue";
|
||||
import DeepYpDialog from "./components/deepypDialog.vue";
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -257,15 +252,16 @@ qcckPost({
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style >
|
||||
.el-loading-mask {
|
||||
background: rgba(0, 0, 0, 0.5) !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox heightBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<!-- <template #jjlx="{ row }">
|
||||
@ -138,7 +138,7 @@ const addEdit = (type, row) => {
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight -200
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight -220
|
||||
window.onresize = function() {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -1,15 +1,20 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="titleBox">
|
||||
<div class="title">菜单管理</div>
|
||||
<!-- <div class="title">菜单管理</div>
|
||||
<div class="btnBox">
|
||||
<el-button type="primary" @click="addItemMenu">
|
||||
<el-icon><CirclePlus /></el-icon>
|
||||
|
||||
</div> -->
|
||||
<div ref="searchBox" class="mt10 mb10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="addItemMenu" >
|
||||
<el-icon>
|
||||
<CirclePlus />
|
||||
</el-icon>
|
||||
<span>新增</span>
|
||||
</el-button>
|
||||
</div>
|
||||
</Search>
|
||||
</div>
|
||||
<div class="searchBox" ref="searchBox">
|
||||
<!-- <div class="searchBox" ref="searchBox">
|
||||
<el-form :model="listQuery" :inline="true">
|
||||
<el-form-item label="菜单名称">
|
||||
<el-input
|
||||
@ -23,117 +28,43 @@
|
||||
<el-button @click="reset()"> 重置 </el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="tabBox">
|
||||
<el-table
|
||||
v-if="refreshTable"
|
||||
:data="tableData"
|
||||
border
|
||||
v-loading="loading"
|
||||
ref="dataTreeList"
|
||||
row-key="id"
|
||||
:tree-props="{ children: 'sysMenuList', hasChildren: true }"
|
||||
style="width: 100%"
|
||||
:height="tableHeight"
|
||||
:key="keyCount"
|
||||
>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="menuName"
|
||||
show-overflow-tooltip
|
||||
width="200px"
|
||||
label="菜单名称"
|
||||
>
|
||||
<el-table v-if="refreshTable" :data="tableData" border v-loading="loading" ref="dataTreeList" row-key="id"
|
||||
:tree-props="{ children: 'sysMenuList', hasChildren: true }" style="width: 100%" :height="tableHeight"
|
||||
:key="keyCount">
|
||||
<el-table-column sortable prop="menuName" show-overflow-tooltip width="200px" label="菜单名称">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="menuCode"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="150px"
|
||||
label="菜单编码"
|
||||
>
|
||||
<el-table-column sortable prop="menuCode" show-overflow-tooltip align="center" width="150px" label="菜单编码">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="orderNo"
|
||||
label="排序"
|
||||
width="140px"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="menuUrl"
|
||||
show-overflow-tooltip
|
||||
label="菜单地址"
|
||||
align="center"
|
||||
width="140px"
|
||||
>
|
||||
<el-table-column sortable prop="orderNo" label="排序" width="140px"></el-table-column>
|
||||
<el-table-column sortable prop="menuUrl" show-overflow-tooltip label="菜单地址" align="center" width="140px">
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="menuType"
|
||||
label="类型"
|
||||
align="center"
|
||||
width="140px"
|
||||
>
|
||||
<el-table-column sortable prop="menuType" label="类型" align="center" width="140px">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.menuType === 1" size="small">菜单组</el-tag>
|
||||
<el-tag v-else-if="row.menuType === 2" type="success" size="small"
|
||||
>菜单</el-tag
|
||||
>
|
||||
<el-tag v-else-if="row.menuType === 3" type="success" size="small"
|
||||
>页面</el-tag
|
||||
>
|
||||
<el-tag v-else-if="row.menuType === 4" type="success" size="small"
|
||||
>资源</el-tag
|
||||
>
|
||||
<el-tag v-else-if="row.menuType === 2" type="success" size="small">菜单</el-tag>
|
||||
<el-tag v-else-if="row.menuType === 3" type="success" size="small">页面</el-tag>
|
||||
<el-tag v-else-if="row.menuType === 4" type="success" size="small">资源</el-tag>
|
||||
<el-tag v-else type="info" size="small">未知</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="showMode"
|
||||
label="可见"
|
||||
align="center"
|
||||
width="140px"
|
||||
>
|
||||
<el-table-column sortable prop="showMode" label="可见" align="center" width="140px">
|
||||
<template #default="{ row }">
|
||||
<el-tag v-if="row.showMode === 1" type="success" size="small"
|
||||
>展示</el-tag
|
||||
>
|
||||
<el-tag v-else-if="row.showMode === 2" type="info" size="small"
|
||||
>不展示</el-tag
|
||||
>
|
||||
<el-tag v-if="row.showMode === 1" type="success" size="small">展示</el-tag>
|
||||
<el-tag v-else-if="row.showMode === 2" type="info" size="small">不展示</el-tag>
|
||||
<el-tag v-else type="warning">未知</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="bz"
|
||||
show-overflow-tooltip
|
||||
label="备注"
|
||||
></el-table-column>
|
||||
<el-table-column
|
||||
sortable
|
||||
prop="qxbs"
|
||||
label="权限标识"
|
||||
show-overflow-tooltip
|
||||
align="center"
|
||||
width="140px"
|
||||
></el-table-column>
|
||||
<el-table-column sortable prop="bz" show-overflow-tooltip label="备注"></el-table-column>
|
||||
<el-table-column sortable prop="qxbs" label="权限标识" show-overflow-tooltip align="center"
|
||||
width="140px"></el-table-column>
|
||||
<el-table-column label="操作" align="center" fixed="right" width="220">
|
||||
<template #default="{ row }">
|
||||
<el-button @click="update(row)" size="small">编辑</el-button>
|
||||
<el-button @click="addItemMenu(row)" size="small"
|
||||
>添加下级</el-button
|
||||
>
|
||||
<el-popconfirm
|
||||
confirm-button-text="是"
|
||||
cancel-button-text="否"
|
||||
icon-color="red"
|
||||
title="确定要删除?"
|
||||
@confirm="delDictItem(row)"
|
||||
>
|
||||
<el-button @click="addItemMenu(row)" size="small">添加下级</el-button>
|
||||
<el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
|
||||
@confirm="delDictItem(row)">
|
||||
<template #reference>
|
||||
<el-button type="danger" size="small">删除</el-button>
|
||||
</template>
|
||||
@ -142,16 +73,9 @@
|
||||
</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.page"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:page-size="listQuery.size"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="total"
|
||||
></el-pagination>
|
||||
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page="listQuery.page" :page-sizes="[10, 20, 50, 100]" :page-size="listQuery.size"
|
||||
layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="dialogFormVisible" class="dialog">
|
||||
@ -159,82 +83,32 @@
|
||||
<span class="title">{{ isEdit ? "修改" : "新增" }}</span>
|
||||
<div>
|
||||
<!-- 修改 -->
|
||||
<el-button
|
||||
v-if="isEdit"
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="onSave"
|
||||
:loading="buttonLoading"
|
||||
>保存</el-button
|
||||
>
|
||||
<el-button v-if="isEdit" type="primary" size="small" @click="onSave" :loading="buttonLoading">保存</el-button>
|
||||
<!-- 新增 -->
|
||||
<el-button
|
||||
v-else
|
||||
type="primary"
|
||||
size="small"
|
||||
@click="onAdd"
|
||||
:loading="buttonLoading"
|
||||
>保存</el-button
|
||||
>
|
||||
<el-button v-else type="primary" size="small" @click="onAdd" :loading="buttonLoading">保存</el-button>
|
||||
<el-button size="small" @click="closeDialog">关闭</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-form
|
||||
class="mosty-from-wrap"
|
||||
:inline="true"
|
||||
label-position="top"
|
||||
ref="editRef"
|
||||
:rules="rules"
|
||||
:model="dialogForm"
|
||||
>
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="菜单名称"
|
||||
prop="menuName"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-input
|
||||
v-model="dialogForm.menuName"
|
||||
show-word-limit
|
||||
maxlength="30"
|
||||
autocomplete="off"
|
||||
></el-input>
|
||||
<el-form class="mosty-from-wrap" :inline="true" label-position="top" ref="editRef" :rules="rules"
|
||||
:model="dialogForm">
|
||||
<el-form-item class="one" label="菜单名称" prop="menuName" label-width="140px">
|
||||
<el-input v-model="dialogForm.menuName" show-word-limit maxlength="30" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="菜单编码" label-width="140px">
|
||||
<el-input v-model="dialogForm.menuCode" show-word-limit maxlength="50" autocomplete="off"></el-input>
|
||||
</el-form-item> -->
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="菜单地址"
|
||||
prop="menuUrl"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-input
|
||||
v-model="dialogForm.menuUrl"
|
||||
show-word-limit
|
||||
maxlength="50"
|
||||
autocomplete="off"
|
||||
></el-input>
|
||||
<el-form-item class="one" label="菜单地址" prop="menuUrl" label-width="140px">
|
||||
<el-input v-model="dialogForm.menuUrl" show-word-limit maxlength="50" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="是否展示"
|
||||
prop="showMode"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-form-item class="one" label="是否展示" prop="showMode" label-width="140px">
|
||||
<el-radio-group v-model="dialogForm.showMode">
|
||||
<el-radio :label="1">展示</el-radio>
|
||||
<el-radio :label="2">不展示</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="菜单类型"
|
||||
prop="menuType"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-form-item class="one" label="菜单类型" prop="menuType" label-width="140px">
|
||||
<el-radio-group :disabled="isEdit" v-model="dialogForm.menuType">
|
||||
<el-radio :label="1">菜单组</el-radio>
|
||||
<el-radio :label="2">菜单</el-radio>
|
||||
@ -242,59 +116,19 @@
|
||||
<el-radio :label="4">资源</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="one"
|
||||
v-if="dialogForm.menuType == 4"
|
||||
prop="buttonResource"
|
||||
label="按钮标识"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-input
|
||||
v-model="dialogForm.buttonResource"
|
||||
autocomplete="off"
|
||||
></el-input>
|
||||
<el-form-item class="one" v-if="dialogForm.menuType == 4" prop="buttonResource" label="按钮标识"
|
||||
label-width="140px">
|
||||
<el-input v-model="dialogForm.buttonResource" autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="菜单编码"
|
||||
prop="menuCode"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-input
|
||||
v-model="dialogForm.menuCode"
|
||||
show-word-limit
|
||||
maxlength="50"
|
||||
placeholder="权限标识对应路由name"
|
||||
autocomplete="off"
|
||||
></el-input>
|
||||
<el-form-item class="one" label="菜单编码" prop="menuCode" label-width="140px">
|
||||
<el-input v-model="dialogForm.menuCode" show-word-limit maxlength="50" placeholder="权限标识对应路由name"
|
||||
autocomplete="off"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="选择图标"
|
||||
prop="iconName"
|
||||
label-width="140px"
|
||||
>
|
||||
<ChooseIcon
|
||||
width="400"
|
||||
:limit="13"
|
||||
:isImg="false"
|
||||
clearable=""
|
||||
v-model="dialogForm.iconName"
|
||||
></ChooseIcon>
|
||||
<el-form-item class="one" label="选择图标" prop="iconName" label-width="140px">
|
||||
<ChooseIcon width="400" :limit="13" :isImg="false" clearable="" v-model="dialogForm.iconName"></ChooseIcon>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
class="one"
|
||||
label="排序"
|
||||
prop="orderNo"
|
||||
label-width="140px"
|
||||
>
|
||||
<el-input-number
|
||||
v-model="dialogForm.orderNo"
|
||||
class="mx-4"
|
||||
:min="1"
|
||||
:max="100"
|
||||
controls-position="right"
|
||||
/>
|
||||
<el-form-item class="one" label="排序" prop="orderNo" label-width="140px">
|
||||
<el-input-number v-model="dialogForm.orderNo" class="mx-4" :min="1" :max="100" controls-position="right" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="状态" label-width="140px">
|
||||
<el-select v-model="dialogForm.zdywlb" placeholder="请选择业务类别">
|
||||
@ -303,13 +137,8 @@
|
||||
</el-select>
|
||||
</el-form-item>-->
|
||||
<el-form-item class="one" label="备注" label-width="140px">
|
||||
<el-input
|
||||
v-model="dialogForm.bz"
|
||||
:autosize="{ minRows: 2, maxRows: 4 }"
|
||||
type="textarea"
|
||||
show-word-limit
|
||||
maxlength="200"
|
||||
></el-input>
|
||||
<el-input v-model="dialogForm.bz" :autosize="{ minRows: 2, maxRows: 4 }" type="textarea" show-word-limit
|
||||
maxlength="200"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
@ -319,6 +148,7 @@
|
||||
<script setup>
|
||||
import ChooseIcon from "@/components/MyComponents/ChooseIcon";
|
||||
import { ElMessage } from "element-plus";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
@ -349,6 +179,15 @@ const rules = ref({
|
||||
iconName: [{ required: true, message: " 请选择图标" }],
|
||||
orderNo: [{ required: true, message: "请填写排序号 " }]
|
||||
});
|
||||
const searchConfiger = ref([
|
||||
{
|
||||
label: "菜单名称",
|
||||
prop: "menuName",
|
||||
placeholder: "请输入菜单名称",
|
||||
showType: "input"
|
||||
},
|
||||
]);
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
//查询参数
|
||||
@ -359,7 +198,7 @@ const listQuery = ref({
|
||||
dictCode: "",
|
||||
xtZxbz: "",
|
||||
current: 1,
|
||||
size:20
|
||||
size: 20
|
||||
});
|
||||
const buttonLoading = ref(false);
|
||||
const topParentId = ref("");
|
||||
@ -376,7 +215,7 @@ const dialogFormVisible = ref(false);
|
||||
const formLabelWidth = "140px";
|
||||
// 获取数据的方法
|
||||
const getListData = async () => {
|
||||
const params = listQuery.value;
|
||||
const params = {...listQuery.value,ssxt:'sgxt'};
|
||||
loading.value = true
|
||||
const res = await getSystemMeny(params);
|
||||
tableData.value = res?.records;
|
||||
@ -384,7 +223,8 @@ const getListData = async () => {
|
||||
loading.value = false
|
||||
};
|
||||
const editRef = ref(null);
|
||||
const handleFilter = () => {
|
||||
const onSearch = (val) => {
|
||||
listQuery.value.menuName = val.menuName;
|
||||
listQuery.value.current = 1;
|
||||
getListData();
|
||||
};
|
||||
@ -443,13 +283,14 @@ const onSave = () => {
|
||||
if (valid) {
|
||||
buttonLoading.value = true;
|
||||
updateSysMenu({
|
||||
...dialogForm.value
|
||||
...dialogForm.value,
|
||||
ssxt:'sgxt'
|
||||
})
|
||||
.then((res) => {
|
||||
dialogFormVisible.value = false;
|
||||
ElMessage.success("修改成功");
|
||||
getListData();
|
||||
buttonLoading.value = false;
|
||||
handleFilter();
|
||||
})
|
||||
.finally(() => {
|
||||
buttonLoading.value = false;
|
||||
@ -467,12 +308,13 @@ const onAdd = () => {
|
||||
buttonLoading.value = true;
|
||||
addSysMenu({
|
||||
...dialogForm.value,
|
||||
parentId: id.value
|
||||
parentId: id.value,
|
||||
ssxt:'sgxt'
|
||||
})
|
||||
.then((res) => {
|
||||
dialogFormVisible.value = false;
|
||||
ElMessage.success("新增成功");
|
||||
handleFilter();
|
||||
getListData();
|
||||
})
|
||||
.finally(() => {
|
||||
buttonLoading.value = false;
|
||||
@ -522,6 +364,7 @@ onUnmounted(() => {
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/assets/css/layout.scss";
|
||||
@import "~@/assets/css/element-plus.scss";
|
||||
|
||||
.user-manage-container {
|
||||
.table-header-wrap {
|
||||
margin-bottom: 22px;
|
||||
@ -541,7 +384,8 @@ onUnmounted(() => {
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
::v-deep .el-loading-mask{
|
||||
background:rgba(0,0,0,.5)
|
||||
|
||||
::v-deep .el-loading-mask {
|
||||
background: rgba(0, 0, 0, .5)
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -17,8 +17,8 @@
|
||||
default-expand-all
|
||||
:check-strictly="true"
|
||||
@check="checkeTree"
|
||||
>
|
||||
</el-tree>
|
||||
/>
|
||||
|
||||
</div>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
@ -69,7 +69,7 @@ const onComfirm = () => {
|
||||
//所有权限
|
||||
const allPermission = ref([]);
|
||||
const getPermissionList = async () => {
|
||||
const res = await getMenuTree();
|
||||
const res = await getMenuTree({ssxt:'sgxt'});
|
||||
allPermission.value = res;
|
||||
};
|
||||
getPermissionList();
|
||||
|
||||
@ -56,6 +56,8 @@ const init = (type, row) => {
|
||||
} else {
|
||||
disabled.value = false;
|
||||
}
|
||||
} else {
|
||||
disabled.value = false;
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
@ -2,18 +2,14 @@
|
||||
<div>
|
||||
<!-- 搜索 -->
|
||||
<div ref="searchBox" class="mt10">
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch" />
|
||||
</div>
|
||||
<PageTitle :malginLeft="10" :height="35" backgroundColor="#ffff" :marginBottom="5" :marginTop="5">
|
||||
<template #left>
|
||||
<Search :searchArr="searchConfiger" @submit="onSearch">
|
||||
<el-button type="primary" size="small" @click="handleAdd('add', null)">添加值班</el-button>
|
||||
<el-button type="danger" size="small" @click="handleRow()">批量删除</el-button>
|
||||
</template>
|
||||
</PageTitle>
|
||||
</Search>
|
||||
</div>
|
||||
<!-- 按钮组 -->
|
||||
<div class="content">
|
||||
<!-- 表格 -->
|
||||
<div class="tabBox">
|
||||
<div class="margTop">
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||
@chooseData="handleChooseData">
|
||||
@ -29,12 +25,10 @@
|
||||
total: pageData.total
|
||||
}"></Pages>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AddForm ref="addForm" @getList="getList" />
|
||||
</template>
|
||||
<script setup>
|
||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
@ -149,7 +143,7 @@ addForm.value.init(type, row);
|
||||
|
||||
// 表格高度计算
|
||||
const tabHeightFn = () => {
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 270;
|
||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 220;
|
||||
window.onresize = function () {
|
||||
tabHeightFn();
|
||||
};
|
||||
|
||||
@ -42,12 +42,13 @@ const checkData = reactive({
|
||||
hasChoose: ["一级", "二级", "三级", "四级"]
|
||||
});
|
||||
const checkDatas = reactive({
|
||||
list: ['七类重点人','布控','无人机'],
|
||||
hasChoose: ['七类重点人']
|
||||
// list: ['七类重点人','布控','无人机'],
|
||||
list: ['身份预警','行为预警','组合预警'],
|
||||
hasChoose: ['身份预警','行为预警','组合预警']
|
||||
});
|
||||
const total = ref(0);
|
||||
const yjJb = ref(['01', '02', '03', '04']);
|
||||
const yjLx = ref(['01']);
|
||||
const yjLx = ref(['21','22','23']);
|
||||
const pageNum = ref(1);
|
||||
const loading = ref(false); // 加载中
|
||||
const personList = ref([]);
|
||||
@ -89,13 +90,19 @@ function changeDatas(val) {
|
||||
checkDatas.hasChoose = val;
|
||||
let ids = [];
|
||||
val.forEach(it => {
|
||||
if (it == '七类重点人') ids.push('01');
|
||||
if (it == '布控') ids.push('02');
|
||||
if (it == '无人机') ids.push('03');
|
||||
// if (it == '七类重点人') ids.push('01');
|
||||
// if (it == '布控') ids.push('02');
|
||||
// if (it == '无人机') ids.push('03');
|
||||
if (it == '身份预警') ids.push('21');
|
||||
if (it == '行为预警') ids.push('22');
|
||||
if (it == '组合预警') ids.push('23');
|
||||
});
|
||||
yjLx.value = ids
|
||||
if (val.length == 0) personList.value = [];
|
||||
else getList();
|
||||
if (val.length == 0) {
|
||||
personList.value = [];
|
||||
} else {
|
||||
getList();
|
||||
}
|
||||
}
|
||||
const isExpanded = ref(false); // 控制展开/收缩状态
|
||||
|
||||
@ -152,22 +159,26 @@ onUnmounted(() => {
|
||||
|
||||
// 触底加载
|
||||
const loadList = () => {
|
||||
if (personList.value.length == total.value) return;
|
||||
// 防止重复加载和无更多数据时的加载
|
||||
if (loading.value || personList.value.length == total.value) return;
|
||||
pageNum.value++;
|
||||
getList()
|
||||
console.log(pageNum.value,"触底");
|
||||
getList(true) // 传递true表示触底加载，不显示loading
|
||||
}
|
||||
const ORDIMG = 'https://89.40.7.122:38496/image'
|
||||
const IMGYM = 'https://sg.lz.dsj.xz/dhimage'
|
||||
|
||||
const getList = (type) => {
|
||||
let data = { pageSize: 30, pageCurrent: pageNum.value, yjjbList: yjJb.value, lylxList: yjLx.value };
|
||||
console.log(pageNum.value);
|
||||
|
||||
let data = { pageSize: 30, pageCurrent: pageNum.value, yjjbList: yjJb.value, yjLylxList: yjLx.value?.length ? yjLx.value : ['21','22','23'] };
|
||||
loading.value = !type ? true : false;
|
||||
getPageAllList(data).then(res => {
|
||||
loading.value = false;
|
||||
let arr = res.records.map(item => {
|
||||
return {
|
||||
...item,
|
||||
yjtp:item.yjlx=='01'? item.yjtp.replace(ORDIMG, IMGYM) : item.yjtp
|
||||
// yjtp:item.yjlx=='01'? item.yjtp.replace(ORDIMG, IMGYM) : item.yjtp
|
||||
}
|
||||
}) || [];
|
||||
personList.value = pageNum.value == 1 ? arr : personList.value.concat(arr);
|
||||
@ -200,7 +211,6 @@ const chooseItem = (item) => {
|
||||
case '01':
|
||||
tbYjxxGetInfo(item.id).then(res => {
|
||||
console.log(res);
|
||||
|
||||
content.value = {
|
||||
id: item.id,
|
||||
ryxm: res.yjRyxm || '',
|
||||
@ -241,7 +251,6 @@ const chooseItem = (item) => {
|
||||
})
|
||||
break;
|
||||
case '03':
|
||||
|
||||
yjzxyjzxSfyjSelectList(item.id).then(res => {
|
||||
content.value = {
|
||||
id: item.id,
|
||||
|
||||
@ -17,18 +17,44 @@
|
||||
<GdMap :mapid="'map-99'"></GdMap>
|
||||
<div class="button-container">
|
||||
<template v-for="(value, index) in butList" :key="index">
|
||||
<el-popover v-if="value.label === '警情' && value.onChage" placement="top" :width="200" trigger="hover">
|
||||
<el-popover v-if="value.label === '警情' && value.onChage" placement="top" :width="480" trigger="click"
|
||||
@show="changeBut(value)">
|
||||
<template #reference>
|
||||
<div class="but" :class="{ 'butOk': value.onChage }" @click="changeBut(value)">
|
||||
<!-- -->
|
||||
<div class="but" :class="{ 'butOk': value.onChage }">
|
||||
{{ value.label }}
|
||||
</div>
|
||||
</template>
|
||||
<div class="jqdj-popover">
|
||||
<el-checkbox-group v-model="jqdjdmFilter" @change="handleJqdjFilterChange">
|
||||
<el-checkbox v-for="item in D_BZ_JQDJ" :key="item.dm" :label="item.dm">
|
||||
{{ item.zdmc }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<div class="filter-item">
|
||||
<span class="filter-label">等级：</span>
|
||||
<el-checkbox-group v-model="jqdjdmFilter" @change="handleJqdjFilterChange" class="checkbox-group">
|
||||
<el-checkbox v-for="item in D_BZ_JQDJ" :key="item.dm" :label="item.dm" class="checkbox-item">
|
||||
{{ item.zdmc }}
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</div>
|
||||
<div class="filter-item">
|
||||
<span class="filter-label">时间：</span>
|
||||
<el-date-picker style="width: 100%;" v-model="timeRange" type="datetimerange" start-placeholder="开始时间" end-placeholder="结束时间"
|
||||
format="YYYY-MM-DD HH:mm:ss" @change="handleTimeRangeChange" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-popover>
|
||||
<el-popover v-else-if="value.label === '事件' && value.onChage" placement="top" :width="480" trigger="click"
|
||||
@show="changeBut(value)">
|
||||
<template #reference>
|
||||
<div class="but" :class="{ 'butOk': value.onChage }">
|
||||
{{ value.label }}
|
||||
</div>
|
||||
</template>
|
||||
<div class="jqdj-popover">
|
||||
<div class="filter-item">
|
||||
<span class="filter-label">时间：</span>
|
||||
<el-date-picker v-model="sjTimeRange" type="datetimerange" style="width: 100%;" start-placeholder="开始时间" end-placeholder="结束时间"
|
||||
format="YYYY-MM-DD HH:mm:ss" @change="getTimeRange" />
|
||||
</div>
|
||||
</div>
|
||||
</el-popover>
|
||||
<div v-else class="but" :class="{ 'butOk': value.onChage }" @click="changeBut(value)">
|
||||
@ -63,7 +89,6 @@
|
||||
</div>
|
||||
<div class="dataList" v-infinite-scroll="loadMore" infinite-scroll-disabled="loading"
|
||||
infinite-scroll-distance="10">
|
||||
|
||||
<template v-if="changeState">
|
||||
<div class="item" v-for="(item, index) in jqList" :key="index" @click="clickJq(item)">
|
||||
<div class="data-title">接警单：{{ item.jjdbh }}</div>
|
||||
@ -143,14 +168,48 @@ const jqdjdmFilter = ref([])
|
||||
const handleJqdjFilterChange = () => {
|
||||
getLzJcjPjdb()
|
||||
}
|
||||
// 获取当天的开始和结束时间
|
||||
const getCurrentMonthRange = () => {
|
||||
const now = new Date();
|
||||
const year = now.getFullYear();
|
||||
const month = now.getMonth();
|
||||
const day = now.getDate();
|
||||
|
||||
// 当天零点
|
||||
const start = new Date(year, month, day, 0, 0, 0);
|
||||
// 当天23:59:59
|
||||
const end = new Date(year, month, day, 23, 59, 59);
|
||||
|
||||
return [start, end];
|
||||
};
|
||||
|
||||
const timeRange = ref(getCurrentMonthRange())
|
||||
const sjTimeRange = ref()
|
||||
const handleTimeRangeChange = () => {
|
||||
getLzJcjPjdb()
|
||||
}
|
||||
const getTimeRange = () => {
|
||||
getZdsj()
|
||||
};
|
||||
// 底部按钮
|
||||
const changeBut = (row) => {
|
||||
|
||||
if (row.label == '清除') {
|
||||
emitter.emit('deletePointArea', 'sj_flash')
|
||||
emitter.emit('deletePointArea', 'jq_flash')
|
||||
emitter.emit('deletePointArea', 'jq')
|
||||
emitter.emit('deletePointArea', 'sj')
|
||||
return
|
||||
}
|
||||
|
||||
// 警情按钮点击时不改变onChage状态，因为它需要显示popover
|
||||
if (row.label == '警情') {
|
||||
// 只执行获取警情数据的操作，不改变状态
|
||||
getLzJcjPjdb()
|
||||
return
|
||||
}
|
||||
if (row.label == '事件') {
|
||||
getZdsj()
|
||||
return
|
||||
}
|
||||
let index = butList.value.findIndex(item => item.label == row.label)
|
||||
@ -170,12 +229,28 @@ const changeBut = (row) => {
|
||||
}
|
||||
}
|
||||
}
|
||||
// 格式化日期为YYYY-MM-DD HH:mm:ss格式
|
||||
const formatDate = (date) => {
|
||||
if (!date) return '';
|
||||
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
const hours = String(date.getHours()).padStart(2, '0');
|
||||
const minutes = String(date.getMinutes()).padStart(2, '0');
|
||||
const seconds = String(date.getSeconds()).padStart(2, '0');
|
||||
|
||||
return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
||||
};
|
||||
|
||||
// 获取所有的一级警情
|
||||
const getLzJcjPjdb = () => {
|
||||
const jqdjdmStr = jqdjdmFilter.value.length > 0 ? jqdjdmFilter.value.join(',') : ''
|
||||
emitter.emit("deletePointArea", "jq")
|
||||
qcckGet({
|
||||
jqdjdm: jqdjdmStr
|
||||
jqdjdm: jqdjdmStr,
|
||||
startTime: timeRange.value ? formatDate(timeRange.value[0]) : '',
|
||||
endTime: timeRange.value ? formatDate(timeRange.value[1]) : '',
|
||||
}, "/mosty-gsxt/lzJcjPjdb/selectList").then(res => {
|
||||
let list = res.filter(item => item.fxdwjd && item.fxdwjd).map(item => {
|
||||
return {
|
||||
@ -194,7 +269,10 @@ const loading = ref(false)
|
||||
const changeState = ref(true)// 点击切换
|
||||
// 获取所有的重点事件
|
||||
const getZdsj = () => {
|
||||
qcckGet({}, "/mosty-gsxt/zdsj/selectList").then(res => {
|
||||
qcckGet({
|
||||
startTime: sjTimeRange.value ? sjTimeRange.value[0] : '',
|
||||
endTime: sjTimeRange.value ? sjTimeRange.value[1] : '',
|
||||
}, "/mosty-gsxt/zdsj/selectList").then(res => {
|
||||
let list = res.filter(item => item.jd && item.wd).map(item => {
|
||||
return {
|
||||
...item,
|
||||
@ -596,15 +674,40 @@ const coordStringHandler = (res) => {
|
||||
}
|
||||
|
||||
.jqdj-popover {
|
||||
:deep(.el-checkbox-group) {
|
||||
padding: 10px;
|
||||
|
||||
.filter-item {
|
||||
margin-bottom: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
flex-wrap: nowrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.filter-label {
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.checkbox-group {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
gap: 15px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
:deep(.el-checkbox) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
:deep(.el-checkbox__label) {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
:deep(.el-date-editor) {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.display-flex {
|
||||
|
||||
Reference in New Issue
Block a user