Files
douhuo-h5/pages/sheet/create.vue
2023-05-15 13:18:38 +08:00

200 lines
5.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="create-type">
<view class="create-type-title">
选择咨询类型
<text>点击咨询进行选择咨询类型信用卡/贷款/综法业务</text>
<!-- /综法业务 -->
</view>
<block v-for="(item, businessIndex) in businessArr" :key="businessIndex">
<view class="create-type-item" :class="{'active': item.self_type + item.business_id == businessName}" @click="onBusiness(item.self_type, item.business_id)">
<image class="create-type-icon" :src="item.cover_url" mode="aspectFill"></image>
<view class="create-type-text">
<view class="title nowrap">{{item.title || '-'}}</view>
<view class="submit nowrap">{{item.subtitle || '-'}}</view>
</view>
<image class="create-type-check" :src="item.self_type + item.business_id == businessName ? '/static/icon/Check_active.png' : '/static/icon/Check.png'" mode="aspectFill"></image>
</view>
</block>
<block v-for="(item, index) in synthesisArr" :key="index+'synthesis'">
<view class="create-type-item" :class="{'active': item.self_type + item.synthesis_id == businessName}" @click="onBusiness(item.self_type, item.synthesis_id)">
<image class="create-type-icon" :src="item.cover" mode="aspectFill"></image>
<view class="create-type-text">
<view class="title nowrap">{{item.title || '-'}}</view>
<view class="submit nowrap">综法业务</view>
</view>
<image class="create-type-check" :src="item.self_type + item.synthesis_id == businessName ? '/static/icon/Check_active.png' : '/static/icon/Check.png'" mode="aspectFill"></image>
</view>
</block>
</view>
<view class="create-btn">
<button size="default" @click="onNext()">下一步</button>
</view>
</view>
</template>
<script>
import { workIndex } from '@/apis/interfaces/index'
import { synthList } from '@/apis/interfaces/synthesis'
export default {
data() {
return {
businessArr : [],
businessType: '',
businessName: '',
businessId : '',
synthesisArr: []
};
},
created() {
// 业务类型列表
workIndex().then(res => {
this.businessArr = res
this.businessType= res[0].self_type
this.businessName= res[0].self_type + res[0].business_id
this.businessId = res[0].business_id
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
// 综法类型列表
synthList().then(res => {
this.synthesisArr = res
}).catch(err => {
uni.showToast({
title: err.message,
icon : 'none'
})
})
},
methods: {
// 选择业务类型
onBusiness(type, id){
this.businessName = type + id
this.businessType = type
this.businessId = id
},
// 创建业务单
onNext(){
// 信用卡/贷款
if(this.businessType == 'business') {
let busines = this.businessArr.find(val => val.business_id === this.businessId)
this.$Router.replace({
name : 'sheetBasic',
params : {
businessTitle : busines.title,
businessId : busines.business_id,
}
})
return
}
// 综法
let synthesis = this.synthesisArr.find(val => val.synthesis_id === this.businessId)
if(synthesis.can.buy) {
this.$Router.push({
name : 'FeeWrite',
params : {
synthesisId: synthesis.synthesis_id
}
})
} else {
this.$Router.replace({
name : 'PersonBrief',
params : {
synthesisId: synthesis.synthesis_id,
type: 1
}
})
}
}
},
}
</script>
<style lang="scss" scoped>
.content {
padding: 50rpx;
box-sizing: border-box;
height: 100vh;
// height: calc(100vh - 44px);
background-color: #fcfcfc;
}
// 选择业务类型
.create-type{
padding-top: 50rpx;
.create-type-title{
line-height: 50rpx;
text-align: center;
font-size: $title-size + 4;
margin-bottom: 70rpx;
font-weight: 600;
text {
font-weight: normal;
color: gray;
display: block;
font-size: $title-size-m;
}
}
.create-type-item{
background: #ffffff;
border-radius: $radius-m;
padding: 35rpx 30rpx;
margin-top: 30rpx;
border:solid 1rpx #f8f8f8;
box-sizing: border-box;
display: flex;
align-items: center;
box-shadow: 0 0 5rpx rgba(0, 0, 0, .05);
position: relative;
.create-type-icon{
width: 88rpx;
height: 88rpx;
margin-right: $margin;
background-color: white;
border-radius: $radius;
}
.create-type-text{
line-height: 50rpx;
.title{
font-size: 30rpx;
}
.submit{
color: gray;
font-size: 26rpx;
}
}
.create-type-check {
width: 38rpx;
height: 38rpx;
position: absolute;
top: 44rpx;
right: 30rpx;
}
&.active{
border:solid 1rpx #ff9fb1;
}
}
}
// 按钮
.create-btn{
margin-top: 100rpx;
button[size="default"]{
height: 90rpx;
line-height: 90rpx;
background: $mian-color;
font-size: 32rpx;
color: white;
font-weight: bold;
&::after{
border: none;
}
}
}
</style>