|
|
@@ -1,9 +1,12 @@ |
|
|
|
import { AlgorithmHelper, ToolsHelper } from '@szyx/sdk_base' |
|
|
|
import { AlgorithmHelper, LoadingView, ToolsHelper } from '@szyx/sdk_base' |
|
|
|
import { router, window } from '@kit.ArkUI' |
|
|
|
import { BackManager } from '../manager/BackManager' |
|
|
|
import { BJCACallMsg } from '../public/callBack/BJCACallMsg' |
|
|
|
import { BJCACallMsg, CallBackForData } from '../public/callBack/BJCACallMsg' |
|
|
|
import mediaquery from '@ohos.mediaquery' |
|
|
|
import { buffer } from '@kit.ArkTS' |
|
|
|
import { ApiUtils } from '../http/ApiUtils' |
|
|
|
import { GlobalValue } from '../common/GlobalValue' |
|
|
|
import { uploadStampPic } from '../http/ApiConfig' |
|
|
|
import { UploadStampData } from '../bean/data/UploadStampData' |
|
|
|
|
|
|
|
|
|
|
|
@Entry({ routeName: 'EditDrawStampPage' }) |
|
|
@@ -25,12 +28,14 @@ export struct EditDrawStamp { |
|
|
|
private miny: number = 0 |
|
|
|
private maxx: number = 0 |
|
|
|
private maxy: number = 0 |
|
|
|
private success?: CallBackForData<string> |
|
|
|
@State isLoading: boolean = false |
|
|
|
|
|
|
|
aboutToAppear() { |
|
|
|
this.listener.on('change', (mediaQueryResult) => { |
|
|
|
if (mediaQueryResult.matches) { |
|
|
|
this.isLandscape = true |
|
|
|
this.context.save() |
|
|
|
// this.context.save() |
|
|
|
} |
|
|
|
}); |
|
|
|
this.context.fillStyle = 0xffff0000 |
|
|
@@ -43,8 +48,8 @@ export struct EditDrawStamp { |
|
|
|
aboutToDisappear() { |
|
|
|
this.w?.setPreferredOrientation(window.Orientation.UNSPECIFIED) |
|
|
|
BackManager.get() |
|
|
|
.call(!this.isLandscape ? BJCACallMsg.SUCCESS : |
|
|
|
this.isReady && this.num > 0 ? BJCACallMsg.SUCCESS : BJCACallMsg.CANCEL) |
|
|
|
.call(!this.isLandscape ? BJCACallMsg.DRAW_NOT_INIT : |
|
|
|
this.isReady && this.num > 0 && this.success ? this.success : BJCACallMsg.CANCEL) |
|
|
|
} |
|
|
|
|
|
|
|
checkEffectivePoint(x: number, y: number) { |
|
|
@@ -75,67 +80,94 @@ export struct EditDrawStamp { |
|
|
|
} |
|
|
|
|
|
|
|
build() { |
|
|
|
Row() { |
|
|
|
Stack({ alignContent: Alignment.TopEnd }) { |
|
|
|
Canvas(this.context) |
|
|
|
.width('100%') |
|
|
|
.height('100%') |
|
|
|
.onReady(() => { |
|
|
|
this.isReady = true |
|
|
|
Stack() { |
|
|
|
LoadingView({ isLoading: this.isLoading }) { |
|
|
|
Row() { |
|
|
|
Stack({ alignContent: Alignment.TopEnd }) { |
|
|
|
Canvas(this.context) |
|
|
|
.width('100%') |
|
|
|
.height('100%') |
|
|
|
.onReady(() => { |
|
|
|
this.isReady = true |
|
|
|
}) |
|
|
|
this.Empty() // 初始UI |
|
|
|
this.Canvas() // 画布 |
|
|
|
}.layoutWeight(1).onAreaChange((oldValue: Area, newValue: Area) => { |
|
|
|
console.info(`Ace: on area change, oldValue is ${JSON.stringify(oldValue)} value is ${JSON.stringify(newValue)}`) |
|
|
|
this.offCanvas = new OffscreenCanvas((newValue.width) as number, (newValue.height) as number) |
|
|
|
}) |
|
|
|
this.Empty() // 初始UI |
|
|
|
this.Canvas() // 画布 |
|
|
|
}.layoutWeight(1).onAreaChange((oldValue: Area, newValue: Area) => { |
|
|
|
console.info(`Ace: on area change, oldValue is ${JSON.stringify(oldValue)} value is ${JSON.stringify(newValue)}`) |
|
|
|
this.offCanvas = new OffscreenCanvas((newValue.width) as number, (newValue.height) as number) |
|
|
|
}) |
|
|
|
|
|
|
|
Column() { |
|
|
|
Column() { |
|
|
|
|
|
|
|
Button('关闭', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.onClick(() => { |
|
|
|
router.back() |
|
|
|
}) |
|
|
|
Button('清空内容', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.margin({ top: 40, bottom: 40 }) |
|
|
|
.onClick(() => { |
|
|
|
this.context.clearRect(0, 0, this.offCanvas.width, this.offCanvas.height) |
|
|
|
this.context.resetTransform(); // 重置变换矩阵 |
|
|
|
this.offCanvas = new OffscreenCanvas(this.offCanvas.width, this.offCanvas.height) |
|
|
|
this.context.restore() |
|
|
|
this.num = 0 |
|
|
|
}) |
|
|
|
Button('完成', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.onClick(() => { |
|
|
|
// console.log('>>>>>>>>', |
|
|
|
// buffer.from(this.context.getImageData(this.minx, this.miny, this.maxx, this.maxy).data) |
|
|
|
// .toString('base64')) |
|
|
|
}) |
|
|
|
}.visibility(this.isLandscape ? Visibility.Visible : Visibility.None) |
|
|
|
Button('关闭', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.onClick(() => { |
|
|
|
router.back() |
|
|
|
}) |
|
|
|
Button('清空内容', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.margin({ top: 40, bottom: 40 }) |
|
|
|
.onClick(() => { |
|
|
|
this.context.clearRect(0, 0, this.offCanvas.width, this.offCanvas.height) |
|
|
|
this.context.resetTransform(); // 重置变换矩阵 |
|
|
|
this.offCanvas = new OffscreenCanvas(this.offCanvas.width, this.offCanvas.height) |
|
|
|
// this.context.restore() |
|
|
|
this.num = 0 |
|
|
|
}) |
|
|
|
Button('完成', { |
|
|
|
stateEffect: true, |
|
|
|
type: ButtonType.Normal, |
|
|
|
buttonStyle: ButtonStyleMode.NORMAL |
|
|
|
}) |
|
|
|
.width(120) |
|
|
|
.height(40) |
|
|
|
.fontColor('#333333') |
|
|
|
.onClick(() => { |
|
|
|
if (this.num === 0) { |
|
|
|
ToolsHelper.showMessage("请手写后再保存") |
|
|
|
return |
|
|
|
} |
|
|
|
this.isLoading = true |
|
|
|
let base64 = this.context.toDataURL("image/png", 1).split(',')[1] |
|
|
|
// 停止自动签 |
|
|
|
ApiUtils.post<string>(uploadStampPic(), new UploadStampData( |
|
|
|
[GlobalValue.getInstance().certClientId!], |
|
|
|
GlobalValue.getInstance().userId!, |
|
|
|
GlobalValue.getInstance().getOpenId()!, |
|
|
|
base64, |
|
|
|
)) |
|
|
|
.then(() => { |
|
|
|
GlobalValue.getInstance().stampPic = base64 |
|
|
|
this.isLoading = false |
|
|
|
this.success = { |
|
|
|
code: 1001, |
|
|
|
msg: '手写签名修改成功', |
|
|
|
data: base64 |
|
|
|
} |
|
|
|
router.back() |
|
|
|
}).catch((error: Error) => { |
|
|
|
this.isLoading = false |
|
|
|
ToolsHelper.showMessage(error.message) |
|
|
|
}) |
|
|
|
}) |
|
|
|
}.visibility(this.isLandscape ? Visibility.Visible : Visibility.None) |
|
|
|
} |
|
|
|
.width('100%') |
|
|
|
.height('100%') |
|
|
|
} |
|
|
|
} |
|
|
|
.width('100%') |
|
|
|
.height('100%') |
|
|
|
} |
|
|
|
|
|
|
|
// 画布 |
|
|
@@ -159,7 +191,7 @@ export struct EditDrawStamp { |
|
|
|
this.y = e.y |
|
|
|
break; |
|
|
|
case TouchType.Move: |
|
|
|
if (this.num > 400) { |
|
|
|
if (this.num > 350) { |
|
|
|
ToolsHelper.showMessage("笔画过于复杂") |
|
|
|
return |
|
|
|
} |
|
|
|