Skip to content

W
wisdom-ces
Commit e5236803 authored by wangqinghua's avatar wangqinghua
Browse files
Options

活动报名

parent 5a7ee4eb
Hide whitespace changes
Inline Side-by-side
Showing with 632 additions and 292 deletions
src/pages/activityApply/activityApply.ts → src/pages/activity/activityApply/activityApply.ts
View file @ e5236803
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, AlertController, ToastController, Events } from 'ionic-angular'; import { IonicPage, NavController, NavParams, AlertController, ToastController, Events } from 'ionic-angular';
import { MyActivityListPage } from '../myActivityList/myActivityList'; import { MyActivityListPage } from '../../myActivityList/myActivityList';
import { Http, Response } from '@angular/http'; import { Http, Response } from '@angular/http';
import { AppService, AppGlobal } from '../../service/appHttpService'; import { AppService, AppGlobal } from '../../../service/appHttpService';
@IonicPage() @IonicPage()
@Component({ @Component({
......
src/pages/activity/activityDetail/activityDetail.html 0 → 100644
View file @ e5236803
<ion-header>
<ion-navbar>
<ion-title text-center>活动报名</ion-title>
</ion-navbar>
</ion-header>
<ion-content class="content">
<div class="item1">
<div class="img-box">
<img class="item1-image" src="./assets/imgs/logo.png">
</div>
<div class="item1-content">
<div class="margin-5-0">
<label class="item1-title">上海市人民医院体检</label>
<!-- <label class="item1-title" *ngIf="activity.activityFbObject==1">{{activity.activityName}}（全体人员）</label>
<label class="item1-title" *ngIf="activity.activityFbObject==2">{{activity.activityName}}（用户组）</label>
<label class="item1-title" *ngIf="activity.activityFbObject==3">{{activity.activityName}}（处事部门）</label> -->
<div class="item1-content-box">
<ion-icon name="md-contact" class="item1-icon"></ion-icon>
<!-- <span class="item-type">{{activity.activityType}}</span> -->
<span class="item-type">体检</span>
</div>
</div>
<div class="item1-introduction">
<!-- {{activity.activityIntro}} -->
{{introduce}}
<button class="btn-introduce" (click)="show()">具体介绍</button>
</div>
</div>
</div>
<div class="item2">
<ion-list class="item-list">
<ion-item class="list-title">
<label class="item-label">
<span class="item-title">
批次信息(最多可报名X个批次信息)
</span>
</label>
</ion-item>
<ion-item class="item2-content">
<div *ngFor="let batch of batches" class="item2-box" (click)="goBatchDetail(batch)">
<!--<span class="time">{{batch.time}}</span>-->
<!--<span class="quantity">剩余{{batch.quantity}}名</span>-->
<p>
<span class="color-666">批次名称:</span>
<span>批次名称</span>
<span class="activity-btn2" float-right>已报名</span>
</p>
<p>
<span class="color-666">截止时间:</span>
<span>2018-11-12</span>
<span class="color-24bafc" float-right>{{batch.quantity}}</span>
</p>
</div>
</ion-item>
</ion-list>
</div>
<!--<div class="item4 item-margin">-->
<!--<ion-list class="item-list">-->
<!--<ion-item>-->
<!--<label class="item-label">-->
<!--<span class="item-title">-->
<!--活动说明-->
<!--</span>-->
<!--</label>-->
<!--</ion-item>-->
<!--<ion-item>-->
<!--<label class="little-title-box">-->
<!--<span class="little-title">时间</span>-->
<!--</label>-->
<!--<label class="item4-content">{{activity.time}}</label>-->
<!--</ion-item>-->
<!--<ion-item>-->
<!--<label class="little-title-box">-->
<!--<span class="little-title">地点</span>-->
<!--</label>-->
<!--<label class="item4-content">{{activity.location}}</label>-->
<!--</ion-item>-->
<!--<ion-item>-->
<!--<label class="little-title-box">-->
<!--<span class="little-title">交通</span>-->
<!--</label>-->
<!--<label class="item4-content">{{activity.musterTime}}</label>-->
<!--</ion-item>-->
<!--<ion-item>-->
<!--<label class="little-title-box">-->
<!--<span class="little-title">参与</span>-->
<!--</label>-->
<!--<label class="item4-content">{{activity.deadlineTime}}</label>-->
<!--</ion-item>-->
<!--</ion-list>-->
<!--</div>-->
<!--<div class="item5 item-margin">-->
<!--<ion-list class="item-list">-->
<!--<ion-item>-->
<!--<label class="item-label">-->
<!--<span class="item-title">-->
<!--活动须知-->
<!--</span>-->
<!--</label>-->
<!--</ion-item>-->
<!--<ion-item class="item5-content">-->
<!--<p>1.体检人员在体检服务窗口出示身份证即可；</p>-->
<!--<p>2.体检前三天注意清淡饮食，规律作息；</p>-->
<!--<p>3.体检前一天20:00后避免进食；</p>-->
<!--<p>4.体检当天完成抽血、彩超后方可进食。</p>-->
<!--</ion-item>-->
<!--</ion-list>-->
<!--</div>-->
<!--<button ion-button block (click)="goJoinDetail()">人员参与情况</button>-->
</ion-content>
<div class="cover" *ngIf="isCover">
<div class="cover-content">
<div class="cover-content-box">
<h4 class="cover-content-title">具体介绍</h4>
<div class="cover-content-info">
<p>
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开 大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开 大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
</p>
</div>
<button ion-button block (click)="hidden()">
关闭
</button>
</div>
</div>
</div>
\ No newline at end of file
src/pages/activityDetail/activityDetail.scss → src/pages/activity/activityDetail/activityDetail.scss
View file @ e5236803
page-activityDetail { page-activityDetail {
.searchToolBar{ .searchToolBar {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
justify-content: left; justify-content: left;
box-sizing: border-box; box-sizing: border-box;
} }
.content{ .content {
background-color: #f1f1f1 background-color: #f1f1f1
} }
.item1{ .item1 {
background-color: white; background-color: white;
} }
.img-box{ .img-box {
width: 100%; width: 100%;
height: 135px; height: 135px;
overflow: hidden; overflow: hidden;
} }
.item1-content{ .item1-content {
margin-top: 12px; margin-top: 12px;
} }
.item1-title{ .item1-title {
margin-left: 15px; margin-left: 15px;
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
} }
.item1-content-box{ .item1-content-box {
display: inline-block; display: inline-block;
float: right; float: right;
margin-right: 15px; margin-right: 15px;
color: #80a7ee; color: #80a7ee;
font-size: 16px font-size: 16px
} }
.item1-introduction{
margin: 0 15px;
color: #9d9d9d;
padding-bottom: 10px;
line-height: 25px;
}
.item1-introduction {
margin: 0 15px;
color: #9d9d9d;
padding-bottom: 10px;
line-height: 25px;
}
.item-margin{ .item-margin {
margin-top: 17px margin-top: 17px
} }
.item-list{ .item-list {
margin-bottom: 0; margin-bottom: 0;
} }
.item-label{ .item-label {
border-left: 2px solid #498aff border-left: 2px solid #498aff
} }
.item-title{ .item-title {
color: #699fff; color: #699fff;
margin-left: 15px margin-left: 15px
} }
.item2-content{ .item2-content {
} }
.item2-box{ .item2-box {
width: 73px; margin: 8px 0;
height: 53px; padding: 10px;
margin: 5px 4.5px; display: flex;
display: flex; flex-direction: column;
flex-direction: column; justify-content: center;
align-items: center; box-sizing: border-box;
justify-content: center; font-size: 12px;
box-sizing: border-box; border: 1px solid #cccccc;
float: left; -webkit-border-radius: 4px;
font-size: 12px; -moz-border-radius: 4px;
border: 1px solid #cccccc; border-radius: 4px;
p{
} margin: 5px 0;
}
.time{ }
.time {
color: #5f5f5f color: #5f5f5f
} }
.quantity{ .quantity {
color: #ebac67 color: #ebac67
} }
.little-title-box{ .little-title-box {
border: 1px solid #cccccc; border: 1px solid #cccccc;
} }
.little-title{ .little-title {
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
margin:0 7px; margin: 0 7px;
} }
.change{ .change {
width: 25px; width: 25px;
height: 25px; height: 25px;
border-radius: 15px; border-radius: 15px;
margin: 0 5px ; margin: 0 5px;
background-color: #ef941f; background-color: #ef941f;
} }
.number{ .number {
width: 50px; width: 50px;
border: 1px solid #cccccc; border: 1px solid #cccccc;
} }
.item3-icon{ .item3-icon {
font-size: 18px; font-size: 18px;
} }
.remark-box{ .remark-box {
width: 100px; width: 100px;
height: 40px; height: 40px;
} }
.remark{ .remark {
border: 1px solid #cccccc; border: 1px solid #cccccc;
margin: 0 0 0 15px; margin: 0 0 0 15px;
} }
.item4-content{ .item4-content {
margin-left: 20px; margin-left: 20px;
font-size: 14px; font-size: 14px;
color: #666666; color: #666666;
} }
.item5-content p{ .item5-content p {
color: #5c5c5c; color: #5c5c5c;
} }
.cover{ .cover {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: rgba(0, 0, 0, 0.4); background: rgba(0, 0, 0, 0.4);
// opacity: 0.4; // opacity: 0.4;
z-index: 100; z-index: 100;
} }
.cover-content{ .cover-content {
position: fixed; position: fixed;
// height: 400px; // height: 400px;
width: 300px; width: 300px;
margin:auto; margin: auto;
left:0; left: 0;
right:0; right: 0;
top: 110px; top: 110px;
z-index: 1000; z-index: 1000;
background-color: white; background-color: white;
} }
.cover-content-box{ .cover-content-box {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
...@@ -170,9 +170,9 @@ page-activityDetail { ...@@ -170,9 +170,9 @@ page-activityDetail {
box-sizing: border-box; box-sizing: border-box;
margin: 15px 15px; margin: 15px 15px;
// width: 280px; // width: 280px;
} }
.cover-content-info{ .cover-content-info {
height: 280px; height: 280px;
border: 1px solid #cccccc; border: 1px solid #cccccc;
padding: 0 10px; padding: 0 10px;
...@@ -180,25 +180,50 @@ page-activityDetail { ...@@ -180,25 +180,50 @@ page-activityDetail {
color: #272727; color: #272727;
overflow: scroll; overflow: scroll;
width: 270px; width: 270px;
}
.cover-content-title{ }
.cover-content-title {
margin-top: 0; margin-top: 0;
} }
.btn-introduce{ .btn-introduce {
background-color: white; background-color: white;
padding: 3px 7px; padding: 3px 7px;
border: 1px solid #cccccc; border: 1px solid #cccccc;
border-radius: 10px; border-radius: 10px;
float: right; float: right;
color: #666666; color: #666666;
} }
.back-btn{ .back-btn {
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
.activity-btn1,
} .activity-btn2,
.activity-btn3,
.activity-btn4{
padding: 1px 6px;
border-radius: 4px;
}
.activity-btn1{
border: 1px solid #999;
color: #999;
}
.activity-btn2{
border: 1px solid #fa7587;
color: #fa7587;
}
.activity-btn3{
border: 1px solid #f8e8c1;
color: #f8e8c1;
}
.activity-btn4{
border: 1px solid #31b7fc;
color: #31b7fc;
}
.list-title .item-inner{
margin-right: 16px;
}
}
\ No newline at end of file
src/pages/activityDetail/activityDetail.ts → src/pages/activity/activityDetail/activityDetail.ts
View file @ e5236803
import { Component } from '@angular/core'; import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, AlertController, ToastController } from 'ionic-angular'; import { IonicPage, NavController, NavParams, AlertController, ToastController } from 'ionic-angular';
import { Http } from '@angular/http'; import {Http, Response} from '@angular/http';
import { AppService } from '../../service/appHttpService'; import { AppService } from '../../../service/appHttpService';
import { JoinDetailPage } from '../joinDetail/joinDetail'; import { JoinDetailPage } from '../../joinDetail/joinDetail';
import {BatchDetailPage} from "../batch-detail/batch-detail";
@IonicPage() @IonicPage()
@Component({ @Component({
...@@ -70,12 +71,31 @@ export class ActivityDetailPage { ...@@ -70,12 +71,31 @@ export class ActivityDetailPage {
time: "05/08", time: "05/08",
quantity: 20 quantity: 20
}]; }];
let orderId = this.navParams.get('orderid');
this.findMyOrderByOrderId(orderId);
} }
goJoinDetail(){ findMyOrderByOrderId(orderid){
let order = this.appService.ObserverHttpPost("/wisdomgroup/modules/order/findMyOrderByOrderId",{"orderid":orderid})
.subscribe((res: Response) => {
let data = res.json();
console.log(data);
}, error => {
this.appService.alert('网络异常！');
}
);
}
goJoinDetail(){
this.navCtrl.push("JoinDetailPage"); this.navCtrl.push("JoinDetailPage");
} }
goBatchDetail(){
this.navCtrl.push('BatchDetailPage');
}
//活动介绍限定65个字符串，多余以省略号代替 //活动介绍限定65个字符串，多余以省略号代替
subIntroduce(str: string) { subIntroduce(str: string) {
if (!str) this.introduce = ''; if (!str) this.introduce = '';
......
src/pages/activityList/activityList.html → src/pages/activity/activityList/activityList.html
View file @ e5236803
<ion-header> <ion-header>
<ion-toolbar> <ion-navbar>
<div class="searchToolBar"> <ion-title text-center>最新活动</ion-title>
<button ion-button clear small navPop style="padding: 0;" (click)="goBack()"> </ion-navbar>
<img class="back-btn" src="./assets/imgs/back.png" />
</button>
<ion-title text-center>最新活动</ion-title>
</div>
</ion-toolbar>
</ion-header> </ion-header>
<ion-content scrollbar-y="true" direction="y"> <ion-content scrollbar-y="true" direction="y">
...@@ -31,6 +26,7 @@ ...@@ -31,6 +26,7 @@
<button ion-button round class="btn btn1" *ngIf="item.activityState==2 && item.orderList.length==0 ">可报名</button> <button ion-button round class="btn btn1" *ngIf="item.activityState==2 && item.orderList.length==0 ">可报名</button>
<button ion-button round class="btn btn2" *ngIf="item.activityState==2 && item.orderList.length>0 ">已报名</button> <button ion-button round class="btn btn2" *ngIf="item.activityState==2 && item.orderList.length>0 ">已报名</button>
<button ion-button round class="btn btn3" *ngIf="item.activityState==2 && item.orderList.length>0 ">不可报名</button>
</div> </div>
<div class="content-box" (click)="goApplyDetails(item)"> <div class="content-box" (click)="goApplyDetails(item)">
<div class="content-item-box"> <div class="content-item-box">
...@@ -44,8 +40,12 @@ ...@@ -44,8 +40,12 @@
</div> </div>
</div> </div>
</div> </div>
<button class="sign-up" *ngIf="item.activityState==2 && item.orderList.length>0 " (click)="goDetail(item);$event.stopPropagation();">查看</button> <div class="content-button">
<button class="sign-up" *ngIf="item.activityState==2 && item.orderList.length==0 " (click)="goApply(item);$event.stopPropagation();">报名</button> <span>最新批次:</span>
<span>最新批次名称</span>
</div>
<!--<button class="sign-up" *ngIf="item.activityState==2 && item.orderList.length>0 " (click)="goDetail(item);$event.stopPropagation();">查看</button>-->
<!--<button class="sign-up" *ngIf="item.activityState==2 && item.orderList.length==0 " (click)="goApply(item);$event.stopPropagation();">报名</button>-->
</div> </div>
</ion-item> </ion-item>
</ion-list> </ion-list>
......
src/pages/activityList/activityList.scss → src/pages/activity/activityList/activityList.scss
View file @ e5236803
...@@ -29,22 +29,21 @@ page-activityList { ...@@ -29,22 +29,21 @@ page-activityList {
} }
.icon{ .icon{
width: 20px; width: 25px;
height: 20px; height: 24px;
margin-right: 5px; margin-right: 5px;
} }
.btn{ .btn{
// float: right;
background-color: white; background-color: white;
margin: 0 0; margin: 0 0;
font-size: 6px; font-size: 6px;
border-radius: 3px;
} }
.btn1{ .btn1{
border: 1px solid #69c4e2; border: 1px solid #de6461;
color: #69c4e2; color: #de6461;
} }
.btn2{ .btn2{
...@@ -52,6 +51,11 @@ page-activityList { ...@@ -52,6 +51,11 @@ page-activityList {
color: #90da91; color: #90da91;
} }
.btn2{
border: 1px solid #dddddd;
color: #dddddd;
}
// .item-content{ // .item-content{
// display: flex; // display: flex;
// flex-direction: row; // flex-direction: row;
...@@ -69,11 +73,11 @@ page-activityList { ...@@ -69,11 +73,11 @@ page-activityList {
// } // }
.content-box{ .content-box{
margin-left: 25px; padding-left: 25px;
margin-top: 15px; margin-top: 15px;
margin-bottom: 15px; margin-bottom: 15px;
padding-bottom: 15px; padding-bottom: 15px;
border-bottom: 1px solid #f1f2f3; border-bottom: 1px solid #dddddd;
} }
.content-item-box{ .content-item-box{
...@@ -82,6 +86,7 @@ page-activityList { ...@@ -82,6 +86,7 @@ page-activityList {
align-items: flex-start; align-items: flex-start;
justify-content: left; justify-content: left;
box-sizing: border-box; box-sizing: border-box;
margin: 2px 0;
} }
.left-title{ .left-title{
...@@ -115,5 +120,23 @@ page-activityList { ...@@ -115,5 +120,23 @@ page-activityList {
width: 30px; width: 30px;
height: 30px; height: 30px;
} }
.content-button{
font-size: 14px;
}
.content-button span:first-child{
color: #333;
}
.content-button span:last-child{
color: #999;
}
.list-ios .item-block .item-inner{
border: none;
}
.content-ios{
background-color: #e7e8ed;
}
.item-ios + .item-ios{
margin-top: 10px;
}
} }
src/pages/activityList/activityList.ts → src/pages/activity/activityList/activityList.ts
View file @ e5236803
...@@ -3,8 +3,9 @@ import { IonicPage, NavController, NavParams, AlertController} from 'ionic-angul ...@@ -3,8 +3,9 @@ import { IonicPage, NavController, NavParams, AlertController} from 'ionic-angul
import { Http,Response } from '@angular/http'; import { Http,Response } from '@angular/http';
import { ActivityApplyPage } from '../activityApply/activityApply' import { ActivityApplyPage } from '../activityApply/activityApply'
import { ActivityConfirmPage } from '../activityConfirm/activityConfirm'; import { ActivityConfirmPage } from '../../activityConfirm/activityConfirm';
import { AppService } from '../../service/appHttpService'; import { AppService } from '../../../service/appHttpService';
import {ActivityDetailPage} from "../activityDetail/activityDetail";
@IonicPage() @IonicPage()
@Component({ @Component({
selector: 'page-activityList', selector: 'page-activityList',
...@@ -84,30 +85,21 @@ export class ActivityListPage { ...@@ -84,30 +85,21 @@ export class ActivityListPage {
//查看详情 //查看详情
goDetail(item){ goDetail(item){
let orderid = item.orderList[0]["orderid"]; let orderid = item.orderList.id;
this.findMyOrderByOrderId(orderid,result =>{ // this.findMyOrderByOrderId(orderid,result =>{
let order = result; // let order = result;
this.navCtrl.push("ActivityConfirmPage",{lookOrderDetails:order}); this.navCtrl.push("ActivityDetailPage",{orderid:orderid});
}); // });
} }
findMyOrderByOrderId(orderid,callback?){
let order = this.appService.ObserverHttpPost("/wisdomgroup/modules/order/findMyOrderByOrderId",{"orderid":orderid})
.subscribe((res: Response) => {
let data = res.json();
callback(data == null ? "[]" : data);
}, error => {
this.appService.alert('网络异常！');
}
);
}
goApplyDetails(item){ goApplyDetails(item){
if(item.activityState==2 && item.orderList.length>0){ console.log(item);
// if(item.activityState==2 && item.orderList.length>0){
this.goDetail(item); this.goDetail(item);
}else{ // }else{
this.goApply(item); // this.goApply(item);
} // }
} }
doRefresh(refresher) { doRefresh(refresher) {
......
src/pages/activity/batch-detail/batch-detail.html 0 → 100644
View file @ e5236803
<ion-header>
<ion-navbar>
<ion-title>批次信息</ion-title>
</ion-navbar>
<div class="pageMenuSlides">
<div class="swiper-container">
<div class="swiper-wrapper">
<!-- {{i==0?'bottomLine':''}}是初始化的时候默认选择第一个菜单 -->
<div class="swiper-slide" *ngFor="let item of menuList;let i=index;" tappable (click)="selectPageMenu(i)">
<span class=" {{swiperIndex == i? 'swiper-title':''}} ">{{item.name}}</span>
</div>
</div>
</div>
</div>
</ion-header>
<ion-content>
<ion-slides #contentSlides class="height-190" (ionSlideDidChange)="slideChanged()" >
<ion-slide *ngFor="let item of menuList">
<ion-content direction="y" scrollbar-y="true">
<div class="content">
<div class="sign-info">
<p class="info-title">报名信息</p>
<div class="content-item">
<p> <span>携带人数：</span><span>1</span> </p>
<p> <span>报名备注：</span><span>备注</span> </p>
</div>
</div>
<div class="feedback-info">
<p class="info-title">出行反馈</p>
<div class="content-item">
<p> <span>出行结果：</span><span>1</span> </p>
<p> <span>评价反馈：</span><span>备注</span> </p>
</div>
</div>
<div class="batch-info">
<div class="content-item">
<p> <span>报名截止：</span><span>1</span> </p>
<p> <span>出行日期：</span><span>备注</span> </p>
<p> <span>集合时间：</span><span>备注</span> </p>
<p> <span>集合地点：</span><span>备注</span> </p>
<p> <span>活动须知：</span><span>备注</span> </p>
</div>
</div>
<div class="content-button">
<div class="button-left">报名人数<span class="color-24bafc">4/20</span></div>
<div class="button-right" (click)="goApply()">
<span class="button-btn button-btn1">立即报名</span>
<!--<span class="button-btn button-btn2">取消报名</span>-->
<!--<span class="button-btn button-btn3">报名截止</span>-->
<!--<span class="button-btn button-btn3">立即报名</span>-->
</div>
</div>
</div>
</ion-content>
</ion-slide>
</ion-slides>
</ion-content>
src/pages/activity/batch-detail/batch-detail.module.ts 0 → 100644
View file @ e5236803
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { BatchDetailPage } from './batch-detail';
@NgModule({
declarations: [
BatchDetailPage,
],
imports: [
IonicPageModule.forChild(BatchDetailPage),
],
})
export class BatchDetailPageModule {}
src/pages/activity/batch-detail/batch-detail.scss 0 → 100644
View file @ e5236803
page-batch-detail {
p{
margin: 0;}
.pageMenuSlides{
//设置菜单栏底部的颜色
border-bottom:1px solid rgb(255, 255, 255);
.swiper-container{
width: 100%;
height: 40px;
border-bottom: 1px solid #dddddd;
}
.swiper-slide{
//设置菜单栏的颜色
background: rgb(255, 255, 255);
//设置字体颜色
color: #0c0c0c;
font-size: 16px;
}
.bottomLine{
//设置当前菜单底部边框
border-bottom: 2px solid #7aa7fa;
color:#7aa7fa
}
.swiper-title{
position: relative;
color: #24bafc;
}
.swiper-title::after{
content: '';
position: absolute;
width: 100%;
height: 2px;
background-color: #24bafc;
bottom: -8px;
left: 0px;
}
}
ion-slides {
.slide-zoom {
height: 100%;
}
}
.content{
text-align: left;
margin-top: 6px;
}
.sign-info,.feedback-info{
border-bottom: 1px solid #ddd;
margin-bottom: 20px;
}
.info-title{
padding-left: 10px;
position: relative;
}
.info-title::after{
content: '';
position: absolute;
left: 0;
top: 0;
width: 5px;
height: 25px;
background-color: #24bafc;
}
.content-item{
font-size: 16px;
padding: 0 20px;
p{
padding: 10px 0;
span:first-child{
color: #333;
}
span:last-child{
color: #666;
}
}
p + p{
border-top: 1px solid #ddd;
}
}
.content-button{
position: absolute;
bottom: 10px;
left: 0;
display: flex;
align-items: center;
width: 100%;
height: 60px;
font-size: 16px;
background-color: #e3f6fe;
div:first-child{
width: 65%;
padding-left: 20px;
}
}
.button-btn{
padding: 10px 20px;
color: #fff;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.button-btn1{
background-color: #24bafc;
}
.button-btn2{
background-color: #e25c5e;
}
.button-btn3{
background-color: #d9d9d9;
}
}
src/pages/activity/batch-detail/batch-detail.ts 0 → 100644
View file @ e5236803
import {Component, ViewChild} from '@angular/core';
import {IonicPage, NavController, NavParams, Slides} from 'ionic-angular';
import {ActivityApplyPage} from "../activityApply/activityApply";
declare var Swiper;
@IonicPage()
@Component({
selector: 'page-batch-detail',
templateUrl: 'batch-detail.html',
})
export class BatchDetailPage {
@ViewChild('contentSlides') contentSlides: Slides;
menuList = [
{name:'批次1',id:'1'},
{name:'批次2',id:'2'},
{name:'批次3',id:'3'},
{name:'批次4',id:'4'},
];
swiper;
swiperIndex = 0;
constructor(public navCtrl: NavController, public navParams: NavParams) {
}
ionViewDidLoad() {
this.initSwiper();
}
initSwiper(){
this.swiper = new Swiper('.pageMenuSlides .swiper-container', {
//设置slider容器能够同时显示的slides数量(
slidesPreView: 3,
//slide之间的距离（单位px）
spaceBetween: 0,
//断点设定：根据屏幕宽度设置某参数为不同的值
breakpoints: {
1024: {
slidesPerView: 3,
spaceBetween: 0
},
768: {
slidesPerView: 3,
spaceBetween: 0
},
640: {
slidesPerView: 3,
spaceBetween: 0
},
320: {
slidesPerView: 3,
spaceBetween: 0
}
}
});
}
selectPageMenu(index) {
this.swiperIndex = index;
//切换页面
this.contentSlides.slideTo(index);
}
setStyle(index) {
}
slideChanged() {
//getActiveIndex()获得当前页面的index
let index = this.contentSlides.getActiveIndex();
this.setStyle(index);
//s切换菜单
this.swiper.slideTo(index, 300);
}
goApply(){
this.navCtrl.push('ActivityApplyPage');
}
}
src/pages/activityDetail/activityDetail.html deleted 100644 → 0
View file @ 5a7ee4eb
<ion-header>
<ion-toolbar>
<div class="searchToolBar">
<ion-title text-center>活动详情</ion-title>
</div>
</ion-toolbar>
</ion-header>
<ion-content class="content">
<!-- <div class="item1">
<ion-list class="item-list">
<ion-item>
<ion-icon name="ios-contact" class="item1-icon"></ion-icon>
2018年体检活动（处级以下）
</ion-item>
</ion-list>
</div> -->
<div class="item1">
<div class="img-box">
<img class="item1-image" src="./assets/imgs/logo.png">
</div>
<div class="item1-content">
<div>
<label class="item1-title">上海市人民医院体检</label>
<!-- <label class="item1-title" *ngIf="activity.activityFbObject==1">{{activity.activityName}}（全体人员）</label>
<label class="item1-title" *ngIf="activity.activityFbObject==2">{{activity.activityName}}（用户组）</label>
<label class="item1-title" *ngIf="activity.activityFbObject==3">{{activity.activityName}}（处事部门）</label> -->
<div class="item1-content-box">
<ion-icon name="md-contact" class="item1-icon"></ion-icon>
<!-- <span class="item-type">{{activity.activityType}}</span> -->
<span class="item-type">体检</span>
</div>
</div>
<div class="item1-introduction">
<!-- {{activity.activityIntro}} -->
{{introduce}}
<button class="btn-introduce" (click)="show()">具体介绍</button>
</div>
</div>
</div>
<div class="item2">
<ion-list class="item-list">
<ion-item>
<label class="item-label">
<span class="item-title">
活动批次
</span>
</label>
</ion-item>
<ion-item class="item2-content">
<div *ngFor="let batch of batches" class="item2-box">
<span class="time">{{batch.time}}</span>
<span class="quantity">剩余{{batch.quantity}}名</span>
</div>
</ion-item>
</ion-list>
</div>
<div class="item4 item-margin">
<ion-list class="item-list">
<ion-item>
<label class="item-label">
<span class="item-title">
活动说明
</span>
</label>
</ion-item>
<ion-item>
<label class="little-title-box">
<span class="little-title">时间</span>
</label>
<label class="item4-content">{{activity.time}}</label>
</ion-item>
<ion-item>
<label class="little-title-box">
<span class="little-title">地点</span>
</label>
<label class="item4-content">{{activity.location}}</label>
</ion-item>
<ion-item>
<label class="little-title-box">
<span class="little-title">交通</span>
</label>
<label class="item4-content">{{activity.musterTime}}</label>
</ion-item>
<ion-item>
<label class="little-title-box">
<span class="little-title">参与</span>
</label>
<label class="item4-content">{{activity.deadlineTime}}</label>
</ion-item>
</ion-list>
</div>
<div class="item5 item-margin">
<ion-list class="item-list">
<ion-item>
<label class="item-label">
<span class="item-title">
活动须知
</span>
</label>
</ion-item>
<ion-item class="item5-content">
<p>1.体检人员在体检服务窗口出示身份证即可；</p>
<p>2.体检前三天注意清淡饮食，规律作息；</p>
<p>3.体检前一天20:00后避免进食；</p>
<p>4.体检当天完成抽血、彩超后方可进食。</p>
</ion-item>
</ion-list>
</div>
<button ion-button block (click)="goJoinDetail()">人员参与情况</button>
</ion-content>
<div class="cover" *ngIf="isCover">
<div class="cover-content">
<div class="cover-content-box">
<h4 class="cover-content-title">具体介绍</h4>
<div class="cover-content-info">
<p>
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开 大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开 大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
大是大非技术开发的放开价格低是健康的方式上课的老师来的胜利的快感是贷款公司说那是肯定句史可法大家可能快谁能看见电脑上看谁能看得开
</p>
</div>
<button ion-button block (click)="hidden()">
关闭
</button>
</div>
</div>
</div>
\ No newline at end of file
src/pages/tabs/home/home.ts
View file @ e5236803
import { Component, ViewChild } from '@angular/core'; import { Component, ViewChild } from '@angular/core';
import { NavController, IonicPage, Slides } from 'ionic-angular'; import { NavController, IonicPage, Slides } from 'ionic-angular';
import { ActivityListPage } from '../../activityList/activityList'; import { ActivityListPage } from '../../activity/activityList/activityList';
import { Http, Response } from '@angular/http'; import { Http, Response } from '@angular/http';
import { ActivityStatisticService } from '../../../service/activityStatisticService'; import { ActivityStatisticService } from '../../../service/activityStatisticService';
import { MyActivityListPage } from '../../myActivityList/myActivityList'; import { MyActivityListPage } from '../../myActivityList/myActivityList';
import { AppService, AppGlobal } from '../../../service/appHttpService'; import { AppService, AppGlobal } from '../../../service/appHttpService';
import { Calendar } from '@ionic-native/calendar'; import { Calendar } from '@ionic-native/calendar';
import { ActivityApplyPage } from '../../activityApply/activityApply' import { ActivityApplyPage } from '../../activity/activityApply/activityApply'
import { ActivityConfirmPage } from '../../activityConfirm/activityConfirm'; import { ActivityConfirmPage } from '../../activityConfirm/activityConfirm';
import { OutGoingReportPage } from '../../outGoingReport/outGoingReport'; import { OutGoingReportPage } from '../../outGoingReport/outGoingReport';
import { OperationListPage } from '../../operation-list/operation-list'; import { OperationListPage } from '../../operation-list/operation-list';
......
src/theme/icon.scss
View file @ e5236803
...@@ -40,7 +40,10 @@ ...@@ -40,7 +40,10 @@
.color-999{ .color-999{
color: #999; color: #999;
} }
@for $i from 1 through 51{ .color-24bafc{
color: #24bafc;
}
@for $i from 0 through 51{
.margin-right-#{$i}{ .margin-right-#{$i}{
margin-right: #{$i}px; margin-right: #{$i}px;
} }
...@@ -53,5 +56,12 @@ ...@@ -53,5 +56,12 @@
.padding-#{$i}{ .padding-#{$i}{
padding: #{$i}px; padding: #{$i}px;
} }
}
@for $i from 0 through 51{
@for $j from 0 through 51{
.margin-#{$i}-#{$j}{
margin: #{$i}px #{$j}px ;
}
}
} }
\ No newline at end of file
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