@web-utils/form-ui 1.0.0-beta86 → 1.0.0-beta88

package/fy-input-map/index.d.ts

@@ -0,0 +1,266 @@
+declare const _default: import('vue').DefineComponent<globalThis.ExtractPropTypes<{
+    dialogWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    rows: NumberConstructor;
+    minRows: {
+        type: NumberConstructor;
+        default: number;
+    };
+    maxRows: {
+        type: NumberConstructor;
+    };
+}>, {}, {
+    formattedAddress: string;
+    address: string;
+    poi: {};
+    marker: null;
+    map: null;
+    box: boolean;
+}, {
+    longitude(): undefined;
+    latitude(): undefined;
+    title(): "查看" | "选择";
+}, {
+    clear(): void;
+    handleSubmit(): void;
+    handleClear(): void;
+    setVal(): void;
+    handleShow(): void;
+    addMarker(R: any, P: any): void;
+    clearMarker(): void;
+    getAddress(R: any, P: any): void;
+    handleClose(): void;
+    addClick(): void;
+    init(callback: any): void;
+    initPoip(): void;
+    poiPickerReady(poiPicker: any): void;
+}, {
+    mixins: {
+        methods: {
+            getSlotName(item: any | undefined, type: string | undefined, slot: string): any;
+            getSlotList(list: never[] | undefined, slot: string, propList: Array<any>): string[];
+        };
+    }[];
+    data(): {
+        stringMode: boolean;
+        name: string;
+        text: undefined;
+        propsHttpDefault: {
+            name: string;
+            url: string;
+            fileName: string;
+            res: string;
+        };
+        propsDefault: {
+            rowKey: string;
+            rowParentKey: string;
+            nodeKey: string;
+            label: string;
+            value: string;
+            desc: string;
+            groups: string;
+            title: string;
+            leaf: string;
+            children: string;
+            hasChildren: string;
+            labelText: string;
+            disabled: string;
+        };
+    };
+    props: {
+        blur: FunctionConstructor;
+        focus: FunctionConstructor;
+        change: FunctionConstructor;
+        click: FunctionConstructor;
+        typeformat: FunctionConstructor;
+        control: FunctionConstructor;
+        separator: {
+            type: StringConstructor;
+            default: string;
+        };
+        params: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        listType: {
+            type: StringConstructor;
+        };
+        tableData: {
+            type: ObjectConstructor;
+        };
+        modelValue: {};
+        column: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        label: {
+            type: StringConstructor;
+            default: string;
+        };
+        readonly: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        size: StringConstructor;
+        tip: {
+            type: StringConstructor;
+            default: string;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        dataType: {
+            type: StringConstructor;
+        };
+        clearable: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        type: {
+            type: StringConstructor;
+            default: string;
+        };
+        dicUrl: {
+            type: StringConstructor;
+            default: string;
+        };
+        dicMethod: {
+            type: StringConstructor;
+            default: string;
+        };
+        dicFormatter: FunctionConstructor;
+        dicQuery: {
+            type: ObjectConstructor;
+            default: () => {};
+        };
+        dic: {
+            type: ArrayConstructor;
+            default: () => never[];
+        };
+        placeholder: {
+            type: StringConstructor;
+            default: string;
+        };
+        rules: {
+            type: ArrayConstructor;
+        };
+        min: {
+            type: NumberConstructor;
+        };
+        max: {
+            type: NumberConstructor;
+        };
+        multiple: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        button: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        group: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        row: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        prop: {
+            type: StringConstructor;
+            default: string;
+        };
+        border: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        popperClass: {
+            type: StringConstructor;
+        };
+        propsHttp: {
+            type: ObjectConstructor;
+            default: () => {
+                name: string;
+                url: string;
+                fileName: string;
+                res: string;
+            };
+        };
+        props: {
+            type: ObjectConstructor;
+            default: () => {
+                rowKey: string;
+                rowParentKey: string;
+                nodeKey: string;
+                label: string;
+                value: string;
+                desc: string;
+                groups: string;
+                title: string;
+                leaf: string;
+                children: string;
+                hasChildren: string;
+                labelText: string;
+                disabled: string;
+            };
+        };
+    };
+    watch: {
+        text: {
+            handler(this: any, n: any): void;
+        };
+        modelValue: {
+            handler(this: any): void;
+        };
+    };
+    computed: {
+        clearableVal(this: any): any;
+        componentName(this: any): string;
+        required(this: any): boolean;
+        isArray(this: any): boolean;
+        isString(this: any): boolean;
+        isNumber(this: any): boolean;
+        nameKey(this: any): any;
+        urlKey(this: any): any;
+        resKey(this: any): any;
+        groupsKey(this: any): any;
+        valueKey(this: any): any;
+        descKey(this: any): any;
+        leafKey(this: any): any;
+        labelKey(this: any): any;
+        childrenKey(this: any): any;
+        disabledKey(this: any): any;
+        idKey(this: any): any;
+    };
+    created(this: any): void;
+} | {
+    methods: {
+        bindEvent(this: any, name: any, params: any): void;
+        initVal(this: any): void;
+        getLabelText(this: any, item: any): any;
+        handleFocus(this: any, event: any): void;
+        handleBlur(this: any, event: any): void;
+        handleClick(this: any, event: any): void;
+        handleChange(this: any, value: any): void;
+    };
+}, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<globalThis.ExtractPropTypes<{
+    dialogWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    rows: NumberConstructor;
+    minRows: {
+        type: NumberConstructor;
+        default: number;
+    };
+    maxRows: {
+        type: NumberConstructor;
+    };
+}>> & Readonly<{}>, {
+    minRows: number;
+    dialogWidth: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/fy-input-map/index.mjs

@@ -0,0 +1,248 @@
+import { t as e } from "../chunks/B1MSrc6f.mjs";
+import { t } from "../chunks/V-Js6hNd.mjs";
+import { t as n } from "../chunks/CIihGrgY.mjs";
+import { n as r, t as i } from "../chunks/Cf_h9S62.mjs";
+import { ElInput as a } from "element-plus/es";
+import "element-plus/es/components/base/style/css";
+import "element-plus/es/components/input/style/css";
+import { createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, openBlock as f, withCtx as p } from "vue";
+import { isBlank as m } from "@web-utils/core";
+//#region src/components/avue/fy-from/input-map/FyInputMap.vue
+var h = {
+	name: "FyInputMap",
+	mixins: [r, i],
+	props: {
+		dialogWidth: {
+			type: String,
+			default: "60%"
+		},
+		rows: Number,
+		minRows: {
+			type: Number,
+			default: 1
+		},
+		maxRows: { type: Number }
+	},
+	data() {
+		return {
+			formattedAddress: "",
+			address: "",
+			poi: {},
+			marker: null,
+			map: null,
+			box: !1
+		};
+	},
+	computed: {
+		longitude() {
+			var e;
+			return (e = this.text) == null ? void 0 : e[0];
+		},
+		latitude() {
+			var e;
+			return (e = this.text) == null ? void 0 : e[1];
+		},
+		title() {
+			return this.disabled || this.readonly ? "查看" : "选择";
+		}
+	},
+	watch: {
+		poi(e) {
+			this.formattedAddress = e.formattedAddress;
+		},
+		value(e) {
+			m(e) && (this.poi = {}, this.address = "");
+		},
+		text(e) {
+			m(e) || (this.poi = {
+				longitude: e[0],
+				latitude: e[1],
+				formattedAddress: e[2]
+			}, this.address = e[2]);
+		},
+		box: {
+			handler() {
+				this.box && this.$nextTick(() => this.init(() => {
+					this.longitude && this.latitude && (this.addMarker(this.longitude, this.latitude), this.getAddress(this.longitude, this.latitude));
+				}));
+			},
+			immediate: !0
+		}
+	},
+	unmounted() {
+		this.service = null;
+	},
+	methods: {
+		clear() {
+			this.poi = {}, this.clearMarker();
+		},
+		handleSubmit() {
+			this.setVal(), this.box = !1;
+		},
+		handleClear() {
+			this.text = [], this.poi = {}, this.handleChange(this.text);
+		},
+		setVal() {
+			this.text = [
+				this.poi.longitude,
+				this.poi.latitude,
+				this.poi.formattedAddress
+			], this.handleChange(this.text);
+		},
+		handleShow() {
+			this.$refs.main.blur(), this.box = !0;
+		},
+		addMarker(e, t) {
+			this.clearMarker(), this.marker = new window.AMap.Marker({ position: [e, t] }), this.marker.setMap(this.map);
+		},
+		clearMarker() {
+			this.marker && (this.marker.setMap(null), this.marker = null);
+		},
+		getAddress(e, t) {
+			this.service = new window.AMap.service("AMap.Geocoder", () => {
+				new window.AMap.Geocoder({}).getAddress([e, t], (n, r) => {
+					if (n === "complete" && r.info === "OK") {
+						let n = r.regeocode;
+						this.poi = Object.assign(n, {
+							longitude: e,
+							latitude: t
+						});
+						let i = document.createElement("div"), a = document.createElement("img");
+						a.src = "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png", i.appendChild(a);
+						let o = document.createElement("span");
+						o.className = "avue-input-map__marker", o.innerHTML = this.poi.formattedAddress, i.appendChild(o), this.marker.setContent(i);
+					}
+				});
+			});
+		},
+		handleClose() {
+			var e;
+			(e = this.poiPicker) == null || e.clearSearchResults();
+		},
+		addClick() {
+			this.map.on("click", (e) => {
+				if (this.disabled || this.readonly) return;
+				let t = e.lnglat, n = t.P || t.Q, r = t.R;
+				this.addMarker(r, n), this.getAddress(r, n);
+			});
+		},
+		init(e) {
+			this.map = new window.AMap.Map("map__container", {
+				zoom: 13,
+				center: (() => {
+					if (this.longitude && this.latitude) return [this.longitude, this.latitude];
+				})(),
+				...this.params
+			}), this.initPoip(), this.addClick(), e();
+		},
+		initPoip() {
+			window.AMapUI.loadUI(["misc/PoiPicker"], (e) => {
+				let t = new e({
+					input: "map__input",
+					placeSearchOptions: {
+						map: this.map,
+						pageSize: 10
+					},
+					searchResultsContainer: "map__result"
+				});
+				this.poiPickerReady(t);
+			});
+		},
+		poiPickerReady(e) {
+			this.poiPicker = e, e.on("poiPicked", (t) => {
+				this.clearMarker();
+				let n = t.source, r = t.item;
+				this.poi = Object.assign(r, {
+					formattedAddress: r.name,
+					longitude: r.location.R,
+					latitude: r.location.P || r.location.Q
+				}), n !== "search" && e.searchByKeyword(r.name);
+			});
+		}
+	}
+}, g = { class: "avue-input-map" }, _ = { key: 0 }, v = {
+	key: 0,
+	class: "avue-input-map__content"
+};
+function y(e, r, i, m, h, y) {
+	let b = a, x = n, S = t;
+	return f(), c("div", g, [d(b, {
+		ref: "main",
+		modelValue: h.address,
+		"onUpdate:modelValue": r[0] || (r[0] = (e) => h.address = e),
+		size: e.size,
+		clearable: e.clearableVal,
+		rows: i.rows,
+		autosize: {
+			minRows: i.minRows,
+			maxRows: i.maxRows
+		},
+		disabled: e.disabled,
+		type: "textarea",
+		placeholder: e.placeholder,
+		onClear: y.handleClear,
+		onFocus: y.handleShow,
+		onClick: e.handleClick
+	}, null, 8, [
+		"modelValue",
+		"size",
+		"clearable",
+		"rows",
+		"autosize",
+		"disabled",
+		"placeholder",
+		"onClear",
+		"onFocus",
+		"onClick"
+	]), h.box ? (f(), c("div", _, [d(S, {
+		modelValue: h.box,
+		"onUpdate:modelValue": r[2] || (r[2] = (e) => h.box = e),
+		"show-full-screen": "",
+		width: i.dialogWidth,
+		title: e.placeholder,
+		onClose: y.handleClose
+	}, {
+		footer: p(() => [e.disabled || e.readonly ? s("v-if", !0) : (f(), o(x, {
+			key: 0,
+			type: "primary",
+			size: e.size,
+			icon: "el-icon-check",
+			onClick: y.handleSubmit
+		}, {
+			default: p(() => [...r[4] || (r[4] = [u(" 确 定 ", -1)])]),
+			_: 1
+		}, 8, ["size", "onClick"]))]),
+		default: p(() => [h.box ? (f(), c("div", v, [d(b, {
+			id: "map__input",
+			modelValue: h.formattedAddress,
+			"onUpdate:modelValue": r[1] || (r[1] = (e) => h.formattedAddress = e),
+			class: "avue-input-map__content-input",
+			size: e.size,
+			readonly: e.disabled,
+			clearable: "",
+			placeholder: "输入关键字选取地点",
+			onClear: y.clear
+		}, null, 8, [
+			"modelValue",
+			"size",
+			"readonly",
+			"onClear"
+		]), r[3] || (r[3] = l("div", { class: "avue-input-map__content-box" }, [l("div", {
+			id: "map__container",
+			class: "avue-input-map__content-container",
+			tabindex: "0"
+		}), l("div", {
+			id: "map__result",
+			class: "avue-input-map__content-result"
+		})], -1))])) : s("v-if", !0)]),
+		_: 1
+	}, 8, [
+		"modelValue",
+		"width",
+		"title",
+		"onClose"
+	])])) : s("v-if", !0)]);
+}
+var b = /* @__PURE__ */ e(h, [["render", y]]);
+//#endregion
+export { b as default };

package/fy-input-map/style.css

@@ -0,0 +1 @@
+.amap-icon img,.amap-marker-content img{width:25px;height:34px}.avue-input-map__marker{color:#fff;white-space:nowrap;background-color:#25a5f7;border-radius:3px;padding:4px 10px;font-family:"";font-size:12px;position:absolute;top:-20px;right:-118px;box-shadow:1px 1px 1px #0a0a0a33}.avue-input-map__content{flex-direction:column;height:100%;display:flex}.avue-input-map__content-input{margin-bottom:10px}.avue-input-map__content-box{flex:auto;position:relative}.avue-input-map__content-container{width:100%;height:100%;min-height:450px}.avue-input-map__content-result{width:250px;height:450px;position:absolute;top:0;right:-8px;overflow-y:auto;display:block!important}