feige
2023-09-10 8319f67b9bec1d19c06eaa4216f0f34c67e3afb1
ruoyi-ui/src/views/marry/index.vue
@@ -7,50 +7,44 @@
      ></el-button>
    </el-backtop>
    <h2 style="font-size:30px;padding-top:0px">婚姻状况登记表</h2>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['family:note:export']"
        >导出</el-button>
      </el-col>
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>
    <el-divider />
    <!--    基本信息-->
    <h2 style="font-size:21px">基本情况</h2>
    <el-container>
      <div style="padding-left:0px" >
      <div style="padding-left:0px;width: 28%;" >
        <el-container >
          <el-col >
            <el-form ref="elForm" :model="marryList" :rules="rules" size="medium"  label-position="left"
                     v-loading="loading" :data="marryList" @selection-change="handleSelectionChange" >
              <el-row :span="16">
                <el-form-item label="姓名" prop="name" label-width="40px">
                <el-form-item label="姓名" prop="name" label-width="50px">
                  <el-input v-model="marryList.name " placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="16">
                <el-form-item label="出生日期" prop="birthday" label-width="70px">
                  <el-input v-model="marryList.birthday" placeholder="" type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                <el-form-item label="出生日期" prop="birthday" label-width="75px">
                  <!-- <el-input v-model="marryList.birthday" placeholder="" type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input> -->
                  <el-date-picker v-model="marryList.birthday"
                                  type="date"
                                  placeholder="请选择日期"
                                  :editable="false"
                                  :clearable="false"
                                  :style="{width: '100%'}"
                                  :disabled="dsb" value-format="yyyy-MM-dd"></el-date-picker>
                </el-form-item>
              </el-row>
              <el-row :span="16">
                <el-form-item label="身份证号码" prop="id" label-width="85px">
                <el-form-item label="身份证号码" prop="id" label-width="95px">
                  <el-input v-model="marryList.id" placeholder="" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                </el-form-item>
              </el-row>
              <el-row :span="16">
                <el-form-item label="婚姻状况" prop="marryStatus" label-width="70px">
                <el-form-item label="婚姻状况" prop="marryStatus" label-width="80px" >
                  <template v-if="!isEditing">
                    <el-input v-if="marryList.marryStatus===0" placeholder="未婚" style="" :disabled="dsb"></el-input>
                    <el-input v-if="marryList.marryStatus===1" placeholder="初婚"  :disabled="dsb"></el-input>
@@ -59,7 +53,7 @@
                  </template>
                  <template v-else>
                    <el-select v-model="mrs" placeholder="请选择婚姻状态" clearable :style="{width: '100%'}">
                    <el-select v-model="mrs" placeholder="请选择婚姻状态" clearable :style="{width: '100%'}" @change="handleMarryStatusChange">
                      <el-option label="未婚" value='0'></el-option>
                      <el-option label="初婚" value='1'></el-option>
                      <el-option label="离婚" value='2'></el-option>
@@ -82,7 +76,7 @@
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:200px">
      <div style="width: 35%;padding-left: 100px;">
        <el-container>
          <el-col v-loading="loading" :data="marryList" @selection-change="handleSelectionChange">
            <el-form ref="elForm" :model="marryList" :rules="rules" size="medium"  label-position="left">
@@ -114,8 +108,8 @@
              </el-row>
              <el-row :span="16">
                <el-form-item label="结婚时间" prop="marryTime" label-width="70px">
                  <el-input v-model="marryList.marryTime" placeholder=""  type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                  <el-date-picker v-model="marryList.marryTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-row>
            </el-form>
@@ -129,15 +123,27 @@
        <el-container >
          <el-row  >
            <el-button
              type="primary"
              @click="handleEdit()"
              v-if="isShow"
              v-hasPermi="['system:role:edit']"
            >编辑</el-button>
            <el-button v-if="isShow_2" type="primary" @click="submitForm" :disabled="dsb">完成</el-button>
            <br>
          <el-row :gutter="10" class="mb8">
            <el-col  >
              <el-button
                plain
                @click="handleEdit()"
                style="width: 80px;height: 32px;background: #E0EEFE;"
                v-if="isShow"
                v-hasPermi="['system:role:edit']"
              >编辑</el-button>
              <el-button v-if="isShow_2"  style="width: 80px;height: 32px;background: #E0EEFE;" @click="submitForm" :disabled="dsb">完成</el-button>
              <br>
            </el-col>
            <el-col style="padding-top: 10px;">
              <el-button
                plain
                style="width: 80px;height: 32px;background: #D2F3E0;"
                @click="handleExport"
                v-hasPermi="['family:note:export']"
              >导出</el-button></el-col>
          </el-row>
@@ -147,7 +153,7 @@
    </el-container>
    <h2 style="font-size:16px " >配偶情况</h2>
    <el-container>
      <div style="padding-top:15px" >
      <div style="padding-top:15px;width: 28%;" >
        <el-container >
          <el-col >
            <el-form ref="elForm" :model="marryList" :rules="rules" size="medium"  label-position="left"
@@ -160,8 +166,8 @@
              </el-row>
              <el-row :span="16">
                <el-form-item label="出生日期" prop="spouseBirthday" label-width="70px">
                  <el-input v-model="marryList.spouseBirthday" placeholder="" type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                  <el-date-picker v-model="marryList.spouseBirthday" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-row>
              <el-row :span="16">
@@ -202,7 +208,7 @@
          </el-col>
        </el-container>
      </div>
      <div style="padding-left:200px;padding-top:15px">
      <div style="padding-left:100px;padding-top:15px;width: 30%;">
        <el-container>
          <el-col v-loading="loading" :data="marryList" @selection-change="handleSelectionChange">
            <el-form ref="elForm" :model="marryList" :rules="rules" size="medium"  label-position="left">
@@ -235,8 +241,8 @@
              </el-row>
              <el-row :span="16">
                <el-form-item label="结婚时间" prop="spouseMarryTime" label-width="70px">
                  <el-input v-model="marryList.spouseMarryTime" placeholder=""  type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                  <el-date-picker v-model="marryList.spouseMarryTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-row>
            </el-form>
@@ -256,7 +262,7 @@
      <!--      </el-dialog> self:user:export-->
    </el-container>
    <div>
    <div v-if="showOldSpouse">
      <el-collapse v-model="activeNames" @change="handleChange">
        <el-collapse-item name="1"  >
@@ -296,8 +302,8 @@
            <el-table-column label="出生日期" prop="birthday" sortable width="150" align="center" >
              <template slot-scope="scope">
                <template v-if="!scope.row.isEdit">{{ scope.row.birthday }}</template>
                <template v-else><el-input v-model="scope.row.birthday" type="date" placeholder="选择日期">
                </el-input></template>
                <template v-else><el-date-picker v-model="scope.row.birthday" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}"   value-format="yyyy-MM-dd">
                </el-date-picker></template>
              </template>
            </el-table-column>
            <el-table-column label="户籍地址" prop="address" sortable width="180" align="center" >
@@ -322,12 +328,12 @@
            <el-table-column label="婚姻状态" prop="marryStatus" sortable width="100" align="center" >
              <template slot-scope="scope">
                <template v-if="!scope.row.isEdit">
                <template v-if="!scope.row.isEdit" >
                  <span v-if="scope.row.marryStatus== 0">未婚</span>
                  <span v-if="scope.row.marryStatus== 1">初婚</span>
                  <span v-if="scope.row.marryStatus== 2">离婚</span>
                  <span v-if="scope.row.marryStatus== 3">再婚</span></template>
                <template v-else>  <el-select v-model="scope.row.marryStatus" placeholder="请选择">
                <template v-else>  <el-select v-model="qianren" placeholder="请选择">
                  <el-option label="未婚" value="0"></el-option>
                  <el-option label="初婚" value="1"></el-option>
                  <el-option label="离婚" value="2"></el-option>
@@ -340,8 +346,8 @@
            <el-table-column label="结婚时间" prop="marryTime" sortable width="150" align="center" >
              <template slot-scope="scope">
                <template v-if="!scope.row.isEdit">{{ scope.row.marryTime }}</template>
                <template v-else><el-input v-model="scope.row.marryTime" type="date" placeholder="选择日期">
                </el-input></template>
                <template v-else><el-date-picker v-model="scope.row.marryTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}"   value-format="yyyy-MM-dd">
                </el-date-picker></template>
              </template>
            </el-table-column>
            <!-- 操作 -->
@@ -431,14 +437,14 @@
              <el-row :span="16"  >
                <el-form-item label="领证时间" prop="handbookTime" label-width="70px">
                  <el-input v-model="marryList.handbookTime " placeholder=""  type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                  <el-date-picker v-model="marryList.handbookTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-row>
              <el-row :span="16">
                <el-form-item label="领证时间" prop="oneBornTime" label-width="70px">
                  <el-input v-model="marryList.oneBornTime" placeholder="" type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                  </el-input>
                  <el-date-picker v-model="marryList.oneBornTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" :disabled="dsb" value-format="yyyy-MM-dd">
                  </el-date-picker>
                </el-form-item>
              </el-row>
@@ -478,11 +484,8 @@
          </el-select>
        </el-form-item>
        <el-form-item label="出生日期" prop="birthday">
          <el-input
            v-model='formDat.birthday'
            type='date'
            placeholder='选择日期'
          ></el-input>
          <el-date-picker v-model="formDat.birthday" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="民族" prop="nation">
          <el-input v-model="formDat.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" >
@@ -506,11 +509,8 @@
          </el-select>
        </el-form-item>
        <el-form-item label="结婚时间" prop="marryTime">
          <el-input
            v-model='formDat.marryTime'
            type='date'
            placeholder='选择日期'
          ></el-input>
          <el-date-picker v-model="formDat.marryTime" type="date" placeholder="请选择日期" :editable="false" :clearable="false" :style="{width: '100%'}" value-format="yyyy-MM-dd">
          </el-date-picker>
        </el-form-item>
@@ -539,6 +539,7 @@
  data() {
    return {
      showOldSpouse:false,//显示前任信息
      // 遮罩层
      disabled: false,
      isEditing:false,
@@ -590,7 +591,6 @@
      },
      fit:['fill'],
      oldSpouseList:{},
      //下拉实现
      activeNames:['1'],
      // 弹出层标题
@@ -621,7 +621,6 @@
      btn:false,
      isShow:true,
      isShow_2:false,
      oldSpouseList:undefined,
      oldSpouseList:{
        name:undefined,
        sex:undefined,
@@ -661,10 +660,33 @@
      },
      // 表单校验
      rules: {
        id: [{
          required: true,
          message: '请输入身份证号码',
          trigger: 'blur'
        }],
        name: [{
          required: true,
          message: '请输入姓名',
          trigger: 'blur'
        }],
        birthday: [{
          // required: true,
          message: '请选择日期',
          trigger: 'change'
        }],
        marryStatus: [{
          required: true,
          message: '请选择婚姻状况',
          trigger: 'change'
        }],
        marryTime: [{
          // required: true,
          message: '请选择结婚时间',
          trigger: 'change'
        }],
      },
      typeOptions: [],
      typeOptions: [ {
        value: '女',
        label: '女',
@@ -695,6 +717,17 @@
    this.getList()
  },
  methods: {
    handleMarryStatusChange() {
      // 判断当前选中的婚姻状态是否为再婚
      if (this.mrs === '3') {
        this.showOldSpouse = true;
      } else {
        this.showOldSpouse = false;
      }
    },
    //性别
    getSrc1(sex) {
      if (sex === '女') {
@@ -734,9 +767,16 @@
          else{
            this.marryList = response.data;
            this.oldSpouseList = this.marryList.oldSpouseList;
            this.loading = false;
            console.log(111)
            console.log(this.oldSpouseList)
            console.log("信息")
            console.log(this.marryList.marryStatus);
            if(this.marryList.marryStatus===3){
              this.showOldSpouse = true;
            } else{
              this.showOldSpouse = false;
            }
            this.loading = false;
          }
        }
@@ -817,6 +857,7 @@
        this.mrs = '离婚'
      else
        this.mrs = '再婚'// this.isEdit=false
      if(this.marryList.spouseMarryStatus == 0)
        this.smrs = '未婚'
      else if(this.marryList.spouseMarryStatus == 1)
@@ -831,6 +872,16 @@
        this.bear = '在孕'
      else if(this.marryList.bearStatus == 2)
        this.bear = '已生育'
      if(this.marryList.oneBorn == 0)
        this.onebear = '否'
      else if(this.marryList.oneBorn == 1)
        this.onebear = '是'
      if(this.marryList.handbookStatus == 0)
        this.handsj = '否'
      else if (this.marryList.handbookStatus == 1)
        this.handsj = '是'
    },
@@ -876,6 +927,14 @@
    },
    editRow(row) {
      if(this.oldSpouseList.marryStatus == 0)
        this.qianren = '未婚'
      else if(this.oldSpouseList.marryStatus == 1)
        this.qianren = '初婚'
      else if(this.oldSpouseList.marryStatus == 2)
        this.qianren = '离婚'
      else
        this.qianren = '再婚'// this.isEdit=false
      this.$set(row, 'isEdit', true);
      this.$set(this.editStatus, row.id, true);
    },