同步代码

pagePrinter/add-printer/components/picker-item.vue

@@ -0,0 +1,63 @@
+<template>
+	<view class="u-p-b-24 u-m-b-24 border-bottom">
+		<view class="title font-bold"> <text v-if="required" style="color: red;">*</text>{{title}}</view>
+		<!-- 	<up-popup customStyle="overflow: hidden;" @change="change" :value="value" :range="list" range-key="name" round="20" mode="bottom">
+			<view class="u-m-t-16 u-flex u-row-between ">
+				<view class="color-333" v-if="selText">{{selText}}</view>
+				<view class="color-999" v-else>请选择</view>
+				<uni-icons type="right" color="#999" size="16"></uni-icons>
+			</view>
+		</up-popup> -->
+		<picker @change="change" range-key="name" :value="value" :range="list">
+			<view class="u-m-t-16 u-flex u-row-between ">
+				<view class="color-333" v-if="selText">{{selText}}</view>
+				<view class="color-999" v-else>请选择</view>
+				<uni-icons type="right" color="#999" size="16"></uni-icons>
+			</view>
+		</picker>
+	</view>
+</template>
+
+<script setup>
+	import {
+		computed,
+		ref,
+		watch
+	} from 'vue';
+	const props = defineProps({
+		list: {
+			type: Array,
+			default: () => []
+		},
+		title: {
+			type: String,
+			default: '标题'
+		},
+		modelValue: {
+			type: String,
+		},
+		required: {
+			type: Boolean
+		}
+	})
+	const index = ref(props.modelValue)
+	const emits = defineEmits(['update:modelValue'], )
+	const selText = computed(() => {
+		const item = props.list.filter(ele => ele.value == props.modelValue)[0]
+		if(!item){
+			return ''
+		}
+		return item.name
+	})
+
+	watch(() => index.value, (newval) => {
+		emits('update:modelValue', props.list[newval].value)
+	})
+
+	function change(e) {
+		index.value = e.detail.value
+	}
+</script>
+
+<style>
+</style>