|
|
@@ -12,196 +12,206 @@
|
|
|
<view class="card">
|
|
|
<zzx-icon name="wechat" size="14"></zzx-icon>
|
|
|
<view class="">邀请好友加入</view>
|
|
|
+ <button class="g-share-btn" open-type="share"></button>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="u-user-list-box">
|
|
|
- <view class="u-user-list" v-for="(item,index) in userList" :key="index" @click="selectUser(item)">
|
|
|
+ <view class="u-user-list" v-for="(item, index) in userList" :key="index" @click="selectUser(item)">
|
|
|
<view class="user-info">
|
|
|
- <view class="name">{{item.fullName}}</view>
|
|
|
- <view class="idcard">身份证 {{idCardHide(item.identityCard)}}</view>
|
|
|
+ <view class="name">{{ item.fullName }}</view>
|
|
|
+ <view class="idcard">身份证 {{ idCardHide(item.identityCard) }}</view>
|
|
|
</view>
|
|
|
<view class="">
|
|
|
- <zzx-icon :name="item.selOut?'selected' : 'unchecked'" size="14"></zzx-icon>
|
|
|
+ <zzx-icon :name="item.selOut ? 'selected' : 'unchecked'" size="14"></zzx-icon>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="height: 160rpx;"></view>
|
|
|
- <view class="u-select-btn" @click="confirmSelect">
|
|
|
- <button hover-class="hover-btn">确认选择:{{selTotal}}人</button>
|
|
|
+ <view class="u-select-btn" @click="confirmSelect" v-if="!nameText">
|
|
|
+ <button hover-class="hover-btn">确认选择:{{ selTotal }}人</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
- import { ref, onMounted, computed } from 'vue';
|
|
|
- import { http } from '@/utils/http';
|
|
|
- import { useCacheStore } from '@/stores/cache'
|
|
|
- import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
|
|
- import { RouterUtils, idCardHide } from '@/utils/util';
|
|
|
- const cache = useCacheStore()
|
|
|
- const userList = ref()
|
|
|
- const selTotal = ref(0)
|
|
|
- const pageNo = ref(1)
|
|
|
- const userinfo = computed(() => {
|
|
|
- return cache.get('USER_INFO')
|
|
|
- })
|
|
|
- const selectType=ref()
|
|
|
- onLoad((options) => {
|
|
|
- selectType.value=options.type
|
|
|
- console.log('options', options);
|
|
|
- if (options.name) {
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: options.name
|
|
|
- });
|
|
|
- }
|
|
|
- })
|
|
|
- onReachBottom(() => {
|
|
|
- pageNo.value++
|
|
|
- get_userList()
|
|
|
- })
|
|
|
- onMounted(() => {
|
|
|
- get_userList()
|
|
|
- })
|
|
|
-
|
|
|
- const get_userList = () => {
|
|
|
- http.get('/my/familyMembers/findFamilyMembers', { data: { userId: userinfo.value.id, pageNo: pageNo.value, pageSize:30 }, loading: true }).then((res) => {
|
|
|
- res.result.records = res.result.records.map((item:any) => ({
|
|
|
- ...item,
|
|
|
- selOut: false
|
|
|
- }))
|
|
|
- if (pageNo.value == 1) {
|
|
|
- userList.value = res.result.records
|
|
|
- } else {
|
|
|
- userList.value = [...userList.value, ...res.result.records]
|
|
|
- }
|
|
|
- })
|
|
|
+import { ref, onMounted, computed } from 'vue';
|
|
|
+import { http } from '@/utils/http';
|
|
|
+import { useCacheStore } from '@/stores/cache'
|
|
|
+import { onLoad, onReachBottom } from '@dcloudio/uni-app';
|
|
|
+import { RouterUtils, idCardHide } from '@/utils/util';
|
|
|
+const cache = useCacheStore()
|
|
|
+const userList = ref()
|
|
|
+const selTotal = ref(0)
|
|
|
+const pageNo = ref(1)
|
|
|
+const userinfo = computed(() => {
|
|
|
+ return cache.get('USER_INFO')
|
|
|
+})
|
|
|
+const selectType = ref()
|
|
|
+const nameText = ref()
|
|
|
+onLoad((options) => {
|
|
|
+ selectType.value = options.type
|
|
|
+ // console.log('options', options);
|
|
|
+ nameText.value = options.name
|
|
|
+ if (options.name) {
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: options.name
|
|
|
+ });
|
|
|
}
|
|
|
-
|
|
|
- const selArr=ref([])
|
|
|
- const selectUser = (item : any) => {
|
|
|
- item.selOut = !item.selOut
|
|
|
- if (item.selOut) {
|
|
|
- selTotal.value++
|
|
|
- selArr.value.push(item)
|
|
|
+})
|
|
|
+onReachBottom(() => {
|
|
|
+ pageNo.value++
|
|
|
+ get_userList()
|
|
|
+})
|
|
|
+onMounted(() => {
|
|
|
+ get_userList()
|
|
|
+})
|
|
|
+
|
|
|
+const get_userList = () => {
|
|
|
+ http.get('/my/familyMembers/findFamilyMembers', { data: { userId: userinfo.value.id, pageNo: pageNo.value, pageSize: 30 }, loading: true }).then((res) => {
|
|
|
+ res.result.records = res.result.records.map((item: any) => ({
|
|
|
+ ...item,
|
|
|
+ selOut: false
|
|
|
+ }))
|
|
|
+ if (pageNo.value == 1) {
|
|
|
+ userList.value = res.result.records
|
|
|
} else {
|
|
|
- selTotal.value--
|
|
|
- selArr.value = selArr.value.filter((i:any) => i.id != item.id)
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- const addUser = () => {
|
|
|
- RouterUtils.to_page('/pages/index/attestation/index');
|
|
|
- }
|
|
|
- const confirmSelect=()=>{
|
|
|
- if(selectType.value=='insure'){
|
|
|
- uni.$emit('insureUserData',selArr.value)
|
|
|
- }else{
|
|
|
- uni.$emit('userData',selArr.value)
|
|
|
+ userList.value = [...userList.value, ...res.result.records]
|
|
|
}
|
|
|
- uni.navigateBack()
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+const selArr = ref([])
|
|
|
+const selectUser = (item: any) => {
|
|
|
+ item.selOut = !item.selOut
|
|
|
+ if (item.selOut) {
|
|
|
+ selTotal.value++
|
|
|
+ selArr.value.push(item)
|
|
|
+ } else {
|
|
|
+ selTotal.value--
|
|
|
+ selArr.value = selArr.value.filter((i: any) => i.id != item.id)
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+const addUser = () => {
|
|
|
+ RouterUtils.to_page('/pages/index/attestation/index');
|
|
|
+}
|
|
|
+const confirmSelect = () => {
|
|
|
+ if (selectType.value == 'insure') {
|
|
|
+ uni.$emit('insureUserData', selArr.value)
|
|
|
+ } else {
|
|
|
+ uni.$emit('userData', selArr.value)
|
|
|
+ }
|
|
|
+ uni.navigateBack()
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
- .u-tips {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 6rpx;
|
|
|
- background: rgba(255, 163, 71, 0.1);
|
|
|
- padding: 20rpx;
|
|
|
-
|
|
|
- .icon {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- border-radius: 50%;
|
|
|
- background: #FFA347;
|
|
|
- color: #fff;
|
|
|
- font-size: 24rpx;
|
|
|
- text-align: center;
|
|
|
- line-height: 30rpx;
|
|
|
- }
|
|
|
+.u-tips {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 6rpx;
|
|
|
+ background: rgba(255, 163, 71, 0.1);
|
|
|
+ padding: 20rpx;
|
|
|
+
|
|
|
+ .icon {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ background: #FFA347;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 24rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 30rpx;
|
|
|
+ }
|
|
|
|
|
|
- &>text {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ &>text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
+}
|
|
|
+
|
|
|
+.u-card {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ margin-top: 20rpx;
|
|
|
|
|
|
- .u-card {
|
|
|
+ .card {
|
|
|
+ width: 336rpx;
|
|
|
+ height: 120rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 16rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-around;
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .card {
|
|
|
- width: 336rpx;
|
|
|
- height: 120rpx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 16rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- // flex-direction: column; 换行
|
|
|
- gap: 10rpx;
|
|
|
-
|
|
|
- &>view {
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ justify-content: center;
|
|
|
+ // flex-direction: column; 换行
|
|
|
+ gap: 10rpx;
|
|
|
+ position: relative;
|
|
|
+ &>view {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .u-user-list-box {
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 16rpx;
|
|
|
- padding: 20rpx;
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .u-user-list {
|
|
|
- margin-top: 24rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- border-bottom: 1rpx solid #F0F0F0;
|
|
|
-
|
|
|
- .name {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- margin-bottom: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .idcard {
|
|
|
- margin-bottom: 24rpx;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .g-share-btn {
|
|
|
+ position: absolute;
|
|
|
+ width: 300rpx;
|
|
|
+ height:110rpx;
|
|
|
+ opacity: 0;
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
|
|
|
+.u-user-list-box {
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ margin-top: 20rpx;
|
|
|
|
|
|
- .u-select-btn {
|
|
|
- position: fixed;
|
|
|
- bottom: 60rpx;
|
|
|
- width: 95%;
|
|
|
+ .u-user-list {
|
|
|
+ margin-top: 24rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ border-bottom: 1rpx solid #F0F0F0;
|
|
|
|
|
|
- &>button {
|
|
|
- width: 100%;
|
|
|
- height: 100rpx;
|
|
|
- line-height: 100rpx;
|
|
|
- background: #D3FD76;
|
|
|
- border-radius: 60rpx;
|
|
|
+ .name {
|
|
|
font-weight: bold;
|
|
|
- font-size: 32rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #222222;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
}
|
|
|
|
|
|
- &>button::after {
|
|
|
- border: none;
|
|
|
+ .idcard {
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+.u-select-btn {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 60rpx;
|
|
|
+ width: 95%;
|
|
|
+
|
|
|
+ &>button {
|
|
|
+ width: 100%;
|
|
|
+ height: 100rpx;
|
|
|
+ line-height: 100rpx;
|
|
|
+ background: #D3FD76;
|
|
|
+ border-radius: 60rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
|
|
|
- .hover-btn {
|
|
|
- background: #ccf371;
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
+ &>button::after {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ .hover-btn {
|
|
|
+ background: #ccf371;
|
|
|
+ color: #999999;
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
学习？学个屁