Commit 28afe850 authored by wangqinghua's avatar wangqinghua

style

parent 841de323
...@@ -37,6 +37,8 @@ import {EmitService} from "../provide/emit.service"; ...@@ -37,6 +37,8 @@ import {EmitService} from "../provide/emit.service";
import {TextToSpeech} from "@ionic-native/text-to-speech"; import {TextToSpeech} from "@ionic-native/text-to-speech";
import {SearchNewPageModule} from "../pages/home-pages/search-new/search-new.module"; import {SearchNewPageModule} from "../pages/home-pages/search-new/search-new.module";
import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-detail.module"; import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-detail.module";
import {HomeService} from "../pages/home/home.service";
import {PublishPageModule} from "../pages/discover-pages/publish/publish.module";
@NgModule({ @NgModule({
declarations: [ declarations: [
...@@ -67,6 +69,7 @@ import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-deta ...@@ -67,6 +69,7 @@ import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-deta
JsonpModule, JsonpModule,
SearchNewPageModule, SearchNewPageModule,
StuffDetailPageModule, StuffDetailPageModule,
PublishPageModule
], ],
bootstrap: [IonicApp], bootstrap: [IonicApp],
entryComponents: [ entryComponents: [
...@@ -99,6 +102,7 @@ import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-deta ...@@ -99,6 +102,7 @@ import {StuffDetailPageModule} from "../pages/home-pages/stuff-detail/stuff-deta
CommonService, CommonService,
TabsService, TabsService,
BackButtonService, BackButtonService,
HomeService,
EmitService, EmitService,
{provide: ErrorHandler, useClass: IonicErrorHandler} {provide: ErrorHandler, useClass: IonicErrorHandler}
] ]
......
...@@ -164,23 +164,37 @@ p { ...@@ -164,23 +164,37 @@ p {
} }
//tab切换头 //tab切换头
.tabs-parent { .scroll-tab{
display: flex; overflow: hidden;
flex-direction: row;
flex-wrap: nowrap;
position: relative; position: relative;
background-color: #fff;
margin-bottom: .5rem;
font-size: 1.7rem;
} }
.news-content{
overflow-y: hidden;
overflow-x: scroll;
.tabs-parent {
position: relative;
background-color: #fff;
margin-bottom: .5rem;
font-size: 1.7rem;
white-space: nowrap;
}
.tabs-parent::-webkit-scrollbar {
display: none;
}
.tabs-children { .tabs-children {
flex: 1; text-align: center;
text-align: center; cursor: pointer;
cursor: pointer; height: 4rem;
height: 4rem; line-height: 4rem;
line-height: 4rem; width: calc(100% / 4);
display: inline-block;
}
} }
.news-content::-webkit-scrollbar {
display: none;
}
#tips { #tips {
position: absolute; position: absolute;
...@@ -295,4 +309,11 @@ p { ...@@ -295,4 +309,11 @@ p {
a[disabled], button[disabled], [ion-button][disabled], a[disabled], button[disabled], [ion-button][disabled],
.bar-button-default-ios.activated, .bar-button-default.bar-button-ios-default.activated, .bar-button-clear-ios-default.activated{ .bar-button-default-ios.activated, .bar-button-default.bar-button-ios-default.activated, .bar-button-clear-ios-default.activated{
opacity: 1; opacity: 1;
}
.content-textarea {
padding: 10px;
min-height: 100px;
width: 100%;
border: 1px solid #ddd;
} }
\ No newline at end of file
<ion-header>
<ion-navbar>
<ion-title>发布</ion-title>
<ion-buttons end>
<button ion-button icon-only (click)="publish()" class="toolbar-icon">
<ion-icon name="share-alt"></ion-icon>
发布
</button>
</ion-buttons>
</ion-navbar>
</ion-header>
<ion-content padding>
<ion-item>
<ion-label class="main-color">选择板块</ion-label>
<ion-select [(ngModel)]="obj.type" cancelText="取消" okText="确定">
<ion-option value="1">机关党委</ion-option>
<ion-option value="2">机关党委</ion-option>
<ion-option value="3">机关党委</ion-option>
<ion-option value="4">机关党委</ion-option>
<ion-option value="5">机关党委</ion-option>
<ion-option value="6">机关党委</ion-option>
</ion-select>
</ion-item>
<ion-item>
<ion-input [(ngModel)]="obj.title" placeholder="请输入内容标题"></ion-input>
</ion-item>
<ion-item>
<textarea [(ngModel)]="obj.content" class="content-textarea" placeholder="请在此输入内容标题"></textarea>
</ion-item>
</ion-content>
import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { PublishPage } from './publish';
@NgModule({
declarations: [
PublishPage,
],
imports: [
IonicPageModule.forChild(PublishPage),
],
})
export class PublishPageModule {}
page-publish {
.toolbar-icon{
color: #fff;
margin-right: 1rem;
font-size: 1.5rem;
}
.item-ios.item-block .item-inner{
border-bottom:none;
padding-right: 0px;
}
.item-ios + .item-ios{
border-top: 1px solid #eeeeee;
}
.main-color{
color: #e12724;
font-size: 1.4rem;
}
.content-textarea{
min-height: 320px;
}
.label-ios{
margin-right: 0px;
}
}
import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {CommonService} from "../../../provide/common.service";
@IonicPage()
@Component({
selector: 'page-publish',
templateUrl: 'publish.html',
})
export class PublishPage {
obj = {
type:1,
title:'',
content:'',
}
constructor(public navCtrl: NavController, public navParams: NavParams,
public commonSer:CommonService) {
}
ionViewDidLoad() {
console.log('ionViewDidLoad PublishPage');
}
//发布
publish(){
this.commonSer.alert('确定提交审核当前内容?',()=>{
this.commonSer.toast('已提交审核')
setTimeout(()=>{
this.navCtrl.pop()
},1000)
})
}
}
...@@ -3,6 +3,8 @@ import {IonicPage, NavController, NavParams} from 'ionic-angular'; ...@@ -3,6 +3,8 @@ import {IonicPage, NavController, NavParams} from 'ionic-angular';
import {AppService} from "../../../../service/http.service"; import {AppService} from "../../../../service/http.service";
import {Geolocation} from "@ionic-native/geolocation"; import {Geolocation} from "@ionic-native/geolocation";
import * as moment from "moment"; import * as moment from "moment";
import {HomeService} from "../../home.service";
import {CommonService} from "../../../../provide/common.service";
@IonicPage() @IonicPage()
@Component({ @Component({
...@@ -14,9 +16,7 @@ export class DutySignUpPage { ...@@ -14,9 +16,7 @@ export class DutySignUpPage {
id; id;
signState; signState;
signStatus = 'fail'; signStatus = 'fail';
signInfo = { signInfo;
id:''
};
//市委组织部坐标 //市委组织部坐标
mainLat = 31.205033; //纬度 mainLat = 31.205033; //纬度
// mainLat = 31.231871; //纬度test 31.231871, 121.393319 // mainLat = 31.231871; //纬度test 31.231871, 121.393319
...@@ -24,18 +24,22 @@ export class DutySignUpPage { ...@@ -24,18 +24,22 @@ export class DutySignUpPage {
// mainLng = 121.393319; //经度test // mainLng = 121.393319; //经度test
nowDay; nowDay;
constructor(public navCtrl: NavController, public navParams: NavParams, constructor(public navCtrl: NavController, public navParams: NavParams,public homeSer:HomeService,
public commonSer:CommonService,
public appService: AppService, public geolocation: Geolocation) { public appService: AppService, public geolocation: Geolocation) {
} }
ionViewDidLoad() { ionViewDidLoad() {
this.nowDay = moment().format('l'); this.nowDay = moment().format('l');
this.appService.ObserverHttpGetOption('/wisdomgroup/schedule/myScheduleOfToday', null) this.homeSer.myScheduleOfToday().subscribe(
.subscribe((res) => { (res)=>{
if(res){ if(res){
this.signInfo = res.json(); this.signInfo = res.json();
} }else{
}) this.commonSer.toast('暂无值班')
}
}
)
} }
//签到 //签到
......
import {Injectable} from "@angular/core";
import {HttpClient} from "@angular/common/http";
import {Http} from "@angular/http";
import {Observable} from "rxjs/Observable";
import {AppGlobal} from "../../service/http.service";
import {CommonService} from "../../provide/common.service";
@Injectable()
export class HomeService{
constructor(
private http:HttpClient, //该请求 将结果转为json
private commonSer:CommonService,
private https:Http, //该请求不转json
){}
//值班签到
myScheduleOfToday(): Observable<any>{
return this.http.get(AppGlobal.domain+'/wisdomgroup/schedule/myScheduleOfToday',{responseType: 'text' });
}
}
\ No newline at end of file
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<ion-icon class="search-icon" name="search"></ion-icon> <ion-icon class="search-icon" name="search"></ion-icon>
</ion-buttons> </ion-buttons>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-only (click)="isSign = true" class="toolbar-signUp"> <button ion-button icon-only (click)="goToPublish()" class="toolbar-signUp">
<ion-icon class="icon-fabu iconfont"></ion-icon> <ion-icon class="icon-fabu iconfont"></ion-icon>
<span class="signUp-span" >发布</span> <span class="signUp-span" >发布</span>
</button> </button>
...@@ -23,8 +23,46 @@ ...@@ -23,8 +23,46 @@
</ion-buttons> </ion-buttons>
</ion-navbar> </ion-navbar>
</ion-header> </ion-header>
<ion-content>
<div class="scroll-tab">
<div class="news-content">
<div #tabsParent class="tabs-parent">
<div #tabsChildren *ngFor="let item of tabsList;" (click)="change(item.type)" class="tabs-children">
<span #tabSpan [style.color]="index == item.type ? '#e12724':''">{{item.name}}</span>
</div>
<span #tips id="tips"></span>
</div>
</div>
</div>
<div class="search-content">
<ion-content padding> <ng-container *ngFor="let item of newList">
<div class="search-item" (click)="goToDetail(item)">
<p class="item-info">
<span>{{item.source}}</span>
<span>{{item.publishTime | date:'yyyy-MM-dd'}}</span>
</p>
<div class="item-news">
<ion-row class="news-item">
<ion-col col-8 class="news-left">
<p class="news-title">{{item.title}}</p>
<p class="news-end">
<ion-icon style="font-size: 2.5rem;vertical-align: sub" name="eye"></ion-icon>
<span>{{item.browseCount}}</span>
<ion-icon name="chatboxes"></ion-icon>
<span>{{item.commentCount}}</span>
<ion-icon name="thumbs-up"></ion-icon>
<span>{{item.likeCount}}</span>
<ion-icon name="heart"></ion-icon>
<span>{{item.collectionCount}}</span>
</p>
</ion-col>
<ion-col col-4 class="news-right">
<img src="./assets/imgs/demo.png">
</ion-col>
</ion-row>
</div>
</div>
</ng-container>
</div>
</ion-content> </ion-content>
...@@ -29,6 +29,7 @@ page-discover { ...@@ -29,6 +29,7 @@ page-discover {
padding-left: 24px; padding-left: 24px;
} }
//发布
.toolbar-signUp { .toolbar-signUp {
.signUp-span { .signUp-span {
color: #fff; color: #fff;
...@@ -54,4 +55,40 @@ page-discover { ...@@ -54,4 +55,40 @@ page-discover {
margin-right: -.3rem; margin-right: -.3rem;
} }
} }
//新闻区
.search-content{
padding: 0 1rem;
.search-item{
padding: .8rem 0;
.news-left{
display: flex;
flex-flow: row wrap;
min-height: 100%;
padding: 5px 0;
.news-title{
align-self: flex-start;
font-weight: bold;
width: 100%;
}
.news-end{
align-self: flex-end;
color: #999999;
font-size: 1.5rem;
span{
margin-right: 1rem;
}
}
}
.news-right{
padding: 5px 0;
img{
border-radius: .5rem;
}
}
}
.search-item + .search-item{
border-top: 1px solid #eeeeee;
}
}
} }
import { Component } from '@angular/core'; import {Component, ElementRef, ViewChild} from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular'; import {IonicPage, NavController, NavParams} from 'ionic-angular';
import {SearchNewPage} from "../../home-pages/search-new/search-new"; import {SearchNewPage} from "../../home-pages/search-new/search-new";
import {TabsService} from "../tabs.service";
import {StuffDetailPage} from "../../home-pages/stuff-detail/stuff-detail";
import {PublishPage} from "../../discover-pages/publish/publish";
@IonicPage() @IonicPage()
@Component({ @Component({
selector: 'page-discover', selector: 'page-discover',
templateUrl: 'discover.html', templateUrl: 'discover.html',
}) })
export class DiscoverPage { export class DiscoverPage {
@ViewChild('tips') tips: ElementRef;
@ViewChild('tabsParent') tabsParent: ElementRef;
@ViewChild('tabsChildren') tabsChildren: ElementRef;
@ViewChild('tabSpan') tabSpan: ElementRef;
isSign = false; tabsList = [
constructor(public navCtrl: NavController, public navParams: NavParams) { {name: "支部风采",type:0},
} {name: "机关党委",type:1},
{name: "党风廉政",type:2},
{name: "互动交流",type:3},
{name: "知识拓展",type:4},
];
index = 0;
isSign = false;
newList; //新闻列表
constructor(public navCtrl: NavController, public navParams: NavParams,
public tabsSer:TabsService) {
}
ionViewDidLoad() { ionViewDidEnter() {
console.log('ionViewDidLoad DiscoverPage'); this.change(0);
} }
//前往搜索页面 //所属板块类型(1党规党章,2系列讲话,3中央精神,4本市部署,5通知公告,6党建动态,7工作提示,
goToSearch(){ // * 8党务参考,9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶)
this.navCtrl.push(SearchNewPage); change(index) {
} let itemWidth = window.screen.width / 4;
let spanWidth = this.tabSpan.nativeElement.offsetWidth; //文字宽度
this.tips.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
// 自身div的一半 - 滑块的一半
this.tips.nativeElement.style.left = itemWidth * (index) + (itemWidth - spanWidth) / 2 + 'px';
this.index = index;
const data = {
pageSize: 1,
pageCount: 100,
obj: {
'plateType': index + 1
}
}
this.tabsSer.stuffPage(data).subscribe(
(res) => {
this.newList = res.data;
}
)
}
//前往搜索页面
goToSearch() {
this.navCtrl.push(SearchNewPage);
}
//查看详情
goToDetail(item) {
this.navCtrl.push(StuffDetailPage, {
id: item.id
});
}
//前往发布页面
goToPublish(){
this.navCtrl.push(PublishPage);
}
} }
...@@ -46,7 +46,7 @@ ...@@ -46,7 +46,7 @@
<div class="news-content"> <div class="news-content">
<div class="tabs-parent"> <div class="tabs-parent">
<div *ngFor="let item of tabsList;let i = index" (click)="change(i)" class="tabs-children"> <div *ngFor="let item of tabsList;let i = index" (click)="change(i)" class="tabs-children">
<span [style.color]="index == i ? '#e12724':''">{{item.name}}</span> <span #tabSpan [style.color]="index == i ? '#e12724':''">{{item.name}}</span>
</div> </div>
<span #tips id="tips"></span> <span #tips id="tips"></span>
</div> </div>
......
...@@ -32,6 +32,7 @@ declare var Swiper; ...@@ -32,6 +32,7 @@ declare var Swiper;
export class HomePage { export class HomePage {
@ViewChild(Slides) slides: Slides; @ViewChild(Slides) slides: Slides;
@ViewChild('tips') tips: ElementRef; @ViewChild('tips') tips: ElementRef;
@ViewChild('tabSpan') tabSpan: ElementRef;
picture: string = AppGlobal.picture; picture: string = AppGlobal.picture;
slidersItems = []; slidersItems = [];
...@@ -65,6 +66,7 @@ export class HomePage { ...@@ -65,6 +66,7 @@ export class HomePage {
getBanner(){ getBanner(){
const data = { const data = {
obj:{ obj:{
resourceType:2,
isRecommend:1, isRecommend:1,
} }
} }
...@@ -79,8 +81,10 @@ export class HomePage { ...@@ -79,8 +81,10 @@ export class HomePage {
// * 8党务参考,9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶) // * 8党务参考,9廉政格言,10纪检提示,11风险排查,12警示教育,13支部活动,14党建联建,15结对帮扶)
change(index) { change(index) {
let itemWidth = window.screen.width / 4; let itemWidth = window.screen.width / 4;
let spanWidth = this.tabSpan.nativeElement.offsetWidth; //文字宽度
this.tips.nativeElement.style.width = this.tabSpan.nativeElement.offsetWidth + 'px';
// 自身div的一半 - 滑块的一半 // 自身div的一半 - 滑块的一半
this.tips.nativeElement.style.left = itemWidth * index + itemWidth / 2 - this.tips.nativeElement.offsetWidth / 2 + 'px'; this.tips.nativeElement.style.left = itemWidth * (index)+ (itemWidth - spanWidth)/2 + 'px';
this.index = index; this.index = index;
const data = { const data = {
pageSize:1, pageSize:1,
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
</ion-buttons> </ion-buttons>
<ion-buttons end> <ion-buttons end>
<button ion-button icon-only class="toolbar-icon"> <button ion-button icon-only class="toolbar-icon">
<ion-icon name="mail"></ion-icon> <ion-icon class="icon-youjian iconfont"></ion-icon>
<span class="num">2</span> <span class="num">2</span>
</button> </button>
</ion-buttons> </ion-buttons>
......
...@@ -384,4 +384,12 @@ page-serve { ...@@ -384,4 +384,12 @@ page-serve {
opacity: 1; opacity: 1;
} }
.toolbar-icon {
ion-icon.iconfont{
color: #ffffff;
font-size: 2.5rem;
line-height: .1;
}
}
} }
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