285 lines
8.1 KiB
Vue
285 lines
8.1 KiB
Vue
|
<template>
|
|||
|
|
<page-meta>
|
|||
|
|
<navigation-bar :title="$tt('share.userDetail')" title-align="center" background-color="#007AFF" />
|
|||
|
|
</page-meta>
|
|||
|
|
<view class="device-share-detail-wrap">
|
|||
|
|
<view class="user-info-wrap">
|
|||
|
|
<view class="title-wrap">
|
|||
|
|
<u--text bold size="15" prefixIcon="account-fill" iconStyle="font-size: 40rpx; margin-right: 10rpx;"
|
|||
|
|
:text="$tt('share.userMsg')"></u--text>
|
|||
|
|
</view>
|
|||
|
|
<view class="container-wrap">
|
|||
|
|
<u--text :text="$tt('share.userId')+form.userId" lineHeight="28"></u--text>
|
|||
|
|
<u--text :text="$tt('share.userName')+form.userName" lineHeight="28"></u--text>
|
|||
|
|
<u--text :text="$tt('share.phoneNumber')+form.phonenumber" lineHeight="28"></u--text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="permission-wrap">
|
|||
|
|
<view class="title-wrap">
|
|||
|
|
<u--text bold size="15" prefixIcon="integral-fill" iconStyle="font-size: 40rpx; margin-right: 10rpx;"
|
|||
|
|
:text="$tt('share.userPermissions')"></u--text>
|
|||
|
|
</view>
|
|||
|
|
<view class="container-wrap">
|
|||
|
|
<u-checkbox-group placement="column" @change="checkboxChange">
|
|||
|
|
<view class="checkbox-item-wrap" v-for="(item, index) in permissionList">
|
|||
|
|
<u-checkbox :customStyle="{marginBottom: '26rpx'}" :key="index"
|
|||
|
|
:label="`${item.modelName} (${item.identifier})`" :name="item.modelName"
|
|||
|
|
:checked="item.checked">
|
|||
|
|
</u-checkbox>
|
|||
|
|
<u--text type="info" :text="item.remark ? item.remark: $tt('share.notRemark')" size="14"
|
|||
|
|
margin="-20rpx 0rpx 20rpx 48rpx"></u--text>
|
|||
|
|
</view>
|
|||
|
|
</u-checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="remark-wrap">
|
|||
|
|
<view class="title-wrap">
|
|||
|
|
<u--text bold size="15" prefixIcon="file-text-fill" iconStyle="font-size: 40rpx; margin-right: 10rpx;"
|
|||
|
|
:text="$tt('share.remark')"></u--text>
|
|||
|
|
</view>
|
|||
|
|
<view class="container-wrap">
|
|||
|
|
<u--textarea v-model="form.remark" :placeholder="$tt('deviceDetail.inputMsg')" border="bottom" confirmType="done"></u--textarea>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="btn-wrap">
|
|||
|
|
<u-button v-if="type === 1" type="success" customStyle="margin: 20rpx; padding: 30rpx;" @tap="handleAddUser"
|
|||
|
|
size="small">{{$tt('share.confirmShare')}}</u-button>
|
|||
|
|
<u-button v-if="type === 2" type="error" @tap="handleDeleteUser" size="small"
|
|||
|
|
customStyle="margin: 20rpx; padding: 30rpx;">{{$tt('common.delete')}}</u-button>
|
|||
|
|
<u-button v-if="type === 2" type="primary" @tap="handleEditUser" size="small"
|
|||
|
|
customStyle="margin: 20rpx; padding: 30rpx;">{{$tt('common.save')}}</u-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
import { addDeviceUser, updateDeviceUser, delDeviceUser } from '@/apis/modules/deviceUser';
|
|||
|
|
import { getModelPermList } from "@/apis/modules/model";
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data () {
|
|||
|
|
return {
|
|||
|
|
type: 1, // 类型: 1=新增，2=更新
|
|||
|
|
permissionList: [], // 权限列表
|
|||
|
|
selectPerms: [], // 选中的权限列表
|
|||
|
|
// 表单参数
|
|||
|
|
form: {
|
|||
|
|
deviceId: null,
|
|||
|
|
userId: null,
|
|||
|
|
deviceName: null,
|
|||
|
|
userName: null,
|
|||
|
|
perms: null,
|
|||
|
|
phonenumber: null,
|
|||
|
|
remark: null
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
onLoad (option) {
|
|||
|
|
this.form.phonenumber = option.phonenumber;
|
|||
|
|
this.form.remark = option.remark;
|
|||
|
|
this.form.userId = option.userId;
|
|||
|
|
this.form.userName = option.userName;
|
|||
|
|
this.form.deviceId = option.deviceId;
|
|||
|
|
this.form.deviceName = option.deviceName;
|
|||
|
|
this.form.productId = option.productId;
|
|||
|
|
this.form.perms = option.perms;
|
|||
|
|
this.type = Number(option.type);
|
|||
|
|
|
|||
|
|
this.getPermissionList();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
// 查询产品物模型设备权限列表
|
|||
|
|
async getPermissionList () {
|
|||
|
|
if (this.form.perms) {
|
|||
|
|
this.selectPerms = this.form.perms.split(',');
|
|||
|
|
}
|
|||
|
|
getModelPermList(this.form.productId).then((response) => {
|
|||
|
|
// 固定增加设备系统相关权限
|
|||
|
|
this.permissionList = [{
|
|||
|
|
identifier: "ota",
|
|||
|
|
modelName: this.$tt('share.deviceUpgradation'),
|
|||
|
|
remark: this.$tt('share.otaUpgradation')
|
|||
|
|
}, {
|
|||
|
|
identifier: "timer",
|
|||
|
|
modelName: this.$tt('share.timing'),
|
|||
|
|
remark: this.$tt('share.timedTaskExecution')
|
|||
|
|
}, {
|
|||
|
|
identifier: "log",
|
|||
|
|
modelName: this.$tt('share.deviceLog'),
|
|||
|
|
remark: this.$tt('share.contains')
|
|||
|
|
}, {
|
|||
|
|
identifier: "monitor",
|
|||
|
|
modelName: this.$tt('share.monitior'),
|
|||
|
|
remark: this.$tt('share.afterMonitior')
|
|||
|
|
}, {
|
|||
|
|
identifier: "statistic",
|
|||
|
|
modelName:this.$tt('share.monitioringStatic'),
|
|||
|
|
remark: this.$tt('share.chartDisplay')
|
|||
|
|
}];
|
|||
|
|
this.permissionList = this.permissionList.concat(response.data);
|
|||
|
|
|
|||
|
|
if (this.selectPerms.length > 0) {
|
|||
|
|
for (let i = 0; i < this.permissionList.length; i++) {
|
|||
|
|
for (let j = 0; j < this.selectPerms.length; j++) {
|
|||
|
|
if (this.permissionList[i].identifier == this.selectPerms[j]) {
|
|||
|
|
this.permissionList[i].checked = true;
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 复选框改变事件
|
|||
|
|
checkboxChange (data) {
|
|||
|
|
this.selectPerms = [];
|
|||
|
|
console.log(data)
|
|||
|
|
for (let i = 0; i < this.permissionList.length; i++) {
|
|||
|
|
if (data.indexOf(this.permissionList[i].modelName) != -1) {
|
|||
|
|
this.selectPerms.push(this.permissionList[i].identifier)
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
console.log(this.selectPerms)
|
|||
|
|
},
|
|||
|
|
// 添加设备用户
|
|||
|
|
handleAddUser () {
|
|||
|
|
this.form.perms = this.selectPerms.join(',');
|
|||
|
|
addDeviceUser(this.form).then(response => {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'success',
|
|||
|
|
title: this.$tt('share.deviceShareSuccess')
|
|||
|
|
});
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1,
|
|||
|
|
success: (e) => {
|
|||
|
|
var pages = getCurrentPages();
|
|||
|
|
var page = pages[pages.length - 2];
|
|||
|
|
if (page === undefined || page === null)
|
|||
|
|
return;
|
|||
|
|
// 更新列表
|
|||
|
|
if (uni.getSystemInfoSync().platform === 'devtools') {
|
|||
|
|
page.$vm.dataList = [];
|
|||
|
|
page.$vm.getList();
|
|||
|
|
} else {
|
|||
|
|
page.dataList = [];
|
|||
|
|
page.getList();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}, 1000);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 编辑
|
|||
|
|
handleEditUser () {
|
|||
|
|
this.form.perms = this.selectPerms.join(',');
|
|||
|
|
updateDeviceUser(this.form).then(response => {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'success',
|
|||
|
|
title: this.$tt('common.updateSuccessful')
|
|||
|
|
});
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1,
|
|||
|
|
success: (e) => {
|
|||
|
|
var pages = getCurrentPages();
|
|||
|
|
var page = pages[pages.length - 2];
|
|||
|
|
if (page === undefined || page === null)
|
|||
|
|
return;
|
|||
|
|
// 更新列表
|
|||
|
|
if (uni.getSystemInfoSync().platform === 'devtools') {
|
|||
|
|
page.$vm.dataList = [];
|
|||
|
|
page.$vm.getList();
|
|||
|
|
} else {
|
|||
|
|
page.dataList = [];
|
|||
|
|
page.getList();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}, 1000);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// 删除
|
|||
|
|
handleDeleteUser () {
|
|||
|
|
uni.showModal({
|
|||
|
|
title: this.$tt('share.title'),
|
|||
|
|
content: this.$tt('share.alert'),
|
|||
|
|
success: result => {
|
|||
|
|
if (result.confirm) {
|
|||
|
|
uni.showLoading({
|
|||
|
|
title: this.$tt('share.delete')
|
|||
|
|
});
|
|||
|
|
delDeviceUser(this.form).then(res => {
|
|||
|
|
if (res) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: 'success',
|
|||
|
|
title: res.msg
|
|||
|
|
});
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1,
|
|||
|
|
success: (e) => {
|
|||
|
|
var pages = getCurrentPages();
|
|||
|
|
var page = pages[pages.length - 2];
|
|||
|
|
if (page === undefined || page ===
|
|||
|
|
null)
|
|||
|
|
return;
|
|||
|
|
// 更新列表
|
|||
|
|
if (uni.getSystemInfoSync()
|
|||
|
|
.platform === 'devtools') {
|
|||
|
|
page.$vm.dataList = [];
|
|||
|
|
page.$vm.getList();
|
|||
|
|
} else {
|
|||
|
|
page.dataList = [];
|
|||
|
|
page.getList();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}, 1000);
|
|||
|
|
}
|
|||
|
|
}).finally(() => {
|
|||
|
|
uni.hideLoading();
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
page {
|
|||
|
|
background: #eef3f7;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.device-share-detail-wrap {
|
|||
|
|
|
|||
|
|
padding: 40rpx 0;
|
|||
|
|
|
|||
|
|
.user-info-wrap,
|
|||
|
|
.permission-wrap,
|
|||
|
|
.remark-wrap {
|
|||
|
|
.title-wrap {
|
|||
|
|
padding: 0 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.container-wrap {
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
padding: 30rpx 40rpx;
|
|||
|
|
background: #ffffff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.permission-wrap,
|
|||
|
|
.remark-wrap {
|
|||
|
|
margin-top: 40rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btn-wrap {
|
|||
|
|
display: flex;
|
|||
|
|
margin: 80rpx 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|