Commit 940d5bba authored by 李晓兵's avatar 李晓兵

'登录注册'

parent afae2c13
<template>
<h-view class="contract-signing">
<h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>合同签约</span>
</div>
</h-header>
<div class="tab-style">
<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>
<div class="hinput">
<div class="search-box">
<input type="text" placeholder="请输入进件号/承租人名称">
<img src="@/assets/constractSigning/search.png" alt="" style="width:18px">
</div>
</div>
<h-content>
<div v-for="(item,index) in contractMsg" :key="index" class="contract-list">
<div class="item">
<img src="@/assets/constractSigning/Incoming.png" alt="" style="height:18px">
<p class="incoming-num">进件号</p>
<p class="code">{{ item.code }}</p>
</div>
<div class="details">
<div class="option">
<p class="name">承租人</p>
<p class="full-name normal">{{ item.name }}</p>
</div>
<div class="option" @click="goDetails(index)">
<p class="name">合同租金</p>
<p class="normal money">{{ item.money | currency }}</p>
<img src="@/assets/distributorSign/goDetails.png" alt="">
</div>
<div class="option">
<p class="name">申请时间</p>
<p class="normal">{{ item.date }}</p>
</div>
</div>
</div>
</h-content>
</h-view>
</template>
<script>
import Check1 from '@/assets/constractSigning/no-done.png'
import Check2 from '@/assets/constractSigning/yes-done.png'
import unCheck1 from '@/assets/constractSigning/no-undone.png'
import unCheck2 from '@/assets/constractSigning/yes-undone.png'
export default {
data () {
return {
num: 1,
check1: Check1,
check2: Check2,
uncheck1: unCheck1,
uncheck2: unCheck2,
contractMsg: [
{name: '张三', money: 90000, date: '2019-03-1', code: '201903022001'},
{name: '李四', money: 90000, date: '2019-03-1', code: '201903022002'},
{name: '王五', money: 90000, date: '2019-03-1', code: '201903022003'},
{name: '赵六', money: 90000, date: '2019-03-1', code: '201903022004'},
{name: '张三', money: 90000, date: '2019-03-1', code: '201903022001'},
{name: '李四', money: 90000, date: '2019-03-1', code: '201903022002'},
{name: '王五', money: 90000, date: '2019-03-1', code: '201903022003'},
{name: '赵六', money: 90000, date: '2019-03-1', code: '201903022004'},
],
}
},
activated () {
},
methods: {
goDetails (index) {
this.$router.push({
name: 'ContractDetail',
})
},
},
}
</script>
<style lang="less" type="text/less">
.contract-signing{
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 4px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
font-size: 17px;
letter-spacing: 0.61px;
line-height: 24px;
}
}
.tab-style{
display:flex;
justify-content: center;
padding-top:12px;
padding-bottom: 8px;
align-items: center;
background-color: #fff;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
div{
position: relative;
height: 32px;
width: 172px;
border-radius:16px;
border-radius: 16px;
font-family: PingFangSC-Semibold;
font-size: 14px;
letter-spacing: 0.43px;
margin: 0 4px;
line-height: 32px;
}
.undone{
background: rgba(220,220,221,0.26);
color: #383F45;
}
.done{
background: rgba(0,70,156,0.10);
color: #00469C;
}
img{
height: 20px;
display: block;
float: left;
margin: 6px 0 0 43px;
}
span{
position: absolute;
left:70px;
}
}
.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 {
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 {
width: 90%;height: 100%;
opacity: 0.4;
border: none
}
}
}
.contract-list {
width: 100%;
height: 120px;
// border: 1px solid #ccc;
background: #fff;
margin-top: 8px;
.item {
width: 100%;
height: 34px;
background: rgba(00, 70, 156, 0.1);
display: flex;
flex-direction: row;
align-items: center;
img {
margin-left: 16.6px;
}
.incoming-num {
font-family: PingFangSC-Semibold;
// width: 42px;
height: 20px;
font-weight: bolder;
line-height: 20px;
font-size: 14px;
color: #00469C;
letter-spacing: 0;
margin-left: 8.8px;
}
.code {
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #00469C;
margin-left: 8px;
font-weight: 700;
}
}
.details {
width: 100%;
height: 86px;
display: flex;
flex-direction: column;
justify-content: space-around;
.option {
width: 100%;
// flex: 1;
display: flex;
flex-basis: row;
.name {
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56,63,69,0.60);
width: 80px;
height: 18px;
line-height: 18px;
text-align: right
}
.normal {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #383F45;
height: 18px;
line-height: 18px;
margin-left: 8px;
}
.money {
color: #FCC800;
}
img {
margin-left: 55%
}
}
}
}
}
</style>
<template>
<h-view class="contract-signing">
<h-header :proportion="[5,1,1]" class="bar-custom">
<div slot="left" class="h-header-btn">
<img src="@/assets/userBind/arrow.png" @click="$routeGo()">
<span>合同签约</span>
</div>
</h-header>
<div class="tab-style">
<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>
<div class="hinput">
<div class="search-box">
<input type="text" placeholder="请输入进件号/承租人名称">
<img src="@/assets/constractSigning/search.png" alt="" style="width:18px">
</div>
</div>
<h-content>
<div v-for="(item,index) in contractMsg" :key="index" class="contract-list">
<div class="item">
<img src="@/assets/constractSigning/Incoming.png" alt="" style="height:18px">
<p class="incoming-num">进件号</p>
<p class="code">{{ item.code }}</p>
</div>
<div class="details">
<div class="option">
<p class="name">承租人</p>
<p class="full-name normal">{{ item.name }}</p>
</div>
<div class="option" @click="goDetails(index)">
<p class="name">合同租金</p>
<p class="normal money">{{ item.money | currency }}</p>
<img src="@/assets/distributorSign/goDetails.png" alt="">
</div>
<div class="option">
<p class="name">申请时间</p>
<p class="normal">{{ item.date }}</p>
</div>
</div>
</div>
</h-content>
</h-view>
</template>
<script>
import Check1 from '@/assets/constractSigning/no-done.png'
import Check2 from '@/assets/constractSigning/yes-done.png'
import unCheck1 from '@/assets/constractSigning/no-undone.png'
import unCheck2 from '@/assets/constractSigning/yes-undone.png'
export default {
data () {
return {
num: 1,
check1: Check1,
check2: Check2,
uncheck1: unCheck1,
uncheck2: unCheck2,
contractMsg: [
{name: '张三', money: 90000, date: '2019-03-1', code: '201903022001'},
{name: '李四', money: 90000, date: '2019-03-1', code: '201903022002'},
{name: '王五', money: 90000, date: '2019-03-1', code: '201903022003'},
{name: '赵六', money: 90000, date: '2019-03-1', code: '201903022004'},
{name: '张三', money: 90000, date: '2019-03-1', code: '201903022001'},
{name: '李四', money: 90000, date: '2019-03-1', code: '201903022002'},
{name: '王五', money: 90000, date: '2019-03-1', code: '201903022003'},
{name: '赵六', money: 90000, date: '2019-03-1', code: '201903022004'},
],
}
},
activated () {
},
methods: {
goDetails (index) {
this.$router.push({
name: 'ContractDetail',
})
},
},
}
</script>
<style lang="less" type="text/less">
.contract-signing{
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 4px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
font-size: 17px;
letter-spacing: 0.61px;
line-height: 24px;
}
}
.tab-style{
display:flex;
justify-content: center;
padding-top:12px;
padding-bottom: 8px;
align-items: center;
background-color: #fff;
box-shadow:0 2px 3px 0 rgba(220,220,221,0.50);
div{
position: relative;
height: 32px;
width: 172px;
border-radius:16px;
border-radius: 16px;
font-family: PingFangSC-Semibold;
font-size: 14px;
letter-spacing: 0.43px;
margin: 0 4px;
line-height: 32px;
}
.undone{
background: rgba(220,220,221,0.26);
color: #383F45;
}
.done{
background: rgba(0,70,156,0.10);
color: #00469C;
}
img{
height: 20px;
display: block;
float: left;
margin: 6px 0 0 43px;
}
span{
position: absolute;
left:70px;
}
}
.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 {
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 {
width: 90%;height: 100%;
opacity: 0.4;
border: none
}
}
}
.content{
padding-bottom: 14px;
}
.contract-list {
width: 100%;
height: 120px;
// border: 1px solid #ccc;
background: #fff;
margin-top: 8px;
.item {
width: 100%;
height: 34px;
background: rgba(00, 70, 156, 0.1);
display: flex;
flex-direction: row;
align-items: center;
img {
margin-left: 16.6px;
}
.incoming-num {
font-family: PingFangSC-Semibold;
// width: 42px;
height: 20px;
font-weight: bolder;
line-height: 20px;
font-size: 14px;
color: #00469C;
letter-spacing: 0;
margin-left: 8.8px;
}
.code {
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #00469C;
margin-left: 8px;
font-weight: 700;
}
}
.details {
width: 100%;
height: 86px;
display: flex;
flex-direction: column;
justify-content: space-around;
.option {
width: 100%;
// flex: 1;
display: flex;
flex-basis: row;
.name {
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56,63,69,0.60);
width: 80px;
height: 18px;
line-height: 18px;
text-align: right
}
.normal {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #383F45;
height: 18px;
line-height: 18px;
margin-left: 8px;
}
.money {
color: #FCC800;
}
img {
margin-left: 55%
}
}
}
}
}
</style>
......@@ -12,7 +12,7 @@
<span>合同签约</span>
</div>
</h-header>
<Tab @getTabNum="getTabNum" />
<Tab @getTabNum="getTabNum"/>
<div class="hinput">
<div class="search-box">
<input type="text" placeholder="请输入进件号/承租人名称">
......@@ -44,54 +44,57 @@
</div>
</h-content>
</h-view></template>
</h-view>
</template>
<script>
import Tab from '@/pages/distributorSign/tab'
export default {
name: 'ContractList',
components: {
Tab,
},
data () {
return {
tabNum: 0,
lists: [],
}
},
created () {
let vm = this
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
user_phone: '18507155349',
}
vm.hlsHttp.post(url, param).then(function (res) {
console.log(res.result)
if (res.result === 'S') {
vm.lists = res.lists
import Tab from '@/pages/distributorSign/tab'
export default {
name: 'ContractList',
components: {
Tab,
},
data() {
return {
tabNum: 0,
lists: [],
}
})
},
methods: {
getTabNum (i) {
this.tabNum = i
},
goDetails () {
this.$router.push({
name: 'ContractDetails',
created() {
let vm = this
let url = $config.basePath + 'prj_confirm_list_query'
let param = {
user_phone: '18507155349',
}
vm.hlsHttp.post(url, param).then(function (res) {
console.log(res.result)
if (res.result === 'S') {
vm.lists = res.lists
}
})
},
},
}
methods: {
getTabNum(i) {
this.tabNum = i
},
goDetails() {
this.$router.push({
name: 'ContractDetails',
})
},
},
}
</script>
<style lang="less" scoped>
#sign {
.h-header-btn {
#sign {
.h-header-btn {
img {
width: 16px;
height: 16px;
margin-left: 4px;
}
span {
font-family: PingFangSC-Semibold;
margin-left: 16px;
......@@ -99,115 +102,129 @@ export default {
letter-spacing: 0.61px;
line-height: 24px;
}
}
.hinput {
width: 100%;
height: 68px;
border-bottom:1px solid #cccccc70;
display: flex;
justify-content: center;
align-items: center;
margin-top: 3px;
background: #fff;
margin-bottom: 9px;
.search-box {
}
.hinput {
width: 100%;
height: 68px;
border-bottom: 1px solid #cccccc70;
display: flex;
justify-content: center;
align-items: center;
margin-top: 3px;
background: #fff;
margin-bottom: 9px;
.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: 1px solid rgba(56, 63, 69, 0.60);
border-radius: 4px;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
input {
width: 90%;height: 100%;
opacity: 0.4;
border: none
width: 90%;
height: 100%;
opacity: 0.4;
border: none
}
}
}
}
.content{
padding-bottom: 14px;
}
.contract-list {
width: 100%;
height: 120px;
// border: 1px solid #ccc;
background: #fff;
//margin-bottom: 8px;
.item {
.content {
padding-bottom: 14px;
}
.contract-list {
width: 100%;
height: 120px;
// border: 1px solid #ccc;
background: #fff;
//margin-bottom: 8px;
.item {
width: 100%;
height: 34px;
background: rgba(00, 70, 156, 0.1);
display: flex;
flex-direction: row;
align-items: center;
img {
margin-left: 16.6px;
margin-left: 16.6px;
}
.incoming-num {
font-family: PingFangSC-Semibold;
// width: 42px;
height: 20px;
font-weight: bolder;
line-height: 20px;
font-size: 14px;
color: #00469C;
letter-spacing: 0;
margin-left: 8.8px;
font-family: PingFangSC-Semibold;
// width: 42px;
height: 20px;
font-weight: bolder;
line-height: 20px;
font-size: 14px;
color: #00469C;
letter-spacing: 0;
margin-left: 8.8px;
}
.code {
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #00469C;
margin-left: 8px;
font-weight: bolder
font-family: PingFangSC-Semibold;
font-size: 14px;
color: #00469C;
margin-left: 8px;
font-weight: bolder
}
}
.details {
}
.details {
width: 100%;
height: 86px;
display: flex;
flex-direction: column;
justify-content: space-around;
padding: 6px 0;
.option {
width: 100%;
width: 100%;
height: 18px;
display: flex;
flex-direction: row;
.name {
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56, 63, 69, 0.60);
width: 80px;
height: 18px;
display: flex;
flex-direction: row;
.name {
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56,63,69,0.60);
width: 80px;
height: 18px;
line-height: 18px;
text-align: right
}
.normal {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #383F45;
height: 18px;
line-height: 18px;
margin-left: 8px;
}
.money {
color: #FCC800;
}
img {
margin-left: 55%
}
}
}
line-height: 18px;
text-align: right
}
.normal {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #383F45;
height: 18px;
line-height: 18px;
margin-left: 8px;
}
.money {
color: #FCC800;
}
img {
margin-left: 55%
}
}
}
}
}
}
</style>
......@@ -179,11 +179,11 @@ export default {
-webkit-justify-content: space-between;
margin: 0 0 0 23%;
.register {
color: #5D98F6;
color: #FDFDFD;
font-size: 15px;
}
.pwd-forgotten {
color: #5D98F6;
color: #FDFDFD;
font-size: 15px;
}
}
......
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