修改自定义页面的显示

src/api/shop.ts

@@ -0,0 +1,13 @@
+import request from '@/utils/request';
+
+class ShopAPI {
+    /**  分类查询接口*/
+    static getShop() {
+        return request({
+            url: `diyapi/goodsinit`,
+            method: 'post',
+        });
+    }
+}
+
+export default ShopAPI;

src/components/common/custom-module/model-text/index.vue

@@ -1,6 +1,13 @@
 <template>
     <div class="img-outer re" :style="com_style">
-        <div :style="text_style">{{ form.text_title }}</div>
+        <div :style="text_style" class="break">
+            <template v-if="form.is_rich_text">
+                <div :innerHTML="form.text_title"></div>
+            </template>
+            <template v-else>
+                {{ form.text_title }}
+            </template>
+        </div>
     </div>
 </template>
 <script setup lang="ts">
@@ -46,4 +53,13 @@ const set_count = () => {
     }
 };
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.break{
+    word-wrap: break-word;
+    word-break:break-all;
+}
+.rich-text-content {
+    white-space: normal;
+    word-break:break-all;
+}
+</style>

src/components/common/custom-module/model-text/model-text-style.vue

@@ -21,6 +21,9 @@
                 <el-form-item label="链接">
                     <url-value v-model="form.text_link"></url-value>
                 </el-form-item>
+                <el-form-item label="富文本">
+                    <el-switch v-model="form.is_rich_text" />
+                </el-form-item>
                 <el-form-item label="文字颜色">
                     <color-picker v-model="form.text_color" default-color="#FF3F3F"></color-picker>
                 </el-form-item>

src/components/model-custom/components/index-default.ts

@@ -7,6 +7,7 @@ export const text_com_data = {
     data_source_id: '',
     data_source_list: {},
     text_link: {},
+    is_rich_text: false,
     text_color: '#000',
     text_weight: 'normal',
     text_size: 12,

src/components/model-custom/components/index.vue

@@ -71,6 +71,7 @@
                             <!-- 已完成 -->
                             <div class="drag-btn drag-br" :data-index="index" @mousedown.stop="start_drag_btn_br(index, $event)"></div>
                             <div class="drag-btn drag-rc" :data-index="index" @mousedown.stop="start_drag_btn_rc(index, $event)"></div>
+                            
                         </div>
                     </div>
                 </div>
@@ -560,13 +561,14 @@ defineExpose({
 <style lang="scss" scoped>
 @import 'index.scss';
 .model-drag {
-    overflow-y: auto;
+    overflow-y: scroll;
     .model-wall {
         width: 39rem;
         background: #fff;
         margin: 0 auto;
         .drag-area {
             height: v-bind(drag_area_height);
+            margin: 0.5rem 0; // 用于将上边框和下边框显示出来
             user-select: none;
             cursor: crosshair;
         }

src/components/model-shop-list/model-shop-list-content.vue

@@ -71,6 +71,7 @@
 </template>
 <script setup lang="ts">
 import { get_math } from '@/utils';
+import ShopAPI from '@/api/shop';
 const props = defineProps({
     value: {
         type: Object,
@@ -114,6 +115,10 @@ const base_list = {
     ]
 };
 
+// onBeforeMount(() => {
+//     ShopAPI
+// });
+
 const product_list_remove = (index: number) => {
     form.value.product_list.splice(index, 1);
 };

src/store/modules/shop.ts

@@ -0,0 +1,32 @@
+import { ref } from 'vue';
+import { defineStore } from 'pinia';
+
+export const ShopStore = defineStore('shop', () => {
+    // 上传是否需要调接口判断
+    const is_shop_api = ref(false);
+    // 上传分类列表
+    const category = ref<any[]>([]);
+    // 上传分类列表
+    const brand = ref<any[]>([]);
+    // 存储上传分类列表
+    const set_category = (data: any[]) => {
+        category.value = data;
+        is_shop_api.value = true;
+    };
+    const set_brand = (data: any[]) => {
+        brand.value = data;
+        is_shop_api.value = true;
+    };
+    // 如果为false 则转为true
+    const set_is_shop_api = (bool: boolean) => {
+        is_shop_api.value = bool;
+    };
+
+    return {
+        category,
+        is_shop_api,
+        set_category,
+        set_brand,
+        set_is_shop_api,
+    };
+});