Skip to content

Harvey / ydu-lottery-shop-app

转到一个项目
切换导航栏
切换导航栏固定状态
Commit 741f082a 由 Harvey
选项

调整tv 走势ui

1 个父辈 e7af3121
内嵌 并排
正在显示 4 个修改的文件 包含 104 行增加 和 55 行删除
src/pages.json
......@@ -32,9 +32,9 @@
"aliasPath": "/tv/info",
"name": "tv_info",
"style": {
"navigationStyle": "default"
"navigationStyle": "default"
}
},{
}, {
"path": "pages/auth/login",
"aliasPath": "/login",
"name": "login",
......@@ -69,4 +69,4 @@
"text": "我的"
}]
}
}
}
src/pages/tv/info.vue
......@@ -13,7 +13,7 @@
data() {
return {
title: '快乐8 横屏走势图',
mode: 'scaleToFill' || 'top' || 'aspectFit',
mode: 'widthFix',
text: '快乐8 横屏走势图',
src: 'https://img2.ydniu.com/app/cd/202204122204/%E5%BF%AB%E4%B9%908%E5%9F%BA%E6%9C%AC%E8%B5%B0%E5%8A%BF%E5%9B%BE.png'
}
......@@ -64,6 +64,5 @@
.page-content image {
width: 90vw;
height: 180vh;
}
</style>
src/pages/tv/list.vue
<template>
<view>
<view class="top-nav">
<button v-for="(item,i) in nav" :data-v="i" @click="navChange" :key="i">{{item}}</button>
<button class="top-nav-btn" :class="{'top-nav-btn-on':sub_module_id == item.value}" v-for="(item,i) in nav" :data-v="item.value"
@click="navChange" :key="i">{{item.text}}</button>
</view>
<view class="content">
<view v-for="(item,index) in list" class="msg-info" :key="index">
<image :mode="mode||item.mode" lazy-load="true" :src="item.src+'/small'" @click="imgClick(index)"></image>
<!-- <view v-for="(item,index) in list" class="msg-info" :key="index">
<image :mode="mode||item.mode" lazy-load="true" :src="item.src+'/small'" @click="imgClick(index)">
</image>
<view class="tip">{{item.text}}</view>
</view>
<!-- <view class='left'>
<view v-for="(item,index) in list" class="msg-info">
<image :mode="mode||item.mode" :src="src||item.src" @error="imageError"></image>
<view class="tip">{{text||item.text}}</view>
</view> -->
<view class='left'>
<view v-for="(item,index) in leftData" class="msg-info" :key="index">
<image :mode="mode" lazy-load="true" :src="item.src" @click="imgClick(item)"></image>
<view class="tip">{{item.text}}</view>
</view>
</view>
<view class="right">
<view v-for="(item,index) in list" class="msg-info">
<image :mode="mode||item.mode" :src="src||item.src" @error="imageError">
<view class="tip">{{text||item.text}}</view>
</image>
<view v-for="(item,index) in rightData" class="msg-info" :key="index">
<image :mode="mode" :src="item.src" @click="imgClick(item)"></image>
<view class="tip">{{item.text}}</view>
</view>
</view> -->
</view>
</view>
</view>
......@@ -31,45 +31,83 @@
export default {
data() {
return {
nav: ['全部', '双色球', '大乐透', '快乐8', '福彩3d', '排列3', '排列5', '七星彩'],
nav: [{
text: '全部',
value: 0
}, {
text: '双色球',
value: 11
}, {
text: '大乐透',
value: 12
}, {
text: '快乐8',
value: 13
}, {
text: '福彩3d',
value: 14
}, {
text: '排列3',
value: 15
}, {
text: '排列5',
value: 16
}, {
text: '七星彩',
value: 18
}],
list: [],
mode: 'aspectFill'
leftData: [],
rightData: [],
mode: 'widthFix',
sub_module_id: 0
}
},
async onLoad() {
const res = await uni.$u.request.post({
data: {
query: `query{lottery_shop_get_posters(module_id:0)}`
}
})
var data = res.data.data['lottery_shop_get_posters'].map(a => ({
text: a.title,
src: a.main_image_url,
mid: a.module_id,
id: a.id
}))
this.list = data;
this.bindData()
},
methods: {
async bindData() {
const res = await uni.$u.request.post({
data: {
query: `query{lottery_shop_get_posters(module_id:4,sub_module_id:${this.sub_module_id})}`
}
})
var data = []
var resData = res.data.data['lottery_shop_get_posters'].map(a => ({
text: a.title,
src: a.main_image_url,
mid: a.module_id,
id: a.id
}))
if (resData.length < 2) return
var leftData = []
var rightData = []
for (var i = 1, k = 0; i < resData.length; i += 2, k++) {
if (k % 2 == 1) {
leftData.push(resData[i])
rightData.push(resData[i - 1])
} else {
leftData.push(resData[i - 1])
rightData.push(resData[i])
}
}
this.leftData = leftData
this.rightData = rightData
},
navChange(e) {
console.log(e.target.dataset.v)
var sid = e.target.dataset.v
if (this.sub_module_id == sid) return
this.sub_module_id=sid
this.bindData()
},
imgClick(index) {
const img=this.list[index]
imgClick(img) {
window.location.href = `/tv/info?text=${img.text}&src=${img.src}&zq=zq`
// uni.setStorage({
// key: 'tv_list_selected_img',
// data: this.list[index]
// })
// uni.navigateTo({
// url: '/tv/info?zq=zq',
// });
}
}
}
......@@ -82,7 +120,7 @@
flex-wrap: wrap;
}
.top-nav button {
.top-nav-btn {
margin-top: 8px;
width: 20vw;
height: 30px;
......@@ -93,18 +131,30 @@
font-weight: normal;
}
.top-nav-btn-on {
background-color: #E09E0B;
color: #FFFFFF;
}
.content {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
margin-top: 10px;
justify-content: space-around;
padding: 20px 8px 30vh 8px;
}
.left,
.right {
width: 46vw;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.content .msg-info {
position: relative !important;
margin-top: 5px;
width: 49vw;
width: 100%;
}
.content image {
......@@ -127,6 +177,5 @@
overflow: hidden;
font-size: 16px;
}
</style>
src/static/js/h5-utils.js
......@@ -5,7 +5,8 @@ export function go_android_login() {
}
export function head_tv(url) {
$("body").css("margin-top","25px")
$("body").css({"margin-top":"25px","overflow":"hidden","background-color":"#F8F8F8"})
$("uni-app").css({"overflow":"auto"})
$(".uni-page-head").eq(0).append(`<div onclick="Android.access2Tv('${url}')" style='font-size:12px;padding:0 5px;margin-right: 8px;height:24px;line-height:24px;margin-top: 3px;background-color: #007AFF;color:#FFFFFF;border-radius:5px;'>TV 投屏</div>`)
$(".uni-page-head-hd").click(function(){
Android.webGoBack("")
......
支持 Markdown 格式
你添加了 0 人 到此讨论。请谨慎行事。
Finish editing this message first!