优化后，再次提交

unpackage/dist/dev/mp-weixin/pages/area/management.js

@@ -0,0 +1,140 @@
+"use strict";
+const common_vendor = require("../../common/vendor.js");
+const request_three_one_api_area = require("../../request/three_one_api/area.js");
+if (!Math) {
+  AreaFormPopup();
+}
+const AreaFormPopup = () => "../../components/AreaFormPopup.js";
+const _sfc_main = {
+  __name: "management",
+  setup(__props) {
+    const areaList = common_vendor.ref([]);
+    const showPopup = common_vendor.ref(false);
+    const isEdit = common_vendor.ref(false);
+    const currentEditId = common_vendor.ref(null);
+    const submitting = common_vendor.ref(false);
+    const editData = common_vendor.ref({});
+    common_vendor.onMounted(() => {
+      loadAreaList();
+    });
+    const loadAreaList = async () => {
+      try {
+        const res = await request_three_one_api_area.getAreaList();
+        if (res.code === 0) {
+          areaList.value = res.data.records || [];
+        }
+      } catch (err) {
+        common_vendor.index.__f__("error", "at pages/area/management.vue:79", "获取区域列表失败:", err);
+      }
+    };
+    const openAddPopup = () => {
+      isEdit.value = false;
+      currentEditId.value = null;
+      editData.value = {};
+      showPopup.value = true;
+    };
+    const openEditPopup = async (item) => {
+      try {
+        const res = await request_three_one_api_area.getAreaDetail({ id: item.id });
+        if (res.code === 0) {
+          isEdit.value = true;
+          currentEditId.value = item.id;
+          editData.value = {
+            name: res.data.name || "",
+            color: res.data.color || "#FF5733"
+          };
+          showPopup.value = true;
+        }
+      } catch (err) {
+        common_vendor.index.__f__("error", "at pages/area/management.vue:105", "获取区域详情失败:", err);
+        common_vendor.index.showToast({ title: "获取详情失败", icon: "none" });
+      }
+    };
+    const handlePopupClose = () => {
+      isEdit.value = false;
+      currentEditId.value = null;
+      editData.value = {};
+    };
+    const handleSubmit = async (formData) => {
+      submitting.value = true;
+      try {
+        const submitData = {
+          name: formData.name,
+          color: formData.color
+        };
+        let res;
+        if (isEdit.value) {
+          submitData.id = currentEditId.value;
+          res = await request_three_one_api_area.updateArea(submitData);
+        } else {
+          res = await request_three_one_api_area.addArea(submitData);
+        }
+        if (res.code === 0) {
+          showPopup.value = false;
+          common_vendor.index.showToast({
+            title: isEdit.value ? "修改成功" : "新增成功",
+            icon: "success"
+          });
+          loadAreaList();
+        }
+      } catch (err) {
+        common_vendor.index.__f__("error", "at pages/area/management.vue:144", "提交失败:", err);
+        common_vendor.index.showToast({ title: "操作失败", icon: "none" });
+      } finally {
+        submitting.value = false;
+      }
+    };
+    const handleDelete = (item) => {
+      common_vendor.index.showModal({
+        title: "确认删除",
+        content: "确定要删除该区域吗？",
+        confirmColor: "#e54d42",
+        success: async (res) => {
+          if (res.confirm) {
+            try {
+              const result = await request_three_one_api_area.deleteArea({ id: item.id });
+              if (result.code === 0) {
+                common_vendor.index.showToast({ title: "删除成功", icon: "success" });
+                loadAreaList();
+              }
+            } catch (err) {
+              common_vendor.index.__f__("error", "at pages/area/management.vue:166", "删除失败:", err);
+              common_vendor.index.showToast({ title: "删除失败", icon: "none" });
+            }
+          }
+        }
+      });
+    };
+    return (_ctx, _cache) => {
+      return common_vendor.e({
+        a: areaList.value.length > 0
+      }, areaList.value.length > 0 ? {
+        b: common_vendor.f(areaList.value, (item, k0, i0) => {
+          return {
+            a: common_vendor.t(item.name || "区域名称"),
+            b: item.color,
+            c: common_vendor.t(item.color),
+            d: common_vendor.o(($event) => openEditPopup(item), item.id),
+            e: common_vendor.o(($event) => handleDelete(item), item.id),
+            f: item.id
+          };
+        })
+      } : {}, {
+        c: common_vendor.o(openAddPopup),
+        d: common_vendor.o(handleSubmit),
+        e: common_vendor.o(handlePopupClose),
+        f: common_vendor.o(($event) => showPopup.value = $event),
+        g: common_vendor.p({
+          isEdit: isEdit.value,
+          editData: editData.value,
+          loading: submitting.value,
+          visible: showPopup.value
+        }),
+        h: common_vendor.gei(_ctx, "")
+      });
+    };
+  }
+};
+const MiniProgramPage = /* @__PURE__ */ common_vendor._export_sfc(_sfc_main, [["__scopeId", "data-v-847f15e8"]]);
+wx.createPage(MiniProgramPage);
+//# sourceMappingURL=../../../.sourcemap/mp-weixin/pages/area/management.js.map

unpackage/dist/dev/mp-weixin/pages/area/management.json

@@ -0,0 +1,6 @@
+{
+  "navigationBarTitleText": "区域管理",
+  "usingComponents": {
+    "area-form-popup": "../../components/AreaFormPopup"
+  }
+}

unpackage/dist/dev/mp-weixin/pages/area/management.wxml

@@ -0,0 +1 @@
+<view class="{{['padding', 'page', 'data-v-847f15e8', virtualHostClass]}}" style="{{virtualHostStyle}}" hidden="{{virtualHostHidden || false}}" id="{{h}}"><view wx:if="{{a}}" class="area-list data-v-847f15e8"><view wx:for="{{b}}" wx:for-item="item" wx:key="f" class="padding bg-white radius margin-bottom data-v-847f15e8"><view class="flex justify-between data-v-847f15e8"><view class="data-v-847f15e8"><view class="text-bold text-black data-v-847f15e8">{{item.a}}</view><view class="margin-top flex align-center data-v-847f15e8"><text class="data-v-847f15e8">颜色：</text><view class="color-dot data-v-847f15e8" style="{{'background-color:' + item.b}}"></view><text class="margin-left-xs data-v-847f15e8">{{item.c}}</text></view></view><view class="data-v-847f15e8"><button class="bg-blue cu-btn data-v-847f15e8" bindtap="{{item.d}}">编辑</button><button class="bg-red cu-btn margin-left data-v-847f15e8" bindtap="{{item.e}}">删除</button></view></view></view></view><view wx:else class="empty-state data-v-847f15e8"><text class="text-gray data-v-847f15e8">暂无区域数据</text></view><button class="add-btn cuIcon-add bg-blue round data-v-847f15e8" bindtap="{{c}}">新增公司区域</button><area-form-popup wx:if="{{g}}" class="data-v-847f15e8" virtualHostClass="data-v-847f15e8" bindsubmit="{{d}}" bindclose="{{e}}" u-i="847f15e8-0" bind:__l="__l" bindupdateVisible="{{f}}" u-p="{{g}}"/></view>

unpackage/dist/dev/mp-weixin/pages/area/management.wxss

@@ -0,0 +1,55 @@
+/**
+ * 这里是uni-app内置的常用样式变量
+ *
+ * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
+ * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
+ *
+ */
+/**
+ * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
+ *
+ * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
+ */
+/* uni.scss */
+/* 颜色变量 */
+/* 行为相关颜色 */
+/* 文字基本颜色 */
+/* 背景颜色 */
+/* 边框颜色 */
+/* 尺寸变量 */
+/* 文字尺寸 */
+/* 图片尺寸 */
+/* Border Radius */
+/* 水平间距 */
+/* 垂直间距 */
+/* 透明度 */
+/* 文章场景相关 */
+.page.data-v-847f15e8 {
+  min-height: 100vh;
+  background: #EBF2FC;
+  padding-bottom: 120rpx;
+}
+.area-list.data-v-847f15e8 {
+  padding-bottom: 20rpx;
+}
+.empty-state.data-v-847f15e8 {
+  padding: 200rpx 0;
+  text-align: center;
+}
+.add-btn.data-v-847f15e8 {
+  position: fixed;
+  bottom: 40rpx;
+  left: 30rpx;
+  right: 30rpx;
+  height: 88rpx;
+  line-height: 88rpx;
+  border-radius: 44rpx;
+  font-size: 32rpx;
+}
+.color-dot.data-v-847f15e8 {
+  width: 30rpx;
+  height: 30rpx;
+  border-radius: 6rpx;
+  flex-shrink: 0;
+  margin-left: 10rpx;
+}