/**
* @Author think
* @Date 2019-06-14 15:07
*/

<template>
  <h-view class="public-style prj-create" title="申请创建">
    <h-content>
      <div class="picture">
        <img src="@/assets/image/projectCreate/project-create@2x.png">
      </div>
      <list-item :item-height="40">
        <item :has-border="false" :show-arrow="true" @click.native="selectAgent()">
          <div slot="name" class="required">经销商名称</div>
          <input
            slot="content" v-model="project.invoice_agent_id_n" placeholder="请选择经销商名称" type="text"
            readonly>
        </item>
        <item :has-border="false" :show-arrow="true" @click.native="selectBpclass()">
          <div slot="name" class="required">客户类别</div>
          <input
            slot="content" v-model="project.bp_class_n" placeholder="请选择客户类别" type="text"
            readonly>
        </item>
        <item :has-border="false" :show-arrow="true" @click.native="selectBusinesstype()">
          <div slot="name" class="required">业务类别</div>
          <input
            slot="content" v-model="project.business_type_n" placeholder="请选择业务类别" type="text"
            readonly>
        </item>
        <item :has-border="false" :show-arrow="true" @click.native="selectDivision()">
          <div slot="name" class="required">产品线</div>
          <input
            slot="content" v-model="project.division_n" placeholder="请选择产品线" type="text"
            readonly>
        </item>
        <item :has-border="false" :show-arrow="true" @click.native="selectCartype()">
          <div slot="name" class="required">车辆类型</div>
          <input
            slot="content" v-model="project.car_type_n" placeholder="请选择车辆类型" type="text"
            readonly>
        </item>
      </list-item>
      <h-button class="button-class radius-large" @click.native="create()">创建</h-button>
    </h-content>
  </h-view>
</template>

<script>
import projectService from './projectService'
export default {
  name: 'PrjCreate',
  data () {
    return {
      // 经销商
      bpagent: [],
      // 客户类别
      bp_classs: [],
      // 业务类型
      business_types: [],
      // 产品线
      divisions: [],
      // 车辆类型
      car_types: [],
      project: {
        invoice_agent_id: null,
        invoice_agent_id_n: null,
        bp_class: null,
        bp_class_n: null,
        business_type: null,
        business_type_n: null,
        division: null,
        division_n: null,
        car_type: null,
        car_type_n: null,
      },

    }
  },

  created: function () {
    let vm = this
    vm.initLoad()
  },
  activated () {
    projectService.cleanProject()
    projectService.cleanLease()
    projectService.cleanPrjBp()
    projectService.setOfferFlag(0)
    projectService.setClientInfoFlag(0)
    projectService.setCarFlag(0)
    projectService.setAttachFlag(0)
    projectService.setPrjUpdataFlag(false)
  },
  methods: {
    initLoad () {
      let vm = this
      let basePath = process.env.basePath
      let url = basePath + 'prj_entry_selected' // 项目创建入口下拉框
      let param = {}
      vm.hlsPopup.showLoading('请稍候')
      vm.hlsHttp.post(url, param).then(function (res) {
        vm.hlsPopup.hideLoading()
        if (res.result === 'S') {
          vm.bpagent = res.agent_list
          vm.bp_classs = res.bp_class_list
          vm.business_types = res.business_type_list
          vm.divisions = res.division_list
          vm.car_types = res.car_type_list
        }
      })
    },
    /**
     * 经销商下拉框选择
     */
    selectAgent () {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.bpagent,
        object: vm.project,
        code: 'invoice_agent_id',
        returnItem: function (index, result) {
          vm.project = result
        },
      })
    },
    /**
     * 客户类别下拉框选择
     */
    selectBpclass () {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.bp_classs,
        code: 'bp_class',
        object: vm.project,
        returnItem: function (index, result) {
          vm.project = result
        },
      })
    },
    /**
     * 业务类型下拉框选择
     */
    selectBusinesstype () {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.business_types,
        code: 'business_type',
        object: vm.project,
        returnItem: function (index, result) {
          vm.project = result
        },
      })
    },
    /**
     * 产品线下拉框选择
     */
    selectDivision () {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.divisions,
        code: 'division',
        object: vm.project,
        returnItem: function (index, result) {
          vm.project = result
        },
      })
    },

    /**
     * 车辆类型下拉框选择
     */
    selectCartype () {
      let vm = this
      vm.hlsPopup.selectList({
        list: vm.car_types,
        code: 'car_type',
        object: vm.project,
        returnItem: function (index, result) {
          vm.project = result
        },
      })
    },

    create () {
      let vm = this
      if (vm.project.bp_class && vm.project.business_type && vm.project.division && vm.project.car_type && vm.project.invoice_agent_id) {
        projectService.setProject(vm.project)
        this.$router.push({
          name: 'InfoMationMain',
          params: {
            reload: false,
          },
        })
      } else {
        vm.hlsPopup.showNotify({
          content: '请填写必填字段!',
          type: 'warning',
        })
        vm.hlsPopup.hideLoading()
      }
    },

  },
}
</script>

<style scoped lang="less">
  .prj-create {
    .content {
      background-color: #f7f7f8;
      padding-top: 0;

      .picture {
        width: 100%;
        margin-top: -1px;

        img {
          width: 100%;
        }
      }

      .hls-list-item {
        background-color: transparent;
        margin-top: -15px;
        position: relative;
        .hls-item {
          width: 92%;
          background-color: #fff;
          margin-top: 5px;
          margin-left: 15px;
          margin-right: 15px;
          border-radius: 10px;
        }
      }

      .button-class {
        width: 70%;
        margin: 0.2rem 15%;
        display: flex;
        justify-content: center;
        border-radius: 10px;
        background-color: @theme-color;
        color: #fff;
        border: none;
        &.activated {
          opacity: 0.8;
          -webkit-transform: scale(0.95);
          transform: scale(0.95)
        }
      }
    }
  }
</style>
