first

pagePrinter/add-printer/components/choose-category.vue

@@ -0,0 +1,46 @@
+<template>
+	<my-mask :show="modelValue">
+		<view class="bg-fff content">
+			<view class="u-flex u-row-between u-p-30">
+				<view>选择分类</view>
+				<view>
+					<uni-icons @click="changeShow" type="closeempty"></uni-icons>
+				</view>
+			</view>
+			<scroll-view scroll-y="true" style="height: 70vh;">
+				
+			</scroll-view>
+			<view class="u-flex u-row-between gap-20 u-p-30">
+				<view class="u-flex-1">
+					<my-button type="cancel" @tap="changeShow">取消</my-button>
+				</view>
+				<view class="u-flex-1">
+					<my-button>确定</my-button>
+				</view>
+			</view>
+		</view>
+	</my-mask>
+</template>
+
+<script setup>
+	const props=defineProps({
+		modelValue:{
+			type: Boolean,
+			default: false
+		}
+	})
+	const emits=defineEmits(['update:modelValue'])
+	function changeShow(isShow){
+		const show=isShow?true:false
+		emits('update:modelValue',show)
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content{
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		right: 0;
+	}
+</style>

pagePrinter/add-printer/components/my-radio-group.vue

@@ -0,0 +1,70 @@
+<template>
+	<radio-group class="u-flex u-flex-wrap" @change="change">
+		<label class="radio u-m-r-60" v-for="(item,itemIndex) in list" :key="index">
+			<radio :value="index" :checked="itemChecked(item,itemIndex)" class="scale7" />
+			<text>{{item.label}}</text>
+		</label>
+	</radio-group>
+</template>
+
+<script setup>
+	import {
+		computed,
+		ref,
+		watch
+	} from 'vue';
+	const props = defineProps({
+		rangeValue: {
+			type: [String, Number],
+			default: ''
+		},
+		rangeKey: {
+			type: String,
+			default: 'label'
+		},
+		list: {
+			type: Array,
+			default: () => []
+		},
+		title: {
+			type: String,
+			default: '标题'
+		},
+		modelValue: {
+			type: [String, Number],
+			default: ''
+		}
+	})
+	function itemChecked(item,itemIndex){
+		if(!props.rangeValue){
+			return itemIndex==index.value
+		}
+		return item[props.rangeValue]=props.list[index.value][props.rangeKey]
+	}
+	function findIndex() {
+		return props.list.findIndex(v => v[props.rangeValue] == props.modelValue)
+	}
+
+	function findValue() {
+		return props.list[index.value][props.rangeValue]
+	}
+	const computedIndex = props.rangeValue ? findIndex() : props.modelValue
+	const index = ref(computedIndex)
+	const emits = defineEmits(['update:modelValue'], )
+	watch(() => index.value, (newval) => {
+		const value = props.rangeValue ? findValue() : newval
+		console.log(value);
+		emits('update:modelValue', value)
+	})
+
+	function change(e) {
+		index.value = e.detail.value
+	}
+	const selText = computed(() => {
+		const item = props.list[index.value]
+		return item ? item[props.rangeKey] : ''
+	})
+</script>
+
+<style>
+</style>

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

@@ -0,0 +1,87 @@
+<template>
+	<view class="u-p-b-24 u-m-b-24 border-bottom">
+		<view class="title font-bold">{{title}}</view>
+		<picker
+		 @change="change" 
+		:range-key="rangeKey" 
+		:value="index" 
+		: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({
+		rangeValue:{
+			type: [String, Number],
+			default: ''
+		},
+		rangeKey:{
+			type:String,
+			default:'label'
+		},
+		list: {
+			type: Array,
+			default: () => []
+		},
+		title: {
+			type: String,
+			default: '标题'
+		},
+		modelValue: {
+			type: [String, Number],
+			default: ''
+		}
+	})
+	function isObj(obj){
+		return typeof obj ==='object'
+	}
+	function findIndex(){
+		return props.list.findIndex(v=>{
+			 if(isObj(v)){
+				 return v[props.rangeValue]==props.modelValue
+			 }else{
+				 return v==props.modelValue
+			 }
+		})
+	}
+	function findValue(){
+		const item=props.list[index.value]
+		if(isObj(item)){
+			return item[props.rangeValue]
+		}else{
+			return item
+		}
+	}
+	const computedIndex=props.rangeValue? findIndex(): props.modelValue
+	const index = ref(computedIndex)
+	const emits = defineEmits(['update:modelValue'], )
+	watch(()=>index.value,(newval)=>{
+		const value=props.rangeValue?findValue() :newval
+		console.log(value);
+		emits('update:modelValue',value)
+	})
+	function change(e){
+		index.value=e.detail.value
+	}
+	const selText=computed(()=>{
+		const item=props.list[index.value]
+		if(item&&isObj(item)){
+			return item?item[props.rangeKey]:''
+		}else{
+			return item
+		}
+	})
+</script>
+
+<style>
+</style>