2、通用字典

2023-07-23  本文已影响0人  wqjcarnation

通用字典
所有的下拉菜单都做到字典里。数据组织成如下格式
{xx=[ConstantItem(id=27, constantName=A, constantTypeId=7), ConstantItem(id=28, constantName=B, constantTypeId=7), ConstantItem(id=29, constantName=AB, constantTypeId=7), ConstantItem(id=30, constantName=O, constantTypeId=7)],hzgx=[...]}

字典后台

    @Data
    public class ConstantType {
    private Integer id;
    private String constantTypeCode;
    private String constantTypeName;
    }

    @Data
    public class ConstantItem {
    private Integer id;
    private String constantName;
    private Integer constantTypeId;
    
    }

    @RestController
    @RequestMapping("/constantType")
    public class ConstantTypeController {
        @Autowired
        IConstantTypeService service;
        @RequestMapping("/findAll")
        public Map<String,List<ConstantItem>> findAll(){
            Map<String,List<ConstantItem>> map=service.findAll();
            return map;
            
        }
    }

            @Service
    public class ConstantTypeServiceImpl implements IConstantTypeService {
        @Autowired
        ConstantTypeMapper mapper;
        
        @Autowired
        ConstantItemMapper itemMapper;
        @Override
        public Map<String, List<ConstantItem>> findAll() {
            List<ConstantType> list=mapper.findAll();
            Map<String,List<ConstantItem>> map=new HashMap();
            for(ConstantType type:list){
                //获取分类代码
                int typeId=type.getId();
                //根据typeId去查询下面的项目
                List<ConstantItem> itemList=itemMapper.findByTypeId(typeId);
                map.put(type.getConstantTypeCode(),itemList);
            }
            return map;
        }
    
    }

public interface ConstantTypeMapper {
    @Select("select * from constanttype")
    List<ConstantType> findAll();

}

    public interface ConstantItemMapper {
        @Select("select * from constantitem where constantTypeId=#{typeId}")
        List<ConstantItem> findByTypeId(int typeId);
    
    }

字典前台

    <template>
        <div class="regist">
            <h3>{{title}}</h3>
            <table border="0" cellspacing="10px" cellpadding="0" width="90%">
                <tr>
                    <td class="strong right" width="10%">姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:</td>
                    <td width="20%" class="left">
                        <input type="text" v-model="form.name" />
                    </td>
                    <td class="strong right" width="10%">性&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;别:</td>
                    <td width="20%" class="left">
                        <select v-model="form.sex"  >
                            <option v-for="item in state.dictList.xb" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                        </select>
                    </td>
                    <td class="strong right" width="10%">与户主关系:</td>
                    <td width="30%" class="left">
                        <select v-model="form.relation">
                            <option v-for="item in state.dictList.hzgx" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                        </select>
                    </td>
                </tr>

                <tr>
                    <td class="strong right">出生日期:</td>
                    <td class="left">
                        <input type="date" v-model="form.birthday" />
                    </td>
                    <td class="strong right">身份证号:</td>
                    <td class="left">
                        <input type="text" v-model="form.idNumber" />
                    </td>
                    <td class="strong right">宗教信仰:</td>
                    <td class="left">
                        <input type="text" v-model="form.religiousBelief" />
                    </td>
                </tr>
                <tr>
                    <td class="strong right" width="12%">文化程度:</td>
                    <td width="18%" class="left">
                        <select v-model="form.educationalLevel">
                            <option v-for="item in state.dictList.whcd" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                        </select>
                    </td>
                    <td class="strong right" width="12%">婚姻状况:</td>
                    <td width="18%" class="left">
                        <select v-model="form.marriage">
                            <option v-for="item in state.dictList.hyzk" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                            
                        </select>
                    </td>
                    <td class="strong right" width="12%">兵役情况:</td>
                    <td width="28%" class="left">
                        <select v-model="form.militaryService">
                            <option v-for="item in state.dictList.byqk" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td class="strong right" width="12%">民&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;族:</td>
                    <td width="18%" class="left">
                        <select v-model="form.nation">
                            <option v-for="item in state.dictList.mz" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                            
                        </select>
                    </td>
                    <td class="strong right" width="12%">血&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型:</td>
                    <td width="18%" class="left">
                        <select v-model="form.bloodType">
                            <option v-for="item in state.dictList.xx" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                            
                        </select>
                    </td>
                    <td class="strong right" width="12%">职&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;业:</td>
                    <td width="28%" class="left">
                        <input type="text" v-model="form.job" />
                    </td>
                </tr>
                <tr>
                    <td class="strong right" width="12%">住&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址:</td>
                    <td width="18%" class="left">
                        <input type="text" v-model="form2.address" />
                    </td>
                    <td class="strong right" width="12%">户口类型:</td>
                    <td width="18%" class="left">
                        <select v-model="form2.populationType">
                            <option v-for="item in state.dictList.hklx" :key="item.id"  :value="item.id">{{item.constantName}}</option>
                        </select>
                    </td>
                    <td class="strong right" width="12%">户主姓名</td>
                    <td width="28%" class="left">
                        <input type="text" v-model="form2.houseHolder" />
                    </td>
                </tr>

                <tr>
                    <td colspan="6" class="mid">
                        <input type="button" value="保存" @click="regist()" />
                    </td>
                </tr>
            </table>
        </div>
    </template>

    <script setup>
        import {onMounted, reactive} from 'vue';
        import axios from 'axios';
        //backup01后台用的  =    0-立户 1-出生申报 2-夫妻投靠 3-父母投靠子女
        //title 前台的 populationId 存到哪个户口下
        const myProps = defineProps(['title','populationId','operate'])
        let form = reactive({
            name: undefined,
            sex: undefined,
            relation: undefined,
            birthday: undefined,
            idNumber: undefined,
            educationalLevel: undefined,
            marriage: undefined,
            militaryService: undefined,
            nation: undefined,
            bloodType: undefined,
            job: undefined,
            populationId: undefined,
            religiousBelief: undefined,
            operate:undefined
        })
        let form2=reactive({
            address: undefined,
            populationType:undefined,//户口类型,城镇 非城镇
            houseHolder:undefined//户主姓名,
            
        })
        //1,性别数据开始时置空
         let state =reactive({dictList:{}})
        function regist() {
        
        }
        onMounted(()=>{
             axios.get("http://localhost:8081/ssmstudy/constantType/findAll")
             .then(res=>{
                 state.dictList=res.data
             })
        })
    </script>
上一篇下一篇

猜你喜欢

热点阅读