优化后，再次提交

unpackage/dist/dev/mp-weixin/components/AreaFormPopup.js

@@ -0,0 +1,116 @@
+"use strict";
+const common_vendor = require("../common/vendor.js");
+const _sfc_main = {
+  __name: "AreaFormPopup",
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    isEdit: {
+      type: Boolean,
+      default: false
+    },
+    editData: {
+      type: Object,
+      default: () => ({})
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["update:visible", "submit", "close"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const formData = common_vendor.reactive({
+      name: "",
+      color: "#FF5733"
+    });
+    const presetColors = [
+      "#2563eb",
+      "#ef4444",
+      "#10b981",
+      "#f59e0b",
+      "#6366f1",
+      "#ec4899",
+      "#06b6d4",
+      "#84cc16",
+      "#f97316",
+      "#4f46e5",
+      "#dc2626",
+      "#f59e0b",
+      "#d97706",
+      "#8b5cf6",
+      "#db2777"
+    ];
+    common_vendor.watch(() => props.editData, (newVal) => {
+      if (newVal && Object.keys(newVal).length > 0) {
+        formData.name = newVal.name || "";
+        formData.color = newVal.color || "#FF5733";
+      }
+    }, { immediate: true, deep: true });
+    common_vendor.watch(() => props.visible, (newVal) => {
+      if (!newVal) {
+        resetForm();
+      }
+    });
+    const selectColor = (color) => {
+      formData.color = color;
+    };
+    const resetForm = () => {
+      formData.name = "";
+      formData.color = "#FF5733";
+    };
+    const handleClose = () => {
+      emit("update:visible", false);
+      emit("close");
+    };
+    const handleSubmit = () => {
+      if (!formData.name) {
+        common_vendor.index.showToast({ title: "请输入区域名称", icon: "none" });
+        return;
+      }
+      if (!formData.color) {
+        common_vendor.index.showToast({ title: "请选择区域颜色", icon: "none" });
+        return;
+      }
+      emit("submit", {
+        name: formData.name,
+        color: formData.color
+      });
+    };
+    return (_ctx, _cache) => {
+      return common_vendor.e({
+        a: __props.visible
+      }, __props.visible ? {
+        b: common_vendor.t(__props.isEdit ? "编辑区域" : "新增区域"),
+        c: common_vendor.o(handleClose),
+        d: formData.name,
+        e: common_vendor.o(($event) => formData.name = $event.detail.value),
+        f: formData.color,
+        g: common_vendor.o(($event) => formData.color = $event.detail.value),
+        h: formData.color,
+        i: common_vendor.f(presetColors, (color, index, i0) => {
+          return {
+            a: color + index,
+            b: formData.color === color ? 1 : "",
+            c: color,
+            d: common_vendor.o(($event) => selectColor(color), color + index)
+          };
+        }),
+        j: common_vendor.o(handleClose),
+        k: common_vendor.o(handleSubmit),
+        l: __props.loading,
+        m: common_vendor.o(() => {
+        }),
+        n: common_vendor.o(handleClose),
+        o: common_vendor.gei(_ctx, "")
+      } : {});
+    };
+  }
+};
+const Component = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-fbf56c15"]]);
+wx.createComponent(Component);
+//# sourceMappingURL=../../.sourcemap/mp-weixin/components/AreaFormPopup.js.map