|
|
@@ -1,68 +1,25 @@
|
|
|
<template>
|
|
|
<view class="select-bg_bx">
|
|
|
-
|
|
|
- <view
|
|
|
- v-if="isShowTit"
|
|
|
- @click="switchCut"
|
|
|
- :class="['select-title',dropdownShow?'select_corlor':'']"
|
|
|
- >
|
|
|
- <!-- {{menuObjActive?menuObjActive:menuObj.title}}-->
|
|
|
+ <view v-if="isShowTit" @click="switchCut" :class="['select-title',dropdownShow?'select_corlor':'']" >
|
|
|
<text v-if="typeTime">{{selectItemId?menuObjActive:menuObj.title}}</text>
|
|
|
<text v-else>{{menuObjActive?menuObjActive:getMyShopInfo.shopName}}</text>
|
|
|
- <i
|
|
|
- v-if="isShowMore"
|
|
|
- class="iconfont iconsanjiao_xia"
|
|
|
- ></i>
|
|
|
+ <i v-if="isShowMore" class="iconfont iconsanjiao_xia" ></i>
|
|
|
</view>
|
|
|
- <view
|
|
|
- class="select-mark-view"
|
|
|
- v-show="dropdownShow"
|
|
|
- @click="switchCut"
|
|
|
- ></view>
|
|
|
- <view
|
|
|
- v-if="dropdownShow"
|
|
|
- :style="{
|
|
|
- top
|
|
|
- }"
|
|
|
- class="select-fixed_bx"
|
|
|
- >
|
|
|
+ <view class="select-mark-view" v-show="dropdownShow" @click="switchCut" ></view>
|
|
|
+ <view v-if="dropdownShow" :style="{ top }" class="select-fixed_bx" >
|
|
|
<slot>
|
|
|
<view class="select-item-box">
|
|
|
<view class="title">{{menuObj.titleChild}}</view>
|
|
|
<view class="item-child_box">
|
|
|
- <button
|
|
|
- v-for="(item,index) in menuObj.list"
|
|
|
- :key="index"
|
|
|
- @click="changeItem(item)"
|
|
|
- :class="['admin-button-com','mini-btn',selectItemId === item.id?'blue':'default']"
|
|
|
- >
|
|
|
+ <button v-for="(item,index) in menuObj.list" :key="index" @click="changeItem(item)" :class="['admin-button-com','mini-btn',selectItemId === item.id?'blue':'default']" >
|
|
|
{{item.name}}
|
|
|
</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view
|
|
|
- v-if="typeSelect === 1"
|
|
|
- class="select-item-box"
|
|
|
- >
|
|
|
- <view class="title">其他时间选择</view>
|
|
|
- <view class="item-child_box">
|
|
|
- <view
|
|
|
- class="admin-button-com mini-btn default custom"
|
|
|
- @tap="changeItem({name:'自定义',id:'custom'})"
|
|
|
- >自定义</view>
|
|
|
- <!-- <picker-->
|
|
|
- <!-- class="admin-button-com mini-btn default custom"-->
|
|
|
- <!-- mode="date" :value="selectItemId" @change="endTimeFn">-->
|
|
|
- <!-- <div v-if="selectItemId&&formatSelect">{{ selectItemId }}</div>-->
|
|
|
- <!-- <div class="tui-placeholder" v-else>自定义时间</div>-->
|
|
|
- <!-- </picker>-->
|
|
|
- </view>
|
|
|
- </view>
|
|
|
</slot>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
-
|
|
|
<script>
|
|
|
import DropdownList from "@/components/plugin/dropdown-list";
|
|
|
import AppDatePicker from "@/components/app-date-picker";
|
|
|
@@ -82,11 +39,6 @@ export default {
|
|
|
list: [{ name: '昨天', id: '0' }, { name: '今天', id: '1' }, { name: '本月', id: '2' }, { name: '上月', id: '3' }, { name: '今年', id: '4' }]
|
|
|
})
|
|
|
},
|
|
|
- // 1 是时间 2是其他
|
|
|
- typeSelect: {
|
|
|
- type: Number,
|
|
|
- default: 2
|
|
|
- },
|
|
|
top: {
|
|
|
type: String,
|
|
|
default: 'auto'
|
|
|
@@ -132,6 +84,8 @@ export default {
|
|
|
this.dropdownShow = !this.dropdownShow
|
|
|
},
|
|
|
changeItem (val) {
|
|
|
+ console.log(this.menuObj)
|
|
|
+ console.log('abc')
|
|
|
if (val.id == this.selectItemId && val.name != '自定义') {
|
|
|
return false
|
|
|
}
|
|
|
@@ -163,14 +117,13 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
-
|
|
|
<style lang="scss" scoped>
|
|
|
.select-bg_bx {
|
|
|
.select-title {
|
|
|
color: #666666;
|
|
|
- font-size: 26upx;
|
|
|
+ font-size: 26px;
|
|
|
& .iconsanjiao_xia {
|
|
|
- margin-left: 10upx;
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
&.select_corlor {
|
|
|
color: #3385ff;
|
|
|
@@ -186,38 +139,34 @@ export default {
|
|
|
width: 100%;
|
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
|
left: 0;
|
|
|
- top: 0upx;
|
|
|
+ top: 0px;
|
|
|
z-index: 900;
|
|
|
}
|
|
|
& .select-fixed_bx {
|
|
|
position: fixed;
|
|
|
width: 100%;
|
|
|
background-color: #ffffff;
|
|
|
- left: 0;
|
|
|
+ left: 0upx;
|
|
|
+ top:0upx;
|
|
|
z-index: 999;
|
|
|
- // box-shadow: 0 6upx 10upx #cccccc;
|
|
|
- padding: 120upx 30upx 40upx;
|
|
|
- border-radius: 0upx 0upx 20upx 20upx;
|
|
|
+ padding: 120px 30px 40px;
|
|
|
+ border-radius: 0px 0px 20px 20px;
|
|
|
transition: all 0.5s ease-in-out;
|
|
|
- // top: 100upx;
|
|
|
& .select-item-box {
|
|
|
& .title {
|
|
|
- font-size: 24upx;
|
|
|
+ font-size: 24px;
|
|
|
color: #333333;
|
|
|
font-weight: 600;
|
|
|
text-align: left;
|
|
|
}
|
|
|
& .item-child_box {
|
|
|
- // display: flex;
|
|
|
- padding: 20upx 0 0;
|
|
|
+ padding: 20px 0 0;
|
|
|
align-items: center;
|
|
|
- // flex-flow: wrap;
|
|
|
display: inline-block;
|
|
|
- // justify-content: space-between;
|
|
|
& .admin-button-com {
|
|
|
- margin-bottom: 20upx;
|
|
|
- margin-right: 20upx;
|
|
|
- padding: 18upx 50upx;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ margin-right: 20px;
|
|
|
+ padding: 18px 50px;
|
|
|
&.custom {
|
|
|
width: 100%;
|
|
|
}
|
|
|
@@ -226,4 +175,4 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|