Commit 8ec81295 authored by Mac's avatar Mac

修改首店内容

parent 4d02ad0f
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<img :src="tempPic" mode="widthFix" style="width: 320px;margin-top: 20px;" /> <img :src="tempPic" mode="widthFix" style="width: 320px;margin-top: 20px;" />
<canvas canvas-id="firstCanvas" class="sty-box" @error="canvasIdErrorCallback"></canvas> <canvas canvas-id="firstCanvas" class="sty-box" @error="canvasIdErrorCallback"></canvas>
<view class="btn" :style="{background:mainColor}" @click="preservation"> <view class="btn" :style="{background:mainColor}" @click="preservation">
<Text>保存图片分享赚钱</Text> <Text>保存图片分享</Text>
</view> </view>
</view> </view>
</template> </template>
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
export default { export default {
data() { data() {
return { return {
pageTitle: "推广二维码", pageTitle: "活动海报",
contentHeight: 0, contentHeight: 0,
mainColor: '', mainColor: '',
qrcode: '', qrcode: '',
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
this.UserInfo = uni.getStorageSync('mall_UserInfo') ? uni.getStorageSync('mall_UserInfo') : {} this.UserInfo = uni.getStorageSync('mall_UserInfo') ? uni.getStorageSync('mall_UserInfo') : {}
}, },
onLoad(options) { onLoad(options) {
console.log(options, 'options')
if (options ) { if (options ) {
this.cover = options.cover this.cover = options.cover
this.title = options.title this.title = options.title
...@@ -82,6 +82,8 @@ ...@@ -82,6 +82,8 @@
uni.hideNavigationBarLoading() uni.hideNavigationBarLoading()
that.fenxqrcode = that.host2 + res.data; that.fenxqrcode = that.host2 + res.data;
console.log(that.fenxqrcode) console.log(that.fenxqrcode)
// that.fenxqrcode = 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fn1.hdfimg.com%2Fg8%2FM07%2FF3%2F55%2FtoYBAGBN-8GAFhCxAAAD9f6VmJ4867.png%3F_ms_%3D0f94&refer=http%3A%2F%2Fn1.hdfimg.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1619574314&t=a6504efa99293d74cac2714e7ba8340f'
let tmpTimeout = setTimeout(() => { let tmpTimeout = setTimeout(() => {
that.drawCtx(); that.drawCtx();
clearTimeout(tmpTimeout) clearTimeout(tmpTimeout)
...@@ -102,9 +104,35 @@ ...@@ -102,9 +104,35 @@
console.log('绘制') console.log('绘制')
ctx.drawImage(image.path, 0, 0, 750, 1344); //绘制图 ctx.drawImage(image.path, 0, 0, 750, 1344); //绘制图
if (that.qrcode.IsShowNick == 0) { if (that.qrcode.IsShowNick == 0) {
console.log('绘制文字') console.log('绘制用户名称')
that.drawTitle(ctx); //绘制文字 that.drawTitle(ctx); //用户名称
}
if (that.qrcode.IsShowTitle == 0) {
console.log('绘制标题')
that.drawTitle_t(ctx); //绘制标题
}
ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制
if(that.qrcode.IsShowCover==0){
uni.getImageInfo({
src:that.cover,
success:function(image){
console.log('活动封面图')
ctx.drawImage(image.path, that.qrcode.CoverPaddingLeft, that.qrcode.CoverPaddingTop, that.qrcode.CoverWidth,
that.qrcode.CoverHeight); //绘制分享图
that.getqrcode(ctx)
} }
})
}else{
that.getqrcode(ctx)
}
},
});
},
getqrcode(ctx){
let that = this
if (that.qrcode.IsShowHead == 0) { if (that.qrcode.IsShowHead == 0) {
console.log('绘制头像') console.log('绘制头像')
uni.getImageInfo({ //头像 uni.getImageInfo({ //头像
...@@ -118,32 +146,75 @@ ...@@ -118,32 +146,75 @@
ctx.clip(); //画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内 ctx.clip(); //画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内
ctx.drawImage(image.path, that.qrcode.HeadPaddingLeft, that.qrcode.HeadPaddingTop, that.qrcode.HeadSize, ctx.drawImage(image.path, that.qrcode.HeadPaddingLeft, that.qrcode.HeadPaddingTop, that.qrcode.HeadSize,
that.qrcode.HeadSize); //绘制头像 that.qrcode.HeadSize); //绘制头像
ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制 setTimeout(()=>{
// if (that.qrcode.IsShowQrCode == 0) { //二维码 that.createqrcode(ctx)//生成二维码
// console.log('绘制二维码') },100)
// uni.getImageInfo({
// // src: that.UserInfo.Photo,
// src: that.fenxqrcode,
// success: function(image) {
// if (that.qrcode.QrCodeType == 0) {
// ctx.arc(that.qrcode.QrCodeSize / 2 + that.qrcode.QrCodePaddingLeft, that.qrcode.QrCodeSize / 2 +
// that.qrcode.QrCodePaddingTop, that.qrcode.QrCodeSize / 2, 0, Math.PI * 2, false);
// ctx.clip(); //画了圆 再剪切 原始画布中剪切任意形状和尺寸。一旦剪切了某个区域,则所有之后的绘图都会被限制在被剪切的区域内
// }
// ctx.drawImage(image.path, that.qrcode.QrCodePaddingLeft, that.qrcode.QrCodePaddingTop, that.qrcode
// .QrCodeSize, that.qrcode.QrCodeSize); //绘制二维码
// that.drawQrCode(ctx)
// },
// });
// } else {
// that.drawQrCode(ctx)
// }
}, },
}); });
} else { } else {
setTimeout(()=>{
that.createqrcode(ctx)//生成二维码
},100)
}
},
drawTitle(ctx) {//用户名称处理
let that = this
let text = that.UserInfo.Name;
ctx.fillStyle = that.qrcode.NickColor;
ctx.setFontSize(that.qrcode.NickSize)
ctx.fillText(text, that.qrcode.NickPaddingLeft, that.qrcode.NickPaddingTop);
},
drawTitle_t(ctx){//标题处理
let that = this
let text = that.title;
ctx.fillStyle = that.qrcode.TitleColor;
that.dealWords({
ctx: ctx,//画布上下文
fontSize: that.qrcode.TitleSize,//字体大小
word: text,//需要处理的文字
maxWidth: that.qrcode.TitleWidth,//一行文字最大宽度
x: that.qrcode.TitlePaddingLeft,//文字在x轴要显示的位置
y: that.qrcode.TitlePaddingTop,//文字在y轴要显示的位置
maxLine: that.qrcode.TitleRow//文字最多显示的行数
})
},
//处理文字多出省略号显示
dealWords: function (options) {
options.ctx.setFontSize(options.fontSize);//设置字体大小
var allRow = Math.ceil(options.ctx.measureText(options.word).width / options.maxWidth);//实际总共能分多少行
var count = allRow >= options.maxLine ? options.maxLine : allRow;//实际能分多少行与设置的最大显示行数比,谁小就用谁做循环次数
var endPos = 0;//当前字符串的截断点
for (var j = 0; j < count; j++) {
var nowStr = options.word.slice(endPos);//当前剩余的字符串
var rowWid = 0;//每一行当前宽度
if (options.ctx.measureText(nowStr).width > options.maxWidth) {//如果当前的字符串宽度大于最大宽度,然后开始截取
for (var m = 0; m < nowStr.length; m++) {
rowWid += options.ctx.measureText(nowStr[m]).width;//当前字符串总宽度
if (rowWid > options.maxWidth) {
if (j === options.maxLine - 1) { //如果是最后一行
options.ctx.fillText(nowStr.slice(0, m - 1) + '...', options.x, options.y + (j + 1) * (options.fontSize+6)); //(j+1)*18这是每一行的高度
} else {
options.ctx.fillText(nowStr.slice(0, m), options.x, options.y + (j + 1) * (options.fontSize+6));
}
endPos += m;//下次截断点
break;
}
}
} else {//如果当前的字符串宽度小于最大宽度就直接输出
options.ctx.fillText(nowStr.slice(0), options.x, options.y + (j + 1) * (options.fontSize+6));
}
}
},
createqrcode(ctx){
let that = this
ctx.restore(); //恢复之前保存的绘图上下文 恢复之前保存的绘图上下午即状态 可以继续绘制
if (that.qrcode.IsShowQrCode == 0) { if (that.qrcode.IsShowQrCode == 0) {
console.log('绘制二维码') console.log('绘制二维码')
uni.getImageInfo({ //头像 uni.getImageInfo({ //二维码
src: that.fenxqrcode, src: that.fenxqrcode,
success: function(image) { success: function(image) {
if (that.qrcode.QrCodeType == 0) { if (that.qrcode.QrCodeType == 0) {
...@@ -159,17 +230,6 @@ ...@@ -159,17 +230,6 @@
} else { } else {
that.drawQrCode(ctx) that.drawQrCode(ctx)
} }
}
},
});
},
drawTitle(ctx) {
let that = this
let text = that.UserInfo.Name;
ctx.setFillStyle = that.qrcode.NickColor;
ctx.setFontSize(that.qrcode.NickSize)
ctx.fillText(text, that.qrcode.NickPaddingLeft, that.qrcode.NickPaddingTop);
ctx.restore();
}, },
drawQrCode(ctx) { drawQrCode(ctx) {
let that = this; let that = this;
......
...@@ -62,16 +62,16 @@ ...@@ -62,16 +62,16 @@
<view class="brand-xinx-item-m">店铺数量</view> <view class="brand-xinx-item-m">店铺数量</view>
</view> </view>
<view class="brand-xinx-item" style="padding-left: 10px;"> <view class="brand-xinx-item" style="padding-left: 10px;">
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea==0 && details.EndBuiltUpArea!=0">{{details.EndBuiltUpArea}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea==0 && details.EndBuiltUpArea!=0">{{details.EndBuiltUpArea>=10000?details.EndBuiltUpArea/10000+'万':details.EndBuiltUpArea}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.EndBuiltUpArea==0 && details.BuiltUpArea!=0">{{details.BuiltUpArea}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.EndBuiltUpArea==0 && details.BuiltUpArea!=0">{{details.BuiltUpArea>=10000?details.BuiltUpArea/10000+'万':details.BuiltUpArea}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea!=0 && details.EndBuiltUpArea!=0">{{details.BuiltUpArea}}~{{details.EndBuiltUpArea}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea!=0 && details.EndBuiltUpArea!=0">{{details.BuiltUpArea>=10000?details.BuiltUpArea/10000+'万':details.BuiltUpArea}}~{{details.EndBuiltUpArea>=10000?details.EndBuiltUpArea/10000+'万':details.EndBuiltUpArea}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea==0 && details.EndBuiltUpArea==0">/</view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.BuiltUpArea==0 && details.EndBuiltUpArea==0">/</view>
<view class="brand-xinx-item-m">店铺面积</view> <view class="brand-xinx-item-m">店铺面积</view>
</view> </view>
<view class="brand-xinx-item" style="padding-left: 10px;"> <view class="brand-xinx-item" style="padding-left: 10px;">
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement==0 && details.EndAreaRequirement!=0">{{details.EndAreaRequirement}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement==0 && details.EndAreaRequirement!=0">{{details.EndAreaRequirement>=10000?details.EndAreaRequirement/10000+'万':details.EndAreaRequirement}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.EndAreaRequirement==0 && details.AreaRequirement!=0">{{details.AreaRequirement}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.EndAreaRequirement==0 && details.AreaRequirement!=0">{{details.AreaRequirement>=10000?details.AreaRequirement/10000+'万':details.AreaRequirement}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement!=0 && details.EndAreaRequirement!=0">{{details.AreaRequirement}}~{{details.EndAreaRequirement}}<text style="font-size: 12px;"></text></view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement!=0 && details.EndAreaRequirement!=0">{{details.AreaRequirement>=10000?details.AreaRequirement/10000+'万':details.AreaRequirement}}~{{details.EndAreaRequirement>=10000?details.EndAreaRequirement/10000+'万':details.EndAreaRequirement}}<text style="font-size: 12px;"></text></view>
<view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement==0 && details.EndAreaRequirement==0">/</view> <view class="brand-xinx-item-t" :style="{color:mainColor}" v-if="details.AreaRequirement==0 && details.EndAreaRequirement==0">/</view>
<view class="brand-xinx-item-m">需求面积</view> <view class="brand-xinx-item-m">需求面积</view>
</view> </view>
......
...@@ -70,12 +70,12 @@ ...@@ -70,12 +70,12 @@
pageIndex:1, pageIndex:1,
pageSize:20, pageSize:20,
BrandName:'', BrandName:'',
ProjectType:'', ProjectType:0,
Plumbing:-1, Plumbing:-1,
Caliber:-1, Caliber:-1,
Sewage:-1, Sewage:-1,
RanQi:-1, RanQi:-1,
DianLiang:-1, DianLiang:'',
PaiYan:-1, PaiYan:-1,
KongTiao:-1, KongTiao:-1,
XinFeng:-1, XinFeng:-1,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment