import { defineComponent, ref, watch, openBlock, createElementBlock, Fragment, renderList, createElementVNode, toDisplayString, createVNode, unref, withCtx, normalizeStyle, withModifiers, createBlock, createCommentVNode } from "vue";
import WlSvg from "@wltech/svg";
import vuedraggable from "vuedraggable";
var index_vue_vue_type_style_index_0_lang = "";
const _hoisted_1 = {
  class: "field-sort",
  "data-weiling-mobile-ui-wl-field-sort": ""
};
const _hoisted_2 = { class: "field-title" };
const _hoisted_3 = /* @__PURE__ */ createElementVNode("span", { class: "title-line" }, null, -1);
const _hoisted_4 = { class: "title-text" };
const _hoisted_5 = { class: "field-box" };
const _hoisted_6 = { class: "field-item" };
const _hoisted_7 = { class: "item-left" };
const __default__ = {
  name: "BCFieldSort"
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  props: {
    list: { default: () => {
      return [];
    } }
  },
  emits: ["onChange"],
  setup(__props, { emit }) {
    const props = __props;
    const fieldList = ref(JSON.parse(JSON.stringify(props.list)));
    const onFieldClick = (item, element) => {
      var _a, _b, _c;
      const fieldItem = (_a = fieldList.value) == null ? void 0 : _a.find((v) => v.key === item.key);
      if (fieldItem) {
        const oldList = fieldItem == null ? void 0 : fieldItem.list;
        const i = oldList == null ? void 0 : oldList.findIndex(
          (v) => v.property_id === element.property_id
        );
        if (i !== -1) {
          oldList.splice(i, 1);
          const newList = (_c = (_b = fieldList.value) == null ? void 0 : _b.find(
            (v) => v.editKey === item.key
          )) == null ? void 0 : _c.list;
          newList && newList.push({
            ...element,
            display: !element.display
          });
        }
      }
    };
    watch(
      () => props.list,
      () => {
        fieldList.value = JSON.parse(JSON.stringify(props.list));
      },
      {
        immediate: true,
        deep: true
      }
    );
    watch(
      () => fieldList.value,
      () => {
        emit("onChange", fieldList.value);
      },
      {
        deep: true
      }
    );
    return (_ctx, _cache) => {
      return openBlock(), createElementBlock("div", _hoisted_1, [
        (openBlock(true), createElementBlock(Fragment, null, renderList(fieldList.value, (item) => {
          return openBlock(), createElementBlock("div", {
            key: item.key,
            class: "field-content"
          }, [
            createElementVNode("div", _hoisted_2, [
              _hoisted_3,
              createElementVNode("span", _hoisted_4, toDisplayString(item.title), 1)
            ]),
            createElementVNode("ul", _hoisted_5, [
              createVNode(unref(vuedraggable), {
                modelValue: item.list,
                "onUpdate:modelValue": ($event) => item.list = $event,
                "item-key": "property_id",
                animation: "300",
                disabled: !item.sortable,
                handle: ".drag-icon"
              }, {
                item: withCtx(({ element }) => [
                  createElementVNode("li", _hoisted_6, [
                    createElementVNode("div", _hoisted_7, [
                      createVNode(unref(WlSvg), {
                        type: item.icon,
                        class: "field-left-icon",
                        style: normalizeStyle({ color: item.color }),
                        onClick: withModifiers(($event) => onFieldClick(item, element), ["stop"])
                      }, null, 8, ["type", "style", "onClick"]),
                      createElementVNode("span", null, toDisplayString(element.name || element.view_name), 1)
                    ]),
                    createElementVNode("div", {
                      class: "drag-icon",
                      onClick: _cache[0] || (_cache[0] = withModifiers(() => {
                      }, ["stop"]))
                    }, [
                      item.sortable ? (openBlock(), createBlock(unref(WlSvg), {
                        key: 0,
                        type: "drag",
                        class: "field-drag-icon"
                      })) : createCommentVNode("", true)
                    ])
                  ])
                ]),
                _: 2
              }, 1032, ["modelValue", "onUpdate:modelValue", "disabled"])
            ])
          ]);
        }), 128))
      ]);
    };
  }
});
_sfc_main.install = (app) => {
  app.component(_sfc_main.name, _sfc_main);
};
export { _sfc_main as default };
