diff --git a/src/assets/images/info-modal.png b/src/assets/images/info-modal.png new file mode 100644 index 0000000..2be6ce4 Binary files /dev/null and b/src/assets/images/info-modal.png differ diff --git a/src/assets/less/amap-item.less b/src/assets/less/amap-item.less index 10ea617..0248f3c 100644 --- a/src/assets/less/amap-item.less +++ b/src/assets/less/amap-item.less @@ -1,65 +1,79 @@ //高德信息弹窗 .amap-info-contentContainer { - .amap-content-body { - background: #00152B; - border: 1px solid #129BFF; + .amap-content-body { + background: #00152B; + border: 1px solid #129BFF; - .amap-lib-infowindow { - background: #00152B; + .amap-lib-infowindow { + background: #00152B; - .amap-lib-infowindow-title { - color: #fff; - border-bottom: 1px solid #129BFF; - padding: 4px 0; - } + .amap-lib-infowindow-title { + color: #fff; + border-bottom: 1px solid #129BFF; + padding: 4px 0; + } - .amap-lib-infowindow-content { - color: #fff; - padding: 4px 0; - } - } + .amap-lib-infowindow-content { + color: #fff; + padding: 4px 0; + } } + } - .amap-combo-close { - top: 5px; - right: 7px; - } + .amap-combo-close { + top: 5px; + right: 7px; + } } /*地图元素样式---start*/ //marker .amap-marker-label { - padding: 0; - border: none; + padding: 0; + border: none; } .alarm-content { - background-color: #263d5e; + background-color: #263d5e; + color: #fff; + font-size: 14px; + padding: 7px 10px; + border: 1px solid #1b7ef2; + position: relative; + + .close-btn { + position: absolute; + top: -6px; + right: -8px; + width: 15px; + height: 15px; + font-size: 12px; + background: #ccc; + border-radius: 50%; color: #fff; - font-size: 14px; - padding: 7px 10px; - border: 1px solid #1b7ef2; - position: relative; + text-align: center; + line-height: 15px; + box-shadow: -1px 1px 1px rgba(10, 10, 10, 0.2); + } - .close-btn { - position: absolute; - top: -6px; - right: -8px; - width: 15px; - height: 15px; - font-size: 12px; - background: #ccc; - border-radius: 50%; - color: #fff; - text-align: center; - line-height: 15px; - box-shadow: -1px 1px 1px rgba(10, 10, 10, 0.2); - } - - .close-btn:hover { - background: #666; - } + .close-btn:hover { + background: #666; + } } -/*地图元素样式---end*/ \ No newline at end of file +/*地图元素样式---end*/ +/*infoWindow*/ +.amap-info-content { + width: 100%; + height: 100%; + background: url("../images/info-modal.png") no-repeat center; + background-size: 100% 100%; + //padding: 16px 18px 22px 10px; +} + +.amap-info-contentContainer { + .amap-info-sharp { + border-top: none; + } +} \ No newline at end of file diff --git a/src/assets/mapUtils/map.ts b/src/assets/mapUtils/map.ts index da5ab03..c07fa8d 100644 --- a/src/assets/mapUtils/map.ts +++ b/src/assets/mapUtils/map.ts @@ -16,6 +16,7 @@ export const Map = { airMarkerList: [], //直升机markerList placeSearch: null, //地点查询 marker: null, // 健康终端报警 + infoWindow: null, //地图弹窗 /** * @desc 地图舒适化 * @param el dom元素 id选择器 @@ -101,6 +102,7 @@ export const Map = { this.airMarkerList = []; } this.clearActiveHospital(); + this.clearInfoModal(); // this.map.remove(this.airMarkerList); }, // /** @@ -132,6 +134,8 @@ export const Map = { position: [lon, lat], // 指定点的icon，也可以是个url ，但这样就不能对图片进行设置了 icon: startIcon, //启用点击事件 如果需要点击事件，必须开启 clickable: true, //点额外携带的数据，用户自定义属性，支持JavaScript API任意数据类型 + offset: [-18, -32], + maxZoom: 14, extData: result[i], label: { content: isFunction(extData?.content) && extData?.content(result[i]), @@ -277,4 +281,24 @@ export const Map = { this.marker = null; } }, + /** + * @desc 创建地图详情弹窗 + * + * */ + createInfoModal({ option, content }) { + let { lat, lng } = option; + this.infoWindow = new AMap.InfoWindow({ + position: [lng, lat], + offset: new AMap.Pixel(-5, -25), + content: content, + closeWhenClickMap: true, + }); + this.infoWindow.open(this.map); + }, + clearInfoModal() { + if (this.infoWindow) { + this.infoWindow?.setMap(null); + this.infoWindow = null; + } + }, }; diff --git a/src/components/chinaMap/chinaMap.vue b/src/components/chinaMap/chinaMap.vue index 9ca3ac3..13ebf6a 100644 --- a/src/components/chinaMap/chinaMap.vue +++ b/src/components/chinaMap/chinaMap.vue @@ -86,7 +86,7 @@ Map.clearActiveHospital(); Map.map.off('moveend', logMapinfo); if (TabType.diFangYiYuan == item.type) { - Map.clearActiveHospital(); + Map.removeOverlayGroup(); Map.map.on('moveend', logMapinfo); return; } diff --git a/src/components/item-d/pieCharts.ts b/src/components/item-d/pieCharts.ts index a104caf..9c3c1d1 100644 --- a/src/components/item-d/pieCharts.ts +++ b/src/components/item-d/pieCharts.ts @@ -79,18 +79,31 @@ export function circleRing(chartData, total, color) { series: [ { type: 'pie', - radius: ['50%', '82%'], - center: ['42%', '55%'], + radius: ['50%', '75%'], + center: ['42%', '50%'], avoidLabelOverlap: false, + // label: { + // show: true, + // // position: 'inner', + // formatter: '{d}%', + // color: '#ffffff', + // fontSize: 14, + // }, + // labelLine: { + // show: false, + // }, label: { show: true, - position: 'inner', + position: 'outside', formatter: '{d}%', color: '#ffffff', fontSize: 14, }, labelLine: { - show: false, + show: true, + length: 4, + length2: 12, + minTurnAngle: 120, }, data: data, }, diff --git a/src/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue b/src/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue index 58487b1..0c78b6b 100644 --- a/src/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue +++ b/src/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue @@ -126,6 +126,7 @@ .ant-table-striped :deep(.table-striped) td { background-color: #00152b; border-bottom: 1px solid #2384dd; + padding: 10px 4px !important; } :deep(.ant-table-tbody > tr.ant-table-row:hover > td, .ant-table-tbody > tr > td.ant-table-cell-row-hover) { diff --git a/src/components/secondaryScreen/secondMap/components/footerDialog.vue b/src/components/secondaryScreen/secondMap/components/footerDialog.vue index fe1ff16..074186b 100644 --- a/src/components/secondaryScreen/secondMap/components/footerDialog.vue +++ b/src/components/secondaryScreen/secondMap/components/footerDialog.vue @@ -1,15 +1,21 @@ - + \ No newline at end of file diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/publicTitle.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/publicTitle.vue index 091108b..b7345a5 100644 --- a/src/components/secondaryScreen/secondMap/components/userInfoModal/publicTitle.vue +++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/publicTitle.vue @@ -1,4 +1,5 @@ -
{{ getDateFormat(dateInfo) }}
+
{{ getDateFormat(dateInfo) }}
@@ -284,4 +292,4 @@ box-shadow: none; } } - + \ No newline at end of file diff --git a/src/components/secondaryScreen/secondMap/components/userInfoModal/temperature.vue b/src/components/secondaryScreen/secondMap/components/userInfoModal/temperature.vue index d98000a..4c511b9 100644 --- a/src/components/secondaryScreen/secondMap/components/userInfoModal/temperature.vue +++ b/src/components/secondaryScreen/secondMap/components/userInfoModal/temperature.vue @@ -139,6 +139,9 @@ { type: 'value', name: '温度', + nameTextStyle: { + color: '#fff', + }, axisLabel: { color: '#fff', }, @@ -205,4 +208,4 @@ initEchart('0'); }); - + \ No newline at end of file diff --git a/src/components/secondaryScreen/secondMap/secondMap.vue b/src/components/secondaryScreen/secondMap/secondMap.vue index 103dfc8..f717896 100644 --- a/src/components/secondaryScreen/secondMap/secondMap.vue +++ b/src/components/secondaryScreen/secondMap/secondMap.vue @@ -9,7 +9,6 @@
-
0) { const newArr = result.map((item) => ({ ...item, type: '6' })); mapList.value = newArr; - let orgCode = newArr[0].orgCode?.substring(0, 6); - getFooterTable(orgCode); - setIsShow(true); - Map.createOverlay( newArr, { @@ -104,14 +100,20 @@
`; }, }, - (val) => { - getFooterTable(val.orgCode?.substring(0, 6)); - setIsShow(true); + async (val) => { + let params = { + orgCodeLeaf: val.orgCode, + orgCode: null, + }; + const { code, result } = await footerApi(params); + if (code == 200) { + Map.createInfoModal({ option: val, content: infoContent(result) }); + setIsShow(true); + } } ); } else { Map.removeOverlayGroup(); - setIsShow(false); } } catch {} } @@ -246,4 +248,25 @@ } } } + + :deep(.watch-modal) { + width: 300px; + height: 190px; + display: flex; + flex-direction: column; + justify-content: center; + padding-left: 10px; + + .modal-row { + font-size: 16px; + line-height: 34px; + color: #fff; + + .label { + display: inline-flex; + justify-content: flex-end; + width: 140px; + } + } + } \ No newline at end of file diff --git a/src/components/secondaryScreen/secondMap/secondMapHooks.ts b/src/components/secondaryScreen/secondMap/secondMapHooks.ts index e17b130..a4886b2 100644 --- a/src/components/secondaryScreen/secondMap/secondMapHooks.ts +++ b/src/components/secondaryScreen/secondMap/secondMapHooks.ts @@ -80,12 +80,6 @@ export function useFooterTable() { key: 'userCount', extData: {}, }, - // { - // name: '入库设备数量', - // value: '', - // key: 'deviceNum', - // extData: {}, - // }, { name: '佩戴手表人数', value: '', @@ -104,12 +98,6 @@ export function useFooterTable() { key: 'thirtyDayNum', extData: {}, }, - { - name: '近一年活跃人数', - value: '', - key: 'yearDayNum', - extData: {}, - }, ]); function setFooterList(res: any) { @@ -148,6 +136,18 @@ export function useAlarmDetail() { value: '', key: 'orgName2', }, + { + name: '位置', + value: '', + key: '', + customRender: (record) => { + if (record?.lat) { + return `${record.lat},${record.lon}`; + } else { + return '未知位置'; + } + }, + }, ]); const detailRight = ref([ { @@ -175,10 +175,18 @@ export function useAlarmDetail() { function setDetail(res) { if (res) { detailLeft.value.forEach((item) => { - item.value = res[item.key]; + if (item.customRender) { + item.value = res; + } else { + item.value = res[item.key]; + } }); detailRight.value.forEach((item) => { - item.value = res[item.key]; + if (item.customRender) { + item.value = res; + } else { + item.value = res[item.key]; + } }); } } @@ -238,7 +246,7 @@ export function useTree() { export const columns = [ { - title: '员工名称', + title: '员工姓名', dataIndex: 'realName', align: 'center', key: 'realName', @@ -248,18 +256,21 @@ export const columns = [ dataIndex: 'orgName', align: 'center', key: 'orgName', + ellipsis: true, }, { title: '部门名称', dataIndex: 'orgName1', align: 'center', key: 'orgName1', + ellipsis: true, }, { title: '工具编码', dataIndex: 'watchNo', align: 'center', key: 'watchNo', + ellipsis: true, }, { title: '心率（次/分）', @@ -314,14 +325,41 @@ export const columns = [ ]; export function useChangeTable() { - const refresh = ref(true) + const refresh = ref(true); function setRefresh() { - refresh.value = !refresh.value + refresh.value = !refresh.value; } return { refresh, - setRefresh - } + setRefresh, + }; +} + +export function infoContent(res) { + return ` +
+
+ 部门名称： + ${res?.orgName} +
+
+ 部门人数： + ${res?.userCount} +
+
+ 佩戴手表人数： + ${res?.allotDeviceNum} +
+
+ 近一周活跃人数： + ${res?.sevenDayNum} +
+
+ 近一月人数： + ${res?.thirtyDayNum} +
+
+ `; } \ No newline at end of file diff --git a/src/views/sys/login.vue b/src/views/sys/login.vue index ef2762d..4d88d18 100644 --- a/src/views/sys/login.vue +++ b/src/views/sys/login.vue @@ -99,6 +99,8 @@ import { t } from '/@/hooks/locales/useLocales.ts'; import { encipher } from '/@/utils/jsencrypt'; import { useRouter } from 'vue-router'; + import { getAuthCache } from '/@/utils/auth.ts'; + import { TOKEN_KEY } from '/@/enum/cacheEnum.ts'; const router = useRouter(); // console.log(t('login')); @@ -203,6 +205,10 @@ onMounted(() => { //加载验证码 handleChangeCheckCode(); + let token = getAuthCache(TOKEN_KEY); + if (token) { + router.push({ path: '/home' }); + } });