1
This commit is contained in:
+123
-3
@@ -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()
|
||||
|
||||
+84
-28
@@ -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">-->
|
||||
|
||||
Reference in New Issue
Block a user