fix OrderFulfillmentCreate.vue style

src/pages/fulfillment/OrderFulfillmentCreate.vue

@@ -25,9 +25,19 @@
 					<div class="main">
 						<div class="title">
 							<div class="heading">
-								<strong v-text="item.productNameSnapshot || '未命名产品'" />
+								<div class="name-gift">
-								<t-tag v-if="item.gifted" size="small" theme="success" content="赠送" />
+									<strong
-								<span v-text="getItemDescription(item)" />
+										class="clip-text"
+										v-text="item.productNameSnapshot + '长名称长名称长名称长名称长名称' || '未命名产品'"
+									/>
+									<t-tag
+										v-if="item.gifted"
+										size="small"
+										theme="primary"
+										content="赠送"
+									/>
+								</div>
+								<span class="can-fulfill" v-text="getItemDescription(item)" />
 							</div>
 							<div
 								v-if="item.skuCodeSnapshot || item.skuSpecSnapshot?.length || item.skuNameSnapshot || item.specSummarySnapshot || item.unitSnapshot"
@@ -427,9 +437,18 @@ onUnmounted(() => navBarStore.clearRight());
 
 		.item {
 			padding: 10px;
+			min-width: 0;
+
+			:deep(.t-form__controls),
+			:deep(.t-form__controls-content) {
+				min-width: 0;
+			}
 
 			.content {
 				gap: .5rem;
+				width: 100%;
+				min-width: 0;
+				flex: 1 1 auto;
 				display: flex;
 
 				.photo {
@@ -444,12 +463,14 @@ onUnmounted(() => navBarStore.clearRight());
 
 				.main {
 					flex: 1;
+					min-width: 0;
 					display: flex;
 					flex-direction: column;
 					justify-content: space-between;
 
 					.title {
 						gap: .375rem;
+						min-width: 0;
 						display: flex;
 						flex-direction: column;
 
@@ -460,14 +481,23 @@ onUnmounted(() => navBarStore.clearRight());
 							align-items: baseline;
 							justify-content: space-between;
 
-							strong {
+							.name-gift {
+								gap: .5rem;
+								flex: 1 1 0;
 								min-width: 0;
+								display: flex;
 								overflow: hidden;
-								white-space: nowrap;
+
-								text-overflow: ellipsis;
+								strong {
+									flex: 1 1 0;
+									min-width: 0;
+									overflow: hidden;
+									white-space: nowrap;
+									text-overflow: ellipsis;
+								}
 							}
 
-							span {
+							.can-fulfill {
 								color: var(--td-text-color-secondary);
 								font-size: .75rem;
 								white-space: nowrap;