Skip to content

Y
ydLife
Commit 3de4043d by zeyang
Options

1.增加活动分享页面和活动详情

parent 9349474d
Showing with 255 additions and 103 deletions
src/app/app.component.html
<!--The content below is only a placeholder and can be replaced.-->
<div ydlifeScroll>
<div [ngStyle]="{'padding-bottom':isShowIndexBtn ? '70px' : '0'}">
<div [ngStyle]="{'padding-bottom':isShowIndexBtn ? (isShowhead ? '70px':'0') : '0'}">
<router-outlet></router-outlet>
</div>
<ydlife-guide-page *ngIf="shareGuidePageEnable"></ydlife-guide-page>
......
src/app/app.component.ts
......@@ -2,37 +2,40 @@ import { Component, ElementRef, OnDestroy, OnInit } from '@angular/core';
import { AuthService } from "./auth/auth.service";
import { LifeCommonService } from "./common/life-common.service";
import { Subscription } from "rxjs/index";
import {Router, NavigationStart, ActivatedRoute, NavigationEnd, ActivationEnd} from '@angular/router';
import { Router, NavigationStart, ActivatedRoute, NavigationEnd, ActivationEnd } from '@angular/router';
import { MyService } from './my/my.service';
declare var wx: any;
declare var wx : any;
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit, OnDestroy {
shareGuidePageEnable: boolean;
subscription: Subscription;
currentVersion: any;
isNeedAlert: boolean;
dialogInfo: any;
shareGuidePageEnable : boolean;
subscription : Subscription;
currentVersion : any;
isNeedAlert : boolean;
dialogInfo : any;
// 是否显示首页浮标
isShowIndexBtn: boolean;
loginId:any;
isShowIndexBtn : boolean;
loginId : any;
// 提问icon显示隐藏
askIconFlag:boolean = true;
iconShowFlag:boolean = true;
askIconFlag : boolean = true;
iconShowFlag : boolean = true;
isShowhead : boolean = true;
// 0是未看 1是已看
viewStatus:number;
lifeCustomerInfo:any;
constructor(private router: Router,
private authService: AuthService,
private lifeCommonService: LifeCommonService,
private activatedRoute:ActivatedRoute,
private myService:MyService,
private el:ElementRef) {
viewStatus : number;
lifeCustomerInfo : any;
constructor(private router : Router,
private authService : AuthService,
private lifeCommonService : LifeCommonService,
private activatedRoute : ActivatedRoute,
private myService : MyService,
private el : ElementRef) {
this.subscription = lifeCommonService.shareStatus$.subscribe(status => {
this.shareGuidePageEnable = status == '1';
})
......@@ -42,34 +45,34 @@ export class AppComponent implements OnInit, OnDestroy {
}
public menuLists = [
{key:1,name:'首页',icon:'index',link:'/'},
{key:2,name:'产品库',icon:'product',link:'/product'},
{key:3,name:'日程',icon:'schedule',link:'/todo'},
{key:4,name:'我的',icon:'mine',link:'/mine'},
{ key: 1, name: '首页', icon: 'index', link: '/' },
{ key: 2, name: '产品库', icon: 'product', link: '/product' },
{ key: 3, name: '日程', icon: 'schedule', link: '/todo' },
{ key: 4, name: '我的', icon: 'mine', link: '/mine' },
]
public selectedMenuKey:number=1;
public selectedMenuKey : number = 1;
// 点击底部菜单
menuSelect(item){
menuSelect(item) {
this.selectedMenuKey = item.key;
this.router.navigate([item.link]);
}
closeDialog(e){
if(e.target.className.indexOf('tipsInfoContainer')>-1){
closeDialog(e) {
if (e.target.className.indexOf('tipsInfoContainer') > -1) {
this.viewStatus = 1;
sessionStorage.setItem('hadView','true')
sessionStorage.setItem('hadView', 'true')
}
}
viewDetail(){
viewDetail() {
this.viewStatus = 1;
sessionStorage.setItem('hadView','true');
sessionStorage.setItem('hadView', 'true');
this.router.navigate(['/renewal_reminder'])
}
ngOnInit() {
sessionStorage.setItem('iconShowFlag','true');
sessionStorage.setItem('iconShowFlag', 'true');
this.lifeCustomerInfo = JSON.parse(localStorage.getItem('lifeCustomerInfo')) ? JSON.parse(localStorage.getItem('lifeCustomerInfo')) : null;
this.loginId = this.lifeCustomerInfo ? this.lifeCustomerInfo.mobileNo:null;
this.loginId = this.lifeCustomerInfo ? this.lifeCustomerInfo.mobileNo : null;
this.authService.obtainToken(this.loginId).subscribe(res => {
if (res['success']) {
localStorage.setItem('lifeToken', res['data']['token']);
......@@ -83,44 +86,49 @@ export class AppComponent implements OnInit, OnDestroy {
// 控制首页浮标显示与否和底部菜单
this.isShowIndexBtn = event.url.indexOf('/login') < 0;
this.iconShowFlag = !!localStorage.getItem('lifeCustomerInfo');
if((event.url.indexOf('/activityDetail') >=0 && event.url.indexOf('shareCode') >=0)
|| event.url.indexOf('/aiofp')>=0
){
this.iconShowFlag=false;
}
if(event.url.indexOf('/material/')>=0
|| event.url.indexOf('/inviter')>=0
|| event.url.indexOf('/register')>=0
|| event.url.indexOf('/invitees')>=0
|| event.url.indexOf('/video/')>=0
|| (event.url.indexOf('/activityDetail') >=0 && event.url.indexOf('shareCode') >=0)
|| event.url.indexOf('/aiofp')>=0
){
if ((event.url.indexOf('/activityDetail') >= 0 && event.url.indexOf('shareCode') >= 0)
|| event.url.indexOf('/aiofp') >= 0
) {
this.iconShowFlag = false;
}
if (event.url.indexOf('/material/') >= 0
|| event.url.indexOf('/inviter') >= 0
|| event.url.indexOf('/register') >= 0
|| event.url.indexOf('/invitees') >= 0
|| event.url.indexOf('/video/') >= 0
|| (event.url.indexOf('/activityDetail') >= 0 && event.url.indexOf('shareCode') >= 0)
|| event.url.indexOf('/aiofp') >= 0
) {
this.isShowIndexBtn = false;
}
if (event.url.indexOf('/activityDetail') >= 0) {
this.isShowhead = false;
}
// 更新底部图标状态
if(event.url.indexOf('/product')===0){
if (event.url.indexOf('/product') === 0) {
this.selectedMenuKey = 2
}else if(event.url.indexOf('/todo')===0){
} else if (event.url.indexOf('/todo') === 0) {
this.selectedMenuKey = 3
}else if(event.url == '/' || event.url == '/my'){
} else if (event.url == '/' || event.url == '/my') {
this.selectedMenuKey = 1
// 查询是否有续期提醒订单
if(sessionStorage.getItem('hadView')){
if (sessionStorage.getItem('hadView')) {
this.viewStatus = 1;
}else{
if(this.lifeCustomerInfo){
} else {
if (this.lifeCustomerInfo) {
this.queryNoticeList();
}
}
}else if(event.url.indexOf('/mine')===0){
} else if (event.url.indexOf('/mine') === 0) {
this.selectedMenuKey = 4
}else{
} else {
this.selectedMenuKey = 0;
}
}
if(event instanceof ActivationEnd){
if (event instanceof ActivationEnd) {
this.lifeCommonService.setTitle(`${event.snapshot.data[0] && event.snapshot.data[0].title ? event.snapshot.data[0].title : '银盾保险经纪'}`)
}
});
......@@ -148,13 +156,13 @@ export class AppComponent implements OnInit, OnDestroy {
}
// 获取是否有续期提醒订单
queryNoticeList(){
this.myService.queryNoticeList({practitionerId:this.lifeCustomerInfo.practitionerId,status:0}).subscribe(res=>{
if(res['success']){
if(res['data']['list'] && res['data']['list'].length > 0){
queryNoticeList() {
this.myService.queryNoticeList({ practitionerId: this.lifeCustomerInfo.practitionerId, status: 0 }).subscribe(res => {
if (res['success']) {
if (res['data']['list'] && res['data']['list'].length > 0) {
this.viewStatus = 0;
}else{
sessionStorage.setItem('hadView','true')
} else {
sessionStorage.setItem('hadView', 'true')
}
}
})
......@@ -197,8 +205,8 @@ export class AppComponent implements OnInit, OnDestroy {
})
}
close(){
this.askIconFlag=this.iconShowFlag=false
sessionStorage.setItem('iconShowFlag',this.iconShowFlag+'')
close() {
this.askIconFlag = this.iconShowFlag = false
sessionStorage.setItem('iconShowFlag', this.iconShowFlag + '')
}
}
\ No newline at end of file
src/app/my/activity-detail/activity-detail.component.html
<div class="content" id="content">
<div id="offsetHeight">
<div class="imgBox">
<img src="assets/images/activity/activityTitle.png">
<div class="agentBox" *ngIf="agentInfo">
<div class="headImagePath">
<img style="width: 40px;border-radius: 200px;" [src]="agentInfo.headImagePath ? agentInfo.headImagePath : 'assets/images/icons/meng.png'" alt="经纪人头像">
<img style="width: 40px;border-radius: 200px;"
[src]="agentInfo.headImagePath ? agentInfo.headImagePath : 'assets/images/icons/meng.png'"
alt="经纪人头像">
</div>
<div class="agentName">
<span style="color:#ff9700">{{agentInfo.agentName}}</span>邀请您一起
......@@ -11,7 +14,8 @@
</div>
<div id="tabBox" class="tabBox">
<div *ngFor="let item of tabList" [ngClass]="item.select?'tabItemXz':'tabItem'" (click)="selectTab(item)">
<div *ngFor="let item of tabList" [ngClass]="item.select?'tabItemXz':'tabItem'"
(click)="selectTab(item)">
{{item.name}}
</div>
</div>
......@@ -28,7 +32,7 @@
<div id="tab4" class="imgBox"><img src="assets/images/activity/activity04.png"></div>
<div id="tab5" class="imgBox"><img src="assets/images/activity/activity05.png"></div>
<div id="tab6" class="imgBox"><img src="assets/images/activity/activity06.png"></div>
<div class="imgBox">
<div class="imgBox" [ngClass]="shareCode?'maginT':'marginF'" >
<img src="assets/images/activity/activity07.png">
<div (click)="c_guanw()" class="buttonBox" style="left: 8.5%;bottom:20%;padding: 2px 10px;">
银盾官网了解更多
......@@ -36,8 +40,8 @@
</div>
<div class="shareBox" id="shareBox">
<div (click)="share()" style="color: #000;text-align: center;">
<span style="font-size: 20px;" class="iconfont icon-zhuanfaxian" ></span>
<div >
<span style="font-size: 20px;" class="iconfont icon-zhuanfaxian"></span>
<div>
分享
</div>
</div>
......@@ -47,27 +51,46 @@
</div>
</div>
</div>
<div class="submitBox" *ngIf="isShowSubmitBox">
<div class="closeButton">
<span (click)="isShowSubmitBox=false" style="font-size: 24px;color: #b0b0b0;" class="iconfont icon-guanbi" ></span>
<div class="shareFixedBox" (click)="share()">
<div>
<span style="font-size: 15px;" class="iconfont icon-zhuanfaxian"></span>
</div>
<div style="font-size: 12px;margin-top: -4px;">
分享
</div>
</div>
<div [ngClass]="shareCode?'submitBox':'submitBox2'" id="submitBox" *ngIf="isShowSubmitBox">
<div class="submitBoxTitle">
<div>
了解考察
</div>
<div>
<span (click)="isShowSubmitBox=false" style="font-size: 24px;color: #b0b0b0;font-weight: bolder;"
class="iconfont icon-guanbi"></span>
</div>
</div>
<div class="submitBoxTitle">了解考察</div>
<div class="submitBoxContent">
<div class="line">
<div class="lineLabel">姓名</div>
<div class="lineValue"><input [(ngModel)]="reName" style="border: 0px;background-color: rgba(246, 246, 246, 1);text-align: right;width: 100%;" type="text" placeholder="请输入姓名" ></div>
<div class="lineValue"><input [(ngModel)]="reName" maxlength="30"
style="border: 0px;background-color: rgba(246, 246, 246, 1);text-align: right;width: 100%;"
type="text" placeholder="请输入姓名"></div>
</div>
<div class="line">
<div class="lineLabel">电话</div>
<div class="lineValue"><input [(ngModel)]="mobileNo" style="border: 0px;background-color: rgba(246, 246, 246, 1);text-align: right;width: 100%;" type="number" placeholder="请输入手机号"></div>
<div class="lineLabel">手机</div>
<div class="lineValue"><input [(ngModel)]="mobileNo" maxlength="11"
style="border: 0px;background-color: rgba(246, 246, 246, 1);text-align: right;width: 100%;"
type="tel" placeholder="请输入手机号"></div>
</div>
</div>
<div class="submitButtonBox">
<div class="submitButton" (click)="c_submit()" >
<div class="submitButton" (click)="c_submit()">
提交申请
</div>
</div>
</div>
</div>
</div>
<!-- <div class="shareCus" (click)="share()" *ngIf="this.lifeCommonService.checkDeviceType() == 3">
<span style="font-size: 20px;">分享</span>
......@@ -84,5 +107,3 @@
</div>
<ydlife-toast *ngIf="toastDialog" [toastInfo]="toastInfo"></ydlife-toast>
<div #payForm hidden></div>
\ No newline at end of file
src/app/my/activity-detail/activity-detail.component.scss
.content{
-webkit-appearance: none;
background-color: #071999;
padding-bottom: 50px;
position: relative;
height: 100%;
height: calc(100%-500px);
overflow: auto;
scroll-behavior: smooth;
.submitBox2{
position: fixed;
bottom: 70px;
left: 0;
z-index: 999;
background-color: #fff;
width: 100%;
font-size: 18px;
color: #000;
border-radius:15px 15px 0 0;
}
.submitBox{
position: fixed;
bottom: 0;
......@@ -15,15 +27,16 @@
font-size: 18px;
color: #000;
border-radius:15px 15px 0 0;
.closeButton{
text-align: right;
padding-top: 7px;
padding-right: 10px;
margin-bottom: -10px;
}
.submitBoxTitle{
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #eee;
padding: 0 20px 2px;
padding: 7px 20px 5px;
font-weight: bold;
font-size: 16px;
}
.submitBoxContent{
padding:15px 20px 0;
......@@ -35,8 +48,13 @@
display: flex;
justify-content: space-between;
margin-bottom: 10px;
.lineLabel{
font-weight: bold;
}
.lineValue{
flex-grow: 0.8;
}
input::placeholder {
font-size: 16px;
......@@ -55,7 +73,6 @@
margin:20px 50px 40px ;
}
}
}
.shareBox{
z-index: 99;
position: fixed;
......@@ -77,13 +94,29 @@
margin-left: 30px;
}
}
.shareFixedBox{
color: #fff;
background-color: #071999;
z-index: 999;
position: fixed;
bottom:170px;
right: 20px;
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.tabBox{
display: flex;
flex-direction: row;
align-items: center;
overflow-x: scroll;
width: 100%;
padding: 2% 3.2%;
padding: 0% 3.2%;
height: 20%;
position: absolute;
bottom: 4%;
}
......@@ -110,7 +143,7 @@
color: transparent;
}
.tabItem{
margin: 0 0.5%;
margin: 0 2px;
color: #736253;
background-color: #fff;
border-radius: 200px;
......@@ -120,7 +153,7 @@
}
.tabItemXz{
position: relative;
margin: 0 0.5%;
margin: 0 2px;
color: #fff;
background-color: #e0a862;
border-radius: 200px;
......@@ -181,6 +214,18 @@
}
}
}
.maginT{
margin-bottom: 70px;
}
.marginF{
margin-bottom: 120px;
}
.content::-webkit-scrollbar {
width: 0;
height: 0;
color: transparent;
}
@keyframes scale {
0% {
transform: scale(1);
......
src/app/my/activity-detail/activity-detail.component.ts
......@@ -96,7 +96,7 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
let windowH = window.outerHeight;
document.getElementById("content").style.height=windowH+'px';
let bindhandleScroll = this.handleScroll.bind(this);
document.addEventListener('scroll',bindhandleScroll, true);
document.getElementById("content").addEventListener('scroll',bindhandleScroll);
}
......@@ -105,11 +105,50 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
this.articleTrackSave();
sessionStorage.removeItem('articleTrackId');
}
document.removeEventListener('scroll', this.handleScroll, true);
document.getElementById("content").removeEventListener('scroll', this.handleScroll);
}
selectTab(item) {
// document.getElementById(item.key).scrollIntoView({ behavior: 'auto',block:'center' });
document.getElementById("content").scrollTop = document.getElementById(item.key).offsetTop-300;
// console.log(document.getElementById("content").scrollTop);
// console.log(document.getElementById(item.key).offsetTop);
}
handleScroll() {
// this.scrollTop = document.documentElement.scrollTop || document.body.scrollTop || window.pageYOffset;
//盒子高度
let clientHeight = document.getElementById("offsetHeight").clientHeight - document.getElementById("content").clientHeight+(this.shareCode?70:120);
//滑动是否是横向
if(this.scrollTop==document.getElementById("content").scrollTop){
}else{
//滑动距离顶部高度
this.scrollTop=document.getElementById("content").scrollTop;
//高度滑动百分比
let scrollTopBfb = this.scrollTop / clientHeight;
//窗口宽度
let winWidth=document.getElementById("content").clientWidth;
//可滚动宽度
let clientWidth= (78*6)-winWidth;
document.getElementById("tabBox").scrollLeft = clientWidth*scrollTopBfb;
//滚动到顶判断
if(this.scrollTop==0){
document.getElementById("content").scrollTo({
top:1
});
}
//滚动到底判断
if(clientHeight==this.scrollTop){
document.getElementById("content").scrollTo({
top:this.scrollTop-1
});
}
if(!this.offsetTop){
this.offsetTop = document.getElementById("tabBox").offsetTop;
}
......@@ -165,6 +204,10 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
this.tabList[5].select = true;
}
}
}
c_guanw(){
location.href='https://www.ydinsurance.cn/';
}
......@@ -224,7 +267,7 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
}
c_aiofp(){
document.removeEventListener('scroll', this.handleScroll, true);
document.getElementById("content").removeEventListener('scroll', this.handleScroll, true);
this.router.navigate(['/aiofp']);
}
......@@ -232,14 +275,13 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
getWxUserInfo(trackId:any) {
this.myService.getWxUserInfo(trackId+'&type=activity').subscribe(res => {
if (res['success']) {
localStorage.setItem("activityBol",window.location.href);
this.paymentForm = res['data'].paymentForm;
this.getOrPost(this.paymentForm.action, this.paymentForm.param, this.paymentForm.charset, this.paymentForm.actionType);
}
})
}
selectTab(item) {
document.getElementById(item.key).scrollIntoView({ behavior: 'smooth',block:'center' });
}
// 点击分享
share() {
......@@ -285,7 +327,8 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
channel: 1,
url: window.location.href
};
this.lifeCommonService.wxShare(this.articleInfo.title, this.lifeCommonService.getTwenty(this.agentInfo.agentName+this.articleInfo.digest, 38), `${window.location.origin}${window.location.pathname}?shareCode=${this.articleShareCodeSaveInfo.shareCode}`, this.articleInfo.coverUrl);
// this.lifeCommonService.wxShare(this.articleInfo.title, this.lifeCommonService.getTwenty(this.agentInfo.agentName+this.articleInfo.digest, 38), `${window.location.origin}${window.location.pathname}?shareCode=${this.articleShareCodeSaveInfo.shareCode}`, this.articleInfo.coverUrl);
this.lifeCommonService.wxShare(this.articleInfo.title, (this.agentInfo.agentName+this.articleInfo.digest), `${window.location.origin}${window.location.pathname}?shareCode=${this.articleShareCodeSaveInfo.shareCode}`, this.articleInfo.coverUrl);
this.myService.articleShareCodeSave(this.articleShareCodeSaveInfo).subscribe(res => {
});
......@@ -294,6 +337,7 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
// 保存客户痕迹:
// 有id就是出 没id就是进
articleTrackSave() {
const param = {
id: sessionStorage.getItem('articleTrackId') ? sessionStorage.getItem('articleTrackId') : null,
shareCode: this.shareCode,
......@@ -304,7 +348,7 @@ export class ActivityDetailComponent implements OnInit, OnDestroy {
};
this.myService.articleTrackSave(param).subscribe(res => {
sessionStorage.setItem('articleTrackId', res['data']['id']);
if (this.lifeCommonService.getQueryString('state') != '1') {
if (this.state != '1' && localStorage.getItem("activityBol")!=window.location.href) {
this.getWxUserInfo(res['data']['id']);
}
})
......
src/app/my/activity/activity.component.ts
......@@ -94,7 +94,7 @@ export class ActivityComponent implements OnInit {
whoRead(activityItem){
if(activityItem.num > 0){
this.router.navigate(['/activity_read',activityItem.id])
this.router.navigate(['/article_read',activityItem.id])
}else{
const toast = ToastService.show('暂时无人阅读您分享的文章！', 0);
setTimeout(() => {
......
src/app/my/aiofp/aiofp.component.html
<div class="content" id="content">
<div class="imgBox">
<img src="assets/images/activity/aiofp.png">
<div class="backFixedBox" (click)="back()">
<div class="tuichuBox">
<span style="font-size: 15px;" class="iconfont icon-arrow-right-bottom" ></span>
</div>
<div style="font-size: 12px;margin-top: -4px;">
返回
</div>
</div>
</div>
</div>
src/app/my/aiofp/aiofp.component.scss
......@@ -6,7 +6,26 @@
.imgBox{
position: relative;
width: 100%;
.backFixedBox{
color: #fff;
background-color: #071999;
z-index: 999;
position: absolute;
bottom:23%;
right: 20px;
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.tuichuBox{
transform: rotate(180deg);
}
}
}
}
......
src/app/my/aiofp/aiofp.component.ts
......@@ -19,11 +19,14 @@ export class AiofpComponent implements OnInit, OnDestroy {
ngOnInit() {
let windowH = window.outerHeight;
document.getElementById("content").style.height=windowH+'px';
document.getElementById("content").style.height = windowH + 'px';
}
ngOnDestroy() {
}
back() {
window.history.back();
}
}
\ No newline at end of file
src/app/my/my-routing.module.ts
......@@ -159,7 +159,7 @@ const myRoutes: Routes = [
{ path: 'articleDetail/:id',component:ArticleDetailComponent,data:[{title:'文章分享'}]},
{ path: 'activity/:mdDropOptionId', component:ActivityComponent,data:[{title:'活动分享'}]},
{ path: 'activityDetail/:id',component:ActivityDetailComponent,data:[{title:'加入银盾创投计划'}]},
{ path: 'aiofp',component:AiofpComponent,data:[{title:'AIOFO'}]},
{ path: 'aiofp',component:AiofpComponent,data:[{title:'AIOFP详细介绍'}]},
{ path: 'article_read/:id',component:ArticleReadComponent,canActivate:[AuthGuard],data:[{title:'文章分享'}]},
{ path: 'salary_detail',component:SalaryDetailComponent,canActivate:[AuthGuard],data:[{title:'薪资详情'}]},
{ path: 'salary_detail/:id',component:SalaryFirstYearComponent,canActivate:[AuthGuard],data:[{title:'薪资详情'}]},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment