@ -0,0 +1,79 @@ | |||
// components/list/list.js | |||
Component({ | |||
/** | |||
* 组件的属性列表 | |||
*/ | |||
properties: { | |||
}, | |||
/** | |||
* 组件的初始数据 | |||
*/ | |||
data: { | |||
flag1: 0, | |||
flag2: 0, | |||
flag3: 0, | |||
icon: ["/asset/img/icon-display1.png", | |||
"/asset/img/icon-display2.png"], | |||
star: ["/asset/img/icon-star.png", | |||
"/asset/img/redstar.png"], | |||
st: 0, | |||
display1 : 'none', | |||
display2: 'none', | |||
display3: 'none', | |||
pubScenic : [1] | |||
}, | |||
/** | |||
* 组件的方法列表 | |||
*/ | |||
methods: { | |||
onRet: function () { | |||
wx.reLaunch({ | |||
url: "/Pages/travel/home/home", | |||
}); | |||
}, | |||
hit: function () { | |||
this.setData({ | |||
display1: this.data.flag1 == 1 ? 'none' : 'block', | |||
}) | |||
this.data.flag1 = this.data.flag1 == 0 ? 1 : 0 | |||
}, | |||
hit2: function () { | |||
this.setData({ | |||
display2: this.data.flag2 == 1 ? 'none' : 'block', | |||
}) | |||
this.data.flag2 = this.data.flag2 == 0 ? 1 : 0 | |||
}, | |||
hitc: function () { | |||
this.setData({ | |||
display3: this.data.flag3 == 1 ? 'none' : 'block', | |||
}) | |||
this.data.flag3 = this.data.flag3 == 0 ? 1 : 0 | |||
}, | |||
addPub: function(){ | |||
const length = this.data.pubScenic | |||
this.setData({ | |||
pubScenic : this.data.pubScenic.concat([length+1]) | |||
}) | |||
}, | |||
addPrivate: function(){ | |||
const length = this.data.priBillNum.length | |||
this.setData({ | |||
priBillNum:this.data.priBillNum.concat([length+1]) | |||
}) | |||
}, | |||
emphasize:function(){ | |||
this.setData({ | |||
st: this.data.st == 0 ? 1 : 0 | |||
}) | |||
}, | |||
} | |||
}) |
@ -0,0 +1,4 @@ | |||
{ | |||
"component": true, | |||
"usingComponents": {} | |||
} |
@ -0,0 +1,55 @@ | |||
<!--components/memory/memory.wxml--> | |||
<!--与list中的问题是一样的,这里的加号应该也有之前的疑问--> | |||
<view style="display: flex;"> | |||
<image class="navi" src="/asset/img/navi.png" bindtap="onRet"></image> | |||
<view style="padding: 0;margin: 0;width: 1px;height:700px;background-color: #7B8B6F;"></view> | |||
<view style="display: block"> | |||
<view class="title">Memos</view> | |||
<view class="share" style="display:flex;"> | |||
<image class="display" src="{{icon[flag1]}}" bindtap="hit"></image> | |||
<text decode="true"> 共享备忘</text> | |||
</view> | |||
<view style="display: {{display1}};"> | |||
<view class="card" style="display:block;"> | |||
<view style="display:flex;"> | |||
<image class="display" src="{{icon[flag3]}}" bindtap="hitc"></image> | |||
<text decode="true"> 景点相关</text><!--要更改的地方,需要把这里也变成for循环来渲染--> | |||
</view> | |||
<view class="content" style="display: {{display3}};"> | |||
<view wx:for="{{pubScenic}}" wx:for-item="item"> | |||
<view style="display: flex;padding-bottom:10px;"> | |||
<image class="li" src="/asset/img/icon-li.png"></image> | |||
<input type="text" style="width: 25vw; text-align: center;" placeholder="..."/> | |||
<switch style="padding-left: 30px;height: 15px;" color="#D8CAAF"></switch> | |||
<image src="{{star[st]}}" class="star" bindtap="emphasize"></image> | |||
</view> | |||
</view> | |||
<button class="add" bindtap="addPub">+</button> | |||
</view> | |||
</view> | |||
<button class="add" bindtap="addPub">+</button><!--要更改的地方--> | |||
</view> | |||
<!--下面这里也需要用两个for循环来渲染--> | |||
<view class="share" style="display:flex;"> | |||
<image class="display" src="{{icon[flag2]}}" bindtap="hit2"></image> | |||
<text decode="true"> 私有备忘</text> | |||
</view> | |||
<view style="display: {{display2}};"> | |||
<button class="add" bindtap="addPrivate">+</button> | |||
</view> | |||
</view> | |||
</view> | |||
@ -0,0 +1,80 @@ | |||
/* components/memory/memory.wxss */ | |||
.navi{ | |||
width: 40px; | |||
height: 30px; | |||
margin: 5px; | |||
padding-top: 10px; | |||
} | |||
.title{ | |||
position: relative; | |||
top: 20px; | |||
left: 15px; | |||
font-size: 22px; | |||
font-weight: 900; | |||
color: #000; | |||
} | |||
.share{ | |||
position: relative; | |||
padding: 20px; | |||
margin: 10px; | |||
top:10px; | |||
font-size: 17px; | |||
} | |||
.display{ | |||
width: 19px; | |||
height: 19px; | |||
} | |||
.add{ | |||
color: #7B8B6F; | |||
font-weight: 900; | |||
background-color: #F0EBE5; | |||
width: 40px; | |||
height: 40px; | |||
position: relative; | |||
} | |||
button { | |||
margin-left: 10px; | |||
padding-left: 10px; | |||
position: inherit; | |||
background: inherit; | |||
font-weight: bolder; | |||
} | |||
button:after { | |||
content: none; | |||
} | |||
button::after { | |||
border: none; | |||
} | |||
.card{ | |||
position: relative; | |||
left:50px; | |||
} | |||
.content{ | |||
padding: 20px; | |||
position: relative; | |||
font-size: 18px; | |||
text-align: center; | |||
} | |||
.li{ | |||
width: 10px; | |||
height: 10px; | |||
text-align: center; | |||
padding: 7.5px; | |||
} | |||
.star{ | |||
width: 25px; | |||
height: 25px; | |||
position: relative; | |||
padding-left: 10px; | |||
} |