//cms中的接口 获取网站基本信息，网站导航，网站底部导航，网站行政区划 import {getSiteInfo,getSiteCategory,getFooterCategoryList,selectWebsiteArea} from '@/api/cms' //自助建站的接口 用于添加基本信息 import {getWebsiteintel,addWebsiteTemplateintel,getWebsiteTemplateintel,upWebsiteTemplateintel,getAllTemplateClass,getWebsiteTemplateList,addWebsiteTemplateclassintel, getWebsiteTemplateclassintel,addWebsiteTemplate,getWebsiteTemplateInfo,getWebsiteTemplateData} from '@/api/template' import { Message } from 'element-ui'; //注意在这里引入是非常不符合规范的 import Vue from 'vue'; //导入Vue 因为我们要进行深层次的json修改，深拷贝的数据无法令视图更新 //所以我们需要使用Vue的$set方法来强制视图更新，在vuex中没有this，这里我们需要通过引入vue来使用vue.$set //引入随机模板json //首页 风格1 import randomIndex1 from '@/utils/templateJson/index/style1/1.js'; //首页 风格2 import randomIndex2 from '@/utils/templateJson/index/style1/2.js'; const state = { //0.全局配置 start------------------------------------------------------------> editWebsiteId: "",//当前编辑网站的id editWebsiteClass:"",//当前编辑网站的风格 stepStatus: true,//是否显示现在进行到哪一步：true=显示 false=不显示 //0.全局配置 end------------------------------------------------------------> //1.画布数据 start------------------------------------------------------------> pageStatus:1,//当前编辑哪个页面 1=首页 2=分类页 3=列表页 4=详情页 5=搜索页 6=自定义列表页 7=自定义详情页 menuType:1, //当前菜单显示板块还是组件 1=板块 2=组件 previewStatus:false,//是否预览 gridKey:0,//使用gridKey来强制更新视图 loading:false,//是否显示加载中 pageData: { //自助建站拖拽板块的数据，注意，这里并不是提交到后台的数据 index:[ ],//首页 class:[],//分类页 list:[],//列表页 article:[],//详情页 search:[],//搜索页 aloneList:[],//自定义列表页 aloneArticle:[],//自定义详情页 }, // layout: [ // // i = id // // w = 最大宽度是12 // // { i: "0", x: 0, y: 0, w: 12, h: 2, content:""}, // // { i: "1", x: 0, y: 0, w: 12, h: 2, content:""}, // ], //1.画布数据 end------------------------------------------------------------> //2.站点数据 start------------------------------------------------------------> webSiteInfo:"",//网站信息 webSiteMenu:"",//网站包含的导航池 area:{//地区 economize:[],//省区 market:[],//市区 county:[]//县区 }, departmentList:"",//职能部门 //2.站点数据 end------------------------------------------------------------> //3.画布构造 start------------------------------------------------------------> editSectorY:0,//当前组件在画布中的位置 mouseXY:{//鼠标位置 "x": 12, "y": 33 }, DragPos:{//创建的占位符大小 "x": null, "y": null, "w": 12, "h": 2, "i": null }, //获得gridlayout对象 gridlayoutObj:null, //3.画布构造 end------------------------------------------------------------> //4.构造的网站数据 start------------------------------------------------------------> editWindowStatus:false,//编辑组件弹出框是否显示 editComponentWindowStatus:false,//选择组件样式弹出框是否显示 editWebsiteTemplateJsonWindow:false,//当前准备提交的数据 后期删除 editWindowTitle:"",//编辑弹出框标题 editSectorId:0,//当前正在编辑的板块id editDataSort:0,//当前正在编辑的数据位置 editComponentSort:0,//当前正在编辑的组件id editComponentType:0,//当前正在编辑的组件类型 editComponentSize:0,//当前组件展示的条数 editComponentStyle:0,//当前编辑的组件样式 editWebsiteCategory:[],//当前网站全部关联导航 webSiteData:{ //1.base网站基本信息 base:{ websiteId:"",//网站id }, //2.style信息 style:{ styleId:"",//风格id }, //3.板块信息 header,menu,footer 是页面自带的无需构建 template:{ //index = 首页 class=分类页 list=列表页 article=详情页 search=搜索页 aloneList=自定义列表页 aloneArticle=自定义详情页 index:[], class:[],//分类页 list:[],//列表页 article:[],//详情页 search:[],//搜索页 aloneList:[],//自定义列表页 aloneArticle:[],//自定义详情页 } }, //4.构造的网站数据 end------------------------------------------------------------> //5.组件回显数据 start------------------------------------------------------------> componentViewData:{ pid_arr:[],//导航池 pageSize:"",//展示条数 adName:"",//广告名称 titleName:"",//标题名称 } //5.组件回显数据 start------------------------------------------------------------> } const mutations = { //0.全局配置 start------------------------------------------------------------> //设置网站的id setEditWebsiteId(state,id){ state.editWebsiteId = id; }, //设置网站的风格 setClassNumber(state,id){ state.editWebsiteClass = id; }, //展示步骤 showStepStatus(state){ state.stepStatus = true; }, //隐藏步骤 hiddenStepStatus(state){ state.stepStatus = false; }, //设置步骤 setPageStatus(state,num){ state.pageStatus = num; }, //设置预览状态 setPreviewStatus(state){ state.previewStatus = !state.previewStatus; }, //打开编辑组件弹出框 setEditWindowStatus(state,data){ state.editWindowStatus = true; state.editSectorId = data.id; state.editSectorY = data.y; state.editDataSort = data.dataSort; state.editComponentSort = data.sort; state.editComponentType = data.type; state.editComponentSize = data.size; }, //关闭编辑组件弹出框 closeEditWindowStatus(state){ state.editWindowStatus = false; }, //打开选择组件样式弹出框 setComponentStyleStatus(state,data){ state.editComponentWindowStatus = true; state.editSectorId = data.id; state.editDataSort = data.dataSort; state.editComponentSort = data.sort; state.editComponentType = data.type; state.editComponentStyle = data.style; }, //关闭选择组件样式弹出框 closeComponentStyleStatus(state){ state.editComponentWindowStatus = false; }, //关闭提交数据弹出框 closeEditWebsiteTemplateJsonWindow(state){ state.editWebsiteTemplateJsonWindow = false; }, //选择组件样式 selectComponentStyleNumber(state,data){ state.editComponentStyle = data; }, //设置组件回显数据 setComponentViewData(state,data){ //首页 if(state.pageStatus == 1){ //找到要修改的板块 const targetModuleIndex = state.pageData.index.findIndex(module => module.i === data.id); //判断组件类型 1=普通新闻 2=tabs新闻选项卡 3=广告 4=友情链接 6=静态组件 7=文本 8=评论 if(state.editComponentType == 1){ state.componentViewData.pid_arr = state.pageData.index[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //2=tabs新闻选项卡 if(state.editComponentType == 2){ state.componentViewData.pid_arr = state.pageData.index[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //3=广告名称 if(state.editComponentType == 3){ state.componentViewData.adName = state.pageData.index[targetModuleIndex].content.componentList[data.sort].componentData.text; } //7=标题 if(state.editComponentType == 7){ state.componentViewData.titleName = state.pageData.index[targetModuleIndex].content.componentList[data.sort].componentData.text; } } //pageStatus==2 分类页 if(state.pageStatus == 2){} //pageStatus==3 列表页 if(state.pageStatus == 3){ const targetModuleIndex = state.pageData.list.findIndex(module => module.i === data.id); //判断组件类型 1=普通新闻 2=tabs新闻选项卡 3=广告 4=友情链接 6=静态组件 7=文本 8=评论 if(state.editComponentType == 1){ state.componentViewData.pid_arr = state.pageData.list[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //2=tabs新闻选项卡 if(state.editComponentType == 2){ state.componentViewData.pid_arr = state.pageData.list[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //3=广告名称 if(state.editComponentType == 3){ state.componentViewData.adName = state.pageData.list[targetModuleIndex].content.componentList[data.sort].componentData.text; } //7=标题 if(state.editComponentType == 7){ state.componentViewData.titleName = state.pageData.list[targetModuleIndex].content.componentList[data.sort].componentData.text; } } //pageStatus==4 详情页 if(state.pageStatus == 4){ const targetModuleIndex = state.pageData.article.findIndex(module => module.i === data.id); //判断组件类型 1=普通新闻 2=tabs新闻选项卡 3=广告 4=友情链接 6=静态组件 7=文本 8=评论 if(state.editComponentType == 1){ state.componentViewData.pid_arr = state.pageData.article[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //2=tabs新闻选项卡 if(state.editComponentType == 2){ state.componentViewData.pid_arr = state.pageData.article[targetModuleIndex].content.componentList[data.sort].componentData.category_id; state.componentViewData.pageSize = state.editComponentSize; } //3=广告名称 if(state.editComponentType == 3){ state.componentViewData.adName = state.pageData.article[targetModuleIndex].content.componentList[data.sort].componentData.text; } //7=标题 if(state.editComponentType == 7){ state.componentViewData.titleName = state.pageData.article[targetModuleIndex].content.componentList[data.sort].componentData.text; } } //pageStatus==5 搜索页 if(state.pageStatus == 5){} //pageStatus==6 自定义列表页 if(state.pageStatus == 6){} //pageStatus==7 自定义详情页 if(state.pageStatus == 7){} }, //0.全局配置 start------------------------------------------------------------> //1.配置模块 start------------------------------------------------------------> //获得gridlayout对象 setGridlayoutObj(state,data){ state.gridlayoutObj = data; }, //添加板块 addModule(state,data){ //pageStatus==1 首页 index if(state.pageStatus == 1){ //开始复制 start------------------------------------------------------------> //判断当前一共有多少个模块最多能添加10个 if(state.pageData.index.length >= 10){ Message.error('最多只能添加10个模块！'); return; }else{ //判断是拖拽的还是点击添加进来的 click=点击 if(data.source == "click"){ console.log("通过点击添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.index.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.index.length; //添加板块id state.pageData.index.push({ //i: state.pageData.index.length, //base 0.0.1 此方法会导致重复的id出现 i: id, x: 0, y: maxY + 1, w: 12, h: data.h, type: data.type, //sectorData:data.jsonData //base 0.0.1 此问题导致深层数据无法被视图渲染 content:data.jsonData, dataSort:dataSort }); console.log("当前添加模块的dataSort为：" + dataSort); //当前的页面构建数据 console.log(state.pageData.index); } //drag=拖拽 if(data.source == "drag"){ //拖拽添加 console.log("通过拖拽添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.index.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.index.length; //添加板块id state.pageData.index.push({ //i: state.pageData.index.length, //base 0.0.1 此方法会导致重复的id出现 i: id, x: data.x, y: data.y, w: 12, h: data.h, type: data.type, //sectorData:data.jsonData //base 0.0.1 此问题导致深层数据无法被视图渲染 content:data.jsonData, dataSort:dataSort }); console.log("当前添加模块的dataSort为：" + dataSort); //当前的页面构建数据 console.log(state.pageData.index); //需要调查一下这里最后的1，1 state.gridlayoutObj.dragEvent('dragend', data.i, data.x, data.y, 1,1); try { state.gridlayoutObj.$children[state.pageData.index.length].$refs.item.style.display="block"; } catch {} } } //开始复制 end------------------------------------------------------------> } //pageStatus==2 分类页 class if(state.pageStatus == 2){} //pageStatus==3 列表页 list if(state.pageStatus == 3){ //开始复制 start------------------------------------------------------------> //判断当前一共有多少个模块最多能添加10个 if(state.pageData.list.length >= 10){ Message.error('最多只能添加10个模块！'); return; }else{ //判断是拖拽的还是点击添加进来的 click=点击 if(data.source == "click"){ console.log("通过点击添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.list.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.list.length; //添加板块id state.pageData.list.push({ i: id, x: 0, y: maxY + 1, w: 12, h: data.h, type: data.type, content:data.jsonData, dataSort:dataSort }); } //drag=拖拽 if(data.source == "drag"){ //拖拽添加 console.log("通过拖拽添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.list.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.list.length; //添加板块id state.pageData.list.push({ //i: state.pageData.list.length, //base 0.0.1 此方法会导致重复的id出现 i: id, x: data.x, y: data.y, w: 12, h: data.h, type: data.type, //sectorData:data.jsonData //base 0.0.1 此问题导致深层数据无法被视图渲染 content:data.jsonData, dataSort:dataSort }); console.log("当前添加模块的dataSort为：" + dataSort); //当前的页面构建数据 console.log(state.pageData.list); //需要调查一下这里最后的1，1 state.gridlayoutObj.dragEvent('dragend', data.i, data.x, data.y, 1,1); try { state.gridlayoutObj.$children[state.pageData.list.length].$refs.item.style.display="block"; } catch {} } } //开始复制 end------------------------------------------------------------> } //pageStatus==4 详情页 article if(state.pageStatus == 4){ //开始复制 start------------------------------------------------------------> //判断当前一共有多少个模块最多能添加10个 if(state.pageData.article.length >= 10){ Message.error('最多只能添加10个模块！'); return; }else{ //判断是拖拽的还是点击添加进来的 click=点击 if(data.source == "click"){ console.log("通过点击添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.article.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.article.length; //添加板块id state.pageData.article.push({ i: id, x: 0, y: maxY + 1, w: 12, h: data.h, type: data.type, content:data.jsonData, dataSort:dataSort }); } //drag=拖拽 if(data.source == "drag"){ //拖拽添加 console.log("通过拖拽添加一个板块"); //通过时间戳生成id const currentTimestamp = Date.now(); let id = currentTimestamp; //data.type 组件名称 data.h 模块高度 //计算当前布局的最大 y 值 const maxY = Math.max(...state.pageData.article.map(item => item.y), 0); console.log(data); //设置数据在构建json中的位置 let dataSort = state.pageData.article.length; //添加板块id state.pageData.article.push({ //i: state.pageData.article.length, //base 0.0.1 此方法会导致重复的id出现 i: id, x: data.x, y: data.y, w: 12, h: data.h, type: data.type, //sectorData:data.jsonData //base 0.0.1 此问题导致深层数据无法被视图渲染 content:data.jsonData, dataSort:dataSort }); console.log("当前添加模块的dataSort为：" + dataSort); //当前的页面构建数据 console.log(state.pageData.article); //需要调查一下这里最后的1，1 state.gridlayoutObj.dragEvent('dragend', data.i, data.x, data.y, 1,1); try { state.gridlayoutObj.$children[state.pageData.article.length].$refs.item.style.display="block"; } catch {} } } //开始复制 end------------------------------------------------------------> } //pageStatus==5 搜索页 search if(state.pageStatus == 5){} //pageStatus==6 自定义列表页 aloneList if(state.pageStatus == 6){} //pageStatus==7 自定义详情页 aloneArticle if(state.pageStatus == 7){} }, //删除板块 deleteModule(state,data){ //data.i = id //data.dataSort = dataSort //pageStatus==1 首页 if(state.pageStatus == 1){ //开始复制 start------------------------------------------------------------> //必须通过重新查找id的方式来删除 const indexToRemove = state.pageData.index.findIndex(item => item.i === data.i); if (indexToRemove !== -1) { state.pageData.index.splice(indexToRemove, 1); Message.success('模块已删除！'); console.log('模块已删除，当前的页面构建数据为：', state.pageData.index); } else { Message.warning('未找到要删除的模块！'); } //开始复制 end------------------------------------------------------------> // base 0.0.2 如果使用splice方法删除sort，当你就剩下最后一个的时候，会出现找不到那个元素的问题 // state.pageData.index.splice(data.dataSort,1); // Message.success('模块已删除！'); // console.log(state.pageData.index); } //pageStatus==2 分类页 if(state.pageStatus == 2){} //pageStatus==3 列表页 if(state.pageStatus == 3){ //开始复制 start------------------------------------------------------------> //必须通过重新查找id的方式来删除 const indexToRemove = state.pageData.list.findIndex(item => item.i === data.i); if (indexToRemove !== -1) { state.pageData.list.splice(indexToRemove, 1); Message.success('模块已删除！'); console.log('模块已删除，当前的页面构建数据为：', state.pageData.list); } else { Message.warning('未找到要删除的模块！'); } //开始复制 end------------------------------------------------------------> } //pageStatus==4 详情页 if(state.pageStatus == 4){ //开始复制 start------------------------------------------------------------> //必须通过重新查找id的方式来删除 const indexToRemove = state.pageData.article.findIndex(item => item.i === data.i); if (indexToRemove !== -1) { state.pageData.article.splice(indexToRemove, 1); Message.success('模块已删除！'); console.log('模块已删除，当前的页面构建数据为：', state.pageData.article); } else { Message.warning('未找到要删除的模块！'); } //开始复制 end------------------------------------------------------------> } //pageStatus==5 搜索页 if(state.pageStatus == 5){} //pageStatus==6 自定义列表页 if(state.pageStatus == 6){} //pageStatus==7 自定义详情页 if(state.pageStatus == 7){} }, //设置组件样式 setComponentStyleNumber(state,data){ let id = state.editSectorId; let dataSort = state.editDataSort; let sort = state.editComponentSort; let num = state.editComponentStyle; console.log(id,dataSort,sort,num); //pageStatus==1 首页 if(state.pageStatus == 1){ //开始复制 start------------------------------------------------------------> // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.index[dataSort])); //module.content.componentList[sort].component_style = num; //确保修改属性时 Vue 能监控到变化 Vue.set(module.content.componentList, sort, { ...module.content.componentList[sort], component_style: num }); // 拷贝后直接替换原来的板块 //state.pageData.index[id] = module; // 使用Vue.set来强制视图更新 Vue.set(state.pageData.index, dataSort, module); console.log("当前的板块数据为："); console.log(state.pageData.index); //开始复制 end------------------------------------------------------------> } //pageStatus==2 分类页 if(state.pageStatus == 2){} //pageStatus==3 列表页 if(state.pageStatus == 3){ //开始复制 start------------------------------------------------------------> // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.list[dataSort])); //module.content.componentList[sort].component_style = num; //确保修改属性时 Vue 能监控到变化 Vue.set(module.content.componentList, sort, { ...module.content.componentList[sort], component_style: num }); // 拷贝后直接替换原来的板块 //state.pageData.index[id] = module; // 使用Vue.set来强制视图更新 Vue.set(state.pageData.list, dataSort, module); console.log("当前的板块数据为："); console.log(state.pageData.list); //开始复制 end------------------------------------------------------------> } //pageStatus==4 详情页 if(state.pageStatus == 4){ //开始复制 start------------------------------------------------------------> // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.article[dataSort])); //module.content.componentList[sort].component_style = num; //确保修改属性时 Vue 能监控到变化 Vue.set(module.content.componentList, sort, { ...module.content.componentList[sort], component_style: num }); // 拷贝后直接替换原来的板块 //state.pageData.index[id] = module; // 使用Vue.set来强制视图更新 Vue.set(state.pageData.article, dataSort, module); console.log("当前的板块数据为："); console.log(state.pageData.article); //开始复制 end------------------------------------------------------------> } //pageStatus==5 搜索页 if(state.pageStatus == 5){} //pageStatus==6 自定义列表页 if(state.pageStatus == 6){} //pageStatus==7 自定义详情页 if(state.pageStatus == 7){} }, //保存组件设置的数据 saveComponentData(state,data){ //传入的板块id console.log("当前编辑板块：" + data.id) //pageStatus==1 首页 if(state.pageStatus == 1){ //开始复制 start------------------------------------------------------------> const targetModuleIndex = state.pageData.index.findIndex(module => module.i === data.id); console.log("要修改的模块id为：") //找到要修改的板块 console.log(data.sort) //找到要修改的板块 console.log(targetModuleIndex) //找到要修改的板块 //console.log(targetModuleIndex) //找到要修改的板块 //state.pageData.index[targetModuleIndex].content.componentList[data.sort] //当前编辑的组件 //data.data.pid_arr //导航池 //state.editComponentSize //展示条数 //判断数据的类型 1=普通新闻 2=tabs新闻选项卡 3=广告 4=友情链接 6=静态组件 7=文本 8=评论 //1=普通新闻 //注意，vue有一个bug就是，当你修改复杂对象的时候，如果对象的内部是数组 //vue可能无法检测到变化，而当你修改无法被检测变化的数据时，就会把所有数据都修改成相同的值 //解决办法是通过vue的set方法将整个对象，即你的数组外层那个对象进行深拷贝，然后修改完再替换回去 if(state.editComponentType == 1){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.index[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.index, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.index); } //2=tabs新闻选项卡 if(state.editComponentType == 2){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.index[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.index, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.index); } //3=广告 if(state.editComponentType == 3){; let module = JSON.parse(JSON.stringify(state.pageData.index[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.adName; Vue.set(state.pageData.index, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.index); } //4=友情链接 //if(state.editComponentType == 4){} //6=静态组件 //if(state.editComponentType == 6){} //7=文本 if(state.editComponentType == 7){ let module = JSON.parse(JSON.stringify(state.pageData.index[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.titleName; Vue.set(state.pageData.index, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.index); } //8=评论 //if(state.editComponentType == 8){} //开始复制 end------------------------------------------------------------> } //pageStatus==2 分类页 if(state.pageStatus == 2){} //pageStatus==3 列表页 if(state.pageStatus == 3){ //开始复制 start------------------------------------------------------------> const targetModuleIndex = state.pageData.list.findIndex(module => module.i === data.id); console.log("要修改的模块id为：") //找到要修改的板块 console.log(data.sort) //找到要修改的板块 console.log(targetModuleIndex) //找到要修改的板块 if(state.editComponentType == 1){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.list[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.list, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.list); } //2=tabs新闻选项卡 if(state.editComponentType == 2){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.list[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.list, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.list); } //3=广告 if(state.editComponentType == 3){; let module = JSON.parse(JSON.stringify(state.pageData.list[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.adName; Vue.set(state.pageData.list, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.list); } //7=文本 if(state.editComponentType == 7){ let module = JSON.parse(JSON.stringify(state.pageData.list[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.titleName; Vue.set(state.pageData.list, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.list); } //开始复制 end------------------------------------------------------------> } //pageStatus==4 详情页 if(state.pageStatus == 4){ //开始复制 start------------------------------------------------------------> const targetModuleIndex = state.pageData.article.findIndex(module => module.i === data.id); console.log("要修改的模块id为：") //找到要修改的板块 console.log(data.sort) //找到要修改的板块 console.log(targetModuleIndex) //找到要修改的板块 if(state.editComponentType == 1){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.article[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.article, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.article); } //2=tabs新闻选项卡 if(state.editComponentType == 2){ // 获取当前模块数据并进行深拷贝 let module = JSON.parse(JSON.stringify(state.pageData.article[targetModuleIndex])); // 深拷贝整个模块 // 更新 category_id 和 pageSize module.content.componentList[data.sort].componentData.category_id = data.data.pid_arr; // 设置 category_id module.content.componentList[data.sort].componentData.pageSize = state.editComponentSize; // 设置 pageSize // 使用Vue.set来强制视图更新 Vue.set(state.pageData.article, targetModuleIndex, module); // 替换为深拷贝的模块 console.log("当前的板块数据为："); console.log(state.pageData.article); } //3=广告 if(state.editComponentType == 3){; let module = JSON.parse(JSON.stringify(state.pageData.article[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.adName; Vue.set(state.pageData.article, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.article); } //7=文本 if(state.editComponentType == 7){ let module = JSON.parse(JSON.stringify(state.pageData.article[targetModuleIndex])); module.content.componentList[data.sort].componentData.text = data.data.titleName; Vue.set(state.pageData.article, targetModuleIndex, module); console.log("当前的板块数据为："); console.log(state.pageData.article); } //开始复制 end------------------------------------------------------------> } //pageStatus==5 搜索页 if(state.pageStatus == 5){} //pageStatus==6 自定义列表页 if(state.pageStatus == 6){} //pageStatus==7 自定义详情页 if(state.pageStatus == 7){} }, //通过按钮移动板块 (暂时停用) moveModule(state, data) { Message.error("该功能暂时禁用") // pageStatus == 1 首页 // if (state.pageStatus == 1) { // const moveType = data.moveType; // const moduleId = data.i; // const modules = state.pageData.index; // // 深拷贝 modules，避免直接操作原数据 // const newModules = JSON.parse(JSON.stringify(modules)); // // 查找模块在数组中的实际索引 // const thisIndex = newModules.findIndex(module => module.i === moduleId); // if (thisIndex === -1) { // Message.error('模块未找到！'); // return; // } // const thisY = newModules[thisIndex].y; // let thatY; // if (moveType === 'up') { // thatY = Math.max( // ...newModules.filter(item => item.y < thisY).map(item => item.y) // ); // if (thatY === -Infinity) { // Message.error('已经是顶部了！'); // return; // } // const thatIndex = newModules.findIndex(item => item.y === thatY); // if (thatIndex === -1) { // Message.error('上方模块未找到！'); // return; // } // // 交换y值 // [newModules[thisIndex].y, newModules[thatIndex].y] = [newModules[thatIndex].y, newModules[thisIndex].y]; // } else if (moveType === 'down') { // thatY = Math.min( // ...newModules.filter(item => item.y > thisY).map(item => item.y) // ); // if (thatY === Infinity) { // Message.error('已经是底部了！'); // return; // } // const thatIndex = newModules.findIndex(item => item.y === thatY); // if (thatIndex === -1) { // Message.error('下方模块未找到！'); // return; // } // // 交换y值 // [newModules[thisIndex].y, newModules[thatIndex].y] = [newModules[thatIndex].y, newModules[thisIndex].y]; // } else { // Message.error('未知的移动类型！'); // return; // } // // 交换后对模块进行排序以确保顺序一致 // newModules.sort((a, b) => a.y - b.y); // // 使用 Vue.set 强制更新数组，确保视图更新 // //Vue.set(state.pageData, 'index', newModules); // 这里更新整个数组 // state.pageData.index = newModules; // //state.gridKey+=1; // console.log(state.pageData.index); // 打印查看是否已修改 // } // // pageStatus == 2 分类页 // if (state.pageStatus == 2) {} // // pageStatus == 3 列表页 // if (state.pageStatus == 3) {} // // pageStatus == 4 详情页 // if (state.pageStatus == 4) {} // // pageStatus == 5 搜索页 // if (state.pageStatus == 5) {} // // pageStatus == 6 自定义列表页 // if (state.pageStatus == 6) {} // // pageStatus == 7 自定义详情页 // if (state.pageStatus == 7) {} }, //从外部拖拽板块 drag(state, data) { // pageStatus == 1 首页 if (state.pageStatus == 1) { //开始复制 start------------------------------------------------------------> let parentRect = document.getElementById('content').getBoundingClientRect(); //console.log(parentRect); 获取画布 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //state.gridlayoutObj //如果没有占位符就创建一个 if (mouseInGrid === true && (state.pageData.index.findIndex(item => item.i === 'drop')) === -1) { state.pageData.index.push({ x: (state.pageData.index.length * 2) % (this.colNum || 12), y: state.pageData.index.length + (this.colNum || 12), // puts it at the bottom w: 12, h: 2, i: 'drop', }); } //如果已经存在占位符 let index = state.pageData.index.findIndex(item => item.i === 'drop'); if (index !== -1) { try { state.gridlayoutObj.$children[state.pageData.index.length].$refs.item.style.display = "none"; } catch { } let el = state.gridlayoutObj.$children[index]; el.dragging = {"top": state.mouseXY.y - parentRect.top, "left": state.mouseXY.x - parentRect.left}; let new_pos = el.calcXY(state.mouseXY.y - parentRect.top, state.mouseXY.x - parentRect.left); if (mouseInGrid === true) { state.gridlayoutObj.dragEvent('dragstart', 'drop', new_pos.x, new_pos.y, 2, 12); state.DragPos.i = String(index); state.DragPos.x = state.pageData.index[index].x; state.DragPos.y = state.pageData.index[index].y; } if (mouseInGrid === false) { state.gridlayoutObj.dragEvent('dragend', 'drop', new_pos.x, new_pos.y, 2, 12); state.pageData.index = state.pageData.index.filter(obj => obj.i !== 'drop'); } } //开始复制 end------------------------------------------------------------> } // pageStatus == 2 分类页 if (state.pageStatus == 2) {} // pageStatus == 3 列表页 if (state.pageStatus == 3) { //开始复制 start------------------------------------------------------------> let parentRect = document.getElementById('content').getBoundingClientRect(); //console.log(parentRect); 获取画布 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //如果没有占位符就创建一个 if (mouseInGrid === true && (state.pageData.list.findIndex(item => item.i === 'drop')) === -1) { state.pageData.list.push({ x: (state.pageData.list.length * 2) % (this.colNum || 12), y: state.pageData.list.length + (this.colNum || 12), // puts it at the bottom w: 12, h: 2, i: 'drop', }); } //如果已经存在占位符 let index = state.pageData.list.findIndex(item => item.i === 'drop'); if (index !== -1) { try { state.gridlayoutObj.$children[state.pageData.list.length].$refs.item.style.display = "none"; } catch { } let el = state.gridlayoutObj.$children[index]; el.dragging = {"top": state.mouseXY.y - parentRect.top, "left": state.mouseXY.x - parentRect.left}; let new_pos = el.calcXY(state.mouseXY.y - parentRect.top, state.mouseXY.x - parentRect.left); if (mouseInGrid === true) { state.gridlayoutObj.dragEvent('dragstart', 'drop', new_pos.x, new_pos.y, 2, 12); state.DragPos.i = String(index); state.DragPos.x = state.pageData.list[index].x; state.DragPos.y = state.pageData.list[index].y; } if (mouseInGrid === false) { state.gridlayoutObj.dragEvent('dragend', 'drop', new_pos.x, new_pos.y, 2, 12); state.pageData.list = state.pageData.list.filter(obj => obj.i !== 'drop'); } } //开始复制 end------------------------------------------------------------> } // pageStatus == 4 详情页 if (state.pageStatus == 4) { //开始复制 start------------------------------------------------------------> let parentRect = document.getElementById('content').getBoundingClientRect(); //console.log(parentRect); 获取画布 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //如果没有占位符就创建一个 if (mouseInGrid === true && (state.pageData.article.findIndex(item => item.i === 'drop')) === -1) { state.pageData.article.push({ x: (state.pageData.article.length * 2) % (this.colNum || 12), y: state.pageData.article.length + (this.colNum || 12), // puts it at the bottom w: 12, h: 2, i: 'drop', }); } //如果已经存在占位符 let index = state.pageData.article.findIndex(item => item.i === 'drop'); if (index !== -1) { try { state.gridlayoutObj.$children[state.pageData.article.length].$refs.item.style.display = "none"; } catch { } let el = state.gridlayoutObj.$children[index]; el.dragging = {"top": state.mouseXY.y - parentRect.top, "left": state.mouseXY.x - parentRect.left}; let new_pos = el.calcXY(state.mouseXY.y - parentRect.top, state.mouseXY.x - parentRect.left); if (mouseInGrid === true) { state.gridlayoutObj.dragEvent('dragstart', 'drop', new_pos.x, new_pos.y, 2, 12); state.DragPos.i = String(index); state.DragPos.x = state.pageData.article[index].x; state.DragPos.y = state.pageData.article[index].y; } if (mouseInGrid === false) { state.gridlayoutObj.dragEvent('dragend', 'drop', new_pos.x, new_pos.y, 2, 12); state.pageData.article = state.pageData.article.filter(obj => obj.i !== 'drop'); } } //开始复制 end------------------------------------------------------------> } // pageStatus == 5 搜索页 if (state.pageStatus == 5) {} // pageStatus == 6 自定义列表页 if (state.pageStatus == 6) {} // pageStatus == 7 自定义详情页 if (state.pageStatus == 7) {} }, //拖拽结束 定位落点 dragend(state, data) { // pageStatus == 1 首页 if (state.pageStatus == 1) { //开始复制 start------------------------------------------------------------> //获取画布尺寸 let parentRect = document.getElementById('content').getBoundingClientRect(); //判断是否在画布内 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //如果在画布内，开始创建元素 if (mouseInGrid === true) { alert(`Dropped element props:\n${JSON.stringify(state.DragPos, ['x', 'y', 'w', 'h'], 2)}`); state.gridlayoutObj.dragEvent('dragend', 'drop', state.DragPos.x, state.DragPos.y, 1, 1); state.pageData.index = state.pageData.index.filter(obj => obj.i !== 'drop'); // UNCOMMENT below if you want to add a grid-item /* this.layout.push({ x: DragPos.x, y: DragPos.y, w: 1, h: 1, i: DragPos.i, }); this.$refs.gridLayout.dragEvent('dragend', DragPos.i, DragPos.x,DragPos.y,1,1); try { this.$refs.gridLayout.$children[this.layout.length].$refs.item.style.display="block"; } catch { } */ let sendData = { source:"drag",//添加时判断此模块来自外部拖拽，而不是点击 type:data.type, h:data.h, jsonData:data.jsonData, x: state.DragPos.x, y: state.DragPos.y, w: 12, } //开发到这里了，注意我可能还需要上面那个 this.$refs.gridLayout.dragEvent方法 this.commit('template/addModule',sendData); } //开始复制 end------------------------------------------------------------> } // pageStatus == 2 分类页 if (state.pageStatus == 2) {} // pageStatus == 3 列表页 if (state.pageStatus == 3) { //开始复制 start------------------------------------------------------------> //获取画布尺寸 let parentRect = document.getElementById('content').getBoundingClientRect(); //判断是否在画布内 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //如果在画布内，开始创建元素 if (mouseInGrid === true) { alert(`Dropped element props:\n${JSON.stringify(state.DragPos, ['x', 'y', 'w', 'h'], 2)}`); state.gridlayoutObj.dragEvent('dragend', 'drop', state.DragPos.x, state.DragPos.y, 1, 1); state.pageData.list = state.pageData.list.filter(obj => obj.i !== 'drop'); let sendData = { source:"drag",//添加时判断此模块来自外部拖拽，而不是点击 type:data.type, h:data.h, jsonData:data.jsonData, x: state.DragPos.x, y: state.DragPos.y, w: 12, } this.commit('template/addModule',sendData); } //开始复制 end------------------------------------------------------------> } // pageStatus == 4 详情页 if (state.pageStatus == 4) { //开始复制 start------------------------------------------------------------> //获取画布尺寸 let parentRect = document.getElementById('content').getBoundingClientRect(); //判断是否在画布内 let mouseInGrid = false; if (((state.mouseXY.x > parentRect.left) && (state.mouseXY.x < parentRect.right)) && ((state.mouseXY.y > parentRect.top) && (state.mouseXY.y < parentRect.bottom))) { mouseInGrid = true; } //如果在画布内，开始创建元素 if (mouseInGrid === true) { alert(`Dropped element props:\n${JSON.stringify(state.DragPos, ['x', 'y', 'w', 'h'], 2)}`); state.gridlayoutObj.dragEvent('dragend', 'drop', state.DragPos.x, state.DragPos.y, 1, 1); state.pageData.article = state.pageData.article.filter(obj => obj.i !== 'drop'); let sendData = { source:"drag",//添加时判断此模块来自外部拖拽，而不是点击 type:data.type, h:data.h, jsonData:data.jsonData, x: state.DragPos.x, y: state.DragPos.y, w: 12, } this.commit('template/addModule',sendData); } //开始复制 end------------------------------------------------------------> } // pageStatus == 5 搜索页 if (state.pageStatus == 5) {} // pageStatus == 6 自定义列表页 if (state.pageStatus == 6) {} // pageStatus == 7 自定义详情页 if (state.pageStatus == 7) {} }, //修改首页板块高度 setModuleHeight(state,data){ // pageStatus == 1 首页 if (state.pageStatus == 1) { console.log(data); state.pageData.index[data.i].h = data.h; console.log(state.pageData.index[data.i]); } // pageStatus == 2 分类页 if (state.pageStatus == 2) {} // pageStatus == 3 列表页 if (state.pageStatus == 3) { console.log(data); state.pageData.list[data.i].h = data.h; console.log(state.pageData.list[data.i]); } // pageStatus == 4 详情页 if (state.pageStatus == 4) { console.log(data); state.pageData.article[data.i].h = data.h; console.log(state.pageData.article[data.i]); } // pageStatus == 5 搜索页 if (state.pageStatus == 5) {} // pageStatus == 6 自定义列表页 if (state.pageStatus == 6) {} // pageStatus == 7 自定义详情页 if (state.pageStatus == 7) {} }, //格式化模板信息 formatTemplateInfo(state, 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 = 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); // } websiteData.push(clonedData.data[index].content); } // 保存到对应的页面 json 中 if (data.type == "index") { state.webSiteData.template.index = websiteData; } if (data.type == "list") { state.webSiteData.template.list = websiteData; } if (data.type == "article") { state.webSiteData.template.article = websiteData; } }, //保存模板 saveTemplate(state) { //临时展示保存的数据 后期移除 state.editWebsiteTemplateJsonWindow = true; //调用mutations中的方法无需使用$store //格式化index的信息 this.commit('template/formatTemplateInfo',{data:state.pageData.index,type:"index"}); //格式化list的信息 this.commit('template/formatTemplateInfo',{data:state.pageData.list,type:"list"}); //格式化article的信息 this.commit('template/formatTemplateInfo',{data:state.pageData.article,type:"article"}); // console.log(state.webSiteData); // console.log(state.editWebsiteId) //给与网站id和模板风格id state.webSiteData.base.websiteId = state.editWebsiteId; state.webSiteData.style.styleId = state.editWebsiteClass; }, //随机生成模板 randomTemplate(state){ state.loading = true; const randomIndex = Math.floor(Math.random() * 2); // Generates a random number between 1 and 2 console.log(`随机生成的数字是: ${randomIndex}`); //console.log(randomIndex1) //console.log(randomIndex2) //Message.warning("该功能研发中"); // pageStatus == 1 首页 if (state.pageStatus == 1) { // 先清空里面的内容 Vue.set(state.pageData, 'index', []); // 深拷贝 randomIndex1 和 randomIndex2 const newData1 = JSON.parse(JSON.stringify(randomIndex1)); const newData2 = JSON.parse(JSON.stringify(randomIndex2)); if (randomIndex == 0) { Vue.set(state.pageData, 'index', newData1); } if (randomIndex == 1) { Vue.set(state.pageData, 'index', newData2); } state.loading = false; } // pageStatus == 2 分类页 if (state.pageStatus == 2) {} // pageStatus == 3 列表页 if (state.pageStatus == 3) {} // pageStatus == 4 详情页 if (state.pageStatus == 4) {} // pageStatus == 5 搜索页 if (state.pageStatus == 5) {} // pageStatus == 6 自定义列表页 if (state.pageStatus == 6) {} // pageStatus == 7 自定义详情页 if (state.pageStatus == 7) {} }, //1.配置模块 end------------------------------------------------------------> //2.获取站点信息 start------------------------------------------------------------> //获取站点详情 setWebsiteInfo(state,data){ state.webSiteInfo = data; }, //获取站点导航池 setGetSiteCategory(state,data) { state.webSiteMenu = data; }, //设置地区 setArea(state,data){ //都没有的时候返回的是省 if(data.province==undefined){ state.area.economize = data; } //没有region的时候返回的是市 if(data.province!=undefined&&data.city!=undefined&&data.region==undefined){ state.area.market = data.city; } //有region的时候返回的是县 if(data.province!=undefined&&data.city!=undefined&&data.region!=undefined){ state.area.county = data.region; } }, //获取全部导航 setWebsiteCategory(state,data){ let arrayData = [] for(let item of data){ let options = { key:item.id, label:item.name, value:item.id } arrayData.push(options); } state.editWebsiteCategory = arrayData; }, //2.获取站点信息 end------------------------------------------------------------> } const actions = { //1.显示画板组件数据 start------------------------------------------------------------> //1.1 获取网站基本信息 getSiteInfo({commit},data){ return new Promise((resolve, reject) => { getSiteInfo(data).then(response => { commit('setWebsiteInfo', response.data); resolve(response) }).catch(error => { reject(error) }) }) }, //1.2 获取网站导航池 getSiteCategory({commit},data){ return new Promise((resolve, reject) => { getSiteCategory(data).then(response => { commit('setGetSiteCategory', response.data); resolve(response) }).catch(error => { reject(error) }) }) }, //1.3 获取网站底部导航 getFooterCategoryList({commit},data){ return new Promise((resolve, reject) => { getFooterCategoryList(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //1.4 获取行政区划 selectWebsiteArea({commit},data){ return new Promise((resolve, reject) => { selectWebsiteArea(data).then(response => { commit('setArea', response.data); resolve(response) }).catch(error => { reject(error) }) }) }, //1.显示画板组件数据 end------------------------------------------------------------> //2.构建网站json start------------------------------------------------------------> //2.1 搜索网站 getWebsiteintel({commit},data){ return new Promise((resolve, reject) => { getWebsiteintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.2 添加网站基本信息 如果只传入website_id，则验证是否已经关联导航池 addWebsiteTemplateintel({commit},data){ return new Promise((resolve, reject) => { addWebsiteTemplateintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.3 获取网站基本信息 getWebsiteTemplateintel({commit},data){ return new Promise((resolve, reject) => { getWebsiteTemplateintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.4 修改网站基本信息 upWebsiteTemplateintel({commit},data){ return new Promise((resolve, reject) => { upWebsiteTemplateintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.5 获取所有风格 getAllTemplateClass({commit},data){ return new Promise((resolve, reject) => { getAllTemplateClass(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.6 搜索并获取所有网站风格 getWebsiteTemplateList({commit},data){ return new Promise((resolve, reject) => { getWebsiteTemplateList(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.7 保存用户选择的风格 addWebsiteTemplateclassintel({commit},data){ return new Promise((resolve, reject) => { addWebsiteTemplateclassintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.8 获取用户选择的风格 getWebsiteTemplateclassintel({commit},data){ return new Promise((resolve, reject) => { getWebsiteTemplateclassintel(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.9 保存模板 addWebsiteTemplate({commit},data){ return new Promise((resolve, reject) => { addWebsiteTemplate(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.10 获取模板配置 getWebsiteTemplateInfo({commit},data){ return new Promise((resolve, reject) => { getWebsiteTemplateInfo(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.11 预览模板信息 getWebsiteTemplateData({commit},data){ return new Promise((resolve, reject) => { getWebsiteTemplateData(data).then(response => { resolve(response) }).catch(error => { reject(error) }) }) }, //2.构建网站json end------------------------------------------------------------> } export default { namespaced: true, state, mutations, actions }