发布列表需求

master
许宏杰 3 years ago
parent 555d32fdc9
commit 42bfe7db93

@ -58,7 +58,8 @@
"van-tab": "@vant/weapp/tab/index",
"van-tabs": "@vant/weapp/tabs/index",
"van-toast": "@vant/weapp/toast/index",
"van-popup": "@vant/weapp/popup/index"
"van-popup": "@vant/weapp/popup/index",
"van-calendar": "@vant/weapp/calendar/index"
},
"sitemapLocation": "sitemap.json"
}

@ -1 +1,34 @@
@import '../../../common/index.wxss';.van-calendar__header{box-shadow:var(--calendar-header-box-shadow,0 2px 10px hsla(220,1%,50%,.16));flex-shrink:0}.van-calendar__header-subtitle,.van-calendar__header-title{font-weight:var(--font-weight-bold,500);height:var(--calendar-header-title-height,44px);line-height:var(--calendar-header-title-height,44px);text-align:center}.van-calendar__header-title+.van-calendar__header-title,.van-calendar__header-title:empty{display:none}.van-calendar__header-title:empty+.van-calendar__header-title{display:block!important}.van-calendar__weekdays{display:flex}.van-calendar__weekday{flex:1;font-size:var(--calendar-weekdays-font-size,12px);line-height:var(--calendar-weekdays-height,30px);text-align:center}
@import '../../../common/index.wxss';
.van-calendar__header {
box-shadow: var(--calendar-header-box-shadow, 0 2px 10px hsla(220, 1%, 50%, .16));
flex-shrink: 0
}
.van-calendar__header-subtitle,
.van-calendar__header-title {
font-weight: var(--font-weight-bold, 500);
height: var(--calendar-header-title-height, 44px);
line-height: var(--calendar-header-title-height, 44px);
text-align: center
}
.van-calendar__header-title+.van-calendar__header-title,
.van-calendar__header-title:empty {
display: none
}
.van-calendar__header-title:empty+.van-calendar__header-title {
display: block !important
}
.van-calendar__weekdays {
display: flex
}
.van-calendar__weekday {
flex: 1;
font-size: var(--calendar-weekdays-font-size, 12px);
line-height: var(--calendar-weekdays-height, 30px);
text-align: center
}

@ -1 +1,52 @@
@import '../common/index.wxss';.van-calendar{background-color:var(--calendar-background-color,#fff);display:flex;flex-direction:column;height:var(--calendar-height,100%)}.van-calendar__close-icon{top:11px}.van-calendar__popup--bottom,.van-calendar__popup--top{height:var(--calendar-popup-height,80%)}.van-calendar__popup--left,.van-calendar__popup--right{height:100%}.van-calendar__body{-webkit-overflow-scrolling:touch;flex:1;overflow:auto}.van-calendar__footer{flex-shrink:0;padding:0 var(--padding-md,16px)}.van-calendar__footer--safe-area-inset-bottom{padding-bottom:env(safe-area-inset-bottom)}.van-calendar__footer+.van-calendar__footer,.van-calendar__footer:empty{display:none}.van-calendar__footer:empty+.van-calendar__footer{display:block!important}.van-calendar__confirm{height:var(--calendar-confirm-button-height,36px)!important;line-height:var(--calendar-confirm-button-line-height,34px)!important;margin:var(--calendar-confirm-button-margin,7px 0)!important}
@import '../common/index.wxss';
.van-calendar {
background-color: var(--calendar-background-color, #fff);
display: flex;
flex-direction: column;
height: var(--calendar-height, 100%)
}
.van-calendar__close-icon {
top: 11px
}
.van-calendar__popup--bottom,
.van-calendar__popup--top {
height: var(--calendar-popup-height, 80%)
}
.van-calendar__popup--left,
.van-calendar__popup--right {
height: 100%
}
.van-calendar__body {
-webkit-overflow-scrolling: touch;
flex: 1;
overflow: auto
}
.van-calendar__footer {
flex-shrink: 0;
padding: 0 var(--padding-md, 16px)
}
.van-calendar__footer--safe-area-inset-bottom {
padding-bottom: env(safe-area-inset-bottom)
}
.van-calendar__footer+.van-calendar__footer,
.van-calendar__footer:empty {
display: none
}
.van-calendar__footer:empty+.van-calendar__footer {
display: block !important
}
.van-calendar__confirm {
height: var(--calendar-confirm-button-height, 36px) !important;
line-height: var(--calendar-confirm-button-line-height, 34px) !important;
margin: var(--calendar-confirm-button-margin, 7px 0) !important
}

@ -65,4 +65,5 @@
</view>
<view class="nodata" wx:else="{{value.content_detail == 0}}">暂无数据</view>
</view>
</view>
</view>

@ -1,4 +1,5 @@
// pages/add/index.js
let app = getApp() //映入封装请求
Page({
/**
* 页面的初始数据
@ -10,12 +11,89 @@ Page({
name: "图片1",
},
],
show:false,
date:'露营打卡',
yingdi:false,
list:[],
activerItem:null,
activerName : '你在哪里'
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {},
onLoad(options) {
this.getList()
},
clickList(e){
let index = e.currentTarget.dataset.index
let {activerItem} =this.data
if(index == activerItem) {
activerItem = null
}else{
activerItem = index
}
this.setData({
activerItem:activerItem,
activerName:this.data.list[activerItem].data.camp.name
})
console.log(e)
},
showYd(){
this.setData({
yingdi:true,
})
wx.setNavigationBarTitle({
title: "营地列表",
});
},
closeYd(){
this.setData({
yingdi:false,
})
wx.setNavigationBarTitle({
title: "发布",
});
},
getList(){
let list =[]
app.fetch(`9017/jsonData/jiangsu.json`, {}, false, 'GET').then(res => {
console.log(res)
for(let key in res){
res[key].forEach(item=>{
list.push(item)
})
}
this.setData({
list:list
})
})
},
//显示选择日期面板
showDate(){
this.setData({
show:true
})
},
//关闭日期面板
onClose(){
this.setData({
show:false
})
},
//选中日期
formatDate(date) {
date = new Date(date);
return `${date.getFullYear()}-${date.getMonth() + 1}-${date.getDate()}`;
},
onConfirm(event) {
this.setData({
show: false,
date:`露营日:${this.formatDate(event.detail)}` ,
});
},
/**
* 生命周期函数--监听页面初次渲染完成

@ -1,40 +1,69 @@
<!--pages/add/index.wxml-->
<view class="view-page" hover-class="none" hover-stop-propagation="false">
<input class="weui-input" name="input" placeholder="填写标题更容易被推荐哦~" placeholder-style="color:#bfbfc1;"/>
<view class="view-hr-line view-line-h1"/>
<view class="view-textarea" hover-class="none" hover-stop-propagation="false">
<textarea placeholder="分享你的心情和故事吧~" placeholder-style="color:#bfbfc1;"/>
</view>
<view class="">
<input class="weui-input" name="input" placeholder="填写标题更容易被推荐哦~" placeholder-style="color:#bfbfc1;" />
<view class="view-hr-line view-line-h1" />
<view class="view-textarea" hover-class="none" hover-stop-propagation="false">
<textarea placeholder="分享你的心情和故事吧~" placeholder-style="color:#bfbfc1;" />
</view>
<view class="">
<view class="view-tagt">
<text>#话题</text>
<text>#话题</text>
</view>
<view class="view-hr-line view-line-h2"/>
<view class="view-local">
<image src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_local@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
<text>你在哪里</text>
<view class="view-hr-line view-line-h2" />
<view class="view-local" bindtap="showYd">
<image src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_local@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
<text>{{activerName}}</text>
</view>
<view class="view-hr-line"/>
<view class="view-call">
<image class="view-call-image1" src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_call@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
<text>露营打卡</text>
<image class="view-call-image2" src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_new@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
<view class="view-hr-line" />
<view class="view-call" bindtap="showDate">
<image class="view-call-image1" src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_call@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
<text>{{date}}</text>
<image class="view-call-image2" src="http://www.jichuanglanhai.com/demo/js-yingdi/images/icon_new@2x.png" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="">
</image>
</view>
</view>
<view class="view-uploader" hover-class="none" hover-stop-propagation="false">
</view>
<view class="view-uploader" hover-class="none" hover-stop-propagation="false">
<van-uploader deletable="{{false}}" file-list="{{ fileList }}" />
</view>
</view>
<view class="view-add-btn" bindtap="gohome">
<view class="view-add-btn" bindtap="gohome">
<text class="" selectable="false" space="false" decode="false">发布</text>
</view>
</view>
</view>
</view>
<!-- 选择日期面板 -->
<van-calendar show="{{ show }}" title="请选择露营日期" bind:close="onClose" bind:confirm="onConfirm" color="#446C4C" />
<!-- 营地面板 -->
<van-popup show="{{ yingdi }}" custom-style="height: 100%; width:100%" bind:close="yingdiClose" custom-class="popup-box">
<view class="yingdilist">
<view class="yingdi-title">
<view class="yingdi-close" bindtap="closeYd">
<van-icon name="cross" />
</view>
<view class="yingdi-search">
<van-search value="{{ value }}" placeholder="请输入搜索关键词" use-action-slot bind:change="onChange" bind:search="onSearch" custom-class="input-css">
<view slot="action" bind:tap="onClick" class="yi-search">搜索</view>
</van-search>
</view>
</view>
<view class="yi-list">
<view class="list-item" wx:for="{{list}}" wx:key="index" data-index="{{index}}" bindtap="clickList">
<view class="item-img">
<image src="{{item.data.camp.images[0].url}}" mode="aspectFill"></image>
</view>
<view class="item-name">{{item.data.camp.name}}</view>
<view class="radio" wx:if="{{activerItem == index }}">
<image src="http://www.jichuanglanhai.com/demo/js-yingdi/images/duihao.png" mode="aspectFill"></image>
</view>
</view>
</view>
</view>
</van-popup>

@ -125,3 +125,78 @@
color: #fff;
align-self: center;
}
.van-icon {
background:transparent !important;
}
.yingdi-title{
display: flex;
align-items: center;
}
.yingdi-close{
font-size: 30rpx;
margin-left: 20rpx;
text-align: center;
}
.yingdi-search{
flex: 1;
}
.yi-search{
background-color: #446C4C;
height: 55rpx;
line-height: 55rpx;
padding: 0 30rpx;
border-radius: 6rpx;
color: white;
font-size: 25rpx;
}
.yi-list{
width: 100%;
padding:10rpx 20rpx;
box-sizing: border-box;
}
.list-item{
height: 120rpx;
border-bottom: 1rpx solid #e5e5e6;
border-width: 1px;
}
.list-item{
display: flex;
align-items: center;
}
.item-img{
width: 120rpx;
height: 80rpx;
border-radius: 6rpx;
}
.item-img image{
height: 100%;
width: 100%;
display: block;
border-radius: 6rpx;
}
.item-name{
flex: 1;
margin-left: 20rpx;
font-size: 26rpx;
font-family: "Alibaba-PuHuiTi-Regular.otf";
font-weight: 400;
color: #333;
}
.popup-box{
background: white !important;
}
.radio{
height: 50rpx;
width: 50rpx;
border-radius: 50%;
margin-right: 20rpx;
background: #446C4C;
display: flex;
align-items: center;
justify-content: center;
}
.radio image{
height: 40rpx;
width: 40rpx;
display: block;
}

@ -251,7 +251,7 @@ Page({
let swiperList = []
let ids;
console.log(res)
if (res[this.data.cityactiveName].length == []) {
if (res[this.data.cityactiveName].length == 0) {
wx.showToast({
icon: 'none',
title: '该城市暂无营地,为你展示全省营地。',

@ -43,6 +43,13 @@
"query": "",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "pages/addinfo/index",
"query": "",
"launchMode": "default",
"scene": null
}
]
}

Loading…
Cancel
Save