pages/app/*

.env.example

@@ -0,0 +1 @@
+CRYPTO_PASSWORD="example password"

modules/vite-plugin-build-raw.ts

@@ -9,22 +9,23 @@ export default function vitePluginBuildRaw(): Plugin {
  if (id.includes("?braw")) {
  id = id.replace(/\?braw$/, "")
  // console.log({ id })
-
  const code = esbuild.buildSync({
  entryPoints: [id],
  format: "iife",
  bundle: true,
  minify:
- id.includes("&minify") || process.env.NODE_ENV !== "production",
+ id.includes("&minify") || process.env.NODE_ENV === "production",
  treeShaking: true,
  write: false,
  // sourcemap: true
  // sideEff,
  define: Object.fromEntries(
- [...Object.entries(process.env)].map(([name, value]) => [
- `process.env.${name.replace(/[^\w\d_$]/g, "_")}`,
- JSON.stringify(value),
- ]),
+ [["CRYPTO_PASSWORD", ""], ...Object.entries(process.env)].map(
+ ([name, value]) => [
+ `process.env.${name.replace(/[^\w\d_$]/g, "_")}`,
+ JSON.stringify(value),
+ ],
+ ),
  ),
  })
  const { text } = code.outputFiles[0]
@@ -47,7 +48,7 @@ export default function vitePluginBuildRaw(): Plugin {
  {
  minify:
  id.includes("&minify") ||
- process.env.NODE_ENV !== "production",
+ process.env.NODE_ENV === "production",
  treeShaking: true,
  },
  ).code

src/apis/nettruyen/runs/auth/user.ts

@@ -9,14 +9,14 @@ export default async function (token: string) {
  },
  )
 
- const $data = JSON.parse(data)
-
- return {
- uid: $data.userGuid as string,
- avatar: $data.avatar as string,
- token: $data.token as string,
- name: $data.fullName as string,
- email: $data.email as string | null,
- readToken: $data.readToken as string,
+ const $data = JSON.parse(data) as {
+ userGuid: string
+ avatar: string
+ token: string
+ fullName: string
+ email: string | null
+ readToken: string
  }
+
+ return $data
 }

src/components/app/AppHeaderFollows.vue

@@ -134,7 +134,7 @@ async function refresh(type: string) {
  datas.set(type, {
  data: await TheoDoi(
  1,
- authStore.user_data.uid,
+ authStore.user_data.userGuid,
  authStore.user_data.token,
  type,
  ),

src/components/app/AppHeaderIconApp.vue

@@ -1,6 +1,6 @@
 <template>
  <router-link to="/" class="flex flex-nowrap items-end max-w-100%">
- <img src="~assets/app_icon.svg" class="display-block size-35px" />
+ <img src="~assets/app_icon.png" class="display-block size-35px" />
  <span v-if="!noName" class="text-[25px] text-main font-family-caveat"
  >Manga Raiku</span
  >

src/components/library/LibraryTabFollows.vue

@@ -96,7 +96,7 @@ const onLoads = types.map(({ value }) => {
 
  return await TheoDoi(
  page,
- authStore.user_data.uid,
+ authStore.user_data.userGuid,
  authStore.user_data.token,
  value,
  )
@@ -125,7 +125,7 @@ async function refresh(type: string) {
 
  const data = await TheoDoi(
  1,
- authStore.user_data.uid,
+ authStore.user_data.userGuid,
  authStore.user_data.token,
  type,
  )

src/composables/use-info-read-manga.ts

@@ -25,7 +25,7 @@ export function useInfoReadManga(
  watch(
  [
  () => data.value?.uid,
- () => authStore.user_data?.uid,
+ () => authStore.user_data?.userGuid,
  () => authStore.user_data?.token,
  ],
  // eslint-disable-next-line camelcase

src/pages/app/about.vue

@@ -0,0 +1,80 @@
+<route lang="yaml">
+meta:
+ hiddenFooter: true
+</route>
+
+<template>
+ <div>
+ <q-header class="bg-dark-page">
+ <q-toolbar>
+ <q-btn round unelevated @click="router.back()">
+ <Icon icon="fluent:chevron-left-24-filled" class="size-1.5em" />
+ </q-btn>
+
+ <q-toolbar-title>Giới thiệu</q-toolbar-title>
+ </q-toolbar>
+ </q-header>
+
+ <q-page>
+ <div class="pt-12 flex items-center justify-center">
+ <div class="display-inline-block rounded-1/2">
+ <img src="~/assets/app_icon-white.png" class="size-80px" />
+ </div>
+ </div>
+ <div class="text-center mt-4">
+ <h1
+ class="text-subtitle1 text-20px uppercase text-weight-medium text-gray-200"
+ >
+ Manga Raiku
+ </h1>
+ <small class="text-12px text-gray-400"
+ >v{{ appInfo?.version ?? "__" }}-[{{ appInfo?.build }}]</small
+ >
+ </div>
+
+ <q-list>
+ <q-item v-for="item in buttons" :key="item.text" :href="item.href">
+ <q-item-section>
+ <q-item-label>{{ item.text }}</q-item-label>
+ </q-item-section>
+ </q-item>
+ </q-list>
+
+ <small class="text-gray-400 mt-10 text-12px text-center display-block"
+ >Ứng dụng thuộc tổ chức phi lợi nhuận</small
+ >
+ </q-page>
+ </div>
+</template>
+
+<script lang="ts" setup>
+import { App } from "@capacitor/app"
+import { version } from "app/package.json"
+
+const router = useRouter()
+
+const appInfo = computedAsync(async () => {
+ try {
+ return await App.getInfo()
+ } catch {
+ return { version, build: "web" }
+ }
+})
+
+const buttons = [
+ {
+ text: "Mã nguồn mở giấy phép GNU v3",
+ href: "https://github.com/manga-raiku/manga-raiku",
+ },
+ {
+ text: "Điều khoản dịch vụ",
+ href: "https://anime-vsub.github.io/term-of-use",
+ },
+ {
+ text: "Chính sách bảo mật",
+ href: "https://anime-vsub.github.io/privacy-police",
+ },
+]
+</script>
+
+<style></style>

src/pages/app/index.vue

@@ -12,7 +12,7 @@
  class="fixed w-full h-[calc(65%-58px)] bottom-58px left-0 rounded-25px bg-dark-page px-4 overflow-y-scroll scrollbar-custom"
  >
  <q-list padding>
- <q-item clickable v-ripple to="/app/login">
+ <q-item v-if="!authStore.isLogged" clickable v-ripple to="/app/login">
  <q-item-section avatar>
  <q-avatar>
  <Icon icon="solar:user-circle-bold-duotone" class="size-50px" />
@@ -22,6 +22,16 @@
  <q-item-label>Đăng nhập</q-item-label>
  </q-item-section>
  </q-item>
+ <q-item v-else clickable v-ripple>
+ <q-item-section avatar>
+ <q-avatar>
+ <img :src="authStore.user_data?.avatar" />
+ </q-avatar>
+ </q-item-section>
+ <q-item-section class="text-16px">
+ <q-item-label>{{ authStore.user_data?.fullName }}</q-item-label>
+ </q-item-section>
+ </q-item>
 
  <q-separator class="my-3" />
 
@@ -53,6 +63,8 @@ import { App } from "@capacitor/app"
 import { version } from "app/package.json"
 import { isCapacitor } from "src/constants"
 
+const authStore = useAuthStore()
+
 const buttons = [
  {
  href: "https://ko-fi.com/tachib_shin",
@@ -85,7 +97,7 @@ const buttons = [
  text: "Kiểm tra lỗi mạng",
  },
  {
- to: "/app/info",
+ to: "/app/about",
  icon: "solar:notebook-bookmark-bold-duotone",
  text: "Giới thiệu",
  side: computedAsync(async () => {

src/pages/app/login.vue

@@ -43,7 +43,7 @@ meta:
  outlined
  label="Dán ủy quyền nhị phân vào đây"
  color="main-3"
- class="mt-4"
+ class="mt-6"
  :rules="[verifyBinaryAuth]"
  clearable
  >
@@ -190,6 +190,13 @@ async function pasteCodeFromClipboard() {
 }
 
 async function continueLogin() {
- if (auth.value) authStore.setUser(auth.value)
+ if (auth.value) {
+ authStore.setUser(auth.value)
+ $q.notify({
+ position: "bottom-right",
+ message: `Đã đăng nhập với tư cách ${auth.value.fullName}`,
+ })
+ router.back()
+ }
 }
 </script>

src/pages/app/settings.vue

@@ -0,0 +1,8 @@
+<route lang="yaml">
+meta:
+ hiddenFooter: true
+</route>
+
+<template>
+ <router-view />
+</template>

src/stores/auth.ts

@@ -6,10 +6,10 @@ import Login from "src/apis/nettruyen/runs/auth/login"
 import GetUser from "src/apis/nettruyen/runs/auth/user"
 
 interface User {
- uid: string
+ userGuid: string
  avatar: string
  token: string
- name: string
+ fullName: string
  email: string | null
  readToken: string
 }
@@ -19,7 +19,7 @@ export const useAuthStore = defineStore("auth", () => {
  const user_data = ref(parseJSON(cookie.get("user_data")) as null | User)
 
  const isLogged = computed(() => {
- return !!token.value && !!user_data.value
+ return !!token.value || !!user_data.value
  })
 
  if (token.value)