init

src/api/xq/userInfo.js

@@ -35,6 +35,14 @@ export function updateUserInfo(data) {
   })
 }
 
+export function updateUserInfoFilter(data) {
+  return request({
+    url: '/xq/userInfo/filter',
+    method: 'put',
+    data: data
+  })
+}
+
 // 删除用户信息
 export function delUserInfo(id) {
   return request({

src/constant/statusMap.js

@@ -484,7 +484,7 @@ export const payStatusList = [
 ]
 
 export const platformTypeList = [
-  { value: "ADMIN", label: '后台管理操作',listClass: listClass.danger},
+  { value: "ADMIN", label: '后台操作',listClass: listClass.danger},
   { value: "WX", label: '微信',listClass: listClass.success},
   { value: "ALI", label: '支付宝',listClass: listClass.primary},
   { value: "SYS", label: '系统操作',listClass: listClass.info},
@@ -544,7 +544,7 @@ export const reportStatusList = [
 export const wxTransOrderSourceList = [
   { value: 1, label: '订单',listClass: listClass.primary},
   { value: 2, label: 'VIP赠送',listClass: listClass.warning},
-  { value: 3, label: '后台管理新增',listClass: listClass.danger},
+  { value: 3, label: '后台新增',listClass: listClass.danger},
 ]
 
 export const consumeLogTypeList = [

src/views/xq/user/add-user-dialog.vue

@@ -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,

src/views/xq/user/update-user-dialog.vue

@@ -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,

src/views/xq/userInfo/index.vue

@@ -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)
+      })
     }
   }
 };

src/views/xq/userInfo/update-user-filter-info-dialog.vue

@@ -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>

src/views/xq/userInfo/update-user-info-dialog.vue

@@ -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">

src/views/xq/userInfo/user-info.vue

@@ -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>