<template>
  <div class="flex">
    <!-- 营销区域列表 -->
    <areaTree ref="arealist" style="width:250px;flex:0 1 auto" @onClick="onClick">
    </areaTree>
    <div class="hm-info-panel">
      <basicLayout 
        ref="basicLayout" 
        formPath="marketing2/saler"
        tableName="salerTable" 
        :idName="['sa_saleareaid','sa_salearea_hrid','hrid']"
        :apiId="{query:20221011144603,del:20221011144803}"
        :autoQuery="false"
        :options="options"
        :detailPath="{
          path:'/saler_detail'
        }">
        <div slot="custom"></div>
        <template v-slot:tbList="scope">
          <div v-if="scope.data.column.columnname === 'discountrate'">
            {{Math.round((scope.data.column.data.discountrate*100)*100)/100}}
          </div>
          <div v-else>
            {{scope.data.column.data[[scope.data.column.columnname]]?scope.data.column.data[[scope.data.column.columnname]]:'--'}}
          </div>
        </template>
      </basicLayout>
    </div>
  </div>
</template>

<script>
import areaTree from './area/list'
import addArea from './area/modules/add_area'
import editArea from './area/modules/edit_area'
import startArea from './area/modules/start_area'
import delArea from './area/modules/del_area'

export default {
  components:{
    areaTree,
    addArea,
    editArea,
    delArea,
    startArea,
  },
  data () {
    return {
      options:[],
      areaInfo:{}
    }
  },
  methods:{
    onClick (data) {
      this.areaInfo = data
      this.$refs['basicLayout'].param.content.sa_saleareaid = data.sa_saleareaid
      this.$refs['basicLayout'].listData()
      this.$store.dispatch('sendDataToForm',data)
    },
    onSuccess () {
      this.$refs.arealist.query_arealist()
    },
    onScopeSuccess () {
      this.$refs.salescope.query_areascope(this.areaInfo.sa_saleareaid)
    },
    editSuccess (form) {
      this.$refs.arealist.query_arealist(()=>{
        this.areaInfo = form
        this.$emit('onClick',this.areaInfo)
        this.$refs['arealist'].setCurrentKey(this.areaInfo.sa_saleareaid)
      })
    },
    onStartArea (status) {
      status === 1?this.areaInfo.isused = 0:this.areaInfo.isused = 1
    }
  }
}

</script>
<style>
</style>
<style scoped>
.flex{
  display: flex;
}
.hm-info-panel{
  flex:1;
  width:500px;
  height:calc(100vh - 100px);
  overflow-y:scroll
}
</style>