JSY/jsy-app
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改出水口权限设置

Browse Source
This commit is contained in:
jsy_zjg 2024-11-27 15:40:41 +08:00
parent f7e0b7224e
commit 8c88414c8b
1 changed files with 256 additions and 356 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

610
pages/work/user/device.vue
View File

@ -1,362 +1,262 @@
<template> <template>
<view class="index-container"> <view class="index-container">
<z-paging class="paging" ref="paging" use-virtual-list bg-color="#F6F3F3" :loading-more-enabled="false"> <z-paging class="paging" ref="paging" use-virtual-list bg-color="#F6F3F3" :loading-more-enabled="false">
<template #top> <template #top>
<view class="search"> <view class="search">
<u-search placeholder="请输入出水口编号" @search="onSearchValue" @custom="onSearchValue" <u-search placeholder="请输入出水口编号" @search="onSearchValue" @custom="onSearchValue" @clear="onSearchValue(null)" shape="square"></u-search>
@clear="onSearchValue(null)" shape="square"></u-search> </view>
</view> </template>
</template> <view class="tips">
<view class="tips"> <text style="color: red">注意：</text>
<text style="color: red">注意：</text> <text>1.选中的开关为有控制权限;</text>
<text>1.选中的开关为有控制权限;</text> <view style="float: right; margin-right: 15px; border: 1px solid;">
<view style="float: right;margin-right: 15px;border: 1px solid;"> <u-button style="height: 25px;" type="primary" size="small" :plain="true" :hairline="true" @click="handleChangeAllRow">
<u-button style="height: 25px;" type="primary" size="small" :plain="true" :hairline="true" {{ selectAll ? '反选' : '全选' }}
@click="handleChangeAllRow"> </u-button>
{{ selectAll ? '反选':'全选' }} </view>
</u-button> </view>
</view> <template #cell="{ item }">
</view> <view class="item-container">
<template #cell="{ item }"> <view class="flex-text" style="padding: 10px;">
<view class="item-container"> <view class="flex-text-one">出水口：</view>
<view class="flex-text" style="padding: 10px;"> <view>
<view class="flex-text-one">出水口：</view> <text>{{ item.showName }}</text>
<view> </view>
<text>{{ item.showName }}</text> <view style="margin-left: 30px; height: 25px;">
</view> <u-checkbox-group class="checkBox" style="margin: 0;" icon-placement="left" placement="row" @change="handleChangeRow($event, item)">
<view style="margin-left: 30px;height: 25px;"> <u-checkbox active-color="#35842E" label="全选" :checked="isAllSelected(item)" name="all"></u-checkbox>
<u-checkbox-group class="checkBox" style="margin: 0;" iconPlacement="left" placement="row" </u-checkbox-group>
@change="handleChangeRow($event, item)"> </view>
<u-checkbox activeColor="#35842E" label="全选" <view style="margin-left: 100px; height: 25px;">
v-if="item.landWaterOutletPermissionVo.deviceTypeKey == 'valve'" <u-radio-group class="checkBox" style="margin: 0;" icon-placement="left" placement="row" v-model="item.landWaterOutletPermissionVo.deviceTypeKey" @change="handleChangeDeviceType($event, item)">
:checked="item.landWaterOutletPermissionVo.valveClose==0 && item.landWaterOutletPermissionVo.valveOpen==0 && item.landWaterOutletPermissionVo.valveOneOpen==0 && item.landWaterOutletPermissionVo.valveTwoOpen==0" <u-radio active-color="#35842E" label="三通" name="valve"></u-radio>
name="all"></u-checkbox> <u-radio active-color="#35842E" label="五通" name="fiveValve"></u-radio>
<u-checkbox activeColor="#35842E" label="全选" </u-radio-group>
v-if="item.landWaterOutletPermissionVo.deviceTypeKey == 'fiveValve'" </view>
:checked="item.landWaterOutletPermissionVo.valveOneOpen==0 && item.landWaterOutletPermissionVo.valveTwoOpen==0 && item.landWaterOutletPermissionVo.valveThreeOpen==0 && item.landWaterOutletPermissionVo.valveFourOpen==0" </view>
name="all"></u-checkbox> <u-gap height="1" bg-color="#D2D2D2"></u-gap>
</u-checkbox-group> <view v-if="isValve(item)">
</view> <u-checkbox-group class="checkBox" icon-placement="left" placement="row" @change="handleChange($event, item)">
<view style="margin-left: 95px;height: 25px;"> <u-checkbox active-color="#35842E" label="全关" :checked="item.landWaterOutletPermissionVo.valveClose == 0" name="valveClose"></u-checkbox>
<u-radio-group class="checkBox" style="margin: 0;" iconPlacement="left" placement="row" v-model="item.landWaterOutletPermissionVo.deviceTypeKey" <u-checkbox active-color="#35842E" label="全开" :checked="item.landWaterOutletPermissionVo.valveOpen == 0" name="valveOpen"></u-checkbox>
@change="handleChangeDeviceType($event, item)"> <u-checkbox active-color="#35842E" label="①开" :checked="item.landWaterOutletPermissionVo.valveOneOpen == 0" name="valveOneOpen"></u-checkbox>
<u-radio activeColor="#35842E" label="三通" <u-checkbox active-color="#35842E" label="②开" :checked="item.landWaterOutletPermissionVo.valveTwoOpen == 0" name="valveTwoOpen"></u-checkbox>
name="valve"></u-radio> </u-checkbox-group>
<u-radio activeColor="#35842E" label="五通" </view>
name="fiveValve"></u-radio> <view v-if="isFiveValve(item)">
</u-radio-group> <u-checkbox-group class="checkBox" icon-placement="left" placement="row" @change="handleChange($event, item)">
</view> <u-checkbox active-color="#35842E" label="①开" :checked="item.landWaterOutletPermissionVo.valveOneOpen == 0" name="valveOneOpen"></u-checkbox>
</view> <u-checkbox active-color="#35842E" label="②开" :checked="item.landWaterOutletPermissionVo.valveTwoOpen == 0" name="valveTwoOpen"></u-checkbox>
<u-gap height="1" bgColor="#D2D2D2"></u-gap> <u-checkbox active-color="#35842E" label="③开" :checked="item.landWaterOutletPermissionVo.valveThreeOpen == 0" name="valveThreeOpen"></u-checkbox>
<view v-if="item.landWaterOutletPermissionVo.deviceTypeKey == 'valve'"> <u-checkbox active-color="#35842E" label="④开" :checked="item.landWaterOutletPermissionVo.valveFourOpen == 0" name="valveFourOpen"></u-checkbox>
<u-checkbox-group class="checkBox" iconPlacement="left" placement="row" </u-checkbox-group>
@change="handleChange($event, item)"> </view>
<u-checkbox activeColor="#35842E" label="全关" </view>
:checked="item.landWaterOutletPermissionVo.valveClose==0" </template>
name="valveClose"></u-checkbox> <template #bottom>
<u-checkbox activeColor="#35842E" label="全开" <view class="button">
:checked="item.landWaterOutletPermissionVo.valveOpen==0" name="valveOpen"></u-checkbox> <u-button style="width: 200px; height: 40px; border-radius: 4px" type="success" text="设 置" @click="submit" :disabled="disabled"></u-button>
<u-checkbox activeColor="#35842E" label="①开 " </view>
:checked="item.landWaterOutletPermissionVo.valveOneOpen==0" </template>
name="valveOneOpen"></u-checkbox> </z-paging>
<u-checkbox activeColor="#35842E" label="②开" </view>
:checked="item.landWaterOutletPermissionVo.valveTwoOpen==0"
name="valveTwoOpen"></u-checkbox>
</u-checkbox-group>
</view>
<view v-if="item.landWaterOutletPermissionVo.deviceTypeKey == 'fiveValve'">
<u-checkbox-group class="checkBox" iconPlacement="left" placement="row"
@change="handleChange($event, item)">
<u-checkbox activeColor="#35842E" label="①开"
:checked="item.landWaterOutletPermissionVo.valveOneOpen==0"
name="valveOneOpen"></u-checkbox>
<u-checkbox activeColor="#35842E" label="②开"
:checked="item.landWaterOutletPermissionVo.valveTwoOpen==0"
name="valveTwoOpen"></u-checkbox>
<u-checkbox activeColor="#35842E" label="③开 "
:checked="item.landWaterOutletPermissionVo.valveThreeOpen==0"
name="valveThreeOpen"></u-checkbox>
<u-checkbox activeColor="#35842E" label="④开"
:checked="item.landWaterOutletPermissionVo.valveFourOpen==0"
name="valveFourOpen"></u-checkbox>
</u-checkbox-group>
</view>
</view>
</template>
<template #bottom>
<view class="button">
<u-button style="width: 200px; height: 40px; border-radius: 4px" type="success" text="设 置"
@click="submit" :disabled="disabled"></u-button>
</view>
</template>
</z-paging>
</view>
</template> </template>
<script> <script>
import plugin from "@/plugins" import plugin from "@/plugins";
import { import { getLandWaterOutletPermissionList, saveLandWaterOutletPermission } from "@/api/system/landWaterOutletPermission";
getLandWaterOutletPermissionList,
saveLandWaterOutletPermission export default {
} from "@/api/system/landWaterOutletPermission" data() {
export default { return {
data() { landId: null,
return { dataList: [],
landId: null, selectItem: {},
dataList: [], tempValveData: {
selectItem: {}, valveClose: true,
tempValveData: { valveOneOpen: true,
valveClose: true, valveOpen: true,
valveOneOpen: true, valveTwoOpen: true,
valveOpen: true, valveThreeOpen: true,
valveTwoOpen: true, valveFourOpen: true
valveThreeOpen: true, },
valveFourOpen: true selectAll: false,
}, query: {
selectAll: false, landId: null,
query: { showName: null,
landId: null, userId: null
showName: null, },
userId: null disabled: false
}, };
disabled: false },
} onLoad(options) {
}, this.landId = options.landId;
onLoad(options) { this.query.landId = options.landId;
this.landId = options.landId this.query.userId = options.userId;
this.query.landId = options.landId this.queryList();
this.query.userId = options.userId },
this.queryList(); methods: {
}, queryList() {
methods: { if (!this.query.landId) {
queryList() { return;
if (!this.query.landId) { }
return; this.dataList = [];
} getLandWaterOutletPermissionList(this.query).then(res => {
this.dataList = [] this.dataList = res.data;
getLandWaterOutletPermissionList(this.query) this.$refs.paging.complete(this.dataList);
.then(res => { });
this.dataList = res.data; },
this.$refs.paging.complete(this.dataList) onSearchValue(e) {
}) this.query.showName = e;
}, this.queryList();
onSearchValue(e) { },
this.query.showName = e; submit() {
this.queryList(); let saveObj = {
}, landId: this.query.landId,
//提交 userId: this.query.userId,
submit() { landWaterOutlets: this.dataList
let saveObj = { };
landId:this.query.landId, plugin.modal.loading("设置中...");
userId:this.query.userId, this.disabled = true;
landWaterOutlets: this.dataList saveLandWaterOutletPermission(saveObj).then(res => {
} plugin.modal.msgSuccess("设置成功!");
plugin.modal.loading("设置中...") this.queryList();
this.disabled = true; this.disabled = false;
//获取该用户地块列表 });
saveLandWaterOutletPermission(saveObj) },
.then(res => { handleChangeAllRow() {
plugin.modal.msgSuccess("设置成功!") this.selectAll = !this.selectAll;
//刷新列表 const selectAll = this.selectAll;
this.queryList(); this.dataList.forEach(item => {
this.disabled = false; this.handleRowPermissions(item, selectAll);
}) });
}, },
//全选 handleChangeRow(e, row) {
handleChangeAllRow() { this.handleRowPermissions(row, e && e.length);
this.selectAll = !this.selectAll; },
const selectAll = this.selectAll; handleChangeDeviceType(e, obj) {
const valveDefaults = { const permissions = obj.landWaterOutletPermissionVo;
valveClose: 1, permissions.deviceTypeKey = e;
valveOpen: 1, this.setDefaultPermissions(permissions);
valveOneOpen: 1, },
valveTwoOpen: 1, handleChange(e, obj) {
valveThreeOpen: 1, this.judgeValue(e, obj);
valveFourOpen: 1 },
}; judgeValue(e, itemSample) {
const valveSettings = { const permissions = itemSample.landWaterOutletPermissionVo;
valve: { ['valveClose', 'valveOpen', 'valveOneOpen', 'valveTwoOpen', 'valveThreeOpen', 'valveFourOpen'].forEach(property => {
true: { permissions[property] = e.includes(property) ? 0 : 1;
valveClose: 0, });
valveOpen: 0, },
valveOneOpen: 0, handleRowPermissions(row, selectAll) {
valveTwoOpen: 0, const permissions = row.landWaterOutletPermissionVo;
valveThreeOpen: 1, this.setDefaultPermissions(permissions);
valveFourOpen: 1 if (selectAll) {
}, if (this.isValve(row)) {
false: {} permissions.valveClose = 0;
}, permissions.valveOpen = 0;
fiveValve: { permissions.valveOneOpen = 0;
true: { permissions.valveTwoOpen = 0;
valveClose: 1, } else if (this.isFiveValve(row)) {
valveOpen: 1, permissions.valveOneOpen = 0;
valveOneOpen: 0, permissions.valveTwoOpen = 0;
valveTwoOpen: 0, permissions.valveThreeOpen = 0;
valveThreeOpen: 0, permissions.valveFourOpen = 0;
valveFourOpen: 0 }
}, }
false: {} },
} setDefaultPermissions(permissions) {
}; permissions.valveClose = 1;
this.dataList.forEach(item => { permissions.valveOpen = 1;
const deviceType = item.landWaterOutletPermissionVo.deviceTypeKey; permissions.valveOneOpen = 1;
const settings = valveSettings[deviceType][selectAll]; permissions.valveTwoOpen = 1;
Object.assign(item.landWaterOutletPermissionVo, valveDefaults, settings); permissions.valveThreeOpen = 1;
}); permissions.valveFourOpen = 1;
}, },
//单行全选 isValve(item) {
handleChangeRow(e, row) { return item.landWaterOutletPermissionVo.deviceTypeKey === 'valve';
const permissions = row.landWaterOutletPermissionVo; },
const valveDefaults = { isFiveValve(item) {
valveClose: 1, return item.landWaterOutletPermissionVo.deviceTypeKey === 'fiveValve';
valveOpen: 1, },
valveOneOpen: 1, isAllSelected(item) {
valveTwoOpen: 1, if (this.isValve(item)) {
valveThreeOpen: 1, return item.landWaterOutletPermissionVo.valveClose === 0 &&
valveFourOpen: 1 item.landWaterOutletPermissionVo.valveOpen === 0 &&
}; item.landWaterOutletPermissionVo.valveOneOpen === 0 &&
const valveSettings = { item.landWaterOutletPermissionVo.valveTwoOpen === 0;
valve: { } else if (this.isFiveValve(item)) {
valveClose: 0, return item.landWaterOutletPermissionVo.valveOneOpen === 0 &&
valveOpen: 0, item.landWaterOutletPermissionVo.valveTwoOpen === 0 &&
valveOneOpen: 0, item.landWaterOutletPermissionVo.valveThreeOpen === 0 &&
valveTwoOpen: 0, item.landWaterOutletPermissionVo.valveFourOpen === 0;
valveThreeOpen: 1, }
valveFourOpen: 1 return false;
}, }
fiveValve: { }
valveClose: 1, };
valveOpen: 1,
valveOneOpen: 0,
valveTwoOpen: 0,
valveThreeOpen: 0,
valveFourOpen: 0
}
};
const deviceType = row.landWaterOutletPermissionVo.deviceTypeKey;
const settings = e && e.length ? valveSettings[deviceType] : {};
Object.assign(permissions, valveDefaults, settings);
},
//更改设备类型
handleChangeDeviceType(e, obj){
const permissions = obj.landWaterOutletPermissionVo;
permissions.deviceTypeKey = e;
const valveSettings = {
valve: {
valveClose: 1,
valveOpen: 1,
valveOneOpen: 1,
valveTwoOpen: 1,
valveThreeOpen: 1,
valveFourOpen: 1
},
fiveValve: {
valveClose: 1,
valveOpen: 1,
valveOneOpen: 1,
valveTwoOpen: 1,
valveThreeOpen: 1,
valveFourOpen: 1
}
};
const settings = e ? valveSettings[e] : {};
Object.assign(permissions, settings);
},
//当用户点击权限开关之后
handleChange(e, obj) {
this.judgeValue(e, obj);
},
judgeValue(e, itemSample) {
const valveProperties = [
'valveClose',
'valveOpen',
'valveOneOpen',
'valveTwoOpen',
'valveThreeOpen',
'valveFourOpen'
];
const permissions = itemSample.landWaterOutletPermissionVo;
valveProperties.forEach(property => {
permissions[property] = e.includes(property) ? 0 : 1;
});
}
}
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.index-container { .index-container {
background-color: #f6f3f3; background-color: #f6f3f3;
height: 100%; height: 100%;
.search {
.search { background-color: white;
background-color: white; padding: 10px;
padding: 10px; }
} .title {
height: 50px;
.title { display: flex;
height: 50px; padding: 15px 15px;
display: flex; background: white;
padding: 15px 15px; align-items: center;
background: white; text {
align-items: center; font-size: 14px;
margin-right: 10px;
text { }
font-size: 14px; }
margin-right: 10px; .list {
} height: calc(100vh - 150px - env(safe-area-inset-bottom));
} margin: 0px 10px;
work-user-index-item {
.list { background-color: #f6f3f3;
height: calc(100vh - 150px - env(safe-area-inset-bottom)); }
margin: 0px 10px; }
.button {
work-user-index-item { padding: 10px 20px;
background-color: #f6f3f3; display: flex;
} background: white;
} }
.item-container {
.button { margin-top: 10px;
padding: 10px 20px; background-color: white;
display: flex; padding-bottom: 10px;
background: white; }
} .flex-text {
display: flex;
.item-container { align-items: center;
margin-top: 10px; font-size: 16px;
background-color: white; .flex-text-one {
padding-bottom: 10px; color: #939393;
} font-weight: bold;
}
.flex-text { }
display: flex; .checkBox {
align-items: center; margin: 10px 0px 0px 0px;
font-size: 16px; display: flex;
justify-content: space-around;
.flex-text-one { }
color: #939393; }
font-weight: bold; .tips {
} padding: 10px;
} line-height: 20px;
font-size: 14px;
.checkBox { color: gray;
// margin: 20px 0px; background-color: #fff;
margin: 10px 0px 0px 0px; border-top: 1px solid #eee;
display: flex; }
justify-content: space-around; ::v-deep.zp-paging-container {
} background: #f3f3f3 !important;
} }
.tips {
padding: 10px;
line-height: 20px;
font-size: 14px;
color: gray;
// letter-spacing: 1px;
background-color: #fff;
border-top: 1px solid #eee;
}
::v-deep.zp-paging-container {
background: #f3f3f3 !important;
}
</style> </style>