|
@@ -1,132 +1,155 @@
|
|
|
<template>
|
|
|
- <a-card :bordered="false" class="orderDetail-goods-info">
|
|
|
- <a-row :gutter="48">
|
|
|
- <a-col :span="24" class="item-cont item-img">
|
|
|
- <p class="item-label" style="line-height: 37px;">头像:</p>
|
|
|
- <img v-if="page.headImageUrl" :src="page.headImageUrl" alt="" class="img">
|
|
|
- <p class="item-main" style="line-height: 37px;" v-else>--</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">手机号码:</p>
|
|
|
- <p class="item-main">{{ page.mobile ? page.mobile : '--' }}</p>
|
|
|
- <a-icon type="edit" title="修改手机号码" style="font-size: 20px;color: #1890FF;padding: 0 10px;" @click="editPhone(page)"
|
|
|
- v-hasPermission="'B_user_userdetails_editPhone'" />
|
|
|
- <!-- <a style="margin-left: 100px; color: #2D8CF0;" @click="editPhone">修改手机号码</a> -->
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">收货地址:</p>
|
|
|
- <p class="item-main">{{ adderss ? adderss : '--' }}</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">乐豆余额:</p>
|
|
|
- <p class="item-main">{{ page.currentGold ? page.currentGold : 0 }}</p>
|
|
|
- <a-icon type="edit" title="修改乐豆余额" style="font-size: 20px;color: #1890FF;padding: 0 10px;" @click="editLd(page)"
|
|
|
- v-hasPermission="'B_user_userDetails_editLdNum'" />
|
|
|
- <!-- <a style="margin-left: 145px; color: #2D8CF0;" @click="editLd(page)">修改乐豆余额</a> -->
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">累计乐豆:</p>
|
|
|
- <p class="item-main">{{ page.totalGold ? page.totalGold :0 }}</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">账户状态:</p>
|
|
|
- <p class="item-main">{{ page.state ==0 ? '禁用' : '启用' }}</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">注册时间:</p>
|
|
|
- <p class="item-main">{{ page.registerTime ? page.registerTime : '--' }}</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">最后登录时间:</p>
|
|
|
- <p class="item-main">{{ page.lastLoginTime ? page.lastLoginTime : '--' }}</p>
|
|
|
- </a-col>
|
|
|
- <a-col :span="24" class="item-cont">
|
|
|
- <p class="item-label">最后投递时间:</p>
|
|
|
- <p class="item-main">{{ page.lastDeliveryTime ? page.lastDeliveryTime : '--' }}</p>
|
|
|
- </a-col>
|
|
|
- </a-row>
|
|
|
- <div class="page-header" style="margin-top: 50px; color: #2D8CF0; text-align: center;">
|
|
|
- <a @click="goBack">返回列表</a>
|
|
|
- </div>
|
|
|
- <!-- 修改用户手机号码弹窗 -->
|
|
|
- <edit-user-phone-modal :userId="userId" :openUserPhoneMoadl="openUserPhoneMoadl" @close="openUserPhoneMoadl=false"></edit-user-phone-modal>
|
|
|
- <!-- 修改乐豆余额弹窗 -->
|
|
|
- <edit-ldNum-modal :customerNo="customerNo" :openLdNumModal="openLdNumModal" @close="openLdNumModal=false"></edit-ldNum-modal>
|
|
|
- </a-card>
|
|
|
+ <a-card :bordered="false" class="userDetails-page-info">
|
|
|
+ <a-row :gutter="48">
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label" style="line-height: 37px;">头像:</p>
|
|
|
+ <img v-if="page.headImageUrl" :src="page.headImageUrl" alt="" class="img">
|
|
|
+ <p class="item-main" style="line-height: 37px;" v-else>--</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">手机号码:</p>
|
|
|
+ <p class="item-main">{{ page.mobile ? page.mobile : '--' }}</p>
|
|
|
+ <a-icon
|
|
|
+ type="edit"
|
|
|
+ title="修改手机号码"
|
|
|
+ style="font-size: 20px;color: #1890FF;padding: 0 10px;"
|
|
|
+ @click="editPhone(page)"
|
|
|
+ v-hasPermission="'B_user_userdetails_editPhone'" />
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">用户身份:</p>
|
|
|
+ <p class="item-main">{{ page.mobile ? page.mobile : '--' }}</p>
|
|
|
+ <a-icon
|
|
|
+ type="edit"
|
|
|
+ title="修改用户身份"
|
|
|
+ style="font-size: 20px;color: #1890FF;padding: 0 10px;"
|
|
|
+ @click="editUseridentity(page)"
|
|
|
+ v-hasPermission="'B_user_userdetails_editPhone'" />
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">收货地址:</p>
|
|
|
+ <p class="item-main">{{ adderss ? adderss : '--' }}</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">乐豆余额:</p>
|
|
|
+ <p class="item-main">{{ page.currentGold ? page.currentGold : 0 }}</p>
|
|
|
+ <a-icon
|
|
|
+ type="edit"
|
|
|
+ title="修改乐豆余额"
|
|
|
+ style="font-size: 20px;color: #1890FF;padding: 0 10px;"
|
|
|
+ @click="editLd(page)"
|
|
|
+ v-hasPermission="'B_user_userDetails_editLdNum'" />
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">累计乐豆:</p>
|
|
|
+ <p class="item-main">{{ page.totalGold ? page.totalGold :0 }}</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">账户状态:</p>
|
|
|
+ <p class="item-main">{{ page.state ==0 ? '禁用' : '启用' }}</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">注册时间:</p>
|
|
|
+ <p class="item-main">{{ page.registerTime ? page.registerTime : '--' }}</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">最后登录时间:</p>
|
|
|
+ <p class="item-main">{{ page.lastLoginTime ? page.lastLoginTime : '--' }}</p>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="24" class="item-cont">
|
|
|
+ <p class="item-label">最后投递时间:</p>
|
|
|
+ <p class="item-main">{{ page.lastDeliveryTime ? page.lastDeliveryTime : '--' }}</p>
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <div class="page-header" style="margin-top: 50px; color: #2D8CF0; text-align: center;">
|
|
|
+ <a @click="goBack">返回列表</a>
|
|
|
+ </div>
|
|
|
+ <!-- 修改用户手机号码弹窗 -->
|
|
|
+ <edit-user-phone-modal :userId="userId" :openUserPhoneMoadl="openUserPhoneMoadl" @close="openUserPhoneMoadl=false"></edit-user-phone-modal>
|
|
|
+ <!-- 修改乐豆余额弹窗 -->
|
|
|
+ <edit-ldNum-modal :customerNo="customerNo" :openLdNumModal="openLdNumModal" @close="openLdNumModal=false"></edit-ldNum-modal>
|
|
|
+ <!-- 修改用户身份 -->
|
|
|
+ <edit-useridentity-modal :openUseridentityMoadl="openUseridentityMoadl" @close="openUseridentityMoadl=false"></edit-useridentity-modal>
|
|
|
+ </a-card>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import editUserPhoneModal from './editUserPhoneModal.vue'
|
|
|
- import editLdNumModal from './editLdNumModal.vue'
|
|
|
- import {
|
|
|
- customerDetails
|
|
|
- } from '@/api/userInfo.js'
|
|
|
- export default {
|
|
|
- name: 'UserDetails',
|
|
|
- components: {
|
|
|
- editUserPhoneModal,
|
|
|
- editLdNumModal
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- userId: '', // 用户id
|
|
|
- openUserPhoneMoadl: false, // 默认关闭手机号码弹窗
|
|
|
- customerNo: '', // 用户编号
|
|
|
- openLdNumModal: false, // 默认关闭乐豆余额弹窗
|
|
|
- page: {}, // 详情数据
|
|
|
- adderss: ""
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 详情
|
|
|
- editPhone(page) {
|
|
|
- this.userId = this.page.id
|
|
|
- this.openUserPhoneMoadl = true
|
|
|
- console.log(this.userId, '-----------修改手机号码')
|
|
|
- },
|
|
|
- editLd(page) {
|
|
|
- this.customerNo = this.page.customerNo
|
|
|
- console.log(this.customerNo, '------用户编号')
|
|
|
- this.openLdNumModal = true
|
|
|
- console.log('-----修改乐豆余额')
|
|
|
- },
|
|
|
- // 返回列表
|
|
|
- goBack() {
|
|
|
- this.$router.push({
|
|
|
- path: `/userInfo/userManageList/list`
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- beforeRouteEnter(to, from, next) {
|
|
|
- next(vm => {
|
|
|
- console.log(111)
|
|
|
- const params = vm.$route.params
|
|
|
- console.log(params)
|
|
|
- if (params.id) {
|
|
|
- customerDetails({
|
|
|
- id: params.id
|
|
|
- }).then(res => {
|
|
|
- if (res.status == 200) {
|
|
|
- vm.page = res.data
|
|
|
- if (vm.page.receiveAddressList) {
|
|
|
- vm.adderss = vm.page.receiveAddressList[0].receiveAreasName.replace(/\,/g, '-') + '-' + vm.page.receiveAddressList[
|
|
|
- 0].receiveAddress
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
+import editUserPhoneModal from './editUserPhoneModal.vue'
|
|
|
+import editLdNumModal from './editLdNumModal.vue'
|
|
|
+import editUseridentityModal from './editUseridentityModal.vue'
|
|
|
+import {
|
|
|
+ customerDetails
|
|
|
+} from '@/api/userInfo.js'
|
|
|
+export default {
|
|
|
+ name: 'UserDetails',
|
|
|
+ components: {
|
|
|
+ editUserPhoneModal,
|
|
|
+ editLdNumModal,
|
|
|
+ editUseridentityModal
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ userId: '', // 用户id
|
|
|
+ openUserPhoneMoadl: false, // 默认关闭手机号码弹窗
|
|
|
+ customerNo: '', // 用户编号
|
|
|
+ openLdNumModal: false, // 默认关闭乐豆余额弹窗
|
|
|
+ openUseridentityMoadl: false, // 默认关闭用户身份弹窗
|
|
|
+ page: {}, // 详情数据
|
|
|
+ adderss: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 修改手机号码
|
|
|
+ editPhone (page) {
|
|
|
+ this.userId = this.page.id
|
|
|
+ this.openUserPhoneMoadl = true
|
|
|
+ },
|
|
|
+ // 修改乐豆余额
|
|
|
+ editLd (page) {
|
|
|
+ this.customerNo = this.page.customerNo
|
|
|
+ this.openLdNumModal = true
|
|
|
+ },
|
|
|
+ // 修改用户身份
|
|
|
+ editUseridentity (page) {
|
|
|
+ this.openUseridentityMoadl = true
|
|
|
+ },
|
|
|
+ // 返回列表
|
|
|
+ goBack () {
|
|
|
+ this.$router.push({
|
|
|
+ path: `/userInfo/userManageList/list`
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beforeRouteEnter (to, from, next) {
|
|
|
+ next(vm => {
|
|
|
+ const params = vm.$route.params
|
|
|
+ if (params.id) {
|
|
|
+ customerDetails({
|
|
|
+ id: params.id
|
|
|
+ }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ vm.page = res.data
|
|
|
+ if (vm.page.receiveAddressList) {
|
|
|
+ vm.adderss = vm.page.receiveAddressList[0].receiveAreasName.replace(/\,/g, '-') + '-' + vm.page.receiveAddressList[
|
|
|
+ 0].receiveAddress
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
- .item-cont {
|
|
|
- display: flex;
|
|
|
- margin: 10px 10px 10px 50px;
|
|
|
+ .userDetails-page-info{
|
|
|
+ .item-cont {
|
|
|
+ display: flex;
|
|
|
+ margin: 10px 10px 10px 50px;
|
|
|
+ }
|
|
|
+ .img {
|
|
|
+ width: 50px;
|
|
|
+ border-radius: 50%;
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- .img {
|
|
|
- width: 50px;
|
|
|
- border-radius: 50%;
|
|
|
- }
|
|
|
</style>
|