更新大理市民卡app
diff --git a/pages/sub_tabbar/index.vue b/pages/sub_tabbar/index.vue
new file mode 100644
index 0000000..b410b23
--- /dev/null
+++ b/pages/sub_tabbar/index.vue
@@ -0,0 +1,528 @@
+<template>
+ <view class="wrap">
+ <!-- 头部导航 -->
+ <u-sticky h5-nav-height="0">
+ <!-- #ifndef MP-WEIXIN -->
+ <view class="status_bar"></view>
+ <!-- #endif -->
+ <view class="wrap-header">
+ <view class="img-box" @click="scan">
+ <u-image src="/static/images/index/scan.png" width="40rpx" height="40rpx" mode="aspectFit"></u-image>
+ </view>
+ <u-search placeholder="暂无服务可查询" v-model="searchVal" :show-action="false" bg-color="#F7F7F7" margin="0 15rpx"
+ @search="search"></u-search>
+ <view class="img-box" @click="toPath('/pages/sub_index/qrcode/index')">
+ <u-image src="/static/images/index/money.png" width="40rpx" height="40rpx" mode="aspectFit"></u-image>
+ </view>
+ <view class="img-box" @click="toPath('')">
+ <u-image src="/static/images/index/square.png" width="40rpx" height="40rpx" mode="aspectFit"></u-image>
+ </view>
+ </view>
+ </u-sticky>
+ <!-- bannar内容 -->
+ <view class="wrap-bannar">
+ <view class="wrap-bannar-title">
+ <text>城市服务</text>
+ <text>一键速享</text>
+ </view>
+ <view class="wrap-bannar-box">
+ <image src="/static/images/index/bannar.png" mode="widthFix"></image>
+ <view class="wrap-bannar-box-overtitle">
+ <text>出行缴费</text>
+ <text>自在随心</text>
+ </view>
+ </view>
+ </view>
+ <!-- 功能列表 -->
+ <view class="wrap-func">
+ <u-image src="/static/images/index/bannar1.png" width="100%" mode="widthFix" border-radius="10"></u-image>
+ <!-- <view class="wrap-func-item" v-for="(v,i) in funcList" :key="i" @click="toPath()">
+ <u-image :src="v.src" width="70rpx" height="70rpx" mode="aspectFit"></u-image>
+ <text>{{v.title}}</text>
+ </view> -->
+ </view>
+ <!--热门活动 -->
+ <view class="wrap-active">
+ <text class="wrap-active-title">热门活动</text>
+ <view class="wrap-active-bannar">
+ <!-- <u-image src="/static/images/index/bannar01.png" width="100%" mode="widthFix"></u-image> -->
+ <u-swiper :list="activeImgList" name="picid" img-mode="scaleToFill" height="170" interval="5000" duration="1500"
+ @click="activeImg"></u-swiper>
+ </view>
+ <view class="wrap-active-con">
+ <view class="wrap-active-con-item" @click="signin">
+ <u-image src="/static/images/index/mrqd.png" width="70rpx" height="70rpx"></u-image>
+ <view class="wrap-active-con-item-desc">
+ <text class="wrap-active-con-item-desc-title">每日签到</text>
+ <text class="wrap-active-con-item-desc-desc">签到即可领积分</text>
+ </view>
+ </view>
+ <view class="wrap-active-con-item" @click="toUrl('/pages/sub_index/activeDetails/index?id='+ activity.articleno + '&type=' + activity.code)">
+ <u-image src="/static/images/index/smkhd.png" width="70rpx" height="70rpx"></u-image>
+ <view class="wrap-active-con-item-desc">
+ <text class="wrap-active-con-item-desc-title">{{activity.title?activity.title:''}}</text>
+ <text class="wrap-active-con-item-desc-desc">{{activity.subtitle?activity.subtitle:'暂无'}}</text>
+ </view>
+ </view>
+ <view class="wrap-active-con-item" @click="toPath('/pages/sub_tabbar/active')">
+ <u-image src="/static/images/index/more.png" width="70rpx" height="70rpx"></u-image>
+ <view class="wrap-active-con-item-desc">
+ <text class="wrap-active-con-item-desc-title">更多活动</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ <!-- 市民卡业务 -->
+ <view class="wrap-service">
+ <text class="wrap-service-title">市民卡业务</text>
+ <view class="wrap-service-con">
+ <view class="wrap-service-con-exp" @click="toUrl('/pages/sub_index/introduce/index')">
+ <u-image src="/static/images/index/smkjj.png" width="100%" mode="widthFix"></u-image>
+ <text class="wrap-service-con-exp-desc">市民卡简介</text>
+ </view>
+ <view class="wrap-service-con-box">
+ <view class="wrap-service-con-box-bl">
+ <u-image src="/static/images/index/bl.png" width="100%" mode="widthFix"></u-image>
+ <view class="wrap-service-con-box-bl-over" @click="toPath('/pages/sub_index/getCityCard/index')">
+ <text class="wrap-service-con-box-bl-over-up">办理</text>
+ <text class="wrap-service-con-box-bl-over-dowm">网络快速办理</text>
+ </view>
+ </view>
+ <view class="wrap-service-con-box-bl">
+ <u-image src="/static/images/index/zx.png" width="100%" mode="widthFix"></u-image>
+ <view class="wrap-service-con-box-bl-over" @click="toPath('/pages/sub_index/chat/index')">
+ <text class="wrap-service-con-box-bl-over-up">咨询</text>
+ <text class="wrap-service-con-box-bl-over-dowm">24小时在线咨询</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ </view>
+ <!-- 底部tabbar -->
+ <!-- <u-gap height="70"></u-gap> -->
+ <u-tabbar :list="vuex_tabbar" :mid-button="true" active-color="#2FA8E1" inactive-color="#999999" @change="changeTabbar"></u-tabbar>
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ searchVal: "",
+ funcList: [{
+ title: "物业缴费",
+ src: "/static/images/index/wyjf.png"
+ }, {
+ title: "电费",
+ src: "/static/images/index/df.png"
+ }, {
+ title: "加油卡充值",
+ src: "/static/images/index/jykcz.png"
+ }, {
+ title: "宽带费",
+ src: "/static/images/index/kdf.png"
+ }, {
+ title: "手机缴费",
+ src: "/static/images/index/sjjf.png"
+ }, {
+ title: "固话充值",
+ src: "/static/images/index/ghcz.png"
+ }, {
+ title: "违章查询",
+ src: "/static/images/index/wzcx.png"
+ }, {
+ title: "全部",
+ src: "/static/images/index/all.png"
+ }],
+ activity: [],
+ activeImgList: [{
+ picid: "/static/images/index/bannar01.png",
+ articleno: '00000003'
+ }, ]
+ }
+ },
+ onShow() {
+ this.getActivityList()
+ },
+ methods: {
+ search(e) {
+ uni.showToast({
+ icon: "none",
+ title: "搜索服务功能暂未开通",
+ duration: 1500
+ })
+ },
+
+ scan() {
+ let that = this
+ // #ifndef H5
+ // 只允许通过相机扫码
+ uni.scanCode({
+ // onlyFromCamera: true,
+ // scanType: ['qrCode',"barCode","datamatrix","pdf417"],
+ success: function(res) {
+ //uni.vibrate({})
+ //console.log('条码类型：' + res.scanType);
+ //console.log('条码内容：' + res.result);
+ let url = res.result
+ uni.showToast({
+ title: "扫描成功",
+ icon: "none",
+ duration: 800,
+ complete() {
+ // setTimeout(() => {
+ // uni.navigateTo({
+ // url: "/pages/sub_index/scanView/index?url=" + url
+ // })
+ // }, 1500)
+ let param = {
+ url: url
+ }
+ that.$u.get('/v1/qrcode/auth', param).then(ret => {
+ if (ret.data.permit) {
+ if (ret.data.action == 'water') {
+ setTimeout(() => {
+ uni.navigateTo({
+ url: "/pages/sub_index/scanView/index?url=" + ret.data.url
+ })
+ }, 1500)
+ } else if (ret.data.action == 'dlsmkh5') {
+ // #ifdef APP-PLUS
+ let token = uni.getStorageSync('token')
+ let wv = plus.webview.create(ret.data.url, 'webview_pay', {
+ backButtonAutoControl:'close',
+ additionalHttpHeaders: {
+ Authorization: 'Bearer ' + token
+ }
+ })
+ setTimeout(() => {
+ wv.show()
+ }, 1500)
+ // #endif
+ // #ifndef APP-PLUS
+ uni.showToast({
+ icon: "none",
+ title: "只支持app端",
+ duration: 1500
+ })
+ // #endif
+ }
+ } else {
+ uni.showToast({
+ icon: "none",
+ title: "暂不支持此二维码",
+ duration: 1500
+ })
+ }
+ })
+ }
+ })
+ }
+ });
+ // #endif
+ // #ifdef H5
+ uni.showToast({
+ icon: "none",
+ title: "H5不支持此功能",
+ duration: 1500
+ })
+ // #endif
+ },
+ getActivityList() {
+ let that = this
+ let param = [{
+ code: "PopularActivities", //OnlineActivities、OfflineActivities、PopularActivities
+ pagesize: 1,
+ pageno: 1
+ }]
+ that.$u.post("/i/activity", param).then(res => {
+ if (res.data[0].articles.list.length > 0) {
+ let list = res.data[0].articles.list[0]
+ list.code = 'PopularActivities'
+ that.activity = list
+ }
+ })
+ },
+ activeImg(index) {
+ let that = this
+ let obj = that.activeImgList[index]
+ uni.navigateTo({
+ url: '/pages/sub_index/activeDetails/index?id=' + obj.articleno
+ })
+ },
+ getBannarList() {
+ let that = this
+ that.$u.get('i/column/banner', {}).then(res => {
+ if (res.data.length > 0) {
+ that.activeImgList = res.data
+ //console.log(that.activeImgList)
+ }
+ }).catch(res => {
+ //console.log(1)
+ })
+ },
+ signin() {
+ let that = this
+ that.$u.post('v1/point/task/signin', {}).then(res => {
+ uni.showToast({
+ icon: "none",
+ title: "签到成功",
+ duration: 1500
+ })
+ })
+ }
+ },
+ onLoad() {
+ this.getBannarList()
+ // #ifdef APP-PLUS
+ //引入插件
+ const KJJPush = uni.requireNativePlugin('KJ-JPush');
+ let uid = uni.getStorageSync("uid")
+ //设置Alias
+ KJJPush.setAlias(uid ? uid : 'tourist', 1, result => {
+ //console.log("setAlias:" + JSON.stringify(result));
+ });
+
+ // #endif
+
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ /* #ifdef MP-WEIXIN */
+ .wrap-func {
+ /deep/image {
+ display: block;
+ }
+ }
+
+ /* #endif */
+
+ .status_bar {
+ background-color: #FFFFFF;
+ }
+
+ .wrap {
+ background-color: #FFFFFF;
+
+ &-header {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
+ padding: 10rpx 15rpx;
+ background-color: #FFFFFF;
+
+ image {
+ width: 50rpx;
+ height: 50rpx;
+ }
+
+ .img-box {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 0 15rpx;
+ }
+ }
+
+ &-bannar {
+ width: 100vw;
+ margin-top: 10rpx;
+
+ &-title {
+ width: 300rpx;
+ margin: auto;
+ display: flex;
+ justify-content: space-between;
+ font-size: 35rpx;
+ font-weight: bold;
+ font-style: oblique;
+ font-family: "PingFang-SC-Bold";
+ }
+
+ image {
+ width: 100%;
+ }
+
+ &-box {
+ position: relative;
+
+ &-overtitle {
+ position: absolute;
+ width: 250rpx;
+ background-color: #ECECEC;
+ padding: 10rpx 20rpx;
+ border-radius: 50rpx;
+ top: 20rpx;
+ left: 50%;
+ transform: translate(-50%, 0);
+ display: flex;
+ font-size: 24rpx;
+ justify-content: space-between;
+ color: #808080;
+ letter-spacing: 2rpx;
+ font-family: "PingFang-SC-Medium";
+ }
+ }
+ }
+
+ &-func {
+ width: 95vw;
+ background-color: #FFFFFF;
+ margin: -180rpx auto 0;
+ // display: flex;
+ // flex-wrap: wrap;
+ // justify-content: space-between;
+ // padding: 30rpx 0;
+ border-radius: 10rpx;
+ box-shadow: 0 0rpx 6rpx #808080;
+ position: relative;
+
+ /deep/uni-image {
+ display: block;
+ }
+
+ &-item {
+ width: 25%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin-bottom: 30rpx;
+
+ text {
+ margin-top: 10rpx;
+ color: #333333;
+ font-family: "PingFang-SC-Medium";
+ font-size: 24rpx;
+ }
+ }
+ }
+
+ &-active {
+ margin-top: 30rpx;
+ padding: 0 2.5vw;
+
+ &-title {
+ font-family: "PingFang-SC-Medium";
+ font-size: 30rpx;
+ color: #333333;
+ }
+
+ &-bannar {
+ margin-top: 20rpx;
+ }
+
+ &-con {
+ display: flex;
+ justify-content: space-between;
+ margin-top: 20rpx;
+
+ // align-items: center;
+ &-item {
+ width: 32%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ background-color: #F7F7F7;
+ padding: 50rpx 20rpx 30rpx;
+ border-radius: 10rpx;
+
+ &-desc {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ margin-top: 50rpx;
+ width: 100%;
+ text-align: center;
+
+ &-desc {
+ width: 100%;
+ color: #666666;
+ font-size: 20rpx;
+ margin-top: 10rpx;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+
+ &-title {
+ width: 100%;
+ font-family: "PingFang-SC-Medium";
+ font-size: 26rpx;
+ color: #333333;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ }
+ }
+ }
+ }
+ }
+
+ &-service {
+ margin-top: 30rpx;
+ padding: 0 2.5vw;
+
+ &-title {
+ font-family: "PingFang-SC-Medium";
+ font-size: 30rpx;
+ color: #333333;
+ }
+
+ &-con {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ margin-top: 20rpx;
+
+ &-exp {
+ position: relative;
+ width: 50%;
+
+ &-desc {
+ position: absolute;
+ top: 30rpx;
+ left: 30rpx;
+ font-family: "PingFang-SC-Medium";
+ color: #FFFFFF;
+ font-size: 36rpx;
+ }
+ }
+
+ &-box {
+ width: 49%;
+ display: flex;
+ flex-direction: column;
+
+ &-bl {
+ position: relative;
+ margin-top: -10rpx;
+
+ &-over {
+ display: flex;
+ flex-direction: column;
+ position: absolute;
+ top: 50%;
+ left: 15%;
+ transform: translateY(-50%);
+
+ &-up {
+ font-family: "PingFang-SC-Medium";
+ font-size: 30rpx;
+ }
+
+ &-dowm {
+ font-family: "PingFang-SC-Medium";
+ font-size: 24rpx;
+ color: #999999;
+ }
+ }
+ }
+ }
+ }
+
+ }
+ }
+</style>