<template>
  <basicDetails 
    style="min-width:80vw"
    ref="details"
    :titleText="mainData.enterprisename"
    formPath="marketing2/agent"
    :editData="mainData"
    :mainAreaData="mainAreaData" 
    turnPageId="20221011144903"
    delApiId="20221011145003"
    idname="sa_agentsid"
    :tags="[]"
    :tabs="['经销商团队','代理区域','营销类别','账户余额查询','地址管理','联系人管理','财务信息','关联合同','授权领域']"
    @pageChange="pageChange"
    @onEditSuccess="queryMainData($route.query.id)">
    <div slot="tags">
      <!-- 使用此插槽可不传[tags] -->
      <!-- :tabs="['经销商团队','代理区域','营销类别','账户余额']" -->
    </div>
    <div slot="customOperation">
      <!-- 此区域提供了自定义操作按钮 -->
    </div>
    <div slot="slot0">
      <el-button size="small" type="primary" @click="createAgentAccount" class="normal-margin">创建团队账号</el-button>
      <tableLayout :layout="tablecols" :data="mainData.hrs" :custom="true" height="calc(100vh - 425px)">
        <template v-slot:customcol="scope">
          <div v-if="scope.column.columnname === 'name'">
            <div v-if="scope.column.data.isleader === 1">
              <p class="inline-16">{{scope.column.data[scope.column.columnname]}}</p>
              <el-tag size="mini">主账号</el-tag>
            </div>
            <div v-else>
              <p class="inline-16">{{scope.column.data[scope.column.columnname]}}</p>
            </div>

          </div>
          <p v-else>{{scope.column.data[scope.column.columnname]}}</p>
        </template>
      </tableLayout>
    </div>
    <div slot="slot1">
      <salescope :data="mainData"></salescope>
    </div>
    <div slot="slot2">
      <SaleClass :data="mainData"></SaleClass>
    </div>
    <div slot="slot3">
      <accountMoney :mainData="mainData"></accountMoney>
    </div>
    <div slot="slot4">
      <agent-address :mainData="mainData"></agent-address>
    </div>
    <div slot="slot5">
      <agent-contact :mainData="mainData"></agent-contact>
    </div>
    <div slot="slot6">
      <financial :mainData="mainData"></financial>
    </div>
    <div slot="slot7">
      <contract :data="mainData"></contract>
    </div>
    <div slot="slot8">
      <field :data="mainData"></field>
    </div>
  </basicDetails>
</template>

<script>
import salescope from './modules/salescope/list'
import SaleClass from './modules/saleclass/index'
import accountMoney from './modules/accountMoney/index'
import agentAddress from './modules/address/list'
import agentContact from './modules/contact/list'
import contract from './modules/contract/index'
import financial from '@/components/financialInfo/index.vue'
import field from './modules/field/index.vue'
export default {
  data () {
    return {
      mainData:{},
      mainAreaData:[],
      tablecols:[]
    }
  },
  components:{
    salescope,
    SaleClass,
    accountMoney,
    agentAddress,
    agentContact,
    financial,
    contract,
    field
  },
  methods:{
    async queryMainData (id) {
      const res = await this.$api.requested({
        "classname": "webmanage.sale.agents.agents",
        "method": "query_agentMain",
        "content": {
          "sa_agentsid": this.$route.query.id
        }
      })
      this.mainData = res.data
      this.$refs['details'].param.content.containssub = 1
      this.$refs['details'].param.content.sa_saleareaids = [this.mainData.sa_saleareaid]
      this.changeDataStructure()
    },
    pageChange (id,rowindex) {
      this.$router.replace({path:this.$route.path,query:{id:id,rowindex:rowindex}})
      this.queryMainData(id)
    },
    changeDataStructure () {
      this.mainAreaData = [
        {
          label:'经销商编号',
          value: this.mainData.agentnum
        },
        {
          label:'签约日期',
          value: this.mainData.signdate
        },
        {
          label:'经销商类型',
          value: this.mainData.type
        },
        {
          label:'上级经销商',
          value: this.mainData.parent_enterprisename
        },
        {
          label:'经销商等级',
          value: this.mainData.grade
        },
        {
          label:'营销区域',
          value: this.mainData.areaname
        },
        {
          label:'企业名称',
          value: this.mainData.enterprisename
        },
        
        {
          label:'省市县',
          value: `${this.mainData.province}-${this.mainData.city}-${this.mainData.county}`
        },
        {
          label:'详细地址',
          value: this.mainData.address
        },
        {
          label:'企业联系人',
          value: this.mainData.contact
        },
        {
          label:'联系电话',
          value: this.mainData.phonenumber
        },
        {
          label:'税号',
          value: this.mainData.taxno
        },
        {
          label:'创建人',
          value: this.mainData.createby
        },
        {
          label:'创建时间',
          value: this.mainData.createdate
        },
      ]
    },
    createAgentAccount () {
      this.$confirm('是否继续创建团队账户?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await this.$api.requested({
          "id": 20220920084301,
          "content": {
            "sys_enterpriseid":this.mainData.sys_enterpriseid
          }
        })
        this.tool.showMessage(res,()=>{
          this.queryMainData()
        })
        /*this.$message({
          type: 'success',
          message: '创建成功!'
        });*/
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消创建'
        });
      });
    }
  },
  mounted () {
    this.queryMainData(this.$route.query.id)
  },
  created () {
    // 获取表结构
    this.tablecols = this.tool.tabelCol(this.$route.name)['agentGrouptable'].tablecols
    // 验证权限
    this.tool.checkAuth(this.$route.name,'update')?'':this.$router.go(-1)
  },
}

</script>
<style>
</style>