From e260e787a00665de298eaa2d4256dbb81ad50886 Mon Sep 17 00:00:00 2001
From: 1012414140@qq.com <1012414140@qq.com>
Date: 星期五, 26 十二月 2025 15:28:21 +0800
Subject: [PATCH] feat: 添加智慧停车场页面
---
src/components/page/smartPark.vue | 114 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
src/router/index.js | 5 ++
2 files changed, 119 insertions(+), 0 deletions(-)
diff --git a/src/components/page/smartPark.vue b/src/components/page/smartPark.vue
new file mode 100644
index 0000000..0b4e4d4
--- /dev/null
+++ b/src/components/page/smartPark.vue
@@ -0,0 +1,114 @@
+<template>
+ <div>
+ <div style="padding-top:10px;"></div>
+ <table border="1" class="dataframe">
+ <thead>
+ <tr style="text-align: right;">
+ <th>鍋滆溅鍦�</th>
+ <th>杞︿綅鎬绘暟</th>
+ <th>鍓╀綑</th>
+ <th>瀵艰埅</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr v-for="(item, index) in tableData" :key="item.id">
+ <td style="text-align: left;">{{ item.name }}</td>
+ <td>{{ item.num }}</td>
+ <td>{{ Math.floor(Number(item.num) - Number(item.carNum)) }}</td>
+ <td style="text-align: left;"><a @click="goPark(item.name)">鎵撳紑瀵艰埅</a></td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+</template>
+
+<script>
+export default {
+ data() {
+ return {
+ tableData: [],
+ urlPath: this.$systemconfig.basePath + '/ffzf/park/',
+ }
+ },
+
+ created() {
+ this.getTableData()
+ },
+
+ methods: {
+ getTableData() {
+ this.$byutil.postData4(this, this.urlPath + 'findPage', { size: 50 }, res => {
+ this.tableData = res.data.records
+ });
+ },
+
+ goPark(name) {
+ // console.log('name=', name);
+ this.openMap('114.23123', '36.43123', name, "baidu");
+ },
+
+ // ---------------------------------
+ openMap(longitude, latitude, name, mapApp) {
+ let url;
+ switch (mapApp) {
+ case 'baidu':
+ url = `baidumap://map/marker?location=${latitude},${longitude}&title=${encodeURIComponent(name)}&content=${encodeURIComponent(name)}&src=webapp`;
+ break;
+ case 'gaode':
+ url = `iosamap://navi?sourceApplication=webapp&backScheme=myapp://&lat=${latitude}&lon=${longitude}&name=${encodeURIComponent(name)}&dev=0`;
+ break;
+ case 'tencent':
+ url = `qqmap://map/rgeo?location=${latitude},${longitude}&name=${encodeURIComponent(name)}&coord_type=1&policy=0`;
+ break;
+ default:
+ console.error('涓嶆敮鎸佺殑鍦板浘绫诲瀷');
+ return;
+ }
+
+ // 浣跨敤iframe鎵撳紑URL Scheme锛岄伩鍏嶇洿鎺ヨ烦杞鑷撮〉闈㈠崱姝�
+ const iframe = document.createElement('iframe');
+ iframe.style.display = 'none';
+ iframe.src = url;
+ document.body.appendChild(iframe);
+ setTimeout(() => {
+ document.body.removeChild(iframe);
+ }, 1000);
+
+
+ // 瀹氭椂鍣ㄦ娴嬫槸鍚﹀敜璧锋垚鍔燂紝濡傛灉澶辫触鍒欒烦杞埌缃戦〉鐗堝湴鍥�
+ let timer = setTimeout(() => {
+ window.location.href = `https://uri.amap.com/marker?position=${longitude},${latitude}&name=${encodeURIComponent(name)}&src=mypage&coordinate=gaode&callnative=0`; // 榛樿璺宠浆楂樺痉缃戦〉鐗�
+ }, 2000);
+
+ window.addEventListener('blur', () => {
+ clearTimeout(timer)
+ });
+
+ }
+ },
+}
+</script>
+
+<style scoped>
+table {
+ width: 100%;
+ border-collapse: collapse;
+}
+
+th,
+td {
+ border: 1px solid #ddd;
+ padding: 8px;
+ text-align: center;
+}
+
+th {
+ background-color: #f2f2f2;
+}
+
+@media (max-width: 600px) {
+ table {
+ font-size: 14px;
+ }
+}
+</style>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 2df8b20..cdc05c0 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -210,6 +210,11 @@
component: resolve => require(['../components/page/MonthFeePay.vue'], resolve),
meta: { title: '鏈堢杞︾即璐�' }
},
+ {
+ path: '/smartParking',
+ component: resolve => require(['../components/page/smartPark.vue'], resolve),
+ meta: { title: '宄板嘲鏅烘収鍋滆溅' }
+ },
]
})
--
Gitblit v1.9.1