完善新增后表单清空问题

linwenling

2023-08-10 b478c02ebb4b5eb28858bac8f3b7fc0539b23ede

 ruoyi-ui/src/views/self/show.vue

@@ -1,5 +1,7 @@
<template>
  <div class="app-container">
    <!--  刷新页面  -->
<!--    <MyComponent :key="componentKey" />-->
    <!--    回到顶部-->
    <el-backtop :bottom="150" :right="30">
      <el-button type="primary" circle
@@ -56,12 +58,12 @@
<!--                  <el-input v-model="individualList.sex === 1 ? '男':'女' " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">-->
<!--                  </el-input>-->
                  <template v-if="!isEditing">
                    <el-input v-model="individualList.sex === 1 ? '男':'女'" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                    <el-input v-model="individualList.sex === 1 ? inds='男':inds='女'" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                  </template>
                  <template v-else>
                    <el-select v-model="individualList.sex" placeholder="请选择性别" clearable :style="{width: '100%'}">
                      <el-option label="男" value="1"></el-option>
                      <el-option label="女" value="0"></el-option>
                    <el-select v-model="inds" placeholder="请选择性别" clearable :style="{width: '100%'}" :disabled="dsb">
                      <el-option label="男" value='1'></el-option>
                      <el-option label="女" value='0'></el-option>
                    </el-select>
                  </template>
                </el-form-item>
@@ -97,13 +99,14 @@
                  <template v-if="!isEditing" >
                    <el-input v-if="individualList.maritalStatus===0" placeholder="未婚"></el-input>
                    <el-input v-if="individualList.maritalStatus===1" placeholder="已婚"></el-input>
                    <el-input v-if="individualList.maritalStatus===2" placeholder="离婚"></el-input>
                    <el-input v-if="individualList.maritalStatus===2" placeholder="未婚"></el-input>

                  </template>
                  <template v-else>
                    <el-select v-model="individualList.maritalStatus" placeholder="请选择性别" clearable :style="{width: '100%'}">
                      <el-option label="未婚" value="0"></el-option>
                      <el-option label="已婚" value="1"></el-option>
                      <el-option label="离婚" value="2"></el-option>
                    <el-select v-model="mrs" placeholder="请选择性别" clearable :style="{width: '100%'}">
                      <el-option label="未婚" value='0'></el-option>
                      <el-option label="已婚" value='1'></el-option>
                      <el-option label="离婚" value='2'></el-option>
                    </el-select>
                  </template>
                </el-form-item>
@@ -234,12 +237,12 @@
    </el-container>

    <!--折叠面板-->
    <el-collapse v-model="activeNames" @change="handleChange">
    <el-collapse  v-model="activeNames" @change="handleChange">
      <el-collapse-item title="移居国（境）情况" name="3" >
      <div>
        <el-form v-loading="loading" :data="individualList" @selection-change="handleSelectionChange">
          <el-form-item label="是否拥有外籍、境外居留权、长期居留许可">
            <el-radio-group v-model="individualList.outStatus" style="margin-bottom: 0">
          <el-form-item label="是否拥有外籍、境外居留权、长期居留许可" >
            <el-radio-group v-model="individualList.outStatus" style="margin-bottom: 0;color: #FEF7FC;" :disabled="dsb">
              <el-radio :label="1">是</el-radio>
              <el-radio :label="0">否</el-radio>
            </el-radio-group>
@@ -247,7 +250,7 @@
              <el-row :span="7">
                <el-form v-loading="loading" :data="individualList" @selection-change="handleSelectionChange">
                  <el-form-item label="证件号码" prop="idNo" label-width="70px">
                    <el-input v-model="individualList.idNo" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
                    <el-input v-model="individualList.idNo" style="color: #FEF7FC;" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
                    </el-input>
                  </el-form-item>
                </el-form>
@@ -266,7 +269,7 @@
          <div class="title-wrapper">
            主要学习及工作经历
            <div>
            <el-button class="button" size="mini" type="text"  @click="showDialog('open')">
            <el-button class="button" size="mini" type="text"  @click="showDialog('open')" >
              <sapn v-html="'\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'"></sapn></el-button>
            </div>
          </div>
@@ -490,11 +493,15 @@
            <div v-if="item.term === '研究生'"> {{item.content}}</div>
            <div v-if="item.term === '工作'"> {{item.content}}</div>
            <div v-if="item.term === '结婚后'"> {{item.content}}</div>
            <el-button size='mini' type="text" class="btn_edit" @click="editData(item)" style='position: absolute;right:10px;top:5px;'>
              <sapn v-html="'\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'"></sapn>
            </el-button>
          </el-tab-pane>
        </el-tabs>
<!--        <el-button size='mini' type="text" class="btn_autobiography" @click="showDialog('autobiography')" style='position: absolute;right:10px;top:5px;'>-->
<!--          <sapn v-html="'\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'"></sapn>-->
<!--        </el-button>-->

        <el-button size='mini' type="text" class="btn_autobiography" @click="showDialog('autobiography')" style='position: absolute;right:10px;top:5px;'>
          <sapn v-html="'\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0'"></sapn>
        </el-button>
      </div>

    </div>
@@ -627,21 +634,26 @@
      </div>
    </el-dialog>
    <!--新增自传-->
    <el-dialog :title="title" :visible.sync="dialogVisible.autobiography" width="900px" >
    <el-dialog :title="isEdit1 ? '编辑记录' : '新增记录'" :visible.sync="dialogVisible.autobiography" width="900px" append-to-body>
      <el-col >
        <el-form ref="elForm" :model="AutobiographyList" :rules="rules" size="medium"  label-position="left"
                 v-loading="loading" :data="AutobiographyList" @selection-change="handleSelectionChange" >
        <el-form ref="elForm" :model="formDat" :rules="rules" size="medium" label-position="left" >
          <el-row :span="5">
<!--            <el-form-item label="需要修改的记录：" prop="id">-->
<!--              <el-select v-model="formDat.id" placeholder="请选择需要修改的记录" clearable :style="{width: '50%'}"  >-->
<!--                <el-option v-for="(item, index) in AutobiographyList" :key='item.id' :label="item.ageBegin+'~'+item.ageEnd+'岁'+'('+item.term+')'"-->
<!--                ></el-option>-->
<!--              </el-select>-->
<!--            </el-form-item>-->
            <el-form-item label="年龄段：" prop="ageBegin ageEnd" label-width="70px">
              <el-input v-model="AutobiographyList.ageBegin" placeholder="" clearable :style="{width: '20%'}" >
              <el-input v-model="formDat.ageBegin" placeholder="" clearable :style="{width: '20%'}" >
              </el-input>
              <span> 岁 ——</span>
              <el-input v-model="AutobiographyList.ageEnd" placeholder="" clearable :style="{width: '20%'}" >
              <el-input v-model="formDat.ageEnd" placeholder="" clearable :style="{width: '20%'}" >
              </el-input>
              <span> 岁 </span>
          </el-form-item>
            <el-form-item label="时期：" prop="term">
              <el-select v-model="formDat.type" placeholder="请选择时期" clearable :style="{width: '50%'}"  >
              <el-select v-model="formDat.term" placeholder="请选择时期" clearable :style="{width: '50%'}"  >
                <el-option v-for="(item, index) in typeOptions" :key="index" :label="item.label" :value="item.value"
                ></el-option>
              </el-select>
@@ -676,8 +688,8 @@
  listExperience, addExperience, updateExperience, delExperience,
  getIndividualRelation, addRelation, updateRelation, delRelation,
  getCertificateList, addCertificate, updateCertificate, delCertificate,
  getAbroadList, addAbroad,updateAbroad, delAbroad,
  getAutobiographyList, getAutobiographyTermList, addAutobiography,
  getAbroadList, addAbroad, updateAbroad, delAbroad,
  getAutobiographyList, getAutobiographyTermList, addAutobiography,updateAutobiography,
  getCategory,
} from "@/api/self/index";
import { delFamilyevent, uploadPic } from '../../api/bignote'
@@ -688,6 +700,9 @@
export default {
  name: "show",
  dicts: ['sys_normal_disable'],
  // components: {
  //   MyComponent
  // },
  data() {
    return {
      // 遮罩层
@@ -695,8 +710,13 @@

      loading: true,
      formData:[],
      componentKey: 0,
      // 选中数组
      ids: [],
      //性别
      inds:undefined,
      //婚姻类别
      mrs:undefined,
      // 非单个禁用
      single: true,
      // 非多个禁用
@@ -767,15 +787,13 @@
      dateRange: [],
      // 数据范围选项
      fot:[".jpg",".jif"],
      fileList:[
      ],
      fileListOther:[

      ],
      fileList:[],
      fileListOther:[],
      dsb:true,
      btn:false,
      isShow:true,
      isShow_2:false,
      isEdit1:false,
      formDat: {
        //个人基本信息
        nickName:undefined,
@@ -830,7 +848,8 @@
        //自传
        ageBegin:undefined,
        ageEnd:undefined,
        term:undefined
        term:undefined,

      },
      // 菜单列表
      menuOptions: [],
@@ -921,8 +940,8 @@
          trigger: 'blur'
        }],
        content: [{
          // required: true,
          message: '请输入',
          required: true,
          message: '请输入文本',
          trigger: 'blur'
        }],
        witness: [{
@@ -930,8 +949,25 @@
          message: '请输入证明人',
          trigger: 'blur'
        }],
        //自传
        term: [{
          required: true,
          message: '请选择时期',
          trigger: 'blur'
        }],
        ageBegin: [{
          required: true,
          message: '',
          trigger: 'blur'
        }],
        ageEnd: [{
          required: true,
          message: '',
          trigger: 'blur'
        }],

      },
      selectedOption:'',
      typeOptions:[],
      typeOption: [{
        value:'护照',
@@ -957,8 +993,13 @@
      this.dialogVisible.relation1 = false;
      this.dialogVisible.certificate =false;
      this.dialogVisible.abroad=false;
      this.dialogVisible.autobiography=false
      this.dialogVisible.autobiography=false;
      this.isEdit1 = false;
      this.reset();
      // 清空formDat对象的数据
      Object.keys(this.formDat).forEach(key => {
        this.formDat[key] = '';
      });
    },
    //下拉
    handleChange(activeNames) {
@@ -973,7 +1014,19 @@
    handleClick(tab, event) {
      // console.log(tab, event);
      this.getAutobiographyInfor();
      // this.getSrc1(typeOptions)
    },
    //个人自传编辑
    editData(data) {
      this.isEdit1 = true; // 设置为编辑操作
      // 将要修改的数据填充到formDat对象中
      this.formDat.ageBegin = data.ageBegin;
      this.formDat.ageEnd = data.ageEnd;
      this.formDat.term = data.term;
      this.formDat.content = data.content;

      // 打开弹窗
      this.dialogVisible.autobiography = true;
    },

    //隔行变色
@@ -1054,16 +1107,16 @@
        this.AutobiographyList = response.data;
        this.total = response.data.total;
        this.loading = false;

      });
      //根据不同时段的个人自传
      getAutobiographyTermList(this.queryParams).then(response => {
        //  alert(123)
        //   console.log(response.data)
        this.AutobiographyTermList = response.data;
        this.total = response.data.total;
        this.loading = false;
      });

      // getAutobiographyTermList(this.queryParams).then(response => {
      //   //  alert(123)
      //   //   console.log(response.data)
      //   this.AutobiographyTermList = response.data;
      //   this.total = response.data.total;
      //   this.loading = false;
      // });
    },

    //图片的上传及上传按钮隐藏
@@ -1176,7 +1229,12 @@
      this.isShow=false
      this.isShow_2=true
      this.isEditing=true
      // this.isEdit=false
      if(this.individualList.maritalStatus == 0)
          this.mrs = '未婚'
      else if(this.individualList.maritalStatus == 1)
          this.mrs = '已婚'
      else
          this.mrs = '离婚'// this.isEdit=false
    },

    /** 查询自传信息 */
@@ -1185,23 +1243,27 @@
      let _this = this
      getCategory().then(response=>{

        response.data.itemValues.replace("{","").replace("}","").split(",").map(elem=>{
          _this.typeOptions.push({"label":elem.split(":")[0], "value":elem.split(":")[0]})
        // response.data.itemValues.replace("{","").replace("}","").split(",").map(elem=>{
        //   _this.typeOptions.push({"label":elem.split(":")[0], "value":elem.split(":")[0]})
        // })
        response.data.itemValues.replace("{", "").replace("}", "").split(",").map(elem => {
          const label = elem.split(":")[0].trim();
          const value = parseInt(elem.split(":")[1].trim());
          _this.typeOptions.push({ "label": label, "value": value });
          // this.getSrc1(value)
        })
      })

      // if(AutobiographyList.ageEnd==null){
      //   this.AgeEnd='?'
      // }else{
      //   this.AgeEnd=this.ageEnd
      // }
    },

    /** 提交按钮（数据权限） */
    //新增主要经历的保存
    submitDataScope: function() {
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formDat.url = ul+","+uls

      this.$refs["elForm"].validate(valid => {
        if (valid) {
          addExperience(this.formDat).then(response => {
@@ -1218,14 +1280,6 @@
    },
    //新增成员关系的保存
    submitDataScope2: function() {
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formDat.url = ul+","+uls

      this.$refs["elForm"].validate(valid => {
        if (valid) {
          addRelation(this.formDat).then(response => {
@@ -1242,15 +1296,6 @@
    },
    //新增出入境证件的保存
    submitDataScope4: function() {

      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formDat.url = ul+","+uls

      this.$refs["elForm"].validate(valid => {
        if (valid) {
          addCertificate(this.formDat).then(response => {
@@ -1267,14 +1312,6 @@
    },
    //新增出国境的保存
    submitDataScope5: function() {
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formDat.url = ul+","+uls

      this.$refs["elForm"].validate(valid => {
        if (valid) {
          addAbroad(this.formDat).then(response => {
@@ -1289,29 +1326,49 @@
        this.formDat[key] = '';
      });
    },
    //个人自传的保存
    submitDataScope6: function() {

      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      let uls = this.fileListOther.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
      this.formDat.url = ul+","+uls

      this.$refs["elForm"].validate(valid => {
        if (valid) {
          addAutobiography(this.formDat).then(response => {
            this.$modal.msgSuccess("新增成功");
            this.dialogVisible.autobiography = false;
            this.getList();
          });
          // 根据值找到选中的选项对象
          const selectedOption = this.typeOptions.find(option => option.value === this.formDat.term);

          if (this.isEdit1) {
            // 执行修改操作
            updateAutobiography(this.formDat).then(response => {
              // 将选中选项的文本设置为"term"字段的值
              this.formDat.term = selectedOption.label;
              this.formDat.id = selectedOption.id;
              console.log("1")
              this.$modal.msgSuccess("修改成功");
              this.dialogVisible.autobiography = false;
              this.isEdit1 = false;
              this.getList();
            }).catch(error => {
              console.log(error);
              this.isEdit1 = false;
              this.dialogVisible.autobiography = false;
            });
          } else {
            // 执行新增操作
            addAutobiography(this.formDat).then(response => {
              this.formDat.term = selectedOption.label;
              this.$modal.msgSuccess("新增成功");
              this.dialogVisible.autobiography = false;
              this.getList();
            }).catch(error => {
              console.log(error);
              this.dialogVisible.autobiography = false;
            });
          }
        }
      });
      // 清空formDat对象的数据
      Object.keys(this.formDat).forEach(key => {
        this.formDat[key] = '';
      });
      // 重置isEdit为false，以便下次点击新增时为新增操作
      this.isEdit1 = false;
    },

    editRow(row) {
@@ -1321,6 +1378,16 @@
    //修改后的保存
    //个人基本信息
    submitForm() {
      if(this.inds=='1')
        this.individualList.sex = 1;
      else
        this.individualList.sex = 0;
      if(this.mrs=='0')
        this.individualList.maritalStatus = 0
      else if(this.mrs == '1')
        this.individualList.maritalStatus = 1
      else
        this.individualList.maritalStatus = 2
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")
      }).join(",")
@@ -1334,8 +1401,14 @@
          if (this.individualList.userId !== undefined) {
            updateIndividual(this.individualList).then(response => {
              this.$modal.msgSuccess("修改成功");
              // 强制更新相关组件
              this.individualList={...this.individualList}

              // this.open = false;
              this.dsb = true
              this.btn=false
              this.isShow_2=false
              this.isShow=true
            });
          } else {
            this.$modal.msgSuccess("修改失败");
@@ -1344,7 +1417,7 @@
        }
      })
      // 刷新页面
      window.location.reload();
      // window.location.reload();
    },
    //主要经历
    saveRowExperienceList(row) {
@@ -1542,6 +1615,10 @@
.btn_autobiography{
  background:center no-repeat url('../../assets/icons/add1.png') ;
}
.btn_edit{
  background:center no-repeat url('../../assets/icons/edit.png') ;
}

.button {
  background:center no-repeat url('../../assets/icons/add1.png') ;
  margin-left: 69.5vw;