diff --git a/src/api/xj/defect.js b/src/api/xj/defect.js index 76e6dab..ab228fe 100644 --- a/src/api/xj/defect.js +++ b/src/api/xj/defect.js @@ -1,44 +1,53 @@ -import request from '@/utils/request' +/* + * @Author: SunTao 328867980@qq.com + * @Date: 2024-10-08 09:26:24 + * @LastEditors: SunTao 328867980@qq.com + * @LastEditTime: 2024-11-05 13:40:07 + * @FilePath: \znxjxt-ui\src\api\xj\defect.js + * @Description: 巡检信息-病害管理接口 + */ +import request from "@/utils/request"; // 查询病害日志列表 export function listDefect(query) { return request({ - url: '/xj/defect/list', - method: 'get', - params: query - }) + url: "/xj/defect/list", + method: "get", + params: query, + }); } // 查询病害日志详细 export function getDefect(id) { return request({ - url: '/xj/defect/' + id, - method: 'get' - }) + url: "/xj/defect/" + id, + method: "get", + }); } // 新增病害日志 export function addDefect(data) { return request({ - url: '/xj/defect', - method: 'post', - data: data - }) + url: "/xj/defect", + method: "post", + data: data, + }); } // 修改病害日志 export function updateDefect(data) { return request({ - url: '/xj/defect', - method: 'put', - data: data - }) + url: "/xj/defect", + method: "put", + data: data, + }); } // 删除病害日志 export function delDefect(id) { return request({ - url: '/xj/defect/' + id, - method: 'delete' - }) + url: "/xj/defect/" + id, + method: "delete", + }); } + diff --git a/src/api/xj/disease.js b/src/api/xj/disease.js index 1228774..2b943bc 100644 --- a/src/api/xj/disease.js +++ b/src/api/xj/disease.js @@ -2,7 +2,7 @@ * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git * @Date: 2024-10-08 09:26:24 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-12 14:30:08 + * @LastEditTime: 2024-11-05 13:54:44 * @FilePath: \znxjxt-ui\src\api\xj\disease.js * @Description: 巡检信息-病害管理 */ @@ -120,3 +120,23 @@ export function splitDefect(data) { data, }); } + + +// 根据病害id查询快照id下拉 +export function getDefectById(id) { + return request({ + url: "/xj/defect/getDefectDetailDropDownList", + method: "get", + params: { id }, + }); +} + + +// 根据快照id查询查询具体数据 +export function getDetailsBySnapShotId(snapShotId) { + return request({ + url: "/xj/defect/getDefectBySnapShotId", + method: "get", + params: { snapShotId }, + }); +} \ No newline at end of file diff --git a/src/api/xj/surface.js b/src/api/xj/surface.js new file mode 100644 index 0000000..1de0a9c --- /dev/null +++ b/src/api/xj/surface.js @@ -0,0 +1,37 @@ +/* + * @Author: SunTao 328867980@qq.com + * @Date: 2024-11-05 14:40:14 + * @LastEditors: SunTao 328867980@qq.com + * @LastEditTime: 2024-11-05 14:59:15 + * @FilePath: \znxjxt-ui\src\api\xj\surface.js + * @Description: 路面病害对比 + */ + +import request from "@/utils/request"; + +// 查询路段下拉数据接口 +export function getSegment() { + return request({ + url: "/api/v2/segment/selectList", + method: "post", + }); +} + +// 病害类型下拉数据 +export function getDefectList(params) { + return request({ + url: "/metadata/defectType", + method: "get", + params, + }); + } + + +// 获取病害详细数据接口 +export function getCompareList(params) { + return request({ + url: "/xj/defect/historyCompare", + method: "get", + params, + }); + } diff --git a/src/assets/index/daily-content.png b/src/assets/index/daily-content.png new file mode 100644 index 0000000..47341a6 Binary files /dev/null and b/src/assets/index/daily-content.png differ diff --git a/src/assets/index/disease-content.png b/src/assets/index/disease-content.png new file mode 100644 index 0000000..f19794a Binary files /dev/null and b/src/assets/index/disease-content.png differ diff --git a/src/assets/index/div-title.png b/src/assets/index/div-title.png new file mode 100644 index 0000000..9011b04 Binary files /dev/null and b/src/assets/index/div-title.png differ diff --git a/src/assets/index/left-bkg.png b/src/assets/index/left-bkg.png new file mode 100644 index 0000000..b444686 Binary files /dev/null and b/src/assets/index/left-bkg.png differ diff --git a/src/assets/index/middle-item-0.png b/src/assets/index/middle-item-0.png new file mode 100644 index 0000000..4a5f734 Binary files /dev/null and b/src/assets/index/middle-item-0.png differ diff --git a/src/assets/index/middle-item-1.png b/src/assets/index/middle-item-1.png new file mode 100644 index 0000000..1925475 Binary files /dev/null and b/src/assets/index/middle-item-1.png differ diff --git a/src/assets/index/middle-item-2.png b/src/assets/index/middle-item-2.png new file mode 100644 index 0000000..399b5bf Binary files /dev/null and b/src/assets/index/middle-item-2.png differ diff --git a/src/assets/index/middle-item-3.png b/src/assets/index/middle-item-3.png new file mode 100644 index 0000000..0f1e662 Binary files /dev/null and b/src/assets/index/middle-item-3.png differ diff --git a/src/assets/index/middle-item-4.png b/src/assets/index/middle-item-4.png new file mode 100644 index 0000000..13cea12 Binary files /dev/null and b/src/assets/index/middle-item-4.png differ diff --git a/src/assets/index/middle-item-5.png b/src/assets/index/middle-item-5.png new file mode 100644 index 0000000..183ab6c Binary files /dev/null and b/src/assets/index/middle-item-5.png differ diff --git a/src/assets/index/middle-item-6.png b/src/assets/index/middle-item-6.png new file mode 100644 index 0000000..6719e0c Binary files /dev/null and b/src/assets/index/middle-item-6.png differ diff --git a/src/assets/index/middle-item-7.png b/src/assets/index/middle-item-7.png new file mode 100644 index 0000000..9aa8392 Binary files /dev/null and b/src/assets/index/middle-item-7.png differ diff --git a/src/assets/index/road-content.png b/src/assets/index/road-content.png new file mode 100644 index 0000000..8f826f9 Binary files /dev/null and b/src/assets/index/road-content.png differ diff --git a/src/assets/index/top-content.png b/src/assets/index/top-content.png new file mode 100644 index 0000000..c356d38 Binary files /dev/null and b/src/assets/index/top-content.png differ diff --git a/src/assets/index/top-div-0.png b/src/assets/index/top-div-0.png new file mode 100644 index 0000000..4b3e674 Binary files /dev/null and b/src/assets/index/top-div-0.png differ diff --git a/src/assets/index/top-div-1.png b/src/assets/index/top-div-1.png new file mode 100644 index 0000000..4952acf Binary files /dev/null and b/src/assets/index/top-div-1.png differ diff --git a/src/assets/index/top-div-2.png b/src/assets/index/top-div-2.png new file mode 100644 index 0000000..4324cf5 Binary files /dev/null and b/src/assets/index/top-div-2.png differ diff --git a/src/assets/index/top-div-3.png b/src/assets/index/top-div-3.png new file mode 100644 index 0000000..2039cae Binary files /dev/null and b/src/assets/index/top-div-3.png differ diff --git a/src/assets/index/top-div-title.png b/src/assets/index/top-div-title.png new file mode 100644 index 0000000..11733b9 Binary files /dev/null and b/src/assets/index/top-div-title.png differ diff --git a/src/views/big-screen/index.vue b/src/views/big-screen/index.vue index b31037e..70b7e4f 100644 --- a/src/views/big-screen/index.vue +++ b/src/views/big-screen/index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-17 11:34:00 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-11-05 10:23:53 + * @LastEditTime: 2024-11-06 10:32:20 * @FilePath: \znxjxt-ui\src\views\big-screen\index.vue * @Description: 大屏首页 --> @@ -409,7 +409,7 @@ export default { { name: "沈抚", left: "63%", - top: "15%", + top: "12%", tip: "1", }, { @@ -438,7 +438,7 @@ export default { }, { name: "抚顺", - left: "75%", + left: "56%", top: "17%", tip: "1", }, @@ -468,8 +468,8 @@ export default { }, { name: "沈阳", - left: "54%", - top: "12%", + left: "51%", + top: "11%", tip: "2", }, { @@ -496,6 +496,12 @@ export default { top: "39%", tip: "6", }, + { + name: "金普", + left: "47%", + top: "57%", + tip: "6", + }, ]; }, /* 点击病害筛查 */ @@ -568,7 +574,11 @@ export default { const point = new Point(element.geometry); const feature = new Feature({ geometry: point, - data: { iconType: element.iconType }, + data: { + iconType: element.iconType, + mediaUrl: element.mediaUrl, + rect: element.rect, + }, // 自己设置一个标识 type: "icon", }); diff --git a/src/views/index-components/daily-index.vue b/src/views/index-components/daily-index.vue index f8e40bc..d9c1289 100644 --- a/src/views/index-components/daily-index.vue +++ b/src/views/index-components/daily-index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-29 15:12:20 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-30 13:10:04 + * @LastEditTime: 2024-11-05 11:47:03 * @FilePath: \znxjxt-ui\src\views\index-components\daily-index.vue * @Description: 首页-日常巡查 --> @@ -378,8 +378,13 @@ export default { .title { width: 100%; height: 10%; + display: flex; + align-items: center; padding-left: 3rem; font-family: "DouYu"; + background: url("../../assets/index/div-title.png") no-repeat; + background-size: 5%; + background-position: 0 30%; } .daily-content { @@ -391,15 +396,18 @@ export default { .left { width: 20%; height: 100%; + background: url("../../assets/index/left-bkg.png") no-repeat; + background-size: 100%; .left-div { height: 27.5%; - width: 100%; + width: calc(100% - 2rem); + margin: 0 1rem; display: flex; flex-direction: column; justify-content: center; align-items: center; - border: 1px red solid; + border-bottom: 1px #adc6e5 solid; .name { font-size: 0.8rem; @@ -421,7 +429,6 @@ export default { width: 100%; text-align: center; line-height: 3rem; - border: 1px red solid; } } @@ -432,7 +439,7 @@ export default { > div { height: 50%; width: 100%; - border: 1px red solid; + background-color: #ffffff; } } } diff --git a/src/views/index-components/disease-index.vue b/src/views/index-components/disease-index.vue index 91961e9..b9aacb8 100644 --- a/src/views/index-components/disease-index.vue +++ b/src/views/index-components/disease-index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-29 15:17:58 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-31 09:15:52 + * @LastEditTime: 2024-11-05 11:51:10 * @FilePath: \znxjxt-ui\src\views\index-components\disease-index.vue * @Description: 首页-病害识别 --> @@ -362,8 +362,13 @@ export default { .title { width: 100%; height: 10%; + display: flex; + align-items: center; padding-left: 3rem; font-family: "DouYu"; + background: url("../../assets/index/div-title.png") no-repeat; + background-size: 5%; + background-position: 0 30%; } .disease-content { @@ -375,15 +380,17 @@ export default { .left { width: 20%; height: 100%; + background: url("../../assets/index/left-bkg.png") no-repeat; + background-size: 100%; > div { height: 50%; - width: 100%; + width: calc(100% - 2rem); + margin: 0 1rem; display: flex; flex-direction: column; justify-content: center; align-items: center; - border: 1px red solid; .name { font-size: 0.8rem; @@ -398,6 +405,10 @@ export default { font-size: 1.5rem; } } + + &:nth-child(1) { + border-bottom: 1px #adc6e5 solid; + } } } @@ -418,9 +429,8 @@ export default { height: 50%; width: 100%; display: flex; - position: relative; - border: 1px red solid; + background-color: #ffffff; .distribution-div { width: 30%; diff --git a/src/views/index-components/road-index.vue b/src/views/index-components/road-index.vue index 051c8dd..74ce06c 100644 --- a/src/views/index-components/road-index.vue +++ b/src/views/index-components/road-index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-29 15:23:44 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-30 14:15:44 + * @LastEditTime: 2024-11-06 10:48:26 * @FilePath: \znxjxt-ui\src\views\index-components\road-index.vue * @Description: 首页-公路资产 --> @@ -193,8 +193,13 @@ export default { .title { width: 100%; height: 10%; + display: flex; + align-items: center; padding-left: 3rem; font-family: "DouYu"; + background: url("../../assets/index/div-title.png") no-repeat; + background-size: 5%; + background-position: 0 30%; } .top-div { @@ -202,6 +207,9 @@ export default { height: 10%; display: flex; align-items: center; + padding-left: 3rem; + background: url("../../assets/index/top-div-title.png") no-repeat; + background-size: 100% 100%; a { margin-top: 0.4rem; @@ -212,6 +220,7 @@ export default { width: 1.2rem; margin: 0 0.1rem; font-size: 1.5rem; + color: #388bd8; background: #ffffff; box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 0, 0.16); border-radius: 3px 3px 3px 3px; @@ -226,17 +235,57 @@ export default { flex-wrap: wrap; justify-content: space-around; align-items: flex-end; - border: 1px solid red; .middle-item { - width: 21%; + width: 24%; height: 40%; - padding: 0 0.5rem 0 2.5rem; + padding: 0 0.5rem 0 3rem; display: flex; align-items: center; justify-content: space-between; background-color: #f2f9fe; border-radius: 0.2rem; + font-size: 0.9rem; + } + + .middle-item-0 { + background: url("../../assets/index/middle-item-0.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-1 { + background: url("../../assets/index/middle-item-1.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-2 { + background: url("../../assets/index/middle-item-2.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-3 { + background: url("../../assets/index/middle-item-3.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-4 { + background: url("../../assets/index/middle-item-4.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-5 { + background: url("../../assets/index/middle-item-5.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-6 { + background: url("../../assets/index/middle-item-6.png") no-repeat; + background-size: 120% 100%; + } + + .middle-item-7 { + background: url("../../assets/index/middle-item-7.png") no-repeat; + background-size: 120% 100%; } } diff --git a/src/views/index-components/traffic-index.vue b/src/views/index-components/traffic-index.vue index 3c350e5..2b84176 100644 --- a/src/views/index-components/traffic-index.vue +++ b/src/views/index-components/traffic-index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-29 15:30:35 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-30 14:42:47 + * @LastEditTime: 2024-11-05 11:46:15 * @FilePath: \znxjxt-ui\src\views\index-components\traffic-index.vue * @Description: 首页-路况评定 --> @@ -221,8 +221,13 @@ export default { .title { width: 100%; height: 10%; + display: flex; + align-items: center; padding-left: 3rem; font-family: "DouYu"; + background: url("../../assets/index/div-title.png") no-repeat; + background-size: 5%; + background-position: 0 30%; } .traffic-table { diff --git a/src/views/index.vue b/src/views/index.vue index 879ef72..f6b59e0 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-08 09:26:24 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-29 15:30:19 + * @LastEditTime: 2024-11-06 10:50:32 * @FilePath: \znxjxt-ui\src\views\index.vue * @Description: 系统首页 --> @@ -92,13 +92,13 @@ export default { display: flex; align-items: center; justify-content: space-around; - border: 1px salmon solid; + background: url("../assets/index/top-content.png") no-repeat; + background-size: 100%; .top-div { width: 22%; height: 80%; padding: 1.5rem; - background-color: aqua; .name { font-family: "DouYu"; @@ -112,6 +112,26 @@ export default { } } } + + .top-div-0 { + background: url("../assets/index/top-div-0.png") no-repeat; + background-size: 100%; + } + + .top-div-1 { + background: url("../assets/index/top-div-1.png") no-repeat; + background-size: 100%; + } + + .top-div-2 { + background: url("../assets/index/top-div-2.png") no-repeat; + background-size: 100%; + } + + .top-div-3 { + background: url("../assets/index/top-div-3.png") no-repeat; + background-size: 100%; + } } .middle-content { @@ -119,14 +139,22 @@ export default { height: 60%; display: flex; justify-content: space-between; - border: 1px red solid; .daily-content, .disease-content { width: 49.5%; height: calc(100% - 1rem); margin-top: 1rem; - border: 1px blue solid; + } + + .daily-content { + background: url("../assets/index/daily-content.png") no-repeat; + background-size: 100%; + } + + .disease-content { + background: url("../assets/index/disease-content.png") no-repeat; + background-size: 107% 100%; } } @@ -135,14 +163,14 @@ export default { height: 60%; display: flex; justify-content: space-between; - border: 1px red solid; .road-content, .traffic-content { width: 49.5%; height: calc(100% - 1rem); margin-top: 1rem; - border: 1px blue solid; + background: url("../assets/index/road-content.png") no-repeat; + background-size: 112% 100%; } } diff --git a/src/views/xj/inspection/disease-management/index.vue b/src/views/xj/inspection/disease-management/index.vue index 1550cba..62793ff 100644 --- a/src/views/xj/inspection/disease-management/index.vue +++ b/src/views/xj/inspection/disease-management/index.vue @@ -2,7 +2,7 @@ * @Author: error: error: git config user.name & please set dead value or install git && error: git config user.email & please set dead value or install git & please set dead value or install git * @Date: 2024-10-08 10:58:25 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-11-05 09:21:16 + * @LastEditTime: 2024-11-05 15:05:42 * @FilePath: \znxjxt-ui\src\views\xj\inspection\disease-management .vue * @Description: 巡检信息管理-病害管理 --> @@ -521,30 +521,48 @@ >
-
- -
-

- 上报日期：{{ new Date(viewForm.createdTime).toLocaleString() }} -

-

路段名称：{{ viewForm.segmentName }}

- -

病害类型：{{ filterDefect(viewForm.defectType) }}

-

病害长度：{{ viewForm.targetLen }} 米

-

病害id：{{ viewForm.id }}

-

快照id：{{ viewForm.snapshotId }}

-
- - -
- - + +
+ + - 病害图片 - - + + +
+
+ +
+

+ 上报日期：{{ new Date(viewForm.createdTime).toLocaleString() }} +

+

路段名称：{{ viewForm.segmentName }}

+ +

病害类型：{{ filterDefect(viewForm.defectType) }}

+

病害长度：{{ viewForm.targetLen }} 米

+

病害id：{{ viewForm.id }}

+

快照id：{{ viewForm.snapshotId }}

+
+ + +
+ + + 病害图片 + + +
@@ -615,6 +633,8 @@ import { getDefectStatus, changeDefectStatus, splitDefect, + getDefectById, + getDetailsBySnapShotId, } from "@/api/xj/disease"; import { getToken } from "@/utils/auth"; import MergeDialog from "./components/merge-dialog.vue"; @@ -755,6 +775,10 @@ export default { defectStatus: [], // 新增/编辑打点数组 markers: [], + // 查看弹窗选择绑定 + viewCheck: "", + // 查看弹窗下拉数据绑定 + viewOptions: [], // 查看弹窗信息绑定 viewForm: {}, // 地图中心点 @@ -1157,6 +1181,8 @@ export default { /* 点击行列表查看事件 */ viewDefect(defect) { // this.loadDefect(defect.id); + this.getSnapShotIdList(defect.id); + this.viewCheck = defect.snapshotId; this.openViewDialog = true; this.viewForm = defect; this.$nextTick(() => { @@ -1177,6 +1203,24 @@ export default { }); }, + /* 根据病害id获取所有下拉快照数据 */ + getSnapShotIdList(id) { + getDefectById(id).then(({ code, data }) => { + if (code === 200) { + this.viewOptions = data; + } + }); + }, + + /* 查看弹窗选择改变触发事件 */ + changeView(val) { + getDetailsBySnapShotId(val).then(({code,data})=>{ + if(code===200){ + console.log(data, "fff"); + } + }) + }, + /* 初始化天地图 */ initMap(ele) { // if (this.map) { diff --git a/src/views/xj/inspection/road-management/components/road-add.vue b/src/views/xj/inspection/road-management/components/road-add.vue index 85b39c6..eb5deb5 100644 --- a/src/views/xj/inspection/road-management/components/road-add.vue +++ b/src/views/xj/inspection/road-management/components/road-add.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-11 16:52:24 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-25 11:17:56 + * @LastEditTime: 2024-11-05 15:18:59 * @FilePath: \znxjxt-ui\src\views\xj\inspection\road-management\components\road-add.vue * @Description: 路产管理-新增/编辑弹窗 --> @@ -182,8 +182,6 @@ export default { return { // 表单绑定 roadForm: {}, - // 验证规则 - rules: {}, // 校验状态下拉数据 states: [ { diff --git a/src/views/xj/inspection/surface-management/components/surface-map.vue b/src/views/xj/inspection/surface-management/components/surface-map.vue index 6335bc0..6ed1909 100644 --- a/src/views/xj/inspection/surface-management/components/surface-map.vue +++ b/src/views/xj/inspection/surface-management/components/surface-map.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-14 14:49:21 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-15 11:50:48 + * @LastEditTime: 2024-11-06 10:24:29 * @FilePath: \znxjxt-ui\src\views\xj\inspection\surface-management\components\surface-map.vue * @Description: 路面病害管理-地图组件 --> @@ -12,7 +12,7 @@
@@ -21,11 +21,7 @@
-
+
@@ -45,10 +41,18 @@ export default { components: { FssmScroll, FssmMap }, name: "SurfaceMap", props: { + id: { + type: String, + default: "", + }, mapObject: { type: Object, default: () => {}, }, + mapLogeList: { + type: Object, + default: () => {}, + }, }, data() { return { @@ -57,6 +61,17 @@ export default { // }; }, + watch: { + mapObject: { + handler(val) { + if (this.$refs.contentMap && Object.keys(val).length > 0) { + this.drawMapPoints(); + } + }, + deep: true, + immediate: true, + }, + }, mounted() {}, created() {}, methods: { @@ -64,20 +79,30 @@ export default { drawMapPoints() { this.$refs.contentMap.clearMapFeature(); const features = []; - this.mapObject.centerList.forEach((element) => { - const point = new Point(element); // 修改坐标格式 + this.mapObject.data.forEach((element) => { + const point = new Point([ + element.coordinates[0], + element.coordinates[1], + ]); // 修改坐标格式 const feature = new Feature({ geometry: point, - custom: { data: "123", type: "icon", id: this.mapObject.id }, // 可以放一些自己的数据 + custom: { + mediaUrl: element.mediaUrl, + rect: element.rect, + id: element.id, + }, // 可以放一些自己的数据 type: "icon", // 自己设置一个标识 }); feature.setStyle([ new Style({ image: new Icon({ crossOrigin: "anonymous", - src: logo, + src: require(`@/assets/screen/index/${ + this.mapLogeList[element.defectType] + }.png`), // size: [40, 40], - scale: 0.05, // 图标缩放比例 + scale: 0.5, // 图标缩放比例 + displacement: [0, 30], }), }), ]); @@ -96,11 +121,12 @@ export default { this.$nextTick(() => { const map = this.$refs.contentMap.instance.get("map"); map.addLayer(markLayerPoints); + this.initEchart(); }); }, /* 清除地图图层 */ cleanLayer() { - this.$emit("clearId", this.mapObject.id); + this.$emit("clearMap"); this.$refs.contentMap.clearMapFeature(); }, /* 图层点击事件 */ @@ -108,12 +134,19 @@ export default { if (feature && feature.get("type")) { this.$emit("send-img", { data: feature.get("custom"), - id: this.mapObject.id, + // id: this.mapObject.id, }); } }, /* 绘制柱状图 */ initEchart() { + console.log(this.mapObject, "this.mapObject.data"); + const xData = this.mapObject.scale.map((item) => { + return item.label; + }); + const yData = this.mapObject.scale.map((item) => { + return item.value; + }); if (this.$refs.echart) { const chart = echarts.init(this.$refs.echart); chart.setOption({ @@ -123,7 +156,6 @@ export default { bottom: "0%", left: "center", itemHeight: 10, - data: ["1111", "2222", "3333", "4444"], }, //图表位置 grid: { @@ -141,21 +173,7 @@ export default { }, xAxis: { type: "category", - data: [ - "Mon", - "Tue", - "Wed", - "Thu", - "Fri", - "Sat", - "Sun", - "1", - "2", - "3", - "4", - "5", - "6", - ], + data: xData, //坐标轴刻度 axisTick: { show: false, @@ -176,7 +194,7 @@ export default { yAxis: [ { type: "value", - name: "单位：家", + name: "单位：个", nameTextStyle: { color: "#616367", }, @@ -211,40 +229,11 @@ export default { { //该柱状图颜色 // color:"", - name: "1111", + // name: "1111", //柱状图的粗细--可以”20%“ - barWidth: 6, + barWidth: "20%", color: "#72A1FF", - data: [ - 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, - ], - type: "bar", - }, - { - name: "2222", - barWidth: 6, - color: "#73ECAF", - data: [ - 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, - ], - type: "bar", - }, - { - name: "3333", - barWidth: 6, - color: "#FF7D74", - data: [ - 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, - ], - type: "bar", - }, - { - name: "4444", - barWidth: 6, - color: "#FCD678", - data: [ - 120, 200, 150, 80, 70, 110, 130, 120, 200, 150, 80, 70, 110, - ], + data: yData, type: "bar", }, ], diff --git a/src/views/xj/inspection/surface-management/index.vue b/src/views/xj/inspection/surface-management/index.vue index f962e88..31d1b06 100644 --- a/src/views/xj/inspection/surface-management/index.vue +++ b/src/views/xj/inspection/surface-management/index.vue @@ -2,7 +2,7 @@ * @Author: SunTao 328867980@qq.com * @Date: 2024-10-14 13:59:51 * @LastEditors: SunTao 328867980@qq.com - * @LastEditTime: 2024-10-15 13:06:06 + * @LastEditTime: 2024-11-06 10:17:47 * @FilePath: \znxjxt-ui\src\views\xj\inspection\surface-management\index.vue * @Description: 巡检管理-路面病害对比 --> @@ -18,9 +18,9 @@ :rules="rules" label-width="7rem" > - + @@ -32,22 +32,23 @@ /> - +
-
+
+
+
+
@@ -83,18 +92,40 @@
-
- +
+ Main Image +
-
- +
+ Main Image +
@@ -102,6 +133,7 @@