yunshangxie/pages/index/discovery.vue

114 lines
4.5 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 style="letter-spacing: 1rpx;">
<tn-nav-bar :isBack="false" :bottomShadow="true" backgroundColor="#FFFFFF">
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-left">
<view class="tn-margin-top"
style="text-shadow: 1rpx 0 0 #FFF, 0 1rpx 0 #FFF, -1rpx 0 0 #FFF , 0 -1rpx 0 #FFF;">
<tn-tabs :list="[{name:'智慧云商协'}]" :current="topCurrent" activeColor="#000" :bold="false"
:fontSize="36"></tn-tabs>
</view>
</view>
</tn-nav-bar>
<view :style="{paddingTop: vuex_custom_bar_height + 'px'}">
<view style="position: relative;">
<swiper class="card-swiper" :circular="true" :autoplay="true" duration="500" interval="8000"
@change="cardSwiper" style="height: 370rpx;">
<swiper-item v-for="(item,index) in swiperList" :key="index" :class="cardCur==index?'cur':''"
style="padding: 0px;border-radius: 0;">
<view class="swiper-item image-banner"
:style="'background-image:url('+ item.url + ');background-size: 100%; background-repeat: no-repeat;border-radius: 0;'">
</view>
</swiper-item>
</swiper>
<view style="position: absolute;top: 10px;right: 10px;">
<view
style="position: relative;;width: 70rpx;height: 60rpx;background-color: rgba(255, 255, 255, 0.9);border-radius: 8rpx;box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(12,0,5,0.2);">
<image src="/static/c1455.png" mode="widthFix"
style="width: 40rpx;position: absolute;left: 0;right: 0;margin: 0 auto;top: 15rpx;"></image>
</view>
</view>
</view>
</view>
<view style="padding:20rpx 30rpx;">
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-between" style="font-size: 30rpx;">
<view>协会地址</view>
<view>郑州市金水路17号</view>
</view>
<view style="margin: 20rpx 0rpx;font-size: 30rpx;"
class="custom-nav tn-flex tn-flex-col-center tn-flex-row-between">
<view>协会邮箱</view>
<view>hnqqx@126.com</view>
</view>
<view class="custom-nav tn-flex tn-flex-col-center tn-flex-row-between" style="font-size: 30rpx;">
<view>联系方式</view>
<view>0371-65560130</view>
</view>
</view>
<view style="height: 10rpx;background-color: #EBF4F7;"></view>
<view style="padding:10rpx 30rpx 180rpx 30rpx;">
<tn-tabs :list="list" :isScroll="false" :activeItemStyle="{'fontWeight':'600','fontSize':'30rpx'}"
style="font-weight: ;" activeColor="#000" :barWidth="50" :barHeight="6"
:barStyle="{'background': 'linear-gradient(-45deg, #4AA2EF, #3A7FF4)','borderRadius': '4rpx'}"
:current="current" name="name" @change="change"></tn-tabs>
<view style="margin-top: 20rpx;position: relative;">
<image src="/static/b1.png"
style="width: 100rpx;height: 100rpx;position: absolute;left: 0;right: 0;top: 38%;z-index: 10;margin: 0 auto;">
</image>
<image src="/static/t7.jpg" style="width: 100%;border-radius: 20rpx;" mode="widthFix"></image>
</view>
<view style="line-height: 50rpx; text-indent: 2em;margin-top: 20rpx;">
<p>河南省青年企业家协会HeNan Young
EntrepreneursAssociation简称为省青企协是全省性的青年企业家的群众组织是共青团联系青年企业家的桥梁和纽带是具有独立法人资格的非营利性社会团体是中国青年企业家协会、河南省青年联合会、河南省企业联合会河南省企业家协会的团体会员。
</p>
</view>
</view>
<view style="position: fixed;bottom: 12%;width: 100%;">
<view class="tn-flex tn-flex-row-around">
<view @click="openUrl('/pages/index/directory')"
style="color: #fff;;letter-spacing: 10rpx;line-height: 70rpx;;text-align: center;;width: 300rpx;height: 70rpx;background: linear-gradient(-45deg, #4AA2EF, #3A7FF4);border-radius: 50rpx;">
会员名录</view>
<view
style="color: #fff;;letter-spacing: 10rpx;line-height: 70rpx;;text-align: center;;width: 300rpx;height: 70rpx;background: linear-gradient(270deg, #EE7E45, #EE9657);border-radius: 50rpx;">
申请入会</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
topCurrent: 0,
swiperList: [{
url: '/static/banner1.jpg',
}],
list: [{
name: '协会简介'
}, {
name: '组织架构'
}, {
name: '规章制度',
}, {
name: '入会须知',
}],
current: 0
}
},
methods: {
openUrl(url) {
uni.navigateTo({
url: url
})
},
change(e) {
this.current = e;
},
}
}
</script>
<style>
</style>