@glodon-aiot/dataset-annotation 3.24.0-alpha.6 → 3.25.0-alpha.7

package/dist/es/components/OcrAnnotation/index.mjs

@@ -1,98 +1,99 @@
-var ze = Object.defineProperty, Ke = Object.defineProperties;
-var Ae = Object.getOwnPropertyDescriptors;
-var de = Object.getOwnPropertySymbols;
-var Be = Object.prototype.hasOwnProperty, Ee = Object.prototype.propertyIsEnumerable;
-var ue = (h, l, i) => l in h ? ze(h, l, { enumerable: !0, configurable: !0, writable: !0, value: i }) : h[l] = i, m = (h, l) => {
+var Be = Object.defineProperty, Ee = Object.defineProperties;
+var Ue = Object.getOwnPropertyDescriptors;
+var he = Object.getOwnPropertySymbols;
+var $e = Object.prototype.hasOwnProperty, Ze = Object.prototype.propertyIsEnumerable;
+var pe = (b, l, i) => l in b ? Be(b, l, { enumerable: !0, configurable: !0, writable: !0, value: i }) : b[l] = i, h = (b, l) => {
   for (var i in l || (l = {}))
-    Be.call(l, i) && ue(h, i, l[i]);
-  if (de)
-    for (var i of de(l))
-      Ee.call(l, i) && ue(h, i, l[i]);
-  return h;
-}, g = (h, l) => Ke(h, Ae(l));
-import { jsx as c, jsxs as M } from "react/jsx-runtime";
-import { useState as s, useEffect as x } from "react";
-import { message as K, ConfigProvider as Ue, Space as y, Select as Fe, Dropdown as $e, Tooltip as Ze, Button as Q, Tabs as je, Row as We, Col as _e, Pagination as He, Modal as Je } from "antd";
-import Qe from "antd/es/locale/zh_CN";
+    $e.call(l, i) && pe(b, i, l[i]);
+  if (he)
+    for (var i of he(l))
+      Ze.call(l, i) && pe(b, i, l[i]);
+  return b;
+}, g = (b, l) => Ee(b, Ue(l));
+import { jsx as c, jsxs as T } from "react/jsx-runtime";
+import { useState as d, useRef as X, useEffect as C } from "react";
+import { message as B, ConfigProvider as je, Space as w, Select as qe, Dropdown as We, Tooltip as _e, Button as Y, Tabs as He, Row as Je, Col as Qe, Pagination as Ge, Modal as Xe } from "antd";
+import Ye from "antd/es/locale/zh_CN";
 import "./style.less.mjs";
-import qe from "./OcrModal/index.mjs";
-import Ge from "./MarkKVOCRModal/index.mjs";
-import Xe from "./MarkOCRBoxModal/index.mjs";
-import Ye from "./PreLabelOCR/index.mjs";
-import et from "lodash/merge";
-import { UploadZipsStatus as fe, PreLabelTaskStatus as tt } from "@glodon-aiot/apis";
-import nt from "../../Common/Page/index.mjs";
-import ot from "../Thumbnail/index.mjs";
-import rt from "../DataEmpty/index.mjs";
-import it from "../../DatasetContext/index.mjs";
-import { DEFAULT_FILTER_SWITCH as ct } from "../../constant.mjs";
-import lt from "../PageNav/index.mjs";
-import { DownOutlined as at } from "@ant-design/icons";
-import st from "../DetectionStatus/index.mjs";
-const Vt = (h) => {
+import et from "./OcrModal/index.mjs";
+import tt from "./MarkKVOCRModal/index.mjs";
+import nt from "./MarkOCRBoxModal/index.mjs";
+import rt from "./PreLabelOCR/index.mjs";
+import ot from "lodash/merge";
+import { UploadZipsStatus as ge, PreLabelTaskStatus as it } from "@glodon-aiot/apis";
+import ct from "../../Common/Page/index.mjs";
+import lt from "../Thumbnail/index.mjs";
+import at from "../DataEmpty/index.mjs";
+import st from "../../DatasetContext/index.mjs";
+import { DEFAULT_FILTER_SWITCH as dt } from "../../constant.mjs";
+import ut from "../PageNav/index.mjs";
+import { DownOutlined as ft } from "@ant-design/icons";
+import mt from "../DetectionStatus/index.mjs";
+import { scrollSampleIntoView as ht } from "../../utils/scrollSampleIntoView.mjs";
+const At = (b) => {
   const {
     services: l,
     datasetId: i,
-    versionId: A,
-    backTo: pe,
-    labelManager: me = !1,
-    datasetManager: D = !1,
-    annotation: he,
+    versionId: E,
+    backTo: be,
+    labelManager: Ce = !1,
+    datasetManager: v = !1,
+    annotation: ke,
     header: p = {
       versionSelect: !1
     },
-    exampleSrcRoot: ge
-  } = h, B = !!(D && D.label), [r, be] = s(), [t, E] = s(), [v, Ce] = s([]), [q, G] = s(!1), [L, V] = s(!1), [T, X] = s(0), [u, P] = s(), [k, b] = s(), [Y, O] = s(), [U, I] = s(-1), [a, S] = s({
+    exampleSrcRoot: Se
+  } = b, U = !!(v && v.label), [o, xe] = d(), [t, $] = d(), [V, Me] = d([]), [ee, te] = d(!1), [x, L] = d(!1), [I, ne] = d(0), [u, P] = d(), [m, k] = d(), [re, O] = d(), [Z, y] = d(-1), oe = X(null), N = X(void 0), D = X(!1), [f, M] = d({
     current: 1,
     pageSize: 50
-  }), [R, ee] = s(0), [te, ne] = s(0), [C, F] = s(""), [oe, $] = s(!1), [re, ie] = s(), [Z, ce] = s(!1), [N, j] = s(null), [ke, le] = s(!1), [Se, xe] = s(!1), [W, Me] = s(""), [_, z] = s("preview"), H = m({}, ct);
-  et(H, h.filterSwitch);
-  const Te = () => {
-    O(void 0), (r == null ? void 0 : r.ocrMarkTmpl) === "StructKVCOCR" ? $(!0) : (z("annotation"), V(!0), F("nocode"));
-  }, Ie = (e, n) => {
-    S({
+  }), [z, ie] = d(0), [A, ce] = d(0), [S, j] = d(""), [le, q] = d(!1), [ae, se] = d(), [W, de] = d(!1), [K, _] = d(null), [Te, ue] = d(!1), [Ie, ye] = d(!1), [H, De] = d(""), [J, F] = d("preview"), Q = h({}, dt);
+  ot(Q, b.filterSwitch);
+  const we = () => {
+    O(void 0), (o == null ? void 0 : o.ocrMarkTmpl) === "StructKVCOCR" ? q(!0) : (F("annotation"), L(!0), j("nocode"));
+  }, ve = (e, n) => {
+    M({
       current: e,
       pageSize: n
     });
-  }, ye = (e) => {
+  }, Re = (e) => {
     if (!u)
       return;
-    I(e);
+    y(e);
     const n = u[e];
-    b(n), z("preview"), V(!0);
+    k(n), F("preview"), L(!0);
   };
-  x(() => {
-    i && (G(!0), Promise.all([
+  C(() => {
+    i && (te(!0), Promise.all([
       // 数据集
       l.cvforceDatahub.getDatasetsId(i).then((e) => {
-        be(e);
+        xe(e);
       }),
       // 版本列表
       l.cvforceDatahub.getDatasetsIdVersions(i, 1, 1e3).then((e) => {
-        Ce(e.recordList), E(A ? e.recordList.find((n) => n.id === A) : e.recordList[0]);
+        Me(e.recordList), $(E ? e.recordList.find((n) => n.id === E) : e.recordList[0]);
       })
-    ]).finally(() => G(!1)));
-  }, [i, A]);
-  const De = () => {
+    ]).finally(() => te(!1)));
+  }, [i, E]);
+  const Ve = () => {
     !i || !t || l.cvforceDatahub.getDatasetsIdVersionsVid(i, t.id).then((e) => {
-      Me(e.versionAsyncTask.state);
+      De(e.versionAsyncTask.state);
     });
   };
-  x(() => {
-    De();
-  }, [i, t == null ? void 0 : t.id]), x(() => {
-    W !== fe.Pending && W !== fe.Started || K.warning("文件导入中，请刷新页面再试");
-  }, [W]);
-  const ae = () => {
+  C(() => {
+    Ve();
+  }, [i, t == null ? void 0 : t.id]), C(() => {
+    H !== ge.Pending && H !== ge.Started || B.warning("文件导入中，请刷新页面再试");
+  }, [H]);
+  const fe = () => {
     !i || !t || l.cvforceDatahub.getDatasetsIdVersionsVidLabelcount(i, t.id, {
       label: "allcode",
       confirmStatus: 2
     }).then((e) => {
-      const n = e.find((d) => d.id === "allcodeid"), o = e.find((d) => d.id === "nocodeid"), f = e.find((d) => d.id === "pendingid");
-      X(n ? n.count : 0), ee(o ? o.count : 0), ne(f ? f.count : 0);
+      const n = e.find((s) => s.id === "allcodeid"), r = e.find((s) => s.id === "nocodeid"), a = e.find((s) => s.id === "pendingid");
+      ne(n ? n.count : 0), ie(r ? r.count : 0), ce(a ? a.count : 0);
     });
-  }, we = () => {
-    switch (C) {
+  }, Le = () => {
+    switch (S) {
       case "nocode":
       case "hascode":
         return 0;
@@ -101,8 +102,8 @@ const Vt = (h) => {
       default:
         return 2;
     }
-  }, ve = () => {
-    switch (C) {
+  }, Pe = () => {
+    switch (S) {
       case "nocode":
         return "nocode";
       case "pending":
@@ -112,198 +113,225 @@ const Vt = (h) => {
       default:
         return;
     }
-  }, w = () => {
-    const e = a.current || 1, n = a.pageSize || 50;
-    !i || !t || (l.cvforceDatahub.getDatasetsIdVersionsVidSamples(i, t.id, {
-      labels: ve(),
+  }, R = () => {
+    const e = f.current || 1, n = f.pageSize || 50;
+    if (!i || !t) {
+      D.current = !1;
+      return;
+    }
+    l.cvforceDatahub.getDatasetsIdVersionsVidSamples(i, t.id, {
+      labels: Pe(),
       pageNo: e,
       pageSize: n,
-      confirmStatus: we()
-    }).then((o) => {
-      const f = o.recordList || [];
-      if (!f.length && o.totalResults > 0) {
-        S(g(m({}, a), {
-          current: Math.ceil(o.totalResults / n)
-        })), Math.ceil(o.totalResults / n) === e && P([]);
+      confirmStatus: Le()
+    }).then((r) => {
+      const a = r.recordList || [];
+      if (!a.length && r.totalResults > 0) {
+        M((s) => g(h({}, s), {
+          current: Math.ceil(r.totalResults / n)
+        })), Math.ceil(r.totalResults / n) === e && P([]);
         return;
       }
-      if (P(f), S(g(m({}, a), {
-        total: o.totalResults
-      })), a.type === "next" && f.length) {
-        I(0);
-        const d = o.recordList[0];
-        b(d);
+      if (P(a), M((s) => g(h({}, s), {
+        total: r.totalResults
+      })), f.type === "next" && a.length) {
+        y(0);
+        const s = r.recordList[0];
+        k(s);
       }
-      if (a.type === "prev" && f.length) {
-        I(a.pageSize - 1);
-        const d = o.recordList[a.pageSize - 1];
-        b(d);
+      if (f.type === "prev" && a.length) {
+        y(f.pageSize - 1);
+        const s = r.recordList[f.pageSize - 1];
+        k(s);
       }
-    }), ae());
+    }).finally(() => {
+      D.current = !1;
+    }), fe();
   };
-  x(w, [a.current, a.pageSize, C, re, t == null ? void 0 : t.id, i]);
-  const Le = () => {
+  C(R, [f.current, f.pageSize, S, ae, t == null ? void 0 : t.id, i]);
+  const Oe = () => {
     if (!u)
       return;
-    const e = U + 1;
+    const e = Z + 1;
     if (e >= u.length) {
-      let n = T;
-      C === "hascode" && (n = T - R), C === "nocode" && (n = R), C === "pending" && (n = te), (a.current - 1) * a.pageSize + e >= n ? K.error("已经是最后一个了") : S({
-        current: a.current + 1,
-        pageSize: a.pageSize,
-        type: "next"
-      });
+      let n = I;
+      if (S === "hascode" && (n = I - z - A), S === "nocode" && (n = z), S === "pending" && (n = A), (f.current - 1) * f.pageSize + e >= n)
+        B.error("已经是最后一个了");
+      else {
+        if (D.current)
+          return;
+        D.current = !0, M((a) => g(h({}, a), {
+          current: a.current + 1,
+          type: "next"
+        }));
+      }
     } else {
-      I(e);
+      y(e);
       const n = u[e];
-      b(n);
+      k(n);
     }
-  }, Ve = () => {
+  }, Ne = () => {
     if (!u)
       return;
-    const e = U - 1;
+    const e = Z - 1;
     if (e < 0)
-      (a.current - 1) * a.pageSize + e < 0 ? K.error("已经是第一个了") : S({
-        current: a.current - 1,
-        pageSize: a.pageSize,
-        type: "prev"
-      });
+      if ((f.current - 1) * f.pageSize + e < 0)
+        B.error("已经是第一个了");
+      else {
+        if (D.current)
+          return;
+        D.current = !0, M((r) => g(h({}, r), {
+          current: r.current - 1,
+          type: "prev"
+        }));
+      }
     else {
-      I(e);
+      y(e);
       const n = u[e];
-      b(n);
+      k(n);
     }
   };
-  x(() => {
+  C(() => {
     if (!i) {
-      N && (clearTimeout(N), j(null)), ie(void 0);
+      K && (clearTimeout(K), _(null)), se(void 0);
       return;
     }
-    J();
-  }, [t == null ? void 0 : t.id]), x(() => {
-    J();
-  }, [Se]);
-  const J = () => {
+    G();
+  }, [t == null ? void 0 : t.id]), C(() => {
+    G();
+  }, [Ie]);
+  const G = () => {
     !i || !t || l.cvforceDatahub.getPreLabelTask(i, t.id).then((e) => {
       const n = e[0];
-      if (ie(n), N && (clearTimeout(N), j(null)), !(n != null && n.state) || n.state !== tt.Started) {
-        ce(!1);
+      if (se(n), K && (clearTimeout(K), _(null)), !(n != null && n.state) || n.state !== it.Started) {
+        de(!1);
         return;
       } else
-        ce(!0);
-      j(setTimeout(() => {
-        J();
+        de(!0);
+      _(setTimeout(() => {
+        G();
       }, 1e4));
     });
-  }, Pe = [{
+  }, ze = [{
     key: "",
-    label: `全部（${T}）`,
+    label: `全部（${I}）`,
     children: null
   }, {
     key: "nocode",
-    label: `未标注（${R}）`,
+    label: `未标注（${z}）`,
     children: null
   }, {
     key: "pending",
-    label: `待确认（${te}）`,
+    label: `待确认（${A}）`,
     children: null
   }, {
     key: "hascode",
-    label: `已标注（${T - R}）`,
+    label: `已标注（${I - z - A}）`,
     children: null
   }];
-  x(() => {
-    L || ((r == null ? void 0 : r.ocrMarkTmpl) === "StructKVCOCR" ? b(void 0) : (_ === "annotation" && w(), b(void 0), I(-1), O(void 0), z("preview")));
-  }, [L, _]), x(() => {
-    r && (r.markType !== "ocr" || (r == null ? void 0 : r.ocrMarkTmpl) !== "DetectionOCR") && console.error(`当前数据集不是DetectionOCR(ocr检测)类型，请检查数据集类型。
+  C(() => {
+    !x || !(m != null && m.id) || (N.current = m.id);
+  }, [x, m == null ? void 0 : m.id]), C(() => {
+    const e = N.current;
+    if (x || !e || !(u != null && u.length))
+      return;
+    const n = requestAnimationFrame(() => {
+      var a;
+      ht((a = oe.current) == null ? void 0 : a.querySelector(".d-right"), e) && (N.current = void 0);
+    });
+    return () => cancelAnimationFrame(n);
+  }, [x, u]), C(() => {
+    x || ((o == null ? void 0 : o.ocrMarkTmpl) === "StructKVCOCR" ? k(void 0) : (J === "annotation" && R(), k(void 0), y(-1), O(void 0), F("preview")));
+  }, [x, J]), C(() => {
+    o && (o.markType !== "ocr" || (o == null ? void 0 : o.ocrMarkTmpl) !== "DetectionOCR") && console.error(`当前数据集不是DetectionOCR(ocr检测)类型，请检查数据集类型。
 请检查markType是否为ocr并且ocrMarkTmpl为DetectionOCR。`);
-  }, [r]);
-  const Oe = (r == null ? void 0 : r.ocrMarkTmpl) === "StructKVCOCR" ? Ge : Xe, Re = () => {
+  }, [o]);
+  const Ae = (o == null ? void 0 : o.ocrMarkTmpl) === "StructKVCOCR" ? tt : nt, Ke = () => {
     if (console.log("一键确认", l, t), !(l != null && l.cvforceDatahub) || !(t != null && t.id))
       return Promise.resolve(!1);
-    Je.confirm({
+    Xe.confirm({
       title: "一键保存所有标注？",
       content: "待确认的所有带预标注信息的图片将保存至已标注页签下",
       onOk: () => {
         l.cvforceDatahub.getAllConfirmSamples(i, t.id).then((e) => {
-          K.success("保存成功"), S(g(m({}, a), {
+          B.success("保存成功"), M(g(h({}, f), {
             current: 1
-          })), ae(), w();
+          })), fe(), R();
         });
       }
     });
-  }, se = !k && !!(D && D.preLabel) && !!(t != null && t.id), Ne = B || se;
-  return /* @__PURE__ */ c(Ue, {
-    locale: Qe,
-    children: /* @__PURE__ */ c(it.Provider, {
+  }, me = !m && !!(v && v.preLabel) && !!(t != null && t.id), Fe = U || me;
+  return /* @__PURE__ */ c(je, {
+    locale: Ye,
+    children: /* @__PURE__ */ c(st.Provider, {
       value: {
         datasetId: i,
         versionId: (t == null ? void 0 : t.id) || "",
         no: (t == null ? void 0 : t.no) || "",
-        loading: q,
+        loading: ee,
         version: t,
-        versions: v,
+        versions: V,
         samples: u,
-        pagination: a,
+        pagination: f,
         services: l,
         featuresConfig: {
-          labelManager: me,
-          datasetManager: D,
-          annotation: he,
-          filterSwitch: H,
+          labelManager: Ce,
+          datasetManager: v,
+          annotation: ke,
+          filterSwitch: Q,
           header: p,
-          exampleSrcRoot: ge
+          exampleSrcRoot: Se
         }
       },
-      children: r ? r.markType === "ocr" ? /* @__PURE__ */ M("div", {
+      children: o ? o.markType === "ocr" ? /* @__PURE__ */ T("div", {
         className: "ocr-version-detail",
-        children: [/* @__PURE__ */ M(nt, {
+        children: [/* @__PURE__ */ T(ct, {
           className: "product-details-page",
-          header: p === !1 ? void 0 : /* @__PURE__ */ c(lt, {
-            backTo: pe,
+          header: p === !1 ? void 0 : /* @__PURE__ */ c(ut, {
+            backTo: be,
             onBackClick: p != null && p.onBackClick ? () => {
               p.onBackClick && p.onBackClick();
             } : void 0,
-            left: !q && /* @__PURE__ */ M(y, {
+            left: !ee && /* @__PURE__ */ T(w, {
               children: [/* @__PURE__ */ c("span", {
                 style: {
                   fontWeight: "bold"
                 },
-                children: r == null ? void 0 : r.name
-              }), /* @__PURE__ */ c(Fe, {
+                children: o == null ? void 0 : o.name
+              }), /* @__PURE__ */ c(qe, {
                 disabled: (p == null ? void 0 : p.versionSelect) === !1,
                 value: t == null ? void 0 : t.id,
                 style: {
                   width: 70
                 },
-                options: v.map((e) => ({
+                options: V.map((e) => ({
                   label: e.no,
                   value: e.id
                 })),
                 onChange: (e) => {
-                  const n = v.find((f) => f.id === e);
-                  if (!r || !n)
+                  const n = V.find((a) => a.id === e);
+                  if (!o || !n)
                     return;
-                  const o = v.find((f) => f.id === n.id);
-                  E(o), p != null && p.onVersionChange && p.onVersionChange(o);
+                  const r = V.find((a) => a.id === n.id);
+                  $(r), p != null && p.onVersionChange && p.onVersionChange(r);
                 }
               })]
             }),
-            right: /* @__PURE__ */ c(y, {
-              children: Ne && /* @__PURE__ */ c($e, {
+            right: /* @__PURE__ */ c(w, {
+              children: Fe && /* @__PURE__ */ c(We, {
                 menu: {
-                  items: [...B ? [{
+                  items: [...U ? [{
                     key: "manual",
-                    label: /* @__PURE__ */ c(y, {
-                      children: /* @__PURE__ */ c(Ze, {
+                    label: /* @__PURE__ */ c(w, {
+                      children: /* @__PURE__ */ c(_e, {
                         title: "预标注进行中，请任务完成后再试",
-                        open: ke,
-                        children: /* @__PURE__ */ c(Q, {
+                        open: Te,
+                        children: /* @__PURE__ */ c(Y, {
                           type: "text",
-                          disabled: !T || (r == null ? void 0 : r.ocrMarkTmpl) !== "StructKVCOCR" && (r == null ? void 0 : r.ocrMarkTmpl) !== "DetectionOCR" || Z,
-                          onClick: Te,
-                          onMouseEnter: () => Z && le(!0),
-                          onMouseLeave: () => le(!1),
+                          disabled: !I || (o == null ? void 0 : o.ocrMarkTmpl) !== "StructKVCOCR" && (o == null ? void 0 : o.ocrMarkTmpl) !== "DetectionOCR" || W,
+                          onClick: we,
+                          onMouseEnter: () => W && ue(!0),
+                          onMouseLeave: () => ue(!1),
                           style: {
                             marginRight: "10px"
                           },
@@ -311,71 +339,73 @@ const Vt = (h) => {
                         })
                       })
                     })
-                  }] : [], se ? {
+                  }] : [], me ? {
                     key: "auto",
-                    label: /* @__PURE__ */ c(Ye, {
+                    label: /* @__PURE__ */ c(rt, {
                       buttonType: "text",
                       datasetId: i,
                       versionId: (t == null ? void 0 : t.id) || "",
-                      disabled: !T || (r == null ? void 0 : r.ocrMarkTmpl) !== "DetectionOCR",
-                      setIsTaskChange: xe,
-                      preLabelTask: re,
+                      disabled: !I || (o == null ? void 0 : o.ocrMarkTmpl) !== "DetectionOCR",
+                      setIsTaskChange: ye,
+                      preLabelTask: ae,
                       datasetType: "ocr"
                     })
                   } : null]
                 },
                 placement: "bottom",
-                children: /* @__PURE__ */ M(Q, {
+                children: /* @__PURE__ */ T(Y, {
                   type: "primary",
-                  children: ["开始标注", /* @__PURE__ */ c(at, {})]
+                  children: ["开始标注", /* @__PURE__ */ c(ft, {})]
                 })
               })
             })
           }),
-          children: [/* @__PURE__ */ M("div", {
+          children: [/* @__PURE__ */ T("div", {
             className: "ocr-header",
-            children: [/* @__PURE__ */ c(y, {
-              children: H.tabs && /* @__PURE__ */ c(je, {
+            children: [/* @__PURE__ */ c(w, {
+              children: Q.tabs && /* @__PURE__ */ c(He, {
                 className: "header-tab",
-                activeKey: C,
+                activeKey: S,
                 onChange: (e) => {
-                  S(g(m({}, a), {
+                  M(g(h({}, f), {
                     current: 1,
                     total: 0
-                  })), F(e);
+                  })), j(e);
                 },
-                items: Pe
+                items: ze
               })
-            }), /* @__PURE__ */ c(y, {
-              children: C === "pending" && B && /* @__PURE__ */ c(Q, {
+            }), /* @__PURE__ */ c(w, {
+              children: S === "pending" && U && /* @__PURE__ */ c(Y, {
                 type: "primary",
                 className: "pending-confirm-button",
-                onClick: Re,
+                onClick: Ke,
                 children: "一键确认"
               })
             })]
           }), /* @__PURE__ */ c("div", {
             className: "d-row",
-            children: u != null && u.length ? /* @__PURE__ */ M(y, {
+            ref: oe,
+            children: u != null && u.length ? /* @__PURE__ */ T(w, {
               direction: "vertical",
               className: "d-right",
-              children: [/* @__PURE__ */ c(We, {
+              children: [/* @__PURE__ */ c(Je, {
                 gutter: [16, 16],
                 wrap: !0,
                 className: "d-right-row",
-                children: u == null ? void 0 : u.map((e, n) => /* @__PURE__ */ c(_e, {
+                children: u == null ? void 0 : u.map((e, n) => /* @__PURE__ */ c(Qe, {
                   className: "d-right-col",
-                  onClick: () => ye(n),
-                  children: /* @__PURE__ */ M("div", {
+                  "data-sample-id": e.id,
+                  onClick: () => Re(n),
+                  children: /* @__PURE__ */ T("div", {
                     className: "right-col-wrapper",
                     children: [/* @__PURE__ */ c("div", {
                       className: "detection-status-wrapper",
-                      children: /* @__PURE__ */ c(st, {
+                      children: /* @__PURE__ */ c(mt, {
                         sample: e
                       })
                     }), /* @__PURE__ */ c("div", {
                       className: "right-col-img",
-                      children: /* @__PURE__ */ c(ot, {
+                      children: /* @__PURE__ */ c(lt, {
                         fileKey: e.fileKey,
                         width: 124,
                         thumbnailUrl: e.thumbnailUrl
@@ -388,94 +418,97 @@ const Vt = (h) => {
                     })]
                   })
                 }, e.id))
-              }), /* @__PURE__ */ c(He, m({
-                onChange: Ie,
+              }), /* @__PURE__ */ c(Ge, h({
+                onChange: ve,
                 className: "d-right-pageination",
                 showQuickJumper: !0,
                 showSizeChanger: !0
-              }, a))]
-            }) : /* @__PURE__ */ c(rt, {})
+              }, f))]
+            }) : /* @__PURE__ */ c(at, {})
           })]
-        }), L && /* @__PURE__ */ c(qe, {
-          mode: _,
-          visible: L,
-          onClose: () => V(!1),
-          record: k,
-          onNextClick: () => Le(),
-          onPrevClick: () => Ve(),
-          ocrMarkTmpl: r == null ? void 0 : r.ocrMarkTmpl,
+        }), x && /* @__PURE__ */ c(et, {
+          mode: J,
+          visible: x,
+          onClose: () => L(!1),
+          record: m,
+          onNextClick: () => Oe(),
+          onPrevClick: () => Ne(),
+          ocrMarkTmpl: o == null ? void 0 : o.ocrMarkTmpl,
           datasetId: i,
           versionId: t == null ? void 0 : t.id,
           handleMarkClick: (e) => {
-            O(e), (r == null ? void 0 : r.ocrMarkTmpl) === "StructKVCOCR" ? (V(!1), $(!0)) : z("annotation");
+            O(e), (o == null ? void 0 : o.ocrMarkTmpl) === "StructKVCOCR" ? (L(!1), q(!0)) : F("annotation");
           },
-          updateSampleList: w,
-          isPreLabel: Z,
-          selectSampleId: Y,
+          updateSampleList: R,
+          isPreLabel: W,
+          selectSampleId: re,
           onSave: (e) => {
             var n;
             if (!i || !t)
               throw "datasetId or version is not exist.";
-            return l.cvforceDatahub.updateSamples(i, t.id, [g(m({}, e), {
-              labels: (n = e.labels) == null ? void 0 : n.map((o) => g(m({}, o), {
-                box: o.box.length > 4 ? o.box.splice(0, 4) : o.box
+            return l.cvforceDatahub.updateSamples(i, t.id, [g(h({}, e), {
+              labels: (n = e.labels) == null ? void 0 : n.map((r) => g(h({}, r), {
+                box: r.box.length > 4 ? r.box.splice(0, 4) : r.box
               }))
-            })]).then(() => (u && (k == null ? void 0 : k.id) === e.id && (P((o) => {
-              if (!o)
-                return o;
-              const f = o.findIndex((d) => d.id === e.id);
-              if (f > -1) {
-                const d = [...o];
-                return d[f] = e, d;
+            })]).then(() => (u && (m == null ? void 0 : m.id) === e.id && (P((r) => {
+              if (!r)
+                return r;
+              const a = r.findIndex((s) => s.id === e.id);
+              if (a > -1) {
+                const s = [...r];
+                return s[a] = e, s;
               }
-              return o;
-            }), b(e)), !0));
+              return r;
+            }), k(e)), !0));
           },
           onPending: (e) => {
             var n;
             if (!i || !t)
               throw "datasetId or version is not exist.";
-            return l.cvforceDatahub.updateSamples(i, t.id, [g(m({}, e), {
-              labels: (n = e.labels) == null ? void 0 : n.map((o) => g(m({}, o), {
-                box: o.box.length > 4 ? o.box.splice(0, 4) : o.box
+            return l.cvforceDatahub.updateSamples(i, t.id, [g(h({}, e), {
+              labels: (n = e.labels) == null ? void 0 : n.map((r) => g(h({}, r), {
+                box: r.box.length > 4 ? r.box.splice(0, 4) : r.box
               }))
-            })], 1).then(() => (u && (k == null ? void 0 : k.id) === e.id && (P((o) => {
-              if (!o)
-                return o;
-              const f = o.findIndex((d) => d.id === e.id);
-              if (f > -1) {
-                const d = [...o];
-                return d[f] = e, d;
+            })], 1).then(() => (u && (m == null ? void 0 : m.id) === e.id && (P((r) => {
+              if (!r)
+                return r;
+              const a = r.findIndex((s) => s.id === e.id);
+              if (a > -1) {
+                const s = [...r];
+                return s[a] = e, s;
               }
-              return o;
-            }), b(e)), !0));
+              return r;
+            }), k(e)), !0));
           },
-          filterMode: C,
+          filterMode: S,
           onFilterModeChange: (e) => {
-            O(void 0), F(e);
+            O(void 0), j(e);
           },
           onPaginationChange: (e) => {
-            S(e);
+            M(e);
+          },
+          onCurrentSampleChange: (e) => {
+            N.current = e;
           },
           samples: u,
-          pagination: a,
-          currentIndex: U
-        }), oe && (t == null ? void 0 : t.id) && /* @__PURE__ */ c(Oe, {
-          visible: oe,
-          selectSampleId: Y,
-          ocrMarkTmpl: r == null ? void 0 : r.ocrMarkTmpl,
+          pagination: f,
+          currentIndex: Z
+        }), le && (t == null ? void 0 : t.id) && /* @__PURE__ */ c(Ae, {
+          visible: le,
+          selectSampleId: re,
+          ocrMarkTmpl: o == null ? void 0 : o.ocrMarkTmpl,
           datasetId: i,
           versionId: t.id,
-          onClose: () => $(!1),
+          onClose: () => q(!1),
           onSave: (e) => {
             var n;
             if (!i || !t)
               throw "datasetId or version is not exist.";
-            return l.cvforceDatahub.updateSamples(i, t.id, [g(m({}, e), {
-              labels: (n = e.labels) == null ? void 0 : n.map((o) => g(m({}, o), {
-                box: o.box.length > 4 ? o.box.splice(0, 4) : o.box
+            return l.cvforceDatahub.updateSamples(i, t.id, [g(h({}, e), {
+              labels: (n = e.labels) == null ? void 0 : n.map((r) => g(h({}, r), {
+                box: r.box.length > 4 ? r.box.splice(0, 4) : r.box
               }))
-            })]).then(() => (w(), !0));
+            })]).then(() => (R(), !0));
           }
         })]
       }) : /* @__PURE__ */ c("div", {
@@ -489,5 +522,5 @@ const Vt = (h) => {
   });
 };
 export {
-  Vt as default
+  At as default
 };