yanzhen-design-vue
Version:
70 lines (69 loc) • 2.22 kB
JavaScript
import { defineComponent, ref, withDirectives, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, createVNode, toDisplayString, withCtx, createTextVNode, vShow } from "vue";
import { Button } from "ant-design-vue";
import { EnvironmentOutlined } from "@ant-design/icons-vue";
import { mapName, mapProps, mapOptions } from "./map.mjs";
const _hoisted_1 = { class: "cl-map-control" };
const _hoisted_2 = { class: "location-detail" };
const _hoisted_3 = {
id: "gd-map",
class: "map"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
...{ name: mapName },
__name: "map",
props: mapProps,
setup(__props) {
const { class: wrapClass } = mapOptions;
const mapVisible = ref(false);
let outClickFn;
const vOutClick = {
beforeMount(el, binding) {
outClickFn = (e) => {
if (!el.contains(e.target)) {
binding.value();
}
};
document.addEventListener("click", outClickFn);
},
beforeUnmount() {
if (outClickFn) {
document.removeEventListener("click", outClickFn);
}
}
};
const handleMapVisible = () => {
mapVisible.value = !mapVisible.value;
};
const handleCloseMap = () => {
mapVisible.value = false;
};
return (_ctx, _cache) => {
return withDirectives((openBlock(), createElementBlock("div", {
class: normalizeClass(["cl-map-warp", unref(wrapClass)])
}, [
createElementVNode("div", _hoisted_1, [
createVNode(unref(EnvironmentOutlined), { class: "location-icon" }),
createElementVNode("span", _hoisted_2, toDisplayString(_ctx.location), 1),
createVNode(unref(Button), {
type: "primary",
size: "small",
onClick: handleMapVisible
}, {
default: withCtx(() => _cache[0] || (_cache[0] = [
createTextVNode("重新定位")
])),
_: 1
})
]),
withDirectives(createElementVNode("div", _hoisted_3, null, 512), [
[vShow, mapVisible.value]
])
], 2)), [
[vOutClick, handleCloseMap]
]);
};
}
});
export {
_sfc_main as default
};