@ -63,7 +63,7 @@
<!-- 产品列表表格 -- >
< div class = "product-table" >
< el-table :data = " tableData" style = "width: 100%" empty -text = " 暂无数据 " @row-click ="handleRowClick" >
< el-table :data = " sor tedT ableData" style = "width: 100%" empty -text = " 暂无数据 " @row-click ="handleRowClick" >
< el-table-column label = "产品服务名称" min -width = " 200 " >
< template slot -scope = " scope " >
< div class = "product-info" >
@ -88,7 +88,7 @@
{ { scope . row . product _group || '--' } }
< / template >
< / el-table-column >
< el-table-column prop = "sort_order" label = "排序" min -width = " 80 " >
< el-table-column prop = "sort_order" label = "排序" min -width = " 80 " sortable >
< / el-table-column >
< el-table-column label = "操作" min -width = " 180 " >
< template slot -scope = " scope " >
@ -155,8 +155,8 @@
< / div >
<!-- 已保存的优势列表 -- >
< div class = "saved-list" v-if = " a dvantageList.length > 0">
< div class = "list-item" v-for = "(item, index) in a dvantageList" :key="item.id">
< div class = "saved-list" v-if = " sortedA dvantageList.length > 0">
< div class = "list-item" v-for = "(item, index) in sortedA dvantageList" :key="item.id">
< div class = "item-header" >
< div class = "item-title" > 已保存优势 # { { index + 1 } } < / div >
< div class = "item-actions" >
@ -169,6 +169,7 @@
< img :src = "item.img" alt = "优势图片" style = "max-width: 100px; max-height: 100px;" >
< / div >
< div class = "item-details" >
< div > < strong > 排序 : < / strong > { { item . sort _order || 1 } } ( 排在第 { { item . sort _order || 1 } } 位 ) < / div >
< div > < strong > 标题 : < / strong > { { item . title } } < / div >
< div > < strong > 描述 : < / strong > { { item . description } } < / div >
< / div >
@ -180,10 +181,18 @@
< div class = "form-list" >
< div class = "form-item" v-for = "(form, index) in advantageForms" :key="'advantage_form_' + index" >
< div class = "form-title" >
产品优势 # { { a dvantageList. length + index + 1 } }
产品优势 # { { sortedA dvantageList. length + index + 1 } }
< span v-if = "form.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "form" :rules = "contentRules" : ref = "'advantageForm' + index" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model = "form.sort_order" :min="1" :max="100" :step = "1"
@ change = "validateSortOrder('advantage')" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { form . sort _order } } 将排在第 { { form . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "图片" prop = "img" >
< el-input v-model = "form.img" placeholder="请输入图片链接" > < / el -input >
< / el-form-item >
@ -210,8 +219,8 @@
< / div >
<!-- 已保存的功能列表 -- >
< div class = "saved-list" v-if = " f eatureList.length > 0">
< div class = "list-item" v-for = "(item, index) in f eatureList" :key="item.id">
< div class = "saved-list" v-if = " sortedF eatureList.length > 0">
< div class = "list-item" v-for = "(item, index) in sortedF eatureList" :key="item.id">
< div class = "item-header" >
< div class = "item-title" > 已保存功能 # { { index + 1 } } < / div >
< div class = "item-actions" >
@ -221,6 +230,7 @@
< / div >
< div class = "item-content" >
< div class = "item-details" >
< div > < strong > 排序 : < / strong > { { item . sort _order || 1 } } ( 排在第 { { item . sort _order || 1 } } 位 ) < / div >
< div > < strong > 标题 : < / strong > { { item . title } } < / div >
< div > < strong > 描述 : < / strong > { { item . description } } < / div >
< / div >
@ -232,10 +242,18 @@
< div class = "form-list" >
< div class = "form-item" v-for = "(form, index) in featureForms" :key="'feature_form_' + index" >
< div class = "form-title" >
产品功能 # { { f eatureList. length + index + 1 } }
产品功能 # { { sortedF eatureList. length + index + 1 } }
< span v-if = "form.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "form" :rules = "contentRules" : ref = "'featureForm' + index" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model = "form.sort_order" :min="1" :max="100" :step = "1"
@ change = "validateSortOrder('feature')" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { form . sort _order } } 将排在第 { { form . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "标题" prop = "title" >
< el-input v-model = "form.title" placeholder="请输入标题" > < / el -input >
< / el-form-item >
@ -259,8 +277,8 @@
< / div >
<!-- 已保存的应用列表 -- >
< div class = "saved-list" v-if = " a pplicationMainList.length > 0">
< div class = "list-item main-item" v-for = "(item, index) in a pplicationMainList" :key="item.id">
< div class = "saved-list" v-if = " sortedA pplicationMainList.length > 0">
< div class = "list-item main-item" v-for = "(item, index) in sortedA pplicationMainList" :key="item.id">
< div class = "item-header" >
< div class = "item-title" > 已保存应用主项 # { { index + 1 } } < / div >
< div class = "item-actions" >
@ -270,6 +288,7 @@
< / div >
< / div >
< div class = "item-content" >
< div > < strong > 排序 : < / strong > { { item . sort _order || 1 } } ( 排在第 { { item . sort _order || 1 } } 位 ) < / div >
< div v-if = "item.img" class="item-image" >
< img :src = "item.img" alt = "应用图片" style = "max-width: 100px; max-height: 100px;" >
< / div >
@ -281,9 +300,10 @@
<!-- 详情项列表 -- >
< div class = "detail-section" v-if = "item.subItems && item.subItems.length > 0" >
< div class = "detail-list" >
< div class = "detail-item" v-for = "(detail, detailIndex) in item.subItems" :key="detail.id">
< div class = "detail-item" v-for = "(detail, detailIndex) in sortedApplicationDetails( item.subItems) " :key="detail.id">
< div class = "detail-title" > 详情项 # { { detailIndex + 1 } } < / div >
< div class = "detail-content" >
< div > < strong > 排序 : < / strong > { { detail . sort _order || 1 } } ( 排在第 { { detail . sort _order || 1 } } 位 ) < / div >
< div > < strong > 标题 : < / strong > { { detail . title } } < / div >
< div > < strong > 描述 : < / strong > { { detail . description } } < / div >
< / div >
@ -303,6 +323,13 @@
< span v-if = "detailForm.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "detailForm" :rules = "contentRules" : ref = "'appDetailForm_' + item.id + '_' + detailIndex" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model ="detailForm.sort_order" :min="1" :max="100" :step ="1" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { detailForm . sort _order } } 将排在第 { { detailForm . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "标题" prop = "title" >
< el-input v-model = "detailForm.title" placeholder="请输入详情标题" > < / el -input >
< / el-form-item >
@ -325,10 +352,18 @@
< div class = "form-list" >
< div class = "form-item main-form-item" v-for = "(form, index) in applicationForms" :key="'application_form_' + index" >
< div class = "form-title" >
应用主项 # { { a pplicationMainList. length + index + 1 } }
应用主项 # { { sortedA pplicationMainList. length + index + 1 } }
< span v-if = "form.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "form" :rules = "contentRules" : ref = "'applicationForm' + index" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model = "form.sort_order" :min="1" :max="100" :step = "1"
@ change = "validateSortOrder('application')" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { form . sort _order } } 将排在第 { { form . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "标题" prop = "title" >
< el-input v-model = "form.title" placeholder="请输入标题" > < / el -input >
< / el-form-item >
@ -349,6 +384,13 @@
< span v-if = "detailForm.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "detailForm" :rules = "contentRules" : ref = "'newDetailForm_' + index + '_' + detailIndex" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model ="detailForm.sort_order" :min="1" :max="100" :step ="1" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { detailForm . sort _order } } 将排在第 { { detailForm . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "标题" prop = "title" >
< el-input v-model = "detailForm.title" placeholder="请输入详情标题" > < / el -input >
< / el-form-item >
@ -379,6 +421,13 @@
< div class = "main-product-form" >
< div class = "form-title" > 产品主信息 < / div >
< el-form :model = "productIntroForm" :rules = "contentRules" ref = "productIntroForm" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model ="productIntroForm.sort_order" :min="1" :max="100" :step ="1" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { productIntroForm . sort _order } } 将排在第 { { productIntroForm . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "标题" prop = "title" >
< el-input v-model = "productIntroForm.title" placeholder="请输入标题" > < / el -input >
< / el-form-item >
@ -405,8 +454,8 @@
< / div >
<!-- 已保存的规格列表 -- >
< div class = "saved-list" v-if = " p roductSpecList.length > 0">
< div class = "list-item" v-for = "(item, index) in p roductSpecList" :key="item.id">
< div class = "saved-list" v-if = " sortedP roductSpecList.length > 0">
< div class = "list-item" v-for = "(item, index) in sortedP roductSpecList" :key="item.id">
< div class = "item-header" >
< div class = "item-title" > 已保存规格 # { { index + 1 } } < / div >
< div class = "item-actions" >
@ -415,6 +464,7 @@
< / div >
< / div >
< div class = "item-content" >
< div > < strong > 排序 : < / strong > { { item . sort _order || 1 } } ( 排在第 { { item . sort _order || 1 } } 位 ) < / div >
< div v-if = "item.icon" class="item-image" >
< img :src = "item.icon" alt = "规格图标" style = "max-width: 30px; max-height: 30px;" >
< / div >
@ -430,10 +480,18 @@
< div class = "form-list" >
< div class = "form-item" v-for = "(form, index) in productSpecForms" :key="'spec_form_' + index" >
< div class = "form-title" >
产品规格 # { { p roductSpecList. length + index + 1 } }
产品规格 # { { sortedP roductSpecList. length + index + 1 } }
< span v-if = "form.id" style="color: #67c23a; font-size: 12px; margin-left: 8px;" > ( 编辑中 ) < / span >
< / div >
< el-form :model = "form" :rules = "contentRules" : ref = "'specForm' + index" label -width = " 120px " >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model = "form.sort_order" :min="1" :max="100" :step = "1"
@ change = "validateSortOrder('product_spec')" >
< / el-input-number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { form . sort _order } } 将排在第 { { form . sort _order } } 位 )
< / span >
< / el-form-item >
< el-form-item label = "名称" prop = "name" >
< el-input v-model = "form.name" placeholder="请输入名称" > < / el -input >
< / el-form-item >
@ -470,7 +528,10 @@
< el-input v-model = "menuDialog.form.title" placeholder="请输入菜单标题" > < / el -input >
< / el-form-item >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model ="menuDialog.form.sort_order" :min="1" :max ="100" > < / el -input -number >
< el-input-number v-model ="menuDialog.form.sort_order" :min="0" :max ="100" > < / el -input -number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { menuDialog . form . sort _order } } 将排在第 { { menuDialog . form . sort _order + 1 } } 位 )
< / span >
< / el-form-item >
< / el-form >
< span slot = "footer" class = "dialog-footer" >
@ -505,6 +566,9 @@
< / el-form-item >
< el-form-item label = "排序" prop = "sort_order" >
< el-input-number v-model ="productDialog.form.sort_order" :min="1" :max ="100" > < / el -input -number >
< span class = "sort-order-hint" style = "margin-left: 8px; color: #909399; font-size: 12px;" >
( 值为 { { productDialog . form . sort _order } } 将排在第 { { productDialog . form . sort _order } } 位 )
< / span >
< / el-form-item >
< / el-form >
< span slot = "footer" class = "dialog-footer" >
@ -555,7 +619,8 @@ export default {
pre _price : '' ,
price _unit : '' ,
discount : 0 ,
bg _img _url : ''
bg _img _url : '' ,
sort _order : 1
} ,
/ / 详 情 : 内 容 列 表 数 据
@ -643,6 +708,9 @@ export default {
] ,
bg _img _url : [
{ required : true , message : '请输入背景图链接' , trigger : 'blur' }
] ,
sort _order : [
{ required : true , message : '请输入排序值' , trigger : 'blur' }
]
} ,
@ -680,6 +748,38 @@ export default {
}
}
} ,
computed : {
/ / 按 s o r t _ o r d e r 排 序 后 的 表 格 数 据
sortedTableData ( ) {
return [ ... this . tableData ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
} ,
/ / 按 s o r t _ o r d e r 排 序 后 的 优 势 列 表
sortedAdvantageList ( ) {
return [ ... this . advantageList ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
} ,
/ / 按 s o r t _ o r d e r 排 序 后 的 功 能 列 表
sortedFeatureList ( ) {
return [ ... this . featureList ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
} ,
/ / 按 s o r t _ o r d e r 排 序 后 的 应 用 主 项 列 表
sortedApplicationMainList ( ) {
return [ ... this . applicationMainList ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
} ,
/ / 按 s o r t _ o r d e r 排 序 后 的 规 格 列 表
sortedProductSpecList ( ) {
return [ ... this . productSpecList ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
}
} ,
created ( ) {
this . loadMenuTree ( )
} ,
@ -738,7 +838,8 @@ export default {
img : item . img ,
icon : item . icon ,
menu _product _id : this . selectedProduct . id ,
content _type : 'advantage'
content _type : 'advantage' ,
sort _order : item . sort _order || 1
} ) )
console . log ( '优势数据回显成功:' , this . advantageList )
} else {
@ -754,7 +855,8 @@ export default {
img : item . img ,
icon : item . icon ,
menu _product _id : this . selectedProduct . id ,
content _type : 'feature'
content _type : 'feature' ,
sort _order : item . sort _order || 1
} ) )
console . log ( '功能数据回显成功:' , this . featureList )
} else {
@ -776,7 +878,8 @@ export default {
icon : app . icon ,
menu _product _id : this . selectedProduct . id ,
content _type : 'application' ,
description : app . description || ''
description : app . description || '' ,
sort _order : app . sort _order || 1
}
/ / 如 果 有 p r o v i d e 字 段 , 转 换 为 s u b I t e m s
@ -788,7 +891,8 @@ export default {
description : provideItem . description ,
parent _id : app . id ,
menu _product _id : this . selectedProduct . id ,
content _type : 'application'
content _type : 'application' ,
sort _order : provideItem . sort _order || 1
} ) )
} else {
mainItem . subItems = [ ]
@ -818,7 +922,8 @@ export default {
pre _price : productData . pre _price || '' ,
price _unit : productData . price _unit || '' ,
discount : productData . discount || 0 ,
bg _img _url : productData . bg _img _url || ''
bg _img _url : productData . bg _img _url || '' ,
sort _order : productData . sort _order || 1
}
console . log ( '产品主信息回显成功:' , this . productIntroForm )
@ -832,7 +937,8 @@ export default {
icon : item . icon ,
menu _product _id : this . selectedProduct . id ,
content _type : 'product' ,
parent _id : productData . id
parent _id : productData . id ,
sort _order : item . sort _order || 1
} ) )
console . log ( '规格数据回显成功:' , this . productSpecList )
} else {
@ -843,7 +949,8 @@ export default {
this . productIntroForm = {
... this . productIntroForm ,
title : data . title || '' ,
description : data . description || ''
description : data . description || '' ,
sort _order : 1
}
this . productSpecList = [ ]
}
@ -870,7 +977,8 @@ export default {
const baseForm = {
menu _product _id : this . selectedProduct ? this . selectedProduct . id : '' ,
content _type : this . getContentTypeForAPI ( type ) ,
id : ''
id : '' ,
sort _order : 1 / / 默 认 排 序 值 为 1
}
switch ( type ) {
@ -964,7 +1072,8 @@ export default {
content _type : 'application' ,
parent _id : parentId . toString ( ) . startsWith ( 'new_' ) ? '' : parentId ,
title : '' ,
description : ''
description : '' ,
sort _order : 1 / / 默 认 排 序 值 为 1
}
this . applicationDetailForms [ parentId ] . push ( newDetailForm )
@ -995,6 +1104,33 @@ export default {
}
} ,
/ / 验 证 排 序 值
validateSortOrder ( type ) {
let forms = [ ]
switch ( type ) {
case 'advantage' :
forms = this . advantageForms
break
case 'feature' :
forms = this . featureForms
break
case 'application' :
forms = this . applicationForms
break
case 'product_spec' :
forms = this . productSpecForms
break
}
/ / 检 查 是 否 有 重 复 的 排 序 值
const sortOrders = forms . map ( form => form . sort _order )
const duplicates = sortOrders . filter ( ( item , index ) => sortOrders . indexOf ( item ) !== index )
if ( duplicates . length > 0 ) {
this . $message . warning ( '排序值不能重复,相同的排序值将按照保存顺序排列' )
}
} ,
/ / 编 辑 已 保 存 的 项
editSavedItem ( item , type ) {
console . log ( '编辑已保存项:' , item , type ) ;
@ -1035,7 +1171,8 @@ export default {
content _type : 'advantage' ,
img : item . img || '' ,
title : item . title || '' ,
description : item . description || ''
description : item . description || '' ,
sort _order : item . sort _order || 1
} ) ;
this . advantageList = this . advantageList . filter ( i => i . id !== item . id ) ;
break ;
@ -1046,7 +1183,8 @@ export default {
menu _product _id : item . menu _product _id ,
content _type : 'feature' ,
title : item . title || '' ,
description : item . description || ''
description : item . description || '' ,
sort _order : item . sort _order || 1
} ) ;
this . featureList = this . featureList . filter ( i => i . id !== item . id ) ;
break ;
@ -1057,7 +1195,8 @@ export default {
menu _product _id : item . menu _product _id ,
content _type : 'application' ,
title : item . title || '' ,
img : item . img || ''
img : item . img || '' ,
sort _order : item . sort _order || 1
} ) ;
this . applicationMainList = this . applicationMainList . filter ( i => i . id !== item . id ) ;
@ -1081,7 +1220,8 @@ export default {
content _type : 'application' ,
parent _id : detail . parent _id || item . id ,
title : detail . title || '' ,
description : detail . description || ''
description : detail . description || '' ,
sort _order : detail . sort _order || 1
} ) ;
}
} ) ;
@ -1105,7 +1245,8 @@ export default {
content _type : 'application' ,
parent _id : item . parent _id || parentItem . id ,
title : item . title || '' ,
description : item . description || ''
description : item . description || '' ,
sort _order : item . sort _order || 1
} ) ;
/ / 从 父 项 的 s u b I t e m s 中 移 除
@ -1121,7 +1262,8 @@ export default {
parent _id : item . parent _id || '' ,
name : item . name || '' ,
description : item . description || '' ,
icon : item . icon || ''
icon : item . icon || '' ,
sort _order : item . sort _order || 1
} ) ;
this . productSpecList = this . productSpecList . filter ( i => i . id !== item . id ) ;
break ;
@ -1130,6 +1272,14 @@ export default {
this . $message . success ( '已移动到编辑区域,请修改后点击保存' ) ;
} ,
/ / 对 应 用 详 情 进 行 排 序
sortedApplicationDetails ( subItems ) {
if ( ! subItems || ! Array . isArray ( subItems ) ) return [ ]
return [ ... subItems ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
} ,
/ / 详 情 : 删 除 内 容 项
deleteContentItem ( id , type ) {
this . $confirm ( '确定删除该项吗?' , '提示' , {
@ -1260,6 +1410,11 @@ export default {
formData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! formData . sort _order ) {
formData . sort _order = 1
}
formsToSave . push ( formData )
}
@ -1314,6 +1469,11 @@ export default {
formData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! formData . sort _order ) {
formData . sort _order = 1
}
formsToSave . push ( formData )
}
@ -1366,6 +1526,11 @@ export default {
formData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! formData . sort _order ) {
formData . sort _order = 1
}
if ( formData . id ) {
/ / 更 新 主 项
const res = await updateProductIntroAPI ( formData )
@ -1422,6 +1587,11 @@ export default {
detailData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! detailData . sort _order ) {
detailData . sort _order = 1
}
if ( detailData . id ) {
const res = await updateProductIntroAPI ( detailData )
if ( res . status !== true ) {
@ -1461,6 +1631,11 @@ export default {
mainData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! mainData . sort _order ) {
mainData . sort _order = 1
}
let mainId = mainData . id
if ( mainData . id ) {
@ -1492,6 +1667,11 @@ export default {
formData . menu _product _id = this . selectedProduct . id
}
/ / 确 保 s o r t _ o r d e r 有 值
if ( ! formData . sort _order ) {
formData . sort _order = 1
}
if ( formData . id ) {
const res = await updateProductIntroAPI ( formData )
if ( res . status !== true ) {
@ -1524,28 +1704,47 @@ export default {
}
} ,
/ / 构 建 菜 单 树 - 适 配 新 的 数 据 结 构
/ / 构 建 菜 单 树 - 适 配 新 的 数 据 结 构 , 并 按 照 s o r t _ o r d e r 排 序
buildMenuTree ( menus ) {
const transformedData = menus . map ( level1 => ( {
id : level1 . id ,
title : level1 . firTitle ,
menu _level : 1 ,
sort _order : level1 . sort _order || 1 ,
children : ( level1 . secMenu || [ ] ) . map ( level2 => ( {
id : level2 . id ,
title : level2 . secTitle ,
menu _level : 2 ,
parent _id : level1 . id ,
sort _order : level2 . sort _order || 1 ,
children : ( level2 . thrMenu || [ ] ) . map ( level3 => ( {
id : level3 . id ,
title : level3 . thrTitle ,
menu _level : 3 ,
parent _id : level2 . id ,
sort _order : level3 . sort _order || 1
} ) )
} ) )
} ) )
/ / 首 先 对 一 级 菜 单 排 序
const sortedLevel1 = [ ... menus ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
const transformedData = sortedLevel1 . map ( level1 => {
/ / 对 二 级 菜 单 排 序
const sortedLevel2 = [ ... ( level1 . secMenu || [ ] ) ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
return {
id : level1 . id ,
title : level1 . firTitle ,
menu _level : 1 ,
sort _order : level1 . sort _order || 1 ,
children : sortedLevel2 . map ( level2 => {
/ / 对 三 级 菜 单 排 序
const sortedLevel3 = [ ... ( level2 . thrMenu || [ ] ) ] . sort ( ( a , b ) => {
return ( a . sort _order || 999 ) - ( b . sort _order || 999 )
} )
return {
id : level2 . id ,
title : level2 . secTitle ,
menu _level : 2 ,
parent _id : level1 . id ,
sort _order : level2 . sort _order || 1 ,
children : sortedLevel3 . map ( level3 => ( {
id : level3 . id ,
title : level3 . thrTitle ,
menu _level : 3 ,
parent _id : level2 . id ,
sort _order : level3 . sort _order || 1
} ) )
}
} )
}
} )
return transformedData
} ,
@ -1707,7 +1906,7 @@ export default {
this . menuDialog . form = {
id : '' ,
title : '' ,
sort _order : 1 ,
sort _order : 0 ,
menu _level : data . menu _level + 1 ,
parent _id : data . id
}