<template>
  <div>
    <dialog-edit :visible.sync="dialogVisible" :editModel="editModel" :form="form" :api="api" :saveFlag="false"
                 :title="$t('cyjg.financialRegionInfo.bigAreaMaintain')" :width="width">
      <search-form :componentList="searchList" :formValue.sync="queryParas" @handleFilter="handleFilter" @clearParam="clearParam">
      </search-form>
      <data-table :api="api" :sourceData.sync="sourceData" :columns="columns" :operateBtnLayout="operateBtnLayout"
                  :menuFlag="menuFlag" :showSelection="showSelection" :queryParas="queryParas"
                  @selectRowChange="selectRowChange" :loadCount.sync="loadCount" :store="$store">
        <template slot="headButton">
          <el-row>
            <el-col :span="24" class="btn-right">
              <auth-button type="primary" :label="$t('common.create')" size="medium" @click="add"></auth-button>
              <auth-button type="primary" :label="$t('cyjg.financialRegionInfo.delete')" size="medium" @click="del"></auth-button>
            </el-col>
          </el-row>
        </template>
        <!-- 核心企业 -->
        <template slot-scope="scope" slot="coreCompanyName">
            <el-link @click="showBusiness(scope.data.row)" :underline="underline" type="primary">{{scope.data.row.coreCompanyName}}</el-link>
        </template>
        <el-table-column :label="$t('common.operate')" align="center" width="200px">
          <template slot-scope="scope">
            <auth-button :title="$t('common.edit')" @click="onEditRow(scope.$index, scope.row, 'E')" icon="iconfont iconbianji" class="iconCircle"></auth-button>
          </template>
        </el-table-column>
      </data-table>
    </dialog-edit>
    <big-area-maintain :editModel="addModel" :form="item" :visible.sync="addVisible" :regMsg="msg" @saveSuccess="saveSuccess"></big-area-maintain>
    <pro-company-info-manage-edit :visible.sync="busVisible" :editModel="busModel" :form="busItem" :regMsg="regMsg"></pro-company-info-manage-edit>
  </div>
</template>

<script>
// 大区域维护(业务部)
import BaseEdit from '@/pages/baseEditPage.js'
import businessRegionInfoApi from '@/api/cyjg/businessRegionInfoApi.js'
import BigAreaMaintain from '@/pages/cyjg/businessRegionInfo/bigAreaMaintain.vue'
import { DialogEdit, searchForm, DataTable, authButton, SelectCoreEnterprise } from 'newepoch-components'
import ProCompanyInfoManageEdit from '@/pages/cyjg/financialRegionInfo/coreEnterpriseInfoManageEdit.vue'
export default {
  extends: new BaseEdit(),
  name: 'bigAreaMaintainView',
  components: {
    searchForm,
    DialogEdit,
    DataTable,
    authButton,
    BigAreaMaintain,
    SelectCoreEnterprise,
    ProCompanyInfoManageEdit
  },
  props: {
  },
  data () {
    return {
      busItem: {},
      busVisible: false,
      busModel: '',
      underline: true,
      width: '1480px',
      sourceData: [],
      menuFlag: false,
      showSelection: true,
      operateBtnLayout: '',
      loadCount: 0,
      selectedRows: [],
      // 查询条件
      queryParas: {
        pageIndex: 1,
        pageSize: 10,
        // 核心企业ID
        coreCompanyId: ''
      },
      // 查询表单
      searchList: [
        // 核心企业
        {
          label: this.$i18n.messages[this.$i18n.locale].cyjg.financialRegionInfo.coreEnterprise,
          labelWidth: '',
          value: 'coreCompanyId',
          componentName: SelectCoreEnterprise
        }
      ],
      columns: [
        // 核心企业
        {
          prop: 'coreCompanyName',
          align: 'left',
          slot: true,
          label: this.$i18n.messages[this.$i18n.locale].cyjg.financialRegionInfo.coreEnterprise,
          minWidth: '200px'
        },
        // 大区域
        {
          prop: 'areaName',
          align: 'left',
          label: this.$i18n.messages[this.$i18n.locale].cyjg.financialRegionInfo.bigArea,
          minWidth: '200px'
        }
      ],
      addVisible: false,
      item: {},
      addModel: 'C'
    }
  },
  computed: {
    api () {
      return businessRegionInfoApi.largePage
    },
    msg () {
      return this.$i18n.messages[this.$i18n.locale].regMsg
    }
  },
  methods: {
    // 打开项目公司界面
    showBusiness (data) {
      this.$set(data, 'tagCode', '60')
      this.$set(data, 'enterpriseId', data.coreCompanyId)
      this.busItem = Object.assign({}, data)
      this.busModel = 'V'
      this.busVisible = true
      // storage.setLocal('params', data)
      // this.$router.push({
      //   name: 'coreEnterpriseInfoManageEdit'
      // })
    },
    saveSuccess () {
      this.handleFilter()
      this.$emit('refreshBigArea')
    },
    // 复选框勾选数据
    selectRowChange (val) {
      this.selectedRows = val
    },
    // 查询
    handleFilter () {
      let $this = this
      $this.loadCount = $this.loadCount + 1
    },
    // 重置
    clearParam () {
      let $this = this
      $this.queryParas = {
        pageIndex: 1,
        pageSize: 10,
        coreCompanyId: ''
      }
    },
    add () {
      this.addModel = 'C'
      this.addVisible = true
      this.item = {}
    },
    // 批量删除
    del () {
      let common = this.$i18n.messages[this.$i18n.locale].common
      if (this.selectedRows.length === 0) {
        this.warning(common.delSelectedTip)
        return
      }
      let arr = this.selectedRows.map(it => {
        return it.keyId
      })
      let $this = this
      $this.$confirm(common.confirmTip, common.warningTip, {
        type: 'warning'
      }).then(() => {
        businessRegionInfoApi.businessRegionInfoQueryApi.dels({ ids: arr, delType: '3' }).then(res => {
          if (res && res.data) {
            $this.success(common.delSuccess)
            $this.handleFilter()
            $this.$emit('refreshBigArea')
          } else {
            $this.error(common.delFailure)
          }
        })
      }).catch(() => {})
    },
    // 查看详情
    onEditRow (index, data, type) {
      this.addModel = type
      this.item = JSON.parse(JSON.stringify(data))
      this.addVisible = true
    }
  },
  watch: {}
}
</script>

<style scoped>

</style>
