lcw
This commit is contained in:
@ -433,6 +433,13 @@ export const BpcryselectCrewList = (params) => {
|
||||
params
|
||||
});
|
||||
};
|
||||
export const BpcrygetRypcList = (data) => {
|
||||
return request({
|
||||
url: api + `/tbJczBpcry/getRypcList`,
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
};
|
||||
// 车
|
||||
export const BpcryselectCarList = (params) => {
|
||||
return request({
|
||||
|
||||
@ -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>
|
||||
@ -71,18 +71,11 @@ const props = defineProps({
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
minZoom: {
|
||||
type: Number,
|
||||
default: 7
|
||||
},
|
||||
maxZoom: {
|
||||
type: Number,
|
||||
default: 18
|
||||
},
|
||||
|
||||
});
|
||||
try {
|
||||
const userInfo = getItem("deptId")[0].deptCode;
|
||||
} catch (error) { }
|
||||
} catch (error) {}
|
||||
let map;
|
||||
let mapLayer;
|
||||
let mapLayer1;
|
||||
@ -96,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: props.minZoom,
|
||||
maxZoom: props.maxZoom,
|
||||
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(); //初始化加载绘制工具
|
||||
|
||||
// 设置地图中心点及图层
|
||||
@ -267,6 +289,7 @@ const mapSetLayer = (id, source) => {
|
||||
|
||||
//获取地图绘制的数据
|
||||
const resFun = (coord, type, flag, data) => {
|
||||
|
||||
emitter.emit("coordString", {
|
||||
coord: coord,
|
||||
type: type,
|
||||
@ -280,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) {
|
||||
@ -309,6 +338,7 @@ onUnmounted(() => {
|
||||
emitter.off("diffusionCircle");
|
||||
emitter.off("SsCircle");
|
||||
emitter.off("ClearssCircle");
|
||||
emitter.off("map-resize");
|
||||
});
|
||||
</script>
|
||||
|
||||
@ -331,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;
|
||||
}
|
||||
@ -103,11 +103,8 @@ const JczMsg = ref({})
|
||||
const getJczselectById = () => {
|
||||
const id = router.query.id
|
||||
JczselectById({ id: id }).then((res) => {
|
||||
console.log(res);
|
||||
|
||||
JczMsg.value = res
|
||||
}).catch((err) => {
|
||||
|
||||
});
|
||||
}
|
||||
onMounted(() => {
|
||||
|
||||
@ -1,39 +1,41 @@
|
||||
<template>
|
||||
<div class="image-carousel">
|
||||
<div class="flex full-height" v-if="JczMsg.jczlx=='01'">
|
||||
<div class="flex full-height" v-if="JczMsg.jczlx == '01'">
|
||||
<div class="column-container">
|
||||
<div class="gradient-title">过站人员</div>
|
||||
<div class="search-container">
|
||||
<el-input v-model="timeData.ryXm" placeholder="请输入姓名" class="search-input" clearable />
|
||||
<el-date-picker v-model="timeData.time" type="daterange" unlink-panels range-separator="至"
|
||||
start-placeholder="开始时间" end-placeholder="结束时间" :shortcuts="shortcuts" :size="size" />
|
||||
<el-button type="primary" class="search-button">搜索</el-button>
|
||||
<el-input v-model="gzrParams.xm" placeholder="请输入姓名" class="search-input" clearable />
|
||||
<el-date-picker v-model="gzrParams.startTime" type="daterange" unlink-panels range-separator="至"
|
||||
start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD hh:mm:ss"
|
||||
value-format="YYYY-MM-DD hh:mm:ss" />
|
||||
<el-button type="primary" class="search-button" @click="getPageR">搜索</el-button>
|
||||
</div>
|
||||
<div class="waning-cards noScollLine">
|
||||
<div class="warning-card" v-for="(item, index) in 20" :key="index">
|
||||
<div class="waning-cards noScollLine" v-infinite-scroll="gzrgd">
|
||||
<div class="warning-card" v-for="(item, index) in gzrParams.dataList" :key="index">
|
||||
<div class="warning-image">
|
||||
<img :src="require('@/assets/images/default_male.png')" alt="抓拍图片" />
|
||||
<img :src="item.cjzp ? item.cjzp : default_male" alt="抓拍图片" />
|
||||
</div>
|
||||
<div class="warning-info">
|
||||
<div class="info-item">
|
||||
<span class="label">姓名：</span>
|
||||
<span>老王</span>
|
||||
<span class="tag">老王预警</span>
|
||||
<span>{{ item.xm }}</span>
|
||||
<!-- <span class="tag">老王预警</span> -->
|
||||
</div>
|
||||
<div class="info-item align-center">
|
||||
<span class="label">性别：男</span>
|
||||
<span class="label">过站类型：</span>
|
||||
<span class="highlight">{{ item.gzlx == '01' ? '进站' : '出站' }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">相似度：</span>
|
||||
<span class="highlight">95%</span>
|
||||
<span class="label">身份证号：</span>
|
||||
<span class="highlight">{{ item.zjhm }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">抓拍时间：</span>
|
||||
<span>2025-10-10 10:00:00</span>
|
||||
<span>{{ item.gzsj }}</span>
|
||||
</div>
|
||||
<div class="info-item align-center">
|
||||
<span class="label nowrap">抓拍地址：</span>
|
||||
<span class="one_text_detail">上海市普陀区金沙江路 1518 弄</span>
|
||||
<span class="one_text_detail">{{ item.kkMc }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -42,36 +44,34 @@
|
||||
<div class="column-container">
|
||||
<div class="gradient-title">过站车辆</div>
|
||||
<div class="search-container">
|
||||
<el-input v-model="clData.cph" placeholder="请输入车牌号" class="search-input" clearable />
|
||||
<el-date-picker v-model="clData.time" type="daterange" unlink-panels range-separator="至"
|
||||
start-placeholder="开始时间" end-placeholder="结束时间" :shortcuts="shortcuts" :size="size" />
|
||||
<el-button type="primary" class="search-button">搜索</el-button>
|
||||
<el-input v-model="gzcParams.cph" placeholder="请输入车牌号" class="search-input" clearable />
|
||||
<el-date-picker v-model="gzcParams.startTime" type="daterange" unlink-panels range-separator="至"
|
||||
start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD hh:mm:ss"
|
||||
value-format="YYYY-MM-DD hh:mm:ss" />
|
||||
<el-button type="primary" class="search-button" @click="getPage">搜索</el-button>
|
||||
</div>
|
||||
<div class="waning-cards noScollLine" >
|
||||
<div class="warning-card" v-for="(item, index) in pageData.tableData" :key="index">
|
||||
<div class="waning-cards noScollLine" v-infinite-scroll="gzcgd">
|
||||
<div class="warning-card" v-for="(item, index) in gzcParams.dataList" :key="index">
|
||||
<div class="warning-image">
|
||||
<img :src="require('@/assets/images/car.png')" alt="抓拍图片" />
|
||||
<img :src="item.gczp ? item.gczp : car" alt="抓拍图片" />
|
||||
</div>
|
||||
<div class="warning-info">
|
||||
<div class="info-item">
|
||||
<span class="label">车牌号：</span>
|
||||
<span>{{ item.cph }}</span>
|
||||
<span class="tag">{{ item.bq }} </span>
|
||||
<span>{{ item.hphm }}</span>
|
||||
<!-- <span class="tag">{{ item.bq }} </span> -->
|
||||
</div>
|
||||
<!-- <div class="info-item flex">
|
||||
<span class="label">性别：男</span>
|
||||
</div> -->
|
||||
<div class="info-item">
|
||||
<span class="label">相似度：</span>
|
||||
<span class="highlight">{{ item.xsd }}</span>
|
||||
<span class="label">车辆种类：</span>
|
||||
<span class="highlight">{{ item.zwppmc }}</span>
|
||||
</div>
|
||||
<div class="info-item">
|
||||
<span class="label">抓拍时间：</span>
|
||||
<span>{{ item.time }}</span>
|
||||
<span>{{ item.gzsj }}</span>
|
||||
</div>
|
||||
<div class="info-item align-center">
|
||||
<span class="label nowrap">抓拍地址：</span>
|
||||
<span class="one_text_detail">{{ item.fx }}{{ item.dz }}</span>
|
||||
<span class="one_text_detail">{{ item.kkMc }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -82,19 +82,24 @@
|
||||
<div>
|
||||
<div>
|
||||
<div style="display: flex;align-items: center;padding: 10px 0;">
|
||||
<el-input v-model="timeData.ryXm" placeholder="请输入车牌号" style="width: 30%;margin-right: 10px;" clearable />
|
||||
<el-date-picker v-model="timeData.time" type="daterange" range-separator="至" start-placeholder="开始时间"
|
||||
end-placeholder="结束时间" style="width: 30%;;margin-right: 10px;" :size="size" />
|
||||
<el-button type="primary">搜索</el-button>
|
||||
<el-input v-model="promesData.hphm" placeholder="请输入车牌号" style="width: 30%;margin-right: 10px;" clearable />
|
||||
<el-date-picker v-model="promesData.startTime" type="daterange" range-separator="至" start-placeholder="开始时间"
|
||||
end-placeholder="结束时间" style="width: 30%;;margin-right: 10px;" format="YYYY-MM-DD hh:mm:ss"
|
||||
value-format="YYYY-MM-DD hh:mm:ss" />
|
||||
<el-button type="primary" @click="search">搜索</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" tableHeight="35vh"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<template #tp="{ row }">
|
||||
<el-image :src="row.tp" :preview-src-list="[row.tp]" alt="车辆类型" style="width: 80px; height: 100px;"/>
|
||||
|
||||
<template #gczp="{ row }">
|
||||
<el-image :src="row.gczp ? row.gczp : car" :preview-src-list="[row.gczp]" alt="车辆类型"
|
||||
style="width: 80px; height: 100px;" />
|
||||
</template>
|
||||
<template #gzlx="{ row }">
|
||||
<span>
|
||||
{{ row.gzlx == '01' ? '入林' : '出林' }}
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="primary" @click="addEdit('edit', row)">修改</el-link>
|
||||
@ -112,10 +117,12 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive } from 'vue'
|
||||
import { ref, reactive, onMounted, watch } from 'vue'
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
const props=defineProps({
|
||||
import { qcckGet } from "@/api/qcckApi.js";
|
||||
import { useRoute } from 'vue-router'
|
||||
const props = defineProps({
|
||||
JczMsg: {
|
||||
type: Object,
|
||||
default: () => ({})
|
||||
@ -125,42 +132,9 @@ const timeData = ref({
|
||||
ryXm: '',
|
||||
time: []
|
||||
})
|
||||
const clData = ref({
|
||||
cph: '',
|
||||
time: []
|
||||
})
|
||||
|
||||
const pageData = reactive({
|
||||
tableData: [{
|
||||
tp: require("@/assets/images/cstp.png"),
|
||||
cph: "豫DGL808",
|
||||
time: "2025-11-02 09:18:00",
|
||||
fx: "入林方向",
|
||||
dz: "德吉路与光彩路入口处",
|
||||
bm: "54040251001325030171",
|
||||
cllx: "小型车辆",
|
||||
bq: "前科人员车",
|
||||
xsd: "80%",
|
||||
}, {
|
||||
tp: require("@/assets/images/cstp.png"),
|
||||
cph: "豫DGL808",
|
||||
time: "2025-11-02 15:18:00",
|
||||
fx: "出林方向",
|
||||
dz: "德吉路与光彩路出口处",
|
||||
bm: "54040251001325030172",
|
||||
cllx: "小型车辆",
|
||||
bq: "前科人员车",
|
||||
xsd: "90%",
|
||||
}, {
|
||||
tp: require("@/assets/images/cstp.png"),
|
||||
cph: "豫DGL808",
|
||||
time: "2025-11-02 21:18:00",
|
||||
fx: "入林方向",
|
||||
dz: "德吉路与光彩路入口处",
|
||||
bm: "54040251001325030171",
|
||||
cllx: "小型车辆",
|
||||
bq: "前科人员车",
|
||||
xsd: "95%",
|
||||
}], //表格数据
|
||||
tableData: [], //表格数据
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
@ -175,19 +149,154 @@ const pageData = reactive({
|
||||
}, //分页
|
||||
controlsWidth: 250, //操作栏宽度
|
||||
tableColumn: [
|
||||
{ label: "过车图片", prop: "tp", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "车牌号", prop: "cph", showOverflowTooltip: true },
|
||||
{ label: "过车时间", prop: "time", showOverflowTooltip: true },
|
||||
{ label: "卡口方向", prop: "fx", showOverflowTooltip: true },
|
||||
{ label: "车辆种类", prop: "cllx", showOverflowTooltip: true },
|
||||
{ label: "摄像头编码", prop: "bm", showOverflowTooltip: true },
|
||||
{ label: "抓拍摄像头", prop: "dz", showOverflowTooltip: true, },
|
||||
{ label: "过车图片", prop: "gczp", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "车牌号", prop: "hphm", showOverflowTooltip: true },
|
||||
{ label: "过车时间", prop: "gzsj", showOverflowTooltip: true },
|
||||
{ label: "卡口方向", prop: "gzlx", showOverflowTooltip: true, showSolt: true },
|
||||
{ label: "车辆种类", prop: "zwppmc", showOverflowTooltip: true },
|
||||
{ label: "摄像头编码", prop: "tdbm", showOverflowTooltip: true },
|
||||
{ label: "抓拍摄像头", prop: "tdmc", showOverflowTooltip: true, },
|
||||
{ label: "标签", prop: "bq", showOverflowTooltip: true }
|
||||
]
|
||||
})
|
||||
|
||||
const default_male = ref(require('@/assets/images/default_male.png'))
|
||||
const car = ref(require('@/assets/images/car.png'))
|
||||
|
||||
|
||||
|
||||
const route = useRoute()
|
||||
const jczid = ref()
|
||||
onMounted(() => {
|
||||
jczid.value = route.query.id
|
||||
})
|
||||
|
||||
|
||||
watch(() => props.JczMsg, (newVal, oldVal) => {
|
||||
if (newVal) {
|
||||
console.log(newVal);
|
||||
if (newVal.jczlx == '02') {
|
||||
getJczGzclSelectPage()
|
||||
} else {
|
||||
getJczclSelectPage()
|
||||
getJczrlSelectPage()
|
||||
}
|
||||
|
||||
}
|
||||
}, { deep: true })
|
||||
const promesData = ref({
|
||||
pageSize: 20,
|
||||
pageCurrent: 1,
|
||||
kkId: jczid.value,
|
||||
})
|
||||
const search = () => {
|
||||
promesData.value.pageCurrent = 1
|
||||
getJczGzclSelectPage()
|
||||
}
|
||||
|
||||
|
||||
const getJczGzclSelectPage = () => {
|
||||
const params = {
|
||||
...promesData.value,
|
||||
startTime: promesData.value.startTime ? promesData.value.startTime[0] : "",
|
||||
endTime: promesData.value.startTime ? promesData.value.startTime[1] : ''
|
||||
}
|
||||
qcckGet(params, "/mosty-jcz/jczGzcl/selectPage").then((res) => {
|
||||
pageData.tableData = res.records
|
||||
pageData.total = res.total
|
||||
console.log(res);
|
||||
}).catch((err) => {
|
||||
|
||||
});
|
||||
}
|
||||
const changeNo = (val) => {
|
||||
promesData.value.currentPage = val
|
||||
getJczGzclSelectPage()
|
||||
}
|
||||
const changeSize = (val) => {
|
||||
promesData.value.pageSize = val
|
||||
getJczGzclSelectPage()
|
||||
}
|
||||
|
||||
|
||||
const gzcParams = ref({
|
||||
dataList: [],
|
||||
pageSize: 20,
|
||||
kkId: jczid.value,
|
||||
pageCurrent: 1,
|
||||
startTime: '',
|
||||
hphm: "",
|
||||
total:0
|
||||
})
|
||||
|
||||
// 过站车
|
||||
const getJczclSelectPage = () => {
|
||||
const params = {
|
||||
hphm: gzcParams.value.hphm,
|
||||
kkId: gzcParams.value.kkId,
|
||||
pageCurrent: gzcParams.value.pageCurrent,
|
||||
pageSize: gzcParams.value.pageSize,
|
||||
startTime: promesData.value.startTime ? promesData.value.startTime[0] : "",
|
||||
endTime: promesData.value.startTime ? promesData.value.startTime[1] : ''
|
||||
}
|
||||
qcckGet(params, "/mosty-jcz/jczGzcl/selectPage").then((res) => {
|
||||
gzcParams.value.dataList = gzcParams.value.pageCurrent == 1 ? res.records : gzcParams.value.dataList.concat(res.records)
|
||||
gzcParams.value.total = res.total
|
||||
}).catch((err) => {
|
||||
});
|
||||
}
|
||||
|
||||
const getPage = () => {
|
||||
gzcParams.value.pageCurrent = 1
|
||||
getJczclSelectPage()
|
||||
}
|
||||
const gzcgd = () => {
|
||||
if (gzcParams.value.dataList.length == gzcParams.value.total) {
|
||||
return
|
||||
}
|
||||
gzcParams.value.pageCurrent++
|
||||
getJczclSelectPage()
|
||||
}
|
||||
|
||||
// 过站人
|
||||
const gzrParams = ref({
|
||||
dataList: [],
|
||||
pageSize: 20,
|
||||
kkId: jczid.value,
|
||||
pageCurrent: 1,
|
||||
startTime: '',
|
||||
xm: "",
|
||||
total:0
|
||||
})
|
||||
|
||||
|
||||
const getJczrlSelectPage = () => {
|
||||
const params = {
|
||||
xm: gzrParams.value.xm,
|
||||
kkId: gzrParams.value.kkId,
|
||||
pageCurrent: gzrParams.value.pageCurrent,
|
||||
pageSize: gzrParams.value.pageSize,
|
||||
startTime: gzrParams.value.startTime ? gzrParams.value.startTime[0] : "",
|
||||
endTime: gzrParams.value.startTime ? gzrParams.value.startTime[1] : ''
|
||||
}
|
||||
qcckGet(params, "/mosty-jcz/jczGzry/selectPage").then((res) => {
|
||||
gzrParams.value.dataList = gzrParams.value.pageCurrent == 1 ? res.records : gzrParams.value.dataList.concat(res.records)
|
||||
gzrParams.value.total = res.total
|
||||
}).catch((err) => {
|
||||
|
||||
});
|
||||
}
|
||||
const getPageR = () => {
|
||||
gzrParams.value.pageCurrent = 1
|
||||
getJczrlSelectPage()
|
||||
}
|
||||
const gzrgd = () => {
|
||||
if (gzrParams.value.dataList.length == gzrParams.value.total) {
|
||||
return
|
||||
}
|
||||
gzrParams.value.pageCurrent++
|
||||
getJczrlSelectPage()
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -502,42 +611,55 @@ const pageData = reactive({
|
||||
background-color: #273467d9;
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .el-table{
|
||||
|
||||
::v-deep .el-table {
|
||||
border: none !important;
|
||||
background-color: transparent !important;
|
||||
--el-table-border-color: transparent !important;
|
||||
--el-table-border-color: transparent !important;
|
||||
}
|
||||
::v-deep .el-table tr{
|
||||
|
||||
::v-deep .el-table tr {
|
||||
background-color: #072b56bf !important;
|
||||
}
|
||||
|
||||
::v-deep .el-table th.el-table__cell {
|
||||
background-color: #273467d9;
|
||||
color: #fff;
|
||||
}
|
||||
::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{
|
||||
|
||||
::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
|
||||
background-color: #094c9dbf !important;
|
||||
}
|
||||
::v-deep .el-table .el-table__cell{
|
||||
z-index:0 !important;
|
||||
position:static;
|
||||
|
||||
::v-deep .el-table .el-table__cell {
|
||||
z-index: 0 !important;
|
||||
position: static;
|
||||
}
|
||||
::v-deep .el-table td.el-table__cell{
|
||||
|
||||
::v-deep .el-table td.el-table__cell {
|
||||
|
||||
color: #fff !important;
|
||||
}
|
||||
::v-deep .el-table--border .el-table__cell{
|
||||
|
||||
::v-deep .el-table--border .el-table__cell {
|
||||
border-color: #3b3b3bbf !important;
|
||||
}
|
||||
::v-deep .el-pagination__total{
|
||||
|
||||
::v-deep .el-pagination__total {
|
||||
color: #fff !important;
|
||||
}
|
||||
::v-deep .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev:disabled{
|
||||
background-color: #212c59;
|
||||
|
||||
::v-deep .el-pagination.is-background .btn-next:disabled,
|
||||
.el-pagination.is-background .btn-prev:disabled {
|
||||
background-color: #212c59;
|
||||
}
|
||||
::v-deep .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev:disabled{
|
||||
|
||||
::v-deep .el-pagination.is-background .btn-next:disabled,
|
||||
.el-pagination.is-background .btn-prev:disabled {
|
||||
background-color: #212c59 !important;
|
||||
}
|
||||
::v-deep .el-date-editor .el-range-separator{
|
||||
|
||||
::v-deep .el-date-editor .el-range-separator {
|
||||
color: #fff !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -74,7 +74,7 @@ const queryCondition = ref({});
|
||||
const getjczgetXfllList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
const promes = { ...queryCondition.value, ...pageData.pageConfiger };
|
||||
qcckGet(promes,"/mosty-jcz/tbJczBpcCount/getRcwTj")
|
||||
qcckGet({xtly:'jcz'},"/mosty-jcz/tbJczBpcCount/getRcwTj")
|
||||
.then((res) => {
|
||||
pageData.tableData = [res];
|
||||
})
|
||||
|
||||
@ -56,7 +56,7 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import EditAddForm from "./components/editAddForm.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { BpcryselectCrewList } from "@/api/mosty-jcz.js";
|
||||
import { BpcryselectCrewList,BpcrygetRypcList } from "@/api/mosty-jcz.js";
|
||||
import { reactive, ref, onMounted, getCurrentInstance, watch } from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||
@ -120,8 +120,8 @@ const queryCondition = ref({});
|
||||
// 获取数据
|
||||
const getjczgetXfllList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
const promes = { ...queryCondition.value, ...pageData.pageConfiger };
|
||||
BpcryselectCrewList(promes)
|
||||
const promes = { ...queryCondition.value, ...pageData.pageConfiger,xtly:'jcz' };
|
||||
BpcrygetRypcList(promes)
|
||||
.then((res) => {
|
||||
pageData.tableData = res.records;
|
||||
pageData.total = res.total;
|
||||
|
||||
@ -53,7 +53,7 @@ import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import Pages from "@/components/aboutTable/Pages.vue";
|
||||
import EditAddForm from "./components/editAddForm.vue";
|
||||
import Search from "@/components/aboutTable/Search.vue";
|
||||
import { BpcryselectCrewList } from "@/api/mosty-jcz.js";
|
||||
import { BpcryselectCarList } from "@/api/mosty-jcz.js";
|
||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||
const { proxy } = getCurrentInstance();
|
||||
const urlImg = "/mosty-api/mosty-base/minio/image/download/";
|
||||
@ -114,8 +114,8 @@ const queryCondition = ref({});
|
||||
// 获取数据
|
||||
const getjczgetXfllList = () => {
|
||||
pageData.tableConfiger.loading = true;
|
||||
const promes = { ...queryCondition.value, ...pageData.pageConfiger };
|
||||
BpcryselectCrewList(promes)
|
||||
const promes = { ...queryCondition.value, ...pageData.pageConfiger,xtly:'jcz' };
|
||||
BpcryselectCarList(promes)
|
||||
.then((res) => {
|
||||
pageData.tableData = res.records;
|
||||
pageData.total = res.total;
|
||||
|
||||
Reference in New Issue
Block a user