|
@@ -1,17 +1,32 @@
|
|
<template>
|
|
<template>
|
|
- <view class="content">
|
|
|
|
- <view v-for="(item, index) in newList" :key="index" class="newList">
|
|
|
|
- <view>
|
|
|
|
- {{item.id}}
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- {{item.name}}
|
|
|
|
- </view>
|
|
|
|
- <view>
|
|
|
|
- {{item.address}}
|
|
|
|
|
|
+ <view>
|
|
|
|
+
|
|
|
|
+ <view class="top-box">
|
|
|
|
+ <!-- <u-search placeholder="日照香炉生紫烟" v-model="keyword"></u-search> -->
|
|
|
|
+ <u-field icon='search' label-width='0' v-model="value" trim border border-color='black' placeholder='请搜索' />
|
|
|
|
+ <u-sticky>
|
|
|
|
+ <u-dropdown @open='open' @close='close'>
|
|
|
|
+ <u-dropdown-item v-model="value1" title="距离" :options="options1"></u-dropdown-item>
|
|
|
|
+ <u-dropdown-item v-model="value2" title="温度" :options="options2"></u-dropdown-item>
|
|
|
|
+ </u-dropdown>
|
|
|
|
+ </u-sticky>
|
|
|
|
+ </view>
|
|
|
|
+
|
|
|
|
+ <view class="content" catchtouchmove="true" >
|
|
|
|
+ <view v-for="(item, index) in newList" :key="index" class="newList">
|
|
|
|
+ <view>
|
|
|
|
+ {{item.id}}
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ {{item.name}}
|
|
|
|
+ </view>
|
|
|
|
+ <view>
|
|
|
|
+ {{item.address}}
|
|
|
|
+ </view>
|
|
</view>
|
|
</view>
|
|
|
|
+ <view class="loading" v-if="loading">{{ loadingTxt }}</view>
|
|
</view>
|
|
</view>
|
|
- <view class="loading" v-if="loading">{{ loadingTxt }}</view>
|
|
|
|
|
|
+
|
|
</view>
|
|
</view>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -22,6 +37,31 @@
|
|
export default {
|
|
export default {
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
|
|
+ value1: 1,
|
|
|
|
+ value2: 2,
|
|
|
|
+ value:'',
|
|
|
|
+ options1: [{
|
|
|
|
+ label: '默认排序',
|
|
|
|
+ value: 1,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '距离优先',
|
|
|
|
+ value: 2,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '价格优先',
|
|
|
|
+ value: 3,
|
|
|
|
+ }
|
|
|
|
+ ],
|
|
|
|
+ options2: [{
|
|
|
|
+ label: '去冰',
|
|
|
|
+ value: 1,
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: '加冰',
|
|
|
|
+ value: 2,
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
newList: [],
|
|
newList: [],
|
|
loading: false,
|
|
loading: false,
|
|
finished: false,
|
|
finished: false,
|
|
@@ -114,6 +154,15 @@
|
|
// that.loading = false;
|
|
// that.loading = false;
|
|
|
|
|
|
// }, 1500);
|
|
// }, 1500);
|
|
|
|
+ },
|
|
|
|
+ open(){
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ close(){
|
|
|
|
+
|
|
|
|
+ },
|
|
|
|
+ moveHandle(){
|
|
|
|
+ return
|
|
}
|
|
}
|
|
}
|
|
}
|
|
};
|
|
};
|
|
@@ -121,12 +170,45 @@
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
@import '../../common/box.scss';
|
|
@import '../../common/box.scss';
|
|
|
|
+
|
|
|
|
+ .top-box {
|
|
|
|
+ background: white;
|
|
|
|
+ overflow: hidden;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .u-dropdown__menu {
|
|
|
|
+ background: white;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ ::v-deep .u-field {
|
|
|
|
+ border: 1rpx solid black;
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
+ margin: 20rpx 4%;
|
|
|
|
+ }
|
|
|
|
+ ::v-deep .u-dropdown__content {
|
|
|
|
+ height: 700px!important;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ // ::v-deep .u-sticky-wrap {
|
|
|
|
+ // height: auto!important;
|
|
|
|
+ // }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ .fixed-box {
|
|
|
|
+ position: fixed;
|
|
|
|
+ z-index: 99;
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
|
|
+
|
|
.newList {
|
|
.newList {
|
|
border: 1rpx solid black;
|
|
border: 1rpx solid black;
|
|
padding: 20px;
|
|
padding: 20px;
|
|
}
|
|
}
|
|
|
|
|
|
.loading {
|
|
.loading {
|
|
|
|
+
|
|
line-height: 2em;
|
|
line-height: 2em;
|
|
text-align: center;
|
|
text-align: center;
|
|
color: #888;
|
|
color: #888;
|