officialblock 1.0.2 → 1.0.3
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.
- package/dist/official-block.cjs.js +82 -73
- package/dist/official-block.es.js +16155 -11543
- package/dist/official-block.umd.js +82 -73
- package/dist/style.css +1 -1
- package/package.json +3 -2
- package/src/components/ArticleList/index.vue +32 -25
- package/src/components/ArticleList/setting.vue +422 -120
- package/src/components/Button/index.vue +2 -2
- package/src/components/Media/index.vue +3 -3
- package/src/router/index.ts +12 -0
- package/src/style.css +2 -3
- package/src/styles/variables.scss +31 -1
- package/src/views/Layout.vue +4 -1
- package/src/views/components/ArticleListDemo.vue +1 -2
- package/src/views/components/DragLimitDemo.vue +573 -0
- package/src/views/components/DragSortDemo.vue +610 -0
|
@@ -1,29 +1,32 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
<
|
|
7
|
-
<
|
|
8
|
-
<
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
<
|
|
15
|
-
<
|
|
16
|
-
<
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
2
|
+
<div class="article-list-container" :style="{ background: modelValue?.background ? modelValue?.background === 'white' ? '#fff' : '#F7F7FA' : 'transparent' }">
|
|
3
|
+
<a-row class="article-list" @mouseenter="isHover = true" @mouseleave="isHover = false">
|
|
4
|
+
<!-- 左侧文本 后侧媒体 -->
|
|
5
|
+
<!-- 左侧一直是一半，但只有左侧时是100% -->
|
|
6
|
+
<a-col :sm="{span: 24}" :md="{span: hasMedia ? 12 : 24}">
|
|
7
|
+
<div class="article-list-left">
|
|
8
|
+
<template v-for="item in modelValue?.data" :key="item.id">
|
|
9
|
+
<Article v-if="item.type === 'Article'" :article="item.data"></Article>
|
|
10
|
+
<Contact v-if="item.type === 'Contact'" :contact="item.data"></Contact>
|
|
11
|
+
</template>
|
|
12
|
+
</div>
|
|
13
|
+
</a-col>
|
|
14
|
+
<a-col v-if="hasMedia" :sm="{span: 24}" :md="{span: 12}">
|
|
15
|
+
<div class="article-list-right">
|
|
16
|
+
<template v-for="item in modelValue?.data" :key="item.id">
|
|
17
|
+
<Media :type="item.type" :data="item.data" :preview="modelValue.isPreview"></Media>
|
|
18
|
+
</template>
|
|
19
|
+
</div>
|
|
20
|
+
</a-col>
|
|
21
|
+
|
|
22
|
+
<!-- <div v-if="isHover" class="add-btn">
|
|
23
|
+
<icon-plus />
|
|
24
|
+
<span class="btn-text">添加组件</span>
|
|
25
|
+
</div> -->
|
|
26
|
+
<Operate v-model:show="isHover" @handle-edit="showSetting = true" @handle-delete="handleDelete" @handle-copy="handleCopy"></Operate>
|
|
27
|
+
</a-row>
|
|
28
|
+
</div>
|
|
29
|
+
|
|
27
30
|
|
|
28
31
|
<Setting v-model:show="showSetting" :data="modelValue"></Setting>
|
|
29
32
|
</template>
|
|
@@ -170,6 +173,10 @@ handleInit()
|
|
|
170
173
|
/* ===== 响应式设计 - 桌面优先，确保正确的层叠顺序 ===== */
|
|
171
174
|
|
|
172
175
|
/* 基础样式 - 桌面端 (1024px 及以上) */
|
|
176
|
+
|
|
177
|
+
.article-list-container {
|
|
178
|
+
width: 100%;
|
|
179
|
+
}
|
|
173
180
|
.article-list {
|
|
174
181
|
position: relative;
|
|
175
182
|
max-width: 952px;
|