|
|
@@ -1,25 +1,49 @@
|
|
|
<template>
|
|
|
<view class="content-box">
|
|
|
-
|
|
|
- <uni-nav-bar
|
|
|
- fixed="true"
|
|
|
- statusBar="true"
|
|
|
- left-icon="back"
|
|
|
- title="搜索"
|
|
|
- @clickLeft="back"
|
|
|
- >
|
|
|
- <!--右菜单-->
|
|
|
- <template slot="right">
|
|
|
- <u-button
|
|
|
- type="success"
|
|
|
- size="small"
|
|
|
- class="u-reset-button"
|
|
|
- @click="$refs.treePicker._show()"
|
|
|
- text="选择分类"
|
|
|
- ></u-button>
|
|
|
- </template>
|
|
|
+
|
|
|
+ <uni-nav-bar fixed="true" statusBar="true" left-icon="back" title="搜索" @clickLeft="back">
|
|
|
+ <!--右菜单-->
|
|
|
+ <template slot="right">
|
|
|
+ <u-button type="success" size="small" class="u-reset-button" @click="$refs.treePicker._show()"
|
|
|
+ text="选择分类"></u-button>
|
|
|
+ </template>
|
|
|
</uni-nav-bar>
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
+ <view class="top-wrapper">
|
|
|
+ <view class="searchBox rx-bc">
|
|
|
+ <input v-model="searchFrom.keyWord" placeholder="请输入关键字搜索" class="searchInput" />
|
|
|
+
|
|
|
+ <view>
|
|
|
+ <u-button @click="doSearch" type="success" class="u-reset-button" text="搜索">
|
|
|
+ </u-button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="list_box">
|
|
|
+ <u-list>
|
|
|
+ <view v-for="(item,index) in 100">
|
|
|
+ <view>{{item}}</view>
|
|
|
+ </view>
|
|
|
+ </u-list>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ <view class="bottom-wrapper rx-bc">
|
|
|
+ <view>
|
|
|
+ <checkbox v-if="!seletedAll" color="#fff" :checked="seletedAll" @tap="_seletedAll">全选</checkbox>
|
|
|
+ <checkbox class="select-all" color="#fff" v-else :checked="seletedAll" @tap="_seletedAll">取消全选
|
|
|
+ </checkbox>
|
|
|
+ </view>
|
|
|
+ <view>
|
|
|
+ <u-button type="success" size="small" class="u-reset-button" :disabled="!checkListLen" >
|
|
|
+ <view class="selBtn"> 选择( {{ checkListLen }} ) </view>
|
|
|
+ </u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
@@ -27,11 +51,19 @@
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+
|
|
|
+ searchFrom: {
|
|
|
+ keyWord: null
|
|
|
+ },
|
|
|
+
|
|
|
+ seletedAll: false, //全选状态
|
|
|
+ checkListLen: 0,
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ _seletedAll() {
|
|
|
+ this.seletedAll = !this.seletedAll
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -44,4 +76,42 @@
|
|
|
flex-direction: column;
|
|
|
background-color: $page-bg;
|
|
|
}
|
|
|
-</style>
|
|
|
+
|
|
|
+ .searchBox {
|
|
|
+ background-color: #dedede;
|
|
|
+ height: 100rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
+
|
|
|
+ input {
|
|
|
+ height: 80rpx;
|
|
|
+ width: 540rpx;
|
|
|
+ background: #f9f9f9 !important;
|
|
|
+
|
|
|
+ padding-left: 10rpx;
|
|
|
+ border-radius: 5rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .list_box {
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 6rpx 0;
|
|
|
+
|
|
|
+ .u-list {
|
|
|
+ height: 100% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottom-wrapper {
|
|
|
+ height: 80rpx;
|
|
|
+ background: #fff;
|
|
|
+ padding: 0 32rpx;
|
|
|
+
|
|
|
+ /deep/ .uni-checkbox-input-checked {
|
|
|
+ background-color: $theme-color !important;
|
|
|
+ border-color: $theme-color !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
ysy