Просмотр исходного кода

😎1、修复打印模板默认纸张大小和状态 2、升级npm包依赖

zuohuaijun 1 год назад
Родитель
Сommit
02f971b55f

+ 5 - 5
Web/package.json

@@ -2,7 +2,7 @@
 	"name": "admin.net",
 	"type": "module",
 	"version": "2.4.33",
-	"lastBuildTime": "2024.08.24",
+	"lastBuildTime": "2024.08.28",
 	"description": "Admin.NET 站在巨人肩膀上的 .NET 通用权限开发框架",
 	"author": "zuohuaijun",
 	"license": "MIT",
@@ -21,7 +21,7 @@
 		"@vue-office/docx": "^1.6.2",
 		"@vue-office/excel": "^1.7.11",
 		"@vue-office/pdf": "^2.0.2",
-		"@vueuse/core": "^11.0.1",
+		"@vueuse/core": "^11.0.3",
 		"@wangeditor/editor": "^5.1.23",
 		"@wangeditor/editor-for-vue": "^5.1.12",
 		"animate.css": "^4.1.1",
@@ -75,12 +75,12 @@
 		"@types/node": "^20.14.15",
 		"@types/nprogress": "^0.2.3",
 		"@types/sortablejs": "^1.15.8",
-		"@typescript-eslint/eslint-plugin": "^8.2.0",
-		"@typescript-eslint/parser": "^8.2.0",
+		"@typescript-eslint/eslint-plugin": "^8.3.0",
+		"@typescript-eslint/parser": "^8.3.0",
 		"@vitejs/plugin-vue": "^5.1.2",
 		"@vitejs/plugin-vue-jsx": "^4.0.1",
 		"@vue/compiler-sfc": "^3.4.38",
-		"code-inspector-plugin": "^0.15.2",
+		"code-inspector-plugin": "^0.16.0",
 		"eslint": "^9.9.1",
 		"eslint-plugin-vue": "^9.27.0",
 		"globals": "^15.9.0",

+ 1 - 0
Web/src/views/system/print/component/editPrint.vue

@@ -122,6 +122,7 @@ const loadTemplate = () => {
 	hiprintDesignRef.value?.hiprintTemplate.clear();
 	if (JSON.stringify(state.ruleForm) !== '{}') {
 		hiprintDesignRef.value?.hiprintTemplate.update(JSON.parse(state.ruleForm.template));
+		hiprintDesignRef.value?.initPaper();
 	}
 };
 

+ 18 - 8
Web/src/views/system/print/component/hiprint/index.vue

@@ -70,19 +70,19 @@
 
 	<el-row :gutter="8">
 		<el-col :span="4">
-			<el-card style="height: 100%" shadow="never">
+			<el-card style="height: 100%" shadow="never" :body-style="{ padding: '0px 0 5px 7px' }">
 				<el-row>
 					<el-col :span="24" id="hiprintEpContainer" class="rect-printElement-types hiprintEpContainer"> </el-col>
 				</el-row>
 			</el-card>
 		</el-col>
 		<el-col :span="14">
-			<el-card shadow="never" class="card-design">
+			<el-card shadow="never" class="card-design" :body-style="{ padding: '18px' }">
 				<div id="hiprint-printTemplate" class="hiprint-printTemplate"></div>
 			</el-card>
 		</el-col>
 		<el-col :span="6" class="params_setting_container">
-			<el-card shadow="never">
+			<el-card shadow="never" :body-style="{ padding: '0px' }">
 				<el-row class="hinnn-layout-sider">
 					<div id="PrintElementOptionSetting"></div>
 				</el-row>
@@ -163,13 +163,14 @@ const state = reactive({
 
 // 计算当前纸张类型
 const curPaperType = computed(() => {
+	let { width, height } = state.curPaper;
 	let type = 'other';
 	let types: any = state.paperTypes;
 	for (const key in types) {
 		let item = types[key];
-		let { width, height } = state.curPaper;
 		if (item.width === width && item.height === height) {
 			type = key;
+			break;
 		}
 	}
 	return type;
@@ -181,7 +182,6 @@ const changeMode = () => {
 	hiprint.init({
 		providers: [provider.f],
 	});
-
 	// 渲染自定义选项
 	const hiprintEpContainerEl = document.getElementById('hiprintEpContainer');
 	if (hiprintEpContainerEl) {
@@ -212,7 +212,7 @@ const changeMode = () => {
 	});
 	hiprintTemplate.value.design('#hiprint-printTemplate');
 	// 获取当前放大比例, 当zoom时传true才会有
-	state.scaleValue = hiprintTemplate.value.editingPanel.scale || 1;
+	state.scaleValue = hiprintTemplate.value.editingPanel?.scale ?? 1;
 };
 
 /**
@@ -239,7 +239,7 @@ const changeScale = (currentValue: number, oldValue: number) => {
 	let big = false;
 	currentValue <= oldValue ? (big = false) : (big = true);
 
-	let scaleVal = state.scaleValue;
+	let scaleVal = currentValue;
 	if (big) {
 		if (scaleVal > state.scaleMax) scaleVal = 5;
 	} else {
@@ -322,8 +322,18 @@ onMounted(() => {
 	// otherPaper(); // 默认纸张
 });
 
+// 初始化纸张大小
+const initPaper = () => {
+	var template = hiprintTemplate.value.getJson();
+	var width = template.panels[0].width;
+	var height = template.panels[0].height;
+
+	state.curPaper = { type: '', width: width, height: height }; // 计算纸张类型和状态
+	hiprintTemplate.value.setPaper(width, height); // 设置纸张大小
+};
+
 // 导出对象
-defineExpose({ hiprintTemplate });
+defineExpose({ hiprintTemplate, initPaper });
 </script>
 
 <style lang="scss" scoped>