🍅选题推荐——以防找不到我们,点击上方订阅专栏✌✌\
一、项目介绍
1.1 研究背景
现在大家正处于互联网加的时代,这个时代它就是一个信息内容无比丰富,信息处理与管理变得越加高效的网络化的时代,这个时代让大家的生活不仅变得更加地便利化,也让时间变得更加地宝贵化,因为每天的每分钟,每秒钟这些时间都能让人们处理大批量的日常事务,这些场景,是之前的手工模式无法与之相抗衡的。对于景点信息的管理来说,传统的通过纸质文档记录信息的方式已经落后了,依靠手工管理景点信息,不仅花费较长的工作时间,在对记录各种信息的文档进行信息查询以及信息核对操作时,也不能及时保证信息的准确性,基于这样的办公低效率环境下,对于景点信息的处理就要提出新的解决方案。因为这个时代的信息一直都在高速发展,要是不抱着发展的观念看待事情,极有可能被这个市场快速遗忘,甚至被无情地淘汰掉。所以尽早开发一款旅行体验交流平台进行信息的快速处理,既跟上了时代的发展脚步,也能让自己的核心竞争力有所提升。
1.2目的和意义
互联网加的时代一方面是加快信息的发展,另一方面也是对传统行业进行筛选,能够继续发展的,肯定是那些能够充分运用互联网技术进行自身升级改革的行业。那些停步不前的行业只能就此结束,进而被大家所遗忘。这次设计出来的旅行体验交流平台,它不仅能够让管理人员在信息增加,信息的编辑等事务处理上,节省很多的时间,也会砍掉一部分的人工成本,节省不必要开支的资金。另外,此系统的操作界面是可视化的界面,管理人员无需付费培训就能尽快上手。旅行体验交流平台的开发意义如下:
1、管理人员再也不用在查询信息上花费大量宝贵的时间了,通过信息关键词字段就可以在几秒内获取需要的信息,在各种突发事件面前管理人员也不用慌张,可以从容淡定地处理各种相关信息。
2、该系统在每天的24小时期间都是不会停止服务的,只要有信息操作的需要,管理人员都能使用常用的360浏览器,或者百度浏览器,或者谷歌浏览器,2345浏览器等大众浏览器都能登录系统,然后操作对应的功能。
3、有了这款信息管理类操作软件,所有需要进行处理的数据不用在纸质版本的文档上进行记载,而是基于电脑进行信息录入。
4、景点方面的信息都是通过网站进行显示,其实质是这些信息都保存在网站对应的数据库里面。只要操作员不去恶意删除信息,那么这些信息将会永久保存。
二、功能介绍
4.2系统功能结构设计
旅行体验交流平台针对管理员设置的功能有:添加并管理各种类型信息,管理用户账户信息,管理景点信息,管理旅游资讯信息等内容。
旅行体验交流平台针对用户设置的功能有:查看并修改个人信息,查看景点信息,查看旅游资讯信息等内容。




三、拦截器代码
package com.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
import com.interceptor.AuthorizationInterceptor;
@Configuration
public class InterceptorConfig extends WebMvcConfigurationSupport{
@Bean
public AuthorizationInterceptor getAuthorizationInterceptor() {
return new AuthorizationInterceptor();
}
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(getAuthorizationInterceptor()).addPathPatterns("/**").excludePathPatterns("/static/**");
super.addInterceptors(registry);
}
/**
* springboot 2.0配置WebMvcConfigurationSupport之后,会导致默认配置被覆盖,要访问静态资源需要重写addResourceHandlers方法
*/
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/**")
.addResourceLocations("classpath:/resources/")
.addResourceLocations("classpath:/static/")
.addResourceLocations("classpath:/admin/")
.addResourceLocations("classpath:/front/")
.addResourceLocations("classpath:/public/");
super.addResourceHandlers(registry);
}
}
个人中心代码
<template>
<div>
<el-form
class="detail-form-content"
ref="ruleForm"
:model="ruleForm"
label-width="80px"
>
<el-row>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='用户姓名' prop="yonghuName">
<el-input v-model="ruleForm.yonghuName" placeholder='用户姓名' clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='用户手机号' prop="yonghuPhone">
<el-input v-model="ruleForm.yonghuPhone" placeholder='用户手机号' clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='用户身份证号' prop="yonghuIdNumber">
<el-input v-model="ruleForm.yonghuIdNumber" placeholder='用户身份证号' clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='用户头像' prop="yonghuPhoto">
<file-upload
tip="点击上传照片"
action="file/upload"
:limit="3"
:multiple="true"
:fileUrls="ruleForm.yonghuPhoto?$base.url+ruleForm.yonghuPhoto:''"
@change="yonghuPhotoUploadChange"
></file-upload>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='电子邮箱' prop="yonghuEmail">
<el-input v-model="ruleForm.yonghuEmail" placeholder='电子邮箱' clearable></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item v-if="flag=='yonghu'" label='积分' prop="newMoney">
<el-input v-model="ruleForm.newMoney" placeholder='积分' disabled style="width: 100px"></el-input>
<!--<a id="btn-recharge" @click="chongzhi" href="javascript:void(0)">点我充值</a>-->
</el-form-item>
</el-col>
<el-form-item v-if="flag=='users'" label="用户名" prop="username">
<el-input v-model="ruleForm.username"
placeholder="用户名"></el-input>
</el-form-item>
<el-col :span="12">
<el-form-item v-if="flag!='users'" label="性别" prop="sexTypes">
<el-select v-model="ruleForm.sexTypes" placeholder="请选择性别">
<el-option
v-for="(item,index) in sexTypesOptions"
v-bind:key="item.codeIndex"
:label="item.indexName"
:value="item.codeIndex">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item>
<el-button type="primary" @click="onUpdateHandler">修 改</el-button>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template>
<script>
// 数字,邮件,手机,url,身份证校验
import { isNumber,isIntNumer,isEmail,isMobile,isPhone,isURL,checkIdCard } from "@/utils/validate";
export default {
data() {
return {
ruleForm: {},
flag: '',
usersFlag: false,
// sexTypesOptions : [],
// 注册表 用户
// 注册的类型字段 用户
// 性别
sexTypesOptions : [],
};
},
mounted() {
//获取当前登录用户的信息
var table = this.$storage.get("sessionTable");
this.sessionTable = this.$storage.get("sessionTable");
this.role = this.$storage.get("role");
if (this.role != "管理员"){
}
this.flag = table;
this.$http({
url: `${this.$storage.get("sessionTable")}/session`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.ruleForm = data.data;
// 注册表 用户
} else {
this.$message.error(data.msg);
}
});
// 注册表 用户 的级联表
this.$http({
url: `dictionary/page?page=1&limit=100&sort=&order=&dicCode=sex_types`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.sexTypesOptions = data.data.list;
} else {
this.$message.error(data.msg);
}
});
},
methods: {
chongzhi() {
this.$router.replace({ path: "/pay" });
},
yonghuPhotoUploadChange(fileUrls) {
this.ruleForm.yonghuPhoto = fileUrls;
},
onUpdateHandler() {
if((!this.ruleForm.yonghuName)&& 'yonghu'==this.flag){
this.$message.error('用户姓名不能为空');
return
}
if( 'yonghu' ==this.flag && this.ruleForm.yonghuPhone&&(!isMobile(this.ruleForm.yonghuPhone))){
this.$message.error(`手机应输入手机格式`);
return
}
if((!this.ruleForm.yonghuIdNumber)&& 'yonghu'==this.flag){
this.$message.error('用户身份证号不能为空');
return
}
if((!this.ruleForm.yonghuPhoto)&& 'yonghu'==this.flag){
this.$message.error('用户头像不能为空');
return
}
if( 'yonghu' ==this.flag && this.ruleForm.yonghuEmail&&(!isEmail(this.ruleForm.yonghuEmail))){
this.$message.error(`邮箱应输入邮箱格式`);
return
}
if((!this.ruleForm.sexTypes) && this.flag!='users'){
this.$message.error('性别不能为空');
return
}
if('users'==this.flag && this.ruleForm.username.trim().length<1) {
this.$message.error(`用户名不能为空`);
return
}
this.$http({
url: `${this.$storage.get("sessionTable")}/update`,
method: "post",
data: this.ruleForm
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "修改信息成功",
type: "success",
duration: 1500,
onClose: () => {
}
});
} else {
this.$message.error(data.msg);
}
});
}
}
};
</script>
<style lang="scss" scoped>
</style>
四、相关案例


1995

被折叠的 条评论
为什么被折叠?



