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="['基础信息','物流单明细','装箱信息','物流信息']"
          @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">确认收货</el-button>
          <el-button class="inline-16" type="primary" size="mini"  v-if="tool.checkAuth($route.name,'check')" @click="onCheck">{{mainData.status === '审核'?'反审':'审核'}}</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"></dismx>
        </div>
        <div  slot="slot2">
          <addBox v-if="tool.checkAuth($route.name,'addBoxInfo')" class="mt-10" @onSuccess="onBoxSuccess"></addBox>
          <boxlist :data="mainData" v-if="tool.checkAuth($route.name,'boxInfo') && mainData" ref="boxlist"></boxlist>
          <el-empty description="暂无查询权限" v-else></el-empty>
        </div>
        <div  slot="slot3">
          <courierRecords></courierRecords>
        </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'
  export default {
    name: "detail",
    data() {
      return {
        mainData:'',
        mainAreaData:{}
      }
    },
    components:{
      defalutInfo,
      dispatchTable,
      dismx,
      addBox,
      boxlist,
      courierRecords,
      Edit
    },
    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:'单据日期',
            value:this.mainData.billdate
          },
          {
            label:'车牌号',
            value:this.mainData.carnum
          },
          {
            label:'物流联系人',
            value:this.mainData.logiscontact
          },
          {
            label:'物流电话',
            value:this.mainData.logisphone
          },
          {
            label:'运费',
            value:this.mainData.freightamount
          },
          {
            label:'收货人',
            value:this.mainData.name
          },
          {
            label:'寄件方式',
            value:this.mainData.paytype
          },
          
          {
            label:'状态',
            value:this.mainData.status,
            style:function () {
              let style = {}
              switch (that.mainData.status) {
                case '新建':
                  style = {color:"#000000"}
                  break;
                case '审核':
                  style = {color:"#d90a0a"}
                  break;
                case '收货':
                  style = {color:"#52C41A"}
                  break;
                default:
                  break;
              }
              return style
            }
          },
          {
            label:'经销商编码',
            value:this.mainData.agentnum
          },
          {
            label:'经销商简称',
            value:this.mainData.enterprisename
          },
          {
            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.mainData.status === '审核'?'反审核':'审核'}该物流单`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          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: '已取消'
          });          
        });
      },
      onConfimRec () {
        this.$confirm(`确认收货吗`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          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: '已取消'
          });          
        });
      },
      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>