关联亲属

src/projects/pension/apis/Master/relatives.js

@@ -0,0 +1,34 @@
+import request from '@/utils/request'
+import Qs from 'qs';
+
+
+//获取亲属列表
+export function getRelationList() {
+	return request({
+		url: '/mobile/relationApi/relationList',
+		data: Qs.stringify({}),
+		method: 'post',
+	})
+}
+
+//获取亲属详情
+export function getRelationInfo(popedomId) {
+	return request({
+		url: '/mobile/relationApi/findByPopedomId',
+		data: Qs.stringify({
+			popedomId: popedomId
+		}),
+		method: 'post',
+	})
+}
+
+//清除亲属关系
+export function delRelation(popedomId) {
+	return request({
+		url: '/mobile/relationApi/clearRelation',
+		data: Qs.stringify({
+			popedomId: popedomId
+		}),
+		method: 'post',
+	})
+}

src/projects/pension/router/master.js

@@ -283,12 +283,12 @@ const routesMaster = [
 				],
 			},
 
-			//亲情
+			//关联亲属
 			{
 				path: 'relatives',
 				component: () => import('../views/Layout.vue'),
 				children: [
-					//亲情列表
+					//亲属列表
 					{
 						path: '',
 						name: 'MasterRelatives',
@@ -296,11 +296,11 @@ const routesMaster = [
 						meta: {
 							requireAuth: true,
 							role: [],
-							title: '亲情号码',
+							title: '亲属列表',
 							mode: true
 						}
 					},
-					//亲情详情
+					//亲属详情
 					{
 						path: 'info',
 						name: 'MasterRelativesInfo',
@@ -308,7 +308,7 @@ const routesMaster = [
 						meta: {
 							requireAuth: false,
 							role: [],
-							title: '亲情详情',
+							title: '亲属详情',
 						}
 					},
 				],

src/projects/pension/views/Master/Relatives/Home.vue

@@ -1,41 +1,89 @@
 <template>
-<div>
-    <header class="mui-bar mui-bar-nav">
-			<h1 class="mui-title">关联亲属</h1>
-			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-		</header>
+	<div>
+		<common @asynCallBack="asynCallBack"></common>
+		<top-header :pageTitle="pageTitle"></top-header>
+
 		<div class="mui-content vongi-qqhm">
 			<ul class="mui-table-view">
-				<li class="mui-table-view-cell">
-					<a class="mui-navigate-right" href="#">
-						<div class="mui-col-xs-8  mui-pull-left flew-items">
-							<div class="mui-media-object mui-pull-left "><img src="~$project/assets/img/03.jpg" width="50" /></div>
-							<div class="mui-media-body">
-								<h3>赵双龙<span class="mui-badge vongi-badge-pink">儿子</span></h3>
-								<p class='mui-ellipsis mui-h3'>18600001111</p>
-							</div>
-						</div>
-						<span class="mui-pull-right iconfont icon-ziyuan1"></span>
-					</a>
-				</li>
-				<li class="mui-table-view-cell">
-					<a class="mui-navigate-right" href="#">
+				<li v-for="(item,index) in recordList" class="mui-table-view-cell">
+					<router-link :to="{name:'MasterRelativesInfo',query:{'popedomId':item.popedomId}}" class="mui-navigate-right">
 						<div class="mui-col-xs-8  mui-pull-left flew-items">
-							<div class="mui-media-object mui-pull-left "><img src="~$project/assets/img/03.jpg" width="50" /></div>
+							<div class="mui-media-object mui-pull-left "><img :src="item.faceImageUrl" width="50" /></div>
 							<div class="mui-media-body">
-								<h3>赵双龙<span class="mui-badge vongi-badge-pink">儿子</span></h3>
-								<p class='mui-ellipsis mui-h3'>18600001111</p>
+								<h3>{{item.name}}<span class="mui-badge vongi-badge-pink" v-text="item.relationName"></span></h3>
+								<p class='mui-ellipsis mui-h3' v-text="item.phone"></p>
 							</div>
 						</div>
 						<span class="mui-pull-right iconfont icon-ziyuan1"></span>
-					</a>
+					</router-link>
 				</li>
 			</ul>
 		</div>
-</div>
+
+		<loading :visible="isLoading"></loading>
+	</div>
 </template>
 
 <script>
+	import * as API_Relatives from '@/apis/Master/relatives'
+	import Common from '$project/components/Common.vue'
+	import Loading from '$project/components/Loading.vue'
+	import TopHeader from '$project/components/TopHeader.vue'
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
+	export default {
+		name: 'MasterRelatives',
+		components: {
+			Common,
+			Loading,
+			TopHeader,
+		},
+		data() {
+			return {
+				pageTitle: '关联亲属',
+
+				isLoading: false,
+
+				recordList: []
+			}
+		},
+		created() {
+
+		},
+		methods: {
+			//获取列表
+			getList() {
+				this.isLoading = true;
+				API_Relatives.getRelationList().then(response => {
+					this.isLoading = false;
+
+					this.recordList = response.relationsList;
+
+				}).catch(error => {
+					this.isLoading = false;
+					mui.toast(error);
+				})
+			},
+			asynCallBack() {},
+		},
+		mounted() {
+			//获取列表
+			this.getList()
+		},
+		destroyed() {
+
+		},
+		computed: {
+			...mapGetters({
+				openId: 'wx_openid',
+				token: 'token',
+				person_data: 'person_data',
+				person_popedom: 'person_popedom',
+			})
+		}
+	}
 </script>
 
 <style scoped src="$project/assets/css/pension.css"></style>

src/projects/pension/views/Master/Relatives/Info.vue

@@ -1,27 +1,26 @@
 <template>
-<div>
-    <header class="mui-bar mui-bar-nav">
-			<h1 class="mui-title">亲属信息</h1>
-			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
-		</header>
+	<div>
+		<common @asynCallBack="asynCallBack"></common>
+		<top-header :pageTitle="pageTitle"></top-header>
+
 		<div class="mui-content">
 			<div class="mui-content-padded vongi-qingjiadt vongi-editme">
 				<form class="mui-input-group">
 					<div class="mui-input-row">
 						<label>姓名</label>
-						<span>赵刚</span>
+						<span v-text="detail.name"></span>
 					</div>
 					<div class="mui-input-row">
 						<label>手机号码</label>
-						<span>18600001111</span>
+						<span v-text="detail.phone"></span>
 					</div>
 					<div class="mui-input-row">
 						<label>身份证号</label>
-						<span>420400200001011010</span>
+						<span v-text="detail.idCard"></span>
 					</div>
 					<div class="mui-input-row">
 						<label>联系地址</label>
-						<span>湖北省荆州市沙市区富润·沙市花园</span>
+						<span v-text="detail.address"></span>
 					</div>
 				</form>
 			</div>
@@ -29,7 +28,7 @@
 				<form class="mui-input-group">
 					<div class="mui-input-row">
 						<label>亲属关系</label>
-						<span>儿子</span>
+						<span v-text="detail.relationName"></span>
 					</div>
 				</form>
 			</div>
@@ -37,21 +36,102 @@
 				<form class="mui-input-group">
 					<div class="mui-input-row">
 						<label>照片</label>
-						<span class="vongi-qingjiadt-photo"><img src="~$project/assets/img/audit1.png" /> </span>
-
+						<span class="vongi-qingjiadt-photo"><img :src="detail.faceImageUrl" /> </span>
 					</div>
 				</form>
 			</div>
 			<div class="vongi-btn vongi-login-btn">
-				<button class="mui-btn mui-btn-danger ">
-						<span class="iconfont icon-quxiaolianjie"></span>取消关联该亲属
-					</button>
+				<button class="mui-btn mui-btn-danger" @click="del">
+					<span class="iconfont icon-quxiaolianjie"></span>取消关联该亲属
+				</button>
 			</div>
 		</div>
-</div>
+
+		<loading :visible="isLoading"></loading>
+	</div>
 </template>
 
 <script>
+	import * as API_Relatives from '@/apis/Master/relatives'
+	import Common from '$project/components/Common.vue'
+	import Loading from '$project/components/Loading.vue'
+	import TopHeader from '$project/components/TopHeader.vue'
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
+	export default {
+		name: 'MasterRelatives',
+		components: {
+			Common,
+			Loading,
+			TopHeader,
+		},
+		data() {
+			return {
+				pageTitle: '亲属信息',
+
+				isLoading: false,
+
+				popedomId: this.$route.query.popedomId,
+				detail: {}
+			}
+		},
+		created() {
+
+		},
+		methods: {
+			//获取详情
+			getInfo() {
+				this.isLoading = true;
+				API_Relatives.getRelationInfo(this.popedomId).then(response => {
+					this.isLoading = false;
+
+					this.detail = response.person;
+
+				}).catch(error => {
+					this.isLoading = false;
+					mui.toast(error);
+				})
+			},
+			//取消亲属关系
+			del() {
+				var _this = this;
+				var btnArray = ['取消', '解绑'];
+				mui.confirm('确认取消关联此亲属？取关后系统将删除该亲属的相关信息，该名亲属将无法以您的亲属身份登录本系统。', '确认取消关联', btnArray, function(e) {
+					if (e.index == 1) {
+						_this.isLoading = true;
+						API_Relatives.delRelation(_this.popedomId).then(response => {
+							_this.isLoading = false;
+
+							mui.toast('处理成功');
+							_this.$router.go(-1);
+
+						}).catch(error => {
+							_this.isLoading = false;
+							mui.toast(error);
+						})
+					}
+				});
+			},
+			asynCallBack() {},
+		},
+		mounted() {
+			//获取详情
+			this.getInfo()
+		},
+		destroyed() {
+
+		},
+		computed: {
+			...mapGetters({
+				openId: 'wx_openid',
+				token: 'token',
+				person_data: 'person_data',
+				person_popedom: 'person_popedom',
+			})
+		}
+	}
 </script>
 
 <style scoped src="$project/assets/css/pension.css"></style>