kubbo/dvcp_v2_webapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

BUG 29300

Browse Source
This commit is contained in:
aixianling
2022-04-28 10:00:09 +08:00
parent b6bcf204f5
commit a6c9430a42
1 changed files with 67 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

101
packages/jianping/AppPublicizeInformation/List.vue
View File

@@ -2,24 +2,30 @@
<section class="List"> <section class="List">
<ai-list> <ai-list>
<ai-title slot="title" title="宣传资讯" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance" <ai-title slot="title" title="宣传资讯" isShowBottomBorder isShowArea v-model="search.areaId" :instance="instance"
@change="page.current=1,getTableData()"> @change="page.current=1,getTableData()">
</ai-title> </ai-title>
<template #content> <template #content>
<div class="flex"> <div class="flex fill">
<div class="type"> <div class="type">
<div class="title">宣传板块<span><el-button type="text" @click="addType(0, typeList.length+1, '')">添加</el-button></span></div> <div class="title">宣传板块<span><el-button type="text"
@click="addType(0, typeList.length+1, '')">添加</el-button></span>
</div>
<div class="list"> <div class="list">
<div class="item" v-for="(item, index) in typeList" :key="index" :class="typeIndex == index ? 'active' : ''" @click="typeClick(index)"> <div class="item" v-for="(item, index) in typeList" :key="index"
{{item.categoryName}} :class="typeIndex == index ? 'active' : ''" @click="typeClick(index)">
{{ item.categoryName }}
</div> </div>
<div class="item" v-if="!typeList.length">暂无数据</div> <div class="item" v-if="!typeList.length">暂无数据</div>
</div> </div>
</div> </div>
<div class="type mini-type"> <div class="type mini-type">
<div class="title">模块名称<span><el-button type="text" @click="addType(1, miniTypeList.length+1, typeList[typeIndex].id)">添加</el-button></span></div> <div class="title">模块名称<span><el-button type="text"
@click="addType(1, miniTypeList.length+1, typeList[typeIndex].id)">添加</el-button></span>
</div>
<div class="list"> <div class="list">
<div class="item" v-for="(item, index) in miniTypeList" :key="index" :class="miniTypeIndex == index ? 'active' : ''" @click="miniTypeClick(index)"> <div class="item" v-for="(item, index) in miniTypeList" :key="index"
<span class="text">{{item.categoryName}}</span> :class="miniTypeIndex == index ? 'active' : ''" @click="miniTypeClick(index)">
<span class="text">{{ item.categoryName }}</span>
<span class="icon"> <span class="icon">
<i class="el-icon-circle-plus-outline" @click="addNewType(index)"></i> <i class="el-icon-circle-plus-outline" @click="addNewType(index)"></i>
<i class="el-icon-edit" @click="editMini(index)"></i> <i class="el-icon-edit" @click="editMini(index)"></i>
@@ -32,12 +38,15 @@
<div class="content"> <div class="content">
<ai-search-bar> <ai-search-bar>
<template #right> <template #right>
<el-input size="small" placeholder="请输入标题" v-model="search.title" clearable @change="page.current=1,getTableData()"/> <el-input size="small" placeholder="请输入标题" v-model="search.title" clearable
@change="page.current=1,getTableData()"/>
</template> </template>
</ai-search-bar> </ai-search-bar>
<ai-search-bar> <ai-search-bar>
<template #left> <template #left>
<el-button type="primary" icon="iconfont iconAdd" @click="showEdit('')" v-if="typeList.length && miniTypeList.length">添加</el-button> <el-button type="primary" icon="iconfont iconAdd" @click="showEdit('')"
v-if="typeList.length && miniTypeList.length">添加
</el-button>
<!-- <el-button icon="iconfont iconDelete" :disabled="!ids.length" @click="handleDelete(ids)">删除</el-button> --> <!-- <el-button icon="iconfont iconDelete" :disabled="!ids.length" @click="handleDelete(ids)">删除</el-button> -->
</template> </template>
</ai-search-bar> </ai-search-bar>
@@ -53,7 +62,6 @@
</ai-table> </ai-table>
</div> </div>
</div> </div>
</template> </template>
</ai-list> </ai-list>
<ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="form={}" @onConfirm="submitDialog" width="600px"> <ai-dialog :visible.sync="dialog" :title="dialogTitle" @closed="form={}" @onConfirm="submitDialog" width="600px">
@@ -65,8 +73,9 @@
<el-input-number v-model="form.showIndex" @change="handleChange" :min="1" :max="100"></el-input-number> <el-input-number v-model="form.showIndex" @change="handleChange" :min="1" :max="100"></el-input-number>
</el-form-item> </el-form-item>
</el-form> </el-form>
<ai-table :tableData="newTypeList" :total="newPage.total" :current.sync="newPage.current" :size.sync="newPage.size" <ai-table :tableData="newTypeList" :total="newPage.total" :current.sync="newPage.current"
:col-configs="colConfigsNew" v-if="type == 2"> :size.sync="newPage.size"
:col-configs="colConfigsNew" v-if="type == 2">
<el-table-column slot="options" label="操作" fixed="right" align="center"> <el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}"> <template slot-scope="{row}">
<el-button type="text" @click="editNew(row)">编辑</el-button> <el-button type="text" @click="editNew(row)">编辑</el-button>
@@ -139,7 +148,13 @@ export default {
}) })
}, },
showEdit(id) { showEdit(id) {
this.$router.push({query: {id: id, parentId: this.typeList[this.typeIndex].id, moduleId: this.miniTypeList[this.miniTypeIndex].id}, hash: "#add"}) this.$router.push({
query: {
id: id,
parentId: this.typeList[this.typeIndex].id,
moduleId: this.miniTypeList[this.miniTypeIndex].id
}, hash: "#add"
})
}, },
handleDelete(ids) { handleDelete(ids) {
this.$confirm("是否删除该条宣传资讯信息").then(() => { this.$confirm("是否删除该条宣传资讯信息").then(() => {
@@ -164,10 +179,10 @@ export default {
this.instance.post(`/app/apppublicitycategory/addPublicityCategory`, this.form).then(res => { this.instance.post(`/app/apppublicitycategory/addPublicityCategory`, this.form).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$message.success('添加成功'); this.$message.success('添加成功');
if(this.type == 0) { if (this.type == 0) {
this.getTypeList() this.getTypeList()
} }
if(this.type == 1) { if (this.type == 1) {
this.getMiniTypeList(this.typeList[this.typeIndex].id) this.getMiniTypeList(this.typeList[this.typeIndex].id)
} }
this.dialog = false this.dialog = false
@@ -182,7 +197,7 @@ export default {
this.form.showIndex = index this.form.showIndex = index
this.dialogTitle = ['宣传板块', '宣传模块', '文章分类'][e] this.dialogTitle = ['宣传板块', '宣传模块', '文章分类'][e]
this.addLabelText = ['板块名称', '模块名称', '分类名称'][e] this.addLabelText = ['板块名称', '模块名称', '分类名称'][e]
this.rules.categoryName = [{required: true, message: "请输入"+this.addLabelText, trigger: "change"}] this.rules.categoryName = [{required: true, message: "请输入" + this.addLabelText, trigger: "change"}]
this.dialog = true this.dialog = true
}, },
getTypeList() { getTypeList() {
@@ -197,10 +212,10 @@ export default {
this.instance.post(`/app/apppublicitycategory/list?categoryType=1&size=100&parentId=${parentId}`).then(res => { this.instance.post(`/app/apppublicitycategory/list?categoryType=1&size=100&parentId=${parentId}`).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.miniTypeList = res.data.records this.miniTypeList = res.data.records
if(res.data.records && res.data.records.length) { if (res.data.records && res.data.records.length) {
this.miniTypeClick(0) this.miniTypeClick(0)
} }
} }
}) })
}, },
@@ -261,27 +276,32 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.List { .List {
height: 100%; height: 100%;
.flex{
.flex {
display: flex; display: flex;
.type{
.type {
width: 250px; width: 250px;
border: 1px solid #ddd; border: 1px solid #ddd;
box-sizing: border-box; box-sizing: border-box;
.title{
.title {
font-size: 16px; font-size: 16px;
line-height: 40px; line-height: 40px;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #ddd;
padding: 0 16px; padding: 0 16px;
font-weight: 600; font-weight: 600;
span{
span {
color: #26f; color: #26f;
font-size: 12px; font-size: 12px;
font-weight: 400; font-weight: 400;
float: right; float: right;
} }
} }
.list{
.item{ .list {
.item {
padding: 0 16px; padding: 0 16px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -289,38 +309,51 @@ export default {
font-size: 14px; font-size: 14px;
color: #333; color: #333;
box-sizing: border-box; box-sizing: border-box;
.text{
.text {
width: calc(100% - 70px); width: calc(100% - 70px);
cursor: pointer; cursor: pointer;
} }
.icon{
.icon {
width: 70px; width: 70px;
text-align: right; text-align: right;
i{
i {
font-size: 14px; font-size: 14px;
cursor: pointer; cursor: pointer;
margin-left: 8px; margin-left: 8px;
} }
.el-icon-delete{
.el-icon-delete {
color: #f46; color: #f46;
} }
.el-icon-circle-plus-outline{
.el-icon-circle-plus-outline {
color: #26f; color: #26f;
} }
} }
} }
.active{
.active {
// color: #26f; // color: #26f;
background-color: #f3f6f9; background-color: #f3f6f9;
} }
} }
} }
.mini-type{
.mini-type {
margin-right: 16px; margin-right: 16px;
} }
.content{
.content {
width: calc(100% - 516px); width: calc(100% - 516px);
} }
} }
::v-deep .ai-list__content--right-wrapper {
min-height: calc(100% - 6px) !important;
display: flex;
}
} }
</style> </style>