53 lines
		
	
	
		
			811 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
			
		
		
	
	
			53 lines
		
	
	
		
			811 B
		
	
	
	
		
			Vue
		
	
	
	
	
	
| <template>
 | |
|   <section class="AiSearch">
 | |
|     <slot v-if="$slots.label" name="label"/>
 | |
|     <span v-else>{{ label }}</span>
 | |
|     <div class="content">
 | |
|       <slot/>
 | |
|     </div>
 | |
|   </section>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| export default {
 | |
|   name: "AiSearch",
 | |
|   props: {
 | |
|     label: {default: ""}
 | |
|   }
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
| .AiSearch {
 | |
|   display: flex;
 | |
| 
 | |
|   span {
 | |
|     background: #F5F5F5;
 | |
|     font-size: 14px;
 | |
|     color: #666;
 | |
|     border: 1px solid #D0D4DC;
 | |
|     border-right: none;
 | |
|     padding: 0 8px;
 | |
|     white-space: nowrap;
 | |
|     display: flex;
 | |
|     align-items: center;
 | |
|     justify-content: center;
 | |
|   }
 | |
| 
 | |
|   :deep( .el-input__inner ){
 | |
|     border-radius: 0;
 | |
|   }
 | |
| 
 | |
|   .content {
 | |
|     display: flex;
 | |
|     align-items: center;
 | |
| 
 | |
|     * + * {
 | |
|       .el-input__inner {
 | |
|         margin-left: -1px;
 | |
|       }
 | |
|     }
 | |
|   }
 | |
| }
 | |
| </style>
 |