Commit 49fa47e9 authored by linxin's avatar linxin

增加发车申请静态部分

parent 50588309
<template>
<h-view id="addCar">
<div v-if="downNum" class="modal-show">
<div class="down">
<div class="top">
录入产品信息
<img src="@/assets/intoApproval/close.png" @click="downNum=false" >
</div>
<div class="down-content">
<span>请上传照片</span>
<div class="photo">
<!-- <img src=""> -->
</div>
<list-item :item-height="44">
<item>
<div slot="name">车架号</div>
<input slot="content" placeholder="自动识别车架号" >
</item>
<item>
<div slot="name">发动机号</div>
<input slot="content" placeholder="自动识别发动机号" >
</item>
<item>
<div slot="name">厂商型号</div>
<input slot="content" class="write" placeholder="请输入厂商型号" >
</item>
<item>
<div slot="name">车牌号</div>
<input slot="content" placeholder="请输入车牌号" >
</item>
<item :showArrow="true" @click.native="showModalValue=true">
<div slot="name">产品参数</div>
<input slot="content" placeholder="请选择产品参数" >
</item>
</list-item></div>
<button @click="confirm">保存</button>
</div>
</div>
<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>
<h-content>
<div class="userInfo">承租人信息</div>
<list-item :item-height="44">
<item :showArrow="true">
<div slot="name">合同号</div>
<input slot="content" placeholder="请选择合同号" >
</item>
<item :showArrow="true">
<div slot="name">经销商</div>
<input slot="content" placeholder="请选择经销商" >
</item>
<item>
<div slot="name">承租人</div>
<input slot="content" placeholder="请输入承租人姓名" >
</item>
<item :showArrow="true">
<div slot="name">产品线</div>
<input slot="content" placeholder="请选择产品线" >
</item>
<item>
<div slot="name">合同金额</div>
<input slot="content" placeholder="请输入合同金额" >
</item>
<item :showArrow="true">
<div slot="name">商务政策</div>
<input slot="content" placeholder="请选择合同政策" >
</item>
<item>
<div slot="name">租赁物数量</div>
<input slot="content" v-model="num" placeholder="请输入租赁物数量" >
</item>
</list-item>
<div class="userInfo">设备清单</div>
<div v-for="(item,index) in numInt" :key="index" class="equipment">
<div class="left">
<span>
<img src="@/assets/contractStart/list.png" >
</span>
</div>
<div class="center">
<span>租赁物信息</span>
<span class="status">已维护</span>
<p>
参数项
<span>GTZ226</span>
</p>
</div>
<div class="right" @click="downNum=true">
<img src="@/assets/contractStart/into.png" >
</div>
</div>
</h-content>
<bottom-tab>
<tab-button class="approve" @click.native="goAdd">发车申请</tab-button>
</bottom-tab>
<h-modal ref="modal" v-model="showModalValue" position="bottom" cus-class="sign-modal">
<h-view>
<h-header style="height: 43px !important;padding-top:0px">
<div slot="left" class="h-header-btn">确定</div>
<div slot="right" class="h-header-btn">清除</div>
</h-header>
<h-content style="top:44px !important;">
<div id="draw" class="draw"/>
</h-content>
</h-view>
</h-modal>
</h-view>
</template>
<script>
export default {
data () {
return {
num: null,
downNum: false,
showModalValue: false,
}
},
computed: {
numInt () {
if (this.num !== null && this.num !== '') {
return parseInt(this.num)
} else {
return 0
}
},
},
}
</script>
<style lang="less" scoped>
#addCar {
input::placeholder {
color: #888c8f;
}
.modal-show {
width: 100%;
height: 100%;
position: absolute;
z-index: 999;
background-color: rgba(56, 63, 69, 0.3);
display: flex;
justify-content: center;
align-items: center;
.down {
position: relative;
width: 314px;
height: 516px;
background-size: 301px 24.7px;
background-color: #fff;
}
.top {
width: 100%;
height: 44px;
font-family: PingFangSC-Semibold;
font-size: 16px;
letter-spacing: 0;
text-align: center;
line-height: 44px;
color: #fff;
background: #0041c4;
img {
width: 16px;
height: 16px;
float: right;
margin-top: 13px;
margin-right: 20px;
}
}
.down-content {
margin-top: 8px;
span:first-child {
font-family: PingFangSC-Regular;
font-size: 13px;
color: #656464;
letter-spacing: 0;
margin-left: 15px;
}
.photo {
width: 172px;
height: 120px;
border: 1px solid #dcdcdd;
border-radius: 2px;
margin: 0 auto;
margin-top: 12px;
background:url('../../assets/contractStart/photo.png') 70px no-repeat;
background-size:24px 20px;
img{
width:100%;
height:100%;
}
}
}
button {
width: 240px;
height: 40px;
position: absolute;
color: #fff;
bottom: 16px;
left: 30.5px;
background-color: #0041c4;
border-radius: 4px;
}
}
.userInfo {
height: 45px;
line-height: 45px;
color: #0041c4;
font-size: 15px;
margin-left: 16px;
position: relative;
}
.userInfo::before {
content: "";
display: block;
width: 4px;
height: 20px;
background-color: #0041c4;
position: absolute;
left: -15px;
top: 12px;
}
.equipment:not(:first-child) {
margin-top: 2px;
}
.equipment {
width: 359px;
height: 72px;
background-color: #fff;
margin: 0 auto;
display: flex;
.left {
flex: 1;
span {
display: block;
width: 30px;
height: 30px;
background-color: #e8e9ed;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 10px;
margin-top: 8px;
img {
width: 11px;
height: 14px;
}
}
}
.center {
flex: 6;
span:first-child {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #383f45;
letter-spacing: 0.43px;
margin-left: 10px;
margin-top: 12px;
}
.status {
display: inline-block;
width: 46px;
height: 16px;
text-align: center;
line-height: 16px;
font-family: PingFangSC-Medium;
font-size: 12px;
color: #ffffff;
letter-spacing: 0;
background-color: #1d3fff;
margin-left: 21px;
margin-top: 12px;
}
p {
font-family: PingFangSC-Regular;
font-size: 13px;
color: rgba(56, 63, 69, 0.6);
letter-spacing: 0.4px;
margin-left: 10px;
margin-top: 10px;
span {
font-family: Helvetica;
font-size: 13px;
color: rgba(56, 63, 69, 0.6);
}
}
}
.right {
flex: 1;
display: flex;
align-items: center;
img {
width: 13px;
height: 13px;
}
}
}
.approve {
color: #fff;
background-color: #0041c4;
}
}
</style>
<template>
<h-view id="startList">
<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>
<Tab @getTabNum="getTabNum" />
<div class="search">
<input placeholder="请输入合同号/产品线/承租人名称" >
</div>
<h-content class="my-content">
<div class="item">
<div class="left">
<span>
<img src="@/assets/contractStart/icon.png" >
</span>
</div>
<div class="right">
<div class="right-top">
<span>合同号</span>
<span>CON201903022001</span>
</div>
<div class="right-bottom">
<ul>
<li>
承租人
<span>张三</span>
</li>
<li>
产品线
<span>起重机</span>
</li>
<li>
合同金额
<span class="number">{{ 900000|currency }}</span>
</li>
</ul>
</div>
</div>
</div>
<div class="item">
<div class="left">
<span>
<img src="@/assets/contractStart/icon.png" >
</span>
</div>
<div class="right">
<div class="right-top">
<span>合同号</span>
<span>CON201903022001</span>
</div>
<div class="right-bottom">
<ul>
<li>
承租人
<span>张三</span>
</li>
<li>
产品线
<span>起重机</span>
</li>
<li>
合同金额
<span class="number">{{ 900000|currency }}</span>
</li>
</ul>
</div>
</div>
</div>
</h-content>
<bottom-tab>
<tab-button class="add" @click.native="goAdd">
新增发车
</tab-button>
</bottom-tab>
</h-view>
</template>
<script>
import Tab from '@/pages/contractStart/tab'
export default {
components: {
Tab,
},
methods: {
getTabNum (i) {
},
goAdd () {
this.$router.push({
name: 'AddCar',
})
},
},
}
</script>
<style lang="less" scoped>
#startList {
.search {
height: 52px;
background-color: #fff;
display: flex;
align-items: center;
justify-content: center;
input {
width: 351px;
height: 36px;
line-height: 36px;
text-indent: 16px;
font-family: PingFangSC-Regular;
font-size: 14px;
color: #21254c;
letter-spacing: 0;
border-radius: 4px;
background: url("../../assets/contractStart/search1.png") 320px no-repeat;
background-size: 16px 16px;
background-color: rgba(239, 239, 239, 0.55);
}
input::placeholder {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #888c8f;
letter-spacing: 0;
}
input:focus {
background: url("../../assets/contractStart/search2.png") 320px no-repeat;
background-size: 16px 16px;
background-color: rgba(239, 239, 239, 0.55);
border: 2px solid #bcc6ff;
}
}
.my-content {
.item {
width: 359px;
height: 148px;
background-color: #fff;
border-radius: 2px;
margin: 0 auto;
margin-top: 9px;
.left {
width: 15%;
height: 100%;
float: left;
span {
display: block;
width: 30px;
height: 30px;
background-color: #e8e9ed;
border-radius: 8px;
display: flex;
align-items: center;
justify-content: center;
margin-left: 10px;
margin-top: 8px;
img {
width: 11px;
height: 14px;
}
}
}
.right {
height: 100%;
width: 85%;
float: right;
.right-top {
width: 285px;
height: 45px;
font-family: PingFangSC-Semibold;
font-size: 15px;
color: #4b4a4b;
letter-spacing: 0;
line-height: 45px;
border-bottom: 1px solid #f3f3f7;
span:last-child {
float: right;
}
}
.right-bottom {
width: 285px;
margin-top: 10px;
.number {
font-family: Verdana-Bold;
font-size: 14px;
color: #4b4a4b;
letter-spacing: 0;
font-weight:bold;
}
li {
font-family: PingFangSC-Regular;
font-size: 14px;
color: #4b4a4b;
letter-spacing: 0;
height: 30px;
width: 100%;
span {
float: right;
}
}
}
}
}
}
.add{
color:#fff;
background-color:#0041C4;
}
}
</style>
<!--
* @Description: In User Settings Edit
* @Author: your name
* @Date: 2019-09-25 11:10:34
* @LastEditTime: 2019-09-25 21:05:24
* @LastEditors: Please set LastEditors
-->
<template>
<div class="tab-style">
<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>
<div :class="{'tab-content-bg':tabNum == 1}" class="tab-content" @click="tabNum = 1;sendTabNum()"><img :src="tabNum == 1?finished:finish"><span
:class="{'colored':tabNum == 1}">已发车</span></div>
</div>
</template>
<script>
import signed from '@/assets/contractStart/2.png'
import finished from '@/assets/contractStart/4.png'
import sign from '@/assets/contractStart/1.png'
import finish from '@/assets/contractStart/3.png'
export default {
data () {
return {
tabNum: 0,
signed: signed,
finished: finished,
sign: sign,
finish: finish,
}
},
methods: {
sendTabNum () {
this.$emit('getTabNum', this.tabNum)
},
},
}
</script>
<style lang="less" scoped>
.tab-style {
position: relative;
z-index: 50;
background-color: #fff;
display: flex;
justify-content: center;
padding-top: 12px;
padding-bottom: 8px;
align-items: center;
box-shadow: 0 2px 3px 0 rgba(220, 220, 221, 0.50);
.tab-content {
display: block;
width: 45.9%;
height: 32px;
background: rgba(220, 220, 221, 0.26);
border-radius: 16px;
display: flex;
justify-content: center;
align-items: center;
span {
margin-left: 2%;
font-size: 14px;
color: #383F45;
font-weight: 600;
font-family: PingFangSC-Semibold;
}
.colored {
color: #1D3FFF
}
}
.tab-content-bg{
background: rgba(0,70,156,0.10);
}
.tab-content:nth-of-type(1) {
margin-left: 12px
}
img {
width:16px;
height: 16px;
// margin-right:5.7px;
}
.tab-content:nth-of-type(2) {
margin-left: 7px;
}
}
</style>
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
<span>{{ user_phone }}</span> <span>{{ user_phone }}</span>
</div> </div>
<div class="card-bottom"> <div class="card-bottom">
<div> <div @click="goStart">
<img src="@/assets/myInfo/car.png" > <img src="@/assets/myInfo/car.png" >
<p>发车申请</p> <p>发车申请</p>
</div> </div>
...@@ -171,6 +171,12 @@ export default { ...@@ -171,6 +171,12 @@ export default {
name: 'MyProductList', name: 'MyProductList',
}) })
}, },
// 进入发车申请
goStart () {
this.$router.push({
name: 'StartList',
})
},
changeHelp () { changeHelp () {
this.$router.push({ this.$router.push({
name: 'HelpList', name: 'HelpList',
...@@ -349,7 +355,7 @@ export default { ...@@ -349,7 +355,7 @@ export default {
} }
vm.$post(url, param).then(function (res) { vm.$post(url, param).then(function (res) {
if (res.result === 'S') { if (res.result === 'S') {
if('info' in res){ if ('info' in res) {
vm.signCount = res.info.con_sign_num vm.signCount = res.info.con_sign_num
vm.confirmCount = res.info.con_confirm_num vm.confirmCount = res.info.con_confirm_num
vm.productCount = res.info.collect_num vm.productCount = res.info.collect_num
......
...@@ -22,9 +22,9 @@ ...@@ -22,9 +22,9 @@
</div> </div>
</div> </div>
<div class="pay-money"> <div class="pay-money">
<div class="pay-icon"><img src="@/assets/payment/first-pay.png" alt="">违约金支付</div> <div class="pay-icon"><img src="@/assets/payment/first-pay.png" alt="">逾期利息</div>
<div class="pay-input"> <div class="pay-input">
<span>应还违约金</span> <span>应还利息</span>
<input v-model="liquidated_damages" readonly type="text" placeholder="请输入支付金额"> <input v-model="liquidated_damages" readonly type="text" placeholder="请输入支付金额">
</div> </div>
</div> </div>
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
<div slot="content" class="money-font">{{ list.orderamount | currency }}</div> <div slot="content" class="money-font">{{ list.orderamount | currency }}</div>
</item> </item>
<item> <item>
<div slot="left-icon" class="left-icon"></div> <div slot="left-icon" class="left-icon"/>
<div slot="name" class="time-font">还款时间</div> <div slot="name" class="time-font">还款时间</div>
<div slot="content" class="time-font">{{ list.order_date }}</div> <div slot="content" class="time-font">{{ list.order_date }}</div>
</item> </item>
......
...@@ -953,8 +953,7 @@ export default { ...@@ -953,8 +953,7 @@ export default {
if ( if (
this.bank.bank_account_num === '' || this.bank.bank_account_num === '' ||
this.bank.bank_account_name === '' || this.bank.bank_account_name === '' ||
this.bank.bank_full_name === '' || this.bank.bank_full_name === ''
this.bank.bank_branch_name === ''
) { ) {
this.hlsPopup.showLongCenter('请输入完整字段') this.hlsPopup.showLongCenter('请输入完整字段')
} else if (this.hlsUtil.isBankAccount(this.bank.bank_account_num)) { } else if (this.hlsUtil.isBankAccount(this.bank.bank_account_num)) {
......
...@@ -79,6 +79,10 @@ import ContractRepayment from '@/pages/contractRepayment/contract-repayment' ...@@ -79,6 +79,10 @@ import ContractRepayment from '@/pages/contractRepayment/contract-repayment'
import RepayDetails from '@/pages/contractRepayment/repay-details' import RepayDetails from '@/pages/contractRepayment/repay-details'
import RepayPlan from '@/pages/contractRepayment/repay-plan' import RepayPlan from '@/pages/contractRepayment/repay-plan'
// 发车申请
import StartList from '@/pages/contractStart/startList'
import AddCar from '@/pages/contractStart/addCar'
Vue.use(Router) Vue.use(Router)
export default new Router({ export default new Router({
...@@ -202,6 +206,9 @@ export default new Router({ ...@@ -202,6 +206,9 @@ export default new Router({
{path: '/contract-repayment', component: ContractRepayment, name: 'ContractRepayment', meta: {keepAlive: true}}, {path: '/contract-repayment', component: ContractRepayment, name: 'ContractRepayment', meta: {keepAlive: true}},
{path: '/repay-details', component: RepayDetails, name: 'RepayDetails', meta: {keepAlive: true}}, {path: '/repay-details', component: RepayDetails, name: 'RepayDetails', meta: {keepAlive: true}},
{path: '/repay-plan', component: RepayPlan, name: 'RepayPlan', meta: {keepAlive: true}}, {path: '/repay-plan', component: RepayPlan, name: 'RepayPlan', meta: {keepAlive: true}},
// 发车申请
{path: '/start-List', component: StartList, name: 'StartList', meta: {keepAlive: true}},
{path: '/add-car', component: AddCar, name: 'AddCar', meta: {keepAlive: true}},
], ],
scrollBehavior (to, from, savedPosition) { scrollBehavior (to, from, savedPosition) {
......
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