You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
437 lines
20 KiB
437 lines
20 KiB
"use strict";
|
|
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
return new (P || (P = Promise))(function (resolve, reject) {
|
|
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
});
|
|
};
|
|
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
|
|
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
function step(op) {
|
|
if (f) throw new TypeError("Generator is already executing.");
|
|
while (_) try {
|
|
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
switch (op[0]) {
|
|
case 0: case 1: t = op; break;
|
|
case 4: _.label++; return { value: op[1], done: false };
|
|
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
default:
|
|
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
if (t[2]) _.ops.pop();
|
|
_.trys.pop(); continue;
|
|
}
|
|
op = body.call(thisArg, _);
|
|
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
}
|
|
};
|
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
var promise_wx_api_1 = require("../../../../utils/promise-wx-api");
|
|
var tools_1 = require("../../../../utils/tools");
|
|
var promise_wx_api_2 = require("../../../../utils/promise-wx-api");
|
|
var app = getApp();
|
|
Component({
|
|
properties: {},
|
|
data: {
|
|
groupId: "",
|
|
groupDetail: {
|
|
groupName: "",
|
|
groupHeadPhoto: "",
|
|
groupIntroduction: "",
|
|
groupCodeUrl: "",
|
|
showName: "",
|
|
},
|
|
iniLoaded: false,
|
|
showBtn: false,
|
|
showBtnQrcode: false,
|
|
menuList: [
|
|
{
|
|
name: "海报",
|
|
value: 0,
|
|
},
|
|
{
|
|
name: "小组码",
|
|
value: 1,
|
|
}
|
|
],
|
|
current: 0,
|
|
windowWidth: 0,
|
|
windowHeight: 0,
|
|
boxheight: 0,
|
|
qrCode: "https://wanmi-b2b.oss-cn-shanghai.aliyuncs.com/201901310959076784.jpeg",
|
|
bgImg: "/subpages/group/images/group-bg.jpg",
|
|
photoImg: "",
|
|
codeContent: "【长按识别或扫码入组】",
|
|
},
|
|
lifetimes: {
|
|
attached: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
return __generator(this, function (_a) {
|
|
return [2];
|
|
});
|
|
});
|
|
},
|
|
detached: function () {
|
|
},
|
|
},
|
|
methods: {
|
|
onLoad: function (options) {
|
|
console.log(options.gid);
|
|
var groupId = options.gid;
|
|
this.setData({
|
|
groupId: groupId
|
|
});
|
|
this.init();
|
|
},
|
|
init: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
return __generator(this, function (_a) {
|
|
switch (_a.label) {
|
|
case 0: return [4, tools_1.doAfterLogin()];
|
|
case 1:
|
|
_a.sent();
|
|
return [4, this.getGroupDetail()];
|
|
case 2:
|
|
_a.sent();
|
|
return [4, this.createPosition()];
|
|
case 3:
|
|
_a.sent();
|
|
return [4, this.getPhotoImg()];
|
|
case 4:
|
|
_a.sent();
|
|
return [2];
|
|
}
|
|
});
|
|
});
|
|
},
|
|
getGroupDetail: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
var groupId, groupDetail, url, params, _a, msg, _b, code, data;
|
|
return __generator(this, function (_c) {
|
|
switch (_c.label) {
|
|
case 0:
|
|
groupId = this.data.groupId;
|
|
groupDetail = this.data.groupDetail;
|
|
url = "resi/group/resigroupcode/groupcodebasicinfo";
|
|
params = {
|
|
customerId: app.globalData.customerId,
|
|
gridId: app.globalData.gridId,
|
|
groupId: groupId
|
|
};
|
|
return [4, promise_wx_api_1.wxRequestPost(url, params, {
|
|
isQuiet: false,
|
|
})];
|
|
case 1:
|
|
_a = _c.sent(), msg = _a.msg, _b = _a.data.data, code = _b.code, data = _b.data;
|
|
if (msg === "success" && code === 0) {
|
|
groupDetail = data;
|
|
this.setData({ groupDetail: groupDetail });
|
|
}
|
|
return [2];
|
|
}
|
|
});
|
|
});
|
|
},
|
|
createPosition: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
var that;
|
|
return __generator(this, function (_a) {
|
|
that = this;
|
|
wx.getSystemInfo({
|
|
success: function (res) {
|
|
var windowWidth = res.windowWidth;
|
|
var windowHeight = res.windowHeight;
|
|
var margin = 20;
|
|
var boxWidth = windowWidth - margin * 2;
|
|
var boxheight = windowHeight - 40 - 40 - 20 - 20 - 20;
|
|
var boxheight2 = windowHeight - 40 - 40 - 20 - 100 - 20;
|
|
var bgImgX = (windowWidth - boxWidth) / 2;
|
|
var bgImgY = windowWidth * 0.081;
|
|
var bgImgWidth = boxWidth;
|
|
var bgImgHeight = boxheight * 0.27;
|
|
var radius = bgImgHeight * 0.25;
|
|
var photoCenterX = windowWidth / 2;
|
|
var photoCenterY = bgImgY + radius + bgImgHeight * 0.1;
|
|
var photoWidth = 2 * radius;
|
|
var photoHeight = 2 * radius;
|
|
var photoStartX = bgImgX + (boxWidth - photoWidth) / 2;
|
|
var photoStartY = photoCenterY - radius;
|
|
var groupNameY = photoStartY + photoHeight + bgImgHeight * 0.2;
|
|
var groupStart = 35;
|
|
var groupIntrX = bgImgX + groupStart;
|
|
var groupIntrY = bgImgY + bgImgHeight + 30;
|
|
var groupIntrWidth = bgImgWidth - groupStart * 2;
|
|
var groupIntrHeight = boxheight * 0.23;
|
|
var codeWidth = boxheight * 0.28;
|
|
var codeHeight = codeWidth;
|
|
var codeX = bgImgX + (boxWidth - codeWidth) / 2;
|
|
var codeY = groupIntrY + groupIntrHeight + boxheight * 0.022;
|
|
var codeContentY = codeY + codeHeight + boxheight * 0.03;
|
|
var codeWidth2 = boxheight2 * 0.6;
|
|
var codeHeight2 = codeWidth2;
|
|
var codeX2 = bgImgX + (boxWidth - codeWidth2) / 2;
|
|
var codeY2 = bgImgY + boxheight2 * 0.09;
|
|
var groupNameY2 = codeY2 + codeHeight2 + boxheight2 * 0.15;
|
|
var codeContentY2 = groupNameY2 + boxheight2 * 0.07;
|
|
that.setData({
|
|
windowWidth: windowWidth,
|
|
windowHeight: windowHeight,
|
|
boxWidth: boxWidth,
|
|
boxheight: boxheight,
|
|
boxheight2: boxheight2,
|
|
bgImgWidth: bgImgWidth,
|
|
bgImgHeight: bgImgHeight,
|
|
bgImgX: bgImgX,
|
|
bgImgY: bgImgY,
|
|
radius: radius,
|
|
photoCenterX: photoCenterX,
|
|
photoCenterY: photoCenterY,
|
|
photoWidth: photoWidth,
|
|
photoHeight: photoHeight,
|
|
photoStartX: photoStartX,
|
|
photoStartY: photoStartY,
|
|
groupNameY: groupNameY,
|
|
groupIntrX: groupIntrX,
|
|
groupIntrY: groupIntrY,
|
|
groupIntrWidth: groupIntrWidth,
|
|
groupIntrHeight: groupIntrHeight,
|
|
codeWidth: codeWidth,
|
|
codeHeight: codeHeight,
|
|
codeX: codeX,
|
|
codeY: codeY,
|
|
codeContentY: codeContentY,
|
|
codeWidth2: codeWidth2,
|
|
codeHeight2: codeHeight2,
|
|
codeX2: codeX2,
|
|
codeY2: codeY2,
|
|
groupNameY2: groupNameY2,
|
|
codeContentY2: codeContentY2
|
|
});
|
|
}
|
|
});
|
|
return [2];
|
|
});
|
|
});
|
|
},
|
|
getPhotoImg: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
var _a, msg, tempFilePath;
|
|
return __generator(this, function (_b) {
|
|
switch (_b.label) {
|
|
case 0: return [4, promise_wx_api_2.default("downloadFile")({
|
|
url: this.data.groupDetail.groupHeadPhoto,
|
|
})];
|
|
case 1:
|
|
_a = _b.sent(), msg = _a.msg, tempFilePath = _a.data.tempFilePath;
|
|
if (msg == "success") {
|
|
this.setData({
|
|
photoImg: tempFilePath
|
|
});
|
|
this.getQrcodeImg();
|
|
}
|
|
return [2];
|
|
}
|
|
});
|
|
});
|
|
},
|
|
getQrcodeImg: function () {
|
|
return __awaiter(this, void 0, void 0, function () {
|
|
var _a, msg, tempFilePath;
|
|
return __generator(this, function (_b) {
|
|
switch (_b.label) {
|
|
case 0: return [4, promise_wx_api_2.default("downloadFile")({
|
|
url: this.data.groupDetail.groupCodeUrl,
|
|
})];
|
|
case 1:
|
|
_a = _b.sent(), msg = _a.msg, tempFilePath = _a.data.tempFilePath;
|
|
if (msg == "success") {
|
|
this.setData({
|
|
qrCode: tempFilePath
|
|
});
|
|
this.createPoster();
|
|
this.createQrcode();
|
|
}
|
|
return [2];
|
|
}
|
|
});
|
|
});
|
|
},
|
|
createPoster: function () {
|
|
var that = this;
|
|
var ctx = wx.createCanvasContext("canvasPoster");
|
|
that.drawSquare(ctx, that.data.boxheight);
|
|
ctx.drawImage(that.data.bgImg, that.data.bgImgX, that.data.bgImgY, that.data.bgImgWidth, that.data.bgImgHeight);
|
|
that.drawPhoto(ctx);
|
|
ctx.setFontSize(15);
|
|
ctx.setFillStyle("#FFFFFF");
|
|
var groupName = that.data.groupDetail.groupName;
|
|
var groupNameX = that.data.bgImgX + (that.data.boxWidth - ctx.measureText(groupName).width) / 2;
|
|
ctx.fillText(groupName, groupNameX, that.data.groupNameY);
|
|
that.drawIntroduction(ctx);
|
|
ctx.drawImage(that.data.qrCode, that.data.codeX, that.data.codeY, that.data.codeWidth, that.data.codeHeight);
|
|
ctx.setFontSize(11);
|
|
ctx.setFillStyle("#999999");
|
|
var codeContentX = that.data.bgImgX + (that.data.boxWidth - ctx.measureText(that.data.codeContent).width) / 2;
|
|
ctx.fillText(that.data.codeContent, codeContentX, that.data.codeContentY);
|
|
ctx.draw(true, this.drawPosterEnd(that));
|
|
},
|
|
createQrcode: function () {
|
|
var that = this;
|
|
var ctx2 = wx.createCanvasContext("canvasQrcode");
|
|
that.drawSquare(ctx2, that.data.boxheight2);
|
|
ctx2.drawImage(that.data.qrCode, that.data.codeX2, that.data.codeY2, that.data.codeWidth2, that.data.codeHeight2);
|
|
ctx2.setFontSize(17);
|
|
ctx2.setFillStyle("#333333");
|
|
var groupName = that.data.groupDetail.groupName;
|
|
var groupNameX = that.data.bgImgX + (that.data.boxWidth - ctx2.measureText(groupName).width) / 2;
|
|
ctx2.fillText(groupName, groupNameX, that.data.groupNameY2);
|
|
ctx2.setFontSize(13);
|
|
ctx2.setFillStyle("#999999");
|
|
var codeContentX = that.data.bgImgX + (that.data.boxWidth - ctx2.measureText(that.data.codeContent).width) / 2;
|
|
ctx2.fillText(that.data.codeContent, codeContentX, that.data.codeContentY2);
|
|
ctx2.draw(true, this.drawQrcodeEnd(that));
|
|
},
|
|
drawSquare: function (ctx, height) {
|
|
var that = this;
|
|
ctx.rect(that.data.bgImgX, that.data.bgImgY, that.data.boxWidth, height);
|
|
ctx.setFillStyle("#fff");
|
|
ctx.fill();
|
|
},
|
|
drawPosterEnd: function (that) {
|
|
console.log("drawend11111111111111111111");
|
|
that.setData({
|
|
iniLoaded: true,
|
|
showBtn: true
|
|
});
|
|
},
|
|
drawQrcodeEnd: function (that) {
|
|
console.log("drawend222222222222222222222");
|
|
that.setData({
|
|
showBtnQrcode: true
|
|
});
|
|
},
|
|
drawPhoto: function (ctx) {
|
|
var that = this;
|
|
var rate = that.data.windowWidth / 750;
|
|
ctx.save();
|
|
ctx.beginPath();
|
|
ctx.arc(Math.floor(that.data.photoCenterX), Math.floor(that.data.photoCenterY), Math.floor(that.data.radius), 0, 2 * Math.PI);
|
|
ctx.clip();
|
|
ctx.drawImage(that.data.photoImg, Math.floor(that.data.photoStartX), Math.floor(that.data.photoStartY), Math.floor(that.data.photoWidth), Math.floor(that.data.photoHeight));
|
|
ctx.restore();
|
|
ctx.draw();
|
|
},
|
|
drawIntroduction: function (ctx) {
|
|
var that = this;
|
|
var str = that.data.groupDetail.groupIntroduction;
|
|
var groupIntrWidth = that.data.groupIntrWidth;
|
|
ctx.setFontSize(16);
|
|
ctx.setFillStyle("#333333");
|
|
var chr = str.split("");
|
|
var temp = "";
|
|
var row = [];
|
|
for (var a = 0; a < chr.length; a++) {
|
|
if (ctx.measureText(temp).width < groupIntrWidth) {
|
|
temp += chr[a];
|
|
}
|
|
else {
|
|
a--;
|
|
row.push(temp);
|
|
temp = "";
|
|
}
|
|
}
|
|
row.push(temp);
|
|
var num = 4;
|
|
if (row.length > num) {
|
|
var rowCut = row.slice(0, num);
|
|
var rowPart = rowCut[num - 1];
|
|
var test = "";
|
|
var empty = [];
|
|
for (var a = 0; a < rowPart.length; a++) {
|
|
if (ctx.measureText(test).width < groupIntrWidth - 30) {
|
|
test += rowPart[a];
|
|
}
|
|
else {
|
|
break;
|
|
}
|
|
}
|
|
empty.push(test);
|
|
var group = empty[0] + "...";
|
|
rowCut.splice(num - 1, 1, group);
|
|
row = rowCut;
|
|
}
|
|
for (var b = 0; b < row.length; b++) {
|
|
ctx.fillText(row[b], this.data.groupIntrX, this.data.groupIntrY + b * 22, 300);
|
|
}
|
|
},
|
|
saveImg: function () {
|
|
var _this = this;
|
|
var canvasId = this.data.current === 0 ? 'canvasPoster' : 'canvasQrcode';
|
|
wx.showLoading({
|
|
title: '正在保存',
|
|
mask: true,
|
|
});
|
|
setTimeout(function () {
|
|
wx.canvasToTempFilePath({
|
|
canvasId: canvasId,
|
|
x: _this.data.bgImgX,
|
|
y: _this.data.bgImgY,
|
|
width: _this.data.bgImgWidth,
|
|
height: _this.data.current === 0 ? _this.data.boxheight : _this.data.boxheight2,
|
|
success: function (res) {
|
|
wx.hideLoading();
|
|
var tempFilePath = res.tempFilePath;
|
|
wx.saveImageToPhotosAlbum({
|
|
filePath: tempFilePath,
|
|
success: function (res) {
|
|
wx.showModal({
|
|
content: '图片已保存到相册',
|
|
showCancel: false,
|
|
confirmText: '好的',
|
|
confirmColor: '#333',
|
|
success: function (res) {
|
|
if (res.confirm) { }
|
|
},
|
|
fail: function (res) {
|
|
wx.showToast({
|
|
title: "保存失败,请重试",
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
}
|
|
});
|
|
},
|
|
fail: function (res) {
|
|
wx.showToast({
|
|
title: "保存失败，请在小程序设置中打开相册使用权限",
|
|
icon: 'none',
|
|
duration: 2000
|
|
});
|
|
}
|
|
});
|
|
}
|
|
});
|
|
}, 1000);
|
|
},
|
|
handleSwiperChange: function (e) {
|
|
var _a = e.detail, current = _a.current, source = _a.source;
|
|
if (source == "touch") {
|
|
this.setData({ current: current });
|
|
}
|
|
},
|
|
handleShiftMenu: function (e) {
|
|
var value = e.detail.value;
|
|
this.setData({ current: value });
|
|
},
|
|
},
|
|
});
|
|
|