@fewangsit/wangsvue 1.5.217-alpha.1 → 1.5.218-alpha.0

package/taskdependency/index.es.js

@@ -0,0 +1,686 @@
+import { defineComponent as fe, inject as S, ref as j, shallowRef as W, computed as Q, watch as Re, createElementBlock as p, openBlock as d, Fragment as N, createCommentVNode as M, createVNode as T, createElementVNode as b, renderList as X, createBlock as C, toDisplayString as O, unref as E, nextTick as me, createTextVNode as pe } from "vue";
+import { TaskServices as ve, ProjectProcessServices as We, TaskDependencyServices as be, ModuleServices as Ee, SubModuleServices as Je } from "@fewangsit/workspace-api-services";
+import { u as He } from "../apiitem/index.es.js";
+import { u as Ae } from "../utils/toast.util.es.js";
+import { _ as J } from "../button/index.es.js";
+import { _ as Y } from "../dropdown/index.es.js";
+import { _ as Z } from "../icon/index.es.js";
+import { _ as Ie } from "../multiselect/index.es.js";
+import { _ as Fe } from "../username/index.es.js";
+import { _ as Ge } from "../dialogreportbug/index.es.js";
+import { a as qe } from "../badge/index.es.js";
+import { _ as ze } from "../inputadditional/index.es.js";
+import { c as Qe } from "../vendor/lodash-es/cloneDeep.es.js";
+const Xe = {
+  key: 0,
+  "data-wv-section": "detailtask-task-dependency"
+}, Ye = { class: "flex items-center justify-between" }, Ze = { class: "flex items-center gap-2" }, eo = { class: "pl-8 flex flex-col gap-2" }, oo = { class: "flex gap-2" }, so = { class: "flex items-center gap-1" }, lo = { key: 1 }, no = {
+  key: 0,
+  class: "flex items-center gap-1"
+}, to = { key: 1 }, ao = {
+  key: 1,
+  class: "flex items-center gap-1"
+}, io = { key: 1 }, uo = {
+  key: 2,
+  class: "flex items-center gap-1"
+}, co = { class: "list-none pt-2" }, ro = { class: "w-full flex flex-col gap-1.5 overflow-auto" }, mo = { class: "flex justify-between w-full" }, po = { class: "flex items-center gap-2" }, vo = ["onClick"], bo = {
+  key: 0,
+  class: "flex gap-2"
+}, fo = {
+  key: 0,
+  class: ""
+}, _o = ["href"], yo = ["innerHTML"], go = { key: 1 }, ho = { key: 1 }, Mo = {
+  key: 1,
+  class: "text-xs text-grayscale-700"
+}, Bo = /* @__PURE__ */ fe({
+  __name: "TaskDependency",
+  setup(ee) {
+    const _ = Ae(), { setLoading: H } = He(), oe = /<\s*\/?\s*(iframe)\b.*?>/, U = [
+      "Pengonsepan",
+      "Diagram",
+      "Wireframe",
+      "Komponen Web",
+      "Komponen Mobile",
+      "Dokumentasi API",
+      "User Manual Web",
+      "User Manual Mobile",
+      "Slicing Komponen Web",
+      "Slicing Komponen Mobile",
+      "Detailing"
+    ], _e = JSON.parse(localStorage.getItem("user")) ?? {}, ye = S(
+      "userType"
+    ), K = S("projectId"), D = S("taskId"), h = S("taskDetail"), ge = S("isNewTask"), he = S("openDetailTask"), Me = S("isApproverHasAccess"), we = S(
+      "refreshTaskHandler"
+    ), A = j(), se = j(), le = j(), I = j(), a = j(), V = W(!1), F = W(!1), B = W(!1), ne = W(), ke = Q(() => {
+      var e;
+      return ((e = h.value) == null ? void 0 : e.process) ?? void 0;
+    }), x = Q(() => {
+      var e;
+      return ge.value || ["Pending Review Leader", "Selesai", "Reported Bug"].includes((e = h.value) == null ? void 0 : e.status) || ye.value === "guest" && !Me.value;
+    }), G = Q(
+      () => le.value.map((e) => ({
+        label: e.process.name,
+        value: e.process
+      }))
+    ), xe = async (e) => {
+      var s, t;
+      if (!(a.value[e.index] && ((s = a.value[e.index]) != null && s.subModuleVisibility) && !((t = a.value[e.index]) != null && t.subModule)))
+        try {
+          a.value[e.index].loading = !0;
+          const o = {
+            project: JSON.stringify([K.value]),
+            process: JSON.stringify([e.processId]),
+            module: JSON.stringify([e.moduleId]),
+            subModule: e.subModuleId ? JSON.stringify([e.subModuleId]) : void 0,
+            taskOptions: !0
+          }, { data: n } = await ve.getTaskOptions(o);
+          n && (a.value[e.index].options = n.data.taskOptions.filter(
+            (c) => c.value !== D.value
+          ));
+        } catch (o) {
+          _.add({
+            message: "Opsi untuk task gagal dimuat.",
+            error: o
+          });
+        } finally {
+          a.value[e.index] && (a.value[e.index].loading = !1);
+        }
+    }, q = async () => {
+      var e, s;
+      try {
+        V.value = !0, A.value = await te(), se.value = await Se(), I.value = await Te();
+        const t = (e = se.value) == null ? void 0 : e.map((o) => {
+          var c, m, v;
+          const n = (c = I.value) == null ? void 0 : c.find(
+            (l) => {
+              var i, u, r, g;
+              return ((i = l == null ? void 0 : l.process) == null ? void 0 : i._id) === ((u = o == null ? void 0 : o.process) == null ? void 0 : u._id) && ((r = l == null ? void 0 : l.module) == null ? void 0 : r._id) === ((g = o == null ? void 0 : o.module) == null ? void 0 : g._id);
+            }
+          );
+          if (n) {
+            const l = (m = a.value) == null ? void 0 : m.find(
+              (i) => {
+                var u, r, g, f;
+                return ((u = i == null ? void 0 : i.process) == null ? void 0 : u._id) === ((r = n == null ? void 0 : n.process) == null ? void 0 : r._id) && ((g = i == null ? void 0 : i.module) == null ? void 0 : g._id) === ((f = n == null ? void 0 : n.module) == null ? void 0 : f._id);
+              }
+            );
+            return {
+              ...o,
+              task: n.task,
+              options: l ? l.options : n.task.map((i) => ({
+                label: i.name,
+                value: i._id
+              })),
+              selectedOptions: n.task.map((i) => i._id),
+              subModuleVisibility: !!n.subModule,
+              subModule: (n == null ? void 0 : n.subModule) ?? o.subModule,
+              subModuleOptions: n != null && n.subModule ? [
+                {
+                  label: (v = n == null ? void 0 : n.subModule) == null ? void 0 : v.name,
+                  value: n == null ? void 0 : n.subModule
+                }
+              ] : []
+            };
+          }
+          return {
+            ...o,
+            subModuleVisibility: !U.includes(
+              o.process.name
+            ),
+            subModule: U.includes(o.process.name) ? void 0 : o.subModule
+          };
+        });
+        (s = I.value) == null || s.forEach((o) => {
+          var c, m, v, l, i, u, r, g, f, R, ue, de, ce;
+          if (!t.some(
+            (k) => {
+              var y, P, $, L;
+              return ((y = k == null ? void 0 : k.process) == null ? void 0 : y._id) === ((P = o == null ? void 0 : o.process) == null ? void 0 : P._id) && (($ = k == null ? void 0 : k.module) == null ? void 0 : $._id) === ((L = o == null ? void 0 : o.module) == null ? void 0 : L._id);
+            }
+          )) {
+            const k = (c = a.value) == null ? void 0 : c.find(
+              (y) => {
+                var P, $, L, re;
+                return ((P = y == null ? void 0 : y.process) == null ? void 0 : P._id) === (($ = o == null ? void 0 : o.process) == null ? void 0 : $._id) && ((L = y == null ? void 0 : y.module) == null ? void 0 : L._id) === ((re = o == null ? void 0 : o.module) == null ? void 0 : re._id);
+              }
+            );
+            t.push({
+              process: { _id: (m = o.process) == null ? void 0 : m._id, name: (v = o.process) == null ? void 0 : v.name },
+              processOptions: G.value,
+              module: { _id: (l = o.module) == null ? void 0 : l._id, name: (i = o.module) == null ? void 0 : i.name },
+              moduleOptions: [
+                {
+                  label: (u = o.module) == null ? void 0 : u.name,
+                  value: { _id: (r = o.module) == null ? void 0 : r._id, name: (g = o.module) == null ? void 0 : g.name }
+                }
+              ],
+              subModule: o.subModule ? { _id: (f = o.subModule) == null ? void 0 : f._id, name: (R = o.subModule) == null ? void 0 : R.name } : void 0,
+              subModuleOptions: o.subModule ? [
+                {
+                  label: (ue = o.subModule) == null ? void 0 : ue.name,
+                  value: {
+                    _id: (de = o.subModule) == null ? void 0 : de._id,
+                    name: (ce = o.subModule) == null ? void 0 : ce.name
+                  }
+                }
+              ] : void 0,
+              subModuleVisibility: !!o.subModule,
+              task: o.task,
+              // If the current dependency is found, use its options as task options
+              options: k ? k.options : o.task.map((y) => ({ label: y.name, value: y._id })),
+              selectedOptions: o.task.map((y) => y._id),
+              loading: !1,
+              custom: !0
+            });
+          }
+        }), a.value = Qe(t), await me();
+      } catch (t) {
+        console.error(t);
+      } finally {
+        V.value = !1;
+      }
+    }, Se = async () => {
+      var e, s, t, o, n, c;
+      try {
+        const { data: m } = await We.getProcessList(
+          K.value,
+          {},
+          "active"
+        );
+        if (m) {
+          const v = (e = A.value) == null ? void 0 : e.find(
+            (u) => u.name === "Konsep"
+          ), l = (s = A.value) == null ? void 0 : s.find(
+            (u) => u.name === "Komponen"
+          ), i = (u) => {
+            var r;
+            return u === "Pengonsepan" ? v : [
+              "Komponen Web",
+              "Komponen Mobile",
+              "Slicing Komponen Web",
+              "Slicing Komponen Mobile"
+            ].includes(u) ? l : (r = h.value) == null ? void 0 : r.module;
+          };
+          return le.value = (o = (t = m == null ? void 0 : m.data) == null ? void 0 : t.processProjects) == null ? void 0 : o.map(
+            (u) => {
+              var r;
+              return {
+                process: u,
+                module: i(u.name),
+                subModule: (r = h.value) == null ? void 0 : r.subModule,
+                task: [],
+                options: [],
+                loading: !1
+              };
+            }
+          ), (c = (n = m == null ? void 0 : m.data) == null ? void 0 : n.processProjects) == null ? void 0 : c.find((u) => {
+            var r;
+            return u.name === ((r = h == null ? void 0 : h.value) == null ? void 0 : r.process.name);
+          }).dependencies.map((u) => {
+            var r;
+            return {
+              process: u,
+              module: (
+                /*
+                 * If the process name is "Pengonsepan", use the conceptModule.
+                 * If the process name is one of the following, use the componentModule.
+                 * Otherwise, use the module of the current task.
+                 * This is because the dependency process will have a different module
+                 * depending on the process name.
+                 */
+                i(u.name)
+              ),
+              subModule: (r = h.value) == null ? void 0 : r.subModule,
+              task: [],
+              options: [],
+              loading: !1
+            };
+          });
+        }
+        return;
+      } catch (m) {
+        _.add({
+          message: "Proses dependensi gagal dimuat.",
+          error: m
+        });
+        return;
+      }
+    }, Te = async () => {
+      try {
+        if (!D.value) return;
+        const { data: e } = await be.getTaskDependencies(
+          D.value
+        );
+        return e ? e.data : void 0;
+      } catch (e) {
+        _.add({
+          message: "Task dependensi gagal dimuat.",
+          error: e
+        });
+        return;
+      }
+    }, te = async () => {
+      try {
+        const { data: e } = await Ee.getModuleOptionsWithoutRestriction(
+          K.value
+        );
+        return e ? e.data : void 0;
+      } catch (e) {
+        _.add({
+          message: "Projek modul gagal dimuat.",
+          error: e
+        });
+        return;
+      }
+    }, ae = async () => {
+      try {
+        const e = {
+          data: a.value.flatMap(
+            (t) => t.selectedOptions ? t.selectedOptions.map((o) => {
+              var m;
+              const n = (m = t.task) == null ? void 0 : m.findIndex(
+                (v) => v._id === o
+              ), c = typeof n == "number" && n !== -1 ? t.task[n].caption : void 0;
+              return {
+                task: o,
+                custom: t.custom,
+                caption: c
+              };
+            }) : []
+          )
+        }, { data: s } = await be.updateTaskDependencies(
+          D.value,
+          e
+        );
+        return !!s;
+      } catch (e) {
+        return _.add({
+          message: "Gagal mengirim data dependensi.",
+          error: e
+        }), !1;
+      }
+    }, Oe = (e) => {
+      var t;
+      const s = a.value[e];
+      s.custom && !((t = s.selectedOptions) != null && t.length) && a.value.splice(e, 1);
+    }, ie = async (e) => {
+      const s = a.value[e];
+      if (F.value || V.value || !(s != null && s.process) || !(s != null && s.module) || s.subModuleVisibility && !s.subModule)
+        return !1;
+      try {
+        return F.value = !0, Oe(e), await ae() ? (await q(), z(), !0) : !1;
+      } catch (t) {
+        return _.add({
+          message: "Task dependensi gagal diubah.",
+          error: t
+        }), !1;
+      } finally {
+        F.value = !1;
+      }
+    }, Ce = async (e) => {
+      try {
+        a.value[e.depIndex].task[e.taskIndex].caption = e.caption, await ie(e.depIndex) && (a.value[e.depIndex].task[e.taskIndex].showCaption = !1);
+      } catch (s) {
+        console.error(s);
+      }
+    }, De = (e) => {
+      a.value.push({
+        process: void 0,
+        module: void 0,
+        subModule: void 0,
+        task: [],
+        options: [],
+        loading: !1,
+        custom: !0,
+        processOptions: G.value
+      });
+    }, Ve = (e) => {
+      const s = U.includes(
+        a.value[e].process.name
+      );
+      a.value[e].subModuleVisibility = !s, s && (a.value[e].subModule = void 0);
+    }, Pe = async (e) => {
+      try {
+        const s = await te();
+        a.value[e].moduleOptions = s ? s.filter((t) => {
+          const o = a.value.some(
+            (c, m) => {
+              var v, l;
+              return ((v = c.process) == null ? void 0 : v._id) === a.value[e].process._id && ((l = c.module) == null ? void 0 : l._id) === t._id && !c.subModuleVisibility && m !== e;
+            }
+          );
+          return !["Komponen", "Konsep"].includes(
+            t.name
+          ) && !o;
+        }).map((t) => ({
+          label: t.name,
+          value: {
+            _id: t._id,
+            name: t.name
+          }
+        })) : [];
+      } catch (s) {
+        _.add({
+          message: "Data modul gagal dimuat.",
+          severity: "error",
+          error: s
+        });
+      }
+    }, $e = async (e) => {
+      const s = a.value[e].module;
+      if (s)
+        try {
+          const { data: t } = await Je.getSubmoduleListWithoutRestriction(
+            K.value,
+            s._id
+          );
+          if (t.data) {
+            const n = t.data.filter((c) => !a.value.find(
+              (v, l) => {
+                var i, u, r;
+                return ((i = v.process) == null ? void 0 : i._id) === a.value[e].process._id && ((u = v.module) == null ? void 0 : u._id) === a.value[e].module._id && ((r = v.subModule) == null ? void 0 : r._id) === (c == null ? void 0 : c._id) && l !== e;
+              }
+            ));
+            a.value[e].subModuleOptions = n.map((c) => ({
+              label: c.name,
+              value: {
+                _id: c._id,
+                name: c.name
+              }
+            }));
+          }
+        } catch (t) {
+          console.error(t), _.add({
+            message: "Data sub modul gagal dimuat.",
+            error: t
+          });
+        }
+    }, Le = (e) => {
+      Ve(e), w(e, "module"), w(e, "subModule"), w(e, "selectedOptions"), w(e, "task");
+    }, je = (e) => {
+      w(e, "subModule"), w(e, "selectedOptions"), w(e, "task");
+    }, Ne = async (e) => {
+      try {
+        V.value = !0, w(e, "selectedOptions"), w(e, "task"), await me();
+      } catch (s) {
+        console.error(s);
+      } finally {
+        V.value = !1;
+      }
+    }, w = (e, s) => {
+      a.value[e][s] = void 0;
+    }, Ue = async (e) => {
+      try {
+        a.value[e].custom && (a.value.splice(e, 1), await ae() && (await q(), z()));
+      } catch (s) {
+        _.add({
+          message: "Task dependensi gagal dihapus.",
+          error: s
+        });
+      }
+    }, Ke = async (e) => {
+      try {
+        H(!0);
+        const { data: s } = await ve.reportBugTask(ne.value, {
+          note: e
+        });
+        s && (_.add({
+          message: "Task telah direport bug.",
+          severity: "success"
+        }), B.value = !1, z());
+      } catch (s) {
+        _.add({
+          message: "Task gagal direport bug.",
+          error: s
+        });
+      } finally {
+        H(!1);
+      }
+    }, z = () => {
+      we("update", D.value);
+    }, Be = (e) => {
+      ne.value = e, B.value = !0;
+    };
+    return Re(
+      ke,
+      (e, s) => {
+        JSON.stringify(e) !== JSON.stringify(s) && q();
+      },
+      { immediate: !0 }
+    ), (e, s) => {
+      var t;
+      return d(), p(N, null, [
+        (t = a.value) != null && t.length ? (d(), p("div", Xe, [
+          b("div", Ye, [
+            b("div", Ze, [
+              T(Z, {
+                class: "w-6 h-6",
+                icon: "link"
+              }),
+              s[2] || (s[2] = b("div", { class: "text-xs font-semibold" }, "Task Dependensi", -1))
+            ]),
+            T(J, {
+              disabled: x.value,
+              onClick: s[0] || (s[0] = (o) => De()),
+              icon: "add",
+              label: "Custom",
+              severity: "secondary"
+            }, null, 8, ["disabled"])
+          ]),
+          b("div", eo, [
+            (d(!0), p(N, null, X(a.value, (o, n) => {
+              var c, m, v;
+              return d(), p("div", {
+                key: n,
+                class: ""
+              }, [
+                b("div", oo, [
+                  b("div", so, [
+                    s[3] || (s[3] = b("span", { class: "text-xs font-semibold" }, "Proses: ", -1)),
+                    o.custom ? (d(), C(Y, {
+                      key: 0,
+                      modelValue: o.process,
+                      "onUpdate:modelValue": [(l) => o.process = l, (l) => Le(n)],
+                      disabled: x.value,
+                      "initial-value": o.process,
+                      options: G.value,
+                      class: "!w-[110px]",
+                      "data-key": "name",
+                      "option-label": "label",
+                      "option-value": "value",
+                      placeholder: "Pilih proses",
+                      "use-validator": ""
+                    }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "initial-value", "options"])) : (d(), p("span", lo, O((c = o.process) == null ? void 0 : c.name), 1))
+                  ]),
+                  o.process ? (d(), p("div", no, [
+                    s[4] || (s[4] = b("span", { class: "text-xs font-semibold" }, "Modul: ", -1)),
+                    o.custom ? (d(), C(Y, {
+                      key: 0,
+                      modelValue: o.module,
+                      "onUpdate:modelValue": [(l) => o.module = l, (l) => je(n)],
+                      disabled: x.value,
+                      "initial-value": o.module,
+                      options: o.moduleOptions,
+                      onShow: (l) => Pe(n),
+                      class: "!w-[110px]",
+                      "data-key": "name",
+                      "option-label": "label",
+                      "option-value": "value",
+                      placeholder: "Pilih modul",
+                      "use-validator": ""
+                    }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "initial-value", "options", "onShow"])) : (d(), p("span", to, O((m = o.module) == null ? void 0 : m.name), 1))
+                  ])) : M("", !0),
+                  o.subModuleVisibility ? (d(), p("div", ao, [
+                    s[5] || (s[5] = b("span", { class: "text-xs font-semibold" }, "Sub Modul: ", -1)),
+                    o.custom || U.includes(E(h).process.name) ? (d(), C(Y, {
+                      key: 0,
+                      modelValue: o.subModule,
+                      "onUpdate:modelValue": [(l) => o.subModule = l, (l) => Ne(n)],
+                      disabled: x.value,
+                      "initial-value": o.subModule,
+                      options: o.subModuleOptions,
+                      onShow: (l) => $e(n),
+                      class: "!w-[110px]",
+                      "data-key": "name",
+                      "option-label": "label",
+                      "option-value": "value",
+                      placeholder: "Pilih sub modul",
+                      "use-validator": ""
+                    }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "initial-value", "options", "onShow"])) : (d(), p("span", io, O((v = o.subModule) == null ? void 0 : v.name), 1))
+                  ])) : M("", !0),
+                  (o.subModuleVisibility ? o.subModule : o.module) ? (d(), p("div", uo, [
+                    s[6] || (s[6] = b("span", { class: "text-xs font-semibold" }, "Task: ", -1)),
+                    T(Ie, {
+                      modelValue: o.selectedOptions,
+                      "onUpdate:modelValue": [(l) => o.selectedOptions = l, (l) => ie(n)],
+                      disabled: x.value,
+                      "initial-value": o.selectedOptions,
+                      loading: o.loading,
+                      options: o.options,
+                      onShow: (l) => {
+                        var i;
+                        return xe({
+                          index: n,
+                          processId: o.process._id,
+                          moduleId: o.module._id,
+                          subModuleId: (i = o.subModule) == null ? void 0 : i._id
+                        });
+                      },
+                      class: "!w-[110px]",
+                      "option-label": "label",
+                      "option-value": "value",
+                      placeholder: "Pilih task",
+                      "use-validator": ""
+                    }, null, 8, ["modelValue", "onUpdate:modelValue", "disabled", "initial-value", "loading", "options", "onShow"])
+                  ])) : M("", !0),
+                  o.custom ? (d(), C(J, {
+                    key: 3,
+                    disabled: x.value,
+                    onClick: (l) => Ue(n),
+                    class: "text-danger-500",
+                    icon: "close",
+                    severity: "danger",
+                    text: ""
+                  }, null, 8, ["disabled", "onClick"])) : M("", !0)
+                ]),
+                b("ul", co, [
+                  (d(!0), p(N, null, X(o.task, (l, i) => {
+                    var u, r, g;
+                    return d(), p("li", {
+                      key: i,
+                      class: "flex pt-1 pb-1 first:!pt-0 first:!pb-1 last:!pt-1 last:!pb-0 before:content-['•'] before:mr-2 before:mt-1.5"
+                    }, [
+                      b("div", ro, [
+                        b("div", mo, [
+                          b("div", po, [
+                            b("span", {
+                              onClick: (f) => E(he)(l._id),
+                              class: "cursor-pointer"
+                            }, O(l.name), 9, vo),
+                            (u = l.assignedTo) != null && u.length ? (d(), p("div", bo, [
+                              (d(!0), p(N, null, X(l.assignedTo, (f, R) => (d(), C(Fe, {
+                                key: R,
+                                user: f,
+                                type: "icon"
+                              }, null, 8, ["user"]))), 128))
+                            ])) : M("", !0),
+                            T(qe, {
+                              label: l.status,
+                              format: "nowrap"
+                            }, null, 8, ["label"]),
+                            l.status === "Selesai" && E(h).project.method !== "Sprint" && ((r = l.assignedTo) != null && r.find(
+                              (f) => f._id !== E(_e)._id
+                            )) ? (d(), C(J, {
+                              key: 1,
+                              disabled: x.value,
+                              onClick: (f) => Be(l._id),
+                              label: "Report Bug",
+                              severity: "danger",
+                              text: ""
+                            }, null, 8, ["disabled", "onClick"])) : M("", !0)
+                          ]),
+                          T(J, {
+                            disabled: x.value,
+                            onClick: (f) => l.showCaption = !l.showCaption,
+                            icon: "chat-new-line",
+                            severity: "secondary",
+                            text: ""
+                          }, null, 8, ["disabled", "onClick"])
+                        ]),
+                        l.taskLink ? (d(), p("div", fo, [
+                          l.taskLink.linkType === "url" ? (d(), p("a", {
+                            key: 0,
+                            href: l.taskLink.link,
+                            class: "text-link",
+                            target: "_blank"
+                          }, O(l.taskLink.link), 9, _o)) : l.taskLink.linkType === "embedded" ? (d(), p(N, { key: 1 }, [
+                            oe.test(l.taskLink.link) ? (d(), p("div", {
+                              key: 0,
+                              innerHTML: l.taskLink.link,
+                              class: "[&_iframe]:flex-grow flex w-full h-full"
+                            }, null, 8, yo)) : (d(), p("div", go, s[7] || (s[7] = [
+                              b("span", { class: "font-bold text-lg" }, " Oh Tidak! kode embed tidak valid. ", -1)
+                            ])))
+                          ], 64)) : M("", !0)
+                        ])) : M("", !0),
+                        l.showCaption || (g = l.caption) != null && g.length ? (d(), p("div", ho, [
+                          l.showCaption ? (d(), C(ze, {
+                            key: 0,
+                            value: l.caption,
+                            onCancel: (f) => l.showCaption = !1,
+                            onSubmit: (f) => Ce({
+                              caption: f,
+                              taskIndex: i,
+                              depIndex: n
+                            }),
+                            placeholder: "Tulis caption"
+                          }, null, 8, ["value", "onCancel", "onSubmit"])) : (d(), p("span", Mo, O(l.caption), 1))
+                        ])) : M("", !0)
+                      ])
+                    ]);
+                  }), 128))
+                ])
+              ]);
+            }), 128))
+          ])
+        ])) : M("", !0),
+        T(Ge, {
+          visible: B.value,
+          "onUpdate:visible": s[1] || (s[1] = (o) => B.value = o),
+          onSubmit: Ke
+        }, null, 8, ["visible"])
+      ], 64);
+    };
+  }
+}), wo = { class: "flex items-center gap-2" }, ko = { class: "flex items-center" }, xo = { class: "flex items-center" }, Ro = /* @__PURE__ */ fe({
+  __name: "TaskDependency",
+  props: {
+    done: {},
+    onProgress: {}
+  },
+  setup(ee) {
+    const _ = ee;
+    return (H, oe) => (d(), p("div", wo, [
+      b("span", ko, [
+        pe(O(_.done) + " ", 1),
+        T(Z, {
+          class: "!w-[24px] !h-[24px] ml-[2px]",
+          icon: "checkbox-circle-fill",
+          severity: "success"
+        })
+      ]),
+      b("span", xo, [
+        pe(O(_.onProgress ?? 0) + " ", 1),
+        T(Z, {
+          class: "!w-[24px] !h-[24px] ml-[2px]",
+          icon: "close-circle-fill",
+          severity: "danger"
+        })
+      ])
+    ]));
+  }
+});
+export {
+  Ro as _,
+  Bo as a
+};

package/taskdetail/blocks/sections/API/TestApi/options/keyValueTableColumn.d.ts

@@ -0,0 +1,2 @@
+import { TableColumn } from '../../../../../../datatable';
+export declare const keyValueTableColum: TableColumn[];