<template>
  <div id="zchj_rwk_data">
    <div class="top-div">
      <div class="serch-div">
        <el-input
          placeholder="请输入姓名或外文名"
          v-model="input_value"
          prefix-icon="el-icon-search"
          clearable
        >
        </el-input>
      </div>
        <el-select
          v-model="value_type"
          placeholder="请选择人物类型"
          @change="handleCurrentChange_rwk(1)"
        >
          <el-option
            v-for="item in options_types"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      <div class="button-discuss" @click="handleCurrentChange_rwk(1)">查询</div>
      <div class="button-discuss3" @click="add_plsc()">批量删除</div>
      <div class="button-discuss1" @click="add_plxz()">批量新增</div>
      <div class="button-discuss2" @click="addrw()">新增</div>
    </div>
    <div class="bottom-div">
      <el-table
        style="width: 100%"
        height="calc(100% - 10px)"
        class="table-div"
        :data="mb_table"
        tooltip-effect="dark"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"> </el-table-column>
        <el-table-column label="姓名"> 
          <template slot-scope="scope">
            {{ scope.row.xm.value }}
          </template>
        </el-table-column>
        <el-table-column label="外文名">
          <template slot-scope="scope">
            {{ scope.row.wwm.value }}
          </template>
        </el-table-column>
        <el-table-column label="人物编号">
          <template slot-scope="scope">
            {{ scope.row.rwbh.value }}
          </template>
        </el-table-column>
        <el-table-column label="行政职务">
          <template slot-scope="scope">
            {{ scope.row.xzzw.value }}
          </template>
        </el-table-column>
        <el-table-column label="所在机构"> 
          <template slot-scope="scope">
            {{ scope.row.orgId}}
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="primary"
              @click="xq_cli(scope.row, scope.$index)"
              >详情</el-button
            >
            <el-button size="mini" type="danger" @click="delete_cli(scope.row)"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="page-div">
      <el-pagination
        class="myPagination"
        background
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="handleSizeChange"
        :page-size="pageInfo.pageSize"
        :current-page="pageInfo.current_page"
        :total="pageInfo.total"
        @current-change="handleCurrentChange_rwk"
        :page-sizes="[10, 20, 50, 100]"
      >
      </el-pagination>
    </div>

    <el-dialog
      title="新增人物"
      :visible.sync="dialogVisible_people"
      id="_people"
    >
      <div class="right-left">
        <div class="title-div" style="margin-top: 0px">
          <span>基本信息:</span>
          <!-- <div class="title-divs"></div> -->
        </div>
        <div style="width: calc(100% - 40px); float: left; padding: 20px">
          <el-tooltip
            class="item"
            effect="light"
            content="必选一种模板，否则无法输入"
            placement="right-start"
            :value="is_true"
          >
            <el-select
              v-model="option_value_rwmb"
              @change="change_fun"
              placeholder="请选择人物模板"
            >
              <el-option
                v-for="item in option_rwmb"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
          </el-tooltip>
          <table class="table_jbxx">
            <tr>
              <td class="pub-td1">
                <span style="margin-right: 5px; color: #de3333">*</span>人物编号
              </td>
              <td class="pub-td2" colspan="3">
                <el-input
                  v-model="form_add[0].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                  @input="form_add[0].value = form_add[0].value.replace(/[^\w\.]/g,' ')"
                ></el-input>
              </td>
              <td rowspan="6" style="border: none">
                <div class="img-div">
                  <el-upload
                    class="avatar-uploader"
                    action="1"
                    :show-file-list="false"
                    :on-change="handleChange"
                    :disabled="is_true"
                    :file-list="fileList_head"
                    :accept="file_types_head"
                    :auto-upload="false"
                    :limit="1"
                  >
                    <img v-if="imageUrl" :src="imageUrl" class="avatar" />
                    <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                  </el-upload>
                </div>
              </td>
            </tr>
            <tr>
              <td class="pub-td1">
                <span style="margin-right: 5px; color: #de3333">*</span>所在机构
              </td>
              <td class="pub-td2" colspan="3">
                <div :style="{ 'pointer-events': !is_true ? 'all' : 'none' }">
                  <el-cascader
                    v-model="value_szjg"
                    :options="options"
                    filterable
                    :show-all-levels="false"
                    :props="{
                      checkStrictly: true,
                      multiple: false,
                      expandTrigger: 'hover',
                      emitPath: false,
                    }"
                    @change="Change_select"
                  ></el-cascader>
                </div>
              </td>
            </tr>
            <tr>
              <td class="pub-td1">
                <span style="margin-right: 5px; color: #de3333">*</span>姓名
              </td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[2].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
              <td class="pub-td1">外文名</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[3].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
            </tr>
            <tr>
              <td class="pub-td1">行政职务</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[4].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
              <td class="pub-td1">民族</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[5].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
            </tr>
            <tr>
              <td class="pub-td1">性别</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[6].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
              <td class="pub-td1">出生日期</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[7].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
            </tr>
            <tr>
              <td class="pub-td1">籍贯</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[8].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
              <td class="pub-td1">人物类别</td>
              <td class="pub-td2">
                <el-input
                  v-model="form_add[9].value"
                  placeholder="请输入内容"
                  :disabled="is_true"
                ></el-input>
              </td>
            </tr>
            <tr v-for="(item, index) in xzzd" style="position: relative" v-if="xzzd.length>0 && index<=Math.trunc(xzzd.length/2)+Math.trunc(xzzd.length%2)-1">
                <td class="pub-td1">{{ xzzd[2*index].comment }}</td>
                <td class="pub-td2" :colspan="index==Math.trunc(xzzd.length/2)+Math.trunc(xzzd.length%2)-1?xzzd.length%2==0?'':'3':''">
                  <el-input
                    v-model="xzzd[2*index].value"
                    placeholder="请输入内容"
                  ></el-input>
                </td>
                <td class="pub-td1" v-if="index==Math.trunc(xzzd.length/2)+Math.trunc(xzzd.length%2)-1?xzzd.length%2!=0?false:true:true">{{ xzzd[2*index+1].comment }}</td>
                <td class="pub-td2" v-if="index==Math.trunc(xzzd.length/2)+Math.trunc(xzzd.length%2)-1?xzzd.length%2!=0?false:true:true">
                  <el-input
                    v-model="xzzd[2*index+1].value"
                    placeholder="请输入内容"
                  ></el-input>
                </td>
            </tr>
          </table>
        </div>
        <div class="mk-div" v-for="(item, index) in wzmk_data">
          <div class="title-div">
            <span v-text="item.comment + ':'"></span>
          </div>
          <div class="data-div">
            <div v-if="item.type == 1">
              <el-input
                type="textarea"
                :rows="6"
                placeholder="请输入内容"
                v-model="item.value"
              ></el-input>
            </div>
            <div v-if="item.type == 2">
              <i
                class="el-icon-circle-plus"
                title="新增表格"
                @click="add_table(index)"
                style="
                  font-size: 23px;
                  margin-bottom: 10px;
                  color: #409eff;
                  cursor: pointer;
                "
              ></i>
              <el-table
                style="width: 100%"
                border
                :data="item.table_column"
                stripe
              >
                <el-table-column
                  prop="date"
                  :label="items"
                  v-for="(items, indexs) in item.table_tab"
                  :key="indexs"
                >
                <el-button
                  type="danger"
                  size="mini"
                  >删除</el-button
                >
                  <template slot-scope="scope">
                    <el-input v-model="scope.row[items]"></el-input>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
        </div>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogVisible_people = false"
          >取 消</el-button
        >
        <el-button
          size="mini"
          type="primary"
          @click="add_people()"
          style="margin-top: 20px"
          >确 定</el-button
        >
      </span>
    </el-dialog>
    <el-dialog
      title="批量导入数据"
      :visible.sync="dialogVisible_pldr"
      width="60%"
      id="_plscs"
    >
      <el-select
        v-model="option_value_rwmb_pl"
        @change="fun_change"
        placeholder="请选择对应模板"
        style="margin-top:10px"
      >
        <el-option
          v-for="item in option_rwmb_pl"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-upload
        class="upload-demo"
        action="1"
        :on-change="handleChange_pl"
        :limit="1"
        :file-list="fileList"
        :accept="file_types"
        :auto-upload="false"
        :show-file-list="false"
        v-if="option_value_rwmb_pl != ''"
      >
        <el-button slot="trigger" type="primary">选取文件</el-button>
      </el-upload>

      <el-button type="primary" class="ac" @click="plsc_cli()"
        >批量上传</el-button
      >
      <el-table style="width: 100%" class="table-div" :data="tableData">
        <el-table-column
          :prop="items"
          :label="items"
          width="180"
          v-for="(items, indexs) in table_plsc"
          :key="indexs"
        >
          <template slot-scope="scope">
            <div v-if="items == '状态'">
              <span
                v-if="scope.row[items] == '入库成功'"
                style="color: #04d404; font-weight: 900"
                >{{ scope.row[items] }}</span
              >
              <el-button size="mini" v-else-if="
                  scope.row[items] != '入库成功' && scope.row[items] != ''
                "
                style="color: #ff2828; font-weight: 900"
                title="当前行所在机构需【数组 . 字母组成，不包含中文】"
                type="info">{{ scope.row[items] }}</el-button>
              <el-button size="mini" v-else type="info">待上传...</el-button>
            </div>
            <div v-else-if="table_result.indexOf(items) != -1">
              <el-button size="mini" @click="ck_table(items, scope.$index)"
                >查看</el-button
              >
            </div>
            <div v-else>
              <span>{{ scope.row[items] }}</span>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogVisible_pldr = false"
          >关闭</el-button
        >
        <!-- <el-button size="mini" type="primary" style="margin-top: 20px"
          >确 定</el-button
        > -->
      </span>
    </el-dialog>
    <el-dialog :title="title" :visible.sync="dialogVisible_mb" width="40%">
      <el-table style="width: 100%" class="table-div" :data="mb_table_s">
        <el-table-column
          :prop="items"
          :label="items"
          v-for="(items, indexs) in arr_mouldTables_comment"
          :key="indexs"
        >
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="dialogVisible_mb = false"
          >关闭</el-button
        >
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { get, post, fileUpload } from "../../util/http_util";
import jh_bg from "../../assets/img/dfzy/zwtp.png";
import XLSX from "xlsx";
import { uuid } from "../../util/data_util";
export default {
  data() {
    return {
      input_value: "",
      //人物库信息
      mb_table: [],
      pageInfo: {
        total: 0,
        pageSize: 10,
        current_page: 1,
      },
      multipleSelection: [],

      form_add_new: [,
        { comment: "人物编号", value: ""  },
        { comment: "所在机构", value: ""  },
        { comment: "姓名", value: ""  },
        { comment: "外文名", value: ""  },
        { comment: "行政职务", value: ""  },
        { comment: "民族", value: ""  },
        { comment: "性别", value: ""  },
        { comment: "出生日期", value: ""  },
        { comment: "籍贯", value: ""  },
        { comment: "人物类别", value: ""  },
      ],
      
      form_add: [
        { comment: "rwbh", value: ""  },
        { comment: "orgId", value: ""  },
        { comment: "xm", value: ""  },
        { comment: "wwm", value: ""  },
        { comment: "xzzw", value: ""  },
        { comment: "mz", value: ""  },
        { comment: "xb", value: ""  },
        { comment: "csrq", value: ""  },
        { comment: "jg", value: ""  },
        { comment: "rwlb", value: ""  },
      ],
      dialogVisible_people: false,
      dialogVisible_pldr: false,
      dialogVisible_mb: false,
      imageUrl: jh_bg,
      xzzd: [],
      wzmk_data: [],
      option_rwmb: [],
      option_value_rwmb: "",
      is_true: true,
      obj_name: "",
      fileList: [],
      file_types: ".XLSX",
      option_value_rwmb_pl: "", //批量导入对应的模板id
      option_rwmb_pl: [],
      obj_value: "", //批量导入对应的模板ID
      table_plsc: [], //批量导入对应的表头
      tableData: [], //批量导入对应的表格数据
      table_plsc_sc_cli: [], //批量导入对应的模板,
      // folder: "dfzy-rwk", //头像上传文件夹
      fileList_head: [],
      file_head: {},
      file_types_head: ".PNG,.JPG,.JPEG",
      table_result: [], //存储批量导入的表格模板名称
      arr_table: [], //Excel中非基础数据的数组
      mb_table_s: [],
      title: "", //批量导入中点击查看工作经历弹出框的名称
      arr_mouldTables: [],
      arr_mouldTables_comment: [],
      options: [],
      mb_table_xq: [],
      fl_type: '', //查询人物库下面的模板,人物库为11
      value_szjg: "",
      type_jg: false,
      type_jgs:false,
      options_types:[
        {
          value: 1,
          label: '内网人物'
        }, {
          value: 2,
          label: '外网人物'
        },
      ],
      value_type:'',
    };
  },
  methods: {
    add_plsc() {
      if (this.multipleSelection == 0) {
        this.$message({
          message: "无删除项,请选择！！！",
          type: "warning",
        });
      } else {
        let arr = [];
        this.multipleSelection.forEach((item) => {
          arr.push(item._id);
        });
        this.delect(arr);
      }
    },
    delete_cli(item) {
      let arr = [];
      arr.push(item._id);
      this.delect(arr);
    },
    delect(arrs) {
      this.$confirm("此操作将永久删除该记录, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          post("api/rest/mongo/character/remove", arrs)
            .then((data) => {
              if (data > 0) {
                this.$message({
                  message: "删除成功",
                  type: "success",
                });
                this.handleCurrentChange_rwk(1);
              }
            })
            .catch((err) => {
              this.$message.warning(err.message);
            });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    xq_cli(item, index) {
      this.$router.push({
        name: "编辑人员详情" + this.$route.meta.type_name,
        params: {
          key: this.mb_table_xq[index],
          fl_type:this.fl_type,
        },
      });
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    handleSizeChange(val) {
      this.pageInfo.pageSize = val;
      this.pageInfo.current_page = 1;
      this.handleCurrentChange_rwk(1);
    },
    //列表分页
    handleCurrentChange_rwk(pageNum) {
      this.query_rwk_data(pageNum);
    },
    //查询人物库信息
    query_rwk_data(pageNum) {
      this.pageInfo.current_page = pageNum;
      let pageSize = this.pageInfo.pageSize;
      let name = this.input_value;
      get("api/rest/mongo/organization/queryTree?module=" + "DF")
        .then((res) => {
          let options_s = [];
          if (res.length > 0) {
            options_s = this.jsonToArray(res);
          } else {
            options_s = [];
          }
          get("api/rest/mongo/organization/queryTree?module=" + "DFWW")
            .then((res) => {
              let options_s_online = [];
              if (res.length > 0) {
                options_s_online = this.jsonToArray(res);
              } else {
                options_s_online = [];
              }
              post(
                `api/rest/mongo/character/query?pageNum=${pageNum}&pageSize=${pageSize}`,
                { 
                  module: this.value_type==2?'DFWW':'DF',
                  name:name,
                }
              )
                .then((res) => {
                  this.mb_table = [];
                  this.mb_table_xq = [];
                  if (res.records.length > 0) {
                    res.records.forEach((item) => {
                      let names = '';
                      let options_type=[];
                      this.option_rwmb.find((item1) => {
                        if (item1.value == item.templateId) {
                          names=item1.label;
                        }
                      });
                      if(names=='外网人物模板'){
                        options_type = options_s_online;
                      }else{
                        options_type = options_s;
                      }
                      if (
                        item.orgId != "" &&
                        options_type.length > 0
                      ) {
                        let jg_name = options_type.find(
                          (e) => e.code == item.orgId
                        );
                        item.orgId =
                          jg_name == undefined ||
                          jg_name == "" ||
                          jg_name == null
                            ? item.orgId
                            : jg_name.label;
                      }
                      this.mb_table.push(item);
                    });
                    this.mb_table_xq = res.records;
                  }
                  this.pageInfo.total = res.total;
                })
                .catch((err) => {
                });
            })
            .then((res)=>{
              this.query_tree();
            })
            .catch((err) => {
              this.options = [];
            });
        })
        .catch((err) => {
          this.$message.warning(err.message);
        });
    },
    //批量导入弹出框，查看工作经历等数据展示
    ck_table(name, index) {
      let people_bh = this.tableData[index]["人物编号"];
      this.title = name;
      this.mb_table_s = [];
      this.arr_table.forEach((item) => {
        if (item.sheetName == name) {
          this.mb_table_s = item.sheet.filter(
            (items) =>
              items["人物编号"] == people_bh && Object.keys(items).length > 1
          );
        }
      });
      this.arr_mouldTables_comment = this.arr_mouldTables.filter((item) => {
        return item.tableName == name;
      })[0].columnName;
      if (this.mb_table_s.length > 0) {
        this.dialogVisible_mb = true;
      } else {
        this.$message({
          message: "当前人物的" + name + "无任何数据！！！",
          type: "warning",
        });
      }
    },
    //批量导入确定按钮
    plsc_cli() {
      let paramDatas = [];
      if (this.tableData.length == 0) {
        this.$message({
          message: "表格中无数据，请重新选取文件！！！",
          type: "warning",
        });
        return;
      } else {
        if(this.tableData.filter(n=>n['状态']!='').length>0){
          this.$message({
            message: "数据异常，请修改完重新上传！！！",
            type: "warning",
          });
        }else{
          this.tableData.forEach((item) => {
            let obj_baseProperty = {};
            let obj_extraProperty = {};
            let obj_textarea = {};
            let obj_mouldTables = {};
            this.form_add_new.forEach((items) => {
              obj_baseProperty[items.comment] =
                item[items.comment] == undefined ? "" : item[items.comment] + "";
            });
            this.table_plsc_sc_cli.extraProperty.forEach((items1) => {
              obj_extraProperty[items1] =
                item[items1] == undefined ? "" : item[items1] + "";
            });
            this.table_plsc_sc_cli.textareaProperty.forEach((items1) => {
              if (
                this.table_plsc_sc_cli.tableProperty.findIndex(
                  (n) => n.tableName == items1
                ) == -1
              ) {
                obj_textarea[items1] =
                  item[items1] == undefined
                    ? ""
                    : item[items1].toString() + "";
              }
            });
            let iss = item["人物编号"];
            this.table_plsc_sc_cli.tableProperty.forEach((item1) => {//循环模板中的表格
              obj_mouldTables[item1.tableName] = {//设置默认的tableProperty格式
                columns:item1.columnName,
                rows:[],
              };
              let arrs = this.arr_table.filter((item2)=> {return item2.sheetName == item1.tableName})
              if(arrs.length>0){
                let arr1 = arrs[0].sheet.filter((item3)=> {return item3["人物编号"] == iss})
                if(arr1.length>0){
                  arr1.forEach(item3 =>{
                    let arr = [];
                    item1.columnName.forEach(it =>{
                      //循环模板中单表格的行，
                      arr.push(item3[it]==undefined?'':item3[it]+'');
                    })
                    obj_mouldTables[item1.tableName].rows.push(arr);
                  })
                }
              }
            });
            let obj = {
              rwbh:obj_baseProperty['人物编号'],
              xm:obj_baseProperty['姓名'],
              wwm:obj_baseProperty['外文名'],
              orgId:obj_baseProperty['所在机构'],
              xb:obj_baseProperty['性别'],
              mz:obj_baseProperty['民族'],
              jg:obj_baseProperty['籍贯'],
              csrq:obj_baseProperty['出生日期'],
              xzzw:obj_baseProperty['行政职务'],
              rwlb:obj_baseProperty['人物类别'],
              avatar:obj_baseProperty['人物编号'],
              baseProperty: obj_baseProperty,
              extraProperty: obj_extraProperty,
              textareaProperty: obj_textarea,
              tableProperty: obj_mouldTables,
              module: this.type_jgs?'DFWW':'DF',
            };
            paramDatas.push(obj);
          });
          post(
            "api/rest/mongo/character/add?templateId=" + this.obj_value,
            paramDatas
          )
            .then((data) => {
              // console.log(data);
              this.tableData.forEach((item, index) => {
                item["状态"] = "入库成功";
              });
              this.$message({
                message: "导入完成！！！",
                type: "success",
              });
              this.handleCurrentChange_rwk(1);
            })
            .catch((err) => {
              this.$message.warning(err.message);
            });
        }
      }
    },
    //批量导入中选择对应模板
    fun_change(data) {
      this.tableData = [];
      let names ="";
      this.option_rwmb_pl.find((item) => {
        if (item.value == data) {
          this.obj_value = item.value;
          names = item.label;
        }
      });
      if (names == "外网人物模板") {
        this.type_jgs = true;
      } else {
        this.type_jgs = false;
      }
      this.query_CharacterMould(this.obj_value,true);
    },
    //批量导入中选择文件
    handleChange_pl(file, fileList) {
      this.fileList = [];
      this.file2Xce(file).then((tabJson) => {
        if (tabJson && tabJson.length > 0) {
          let obj_tab = {}; //Excel表格的基础数据集合
          this.arr_table = [];
          tabJson.forEach((item, index) => {
            if (index == 0) {
              obj_tab = item.sheet;
            } else {
              this.arr_table.push(item);
            }
          });
          obj_tab.forEach((item, index) => {
            item["Excel所在行"] = index + 2;
            item["状态"] = "";
            if(/.*[\u4e00-\u9fa5]+.*$/.test(item['所在机构'])||item['所在机构']==''||item['所在机构']==undefined){
              item["状态"] = "异常";
            }
          });
          this.tableData = obj_tab;
        }
      });
    },
    //读取Excel数据
    file2Xce(file) {
      return new Promise(function (resolve) {
        const reader = new FileReader();
        reader.onload = function (e) {
          const data = e.target.result;
          this.wb = XLSX.read(data, {
            type: "binary",
          });
          const result = [];
          this.wb.SheetNames.forEach((sheetName) => {
            result.push({
              sheetName: sheetName,
              sheet: XLSX.utils.sheet_to_json(this.wb.Sheets[sheetName]),
            });
          });
          resolve(result);
        };

        reader.readAsBinaryString(file.raw);

        // reader.readAsBinaryString(file) // 传统input方法
      });
    },
    //新增表格字段
    add_table(index) {
      let obj = {};
      this.wzmk_data[index].table_tab.forEach((item) => {
        obj[item] = "";
      });
      this.wzmk_data[index].table_column.push(obj);
    },
    //新增人物确定按钮
    add_people() {
      let obj = {};
      //基本字段数据
      let obj_jbzd = {};
      this.form_add.forEach((item) => {
        obj_jbzd[item.comment] = item.value + "";
      });
      if (
        obj_jbzd.xm == "" ||
        obj_jbzd.rwbh == "" ||
        obj_jbzd.orgId == ""
      ) {
        this.$message({
          message: "姓名、人物编号、所属机构都不能为空",
          type: "warning",
        });
      } else {
        obj = {...obj_jbzd};
        //基本的新增字段数据
        let obj_xzzd = {};
        this.xzzd.forEach((item) => {
          obj_xzzd[item.comment] = item.value;
        });
        obj.extraProperty = obj_xzzd;
        let obj_textarea = {};
        let obj_mouldTables = {};
        this.wzmk_data.forEach((item) => {
          if (item.type == 1) {
            //板块的textarea数据
            obj_textarea[item.comment] = item.value;
            // console.log(item.value.replace(/\n/g,'///'));
          } else {
            let object_column = [];
            //清除板块表格数据中都是空值的一行
            item.table_column.forEach((itema) => {
              let result = Object.values(itema).every((item1) => item1 === "");
              if (!result) {
                object_column.push(itema);
              }
            });
            //板块表格的数据
            let _columns_rows = {};
            _columns_rows.columns = item.table_tab;
            let arrs = [];
            object_column.forEach((items) => {
              let arrs1 = [];
              item.table_tab.forEach((itema) => {
                arrs1.push(items[itema]);
              });
              arrs.push(arrs1);
            });
            _columns_rows.rows = arrs;
            obj_mouldTables[item.comment] = _columns_rows;
          }
        });
        obj.textareaProperty = obj_textarea;
        obj.tableProperty = obj_mouldTables;
        obj.module = this.type_jg?'DFWW':'DF';
        let paramDatas = [];
        paramDatas.push(obj);
        this.upload_head(paramDatas);
      }
    },
    //上传头像
    upload_head(paramDatas) {
      let id = uuid(32, 32);
      if (JSON.stringify(this.file_head) != "{}") {
        let fd = new FormData();
        fd.append("bucket",'AVATAR');//文件存储位置
        fd.append("filename", id);
        // fd.append("folder", this.folder);
        fd.append("file", this.file_head.raw);
        fileUpload("api/rest/file/upload", fd)
          .then((data) => {
            console.log("头像上传成功");
            paramDatas[0].avatar = data;
            this.file_head = {};
            this.add_rw_post(paramDatas);
          })
          .catch((err) => {
            console.log(err);
          });
      } else {
        paramDatas[0].avatar = "";
        this.add_rw_post(paramDatas);
      }
    },
    add_rw_post(paramDatas) {
      post(
        "api/rest/mongo/character/add?templateId=" +
          this.option_value_rwmb,
        paramDatas
      )
        .then((res) => {
          if(res==1){
            this.$message({
              message: '入库成功',
              type: "success",
            });
            this.dialogVisible_people = false;
            this.handleCurrentChange_rwk(1);
          }
        })
        .catch((err) => {
          this.$message.warning(err.message);
        });
    },
    //选择人物模板
    change_fun(data) {
      this.is_true = false;
      this.form_add.forEach((item, index) => {
        this.form_add[index].value = "";
      });
      let names = "";
      this.option_rwmb.find((item) => {
        if (item.value == data) {
          this.obj_name = item.value;
          names = item.label;
        }
      });
      if (names == "外网人物模板") {
        this.type_jg = true;
      } else {
        this.type_jg = false;
      }
      this.query_tree_jg();//查询机构
      this.query_CharacterMould(this.obj_name,false);
    },
    //选择文件
    handleChange(file, fileList) {
      this.imageUrl = URL.createObjectURL(file.raw);
      this.file_head = file;
      this.fileList_head = [];
    },
    //单个人物新增弹框
    addrw() {
      this.form_add.forEach((item, index) => {
        this.form_add[index].value = "";
      });
      this.defaultCheckedKeys = [];
      this.is_true = true;
      this.option_value_rwmb = "";
      this.xzzd = [];
      this.wzmk_data = [];
      this.query_tree();
      this.imageUrl = jh_bg;
      this.value_szjg = "";
      this.dialogVisible_people = true;
    },
    //批量新增弹框
    add_plxz() {
      this.query_tree();
      this.option_value_rwmb_pl = "";
      this.fileList = [];
      this.table_plsc = [];
      this.dialogVisible_pldr = true;
    },
    append_jg(node, data) {
      this.name = "";
      this.dialogVisible = true;
      this.this_data = data;
      this.this_node = node;
    },
    handleNodeClick(node) {},
    //查询当前节点的最顶层节点ID
    getparentNode(data) {
      if (data.data.parentCode == null) {
        return data.data.id;
      } else {
        return this.getparentNode(data.parent);
      }
    },
    //查询人物信息模板
    query_CharacterMould(id,is_pldr) {
      get("api/rest/mongo/template/query?id=" + id)
        .then((datas) => {
          this.xzzd = [];
          this.wzmk_data = [];
          this.table_plsc = [];
          this.table_result = [];
          this.arr_mouldTables = [];
          if (datas != null) {
            let data = datas[0];
            this.table_plsc_sc_cli = data;
            // this.form_add.forEach((item) => {
            //   this.table_plsc.push(item.comment);
            // });
            if(is_pldr){
              this.form_add_new.forEach((item) => {
                this.table_plsc.push(item.comment);
              });
            }else{
              this.form_add.forEach((item) => {
                this.table_plsc.push(item.comment);
              });
            }
            if (data.extraProperty.length > 0) {
              data.extraProperty.forEach((item) => {
                this.xzzd.push({ comment: item, value: "" });
                this.table_plsc.push(item);
              });
            }
            if (data.textareaProperty.length > 0) {
              data.textareaProperty.forEach((item) => {
                if (item != "大五画像" && item != "关系图谱") {
                  this.wzmk_data.push({
                    comment: item,
                    type: "1",
                    table_tab: [],
                    value: "",
                    table_column: [],
                  });
                  this.table_plsc.push(item);
                }
              });
            }
            if (data.tableProperty.length > 0) {
              // let table_tab_s = [];
              data.tableProperty.forEach((items) => {
                let arr = [];
                this.arr_mouldTables.push(items);//批量导入
                items.columnName.forEach((items1) => {
                  arr.push(items1);
                });
                this.wzmk_data.forEach((item, index) => {
                  if (items.tableName == item.comment) {
                    this.wzmk_data[index].type = "2";
                    this.wzmk_data[index].table_tab = arr;//批量导入
                    this.table_result.push(item.comment);
                  }
                });
              });
            }
            this.table_plsc.unshift("Excel所在行");
            this.table_plsc.unshift("状态");
          }
        })
        .catch((err) => {
          this.$message.warning(err.message);
        });
    },
    //查询人物模板
    query_tree() {
      get("api/rest/mongo/template/query?type=" + this.fl_type)
        .then((datas) => {
          this.option_rwmb = [];
          this.option_rwmb_pl = [];
          if (datas.length > 0) {
            datas.forEach((item) => {
              this.option_rwmb.push({ value: item.id, label: item.name });
              this.option_rwmb_pl.push({ value: item.id, label: item.name });
            });
          };
        })
        .catch((err) => {
          this.$message.warning(err.message);
        });
    },
    query_tree_jg() {
      let param = "api/rest/mongo/organization/queryTree?module="+'DF';
      if (this.type_jg) {
        param = "api/rest/mongo/organization/queryTree?module="+'DFWW';
      }
      get(param)
        .then((res) => {
          if (res.length > 0) {
            this.options = this.initData(res);
          } else {
            this.options = [];
          }
        })
        .catch((err) => {
          this.$message.warning(err.message);
        });
    },
    initData(orgList) {
      // 第一种
      if (orgList.length) {
        for (var i = 0; i < orgList.length; i++) {
          orgList[i].value = orgList[i].code;
          if (orgList[i].children.length) {
            // 如果有 children 则继续递归遍历
            this.initData(orgList[i].children);
          }
        }
      }
      return orgList;
    },
    jsonToArray(nodes) {
      var r = [];
      if (Array.isArray(nodes)) {
        for (var i = 0, l = nodes.length; i < l; i++) {
          r.push(nodes[i]); // 取每项数据放入一个新数组
          if (
            Array.isArray(nodes[i]["children"]) &&
            nodes[i]["children"].length > 0
          )
            // 若存在children则递归调用，把数据拼接到新数组中，并且删除该children
            r = r.concat(this.jsonToArray(nodes[i]["children"]));
          delete nodes[i]["children"];
        }
      }
      return r;
    },
    Change_select(value) {
      this.form_add[1].value = value + "";
    },
  },
  mounted() {
  },
  activated() {
  },
  props: {
    clientDetails: {
      type: Object,
      default: {},
    },
  },
  watch: {
    obj_name: function (val) {
      if (val != "") {
        this.is_true = false;
      } else {
        this.is_true = true;
      }
    },
    dialogVisible_people: function (val) {
      if (!val) {
        this.is_true = false;
      }
    },
    clientDetails: function (val) {
      this.type_jg = false;
      this.type_jgs = false;
      this.value_type = 1;
      this.fl_type = val.fl_type;
      this.handleCurrentChange_rwk(this.pageInfo.current_page);
    },
  },
};
</script>
<style lang="scss">
#zchj_rwk_data {
  width: 100%;
  height: 100%;
  .top-div {
    width: 100%;
    height: 80px;
    .serch-div {
      margin-top: 15px;
      width: 350px;
      float: left;
      box-shadow: 0 0 10px #1b6097;
      .el-input__inner {
        background: none;
        border: 1px solid #1b6097;
        color: #ffff;
      }
      .el-select .el-input {
        width: 130px;
        background-color: #1c678a;
      }
      .el-input-group__append {
        border: unset;
      }
    }
      .el-select {
        float: left;
        margin-left: 20px;
        width: 185px !important;
        .el-input {
          width: unset !important;
        }
      .el-input {
        float: left;
        margin-left: 0px;
        margin-top: 15px;
        .el-input__inner {
          background: none;
          color: #ffff;
          border: 1px solid #146a80 !important;
          box-shadow: 0 0 10px #1b6097;
        }
      }
      }
    .button-discuss {
      width: 100px;
      height: 30px;
      line-height: 30px;
      float: left;
      margin-top: 19px;
      font-size: 14px;
      margin-left: 20px;
      text-align: center;
      cursor: pointer;
      background-image: url(../../assets/img/yqjc/40.png);
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
    .button-discuss3 {
      width: 120px;
      height: 30px;
      line-height: 30px;
      float: right;
      font-size: 14px;
      margin-top: 19px;
      text-align: center;
      cursor: pointer;
      background-image: url(../../assets/img/yqjc/40.png);
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
    .button-discuss1 {
      width: 120px;
      height: 30px;
      font-size: 14px;
      line-height: 30px;
      float: right;
      margin-top: 19px;
      margin-left: 20px;
      margin-right: 20px;
      text-align: center;
      cursor: pointer;
      background-image: url(../../assets/img/yqjc/40.png);
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
    .button-discuss2 {
      width: 100px;
      height: 30px;
      line-height: 30px;
      font-size: 14px;
      float: right;
      margin-top: 19px;
      margin-left: 20px;
      text-align: center;
      cursor: pointer;
      background-image: url(../../assets/img/yqjc/40.png);
      background-repeat: no-repeat;
      background-size: 100% 100%;
    }
  }
  .bottom-div {
    width: 100%;
    height: calc(100% - 120px);
    .el-table tr {
      background-color: #1d2d46 !important;
      color: #ffffffc7;
    }
    .el-table td {
      border-bottom: 1px solid #127a89;
      border-right: unset;
    }
    .el-table--enable-row-hover .el-table__body tr:hover > td {
      background-color: #82848a78;
    }
    .el-table th {
      border: unset;
      background-color: #263b5d !important;
      > .cell {
        font-size: 15px;
      }
    }
    .el-table--fit {
      background: none !important;
      border: unset;
    }
    .el-icon-delete-solid {
      color: red;
      cursor: pointer;
      font-size: 18px;
    }
    .el-icon-download {
      color: #1172d8;
      cursor: pointer;
      font-size: 20px;
    }
    .el-icon-edit {
      color: #1172d8;
      cursor: pointer;
      font-size: 20px;
    }
    .el-icon-view {
      color: #00ffff;
      font-size: 20px;
      cursor: pointer;
    }
    .el-table--group::after,
    .el-table--border::after,
    .el-table::before {
      background-color: unset;
    }
  }
  #_people .el-dialog {
    width: 1100px;
  }
  #_plscs {
    .el-select {
      margin-top: 20px;
      margin-left: 20px;
      float: left;
    }
    .upload-demo {
      margin-top: 20px;
      margin-left: 20px;
      float: left;
    }
    .ac {
      margin-top: 20px;
      margin-left: 20px;
    }

    .table-div {
      width: 100%;
      height: 500px;
      margin-top: 20px;
      margin-left: 0px;
      background: #e6e6e6;
      .el-table__body-wrapper {
        height: 452px;
        overflow-y: auto;
      }
      .cell {
        text-align: center;
      }
      .el-table tr {
        background-color: #1d2d46 !important;
        color: #ffffffc7;
      }
      .el-table td {
        border-bottom: 1px solid #127a89;
        border-right: unset;
      }
      .el-table--enable-row-hover .el-table__body tr:hover > td {
        background-color: #82848a78;
      }
      .el-table th {
        border: unset;
        background-color: #263b5d !important;
      }
      .el-table--fit {
        background: none !important;
        border: unset;
      }
      .el-icon-delete-solid {
        color: red;
        cursor: pointer;
        font-size: 18px;
      }
      .el-icon-edit {
        color: #1172d8;
        cursor: pointer;
        font-size: 20px;
      }
      .el-icon-delete {
        color: red;
        font-size: 20px;
        cursor: pointer;
      }
      .el-table--group::after,
      .el-table--border::after,
      .el-table::before {
        background-color: unset;
      }
    }
  }
  .el-dialog {
    background: #1d2d46 !important;
    .el-step__title.is-process {
      color: #e0a142;
    }
    .el-dialog__title {
      color: #ffffff;
    }
    .el-dialog__body {
      padding: 6px 20px;
      .el-form-item__label {
        color: #e8e8e8;
      }
      .el-cascader {
        width: 100%;
      }
    }
    .avatar-uploader .el-upload {
      border: 1px dashed #d9d9d9;
      border-radius: 6px;
      cursor: pointer;
      position: relative;
      overflow: hidden;
      height: 100%;
      width: 100%;
    }
    .avatar-uploader .el-upload:hover {
      border-color: #409eff;
    }
    .avatar-uploader-icon {
      font-size: 28px;
      color: #8c939d;
      width: 100%;
      height: 100%;
      line-height: 230px;
      text-align: center;
    }
    .avatar {
      width: 100%;
      height: 100%;
      display: block;
    }
    .right-left {
      width: calc(100% - 40px);
      float: left;
      background: rgba(41, 60, 90, 0.49);
      padding: 20px 20px 0px 20px;
      .title-div {
        float: left;
        width: 100%;
        height: 25px;
        background-size: 100% 100%;
        position: relative;
        margin-top: 10px;
        > span {
          position: absolute;
          font-weight: 700;
          font-size: 18px;
          color: #50d7ec;
          margin-left: 10px;
        }
        .el-button {
          float: right;
          margin-right: 10px;
        }
      }
      .mk-div {
        width: 100%;
        float: left;
        background: #fdfdfd0f;
        margin-bottom: 20px;
        .data-div {
          width: calc(100% - 40px);
          float: left;
          padding: 20px;
          .pub-div-data {
            margin: 10px calc(50% - 28px);
            color: #909399;
            font-size: 14px;
          }
          .el-table tr {
            background-color: #1d2d46 !important;
            color: #ffffffc7;
          }
          .el-table td {
            background-color: #253650 !important;
            color: #ffffffc7;
          }
          .el-table td {
            border-bottom: 1px solid #127a89;
            border-right: unset;
          }
          .el-table--enable-row-hover .el-table__body tr:hover > td {
            background-color: #82848a78;
          }
          .el-table th {
            border: unset;
            background-color: #263b5d !important;
          }
          .el-table--fit {
            background: none !important;
            border: unset;
          }
          .el-table--group::after,
          .el-table--border::after,
          .el-table::before {
            background-color: unset;
          }
          .el-table__header-wrapper table {
            width: 100% !important;
          }
          .el-table__body-wrapper {
            .el-table__empty-block {
              height: 20px !important;
            }
          }
        }
      }
      .table_jbxx {
        border-collapse: collapse;
        width: 100%;
        position: relative;
        margin-top: 10px;
        td {
          border: 1px solid #00648c;
          padding: 5px 12px;
          font-size: 14px;
          width: 200px;
        }
        .img-div {
          border: 3px solid #ffffff;
          width: 200px;
          height: 230px;
          img {
            background-size: 100% 100%;
          }
        }
        .pub-td1 {
          color: #007eff;
          font-weight: 900;
          width: 100px;
        }
        .pub-td2 {
          color: #8cd4ff;
        }
        .el-icon-remove {
          color: #ff4a4a;
          font-size: 20px;
          position: absolute;
          right: -31px;
          margin-top: 11px;
          cursor: pointer;
        }
        .el-icon-circle-plus {
          color: #ff4a4a;
          font-size: 20px;
          position: absolute;
          right: -31px;
          bottom: 12px;
          cursor: pointer;
        }
        .el-icon-edit {
          color: #5cde7c;
          font-size: 20px;
          position: absolute;
          right: 10px;
          margin-top: 11px;
          cursor: pointer;
        }
        .button-div {
          position: absolute;
          right: 40px;
          margin-top: 8px;
          position: absolute;
        }
      }
      .title-divs {
        float: left;
        height: 25px;
        width: calc(100% - 0px);
        // background-image: url("../../assets/img/dfzy/02.png");
        // background-size: 100% 100%;
      }
    }
  }
}
</style>
