persagy-vant 0.0.21

package/lib/work-order-filter/WorkOrderFilter.js

@@ -0,0 +1,549 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], 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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  default: () => stdin_default
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_vue = require("vue");
+var import_utils = require("../utils");
+var import_action_sheet = require("../action-sheet");
+var import_blue_mark = require("../blue-mark");
+var import_bottom_action_bar = require("../bottom-action-bar");
+var import_cell = require("../cell");
+var import_checkbox = require("../checkbox");
+var import_checkbox_group = require("../checkbox-group");
+var import_datetime_picker = require("../datetime-picker");
+var import_filter_tag = require("../filter-tag");
+var import_icon = require("../icon");
+var import_nav_bar = require("../nav-bar");
+const [name, bem] = (0, import_utils.createNamespace)("work-order-filter");
+const defaultValue = () => ({
+  projectIds: [],
+  workOrderTypes: [],
+  prioritizeProjects: true,
+  sort: "required-asc",
+  timeRange: "",
+  timeRanges: {},
+  reminder: "all",
+  relation: "all",
+  workTypes: [],
+  saveAsDefault: false
+});
+const defaultProjects = [{
+  label: "\u798F\u5DDE\u96C6\u7965\u5929\u5730\u5E7F\u573A",
+  value: "fuzhou-jixiang"
+}, {
+  label: "\u798F\u5DDE\u9752\u53E3\u5546\u4E1A\u5E7F\u573A",
+  value: "fuzhou-qingkou"
+}, {
+  label: "\u798F\u5DDE\u4E09\u5B9D\u5BBE\u90B8\u9152\u5E97",
+  value: "fuzhou-sanbao-hotel"
+}, {
+  label: "\u798F\u5DDE\u5B9D\u5927\u996D\u5E97(\u6D66\u4E0A\u5E97)",
+  value: "fuzhou-baoda"
+}, {
+  label: "\u798F\u5DDE\u7965\u79BE\u5929\u5730\u5E7F\u573A",
+  value: "fuzhou-xianghe"
+}];
+const defaultWorkOrderTypes = [{
+  label: "\u5168\u90E8",
+  value: "all"
+}, {
+  label: "\u5F85\u6307\u6D3E",
+  value: "pending-assignment"
+}, {
+  label: "\u5F85\u63A5\u5355",
+  value: "pending-acceptance"
+}, {
+  label: "\u5F85\u62A2\u5355",
+  value: "pending-grab"
+}, {
+  label: "\u5F85\u6267\u884C",
+  value: "pending-execution"
+}, {
+  label: "\u5F85\u5BA1\u6838",
+  value: "pending-review"
+}, {
+  label: "\u5F85\u5BA1\u6279",
+  value: "pending-approval"
+}];
+const defaultSortOptions = [{
+  label: "\u8981\u6C42\u5B8C\u6210\u65F6\u95F4\u4ECE\u524D\u5F80\u540E",
+  value: "required-asc"
+}, {
+  label: "\u8981\u6C42\u5B8C\u6210\u65F6\u95F4\u4ECE\u540E\u5F80\u524D",
+  value: "required-desc"
+}, {
+  label: "\u521B\u5EFA\u65F6\u95F4\u4ECE\u524D\u5F80\u540E",
+  value: "created-asc"
+}, {
+  label: "\u521B\u5EFA\u65F6\u95F4\u4ECE\u540E\u5F80\u524D",
+  value: "created-desc"
+}];
+const defaultTimeOptions = [{
+  label: "\u521B\u5EFA\u65F6\u6BB5",
+  value: "created-today"
+}, {
+  label: "\u8981\u6C42\u5F00\u59CB\u65F6\u6BB5",
+  value: "required-start"
+}, {
+  label: "\u8981\u6C42\u5B8C\u6210\u65F6\u6BB5",
+  value: "required-end"
+}];
+const defaultReminderOptions = [{
+  label: "\u5168\u90E8",
+  value: "all"
+}, {
+  label: "\u903E\u671F",
+  value: "overdue"
+}, {
+  label: "\u672A\u903E\u671F",
+  value: "not-overdue"
+}];
+const defaultRelationOptions = [{
+  label: "\u5168\u90E8",
+  value: "all"
+}, {
+  label: "\u5426",
+  value: "no"
+}, {
+  label: "\u662F",
+  value: "yes"
+}];
+const defaultWorkTypes = [{
+  label: "\u5168\u90E8",
+  value: "all"
+}, {
+  label: "\u8BA1\u5212\u5DE1\u68C0",
+  value: "planned-inspection"
+}, {
+  label: "\u8BA1\u5212\u5DE1\u68C02",
+  value: "planned-inspection-2"
+}, {
+  label: "\u8BA1\u5212\u7EF4\u4FDD",
+  value: "planned-maintenance"
+}, {
+  label: "\u8BA1\u5212\u7EF4\u4FDD2",
+  value: "planned-maintenance-2"
+}, {
+  label: "\u6392\u67E5\u5904\u7406",
+  value: "troubleshooting"
+}, {
+  label: "\u7528\u6237\u62A5\u4E8B",
+  value: "user-report"
+}, {
+  label: "\u4E34\u65F6\u5DE1\u68C0",
+  value: "temporary-inspection"
+}, {
+  label: "\u4E34\u65F6\u7EF4\u4FEE",
+  value: "temporary-maintenance"
+}, {
+  label: "\u5458\u5DE5\u6574\u6539",
+  value: "staff-rectification"
+}];
+const defaultSectionOrder = ["projects", "sort", "time-range", "custom", "reminder", "relation", "work-order-types", "work-types"];
+const workOrderFilterProps = {
+  show: Boolean,
+  title: (0, import_utils.makeStringProp)("\u7B5B\u9009"),
+  modelValue: {
+    type: Object,
+    default: defaultValue
+  },
+  projects: {
+    type: Array,
+    default: () => defaultProjects
+  },
+  workOrderTypes: {
+    type: Array,
+    default: () => defaultWorkOrderTypes
+  },
+  sortOptions: {
+    type: Array,
+    default: () => defaultSortOptions
+  },
+  timeOptions: {
+    type: Array,
+    default: () => defaultTimeOptions
+  },
+  reminderOptions: {
+    type: Array,
+    default: () => defaultReminderOptions
+  },
+  relationOptions: {
+    type: Array,
+    default: () => defaultRelationOptions
+  },
+  workTypes: {
+    type: Array,
+    default: () => defaultWorkTypes
+  },
+  resetText: (0, import_utils.makeStringProp)("\u91CD\u7F6E"),
+  confirmText: (0, import_utils.makeStringProp)("\u786E\u5B9A"),
+  saveText: (0, import_utils.makeStringProp)("\u4FDD\u5B58\u4E3A\u6211\u7684\u9ED8\u8BA4\u7B5B\u9009"),
+  showProjects: {
+    type: Boolean,
+    default: true
+  },
+  showSort: {
+    type: Boolean,
+    default: true
+  },
+  showTimeRange: {
+    type: Boolean,
+    default: true
+  },
+  showReminder: {
+    type: Boolean,
+    default: true
+  },
+  showRelation: {
+    type: Boolean,
+    default: true
+  },
+  showWorkOrderTypes: {
+    type: Boolean,
+    default: true
+  },
+  showWorkTypes: {
+    type: Boolean,
+    default: true
+  },
+  sectionOrder: {
+    type: Array,
+    default: () => defaultSectionOrder
+  }
+};
+var stdin_default = (0, import_vue.defineComponent)({
+  name,
+  props: workOrderFilterProps,
+  emits: ["update:show", "update:modelValue", "confirm", "reset", "reorder"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const value = (0, import_vue.computed)(() => (0, import_utils.extend)({}, defaultValue(), props.modelValue));
+    const projectOptions = (0, import_vue.ref)([...props.projects]);
+    const projectIds = (0, import_vue.computed)(() => value.value.projectIds);
+    const showTimeRangePicker = (0, import_vue.ref)(false);
+    const pickerStartTime = (0, import_vue.ref)(/* @__PURE__ */ new Date());
+    const pickerEndTime = (0, import_vue.ref)(new Date(Date.now() + 60 * 60 * 1e3));
+    const minTimeRangeDate = new Date(2020, 0, 1);
+    const maxTimeRangeDate = new Date((/* @__PURE__ */ new Date()).getFullYear() + 5, 11, 31);
+    const draggingProjectId = (0, import_vue.ref)();
+    const suppressProjectSelection = (0, import_vue.ref)(false);
+    let dragPointerId;
+    let onProjectDragMove;
+    const allProjectsSelected = (0, import_vue.computed)(() => projectOptions.value.length > 0 && projectOptions.value.every((option) => projectIds.value.includes(option.value)));
+    (0, import_vue.watch)(() => props.projects, (projects) => {
+      projectOptions.value = [...projects];
+    });
+    const update = (patch) => emit("update:modelValue", (0, import_utils.extend)({}, value.value, patch));
+    const close = () => emit("update:show", false);
+    const formatTime = (date) => {
+      const pad = (value2) => `${value2}`.padStart(2, "0");
+      return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}`;
+    };
+    const selectedTimeRange = (0, import_vue.computed)(() => value.value.timeRange ? value.value.timeRanges[value.value.timeRange] : void 0);
+    const selectedTimeRangeText = (0, import_vue.computed)(() => {
+      const range = selectedTimeRange.value;
+      return range ? `${formatTime(range.startTime)} \u81F3 ${formatTime(range.endTime)}` : "\u672A\u9009\u62E9";
+    });
+    const openTimeRangePicker = () => {
+      const range = selectedTimeRange.value;
+      pickerStartTime.value = (range == null ? void 0 : range.startTime) || /* @__PURE__ */ new Date();
+      pickerEndTime.value = (range == null ? void 0 : range.endTime) || new Date(Date.now() + 60 * 60 * 1e3);
+      showTimeRangePicker.value = true;
+    };
+    const confirmTimeRange = () => {
+      if (!value.value.timeRange) {
+        return;
+      }
+      update({
+        timeRanges: (0, import_utils.extend)({}, value.value.timeRanges, {
+          [value.value.timeRange]: {
+            startTime: pickerStartTime.value,
+            endTime: pickerEndTime.value
+          }
+        })
+      });
+      showTimeRangePicker.value = false;
+    };
+    const toggleProjects = () => update({
+      projectIds: allProjectsSelected.value ? [] : projectOptions.value.filter((option) => !option.disabled).map((option) => option.value)
+    });
+    const stopProjectDrag = () => {
+      if (!draggingProjectId.value) {
+        return;
+      }
+      draggingProjectId.value = void 0;
+      dragPointerId = void 0;
+      suppressProjectSelection.value = true;
+      window.setTimeout(() => {
+        suppressProjectSelection.value = false;
+      }, 0);
+      document.removeEventListener("pointermove", onProjectDragMove);
+      document.removeEventListener("pointerup", stopProjectDrag);
+      document.removeEventListener("pointercancel", stopProjectDrag);
+    };
+    onProjectDragMove = (event) => {
+      var _a;
+      if (dragPointerId !== event.pointerId || !draggingProjectId.value) {
+        return;
+      }
+      const target = (_a = document.elementFromPoint(event.clientX, event.clientY)) == null ? void 0 : _a.closest(`.${bem("project-item")}`);
+      const targetId = target == null ? void 0 : target.dataset.projectId;
+      const currentIndex = projectOptions.value.findIndex((option) => option.value === draggingProjectId.value);
+      const targetIndex = projectOptions.value.findIndex((option) => option.value === targetId);
+      if (currentIndex === -1 || targetIndex === -1 || currentIndex === targetIndex) {
+        return;
+      }
+      const options = [...projectOptions.value];
+      const [project] = options.splice(currentIndex, 1);
+      const nextTargetIndex = options.findIndex((option) => option.value === targetId);
+      const targetRect = target == null ? void 0 : target.getBoundingClientRect();
+      const insertAfter = targetRect ? event.clientY > targetRect.top + targetRect.height / 2 : false;
+      const insertIndex = nextTargetIndex + (insertAfter ? 1 : 0);
+      if (insertIndex === currentIndex) {
+        return;
+      }
+      options.splice(insertIndex, 0, project);
+      projectOptions.value = options;
+      emit("reorder", options);
+    };
+    const startProjectDrag = (event, option) => {
+      if (option.disabled || event.button !== 0) {
+        return;
+      }
+      event.preventDefault();
+      event.stopPropagation();
+      dragPointerId = event.pointerId;
+      draggingProjectId.value = option.value;
+      document.addEventListener("pointermove", onProjectDragMove);
+      document.addEventListener("pointerup", stopProjectDrag);
+      document.addEventListener("pointercancel", stopProjectDrag);
+    };
+    (0, import_vue.onBeforeUnmount)(stopProjectDrag);
+    const reset = () => {
+      const nextValue = defaultValue();
+      emit("update:modelValue", nextValue);
+      emit("reset", nextValue);
+    };
+    const confirm = () => {
+      emit("confirm", value.value);
+      close();
+    };
+    const renderFilterTags = (options, selected, onUpdate, multiple = false) => (0, import_vue.createVNode)("div", {
+      "class": bem("tags")
+    }, [options.map((option) => (0, import_vue.createVNode)(import_filter_tag.FilterTag, {
+      "key": option.value,
+      "selected": option.value === "all" ? selected.length === 0 || selected.includes("all") : selected.includes(option.value),
+      "disabled": option.disabled,
+      "onClick": () => {
+        if (!option.disabled) {
+          if (!multiple) {
+            onUpdate([option.value]);
+          } else if (option.value === "all") {
+            onUpdate([]);
+          } else {
+            const values = selected.filter((value2) => value2 !== "all");
+            onUpdate(values.includes(option.value) ? values.filter((value2) => value2 !== option.value) : [...values, option.value]);
+          }
+        }
+      }
+    }, {
+      default: () => [option.label]
+    }))]);
+    const renderSection = (title, content) => (0, import_vue.createVNode)("section", {
+      "class": bem("section")
+    }, [(0, import_vue.createVNode)(import_blue_mark.BlueMarkHeader, {
+      "title": title
+    }, null), content()]);
+    const renderProjects = () => props.showProjects && renderSection("\u5168\u90E8\u9879\u76EE", () => (0, import_vue.createVNode)(import_vue.Fragment, null, [(0, import_vue.createVNode)("button", {
+      "type": "button",
+      "class": bem("select-all"),
+      "onClick": toggleProjects
+    }, [allProjectsSelected.value ? "\u53D6\u6D88\u5168\u9009" : "\u5168\u9009"]), (0, import_vue.createVNode)(import_checkbox_group.CheckboxGroup, {
+      "modelValue": projectIds.value,
+      "class": bem("card"),
+      "onUpdate:modelValue": (projectIds2) => update({
+        projectIds: projectIds2
+      })
+    }, {
+      default: () => [(0, import_vue.createVNode)(import_vue.TransitionGroup, {
+        "name": "van-work-order-filter__project",
+        "tag": "div"
+      }, {
+        default: () => [projectOptions.value.map((option) => (0, import_vue.createVNode)("div", {
+          "key": option.value,
+          "class": bem("project-item", {
+            dragging: draggingProjectId.value === option.value
+          }),
+          "data-project-id": option.value
+        }, [(0, import_vue.createVNode)(import_cell.Cell, {
+          "title": option.label,
+          "size": "normal",
+          "border": true,
+          "clickable": !option.disabled,
+          "onClick": () => {
+            if (suppressProjectSelection.value) {
+              return;
+            }
+            const selected = projectIds.value.includes(option.value);
+            update({
+              projectIds: selected ? projectIds.value.filter((id) => id !== option.value) : [...projectIds.value, option.value]
+            });
+          }
+        }, {
+          icon: () => (0, import_vue.createVNode)("span", {
+            "class": bem("drag-handle"),
+            "onPointerdown": (event) => startProjectDrag(event, option)
+          }, [(0, import_vue.createVNode)(import_icon.Icon, {
+            "name": "wap-nav"
+          }, null)]),
+          "right-icon": () => (0, import_vue.createVNode)(import_checkbox.Checkbox, {
+            "name": option.value,
+            "size": "normal",
+            "disabled": option.disabled,
+            "onClick": (event) => event.stopPropagation()
+          }, null)
+        })]))]
+      })]
+    })]));
+    const sections = {
+      projects: renderProjects,
+      sort: () => props.showSort && renderSection("\u6392\u5E8F\u65B9\u5F0F", () => (0, import_vue.createVNode)("div", {
+        "class": bem("sort-cards")
+      }, [(0, import_vue.createVNode)("div", {
+        "class": bem("card")
+      }, [(0, import_vue.createVNode)(import_cell.Cell, {
+        "title": "\u4F18\u5148\u6309\u9879\u76EE\u987A\u5E8F\u6392\u5E8F",
+        "size": "normal",
+        "border": true,
+        "leftSelect": value.value.prioritizeProjects,
+        "onUpdate:leftSelect": (prioritizeProjects) => update({
+          prioritizeProjects
+        })
+      }, null)]), (0, import_vue.createVNode)("div", {
+        "class": bem("card")
+      }, [props.sortOptions.map((option) => (0, import_vue.createVNode)(import_cell.Cell, {
+        "key": option.value,
+        "title": option.label,
+        "size": "normal",
+        "border": true,
+        "rightSelect": value.value.sort === option.value,
+        "selectType": "radio",
+        "onUpdate:rightSelect": (selected) => selected && update({
+          sort: option.value
+        })
+      }, null))])])),
+      "time-range": () => props.showTimeRange && renderSection("\u65F6\u95F4\u6BB5\u9009\u62E9", () => (0, import_vue.createVNode)(import_vue.Fragment, null, [renderFilterTags(props.timeOptions, [value.value.timeRange], ([timeRange]) => update({
+        timeRange
+      })), value.value.timeRange && (0, import_vue.createVNode)(import_cell.Cell, {
+        "class": bem("time-trigger"),
+        "title": "\u9009\u62E9\u65F6\u95F4\u6BB5",
+        "label": selectedTimeRangeText.value,
+        "isLink": true,
+        "clickable": true,
+        "onClick": openTimeRangePicker
+      }, null)])),
+      custom: () => slots.default && (0, import_vue.createVNode)("div", {
+        "class": bem("custom")
+      }, [slots.default()]),
+      reminder: () => props.showReminder && renderSection("\u903E\u671F\u60C5\u51B5", () => renderFilterTags(props.reminderOptions, [value.value.reminder], ([reminder]) => update({
+        reminder
+      }))),
+      relation: () => props.showRelation && renderSection("\u5173\u8054\u9886\u6599/\u9000\u6599\u7533\u8BF7", () => renderFilterTags(props.relationOptions, [value.value.relation], ([relation]) => update({
+        relation
+      }))),
+      "work-order-types": () => props.showWorkOrderTypes && renderSection("\u5DE5\u5355\u72B6\u6001", () => renderFilterTags(props.workOrderTypes, value.value.workOrderTypes, (workOrderTypes) => update({
+        workOrderTypes
+      }), true)),
+      "work-types": () => props.showWorkTypes && renderSection("\u5DE5\u4F5C\u7C7B\u578B", () => renderFilterTags(props.workTypes, value.value.workTypes, (workTypes) => update({
+        workTypes
+      }), true))
+    };
+    return () => (0, import_vue.createVNode)(import_action_sheet.ActionSheet, {
+      "show": props.show,
+      "class": bem(),
+      "closeOnClickOverlay": false,
+      "onUpdate:show": (show) => emit("update:show", show)
+    }, {
+      default: () => [(0, import_vue.createVNode)(import_nav_bar.NavBar, {
+        "title": props.title,
+        "class": bem("nav")
+      }, {
+        left: () => (0, import_vue.createVNode)(import_icon.Icon, {
+          "name": "cross",
+          "size": "22",
+          "onClick": close
+        }, null)
+      }), (0, import_vue.createVNode)("div", {
+        "class": bem("body")
+      }, [props.sectionOrder.map((section) => {
+        var _a;
+        return (_a = sections[section]) == null ? void 0 : _a.call(sections);
+      })]), (0, import_vue.createVNode)("div", {
+        "class": bem("footer")
+      }, [(0, import_vue.createVNode)(import_bottom_action_bar.BottomActionBar, {
+        "secondaryText": props.resetText,
+        "confirmText": props.confirmText,
+        "showCheckboxAction": true,
+        "checkboxActionChecked": value.value.saveAsDefault,
+        "checkboxActionText": props.saveText,
+        "fixed": false,
+        "safeAreaInsetBottom": false,
+        "onUpdate:checkboxActionChecked": (saveAsDefault) => update({
+          saveAsDefault
+        }),
+        "onSecondary": reset,
+        "onConfirm": confirm
+      }, null)]), (0, import_vue.createVNode)(import_vue.Transition, {
+        "name": "van-work-order-filter__time-picker"
+      }, {
+        default: () => [showTimeRangePicker.value && (0, import_vue.createVNode)("div", {
+          "class": bem("time-picker-overlay"),
+          "onClick": () => {
+            showTimeRangePicker.value = false;
+          }
+        }, [(0, import_vue.createVNode)("div", {
+          "class": bem("time-picker-panel"),
+          "onClick": (event) => event.stopPropagation()
+        }, [(0, import_vue.createVNode)(import_datetime_picker.DatetimePicker, {
+          "type": "datetime",
+          "title": "\u9009\u62E9\u65F6\u95F4\u6BB5",
+          "showTimeRange": true,
+          "minDate": minTimeRangeDate,
+          "maxDate": maxTimeRangeDate,
+          "startTime": pickerStartTime.value,
+          "endTime": pickerEndTime.value,
+          "onUpdate:startTime": (startTime) => {
+            pickerStartTime.value = startTime;
+          },
+          "onUpdate:endTime": (endTime) => {
+            pickerEndTime.value = endTime;
+          },
+          "onCancel": () => {
+            showTimeRangePicker.value = false;
+          },
+          "onConfirm": confirmTimeRange
+        }, null)])])]
+      })]
+    });
+  }
+});

package/lib/work-order-filter/index.css

@@ -0,0 +1 @@
+:root{--van-work-order-filter-background-color: var(--van-white);--van-work-order-filter-card-color: var(--van-gray-2)}.van-work-order-filter{display:flex;flex-direction:column;height:calc(100vh - 96px);max-height:calc(100vh - 96px);overflow:hidden;background:var(--van-work-order-filter-background-color)}.van-work-order-filter>.van-action-sheet__content{display:flex;flex:1;flex-direction:column;min-height:0;overflow:hidden}.van-work-order-filter__nav{flex:none;--van-nav-bar-background-color: var(--van-white)}.van-work-order-filter__nav .van-nav-bar__left--slot{padding:0 12px}.van-work-order-filter__body{flex:1;min-height:0;padding-bottom:var(--van-padding-md);overflow-y:auto}.van-work-order-filter__section{position:relative}.van-work-order-filter__section .van-blue-mark-header{padding:var(--van-padding-md) 22px var(--van-padding-xs)}.van-work-order-filter__custom{width:100%}.van-work-order-filter__select-all{position:absolute;top:var(--van-padding-md);right:22px;padding:0;color:var(--van-primary-color);font-size:var(--van-font-size-md);font-weight:var(--van-font-weight-bold);line-height:var(--van-line-height-lg);background:transparent;border:0}.van-work-order-filter__card{margin:0 var(--van-padding-md);overflow:hidden;background:var(--van-work-order-filter-card-color);border-radius:8px;--van-cell-border-color: #e1e5eb}.van-work-order-filter__card .van-cell{min-height:44px;background:transparent}.van-work-order-filter__card .van-checkbox,.van-work-order-filter__card .van-radio{margin:0}.van-work-order-filter__project-list{width:100%}.van-work-order-filter__project-item{position:relative;touch-action:pan-y;transition:transform .16s cubic-bezier(.2,0,0,1)}.van-work-order-filter__project-item--dragging{z-index:1;opacity:.82;box-shadow:0 4px 12px rgba(27,33,41,.16);transition:none}.van-work-order-filter__project-move{transition:transform .16s cubic-bezier(.2,0,0,1)}.van-work-order-filter__drag-handle{display:flex;align-items:center;justify-content:center;width:16px;height:var(--van-cell-line-height);margin-right:var(--van-padding-base);color:var(--van-text-color);cursor:grab;touch-action:none}.van-work-order-filter__drag-handle:active{cursor:grabbing}.van-work-order-filter__sort-cards{display:flex;flex-direction:column;gap:10px}.van-work-order-filter__tags{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--van-padding-xs);margin:0 var(--van-padding-md)}.van-work-order-filter__tags .van-filter-tag{width:100%;min-width:0;text-align:center}.van-work-order-filter__time-trigger{width:auto;margin:var(--van-padding-xs) var(--van-padding-md) 0;background:var(--van-work-order-filter-card-color);border-radius:8px}.van-work-order-filter__time-trigger .van-cell__label{white-space:nowrap}.van-work-order-filter__time-picker-overlay{position:absolute;z-index:10;inset:0;display:flex;align-items:flex-end;background:rgba(0,0,0,.45)}.van-work-order-filter__time-picker-panel{width:100%;overflow:hidden;background:var(--van-white);border-radius:16px 16px 0 0}.van-work-order-filter__time-picker-enter-active,.van-work-order-filter__time-picker-leave-active{transition:opacity var(--van-animation-duration-base) var(--van-animation-timing-function-enter)}.van-work-order-filter__time-picker-enter-active .van-work-order-filter__time-picker-panel,.van-work-order-filter__time-picker-leave-active .van-work-order-filter__time-picker-panel{transition:transform var(--van-animation-duration-base) var(--van-animation-timing-function-enter)}.van-work-order-filter__time-picker-leave-active,.van-work-order-filter__time-picker-leave-active .van-work-order-filter__time-picker-panel{transition-timing-function:var(--van-animation-timing-function-leave)}.van-work-order-filter__time-picker-enter-from,.van-work-order-filter__time-picker-leave-to{opacity:0}.van-work-order-filter__time-picker-enter-from .van-work-order-filter__time-picker-panel,.van-work-order-filter__time-picker-leave-to .van-work-order-filter__time-picker-panel{transform:translate3d(0,100%,0)}.van-work-order-filter__footer{flex:none}