change: indent sku选择组建.显式显示申请sku入口.

src/pages/indent-manage/indent/components/skuSelect.vue

@@ -14,7 +14,7 @@
         class="flex items-start"
         style="max-height: 100%"
       >
-        <div class="max-h-[800px] overflow-auto">
+        <div class="max-h-[800px] overflow-auto min-w-[180px]">
           <el-input
             v-model="keywords"
             placeholder="SKU / 商品名"
@@ -39,49 +39,58 @@
             ></el-tree>
           </div>
         </div>
-        <div
-          v-if="skuList.length"
-          class="sku-area flex-auto flex flex-wrap items-center"
-        >
-          <div
-            v-for="sku in skuList"
-            :key="sku.id"
-            class="sku-item"
-          >
-            <div class="image flex justify-center">
-              <img
-                v-if="sku.images.length"
-                :src="sku.images[0]"
-                class="h-[100%] w-auto"
-              />
-            </div>
-            <div class="sku-name">{{ sku.product_name }}</div>
-            <div class="flex justify-between items-center">
-              <div class="sku-code">Product Code: {{ sku.product_sku }}</div>
-              <el-button
-                type="primary"
-                size="small"
-                plain
-                @click="selectSku(sku)"
-              >
-                使用
-              </el-button>
-            </div>
-          </div>
-        </div>
-        <div
-          v-else
-          class="sku-area flex-auto flex items-center"
-          style="padding-left: 25%"
-        >
-          未找到你想要的Indent商品, 可进行
+        <div class="flex-auto pl-[24px]">
           <el-button
-            link
             type="primary"
+            class="mb-2"
             @click="dialogApplySkuVisible = true"
           >
             申请
           </el-button>
+          <div
+            v-if="skuList.length"
+            class="sku-area flex flex-wrap items-center"
+          >
+            <div
+              v-for="sku in skuList"
+              :key="sku.id"
+              class="sku-item"
+            >
+              <div class="image flex justify-center">
+                <img
+                  v-if="sku.images.length"
+                  :src="sku.images[0]"
+                  class="h-[100%] w-auto"
+                />
+              </div>
+              <div class="sku-name">{{ sku.product_name }}</div>
+              <div class="flex justify-between items-center">
+                <div class="sku-code">Product Code: {{ sku.product_sku }}</div>
+                <el-button
+                  type="primary"
+                  size="small"
+                  plain
+                  @click="selectSku(sku)"
+                >
+                  使用
+                </el-button>
+              </div>
+            </div>
+          </div>
+          <div
+            v-else
+            class="sku-area flex-auto flex items-center"
+            style="padding-left: 25%"
+          >
+            未找到你想要的Indent商品, 可进行
+            <el-button
+              link
+              type="primary"
+              @click="dialogApplySkuVisible = true"
+            >
+              申请
+            </el-button>
+          </div>
         </div>
       </div>
       <template #footer>
@@ -286,7 +295,7 @@ const close = (done = {} as any) => {
   }
   .sku-area {
     width: 100%;
-    padding-left: 24px;
+    // padding-left: 24px;
     height: 82vh;
     overflow-y: auto;
   }