| <template> | 
|   <div class="model-content-phone-wrapper"> | 
|     <img :src="IconPhone" class="model-content-phone-icon" /> | 
|     <div class="model-content-phone-content"> | 
|       电话号码:<span class="phone-content">{{ phoneNumber }}</span> | 
|     </div> | 
|   </div> | 
| </template> | 
|   | 
| <script setup lang="ts"> | 
| import IconPhone from '@/assets/components/icon-phone.png'; | 
|   | 
| defineOptions({ | 
|   name: 'ModelContentPhone', | 
| }); | 
|   | 
| type Props = { | 
|   phoneNumber?: string; | 
| }; | 
|   | 
| const props = withDefaults(defineProps<Props>(), {}); | 
| </script> | 
|   | 
| <style lang="scss"> | 
| @import '@/styles/common.scss'; | 
|   | 
| .model-content-phone-wrapper { | 
|   display: flex; | 
|   align-items: center; | 
|   justify-content: center; | 
|   width: 200%; | 
|   | 
|   .model-content-phone-icon { | 
|     width: 41px; | 
|     height: 40px; | 
|     margin-right: 18px; | 
|   } | 
|   | 
|   .model-content-phone-content { | 
|     font-size: 30px; | 
|     color: boleGetCssVar('text-color', 'primary'); | 
|     font-weight: 400; | 
|   | 
|     .phone-content { | 
|       display: inline; | 
|       color: #ef9c00; | 
|     } | 
|   } | 
| } | 
| </style> |