From 1e02395b50f42bf4ea4a6feacf7e3e836a461129 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Thu, 22 Aug 2024 17:53:35 +0800
Subject: [PATCH 1/3] =?UTF-8?q?1.=E4=BF=9D=E5=AD=98=E6=95=B0=E6=8D=AE=20sw?=
 =?UTF-8?q?s=202024-08-22?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/diy.ts                                |  36 +++++++
 src/components/base/no-data/index.vue         |  19 +++-
 src/components/common/upload/index.vue        |   2 +-
 src/components/common/upload/upload-model.vue |   2 +-
 .../common/url-value/link-articles.vue        |   2 +-
 .../common/url-value/link-brand.vue           |   2 +-
 .../common/url-value/link-goods-category.vue  |   2 +-
 .../common/url-value/link-goods.vue           |   2 +-
 src/components/common/url-value/link-list.vue |   4 +-
 src/layout/components/navbar/index.vue        |   1 +
 src/layout/index.vue                          | 100 +++++++++++++++---
 11 files changed, 146 insertions(+), 26 deletions(-)
 create mode 100644 src/api/diy.ts

diff --git a/src/api/diy.ts b/src/api/diy.ts
new file mode 100644
index 00000000..0f1b0043
--- /dev/null
+++ b/src/api/diy.ts
@@ -0,0 +1,36 @@
+import { id } from 'element-plus/es/locale';
+import request from '@/utils/request';
+
+class DiyAPI {
+    /**  diy初始化接口--获取详情 */
+    static getInit(data: diy) {
+        return request({
+            url: `diyapi/diydetail`,
+            method: 'post',
+            data,
+        });
+    }
+    /**  diy接口--保存 */
+    static save(data: diyData) {
+        return request({
+            url: `diyapi/diysave`,
+            method: 'post',
+            data,
+        });
+    }
+}
+
+export default DiyAPI;
+
+interface diy {
+    /** 主键 */
+    id: string;
+}
+export interface diyData {
+    id: string;
+    logo: string;
+    name: string;
+    describe: string;
+    config: string;
+    is_enable: string;
+}
diff --git a/src/components/base/no-data/index.vue b/src/components/base/no-data/index.vue
index ace2f568..e79f441a 100644
--- a/src/components/base/no-data/index.vue
+++ b/src/components/base/no-data/index.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="flex-col align-c jc-c w h bg-f" :style="container_style">
         <img :style="style" :src="noData_image" />
-        <p class="size-14 cr-c mt-12">暂无数据</p>
+        <p class="cr-c mt-12" :style="text_style">{{ text }}</p>
     </div>
 </template>
 
@@ -9,20 +9,29 @@
 interface Props {
     imgWidth?: string;
     height?: string;
+    size?: string;
+    text?: string;
 }
 const props = withDefaults(defineProps<Props>(), {
-    imgWidth: '100',
-    height: '200',
+    imgWidth: '100px',
+    height: '200px',
+    size: '14px',
+    text: '暂无数据',
 });
 const noData_image = ref(new URL(`../../../assets/images/noData.png`, import.meta.url).href);
 const style = computed(() => {
     return {
-        width: props.imgWidth.search('px') > -1 ? props.imgWidth : props.imgWidth + 'px',
+        width: props.imgWidth,
     };
 });
 const container_style = computed(() => {
     return {
-        height: props.height.search('px') > -1 ? props.height : props.height + 'px',
+        height: props.height,
+    };
+});
+const text_style = computed(() => {
+    return {
+        fontSize: props.size,
     };
 });
 </script>
diff --git a/src/components/common/upload/index.vue b/src/components/common/upload/index.vue
index 65048d1e..821bd7c0 100644
--- a/src/components/common/upload/index.vue
+++ b/src/components/common/upload/index.vue
@@ -121,7 +121,7 @@
                             </div>
                         </div>
                         <div v-else>
-                            <no-data height="440"></no-data>
+                            <no-data height="440px"></no-data>
                         </div>
                     </el-scrollbar>
                     <div v-if="preview_switch_video && upload_type == 'video'">
diff --git a/src/components/common/upload/upload-model.vue b/src/components/common/upload/upload-model.vue
index 4d720356..5c30aeda 100644
--- a/src/components/common/upload/upload-model.vue
+++ b/src/components/common/upload/upload-model.vue
@@ -136,7 +136,7 @@
                             </el-scrollbar>
                         </div>
                         <div v-else>
-                            <no-data height="280"></no-data>
+                            <no-data height="280px"></no-data>
                         </div>
                     </div>
                 </template>
diff --git a/src/components/common/url-value/link-articles.vue b/src/components/common/url-value/link-articles.vue
index bc96b7a5..32cd0c6b 100644
--- a/src/components/common/url-value/link-articles.vue
+++ b/src/components/common/url-value/link-articles.vue
@@ -40,7 +40,7 @@
 </template>
 <script lang="ts" setup>
 import UrlValueAPI from '@/api/url-value';
-import { urlValueStore, urlValue, pageLinkList } from '@/store';
+import { urlValueStore } from '@/store';
 const url_value_store = urlValueStore();
 const props = defineProps({
     // 重置
diff --git a/src/components/common/url-value/link-brand.vue b/src/components/common/url-value/link-brand.vue
index a6c5ac9f..e353b132 100644
--- a/src/components/common/url-value/link-brand.vue
+++ b/src/components/common/url-value/link-brand.vue
@@ -41,7 +41,7 @@
 </template>
 <script lang="ts" setup>
 import UrlValueAPI from '@/api/url-value';
-import { urlValueStore, urlValue, pageLinkList } from '@/store';
+import { urlValueStore } from '@/store';
 const url_value_store = urlValueStore();
 const props = defineProps({
     // 重置
diff --git a/src/components/common/url-value/link-goods-category.vue b/src/components/common/url-value/link-goods-category.vue
index a64ad38d..528ddbe6 100644
--- a/src/components/common/url-value/link-goods-category.vue
+++ b/src/components/common/url-value/link-goods-category.vue
@@ -30,7 +30,7 @@
     </div>
 </template>
 <script lang="ts" setup>
-import { urlValueStore, urlValue, pageLinkList } from '@/store';
+import { urlValueStore } from '@/store';
 const url_value_store = urlValueStore();
 const props = defineProps({
     // 重置
diff --git a/src/components/common/url-value/link-goods.vue b/src/components/common/url-value/link-goods.vue
index b9b78bea..e565f5f1 100644
--- a/src/components/common/url-value/link-goods.vue
+++ b/src/components/common/url-value/link-goods.vue
@@ -43,7 +43,7 @@
 </template>
 <script lang="ts" setup>
 import UrlValueAPI from '@/api/url-value';
-import { urlValueStore, urlValue, pageLinkList } from '@/store';
+import { urlValueStore } from '@/store';
 const url_value_store = urlValueStore();
 const props = defineProps({
     // 重置
diff --git a/src/components/common/url-value/link-list.vue b/src/components/common/url-value/link-list.vue
index 38d54c80..b86315d1 100644
--- a/src/components/common/url-value/link-list.vue
+++ b/src/components/common/url-value/link-list.vue
@@ -24,7 +24,7 @@
                         </div>
                     </template>
                     <template v-else>
-                        <no-data height="480"></no-data>
+                        <no-data height="480px"></no-data>
                     </template>
                 </div>
             </el-scrollbar>
@@ -32,7 +32,7 @@
     </div>
 </template>
 <script lang="ts" setup>
-import { urlValueStore, urlValue, pageLinkList } from '@/store';
+import { urlValueStore } from '@/store';
 const url_value_store = urlValueStore();
 const props = defineProps({
     // 类型
diff --git a/src/layout/components/navbar/index.vue b/src/layout/components/navbar/index.vue
index 985ae20f..30b55cf9 100644
--- a/src/layout/components/navbar/index.vue
+++ b/src/layout/components/navbar/index.vue
@@ -37,6 +37,7 @@
         </div>
     </div>
     <upload v-model:visible-dialog="is_custom_dialog" is-custom-dialog :is-check-confirm="false"></upload>
+    
 </template>
 <script setup lang="ts">
 const modelValue = defineModel({ type: Object, default: {} });
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 7dffb5ca..7650f0cf 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -1,10 +1,15 @@
 <template>
     <div class="app-wrapper no-copy">
-        <navbar v-model="form.model" @preview="preview" @save="save" @save-close="save_close" />
-        <div class="app-wrapper-content flex-row">
-            <app-main :diy-data="form.diy_data" :header="form.header" :footer="form.footer" @right-update="right_update"></app-main>
-            <settings :key="key" :value="diy_data_item"></settings>
-        </div>
+        <template v-if="!is_empty">
+            <navbar v-model="form.model" @preview="preview" @save="save" @save-close="save_close" />
+            <div class="app-wrapper-content flex-row">
+                <app-main :diy-data="form.diy_data" :header="form.header" :footer="form.footer" @right-update="right_update"></app-main>
+                <settings :key="key" :value="diy_data_item"></settings>
+            </div>
+        </template>
+        <template v-else>
+            <no-data height="100vh" img-width="300" size="40px" text="编辑数据有误"></no-data>
+        </template>
     </div>
 </template>
 
@@ -12,6 +17,7 @@
 import { Navbar, Settings, AppMain } from './components/index';
 import defaultSettings from './components/main/index';
 import { cloneDeep } from 'lodash';
+import DiyAPI, { diyData } from '@/api/diy';
 interface headerAndFooter {
     name: string;
     show_tabs: boolean;
@@ -19,6 +25,7 @@ interface headerAndFooter {
     com_data: any;
 }
 interface diy_data_item {
+    id: string;
     model: {
         img: string;
         name: string;
@@ -26,11 +33,13 @@ interface diy_data_item {
     header: headerAndFooter;
     footer: headerAndFooter;
     diy_data: Array<any>;
+    is_enable: string;
 }
 const form = ref<diy_data_item>({
+    id: '',
     model: {
         img: '',
-        name: 'demo',
+        name: '装修模版',
     },
     header: {
         name: '页面设置',
@@ -45,6 +54,7 @@ const form = ref<diy_data_item>({
         com_data: defaultSettings.footer_nav,
     },
     diy_data: [],
+    is_enable: '1',
 });
 const diy_data_item = ref({});
 
@@ -63,12 +73,31 @@ const right_update = (item: any, diy: [Array<any>], header: headerAndFooter, foo
 onMounted(() => {
     init();
 });
-
+const is_empty = ref(false);
 const init = () => {
     // 获取localStorage数据
-    const diy_data = localStorage.getItem('diy_data');
-    if (diy_data) {
-        form.value = JSON.parse(diy_data);
+    // const diy_data = localStorage.getItem('diy_data');
+    // if (diy_data) {
+    //     form.value = JSON.parse(diy_data);
+    // }
+    // 截取document.location.search字符串内id/后面的所有字段
+    let new_data = { id: '' };
+    if (document.location.search.indexOf('id/') !== -1) {
+        new_data.id = document.location.search.substring(document.location.search.indexOf('id/') + 3);
+        // 去除字符串的.html
+        let html_index = new_data.id.indexOf('.html');
+        if (html_index !== -1) {
+            new_data.id = new_data.id.substring(0, html_index);
+        }
+    }
+    if (new_data.id) {
+        DiyAPI.getInit(new_data).then((res: any) => {
+            if (res.data) {
+                form.value = form_data_transfor_diy_data(res.data);
+            } else {
+                is_empty.value = true;
+            }
+        });
     }
 };
 //#endregion 页面初始化数据 ---------------------end
@@ -79,11 +108,9 @@ const preview = () => {
 };
 const save = () => {
     formmat_form_data(form.value);
-    ElMessage.success('保存成功');
 };
 const save_close = () => {
     formmat_form_data(form.value);
-    ElMessage.success('保存成功');
 };
 const formmat_form_data = (data: diy_data_item) => {
     const clone_form = cloneDeep(data);
@@ -96,9 +123,56 @@ const formmat_form_data = (data: diy_data_item) => {
         };
     });
     // 将数据暂存到localStorage
-    localStorage.setItem('diy_data', JSON.stringify(clone_form));
+    // localStorage.setItem('diy_data', JSON.stringify(clone_form));
+    // 数据改造
+    const new_data = diy_data_transfor_form_data(clone_form);
+    DiyAPI.save(new_data).then((res) => {
+        ElMessage.success('保存成功');
+    });
 };
 //#endregion 顶部导航回调方法 ---------------------end
+// 数据改造
+const diy_data_transfor_form_data = (clone_form: diy_data_item) => {
+    return {
+        id: clone_form.id,
+        logo: clone_form.model.img,
+        name: clone_form.model.name,
+        describe: '',
+        config: JSON.stringify({
+            header: clone_form.header.com_data,
+            footer: clone_form.footer.com_data,
+            diy_data: clone_form.diy_data,
+        }),
+        is_enable: clone_form.is_enable,
+    };
+};
+const form_data_transfor_diy_data = (clone_form: diyData) => {
+    try {
+        return {
+            id: clone_form.id,
+            model: {
+                img: clone_form.logo,
+                name: clone_form.name,
+            },
+            header: JSON.parse(clone_form.config).header,
+            footer: JSON.parse(clone_form.config).footer,
+            diy_data: JSON.parse(clone_form.config).diy_data,
+            is_enable: clone_form.is_enable,
+        };
+    } catch (error) {
+        return {
+            id: clone_form.id,
+            model: {
+                img: clone_form.logo,
+                name: clone_form.name,
+            },
+            header: form.value.header,
+            footer: form.value.footer,
+            diy_data: form.value.diy_data,
+            is_enable: clone_form.is_enable,
+        };
+    }
+};
 </script>
 
 <style scoped lang="scss">

From 30ddaa172a633eb5b7f456c4854bd0d1fdae23e5 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Thu, 22 Aug 2024 18:40:15 +0800
Subject: [PATCH 2/3] =?UTF-8?q?1.=E4=BF=9D=E5=AD=98=E6=95=B0=E6=8D=AE=20sw?=
 =?UTF-8?q?s=202024-08-22?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/footer-nav/index.vue  | 2 +-
 src/layout/components/main/index.vue | 9 ++++++---
 src/layout/index.vue                 | 4 ++--
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/components/footer-nav/index.vue b/src/components/footer-nav/index.vue
index 1d59b50d..e8a041dc 100644
--- a/src/components/footer-nav/index.vue
+++ b/src/components/footer-nav/index.vue
@@ -2,7 +2,7 @@
     <div class="footer-nav flex-row jc-c align-c" :class="showFooter ? 'br-2 br-primary' : ''" @click="footer_nav_event">
         <div class="footer-nav-content flex-row jc-c align-c w" :style="style_container">
             <ul class="flex-row jc-sa align-c w">
-                <li v-for="(item, index) in footerData.content.nav_content" :key="index" class="flex-1 flex-col jc-c align-c gap-5" @mouseenter="is_hover = index + 1" @mouseleave="is_hover = 0">
+                <li v-for="(item, index) in footerData?.content?.nav_content" :key="index" class="flex-1 flex-col jc-c align-c gap-5" @mouseenter="is_hover = index + 1" @mouseleave="is_hover = 0">
                     <div v-if="footerData.content.nav_style !== '2'" class="img re">
                         <img class="img-item abs radius-xs animate-linear w" :class="is_hover != index + 1 ? 'active' : ''" :src="item.src[0]?.url" width="22" height="22" />
                         <img class="img-item abs radius-xs animate-linear w" :class="is_hover == index + 1 ? 'active' : ''" :src="item.src_checked[0]?.url" width="22" height="22" />
diff --git a/src/layout/components/main/index.vue b/src/layout/components/main/index.vue
index ee095fd0..2d2dda0a 100644
--- a/src/layout/components/main/index.vue
+++ b/src/layout/components/main/index.vue
@@ -172,6 +172,7 @@ watch(
     () => props.diyData,
     (newValue) => {
         diy_data.value = newValue;
+        console.log(newValue);
     }
 );
 // 监听
@@ -183,9 +184,11 @@ watch(
     }
 );
 watchEffect(() => {
-    const content = props.header.com_data?.content || {};
-    const container_common_styles = gradient_computer(content) + background_computer(content);
-    content_style.value = container_common_styles;
+    if (props.header.com_data?.content) {
+        const content = props.header.com_data?.content;
+        const container_common_styles = gradient_computer(content) + background_computer(content);
+        content_style.value = container_common_styles;
+    }
 });
 watch(
     () => props.footer,
diff --git a/src/layout/index.vue b/src/layout/index.vue
index 7650f0cf..2dd9fc02 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -139,8 +139,8 @@ const diy_data_transfor_form_data = (clone_form: diy_data_item) => {
         name: clone_form.model.name,
         describe: '',
         config: JSON.stringify({
-            header: clone_form.header.com_data,
-            footer: clone_form.footer.com_data,
+            header: clone_form.header,
+            footer: clone_form.footer,
             diy_data: clone_form.diy_data,
         }),
         is_enable: clone_form.is_enable,

From 69a494678c6da2e9d4d842262b78170a1b820a04 Mon Sep 17 00:00:00 2001
From: sws <1141121512@qq.com>
Date: Thu, 22 Aug 2024 18:44:48 +0800
Subject: [PATCH 3/3] =?UTF-8?q?1.=E4=BF=9D=E5=AD=98=E6=95=B0=E6=8D=AE=20sw?=
 =?UTF-8?q?s=202024-08-22?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layout/index.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/layout/index.vue b/src/layout/index.vue
index 2dd9fc02..e66e4314 100644
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@@ -39,7 +39,7 @@ const form = ref<diy_data_item>({
     id: '',
     model: {
         img: '',
-        name: '装修模版',
+        name: '',
     },
     header: {
         name: '页面设置',