Commit 6761aa59 authored by zhengke's avatar zhengke

增加组件

parent 7fdd0ce9
<template>
<div>
<el-table ref="multipleTable" :data="dataList" tooltip-effect="dark" style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="55">
</el-table-column>
<el-table-column prop="name" label="名称">
<template slot-scope="scope">{{ scope.row.TopicName }}</template>
</el-table-column>
</el-table>
<el-pagination background @current-change="handleCurrentChange" :page-size="msgFenlei.pageSize"
layout="prev, pager, next" :total="totalFenlei">
</el-pagination>
</div>
</template>
<script>
export default {
data() {
return {
dataList: [],
totalFenlei: 0,
msgFenlei: {
pageIndex: 1,
pageSize: 15,
TopicName: ""
},
selectRow:[]
}
},
methods: {
handleCurrentChange(val) {
this.msgFenlei.pageIndex = val;
this.getFenleiList();
},
//获取数据
getFenleiList() {
this.apipost("/api/MContent/GetTopicTypePageList", this.msgFenlei, res => {
console.log(res,'resssss');
if (res.data.resultCode == 1) {
this.dataList = res.data.data.pageData;
this.totalFenlei = res.data.data.count;
} else {
this.Info(res.data.message);
}
})
},
handleSelectionChange(val){
this.selectRow=JSON.parse(JSON.stringify(val));
},
//父组件调用方法
getChoicedFenlei(){
return this.selectRow;
},
//清空多选方法
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
},
mounted() {
this.getFenleiList();
}
}
</script>
<template>
<div>
<el-table ref="multipleTable" :data="dataList" tooltip-effect="dark" style="width: 100%"
@selection-change="handleSelectionChange">
<el-table-column type="selection" width="55">
</el-table-column>
<el-table-column prop="name" label="名称">
<template slot-scope="scope">{{ scope.row.TopicName }}</template>
</el-table-column>
</el-table>
<el-pagination background @current-change="handleCurrentChange" :page-size="msgFenlei.pageSize"
layout="prev, pager, next" :total="totalFenlei">
</el-pagination>
</div>
</template>
<script>
export default {
data() {
return {
dataList: [],
totalFenlei: 0,
msgFenlei: {
pageIndex: 1,
pageSize: 15,
TopicTypeId: 0,
Title: "",
},
selectRow:[]
}
},
methods: {
handleCurrentChange(val) {
this.msgFenlei.pageIndex = val;
this.getFenleiList();
},
//获取数据
getFenleiList() {
this.apipost("/api/MContent/GetTopicPageList", this.msgFenlei, res => {
console.log(res,'resssss');
if (res.data.resultCode == 1) {
this.dataList = res.data.data.pageData;
this.totalFenlei = res.data.data.count;
} else {
this.Info(res.data.message);
}
})
},
handleSelectionChange(val){
this.selectRow=JSON.parse(JSON.stringify(val));
},
//父组件调用方法
getmyTopic(){
return this.selectRow;
},
//清空多选方法
toggleSelection(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row);
});
} else {
this.$refs.multipleTable.clearSelection();
}
},
},
mounted() {
this.getFenleiList();
}
}
</script>
......@@ -214,7 +214,7 @@
<div class="zk_pic_box" flex="main:center cross:center" style="width:100px;height:100px;">
<el-button type="danger"
v-if="data.icon!=domainManager().ImageUrl+'/Static/icon-topic-r.png'"
class="image-delete" size="mini" icon="el-icon-close" @click.stop="data.icon=domainManager().ImageUrl+'/Static/icon-topic-r.png'" circle>
class="image-delete" size="mini" style="visibility:visible" icon="el-icon-close" @click.stop="data.icon=domainManager().ImageUrl+'/Static/icon-topic-r.png'" circle>
</el-button>
<img :src="getIconLink(data.icon)" style="max-width:100%;max-height:100%;" alt=""/>
</div>
......@@ -241,10 +241,10 @@
<div flex="box:first">
<div class="diy-topic-label">自定义专题</div>
<div>
<el-switch v-model="cat.custom"></el-switch>
<el-switch v-model="cat.custom" :inactive-value="0" :active-value="1"></el-switch>
</div>
</div>
<div flex="box:first" v-if="!cat.custom">
<div flex="box:first" v-if="cat.custom==0">
<div class="diy-topic-label">专题数量</div>
<div>
<el-input v-model="cat.number" size="small"></el-input>
......@@ -253,21 +253,31 @@
<div flex="box:first" v-else>
<div class="diy-topic-label">专题列表</div>
<div>
<el-button size="mini">添加专题</el-button>
<!-- <app-gallery :list="cat.children" url-key="cover_pic" :show-delete="true" @deleted="deleteTopic"
width="100px" height="100px"></app-gallery> -->
<el-button size="mini" @click="isShowZhuanti=true,isTopicCheck=2">添加专题</el-button>
<div style="display:flex">
<div class="zk_pic_box" flex="main:center cross:center" style="width:100px;height:100px;margin-right:10px;" v-for="(childItem,subIndex) in cat.children" :key="subIndex">
<el-button type="danger" style="visibility:visible" @click="deleteTopic(childItem,subIndex)" class="image-delete" size="mini" icon="el-icon-close" @click.stop="data.icon=domainManager().ImageUrl+'/Static/icon-topic-r.png'" circle>
</el-button>
<img :src="getIconLink(childItem.cover_pic)" style="width:100%;height:100%;" alt=""/>
</div>
</div>
</div>
</div>
</div>
<el-button class="delete" @click="topicCatDelete(catIndex)" type="primary" icon="el-icon-delete"
style="top: 0;right: -26px;"></el-button>
</el-card>
<el-button size="mini">添加分类</el-button>
<el-button size="mini" @click="isShowTopic=true">添加分类</el-button>
</el-form-item>
<el-form-item label="专题列表" v-else>
<el-button size="mini">添加专题</el-button>
<!-- <app-gallery :list="data.topic_list" url-key="cover_pic" :show-delete="true" @deleted="deleteTopic"
width="100px" height="100px"></app-gallery> -->
<el-button size="mini" @click="isShowZhuanti=true,isTopicCheck=1">添加专题</el-button>
<div style="display:flex">
<div class="zk_pic_box" flex="main:center cross:center" style="width:100px;height:100px;margin-right:10px;" v-for="(sItem,sIndex) in data.topic_list" :key="sIndex">
<el-button type="danger" style="visibility:visible" @click="deleteTopic(sItem,sIndex)" class="image-delete" size="mini" icon="el-icon-close" @click.stop="data.icon=domainManager().ImageUrl+'/Static/icon-topic-r.png'" circle>
</el-button>
<img :src="getIconLink(sItem.cover_pic)" style="width:100%;height:100%;" alt=""/>
</div>
</div>
</el-form-item>
</template>
</el-form>
......@@ -277,24 +287,49 @@
<el-dialog title="选择文件" :visible.sync="choicImg" width="1240px">
<ChooseImg @SelectId="SelectId"></ChooseImg>
</el-dialog>
<!-- 添加分类 -->
<el-dialog :title="commonTitle" :visible.sync="isShowTopic" width="960px">
<choiceTopicFenlei ref="choiceTopicFenlei"></choiceTopicFenlei>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowTopic=false">取 消</el-button>
<el-button size="small" type="danger" @click="saveTopic()">确 定</el-button>
</span>
</el-dialog>
<!-- 添加专题 -->
<el-dialog :title="commonTitle" :visible.sync="isShowZhuanti" width="960px">
<choiceZhuanti ref="choiceZhuanti"></choiceZhuanti>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="isShowZhuanti=false">取 消</el-button>
<el-button size="small" type="danger" @click="saveZhuanti()">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import ChooseImg from "@/components/global/ChooseImg.vue";
import choiceTopicFenlei from "../../common/choiceTopicFenlei.vue";
import choiceZhuanti from "../../common/choiceZhuanti.vue";
export default {
props: ["topicData", "index", "dataLeng"],
components: {
ChooseImg
ChooseImg,
choiceTopicFenlei,
choiceZhuanti
},
data() {
return {
choicImg: false,
isShowTopic:false,
isShowZhuanti:false,
data: this.topicData.data,
defaultData: {},
cat_index: 0,
topicShow: false,
catShow: false,
commonIndex: -1
commonIndex: -1,
commonTitle:'',
isTopicCheck:-1
};
},
......@@ -335,37 +370,48 @@
},
selectCat(index) {
this.cat_index = index
this.catShow = false;
},
selectTopic(list) {
let topic_list = [];
for (let i in list) {
topic_list.push({
title: list[i].title,
cover_pic: list[i].cover_pic,
read_count: list[i].read_count,
layout: list[i].layout,
id: list[i].id
});
}
//保存选择分类
saveTopic(){
var ckedArr=this.$refs.choiceTopicFenlei.getChoicedFenlei();
ckedArr.forEach(x => {
let obj={
cat_id: x.Id,
cat_name:x.TopicName, //专题分类
name:x.TopicName, //菜单名称
custom:1, //自定义主题
number:3,
children:[]
}
this.data.list.push(obj);
});
this.isShowTopic=false;
this.$refs.choiceTopicFenlei.toggleSelection();
},
//保存专题
saveZhuanti(){
var ckedArr=this.$refs.choiceZhuanti.getmyTopic();
let topic_list = [];
ckedArr.forEach(x=>{
topic_list.push({
title: x.TopicName,
cover_pic: x.CoverImg,
read_count: x.ReadNum,
// layout: list[i].layout,
id: x.Id
});
})
topic_list = JSON.parse(JSON.stringify(topic_list));
this.data.topic_list = this.data.topic_list.concat(topic_list);
if (this.data.list && this.data.list.length > 0) {
this.data.list[this.cat_index].children = this.data.list[this.cat_index].children.concat(topic_list);
if(this.isTopicCheck==2){
if (this.data.list && this.data.list.length > 0) {
this.data.list[this.cat_index].children = this.data.list[this.cat_index].children.concat(topic_list);
}
}
this.topicShow = false;
},
selectCatList(list) {
for (let i in list) {
this.data.list.push({
cat_id: list[i].id,
cat_name: list[i].name,
name: list[i].name,
children: [],
custom: 0,
number: 30
});
if(this.isTopicCheck==1){
this.data.topic_list = this.data.topic_list.concat(topic_list);
}
this.$refs.choiceZhuanti.toggleSelection();
this.isShowZhuanti=false;
}
},
computed: {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment