完成家根网详情页面样式

Tcsm

2023-05-29 ebe31a83ee1c76bfc6546e8b60ae5cf90c554346

完成家根网详情页面样式

 ruoyi-ui/src/api/honor/index.js

@@ -8,7 +8,14 @@
    params: query
  })
}
// 根据id查询记录
export function getHonor(id) {
  return request({
    url: '/zHonor/' + id,
    method: 'get',

  })
}
//新增荣誉证书
export function addHonor(data)
{

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

@@ -460,8 +460,8 @@
}
.avater_2_1{
  position: absolute;
  top: 72%;
  left: 44%;
  top: 75%;
  left: 43%;
  transform: translate(-50%, -50%);
  width: 44px;
  height: 44px;
@@ -469,8 +469,8 @@
}
.avater_2_2{
  position: absolute;
  top: 65%;
  left: 48%;
  top: 67%;
  left: 47%;
  transform: translate(-50%, -50%);
  width: 44px;
  height: 44px;
@@ -479,7 +479,7 @@
}
.avater_2_3{
  position: absolute;
  top: 64%;
  top: 67%;
  left: 55%;
  transform: translate(-50%, -50%);
  width: 44px;
@@ -489,7 +489,7 @@
}
.avater_2_4{
  position: absolute;
  top: 73%;
  top: 76%;
  left: 59%;
  transform: translate(-50%, -50%);
  width: 36px;
@@ -499,8 +499,8 @@
}
.avater_2_5{
  position: absolute;
  top: 70%;
  left: 39%;
  top: 73%;
  left: 38%;
  transform: translate(-50%, -50%);
  width: 37px;
  height: 39px;
@@ -509,8 +509,8 @@
}
.avater_2_6{
  position: absolute;
  top: 58%;
  left: 44%;
  top: 62%;
  left: 43%;
  transform: translate(-50%, -50%);
  width: 34px;
  height: 35px;
@@ -519,7 +519,7 @@
}
.avater_2_7{
  position: absolute;
  top: 58%;
  top: 62%;
  left: 59%;
  transform: translate(-50%, -50%);
  width: 35px;
@@ -529,7 +529,7 @@
}
.avater_2_8{
  position: absolute;
  top: 70%;
  top: 73%;
  left: 64%;
  transform: translate(-50%, -50%);
  width: 45px;

 ruoyi-ui/src/views/homeRoot/personInfo.vue

@@ -1,7 +1,261 @@
<template>
  <div class="app-container">
    <div class="wrapper">
    <div class="wrapper" style="overflow: auto;">
      <div id="building">

          <el-form ref="elForm" :model="personInfos" :rules="rules" size="medium" label-position="left" label-width="100px">
            <el-container>
              <div style="padding-left:30px;padding-top: 50px">
                <el-container>
                  <el-col :span="6" :data="personInfos">
                    <div class="block" :model="personInfos" >
                      <el-col v-model="personInfos.url" prop="url">
                        <el-avatar shape="square" :size=200 >
                          <el-image
                            :src="'http://47.93.189.255:8080/'+ personInfos.url"
                            :fit="fit"
                          ></el-image>
                        </el-avatar>
                      </el-col>
                    </div>
                  </el-col>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 15px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="姓名" prop="nickName" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="身份" prop="identity" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.identity" placeholder="请输入身份" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="曾用名" prop="oldName" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="生肖" prop="idNo" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.idNo" placeholder="请输入生肖" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="星座" prop="grade" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.grade" placeholder="请输入星座" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>

                  </el-row>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 15px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="性别" prop="sex" label-width="45px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="民族" prop="nation" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="联系方式" prop="phoneNumber" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="微信号" prop="nationality" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.nationality" placeholder="请输入微信号" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="单位" prop="unit" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.unit" placeholder="请输入单位" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                  </el-row>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 15px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="婚姻状况" prop="sex" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.sex" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="配偶" prop="spouseId" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.spouseId" placeholder="请输入配偶" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="户籍地址" prop="locationAddress" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="常住地址" prop="alwaysAddress" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="职务职称" prop="position" label-width="68px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.position" placeholder="请输入职务职称" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                  </el-row>
                </el-container>
              </div>
            </el-container>
            <el-divider />
            <el-container>
              <div style="padding-left:30px;padding-top: 10px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="姓名" prop="nickName" label-width="50px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.nickName" placeholder="请输入姓名" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="身份" prop="identity" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.identity" placeholder="请输入身份" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="曾用名" prop="oldName" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="personInfos.oldName" placeholder="请输入曾用名" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="生肖" prop="idNo" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.idNo" placeholder="请输入生肖" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="星座" prop="grade" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.grade" placeholder="请输入星座" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>

                  </el-row>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 10px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="性别" prop="sex" label-width="45px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.sex" placeholder="请输入性别" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="民族" prop="nation" label-width="50px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.nation" placeholder="请输入民族" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="联系方式" prop="phoneNumber" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.phoneNumber" placeholder="请输入联系方式" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="微信号" prop="nationality" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.nationality" placeholder="请输入微信号" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="单位" prop="unit" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.unit" placeholder="请输入单位" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                  </el-row>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 10px">
                <el-container>
                  <el-row>
                    <el-cow :span="8">
                      <el-form-item label="婚姻状况" prop="sex" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.sex" placeholder="请输入婚姻状况" clearable :style="{width: '100%'}" :disabled="dsb"></el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="配偶" prop="spouseId" label-width="50px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.spouseId" placeholder="请输入配偶" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="户籍地址" prop="locationAddress" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.locationAddress" placeholder="请输入户籍地址" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="常住地址" prop="alwaysAddress" label-width="68px" style="background: #D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.alwaysAddress" placeholder="请输入常住地址" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                    <el-cow :span="8">
                      <el-form-item label="职务职称" prop="position" label-width="68px" style="background:#D8E6F5;border-radius: 7px 7px 7px 7px;opacity: 1;">
                        <el-input v-model="formData.position" placeholder="请输入职务职称" clearable :style="{width: '100%'}" :disabled="dsb">
                        </el-input>
                      </el-form-item>
                    </el-cow>
                  </el-row>
                </el-container>
              </div>
              <div style="padding-left:30px;padding-top: 45px">
                <el-container>
                  <el-col :span="6" :data="personInfos">
                    <div class="block" :model="personInfos" >
                      <el-col v-model="personInfos.url" prop="url">
                        <el-avatar shape="square" :size=200 >
                          <el-image
                            :src="'http://47.93.189.255:8080/'+ personInfos.url"
                            :fit="fit"
                          ></el-image>
                        </el-avatar>
                      </el-col>
                    </div>
                  </el-col>
                </el-container>
              </div>
            </el-container>
          </el-form>

      </div>
    </div>
@@ -10,11 +264,102 @@

<script>
import {getRoot} from "@/api/root/index";
import {listExperience} from "@/api/self";
  export default {
    name: "index",
    data(){
      return{
        personInfos:[]
        // 遮罩层
        disabled: false,
        personInfos:[],
        loading: true,
        formData:{
          userId: undefined,
          nickName: undefined,
          oldName: undefined,
          sex: undefined,
          nationality: undefined,
          nation: undefined,
          maritalStatus: undefined,
          politicalOutlook: undefined,
          phoneNumber:undefined,
          idNum: undefined,
          locationAddress: undefined,
          alwaysAddress:undefined,
          locationPolice: undefined,
          alwaysPolice: undefined,
          unit: undefined,
          position:undefined,
          outStatus:undefined,
          idNo: undefined,
          img: undefined,
          spouseId: undefined,
          fatherId: undefined,
          momId: undefined,
          birth: undefined,
          url:undefined,
          familyId:undefined,
          secondFamilyId: undefined,
          childList: undefined
        },
        // 菜单列表
        menuOptions: [],
        // 部门列表
        deptOptions: [],
        // 表单参数
        form: {},
        defaultProps: {
          children: "children",
          label: "label"
        },
        // 表单校验
        rules: {
          createTime: [{
            required: true,
            message: '请输入创建时间',
            trigger: 'blur'
          }],
          type: [{
            required: true,
            message: '请输入类型',
            trigger: 'blur'
          }],
          name: [{
            required: true,
            message: '请输入名称',
            trigger: 'blur'
          }],
          grade: [{
            required: true,
            message: '请输入级别',
            trigger: 'blur'
          }],
          idNo: [{
            required: true,
            message: '请输入证件号/专业',
            trigger: 'blur'
          }],
          validityDate: [{
            // required: true,
            message: '请输入有效时间',
            trigger: 'blur'
          }],
          getDate: [{
            // required: true,
            message: '请输入获得时间',
            trigger: 'blur'
          }],
          location: [{
            // required: true,
            message: '请输入存放位置',
            trigger: 'blur'
          }],
          remark: [{
            // required: true,
            message: '请输入备注',
            trigger: 'blur'
          }],
        },
        }
    }
  ,
@@ -30,7 +375,8 @@
        console.log(response.data)
        //这里是夫妻的信息，已经拿到了
        this.personInfos = response.data
    })
    });

    }
  },
  }
@@ -42,11 +388,27 @@
  background: url("../../assets/images/Group 407.png");
  width: 100%;
  height: 100%;
  position: fixed;
  background-size: 100% 100%;
  background-size: 100%;
  background-position: top left;
  background-repeat: no-repeat;
}
#building {
  /*设置透明度*/
  opacity: 0.75;
  /*opacity: 0.9;*/
  background: rgba(255,255,255,0.8);
  /*overflow-y:auto;*/
}
.app-container{
  background-color: #FEF7FC;

}
.el-divider {
  /*display: inline-block;*/
  weight: 1px;
  height: 1px;
  background: 0 0;
  background-color: rgba(0,0,0,0.3);
  margin: 2px 0px;
  position: relative;
}
</style>

 ruoyi-ui/src/views/honor/honorInfo.vue

@@ -196,7 +196,7 @@
import errorCode from "@/utils/errorCode";
import {Message} from "element-ui";
import { download,uploadPic} from "@/api/doctor/index";
import {listHonor,updateHonor} from "@/api/honor/index";
import {listHonor,updateHonor,getHonor} from "@/api/honor/index";

export default {
  components: {},
@@ -307,7 +307,7 @@
    let _this = this
    if (id) {
      this.loading = true;
      listHonor(id).then((response) => {
      getHonor(id).then((response) => {
        this.formData = response.data;
        let paths = response.data.url.split(",");
        for(let i = 0; i < paths.length; i++)
@@ -335,16 +335,16 @@
  mounted() {},
  methods: {
    /** 查询类别信息 */
    // getCateInfor()
    // {
    //   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]})
    //     })
    //   })
    // },
    getCateInfor()
    {
      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]})
        })
      })
    },
    submitForm() {
      let ul = this.fileList.map(function (elem){
        return elem.url.replace(process.env.VUE_APP_BASE_TRUE_API,"")

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

@@ -574,12 +574,24 @@
    },
    //类别选择
    getSrc(type) {
      if (type === '出生证'){
      if (type === 1){
        return '出生证'
      }else if(type === '牙科'){
        return '牙科'
      }else if(type === '内科'){
        return '内科'
      }else if(type === 2){
        return '学生证'
      }else if(type === 3){
        return '毕业证'
      }else if(type === 4){
        return '结婚证'
      }else if(type === 5){
        return '户口簿'
      }else if(type === 6){
        return '独生子女证'
      }else if(type === 7){
        return '高级职称'
      }else if(type === 8){
        return '护照'
      }else if(type === 9){
        return '通行证'
      }else {
        return '其它'
      }
@@ -661,7 +673,7 @@
    /** 查看详细信息 */
    handleCheck(row){
      const id = row.id;
      this.$router.push("/self/honor/honorInfo/" + id);
      this.$router.push("/self/Honor/honorInfo/" + id);
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
@@ -669,7 +681,7 @@
      let jd = true

      this.$router.push({
        path:"/self/honor/honorInfo/" + id,
        path:"/self/Honor/honorInfo/" + id,
        query:{
          detail:jd
        }