Browse Source

修改登录和增加懒加载

master
‘daijinzheng@xingtongworld.com’ 2 years ago
parent
commit
6ee1da29eb
  1. 2
      common/js/api.js
  2. 10
      main.js
  3. 5
      package-lock.json
  4. 3
      package.json
  5. 235
      pages/home/home.vue
  6. 9
      pages/login/login.vue
  7. BIN
      static/home/300.jpg
  8. BIN
      static/home/shibai.png

2
common/js/api.js

@ -1,7 +1,7 @@
// let baseUrl = 'http://192.168.66.221:8000'
let baseUrl = 'http://192.168.66.16:8084'
// baseUrl = 'https://ggl.xingtongworld.com'
baseUrl = 'https://ggl.dingguagua.vip'
// baseUrl = 'https://ggl.dingguagua.vip'
let API = {
baseUrl: baseUrl,

10
main.js

@ -1,10 +1,18 @@
import App from './App'
import i18n from './lang/i18n'
import VueLazyload from 'vue-lazyload'
// 添加插件配置
Vue.use(VueLazyload, {
loading: './static/home/300.jpg', // 图片加载过程中显示的占位图
error: '/static/home/shibai.png', // 图片加载失败时显示的占位图
attempt: 3 // 尝试加载次数
})
// Vue.use(VueLazyload)
// #ifndef VUE3
import Vue from 'vue'
Vue.config.productionTip = false
// Vue.use(VueLazyload)
App.mpType = 'app'
const app = new Vue({
i18n,

5
package-lock.json

@ -16,6 +16,11 @@
"resolved": "https://registry.npmjs.org/qrcodejs2/-/qrcodejs2-0.0.2.tgz",
"integrity": "sha512-+Y4HA+cb6qUzdgvI3KML8GYpMFwB24dFwzMkS/yXq6hwtUGNUnZQdUnksrV1XGMc2mid5ROw5SAuY9XhI3ValA=="
},
"vue-lazyload": {
"version": "1.3.3",
"resolved": "https://registry.npmmirror.com/vue-lazyload/-/vue-lazyload-1.3.3.tgz",
"integrity": "sha512-uHnq0FTEeNmqnbBC2aRKlmtd9LofMZ6Q3mWvgfLa+i9vhxU8fDK+nGs9c1iVT85axSua/AUnMttIq3xPaU9G3A=="
},
"zrender": {
"version": "3.7.3",
"resolved": "https://registry.npmmirror.com/zrender/-/zrender-3.7.3.tgz",

3
package.json

@ -83,6 +83,7 @@
},
"dependencies": {
"echarts": "3.8.4",
"qrcodejs2": "^0.0.2"
"qrcodejs2": "^0.0.2",
"vue-lazyload": "^1.3.3"
}
}

235
pages/home/home.vue

@ -1,136 +1,140 @@
<template>
<view class="homePage">
<view class="nav_area dis-flex-between-center">
<view class="left-btn" v-html="(userType!=='background')?valueType:''"
:class="{'haveIcon':userType!=='background','select':showValueType}" @click="selectType"></view>
<view class="" style="font-size: 18px;color: #101010;" v-html="userType!=='background'?'顶呱刮':'顶呱刮-总平台'"></view>
<view class="right-btn" @click="changeAudio" v-html="userType!=='background'?'音乐':''"
:class="(userType!=='background'&&!isPlay)?'playIcon':(userType!=='background'&&isPlay)?'pauseIcon':''">
<!-- <audio src="../../static/audio/pd-5b7671cee8051387.mp3" poster="" name="" author="" action="" controls></audio> -->
</view>
</view>
<view class="home_1" v-if="userType!=='background'">
<view class="banner_area">
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
<swiper-item v-for="(item, index) in bannerList" :key="index">
<image :src="item.image" mode=""></image>
</swiper-item>
</swiper>
</view>
<view class="notice" @click="toUrl('notice')" v-if="notice.title">
<text class="notice_t">公告</text>
{{notice.title}}
</view>
<view class="dis-flex goods_area new" v-if="showValueType">
<view v-for="(item,index) in goodsList" :key="index" class="type_item">
<view class="" @click="selectValueType(item)">
{{item.title}}
</view>
<template>
<view class="homePage">
<view class="nav_area dis-flex-between-center">
<view class="left-btn" v-html="(userType!=='background')?valueType:''"
:class="{'haveIcon':userType!=='background','select':showValueType}" @click="selectType"></view>
<view class="" style="font-size: 18px;color: #101010;" v-html="userType!=='background'?'顶呱刮':'顶呱刮-总平台'"></view>
<view class="right-btn" @click="changeAudio" v-html="userType!=='background'?'音乐':''"
:class="(userType!=='background'&&!isPlay)?'playIcon':(userType!=='background'&&isPlay)?'pauseIcon':''">
<!-- <audio src="../../static/audio/pd-5b7671cee8051387.mp3" poster="" name="" author="" action="" controls></audio> -->
</view>
</view>
<view class="dis-flex goods_area" v-if="0">
<view v-for="(item,index) in goodsList" :key="index" class="goods_item">
<view class="" @click="selectValueType(item)">
{{item.title}}
</view>
<view class="home_1" v-if="userType!=='background'">
<view class="banner_area">
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
<swiper-item v-for="(item, index) in bannerList" :key="index">
<!-- <image :src="item.image" mode=""></image> -->
<!-- <image v-lazy="item.image" mode=""></image> -->
<img v-lazy="item.image" />
<!-- <img class="lazy" :src="item.image" alt=""> -->
<!-- <img class="lozad" data-src="'@/static/home/300.jpg'"> -->
</swiper-item>
</swiper>
</view>
</view>
<view class="">
<view v-for="(item,index) in typeGoodsList" :key="index" class="dis-flex-between-center goods-item">
<view class="">
<image :src="item.cover_image" mode="aspectFill"></image>
</view>
<view class="goods-info">
<view class="" style="color: #333;font-size: 16px;">{{item.title}}</view>
<view class="">面值{{item.price}}</view>
<view class="">最高中奖金额{{item.max_awards_amount}}</view>
</view>
<view class="goods-btn" @click="toDetailUrl(item)">立即刮奖</view>
<view class="notice" @click="toUrl('notice')" v-if="notice.title">
<text class="notice_t">公告</text>
{{notice.title}}
</view>
</view>
<view class="list_area" v-if="0">
<view class="list_title">中奖记录</view>
<view class="dis-flex-between-center t-h">
<view class="" style="flex: 0.4;">ID</view>
<view class="" style="flex: 0.3;">手机号码</view>
<view class="" style="flex: 0.3;text-align: right;">中奖金额</view>
<view class="dis-flex goods_area new" v-if="showValueType">
<view v-for="(item,index) in goodsList" :key="index" class="type_item">
<view class="" @click="selectValueType(item)">
{{item.title}}
</view>
</view>
</view>
<view v-for="(item,index) in recordsList" :key="index" class="t-d dis-flex-between-center">
<view class="" style="flex: 0.4;">{{item.user_id}}</view>
<view class="" style="flex: 0.3;">{{item.phone}}</view>
<view class="black" style="flex: 0.3;text-align: right;"><text class="red">{{item.awards_amount}}</text></view>
<view class="dis-flex goods_area" v-if="0">
<view v-for="(item,index) in goodsList" :key="index" class="goods_item">
<view class="" @click="selectValueType(item)">
{{item.title}}
</view>
</view>
</view>
</view>
</view>
<view class="home_2" v-if="userType=='background'">
<view class="">
<view class="title">
待办<text style="color: #999;font-size: 12px;">更新于{{needInfo.update_time}}</text>
<view class="">
<view v-for="(item,index) in typeGoodsList" :key="index" class="dis-flex-between-center goods-item ">
<view class="">
<!-- <image :src="item.cover_image" mode="aspectFill"></image> -->
<img v-lazy="item.cover_image" />
</view>
<view class="goods-info">
<view class="skeleton-rect" style="color: #333;font-size: 16px;">{{item.title}}</view>
<view class="">面值{{item.price}}</view>
<view class="">最高中奖金额{{item.max_awards_amount}}</view>
</view>
<view class="goods-btn" @click="toDetailUrl(item)">立即刮奖</view>
</view>
</view>
<view class="card">
<view class="">{{needInfo.down_scores_quota.title}}</view>
<view class="t2">{{needInfo.down_scores_quota.quota}}</view>
<view class="list_area" v-if="0">
<view class="list_title">中奖记录</view>
<view class="dis-flex-between-center t-h">
<view class="" style="flex: 0.4;">ID</view>
<view class="" style="flex: 0.3;">手机号码</view>
<view class="" style="flex: 0.3;text-align: right;">中奖金额</view>
</view>
<view v-for="(item,index) in recordsList" :key="index" class="t-d dis-flex-between-center">
<view class="" style="flex: 0.4;">{{item.user_id}}</view>
<view class="" style="flex: 0.3;">{{item.phone}}</view>
<view class="black" style="flex: 0.3;text-align: right;"><text class="red">{{item.awards_amount}}</text></view>
</view>
</view>
</view>
<view class="">
<view class="title">
用户统计
<view class="home_2" v-if="userType=='background'">
<view class="">
<view class="title">
待办<text style="color: #999;font-size: 12px;">更新于{{needInfo.update_time}}</text>
</view>
<view class="card">
<view class="">{{needInfo.down_scores_quota.title}}</view>
<view class="t2">{{needInfo.down_scores_quota.quota}}</view>
</view>
</view>
<view class="pie_area">
<!-- #ifdef H5 -->
<view class="pie_box" id="piechart"></view>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="pie_box" ref="piechart"></view>
<!-- #endif -->
<view class="sum">
{{userStatistics.sum.num}}
<view class="">
<view class="title">
用户统计
</view>
<view class="right">
<view class="right1">
<view class="">
<view class="label" style="font-size: 12px;">代理人数</view>
<view class="" style="font-weight: bold;padding-left: 20px;">{{userStatistics.agent.num}}</view>
</view>
<view class="" style="font-weight: bold;">{{userStatistics.agent.rate}}</view>
<view class="pie_area">
<!-- #ifdef H5 -->
<view class="pie_box" id="piechart"></view>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="pie_box" ref="piechart"></view>
<!-- #endif -->
<view class="sum">
{{userStatistics.sum.num}}
</view>
<view class="right1">
<view class="">
<view class="label" style="font-size: 12px;">用户人数</view>
<view class="" style="font-weight: bold;padding-left: 20px;">{{userStatistics.user.num}}</view>
<view class="right">
<view class="right1">
<view class="">
<view class="label" style="font-size: 12px;">代理人数</view>
<view class="" style="font-weight: bold;padding-left: 20px;">{{userStatistics.agent.num}}</view>
</view>
<view class="" style="font-weight: bold;">{{userStatistics.agent.rate}}</view>
</view>
<view class="right1">
<view class="">
<view class="label" style="font-size: 12px;">用户人数</view>
<view class="" style="font-weight: bold;padding-left: 20px;">{{userStatistics.user.num}}</view>
</view>
<view class="" style="font-weight: bold;">{{userStatistics.user.rate}}</view>
</view>
<view class="" style="font-weight: bold;">{{userStatistics.user.rate}}</view>
</view>
</view>
</view>
</view>
<view class="">
<view class="title">
上下分数据
</view>
<view class="chart_tab">
<view class="item" @click="changeChartIndex(1)" :class="chartIndex==1?'active':''">上分统计</view>
<view class="item" @click="changeChartIndex(2)" :class="chartIndex==2?'active':''">下分数据</view>
</view>
<view class="chart_area">
<view class="chart">
<view class="" style="color: #999;font-size: 14px;">
{{ chartIndex==1?'上分总数':'下分总数' }}<text style="color: #101010;">{{ UpDownSta.sum_value }}</text>
</view>
<!-- #ifdef H5 -->
<view class="" id="mychart" style="width: 670rpx;height: 250px;"></view>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="" ref="mychart" style="width: 670rpx;height: 250px;">
<echarts1 :option="optionData" id="myChart1" style="height: 110vw;margin-left: 2vw;width: 100%;padding: 4vw 0 0 0;"></echarts1>
<view class="">
<view class="title">
上下分数据
</view>
<view class="chart_tab">
<view class="item" @click="changeChartIndex(1)" :class="chartIndex==1?'active':''">上分统计</view>
<view class="item" @click="changeChartIndex(2)" :class="chartIndex==2?'active':''">下分数据</view>
</view>
<view class="chart_area">
<view class="chart">
<view class="" style="color: #999;font-size: 14px;">
{{ chartIndex==1?'上分总数':'下分总数' }}<text style="color: #101010;">{{ UpDownSta.sum_value }}</text>
</view>
<!-- #ifdef H5 -->
<view class="" id="mychart" style="width: 670rpx;height: 250px;"></view>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="" ref="mychart" style="width: 670rpx;height: 250px;">
<echarts1 :option="optionData" id="myChart1" style="height: 110vw;margin-left: 2vw;width: 100%;padding: 4vw 0 0 0;"></echarts1>
</view>
<!-- #endif -->
</view>
<!-- #endif -->
</view>
</view>
</view>
</view>
</view>
</template>
<script>
@ -254,6 +258,7 @@
]
},
// 1#endif
showSkeleton: true
}
},
components: {
@ -714,6 +719,7 @@
overflow: hidden;
}
}
.notice{
color: #f00;
font-size: 14px;line-height: 14px;margin-bottom: 30rpx;
@ -775,6 +781,11 @@
height: 88px;
border-radius: 10px;
}
img{
width: 138px;
height: 88px;
border-radius: 10px;
}
.goods-info{
display: flex;
flex-direction: column;

9
pages/login/login.vue

@ -1,6 +1,6 @@
<!-- 账号密码登录页 -->
<template>
<view class="" style="">
<view class="" style="position: relative;">
<view class="nav_area"></view>
<view class="logo_area">
<image src="../../static/home/logo.png" mode=""></image>
@ -39,11 +39,16 @@
<!-- <text class="link" @click="toRegister" v-if="!config.isAdmin">注册账号</text> -->
</view>
</view>
<view v-if="this.userType=='user'"
<!-- <view v-if="this.userType=='user'"
style="width: 100vw;text-align: center;color: #dcdcdc;font-size: 14px;
line-height: 28px;position: fixed;top: calc(100vh - 100px);left:0px;">
温馨提示<br/>
忘记密码请联系平台
</view> -->
<view v-if="this.userType=='user'"
style="width: 100vw;text-align: center;color: #dcdcdc;font-size: 14px; line-height: 28px;position: absolute;bottom: -34vh;">
温馨提示<br/>
忘记密码请联系平台
</view>
</view>
</template>

BIN
static/home/300.jpg

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

BIN
static/home/shibai.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 23 KiB

Loading…
Cancel
Save