<template>
  <div>
    <div class="contradiction-div">
      <div class="search-div">
        <Row type="flex" justify="space-around" class="">
          <Col span="3">
            <span>姓名：</span>
            <Input v-model="params.user_name" style="width: 65%" />
          </Col>
          <Col span="4">
            <span>身份证号：</span>
            <Input v-model="params.cardno" style="width: 55%" />
          </Col>
          <Col span="4" style="margin-left: 5px">
            <span>联系方式：</span>
            <Input v-model="params.tel" style="width: 55%" />
          </Col>
          <Col span="4">
            <span>重点人员：</span>
            <Select style="width: 55%" v-model="params.is_zdry">
              <Option value="0">是</Option>
              <Option value="1">否 </Option>
            </Select>
          </Col>
          <Col span="5">
            <span>重点人员类别：</span>
            <Select style="width: 55%" v-model="params.label_id">
              <Option
                v-for="(item, index) in labelList"
                :key="index"
                :value="item.id"
                >{{ item.name }}</Option
              >
            </Select>
          </Col>
          <Col span="3" style="text-align: center">
            <Button
              type="primary"
              @click="searchData"
              style="margin-right: 10px"
              >搜索</Button
            >
            <Button
              v-if="severUserInfo.company_grade === '6'"
              type="primary"
              @click="searchPeople"
              >新增</Button
            >
          </Col>
        </Row>
      </div>
      <Table border :columns="tableColumns" :data="tableData">
        <template slot-scope="{ row, index }" slot="is_zdry">
          <span v-if="row.is_zdry === '0'">是</span>
          <span v-if="row.is_zdry === '1'">否</span>
        </template>
        <template slot-scope="{ row, index }" slot="key_focus_personnel_type">
          <span>{{ row.key_focus_personnel_type }}</span>
        </template>
        <template slot-scope="{ row, index }" slot="action">
          <Button
            type="info"
            size="small"
            style="margin-right: 5px"
            @click="showFamily(row)"
            >家庭成员</Button
          >
          <!-- <Button type="warning" size="small" style="margin-right: 5px" @click="showMDDetail(row)">矛盾详情</Button> -->
          <Button
            type="success"
            size="small"
            style="margin-right: 5px"
            @click="updatePeopleInfo(row)"
            >编辑</Button
          >
          <Button
            type="error"
            size="small"
            style="margin-right: 5px"
            @click="deletePeopleInfo(row)"
            >删除</Button
          >
          <!-- <Button type="error" size="small" style="margin-right: 5px">删除</Button> -->
          <Button type="info" size="small" @click="findPeopleZFLogList(row)"
            >走访日志</Button
          >
        </template>
      </Table>
      <Page
        class="page_style"
        :total="params.totalRecord"
        :current="params.pageNo"
        :page-size="params.pageSize"
        @on-change="changePageNo"
        show-total
        show-sizer
        @on-page-size-change="size"
      />
      <Modal v-model="controlData.show" title="输入证件号码" width="500">
        <Row>
          <Col
            span="6"
            style="text-align: right; margin-right: 10px; margin-top: 6px"
            >证件号码:</Col
          >
          <Col span="14">
            <Input v-model="controlData.cardnoInput" placeholder=""></Input>
          </Col>
        </Row>
        <div slot="footer">
          <Button type="text" size="large" @click="controlData.show = false"
            >取消</Button
          >
          <Button type="primary" size="large" @click="searchConfirm"
            >确定</Button
          >
        </div>
      </Modal>
      <Modal v-model="peopleForm.show" title="人员信息" width="900">
        <Form
          ref="formPerson"
          :model="peopleForm"
          :rules="ruleValidate"
          :label-width="120"
        >
          <Row>
            <Col span="23">
              <Row style="margin-top: 15px">
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="姓名">
                      <Input
                        :disabled="onlyShow"
                        v-model="peopleForm.user_name"
                        placeholder="请输入姓名"
                      ></Input>
                    </FormItem>
                  </p>
                </Col>
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="性别">
                      <Select
                        v-model="peopleForm.sex"
                        placeholder="请选择性别"
                      >
                        <Option value="1">男</Option>
                        <Option value="2">女</Option>
                      </Select>
                    </FormItem>
                  </p>
                </Col>
              </Row>
              <Row style="margin-top: 15px">
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="身份证号">
                      <Input
                        v-model="peopleForm.cardno"
                        placeholder="请输入身份证号"
                      ></Input>
                    </FormItem>
                  </p>
                </Col>
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="民族">
                      <Select
                        :disabled="onlyShow"
                        v-model="peopleForm.folk"
                        placeholder="请选择民族"
                      >
                        <Option
                          v-for="(item, index) in mzList"
                          :key="index"
                          :value="item.mzcode"
                          >{{ item.mzname }}</Option
                        >
                      </Select>
                    </FormItem>
                  </p>
                </Col>
              </Row>
              <Row style="margin-top: 15px">
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="政治面貌">
                      <Select
                        :disabled="onlyShow"
                        v-model="peopleForm.political_outlook"
                        placeholder="请选择政治面貌"
                      >
                        <Option value="0">群众</Option>
                        <Option value="1">共产党员</Option>
                        <Option value="2">共产主义青年团团员</Option>
                        <Option value="3">国民党革命委员会会员</Option>
                        <Option value="4">民主同盟盟员</Option>
                        <Option value="5">民主建国会会员</Option>
                        <Option value="6">民主促进会会员</Option>
                        <Option value="7">农工民主党党员</Option>
                        <Option value="8">致公党党员</Option>
                        <Option value="9">九三学社社员</Option>
                        <Option value="10">台湾民主自治同盟盟员</Option>
                        <Option value="11">无党派民主人士</Option>
                      </Select>
                    </FormItem>
                  </p>
                </Col>
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="重点人员">
                      <Select
                        :disabled="onlyShow"
                        v-model="peopleForm.is_zdry"
                        placeholder="请选择是否重点人员"
                      >
                        <Option value="0">是</Option>
                        <Option value="1">否</Option>
                      </Select>
                    </FormItem>
                  </p>
                </Col>
              </Row>
              <Row style="margin-top: 15px">
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="联系方式">
                      <Input
                        :disabled="onlyShow"
                        v-model="peopleForm.tel"
                        placeholder="请输入联系方式"
                      ></Input>
                    </FormItem>
                  </p>
                </Col>
                <Col span="12">
                  <p style="height: 40px">
                    <FormItem label="户主关系">
                      <Select
                        :disabled="onlyShow"
                        v-model="peopleForm.relation"
                        placeholder="请选择与户主关系"
                      >
                        <Option value="0">户主</Option>
                        <Option value="1">配偶</Option>
                        <Option value="2">子女</Option>
                        <Option value="3">父母</Option>
                        <Option value="4">岳父母或公婆</Option>
                        <Option value="5">祖父母</Option>
                        <Option value="6">媳婿</Option>
                        <Option value="7">孙祖女</Option>
                        <Option value="8">兄弟姐妹</Option>
                        <Option value="9">其他</Option>
                      </Select>
                    </FormItem>
                  </p>
                </Col>
              </Row>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="23">
              <p style="height: 40px">
                <FormItem label="现住址">
                  <Input
                    :disabled="onlyShow"
                    v-model="peopleForm.now_address"
                    placeholder="请输入现住址"
                  ></Input>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="23">
              <p style="height: 40px">
                <FormItem label="户籍地址">
                  <Input
                    :disabled="onlyShow"
                    v-model="peopleForm.hj_address"
                    placeholder="请输入户籍地址"
                  ></Input>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <!-- 重点人员类型 -->
            <Col span="8">
              <p style="height: 60px">
                <FormItem label="重点人员类型" prop="key_focus_personnel_type">
                  <!-- v-model="peopleForm.label_id_list" -->
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.key_focus_personnel_type"
                    placeholder="请选择重点人员类别"
                  >
                    <Option
                      v-for="(item, index) in labelList"
                      :key="index"
                      :value="item.id"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row>
            <!-- 高度关注情形 -->
            <Col span="23" v-if="peopleForm.key_focus_personnel_type !== '涉一级二级三级矛盾'">
              <p style="height: 40px">
                <FormItem label="高度关注情形" prop="">
                  <Select
                    multiple
                    v-model="peopleForm.key_focus_personnel_type_json.situation"
                    placeholder="请选择高度关注情形"
                  >
                    <Option
                      v-for="(item, index) in situationList"
                      :key="index"
                      :value="item.id"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
            <!-- “三失一偏”剩余表单项 -->
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '“三失一偏”'">
              <p style="height: 40px">
                <FormItem label="责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col11"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '“三失一偏”'">
              <p style="height: 40px">
                <FormItem label="责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col12"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <!-- 刑满释放 -->
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '刑满释放'">
              <p style="height: 40px">
                <FormItem label="重新犯罪倾向">
                  <i-switch v-model="peopleForm.key_focus_personnel_type_json.col21" size="large">
                    <span slot="open">有</span>
                    <span slot="close">无</span>
                  </i-switch>
                </FormItem>
              </p>
            </Col>
            <Col span="23" v-if="peopleForm.key_focus_personnel_type === '刑满释放' && peopleForm.key_focus_personnel_type_json.col21">
              <p style="">
                <FormItem label="具体表现">
                  <Select
                    multiple
                    v-model="peopleForm.key_focus_personnel_type_json.col26"
                    placeholder="请选择多多选"
                  >
                    <Option
                      v-for="(item, index) in col26List"
                      :key="index"
                      :value="item.id"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '刑满释放'">
              <p style="height: 40px">
                <FormItem label="安置帮教责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col22"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="7" v-if="peopleForm.key_focus_personnel_type === '刑满释放'">
              <p style="height: 40px">
                <FormItem label="安置帮教责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col23"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '刑满释放'">
              <p style="height: 40px">
                <FormItem label="重点人员责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col24"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '刑满释放'">
              <p style="height: 40px">
                <FormItem label="重点人员责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col25"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <!-- 严重精神障碍剩余表单项 -->
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="危险性评估等级">
                  <Select v-model="peopleForm.key_focus_personnel_type_json.col31">
                    <Option value="3">3</Option>
                    <Option value="4">4</Option>
                    <Option value="5">5</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="姓名">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col32"
                    placeholder="请输入姓名"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="7" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="与本人关系">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col33"
                    placeholder="请输入与本人关系"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="单位或住址">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col34"
                    placeholder="请输入单位或住址"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="联系方式">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col35"
                    placeholder="请输入联系方式"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="7" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="列控单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col36"
                    placeholder="请输入列控单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '严重精神障碍'">
              <p style="height: 40px">
                <FormItem label="责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col37"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <!-- 涉一级二级三级矛盾剩余表单项 -->
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉一级二级三级矛盾'">
              <p style="height: 40px">
                <FormItem>
                  <template slot="label">
                    <span style="">风险等级</span>
                    <Poptip trigger="hover" placement="bottom">
                      <template slot="content">
                        <div v-if="peopleForm.key_focus_personnel_type_json.col41 === '1'">
                          <p class="risk-tishi mt30 p20">
                            一级是指在二级矛盾风险基础上，排查对象存在婚姻家庭不幸、有重大疾病、有暴力倾向、有弃世厌世倾向、扬言报复社会等情形。
                          </p>
                        </div>
                        <div
                          v-else-if="peopleForm.key_focus_personnel_type_json.col41 === '2'"
                        >
                          <p class="risk-tishi mt30 p20">
                            二级是指重点人群涉及的重点信访事项、重点涉法涉诉类矛盾。
                          </p>
                        </div>
                        <div
                          v-else-if="peopleForm.key_focus_personnel_type_json.col41 === '3'"
                        >
                          <p class="risk-tishi mt30 p20">
                            三级是指重点人群涉及的一般矛盾纠纷和非重点人群涉及的重点信访事项、重点涉法涉诉类矛盾。
                          </p>
                        </div>
                        <div v-else></div>
                      </template>
                      <span style=""
                        ><Icon type="md-help-circle" style="margin-top: -2px"
                      /></span>
                    </Poptip>
                  </template>
                  <Select v-model="peopleForm.key_focus_personnel_type_json.col41">
                    <Option value="1">一级</Option>
                    <Option value="2">二级</Option>
                    <Option value="3">三级</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉一级二级三级矛盾'">
              <p style="height: 40px">
                <FormItem label="责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col42"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="7" v-if="peopleForm.key_focus_personnel_type === '涉一级二级三级矛盾'">
              <p style="height: 40px">
                <FormItem label="责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col43"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <!-- 涉重点信访事项剩余表单项 -->
            <Col span="23" v-if="peopleForm.key_focus_personnel_type === '涉重点信访事项'">
              <p style="height: 40px">
                <FormItem label="类别">
                  <Select multiple v-model="peopleForm.key_focus_personnel_type_json.col51">
                    <Option value="1">重复信访</Option>
                    <Option value="2">越级进京赴省上访</Option>
                    <Option value="3">缠访闹访</Option>
                    <Option value="4">扬言信访</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉重点信访事项'">
              <p style="height: 40px">
                <FormItem label="责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col52"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉重点信访事项'">
              <p style="height: 40px">
                <FormItem label="责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col53"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <!-- 涉重点涉法涉诉剩余表单项 -->
            <Col span="23" v-if="peopleForm.key_focus_personnel_type === '涉重点涉法涉诉'">
              <p style="height: 40px">
                <FormItem label="类别">
                  <Select multiple v-model="peopleForm.key_focus_personnel_type_json.col61">
                    <Option value="1">反诉申诉</Option>
                    <Option value="2">情绪激烈</Option>
                    <Option value="3">扬言采取极端行为</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉重点涉法涉诉'">
              <p style="height: 40px">
                <FormItem label="责任单位">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col62"
                    placeholder="请输入责任单位"
                  ></Input>
                </FormItem>
              </p>
            </Col>
            <Col span="8" v-if="peopleForm.key_focus_personnel_type === '涉重点涉法涉诉'">
              <p style="height: 40px">
                <FormItem label="责任人">
                  <Input
                    v-model="peopleForm.key_focus_personnel_type_json.col63"
                    placeholder="请输入责任人"
                  ></Input>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="人口类型">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.juzhu_type"
                    placeholder="请选择人口类型"
                  >
                    <Option value="0">居住</Option>
                    <Option value="1">非居住</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="是否户籍">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.huji_type"
                    placeholder="请选择重点人员类别"
                  >
                    <Option value="0">是户籍地址</Option>
                    <Option value="1">非户籍地址</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="7">
              <p style="height: 40px">
                <FormItem label="是否常驻">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.user_type"
                    placeholder="请选择常驻类型"
                  >
                    <Option value="0">常驻人口</Option>
                    <Option value="1">流动人口</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="是否空挂户">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.is_kgh"
                    placeholder="请选择是否空挂户"
                  >
                    <Option value="0">是</Option>
                    <Option value="1">否</Option>
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="网格">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.garden_id"
                    @on-change="getBuildingList"
                    placeholder="请选择网格"
                  >
                    <Option
                      v-for="(item, index) in gardenList"
                      :value="item.id"
                      :key="index"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="7">
              <p style="height: 40px">
                <FormItem label="楼">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.building_id"
                    @on-change="getUnitList"
                    placeholder="请选择楼"
                  >
                    <Option
                      v-for="(item, index) in buildingList"
                      :value="item.id"
                      :key="index"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="单元">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.unit_id"
                    @on-change="getFloorList"
                    placeholder="请选择单元"
                  >
                    <Option
                      v-for="(item, index) in unitList"
                      :value="item.id"
                      :key="index"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="8">
              <p style="height: 40px">
                <FormItem label="层">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.floor_id"
                    @on-change="getDoorplateList"
                    placeholder="请选择层"
                  >
                    <Option
                      v-for="(item, index) in floorList"
                      :value="item.id"
                      :key="index"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
            <Col span="7">
              <p style="height: 40px">
                <FormItem label="户">
                  <Select
                    :disabled="onlyShow"
                    v-model="peopleForm.doorplate_id"
                    placeholder="请选择层"
                  >
                    <Option
                      v-for="(item, index) in doorplateList"
                      :value="item.id"
                      :key="index"
                      >{{ item.name }}</Option
                    >
                  </Select>
                </FormItem>
              </p>
            </Col>
          </Row>
          <Row style="margin-top: 15px">
            <Col span="23">
              <p>
                <FormItem label="备注信息">
                  <Input
                    :disabled="onlyShow"
                    v-model="peopleForm.remarks"
                    type="textarea"
                    :rows="4"
                    placeholder="请输入备注信息"
                  />
                </FormItem>
              </p>
            </Col>
          </Row>
        </Form>
        <div slot="footer">
          <Button type="text" size="large" @click="closeModal"
            >取消</Button
          >
          <Button
            :disabled="peopleForm.confirmButton"
            type="primary"
            size="large"
            @click="createPeopleConfirm"
            >确定</Button
          >
        </div>
      </Modal>
      <Modal v-model="isShowMDDetail" title="矛盾列表" width="1200">
        <Table border :columns="mdColumns" :data="mdDataList">
          <template slot-scope="{ row, index }" slot="status">
            <div v-if="row.status == '1'">已办结</div>
            <div v-else-if="row.status == '2'">处理中</div>
          </template>
          <template slot-scope="{ row, index }" slot="event_source">
            <div v-if="row.event_source == '1'">pc端</div>
            <div v-else-if="row.event_source == '2'">app端</div>
            <div v-else-if="row.event_source == '3'">第三方对接</div>
          </template>
          <template slot-scope="{ row, index }" slot="is_early_warning">
            <div class="flex-div">
              <div class="circle-div3" v-if="row.is_early_warning == '1'"></div>
              <div class="circle-div2" v-if="row.is_early_warning == '3'"></div>
              <div class="circle-div1" v-if="row.is_early_warning == '4'"></div>
            </div>
          </template>
          <template slot-scope="{ row, index }" slot="risk_level">
            <div class="flex-div">
              <div v-if="row.risk_level == '一般矛盾纠纷'">
                <img
                  class="level-option-img"
                  src="@/assets/images/warning1.png"
                  alt=""
                />
                <span style="padding-left: 10px">一般矛盾纠纷</span>
              </div>
              <div v-if="row.risk_level == '复杂矛盾纠纷'">
                <img
                  class="level-option-img"
                  src="@/assets/images/warning2.png"
                  alt=""
                />
                <span style="padding-left: 10px">复杂矛盾纠纷</span>
              </div>
              <div v-if="row.risk_level == '重大矛盾纠纷'">
                <img
                  class="level-option-img"
                  src="@/assets/images/warning3.png"
                  alt=""
                />
                <span style="padding-left: 10px">重大矛盾纠纷</span>
              </div>
            </div>
          </template>
          <template slot-scope="{ row, index }" slot="is_point_event">
            <div v-if="row.is_point_event == '1'">是</div>
            <div v-else-if="row.is_point_event == '2'">否</div>
          </template>
          <template slot-scope="{ row, index }" slot="occurrence_address">
            <span
              >{{ row.city }}{{ row.area }}{{ row.street
              }}{{ row.community }}</span
            >
          </template>
          <template slot-scope="{ row, index }" slot="action">
            <div class="flex-div">
              <Button
                type="primary"
                class="mr5"
                @click="getInfo(row, 'contradiction')"
                >详情</Button
              >
            </div>
          </template>
        </Table>
        <Page
          class="page_style"
          :total="mdparams.totalRecord"
          :current="mdparams.pageNo"
          :page-size="mdparams.pageSize"
          @on-change="changePageNoMD"
          show-total
          show-sizer
          @on-page-size-change="sizeMD"
        />
        <div slot="footer">
          <Button type="text" size="large" @click="isShowMDDetail = false"
            >关闭</Button
          >
        </div>
      </Modal>
      <Modal v-model="isShowMDDetail2" title="矛盾详情" width="1200">
        <md-detail v-if="isShowMDDetail2" :mdParam="mdParam" />
        <div slot="footer">
          <Button type="text" size="large" @click="isShowMDDetail2 = false"
            >关闭</Button
          >
        </div>
      </Modal>
      <Modal v-model="peopleLog.show" title="走访日志信息列表" width="1200">
        <Button
          type="primary"
          @click="createPeopleLog"
          style="margin-bottom: 10px"
          >新增走访日志</Button
        >
        <Table
          border
          :columns="peopleLog.dataColumns"
          :data="peopleLog.dataList"
        >
          <template slot-scope="{ row, index }" slot="is_pitfall">
            <span v-if="row.is_pitfall === '1'">是</span>
            <span v-if="row.is_pitfall === '2'">否</span>
          </template>
          <template slot-scope="{ row, index }" slot="is_follow">
            <span v-if="row.is_follow === '1'">是</span>
            <span v-if="row.is_follow === '2'">否</span>
          </template>
          <template slot-scope="{ row, index }" slot="abnormal">
            <span v-if="row.abnormal === '1'">是</span>
            <span v-if="row.abnormal === '2'">否</span>
          </template>
          <template slot-scope="{ row, index }" slot="risk_level">
            <span v-if="row.risk_level === '1'">无风险</span>
            <span v-if="row.risk_level === '2'">低风险</span>
            <span v-if="row.risk_level === '3'">高风险</span>
          </template>
          <template slot-scope="{ row, index }" slot="action">
            <Button
              type="success"
              size="small"
              style="margin-right: 5px"
              @click="updatePeopleLog(row)"
              >编辑</Button
            >
            <Button
              type="primary"
              size="small"
              style="margin-right: 5px"
              @click="detailPeopleLog(row)"
              >详情</Button
            >
            <Button
              type="error"
              size="small"
              style="margin-right: 5px"
              @click="removePeopleLog(row)"
              >删除</Button
            >
          </template>
        </Table>
        <div slot="footer">
          <Button type="text" size="large" @click="peopleLog.show = false"
            >取消</Button
          >
          <Button type="primary" size="large" @click="peopleLog.show = false"
            >确定</Button
          >
        </div>
      </Modal>
      <Modal
        v-model="peopleLog.detailShow"
        title="走访日志信息详情"
        width="1200"
      >
        <Form ref="formEmployee" :label-width="100">
          <div class="title-style">身份信息</div>
          <Row style="margin-top: 30px">
            <Col span="8" style="margin-left: -4%">
              <FormItem label="姓名">
                <Input disabled v-model="peopleLog.info.user_name"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="身份证号">
                <Input disabled v-model="peopleLog.info.cardno"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="联系方式">
                <Input disabled v-model="peopleLog.info.tel"></Input>
              </FormItem>
            </Col>
          </Row>
          <div class="title-style">居住信息</div>
          <Row style="margin-top: 30px">
            <Col span="8" style="margin-left: -4%">
              <FormItem label="市">
                <Input disabled v-model="peopleLog.info.cityName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="区">
                <Input disabled v-model="peopleLog.info.areaName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="街道">
                <Input disabled v-model="peopleLog.info.streetName"></Input>
              </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="8" style="margin-left: -4%">
              <FormItem label="社区">
                <Input disabled v-model="peopleLog.info.communityName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="网格">
                <Input disabled v-model="peopleLog.info.gardenName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="楼">
                <Input disabled v-model="peopleLog.info.buildName"></Input>
              </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="8" style="margin-left: -4%">
              <FormItem label="单元">
                <Input disabled v-model="peopleLog.info.unitName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="层">
                <Input disabled v-model="peopleLog.info.floorName"></Input>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="户">
                <Input disabled v-model="peopleLog.info.doorplateName"></Input>
              </FormItem>
            </Col>
          </Row>
          <div class="title-style">走访信息</div>
          <Row>
            <Col span="8" style="margin-left: -4%">
              <FormItem label="日期">
                <DatePicker
                  disabled
                  type="date"
                  v-model="peopleLog.info.visit_date1"
                  style="width: 100%"
                ></DatePicker>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="走访人">
                <Input
                  disabled
                  v-model="peopleLog.info.community_user_name"
                ></Input>
              </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="24" style="margin-left: -4%">
              <FormItem label="标签">
                <Tag
                  v-for="(item, index) in peopleLog.info.label_name_list"
                  :key="index"
                  color="error"
                  >{{ item }}</Tag
                >
              </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="8" style="margin-left: -4%">
              <FormItem label="重点关注">
                <Select
                  v-model="peopleLog.info.is_follow"
                  placeholder="请选择是否重点人员"
                >
                  <Option value="1">是</Option>
                  <Option value="2">否</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="是否存在隐患">
                <Select
                  v-model="peopleLog.info.is_pitfall"
                  placeholder="是否存在隐患"
                >
                  <Option value="1">是</Option>
                  <Option value="2">否</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8">
              <FormItem label="是否异常人员">
                <Select
                  v-model="peopleLog.info.abnormal"
                  placeholder="是否异常人员"
                >
                  <Option value="1">是</Option>
                  <Option value="2">否</Option>
                </Select>
              </FormItem>
            </Col>
            <Col span="8" style="margin-left: -4%">
              <FormItem label="风险等级">
                <Select
                  v-model="peopleLog.info.risk_level"
                  placeholder="风险等级"
                >
                  <Option value="1">无风险</Option>
                  <Option value="2">低风险</Option>
                  <Option value="3">高风险</Option>
                </Select>
              </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="24" style="margin-left: -4%">
              <FormItem label="走访内容">
                <Input
                  :rows="6"
                  type="textarea"
                  v-model="peopleLog.info.visit_content"
                ></Input>
              </FormItem>
            </Col>
          </Row>
        </Form>
        <div slot="footer">
          <Button type="text" size="large" @click="peopleLog.detailShow = false"
            >取消</Button
          >
          <Button
            :disabled="peopleLog.confirmButton"
            type="primary"
            size="large"
            @click="peopleLogConfirm"
            >确定</Button
          >
        </div>
      </Modal>
    </div>
    <family-manage :peopleInfo="peopleInfo" ref="family"></family-manage>
  </div>
</template>
<script>
import {
  createPeopleInfo,
  createPeopleZFLog,
  // findLabelList,
  findMZList,
  findPeopleInfoList,
  findPeopleZFLogList,
  getPeopleInfoByCardno,
  updatePeopleInfo,
  updatePeopleZFLog,
  selectGardenList,
  selectBuildingList,
  selectUnitList,
  selectFloorList,
  selectDoorplateList,
  updateIsSpecial,
  deletePeopleZFLog
} from '@/api/peopleInfo'
import { findEventPageList, getCardNoById } from '@/api/contradiction.js'
import { date0str1 } from '@/api/eventlist'
import ceShiImg from '@/assets/contradictionImgs/test1.png'
import mdDetail from './components/mdDetail.vue'
import familyManage from './components/familyManage.vue'
export default {
  name: 'index',
  components: {
    mdDetail,
    familyManage
  },
  data () {
    return {
      col26List: [
        { id: 1, name: '多次犯罪记录和严重犯罪行为犯罪史' },
        { id: 2, name: '服刑期间有违规违纪行为' },
        { id: 3, name: '心理和行为评估发现存在反社会人格障碍、心理扭曲、情绪不稳定和暴力倾向' },
        { id: 4, name: '教育程度低，缺乏必要的职业技能和就业能力' },
        { id: 5, name: '缺乏家庭关爱、亲人疏远，或者在社会上受到歧视、排斥' },
        { id: 6, name: '经济困难、生活无以为继，又无法通过合法途径获得足够的经济资源' },
        { id: 7, name: '继续与有犯罪前科或不良行为的人频繁交往，仍然保持不良生活方式，如赌博、酗酒、吸毒等' },
        { id: 8, name: '表现出对社会不满、怨恨情绪，对法律和社会秩序缺乏尊重和认同，有报复社会的想法或言论' }
      ],
      situationList: [
        { id: 1, name: '婚姻家庭不幸' },
        { id: 2, name: '有重大疾病' },
        { id: 3, name: '有暴力倾向' },
        { id: 4, name: '有弃世厌世倾向' },
        { id: 5, name: '扬言报复社会' }
      ],
      ruleValidate: {
        key_focus_personnel_type: [
          { required: true, message: '必选', trigger: 'change' }
        ]
      },
      ceShiImg,
      url: ceShiImg,
      tableColumns: [
        { type: 'index', title: '序号', align: 'center', width: '80' },
        { title: '姓名', key: 'user_name', align: 'center', width: '80' },
        { title: '身份证号 ', key: 'cardno', align: 'center' },
        { title: '联系方式', key: 'tel', align: 'center' },
        { title: '矛盾次数', key: 'cardNumber', align: 'center' },
        { title: '化解次数', key: 'statusNumber', align: 'center' },
        { title: '重点人员', slot: 'is_zdry', align: 'center' },
        {
          title: '重点人员类型',
          slot: 'key_focus_personnel_type',
          align: 'center'
        },
        // { title: '重点关注', slot: 'is_early_warning', align: 'center' },
        // { title: '存在隐患', slot: 'is_point_event', align: 'center' },
        // { title: '所属网格', slot: 'is_point_event', align: 'center' },
        {
          title: '操作',
          slot: 'action',
          fixed: 'right',
          align: 'center',
          width: '350'
        }
      ],
      tableData: [],
      tableLoading: false,
      params: {
        pageNo: 1,
        pageSize: 10,
        totalRecord: 0
      },
      mdparams: {
        pageNo: 1,
        pageSize: 10,
        totalRecord: 0
      },
      controlData: {
        cardnoInput: '',
        show: false
      },
      peopleForm: {
        key_focus_personnel_type_json: {},
        show: false,
        confirmButton: false
      },
      labelList: [],
      mzList: [],
      peopleLog: {
        dataColumns: [
          { type: 'index', title: '序号', align: 'center', width: '80' },
          { title: '姓名', key: 'user_name', align: 'center', width: '80' },
          { title: '身份证号 ', key: 'grid_user_cardno', align: 'center' },
          { title: '联系方式', key: 'tel', align: 'center' },
          { title: '是否重点关注', slot: 'is_follow', align: 'center' },
          { title: '是否存在隐患', slot: 'is_pitfall', align: 'center' },
          { title: '是否异常人员', slot: 'abnormal', align: 'center' },
          { title: '风险等级', slot: 'risk_level', align: 'center' },
          { title: '走访日期', key: 'visit_date', align: 'center' },
          {
            title: '操作',
            slot: 'action',
            fixed: 'right',
            align: 'center',
            width: '180'
          }
        ],
        dataList: [],
        show: false,
        detailShow: false,
        info: {},
        confirmButton: false,
        tableLoading: false,
        operate_type: ''
      },
      isShowMDDetail: false,
      isShowMDDetail2: false,
      severUserInfo: {},
      mdColumns: [
        { type: 'index', title: '序号', align: 'center', width: '80px' },
        { title: '矛盾状态', slot: 'status', align: 'center', width: '100px' },
        {
          title: '矛盾来源',
          slot: 'event_source',
          align: 'center',
          width: '100px'
        },
        {
          title: '纠纷编号',
          key: 'event_code',
          align: 'center',
          width: '160px'
        },
        {
          title: '超时提示',
          slot: 'is_early_warning',
          align: 'center',
          width: '90px'
        },
        {
          title: '风险等级',
          slot: 'risk_level',
          align: 'center',
          width: '140px'
        },
        {
          title: '重点矛盾',
          slot: 'is_point_event',
          align: 'center',
          width: '90px'
        },
        {
          title: '纠纷大类',
          key: 'event_category_id',
          align: 'center',
          width: '90px'
        },
        {
          title: '纠纷小类',
          key: 'event_type_id',
          align: 'center',
          width: '200px'
        },
        {
          title: '纠纷发生时间',
          key: 'occurrence_time',
          align: 'center',
          width: '150px'
        },
        {
          title: '纠纷描述',
          key: 'dispute_description',
          align: 'center',
          width: '200px'
        },
        {
          title: '纠纷发生地',
          slot: 'occurrence_address',
          align: 'center',
          width: '140px'
        },
        { title: '详细地址', key: 'address', align: 'center', width: '140px' },
        {
          title: '上报人',
          key: 'reporting_name',
          align: 'center',
          width: '90px'
        },
        {
          title: '上报单位',
          key: 'reporting_unit',
          align: 'center',
          width: '100px'
        },
        {
          title: '操作',
          slot: 'action',
          fixed: 'right',
          align: 'center',
          width: '120px'
        }
      ],
      mdDataList: [],
      mdParam: {},
      gardenList: [],
      buildingList: [],
      unitList: [],
      floorList: [],
      doorplateList: [],
      selectKeyList: ['building', 'unit', 'floor', 'doorplate'],
      onlyShow: false,
      peopleInfo: {},
      cardnoWJM: '',
      zfListId: ''
    }
  },
  methods: {
    closeModal () {
      this.peopleForm.show = false
    },
    showFamily (data) {
      this.peopleInfo = data
      this.$nextTick(() => {
        this.$refs.family.init()
      })
    },
    clearSelect (index) {
      for (let i = 3; i >= index; i--) {
        delete this.peopleForm[`${this.selectKeyList[i]}_id`]
        this.$set(this, `${this.selectKeyList[i]}List`, [])
      }
    },
    getDoorplateList (mark) {
      let id = mark === 'edit' ? this.peopleForm.floor_id : mark
      if (mark !== 'edit') {
        this.clearSelect(3)
      }
      selectDoorplateList({ floor_id: id }).then((res) => {
        if (res.data.errcode === 0) {
          this.doorplateList = res.data.data
          return
        }
        this.$Message.error(res.data.errmsg)
      })
    },
    getFloorList (mark) {
      let id = mark === 'edit' ? this.peopleForm.unit_id : mark
      if (mark !== 'edit') {
        this.clearSelect(2)
      }
      selectFloorList({ unit_id: id }).then((res) => {
        if (res.data.errcode === 0) {
          this.floorList = res.data.data
          if (mark === 'edit') {
            this.getDoorplateList(mark)
          }
          return
        }
        this.$Message.error(res.data.errmsg)
      })
    },
    getUnitList (mark) {
      let id = mark === 'edit' ? this.peopleForm.building_id : mark
      if (mark !== 'edit') {
        this.clearSelect(1)
      }
      selectUnitList({ building_id: id }).then((res) => {
        if (res.data.errcode === 0) {
          this.unitList = res.data.data
          if (mark === 'edit') {
            this.getFloorList(mark)
          }
          return
        }
        this.$Message.error(res.data.errmsg)
      })
    },
    getBuildingList (mark) {
      console.log(mark)
      let id = mark === 'edit' ? this.peopleForm.garden_id : mark
      if (mark !== 'edit') {
        this.clearSelect(0)
      }
      selectBuildingList({ garden_id: id }).then((res) => {
        if (res.data.errcode === 0) {
          this.buildingList = res.data.data
          if (mark === 'edit') {
            this.getUnitList(mark)
          }
          return
        }
        this.$Message.error(res.data.errmsg)
      })
    },
    getGardenByID (mark) {
      let id =
        mark === 'add'
          ? this.severUserInfo.company_id
          : this.peopleForm.community_id
      selectGardenList({ community_id: id }).then((res) => {
        if (res.data.errcode === 0) {
          this.gardenList = res.data.data
          if (mark === 'edit') {
            this.getBuildingList(mark)
          }
          return
        }
        this.$Message.error(res.data.errmsg)
      })
    },
    getInfo (row, level) {
      // 详情接口
      this.mdParam = {
        what: 'edit',
        id: row.id,
        level: level,
        type: this.type
      }
      this.isShowMDDetail2 = true
    },
    getlist (id) {
      getCardNoById({ id }).then((ret) => {
        if (ret.data.errcode === 0) {
          findEventPageList({
            event_cardno: ret.data.data.cardno
          }).then((res) => {
            if (res.data.errcode === 0) {
              this.mdDataList = res.data.data.results
              this.mdparams.totalRecord = res.data.data.totalRecord
              return
            }
            this.$Message.error(res.data.errmsg)
          })
        }
      })
    },
    showMDDetail (data) {
      this.isShowMDDetail = true
      this.getlist(data.id)
    },
    init () {
      findPeopleInfoList({ ...this.params, is_special: '1' }).then((ret) => {
        if (ret.data.errcode === 0) {
          this.params.totalRecord = ret.data.data.totalRecord
          this.tableData = ret.data.data.results
          this.tableLoading = false
        } else {
          this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
        }
      })
    },
    size (pageSize) {
      this.params.pageSize = pageSize
      this.changePageNo(1)
    },
    changePageNo (pageNo) {
      this.params.pageNo = pageNo
      this.init(this.params)
    },
    changePageNoMD (pageNo) {
      this.mdparams.pageNo = pageNo
      this.getList(this.mdparams)
    },
    sizeMD (pageSize) {
      this.mdparams.pageSize = pageSize
      this.changePageNoMD(1)
    },
    searchData () {
      this.params.pageNo = 1
      this.init()
    },
    searchPeople () {
      // this.controlData.show = true
      // this.searchConfirm()
      // this.controlData.show = false
      // this.getGardenByID('add')
      this.peopleForm = {
        key_focus_personnel_type_json: {},
        confirmButton: false,
        show: true
      }
    },
    getGenderByID (idNumber) {
      if (!idNumber || idNumber.length !== 18) {
        throw new Error('无效身份证号码')
      }
      const sexCode = idNumber.charAt(16)
      // 1:男，2:女
      const gender = parseInt(sexCode, 10) % 2 === 0 ? '2' : '1'
      return gender
    },
    searchConfirm () {
      this.peopleForm = {
        key_focus_personnel_type_json: {}
      }
      let data = {
        cardno: this.controlData.cardnoInput
      }
      // 如果新增就不调查询逻辑
      getPeopleInfoByCardno(data).then((ret) => {
        if (ret.data.errcode === 0) {
          if (ret.data.data === null) {
            this.$Notice.success({
              title: '查询结果！',
              desc: '未查询到人员信息！'
            })
            this.peopleForm.cardno = this.controlData.cardnoInput
            this.peopleForm.sex = this.getGenderByID(
              this.controlData.cardnoInput
            )
            delete this.controlData.cardnoInput
            this.controlData.show = false
            this.getGardenByID('add')
          } else {
            ret.data.data.cardno = this.controlData.cardnoInput
            let data = ret.data.data
            if (data.label_id) {
              data.label_id_list = JSON.parse(data.label_id)
            }
            this.peopleForm = data
            this.controlData.show = false
            this.getGardenByID('edit')
            console.log('his.peopleForm', this.peopleForm)
          }
          this.peopleForm.show = true
          this.onlyShow = false
          this.peopleForm.confirmButton = false
        } else {
          this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
        }
      })
    },
    createPeopleConfirm () {
      this.$refs['formPerson'].validate((valid) => {
        if (valid) {
          // if (this.peopleForm.label_id_list && this.peopleForm.label_id_list.length > 0) {
          //   this.peopleForm.label_id = this.peopleForm.label_id_list.join(',')
          // }
          delete this.peopleForm.label_id
          if (this.peopleForm.id) {
            updatePeopleInfo({ ...this.peopleForm, key_focus_personnel_type_json: JSON.stringify(this.peopleForm.key_focus_personnel_type_json) }).then((ret) => {
              if (ret.data.errcode === 0) {
                this.$Notice.success({
                  title: '保存成功！',
                  desc: ret.data.errmsg
                })
                this.init()
                this.peopleForm.show = false
                this.controlData.show = false
                this.$refs['formPerson'].resetFields()
              } else {
                this.$refs['formPerson'].resetFields()
                this.$Notice.error({
                  title: '保存失败！',
                  desc: ret.data.errmsg
                })
              }
            })
          } else {
            createPeopleInfo({ ...this.peopleForm, is_special: '1', key_focus_personnel_type_json: JSON.stringify(this.peopleForm.key_focus_personnel_type_json) }).then(
              (ret) => {
                if (ret.data.errcode === 0) {
                  this.$Notice.success({
                    title: '保存成功！',
                    desc: ret.data.errmsg
                  })
                  this.init()
                  this.peopleForm.show = false
                  this.controlData.show = false
                  this.$refs['formPerson'].resetFields()
                } else {
                  this.$refs['formPerson'].resetFields()
                  this.$Notice.error({
                    title: '保存失败！',
                    desc: ret.data.errmsg
                  })
                }
              }
            )
          }
        } else {
          // 校验失败
        }
      })
    },
    findLabelList () {
      // 暂时不调接口
      this.labelList = [
        {
          id: '“三失一偏”',
          name: '“三失一偏”'
        },
        {
          id: '刑满释放',
          name: '刑满释放'
        },
        {
          id: '严重精神障碍',
          name: '严重精神障碍'
        },
        {
          id: '涉一级二级三级矛盾',
          name: '涉一级二级三级矛盾'
        },
        {
          id: '涉重点信访事项',
          name: '涉重点信访事项'
        },
        {
          id: '涉重点涉法涉诉',
          name: '涉重点涉法涉诉'
        }
      ]
      // findLabelList().then(ret => {
      //   if (ret.data.errcode === 0) {
      //     this.labelList = ret.data.data
      //   } else {
      //     this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
      //   }
      // })
    },
    findMZList () {
      findMZList().then((ret) => {
        if (ret.data.errcode === 0) {
          this.mzList = ret.data.data
        } else {
          this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
        }
      })
    },
    updatePeopleInfo (e) {
      getCardNoById({ id: e.id }).then((res) => {
        if (res.data.errcode === 0) {
          let data = JSON.parse(JSON.stringify(e))
          data.cardno = res.data.data.cardno
          // if (data.label_id) {
          //   data.label_id_list = JSON.parse(data.label_id)
          // }
          if (data.key_focus_personnel_type_json) {
            data.key_focus_personnel_type_json = JSON.parse(data.key_focus_personnel_type_json)
          } else {
            data.key_focus_personnel_type_json = {}
          }
          // this.peopleForm = Object.assign(this.peopleForm, data)
          this.peopleForm = data
          this.$set(this.peopleForm, 'show', true)
          // this.peopleForm.show = true
          this.onlyShow = false
          this.peopleForm.confirmButton = false
          this.getGardenByID('edit')
        } else {
          this.$Notice.error({ title: '查询失败！', desc: res.data.errmsg })
        }
      })
    },
    deletePeopleInfo (e) {
      this.$Modal.confirm({
        title: '提示',
        content: '确认删除此特殊人员？',
        onOk: () => {
          updateIsSpecial({ id: e.id }).then((res) => {
            if (res.data.errcode === 0) {
              this.$Notice.success({
                title: '删除成功！',
                desc: res.data.errmsg
              })
              this.init()
            } else {
              this.$Notice.error({
                title: '查询失败！',
                desc: res.data.errmsg
              })
            }
          })
        },
        onCancel: () => {
          this.$Modal.remove()
        }
      })
    },
    getZFLogList () {
      this.peopleLog.tableLoading = true
      findPeopleZFLogList({ id: this.zfListId }).then((ret) => {
        if (ret.data.errcode === 0) {
          this.peopleLog.tableLoading = false
          this.peopleLog.dataList = ret.data.data
          this.peopleLog.show = true
          // this.peopleLog.info.cardno = e.cardno
        } else {
          this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
        }
      })
    },
    findPeopleZFLogList (e) {
      getCardNoById({ id: e.id }).then((res) => {
        if (res.data.errcode === 0) {
          this.cardnoWJM = res.data.data.cardno
          this.zfListId = e.id
          this.getZFLogList()
        } else {
          this.$Notice.error({ title: '查询失败！', desc: res.data.errmsg })
        }
      })
    },
    createPeopleLog () {
      let data = {
        cardno: this.cardnoWJM
      }
      getPeopleInfoByCardno(data).then((ret) => {
        if (ret.data.errcode === 0) {
          this.peopleLog.info = ret.data.data
          this.peopleLog.info.cardno = this.cardnoWJM
          this.peopleLog.info.visit_date1 = new Date()
          this.peopleLog.info.user_id = this.severUserInfo.id
          this.peopleLog.info.community_user_name = this.severUserInfo.name
          // if (this.peopleLog.info.label_name) {
          //   this.peopleLog.info.label_name_list = JSON.parse(this.peopleLog.info.label_name)
          // }
          this.peopleLog.operate_type = 'create'
          this.peopleLog.detailShow = true
          this.peopleLog.confirmButton = false
        } else {
          this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
        }
      })
    },
    updatePeopleLog (e) {
      let data = JSON.parse(JSON.stringify(e))
      data.grid_user_cardno = this.cardnoWJM
      data.cardno = this.cardnoWJM
      console.log(data, '3333333')
      this.peopleLog.operate_type = 'update'
      this.peopleLog.info = data
      this.peopleLog.info.visit_date1 = e.visit_date
      // if (this.peopleLog.info.label_name) {
      //   this.peopleLog.info.label_name_list = JSON.parse(this.peopleLog.info.label_name)
      // }
      this.peopleLog.detailShow = true
      this.peopleLog.confirmButton = false
    },
    peopleLogConfirm () {
      let data = {
        cardno: this.peopleLog.info.cardno,
        city_id: this.peopleLog.info.city_id,
        street_id: this.peopleLog.info.street_id,
        community_id: this.peopleLog.info.community_id,
        is_pitfall: this.peopleLog.info.is_pitfall,
        abnormal: this.peopleLog.info.abnormal,
        risk_level: this.peopleLog.info.risk_level,
        is_follow: this.peopleLog.info.is_follow,
        visit_content: this.peopleLog.info.visit_content,
        attachment: this.peopleLog.info.attachment,
        visit_date: date0str1(this.peopleLog.info.visit_date1)
      }
      if (this.peopleLog.operate_type === 'create') {
        createPeopleZFLog(data).then((ret) => {
          if (ret.data.errcode === 0) {
            this.getZFLogList()
            this.peopleLog.detailShow = false
            this.$Notice.success({
              title: '保存成功！',
              desc: ret.data.errmsg
            })
          } else {
            this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
          }
        })
      }
      if (this.peopleLog.operate_type === 'update') {
        data.id = this.peopleLog.info.id
        updatePeopleZFLog(data).then((ret) => {
          if (ret.data.errcode === 0) {
            this.getZFLogList(data)
            this.peopleLog.detailShow = false
            this.$Notice.success({
              title: '保存成功！',
              desc: ret.data.errmsg
            })
          } else {
            this.$Notice.error({ title: '查询失败！', desc: ret.data.errmsg })
          }
        })
      }
    },
    detailPeopleLog (e) {
      let data = JSON.parse(JSON.stringify(e))
      data.grid_user_cardno = this.cardnoWJM
      data.cardno = this.cardnoWJM
      this.peopleLog.info = data
      this.peopleLog.info.visit_date1 = e.visit_date
      // if (this.peopleLog.info.label_name) {
      //   this.peopleLog.info.label_name_list = JSON.parse(this.peopleLog.info.label_name)
      // }
      this.peopleLog.detailShow = true
      this.peopleLog.confirmButton = true
    },
    removePeopleLog (e) {
      this.$Modal.confirm({
        title: '是否确认删除？',
        loading: true,
        onOk: () => {
          deletePeopleZFLog({ id: e.id }).then((ret) => {
            if (ret.data.errcode === 0) {
              this.$Notice.success({ title: '删除成功！' })
              this.getZFLogList()
            } else {
              this.$Notice.error({ title: '删除失败！' })
            }
          })
          this.$Modal.remove()
        }
      })
    }
  },
  mounted () {
    this.severUserInfo = this.$store.state.user.severUserInfo
    this.init()
    this.findMZList()
    this.findLabelList()
  },
  filters: {
    disposeLabel: function (value) {
      if (!value) return ''
      // value = JSON.parse(value)
      // value = value.join(',')
      // return value
      return ''
    }
  }
}
</script>
<style scoped>
.contradiction-div {
  padding: 10px;
}
.contradiction-div .search-div {
  width: 100%;
  padding: 15px 15px 15px 15px;
  border: 1px solid skyblue;
  background-color: azure;
  margin-bottom: 15px;
}
.mb10 {
  margin-bottom: 10px;
}
.mt8 {
  margin-top: 8px;
}
.mr15 {
  margin-right: 15px;
}
.mr5 {
  margin-right: 5px;
}
.page_style {
  margin-top: 10px;
  text-align: right;
}
.flex-div {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.circle-div1 {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: red;
}
.circle-div2 {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: orange;
}
.circle-div3 {
  width: 10px;
  height: 10px;
  border-radius: 5px;
  background-color: green;
}
.show-more {
  margin-top: 5px;
  cursor: pointer;
}
.contradiction-div >>> .ivu-form .ivu-form-item-label {
  text-align: center;
}
.title-style {
  padding: 8px 12px;
  background-color: #ecf8ff;
  border-radius: 4px;
  border-left: 5px solid #50bfff;
  margin: 15px 0;
  font-size: 16px;
  width: 100%;
}
</style>
