<template>
  <el-dialog title="详情查看" :visible.sync="dialogVisible">
    <el-row>
      <el-col :span="4"><label>基础信息</label></el-col>
      <el-col :span="4"><label>状态：</label>{{getStatusName(form.status)}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="12">公司全称：{{form.name}}</el-col>
      <el-col :span="6">公司简称：{{form.companyName}}</el-col>
      <el-col :span="6">负责人：{{form.leader}}</el-col>
    </el-row>
    <el-row>
      <el-col :span="12">地区：{{form.zoneName}}-{{form.provinceName}}-{{form.cityName}}-{{form.townName}}</el-col>
      <el-col :span="6">租车客服：{{form.vehiceServicePhone}}</el-col>
      <el-col :span="6">旅游客服：{{form.tourServicePhone}}</el-col>
    </el-row>
    <el-row>
      详细地址：{{form.addrDetail}}
    </el-row>

    <!--<el-row style="border-top: 1px dashed #dfe6ec;margin: 10px 0;">-->
      <!--<el-col :span="4"><label>股权信息</label></el-col>-->
      <!--<el-col :span="4"><label>状态：</label>{{form.stockState == 2?"募股中":"暂无"}}</el-col>-->
    <!--</el-row>-->
    <!--<el-row>-->
      <!--<el-col :span="8">总份额：{{form.total?form.total:0}}</el-col>-->
      <!--<el-col :span="8">剩余份额：{{form.balance?form.balance:0}}</el-col>-->
      <!--<el-col :span="8">股权单价：{{form.price?form.price/10000:"0"}}{{form.type == 1?'万/股':'港万/股'}}</el-col>-->
    <!--</el-row>-->

    <el-row style="border-top: 1px dashed #dfe6ec;margin: 10px 0;">
      <el-col :span="4"><label>公司信息</label></el-col>
    </el-row>
    <el-row>
      <el-col :span="2"> <span>图片：</span></el-col>
      <el-col :span="22">
        <img style="width: 100px;height: 100px;margin: 10px;" :src="item" v-for="item in imagesList"/>
      </el-col>
    </el-row>
    <el-row>
      公司介绍：{{form.describes}}
    </el-row>
    <el-row>
      公司详情：
      <div v-html="form.content"></div>
    </el-row>
  </el-dialog>
</template>
<style>
  .el-row{
    padding: 10px 0;
  }
</style>
<script>
  import {mapGetters} from 'vuex';
  import ElRow from "element-ui/packages/row/src/row";
  import ElCol from "element-ui/packages/col/src/col";
  import ElFormItem from "../../../../node_modules/element-ui/packages/form/src/form-item.vue";
  import {
    getSonRegionByCodes,
    getRegionByCodes,
  } from 'api/base_info/region/';

  import {
    getSysRegionByIds
  } from 'api/vehicle/vehicleInfo/';
  import {
    getAllZone
  } from 'api/base_info/constant/';
  import {
    addCompany,
    getCompanyDetail,
    updCompanyDetail
  } from 'api/base_info/branch_company';
  import {
    getToken
  } from 'utils/auth';

  export default {
    components: {
      ElFormItem,
      ElCol,
      ElRow},
    props: ["row"],
    name: 'infoModal',
    data() {
      return {
        imagesList: [],//图片
        form: {
          id: undefined,
          name: undefined,//全称
          branchType: 1,
          status: undefined,
          zoneId: undefined,
          addrProvince: undefined,
          addrCity: undefined,
          addrTown: undefined,
          addrDetail: undefined,
          leader: undefined,
          longitude: undefined,
          latitude: undefined,
          leaderContactInfo: undefined,
          updateTime: undefined,
          vehiceServicePhone: undefined,
          tourServicePhone: undefined,
          content: "",//详细介绍
          zoneName:"",//片区名称
        },
        tabName: "first",
        config: {
          initialFrameWidth: null,
          initialFrameHeight: 350
        },
        fileList2:[],//图片
        BASE_API: process.env.BASE_API,
        activeName2: undefined,
        dialogVisible:false,
        allZoneArr:[],//全部片区
        provinceRegions: [],//片区下省份数据
      }
    },
    created() {
      this.getInfo();
    },
    computed: {
      ...mapGetters([
        'elements',
        'companyStatusAndCode'
      ]),
      /**
       * 获取token
       */
      getHeaderWithToken() {
        return {Authorization: getToken()};
      },
      getAllZoneList(){
        this.allZoneArr = getAllZone();
        return getAllZone();
      },
//      provinceRegions() {
//        return getSonRegionByCodes(1);
//      },
      cityRegions() {
        if (!this.$utils.isInteger(this.form.addrProvince)) {
          return null;
        }
        return getSonRegionByCodes(this.form.addrProvince);
      },
      townRegions() {
        if (!this.$utils.isInteger(this.form.addrCity)) {
          return null;
        }
        return getSonRegionByCodes(this.form.addrCity);
      },
      cityRegions4Query() {
        if (!this.$utils.isInteger(this.listQuery.addrProvince)) {
          return null;
        }
        return getSonRegionByCodes(this.listQuery.addrProvince);
      },
      townRegions4Query() {
        if (!this.$utils.isInteger(this.listQuery.addrCity)) {
          return null;
        }
        return getSonRegionByCodes(this.listQuery.addrCity);
      }
    },
    watch: {
      dialogVisible(newValue, oldValue){
        if(!newValue){
          this.$emit("infoDialogEvent", false);
        }
      },
    },
    mounted() {
      this.dialogVisible = true;
      this.activeName2 = "first"
    },
    methods: {
      /**
       * 公司状态
       * */
      getStatusName(code) {
        if (!this.$utils.isInteger(code)) {
          return '未知';
        }
        return this.companyStatusAndCode[code].val;
      },
      /**
       * 富文本  营地详情
       * */
      editorReadyEvent(instance){
        let t = this;
        instance.addListener('contentChange', () => {
          t.form.content = instance.getContent();
        });
      },
      /**
       * 根据id获取分公司对应信息
       * */
      getInfo() {
        let t = this;
        this.listLoading = true;
        getCompanyDetail(this.row)
          .then(response => {
            let info = response.data;
            t.form= info;
//            t.form.name = info.name;//全称
//            t.form.companyName = info.companyName;//简称
//            t.form.zoneId = info.zoneId;//简称
//            t.form.describes = info.describes;//公司简介
//            t.form.content = info.content;//公司详情
//            t.form.addrProvince = info.addrProvince;//省-编码
//            t.form.addrCity = info.addrCity;//市-编码
//            t.form.addrTown = info.addrTown;//县-编码
//            t.form.addrDetail = info.addrDetail;//详细地址
//            t.form.leader = info.leader;//负责人
//            t.form.leaderContactInfo = info.leaderContactInfo;//负责人电话
//            t.form.status = info.status;//公司状态
//            t.form.latitude = info.latitude;//纬度
//            t.form.longitude = info.longitude;//经度
//            t.form.vehiceServicePhone = info.vehiceServicePhone;//租车客服电话
//            t.form.tourServicePhone = info.tourServicePhone;//旅游客服电话
            t.imagesList = info.images?info.images.split(","):[];
//            t.form.price = info.price;//股价
//            t.form.total = info.total;//总份额
//            t.form.balance = info.balance;//剩余份额
//            t.form.provinceName = info.provinceName;//省-名称
//            t.form.cityName = info.cityName;//市-名称
//            t.form.townName = info.townName;//县-名称
//            t.form.zoneName = info.zoneName;//片区名称
          })
      },
      /**
       * 添加
       **/
      create(formName) {
        const set = this.$refs;
        let params = {};
        set[formName].validate(valid => {
          if (valid) {
            console.log(this.form);
            let arr = [];
            this.fileList2.map(function(item){
              arr.push(item.url);
            });
            let provinceObj = this.form.addrProvince?getRegionByCodes([this.form.addrProvince]): [{name:""}];
            let cityObj = this.form.addrCity?getRegionByCodes([this.form.addrCity]):[{name:""}];
            let addrTownObj = this.form.addrCity?getRegionByCodes([this.form.addrTown]):[{name:""}];
            params.images = arr.join(",");
            params.name=  this.form.name;//全称
            params.companyName = this.form.companyName;//简称
            params.zoneId= this.form.zoneId;//片区id
            params.describes = this.form.describes;//公司简介
            params.content = this.form.content;//公司详情
            params.addrProvince = this.form.addrProvince;//省-编码
            params.provinceName = provinceObj[0].name;//省-名称
            params.addrCity = this.form.addrCity;//市-编码
            params.cityName = cityObj[0].name;//市-名称
            params.addrTown = this.form.addrTown;//县-编码
            params.townName = addrTownObj[0].name;//县-名称
            params.addrDetail = this.form.addrDetail;//详细地址
            params.leader = this.form.leader;//负责人
            params.leaderContactInfo = this.form.leaderContactInfo;//负责人电话
            params.status = this.form.status;//公司状态
            params.latitude=  this.form.latitude;//纬度
            params.longitude = this.form.longitude;//经度
            params.vehiceServicePhone = this.form.vehiceServicePhone;//租车客服电话
            params.tourServicePhone = this.form.tourServicePhone;//旅游客服电话
            console.log(params);
            addCompany(params)
              .then(res => {
                if(res.status==200){
                  this.$notify({
                    title: '成功',
                    message: '创建成功',
                    type: 'success',
                    duration: 2000
                  });
                  this.$emit("companyInfoDialogEvent", true);
                }else{
                  this.$notify({
                    title: '失败',
                    message: res.message,
                    type: 'error',
                    duration: 2000
                  });
                }
              })
          } else {
            return false;
          }
        });
      },
      /*
      * 切换tab
      * */
      handleClick(tab, event) {
        this.tabName = tab.name;
      },
      /**
       * 删除图片
       * */
      handleRemove(file, fileList){
        let list = [];
        fileList.map(function(item){
          if(item.url != file.url){
            list.push(item);
          }
        });
        this.fileList2 = list;
//        let arr = [];
//        this.form.bannerDTOS.map(function(item){
//          if(item.cover != file.url){
//            arr.push(item);
//          }
//        });
//        this.form.bannerDTOS = arr;
      },
      /**
       * 图片上传
       * **/
      handleBannerSuccess(res, file){
        this.fileList2.push({url:res.data});
      },
      /**
       * 改变省份，清空城市
       * */
      changeProvince(){
        this.form.addrCity = undefined;
        this.form.addrTown = undefined;
      },
      /**
       * 表单里面根据片区获取省份数据
       * */
      getProvinceRegionsForm(){
        let that = this;
        this.form.addrCity = undefined;
        this.form.addrProvince = undefined;
        this.form.addrTown = undefined;
        if (!this.$utils.isInteger(this.form.zoneId)) {
          return null;
        }
        this.allZoneArr.map(function(item){
          if(item.id == that.form.zoneId){
            getSysRegionByIds(item.provinceIds).then(response => {
              let listRs = undefined;
              if (!that.$utils.isEmpty(response.data)) {
                listRs = response.data;
              }
              that.provinceRegions = listRs;
            });
          }
        });
      },
      /**
       * 改变城市，清空城镇
       * */
      changeCity(){
        this.form.addrTown = undefined;
      },
    }
  }
</script>
