250 lines
8.3 KiB
Vue
250 lines
8.3 KiB
Vue
<template>
|
||
|
||
<JeepayBackground :bgColorStyle="{}">
|
||
|
||
<JeepayCustomNavbar textColor="#fff" bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="详情" backCtrl="back" />
|
||
|
||
<view class="sta-info">
|
||
<image class="sta-photo" :src="vdata.record.avatarUrl" mode="scaleToFill" />
|
||
<view class="info-main">
|
||
<view class="info-name">
|
||
{{ vdata.record.realname }}
|
||
<image src="/pageDevice/static/devIconImg/icon-more-white.svg" mode="scaleToFill" @tap="single.open('delete')" />
|
||
</view>
|
||
<view class="info-phone">{{ vdata.record.telphone }}</view>
|
||
</view>
|
||
</view>
|
||
|
||
<JeepayCard viewStyle="margin-top: 50rpx" editText="编辑信息" @editTap="go.to('PAGES_USER_EDIT', {sysUserId: vdata.record.sysUserId})">
|
||
<JeepayDescview>
|
||
<JeepayDescviewItem title="用户ID" :desc="vdata.record.sysUserId" />
|
||
<JeepayDescviewItem title="完整手机号" :desc="vdata.record.telphone" />
|
||
<JeepayDescviewItem title="用户登录名" :desc="vdata.record.loginUsername" />
|
||
<JeepayDescviewItem title="用户性别" >
|
||
<template #desc>
|
||
<view class="sex-info-text">
|
||
<template v-if="vdata.record.sex == 1">
|
||
<image src="/pageDevice/static/devIconImg/icon-man.svg" mode="scaleToFill" />男
|
||
</template>
|
||
<template v-else-if="vdata.record.sex == 2">
|
||
<image src="/pageDevice/static/devIconImg/icon-woman.svg" mode="scaleToFill" />女
|
||
</template>
|
||
<template v-else>
|
||
未知
|
||
</template>
|
||
</view>
|
||
</template>
|
||
</JeepayDescviewItem>
|
||
<JeepayDescviewItem title="用户编号" :desc="vdata.record.userNo" />
|
||
<JeepayDescviewItem title="用户类型" >
|
||
<template #desc>
|
||
<JeepayTag :type="datamap.userType(vdata.record.userType).type">{{ datamap.userType(vdata.record.userType).text }}</JeepayTag>
|
||
</template>
|
||
</JeepayDescviewItem>
|
||
<JeepayDescviewItem title="创建时间" :desc="vdata.record.createdAt" />
|
||
</JeepayDescview>
|
||
</JeepayCard>
|
||
|
||
|
||
<!-- 仅非超管显示 -->
|
||
<JeepayCard v-if="vdata.record.userType != 1" title="已绑定门店" viewStyle="margin-top: 40rpx">
|
||
<JeepayDescview>
|
||
<template v-for="(r) in vdata.selectedStoreList">
|
||
<JeepayDescviewItem :title="r.storeName" :desc="r.storeId" />
|
||
</template>
|
||
</JeepayDescview>
|
||
</JeepayCard>
|
||
|
||
<JeepayCard title="权限管理" viewStyle="margin-top: 40rpx">
|
||
<JeepayTableListItem v-if="ent.has('ENT_UR_USER_EDIT')" title="用户状态" subtitle="状态禁用后，用户将无法登录APP和后台管理系统">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.record.state" :showSwitchType="true" :updateStateFunc="updateStateFunc"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
|
||
<JeepayTableListItem v-if="vdata.record.userType == 11" title="门店编辑权限" subtitle="权限禁用后，该用户将不支持编辑门店信息功能">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.userRules['STORE']" :showSwitchType="true" :updateStateFunc="(state) => updateRuleFunc('STORE', state)"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
<JeepayTableListItem v-if="vdata.record.userType == 12" title="收银权限" subtitle="权限禁用后，该用户将不支持快捷收银功能">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.userRules['QUICK_PAY']" :showSwitchType="true" :updateStateFunc="(state) => updateRuleFunc('QUICK_PAY', state)"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
<JeepayTableListItem v-if="vdata.record.userType == 12" title="订单退款权限" subtitle="权限禁用后，该用户将不支持订单退款操作">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.userRules['REFUND']" :showSwitchType="true" :updateStateFunc="(state) => updateRuleFunc('REFUND', state)"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
<JeepayTableListItem v-if="vdata.record.userType == 12" title="设备管理权限" subtitle="权限禁用后，该用户将不支持门店设备管理功能">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.userRules['DEVICE']" :showSwitchType="true" :updateStateFunc="(state) => updateRuleFunc('DEVICE', state)"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
<JeepayTableListItem v-if="vdata.record.userType == 12" title="统计报表权限" subtitle="权限禁用后，该用户将不支持查看门店统计报表数据">
|
||
<template #titleRight>
|
||
<JeepayStateSwitch v-model:state="vdata.userRules['STATS']" :showSwitchType="true" :updateStateFunc="(state) => updateRuleFunc('STATS', state)"/>
|
||
</template>
|
||
</JeepayTableListItem>
|
||
|
||
</JeepayCard>
|
||
|
||
<JSinglePopup ref="single" :list="list" activeColor="#FF5B4C" />
|
||
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
|
||
</JeepayBackground>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { reactive, ref } from 'vue'
|
||
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
||
import { reqLoad, API_URL_SYS_USER_LIST, API_URL_USER_BIND_STORE_LIST, $getUserEntRoles, $updateUserEntRoles } from '@/http/apiManager.js'
|
||
import datamap from '@/commons/utils/datamap.js'
|
||
import infoBox from '@/commons/utils/infoBox.js';
|
||
import go from '@/commons/utils/go.js'
|
||
import formUtil from '@/commons/utils/formUtil.js'
|
||
import emit from '@/commons/utils/emit.js'
|
||
import ent from '@/commons/utils/ent.js'
|
||
|
||
const single = ref()
|
||
const jeepayPopupConfirmRef = ref()
|
||
|
||
const list = reactive([
|
||
{ label: '删除用户', value: 'delete', fun: confirmFunc},
|
||
])
|
||
|
||
onLoad((options) => {
|
||
refData(options.sysUserId)
|
||
})
|
||
|
||
const vdata = reactive({
|
||
record : { },
|
||
selectedStoreList: [],
|
||
|
||
// 用户权限集合
|
||
userRules: {
|
||
"STORE": 0, "QUICK_PAY": 0, "REFUND": 0, "DEVICE": 0, "STATS": 0,
|
||
},
|
||
})
|
||
|
||
// 监听 更新事件
|
||
onUnload(() => uni.$off(emit.ENAME_REF_SYS_USER_DETAIL))
|
||
uni.$on(emit.ENAME_REF_SYS_USER_DETAIL, function(data){
|
||
refData(vdata.record.sysUserId)
|
||
})
|
||
|
||
function refData(sysUserId){
|
||
reqLoad.getById(API_URL_SYS_USER_LIST, sysUserId).then(({bizData}) => {
|
||
vdata.record = bizData
|
||
|
||
vdata.selectedStoreList = []
|
||
|
||
// 店长 or 店员。 查询权限
|
||
if(bizData.userType == 11 || bizData.userType == 12){
|
||
|
||
// 查询已绑定门店
|
||
reqLoad.list(API_URL_USER_BIND_STORE_LIST, {sysUserId: sysUserId, pageSize: -1}).then((storeRes) => {
|
||
vdata.selectedStoreList = storeRes.bizData.records
|
||
})
|
||
|
||
|
||
$getUserEntRoles(sysUserId).then(roleRes => {
|
||
let roleBizData = roleRes.bizData;
|
||
if(roleBizData && roleBizData.rules){
|
||
let ruleList = JSON.parse(roleBizData.rules)
|
||
Object.keys(vdata.userRules).forEach(k => {
|
||
vdata.userRules[k] = ruleList.indexOf(k) >= 0 ? 1: 0
|
||
})
|
||
}
|
||
})
|
||
}
|
||
})
|
||
}
|
||
|
||
function updateStateFunc(state){
|
||
return reqLoad.updateById(API_URL_SYS_USER_LIST, vdata.record.sysUserId, { state: state }).then(() => {
|
||
emit.pageEmit(emit.ENAME_REF_SYS_USER_LIST)
|
||
infoBox.showSuccessToast("修改成功");
|
||
})
|
||
}
|
||
|
||
// 修改用户权限。
|
||
function updateRuleFunc(ruleName, state){
|
||
return $updateUserEntRoles(vdata.record.sysUserId, ruleName, state).then(() => {
|
||
infoBox.showSuccessToast("修改成功",{mask:false});
|
||
})
|
||
}
|
||
|
||
function confirmFunc() {
|
||
jeepayPopupConfirmRef.value.open('确定删除用户？').then(() => {
|
||
deleteFunc()
|
||
}).catch(() => {
|
||
single.value.open('delete')
|
||
})
|
||
}
|
||
|
||
function deleteFunc(){
|
||
return reqLoad.delById(API_URL_SYS_USER_LIST, vdata.record.sysUserId).then(() => {
|
||
infoBox.showSuccessToast("删除成功");
|
||
go.back(1, emit.ENAME_REF_SYS_USER_LIST) // 返回页面 && 更新
|
||
})
|
||
}
|
||
|
||
</script>
|
||
|
||
|
||
<style lang="scss" scoped>
|
||
|
||
.sex-info-text {
|
||
image {
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
}
|
||
|
||
.sta-info {
|
||
display: flex;
|
||
margin-top: 50rpx;
|
||
padding: 0 50rpx;
|
||
.sta-photo {
|
||
width: 120rpx;
|
||
height: 120rpx;
|
||
border-radius: 50%;
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.info-main {
|
||
flex: 1;
|
||
margin-left: 30rpx;
|
||
color: #fff;
|
||
.info-name {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
font-size: 33rpx;
|
||
font-weight: 400;
|
||
image {
|
||
width: 70rpx;
|
||
height: 70rpx;
|
||
}
|
||
}
|
||
.info-phone {
|
||
margin-top: 16rpx;
|
||
color: rgba(251, 252, 253, 0.7);
|
||
font-size: 25rpx;
|
||
font-weight: 400;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
</style>
|