sfms3.0-uniapp/src/mycomponents/print/print.vue

<template>
	<view class="uni-flex uni-column" style="width: 100%; ">
		<view class="title " style="display: flex; align-items: center;padding: 10rpx;">
			<text style=" flex-shrink: 0;width: 22%; font-size: 35rpx; font-weight: bold;">打印机 :</text>
			<view class="uni-flex" style="uni-row; width: 78%; justify-content: space-between; align-items: center; ">
				<view class="customerBorder" @click="showSelectPrint">
					{{printName}}
				</view>
				<u-select v-model="showPrintSelect" mode="mutil-column-auto"
					:list="printList" @confirm="confirmSelectPrint"></u-select>
						
				<view class="" style="">
					<image src="/static/icons/down.svg" mode=""
						style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;" @click="showSelectPrint">
					</image>
				</view>
			</view>
			
		</view>
		<view class='split_line'></view>
		<view class="title " style="display: flex; align-items: center;padding: 10rpx;">
			<text style="flex-shrink: 0;width: 22%; font-size: 35rpx; font-weight: bold;">模版 :</text>
			
			<view class="uni-flex" style="uni-row; width: 78%; justify-content: space-between; align-items: center; ">
				<view class="customerBorder" @click="showSelectTemplate">
					{{templateName}}
				</view>
				<u-select v-model="showTemplateSelect" mode="mutil-column-auto"
					:list="templateList" @confirm="confirmSelectTemplate"></u-select>
						
				<view class="">
					<image src="/static/icons/down.svg" mode=""
						style=" width: 40rpx;height: 40rpx;margin-left: 20rpx;" @click="showSelectTemplate">
					</image>
				</view>
			</view>
			
		</view>
		<view class='split_line'></view>
		<comMessage ref="comMessage"></comMessage>
	</view>
</template>

<script>
	
	import {
		getPrintList,
		getPrintTemplateList
	} from '@/api/request2.js';
	export default {
		data() {
			return {
				showPrintSelect:false,
				printName:"请选择打印机",
				printCode:"",
				showTemplateSelect:false,
				templateName:"请选择打印模版",
				templateCode:"",
				printList:[],
				templateList:[]

			};
		},
		// 此处定义传入的数据
		props: {
			// printList: {
			// 	type: Array,
			// 	default() {
			// 		return [];
			// 	}
			// },
			// templateList: {
			// 	type: Array,
			// 	default() {
			// 		return [];
			// 	}
			// },
			// printDeafult:{
			// 	type:String,
			// 	default:""
			// },
			// templateDeafult:{
			// 	type:String,
			// 	default:""
			// },
		},
		methods: {
			setDefaultData(printDeafult,templateDeafult){
				this.templateName =printDeafult.name
				this.printCode =printDeafult.code
				this.templateName =templateDeafult.name
				this.templateCode =templateDeafult.code
			},
			
			showErrorMessage(message, type) {
				setTimeout(r => {
					this.$refs.comMessage.showErrorMessage(message, res => {})
				})
			},
			showSelectPrint(){
				this.showPrintSelect =true
				uni.showLoading({
					title:"加载中",
					mask:true
				})
				getPrintList().then(res=>{
					this.printList =[]
				}).catch(error=>{
					
				})
				
			},
			confirmSelectPrint(){
				this.printCode =""
				this.$emit("printCode",this.printCode)
			},
			showSelectTemplate(){
				this.showTemplateSelect =true
				uni.showLoading({
					title:"加载中",
					mask:true
				})
				getPrintTemplateList().then(res=>{
					this.templateList =[]
					
				}).catch(error=>{
					
				})
			},
			confirmSelectTemplate(){
				this.templateCode =""
				this.$emit("templateCode",this.templateCode)
			}
		}
	}
</script>

<style lang="scss">
.customerBorder {
		width: 100%;
		border: 1rpx solid lightgray;
		border-radius: 5rpx;
		padding: 15rpx;
	}

</style>


<style>
</style>