feat(submit): fold slide cover into multi-select image picker
Match the featured cover buttons row to the reference theme: drop the dedicated slide button, let the icon-only image picker select multiple images into a slide cover (single pick stays an image cover), and align the loaded-state visibility matrix.
This commit is contained in:
1 parent
1a0b023658
commit
d0c6c3e431
5 files changed
+86
-31
No files matched your search
@@ -546,9 +546,10 @@ body.aksrt-editor-media-open {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/* 纯图标按钮(设置视频封面/视频/清除):fa 字形行高与文字不同导致图标上偏,
|
||||
/* 纯图标按钮(图片/设置视频封面/视频/清除):fa 字形行高与文字不同导致图标上偏,
|
||||
用 flex 居中修正;并去掉 legacy .but 给图标加的文字间距。btn-delete 的
|
||||
hidden 属性切换依赖默认 display,故用 :not([hidden]) 守卫。 */
|
||||
.featured-edit .btns-full .btn-image,
|
||||
.featured-edit .btns-full .btn-video,
|
||||
.featured-edit .btns-full .btn-delete:not([hidden]) {
|
||||
display: inline-flex;
|
||||
@@ -566,6 +567,7 @@ body.aksrt-editor-media-open {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.featured-edit .btns-full .btn-image > .fa,
|
||||
.featured-edit .btns-full .btn-video-pic > .fa,
|
||||
.featured-edit .btns-full .btn-video > .fa,
|
||||
.featured-edit .btns-full .btn-delete > .fa {
|
||||
@@ -573,11 +575,8 @@ body.aksrt-editor-media-open {
|
||||
}
|
||||
|
||||
.featured-loaded.image .btn-video,
|
||||
.featured-loaded.image .btn-slide,
|
||||
.featured-loaded.slide .btn-video,
|
||||
.featured-loaded.slide .btn-image,
|
||||
.featured-loaded.video .btn-image,
|
||||
.featured-loaded.video .btn-slide {
|
||||
.featured-loaded.video .btn-image {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
+22
-18
@@ -88,6 +88,7 @@
|
||||
isDirty: false,
|
||||
isSubmitting: false,
|
||||
featured: { type: '', data: {} },
|
||||
featuredOptions: {},
|
||||
|
||||
init: function () {
|
||||
this.form = document.getElementById('aksrt-submit-form');
|
||||
@@ -387,6 +388,7 @@
|
||||
if (args && args.type) {
|
||||
this.featured = { type: args.type, data: args.data || {} };
|
||||
}
|
||||
this.featuredOptions = (args && args.options) || {};
|
||||
} catch (e) {}
|
||||
},
|
||||
|
||||
@@ -487,28 +489,30 @@
|
||||
return;
|
||||
}
|
||||
if (act === 'image') {
|
||||
// 与服务端 featured 校验对齐:多选(或仅有幻灯片权限时的单选)存为幻灯片封面,其余存为图片封面。
|
||||
var coverOptions = self.featuredOptions || {};
|
||||
var slideEnabled = !!coverOptions.slide;
|
||||
var imageAllowed = !!coverOptions.image;
|
||||
self.openMediaPicker({
|
||||
type: 'image',
|
||||
multiple: false,
|
||||
allowExternal: false,
|
||||
onSelect: function (item) {
|
||||
if (!item) return;
|
||||
self.setFeatured('image', { url: item.url || '', id: item.attachment_id || item.id || 0 });
|
||||
},
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (act === 'slide') {
|
||||
self.openMediaPicker({
|
||||
type: 'image',
|
||||
multiple: true,
|
||||
maxItems: 30,
|
||||
multiple: slideEnabled,
|
||||
maxItems: slideEnabled ? 30 : 1,
|
||||
allowExternal: false,
|
||||
onSelect: function (items) {
|
||||
var slides = (Array.isArray(items) ? items : []).map(function (item) {
|
||||
return { url: item.url || '', id: item.attachment_id || item.id || 0 };
|
||||
}).filter(function (item) { return item.url || item.id; });
|
||||
if (slides.length) self.setFeatured('slide', slides);
|
||||
var list = Array.isArray(items) ? items : [items];
|
||||
var slides = [];
|
||||
list.forEach(function (item) {
|
||||
if (!item) return;
|
||||
var url = item.url || '';
|
||||
var id = item.attachment_id || item.id || 0;
|
||||
if (url || id) slides.push({ url: url, id: id });
|
||||
});
|
||||
if (!slides.length) return;
|
||||
if (slides.length > 1 || (slideEnabled && !imageAllowed)) {
|
||||
self.setFeatured('slide', slides);
|
||||
return;
|
||||
}
|
||||
self.setFeatured('image', slides[0]);
|
||||
},
|
||||
});
|
||||
return;
|
||||
|
||||
Reference in new issue
Block a user