refactor file tree
This commit is contained in:
@@ -65,18 +65,18 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { Toast } from "tdesign-mobile-vue";
|
import { Toast } from "tdesign-mobile-vue";
|
||||||
import {
|
import {
|
||||||
calculateManagementQrCodeGrid,
|
calculateQrCodeGrid,
|
||||||
downloadManagementQrCodeImages,
|
downloadQrCodeImages,
|
||||||
printManagementQrCodeImages,
|
printQrCodeImages,
|
||||||
splitManagementQrCodePages
|
splitQrCodePages
|
||||||
} from "@/utils/managementQrCode";
|
} from "@/utils/qrCode";
|
||||||
import { permissionCodes } from "@/utils/permission";
|
import { permissionCodes } from "@/utils/permission";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementQrCode"
|
name: "CustomerQrCode"
|
||||||
});
|
});
|
||||||
|
|
||||||
interface ManagementQrCodeFormModel {
|
interface QrCodeFormModel {
|
||||||
prefix: string;
|
prefix: string;
|
||||||
start: string;
|
start: string;
|
||||||
digits: number;
|
digits: number;
|
||||||
@@ -88,7 +88,7 @@ const maxDigits = 16;
|
|||||||
const defaultDigits = 3;
|
const defaultDigits = 3;
|
||||||
const storageKey = "management-qr-code-config";
|
const storageKey = "management-qr-code-config";
|
||||||
|
|
||||||
const formModel = reactive<ManagementQrCodeFormModel>({
|
const formModel = reactive<QrCodeFormModel>({
|
||||||
prefix: "GAO",
|
prefix: "GAO",
|
||||||
start: "1",
|
start: "1",
|
||||||
digits: defaultDigits,
|
digits: defaultDigits,
|
||||||
@@ -110,9 +110,9 @@ const codeList = computed(() => {
|
|||||||
const startMinDigits = computed(() => Math.max(minDigits, Math.min(maxDigits, normalizeNumber(formModel.start).length || minDigits)));
|
const startMinDigits = computed(() => Math.max(minDigits, Math.min(maxDigits, normalizeNumber(formModel.start).length || minDigits)));
|
||||||
const effectiveDigits = computed(() => Math.max(startMinDigits.value, Math.min(maxDigits, formModel.digits || defaultDigits)));
|
const effectiveDigits = computed(() => Math.max(startMinDigits.value, Math.min(maxDigits, formModel.digits || defaultDigits)));
|
||||||
const maxCodeLength = computed(() => formModel.prefix.length + effectiveDigits.value);
|
const maxCodeLength = computed(() => formModel.prefix.length + effectiveDigits.value);
|
||||||
const previewPages = computed(() => splitManagementQrCodePages(codeList.value, maxCodeLength.value));
|
const previewPages = computed(() => splitQrCodePages(codeList.value, maxCodeLength.value));
|
||||||
const visiblePreviewPages = computed(() => previewPages.value.slice(0, 1));
|
const visiblePreviewPages = computed(() => previewPages.value.slice(0, 1));
|
||||||
const paperGrid = computed(() => calculateManagementQrCodeGrid(maxCodeLength.value));
|
const paperGrid = computed(() => calculateQrCodeGrid(maxCodeLength.value));
|
||||||
const paperStyle = computed(() => ({
|
const paperStyle = computed(() => ({
|
||||||
gridTemplateRows: `repeat(${paperGrid.value.rows}, minmax(0, 1fr))`,
|
gridTemplateRows: `repeat(${paperGrid.value.rows}, minmax(0, 1fr))`,
|
||||||
gridTemplateColumns: `repeat(${paperGrid.value.columns}, minmax(0, 1fr))`
|
gridTemplateColumns: `repeat(${paperGrid.value.columns}, minmax(0, 1fr))`
|
||||||
@@ -144,7 +144,7 @@ function loadLocalConfig(): void {
|
|||||||
}
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const config = JSON.parse(cache) as Partial<ManagementQrCodeFormModel>;
|
const config = JSON.parse(cache) as Partial<QrCodeFormModel>;
|
||||||
const start = normalizeNumber(config.start);
|
const start = normalizeNumber(config.start);
|
||||||
const startDigits = Math.max(minDigits, Math.min(maxDigits, start.length || minDigits));
|
const startDigits = Math.max(minDigits, Math.min(maxDigits, start.length || minDigits));
|
||||||
|
|
||||||
@@ -197,7 +197,7 @@ async function downloadImages(): Promise<void> {
|
|||||||
downloading.value = true;
|
downloading.value = true;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await downloadManagementQrCodeImages({
|
await downloadQrCodeImages({
|
||||||
codes: codeList.value,
|
codes: codeList.value,
|
||||||
filePrefix: `${finalStartCode.value}-${finalEndCode.value}`,
|
filePrefix: `${finalStartCode.value}-${finalEndCode.value}`,
|
||||||
maxCodeLength: maxCodeLength.value
|
maxCodeLength: maxCodeLength.value
|
||||||
@@ -214,7 +214,7 @@ async function printQrCode(): Promise<void> {
|
|||||||
|
|
||||||
printing.value = true;
|
printing.value = true;
|
||||||
try {
|
try {
|
||||||
await printManagementQrCodeImages({
|
await printQrCodeImages({
|
||||||
codes: codeList.value,
|
codes: codeList.value,
|
||||||
maxCodeLength: maxCodeLength.value,
|
maxCodeLength: maxCodeLength.value,
|
||||||
title: `${finalStartCode.value}-${finalEndCode.value}`
|
title: `${finalStartCode.value}-${finalEndCode.value}`
|
||||||
@@ -48,7 +48,7 @@ import SegmentedSlider from "@/components/SegmentedSlider.vue";
|
|||||||
import { useSettingStore } from "@/store/settingStore";
|
import { useSettingStore } from "@/store/settingStore";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementSettings"
|
name: "AppSettings"
|
||||||
});
|
});
|
||||||
|
|
||||||
const globalUIStore = useGlobalUIStore();
|
const globalUIStore = useGlobalUIStore();
|
||||||
@@ -54,7 +54,7 @@ interface ChartProfile {
|
|||||||
}
|
}
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementDataCharts"
|
name: "StoreDataCharts"
|
||||||
});
|
});
|
||||||
|
|
||||||
use([
|
use([
|
||||||
@@ -17,7 +17,7 @@ import { useUserStore } from "timi-web";
|
|||||||
import { permissionCodes } from "@/utils/permission";
|
import { permissionCodes } from "@/utils/permission";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "CustomerTab"
|
name: "HomeTab"
|
||||||
});
|
});
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -96,7 +96,7 @@ type MenuGroup = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementTab"
|
name: "SettingTab"
|
||||||
});
|
});
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -20,7 +20,7 @@ import { Toast } from "tdesign-mobile-vue";
|
|||||||
import { UserAPI, useUserStore } from "timi-web";
|
import { UserAPI, useUserStore } from "timi-web";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementPassword"
|
name: "UserPassword"
|
||||||
});
|
});
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -61,7 +61,7 @@ type UserAvatarSource = NonNullable<Parameters<typeof UserAPI.getAvatarURL>[0]>
|
|||||||
};
|
};
|
||||||
type ProfileGender = Gender | "";
|
type ProfileGender = Gender | "";
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "ManagementProfile"
|
name: "UserProfile"
|
||||||
});
|
});
|
||||||
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
@@ -3,8 +3,8 @@ import type { RouteRecordRaw } from "vue-router";
|
|||||||
const chartRoutes: RouteRecordRaw[] = [
|
const chartRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: "/management/data-charts",
|
path: "/management/data-charts",
|
||||||
name: "ManagementDataCharts",
|
name: "StoreDataCharts",
|
||||||
component: () => import("@/pages/management/ManagementDataCharts.vue"),
|
component: () => import("@/pages/store/StoreDataCharts.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
depth: 3,
|
depth: 3,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -18,7 +18,7 @@ const chartRoutes: RouteRecordRaw[] = [
|
|||||||
{
|
{
|
||||||
path: "/management/customer-data-charts",
|
path: "/management/customer-data-charts",
|
||||||
name: "CustomerDataCharts",
|
name: "CustomerDataCharts",
|
||||||
component: () => import("@/pages/management/CustomerDataCharts.vue"),
|
component: () => import("@/pages/customer/CustomerDataCharts.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
depth: 3,
|
depth: 3,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -32,7 +32,7 @@ const chartRoutes: RouteRecordRaw[] = [
|
|||||||
{
|
{
|
||||||
path: "/management/customers/:id/data-charts",
|
path: "/management/customers/:id/data-charts",
|
||||||
name: "CustomerDataChartsFromCustomer",
|
name: "CustomerDataChartsFromCustomer",
|
||||||
component: () => import("@/pages/management/CustomerDataCharts.vue"),
|
component: () => import("@/pages/customer/CustomerDataCharts.vue"),
|
||||||
meta: {
|
meta: {
|
||||||
depth: 5,
|
depth: 5,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import QuickEntryPage from "@/pages/customer/QuickEntryPage.vue";
|
import QuickEntryPage from "@/pages/home/QuickEntryPage.vue";
|
||||||
import QuickSignInPage from "@/pages/customer/QuickSignInPage.vue";
|
import QuickSignInPage from "@/pages/home/QuickSignInPage.vue";
|
||||||
import EventRecordEdit from "@/pages/management/EventRecordEdit.vue";
|
import EventRecordEdit from "@/pages/event/EventRecordEdit.vue";
|
||||||
import CustomerList from "@/pages/management/CustomerList.vue";
|
import CustomerList from "@/pages/customer/CustomerList.vue";
|
||||||
import CustomerDetail from "@/pages/management/CustomerDetail.vue";
|
import CustomerDetail from "@/pages/customer/CustomerDetail.vue";
|
||||||
import CustomerEdit from "@/pages/management/CustomerEdit.vue";
|
import CustomerEdit from "@/pages/customer/CustomerEdit.vue";
|
||||||
|
|
||||||
const customerRoutes: RouteRecordRaw[] = [
|
const customerRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,12 +1,12 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import ManagementSettings from "@/pages/management/ManagementSettings.vue";
|
import AppSettings from "@/pages/setting/AppSettings.vue";
|
||||||
import ManagementProfile from "@/pages/management/ManagementProfile.vue";
|
import UserProfile from "@/pages/user/UserProfile.vue";
|
||||||
import ManagementPassword from "@/pages/management/ManagementPassword.vue";
|
import UserPassword from "@/pages/user/UserPassword.vue";
|
||||||
import ManagementQrCode from "@/pages/management/ManagementQrCode.vue";
|
import CustomerQrCode from "@/pages/customer/CustomerQrCode.vue";
|
||||||
import StoreBusinessDayCalendar from "@/pages/management/StoreBusinessDayCalendar.vue";
|
import StoreBusinessDayCalendar from "@/pages/store/StoreBusinessDayCalendar.vue";
|
||||||
import StoreEdit from "@/pages/management/StoreEdit.vue";
|
import StoreEdit from "@/pages/store/StoreEdit.vue";
|
||||||
import StoreList from "@/pages/management/StoreList.vue";
|
import StoreList from "@/pages/store/StoreList.vue";
|
||||||
import StoreSort from "@/pages/management/StoreSort.vue";
|
import StoreSort from "@/pages/store/StoreSort.vue";
|
||||||
|
|
||||||
export const storeRoutes: RouteRecordRaw[] = [
|
export const storeRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
@@ -84,8 +84,8 @@ export const storeRoutes: RouteRecordRaw[] = [
|
|||||||
export const managementSettingRoutes: RouteRecordRaw[] = [
|
export const managementSettingRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: "/management/settings",
|
path: "/management/settings",
|
||||||
name: "ManagementSettings",
|
name: "AppSettings",
|
||||||
component: ManagementSettings,
|
component: AppSettings,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 3,
|
depth: 3,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -101,8 +101,8 @@ export const managementSettingRoutes: RouteRecordRaw[] = [
|
|||||||
export const managementAccountRoutes: RouteRecordRaw[] = [
|
export const managementAccountRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: "/management/profile",
|
path: "/management/profile",
|
||||||
name: "ManagementProfile",
|
name: "UserProfile",
|
||||||
component: ManagementProfile,
|
component: UserProfile,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 3,
|
depth: 3,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -115,8 +115,8 @@ export const managementAccountRoutes: RouteRecordRaw[] = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/management/profile/password",
|
path: "/management/profile/password",
|
||||||
name: "ManagementPassword",
|
name: "UserPassword",
|
||||||
component: ManagementPassword,
|
component: UserPassword,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 4,
|
depth: 4,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -129,8 +129,8 @@ export const managementAccountRoutes: RouteRecordRaw[] = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/management/qr-code",
|
path: "/management/qr-code",
|
||||||
name: "ManagementQrCode",
|
name: "CustomerQrCode",
|
||||||
component: ManagementQrCode,
|
component: CustomerQrCode,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 3,
|
depth: 3,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
|
|||||||
@@ -1,12 +1,12 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import PermissionSettings from "@/pages/management/PermissionSettings.vue";
|
import PermissionSettings from "@/pages/permission/PermissionSettings.vue";
|
||||||
import RoleList from "@/pages/management/RoleList.vue";
|
import RoleList from "@/pages/permission/RoleList.vue";
|
||||||
import RoleEdit from "@/pages/management/RoleEdit.vue";
|
import RoleEdit from "@/pages/permission/RoleEdit.vue";
|
||||||
import PermissionList from "@/pages/management/PermissionList.vue";
|
import PermissionList from "@/pages/permission/PermissionList.vue";
|
||||||
import PermissionEdit from "@/pages/management/PermissionEdit.vue";
|
import PermissionEdit from "@/pages/permission/PermissionEdit.vue";
|
||||||
import RolePermissionAssign from "@/pages/management/RolePermissionAssign.vue";
|
import RolePermissionAssign from "@/pages/permission/RolePermissionAssign.vue";
|
||||||
import RoleDelegationPermissionAssign from "@/pages/management/RoleDelegationPermissionAssign.vue";
|
import RoleDelegationPermissionAssign from "@/pages/permission/RoleDelegationPermissionAssign.vue";
|
||||||
import UserRoleAssign from "@/pages/management/UserRoleAssign.vue";
|
import UserRoleAssign from "@/pages/user/UserRoleAssign.vue";
|
||||||
|
|
||||||
const permissionRoutes: RouteRecordRaw[] = [
|
const permissionRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,10 +1,10 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import EventEdit from "@/pages/management/EventEdit.vue";
|
import EventEdit from "@/pages/event/EventEdit.vue";
|
||||||
import eventList from "@/pages/management/EventList.vue";
|
import eventList from "@/pages/event/EventList.vue";
|
||||||
import EventSort from "@/pages/management/EventSort.vue";
|
import EventSort from "@/pages/event/EventSort.vue";
|
||||||
import EventRecordDetail from "@/pages/management/EventRecordDetail.vue";
|
import EventRecordDetail from "@/pages/event/EventRecordDetail.vue";
|
||||||
import EventRecordEdit from "@/pages/management/EventRecordEdit.vue";
|
import EventRecordEdit from "@/pages/event/EventRecordEdit.vue";
|
||||||
import EventRecordList from "@/pages/management/EventRecordList.vue";
|
import EventRecordList from "@/pages/event/EventRecordList.vue";
|
||||||
|
|
||||||
const registrationRoutes: RouteRecordRaw[] = [
|
const registrationRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,12 +1,12 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import CustomerTab from "@/pages/tabs/CustomerTab.vue";
|
import HomeTab from "@/pages/tabs/HomeTab.vue";
|
||||||
import ManagementTab from "@/pages/tabs/ManagementTab.vue";
|
import SettingTab from "@/pages/tabs/SettingTab.vue";
|
||||||
|
|
||||||
const tabRoutes: RouteRecordRaw[] = [
|
const tabRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
path: "/customers",
|
path: "/customers",
|
||||||
name: "CustomerTab",
|
name: "HomeTab",
|
||||||
component: CustomerTab,
|
component: HomeTab,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 2,
|
depth: 2,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
@@ -19,8 +19,8 @@ const tabRoutes: RouteRecordRaw[] = [
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: "/management",
|
path: "/management",
|
||||||
name: "ManagementTab",
|
name: "SettingTab",
|
||||||
component: ManagementTab,
|
component: SettingTab,
|
||||||
meta: {
|
meta: {
|
||||||
depth: 2,
|
depth: 2,
|
||||||
navBarVisible: true,
|
navBarVisible: true,
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import type { RouteRecordRaw } from "vue-router";
|
import type { RouteRecordRaw } from "vue-router";
|
||||||
import UserList from "@/pages/management/UserList.vue";
|
import UserList from "@/pages/user/UserList.vue";
|
||||||
import UserDetail from "@/pages/management/UserDetail.vue";
|
import UserDetail from "@/pages/user/UserDetail.vue";
|
||||||
import UserEdit from "@/pages/management/UserEdit.vue";
|
import UserEdit from "@/pages/user/UserEdit.vue";
|
||||||
import UserRoleAssign from "@/pages/management/UserRoleAssign.vue";
|
import UserRoleAssign from "@/pages/user/UserRoleAssign.vue";
|
||||||
|
|
||||||
const userRoutes: RouteRecordRaw[] = [
|
const userRoutes: RouteRecordRaw[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,23 +1,23 @@
|
|||||||
import { BarcodeFormat, EncodeHintType, QRCodeWriter } from "@zxing/library";
|
import { BarcodeFormat, EncodeHintType, QRCodeWriter } from "@zxing/library";
|
||||||
|
|
||||||
export interface ManagementQrCodePage {
|
export interface QrCodePage {
|
||||||
pageIndex: number;
|
pageIndex: number;
|
||||||
codes: string[];
|
codes: string[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface DownloadManagementQrCodeOptions {
|
export interface DownloadQrCodeOptions {
|
||||||
codes: string[];
|
codes: string[];
|
||||||
filePrefix: string;
|
filePrefix: string;
|
||||||
maxCodeLength?: number;
|
maxCodeLength?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PrintManagementQrCodeOptions {
|
export interface PrintQrCodeOptions {
|
||||||
codes: string[];
|
codes: string[];
|
||||||
maxCodeLength?: number;
|
maxCodeLength?: number;
|
||||||
title?: string;
|
title?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ManagementQrCodeGrid {
|
export interface QrCodeGrid {
|
||||||
rows: number;
|
rows: number;
|
||||||
columns: number;
|
columns: number;
|
||||||
pageSize: number;
|
pageSize: number;
|
||||||
@@ -40,7 +40,7 @@ const qrEncodeHints = new Map<EncodeHintType, string | number>([
|
|||||||
[EncodeHintType.MARGIN, 4]
|
[EncodeHintType.MARGIN, 4]
|
||||||
]);
|
]);
|
||||||
|
|
||||||
export function calculateManagementQrCodeGrid(maxCodeLength = 0): ManagementQrCodeGrid {
|
export function calculateQrCodeGrid(maxCodeLength = 0): QrCodeGrid {
|
||||||
const codeTextMinWidth = Math.ceil(maxCodeLength * codeFontSize * codeTextWidthRatio + codeTextHorizontalPadding);
|
const codeTextMinWidth = Math.ceil(maxCodeLength * codeFontSize * codeTextWidthRatio + codeTextHorizontalPadding);
|
||||||
const cellMinWidth = Math.max(qrSize + minCellGap, codeTextMinWidth + minCellGap);
|
const cellMinWidth = Math.max(qrSize + minCellGap, codeTextMinWidth + minCellGap);
|
||||||
const cellMinHeight = qrSize + codeTopGap + codeFontSize + minCellGap;
|
const cellMinHeight = qrSize + codeTopGap + codeFontSize + minCellGap;
|
||||||
@@ -54,9 +54,9 @@ export function calculateManagementQrCodeGrid(maxCodeLength = 0): ManagementQrCo
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export function splitManagementQrCodePages(codes: string[], maxCodeLength = 0): ManagementQrCodePage[] {
|
export function splitQrCodePages(codes: string[], maxCodeLength = 0): QrCodePage[] {
|
||||||
const pages: ManagementQrCodePage[] = [];
|
const pages: QrCodePage[] = [];
|
||||||
const pageSize = calculateManagementQrCodeGrid(maxCodeLength).pageSize;
|
const pageSize = calculateQrCodeGrid(maxCodeLength).pageSize;
|
||||||
|
|
||||||
for (let index = 0; index < codes.length; index += pageSize) {
|
for (let index = 0; index < codes.length; index += pageSize) {
|
||||||
pages.push({
|
pages.push({
|
||||||
@@ -68,23 +68,23 @@ export function splitManagementQrCodePages(codes: string[], maxCodeLength = 0):
|
|||||||
return pages;
|
return pages;
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function downloadManagementQrCodeImages(options: DownloadManagementQrCodeOptions): Promise<void> {
|
export async function downloadQrCodeImages(options: DownloadQrCodeOptions): Promise<void> {
|
||||||
const pages = splitManagementQrCodePages(options.codes, options.maxCodeLength);
|
const pages = splitQrCodePages(options.codes, options.maxCodeLength);
|
||||||
|
|
||||||
for (const page of pages) {
|
for (const page of pages) {
|
||||||
const canvas = renderManagementQrCodePage(page.codes, options.maxCodeLength);
|
const canvas = renderQrCodePage(page.codes, options.maxCodeLength);
|
||||||
await downloadCanvas(canvas, `${options.filePrefix}-${String(page.pageIndex + 1).padStart(2, "0")}.png`);
|
await downloadCanvas(canvas, `${options.filePrefix}-${String(page.pageIndex + 1).padStart(2, "0")}.png`);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export async function printManagementQrCodeImages(options: PrintManagementQrCodeOptions): Promise<void> {
|
export async function printQrCodeImages(options: PrintQrCodeOptions): Promise<void> {
|
||||||
const printWindow = window.open("", "_blank");
|
const printWindow = window.open("", "_blank");
|
||||||
if (!printWindow) {
|
if (!printWindow) {
|
||||||
throw new Error("浏览器阻止了打印窗口,请允许弹出窗口后重试");
|
throw new Error("浏览器阻止了打印窗口,请允许弹出窗口后重试");
|
||||||
}
|
}
|
||||||
|
|
||||||
const pages = splitManagementQrCodePages(options.codes, options.maxCodeLength);
|
const pages = splitQrCodePages(options.codes, options.maxCodeLength);
|
||||||
const imageList = pages.map(page => renderManagementQrCodePage(page.codes, options.maxCodeLength).toDataURL("image/png"));
|
const imageList = pages.map(page => renderQrCodePage(page.codes, options.maxCodeLength).toDataURL("image/png"));
|
||||||
const title = options.title || "客户二维码打印";
|
const title = options.title || "客户二维码打印";
|
||||||
const imageHTML = imageList.map(src => `<section class="page"><img src="${src}" alt="客户二维码" /></section>`).join("");
|
const imageHTML = imageList.map(src => `<section class="page"><img src="${src}" alt="客户二维码" /></section>`).join("");
|
||||||
|
|
||||||
@@ -138,11 +138,11 @@ export async function printManagementQrCodeImages(options: PrintManagementQrCode
|
|||||||
printWindow.print();
|
printWindow.print();
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderManagementQrCodePage(codes: string[], maxCodeLength = 0): HTMLCanvasElement {
|
function renderQrCodePage(codes: string[], maxCodeLength = 0): HTMLCanvasElement {
|
||||||
const canvas = document.createElement("canvas");
|
const canvas = document.createElement("canvas");
|
||||||
canvas.width = pageWidth;
|
canvas.width = pageWidth;
|
||||||
canvas.height = pageHeight;
|
canvas.height = pageHeight;
|
||||||
const grid = calculateManagementQrCodeGrid(maxCodeLength);
|
const grid = calculateQrCodeGrid(maxCodeLength);
|
||||||
|
|
||||||
const context = canvas.getContext("2d");
|
const context = canvas.getContext("2d");
|
||||||
if (!context) {
|
if (!context) {
|
||||||
@@ -199,7 +199,7 @@ function escapeHTML(value: string): string {
|
|||||||
.replaceAll("\"", """);
|
.replaceAll("\"", """);
|
||||||
}
|
}
|
||||||
|
|
||||||
function drawGridLines(context: CanvasRenderingContext2D, grid: ManagementQrCodeGrid, cellWidth: number, cellHeight: number): void {
|
function drawGridLines(context: CanvasRenderingContext2D, grid: QrCodeGrid, cellWidth: number, cellHeight: number): void {
|
||||||
context.strokeStyle = "#d1d5db";
|
context.strokeStyle = "#d1d5db";
|
||||||
context.lineWidth = gridLineWidth;
|
context.lineWidth = gridLineWidth;
|
||||||
|
|
||||||
Reference in New Issue
Block a user