hy/aslan-admin
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(banner管理页面、banner编辑组件): 搜索条件、编辑弹窗新增“平台”选项

Browse Source
This commit is contained in:
hzj 2026-01-28 15:00:48 +08:00
parent c407a6a53e
commit 41d600a12a
2 changed files with 142 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/views/sys/banner/form-edit.vue
View File

@ -97,6 +97,24 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<!-- 平台 -->
<el-form-item label="平台" prop="platform">
<el-select
v-model="form.platform"
placeholder="状态"
clearable
style="width:100%;"
class="filter-item"
>
<el-option
v-for="(item, index) in appPlatforms"
:key="index"
:label="item.name"
:value="item.value"
/>
</el-select>
</el-form-item>
<!-- 类型 --> <!-- 类型 -->
<el-form-item label="类型" prop="type"> <el-form-item label="类型" prop="type">
<el-select <el-select
@ -252,9 +270,11 @@
</div> </div>
</template> </template>
<script> <script>
import { updateBanner, addBanner } from "@/api/banner";
import { getElementUiUploadFile } from "@/utils";
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import { appPlatforms } from "@/constant/origin";
import { getElementUiUploadFile } from "@/utils";
import { updateBanner, addBanner } from "@/api/banner";
import { regionConfigTable } from "@/api/sys"; import { regionConfigTable } from "@/api/sys";
export default { export default {
props: { props: {
@ -280,6 +300,7 @@ export default {
{ name: "钱包", value: "WALLET" }, { name: "钱包", value: "WALLET" },
{ name: "游戏", value: "GAME" } { name: "游戏", value: "GAME" }
], ],
appPlatforms,
searchDisabled: false, searchDisabled: false,
alertCoverUploadLoading: false, alertCoverUploadLoading: false,
alertCoverFileList: [], alertCoverFileList: [],
@ -296,6 +317,7 @@ export default {
cover: "", cover: "",
smallCover: "", smallCover: "",
showcase: "", showcase: "",
platform: "",
type: "", type: "",
sysOrigin: "", sysOrigin: "",
content: "", content: "",
@ -313,6 +335,7 @@ export default {
rules: { rules: {
cover: commonRules, cover: commonRules,
showcase: commonRules, showcase: commonRules,
platform: commonRules,
type: commonRules, type: commonRules,
sysOrigin: commonRules, sysOrigin: commonRules,
expiredTime: commonRules expiredTime: commonRules

195
src/views/sys/banner/index.vue
View File

@ -1,6 +1,5 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="filter-container"> <div class="filter-container">
<el-select <el-select
v-model="listQuery.sysOrigin" v-model="listQuery.sysOrigin"
@ -15,11 +14,27 @@
:label="item.label" :label="item.label"
:value="item.value" :value="item.value"
> >
<span style="float: left;"> <sys-origin-icon :icon="item.value" :desc="item.value" /></span> <span style="float: left;">
<sys-origin-icon :icon="item.value" :desc="item.value"
/></span>
<span style="float: left;margin-left:10px">{{ item.label }}</span> <span style="float: left;margin-left:10px">{{ item.label }}</span>
</el-option> </el-option>
</el-select> </el-select>
<el-select
v-model="listQuery.platform"
style="width: 120px"
class="filter-item"
placeholder="平台"
>
<el-option
v-for="(item, index) in appPlatforms"
:key="index"
:label="item.name"
:value="item.value"
/>
</el-select>
<el-select <el-select
v-model="listQuery.showcase" v-model="listQuery.showcase"
placeholder="状态" placeholder="状态"
@ -111,20 +126,24 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="type" label="类型" align="center" /> <el-table-column prop="type" label="类型" align="center" />
<el-table-column prop="displayPositionNames" label="展示位" align="center" /> <el-table-column
prop="displayPositionNames"
label="展示位"
align="center"
/>
<el-table-column label="归属系统" align="center"> <el-table-column label="归属系统" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<sys-origin-icon :icon="scope.row.sysOrigin" :desc="scope.row.sysOrigin" /> <sys-origin-icon
:icon="scope.row.sysOrigin"
:desc="scope.row.sysOrigin"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="regionNameStr" label="区域" align="center" /> <el-table-column prop="regionNameStr" label="区域" align="center" />
<el-table-column prop="sort" label="排序" align="center" /> <el-table-column prop="sort" label="排序" align="center" />
<el-table-column prop="content" label="内容" align="center"> <el-table-column prop="content" label="内容" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-popover <el-popover placement="top-start" trigger="hover">
placement="top-start"
trigger="hover"
>
<div class="popover-content"> <div class="popover-content">
<div><strong>内容：</strong>{{ scope.row.content }}</div> <div><strong>内容：</strong>{{ scope.row.content }}</div>
<div><strong>参数：</strong>{{ scope.row.params }}</div> <div><strong>参数：</strong>{{ scope.row.params }}</div>
@ -139,10 +158,24 @@
<el-table-column label="状态" align="center"> <el-table-column label="状态" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div> <div>
<el-tag v-if="scope.row.expired === true && scope.row.showcase === false" type="warning">下架+过期</el-tag> <el-tag
<el-tag v-else-if="scope.row.expired === true && scope.row.showcase === true" type="warning">上架+过期</el-tag> v-if="scope.row.expired === true && scope.row.showcase === false"
<el-tag v-else-if="scope.row.expired === true" type="warning">过期</el-tag> type="warning"
<el-tag v-else-if="scope.row.showcase === false" type="danger">下架</el-tag> >下架+过期</el-tag
>
<el-tag
v-else-if="
scope.row.expired === true && scope.row.showcase === true
"
type="warning"
>上架+过期</el-tag
>
<el-tag v-else-if="scope.row.expired === true" type="warning"
>过期</el-tag
>
<el-tag v-else-if="scope.row.showcase === false" type="danger"
>下架</el-tag
>
<el-tag v-else-if="scope.row.showcase === true">上架</el-tag> <el-tag v-else-if="scope.row.showcase === true">上架</el-tag>
</div> </div>
</template> </template>
@ -150,7 +183,9 @@
<el-table-column fixed="right" label="操作" align="center" width="200"> <el-table-column fixed="right" label="操作" align="center" width="200">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" @click.native="handleUpdate()">修改</el-button> <el-button type="text" @click.native="handleUpdate()">修改</el-button>
<el-button type="text" @click.native="handlDel(scope.row)">删除</el-button> <el-button type="text" @click.native="handlDel(scope.row)"
>删除</el-button
>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -174,23 +209,24 @@
</template> </template>
<script> <script>
import { bannerTable, deleteBanner } from '@/api/banner' import { bannerTable, deleteBanner } from "@/api/banner";
import Pagination from '@/components/Pagination' import Pagination from "@/components/Pagination";
import { sysOriginPlatforms } from '@/constant/origin' import { appPlatforms, sysOriginPlatforms } from "@/constant/origin";
import FormEdit from './form-edit.vue' import FormEdit from "./form-edit.vue";
import { mapGetters } from 'vuex' import { mapGetters } from "vuex";
import { regionConfigTable } from '@/api/sys' import { regionConfigTable } from "@/api/sys";
export default { export default {
components: { Pagination, FormEdit }, components: { Pagination, FormEdit },
data() { data() {
return { return {
thatRow: {}, thatRow: {},
appPlatforms,
sysOriginPlatforms, sysOriginPlatforms,
txtVal: 0, txtVal: 0,
loading: false, loading: false,
regions: [], regions: [],
activeGiftId: '', activeGiftId: "",
pushTextHistoryLoading: false, pushTextHistoryLoading: false,
pushTextHistoryVisible: false, pushTextHistoryVisible: false,
pushTextHistory: [], pushTextHistory: [],
@ -201,104 +237,107 @@ export default {
cursor: 1, cursor: 1,
limit: 20, limit: 20,
showcase: 1, showcase: 1,
sysOrigin: 'HALAR', sysOrigin: "HALAR",
region: '' platform: "Android",
region: ""
}, },
formEditVisible: false, formEditVisible: false,
textOptTitle: '', textOptTitle: "",
listLoading: true listLoading: true
} };
}, },
computed: { computed: {
...mapGetters(['permissionsSysOriginPlatforms']) ...mapGetters(["permissionsSysOriginPlatforms"])
}, },
created() { created() {
const that = this const that = this;
const querySystem = this.permissionsSysOriginPlatforms[0] const querySystem = this.permissionsSysOriginPlatforms[0];
if (!querySystem) { if (!querySystem) {
return return;
} }
that.listQuery.sysOrigin = querySystem.value that.listQuery.sysOrigin = querySystem.value;
this.listRegion() this.listRegion();
that.renderData() that.renderData();
}, },
methods: { methods: {
renderData(isClean) { renderData(isClean) {
const that = this const that = this;
if (isClean === true) { if (isClean === true) {
this.listQuery.cursor = 1 this.listQuery.cursor = 1;
this.listQuery.list = [] this.listQuery.list = [];
} }
that.listLoading = true that.listLoading = true;
bannerTable(that.listQuery).then(res => { bannerTable(that.listQuery).then(res => {
const { body } = res const { body } = res;
that.total = body.total || 0 that.total = body.total || 0;
that.list = body.records that.list = body.records;
that.listLoading = false that.listLoading = false;
}) });
}, },
listRegion() { listRegion() {
const that = this const that = this;
that.loading = true that.loading = true;
regionConfigTable({ 'sysOrigin': that.listQuery.sysOrigin }).then(res => { regionConfigTable({ sysOrigin: that.listQuery.sysOrigin })
that.regions = res.body || [] .then(res => {
that.loading = false that.regions = res.body || [];
}).catch(er => { that.loading = false;
that.loading = false })
}) .catch(er => {
that.loading = false;
});
}, },
handleSearch() { handleSearch() {
this.renderData(true) this.renderData(true);
}, },
renderDataSuccess() { renderDataSuccess() {
this.$message({ this.$message({
message: 'Successful', message: "Successful",
type: 'success' type: "success"
}) });
this.renderData() this.renderData();
}, },
changeSysOrigin() { changeSysOrigin() {
this.listRegion() this.listRegion();
this.handleSearch() this.handleSearch();
}, },
queryUserDetails(row) { queryUserDetails(row) {
this.userDeatilsDrawer = true this.userDeatilsDrawer = true;
this.thatSelectedUserId = row.id this.thatSelectedUserId = row.id;
}, },
// 删除 // 删除
handlDel(row) { handlDel(row) {
this.$confirm('确认删除吗？', '提示', { this.$confirm("确认删除吗？", "提示", {
type: 'warning' type: "warning"
}).then(() => {
this.listLoading = true
deleteBanner(row.id, row.sysOrigin).then((res) => {
this.listLoading = false
this.$message({
message: '删除成功',
type: 'success'
})
this.renderData()
})
}).catch(() => {
}) })
.then(() => {
this.listLoading = true;
deleteBanner(row.id, row.sysOrigin).then(res => {
this.listLoading = false;
this.$message({
message: "删除成功",
type: "success"
});
this.renderData();
});
})
.catch(() => {});
}, },
handleCreate() { handleCreate() {
this.thatRow = null this.thatRow = null;
this.formEditVisible = true this.formEditVisible = true;
}, },
handleUpdate() { handleUpdate() {
this.formEditVisible = true this.formEditVisible = true;
}, },
handleMouseEnter(row) { handleMouseEnter(row) {
this.thatRow = row this.thatRow = row;
}, },
formEditSuccess() { formEditSuccess() {
this.formEditVisible = false this.formEditVisible = false;
this.renderData() this.renderData();
} }
} }
} };
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.popover-content { .popover-content {