@maketribe/ms-app 3.2.44 → 3.2.46

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (43) hide show
  1. package/dist/cjs/components/basic/lexical-editor/assets/doc-editor.css.js +1 -1
  2. package/dist/cjs/components/basic/lexical-editor/assets/doc-editor.css.js.map +1 -1
  3. package/dist/cjs/components/basic/lexical-editor/nodes/ModuleDecoratorNode.js +1 -1
  4. package/dist/cjs/components/basic/lexical-editor/nodes/ModuleDecoratorNode.js.map +1 -1
  5. package/dist/cjs/components/basic/lexical-editor/utils/html.js +1 -19
  6. package/dist/cjs/components/basic/lexical-editor/utils/html.js.map +1 -1
  7. package/dist/cjs/components/basic/lexical-editor/utils/module.js.map +1 -1
  8. package/dist/cjs/modules/cms/cms-settings.js +5 -1
  9. package/dist/cjs/modules/cms/cms-settings.js.map +1 -1
  10. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js +40 -324
  11. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js.map +1 -1
  12. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner.vue.js +362 -0
  13. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner.vue.js.map +1 -0
  14. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner.vue2.js +4 -0
  15. package/dist/cjs/modules/cms/pages/cms-contents/components/part-banner.vue2.js.map +1 -0
  16. package/dist/cjs/modules/cms/pages/cms-settigns/index.vue2.js +38 -15
  17. package/dist/cjs/modules/cms/pages/cms-settigns/index.vue2.js.map +1 -1
  18. package/dist/esm/components/basic/lexical-editor/assets/doc-editor.css.js +1 -1
  19. package/dist/esm/components/basic/lexical-editor/assets/doc-editor.css.js.map +1 -1
  20. package/dist/esm/components/basic/lexical-editor/nodes/ModuleDecoratorNode.js +1 -1
  21. package/dist/esm/components/basic/lexical-editor/nodes/ModuleDecoratorNode.js.map +1 -1
  22. package/dist/esm/components/basic/lexical-editor/utils/html.js +2 -20
  23. package/dist/esm/components/basic/lexical-editor/utils/html.js.map +1 -1
  24. package/dist/esm/components/basic/lexical-editor/utils/module.js.map +1 -1
  25. package/dist/esm/modules/cms/cms-settings.js +5 -1
  26. package/dist/esm/modules/cms/cms-settings.js.map +1 -1
  27. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js +41 -325
  28. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner-edit.vue.js.map +1 -1
  29. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner.vue.js +363 -0
  30. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner.vue.js.map +1 -0
  31. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner.vue2.js +5 -0
  32. package/dist/esm/modules/cms/pages/cms-contents/components/part-banner.vue2.js.map +1 -0
  33. package/dist/esm/modules/cms/pages/cms-settigns/index.vue2.js +38 -15
  34. package/dist/esm/modules/cms/pages/cms-settigns/index.vue2.js.map +1 -1
  35. package/dist/style/index.css +1 -1
  36. package/dist/style/modules/cms/index.css +1 -1
  37. package/dist/style/modules/cms/pages/cms-contents/components/mk-cms-part-banner.css +1 -1
  38. package/dist/style/modules/cms/pages/cms-contents/index.css +1 -1
  39. package/dist/style/src/modules/cms/pages/cms-contents/components/mk-cms-part-banner.scss +1 -0
  40. package/dist/types/components/basic/lexical-editor/nodes/ModuleDecoratorNode.d.ts +1 -3
  41. package/dist/types/modules/cms/cms-settings.d.ts +5 -1
  42. package/dist/types/modules/cms/pages/cms-contents/components/part-banner.vue.d.ts +32 -0
  43. package/package.json +3 -3
@@ -1,348 +1,64 @@
1
- import { defineComponent, ref, reactive, computed, onMounted, watch, resolveComponent, resolveDirective, unref, withDirectives, openBlock, createElementBlock, createBlock, withCtx, Fragment, renderList, createElementVNode, createCommentVNode, toDisplayString, createVNode, createTextVNode } from "vue";
1
+ import { defineComponent, ref, resolveComponent, unref, openBlock, createElementBlock, createVNode, withCtx, createBlock, createCommentVNode } from "vue";
2
2
  import { useCmsSettings } from "../../../cms-settings.js";
3
- import { DataViewRequest, Where } from "@maketribe/request";
4
- import { Messager, Dialoger } from "@maketribe/dm";
5
- import { CmsAdContentsForm } from "../../../dataviews/cms-ad-contents/CmsAdContentsForm.js";
6
- import { CmsAdDefinesForm } from "../../../dataviews/cms-ad-defines/CmsAdDefinesForm.js";
7
- import "element-plus";
8
- import "@maketribe/utils";
9
- import "../../../../../core/DataModelDefines.js";
10
- import "vue-router";
11
- import "@maketribe/locale";
12
- import "../../../../ms/dataviews/ms-config/MsConfigTable.js";
13
- import "lodash-es";
14
- import "../../../../../components/basic/svg-icon/index.js";
15
- import "../../../../../components/data-model/data-form/index.js";
16
- import "../../../../../components/data-model/data-table/index.js";
17
- import "../../../../../components/data-model/data-table-pagination/index.js";
18
- import "../../../../../components/abstract/abstract-select/abstract-select.js";
19
- import "../../../../../components/abstract/abstract-select/abstract-select-options.js";
20
- import "../../../../../components/basic/button/button-options.js";
21
- import "../../../../../components/basic/config-provider/index.js";
22
- import "../../../../../components/basic/data-table-select/index.js";
23
- import "../../../../../components/basic/data-select/index.js";
24
- import "../../../../../components/basic/pagination/index.js";
25
- import "../../../../../components/basic/system-provider/index.js";
26
- import "../../../../../components/basic/code-editor/index.js";
27
- import "../../../../../components/basic/json-editor/index.js";
28
- import "../../../../../components/basic/page-container/index.js";
29
- import "../../../../../components/basic/date-picker/index.js";
30
- import "../../../../../components/basic/icon-select/index.js";
31
- import "../../../../../components/basic/upload-file/upload-file.js";
32
- import "../../../../../components/basic/upload-file/context/web-file-upload-context.js";
33
- import "../../../../../components/basic/upload-file/context/web-file-upload-context-options.js";
34
- import "../../../../../components/basic/upload-file/ui/upload-image/index.js";
35
- import "../../../../../components/basic/upload-file/ui/upload-file/index.js";
36
- import "../../../../../components/basic/upload-file/ui/upload-video/index.js";
37
- import "../../../../../components/basic/upload-file/upload-file-options.js";
38
- import "../../../../../components/basic/doc-editor/index.js";
39
- import "../../../../../components/basic/copy-container/index.js";
40
- import "../../../../../components/basic/image-cropper/index.js";
41
- import "../../../../../components/basic/visual-page-editor/index.js";
42
- import "../../../../../components/basic/lexical-editor/assets/iconfont.js";
43
- import "@lexical/overflow";
44
- import "@lexical/text";
45
- import "@lexical/utils";
46
- import "lexical";
47
- import "@lexical/selection";
48
- import "@lexical/link";
49
- import "@lexical/rich-text";
50
- import "../../../../../components/basic/lexical-editor/utils/html.js";
51
- import "../../../../../components/basic/lexical-editor/utils/image.js";
52
- import { EditPen, Plus } from "@element-plus/icons-vue";
53
- import "../../../../../components/basic/lexical-editor/composables/useElementBlockSelection.js";
54
- import "@lexical/history";
55
- /* empty css */
56
- import "../../../../../components/basic/lexical-editor/nodes/ModuleDecoratorNode.js";
57
- import "../../../../../components/basic/lexical-editor/nodes/ImageNode.js";
58
- import "../../../../../components/basic/lexical-editor/nodes/ImageTextWarpNode.js";
59
- import "../../../../../components/basic/lexical-editor/nodes/Template.js";
60
- /* empty css */
61
- /* empty css */
62
- /* empty css */
63
- import "../../../../../components/basic/lexical-editor/plugins/RichTextEditorPlugin.js";
64
- import "../../../../../components/basic/lexical-editor/plugins/HashtagPlugin.js";
65
- import "../../../../../components/basic/lexical-editor/plugins/ListPlugin.js";
66
- import "../../../../../components/basic/lexical-editor/plugins/CheckListPlugin.js";
67
- import "../../../../../components/basic/lexical-editor/plugins/TablePlugin.js";
68
- /* empty css */
69
- import "@lexical/dragon";
70
- import "@lexical/plain-text";
71
- import "../../../../../components/basic/lexical-editor/stage/DecoratedTeleports.js";
72
- /* empty css */
73
- import "../../../../../components/business/verify-dialog/verify-dialog-option.js";
74
- import "../../../../../components/business/resource-list/index.js";
75
- import "../../../../../components/business/resource-manager/index.js";
76
- import "../../../../ms/dataviews/department/DepartmentForm.js";
77
- import "../../../../ms/dataviews/department/DepartmentTable.js";
78
- import "../../../../ms/dataviews/department/DepartmentTree.js";
79
- import "../../../../ms/dataviews/log/operate-log/OperateLogTable.js";
80
- import "../../../../ms/dataviews/log/login-log/LoginLogTable.js";
81
- import "../../../../ms/dataviews/log/request-log/RequestLogTable.js";
82
- import "../../../../ms/dataviews/log/local-log/LocalLogTree.js";
83
- import "../../../../ms/components/material-list/index.js";
84
- import "../../../../ms/components/markdown-editor/index.js";
85
- import "../../../../ms/components/rich-text-editor/index.js";
86
- import "../../../../ms/material-upload-context/material-upload-context-options.js";
87
- import "../../../../ms/material-upload-context/material-upload-context.js";
88
- import "@codemirror/lang-html";
89
- const _hoisted_1 = { class: "mk-cms-part-banner__list_item" };
90
- const _hoisted_2 = { class: "mk-cms-part-banner__list_content" };
91
- const _hoisted_3 = /* @__PURE__ */ createElementVNode("div", {
92
- slot: "placeholder",
93
- class: "image-slot"
94
- }, [
95
- /* @__PURE__ */ createTextVNode(" 加载中"),
96
- /* @__PURE__ */ createElementVNode("span", { class: "dot" }, "...")
97
- ], -1);
98
- const _hoisted_4 = ["src"];
99
- const _hoisted_5 = { class: "mk-cms-part-banner__list_bottom" };
100
- const _hoisted_6 = { class: "mk-cms-part-banner__list_title" };
101
- const _hoisted_7 = { class: "mk-cms-part-banner__list_action-mask" };
3
+ import _sfc_main$1 from "./part-banner.vue.js";
102
4
  const _sfc_main = /* @__PURE__ */ defineComponent({
103
5
  __name: "part-banner-edit",
104
6
  props: { partId: { type: String }, title: { type: String } },
105
7
  setup(__props) {
106
- const adRequest = new DataViewRequest({ name: "ad-define", moduleName: "cms" });
107
8
  const cmsSettings = useCmsSettings();
108
- const props = __props;
109
- const partAdBanner = ref(null);
110
- const loading = ref(true);
111
- const warpRef = ref();
112
- const adContentForm = reactive(new CmsAdContentsForm({ cutSise: cmsSettings.part.bannerImageSize }));
113
- const adDefineForm = reactive(new CmsAdDefinesForm());
114
- const partAdBannerHeight = computed(() => {
115
- let proportion = 0;
116
- const widthAndHeight = cmsSettings.part.bannerImageSize.split("*");
117
- let settingHeight = 0;
118
- let settingWidth = 0;
119
- if (!!partAdBanner.value.width && !!partAdBanner.value.height) {
120
- proportion = partAdBanner.value.width / partAdBanner.value.height;
121
- } else {
122
- settingWidth = widthAndHeight[0];
123
- settingHeight = widthAndHeight[1];
124
- proportion = settingWidth / settingHeight;
125
- }
126
- if (Number.isNaN(proportion)) {
127
- return "240px";
128
- } else {
129
- return partAdBanner.value.height ? warpRef.value.offsetWidth / proportion + "px" : warpRef.value.offsetWidth / proportion + "px";
130
- }
131
- });
132
- adContentForm.beforeSubmitEvent.on(async ({ data }) => {
133
- if (partAdBanner.value) {
134
- data.adDefineId = partAdBanner.value.id;
135
- } else {
136
- try {
137
- const widthAndHeight = cmsSettings.part.bannerImageSize.split("*");
138
- const result = await adRequest.add({ key: `part_${props.partId}`, desc: `${props.title}的Banner`, width: widthAndHeight[0], height: widthAndHeight[1] });
139
- if (result.data.code == 200) {
140
- partAdBanner.value = { id: result.data.data };
141
- data.adDefineId = result.data.data;
142
- }
143
- } catch (error) {
144
- Messager.error({ message: "添加失败!" });
145
- }
146
- }
147
- });
148
- adDefineForm.formatSubmitData = (data) => {
149
- if (partAdBanner.value) {
150
- data.id = partAdBanner.value.id;
151
- } else {
152
- data.key = `part_${props.partId}`;
153
- data.desc = `${props.title}的Banner`;
154
- }
155
- return data;
156
- };
157
- adContentForm.submittedEvent.on(() => {
158
- loadPartAdDefineData(props.partId);
159
- });
160
- adDefineForm.submittedEvent.on(() => {
161
- loadPartAdDefineData(props.partId);
162
- });
163
- const loadPartAdDefineData = async (partId) => {
164
- var _a, _b;
165
- try {
166
- loading.value = true;
167
- const where = new Where();
168
- where.addCondition("key", "=", `part_${partId}`);
169
- partAdBanner.value = (await adRequest.query({
170
- data: {
171
- pn: 1,
172
- pc: 1e6,
173
- condition: where
174
- }
175
- })).data.data[0];
176
- if (((_a = partAdBanner.value) == null ? void 0 : _a.width) && ((_b = partAdBanner.value) == null ? void 0 : _b.width)) {
177
- adContentForm.changeCutSise(`${partAdBanner.value.width}*${partAdBanner.value.height}`);
178
- }
179
- } catch (e) {
180
- console.error(e);
181
- } finally {
182
- loading.value = false;
183
- }
184
- };
185
- const showAdContentHandle = async (id) => {
186
- await Dialoger.dataFormDialog({
187
- dataForm: adContentForm,
188
- recId: id
189
- });
190
- };
191
- const showAdDefineHandle = async () => {
192
- var _a;
193
- await Dialoger.dataFormDialog({
194
- title: "设置素材显示尺寸",
195
- dataForm: adDefineForm,
196
- recId: (_a = partAdBanner.value) == null ? void 0 : _a.id
197
- });
198
- adDefineForm.getColumn("contents").visible = false;
199
- adDefineForm.getColumn("key").visible = false;
200
- adDefineForm.getColumn("desc").visible = false;
201
- };
202
- onMounted(() => {
203
- watch(() => props.partId, (id) => {
204
- loadPartAdDefineData(id);
205
- }, { immediate: true });
206
- });
9
+ console.log(cmsSettings.devices);
10
+ const warpElRef = ref();
11
+ const activePartAdType = ref(cmsSettings.devices[0]);
207
12
  return (_ctx, _cache) => {
208
- var _a;
209
- const _component_el_image = resolveComponent("el-image");
210
- const _component_el_button = resolveComponent("el-button");
211
- const _component_el_carousel_item = resolveComponent("el-carousel-item");
212
- const _component_el_carousel = resolveComponent("el-carousel");
213
- const _component_el_text = resolveComponent("el-text");
214
- const _component_el_empty = resolveComponent("el-empty");
215
- const _directive_loading = resolveDirective("loading");
216
- return unref(cmsSettings).part.openBanner ? withDirectives((openBlock(), createElementBlock("div", {
13
+ const _component_el_tab_pane = resolveComponent("el-tab-pane");
14
+ const _component_el_tabs = resolveComponent("el-tabs");
15
+ return unref(cmsSettings).part.openBanner ? (openBlock(), createElementBlock("div", {
217
16
  key: 0,
218
17
  class: "mk-cms-part-banner__warp",
219
- ref_key: "warpRef",
220
- ref: warpRef,
221
- style: { "{height": "partAdBannerHeight}" }
18
+ ref_key: "warpElRef",
19
+ ref: warpElRef
222
20
  }, [
223
- partAdBanner.value && ((_a = partAdBanner.value.contents) == null ? void 0 : _a.length) ? (openBlock(), createBlock(_component_el_carousel, {
224
- key: 0,
225
- autoplay: false,
226
- height: partAdBannerHeight.value,
227
- arrow: "always",
228
- ref: "carouselRef"
21
+ createVNode(_component_el_tabs, {
22
+ modelValue: activePartAdType.value,
23
+ "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activePartAdType.value = $event)
229
24
  }, {
230
25
  default: withCtx(() => [
231
- (openBlock(true), createElementBlock(Fragment, null, renderList(partAdBanner.value.contents, (item) => {
232
- return openBlock(), createBlock(_component_el_carousel_item, {
233
- key: item.id
234
- }, {
235
- default: withCtx(() => [
236
- createElementVNode("div", _hoisted_1, [
237
- createElementVNode("div", _hoisted_2, [
238
- item.type == 1 ? (openBlock(), createBlock(_component_el_image, {
239
- key: 0,
240
- class: "mk-cms-part-banner__list_content_img",
241
- src: item.path,
242
- fit: "cover",
243
- tyle: "width: 100%;height: 100%;"
244
- }, {
245
- default: withCtx(() => [
246
- _hoisted_3
247
- ]),
248
- _: 2
249
- }, 1032, ["src"])) : createCommentVNode("", true),
250
- item.type == 2 ? (openBlock(), createElementBlock("video", {
251
- key: 1,
252
- class: "video",
253
- src: item.path,
254
- style: { "width": "100%", "height": "100%" },
255
- controls: ""
256
- }, null, 8, _hoisted_4)) : createCommentVNode("", true)
257
- ]),
258
- createElementVNode("div", _hoisted_5, [
259
- createElementVNode("div", _hoisted_6, toDisplayString(item.title), 1),
260
- createElementVNode("div", null, toDisplayString(item.desc), 1)
261
- ]),
262
- createElementVNode("div", _hoisted_7, [
263
- createVNode(_component_el_button, {
264
- type: "primary",
265
- style: { "margin-left": "10px" },
266
- icon: unref(EditPen),
267
- onClick: ($event) => showAdContentHandle(item.id)
268
- }, {
269
- default: withCtx(() => [
270
- createTextVNode(" 编辑当前轮播素材 ")
271
- ]),
272
- _: 2
273
- }, 1032, ["icon", "onClick"]),
274
- createVNode(_component_el_button, {
275
- type: "primary",
276
- style: { "margin-left": "10px" },
277
- icon: unref(Plus),
278
- onClick: _cache[0] || (_cache[0] = ($event) => showAdContentHandle(null))
279
- }, {
280
- default: withCtx(() => [
281
- createTextVNode(" 添加新轮播素材 ")
282
- ]),
283
- _: 1
284
- }, 8, ["icon"]),
285
- createVNode(_component_el_button, {
286
- type: "primary",
287
- style: { "margin-left": "10px" },
288
- icon: unref(EditPen),
289
- onClick: _cache[1] || (_cache[1] = ($event) => showAdDefineHandle())
290
- }, {
291
- default: withCtx(() => [
292
- createTextVNode(" 设置素材显示尺寸 ")
293
- ]),
294
- _: 1
295
- }, 8, ["icon"])
296
- ])
297
- ])
298
- ]),
299
- _: 2
300
- }, 1024);
301
- }), 128))
302
- ]),
303
- _: 1
304
- }, 8, ["height"])) : (openBlock(), createBlock(_component_el_empty, {
305
- key: 1,
306
- "image-size": 80,
307
- style: { "height": "240px" }
308
- }, {
309
- description: withCtx(() => [
310
- createVNode(_component_el_text, null, {
311
- default: withCtx(() => [
312
- createTextVNode("暂无轮播素材数据")
313
- ]),
314
- _: 1
315
- }),
316
- createVNode(_component_el_button, {
317
- type: "primary",
318
- text: "",
319
- style: { "margin-left": "10px" },
320
- icon: unref(Plus),
321
- onClick: _cache[2] || (_cache[2] = ($event) => showAdDefineHandle())
26
+ unref(cmsSettings).devices.includes("pc") ? (openBlock(), createBlock(_component_el_tab_pane, {
27
+ key: 0,
28
+ label: "PC端",
29
+ name: "pc"
322
30
  }, {
323
- default: withCtx(() => [
324
- createTextVNode(" 设置素材显示尺寸 ")
325
- ]),
31
+ default: withCtx(() => {
32
+ var _a;
33
+ return [
34
+ createVNode(_sfc_main$1, {
35
+ adkey: `part_${__props.partId}`,
36
+ title: `${__props.title}PC端`,
37
+ viewWidth: (_a = warpElRef.value) == null ? void 0 : _a.offsetWidth
38
+ }, null, 8, ["adkey", "title", "viewWidth"])
39
+ ];
40
+ }),
326
41
  _: 1
327
- }, 8, ["icon"]),
328
- createVNode(_component_el_button, {
329
- type: "primary",
330
- text: "",
331
- style: { "margin-left": "10px" },
332
- icon: unref(Plus),
333
- onClick: _cache[3] || (_cache[3] = ($event) => showAdContentHandle(null))
42
+ })) : createCommentVNode("", true),
43
+ unref(cmsSettings).devices.includes("mobile") ? (openBlock(), createBlock(_component_el_tab_pane, {
44
+ key: 1,
45
+ label: "移动端",
46
+ name: "mobile"
334
47
  }, {
335
48
  default: withCtx(() => [
336
- createTextVNode(" 添加 ")
49
+ createVNode(_sfc_main$1, {
50
+ adkey: `part_${__props.partId}_mobile`,
51
+ title: `${__props.title}移动端`,
52
+ viewWidth: 750,
53
+ style: { "max-width": "750px", "margin": "auto" }
54
+ }, null, 8, ["adkey", "title"])
337
55
  ]),
338
56
  _: 1
339
- }, 8, ["icon"])
57
+ })) : createCommentVNode("", true)
340
58
  ]),
341
59
  _: 1
342
- }))
343
- ])), [
344
- [_directive_loading, loading.value]
345
- ]) : createCommentVNode("", true);
60
+ }, 8, ["modelValue"])
61
+ ], 512)) : createCommentVNode("", true);
346
62
  };
347
63
  }
348
64
  });
@@ -1 +1 @@
1
- {"version":3,"file":"part-banner-edit.vue.js","sources":["../../../../../../../src/modules/cms/pages/cms-contents/components/part-banner-edit.vue"],"sourcesContent":["<template>\r\n <div class=\"mk-cms-part-banner__warp\" ref=\"warpRef\" v-loading=\"loading\" v-if=\"cmsSettings.part.openBanner\" style=\"{height:partAdBannerHeight}\">\r\n <el-carousel v-if=\"partAdBanner && partAdBanner.contents?.length\" :autoplay=\"false\" :height=\"partAdBannerHeight\"\r\n arrow=\"always\" ref=\"carouselRef\">\r\n <el-carousel-item v-for=\"item in partAdBanner.contents\" :key=\"item.id\">\r\n <div class=\"mk-cms-part-banner__list_item\">\r\n <div class=\"mk-cms-part-banner__list_content\">\r\n <el-image class=\"mk-cms-part-banner__list_content_img\" v-if=\"item.type == 1\" :src=\"item.path\" fit=\"cover\"\r\n tyle=\"width: 100%;height: 100%;\">\r\n <div slot=\"placeholder\" class=\"image-slot\">\r\n 加载中<span class=\"dot\">...</span>\r\n </div>\r\n </el-image>\r\n <video class=\"video\" v-if=\"item.type == 2\" :src=\"item.path\" style=\"width: 100%;height: 100%;\"\r\n controls></video>\r\n </div>\r\n <div class=\"mk-cms-part-banner__list_bottom\">\r\n <div class=\"mk-cms-part-banner__list_title\">{{ item.title }}</div>\r\n <div>{{ item.desc }}</div>\r\n </div>\r\n <div class=\"mk-cms-part-banner__list_action-mask\">\r\n <el-button type=\"primary\" style=\"margin-left: 10px;\" :icon=\"EditPen\" @click=\"showAdContentHandle(item.id)\">\r\n 编辑当前轮播素材\r\n </el-button>\r\n <el-button type=\"primary\" style=\"margin-left: 10px;\" :icon=\"Plus\" @click=\"showAdContentHandle(null)\">\r\n 添加新轮播素材\r\n </el-button>\r\n <el-button type=\"primary\" style=\"margin-left: 10px;\" :icon=\"EditPen\" @click=\"showAdDefineHandle()\">\r\n 设置素材显示尺寸\r\n </el-button>\r\n </div>\r\n </div>\r\n </el-carousel-item>\r\n </el-carousel>\r\n <el-empty v-else :image-size=\"80\" style=\"height: 240px;\">\r\n <template #description>\r\n <el-text>暂无轮播素材数据</el-text>\r\n <el-button type=\"primary\" text style=\"margin-left: 10px;\" :icon=\"Plus\" @click=\"showAdDefineHandle()\">\r\n 设置素材显示尺寸\r\n </el-button>\r\n <el-button type=\"primary\" text style=\"margin-left: 10px;\" :icon=\"Plus\" @click=\"showAdContentHandle(null)\">\r\n 添加\r\n </el-button>\r\n </template>\r\n </el-empty>\r\n </div>\r\n</template>\r\n<script setup lang=\"ts\">\r\nimport { useCmsSettings } from \"../../../cms-settings\"\r\nimport { onMounted, reactive, ref, watch, defineProps, computed, Ref } from \"vue\";\r\nimport { DataViewRequest, Where } from \"@maketribe/request\";\r\nimport { Dialoger, Messager } from \"@maketribe/dm\";\r\nimport { CmsAdContentsForm, CmsAdDefinesForm } from \"../../../dataviews\";\r\nimport { EditPen, ArrowDown, Delete, Plus } from \"@element-plus/icons-vue\"\r\n// 广告定义数据表\r\nconst adRequest = new DataViewRequest({ name: \"ad-define\", moduleName: \"cms\" });\r\n// cms 配置\r\nconst cmsSettings = useCmsSettings();\r\nconst props = defineProps({ partId: { type: String }, title: { type: String } })\r\n// 栏目广告\r\nconst partAdBanner = ref<any | null>(null);\r\nconst loading = ref(true);\r\nconst warpRef: Ref<HTMLElement | undefined> = ref();\r\nconst adContentForm = reactive<CmsAdContentsForm>(new CmsAdContentsForm({ cutSise: cmsSettings.part.bannerImageSize }))\r\nconst adDefineForm = reactive<CmsAdDefinesForm>(new CmsAdDefinesForm())\r\nconst partAdBannerHeight = computed(() => {\r\n //判断有没有banner属性\r\n let proportion = 0;\r\n const widthAndHeight = cmsSettings.part.bannerImageSize.split(\"*\");\r\n let settingHeight = 0\r\n let settingWidth = 0\r\n\r\n //设定的比例\r\n if (!!partAdBanner.value.width && !!partAdBanner.value.height) {\r\n proportion = partAdBanner.value.width / partAdBanner.value.height;\r\n } else {\r\n settingWidth = widthAndHeight[0] as any;\r\n\r\n settingHeight = widthAndHeight[1] as any;\r\n proportion = settingWidth / settingHeight\r\n }\r\n\r\n\r\n //比例是NaN,直接返回默认\r\n if (Number.isNaN(proportion)) {\r\n return \"240px\"\r\n } else {\r\n //通过比例确定高度\r\n return partAdBanner.value.height ? (warpRef.value!.offsetWidth / proportion) + \"px\" : (warpRef.value!.offsetWidth / proportion) + \"px\"\r\n }\r\n})\r\n\r\n\r\n// window.addEventListener(\"resize\", () => {\r\n// const proportion = partAdBanner.value.width / partAdBanner.value.height;\r\n// })\r\n\r\n// 内容添加之前监测广告是否存在不存在先添加广告\r\nadContentForm.beforeSubmitEvent.on(async ({ data }) => {\r\n if (partAdBanner.value) {\r\n data.adDefineId = partAdBanner.value.id as any;\r\n }\r\n else {\r\n try {\r\n\r\n const widthAndHeight = cmsSettings.part.bannerImageSize.split(\"*\");\r\n // 添加广告\r\n const result = await adRequest.add({ key: `part_${props.partId}`, desc: `${props.title}的Banner`, width: widthAndHeight[0], height: widthAndHeight[1] })\r\n\r\n if (result.data.code == 200) {\r\n partAdBanner.value = { id: result.data.data as string }\r\n data.adDefineId = result.data.data;\r\n }\r\n\r\n } catch (error) {\r\n Messager.error({ message: \"添加失败!\" });\r\n }\r\n }\r\n\r\n})\r\n\r\n//提交判断是否存在,判断更新还是添加\r\nadDefineForm.formatSubmitData = ((data) => {\r\n if (partAdBanner.value) {\r\n data.id = partAdBanner.value.id as any;\r\n } else {\r\n data.key = `part_${props.partId}`\r\n data.desc = `${props.title}的Banner`\r\n }\r\n return data\r\n})\r\n\r\n\r\n\r\n// 添加完成则刷新\r\nadContentForm.submittedEvent.on(() => {\r\n loadPartAdDefineData(props.partId)\r\n})\r\n//加完成则刷新\r\nadDefineForm.submittedEvent.on(() => {\r\n loadPartAdDefineData(props.partId)\r\n})\r\n\r\n//加载栏目广告\r\nconst loadPartAdDefineData = async (partId: any) => {\r\n\r\n try {\r\n\r\n loading.value = true;\r\n const where = new Where()\r\n where.addCondition(\"key\", \"=\", `part_${partId}`);\r\n // 加载广告定义\r\n partAdBanner.value = (await adRequest.query({\r\n data: {\r\n pn: 1,\r\n pc: 1000000,\r\n condition: where\r\n }\r\n })).data.data[0];\r\n if (partAdBanner.value?.width && partAdBanner.value?.width) {\r\n adContentForm.changeCutSise(`${partAdBanner.value.width}*${partAdBanner.value.height}`)\r\n }\r\n\r\n } catch (e) {\r\n console.error(e)\r\n } finally {\r\n loading.value = false;\r\n }\r\n}\r\n//显示栏目广告的编辑弹窗\r\nconst showAdContentHandle = async (id: any) => {\r\n\r\n\r\n await Dialoger.dataFormDialog({\r\n dataForm: adContentForm as CmsAdContentsForm,\r\n recId: id\r\n })\r\n}\r\n//显示栏目广告定义的编辑弹窗\r\nconst showAdDefineHandle = async () => {\r\n await Dialoger.dataFormDialog({\r\n title: \"设置素材显示尺寸\",\r\n dataForm: adDefineForm as CmsAdDefinesForm,\r\n recId: partAdBanner.value?.id\r\n })\r\n adDefineForm.getColumn(\"contents\")!.visible = false;\r\n adDefineForm.getColumn(\"key\")!.visible = false;\r\n adDefineForm.getColumn(\"desc\")!.visible = false;\r\n}\r\n\r\n// 组件挂载的时候\r\nonMounted(() => {\r\n watch(() => props.partId, id => {\r\n loadPartAdDefineData(id)\r\n }, { immediate: true })\r\n})\r\n\r\n</script>\r\n<style lang='scss'></style>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDM,UAAA,YAAY,IAAI,gBAAgB,EAAE,MAAM,aAAa,YAAY,OAAO;AAE9E,UAAM,cAAc;AACpB,UAAM,QAAQ;AAER,UAAA,eAAe,IAAgB,IAAI;AACnC,UAAA,UAAU,IAAI,IAAI;AACxB,UAAM,UAAwC;AACxC,UAAA,gBAAgB,SAA4B,IAAI,kBAAkB,EAAE,SAAS,YAAY,KAAK,gBAAiB,CAAA,CAAC;AACtH,UAAM,eAAe,SAA2B,IAAI,iBAAkB,CAAA;AAChE,UAAA,qBAAqB,SAAS,MAAM;AAExC,UAAI,aAAa;AACjB,YAAM,iBAAiB,YAAY,KAAK,gBAAgB,MAAM,GAAG;AACjE,UAAI,gBAAgB;AACpB,UAAI,eAAe;AAGf,UAAA,CAAC,CAAC,aAAa,MAAM,SAAS,CAAC,CAAC,aAAa,MAAM,QAAQ;AAC7D,qBAAa,aAAa,MAAM,QAAQ,aAAa,MAAM;AAAA,MAAA,OACtD;AACL,uBAAe,eAAe,CAAC;AAE/B,wBAAgB,eAAe,CAAC;AAChC,qBAAa,eAAe;AAAA,MAC9B;AAII,UAAA,OAAO,MAAM,UAAU,GAAG;AACrB,eAAA;AAAA,MAAA,OACF;AAEE,eAAA,aAAa,MAAM,SAAU,QAAQ,MAAO,cAAc,aAAc,OAAQ,QAAQ,MAAO,cAAc,aAAc;AAAA,MACpI;AAAA,IAAA,CACD;AAQD,kBAAc,kBAAkB,GAAG,OAAO,EAAE,WAAW;AACrD,UAAI,aAAa,OAAO;AACjB,aAAA,aAAa,aAAa,MAAM;AAAA,MAAA,OAElC;AACC,YAAA;AAEF,gBAAM,iBAAiB,YAAY,KAAK,gBAAgB,MAAM,GAAG;AAE3D,gBAAA,SAAS,MAAM,UAAU,IAAI,EAAE,KAAK,QAAQ,MAAM,MAAM,IAAI,MAAM,GAAG,MAAM,KAAK,WAAW,OAAO,eAAe,CAAC,GAAG,QAAQ,eAAe,CAAC,EAAG,CAAA;AAElJ,cAAA,OAAO,KAAK,QAAQ,KAAK;AAC3B,yBAAa,QAAQ,EAAE,IAAI,OAAO,KAAK;AAClC,iBAAA,aAAa,OAAO,KAAK;AAAA,UAChC;AAAA,iBAEO,OAAO;AACd,mBAAS,MAAM,EAAE,SAAS,QAAS,CAAA;AAAA,QACrC;AAAA,MACF;AAAA,IAAA,CAED;AAGY,iBAAA,mBAAoB,CAAC,SAAS;AACzC,UAAI,aAAa,OAAO;AACjB,aAAA,KAAK,aAAa,MAAM;AAAA,MAAA,OACxB;AACA,aAAA,MAAM,QAAQ,MAAM,MAAM;AAC1B,aAAA,OAAO,GAAG,MAAM,KAAK;AAAA,MAC5B;AACO,aAAA;AAAA,IAAA;AAMK,kBAAA,eAAe,GAAG,MAAM;AACpC,2BAAqB,MAAM,MAAM;AAAA,IAAA,CAClC;AAEY,iBAAA,eAAe,GAAG,MAAM;AACnC,2BAAqB,MAAM,MAAM;AAAA,IAAA,CAClC;AAGK,UAAA,uBAAuB,OAAO,WAAgB;;AAE9C,UAAA;AAEF,gBAAQ,QAAQ;AACV,cAAA,QAAQ,IAAI;AAClB,cAAM,aAAa,OAAO,KAAK,QAAQ,MAAM,EAAE;AAElC,qBAAA,SAAS,MAAM,UAAU,MAAM;AAAA,UAC1C,MAAM;AAAA,YACJ,IAAI;AAAA,YACJ,IAAI;AAAA,YACJ,WAAW;AAAA,UACb;AAAA,QACD,CAAA,GAAG,KAAK,KAAK,CAAC;AACf,cAAI,kBAAa,UAAb,mBAAoB,YAAS,kBAAa,UAAb,mBAAoB,QAAO;AAC5C,wBAAA,cAAc,GAAG,aAAa,MAAM,KAAK,IAAI,aAAa,MAAM,MAAM,EAAE;AAAA,QACxF;AAAA,eAEO,GAAG;AACV,gBAAQ,MAAM,CAAC;AAAA,MAAA,UACf;AACA,gBAAQ,QAAQ;AAAA,MAClB;AAAA,IAAA;AAGI,UAAA,sBAAsB,OAAO,OAAY;AAG7C,YAAM,SAAS,eAAe;AAAA,QAC5B,UAAU;AAAA,QACV,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAGH,UAAM,qBAAqB,YAAY;;AACrC,YAAM,SAAS,eAAe;AAAA,QAC5B,OAAO;AAAA,QACP,UAAU;AAAA,QACV,QAAO,kBAAa,UAAb,mBAAoB;AAAA,MAAA,CAC5B;AACY,mBAAA,UAAU,UAAU,EAAG,UAAU;AACjC,mBAAA,UAAU,KAAK,EAAG,UAAU;AAC5B,mBAAA,UAAU,MAAM,EAAG,UAAU;AAAA,IAAA;AAI5C,cAAU,MAAM;AACR,YAAA,MAAM,MAAM,QAAQ,CAAM,OAAA;AAC9B,6BAAqB,EAAE;AAAA,MAAA,GACtB,EAAE,WAAW,KAAA,CAAM;AAAA,IAAA,CACvB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"part-banner-edit.vue.js","sources":["../../../../../../../src/modules/cms/pages/cms-contents/components/part-banner-edit.vue"],"sourcesContent":["<template>\r\n <div class=\"mk-cms-part-banner__warp\" v-if=\"cmsSettings.part.openBanner\" ref=\"warpElRef\">\r\n <el-tabs v-model=\"activePartAdType\">\r\n <el-tab-pane label=\"PC端\" name=\"pc\" v-if=\"cmsSettings.devices.includes('pc')\">\r\n <PartBannerComponent :adkey=\"`part_${partId}`\" :title=\"`${title}PC端`\" :viewWidth=\"warpElRef?.offsetWidth\" />\r\n </el-tab-pane>\r\n <el-tab-pane label=\"移动端\" name=\"mobile\" v-if=\"cmsSettings.devices.includes('mobile')\">\r\n <PartBannerComponent :adkey=\"`part_${partId}_mobile`\" :title=\"`${title}移动端`\" :viewWidth=\"750\"\r\n style=\"max-width: 750px;margin: auto;\" />\r\n </el-tab-pane>\r\n </el-tabs>\r\n </div>\r\n</template>\r\n<script setup lang=\"ts\">\r\nimport { ref, defineProps } from \"vue\"\r\nimport { useCmsSettings } from \"../../../cms-settings\"\r\nimport PartBannerComponent from \"./part-banner.vue\"\r\n\r\ndefineProps({ partId: { type: String }, title: { type: String } })\r\n\r\n// cms 配置\r\nconst cmsSettings = useCmsSettings();\r\nconsole.log(cmsSettings.devices);\r\n// cms 配置\r\nconst warpElRef = ref<any>()\r\n// 栏目广告\r\nconst activePartAdType = ref(cmsSettings.devices[0])\r\n\r\n</script>\r\n"],"names":[],"mappings":";;;;;;;AAqBA,UAAM,cAAc;AACZ,YAAA,IAAI,YAAY,OAAO;AAE/B,UAAM,YAAY;AAElB,UAAM,mBAAmB,IAAI,YAAY,QAAQ,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}