forked from lsl/xzjl-ui
parent
2c84bdb967
commit
562bf3a979
@ -1,40 +0,0 @@
|
||||
|
||||
Component({
|
||||
relations: {
|
||||
'./popover': {
|
||||
type: 'parent'
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 组件的属性列表
|
||||
*/
|
||||
properties: {
|
||||
// 是否有底线
|
||||
hasline: {
|
||||
type: Boolean,
|
||||
value: false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 组件的初始数据
|
||||
*/
|
||||
data: {
|
||||
// 每项的高度
|
||||
height: 40
|
||||
},
|
||||
|
||||
/**
|
||||
* 组件的方法列表
|
||||
*/
|
||||
methods: {
|
||||
onClick: function() {
|
||||
let { index } = this.properties;
|
||||
let eventDetail = {
|
||||
index: index
|
||||
};
|
||||
let eventOption = {};
|
||||
this.triggerEvent('tap', eventDetail, eventOption);
|
||||
}
|
||||
}
|
||||
})
|
||||
@ -1,4 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
<view class='popover-item {{hasline ? "underline" : ""}}' hover-class='popover-item-hover' catchtap='onClick' style='height:{{height}}px;line-height:{{height}}px;'>
|
||||
<slot/>
|
||||
</view>
|
||||
@ -1,14 +0,0 @@
|
||||
.popover-item {
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.popover-item-hover {
|
||||
background-color: #EEE;
|
||||
}
|
||||
.underline{
|
||||
border-bottom:1px #EEE solid;
|
||||
}
|
||||
@ -1,99 +0,0 @@
|
||||
const { windowWidth, windowHeight } = wx.getSystemInfoSync();
|
||||
|
||||
// 三角形箭头的高度
|
||||
const trangleHeight = 12;
|
||||
|
||||
Component({
|
||||
relations: {
|
||||
'./popover-item': {
|
||||
type: 'child'
|
||||
}
|
||||
},
|
||||
|
||||
data: {
|
||||
// 当前显隐状态
|
||||
visible: false,
|
||||
// popover 宽
|
||||
pw: 100,
|
||||
// popover 高
|
||||
ph: 120,
|
||||
// popover 距左距离
|
||||
px: 0,
|
||||
// popover 距上距离
|
||||
py: 0,
|
||||
// 垂直方向 top/bottom
|
||||
vertical: '',
|
||||
// 水平方向 left/center/right
|
||||
align: ''
|
||||
},
|
||||
|
||||
methods: {
|
||||
onDisplay: function(e) {
|
||||
let self = this;
|
||||
|
||||
if (self.last && self.last === e.id) {
|
||||
self.setData({
|
||||
visible: !self.data.visible
|
||||
});
|
||||
} else {
|
||||
wx.createSelectorQuery().selectViewport().scrollOffset(view => {
|
||||
let { pw, ph, px, py, vertical, align } = self.data;
|
||||
|
||||
let pOverW = (pw - e.width) / 2;
|
||||
|
||||
let offsetL = e.left,
|
||||
offsetR = windowWidth - e.right,
|
||||
offsetB = windowHeight - e.bottom;
|
||||
|
||||
if (offsetL >= pOverW && offsetR >= pOverW) {
|
||||
align = 'center';
|
||||
px = e.left - pOverW;
|
||||
} else if (offsetL > pOverW && offsetR < pOverW) {
|
||||
align = 'left';
|
||||
px = windowWidth - (offsetR + pw);
|
||||
// 如果向右贴边了，设置一点距离
|
||||
if ((windowWidth - pw) == px) px -= 5;
|
||||
} else if (offsetL < pOverW && offsetR > pOverW) {
|
||||
align = 'right';
|
||||
px = e.left;
|
||||
// 如果向左贴边了，设置一点距离
|
||||
if (px == 0) px += 5;
|
||||
}
|
||||
|
||||
if (offsetB >= (ph + trangleHeight)) {
|
||||
vertical = 'bottom';
|
||||
py = view.scrollTop + e.bottom + trangleHeight;
|
||||
} else {
|
||||
vertical = 'top';
|
||||
py = view.scrollTop + e.top - ph - trangleHeight;
|
||||
}
|
||||
|
||||
self.setData({
|
||||
visible: true,
|
||||
px: px,
|
||||
py: py,
|
||||
ph: self.getItemsHeight(),
|
||||
vertical: vertical,
|
||||
align: align
|
||||
});
|
||||
}).exec();
|
||||
}
|
||||
// 记录上一次点击的元素
|
||||
self.last = e.id;
|
||||
},
|
||||
onHide: function() {
|
||||
this.setData({
|
||||
visible: false
|
||||
});
|
||||
},
|
||||
// 获取所有子元素
|
||||
getItems: function() {
|
||||
return this.getRelationNodes('./popover-item');
|
||||
},
|
||||
// 获取所有子元素的总高度
|
||||
getItemsHeight() {
|
||||
return this.getItems().map(item => item.data.height).reduce((a, b) => a + b, 0);
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
@ -1,4 +0,0 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,6 +0,0 @@
|
||||
<view
|
||||
wx:if='{{visible}}'
|
||||
class='popover-view {{vertical}} {{align}}'
|
||||
style='width:{{pw}}px;height:{{ph}}px;left:{{px}}px;top:{{py}}px;'>
|
||||
<slot />
|
||||
</view>
|
||||
@ -1,40 +0,0 @@
|
||||
.popover-view {
|
||||
position: absolute;
|
||||
background-color: white;
|
||||
box-shadow: 0 0 2px 2px #ddd;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
/* 实现三角形 */
|
||||
.popover-view::before {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 0;
|
||||
height: 0px;
|
||||
content: '';
|
||||
border-style: solid;
|
||||
border-width: 6px;
|
||||
border-color: #fff #fff transparent transparent;
|
||||
box-shadow: 2px -2px 2px #ddd;
|
||||
}
|
||||
/* 上 */
|
||||
.popover-view.top::before {
|
||||
bottom: -6px;
|
||||
transform: rotate(135deg);
|
||||
}
|
||||
/* 下 */
|
||||
.popover-view.bottom::before {
|
||||
top: -6px;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
/* 左 */
|
||||
.popover-view.left::before {
|
||||
right: 20px;
|
||||
}
|
||||
/* 中 */
|
||||
.popover-view.center::before {
|
||||
left: 47px;
|
||||
}
|
||||
/* 右 */
|
||||
.popover-view.right::before {
|
||||
left: 20px;
|
||||
}
|
||||
@ -1,66 +0,0 @@
|
||||
// pages/home/jl/jlai.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
}
|
||||
})
|
||||
@ -1,3 +0,0 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,2 +0,0 @@
|
||||
<!--pages/home/jl/jlai.wxml-->
|
||||
<text>pages/home/jl/jlai.wxml</text>
|
||||
@ -1 +0,0 @@
|
||||
/* pages/home/jl/jlai.wxss */
|
||||
@ -1,5 +0,0 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"t-toast": "tdesign-miniprogram/toast/toast"
|
||||
}
|
||||
}
|
||||
@ -1,26 +0,0 @@
|
||||
<!--返回图标-->
|
||||
<view class="reback" bindtap="go2Reback"></view>
|
||||
<view class="title">VIP会员</view>
|
||||
<view class="sftp"></view><!--上方图片-->
|
||||
<!--底部图片-->
|
||||
<view class="hybt"></view>
|
||||
<view class="hgpng"></view><!--皇冠图标-->
|
||||
<view class="question" bindtap="tQuest"></view><!--问号图标-->
|
||||
|
||||
<t-toast id="t-toast" /><!--弹出问号图标-->
|
||||
<view class="hybtn" bindtap="doKtHy">开通会员</view>
|
||||
<view class="viphyqy">VIP会员权益</view>
|
||||
<view class="introd">
|
||||
<view>1、星座精灵AI服务无限次畅聊</view>
|
||||
<view>2、不定期商品及新品折扣优惠</view>
|
||||
<view>3、 其他权益陆续增加中......</view>
|
||||
</view>
|
||||
<view class="zhytxt">周会员</view>
|
||||
<view class="yhytxt">月会员</view>
|
||||
<view class="hydqr">您的会员将于 2023年5月20日到期</view>
|
||||
|
||||
<view class="week1" wx:if="{{yhy}}" bindtap="go2Week"><text class="text1 tcolor1">￥29</text><text class="text2 tcolor1"> / 周</text></view>
|
||||
<view class="month1" wx:if="{{yhy}}" bindtap="go2Month"><text class="text1 tcolor2">￥69</text><text class="text2 tcolor2"> / 月</text></view>
|
||||
|
||||
<view class="week2" wx:if="{{!yhy}}" bindtap="go2Week"><text class="text1 tcolor2">￥29</text><text class="text2 tcolor2"> / 周</text></view>
|
||||
<view class="month2" wx:if="{{!yhy}}" bindtap="go2Month"><text class="text1 tcolor1">￥69</text><text class="text2 tcolor1"> / 月</text></view>
|
||||
@ -1,232 +0,0 @@
|
||||
.reback{
|
||||
position: absolute;
|
||||
margin-left: 20rpx;
|
||||
margin-top:108rpx;
|
||||
width:48rpx;
|
||||
height:48rpx;
|
||||
background-repeat: no-repeat;
|
||||
background-size:100% 100%;
|
||||
background-image: url(https://wish-assets.windymuse.com.cn/xy/reback.png);
|
||||
}
|
||||
|
||||
.title{
|
||||
position: absolute;
|
||||
left: 278rpx;
|
||||
top: 108rpx;
|
||||
width: 196rpx;
|
||||
height: 48rpx;
|
||||
color: rgba(108, 108, 108, 1);
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.hybt{
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 1326rpx;
|
||||
width: 690rpx;
|
||||
height: 230rpx;
|
||||
background-repeat: no-repeat;
|
||||
background-size:100% 100%;
|
||||
background-image: url(https://wish-assets.windymuse.com.cn/xy/hybt.png);
|
||||
}
|
||||
|
||||
.sftp{
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
top: 82px;
|
||||
width: 345px;
|
||||
height: 115px;
|
||||
background-repeat: no-repeat;
|
||||
background-size:100% 100%;
|
||||
background-image: url(https://wish-assets.windymuse.com.cn/xy/sftp.png);
|
||||
}
|
||||
|
||||
.hgpng{
|
||||
position: absolute;
|
||||
left: 109px;
|
||||
top: 124px;
|
||||
width: 157px;
|
||||
height: 174px;
|
||||
background-repeat: no-repeat;
|
||||
background-size:100% 100%;
|
||||
background-image: url(https://wish-assets.windymuse.com.cn/xy/hgpng.png);
|
||||
}
|
||||
|
||||
.question{
|
||||
position: absolute;
|
||||
left: 236px;
|
||||
top: 124px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-image: url(https://wish-assets.windymuse.com.cn/xy/qqest.png);
|
||||
}
|
||||
.hybtn{
|
||||
position: absolute;
|
||||
left: 118px;
|
||||
top: 645px;
|
||||
width: 140px;
|
||||
height: 40px;
|
||||
line-height: 80rpx;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(233.49deg, rgba(248,99,42,1) 10.48%,rgba(249,135,89,1) 89.2%);
|
||||
text-align: center;
|
||||
box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
|
||||
border: 3px solid rgba(255, 255, 255, 1);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-medium;
|
||||
}
|
||||
|
||||
.viphyqy{
|
||||
position: absolute;
|
||||
top: 502px;
|
||||
width: 750rpx;
|
||||
height: 20px;
|
||||
color: rgba(108, 108, 108, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.introd{
|
||||
left:180rpx;
|
||||
position: absolute;
|
||||
top: 538px;
|
||||
width: 750rpx;
|
||||
height: 75px;
|
||||
line-height: 50rpx;
|
||||
color: rgba(108, 108, 108, 1);
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.zhytxt{
|
||||
position: absolute;
|
||||
left: 82px;
|
||||
top: 442px;
|
||||
width: 42px;
|
||||
height: 21px;
|
||||
color: rgba(154, 154, 154, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.yhytxt{
|
||||
position: absolute;
|
||||
left: 506rpx;
|
||||
top: 442px;
|
||||
width: 42px;
|
||||
height: 21px;
|
||||
color: rgba(154, 154, 154, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.hydqr{
|
||||
position: absolute;
|
||||
top: 314px;
|
||||
width: 750rpx;
|
||||
height: 20px;
|
||||
color: rgba(248, 99, 42, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.week1{
|
||||
position: absolute;
|
||||
left: 32px;
|
||||
top: 374px;
|
||||
width: 140px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-radius: 15px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: Arial;
|
||||
border: 2px solid rgba(248, 99, 42, 1);
|
||||
}
|
||||
|
||||
.month1{
|
||||
position: absolute;
|
||||
left: 203px;
|
||||
top: 374px;
|
||||
width: 140px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-radius: 15px;
|
||||
background-color: rgba(248, 99, 42, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: Arial;
|
||||
border: 1px solid rgba(248, 99, 42, 1);
|
||||
}
|
||||
|
||||
.text1{
|
||||
margin-left: 2px;
|
||||
top: 384px;
|
||||
width: 60px;
|
||||
height: 41px;
|
||||
font-size: 28px;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.text2{
|
||||
left: 130px;
|
||||
top: 401px;
|
||||
width: 16px;
|
||||
height: 17px;
|
||||
font-size: 16px;
|
||||
text-align: left;
|
||||
font-family: SourceHanSansSC-regular;
|
||||
}
|
||||
|
||||
.tcolor1{
|
||||
color: rgba(79, 79, 79, 1);
|
||||
}
|
||||
|
||||
.tcolor2{
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.week2{
|
||||
position: absolute;
|
||||
left: 32px;
|
||||
top: 374px;
|
||||
width: 140px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-radius: 15px;
|
||||
background-color: rgba(248, 99, 42, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: Arial;
|
||||
border: 1px solid rgba(248, 99, 42, 1);
|
||||
}
|
||||
|
||||
.month2{
|
||||
|
||||
position: absolute;
|
||||
left: 203px;
|
||||
top: 374px;
|
||||
width: 140px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-radius: 15px;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(16, 16, 16, 1);
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
font-family: Arial;
|
||||
border: 2px solid rgba(248, 99, 42, 1);
|
||||
}
|
||||
@ -1,66 +0,0 @@
|
||||
// pages/home/xx/lindex/xz/xz.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
}
|
||||
})
|
||||
@ -1,3 +0,0 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,2 +0,0 @@
|
||||
<!--pages/home/xx/lindex/xz/xz.wxml-->
|
||||
<text>pages/home/xx/lindex/xz/xz.wxml</text>
|
||||
@ -1 +0,0 @@
|
||||
/* pages/home/xx/lindex/xz/xz.wxss */
|
||||
@ -1,66 +0,0 @@
|
||||
// pages/home/xx/xz/index.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage() {
|
||||
|
||||
}
|
||||
})
|
||||
@ -1,3 +0,0 @@
|
||||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
@ -1,2 +0,0 @@
|
||||
<!--pages/home/xx/xz/index.wxml-->
|
||||
<text>pages/home/xx/xz/index.wxml</text>
|
||||
@ -1 +0,0 @@
|
||||
/* pages/home/xx/xz/index.wxss */
|
||||
Loading…
Reference in new issue