parent
af25f1de42
commit
242eb87b0b
@ -1,18 +0,0 @@ |
||||
import upload from '@/utils/upload' |
||||
import request from '@/utils/request' |
||||
|
||||
// 查询景点详情
|
||||
export function scenicSpotById(id){ |
||||
return request({ |
||||
url: '/scenicSpotManage/'+id, |
||||
method: 'get' |
||||
}) |
||||
} |
||||
// 编辑景点信息
|
||||
export function updateScenicSpotSortList(datas){ |
||||
return request({ |
||||
url: '/scenicSpotManage', |
||||
method: 'put', |
||||
params:datas |
||||
}) |
||||
} |
@ -1,18 +0,0 @@ |
||||
import upload from '@/utils/upload' |
||||
import request from '@/utils/request' |
||||
|
||||
// 查询景点列表信息
|
||||
export function scenicSpotSortList(){ |
||||
return request({ |
||||
url: '/scenicSpotManage/scenicSpotSortList', |
||||
method: 'get' |
||||
}) |
||||
} |
||||
// 排序
|
||||
export function updateScenicSpotSortList(datas){ |
||||
return request({ |
||||
url: '/scenicSpotManage/updateScenicSpotSortList', |
||||
method: 'post', |
||||
data:datas |
||||
}) |
||||
} |
@ -1,103 +1,80 @@ |
||||
<template> |
||||
<view> |
||||
<HM-dragSorts class="sort-box" ref="dragSorts" :list="list" :autoScroll="true" :feedbackGenerator="true" |
||||
:listHeight="300" :rowHeight="55" @confirm="confirm"></HM-dragSorts> |
||||
<HM-dragSorts class="sort-box" ref="dragSorts" :list="list" :autoScroll="true" :feedbackGenerator="true" :listHeight="300" :rowHeight="55" @confirm="confirm"></HM-dragSorts> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import { |
||||
scenicSpotSortList,updateScenicSpotSortList |
||||
} from '@/api/word/sort.js' |
||||
export default { |
||||
data() { |
||||
return { |
||||
list: [], |
||||
datas: [ |
||||
// { |
||||
// id: 25, |
||||
// resourceCode: 770931335345733632, |
||||
// resourceName: '三黄寨', |
||||
// sort: null |
||||
// }, |
||||
// { |
||||
// id: 24, |
||||
// resourceCode: 751783303501053953, |
||||
// resourceName: '达摩院', |
||||
// sort: 1 |
||||
// }, |
||||
// { |
||||
// id: 1, |
||||
// resourceCode: 751783303501053952, |
||||
// resourceName: '初祖庵', |
||||
// sort: 1 |
||||
// } |
||||
] |
||||
export default { |
||||
data() { |
||||
return { |
||||
list: [], |
||||
datas: [ |
||||
{ |
||||
id: 25, |
||||
resourceCode: 770931335345733632, |
||||
resourceName: '三黄寨', |
||||
sort: null |
||||
}, |
||||
{ |
||||
id: 24, |
||||
resourceCode: 751783303501053953, |
||||
resourceName: '达摩院', |
||||
sort: 1 |
||||
}, |
||||
{ |
||||
id: 1, |
||||
resourceCode: 751783303501053952, |
||||
resourceName: '初祖庵', |
||||
sort: 1 |
||||
} |
||||
] |
||||
}; |
||||
}, |
||||
mounted() { |
||||
var obj = {}; |
||||
this.list = []; |
||||
this.datas.forEach((item) => { |
||||
obj = { |
||||
name: item.resourceName, |
||||
sort: item.sort, |
||||
id: item.id |
||||
}; |
||||
}, |
||||
onShow() { |
||||
this.scenicSpotSortList(); |
||||
}, |
||||
mounted() { |
||||
var obj = {}; |
||||
this.list = []; |
||||
this.datas.forEach((item) => { |
||||
obj = { |
||||
name: item.resourceName, |
||||
sort: item.sort, |
||||
id: item.id |
||||
}; |
||||
|
||||
this.list.push(obj); |
||||
}); |
||||
this.list.push(obj); |
||||
}); |
||||
}, |
||||
methods: { |
||||
change(e) { |
||||
console.log('=== change start ==='); |
||||
console.log('被拖拽行: ', JSON.stringify(e.moveRow)); |
||||
console.log('原始下标: ', e.index); |
||||
console.log('被拖拽到: ', e.moveTo); |
||||
console.log('=== change end ==='); |
||||
}, |
||||
methods: { |
||||
change(e) { |
||||
console.log('=== change start ==='); |
||||
console.log('被拖拽行: ', JSON.stringify(e.moveRow)); |
||||
console.log('原始下标: ', e.index); |
||||
console.log('被拖拽到: ', e.moveTo); |
||||
console.log('=== change end ==='); |
||||
}, |
||||
confirm(e) { |
||||
console.log('=== confirm start ==='); |
||||
console.log('被拖拽行: ', JSON.stringify(e.moveRow)); |
||||
console.log('原始下标: ', e.index); |
||||
console.log('被拖拽到: ', e.moveTo); |
||||
console.log('排序后的list: ', e.list); |
||||
// 如果需要删除列表行,必须要排序后,同步一下排序后的list到页面list |
||||
// 因为排序后页面的list和组件内的list已经不一样,不同步list,直接删除页面的list中项目,达不到实际效果。 |
||||
console.log('=== confirm end ==='); |
||||
this.updateScenicSpotSortList(e.list); |
||||
this.scenicSpotSortList(); |
||||
}, |
||||
scenicSpotSortList() { |
||||
scenicSpotSortList().then(res => { |
||||
this.datas = res.data; |
||||
}) |
||||
}, |
||||
updateScenicSpotSortList(query) { |
||||
updateScenicSpotSortList(query).then(res => { |
||||
if(res.code !=200){ |
||||
uni.showToast({ |
||||
title: '排序失败' |
||||
}); |
||||
} |
||||
}) |
||||
} |
||||
confirm(e) { |
||||
console.log('=== confirm start ==='); |
||||
console.log('被拖拽行: ', JSON.stringify(e.moveRow)); |
||||
console.log('原始下标: ', e.index); |
||||
console.log('被拖拽到: ', e.moveTo); |
||||
console.log('排序后的list: ', e.list); |
||||
// 如果需要删除列表行,必须要排序后,同步一下排序后的list到页面list |
||||
// 因为排序后页面的list和组件内的list已经不一样,不同步list,直接删除页面的list中项目,达不到实际效果。 |
||||
console.log('=== confirm end ==='); |
||||
} |
||||
}; |
||||
} |
||||
}; |
||||
</script> |
||||
|
||||
<style lang="stylus"> |
||||
// .sort-box{ |
||||
::v-deep .HM-drag-sort { |
||||
height: fit-content !important; |
||||
|
||||
.color { |
||||
::v-deep .HM-drag-sort{ |
||||
height: fit-content !important; |
||||
|
||||
.color{ |
||||
height: fit-content !important; |
||||
} |
||||
} |
||||
} |
||||
|
||||
// } |
||||
</style> |
||||
|
||||
</style> |
||||
|
Loading…
Reference in new issue