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.
377 lines
12 KiB
377 lines
12 KiB
<template>
|
|
<view>
|
|
<wux-popup position="center" :visible="visible" @close="close" closable>
|
|
<view class="popup-container">
|
|
<view class="title">资源信息卡</view>
|
|
<view class="popup-content">
|
|
<view class="items">
|
|
<view class="label">资源类型：</view>
|
|
<view class="value">{{ typeList[type] }}</view>
|
|
</view>
|
|
<block v-if="type === 2">
|
|
<view class="items">
|
|
<view class="label">单位名称：</view>
|
|
<view class="value">{{ detail.unitName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">分类：</view>
|
|
<view class="value">{{ detail.typeName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">服务事项：</view>
|
|
<view class="value">{{ detail.serviceMatterNameList }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">联系人：</view>
|
|
<view class="value">{{ detail.contact }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">联系电话：</view>
|
|
<view class="value">{{ detail.contactMobile }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">地理位置：</view>
|
|
<view class="value">{{ detail.address }}</view>
|
|
</view>
|
|
</block>
|
|
<block v-if="type === 3">
|
|
<view class="items">
|
|
<view class="label">组织名称：</view>
|
|
<view class="value">{{ detail.organizationName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">分类：</view>
|
|
<view class="value">{{ detail.categoryName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">服务事项：</view>
|
|
<view class="value">{{ detail.serviceItem }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">联系人：</view>
|
|
<view class="value">{{ detail.principalName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">联系电话：</view>
|
|
<view class="value">{{ detail.principalPhone }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">地理位置：</view>
|
|
<view class="value">{{ detail.address }}</view>
|
|
</view>
|
|
</block>
|
|
|
|
<block v-if="type === 4">
|
|
<view class="items">
|
|
<view class="label">姓名：</view>
|
|
<view class="value">{{ detail.name }}</view>
|
|
</view>
|
|
|
|
<view class="items">
|
|
<view class="label">联系电话：</view>
|
|
<view class="value">{{ detail.mobile }}</view>
|
|
</view>
|
|
|
|
<view class="items">
|
|
<view class="label">证件号：</view>
|
|
<view class="value">{{ detail.idCard }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">组织/部门：</view>
|
|
<view class="value">{{ detail.orgName }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">职位：</view>
|
|
<view class="value">
|
|
<text v-for="(item, index) in detail.szsqRoles" :key="index">
|
|
{{ item }}
|
|
|
|
<text v-if="index < detail.szsqRoles.length - 1">、</text>
|
|
</text>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
|
|
<block v-if="type === 5 || type === 1">
|
|
<view class="items">
|
|
<view class="label">姓名：</view>
|
|
<view class="value">{{ detail.name }}</view>
|
|
</view>
|
|
|
|
<view class="items">
|
|
<view class="label">联系电话：</view>
|
|
<view class="value">{{ detail.mobile }}</view>
|
|
</view>
|
|
|
|
<view class="items">
|
|
<view class="label">年龄：</view>
|
|
<view class="value">{{ detail.age }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">学历：</view>
|
|
<view class="value">{{ education ? education.cultureLevelName : '' }}</view>
|
|
</view>
|
|
|
|
<!-- <view class="items">
|
|
<view class="label">状态：</view>
|
|
<view class="value">巡查中</view>
|
|
</view>-->
|
|
|
|
<view class="items">
|
|
<view class="label">所在位置：</view>
|
|
<view class="value">{{ detail && detail.houseInfo && detail.houseInfo.homeName ? detail.houseInfo.homeName : '' }}</view>
|
|
</view>
|
|
<view class="items">
|
|
<view class="label">兴趣爱好：</view>
|
|
<view class="value">{{ hobby && hobby.hobbyRemark ? hobby.hobbyRemark : '' }}</view>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</view>
|
|
</wux-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import wuxPopup from '../dist/popup/index';
|
|
import {
|
|
communitySelfOrgDetail,
|
|
getServiceTypeRelationByHobbyCode,
|
|
icpartyunitDetail,
|
|
residentEduInfo,
|
|
residentHobbyInfo,
|
|
staffdetailv2,
|
|
volunteerDetail
|
|
} from '../../utils/statisticsApi';
|
|
export default {
|
|
components: {
|
|
wuxPopup
|
|
},
|
|
data() {
|
|
return {
|
|
detail: {
|
|
unitName: '',
|
|
typeName: '',
|
|
serviceMatterNameList: '',
|
|
contact: '',
|
|
contactMobile: '',
|
|
address: '',
|
|
organizationName: '',
|
|
categoryName: '',
|
|
serviceItem: '',
|
|
principalName: '',
|
|
principalPhone: '',
|
|
name: '',
|
|
mobile: '',
|
|
idCard: '',
|
|
orgName: '',
|
|
szsqRoles: [],
|
|
age: '',
|
|
|
|
houseInfo: {
|
|
homeName: ''
|
|
}
|
|
},
|
|
education: {
|
|
cultureLevelName: ''
|
|
},
|
|
hobby: {
|
|
hobbyRemark: ''
|
|
},
|
|
typeList: {
|
|
1: '志愿者',
|
|
2: '联建单位',
|
|
3: '社区自组织',
|
|
4: '网格员',
|
|
5: '公益岗'
|
|
},
|
|
id: '',
|
|
type: '',
|
|
rowData: ''
|
|
};
|
|
},
|
|
props: {
|
|
visible: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
data: {
|
|
type: Object,
|
|
default: () => {}
|
|
}
|
|
},
|
|
mounted() {
|
|
// 处理小程序 ready 生命周期
|
|
this.$nextTick(() => this.ready());
|
|
},
|
|
methods: {
|
|
ready: function () {},
|
|
|
|
close() {
|
|
this.$emit('close');
|
|
},
|
|
|
|
getData(type) {
|
|
if (type === 1) {
|
|
this.getVolunteer();
|
|
}
|
|
if (type === 2) {
|
|
this.getCompany();
|
|
}
|
|
if (type === 3) {
|
|
this.getCommunity();
|
|
}
|
|
if (type === 4) {
|
|
this.getGridOperator();
|
|
}
|
|
if (type === 5) {
|
|
this.getVolunteer();
|
|
}
|
|
},
|
|
|
|
getAgeByDateOfBirth(birthDate) {
|
|
var currentDate = new Date();
|
|
var yearDiff = currentDate.getFullYear() - birthDate.getFullYear();
|
|
var monthDiff = currentDate.getMonth() - birthDate.getMonth();
|
|
var dayDiff = currentDate.getDate() - birthDate.getDate();
|
|
if (monthDiff < 0 || (monthDiff === 0 && dayDiff < 0)) {
|
|
yearDiff--;
|
|
}
|
|
console.log(yearDiff, 'yearDiff');
|
|
return yearDiff;
|
|
},
|
|
|
|
// 志愿者 公益岗
|
|
getVolunteer() {
|
|
volunteerDetail(this.id).then(({ data }) => {
|
|
data.age = data.birthday ? this.getAgeByDateOfBirth(new Date(data.birthday)) : '未知';
|
|
this.setData({
|
|
detail: data || {}
|
|
});
|
|
});
|
|
residentEduInfo(this.id).then(({ data }) => {
|
|
this.setData({
|
|
education: data || {}
|
|
});
|
|
});
|
|
residentHobbyInfo(this.id).then(({ data }) => {
|
|
this.setData({
|
|
hobby: data || {}
|
|
});
|
|
});
|
|
},
|
|
|
|
// 单位
|
|
getCompany() {
|
|
icpartyunitDetail({
|
|
id: this.id
|
|
}).then(({ data }) => {
|
|
data.serviceMatterNameList = data.serviceMatterNameList ? data.serviceMatterNameList.join('、') : '';
|
|
this.setData({
|
|
detail: data || {}
|
|
});
|
|
});
|
|
},
|
|
|
|
// 社区
|
|
getCommunity() {
|
|
communitySelfOrgDetail(this.id).then(({ data }) => {
|
|
this.setData({
|
|
detail: data || {}
|
|
});
|
|
});
|
|
},
|
|
|
|
// 网格
|
|
getGridOperator() {
|
|
staffdetailv2({
|
|
staffId: this.id
|
|
}).then(({ data }) => {
|
|
this.setData({
|
|
detail: data || {}
|
|
});
|
|
});
|
|
}
|
|
},
|
|
created: function () {},
|
|
watch: {
|
|
data: {
|
|
handler: function ({ id, type, data }) {
|
|
console.log(id, type, data);
|
|
this.setData({
|
|
id,
|
|
type,
|
|
rowData: data
|
|
});
|
|
this.getData(type);
|
|
},
|
|
|
|
immediate: true,
|
|
deep: true
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style>
|
|
.wux-popup__content {
|
|
background: none !important;
|
|
}
|
|
|
|
.popup-container {
|
|
padding: 32rpx 20rpx 50rpx;
|
|
background: linear-gradient(180deg, #dbeeff 0%, #f4faff 100%);
|
|
border-radius: 30rpx;
|
|
}
|
|
|
|
.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;
|
|
}
|
|
|
|
.popup-content {
|
|
background: #fff;
|
|
border-radius: 20px;
|
|
padding: 30rpx;
|
|
}
|
|
.items {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
text-align: left;
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
color: #333333;
|
|
margin-bottom: 29rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.items .label {
|
|
white-space: nowrap;
|
|
min-width: 160rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.tel {
|
|
width: 126rpx;
|
|
height: 62rpx;
|
|
position: absolute;
|
|
top: calc(50% - 31rpx);
|
|
right: 0;
|
|
}
|
|
</style>
|
|
|