销售明细单发货操作的时候一次发货和多发货 2个部分的列表表头不显示的问题修改+切换表头变化的逻辑处理

haoxuan

2024-03-27 049ecf224380ec0a714a00c6567f8c70bee61662

销售明细单发货操作的时候一次发货和多发货 2个部分的列表表头不显示的问题修改+切换表头变化的逻辑处理

 src/views/sales/salesDetails/shipmentsDialog.vue

@@ -13,7 +13,7 @@
        :model="editConfig.infomation"
        :rules="rules"
        label-position="left"
        label-width="10%"
        label-width="90px"
        size="mini"
        style="height: 60vh; overflow-x: hidden"
      >
@@ -23,15 +23,15 @@
          <div class="basic-info-view">
            <el-row>
              <el-col :span="24">
                <el-form-item width="50%" label="交付类型" prop="addressee">
                  <el-radio-group v-model="shipmentsType" @change="handleRadioChange">
                <el-form-item width="50%" label="交付类型：" prop="deliverType">
                  <el-radio-group v-model="editConfig.infomation.deliverType" @change="handleRadioChange">
                    <el-radio :label="1">一次发货</el-radio>
                    <el-radio :label="2">多次发货</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="关联项目" prop="projectId">
                <el-form-item label="关联项目：" prop="projectId">
                  <el-select
                    v-model="editConfig.infomation.projectId"
                    placeholder="请选择"
@@ -78,6 +78,7 @@
              @getSelectArray="getSelectArray"
              @emptyProductClick="emptyProductClick"
              @clearupProduct="clearupProduct"
              @selTableCol="selTableCol"
            ></CommonFormTableView>
          </div>
          <p class="tips tips_success" v-if="completely"><i class="el-icon-warning-outline"></i>{{ shipmentsMsg }}</p>
@@ -125,6 +126,17 @@
    },
  },
  data() {
    // 产品信息
    const productColumn = [
          { label: "产品编号", prop: "number", isShowColumn:true, },
          { label: "产品名称", prop: "name",isShowColumn:true, min: 110 },
          { label: "订单数量", prop: "orderAmount", isShowColumn:true,},
          { label: "订单完成数量", prop: "finishAmount",isShowColumn:true, },
          { label: "可用库存", prop: "availableAmount",isShowColumn:true, },
          { label: "未发货数量", prop: "leftAmount", isShowColumn:true, },
          { label: "本次发货数量", prop: "outputAmount", inputFloat: true,isRequird:true,isShowColumn:true,},
          { label: "剩余发货数量", prop: "availableAmount",isShowColumn:true,},
        ]
    return {
      dialogWidth: "60%",
      editConfig: this.editCommonConfig,
@@ -136,7 +148,15 @@
      wechatOrderStatusOptions: [], // 微信订单状态
      currencyOptions: [{ id: 1, name: "人民币" }], // 币种
      approvalWorkflowOptions: [], // 审批流程
      productTableList: {},
      productTableList: {
        allcol: [],
        showcol: ['产品编号','产品名称', "订单数量", "订单完成数量",],
        tableData: [],
        tableColumn: []
      },
      tableColumn: productColumn,
      searchOptions: [],
      
      showSummary: {
        show: true,
        total: true,
@@ -190,7 +210,6 @@
          return time.getTime() > Date.now()
        }
      },
      shipmentsType:1,
      options: [{
        value: '1',
        label: '仓库1--库存不足的情况'
@@ -212,19 +231,22 @@
  created() {
    this.$store.dispatch("geClient")
    this.setTableForm()
    this.handleRadioChange()
    this.getCommonData()
    this.formInfo()
    this.getUseSystemSet({ modeType: "xsmx" })
    this.getProjectList()
    this.getDeliveryPrepareInfo({
      saleDetailID: this.editCommonConfig.infomation.saleDetailID,
      saleDetailNumber: this.editCommonConfig.infomation.saleDetailNumber
          saleDetailID: this.editCommonConfig.infomation.saleDetailID,
          saleDetailNumber: this.editCommonConfig.infomation.saleDetailNumber
    })
  },
  watch: {
    "editClientManageConfig.visible"(val) {
      if (val) {
        this.handleRadioChange()
        this.formInfo()
        
      }
    }
  },
@@ -271,7 +293,7 @@
          let isShipments=false
          let shipmentsNum=false
          this.shipmentsList.map((item)=>{
            if(this.shipmentsType===1){
            if(this.editConfig.infomation.deliverType===1){
              if(item.leftAmount<item.availableAmount&&item.leftAmount>0){
                isShipments=false
              }else if(item.leftAmount<=0){
@@ -317,7 +339,7 @@
      this.shipmentsList.map((item)=>{
        let obj={
          number:item.number,
          outputAmount:this.shipmentsType===1?item.leftAmount:item.outputAmount // 本次发货数量
          outputAmount:this.editConfig.infomation.deliverType===1?item.leftAmount:item.outputAmount // 本次发货数量
        }
        params.products.push(obj)
      })
@@ -439,23 +461,51 @@
          }
        ]
      } else {
        this.tableData = this.editConfig.infomation.products
        this.tableData = this.editConfig.infomation.products?this.editConfig.infomation.products:[]
        this.tableData.map((item, index) => {
          item.productId = index + 1
        })
        this.getQuotation(this.editConfig.infomation.saleChanceId, "全部产品")
      }
      this.tableColumn=[
          { label: "产品编号", prop: "number", isShowColumn:true, },
          { label: "产品名称", prop: "name",isShowColumn:true, min: 110 },
          { label: "订单数量", prop: "orderAmount", isShowColumn:true,},
          { label: "订单完成数量", prop: "finishAmount",isShowColumn:true, }
        ]
      this.productTableList = {
        tableData: this.tableData,
        isReturn: true,
        tableColumn: [
          { label: "产品编号", prop: "number" },
          { label: "产品名称", prop: "name",   min: 110 },
          { label: "订单数量", prop: "orderAmount" },
          { label: "订单完成数量", prop: "finishAmount" },
          // { label: "可用库存", prop: "unit" },
        ]
        // tableColumn: [
        //   { label: "产品编号", prop: "number", isShowColumn:true, },
        //   { label: "产品名称", prop: "name",isShowColumn:true, min: 110 },
        //   { label: "订单数量", prop: "orderAmount", isShowColumn:true,},
        //   { label: "订单完成数量", prop: "finishAmount",isShowColumn:true, }
        // ],
        tableColumn: this.setColumnVisible(this.productTableList.showcol, this.tableColumn)
      }
      this.setTableList(this.productTableList)
    },
    setTableList(tableList) {
      tableList.allcol = tableList.tableColumn.filter((ele) => !ele.default).map((ele) => ele.label)
      this.searchOptions = []
      for (let i = 0; i < tableList.tableColumn.length; i++) {
        const label = tableList.tableColumn[i].label
        const value = tableList.tableColumn[i].prop
        this.searchOptions.push({ value: value, label: label })
      }
    },
    setColumnVisible(showcol, tableColumn) {
      return tableColumn.map((ele) => {
        return {
          ...ele,
          isShowColumn: showcol.includes(ele.label)
        }
      })
    },
    selTableCol(val) {
      this.productTableList.showcol = val
      this.productTableList.tableColumn = this.setColumnVisible(val, this.tableColumn)
    },
    // 产品列表输入
    inputContent(val, prop, row) {
@@ -529,18 +579,22 @@
      }
    },
    // 选择发货方式
    handleRadioChange(value) {  
    handleRadioChange() {
      let value=this.editConfig.infomation.deliverType
      this.shipmentsList=[]
      this.dissatisfy=false
      this.completely=false
      if(value===1){
        this.productTableList.tableColumn=[
          { label: "产品编号", prop: "number" },
          { label: "产品名称", prop: "name",   min: 110 },
          { label: "订单数量", prop: "orderAmount" },
          { label: "订单完成数量", prop: "finishAmount" },
          { label: "可用库存", prop: "availableAmount" },
      if(value==1){
        this.productTableList.showcol= ['产品编号','产品名称', "订单数量", "订单完成数量","可用库存"]
        this.productTableList.allcol= ["订单数量", "订单完成数量","可用库存"]
        this.tableColumn=[
          { label: "产品编号", prop: "number",isShowColumn:true,  },
          { label: "产品名称", prop: "name",isShowColumn:true,  min: 110 },
          { label: "订单数量", prop: "orderAmount",isShowColumn:true, },
          { label: "订单完成数量", prop: "finishAmount",isShowColumn:true, },
          { label: "可用库存", prop: "availableAmount",isShowColumn:true, },
        ]
        this.productTableList.tableColumn=this.setColumnVisible(this.productTableList.showcol, this.tableColumn)
        this.dissatisfy=false
        let portion=0
        // let noUsable=false
@@ -584,17 +638,20 @@
          this.completely=false
          this.completely=true
        }
      }else if(value===2){
        this.productTableList.tableColumn= [
          { label: "产品编号", prop: "number" },
          { label: "产品名称", prop: "name",  min: 110 },
          { label: "订单数量", prop: "orderAmount" },
          { label: "订单完成数量", prop: "finishAmount" },
          { label: "可用库存", prop: "availableAmount" },
          { label: "未发货数量", prop: "leftAmount",  },
          { label: "本次发货数量", prop: "outputAmount", inputFloat: true,isRequird:true },
          { label: "剩余发货数量", prop: "availableAmount",},
      }else if(value==2){
        this.productTableList.showcol= ['产品编号','产品名称', "订单数量", "订单完成数量","可用库存","未发货数量", "本次发货数量","剩余发货数量",]
        this.productTableList.allcol= [ "订单数量", "订单完成数量","可用库存","未发货数量", "剩余发货数量",]
        this.tableColumn= [
          { label: "产品编号", prop: "number",isShowColumn:true, },
          { label: "产品名称", prop: "name",  min: 110 ,isShowColumn:true,},
          { label: "订单数量", prop: "orderAmount",isShowColumn:true, },
          { label: "订单完成数量", prop: "finishAmount" ,isShowColumn:true,},
          { label: "可用库存", prop: "availableAmount",isShowColumn:true, },
          { label: "未发货数量", prop: "leftAmount", isShowColumn:true, },
          { label: "本次发货数量", prop: "outputAmount", inputFloat: true,isRequird:true,isShowColumn:true,},
          { label: "剩余发货数量", prop: "availableAmount",isShowColumn:true,},
        ]
        this.productTableList.tableColumn=this.setColumnVisible(this.productTableList.showcol, this.tableColumn)
        let portion=0
        this.productTableList.tableData.map((item)=>{
          item.availableAmount=Number(item.availableAmount)
@@ -627,7 +684,7 @@
        this.shipmentsList=[]
        if(res&&res.code===200){
          this.productTableList.tableData=res.data||[]
          if(this.shipmentsType===1){
          if(this.editConfig.infomation.deliverType===1){
            let portion=0
            this.productTableList.tableData.map((item)=>{
              item.availableAmount=Number(item.availableAmount)