nxd-plugin 1.6.5 → 1.6.6

package/dist/chunks/component-RadarTime-aohD_Dpx.mjs

@@ -0,0 +1,500 @@
+import "./rolldown-runtime-Dd0fQ6-X.mjs";
+import { a as e, n as t, r as n } from "./component-AqiMonitor-DoGm_NCt.mjs";
+import { Fragment as r, computed as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, defineComponent as c, getCurrentInstance as ee, normalizeClass as l, normalizeStyle as u, onMounted as te, onUnmounted as ne, openBlock as d, ref as f, renderList as p, toDisplayString as m, vShow as h, watch as re, withDirectives as g, withModifiers as ie } from "vue";
+//#region src/components/RadarTime/RadarTime.vue?vue&type=script&setup=true&lang.ts
+var ae = {
+	class: "RadarTime",
+	"element-loading-background": "rgba(0, 0, 0, 0.4)"
+}, oe = { class: "RadarTime__head" }, se = { class: "RadarTime__head-top" }, ce = { class: "RadarTime__body" }, _ = { class: "RadarTime__toolbar" }, le = { class: "RadarTime__display" }, ue = { class: "RadarTime__panel" }, de = { class: "RadarTime__time-list" }, fe = ["onClick"], pe = {
+	key: 0,
+	class: "RadarTime__time-node"
+}, v = { class: "RadarTime__node-value" }, y = { class: "RadarTime__legend" }, me = { class: "RadarTime__legend-bar" }, he = { class: "RadarTime__legend-labels" }, ge = {
+	key: 0,
+	class: "RadarTime__station-bar"
+}, _e = { class: "RadarTime__station-name" }, ve = { class: "RadarTime__station-panel" }, ye = ["onClick"], be = {
+	key: 1,
+	class: "RadarTime__controls"
+}, xe = { class: "RadarTime__radio-group" }, Se = [
+	"value",
+	"checked",
+	"onChange"
+], Ce = { class: "RadarTime__checkbox-group" }, we = ["checked"], Te = ["checked"], Ee = { class: "RadarTime__main" }, De = { class: "RadarTime__play-wrapper" }, Oe = {
+	key: 0,
+	xmlns: "http://www.w3.org/2000/svg",
+	width: "22",
+	height: "22",
+	viewBox: "0 0 24 24",
+	fill: "#fff"
+}, ke = {
+	key: 1,
+	xmlns: "http://www.w3.org/2000/svg",
+	width: "20",
+	height: "20",
+	viewBox: "0 0 24 24",
+	fill: "#fff"
+}, Ae = { class: "RadarTime__track-bg" }, je = { class: "RadarTime__track-content" }, b = ["onClick"], x = /* @__PURE__ */ t(/* @__PURE__ */ c({
+	__name: "RadarTime",
+	props: {
+		appKey: {
+			type: String,
+			default: ""
+		},
+		appSalt: {
+			type: String,
+			default: ""
+		},
+		showCloseBtn: {
+			type: Boolean,
+			default: !0
+		},
+		baseHttp: {
+			type: String,
+			default: ""
+		},
+		ids: {
+			type: Object,
+			default: () => ({})
+		},
+		title: {
+			type: String,
+			default: "雷达时间轴"
+		},
+		legendData: {
+			type: Array,
+			default: () => [
+				{
+					value: "0",
+					color: "rgb(192, 192, 253)"
+				},
+				{
+					value: "5",
+					color: "rgb(122, 114, 238)"
+				},
+				{
+					value: "10",
+					color: "rgb(30, 38, 208)"
+				},
+				{
+					value: "15",
+					color: "rgb(166, 252, 168)"
+				},
+				{
+					value: "20",
+					color: "rgb(0, 235, 0)"
+				},
+				{
+					value: "25",
+					color: "rgb(16, 146, 26)"
+				},
+				{
+					value: "30",
+					color: "rgb(252, 244, 100)"
+				},
+				{
+					value: "35",
+					color: "rgb(200, 200, 2)"
+				},
+				{
+					value: "40",
+					color: "rgb(140, 140, 0)"
+				},
+				{
+					value: "45",
+					color: "rgb(254, 172, 172)"
+				},
+				{
+					value: "50",
+					color: "rgb(254, 100, 92)"
+				},
+				{
+					value: "55",
+					color: "rgb(238, 2, 48)"
+				},
+				{
+					value: "60",
+					color: "rgb(212, 142, 254)"
+				},
+				{
+					value: "65",
+					color: "rgb(170, 36, 250)"
+				}
+			]
+		},
+		showWeatherControls: {
+			type: Boolean,
+			default: !1
+		},
+		weatherTimeOptions: {
+			type: Array,
+			default: () => [
+				"5min",
+				"1h",
+				"24h"
+			]
+		},
+		selectedWeatherTime: {
+			type: String,
+			default: "5min"
+		},
+		weatherShowStain: {
+			type: Boolean,
+			default: !1
+		},
+		weatherShowGrid: {
+			type: Boolean,
+			default: !1
+		},
+		weatherTypeName: {
+			type: String,
+			default: ""
+		}
+	},
+	emits: [
+		"close",
+		"play",
+		"select",
+		"addImage",
+		"weatherTimeChange",
+		"weatherStainChange",
+		"weatherGridChange"
+	],
+	setup(t, { emit: c }) {
+		let x = ee()?.appContext.config.globalProperties.$bus, S = t, C = c, w = f(!1), T = f(!1), E = f([]), D = f([]), O = f([]), k = f(0), A = f([]), j = f(null), M = f(!1), N = f(null), P = f(!1), F = f(null), I = f(0), L = i(() => D.value.map((e) => ({
+			time: e.radar_time,
+			displayTime: e.radar_time?.substring(11, 16) || "",
+			selectedTime: e.radar_time?.substring(0, 16) || ""
+		}))), Me = i(() => L.value.length > 0 && I.value >= 0 && L.value[I.value]?.selectedTime || ""), R = f(!1);
+		re(() => L.value, (e) => {
+			e.length > 0 && !R.value && (R.value = !0, I.value = e.length - 1);
+		}, { immediate: !0 });
+		let Ne = () => {
+			P.value = !P.value;
+		}, z = () => {
+			P.value = !1;
+		}, B = (e) => {
+			F.value && !F.value.contains(e.target) && z(), N.value && !N.value.contains(e.target) && (M.value = !1);
+		}, Pe = () => {
+			M.value = !M.value;
+		}, Fe = async (e) => {
+			j.value?.ld_code !== e.ld_code && (j.value = e, M.value = !1, T.value = !1, D.value = [], O.value = [], E.value = [], k.value = 0, I.value = 0, R.value = !1, await X());
+		}, Ie = async (e) => {
+			I.value = e;
+			let t = L.value[e]?.time;
+			t && (w.value = !0, await Z(t), Y(e), w.value = !1), z();
+		}, V = i(() => {
+			if (!E.value || E.value.length <= 1) return 50;
+			let e = E.value.length, t = E.value.filter((e) => e.type === "live").length / e * 98;
+			return Math.max(t, 4);
+		}), Le = i(() => {
+			if (!E.value || E.value.length <= 1) return 0;
+			let e = k.value / (E.value.length - 1) * 98;
+			return Math.max(0, Math.min(98, e));
+		}), Re = (e) => {
+			if (!E.value || E.value.length <= 1) return 0;
+			let t = e / (E.value.length - 1) * 98;
+			return Math.max(0, Math.min(98, t));
+		}, H = f(null), ze = f(null), U = f(!1), Be = (e) => {
+			e.button === 0 && (U.value = !0, G(e), e.preventDefault());
+		}, Ve = (e) => {
+			U.value && G(e);
+		}, W = () => {
+			U.value &&= !1;
+		}, G = (e) => {
+			if (!H.value || !E.value || E.value.length === 0) return;
+			let t = H.value.getBoundingClientRect(), n = e.clientX - t.left;
+			n = Math.max(0, Math.min(n, t.width));
+			let r = n / t.width, i = Math.round(r * (E.value.length - 1));
+			J(Math.max(0, Math.min(E.value.length - 1, i)));
+		}, K = null, He = () => {
+			T.value = !T.value, C("play"), T.value ? Ue() : q();
+		}, Ue = () => {
+			q(), K = setInterval(() => {
+				k.value < E.value.length - 1 ? J(k.value + 1) : J(0);
+			}, 1e3);
+		}, q = () => {
+			K &&= (clearInterval(K), null);
+		}, J = (e) => {
+			k.value = e;
+			let t = E.value[e];
+			console.log(t, "选择的时间点"), t && (C("select", e), t.png_path && t.bounds && t.bounds.length === 2 && (console.log(t, "item11"), C("addImage", {
+				removeImg: "radarLayer",
+				data: { imgArr: [{
+					imgUrl: t.png_path,
+					lngStart: String(t.bounds[0][0]),
+					latStart: String(t.bounds[0][1]),
+					lngEnd: String(t.bounds[1][0]),
+					latEnd: String(t.bounds[1][1]),
+					opacity: .8,
+					zIndex: 10,
+					otherData: { imgId: "radarLayer" }
+				}] }
+			})));
+		}, Y = (e) => {
+			let t = [];
+			if (D.value && D.value.length > 0) {
+				let n = typeof e == "number" ? e : 0;
+				D.value.slice(n).forEach((e, n) => {
+					t.push({
+						time: e.radar_time?.substring(11, 16) || "",
+						fullTime: e.radar_time || "",
+						type: "live",
+						index: n,
+						png_path: e.png_path || "",
+						bounds: e.bounds || []
+					});
+				});
+			}
+			O.value && O.value.length > 0 && O.value.forEach((e, n) => {
+				t.push({
+					time: e.radar_time?.substring(11, 16) || "",
+					fullTime: e.radar_time || "",
+					type: "forecast",
+					index: n,
+					png_path: e.png_path || "",
+					bounds: e.bounds || []
+				});
+			}), E.value = t, k.value = 0, setTimeout(() => {
+				J(0);
+			}, 0);
+		}, X = async () => {
+			w.value = !0;
+			let e = {
+				appKey: S.appKey,
+				appSalt: S.appSalt,
+				id: S.ids.data.id,
+				variables: {
+					dateTime: (() => {
+						let e = /* @__PURE__ */ new Date();
+						e.setHours(e.getHours() - 8);
+						let t = (e) => String(e).padStart(2, "0");
+						return `${e.getFullYear()}-${t(e.getMonth() + 1)}-${t(e.getDate())} ${t(e.getHours())}:${t(e.getMinutes())}:${t(e.getSeconds())}`;
+					})(),
+					ld_code: j.value?.ld_code || ""
+				},
+				baseHttp: S.baseHttp,
+				reqType: S.ids.data.reqType,
+				isFormData: S.ids.data.isFormData
+			};
+			try {
+				let t = await n(e);
+				console.log(t, "雷达实况数据");
+				let r = t.data?.result?.output || [];
+				r && r.length > 0 && (D.value = r.map((e) => {
+					let t = "";
+					try {
+						t = JSON.parse(e.response_body)?.data?.png_path || "", t || console.log("实况项 png_path 为空, response_body:", e.response_body?.substring(0, 200));
+					} catch (e) {
+						console.log("实况项 response_body 解析失败:", e), t = "";
+					}
+					let n = new Date(e.date_time.replace(/-/g, "/"));
+					n.setHours(n.getHours() + 8);
+					let r = (e) => String(e).padStart(2, "0"), i = `${n.getFullYear()}-${r(n.getMonth() + 1)}-${r(n.getDate())} ${r(n.getHours())}:${r(n.getMinutes())}:${r(n.getSeconds())}`;
+					return {
+						...e,
+						png_path: "/image-proxy" + t,
+						radar_time: i,
+						bounds: [[e.right_val, e.bottom_val], [e.left_val, e.top_val]]
+					};
+				}), await Z(), Y(I.value));
+			} catch (e) {
+				console.error("获取雷达实况数据失败:", e);
+			} finally {
+				w.value = !1;
+			}
+		}, Z = async (e) => {
+			let t = {
+				appKey: S.appKey,
+				appSalt: S.appSalt,
+				id: S.ids.data.forecastId || S.ids.data.id,
+				variables: { dateTime: e || D.value[D.value.length - 1]?.date_time || "" },
+				baseHttp: S.baseHttp,
+				reqType: S.ids.data.reqType,
+				isFormData: S.ids.data.isFormData
+			};
+			try {
+				let e = await n(t);
+				console.log(e, "雷达外推数据");
+				let r = e.data?.result?.output || [];
+				if (r && r.length > 0) {
+					let e = r[0] || {}, t = {};
+					try {
+						t = JSON.parse(e.response_body) || {}, console.log(t, "雷达外推 response_body 数据");
+					} catch (e) {
+						console.error("解析 response_body 失败:", e);
+					}
+					if (t && t.data && t.data.metadata_path) {
+						let e = "/image-proxy" + t.data.metadata_path;
+						console.log(e, "雷达外推 json 文件路径");
+						try {
+							let t = await (await fetch(e)).json();
+							console.log(t, "雷达外推 json 文件数据"), Q(t);
+						} catch (e) {
+							console.error("读取 json 文件失败:", e), t.data && Q(t.data);
+						}
+					} else t && t.data && Q(t.data);
+				}
+			} catch (e) {
+				console.error("获取雷达外推数据失败:", e);
+			}
+		}, Q = (e) => {
+			if (!e) return;
+			let t = e.frames || [], n = e.extent || {}, r = e.base_time || "";
+			!r && D.value.length > 0 && (r = D.value[D.value.length - 1]?.radar_time || ""), Array.isArray(t) && (O.value = t.map((e) => {
+				let t = e.minute || 0, i = Ge(r, t), a = [[80.29, 41.17], [81.29, 42.17]];
+				return n && n.lon_min !== void 0 && (a = [[n.lon_min, n.lat_min], [n.lon_max, n.lat_max]]), {
+					...e,
+					base_time: r,
+					radar_time: i,
+					png_path: "/image-proxy" + (e.png || ""),
+					bounds: a
+				};
+			}), console.log(O.value, "forecastList 外推数据"));
+		}, We = async () => {
+			try {
+				let e = (await n({
+					appKey: S.appKey,
+					appSalt: S.appSalt,
+					id: S.ids.data.radarListId,
+					variables: {},
+					baseHttp: S.ids.baseHttp2,
+					reqType: S.ids.data.reqType,
+					isFormData: S.ids.data.isFormData
+				})).data?.result?.output || [];
+				e && e.length > 0 && (A.value = e, j.value = e[0], console.log(e, "雷达列表数据"));
+			} catch (e) {
+				console.error("获取雷达列表失败:", e);
+			}
+		}, Ge = (e, t) => {
+			if (!e) return "";
+			try {
+				let n, r = e.replace(/[-:T\s]/g, "");
+				if (n = /^\d{14}$/.test(r) ? new Date(Number(r.substring(0, 4)), Number(r.substring(4, 6)) - 1, Number(r.substring(6, 8)), Number(r.substring(8, 10)), Number(r.substring(10, 12)), Number(r.substring(12, 14))) : new Date(e), isNaN(n.getTime())) return "";
+				n.setMinutes(n.getMinutes() + t);
+				let i = (e) => String(e).padStart(2, "0");
+				return `${n.getFullYear()}-${i(n.getMonth() + 1)}-${i(n.getDate())} ${i(n.getHours())}:${i(n.getMinutes())}:${i(n.getSeconds())}`;
+			} catch {
+				return "";
+			}
+		};
+		te(() => {
+			x?.on("toComponent", (e) => {
+				e.componentName === "RadarTime" && $();
+			}), document.addEventListener("click", B), We(), $();
+		}), ne(() => {
+			document.removeEventListener("click", B), q();
+		});
+		let $ = async () => {
+			await X();
+		}, Ke = () => {
+			q(), C("close", "RadarTime");
+		};
+		return (n, i) => {
+			let c = e;
+			return g((d(), o("div", ae, [s("div", oe, [s("div", se, [t.showCloseBtn ? (d(), o("div", {
+				key: 0,
+				class: "closeBtn",
+				onClick: Ke,
+				title: "关闭"
+			})) : a("", !0)]), i[2] ||= s("img", {
+				class: "RadarTime__head-line",
+				src: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAbsAAAASBAMAAAAwI22/AAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAwUExURQAAAAem/wem/wem/wem/wem/wem/wem/wem/wem/wem/wem/wem/wem/wem/wem/5bu5GYAAAAPdFJOUwAFwAwc2M8ULQYDn/hGXGnV2UoAAAGZSURBVEjH7ZM/S8NAGId/JYGmmeLspptThurk0CHWRXGo0Nk/S50y6CYSHMRF7Efo4uQXEIpbwUnM6OhnEIeChXjv5ZLLXdLtLCX68vDCe0eGJ7/3AJN1VcL+UImB/SruVJwYTqSAW5V3LLyaPR1c+IIdH12OPZiLcyTAjccZEdccZ0Nn4bXpC3KpCuFu5tkdziX3FJxBSBZZdFk9HempCduMk4xSitJTpOgJSSIPrx10YAUB0tYOwrQ1g12k7ZyODIYXZmQpppLV26rtbDFOXVhua2Fn7WTWwUEyAe5Zc2hiLWTTC3jjk8Hw+jrSM9/Z8raKOAtZVmyr9jbpee4lU9hvSUStw6YvOpqwiXlK9d8IL0Oq5tuqvc3KLMs7q9uyCC0y22aKvDVp4u2SjnJ1c+Wecg7h9gV4CFV8NHpEaw7yF2wVGcIa6OBx/Ax3PI6pRWx6Am98alBbpSODNVTxgAbQUpF3KeVv0s80xMUow8N//YVaqWEV9BJDdby2PBUZ1/te0uU0YzeLa623jjrrvaLOep/+str9ACyAtv25BhHcAAAAAElFTkSuQmCC",
+				alt: ""
+			}, null, -1)]), s("div", ce, [
+				s("div", _, [
+					s("div", {
+						class: "RadarTime__dropdown",
+						ref_key: "dropdownRef",
+						ref: F
+					}, [s("div", {
+						class: "RadarTime__trigger",
+						onClick: Ne
+					}, [s("span", le, m(Me.value || "选择时间"), 1), s("span", { class: l(["RadarTime__arrow", { "is-open": P.value }]) }, "▼", 2)]), g(s("div", ue, [s("div", de, [(d(!0), o(r, null, p(L.value, (e, t) => (d(), o("div", {
+						key: t,
+						class: l(["RadarTime__time-item", { "is-selected": I.value === t }]),
+						onClick: (e) => Ie(t)
+					}, m(e.time), 11, fe))), 128))])], 512), [[h, P.value]])], 512),
+					E.value.length > 0 && k.value >= 0 ? (d(), o("div", pe, [i[3] ||= s("span", { class: "RadarTime__node-label" }, "当前：", -1), s("span", v, m(E.value[k.value]?.time || "--:--"), 1)])) : a("", !0),
+					s("div", y, [i[4] ||= s("span", { class: "RadarTime__legend-title" }, "图例", -1), s("div", me, [(d(!0), o(r, null, p(t.legendData, (e, t) => (d(), o("div", {
+						key: t,
+						class: "RadarTime__legend-segment",
+						style: u({ backgroundColor: e.color })
+					}, null, 4))), 128)), s("div", he, [(d(!0), o(r, null, p(t.legendData, (e, t) => (d(), o("span", { key: t }, m(e.value), 1))), 128))])])])
+				]),
+				A.value.length > 0 ? (d(), o("div", ge, [s("div", {
+					class: "RadarTime__station-dropdown",
+					ref_key: "stationDropdownRef",
+					ref: N
+				}, [
+					i[5] ||= s("label", { style: {
+						color: "#fff",
+						"font-size": "12px"
+					} }, "雷达：", -1),
+					s("div", {
+						class: "RadarTime__station-trigger",
+						onClick: Pe
+					}, [s("span", _e, m(j.value?.ld_name || "选择雷达站"), 1), s("span", { class: l(["RadarTime__arrow", { "is-open": M.value }]) }, "▼", 2)]),
+					g(s("div", ve, [(d(!0), o(r, null, p(A.value, (e, t) => (d(), o("div", {
+						key: t,
+						class: l(["RadarTime__station-item", { "is-selected": j.value?.ld_code === e.ld_code }]),
+						onClick: (t) => Fe(e)
+					}, m(e.ld_name), 11, ye))), 128))], 512), [[h, M.value]])
+				], 512)])) : a("", !0),
+				t.showWeatherControls ? (d(), o("div", be, [s("div", xe, [(d(!0), o(r, null, p(t.weatherTimeOptions, (e) => (d(), o("label", {
+					key: e,
+					class: l(["RadarTime__radio", { active: t.selectedWeatherTime === e }])
+				}, [s("input", {
+					type: "radio",
+					value: e,
+					name: "weather-time-range",
+					checked: t.selectedWeatherTime === e,
+					onChange: (t) => n.$emit("weatherTimeChange", e)
+				}, null, 40, Se), s("span", null, m(e), 1)], 2))), 128))]), s("div", Ce, [s("label", { class: l(["RadarTime__checkbox", { active: t.weatherShowStain }]) }, [s("input", {
+					type: "checkbox",
+					checked: t.weatherShowStain,
+					onChange: i[0] ||= (e) => n.$emit("weatherStainChange", e.target.checked)
+				}, null, 40, we), s("span", null, m(t.weatherTypeName) + "色斑图", 1)], 2), s("label", { class: l(["RadarTime__checkbox", { active: t.weatherShowGrid }]) }, [s("input", {
+					type: "checkbox",
+					checked: t.weatherShowGrid,
+					onChange: i[1] ||= (e) => n.$emit("weatherGridChange", e.target.checked)
+				}, null, 40, Te), s("span", null, m(t.weatherTypeName) + "网格", 1)], 2)])])) : a("", !0),
+				s("div", Ee, [s("div", De, [s("button", {
+					class: l(["RadarTime__play-btn", { playing: T.value }]),
+					onClick: He
+				}, [T.value ? (d(), o("svg", ke, [...i[7] ||= [s("path", { d: "M6 4h4v16H6V4zm8 0h4v16h-4V4z" }, null, -1)]])) : (d(), o("svg", Oe, [...i[6] ||= [s("path", { d: "M8 5v14l11-7z" }, null, -1)]]))], 2)]), s("div", {
+					class: "RadarTime__track-wrapper",
+					ref_key: "trackWrapper",
+					ref: H,
+					onMousedown: Be,
+					onMousemove: Ve,
+					onMouseup: W,
+					onMouseleave: W
+				}, [
+					s("div", Ae, [s("div", {
+						class: "RadarTime__track-section RadarTime__track-live",
+						style: u({ width: V.value + "%" })
+					}, [...i[8] ||= [s("span", { class: "RadarTime__section-label" }, "实况", -1)]], 4), s("div", {
+						class: "RadarTime__track-section RadarTime__track-forecast",
+						style: u({ width: 100 - V.value + "%" })
+					}, [...i[9] ||= [s("span", {
+						class: "RadarTime__section-label",
+						style: { color: "#fff" }
+					}, "外推", -1)]], 4)]),
+					s("div", je, [(d(!0), o(r, null, p(E.value, (e, t) => (d(), o("div", {
+						key: t,
+						class: l(["RadarTime__tick", { active: k.value === t }]),
+						style: u({ left: Re(t) + "%" }),
+						onClick: ie((e) => J(t), ["stop"])
+					}, [...i[10] ||= [s("div", { class: "RadarTime__tick-dot" }, null, -1)]], 14, b))), 128))]),
+					s("div", {
+						class: "RadarTime__indicator",
+						style: u({ left: Le.value + "%" }),
+						ref_key: "positionIndicator",
+						ref: ze
+					}, null, 4)
+				], 544)])
+			])])), [[c, w.value]]);
+		};
+	}
+}), [["__scopeId", "data-v-d8a01621"]]);
+//#endregion
+export { x as t };