feat: 增强组件功能与样式优化

- 在多个组件中添加了新的属性和方法以提升功能性，如在卡片组件中引入 _ActiveTab 属性以管理活动标签。 - 优化了商品详情和商户页面的收藏逻辑，确保在未登录状态下引导用户登录。 - 更新了轮播组件的路由解析逻辑，增强了用户体验。 - 改进了投诉列表和收藏列表的样式，提升了响应式布局和可读性。 - 在全局配置中添加了对开发环境的错误处理，提升了调试体验。
2026-08-06 10:57:26 +08:00 · 2026-06-25 16:52:46 +08:00
parent 1b2e980fb6
commit ec948b5496
86 changed files with 1741 additions and 1050 deletions
--- a/seller/src/views/Main.vue
+++ b/seller/src/views/Main.vue
@@ -10,7 +10,7 @@
      </div>
      <shrinkable-menu />
    </div>
-    <div class="main-header-con" :style="{ height: setting.isUseTabsRouter ? '100px' : '60px' }">
+    <div class="main-header-con" :style="{ height: setting.isUseTabsRouter ? '106px' : '60px' }">
      <div class="main-header">
        <div class="header-avator-con">
          <div></div>
@@ -24,7 +24,7 @@
              <ul class="nav-list">
                <li class="nav-item" @click="im">
                  <el-tooltip content="联系客服" placement="bottom">
-                    <el-button type="info" size="small" :loading="load">
+                    <el-button type="warning" size="small" :loading="load">
                      <el-icon><ChatDotRound /></el-icon>
                      客服
                    </el-button>
@@ -64,8 +64,8 @@
    <div
      class="single-page-con"
      :style="{
-        top: setting.isUseTabsRouter ? '100px' : '60px',
-        height: setting.isUseTabsRouter ? 'calc(100% - 110px)' : 'calc(100% - 70px)',
+        top: setting.isUseTabsRouter ? '106px' : '60px',
+        height: setting.isUseTabsRouter ? 'calc(100% - 116px)' : 'calc(100% - 70px)',
      }"
    >
      <div class="single-page">
--- a/seller/src/views/home/home.scss
+++ b/seller/src/views/home/home.scss
@@ -36,7 +36,7 @@ h4 {
 .shop-box {
  flex: 3;
  display: flex;
-  font-size: 12px;
+  font-size: 16px;
  margin-top: 50px;
  flex-wrap: wrap;
  justify-content: space-between;
@@ -65,12 +65,16 @@ h4 {
  flex-wrap: wrap;
 }
 .detail-title {
-  position: absolute;
-  left: 0;
-  top: -15px;
-  opacity: 0.3;
-  color: #999;
-  font-size: 21px;
+  flex: 0 0 100%;
+  width: 100%;
+  order: -1;
+  align-self: flex-start;
+  margin-bottom: 8px;
+  padding-left: 4px;
+  opacity: 1;
+  color: #000;
+  font-size: 20px;
+  font-weight: normal;
  text-decoration: initial;
  transition: 0.35s;
 }
@@ -82,22 +86,24 @@ h4 {
  font-weight: bold;
  width: 286px;
  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-end;
+  justify-content: center;
  :deep(span) {
    color: $theme_color;
    font-size: 18px;
  }
-  align-items: center;
-  justify-content: center;
-  padding: 20px;
+  padding: 16px 12px 20px;
  background: #eee;
  border-radius: 0.4em;
  margin: 10px;
-  > div {
+  > div:not(.detail-title) {
+    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
-    margin: 0 20px;
+    margin: 0 8px;
  }
 }
 .detail-item:hover {
@@ -105,8 +111,6 @@ h4 {
  transform: translateY(-4px);
  > .detail-title {
    opacity: 1;
-
-    top: 5px;
  }
 }

--- a/seller/src/views/home/home.vue
+++ b/seller/src/views/home/home.vue
@@ -22,7 +22,7 @@
              <div>店铺状态：{{ userData.storeDisable == "OPEN" ? "开启中" : "关闭" }}</div>
            </div>
            <div class="box-item" @click="im()">
-              <el-button type="info" :loading="load">点击登录客服</el-button>
+              <el-button type="warning" :loading="load">点击登录客服</el-button>
            </div>
          </div>

--- a/seller/src/views/lili-components/affix-time.vue
+++ b/seller/src/views/lili-components/affix-time.vue
@@ -125,13 +125,15 @@ export default {
        this.selectedWay.searchType = "";
        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;
--- a/seller/src/views/login.vue
+++ b/seller/src/views/login.vue
@@ -289,15 +289,42 @@ export default {

 <style lang="scss" scoped>
 .login {
-  height: 100%;
-  background: url("../assets/background.png") no-repeat;
-  background-size: 100%;
-  background-position-y: bottom;
+  min-height: 100vh;
+  width: 100%;
+  box-sizing: border-box;
  background-color: #fff;
+  background-image: url("../assets/background.png");
+  background-repeat: no-repeat;
+  background-position: center bottom;
+  background-size: 100% auto;
  display: flex;
  align-items: center;
  justify-content: center;

+  :deep(.el-input__wrapper) {
+    background-color: #fff !important;
+    box-shadow: 0 0 0 1px var(--el-border-color) inset !important;
+
+    &.is-focus {
+      box-shadow: 0 0 0 1px var(--el-border-color) inset !important;
+    }
+  }
+
+  :deep(.el-input__inner) {
+    background-color: transparent !important;
+
+    &:-webkit-autofill,
+    &:-webkit-autofill:hover,
+    &:-webkit-autofill:focus,
+    &:-webkit-autofill:active {
+      -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
+      box-shadow: 0 0 0 1000px #fff inset !important;
+      -webkit-text-fill-color: #606266 !important;
+      caret-color: #606266;
+      transition: background-color 99999s ease-out;
+    }
+  }
+
  .verify-con {
    position: absolute;
    top: 126px;
--- a/seller/src/views/main-components/tags-page-opened.vue
+++ b/seller/src/views/main-components/tags-page-opened.vue
@@ -214,6 +214,21 @@ export default {
  font-size: 13px;
  transition: all 0.2s ease;

+  &.el-tag--info.el-tag--plain {
+    color: #606266;
+    border-color: #dcdfe6;
+    background-color: #fff;
+  }
+
+  &.el-tag--info.el-tag--plain .el-tag__close {
+    color: #909399;
+
+    &:hover {
+      color: #606266;
+      background-color: transparent;
+    }
+  }
+
  & + .page-tag {
    margin-left: 0;
  }
--- a/seller/src/views/main.scss
+++ b/seller/src/views/main.scss
@@ -54,7 +54,7 @@
    display: block;
    padding-left: 180px;
    width: 100%;
-    height: 100px;
+    height: 106px;
    z-index: 20;
    box-shadow: 0 2px 1px 1px rgba(100, 100, 100, 0.1);
    transition: padding 0.3s;
@@ -81,9 +81,11 @@
  }

  .tags-con {
-    height: 40px;
+    height: 46px;
    z-index: -1;
    background: #f0f0f0;
+    display: flex;
+    align-items: center;

    .tags-outer-scroll-con {
      position: relative;
@@ -94,7 +96,11 @@

      .tags-inner-scroll-body {
        position: absolute;
-        padding: 2px 10px;
+        top: 0;
+        bottom: 0;
+        display: flex;
+        align-items: center;
+        padding: 0 10px;
        overflow: visible;
        white-space: nowrap;
        transition: left 0.3s ease;
@@ -233,10 +239,10 @@
    min-width: 740px;
    position: relative;
    left: 180px;
-    top: 100px;
+    top: 106px;
    right: 0;
    bottom: 0;
-    height: calc(100% - 110px);
+    height: calc(100% - 116px);
    width: calc(100% - 180px);
    overflow: auto;
    background-color: #f0f0f0;
--- a/seller/src/views/order/after-order/orderComplaintDetail.vue
+++ b/seller/src/views/order/after-order/orderComplaintDetail.vue
@@ -42,7 +42,36 @@
            </dl>
          </div>

-          <div class="div-form-default" v-if="complaintInfo.appealContent">
+          <div class="div-form-default" v-if="complaintInfo.complainStatus === 'WAIT_APPEAL'">
+            <h3>商家申诉</h3>
+            <dl>
+              <dt>申诉内容</dt>
+              <dd>
+                <el-input
+                  v-model="appeal.appealContent"
+                  type="textarea"
+                  maxlength="200"
+                  :rows="4"
+                  clearable
+                  style="width: 260px"
+                />
+              </dd>
+            </dl>
+            <dl>
+              <dt>申诉凭证</dt>
+              <dd>
+                <upload-pic-thumb v-model="appeal.appealImages" :limit="5" />
+              </dd>
+            </dl>
+            <dl>
+              <dt></dt>
+              <dd>
+                <el-button type="primary" :loading="submitLoading" @click="appealSubmit">提交申诉</el-button>
+              </dd>
+            </dl>
+          </div>
+
+          <div class="div-form-default" v-else-if="complaintInfo.appealContent">
            <h3>商家申诉信息</h3>
            <dl>
              <dt>申诉时间</dt>
@@ -116,50 +145,6 @@
              <dd>{{ complaintInfo.arbitrationResult }}</dd>
            </dl>
          </div>
-
-          <div class="div-form-default" v-if="complaintInfo.complainStatus != 'COMPLETE'">
-            <h3>平台仲裁</h3>
-            <dl v-if="arbitrationResultShow">
-              <dt>仲裁</dt>
-              <dd>
-                <el-input
-                  v-model="arbitrationParams.arbitrationResult"
-                  type="textarea"
-                  maxlength="200"
-                  :rows="4"
-                  clearable
-                  style="width: 260px"
-                />
-              </dd>
-            </dl>
-            <dl>
-              <dt></dt>
-              <dd style="text-align: right; display: flex; justify-content: space-between">
-                <el-button
-                  v-if="!arbitrationResultShow"
-                  :loading="submitLoading"
-                  @click="arbitrationHandle"
-                >
-                  直接仲裁结束投诉流程
-                </el-button>
-                <el-button
-                  v-if="complaintInfo.complainStatus == 'NEW'"
-                  :loading="submitLoading"
-                  @click="handleStoreComplaint"
-                >
-                  交由商家申诉
-                </el-button>
-                <el-button
-                  v-if="arbitrationResultShow"
-                  type="primary"
-                  :loading="submitLoading"
-                  @click="arbitrationHandleSubmit"
-                >
-                  提交仲裁
-                </el-button>
-              </dd>
-            </dl>
-          </div>
        </div>

        <div class="div-flow-center"></div>
@@ -173,7 +158,7 @@
            </dl>
            <dl>
              <dt>下单时间</dt>
-              <dd>{{ complaintInfo.createTime }}</dd>
+              <dd>{{ complaintInfo.orderTime || complaintInfo.createTime }}</dd>
            </dl>
            <dl>
              <dt>订单金额</dt>
@@ -205,6 +190,7 @@

 <script>
 import * as API_Order from "@/api/order";
+import uploadPicThumb from "@/views/my-components/lili/upload-pic-thumb";
 const emptyComplaint = () => ({
  id: "",
  orderComplaintCommunications: [],
@@ -212,6 +198,9 @@ const emptyComplaint = () => ({

 export default {
  name: "orderComplaintDetail",
+  components: {
+    uploadPicThumb,
+  },
  data() {
    return {
      loading: false,
@@ -224,10 +213,11 @@ export default {
        content: "",
        complainId: "",
      },
-      arbitrationParams: {
-        arbitrationResult: "",
+      appeal: {
+        orderComplaintId: "",
+        appealContent: "",
+        appealImages: [],
      },
-      arbitrationResultShow: false,
    };
  },
  methods: {
@@ -242,17 +232,6 @@ export default {
      };
      return map[v] || v || "-";
    },
-    handleStoreComplaint() {
-      API_Order.storeComplain({
-        complainStatus: "WAIT_APPEAL",
-        complainId: this.complaintInfo.id,
-      }).then((res) => {
-        if (res.success) {
-          this.$Message.success("操作成功");
-          this.getDetail();
-        }
-      });
-    },
    getDetail() {
      if (!this.id) return;
      this.loading = true;
@@ -278,22 +257,26 @@ export default {
    returnDataList() {
      this.$router.push({ name: "orderComplaint" });
    },
-    arbitrationHandle() {
-      this.arbitrationResultShow = true;
-    },
-    arbitrationHandleSubmit() {
-      if (!this.arbitrationParams.arbitrationResult) {
-        this.$Message.error("请填写仲裁内容");
+    appealSubmit() {
+      if (!this.appeal.appealContent) {
+        this.$Message.error("请填写申诉内容");
        return;
      }
      this.submitLoading = true;
-      API_Order.orderComplete(this.id, this.arbitrationParams)
+      const appealImages = Array.isArray(this.appeal.appealImages)
+        ? this.appeal.appealImages
+        : [];
+      API_Order.appeal({
+        orderComplaintId: this.id,
+        appealContent: this.appeal.appealContent,
+        appealImages,
+      })
        .then((res) => {
          this.submitLoading = false;
          if (res.success) {
-            this.$Message.success("仲裁成功");
-            this.arbitrationParams.arbitrationResult = "";
-            this.arbitrationResultShow = false;
+            this.$Message.success("申诉成功");
+            this.appeal.appealContent = "";
+            this.appeal.appealImages = [];
            this.getDetail();
          }
        })
--- a/seller/src/views/promotion/coupon/coupon-receive.vue
+++ b/seller/src/views/promotion/coupon/coupon-receive.vue
@@ -3,7 +3,7 @@
    <el-button style="margin-bottom: 10px" @click="back()">返回</el-button>

    <el-card>
-      <el-form ref="searchForm" :model="searchForm" inline label-width="75px" class="search-form mb_10">
+      <el-form ref="searchForm" :model="searchForm" inline label-width="90px" class="search-form mb_10">
        <el-form-item label="优惠券名称" prop="couponName">
          <el-input
            v-model="searchForm.couponName"
@@ -64,11 +64,6 @@
      >
        <el-table-column prop="memberName" label="会员名称" min-width="130" fixed="left" />
        <el-table-column prop="couponName" label="优惠券名称" min-width="100" show-overflow-tooltip />
-        <el-table-column label="发布店铺" min-width="100">
-          <template #default="{ row }">
-            <span v-if="row">{{ (row.storeName === "platform" && "平台") || row.storeName }}</span>
-          </template>
-        </el-table-column>
        <el-table-column label="面额/折扣" width="100">
          <template #default="{ row }">
            <priceColorScheme
@@ -121,7 +116,7 @@
            </template>
          </template>
        </el-table-column>
-        <el-table-column label="有效时间" width="150">
+        <el-table-column label="有效时间" width="200">
          <template #default="{ row }">
            <template v-if="row">
              <span v-if="row.getType === 'ACTIVITY' && row.rangeDayType === 'DYNAMICTIME'">长期有效</span>
--- a/seller/src/views/shop/hotzone/components/Hotzone.vue
+++ b/seller/src/views/shop/hotzone/components/Hotzone.vue
@@ -31,9 +31,8 @@
                {{ showZoneText(zone) }}
              </div>
            </div>
-            <div class="flex">
+            <div class="hotzone-box-item-actions">
              <div class="hotzone-btn" @click="editZone(index)">修改</div>
-              &nbsp;&nbsp;&nbsp;&nbsp;
              <div class="hotzone-btn" @click="delZone(index)">删除</div>
            </div>
          </div>
@@ -239,13 +238,16 @@ export default {
  }
  > div:nth-of-type(2) {
    width: 50%;
+    min-width: 0;
    background: #f7f7f7;
+    overflow: hidden;
  }
 }

 .hotzone-add-box-body {
  height: 90%;
  overflow-y: auto;
+  overflow-x: hidden;
 }

 .hotzone-box-item-main {
@@ -256,11 +258,18 @@ export default {
 .hotzone-box-item {
  align-items: center;
  display: flex;
+  gap: 8px;
  border-bottom: 1px solid #ededed;
  font-size: 12px;
-  justify-content: space-between;
  padding: 5px 10px 0;
  width: 100%;
+  box-sizing: border-box;
+  min-width: 0;
+
+  > div:nth-child(2) {
+    flex: 1;
+    min-width: 0;
+  }
 }

 .hotzone-add-box-footer {
@@ -280,8 +289,18 @@ export default {
  cursor: pointer;
 }

+.hotzone-box-item-actions {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  gap: 8px;
+  white-space: nowrap;
+}
+
 .hotzone-box-item-text {
-  width: 200px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
  cursor: pointer;
 }

--- a/seller/src/views/shop/hotzone/components/Zone.vue
+++ b/seller/src/views/shop/hotzone/components/Zone.vue
@@ -63,7 +63,7 @@
          <img class="show-image" :src="zoneForm.img" alt />
        </div>

-        <el-form :model="zoneForm" label-width="80px">
+        <el-form :model="zoneForm" label-width="90px" class="hz-edit-form">
          <!-- <el-form-item label="图片链接：">
            <el-input v-model="zoneForm.img"></el-input>
            <el-button size="small" type="primary" @click="handleSelectImg"
@@ -240,3 +240,9 @@ export default {
  },
 };
 </script>
+
+<style scoped lang="scss">
+.hz-edit-form :deep(.el-form-item__label) {
+  white-space: nowrap;
+}
+</style>
--- a/seller/src/views/shop/hotzone/directives/addItem.js
+++ b/seller/src/views/shop/hotzone/directives/addItem.js
@@ -1,34 +1,31 @@
 import _ from '../utils'

 export default {
-  bind: function (el, binding, vnode) {
-    const MIN_LIMIT = _.MIN_LIMIT
+  mounted(el, binding) {
+    const handleMouseDown = (e) => {
+      const ctx = binding.instance
+      if (!ctx) return

-    el.addEventListener('mousedown', handleMouseDown, { passive: false })
-
-    function handleMouseDown(e) {
-      // console.log('additem', e)
      e && e.preventDefault()

      let itemInfo = {
        top: _.getDistanceY(e, el),
        left: _.getDistanceX(e, el),
        width: 0,
-        height: 0
+        height: 0,
      }
-      let container = _.getOffset(el)
+      const container = _.getOffset(el)

-      // Only used once at the beginning of init
-      let setting = {
+      const setting = {
        topPer: _.decimalPoint(itemInfo.top / container.height),
        leftPer: _.decimalPoint(itemInfo.left / container.width),
        widthPer: 0,
-        heightPer: 0
+        heightPer: 0,
      }
      let preX = _.getPageX(e)
      let preY = _.getPageY(e)

-      vnode.context.addItem(setting)// 这里去添加并发送了add通知，不应该发送通知
+      ctx.addItem(setting)

      window.addEventListener('mousemove', handleChange, { passive: false })
      window.addEventListener('mouseup', handleMouseUp, { passive: false })
@@ -36,56 +33,58 @@ export default {
      function handleChange(e) {
        e && e.preventDefault()

-        let moveX = _.getPageX(e) - preX
-        let moveY = _.getPageY(e) - preY
+        const moveX = _.getPageX(e) - preX
+        const moveY = _.getPageY(e) - preY
        preX = _.getPageX(e)
        preY = _.getPageY(e)

-        // Not consider the direction of movement first, consider only the lower right drag point
-        let minLimit = 0
-        // 添加热区时，判定鼠标释放时，满足（热区大于48*48时）条件时生效
-        let styleInfo = _.dealBR(itemInfo, moveX, moveY, minLimit)
+        const minLimit = 0
+        const styleInfo = _.dealBR(itemInfo, moveX, moveY, minLimit)

-        // Boundary value processing 改变热区大小时边界条件的处理
-        itemInfo = _.dealEdgeValue(itemInfo, styleInfo, container, vnode.context.zones)
+        itemInfo = _.dealEdgeValue(itemInfo, styleInfo, container, ctx.zones)

        Object.assign(el.lastElementChild.style, {
          top: `${itemInfo.top}px`,
          left: `${itemInfo.left}px`,
          width: `${itemInfo.width}px`,
-          height: `${itemInfo.height}px`
+          height: `${itemInfo.height}px`,
        })
      }

      function handleMouseUp() {
-        let perInfo = {
+        const perInfo = {
          topPer: _.decimalPoint(itemInfo.top / container.height),
          leftPer: _.decimalPoint(itemInfo.left / container.width),
          widthPer: _.decimalPoint(itemInfo.width / container.width),
          heightPer: _.decimalPoint(itemInfo.height / container.height),
-          img: "",
-          link: "",
-          type: "",
-          title: ""
+          img: '',
+          link: '',
+          type: '',
+          title: '',
        }

-        if (vnode.context.isOverRange()) {
-          vnode.context.overRange() // 判断超出个数限制，给overRange钩子抛回调
-        } else if (container.height < MIN_LIMIT && itemInfo.width > MIN_LIMIT) {
-          vnode.context.changeItem(Object.assign(perInfo, {
-            topPer: 0,
-            heightPer: 1
-          }), true)
-        } else if (container.width < MIN_LIMIT && itemInfo.height > MIN_LIMIT) {
-          vnode.context.changeItem(Object.assign(perInfo, {
-            leftper: 0,
-            widthPer: 1
-          }), true)
-        } else if (itemInfo.width > MIN_LIMIT && itemInfo.height > MIN_LIMIT) {
-          vnode.context.changeItem(perInfo, true)
+        if (ctx.isOverRange()) {
+          ctx.overRange()
+        } else if (container.height < _.MIN_LIMIT && itemInfo.width > _.MIN_LIMIT) {
+          ctx.changeItem(
+            Object.assign(perInfo, {
+              topPer: 0,
+              heightPer: 1,
+            }),
+            true
+          )
+        } else if (container.width < _.MIN_LIMIT && itemInfo.height > _.MIN_LIMIT) {
+          ctx.changeItem(
+            Object.assign(perInfo, {
+              leftper: 0,
+              widthPer: 1,
+            }),
+            true
+          )
+        } else if (itemInfo.width > _.MIN_LIMIT && itemInfo.height > _.MIN_LIMIT) {
+          ctx.changeItem(perInfo, true)
        } else {
-          // 当添加区域超出范围或小于最小区域（48*48）时触发，删除当亲绘制的热区并发送erase事件通知
-          vnode.context.eraseItem()
+          ctx.eraseItem()
        }

        window.removeEventListener('mousemove', handleChange)
@@ -93,9 +92,10 @@ export default {
      }
    }

-    el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.__hotzoneAddDestroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.addEventListener('mousedown', handleMouseDown, { passive: false })
+  },
+  beforeUnmount(el) {
+    el.__hotzoneAddDestroy?.()
  },
-  unbind: function (el) {
-    el.$destroy()
-  }
 }
--- a/seller/src/views/shop/hotzone/directives/changeSize.js
+++ b/seller/src/views/shop/hotzone/directives/changeSize.js
@@ -1,11 +1,12 @@
 import _ from '../utils'

 export default {
-  bind: function (el, binding, vnode) {
-    el.addEventListener('mousedown', handleMouseDown,{ passive: false })
+  mounted(el, binding) {
+    const handleMouseDown = (e) => {
+      const ctx = binding.instance
+      if (!ctx) return

-    function handleMouseDown (e) {
-      let pointer = e.target.dataset.pointer //元素上绑定的方法名
+      const pointer = e.target.dataset.pointer

      if (!pointer) {
        return
@@ -13,79 +14,81 @@ export default {

      e && e.stopPropagation()

-      let zone = el.parentNode
-      let setting = vnode.context.setting
-      let currentIndex = vnode.context.index
-      let container = _.getOffset(zone.parentNode)
+      const zone = el.parentNode
+      const setting = ctx.setting
+      const currentIndex = ctx.index
+      const container = _.getOffset(zone.parentNode)
      let itemInfo = {
        width: _.getOffset(zone).width || 0,
        height: _.getOffset(zone).height || 0,
        top: setting.topPer * container.height || 0,
-        left: setting.leftPer * container.width || 0
+        left: setting.leftPer * container.width || 0,
      }
      let preX = _.getPageX(e)
      let preY = _.getPageY(e)
      let flag

-      // Hide the info displayed by hover
-      vnode.context.handlehideZone(true)
+      ctx.handlehideZone(true)

-      window.addEventListener('mousemove', handleChange,{ passive: false })
-      window.addEventListener('mouseup', handleMouseUp,{ passive: false })
+      window.addEventListener('mousemove', handleChange, { passive: false })
+      window.addEventListener('mouseup', handleMouseUp, { passive: false })

-      function handleChange (e) {
+      function handleChange(e) {
        e && e.preventDefault()
        flag = true

-        let moveX = _.getPageX(e) - preX
-        let moveY = _.getPageY(e) - preY
+        const moveX = _.getPageX(e) - preX
+        const moveY = _.getPageY(e) - preY

        preX = _.getPageX(e)
        preY = _.getPageY(e)

-        // Handling the situation when different dragging points are selected
-        let styleInfo = _[pointer](itemInfo, moveX, moveY)//调用对应的方法
-        // Boundary value processing
-        itemInfo = _.dealEdgeValue(itemInfo, styleInfo, container, vnode.context.$parent.zones, currentIndex)
+        const styleInfo = _[pointer](itemInfo, moveX, moveY)
+        itemInfo = _.dealEdgeValue(
+          itemInfo,
+          styleInfo,
+          container,
+          ctx.$parent.zones,
+          currentIndex
+        )

        Object.assign(zone.style, {
          top: `${itemInfo.top}px`,
          left: `${itemInfo.left}px`,
          width: `${itemInfo.width}px`,
-          height: `${itemInfo.height}px`
+          height: `${itemInfo.height}px`,
        })
      }

-      function handleMouseUp () {
+      function handleMouseUp() {
        if (flag) {
          flag = false
-          let perInfo = {
+          const perInfo = {
            topPer: _.decimalPoint(itemInfo.top / container.height),
            leftPer: _.decimalPoint(itemInfo.left / container.width),
            widthPer: _.decimalPoint(itemInfo.width / container.width),
-            heightPer: _.decimalPoint(itemInfo.height / container.height)
+            heightPer: _.decimalPoint(itemInfo.height / container.height),
          }
-          vnode.context.changeInfo(perInfo)
+          ctx.changeInfo(perInfo)

-          // 兼容数据无变更情况下导致 computed 不更新，数据仍为 px 时 resize 出现的问题
          Object.assign(zone.style, {
            top: `${itemInfo.top}px`,
            left: `${itemInfo.left}px`,
            width: `${itemInfo.width}px`,
-            height: `${itemInfo.height}px`
+            height: `${itemInfo.height}px`,
          })
        }
-        // Show the info
-        vnode.context.handlehideZone(false)
+        ctx.handlehideZone(false)

        window.removeEventListener('mousemove', handleChange)
        window.removeEventListener('mouseup', handleMouseUp)
      }
    }

-    el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.__hotzoneResizeDestroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.addEventListener('mousedown', handleMouseDown, { passive: false })
+  },
+  beforeUnmount(el) {
+    el.__hotzoneResizeDestroy?.()
  },
-  unbind: function (el) {
-    el.$destroy()
-  }
 }
--- a/seller/src/views/shop/hotzone/directives/dragItem.js
+++ b/seller/src/views/shop/hotzone/directives/dragItem.js
@@ -1,30 +1,31 @@
 import _ from '../utils'

 export default {
-  bind: function (el, binding, vnode) {
-    el.addEventListener('mousedown', handleMouseDown)
+  mounted(el, binding) {
    let collision
-    function handleMouseDown (e) {
+    const handleMouseDown = (e) => {
+      const ctx = binding.instance
+      if (!ctx) return
+
      e && e.stopPropagation()
-      let container = _.getOffset(el.parentNode)
+      const container = _.getOffset(el.parentNode)
      let preX = _.getPageX(e)
      let preY = _.getPageY(e)
      let topPer
      let leftPer
      let flag

-      window.addEventListener('mousemove', handleChange,{ passive: false })
-      window.addEventListener('mouseup', handleMouseUp,{ passive: false })
+      window.addEventListener('mousemove', handleChange, { passive: false })
+      window.addEventListener('mouseup', handleMouseUp, { passive: false })

-      function handleChange (e) {
+      function handleChange(e) {
        e && e.preventDefault()
        flag = true
        collision = false
-        // Hide the info displayed by hover
-        vnode.context.handlehideZone(true)
+        ctx.handlehideZone(true)

-        let setting = vnode.context.setting
-        let currentIndex = vnode.context.index
+        const setting = ctx.setting
+        const currentIndex = ctx.index
        let moveX = _.getPageX(e) - preX
        let moveY = _.getPageY(e) - preY

@@ -33,7 +34,6 @@ export default {
        topPer = _.decimalPoint(moveY / container.height + setting.topPer)
        leftPer = _.decimalPoint(moveX / container.width + setting.leftPer)

-        // Hotzone moving boundary processing
        if (topPer < 0) {
          topPer = 0
          moveY = -container.height * setting.topPer
@@ -53,23 +53,20 @@ export default {
          leftPer = 1 - setting.widthPer
          moveX = container.width * (leftPer - setting.leftPer)
        }
-        // 拖拽碰撞检测
-        if (vnode.context.$parent.zones.length > 1) {
-          let currentzones = JSON.parse(JSON.stringify(vnode.context.$parent.zones)).map((zone) => {
-            return {
-              left: (zone.leftPer || 0) * container.width,
-              top: (zone.topPer || 0) * container.height,
-              width: (zone.widthPer || 0) * container.width,
-              height: (zone.heightPer || 0) * container.height
-            }
-          })
-          // 矫正
-          let changeSetting = {}
-          changeSetting.left = setting.leftPer * container.width + moveX
-          changeSetting.top = setting.topPer * container.height + moveY
-          changeSetting.width = setting.widthPer * container.width
-          changeSetting.height = setting.heightPer * container.height
-          // 碰撞检测
+
+        if (ctx.$parent.zones.length > 1) {
+          const currentzones = JSON.parse(JSON.stringify(ctx.$parent.zones)).map((zone) => ({
+            left: (zone.leftPer || 0) * container.width,
+            top: (zone.topPer || 0) * container.height,
+            width: (zone.widthPer || 0) * container.width,
+            height: (zone.heightPer || 0) * container.height,
+          }))
+          const changeSetting = {
+            left: setting.leftPer * container.width + moveX,
+            top: setting.topPer * container.height + moveY,
+            width: setting.widthPer * container.width,
+            height: setting.heightPer * container.height,
+          }
          for (let i = 0, len = currentzones.length; i < len; i++) {
            if (currentIndex !== i && _.handleEgdeCollisions(currentzones[i], changeSetting)) {
              collision = true
@@ -80,29 +77,29 @@ export default {
        el.style.transform = `translate(${moveX}px, ${moveY}px)`
      }

-      function handleMouseUp () {
+      function handleMouseUp() {
        if (flag) {
          flag = false
          el.style.transform = 'translate(0, 0)'
          if (!collision) {
-            vnode.context.changeInfo({
+            ctx.changeInfo({
              topPer,
-              leftPer
+              leftPer,
            })
          }
        }

-        // Show the info
-        vnode.context.handlehideZone(false)
+        ctx.handlehideZone(false)

        window.removeEventListener('mousemove', handleChange)
        window.removeEventListener('mouseup', handleMouseUp)
      }
    }

-    el.$destroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.__hotzoneDragDestroy = () => el.removeEventListener('mousedown', handleMouseDown)
+    el.addEventListener('mousedown', handleMouseDown)
+  },
+  beforeUnmount(el) {
+    el.__hotzoneDragDestroy?.()
  },
-  unbind: function (el) {
-    el.$destroy()
-  }
 }
--- a/seller/src/views/shop/hotzone/index.vue
+++ b/seller/src/views/shop/hotzone/index.vue
@@ -9,11 +9,11 @@
    destroy-on-close
    @close="clickClose"
  >
-    <template v-if="flag">
+    <template v-if="flag && hotzoneRes">
      <hotzone
        ref="hotzone"
-        :zonesInit="res.zoneInfo"
-        :image="res.img"
+        :zonesInit="hotzoneRes.zoneInfo"
+        :image="hotzoneRes.img"
        @change="changeHotzone"
      />
    </template>
@@ -33,25 +33,34 @@ export default {
  data() {
    return {
      flag: false,
+      hotzoneRes: null,
    };
  },
-  props: ["res"],
  methods: {
    changeHotzone(info) {
+      if (this.hotzoneRes) {
+        this.hotzoneRes.zoneInfo = info;
+      }
      this.$emit("changeZone", info);
    },
    clickClose() {
      this.flag = false;
+      this.hotzoneRes = null;
      this.$emit("closeFlag", false);
    },
    clickOK() {
      this.clickClose();
    },
-    open() {
+    open(val) {
+      this.hotzoneRes = val || null;
+      if (this.hotzoneRes && !this.hotzoneRes.zoneInfo) {
+        this.hotzoneRes.zoneInfo = [];
+      }
      this.flag = true;
    },
    close() {
      this.flag = false;
+      this.hotzoneRes = null;
    },
  },
 };
--- a/seller/src/views/shop/modelForm.vue
+++ b/seller/src/views/shop/modelForm.vue
@@ -49,11 +49,13 @@
        <draggable
          class="model-form-list"
          v-model="data.list"
-          v-bind="{ group: 'model', ghostClass: 'ghost' }"
+          :item-key="getModelItemKey"
+          group="model"
+          ghost-class="ghost"
          @end="handleMoveEnd"
          @add="handleModelAdd"
        >
-          <template v-for="(element, index) in data.list" :key="element.key || index">
+          <template #item="{ element, index }">
            <model-form-item
              v-if="element && element.key"
              :element="element"
@@ -190,6 +192,9 @@ export default {
    };
  },
  methods: {
+    getModelItemKey(element) {
+      return element.model || element.key || element.type;
+    },
    handleSelectLink(item, index) {
      if (item) this.selectedNav = item;
      this.$refs.liliDialog.open("link");
@@ -238,16 +243,18 @@ export default {
    },
    handleModelAdd(evt) {
      const newIndex = evt.newIndex;
-
-      this.data.list[newIndex] = JSON.parse(JSON.stringify(this.data.list[newIndex]));
-      const key = Date.parse(new Date()) + "_" + Math.ceil(Math.random() * 99999);
+      const current = this.data.list[newIndex];
+      if (!current || current.key) {
+        return;
+      }
+      const key = Date.now() + "_" + Math.ceil(Math.random() * 99999);
      this.data.list[newIndex] = {
-        ...this.data.list[newIndex],
+        ...JSON.parse(JSON.stringify(current)),
        options: {
-          ...this.data.list[newIndex].options,
+          ...current.options,
        },
        key,
-        model: this.data.list[newIndex].type + "_" + key,
+        model: current.type + "_" + key,
      };
    },
  },
--- a/seller/src/views/shop/modelList/seckill-only-album.vue
+++ b/seller/src/views/shop/modelList/seckill-only-album.vue
@@ -16,35 +16,31 @@
      </div>
    </div>
    <div class="section">
-      <swiper ref="mySwiper" :options="swiperOptions">
-        <swiper-slide
-          v-for="(item, index) in options.list[0].goodsList"
-          :key="index"
-        >
-          <div class="content">
-            <img :src="item.img" width="140" height="140" :alt="item.name" />
-            <div class="ellipsis">{{ item.name }}</div>
-            <div>
-              <span>{{ $filters.unitPrice(item.price, "￥") }}</span>
-              <span>{{ $filters.unitPrice(item.originalPrice, "￥") }}</span>
+      <div ref="swiperEl" class="swiper">
+        <div class="swiper-wrapper">
+          <div
+            class="swiper-slide"
+            v-for="(item, index) in options.list[0].goodsList"
+            :key="index"
+          >
+            <div class="content">
+              <img :src="item.img" width="140" height="140" :alt="item.name" />
+              <div class="ellipsis">{{ item.name }}</div>
+              <div>
+                <span>{{ $filters.unitPrice(item.price, "￥") }}</span>
+                <span>{{ $filters.unitPrice(item.originalPrice, "￥") }}</span>
+              </div>
            </div>
          </div>
-        </swiper-slide>
-      </swiper>
+        </div>
+      </div>
    </div>
  </div>
 </template>
 <script>
-import { Swiper, SwiperSlide, directive } from "vue-awesome-swiper";
+import Swiper from "swiper";
 import "swiper/swiper-bundle.css";
 export default {
-  components: {
-    Swiper,
-    SwiperSlide,
-  },
-  directives: {
-    swiper: directive,
-  },
  props: {
    data: {
      type: Object,
@@ -62,12 +58,7 @@ export default {
      minutes: "00", // 分钟
      seconds: "00", // 秒
      interval: undefined, // 定时器
-      swiperOptions: {
-        // 轮播图参数
-        slidesPerView: 5,
-        autoplay: true,
-        loop: true,
-      },
+      swiperInstance: null,
    };
  },
  watch: {
@@ -94,11 +85,26 @@ export default {
  },
  mounted() {
    this.countDown(this.options.list);
+    this.initSwiper();
  },
  beforeUnmount() {
    clearInterval(this.interval);
+    if (this.swiperInstance) {
+      this.swiperInstance.destroy(true, true);
+      this.swiperInstance = null;
+    }
  },
  methods: {
+    initSwiper() {
+      if (!this.$refs.swiperEl) {
+        return;
+      }
+      this.swiperInstance = new Swiper(this.$refs.swiperEl, {
+        slidesPerView: 5,
+        autoplay: true,
+        loop: true,
+      });
+    },
    // 倒计时
    countDown(list) {
      /**
--- a/seller/src/views/shop/modelList/seckill.vue
+++ b/seller/src/views/shop/modelList/seckill.vue
@@ -16,35 +16,31 @@
      </div>
    </div>
    <div class="section">
-      <swiper ref="mySwiper" :options="swiperOptions">
-        <swiper-slide
-          v-for="(item, index) in options.list[0].goodsList"
-          :key="index"
-        >
-          <div class="content">
-            <img :src="item.img" width="140" height="140" :alt="item.name" />
-            <div class="ellipsis">{{ item.name }}</div>
-            <div>
-              <span>{{ $filters.unitPrice(item.price, "￥") }}</span>
-              <span>{{ $filters.unitPrice(item.originalPrice, "￥") }}</span>
+      <div ref="swiperEl" class="swiper">
+        <div class="swiper-wrapper">
+          <div
+            class="swiper-slide"
+            v-for="(item, index) in options.list[0].goodsList"
+            :key="index"
+          >
+            <div class="content">
+              <img :src="item.img" width="140" height="140" :alt="item.name" />
+              <div class="ellipsis">{{ item.name }}</div>
+              <div>
+                <span>{{ $filters.unitPrice(item.price, "￥") }}</span>
+                <span>{{ $filters.unitPrice(item.originalPrice, "￥") }}</span>
+              </div>
            </div>
          </div>
-        </swiper-slide>
-      </swiper>
+        </div>
+      </div>
    </div>
  </div>
 </template>
 <script>
-import { Swiper, SwiperSlide, directive } from "vue-awesome-swiper";
+import Swiper from "swiper";
 import "swiper/swiper-bundle.css";
 export default {
-  components: {
-    Swiper,
-    SwiperSlide,
-  },
-  directives: {
-    swiper: directive,
-  },
  props: {
    data: {
      type: Object,
@@ -62,12 +58,7 @@ export default {
      minutes: "00", // 分钟
      seconds: "00", // 秒
      interval: undefined, // 定时器
-      swiperOptions: {
-        // 轮播图参数
-        slidesPerView: 5,
-        autoplay: true,
-        loop: true,
-      },
+      swiperInstance: null,
    };
  },
  watch: {
@@ -94,11 +85,26 @@ export default {
  },
  mounted() {
    this.countDown(this.options.list);
+    this.initSwiper();
  },
  beforeUnmount() {
    clearInterval(this.interval);
+    if (this.swiperInstance) {
+      this.swiperInstance.destroy(true, true);
+      this.swiperInstance = null;
+    }
  },
  methods: {
+    initSwiper() {
+      if (!this.$refs.swiperEl) {
+        return;
+      }
+      this.swiperInstance = new Swiper(this.$refs.swiperEl, {
+        slidesPerView: 5,
+        autoplay: true,
+        loop: true,
+      });
+    },
    // 倒计时
    countDown(list) {
      /**
--- a/seller/src/views/shop/renovation.vue
+++ b/seller/src/views/shop/renovation.vue
@@ -1,23 +1,36 @@
 <template>
  <div class="renovation">
-    <div class="model-list">
-      <div class="classification-title">基础模块</div>
-      <draggable tag="ul" :list="modelData" v-bind="{group:{ name:'model', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"   >
-        <li v-for="(model, index) in modelData" :key="index" class="model-item">
-          <el-icon><Picture /></el-icon>
-          <span>{{model.name}}</span>
-        </li>
-      </draggable>
-    </div>
-    <div class="show-content">
-      <model-form ref="modelForm" :data="modelForm"></model-form>
-    </div>
-    <div class="btn-bar" :class="{'top':isHiddenBar}">
+    <div class="btn-bar">
      <el-button type="primary" :loading="submitLoading" @click="saveTemplate">保存模板</el-button>
      <el-button class="ml_10" @click="resetTemplate">还原模板</el-button>
      <el-button class="ml_10" @click="witeLocalStore">将装修内容写入到本地</el-button>
      <el-button class="ml_10" v-if="hasCache" @click="clearCache">清空本地装修缓存</el-button>
    </div>
+    <div class="renovation-main">
+      <div class="model-list">
+        <div class="classification-title">基础模块</div>
+        <draggable
+          tag="ul"
+          :list="modelData"
+          :item-key="getModelKey"
+          :clone="cloneModel"
+          :group="{ name: 'model', pull: 'clone', put: false }"
+          :sort="false"
+          ghost-class="ghost"
+          handle=".model-item"
+        >
+          <template #item="{ element: model }">
+            <li class="model-item">
+              <el-icon><Picture /></el-icon>
+              <span>{{ model.name }}</span>
+            </li>
+          </template>
+        </draggable>
+      </div>
+      <div class="show-content">
+        <model-form ref="modelForm" :data="modelForm"></model-form>
+      </div>
+    </div>
  </div>
 </template>
 <script>
@@ -33,9 +46,7 @@ export default {
    Picture,
  },
  mounted() {
-    const setting = window.localStorage.getItem('seller-setting') ? JSON.parse(window.localStorage.getItem('seller-setting')) : {};
-    this.isHiddenBar = setting.isUseTabsRouter
-     const cache = this.getStore('managerPCPageCache')
+    const cache = this.getStore('managerPCPageCache')
    this.hasCache = !!cache;
      if(cache){
        this.$Modal.confirm({
@@ -69,10 +80,21 @@ export default {
      modelData,
      modelForm: { list: [] },
      submitLoading: false,
-      isHiddenBar:true,
    };
  },
  methods: {
+    getModelKey(model) {
+      return model.type || model.name;
+    },
+    cloneModel(model) {
+      const key = Date.now() + "_" + Math.ceil(Math.random() * 99999);
+      const cloned = JSON.parse(JSON.stringify(model));
+      return {
+        ...cloned,
+        key,
+        model: cloned.type + "_" + key,
+      };
+    },
    clearCache(){
      this.setStore('managerPCPageCache', '')
      this.$Message.success('清除成功')
@@ -143,21 +165,49 @@ export default {
 .renovation {
  position: relative;
  display: flex;
+  flex-direction: column;
+  min-height: 100%;
+}
+.btn-bar {
+  position: sticky;
+  top: 0;
+  z-index: 99;
+  background: #fff;
+  height: 50px;
+  padding: 10px;
+  box-shadow: 1px 1px 10px #999;
+}
+.renovation-main {
+  display: flex;
+  align-items: flex-start;
+  gap: 20px;
+  flex: 1;
+  padding-top: 10px;
 }
 .model-list {
+  flex-shrink: 0;
  width: 130px;
-  height: 620px;
+  max-height: calc(100vh - 180px);
  overflow-y: auto;
  padding: 10px;
  background: #fff;
-  margin-top: 60px;
-  position: fixed;
-  z-index: 100;
+  position: sticky;
+  top: 60px;
+  z-index: 10;
  box-shadow: 1px 1px 10px #999;
  .classification-title {
    width: 100%;
    height: 30px;
    line-height: 30px;
+    text-align: center;
+  }
+  :deep(ul) {
+    width: 100%;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
  }
  .model-item {
    width: 110px;
@@ -165,9 +215,12 @@ export default {
    background: #eee;
    margin-top: 10px;
    line-height: 30px;
-    text-align: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
    color: #999;
-    transition:0.15s;
+    transition: 0.15s;
    border-radius: 4px;
    &:hover {
      background: $theme_color;
@@ -182,8 +235,8 @@ export default {
  }
 }
 .show-content {
-  margin-left: 150px;
-  margin-top: 60px;
+  flex: 1;
+  min-width: 0;
 }
 .ghost {
  background: #fff;
@@ -203,16 +256,4 @@ export default {
    line-height: 50px;
  }
 }
-.btn-bar {
-  position: fixed;
-  width: 100%;
-  background: #fff;
-  height: 50px;
-  padding: 10px;
-  box-shadow: 1px 1px 10px #999;
-  z-index: 99;
-}
-.top{
-  top: 100px;
-}
 </style>
--- a/seller/src/views/shop/shopAddress.vue
+++ b/seller/src/views/shop/shopAddress.vue
@@ -133,11 +133,22 @@ export default {
        }
      });
    },
+    resetForm() {
+      this.form = {
+        addressName: "",
+        center: "",
+        address: "",
+        mobile: "",
+      };
+    },
    add() {
      this.modalType = 0;
-      this.$refs.form.resetFields();
-      this.modalVisible = true;
      this.modalTitle = "添加自提地址";
+      this.resetForm();
+      this.modalVisible = true;
+      this.$nextTick(() => {
+        this.$refs.form?.resetFields();
+      });
    },
    edit(v) {
      this.modalType = 1;
--- a/seller/src/views/shop/shopSetting.vue
+++ b/seller/src/views/shop/shopSetting.vue
@@ -35,7 +35,7 @@
          </el-form>
        </el-tab-pane>
        <el-tab-pane label="发货地址">
-          <el-form ref="addressGoods" :model="addressGoods" label-width="100px" :rules="addressGoodsValidate">
+          <el-form ref="addressGoods" :model="addressGoods" label-width="120px" :rules="addressGoodsValidate" class="shop-setting-form">
            <el-form-item label="发货人姓名" prop="salesConsignorName">
              <el-input v-model="addressGoods.salesConsignorName" maxlength="11" clearable style="width: 20%">
              </el-input>
@@ -482,4 +482,15 @@ export default {
  margin-left: 10px;
  color: #999;
 }
+
+.shop-setting-form {
+  :deep(.el-form-item) {
+    align-items: center;
+  }
+
+  :deep(.el-form-item__label) {
+    white-space: nowrap;
+    line-height: 32px;
+  }
+}
 </style>
--- a/seller/src/views/shop/system/clerk/clerkManage.vue
+++ b/seller/src/views/shop/system/clerk/clerkManage.vue
@@ -95,9 +95,10 @@
      v-model="userEditModalVisible"
      :close-on-click-modal="false"
      width="500px"
-      top="30px"
+      align-center
+      append-to-body
    >
-      <el-form ref="form" :model="editForm" label-width="80px" :rules="formValidate">
+      <el-form ref="editFormRef" :model="editForm" label-width="100px" :rules="formValidate" class="clerk-form">
        <el-form-item label="手机号">
          <el-input v-model="mobile" disabled/>
        </el-form-item>
@@ -106,12 +107,12 @@
        </el-form-item>
        <el-form-item label="超级管理员" prop="isSuper">
          <el-radio-group v-model="editForm.isSuper">
-            <el-radio-button value="1">是</el-radio-button>
-            <el-radio-button value="0">否</el-radio-button>
+            <el-radio-button :value="1">是</el-radio-button>
+            <el-radio-button :value="0">否</el-radio-button>
          </el-radio-group>
        </el-form-item>

-        <el-form-item label="角色" prop="roles" v-if="editForm.isSuper == 0">
+        <el-form-item label="角色" prop="roles" v-if="editForm.isSuper === 0">
          <el-select v-model="editForm.roles" multiple>
            <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
@@ -132,9 +133,10 @@
      v-model="userModalVisible"
      :close-on-click-modal="false"
      width="500px"
-      top="30px"
+      align-center
+      append-to-body
    >
-      <el-form ref="form" :model="form" label-width="80px" :rules="formValidate">
+      <el-form ref="addForm" :model="form" label-width="100px" :rules="addFormRules" class="clerk-form">
        <el-form-item label="手机号" prop="mobile">
          <el-input placeholder="请输入要添加的会员手机号码" maxlength="11" style="width: 75%" v-model="form.mobile"
                 autocomplete="off" @change="checkClerks"/>
@@ -146,6 +148,7 @@
        </el-form-item>
        <el-form-item v-if="oldMember" label="用户名" prop="username">
          <el-input v-model="form.username" autocomplete="off" disabled/>
+          <div class="form-tip">该手机号已注册为平台会员，提交后将直接添加为店员</div>
        </el-form-item>

        <el-form-item label="密码" prop="password" v-if="newMember" :error="errorPass">
@@ -153,11 +156,11 @@
        </el-form-item>
        <el-form-item label="超级管理员" prop="isSuper" v-if="newMember || oldMember">
          <el-radio-group v-model="form.isSuper">
-            <el-radio-button value="1">是</el-radio-button>
-            <el-radio-button value="0">否</el-radio-button>
+            <el-radio-button :value="1">是</el-radio-button>
+            <el-radio-button :value="0">否</el-radio-button>
          </el-radio-group>
        </el-form-item>
-        <el-form-item label="角色" prop="roles" v-if="(oldMember || newMember) && form.isSuper == 0">
+        <el-form-item label="角色" prop="roles" v-if="(oldMember || newMember) && form.isSuper === 0">
          <el-select v-model="form.roles" multiple>
            <el-option v-for="item in roleList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
@@ -260,6 +263,18 @@ export default {
      total: 0, // 总数
    };
  },
+  computed: {
+    addFormRules() {
+      const rules = {
+        username: this.formValidate.username,
+        mobile: this.formValidate.mobile,
+      };
+      if (this.newMember) {
+        rules.password = this.formValidate.password;
+      }
+      return rules;
+    },
+  },
  methods: {
    // 初始化数据
    init() {
@@ -297,28 +312,43 @@ export default {
    },
    //重新校验会员
    checkAgainClerk() {
-      this.memberCheck = false
-      this.newMember = false
-      this.oldMember = false
+      this.memberCheck = false;
+      this.newMember = false;
+      this.oldMember = false;
+      this.form.username = "";
+      this.form.password = "";
+      this.form.isSuper = 0;
+      this.form.roles = [];
+      this.errorPass = "";
    },
-    //检测当前店员
+    // 检测当前手机号对应会员：无 id 为新建会员，有 id 为已有会员
    checkClerk() {
-      if (this.form.mobile) {
-        this.newMember = false
-        this.oldMember = false
-        checkClerk(this.form.mobile).then(res => {
-          if (!res.result.id) {
-            this.newMember = true
-          } else {
-            this.oldMember = true
-            this.form.username = res.result.username
-            this.form.password = res.result.password
-          }
-          this.form.isSuper = 1
-          this.memberCheck = true;
-        });
+      if (!this.form.mobile) {
+        return;
      }
-
+      this.newMember = false;
+      this.oldMember = false;
+      this.form.username = "";
+      this.form.password = "";
+      this.errorPass = "";
+      checkClerk(this.form.mobile).then((res) => {
+        if (!res.success) {
+          return;
+        }
+        if (!res.result || !res.result.id) {
+          // 平台无此会员，需新建账号并设置密码
+          this.newMember = true;
+          this.oldMember = false;
+        } else {
+          // 已有会员，仅绑定为店员，不需要也不应展示/回填密码
+          this.newMember = false;
+          this.oldMember = true;
+          this.form.username = res.result.username || "";
+          this.form.password = "";
+        }
+        this.form.isSuper = 0;
+        this.memberCheck = true;
+      });
    },
    // 搜索项部门选择
    handleSelectDep(v) {
@@ -416,10 +446,9 @@ export default {
    },
    // 确认提交
    submitUser() {
-      this.$refs.form.validate(valid => {
+      this.$refs.addForm?.validate(valid => {
        if (valid) {
-          // 添加用户 避免编辑后传入id
-          const params = JSON.parse(JSON.stringify(this.form))
+          const params = JSON.parse(JSON.stringify(this.form));
          delete params.id;
          delete params.status;
          if (this.newMember) {
@@ -431,10 +460,12 @@ export default {
              this.errorPass = "密码长度不得少于6位";
              return;
            }
-            //todo
-            params.password = this.md5(params.password)
-          } else {
-            params.password = this.form.password
+            params.password = this.md5(params.password);
+          } else if (this.oldMember) {
+            // 后端 ClerkAddDTO 对 username/password 有 @NotEmpty 校验；
+            // 已有会员走 findByMobile 分支，不会使用该 password，仅用于通过参数校验
+            params.username = this.form.username;
+            params.password = params.password || "000000";
          }
          this.submitLoading = true;
          addUser(params).then(res => {
@@ -450,21 +481,25 @@ export default {
    },
    // 添加用户
    add() {
-      // this.checkClerks();
      this.modalType = 0;
      this.modalTitle = "添加店员";
-      this.$refs.form.resetFields();
-      this.form = { // 表单
+      this.form = {
        username: "",
        mobile: "",
+        password: "",
        isSuper: 0,
        roles: [],
        departmentId: "",
-        departmentTitle: ""
-      },
-      this.oldMember = false
-      this.newMember = false
+        departmentTitle: "",
+      };
+      this.oldMember = false;
+      this.newMember = false;
+      this.memberCheck = false;
      this.userModalVisible = true;
+      this.$nextTick(() => {
+        this.$refs.addForm?.resetFields();
+        this.$refs.depTree?.clearSelect?.();
+      });
    },
    // 编辑用户
    edit(v) {
@@ -593,3 +628,17 @@ export default {
  }
 };
 </script>
+
+<style scoped lang="scss">
+.clerk-form {
+  :deep(.el-form-item__label) {
+    white-space: nowrap;
+  }
+}
+.form-tip {
+  margin-top: 4px;
+  font-size: 12px;
+  color: #909399;
+  line-height: 1.4;
+}
+</style>
--- a/seller/src/views/shop/system/role/storeRoleManage.vue
+++ b/seller/src/views/shop/system/role/storeRoleManage.vue
@@ -75,8 +75,9 @@
      :title="modalTitle"
      width="500px"
      :close-on-click-modal="false"
+      align-center
+      append-to-body
      class="permModal"
-      top="30px"
    >
      <div v-loading="treeLoading" style="position: relative; max-height: 560px; overflow: auto">
        <el-tree
@@ -115,7 +116,15 @@
      </template>
    </el-dialog>

-    <el-dialog v-model="selectIsSuperModel" title="选择菜单权限" width="800px">
+    <el-dialog
+      v-model="selectIsSuperModel"
+      title="选择菜单权限"
+      width="800px"
+      append-to-body
+      align-center
+      :close-on-click-modal="false"
+      :z-index="3500"
+    >
      <div class="btns">
        <el-button type="primary" class="btn-item" @click="setRole()">一键选中·数据权限</el-button>
        <el-button class="btn-item" @click="setRole('onlyView')">一键选中·查看权限</el-button>
@@ -295,9 +304,14 @@ export default {
    addRole() {
      this.modalType = 0;
      this.modalTitle = "添加角色";
-      this.$refs.roleForm?.resetFields();
-      delete this.roleForm.id;
+      this.roleForm = {
+        name: "",
+        description: "",
+      };
      this.roleModalVisible = true;
+      this.$nextTick(() => {
+        this.$refs.roleForm?.clearValidate();
+      });
    },
    edit(v) {
      this.modalType = 1;
--- a/seller/src/views/shop/wap/decorate.scss
+++ b/seller/src/views/shop/wap/decorate.scss
@@ -1,12 +1,27 @@

 :deep(.el-overlay) {
-  z-index: 800;
+  z-index: 2000;
 }
 .decorate-view-link{
    font-size: 12px;
    margin: 0 4px;
+    flex: 1;
+    min-width: 0;
    color: #999;
 }
+.decorate-view-btn {
+  flex-shrink: 0;
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  gap: 8px;
+  margin-left: 10px;
+
+  :deep(.el-button) {
+    width: 76px;
+    margin: 0;
+  }
+}
 .decorate-view-style {
    border: 1px solid #ededed;
    background: #f7f7fa;
--- a/seller/src/views/shop/wap/decorate.vue
+++ b/seller/src/views/shop/wap/decorate.vue
@@ -46,7 +46,14 @@
    </el-alert>

    <!-- 右侧显示抽屉 -->
-    <el-drawer title="选择风格" :show-close="false" size="400px" v-model="styleFlag">
+    <el-drawer
+      title="选择风格"
+      :show-close="false"
+      size="400px"
+      v-model="styleFlag"
+      append-to-body
+      destroy-on-close
+    >
      <div class="drawer">
        <template v-for="(item, index) in modelData" :key="index">
          <div
@@ -67,6 +74,8 @@
      :show-close="false"
      size="400px"
      v-model="promotionsFlag"
+      append-to-body
+      destroy-on-close
    >
      <div class="drawer">
        <template v-for="(item, index) in modelData" :key="index">
@@ -185,7 +194,6 @@
                <el-button
                  @click="bindGoodsCategory(title_index)"
                  size="small"
-                  style="margin-top: 20px"
                  >选择分类</el-button
                >
              </div>
@@ -686,6 +694,7 @@ export default {
    clickDrawer(item, index) {
      this.$emit("handleDrawer", item);
      this.styleFlag = false;
+      this.promotionsFlag = false;
    },
    // 打开图片选择器
    liliDialogFlag(flag) {
@@ -705,8 +714,7 @@ export default {
        if (!val.zoneInfo) {
          val.zoneInfo = [];
        }
-        this.$refs.hotzone.flag = true;
-        this.$refs.hotzone.res = val;
+        this.$refs.hotzone.open(val);
      } else {
        this.liliDialogFlag(false);
      }
--- a/seller/src/views/shop/wap/index.vue
+++ b/seller/src/views/shop/wap/index.vue
@@ -186,25 +186,27 @@ export default {
          API_Promotions.getLiveList({
            status: "START",
            pageSize: 1,
-          }).then((res) => {
-            if (res.success && res.result.size > 0) {
-              API_Promotions.getLiveInfo(res.result.records[0].id).then(
-                (res) => {
-                  if (res.success) {
-                    this.contentData.list[newIndex].options.list.push({
-                      type: val.promotionsType,
-                      title: val.name,
-                      title1: val.subName,
-                      color1: val.subColor,
-                      bk_color: val.subBkColor,
-                      data: res.result.commodityList
-                        ? res.result.commodityList.splice(0, 2)
-                        : [],
-                    });
-                  }
-                }
-              );
+            pageNumber: 1,
+          }).then((listRes) => {
+            const records = listRes.result?.records || [];
+            if (!listRes.success || records.length === 0) {
+              this.$Message.warning("暂无进行中的直播活动");
+              return;
            }
+            API_Promotions.getLiveInfo(records[0].id).then((infoRes) => {
+              if (infoRes.success) {
+                this.contentData.list[newIndex].options.list.push({
+                  type: val.promotionsType,
+                  title: val.name,
+                  title1: val.subName,
+                  color1: val.subColor,
+                  bk_color: val.subBkColor,
+                  data: infoRes.result.commodityList
+                    ? infoRes.result.commodityList.splice(0, 2)
+                    : [],
+                });
+              }
+            });
          });
        } else {
          API_Promotions.getAllPromotion().then((res) => {
--- a/seller/src/views/shop/wap/style.scss
+++ b/seller/src/views/shop/wap/style.scss
@@ -42,23 +42,36 @@
  text-align: center;
  height: 44px;
  border-bottom: 1px solid #ededed;
+  background: #fff;
+  flex-shrink: 0;
 }
 .content {
+  box-sizing: border-box;
  margin: 20px 0;
  padding: 50px 13px;
  width: 360px;
  background: url("../../../assets/iPhoneX_model.png") no-repeat;
  height: 780px;
-  background-size: 360px;
+  background-size: 100% 100%;
  overflow: hidden;
-  > .component,
-  .draggable {
-    height: 590px;
+  display: flex;
+  flex-direction: column;
+
+  > .draggable {
+    flex: 1;
+    width: 100%;
+    min-height: 0;
+    overflow-x: hidden;
    overflow-y: auto;
    background: #ebebeb;
-  }
-  > .draggable {
    padding-bottom: 100px;
+    box-sizing: border-box;
+  }
+
+  > .component,
+  .draggable :deep(.component) {
+    max-width: 100%;
+    box-sizing: border-box;
  }
 }
 .list {
--- a/seller/src/views/shop/wap/template/tpl_banner.vue
+++ b/seller/src/views/shop/wap/template/tpl_banner.vue
@@ -13,14 +13,6 @@
 export default {
  title: "导航栏",
  props: ["res"],
-  watch: {
-    res: {
-      handler(newValue, oldValue) {
-          this['res'] = newValue;
-      },
-      deep: true
-    }
-  }
 };
 </script>
 <style lang="scss" scoped>
--- a/seller/src/views/shop/wap/template/tpl_goods.vue
+++ b/seller/src/views/shop/wap/template/tpl_goods.vue
@@ -1,11 +1,11 @@
 <template>
-  <div class="layout">
+  <div v-if="goodsBlock" class="layout">
    <div class="goods-cell-title">
      <div
        class="goods-item-title"
        :class="{ selected: selected.index == index }"
        @click="handleClickTitle(title, index)"
-        v-for="(title, index) in res.list[0].titleWay"
+        v-for="(title, index) in goodsBlock.titleWay"
        :key="index"
      >
        <h4>{{ title.title }}</h4>
@@ -13,36 +13,29 @@
      </div>
    </div>
    <div class="goods-list">
-      <div
-        v-if="
-          item.___index != undefined
-            ? selected.index == item.___index
-            : selected.val == item.type
-        "
-        class="goods-item"
-        v-for="(item, item_index) in res.list[0].listWay"
-        :key="item_index"
-      >
-        <div class="goods-img">
-          <el-icon
-            :size="20"
-            color="#e1251b"
-            @click="closeGoods(item, item_index)"
-            class="goods-icon"
-          >
-            <CircleClose />
-          </el-icon>
-          <img :src="item.img" alt />
-        </div>
-        <div class="goods-desc">
-          <div class="goods-title">
-            {{ item.title }}
+      <template v-for="(item, item_index) in goodsBlock.listWay" :key="item_index">
+        <div v-if="isGoodsVisible(item)" class="goods-item">
+          <div class="goods-img">
+            <el-icon
+              :size="20"
+              color="#e1251b"
+              @click="closeGoods(item, item_index)"
+              class="goods-icon"
+            >
+              <CircleClose />
+            </el-icon>
+            <img :src="item.img" alt />
          </div>
-          <div class="goods-bottom">
-            <div class="goods-price">￥{{ $filters.unitPrice(item.price) }}</div>
+          <div class="goods-desc">
+            <div class="goods-title">
+              {{ item.title }}
+            </div>
+            <div class="goods-bottom">
+              <div class="goods-price">￥{{ $filters.unitPrice(item.price) }}</div>
+            </div>
          </div>
        </div>
-      </div>
+      </template>
    </div>
  </div>
 </template>
@@ -53,29 +46,46 @@ export default {
  data() {
    return {
      selected: {
-        // 已选数据
        index: 0,
+        val: "",
      },
    };
  },
  props: ["res"],
+  computed: {
+    goodsBlock() {
+      return this.res?.list?.[0] || null;
+    },
+  },
  watch: {
-    res: {
+    goodsBlock: {
      handler(val) {
-        // 监听父级的值 如果有值将值赋给selected
-        if (val) {
-          this.selected.val = this.res.list[0].listWay[0].type;
+        if (!val) {
+          return;
+        }
+        const firstGoods = (val.listWay || []).find(Boolean);
+        if (firstGoods) {
+          this.selected.val = firstGoods.type;
+        } else if (val.titleWay?.[0]?.title) {
+          this.selected.val = val.titleWay[0].title;
        }
      },
      immediate: true,
    },
  },
  methods: {
-    // 删除商品
-    closeGoods(val, index) {
-      this.res.list[0].listWay.splice(index, 1);
+    isGoodsVisible(item) {
+      if (!item) {
+        return false;
+      }
+      if (item.___index != undefined) {
+        return this.selected.index == item.___index;
+      }
+      return this.selected.val == item.type;
+    },
+    closeGoods(val, index) {
+      this.goodsBlock.listWay.splice(index, 1);
    },
-    // 切换商品列表
    handleClickTitle(val, index) {
      this.selected.index = index;
      this.selected.val = val.title;
--- a/seller/src/views/statistics/order.vue
+++ b/seller/src/views/statistics/order.vue
@@ -2,7 +2,7 @@
  <div class="wrapper">
    <el-affix :offset="100">
      <el-card class="card fixed-bottom">
-        <affixTime @selected="clickBreadcrumb" />
+        <affixTime :closeShop="true" @selected="clickBreadcrumb" />
      </el-card>
    </el-affix>

@@ -183,11 +183,6 @@
                  {{ $filters.unitPrice(row.flowPrice, "￥") }}</span>
              </template>
            </el-table-column>
-            <el-table-column label="操作" width="80" align="center">
-              <template #default="{ row }">
-                <a v-if="row" class="link-text" @click="goDetail(row)">查看</a>
-              </template>
-            </el-table-column>
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="退单" name="refund">
@@ -236,11 +231,6 @@
                <span v-if="row">{{ $filters.unitPrice(row.flowPrice || 0, "￥") }}</span>
              </template>
            </el-table-column>
-            <el-table-column label="操作" width="90" align="center">
-              <template #default="{ row }">
-                <a v-if="row" class="link-text" @click="goDetail(row)">查看</a>
-              </template>
-            </el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
@@ -413,11 +403,6 @@ export default {
    },
  },
  methods: {
-    goDetail(row) {
-      const sn = row.sn;
-      const path = this.orderOrRefund === "order" ? "order-detail" : "return-goods-order-detail";
-      this.$router.push({ path, query: { sn } });
-    },
    // 订单图
    initOrderChart() {
      // 默认已经加载 legend-filter 交互
--- a/seller/src/views/statistics/traffic.vue
+++ b/seller/src/views/statistics/traffic.vue
@@ -2,7 +2,7 @@
  <div class="wrapper">
    <el-affix :offset="100">
      <el-card class="card fixed-bottom">
-        <affixTime @selected="clickBreadcrumb" />
+        <affixTime :closeShop="true" @selected="clickBreadcrumb" />
      </el-card>
    </el-affix>
    <el-card class="card">
--- a/seller/src/views/sys/oss-manage/ossManage.scss
+++ b/seller/src/views/sys/oss-manage/ossManage.scss
@@ -161,6 +161,9 @@
      box-sizing: border-box;
      margin: 0 13px 8px;
      position: relative;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
      .card {
        width: 120px;
        height: 120px;
@@ -172,12 +175,19 @@
        img {
          width: 100%;
          height: 100%;
+          object-fit: cover;
        }
-        .checkbox {
+        .card-checkbox {
          position: absolute;
-          top: 10px;
-          right: 10px;
+          top: 8px;
+          right: 8px;
          z-index: 1000;
+          height: auto;
+          margin: 0;
+
+          :deep(.el-checkbox__label) {
+            display: none;
+          }
        }
        .preview {
          width: 100%;
@@ -226,35 +236,6 @@
    display: flex;
    flex-direction: row-reverse;
  }
-  /* Checkbox默认的样式 */
-  .check-box {
-    .ivu-checkbox {
-      position: absolute;
-      right: 10px;
-      top: 10px;
-      z-index: 100;
-    }
-  }
-  /* 覆盖iView默认的Checkbox样式 */
-  .ivu-checkbox-wrapper {
-    /*font-size: 16px; !* 修改字体大小 *!*/
-    /*color: #495060; !* 修改文本颜色 *!*/
-    /* 添加其他需要的样式 */
-  }
-  .ivu-checkbox-inner {
-    /*width: 20px; !* 修改选框大小 *!*/
-    /*height: 20px;*/
-    /*border-color: #dcdee2; !* 修改边框颜色 *!*/
-    /* 添加其他需要的样式 */
-  }
-  /* 当Checkbox被选中时的样式 */
-  .ivu-checkbox-checked .ivu-checkbox-inner {
-    /*background-color: #2db7f5; !* 修改选中时的背景颜色 *!*/
-  }
-  /* 当Checkbox不可用时的样式 */
-  .ivu-checkbox-disabled .ivu-checkbox-inner {
-    /*background-color: #e9e9e9; !* 修改禁用状态下的背景颜色 *!*/
-  }

  .demo-tree-render .ivu-tree-title{
    width: 94%;
--- a/seller/src/views/sys/oss-manage/ossManage.vue
+++ b/seller/src/views/sys/oss-manage/ossManage.vue
@@ -165,37 +165,39 @@
                  <el-checkbox-group v-model="selectedOss" @change="selectOssChange">
                    <div class="img-box">
                      <div v-for="(item, index) in data" :key="index" class="img-item">
-                        <el-checkbox :value="item.id + ',' + item.url" class="check-box">
-                          <div
-                            class="card"
-                            @mouseenter="onMouseOver(item, index)"
-                            @mouseleave="onMouseOut(item, index)"
-                          >
-                            <img :src="item.url" alt="" />
-                            <div v-if="item.isShowPreview" class="preview">
-                              <div @click.prevent="download(item)">
-                                <el-tooltip content="下载" placement="top">
-                                  <el-icon :size="18"><Download /></el-icon>
-                                </el-tooltip>
-                              </div>
-                              <div @click.prevent="remove(item)">
-                                <el-tooltip content="删除" placement="top">
-                                  <el-icon :size="18"><Delete /></el-icon>
-                                </el-tooltip>
-                              </div>
-                              <div @click.prevent="showPic(item)">
-                                <el-tooltip content="预览" placement="top">
-                                  <el-icon :size="22"><View /></el-icon>
-                                </el-tooltip>
-                              </div>
+                        <div
+                          class="card"
+                          :class="{ 'custom-checkbox-card-checked': selectedOss.includes(item.id + ',' + item.url) }"
+                          @mouseenter="onMouseOver(item, index)"
+                          @mouseleave="onMouseOut(item, index)"
+                        >
+                          <el-checkbox
+                            :value="item.id + ',' + item.url"
+                            class="card-checkbox"
+                            @click.stop
+                          />
+                          <img :src="item.url" alt="" />
+                          <div v-if="item.isShowPreview" class="preview">
+                            <div @click.prevent="download(item)">
+                              <el-tooltip content="下载" placement="top">
+                                <el-icon :size="18"><Download /></el-icon>
+                              </el-tooltip>
+                            </div>
+                            <div @click.prevent="remove(item)">
+                              <el-tooltip content="删除" placement="top">
+                                <el-icon :size="18"><Delete /></el-icon>
+                              </el-tooltip>
+                            </div>
+                            <div @click.prevent="showPic(item)">
+                              <el-tooltip content="预览" placement="top">
+                                <el-icon :size="22"><View /></el-icon>
+                              </el-tooltip>
                            </div>
                          </div>
-                        </el-checkbox>
-                        <div>
-                          <el-tooltip :content="item.name" placement="bottom">
-                            <div class="text">{{ item.name }}</div>
-                          </el-tooltip>
                        </div>
+                        <el-tooltip :content="item.name" placement="bottom">
+                          <div class="text">{{ item.name }}</div>
+                        </el-tooltip>
                      </div>
                    </div>
                  </el-checkbox-group>