init

src/constant/statusMap.js

@@ -68,6 +68,12 @@ export const memberTypeList = [
   { value: 1, label: '超级会员' ,listClass: listClass.danger},
 ]
 
+export const memberStatusList = [
+  { value: 0, label: '可用' ,listClass: listClass.info},
+  { value: 1, label: '过期' ,listClass: listClass.warning},
+  { value: 1, label: '不可用' ,listClass: listClass.danger},
+]
+
 export const yesOrNoList = [
   { value: 1, label: '是',listClass: listClass.danger},
   { value: 0, label: '否',listClass: listClass.info},
@@ -88,11 +94,39 @@ export const userRiskLowList = [
   { value: 2, label: '高风险',listClass: listClass.danger},
 ]
 
+export const videoStatusList = [
+  { value: 0, label: '休息中',listClass: listClass.info},
+  { value: 1, label: '视频中',listClass: listClass.danger},
+]
+
+export const onlineStatusList = [
+  { value: 0, label: '离线',listClass: listClass.info},
+  { value: 1, label: '在线',listClass: listClass.danger},
+]
+
 export const anchorApplyStatus = [
   { value: 1, label: '审核中',listClass: listClass.info},
   { value: 2, label: '审核不通过',listClass: listClass.danger},
   { value: 3, label: '审核通过',listClass: listClass.primary},
 ]
 
+/**
+ * 开启视频接听
+ */
+export const openVideoStatusList = [
+  { value: 0, label: '未开启',listClass: listClass.danger},
+  { value: 1, label: '已开启',listClass: listClass.info},
+]
+
+export const orderSwitchList = [
+  { value: 1, label: '隐藏',listClass: listClass.warning},
+  { value: 2, label: '不隐藏',listClass: listClass.info},
+]
+
+export const indexDisplayList = [
+  { value: 0, label: '不展示',listClass: listClass.warning},
+  { value: 1, label: '展示',listClass: listClass.info},
+]
+
 
 

src/views/cai/user/index.vue

@@ -112,7 +112,7 @@
               size="mini"
               type="text"
               icon="el-icon-info"
-              @click="handleDelete(scope.row)"
+              @click="handleInfo(scope.row)"
           >详情</el-button>
           <el-button
             size="mini"
@@ -142,22 +142,24 @@
     />
 
     <user-add-update-dialog v-if="userAddUpdateDialogVisible" ref="userAddUpdateDialog" @refreshDataList="getList" />
+    <user-info-dialog v-if="userInfoDialogVisible" ref="userInfoDialog" @refreshDataList="getList" />
   </div>
 </template>
 
 <script>
 import { delUser, listUser } from '@/api/cai/user'
-import { authList, genderList, userStatusList, isAnchorList } from '@/constant/statusMap'
+import {authList, genderList, userStatusList, isAnchorList, videoStatusList} from '@/constant/statusMap'
 import UserAddUpdateDialog from '@/views/cai/user/user-add-update-dialog.vue'
+import UserInfoDialog from "@/views/cai/user/user-info-dialog";
 
 export default {
   name: "User",
   components:{
-    UserAddUpdateDialog
+    UserAddUpdateDialog,UserInfoDialog
   },
   data() {
     return {
-      genderList,authList,userStatusList,isAnchorList,
+      genderList,authList,userStatusList,isAnchorList,videoStatusList,
       // 遮罩层
       loading: true,
       // 选中数组
@@ -182,7 +184,8 @@ export default {
         gender: undefined,
         city: undefined,
       },
-      userAddUpdateDialogVisible: false
+      userAddUpdateDialogVisible: false,
+      userInfoDialogVisible: false
     };
   },
   created() {
@@ -221,6 +224,13 @@ export default {
         this.$refs.userAddUpdateDialog.init(id)
       })
     },
+    handleInfo(row){
+      this.userInfoDialogVisible = true
+      this.$nextTick(() => {
+        const id = row.id || this.ids
+        this.$refs.userInfoDialog.init(id)
+      })
+    },
     /** 删除按钮操作 */
     handleDelete(row) {
       const ids = row.id || this.ids;

src/views/cai/user/user-info-dialog.vue

@@ -0,0 +1,288 @@
+<template>
+  <el-dialog title="技师信息" :close-on-click-modal="false" :visible.sync="open" width="1200px" append-to-body>
+    <el-collapse v-model="activeName" >
+      <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">
+            {{info.user.id}}
+          </el-descriptions-item>
+          <el-descriptions-item label="蜜瓜号">
+            {{info.user.usercode}}
+          </el-descriptions-item>
+          <el-descriptions-item label="手机号">
+            {{info.user.mobile}}
+          </el-descriptions-item>
+          <el-descriptions-item label="头像">
+            <image-preview :src="info.user.avatar" />
+          </el-descriptions-item>
+          <el-descriptions-item label="性别">
+            <cai-dict-tag :options="genderList" :value="info.user.gender" />
+          </el-descriptions-item>
+          <el-descriptions-item label="年龄">
+            {{info.user.age}}
+          </el-descriptions-item>
+          <el-descriptions-item label="生日">
+            {{info.user.birthday}}
+          </el-descriptions-item>
+          <el-descriptions-item label="城市">
+            {{info.user.city}}
+          </el-descriptions-item>
+          <el-descriptions-item label="主播">
+            <cai-dict-tag :options="isAnchorList" :value="info.user.isAnchor" />
+          </el-descriptions-item>
+          <el-descriptions-item label="相册" :span="3" v-if="info.userAlbums">
+            <span v-for='val in info.userAlbums'>
+              <image-preview :src="val.url" height="45px" width="45px"  /> &nbsp;&nbsp;
+            </span>
+          </el-descriptions-item>
+          <el-descriptions-item label="资料完成">
+            <cai-dict-tag :options="authList" :value="info.user.finishStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="相册完成度">
+            <cai-dict-tag :options="authList" :value="info.user.photoStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="自拍认证">
+            <cai-dict-tag :options="authList" :value="info.user.cameraStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="是否同意协议">
+            <cai-dict-tag :options="authList" :value="info.user.agreeProtocol" />
+          </el-descriptions-item>
+          <el-descriptions-item label="视频状态">
+            <cai-dict-tag :options="videoStatusList" :value="info.user.videoStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="状态">
+            <cai-dict-tag :options="userStatusList" :value="info.user.status" />
+          </el-descriptions-item>
+          <el-descriptions-item label="工会">
+            <cai-dict-tag :options="isAnchorList" :value="info.user.isUnion" />
+          </el-descriptions-item>
+          <el-descriptions-item label="视频提成">
+            {{info.userInfo.videoIncomeRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="守护提成">
+            {{info.userInfo.guardIncomeRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="礼物提成">
+            {{info.userInfo.giftIncomeRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="充值提成">
+            {{info.userInfo.payIncomeRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="最后登录IP">
+            {{info.userInfo.lastLoginIp}}
+          </el-descriptions-item>
+          <el-descriptions-item label="最后登录时间">
+            {{info.userInfo.lastLoginTime}}
+          </el-descriptions-item>
+          <el-descriptions-item label="最后登录位置">
+            {{info.userInfo.lastLocation}}
+          </el-descriptions-item>
+          <el-descriptions-item label="注册IP">
+            {{info.userInfo.regIp}}
+          </el-descriptions-item>
+          <el-descriptions-item label="注册时间">
+            {{info.userInfo.regTime}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="钱包" name="account">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="2" size="medium" border>
+          <el-descriptions-item label="余额">
+            {{info.account.coin}}
+          </el-descriptions-item>
+          <el-descriptions-item label="收益">
+            {{info.account.incomeCoin}}
+          </el-descriptions-item>
+          <el-descriptions-item label="充值总额">
+            {{info.account.totalBuyMoney}}
+          </el-descriptions-item>
+          <el-descriptions-item label="充值总币">
+            {{info.account.totalBuyCoin}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="会员" name="userMember" v-if="info.userMember">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="3" size="medium" border>
+          <el-descriptions-item label="类型">
+            <cai-dict-tag :options="memberTypeList" :value="info.userMember.memberType" />
+          </el-descriptions-item>
+          <el-descriptions-item label="过期时间">
+            {{info.userMember.expireDate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="会员状态">
+            <cai-dict-tag :options="memberStatusList" :value="info.userMember.status" />
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="主播" name="anchor" v-if="info.anchor">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="3" size="medium" border>
+          <el-descriptions-item label="价格">
+            {{info.anchor.price}}
+          </el-descriptions-item>
+          <el-descriptions-item label="开启视频接听">
+            <cai-dict-tag :options="openVideoStatusList" :value="info.anchor.openVideoStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="视频状态">
+            <cai-dict-tag :options="videoStatusList" :value="info.anchor.videoStatus" />
+          </el-descriptions-item>
+          <el-descriptions-item label="隐藏接单">
+            <cai-dict-tag :options="orderSwitchList" :value="info.anchor.orderSwitch" />
+          </el-descriptions-item>
+          <el-descriptions-item label="首页展示">
+            <cai-dict-tag :options="indexDisplayList" :value="info.anchor.indexDisplay" />
+          </el-descriptions-item>
+          <el-descriptions-item label="用户评分">
+            {{info.anchor.giveScore}}
+          </el-descriptions-item>
+          <el-descriptions-item label="服务总次数">
+            {{info.anchor.serviceCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="服务总时长">
+            {{info.anchor.serviceTime}}
+          </el-descriptions-item>
+          <el-descriptions-item label="视频分成比例">
+            {{info.anchor.videoRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="守护分成比例">
+            {{info.anchor.guardRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="礼物分成比列">
+            {{info.anchor.giftRate}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="在线状态" name="userOnline" v-if="info.userOnline">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="2" size="medium" border>
+          <el-descriptions-item label="在线状态">
+            <cai-dict-tag :options="onlineStatusList" :value="info.userOnline.status" />
+          </el-descriptions-item>
+          <el-descriptions-item label="最后在线时间">
+            {{info.userOnline.lastLiveTime}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="会长" name="union" v-if="info.union">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="3" size="medium" border>
+          <el-descriptions-item label="工会名称">
+            {{info.union.name}}
+          </el-descriptions-item>
+          <el-descriptions-item label="是否开启提成">
+            <cai-dict-tag :options="booleanList" :value="info.union.enableRate" />
+          </el-descriptions-item>
+          <el-descriptions-item label="默认提成">
+            {{info.union.defaultIncomeRate}}
+          </el-descriptions-item>
+          <el-descriptions-item label="全部人数">
+            {{info.union.allNum}}
+          </el-descriptions-item>
+          <el-descriptions-item label="分成的人数">
+            {{info.union.inDivideNum}}
+          </el-descriptions-item>
+          <el-descriptions-item label="不分成人数">
+            {{info.union.notDivideNum}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+      <el-collapse-item title="统计" name="userCount" v-if="info.userCount">
+        <el-descriptions :contentStyle="CS" :label-style="LS" class="margin-top" :column="3" size="medium" border>
+          <el-descriptions-item label="粉丝总数">
+            {{info.userCount.fansCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="关注数">
+            {{info.userCount.followCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="足迹数">
+            {{info.userCount.footCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="访客数">
+            {{info.userCount.visitorCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="相册数量">
+            {{info.userCount.photoCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="发帖数量">
+            {{info.userCount.dynamicCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="收到的礼物数量">
+            {{info.userCount.receiveGiftCount}}
+          </el-descriptions-item>
+          <el-descriptions-item label="送礼总数量">
+            {{info.userCount.giveGiftCount}}
+          </el-descriptions-item>
+        </el-descriptions>
+      </el-collapse-item>
+    </el-collapse>
+  </el-dialog>
+</template>
+
+<script>
+import {getUser} from "@/api/cai/user";
+import {
+  authList,
+  genderList,
+  userStatusList,
+  isAnchorList,
+  videoStatusList,
+  onlineStatusList,
+  memberTypeList,
+  memberStatusList,
+  openVideoStatusList,
+  orderSwitchList,
+  indexDisplayList,
+  booleanList
+} from '@/constant/statusMap'
+
+export default {
+  name: "UserInfo",
+  data() {
+    return {
+      genderList,userStatusList,isAnchorList,authList,videoStatusList,onlineStatusList,memberTypeList,
+      memberStatusList,openVideoStatusList,orderSwitchList,indexDisplayList,booleanList,
+      activeName:['base','account','userAlbums'],
+      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;
+      getUser(this.userId).then(response => {
+        this.info = response.data;
+      });
+    },
+  }
+};
+</script>
+<style lang="scss" scoped>
+.el-row {
+  margin-bottom: -15px;
+  display: flex;
+  flex-wrap: wrap
+}
+
+/* .el-card {
+   min-width: 100%;
+   height: 80%;  // 高度要设置百分比才可以
+   margin-right: 20px;
+   transition: all .5s;
+ }*/
+</style>