313 lines
7.7 KiB
Vue
313 lines
7.7 KiB
Vue
|
<template>
|
|||
|
|
<view class="hzIndex">
|
|||
|
|
<hzHeader title="区域选择"></hzHeader>
|
|||
|
|
<view class="hzContent" style="padding-top: 200upx;">
|
|||
|
|
<view class="saveBtn" @click="saveArea">保存</view>
|
|||
|
|
<view class="main">
|
|||
|
|
<view class="tab-boxs">
|
|||
|
|
<view class="tab-item" v-for="(item, index) in buildList" :key="index" :class="currentTabIndex == index ? 'active' : ''" @click="currentTabIndex = index">
|
|||
|
|
<view class="activeLine" v-if="currentTabIndex == index"></view>
|
|||
|
|
<view>{{item.ACCESSNAME}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 未审批列表 -->
|
|||
|
|
<view class="list-box">
|
|||
|
|
<view v-for="(item, index) in buildList" :key="index" v-show="currentTabIndex == index">
|
|||
|
|
<uni-table ref="table" :border="false" type="selection" emptyText="暂无更多数据" @selection-change="selectionChange">
|
|||
|
|
<uni-tr>
|
|||
|
|
<uni-th width="150" align="left">区域</uni-th>
|
|||
|
|
</uni-tr>
|
|||
|
|
<uni-tr v-for="(items, indexs) in item.areaList" :key="indexs">
|
|||
|
|
<uni-td align="left">{{ items.ACCESSNAME}}</uni-td>
|
|||
|
|
</uni-tr>
|
|||
|
|
</uni-table>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
<!-- <view class="detail" v-for="(item, index) in list" :key="index">
|
|||
|
|
<view class="detail_msg">
|
|||
|
|
<view class="info-item" @click="detail(item)">
|
|||
|
|
<text>办卡类型：</text>
|
|||
|
|
<text class="infoSpan">{{item.ACCESSNAME}}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import uniCalendar from '@/components/uni-calendar/uni-calendar.vue';
|
|||
|
|
import { getAccessControlList } from '@/common/api.js';
|
|||
|
|
import { callbackRequest, alertTip, getStorage,formatDate } from '@/common/util.js';
|
|||
|
|
import loadMore from '@/components/loadMore.vue';
|
|||
|
|
import datetimePicker from '@/components/dateTime.vue';
|
|||
|
|
import contentNone from '@/components/contentNone.vue';
|
|||
|
|
import UniPopup from "@/components/uni-popup/uni-popup.vue"
|
|||
|
|
import xflSelect from '../../components/xfl-select/xfl-select1.vue'
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
formatDate: formatDate,
|
|||
|
|
userId: getStorage('userInfo').userId,
|
|||
|
|
currentTabIndex:0,
|
|||
|
|
list: [],
|
|||
|
|
buildList: [
|
|||
|
|
{id:'1',ACCESSNAME:'科技楼',areaList:[{ACCESSNAME:'科技楼测试区域1'},{ACCESSNAME:'科技楼测试区域2'},{ACCESSNAME:'科技楼测试区域3'}]},
|
|||
|
|
{id:'1',ACCESSNAME:'调度楼',areaList:[{ACCESSNAME:'调度楼测试区域1'},{ACCESSNAME:'调度楼测试区域2'},{ACCESSNAME:'调度楼测试区域3'}]},
|
|||
|
|
{id:'1',ACCESSNAME:'后勤楼',areaList:[{ACCESSNAME:'后勤楼测试区域1'},{ACCESSNAME:'后勤楼测试区域2'},{ACCESSNAME:'后勤楼测试区域3'}]},
|
|||
|
|
],
|
|||
|
|
examineBatch:'',
|
|||
|
|
chosenType:'',
|
|||
|
|
chosenAreaList:[]
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
components: {
|
|||
|
|
loadMore,
|
|||
|
|
contentNone,
|
|||
|
|
UniPopup,
|
|||
|
|
xflSelect
|
|||
|
|
},
|
|||
|
|
watch: {
|
|||
|
|
currentTabIndex: function(newVal, oldVal) {
|
|||
|
|
this.currentTabIndex = newVal;
|
|||
|
|
// if (this.currentTabIndex==0) {
|
|||
|
|
|
|||
|
|
// }else if (this.currentTabIndex==1) {
|
|||
|
|
|
|||
|
|
// }
|
|||
|
|
// this.getExaminePage();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
this.selectedIndexs = []
|
|||
|
|
|
|||
|
|
this.chosenType = options.chosenType || 0;
|
|||
|
|
this.currentTabIndex = options.currentTabIndex || 0;
|
|||
|
|
this.examineBatch = options.examineBatch || "1";
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
this.getAccessControlList();
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
getAccessControlList() {
|
|||
|
|
var data = {};
|
|||
|
|
data = {
|
|||
|
|
userId: this.userId,
|
|||
|
|
// examineBatch:this.examineBatch,
|
|||
|
|
// examineState:'0',
|
|||
|
|
// type:"1"
|
|||
|
|
// orgId:getStorage('userInfo').department_id
|
|||
|
|
};
|
|||
|
|
console.log(data)
|
|||
|
|
let params = {
|
|||
|
|
method:getAccessControlList,
|
|||
|
|
data: data
|
|||
|
|
};
|
|||
|
|
callbackRequest(params).then(res => {
|
|||
|
|
if (res.data.returnCode == 1) {
|
|||
|
|
let result = res.data.returnData||[];
|
|||
|
|
this.buildList = result
|
|||
|
|
console.log(result)
|
|||
|
|
// this.list = result;
|
|||
|
|
} else {
|
|||
|
|
alertTip(res.data.returnMsg);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
getUserPermissions(code) {
|
|||
|
|
let that = this;
|
|||
|
|
// if (!that.userId) {
|
|||
|
|
// return;
|
|||
|
|
// }
|
|||
|
|
let userId= getStorage('userInfo').userId;
|
|||
|
|
callbackRequestNoLoading({ method: getUserPermission3, data: { userId: userId,parentCode:code } }).then(res => {
|
|||
|
|
if (res.data.returnCode == 1) {
|
|||
|
|
that.permissions = res.data.returnData;
|
|||
|
|
} else {
|
|||
|
|
console.log('获取权限失败');
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
selectionChange(e) {
|
|||
|
|
// console.log(this.currentTabIndex)
|
|||
|
|
// console.log(e.detail.index)
|
|||
|
|
let arrList = []
|
|||
|
|
let arrIdsList = []
|
|||
|
|
let selectedIndexs = [] // 选择的下标数组
|
|||
|
|
selectedIndexs = e.detail.index
|
|||
|
|
// 将数组中的值，作为table表格数组的下标来获取对应的当前行数据
|
|||
|
|
selectedIndexs.map(i => {
|
|||
|
|
arrList.push(this.buildList[this.currentTabIndex].areaList[i].ACCESSNAME)
|
|||
|
|
arrIdsList.push(this.buildList[this.currentTabIndex].areaList[i].ACCESSID)
|
|||
|
|
})
|
|||
|
|
// console.log(arrList)
|
|||
|
|
// console.log(arrIdsList)
|
|||
|
|
let obj = {
|
|||
|
|
addressId:this.buildList[this.currentTabIndex].ACCESSID,
|
|||
|
|
address:this.buildList[this.currentTabIndex].ACCESSNAME,
|
|||
|
|
area:arrList.join(','),
|
|||
|
|
areaIds:arrIdsList.join(','),
|
|||
|
|
}
|
|||
|
|
// console.log(obj)
|
|||
|
|
this.chosenAreaList[this.currentTabIndex] = obj
|
|||
|
|
},
|
|||
|
|
saveArea() {
|
|||
|
|
let arr = []
|
|||
|
|
this.chosenAreaList.forEach(item=>{
|
|||
|
|
if(item.area!=''){
|
|||
|
|
arr.push(item)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
console.log(arr)
|
|||
|
|
let pages = getCurrentPages(); //获取所有页面栈实例列表
|
|||
|
|
let nowPage = pages[pages.length - 1]; //当前页页面实例
|
|||
|
|
let prevPage = pages[pages.length - 2]; //上一页页面实例
|
|||
|
|
if(this.chosenType==1){
|
|||
|
|
prevPage.$vm.areaData0 = arr;
|
|||
|
|
}
|
|||
|
|
if(this.chosenType==2){
|
|||
|
|
prevPage.$vm.areaData1 = arr;
|
|||
|
|
}
|
|||
|
|
uni.navigateBack({ // 返回上一页面
|
|||
|
|
delta: 1 // 返回的页面数
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onReachBottom() {
|
|||
|
|
// if(this.currentTabIndex==0){
|
|||
|
|
|
|||
|
|
// }else{
|
|||
|
|
|
|||
|
|
// }
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
@import '@/static/css/common.scss';
|
|||
|
|
page {
|
|||
|
|
// background: #f8f8f8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
.saveBtn{
|
|||
|
|
width: 110upx;
|
|||
|
|
height: 70upx;
|
|||
|
|
font-size: 30upx;
|
|||
|
|
line-height: 70upx;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #fff;
|
|||
|
|
background: linear-gradient( 90deg, #50CBA1 0%, #06AEA6 100%), #C1EFEA;
|
|||
|
|
border-radius: 12px;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 200upx;right: 40upx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.main {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 280upx;
|
|||
|
|
width: 100%;
|
|||
|
|
z-index: 10;
|
|||
|
|
.tab-boxs {
|
|||
|
|
width: 25%;
|
|||
|
|
// min-height: 80vh;
|
|||
|
|
position: absolute;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
padding-top: 50upx;
|
|||
|
|
.tab-item {
|
|||
|
|
height: 100upx;
|
|||
|
|
width: 100%;
|
|||
|
|
font-size: 30upx;
|
|||
|
|
margin: 40upx 0;
|
|||
|
|
display: flex;
|
|||
|
|
font-size: 30upx;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
.active {
|
|||
|
|
background-color: #DFE7F5;
|
|||
|
|
color: #333;
|
|||
|
|
border-top-right-radius: 100upx;
|
|||
|
|
border-bottom-right-radius: 100upx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.activeLine{
|
|||
|
|
background: linear-gradient( 90deg, #50CBA1 0%, #06AEA6 100%), #5685F2;
|
|||
|
|
border-radius: 20upx;
|
|||
|
|
margin-right: 10upx;
|
|||
|
|
// float: left;
|
|||
|
|
width: 10upx;
|
|||
|
|
height: 30upx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list-box {
|
|||
|
|
width: 70%;
|
|||
|
|
min-height: 80vh;;
|
|||
|
|
margin-top: 20upx;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 20upx;
|
|||
|
|
position: absolute;
|
|||
|
|
padding: 20upx;
|
|||
|
|
padding-top: 40upx;
|
|||
|
|
top: 0;
|
|||
|
|
right: 20upx;
|
|||
|
|
|
|||
|
|
.detail{
|
|||
|
|
// height: 400upx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#addbtn {
|
|||
|
|
height: 120upx;
|
|||
|
|
background-color: #ffffff;
|
|||
|
|
padding: 30upx;
|
|||
|
|
border-radius: 30upx;
|
|||
|
|
color: #333333;
|
|||
|
|
border-bottom: 0.033333rem solid #eee;
|
|||
|
|
align-items: center;
|
|||
|
|
position: relative;
|
|||
|
|
margin-top: 20upx;
|
|||
|
|
}
|
|||
|
|
.addbtn view text:nth-child(1) {
|
|||
|
|
font-size: 32upx;
|
|||
|
|
margin-left: 220upx;
|
|||
|
|
color: #00c277;
|
|||
|
|
}
|
|||
|
|
.addbtn view text:nth-child(2) {
|
|||
|
|
font-size: 32upx;
|
|||
|
|
margin-left: 180upx;
|
|||
|
|
color: #00c277;
|
|||
|
|
}
|
|||
|
|
.tips {
|
|||
|
|
font-size: 22upx;
|
|||
|
|
// margin-left: 80upx;
|
|||
|
|
margin-top: 20upx;
|
|||
|
|
}
|
|||
|
|
uni-radio .uni-radio-input {
|
|||
|
|
-webkit-appearance: none;
|
|||
|
|
appearance: none;
|
|||
|
|
margin-right: 5px;
|
|||
|
|
outline: 0;
|
|||
|
|
border: 1px solid #d1d1d1;
|
|||
|
|
background-color: #fff;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
width: 18px!important;
|
|||
|
|
height: 18px!important;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
</style>
|