fix:去除权限验证,大屏今日巡查联调,修改echart图滚动逻辑,联调工单导出

This commit is contained in:
SunTao 2024-12-05 17:25:06 +08:00
parent 70eb9f8e5e
commit 269fc702fe
30 changed files with 565 additions and 919 deletions

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-11-28 10:26:24 * @Date: 2024-11-28 10:26:24
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-11-28 10:26:24 * @LastEditTime: 2024-12-05 13:53:53
* @FilePath: \znxjxt-ui\src\api\xj\inspection\center.js * @FilePath: \znxjxt-ui\src\api\xj\inspection\center.js
* @Description: 巡检中心-预警中心接口 * @Description: 巡检中心-预警中心接口
*/ */
@ -32,3 +32,20 @@ export function markNoticeRead(id) {
method: "post", method: "post",
}); });
} }
// 标记所有通知为已读
export function noticeReadAll() {
return request({
url: "/notice/readAll",
method: "post",
});
}
// 批量删除通知
export function deleteNotice(ids) {
return request({
url: "/notice/remove",
method: "post",
data: ids,
});
}

View File

@ -130,3 +130,12 @@ export function getDefectTypes() {
method: "get", method: "get",
}); });
} }
// 获取大屏通知列表
export function getNoticeList(params) {
return request({
url: "/notice/list",
method: "get",
params,
});
}

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-14 10:04:12 * @Date: 2024-10-14 10:04:12
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-03 11:43:45 * @LastEditTime: 2024-12-05 15:34:41
* @FilePath: \znxjxt-ui\src\api\xj\task.js * @FilePath: \znxjxt-ui\src\api\xj\task.js
* @Description: 巡检任务管理接口 * @Description: 巡检任务管理接口
*/ */
@ -70,6 +70,7 @@ export function exportDefectData(params) {
return request({ return request({
url: "/xj/defect/exportNewDefectByTaskId", url: "/xj/defect/exportNewDefectByTaskId",
method: "get", method: "get",
responseType: "blob",
params, params,
}); });
} }

View File

@ -1,20 +1,20 @@
import tab from './tab' import tab from "./tab";
import auth from './auth' import auth from "./auth";
import cache from './cache' import cache from "./cache";
import modal from './modal' import modal from "./modal";
import download from './download' import download from "./download";
export default { export default {
install(Vue) { install(Vue) {
// 页签操作 // 页签操作
Vue.prototype.$tab = tab Vue.prototype.$tab = tab;
// 认证对象 // 认证对象
Vue.prototype.$auth = auth Vue.prototype.$auth = auth;
// 缓存对象 // 缓存对象
Vue.prototype.$cache = cache Vue.prototype.$cache = cache;
// 模态框对象 // 模态框对象
Vue.prototype.$modal = modal Vue.prototype.$modal = modal;
// 下载文件 // 下载文件
Vue.prototype.$download = download Vue.prototype.$download = download;
} },
} };

View File

@ -76,8 +76,7 @@
病害类型: 病害类型:
{{ item.type || "暂无数据" }} {{ item.type || "暂无数据" }}
<span v-if="bottomTipClick === '1'"> <span v-if="bottomTipClick === '1'">
病害面积{{ item.area }}平方米 病害长度{{ item.length }} 病害面积{{ item.area }}平方米 病害长度{{ item.length * 1 <= 0 ? "暂无数据" : `${item.length}` }} </span>
</span>
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</div> </div>
@ -853,7 +852,7 @@ export default {
// //
.rect-image { .rect-image {
width: 67%; width: 70%;
position: absolute; position: absolute;
top: 0; top: 0;
} }

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-21 09:59:32 * @Date: 2024-10-21 09:59:32
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-03 14:52:09 * @LastEditTime: 2024-12-05 17:13:51
* @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\traffic-safety.vue * @FilePath: \znxjxt-ui\src\views\big-screen\disease-components\traffic-safety.vue
* @Description: 病害巡检大屏-今日巡查 * @Description: 病害巡检大屏-今日巡查
--> -->
@ -14,60 +14,36 @@
</div> </div>
<div class="traffic-right"> <div class="traffic-right">
<div class="right-sum" @click="showDialog('')"> <div class="right-sum" @click="showDialog('')">
<span>{{ all }}</span <span>{{ all }}</span>
>
</div> </div>
<!-- <div class="right-rate"> <!-- <div class="right-rate">
<span> {{ scale }} </span>% <span> {{ scale }} </span>%
</div> --> </div> -->
<div class="right-rate"> <div class="right-rate">
较昨日<span class="up">增长</span> 50.26% 较昨日<span v-if="state === '增加'" class="up">{{ state }}</span><span v-if="state === '减少'" class="bottom">{{ state
<i class="el-icon-top"></i> }}</span> {{ count }}
<i v-if="state === '增加'" class="el-icon-top"></i>
<i v-if="state === '减少'" class="el-icon-bottom"></i>
</div> </div>
</div> </div>
<!-- 病害巡检弹窗 --> <!-- 病害巡检弹窗 -->
<el-dialog <el-dialog title="当前病害查看" :visible.sync="showDialogVisible" width="75rem" append-to-body
title="当前病害查看" :close-on-click-modal="false" destroy-on-close @close="screenCancel">
:visible.sync="showDialogVisible"
width="75rem"
append-to-body
:close-on-click-modal="false"
destroy-on-close
@close="screenCancel"
>
<div class="today-content"> <div class="today-content">
<div class="today-select"> <div class="today-select">
<div> <div>
<el-select <el-select :popper-append-to-body="false" v-model="roadSelect" @change="changeRoad" clearable
:popper-append-to-body="false" placeholder="请选择路段">
v-model="roadSelect" <el-option v-for="item in roadList" :key="`${item.name}-${item.index}`" :label="item.name"
@change="changeRoad" :value="item.name" />
clearable
placeholder="请选择路段"
>
<el-option
v-for="item in roadList"
:key="`${item.name}-${item.index}`"
:label="item.name"
:value="item.name"
/>
</el-select> </el-select>
</div> </div>
<div> <div>
<el-select <el-select :popper-append-to-body="false" v-model="companySelect" clearable @change="changeCompany"
:popper-append-to-body="false" placeholder="请选择分公司">
v-model="companySelect" <el-option v-for="item in companyList" :key="`${item.name}-${item.index}`" :label="item.name"
clearable :value="item.name" />
@change="changeCompany"
placeholder="请选择分公司"
>
<el-option
v-for="item in companyList"
:key="`${item.name}-${item.index}`"
:label="item.name"
:value="item.name"
/>
</el-select> </el-select>
</div> </div>
</div> </div>
@ -100,6 +76,10 @@ export default {
all: 0, all: 0,
// //
scale: 0, scale: 0,
//
state: "——",
//
count: "——",
// //
showDialogVisible: false, showDialogVisible: false,
// //
@ -137,6 +117,8 @@ export default {
if (code === 200) { if (code === 200) {
this.today = data.today; this.today = data.today;
this.all = data.all; this.all = data.all;
this.state = data.state;
this.count = data.count;
this.scale = data.scale; this.scale = data.scale;
} }
}); });
@ -645,13 +627,14 @@ export default {
span { span {
cursor: pointer; cursor: pointer;
font-family: "DouYu"; font-family: "DouYu";
background: linear-gradient( background: linear-gradient(to bottom,
to bottom, #ffffff,
#ffffff, #2773d0);
#2773d0 /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/
); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ background-clip: text;
background-clip: text; /*将设置的背景颜色限制在文字中*/ /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/ -webkit-text-fill-color: transparent;
/*给文字设置成透明*/
} }
} }
@ -685,13 +668,14 @@ export default {
font-size: 1.2rem; font-size: 1.2rem;
font-family: "DouYu"; font-family: "DouYu";
background: linear-gradient( background: linear-gradient(to bottom,
to bottom, #ffffff,
#ffffff, #21f1e1);
#21f1e1 /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/
); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ background-clip: text;
background-clip: text; /*将设置的背景颜色限制在文字中*/ /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/ -webkit-text-fill-color: transparent;
/*给文字设置成透明*/
} }
} }
@ -737,10 +721,21 @@ export default {
padding: 0 0.5rem; padding: 0 0.5rem;
} }
.bottom {
color: #19eb27;
padding: 0 0.5rem;
}
.el-icon-top { .el-icon-top {
font-size: 1.5rem; font-size: 1.5rem;
color: red; color: red;
} }
.el-icon-bottom {
font-size: 1.5rem;
color: #19eb27;
}
} }
} }
} }
@ -768,7 +763,7 @@ export default {
// height: 10%; // height: 10%;
display: flex; display: flex;
> div { >div {
width: 50%; width: 50%;
padding: 0 2rem; padding: 0 2rem;
@ -789,6 +784,7 @@ export default {
.el-select-dropdown { .el-select-dropdown {
background-color: #102649; background-color: #102649;
border-color: #08204f; border-color: #08204f;
.el-scrollbar { .el-scrollbar {
.el-select-dropdown__wrap { .el-select-dropdown__wrap {
.el-scrollbar__view { .el-scrollbar__view {

View File

@ -10,17 +10,8 @@
<template> <template>
<div class="content"> <div class="content">
<div class="traffic-select"> <div class="traffic-select">
<el-select <el-select :popper-append-to-body="false" v-model="itemSelect" placeholder="请选择">
:popper-append-to-body="false" <el-option v-for="item in trafficList" :key="item.value" :label="item.label" :value="item.value" />
v-model="itemSelect"
placeholder="请选择"
>
<el-option
v-for="item in trafficList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<div ref="trafficChart" class="traffic-echart"></div> <div ref="trafficChart" class="traffic-echart"></div>
@ -275,9 +266,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.echartData.length > 6 ? this.echartData.length - 6 : 0,
// //
endValue: 6, endValue: this.echartData.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
@ -314,7 +305,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-17 11:34:00 * @Date: 2024-10-17 11:34:00
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-04 09:28:41 * @LastEditTime: 2024-12-05 14:22:25
* @FilePath: \znxjxt-ui\src\views\big-screen\index.vue * @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
* @Description: 大屏首页 * @Description: 大屏首页
--> -->
@ -22,51 +22,23 @@
<div class="header-time"> <div class="header-time">
<!-- 消息中心 --> <!-- 消息中心 -->
<div class="header-news"> <div class="header-news">
<el-popover <el-popover placement="bottom-end" width="400" popper-class="screen-message-popover" trigger="hover">
placement="bottom-end"
width="400"
popper-class="screen-message-popover"
trigger="hover"
>
<div class="screen-message-content"> <div class="screen-message-content">
<div class="message-content"> <div class="message-content">
<fssm-scroll> <fssm-scroll style="max-height: 12rem;">
<div <div class="message-item" v-for="(item, index) in messageList" :key="`message-item-${index}`">
class="message-item" <div class="item-top" @click="handleMessageItemClick(item.status)">
v-for="(item, index) in messageList"
:key="`message-item-${index}`"
>
<div
class="item-top"
@click="handleMessageItemClick(item.status)"
>
<div class="index"> <div class="index">
<i <!-- <i v-if="item.title === '成功'" style="color: #67c23a" class="el-icon-success"></i> -->
v-if="item.title === '成功'" <i v-if="item.notificationType === 'WARNING'" style="color: #e6a23c" class="el-icon-info"></i>
style="color: #67c23a" <i v-if="item.notificationType === 'REMIND'" style="color: #909399" class="el-icon-warning"></i>
class="el-icon-success" <!-- <i v-if="item.title === '错误'" style="color: #f56c6c" class="el-icon-error"></i> -->
></i>
<i
v-if="item.title === '提醒'"
style="color: #e6a23c"
class="el-icon-info"
></i>
<i
v-if="item.title === '告警'"
style="color: #909399"
class="el-icon-warning"
></i>
<i
v-if="item.title === '错误'"
style="color: #f56c6c"
class="el-icon-error"
></i>
</div> </div>
<div class="time"> <div class="time">
<span>{{ item.time }}</span> <span>{{ item.createdTime }}</span>
</div> </div>
<div class="carNo"> <div class="carNo">
<span>{{ item.car }}</span> <span>{{ item.title }}</span>
</div> </div>
</div> </div>
<div class="item-content"> <div class="item-content">
@ -76,16 +48,11 @@
</fssm-scroll> </fssm-scroll>
</div> </div>
<div class="message-footer"> <div class="message-footer">
<el-button <el-button @click="handleMessageClick" icon="el-icon-d-arrow-right" type="text">查看更多</el-button>
@click="handleMessageClick"
icon="el-icon-d-arrow-right"
type="text"
>查看更多</el-button
>
</div> </div>
</div> </div>
<i slot="reference" class="el-icon-message-solid"> <i slot="reference" class="el-icon-message-solid">
<div class="num">48</div> <div class="num">{{ noticeNum }}</div>
</i> </i>
</el-popover> </el-popover>
</div> </div>
@ -101,58 +68,30 @@
</div> </div>
<div class="screen-middle"> <div class="screen-middle">
<div class="screen-left"> <div class="screen-left">
<module-block <module-block v-for="(item, index) in leftModuleList" :key="`left-module-list-${index}`" :width="item.width"
v-for="(item, index) in leftModuleList" :height="item.height" :title="item.title" :class="item.class">
:key="`left-module-list-${index}`" <template>
:width="item.width" <component :select="item.select" :is="item.component" :bottomTipClick="bottomTipClick"></component>
:height="item.height" </template>
:title="item.title"
:class="item.class"
>
<template
><component
:select="item.select"
:is="item.component"
:bottomTipClick="bottomTipClick"
></component
></template>
<template slot="operation" v-if="item.selectIsShow"> <template slot="operation" v-if="item.selectIsShow">
<el-radio-group class="screen-checkBox" v-model="item.select"> <el-radio-group class="screen-checkBox" v-model="item.select">
<el-radio-button <el-radio-button v-for="(item, index) in selectTypeArr" :label="item.value"
v-for="(item, index) in selectTypeArr" :key="`left-screen-${index}`">{{ item.label }}</el-radio-button>
:label="item.value"
:key="`left-screen-${index}`"
>{{ item.label }}</el-radio-button
>
</el-radio-group> </el-radio-group>
</template> </template>
</module-block> </module-block>
</div> </div>
<div class="screen-right"> <div class="screen-right">
<module-block <module-block v-for="(item, index) in rightModuleList" :key="`right-module-list-${index}`" :width="item.width"
v-for="(item, index) in rightModuleList" :height="item.height" :title="item.title" :class="item.class">
:key="`right-module-list-${index}`" <template>
:width="item.width" <component :select="item.select" :is="item.component" :bottomTipClick="bottomTipClick"
:height="item.height" @imagePoint="getimagePoint"></component>
:title="item.title" </template>
:class="item.class"
>
<template
><component
:select="item.select"
:is="item.component"
:bottomTipClick="bottomTipClick"
@imagePoint="getimagePoint"
></component
></template>
<template slot="operation" v-if="item.selectIsShow"> <template slot="operation" v-if="item.selectIsShow">
<el-radio-group class="screen-checkBox" v-model="item.select"> <el-radio-group class="screen-checkBox" v-model="item.select">
<el-radio-button <el-radio-button v-for="(item, index) in selectTypeArr" :label="item.value"
v-for="(item, index) in selectTypeArr" :key="`right-screen-${index}`">{{ item.label }}</el-radio-button>
:label="item.value"
:key="`right-screen-${index}`"
>{{ item.label }}</el-radio-button
>
</el-radio-group> </el-radio-group>
</template> </template>
</module-block> </module-block>
@ -162,12 +101,9 @@
<div class="road-checkBox" v-if="showIconList"> <div class="road-checkBox" v-if="showIconList">
<fssm-scroll class="road-scroll"> <fssm-scroll class="road-scroll">
<el-checkbox-group v-model="iconType" @change="handleChecked"> <el-checkbox-group v-model="iconType" @change="handleChecked">
<el-checkbox <el-checkbox v-for="(item, index) in iconTypeList" :label="item.value" :key="`check-${index}`">{{
v-for="(item, index) in iconTypeList" item.label
:label="item.value" }}</el-checkbox>
:key="`check-${index}`"
>{{ item.label }}</el-checkbox
>
</el-checkbox-group> </el-checkbox-group>
</fssm-scroll> </fssm-scroll>
</div> </div>
@ -179,40 +115,22 @@
<!-- 图背景下选择框 --> <!-- 图背景下选择框 -->
<div class="map-image-select"> <div class="map-image-select">
病害类型筛选 病害类型筛选
<el-cascader <el-cascader v-model="mapCareSelect" popper-class="screen-index-cascader" :options="dieaseOptions" :props="{
v-model="mapCareSelect" checkStrictly: true,
popper-class="screen-index-cascader" emitPath: true,
:options="dieaseOptions" children: 'subTypes',
:props="{ }" @change="getMapCare" clearable></el-cascader>
checkStrictly: true,
emitPath: true,
children: 'subTypes',
}"
@change="getMapCare"
clearable
></el-cascader>
</div> </div>
<div class="map-care"> <div class="map-care">
<div <div class="map-care-div" :class="`map-care-div-${item.status}`" v-for="(item, index) in mapCareList"
class="map-care-div" :key="`map-care-${index}`" :style="{ left: item.left, top: item.top }">
:class="`map-care-div-${item.status}`"
v-for="(item, index) in mapCareList"
:key="`map-care-${index}`"
:style="{ left: item.left, top: item.top }"
>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
</div> </div>
</div> </div>
<!-- 地图 --> <!-- 地图 -->
<fssm-map <fssm-map v-if="elementDiv !== 'OverviewScreen'" ref="roadMap" :showChange="true"
v-if="elementDiv !== 'OverviewScreen'" :controlStyle="{ top: '10%', left: '26%' }" @feature-select="featureSelect" @map-zoom="getZoom"></fssm-map>
ref="roadMap"
:showChange="true"
:controlStyle="{ top: '10%', left: '26%' }"
@feature-select="featureSelect"
@map-zoom="getZoom"
></fssm-map>
<!-- @map-moveend="mapMoveend" --> <!-- @map-moveend="mapMoveend" -->
</div> </div>
</div> </div>
@ -220,72 +138,33 @@
<!-- 病害巡检4种类型按钮 --> <!-- 病害巡检4种类型按钮 -->
<div class="footer-change-map"> <div class="footer-change-map">
<template v-if="elementDiv === 'DiseaseScreen'"> <template v-if="elementDiv === 'DiseaseScreen'">
<div <div class="change-map-div" :class="bottomTipClick === item.click ? 'change-map-click' : ''"
class="change-map-div" v-for="(item, index) in changeMapBtn" :key="`btn-${index}`" @click="changeIconType(item.click)">
:class="bottomTipClick === item.click ? 'change-map-click' : ''"
v-for="(item, index) in changeMapBtn"
:key="`btn-${index}`"
@click="changeIconType(item.click)"
>
{{ item.name }} {{ item.name }}
</div> </div>
</template> </template>
</div> </div>
<!-- 切换3种导航栏按钮 --> <!-- 切换3种导航栏按钮 -->
<div class="footer-change-vue"> <div class="footer-change-vue">
<div <div :class="elementDiv === item.component
:class=" ? `change-vue-click-${item.component}`
elementDiv === item.component : `change-vue-${item.component}`
? `change-vue-click-${item.component}` " v-for="(item, index) in elementList" :key="`footer-${index}`" @click="changeElement(item)"></div>
: `change-vue-${item.component}`
"
v-for="(item, index) in elementList"
:key="`footer-${index}`"
@click="changeElement(item)"
></div>
</div> </div>
</div> </div>
<!-- 详情图片弹窗 --> <!-- 详情图片弹窗 -->
<el-dialog <el-dialog :title="imgTitle" :visible.sync="imgVisible" width="95rem" append-to-body fullscreen
:title="imgTitle" :close-on-click-modal="false" destroy-on-close @close="imgCancel">
:visible.sync="imgVisible" <img-dialog v-if="imgTitle === '查看'" :imageItem="imageItem" :bottomTipClick="bottomTipClick"></img-dialog>
width="95rem"
append-to-body
fullscreen
:close-on-click-modal="false"
destroy-on-close
@close="imgCancel"
>
<img-dialog
v-if="imgTitle === '查看'"
:imageItem="imageItem"
:bottomTipClick="bottomTipClick"
></img-dialog>
</el-dialog> </el-dialog>
<!-- 查看点位图片弹窗 --> <!-- 查看点位图片弹窗 -->
<el-dialog <el-dialog title="查看点位" :visible.sync="showImageDialog" width="90rem" append-to-body :close-on-click-modal="false"
title="查看点位" destroy-on-close @close="screenImgCancel">
:visible.sync="showImageDialog"
width="90rem"
append-to-body
:close-on-click-modal="false"
destroy-on-close
@close="screenImgCancel"
>
<div class="view-image-container" ref="imageContainer"> <div class="view-image-container" ref="imageContainer">
<img <img :src="screenImage.imageUrl" alt="Main Image" ref="mainImage" @load="updateScreenRects" />
:src="screenImage.imageUrl" <div v-for="(rect, index) in screenRects" :key="index" class="rect-overlay" :style="getScreenRectStyle(rect)">
alt="Main Image" </div>
ref="mainImage"
@load="updateScreenRects"
/>
<div
v-for="(rect, index) in screenRects"
:key="index"
class="rect-overlay"
:style="getScreenRectStyle(rect)"
></div>
<div class="rect-image"> <div class="rect-image">
采集时间: 采集时间:
{{ screenImage.createTime }} 起始桩号 {{ screenImage.createTime }} 起始桩号
@ -295,9 +174,7 @@
{{ screenImage.iconTypeName || "暂无数据" }} {{ screenImage.iconTypeName || "暂无数据" }}
<span v-if="this.elementDiv === 'DiseaseScreen'"> <span v-if="this.elementDiv === 'DiseaseScreen'">
病害面积{{ screenImage.targetArea }}平方米 病害长度{{ 病害面积{{ screenImage.targetArea }}平方米 病害长度{{
screenImage.targetLen screenImage.targetLen * 1 <= 0 ? "暂无数据" : `${screenImage.targetLen}` }} </span>
}}
</span>
</div> </div>
</div> </div>
</el-dialog> </el-dialog>
@ -341,6 +218,7 @@ import {
getItemTypes, getItemTypes,
getRoadListTypes, getRoadListTypes,
getDefectTypes, getDefectTypes,
getNoticeList,
} from "@/api/xj/screen/index"; } from "@/api/xj/screen/index";
export default { export default {
name: "BigScreen", name: "BigScreen",
@ -374,8 +252,12 @@ export default {
// //
yearTime: "", yearTime: "",
//
noticeNum: 0,
// //
messageList: [], messageList: [],
//
messageTimer: null,
// //
selectTypeArr: [], selectTypeArr: [],
@ -510,7 +392,7 @@ export default {
this.getMessageList(); this.getMessageList();
this.handleMessage(); this.handleMessage();
}, },
mounted() {}, mounted() { },
methods: { methods: {
/** /**
* @description: 获取当前时间 * @description: 获取当前时间
@ -553,34 +435,43 @@ export default {
* @return {void} * @return {void}
*/ */
getMessageList() { getMessageList() {
// getMessageList().then(({ code, data }) => { this.messageTimer = setInterval(() => {
// if (code === 200) { getNoticeList({ read: 1 }).then(({ code, rows, total }) => {
// this.messageList = data; if (code === 200) {
// } this.messageList = rows;
// }); this.noticeNum = total
this.messageList = [ }
{ });
title: "成功", }, 5000);
status: "SUCCESS", getNoticeList({ read: 1 }).then(({ code, rows, total }) => {
time: "2024/45/62", if (code === 200) {
car: "辽jskdn", this.messageList = rows;
content: "骄傲的是否哈德half绝对符合卡的法拉第", this.noticeNum = total
}, }
{ });
title: "告警", // this.messageList = [
status: "WARNING", // {
time: "2024/45/62", // title: "",
car: "辽jskdn", // status: "SUCCESS",
content: "骄傲的是否哈德half绝对符合卡的法拉第", // time: "2024/45/62",
}, // car: "jskdn",
{ // content: "half",
title: "提醒", // },
status: "REMIND", // {
time: "2024/45/62", // title: "",
car: "辽jskdn", // status: "WARNING",
content: "骄傲的是否哈德half绝对符合卡的法拉第", // time: "2024/45/62",
}, // car: "jskdn",
]; // content: "half",
// },
// {
// title: "",
// status: "REMIND",
// time: "2024/45/62",
// car: "jskdn",
// content: "half",
// },
// ];
}, },
/** /**
@ -813,11 +704,10 @@ export default {
return new Style({ return new Style({
image: new Icon({ image: new Icon({
crossOrigin: "anonymous", crossOrigin: "anonymous",
src: require(`@/assets/screen/index/${ src: require(`@/assets/screen/index/${this.mapLogeList[
this.mapLogeList[ feature.getProperties().features[0].get("data").iconType
feature.getProperties().features[0].get("data").iconType ]
] }.png`),
}.png`),
// //
scale: 0.6, scale: 0.6,
displacement: [0, 30], displacement: [0, 30],
@ -1376,6 +1266,7 @@ export default {
}, },
}, },
beforeDestroy() { beforeDestroy() {
clearInterval(this.messageTimer);
clearInterval(this.timeFlag); clearInterval(this.timeFlag);
// //
const data = { type: "carLocation", status: false }; const data = { type: "carLocation", status: false };
@ -1413,7 +1304,7 @@ export default {
border: none; border: none;
} }
.el-radio-button__orig-radio:checked + .el-radio-button__inner { .el-radio-button__orig-radio:checked+.el-radio-button__inner {
color: #1cb6ff; color: #1cb6ff;
} }
} }
@ -1438,7 +1329,7 @@ export default {
border: none; border: none;
} }
.el-radio-button__orig-radio:checked + .el-radio-button__inner { .el-radio-button__orig-radio:checked+.el-radio-button__inner {
color: #1cb6ff; color: #1cb6ff;
} }
} }
@ -1567,8 +1458,7 @@ export default {
} }
::v-deep .baseLayerClass { ::v-deep .baseLayerClass {
filter: grayscale(200%) invert(200%) sepia(50%) hue-rotate(175deg) filter: grayscale(200%) invert(200%) sepia(50%) hue-rotate(175deg) brightness(80%) saturate(550%);
brightness(80%) saturate(550%);
} }
} }
} }
@ -1599,7 +1489,7 @@ export default {
display: flex; display: flex;
color: #89c5e8; color: #89c5e8;
> div { >div {
margin: 0 0.5rem; margin: 0 0.5rem;
display: flex; display: flex;
align-items: flex-end; align-items: flex-end;
@ -1688,12 +1578,12 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
> div { >div {
height: 100%; height: 100%;
width: 37.5%; width: 37.5%;
} }
> div:nth-child(2) { >div:nth-child(2) {
height: 100%; height: 100%;
width: 25%; width: 25%;
} }
@ -1733,6 +1623,7 @@ export default {
background-size: 93% 60%; background-size: 93% 60%;
background-position: 15% 15%; background-position: 15% 15%;
} }
.change-vue-click-RoadScreen { .change-vue-click-RoadScreen {
background-image: url("../../assets//screen/index/button-road-click.png"); background-image: url("../../assets//screen/index/button-road-click.png");
background-repeat: no-repeat; background-repeat: no-repeat;
@ -1792,7 +1683,7 @@ export default {
// //
.rect-image { .rect-image {
width: 80%; width: 90%;
position: absolute; position: absolute;
top: 0; top: 0;
font-size: 1.2rem; font-size: 1.2rem;
@ -1818,6 +1709,7 @@ export default {
.el-select-dropdown { .el-select-dropdown {
background-color: #102649; background-color: #102649;
border-color: #08204f; border-color: #08204f;
.el-scrollbar { .el-scrollbar {
.el-select-dropdown__wrap { .el-select-dropdown__wrap {
.el-scrollbar__view { .el-scrollbar__view {
@ -1891,7 +1783,7 @@ export default {
.message-content { .message-content {
width: 100%; width: 100%;
height: 12rem; max-height: 12rem;
.message-item { .message-item {
padding: 0.5rem 0; padding: 0.5rem 0;

View File

@ -10,7 +10,7 @@
<div class="content" ref="trendsChart"></div> <div class="content" ref="trendsChart"></div>
</template> </template>
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { roadTrends } from "@/api/xj/screen/disease-screen"; import { roadTrends } from "@/api/xj/screen/disease-screen";
export default { export default {
@ -235,9 +235,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.echartList.length > 6 ? this.echartList.length - 6 : 0,
// //
endValue: 6, endValue: this.echartList.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
@ -274,11 +274,10 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;
overflow: hidden; overflow: hidden;
} }
</style> </style>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-11-08 09:40:18 * @Date: 2024-11-08 09:40:18
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-04 16:20:31 * @LastEditTime: 2024-12-05 13:37:00
* @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\inspection-vehicles.vue * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\inspection-vehicles.vue
* @Description: 总览大屏-巡检车辆 * @Description: 总览大屏-巡检车辆
--> -->
@ -43,7 +43,7 @@
height="85%" height="85%"
> >
<el-table-column prop="plateNo" label="车牌号码"> </el-table-column> <el-table-column prop="plateNo" label="车牌号码"> </el-table-column>
<el-table-column prop="aiotStatus" label="状态"> </el-table-column> <el-table-column prop="status" label="状态"> </el-table-column>
<el-table-column prop="pci" label="操作"> <el-table-column prop="pci" label="操作">
<template slot-scope="scope"> <template slot-scope="scope">
<el-popover <el-popover
@ -63,7 +63,7 @@
</div> </div>
<div> <div>
<span class="name">车辆状态:</span> <span class="name">车辆状态:</span>
<span class="value">{{ scope.row.aiotStatus }}</span> <span class="value">{{ scope.row.status }}</span>
</div> </div>
<div> <div>
<span class="name">网络状态:</span> <span class="name">网络状态:</span>
@ -71,7 +71,7 @@
</div> </div>
<div> <div>
<span class="name">设备状态:</span> <span class="name">设备状态:</span>
<span class="value">{{ scope.row.serverStatus }}</span> <span class="value">{{ scope.row.aiotStatus }}</span>
</div> </div>
</div> </div>
<el-button <el-button
@ -84,19 +84,17 @@
</el-popover> </el-popover>
<el-button <el-button
:disabled="scope.row.aiotStatus !== '在线'" :disabled="scope.row.status !== '在线'"
size="mini" size="mini"
type="text" type="text"
@click="followCar(scope.row)" @click="followCar(scope.row)"
v-hasPermi="['system:defect:edit']"
>跟车 >跟车
</el-button> </el-button>
<el-button <el-button
:disabled="scope.row.aiotStatus !== '在线'" :disabled="scope.row.status !== '在线'"
size="mini" size="mini"
type="text" type="text"
@click="videoDelete(scope.row)" @click="videoDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>视频 >视频
</el-button> </el-button>
</template> </template>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-18 10:25:29 * @Date: 2024-10-18 10:25:29
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-04 09:56:16 * @LastEditTime: 2024-12-05 15:08:14
* @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\patrol-order.vue * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\patrol-order.vue
* @Description: 总览大屏-巡查里程 * @Description: 总览大屏-巡查里程
--> -->
@ -11,48 +11,25 @@
<div class="content"> <div class="content">
<div class="patrol-div"> <div class="patrol-div">
<div class="value"> <div class="value">
<span @click="showDetail">{{ formatNumber(patrolObject.len) }}</span <span @click="showDetail">{{ formatNumber(patrolObject.len) }}</span>km
>km
</div> </div>
</div> </div>
<div class="patrol-div"> <div class="patrol-div">
<div class="value"> <div class="value">
<span @click="showDetail">{{ formatTime(patrolObject.time) }}</span <span @click="showDetail">{{ formatTime(patrolObject.time) }}</span>h
>h
</div> </div>
</div> </div>
<!-- 巡查里程弹窗 --> <!-- 巡查里程弹窗 -->
<el-dialog <el-dialog title="巡查里程总览" :visible.sync="showDialogVisible" width="50rem" append-to-body
title="巡查里程总览" :close-on-click-modal="false" destroy-on-close @close="screenCancel">
:visible.sync="showDialogVisible"
width="50rem"
append-to-body
:close-on-click-modal="false"
destroy-on-close
@close="screenCancel"
>
<div class="patrol-content"> <div class="patrol-content">
<div class="patrol-select"> <div class="patrol-select">
<el-select <el-select :popper-append-to-body="false" v-model="companySelect" @change="changeSelect" clearable
:popper-append-to-body="false" placeholder="请选择">
v-model="companySelect" <el-option v-for="item in companyList" :key="`${item.name}-${item.index}`" :label="item.name"
@change="changeSelect" :value="item.name" />
clearable
placeholder="请选择"
>
<el-option
v-for="item in companyList"
:key="`${item.name}-${item.index}`"
:label="item.name"
:value="item.name"
/>
</el-select> </el-select>
<el-radio-group <el-radio-group v-model="checkCycle" class="screen-checkBox" size="mini" @change="changCycle">
v-model="checkCycle"
class="screen-checkBox"
size="mini"
@change="changCycle"
>
<el-radio-button label="day">今日</el-radio-button> <el-radio-button label="day">今日</el-radio-button>
<el-radio-button label="month">本月</el-radio-button> <el-radio-button label="month">本月</el-radio-button>
<el-radio-button label="year">本年</el-radio-button> <el-radio-button label="year">本年</el-radio-button>
@ -64,7 +41,7 @@
</div> </div>
</template> </template>
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getMileage, getMileageDetail } from "@/api/xj/screen/disease-screen"; import { getMileage, getMileageDetail } from "@/api/xj/screen/disease-screen";
export default { export default {
@ -357,6 +334,51 @@ export default {
yAxisIndex: 1, yAxisIndex: 1,
}, },
], ],
dataZoom: [
{
//
show: false,
//
type: "slider",
//
backgroundColor: "rgba(225,225,225,0.2)",
//
fillerColor: "#ccc",
//
borderColor: "rgba(225,225,225,0.2)",
// detail
showDetail: false,
//
startValue: 0,
//
endValue: 6,
// empty
//
filterMode: "empty",
//
width: "80%",
//
height: 5,
//
left: "center",
//
zoomLoxk: true,
//
handleSize: 10,
// dataZoom-slider
bottom: 0,
},
{
//
//
type: "inside",
//
zoomOnMouseWheel: false,
//
moveOnMouseMove: true,
moveOnMouseWheel: true,
},
],
}); });
window.addEventListener("resize", () => { window.addEventListener("resize", () => {
chart.resize(); chart.resize();
@ -376,7 +398,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -435,6 +457,7 @@ export default {
.el-select-dropdown { .el-select-dropdown {
background-color: #102649; background-color: #102649;
border-color: #08204f; border-color: #08204f;
.el-scrollbar { .el-scrollbar {
.el-select-dropdown__wrap { .el-select-dropdown__wrap {
.el-scrollbar__view { .el-scrollbar__view {
@ -470,7 +493,7 @@ export default {
border-color: #1cb6ff; border-color: #1cb6ff;
} }
.el-radio-button__orig-radio:checked + .el-radio-button__inner { .el-radio-button__orig-radio:checked+.el-radio-button__inner {
color: #1cb6ff; color: #1cb6ff;
} }
} }
@ -498,4 +521,3 @@ export default {
background-color: #113463; background-color: #113463;
} }
</style> </style>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-18 09:42:49 * @Date: 2024-10-18 09:42:49
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-03 14:51:42 * @LastEditTime: 2024-12-05 17:13:16
* @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\today-inspection.vue * @FilePath: \znxjxt-ui\src\views\big-screen\overview-components\today-inspection.vue
* @Description: 总览大屏-今日巡查 * @Description: 总览大屏-今日巡查
--> -->
@ -14,60 +14,36 @@
</div> </div>
<div class="today-right"> <div class="today-right">
<div class="right-sum" @click="showDialog('')"> <div class="right-sum" @click="showDialog('')">
<span>{{ all }}</span <span>{{ all }}</span>
>
</div> </div>
<!-- <div class="right-rate"> <!-- <div class="right-rate">
<span> {{ scale }}</span <span> {{ scale }}</span
>% >%
</div> --> </div> -->
<div class="right-rate"> <div class="right-rate">
较昨日<span class="up">增长</span> 50.26% 较昨日<span v-if="state === '增加'" class="up">{{ state }}</span><span v-if="state === '减少'" class="bottom">{{ state
<i class="el-icon-top"></i> }}</span> {{ count }}
<i v-if="state === '增加'" class="el-icon-top"></i>
<i v-if="state === '减少'" class="el-icon-bottom"></i>
</div> </div>
</div> </div>
<!-- 病害总览弹窗 --> <!-- 病害总览弹窗 -->
<el-dialog <el-dialog title="当前病害总览" :visible.sync="showDialogVisible" width="75rem" append-to-body
title="当前病害总览" :close-on-click-modal="false" destroy-on-close @close="screenCancel">
:visible.sync="showDialogVisible"
width="75rem"
append-to-body
:close-on-click-modal="false"
destroy-on-close
@close="screenCancel"
>
<div class="today-content"> <div class="today-content">
<div class="today-select"> <div class="today-select">
<div> <div>
<el-select <el-select :popper-append-to-body="false" v-model="roadSelect" @change="changeRoad" clearable
:popper-append-to-body="false" placeholder="请选择路段">
v-model="roadSelect" <el-option v-for="item in roadList" :key="`${item.name}-${item.index}`" :label="item.name"
@change="changeRoad" :value="item.name" />
clearable
placeholder="请选择路段"
>
<el-option
v-for="item in roadList"
:key="`${item.name}-${item.index}`"
:label="item.name"
:value="item.name"
/>
</el-select> </el-select>
</div> </div>
<div> <div>
<el-select <el-select :popper-append-to-body="false" v-model="companySelect" clearable @change="changeCompany"
:popper-append-to-body="false" placeholder="请选择分公司">
v-model="companySelect" <el-option v-for="item in companyList" :key="`${item.name}-${item.index}`" :label="item.name"
clearable :value="item.name" />
@change="changeCompany"
placeholder="请选择分公司"
>
<el-option
v-for="item in companyList"
:key="`${item.name}-${item.index}`"
:label="item.name"
:value="item.name"
/>
</el-select> </el-select>
</div> </div>
</div> </div>
@ -93,6 +69,10 @@ export default {
all: "0", all: "0",
// //
scale: "0", scale: "0",
//
state: "——",
//
count: "——",
// //
showDialogVisible: false, showDialogVisible: false,
// //
@ -123,6 +103,8 @@ export default {
if (code === 200) { if (code === 200) {
this.today = data.today; this.today = data.today;
this.all = data.all; this.all = data.all;
this.state = data.state;
this.count = data.count;
this.scale = (data.scale * 1).toFixed(2); this.scale = (data.scale * 1).toFixed(2);
} }
}); });
@ -625,13 +607,14 @@ export default {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 800; font-weight: 800;
font-family: "DouYu"; font-family: "DouYu";
background: linear-gradient( background: linear-gradient(to bottom,
to bottom, #ffffff,
#ffffff, #2773d0);
#2773d0 /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/
); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ background-clip: text;
background-clip: text; /*将设置的背景颜色限制在文字中*/ /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/ -webkit-text-fill-color: transparent;
/*给文字设置成透明*/
} }
} }
@ -663,13 +646,14 @@ export default {
font-weight: 800; font-weight: 800;
font-family: "DouYu"; font-family: "DouYu";
margin-right: 0.5rem; margin-right: 0.5rem;
background: linear-gradient( background: linear-gradient(to bottom,
to bottom, #ffffff,
#ffffff, #2773d0);
#2773d0 /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/
); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ background-clip: text;
background-clip: text; /*将设置的背景颜色限制在文字中*/ /*将设置的背景颜色限制在文字中*/
-webkit-text-fill-color: transparent; /*给文字设置成透明*/ -webkit-text-fill-color: transparent;
/*给文字设置成透明*/
} }
} }
@ -714,10 +698,20 @@ export default {
padding: 0 0.5rem; padding: 0 0.5rem;
} }
.bottom{
color: #19eb27;
padding: 0 0.5rem;
}
.el-icon-top { .el-icon-top {
font-size: 1.5rem; font-size: 1.5rem;
color: red; color: red;
} }
.el-icon-bottom {
font-size: 1.5rem;
color: #19eb27;
}
} }
} }
} }
@ -733,7 +727,7 @@ export default {
// height: 10%; // height: 10%;
display: flex; display: flex;
> div { >div {
width: 50%; width: 50%;
padding: 0 2rem; padding: 0 2rem;
@ -754,6 +748,7 @@ export default {
.el-select-dropdown { .el-select-dropdown {
background-color: #102649; background-color: #102649;
border-color: #08204f; border-color: #08204f;
.el-scrollbar { .el-scrollbar {
.el-select-dropdown__wrap { .el-select-dropdown__wrap {
.el-scrollbar__view { .el-scrollbar__view {

View File

@ -10,24 +10,15 @@
<template> <template>
<div class="content"> <div class="content">
<div class="anomaly-select"> <div class="anomaly-select">
<el-select <el-select :popper-append-to-body="false" v-model="itemSelect" placeholder="请选择">
:popper-append-to-body="false" <el-option v-for="item in currentList" :key="item.value" :label="item.label" :value="item.value" />
v-model="itemSelect"
placeholder="请选择"
>
<el-option
v-for="item in currentList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</div> </div>
<div ref="anomalyChart" class="anomaly-echart"></div> <div ref="anomalyChart" class="anomaly-echart"></div>
</div> </div>
</template> </template>
<script> <script>
import * as echarts from "echarts"; import * as echarts from "echarts";
import { getDropList } from "@/api/xj/screen/disease-screen"; import { getDropList } from "@/api/xj/screen/disease-screen";
import { anomalyList } from "@/api/xj/screen/road-screen"; import { anomalyList } from "@/api/xj/screen/road-screen";
@ -264,9 +255,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.anomalyData.length > 10 ? this.anomalyData.length - 10 : 0,
// //
endValue: 10, endValue: this.anomalyData.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
@ -303,7 +294,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -323,4 +314,3 @@ export default {
} }
} }
</style> </style>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-29 15:12:20 * @Date: 2024-10-29 15:12:20
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-11-18 16:53:33 * @LastEditTime: 2024-12-05 16:36:31
* @FilePath: \znxjxt-ui\src\views\index-components\daily-index.vue * @FilePath: \znxjxt-ui\src\views\index-components\daily-index.vue
* @Description: 首页-日常巡查 * @Description: 首页-日常巡查
--> -->
@ -22,15 +22,13 @@
<div class="left-div"> <div class="left-div">
<div class="name">巡查里程</div> <div class="name">巡查里程</div>
<div class="value"> <div class="value">
<span>{{ formatNumber(mileage) }}</span <span>{{ formatNumber(mileage) }}</span>km
>km
</div> </div>
</div> </div>
<div class="left-div"> <div class="left-div">
<div class="name">覆盖道路数</div> <div class="name">覆盖道路数</div>
<div class="value"> <div class="value">
<span>{{ roadNum }}</span <span>{{ roadNum }}</span>
>
</div> </div>
</div> </div>
<!-- <div class="left-chart" ref="rateChart"></div> --> <!-- <div class="left-chart" ref="rateChart"></div> -->
@ -231,9 +229,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.diseaseChart.length - 6,
// //
endValue: 6, endValue: this.diseaseChart.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
@ -507,7 +505,7 @@ export default {
width: 78%; width: 78%;
height: 100%; height: 100%;
> div { >div {
height: 50%; height: 50%;
width: 100%; width: 100%;
background-color: #ffffff; background-color: #ffffff;

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-29 15:17:58 * @Date: 2024-10-29 15:17:58
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-11-18 17:04:51 * @LastEditTime: 2024-12-05 16:35:11
* @FilePath: \znxjxt-ui\src\views\index-components\disease-index.vue * @FilePath: \znxjxt-ui\src\views\index-components\disease-index.vue
* @Description: 首页-病害识别 * @Description: 首页-病害识别
--> -->
@ -22,15 +22,13 @@
<div> <div>
<div class="name">病害识别总数</div> <div class="name">病害识别总数</div>
<div class="value"> <div class="value">
<span>{{ total }}</span <span>{{ total }}</span>
>
</div> </div>
</div> </div>
<div> <div>
<div class="name">新增病害数</div> <div class="name">新增病害数</div>
<div class="value"> <div class="value">
<span>{{ newTotal }}</span <span>{{ newTotal }}</span>
>
</div> </div>
</div> </div>
</div> </div>
@ -40,16 +38,9 @@
<div class="distribution-div" ref="distributionChart"></div> <div class="distribution-div" ref="distributionChart"></div>
<div class="distribution-legnd"> <div class="distribution-legnd">
<fssm-scroll> <fssm-scroll>
<div <div class="legnd-div" v-for="(item, index) in distributionList" :key="`distribution-${index}`">
class="legnd-div"
v-for="(item, index) in distributionList"
:key="`distribution-${index}`"
>
<div class="name"> <div class="name">
<span <span class="index" :style="{ backgroundColor: distributionColor[index] }"></span>
class="index"
:style="{ backgroundColor: distributionColor[index] }"
></span>
<span>{{ item.name }}</span> <span>{{ item.name }}</span>
</div> </div>
<div class="rate">{{ item.rate }}</div> <div class="rate">{{ item.rate }}</div>
@ -62,7 +53,7 @@
</div> </div>
</template> </template>
<script> <script>
import FssmScroll from "@/components/scroll/fssm-scroll.vue"; import FssmScroll from "@/components/scroll/fssm-scroll.vue";
import * as echarts from "echarts"; import * as echarts from "echarts";
// //
@ -270,16 +261,16 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.statisticsData.length > 6 ? this.statisticsData.length - 6 : 0,
// //
endValue: 6, endValue: this.statisticsData.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
// //
width: "80%", width: "80%",
// //
height: 5, height: 7,
// //
left: "center", left: "center",
// //
@ -404,7 +395,7 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.content { .content {
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -438,7 +429,7 @@ export default {
background: url("../../assets/index/left-bkg.png") no-repeat; background: url("../../assets/index/left-bkg.png") no-repeat;
background-size: 100%; background-size: 100%;
> div { >div {
height: 50%; height: 50%;
width: calc(100% - 2rem); width: calc(100% - 2rem);
margin: 0 1rem; margin: 0 1rem;
@ -480,7 +471,7 @@ export default {
z-index: 1; z-index: 1;
} }
> div { >div {
height: 50%; height: 50%;
width: 100%; width: 100%;
display: flex; display: flex;

View File

@ -226,9 +226,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.roadChartData.length > 6 ? this.roadChartData.length - 6 : 0,
// //
endValue: 6, endValue: this.roadChartData.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",

View File

@ -13,12 +13,8 @@
<span>路况评定</span> <span>路况评定</span>
<div class="title-select"> <div class="title-select">
<el-radio-group v-model="itemSelect" size="mini" @change="changeRadio"> <el-radio-group v-model="itemSelect" size="mini" @change="changeRadio">
<el-radio-button <el-radio-button v-for="(item, index) in selectTypeArr" :label="item.value" :key="`left-screen-${index}`">{{
v-for="(item, index) in selectTypeArr" item.label }}</el-radio-button>
:label="item.value"
:key="`left-screen-${index}`"
>{{ item.label }}</el-radio-button
>
</el-radio-group> </el-radio-group>
</div> </div>
</div> </div>
@ -303,9 +299,9 @@ export default {
// detail // detail
showDetail: false, showDetail: false,
// //
startValue: 0, startValue: this.trafficEchartData.length > 6 ? this.trafficEchartData.length - 6 : 0,
// //
endValue: 6, endValue: this.trafficEchartData.length,
// empty // empty
// //
filterMode: "empty", filterMode: "empty",
@ -360,7 +356,7 @@ export default {
background-size: 5%; background-size: 5%;
background-position: 0 30%; background-position: 0 30%;
> span { >span {
font-family: "DouYu"; font-family: "DouYu";
} }
} }
@ -372,6 +368,7 @@ export default {
::v-deep .el-table tr { ::v-deep .el-table tr {
background-color: #f6f7fa; background-color: #f6f7fa;
} }
::v-deep .el-table .el-table__header-wrapper th, ::v-deep .el-table .el-table__header-wrapper th,
.el-table .el-table__fixed-header-wrapper th { .el-table .el-table__fixed-header-wrapper th {
background-color: #f6f7fa; background-color: #f6f7fa;

View File

@ -127,7 +127,6 @@
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:defect:add']"
>新增</el-button> >新增</el-button>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
@ -138,7 +137,6 @@
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['system:defect:edit']"
>修改</el-button> >修改</el-button>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
@ -149,7 +147,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:defect:remove']"
>删除</el-button> >删除</el-button>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
@ -159,7 +156,6 @@
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:defect:export']"
>导出</el-button> >导出</el-button>
</el-col> </el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
@ -190,7 +186,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>修改</el-button> >修改</el-button>
<el-button <el-button
size="mini" size="mini"

View File

@ -127,7 +127,6 @@
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:defect:add']"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
@ -139,7 +138,6 @@
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdate" @click="handleUpdate"
v-hasPermi="['system:defect:edit']"
>修改 >修改
</el-button> </el-button>
</el-col> </el-col>
@ -151,7 +149,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
@ -162,7 +159,6 @@
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:defect:export']"
>导出 >导出
</el-button> </el-button>
</el-col> </el-col>
@ -201,7 +197,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
@ -209,7 +204,6 @@
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</template> </template>

View File

@ -213,7 +213,6 @@
type="text" type="text"
icon="el-icon-view" icon="el-icon-view"
@click="handleView(scope.row)" @click="handleView(scope.row)"
v-hasPermi="['system:defect:edit']"
>查看 >查看
</el-button> </el-button>
<el-button <el-button
@ -222,7 +221,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>生成工单 >生成工单
</el-button> </el-button>
<el-button <el-button
@ -231,7 +229,6 @@
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</template> </template>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-11-20 11:58:33 * @Date: 2024-11-20 11:58:33
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-11-20 15:49:28 * @LastEditTime: 2024-12-05 15:03:52
* @FilePath: \znxjxt-ui\src\views\xj\inspection-warn\warning-center\index.vue * @FilePath: \znxjxt-ui\src\views\xj\inspection-warn\warning-center\index.vue
* @Description: 预警中心-信息中心 * @Description: 预警中心-信息中心
--> -->
@ -10,175 +10,77 @@
<template> <template>
<div class="content"> <div class="content">
<!-- 搜索表单 --> <!-- 搜索表单 -->
<el-form <el-form :model="warnForm" ref="queryForm" size="small" :inline="true" label-width="5rem">
:model="warnForm" <!-- <el-form-item label="消息类型" prop="type">
ref="queryForm" <el-select v-model="warnForm.type" placeholder="请选择消息类型" filterable clearable>
size="small" <el-option v-for="item in deviceList" :key="item.value" :label="item.label" :value="item.value" />
:inline="true"
label-width="5rem"
>
<el-form-item label="消息类型" prop="type">
<el-select
v-model="warnForm.type"
placeholder="请选择消息类型"
filterable
clearable
>
<el-option
v-for="item in deviceList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item> -->
<el-form-item label="时间" prop="dateTime"> <el-form-item label="时间" prop="dateTime">
<el-date-picker <el-date-picker v-model="dateTime" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期"
v-model="dateTime" format="yyyy-MM-dd HH:mm:ss" value-format="yyyy-MM-dd HH:mm:ss" clearable />
type="datetimerange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
clearable
/>
</el-form-item> </el-form-item>
<el-form-item label="阅读状态" prop="read"> <el-form-item label="阅读状态" prop="read">
<el-select <el-select v-model="warnForm.read" placeholder="请选择阅读状态" clearable>
v-model="warnForm.read" <el-option v-for="item in readStatusList" :key="item.value" :label="item.label" :value="item.value" />
placeholder="请选择阅读状态"
clearable
>
<el-option
v-for="item in readStatusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
type="primary" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="primary" plain icon="el-icon-check" size="mini" @click="handleRead"
type="primary" v-hasPermi="['system:defect:add']">全部已读
plain
icon="el-icon-check"
size="mini"
@click="handleRead"
v-hasPermi="['system:defect:add']"
>全部已读
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
type="danger" @click="handleDelete(null)" v-hasPermi="['system:defect:remove']">批量删除
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete(null)"
v-hasPermi="['system:defect:remove']"
>批量删除
</el-button> </el-button>
</el-col> </el-col>
</el-row> </el-row>
<!-- 导航栏 --> <!-- 导航栏 -->
<el-tabs v-model="activeName" @tab-click="handleClick"> <el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane <el-tab-pane v-for="(item, index) in editableTabs" :key="`tabs-${index}`" :label="item.title" :name="item.code">
v-for="(item, index) in editableTabs"
:key="`tabs-${index}`"
:label="item.title"
:name="item.code"
>
<!-- 标签页头 --> <!-- 标签页头 -->
<span slot="label" <span slot="label">
><i <!-- <i
v-if="item.title === '成功'" v-if="item.code === 'SUCCESS'"
style="color: #67c23a" style="color: #67c23a"
class="el-icon-success" class="el-icon-success"
></i> ></i> -->
<i <i v-if="item.code === 'REMIND'" style="color: #e6a23c" class="el-icon-info"></i>
v-if="item.title === '提醒'" <i v-if="item.code === 'WARNING'" style="color: #909399" class="el-icon-warning"></i>
style="color: #e6a23c" <!-- <i
class="el-icon-info"
></i>
<i
v-if="item.title === '告警'"
style="color: #909399"
class="el-icon-warning"
></i>
<i
v-if="item.title === '错误'" v-if="item.title === '错误'"
style="color: #f56c6c" style="color: #f56c6c"
class="el-icon-error" class="el-icon-error"
></i ></i
>{{ item.title }}({{ item.count }})</span > -->
> {{ item.title }}({{ item.count }})</span>
<!-- 表格 --> <!-- 表格 -->
<el-table <el-table ref="warningTable" :data="warningList" v-loading="loading" style="width: 100%"
ref="warningTable" @current-change="handleTableChange" @selection-change="handleSelectionChange">
:data="warningList"
v-loading="loading"
style="width: 100%"
@current-change="handleTableChange"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column <el-table-column width="180" label="时间" align="center" prop="createdTime">
width="180"
label="时间"
align="center"
prop="createdTime"
>
<template slot-scope="scope"> <template slot-scope="scope">
<span <span :class="`${scope.row.readStatus === 1 ? 'table-index' : ''}`">{{ scope.row.createdTime }}</span>
:class="`${scope.row.readStatus === 1 ? 'table-index' : ''}`"
>{{ scope.row.createdTime }}</span
>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column show-overflow-tooltip label="消息标题" width="150" align="center" prop="title">
show-overflow-tooltip
label="消息标题"
width="150"
align="center"
prop="title"
>
</el-table-column> </el-table-column>
<el-table-column <el-table-column show-overflow-tooltip label="消息内容" align="left" prop="content">
show-overflow-tooltip
label="消息内容"
align="left"
prop="content"
>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 分页组件 --> <!-- 分页组件 -->
<div class="pagination-part"> <div class="pagination-part">
<el-pagination <el-pagination background :current-page.sync="pagination.page" @current-change="handleCurrentChange"
background :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.size" @size-change="handleSizeChange"
:current-page.sync="pagination.page" layout="total, sizes, prev, pager, next, jumper" :total="tableTotal">
@current-change="handleCurrentChange"
:page-sizes="[10, 20, 30, 40]"
:page-size.sync="pagination.size"
@size-change="handleSizeChange"
layout="total, sizes, prev, pager, next, jumper"
:total="tableTotal"
>
</el-pagination> </el-pagination>
</div> </div>
</el-tab-pane> </el-tab-pane>
@ -191,6 +93,8 @@ import {
getWarningList, getWarningList,
getWarningNav, getWarningNav,
markNoticeRead, markNoticeRead,
noticeReadAll,
deleteNotice
} from "@/api/xj/inspection/center"; } from "@/api/xj/inspection/center";
export default { export default {
name: "WarningCenter", name: "WarningCenter",
@ -209,8 +113,8 @@ export default {
dateTime: [], dateTime: [],
// //
readStatusList: [ readStatusList: [
{ label: "已读", value: 2 },
{ label: "未读", value: 1 }, { label: "未读", value: 1 },
{ label: "已读", value: 2 },
], ],
// //
activeName: "WARNING", activeName: "WARNING",
@ -358,14 +262,14 @@ export default {
this.$modal this.$modal
.confirm(`是否确认删除选中的${checkIds.length}条记录?`) .confirm(`是否确认删除选中的${checkIds.length}条记录?`)
.then(() => { .then(() => {
// return deleteRoad(checkIds); return deleteNotice(checkIds);
}) })
.then(() => { .then(() => {
this.$modal.msgSuccess("删除成功");
this.getList(); this.getList();
this.$refs.warningTable.clearSelection(); this.$refs.warningTable.clearSelection();
this.$modal.msgSuccess("删除成功");
}) })
.catch(() => {}); .catch(() => { });
}, },
/** /**
@ -373,7 +277,12 @@ export default {
* @return {*} * @return {*}
*/ */
handleRead() { handleRead() {
this.getList(); noticeReadAll().then(({ code }) => {
if (code === 200) {
this.getList();
this.getNav();
}
});
}, },
/** /**

View File

@ -1,5 +1,3 @@
<!-- <!--
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-01-08 11:56:02 * @Date: 2024-01-08 11:56:02
@ -10,29 +8,13 @@
--> -->
<template> <template>
<div class="add-setup"> <div class="add-setup">
<el-form <el-form class="addForm" ref="warningSetupForm" :model="warningSetupForm" :rules="rules" label-width="7rem">
class="addForm"
ref="warningSetupForm"
:model="warningSetupForm"
:rules="rules"
label-width="7rem"
>
<el-row :gutter="24"> <el-row :gutter="24">
<el-col :span="24"> <el-col :span="24">
<el-form-item label="预警类型" prop="meteringType"> <el-form-item label="预警类型" prop="meteringType">
<el-select <el-select v-model="warningSetupForm.meteringType" placeholder="请选择预警类型" style="width: 100%" clearable
v-model="warningSetupForm.meteringType" @change="changeMeteringType">
placeholder="请选择预警类型" <el-option v-for="item in meteringList" :key="item.value" :label="item.label" :value="item.value" />
style="width: 100%"
clearable
@change="changeMeteringType"
>
<el-option
v-for="item in meteringList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-col> </el-col>
@ -40,24 +22,14 @@
<el-row :gutter="24" v-if="warningSetupForm.meteringType !== '面积'"> <el-row :gutter="24" v-if="warningSetupForm.meteringType !== '面积'">
<el-col :span="24"> <el-col :span="24">
<el-form-item label="预警病害长度" prop="length"> <el-form-item label="预警病害长度" prop="length">
<el-input-number <el-input-number v-model="warningSetupForm.length" :min="0" placeholder="请输入预警病害长度" style="width: 100%" />
v-model="warningSetupForm.length"
:min="0"
placeholder="请输入预警病害长度"
style="width: 100%"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row :gutter="24" v-if="warningSetupForm.meteringType !== '长度'"> <el-row :gutter="24" v-if="warningSetupForm.meteringType !== '长度'">
<el-col :span="24"> <el-col :span="24">
<el-form-item label="预警病害面积" prop="area"> <el-form-item label="预警病害面积" prop="area">
<el-input-number <el-input-number v-model="warningSetupForm.area" :min="0" placeholder="请输入预警病害面积" style="width: 100%" />
v-model="warningSetupForm.area"
:min="0"
placeholder="请输入预警病害面积"
style="width: 100%"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -82,7 +54,7 @@ export default {
// //
dialogItem: { dialogItem: {
type: Object, type: Object,
default: () => {}, default: () => { },
}, },
}, },
components: {}, components: {},
@ -130,7 +102,7 @@ export default {
dialogItem: { dialogItem: {
handler(newVal) { handler(newVal) {
if (Object.keys(newVal).length > 0) { if (Object.keys(newVal).length > 0) {
this.warningSetupForm = newVal; this.warningSetupForm = JSON.parse(JSON.stringify(newVal));
this.changeMeteringType(newVal.meteringType); this.changeMeteringType(newVal.meteringType);
} }
}, },

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-01-08 11:56:02 * @Date: 2024-01-08 11:56:02
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-02 15:45:48 * @LastEditTime: 2024-12-05 13:51:04
* @FilePath: \znxjxt-ui\src\views\xj\inspection-warn\warning-setup\index.vue * @FilePath: \znxjxt-ui\src\views\xj\inspection-warn\warning-setup\index.vue
* @Description: 预警中心-预警设置 * @Description: 预警中心-预警设置
--> -->
@ -138,7 +138,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>编辑 >编辑
</el-button> </el-button>
</template> </template>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-11-01 17:25:06 * @Date: 2024-11-01 17:25:06
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-03 15:14:12 * @LastEditTime: 2024-12-05 17:04:07
* @FilePath: \znxjxt-ui\src\views\xj\inspection\confirmation-management\components\image-dialog.vue * @FilePath: \znxjxt-ui\src\views\xj\inspection\confirmation-management\components\image-dialog.vue
* @Description: 病害确认-影像模式弹窗 * @Description: 病害确认-影像模式弹窗
--> -->
@ -12,77 +12,32 @@
<div class="image-content"> <div class="image-content">
<!-- 图片展示 --> <!-- 图片展示 -->
<div class="sidebar" ref="sidebar" @scroll="handleScroll"> <div class="sidebar" ref="sidebar" @scroll="handleScroll">
<img <img v-for="(item, index) in defectData" :key="item.id" :src="item.media[0].img" :alt="'Image ' + (index + 1)"
v-for="(item, index) in defectData" @click="showImage(index)" :class="{ selected: currentIndex === index }" />
:key="item.id"
:src="item.media[0].img"
:alt="'Image ' + (index + 1)"
@click="showImage(index)"
:class="{ selected: currentIndex === index }"
/>
</div> </div>
<!-- 右侧区域 --> <!-- 右侧区域 -->
<div class="main-content"> <div class="main-content">
<div class="image-form"> <div class="image-form">
<el-form <el-form :model="imgForm" ref="imgForm" size="small" :inline="true" label-width="5rem">
:model="imgForm"
ref="imgForm"
size="small"
:inline="true"
label-width="5rem"
>
<el-form-item label="路段名称"> <el-form-item label="路段名称">
<el-select <el-select v-model="imgForm.segmentId" placeholder="请选择路段名称" :style="{ width: '8rem' }" clearable>
v-model="imgForm.segmentId" <el-option v-for="item in roadTypeList" :key="item.value" :label="item.label" :value="item.value" />
placeholder="请选择路段名称"
:style="{ width: '8rem' }"
clearable
>
<el-option
v-for="item in roadTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label-width="3rem" label="类型"> <el-form-item label-width="3rem" label="类型">
<el-cascader <el-cascader v-model="imgForm.defectType" :options="tableDefect" :props="{
v-model="imgForm.defectType" checkStrictly: false,
:options="tableDefect" emitPath: false,
:props="{ children: 'subTypes',
checkStrictly: false, }" clearable></el-cascader>
emitPath: false,
children: 'subTypes',
}"
clearable
></el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="公里桩"> <el-form-item label="公里桩">
<el-input <el-input v-model="imgForm.stakeStart" placeholder="起始公里桩" style="width: 7rem" clearable />
v-model="imgForm.stakeStart"
placeholder="起始公里桩"
style="width: 7rem"
clearable
/>
<span style="margin: 0 5px">-</span> <span style="margin: 0 5px">-</span>
<el-input <el-input v-model="imgForm.stakeEnd" placeholder="终止公里桩" style="width: 7rem" clearable />
v-model="imgForm.stakeEnd"
placeholder="终止公里桩"
style="width: 7rem"
clearable
/>
</el-form-item> </el-form-item>
<el-button <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
type="primary" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
<!-- <el-row :gutter="24"> <!-- <el-row :gutter="24">
<el-col :span="6"> <el-col :span="6">
<el-button <el-button
@ -105,18 +60,8 @@
<!-- 图片展示 --> <!-- 图片展示 -->
<div class="image-view"> <div class="image-view">
<div class="view-content" ref="imageContainer"> <div class="view-content" ref="imageContainer">
<img <img :src="currentImage" alt="Main Image" ref="mainImage" @load="updateRects" />
:src="currentImage" <div class="rect-overlay" v-for="(rect, index) in rects" :key="index" :style="getRectStyle(rect)"></div>
alt="Main Image"
ref="mainImage"
@load="updateRects"
/>
<div
class="rect-overlay"
v-for="(rect, index) in rects"
:key="index"
:style="getRectStyle(rect)"
></div>
<div class="view-info"> <div class="view-info">
采集时间: 采集时间:
{{ new Date(rectsItem.createdTime).toLocaleString() }} 起始桩号: {{ new Date(rectsItem.createdTime).toLocaleString() }} 起始桩号:
@ -127,24 +72,15 @@
</div> </div>
</div> </div>
<div class="image-bottom"> <div class="image-bottom">
<img <img v-for="(mediaItem, index) in currentThumbnails" :key="'thumb-' + index" :src="mediaItem.img"
v-for="(mediaItem, index) in currentThumbnails" :alt="'Thumb ' + (index + 1)" @click="showThumbnailImage(index)"
:key="'thumb-' + index" :class="{ selected: selectedThumbnail === index }" />
:src="mediaItem.img"
:alt="'Thumb ' + (index + 1)"
@click="showThumbnailImage(index)"
:class="{ selected: selectedThumbnail === index }"
/>
</div> </div>
</div> </div>
</div> </div>
<div class="footer"> <div class="footer">
<el-button type="success" size="mini" @click="changeDefect(2)" <el-button type="success" size="mini" @click="changeDefect(2)">是病害(Y)</el-button>
>是病害(Y)</el-button <el-button type="warning" size="mini" @click="changeDefect(3)">不是病害(N)</el-button>
>
<el-button type="warning" size="mini" @click="changeDefect(3)"
>不是病害(N)</el-button
>
</div> </div>
</div> </div>
</template> </template>
@ -341,7 +277,7 @@ export default {
if (currentImageElement) { if (currentImageElement) {
currentImageElement.scrollIntoView({ currentImageElement.scrollIntoView({
behavior: "smooth", behavior: "smooth",
block: "nearest", block: "center",
}); });
} }
}, },
@ -401,7 +337,7 @@ export default {
// + // +
const sidebar = this.$refs.sidebar; const sidebar = this.$refs.sidebar;
if ( if (
sidebar.scrollTop + sidebar.clientHeight >= sidebar.scrollHeight - 15 && sidebar.scrollTop + sidebar.clientHeight >= sidebar.scrollHeight - 1 &&
!this.loading !this.loading
) { ) {
this.loadMoreImages(); this.loadMoreImages();
@ -487,6 +423,7 @@ export default {
.sidebar { .sidebar {
width: 20rem; width: 20rem;
height: calc(100% - 2.5rem);
padding: 10px; padding: 10px;
overflow-y: auto; overflow-y: auto;
} }

View File

@ -194,7 +194,6 @@
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:defect:add']"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
@ -206,7 +205,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete('')" @click="handleDelete('')"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
@ -218,7 +216,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleUpdateBatch" @click="handleUpdateBatch"
v-hasPermi="['system:defect:edit']"
>批量确认 >批量确认
</el-button> </el-button>
</el-col> --> </el-col> -->
@ -300,7 +297,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
@ -308,7 +304,6 @@
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
<el-button <el-button

View File

@ -161,7 +161,6 @@
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:defect:add']"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
@ -173,7 +172,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete(null)" @click="handleDelete(null)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
@ -184,7 +182,6 @@
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:defect:export']"
>导出 >导出
</el-button> </el-button>
</el-col> --> </el-col> -->
@ -196,7 +193,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleUpdateBatch" @click="handleUpdateBatch"
v-hasPermi="['system:defect:edit']"
>批量确认 >批量确认
</el-button> </el-button>
</el-col> --> </el-col> -->
@ -281,7 +277,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
@ -289,7 +284,6 @@
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</template> </template>

View File

@ -2,7 +2,7 @@
* @Author: SunTao 328867980@qq.com * @Author: SunTao 328867980@qq.com
* @Date: 2024-10-14 09:48:43 * @Date: 2024-10-14 09:48:43
* @LastEditors: SunTao 328867980@qq.com * @LastEditors: SunTao 328867980@qq.com
* @LastEditTime: 2024-12-03 11:44:24 * @LastEditTime: 2024-12-05 16:27:28
* @FilePath: \znxjxt-ui\src\views\xj\inspection\task-management\index.vue * @FilePath: \znxjxt-ui\src\views\xj\inspection\task-management\index.vue
* @Description: 巡检管理-巡检任务 * @Description: 巡检管理-巡检任务
--> -->
@ -10,74 +10,31 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索表单 --> <!-- 搜索表单 -->
<el-form <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="100px">
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
label-width="100px"
>
<el-form-item label="任务id" prop="taskId"> <el-form-item label="任务id" prop="taskId">
<el-autocomplete <el-autocomplete v-model="queryParams.taskId" :fetch-suggestions="querySearchAsync" placeholder="请输入任务id"
v-model="queryParams.taskId" @select="handleSelect"></el-autocomplete>
:fetch-suggestions="querySearchAsync"
placeholder="请输入任务id"
@select="handleSelect"
></el-autocomplete>
</el-form-item> </el-form-item>
<el-form-item label="车牌号码" prop="plateNo"> <el-form-item label="车牌号码" prop="plateNo">
<el-input <el-input v-model="queryParams.plateNo" placeholder="请输入车牌号码" clearable=""></el-input>
v-model="queryParams.plateNo"
placeholder="请输入车牌号码"
clearable=""
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="巡检路段" prop="segmentId"> <el-form-item label="巡检路段" prop="segmentId">
<el-select <el-select v-model="queryParams.segmentId" placeholder="请选择巡检路段" clearable>
v-model="queryParams.segmentId" <el-option v-for="item in segmentList" :key="item.value" :label="item.label" :value="item.value" />
placeholder="请选择巡检路段"
clearable
>
<el-option
v-for="item in segmentList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="巡检时间" prop="dateTime"> <el-form-item label="巡检时间" prop="dateTime">
<el-date-picker <el-date-picker v-model="dateTime" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
v-model="dateTime" format="yyyy-MM-dd" value-format="yyyy-MM-dd" clearable />
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
clearable
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
type="primary" <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
<!-- 列表 --> <!-- 列表 -->
<el-table <el-table ref="roadTable" :data="roadList" @selection-change="handleSelectionChange"
ref="roadTable" style="width: 100%">
v-loading="loading"
:data="roadList"
@selection-change="handleSelectionChange"
style="width: 100%"
>
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="巡检路段" align="center" prop="segmentName" /> <el-table-column label="巡检路段" align="center" prop="segmentName" />
<el-table-column label="巡检路段编码" align="center" prop="segmentCode"> <el-table-column label="巡检路段编码" align="center" prop="segmentCode">
@ -96,68 +53,29 @@
<el-table-column label="车牌号码" align="center" prop="plateNo"> <el-table-column label="车牌号码" align="center" prop="plateNo">
</el-table-column> </el-table-column>
<el-table-column label="任务id" align="center" prop="extId" /> <el-table-column label="任务id" align="center" prop="extId" />
<el-table-column <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button size="mini" type="text" icon="el-icon-view" @click="viewDefect(scope.row)">查看
size="mini"
type="text"
icon="el-icon-view"
@click="viewDefect(scope.row)"
>查看
</el-button> </el-button>
<el-button <el-button size="mini" type="text" icon="el-icon-refresh-right" @click="handleRetrace(scope.row)">回顾
size="mini"
type="text"
icon="el-icon-refresh-right"
@click="handleRetrace(scope.row)"
v-hasPermi="['system:defect:edit']"
>回顾
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-download"
@click="handleExport(scope.row)"
v-hasPermi="['system:defect:remove']"
>导出
</el-button> </el-button>
<el-button style="margin-left: 0.5rem;" size="mini" type="text" icon="el-icon-download"
@click="handelExpport(scope.row)">导出</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- 分页组件 --> <!-- 分页组件 -->
<div class="pagination-part"> <div class="pagination-part">
<el-pagination <el-pagination background :current-page.sync="pagination.page" @current-change="handleCurrentChange"
background :page-sizes="[10, 20, 30, 40]" :page-size.sync="pagination.size" @size-change="handleSizeChange"
:current-page.sync="pagination.page" layout="total, sizes, prev, pager, next, jumper" :total="tableTotal">
@current-change="handleCurrentChange"
:page-sizes="[10, 20, 30, 40]"
:page-size.sync="pagination.size"
@size-change="handleSizeChange"
layout="total, sizes, prev, pager, next, jumper"
:total="tableTotal"
>
</el-pagination> </el-pagination>
</div> </div>
<!-- 查看新增病害弹窗 --> <!-- 查看新增病害弹窗 -->
<el-dialog <el-dialog title="查看新增病害" :visible.sync="viewVisible" width="80rem" append-to-body :close-on-click-modal="false"
title="查看新增病害" destroy-on-close @close="viewCancel">
:visible.sync="viewVisible" <task-view v-if="viewVisible" @cancel="viewCancel" :dialogItem="dialogItem"
width="80rem" :defectCascaderList="defectCascaderList"></task-view>
append-to-body
:close-on-click-modal="false"
destroy-on-close
@close="viewCancel"
>
<task-view
v-if="viewVisible"
@cancel="viewCancel"
:dialogItem="dialogItem"
:defectCascaderList="defectCascaderList"
></task-view>
<!-- <task-retrace <!-- <task-retrace
v-if="viewVisible" v-if="viewVisible"
@cancel="viewCancel" @cancel="viewCancel"
@ -166,27 +84,29 @@
</el-dialog> </el-dialog>
<!-- 回顾巡检任务弹窗 --> <!-- 回顾巡检任务弹窗 -->
<el-dialog <el-dialog title="回顾任务" fullscreen :visible.sync="retraceVisible" width="80rem" append-to-body
title="回顾任务" :close-on-click-modal="false" destroy-on-close @close="retraceCancel" class="retrace-dialog">
fullscreen <task-retrace v-if="retraceVisible" @cancel="retraceCancel" :dialogItem="dialogItem"></task-retrace>
:visible.sync="retraceVisible" </el-dialog>
width="80rem"
append-to-body <!-- 导出数据弹窗 -->
:close-on-click-modal="false" <el-dialog title="导出" :visible.sync="exportVisible" width="30rem" append-to-body :close-on-click-modal="false"
destroy-on-close destroy-on-close @close="exportCancel">
@close="retraceCancel" <template>
class="retrace-dialog" <div style="font-size: 1.5rem;">
> 导出是否附带图片
<task-retrace </div>
v-if="retraceVisible" <div class="dialog-footer">
@cancel="retraceCancel" <el-button type="primary" @click="submitForm(true)"> </el-button>
:dialogItem="dialogItem" <el-button @click="submitForm(false)"> </el-button>
></task-retrace> </div>
</template>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { Loading } from "element-ui";
import TaskRetrace from "./components/task-retrace.vue"; import TaskRetrace from "./components/task-retrace.vue";
import TaskView from "./components/task-view.vue"; import TaskView from "./components/task-view.vue";
import { import {
@ -221,8 +141,6 @@ export default {
roadType: [], roadType: [],
// //
roadList: [], roadList: [],
//
loading: false,
// //
checkIds: [], checkIds: [],
// //
@ -244,6 +162,10 @@ export default {
retraceVisible: false, retraceVisible: false,
// //
defectCascaderList: [], defectCascaderList: [],
//
exportVisible: false,
}; };
}, },
created() { created() {
@ -291,7 +213,7 @@ export default {
* @param {*} * @param {*}
* @return {*} * @return {*}
*/ */
handleSelect() {}, handleSelect() { },
/** /**
* @description: 获取巡检路段下拉数据 * @description: 获取巡检路段下拉数据
@ -394,16 +316,45 @@ export default {
/** /**
* @description: 点击导出事件 * @description: 点击导出事件
* @return {*}
*/
handelExpport(item) {
this.exportVisible = true;
this.dialogItem = item;
},
/**
* @description: 导出文件
* @return {*}
*/
submitForm(type) {
this.wordExport(this.dialogItem, type)
},
/**
* @description: 导出文件的方法
* @param {*} item * @param {*} item
* @return {*} * @return {*}
*/ */
handleExport(item) { wordExport(item, type) {
exportDefectData({ taskId: item.extId }).then(({ code, data }) => { Loading.service({ fullscreen: true });
if(code===200){ let loadingInstance = Loading.service({ fullscreen: true });
console.log(data,'ddd'); exportDefectData({ taskId: item.extId, media: type }).then((res) => {
const link = document.createElement("a");
} const blob = new Blob([res], {
type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
}); });
link.style.display = "none";
link.href = URL.createObjectURL(blob);
// TODO
link.download = item.extId;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}).finally(() => {
this.exportCancel()
loadingInstance.close();
})
}, },
/** /**
@ -443,6 +394,15 @@ export default {
this.retraceVisible = false; this.retraceVisible = false;
this.dialogItem = {}; this.dialogItem = {};
}, },
/**
* @description: 关闭导出弹窗
* @return {*}
*/
exportCancel() {
this.exportVisible = false;
this.dialogItem = {};
}
}, },
}; };
</script> </script>
@ -474,11 +434,13 @@ export default {
/* 新增弹窗/编辑弹窗 */ /* 新增弹窗/编辑弹窗 */
.addForm { .addForm {
.el-select, .el-select,
.el-cascader { .el-cascader {
width: 100%; width: 100%;
} }
} }
/* 新增地图框样式 */ /* 新增地图框样式 */
.no-hand-cursor { .no-hand-cursor {
cursor: default !important; cursor: default !important;
@ -521,5 +483,10 @@ export default {
background-color: #2e3a46; background-color: #2e3a46;
} }
} }
</style>
/* 页脚 */
.dialog-footer {
display: flex;
justify-content: flex-end;
}
</style>

View File

@ -160,7 +160,6 @@
icon="el-icon-plus" icon="el-icon-plus"
size="mini" size="mini"
@click="handleAdd" @click="handleAdd"
v-hasPermi="['system:defect:add']"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
@ -172,7 +171,6 @@
size="mini" size="mini"
:disabled="multiple" :disabled="multiple"
@click="handleDelete" @click="handleDelete"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
@ -183,7 +181,6 @@
icon="el-icon-download" icon="el-icon-download"
size="mini" size="mini"
@click="handleExport" @click="handleExport"
v-hasPermi="['system:defect:export']"
>导出 >导出
</el-button> </el-button>
</el-col> --> </el-col> -->
@ -195,7 +192,6 @@
size="mini" size="mini"
:disabled="single" :disabled="single"
@click="handleUpdateBatch" @click="handleUpdateBatch"
v-hasPermi="['system:defect:edit']"
>批量确认 >批量确认
</el-button> </el-button>
</el-col> --> </el-col> -->
@ -264,7 +260,6 @@
type="text" type="text"
icon="el-icon-edit" icon="el-icon-edit"
@click="handleUpdate(scope.row)" @click="handleUpdate(scope.row)"
v-hasPermi="['system:defect:edit']"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
@ -272,7 +267,6 @@
type="text" type="text"
icon="el-icon-delete" icon="el-icon-delete"
@click="handleDelete(scope.row)" @click="handleDelete(scope.row)"
v-hasPermi="['system:defect:remove']"
>删除 >删除
</el-button> </el-button>
</template> </template>

View File

@ -60,8 +60,8 @@
style="width: 100%" style="width: 100%"
> >
<el-table-column type="selection" width="55" align="center" /> <el-table-column type="selection" width="55" align="center" />
<el-table-column label="设备编号" align="center" prop="segmentCode" /> <el-table-column label="设备编号" align="center" prop="clientId" />
<el-table-column label="所属车辆" align="center" prop="segmentCode" /> <el-table-column label="所属车辆" align="center" prop="plateNo" />
<el-table-column label="作业范围" align="center" prop="segmentCode" /> <el-table-column label="作业范围" align="center" prop="segmentCode" />
<el-table-column label="设备状态" align="center" prop="name" /> <el-table-column label="设备状态" align="center" prop="name" />
<el-table-column label="网络连接" align="center" prop="name" /> <el-table-column label="网络连接" align="center" prop="name" />
@ -206,9 +206,9 @@ export default {
...this.searchForm, ...this.searchForm,
...this.pagination, ...this.pagination,
}; };
getTerminalList(params).then(({ code, data }) => { getTerminalList(params).then(({ code, rows }) => {
if (code === 200) { if (code === 200) {
this.sectionList = data.rows; this.sectionList = rows;
} }
}); });
}, },

View File

@ -29,7 +29,6 @@
type="text" type="text"
icon="el-icon-circle-check" icon="el-icon-circle-check"
@click="handleConfirm(scope.row)" @click="handleConfirm(scope.row)"
v-hasPermi="['system:defect:edit']"
>订阅 >订阅
</el-button> </el-button>
<el-button <el-button
@ -38,7 +37,6 @@
type="text" type="text"
icon="el-icon-circle-close" icon="el-icon-circle-close"
@click="handleCancel(scope.row)" @click="handleCancel(scope.row)"
v-hasPermi="['system:defect:edit']"
>取消订阅 >取消订阅
</el-button> </el-button>
</template> </template>