@simplysm/sd-cli 13.0.71 → 13.0.74

package/templates/init/packages/client-admin/src/views/home/base/role-permission/RolePermissionDetail.tsx.hbs

@@ -0,0 +1,123 @@
+import { createMemo, createSignal } from "solid-js";
+import { reconcile } from "solid-js/store";
+import {
+  type AppPerm,
+  Button,
+  CrudDetail,
+  PermissionTable,
+  SharedDataSelect,
+  useSharedData,
+} from "@simplysm/solid";
+import { expr } from "@{{projectName}}/db-main";
+import type { AppSharedData, RoleSharedItem } from "../../../../providers/configureSharedData";
+import { useAuth } from "../../../../providers/AuthProvider";
+import { useAppService } from "../../../../providers/AppServiceProvider";
+import { useAppStructure } from "../../../../providers/AppStructureProvider";
+
+export function RolePermissionDetail(props: { roleId: number }) {
+  const auth = useAuth();
+  const appService = useAppService();
+  const appStructure = useAppStructure();
+  const sharedData = useSharedData<AppSharedData>();
+
+  const perms = createMemo(() => {
+    const p = auth.authInfo()?.permissions ?? {};
+    return {
+      edit: Boolean(p["/home/base/role-permission/edit"]),
+    };
+  });
+
+  const [copySourceRoleId, setCopySourceRoleId] = createSignal<number>();
+
+  async function loadPermissionsByRoleId(roleId: number): Promise<Record<string, boolean>> {
+    return appService.orm.connectWithoutTransaction(async (db) => {
+      const rows = await db
+        .rolePermission()
+        .where((c) => [expr.eq(c.roleId, roleId)])
+        .select((c) => ({
+          code: c.code,
+          valueJson: c.valueJson,
+        }))
+        .result();
+
+      const record: Record<string, boolean> = {};
+      for (const row of rows) {
+        record[row.code] = JSON.parse(row.valueJson);
+      }
+      return record;
+    });
+  }
+
+  async function handleLoad() {
+    const data = await loadPermissionsByRoleId(props.roleId);
+    return {
+      data,
+      info: { isNew: false, isDeleted: false },
+    };
+  }
+
+  async function handleSubmit(data: Record<string, boolean>) {
+    // eslint-disable-next-line solid/reactivity -- 비동기 콜백 내부
+    await appService.orm.connect(async (db) => {
+      await db
+        .rolePermission()
+        // eslint-disable-next-line solid/reactivity -- 비동기 콜백 내부
+        .where((c) => [expr.eq(c.roleId, props.roleId)])
+        .delete();
+
+      const entries = Object.entries(data).filter(([, v]) => v);
+      if (entries.length > 0) {
+        await db.rolePermission().insert(
+          entries.map(([code, value]) => ({
+            roleId: props.roleId,
+            code,
+            valueJson: JSON.stringify(value),
+          })),
+        );
+      }
+    });
+    return true;
+  }
+
+  return (
+    <CrudDetail<Record<string, boolean>>
+      class={"p-2"}
+      editable={perms().edit}
+      load={handleLoad}
+      submit={handleSubmit}
+    >
+      {(ctx) => {
+        async function onImportClick() {
+          const sourceId = copySourceRoleId();
+          if (sourceId == null) return;
+          const data = await loadPermissionsByRoleId(sourceId);
+          ctx.setData(reconcile(data));
+        }
+
+        return (
+          <>
+            <CrudDetail.Tools>
+              <SharedDataSelect
+                data={sharedData.role}
+                value={copySourceRoleId()}
+                onValueChange={(v) => setCopySourceRoleId(v as number | undefined)}
+              >
+                {(item: RoleSharedItem) => <>{item.name}</>}
+              </SharedDataSelect>
+              <Button onClick={onImportClick} disabled={copySourceRoleId() == null}>
+                가져오기
+              </Button>
+            </CrudDetail.Tools>
+
+            <PermissionTable
+              items={appStructure.usablePerms().flatMap((p) => p.children ?? []) as AppPerm<string>[]}
+              value={ctx.data}
+              onValueChange={(v) => ctx.setData(reconcile(v))}
+              disabled={!perms().edit}
+            />
+          </>
+        );
+      }}
+    </CrudDetail>
+  );
+}

package/templates/init/packages/client-admin/src/views/home/base/role-permission/RolePermissionView.tsx

@@ -0,0 +1,52 @@
+import { createSignal, Show } from "solid-js";
+import { Button, Icon, SharedDataSelectList, useDialog, useSharedData } from "@simplysm/solid";
+import type { AppSharedData, RoleSharedItem } from "../../../../providers/configureSharedData";
+import { RolePermissionDetail } from "./RolePermissionDetail";
+import { RoleSheet } from "./RoleSheet";
+import { IconExternalLink } from "@tabler/icons-solidjs";
+
+export function RolePermissionView() {
+  const dialog = useDialog();
+  const sharedData = useSharedData<AppSharedData>();
+  const [selectedRole, setSelectedRole] = createSignal<RoleSharedItem>();
+
+  return (
+    <div class="flex h-full flex-row">
+      <SharedDataSelectList
+        class={"border-r border-base-200 p-1.5 py-3"}
+        data={sharedData.role}
+        value={selectedRole()}
+        onValueChange={setSelectedRole}
+        header={
+          <div class={"flex flex-row p-1"}>
+            <div class={"flex-1 font-bold text-base-400"}>권한그룹</div>
+            <Button
+              variant={"ghost"}
+              theme={"primary"}
+              size={"xs"}
+              onClick={() => dialog.show(() => <RoleSheet />, { header: "권한그룹", closeOnBackdrop: true })}
+            >
+              <Icon icon={IconExternalLink} />
+            </Button>
+          </div>
+        }
+        required
+      >
+        <SharedDataSelectList.ItemTemplate<RoleSharedItem>>
+          {(item) => <>{item.name}</>}
+        </SharedDataSelectList.ItemTemplate>
+      </SharedDataSelectList>
+
+      <Show
+        when={selectedRole()}
+        fallback={
+          <div class="flex flex-1 items-center justify-center text-4xl leading-relaxed text-base-300">
+            권한그룹을 선택하세요.
+          </div>
+        }
+      >
+        <RolePermissionDetail roleId={selectedRole()!.id} />
+      </Show>
+    </div>
+  );
+}

package/templates/init/packages/client-admin/src/views/home/base/role-permission/RoleSheet.tsx.hbs

@@ -0,0 +1,125 @@
+import {
+  Checkbox,
+  CrudSheet,
+  type DialogEditConfig,
+  type SortingDef,
+  TextInput,
+  useDialog,
+} from "@simplysm/solid";
+import { FormGroup } from "@simplysm/solid";
+import { expr } from "@{{projectName}}/db-main";
+import { type ExprUnit } from "@simplysm/orm-common";
+import { objGetChainValue } from "@simplysm/core-common";
+import { useAppService } from "../../../../providers/AppServiceProvider";
+import { useAppStructure } from "../../../../providers/AppStructureProvider";
+import { RoleDetail } from "./RoleDetail";
+
+type SheetItem = {
+  id?: number;
+  name?: string;
+  isDeleted: boolean;
+};
+
+type Filter = {
+  searchText?: string;
+  isIncludeDeleted: boolean;
+};
+
+const ITEMS_PER_PAGE = 50;
+
+export function RoleSheet() {
+  const appService = useAppService();
+  const appStructure = useAppStructure();
+  const dialog = useDialog();
+
+  const rolePerms = appStructure.perms.home.base["role-permission"];
+
+  const dialogEdit: DialogEditConfig<SheetItem> = {
+    editItem: (item) =>
+      dialog.show(() => <RoleDetail itemId={item?.id} />, {
+        header: item ? "권한그룹 수정" : "권한그룹 등록",
+      }),
+  };
+
+  async function search(filter: Filter, page: number | undefined, sorts: SortingDef[]) {
+    return appService.orm.connect(async (db) => {
+      let qr = db.role();
+
+      const searchText = filter.searchText?.trim();
+      if (searchText != null && searchText.length > 0) {
+        qr = qr.search((c) => [c.name], searchText);
+      }
+
+      if (!filter.isIncludeDeleted) {
+        qr = qr.where((c) => [expr.eq(c.isDeleted, false)]);
+      }
+
+      const pageCount = page != null ? Math.ceil((await qr.count()) / ITEMS_PER_PAGE) : undefined;
+
+      let qr2 = qr.select((c) => ({
+        id: c.id,
+        name: c.name,
+        isDeleted: c.isDeleted,
+      }));
+
+      for (const sort of sorts) {
+        qr2 = qr2.orderBy(
+          (c) => objGetChainValue(c, sort.key) as ExprUnit<any>,
+          sort.desc ? "DESC" : "ASC",
+        );
+      }
+      if (!sorts.some((s) => s.key === "id")) {
+        qr2 = qr2.orderBy((c) => c.id, "DESC");
+      }
+
+      if (page != null) {
+        qr2 = qr2.limit((page - 1) * ITEMS_PER_PAGE, ITEMS_PER_PAGE);
+      }
+
+      const items = (await qr2.result()) as SheetItem[];
+      return { items, pageCount };
+    });
+  }
+
+  return (
+    <CrudSheet<SheetItem, Filter>
+      search={search}
+      getItemKey={(item) => item.id}
+      itemDeleted={(item) => item.isDeleted}
+      isItemSelectable={(item) => item.id != null}
+      persistKey="role-sheet-page"
+      editable={rolePerms.edit}
+      filterInitial=\{{ isIncludeDeleted: false } as Filter}
+      dialogEdit={dialogEdit}
+    >
+      <CrudSheet.Filter<Filter>>
+        {(filter, setFilter) => (
+          <>
+            <FormGroup.Item label="검색어">
+              <TextInput
+                value={filter.searchText}
+                onValueChange={(v) => setFilter("searchText", v)}
+              />
+            </FormGroup.Item>
+            <FormGroup.Item>
+              <Checkbox
+                value={filter.isIncludeDeleted}
+                onValueChange={(v) => setFilter("isIncludeDeleted", v)}
+              >
+                삭제항목 포함
+              </Checkbox>
+            </FormGroup.Item>
+          </>
+        )}
+      </CrudSheet.Filter>
+
+      <CrudSheet.Column<SheetItem> key="id" header="#" editTrigger>
+        {({ item }) => <div class="px-2 py-1 text-right">{item.id}</div>}
+      </CrudSheet.Column>
+
+      <CrudSheet.Column<SheetItem> key="name" header="이름">
+        {({ item }) => <div class="px-2 py-1">{item.name}</div>}
+      </CrudSheet.Column>
+    </CrudSheet>
+  );
+}

package/templates/init/packages/client-admin/src/views/home/main/MainView.tsx.hbs

@@ -0,0 +1,13 @@
+import { useAuth } from "../../../providers/AuthProvider";
+
+export function MainView() {
+  const auth = useAuth();
+
+  return (
+    <div class="flex h-full items-center justify-center">
+      <h1 class="text-2xl font-bold text-base-700 dark:text-base-200">
+        {{projectName}} ({auth.authInfo()?.employeeName})
+      </h1>
+    </div>
+  );
+}

package/templates/init/packages/client-admin/src/views/home/my-info/MyInfoDetail.tsx.hbs

@@ -0,0 +1,248 @@
+import { createMemo } from "solid-js";
+import { CrudDetail, FormTable, Icon, Select, TextInput } from "@simplysm/solid";
+import { useAuth } from "../../../providers/AuthProvider";
+import { useAppService } from "../../../providers/AppServiceProvider";
+import { useAppStructure } from "../../../providers/AppStructureProvider";
+import { expr } from "@{{projectName}}/db-main";
+import { IconX } from "@tabler/icons-solidjs";
+import { jsonParse } from "@simplysm/core-common";
+
+type DetailData = {
+  email: string;
+  currentPassword: string;
+  newPassword: string;
+  confirmPassword: string;
+  firstRouterLink?: string;
+};
+
+export function MyInfoDetail() {
+  const auth = useAuth();
+  const appService = useAppService();
+  const appStructure = useAppStructure();
+
+  const routeMap = createMemo(() => {
+    const menus = appStructure.usableMenus();
+    const map = new Map<string, string>();
+
+    const flatten = (items: typeof menus, prefix = ""): void => {
+      for (const item of items) {
+        const label = prefix !== "" ? `${prefix} > ${item.title}` : item.title;
+        if (item.href !== undefined) {
+          map.set(item.href, label);
+        }
+        if (item.children !== undefined) {
+          flatten(item.children, label);
+        }
+      }
+    };
+
+    flatten(menus);
+    return map;
+  });
+
+  const routeOptions = createMemo(() => Array.from(routeMap().keys()));
+
+  async function handleLoad() {
+    const authData = auth.authInfo();
+    if (!authData) throw new Error("직원 정보를 불러올 수 없습니다.");
+
+    return appService.orm.connect(async (db) => {
+      const employee = await db
+        .employee()
+        .where((c: any) => [expr.eq(c.id, authData.employeeId)])
+        .single();
+
+      const config = await db
+        .employeeConfig()
+        .where((c: any) => [
+          expr.eq(c.employeeId, authData.employeeId),
+          expr.eq(c.code, "firstRouterLink"),
+        ])
+        .first();
+
+      let firstRouterLink: string | undefined;
+      if (config?.valueJson !== undefined && config.valueJson !== "") {
+        try {
+          firstRouterLink = jsonParse(config.valueJson);
+        } catch {
+          // JSON 파싱 실패 시 기본값 유지
+        }
+      }
+
+      return {
+        data: {
+          email: employee?.email ?? "",
+          currentPassword: "",
+          newPassword: "",
+          confirmPassword: "",
+          firstRouterLink,
+        } as DetailData,
+        info: { isNew: false, isDeleted: false },
+      };
+    });
+  }
+
+  async function handleSubmit(data: DetailData) {
+    const authData = auth.authInfo();
+    if (!authData) throw new Error("직원 정보를 불러올 수 없습니다.");
+
+    const isPasswordChanging =
+      data.currentPassword.trim() !== "" ||
+      data.newPassword.trim() !== "" ||
+      data.confirmPassword.trim() !== "";
+
+    if (isPasswordChanging) {
+      await appService.auth.changePassword(data.currentPassword.trim(), data.newPassword.trim());
+    }
+
+    await appService.orm.connect(async (db) => {
+      await db
+        .employee()
+        .where((c: any) => [expr.eq(c.id, authData.employeeId)])
+        .update(() => ({
+          email: expr.val("string", data.email.trim()),
+        }));
+
+      const existingConfig = await db
+        .employeeConfig()
+        .where((c: any) => [
+          expr.eq(c.employeeId, authData.employeeId),
+          expr.eq(c.code, "firstRouterLink"),
+        ])
+        .first();
+
+      const valueJson =
+        data.firstRouterLink !== undefined
+          ? JSON.stringify(data.firstRouterLink)
+          : JSON.stringify(null);
+
+      if (existingConfig) {
+        await db
+          .employeeConfig()
+          .where((c: any) => [
+            expr.eq(c.employeeId, authData.employeeId),
+            expr.eq(c.code, "firstRouterLink"),
+          ])
+          .update(() => ({
+            valueJson: expr.val("string", valueJson),
+          }));
+      } else {
+        await db.employeeConfig().insert([
+          {
+            employeeId: authData.employeeId,
+            code: "firstRouterLink",
+            valueJson,
+          },
+        ]);
+      }
+    });
+
+    await auth.tryReloadAuth();
+    return true;
+  }
+
+  return (
+    <CrudDetail<DetailData> class={"px-2 py-4"} load={handleLoad} submit={handleSubmit}>
+      {(ctx) => (
+        <div class="flex flex-col gap-8">
+          <section>
+            <h3 class="mb-4 border-l-4 border-base-500 pl-3 font-bold text-base-500">인증정보</h3>
+            <FormTable>
+              <tr>
+                <th>이메일</th>
+                <td>
+                  <TextInput
+                    type="email"
+                    required
+                    value={ctx.data.email}
+                    onValueChange={(v) => ctx.setData("email", v)}
+                    autocomplete="off"
+                  />
+                </td>
+              </tr>
+              <tr>
+                <th>현재 비밀번호</th>
+                <td>
+                  <TextInput
+                    required={Boolean(ctx.data.newPassword || ctx.data.confirmPassword)}
+                    class="w-56"
+                    type="password"
+                    autocomplete="off"
+                    value={ctx.data.currentPassword}
+                    onValueChange={(v) => ctx.setData("currentPassword", v)}
+                    placeholder="비밀번호 변경 시에만 입력"
+                  />
+                </td>
+              </tr>
+              <tr>
+                <th>새 비밀번호</th>
+                <td>
+                  <TextInput
+                    required={Boolean(ctx.data.currentPassword || ctx.data.confirmPassword)}
+                    minLength={8}
+                    class="w-56"
+                    type="password"
+                    autocomplete="off"
+                    value={ctx.data.newPassword}
+                    onValueChange={(v) => ctx.setData("newPassword", v)}
+                    placeholder="비밀번호 변경 시에만 입력"
+                  />
+                </td>
+              </tr>
+              <tr>
+                <th>새 비밀번호 확인</th>
+                <td>
+                  <TextInput
+                    required={Boolean(ctx.data.currentPassword || ctx.data.newPassword)}
+                    minLength={8}
+                    validate={() =>
+                      ctx.data.newPassword !== ctx.data.confirmPassword
+                        ? "비밀번호가 일치하지 않습니다"
+                        : ""
+                    }
+                    class="w-56"
+                    type="password"
+                    autocomplete="off"
+                    value={ctx.data.confirmPassword}
+                    onValueChange={(v) => ctx.setData("confirmPassword", v)}
+                    placeholder="비밀번호 변경 시에만 입력"
+                  />
+                </td>
+              </tr>
+            </FormTable>
+          </section>
+
+          <section>
+            <h3 class="mb-4 border-l-4 border-base-500 pl-3 font-bold text-base-500">시스템설정</h3>
+            <FormTable>
+              <tbody>
+                <tr>
+                  <th>로그인 시 화면</th>
+                  <td>
+                    <Select
+                      class="w-full"
+                      value={ctx.data.firstRouterLink}
+                      onValueChange={(v) => ctx.setData("firstRouterLink", v)}
+                      items={routeOptions()}
+                      renderValue={(v) => <>{routeMap().get(v) ?? v}</>}
+                      placeholder="선택 안함"
+                    >
+                      <Select.ItemTemplate>
+                        {(href: string) => <>{routeMap().get(href) ?? href}</>}
+                      </Select.ItemTemplate>
+                      <Select.Action
+                        onClick={() => ctx.setData("firstRouterLink", undefined as any)}
+                      >
+                        <Icon icon={IconX} class={"text-danger-500"} />
+                      </Select.Action>
+                    </Select>
+                  </td>
+                </tr>
+              </tbody>
+            </FormTable>
+          </section>
+        </div>
+      )}
+    </CrudDetail>
+  );
+}