80 lines
3.2 KiB
HTML
80 lines
3.2 KiB
HTML
<el-aside class="left-aside" width="260px">
|
|
<el-page-header @back="RightgoBack">
|
|
<template #icon>
|
|
<el-icon style="color: var(--el-text-color-primary);font-size: 24px;"><Back /></el-icon>
|
|
</template>
|
|
<template #title>
|
|
<el-text tag="b" size="large" truncated style="color: var(--el-text-color-primary)">返回</el-text>
|
|
</template>
|
|
<template #content>
|
|
<el-text tag="b" size="large" truncated style="color: var(--el-text-color-primary);vertical-align: bottom;">编辑{{rightTitle}}</el-text>
|
|
</template>
|
|
</el-page-header>
|
|
<el-scrollbar style="padding: 10px;">
|
|
<el-text style="margin-bottom: 10px;display: block;color: var(--el-text-color-primary);" tag="b">选择模板</el-text>
|
|
<ul class="right-type-box">
|
|
<li
|
|
draggable="true"
|
|
v-for="item in rightData"
|
|
class="right-type-li"
|
|
:class="{'right-type-li-disabled':rightdb_idsStatus && item.flag == 'db_ids'}">
|
|
<el-text><el-icon><Circle-Plus /></el-icon>{{item.name}}</el-text>
|
|
</li>
|
|
</ul>
|
|
</el-scrollbar>
|
|
</el-aside>
|
|
<script>
|
|
const RightMixin = {
|
|
data(){
|
|
return {
|
|
rightTitle:'',
|
|
rightData:[
|
|
{name:'幻灯片',flag:'slide'},
|
|
{name:'富文本',flag:'rich_text'},
|
|
{name:'链接',flag:'link'},
|
|
// {name:'联系方式',flag:'contact'},
|
|
{name:'常见问题',flag:'question'},
|
|
{name:'手动推荐',flag:'manual_rec'},
|
|
{name:'文件推荐',flag:'file_rec'},
|
|
// {name:'图组推荐',flag:'picture_rec'},
|
|
// {name:'矩行推荐',flag:'rectangle_rec'},
|
|
{name:'横幅广告',flag:'banner'},
|
|
{name:'库',flag:'db_ids'},
|
|
// {name:'专辑推荐',flag:'tab_rec'},
|
|
{name:'搜索',flag:'search_rec'},
|
|
],
|
|
rightdb_idsStatus:false
|
|
}
|
|
},
|
|
methods:{
|
|
RightgoBack(){
|
|
window.location.href = 'index.php?mod=alonepage';
|
|
},
|
|
rightSortable(){
|
|
const self = this;
|
|
var tbody = document.querySelector('.right-type-box');
|
|
new Sortable(tbody, {
|
|
draggable: ".right-type-li",
|
|
filter: ".right-type-li-disabled",
|
|
group: {
|
|
name: 'shared',
|
|
pull:'clone'
|
|
},
|
|
sort: false,
|
|
animation: 150,
|
|
// 元素被选中
|
|
onChoose: function (/**Event*/evt) {
|
|
self.mainvisible = false;
|
|
},
|
|
// 元素未被选中的时候（从选中到未选中）
|
|
onUnchoose: function (/**Event*/evt) {
|
|
self.mainvisible = true;
|
|
},
|
|
});
|
|
}
|
|
},
|
|
mounted(){
|
|
this.rightSortable();
|
|
}
|
|
}
|
|
</script> |