添加字段和前端页面添加按钮

heshaofeng

2025-11-14 5beb11143d51268dc2ee6b4ad5d59f4535e1103e

 ÏîÄ¿´úÂë/WIDESEA_WMSClient/src/extension/outbound/outboundOrder.js

@@ -49,7 +49,7 @@
  value: '空托盘出库',
  onClick: function () {
    
    // 2. ç”Ÿæˆ3-12站台选项（默认第一个为站台3）
   
    const platformOptions = Array.from({ length: 1 }, (_, i) => {
      const num = 1;
      return { label: `站台${num}`, value: `1-2` };
@@ -58,15 +58,15 @@
    const mountNode = document.createElement('div');
    document.body.appendChild(mountNode);

    // 3. è¡¨å•æ•°æ®ï¼ˆé»˜è®¤é€‰ä¸­ç«™å°3）
    
    const formData = reactive({
      palletCode: '',
      selectedPlatform: platformOptions[0].value // é»˜è®¤ç»‘定站台3的value
      selectedPlatform: platformOptions[0].value 
    });

    const vnode = createVNode(ElDialog, {
      title: '空托盘出库',
      width: '500px', // å¾®è°ƒå®½åº¦æ›´åè°ƒ
      width: '500px', 
      modelValue: true,
      appendToBody: true,
      'onUpdate:modelValue': (isVisible) => {
@@ -76,8 +76,8 @@
        }
      },
      style: {
        padding: '20px 0', // å¼¹çª—内上下留白，避免内容紧贴边框
        borderRadius: '8px' // è½»å¾®åœ†è§’，提升质感
        padding: '20px 0', 
        borderRadius: '8px' 
      }
    }, {
      default: () => h(ElForm, {
@@ -91,28 +91,28 @@
          ]
        },
        ref: 'batchOutForm',
        labelWidth: '100px', // å›ºå®šæ ‡ç­¾å®½åº¦ï¼Œç¡®ä¿å¯¹é½
        labelWidth: '100px', 
        style: {
          padding: '0 30px', // è¡¨å•å·¦å³ç•™ç™½ï¼Œå¢žåŠ å‘¼å¸æ„Ÿ
          padding: '0 30px', 
        }
      }, [
        // å‡ºåº“站台（上，优化样式）
        
        h(ElFormItem, {
          label: '出库站台',
          prop: 'selectedPlatform',
          style: {
            marginBottom: '24px' // è¡¨å•é¡¹é—´è·ä¼˜åŒ–
            marginBottom: '24px' 
          }
        }, [
          h(ElSelect, {
            placeholder: '请选择出库站台（3-12）',
            placeholder: '请选择出库站台',
            modelValue: formData.selectedPlatform,
            'onUpdate:modelValue': (val) => {
              formData.selectedPlatform = val;
            },
            style: {
              width: '100%',
              height: '40px', // ç»Ÿä¸€ç»„件高度
              height: '40px', 
              borderRadius: '4px',
              borderColor: '#dcdfe6'
            }
@@ -120,12 +120,12 @@
            h(ElOption, { label: platform.label, value: platform.value })
          ))
        ]),
        // æ‰˜ç›˜ç¼–号（下，优化样式）
        
        h(ElFormItem, {
          label: '料箱号',
          prop: 'palletCode',
          style: {
            marginBottom: '16px' // ä¸ŽæŒ‰é’®åŒºæ‹‰å¼€åˆç†é—´è·
            marginBottom: '16px' 
          }
        }, [
          h(ElInput, {
@@ -137,21 +137,21 @@
            },
            style: {
              width: '100%',
              height: '40px', // ä¸Žé€‰æ‹©å™¨é«˜åº¦ç»Ÿä¸€
              height: '40px', 
              borderRadius: '4px',
              borderColor: '#dcdfe6'
            },
            attrs: {
              placeholderStyle: 'color: #909399;' // å ä½æ–‡å­—颜色优化，更柔和
              placeholderStyle: 'color: #909399;' 
            }
          })
        ]),
        // åº•éƒ¨æŒ‰é’®åŒºï¼ˆæ ·å¼ä¼˜åŒ–）
        
        h('div', {
          style: {
            textAlign: 'right',
            marginTop: '8px',
            paddingRight: '4px' // æŒ‰é’®ä¸Žå³ä¾§å¯¹é½å¾®è°ƒ
            paddingRight: '4px' 
          }
        }, [
          h(ElButton, {
@@ -163,7 +163,7 @@
            },
            style: {
              marginRight: '8px',
              color: '#606266' // å–消按钮颜色优化
              color: '#606266' 
            }
          }, '取消'),
          h(ElButton, {
@@ -180,7 +180,8 @@
                
              }).then(({ data, status, message }) => {
                if (status) {
                  ElMessage.success(`出库成功，分配的托盘编号：${data.palletCode || formData.palletCode}`);

                  ElMessage.success(`出库成功`);
                  this.refresh();
                  render(null, mountNode);
                  document.body.removeChild(mountNode);
@@ -193,7 +194,7 @@
            },
            style: {
              borderRadius: '4px',
              padding: '8px 20px' // æŒ‰é’®å†…边距优化，点击区域更舒适
              padding: '8px 20px' 
            }
          }, '确定')
        ])