dengbw
516 lines
23 KiB
PHP
516 lines
23 KiB
PHP
<div id="vue-edit" class="am-form am-form-horizontal" style="width: 98%;padding-top: 10px">
|
|
<div class="am-u-lg-12">
|
|
<!-- 基本信息 -->
|
|
<div class="am-panel am-panel-default">
|
|
<div class="am-panel-hd">
|
|
<span style="font-size: 20px">基本信息</span>
|
|
<span class="ml10">{{info.sid}}</span>
|
|
<span style="float:right;margin-top:5px">
|
|
</span>
|
|
</div>
|
|
<div class="am-panel-bd am-g" style="margin-top: 10px;margin-bottom: 10px;">
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-4">
|
|
<label class="am-para-label label-width"><span class="span-bold">订单创建时间：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l">{{info.c_time}}</label>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-group am-u-lg-4">
|
|
<label class="am-para-label label-width"><span class="span-bold">合同状态：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l">{{info.sign_status_name}}</label>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-group am-u-lg-4">
|
|
<label class="am-para-label label-width"><span class="span-bold">渠道来源：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l">{{info.cf_title}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 客户信息 -->
|
|
<div class="am-panel am-panel-default">
|
|
<div class="am-panel-hd">
|
|
<span style="font-size: 20px">客户信息</span>
|
|
<span style="float:right;margin-top:5px">
|
|
</span>
|
|
</div>
|
|
<div class="am-panel-bd am-g" style="margin-top: 10px;margin-bottom: 10px;">
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">客户姓名：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l">{{info.name}}</label>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">客户手机号：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l">{{info.mobile}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">身份证号码：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l" v-if="info.cardid">{{info.cardid}}</label>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">地址：</span></label>
|
|
<div class="am-para-input">
|
|
<label class="am-para-label align-l wp80">{{info.address}}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-12">
|
|
<label class="am-para-label label-width"><span class="span-bold">身份证图片：</span></label>
|
|
<div class="am-para-input">
|
|
<button type="button" class="am-btn am-btn-default am-btn-sm fl ml10"
|
|
data-file="1" data-mark="" data-type="jpg,png,gif,png,jpeg"
|
|
data-uptype="qiniu" data-params-source="vue_obj.info.bill.cardidA">
|
|
<i class="am-icon-cloud-upload"></i> 上传身份证正面
|
|
</button>
|
|
<button type="button" class="am-btn am-btn-default am-btn-sm fl ml10"
|
|
data-file="1" data-mark="" data-type="jpg,png,gif,png,jpeg"
|
|
data-uptype="qiniu" data-params-source="vue_obj.info.bill.cardidB">
|
|
<i class="am-icon-cloud-upload"></i> 上传身份证反面
|
|
</button>
|
|
<button type="button" class ="am-btn am-btn-primary am-btn-sm fl ml10"
|
|
v-if="info.bill && (info.bill.cardidA || info.bill.cardidB)" @click="save_cardID">保存身份证</button>
|
|
<div id="layer-photos-demo" class="layer-photos-demo fl ml10">
|
|
<img v-if="info.bill && info.bill.cardidA && info.bill.cardidA.src" :layer-src="info.bill.cardidA.src"
|
|
:src="info.bill.cardidA.src" class="w100" alt="身份证正面" @click="show_carimg"
|
|
style="height:auto;max-height:32px;max-width:50px;">
|
|
<img v-if="info.bill && info.bill.cardidB && info.bill.cardidB.src" :layer-src="info.bill.cardidB.src"
|
|
:src="info.bill.cardidB.src" class="w100" alt="身份证反面" @click="show_carimg"
|
|
style="height:auto;max-height:32px;max-width:50px;margin-left: 5px">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--订单明细-->
|
|
<? require_once "oinfo.php" ?>
|
|
<!-- 合同信息 -->
|
|
<div class="am-panel am-panel-default">
|
|
<div class="am-panel-hd">
|
|
<span style="font-size: 20px">合同信息</span>
|
|
<span style="float:right;margin-top:5px">
|
|
</span>
|
|
</div>
|
|
<div class="am-panel-bd am-g" style="margin-top: 10px;margin-bottom: 10px;">
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">合同信息：</span></label>
|
|
<div class="am-form am-form-inline" v-if="info.contract_data">
|
|
<div class="am-form-group" v-if="info.contract_data[0]">
|
|
<a href="javascript:;" class="am-btn am-btn-default am-btn-sm" @click="show_imgs(info.contract_data[0]['type'])">
|
|
整车销售合同
|
|
</a><br>
|
|
<span class="ml30">{{info.contract_data[0]['status_name']}}</span>
|
|
</div>
|
|
<div class="am-form-group ml10" v-if="info.contract_data[1]">
|
|
<a href="javascript:;" class="am-btn am-btn-default am-btn-sm" @click="show_imgs(info.contract_data[1]['type'])">
|
|
委托服务协议
|
|
</a><br>
|
|
<span class="ml20">{{info.contract_data[1]['status_name']}}</span>
|
|
</div>
|
|
<div class="am-form-group ml10" v-if="info.contract_data[2]">
|
|
<a href="javascript:;" class="am-btn am-btn-default am-btn-sm" @click="show_imgs(info.contract_data[2]['type'])">
|
|
车辆确定
|
|
</a><br>
|
|
<span class="ml20">{{info.contract_data[2]['status_name']}}</span>
|
|
</div>
|
|
<div class="am-form-group ml10" v-if="info.contract_data[3]">
|
|
<a href="javascript:;" class="am-btn am-btn-default am-btn-sm" @click="show_imgs(info.contract_data[3]['type'])">
|
|
车辆交接
|
|
</a><br>
|
|
<span class="ml20">{{info.contract_data[3]['status_name']}}</span>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 发票信息 -->
|
|
<div class="am-panel am-panel-default">
|
|
<div class="am-panel-hd">
|
|
<span style="font-size: 20px">发票信息</span>
|
|
<span style="float:right;margin-top:5px">
|
|
</span>
|
|
</div>
|
|
<div class="am-panel-bd am-g" style="margin-top: 10px;margin-bottom: 10px;">
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group am-u-lg-6">
|
|
<label class="am-para-label label-width"><span class="span-bold">发票：</span></label>
|
|
<div class="am-para-input">
|
|
<div class="am-form-inline">
|
|
<div class="am-form-group">
|
|
<label class="input-group-btn" style="width: 50px;">
|
|
<a href="javascript:;" :data-modal="'/receiver/orders/get_bill?oid='+info.id" data-title="编辑发票信息" class="am-btn am-btn-default am-btn-sm">
|
|
上传文件
|
|
</a>
|
|
</label>
|
|
</div>
|
|
<div class="am-form-group ml10" v-if="info.bill && info.bill.file">
|
|
<img data-tips-image style="height:auto;max-height:32px;max-width:32px;" class="ml5 mt5" :src="info.bill.file"/>
|
|
</div>
|
|
<div class="am-form-group ml10">
|
|
<template v-if="info.status>=3">
|
|
<a class='am-btn am-btn-primary am-btn-xs' v-if="info.status==3" data-ajax="post" data-action="/receiver/orders/edit_jk" :data-params-oid="info.id">
|
|
交款确定
|
|
</a>
|
|
<span class='am-btn am-btn-default am-active am-btn-xs' v-else >已确认开票</span>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!--贷款明细-->
|
|
<? require_once "loaninfo.php" ?>
|
|
<!--代办-->
|
|
<? require_once "agentinfo.php" ?>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
require(['laydate'], function (laydate) {
|
|
//日期范围
|
|
laydate.render({
|
|
elem: '#bx_time'
|
|
, type: 'date'
|
|
});
|
|
});
|
|
var vue_obj;
|
|
$(document).ready(function () {
|
|
vue_obj = new Vue({
|
|
el: '#vue-edit',
|
|
data: {
|
|
info: [],
|
|
carslist: [],
|
|
page: [],
|
|
bx_imgs: [],
|
|
car_imgs:[],
|
|
brand_list: [],
|
|
series_list: [],
|
|
v_list: [],
|
|
cor_list: [],
|
|
incor_list: [],
|
|
brand_id: '',
|
|
s_id: '',
|
|
v_id: '',
|
|
cor_id: '',
|
|
incor_id: '',
|
|
vin:''
|
|
},
|
|
mounted:function() {
|
|
var that = this;
|
|
that.info = <?=json_encode($info, JSON_UNESCAPED_UNICODE)?>;
|
|
that.brand_id = <?=$info['brand_id']?>,
|
|
that.s_id = <?=$info['s_id']?>,
|
|
that.v_id = <?=$info['v_id']?>,
|
|
that.cor_id = <?=$info['cor_id']?>,
|
|
that.incor_id = <?=$info['incor_id']?>,
|
|
that.bx_imgs = <?=json_encode($info['bx_imgs'])?>;
|
|
that.car_imgs = <?=json_encode($info['car_imgs'])?>;
|
|
},
|
|
computed: {},
|
|
created: function () {
|
|
},
|
|
methods: {
|
|
setauto: function (type) {
|
|
var that = this;
|
|
var p_data = {'tp': 1, 'type': type};
|
|
if (type == 2) {
|
|
p_data['pid'] = that.brand_id;
|
|
} else if (type == 3) {
|
|
p_data['pid'] = that.s_id;
|
|
}
|
|
$.get("/common/auto", p_data, function (result) {
|
|
if (type == 1) {
|
|
that.brand_list = result.data
|
|
} else if (type == 2) {
|
|
that.series_list = result.data
|
|
} else if (type == 3) {
|
|
that.v_list = result.data[3]
|
|
that.cor_list = result.data[4]
|
|
that.incor_list = result.data[5]
|
|
}
|
|
})
|
|
},
|
|
carModal: function () {
|
|
var that = this
|
|
if(that.info.loan_info && !that.info.loan_info.status){
|
|
layer.msg('按揭审核尚未通过~', {icon: 2});
|
|
return;
|
|
}
|
|
that.setauto(1);
|
|
that.setauto(2);
|
|
that.setauto(3);
|
|
that.getCars(1);
|
|
layer.open({
|
|
type: 1,
|
|
area: ['50%', '80%'], //宽高
|
|
content: $('#car-modal'),
|
|
title: '选择车辆',
|
|
shade: false,
|
|
btn: ['保存'],
|
|
yes: function (index) {
|
|
$.post("/receiver/orders/edit_item", {
|
|
'id': that.info.id,
|
|
'item_id': that.info.item_id
|
|
}, function (data) {
|
|
if (data.code) {
|
|
layer.msg(data.msg, {time: 2000, icon: 1}, function () {
|
|
$.form.reload();
|
|
});
|
|
} else {
|
|
layer.msg(data.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
}
|
|
});
|
|
},
|
|
getCars: function (page) {
|
|
var vm = this;
|
|
$.ajax({
|
|
url: '/common/items',
|
|
type: 'post',
|
|
dataType: 'json',
|
|
data: {
|
|
page: page,
|
|
select_id: vm.info.item_id,
|
|
brand_id: vm.brand_id,
|
|
s_id: vm.s_id,
|
|
v_id: vm.v_id,
|
|
cor_id: vm.cor_id,
|
|
incor_id: vm.incor_id,
|
|
vin:vm.vin
|
|
},
|
|
success: function (re) {
|
|
var carslist = re.data.list;
|
|
vm.page = re.data.page;
|
|
carslist.map(function (_item, _index) {
|
|
if (vm.info.item_id == _item.id) {
|
|
carslist[_index].selected = 1;
|
|
} else {
|
|
carslist[_index].selected = 0;
|
|
}
|
|
});
|
|
vm.carslist = carslist;
|
|
}
|
|
});
|
|
},
|
|
setCars: function (cars, checked) {
|
|
var vm = this;
|
|
var carslist = vm.carslist;
|
|
carslist.map(function (_item, _index) {
|
|
carslist[_index].selected = 0;
|
|
});
|
|
vm.carslist = carslist;
|
|
if (checked) {
|
|
vm.info.item_id = cars.id;
|
|
cars.selected = 1;
|
|
} else {
|
|
vm.info.item_id = 0;
|
|
}
|
|
},
|
|
beforeUsersPage: function () {
|
|
var vm = this;
|
|
if (vm.page.page == 1) {
|
|
layer.msg('已经是第一页了');
|
|
return;
|
|
}
|
|
vm.page.page--;
|
|
vm.getCars(vm.page.page);
|
|
},
|
|
afterUsersPage: function () {
|
|
var vm = this;
|
|
vm.page.page++;
|
|
vm.getCars(vm.page.page);
|
|
},
|
|
finish_loan: function (status) {
|
|
var that = this;
|
|
$.post("/receiver/orders/edit_loan", {'id': this.info.id, 'status': status}, function (data) {
|
|
console.dir(data);
|
|
layer.msg(data.msg);
|
|
if (data.code) {
|
|
that.info.loan_info.status = status
|
|
}
|
|
}, 'json');
|
|
},
|
|
upTz: function (type, event) {
|
|
var that = this;
|
|
var formData = new FormData();
|
|
formData.append("file", $(event.currentTarget).get(0).files[0]); //上传一个files对象
|
|
formData.append('id', this.info.id);
|
|
formData.append('type', type);
|
|
$.ajax({//jQuery方法，此处可以换成其它请求方式
|
|
url: '/receiver/orders/edit_loan',
|
|
dataType: "json",
|
|
type: "post",
|
|
data: formData,
|
|
processData: false,//不去处理发送的数据
|
|
contentType: false,//不去设置Content-Type请求头
|
|
error: function (res) {
|
|
layer.msg('上传失败')
|
|
return;
|
|
},
|
|
success: function (res) {
|
|
console.dir(res)
|
|
layer.msg(res.msg);
|
|
if (res.code) {
|
|
if (type) {
|
|
that.info.loan_info.lend_file = res.data.file_url;
|
|
} else {
|
|
that.info.loan_info.notify_file = res.data.file_url;
|
|
}
|
|
}
|
|
return;
|
|
}
|
|
|
|
})
|
|
},
|
|
save_agent: function () { //保存代办信息
|
|
var post_data = $('#agent_form').serialize();
|
|
post_data += "&oid=" + this.info.id;
|
|
imgs = '';
|
|
if (this.bx_imgs) {
|
|
jQuery.each(this.bx_imgs, function (i, val) {
|
|
if (imgs) {
|
|
imgs += "," + val['value'];
|
|
} else {
|
|
imgs += val['value'];
|
|
}
|
|
});
|
|
}
|
|
post_data += "&bx_imgs=" + imgs;
|
|
//行驶证
|
|
imgs = '';
|
|
if (this.car_imgs) {
|
|
jQuery.each(this.car_imgs, function (i, val) {
|
|
if (imgs) {
|
|
imgs += "," + val['value'];
|
|
} else {
|
|
imgs += val['value'];
|
|
}
|
|
});
|
|
}
|
|
post_data += "&car_img=" + imgs;
|
|
$.post("/receiver/orders/edit_agent", post_data, function (data) {
|
|
if (data.code) {
|
|
layer.msg(data.msg, {time: 2000, icon: 1}, function () {
|
|
$.form.reload();
|
|
});
|
|
} else {
|
|
layer.msg(data.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
},
|
|
show_imgs: function (type) { //显示图片
|
|
$.getJSON('/receiver/orders/get_cimgs', {'oid': this.info.id, 'type': type}, function (result) {
|
|
console.dir(result.data.info);
|
|
var json = result.data.info;
|
|
layer.photos({
|
|
photos: json
|
|
, anim: 5
|
|
});
|
|
});
|
|
},
|
|
show_carimg: function () {
|
|
layer.photos({
|
|
photos: '#layer-photos-demo'
|
|
, anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
|
|
});
|
|
},
|
|
//保存
|
|
save_cardID:function(){
|
|
var that = this;
|
|
var data_post = {
|
|
o_id:that.info.id,
|
|
cardidA:that.info.bill.cardidA.value,
|
|
cardidB:that.info.bill.cardidB.value
|
|
};
|
|
$.post("/receiver/orders/edit_cardID", data_post, function (data) {
|
|
if (data.code) {
|
|
layer.msg(data.msg, {time: 2000, icon: 1}, function () {
|
|
$.form.reload();
|
|
});
|
|
} else {
|
|
layer.msg(data.msg, {icon: 2});
|
|
}
|
|
}, 'json');
|
|
}
|
|
}
|
|
});
|
|
})
|
|
</script>
|
|
<style type="text/css">
|
|
.span-bold {
|
|
font-weight:bold;
|
|
}
|
|
|
|
.input-group {
|
|
width: 100%;
|
|
padding-right: 30px;
|
|
}
|
|
|
|
.input-group-addon {
|
|
padding: 0px 0px 0px 0px;
|
|
font-size: 1.6rem;
|
|
font-weight: normal;
|
|
line-height: 0px;
|
|
color: #333;
|
|
text-align: right;
|
|
background-color: #fff;
|
|
border: 0px solid #fff;
|
|
border-radius: 0px;
|
|
width: 110px;
|
|
}
|
|
|
|
.table-td {
|
|
width: 20%;
|
|
padding-top: 15px;
|
|
line-height: 37px;
|
|
font-size: 1.6rem;
|
|
}
|
|
|
|
.label-width {
|
|
width: 120px;
|
|
}
|
|
|
|
.input-left {
|
|
margin-left: 150px;
|
|
}
|
|
|
|
.group-width {
|
|
width: 45%;
|
|
height: 56px;
|
|
}
|
|
|
|
.my-ul ul li {
|
|
padding: 10px;
|
|
}
|
|
|
|
.my-panel {
|
|
padding: 10px;
|
|
border: 1px solid #ddd;
|
|
height: 90px;
|
|
}
|
|
|
|
.btn-group .disabled {
|
|
background-color: #eee;
|
|
opacity: 1;
|
|
}
|
|
</style>
|