💄 修改细节问题

src/assets/scss/main.scss

@@ -231,6 +231,7 @@ $small-banner-height: 445px;
       cursor: pointer;
       user-select: none;
       outline: none;
+      flex-shrink: 0;
     }
   }
 }

src/components/content/CommonListBlock.vue

@@ -29,6 +29,7 @@
           :options="drop.options" 
           labelKey="name"
           valueKey="id"
+          style="max-width: 150px"
           @update:selectedValue="(v) => handleChangeDropDownValue(k, v)"
         />
         <SimpleInput v-if="showSearch" v-model="searchText" placeholder="请输入关键词" @enter="handleSearch">

src/components/controls/Dropdown.vue

@@ -1,8 +1,8 @@
 <template>
   <!-- 下拉选项列表 -->
   <div class="nana-dropdown-wrapper">
-    <div class="nana-dropdown" @click="isDropdownOpen=!isDropdownOpen">
-      <text>{{ selectedLabel }}</text>
+    <div v-bind="$attrs" class="nana-dropdown" @click="isDropdownOpen=!isDropdownOpen">
+      <span>{{ selectedLabel }}</span>
       <DropDownIcon :class="['arrow',isDropdownOpen?'open':'']" />
     </div>
     <div v-if="isDropdownOpen" class="nana-dropdown-options">
@@ -16,7 +16,7 @@
           ]"
           @click="selectOption(option)"
         >
-          <text>{{ option[labelKey] }}</text>
+          <span>{{ option[labelKey] }}</span>
         </div>
       </SimpleScrollView>
     </div>
@@ -90,6 +90,10 @@ function selectOption(option: any) {
   border: 1px solid $primary-color;
   user-select: none;
   cursor: pointer;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
 
   .arrow {
     width: 15px;
@@ -101,9 +105,13 @@ function selectOption(option: any) {
       transform: rotate(180deg);
     }
   }
-  text {
+  span {
     font-size: 17.5px;
     color: var(--nana-text-1);
+    max-width: calc(100% - 25px);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
   }
 }
 .nana-dropdown-options {