lcw
This commit is contained in:
@ -28,7 +28,6 @@
|
|||||||
"el-table-infinite-scroll": "^3.0.6",
|
"el-table-infinite-scroll": "^3.0.6",
|
||||||
"element-plus": "2.0.2",
|
"element-plus": "2.0.2",
|
||||||
"file-saver": "^2.0.5",
|
"file-saver": "^2.0.5",
|
||||||
"fzui-fengqun-vue": "^1.0.1",
|
|
||||||
"gifler": "^0.1.0",
|
"gifler": "^0.1.0",
|
||||||
"image-compressor.js": "^1.1.4",
|
"image-compressor.js": "^1.1.4",
|
||||||
"lodash": "^4.17.21",
|
"lodash": "^4.17.21",
|
||||||
|
381
src/components/GdMap/indexww.vue
Normal file
381
src/components/GdMap/indexww.vue
Normal file
@ -0,0 +1,381 @@
|
|||||||
|
<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-carousel type="card" height="75px" :autoplay="false" indicator-position="none" :initial-index="3" @change="onMapImageChange">
|
||||||
|
<el-carousel-item>
|
||||||
|
<div class="mapImageItem">
|
||||||
|
<img :src="require('@/assets/images/slt.jpg')" alt="" />
|
||||||
|
<div>栅格浅色</div>
|
||||||
|
</div>
|
||||||
|
</el-carousel-item>
|
||||||
|
<el-carousel-item>
|
||||||
|
<div class="mapImageItem">
|
||||||
|
<img :src="require('@/assets/images/yxt.jpg')" alt="" />
|
||||||
|
<div>影像图</div>
|
||||||
|
</div>
|
||||||
|
</el-carousel-item>
|
||||||
|
<el-carousel-item>
|
||||||
|
<div class="mapImageItem">
|
||||||
|
<img :src="require('@/assets/images/yst.jpg')" alt="" />
|
||||||
|
<div>栅格深色</div>
|
||||||
|
</div>
|
||||||
|
</el-carousel-item>
|
||||||
|
<el-carousel-item>
|
||||||
|
<div class="mapImageItem">
|
||||||
|
<img :src="require('@/assets/images/shy.png')" alt="" />
|
||||||
|
<div>三合一</div>
|
||||||
|
</div>
|
||||||
|
</el-carousel-item>
|
||||||
|
</el-carousel> -->
|
||||||
|
<!-- 地图缩放 -->
|
||||||
|
<div class="zoomTargetBox">
|
||||||
|
<el-input-number :min="7" :max="18" v-model="zoomTarget" :step="1" step-strictly @change="handleZoom">
|
||||||
|
</el-input-number>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, onMounted, onUnmounted, defineProps, nextTick } from "vue";
|
||||||
|
import { MapUtil } from "./mapUtil";
|
||||||
|
import emitter from "@/utils/eventBus.js";
|
||||||
|
import { getItem } from "@/utils/storage";
|
||||||
|
const conditionRoute = ref(true); //路况
|
||||||
|
const mMap = ref(null); //地图对象
|
||||||
|
const mapUtil = ref(null); //地图工具对象
|
||||||
|
const zoomTarget = ref(6);
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
mapid: {
|
||||||
|
type: String,
|
||||||
|
default: "mapDiv"
|
||||||
|
},
|
||||||
|
//是否显示可以切换地图底图
|
||||||
|
isShow: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
//是否显示实时路况
|
||||||
|
isShowMvt: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
//是否显示地图层级
|
||||||
|
isShowZoom: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
//是否显示绘制控件
|
||||||
|
isShowDraw: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
});
|
||||||
|
try {
|
||||||
|
const userInfo = getItem("deptId")[0].deptCode;
|
||||||
|
} catch (error) {}
|
||||||
|
let map;
|
||||||
|
let mapLayer;
|
||||||
|
let mapLayer1;
|
||||||
|
onMounted(() => {
|
||||||
|
emitter.on("followUp", (res) => {
|
||||||
|
let box = document.getElementsByClassName("changeMap_box");
|
||||||
|
if (!box) return;
|
||||||
|
box[0].style.right = !res ? "4px" : "398px";
|
||||||
|
box[0].style.transition = "0.5s";
|
||||||
|
});
|
||||||
|
|
||||||
|
map = new EliMap({
|
||||||
|
id: props.mapid,
|
||||||
|
crs: "EPSG:3857",
|
||||||
|
style: {
|
||||||
|
glyphs: "./fonts/{fontstack}/{range}.pbf",
|
||||||
|
center: [94.36,29.65],
|
||||||
|
zoom: 10
|
||||||
|
},
|
||||||
|
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}',
|
||||||
|
})
|
||||||
|
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(); //初始化加载绘制工具
|
||||||
|
|
||||||
|
// 设置地图中心点及图层
|
||||||
|
emitter.on("setMapCenter", (res) => {
|
||||||
|
mapUtil.value.setMapCenter(res.location, res.zoomLevel);
|
||||||
|
});
|
||||||
|
|
||||||
|
emitter.on("removePlot", (flag) => {
|
||||||
|
mapUtil.value.removePlot(flag);
|
||||||
|
});
|
||||||
|
emitter.on("removeAll", (flag) => {
|
||||||
|
mapUtil.value.removeAll(flag);
|
||||||
|
});
|
||||||
|
// 撒点
|
||||||
|
emitter.on("addPointArea", (obj) => {
|
||||||
|
mapUtil.value.makerSki(obj);
|
||||||
|
});
|
||||||
|
// 鼠标滑过提示文字的点位
|
||||||
|
emitter.on("showPoint", (obj) => {
|
||||||
|
mapUtil.value.showPoint(obj);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 清除覆盖物
|
||||||
|
emitter.on("deletePointArea", (res) => {
|
||||||
|
mapUtil.value.removeElement(res);
|
||||||
|
});
|
||||||
|
// 清除某个覆盖物的单个
|
||||||
|
emitter.on("deletePointAreaOne", (obj) => {
|
||||||
|
mapUtil.value.removeElementOne(obj.flag, obj.id);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 清除某个覆盖物的单个
|
||||||
|
emitter.on("showSquire", (obj) => {
|
||||||
|
mapUtil.value.zdySquire(obj);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 绘制图形 - 回显区域
|
||||||
|
emitter.on("drawShape", (res) => {
|
||||||
|
mapUtil.value.plot(res, resFun);
|
||||||
|
});
|
||||||
|
emitter.on("removeEara", (flag) => {
|
||||||
|
mapUtil.value.removeEara(flag);
|
||||||
|
});
|
||||||
|
// 回显图形
|
||||||
|
emitter.on("echoPlane", (res) => {
|
||||||
|
mapUtil.value.echoPlane(res);
|
||||||
|
});
|
||||||
|
//移除绘制区域
|
||||||
|
emitter.on("removeEara", (flag) => {
|
||||||
|
mapUtil.value.removeEara(flag);
|
||||||
|
});
|
||||||
|
// 回显线
|
||||||
|
emitter.on("echoLine", (res) => {
|
||||||
|
mapUtil.value.createLine(res, res.flag);
|
||||||
|
});
|
||||||
|
//创建边界面(geojson)
|
||||||
|
emitter.on("setBoundarys", (res) => {
|
||||||
|
mapUtil.value.createBoundarys(res);
|
||||||
|
});
|
||||||
|
// 移除边界
|
||||||
|
emitter.on("removeBj", (res) => {
|
||||||
|
mapUtil.value.removeBj(res);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 轨迹回放
|
||||||
|
emitter.on("drawLineAnimation", (res) => {
|
||||||
|
mapUtil.value.displayLineAnimation(res);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 聚合撒点
|
||||||
|
emitter.on("addPoint", (obj) => {
|
||||||
|
mapUtil.value.aggregateScatteringPoint(obj);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 热力图显示
|
||||||
|
emitter.on("thermodynamicChart", (res) => {
|
||||||
|
mapUtil.value.showHeatDrawing(res);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 扩散圆
|
||||||
|
emitter.on("diffusionCircle", (res) => {
|
||||||
|
mapUtil.value.diffusionCircle(res);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 展示盘曲
|
||||||
|
emitter.on("showGapText", (obj) => {
|
||||||
|
mapUtil.value.gapText(obj);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 获取当前地图中心点
|
||||||
|
emitter.on("getCurrentCenter", (res) => {
|
||||||
|
let centerPoint = map.mapboxGLMap.getCenter();
|
||||||
|
let coords = [centerPoint.lng, centerPoint.lat];
|
||||||
|
emitter.emit("getcentercoord", coords);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
//切换地图底图
|
||||||
|
const onMapImageChange = (val) => {
|
||||||
|
//清除已经存在胡地图图层
|
||||||
|
if (map.mapboxGLMap.getLayer("SGQS_ID"))
|
||||||
|
map.mapboxGLMap.removeLayer("SGQS_ID");
|
||||||
|
if (map.mapboxGLMap.getLayer("YX_ID")) map.mapboxGLMap.removeLayer("YX_ID");
|
||||||
|
if (map.mapboxGLMap.getLayer("SGSG_ID"))
|
||||||
|
map.mapboxGLMap.removeLayer("SGSG_ID");
|
||||||
|
if (map.mapboxGLMap.getLayer("TDT_TITLE_ID"))
|
||||||
|
map.mapboxGLMap.removeLayer("TDT_TITLE_ID");
|
||||||
|
if (map.mapboxGLMap.getLayer("TDT_ROAD_ID"))
|
||||||
|
map.mapboxGLMap.removeLayer("TDT_ROAD_ID");
|
||||||
|
if (map.mapboxGLMap.getLayer("TDT_POI_ID"))
|
||||||
|
map.mapboxGLMap.removeLayer("TDT_POI_ID");
|
||||||
|
//设置图层
|
||||||
|
switch (val) {
|
||||||
|
case 0:
|
||||||
|
mapSetLayer("SGQS_ID", "SGQS");
|
||||||
|
break;
|
||||||
|
case 1:
|
||||||
|
mapSetLayer("YX_ID", "YX");
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
mapSetLayer("SGSG_ID", "SGSG");
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
mapSetLayer("TDT_TITLE_ID", "TDT_TITLE_SOURCES");
|
||||||
|
mapSetLayer("TDT_ROAD_ID", "TDT_ROAD_SOURCES");
|
||||||
|
mapSetLayer("TDT_POI_ID", "TDT_POI_SOURCES");
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
if (map.mapboxGLMap.getLayer("realTimeTrafficlevelOne"))
|
||||||
|
map.mapboxGLMap.moveLayer("realTimeTrafficlevelOne");
|
||||||
|
if (map.mapboxGLMap.getLayer("map_id")) map.mapboxGLMap.moveLayer("map_id");
|
||||||
|
if (map.mapboxGLMap.getLayer("map_ids")) map.mapboxGLMap.moveLayer("map_ids");
|
||||||
|
};
|
||||||
|
|
||||||
|
//设置图层函数
|
||||||
|
const mapSetLayer = (id, source) => {
|
||||||
|
map.mapboxGLMap.addLayer({ id, type: "raster", source });
|
||||||
|
};
|
||||||
|
|
||||||
|
//获取地图绘制的数据
|
||||||
|
const resFun = (coord, type, flag, data) => {
|
||||||
|
|
||||||
|
emitter.emit("coordString", {
|
||||||
|
coord: coord,
|
||||||
|
type: type,
|
||||||
|
flag: flag,
|
||||||
|
data: data
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 地图层级
|
||||||
|
const handleZoom = (val) => {
|
||||||
|
map.mapboxGLMap.setZoom(val);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 是否打开或者关闭路况
|
||||||
|
const handleSwitch = (val) => {
|
||||||
|
if (val) {
|
||||||
|
// 打开
|
||||||
|
} else {
|
||||||
|
// 关闭
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
onUnmounted(() => {
|
||||||
|
emitter.off("removePlot");
|
||||||
|
emitter.off("setMapCenter");
|
||||||
|
emitter.off("addPointArea");
|
||||||
|
emitter.off("showPoint");
|
||||||
|
emitter.off("deletePointArea");
|
||||||
|
emitter.off("deletePointAreaOne");
|
||||||
|
emitter.off("drawShape");
|
||||||
|
emitter.off("echoPlane");
|
||||||
|
emitter.off("removeEara");
|
||||||
|
emitter.off("echoLine");
|
||||||
|
emitter.off("addPoint");
|
||||||
|
emitter.off("thermodynamicChart");
|
||||||
|
emitter.off("drawLineAnimation");
|
||||||
|
emitter.off("aggregateScatteringPoint");
|
||||||
|
emitter.off("hotmap");
|
||||||
|
emitter.off("setBoundarys");
|
||||||
|
emitter.off("diffusionCircle");
|
||||||
|
emitter.off("SsCircle");
|
||||||
|
emitter.off("ClearssCircle");
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.map {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: aliceblue;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.changeMap_box {
|
||||||
|
position: absolute;
|
||||||
|
right: 398px;
|
||||||
|
bottom: 4px;
|
||||||
|
z-index: 9;
|
||||||
|
.mapImageItem {
|
||||||
|
border: 1px solid #08aae8;
|
||||||
|
background: rgb(9, 26, 70);
|
||||||
|
& > img {
|
||||||
|
width: 100%;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
& > 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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -13,14 +13,8 @@
|
|||||||
<div v-if="props.isImg">
|
<div v-if="props.isImg">
|
||||||
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
|
||||||
<span class="el-upload-list__item-actions">
|
<span class="el-upload-list__item-actions">
|
||||||
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)"><el-icon> <zoom-in /></el-icon></span>
|
||||||
<el-icon> <zoom-in /></el-icon>
|
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)"><el-icon><Delete /></el-icon></span>
|
||||||
</span>
|
|
||||||
<span v-if="!disabled" class="el-upload-list__item-delete" @click="handleRemove(file, fileList)">
|
|
||||||
<el-icon>
|
|
||||||
<Delete />
|
|
||||||
</el-icon>
|
|
||||||
</span>
|
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
@ -86,9 +80,7 @@ const actionUrl = computed(() => {
|
|||||||
if (props.isAll) {
|
if (props.isAll) {
|
||||||
return "/mosty-api/mosty-base/minio/image/upload/id";
|
return "/mosty-api/mosty-base/minio/image/upload/id";
|
||||||
} else {
|
} else {
|
||||||
return props.isImg
|
return props.isImg ? "/mosty-api/mosty-base/minio/image/upload/id": "/mosty-api/mosty-base/minio/file/upload";
|
||||||
? "/mosty-api/mosty-base/minio/image/upload/id"
|
|
||||||
: "/mosty-api/mosty-base/minio/file/upload";
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -190,7 +182,6 @@ watch(
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
fileList.value = arr.map((el) => {
|
fileList.value = arr.map((el) => {
|
||||||
if (Object.prototype.toString.call(el) === "[object Object]") {
|
if (Object.prototype.toString.call(el) === "[object Object]") {
|
||||||
|
@ -8,7 +8,8 @@
|
|||||||
</el-button>
|
</el-button>
|
||||||
</template>
|
</template>
|
||||||
<div class="flex just-center">
|
<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>
|
<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>
|
</div>
|
||||||
</el-popover>
|
</el-popover>
|
||||||
<el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
|
<el-popover placement="bottom" :visible="visiblefp" :width="400" trigger="click">
|
||||||
@ -40,16 +41,9 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 表格 -->
|
<!-- 表格 -->
|
||||||
<div class="tabBox">
|
<div class="tabBox">
|
||||||
<MyTable
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
:tableData="pageData.tableData"
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth"
|
||||||
:tableColumn="pageData.tableColumn"
|
@chooseData="chooseData" fixed="right">
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
fixed="right"
|
|
||||||
>
|
|
||||||
<template #qtLb="{ row }">
|
<template #qtLb="{ row }">
|
||||||
<DictTag :tag="false" :value="row.qtLb" :options="D_GS_ZDQT_LB" />
|
<DictTag :tag="false" :value="row.qtLb" :options="D_GS_ZDQT_LB" />
|
||||||
</template>
|
</template>
|
||||||
@ -58,7 +52,8 @@
|
|||||||
</template>
|
</template>
|
||||||
<template #bqList="{ row }">
|
<template #bqList="{ row }">
|
||||||
<ul>
|
<ul>
|
||||||
<li class="one_text_detail marks mb4" :key="index" v-for="(item, index) in row.bqList">{{ item.bqMc }}({{ item.bqFz || 0 }} 分) </li>
|
<li class="one_text_detail marks mb4" :key="index" v-for="(item, index) in row.bqList">{{ item.bqMc }}({{
|
||||||
|
item.bqFz || 0 }} 分) </li>
|
||||||
</ul>
|
</ul>
|
||||||
</template>
|
</template>
|
||||||
<template #zdryList="{ row }">
|
<template #zdryList="{ row }">
|
||||||
@ -82,10 +77,12 @@
|
|||||||
}"></Pages>
|
}"></Pages>
|
||||||
</div>
|
</div>
|
||||||
<!-- 编辑 - 新增-->
|
<!-- 编辑 - 新增-->
|
||||||
<EditForm v-if="show" @updateDate="getList" ref="editFormDiloag" :dic="{D_BZ_XB,D_GS_ZDQT_LB,D_GS_ZDQT_FXDJ,D_GS_ZDR_CZZT}" />
|
<EditForm v-if="show" @updateDate="getList" ref="editFormDiloag"
|
||||||
|
:dic="{ D_BZ_XB, D_GS_ZDQT_LB, D_GS_ZDQT_FXDJ, D_GS_ZDR_CZZT }" />
|
||||||
<!-- 选择用户 -->
|
<!-- 选择用户 -->
|
||||||
<ChooseUser v-model="chooseUserVisible" @choosedUsers="handleUserSelected" :roleIds="roleIds" /> <!-- 转线索 -->
|
<ChooseUser v-model="chooseUserVisible" @choosedUsers="handleUserSelected" :roleIds="roleIds" /> <!-- 转线索 -->
|
||||||
<ZxsForm v-if="showzxs" ref="zxsDilof" @change="getList" :dic="{ D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX }"></ZxsForm>
|
<ZxsForm v-if="showzxs" ref="zxsDilof" @change="getList"
|
||||||
|
:dic="{ D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX }"></ZxsForm>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -341,5 +338,4 @@ defineExpose({});
|
|||||||
.el-loading-mask {
|
.el-loading-mask {
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
@ -7,13 +7,10 @@
|
|||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="width: 50%;"><PieChart :chartData="ywlbtj" title="业务类型"/></div>
|
<div style="width: 50%;"><PieChart :chartData="ywlbtj" title="业务类型"/></div>
|
||||||
<div style="width: 50%;"><BarChart :chartData="gkjbtj" title="管控级别分布"/></div>
|
<div style="width: 50%;"><BarChart :chartData="gkjbtj" title="管控级别分布"/></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="width: 50%;"><PieChart :chartData="qytj" title="区域分布"/></div>
|
<div style="width: 50%;"><PieChart :chartData="qytj" title="区域分布"/></div>
|
||||||
<div style="width: 50%;"><BarChart :chartData="zyfbtj" title="管控级别分布"/></div>
|
<div style="width: 50%;"><BarChart :chartData="zyfbtj" title="管控级别分布"/></div>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex;">
|
<div style="display: flex;">
|
||||||
<div style="width: 50%;"><LineChart :chartData="nlfbtj" title="年龄分布"/></div>
|
<div style="width: 50%;"><LineChart :chartData="nlfbtj" title="年龄分布"/></div>
|
||||||
|
@ -35,30 +35,27 @@
|
|||||||
<div ref="searchBox">
|
<div ref="searchBox">
|
||||||
<el-form :model="searchList" ref="searchFormRef" :inline="true">
|
<el-form :model="searchList" ref="searchFormRef" :inline="true">
|
||||||
<el-form-item label="类型">
|
<el-form-item label="类型">
|
||||||
<el-cascader @change="changeCascader" :disabled="readonly_lx" v-model="searchList.lx" clearable :options="cascaderList" :props="{ checkStrictly: true }" placeholder="请选择类型"/>
|
<el-cascader ref="cascaRef" @change="changeCascader" :disabled="readonly_lx" v-model="searchList.lx" clearable
|
||||||
|
:options="cascaderList" :props="{ checkStrictly: true,multiple: true }" placeholder="请选择类型" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="人员">
|
<el-form-item label="人员">
|
||||||
<el-input @change="changeRy" v-model="searchList.ry" :disabled="readonly_ry" clearable placeholder="请输入姓名或身份证"></el-input>
|
<el-input @change="changeRy" v-model="searchList.ry" :disabled="readonly_ry" clearable
|
||||||
|
placeholder="请输入姓名或身份证"></el-input>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="地点">
|
<el-form-item label="地点">
|
||||||
<div class="flex align-center">
|
<div class="flex align-center">
|
||||||
<el-select v-model="searchList.dd" @change="changeBm" style="width: 180px;" :disabled="readonly_dd" placeholder="行政区划">
|
<el-select v-model="searchList.dd" @change="changeBm" style="width: 180px;" :disabled="readonly_dd"
|
||||||
|
placeholder="行政区划">
|
||||||
<el-option label="区域" value="1"></el-option>
|
<el-option label="区域" value="1"></el-option>
|
||||||
<el-option label="部门" value="2"></el-option>
|
<el-option label="部门" value="2"></el-option>
|
||||||
</el-select>
|
</el-select>
|
||||||
<el-input @change="changeRy" :disabled="readonly_dd" v-model="searchList.xxdz" clearable placeholder="请输入详细地址"></el-input>
|
<el-input @change="changeRy" :disabled="readonly_dd" v-model="searchList.xxdz" clearable
|
||||||
|
placeholder="请输入详细地址"></el-input>
|
||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="时间">
|
<el-form-item label="时间">
|
||||||
<el-date-picker
|
<el-date-picker v-model="searchList.datetimes" type="datetimerange" unlink-panels :range-separator="'至'"
|
||||||
v-model="searchList.datetimes"
|
start-placeholder="开始日期时间" end-placeholder="结束日期时间" value-format="YYYY-MM-DD HH:mm:ss" />
|
||||||
type="datetimerange"
|
|
||||||
unlink-panels
|
|
||||||
:range-separator="'至'"
|
|
||||||
start-placeholder="开始日期时间"
|
|
||||||
end-placeholder="结束日期时间"
|
|
||||||
value-format="YYYY-MM-DD HH:mm:ss"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" @click="onSearch">查询</el-button>
|
<el-button type="primary" @click="onSearch">查询</el-button>
|
||||||
@ -70,16 +67,9 @@
|
|||||||
<li class="list-item" ref="listBoxRef" v-for="(it, idx) in list" :key="idx">
|
<li class="list-item" ref="listBoxRef" v-for="(it, idx) in list" :key="idx">
|
||||||
<div class="comm-title title-s">{{ it.title }}</div>
|
<div class="comm-title title-s">{{ it.title }}</div>
|
||||||
<div class="list-table">
|
<div class="list-table">
|
||||||
<MyTable
|
<MyTable :tableData="it.tableList" :tableColumn="it.tableColumn" :key="idx + '' + it.keyCount" :fixed="false"
|
||||||
:tableData="it.tableList"
|
:tableHeight="pageData.tableHeight" :tabelModel="it.title" :tableConfiger="pageData.tableConfiger"
|
||||||
:tableColumn="it.tableColumn"
|
:controlsWidth="pageData.controlsWidth">
|
||||||
:key="idx+''+it.keyCount"
|
|
||||||
:fixed="false"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:tabelModel="it.title"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
>
|
|
||||||
<template #jqlbdm="{ row }">
|
<template #jqlbdm="{ row }">
|
||||||
<DictTag :tag="false" :value="row.jqlbdm" :options="JQLB" />
|
<DictTag :tag="false" :value="row.jqlbdm" :options="JQLB" />
|
||||||
</template>
|
</template>
|
||||||
@ -87,12 +77,8 @@
|
|||||||
<el-link type="primary" size="small" @click="handleHs(row)">网上会商</el-link>
|
<el-link type="primary" size="small" @click="handleHs(row)">网上会商</el-link>
|
||||||
</template>
|
</template>
|
||||||
</MyTable>
|
</MyTable>
|
||||||
<Pages
|
<Pages @changeNo="changeNo($event, it.title)" @changeSize="changeSize($event, it.title)"
|
||||||
@changeNo="changeNo($event,it.title)"
|
:tableHeight="pageData.tableHeight" :pageConfiger="{ ...it.pageConfiger }"></Pages>
|
||||||
@changeSize="changeSize($event,it.title)"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{ ...it.pageConfiger }"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
@ -122,7 +108,7 @@ const { JQLB} = proxy.$dict("JQLB"); //获取字典数据
|
|||||||
const readonly_lx = ref(false)
|
const readonly_lx = ref(false)
|
||||||
const readonly_ry = ref(false)
|
const readonly_ry = ref(false)
|
||||||
const readonly_dd = ref(false)
|
const readonly_dd = ref(false)
|
||||||
|
const cascaRef=ref()
|
||||||
const showModel = ref(false);
|
const showModel = ref(false);
|
||||||
const detaileRef = ref();
|
const detaileRef = ref();
|
||||||
const searchBox = ref();
|
const searchBox = ref();
|
||||||
@ -150,11 +136,13 @@ const obj = reactive({
|
|||||||
const searchList = ref({})
|
const searchList = ref({})
|
||||||
let cascaderList = ref([
|
let cascaderList = ref([
|
||||||
{ value: '01', label: '网络舆情', leaf: true },
|
{ value: '01', label: '网络舆情', leaf: true },
|
||||||
{ value: '02', label: '警情',children:[
|
{
|
||||||
|
value: '02', label: '警情', children: [
|
||||||
{ value: '021', label: '治安警情', leaf: true },
|
{ value: '021', label: '治安警情', leaf: true },
|
||||||
{ value: '022', label: '刑事警情', leaf: true },
|
{ value: '022', label: '刑事警情', leaf: true },
|
||||||
{ value: '023', label: '交通警情', leaf: true },
|
{ value: '023', label: '交通警情', leaf: true },
|
||||||
] },
|
]
|
||||||
|
},
|
||||||
{ value: '03', label: '案件', leaf: true },
|
{ value: '03', label: '案件', leaf: true },
|
||||||
{ value: '04', label: '风险隐患', leaf: true },
|
{ value: '04', label: '风险隐患', leaf: true },
|
||||||
])
|
])
|
||||||
@ -240,7 +228,16 @@ const pageData = reactive({
|
|||||||
},
|
},
|
||||||
controlsWidth: 120, //操作栏宽度
|
controlsWidth: 120, //操作栏宽度
|
||||||
});
|
});
|
||||||
|
watch(() => JQLB.value, (val) => {
|
||||||
|
if (val) {
|
||||||
|
cascaderList.value[1].children = val.map((el) => {
|
||||||
|
return { value: el.dm, label: el.zdmc, leaf: true }
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
deep: true, immediate: true
|
||||||
|
})
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
// getCount(); //获取统计数据
|
// getCount(); //获取统计数据
|
||||||
tabHeightFn()
|
tabHeightFn()
|
||||||
@ -324,11 +321,16 @@ const handleHs = (val) =>{
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleYP = () => {
|
const handleYP = () => {
|
||||||
|
let arr=cascaRef.value.getCheckedNodes()
|
||||||
|
searchForm.value.jqlbdms=arr.map((el)=>{
|
||||||
|
return el.value
|
||||||
|
})
|
||||||
let params = {
|
let params = {
|
||||||
hskssj: searchForm.value.kssj,
|
hskssj: searchForm.value.kssj,
|
||||||
hsjssj: searchForm.value.jssj,
|
hsjssj: searchForm.value.jssj,
|
||||||
|
jqlbdms:searchForm.value.jqlbdms
|
||||||
}
|
}
|
||||||
qcckPost(params,'/mosty-gsxt/wshs/getDcypbg').then(res=>{
|
qcckPost(params, '/mosty-gsxt/lzJcjPjdb/getJqDcypbg').then(res => {
|
||||||
let data = res || {};
|
let data = res || {};
|
||||||
let html = `<p class="html_bt">${data.bt}</p>`
|
let html = `<p class="html_bt">${data.bt}</p>`
|
||||||
html += `<p>${data.head}</p>`
|
html += `<p>${data.head}</p>`
|
||||||
@ -342,6 +344,9 @@ const handleYP = () =>{
|
|||||||
|
|
||||||
// 选择类型
|
// 选择类型
|
||||||
const changeCascader = (val) => {
|
const changeCascader = (val) => {
|
||||||
|
console.log(val,'val');
|
||||||
|
console.log(cascaRef.value.getCheckedNodes(),'++++++++');
|
||||||
|
|
||||||
readonly_lx.value = false;
|
readonly_lx.value = false;
|
||||||
readonly_ry.value = val ? true : false
|
readonly_ry.value = val ? true : false
|
||||||
readonly_dd.value = val ? true : false
|
readonly_dd.value = val ? true : false
|
||||||
@ -403,12 +408,14 @@ const tabHeightFn = () => {
|
|||||||
padding-top: 15px;
|
padding-top: 15px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
color: #000;
|
color: #000;
|
||||||
|
|
||||||
.leftbox {
|
.leftbox {
|
||||||
width: 500px;
|
width: 500px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
margin-right: 10px;
|
margin-right: 10px;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.rightbox {
|
.rightbox {
|
||||||
flex: 1 0 0;
|
flex: 1 0 0;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
@ -431,27 +438,35 @@ const tabHeightFn = () => {
|
|||||||
height: 60px;
|
height: 60px;
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
.sircle {
|
.sircle {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleL1 {
|
.sircleL1 {
|
||||||
@include common(8px, 0.5);
|
@include common(8px, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleL2 {
|
.sircleL2 {
|
||||||
@include common(12px, 0.75);
|
@include common(12px, 0.75);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleL3 {
|
.sircleL3 {
|
||||||
@include common(16px);
|
@include common(16px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleR1 {
|
.sircleR1 {
|
||||||
@include common(16px);
|
@include common(16px);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleR2 {
|
.sircleR2 {
|
||||||
@include common(12px, 0.75);
|
@include common(12px, 0.75);
|
||||||
}
|
}
|
||||||
|
|
||||||
.sircleR3 {
|
.sircleR3 {
|
||||||
@include common(8px, 0.5);
|
@include common(8px, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
@ -466,9 +481,11 @@ const tabHeightFn = () => {
|
|||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
|
||||||
.comm-title {
|
.comm-title {
|
||||||
position: relative;
|
position: relative;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
|
||||||
&::before {
|
&::before {
|
||||||
content: '';
|
content: '';
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -496,6 +513,7 @@ const tabHeightFn = () => {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
.list-item {
|
.list-item {
|
||||||
width: 49.5%;
|
width: 49.5%;
|
||||||
height: calc(100% / 2 - 5px);
|
height: calc(100% / 2 - 5px);
|
||||||
@ -505,18 +523,22 @@ const tabHeightFn = () => {
|
|||||||
padding: 4px 4px;
|
padding: 4px 4px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
|
|
||||||
.title-s {
|
.title-s {
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-table {
|
.list-table {
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-item:nth-child(2n+1) {
|
.list-item:nth-child(2n+1) {
|
||||||
margin-right: 1%;
|
margin-right: 1%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .searchBox {
|
::v-deep .searchBox {
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
padding: 2px !important;
|
padding: 2px !important;
|
||||||
@ -525,6 +547,7 @@ const tabHeightFn = () => {
|
|||||||
::v-deep .el-table .table_blue_row {
|
::v-deep .el-table .table_blue_row {
|
||||||
background: #fff !important;
|
background: #fff !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .el-table th.el-table__cell {
|
::v-deep .el-table th.el-table__cell {
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
background: #EFF5F7;
|
background: #EFF5F7;
|
||||||
@ -549,6 +572,7 @@ const tabHeightFn = () => {
|
|||||||
::v-deep .el-link {
|
::v-deep .el-link {
|
||||||
margin: 3px;
|
margin: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.html_bt>>>p {
|
.html_bt>>>p {
|
||||||
color: red;
|
color: red;
|
||||||
}
|
}
|
||||||
@ -556,6 +580,4 @@ const tabHeightFn = () => {
|
|||||||
::v-deep .el-date-editor .el-range-separator {
|
::v-deep .el-date-editor .el-range-separator {
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<el-dialog title="行为详情次数详情(1)" v-model="dialogVisible" width="60%">
|
<el-dialog :title="`行为详情次数详情(${pageData.tableData.length})`" v-model="dialogVisible" width="60%">
|
||||||
<MyTable
|
<MyTable
|
||||||
:tableData="pageData.tableData"
|
:tableData="pageData.tableData"
|
||||||
:tableColumn="pageData.tableColumn"
|
:tableColumn="pageData.tableColumn"
|
||||||
@ -12,6 +12,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import { qcckGet } from "@/api/qcckApi.js";
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import { ref , reactive , defineExpose} from 'vue'
|
import { ref , reactive , defineExpose} from 'vue'
|
||||||
const dialogVisible = ref(false)
|
const dialogVisible = ref(false)
|
||||||
@ -30,16 +31,24 @@ const pageData = reactive({
|
|||||||
pageCurrent: 1
|
pageCurrent: 1
|
||||||
}, //分页
|
}, //分页
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "警情编号", prop: "jqbh"},
|
{ label: "警情编号", prop: "jjdbh"},
|
||||||
{ label: "报警人", prop: "bjr" },
|
{ label: "报警人", prop: "bjrmc" },
|
||||||
{ label: "报警人电话", prop: "bjrdh" },
|
{ label: "报警人电话", prop: "bjdh" },
|
||||||
{ label: "报警人身份证", prop: "bjrsfzh"},
|
{ label: "报警人身份证", prop: "bjrzjhm"},
|
||||||
{ label: "预警内容", prop: "yjnr", showOverflowTooltip: true },
|
{ label: "预警内容", prop: "bjnr", showOverflowTooltip: true },
|
||||||
{ label: "报警时间", prop: "jsj", showOverflowTooltip: true },
|
{ label: "报警时间", prop: "yjsj", showOverflowTooltip: true },
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
const init = (row) => {
|
const init = (row) => {
|
||||||
dialogVisible.value = true
|
dialogVisible.value = true;
|
||||||
|
pageData.tableConfiger.loading = true;
|
||||||
|
pageData.tableData = []
|
||||||
|
qcckGet({yjid:row.id},'/mosty-gsxt/yjzxXwyjxq/selectList').then((res)=>{
|
||||||
|
pageData.tableData = res || [];
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
}).catch(()=>{
|
||||||
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
defineExpose({
|
defineExpose({
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<div class="titleBox">
|
<div class="titleBox">
|
||||||
<PageTitle title="行为预警">
|
<PageTitle title="行为预警">
|
||||||
<el-button type="primary">
|
<el-button type="primary" @click="exportExcel">
|
||||||
<span style="vertical-align: middle">导出</span>
|
<span style="vertical-align: middle">导出</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
</PageTitle>
|
</PageTitle>
|
||||||
@ -41,6 +41,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import * as XLSX from "xlsx";
|
||||||
import Detail from './components/detail.vue'
|
import Detail from './components/detail.vue'
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
@ -58,13 +59,11 @@ const searchConfiger = ref(
|
|||||||
const detailRef = ref()
|
const detailRef = ref()
|
||||||
const queryFrom = ref({});
|
const queryFrom = ref({});
|
||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
tableData: [
|
tableData: [], //表格数据
|
||||||
{ xwcs:12 ,xm:'张三' ,sfzh:'510156565656525565',dh:'15665255545',xwfz:'20',xwms:'xxxxxxxxx',xwdl:'xxxxxxx',xwzl:'xxxxxxx'}
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
showSelectType: "checkBox",
|
showSelectType: "null",
|
||||||
loading: false,
|
loading: false,
|
||||||
haveControls: false,
|
haveControls: false,
|
||||||
},
|
},
|
||||||
@ -77,8 +76,8 @@ const pageData = reactive({
|
|||||||
{ label: "姓名", prop: "xm"},
|
{ label: "姓名", prop: "xm"},
|
||||||
{ label: "身份证号", prop: "sfzh" },
|
{ label: "身份证号", prop: "sfzh" },
|
||||||
{ label: "电话", prop: "dh" },
|
{ label: "电话", prop: "dh" },
|
||||||
{ label: "行为大类", prop: "xwdl"},
|
{ label: "行为大类", prop: "xldlmc"},
|
||||||
{ label: "行为子类", prop: "xwzl", showOverflowTooltip: true },
|
{ label: "行为子类", prop: "xwzlmc", showOverflowTooltip: true },
|
||||||
{ label: "行为描述", prop: "xwms", showOverflowTooltip: true },
|
{ label: "行为描述", prop: "xwms", showOverflowTooltip: true },
|
||||||
{ label: "行为次数", prop: "xwcs",showSolt: true },
|
{ label: "行为次数", prop: "xwcs",showSolt: true },
|
||||||
{ label: "行为分值", prop: "xwfz",},
|
{ label: "行为分值", prop: "xwfz",},
|
||||||
@ -103,19 +102,32 @@ const changeSize = (val) =>{
|
|||||||
getList()
|
getList()
|
||||||
}
|
}
|
||||||
const getList = () =>{
|
const getList = () =>{
|
||||||
// pageData.tableConfiger.loading = true;
|
pageData.tableConfiger.loading = true;
|
||||||
// qcckGet(queryFrom.value,'/mosty-gsxt/behaviorWarning/selectPage').then((res)=>{
|
qcckGet(queryFrom.value,'/mosty-gsxt/yjzxXwyj/getPageList').then((res)=>{
|
||||||
// pageData.total = res.total || 0;
|
pageData.total = res.total || 0;
|
||||||
// pageData.tableConfiger.loading = false;
|
pageData.tableConfiger.loading = false;
|
||||||
// }).catch(()=>{
|
pageData.tableData = res.records || [];
|
||||||
// pageData.tableConfiger.loading = false;
|
}).catch(()=>{
|
||||||
// })
|
pageData.tableConfiger.loading = false;
|
||||||
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const handleClick = (row) => {
|
const handleClick = (row) => {
|
||||||
detailRef.value.init(row)
|
detailRef.value.init(row)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const exportExcel = () => {
|
||||||
|
if (pageData.tableData.length === 0) return ElMessage({ message: "暂无数据", type: "warning" });
|
||||||
|
const headers = pageData.tableColumn.map(item => item.label);
|
||||||
|
const data = pageData.tableData.map(item => {
|
||||||
|
return [item.xm, item.sfzh, item.dh, item.xldlmc, item.xwzlmc, item.xwms, item.xwcs, item.xwfz];
|
||||||
|
});
|
||||||
|
const worksheet = XLSX.utils.aoa_to_sheet([headers, ...data]);
|
||||||
|
const workbook = XLSX.utils.book_new();
|
||||||
|
XLSX.utils.book_append_sheet(workbook, worksheet, "sheet1");
|
||||||
|
XLSX.writeFile(workbook, "行为预警.xlsx");
|
||||||
|
}
|
||||||
|
|
||||||
// 表格高度计算
|
// 表格高度计算
|
||||||
const tabHeightFn = () => {
|
const tabHeightFn = () => {
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||||
|
@ -3,12 +3,11 @@ const path = require("path");
|
|||||||
function resolve(dir) {
|
function resolve(dir) {
|
||||||
return path.join(__dirname, dir);
|
return path.join(__dirname, dir);
|
||||||
}
|
}
|
||||||
const serverHost = "http://192.168.1.32:8006"//波哥
|
|
||||||
// const serverHost = "http://47.108.232.77:9537"//波哥
|
// const serverHost = "http://47.108.232.77:9537"//波哥
|
||||||
// const serverHost = "http://192.168.3.248:8066"//波哥
|
|
||||||
// const serverHost = "http://192.168.0.231:8006"//线上
|
// const serverHost = "http://192.168.0.231:8006"//线上
|
||||||
// const serverHost = "http://192.168.1.117:8006"//周
|
// const serverHost = "http://192.168.1.117:8006"//周
|
||||||
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
const serverHost = "http://192.168.1.98:8006"//毛毛
|
||||||
|
|
||||||
module.exports = {
|
module.exports = {
|
||||||
// configureWebpack: {
|
// configureWebpack: {
|
||||||
|
Reference in New Issue
Block a user