You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
435 lines
13 KiB
435 lines
13 KiB
10 months ago
|
<template>
|
||
|
|
<view>
|
||
|
|
<wux-popup position="bottom" :visible="visible" @close="close" closable>
|
||
|
|
<view class="popup-container">
|
||
|
|
<view class="title">资源调度</view>
|
||
|
|
<view class="screen">
|
||
|
|
<view class="screen-left">
|
||
|
|
<picker :range="options" range-key="label" v-model="typeIndex" @change="typeChange">
|
||
|
|
<view class="picker-type">
|
||
|
|
<text>{{ typeIndex >= 0 ? options[typeIndex].label : '' }}</text>
|
||
|
|
<image src="/static/images/statistics/down2.png" mode="widthFix" />
|
||
|
|
</view>
|
||
|
|
</picker>
|
||
|
|
<picker :range="subTypeOptions" range-key="label" v-model="subTypeIndex">
|
||
|
|
<view class="picker-type">
|
||
|
|
<text>{{ subTypeIndex >= 0 ? subTypeOptions[subTypeIndex].label : '' }}</text>
|
||
|
|
<image src="/static/images/statistics/down2.png" mode="widthFix" />
|
||
|
|
</view>
|
||
|
|
</picker>
|
||
|
|
</view>
|
||
|
|
<view class="btn" @tap="search">筛选</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<scroll-view scroll-y class="popup-content" @scrolltolower="scrolltolower">
|
||
|
|
<view class="resource-list">
|
||
|
|
<view class="resource-items" v-for="(item, index) in list" :key="index">
|
||
|
|
<view class="userInfo">
|
||
|
|
<view class="name">{{ item.name || item.principalName || item.contact }} {{ item.mobile || item.principalPhone || item.contactMobile }}</view>
|
||
|
|
<!-- <view class="status">巡查中</view> -->
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="address">
|
||
|
|
<view class="grid">{{ item.orgName || item.agencyName }}</view>
|
||
|
|
<!-- <view class="distance">1.5Km</view> -->
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="handle">
|
||
|
|
<view class="btn btn-green" @tap="handleViews" :data-obj="item">
|
||
|
|
<image src="/static/images/statistics/views.png" mode="widthFix" />
|
||
|
|
<text>查看</text>
|
||
|
|
</view>
|
||
|
|
<view class="btn btn-orange" @tap="handleDispatchOrder" data-id="1">
|
||
|
|
<image src="/static/images/statistics/order.png" mode="widthFix" />
|
||
|
|
<text>派单</text>
|
||
|
|
</view>
|
||
|
|
<view class="btn btn-blue" @tap="handleCallPhone" :data-mobile="item.mobile || item.principalPhone || item.contactMobile">
|
||
|
|
<image src="/static/images/statistics/phone.png" mode="widthFix" />
|
||
|
|
<text>拨打</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</scroll-view>
|
||
|
|
</view>
|
||
|
|
</wux-popup>
|
||
|
|
<ResourceInfo :visible="isShowViews" :data="viewData" @close="viewsClose" />
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
// import wuxPopup from '../dist/popup/index';
|
||
|
|
import ResourceInfo from '../ResourceInfo/ResourceInfo';
|
||
|
|
import { communityselforganizationlist, getGridMemberListByAgencyId, icpartyunitList, publicWelfarePost, volunteer } from '../../utils/statisticsApi';
|
||
|
|
const app = getApp();
|
||
|
|
export default {
|
||
|
|
components: {
|
||
|
|
wuxPopup,
|
||
|
|
ResourceInfo
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
options: [
|
||
|
|
{
|
||
|
|
label: '人资源',
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: '网格员',
|
||
|
|
value: 'staffGrid'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '公益岗',
|
||
|
|
value: 'publicWelfareNum'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '志愿者',
|
||
|
|
value: 'volunteer'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '社区自组织',
|
||
|
|
value: '4'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '联建单位',
|
||
|
|
value: '5'
|
||
|
|
}
|
||
|
|
/* {
|
||
|
|
label: "15分钟生活圈商家",
|
||
|
|
value: "6",
|
||
|
|
}*/
|
||
|
|
]
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '物资源',
|
||
|
|
children: []
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '场所资源',
|
||
|
|
children: []
|
||
|
|
}
|
||
|
|
],
|
||
|
|
|
||
|
|
typeIndex: 0,
|
||
|
|
subTypeOptions: [],
|
||
|
|
subTypeIndex: 0,
|
||
|
|
isShowViews: false,
|
||
|
|
pageNo: 1,
|
||
|
|
viewData: {},
|
||
|
|
list: [],
|
||
|
|
total: '',
|
||
|
|
label: ''
|
||
|
|
};
|
||
|
|
},
|
||
|
|
options: {
|
||
|
|
styleIsolation: 'shared'
|
||
|
|
},
|
||
|
|
props: {
|
||
|
|
visible: {
|
||
|
|
type: Boolean,
|
||
|
|
default: false
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
// 处理小程序 ready 生命周期
|
||
|
|
this.$nextTick(() => this.ready());
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
ready: function () {
|
||
|
|
this.typeChange();
|
||
|
|
this.getList();
|
||
|
|
},
|
||
|
|
|
||
|
|
close() {
|
||
|
|
this.$emit('close');
|
||
|
|
},
|
||
|
|
|
||
|
|
typeChange() {
|
||
|
|
this.setData({
|
||
|
|
subTypeIndex: 0,
|
||
|
|
subTypeOptions: this.options[this.typeIndex].children
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
handleViews(e) {
|
||
|
|
let data = e.currentTarget.dataset.obj;
|
||
|
|
let peopleType = this.subTypeOptions[this.subTypeIndex].value;
|
||
|
|
let type =
|
||
|
|
peopleType === 'volunteer' ? 1 : peopleType === '5' ? 2 : peopleType === '4' ? 3 : peopleType === 'staffGrid' ? 4 : peopleType === 'publicWelfareNum' ? 5 : '';
|
||
|
|
this.setData({
|
||
|
|
viewData: {
|
||
|
|
type,
|
||
|
|
id: type === 3 ? data.orgId : data.id,
|
||
|
|
data
|
||
|
|
},
|
||
|
|
isShowViews: true
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
handleDispatchOrder(e) {
|
||
|
|
let data = e.currentTarget.dataset.obj;
|
||
|
|
this.$emit('dispatchOrder', {
|
||
|
|
detail: data
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
handleCallPhone(e) {
|
||
|
|
uni.makePhoneCall({
|
||
|
|
phoneNumber: e.currentTarget.dataset.mobile
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
viewsClose() {
|
||
|
|
this.setData({
|
||
|
|
isShowViews: false
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
search() {
|
||
|
|
this.setData({
|
||
|
|
pageNo: 1,
|
||
|
|
list: []
|
||
|
|
});
|
||
|
|
this.getList();
|
||
|
|
},
|
||
|
|
|
||
|
|
getList() {
|
||
|
|
console.log(this.subTypeIndex);
|
||
|
|
let subTypeIndex = this.subTypeOptions[this.subTypeIndex].value;
|
||
|
|
if (subTypeIndex === 'staffGrid' || subTypeIndex === 'publicWelfareNum' || subTypeIndex === 'volunteer') {
|
||
|
|
this.getGridList();
|
||
|
|
}
|
||
|
|
if (subTypeIndex === '4') {
|
||
|
|
this.getsqzz();
|
||
|
|
}
|
||
|
|
if (subTypeIndex === '5') {
|
||
|
|
this.getljdw();
|
||
|
|
}
|
||
|
|
},
|
||
|
|
|
||
|
|
getsqzz() {
|
||
|
|
communityselforganizationlist({
|
||
|
|
agencyId: this.agencyId || app.globalData.user.agencyId,
|
||
|
|
pageNo: this.pageNo,
|
||
|
|
pageSize: 5
|
||
|
|
}).then((res) => {
|
||
|
|
this.setData({
|
||
|
|
list: this.list.concat(res.data.list),
|
||
|
|
total: res.data.total
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
getljdw() {
|
||
|
|
icpartyunitList({
|
||
|
|
agencyId: this.agencyId || app.globalData.user.agencyId,
|
||
|
|
pageNo: this.pageNo,
|
||
|
|
pageSize: 5
|
||
|
|
}).then((res) => {
|
||
|
|
this.setData({
|
||
|
|
list: this.list.concat(res.data.list),
|
||
|
|
total: res.data.total
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
getGridList() {
|
||
|
|
getGridMemberListByAgencyId({
|
||
|
|
orgId: this.agencyId || app.globalData.user.agencyId,
|
||
|
|
level: 'agency',
|
||
|
|
personnelType: this.subTypeOptions[this.subTypeIndex].value
|
||
|
|
}).then((res) => {
|
||
|
|
this.setData({
|
||
|
|
list: res.data.personnelInfoVOList
|
||
|
|
});
|
||
|
|
});
|
||
|
|
},
|
||
|
|
|
||
|
|
scrolltolower() {
|
||
|
|
let subTypeIndex = this.subTypeOptions[this.subTypeIndex].value;
|
||
|
|
if (subTypeIndex === '4' || subTypeIndex === '5') {
|
||
|
|
if (this.list.length < this.total) {
|
||
|
|
this.setData({
|
||
|
|
pageNo: this.pageNo + 1
|
||
|
|
});
|
||
|
|
this.getList();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
created: function () {}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
<style>
|
||
|
|
.wux-popup__content {
|
||
|
|
background: none !important;
|
||
|
|
}
|
||
|
|
.wux-popup__content .wux-popup__hd {
|
||
|
|
padding: 0 !important;
|
||
|
|
}
|
||
|
|
.wux-popup__bd {
|
||
|
|
padding: 0 !important;
|
||
|
|
}
|
||
|
|
.popup-container {
|
||
|
|
padding: 32rpx 20rpx 50rpx;
|
||
|
|
background: linear-gradient(180deg, #dbeeff 0%, #f4faff 100%);
|
||
|
|
border-radius: 30rpx 30rpx 0px 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
font-size: 34rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #333333;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
margin-bottom: 39rpx;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title:before {
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
width: 10rpx;
|
||
|
|
height: 28rpx;
|
||
|
|
background: #3a80e7;
|
||
|
|
border-radius: 4rpx;
|
||
|
|
margin-right: 20rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.screen {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 18rpx 22rpx;
|
||
|
|
}
|
||
|
|
.screen .screen-left {
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
.screen .picker-type image,
|
||
|
|
.screen .picker image {
|
||
|
|
width: 48rpx;
|
||
|
|
height: 48rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.screen .picker-type text {
|
||
|
|
white-space: nowrap;
|
||
|
|
text-overflow: ellipsis;
|
||
|
|
overflow: hidden;
|
||
|
|
width: calc(100% - 24rpx);
|
||
|
|
}
|
||
|
|
.screen .picker-type {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding: 0 30rpx;
|
||
|
|
margin-right: 10rpx;
|
||
|
|
box-sizing: border-box;
|
||
|
|
font-size: 30rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #c1c1c1;
|
||
|
|
line-height: 56rpx;
|
||
|
|
text-align: center;
|
||
|
|
|
||
|
|
width: 221rpx;
|
||
|
|
height: 65rpx;
|
||
|
|
background: #ffffff;
|
||
|
|
border: 1px solid #dbdbdb;
|
||
|
|
border-radius: 31rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.screen .btn {
|
||
|
|
width: 120rpx;
|
||
|
|
height: 65rpx;
|
||
|
|
line-height: 65rpx;
|
||
|
|
background: #3a80e7;
|
||
|
|
border-radius: 33rpx;
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #ffffff;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
.popup-content {
|
||
|
|
background: #fff;
|
||
|
|
height: 50vh;
|
||
|
|
border-radius: 20px;
|
||
|
|
margin-top: 30rpx;
|
||
|
|
}
|
||
|
|
|
||
|
|
.resource-list {
|
||
|
|
padding: 0 30rpx;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items {
|
||
|
|
border-bottom: 1px solid #eaeaea;
|
||
|
|
padding: 36rpx 0;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .userInfo {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin-bottom: 30rpx;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .userInfo .name {
|
||
|
|
font-size: 34rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #333333;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .userInfo .status {
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #13c8bd;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .address {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin-bottom: 40rpx;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .address .grid {
|
||
|
|
font-size: 28rpx;
|
||
|
|
font-weight: 400;
|
||
|
|
color: #666666;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .address .distance {
|
||
|
|
font-size: 26rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
color: #c1c1c1;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .handle {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
align-items: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.resource-list .resource-items .handle .btn {
|
||
|
|
background: #ffffff;
|
||
|
|
border-width: 2rpx;
|
||
|
|
border-style: solid;
|
||
|
|
border-radius: 30rpx;
|
||
|
|
width: 180rpx;
|
||
|
|
height: 60rpx;
|
||
|
|
font-size: 32rpx;
|
||
|
|
font-weight: 500;
|
||
|
|
line-height: 60rpx;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .handle .btn image {
|
||
|
|
flex: 0 0 30rpx;
|
||
|
|
width: 30rpx;
|
||
|
|
height: 30rpx;
|
||
|
|
margin-right: 20rpx;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .handle .btn.btn-green {
|
||
|
|
border-color: #13c8bd;
|
||
|
|
color: #13c8bd;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .handle .btn.btn-orange {
|
||
|
|
border-color: #ff783c;
|
||
|
|
color: #ff783c;
|
||
|
|
}
|
||
|
|
.resource-list .resource-items .handle .btn.btn-blue {
|
||
|
|
border-color: #3a80e7;
|
||
|
|
color: #3a80e7;
|
||
|
|
}
|
||
|
|
</style>
|