var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/plus/saasDevice/appDevicePlanning/index.tsx
var appDevicePlanning_exports = {};
__export(appDevicePlanning_exports, {
  default: () => appDevicePlanning_default
});
module.exports = __toCommonJS(appDevicePlanning_exports);
var import_react = __toESM(require("react"));
var import_materials = require("@pisell/materials");
var import_icons = require("@ant-design/icons");
var import_antd = require("antd");
var import_ahooks = require("ahooks");
var import_classnames = __toESM(require("classnames"));
var import_utils = require("@pisell/utils");
var import_useEngineContext = __toESM(require("../../../hooks/useEngineContext"));
var import_useLocale = __toESM(require("../../../hooks/useLocale"));
var import_responsive = require("../../../responsive");
var import_compensatedPisellContainer = __toESM(require("../../../pro/compensatedPisellContainer"));
var import_utils2 = require("../../../utils");
var import_serve = require("./serve");
var import_hooks = require("./hooks");
var import_locales = __toESM(require("./locales"));
var import_constants = require("./constants");
var import_WorkAreaList = __toESM(require("./components/WorkAreaList"));
var import_DeviceTable = __toESM(require("./components/DeviceTable"));
var import_AddDeviceModal = __toESM(require("./components/AddDeviceModal"));
var import_EditDeviceModal = __toESM(require("./components/EditDeviceModal"));
var import_DeleteDeviceModal = __toESM(require("./components/DeleteDeviceModal"));
var import_WorkAreaModal = __toESM(require("./components/WorkAreaModal"));
var import_DeleteWorkAreaModal = __toESM(require("./components/DeleteWorkAreaModal"));
var import_index = require("./index.less");
var EMPTY_DEVICES = [];
var TYPE_CODE_STORAGE_KEY = "pisell_iot_type_code";
var MODEL_CODE_STORAGE_KEY = "pisell_iot_model_code";
var APP_TYPE_STORAGE_KEY = "pisell_app_type";
var getStoredIotDevice = (app) => {
  var _a, _b;
  try {
    const iotDevice = JSON.parse(((_a = app == null ? void 0 : app.storage) == null ? void 0 : _a.getStorage("iotDevice")) || "{}");
    const iotDeviceLastUsed = JSON.parse(
      ((_b = app == null ? void 0 : app.storage) == null ? void 0 : _b.getStorage("iotDeviceLastUsed")) || "{}"
    );
    return {
      id: (iotDeviceLastUsed == null ? void 0 : iotDeviceLastUsed.id) !== void 0 && (iotDeviceLastUsed == null ? void 0 : iotDeviceLastUsed.id) !== null ? iotDeviceLastUsed.id : void 0,
      number: (iotDevice == null ? void 0 : iotDevice.number) ? String(iotDevice.number) : ""
    };
  } catch (e) {
    return { number: "" };
  }
};
var SaasAppDevicePlanning = ({
  className,
  style,
  kind = "smart",
  showBack = false,
  onLinked,
  onBack,
  variant
}) => {
  var _a, _b, _c, _d, _e;
  const [typeCode, setTypeCode] = (0, import_react.useState)(
    () => localStorage.getItem(TYPE_CODE_STORAGE_KEY) || ""
  );
  const [modelCode, setModelCode] = (0, import_react.useState)(
    () => localStorage.getItem(MODEL_CODE_STORAGE_KEY) || ""
  );
  const context = (0, import_useEngineContext.default)();
  const locale = (0, import_useLocale.default)();
  const currentVariant = variant || "desktop";
  const isPhoneVariant = currentVariant === "phone";
  import_utils.locales.init(import_locales.default, locale || "en");
  const getText = import_utils.locales.getText;
  const translation = (0, import_hooks.useTranslation)();
  const utils = ((_a = context == null ? void 0 : context.appHelper) == null ? void 0 : _a.utils) || {};
  const iotEndpoint = ((_c = (_b = context == null ? void 0 : context.appHelper) == null ? void 0 : _b.constants) == null ? void 0 : _c.iotEndpoint) || "";
  const isModelSelecting = !typeCode || !modelCode;
  const isUniversalApp = localStorage.getItem(APP_TYPE_STORAGE_KEY) === "universal";
  const [workAreas, setWorkAreas] = (0, import_react.useState)([]);
  const [selectedWorkAreaId, setSelectedWorkAreaId] = (0, import_react.useState)();
  const [search, setSearch] = (0, import_react.useState)("");
  const [page, setPage] = (0, import_react.useState)(1);
  const [pageSize, setPageSize] = (0, import_react.useState)(import_constants.DEFAULT_PAGE_SIZE);
  const [addDeviceOpen, setAddDeviceOpen] = (0, import_react.useState)(false);
  const [takeoverDevice, setTakeoverDevice] = (0, import_react.useState)();
  const [selectedDevice, setSelectedDevice] = (0, import_react.useState)();
  const [editDeviceOpen, setEditDeviceOpen] = (0, import_react.useState)(false);
  const [deleteDeviceOpen, setDeleteDeviceOpen] = (0, import_react.useState)(false);
  const [workAreaModalOpen, setWorkAreaModalOpen] = (0, import_react.useState)(false);
  const [workAreaDrawerOpen, setWorkAreaDrawerOpen] = (0, import_react.useState)(false);
  const [workAreaModalMode, setWorkAreaModalMode] = (0, import_react.useState)("create");
  const [editingWorkArea, setEditingWorkArea] = (0, import_react.useState)();
  const [deleteModalOpen, setDeleteModalOpen] = (0, import_react.useState)(false);
  const [deleteRecord, setDeleteRecord] = (0, import_react.useState)();
  const [deleteCounts, setDeleteCounts] = (0, import_react.useState)({
    smart: 0,
    dumb: 0,
    integrated: 0
  });
  const [linkingDeviceId, setLinkingDeviceId] = (0, import_react.useState)();
  const [storedIotDevice, setStoredIotDevice] = (0, import_react.useState)(
    () => {
      var _a2;
      return getStoredIotDevice((_a2 = utils == null ? void 0 : utils.getApp) == null ? void 0 : _a2.call(utils));
    }
  );
  (0, import_react.useEffect)(() => {
    if (utils == null ? void 0 : utils.request) {
      import_utils2.request.setRequest(utils.request);
    }
  }, [utils == null ? void 0 : utils.request]);
  const workAreaRequest = (0, import_ahooks.useRequest)(import_serve.getWorkAreas, {
    onSuccess: (list) => {
      setWorkAreas((0, import_constants.sortWorkAreaList)(list));
    }
  });
  const deviceTypeRequest = (0, import_ahooks.useRequest)(
    () => (0, import_serve.getDeviceTypes)({
      kind,
      with: ["activeModels", "activeModels.activeProfiles"]
    }),
    { manual: true }
  );
  const modelRequest = (0, import_ahooks.useRequest)(import_serve.getDeviceModel, { manual: true });
  const saveRequest = (0, import_ahooks.useRequest)(
    (payload) => workAreaModalMode === "create" ? (0, import_serve.createWorkArea)(payload) : (0, import_serve.updateWorkArea)((editingWorkArea == null ? void 0 : editingWorkArea.id) || "", payload),
    { manual: true }
  );
  const deviceRequest = (0, import_ahooks.useRequest)(import_serve.getDevices, { manual: true });
  const createDeviceRequest = (0, import_ahooks.useRequest)(import_serve.createDevice, { manual: true });
  const updateDeviceRequest = (0, import_ahooks.useRequest)(
    (params) => (0, import_serve.updateDevice)(params.id, params.payload),
    { manual: true }
  );
  const removeDeviceRequest = (0, import_ahooks.useRequest)(import_serve.deleteDevice, { manual: true });
  const getWorkAreaDetailRequest = (0, import_ahooks.useRequest)(import_serve.getWorkAreaDetail, {
    manual: true
  });
  const deleteRequest = (0, import_ahooks.useRequest)(import_serve.deleteWorkArea, { manual: true });
  (0, import_react.useEffect)(() => {
    if (!isModelSelecting) return;
    deviceTypeRequest.run();
  }, [isModelSelecting, kind]);
  (0, import_react.useEffect)(() => {
    if (!modelCode) return;
    modelRequest.run(modelCode);
  }, [modelCode]);
  (0, import_react.useEffect)(() => {
    if (!selectedWorkAreaId) return;
    const exists = workAreas.some((item) => item.id === selectedWorkAreaId);
    if (!exists) {
      setSelectedWorkAreaId(void 0);
    }
  }, [selectedWorkAreaId, workAreas]);
  (0, import_react.useEffect)(() => {
    if (!modelCode) return;
    deviceRequest.run({
      workarea_id: selectedWorkAreaId,
      type_kind: kind,
      type_code: typeCode,
      model_code: modelCode,
      with: ["type", "model", "profile", "workarea"]
    });
  }, [kind, modelCode, selectedWorkAreaId, typeCode]);
  const selectedWorkArea = (0, import_react.useMemo)(
    () => workAreas.find((item) => item.id === selectedWorkAreaId),
    [selectedWorkAreaId, workAreas]
  );
  const selectedWorkAreaName = selectedWorkArea ? translation(selectedWorkArea.name) || getText("pisell2.saas.device-planning.all-work-areas") : getText("pisell2.saas.device-planning.all-work-areas");
  const devices = (deviceRequest.data || EMPTY_DEVICES).filter(
    (device) => device.model_code === modelCode
  );
  const modelDetail = ((_d = modelRequest.data) == null ? void 0 : _d.code) === modelCode ? modelRequest.data : void 0;
  const modelName = translation(modelDetail == null ? void 0 : modelDetail.name) || modelCode || "-";
  const modelDescription = translation(modelDetail == null ? void 0 : modelDetail.description);
  const deviceTypeName = translation((_e = modelDetail == null ? void 0 : modelDetail.type) == null ? void 0 : _e.name) || (modelDetail == null ? void 0 : modelDetail.type_code) || typeCode || "-";
  const profileNameMap = (0, import_react.useMemo)(() => {
    const map = /* @__PURE__ */ new Map();
    ((modelDetail == null ? void 0 : modelDetail.active_profiles) || []).forEach((profile) => {
      map.set(profile.id, translation(profile.name) || String(profile.id));
    });
    devices.forEach((device) => {
      var _a2;
      if ((_a2 = device.profile) == null ? void 0 : _a2.id) {
        map.set(
          device.profile.id,
          translation(device.profile.name) || String(device.profile.id)
        );
      }
    });
    return map;
  }, [devices, modelDetail, translation]);
  const tableData = (0, import_react.useMemo)(() => {
    const keyword = (0, import_constants.normalizeText)(search);
    const hasCurrentDevice = devices.some(
      (item) => storedIotDevice.number && item.number && storedIotDevice.number === String(item.number)
    );
    return devices.map((item) => {
      var _a2, _b2, _c2;
      const name = translation(item.name);
      const typeName = translation((_a2 = item.type) == null ? void 0 : _a2.name) || deviceTypeName;
      const modelDisplayName = translation((_b2 = item.model) == null ? void 0 : _b2.name) || modelName;
      const linkStatus = item.link || "unlinked";
      const isCurrent = Boolean(
        storedIotDevice.number && item.number && storedIotDevice.number === String(item.number)
      );
      const profileName = translation((_c2 = item.profile) == null ? void 0 : _c2.name) || (item.profile_id ? profileNameMap.get(item.profile_id) : "") || (item.profile_id ? String(item.profile_id) : "-");
      return {
        id: item.id,
        name,
        typeName,
        modelName: modelDisplayName,
        profileName,
        link: linkStatus,
        status: linkStatus === "linked" ? item.status || "offline" : "unknown",
        typeCode: item.type_code,
        modelCode: item.model_code,
        isCurrent,
        isLastUsed: Boolean(
          !hasCurrentDevice && storedIotDevice.id !== void 0 && String(storedIotDevice.id) === String(item.id)
        ),
        _raw: item
      };
    }).filter(
      (item) => keyword ? [
        item.name,
        item.typeName,
        item.modelName,
        item.profileName,
        item._raw.workarea ? translation(item._raw.workarea.name) : ""
      ].some((value) => (0, import_constants.normalizeText)(value || "").includes(keyword)) : true
    );
  }, [
    deviceTypeName,
    devices,
    modelName,
    profileNameMap,
    search,
    storedIotDevice,
    translation
  ]);
  const deviceTypeGroups = (0, import_react.useMemo)(
    () => (deviceTypeRequest.data || []).map((type) => ({
      type,
      models: [...type.active_models || []].filter(
        (model) => {
          var _a2;
          return iotEndpoint ? ((_a2 = model.data) == null ? void 0 : _a2.endpoint) === iotEndpoint : true;
        }
      ).sort((a, b) => (a.sort || 0) - (b.sort || 0))
    })).filter((group) => group.models.length > 0),
    [deviceTypeRequest.data, iotEndpoint]
  );
  const showInitialLoading = !isModelSelecting && (workAreaRequest.loading && workAreas.length === 0 || modelRequest.loading && !modelDetail);
  const handleBack = () => {
    var _a2, _b2, _c2, _d2, _e2;
    if (onBack) {
      onBack();
      return;
    }
    const getApp = (_b2 = (_a2 = context == null ? void 0 : context.appHelper) == null ? void 0 : _a2.utils) == null ? void 0 : _b2.getApp;
    const history = (_d2 = (_c2 = getApp == null ? void 0 : getApp()) == null ? void 0 : _c2.history) == null ? void 0 : _d2.instance;
    (_e2 = history == null ? void 0 : history.goBack) == null ? void 0 : _e2.call(history);
  };
  const reloadWorkAreas = async (selectedId) => {
    const list = await workAreaRequest.runAsync();
    const sorted = (0, import_constants.sortWorkAreaList)(list);
    setWorkAreas(sorted);
    if (selectedId) {
      setSelectedWorkAreaId(selectedId);
    }
    return sorted;
  };
  const resetDeviceView = () => {
    setSearch("");
    setPage(1);
  };
  const handleSelectWorkArea = (id) => {
    setSelectedWorkAreaId(id);
    resetDeviceView();
    setWorkAreaDrawerOpen(false);
  };
  const persistDeviceModel = (nextTypeCode, nextModelCode) => {
    if (!nextTypeCode || !nextModelCode) return;
    localStorage.setItem(TYPE_CODE_STORAGE_KEY, nextTypeCode);
    localStorage.setItem(MODEL_CODE_STORAGE_KEY, nextModelCode);
  };
  const handleSelectDeviceModel = (type, model) => {
    const nextTypeCode = model.type_code || type.code;
    const nextModelCode = model.code;
    if (!nextTypeCode || !nextModelCode) return;
    if (!showBack) {
      persistDeviceModel(nextTypeCode, nextModelCode);
    }
    setTypeCode(nextTypeCode);
    setModelCode(nextModelCode);
    resetDeviceView();
  };
  const handleSwitchDeviceModel = () => {
    setTypeCode("");
    setModelCode("");
    setSearch("");
    setPage(1);
    setAddDeviceOpen(false);
    setEditDeviceOpen(false);
    setDeleteDeviceOpen(false);
    setSelectedDevice(void 0);
    setTakeoverDevice(void 0);
  };
  const reloadDevices = () => {
    if (!modelCode) return;
    deviceRequest.run({
      workarea_id: selectedWorkAreaId,
      type_kind: kind,
      type_code: typeCode,
      model_code: modelCode,
      with: ["type", "model", "profile", "workarea"]
    });
  };
  const openCreateModal = () => {
    setWorkAreaModalMode("create");
    setEditingWorkArea(void 0);
    setWorkAreaModalOpen(true);
  };
  const openEditModal = (record) => {
    setWorkAreaModalMode("edit");
    setEditingWorkArea(record);
    setWorkAreaModalOpen(true);
  };
  const handleSaveWorkArea = async (payload) => {
    try {
      const saved = await saveRequest.runAsync(payload);
      (0, import_materials.PisellToast)({
        content: getText(
          workAreaModalMode === "create" ? "pisell2.saas.device-planning.message.create-success" : "pisell2.saas.device-planning.message.update-success"
        ),
        duration: 2
      });
      setWorkAreaModalOpen(false);
      setEditingWorkArea(void 0);
      await reloadWorkAreas((saved == null ? void 0 : saved.id) || (editingWorkArea == null ? void 0 : editingWorkArea.id));
    } catch (e) {
    }
  };
  const openDeleteModal = (record) => {
    setDeleteRecord(record);
    setDeleteCounts({ smart: 0, dumb: 0, integrated: 0 });
    setDeleteModalOpen(true);
    getWorkAreaDetailRequest.runAsync({
      id: record.id,
      relation_count: ["smartDevices", "dumbDevices", "integratedDevices"]
    }).then((res) => {
      var _a2;
      const _workArea = (_a2 = res == null ? void 0 : res.data) == null ? void 0 : _a2[0];
      setDeleteCounts({
        smart: (_workArea == null ? void 0 : _workArea.smart_devices_count) || 0,
        dumb: (_workArea == null ? void 0 : _workArea.dumb_devices_count) || 0,
        integrated: (_workArea == null ? void 0 : _workArea.integrated_devices_count) || 0
      });
    }).catch(() => setDeleteCounts({ smart: 0, dumb: 0, integrated: 0 }));
  };
  const handleConfirmDelete = async () => {
    if (!deleteRecord) return;
    try {
      await deleteRequest.runAsync(deleteRecord.id);
      (0, import_materials.PisellToast)({
        content: getText("pisell2.saas.device-planning.message.delete-success"),
        duration: 2
      });
      setDeleteModalOpen(false);
      setDeleteRecord(void 0);
      await reloadWorkAreas();
      reloadDevices();
    } catch (e) {
    }
  };
  const handleCreateDevice = async (payload) => {
    try {
      await createDeviceRequest.runAsync(payload);
      (0, import_materials.PisellToast)({
        content: getText("pisell2.saas.device-planning.add.create-success"),
        duration: 2
      });
      setAddDeviceOpen(false);
      setPage(1);
      reloadDevices();
    } catch (e) {
    }
  };
  const handleUpdateDevice = async (id, payload) => {
    try {
      await updateDeviceRequest.runAsync({ id, payload });
      (0, import_materials.PisellToast)({
        content: getText("pisell2.saas.device-planning.edit.success"),
        duration: 2
      });
      setEditDeviceOpen(false);
      setSelectedDevice(void 0);
      reloadDevices();
    } catch (e) {
    }
  };
  const handleDeleteDevice = async () => {
    if (!selectedDevice) return;
    try {
      await removeDeviceRequest.runAsync(selectedDevice.id);
      (0, import_materials.PisellToast)({
        content: getText("pisell2.saas.device-planning.delete-device.success"),
        duration: 2
      });
      setDeleteDeviceOpen(false);
      setSelectedDevice(void 0);
      reloadDevices();
    } catch (e) {
    }
  };
  const handleLinkDevice = async (record) => {
    var _a2, _b2, _c2, _d2, _e2, _f, _g, _h;
    const app = (_a2 = utils == null ? void 0 : utils.getApp) == null ? void 0 : _a2.call(utils);
    setLinkingDeviceId(record.id);
    try {
      const language = ((_b2 = app == null ? void 0 : app.locales) == null ? void 0 : _b2.getLocale()) || "en";
      const deviceDetail = await ((_e2 = (_d2 = (_c2 = app == null ? void 0 : app.plugins) == null ? void 0 : _c2.get("device")) == null ? void 0 : _d2.getDeviceDetail) == null ? void 0 : _e2.call(_d2, { language }));
      const linkedDevice = await (0, import_serve.linkDevice)(
        record.id,
        (deviceDetail == null ? void 0 : deviceDetail.data) || {}
      );
      (_f = app == null ? void 0 : app.storage) == null ? void 0 : _f.setStorage("iotDevice", JSON.stringify(linkedDevice || {}));
      (_g = app == null ? void 0 : app.storage) == null ? void 0 : _g.setStorage(
        "iotDeviceLastUsed",
        JSON.stringify(linkedDevice || {})
      );
      setStoredIotDevice({
        id: typeof (linkedDevice == null ? void 0 : linkedDevice.id) === "number" ? linkedDevice.id : void 0,
        number: (linkedDevice == null ? void 0 : linkedDevice.number) ? String(linkedDevice.number) : ""
      });
      persistDeviceModel(record.typeCode, record.modelCode);
      const setting = await (0, import_serve.getDeviceSetting)(record.id, ["general.channel"]);
      const channel = (setting == null ? void 0 : setting["general.channel"]) ? String(setting["general.channel"]) : "system";
      (_h = localStorage == null ? void 0 : localStorage.setItem) == null ? void 0 : _h.call(localStorage, "pisell_app_channel", channel);
      setTakeoverDevice(void 0);
      reloadDevices();
      await (onLinked == null ? void 0 : onLinked({ device: linkedDevice, channel }));
    } catch (e) {
    } finally {
      setLinkingDeviceId(void 0);
    }
  };
  const renderModelSelection = () => /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__model-step" }, deviceTypeRequest.loading && !deviceTypeGroups.length ? /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__empty-workarea" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Spin, null)) : deviceTypeGroups.length ? /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__model-group-list" }, deviceTypeGroups.map(({ type, models }) => /* @__PURE__ */ import_react.default.createElement(
    "section",
    {
      key: type.code,
      className: "saas-app-device-planning__model-group"
    },
    /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__model-group-title" }, type.icon ? /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: type.icon }) : null, /* @__PURE__ */ import_react.default.createElement("span", null, translation(type.name) || type.code)),
    /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__model-grid" }, models.map((model) => {
      const name = translation(model.name) || model.code;
      const description = translation(model.description);
      return /* @__PURE__ */ import_react.default.createElement(
        "div",
        {
          key: `${type.code}-${model.code}`,
          className: "saas-app-device-planning__model-card",
          onClick: () => handleSelectDeviceModel(type, model),
          style: { cursor: "pointer", padding: "16px" }
        },
        /* @__PURE__ */ import_react.default.createElement("span", { className: "saas-app-device-planning__model-card-title" }, name),
        description ? /* @__PURE__ */ import_react.default.createElement("span", { className: "saas-app-device-planning__model-card-desc" }, description) : null
      );
    }))
  ))) : /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__empty-workarea" }, /* @__PURE__ */ import_react.default.createElement(
    import_materials.Empty,
    {
      image: import_materials.Empty.PRESENTED_IMAGE_SIMPLE,
      description: getText("pisell2.saas.device-planning.empty.models")
    }
  )));
  const renderTakeoverModal = () => /* @__PURE__ */ import_react.default.createElement(
    import_materials.PisellModal,
    {
      title: getText("pisell2.saas.device-planning.takeover.title"),
      headerDivider: false,
      footerDivider: false,
      open: Boolean(takeoverDevice),
      footer: /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__footer" }, /* @__PURE__ */ import_react.default.createElement(
        import_materials.Button,
        {
          type: "default",
          block: true,
          size: "large",
          disabled: Boolean(linkingDeviceId),
          onClick: () => setTakeoverDevice(void 0)
        },
        getText("pisell2.saas.device-planning.takeover.cancel")
      ), /* @__PURE__ */ import_react.default.createElement(
        import_materials.Button,
        {
          type: "primary",
          block: true,
          size: "large",
          icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "ThunderboltOutlined" }),
          loading: linkingDeviceId === (takeoverDevice == null ? void 0 : takeoverDevice.id),
          disabled: Boolean(linkingDeviceId),
          onClick: () => takeoverDevice && handleLinkDevice(takeoverDevice)
        },
        getText("pisell2.saas.device-planning.takeover.confirm")
      )),
      width: 640,
      destroyOnClose: true,
      maskClosable: false,
      platform: isPhoneVariant ? "h5" : void 0,
      mobileModalHeight: isPhoneVariant ? "auto" : void 0,
      className: (0, import_classnames.default)(
        "saas-app-device-planning-takeover-modal",
        `saas-app-device-planning-takeover-modal--${currentVariant}`
      ),
      onCancel: () => setTakeoverDevice(void 0)
    },
    /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__warning" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "ExclamationCircleOutlined" }), /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__message" }, getText("pisell2.saas.device-planning.takeover.message")), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__detail" }, /* @__PURE__ */ import_react.default.createElement("strong", null, getText("pisell2.saas.device-planning.takeover.device")), (takeoverDevice == null ? void 0 : takeoverDevice.name) || "-"), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__detail" }, /* @__PURE__ */ import_react.default.createElement("strong", null, getText("pisell2.saas.device-planning.takeover.status")), getText(
      `pisell2.saas.device-planning.status.${takeoverDevice == null ? void 0 : takeoverDevice.link}`
    ) || (takeoverDevice == null ? void 0 : takeoverDevice.link) || "-", " • ", getText(
      `pisell2.saas.device-planning.status.${takeoverDevice == null ? void 0 : takeoverDevice.status}`
    ) || (takeoverDevice == null ? void 0 : takeoverDevice.status) || "-"), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__detail" }, /* @__PURE__ */ import_react.default.createElement("strong", null, getText("pisell2.saas.device-planning.takeover.hardware")), (takeoverDevice == null ? void 0 : takeoverDevice.modelName) || "-"), /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning-takeover-modal__desc" }, getText("pisell2.saas.device-planning.takeover.desc"))))
  );
  const renderWorkAreaDrawer = () => isPhoneVariant ? /* @__PURE__ */ import_react.default.createElement(
    import_compensatedPisellContainer.default,
    {
      renderType: "drawer",
      showHandlerBar: isPhoneVariant,
      props: {
        open: workAreaDrawerOpen,
        placement: "bottom",
        height: "80dvh",
        className: (0, import_classnames.default)(
          "saas-app-device-planning-workarea-drawer",
          `saas-app-device-planning-workarea-drawer--${currentVariant}`
        ),
        destroyOnClose: true,
        onClose: () => setWorkAreaDrawerOpen(false),
        closable: false,
        bodyStyle: {
          padding: 0
        }
      }
    },
    /* @__PURE__ */ import_react.default.createElement(
      import_WorkAreaList.default,
      {
        className: "saas-app-device-planning-sider--drawer",
        loading: workAreaRequest.loading,
        workAreas,
        selectedWorkAreaId,
        getText,
        translation,
        onCreate: () => {
          setWorkAreaDrawerOpen(false);
          openCreateModal();
        },
        onSelect: handleSelectWorkArea,
        onEdit: (record) => {
          setWorkAreaDrawerOpen(false);
          openEditModal(record);
        },
        onDelete: (record) => {
          setWorkAreaDrawerOpen(false);
          openDeleteModal(record);
        }
      }
    )
  ) : null;
  return /* @__PURE__ */ import_react.default.createElement(
    "div",
    {
      className: (0, import_classnames.default)(
        "saas-app-device-planning",
        `saas-app-device-planning--${currentVariant}`,
        className
      ),
      style
    },
    /* @__PURE__ */ import_react.default.createElement(
      "header",
      {
        className: (0, import_classnames.default)("saas-app-device-planning__global-header", {
          "saas-app-device-planning__global-header--with-back": showBack
        })
      },
      /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__global-header-left" }, showBack ? /* @__PURE__ */ import_react.default.createElement(
        import_materials.Button,
        {
          type: "text",
          icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ArrowLeftOutlined, null),
          onClick: handleBack
        }
      ) : null, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__global-title" }, getText(
        isModelSelecting ? "pisell2.saas.device-planning.select-model-title" : "pisell2.saas.device-planning.page-title"
      )), isModelSelecting ? null : /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__global-subtitle" }, getText("pisell2.saas.device-planning.page-subtitle")))),
      isModelSelecting ? null : /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__global-actions" }, /* @__PURE__ */ import_react.default.createElement(import_materials.Tag, { color: "green" }, deviceTypeName), isUniversalApp ? /* @__PURE__ */ import_react.default.createElement(
        import_materials.Button,
        {
          type: "default",
          className: "saas-app-device-planning__switch-model-button",
          icon: /* @__PURE__ */ import_react.default.createElement(import_materials.Icon, { type: "SwapOutlined" }),
          onClick: handleSwitchDeviceModel
        },
        getText("pisell2.saas.device-planning.switch-model")
      ) : null)
    ),
    /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__body" }, isModelSelecting || isPhoneVariant ? null : /* @__PURE__ */ import_react.default.createElement(
      import_WorkAreaList.default,
      {
        loading: workAreaRequest.loading,
        workAreas,
        selectedWorkAreaId,
        getText,
        translation,
        onCreate: openCreateModal,
        onSelect: handleSelectWorkArea,
        onEdit: openEditModal,
        onDelete: openDeleteModal
      }
    ), /* @__PURE__ */ import_react.default.createElement(
      "main",
      {
        className: (0, import_classnames.default)("saas-app-device-planning__content", {
          "saas-app-device-planning__content--model-selecting": isModelSelecting
        })
      },
      isModelSelecting ? renderModelSelection() : showInitialLoading ? /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__empty-workarea" }, /* @__PURE__ */ import_react.default.createElement(import_antd.Spin, null)) : /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__page-header" }, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__title" }, modelName), modelDescription ? /* @__PURE__ */ import_react.default.createElement("div", { className: "saas-app-device-planning__subtitle" }, modelDescription) : null), /* @__PURE__ */ import_react.default.createElement(
        import_materials.Button,
        {
          type: "primary",
          icon: /* @__PURE__ */ import_react.default.createElement(import_icons.PlusOutlined, null),
          onClick: () => setAddDeviceOpen(true)
        },
        getText("pisell2.saas.device-planning.add-device")
      )), isPhoneVariant ? /* @__PURE__ */ import_react.default.createElement(
        "button",
        {
          type: "button",
          className: "saas-app-device-planning__workarea-trigger",
          onClick: () => setWorkAreaDrawerOpen(true)
        },
        /* @__PURE__ */ import_react.default.createElement("span", { className: "saas-app-device-planning__workarea-trigger-label" }, getText("pisell2.saas.device-planning.work-areas")),
        /* @__PURE__ */ import_react.default.createElement("span", { className: "saas-app-device-planning__workarea-trigger-value" }, selectedWorkAreaName),
        /* @__PURE__ */ import_react.default.createElement(import_icons.DownOutlined, null)
      ) : null, /* @__PURE__ */ import_react.default.createElement(
        import_DeviceTable.default,
        {
          data: tableData,
          loading: deviceRequest.loading,
          search,
          page,
          pageSize,
          linkingDeviceId,
          getText,
          translation,
          onSearchChange: (value) => {
            setSearch(value);
            setPage(1);
          },
          onPageChange: (nextPage, nextPageSize) => {
            setPage(nextPage);
            setPageSize(nextPageSize);
          },
          onAdd: () => setAddDeviceOpen(true),
          onLink: handleLinkDevice,
          onTakeover: setTakeoverDevice,
          onEdit: (record) => {
            setSelectedDevice(record);
            setEditDeviceOpen(true);
          },
          onDelete: (record) => {
            setSelectedDevice(record);
            setDeleteDeviceOpen(true);
          }
        }
      ))
    )),
    /* @__PURE__ */ import_react.default.createElement(
      import_AddDeviceModal.default,
      {
        open: addDeviceOpen,
        variant: currentVariant,
        model: modelDetail || void 0,
        fallbackModelCode: modelCode,
        workAreaId: selectedWorkAreaId,
        workAreas,
        submitting: createDeviceRequest.loading,
        getText,
        translation,
        onClose: () => setAddDeviceOpen(false),
        onSubmit: handleCreateDevice
      }
    ),
    /* @__PURE__ */ import_react.default.createElement(
      import_EditDeviceModal.default,
      {
        open: editDeviceOpen,
        variant: currentVariant,
        record: selectedDevice,
        workAreas,
        model: modelDetail || void 0,
        submitting: updateDeviceRequest.loading,
        getText,
        translation,
        onCancel: () => setEditDeviceOpen(false),
        onSubmit: handleUpdateDevice
      }
    ),
    /* @__PURE__ */ import_react.default.createElement(
      import_DeleteDeviceModal.default,
      {
        open: deleteDeviceOpen,
        variant: currentVariant,
        record: selectedDevice,
        submitting: removeDeviceRequest.loading,
        getText,
        onCancel: () => setDeleteDeviceOpen(false),
        onConfirm: handleDeleteDevice
      }
    ),
    /* @__PURE__ */ import_react.default.createElement(
      import_WorkAreaModal.default,
      {
        open: workAreaModalOpen,
        variant: currentVariant,
        mode: workAreaModalMode,
        record: editingWorkArea,
        submitting: saveRequest.loading,
        getText,
        onCancel: () => {
          setWorkAreaModalOpen(false);
          setEditingWorkArea(void 0);
        },
        onSubmit: handleSaveWorkArea
      }
    ),
    /* @__PURE__ */ import_react.default.createElement(
      import_DeleteWorkAreaModal.default,
      {
        open: deleteModalOpen,
        variant: currentVariant,
        loading: getWorkAreaDetailRequest.loading,
        submitting: deleteRequest.loading,
        record: deleteRecord,
        counts: deleteCounts,
        translation,
        getText,
        onClose: () => {
          setDeleteModalOpen(false);
          setDeleteRecord(void 0);
          setDeleteCounts({ smart: 0, dumb: 0, integrated: 0 });
        },
        onConfirm: handleConfirmDelete
      }
    ),
    renderTakeoverModal(),
    renderWorkAreaDrawer()
  );
};
SaasAppDevicePlanning.displayName = "SaasAppDevicePlanning";
var appDevicePlanning_default = (0, import_responsive.withResponsive)(SaasAppDevicePlanning);
