@opentiny/vue-search-box 0.1.1 → 0.1.3

package/README.md

@@ -34,7 +34,7 @@ import TinySearchBox from '@opentiny/vue-search-box';
 Import styles:
 
 ```css
-@import '@opentiny/vue-search-box/index.css';
+@import '@opentiny/vue-search-box/dist/index.css';
 ```
 
 html：

package/README.zh-CN.md

@@ -35,7 +35,7 @@ import TinySearchBox from '@opentiny/vue-search-box';
 引入样式：
 
 ```css
-@import '@opentiny/vue-search-box/index.css';
+@import '@opentiny/vue-search-box/dist/index.css';
 ```
 
 在模板中使用：

package/dist/es/components/first-level-panel.vue.es.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./first-level-panel.vue.es2.js";
+export {
+  _sfc_main as default
+};

package/dist/es/components/first-level-panel.vue.es2.js

@@ -0,0 +1,177 @@
+import { defineComponent, createElementBlock, openBlock, Fragment, withDirectives, createVNode, unref, withCtx, createElementVNode, toDisplayString, vShow, renderList, createCommentVNode, createBlock, createTextVNode } from "vue";
+import TinyDropdownItem from "@opentiny/vue-dropdown-item";
+import { t } from "../index.es.js";
+/* empty css               */
+const _hoisted_1 = { class: "tvp-search-box__filter-type" };
+const _hoisted_2 = {
+  key: 0,
+  class: "tvp-search-box__text-highlight"
+};
+const _hoisted_3 = { class: "tvp-search-box__filter-type" };
+const _hoisted_4 = {
+  key: 0,
+  class: "tvp-search-box__text-highlight"
+};
+const _hoisted_5 = { class: "tvp-search-box__filter-type" };
+const _hoisted_6 = {
+  id: "potential-loading",
+  class: "tvp-search-box__potential-box"
+};
+const _hoisted_7 = { key: 0 };
+const _hoisted_8 = { class: "tvp-search-box__text-highlight" };
+const _hoisted_9 = { class: "tvp-search-box__first-panel" };
+const _hoisted_10 = {
+  key: 0,
+  class: "tvp-search-box__filter-type"
+};
+const _hoisted_11 = ["title"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "TinySearchBoxFirstLevelPanel"
+  },
+  __name: "first-level-panel",
+  props: {
+    state: {
+      type: Object,
+      default: () => ({})
+    },
+    potentialOptions: {
+      type: Array,
+      default: () => []
+    }
+  },
+  emits: ["events", "selectInputValue", "selectPropItem", "selectRadioItem"],
+  setup(__props, { emit: __emit }) {
+    const emits = __emit;
+    const events = (eventName, p1, p2) => {
+      emits("events", eventName, p1, p2);
+    };
+    const selectInputValue = (e) => {
+      events("selectInputValue", e);
+    };
+    const selectPropItem = (e) => {
+      events("selectPropItem", e);
+    };
+    const selectRadioItem = (e, v) => {
+      events("selectRadioItem", e, v);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock(Fragment, null, [
+        withDirectives(createVNode(unref(TinyDropdownItem), {
+          class: "tvp-search-box__filter-item tvp-search-box__dropdown-item tvp-search-box__dropdown-item-init",
+          onClick: _cache[0] || (_cache[0] = ($event) => selectInputValue(__props.state.inputValue))
+        }, {
+          default: withCtx(() => [
+            createElementVNode("span", null, toDisplayString(unref(t)("tvp.tvpSearchbox.initUse")) + "＂" + toDisplayString(__props.state.inputValue) + "＂", 1)
+          ]),
+          _: 1
+        }, 512), [
+          [vShow, __props.state.inputValue.trim()]
+        ]),
+        withDirectives(createElementVNode("div", null, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.matchItems, (value, key) => {
+            return openBlock(), createElementBlock(Fragment, { key }, [
+              value["attr"].length ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                createElementVNode("span", _hoisted_1, toDisplayString(key === "0" ? unref(t)("tvp.tvpSearchbox.attributeType") : key), 1),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(value["attr"], (item, index) => {
+                  return openBlock(), createBlock(unref(TinyDropdownItem), {
+                    key: item.label + index,
+                    class: "tvp-search-box__filter-item tvp-search-box__dropdown-item",
+                    onClick: ($event) => selectPropItem(item)
+                  }, {
+                    default: withCtx(() => [
+                      createElementVNode("span", null, [
+                        (openBlock(true), createElementBlock(Fragment, null, renderList(item.match, (text) => {
+                          return openBlock(), createElementBlock(Fragment, { key: text }, [
+                            text.toLowerCase() === item.hightlighStr ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(text), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                              createTextVNode(toDisplayString(text), 1)
+                            ], 64))
+                          ], 64);
+                        }), 128))
+                      ])
+                    ]),
+                    _: 2
+                  }, 1032, ["onClick"]);
+                }), 128))
+              ], 64)) : createCommentVNode("", true),
+              value["attrValue"].length ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                createElementVNode("span", _hoisted_3, toDisplayString(unref(t)("tvp.tvpSearchbox.propertyValue", [key === "0" ? unref(t)("tvp.tvpSearchbox.attributeType") : key])), 1),
+                (openBlock(true), createElementBlock(Fragment, null, renderList(value["attrValue"], (item, index) => {
+                  return openBlock(), createBlock(unref(TinyDropdownItem), {
+                    key: item.label + index,
+                    disabled: item.isChecked,
+                    class: "tvp-search-box__filter-item tvp-search-box__dropdown-item",
+                    onClick: ($event) => selectRadioItem(item, true)
+                  }, {
+                    default: withCtx(() => [
+                      createElementVNode("span", null, [
+                        (openBlock(true), createElementBlock(Fragment, null, renderList(item.match, (text) => {
+                          return openBlock(), createElementBlock(Fragment, { key: text }, [
+                            text.toLowerCase() === item.hightlighStr ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(text), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                              createTextVNode(toDisplayString(text), 1)
+                            ], 64))
+                          ], 64);
+                        }), 128))
+                      ])
+                    ]),
+                    _: 2
+                  }, 1032, ["disabled", "onClick"]);
+                }), 128))
+              ], 64)) : createCommentVNode("", true)
+            ], 64);
+          }), 128)),
+          withDirectives(createElementVNode("div", null, [
+            createElementVNode("span", _hoisted_5, toDisplayString(unref(t)("tvp.tvpSearchbox.matched")), 1),
+            createElementVNode("div", _hoisted_6, [
+              __props.state.potentialOptions ? (openBlock(), createElementBlock("div", _hoisted_7, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.potentialOptions, (item, index) => {
+                  return openBlock(), createBlock(unref(TinyDropdownItem), {
+                    key: item.label + index,
+                    class: "tvp-search-box__filter-item tvp-search-box__dropdown-item",
+                    onClick: ($event) => selectRadioItem(item, true)
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(item.label) + "： ", 1),
+                      createElementVNode("span", _hoisted_8, toDisplayString(item.value), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["onClick"]);
+                }), 128))
+              ])) : createCommentVNode("", true)
+            ])
+          ], 512), [
+            [vShow, __props.state.potentialOptions]
+          ])
+        ], 512), [
+          [vShow, !__props.state.propItem.label && __props.state.inputValue.trim()]
+        ]),
+        withDirectives(createElementVNode("div", _hoisted_9, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.groupItems, (group, key) => {
+            return openBlock(), createElementBlock(Fragment, { key }, [
+              group.length ? (openBlock(), createElementBlock("span", _hoisted_10, toDisplayString(key === "0" ? unref(t)("tvp.tvpSearchbox.attributeType") : key), 1)) : createCommentVNode("", true),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(group, (item, index) => {
+                return openBlock(), createBlock(unref(TinyDropdownItem), {
+                  key: (item.field || item.label) + index,
+                  class: "tvp-search-box__dropdown-item",
+                  onClick: ($event) => selectPropItem(item)
+                }, {
+                  default: withCtx(() => [
+                    createElementVNode("span", {
+                      title: item.label
+                    }, toDisplayString(item.label), 9, _hoisted_11)
+                  ]),
+                  _: 2
+                }, 1032, ["onClick"]);
+              }), 128))
+            ], 64);
+          }), 128))
+        ], 512), [
+          [vShow, __props.state.visible && !__props.state.propItem.label && !__props.state.inputValue.trim()]
+        ])
+      ], 64);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/es/components/second-level-panel.vue.es.js

@@ -0,0 +1,4 @@
+import _sfc_main from "./second-level-panel.vue.es2.js";
+export {
+  _sfc_main as default
+};

package/dist/es/components/second-level-panel.vue.es2.js

@@ -0,0 +1,466 @@
+import { defineComponent, computed, createElementBlock, withDirectives, createCommentVNode, openBlock, createElementVNode, toDisplayString, unref, Fragment, renderList, createBlock, withCtx, createTextVNode, vShow, normalizeClass, createVNode, withModifiers } from "vue";
+import TinyFormItem from "@opentiny/vue-form-item";
+import TinyDropdownItem from "@opentiny/vue-dropdown-item";
+import TinyCheckbox from "@opentiny/vue-checkbox";
+import TinyCheckboxGroup from "@opentiny/vue-checkbox-group";
+import TinyDatePicker from "@opentiny/vue-date-picker";
+import TinyInput from "@opentiny/vue-input";
+import TinyButton from "@opentiny/vue-button";
+import Loading from "@opentiny/vue-loading";
+import { t } from "../index.es.js";
+/* empty css               */
+const _hoisted_1 = { key: 0 };
+const _hoisted_2 = { class: "tvp-search-box__filter-type" };
+const _hoisted_3 = ["title"];
+const _hoisted_4 = {
+  key: 0,
+  class: "tvp-search-box__text-highlight"
+};
+const _hoisted_5 = ["title"];
+const _hoisted_6 = { class: "tvp-search-box__checkbox-wrap" };
+const _hoisted_7 = { class: "tvp-search-box__checkbox-btn" };
+const _hoisted_8 = {
+  key: 3,
+  class: "tvp-search-box__panel-box"
+};
+const _hoisted_9 = { class: "tvp-search-box__number" };
+const _hoisted_10 = { class: "tvp-search-box__dropdown-title" };
+const _hoisted_11 = { class: "tvp-search-box__dropdown-start" };
+const _hoisted_12 = { class: "tvp-search-box__dropdown-end" };
+const _hoisted_13 = { class: "tvp-search-box__bottom-btn" };
+const _hoisted_14 = {
+  key: 4,
+  class: "tvp-search-box__panel-box"
+};
+const _hoisted_15 = { class: "tvp-search-box__date-wrap" };
+const _hoisted_16 = { class: "tvp-search-box__dropdown-title" };
+const _hoisted_17 = { class: "tvp-search-box__dropdown-start" };
+const _hoisted_18 = { class: "tvp-search-box__dropdown-end" };
+const _hoisted_19 = { class: "tvp-search-box__bottom-btn" };
+const _hoisted_20 = {
+  key: 5,
+  class: "tvp-search-box__panel-box"
+};
+const _hoisted_21 = { class: "tvp-search-box__date-wrap" };
+const _hoisted_22 = { class: "tvp-search-box__dropdown-title" };
+const _hoisted_23 = { class: "tvp-search-box__dropdown-start" };
+const _hoisted_24 = { class: "tvp-search-box__dropdown-end" };
+const _hoisted_25 = { class: "tvp-search-box__bottom-btn" };
+const _hoisted_26 = { key: 6 };
+const _hoisted_27 = {
+  key: 0,
+  class: "tvp-search-box__filter-type"
+};
+const _hoisted_28 = {
+  key: 1,
+  class: "tvp-search-box__filter-type"
+};
+const _hoisted_29 = ["title"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "TinySearchBoxSecondLevelPanel"
+  },
+  __name: "second-level-panel",
+  props: {
+    state: {
+      type: Object,
+      default: () => ({})
+    },
+    pickerOptions: {
+      type: Function,
+      default: () => {
+      }
+    }
+  },
+  emits: ["events"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const isLoading = computed(() => {
+      var _a;
+      return props.state.hasBackupList && ((_a = props.state.backupList) == null ? void 0 : _a.length) === 0;
+    });
+    const vLoading = Loading.directive;
+    const emits = __emit;
+    const showCheckBoxList = computed(() => {
+      var _a;
+      return (_a = props.state.backupList) == null ? void 0 : _a.find((item) => !item.isFilter);
+    });
+    const events = (eventName, p1, p2) => {
+      emits("events", eventName, p1, p2);
+    };
+    const setOperator = (e) => {
+      events("setOperator", e);
+    };
+    const selectRadioItem = (e) => {
+      events("selectRadioItem", e);
+    };
+    const selectCheckbox = (e) => {
+      events("selectCheckbox", e);
+    };
+    const sizeChange = (e) => {
+      events("sizeChange", e);
+    };
+    const onConfirmDate = (e, b) => {
+      events("onConfirmDate", e, b);
+    };
+    const selectFirstMap = (e, b) => {
+      events("selectFirstMap", e, b);
+    };
+    const handleDateShow = (e) => {
+      events("handleDateShow", e);
+    };
+    return (_ctx, _cache) => {
+      var _a;
+      return ((_a = __props.state.currentOperators) == null ? void 0 : _a.length) ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("span", _hoisted_2, toDisplayString(unref(t)("tvp.tvpSearchbox.operator")), 1),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.currentOperators, (item, index) => {
+          return withDirectives((openBlock(), createBlock(unref(TinyDropdownItem), {
+            key: item + index,
+            class: "tvp-search-box__dropdown-item",
+            onClick: ($event) => setOperator(item)
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(item), 1)
+            ]),
+            _: 2
+          }, 1032, ["onClick"])), [
+            [vShow, item.includes(__props.state.inputValue)]
+          ]);
+        }), 128))
+      ])) : !__props.state.prevItem.type || __props.state.prevItem.type === "radio" ? withDirectives((openBlock(), createElementBlock("div", {
+        key: 1,
+        class: normalizeClass(["tvp-search-box__radio-wrap", isLoading.value && "tvp-search-box__loading-box"])
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.backupList, (item, index) => {
+          return withDirectives((openBlock(), createBlock(unref(TinyDropdownItem), {
+            key: index + (item.field || item.label),
+            disabled: item.isChecked,
+            class: "tvp-search-box__dropdown-item",
+            onClick: ($event) => selectRadioItem(item)
+          }, {
+            default: withCtx(() => [
+              item.match ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                title: item.label
+              }, [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(item.match, (text) => {
+                  return openBlock(), createElementBlock(Fragment, { key: text }, [
+                    text.toLowerCase() === item.hightlighStr ? (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(text), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                      createTextVNode(toDisplayString(text), 1)
+                    ], 64))
+                  ], 64);
+                }), 128))
+              ], 8, _hoisted_3)) : (openBlock(), createElementBlock("span", {
+                key: 1,
+                title: item.label
+              }, toDisplayString(item.label), 9, _hoisted_5))
+            ]),
+            _: 2
+          }, 1032, ["disabled", "onClick"])), [
+            [vShow, !item.isFilter || !__props.state.inputValue]
+          ]);
+        }), 128))
+      ], 2)), [
+        [unref(vLoading), isLoading.value]
+      ]) : __props.state.prevItem.type === "checkbox" ? withDirectives((openBlock(), createElementBlock("div", {
+        key: 2,
+        class: normalizeClass(isLoading.value && "tvp-search-box__loading-box")
+      }, [
+        showCheckBoxList.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+          createElementVNode("div", _hoisted_6, [
+            createVNode(unref(TinyCheckboxGroup), {
+              modelValue: __props.state.checkAll,
+              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => __props.state.checkAll = $event),
+              class: "tvp-search-box__checkbox"
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(TinyDropdownItem), { class: "tvp-search-box__dropdown-item tvp-search-box__checkbox-item" }, {
+                  default: withCtx(() => [
+                    createVNode(unref(TinyCheckbox), {
+                      modelValue: __props.state.checkAll,
+                      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => __props.state.checkAll = $event),
+                      indeterminate: __props.state.isIndeterminate
+                    }, {
+                      default: withCtx(() => [
+                        createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.selectAll")), 1)
+                      ]),
+                      _: 1
+                    }, 8, ["modelValue", "indeterminate"])
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"]),
+            createVNode(unref(TinyCheckboxGroup), {
+              modelValue: __props.state.checkboxGroup,
+              "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => __props.state.checkboxGroup = $event),
+              class: "tvp-search-box__checkbox"
+            }, {
+              default: withCtx(() => [
+                (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.backupList, (item, index) => {
+                  return withDirectives((openBlock(), createBlock(unref(TinyDropdownItem), {
+                    key: (item.field || item.label) + index,
+                    class: "tvp-search-box__dropdown-item tvp-search-box__checkbox-item"
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(TinyCheckbox), {
+                        label: __props.state.prevItem.label + item.label,
+                        title: item.label,
+                        class: "tvp-search-box__checkbox-item-label"
+                      }, {
+                        default: withCtx(() => [
+                          createTextVNode(toDisplayString(item.label), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["label", "title"])
+                    ]),
+                    _: 2
+                  }, 1024)), [
+                    [vShow, !item.isFilter]
+                  ]);
+                }), 128))
+              ]),
+              _: 1
+            }, 8, ["modelValue"])
+          ]),
+          createElementVNode("div", _hoisted_7, [
+            createVNode(unref(TinyButton), {
+              size: "mini",
+              onClick: _cache[3] || (_cache[3] = ($event) => selectCheckbox(false))
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.cancel")), 1)
+              ]),
+              _: 1
+            }),
+            createVNode(unref(TinyButton), {
+              size: "mini",
+              onClick: _cache[4] || (_cache[4] = ($event) => selectCheckbox(true))
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.confirm")), 1)
+              ]),
+              _: 1
+            })
+          ])
+        ], 64)) : createCommentVNode("", true)
+      ], 2)), [
+        [unref(vLoading), isLoading.value]
+      ]) : __props.state.prevItem.type === "numRange" ? (openBlock(), createElementBlock("div", _hoisted_8, [
+        createElementVNode("div", _hoisted_9, [
+          createElementVNode("div", _hoisted_10, toDisplayString(unref(t)("tvp.tvpSearchbox.rangeNumberTitle")), 1),
+          createElementVNode("div", _hoisted_11, toDisplayString(unref(t)("tvp.tvpSearchbox.minValueText")) + "(" + toDisplayString(__props.state.prevItem.unit) + ") ", 1),
+          createVNode(unref(TinyFormItem), {
+            prop: __props.state.curMinNumVar,
+            class: "tvp-search-box__number-item",
+            "show-message": __props.state.numberShowMessage
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyInput), {
+                modelValue: __props.state[__props.state.curMinNumVar],
+                "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => __props.state[__props.state.curMinNumVar] = $event),
+                type: "number",
+                class: "tvp-search-box__number-input"
+              }, null, 8, ["modelValue"])
+            ]),
+            _: 1
+          }, 8, ["prop", "show-message"]),
+          createElementVNode("div", _hoisted_12, toDisplayString(unref(t)("tvp.tvpSearchbox.maxValueText")) + "(" + toDisplayString(__props.state.prevItem.unit) + ") ", 1),
+          createVNode(unref(TinyFormItem), {
+            prop: __props.state.curMaxNumVar,
+            class: "tvp-search-box__number-item"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyInput), {
+                modelValue: __props.state[__props.state.curMaxNumVar],
+                "onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => __props.state[__props.state.curMaxNumVar] = $event),
+                type: "number",
+                class: "tvp-search-box__number-input"
+              }, null, 8, ["modelValue"])
+            ]),
+            _: 1
+          }, 8, ["prop"])
+        ]),
+        createElementVNode("div", _hoisted_13, [
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[7] || (_cache[7] = ($event) => sizeChange(false))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.cancel")), 1)
+            ]),
+            _: 1
+          }),
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[8] || (_cache[8] = withModifiers(($event) => sizeChange(true), ["stop"]))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.confirm")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ])) : __props.state.prevItem.type === "dateRange" ? (openBlock(), createElementBlock("div", _hoisted_14, [
+        createElementVNode("div", _hoisted_15, [
+          createElementVNode("div", _hoisted_16, toDisplayString(__props.state.prevItem.maxTimeLength > 0 ? unref(t)("tvp.tvpSearchbox.timeLengthTitle", {
+            value: (__props.state.prevItem.maxTimeLength / 864e5).toFixed(1)
+          }) : unref(t)("tvp.tvpSearchbox.rangeDateTitle")), 1),
+          createElementVNode("div", _hoisted_17, toDisplayString(unref(t)("tvp.tvpSearchbox.rangeBeginLabel")), 1),
+          createVNode(unref(TinyFormItem), {
+            prop: "startDate",
+            "show-message": Boolean(__props.state.prevItem.maxTimeLength),
+            class: "tvp-search-box__date-item"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyDatePicker), {
+                modelValue: __props.state.startDate,
+                "onUpdate:modelValue": _cache[9] || (_cache[9] = ($event) => __props.state.startDate = $event),
+                format: __props.state.prevItem.format || __props.state.dateRangeFormat,
+                "value-format": __props.state.prevItem.format || __props.state.dateRangeFormat,
+                "picker-options": __props.pickerOptions(__props.state.startDate, "endDate"),
+                class: "tvp-search-box__date-picker",
+                onChange: handleDateShow,
+                onBlur: handleDateShow
+              }, null, 8, ["modelValue", "format", "value-format", "picker-options"])
+            ]),
+            _: 1
+          }, 8, ["show-message"]),
+          createElementVNode("div", _hoisted_18, toDisplayString(unref(t)("tvp.tvpSearchbox.rangeEndLabel")), 1),
+          createVNode(unref(TinyFormItem), {
+            prop: "endDate",
+            class: "tvp-search-box__date-item"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyDatePicker), {
+                modelValue: __props.state.endDate,
+                "onUpdate:modelValue": _cache[10] || (_cache[10] = ($event) => __props.state.endDate = $event),
+                format: __props.state.prevItem.format || __props.state.dateRangeFormat,
+                "value-format": __props.state.prevItem.format || __props.state.dateRangeFormat,
+                "picker-options": __props.pickerOptions(__props.state.startDate),
+                class: "tvp-search-box__date-picker",
+                onChange: handleDateShow,
+                onBlur: handleDateShow
+              }, null, 8, ["modelValue", "format", "value-format", "picker-options"])
+            ]),
+            _: 1
+          })
+        ]),
+        createElementVNode("div", _hoisted_19, [
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[11] || (_cache[11] = ($event) => onConfirmDate(false))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.cancel")), 1)
+            ]),
+            _: 1
+          }),
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[12] || (_cache[12] = ($event) => onConfirmDate(true))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.confirm")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ])) : __props.state.prevItem.type === "datetimeRange" ? (openBlock(), createElementBlock("div", _hoisted_20, [
+        createElementVNode("div", _hoisted_21, [
+          createElementVNode("div", _hoisted_22, toDisplayString(__props.state.prevItem.maxTimeLength > 0 ? unref(t)("tvp.tvpSearchbox.timeLengthTitle", {
+            value: (__props.state.prevItem.maxTimeLength / 864e5).toFixed(1)
+          }) : unref(t)("tvp.tvpSearchbox.rangeDateTitle")), 1),
+          createElementVNode("div", _hoisted_23, toDisplayString(unref(t)("tvp.tvpSearchbox.rangeBeginLabel")), 1),
+          createVNode(unref(TinyFormItem), {
+            prop: "startDateTime",
+            "show-message": Boolean(__props.state.prevItem.maxTimeLength),
+            class: "tvp-search-box__date-item"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyDatePicker), {
+                modelValue: __props.state.startDateTime,
+                "onUpdate:modelValue": _cache[13] || (_cache[13] = ($event) => __props.state.startDateTime = $event),
+                type: "datetime",
+                isutc8: true,
+                format: __props.state.prevItem.format || __props.state.datetimeRangeFormat,
+                "value-format": __props.state.prevItem.format || __props.state.datetimeRangeFormat,
+                "picker-options": __props.pickerOptions(__props.state.startDateTime, "endDateTime"),
+                class: "tvp-search-box__date-picker",
+                onChange: handleDateShow,
+                onBlur: handleDateShow
+              }, null, 8, ["modelValue", "format", "value-format", "picker-options"])
+            ]),
+            _: 1
+          }, 8, ["show-message"]),
+          createElementVNode("div", _hoisted_24, toDisplayString(unref(t)("tvp.tvpSearchbox.rangeEndLabel")), 1),
+          createVNode(unref(TinyFormItem), {
+            prop: "endDateTime",
+            class: "tvp-search-box__date-item"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(TinyDatePicker), {
+                modelValue: __props.state.endDateTime,
+                "onUpdate:modelValue": _cache[14] || (_cache[14] = ($event) => __props.state.endDateTime = $event),
+                type: "datetime",
+                isutc8: true,
+                format: __props.state.prevItem.format || __props.state.datetimeRangeFormat,
+                "value-format": __props.state.prevItem.format || __props.state.datetimeRangeFormat,
+                "picker-options": __props.pickerOptions(__props.state.startDateTime),
+                class: "tvp-search-box__date-picker",
+                onChange: handleDateShow,
+                onBlur: handleDateShow
+              }, null, 8, ["modelValue", "format", "value-format", "picker-options"])
+            ]),
+            _: 1
+          })
+        ]),
+        createElementVNode("div", _hoisted_25, [
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[15] || (_cache[15] = ($event) => onConfirmDate(false, true))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.cancel")), 1)
+            ]),
+            _: 1
+          }),
+          createVNode(unref(TinyButton), {
+            size: "mini",
+            onClick: _cache[16] || (_cache[16] = ($event) => onConfirmDate(true, true))
+          }, {
+            default: withCtx(() => [
+              createTextVNode(toDisplayString(unref(t)("tvp.tvpSearchbox.confirm")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ])) : __props.state.prevItem.type === "map" ? withDirectives((openBlock(), createElementBlock("div", _hoisted_26, [
+        __props.state.isShowTagKey ? (openBlock(), createElementBlock("span", _hoisted_27, toDisplayString(unref(t)("tvp.tvpSearchbox.tagKey")), 1)) : (openBlock(), createElementBlock("span", _hoisted_28, toDisplayString(unref(t)("tvp.tvpSearchbox.tagValue")), 1)),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.state.backupList, (item, index) => {
+          return withDirectives((openBlock(), createBlock(unref(TinyDropdownItem), {
+            key: item.label + item.value + index,
+            disabled: item.isChecked,
+            class: "tvp-search-box__dropdown-item",
+            onClick: ($event) => selectFirstMap(item, __props.state.isShowTagKey)
+          }, {
+            default: withCtx(() => [
+              createElementVNode("span", {
+                title: item.label
+              }, toDisplayString(item.label), 9, _hoisted_29)
+            ]),
+            _: 2
+          }, 1032, ["disabled", "onClick"])), [
+            [vShow, !item.isFilter]
+          ]);
+        }), 128))
+      ])), [
+        [unref(vLoading), isLoading.value]
+      ]) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};