Commit 0e462b3f authored by 王建威's avatar 王建威

采购分期

parent 07c254ef
......@@ -33,6 +33,7 @@
top: 0;
width: 100%;
background-color: #fff;
z-index: 100;
.left_icon {
position: absolute;
left: 20rpx;
......
import Vue from 'vue'
import App from './App'
import store from './store/store.js';
import { php, gp } from './common/host.js';
import store from '@/store/store.js';
import { php, gp } from '@/common/host.js';
import { getNavigationBarTitle } from './common/util.js';
// 微信分享公共接口
......
......@@ -62,7 +62,7 @@
"disableHostCheck": true,
"proxy": {
"/uni/api": {
"target": "http://39.96.85.45:9093/",
"target": "http://10.0.0.116:6564/",
"changeOrigin": true,
"secure": false,
"pathRewrite": {
......
......@@ -14,52 +14,79 @@
<view class="apply_desc">请上传所在街道与企业门头清晰照片,以便顺利帮您认证</view>
</view>
<view class="apply_data_item">
<view class="apply_upload" @click="uploadImage()">
<view v-if="!params.business_street" class="apply_upload" @click="uploadImage('business_street')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">所在街道照片</text>
</view>
<view class="apply_upload">
<view v-if="params.business_street" class="apply_upload">
<text class="close_icon" @click="clearParams('business_street')"></text>
<image class="preview_img" :src="params.business_street"></image>
</view>
<view v-if="!params.business_premises" class="apply_upload" @click="uploadImage('business_premises')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">企业门头照片</text>
</view>
<view v-if="params.business_premises" class="apply_upload">
<text class="close_icon" @click="clearParams('business_premises')"></text>
<image class="preview_img" :src="params.business_premises"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">动物诊疗证/兽医证照片</view>
<view class="apply_desc">请上传动物诊疗证与兽医证照片清晰照片,以便顺利帮您认证</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.animal_certificate" class="apply_upload" @click="uploadImage('animal_certificate')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">动物诊疗证(含公章) 照片</text>
</view>
<view class="apply_upload">
<view v-if="params.animal_certificate" class="apply_upload">
<text class="close_icon" @click="clearParams('animal_certificate')"></text>
<image class="preview_img" :src="params.animal_certificate"></image>
</view>
<view v-if="!params.vet_certificate" class="apply_upload" @click="uploadImage('vet_certificate')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">兽医证(含公章) 照片</text>
</view>
<view v-if="params.vet_certificate" class="apply_upload">
<text class="close_icon" @click="clearParams('vet_certificate')"></text>
<image class="preview_img" :src="params.vet_certificate"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">营业执照/经营场所证明照片</view>
<view class="apply_desc">请上传营业执照与经营场所清晰照片,以便顺利帮您认证</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.business_license" class="apply_upload" @click="uploadImage('business_license')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">营业执照(含公章) 照片</text>
</view>
<view class="apply_upload">
<view v-if="params.business_license" class="apply_upload">
<text class="close_icon" @click="clearParams('business_license')"></text>
<image class="preview_img" :src="params.business_license"></image>
</view>
<view v-if="!params.certification_materials" class="apply_upload" @click="uploadImage('certification_materials')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">经营场所证明材料照片</text>
</view>
<view v-if="params.certification_materials" class="apply_upload">
<text class="close_icon" @click="clearParams('certification_materials')"></text>
<image class="preview_img" :src="params.certification_materials"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">企业半年银行流水(需含户名)</view>
<view class="apply_desc">支持(zip/rar)格式</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view class="apply_data_item" @click="uploadZip('bank_card_record')">
<view class="apply_upload" v-if="!params.bank_card_record">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">企业半年银行流水</text>
</view>
<view class="apply_upload" style="line-height: 200rpx;" v-if="params.bank_card_record">
<text class="upload_font">{{compressName}}</text>
</view>
</view>
</view>
<text class="next_step_btn">下一步</text>
......@@ -71,15 +98,142 @@
export default {
data() {
return {
params: {
business_street: '', //所在街道
business_premises: '', //企业门头
animal_certificate: '' ,//动物诊疗证
vet_certificate: '', //兽医证
business_license: '', //营业执照
certification_materials: '', //经营场所
bank_card_record: '', //企业银行流水
},
compressName: ''
}
},
onLoad() {
uni.request({
url: '/uni/app/userqualification/GetUserQualification',
method: 'GET',
success: (res) => {
console.log(res)
}
})
},
methods: {
uploadImage() {
uploadImage(key) {
uni.chooseImage({
success: (res) => {
console.log(res)
const tempFilePaths = res.tempFilePaths;
uni.uploadFile({
url: '/uni/api/resources',
filePath: tempFilePaths[0],
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
}
});
}
})
},
uploadZip(key) {
// #ifdef H5
const _input = document.createElement('input');
_input.type = 'file';
_input.accept = 'application/x-zip-compressed,application/x-rar-compressed';
_input.click();
_input.onchange = (e) => {
let file = e.target.files[0];
let fileName = file.name;
let pos = fileName.lastIndexOf(".");
let lastName = fileName.substring(pos, fileName.length);
if ((lastName.toLowerCase() != ".zip" ) && (lastName.toLowerCase() != ".rar")) {
uni.showToast({
title: "文件必须为.zip或.rar类型",
icon: 'none',
duration: 2000
})
return;
}
let url = null;
if (window.createObjectURL != undefined) {
// basic
url = window.createObjectURL(file);
} else if (window.webkitURL != undefined) {
// webkit or chrome
url = window.webkitURL.createObjectURL(file);
} else if (window.URL != undefined) {
// mozilla(firefox)
url = window.URL.createObjectURL(file);
}
uni.uploadFile({
url: '/uni/api/resources',
filePath: url,
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
this.compressName = fileName;
}
});
}
// #endif
},
clearParams(key) {
this.params[key] = '';
},
submit() {
if(!this.params.business_street) {
uni.showToast({
title: '请上传所在街道照片',
icon: 'none'
});
return
}
if(!this.params.business_premises) {
uni.showToast({
title: '请上传企业门头照片',
icon: 'none'
});
return
}
if(!this.params.animal_certificate) {
uni.showToast({
title: '请上传动物诊疗证照片',
icon: 'none'
});
return
}
if(!this.params.vet_certificate) {
uni.showToast({
title: '请上传兽医证照片',
icon: 'none'
});
return
}
if(!this.params.business_license) {
uni.showToast({
title: '请上传营业执照照片',
icon: 'none'
});
return
}
if(!this.params.business_premises) {
uni.showToast({
title: '请上传经营场所材料照片',
icon: 'none'
});
return
}
if(!this.params.bank_card_record) {
uni.showToast({
title: '请上传企业银行流水',
icon: 'none'
});
return
}
uni.request({
url: ''
})
}
},
......@@ -139,6 +293,7 @@
height: 200rpx;
background: rgba(248,248,248,1);
border-radius: 16rpx;
position: relative;
.icons {
width: 36rpx;
height: 36rpx;
......@@ -152,6 +307,20 @@
display: block;
text-align: center;
}
.preview_img {
width: 100%;
height: 100%;
}
.close_icon {
width: 28rpx;
height: 28rpx;
position: absolute;
top: -14rpx;
right: -14rpx;
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAYFBMVEUhISFVSRlWSRlpWBZxXxWfgw6jhg30xAH38Ob38ef38ej49O369vH69vL7+PT8+/n+/v3+/v7/zQD/zQL/1Cb/2T7/4GT/43H/43L/54f/88P/9Mj/+eX//ff//v7///+7HAjXAAAA3ElEQVQoz4XSWRKDIAwAUKFW4tIqQS2uvf8tK4iAojZ/5DFMEhJ9byLyD9M4TufYy1ogilr2AQ4N2miGHc6dQC9ENzucWzxEO1vsMIhuw0GEKAaDupYkZmuaxYmuasVe5+KIaGUkinWi1yjRJJUyai6h1FijU2dYK5y2cpQSayimBUdb4aLOEMc/yP1n6eFZ7hVEGSO7gkrXCmW2I9NKYYdAtyE87BAyHozvaccH75vBQ1pdfxlAzi8/GwBel2sCSvnFgimEvHKr+fFWUyOkb3621GAiK0q+XOA+/gCtlj2I+YoKDQAAAABJRU5ErkJggg==') no-repeat;
background-size: 100% 100%;
z-index: 10;
}
}
}
}
......@@ -161,7 +330,6 @@
line-height: 80rpx;
text-align: center;
background: #FFCD00;
opacity: 0.2;
margin: 63rpx auto 42rpx;
display: block;
border-radius: 16rpx;
......
<template>
<view class="page2_content">
<TopBar title="金融分期"/>
<view class="apply_data_content">
<view :style="{'margin-top':'40rpx'}">
<view class="apply_title">法人信息</view>
......@@ -10,37 +11,56 @@
<view class="apply_desc">请上传法人手持身份证清晰照片,以便顺利帮您认证</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.card_positive" class="apply_upload" @click="uploadImage('card_positive')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">手持身份证 (人像面)</text>
</view>
<view class="apply_upload">
<view v-if="params.card_positive" class="apply_upload">
<text class="close_icon" @click="clearParams('card_positive')"></text>
<image class="preview_img" :src="params.card_positive"></image>
</view>
<view v-if="!params.card_reverse" class="apply_upload" @click="uploadImage('card_reverse')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">手持身份证 (国徽面)</text>
</view>
<view v-if="params.card_reverse" class="apply_upload">
<text class="close_icon" @click="clearParams('card_reverse')"></text>
<image class="preview_img" :src="params.card_reverse"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">补充照片</view>
<view class="apply_desc">请上传企业法人相关证明清晰照片,以便顺利帮您认证</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.legal_business_img" class="apply_upload" @click="uploadImage('legal_business_img')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">法人在企业内照片</text>
</view>
<view class="apply_upload">
<view v-if="params.legal_business_img" class="apply_upload">
<text class="close_icon" @click="clearParams('legal_business_img')"></text>
<image class="preview_img" :src="params.legal_business_img"></image>
</view>
<view v-if="!params.bank_credit_report" class="apply_upload" @click="uploadImage('bank_credit_report')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">法人银行征信报告</text>
</view>
<view v-if="params.bank_credit_report" class="apply_upload">
<text class="close_icon" @click="clearParams('bank_credit_report')"></text>
<image class="preview_img" :src="params.bank_credit_report"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">法人半年银行流水(需含户名)</view>
<view class="apply_desc">支持(zip/rar)格式</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view class="apply_upload" @click="uploadZip()">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">企业半年银行流水</text>
<text class="upload_font">法人半年银行流水</text>
</view>
<view class="apply_upload" style="line-height: 200rpx;">
<text class="upload_font">{{compressName}}</text>
</view>
</view>
<view class="apply_btn_box">
......@@ -52,11 +72,123 @@
</template>
<script>
import TopBar from '@/components/TopBar/TopBar.vue';
export default {
data() {
return {
params: {
card_positive: '', //身份证正面
card_reverse: '', //身份证反面
legal_business_img: '', //在企业内照片
bank_credit_report: '', //征信报告
legal_card_record: '' //个人流水
},
compressName: ''
}
},
methods: {
uploadImage(key) {
uni.chooseImage({
success: (res) => {
const tempFilePaths = res.tempFilePaths
uni.uploadFile({
url: '/uni/api/resources',
filePath: tempFilePaths[0],
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
}
});
}
})
},
uploadZip() {
// #ifdef H5
const _input = document.createElement('input');
_input.type = 'file';
_input.accept = 'application/x-zip-compressed,application/x-rar-compressed';
_input.click();
_input.onchange = (e) => {
let file = e.target.files[0];
let fileName = file.name;
let pos = fileName.lastIndexOf(".");
let lastName = fileName.substring(pos, fileName.length);
if ((lastName.toLowerCase() != ".zip" ) && (lastName.toLowerCase() != ".rar")) {
uni.showToast({
title: "文件必须为.zip或.rar类型",
icon: 'none',
duration: 2000
})
return;
}
let url = null;
if (window.createObjectURL != undefined) {
// basic
url = window.createObjectURL(file);
} else if (window.webkitURL != undefined) {
// webkit or chrome
url = window.webkitURL.createObjectURL(file);
} else if (window.URL != undefined) {
// mozilla(firefox)
url = window.URL.createObjectURL(file);
}
uni.uploadFile({
url: '/uni/api/resources',
filePath: url,
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
this.compressName = fileName;
}
});
}
// #endif
},
clearParams(key) {
this.params[key] = '';
},
submit() {
if(!this.params.card_positive) {
uni.showToast({
title: '请上传法人手持身份证正面',
icon: 'none'
});
return
}
if(!this.params.card_reverse) {
uni.showToast({
title: '请上传法人手持身份证反面',
icon: 'none'
});
return
}
if(!this.params.legal_business_img) {
uni.showToast({
title: '请上传法人在企业内照片',
icon: 'none'
});
return
}
if(!this.params.bank_credit_report) {
uni.showToast({
title: '请上传法人银行征信报告',
icon: 'none'
});
return
}
if(!this.params.legal_card_record) {
uni.showToast({
title: '请上传法人银行流水',
icon: 'none'
});
return
}
}
},
components: {
TopBar
}
}
</script>
......@@ -64,6 +196,7 @@
<style lang="less" scoped>
.page2_content {
background: #fff;
padding-top: 80rpx;
.apply_title {
font-size:32rpx;
font-family:PingFangSC-Medium,PingFang SC;
......@@ -91,6 +224,7 @@
height: 200rpx;
background: rgba(248,248,248,1);
border-radius: 16rpx;
position: relative;
.icons {
width: 36rpx;
height: 36rpx;
......@@ -104,6 +238,20 @@
display: block;
text-align: center;
}
.preview_img {
width: 100%;
height: 100%;
}
.close_icon {
width: 28rpx;
height: 28rpx;
position: absolute;
top: -14rpx;
right: -14rpx;
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAYFBMVEUhISFVSRlWSRlpWBZxXxWfgw6jhg30xAH38Ob38ef38ej49O369vH69vL7+PT8+/n+/v3+/v7/zQD/zQL/1Cb/2T7/4GT/43H/43L/54f/88P/9Mj/+eX//ff//v7///+7HAjXAAAA3ElEQVQoz4XSWRKDIAwAUKFW4tIqQS2uvf8tK4iAojZ/5DFMEhJ9byLyD9M4TufYy1ogilr2AQ4N2miGHc6dQC9ENzucWzxEO1vsMIhuw0GEKAaDupYkZmuaxYmuasVe5+KIaGUkinWi1yjRJJUyai6h1FijU2dYK5y2cpQSayimBUdb4aLOEMc/yP1n6eFZ7hVEGSO7gkrXCmW2I9NKYYdAtyE87BAyHozvaccH75vBQ1pdfxlAzi8/GwBel2sCSvnFgimEvHKr+fFWUyOkb3621GAiK0q+XOA+/gCtlj2I+YoKDQAAAABJRU5ErkJggg==') no-repeat;
background-size: 100% 100%;
z-index: 10;
}
}
}
.apply_btn_box {
......
<template>
<view class="page3_content">
<TopBar title="金融分期"/>
<view class="page3_tips">其他补充信息(选填)</view>
<view class="apply_data_content">
<view :style="{'margin-top':'40rpx'}">
......@@ -7,31 +8,51 @@
<view class="apply_desc">上传更多的资产证明可以更快认证您的资质</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.house_property" class="apply_upload" @click="uploadImage('house_property')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">房产证明照片</text>
</view>
<view class="apply_upload">
<view v-if="params.house_property" class="apply_upload">
<text class="close_icon" @click="clearParams('house_property')"></text>
<image class="preview_img" :src="params.house_property"></image>
</view>
<view v-if="!params.deposit_certificate" class="apply_upload" @click="uploadImage('deposit_certificate')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">存款或理财照片/截图</text>
</view>
<view class="apply_upload">
<view v-if="params.deposit_certificate" class="apply_upload">
<text class="close_icon" @click="clearParams('deposit_certificate')"></text>
<image class="preview_img" :src="params.deposit_certificate"></image>
</view>
<view v-if="!params.user_sesame_level" class="apply_upload" @click="uploadImage('user_sesame_level')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">法人芝麻信用照片/截图</text>
</view>
<view class="apply_upload">
<view v-if="params.user_sesame_level" class="apply_upload">
<text class="close_icon" @click="clearParams('user_sesame_level')"></text>
<image class="preview_img" :src="params.user_sesame_level"></image>
</view>
<view v-if="!params.business_sesame_level" class="apply_upload" @click="uploadImage('business_sesame_level')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">企业芝麻信用照片/截图</text>
</view>
<view v-if="params.business_sesame_level" class="apply_upload">
<text class="close_icon" @click="clearParams('business_sesame_level')"></text>
<image class="preview_img" :src="params.business_sesame_level"></image>
</view>
</view>
<view :style="{'margin-top':'60rpx'}">
<view class="apply_title">其他补充证明</view>
</view>
<view class="apply_data_item">
<view class="apply_upload">
<view v-if="!params.vehicle_license" class="apply_upload" @click="uploadImage('vehicle_license')">
<text class="eosfont icons">&#xe60d;</text>
<text class="upload_font">机动车驾驶证照片</text>
</view>
<view v-if="params.vehicle_license" class="apply_upload">
<text class="close_icon" @click="clearParams('vehicle_license')"></text>
<image class="preview_img" :src="params.vehicle_license"></image>
</view>
</view>
<view class="apply_btn_box">
<view class="apply_btn">上一步</view>
......@@ -42,11 +63,42 @@
</template>
<script>
import TopBar from '@/components/TopBar/TopBar.vue';
export default {
data() {
return {
params: {
house_property: '', //房产证
deposit_certificate: '', //存款理财
user_sesame_level: '', //法人芝麻信用
business_sesame_level: '', //企业芝麻信用
vehicle_license: '', //机动车
}
}
},
methods: {
uploadImage(key) {
uni.chooseImage({
success: (res) => {
const tempFilePaths = res.tempFilePaths
uni.uploadFile({
url: '/uni/api/resources',
filePath: tempFilePaths[0],
name: 'file',
success: (uploadFileRes) => {
const data = JSON.parse(uploadFileRes.data)
this.params[key] = data.data;
}
});
}
})
},
clearParams(key) {
this.params[key] = '';
}
},
components: {
TopBar
}
}
</script>
......@@ -54,6 +106,7 @@
<style lang="less" scoped>
.page3_content {
background: #fff;
padding-top: 80rpx;
.apply_data_content {
background: #fff;
padding: 0 36rpx;
......@@ -82,6 +135,20 @@
display: block;
text-align: center;
}
.preview_img {
width: 100%;
height: 100%;
}
.close_icon {
width: 28rpx;
height: 28rpx;
position: absolute;
top: -14rpx;
right: -14rpx;
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAYFBMVEUhISFVSRlWSRlpWBZxXxWfgw6jhg30xAH38Ob38ef38ej49O369vH69vL7+PT8+/n+/v3+/v7/zQD/zQL/1Cb/2T7/4GT/43H/43L/54f/88P/9Mj/+eX//ff//v7///+7HAjXAAAA3ElEQVQoz4XSWRKDIAwAUKFW4tIqQS2uvf8tK4iAojZ/5DFMEhJ9byLyD9M4TufYy1ogilr2AQ4N2miGHc6dQC9ENzucWzxEO1vsMIhuw0GEKAaDupYkZmuaxYmuasVe5+KIaGUkinWi1yjRJJUyai6h1FijU2dYK5y2cpQSayimBUdb4aLOEMc/yP1n6eFZ7hVEGSO7gkrXCmW2I9NKYYdAtyE87BAyHozvaccH75vBQ1pdfxlAzi8/GwBel2sCSvnFgimEvHKr+fFWUyOkb3621GAiK0q+XOA+/gCtlj2I+YoKDQAAAABJRU5ErkJggg==') no-repeat;
background-size: 100% 100%;
z-index: 10;
}
}
}
.apply_btn_box {
......
......@@ -29,7 +29,11 @@
if(this.type === 1) {
uni.navigateTo({
url: '/pages/apply/applypage1'
})
});
} else {
uni.navigateTo({
url: '/pages/signcontract/signcontract'
});
}
}
},
......
<template>
<view class="fin_content">
<SearchBar />
<view class="flex tab_bar">
<SearchBar :isLogin="isLogin"/>
<view class="tab_bar">
<text @click="jumpPhpPage()">首页</text>
<text @click="jumpPhpPage('app=promotion')">精彩活动</text>
<!-- <text @click="jumpPhpPage('app=promotion')">精彩活动</text> -->
<text>
<i class="credit_icon"></i>
谛宝白条
</text>
<text class="act">采购分期</text>
</view>
<view class="flex_category">
<!-- <view class="flex_category">
<view class="cate_item1"></view>
<view class="cate_item2"></view>
<view class="cate_item3"></view>
<view class="cate_item4"></view>
</view>
</view> -->
<view class="fin_banner"></view>
<view class="fin_select">
<view class="fin_select" v-if="EquipmentHotList">
<view class="fin_select_label">
<text class="fin_limit">限时</text>
<text class="fin_title">行业精选 限时免息!</text>
</view>
<text class="fin_desc">各类搭配组合 满足中小型医院无忧开店</text>
<swiper :style="{'margin-top': '36rpx'}">
<swiper-item>
<view class="fin_goods">
<view class="fin_goods_item">
<image src="https://dbc-static.oss-cn-beijing.aliyuncs.com/static/pic3%402x.png"></image>
<text class="fin_goods_name">测试</text>
<text class="fin_goods_price">2222</text>
<uni-swiper-dot :info="EquipmentHotList" mode="dot" :dotsStyles="{'width': 4,'height':4, 'bottom':0,'border':'none','selectedBorder':'none'}" :current="current">
<swiper class="fin_swiper" :autoplay="true" @change="change" >
<swiper-item class="fin_swiper_item" v-for="(val, index) in EquipmentHotList" :key="index">
<view class="fin_goods" v-for="(vo, key) in val" :key="key">
<view class="fin_goods_item" @click="jumpDetail(vo.equipment_id)">
<image :src="vo.img_url"></image>
<text class="fin_goods_name">{{vo.equipment_name}}</text>
<text class="fin_goods_price">¥{{vo.remaining_payment}}</text>
</view>
</view>
</view>
</swiper-item>
</swiper>
</swiper-item>
</swiper>
</uni-swiper-dot>
</view>
<view class="fin_recommended">
<view class="fin_recommended" v-if="EquipmentRecommendList">
<view class="fin_recommended_label">
<i class="fin_icon"></i>
<text class="fin_recommended_title">为您推荐</text>
......@@ -46,16 +48,16 @@
<i></i>
</view>
<view class="fin_rec_goods">
<view class="fin_rec_goods_item">
<image src="https://dbc-static.oss-cn-beijing.aliyuncs.com/static/pic3%402x.png"></image>
<view class="fin_rec_goods_item" v-for="(val, index) in EquipmentRecommendList" :key="index">
<image :src="val.img_url"></image>
<i class="fin_rec_label fin_rec_label1">限时</i>
<i class="fin_rec_label fin_rec_label2">免息</i>
<text class="fin_rec_goodsname">限量版宝璐天然粮</text>
<text class="fin_rec_goodsname">{{val.equipment_name}}</text>
<text class="fin_rec_goodssubname">限量版宝璐天然粮</text>
<text class="fin_rec_goodprice">
<text></text>4800
<text></text>{{val.remaining_payment}}
</text>
<text class="fin_rec_goodssubname">12期免息</text>
<text class="fin_rec_goodssubname">{{val.periods_num}}期免息</text>
</view>
</view>
</view>
......@@ -70,7 +72,48 @@
export default {
data() {
return {
tabIndex: 3
tabIndex: 3,
EquipmentRecommendList: [], //推荐
EquipmentHotList: [], //精选
isLogin: 0,
current: 0
}
},
onLoad() {
this.getData();
uni.showLoading({
title: '加载中'
});
},
methods: {
getData() {
uni.request({
url: '/uni/api/equipment_index/EquipmentIndex',
method: 'GET',
dataType: 'json',
success: (res) => {
this.EquipmentRecommendList = res.data.data.EquipmentRecommendList;
this.isLogin = res.data.login_flg;
if(res.data.data.EquipmentHotList instanceof Array) {
let array = [];
for (var i = 0, j = res.data.data.EquipmentHotList.length; i < j; i += 6) {
array.push(res.data.data.EquipmentHotList.slice(i, i + 6));
}
this.EquipmentHotList = array;
} else {
this.EquipmentHotList = res.data.data.EquipmentHotList;
}
uni.hideLoading();
}
});
},
change(e) {
this.current = e.detail.current;
},
jumpDetail(id) {
uni.navigateTo({
url: `/pages/installment/installmentinfo?id=${id}`,
});
}
},
components: {
......@@ -152,12 +195,23 @@
display: block;
margin-top: 6rpx;
}
.fin_goods {
.fin_swiper {
box-shadow:0px 4px 16px 0px rgba(0,0,0,0.04);
width: 702rpx;
margin: 36rpx auto 0;
height: 580rpx;
padding: 0 46rpx;
box-sizing: border-box;
.fin_swiper_item {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
}
.fin_goods {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
box-shadow:0px 4px 16px 0px rgba(0,0,0,0.04);
.fin_goods_item {
image {
width: 180rpx;
......@@ -177,12 +231,13 @@
color: #AE8A57;
font-size: 26rpx;
line-height: 36rpx;
width: 180rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
position: relative;
top: -12rpx;
font-weight: 500;
text-align: center;
width: 180rpx;
display: inline-block;
}
}
}
......@@ -225,6 +280,9 @@
}
}
.fin_rec_goods {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.fin_rec_goods_item {
width: 346rpx;
height: 548rpx;
......@@ -233,6 +291,7 @@
border:1px solid rgba(236,236,236,1);
padding: 0 24rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
image {
width: 280rpx;
height: 280rpx;
......@@ -293,7 +352,6 @@
.tab_bar {
padding: 0 24rpx;
display: flex;
justify-content: space-between;
align-items: center;
height: 88rpx;
.credit_icon {
......@@ -303,28 +361,30 @@
background: url(../../static/index/2821581501269_.pic.jpg) no-repeat;
background-size: 100% 100%;
vertical-align: bottom;
margin-right: 4rpx;
}
text {
font-size: 28rpx;
color: #212121;
line-height: 40rpx;
margin-right: 72rpx;
}
.act {
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
font-size: 32rpx;
position: relative;
}
.act:after {
position: absolute;
width: 60rpx;
height: 4rpx;
background: #FFCD00;
border-radius: 0 2rpx 2rpx 2rpx;
content: '';
left: 50%;
margin-left: -30rpx;
top: 48rpx;
}
}
.tab_bar text {
font-size: 28rpx;
color: #212121;
line-height: 40rpx;
}
.tab_bar .act {
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
font-size: 32rpx;
position: relative;
}
.tab_bar .act:after {
position: absolute;
width: 60rpx;
height: 4rpx;
background: #FFCD00;
border-radius: 0 2rpx 2rpx 2rpx;
content: '';
left: 50%;
margin-left: -30rpx;
top: 48rpx;
}
</style>
<template>
<view class="info_content">
<view class="topbar_icon_box">
<text class="info_icon back_icon"></text>
<text class="info_icon back_icon" @click="backup()"></text>
<view>
<text class="info_icon home_icon"></text>
<text class="info_icon collection_icon"></text>
<text class="info_icon home_icon" @click="jumpPhpPage()"></text>
<text class="info_icon collection_icon" v-if="data.EquipmentInfo.collect_goods === 1" @click="collectGoods(data.EquipmentInfo.goods_id, 0)"></text>
<text class="info_icon uncollection_icon" v-if="data.EquipmentInfo.collect_goods === 0" @click="collectGoods(data.EquipmentInfo.goods_id, 1)"></text>
</view>
</view>
<swiper class="img_swiper">
<swiper-item>
<image src="https://dbc-static.oss-cn-beijing.aliyuncs.com/credit_shop/20190424/goods/5cc03cef241dc.jpeg?x-oss-process=image/resize,m_lfit,w_300,h_300/auto-orient,0/quality,Q_85/format,jpg" class="img_item"></image>
<swiper-item v-for="(val, index) in data.EquipmentImgs" :key="index">
<image :src="val.img_url" class="img_item"></image>
</swiper-item>
</swiper>
<view class="goods_info">
<view class="goods_info_flex">
<view>
<text class="symbol"></text>
<text class="goods_price">10990</text>
<text class="goods_price">{{e_info.equipment_price}}</text>
<text class="goods_label">分期购 </text>
</view>
<text class="sales_num">已售出 9,999</text>
<text class="sales_num">已售出 {{data.EquipmentInfo.sales}}</text>
</view>
<view class="goods_name">开店必备 检测试纸套餐</view>
<view class="goods_subname">开店必备 检测试纸套餐</view>
<view class="goods_name">{{data.EquipmentInfo.equipment_name}}</view>
<view class="goods_subname">{{data.EquipmentInfo.goods_subname}}</view>
</view>
<view class="freight common_item_bar">
<view>
<text class="info_commom_title">快递</text>
<text class="info_common_con">38元</text>
<text class="info_common_label">满300元包邮</text>
<text class="info_common_con">0.00</text>
<text class="info_common_label">包邮</text>
</view>
<view class="info_operation">
<!-- <view class="info_operation">
<text>选择</text>
<text class="right_arrow_icon"></text>
</view>
</view> -->
</view>
<view class="common_item_bar">
<!-- <view class="common_item_bar">
<view>
<text class="info_commom_title">活动</text>
<text class="info_common_label info_common_label2">分期</text>
<text class="info_common_con">金融分期限时免</text>
<text class="info_common_con">金融分期限时免</text>
</view>
<view class="info_operation">
<text>查看</text>
<text class="right_arrow_icon"></text>
</view>
</view>
</view> -->
<view class="common_item_bar">
<view>
<text class="info_commom_title">规格</text>
<text class="info_common_con">已选:x10</text>
<text class="info_common_con">已选:x{{Number(e_info.periods_num)+1}}</text>
</view>
<view class="info_operation" @click="open()">
<text>选择</text>
<text class="right_arrow_icon"></text>
</view>
</view>
<view class="title_label">分期信息</view>
<view class="installment_table_box">
<view class="installment_table">
<view class="table_title">
<view>分期数</view>
<view>定金 (元)</view>
<view>第1期还款</view>
<view>剩余每期还款</view>
</view>
<view class="table_item">
<view>6期</view>
<view>1000</view>
<view>3499.19</view>
<view>1990</view>
<view v-if="isLogin">
<view class="title_label">分期信息</view>
<view class="installment_table_box">
<view class="installment_table">
<view class="table_title">
<view>分期数</view>
<view>定金 (元)</view>
<view>第1期还款</view>
<view>剩余每期还款</view>
</view>
<view class="table_item" v-for="(val, index) in data.Equipmentproperty" :key="index">
<view>{{Number(val.periods_num)+1}}</view>
<view>{{val.advance_payment}}</view>
<view>{{val.first_payment}}</view>
<view>{{val.remaining_payment}}</view>
</view>
</view>
</view>
</view>
<view class="entry_shop">
<view>
<image class="shop_logo" src="https://dbc-static.oss-cn-beijing.aliyuncs.com/credit_shop/20190424/goods/5cc03cef241dc.jpeg?x-oss-process=image/resize,m_lfit,w_300,h_300/auto-orient,0/quality,Q_85/format,jpg"></image>
<view class="dlb dlb_box">
<image class="shop_logo" :src="data.StoreInfo.store_logo || $defaultPortrait"></image>
<view class="dlb dlb_box" @click="jumpPhpPage(`app=store&id=${data.StoreInfo.store_id}`)">
<view class="shop_name">谛宝多多<i class="right_arrow_icon"></i></view>
<view class="focus_num">2.4万+人关注</view>
<view class="focus_num">{{data.StoreInfo.collect_count}}人关注</view>
</view>
</view>
<text class="focus_shop">关注店铺</text>
<text class="focus_shop" v-if="data.EquipmentInfo.collect_store === 0" @click="collectShop(data.StoreInfo.store_id, 1)">关注店铺</text>
<text class="focus_shop" v-if="data.EquipmentInfo.collect_store === 1" @click="collectShop(data.StoreInfo.store_id, 0)">已关注</text>
</view>
<view class="shop_goods">
<view class="shop_goods_item">
<image src="https://dbc-static.oss-cn-beijing.aliyuncs.com/credit_shop/20190424/goods/5cc03cef241dc.jpeg?x-oss-process=image/resize,m_lfit,w_300,h_300/auto-orient,0/quality,Q_85/format,jpg"></image>
<view class="shop_goods_name">限量版宝璐…限量版宝璐…</view>
<view class="shop_goods_price">¥2,999</view>
<view class="shop_goods_item" v-for="(val, index) in data.EquipmentList" :key="index">
<image :src="val.img_url"></image>
<view class="shop_goods_name">{{val.equipment_name}}</view>
<view class="shop_goods_price">¥{{val.equipment_price}}</view>
</view>
</view>
<view class="goods_detail">
<view class="equipment_detail" v-if="equipment_detail">
<view class="title_label">产品信息</view>
<view v-html="equipment_detail"></view>
</view>
<view class="goods_info_bottom_bar">
<view class="bottom_bar_tool">
<view class="tool contact_tool"></view>
<view class="tool_title">联系客服</view>
</view>
<view class="bottom_bar_tool">
<view class="bottom_bar_tool" @click="jumpPhpPage(`app=store&id=${data.StoreInfo.store_id}`)">
<view class="tool shop_tool"></view>
<view class="tool_title">店铺</view>
</view>
<view class="bottom_bar_tool">
<view class="tool cart_tool"></view>
<view class="tool cart_tool" @click="jumpPhpPage('app=cart')"></view>
<view class="tool_title">购物车</view>
</view>
<view class="bottom_btn join_cart">加入购物车</view>
<view class="bottom_btn join_buy">购买</view>
<!-- <view class="bottom_btn join_cart">加入购物车</view> -->
<view class="bottom_btn join_buy" @click="open()">购买</view>
</view>
<uni-popup ref="popup" type="bottom">
<view class="poupp_content">
<text class="eosfont close" @click="close()">&#xe615;</text>
<view :style="{padding: '0 24rpx'}">
<view class="poupp_flex">
<image class="poupp_img" src="https://dbc-static.oss-cn-beijing.aliyuncs.com/credit_shop/20190424/goods/5cc03cef241dc.jpeg?x-oss-process=image/resize,m_lfit,w_300,h_300/auto-orient,0/quality,Q_85/format,jpg"></image>
<image class="poupp_img" :src="data.EquipmentInfo.default_image || $noGoodsImg"></image>
<view class="dlb">
<view class="poupp_goods_name">限量版宝璐天然粮</view>
<view class="poupp_goods_name">{{data.StoreInfo.equipment_name}}</view>
<view class="poupp_goods_price">
<text class="symbol">¥</text>1,099
<text class="symbol">¥</text>{{e_info.equipment_price}}
<text class="poupp_label">分期购</text>
</view>
</view>
......@@ -125,27 +131,26 @@
<view class="poupp_nper">
<view><text class="dlb">期数</text><text class="dlb limit_free">限时免息</text></view>
<view class="poupp_nper_box">
<text>10期</text>
<text>10期</text>
<text v-for="(val,index) in data.Equipmentproperty" :key="index" :class="{act: periodTab === index}" @click="choosePeriod(index)">{{Number(val.periods_num)+1}}</text>
</view>
</view>
<view class="poupp_deposit">
<text>定金</text>
<text>¥ 2100</text>
<text>¥ {{e_info.advance_payment}}</text>
</view>
<view class="poupp_nper_detail">
<view>
<text>第1期 支付</text>
<text>¥ 2030.20</text>
<text>¥ {{e_info.first_payment}}</text>
</view>
<view>
<text>剩余9期 每期支付</text>
<text>¥ 11335</text>
<text>剩余{{e_info.periods_num}}期 每期支付</text>
<text>¥ {{e_info.remaining_payment}}</text>
</view>
</view>
</view>
<view class="poupp_tips">金融分期需要上传金融资质, 包含法人信息/企业执照/银行流水等…</view>
<view class="poupp_btn">立即分期</view>
<view class="poupp_btn" @click="buy_now()">立即分期</view>
</view>
</uni-popup>
</view>
......@@ -153,15 +158,116 @@
<script>
import uniPopup from "@/components/uni-popup/uni-popup.vue";
import { php, go } from '../../common/host.js';
import store from '@/store/store.js';
export default {
data() {
return {
visible: false
visible: false,
data: {
EquipmentImgs: [],
EquipmentInfo: {},
EquipmentList: [],
Equipmentproperty: [],
StoreInfo: {}
},
e_info: {
equipment_price: 0.00,
advance_payment: 0.00,
remaining_payment: 0.00,
first_payment: 0.00
},
equipment_detail: '',
periodTab: 0,
isLogin: 0,
contract_no: '',
equipment_id: ''
}
},
onLoad(option) {
this.equipment_id = option.id;
this.getData(option.id);
},
methods: {
open() {
this.$refs.popup.open()
},
close() {
this.$refs.popup.close()
},
getData(id) {
uni.request({
url: `/uni/api/equipment_index/GetEquipmentDetail/${id}`,
method: 'GET',
dataType: 'json',
success: (res) => {
this.data = {
...this.data,
...res.data.data
}
this.e_info = {
...this.e_info,
...res.data.data.Equipmentproperty[0]
}
this.equipment_detail = res.data.data.EquipmentInfo.equipment_details.replace(/\<img/g, `<image style="max-width: 100%;width: auto !important;height: auto !important"`);
this.isLogin = res.data.login_flg;
this.contract_no = res.data.data.contract_no;
}
});
},
choosePeriod(key) {
this.e_info = this.data.Equipmentproperty[key];
this.periodTab = key;
},
jumpPhpPage(url) {
let link = url ? `${php}${url}` : php;
window.location.href = link;
},
backup() {
uni.navigateBack();
},
buy_now() {
uni.navigateTo({
url: '/pages/apply/choosetype'
})
const data = {
contract_no: this.contract_no,
equipment_id: this.equipment_id,
property_id: this.e_info.property_id
}
store.dispatch('changeInstallment', data);
},
collectGoods(id, type) {
uni.request({
url: `/uni/api/collect/UpdateCollectGoods`,
method: 'POST',
dataType: 'json',
data: {
flag: type,
item_id: id
},
success: (res) => {
if(res.data.code === 0) {
this.data.EquipmentInfo.collect_goods = type;
}
}
})
},
collectShop(id, type) {
uni.request({
url: `/uni/api/collect/UpdateCollectStore`,
method: 'POST',
dataType: 'json',
data: {
flag: type,
item_id: id
},
success: (res) => {
if(res.data.code === 0) {
this.data.EquipmentInfo.collect_store = type;
}
}
})
}
},
components: {
......@@ -184,6 +290,7 @@
left: 0;
top: 0;
background: #fff;
z-index: 99;
.info_icon {
display: inline-block;
vertical-align: middle;
......@@ -200,6 +307,10 @@
margin-right: 20rpx;
}
.collection_icon {
background:url('data:image/jpeg;base64,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') no-repeat;
background-size: 100% 100%;
}
.uncollection_icon {
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAAAAAAfl4auAAAC6ElEQVRIx6VXz0tqURA+/+eoSQkuDKIoyoWYbYQKyrIIixZh4creSyITIjIFCVx4N6HQpjaSPxBS8de931uovXuPc824s7oz53yXc+bMfDMjwEo7Hw97PS6Hw+XxhuP5Nr9LMLZawmcng9h9idpMYCUoIUf4oPIjuOAjU/EVpoKr+zRV9qvm4Mw8/SDzGRNwN0IzSKTLgZsBmkkCzUlwfZ1mlPW6DG7OjCVabxrB3QD9QgJdAzhCv5KIHpyhX0rmP7jKv68j2W4nHfx7V7/BJnH1FwD+mMTaGFzg190dhELouPnVwghskgtxFImKiJtkyRCsmITxF3aJdvFlEvAKIIAgvxjFBxHRB6L8ehAQqNl5V9dxRER0hDrvcHsNAgn+x6f4tBER2T5xyu9IQJi4y1bG+fDrHGWbictEmzn1gv8ki8bcUJlrIHviX2DO3RZ5g8G5E30oNjQA6nfk7KsAtEbxIbrjNGzOC8Mzrg05alBRErrb+BJKZTDkuDVDIIiwXn1F5enqYINxr2Pj4Oqpgle9LSy8erWHxWm5tIieXvUKj16t4XIa+BI1veoRLr16Bu3MHHumwbDqEsb7XUM1JZWIimujHyQw3UA95rHHKm4kJxqPTUS3UMMcNqziVjK5jA4jIkpiEJrEhgZIyjaP8amIiCiFvl+2+ftITWz0CuaMz8jJphyemZsIhmVCKMmmEpirxKXEGHFIWjalOT7Jcyn5OBlnl3jkUpIhgzfsyaY9vHFkwNBQC8uyaRktloYmCHARnTEXbW2NGagzkW/2Gke923gfUUgZKI8I5R3bHPVOkP4FskREgRLQaAClABFRFhcs6csuu0eMaPVFQyvmdMZa0F5WiWK4Z8uNXOjukF5K9dFPuomI3Mk++qmlNO74QieV2E0VgJZbGesrOQ2AusmXWLm4H1Z7iiE1/EqvemhW3C21FdYaGmutlKUmzlr7aK1xtdYyW2vWLY4J1gYUi6ORxaHsF+PgPyIWgG2yq3F6AAAAAElFTkSuQmCC') no-repeat;
background-size: 100% 100%;
}
......@@ -517,7 +628,7 @@
background-size: 100% 100%;
}
.bottom_btn {
width: 220rpx;
width: 452rpx;
height: 68rpx;
line-height: 68rpx;
text-align: center;
......@@ -541,6 +652,15 @@
background-color: #fff;
padding: 40rpx 0 20rpx;
color: #212121;
position: relative;
.close {
width: 28rpx;
height: 28rpx;
position: absolute;
right: 48rpx;
top: 26rpx;
color: #212121;
}
.poupp_flex {
display: flex;
padding-bottom: 40rpx;
......@@ -615,6 +735,9 @@
font-size: 26rpx;
margin-right: 20rpx;
}
.act {
border-color: #000000;
}
}
.poupp_deposit {
height: 80rpx;
......@@ -669,4 +792,7 @@
margin: 20rpx auto 0;
}
}
.equipment_detail p image {
}
</style>
<template>
<view class="sign_content">
<TopBar title="金融分期"/>
<view :style="{'margin-top':'28rpx'}">
<view class="apply_title">签署合同</view>
<view class="apply_desc">请填写合同内详细信息</view>
......@@ -10,90 +11,12 @@
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">联系方式</view>
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">企业地址</view>
<view>
此处为地址picker
</view>
<view>
<textarea class="sign_textarea" placeholder="具体到企业所在街道号码"></textarea>
</view>
<view class="sign_title">邮编地址</view>
<view>
<input type="text" class="sign_input">
</view>
<view :style="{'margin-top':'28rpx'}">
<view class="apply_title">签收信息</view>
</view>
<view class="sign_flex">
<text class="sign_title" :style="{'margin-top':0}">交货地址</text>
<view>
<text class="sign_checkbox act"></text>
<text class="sign_title" :style="{'margin-top':0}">即为安装地址</text>
</view>
</view>
<view class="sign_title">企业地址</view>
<view>
此处为地址picker
</view>
<view>
<textarea class="sign_textarea" placeholder="具体到企业所在街道号码"></textarea>
</view>
<view class="sign_title">签收人</view>
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">签收人电话</view>
<view>
<input type="text" class="sign_input">
</view>
</uni-collapse-item>
</uni-collapse>
<uni-collapse>
<uni-collapse-item title="买方信息" :open="true">
<view class="sign_flex">
<text class="sign_title" :style="{'margin-top':0}">买方代表</text>
<view>
<text class="sign_checkbox"></text>
<text class="sign_title" :style="{'margin-top':0}">委托代理人</text>
</view>
</view>
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">买方法人</view>
<view>
<input type="text" class="sign_input">
</view>
<view :style="{'margin-top':'40rpx'}">
<view class="apply_title">签收信息</view>
</view>
<view class="sign_title">文书送达地址</view>
<view>
此处为地址picker
</view>
<view>
<textarea class="sign_textarea" placeholder="具体到企业所在街道号码"></textarea>
</view>
<view class="sign_title">签收人</view>
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">签收人电话</view>
<view>
<input type="text" class="sign_input">
</view>
<view class="sign_title">签收人邮箱</view>
<view>
<input type="text" class="sign_input">
</view>
</uni-collapse-item>
</uni-collapse>
<view class="agreement">
关于<text>《谛宝多多金融分期协议》</text><text>《xx产品分期采购合同》</text>
关于
<!-- <text>《谛宝多多金融分期协议》</text> -->
<text>《xx产品分期采购合同》</text>
</view>
<view>
<text class="sign_checkbox"></text>
......@@ -109,8 +32,9 @@
</template>
<script>
import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
import uniCollapse from '@/components/uni-collapse/uni-collapse.vue';
import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue';
import TopBar from '@/components/TopBar/TopBar.vue';
export default {
data() {
return {
......@@ -119,7 +43,8 @@
},
components: {
uniCollapse,
uniCollapseItem
uniCollapseItem,
TopBar
}
}
</script>
......@@ -127,7 +52,7 @@
<style lang="less" scoped>
.sign_content {
background: #fff;
padding: 0 36rpx;
padding: 80rpx 36rpx 0;
.apply_title {
font-size:32rpx;
font-family:PingFangSC-Medium,PingFang SC;
......@@ -147,15 +72,6 @@
font-size:28rpx;
margin-top: 32rpx;
}
.sign_textarea {
width: 100%;
height:200rpx;
background:rgba(248,248,248,1);
border-radius:16rpx;
padding: 20rpx;
margin-top: 40rpx;
font-size: 28rpx;
}
.sign_input {
width:100%;
height:72rpx;
......@@ -231,4 +147,5 @@
background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAMAAADW3miqAAACoFBMVEUhISEkIyArKR84Mx49Nh1cThhgURdiUxdqWRZwXhVzYBV+aROAahOihQ61kwu4lQu6lwq9mQrKpAjasAXwwQL3xgH9ywD/zQD/zQH/zQL/zgf/zgn/zwr/zxD/0BD/0BL/0BP/0RP/0RT/0RX/0h7/0x7/0x//0yP/1CT/1Cj/1Sf/1Sj/1Sr/1Sz/1jH/1zP/1zT/1zX/2Dn/2Dr/2T//2UD/2UL/2kH/2kT/2kX/20X/3E3/3E//3VL/3VT/3lT/3lf/3lj/31v/313/31//32H/4GH/4Gb/4Wb/4Wr/4Wz/4mn/4mv/4m3/43H/43L/43T/43X/5HP/5HT/5HX/5Hb/5Hf/5Hj/5Hn/5Hr/5Xn/5Xv/5X3/5oD/5oH/5oP/5oT/54P/54X/54b/54f/54n/6In/6Iv/6I7/6Y7/6Y//6ZL/6ZP/6ZT/6pf/6pj/6pn/65f/65n/65r/65v/657/65//7KD/7KP/7KT/7aP/7ab/7af/7aj/7an/7qr/7qv/7qz/7q3/763/767/76//77H/77P/8LT/8LX/8Lb/8Lf/8br/8bv/8b3/8r7/8sD/8sH/8sL/88L/88T/88X/88b/88n/9Mj/9Mn/9Mr/9Mv/9Mz/9M3/9c3/9c7/9dD/9dH/9tH/9tL/9tP/9tT/99b/99f/99j/99n/99r/99z/+Nv/+Nz/+N3/+N7/+N//+d7/+d//+eH/+eL/+eP/+eX/+uL/+uT/+uX/+ub/+uf/+uj/+un/+uv/++r/++v/++z/++3/++7/++//+/D//O7//O///PD//PH//PL//PP//PT//PX//fT//fX//fb//ff//fj//fn//fv//vb//vj//vn//vr//vv//vz//v3///z///3///7////If3C4AAACf0lEQVQ4y2O4TwRgQBe4BwR4FN27dfPyxfPnTp8+c+Hi5Zu372FRdO/m9bMn922ujg8Pj6/efujUhcu37qEpunfr+vljW1P0JcXBQNIgbcdxhDKIors3LxzdlSkvjgTks/acunbzHkLR7RvnD660EEcDlmuPXbhyF6bo7o3z+6doi2MA7RkHL1y5B1F07+b5/Yu1xLEAzeUHL4BsZAC6+cLBVabiWIHZ+uPXboMU3b58ZH2cOA6QtOXU5XtARTfPbZsli0uR3KK9F27dZ7h3/dCKYHGcIGzjicv3GG6d3zlLB1NSmFcETOsu2HvhNsONE2u6JTHUCDExcELCvm/z6TsMlw4sjsOmhoEbwkxecfgGw4VdM10hXAEWHjGEGlZRCNtjwf5rDGc2T3KAcNkYGLjE0NWIO03fdYHh9Lo+ewhXkBGiCkWNuOOUrVcZTq7ucYTy+cCqUNWIO0/ecgakyFccSRU7qhrxIJAioHXZEsiqUNVIFIOsAzq8RFUcWRWyGnG1KpDDgUFQYYMQ5GfmQFYjbtcACgJgYLamSOOKOpmMLlBgAqOlN88alyLb0kmgaAFFcE2COnY1Gukt4AgGJZWe/ABFbGqUIksngJMKKNHNbcn0UMBUo+iT27lkDyjRgZPv1JpUHxV0NWp+GU2zockXnBEmVqb5mUghK5EyD8monwbLCOAstWJSTUaUu5ESNOwllI29Y3Iap62DZSlI5lw1taUoKdTTxcJQT8/Qys0rIrW0fdZGROaEZPMN83vr8tNjI0L8/QOjEzNKmics3IKczaEFxso5fW01ZQWFhcXltR0T569GKzCgRc+2dUvnTJ3Q3z9x2rxlm3afQBQ9AO0gCIzNUhSlAAAAAElFTkSuQmCC');
}
}
</style>
@font-face {font-family: "eosfont";
src: url('https://at.alicdn.com/t/font_1682539_4kf2n8t4rub.ttf') format('truetype');
src: url('https://at.alicdn.com/t/font_1682539_n5w0owl8p69.ttf') format('truetype');
}
.eosfont {
......
......@@ -3,16 +3,23 @@ import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
webviewUrl: ''
webviewUrl: '',
installment: {} //采购分期存储的数据
},
mutations: {
changeWebviewUrl(state, url) {
state.webviewUrl = url;
},
changeInstallment(state, data) {
state.installment = data;
}
},
actions: {
changeWebviewUrl(context, url) {
context.commit('changeWebviewUrl', url);
},
changeInstallment(context, data) {
context.commit('changeInstallment', data);
}
}
})
......
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