Commit 7cd8fb7d authored by Nature's avatar Nature

修复scroll滑动问题

parent b8b587ff
<template> <template>
<h-view class="public-style contract-mainten-list" style="height:100%;" title="合同维护"> <h-view class="public-style contract-mainten-list" title="合同维护">
<s-tab position="top" class="my-height" @tabClick="switchTab">
<tab-item>本年</tab-item>
<tab-item>本季</tab-item>
<tab-item>本月</tab-item>
</s-tab>
<h-content class="scroll-content"> <h-content class="scroll-content">
<div class="top-part"> <s-tab @tabClick="switchTab">
<div class="client"> <tab-item>本年</tab-item>
<div class="client-img"> <tab-item>本季</tab-item>
<img src="../../../assets/image/contractMainten/total@2x.png"> <tab-item>本月</tab-item>
</s-tab>
<div class="info-board">
<div class="board-line">
<div class="ionic-img">
<img src="@/assets/image/contractMainten/total@2x.png">
</div> </div>
<div class="statistics">合同总计</div> <div class="text">合同总计</div>
</div> </div>
<div class="total-num">\{{ infoShow.contract_count }}<span class="measure"></span></div> <div class="board-line"><span>\{{ infoShow.contract_count }}</span><span></span></div>
<div class="list-general"> <div class="board-line">
<div class="enterprise"> <div class="board-block">
<div class="list-name">新建</div> <div class="type">新建</div>
<div class="list-num">\{{ infoShow.new_count }}<span class="sum-num"></span></div> <div class="number"><span>\{{ infoShow.new_count }}</span></div>
</div> </div>
<div class="enterprise"> <div class="board-block">
<div class="list-name">签约</div> <div class="type">签约</div>
<div class="list-num">\{{ infoShow.sign_count }}<span class="sum-num"></span></div> <div class="number"><span>\{{ infoShow.sign_count }}</span></div>
</div> </div>
<div class="enterprise">
<div class="list-name">审批中</div> <div class="board-block">
<div class="list-num">\{{ infoShow.incept_count }}<span class="sum-num"></span></div> <div class="type">审批中</div>
<div class="number"><span>\{{ infoShow.incept_count }}</span></div>
</div> </div>
<div class="enterprise">
<div class="list-name">拒绝</div> <div class="board-block">
<div class="list-num">\{{ infoShow.overdue_count }}<span class="sum-num"></span></div> <div class="type">拒绝</div>
<div class="number"><span>\{{ infoShow.overdue_count }}</span></div>
</div> </div>
</div> </div>
</div> </div>
<div class="search"> <div class="search">
<div class="searchInput"> <div class="searchInput">
<div class="searchIcon"> <div class="img-box"><img src="@/assets/image/contractMainten/search@2x.png"></div>
<div class="img-box"><img src="../../../assets/image/contractMainten/search@2x.png"></div>
</div>
<input <input
v-model="searchCondition.input" placeholder="请输入合同编号/承租人名称" v-model="searchCondition.input"
placeholder="请输入合同编号/承租人名称"
@input="detectSearchCondition()"> @input="detectSearchCondition()">
</div> </div>
<div class="filterIcon" @click="detectSearchCondition()">
<img src="../../../assets/image/contractMainten/filter@2x.png">
</div>
</div> </div>
<scroll <scroll
ref="scroll" ref="scroll"
...@@ -55,15 +52,14 @@ ...@@ -55,15 +52,14 @@
@pullingUp="loadMore"> @pullingUp="loadMore">
<list-item :item-height="80"> <list-item :item-height="80">
<item <item
v-for="(list,index) in con_list" v-for="(list,index) in con_list" :key="index" :proportion="[5,1]" :show-arrow="true"
:has-border="false" :key="index" :proportion="[5,1]" :show-arrow="true"
@click.native="goContractMainten(list)"> @click.native="goContractMainten(list)">
<img slot="left-icon" src="../../../assets/image/contractMainten/item@2x.png" class="left-icon"> <img slot="left-icon" src="@/assets/image/contractMainten/item@2x.png" class="left-icon">
<div slot="name" class="text"> <div slot="name" class="text">
<div class="cont-name">合同编号:\{{ list.contract_number }}</div> <div class="cont-name" style="font-size: 16px;color: #5D98F6">合同编号:\{{ list.contract_number }}</div>
<div class="cont-type">承租人名称:\{{ list.bp_id_tenant_n }}</div> <div class="cont-type" style="color: #8C8C8C;">承租人名称:\{{ list.bp_id_tenant_n }}</div>
<div class="cont-type">单据类别:\{{ list.document_type_n }}</div> <div class="cont-type" style="color: #8C8C8C;">单据类别:\{{ list.document_type_n }}</div>
<div class="cont-type">合同创建日期:\{{ list.creation_date }}</div> <div class="cont-type" style="color: #8C8C8C;">合同创建日期:\{{ list.creation_date }}</div>
</div> </div>
</item> </item>
</list-item> </list-item>
...@@ -73,294 +69,321 @@ ...@@ -73,294 +69,321 @@
</template> </template>
<script> <script>
export default { export default {
data () { data () {
return { return {
con_list: [], con_list: [],
infoShow: {}, infoShow: {},
info: null, info: null,
searchCondition: { searchCondition: {
input: null, input: null,
}, },
} }
},
created () {
this.offsize = 1
this.pagesize = 10
this.index = [1, 0, 0]
},
mounted () {
this._initLoad()
},
methods: {
switchTab: function (index) {
let vm = this
vm.index = [0, 0, 0]
vm.index[index] = 1
vm.changeData()
}, },
changeData: function () { created () {
let vm = this this.offsize = 1
vm.infoShow = vm.info[vm.getTabName()][0] this.pagesize = 10
this.index = [1, 0, 0]
}, },
mounted () {
this._initLoad()
},
methods: {
switchTab: function (index) {
let vm = this
vm.index = [0, 0, 0]
vm.index[index] = 1
vm.changeData()
},
changeData: function () {
let vm = this
vm.infoShow = vm.info[vm.getTabName()][0]
},
getTabName: function () { getTabName: function () {
let vm = this let vm = this
let tabName = '' let tabName = ''
vum.forEach(vm.index, function (data, index, array) { vum.forEach(vm.index, function (data, index, array) {
if (data === 1) { if (data === 1) {
if (index === 0) { if (index === 0) {
tabName = 'year_contract_list' tabName = 'year_contract_list'
} else if (index === 1) { } else if (index === 1) {
tabName = 'reason_contract_list' tabName = 'reason_contract_list'
} else if (index === 2) { } else if (index === 2) {
tabName = 'month_contract_list' tabName = 'month_contract_list'
}
} }
} })
}) return tabName
return tabName },
},
detectSearchCondition: function () { detectSearchCondition: function () {
let vm = this let vm = this
if (vm.timeout) { if (vm.timeout) {
clearTimeout(vm.timeout) clearTimeout(vm.timeout)
} }
vm.timeout = setTimeout(function () { vm.timeout = setTimeout(function () {
vm._initLoad() vm._initLoad()
}, 1000) }, 1000)
}, },
_initLoad: function () { _initLoad: function () {
let vm = this let vm = this
vm.load_count() vm.load_count()
vm.offsize = 1 vm.offsize = 1
let url = process.env.basePath + 'app_get_contract_selected' // 合同维护信息查询 let url = process.env.basePath + 'app_get_contract_selected' // 合同维护信息查询
let param = { let param = {
'offsize': vm.offsize, 'offsize': vm.offsize,
'searchInput': vm.searchCondition.input, 'searchInput': vm.searchCondition.input,
}
vm.hlsPopup.showLoading('请稍等')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
vm.con_list = res.getContract_list
if (res.getContract_list.length >= 0 && res.getContract_list.length < vm.pagesize) {
vm.$refs.scroll.update(true)
} }
}) vm.hlsPopup.showLoading('请稍等')
}, vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
vm.con_list = res.getContract_list
if (res.getContract_list.length >= 0 && res.getContract_list.length < vm.pagesize) {
vm.$refs.scroll.update(true)
}
})
},
load_count: function () { load_count: function () {
let vm = this let vm = this
let url = process.env.basePath + 'contract_count' let url = process.env.basePath + 'contract_count'
let param = {} let param = {}
// hlsPopup.showLoadingWithoutBackdrop(); // hlsPopup.showLoadingWithoutBackdrop();
vm.$post(url, param).then(function (res) { vm.$post(url, param).then(function (res) {
vm.info = res vm.info = res
vm.changeData() vm.changeData()
}) })
}, },
loadMore: function () { loadMore: function () {
let vm = this let vm = this
vm.offsize = vm.offsize + 1 vm.offsize = vm.offsize + 1
let url = process.env.basePath + 'app_get_contract_selected' let url = process.env.basePath + 'app_get_contract_selected'
let param = { let param = {
'offsize': vm.offsize, 'offsize': vm.offsize,
'searchInput': vm.searchCondition.input, 'searchInput': vm.searchCondition.input,
}
vm.$post(url, param).then(function (res) {
let returnData = []
returnData = res.getContract_list
if (returnData.length === 0) {
vm.$refs.scroll.update(true)
} else if (returnData.length > 0 && returnData.length < vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(true)
} else if (returnData.length === vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(false)
} }
}) vm.$post(url, param).then(function (res) {
}, let returnData = []
goContractMainten: function (list) { returnData = res.getContract_list
this.$router.push({ if (returnData.length === 0) {
name: 'ContractMainten', vm.$refs.scroll.update(true)
params: { } else if (returnData.length > 0 && returnData.length < vm.pagesize) {
contract_id: list.contract_id, vum.forEach(returnData, function (data, index, array) {
cdd_list_id: list.cdd_list_id, vm.con_list.push(array[index])
}, })
}) vm.$refs.scroll.update(true)
} else if (returnData.length === vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(false)
}
})
},
goContractMainten: function (list) {
this.$router.push({
name: 'ContractMainten',
params: {
contract_id: list.contract_id,
cdd_list_id: list.cdd_list_id,
},
})
},
}, },
}, }
}
</script> </script>
<style lang="less" rel="stylesheet"> <style lang="less" rel="stylesheet">
.contract-mainten-list { .contract-mainten-list {
.scroll-content{ .scroll-content{
position: absolute; position: absolute;
top: 40px; top: 0;
right: 0;
bottom: 0; bottom: 0;
left: 0;
width: auto;
height: auto; height: auto;
overflow: hidden; overflow: hidden;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
overflow-scrolling: touch; overflow-scrolling: touch;
} }
.content { .content-scroll{
top:225px;
}
.content{
overflow: hidden;
}
.hls-switch-tab .tab-content .h-tab-item .h-item {
width: 100%;
}
.hls-switch-tab {
position: relative;
}
.info-board {
background-color: #FFF; background-color: #FFF;
padding-top: 0;
.top-part{ .board-line {
background-color: #FFFFFF; display: flex;
padding:12px 0 10px 0; display: -webkit-flex;
.client{ padding-top: 10px;
display: flex; justify-content: space-between;
.client-img{ -webkit-justify-content: space-between;
margin:0 5px 0 15px; font-size: 13px;
img{ line-height: 18px;
width:17px; padding-bottom: 6px;
height: 15px;
} &:before {
} content: '';
.statistics{ }
font-size: 14px;
line-height: 16px; &:after {
color: #363636; content: '';
}
&:first-child {
justify-content: flex-start;
-webkit-justify-content: flex-start;
}
&:nth-child(2) {
justify-content: center;
-webkit-justify-content: center;
}
.ionic-img {
margin-left: 11px;
margin-right: 4px;
width: 17px;
height: 15px;
img {
height: 100%;
width: 100%;
border: none;
} }
} }
.total-num{
width: 100%; .text {
padding: 10px 0 25px 0; font-size: @font-size-middle;
}
span {
font-size: 26px; font-size: 26px;
color: #FF8877; color: #FF8877;
display: flex; margin-right: 2px;
justify-content: center;
.measure{ &:nth-child(2) {
font-size: 13px; font-size: @font-size-small;
color: #313131; color: #313131;
padding:5px; margin-top: 5px;
margin-left: 2px;
} }
} }
.list-general{
.board-block {
height: 100%;
width: 100%; width: 100%;
display: flex; text-align: center;
justify-content: center;
.enterprise{ .number {
width: 25%; span {
display: flex; font-size: @font-size-middle;
text-align:center; margin-right: 2px;
flex-direction: column;
.list-name{
font-size: 13px;
color: #313131;
}
.list-num{
padding-top: 6px;
font-size: 14px;
color: #FF8877;
.sum-num{
font-size: 12px;
line-height: 17px;
color: #313131;
padding-left: 2px;
}
} }
} }
} }
} }
.search { }
.search {
display: flex;
height: 50px;
background-color: #FFF;
margin-top: 10px;
// margin-bottom: 10px;
.searchInput {
display: flex; display: flex;
display: -webkit-flex; display: -webkit-flex;
height:50px; height: 33px;
background-color: #FFFFFF; border: 1px solid #5D98F6; /*no*/
// margin-top: 10px; margin: 7px 10px;
.searchInput { width: 100%;
display: flex; display: flex;
display: -webkit-flex; align-items: center;
height: 33px; -webkit-align-items: center;
border: 1px solid @headerColor;
.img-box {
height: 17px;
border-right: 1px solid #5D98F6; /*no*/
padding: 2px 0;
margin-left: 10px; margin-left: 10px;
margin-top: 7px;
margin-bottom: 7px;
width: 100%;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
.img-box {
height: 17px;
border-right: 1px solid @headerColor;
padding: 2px 0;
margin-left: 10px;
img {
width: 50%;
margin-right: 5px;
}
}
input {
width: 80%;
font-size: 13px;
height: 17px;
line-height: 17px;
border: none;
margin-top: 3px;
margin-bottom: 4px;
padding-left: 10px;
}
}
.filterIcon {
width: 38px;
height: 33px;
background-color: @headerColor;
margin: 7px 10px 0px 10px;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
justify-content: center;
-webkit-justify-content: center;
img { img {
width: 50%; margin-right: 5px;
width: 15px;
} }
} }
}
.hls-item { input {
&:nth-child(odd){ width: 100%;
background-color: #EFF1F3; font-size: 13px;
height: 17px;
line-height: 17px;
border: none;
margin-top: 3px;
margin-bottom: 4px;
padding-left: 11px;
} }
&:nth-child(even){ }
background-color: #fff; }
.vue-better-scroll {
// top: 226px;
}
.vue-better-scroll__wrapper {
margin-top: 10px;
}
.hls-item {
&:nth-child(odd) {
background-color: #EFF1F3;
}
&:nth-child(even) {
background-color: #fff;
}
.contents .add-name {
.left-icon {
width: 34px;
} }
.contents { .text {
.add-name { margin-left: 15px;
.cont-name{
font-size: 15px; .cont {
line-height: 21px; margin-top: 5px;
color: @headerColor; font-size: 13px;
} line-height: 18px;
.cont-type{
font-size: 13px; &:first-child {
line-height: 18px; margin-top: 0;
color: #888;
}
.left-icon{
width: 10%;
} }
} }
.cont-num {
margin-top: 8px;
font-size: 15px;
line-height: 21px;
color: #5D98F6;
}
} }
} }
} }
.content-scroll{
top: 210px;
}
} }
</style> </style>
<template> <template>
<h-view class="public-style contract-sign-list" style="height:100%;" title="合同签约"> <h-view class="public-style contract-sign-list" title="合同签约">
<s-tab position="top" class="my-height" @tabClick="switchTab">
<tab-item>本年</tab-item>
<tab-item>本季</tab-item>
<tab-item>本月</tab-item>
</s-tab>
<h-content class="scroll-content"> <h-content class="scroll-content">
<div class="top-part"> <s-tab @tabClick="switchTab">
<div class="client"> <tab-item>本年</tab-item>
<div class="client-img"> <tab-item>本季</tab-item>
<img src="../../../assets/image/contractMainten/total@2x.png"> <tab-item>本月</tab-item>
</s-tab>
<div class="info-board">
<div class="board-line">
<div class="ionic-img">
<img src="@/assets/image/contractMainten/total@2x.png">
</div> </div>
<div class="statistics">合同总计</div> <div class="text">合同总计</div>
</div> </div>
<div class="total-num">\{{ infoShow.contract_count }}<span class="measure"></span></div> <div class="board-line"><span>\{{ infoShow.contract_count }}</span><span></span></div>
<div class="list-general"> <div class="board-line">
<div class="enterprise"> <div class="board-block">
<div class="list-name">新建</div> <div class="type">新建</div>
<div class="list-num">\{{ infoShow.new_count }}<span class="sum-num"></span></div> <div class="number"><span>\{{ infoShow.new_count }}</span></div>
</div> </div>
<div class="enterprise"> <div class="board-block">
<div class="list-name">签约</div> <div class="type">签约</div>
<div class="list-num">\{{ infoShow.sign_count }}<span class="sum-num"></span></div> <div class="number"><span>\{{ infoShow.sign_count }}</span></div>
</div> </div>
<div class="enterprise">
<div class="list-name">审批中</div> <div class="board-block">
<div class="list-num">\{{ infoShow.incept_count }}<span class="sum-num"></span></div> <div class="type">审批中</div>
<div class="number"><span>\{{ infoShow.incept_count }}</span></div>
</div> </div>
<div class="enterprise">
<div class="list-name">拒绝</div> <div class="board-block">
<div class="list-num">\{{ infoShow.overdue_count }}<span class="sum-num"></span></div> <div class="type">拒绝</div>
<div class="number"><span>\{{ infoShow.overdue_count }}</span></div>
</div> </div>
</div> </div>
</div> </div>
<div class="search"> <div class="search">
<div class="searchInput"> <div class="searchInput">
<div class="searchIcon"> <div class="img-box"><img src="@/assets/image/contractMainten/search@2x.png"></div>
<div class="img-box"><img src="../../../assets/image/contractMainten/search@2x.png"></div>
</div>
<input <input
v-model="searchCondition.input" placeholder="请输入合同编号/承租人名称" v-model="searchCondition.input"
placeholder="请输入合同编号/承租人名称"
@input="detectSearchCondition()"> @input="detectSearchCondition()">
</div> </div>
<div class="filterIcon" @click="detectSearchCondition()">
<img src="../../../assets/image/contractMainten/filter@2x.png">
</div>
</div> </div>
<scroll <scroll
ref="scroll" ref="scroll"
...@@ -55,15 +52,14 @@ ...@@ -55,15 +52,14 @@
@pullingUp="loadMore"> @pullingUp="loadMore">
<list-item :item-height="80"> <list-item :item-height="80">
<item <item
v-for="(list,index) in con_list" v-for="(list,index) in con_list" :key="index" :proportion="[5,1]" :show-arrow="true"
:has-border="false" :key="index" :proportion="[5,1]" :show-arrow="true"
@click.native="goContractMainten(list)"> @click.native="goContractMainten(list)">
<img slot="left-icon" src="../../../assets/image/contractMainten/item@2x.png" class="left-icon"> <img slot="left-icon" src="@/assets/image/contractMainten/item@2x.png" class="left-icon">
<div slot="name" class="text"> <div slot="name" class="text">
<div class="cont-name">合同编号:\{{ list.contract_number }}</div> <div class="cont-name" style="font-size: 16px;color: #5D98F6">合同编号:\{{ list.contract_number }}</div>
<div class="cont-type">承租人名称:\{{ list.bp_id_tenant_n }}</div> <div class="cont-type" style="color: #8C8C8C;">承租人名称:\{{ list.bp_id_tenant_n }}</div>
<div class="cont-type">单据类别:\{{ list.document_type_n }}</div> <div class="cont-type" style="color: #8C8C8C;">单据类别:\{{ list.document_type_n }}</div>
<div class="cont-type">合同创建日期:\{{ list.creation_date }}</div> <div class="cont-type" style="color: #8C8C8C;">合同创建日期:\{{ list.creation_date }}</div>
</div> </div>
</item> </item>
</list-item> </list-item>
...@@ -73,294 +69,321 @@ ...@@ -73,294 +69,321 @@
</template> </template>
<script> <script>
export default { export default {
data () { data () {
return { return {
con_list: [], con_list: [],
infoShow: {}, infoShow: {},
info: null, info: null,
searchCondition: { searchCondition: {
input: null, input: null,
}, },
} }
},
created () {
this.offsize = 1
this.pagesize = 10
this.index = [1, 0, 0]
},
mounted () {
this._initLoad()
},
methods: {
switchTab: function (index) {
let vm = this
vm.index = [0, 0, 0]
vm.index[index] = 1
vm.changeData()
}, },
changeData: function () { created () {
let vm = this this.offsize = 1
vm.infoShow = vm.info[vm.getTabName()][0] this.pagesize = 10
this.index = [1, 0, 0]
}, },
mounted () {
this._initLoad()
},
methods: {
switchTab: function (index) {
let vm = this
vm.index = [0, 0, 0]
vm.index[index] = 1
vm.changeData()
},
changeData: function () {
let vm = this
vm.infoShow = vm.info[vm.getTabName()][0]
},
getTabName: function () { getTabName: function () {
let vm = this let vm = this
let tabName = '' let tabName = ''
vum.forEach(vm.index, function (data, index, array) { vum.forEach(vm.index, function (data, index, array) {
if (data === 1) { if (data === 1) {
if (index === 0) { if (index === 0) {
tabName = 'year_contract_list' tabName = 'year_contract_list'
} else if (index === 1) { } else if (index === 1) {
tabName = 'reason_contract_list' tabName = 'reason_contract_list'
} else if (index === 2) { } else if (index === 2) {
tabName = 'month_contract_list' tabName = 'month_contract_list'
}
} }
} })
}) return tabName
return tabName },
},
detectSearchCondition: function () { detectSearchCondition: function () {
let vm = this let vm = this
if (vm.timeout) { if (vm.timeout) {
clearTimeout(vm.timeout) clearTimeout(vm.timeout)
} }
vm.timeout = setTimeout(function () { vm.timeout = setTimeout(function () {
vm._initLoad() vm._initLoad()
}, 1000) }, 1000)
}, },
_initLoad: function () { _initLoad: function () {
let vm = this let vm = this
vm.load_count() vm.load_count()
vm.offsize = 1 vm.offsize = 1
let url = process.env.basePath + 'app_get_contract_selected' // 合同维护信息查询 let url = process.env.basePath + 'app_get_contract_selected' // 合同维护信息查询
let param = { let param = {
'offsize': vm.offsize, 'offsize': vm.offsize,
'searchInput': vm.searchCondition.input, 'searchInput': vm.searchCondition.input,
}
vm.hlsPopup.showLoading('请稍等')
vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
vm.con_list = res.getContract_list
if (res.getContract_list.length >= 0 && res.getContract_list.length < vm.pagesize) {
vm.$refs.scroll.update(true)
} }
}) vm.hlsPopup.showLoading('请稍等')
}, vm.$post(url, param).then(function (res) {
vm.hlsPopup.hideLoading()
vm.con_list = res.getContract_list
if (res.getContract_list.length >= 0 && res.getContract_list.length < vm.pagesize) {
vm.$refs.scroll.update(true)
}
})
},
load_count: function () { load_count: function () {
let vm = this let vm = this
let url = process.env.basePath + 'contract_count' let url = process.env.basePath + 'contract_count'
let param = {} let param = {}
// hlsPopup.showLoadingWithoutBackdrop(); // hlsPopup.showLoadingWithoutBackdrop();
vm.$post(url, param).then(function (res) { vm.$post(url, param).then(function (res) {
vm.info = res vm.info = res
vm.changeData() vm.changeData()
}) })
}, },
loadMore: function () { loadMore: function () {
let vm = this let vm = this
vm.offsize = vm.offsize + 1 vm.offsize = vm.offsize + 1
let url = process.env.basePath + 'app_get_contract_selected' let url = process.env.basePath + 'app_get_contract_selected'
let param = { let param = {
'offsize': vm.offsize, 'offsize': vm.offsize,
'searchInput': vm.searchCondition.input, 'searchInput': vm.searchCondition.input,
}
vm.$post(url, param).then(function (res) {
let returnData = []
returnData = res.getContract_list
if (returnData.length === 0) {
vm.$refs.scroll.update(true)
} else if (returnData.length > 0 && returnData.length < vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(true)
} else if (returnData.length === vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(false)
} }
}) vm.$post(url, param).then(function (res) {
}, let returnData = []
goContractMainten: function (list) { returnData = res.getContract_list
this.$router.push({ if (returnData.length === 0) {
name: 'ContractSign', vm.$refs.scroll.update(true)
params: { } else if (returnData.length > 0 && returnData.length < vm.pagesize) {
contract_id: list.contract_id, vum.forEach(returnData, function (data, index, array) {
cdd_list_id: list.cdd_list_id, vm.con_list.push(array[index])
}, })
}) vm.$refs.scroll.update(true)
} else if (returnData.length === vm.pagesize) {
vum.forEach(returnData, function (data, index, array) {
vm.con_list.push(array[index])
})
vm.$refs.scroll.update(false)
}
})
},
goContractMainten: function (list) {
this.$router.push({
name: 'ContractSign',
params: {
contract_id: list.contract_id,
cdd_list_id: list.cdd_list_id,
},
})
},
}, },
}, }
}
</script> </script>
<style lang="less" rel="stylesheet"> <style lang="less" rel="stylesheet">
.contract-sign-list { .contract-sign-list {
.scroll-content{ .scroll-content{
position: absolute; position: absolute;
top: 40px; top: 0;
right: 0;
bottom: 0; bottom: 0;
left: 0;
width: auto;
height: auto; height: auto;
overflow: hidden; overflow: hidden;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
overflow-scrolling: touch; overflow-scrolling: touch;
} }
.content { .content-scroll{
top:225px;
}
.content{
overflow: hidden;
}
.hls-switch-tab .tab-content .h-tab-item .h-item {
width: 100%;
}
.hls-switch-tab {
position: relative;
}
.info-board {
background-color: #FFF; background-color: #FFF;
padding-top: 0;
.top-part{ .board-line {
background-color: #FFFFFF; display: flex;
padding:12px 0 10px 0; display: -webkit-flex;
.client{ padding-top: 10px;
display: flex; justify-content: space-between;
.client-img{ -webkit-justify-content: space-between;
margin:0 5px 0 15px; font-size: 13px;
img{ line-height: 18px;
width:17px; padding-bottom: 6px;
height: 15px;
} &:before {
} content: '';
.statistics{ }
font-size: 14px;
line-height: 16px; &:after {
color: #363636; content: '';
}
&:first-child {
justify-content: flex-start;
-webkit-justify-content: flex-start;
}
&:nth-child(2) {
justify-content: center;
-webkit-justify-content: center;
}
.ionic-img {
margin-left: 11px;
margin-right: 4px;
width: 17px;
height: 15px;
img {
height: 100%;
width: 100%;
border: none;
} }
} }
.total-num{
width: 100%; .text {
padding: 10px 0 25px 0; font-size: @font-size-middle;
}
span {
font-size: 26px; font-size: 26px;
color: #FF8877; color: #FF8877;
display: flex; margin-right: 2px;
justify-content: center;
.measure{ &:nth-child(2) {
font-size: 13px; font-size: @font-size-small;
color: #313131; color: #313131;
padding:5px; margin-top: 5px;
margin-left: 2px;
} }
} }
.list-general{
.board-block {
height: 100%;
width: 100%; width: 100%;
display: flex; text-align: center;
justify-content: center;
.enterprise{ .number {
width: 25%; span {
display: flex; font-size: @font-size-middle;
text-align:center; margin-right: 2px;
flex-direction: column;
.list-name{
font-size: 13px;
color: #313131;
}
.list-num{
padding-top: 6px;
font-size: 14px;
color: #FF8877;
.sum-num{
font-size: 12px;
line-height: 17px;
color: #313131;
padding-left: 2px;
}
} }
} }
} }
} }
.search { }
.search {
display: flex;
height: 50px;
background-color: #FFF;
margin-top: 10px;
// margin-bottom: 10px;
.searchInput {
display: flex; display: flex;
display: -webkit-flex; display: -webkit-flex;
height:50px; height: 33px;
background-color: #FFFFFF; border: 1px solid #5D98F6; /*no*/
margin-top: 10px; margin: 7px 10px;
.searchInput { width: 100%;
display: flex; display: flex;
display: -webkit-flex; align-items: center;
height: 33px; -webkit-align-items: center;
border: 1px solid @headerColor;
.img-box {
height: 17px;
border-right: 1px solid #5D98F6; /*no*/
padding: 2px 0;
margin-left: 10px; margin-left: 10px;
margin-top: 7px;
margin-bottom: 7px;
width: 100%;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
.img-box {
height: 17px;
border-right: 1px solid @headerColor;
padding: 2px 0;
margin-left: 10px;
img {
width: 50%;
margin-right: 5px;
}
}
input {
width: 80%;
font-size: 13px;
height: 17px;
line-height: 17px;
border: none;
margin-top: 3px;
margin-bottom: 4px;
padding-left: 10px;
}
}
.filterIcon {
width: 38px;
height: 33px;
background-color: @headerColor;
margin: 7px 10px 0px 10px;
display: flex;
display: -webkit-flex;
align-items: center;
-webkit-align-items: center;
justify-content: center;
-webkit-justify-content: center;
img { img {
width: 50%; margin-right: 5px;
width: 15px;
} }
} }
}
.hls-item { input {
&:nth-child(odd){ width: 100%;
background-color: #EFF1F3; font-size: 13px;
height: 17px;
line-height: 17px;
border: none;
margin-top: 3px;
margin-bottom: 4px;
padding-left: 11px;
} }
&:nth-child(even){ }
background-color: #fff; }
.vue-better-scroll {
// top: 226px;
}
.vue-better-scroll__wrapper {
margin-top: 10px;
}
.hls-item {
&:nth-child(odd) {
background-color: #EFF1F3;
}
&:nth-child(even) {
background-color: #fff;
}
.contents .add-name {
.left-icon {
width: 34px;
} }
.contents { .text {
.add-name { margin-left: 15px;
.cont-name{
font-size: 15px; .cont {
line-height: 21px; margin-top: 5px;
color: @headerColor; font-size: 13px;
} line-height: 18px;
.cont-type{
font-size: 13px; &:first-child {
line-height: 18px; margin-top: 0;
color: #888;
}
.left-icon{
width: 10%;
} }
} }
.cont-num {
margin-top: 8px;
font-size: 15px;
line-height: 21px;
color: #5D98F6;
}
} }
} }
} }
.content-scroll{
top: 215px;
}
} }
</style> </style>
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
</bottom-tab> </bottom-tab>
<h-modal ref="modal" v-model="showModalValue" position="bottom" cus-class="search-modal"> <h-modal ref="modal" v-model="showModalValue" position="bottom" cus-class="search-modal">
<h-view> <h-view class="scroll-content">
<h-header :proportion="[1,15,4]" class="bar-custom"> <h-header :proportion="[1,15,4]" class="bar-custom">
<div slot="center" class="search-shelter"> <div slot="center" class="search-shelter">
<img src="@/assets/image/projectCreate/search.png" class="search-icon"> <img src="@/assets/image/projectCreate/search.png" class="search-icon">
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
ref="scroll" ref="scroll"
:updateData="[bpList]" :updateData="[bpList]"
:pullUp="true" :pullUp="true"
class="" class="content-scroll"
@pullingUp="loadMore"> @pullingUp="loadMore">
<list-item :item-height="80"> <list-item :item-height="80">
<item <item
...@@ -401,6 +401,18 @@ export default { ...@@ -401,6 +401,18 @@ export default {
padding-bottom: 80px; padding-bottom: 80px;
} }
.search-modal { .search-modal {
.scroll-content{
position: absolute;
top:0;
bottom: 0;
height: auto;
overflow: hidden;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
.content-scroll{
top:44px
}
.search-shelter { .search-shelter {
height: 30px; height: 30px;
width: 100%; width: 100%;
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<template> <template>
<h-view class="public-style project-mainten" title="申请维护"> <h-view class="public-style project-mainten" title="申请维护">
<h-content class=""> <h-content class="scroll-content">
<s-tab @tabClick="changeData"> <s-tab @tabClick="changeData">
<tab-item>本年</tab-item> <tab-item>本年</tab-item>
<tab-item>本季</tab-item> <tab-item>本季</tab-item>
...@@ -50,6 +50,7 @@ ...@@ -50,6 +50,7 @@
</div> </div>
<scroll <scroll
ref="scroll" ref="scroll"
class="content-scroll"
:updateData="[prjList]" :updateData="[prjList]"
:pullUp="true" :pullUp="true"
@pullingUp="loadMore"> @pullingUp="loadMore">
...@@ -234,6 +235,18 @@ export default { ...@@ -234,6 +235,18 @@ export default {
<style lang="less"> <style lang="less">
.project-mainten { .project-mainten {
.scroll-content{
position: absolute;
top:0;
bottom: 0;
height: auto;
overflow: hidden;
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
.content-scroll{
top:225px;
}
.content{ .content{
overflow: hidden; overflow: hidden;
} }
......
...@@ -3843,7 +3843,7 @@ he@1.2.x, he@^1.1.0: ...@@ -3843,7 +3843,7 @@ he@1.2.x, he@^1.1.0:
"hls-easy-ui@https://hel.hand-china.com/easyUI/hls-easy-ui.git": "hls-easy-ui@https://hel.hand-china.com/easyUI/hls-easy-ui.git":
version "0.0.2" version "0.0.2"
resolved "https://hel.hand-china.com/easyUI/hls-easy-ui.git#b433d1b61485e60df671921acea7530c7e78e86e" resolved "https://hel.hand-china.com/easyUI/hls-easy-ui.git#a37b6f172b19e7204d940f9e6041bdce4a70beb6"
dependencies: dependencies:
autosize "^3.0.20" autosize "^3.0.20"
better-scroll "^1.10.3" better-scroll "^1.10.3"
......
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