美文网首页
2、常数项分类管理-常数项管理

2、常数项分类管理-常数项管理

作者: wqjcarnation | 来源:发表于2021-01-13 09:55 被阅读0次
    ## 常数项分类管理 前台ConstantTypeAdd.vue ##
    
    <template>
      <div>
        <h1>常数项类别添加</h1>
       <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
         <el-form-item label="类别编码" prop="constantTypeCode">
           <el-input v-model="ruleForm.constantTypeCode"></el-input>
         </el-form-item>
        <el-form-item label="类别名称" prop="name">
          <el-input v-model="ruleForm.constantTypeName"></el-input>
        </el-form-item>
         <el-form-item>
           <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
           <el-button @click="resetForm('ruleForm')">重置</el-button>
         </el-form-item>
       </el-form>
      </div>
    </template>
    
    <script>
      export default {
        data() {
          return {
            ruleForm: {
              constantTypeCode: '',//类别编码
              constantTypeName: ''//类别名称
            },
            rules: {
              constantTypeCode: [
                { required: true, message: '请输入类别编码', trigger: 'blur' },
                { min: 2, max: 64, message: '长度在 2 到 64 个字符', trigger: 'blur' }
              ],
              constantTypeName: [
                 { required: true, message: '请输入类别名称', trigger: 'blur' },
                 { min: 2, max: 64, message: '长度在 2 到 64 个字符', trigger: 'blur' }
               ]
            }
          };
        },
        methods: {
          submitForm(formName) {
            this.$refs[formName].validate((valid) => {
              if (valid) {//如果验证通过
               // alert('submit!');
    
                //把数据提交到后台 json方式
                this.$axios.post("http://localhost:8080/sys/constantType/add",this.ruleForm)
                .then(response=>{
                  //做响应的后处理
                  //alert(response.data);
                  if(response.data==0){
                    alert("添加成功");
                  }
                })
                .catch(error=>{
                  console.log(error);
                })
    
              } else {
                console.log('error submit!!');
                return false;
              }
            });
          },
          resetForm(formName) {
            this.$refs[formName].resetFields();
          }
        }
      }
    </script>
    

    常数项分类管理 后台

        @RestController
        @RequestMapping("/sys/constantType")
        public class ConstantTypeController {
            @Autowired
            IConstantTypeService service;
            @RequestMapping("add")
            public String save(@RequestBody ConstantType constantType){
                System.out.println("请求到达");
                int result=service.save(constantType);
                System.out.println("存库后的主键为:"+constantType.getId());
                if(result>0){
                    return "0";
                }else{
                    return "添加失败";
                }
            }
    

    }

    常数项管理 前台

    <template>
      <div>
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px" class="demo-ruleForm">
          <el-form-item label="所属常数类别">
            <el-select v-model="ruleForm.constantTypeID" placeholder="请选择常数类别">
              <!--需要从后台获取-->
              <el-option v-for="item in constantTypes"
              :key="item.id"
              :label="item.constantTypeName"
              :value="item.id">
              </el-option>
    
            </el-select>
          </el-form-item>
          <el-form-item label="常数项编码" prop="contantCode">
            <el-input v-model="ruleForm.contantCode"></el-input>
          </el-form-item>
          <el-form-item label="常数项名称" prop="constantName">
            <el-input v-model="ruleForm.constantName"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm('ruleForm')">立即创建</el-button>
            <el-button @click="resetForm('ruleForm')">重置</el-button>
          </el-form-item>
        </el-form>
    
      </div>
    </template>
    
    <script>
      export default {
        data() {
          return {
            ruleForm: {
              constantTypeID: '', //类别编码
              contantCode: '', //常数项编码
              constantName: '' //常数项名称
            },
            constantTypes:[],//定义一个空对象,用于接收后台查询到的常数项分类数据,用于下拉列表
            rules: {
              contantCode: [{
                  required: true,
                  message: '请输入类别编码',
                  trigger: 'blur'
                },
                {
                  min: 2,
                  max: 64,
                  message: '长度在 2 到 64 个字符',
                  trigger: 'blur'
                }
              ],
              constantName: [{
                  required: true,
                  message: '请输入类别名称',
                  trigger: 'blur'
                },
                {
                  min: 2,
                  max: 64,
                  message: '长度在 2 到 64 个字符',
                  trigger: 'blur'
                }
              ]
            }
          };
        },
        methods: {
          submitForm(formName) {
            this.$refs[formName].validate((valid) => {
              if (valid) { //如果验证通过
                // alert('submit!');
                
                //把数据提交到后台 json方式
                 
    
              } else {
                console.log('error submit!!');
                return false;
              }
            });
          },
          resetForm(formName) {
            this.$refs[formName].resetFields();
          }
        },
        mounted() {
          //请求后台获取常数项分类列表
          this.$axios.get("http://localhost:8080/sys/constantType/findAll")
          .then(res=>{
            this.constantTypes=res.data;
          })
        }
    
    
      }
    </script>
    

    后台略
    科室管理
    用户管理等略

    相关文章

      网友评论

          本文标题:2、常数项分类管理-常数项管理

          本文链接:https://www.haomeiwen.com/subject/dmfuaktx.html