广告管理

This commit is contained in:
2024-11-22 13:34:46 +08:00
parent 48d62bbf1e
commit ee67f17957
5 changed files with 1235 additions and 26 deletions

View File

@@ -0,0 +1,386 @@
<template>
<div class="mod-config" style="height: calc(100vh - 180px );">
<el-button type="primary" size="small" @click="addOrUpdateHandle()" style="margin-bottom: 20px;float: right;"
>新增广告</el-button
>
<div style="height: calc(100% - 40px );">
<el-table
:data="dataList"
border
height="90%"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column
prop="title"
header-align="center"
align="center"
label="APP"
width="200"
>
<template slot-scope="scope">
<div>
<span v-if="scope.row.appType == 0">疯子读书</span>
<span v-if="scope.row.appType == 1">吴门医述</span>
<span v-if="scope.row.appType == 2">众妙之门</span>
</div>
</template>
</el-table-column>
<el-table-column
prop="title"
header-align="center"
align="center"
label="广告类型"
>
<template slot-scope="scope">
<div>
<span v-if="scope.row.type == 0">商品</span>
<span v-if="scope.row.type == 1">充值</span>
<span v-if="scope.row.type == 2">VIP</span>
<span v-if="scope.row.type == 3">活动</span>
</div>
</template>
</el-table-column>
<el-table-column
prop="title"
header-align="center"
align="center"
label="广告图片"
>
<template slot-scope="scope">
<img
v-if="scope.row.icon != ''"
:src="scope.row.icon"
alt=""
style="width: 50px; height: 70px;"
/>
</template>
</el-table-column>
<el-table-column
min-width="200"
prop="title"
header-align="center"
align="left"
label="关联信息"
>
<template slot-scope="scope">
<div v-if="scope.row.type == 0">
<div
v-if="JSON.stringify(scope.row.shopProduct) != '{}'&&scope.row.shopProduct"
style=""
>
<div
style="display: flex;align-items: center;
justify-content: space-between;"
>
<div
style="background-color: #b0b0b0;width: 40px;height: 60px;"
>
<img
v-if="
scope.row.shopProduct&& JSON.stringify(scope.row.shopProduct) != '{}' &&
scope.row.shopProduct.productImages != ''
"
:src="scope.row.shopProduct.productImages"
width="40"
height="60"
class="tableImg"
/>
<span
v-else
style="text-align: center;line-height: 70px;font-size: 10px;"
>暂无封面图</span
>
</div>
<div style="width: calc(100% - 60px);line-height: 20px;">
<div>
<span style="font-weight: bold;">商品ID</span>
{{ scope.row.shopProduct.productId }}
</div>
<div>
<span style="font-weight: bold;">商品名称:</span
>{{ scope.row.shopProduct.productName }}
</div>
<div>
<span style="font-weight: bold;">价格:</span
>{{ scope.row.shopProduct.price }} <span style="font-weight: bold;margin-left: 20px;">活动价:</span
>{{ scope.row.shopProduct.activityPrice }}
</div>
</div>
</div>
</div>
</div>
</template>
</el-table-column>
<el-table-column
width="160"
prop="createTime"
header-align="center"
align="center"
label="创建日期"
>
</el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="140"
label="操作"
>
<template slot-scope="scope">
<div>
<el-button
type="text"
size="small"
@click="addOrUpdateHandle(scope.row)"
>修改</el-button
>
<el-button
type="text"
size="small"
style="color: red;"
@click="deleteHandle(scope.row.id)"
>删除</el-button
>
</div>
</template>
</el-table-column>
</el-table>
</div>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
:APPList="APPList"
:typeList="typeList"
@refreshDataList="getDataList"
></add-or-update>
</div>
</template>
<script>
import AddOrUpdate from "./advertisement-add-or-update";
export default {
data() {
return {
typeList: [
{ label: "商品", value: 0 },
{ label: "充值", value: 1 },
{ label: "VIP", value: 2 },
{ label: "活动", value: 3 }
],
selectQueryApp: null,
APPList: [
{ label: "疯子读书", value: 0 },
{ label: "吴门医述", value: 1 },
{ label: "众妙之门", value: 2 }
],
dataForm: {
key: ""
},
query: {
type: "",
title: ""
},
dataList: [],
delFlag: false,
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false,
urlList: {
list: "/master/mainAd/getMainAdList"
}
};
},
components: {
AddOrUpdate
},
activated() {
if (this.$route.query.upPageInde != null) {
this.pageIndex = this.$route.query.upPageIndex;
console.log(this.pageIndex);
}
this.getDataList();
},
methods: {
// 获取数据列表
getDataList() {
console.log("this.selectQueryApp at line 195:", this.selectQueryApp);
this.dataListLoading = true;
this.$http
.request({
url: this.$http.adornUrl(this.urlList.list),
method: "POST",
data: {},
header: {
//默认 无 说明:请求头
"Content-Type": "application/json"
}
})
.then(({ data }) => {
if (data && data.code === 0) {
this.dataList = data.list;
console.log('this.dataList at line 230:', this.dataList)
// this.totalPage = data.result.total;
} else {
this.dataList = [];
// this.totalPage = 0;
}
this.dataListLoading = false;
});
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val;
this.getDataList();
},
// 多选
selectionChangeHandle(val) {
this.dataListSelections = val;
},
// 新增 / 修改
addOrUpdateHandle(row) {
console.log('row at line 258:', row)
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init({
...row
});
});
},
// 删除
deleteHandle(id) {
this.$confirm(
`确定对[id=${id}]进行[${id ? "删除" : "删除"}]操作?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(() => {
this.$http({
url: this.$http.adornUrl("/master/mainAd/delMainAd"),
method: "POST",
data: {
id: id
}
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
});
this.$nextTick(() => {
this.getDataList();
});
} else {
this.$message.error(data.msg);
}
});
});
},
// 开关变化
SwitchChange(event) {
/*点击时他会自动把你绑定的值变更,直接去请求数据就可以了*/
var parms = {
delFlag: event.delFlag,
id: event.id
};
this.$http({
url: this.$http.adornUrl("/book/book/update"),
method: "post",
data: parms
})
.then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
})
.catch(error => {
this.loading = false;
console.log(error);
});
console.log(event);
},
chapterHandle(id, row) {
if (row.novel == "") {
this.$alert("请上传电子书文件后在进行此操作", "提示", {
confirmButtonText: "好的"
});
return false;
}
this.$http({
url: this.$http.adornUrl("/book/book/getChapter"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
},
contentHandle(id) {
this.$http({
url: this.$http.adornUrl("/book/bookchaptercontent/getBookVoices"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
},
voicesHandle(id) {
//allVoices
this.$http({
// url: this.$http.adornUrl('/book/bookchaptercontent/allVoices'),
url: this.$http.adornUrl("/book/bookchaptercontent/AllVOices"),
method: "get",
params: this.$http.adornParams({
id: id
})
}).then(res => {
console.log("book/bookchaptercontent/AllVOices");
this.$message({
message: "成功",
type: "success"
});
this.loading = false;
this.getDataList();
});
}
}
};
</script>