BRS1.0/components/header/navs.vue

<template>
	<view class="nav-content">
		<view class="nav"><view class="log" v-if="navtype" @tap="clickOrder"></view><view class="name">{{ navname }}</view><view class="nav-sech"><view class="secah">CAN</view><view class="input-nav" @tap="test">{{ placeholder }}</view></view></view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				searchText: '', //搜索内容
				placeholder: '请输入航班号或行李号'
			}
		},
    props:{
			navname:{
				type:String,
				default:''
			},
			navtype:{
				type:Boolean,
				default:true
			},
			navtypes:{
				type:Boolean,
				default:false
			}
		},
		created(option) {
		},
		onLoad(){
		},
		onUnload() {
		},
		onShow() {
		},
		mounted() {
		},
		methods: {
			test(){
        uni.redirectTo({
					url: "/pages/search/index"
				})
		  },

			//搜索框输入事件
			inputSearch() {
				this.$emit('input', this.searchText)
			},
      clickOrder () {
        this.$emit('fall')
			}
		},
	}
</script>
<style lang="scss" scoped>
.nav-content{
	>.nav{
		width: 100%;
		height: 2.375rem;
		display: flex;
		justify-content: center;
		align-items: center;
		padding-top: 2.25rem;
		color: rgb(255, 255, 255);
		font-family: Noto Sans SC;
		font-size: 1rem;
		position: relative;
    >.name{
      width: 4rem;
			padding: 0 .5rem 0 .5rem;
      color: rgb(255, 255, 255);
      font-family: Noto Sans SC;
      font-size: 16px;
      font-weight: 500;
      display: flex;
      justify-content: center;
    }
		// background: rgba(234, 241, 245,0.2);
		>.log{
			width: .375rem;
			height: .75rem;
			font-size: .75rem;
			position: absolute;
			left: 1.2rem;
			background: url('../../static/ico.png') no-repeat;
			background-size: 100% 100%;
		}
		>.nav-sech{
			width: 15.5625rem;
      height: 1.875rem;
			display: flex;
			align-items: center;
			background: rgba(234, 241, 245,0.2);
			border-radius:4px;
			.secah{
				width: 3.75rem;
				height: 80%;
				display: flex;
				align-items: center;
				justify-content: center;
				color: rgb(255, 255, 255);
				font-family: Noto Sans SC;
				font-size: 14px;
				font-weight: 400;
				border-right: .0625rem solid rgb(255, 255, 255);
			}
			.my-input-placeholder{
				color: rgb(170, 195, 207);
			}
			.input-nav{
				padding-left: .625rem;
				color: rgb(170, 195, 207);
			}

		}
		>.up{
			position: absolute;
			right: 1.5rem;
			color: rgb(255, 255, 255);
			font-family: Noto Sans SC;
			font-size: .875rem;
			font-weight: 500;
		}
	}
}

</style>