
<template>
  <div>
    <basicLayout 
      ref="basicLayout" 
      formPath="privateCustomer" 
      tableName="privateCustomerTable" 
      idName="userid" 
      :apiId="{query:20221013102602,del:''}"
      :options="options">
      <template v-slot:tbList="scope">
        <div v-if="scope.data.column.columnname == 'leader'">
          {{scope.data.column.data[[scope.data.column.columnname]].length > 0 ? scope.data.column.data[[scope.data.column.columnname]].length : '--'}}
        </div>
        <div v-else-if="scope.data.column.columnname == 'datastatus'">
          <span :style="scope.data.column.data[scope.data.column.columnname] == 0 ? '正常' : scope.data.column.data[scope.data.column.columnname] == 1 ? 'color:#cccccc' : 'color:red'">
            {{scope.data.column.data[scope.data.column.columnname] == 0 ? '正常' : scope.data.column.data[scope.data.column.columnname] == 1 ? '作废' : '锁定'}}
          </span>
        </div>
        <div v-else-if="scope.data.column.columnname == 'grade' && customerLead">
          {{customerLead.find(item => item.rowindex == scope.data.column.data[scope.data.column.columnname]).value}}
        </div>
        <div v-else>
          {{scope.data.column.data[scope.data.column.columnname] || scope.data.column.columnname == 'operation' ? scope.data.column.data[[scope.data.column.columnname]] : '--'}}
        </div>
      </template>
      <template v-slot:tbOpreation="scope">
        <status-change class="inline-16" @onSuccess="$refs.basicLayout.listData()" :data="scope.data.data" />
        <el-button size="mini" type="text" class="inline-16" @click="$router.push({path:'/PrivateCustomerDetail',query:{id:scope.data.data.sa_customersid,rowindex:scope.data.data.rowindex}})">详 情</el-button>
      </template>
    </basicLayout>
  </div>
</template>

<script>
import { log } from '@antv/g2plot/lib/utils'
import statusChange from './components/statusChange'
export default {
  data () {
    return {
      options:[],
      customerType:'',
      customerLead:'',
      arealist:[]
    }
  },
  provide () {
    return {
      customerType:() => this.customerType,
      customerLead:() => this.customerLead,
      arealist:() => this.arealist
    }
  },
  components:{statusChange},
  methods:{
    /* 获取系统选项数据 */
    async getSysOption() {
      /* 获取客户类型 */
      let res = await this.$store.dispatch('optiontypeselect','customertypemx')
      this.customerType = res.data
      /* 获取客户等级 */
      let res2 = await this.$store.dispatch('optiontypeselect','customergrade')
      this.customerLead = res2.data
    },
    /* 获取省市县 */
    async query_arealist() {
      const res = await this.$api.requested({
        "classname": "system.tools",
        "method": "query_arealist",
        "content": {
        }
      })
      this.arealist = this.tool.createMenu(res.data)
    },
  },
  created() {
    this.getSysOption()
    this.query_arealist()
  }
}

</script>
<style scoped>
/* /deep/.el-table__cell .cell {
  display: flex;
  justify-content: s;
} */
</style>