提交运费添加其他

src/views/mall/goods/send-goods.vue

@@ -4,9 +4,22 @@
       <p>收件人：<span style="color:#606266">{{info.consignee || '--'}}</span></p>
       <p>联系方式：<span style="color:#606266">{{info.consigneePhone || '--'}}</span></p>
       <p>收货地址：<span style="color:#606266">{{info.receivingAddress || '--'}}</span></p>
-      <p class="pb10">快递公司：<el-select class="vertical-middle w300" v-model="params.logisticsCompanyId" placeholder="选择快递">
-            <el-option v-for="v in logisticsOptions" :key="v.logisticsCompanyCode" :label="v.logisticsCompanyName" :value="v.logisticsCompanyId"></el-option>
-          </el-select>
+      <p class="pb10">快递公司：
+        <el-select 
+          class="vertical-middle w300" 
+          v-model="params.logisticsCompanyId" 
+          placeholder="选择快递"
+          @change="changeLogistics">
+          <el-option 
+            v-for="v in logisticsOptions" 
+            :key="v.logisticsCompanyCode" 
+            :label="v.logisticsCompanyName" 
+            :value="v.logisticsCompanyId">
+          </el-option>
+        </el-select>
+        <div style="margin:0 0 10px 75px" v-show="otherLogistics">
+          <el-input class="vertical-middle w300" v-model="params.otherLogisticsCompanyName"  placeholder="请输入快递公司" @input="(value)=>logisticsNameLimit(value)"></el-input>
+        </div>
        </p>
       <p>运单号码：<el-input class="vertical-middle w300" v-model="params.courierNumber" placeholder="请输入快递单号"  @input="(value)=>courierNumberLimit(value)"></el-input></p>
     </div>
@@ -46,7 +59,9 @@ import {getLogisticsInfo,getLogisticsList,orderOptService} from '@/service/api/m
           logisticsCompanyId:'',
           logisticsCompanyCode:'',
           courierNumber:'',
+          otherLogisticsCompanyName:'',
         },
+        otherLogistics:false
       }
     },
     created() {
@@ -55,6 +70,34 @@ import {getLogisticsInfo,getLogisticsList,orderOptService} from '@/service/api/m
     methods: {
       close() {
         this.$emit('update:show',false);
+        this.otherLogistics=false
+        this.params.otherLogisticsCompanyName=''//快递公司
+        this.params.logisticsCompanyId=''//运单id
+        this.params.courierNumber=''//运单bain好
+      },
+       //限制物流公司的名称
+      logisticsNameLimit(value){
+        this.$nextTick(() => {
+          this.params.otherLogisticsCompanyName = this.getInputVal2(value,8)
+        })
+      },
+      //快递公司下拉
+      changeLogistics(value){
+        console.log('物流id',value)
+        if ( value ) {
+          let code = this.logisticsOptions.find( item => {
+            return item.logisticsCompanyId ===value
+          } ).logisticsCompanyCode
+          if(code==='QITA'){
+            this.otherLogistics=true
+          }else{
+            this.otherLogistics=false
+            this.params.otherLogisticsCompanyName=''
+          }
+        } else {
+          this.otherLogistics=false
+          this.params.otherLogisticsCompanyName=''
+        }
       },
       submit() {
         if (!this.params.logisticsCompanyId) {
@@ -70,6 +113,12 @@ import {getLogisticsInfo,getLogisticsList,orderOptService} from '@/service/api/m
             this.params.logisticsCompanyCode = v.logisticsCompanyCode;
           }
         })
+        if ( this.params.logisticsCompanyCode ==='QITA' ) {
+          if ( this.params.otherLogisticsCompanyName==='' ) {
+            this.$tips({type:'warning',message:'请填写快递公司'});
+            return;
+          }
+        }
         let params = {
           optType:1,
           integralMallProExchangeId:this.id,
@@ -105,6 +154,21 @@ import {getLogisticsInfo,getLogisticsList,orderOptService} from '@/service/api/m
         }
         return returnValue;
       },
+      //输入框的输入限制
+      getInputVal2: function(val, max) {
+        var returnValue = '';
+        var byteValLen = 0;
+        for (var i = 0; i < val.length; i++) {
+            if (val[i].match(/[^\x00-\xff]/ig) != null)
+            byteValLen += 1;
+            else
+            byteValLen += 0.5;
+            if (byteValLen > max)
+            break;
+            returnValue += val[i];
+        }
+        return returnValue;
+      },
       async getLogisticsList() {
         let res = await getLogisticsList();
         if (res.errorCode === 0) {