提交 0982471b 编写于 作者: tao.wu's avatar tao.wu

Merge remote-tracking branch 'origin/dev-stage2-20191125' into dev-stage2-20191125

......@@ -4,6 +4,7 @@
<header class="header-container">
<img @click="goBack" src="~/assets/img/icon-back.png" alt="">
{{title}}
<div class="btn-right" v-if="rightText">{{rightText}}</div>
</header>
</section>
</template>
......@@ -18,6 +19,12 @@
return ''
}
},
rightText: {
type: String,
default: function () {
return ''
}
},
backType: {
type: Number,
default: function () {
......@@ -69,15 +76,29 @@
background: #ffffff;
color: #333333;
font-size: 18px;
display: flex;
align-items: center;
/*display: flex;
align-items: center;*/
line-height: 44Px;
text-align: center;
position: relative;
img {
display: block;
width: 25px;
height: 25px;
margin-left: 15px;
margin-right: 111.5px;
position: absolute;
left: 13px;
top: 9px
}
/* .title {
margin: 0 auto;
}*/
.btn-right {
position: absolute;
right: 14.5px;
bottom: 13px;
font-size: 13px;
line-height: 14px;
color: #373839;
}
}
}
......
.hospital-ranking-wrap {
position: relative;
.info-container {
width: 100%;
height: 130px;
background: url(../../assets/img/person-detail/detail-top-bg.png) no-repeat;
background-size: cover;
overflow: hidden;
.info {
display: flex;
align-items: center;
padding: 0 15px;
margin-top: 20px;
img {
width: 50px;
height: 50px;
border-radius: 100%;
}
.content {
display: flex;
margin-left: 10px;
flex-flow: column;
align-items: flex-start;
.main-name {
color: #fff;
font-size: 18px;
font-weight: 700;
}
.main1-name {
color: #fff;
font-size: 12px;
margin-top: 8px;
}
.details {
display: flex;
align-items: center;
margin-top: 8px;
.item {
font-size: 14px;
font-weight: 700;
.label {
color: #fff;
}
.value {
color: #FFDD58;
}
}
}
.details-d {
margin-top: 0;
}
.line {
display: inline-block;
width: 0.5px;
height: 10px;
background: #fff;
margin: 0 6px;
}
}
}
}
.main-content {
width: 100%;
border-radius: 20px 20px 0px 0px;
position: absolute;
top: 90px;
background: #fff;
.description {
height: 40px;
line-height: 40px;
color: #FD6037;
font-size: 13px;
display: flex;
align-items: center;
span {
display: inline-block;
color: #373839;
font-size: 16px;
font-weight: 700;
margin: 0 6px 0 20px;
}
}
.description-d {
justify-content: center;
}
.ranking-title {
display: flex;
align-items: center;
height: 40px;
background: #FFF7F2;
color: #979899;
font-size: 14px;
padding: 0 25px 0 13px;
margin-bottom: 3px;
.marginL {
margin-left: 11px;
}
.marginAuto {
margin-left: auto;
}
}
.ranking-list {
padding: 0 25px;
.item {
display: flex;
align-items: center;
padding: 13.5px 0;
.ranking-icon {
width: 25px;
height: 30px;
}
.icon-num {
width: 25px;
color: #373839;
font-size: 15px;
font-weight: 700;
text-align: center;
}
.doctor-photo {
width: 35px;
height: 35px;
border-radius: 100%;
margin-left: 25px;
}
.doctor-name {
color: #333333;
font-size: 16px;
font-weight: 700;
margin-left: 10px;
width: 130px;
}
.hospital-name {
color: #333333;
font-size: 16px;
font-weight: 700;
margin-left: 25px;
width: 130px;
}
.num {
color: #373839;
font-weight: 700;
font-size: 18px;
margin-left: auto;
}
}
}
.footer-btn {
width: 100%;
height: 40px;
padding: 5px 0;
box-shadow:0px -1px 0px 0px rgba(237,237,237,1);
position: fixed;
bottom: 0;
.btn {
width: 345px;
height: 40px;
margin: 0 auto;
line-height: 40px;
text-align: center;
background: linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
border-radius: 20px;
color: #FFFFFF;
font-weight: 700;
font-size: 15px;
}
}
}
}
\ No newline at end of file
<template>
<section class="hospital-ranking-wrap">
<ranking-header></ranking-header>
<div class="info-container" :style="{ marginTop: `${44+barHeight}Px`}">
<!--<div class="info info-hospital">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="">
<div class="content">
<div class="con main-name">高新区卫生院</div>
<div class="con details">
<p class="item">
<span class="label">累计排名</span>
<span class="value">105</span>
</p>
<p class="line"></p>
<p class="item">
<span class="label">累计勤奋分 </span>
<span class="value">105</span>
</p>
</div>
</div>
</div>-->
<div class="info info-doctor">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="">
<div class="content">
<div class="con details details-d">
<p class="item">
<span class="label">累计排名</span>
<span class="value">105</span>
</p>
<p class="line"></p>
<p class="item">
<span class="label">累计勤奋分 </span>
<span class="value">105</span>
</p>
</div>
<div class="con main1-name">高新区卫生院</div>
</div>
</div>
</div>
<div class="main-content">
<!--<div class="description description-h"><span>星火榜</span>排行实时刷新,部分原因存在几分钟延迟</div>-->
<div class="description description-d">排行实时刷新,部分原因存在几分钟延迟</div>
<div class="ranking-title">
<span>TOP100</span>
<!--<span class="marginL">机构名称</span>
<span class="marginAuto">机构勤奋分</span>-->
<span class="marginL">机构成员</span>
<span class="marginAuto">贡献勤奋分</span>
</div>
<div class="ranking-list">
<!--<div class="item">
<img src="~/assets/img/person-ranking/icon-silver.png" alt="" class="ranking-icon">
&lt;!&ndash;<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="doctor-photo">&ndash;&gt;
<p class="hospital-name">这里是一个十三字的机构名字</p>
<p class="num">1053</p>
</div>-->
<div class="item">
<img src="~/assets/img/person-ranking/icon-silver.png" alt="" class="ranking-icon">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="doctor-photo">
<p class="doctor-name">这里是一个十三字的医生姓名</p>
<p class="num">1053</p>
</div>
</div>
<div class="footer-btn">
<div class="btn">助力机构 创造佳绩</div>
</div>
</div>
</section>
</template>
<script>
import RankingHeader from '@/components/ranking-header'
export default {
name: 'hospital-ranking',
components: {
RankingHeader
},
data() {
return {
showPop: false,
title: '个人明细',
barHeight: 0,
barColor: '#fff',
};
},
computed: {
},
mounted() {
},
methods: {},
};
</script>
<style lang="less" scoped>
@import 'index.less';
</style>
......@@ -96,6 +96,7 @@
font-size: 16px;
font-weight: 700;
margin-left: 10px;
width: 130px;
}
.num {
color: #373839;
......
......@@ -34,7 +34,7 @@
<div class="item">
<img src="~/assets/img/person-ranking/icon-silver.png" alt="" class="ranking-icon">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="doctor-photo">
<p class="doctor-name">张医生</p>
<p class="doctor-name">这里是一个十三字的医生姓名</p>
<p class="num">1053</p>
</div>
<div class="item">
......@@ -60,7 +60,7 @@
<script>
import RankingHeader from '@/components/ranking-header'
export default {
name: 'person-detail',
name: 'person-ranking',
components: {
RankingHeader
},
......
.yesterday-prize-wrap {
.prize-list {
padding-left: 25px ;
.item {
display: flex;
align-items: center;
// padding: 21px 0;
.ranking-icon {
width: 25px;
height: 30px;
}
.item-right {
flex: 1;
display: flex;
align-items: center;
position: relative;
padding: 21px 15px 21px 20px;
margin-left: 5px;
.icon-num {
width: 25px;
color: #373839;
font-size: 15px;
font-weight: 700;
text-align: center;
}
.doctor-photo {
width: 35px;
height: 35px;
border-radius: 100%;
}
.doctor-info {
margin-left: 10px;
.name {
color: #333333;
font-size: 16px;
font-weight: 700;
width: 130px;
line-height: 16px;
}
.grade {
font-size: 13px;
color: #979899;
line-height: 13px;
margin-top: 8px;
span {
color: #FD6239;
}
}
}
.awards {
color: #373839;
font-weight: 700;
font-size: 13px;
margin-left: auto;
}
}
.item-right:after {
position: absolute;
content: " ";
left: 0;
bottom: 0;
right: 0;
height: 1PX;
border-bottom: 1PX solid #F0F1F2;
color: #F0F1F2;
-webkit-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
transform-origin: 0 100%;
-webkit-transform: scaleY(0.5);
-ms-transform: scaleY(0.5);
transform: scaleY(0.5);
}
}
}
.footer-btn {
width: 100%;
height: 40px;
padding: 5px 0;
box-shadow:0px -1px 0px 0px rgba(237,237,237,1);
position: fixed;
bottom: 0;
.btn {
width: 345px;
height: 40px;
margin: 0 auto;
line-height: 40px;
text-align: center;
background: linear-gradient(270deg,rgba(255,88,36,1) 0%,rgba(254,163,86,1) 100%);
border-radius: 20px;
color: #FFFFFF;
font-weight: 700;
font-size: 15px;
}
}
}
\ No newline at end of file
<template>
<section class="yesterday-prize-wrap">
<normal-header
:title="title"
:rightText="rightText"
:barHeight="barHeight"
:barColor="barColor"
:backType="1">
</normal-header>
<div class="prize-list" :style="{ marginTop: `${44+barHeight}Px`}">
<div class="item">
<img src="~/assets/img/person-ranking/icon-copper.png" alt="" class="ranking-icon">
<div class="item-right">
<img src="https://file.yunqueyi.com/jpg/2019/01/30/1548836156602-019ADC3F.jpg" alt="" class="doctor-photo">
<div class="doctor-info">
<p class="name">张医生</p>
<p class="grade">昨日勤奋分:<span>1234</span></p>
</div>
<p class="awards">小米电视机1台</p>
</div>
</div>
</div>
<div class="footer-btn">
<div class="btn">今日我要拿奖</div>
</div>
</section>
</template>
<script>
import NormalHeader from '@/components/normal-header'
export default {
name: "index",
components: {
NormalHeader
},
data() {
return {
showPop: false,
title: '昨日获奖名单',
barHeight: 0,
barColor: '#fff',
rightText: '如何领奖'
};
},
mounted() {
},
methods: {},
}
</script>
<style scoped lang="less">
@import 'index.less';
</style>
\ No newline at end of file
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册