<template>
<view class="index-content" :style="{'--status-bar-': statusBarHeight}">
<view class="index-content-info">
<!-- 头部主要内容 开始 -->
<view class="index-content-header">
<customNavbar
title="全民分享"
bgColor="rgba(0,0,0,0)"
:is-left="false"
:customNavbarInfo='{}'>
<view slot="right">
<image @click="getRetailQrcode()" style="width: 44rpx;height: 44rpx;" :src="fengxiang" mode=""></image>
</view>
</customNavbar>
<u-search
@clickIcon="navigateToFun('/pages/index/search')"
@custom="navigateToFun('/pages/index/search')"
@focus="navigateToFun('/pages/index/search')"
:showAction="true"
bgColor="#fff"
actionText="搜索">
</u-search>
</view>
<!-- 头部主要内容 结束 -->
<!-- 列表主要内容 开始 -->
<view class="index-content-list">
<customScrollList
ref="customScrollList"
@load="load"
@paging="paging"
@refresh="refresh"
>
<view class="index-content-list-info" v-if="retailIndex.length>0">
<text class="index-content-list-class">剧目</text>
<view
class="index-content-list-item"
v-for="(item,index) in retailIndex"
:key="index">
<view class="index-content-list-content">
<image
class="index-content-list-image"
:src="item.showImg" mode="scaleToFill"></image>
<view class="index-content-list-tool">
<text class="index-content-list-title">{{ item.name }}</text>
<text
class="index-content-list-but"
@click="navigateToFun('/pages/publicSharingDetails/index',{ performId: item.id})"
>查看</text>
</view>
</view>
</view>
</view>
</customScrollList>
</view>
<!-- 列表主要内容 结束 -->
</view>
<!-- 我的分享码 -->
<customPromotionCode ref="customPromotionCode" />
<!-- 入网认证 -->
<u-modal
:show="show"
:title="title1"
:content='content'
cancelText='取消'
:confirmText='confirmText'
showCancelButton
confirmColor='#ED0000'
@confirm='networkConfirm'
@cancel='networkCancel'
@close='networkCancel'
></u-modal>
</view>
</template>
<script>
import {
navigateTo
} from "@/utils/util.js"
export default {
data() {
return {
title: '全民分享',
loading: false,
statusBarHeight: 0, // 状态栏安全距离
retailIndex: [], // 剧目列表
fengxiang: this.$commonConfig.staticUrl+'index/fengxiang.png',
// 入网认证
isShowQrcode: -1, // 是否展示 推广码
show: false,
title1:'入网提示',
content:'你还未进行银联支付入网签约认证，请先完成签约认证!',
confirmText: '去认证',
}
},
onLoad() {
},
onShow() {
this.statusBarHeight = getApp().globalData.statusBarHeight
//this.load()
},
methods: {
async load(paging){
console.log("上拉 加载数据")
try{
let res = await this.$u.api.retailIndex({
"page": paging.page,
"pages": paging.size,
})
if(res && res.code ===200) {
if(res.data.performList){
this.retailIndex = this.retailIndex.concat(res.data.performList)
}else {
this.retailIndex = []
}
this.$refs.customScrollList.loadSuccess({
list: this.retailIndex,
total: this.retailIndex.length
})
} else {
this.$refs.customScrollList.loadSuccess({
list: [],
total: 0
})
}
}catch(e){
//TODO handle the exception
console.error("e===",e)
this.$refs.customScrollList.loadSuccess({
list: [],
total: 0
})
}
},
paging(){
console.log("下拉 加载数据")
},
/**
* 下拉触底
*/
async refresh(paging){
console.log("上拉 加载数据",this.retailIndex)
//this.$refs.customScrollList.showEmpty = true
try{
//this.$refs.customScrollList.showPullUp = true
let res = await this.$u.api.retailIndex({
pageNum: paging.page,
pageSize: paging.size
})
if(res && res.code ===200) {
if(res.data.performList){
this.retailIndex = [].concat(res.data.performList)
}else {
this.retailIndex = []
}
// this.retailIndex = null
this.$refs.customScrollList.refreshSuccess({
list: this.retailIndex,
total: this.retailIndex.length
})
} else {
this.$refs.customScrollList.refreshSuccess({
list: [],
total: 0
})
}
}catch(e){
//TODO handle the exception
console.error("e===",e)
this.$refs.customScrollList.refreshSuccess({
list: [],
total: 0
})
}
},
/**
* @author ygh
* @data 2023-12-20
*/
navigateToFun(url,data={}) {
console.log("dsffd",data)
navigateTo(url,data)
},
/**
* 我的推广码
*/
async getRetailQrcode(){
try{
await this.getUserInfo()
if(this.isShowQrcode != 1) {
if(this.isShowQrcode == 0) {
this.content = '你还未进行银联支付入网签约认证，请先完成签约认证!'
this.confirmText = '去认证'
}else if(this.isShowQrcode == 2) {
this.content = '银联支付入网签约认证中，请耐心等待!'
this.confirmText = '去查看'
}else if(this.isShowQrcode == 3) {
this.content = '银联支付入网签约认证失败，请重新认证!'
this.confirmText = '重新认证'
}
this.show = true
}else {
let res = await this.$u.api.getRetailQrcode({
noSign: 1,
userid: this.distribution_user_info.userId
})
if(res && res.code ===200) {
this.$refs.customPromotionCode.initData(res.data)
// #ifdef H5
//window.history.pushState(null, null, document.URL)
// #endif
}
}
}catch(e){
//TODO handle the exception
console.error("e===",e)
}
},
/** 入网认证 */
networkConfirm() {
this.show = false
this.navigateToFun('/pages/networkAuth/index')
//this.getUnionAccessUrlFun()
},
networkCancel() {
this.show = false
},
/**
* 获取用户信息
*/
async getUserInfo() {
try{
let res = await this.$u.api.getInfo({
noSign: 1,
userid: this.distribution_user_info.userId
})
if(res && res.code ===200) {
this.isShowQrcode = res.data.unionFlag
}
}catch(e){
//TODO handle the exception
console.error("e===",e)
this.isShowQrcode = -1
}
},
/** 银联签约入网地址 */
async getUnionAccessUrlFun(){
try{
let res = await this.$u.api.getUnionAccessUrl({
userid: this.distribution_user_info.userId
})
if(res && res.code ===200) {
this.show = false
location.href = res.data.jumpUrl
} else {
this.show = true
}
}catch(e){
//TODO handle the exception
this.show = true
console.error("e===",e)
}
}
}
}
</script>
<style lang="scss" scoped>
.index-content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
--header-h: 170rpx;
// background-color:
.index-content-info {
width: 100%;
box-sizing: border-box;
}
}
/** 头部主要内容 开始 */
.index-content-header {
width: 100%;
height: var(--header-h);
box-sizing: border-box;
background-color: var(--gd-bgm-color);
::v-deep .u-search {
padding: 0 30rpx !important;
}
::v-deep .u-search__action {
color: #fff !important;
}
}
/** 头部主要内容 结束 **/
/** 列表主要内容 开始 */
.index-content-list {
width: 100%;
height: calc( 100% - var(--header-h) - var(--status-bar-h) );
}
.index-content-list-info {
width: 100%;
box-sizing: border-box;
padding: 32rpx 32rpx 150rpx;
.index-content-list-class {
font-size: 32rpx;
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: bold;
color: #2D2D2D;
}
.index-content-list-item {
width: 100%;
box-sizing: border-box;
background: #FFFFFF;
box-shadow: 0rpx 2rpx 20rpx 0rpx rgba(200,200,200,0.5);
border-radius: 24rpx;
overflow: hidden;
margin-top: 40rpx;
.index-content-list-content {
width: 100%;
box-sizing: border-box;
.index-content-list-image {
width: 100%;
height: 242rpx;
}
.index-content-list-tool {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
padding:42rpx 28rpx 46rpx;
box-sizing: border-box;
.index-content-list-title {
font-size: 28rpx;
font-family: SourceHanSansCN, SourceHanSansCN;
font-weight: bold;
color: #363636;
}
.index-content-list-but {
width: 160rpx;
height: 51rpx;
background: #ED0000;
border-radius: 24rpx;
font-size: 20rpx;
font-family: PingFangSC, PingFang SC;
font-weight: 400;
color: #FFFFFF;
display: flex;
justify-content: center;
align-items: center;
}
}
}
}
}
/** 列表主要内容 结束 **/
</style>