fix:修改图片位置

71e49817 · linjinhong · 433632d1 · 71e49817 · 71e49817 · 71e49817
Commit 71e49817 authored Feb 04, 2026 by linjinhong
Hide whitespace changes
Inline Side-by-side

Showing with 109 additions and 42 deletions

src/server/utils/store.js
+1 -2

src/store/index.js
+16 -1

src/views/design/head/index.vue
+28 -12

src/views/design/main/imgSetting.vue
+7 -8

src/views/design/main/index.vue
+57 -19

No files found.
--- a/src/server/utils/store.js
+++ b/src/server/utils/store.js
@@ -57,7 +57,6 @@ function getLatestOrderByPrefixNewId(targetNewId, type) {
  // 正则匹配：以targetNewId开头，后跟-数字结尾（严格匹配cacheKey格式）
  const prefixReg = new RegExp(`^${targetNewId}-(\\d+)$`);
  let matchedKeyWithSuffix = [];
-  console.log(60, orderCacheMap);
  // 遍历缓存，筛选匹配前缀的订单
  orderCacheMap.forEach((order, cacheKey) => {
@@ -139,7 +138,7 @@ function refreshOrderCache() {
      samePrefixItems.forEach((sameItem, index) => {
        const cacheKey = `${itemPrefix}-${index + 1}`;
        newCacheMap.set(cacheKey, sameItem);
-        console.log("cacheKey", cacheKey);
+        // console.log("cacheKey", cacheKey);
      });
    }
  });

--- a/src/store/index.js
+++ b/src/store/index.js
@@ -73,6 +73,15 @@ export default new Vuex.Store({
        h: 0,
        w: 0,
      },
+      {
+        label: "40×50",
+        value: 99,
+        row: 40,
+        col: 50,
+        h: 0,
+        w: 0,
+        disabled: true,
+      },
    ],
    grid: [],
  },
@@ -113,7 +122,10 @@ export default new Vuex.Store({
    setOrderType(state, value) {
      state.orderType = value;
    },
-    setGrid(state) {
+    setGrid(state, arr) {
+      if (arr) {
+        return (state.grid = [arr]);
+      }
      state.grid.forEach((el) => {
        if (el.value == 0) {
          let proportion = state.WHproportion;
@@ -142,6 +154,9 @@ export default new Vuex.Store({
        } else if (el.value == 6) {
          el.h = 660 * 1.4;
          el.w = 540 * 1.4;
+        } else if (el.value == 99) {
+          el.h = 900;
+          el.w = 720;
        }
      });
    },

--- a/src/views/design/head/index.vue
+++ b/src/views/design/head/index.vue
@@ -124,8 +124,13 @@ export default {
    // console.log(pkg, "pkg");
    this.$nextTick(() => {
      this.$refs.searchRef?.focus();
-      this.selectGridIndex = 0;
+      if (this.desktopDevice !== 3) {
-      this.setting.gridValue = 0;
+        this.selectGridIndex = 0;
+        this.setting.gridValue = 0;
+      } else {
+        this.selectGridIndex = 5;
+        this.setting.gridValue = 5;
+      }
    });
    this.$store.commit("changeDesktopDevice", getDesktopDevice());
  },
@@ -149,7 +154,6 @@ export default {
    },
    config: {
      handler(val) {
-        // console.log(99999999, val);\
        this.newApiApiHost = this.getDomainFromUrl(val.apiApiHost);
      },
      immediate: true,
@@ -520,7 +524,7 @@ export default {
          });
        }
        //如果该数据的图片第一次出现且素材图大于1张则把该数据储存到本地
-        if (newImgList.length > 1 && !bool) {
+        if (newImgList.length > 1 && !bool && this.desktopDevice == 3) {
          addToOrderInfo(this.detail);
          console.log("本地数据addToOrderInfo：", getOrderInfoMap());
        }
@@ -737,7 +741,13 @@ export default {
      this.selectedOption = command; // 根据选中的项来更新 selectedOption
    },
    changeDesktopDeviceFn(value) {
-      console.log("changeDesktopDeviceFn", value);
+      if (value === 3) {
+        this.setting.gridValue == 5;
+        this.selectGridIndex = 5;
+      } else {
+        this.selectGridIndex = 0;
+        this.setting.gridValue = 0;
+      }
      setDesktopDevice(value);
      this.$store.commit("changeDesktopDevice", value);
      this.$store.commit("changeImgList", []);
@@ -889,8 +899,8 @@ export default {
            <el-option label="惠立彩" :value="3"></el-option>
          </el-select>
        </div>
-        <div style="display: flex;" v-if="desktopDevice != 3">
+        <div style="display: flex;">
-          <div class="selectInput">
+          <div class="selectInput" v-if="desktopDevice != 3">
            <div>驱动版本：</div>
            <el-select
@@ -908,18 +918,24 @@ export default {
            trigger="click"
            @command="command"
            :hide-on-click="false"
+            :disabled="desktopDevice == 3"
          >
            <el-button style="height: 100%;margin-right: 0" size="small"
              >{{ grid[selectGridIndex]?.label }}
            </el-button>
            <el-dropdown-menu slot="dropdown">
-              <el-dropdown-item :command="i" v-for="(it, i) in grid" :key="i">
+              <el-dropdown-item
+                :command="i"
+                v-for="(it, i) in grid"
+                :key="i"
+                :disabled="it.disabled"
+              >
                {{ it.label }}
              </el-dropdown-item>
            </el-dropdown-menu>
          </el-dropdown>
-          <el-tooltip content="图片">
+          <el-tooltip content="图片" v-if="desktopDevice != 3">
            <el-upload
              accept=".png"
              action=""
@@ -934,7 +950,7 @@ export default {
            </el-upload>
          </el-tooltip>
-          <el-tooltip content="背景色">
+          <el-tooltip content="背景色" v-if="desktopDevice != 3">
            <el-color-picker
              style="margin-right: 3px"
              v-model="selectBgColor"
@@ -1031,7 +1047,7 @@ export default {
              </el-form>
            </div>
            <el-tooltip slot="reference" content="设置">
-              <el-button style="margin-right: 8px" size="small">
+              <el-button style="margin:0 8px" size="small">
                <img
                  style="width: 18px;height: 18px"
                  src="@/static/icon/shezhi.png"
@@ -1041,7 +1057,7 @@ export default {
            </el-tooltip>
          </el-popover>
        </div>
-        <div v-else>
+        <div v-if="desktopDevice == 3">
          <div class="selectInput">
            <div>当前打印：</div>

--- a/src/views/design/main/imgSetting.vue
+++ b/src/views/design/main/imgSetting.vue
@@ -47,9 +47,12 @@ export default {
      immediate: true,
    },
    item: {
-      handler() {
+      handler(val) {
-        // console.log(789, this.item);
+        console.log("item11", this.item);
+        if (val && this.newDesktopDevice == 3) {
+          return;
+        }
        if (this.item) {
          this.getCurrentItem(this.item);
        } else {
@@ -67,6 +70,7 @@ export default {
            r: 0,
          };
        }
+        console.log("item", this.item);
      },
      immediate: true,
      deep: true,
@@ -77,13 +81,8 @@ export default {
    unitToPx,
    getCurrentItem(item) {
      // let setting = this.$dataStore.get("setting");
-      if (item.y != 0) {
-        this.item.y = item.y - item.h / 2;
-        console.log(93, item);
-      } else {
-        item.y == 0;
-      }
+      this.item.y = item.y - item.h / 2;
      this.item.x = item.x - item.w / 2;
      this.$dataStore.set(
        "position_before_px",

--- a/src/views/design/main/index.vue
+++ b/src/views/design/main/index.vue
@@ -58,6 +58,9 @@ export default {
  },
  computed: {
    gridWH() {
+      // console.log("systemSetting", this.systemSetting);
+      // console.log("gridValue", this.systemSetting.gridValue);
      if (
        !this.systemSetting ||
        !this.grid ||
@@ -123,7 +126,7 @@ export default {
    },
    returnItem() {
-      console.log("returnItem", this.imgList[this.selectIndex]);
+      // console.log("returnItem", this.imgList[this.selectIndex]);
      if (this.selectIndex < 0 && this.imgList.length) {
        // this.showImgSetting = false;
@@ -221,8 +224,8 @@ export default {
  watch: {
    imgList: {
      async handler(newValue) {
-        console.log(223, newValue);
+        // console.log(223, newValue);
-        console.log(223, this.returnItem);
+        // console.log(223, this.returnItem);
        const image = document.getElementById("imgBox");
@@ -414,6 +417,18 @@ export default {
      },
      deep: true,
    },
+    newDesktopDevice: {
+      handler(val) {
+        // console.log(122, val);
+        if (val == 3) {
+          this.systemSetting.gridValue = 5;
+        } else {
+          this.systemSetting.gridValue = 1;
+        }
+      },
+      immediate: true,
+    },
  },
  methods: {
    // 重构为可手动触发的方法
@@ -714,7 +729,7 @@ export default {
      this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
    },
    outsideClick(e) {
-      if (this.newDesktopDevice == 3) return;
+      console.log(e);
      if (
        !(
@@ -800,17 +815,25 @@ export default {
          let h = bh / 2;
          let width_px, height_px, rate, x, y;
          let data = await that.getImageSize(files[i].url);
-          console.log("w", w);
+          console.log("data", data);
-          console.log("h", h);
+          // console.log("h", h);
          if (size && !files[i].isCut) {
            console.log("size", size);
+            if (this.newDesktopDevice == 3) {
-            width_px = that.WHproportion * mmToPx(size.width);
+              const scale = bh / data.height;
-            height_px = that.WHproportion * mmToPx(size.height);
+              width_px = data.width * scale;
-            x = w * that.WHproportion;
+              height_px = data.height * scale;
-            y = h * that.WHproportion;
+              x = (bw - data.w) / 2;
-            rate = height_px / width_px;
+              y = h;
+              rate = height_px / width_px;
+            } else {
+              width_px = that.WHproportion * mmToPx(size.width);
+              height_px = that.WHproportion * mmToPx(size.height);
+              x = w;
+              y = h;
+              rate = height_px / width_px;
+            }
          } else {
            console.log("data", data);
            rate = data.height / data.width;
@@ -843,11 +866,15 @@ export default {
            r: 0,
          });
+          console.log(that.imgList);
          that.selectIndex = that.imgList.length - 1;
          that.showImgSetting = true;
-          // that.$nextTick(() => {
+          // if (this.newDesktopDevice != 3) {
-          //   that.ev("x_center");
+          //   that.$nextTick(() => {
-          // });
+          //     that.ev("center");
+          //   });
+          // }
          // setTimeout(() => {
          //   that.ev("center");
@@ -1274,6 +1301,7 @@ export default {
  mounted() {
    this.imgHeight = window.screen.height + "px";
    this.systemSetting = this.$dataStore.get("setting");
+    // console.log(1297, this.newDesktopDevice);
    bus.$on("busEmit", (v) => {
      let { type, value, size } = v;
@@ -1433,6 +1461,7 @@ export default {
                v-for="(img, i) in selectImgList"
                :key="i"
                class="img-item"
+                :class="{ borderStyle: i == selectIndex }"
                @click.stop.prevent="
                  newDesktopDevice !== 3 && selectImg(img, i)
                "
@@ -1625,7 +1654,7 @@ export default {
      </template>
    </img-setting>
    <div
-      @click="outsideClick"
+      @click="newDesktopDevice != 3 && outsideClick"
      class="main-bg"
      :style="{ 'background-color': !isView ? '#77797a' : '#fff' }"
    >
@@ -1679,8 +1708,14 @@ export default {
              <div
                :class="{ 'no-border-grid': systemSetting.gridShow !== 1 }"
                :style="{
-                  width: gridWH.row * 30 + 'px',
+                  width:
-                  height: gridWH.col * 30 + 'px',
+                    newDesktopDevice == 3
+                      ? grid.row * 20 + 'px'
+                      : gridWH.row * 30 + 'px',
+                  height:
+                    newDesktopDevice == 3
+                      ? grid.col * 20 + 'px'
+                      : gridWH.col * 30 + 'px',
                }"
                class="grid"
                style="border-style:dashed"
@@ -1929,7 +1964,7 @@ export default {
 }
 .grid {
-  border: 1px solid gray;
+  // border: 1px solid gray;
  overflow: hidden;
  .grid-row {
@@ -2463,4 +2498,7 @@ img {
    }
  }
 }
+.borderStyle {
+  border: 3px solid #409eff;
+}
 </style>