refactor: 重构组件逻辑与样式优化

- 在 App.vue 中重构站点信息的获取与应用逻辑，提升代码可读性与维护性。
- 更新 Search.vue 组件，优化搜索框的样式与结构，增强用户体验。
- 在 element.scss 中注释掉不再使用的样式，并新增确认收货按钮的样式。
- 改进多个页面的布局与样式，确保响应式设计的一致性与美观性。
- 更新订单相关组件的按钮样式，提升视觉一致性与可用性。

manager/src/components/affix-time.vue

@@ -120,18 +120,25 @@ export default {
         this.dateList.forEach((res) => {
           res.selected = false;
         });
-        this.selectedWay.year = this.month.split("-")[0];
-        this.selectedWay.month = this.month.split("-")[1];
-        this.selectedWay.searchType = "";
+        const parts = String(this.month).split("-");
+        this.selectedWay = {
+          ...this.selectedWay,
+          year: parts[0],
+          month: parts[1],
+          searchType: "",
+          storeId: this.storeId,
+        };
         this.$emit("selected", this.selectedWay);
       } else {
-        const current = this.dateList.find((item) => item.selected);
-        this.selectedWay = current;
+        const current =
+          this.dateList.find((item) => item.selected) ||
+          this.dateList.find((item) => item.title === this.selectedWay.title) ||
+          this.dateList.find((item) => item.searchType === "LAST_SEVEN");
         this.clickBreadcrumb(current);
-        this.$emit("selected", this.selectedWay);
       }
     },
     clickBreadcrumb(item) {
+      if (!item) return;
       let currentIndex;
       this.dateList.forEach((res, index) => {
         res.selected = false;
@@ -143,8 +150,8 @@ export default {
       item.storeId = this.storeId;
       this.month = "";
       if (item.searchType === "") {
-        const currentDate = this.originDateList[currentIndex].searchType;
-        item.searchType = currentDate || "LAST_SEVEN";
+        const origin = this.originDateList[currentIndex];
+        item.searchType = (origin && origin.searchType) || "LAST_SEVEN";
       }
       this.selectedWay = item;
       this.selectedWay.year = new Date().getFullYear();

manager/src/components/lili-dialog/goods-dialog.vue

@@ -18,6 +18,7 @@
             v-model="category"
             :options="skuList"
             placeholder="请选择商品分类"
+            popper-class="goods-dialog-cascader-popper"
             style="width: 250px"
             clearable
           />
@@ -260,3 +261,8 @@ export default {
   background-size: 10%;
 }
 </style>
+<style lang="scss">
+.goods-dialog-cascader-popper {
+  z-index: 10001 !important;
+}
+</style>

manager/src/components/lili/upload-pic-input.vue

@@ -40,7 +40,7 @@
       <el-button @click="handleCLickImg('storeLogo')">选择图片</el-button>
     </div>
 
-    <el-dialog v-model="viewImage" title="图片预览" width="480px" append-to-body :z-index="3500">
+    <el-dialog v-model="viewImage" title="图片预览" width="480px" append-to-body>
       <img
         :src="currentValue"
         alt="该资源不存在"
@@ -51,13 +51,24 @@
       </template>
     </el-dialog>
 
-    <el-dialog v-model="picModalFlag" width="1200px" append-to-body :z-index="3500" destroy-on-close>
+    <el-dialog
+      v-model="picModalFlag"
+      title="选择图片"
+      width="1200px"
+      append-to-body
+      destroy-on-close
+      @closed="resetPicModal"
+    >
       <ossManage
         ref="ossManage"
         :is-component="true"
         :initialize="picModalFlag"
-        @callback="callbackSelected"
+        @selected="handleOssSelected"
       />
+      <template #footer>
+        <el-button @click="cancelPicModal">取消</el-button>
+        <el-button type="primary" @click="confirmPicModal">确认</el-button>
+      </template>
     </el-dialog>
   </div>
 </template>
@@ -106,12 +117,14 @@ export default {
       viewImage: false,
       uploadFileUrl: uploadFile,
       picModalFlag: false,
+      pendingSelection: [],
       selectedFormBtnName: "",
       picIndex: "",
     };
   },
   methods: {
     handleCLickImg(val, index) {
+      this.pendingSelection = [];
       this.picModalFlag = true;
       this.selectedFormBtnName = val;
       this.picIndex = index;
@@ -121,11 +134,41 @@ export default {
         }
       });
     },
-    callbackSelected(val) {
+    handleOssSelected(list) {
+      this.pendingSelection = Array.isArray(list) ? list : [];
+    },
+    parseOssSelectionUrl(item) {
+      if (!item) {
+        return "";
+      }
+      if (typeof item === "string") {
+        const index = item.indexOf(",");
+        return index >= 0 ? item.slice(index + 1) : item;
+      }
+      return item.url || "";
+    },
+    confirmPicModal() {
+      const list = this.pendingSelection || [];
+      if (!list.length) {
+        this.$Message.warning("请先选择图片");
+        return;
+      }
+      const url = this.parseOssSelectionUrl(list[list.length - 1]);
+      if (!url) {
+        this.$Message.warning("请选择有效图片");
+        return;
+      }
       this.picModalFlag = false;
-      this.currentValue = val.url;
+      this.currentValue = url;
       this.picIndex = "";
       this.emitValue(this.currentValue);
+      this.pendingSelection = [];
+    },
+    cancelPicModal() {
+      this.picModalFlag = false;
+    },
+    resetPicModal() {
+      this.pendingSelection = [];
     },
     init() {
       this.accessToken = {

manager/src/components/lili/upload-pic-thumb.vue

@@ -1,15 +1,8 @@
 <template>
   <div>
     <div class="upload-pic-thumb">
-      <vuedraggable
-        :list="uploadList"
-        :disabled="!draggable || !multiple"
-        :animation="200"
-        class="list-group"
-        ghost-class="thumb-ghost"
-        @end="onEnd"
-      >
-        <div v-for="(item, index) in uploadList" :key="index" class="upload-list">
+      <div v-if="!multiple" class="list-group">
+        <div v-for="item in uploadList" :key="draggableItemKey(item)" class="upload-list">
           <div v-if="item.status == 'finished'" style="height: 60px">
             <img :src="item.url" alt="" />
             <div class="upload-list-cover">
@@ -25,19 +18,47 @@
             />
           </div>
         </div>
+      </div>
+      <vuedraggable
+        v-else
+        v-model="uploadList"
+        :disabled="!draggable"
+        :animation="200"
+        class="list-group"
+        ghost-class="thumb-ghost"
+        :item-key="draggableItemKey"
+        @end="onEnd"
+      >
+        <template #item="{ element: item }">
+          <div class="upload-list">
+            <div v-if="item.status == 'finished'" style="height: 60px">
+              <img :src="item.url" alt="" />
+              <div class="upload-list-cover">
+                <el-icon class="action-icon" @click="handleView(item.url)"><View /></el-icon>
+                <el-icon class="action-icon" @click="handleRemove(item)"><Delete /></el-icon>
+              </div>
+            </div>
+            <div v-else>
+              <el-progress
+                v-if="item.showProgress"
+                :percentage="item.percentage"
+                :show-text="false"
+              />
+            </div>
+          </div>
+        </template>
       </vuedraggable>
       <el-upload
         ref="upload"
+        class="upload-box"
         :action="uploadFileUrl"
         :headers="accessToken"
         :multiple="multiple"
         :show-file-list="false"
         accept=".jpg,.jpeg,.png,.gif"
-        drag
         :before-upload="handleBeforeUpload"
         :on-success="handleSuccess"
         :on-error="handleError"
-        style="display: inline-block; width: 58px"
       >
         <div class="upload-trigger">
           <el-icon :size="20"><Camera /></el-icon>
@@ -99,6 +120,9 @@ export default {
     },
   },
   methods: {
+    draggableItemKey(item) {
+      return item.url || item.uid || item.name;
+    },
     onEnd() {
       this.returnValue();
     },
@@ -265,12 +289,29 @@ export default {
   opacity: 0.5;
   background: #c8ebfb;
 }
+.upload-box {
+  display: inline-block;
+  vertical-align: middle;
+
+  :deep(.el-upload) {
+    display: inline-block;
+    vertical-align: top;
+  }
+}
 .upload-trigger {
-  width: 58px;
-  height: 58px;
-  line-height: 58px;
+  width: 60px;
+  height: 60px;
+  border: 1px dashed #dcdfe6;
+  border-radius: 4px;
+  box-sizing: border-box;
   display: flex;
   align-items: center;
   justify-content: center;
+  cursor: pointer;
+
+  &:hover {
+    border-color: var(--el-color-primary);
+    color: var(--el-color-primary);
+  }
 }
 </style>