<template>
|
<view>
|
<u-empty mode="data"
|
icon="http://cdn.uviewui.com/uview/empty/data.png"
|
textSize="30"
|
iconSize="1000"
|
v-if="userList.length == 0"
|
text="暂无数据"></u-empty>
|
<u-list @scrolltolower="scrolltolower">
|
<u-list-item v-for="(item, index) in userList"
|
:key="index">
|
<u-cell size="large"
|
center
|
:label="item.deptNames">
|
<view slot="title"
|
class="u-slot-title">
|
<text class="u-cell-text">{{ item.name }}</text>
|
</view>
|
<view slot="value"
|
class="u-slot-value">
|
<u-tag text="查看"
|
type="primary"
|
plain
|
size="mini"
|
icon="eye"
|
@click="viewInfo(item)"></u-tag>
|
<u-tag text="编辑"
|
type="primary"
|
plain
|
size="mini"
|
icon="edit-pen"
|
@click="editInfo(item)"></u-tag>
|
<u-tag text="删除"
|
type="warning"
|
plain
|
size="mini"
|
icon="trash"
|
@click="deleteInfo(item)"></u-tag>
|
</view>
|
</u-cell>
|
</u-list-item>
|
</u-list>
|
<u-popup :show="infoShow"
|
mode="center"
|
:round="10"
|
:closeable="true"
|
@close="close">
|
<view class="info-main">
|
<!-- <view class="info-block">
|
<view class="info-block_label">身份证</view>
|
<view class="info-block_value">{{ userInfo.idCard }}</view>
|
</view> -->
|
<view class="info-block">
|
<view class="info-block_label">真实姓名</view>
|
<view class="info-block_value">{{ userInfo.name }}</view>
|
</view>
|
<view class="info-block">
|
<view class="info-block_label">手机号</view>
|
<view class="info-block_value">{{ userInfo.phone }}</view>
|
</view>
|
</view>
|
</u-popup>
|
<view class="add-icon"
|
@click.stop="addUser"><u-icon name="plus"
|
color="#fff"
|
size="40"></u-icon></view>
|
<u-modal :show="deleteShow"
|
title="删除"
|
content="确认删除?"
|
@confirm="deleteConfirm"
|
@cancel="deleteCancel"
|
:showCancelButton="true"></u-modal>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
userList: [],
|
infoShow: false,
|
userInfo: {},
|
deleteShow: false,
|
userId: ''
|
};
|
},
|
onShow() {
|
this.getappUserPage();
|
},
|
methods: {
|
close() {
|
this.infoShow = false;
|
},
|
getappUserPage() {
|
uni.showLoading({
|
title: '加载中'
|
});
|
this.$reqGet('appUserPage').then(res => {
|
this.userList = res.data.records;
|
uni.hideLoading();
|
});
|
},
|
scrolltolower() {},
|
// 查看信息
|
viewInfo(v) {
|
uni.showLoading({
|
title: '加载中'
|
});
|
this.$reqGet('getAppById', { userId: v.userId.toString() }).then(res => {
|
if (res.code == 0) {
|
uni.hideLoading();
|
this.userInfo = res.data;
|
this.infoShow = true;
|
} else {
|
this.$u.toast('加载失败');
|
}
|
});
|
},
|
// 编辑信息
|
editInfo(v) {
|
uni.navigateTo({
|
url: `/pages/customer-page/customer-my/userMange/userManageEdit/userManageEdit?userId=${v.userId}`
|
});
|
},
|
// 删除信息
|
deleteInfo(v) {
|
this.userId = v.userId.toString();
|
this.deleteShow = true;
|
},
|
deleteConfirm() {
|
uni.showLoading({
|
title: '加载中'
|
});
|
this.$reqPost('appRemoveById', { userId: this.userId }, 'params')
|
.then(res => {
|
if (res.code === 0) {
|
uni.hideLoading();
|
this.$u.toast('删除成功');
|
this.deleteShow = false;
|
} else {
|
uni.hideLoading();
|
this.$u.toast('删除失败');
|
this.deleteShow = false;
|
}
|
})
|
.then(() => {
|
this.getappUserPage();
|
});
|
},
|
deleteCancel() {
|
this.deleteShow = false;
|
},
|
// 点击添加按钮
|
addUser() {
|
uni.navigateTo({
|
url: '/pages/customer-page/customer-my/userMange/userManageEdit/userManageEdit'
|
});
|
}
|
}
|
};
|
</script>
|
|
<style lang="scss"
|
scoped>
|
@mixin flex {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
}
|
|
/deep/ .u-slot-value {
|
width: 150px;
|
height: 60px;
|
@include flex;
|
}
|
|
.info-main {
|
width: 690rpx;
|
height: 300rpx;
|
@include flex;
|
flex-direction: column;
|
padding: vww(10);
|
box-shadow: 0rpx 0rpx 14rpx 0rpx rgba(73, 120, 240, 0.14), 0rpx 7rpx 45rpx 0rpx rgba(73, 120, 240, 0.12);
|
|
.info-block {
|
width: 94%;
|
height: 120rpx;
|
@include flex;
|
border-bottom: 1px solid #d6d6d6;
|
|
&_label {
|
line-height: 28rpx;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #303030;
|
}
|
|
&_value {
|
line-height: 28rpx;
|
font-size: 28rpx;
|
font-weight: 300;
|
color: #303030;
|
}
|
}
|
}
|
|
.add-icon {
|
position: fixed;
|
bottom: vww(60);
|
right: vww(20);
|
width: 89rpx;
|
height: 89rpx;
|
border-radius: 50%;
|
background: #035cfb;
|
@include flex;
|
justify-content: center;
|
}
|
</style>
|
