npm - clbs-libs-ui - Versions diffs - 1.0.0 - Mend

clbs-libs-ui 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (6) hide show

package/dist/clbs-ui.mjs +165 -0
package/dist/clbs-ui.umd.js +1 -0
package/package.json +20 -0
package/src/index.js +1 -0
package/src/pages/FavoriteModal.vue +207 -0
package/vite.config.js +18 -0

package/dist/clbs-ui.mjs ADDED Viewed

@@ -0,0 +1,165 @@
+import { createBlock as e, createCommentVNode as t, createElementBlock as n, createElementVNode as r, createTextVNode as i, createVNode as a, normalizeStyle as o, openBlock as s, ref as c, resolveComponent as l, toDisplayString as u, unref as d, withCtx as f } from "vue";
+//#region src/pages/FavoriteModal.vue
+var p = { style: { "max-width": "800px" } }, m = { key: 0 }, h = { key: 1 }, g = 75, _ = {
+	__name: "FavoriteModal",
+	props: {
+		type: {
+			type: String,
+			required: !0
+		},
+		miniState: {
+			type: Boolean,
+			required: !0
+		},
+		api: {
+			type: Object,
+			required: !0
+		},
+		stores: {
+			type: Object,
+			required: !0
+		},
+		constants: {
+			type: Object,
+			required: !0
+		},
+		ui: {
+			type: Object,
+			required: !0
+		}
+	},
+	setup(_) {
+		let v = _, { ModalViewSmall: y, CloseButton: b, LoadingComponent: x, EmptyData: S, ContentBtn: C, SearchInput: w, FavoriteOutlineIcon: T, FavoriteIcon: E, Dots: D, HomeIcon: O, EmailIcon: k } = v.ui, A = c("SUPPORT"), j = c(""), M = c(!1), N = c({
+			WIKI: [],
+			LMS: [],
+			SUPPORT: []
+		});
+		c({
+			WIKI: {
+				page: 1,
+				rowsPerPage: 18,
+				rowsNumber: 0
+			},
+			LMS: {
+				page: 1,
+				rowsPerPage: 18,
+				rowsNumber: 0
+			},
+			SUPPORT: {
+				page: 1,
+				rowsPerPage: 18,
+				rowsNumber: 0
+			}
+		});
+		let P = async (e) => {
+			A.value = e, await F();
+		}, F = async () => {
+			M.value = !0;
+			try {
+				let e;
+				e = v.type === "history" ? await v.api.fetchHistory() : A.value === "SUPPORT" ? await v.api.fetchFavoritesTasksRows() : await v.api.fetchFavorites({
+					query: j.value,
+					type: A.value.toLowerCase()
+				}), N.value[A.value] = e?.data || [];
+			} catch (e) {
+				console.error(e), v.stores?.notifications?.cancel?.(e.message);
+			}
+			M.value = !1;
+		}, I = async (e) => {
+			try {
+				e.favorite === 0 ? await v.api.fetchAddFavorite(e.idPage, A.value) && (e.favorite = 1) : await v.api.fetchDeleteFavorite(e.idPage, A.value) && (e.favorite = 0);
+			} catch (e) {
+				console.error(e), v.stores?.notifications?.cancel?.(e.message);
+			}
+		}, L = (e) => {
+			let { WIKI_URL: t, LMS_URL: n } = v.constants;
+			A.value === "SUPPORT" && window.open(e.url, "_blank"), A.value === "WIKI" && window.open(`${t}/${e.idPage}`, "_blank"), A.value === "LMS" && window.open(`${n}/#/course/${e.idPage}`, "_blank");
+		};
+		return (c, v) => {
+			let O = l("q-tab"), k = l("q-tabs"), F = l("q-btn"), R = l("q-td"), z = l("q-tr"), B = l("q-table"), V = l("q-tab-panel"), H = l("q-tab-panels"), U = l("q-card");
+			return s(), e(d(y), {
+				"modal-open": !0,
+				"mini-state": _.miniState
+			}, {
+				default: f(() => [a(U, {
+					style: o({ left: _.miniState ? "57px" : "240px" }),
+					class: "modal"
+				}, {
+					default: f(() => [a(d(b)), r("div", p, [
+						a(d(w), {
+							modelValue: j.value,
+							"onUpdate:modelValue": v[0] ||= (e) => j.value = e
+						}, null, 8, ["modelValue"]),
+						a(k, {
+							modelValue: A.value,
+							"onUpdate:modelValue": v[4] ||= (e) => A.value = e,
+							dense: "",
+							"active-color": "primary",
+							"indicator-color": "primary",
+							align: "justify"
+						}, {
+							default: f(() => [
+								_.type === "favorites" ? (s(), e(O, {
+									key: 0,
+									name: "SUPPORT",
+									label: "Support",
+									onClick: v[1] ||= (e) => P("SUPPORT")
+								})) : t("", !0),
+								a(O, {
+									name: "WIKI",
+									label: "Wiki",
+									onClick: v[2] ||= (e) => P("WIKI")
+								}),
+								a(O, {
+									name: "LMS",
+									label: "Learning",
+									onClick: v[3] ||= (e) => P("LMS")
+								})
+							]),
+							_: 1
+						}, 8, ["modelValue"]),
+						a(H, {
+							modelValue: A.value,
+							"onUpdate:modelValue": v[5] ||= (e) => A.value = e
+						}, {
+							default: f(() => [a(V, { name: "WIKI" }, {
+								default: f(() => [M.value ? (s(), e(d(x), { key: 0 })) : N.value.WIKI.length === 0 ? (s(), e(d(S), { key: 1 })) : (s(), e(B, {
+									key: 2,
+									rows: N.value.WIKI
+								}, {
+									body: f((t) => [a(z, { props: t }, {
+										default: f(() => [a(R, null, {
+											default: f(() => [a(F, {
+												flat: "",
+												"no-caps": "",
+												onClick: (e) => L(t.row)
+											}, {
+												default: f(() => [t.row.name.length < g ? (s(), n("span", m, u(t.row.name), 1)) : (s(), n("span", h, [i(u(t.row.name.slice(0, g)) + " ", 1), a(d(D), { size: "18" })]))]),
+												_: 2
+											}, 1032, ["onClick"])]),
+											_: 2
+										}, 1024), a(R, null, {
+											default: f(() => [a(d(C), { onClick: (e) => I(t.row) }, {
+												default: f(() => [t.row.favorite === 0 ? (s(), e(d(T), { key: 0 })) : (s(), e(d(E), { key: 1 }))]),
+												_: 2
+											}, 1032, ["onClick"])]),
+											_: 2
+										}, 1024)]),
+										_: 2
+									}, 1032, ["props"])]),
+									_: 1
+								}, 8, ["rows"]))]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["modelValue"])
+					])]),
+					_: 1
+				}, 8, ["style"])]),
+				_: 1
+			}, 8, ["mini-state"]);
+		};
+	}
+};
+//#endregion
+export { _ as FavoritePage };

package/dist/clbs-ui.umd.js ADDED Viewed

@@ -0,0 +1 @@

package/package.json ADDED Viewed

@@ -0,0 +1,20 @@
+{
+  "name": "clbs-libs-ui",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "description": "",
+  "dependencies": {
+    "vue": "^3.5.31"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.5",
+    "vite": "^8.0.3"
+  }
+}

package/src/index.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ export { default as FavoritePage } from './pages/FavoriteModal.vue'

package/src/pages/FavoriteModal.vue ADDED Viewed

@@ -0,0 +1,207 @@
+<script setup>
+import { ref } from "vue"
+const props = defineProps({
+  type: {
+    type: String,
+    required: true
+  },
+  miniState: {
+    type: Boolean,
+    required: true
+  },
+  api: {
+    type: Object,
+    required: true
+  },
+  stores: {
+    type: Object,
+    required: true
+  },
+  constants: {
+    type: Object,
+    required: true
+  },
+  ui: {
+    type: Object,
+    required: true
+  }
+})
+const {
+  ModalViewSmall,
+  CloseButton,
+  LoadingComponent,
+  EmptyData,
+  ContentBtn,
+  SearchInput,
+  FavoriteOutlineIcon,
+  FavoriteIcon,
+  Dots,
+  HomeIcon,
+  EmailIcon
+} = props.ui
+const tab = ref("SUPPORT")
+const filter = ref("")
+const isLoading = ref(false)
+const rows = ref({
+  WIKI: [],
+  LMS: [],
+  SUPPORT: []
+})
+const pagination = ref({
+  WIKI: { page: 1, rowsPerPage: 18, rowsNumber: 0 },
+  LMS: { page: 1, rowsPerPage: 18, rowsNumber: 0 },
+  SUPPORT: { page: 1, rowsPerPage: 18, rowsNumber: 0 }
+})
+const maxTitleLength = 75
+const changeTab = async (value) => {
+  tab.value = value
+  await getData()
+}
+const getData = async () => {
+  isLoading.value = true
+  try {
+    let result
+    if (props.type === "history") {
+      result = await props.api.fetchHistory()
+    }
+    else if (tab.value === "SUPPORT") {
+      result = await props.api.fetchFavoritesTasksRows()
+    }
+    else {
+      result = await props.api.fetchFavorites({
+        query: filter.value,
+        type: tab.value.toLowerCase()
+      })
+    }
+    rows.value[tab.value] = result?.data || []
+  } catch (e) {
+    console.error(e)
+    props.stores?.notifications?.cancel?.(e.message)
+  }
+  isLoading.value = false
+}
+const toggleFavorite = async (row) => {
+  try {
+    if (row.favorite === 0) {
+      const res = await props.api.fetchAddFavorite(
+        row.idPage,
+        tab.value
+      )
+      if (res) row.favorite = 1
+    } else {
+      const res = await props.api.fetchDeleteFavorite(
+        row.idPage,
+        tab.value
+      )
+      if (res) row.favorite = 0
+    }
+  } catch (e) {
+    console.error(e)
+    props.stores?.notifications?.cancel?.(e.message)
+  }
+}
+const goToPage = (row) => {
+  const { WIKI_URL, LMS_URL } = props.constants
+  if (tab.value === "SUPPORT") {
+    window.open(row.url, "_blank")
+  }
+  if (tab.value === "WIKI") {
+    window.open(`${WIKI_URL}/${row.idPage}`, "_blank")
+  }
+  if (tab.value === "LMS") {
+    window.open(`${LMS_URL}/#/course/${row.idPage}`, "_blank")
+  }
+}
+</script>
+<template>
+<ModalViewSmall
+  :modal-open="true"
+  :mini-state="miniState"
+>
+  <q-card
+    :style="{ left: miniState ? '57px' : '240px' }"
+    class="modal"
+  >
+    <CloseButton />
+    <div style="max-width:800px">
+      <SearchInput v-model="filter"/>
+      <q-tabs
+        v-model="tab"
+        dense
+        active-color="primary"
+        indicator-color="primary"
+        align="justify"
+      >
+        <q-tab
+          v-if="type === 'favorites'"
+          name="SUPPORT"
+          label="Support"
+          @click="changeTab('SUPPORT')"
+        />
+        <q-tab
+          name="WIKI"
+          label="Wiki"
+          @click="changeTab('WIKI')"
+        />
+        <q-tab
+          name="LMS"
+          label="Learning"
+          @click="changeTab('LMS')"
+        />
+      </q-tabs>
+      <q-tab-panels v-model="tab">
+        <q-tab-panel name="WIKI">
+          <LoadingComponent v-if="isLoading"/>
+          <EmptyData v-else-if="rows.WIKI.length === 0"/>
+          <q-table
+            v-else
+            :rows="rows.WIKI"
+          >
+            <template #body="props">
+              <q-tr :props="props">
+                <q-td>
+                  <q-btn
+                    flat
+                    no-caps
+                    @click="goToPage(props.row)"
+                  >
+                    <span v-if="props.row.name.length < maxTitleLength">
+                      {{ props.row.name }}
+                    </span>
+                    <span v-else>
+                      {{ props.row.name.slice(0, maxTitleLength) }}
+                      <Dots size="18"/>
+                    </span>
+                  </q-btn>
+                </q-td>
+                <q-td>
+                  <ContentBtn
+                    @click="toggleFavorite(props.row)"
+                  >
+                    <FavoriteOutlineIcon
+                      v-if="props.row.favorite === 0"
+                    />
+                    <FavoriteIcon v-else/>
+                  </ContentBtn>
+                </q-td>
+              </q-tr>
+            </template>
+          </q-table>
+        </q-tab-panel>
+      </q-tab-panels>
+    </div>
+  </q-card>
+</ModalViewSmall>
+</template>

package/vite.config.js ADDED Viewed

@@ -0,0 +1,18 @@
+import { defineConfig } from "vite"
+import vue from "@vitejs/plugin-vue"
+export default defineConfig({
+  plugins: [vue()],
+  build: {
+    lib: {
+      entry: "src/index.js",
+      name: "ClbsUI",
+      fileName: "clbs-ui"
+    },
+    rollupOptions: {
+      external: ["vue"]
+    }
+  }
+})