<template>
  <div class="PropertyBody">
    <el-row type="flex" justify="space-between">
      <el-col :span="4" class="header">
        <span>客户管理</span>
      </el-col>
      <el-col :span="4" class="TextRight">
        <el-button v-if="propertyBtn.propertyBtn36" type="primary" plain size="mini" @click="ToView(AddCustomer,'','添加客户')">
          <i class="iconfont iconjiahao"></i>添加客户
        </el-button>
      </el-col>
    </el-row>
    <!-- index table -->
    <div class="section">
      <el-row class="seachSection" type="flex" justify="start">
        <el-col :span="8" class="inputMinWith">
          <el-input placeholder="甲方姓名/地址" v-model="Customer.search"></el-input>
        </el-col>
        <el-col :span="8" class="minWith">
          <el-button type="primary" round size="mini" @click="seachProperty(true)">查询</el-button>
          <el-button type="primary" round plain size="mini" @click="seachProperty(false)">重置</el-button>
          <el-button type="primary" v-if="propertyBtn.propertyBtn39" round plain size="mini" @click="exportExcel">导出excel</el-button>
        </el-col>
      </el-row>
      <el-table
        class="marT10 sectionTable"
        :data="CustomerTableData.rows"
        style="width: 100% text-align:center;"
        tooltip-effect="dark"
        :header-cell-style="{'background-color': '#fafafa',
    'font-weight':'800'}"
        ref="multipleTable"
        v-loading="loading"
        element-loading-spinner="el-icon-loading"
        element-loading-text="加载中..."
      >
        <el-table-column prop="id" label="编号" min-width="70" align="center"></el-table-column>
        <el-table-column label="公司名称" min-width="120" align="center" show-overflow-tooltip>
          <template slot-scope="row">
            <div style="cursor: pointer;" @click="InTheServe(row.row)">{{row.row.name}}</div>
          </template>
        </el-table-column>
        <el-table-column
          prop="mailingAddress"
          label="地址"
          min-width="200"
          align="center"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column label="操作" min-width="140" align="center">
          <template slot-scope="{row,$index}">
            <div>
              <el-button
                @click.native="CheckDetails(row,$index,'查看客户')"
                type="primary"
                size="mini"
                plain
                round
                v-if="propertyBtn.propertyBtn35"
              >查看</el-button>
              <el-button
                @click.native="ToView2(row,$index)"
                type="success"
                size="mini"
                plain
                round
                v-if="propertyBtn.propertyBtn37"
              >编辑</el-button>
              <el-tooltip
                class="item"
                effect="dark"
                content="产生过服务关系,不能删除"
                placement="bottom-start"
                :disabled="row.status===1?true:false"
              >
                <el-button
                  @click.native="DeleteCus(row,$index)"
                  :type="row.status==1?'danger':'info'"
                  size="mini"
                  plain
                  round
                  v-if="propertyBtn.propertyBtn38"
                >删除</el-button>
              </el-tooltip>
              <!-- <el-button
                @click.native="TheContactModal(row,$index)"
                type="warning"
                size="mini"
                plain
                round
              >联系人</el-button>-->
            </div>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagenation">
        <el-pagination
          background
          layout="prev, pager, next, sizes, total, jumper"
          @current-change="CustomerCurrentChange"
          @size-change="CustomerSizeChange"
          :page-sizes="[10,15,25,50]"
          :pagerCount="5"
          :current-page="Customer.pageNum"
          :total="CustomerTableData.total"
          @prev-click="customerPrev"
          @next-click="customerNext"
        ></el-pagination>
      </div>
    </div>
    <!--  -->
    <el-dialog
      :visible.sync="plans"
      :title="plansText"
      width="780px"
      class="ModalToview"
      :before-close="closeModal"
    >
      <div class="AddcusT_form">
        <el-form :model="AddCustomer" :rules="rules" ref="AddCustomer">
          <el-row type="flex" class="AddcusT_Row" justify="space-between">
            <el-col :span="10">
              <el-form-item label="公司名称" prop="propertyCompany.name">
                <el-input v-model="AddCustomer.propertyCompany.name" placeholder="请填写公司名称"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="通讯地址" prop="propertyCompany.mailingAddress">
                <el-input
                  v-model="AddCustomer.propertyCompany.mailingAddress"
                  placeholder="请填写公司地址"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <div class="addcustheader" v-if="propertyBtn.propertyBtn40">客户联系人</div>
          <el-table
            :data="AddCustomer.propertyContacts"
            style="width:100%;text-align:center;"
            tooltip-effect="dark"
            :header-cell-style="{'background-color': '#fafafa',
    'font-weight':'800'}"
            ref="AddCustomer.user"
            v-if="propertyBtn.propertyBtn40"
            class="AddcusT_tab"
          >
            <el-table-column prop="name" label="姓名" min-width="60" align="center">
              <template slot-scope="row">
                <!-- <input type="text" v-if="row.row.showEdit" v-model="row.row.name" />
                <span v-if="!row.row.showEdit">{{row.row.name}}</span>-->
                <el-form-item
                  :prop="'propertyContacts.' + row.$index + '.name'"
                  :rules="EidtorRules.userName"
                >
                  <input type="text" v-if="row.row.showEdit" v-model="row.row.name">
                  <span v-if="!row.row.showEdit">{{row.row.name}}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="job" label="职位" min-width="60" align="center">
              <template slot-scope="row">
                <input type="text" v-if="row.row.showEdit" v-model="row.row.job">
                <span v-if="!row.row.showEdit">{{row.row.job}}</span>
              </template>
            </el-table-column>
            <el-table-column prop="telephone" label="手机号" min-width="60" align="center">
              <template slot-scope="row">
                <!-- <input type="text" v-if="row.row.showEdit" v-model="row.row.telephone" /> -->
                <!-- <span v-if="!row.row.showEdit">{{row.row.telephone}}</span> -->
                <el-form-item
                  :prop="'propertyContacts.' + row.$index + '.telephone'"
                  :rules="EidtorRules.phone"
                >
                  <input type="text" v-if="row.row.showEdit" v-model="row.row.telephone">
                  <span v-if="!row.row.showEdit">{{row.row.telephone}}</span>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="操作" min-width="60" align="center">
              <template slot-scope="{row,$index}">
                <div>
                  <el-button
                    @click.native="changeRole(row,$index)"
                    type="primary"
                    size="mini"
                    plain
                    round
                    v-if="!row.showEdit"
                  >编辑</el-button>
                  <el-button
                    @click.native="saveInfo(row,$index)"
                    type="warning"
                    size="mini"
                    round
                    v-if="row.showEdit"
                  >保存</el-button>
                  <el-button
                    @click.native="reductionInfo(row,$index)"
                    type="warning"
                    size="mini"
                    round
                    v-if="row.showEdit"
                  >取消</el-button>
                  <el-button
                    @click.native="DeleteCusPeople(row,$index)"
                    type="success"
                    size="mini"
                    plain
                    round
                    v-if="!row.showEdit"
                  >删除</el-button>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div></div>
          <div class="addpeople" v-if="propertyBtn.propertyBtn40">
            <span @click="addPeople">+添加联系人</span>
          </div>
          <div style="text-align:center">
            <el-button
              type="primary"
              size="mini"
              round
              @click="confirm"
              v-loading.fullscreen.lock="fullscreenLoading"
            >确认</el-button>
            <el-button type="primary" size="mini" round plain @click="closePeople">取消</el-button>
          </div>
        </el-form>
      </div>
    </el-dialog>
    <!-- 查看 -->
    <el-dialog
      :visible.sync="details"
      title="查看企业"
      width="780px"
      class="ModalToview"
      :before-close="closeModal2"
    >
      <div class="AddcusT_form">
        <el-row type="flex" class="AddcusT_Row" justify="space-between">
          <el-col :span="10">
            <span>公司名称:</span>
            <span>{{checkData.company.name}}</span>
          </el-col>
          <el-col :span="10">
            <span>通讯地址:</span>
            <span>{{checkData.company.mailingAddress}}</span>
          </el-col>
        </el-row>
        <div class="addcustheader">客户联系人</div>
      </div>
      <el-table
        :data="checkData.checkDatas"
        tooltip-effect="dark"
        :header-cell-style="{'background-color': '#fafafa',
    'font-weight':'800'}"
        ref="checkDatas"
        class="AddcusT_tab"
      >
        <el-table-column prop="name" label="姓名" min-width="60" align="center"></el-table-column>
        <el-table-column prop="job" label="职位" min-width="60" align="center"></el-table-column>
        <el-table-column prop="telephone" label="手机号" min-width="60" align="center"></el-table-column>
        <!-- <el-table-column label="操作" min-width="60" align="center">
          <template>
            <div>
              <el-button type="info" size="mini" plain round :disabled="true">编辑</el-button>
              <el-button type="info" size="mini" plain round :disabled="true">删除</el-button>
            </div>
          </template>
        </el-table-column> -->
      </el-table>
      <div class="pagenation">
        <el-pagination
          background
          layout="prev, pager, next, total"
          @current-change="TheContactPage"
          :page-size="10"
          :total="CheckPage.totalNum"
        ></el-pagination>
      </div>
    </el-dialog>
    <!--  -->
    <!-- 编辑客户 -->
    <el-dialog
      :visible.sync="EditorHidden"
      title="客户编辑"
      width="780px"
      class="ModalToview Ediot_Cust"
      :before-close="EidtorClose"
    >
      <div class="AddcusT_form">
        <el-form :model="AddCustomer2" :rules="EidtorRules" ref="AddCustomer2">
          <el-row type="flex" class="AddcusT_Row" justify="space-between">
            <el-col :span="10">
              <el-form-item label="公司名称" prop="propertyCompany.name">
                <el-input v-model="AddCustomer2.propertyCompany.name" @input="ChangeNameClick"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="通讯地址" prop="propertyCompany.mailingAddress">
                <el-input
                  v-model="AddCustomer2.propertyCompany.mailingAddress"
                  @input="ChangeNameClick"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <div class="addcustheader" v-if="propertyBtn.propertyBtn40">客户联系人</div>
          <el-table v-if="propertyBtn.propertyBtn40"
            :data="AddCustomer2.propertyContacts"
            style="width:100%;text-align:center;"
            tooltip-effect="dark"
            :header-cell-style="{'background-color': '#fafafa',
    'font-weight':'800'}"
            class="AddcusT_tab"
          >
            <el-table-column prop="name" label="姓名" min-width="60" align="center">
              <template slot-scope="row">
                <el-form-item
                  :prop="'propertyContacts.' + row.$index + '.name'"
                  :rules="EidtorRules.userName"
                >
                  <el-input
                    :disabled="row.row.isEdit"
                    v-model="row.row.name"
                    :class="[!row.row.isEdit?'':'EdiotInput_customer']"
                    @input="ChangeNameClick2"
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="job" label="职位" min-width="60" align="center">
              <template slot-scope="row">
                <el-input
                  :disabled="row.row.isEdit"
                  v-model="row.row.job"
                  :class="!row.row.isEdit?'':'EdiotInput_customer'"
                  @input="ChangeNameClick2"
                ></el-input>
              </template>
            </el-table-column>
            <el-table-column prop="telephone" label="手机号" min-width="60" align="center">
              <template slot-scope="{row,$index}">
                <el-form-item
                  :prop="'propertyContacts.' + $index + '.telephone'"
                  :rules="EidtorRules.phone"
                >
                  <el-input
                    :disabled="row.isEdit"
                    v-model="row.telephone"
                    :class="!row.isEdit?'':'EdiotInput_customer'"
                    @input="ChangeNameClick2"
                  ></el-input>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="操作" min-width="60" align="center">
              <template slot-scope="{row,$index}">
                <div>
                  <el-button
                    @click.native="changeEditorRole(row,$index)"
                    :type="row.isEdit?'primary':'warning'"
                    size="mini"
                    plain
                    round
                  >{{row.isEdit?"编辑":"保存"}}</el-button>
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="有关联项目不可删除"
                    :disabled="row.status==1?true:false"
                    placement="bottom-start"
                  >
                    <el-button
                      @click.native="reductionEditorInfo(row,$index)"
                      :type="row.status==1?'danger':'info'"
                      size="mini"
                      round
                      plain
                    >删除</el-button>
                  </el-tooltip>
                </div>
              </template>
            </el-table-column>
          </el-table>
          <div></div>
          <div class="addpeople" v-if="propertyBtn.propertyBtn40">
            <span @click="addEidor_customer">+添加联系人</span>
          </div>
          <el-row type="flex" class="row-bg" justify="space-between">
            <el-col :span="4" >
              <div style="text-align:left" >
                <el-pagination v-if="propertyBtn.propertyBtn40"
                  background
                  layout="prev, pager, next, total"
                  @current-change="TheContactPage"
                  :page-size="20"
                  :total="AddCustomer2.total"
                ></el-pagination>
              </div>
            </el-col>
            <el-col :span="4">
              <div style="text-align:right">
                <el-button
                  type="primary"
                  size="mini"
                  round
                  @click="EditrConfirm"
                  v-loading.fullscreen.lock="EidtorLoading"
                >确认</el-button>
                <el-button type="primary" size="mini" round plain @click="EidtorClose">取消</el-button>
              </div>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-dialog>
    <!--  -->
    <!-- 服务中的项目 -->
    <el-dialog
      title="公司项目"
      :visible.sync="ServiceProject"
      width="880px"
      class="ServicePro_c"
      :before-close="projectClose"
    >
      <el-tabs v-model="TabTabelProject" @tab-click="removeTab">
        <el-tab-pane label="正在服务中的项目" name="first"></el-tab-pane>
        <el-tab-pane label="曾经服务中的项目" name="second"></el-tab-pane>
      </el-tabs>
      <el-table
        :data="DataCont.rows"
        style="width: 100% text-align:center;"
        border
        tooltip-effect="dark"
        :header-cell-style="{'background-color': '#fafafa', 'font-weight':'800'}"
      >
        <el-table-column prop="projectCode" label="项目编号" min-width="60" align="center"></el-table-column>
        <el-table-column prop="projectName" label="项目名称" min-width="60" align="center"></el-table-column>
        <el-table-column prop="address" label="项目地址" min-width="60" align="center"></el-table-column>
        <el-table-column prop="num" label="在保台量" min-width="60" align="center"></el-table-column>
        <el-table-column prop="startDate" label="开始时间" min-width="60" align="center"></el-table-column>
        <el-table-column prop="endDate" label="结束时间" min-width="60" align="center"></el-table-column>
        <el-table-column prop="contactName" label="甲方项目负责人" min-width="60" align="center"></el-table-column>
        <el-table-column prop="contactTelephone" label="甲方联系电话" min-width="60" align="center"></el-table-column>
      </el-table>
      <div class="pagenation">
        <el-pagination
          background
          layout="prev, pager, next, total"
          @current-change="TheContactPage"
          :page-size="5"
          :total="NavBarData.total"
        ></el-pagination>
      </div>
    </el-dialog>
    <!--  -->
  </div>
</template>
<script>
export default {
  data() {
    var checkName = (rule, value, callback) => {
      if (value === "") {
        return callback(new Error("名字不能为空"));
      } else {
        return callback();
      }
    };
    var checkPhone = (rule, value, callback) => {
      if (value === "") {
        return callback(new Error("通讯地址不能为空"));
      } else {
        return callback();
      }
    };
    //添加人员姓名不能为空
    var telephone = (rule, value, callback) => {
      if (value === "") {
        // this.marginBt10=true;
        return callback(new Error("手机号码不能为空"));
      } else {
        return callback();
      }
    };
    return {
      fullscreenLoading: false,
      details: false,
      judge: false,
      CustomerTableData: {
        prev: false,
        next: false,
        rows: [],
        total: 0
      },
      Customer: {
        pageNum: 1,
        pageSize: 10,
        info: "",
        search: "",
        CustomerTablepageCount: 1,
        total: 0
      },
      loading: true,
      plans: false,
      plansText: "",
      AddCustomer: {
        propertyCompany: {
          name: "",
          mailingAddress: "",
          mtCompanyId: JSON.parse(sessionStorage.getItem("companyID")).id,
          creatorId: JSON.parse(sessionStorage.getItem("user"))
        },
        propertyContacts: []
      },
      //旧数据
      datad: {},
      rules: {
        "propertyCompany.name": [
          { required: true, validator: checkName, trigger: "blur" }
        ],
        "propertyCompany.mailingAddress": [
          { required: true, validator: checkPhone, trigger: "blur" }
        ],
        phone: [{ validator: telephone, trigger: "blur" }],
        userName: [{ required: true, message: "姓名不能为空", trigger: "blur" }]
      },
      disabled: false,
      ab: "",
      TheContact: false,
      currTheContact: 1,
      // 查看分页
      CheckPage: {
        currPage: 1,
        totalNum: 0
      },
      checkData: {
        company: {
          name: "",
          mailingAddress: ""
        },
        checkDatas: []
      },
      // tab
      ServiceProject: false,
      TabTabelProject: "first",
      DataCont: {
        rows: []
      },
      NavBarData: {
        status: "",
        id: "",
        pagesize: 5,
        pagenum: 1,
        total: 0
      },
      // 编辑客户
      EditorHidden: false,
      isInputChange: false,
      isInputChange2: false,
      isAddCurtomer: true,
      AddCustomer2: {
        pageCount: 1,
        total: 0,

        propertyCompany: {
          ppCompanyId: "",
          name: "",
          mailingAddress: "",
          mtCompanyId: JSON.parse(sessionStorage.getItem("companyID")).id,
          creatorId: JSON.parse(sessionStorage.getItem("user"))
        },
        propertyContacts: []
      },
      EidtorRules: {
        "propertyCompany.name": [
          { required: true, validator: checkName, trigger: "blur" }
        ],
        "propertyCompany.mailingAddress": [
          { required: true, validator: checkPhone, trigger: "blur" }
        ],
        phone: [{ validator: telephone, trigger: "blur" }],
        userName: [{ required: true, message: "姓名不能为空", trigger: "blur" }]
      },
      EidtorLoading: false,
      abc: null,
      propertyBtn:{
        propertyBtn35:0,
        propertyBtn36:0,
        propertyBtn37:0,
        propertyBtn38:0,
        propertyBtn39:0,
        propertyBtn40:0,
      }
    };
  },
  created() {
    var propertyBtn = {}
    this.getButton(34).then(result => {
      if (result.data.statusCode==="1") {
        propertyBtn = result.data.data
        propertyBtn.map((item)=>{
          if(item.id==35){
            this.propertyBtn.propertyBtn35 = item.checked?1:0 
          }else if(item.id==36){
            this.propertyBtn.propertyBtn36 = item.checked?1:0  
          }else if(item.id==37){
            this.propertyBtn.propertyBtn37 = item.checked?1:0  
          }else if(item.id==38){
            this.propertyBtn.propertyBtn38 = item.checked?1:0  
          }else if(item.id==39){
            this.propertyBtn.propertyBtn39 = item.checked?1:0  
          }else if(item.id==40){
            this.propertyBtn.propertyBtn40 = item.checked?1:0  
          }
        })
      }
    });
  },
  mounted() {
    /*  **获取表单数据**  */
    this.getCustomer();
  },
  methods: {
    ToView(row, index, a) {
      this.isAddCurtomer = true;
      this.plans = true;
      this.plansText = a;
      this.ruleForm = row;
      this.ab = a;
      if (a === "查看客户") {
        this.disabled = true;
      } else {
        this.disabled = false;
      }
    },
    ToView2(row, index) {
      this.AddCustomer2 = {
        pageCount: 1,
        total: 0,
        propertyCompany: {
          ppCompanyId: "",
          name: "",
          mailingAddress: "",
          mtCompanyId: JSON.parse(sessionStorage.getItem("companyID")).id,
          creatorId: JSON.parse(sessionStorage.getItem("user"))
        },
        propertyContacts: []
      };
      this.isAddCurtomer = true;
      this.AddCustomer2.propertyCompany.name = row.name;
      this.AddCustomer2.propertyCompany.mailingAddress = row.mailingAddress;
      this.AddCustomer2.propertyCompany.ppCompanyId = row.id;
      var url = "enterprise/property-contact/list";
      var params = { ppCompanyId: row.id, pageNum: 1, pageSize: 20 };
      this.axios.post(url, params).then(res => {
        if (res.statusCode == "1") {
          this.AddCustomer2.total = res.data.total;
          this.AddCustomer2.propertyContacts = res.data.rows.map(item => {
            item.isEdit = true;
            return item;
          });
          this.EditorHidden = true;
        } else if (res.statusCode == "9") {
          this.AddCustomer2.total = 0;
          this.EditorHidden = true;
        } else {
          this.$message.error(res.message);
        }
      });
    },
    // 查看详情
    CheckDetails(...age) {
      this.details = true;
      this.checkData.company = age[0];
      var url = "enterprise/property-contact/list";
      var params = {
        ppCompanyId: age[0].id,
        pageNum: 1,
        pageSize: 20
      };
      this.axios.post(url, params).then(res => {
        if (res.statusCode === "1") {
          this.checkData.checkDatas = res.data.rows;
        }
      });
    },
    // 页码发生改变
    CustomerCurrentChange(val) {
      this.Customer.pageNum = val;
      this.getCustomer();
    },
    // 条数发生改变
    CustomerSizeChange(val) {
      this.Customer.pageNum = 1;
      this.Customer.pageSize = val;
      this.getCustomer();
    },
    AddTheCus() {
      this.disabled = true;
    },

    // 关闭
    closeModal(done) {
      this.AddCustomer.propertyCompany.name = "";
      this.AddCustomer.propertyCompany.mailingAddress = "";
      this.AddCustomer.propertyContacts = new Array();
      this.$refs["AddCustomer"].resetFields();
      done();
    },
    closeModal2(done) {
      this.checkData.checkDatas = [];
      done();
    },
    // 关闭
    closePeople() {
      this.AddCustomer.propertyCompany.name = "";
      this.AddCustomer.propertyCompany.mailingAddress = "";
      this.AddCustomer.propertyContacts = new Array();
      this.plans = false;
      this.$refs["AddCustomer"].resetFields();
    },
    /* 初次获取表单数据 */

    getCustomer() {
      var url = "enterprise/property-company/list";
      var CompanyList = JSON.parse(sessionStorage.getItem("companyID"));

      //  var userID=JSON.parse(sessionStorage.getItem('user'));
      var params = this.Customer;
      params.mtCompanyId = CompanyList.id;
      this.axios.post(url, params).then(res => {
        if (res.statusCode) {
          this.loading = false;
        }
        if (res.statusCode === "0") {
          this.$message.error(res.message);
          this.CustomerTableData.rows = [];
          this.CustomerTableData.total = 0;
        } else if (res.statusCode === "1") {
          this.Customer.CustomerTablepageCount = res.pageCount;
          this.CustomerTableData = res.data;
        } else {
          this.CustomerTableData.rows = [];
          this.CustomerTableData.total = 0;
        }
      });
    },
    //上一页
    customerPrev(val) {
      this.Customer.pageNum = val;
      this.getCustomer();
    },
    //下一页
    customerNext(val) {
      this.Customer.pageNum = val;
      this.getCustomer(val);
    },
    // 增加客户 编辑页面
    changeRole(row, i) {
      Object.assign(this.datad, row);
      var a = row;
      this.isAddCurtomer = false;
      a.showEdit = true;
      this.$set(this.AddCustomer.propertyContacts, i, a);
    },
    // 保存
    saveInfo(row, i) {
      this.isAddCurtomer = true;
      row.showEdit = false;
      this.$set(this.AddCustomer.propertyContacts, i, row);
    },
    // 取消
    reductionInfo(row, i) {
      this.isAddCurtomer = true;
      this.judge = false;

      this.AddCustomer.propertyContacts.splice(i, 1);
    },
    // 新增删除
    DeleteCusPeople(row, index) {
      this.AddCustomer.propertyContacts.splice(index, 1);
    },
    // 添加客户
    addPeople() {
      if (!this.isAddCurtomer) return;
      var a = {
        name: "",
        job: "",
        telephone: "",
        showEdit: true,
        creatorId: JSON.parse(sessionStorage.getItem("user"))
      };
      this.$refs["AddCustomer"].validate(valid => {
        if (valid) {
          this.isAddCurtomer = false;
          this.judge = true;
          this.AddCustomer.propertyContacts.push(a);
        }
      });
    },
    // 确认创建
    confirm() {
      var isCon = false;
      this.$refs.AddCustomer.validate(valid => {
        isCon = valid;
      });
      if (isCon) {
        this.llscreenLoading = true;
        var dd = JSON.parse(sessionStorage.getItem("companyID"));
        var url = "enterprise/property-company/add";
        this.axios.post(url, this.AddCustomer).then(res => {
          if (res.statusCode) {
            this.llscreenLoading = false;
          }
          if (res.statusCode === "1") {
            this.$alert(res.message, "操作提示", {
              confirmButtonText: "确定",
              callback: action => {
                this.getCustomer();
                this.closePeople();
              }
            });
          } else {
            this.$alert(res.message, "操作提示", {
              confirmButtonText: "确定"
            });
          }
        });
      }
    },
    // 删除客户
    DeleteCus(row, i) {
      var _this = this;
      if (row.status === 1) {
        this.$confirm(
          "确定要删除此客户吗？(删除后该客户的联系人将一并删除)",
          "提示",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning"
          }
        )
          .then(() => {
            var url = "enterprise/property-company/delete";
            var params = { id: row.id };
            _this.axios.post(url, params).then(res => {
              if (res.statusCode == "1") {
                _this.getCustomer();
                this.$message({
                  type: "success",
                  message: "删除成功!"
                });
              } else {
                this.$message(res.message);
              }
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "已取消删除"
            });
          });
      }
    },
    // 编辑客户
    ChangeNameClick() {
      this.isInputChange = true;
    },
    ChangeNameClick2() {
      this.isInputChange2 = true;
    },
    // 编辑客户
    changeEditorRole(row, index) {
      var _this = this;

      if (row.isEdit) {
        this.isAddCurtomer = false;
        row.isEdit = false;
      } else {
        this.$refs["AddCustomer2"].validate(valid => {
          if (valid) {
            this.AddGood(row, index);
          } else {
            return false;
          }
        });
      }
    },
    //
    AddGood(row, index) {
      this.isAddCurtomer = true;
      if (row.isAddUpdate) {
        var url = "enterprise/property-contact/add";
        var newprodata = row;
        newprodata.creatorId = JSON.parse(sessionStorage.getItem("user"));
        newprodata.ppCompanyId = this.AddCustomer2.propertyCompany.ppCompanyId;
        this.axios.post(url, newprodata).then(res => {
          this.getEditordata();
          if (res.statusCode == "0") {
            this.$message(res.message);
          }
        });
        row.isEdit = true;
      } else {
        var url = "enterprise/property-contact/update";
        var editparam = row;
        editparam.creatorId = JSON.parse(sessionStorage.getItem("user"));
        this.axios.post(url, editparam).then(res => {
          this.getEditordata();
          if (res.statusCode == "0") {
            this.$message(res.message);
          }
        });
        row.isEdit = true;
      }
    },
    // 删除客户
    reductionEditorInfo(row, index) {
      this.isAddCurtomer = true;
      if (row.id === "") {
        this.AddCustomer2.propertyContacts.splice(index, 1);
        return;
      }
      var _this = this;
      this.$confirm("此操作将永久删除联系人, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          var url = "enterprise/property-contact/delete";
          var params = { id: row.id };
          _this.axios.post(url, params).then(res => {
            this.getEditordata();
            if (res.statusCode !== "0") {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
            } else {
              this.$message(res.message);
            }
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除"
          });
        });
    },
    // 加载数据函数
    getEditordata() {
      var _this = this;
      var url = "enterprise/property-contact/list";
      var params = {
        ppCompanyId: _this.AddCustomer2.propertyCompany.ppCompanyId,
        pageNum: 1,
        pageSize: 20
      };
      _this.axios.post(url, params).then(res => {
        if (res.statusCode == "1") {
          this.AddCustomer2.total = res.data.total;
          _this.AddCustomer2.propertyContacts = res.data.rows.map(item => {
            item.isEdit = true;
            return item;
          });
        } else if (res.statusCode == "9") {
          this.AddCustomer2.total = 0;
          _this.AddCustomer2.propertyContacts = [];
        } else {
          _this.$message.error(res.message);
        }
      });
    },
    // 取消
    EidtorClose() {
      this.$refs["AddCustomer2"].resetFields();
      // this.AddCustomer2 = {
      //   pageCount: 1,
      //   total: 0,
      //   propertyCompany: {
      //     ppCompanyId: "",
      //     name: "",
      //     mailingAddress: "",
      //     mtCompanyId: JSON.parse(sessionStorage.getItem("companyID")).id,
      //     creatorId: JSON.parse(sessionStorage.getItem("user"))
      //   },
      //   propertyContacts: []
      // };
      this.EditorHidden = false;
    },
    // 确定
    EditrConfirm() {
      this.EditorHidden = false;
      if (this.isInputChange) {
        var url = "enterprise/property-company/update";
        let paramsData = this.AddCustomer2.propertyCompany;
        var params = {
          id: paramsData.ppCompanyId,
          name: paramsData.name,
          mailingAddress: paramsData.mailingAddress
        };
        this.axios.post(url, params).then(res => {
          if (res.statusCode !== "0") {
            this.getCustomer(this.IndexPage);
          }else{
            this.$message.error(res.message);
          }
        });
      }
    },
    // 添加
    addEidor_customer() {
      if (!this.isAddCurtomer) return;
      var a = {
        name: "",
        job: "",
        telephone: "",
        id: "",
        isEdit: false,
        isAddUpdate: true,
        creatorId: JSON.parse(sessionStorage.getItem("user"))
      };
      this.AddCustomer2.propertyContacts.push(a);
      this.isAddCurtomer = false;
    },
    //打开服务中的项目
    InTheServe(row) {
      this.ServiceProject = true;
      var obj = new Object();
      this.NavBarData.id = row.id;
      this.removeTab();
    },
    // 服务中的项目tab
    removeTab() {
      this.NavBarData.pagenum = 1;
      this.NavBarData.total = 0;
      this.DataCont.rows = [];
      this.projectComlist();
    },
    projectComlist() {
      var Status = this.TabTabelProject === "first" ? 2 : 4;
      var url = "business/project/companyList";
      var params = {
        ppCompanyId: this.NavBarData.id,
        projectStatus: Status,
        pageNum: this.NavBarData.pagenum,
        pageSize: 5
      };
      this.axios.post(url, params).then(res => {
        if (res.statusCode == "1") {
          this.DataCont.rows = res.data.rows;
          this.NavBarData.total = res.data.total || 0;
        } else {
          this.$message(res.message);
        }
      });
    },
    projectClose() {
      this.NavBarData = {
        status: "",
        id: "",
        pagesize: 5,
        pagenum: 1,
        total: 0
      };
      this.DataCont.rows = [];
      this.TabTabelProject = "first";
      this.ServiceProject = false;
    },
    //项目翻页
    TheContactPage(val) {
      this.NavBarData.pagenum = val;
      this.projectComlist();
    },
    //
    seachProperty(a) {
      if (a) {
        this.Customer.info = this.Customer.search;
      } else {
        this.Customer.info = "";
      }
      var _this=this;
      // this.Customer.CustomerTablepageCount=1;
      this.$nextTick(() => {
        this.Customer.pageNum = 1;
        _this.CustomerCurrentChange(1);
      });
    },
    //
    exportExcel() {
      var url = "enterprise/property-company/export";
      var param = {
        mtCompanyId: JSON.parse(sessionStorage.getItem("companyID")).id
      };
      this.axios.post(url, param, { responseType: "arraybuffer" }).then(res => {
        const aLink = document.createElement("a");
        let blob = new Blob([res], { type: "application/vnd.ms-excel" });
        aLink.href = URL.createObjectURL(blob);
        aLink.setAttribute("download", "甲方公司" + ".xlsx");
        aLink.click();
        // this.$refs.loadElement.appendChild(aLink)
      });
    }
  }
};
</script>
<style lang="stylus">
.PropertyBody {
  .section {
    .el-loading-mask {
      rgba(255, 255, 255, 0.7);

      .el-icon-loading {
        font-size: 18px;
      }
    }
  }
}
</style>