merge
This commit is contained in:
唐明明
95
pages/index/free.vue
Normal file
95
pages/index/free.vue
Normal file
@@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<view class="introduce" v-if='loaded'>
|
||||
<image class="richTxt" :src="base.cover" mode="widthFix" />
|
||||
<view class="nowbuy" @click="nowBuy" v-if="!is_recharge"> <view class="btn">￥{{base.price}} 立即购买 </view> </view>
|
||||
<view class="nowbuy nonebuy" v-else> <view class="btn"> 已开通 </view> </view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
recharge,zyPay
|
||||
} from '@/apis/interfaces/index.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
loaded:false,
|
||||
base: '',
|
||||
is_recharge: true,
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.getInfo()
|
||||
},
|
||||
methods:{
|
||||
getInfo(){
|
||||
recharge().then(res => {
|
||||
this.base = res.base
|
||||
this.is_recharge = res.is_recharge
|
||||
this.loaded = true
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err.message,
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
duration: 2000
|
||||
})
|
||||
})
|
||||
},
|
||||
nowBuy(){
|
||||
zyPay(this.base.service_id).then(res => {
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
duration: 2000
|
||||
})
|
||||
this.is_recharge = true
|
||||
|
||||
}).catch(err => {
|
||||
console.log(err)
|
||||
uni.showToast({
|
||||
title: err.message,
|
||||
icon: 'none',
|
||||
mask: true,
|
||||
duration: 2000
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.introduce{
|
||||
padding-bottom: 120rpx;
|
||||
.nowbuy{
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
height: 120rpx;
|
||||
padding-bottom: 20rpx;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
background-color: #fff;
|
||||
.btn{
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
margin: 20rpx $margin*2 0 $margin*2;
|
||||
border-radius: 80rpx;
|
||||
background: linear-gradient( to right, #e5584c,#ee7b46);
|
||||
}
|
||||
}
|
||||
.nonebuy{
|
||||
color: #333;
|
||||
font-weight: none;
|
||||
.btn{
|
||||
background: linear-gradient( to right, #ececec,#ececec);
|
||||
}
|
||||
}
|
||||
.richTxt{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -7,12 +7,14 @@
|
||||
class="banner-swiper"
|
||||
:list="bannerArr"
|
||||
:indicator="true"
|
||||
keyName="cover"
|
||||
previousMargin="20"
|
||||
nextMargin="20"
|
||||
circular
|
||||
radius="10"
|
||||
bgColor="#ffffff"
|
||||
height="100%"
|
||||
@click='swiperClick'
|
||||
/>
|
||||
</view>
|
||||
<view class="notice">
|
||||
@@ -22,7 +24,9 @@
|
||||
<u-notice-bar
|
||||
icon=""
|
||||
:text="notice"
|
||||
fontSize="13"
|
||||
url=''
|
||||
linkType='navigateTo'
|
||||
fontSize="14"
|
||||
direction="column"
|
||||
bgColor="#fff"
|
||||
color="#111111"
|
||||
@@ -31,9 +35,8 @@
|
||||
</view>
|
||||
</view>
|
||||
<!-- 自由服务包 -->
|
||||
<view class="free">
|
||||
<view class="free" @click="clickFree">
|
||||
<image class="free-img" src="@/static/index/index_banner_free.png" mode="widthFix" />
|
||||
<!-- <image class="free-img" src="@/static/imgs/index-img.png" mode="widthFix"></image> -->
|
||||
</view>
|
||||
<!-- 金法产品 -->
|
||||
<view class="block">
|
||||
@@ -61,7 +64,7 @@
|
||||
>
|
||||
<image class="cover" :src="item.cover" mode="aspectFill" />
|
||||
<view class="title nowrap">{{item.title}}</view>
|
||||
<view class="price nowrap"><text>￥</text>{{item.price}}</view>
|
||||
<view class="price nowrap"><text>￥</text>{{item.price}}<text class="ding" v-if="item.type">定金</text></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
@@ -69,11 +72,10 @@
|
||||
<view class="block">
|
||||
<view class="block-title">
|
||||
<view class="title">综法产品</view>
|
||||
|
||||
<!-- <view class="more">更多<u-icon class="more-icon" size="28rpx" color="#999" name="arrow-right"></u-icon></view> -->
|
||||
<view class="more">更多<u-icon class="more-icon" size="28rpx" color="#999" name="arrow-right" /></view>
|
||||
</view>
|
||||
<view class="zong-list">
|
||||
<view class="zong-list-item" v-for="(item, index) in zfList" :key="index">
|
||||
<view class="zong-list-item" v-for="(item, index) in 3" :key="index">
|
||||
<image class="cover" src="@/static/imgs/index-pack-01.png" mode="aspectFill" />
|
||||
<view class="colum-flex">
|
||||
<view class="title nowrap">2022年尊享综法服务包</view>
|
||||
@@ -87,7 +89,7 @@
|
||||
|
||||
<script>
|
||||
import { region } from '@/apis/interfaces/address.js'
|
||||
import { categories,jf,zf } from '@/apis/interfaces/index.js'
|
||||
import { categories,jf,zf,index } from '@/apis/interfaces/index.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@@ -98,38 +100,21 @@
|
||||
theTabStyle : {
|
||||
left: '0%'
|
||||
},
|
||||
bannerArr : [
|
||||
'https://cdn.uviewui.com/uview/swiper/swiper1.png',
|
||||
'https://cdn.uviewui.com/uview/swiper/swiper2.png',
|
||||
'https://cdn.uviewui.com/uview/swiper/swiper3.png',
|
||||
],
|
||||
notice : [
|
||||
'王**信用卡法务咨询办理成功（今日）',
|
||||
'王**信用卡法务咨询办理成功（今日）',
|
||||
'王**信用卡法务咨询办理成功（今日）',
|
||||
'王**信用卡法务咨询办理成功（今日）',
|
||||
'王**信用卡法务咨询办理成功（今日）',
|
||||
],
|
||||
bannerArr : [],
|
||||
notice : [],
|
||||
jfList:[],
|
||||
defaultViewId:'',
|
||||
zfList:[],
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
categories().then(res=>{
|
||||
this.theTabs = this.theTabs.concat(res)
|
||||
}).catch(err=>{
|
||||
uni.showToast({
|
||||
title:err.message,
|
||||
icon:'none',
|
||||
mask:true,
|
||||
duration:2000
|
||||
})
|
||||
})
|
||||
this.getCategory()
|
||||
this.getJf()
|
||||
this.getIndex()
|
||||
this.getZf()
|
||||
},
|
||||
methods: {
|
||||
// 获取金法列表
|
||||
getJf(){
|
||||
let params = {
|
||||
category_id:this.theTabId
|
||||
@@ -156,6 +141,7 @@
|
||||
url:'/pages/index/introduces?id='+id
|
||||
})
|
||||
},
|
||||
// 获取综法列表
|
||||
getZf(){
|
||||
zf().then(res=>{
|
||||
// this.jfList = res
|
||||
@@ -167,11 +153,65 @@
|
||||
duration:2000
|
||||
})
|
||||
})
|
||||
},// 获取综法列表
|
||||
// 首页轮播图及公告
|
||||
getIndex(){
|
||||
index().then(res=>{
|
||||
this.bannerArr = res.bannners
|
||||
let list = []
|
||||
res.notices.map(item=>{
|
||||
let params = item.user.name + ' ' + item.user.text
|
||||
list.push(params)
|
||||
})
|
||||
this.notice = list
|
||||
}).catch(err=>{
|
||||
uni.showToast({
|
||||
title:err.message,
|
||||
icon:'none',
|
||||
mask:true,
|
||||
duration:2000
|
||||
})
|
||||
})
|
||||
},
|
||||
// 获取金法分类列表
|
||||
getCategory(){
|
||||
categories().then(res=>{
|
||||
this.theTabs = this.theTabs.concat(res)
|
||||
}).catch(err=>{
|
||||
uni.showToast({
|
||||
title:err.message,
|
||||
icon:'none',
|
||||
mask:true,
|
||||
duration:2000
|
||||
})
|
||||
})
|
||||
},
|
||||
// 金法产品筛选
|
||||
onTheTab(e){
|
||||
if(e.category_id != this.theTabId){
|
||||
let index = this.theTabs.findIndex(val => val.category_id === e.category_id)
|
||||
this.theTabStyle = {
|
||||
left: index * 25 + '%'
|
||||
}
|
||||
this.theTabId = e.category_id
|
||||
this.getJf()
|
||||
}
|
||||
},
|
||||
// 选择城市节点
|
||||
onCityPicker(e){
|
||||
this.getRegion(e.value);
|
||||
},
|
||||
// 点击轮播图
|
||||
swiperClick(e){
|
||||
// console.log(this.bannerArr[e])
|
||||
},
|
||||
// 点击轮播图跳转自由服务包
|
||||
clickFree(){
|
||||
console.log('clickFree.....')
|
||||
uni.navigateTo({
|
||||
url:'/pages/index/free'
|
||||
})
|
||||
},
|
||||
// 获取城市数据
|
||||
getRegion(id){
|
||||
region({
|
||||
@@ -180,17 +220,6 @@
|
||||
console.log(res)
|
||||
})
|
||||
},
|
||||
// 金法产品筛选
|
||||
onTheTab(e){
|
||||
if(e.category_id != this.theTabId){
|
||||
let index = this.theTabs.findIndex(val => val.category_id === e.category_id)
|
||||
this.theTabStyle = {
|
||||
left: index * 25 + '%'
|
||||
}
|
||||
this.theTabId = e.category_id
|
||||
this.getJf()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -220,7 +249,7 @@
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
.notice-title{
|
||||
background-color: #ECF0FF;
|
||||
background-color: #ececec;
|
||||
color: #000;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
@@ -358,6 +387,12 @@
|
||||
text{
|
||||
font-size: 80%;
|
||||
}
|
||||
.ding{
|
||||
font-size: 64%;
|
||||
margin-left: 4rpx;
|
||||
position: relative;
|
||||
bottom: 2rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user