Commit ae173825 authored by 786817560's avatar 786817560

'scroll修改'

parent 56a74f52
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2019-10-31 09:49:57 * @Date: 2019-10-31 09:49:57
* @LastEditTime: 2019-11-19 14:20:47 * @LastEditTime: 2019-11-20 19:05:09
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: 合同查询--记录 * @Description: 合同查询--记录
* @FilePath: * @FilePath:
...@@ -14,14 +14,14 @@ ...@@ -14,14 +14,14 @@
<span>合同记录</span> <span>合同记录</span>
</div> </div>
</h-header> </h-header>
<h-content v-if="data===null" class="null"> <div v-if="data===null" class="null">
<div class="display"> <div class="display">
<img src="@/assets/contractRepayment/null.png" alt=""> <img src="@/assets/contractRepayment/null.png" alt="">
<p>暂时没有还款记录</p> <p>暂时没有还款记录</p>
<div @click="$routeGo()">返回</div> <div @click="$routeGo()">返回</div>
</div> </div>
</h-content> </div>
<div v-if="data!==null"> <div v-if="data!==null" class="wrap has-header">
<div class="tab"> <div class="tab">
<p><span :class="{'selected':selected === 'all'}" @click="isSelected('all')">全部</span></p> <p><span :class="{'selected':selected === 'all'}" @click="isSelected('all')">全部</span></p>
<p><span :class="{'selected':selected === 'one'}" @click="isSelected('one')">待首付</span></p> <p><span :class="{'selected':selected === 'one'}" @click="isSelected('one')">待首付</span></p>
...@@ -34,10 +34,11 @@ ...@@ -34,10 +34,11 @@
<img src="@/assets/contractInquire/search.png" alt=""> <img src="@/assets/contractInquire/search.png" alt="">
<input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称"> <input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称">
</div> </div>
</div>
</div>
<!-- 全部合同记录 --> <!-- 全部合同记录 -->
<scroll <scroll
v-if="data!==null"
ref="scroll" ref="scroll"
:updateData="[showLists]" :updateData="[showLists]"
:pullUp="true" :pullUp="true"
...@@ -250,24 +251,6 @@ export default { ...@@ -250,24 +251,6 @@ export default {
</script> </script>
<style lang='less' > <style lang='less' >
#contract-records { #contract-records {
.h-header {
background-color: #1D3FFF;
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 5px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
font-size: 17px;
letter-spacing: 0.61px;
line-height: 24px;
}
}
}
.tab { .tab {
display: flex; display: flex;
...@@ -328,8 +311,6 @@ export default { ...@@ -328,8 +311,6 @@ export default {
.pay-content { .pay-content {
padding: 8px 8px; padding: 8px 8px;
padding-bottom: 104px;
.contract-item { .contract-item {
height: 208px; height: 208px;
background-color: #fff; background-color: #fff;
...@@ -513,6 +494,45 @@ export default { ...@@ -513,6 +494,45 @@ export default {
} }
} }
.wrap {
width: 100%;
position: absolute;
z-index: 100
}
.content{
position: absolute;
top:0;
}
.scrollContent{
padding-top: 2.60rem;
padding-bottom: 20px;
}
} }
.platform-ios {
#contract-records {
.scrollContent {
padding-top: 3rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#contract-records {
.scrollContent {
padding-top: 3.4rem;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#contract-records {
.scrollContent {
padding-top: 3.8rem;
}
}
}
}
</style> </style>
<!-- <!--
* @Author: your name * @Author: your name
* @Date: 2019-09-29 10:02:11 * @Date: 2019-09-29 10:02:11
* @LastEditTime: 2019-11-19 16:47:01 * @LastEditTime: 2019-11-20 17:01:18
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
* @Description: In User Settings Edit * @Description: In User Settings Edit
--> -->
<template> <template>
<h-view class="contract-signing"> <h-view id="contract-signing">
<h-header :proportion="[5,1,1]" class="bar-custom"> <h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn"> <div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()"> <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>合同签约</span> <span>合同签约</span>
</div> </div>
</h-header> </h-header>
<div class="tab-style"> <div class="tab-style has-header">
<div :class="{'done':num === 1,'undone':num !== 1}" @click="num = 1;"><img :src="num === 1?check1:uncheck1"><span>待签约</span></div> <div :class="{'done':num === 1,'undone':num !== 1}" @click="num = 1;"><img :src="num === 1?check1:uncheck1"><span>待签约</span></div>
<div :class="{'done':num === 2,'undone':num !== 2}" @click="num = 2;"><img :src="num === 2?check2:uncheck2"><span>已签约</span></div> <div :class="{'done':num === 2,'undone':num !== 2}" @click="num = 2;"><img :src="num === 2?check2:uncheck2"><span>已签约</span></div>
</div> </div>
<div class="hinput"> <!-- 搜索 -->
<div class="search-box"> <div class="search">
<input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称"> <img src="@/assets/contractInquire/search.png" alt="">
<img src="@/assets/constractSigning/search.png" alt="" style="width:18px"> <input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称">
</div>
</div> </div>
<!-- <h-content > --> <!-- <h-content > -->
...@@ -232,16 +231,18 @@ export default { ...@@ -232,16 +231,18 @@ export default {
</script> </script>
<style lang="less" type="text/less"> <style lang="less" type="text/less">
.contract-signing{ #contract-signing{
.tab-style{ .tab-style{
display:flex; display:flex;
width: 100%;
justify-content: center; justify-content: center;
padding-top:12px; padding-top:12px;
padding-bottom: 8px; padding-bottom: 8px;
align-items: center; align-items: center;
background-color: #fff; background-color: #fff;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50); box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
position: absolute;
z-index: 999;
div{ div{
position: relative; position: relative;
...@@ -277,43 +278,39 @@ export default { ...@@ -277,43 +278,39 @@ export default {
} }
} }
.hinput { .search {
width: 100%; background-color: #fff;
height: 68px; padding: 8px 12px;
border-bottom:1px solid #ccc; position: absolute;
display: flex; width: 100%;
justify-content: center; z-index: 100;
align-items: center; margin-bottom: 8px;
margin-top: 3px; margin-top: 52px;
background: #fff; input {
background: rgba(239, 239, 239, 0.55);
padding-left: 12px;
border-radius: 4px;
height: 36px;
width: 100%;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888C8F;
line-height: 36px;
}
.search-box { input::placeholder {
position: relative; font-size: 14px;
z-index: 50; color: #888C8F;
width: 93.6%; }
height: 36px;
font-size: 14px;
color: #B4B4B5;
letter-spacing: 0;
font-family: PingFangSC-Regular;
border: 1px solid rgba(56,63,69,0.60);
border-radius: 4px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
input { img {
width: 90%;height: 100%; position: absolute;
opacity: 0.4; height: 16px;
border: none; right: 25px;
line-height: 34px; top: 20px;
} }
}
}
.scrollContent{
padding-bottom: 90px;
} }
.wrap { .wrap {
width: 100%; width: 100%;
padding: 8px; padding: 8px;
...@@ -388,7 +385,39 @@ export default { ...@@ -388,7 +385,39 @@ export default {
} }
} }
.content{ .content{
padding-bottom: 14px; position: absolute;
top:0;
} }
.scrollContent{
padding-top: 3rem;
padding-bottom: 20px;
}
} }
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.4rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.8rem;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 4.2rem;
}
}
}
}
</style> </style>
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
--> -->
<template> <template>
<h-view class="distribute-sign" title="经销商签约"> <h-view id="distribute-sign" title="经销商签约">
<h-header :proportion="[5,1,1]" class="bar-custom"> <h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn"> <div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()"> <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
...@@ -13,11 +13,10 @@ ...@@ -13,11 +13,10 @@
</div> </div>
</h-header> </h-header>
<Tab @getTabNum="getTabNum"/> <Tab @getTabNum="getTabNum"/>
<div class="hinput"> <!-- 搜索 -->
<div class="search-box"> <div class="search">
<input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称"> <img src="@/assets/contractInquire/search.png" alt="">
<img src="@/assets/distributorSign/search.png" alt=""> <input v-model="searchInput" type="text" placeholder="请输入合同号/承租人名称">
</div>
</div> </div>
<scroll <scroll
ref="scroll" ref="scroll"
...@@ -209,49 +208,44 @@ export default { ...@@ -209,49 +208,44 @@ export default {
}, },
} }
</script> </script>
<style lang="less" scoped> <style lang="less">
.distribute-sign { #distribute-sign {
.hinput {
width: 100%;
height: 68px;
border-bottom:1px solid #ccc;
display: flex;
justify-content: center;
align-items: center;
margin-top: 3px;
background: #fff;
.search-box {
position: relative;
z-index: 50;
width: 93.6%;
height: 36px;
font-size: 14px;
color: #B4B4B5;
letter-spacing: 0;
font-family: PingFangSC-Regular;
border: 1px solid rgba(56,63,69,0.60);
border-radius: 4px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
.search {
background-color: #fff;
padding: 8px 12px;
position: absolute;
width: 100%;
z-index: 100;
margin-bottom: 8px;
top: 94px;
input { input {
width: 90%;height: 100%; background: rgba(239, 239, 239, 0.55);
opacity: 0.4; padding-left: 12px;
border: none; border-radius: 4px;
line-height: 34px; height: 36px;
} width: 100%;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888C8F;
line-height: 36px;
}
input::placeholder {
font-size: 14px;
color: #888C8F;
}
img {
position: absolute;
height: 16px;
right: 25px;
top: 20px;
}
} }
}
// .scrollContent{
// padding-bottom: 90px;
// }
.wrap { .wrap {
width: 100%; width: 100%;
padding: 8px; padding: 8px;
padding-bottom: 104px;
.contract-lists { .contract-lists {
width: 100%; width: 100%;
background: #fff; background: #fff;
...@@ -321,6 +315,40 @@ export default { ...@@ -321,6 +315,40 @@ export default {
} }
} }
} }
.content{
position: absolute;
top:0;
}
.scrollContent{
padding-top: 2.88rem;
padding-bottom: 20px;
}
} }
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.28rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 3.48rem;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#contract-signing {
.scrollContent {
padding-top: 4.08rem;
}
}
}
}
</style> </style>
...@@ -2,11 +2,11 @@ ...@@ -2,11 +2,11 @@
* @Description: In User Settings Edit * @Description: In User Settings Edit
* @Author: your name * @Author: your name
* @Date: 2019-09-25 11:10:34 * @Date: 2019-09-25 11:10:34
* @LastEditTime: 2019-09-25 21:05:24 * @LastEditTime: 2019-11-20 17:29:40
* @LastEditors: Please set LastEditors * @LastEditors: Please set LastEditors
--> -->
<template> <template>
<div class="tab-style"> <div class="tab-style has-header">
<div :class="{'tab-content-bg':tabNum == 0}" class="tab-content" @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?signed:sign"><span <div :class="{'tab-content-bg':tabNum == 0}" class="tab-content" @click="tabNum = 0;sendTabNum()"><img :src="tabNum == 0?signed:sign"><span
:class="{'colored':tabNum == 0}">待签约</span></div> :class="{'colored':tabNum == 0}">待签约</span></div>
<div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?finished:finish"><span <div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?finished:finish"><span
...@@ -39,8 +39,9 @@ export default { ...@@ -39,8 +39,9 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.tab-style { .tab-style {
position: relative; width: 100%;
z-index: 50; position: absolute;
z-index: 999;
background-color: #fff; background-color: #fff;
display: flex; display: flex;
justify-content: center; justify-content: center;
......
...@@ -59,40 +59,40 @@ ...@@ -59,40 +59,40 @@
</template> </template>
<script> <script>
export default { export default {
name: 'FinancingTrial', name: 'FinancingTrial',
data() { data () {
return { return {
lists: [], lists: [],
plan_price: '', plan_price: '',
price_date_to: '', price_date_to: '',
}
},
computed: {},
watch: {},
beforeRouteEnter (to, from, next) {
next(vm => {
if (from.name === 'ProDetailed') {
vm.price_date_to = vm.$route.params.price_date_to // 有效日期
vm.plan_price = vm.$route.params.plan_price // 参考价
vm.calculationQuery('collect')
} else if (from.name === 'HomePage') {
vm.calculationQuery()
vm.price_date_to = '' // 清除缓存(从收藏带来的数据)
vm.plan_price = ''
} }
}, })
computed: {}, next()
watch: {}, },
beforeRouteEnter(to, from, next) { activated () {
next(vm => {
if (from.name === 'ProDetailed') {
vm.price_date_to = vm.$route.params.price_date_to // 有效日期
vm.plan_price = vm.$route.params.plan_price // 参考价
vm.calculationQuery('collect')
} else if (from.name === 'HomePage') {
vm.calculationQuery()
vm.price_date_to = '' // 清除缓存(从收藏带来的数据)
vm.plan_price = ''
}
})
next()
},
activated() {
}, },
created() { created () {
}, },
methods: methods:
{ {
goDetails(val) { goDetails (val) {
this.$router.push({ this.$router.push({
name: 'FinancingDetails', name: 'FinancingDetails',
params: { params: {
...@@ -103,7 +103,7 @@ ...@@ -103,7 +103,7 @@
}) })
}, },
// 试算查询 // 试算查询
calculationQuery(val) { calculationQuery (val) {
let vm = this let vm = this
if (val) { if (val) {
let url = $config.basePath + 'prd_product_calculation_query' let url = $config.basePath + 'prd_product_calculation_query'
...@@ -140,7 +140,7 @@ ...@@ -140,7 +140,7 @@
} }
}, },
}, },
} }
</script> </script>
<style lang='less'> <style lang='less'>
#trial { #trial {
......
...@@ -4,27 +4,26 @@ ...@@ -4,27 +4,26 @@
* @Date 2019/10/22 * @Date 2019/10/22
*/ */
<template> <template>
<h-view class="public-style" style="height: 100%"> <h-view id="my-collect" class="public-style" style="height: 100%">
<h-header :proportion="[5,1,1]" class="bar-custom"> <h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn"> <div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()"> <img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>我的收藏</span> <span>我的收藏</span>
</div> </div>
</h-header> </h-header>
<h-content>
<div class="hinput"> <!-- 搜索 -->
<div class="search-box"> <div class="search has-header">
<input v-model="searchInput" type="text" placeholder="请输入经销商/产品名称/参数项"> <img src="@/assets/contractInquire/search.png" alt="">
<img src="@/assets/distributorSign/search.png" alt=""> <input v-model="searchInput" type="text" placeholder="请输入经销商/产品名称/参数项">
</div> </div>
</div>
<scroll <scroll
ref="scroll" ref="scroll"
:updateData="[productList]" :updateData="[productList]"
:pullUp="true" :pullUp="true"
@pullingUp="loadMore" @pullingUp="loadMore"
> >
<div class="division-box"> <div class="division-box">
<list-item v-for="(item,index) in productList" :key="index"> <list-item v-for="(item,index) in productList" :key="index">
<item :proportion="[1,4]" @click.native="goDetailed(item.product_id,item.collect_status,item.bp_id)"> <item :proportion="[1,4]" @click.native="goDetailed(item.product_id,item.collect_status,item.bp_id)">
...@@ -47,9 +46,9 @@ ...@@ -47,9 +46,9 @@
</div> </div>
</item> </item>
</list-item> </list-item>
</div> </div>
</scroll> </scroll>
</h-content>
</h-view> </h-view>
</template> </template>
...@@ -208,41 +207,40 @@ export default { ...@@ -208,41 +207,40 @@ export default {
} }
</script> </script>
<style scoped lang="less" rel="stylesheet"> <style lang="less" rel="stylesheet">
.hinput { #my-collect {
position: relative; .search {
z-index: 50; background-color: #fff;
width: 100%; padding: 8px 12px;
height: 50px; position: absolute;
border-bottom: 1px solid #cccccc70; width: 100%;
display: flex; z-index: 100;
justify-content: center; margin-bottom: 8px;
align-items: center;
background: #fff;
.search-box {
width: 93.6%;
height: 36px;
font-size: 14px;
color: #B4B4B5;
letter-spacing: 0;
font-family: PingFangSC-Regular;
border: 1px solid rgba(56, 63, 69, 0.60);
border-radius: 4px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
input { input {
width: 90%; background: rgba(239, 239, 239, 0.55);
height: 100%; padding-left: 12px;
opacity: 0.4; border-radius: 4px;
border: none; height: 36px;
line-height: 34px; width: 100%;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888C8F;
line-height: 36px;
}
input::placeholder {
font-size: 14px;
color: #888C8F;
}
img {
position: absolute;
height: 16px;
right: 25px;
top: 20px;
} }
} }
} .division-box {
.division-box {
padding: 8px; padding: 8px;
} }
.hls-list-item { .hls-list-item {
...@@ -306,7 +304,43 @@ export default { ...@@ -306,7 +304,43 @@ export default {
color: #4B4A4B; color: #4B4A4B;
} }
} }
} }
.content{
position: absolute;
top:0;
}
.scrollContent{
padding-top: 1.9rem;
padding-bottom: 20px;
}
}
.platform-ios {
#my-collect {
.scrollContent {
padding-top: 2.3rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#my-collect {
.scrollContent {
padding-top: 2.7rem;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#my-collect {
.scrollContent {
padding-top: 3.1rem;
}
}
}
}
</style> </style>
...@@ -11,11 +11,16 @@ ...@@ -11,11 +11,16 @@
<span>产品列表</span> <span>产品列表</span>
</div> </div>
</h-header> </h-header>
<div class="hinput"> <!-- <div class="hinput has-header">
<div class="search-box"> <div class="search-box">
<input v-model="searchInput" type="text" placeholder="请输入经销商/产品名称/参数项"> <input v-model="searchInput" type="text" placeholder="请输入经销商/产品名称/参数项">
<img src="@/assets/distributorSign/search.png" alt=""> <img src="@/assets/distributorSign/search.png" alt="">
</div> </div>
</div> -->
<!-- 搜索 -->
<div class="search has-header">
<img src="@/assets/contractInquire/search.png" alt="">
<input v-model="searchInput" type="text" placeholder="请输入经销商/产品名称/参数项">
</div> </div>
<scroll <scroll
ref="scroll" ref="scroll"
...@@ -205,39 +210,38 @@ export default { ...@@ -205,39 +210,38 @@ export default {
}, },
} }
</script> </script>
<style lang='less' scoped> <style lang='less'>
#prolist { #prolist {
.hinput { .search {
position: relative; background-color: #fff;
z-index: 50; padding: 8px 12px;
position: absolute;
width: 100%; width: 100%;
height: 50px; z-index: 100;
border-bottom: 1px solid #cccccc70; margin-bottom: 8px;
display: flex;
justify-content: center; input {
align-items: center; background: rgba(239, 239, 239, 0.55);
background: #fff; padding-left: 12px;
.search-box { border-radius: 4px;
width: 93.6%;
height: 36px; height: 36px;
font-size: 14px; width: 100%;
color: #B4B4B5;
letter-spacing: 0;
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
border: 1px solid rgba(56, 63, 69, 0.60); font-size: 14px;
border-radius: 4px; color: #888C8F;
display: flex; line-height: 36px;
flex-direction: row; }
justify-content: center;
align-items: center;
input { input::placeholder {
width: 90%; font-size: 14px;
height: 100%; color: #888C8F;
opacity: 0.4; }
border: none;
line-height: 34px; img {
} position: absolute;
height: 16px;
right: 25px;
top: 20px;
} }
} }
.division-box { .division-box {
...@@ -306,5 +310,40 @@ export default { ...@@ -306,5 +310,40 @@ export default {
} }
} }
.content{
position: absolute;
top:0;
}
.scrollContent{
padding-top: 1.92rem;
padding-bottom: 20px;
}
} }
.platform-ios {
#prolist {
.scrollContent {
padding-top: 2.32rem;
}
}
}
// iPhoneX适配
@media (device-width: 375px) and (device-height: 812px) and (-webkit-min-device-pixel-ratio: 3) {
.platform-ios {
#prolist {
.scrollContent {
padding-top: 2.72rem;
}
}
}
}
// iPhoneXR适配
@media (device-width: 414px) and (device-height: 896px) {
.platform-ios {
#prolist {
.scrollContent {
padding-top: 2.72rem;
}
}
}
}
</style> </style>
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