|
@@ -1,9 +1,10 @@
|
1
|
1
|
<template>
|
2
|
2
|
<view class="main">
|
3
|
3
|
<view class="input" :style="disabled?'background-color:#f5f7fa':''">
|
4
|
|
- <input @click="showModal" v-model="_value" :style="disabled?'color:#c0c4cc':''" :placeholder="placeholder"
|
|
4
|
+ <input v-model="_value" :style="disabled?'color:#c0c4cc':''" :placeholder="placeholder"
|
5
|
5
|
disabled />
|
6
|
6
|
<text v-if="clearable&&!disabled" @click="empty" class="selectIcon iconcross"></text>
|
|
7
|
+ <view class="mask" @click="showModal"></view>
|
7
|
8
|
</view>
|
8
|
9
|
<view class="select-modal" :class="isShowModal?'show':''" @tap="hideModal">
|
9
|
10
|
<view class="select-dialog" @tap.stop="" :style="{backgroundColor:bgColor}">
|
|
@@ -11,14 +12,14 @@
|
11
|
12
|
<view class="action text-blue" @tap="cancelClick">{{cancelText}}</view>
|
12
|
13
|
<view class="action text-green" @tap="confirmClick">{{confirmText}}</view>
|
13
|
14
|
</view>
|
14
|
|
- <view class="select-content">
|
|
15
|
+ <scroll-view scroll-y class="select-content">
|
15
|
16
|
<view class="select-item" v-for="(item,index) in list" :key="index"
|
16
|
17
|
:style="valueIndexOf(item)?'color:'+selectColor+';background-color:'+selectBgColor+';':'color:'+color+';'"
|
17
|
18
|
@click="select(item)">
|
18
|
19
|
<view class="title">{{getLabelKeyValue(item)}}</view>
|
19
|
20
|
<text class="selectIcon icongou" v-if="valueIndexOf(item)"></text>
|
20
|
21
|
</view>
|
21
|
|
- </view>
|
|
22
|
+ </scroll-view>
|
22
|
23
|
</view>
|
23
|
24
|
</view>
|
24
|
25
|
</view>
|
|
@@ -242,6 +243,16 @@
|
242
|
243
|
border-style: solid;
|
243
|
244
|
border-width: 1rpx;
|
244
|
245
|
border-color: rgba(0, 0, 0, 0.1);
|
|
246
|
+ position: relative;
|
|
247
|
+
|
|
248
|
+ .mask{
|
|
249
|
+ content: '';
|
|
250
|
+ position: absolute;
|
|
251
|
+ top: 0;
|
|
252
|
+ right: 0;
|
|
253
|
+ bottom: 0;
|
|
254
|
+ left: 0;
|
|
255
|
+ }
|
245
|
256
|
|
246
|
257
|
input {
|
247
|
258
|
flex: 1;
|