show.vue 把全部的formdata替换为了individualList bignote/index.js 里面把getFamilyevent...

feige

2023-04-07 934b3374ee33ea37656fda229e25dc1d6ed61d7d

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

@@ -9,26 +9,490 @@
    <h1 style="font-size:21px">个人简历</h1>
    <el-divider />
    <h2 style="font-size:16px">基本信息</h2>
    <el-col :span="8">
      
<!-- 
    <el-container>
      <div style="padding-left:30px">
        <el-container>
          <el-col>
            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="70px" label-position="left">
              <el-row :span="6">
                <el-form-item label="姓名" prop="nickName">
                  <el-input v-model="formData.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="6">
                <el-form-item label="曾用名" prop="oldName">
                  <el-input v-model="formData.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="8">
                <el-form-item label="身份证号" prop="idNum">
                  <el-input v-model="formData.idNum" placeholder="请输入身份证号" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
            </el-form>
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:70px">
        <el-container>
          <el-col >
            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="60px" label-position="left">
              <el-row :span="6">
                <el-form-item label="性别" prop="sex">
                  <el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="6">
                <el-form-item label="民族" prop="nation">
                  <el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="8">
                <el-form-item label="联系方式" prop="phoneNumber">
                  <el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
            </el-form>
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:70px">
        <el-container>
          <el-col>
            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="60px" label-position="left">
              <el-row :span="6">
                <el-form-item label="国籍" prop="nationality">
                  <el-input v-model="formData.nationality" placeholder="请输入国籍" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="6">
                <el-form-item label="婚姻状况" prop="maritalStatus">
                  <el-input v-model="formData.maritalStatus" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>

    </el-col>
            </el-form>
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:70px;padding-top:30px">
        <el-row :gutter="6" >
          <el-upload ref="ref1"
                     action=""
                     :file-list="fileList"
                     list-type="picture-card"
                     accept="image/*"
                     :auto-upload="false"
                     :multiple="false"
                     :limit="1">
            <i class="el-icon-plus"></i>
          </el-upload>
        </el-row>
      </div>
      <div style="padding-left:50px;padding-top:30px"  >
        <el-container>
          <el-row :span="2" style="flex-direction: column;">
            <el-button type="primary" @click="submitForm">编辑</el-button>
            <br>
            <el-button type="primary" @click="submitForm">导入</el-button>
          </el-row>
        </el-container>
      </div>
    </el-container>
    <el-container>
      <div style="padding-left:30px">
        <el-container>
          <el-col>
            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px" label-position="left">
              <el-row :span="15">
                <el-form-item label="户籍地址" prop="locationAddress">
                  <el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="15">
                <el-form-item label="常住地址" prop="alwaysAddress">
                  <el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="15">
                <el-form-item label="单位及职务职称" prop="position">
                  <el-input v-model="formData.position" placeholder="请输入单位及职务职称" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>

            </el-form>
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:30px">
        <el-container>
          <el-col>
            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px" label-position="left">
              <el-row :span="12">
                <el-form-item label="户籍地公安机关" prop="locationPolice">
                  <el-input v-model="formData.locationPolice" placeholder="请输入户籍地公安机关" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="12">
                <el-form-item label="常住地公安机关" prop=" alwaysPolice">
                  <el-input v-model="formData. alwaysPolice" placeholder="请输入常住地公安机关" clearable :style="{width: '100%'}">
                  </el-input>
                </el-form-item>
              </el-row>

            </el-form>
          </el-col>
        </el-container>
      </div>
    </el-container> -->


    <div style="padding-top:30px">
      <el-container>
        <div style="width:100%"><h2 style="font-size:15px" >主要学习及工作经历</h2></div>
        <el-button type="primary" icon="el-icon-edit" round></el-button>
      <el-button type="primary" icon="el-icon-delete" round></el-button>
      </el-container>

      <el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="16"  align="center" />
        <el-table-column label="起止日期" prop="startDate" sortable width="300" align="center" />
        <el-table-column label="主要学习经历、工作单位及任职情况" prop="content" sortable width="350" align="center" />
        <el-table-column label="证明人" prop="witness" sortable width="300" align="center" />
        <el-table-column label="删除" align="center" class-name="small-padding fixed-width" sortable width="100">

        </el-table-column>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>

    <div style="padding-top:30px">
    <el-container>
      <div style="width:100%"><h2 style="font-size:15px" >家庭成员及主要社会关系情况</h2></div>
      <el-button type="primary" icon="el-icon-edit" round></el-button>
      <el-button type="primary" icon="el-icon-delete" round></el-button>
    </el-container>
      <!--      :data =""内的东西不知道要不要改-->
    <el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="16"  align="center" />
      <el-table-column label="与本人关系"  prop="" width="270" align="center" />
      <el-table-column label="姓名"  sortable width="270" align="center" />
      <el-table-column label="单位及职务"  sortable width="270" align="center" />
      <el-table-column label="政治面貌"  sortable width="270" align="center">
      </el-table-column>
    </el-table>

    </div>

    <el-container>
      <div style="width:100%"><h2 style="font-size:15px" >移居国（境）情况</h2></div>

    </el-container>

    <div style="padding-top:30px">
      <el-container>
        <div style="width:100%"><h2 style="font-size:15px" >持有出入境证件情况</h2></div>
        <el-button type="primary" icon="el-icon-edit" round></el-button>
        <el-button type="primary" icon="el-icon-delete" round></el-button>
      </el-container>
        <!--      :data =""内的东西不知道要不要改-->
        <el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="16"  align="center" />
          <el-table-column label="证件名称"  sortable width="270" align="center" />
          <el-table-column label="持有情况"  sortable width="270" align="center" />
          <el-table-column label="证件号码"  sortable width="270" align="center" />
          <el-table-column label="有效期"  sortable width="270" align="center">
          </el-table-column>
        </el-table>
    </div>
    <div style="padding-top:30px">
      <el-container>
        <div style="width:100%"><h2 style="font-size:15px" >出国（境）情况</h2></div>
        <el-button type="primary" icon="el-icon-edit" round></el-button>
        <el-button type="primary" icon="el-icon-delete" round></el-button>
      </el-container>
      <el-table v-loading="loading" :data="experiencelList" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="16"  align="center" />
        <el-table-column label="起止日期" prop="startDate" sortable width="300" align="center" />
        <el-table-column label="所到国家或者地区" prop="content" sortable width="350" align="center" />
        <el-table-column label="事由（旅游、走访、探亲、继承财产、其他）" prop="witness" sortable width="300" align="center" />
        <el-table-column label="删除" align="center" class-name="small-padding fixed-width" sortable width="100">
        </el-table-column>
      </el-table>

    </div>

  </div>

</template>

<script>
import {getIndividualInfo, getIndividualRelation, delIndividual, updateIndividual, addIndividual} from "@/api/self/index";
import {getIndividualInfo, getIndividualRelation,
delIndividual, updateIndividual, addIndividual,listExperience,
updateExperience,
  addExperience,delExperience} from "@/api/self/index";

export default {
  name: 'index',
  components: {},
  props: [],

  data() {
    return {
      input: ''
    }
  }
      input: '',
      filelist: [],

      // 遮罩层
      disabled: false,

      loading: true,
      // formData:[],
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 个人经历数据
      experiencelList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 是否显示弹出层（数据权限）
      openDataScope: false,
      menuExpand: false,
      menuNodeAll: false,
      deptExpand: true,
      deptNodeAll: false,
      // 日期范围
      dateRange: [],
      // 数据范围选项
      fot:[".jpg",".jif"],
      fileList:[
      ],
      fileListOther:[

      ],
      dsb:true,
      btn:false,

      formData: {
        nickName: undefined,
        oldName: undefined,
        sex: undefined,
        nationality: undefined,
        nation: undefined,
        maritalStatus: undefined,
        idNum: undefined,
        politicalOutlook: undefined,
        phoneNumber: undefined,
        locationAddress: undefined,
        alwaysPolice: undefined,
        alwaysAddress: undefined,
        position: undefined,
        locationPolice: undefined,
      },
      rules: {
        nickName: [{
          required: true,
          message: '请输入姓名',
          trigger: 'blur'
        }],
        sex: [{
          required: true,
          message: '请输入性别',
          trigger: 'blur'
        }],
        nationality: [{
          required: true,
          message: '请输入国籍',
          trigger: 'blur'
        }],
        oldName: [{
          required: true,
          message: '请输入曾用名',
          trigger: 'blur'
        }],
        nation: [{
          required: true,
          message: '请输入民族',
          trigger: 'blur'
        }],
        idNum: [{
          // required: true,
          message: '请输入身份证号',
          trigger: 'blur'
        }],
        maritalStatus: [{
          // required: true,
          message: '请输入婚姻状况',
          trigger: 'blur'
        }],
        phoneNumber: [{
          // required: true,
          message: '请输入联系方式',
          trigger: 'blur'
        }],
        locationAddress: [{
          // required: true,
          message: '请输入户籍地址',
          trigger: 'blur'
        }],
        locationPolice: [{
          // required: true,
          message: '请输入户籍地公安机关',
          trigger: 'blur'
        }],
        alwaysAddress: [{
          // required: true,
          message: '请输入常住地址',
          trigger: 'blur'
        }],
        alwaysPolice: [{
          // required: true,
          message: '请输入常住地公安机关',
          trigger: 'blur'
        }],
        position: [{
          // required: true,
          message: '请输入单位及职务职称',
          trigger: 'blur'
        }],
      },

      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 5,
        startDate:undefined,
        content:undefined,
        witness:undefined,
        createTime:undefined
      },
    }
  },
  computed: {},
  watch: {},
  created() {
    this.getList();
    // this.getCateInfor()
  },
  mounted() {},
  methods: {
    submitForm() {
      this.$refs['elForm'].validate(valid => {
        if (!valid) return
        // TODO 提交表单
      })
    },
    resetForm() {
      this.$refs['elForm'].resetFields()
    },
    fillFormData(){
      let formData = new FormData();
      let photo = this.$refs['ref1'].uploadFiles[0];
      if(photo===undefined){
        this.$message.error("请选择照片");
        return false;
      }
      if(photo!==undefined){
        formData.append('照片', photo.raw);//根据后端需要的参数进行相应更改，大多是文件格式
      }
      return formData;
    },
    dialogConfirm() {
      let formData=this.fillFormData();
      if(this.dialogMode ==='edit'){//dialogMode用于判断当前时添加还是编辑
        this.api.update(formData).then(res => {//调用修改接口
          if (res.data.code == "OK") {
            this.$message({
              type: "success",
              message: "修改成功!",
              duration:5000
            });
            this.fileList=[];
          } else {
            this.$message.error(res.data.message);
          }
        },()=>{
          this.$message.error("修改失败");
        }).finally(()=>{
        });
      }else{
        this.api.insert(formData).then(res => {//添加接口
          if (res.data.code == "OK") {
            this.$message({
              type: "success",
              message: "新建成功!",
              duration:5000
            });
            this.fileList=[];
          } else {
            this.$message.error(res.data.message);
          }
        },()=>{
          this.$message.error("新建失败");
        }).finally(()=>{
        });
      }
    },
    //点击编辑时图片回显
    edit(info){//info=>后台接口返回的数据
      let url=this.baseUrl+info.photo//url的地址根据项目实际需要，info.photo=>图片路径,this.baseUrl=>上传的网络地址
      this.fileList=[];
      this.fileList.push({
        'url': url
      })
      this.dialogMode='edit';//设置为编辑
    },
    onCreateNew(){
      this.fileList=[];
      this.dialogMode='create';//设置为添加
    },
    /** 个人信息列表 */
    getList() {
      this.loading = true;
      // console.log(this.queryParams)
      //  listProperty(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
      listExperience(this.queryParams).then(response => {
          //  alert(123)
          //   console.log(response.data)
        alert(123)
          this.experiencelList = response.data.data;

          this.total = response.data.total;
          this.loading = false;
        }

      );
    },


  }
}
</script>