修改sort相同的bug

修改sort相同的bug

src/layout/components/template/pages/index/sector.vue

@@ -83,7 +83,9 @@ export default {
             component_name:"",
             sort:1,
             componentData:{
-              text:"通栏广告"
+              text:"通栏广告", //广告位名称
+              width:1200, //广告位宽度
+              height:60, //广告位高度
             }//该组件不请求指定类型的数据，但是后端需要返回imgUrl
           }
         ]

src/store/modules/template.js

@@ -675,22 +675,24 @@ const mutations = {
   },
   //格式化模板信息
   formatTemplateInfo(state, data) {
-    //console.log(data.type);
-    //按照data.data.y的大小排序
-    data.data.sort((a, b) => a.y - b.y);
-    console.log(data,data);
+    // 深拷贝数据，避免直接修改原数据
+    let clonedData = JSON.parse(JSON.stringify(data));
+    // 按照 clonedData.data.y 的大小排序
+    clonedData.data.sort((a, b) => a.y - b.y);
+    //console.log(clonedData, clonedData);
     let websiteData = [];
-    //获取板块的sort
-    for (let index in data.data) {
-      console.log(data.data[index].content);
-      data.data[index].content.sort = Number(index)+1;
-      if(data.type=="index"){
-        //不要把数据直接保存到state.webSiteData.template中，否则无法删除
-        websiteData.push(data.data[index].content)
+    // 获取板块的 sort
+    for (let index = 0; index < clonedData.data.length; index++) {
+      console.log(clonedData.data[index].content);
+      // 使用 Vue.set 来确保属性变更能被 Vue 追踪
+      Vue.set(clonedData.data[index].content, 'sort', Number(index) + 1);
+      if (data.type == "index") {
+        // 不要把数据直接保存到 state.webSiteData.template 中，否则无法删除
+        websiteData.push(clonedData.data[index].content);
       }
     }
-    //保存到对应的页面json中
-    if(data.type=="index"){
+    // 保存到对应的页面 json 中
+    if (data.type == "index") {
       state.webSiteData.template.index = websiteData;
     }
   },
@@ -698,11 +700,9 @@ const mutations = {
   saveTemplate(state) {
     //临时展示保存的数据 后期移除
     state.editWebsiteTemplateJsonWindow = true;
-
     //调用mutations中的方法无需使用$store
     //格式化index的信息
     this.commit('template/formatTemplateInfo',{data:state.pageData.index,type:"index"});
-    
     console.log(state.webSiteData);
   },
   //随机生成模板