yos_web/src/HDrpManagement/logistics/details/index.vue

<template>
    <div>
      <basicDetails
          ref="details"
          :titleText="`${mainData.billno}`"
          :editData="mainData"
          :mainAreaData="mainAreaData"
          turnPageId="20221122132804"
          idname="sa_logisticsid"
          ownertable="sa_logistics"
          delApiId="20221122132904"
          tags=""
          :tabs="tool.checkAuth($route.name,'erpInfoRecord')?['基础信息','物流单明细','装箱信息','物流信息','erp对接记录']:['基础信息','物流单明细','装箱信息','物流信息']"
          @pageChange="pageChange"
          @onEditSuccess="queryMainData($route.query.id)">
        <div slot="tags">
        </div>
        <div slot="customOperation" >
          <Edit class="inline-16" v-if="tool.checkAuth($route.name,'update')" :data="mainData" @onSuccess="queryMainData(),$refs.dispatch.listData()"/>
          <el-button type="primary" size="mini"  v-if="tool.checkAuth($route.name,'confirmRec') && mainData.status =='审核'" :disabled="mainData.status == '收货'" @click="onConfimRec">{{$t(`确认收货`)}}</el-button>
          <el-button class="inline-16" type="primary" size="mini"  v-if="tool.checkAuth($route.name,'check')" @click="onCheck" :disabled="mainData.status == '收货'">{{mainData.status === '审核'?$t('反审'):$t('审核') }}</el-button>
        </div>
        <div slot="slot0" >
          <defalutInfo :mainData="mainData" ref="info"></defalutInfo>
        </div>
        <div slot="slot1" >
          <dispatchTable ref="dispatch" @onInit="onInit" @rowClick="rowClick" :needQuery="true"></dispatchTable>
          <dismx ref="dismx" style="margin-top: 10px"></dismx>
        </div>
        <div  slot="slot2">
          <addBox v-if="tool.checkAuth($route.name,'addBoxInfo') && mainData.status == '新建'" class="mt-10" @onSuccess="onBoxSuccess"></addBox>
          <boxlist :data="mainData" v-if="tool.checkAuth($route.name,'boxInfo') && mainData" ref="boxlist"></boxlist>
          <el-empty :description="$t(`暂无查询权限`)" v-else></el-empty>
        </div>
        <div  slot="slot3">
          <courierRecords></courierRecords>
        </div>
        <div slot="slot4">
          <erpInfo></erpInfo>
        </div>
      </basicDetails>
    </div>
</template>

  <script>
  import Edit from '../modules/edit'
  import defalutInfo from '../modules/defaultInfo.vue'
  import dispatchTable from '../modules/dispatchTable.vue'
  import dismx from '../modules/productlist.vue'
  import addBox from './tabs/logisticsBox/add.vue'
  import boxlist from './tabs/logisticsBox/logisticsBox.vue'
  import courierRecords from './tabs/courierRecords.vue'
  import erpInfo from './tabs/erpInfo.vue'
  export default {
    name: "detail",
    data() {
      return {
        mainData:'',
        mainAreaData:{}
      }
    },
    components:{
      defalutInfo,
      dispatchTable,
      dismx,
      addBox,
      boxlist,
      courierRecords,
      Edit,
      erpInfo
    },
    methods:{
      async queryMainData(id) {
        const res = await this.$api.requested({
          "id": 20221204201804,
          "content": {
            "sa_logisticsid":this.$route.query.id
          }
        })
        this.mainData = res.data[0]
        console.log(this.mainData);

        this.changeDataStructure()
       /* this.$refs.info.style(this.mainData.status)*/
      },
      changeDataStructure() {
        let that = this
        this.mainAreaData = [
          {
            label:'物流编号',
            value:this.mainData.billno
          },
          {
            label:'erp单号',
            value:this.mainData.erpbillno
          },
          {
            label:'单据日期',
            value:this.mainData.billdate
          },
          {
            label:'车牌号',
            value:this.mainData.carnum
          },
          {
            label:'物流联系人',
            value:this.mainData.logiscontact
          },
          {
            label:'物流电话',
            value:this.mainData.logisphone
          },
          {
            label:'项目名称',
            value:this.mainData.projectName
          },
          {
            label:'快递公司',
            value:this.mainData.logiscompname
          },
          {
            label:'快递单号',
            value:this.mainData.logisticno
          },
          {
            label:'运费',
            value:this.mainData.freightamount
          },
          {
            label:'收货人',
            value:this.mainData.name
          },
          {
            label:'寄件方式',
            value:this.mainData.paytype
          },

          {
            label:'状态',
            value:this.$t(this.mainData.status),
            style:function () {
              let style = that.tool.getStatusColor(that.mainData.status)
              return style
            }
          },
          {
            label:'企业编码',
            value:this.mainData.agentnum
          },
          {
            label:'企业名称',
            value:this.mainData.enterprisename
          },
          {
            label:'订单类型',
            value:this.mainData.type
          },
          {
          label:'回签单',
            value:this.mainData.signbackstatus
          },
          {
            label:'备注',
            value:this.mainData.remarks
          },
        ]
      },
      // 监听切换数据,上一页,下一页
      pageChange (id,rowindex,tabIndex) {
        this.flag = false
        tabIndex = this.$route.query.tabIndex
        this.$router.replace({path:'/logisticsdetail',query:{id:id,rowindex:rowindex,tabIndex:tabIndex}})
        this.queryMainData(id)
      },
      onSuccess(){
        this.visible = false
        this.queryMainData(this.$route.query.id)
        this.$emit('onSuccess')
      },
      onCheck () {
        this.$confirm(`${this.$t(`确定`)}${this.$t(this.mainData.status === '审核'?'反审核':'审核')}${this.$t(`该物流单`)}`, this.$t('提示'), {
          confirmButtonText: this.$t('确定'),
          cancelButtonText: this.$t('取消'),
          type: 'warning'
        }).then(async () => {
          const res = await this.$api.requested({
            "id":20221122133104,
            "version":1,
            "content": {
              "sa_logisticsid":this.$route.query.id
            }
          })
          this.tool.showMessage(res,()=>{
            this.queryMainData()
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: this.$t('已取消')
          });
        });
      },
      onConfimRec () {
        this.$confirm(this.$t(`确认收货吗?`), this.$t('提示'), {
          confirmButtonText: this.$t('确定'),
          cancelButtonText: this.$t('取消'),
          type: 'warning'
        }).then(async () => {
          const res = await this.$api.requested({
            "id": "20221122133204",
            "content": {
              "sa_logisticsid":this.$route.query.id
            }
          })
          this.tool.showMessage(res,()=>{
            this.queryMainData()
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: this.$t('已取消')
          });
        });
      },
      rowClick (row) {
        this.$refs['dismx'].listData(row.sa_dispatchid)
      },
      onBoxSuccess () {
        this.$refs['boxlist'].listData()
      },
      onInit (data) {
        this.$refs.dismx.listData(data.sa_dispatchid)
      }
    },
    mounted () {
      this.queryMainData(this.$route.query.id)

    },
    created() {
    }
  }
  </script>

  <style scoped>

  </style>