✨ feat: 退款管理

gear-ui3/src/views/wms/stockIo/index.vue

@@ -226,14 +226,12 @@
 
 <script>
 import { listStockIo, getStockIo, delStockIo, addStockIo, updateStockIo } from "@/api/wms/stockIo";
-import { listStockIoDetail } from "@/api/wms/stockIoDetail";
 import StockIoDetailPanel from './panels/detail.vue';
-import BarcodeGenerator from './panels/barcode.vue';
 
 export default {
   name: "StockIo",
   dicts: ['stock_biz_type', 'stock_io_type', 'stock_status'],
-  components: { StockIoDetailPanel, BarcodeGenerator },
+  components: { StockIoDetailPanel },
   data() {
     return {
       // 按钮loading

gear-ui3/src/views/wms/stockIo/panels/barcode.vue

@@ -1,424 +0,0 @@
-<template>
-  <div class="barcode-3col-layout">
-    <!-- 预览区 -->
-    <div class="barcode-preview-col">
-      <div class="iframe-wrapper">
-        <iframe ref="previewIframe" class="barcode-iframe" frameborder="0" :style="iframeStyle"></iframe>
-      </div>
-    </div>
-    <!-- 右侧控制+设置区 -->
-    <div class="barcode-right-col">
-      <!-- 控制区 -->
-      <div class="barcode-control-bar">
-        <el-tabs v-model="activeTab" stretch>
-          <el-tab-pane label="排版设置" name="layout" />
-          <el-tab-pane label="二维码明细" name="detail" />
-        </el-tabs>
-      </div>
-      <!-- 设置区 -->
-      <div class="barcode-settings-panel">
-        <el-form v-if="activeTab==='layout'" label-width="80px" size="small" label-position="top">
-          <!-- 排版设置内容保持不变 -->
-          <el-form-item label="每行数量">
-            <el-input-number :controls=false controls-position="right" v-model="perRow" size="mini" :min="1" :max="10" />
-          </el-form-item>
-          <el-form-item label="二维码尺寸">
-            <el-input-number :controls=false controls-position="right" v-model="barcodeWidth" size="mini" :min="60" :max="600" />
-          </el-form-item>
-          <el-form-item label="纸张尺寸">
-            <el-select v-model="paperSize" placeholder="请选择纸张尺寸" style="width: 160px">
-              <el-option label="A4 (210mm x 297mm)" value="A4" />
-              <el-option label="A5 (148mm x 210mm)" value="A5" />
-              <el-option label="A6 (105mm x 148mm)" value="A6" />
-              <el-option label="自定义" value="custom" />
-            </el-select>
-          </el-form-item>
-          <el-form-item v-if="paperSize==='custom'" label="自定义宽度(mm)">
-            <el-input-number :controls=false controls-position="right" v-model="customPaperWidth" size="mini" :min="50" :max="500" />
-          </el-form-item>
-          <el-form-item v-if="paperSize==='custom'" label="自定义高度(mm)">
-            <el-input-number :controls=false controls-position="right" v-model="customPaperHeight" size="mini" :min="50" :max="500" />
-          </el-form-item>
-          <el-form-item label="方向">
-            <el-radio-group v-model="paperOrientation">
-              <el-radio label="portrait">纵向</el-radio>
-              <el-radio label="landscape">横向</el-radio>
-            </el-radio-group>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" @click="handlePrint">打印</el-button>
-          </el-form-item>
-        </el-form>
-        <el-form v-else label-width="80px" size="small" label-position="top">
-          <el-form-item label="二维码明细">
-            <div v-for="(cfg, idx) in barcodeConfigs" :key="idx" style="margin-bottom: 16px; border: 1px solid #eee; border-radius: 4px; padding: 12px 16px; background: #fafbfc;">
-              <div style="margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center;">
-                <span style="font-weight: bold; color: #666;">条码 {{ idx + 1 }}</span>
-                <el-button 
-                  type="text" 
-                  size="mini" 
-                  @click="saveAsImage(cfg.code, cfg.textTpl || cfg.code, idx)"
-                  icon="Download"
-                >
-                  另存为图片
-                </el-button>
-                <el-button 
-                  type="text" 
-                  size="mini" 
-                  @click="handleDelete(cfg, idx)"
-                  icon="Delete"
-                >
-                  删除
-                </el-button>
-              </div>
-              <el-form-item label="二维码内容" label-width="70px" style="margin-bottom: 8px;">
-                <el-input disabled type="textarea" v-model="cfg.code" size="mini" :autosize="{ minRows: 1, maxRows: 3 }" placeholder="请输入条码内容" />
-              </el-form-item>
-              <el-form-item label="生成数量" label-width="70px" style="margin-bottom: 8px;">
-                <el-input-number :controls=false controls-position="right" v-model.number="cfg.count" :min="1" :max="100" size="mini" />
-              </el-form-item>
-              <el-form-item label="下方文字" label-width="70px" style="margin-bottom: 0;">
-                <el-input type="textarea" v-model="cfg.textTpl" size="mini" placeholder="如 箱号" />
-              </el-form-item>
-            </div>
-          </el-form-item>
-        </el-form>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import QRCode from 'qrcode';
-export default {
-  name: 'BarcodeGenerator',
-  props: {
-    barcodes: {
-      type: Array,
-      required: true
-    }
-  },
-  data() {
-    return {
-      perRow: 3,
-      barcodeWidth: 180,
-      barcodeHeight: 180, // 二维码建议宽高一致
-      barcodeConfigs: [], // [{code, count, textTpl}]
-      previewScale: 1, // 预览缩放比例
-      activeTab: 'layout',
-      paperSize: 'A4',
-      paperOrientation: 'portrait',
-      customPaperWidth: 210,
-      customPaperHeight: 297
-    };
-  },
-  computed: {
-    expandedBarcodes() {
-      let arr = [];
-      this.barcodeConfigs.forEach(cfg => {
-        for (let i = 0; i < (cfg.count || 1); i++) {
-          arr.push(cfg.code);
-        }
-      });
-      return arr;
-    },
-    expandedBarcodeTexts() {
-      let arr = [];
-      this.barcodeConfigs.forEach(cfg => {
-        for (let i = 0; i < (cfg.count || 1); i++) {
-          // 模板替换 {{n}}
-          let text = cfg.textTpl || cfg.code;
-          text = text.replace(/\{\{n\}\}/g, i + 1);
-          arr.push(text);
-        }
-      });
-      return arr;
-    },
-    expandedBarcodeTableData() {
-      return this.expandedBarcodes.map((code, idx) => ({ code, text: this.expandedBarcodeTexts[idx] }));
-    },
-    barcodeRows() {
-      const rows = [];
-      const arr = this.expandedBarcodes;
-      for (let i = 0; i < arr.length; i += this.perRow) {
-        rows.push(arr.slice(i, i + this.perRow));
-      }
-      return rows;
-    },
-    barcodeTextRows() {
-      const rows = [];
-      const arr = this.expandedBarcodeTexts;
-      for (let i = 0; i < arr.length; i += this.perRow) {
-        rows.push(arr.slice(i, i + this.perRow));
-      }
-      return rows;
-    },
-    iframeStyle() {
-      const { width, height } = this.getPaperPx();
-      return {
-        width: width + 'px',
-        minHeight: height + 'px',
-        height: height + 'px',
-        background: '#fff',
-        border: 'none',
-        display: 'block',
-        margin: 0,
-        padding: 0
-      };
-    }
-  },
-  watch: {
-    barcodes: {
-      handler(newVal) {
-        // 初始化barcodeConfigs
-        this.barcodeConfigs = newVal;
-        this.$nextTick(this.renderPreviewIframe);
-      },
-      immediate: true
-    },
-    barcodeConfigs: {
-      handler() { this.$nextTick(this.renderPreviewIframe); },
-      deep: true
-    },
-    perRow() { this.$nextTick(this.renderPreviewIframe); },
-    barcodeWidth() { this.$nextTick(this.renderPreviewIframe); },
-    barcodeHeight() { this.$nextTick(this.renderPreviewIframe); },
-    previewScale() { this.$nextTick(this.renderPreviewIframe); },
-    paperSize() { this.$nextTick(this.renderPreviewIframe); },
-    paperOrientation() { this.$nextTick(this.renderPreviewIframe); },
-    customPaperWidth() { this.$nextTick(this.renderPreviewIframe); },
-    customPaperHeight() { this.$nextTick(this.renderPreviewIframe); }
-  },
-  methods: {
-    getBarcodeId(row, col) {
-      return `barcode-canvas-${row}-${col}`;
-    },
-    getBarcodeText(row, col, code) {
-      if (
-        this.barcodeTextRows[row] &&
-        typeof this.barcodeTextRows[row][col] !== 'undefined' &&
-        this.barcodeTextRows[row][col] !== null &&
-        this.barcodeTextRows[row][col] !== ''
-      ) {
-        return this.barcodeTextRows[row][col];
-      }
-      return code;
-    },
-    handleDelete(cfg, idx) {
-      // this.barcodeConfigs.splice(idx, 1);
-      this.$emit('delete', cfg, idx);
-    },
-    getPaperPx() {
-      // mm to px, 1mm ≈ 3.78px
-      let width, height;
-      if (this.paperSize === 'A4') {
-        width = 210 * 3.78;
-        height = 297 * 3.78;
-      } else if (this.paperSize === 'A5') {
-        width = 148 * 3.78;
-        height = 210 * 3.78;
-      } else if (this.paperSize === 'A6') {
-        width = 105 * 3.78;
-        height = 148 * 3.78;
-      } else {
-        width = this.customPaperWidth * 3.78;
-        height = this.customPaperHeight * 3.78;
-      }
-      if (this.paperOrientation === 'landscape') {
-        return { width: height, height: width };
-      }
-      return { width, height };
-    },
-    getPrintHtml() {
-      const { width, height } = this.getPaperPx();
-      let html = `
-        <html>
-          <head>
-            <title>打印二维码</title>
-            <style>
-              body { margin: 0; padding: 0; background: #fff; }
-              .barcode-list { width: ${width}px; min-height: ${height}px; margin: 0 auto; background: #fff; }
-              .barcode-row { display: flex; margin-bottom: 24px; }
-              .barcode-item { flex: 1; text-align: center; }
-              .barcode-text { margin-top: 8px; font-size: 14px; }
-              html, body { overflow-x: hidden; }
-            </style>
-          </head>
-          <body>
-            <div class="barcode-list">
-      `;
-      this.barcodeRows.forEach((row, rowIndex) => {
-        html += '<div class="barcode-row">';
-        row.forEach((code, colIndex) => {
-          const id = this.getBarcodeId(rowIndex, colIndex);
-          const text = this.getBarcodeText(rowIndex, colIndex, code);
-          html += `<div class="barcode-item">
-            <canvas id="${id}" width="${this.barcodeWidth}" height="${this.barcodeHeight}"></canvas>
-            <div class="barcode-text">${text}</div>
-          </div>`;
-        });
-        html += '</div>';
-      });
-      html += '</div></body></html>';
-      return html;
-    },
-    async renderPreviewIframe() {
-      const iframe = this.$refs.previewIframe;
-      if (!iframe) return;
-      const doc = iframe.contentDocument || iframe.contentWindow.document;
-      doc.open();
-      doc.write(this.getPrintHtml());
-      doc.close();
-      // 渲染二维码
-      setTimeout(async () => {
-        for (let rowIndex = 0; rowIndex < this.barcodeRows.length; rowIndex++) {
-          const row = this.barcodeRows[rowIndex];
-          for (let colIndex = 0; colIndex < row.length; colIndex++) {
-            const code = row[colIndex];
-            const id = this.getBarcodeId(rowIndex, colIndex);
-            const el = doc.getElementById(id);
-            if (el) {
-              await QRCode.toCanvas(el, code, {
-                width: this.barcodeWidth,
-                height: this.barcodeHeight,
-                margin: 0
-              });
-            }
-          }
-        }
-      }, 50);
-    },
-    handlePrint() {
-      const iframe = this.$refs.previewIframe;
-      if (!iframe) return;
-      iframe.contentWindow.focus();
-      iframe.contentWindow.print();
-    },
-    /**
-     * 保存二维码为图片
-     * @param {string} code 二维码内容
-     * @param {string} text 下方文字
-     * @param {number} index 索引，用于生成文件名
-     */
-    async saveAsImage(code, text, index) {
-      try {
-        // 创建临时canvas用于绘制二维码和文字
-        const canvas = document.createElement('canvas');
-        const ctx = canvas.getContext('2d');
-        
-        // 计算总高度（二维码高度 + 文字区域高度）
-        const textHeight = 30; // 文字区域高度
-        canvas.width = this.barcodeWidth;
-        canvas.height = this.barcodeHeight + textHeight;
-        
-        // 绘制二维码
-        const qrCanvas = document.createElement('canvas');
-        qrCanvas.width = this.barcodeWidth;
-        qrCanvas.height = this.barcodeHeight;
-        await QRCode.toCanvas(qrCanvas, code, {
-          width: this.barcodeWidth,
-          height: this.barcodeHeight,
-          margin: 0
-        });
-        
-        // 将二维码绘制到主canvas
-        ctx.drawImage(qrCanvas, 0, 0);
-        
-        // 绘制文字
-        ctx.fillStyle = '#000';
-        ctx.font = '14px Arial';
-        ctx.textAlign = 'center';
-        ctx.textBaseline = 'top';
-        ctx.fillText(text, this.barcodeWidth / 2, this.barcodeHeight + 5);
-        
-        // 创建图片链接并下载
-        canvas.toBlob(blob => {
-          const url = URL.createObjectURL(blob);
-          const a = document.createElement('a');
-          a.href = url;
-          // 生成文件名（使用索引和内容摘要）
-          const fileName = `二维码_${index + 1}_${code.substring(0, 10)}.png`;
-          a.download = fileName;
-          document.body.appendChild(a);
-          a.click();
-          document.body.removeChild(a);
-          URL.revokeObjectURL(url);
-        });
-        
-        this.$message.success('图片保存成功');
-      } catch (error) {
-        console.error('保存图片失败:', error);
-        this.$message.error('保存图片失败，请重试');
-      }
-    }
-  },
-  mounted() {
-    this.barcodeConfigs = this.barcodes?.map(b => ({ code: b, count: 1, textTpl: b })) || [];
-    this.renderPreviewIframe();
-  }
-};
-</script>
-
-<style scoped>
-/* 样式保持不变 */
-.barcode-3col-layout {
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  min-height: 400px;
-}
-.barcode-preview-col {
-  flex: 1 1 0;
-  min-width: 0;
-  background: #fff;
-  border-right: 1px solid #eee;
-  padding: 24px 0 24px 24px;
-  display: flex;
-  flex-direction: column;
-  height: 90vh;
-  overflow: auto;
-}
-.barcode-right-col {
-  width: 420px;
-  min-width: 320px;
-  padding: 16px;
-  display: flex;
-  flex-direction: column;
-  background: #fafbfc;
-  height: 90vh;
-}
-.barcode-control-bar {
-  border-bottom: 1px solid #eee;
-  background: #fafbfc;
-  padding: 0 16px;
-}
-.barcode-settings-panel {
-  flex: 1;
-  overflow: auto;
-  min-height: 0;
-  max-height: calc(90vh - 48px); /* 48px 约为tabs高度，可根据实际调整 */
-}
-.preview-toolbar {
-  margin-bottom: 12px;
-  display: flex;
-  align-items: center;
-}
-.iframe-wrapper {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: flex-start;
-  background: #f8f8f8;
-  overflow: auto;
-}
-.barcode-iframe {
-  /* width、height 由:style绑定动态控制 */
-  min-width: 0;
-  min-height: 0;
-  border: none;
-  background: #fff;
-  border-radius: 4px;
-  display: block;
-}
-</style>