import { createVNode as _createVNode } from "vue";
import { cloneElement, funcType, objectType, stringType } from "@antdv/pro-utils";
import { List, Select, Switch, Tooltip } from "ant-design-vue";
import { defineComponent } from "vue";
import { defaultSettings } from "../../defaultSettings.mjs";
import { getFormatMessage } from "./index.mjs";
function renderLayoutSettingItem({
  item
}) {
  const action = cloneElement(item.action, {
    disabled: item.disabled
  });
  return _createVNode(Tooltip, {
    "title": item.disabled ? item.disabledReason : "",
    "placement": "left"
  }, {
    default: () => [_createVNode(List.Item, {
      "actions": [action]
    }, {
      default: () => [_createVNode("span", {
        "style": {
          opacity: item.disabled ? 0.5 : 1
        }
      }, [item.title])]
    })]
  });
}
const layoutSettingProps = {
  settings: objectType().isRequired,
  changeSetting: funcType().isRequired,
  hashId: stringType().isRequired,
  prefixCls: stringType().isRequired
};
const LayoutSetting = defineComponent({
  name: "LayoutSetting",
  props: layoutSettingProps,
  setup(props) {
    return () => {
      const {
        settings,
        prefixCls,
        changeSetting,
        hashId
      } = props;
      const formatMessage = getFormatMessage();
      const {
        contentWidth,
        splitMenus,
        fixedHeader,
        layout,
        fixSiderbar
      } = settings || defaultSettings;
      return _createVNode(List, {
        "class": `${prefixCls}-list ${hashId}`.trim(),
        "split": false,
        "dataSource": [{
          title: formatMessage({
            id: "app.setting.content-width",
            defaultMessage: "Content Width"
          }),
          action: _createVNode(Select, {
            "value": contentWidth || "Fixed",
            "size": "small",
            "class": `content-width ${hashId}`.trim(),
            "onSelect": (value) => {
              changeSetting("contentWidth", value);
            },
            "style": {
              width: `80px`
            }
          }, {
            default: () => [layout === "side" ? null : _createVNode(Select.Option, {
              "value": "Fixed"
            }, {
              default: () => [formatMessage({
                id: "app.setting.content-width.fixed",
                defaultMessage: "Fixed"
              })]
            }), _createVNode(Select.Option, {
              "value": "Fluid"
            }, {
              default: () => [formatMessage({
                id: "app.setting.content-width.fluid",
                defaultMessage: "Fluid"
              })]
            })]
          })
        }, {
          title: formatMessage({
            id: "app.setting.fixedheader",
            defaultMessage: "Fixed Header"
          }),
          action: _createVNode(Switch, {
            "size": "small",
            "class": "fixed-header",
            "checked": !!fixedHeader,
            "onChange": (checked) => {
              changeSetting("fixedHeader", checked);
            }
          }, null)
        }, {
          title: formatMessage({
            id: "app.setting.fixedsidebar",
            defaultMessage: "Fixed Sidebar"
          }),
          disabled: layout === "top",
          disabledReason: formatMessage({
            id: "app.setting.fixedsidebar.hint",
            defaultMessage: "Works on Side Menu Layout"
          }),
          action: _createVNode(Switch, {
            "size": "small",
            "class": "fix-siderbar",
            "checked": !!fixSiderbar,
            "onChange": (checked) => changeSetting("fixSiderbar", checked)
          }, null)
        }, {
          title: formatMessage({
            id: "app.setting.splitMenus"
          }),
          disabled: layout !== "mix",
          action: _createVNode(Switch, {
            "size": "small",
            "checked": !!splitMenus,
            "class": "split-menus",
            "onChange": (checked) => {
              changeSetting("splitMenus", checked);
            }
          }, null)
        }],
        "renderItem": renderLayoutSettingItem
      }, null);
    };
  }
});
export {
  LayoutSetting,
  renderLayoutSettingItem
};
