<template>
|
<view>
|
<u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" textSize="30" iconSize="1000" v-if="userList.length == 0"></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.deptNames }}</view>
|
</view>
|
<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: 600rpx;
|
@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>
|