This commit is contained in:
zhouhefeng
2026-04-30 10:03:51 +08:00
11 changed files with 435 additions and 58 deletions
@@ -1,6 +1,45 @@
<!--#
layout("/layouts/platform.html"){
#-->
<style>
.query-row {
display: flex;
align-items: flex-start;
margin-bottom: 12px;
}
.query-row-title {
width: 120px;
min-width: 120px;
line-height: 32px;
}
.query-row-content {
flex: 1;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.query-row-content-tag {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 8px;
}
.query-tag-item {
margin-right: 0;
cursor: pointer;
}
.query-tag-actions {
display: inline-flex;
align-items: center;
gap: 10px;
line-height: 32px;
}
</style>
<div id="app" v-cloak>
<guava ref="guava">
<template>
@@ -40,6 +79,56 @@ layout("/layouts/platform.html"){
</search-item>
</search>
</el-card>
<el-card shadow="never">
<el-row type="flex" align="middle" class="query-row query-row-tag">
<el-col class="query-row-title">人员分类:</el-col>
<el-col class="query-row-content query-row-content-tag">
<el-tag
class="query-tag-item"
v-for="item in aidFundMemberUserTypeOptions"
:key="item.code"
:effect="pageForm.aidFundMemberUserTypes.includes(item.code)?'dark':'plain'"
@click="tagClick('aidFundMemberUserTypes',item.code)">
{{ item.name }}
</el-tag>
<span class="query-tag-actions">
<el-link type="danger"
v-if="aidFundMemberUserTypeOptions.length&&pageForm.aidFundMemberUserTypes.length"
:underline="false"
@click="pageForm.aidFundMemberUserTypes=[];doSearch()">清空
</el-link>
<el-link :underline="false"
@click="pageForm.aidFundMemberUserTypes=aidFundMemberUserTypeOptions.map(p=>p.code);doSearch()"
type="success">全部
</el-link>
</span>
</el-col>
</el-row>
<el-row type="flex" align="middle" class="query-row query-row-tag">
<el-col class="query-row-title">人员属性:</el-col>
<el-col class="query-row-content query-row-content-tag">
<el-tag class="query-tag-item"
v-for="item in userAttributeOptions"
:key="item.code"
:effect="pageForm.userAttributes.includes(item.code)?'dark':'plain'"
@click="tagClick('userAttributes',item.code)">
{{ item.name }}
</el-tag>
<span class="query-tag-actions">
<el-link type="danger"
v-if="userAttributeOptions.length&&pageForm.userAttributes.length"
:underline="false"
@click="pageForm.userAttributes=[];doSearch()">清空
</el-link>
<el-link :underline="false"
@click="pageForm.userAttributes=userAttributeOptions.map(p=>p.code);doSearch()"
type="success">全部
</el-link>
</span>
</el-col>
</el-row>
</el-card>
<el-card shadow="never" class="mt10">
<table-tool label="会员分析"></table-tool>
@@ -122,9 +211,13 @@ layout("/layouts/platform.html"){
},
unions: [],
units: [],
aidFundMemberUserTypeOptions: [],
userAttributeOptions: [],
pageForm: {
currentYear: moment().format("YYYY"),
queryType: "fgh"
queryType: "fgh",
userAttributes: [],
aidFundMemberUserTypes: []
},
fullTableData: []
},
@@ -146,15 +239,42 @@ layout("/layouts/platform.html"){
this.units = data
})
}
this.$businessTool.getDictOptions("AIDFUND_MEMBER_USER_TYPE").then((data) => {
this.aidFundMemberUserTypeOptions = data
})
this.$businessTool.getDictOptions("USER_ATTRIBUTE").then((data) => {
this.userAttributeOptions = data
})
},
pageData() {
this.$axios.post(loc() + "/pageData", this.pageForm).then((res) => {
// 统计接口按 JSON 字符串接收多选条件,这里统一在提交前做转换,保证人员分类和人员属性都能正确过滤。
const pageForm = clone(this.pageForm)
pageForm.aidFundMemberUserTypes = JSON.stringify(this.pageForm.aidFundMemberUserTypes)
pageForm.userAttributes = JSON.stringify(this.pageForm.userAttributes)
this.$axios.post(loc() + "/pageData", pageForm).then((res) => {
if (res.code === 0) {
this.tableData = res.data
this.pageForm.totalCount = res.data.totalCount
}
})
}
},
tagClick(key,code) {
if (key === "userAttributes") {
if (this.pageForm.userAttributes.includes(code)) {
this.pageForm.userAttributes.splice(this.pageForm.userAttributes.indexOf(code), 1)
} else {
this.pageForm.userAttributes.push(code)
}
}
if (key === "aidFundMemberUserTypes") {
if (this.pageForm.aidFundMemberUserTypes.includes(code)) {
this.pageForm.aidFundMemberUserTypes.splice(this.pageForm.aidFundMemberUserTypes.indexOf(code), 1)
} else {
this.pageForm.aidFundMemberUserTypes.push(code)
}
}
this.doSearch()
},
},
created() {
this.initData()
@@ -3,24 +3,40 @@ layout("/layouts/platform.html"){
#-->
<style> .query-row {
display: flex;
align-items: center;
margin-bottom: 10px;
align-items: flex-start;
margin-bottom: 12px;
}
.query-row-title {
width: 120px;
min-width: 120px;
line-height: 32px;
}
.query-row-content {
flex: 1;
display: flex;
flex-wrap: wrap;
align-items: center;
align-items: flex-start;
}
.query-row-content-tag {
flex: 1;
display: flex;
flex-wrap: wrap;
align-items: flex-start;
gap: 8px;
}
.query-tag-item {
margin-right: 0;
cursor: pointer;
}
.query-tag-actions {
display: inline-flex;
align-items: center;
gap: 10px;
line-height: 32px;
}
</style>
<div id="app" v-cloak>
@@ -65,27 +81,51 @@ layout("/layouts/platform.html"){
</el-card>
<el-card shadow="never" class="mt10">
<el-row type="flex" align="middle" class="query-row query-row-tag">
<el-col class="query-row-title">人员分类:</el-col>
<el-col class="query-row-content query-row-content-tag">
<el-tag
class="query-tag-item"
v-for="item in aidFundMemberUserTypeOptions"
:key="item.code"
:effect="pageForm.aidFundMemberUserTypes.includes(item.code)?'dark':'plain'"
@click="tagClick('aidFundMemberUserTypes',item.code)">
{{ item.name }}
</el-tag>
<span class="query-tag-actions">
<el-link type="danger"
v-if="aidFundMemberUserTypeOptions.length&&pageForm.aidFundMemberUserTypes.length"
:underline="false"
@click="pageForm.aidFundMemberUserTypes=[];doSearch()">清空
</el-link>
<el-link :underline="false"
@click="pageForm.aidFundMemberUserTypes=aidFundMemberUserTypeOptions.map(p=>p.code);doSearch()"
type="success">全部
</el-link>
</span>
</el-col>
</el-row>
<el-row type="flex" align="middle" class="query-row query-row-tag">
<el-col class="query-row-title">人员属性:</el-col>
<el-col class="query-row-content query-row-content-tag">
<el-tag style="margin-right: 10px;cursor: pointer"
<el-tag class="query-tag-item"
v-for="item in userAttributeOptions"
:key="item.code"
:type="item.name"
:effect="pageForm.userAttributes.includes(item.code)?'dark':'plain'"
@click="tagClick(item.code)">
@click="tagClick('userAttributes',item.code)">
{{ item.name }}
</el-tag>
<el-link type="danger"
v-if="userAttributeOptions.length&&pageForm.userAttributes.length"
:underline="false"
@click="pageForm.userAttributes=[];doSearch()">清空
</el-link>
<el-link :underline="false"
@click="pageForm.userAttributes=userAttributeOptions.map(p=>p.code);doSearch()"
type="success">全部
</el-link>
<span class="query-tag-actions">
<el-link type="danger"
v-if="userAttributeOptions.length&&pageForm.userAttributes.length"
:underline="false"
@click="pageForm.userAttributes=[];doSearch()">清空
</el-link>
<el-link :underline="false"
@click="pageForm.userAttributes=userAttributeOptions.map(p=>p.code);doSearch()"
type="success">全部
</el-link>
</span>
</el-col>
</el-row>
</el-card>
@@ -137,8 +177,10 @@ layout("/layouts/platform.html"){
pageForm: {
currentYear: moment().format("YYYY"),
queryType: "fgh",
userAttributes: []
}
userAttributes: [],
aidFundMemberUserTypes: []
},
aidFundMemberUserTypeOptions: [],
},
methods: {
doExport() {},
@@ -158,20 +200,34 @@ layout("/layouts/platform.html"){
this.units = data
})
}
this.$businessTool.getDictOptions("USER_ATTRIBUTE").then((data) => {
this.userAttributeOptions = data
})
this.$businessTool.getDictOptions("AIDFUND_MEMBER_USER_TYPE").then((data) => {
this.aidFundMemberUserTypeOptions = data
})
this.$businessTool.getDictOptions("USER_ATTRIBUTE").then((data) => {
this.userAttributeOptions = data
})
},
tagClick(code) {
if (this.pageForm.userAttributes.includes(code)) {
this.pageForm.userAttributes.splice(this.pageForm.userAttributes.indexOf(code), 1)
} else {
this.pageForm.userAttributes.push(code)
}
tagClick(key,code) {
if (key === "userAttributes") {
if (this.pageForm.userAttributes.includes(code)) {
this.pageForm.userAttributes.splice(this.pageForm.userAttributes.indexOf(code), 1)
} else {
this.pageForm.userAttributes.push(code)
}
}
if (key === "aidFundMemberUserTypes") {
if (this.pageForm.aidFundMemberUserTypes.includes(code)) {
this.pageForm.aidFundMemberUserTypes.splice(this.pageForm.aidFundMemberUserTypes.indexOf(code), 1)
} else {
this.pageForm.aidFundMemberUserTypes.push(code)
}
}
this.doSearch()
},
pageData() {
const pageForm = clone(this.pageForm)
// 统计接口按 JSON 字符串接收多选条件,这里把人员分类和人员属性统一成同一提交口径。
pageForm.aidFundMemberUserTypes = JSON.stringify(this.pageForm.aidFundMemberUserTypes)
pageForm.userAttributes = JSON.stringify(this.pageForm.userAttributes)
this.$axios.post(loc() + "/pageData", pageForm).then((res) => {
if (res.code === 0) {
@@ -61,6 +61,14 @@ layout("/layouts/platform.html"){
<el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in unitOptions"></el-option>
</el-select>
</search-item>
<search-item label="人员分类">
<dict-select v-model="pageForm.aidFundMemberUserType" placeholder="请选择人员分类" @change="doSearch"
code="AIDFUND_MEMBER_USER_TYPE"></dict-select>
</search-item>
<search-item label="人员属性">
<dict-select v-model="pageForm.userAttribute" placeholder="请选择人员属性" @change="doSearch"
code="USER_ATTRIBUTE"></dict-select>
</search-item>
</search>
</el-card>
@@ -109,6 +109,14 @@ layout("/layouts/platform.html"){
v-model="pageForm.userStates"
></dict-select>
</search-item>
<search-item label="人员分类">
<dict-select v-model="pageForm.aidFundMemberUserType" placeholder="请选择人员分类" @change="doSearch"
code="AIDFUND_MEMBER_USER_TYPE"></dict-select>
</search-item>
<search-item label="人员属性">
<dict-select v-model="pageForm.userAttribute" placeholder="请选择人员属性" @change="doSearch"
code="USER_ATTRIBUTE"></dict-select>
</search-item>
<!-- <search-item label="所选福利:">-->
<!-- <el-select clearable placeholder="请选择所选福利" style="width: 100%" v-model="pageForm.optionId">-->