diff --git a/src/views/business/components/business-crud-page.vue b/src/views/business/components/business-crud-page.vue
index 6e7ffbb..ef98146 100644
--- a/src/views/business/components/business-crud-page.vue
+++ b/src/views/business/components/business-crud-page.vue
@@ -2189,7 +2189,9 @@
-
终
@@ -9413,18 +9415,18 @@ export default {
}
&__dispatch-route {
+ position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) 56px minmax(0, 1fr);
gap: 12px;
- justify-items: center;
+ align-items: center;
height: 100%;
- padding-top: 22px;
}
&__dispatch-route-item {
display: flex;
- align-items: flex-start;
- gap: 10px;
+ align-items: center;
+ gap: 12px;
max-width: 100%;
}
@@ -9435,10 +9437,11 @@ export default {
justify-content: center;
width: 40px;
height: 40px;
- border-radius: 4px;
+ border-radius: 50%;
color: #fff;
- font-size: 18px;
+ font-size: 16px;
font-weight: 600;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
&.is-start {
background: #2a92ff;
@@ -9455,46 +9458,62 @@ export default {
}
&__dispatch-route-title {
- font-size: 20px;
- line-height: 1.3;
+ font-size: 18px;
+ line-height: 1.35;
color: #303133;
font-weight: 600;
- word-break: break-word;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
}
&__dispatch-route-address {
- margin-top: 6px;
+ margin-top: 4px;
font-size: 13px;
- line-height: 1.45;
+ line-height: 1.5;
color: #606266;
}
&__dispatch-route-contact {
- margin-top: 4px;
+ margin-top: 2px;
font-size: 13px;
- color: #606266;
+ color: #909399;
}
- &__dispatch-route-line {
+ &__dispatch-route-vehicle {
position: relative;
- margin-top: 20px;
- width: 56px;
- height: 2px;
- background-image: linear-gradient(
- to right,
- var(--el-color-primary) 0,
- var(--el-color-primary) 6px,
- transparent 6px,
- transparent 10px
- );
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 44px;
+ height: 44px;
+ margin: 0 auto;
+ border-radius: 50%;
+ background: #fff;
+ border: 2px solid var(--el-color-primary);
+ color: var(--el-color-primary);
+ font-size: 22px;
+ box-shadow: 0 2px 8px rgba(64, 158, 255, 0.18);
+ &::before,
&::after {
content: '';
position: absolute;
- right: -1px;
- top: -4px;
- border: 5px solid transparent;
- border-left-color: var(--el-color-primary);
+ top: 50%;
+ width: 20px;
+ height: 0;
+ border-top: 2px dashed var(--el-color-primary-light-5);
+ transform: translateY(-50%);
+ }
+
+ &::before {
+ right: 100%;
+ margin-right: 6px;
+ }
+
+ &::after {
+ left: 100%;
+ margin-left: 6px;
}
}