Squashed commit of the following:
commitaa54e053eeAuthor: 浅念 <email@sample.com> Date: Thu Apr 3 13:17:00 2025 +0800 下拉组件加俄语包 commit97a896dbe8Author: 浅念 <email@sample.com> Date: Thu Apr 3 13:13:51 2025 +0800 修改语言 commit07e477972eAuthor: 浅念 <email@sample.com> Date: Thu Apr 3 11:21:13 2025 +0800 我的名片 下载调整 commitfde5830450Author: 浅念 <email@sample.com> Date: Wed Apr 2 15:51:39 2025 +0800 名片页面 commitb60cbff6d5Author: 浅念 <email@sample.com> Date: Tue Apr 1 17:19:32 2025 +0800 调整样式 commit7fd2e63c9dAuthor: 浅念 <email@sample.com> Date: Tue Apr 1 17:18:22 2025 +0800 添加标签检索,添加公海页面
This commit is contained in:
+97
-82
@@ -13,7 +13,7 @@
|
||||
<view class="ftitle">{{userinfo.position}}</view>
|
||||
</view>
|
||||
<view>
|
||||
<image :src="userinfo.avatar" mode=""></image>
|
||||
<image :src="imageSrc" mode="" crossOrigin="anonymous" ></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="conts">
|
||||
@@ -29,10 +29,17 @@
|
||||
<image src="/static/image/mine/addr.png" style="height:18px;width: 14px;" mode=""></image>
|
||||
<view class="">{{userinfo.country_name}}</view>
|
||||
</view>
|
||||
<view class="coles">
|
||||
<image src="/static/image/mine/word.png" style="height:16px;width: 16px;" mode=""></image>
|
||||
<view class="">HTTPS://HESUCAR.COM</view>
|
||||
</view>
|
||||
<view class="coles">
|
||||
<view class="">{{userinfo.company}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="code">
|
||||
<image src="/static/image/mine/ewm.png" mode=""></image>
|
||||
<text>微信</text>
|
||||
<image :src="imageSrcewm" mode="" crossOrigin="anonymous" ></image>
|
||||
<view>{{userinfo.socialize}}</view>
|
||||
</view>
|
||||
<!-- <view class="code" :class=" activeImg === share_one ? 'code_one' : activeImg === share_two ? 'code_two' : activeImg === share_three ? 'code_three' : 'code_one'">
|
||||
<qrcode-vue :value="codeUrl" :size="70"></qrcode-vue>
|
||||
@@ -43,6 +50,10 @@
|
||||
<view class="foot">
|
||||
<button class="btn" @click="goDown">{{$t('download')}}</button>
|
||||
</view>
|
||||
<!-- 手机端预览容器 -->
|
||||
<view v-if="showPreview" class="preview-mask" @click="showPreview = false">
|
||||
<image :src="previewUrl" mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -52,7 +63,11 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userinfo:{}
|
||||
userinfo:{},
|
||||
showPreview: false,
|
||||
previewUrl: '',
|
||||
imageSrc:'',
|
||||
imageSrcewm:'',
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
@@ -69,80 +84,76 @@
|
||||
method:'get',
|
||||
}).then(res => {
|
||||
that.userinfo = res.data.data;
|
||||
that.downloadImageToLocal(res.data.data.avatar_url,'imageSrc')
|
||||
that.downloadImageToLocal(res.data.data.socialize_pic_url,'imageSrcewm')
|
||||
})
|
||||
},
|
||||
saveImgFile(baseImg){
|
||||
const bitmap = new plus.nativeObj.Bitmap('test')
|
||||
bitmap.loadBase64Data(
|
||||
baseImg,
|
||||
function () {
|
||||
const url = '_doc/' + new Date().getTime() + '.png' // url为时间戳命名方式
|
||||
bitmap.save(
|
||||
url,
|
||||
{
|
||||
overwrite: true // 是否覆盖
|
||||
},
|
||||
i => {
|
||||
plus.gallery.save(
|
||||
i.target,
|
||||
function () {
|
||||
uni.showToast({
|
||||
title: '图片保存至相册成功',
|
||||
icon: 'none'
|
||||
});
|
||||
bitmap.clear()
|
||||
},
|
||||
function (e) {
|
||||
uni.showToast({
|
||||
title: '图片保存至相册失败',
|
||||
icon: 'none'
|
||||
});
|
||||
// console.log('图片保存至相册失败:' + JSON.stringify(e))
|
||||
bitmap.clear()
|
||||
}
|
||||
)
|
||||
},
|
||||
e => {
|
||||
uni.showToast({
|
||||
title: '图片保存失败1',
|
||||
icon: 'none'
|
||||
});
|
||||
bitmap.clear()
|
||||
}
|
||||
)
|
||||
},
|
||||
e => {
|
||||
uni.showToast({
|
||||
title: '图片保存失败2',
|
||||
icon: 'none'
|
||||
});
|
||||
bitmap.clear()
|
||||
}
|
||||
)
|
||||
async downloadImageToLocal(imageUrl,item) {
|
||||
try {
|
||||
// 1. 下载图片到临时路径
|
||||
const { tempFilePath } = await new Promise((resolve, reject) => {
|
||||
uni.downloadFile({
|
||||
url: imageUrl,
|
||||
success: resolve,
|
||||
fail: reject,
|
||||
});
|
||||
});
|
||||
|
||||
// 2. 返回临时路径(可直接用于 <image> 显示)
|
||||
console.log('下载成功,临时路径:', tempFilePath);
|
||||
if(item =='imageSrc'){
|
||||
this.imageSrc = tempFilePath;
|
||||
}else{
|
||||
this.imageSrcewm = tempFilePath;
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
console.error('下载失败:', err);
|
||||
throw new Error('图片下载失败');
|
||||
}
|
||||
},
|
||||
downloadImage(url, filename) {
|
||||
// 创建一个隐藏的 <a> 标签
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = filename;
|
||||
// 触发点击事件
|
||||
link.click();
|
||||
downloadImage(url, canvas) {
|
||||
const filename1 = '_doc/' + new Date().getTime() + '.png' // url为时间戳命名方式
|
||||
if (uni.getSystemInfoSync().platform === 'h5') {
|
||||
// 创建一个隐藏的 <a> 标签
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = filename1;
|
||||
// 触发点击事件
|
||||
link.click();
|
||||
}else {
|
||||
canvas.toBlob((blob) => {
|
||||
const blobUrl = URL.createObjectURL(blob);
|
||||
const link = document.createElement('a');
|
||||
link.href = blobUrl;
|
||||
link.download = filename1;
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
URL.revokeObjectURL(blobUrl); // 释放内存
|
||||
}, 'image/png');
|
||||
}
|
||||
},
|
||||
goDown(){
|
||||
const element = document.getElementById('poster');
|
||||
var that= this
|
||||
html2canvas(element, {
|
||||
backgroundColor: '#f5f5f5', //海报的背景颜色
|
||||
useCORS: true // 允许跨域
|
||||
useCORS: true ,// 允许跨域
|
||||
allowTaint: true, // 允许污染画布
|
||||
scale: 2, // 提高清晰度
|
||||
logging: false // 关闭日志(可选)
|
||||
}).then(canvas => {
|
||||
// canvas 其实就是我们所讲的res 的意思 返回报文的意思
|
||||
let baseImg = canvas.toDataURL('image/png')
|
||||
uni.showModal ({
|
||||
title: '下载名片',
|
||||
content: '确定下载当前名片图吗?',
|
||||
title: this.$t('downmp'),
|
||||
content: this.$t('downmpmsg'),
|
||||
cancelText: this.$t('cancel'),
|
||||
confirmText: this.$t('confirm'),
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
that.downloadImage(baseImg, 'screenshot.png');
|
||||
that.downloadImage(baseImg,canvas);
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
@@ -156,7 +167,8 @@
|
||||
|
||||
<style lang="scss">
|
||||
.card{
|
||||
padding: 15px;
|
||||
padding:0px 15px;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
.img_top{
|
||||
background-image: url('/static/image/mine/cardbg.png');
|
||||
@@ -164,13 +176,13 @@
|
||||
background-repeat: no-repeat;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
width:690rpx;
|
||||
height:1060rpx;
|
||||
padding-top: 60rpx;
|
||||
width:100%;
|
||||
height:1080rpx;
|
||||
padding-top: 40rpx;
|
||||
.leftbg{
|
||||
width: 10px;
|
||||
width: 8px;
|
||||
height: 34px;
|
||||
background: linear-gradient(to bottom, #3471FF, #BD67FF);
|
||||
background: #3C4169;
|
||||
margin-right: 15px;
|
||||
}
|
||||
.name{
|
||||
@@ -187,10 +199,14 @@
|
||||
align-items: center;
|
||||
}
|
||||
.ftitle{
|
||||
color: #222222;
|
||||
font-size: 16px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
margin-top: 20px;
|
||||
background: #3C4169;
|
||||
border-radius: 18px;
|
||||
margin-left: 20px;
|
||||
padding: 2px 15px;
|
||||
}
|
||||
image{
|
||||
width: 100px;
|
||||
@@ -199,9 +215,9 @@
|
||||
}
|
||||
}
|
||||
.conts{
|
||||
padding: 15px 25px;
|
||||
padding: 15px 25px 10px;
|
||||
line-height: 32px;
|
||||
margin-bottom: 20px;
|
||||
color: #3C4169;
|
||||
.coles{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -214,15 +230,14 @@
|
||||
}
|
||||
}
|
||||
.code{
|
||||
background-color: rgba(255,255,255,50%);
|
||||
border-radius: 10px;
|
||||
text-align: center;
|
||||
width: 340rpx;
|
||||
margin: auto;
|
||||
padding: 15px;
|
||||
// text-align: center;
|
||||
padding:0px 15px;
|
||||
width: 26%;
|
||||
color: #3C4169;
|
||||
font-size: 14px;
|
||||
image{
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -230,7 +245,7 @@
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
height: 75px;
|
||||
background: #FFFFFF;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<view class="content">
|
||||
<view class="topimg">
|
||||
<uni-file-picker fileMediatype="image" limit="1" :list-styles="imageStyles" :del-icon="false" disable-preview @select="select" @delete="delfn('picture')">
|
||||
<image class="user" :src="userinfo.avatar"mode=""></image>
|
||||
<image class="user" :src="userinfo.avatar_url"mode=""></image>
|
||||
<!-- <image class="xj" src="/static/image/mine/xiangji.png" mode=""></image> -->
|
||||
</uni-file-picker>
|
||||
<view>{{$t('mine.changeavatar')}}</view>
|
||||
@@ -62,6 +62,24 @@
|
||||
<u-icon class="arrowright" name="arrow-right" size="18" color="#747474"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<u-divider text=""></u-divider>
|
||||
<view class="cell1">
|
||||
<view class="item">{{$t('mine.QRcode')}}</view>
|
||||
<view class="right">
|
||||
<u-radio-group v-model="userinfo.socialize">
|
||||
<u-radio :name="$t('mine.WeChat')" class="m-r-10">{{$t('mine.WeChat')}}</u-radio>
|
||||
<u-radio name="WhatsApp">WhatsApp</u-radio>
|
||||
</u-radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<view class="item">上传二维码</view>
|
||||
<view class="right">
|
||||
<uni-file-picker style="margin: 10px 0px;" fileMediatype="image" limit="1" :list-styles="imageStyles" :del-icon="false" disable-preview @select="selectewm" >
|
||||
<image class="user" :src="userinfo.socialize_pic_url==null?'/static/image/mine/erwm.png':userinfo.socialize_pic_url " mode=""></image>
|
||||
</uni-file-picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="foot">
|
||||
<button class="btn" @click="bcFn">{{$t('save')}}</button>
|
||||
@@ -214,7 +232,7 @@
|
||||
this.company_name = val.value[0].name
|
||||
this.showcomp = false
|
||||
},
|
||||
uploadfn(imgUrl){
|
||||
uploadfn(imgUrl,name,name1){
|
||||
var that = this;
|
||||
uni.uploadFile({
|
||||
url: 'http://219.157.255.213:9007/upload/uploadImage',
|
||||
@@ -229,8 +247,8 @@
|
||||
icon: 'none'
|
||||
});
|
||||
}else{
|
||||
that.userinfo.avatar = path.data.image_url
|
||||
that.userinfo.avatar_url = path.data.path
|
||||
that.userinfo[name1] = path.data.image_url
|
||||
that.userinfo[name] = path.data.path
|
||||
console.log(that.form)
|
||||
}
|
||||
}
|
||||
@@ -248,7 +266,12 @@
|
||||
select(e){
|
||||
const tempFilePaths = e.tempFilePaths;
|
||||
const imgUrl=tempFilePaths[0]
|
||||
this.uploadfn(imgUrl)
|
||||
this.uploadfn(imgUrl,'avatar','avatar_url')
|
||||
},
|
||||
selectewm(e){
|
||||
const tempFilePaths = e.tempFilePaths;
|
||||
const imgUrl=tempFilePaths[0]
|
||||
this.uploadfn(imgUrl,'socialize_pic','socialize_pic_url')
|
||||
},
|
||||
leftClick(){
|
||||
uni.navigateBack({})
|
||||
@@ -267,6 +290,9 @@
|
||||
position:this.userinfo.position,
|
||||
country_id:this.userinfo.country_id,
|
||||
sign:this.userinfo.sign,
|
||||
socialize:this.userinfo.socialize,
|
||||
socialize_pic:this.userinfo.socialize_pic,
|
||||
socialize_pic_url:this.userinfo.socialize_pic_url,
|
||||
}
|
||||
}).then(res => {
|
||||
uni.showToast({
|
||||
@@ -306,6 +332,7 @@
|
||||
}
|
||||
.content{
|
||||
background: #FFFFFF;
|
||||
padding-bottom: 100px;
|
||||
.topimg{
|
||||
text-align: center;
|
||||
position: relative;
|
||||
@@ -334,6 +361,13 @@
|
||||
width: 90px;
|
||||
}
|
||||
}
|
||||
.cell{
|
||||
padding: 18px 20px;
|
||||
font-weight: 500;
|
||||
.item{
|
||||
width: 90px;
|
||||
}
|
||||
}
|
||||
.right{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user