yos_web/src/SDrpManagement/salerPrivatecustomer/detail/customerDetail.vue

<template>
  <div>
    <basicDetails
        ref="details"
        :titleText="mainData.enterprisename"
        formPath="salerPrivatecustomer"
        :editData="mainData"
        :mainAreaData="mainAreaData"
        turnPageId="20221012164402"
        idname="sa_customersid"
        tags=""
        :tabs="['详细信息','联系人信息','客户地址','开票信息','项目商机','报价单','线索']"
        @pageChange="pageChange"
        @onEditSuccess="queryMainData($route.query.id)">
      <div slot="tags">
        <!-- 使用此插槽可不传[tags] -->
        <!-- :tabs="['经销商团队','代理区域','营销类别','账户余额']" -->
<!--        <tagPanl slot="tags" :data="tags" :id="mainData.sa_customersid" @onSuccess="queryMainData"/>-->
      </div>
      <div slot="customOperation" >
        <!-- 此区域提供了自定义操作按钮 -->
        <statusChange class="inline-16" v-if="tool.checkAuth($route.name,'statusChange')" :disabled="disabled" :id="mainData.sa_customersid"  @statusChangeSuccess="statusChangeSuccess"></statusChange>
        <share class="inline-16" v-if="tool.checkAuth($route.name,'share') && mainData.sourcepoolname === ''" :disabled="disabled" :id="mainData.sa_customersid" @onshow="onSuccess" @shareSuccess="onSuccess"></share>
        <toBack class="inline-16" v-if="tool.checkAuth($route.name,'back') && mainData.sa_customerpoolid_source !== 0" :disabled="disabled" :data="mainData" @backSuccess="onSuccess"></toBack>
        <to_void class="inline-16" v-if="tool.checkAuth($route.name,'toVoid')" :id="mainData.sa_customersid" :disabled="disabled" @onshow="onSuccess" @toVoidSuccess="onSuccess"></to_void>
        <recovery class="inline-16" v-if="tool.checkAuth($route.name,'recovery') " :disabled="disabled" :data="mainData" @onshow="onSuccess" @backSuccess="onSuccess"></recovery>
      </div>
      <div slot="slot0" >
        <detailed ref="baseDetail"></detailed>
      </div>
      <div slot="slot1" class=" normal-panel"  >
        <contacts :data="mainData" :disabled="disabled"  @onSuccess="onSuccess" v-if="flag"></contacts>
      </div>
      <div slot="slot2" class=" normal-panel">
        <address_manage :data="mainData"  v-if="flag"></address_manage>
      </div>
      <div slot="slot3" class=" normal-panel">
        <financial :mainData="mainData"  v-if="flag"></financial>
      </div>
      <div slot="slot4" class="normal-panel">
        <projectChange :data="mainData"  v-if="flag"></projectChange>
      </div>
      <div slot="slot5" class="normal-panel">
        <quotedPrice :data="mainData"  v-if="flag"></quotedPrice>
      </div>
      <div slot="slot6" class="normal-panel">
        <followLeads :data="mainData"  v-if="flag"></followLeads>
      </div>
    </basicDetails>
  </div>
</template>

<script>
import detailed from './modules/detailedData'
import contacts from './modules/contacts/list'
import address_manage from './modules/addressManage/list'
import transactionUser from "./modules/operation/transactionUser"
import lock from './modules/operation/lock'
import unlock from './modules/operation/unlock'
import share from './modules/operation/share'
import send_back from './modules/operation/sendBack'
import to_void from './modules/operation/toVoid'
import transaction_status from './modules/operation/transactionStatus'
import statusChange from './modules/operation/statusChange'
import recovery from './modules/operation/recovery'
import financial from './modules/financialInfo/index.vue'
import projectChange from './modules/projectChange/list'
import quotedPrice from './modules/quotedPrice/list'
import followLeads from './modules/followLeads/index'
import toBack from "@/SDrpManagement/salerPrivatecustomer/detail/modules/operation/toBack";
export default {
  name: "detail",
  data() {
    return {
      mainData:{},
      mainAreaData:[],
      userInfo:JSON.parse(window.sessionStorage.getItem('userInfo')),
      tags:{},
      visible:false,
      dialogFormVisible:false,
      dialogFormLeader:false,
      form:{
        status:'',
        userid:''
      },
      users:[],
      flag:false,
      disabled:false
    }
  },
  components:{
    detailed,
    contacts,
    address_manage,
    transactionUser,
    lock,
    unlock,
    share,
    send_back,
    to_void,
    transaction_status,
    recovery,
    financial,
    projectChange,
    quotedPrice,
    followLeads,
    statusChange,
    toBack
  },
  watch:{
    mainData(val) {
      if (this.mainData.leader.length !== 0){
        if (JSON.parse(window.sessionStorage.getItem('userInfo')).userid === this.mainData.leader[0].userid){
          this.disabled = false
        }else {
          this.disabled = true
        }
      }
      console.log("权限结果",this.disabled)
    }
  },
  methods:{
    async queryMainData(id) {
      const res = await this.$api.requested({
        "id": 20221012164302,
        "content": {
          "sa_customersid": id
        },
      })
      this.mainData = res.data
      this.$refs['details'].param.content.type = this.$route.query.tabIndex
      this.$refs['details'].param.content.isExport = false
      this.changeDataStructure()
      this.flag = true
      console.log(this.mainData,"输出数据用户id")
    },
    show(){
      this.visible = false
    },
    changeDataStructure() {
      let that = this
      this.mainAreaData = [
        {
          label:'客户编号',
          value:this.mainData.sa_customersid
        },
        {
          label:'客户级别',
          value:this.mainData.customergrade
        },
        {
          label:'客户类型',
          value:this.mainData.type
        },
        {
          label:'上级企业',
          value:this.mainData.superiorenterprisename
        },
        {
          label:'成交状态',
          value:this.mainData.tradingstatus,
          style:function () {
            let style = {}
            switch (that.mainData.tradingstatus) {
              case '已成交':
                style = {color:'#fa8c16'}
                break;
              case '未成交':
                style = {color:'#3874f6'}
                break;
              case '多次成交':
                style = {color:'#333333'}
                break;
              default:
                break;
            }
            return style
            
          }
        },
        {
          label:'合作状态',
          value:this.mainData.status,
          style:function () {
            let style = {}
            switch (that.mainData.status) {
              case '潜在':
                style = {color:'#3874f6'}
                break;
              case '合作中':
                style = {color:'#52c41a'}
                break;
              case '已终止':
                style = {color:'#999999'}
                break;
              default:
                break;
            }
            return style
            
          }

        },
        {
          label:'负责人',
          value:this.mainData.leader.length === 0?"--":this.mainData.leader[0].name
        },
        {
          label:'最近跟进时间',
          value:''
        },
        {
          label:'来源公海',
          value:this.mainData.sourcepoolname
        }
      ]
    },
    // 监听切换数据,上一页,下一页
    pageChange (id,rowindex,tabIndex) {
      this.flag = false
      tabIndex = this.$route.query.tabIndex
      this.$router.replace({path:'/customerDetail',query:{id:id,rowindex:rowindex,tabIndex:tabIndex}})
      this.queryMainData(id)
    },
    onSuccess(){
      this.visible = false
      this.queryMainData(this.$route.query.id)
      /*this.$emit('onSuccess')*/
    },
    statusChangeSuccess () {
      this.$refs.details.refreshTag()
      this.$refs.baseDetail.basicData(this.$route.query.id)
      this.$refs.baseDetail.systemData(this.$route.query.id)
      this.queryMainData(this.$route.query.id)
    }
  },
  mounted () {
    this.queryMainData(this.$route.query.id)
  },
  created() {
    this.tool.checkAuth(this.$route.name,'update')?'':this.$router.go(-1)
  }
}
</script>

<style scoped>

</style>