init
This commit is contained in:
77
@@ -86,12 +86,14 @@
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="居住地" prop="residenceCode">
|
||||
<treeselect v-model="form.residenceCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />
|
||||
<el-cascader v-model="form.residenceCode" :props="{'value':'id'}" :options="areaOption" filterable style="width: 95%" />
|
||||
<!-- <treeselect v-model="form.residenceCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />-->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="户籍地" prop="addressCode">
|
||||
<treeselect v-model="form.addressCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />
|
||||
<el-cascader v-model="form.addressCode" :props="{'value':'id'}" :options="areaOption" filterable style="width: 95%" />
|
||||
<!-- <treeselect v-model="form.addressCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />-->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -318,10 +320,22 @@ export default {
|
||||
},
|
||||
created() {
|
||||
getTreeAreaCode().then(response => {
|
||||
this.areaOption = response.data
|
||||
this.areaOption = this.getTreeData(response.data)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getTreeData(data){
|
||||
for(var i=0;i<data.length;i++){
|
||||
if(data[i].children.length<1){
|
||||
// children若为空数组，则将children设为undefined
|
||||
data[i].children=undefined;
|
||||
}else {
|
||||
// children若不为空数组，则继续递归调⽤本⽅法
|
||||
this.getTreeData(data[i].children);
|
||||
}
|
||||
}
|
||||
return data;
|
||||
},
|
||||
normalizer(node){
|
||||
return {
|
||||
id: node.id,
|
||||
|
||||
@@ -86,12 +86,14 @@
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="居住地" prop="residenceCode">
|
||||
<treeselect v-model="form.residenceCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />
|
||||
<el-cascader v-model="form.residenceCode" :props="{'value':'id'}" :options="areaOption" filterable style="width: 95%" />
|
||||
<!-- <treeselect v-model="form.residenceCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />-->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="户籍地" prop="addressCode">
|
||||
<treeselect v-model="form.addressCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />
|
||||
<el-cascader v-model="form.addressCode" :props="{'value':'id'}" :options="areaOption" filterable style="width: 95%" />
|
||||
<!-- <treeselect v-model="form.addressCode" :normalizer="normalizer" :options="areaOption" :show-count="true" :disable-branch-nodes="true" />-->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@@ -311,10 +313,22 @@ export default {
|
||||
},
|
||||
created() {
|
||||
getTreeAreaCode().then(response => {
|
||||
this.areaOption = response.data
|
||||
this.areaOption = this.getTreeData(response.data)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
getTreeData(data){
|
||||
for(var i=0;i<data.length;i++){
|
||||
if(data[i].children.length<1){
|
||||
// children若为空数组，则将children设为undefined
|
||||
data[i].children=undefined;
|
||||
}else {
|
||||
// children若不为空数组，则继续递归调⽤本⽅法
|
||||
this.getTreeData(data[i].children);
|
||||
}
|
||||
}
|
||||
return data;
|
||||
},
|
||||
normalizer(node){
|
||||
return {
|
||||
id: node.id,
|
||||
|
||||
@@ -224,7 +224,7 @@
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right">
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="135" fixed="right">
|
||||
<template v-slot="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
@@ -236,6 +236,11 @@
|
||||
type="text"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="handleUpdateFilter(scope.row)"
|
||||
>修改择偶</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@@ -250,7 +255,7 @@
|
||||
|
||||
<user-info-dialog v-if="userInfoDialogVisible" ref="userInfoDialog" />
|
||||
<update-user-info-dialog v-if="updateUserInfoDialogVisible" ref="updateUserInfoDialog" @refreshDataList="getList" />
|
||||
|
||||
<update-user-filter-info-dialog v-if="updateUserFilterInfoDialogVisible" ref="updateUserFilterInfoDialog" @refreshDataList="getList"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -281,10 +286,11 @@ import {
|
||||
} from '@/constant/statusMap'
|
||||
import UserInfoDialog from '@/views/xq/user/user-info-dialog.vue'
|
||||
import UpdateUserInfoDialog from '@/views/xq/userInfo/update-user-info-dialog.vue'
|
||||
import UpdateUserFilterInfoDialog from '@/views/xq/userInfo/update-user-filter-info-dialog.vue'
|
||||
|
||||
export default {
|
||||
name: "UserInfo",
|
||||
components: { UpdateUserInfoDialog, UserInfoDialog },
|
||||
components: { UpdateUserInfoDialog, UserInfoDialog,UpdateUserFilterInfoDialog },
|
||||
data() {
|
||||
return {
|
||||
genderList,userCarStatusList, userChildStatusList, userCompanyNatureList, userDrinkStatusList,
|
||||
@@ -294,6 +300,7 @@ export default {
|
||||
userWantChildList, userWhenMarriageList,userFindTagList,userSignList,
|
||||
updateUserInfoDialogVisible: false,
|
||||
userInfoDialogVisible: false,
|
||||
updateUserFilterInfoDialogVisible: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
@@ -383,6 +390,12 @@ export default {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.updateUserInfoDialog.init(row)
|
||||
})
|
||||
},
|
||||
handleUpdateFilter(row){
|
||||
this.updateUserFilterInfoDialogVisible = true
|
||||
this.$nextTick(() => {
|
||||
this.$refs.updateUserFilterInfoDialog.init(row)
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
297
src/views/xq/userInfo/update-user-filter-info-dialog.vue
Normal file
297
src/views/xq/userInfo/update-user-filter-info-dialog.vue
Normal file
@@ -0,0 +1,297 @@
|
||||
<template>
|
||||
<el-dialog title="修改择偶条件" :close-on-click-modal="false" :visible.sync="open" width="800px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="手机号" prop="mobile">
|
||||
<el-input v-model="form.mobile" maxlength="11" disabled/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="昵称" prop="nickname" >
|
||||
<el-input v-model="form.nickname" disabled />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="年龄" prop="ageFilter">
|
||||
<el-col :span="4">
|
||||
<el-checkbox v-model="form.ageBx">不限</el-checkbox>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-slider v-if="form.ageBx === false" v-model="form.ageFilter" range :min="20" :max="50" />
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="身高" prop="ageFilter">
|
||||
<el-col :span="4">
|
||||
<el-checkbox v-model="form.heightBx">不限</el-checkbox>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-slider v-if="form.heightBx === false" v-model="form.heightFilter" range :min="150" :max="199" />
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="体型" prop="somatotypeFilter">
|
||||
<el-col :span="4">
|
||||
<el-checkbox v-model="form.somatotypeFilterBx">不限</el-checkbox>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-select v-if="form.somatotypeFilterBx === false" multiple v-model="form.somatotypeFilter" size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userSomatotypeList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item label="婚况" prop="marriageFilter">
|
||||
<el-col :span="4">
|
||||
<el-checkbox v-model="form.marriageFilterBx">不限</el-checkbox>
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<el-select v-if="form.marriageFilterBx === false" multiple v-model="form.marriageFilter" size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userMarriageList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="学历" prop="filterEducation">
|
||||
<el-select v-model="form.filterEducation" clearable size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userEducationList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="年收入" prop="filterAnnualIncome">
|
||||
<el-select v-model="form.filterAnnualIncome" clearable size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userAnnualIncomeList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="小孩情况" prop="filterChildStatus">
|
||||
<el-select v-model="form.filterChildStatus" clearable size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userChildStatusList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="住房情况" prop="filterHousingStatus">
|
||||
<el-select v-model="form.filterHousingStatus" clearable size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userHousingStatusList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="购车情况" prop="filterCarStatus">
|
||||
<el-select v-model="form.filterCarStatus" clearable size="small" style="width: 95%">
|
||||
<el-option
|
||||
v-for="dict in userCarStatusList"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="open = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
appUserTypeList,
|
||||
booleanList,
|
||||
finishStatusList,
|
||||
genderList,
|
||||
memberTypeList,
|
||||
onlineStatusList,
|
||||
professionList,
|
||||
userAnnualIncomeList,
|
||||
userCarStatusList,
|
||||
userChildStatusList,
|
||||
userCompanyNatureList,
|
||||
userDrinkStatusList,
|
||||
userEducationList,
|
||||
userFamilyBackgroundList,
|
||||
userFamilyRankingList,
|
||||
userFindTagList,
|
||||
userForPersonalsList,
|
||||
userHousingStatusList,
|
||||
userLiveAtParentList,
|
||||
userLoveAtDistanceList,
|
||||
userMarriageList,
|
||||
userSignList,
|
||||
userSmokeStatusList,
|
||||
userSomatotypeList,
|
||||
userStatusList,
|
||||
userWantChildList,
|
||||
userWhenMarriageList,
|
||||
userZodiacList,
|
||||
videoStatusList
|
||||
} from '@/constant/statusMap'
|
||||
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
||||
import { getUserInfo, updateUserInfoFilter } from '@/api/xq/userInfo'
|
||||
|
||||
export default {
|
||||
name: "UserInfo",
|
||||
components: { },
|
||||
data() {
|
||||
return {
|
||||
genderList,userStatusList,finishStatusList,userSomatotypeList,userZodiacList,userSignList,
|
||||
userEducationList,userCompanyNatureList,userAnnualIncomeList,userForPersonalsList,
|
||||
userHousingStatusList,userCarStatusList,userSmokeStatusList,userMarriageList,
|
||||
userDrinkStatusList,userChildStatusList,userFamilyBackgroundList,userFamilyRankingList,
|
||||
userLoveAtDistanceList,userWhenMarriageList,userWantChildList,userLiveAtParentList,
|
||||
userFindTagList,appUserTypeList,professionList,
|
||||
videoStatusList,onlineStatusList,memberTypeList,
|
||||
booleanList,
|
||||
open:false,
|
||||
buttonLoading: false,
|
||||
userSomatotypeListFilter:[],
|
||||
userMarriageListFilter:[],
|
||||
form:{
|
||||
id: undefined,
|
||||
mobile: undefined,
|
||||
nickname: undefined,
|
||||
ageBx: false,
|
||||
ageFilter: undefined,
|
||||
heightBx: false,
|
||||
heightFilter: undefined,
|
||||
somatotypeFilterBx: false,
|
||||
somatotypeFilter: undefined,
|
||||
marriageFilterBx: false,
|
||||
marriageFilter: undefined,
|
||||
filterEducation: undefined,
|
||||
filterAnnualIncome: undefined,
|
||||
filterChildStatus: undefined,
|
||||
filterHousingStatus: undefined,
|
||||
filterCarStatus: undefined,
|
||||
},
|
||||
rules:{
|
||||
},
|
||||
areaOption: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
init(row){
|
||||
this.form.id = row.id
|
||||
this.open = true;
|
||||
this.$nextTick(() => {
|
||||
getUserInfo(row.id).then(response => {
|
||||
this.form.id = response.data.id;
|
||||
this.form.mobile = row.mobile;
|
||||
this.form.nickname = row.nickname;
|
||||
if(response.data.filterAge){
|
||||
this.form.ageBx = false
|
||||
this.form.ageFilter = response.data.filterAge.split('-')
|
||||
}else{
|
||||
this.form.ageBx = true
|
||||
this.form.ageFilter = undefined
|
||||
}
|
||||
if(response.data.filterHeight){
|
||||
this.form.heightBx = false
|
||||
this.form.heightFilter = response.data.filterHeight.split('-')
|
||||
}else{
|
||||
this.form.heightBx = true
|
||||
this.form.heightFilter = undefined
|
||||
}
|
||||
if(response.data.filterSomatotype){
|
||||
this.form.somatotypeFilterBx = false
|
||||
this.form.somatotypeFilter = response.data.filterSomatotype.split('-')
|
||||
}else{
|
||||
this.form.somatotypeFilterBx = true
|
||||
this.form.somatotypeFilter = undefined
|
||||
}
|
||||
if(response.data.filterMarriage){
|
||||
this.form.marriageFilterBx = false
|
||||
this.form.marriageFilter = response.data.filterMarriage.split('-')
|
||||
}else{
|
||||
this.form.marriageFilterBx = true
|
||||
this.form.marriageFilter = undefined
|
||||
}
|
||||
this.form.filterEducation = response.data.filterEducation;
|
||||
this.form.filterAnnualIncome = response.data.filterAnnualIncome;
|
||||
this.form.filterChildStatus = response.data.filterChildStatus;
|
||||
this.form.filterHousingStatus = response.data.filterHousingStatus;
|
||||
this.form.filterCarStatus = response.data.filterCarStatus;
|
||||
})
|
||||
})
|
||||
},
|
||||
submitForm(){
|
||||
updateUserInfoFilter({
|
||||
id: this.form.id,
|
||||
filterAge : this.form.ageBx ? "" : this.form.ageFilter.join("-"),
|
||||
filterHeight : this.form.heightBx ? "" : this.form.heightFilter.join("-"),
|
||||
filterSomatotype : this.form.somatotypeFilterBx ? "" : this.form.somatotypeFilter.join("&"),
|
||||
filterMarriage : this.form.marriageFilterBx ? "" : this.form.marriageFilter.join("&"),
|
||||
filterEducation: this.form.filterEducation,
|
||||
filterAnnualIncome: this.form.filterAnnualIncome,
|
||||
filterChildStatus: this.form.filterChildStatus,
|
||||
filterHousingStatus: this.form.filterHousingStatus,
|
||||
filterCarStatus: this.form.filterCarStatus,
|
||||
}).then(data => {
|
||||
this.$modal.msgSuccess("修改用户择偶信息成功");
|
||||
this.buttonLoading = false;
|
||||
this.open = false
|
||||
this.$emit('refreshDataList')
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<el-dialog title="新增用户" :close-on-click-modal="false" :visible.sync="open" width="800px" append-to-body>
|
||||
<el-dialog title="修改用户详细信息" :close-on-click-modal="false" :visible.sync="open" width="800px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
|
||||
@@ -1,60 +0,0 @@
|
||||
<template>
|
||||
<el-dialog title="用户信息" :close-on-click-modal="false" :visible.sync="open" width="1200px" append-to-body>
|
||||
<el-collapse-item title="基本信息" name="base">
|
||||
<el-descriptions :contentStyle="CS" :label-style="LS " class="margin-top" :column="3" size="medium" border>
|
||||
<el-descriptions-item label="id">
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-collapse-item>
|
||||
<el-collapse-item title="择偶条件" name="filter">
|
||||
</el-collapse-item>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script>
|
||||
import { getFullUser } from '@/api/cai/user'
|
||||
|
||||
export default {
|
||||
name: "UserInfo",
|
||||
data() {
|
||||
return {
|
||||
activeName:['base','filter'],
|
||||
CS: {
|
||||
'text-align': 'center', //文本居中
|
||||
'min-width': '250px', //最小宽度
|
||||
'word-break': 'break-all' //过长时自动换行
|
||||
},
|
||||
LS: {
|
||||
// 'color': '#000',
|
||||
'text-align': 'center',
|
||||
// 'font-weight': '600',
|
||||
'height': '40px',
|
||||
// 'background-color': 'rgba(255, 97, 2, 0.1)',
|
||||
'min-width': '110px',
|
||||
'word-break': 'keep-all'
|
||||
},
|
||||
open:false,
|
||||
info:{},
|
||||
userId: this.$route.query.id,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
init(userId){
|
||||
this.open = true;
|
||||
this.userId = userId;
|
||||
getFullUser(this.userId).then(response => {
|
||||
this.info = response.data;
|
||||
});
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-row {
|
||||
margin-bottom: -15px;
|
||||
display: flex;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user