Blame view

uni_modules/uview-plus/components/u-action-sheet-data/u-action-sheet-data.vue 1.86 KB
a2702f6d   刘淇   巡查计划
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
  <template>
  	<view class="u-action-sheet-data">
  		<view class="u-action-sheet-data__trigger">
  			<slot name="trigger"></slot>
  			<up-input
  				v-if="!$slots['trigger']"
  				:modelValue="current"
  				disabled
  				disabledColor="#ffffff"
  				:placeholder="title"
  				border="none"
  			></up-input>
  			<view @click="show = true"
  				class="u-action-sheet-data__trigger__cover"></view>
  		</view>
  		<up-action-sheet
  			:show="show"
  			:actions="options"
  			:title="title"
  			safeAreaInsetBottom
  			:description="description"
  			@close="show = false"
  			@select="select"
  		>
  		</up-action-sheet>
  	</view>
  </template>
  
  <script>
  export default {
      props: {
  		modelValue: {
  			type: [String, Number],
  			default: ''
  		},
  		title: {
  			type: String,
  			default: ''
  		},
  		description: {
  			type: String,
  			default: ''
  		},
  		options: {
  			type: Array,
  			default: () => {
  				return []
  			}
  		},
  		valueKey: {
  			type: String,
  			default: 'value'
  		},
  		labelKey: {
  			type: String,
  			default: 'name'
  		}
      },
      data() {
          return {
  			show: false,
  			current: '',
          }
      },
      created() {
  		if (this.modelValue) {
  			this.options.forEach((ele) => {
  				if (ele[this.valueKey] == this.modelValue) {
  					this.current = ele[this.labelKey]
  				}
  			})
  		}
      },
      emits: ['update:modelValue'],
  	watch: {
  		modelValue() {
  			this.options.forEach((ele) => {
  				if (ele[this.valueKey] == this.modelValue) {
  					this.current = ele[this.labelKey]
  				}
  			})
  		}
  	},
      methods: {
          hideKeyboard() {
              uni.hideKeyboard()
          },
          select(e) {
              this.$emit('update:modelValue', e[this.valueKey])
  			this.current = e[this.labelKey]
          },
      }
  }
  </script>
  
  <style lang="scss" scoped>
  	.u-action-sheet-data {
  		&__trigger {
  			position: relative;
  			&__cover {
  				position: absolute;
  				top: 0;
  				left: 0;
  				right: 0;
  				bottom: 0;
  			}
  		}
  	}
  </style>