From d6cc07d3e9c19a4f97f770581bc85ee3550a22ba Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期五, 25 十月 2024 16:48:24 +0800
Subject: [PATCH] 数学
---
src/books/mathBook/view/components/index.vue | 6 +-
src/components/paint/index.vue | 58 ++++++++++++++++++-----------
src/books/mathBook/view/components/chapter003.vue | 16 ++++----
3 files changed, 47 insertions(+), 33 deletions(-)
diff --git a/src/books/mathBook/view/components/chapter003.vue b/src/books/mathBook/view/components/chapter003.vue
index b168661..d9aa899 100644
--- a/src/books/mathBook/view/components/chapter003.vue
+++ b/src/books/mathBook/view/components/chapter003.vue
@@ -1540,23 +1540,17 @@
</p>
<p class="img fl fl-cn ju-cn">
<span>鍥�3-15</span>
- <el-tooltip class="item" effect="dark" :content="chapterData.isCollectImg ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌'"
- placement="top-start">
<img :src="collectResourceList.findIndex(item => item.id == '722FE833') > -1 ? collectCheck : collectImg"
alt="" class="collect-btn" @click="handleCollect('img')" />
- </el-tooltip>
</p>
<video :src="videoPath" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true"
x5-video-orientation="h5" x5-video-player-fullscreen="true" x5-playsinline="" controls
controlslist="nodownload" class="video-border w100"></video>
<p class="img fl fl-cn ju-cn">
<span>瑙嗛锛氬垽鏁板嚱鏁板鍋舵�х殑鏂规硶鍜屾楠� </span>
- <el-tooltip class="item" effect="dark" :content="chapterData.isCollectVideo ? '鐐瑰嚮鍙栨秷' : '鐐瑰嚮鏀惰棌'"
- placement="top-start">
<img
:src="collectResourceList.findIndex(item => item.id == 'a28cd862d61b5df2201406b76e9f01b0') > -1 ? collectCheck : collectImg"
alt="" class="collect-btn" @click="handleCollect('video')" />
- </el-tooltip>
</p>
<p class="fl">
<span>
@@ -1799,6 +1793,12 @@
this.config.activeBook.resourceUrl + '/images/0103-2.jpg'
"
/>
+ <!-- <graffiti
+ :page="99"
+ :bcImg="this.config.activeBook.resourceUrl + '/images/0103-2.jpg'"
+ :imgWidth="400"
+ :imgHeight="380"
+ /> -->
</div>
</div>
</div>
@@ -2899,6 +2899,7 @@
<script>
import paint from '@/components/paint/index.vue'
+import graffiti from '@/components/graffiti/index.vue'
import examinations from '@/components/examinations/index.vue'
import { getResourcePath } from "@/assets/methods/resources";
import { getCollectResource, setCollectResource } from "@/assets/methods/resources";
@@ -2921,7 +2922,7 @@
type: Object,
},
},
- components: {examinations,paint},
+ components: {examinations,paint,graffiti},
data() {
return {
...showObj,
@@ -3017,7 +3018,6 @@
},
//璧勬簮鏀惰棌浜嬩欢
handleCollectResource(id, md5, resourcePath, resourceType, source, resourceName) {
- console.log(this.collectResourceList);
let list = this.collectResourceList
if (list.findIndex(item => item.id == id) > -1) {
list = list.filter(item => item.id != id)
diff --git a/src/books/mathBook/view/components/index.vue b/src/books/mathBook/view/components/index.vue
index db41812..6dc4112 100644
--- a/src/books/mathBook/view/components/index.vue
+++ b/src/books/mathBook/view/components/index.vue
@@ -188,8 +188,8 @@
}, 500);
// 娴嬭瘯椤甸潰璺宠浆
- // setTimeout(() => {
- // this.gotoPage(3,51);
+ setTimeout(() => {
+ this.gotoPage(4,99);
// // setTimeout(() => {
// // this.renderSign("Highlight", {
// // id: "2ACA9359",
@@ -217,7 +217,7 @@
// // txt: " 杩愬姩绯荤粺鏄敱楠ㄣ�侀杩炵粨鍜岄楠艰倢涓夐儴鍒嗙粍鎴愮殑銆傚叏韬殑楠ㄩ�氳繃楠ㄨ繛缁撶粍鎴愪汉浣撻楠硷紙瑙佸浘1-1锛夈�傞楠兼槸浜轰綋鐨勬敮鏋讹紝鍏锋湁淇濇姢鍐呰剰鍣ㄥ畼銆佷緵鑲岃倝闄勭潃鍜屼綔涓鸿倢鑲夎繍鍔ㄧ殑鏉犳潌绛変綔鐢ㄣ�傚湪绁炵粡绯荤粺鐨勬敮閰嶄笅锛岃倢鑲夋敹缂╃壍鍔ㄦ墍闄勭潃鐨勯缁曠潃鍏宠妭杞姩锛屼娇韬綋浜х敓鍚勭鍔ㄤ綔銆傛墍浠ワ紝杩愬姩绯荤粺鍏锋湁杩愬姩銆佹敮鎸佸拰淇濇姢绛夊姛鑳斤紝骞煎勾鏃舵湡鐨勯楠艰繕鍏锋湁閫犺鍔熻兘銆� ",
// // txtIndex: 57
// // });
- // }, 500);
+ }, 500);
// 鑾峰彇棰樼洰id鍒楄〃
this.getQuestionId();
diff --git a/src/components/paint/index.vue b/src/components/paint/index.vue
index 114d6c7..eadb1e3 100644
--- a/src/components/paint/index.vue
+++ b/src/components/paint/index.vue
@@ -13,8 +13,7 @@
</button>
<button @click="saveImgData">淇濆瓨</button>
</li>
- <li>
- </li>
+ <li></li>
<li>
<label>鐢荤瑪锛�</label>
<select name="" id="" @change="changeBrush" v-model="brush">
@@ -121,10 +120,10 @@
type: Number,
default: 1,
},
- canvasHeight:{
- type:Number,
- default:380
- }
+ canvasHeight: {
+ type: Number,
+ default: 380,
+ },
},
mounted() {
this.init();
@@ -132,14 +131,17 @@
methods: {
// 鍒濆鍖栫敾甯�
init() {
- this.canvas = new fabric.Canvas("canvas", {
- isDrawingMode: true,
- });
+ this.canvas = new fabric.Canvas(
+ (this.container ? this.container : document).querySelector("#canvas"),
+ {
+ isDrawingMode: true,
+ }
+ );
// 璁剧疆鑳屾櫙
- this.setBackgroundImage()
+ this.setBackgroundImage();
//
fabric.Object.prototype.transparentCorners = false;
- this.setBrush()
+ this.setBrush();
},
// 鍒涘缓鍚勭绗斿埛
setBrush() {
@@ -147,7 +149,10 @@
// 鐢荤瑪鏍峰紡
this.vLinePatternBrush = new fabric.PatternBrush(this.canvas);
this.vLinePatternBrush.getPatternSrc = () => {
- let patternCanvas = fabric.document.createElement("canvas");
+ let patternCanvas =
+ fabric[this.container ? this.container : document].createElement(
+ "canvas"
+ );
patternCanvas.width = patternCanvas.height = 10;
let ctx = patternCanvas.getContext("2d");
ctx.strokeStyle = this.lineColor;
@@ -161,7 +166,10 @@
};
this.hLinePatternBrush = new fabric.PatternBrush(this.canvas);
this.hLinePatternBrush.getPatternSrc = function () {
- let patternCanvas = fabric.document.createElement("canvas");
+ let patternCanvas =
+ fabric[this.container ? this.container : document].createElement(
+ "canvas"
+ );
patternCanvas.width = patternCanvas.height = 10;
let ctx = patternCanvas.getContext("2d");
ctx.strokeStyle = this.lineColor;
@@ -177,7 +185,10 @@
this.squarePatternBrush.getPatternSrc = function () {
const squareWidth = 10;
const squareDistance = 2;
- const patternCanvas = fabric.document.createElement("canvas");
+ const patternCanvas =
+ fabric[this.container ? this.container : document].createElement(
+ "canvas"
+ );
patternCanvas.width = patternCanvas.height =
squareWidth + squareDistance;
const ctx = patternCanvas.getContext("2d");
@@ -189,7 +200,10 @@
this.diamondPatternBrush.getPatternSrc = function () {
const squareWidth = 10;
const squareDistance = 5;
- const patternCanvas = fabric.document.createElement("canvas");
+ const patternCanvas =
+ fabric[this.container ? this.container : document].createElement(
+ "canvas"
+ );
const rect = new fabric.Rect({
width: squareWidth,
height: squareWidth,
@@ -257,7 +271,7 @@
// 娓呯┖鐢诲竷
clearCanvas() {
this.canvas.clear();
- this.setBackgroundImage()
+ this.setBackgroundImage();
},
// 淇敼鐢荤瑪棰滆壊
changeLineColor(e) {
@@ -367,15 +381,15 @@
}
.paint-btn {
width: 96%;
- margin-top:40px;
- padding:20px;
- border:1px solid #ededed;
+ margin-top: 40px;
+ padding: 20px;
+ border: 1px solid #ededed;
li {
- margin-bottom:6px;
+ margin-bottom: 6px;
}
}
.paint-btn-box {
- display:flex;
- justify-content:space-evenly;
+ display: flex;
+ justify-content: space-evenly;
}
</style>
--
Gitblit v1.9.1