kanglai
/
kicc-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

调整地图设计器数据结构

master
wangxiang 3 years ago
parent
1a86db4611
commit
892883a2a8
2 changed files with 121 additions and 82 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 100
      src/components/AMap/src/AMapDesigner/index.vue
  2. 103
      src/components/AMap/src/components/Toolbar.vue

100
src/components/AMap/src/AMapDesigner/index.vue
Unescape View File

@ -1,68 +1,20 @@ @@ -1,68 +1,20 @@
<template>
<div class="amap-designer">
<div v-show="mapProps.sidebarControl" class="headToolbar">
<ATooltip v-if="toolbar.includes('save')"
title="保存并发布"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="handleMapSave">
<Icon icon="fa6-regular:floppy-disk" size="13"/>保存
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('addTask')"
title="新增任务"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="handleOpenTask">
<Icon icon="fa6-regular:window-restore" size="13"/>任务
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('point')"
title="调整标记点"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="handleOpenMapPoint">
<Icon icon="fa6-solid:location-dot" size="13"/>标记点
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('zoomIn')"
title="放大"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button :disabled="mapState.defaultZoom >= 9" @click="handleMapZoomIn">
<Icon icon="fa6-solid:magnifying-glass-plus" size="13"/>
</a-button>
</ATooltip>
<a-button>
{{ Math.ceil(mapState.defaultZoom * 10 * 1.1) + "%" }}
</a-button>
<ATooltip v-if="toolbar.includes('zoomOut')"
title="缩小"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button :disabled="mapState.defaultZoom <= 0" @click="handleMapZoomOut">
<Icon icon="fa6-solid:magnifying-glass-minus" size="13"/>
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('reset')"
title="重置"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button @click="handleMapReset">
<Icon icon="fa-solid:broom" size="13"/>
</a-button>
</ATooltip>
</div>
<Toolbar v-show="toolbarControl"
class="headToolbar"
:default-zoom="mapState.defaultZoom"
:toolbar="toolbar"
@save="handleMapSave"
@addTask="handleOpenTask"
@point="handleOpenMapPoint"
@zoomIn="handleMapZoomIn"
@zoomOut="handleMapZoomOut"
@reset="handleMapReset"
/>
<div id="mapview" ref="mapview">
<div id="mapPanel" ref="mapPanel"/>
</div>
<div v-show="mapProps.sidebarControl" class="operatePanel">
<div v-show="sidebarControl" class="operatePanel">
<div class="operatePanel-arrow" @click="toggleOperatePanel()">
<span title="展开">‹</span>
<p title="隐藏">›</p>
@ -132,8 +84,6 @@ @@ -132,8 +84,6 @@
import { listHospital } from '/@/api/platform/common/controller/hospital';
import { listUser } from '/@/api/platform/system/controller/user';
import { listOrg } from '/@/api/platform/common/controller/org';
import AButton from '/@/components/Button/src/BasicButton.vue';
import { Icon } from '/@/components/Icon';
import { useUserStore } from '/@/store/modules/user';
import { split, divide, subtract, merge, isEmpty, cloneDeep } from 'lodash-es';
import componentSetting from '/@/settings/componentSetting';
@ -142,6 +92,7 @@ @@ -142,6 +92,7 @@
import { useMessage } from '/@/hooks/web/useMessage';
import { listMapTaskPreset } from '/@/api/platform/common/controller/mapTaskPreset';
import { defaultMapData } from '/@/enums/amapEnum';
import Toolbar from '../components/Toolbar.vue';
/** 类型规范统一声明定义区域 */
interface MapState {
@ -709,11 +660,11 @@ @@ -709,11 +660,11 @@
function handleMapReset() {
nextTick(()=> {
// 清除地图
map.resize();
map.clearMap();
map?.resize();
map?.clearMap();
// 清除表单数据
formElRef.value.resetFields();
formElRef.value.clearValidate();
formElRef.value?.resetFields();
formElRef.value?.clearValidate();
// 清除地图数据
mapState.mapData.courierUserName = '';
mapState.mapData.courierLng = undefined;
@ -725,8 +676,7 @@ @@ -725,8 +676,7 @@
mapState.mapData.mapLogisticPoint = [];
setTableData([]);
// 重置地图画布
map.setZoomAndCenter(mapState.mapConfig.options.zoom, mapState.mapConfig.options.center);
mapState.defaultZoom = mapState.mapConfig.options.zoom;
map?.setZoomAndCenter(mapState.mapConfig.options.zoom, mapState.mapConfig.options.center);
});
}
@ -811,22 +761,8 @@ @@ -811,22 +761,8 @@
}
.headToolbar {
padding: 0 20px;
background-color: white;
border: 1px solid @borderColor;
position: absolute;
top: 0;
left: 0;
right: @siderWidth;
bottom: 0;
text-align: left;
line-height: 50px!important;
height: 50px !important;
.ant-btn {
font-size: 13px;
margin-right: 1px;
}
}
}

103
src/components/AMap/src/components/Toolbar.vue
Unescape View File

@ -0,0 +1,103 @@ @@ -0,0 +1,103 @@
<template>
<div class="headToolbar">
<ATooltip v-if="toolbar.includes('save')"
title="保存并发布"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="emit('save')">
<Icon icon="fa6-regular:floppy-disk" size="13"/>保存
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('addTask')"
title="新增任务"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="emit('addTask')">
<Icon icon="fa6-regular:window-restore" size="13"/>任务
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('point')"
title="调整标记点"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button type="primary" @click="emit('point')">
<Icon icon="fa6-solid:location-dot" size="13"/>标记点
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('zoomIn')"
title="放大"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button :disabled="defaultZoom >= 9" @click="emit('zoomIn')">
<Icon icon="fa6-solid:magnifying-glass-plus" size="13"/>
</a-button>
</ATooltip>
<a-button>
{{ Math.ceil(defaultZoom * 10 * 1.1) + "%" }}
</a-button>
<ATooltip v-if="toolbar.includes('zoomOut')"
title="缩小"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button :disabled="defaultZoom <= 0" @click="emit('zoomOut')">
<Icon icon="fa6-solid:magnifying-glass-minus" size="13"/>
</a-button>
</ATooltip>
<ATooltip v-if="toolbar.includes('reset')"
title="重置"
placement="bottom"
:arrowPointAtCenter="true"
>
<a-button @click="emit('reset')">
<Icon icon="fa-solid:broom" size="13"/>
</a-button>
</ATooltip>
</div>
</template>
<script lang="ts" setup>
import { PropType } from 'vue';
import { propTypes } from '/@/utils/propTypes';
import { Tooltip } from 'ant-design-vue';
import { Icon } from '/@/components/Icon';
/** 通用变量统一声明区域 */
const toolbarProps = defineProps({
defaultZoom: propTypes.number.def(1),
toolbar: {
type: Array as PropType<string[]>,
default: () => ['save', 'addTask', 'point', 'zoomIn', 'zoomOut', 'reset']
},
});
const emit = defineEmits(['save', 'addTask', 'point', 'zoomIn', 'zoomOut', 'reset']);
const ATooltip = Tooltip;
</script>
<style lang="less" scoped>
.headToolbar {
padding: 0 20px;
background-color: white;
border: 1px solid #e0e0e0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align: left;
line-height: 50px!important;
height: 50px !important;
.ant-btn {
font-size: 13px;
margin-right: 1px;
}
}
</style>
Write Preview
Loading…
Cancel
Save