|
|
@ -14,7 +14,11 @@ |
|
|
enableUndo="true"></canvas-drag> |
|
|
enableUndo="true"></canvas-drag> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view class="btn-list" v-if="imageArr.length > 0"> |
|
|
|
|
|
<view class="uni-color-btn" @tap="pro">上一页</view> |
|
|
|
|
|
<view>{{ imagesIndex + 1 }}/{{ imageArr.length }}</view> |
|
|
|
|
|
<view class="uni-color-btn" @tap="next">下一页</view> |
|
|
|
|
|
</view> |
|
|
<view class="btn-list"> |
|
|
<view class="btn-list"> |
|
|
<!-- <view class="uni-color-btn" @tap="onAddImage">新建签名</view> --> |
|
|
<!-- <view class="uni-color-btn" @tap="onAddImage">新建签名</view> --> |
|
|
<view class="uni-color-btn" @tap="onChangeBgImage">导入合同</view> |
|
|
<view class="uni-color-btn" @tap="onChangeBgImage">导入合同</view> |
|
|
@ -23,6 +27,8 @@ |
|
|
<view class="uni-color-btn" @tap="submit">保存</view> |
|
|
<view class="uni-color-btn" @tap="submit">保存</view> |
|
|
<!-- <view class="uni-color-btn" @tap="onExportJSON">导出模板</view> --> |
|
|
<!-- <view class="uni-color-btn" @tap="onExportJSON">导出模板</view> --> |
|
|
<!-- <view class="uni-color-btn" @tap="onAddText">添加文字</view> --> |
|
|
<!-- <view class="uni-color-btn" @tap="onAddText">添加文字</view> --> |
|
|
|
|
|
<view class="uni-color-btn" @tap="previewContract" v-if="form.template">预览合同</view> |
|
|
|
|
|
|
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</template> |
|
|
</template> |
|
|
@ -42,7 +48,7 @@ |
|
|
width: 700, |
|
|
width: 700, |
|
|
drawArr : {}, |
|
|
drawArr : {}, |
|
|
form : { |
|
|
form : { |
|
|
template : 'https://img.teyizhao.com/2025-01-29/891f7516-dd40-42a4-82e5-d8efc46f4ea7.pdf', |
|
|
|
|
|
|
|
|
template : '', |
|
|
employeePage : 0,//求职者(乙方)签字页码 |
|
|
employeePage : 0,//求职者(乙方)签字页码 |
|
|
employeePosition : '',//求职者(乙方)签字坐标 |
|
|
employeePosition : '',//求职者(乙方)签字坐标 |
|
|
bossPage : 0,//招聘者(甲方)签字页码 |
|
|
bossPage : 0,//招聘者(甲方)签字页码 |
|
|
@ -71,6 +77,67 @@ |
|
|
console.log("mounted mounted mounted"); |
|
|
console.log("mounted mounted mounted"); |
|
|
}, |
|
|
}, |
|
|
methods: { |
|
|
methods: { |
|
|
|
|
|
// async pro(){ |
|
|
|
|
|
// if(this.imagesIndex == 0){ |
|
|
|
|
|
// uni.showToast({ |
|
|
|
|
|
// title: '已经是第一页了' |
|
|
|
|
|
// }) |
|
|
|
|
|
// return |
|
|
|
|
|
// } |
|
|
|
|
|
// this.imagesIndex-- |
|
|
|
|
|
// await wxBase64src.unlink() |
|
|
|
|
|
// this.changeBgImage() |
|
|
|
|
|
// }, |
|
|
|
|
|
// async next(){ |
|
|
|
|
|
// if(this.imagesIndex == this.imageArr.length - 1){ |
|
|
|
|
|
// uni.showToast({ |
|
|
|
|
|
// title: '已经是最后一页了' |
|
|
|
|
|
// }) |
|
|
|
|
|
// return |
|
|
|
|
|
// } |
|
|
|
|
|
// this.imagesIndex++ |
|
|
|
|
|
// await wxBase64src.unlink() |
|
|
|
|
|
// this.changeBgImage() |
|
|
|
|
|
// }, |
|
|
|
|
|
async pro(){ |
|
|
|
|
|
if(this.imagesIndex == 0){ |
|
|
|
|
|
uni.showToast({ |
|
|
|
|
|
title: '已经是第一页了' |
|
|
|
|
|
}) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
this.imagesIndex-- |
|
|
|
|
|
await wxBase64src.unlink() |
|
|
|
|
|
// 强制重新渲染canvas |
|
|
|
|
|
this.$nextTick(async () => { |
|
|
|
|
|
await this.changeBgImage() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
async next(){ |
|
|
|
|
|
if(this.imagesIndex == this.imageArr.length - 1){ |
|
|
|
|
|
uni.showToast({ |
|
|
|
|
|
title: '已经是最后一页了' |
|
|
|
|
|
}) |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
this.imagesIndex++ |
|
|
|
|
|
await wxBase64src.unlink() |
|
|
|
|
|
// 强制重新渲染canvas |
|
|
|
|
|
this.$nextTick(async () => { |
|
|
|
|
|
await this.changeBgImage() |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
// 预览合同 |
|
|
|
|
|
previewContract(){ |
|
|
|
|
|
uni.downloadFile({ |
|
|
|
|
|
url : this.form.template, |
|
|
|
|
|
success : res => { |
|
|
|
|
|
uni.openDocument({ |
|
|
|
|
|
filePath: res.tempFilePath, |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
// 签名位置更新时 |
|
|
// 签名位置更新时 |
|
|
onDrawArrChange(arr){ |
|
|
onDrawArrChange(arr){ |
|
|
console.log(arr); |
|
|
console.log(arr); |
|
|
@ -112,7 +179,8 @@ |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
uni.getImageInfo({ |
|
|
uni.getImageInfo({ |
|
|
src: 'https://img.teyizhao.com/2025-02-07/3d837c0e-91f4-4682-82d9-a04c2af737e8.png', |
|
|
|
|
|
|
|
|
src: this.configList.config_sign_a, |
|
|
|
|
|
// src: 'https://img.teyizhao.com/2025-02-07/3d837c0e-91f4-4682-82d9-a04c2af737e8.png', |
|
|
success : res => { |
|
|
success : res => { |
|
|
this.setData({ |
|
|
this.setData({ |
|
|
graph: { |
|
|
graph: { |
|
|
@ -132,7 +200,8 @@ |
|
|
}) |
|
|
}) |
|
|
|
|
|
|
|
|
uni.getImageInfo({ |
|
|
uni.getImageInfo({ |
|
|
src: 'https://img.teyizhao.com/2025-02-07/af4786c0-7b62-4a86-a090-9f28eca3674a.png', |
|
|
|
|
|
|
|
|
src: this.configList.config_sign_b, |
|
|
|
|
|
// src: 'https://img.teyizhao.com/2025-02-07/af4786c0-7b62-4a86-a090-9f28eca3674a.png', |
|
|
success : res => { |
|
|
success : res => { |
|
|
this.setData({ |
|
|
this.setData({ |
|
|
graph: { |
|
|
graph: { |
|
|
@ -159,42 +228,82 @@ |
|
|
async onChangeBgImage() { |
|
|
async onChangeBgImage() { |
|
|
let self = this |
|
|
let self = this |
|
|
|
|
|
|
|
|
// let pdfUrl = await self.loadFDP() |
|
|
|
|
|
|
|
|
|
|
|
// console.log(pdfUrl); |
|
|
|
|
|
|
|
|
let pdfUrl = await self.loadFDP() |
|
|
|
|
|
|
|
|
// this.form.template = pdfUrl |
|
|
|
|
|
|
|
|
this.form.template = pdfUrl |
|
|
|
|
|
|
|
|
this.pdf2imagebase64() |
|
|
|
|
|
|
|
|
await this.pdf2imagebase64() |
|
|
|
|
|
|
|
|
this.changeBgImage() |
|
|
this.changeBgImage() |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
async changeBgImage(){ |
|
|
|
|
|
let self = this |
|
|
|
|
|
|
|
|
// async changeBgImage(){ |
|
|
|
|
|
// let self = this |
|
|
|
|
|
|
|
|
let src = await wxBase64src.base64src(this.imageArr[this.imagesIndex]) |
|
|
|
|
|
|
|
|
// let src = await wxBase64src.base64src(this.imageArr[this.imagesIndex]) |
|
|
|
|
|
|
|
|
uni.getImageInfo({ |
|
|
|
|
|
src, |
|
|
|
|
|
success: image => { |
|
|
|
|
|
console.log(image); |
|
|
|
|
|
|
|
|
// uni.getImageInfo({ |
|
|
|
|
|
// src, |
|
|
|
|
|
// success: image => { |
|
|
|
|
|
// console.log(image); |
|
|
|
|
|
|
|
|
let allwh = image.height + image.width |
|
|
|
|
|
let imgw = (image.width / allwh).toFixed(2) |
|
|
|
|
|
let imgh = (image.height / allwh).toFixed(2) |
|
|
|
|
|
|
|
|
// let allwh = image.height + image.width |
|
|
|
|
|
// let imgw = (image.width / allwh).toFixed(2) |
|
|
|
|
|
// let imgh = (image.height / allwh).toFixed(2) |
|
|
|
|
|
|
|
|
self.height = imgh * Math.ceil(this.width / imgw) |
|
|
|
|
|
|
|
|
// self.height = imgh * Math.ceil(this.width / imgw) |
|
|
|
|
|
|
|
|
self.$nextTick(() => { |
|
|
|
|
|
this.$refs.canvasRef.changeBgImage(image.path) |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
fail(err) { |
|
|
|
|
|
console.log(err); |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
// self.$nextTick(() => { |
|
|
|
|
|
// uni.hideLoading() |
|
|
|
|
|
// this.$refs.canvasRef.changeBgImage(image.path) |
|
|
|
|
|
// }) |
|
|
|
|
|
// }, |
|
|
|
|
|
// fail(err) { |
|
|
|
|
|
// wxBase64src.unlink() |
|
|
|
|
|
// console.log(err); |
|
|
|
|
|
// } |
|
|
|
|
|
// }) |
|
|
|
|
|
// }, |
|
|
|
|
|
async changeBgImage(){ |
|
|
|
|
|
let self = this |
|
|
|
|
|
|
|
|
|
|
|
try { |
|
|
|
|
|
uni.showLoading({ |
|
|
|
|
|
title: '加载中...' |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
let src = await wxBase64src.base64src(this.imageArr[this.imagesIndex]) |
|
|
|
|
|
|
|
|
|
|
|
const imageInfo = await new Promise((resolve, reject) => { |
|
|
|
|
|
uni.getImageInfo({ |
|
|
|
|
|
src, |
|
|
|
|
|
success: resolve, |
|
|
|
|
|
fail: reject |
|
|
|
|
|
}) |
|
|
|
|
|
}) |
|
|
|
|
|
|
|
|
|
|
|
let allwh = imageInfo.height + imageInfo.width |
|
|
|
|
|
let imgw = (imageInfo.width / allwh).toFixed(2) |
|
|
|
|
|
let imgh = (imageInfo.height / allwh).toFixed(2) |
|
|
|
|
|
|
|
|
|
|
|
self.height = imgh * Math.ceil(this.width / imgw) |
|
|
|
|
|
|
|
|
|
|
|
// 确保DOM更新后再更新canvas |
|
|
|
|
|
await this.$nextTick() |
|
|
|
|
|
// 先清空画布再设置新图片 |
|
|
|
|
|
// await this.$refs.canvasRef.clearCanvas() |
|
|
|
|
|
await this.$refs.canvasRef.changeBgImage(imageInfo.path) |
|
|
|
|
|
|
|
|
|
|
|
// 重新添加签名位置 |
|
|
|
|
|
// this.onAddImage() |
|
|
|
|
|
|
|
|
|
|
|
} catch(err) { |
|
|
|
|
|
console.error('changeBgImage error:', err) |
|
|
|
|
|
wxBase64src.unlink() |
|
|
|
|
|
} finally { |
|
|
|
|
|
uni.hideLoading() |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
loadFDP(){ |
|
|
loadFDP(){ |
|
|
let that = this |
|
|
let that = this |
|
|
return new Promise((success, error) => { |
|
|
return new Promise((success, error) => { |
|
|
@ -276,31 +385,28 @@ |
|
|
this.form.bossPosition = JSON.stringify(bossPosition) |
|
|
this.form.bossPosition = JSON.stringify(bossPosition) |
|
|
this.form.employeePosition = JSON.stringify(employeePosition) |
|
|
this.form.employeePosition = JSON.stringify(employeePosition) |
|
|
|
|
|
|
|
|
|
|
|
this.form.bossPage = this.imagesIndex |
|
|
|
|
|
this.form.employeePage = this.imagesIndex |
|
|
|
|
|
|
|
|
this.$api(this.id ? 'updateContractTemplate' : |
|
|
this.$api(this.id ? 'updateContractTemplate' : |
|
|
'addContractTemplate', this.form).then(res => { |
|
|
'addContractTemplate', this.form).then(res => { |
|
|
if(res.code == 200){ |
|
|
if(res.code == 200){ |
|
|
uni.navigateBack(-1) |
|
|
uni.navigateBack(-1) |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
|
|
|
// pdf2imagebase64(){ |
|
|
|
|
|
// this.$api('pdf2imagebase64', { |
|
|
|
|
|
|
|
|
|
|
|
// }, res => { |
|
|
|
|
|
|
|
|
|
|
|
// }) |
|
|
|
|
|
// }, |
|
|
|
|
|
// 修改或者保存模板 |
|
|
|
|
|
saveOrUpdate(){ |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
// pdf转图片base64 |
|
|
// pdf转图片base64 |
|
|
async pdf2imagebase64(){ |
|
|
async pdf2imagebase64(){ |
|
|
|
|
|
uni.showLoading({ |
|
|
|
|
|
title: '解析文档中...' |
|
|
|
|
|
}) |
|
|
let res = await this.$api('pdf2imagebase64', { |
|
|
let res = await this.$api('pdf2imagebase64', { |
|
|
pdfPath : this.form.template |
|
|
pdfPath : this.form.template |
|
|
}) |
|
|
}) |
|
|
this.imageArr = res.result |
|
|
|
|
|
console.log(this.imageArr); |
|
|
|
|
|
|
|
|
this.imageArr = [] |
|
|
|
|
|
for(let key in res.result){ |
|
|
|
|
|
this.imageArr.push(res.result[key]) |
|
|
|
|
|
} |
|
|
}, |
|
|
}, |
|
|
getDetail(){ |
|
|
getDetail(){ |
|
|
if(!this.id){ |
|
|
if(!this.id){ |
|
|
@ -309,16 +415,22 @@ |
|
|
} |
|
|
} |
|
|
this.$api('queryContractTemplateById', { |
|
|
this.$api('queryContractTemplateById', { |
|
|
contractTemplateId : this.id |
|
|
contractTemplateId : this.id |
|
|
}).then(res => { |
|
|
|
|
|
|
|
|
}).then(async (res) => { |
|
|
if(res.code == 200){ |
|
|
if(res.code == 200){ |
|
|
this.form = res.result |
|
|
this.form = res.result |
|
|
|
|
|
|
|
|
|
|
|
this.imagesIndex = this.form.employeePage |
|
|
|
|
|
|
|
|
delete this.form.createBy |
|
|
delete this.form.createBy |
|
|
delete this.form.createTime |
|
|
delete this.form.createTime |
|
|
delete this.form.updateBy |
|
|
delete this.form.updateBy |
|
|
delete this.form.updateTime |
|
|
delete this.form.updateTime |
|
|
|
|
|
|
|
|
this.onAddImage() |
|
|
this.onAddImage() |
|
|
|
|
|
|
|
|
|
|
|
await this.pdf2imagebase64() |
|
|
|
|
|
|
|
|
|
|
|
this.changeBgImage() |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
@ -344,8 +456,9 @@ |
|
|
.btn-list { |
|
|
.btn-list { |
|
|
display: flex; |
|
|
display: flex; |
|
|
flex-wrap: wrap; |
|
|
flex-wrap: wrap; |
|
|
|
|
|
align-items: center; |
|
|
padding: 20rpx; |
|
|
padding: 20rpx; |
|
|
gap: 60rpx; |
|
|
|
|
|
|
|
|
gap: 30rpx; |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
.uni-color-btn { |
|
|
.uni-color-btn { |
|
|
margin: 0; |
|
|
margin: 0; |
|
|
|
