Files
decode-mini-app-v5/wx05cb767e6530b48f/components/imgDrag/imgDrag.js
2024-08-22 12:47:21 +08:00

202 lines
10 KiB
JavaScript

var e = require("../../@babel/runtime/helpers/interopRequireDefault")(require("../../@babel/runtime/regenerator")),
t = require("../../@babel/runtime/helpers/asyncToGenerator"),
a = require("../../@babel/runtime/helpers/toConsumableArray"),
i = require("../../@babel/runtime/helpers/defineProperty");
Component({
options: {multipleSlots: !0},
properties: {
previewSize: {type: Number, value: 100},
defaultGoodsId: {
type: Number, value: 0, observer: function (e) {
console.log("id", e), null == this.data.goodsId ? this.setData({goodsId: e}) : (console.log("来新的了"), this.setData({
goodsId: e,
newGoods: !0
}))
}
},
defaultImgUrlList: {
type: Array, value: [], observer: function (e) {
null != e && e.length && !this.data.imageUrlList.length ? (console.log("初始化-defaultImgUrlList"), this.setData({imageUrlList: e})) : (console.log("未初始化aaa-defaultImgUrlList"), this.data.newGoods && (console.log("初始化bbb-defaultImgUrlList"), this.setData({imageUrlList: e})))
}
},
defaultImgList: {
type: Array, value: [], observer: function (e) {
if (null != e && e.length && !this.data.dragImgList.length) {
console.log("初始化-defaultImgList");
var t = this.getDragImgList(e);
this.setUploaPosition(t.length), this.setData({dragImgList: t})
} else if (console.log("未初始化aaa-defaultImgList"), this.data.newGoods) {
console.log("初始化bbb-defaultImgList");
var a = this.getDragImgList(e);
this.setUploaPosition(a.length), this.setData({dragImgList: a})
}
}
},
maxCount: {type: Number, value: 9},
columns: {type: Number, value: 3},
gap: {type: Number, value: 9},
deleteStyle: {type: String, value: ""}
},
data: {
goodsId: null,
newGoods: !1,
imageUrlList: [],
dragImgList: [],
containerRes: {top: 0, left: 0, width: 0, height: 0},
currentKey: -1,
currentIndex: -1,
tranX: 0,
tranY: 0,
uploadPosition: {tranX: 0, tranY: 0}
},
lifetimes: {
ready: function () {
var e = this;
this.createSelectorQuery().select(".drag-container").boundingClientRect((function (t) {
var a, r = t.top, n = t.left;
e.setData((i(a = {}, "containerRes.top", r), i(a, "containerRes.left", n), a))
})).exec()
}
},
methods: {
longPress: function (e) {
var t = e.mark.index, a = e.touches[0], i = a.pageX, r = a.pageY, n = this.data, o = n.previewSize,
s = n.containerRes, l = s.top, u = s.left;
this.setData({currentIndex: t, tranX: i - o / 2 - u, tranY: r - o / 2 - l})
}, touchMove: function (e) {
if (!(this.data.currentIndex < 0)) {
var t = e.touches[0], a = t.pageX, i = t.pageY, r = this.data, n = r.previewSize, o = r.containerRes,
s = o.top, l = a - n / 2 - o.left, u = i - n / 2 - s;
this.setData({tranX: l, tranY: u});
var g = e.mark.key, c = this.getMoveKey(l, u);
g !== c && this.data.currentKey !== g && (this.data.currentKey = g, this.replace(g, c))
}
}, getMoveKey: function (e, t) {
var a = this.data, i = a.dragImgList, r = a.previewSize, n = a.columns, o = function (e, t) {
var a = Math.round(e / r);
return a >= t ? t - 1 : a < 0 ? 0 : a
}, s = n * o(t, Math.ceil(i.length / n)) + o(e, n);
return s >= i.length ? i.length - 1 : s
}, replace: function (e, t) {
var a = this.data.dragImgList;
console.log("dragImgList", a), a.forEach((function (a) {
e < t ? a.key > e && a.key <= t ? a.key-- : a.key === e && (a.key = t) : e > t && (a.key >= t && a.key < e ? a.key++ : a.key === e && (a.key = t))
})), this.getListPosition(a)
}, getListPosition: function (e) {
var t = this.data, a = t.previewSize, i = t.columns, r = t.gap, n = e.map((function (e) {
return e.tranX = (a + r) * (e.key % i), e.tranY = Math.floor(e.key / i) * (a + r), e
}));
this.setData({dragImgList: n}), this.updateEvent(n)
}, touchEnd: function () {
this.setData({tranX: 0, tranY: 0, currentIndex: -1}), this.data.currentKey = -1
}, updateEvent: function (e) {
console.log(e);
var t = a(e).sort((function (e, t) {
return e.key - t.key
})).map((function (e) {
return {src: e.src, image_id: e.imageId}
}));
this.triggerEvent("updateImageList", {list: t})
}, preview: function (e) {
var t = e.currentTarget.dataset.src;
console.log(t);
var a = this.data.imageUrlList;
console.log(a), wx.previewImage({current: t, urls: a})
}, uploadImage: function () {
var a = this;
return t(e.default.mark((function t() {
var i, r, n, o, s, l, u;
return e.default.wrap((function (e) {
for (; ;) switch (e.prev = e.next) {
case 0:
return i = a, r = a.data, n = r.dragImgList, o = r.maxCount, e.prev = 2, e.next = 5, wx.chooseMedia({
count: o - n.length,
mediaType: ["image"],
sourceType: ["album", "camera"],
maxDuration: 30,
sizeType: ["compressed"],
camera: "back"
});
case 5:
if (s = e.sent, console.log("res", s), "chooseMedia:ok" == s.errMsg) {
e.next = 10;
break
}
return wx.showToast({title: "上传失败", icon: "none", duration: 3e3}), e.abrupt("return");
case 10:
if ("image" == s.type) {
e.next = 13;
break
}
return wx.showToast({
title: "只能上传图片类型",
icon: "none",
duration: 3e3
}), e.abrupt("return");
case 13:
for (wx.showLoading({title: "图片上传中"}), l = s.tempFiles, u = 0; u < l.length; u++) wx.uploadFile({
name: "iFile",
url: "https://wxminiapp.19year.cn/index.php?s=/api/upload/image&wxapp_id=10001",
filePath: l[u].tempFilePath,
success: function (e) {
console.log("resp", e);
var t = JSON.parse(e.data);
if (console.log("resp", t), 1 == t.code) {
var a = i.data.imageUrlList,
r = {file_path: t.data.file_path, image_id: parseInt(t.data.file_id)};
console.log("imageObj", r);
var o = i.getDragImgList([r], !1);
n = n.concat(o), i.setUploaPosition(n.length), a.push(t.data.file_path), i.setData({
dragImgList: n,
imageUrlList: a
}), i.updateEvent(n), wx.hideLoading()
} else wx.hideLoading(), wx.showModal({
title: "提示",
content: "上传失败",
showCancel: !1
})
}
});
e.next = 21;
break;
case 18:
e.prev = 18, e.t0 = e.catch(2), console.log(e.t0);
case 21:
case"end":
return e.stop()
}
}), t, null, [[2, 18]])
})))()
}, getContainerRect: function (e) {
var t = this.data, a = t.columns, i = t.previewSize, r = t.maxCount, n = t.gap, o = e === r ? e : e + 1,
s = Math.ceil(o / a);
return {width: a * i + (a - 1) * n, height: s * i + n * (s - 1)}
}, getDragImgList: function (e) {
var t = !(arguments.length > 1 && void 0 !== arguments[1]) || arguments[1], a = this.data,
i = a.dragImgList, r = a.previewSize, n = a.columns, o = a.gap;
return e.map((function (e, a) {
var s = (t ? 0 : i.length) + a;
return {
tranX: (r + o) * (s % n),
tranY: Math.floor(s / n) * (r + o),
src: e.file_path,
id: s,
key: s,
imageId: e.image_id
}
}))
}, setUploaPosition: function (e) {
var t, a = this.data, r = a.previewSize, n = a.columns, o = a.gap,
s = {tranX: e % n * (r + o), tranY: Math.floor(e / n) * (r + o)}, l = this.getContainerRect(e),
u = l.width, g = l.height;
this.setData((i(t = {uploadPosition: s}, "containerRes.width", u), i(t, "containerRes.height", g), t))
}, deleteImg: function (e) {
var t = e.mark.key, a = this.data.dragImgList.filter((function (e) {
return e.key !== t
}));
a.forEach((function (e) {
e.key > t && e.key--
})), this.getListPosition(a), this.setUploaPosition(a.length)
}
}
});