From 0488cc32d225a28289ba6c70a2a297f347cacdad Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期一, 16 三月 2026 17:34:18 +0800
Subject: [PATCH] 2026.3.16
---
public/现场监管场景信息导入模板.xlsx | 0
src/utils/map/util.js | 93 +-
public/秋冬季空气质量攻坚工作提示模板.docx | 0
src/views/inspection/scene/SceneInspectFile.vue | 235 ++---
public/扬尘污染监管简报模板.docx | 0
src/views/inspection/task/TaskManage.vue | 10
public/扬尘监测数据月度统计模板.xlsx | 0
src/constants/menu.js | 23
public/工地巡查单据模板-详版.docx | 0
src/router/index.js | 10
src/utils/map/marks.js | 494 +++++++++++--
src/views/monitor/DataDashboard.vue | 591 +++++++++++++++-
public/工地巡查单据模板-简版.docx | 0
public/单体模版-v1.0.docx | 0
src/views/inspection/task/components/CompSubTaskList.vue | 15
src/components/map/BaseMap.vue | 27
src/views/inspection/task/components/CompMonitorObjEdit.vue | 355 ++++-----
public/餐饮巡查单据模板.docx | 0
src/debug/debugdata.js | 125 +++
src/utils/map/index.js | 22
src/utils/map/districtsearch.js | 39 +
public/单体模版（静安）.docx | 0
22 files changed, 1,486 insertions(+), 553 deletions(-)
diff --git "a/public/\345\215\225\344\275\223\346\250\241\347\211\210-v1.0.docx" "b/public/\345\215\225\344\275\223\346\250\241\347\211\210-v1.0.docx"
new file mode 100644
index 0000000..1e02d3f
--- /dev/null
+++ "b/public/\345\215\225\344\275\223\346\250\241\347\211\210-v1.0.docx"
Binary files differ
diff --git "a/public/\345\215\225\344\275\223\346\250\241\347\211\210\357\274\210\351\235\231\345\256\211\357\274\211.docx" "b/public/\345\215\225\344\275\223\346\250\241\347\211\210\357\274\210\351\235\231\345\256\211\357\274\211.docx"
new file mode 100644
index 0000000..e592286
--- /dev/null
+++ "b/public/\345\215\225\344\275\223\346\250\241\347\211\210\357\274\210\351\235\231\345\256\211\357\274\211.docx"
Binary files differ
diff --git "a/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\347\256\200\347\211\210.docx" "b/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\347\256\200\347\211\210.docx"
new file mode 100644
index 0000000..e6551f3
--- /dev/null
+++ "b/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\347\256\200\347\211\210.docx"
Binary files differ
diff --git "a/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\350\257\246\347\211\210.docx" "b/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\350\257\246\347\211\210.docx"
new file mode 100644
index 0000000..f8c711a
--- /dev/null
+++ "b/public/\345\267\245\345\234\260\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277-\350\257\246\347\211\210.docx"
Binary files differ
diff --git "a/public/\346\211\254\345\260\230\346\261\241\346\237\223\347\233\221\347\256\241\347\256\200\346\212\245\346\250\241\346\235\277.docx" "b/public/\346\211\254\345\260\230\346\261\241\346\237\223\347\233\221\347\256\241\347\256\200\346\212\245\346\250\241\346\235\277.docx"
new file mode 100644
index 0000000..9476e07
--- /dev/null
+++ "b/public/\346\211\254\345\260\230\346\261\241\346\237\223\347\233\221\347\256\241\347\256\200\346\212\245\346\250\241\346\235\277.docx"
Binary files differ
diff --git "a/public/\346\211\254\345\260\230\347\233\221\346\265\213\346\225\260\346\215\256\346\234\210\345\272\246\347\273\237\350\256\241\346\250\241\346\235\277.xlsx" "b/public/\346\211\254\345\260\230\347\233\221\346\265\213\346\225\260\346\215\256\346\234\210\345\272\246\347\273\237\350\256\241\346\250\241\346\235\277.xlsx"
new file mode 100644
index 0000000..99e9c25
--- /dev/null
+++ "b/public/\346\211\254\345\260\230\347\233\221\346\265\213\346\225\260\346\215\256\346\234\210\345\272\246\347\273\237\350\256\241\346\250\241\346\235\277.xlsx"
Binary files differ
diff --git "a/public/\347\216\260\345\234\272\347\233\221\347\256\241\345\234\272\346\231\257\344\277\241\346\201\257\345\257\274\345\205\245\346\250\241\346\235\277.xlsx" "b/public/\347\216\260\345\234\272\347\233\221\347\256\241\345\234\272\346\231\257\344\277\241\346\201\257\345\257\274\345\205\245\346\250\241\346\235\277.xlsx"
new file mode 100644
index 0000000..0ad502b
--- /dev/null
+++ "b/public/\347\216\260\345\234\272\347\233\221\347\256\241\345\234\272\346\231\257\344\277\241\346\201\257\345\257\274\345\205\245\346\250\241\346\235\277.xlsx"
Binary files differ
diff --git "a/public/\347\247\213\345\206\254\345\255\243\347\251\272\346\260\224\350\264\250\351\207\217\346\224\273\345\235\232\345\267\245\344\275\234\346\217\220\347\244\272\346\250\241\346\235\277.docx" "b/public/\347\247\213\345\206\254\345\255\243\347\251\272\346\260\224\350\264\250\351\207\217\346\224\273\345\235\232\345\267\245\344\275\234\346\217\220\347\244\272\346\250\241\346\235\277.docx"
new file mode 100644
index 0000000..20ea4b8
--- /dev/null
+++ "b/public/\347\247\213\345\206\254\345\255\243\347\251\272\346\260\224\350\264\250\351\207\217\346\224\273\345\235\232\345\267\245\344\275\234\346\217\220\347\244\272\346\250\241\346\235\277.docx"
Binary files differ
diff --git "a/public/\351\244\220\351\245\256\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277.docx" "b/public/\351\244\220\351\245\256\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277.docx"
new file mode 100644
index 0000000..a81bf9b
--- /dev/null
+++ "b/public/\351\244\220\351\245\256\345\267\241\346\237\245\345\215\225\346\215\256\346\250\241\346\235\277.docx"
Binary files differ
diff --git a/src/components/map/BaseMap.vue b/src/components/map/BaseMap.vue
index 3da7233..485f248 100644
--- a/src/components/map/BaseMap.vue
+++ b/src/components/map/BaseMap.vue
@@ -3,17 +3,30 @@
</template>
<script setup>
-import { onMounted, onUnmounted } from 'vue';
-import { createMap, map, destroyMap } from '@/utils/map/index';
+import { onMounted, onUnmounted } from 'vue'
+import { onMapMounted, createMap, satellite, map, destroyMap } from '@/utils/map/index'
+const props = defineProps({
+ showSatellite: {
+ type: Boolean,
+ default: false,
+ },
+})
onMounted(() => {
// 楂樺痉鍦板浘鍒濆鍖�
setTimeout(() => {
- createMap('container');
- }, 1000);
-});
+ createMap('container')
+ onMapMounted(() => {
+ if (props.showSatellite) {
+ satellite.show()
+ } else {
+ satellite.hide()
+ }
+ })
+ }, 1000)
+})
onUnmounted(() => {
- destroyMap();
-});
+ destroyMap()
+})
</script>
<style>
#container {
diff --git a/src/constants/menu.js b/src/constants/menu.js
index 742e0c1..0d87fdf 100644
--- a/src/constants/menu.js
+++ b/src/constants/menu.js
@@ -14,10 +14,22 @@
name: '鐩戞祴棰勮',
},
{
- path: '/index/monitor/data-analysis-all',
- icon: 'solar:presentation-graph-line-duotone',
- name: '鏁版嵁鍒嗘瀽',
+ icon: 'solar:structure-line-duotone',
+ name: '鏁版嵁绠＄悊',
+ children: [
+ {
+ path: '/index/monitor/data-analysis-all',
+ icon: 'solar:presentation-graph-line-duotone',
+ name: '鏁版嵁鍒嗘瀽',
+ },
+ {
+ path: '/index/monitor/data-history',
+ icon: 'solar:graph-new-line-duotone',
+ name: '鍘嗗彶鏁版嵁',
+ },
+ ],
},
+
// {
// icon: 'solar:presentation-graph-line-duotone',
// name: '鏁版嵁鍒嗘瀽',
@@ -55,11 +67,6 @@
// },
// ],
// },
- {
- path: '/index/monitor/data-history',
- icon: 'solar:graph-new-line-duotone',
- name: '鍘嗗彶鏁版嵁',
- },
],
},
{
diff --git a/src/debug/debugdata.js b/src/debug/debugdata.js
new file mode 100644
index 0000000..6964a64
--- /dev/null
+++ b/src/debug/debugdata.js
@@ -0,0 +1,125 @@
+function generateTestShops() {
+ // 鎸囧畾鐨勫簵閾哄悕绉�
+ const specifiedShops = [
+ '浠樺皬濮愬湪鎴愰兘',
+ '鍚夊埢鑱旂洘',
+ '瀹跺湪濉斿暒',
+ '鐙兼潵浜�',
+ '涔愬嚡鎾掓槦娓稿簵',
+ '棣ㄨ繙缇庨灏忛晣锛堝搱灏肩編椋熷箍鍦猴級',
+ '妫掔害缈�',
+ '寮勫爞鍜亾',
+ '鏉ㄨ榻愰綈鍝堝皵鐑よ倝',
+ '涓婃捣绋斾紶椁愰ギ绠＄悊鏈夐檺鍏徃锛堜汉鐢熶竴涓诧級',
+ '缂樺',
+ '娉夌洓椁愰ギ锛堜笂娴凤級鏈夐檺鍏徃锛堥鍏跺锛�',
+ '涓拌寕鐑や覆',
+ '涓婃捣娉扮厡椁愰ギ绠＄悊鏈夐檺鍏徃锛堟嘲鐓岄浮锛�',
+ '寰愭眹鍖鸿景鐔欓棣�(灏忛搧鍚涗覆鐑у眳閰掑眿)',
+ ]
+
+ // 闅忔満搴楅摵鍚嶇О鍓嶇紑鍜屽悗缂�
+ const namePrefixes = [
+ '椋庡懗',
+ '鐗硅壊',
+ '姝ｅ畻',
+ '浼犵粺',
+ '缁忓吀',
+ '鍒涙剰',
+ '鏃跺皻',
+ '浼戦棽',
+ '绮捐嚧',
+ '鍦伴亾',
+ ]
+ const nameSuffixes = [
+ '椁愬巺',
+ '楗簵',
+ '閰掓ゼ',
+ '鑿滈',
+ '灏忓悆',
+ '椋熷爞',
+ '缇庨',
+ '楗',
+ '椁愰ギ',
+ '楗簞',
+ ]
+ const cuisines = [
+ '宸濊彍',
+ '绮よ彍',
+ '椴佽彍',
+ '娣壃鑿�',
+ '闂借彍',
+ '婀樿彍',
+ '寰借彍',
+ '娴欒彍',
+ '涓滃寳鑿�',
+ '瑗垮寳鑿�',
+ '瑗块',
+ '鏃ユ枡',
+ '闊╂枡',
+ '涓滃崡浜氳彍',
+ ]
+
+ // 鐜俊鐮佺瓑绾�
+ const ringCodeLevels = [0, 1, 2]
+
+ // 鐢熸垚娴嬭瘯鏁版嵁
+ const shops = []
+
+ // 鍏堟坊鍔犳寚瀹氱殑搴楅摵
+ specifiedShops.forEach((name, index) => {
+ shops.push({
+ shop: {
+ name: name,
+ address: `涓婃捣甯傚緪姹囧尯${index + 1}鍙穈,
+ latitude: 31.17 + Math.random() * 0.1,
+ longitude: 121.45 + Math.random() * 0.1,
+ ringCodeLevel: ringCodeLevels[Math.floor(Math.random() * ringCodeLevels.length)],
+ ringCodePublishTime: '2023-03-16 10:00:00',
+ },
+ recentData: generateRecentData(),
+ })
+ })
+
+ // 鐢熸垚鍓╀綑鐨勯殢鏈哄簵閾�
+ for (let i = specifiedShops.length; i < 100; i++) {
+ const prefix = namePrefixes[Math.floor(Math.random() * namePrefixes.length)]
+ const cuisine = cuisines[Math.floor(Math.random() * cuisines.length)]
+ const suffix = nameSuffixes[Math.floor(Math.random() * nameSuffixes.length)]
+ const randomName = `${prefix}${cuisine}${suffix}${i}`
+
+ shops.push({
+ shop: {
+ name: randomName,
+ address: `涓婃捣甯傚緪姹囧尯${i + 1}鍙穈,
+ latitude: 31.19 + Math.random() * 0.1,
+ longitude: 121.41 + Math.random() * 0.1,
+ ringCodeLevel: ringCodeLevels[Math.floor(Math.random() * ringCodeLevels.length)],
+ ringCodePublishTime: '2023-03-16 10:00:00',
+ },
+ recentData: generateRecentData(),
+ })
+ }
+
+ return shops
+}
+function generateRecentData() {
+ // 鐢熸垚杩�1灏忔椂鐨勭洃娴嬫暟鎹紝姣�10鍒嗛挓涓�鏉�
+ const data = []
+ const now = new Date()
+ now.setFullYear(2023)
+
+ for (let i = 5; i >= 0; i--) {
+ const time = new Date(now.getTime() - i * 10 * 60 * 1000)
+ data.push({
+ sampleTime: time.toISOString().slice(0, 19).replace('T', ' '),
+ oilSmokeConcentration: (Math.random() * 5).toFixed(2),
+ purifierCurrent: (Math.random() * 10).toFixed(2),
+ fanCurrent: (Math.random() * 15).toFixed(2),
+ })
+ }
+
+ return data
+}
+
+export { generateTestShops }
diff --git a/src/router/index.js b/src/router/index.js
index 058233e..40a5b63 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -75,6 +75,16 @@
component: () => import('@/views/inspection/task/TaskManage.vue'),
},
{
+ name: 'monitorObjEdit',
+ path: 'monitorObjEdit',
+ component: () => import('@/views/inspection/task/MonitorObjEdit.vue'),
+ },
+ {
+ name: 'monitorPlanEdit',
+ path: 'monitorPlanEdit',
+ component: () => import('@/views/inspection/task/MonitorPlanEdit.vue'),
+ },
+ {
name: 'scene-info',
path: 'scene-info',
component: () => import('@/views/inspection/scenenew/UserInfo.vue'),
diff --git a/src/utils/map/districtsearch.js b/src/utils/map/districtsearch.js
index a145b87..b41968b 100644
--- a/src/utils/map/districtsearch.js
+++ b/src/utils/map/districtsearch.js
@@ -6,7 +6,7 @@
var activeDistrict = undefined
export default {
// 缁樺埗鍖哄幙杈圭晫
- drawDistrict(districtName, isNew) {
+ drawDistrictMask(districtName, isNew) {
if (!districtName) return
onMapMounted(() => {
if (!isNew && districtPolygonMap.has(districtName)) {
@@ -49,6 +49,43 @@
}
})
},
+ // 缁樺埗鍖哄幙杈圭晫
+ drawDistrict(districtName, isNew) {
+ if (!districtName) return
+ onMapMounted(() => {
+ if (!isNew && districtPolygonMap.has(districtName)) {
+ const districtPolygon = districtPolygonMap.get(districtName)
+ map.add(districtPolygon)
+ map.setFitView(districtPolygon)
+ activeDistrict = districtPolygon
+ } else {
+ var district = new AMap.DistrictSearch({
+ extensions: 'all', //杩斿洖琛屾斂鍖鸿竟鐣屽潗鏍囩瓑鍏蜂綋淇℃伅
+ level: 'district', //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖�
+ })
+ district.search(districtName, function (status, result) {
+ var bounds = result.districtList[0].boundaries //鑾峰彇杈圭晫淇℃伅
+ if (bounds) {
+ for (var i = 0; i < bounds.length; i++) {
+ //鐢熸垚琛屾斂鍖哄垝 polygon
+ const districtPolygon = new AMap.Polygon({
+ map: map, //鏄剧ず璇ヨ鐩栫墿鐨勫湴鍥惧璞�
+ strokeWeight: 1, //杞粨绾垮搴�
+ path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁�
+ fillOpacity: 0.4, //澶氳竟褰㈠～鍏呴�忔槑搴�
+ fillColor: '#0077ff',
+ strokeColor: '#CC66CC', //绾挎潯棰滆壊
+ })
+
+ districtPolygonMap.set(districtName, districtPolygon)
+ activeDistrict = districtPolygon
+ map.setFitView(districtPolygon, true)
+ }
+ }
+ })
+ }
+ })
+ },
removeDistrict() {
onMapMounted(() => {
if (activeDistrict) {
diff --git a/src/utils/map/index.js b/src/utils/map/index.js
index 80a18f1..8e39c2c 100644
--- a/src/utils/map/index.js
+++ b/src/utils/map/index.js
@@ -67,20 +67,20 @@
map = new AMap.Map(elementId, {
// mapStyle: 'amap://styles/e1e78509de64ddcd2efb4cb34c6fae2a',
features: ['bg', 'road'],
- pitch: 30, // 鍦板浘淇话瑙掑害锛屾湁鏁堣寖鍥� 0 搴�- 83 搴�
+ pitch: 0, // 鍦板浘淇话瑙掑害锛屾湁鏁堣寖鍥� 0 搴�- 83 搴�
viewMode: '3D', // 鍦板浘妯″紡
resizeEnable: true,
center: [121.6039283, 31.25295567],
zooms: [2, 26],
- zoom: 14,
+ zoom: 11,
})
// map = new AMap.Map(elementId);
// 娣诲姞鍗槦鍦板浘
satellite = new AMap.TileLayer.Satellite()
- const roadNet = new AMap.TileLayer.RoadNet()
- // satellite.hide()
- map.add([satellite, roadNet])
+ // const roadNet = new AMap.TileLayer.RoadNet()
+ satellite.hide()
+ map.add([satellite])
// _initMouseTool();
// _init3DLayer();
@@ -112,4 +112,14 @@
})
}
-export { createMap, destroyMap, onMapMounted, map, AMap, mouseTool, object3Dlayer, isDragging }
+export {
+ createMap,
+ destroyMap,
+ onMapMounted,
+ map,
+ AMap,
+ satellite,
+ mouseTool,
+ object3Dlayer,
+ isDragging,
+}
diff --git a/src/utils/map/marks.js b/src/utils/map/marks.js
index 05137fd..a8911b6 100644
--- a/src/utils/map/marks.js
+++ b/src/utils/map/marks.js
@@ -2,82 +2,400 @@
* 楂樺痉鍦板浘鐐规爣璁扮粯鍒剁浉鍏�
*/
-import { map, AMap } from './index';
-import { useToolboxStore } from '@/stores/toolbox';
+import { map, AMap } from './index'
+import { useToolboxStore } from '@/stores/toolbox'
+import util from './util'
+import * as echarts from 'echarts'
-const toolboxStore = useToolboxStore();
+const toolboxStore = useToolboxStore()
-var _massMarks = undefined;
+var _massMarks = undefined
+
+// 鐜俊鐮佺瓑绾у拰瀵瑰簲棰滆壊
+const ringCodeLevelColors = [
+ '#52c41a', // 缁胯壊
+ '#faad14', // 榛勮壊
+ '#f5222d', // 绾㈣壊
+]
+
+/**
+ * 缁樺埗娴烽噺鐐规爣璁�
+ * @param {Array} shops 搴楅摵瀵硅薄鏁扮粍
+ * @param {Object} shops[].shop 搴楅摵鍩烘湰淇℃伅
+ * @param {string} shops[].shop.name 搴楅摵鍚嶇О
+ * @param {string} shops[].shop.address 搴楅摵鍦板潃
+ * @param {number} shops[].shop.latitude 绾害
+ * @param {number} shops[].shop.longitude 缁忓害
+ * @param {string} shops[].shop.ringCodeLevel 鏈�鏂扮幆淇＄爜绛夌骇
+ * @param {string} shops[].shop.ringCodePublishTime 鏈�鏂扮幆淇＄爜鍙戝竷鏃堕棿
+ * @param {Array} shops[].recentData 杩�1灏忔椂鐨勭洃娴嬫暟鎹�
+ * @param {string} shops[].recentData[].sampleTime 鏁版嵁閲囨牱鏃堕棿
+ * @param {number} shops[].recentData[].oilSmokeConcentration 娌圭儫娴撳害
+ * @param {number} shops[].recentData[].purifierCurrent 鍑�鍖栧櫒鐢垫祦
+ * @param {number} shops[].recentData[].fanCurrent 椋庢満鐢垫祦
+ */
+function drawMassMarks(shops) {
+ // 閰嶇疆鏍峰紡
+ const massMarksStyle = ringCodeLevelColors.map((color, index) => ({
+ url: createCustomMarker(color),
+ size: new AMap.Size(20, 20),
+ anchor: new AMap.Pixel(10, 10),
+ }))
+ // 鍑嗗娴烽噺鐐规暟鎹�
+ const massMarksData = shops.map((shop, index) => {
+ // 鏍规嵁鐜俊鐮佺瓑绾ц幏鍙栭鑹�
+ const color = getColorByRingCodeLevel(shop.shop.ringCodeLevel)
+
+ return {
+ id: index,
+ name: shop.shop.name,
+ lnglat: [shop.shop.longitude, shop.shop.latitude],
+ style: shop.shop.ringCodeLevel, // 鏍峰紡绱㈠紩锛屽搴� massMarksStyle
+ extData: shop, // 瀛樺偍瀹屾暣鐨勫簵閾轰俊鎭�
+ }
+ })
+
+ // 娓呴櫎鐜版湁鐨勬捣閲忕偣鏍囪
+ if (window.massMarks) {
+ window.massMarks.clear()
+ }
+
+ // 鍒涘缓鏂扮殑娴烽噺鐐规爣璁�
+ window.massMarks = new AMap.MassMarks(massMarksData, {
+ zIndex: 111,
+ cursor: 'pointer',
+ style: massMarksStyle,
+ })
+
+ // 娣诲姞鐐瑰嚮浜嬩欢
+ window.massMarks.on('click', function (e) {
+ const shop = e.data.extData
+ showShopInfoWindow(shop)
+ })
+
+ var marker = new AMap.Marker({
+ content: ' ',
+ map: map,
+ offset: new AMap.Pixel(13, 12),
+ })
+
+ var timeout
+ window.massMarks.on('mouseover', (e) => {
+ if (timeout) {
+ clearTimeout(timeout)
+ }
+ marker.setPosition(e.data.lnglat)
+ marker.setLabel({ content: e.data.name })
+ map.add(marker)
+ timeout = setTimeout(() => {
+ map.remove(marker)
+ }, 2000)
+ })
+
+ // 娣诲姞鍒板湴鍥�
+ window.massMarks.setMap(map)
+ util.setBound(massMarksData.map((item) => item.lnglat))
+}
+
+/**
+ * 鏍规嵁鐜俊鐮佺瓑绾ц幏鍙栭鑹�
+ * @param {string} level 鐜俊鐮佺瓑绾�
+ * @returns {string} 棰滆壊鍊�
+ */
+function getColorByRingCodeLevel(level) {
+ switch (level + '') {
+ case '0':
+ return '#52c41a' // 缁胯壊
+ case '1':
+ return '#faad14' // 榛勮壊
+ case '2':
+ return '#f5222d' // 绾㈣壊
+ default:
+ return '#8c8c8c' // 鐏拌壊
+ }
+}
+
+/**
+ * 鏍规嵁鐜俊鐮佺瓑绾ц幏鍙栦腑鏂�
+ * @param {string} level 鐜俊鐮佺瓑绾�
+ * @returns {string} 涓枃琛ㄧず
+ */
+function getRingCodeLevelText(level) {
+ switch (level + '') {
+ case '0':
+ return '缁胯壊'
+ case '1':
+ return '榛勮壊'
+ case '2':
+ return '绾㈣壊'
+ default:
+ return '鏈煡'
+ }
+}
+
+/**
+ * 鍒涘缓鑷畾涔夋爣璁�
+ * @param {string} color 鏍囪棰滆壊
+ * @returns {string} 鏍囪鐨凷VG URL
+ */
+function createCustomMarker(color) {
+ const svg = `
+ <svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+ <circle cx="10" cy="10" r="8" fill="${color}" stroke="white" stroke-width="2"/>
+ <circle cx="10" cy="10" r="3" fill="white"/>
+ </svg>
+ `
+ return 'data:image/svg+xml;base64,' + btoa(unescape(encodeURIComponent(svg)))
+}
+
+/**
+ * 鏄剧ず搴楅摵淇℃伅绐楀彛
+ * @param {Object} shop 搴楅摵瀵硅薄
+ */
+function showShopInfoWindow(shop) {
+ // 鍑嗗淇℃伅绐楀彛鍐呭
+ // const content = `
+ // <div style="padding: 10px; max-width: 300px;">
+ // <h3 style="margin: 0 0 10px 0; color: #333;">${shop.shop.name}</h3>
+ // <div style="font-size: 14px; line-height: 1.5;">
+ // <p><strong>鍦板潃锛�</strong>${shop.shop.address}</p>
+ // <p><strong>鐜俊鐮佺瓑绾э細</strong><span style="color: ${getColorByRingCodeLevel(shop.shop.ringCodeLevel)}">${shop.shop.ringCodeLevel}</span></p>
+ // <p><strong>鐜俊鐮佸彂甯冩椂闂达細</strong>${shop.shop.ringCodePublishTime}</p>
+ // <h4 style="margin: 10px 0 5px 0; color: #666;">杩�1灏忔椂鐩戞祴鏁版嵁</h4>
+ // <div style="max-height: 150px; overflow-y: auto;">
+ // ${shop.recentData
+ // .map(
+ // (item) => `
+ // <div style="padding: 5px; border-bottom: 1px solid #f0f0f0;">
+ // <p><strong>閲囨牱鏃堕棿锛�</strong>${item.sampleTime}</p>
+ // <p><strong>娌圭儫娴撳害锛�</strong>${item.oilSmokeConcentration} mg/m鲁</p>
+ // <p><strong>鍑�鍖栧櫒鐢垫祦锛�</strong>${item.purifierCurrent} A</p>
+ // <p><strong>椋庢満鐢垫祦锛�</strong>${item.fanCurrent} A</p>
+ // </div>
+ // `,
+ // )
+ // .join('')}
+ // </div>
+ // </div>
+ // </div>
+ // `
+ const content = `
+ <div style="padding: 10px; width: 400px;">
+ <h3 style="margin: 0 0 10px 0; color: #333;">${shop.shop.name}</h3>
+ <div style="font-size: 14px; line-height: 1.5;">
+ <p><strong>鍦板潃锛�</strong>${shop.shop.address}</p>
+ <p><strong>鐜俊鐮佺瓑绾э細</strong><span style="color: ${getColorByRingCodeLevel(shop.shop.ringCodeLevel)}">${getRingCodeLevelText(shop.shop.ringCodeLevel)}</span></p>
+ <p><strong>鐜俊鐮佸彂甯冩椂闂达細</strong>${shop.shop.ringCodePublishTime}</p>
+ <h4 style="margin: 10px 0 5px 0; color: #666;">杩�1灏忔椂鐩戞祴鏁版嵁</h4>
+ <div id="infowindowChartContainer" style="width: 100%; height: 250px;"></div>
+ </div>
+ </div>
+ `
+
+ // 娓呴櫎鐜版湁鐨勪俊鎭獥鍙�
+ if (window.infoWindow) {
+ window.infoWindow.close()
+ }
+
+ // 鍒涘缓鏂扮殑淇℃伅绐楀彛
+ window.infoWindow = new AMap.InfoWindow({
+ content: content,
+ size: new AMap.Size(400, 400),
+ offset: new AMap.Pixel(-24, -80),
+ })
+
+ // 鎵撳紑淇℃伅绐楀彛
+ window.infoWindow.open(map, [shop.shop.longitude, shop.shop.latitude])
+
+ // 绛夊緟淇℃伅绐楀彛鍔犺浇瀹屾垚鍚庡垵濮嬪寲鍥捐〃
+ setTimeout(() => {
+ const chartdom = document.getElementById('infowindowChartContainer')
+ if (chartdom) {
+ initChart(chartdom, shop.recentData)
+ }
+ }, 100)
+}
+
+/**
+ * 鍒濆鍖栫洃娴嬫暟鎹浘琛�
+ * @param {Array} data 鐩戞祴鏁版嵁
+ */
+function initChart(chartdom, data) {
+ // 鍑嗗鍥捐〃鏁版嵁
+ const times = data.map((item) => item.sampleTime)
+ const oilSmokeData = data.map((item) => item.oilSmokeConcentration)
+ const purifierData = data.map((item) => item.purifierCurrent)
+ const fanData = data.map((item) => item.fanCurrent)
+
+ // 鍒濆鍖栧浘琛�
+ const chart = echarts.init(chartdom)
+
+ // 鍥捐〃閰嶇疆
+ const option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ label: {
+ backgroundColor: '#6a7985',
+ },
+ },
+ },
+ legend: {
+ data: ['娌圭儫娴撳害', '鍑�鍖栧櫒鐢垫祦', '椋庢満鐢垫祦'],
+ top: 0,
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true,
+ },
+ xAxis: [
+ {
+ type: 'category',
+ boundaryGap: false,
+ data: times.map((time) => time.split(' ')[1]),
+ axisLabel: {
+ rotate: 0,
+ fontSize: 10,
+ },
+ },
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ name: '娌圭儫娴撳害 (mg/m鲁)',
+ position: 'left',
+ left: '30%',
+ },
+ {
+ type: 'value',
+ name: '鐢垫祦 (A)',
+ position: 'right',
+ },
+ ],
+ series: [
+ {
+ name: '娌圭儫娴撳害',
+ type: 'line',
+ data: oilSmokeData,
+ yAxisIndex: 0,
+ smooth: true,
+ },
+ {
+ name: '鍑�鍖栧櫒鐢垫祦',
+ type: 'line',
+ data: purifierData,
+ yAxisIndex: 1,
+ smooth: true,
+ },
+ {
+ name: '椋庢満鐢垫祦',
+ type: 'line',
+ data: fanData,
+ yAxisIndex: 1,
+ smooth: true,
+ },
+ ],
+ }
+
+ // 搴旂敤閰嶇疆
+ chart.setOption(option)
+
+ // 鍝嶅簲寮忓鐞�
+ window.addEventListener('resize', function () {
+ chart.resize()
+ })
+}
+
+/**
+ * 娓呴櫎娴烽噺鐐规爣璁�
+ */
+function clearMassMarks() {
+ if (window.massMarks) {
+ window.massMarks.clear()
+ window.massMarks.setMap(null)
+ window.massMarks = null
+ }
+
+ if (window.infoWindow) {
+ window.infoWindow.close()
+ window.infoWindow = null
+ }
+}
export default {
- /**
- * 缁樺埗娴烽噺鐐规爣璁�
- * @param fDatas 瀹屾暣鐩戞祴鏁版嵁
- * @param _factor 褰撳墠灞曠ず鐨勭洃娴嬪洜瀛愬璞�
- */
- drawMassMarks(fDatas, _factor, onClick) {
- if (!toolboxStore.dataMarkerStatus) {
- return;
- }
- this.clearMassMarks();
- const lnglats = fDatas.lnglats_GD;
- var data = [];
- for (let i = 0; i < lnglats.length; i++) {
- data.push({
- lnglat: lnglats[i], //鐐规爣璁颁綅缃�
- name: `${fDatas.times[i]}<br/>${_factor.factorName}: ${_factor.datas[i].factorData} 渭g/m鲁`,
- id: i
- });
- }
+ drawMassMarks,
+ clearMassMarks,
+ // /**
+ // * 缁樺埗娴烽噺鐐规爣璁�
+ // * @param fDatas 瀹屾暣鐩戞祴鏁版嵁
+ // * @param _factor 褰撳墠灞曠ず鐨勭洃娴嬪洜瀛愬璞�
+ // */
+ // drawMassMarks(fDatas, _factor, onClick) {
+ // if (!toolboxStore.dataMarkerStatus) {
+ // return;
+ // }
+ // this.clearMassMarks();
+ // const lnglats = fDatas.lnglats_GD;
+ // var data = [];
+ // for (let i = 0; i < lnglats.length; i++) {
+ // data.push({
+ // lnglat: lnglats[i], //鐐规爣璁颁綅缃�
+ // name: `${fDatas.times[i]}<br/>${_factor.factorName}: ${_factor.datas[i].factorData} 渭g/m鲁`,
+ // id: i
+ // });
+ // }
- // 鍒涘缓鏍峰紡瀵硅薄
- var styleObject = {
- url: 'https://a.amap.com/jsapi_demos/static/images/mass1.png',
- // url: './asset/mipmap/ic_up_white.png', // 鍥炬爣鍦板潃
+ // // 鍒涘缓鏍峰紡瀵硅薄
+ // var styleObject = {
+ // url: 'https://a.amap.com/jsapi_demos/static/images/mass1.png',
+ // // url: './asset/mipmap/ic_up_white.png', // 鍥炬爣鍦板潃
- size: new AMap.Size(11, 11), // 鍥炬爣澶у皬
+ // size: new AMap.Size(11, 11), // 鍥炬爣澶у皬
- anchor: new AMap.Pixel(5, 5) // 鍥炬爣鏄剧ず浣嶇疆鍋忕Щ閲忥紝鍩哄噯鐐逛负鍥炬爣宸︿笂瑙�
- };
+ // anchor: new AMap.Pixel(5, 5) // 鍥炬爣鏄剧ず浣嶇疆鍋忕Щ閲忥紝鍩哄噯鐐逛负鍥炬爣宸︿笂瑙�
+ // };
- var massMarks = new AMap.MassMarks(data, {
- zIndex: 5, // 娴烽噺鐐瑰浘灞傚彔鍔犵殑椤哄簭
- zooms: [15, 18], // 鍦ㄦ寚瀹氬湴鍥剧缉鏀剧骇鍒寖鍥村唴灞曠ず娴烽噺鐐瑰浘灞�
- style: styleObject // 璁剧疆鏍峰紡瀵硅薄
- });
- massMarks.on('click', (event) => {
- const i = event.data.id;
- // 3. 鑷畾涔夌偣鍑讳簨浠�
- onClick(i);
- });
+ // var massMarks = new AMap.MassMarks(data, {
+ // zIndex: 5, // 娴烽噺鐐瑰浘灞傚彔鍔犵殑椤哄簭
+ // zooms: [15, 18], // 鍦ㄦ寚瀹氬湴鍥剧缉鏀剧骇鍒寖鍥村唴灞曠ず娴烽噺鐐瑰浘灞�
+ // style: styleObject // 璁剧疆鏍峰紡瀵硅薄
+ // });
+ // massMarks.on('click', (event) => {
+ // const i = event.data.id;
+ // // 3. 鑷畾涔夌偣鍑讳簨浠�
+ // onClick(i);
+ // });
- var marker = new AMap.Marker({
- content: ' ',
- map: map,
+ // var marker = new AMap.Marker({
+ // content: ' ',
+ // map: map,
- offset: new AMap.Pixel(13, 12)
- });
- var timeout;
- massMarks.on('mouseover', (e) => {
- if (timeout) {
- clearTimeout(timeout);
- }
- marker.setPosition(e.data.lnglat);
- marker.setLabel({ content: e.data.name });
- map.add(marker);
- timeout = setTimeout(() => {
- map.remove(marker);
- }, 2000);
- });
- _massMarks = massMarks;
- map.add(massMarks);
- },
- clearMassMarks() {
- if (_massMarks) {
- map.remove(_massMarks);
- _massMarks = undefined;
- }
- },
+ // offset: new AMap.Pixel(13, 12)
+ // });
+ // var timeout;
+ // massMarks.on('mouseover', (e) => {
+ // if (timeout) {
+ // clearTimeout(timeout);
+ // }
+ // marker.setPosition(e.data.lnglat);
+ // marker.setLabel({ content: e.data.name });
+ // map.add(marker);
+ // timeout = setTimeout(() => {
+ // map.remove(marker);
+ // }, 2000);
+ // });
+ // _massMarks = massMarks;
+ // map.add(massMarks);
+ // },
+ // clearMassMarks() {
+ // if (_massMarks) {
+ // map.remove(_massMarks)
+ // _massMarks = undefined
+ // }
+ // },
/**
* 鍒涘缓鏍囪鐐�
@@ -93,14 +411,14 @@
// 寮�鍚爣娉ㄩ伩璁╋紝榛樿涓哄紑鍚紝v1.4.15 鏂板灞炴��
collision: collision,
// 寮�鍚爣娉ㄦ贰鍏ュ姩鐢伙紝榛樿涓哄紑鍚紝v1.4.15 鏂板灞炴��
- animation: true
- });
+ animation: true,
+ })
- map.add(layer);
+ map.add(layer)
// var markers = [];
for (var i = 0; i < dataList.length; i++) {
- const data = dataList[i];
+ const data = dataList[i]
var curData = {
name: data.name,
position: [data.longitude, data.latitude],
@@ -115,7 +433,7 @@
size: [30, 30],
anchor: 'bottom-center',
angel: 0,
- retina: true
+ retina: true,
},
text: {
content: showTxt ? data.name : '',
@@ -127,22 +445,22 @@
fillColor: '#fff',
strokeColor: '#333',
strokeWidth: 0,
- backgroundColor: '#122b54a9'
- }
- }
- };
+ backgroundColor: '#122b54a9',
+ },
+ },
+ }
curData.extData = {
- index: i
- };
+ index: i,
+ }
- var labelMarker = new AMap.LabelMarker(curData);
+ var labelMarker = new AMap.LabelMarker(curData)
// markers.push(labelMarker);
- layer.add(labelMarker);
+ layer.add(labelMarker)
}
- return layer;
+ return layer
},
createMarker({ position, img, title, content, label = '', extData }) {
@@ -151,8 +469,8 @@
size: new AMap.Size(30, 30), //鍥炬爣灏哄
image: img, //Icon 鐨勫浘鍍�
// imageOffset: new AMap.Pixel(-9, -3), //鍥惧儚鐩稿灞曠ず鍖哄煙鐨勫亸绉婚噺锛岄�備簬闆ⅶ鍥剧瓑
- imageSize: new AMap.Size(30, 30) //鏍规嵁鎵�璁剧疆鐨勫ぇ灏忔媺浼告垨鍘嬬缉鍥剧墖
- });
+ imageSize: new AMap.Size(30, 30), //鏍规嵁鎵�璁剧疆鐨勫ぇ灏忔媺浼告垨鍘嬬缉鍥剧墖
+ })
const marker = new AMap.Marker({
position: position,
// offset: new AMap.Pixel(-13, -30),
@@ -161,11 +479,11 @@
title: title,
label: {
content: label,
- direction: 'bottom'
+ direction: 'bottom',
},
- extData
- });
+ extData,
+ })
// map.add(marker);
- return marker;
- }
-};
+ return marker
+ },
+}
diff --git a/src/utils/map/util.js b/src/utils/map/util.js
index 9e83951..9f207c8 100644
--- a/src/utils/map/util.js
+++ b/src/utils/map/util.js
@@ -1,5 +1,5 @@
-import { map, AMap, isDragging } from '@/utils/map/index';
-import marks from '@/utils/map/marks';
+import { map, AMap, isDragging } from '@/utils/map/index'
+import marks from '@/utils/map/marks'
/**
* 鍧愭爣闆嗗悎鐨勬渶瑗垮崡瑙掑拰鏈�涓滃寳瑙�
@@ -7,35 +7,35 @@
* list 鏄帴鍙ｈ幏鍙栫殑鐐� 鐨勬暟缁�
*/
const getBound = (list) => {
- const offset = 0.005;
- let south = null;
- let west = null;
- let north = null;
- let east = null;
+ const offset = 0.05
+ let south = null
+ let west = null
+ let north = null
+ let east = null
for (let item of list) {
// 鎺掗櫎鏃犳晥缁忕含搴�
if (item[0] == 0 && item[1] == 0) {
- continue;
+ continue
}
if ((west && item[0] < west) || !west) {
- west = item[0] - offset;
+ west = item[0] - offset
}
if ((south && item[1] < south) || !south) {
- south = item[1] - offset;
+ south = item[1] - offset
}
if ((east && item[0] > east) || !east) {
- east = item[0] + offset;
+ east = item[0] + offset
}
if ((north && item[1] > north) || !north) {
- north = item[1] + offset;
+ north = item[1] + offset
}
}
if (!south || !west || !north || !east) {
- return { sw: null, ne: null };
+ return { sw: null, ne: null }
} else {
- return { sw: [west, south], ne: [east, north] };
+ return { sw: [west, south], ne: [east, north] }
}
-};
+}
/**
* 鏍规嵁涓績鐐瑰嚭鍙戠殑鍗婂緞锛屽緱鍒板悎閫傜殑鍦板浘缂╂斁绯绘暟
@@ -45,64 +45,61 @@
*/
const distanceToZoom = (d) => {
let baseDis = 250,
- z = 0;
+ z = 0
while (baseDis < d) {
- baseDis *= 2;
- z++;
+ baseDis *= 2
+ z++
}
// 澶氫綑鐨勫湴鍥剧缉鏀剧郴鏁�
- const x = (baseDis - d) / (baseDis / 2);
- z -= x;
- z = z < 0 ? 0 : z;
+ const x = (baseDis - d) / (baseDis / 2)
+ z -= x
+ z = z < 0 ? 0 : z
- z = 18 - z;
- z = z < 3 ? 3 : z;
- return z;
-};
+ z = 18 - z
+ z = z < 3 ? 3 : z
+ return z
+}
export default {
setCenter(lnglat, ignore = false) {
if (!ignore && isDragging) {
- return;
+ return
}
- var now = new Date();
- if (
- this.lasttime == undefined ||
- now.getTime() - this.lasttime.getTime() >= 200
- ) {
- map.setCenter(lnglat);
- this.lasttime = now;
+ var now = new Date()
+ if (this.lasttime == undefined || now.getTime() - this.lasttime.getTime() >= 200) {
+ map.setCenter(lnglat)
+ this.lasttime = now
}
},
addViews(view) {
- map.add(view);
+ map.add(view)
},
removeViews(view) {
- map.remove(view);
+ map.remove(view)
},
clearMap() {
- marks.clearMassMarks();
- map.clearMap();
+ marks.clearMassMarks()
+ map.clearMap()
},
setFitView(views) {
if (views) {
- map.setFitView(views);
+ map.setFitView(views)
} else {
- map.setFitView();
+ map.setFitView()
}
},
setFitSector({ p, r }) {
- this.setCenter(p);
- const z = distanceToZoom(r);
- map.setZoom(z);
+ this.setCenter(p)
+ const z = distanceToZoom(r)
+ map.setZoom(z)
},
setBound(lnglats_GD) {
- const { sw, ne } = getBound(lnglats_GD);
+ const { sw, ne } = getBound(lnglats_GD)
if (!sw || !ne) {
- return;
+ return
}
- var mybounds = new AMap.Bounds(sw, ne); // sw, ne > [xxx,xxx], [xxx,xxx]
- map.setBounds(mybounds);
- }
-};
+ var mybounds = new AMap.Bounds(sw, ne) // sw, ne > [xxx,xxx], [xxx,xxx]
+ map.setBounds(mybounds)
+ },
+}
diff --git a/src/views/inspection/scene/SceneInspectFile.vue b/src/views/inspection/scene/SceneInspectFile.vue
index fa5e464..c323d15 100644
--- a/src/views/inspection/scene/SceneInspectFile.vue
+++ b/src/views/inspection/scene/SceneInspectFile.vue
@@ -6,19 +6,9 @@
class="dialog-wrapper"
v-loading="loading"
>
- <el-scrollbar
- ref="scrollbarRef"
- height="50vh"
- v-loading="loading"
- :always="true"
- >
+ <el-scrollbar ref="scrollbarRef" height="50vh" v-loading="loading" :always="true">
<el-checkbox-group v-model="checkList">
- <el-space
- direction="vertical"
- alignment="flex-start"
- fill
- style="width: 90%"
- >
+ <el-space direction="vertical" alignment="flex-start" fill style="width: 90%">
<el-checkbox
v-for="(item, index) in sceneInfoList"
:key="item.scense.guid"
@@ -27,23 +17,15 @@
:class="(item.invalid ? 'checkbox-invalid' : '') + ' checkbox'"
>
<div>
- <el-text size="large" truncated style="width: 600px">{{
- item.scense.name
- }}</el-text>
+ <el-text size="large" truncated style="width: 600px">{{ item.scense.name }}</el-text>
</div>
<div class="m-t-4">
- <el-text size="small">{{
- '鍦板潃锛�' + item.scense.location
- }}</el-text>
+ <el-text size="small">{{ '鍦板潃锛�' + item.scense.location }}</el-text>
</div>
<el-row justify="space-between">
<el-space class="m-t-4">
<el-tag>
- {{
- item.scense.cityname +
- item.scense.districtname +
- item.scense.townname
- }}
+ {{ item.scense.cityname + item.scense.districtname + item.scense.townname }}
</el-tag>
<el-tag>{{ item.scense.type }}</el-tag>
</el-space>
@@ -58,10 +40,7 @@
:loading="item._loading"
:disabled="item._isFirstInspect"
inline-prompt
- style="
- --el-switch-on-color: #13ce66;
- --el-switch-off-color: #c75000;
- "
+ style="--el-switch-on-color: #13ce66; --el-switch-off-color: #c75000"
active-text="璇︾増"
inactive-text="绠�鐗�"
/>
@@ -73,10 +52,12 @@
type="default"
size="small"
class="m-t-4"
- icon="IconPrinter"
:disabled="!item._valid"
@click="handlePreview(item)"
>
+ <el-icon>
+ <Icon icon="solar:printer-minimalistic-line-duotone" />
+ </el-icon>
</el-button>
</el-space>
</el-row>
@@ -86,9 +67,7 @@
</el-scrollbar>
<template #footer>
<div class="dialog-footer">
- <el-button type="danger" @click="cancel" icon="CloseBold"
- >鍙栨秷</el-button
- >
+ <el-button type="danger" @click="cancel" icon="CloseBold">鍙栨秷</el-button>
<el-button
type="primary"
:loading="docLoading"
@@ -103,8 +82,10 @@
:loading="docLoading"
:disabled="checkList.length == 0"
@click="handlePreview()"
- icon="IconPrinter"
>
+ <el-icon class="el-icon--left">
+ <Icon icon="solar:printer-minimalistic-line-duotone" />
+ </el-icon>
鎵撳嵃鎵�閫�
</el-button>
</div>
@@ -113,24 +94,14 @@
<el-dialog v-model="previewVisible" :show-close="false" fullscreen>
<template #header="{ close, titleId, titleClass }">
<el-row justify="end" style="background-color: white">
- <el-button type="danger" @click="close" icon="CircleCloseFilled">
- 鍏抽棴
- </el-button>
- <el-button
- type="primary"
- @click="handelPrint(refWord)"
- icon="IconPrinter"
- >
+ <el-button type="danger" @click="close" icon="CircleCloseFilled"> 鍏抽棴 </el-button>
+ <el-button type="primary" @click="handelPrint(refWord)" icon="IconPrinter">
鎵撳嵃
</el-button>
</el-row>
</template>
<div ref="refWord">
- <div
- :id="`word-preview-${i}`"
- v-for="(item, i) in previewList"
- :key="item"
- ></div>
+ <div :id="`word-preview-${i}`" v-for="(item, i) in previewList" :key="item"></div>
</div>
<!-- <iframe ref="pdfPreview" width="100%" height="100vh" style="height: calc(100vh - 60px);"></iframe> -->
</el-dialog>
@@ -139,108 +110,109 @@
/**
* 鍦烘櫙宸℃煡鍗曟嵁鑷姩涓嬭浇
*/
-import { ref, watch } from 'vue';
-import { useRouter } from 'vue-router';
+import { Icon } from '@iconify/vue'
+import { ref, watch } from 'vue'
+import { useRouter } from 'vue-router'
import {
exportDocx,
prepareDocxBlob,
preparePdf,
previewDocx,
downloadDocx,
- print
-} from '@/utils/doc';
-import sceneApi from '@/api/fysp/sceneApi';
-import subtaskApi from '@/api/fysp/subtaskApi';
+ print,
+} from '@/utils/doc'
+import sceneApi from '@/api/fysp/sceneApi'
+import subtaskApi from '@/api/fysp/subtaskApi'
// 2025.12.22锛氭湁宸℃煡鍗曟嵁妯℃澘鐨勫満鏅被鍨嬶紝[1:宸ュ湴, 5:椁愰ギ]
-const validSceneType = [1, 5];
+const validSceneType = [1, 5]
const props = defineProps({
// 瀵硅瘽妗嗗紑鍏�
modelValue: Boolean,
// 鍦烘櫙鍩虹淇℃伅鏁扮粍
value: Array,
- previewElement: String
-});
+ previewElement: String,
+})
-const emits = defineEmits(['update:modelValue']);
+const emits = defineEmits(['update:modelValue'])
-const router = useRouter();
+const router = useRouter()
-const refWord = ref(null);
-const pdfPreview = ref(null);
+const refWord = ref(null)
+const pdfPreview = ref(null)
-const loading = ref(false);
-const scrollbarRef = ref();
-const sceneInfoList = ref([]);
-const checkList = ref([]);
-const docLoading = ref(false);
+const loading = ref(false)
+const scrollbarRef = ref()
+const sceneInfoList = ref([])
+const checkList = ref([])
+const docLoading = ref(false)
// 棰勮瀵硅瘽妗嗗紑鍏�
-const previewVisible = ref(false);
+const previewVisible = ref(false)
// 棰勮鐨勬枃妗�
-const previewList = ref([]);
+const previewList = ref([])
watch(
() => [props.modelValue, props.value],
(nV, oV) => {
if (nV[0] && nV[1] && nV[1] != oV[1]) {
- fetchSceneInfo(nV[1]);
+ fetchSceneInfo(nV[1])
}
- }
-);
+ },
+)
function fetchSceneInfo(sceneIdList) {
- loading.value = true;
- sceneInfoList.value = [];
- checkList.value = [];
+ loading.value = true
+ sceneInfoList.value = []
+ checkList.value = []
sceneIdList.forEach((sid) => {
sceneApi
.getSceneDetail(sid)
.then((res) => {
- sceneInfoList.value.push(res.data);
+ sceneInfoList.value.push(res.data)
if (validSceneType.indexOf(res.data?.scense?.typeid) != -1) {
- checkList.value.push(sceneInfoList.value.length - 1);
+ checkList.value.push(sceneInfoList.value.length - 1)
// todo _valid 鐨勯�昏緫鏈夐敊璇�
- const lastScene = sceneInfoList.value[sceneInfoList.value.length - 1];
- lastScene._valid = true;
- lastScene._loading = true;
+ const lastScene = sceneInfoList.value[sceneInfoList.value.length - 1]
+ lastScene._valid = true
+ lastScene._loading = true
subtaskApi
.findByDate(sid)
.then((res) => {
if (res.length == 0) {
- lastScene._isFirstInspect = true;
- lastScene._isDetail = true;
+ lastScene._isFirstInspect = true
+ lastScene._isDetail = true
}
})
.finally(() => {
- lastScene._loading = false;
- });
+ lastScene._loading = false
+ })
}
})
.finally(() => {
- loading.value = false;
- scrollbarRef.value.setScrollTop(0);
- });
- });
+ loading.value = false
+ scrollbarRef.value.setScrollTop(0)
+ })
+ })
}
function handleDialogChange(value) {
- emits('update:modelValue', value);
+ emits('update:modelValue', value)
}
function setParam(value, length) {
- const _value = value ? value : '';
- const offset = length - _value.length;
+ const _value = value ? value : ''
+ const offset = length - _value.length
if (offset > 0) {
- let str = _value;
+ let str = _value
for (let i = 0; i < offset; i++) {
- str += ' ';
+ str += ' '
}
- return str;
+ return str
} else {
- return _value;
+ return _value
}
}
@@ -249,8 +221,8 @@
const selected = item
? [item]
: sceneInfoList.value.filter((v, i) => {
- return checkList.value.indexOf(i) != -1;
- });
+ return checkList.value.indexOf(i) != -1
+ })
const param = selected.map((v) => {
switch (v.scense.typeid) {
// 宸ュ湴
@@ -262,22 +234,19 @@
district: v.scense?.districtname ?? '',
name: setParam(v.scense?.name ?? '', 0),
employerUnit: setParam(v.subScene?.csEmployerUnit ?? '', 0),
- constructionUnit: setParam(
- v.subScene ? v.subScene.csConstructionUnit : '',
- 0
- ),
+ constructionUnit: setParam(v.subScene ? v.subScene.csConstructionUnit : '', 0),
timeRange: setParam(
v.subScene && v.subScene.csStartTime
? `${v.subScene.csStartTime}鑷�${v.subScene.csEndTime}`
: '',
- 0
+ 0,
),
stage: setParam(v.subScene ? v.subScene.siExtension1 : '', 0),
contacts: setParam(v.scense?.contacts ?? '', 0),
contactsTel: setParam(v.scense?.contactst ?? '', 0),
- location: setParam(v.scense?.location ?? '', 0)
- }
- };
+ location: setParam(v.scense?.location ?? '', 0),
+ },
+ }
// 椁愰ギ
case 5:
return {
@@ -287,56 +256,54 @@
location: setParam(v.scense.location, 63),
name: setParam(v.scense.name, 64),
contacts: setParam(v.scense.contacts, 67),
- contactsTel: setParam(v.scense.contactst, 62)
- }
- };
+ contactsTel: setParam(v.scense.contactst, 62),
+ },
+ }
// default:
// v.invalid = true;
// return undefined;
}
- });
+ })
- return param;
+ return param
}
// 鏍规嵁鍦烘櫙绫诲瀷锛岀敓鎴愬搴旂殑word鏂囨。
function generateDoc(param, callback) {
param.map((p, index) => {
- let template, _param;
+ let template, _param
switch (p.type) {
// 宸ュ湴
case 1:
- template = p._isDetail
- ? '/宸ュ湴宸℃煡鍗曟嵁妯℃澘-璇︾増.docx'
- : '/宸ュ湴宸℃煡鍗曟嵁妯℃澘-绠�鐗�.docx';
- _param = p.params;
- break;
+ template = p._isDetail ? '/宸ュ湴宸℃煡鍗曟嵁妯℃澘-璇︾増.docx' : '/宸ュ湴宸℃煡鍗曟嵁妯℃澘-绠�鐗�.docx'
+ _param = p.params
+ break
// 椁愰ギ
case 5:
- template = '/椁愰ギ宸℃煡鍗曟嵁妯℃澘.docx';
- _param = p.params;
- break;
+ template = '/椁愰ギ宸℃煡鍗曟嵁妯℃澘.docx'
+ _param = p.params
+ break
default:
- break;
+ break
}
prepareDocxBlob(template, _param).then((blob) => {
- callback(blob, `${_param.name}宸℃煡鍗曟嵁.docx`, index);
- });
- });
+ callback(blob, `${_param.name}宸℃煡鍗曟嵁.docx`, index)
+ })
+ })
}
function filePrepare(callback) {
- const param = parseParam();
+ const param = parseParam()
if (param) {
- return generateDoc(param, callback);
+ return generateDoc(param, callback)
}
}
// 鐐瑰嚮涓嬭浇鎸夐挳鎿嶄綔, 涓嬭浇word鏂囨。
function handelDownload() {
filePrepare((blob, name) => {
- downloadDocx(blob, name);
- });
+ downloadDocx(blob, name)
+ })
}
// 鐐瑰嚮鎵撳嵃鎸夐挳鎿嶄綔
@@ -346,8 +313,8 @@
ref,
// 鏍规嵁鐩墠浣跨敤鐨刣ocx-preview缁勪欢锛岃缃墦鍗版牱寮忥紝涓昏鍘婚櫎澶氫綑鐨刴argin鍜宲adding锛屼互鍙婇槾褰辨晥鏋�
style: `
- @page{size:A4;margin: 0 !important;padding:0 !important;}
- body {margin: 0 !important;padding:0 !important;}
+ @page{size:A4;margin: 0 !important;padding:0 !important;}
+ body {margin: 0 !important;padding:0 !important;}
header {color: rgb(182, 182, 182);}
footer {color: rgb(182, 182, 182);}
.docx-wrapper {padding: 0 !important;}
@@ -357,29 +324,29 @@
justify-content: space-between;
align-items: flex-end;
}
- `
- });
+ `,
+ })
}
}
function handlePreview(item) {
// 棰勮鐨勬枃妗ｏ紝鍖哄垎鍗曠嫭鎵撳嵃鍜屾墦鍗板叏閮�
- previewList.value = item ? ['0'] : checkList.value;
- const param = item ? parseParam(item) : parseParam();
+ previewList.value = item ? ['0'] : checkList.value
+ const param = item ? parseParam(item) : parseParam()
if (param) {
generateDoc(param, (blob, name, index) => {
- previewVisible.value = true;
+ previewVisible.value = true
setTimeout(() => {
- previewDocx(blob, document.getElementById(`word-preview-${index}`));
- }, 200);
- });
+ previewDocx(blob, document.getElementById(`word-preview-${index}`))
+ }, 200)
+ })
}
}
// 鍙栨秷鎿嶄綔
function cancel() {
// 鍏抽棴瀵硅瘽妗�
- handleDialogChange(false);
+ handleDialogChange(false)
}
</script>
<style scoped>
diff --git a/src/views/inspection/task/TaskManage.vue b/src/views/inspection/task/TaskManage.vue
index 0e7cc16..0ba9fbc 100644
--- a/src/views/inspection/task/TaskManage.vue
+++ b/src/views/inspection/task/TaskManage.vue
@@ -296,7 +296,11 @@
data: r,
}
})
- this.tasks = list
+ this.tasks = list.filter((e) => {
+ return (
+ e.data.districtname == '寰愭眹鍖�' && dayjs(e.data.starttime).isBefore(dayjs('2023-12-31'))
+ )
+ })
if (list.length == 0) {
this.sideLoading = false
this.mainLoading = false
@@ -331,7 +335,9 @@
taskApi
.fetchMonitorObjectVersion(task.data.tguid)
.then((res) => {
- this.curMonitorObjList = res
+ this.curMonitorObjList = res.filter((item) => {
+ return item.scene.type == '椁愰ギ'
+ })
})
.finally(() => {
this.mainLoading = false
diff --git a/src/views/inspection/task/components/CompMonitorObjEdit.vue b/src/views/inspection/task/components/CompMonitorObjEdit.vue
index 01de63a..44d70a3 100644
--- a/src/views/inspection/task/components/CompMonitorObjEdit.vue
+++ b/src/views/inspection/task/components/CompMonitorObjEdit.vue
@@ -1,9 +1,6 @@
<template>
<el-row gutter="20">
- <el-col
- :span="16"
- style="border-right: 1px solid var(--el-color-info-light-7)"
- >
+ <el-col :span="16" style="border-right: 1px solid var(--el-color-info-light-7)">
<div>
<el-text>宸查�夊満鏅�</el-text>
<el-text type="info" size="small">{{ statisticText }}</el-text>
@@ -22,48 +19,38 @@
</el-col>
<el-col :span="8">
<!-- <el-affix :offset="140"> -->
- <div>
- <el-text>鍙�夊満鏅�</el-text>
- </div>
- <el-divider />
- <el-scrollbar class="scrollbar-flex-content" always >
- <!-- <el-segmented v-model="curSceneType" :options="sceneTypeOptions" /> -->
- <el-tabs v-model="curSceneType">
- <el-tab-pane
- v-for="item in sceneTypeOptions"
- :key="item"
- :label="item"
- :name="item"
- ></el-tab-pane>
- </el-tabs>
- </el-scrollbar>
- <FYInfoSearch
- placeholder="璇疯緭鍏ュ満鏅悕绉板叧閿瓧"
- :data="showSceneList"
- :on-search="searchScene"
- :total="total"
- scroll-height="60vh"
- :page-show="false"
- >
- <template #default="{ row }">
- <ItemScene :item="row">
- <el-button-group>
- <el-button
- size="small"
- type="primary"
- @click="openInsertDialog(row)"
- >鎻掑叆</el-button
- >
- <el-button
- size="small"
- type="primary"
- @click="openAddDialog(row)"
- >鏂板</el-button
- >
- </el-button-group>
- </ItemScene>
- </template>
- </FYInfoSearch>
+ <div>
+ <el-text>鍙�夊満鏅�</el-text>
+ </div>
+ <el-divider />
+ <el-scrollbar class="scrollbar-flex-content" always>
+ <!-- <el-segmented v-model="curSceneType" :options="sceneTypeOptions" /> -->
+ <el-tabs v-model="curSceneType">
+ <el-tab-pane
+ v-for="item in sceneTypeOptions"
+ :key="item"
+ :label="item"
+ :name="item"
+ ></el-tab-pane>
+ </el-tabs>
+ </el-scrollbar>
+ <FYInfoSearch
+ placeholder="璇疯緭鍏ュ満鏅悕绉板叧閿瓧"
+ :data="showSceneList"
+ :on-search="searchScene"
+ :total="total"
+ scroll-height="60vh"
+ :page-show="false"
+ >
+ <template #default="{ row }">
+ <ItemScene :item="row">
+ <el-button-group>
+ <el-button size="small" type="primary" @click="openInsertDialog(row)">鎻掑叆</el-button>
+ <el-button size="small" type="primary" @click="openAddDialog(row)">鏂板</el-button>
+ </el-button-group>
+ </ItemScene>
+ </template>
+ </FYInfoSearch>
<!-- </el-affix> -->
</el-col>
</el-row>
@@ -72,19 +59,12 @@
<div v-if="valibleIndex.length > 0">浠ヤ笅涓哄彲閫夌殑绌轰綑缂栧彿</div>
<div v-else>鏃犲彲閫夌殑绌轰綑缂栧彿</div>
<el-radio-group v-model="selectedIndex" size="default">
- <el-radio-button
- v-for="item in valibleIndex"
- :key="item"
- :label="item"
- :value="item"
- />
+ <el-radio-button v-for="item in valibleIndex" :key="item" :label="item" :value="item" />
</el-radio-group>
<template #footer>
<div class="dialog-footer">
<el-button @click="insertDialog = false">鍙栨秷</el-button>
- <el-button :disabled="!selectedIndex" type="primary" @click="insertMov">
- 纭
- </el-button>
+ <el-button :disabled="!selectedIndex" type="primary" @click="insertMov"> 纭 </el-button>
</div>
</template>
</el-dialog>
@@ -100,14 +80,14 @@
</template>
<script>
-import { useCloned } from '@vueuse/core';
-import CompMonitorObj from './CompMonitorObj.vue';
-import taskApi from '@/api/fysp/taskApi';
-import sceneApi from '@/api/fysp/sceneApi';
-import { ElMessage, ElNotification, ElMessageBox } from 'element-plus';
+import { useCloned } from '@vueuse/core'
+import CompMonitorObj from './CompMonitorObj.vue'
+import taskApi from '@/api/fysp/taskApi'
+import sceneApi from '@/api/fysp/sceneApi'
+import { ElMessage, ElNotification, ElMessageBox } from 'element-plus'
-const MODE_CREATE = 'create';
-const MODE_UPDATE = 'update';
+const MODE_CREATE = 'create'
+const MODE_UPDATE = 'update'
export default {
components: { CompMonitorObj },
@@ -115,18 +95,18 @@
// 缂栬緫妯″紡锛屾柊澧瀋reate鎴栨洿鏂皍pdate
mode: {
type: String,
- default: MODE_CREATE
+ default: MODE_CREATE,
},
create: Boolean,
// 宸℃煡鎬讳换鍔�
task: {
type: Object,
default: () => {
- return {};
- }
+ return {}
+ },
},
// 鐩戠鍦烘櫙闆嗗悎
- objList: Array
+ objList: Array,
},
data() {
return {
@@ -157,19 +137,19 @@
// 鍒犻櫎鐨勭洃绠″満鏅�
deleteObj: [],
// 鏇存柊鐨勫満鏅熀鏈俊鎭紙鏇存柊鍦烘櫙鐨勭紪鍙凤級
- updateScene: []
- };
+ updateScene: [],
+ }
},
emits: ['uploadSuccess', 'uploadFail'],
watch: {
objList: {
handler(nV, oV) {
if (nV != oV) {
- this.curMonitorObjList = useCloned(nV).cloned.value;
+ this.curMonitorObjList = useCloned(nV).cloned.value
}
},
- immediate: true
- }
+ immediate: true,
+ },
// task: {
// handler(nV, oV) {
// if (nV != oV) {
@@ -191,158 +171,149 @@
districtname: this.task.districtname,
towncode: this.task.towncode,
townname: this.task.townname,
- online: true
- };
+ online: true,
+ scensetypeid: '5',
+ }
},
// 褰撳墠鍦烘櫙绫诲瀷涓嬬殑灞曠ず鍦烘櫙
showSceneList() {
return this.sceneList.filter((v) => {
const index = this.curMonitorObjList.findIndex((o) => {
- return o.sguid == v.guid;
- });
- return index == -1 && v.type == this.curSceneType;
- });
+ return o.sguid == v.guid
+ })
+ return index == -1 && v.type == this.curSceneType
+ })
},
sceneTypeOptions() {
- const list = [];
+ const list = []
this.sceneList.forEach((d) => {
- if (list.indexOf(d.type) == -1) list.push(d.type);
- });
- return list;
+ if (list.indexOf(d.type) == -1) list.push(d.type)
+ })
+ return list
},
// 褰撳墠鍦烘櫙绫诲瀷涓嬬殑鍙彃鍏ョ紪鍙�
valibleIndex() {
// 鍘熷垪琛ㄥ凡缁忔寜鐓х紪鍙烽『搴忔帓鍒�
- let index = 1;
- const indexList = [];
+ let index = 1
+ const indexList = []
this.showMonitorObjList.forEach((l) => {
while (l.displayid > index) {
- indexList.push(index);
- index++;
+ indexList.push(index)
+ index++
}
- index++;
- });
+ index++
+ })
if (this.showMonitorObjList.length == 0 && indexList.length == 0) {
- indexList.push(1);
+ indexList.push(1)
}
- return indexList;
+ return indexList
},
lastIndex() {
- const len = this.showMonitorObjList.length;
+ const len = this.showMonitorObjList.length
if (len > 0) {
- return this.showMonitorObjList[len - 1].displayid + 1;
+ return this.showMonitorObjList[len - 1].displayid + 1
} else {
- return 1;
+ return 1
}
},
isEdit() {
// 鏂板缓鐩戠鎬讳换鍔℃ā寮�
if (this.create) {
- return this.curMonitorObjList.length > 0;
+ return this.curMonitorObjList.length > 0
}
// 鏇存柊鐩戠鎬讳换鍔℃ā寮�
else {
- return (
- this.insertObj.length > 0 ||
- this.deleteObj.length > 0 ||
- this.updateObj.length > 0
- );
+ return this.insertObj.length > 0 || this.deleteObj.length > 0 || this.updateObj.length > 0
}
},
statisticText() {
- const total = this.curMonitorObjList.length;
- const map = new Map();
+ const total = this.curMonitorObjList.length
+ const map = new Map()
this.curMonitorObjList.forEach((e) => {
- const d = e.scene;
+ const d = e.scene
if (!map.has(d.type)) {
- map.set(d.type, { num: 0 });
+ map.set(d.type, { num: 0 })
}
- map.get(d.type).num++;
- });
+ map.get(d.type).num++
+ })
- let res = `锛堟�昏${total}涓猔;
+ let res = `锛堟�昏${total}涓猔
for (const [key, value] of map) {
- res += `锛�${key}${value.num}涓猔;
+ res += `锛�${key}${value.num}涓猔
}
- res += '锛�';
- return res;
- }
+ res += '锛�'
+ return res
+ },
},
methods: {
// 鏌ヨ
searchScene({ text, page, pageSize }) {
- this.area.sceneName = text;
+ this.area.sceneName = text
return sceneApi.searchScene(this.area, 1, 10000).then((res) => {
if (res.success) {
// 鏌ヨ缁撴灉
- this.sceneList = res.data;
+ this.sceneList = res.data
// 鎬绘暟鎹噺
- this.total = res.head.totalCount;
+ this.total = res.head.totalCount
}
- });
+ })
},
deleteMov(item) {
- if (
- !(
- item.extension1 == null ||
- item.extension1 == undefined ||
- item.extension1 == '0'
- )
- ) {
+ if (!(item.extension1 == null || item.extension1 == undefined || item.extension1 == '0')) {
ElMessage({
message: '宸茬洃绠″満鏅棤娉曠Щ闄�',
- type: 'error'
- });
- return;
+ type: 'error',
+ })
+ return
}
- const i = this.curMonitorObjList.indexOf(item);
- this.curMonitorObjList.splice(i, 1);
- const i1 = this.insertObj.indexOf(item);
- this.insertObj.splice(i1, 1);
- const i2 = this.updateObj.indexOf(item);
- this.updateObj.splice(i2, 1);
+ const i = this.curMonitorObjList.indexOf(item)
+ this.curMonitorObjList.splice(i, 1)
+ const i1 = this.insertObj.indexOf(item)
+ this.insertObj.splice(i1, 1)
+ const i2 = this.updateObj.indexOf(item)
+ this.updateObj.splice(i2, 1)
const i3 = this.updateScene.findIndex((s) => {
- return s.guid == item.sguid;
- });
- this.updateScene.splice(i3, 1);
+ return s.guid == item.sguid
+ })
+ this.updateScene.splice(i3, 1)
- this.deleteObj.push(item);
+ this.deleteObj.push(item)
},
openInsertDialog(item) {
- this.insertDialog = true;
- this.selectedScene = item;
- this.monitorTimes = 1;
+ this.insertDialog = true
+ this.selectedScene = item
+ this.monitorTimes = 1
},
openAddDialog(item) {
- this.addDialog = true;
- this.selectedScene = item;
- this.monitorTimes = 1;
+ this.addDialog = true
+ this.selectedScene = item
+ this.monitorTimes = 1
},
insertMov() {
// 1. 鍒涘缓鏂板満鏅�
- let mov = this.createMov(this.selectedIndex, this.selectedScene);
+ let mov = this.createMov(this.selectedIndex, this.selectedScene)
// 2. 鏌ユ壘绗竴涓紪鍙峰ぇ浜庢彃鍏ョ紪鍙风殑鍊硷紝灏嗘柊鐩戠瀵硅薄鎻掑叆鍏朵箣鍓�
const insertAtIndex = this.curMonitorObjList.findIndex((v) => {
- return v.displayid > this.selectedIndex;
- });
- this.curMonitorObjList.splice(insertAtIndex, 0, mov);
- this.selectedIndex = undefined;
- this.insertDialog = false;
+ return v.displayid > this.selectedIndex
+ })
+ this.curMonitorObjList.splice(insertAtIndex, 0, mov)
+ this.selectedIndex = undefined
+ this.insertDialog = false
},
addMov() {
// 1. 鍒涘缓鏂板満鏅�
- let mov = this.createMov(this.lastIndex, this.selectedScene);
+ let mov = this.createMov(this.lastIndex, this.selectedScene)
// 2. 娣诲姞鑷虫湯灏�
- this.curMonitorObjList.push(mov);
- this.addDialog = false;
+ this.curMonitorObjList.push(mov)
+ this.addDialog = false
},
// 鍒涘缓涓�涓柊鐨勭洃绠″璞�
createMov(displayid, scene) {
// 1. 鏌ユ壘璇ュ満鏅槸鍚︿箣鍓嶅凡琚垹闄�
const index = this.deleteObj.findIndex((v) => {
- return v.sguid == scene.guid;
- });
- let mov;
+ return v.sguid == scene.guid
+ })
+ let mov
// 2. 鑻ユ槸鍏ㄦ柊鐨勫満鏅紝鍒欐柊鐢熸垚涓�涓洃绠″璞★紝鍚﹀垯鍙洿鏂扮紪鍙�
if (index == -1) {
mov = {
@@ -354,27 +325,27 @@
monitornum: this.monitorTimes,
displayid: displayid,
sceneTypeId: scene.typeid,
- sceneType: scene.type
- };
- this.insertObj.push(mov);
+ sceneType: scene.type,
+ }
+ this.insertObj.push(mov)
} else {
- mov = this.deleteObj[index];
- mov.displayid = displayid;
- this.updateObj.push(mov);
- this.deleteObj.splice(index, 1);
+ mov = this.deleteObj[index]
+ mov.displayid = displayid
+ this.updateObj.push(mov)
+ this.deleteObj.splice(index, 1)
}
// 3. 鍚屾鏇存柊鍦烘櫙鍩烘湰淇℃伅涓殑缂栧彿
- scene._index = displayid;
- this.updateScene.push(scene);
+ scene._index = displayid
+ this.updateScene.push(scene)
- return mov;
+ return mov
},
// 淇濆瓨淇敼
saveEdit() {
if (this.create) {
- this.createTask();
+ this.createTask()
} else {
- this.updateTask();
+ this.updateTask()
}
},
createTask() {
@@ -386,13 +357,13 @@
title: `宸℃煡鎬讳换鍔″垱寤哄畬鎴恅,
message: `鏂板鍦烘櫙${res}涓猔,
type: 'success',
- position: 'bottom-left'
- });
- this.$emit('uploadSuccess');
+ position: 'bottom-left',
+ })
+ this.$emit('uploadSuccess')
})
- .catch((err) => this.$emit('uploadFail', err));
+ .catch((err) => this.$emit('uploadFail', err))
}
- this.updateSceneList();
+ this.updateSceneList()
},
updateTask() {
// new Promise((resolve, reject)=>{
@@ -405,10 +376,10 @@
title: `宸℃煡浠诲姟鏂板瀹屾垚`,
message: `鏂板鍦烘櫙${res}涓猔,
type: 'success',
- position: 'bottom-left'
- });
- this.insertObj = [];
- });
+ position: 'bottom-left',
+ })
+ this.insertObj = []
+ })
}
if (this.updateObj.length > 0) {
const p2 = taskApi.updateMonitorObject(this.updateObj).then((res) => {
@@ -416,10 +387,10 @@
title: `宸℃煡浠诲姟鏇存柊瀹屾垚`,
message: `鏇存柊鍦烘櫙${res}涓猔,
type: 'success',
- position: 'bottom-left'
- });
- this.updateObj = [];
- });
+ position: 'bottom-left',
+ })
+ this.updateObj = []
+ })
}
if (this.deleteObj.length > 0) {
const p3 = taskApi.deleteMonitorObject(this.deleteObj).then((res) => {
@@ -427,12 +398,12 @@
title: `宸℃煡浠诲姟鍒犻櫎瀹屾垚`,
message: `鍒犻櫎鍦烘櫙${res}涓猔,
type: 'success',
- position: 'bottom-left'
- });
- this.deleteObj = [];
- });
+ position: 'bottom-left',
+ })
+ this.deleteObj = []
+ })
}
- this.updateSceneList();
+ this.updateSceneList()
// return Promise.all([p1, p2, p3]).finally(() => {
// this.saveLoading = false;
// });
@@ -440,26 +411,26 @@
updateSceneList() {
if (this.updateScene.length > 0) {
this.updateScene.forEach((s) => {
- s.index = s._index;
- });
+ s.index = s._index
+ })
sceneApi.updateSceneList(this.updateScene).then((res) => {
ElNotification({
title: `鍦烘櫙缂栧彿鏇存柊瀹屾垚`,
message: `鏇存柊鍦烘櫙${res}涓猔,
type: 'success',
- position: 'bottom-left'
- });
- this.updateScene = [];
- });
+ position: 'bottom-left',
+ })
+ this.updateScene = []
+ })
}
- }
+ },
},
mounted() {
setTimeout(() => {
- this.searchScene({ text: '' });
- }, 1000);
- }
-};
+ this.searchScene({ text: '' })
+ }, 1000)
+ },
+}
</script>
<style scoped>
diff --git a/src/views/inspection/task/components/CompSubTaskList.vue b/src/views/inspection/task/components/CompSubTaskList.vue
index 9d9d0d8..c05123d 100644
--- a/src/views/inspection/task/components/CompSubTaskList.vue
+++ b/src/views/inspection/task/components/CompSubTaskList.vue
@@ -11,14 +11,12 @@
<el-text>{{ dateStr }}璁″垝</el-text>
</el-space>
<div v-show="create && data && data.length > 0">
- <el-button
- icon="IconPrinter"
- type="success"
- size="small"
- plain
- @click="handleInspectFileDownload"
- >鍗曟嵁鎵撳嵃</el-button
- >
+ <el-button type="success" size="small" plain @click="handleInspectFileDownload">
+ <el-icon class="el-icon--left">
+ <Icon icon="solar:printer-minimalistic-line-duotone" />
+ </el-icon>
+ 鍗曟嵁鎵撳嵃
+ </el-button>
<el-button type="success" size="small" @click="add" icon="Switch">浠诲姟璋冩暣</el-button>
<el-button type="primary" size="small" @click="openMap">
浠诲姟鍦板浘<el-icon class="el-icon--right"><Right /></el-icon>
@@ -97,6 +95,7 @@
import CompSubTaskEdit from './CompSubTaskEdit.vue'
import SceneInspectFile from '@/views/inspection/scene/SceneInspectFile.vue'
import subtaskApi from '@/api/fysp/subtaskApi'
+import { Icon } from '@iconify/vue'
const props = defineProps({
modelValue: Array,
diff --git a/src/views/monitor/DataDashboard.vue b/src/views/monitor/DataDashboard.vue
index 4d366dd..65cd655 100644
--- a/src/views/monitor/DataDashboard.vue
+++ b/src/views/monitor/DataDashboard.vue
@@ -2,10 +2,10 @@
<div class="data-dashboard">
<!-- 椤堕儴鎸囨爣鍗＄墖鍖� -->
<div class="top-cards">
- <div class="cards-container">
- <!-- 鏃堕棿鍛ㄦ湡閫夐」鍗＄墖 -->
- <div class="time-period-card">
- <div class="card-title">鏃堕棿鍛ㄦ湡</div>
+ <!-- 鏃堕棿鍛ㄦ湡閫夐」鍗＄墖 -->
+ <div class="time-period-card">
+ <div class="card-title">鏃堕棿閫夋嫨</div>
+ <div class="time-controls">
<div class="time-tab-container">
<div
v-for="tab in timeTabs"
@@ -17,8 +17,46 @@
{{ tab.label }}
</div>
</div>
+ <div class="time-navigator">
+ <button class="nav-btn" @click="navigateTime(-1)" title="涓婁竴涓懆鏈�">
+ <svg
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <path
+ d="M15 18L9 12L15 6"
+ stroke="currentColor"
+ stroke-width="2"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ />
+ </svg>
+ </button>
+ <div class="current-time">{{ currentTimeDisplay }}</div>
+ <button class="nav-btn" @click="navigateTime(1)" title="涓嬩竴涓懆鏈�">
+ <svg
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ xmlns="http://www.w3.org/2000/svg"
+ >
+ <path
+ d="M9 18L15 12L9 6"
+ stroke="currentColor"
+ stroke-width="2"
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ />
+ </svg>
+ </button>
+ </div>
</div>
-
+ </div>
+ <div class="cards-container">
<!-- 瓒呮爣鏁� -->
<div class="metric-card">
<div class="card-header">
@@ -200,7 +238,7 @@
<!-- 涓儴GIS鍦板浘鍖� -->
<div class="map-section">
<div id="map" class="map-container">
- <BaseMap></BaseMap>
+ <BaseMap :showSatellite="true"></BaseMap>
</div>
<!-- 鍦板浘鐐逛綅寮圭獥 -->
@@ -240,50 +278,175 @@
</template>
</el-dialog>
</div>
+ </div>
+ <!-- 鍙充晶瀹炴椂鐩戞祴鎬昏鍖� -->
+ <div class="overview-section">
+ <div class="section-header">
+ <h3>璁惧鐩戞帶</h3>
+ <!-- <span class="view-more">鏌ョ湅鏇村</span> -->
+ </div>
- <!-- 鍙充晶瀹炴椂鐩戞祴鎬昏鍖� -->
- <div class="overview-section">
- <div class="section-header">
- <h3>瀹炴椂鐩戞祴鎬昏</h3>
- <span class="view-more">鏌ョ湅鏇村</span>
+ <div class="overview-items-container">
+ <div class="overview-item">
+ <div class="overview-label">椁愰ギ搴楅摵鎬绘暟</div>
+ <div class="overview-value">{{ overview.totalShops }}</div>
</div>
- <div class="overview-items-container">
- <div class="overview-item">
- <div class="overview-label">椁愰ギ搴楅摵鎬绘暟</div>
- <div class="overview-value">{{ overview.totalShops }}</div>
- </div>
-
- <div class="overview-item">
- <div class="overview-label">鍦ㄧ嚎璁惧鏁�</div>
- <div class="overview-value">{{ overview.onlineDevices }}</div>
- </div>
-
- <div class="overview-item">
- <div class="overview-label">绂荤嚎璁惧鏁�</div>
- <div class="overview-value">{{ overview.offlineDevices }}</div>
- </div>
+ <div class="overview-item">
+ <div class="overview-label">鍦ㄧ嚎璁惧鏁�</div>
+ <div class="overview-value">{{ overview.onlineDevices }}</div>
</div>
- <!-- 璁惧鐘舵�侀ゼ鍥� -->
- <div class="device-status-chart">
- <canvas id="deviceStatusChart"></canvas>
+ <div class="overview-item">
+ <div class="overview-label">绂荤嚎璁惧鏁�</div>
+ <div class="overview-value">{{ overview.offlineDevices }}</div>
</div>
</div>
+
+ <!-- 璁惧鐘舵�侀ゼ鍥� -->
+ <div class="device-status-chart">
+ <canvas id="deviceStatusChart"></canvas>
+ </div>
</div>
+ <!-- 宸℃煡鎯呭喌缁熻鍗＄墖 -->
+ <el-scrollbar class="inspection-section">
+ <div class="section-header">
+ <h3>宸℃煡姹囨��</h3>
+ </div>
+
+ <!-- 宸℃煡閲忕粺璁� -->
+ <div class="inspection-metrics">
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">搴楅摵鎬昏</div>
+ <div class="inspection-metric-value">{{ inspectionStats.totalShops }}</div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">宸℃煡搴楅摵</div>
+ <div class="inspection-metric-value">{{ inspectionStats.inspectedShops }}</div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">宸℃煡鐐规</div>
+ <div class="inspection-metric-value">{{ inspectionStats.inspectionPoints }}</div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">澶嶆煡鐐规</div>
+ <div class="inspection-metric-value">{{ inspectionStats.reviewPoints }}</div>
+ </div>
+ </div>
+
+ <!-- 闂鏁存敼鎯呭喌 -->
+ <div class="inspection-chart-container">
+ <div class="section-header"><h3>鏁存敼姹囨��</h3></div>
+ <canvas id="rectificationChart"></canvas>
+ </div>
+
+ <!-- 闂瀹℃牳鎯呭喌 -->
+ <div class="inspection-table-container">
+ <div class="section-header"><h3>瀹℃牳姹囨��</h3></div>
+ <div class="inspection-metric-label">闂瀹℃牳</div>
+ <div class="inspection-table">
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鏃犻棶棰�</div>
+ <div class="inspection-metric-value">{{ inspectionStats.noProblemShops }}</div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鏈鏍�</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.unreviewedProblemShops }}
+ </div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">閮ㄥ垎瀹℃牳</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.partiallyReviewedProblemShops }}
+ </div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鍏ㄩ儴瀹℃牳</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.fullyReviewedProblemShops }}
+ </div>
+ </div>
+ </div>
+ <div class="inspection-metric-label">鏁存敼瀹℃牳</div>
+ <div class="inspection-table">
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鏈暣鏀�</div>
+ <div class="inspection-metric-value">{{ inspectionStats.unrectifiedShops }}</div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鏈鏍�</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.unreviewedRectifiedShops }}
+ </div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">閮ㄥ垎瀹℃牳</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.partiallyReviewedRectifiedShops }}
+ </div>
+ </div>
+ <div class="inspection-metric-item">
+ <div class="inspection-metric-label">鍏ㄩ儴瀹℃牳</div>
+ <div class="inspection-metric-value">
+ {{ inspectionStats.fullyReviewedRectifiedShops }}
+ </div>
+ </div>
+ <!-- <div class="table-row">
+ <div class="table-cell">鏃犻棶棰樺簵閾烘暟閲�</div>
+ <div class="table-cell value">{{ inspectionStats.noProblemShops }}</div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">闂鏈鏍稿簵閾烘暟閲�</div>
+ <div class="table-cell value">{{ inspectionStats.unreviewedProblemShops }}</div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">闂閮ㄥ垎瀹℃牳搴楅摵鏁伴噺</div>
+ <div class="table-cell value">
+ {{ inspectionStats.partiallyReviewedProblemShops }}
+ </div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">闂鍏ㄩ儴瀹℃牳搴楅摵鏁伴噺</div>
+ <div class="table-cell value">{{ inspectionStats.fullyReviewedProblemShops }}</div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">鏈暣鏀瑰簵閾烘暟</div>
+ <div class="table-cell value">{{ inspectionStats.unrectifiedShops }}</div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">鏁存敼鏈鏍稿簵閾烘暟</div>
+ <div class="table-cell value">{{ inspectionStats.unreviewedRectifiedShops }}</div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">鏁存敼閮ㄥ垎瀹℃牳搴楅摵鏁�</div>
+ <div class="table-cell value">
+ {{ inspectionStats.partiallyReviewedRectifiedShops }}
+ </div>
+ </div>
+ <div class="table-row">
+ <div class="table-cell">鏁存敼鍏ㄩ儴瀹℃牳搴楅摵鏁�</div>
+ <div class="table-cell value">{{ inspectionStats.fullyReviewedRectifiedShops }}</div>
+ </div> -->
+ </div>
+ </div>
+ </el-scrollbar>
</div>
</template>
<script>
import * as echarts from 'echarts'
-import { onMapMounted, map, AMap } from '@/utils/map/index'
+import { onMapMounted, satellite } from '@/utils/map/index'
import districtSearch from '@/utils/map/districtsearch.js'
+import marks from '@/utils/map/marks.js'
+import { generateTestShops } from '@/debug/debugdata'
export default {
name: 'DataDashboard',
data() {
return {
activeTime: 'day',
+ currentDate: new Date(),
timeTabs: [
{ label: '鏃�', value: 'day' },
{ label: '鍛�', value: 'week' },
@@ -314,13 +477,54 @@
onlineDevices: 220,
offlineDevices: 25,
},
+ inspectionStats: {
+ // 宸℃煡閲�
+ totalShops: 245,
+ inspectedShops: 180,
+ inspectionPoints: 350,
+ reviewPoints: 80,
+ // 闂鏁存敼鎯呭喌
+ problemCount: 45,
+ rectifiedCount: 38,
+ rectificationRate: 84.4,
+ // 闂瀹℃牳鎯呭喌
+ noProblemShops: 135,
+ unreviewedProblemShops: 8,
+ partiallyReviewedProblemShops: 5,
+ fullyReviewedProblemShops: 32,
+ unreviewedRectifiedShops: 3,
+ partiallyReviewedRectifiedShops: 2,
+ fullyReviewedRectifiedShops: 33,
+ unrectifiedShops: 7,
+ },
map: null,
refreshTimer: null,
}
},
+ computed: {
+ currentTimeDisplay() {
+ const date = this.currentDate
+ switch (this.activeTime) {
+ case 'day':
+ return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')}`
+ case 'week':
+ // 绠�鍗曡绠楀懆鏄剧ず锛屽疄闄呴」鐩腑鍙兘闇�瑕佹洿澶嶆潅鐨勫懆璁＄畻閫昏緫
+ let weekStart = new Date(date)
+ weekStart.setDate(date.getDate() - date.getDay() + 1)
+ let weekEnd = new Date(date)
+ weekEnd.setDate(date.getDate() + (7 - date.getDay()))
+ return `${weekStart.getFullYear()}-${String(weekStart.getMonth() + 1).padStart(2, '0')}-${String(weekStart.getDate()).padStart(2, '0')} ~ ${weekEnd.getFullYear()}-${String(weekEnd.getMonth() + 1).padStart(2, '0')}-${String(weekEnd.getDate()).padStart(2, '0')}`
+ case 'month':
+ return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}`
+ default:
+ return ''
+ }
+ },
+ },
mounted() {
this.initMap()
this.initDeviceStatusChart()
+ this.initRectificationChart()
this.startAutoRefresh()
},
beforeUnmount() {
@@ -334,16 +538,44 @@
// 妯℃嫙鍒囨崲鏃堕棿鍛ㄦ湡鍚庣殑鏁版嵁鏇存柊
this.updateMetrics()
},
- getPeriodLabel() {
+ navigateTime(direction) {
+ const newDate = new Date(this.currentDate)
switch (this.activeTime) {
case 'day':
- return '浠婃棩'
+ newDate.setDate(newDate.getDate() + direction)
+ break
case 'week':
- return '鏈懆'
+ newDate.setDate(newDate.getDate() + direction * 7)
+ break
case 'month':
- return '鏈湀'
+ newDate.setMonth(newDate.getMonth() + direction)
+ break
+ }
+ this.currentDate = newDate
+ // 妯℃嫙鍒囨崲鏃堕棿鍚庣殑鏁版嵁鏇存柊
+ this.updateMetrics()
+ },
+ getPeriodLabel() {
+ const today = new Date()
+ const isToday =
+ this.activeTime === 'day' &&
+ this.currentDate.getDate() === today.getDate() &&
+ this.currentDate.getMonth() === today.getMonth() &&
+ this.currentDate.getFullYear() === today.getFullYear()
+
+ if (isToday) {
+ return '浠婃棩'
+ }
+
+ switch (this.activeTime) {
+ case 'day':
+ return '褰撴棩'
+ case 'week':
+ return '褰撳懆'
+ case 'month':
+ return '褰撴湀'
default:
- return '浠婃棩'
+ return '褰撴棩'
}
},
getCompareLabel() {
@@ -372,14 +604,46 @@
taskCompletionRate: Math.floor(Math.random() * 40) + 60,
taskCompletionRateTrend: Math.floor(Math.random() * 15) - 7,
}
+
+ // 鏇存柊宸℃煡缁熻鏁版嵁
+ this.inspectionStats = {
+ totalShops: 245,
+ inspectedShops: Math.floor(Math.random() * 50) + 150,
+ inspectionPoints: Math.floor(Math.random() * 100) + 300,
+ reviewPoints: Math.floor(Math.random() * 50) + 50,
+ problemCount: Math.floor(Math.random() * 30) + 20,
+ rectifiedCount: Math.floor(Math.random() * 25) + 15,
+ rectificationRate: Math.round((Math.random() * 30 + 70) * 10) / 10,
+ noProblemShops: Math.floor(Math.random() * 50) + 100,
+ unreviewedProblemShops: Math.floor(Math.random() * 10),
+ partiallyReviewedProblemShops: Math.floor(Math.random() * 8),
+ fullyReviewedProblemShops: Math.floor(Math.random() * 20) + 15,
+ unreviewedRectifiedShops: Math.floor(Math.random() * 5),
+ partiallyReviewedRectifiedShops: Math.floor(Math.random() * 5),
+ fullyReviewedRectifiedShops: Math.floor(Math.random() * 20) + 15,
+ unrectifiedShops: Math.floor(Math.random() * 10),
+ }
+
+ // 鏇存柊鍥捐〃
+ this.initRectificationChart()
}, 300)
},
initMap() {
// setTimeout(() => {
districtSearch.removeDistrict()
- districtSearch.drawDistrict('涓婃捣甯�')
+ districtSearch.drawDistrictMask('涓婃捣甯�')
// districtSearch.districtLayer('310106')
// }, 2000)
+
+ onMapMounted(() => {
+ setTimeout(() => {
+ marks.clearMassMarks()
+ const shops = generateTestShops()
+ console.log(shops)
+
+ marks.drawMassMarks(shops)
+ }, 2000)
+ })
},
initDeviceStatusChart() {
const chartDom = document.getElementById('deviceStatusChart')
@@ -452,9 +716,83 @@
chart.setOption(option)
// 鍝嶅簲寮忚皟鏁�
- window.addEventListener('resize', () => {
- chart.resize()
- })
+ // window.addEventListener('resize', () => {
+ // chart.resize()
+ // })
+ }
+ },
+ initRectificationChart() {
+ const chartDom = document.getElementById('rectificationChart')
+ if (chartDom) {
+ const chart = echarts.init(chartDom)
+ const option = {
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow',
+ },
+ backgroundColor: 'rgba(255, 255, 255, 0.95)',
+ borderColor: '#e8e8e8',
+ borderWidth: 1,
+ textStyle: {
+ color: '#333',
+ },
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true,
+ },
+ xAxis: {
+ type: 'category',
+ data: ['闂鏁�', '鏁存敼鏁�'],
+ axisLabel: {
+ color: '#86909c',
+ fontSize: 12,
+ },
+ },
+ yAxis: {
+ type: 'value',
+ axisLabel: {
+ color: '#86909c',
+ fontSize: 12,
+ },
+ },
+ series: [
+ {
+ name: '鏁伴噺',
+ type: 'bar',
+ data: [
+ {
+ value: this.inspectionStats.problemCount,
+ itemStyle: {
+ color: '#fa8c16',
+ },
+ },
+ {
+ value: this.inspectionStats.rectifiedCount,
+ itemStyle: {
+ color: '#52c41a',
+ },
+ },
+ ],
+ barWidth: '60%',
+ label: {
+ show: true,
+ position: 'top',
+ color: '#262626',
+ fontSize: 12,
+ },
+ },
+ ],
+ }
+ chart.setOption(option)
+
+ // 鍝嶅簲寮忚皟鏁�
+ // window.addEventListener('resize', () => {
+ // chart.resize()
+ // })
}
},
startAutoRefresh() {
@@ -476,7 +814,7 @@
/* 鍏ㄥ眬鏍峰紡 */
.data-dashboard {
width: 100%;
- height: calc(100vh - 60px);
+ height: calc(100vh - 70px);
background-color: #f5f7fa;
color: #333;
box-sizing: border-box;
@@ -488,32 +826,34 @@
/* 椤堕儴鎸囨爣鍗＄墖鍖� */
.top-cards {
position: absolute;
- top: 24px;
- left: 24px;
+ top: 4px;
+ left: 4px;
z-index: 10;
margin-bottom: 24px;
}
.cards-container {
display: grid;
- grid-template-columns: 280px;
- grid-template-rows: auto repeat(4, auto);
- gap: 16px;
- background-color: rgba(255, 255, 255, 0.9);
- padding: 16px;
+ grid-template-columns: repeat(2, 180px);
+ grid-template-rows: auto repeat(2, auto);
+ gap: 8px;
+ /* background-color: rgba(255, 255, 255, 0.9); */
+ /* padding: 16px; */
border-radius: 8px;
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); */
}
/* 鏃堕棿鍛ㄦ湡鍗＄墖 */
.time-period-card {
background-color: #ffffff;
border-radius: 8px;
- padding: 20px;
+ padding: 4px 16px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);
display: flex;
flex-direction: column;
justify-content: center;
+ margin-bottom: 8px;
+ min-width: 300px;
}
.time-period-card .card-title {
@@ -522,6 +862,12 @@
font-weight: 500;
margin-bottom: 16px;
text-align: center;
+}
+
+.time-controls {
+ display: flex;
+ flex-direction: column;
+ gap: 16px;
}
.time-tab-container {
@@ -533,7 +879,7 @@
}
.time-tab {
- padding: 2px 4px;
+ padding: 4px 8px;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
@@ -543,6 +889,7 @@
text-align: center;
border: 1px solid #e8e8e8;
background-color: #fafafa;
+ flex: 1;
}
.time-tab.active {
@@ -556,6 +903,43 @@
color: #1890ff;
border-color: #e6f7ff;
background-color: #e6f7ff;
+}
+
+.time-navigator {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 12px;
+ padding: 8px 0;
+}
+
+.nav-btn {
+ width: 32px;
+ height: 32px;
+ border: 1px solid #e8e8e8;
+ background-color: #fafafa;
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ transition: all 0.3s ease;
+ color: #4e5969;
+}
+
+.nav-btn:hover {
+ border-color: #1890ff;
+ color: #1890ff;
+ background-color: #e6f7ff;
+}
+
+.current-time {
+ font-size: 14px;
+ font-weight: 500;
+ color: #262626;
+ min-width: 180px;
+ text-align: center;
+ padding: 0 12px;
}
/* 鎸囨爣鍗＄墖 */
@@ -714,8 +1098,8 @@
/* 鍙充晶瀹炴椂鐩戞祴鎬昏鍖� */
.overview-section {
position: absolute;
- top: 200px;
- right: 24px;
+ bottom: 4px;
+ left: 4px;
width: 320px;
background-color: rgba(255, 255, 255, 0.9);
border-radius: 8px;
@@ -731,7 +1115,6 @@
display: flex;
justify-content: space-between;
align-items: center;
- margin-bottom: 24px;
padding-bottom: 16px;
border-bottom: 1px solid #f0f0f0;
}
@@ -759,11 +1142,101 @@
.device-status-chart {
flex: 1;
- margin-top: 16px;
- min-height: 200px;
+ min-height: 100px;
display: flex;
align-items: center;
justify-content: center;
+ margin-bottom: 16px;
+}
+
+/* 宸℃煡鎯呭喌缁熻 */
+.inspection-section {
+ position: absolute;
+ top: 4px;
+ right: 4px;
+ width: 320px;
+ background-color: rgba(255, 255, 255, 0.9);
+ border-radius: 8px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+ padding: 20px;
+ display: flex;
+ flex-direction: column;
+ z-index: 10;
+ max-height: calc(70vh);
+ border-top: 1px solid #f0f0f0;
+}
+
+.inspection-metrics {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ gap: 12px;
+ margin-bottom: 20px;
+}
+
+.inspection-metric-item {
+ background-color: #fafafa;
+ border-radius: 6px;
+ padding: 12px;
+ text-align: center;
+}
+
+.inspection-metric-label {
+ font-size: 12px;
+ color: #86909c;
+ margin-bottom: 4px;
+}
+
+.inspection-metric-value {
+ font-size: 18px;
+ font-weight: bold;
+ color: #262626;
+}
+
+.inspection-chart-container {
+ margin-bottom: 20px;
+}
+
+.chart-title {
+ font-size: 14px;
+ font-weight: 500;
+ color: #262626;
+ margin-bottom: 12px;
+}
+
+.inspection-table-container {
+ /* max-height: 200px; */
+ /* overflow-y: auto; */
+}
+
+.inspection-table {
+ /* width: 100%;
+ border-collapse: collapse; */
+ display: grid;
+ grid-template-columns: repeat(4, 1fr);
+ gap: 2px;
+ margin-bottom: 20px;
+}
+
+.table-row {
+ display: flex;
+ border-bottom: 1px solid #f0f0f0;
+ padding: 8px 0;
+}
+
+.table-row:last-child {
+ border-bottom: none;
+}
+
+.table-cell {
+ flex: 1;
+ font-size: 12px;
+ color: #4e5969;
+}
+
+.table-cell.value {
+ font-weight: 500;
+ color: #262626;
+ text-align: right;
}
/* 寮圭獥鏍峰紡 */
@@ -791,7 +1264,7 @@
}
/* 鍝嶅簲寮忚璁� */
-@media (max-width: 1200px) {
+/* @media (max-width: 1200px) {
.top-cards {
position: relative;
margin-bottom: 24px;
@@ -817,9 +1290,9 @@
margin-top: 16px;
background-color: #ffffff;
}
-}
+} */
-@media (max-width: 768px) {
+/* @media (max-width: 768px) {
.data-dashboard {
padding: 16px;
}
@@ -861,5 +1334,5 @@
width: 100%;
text-align: left;
}
-}
+} */
</style>
--
Gitblit v1.9.3