Compare commits

..

1 Commits

28 changed files with 202 additions and 2550 deletions

View File

@ -1,54 +0,0 @@
<p align=center>
Traffic 是一个前后端分离的机动车网上业务网站
</p>
## 项目选型
采用SpringBoot + Vue
## 网站功能
- 采用了时下流行的SpringBoot + Vue技术。
- MySQL严格的数据库规范设计。
## 环境依赖
| 环境依赖 | 说明描述 |
| ------------------------ | ----------------------------- |
| 软件基础环境 | 服务器(例:1 vCPU 2 GiB 1Mbps+域名(例kiwipeach.cn) ,注意这里的域名需要备案才能够访问喔|
| 数据库 | MySQL |
| JDK | 推荐使用jdk1.8及1.8以上的版本 |
| node | 前端需要使用node环境启动前端服务其中请求转发可以使用前端提供转发工具当然也可以使用nginx看具体部署条件。 |
## 主要功能预览
### 一、首页
![image](https://github.com/PhyQxx/traffic/assets/43107458/320e76b1-c6da-4585-8f4a-cd0e8762e546)
### 二、机动车违章信息查询
![image](https://github.com/PhyQxx/traffic/assets/43107458/2c344b3f-3401-4d9f-840a-b37100bb52ad)
### 三、机动车违章行为处理
![image](https://github.com/PhyQxx/traffic/assets/43107458/f86270de-6a94-44e3-a59c-9c5b7d7bb31f)
### 四、机动车报废信息查询
![image](https://github.com/PhyQxx/traffic/assets/43107458/95101401-72ef-416a-b9c8-5c881c70ebbb)
### 五、新车登记预选号牌
![image](https://github.com/PhyQxx/traffic/assets/43107458/f8828d14-dead-4916-b344-4788ab0b79a1)
### 六、二手车过户预选号牌
![image](https://github.com/PhyQxx/traffic/assets/43107458/c23b310c-abfd-4e7d-8096-df5c01c17e86)
### 七、在线留言
![image](https://github.com/PhyQxx/traffic/assets/43107458/63cd006a-dec3-469c-a8ae-73bfddc8a525)
### 八、办事指南
![image](https://github.com/PhyQxx/traffic/assets/43107458/dbb9ffc8-8119-4e64-94dd-cf48b89a0e2e)
### 九、注册
![image](https://github.com/PhyQxx/traffic/assets/43107458/f1a43034-54aa-4298-b0c0-73c0a9d9da34)
### 十、登录
![image](https://github.com/PhyQxx/traffic/assets/43107458/811f7804-4c6c-46e9-a0b2-1da46e314cd8)

View File

@ -18,94 +18,13 @@ public class trafficController {
@Autowired
trafficService trafficService;
/**用户注册**/
@RequestMapping(value = "/register", method = {RequestMethod.POST,RequestMethod.GET})
//登录验证
@RequestMapping(value = "/login", method = {RequestMethod.POST, RequestMethod.GET})
@ResponseBody
public Map<String,Object> register(@RequestBody Map<String,Object> param) {
Map<String,Object> result = null;
try {
result = trafficService.register(param);
} catch (Exception e) {
e.printStackTrace();
}
return result;
}
/**登录验证*/
@RequestMapping(value = "/logon", method = {RequestMethod.POST, RequestMethod.GET})
@ResponseBody
public Map<String,Object> login(@RequestBody Map<String,Object> param) {
public Map<String,Object> hello(@RequestBody Map<String,Object> param) {
Map<String,Object> result = new HashMap<>();
try {
result = trafficService.getUser(param);
} catch(Exception e){
e.printStackTrace();
}
result = trafficService.getUser();
return result;
}
/**获取首页内容*/
@RequestMapping(value = "/getAllContent", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> getAllContent(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.getAllContent(param);
return result;
}
/**查询违章处理*/
@RequestMapping(value = "/illegalTreatment", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> illegalTreatment(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.illegalTreatment(param);
return result;
}
/**处理违章处理*/
@RequestMapping(value = "/handle", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> handle(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.handle(param);
return result;
}
/**查询违章信息*/
@RequestMapping(value = "/getIllegalInfo", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> getIllegalInfo(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.getIllegalInfo(param);
return result;
}
/**新增车辆挂牌*/
@RequestMapping(value = "/insertPlateInfo", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> insertPlateInfo(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.insertPlateInfo(param);
return result;
}
/**查询车辆挂牌信息*/
@RequestMapping(value = "/selectPlateInfo", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> selectPlateInfo(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.selectPlateInfo(param);
return result;
}
/**查询留言*/
@RequestMapping(value = "/getLeaveMessage", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> getLeaveMessage(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.getLeaveMessage(param);
return result;
}
/**查询留言*/
@RequestMapping(value = "/insertLeaveMessage", method = {RequestMethod.POST,RequestMethod.GET})
@ResponseBody
public Map<String,Object> insertLeaveMessage(@RequestBody Map<String,Object> param) {
Map<String,Object> result = trafficService.insertLeaveMessage(param);
return result;
}
}

View File

@ -1,139 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.springboot.traffic.dao.trafficMapper">
<!--用户注册-->
<insert id="userRegister" parameterType="map">
insert into traffic_user(user_id,user_name,user_password,user_phone)
values
(
uuid(),
#{formName.name},
#{formName.pass},
#{formName.phone}
)
</insert>
<!--用户登录-->
<select id="getUser" parameterType="map" resultType="map">
select * from traffic_user where user_name = #{name} and user_password = #{pass}
select * from traffic_user
</select>
<select id="getSchoolNotice" parameterType="map" resultType="map">
SELECT
n.id,
title,
content,
user_id,
real_name,
create_time
FROM
traffic_notice n left join traffic_user u on n.create_id = u.user_id
where type = '信息公告'
and status = "1"
<if test="id != null and id != ''">
and s.id = #{id}
</if>
<if test="type != null and type != ''">
and label = #{label}
</if>
ORDER BY create_time desc
</select>
<!--获取家长建议-->
<select id="getParentAdvice" parameterType="map" resultType="map">
SELECT
n.id,
title,
content,
user_id,
real_name,
create_time
FROM
traffic_notice n left join traffic_user u on n.create_id = u.user_id
where type = '交通资讯'
and status = "1"
<if test="id != null and id != ''">
and s.id = #{id}
</if>
<if test="type != null and type != ''">
and label = #{label}
</if>
ORDER BY create_time desc
</select>
<!--获取学生想法-->
<select id="getStudentThinking" parameterType="map" resultType="map">
SELECT
n.id,
title,
content,
user_id,
real_name,
create_time
FROM
traffic_notice n left join traffic_user u on n.create_id = u.user_id
where type = '警示教育'
and status = "1"
<if test="id != null and id != ''">
and s.id = #{id}
</if>
<if test="type != null and type != ''">
and label = #{label}
</if>
ORDER BY create_time desc
</select>
<select id="illegalTreatment" resultType="map" parameterType="map">
SELECT
*
FROM
`traffic_illegal_info`
WHERE
number = #{number} and number_plate = #{numberPlate}
and engine_number = #{engine} and mobile = #{mobile}
</select>
<update id="handle" parameterType="map">
update traffic_illegal_info set status = '1' where id = #{id}
</update>
<select id="getIllegalInfo" resultType="map" parameterType="map">
SELECT
*
FROM
traffic_illegal_info
WHERE
plate_type = #{plateType} and number_plate = #{numberPlate}
and engine_number like CONCAT('%',#{engineNumber},'%')
and status = '0'
</select>
<select id="getScrapInfo" resultType="map" parameterType="map">
SELECT
*
FROM
traffic_scrap_info
WHERE
plate_type = #{plateType} and number_plate = #{numberPlate}
and engine_number like CONCAT('%',#{engineNumber},'%')
</select>
<insert id="insertPlateInfo" parameterType="map">
INSERT INTO traffic_plate_info ( id, create_id, create_time, plate_number, car_brand, qualified_no, car_size, car_type )
VALUES
( uuid(),#{createId},now(),#{plateNumber},#{carBrand},#{qualifiedNo},#{carSize},#{carType})
</insert>
<select id="selectPlateInfo" resultType="map" parameterType="map">
select * from traffic_plate_info left join traffic_user on create_id = user_id ORDER BY create_time desc
</select>
<select id="getLeaveMessage" resultType="map" parameterType="map">
SELECT * FROM `traffic_leave_message` left join traffic_user on create_id = user_id ORDER BY create_time desc
</select>
<insert id="insertLeaveMessage" parameterType="map">
INSERT INTO traffic_leave_message ( id,content, create_id, create_time)
VALUES
( uuid(),#{content},#{createId},now())
</insert>
</mapper>

View File

@ -7,49 +7,5 @@ import java.util.Map;
@Mapper
public interface trafficMapper {
/**
* 用户注册
* @param 用户名密码手机号
* @return 1注册成功 0注册失败
*/
int userRegister(Map<String, Object> param);
/**
* 用户登录
* @param 用户名密码
* @return 用户是否注册
*/
List<Map<String, Object>> getUser(Map<String, Object> param);
/**
* 获取信息公告
*/
List<Map<String,Object>> getSchoolNotice(Map<String,Object> param);
/**
* 获取交通资讯
*/
List<Map<String,Object>> getParentAdvice(Map<String,Object> param);
/**
* 获取警示教育
*/
List<Map<String,Object>> getStudentThinking(Map<String,Object> param);
List<Map<String, Object>> illegalTreatment(Map<String, Object> param);
int handle(Map<String, Object> param);
List<Map<String, Object>> getIllegalInfo(Map<String, Object> param);
List<Map<String, Object>> getScrapInfo(Map<String, Object> param);
int insertPlateInfo(Map<String, Object> param);
List<Map<String, Object>> selectPlateInfo(Map<String, Object> param);
List<Map<String, Object>> getLeaveMessage(Map<String, Object> param);
int insertLeaveMessage(Map<String, Object> param);
List<Map<String, Object>> getUser();
}

View File

@ -5,168 +5,21 @@ import com.springboot.traffic.service.trafficService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
@Service
public class trafficServiceImpl implements trafficService {
@Resource
@Autowired
trafficMapper trafficMapper;
/**
* 用户注册
* @param
* @return 成功与否数据
*/
@Override
public Map<String, Object> register(Map<String, Object> param) {
public Map<String, Object> getUser() {
Map<String,Object> result = new HashMap<>();
int res = 0;
try {
res = trafficMapper.userRegister(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success",true);
result.put("data",res);
return result;
}
/**
* 用户登录
* @param
* @return 用户是否注册
*/
@Override
public Map<String, Object> getUser(Map<String, Object> param) {
Map<String,Object> result = new HashMap<>();
List<Map<String,Object>> res = null;
try {
res = trafficMapper.getUser(param);
} catch(Exception e){
e.printStackTrace();
}
List<Map<String,Object>> res = trafficMapper.getUser();
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> getAllContent(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
Map<String,Object> res = new HashMap<>();
List<Map<String,Object>> schoolNoticeList = trafficMapper.getSchoolNotice(param);
res.put("schoolNoticeList",schoolNoticeList);
List<Map<String,Object>> parentAdvice = trafficMapper.getParentAdvice(param);
res.put("parentAdvice",parentAdvice);
List<Map<String,Object>> studentThinking = trafficMapper.getStudentThinking(param);
res.put("studentThinking",studentThinking);
result.put("data",res);
result.put("success",true);
return result;
}
@Override
public Map<String, Object> illegalTreatment(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
List<Map<String, Object>> res = null;
try {
res = trafficMapper.illegalTreatment(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> handle(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
int res = 0;
try {
res = trafficMapper.handle(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> getIllegalInfo(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
List<Map<String, Object>> res = null;
try {
if ("1".equals(param.get("status"))) {
res = trafficMapper.getScrapInfo(param);
} else {
res = trafficMapper.getIllegalInfo(param);
}
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> insertPlateInfo(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
int res = 0;
try {
res = trafficMapper.insertPlateInfo(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> selectPlateInfo(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
List<Map<String, Object>> res = null;
try {
res = trafficMapper.selectPlateInfo(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> getLeaveMessage(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
List<Map<String, Object>> res = null;
try {
res = trafficMapper.getLeaveMessage(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
@Override
public Map<String, Object> insertLeaveMessage(Map<String, Object> param) {
Map<String, Object> result = new HashMap<>();
int res = 0;
try {
res = trafficMapper.insertLeaveMessage(param);
} catch (Exception e) {
e.printStackTrace();
}
result.put("success", true);
result.put("data", res);
return result;
}
}

View File

@ -3,37 +3,9 @@ package com.springboot.traffic.service;
import java.util.Map;
public interface trafficService {
/**
* 用户注册
* @param 用户名密码手机号
* @return 成功与否数据
*
* @return
*/
Map<String, Object> register(Map<String, Object> param);
/**
* 用户登录
* @param 用户名密码
* @return 用户是否注册
*/
Map<String, Object> getUser(Map<String, Object> param);
/**
* 获取首页内容
*/
Map<String,Object> getAllContent(Map<String,Object> param);
Map<String, Object> illegalTreatment(Map<String, Object> param);
Map<String, Object> handle(Map<String, Object> param);
Map<String, Object> getIllegalInfo(Map<String, Object> param);
Map<String, Object> insertPlateInfo(Map<String, Object> param);
Map<String, Object> selectPlateInfo(Map<String, Object> param);
Map<String, Object> getLeaveMessage(Map<String, Object> param);
Map<String, Object> insertLeaveMessage(Map<String, Object> param);
Map<String, Object> getUser();
}

View File

@ -55,8 +55,7 @@ const devWebpackConfig = merge(baseWebpackConfig, {
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true,
favicon:path.resolve(__dirname, '../src/assets/img/favicon.ico'),
inject: true
}),
// copy custom static assets
new CopyWebpackPlugin([

View File

@ -3,10 +3,10 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>车辆违章管理系统</title>
<title>traffic</title>
</head>
<body>
<div id="app"></div>
<div id="app" overflow-y: overlay></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -43,6 +43,12 @@
}
}
},
"acorn-walk": {
"version": "6.2.0",
"resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-6.2.0.tgz",
"integrity": "sha512-7evsyfH1cLOCdAzZAd43Cic04yKydNx0cF+7tiA19p1XnLLPU4dpCQOqpjqwokFe//vS0QqfqqjCS2JkiIs0cA==",
"dev": true
},
"ajv": {
"version": "5.5.2",
"resolved": "https://registry.npmjs.org/ajv/-/ajv-5.5.2.tgz",
@ -1226,15 +1232,16 @@
"integrity": "sha1-3DQxT05nkxgJP8dgJyUl+UvyXBY=",
"dev": true
},
"bfj-node4": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/bfj-node4/-/bfj-node4-5.3.1.tgz",
"integrity": "sha512-SOmOsowQWfXc7ybFARsK3C4MCOWzERaOMV/Fl3Tgjs+5dJWyzo3oa127jL44eMbQiAN17J7SvAs2TRxEScTUmg==",
"bfj": {
"version": "6.1.2",
"resolved": "https://registry.npmjs.org/bfj/-/bfj-6.1.2.tgz",
"integrity": "sha512-BmBJa4Lip6BPRINSZ0BPEIfB1wUY/9rwbwvIHQA1KjX9om29B6id0wnWXq7m3bn5JrUVjeOTnVuhPT1FiHwPGw==",
"dev": true,
"requires": {
"bluebird": "^3.5.1",
"check-types": "^7.3.0",
"tryer": "^1.0.0"
"bluebird": "^3.5.5",
"check-types": "^8.0.3",
"hoopy": "^0.1.4",
"tryer": "^1.0.1"
}
},
"big.js": {
@ -1638,9 +1645,9 @@
}
},
"check-types": {
"version": "7.4.0",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-7.4.0.tgz",
"integrity": "sha512-YbulWHdfP99UfZ73NcUDlNJhEIDgm9Doq9GhpyXbF+7Aegi3CVV7qqMCKTTqJxlvEvnQBp9IA+dxsGN6xK/nSg==",
"version": "8.0.3",
"resolved": "https://registry.npmjs.org/check-types/-/check-types-8.0.3.tgz",
"integrity": "sha512-YpeKZngUmG65rLudJ4taU7VLkOCTMhNl/u4ctNC56LQS/zJTyNH0Lrtwm1tfTsbLlwvlfsA2d1c8vCf/Kh2KwQ==",
"dev": true
},
"chokidar": {
@ -4911,13 +4918,21 @@
"dev": true
},
"gzip-size": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-4.1.0.tgz",
"integrity": "sha1-iuCWJX6r59acRb4rZ8RIEk/7UXw=",
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/gzip-size/-/gzip-size-5.1.1.tgz",
"integrity": "sha512-FNHi6mmoHvs1mxZAds4PpdCS6QG8B4C1krxJsMutgxl5t3+GlRTzzI3NEkifXx2pVsOvJdOGSmIgDhQ55FwdPA==",
"dev": true,
"requires": {
"duplexer": "^0.1.1",
"pify": "^3.0.0"
"pify": "^4.0.1"
},
"dependencies": {
"pify": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
"integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
"dev": true
}
}
},
"handle-thing": {
@ -5047,6 +5062,12 @@
"os-tmpdir": "^1.0.1"
}
},
"hoopy": {
"version": "0.1.4",
"resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz",
"integrity": "sha512-HRcs+2mr52W0K+x8RzcLzuPPmVIKMSv97RGHy0Ea9y/mpcaK+xTrjICA04KAHi4GRzxliNqNJEFYWHghy3rSfQ==",
"dev": true
},
"hosted-git-info": {
"version": "2.8.8",
"resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-2.8.8.tgz",
@ -11451,23 +11472,38 @@
}
},
"webpack-bundle-analyzer": {
"version": "2.13.1",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-2.13.1.tgz",
"integrity": "sha512-rwxyfecTAxoarCC9VlHlIpfQCmmJ/qWD5bpbjkof+7HrNhTNZIwZITxN6CdlYL2axGmwNUQ+tFgcSOiNXMf/sQ==",
"version": "3.3.2",
"resolved": "https://registry.npmjs.org/webpack-bundle-analyzer/-/webpack-bundle-analyzer-3.3.2.tgz",
"integrity": "sha512-7qvJLPKB4rRWZGjVp5U1KEjwutbDHSKboAl0IfafnrdXMrgC0tOtZbQD6Rw0u4cmpgRN4O02Fc0t8eAT+FgGzA==",
"dev": true,
"requires": {
"acorn": "^5.3.0",
"bfj-node4": "^5.2.0",
"chalk": "^2.3.0",
"commander": "^2.13.0",
"ejs": "^2.5.7",
"express": "^4.16.2",
"filesize": "^3.5.11",
"gzip-size": "^4.1.0",
"lodash": "^4.17.4",
"acorn": "^6.0.7",
"acorn-walk": "^6.1.1",
"bfj": "^6.1.1",
"chalk": "^2.4.1",
"commander": "^2.18.0",
"ejs": "^2.6.1",
"express": "^4.16.3",
"filesize": "^3.6.1",
"gzip-size": "^5.0.0",
"lodash": "^4.17.10",
"mkdirp": "^0.5.1",
"opener": "^1.4.3",
"ws": "^4.0.0"
"opener": "^1.5.1",
"ws": "^6.0.0"
},
"dependencies": {
"acorn": {
"version": "6.4.1",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz",
"integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==",
"dev": true
},
"commander": {
"version": "2.20.3",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
"dev": true
}
}
},
"webpack-dev-middleware": {
@ -11828,13 +11864,12 @@
"dev": true
},
"ws": {
"version": "4.1.0",
"resolved": "https://registry.npmjs.org/ws/-/ws-4.1.0.tgz",
"integrity": "sha512-ZGh/8kF9rrRNffkLFV4AzhvooEclrOH0xaugmqGsIfFgOE/pIz4fMc4Ef+5HSQqTEug2S9JZIWDR47duDSLfaA==",
"version": "6.2.1",
"resolved": "https://registry.npmjs.org/ws/-/ws-6.2.1.tgz",
"integrity": "sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==",
"dev": true,
"requires": {
"async-limiter": "~1.0.0",
"safe-buffer": "~5.1.0"
"async-limiter": "~1.0.0"
}
},
"xtend": {

View File

@ -48,7 +48,7 @@
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-bundle-analyzer": "^3.3.2",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},

View File

@ -11,7 +11,5 @@ export default {
</script>
<style>
#app{
height: 100%;
}
</style>

View File

@ -2,9 +2,8 @@
import de from "element-ui/src/locale/lang/de";
// let root = 'http://192.168.10.29:8048'
//let root = 'http://123.57.22.91:8090'
// let root = 'http://123.57.22.91:8048'
let root = 'http://127.0.0.1:8090'
// let root = 'http://127.0.0.1:8090'
// 引用axios
let axios = require('axios')
// 自定义判断元素类型JS

View File

@ -1,22 +1,3 @@
html{
height: 100%;
overflow-y: overlay;
}
body{
height: 100%;
padding-right: 17px!important;
}
.pointer{
cursor: pointer;
}
.them-blue{
color: #409EFF;
}
.special-them-blue:hover{
color: #409EFF;
}
.over-text{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
overflow-x: hidden;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.9 KiB

View File

@ -0,0 +1,11 @@
<template>
<div>
<span>这是后台管理页面</span>
</div>
</template>
<script>
</script>
<style>
</style>

View File

@ -1,203 +1,9 @@
<template>
<div class="illegal">
<div class="title">机动车报废信息查询</div>
<el-form :model="illegalForm" label-position="left" :rules="illegalRules" ref="illegalForm" label-width="120px">
<el-form-item label="号牌种类" prop="species">
<el-select v-model="speciesValue" placeholder="请选择号牌种类" class="inbox">
<el-option
v-for="item in speciesOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="号牌号码" prop="number">
<el-select v-model="numberValue" placeholder="请输入号牌号码" class="queryBox">
<el-option
v-for="item in numberOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-input type="text" v-model="illegalForm.number" class="numberBox" placeholder="请输入号牌号码"></el-input>
</el-form-item>
<el-form-item label="发动机后六位" prop="lastsix">
<el-input type="text" v-model="illegalForm.lastsix" class="inbox" placeholder="请输入发动机后六位"></el-input>
</el-form-item>
<el-form-item label="请输入登录密码" prop="code">
<el-input type="password" v-model="illegalForm.code" class="inbox" placeholder="请输入登录密码"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('')">查询</el-button>
<el-button @click="resetForm('')">重置</el-button>
</el-form-item>
</el-form>
</div>
<span>这是机动车报废查询页面</span>
</template>
<script>
export default {
data() {
let plateValidate = (rule,value,callback) =>{
if (value === '') {
callback(new Error('请输入号牌号码'));
}
};
let numberValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入发动机号'));
}
};
let checkValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入验证码'));
}
};
return {
illegalForm: {
species:'',
number:'',
lastsix:'',
code:''
},
speciesOptions: [{
value: '大型汽车',
label: '大型汽车'
}, {
value: '小型汽车',
label: '小型汽车'
}, {
value: '教练汽车',
label: '教练汽车'
}, {
value: '教练摩托车',
label: '教练摩托车'
}, {
value: '大型新能源汽车',
label: '大型新能源汽车'
},{
value: '小型新能源汽车',
label: '小型新能源汽车'
}],
numberOptions: [{
value: '京',
label: '京'
}, {
value: '津',
label: '津'
}, {
value: '沪',
label: '沪'
}, {
value: '渝',
label: '渝'
}, {
value: '鲁',
label: '鲁'
}],
speciesValue: '',
numberValue: '',
illegalRules: {
number: [
{ validator: plateValidate, trigger: 'blur' }
],
lastsix: [
{ validator: numberValidate, trigger: 'blur' }
],
code: [
{ validator: checkValidate, trigger: 'blur' }
]
}
}
},
methods: {
submitForm() {
if (this.speciesValue === '') {
this.$message({
type:'warning',
message: '号牌种类不能为空'
})
} else if ( this.numberValue === '') {
this.$message({
type:'warning',
message: '号牌号码不能为空'
})
} else if ( this.illegalForm.number === '') {
this.$message({
type:'warning',
message: '号牌号码不能为空'
})
} else if ( this.illegalForm.lastsix === '') {
this.$message({
type:'warning',
message: '发动机号不能为空'
})
} else if ( this.illegalForm.code === '') {
this.$message({
type:'warning',
message: '登录密码不能为空'
})
} else if (this.illegalForm.code === JSON.parse(sessionStorage.getItem("userInfo")).user_password) {
this.$ajax.post("/traffic/getIllegalInfo",{status:"1",plateType: this.speciesValue,
numberPlate: this.numberValue+" "+this.illegalForm.number,engineNumber: this.illegalForm.lastsix},
r=>{
if (r.length === 0) {
this.$message.error("网络异常,请稍后再试")
} else if (r[0].scrap_time === ''){
this.$message({
type: "warning",
message: "该车辆暂无报废记录"
})
} else {
this.$alert(`号牌种类:${r[0].plate_type} 号牌号码:${r[0].number_plate}的车辆报废时间是${r[0].scrap_time}`, '机动车报废信息', {
confirmButtonText: '确定',
});
}
})
} else {
this.$message.error("登录密码不正确");
}
},
resetForm() {
this.speciesValue = '';
this.numberValue = '';
this.illegalForm.number = '';
this.illegalForm.lastsix = '';
this.illegalForm.code = '';
this.numberValue = '';
}
}
}
</script>
<style>
.illegal .title{
padding: 0 1rem 1rem 0;
font-weight: bold;
font-size: 1.2rem;
}
.illegal{
background: #FFFFFF;
padding: 1rem;
margin-top: 1.5rem;
}
.el-form {
width:50rem;
}
.inbox {
width: 30rem;
}
.queryBox {
width: 5rem;
}
.numberBox {
width: 24.7rem;
}
</style>

View File

@ -1,297 +1,9 @@
<template>
<div class="guide">
<el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick"></el-tree>
<div class="description">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>{{cardTitle}}</span>
</div>
<div v-for="o in 1" :key="o">
{{cardContent}}
</div>
</el-card>
</div>
</div>
<span>这是办事指南页面</span>
</template>
<script>
export default {
data() {
return {
data: [{
label: '1.总体介绍',
}, {
label: '2.用户注册',
children: [{
label: '注册用户综述'
}, {
label: '个人用户窗口注册'
}, {
label: '个人用户网上注册'
}, {
label: '单位用户窗口注册'
}]
}, {
label: '3.常见问题',
children: [{
label: '驾驶证申请'
}, {
label: '驾驶人考试'
}, {
label: '驾驶证使用'
}, {
label: '校车标牌及驾驶人'
}, {
label: '交通违法记分'
}, {
label: '服务群众措施'
}, {
label: '高速公路驾驶机动车'
}, {
label: '法律责任'
}]
}, {
label: '4.政策法规'
}],
cardTitle:'总体介绍',
cardContent:'互联网交通安全综合服务管理平台以下简称互联网服务平台采用网页、语音、短信、移动终端APP四种方式为广大交通参与者提供交管动态、安全宣传、警示教育以及交通管理信息查询、告知、业务预约/受理/办理、道路通行等便民利民服务。目前,已完成网页方式交管动态、安全宣传、警示教育,交通管理信息查询、告知、通报、抄告,交通管理业务预约/受理/办理服务,以及短信方式交通管理信息告知功能。其中,交通管理业务包括补换领机动车号牌、补换领机动车行驶证、补领机动车检验合格标志、预选机动车号牌、机动车安全技术检验预约、申领机动车临时行驶车号牌,补换领机动车驾驶证、考试预约、驾驶人身体条件证明提交、驾驶人延期换证/延期审验/延期提交身体条件证明,以及违法处理和违法罚款缴纳等。网上交通管理业务将随着公安机关交通管理部门业务保障机制建设进展,逐步向广大交通参与者提供。请广大交通参与者访问互联网服务平台获取最新服务信息。\\n" +\n' +
' "\\n" +\n' +
' "为提高服务水平和服务质量公安部申请了“12123”政府公益类服务短号码用于在全国范围内向广大交通参与者提供短信方式交通管理信息告知和语音方式交通管理信息咨询、业务办理等服务。下步公安部将抓紧开展语音服务中心、移动终端APP以及道路通行服务等建设应用工作。今后将陆续向广大交通参与者提供相应服务。敬请期待',
defaultProps: {
children: 'children',
label: 'label'
}
};
},
methods: {
handleNodeClick(data) {
let cardName = data.label;
console.log(cardName[0]);
if(cardName[0]==='1'||cardName[0]==='4'){
cardName = cardName.substring(2);
}
if(cardName[0]==='2'||cardName[0]==='3'){
return;
}
this.cardTitle = cardName;
if(cardName==="总体介绍"){
this.cardContent = "互联网交通安全综合服务管理平台以下简称互联网服务平台采用网页、语音、短信、移动终端APP四种方式为广大交通参与者提供交管动态、安全宣传、警示教育以及交通管理信息查询、告知、业务预约/受理/办理、道路通行等便民利民服务。目前,已完成网页方式交管动态、安全宣传、警示教育,交通管理信息查询、告知、通报、抄告,交通管理业务预约/受理/办理服务,以及短信方式交通管理信息告知功能。其中,交通管理业务包括补换领机动车号牌、补换领机动车行驶证、补领机动车检验合格标志、预选机动车号牌、机动车安全技术检验预约、申领机动车临时行驶车号牌,补换领机动车驾驶证、考试预约、驾驶人身体条件证明提交、驾驶人延期换证/延期审验/延期提交身体条件证明,以及违法处理和违法罚款缴纳等。网上交通管理业务将随着公安机关交通管理部门业务保障机制建设进展,逐步向广大交通参与者提供。请广大交通参与者访问互联网服务平台获取最新服务信息。\n" +
"\n" +
"为提高服务水平和服务质量公安部申请了“12123”政府公益类服务短号码用于在全国范围内向广大交通参与者提供短信方式交通管理信息告知和语音方式交通管理信息咨询、业务办理等服务。下步公安部将抓紧开展语音服务中心、移动终端APP以及道路通行服务等建设应用工作。今后将陆续向广大交通参与者提供相应服务。敬请期待"
}
if(cardName==="注册用户综述"){
this.cardContent = "1、注册用户包括个人用户和单位用户。个人用户包括“车主或驾驶人”、“初次申领机动车驾驶证的学员”、“新车车主”3类。单位用户包括道路运输企业、驾驶培训机构、汽车销售商、医院、学校等企事业单位以及道路运输管理部门、教育行政部门、安监部门等政府机关。\n" +
"\n" +
"2、个人用户账号全国唯一可以实现“本地注册→本地登录→部级登录→全国漫游”。单位用户账号本地唯一只能“本地注册→本地登录”。\n" +
"\n" +
"3、注册方式包括窗口注册和网上注册两种。个人用户可以选择到公安机关交通管理部门进行窗口注册或访问互联网服务平台进行网上注册。单位用户只能选择窗口注册。\n" +
"\n" +
"4、个人用户登录本地互联网服务平台后权限允许情况下可以网上获取本人本地机动车和驾驶证的状态和交通管理安全告知信息查询、机动车登记、驾驶证管理、违法处理异地机动车和驾驶证的状态查询服务。个人用户需要网上获取本人异地机动车和驾驶证的交通安全告知信息查询、机动车登记、驾驶证管理、违法处理服务的需要登录本地互联网服务平台后漫游至机动车登记地和驾驶证核发地互联网服务平台。其中网上获取违法处理服务时对于非机动车登记地发生的电子监控记录违法行为需要漫游至违法发生地互联网服务平台。\n" +
"\n" +
"5、单位用户登录本地互联网服务平台后可以网上获取《互联网单位用户注册/变更申请表》中选择的服务类型。"
}else if(cardName==="个人用户窗口注册"){
this.cardContent = "个人用户窗口注册时,携带本人身份证明,填写《互联网个人用户注册/变更申请表》,并提交《互联网个人用户注册/变更申请表》填写说明中要求的身份证明材料。个人用户提交注册申请后公安机关交通管理部门将在1个工作日内完成审核并通过短信方式将用户账号和密码发至个人用户注册时填写的手机号码。\n" +
"\n" +
"1、车主或驾驶人\n" +
"在本地拥有机动车或驾驶证的本地居民或在本地长期居住的非本地人,可以进行窗口注册。注册成功后,可以网上获取互联网服务平台所有本人本地机动车和驾驶证的状态和交通安全告知信息查询、机动车登记业务、驾驶证管理,本人、非本人的机动车违法处理等服务。\n" +
"\n" +
"2、初次申领机动车驾驶证的学员\n" +
"对于在本地没有机动车和驾驶证、已经在本地办理初次申领机动车驾驶证业务的学员,可以进行窗口注册。注册成功后,可以网上获取考试预约和预选机动车号牌服务。用户获取驾驶证后,将自动转为窗口注册驾驶人用户。\n" +
"\n" +
"3、新车车主\n" +
"对于在本地没有机动车和驾驶证、需要在本地办理新车注册登记业务的本地居民或在本地长期居住的非本地人,可以进行窗口注册。注册成功后,可以网上获取预选机动车号牌服务。用户完成新车注册登记业务后,将自动转为窗口注册车主用户。"
}else if(cardName==="个人用户网上注册"){
this.cardContent = "网上注册个人用户需要办理其他互联网业务、且符合前述窗口注册条件的,可以到窗口办理网上注册用户转窗口注册用户变更业务。\n" +
"\n" +
"1、车主或驾驶人\n" +
"拥有本地机动车或驾驶证、且在办理机动车登记业务或驾驶证申领业务时填写的手机号码与现有手机号码相同的个人用户,可以进行网上注册。网上注册成功后,可以网上获取本人机动车和驾驶证信息查询、违法处理和罚款缴纳、预选机动车号牌、考试预约及变更联系方式服务。\n" +
"\n" +
"2、初次申领机动车驾驶证的学员\n" +
"学员在本地办理初次申领驾驶证业务后,可以进行网上注册。网上注册成功后,可以网上获取考试预约和预选机动车号牌服务。用户获取驾驶证后,将自动转为网上注册驾驶人用户,或用户绑定本人机动车后,将自动转为网上注册机动车用户。在准考证明有效期内没有完成考试获取驾驶证,同时没有绑定本人机动车的个人用户,其用户账号将被自动取消。\n" +
"\n" +
"3、新车车主\n" +
"对于在全国范围内没有机动车和驾驶证、需要在本地办理新车注册登记业务的个人用户可以进行网上注册。网上注册成功后可以网上获取预选机动车号牌服务。注册成功后24小时内未预选机动车号牌或已预选机动车号牌但未在预选号牌有效期内到公安机关交通管理部门办理新车注册登记业务的其用户账号将被自动取消且不允许该身份证明号码在网上采用相同的手机号码注册新车车主用户。预选机动车号牌成功、到公安机关交通管理部门办理新车注册登记业务时如果填写的身份证明号码、姓名和手机号码与网上注册时填写的身份证明号码、姓名和手机号码不一致将不允许办理新车注册登记业务。用户完成新车注册登记业务后用户将自动转为网上注册车主用户。"
}else if(cardName==="单位用户窗口注册"){
this.cardContent = "1、单位用户窗口注册时需填写《互联网单位用户注册/变更申请表》,并提交《互联网单位用户注册/变更申请表》填写说明中要求的身份证明材料。单位用户提交注册申请后公安机关交通管理部门将当场完成审核、核发用户数字证书注册时单位类型选择”其他“时不核发数字证书并在1个工作日内通过短信方式将用户账号和密码发至注册时填写的申请人手机号码。\n" +
"\n" +
"2、单位用户网上业务包括“1、本单位本地营运机动车和驾驶人信息查询和通报”、“2、本单位本地校车和校车驾驶人信息查询和通报”、“3、本单位本地非营运机动车信息查询”、“4、本辖区营运机动车和驾驶人信息通报”、“5、本辖区校车和校车驾驶人信息通报”、“6、业务办理等其他服务”。\n" +
"\n" +
"3、道路运输企业可申请1、2、3业务驾驶培训机构、汽车销售商、医院可申请3、6业务学校可申请2、3业务道路运输管理部门、安监部门可申请3、4业务教育行政部门可申请3、5业务其他单位可申请3业务。\n" +
"\n" +
"4、所有单位用户账号均可以网上获取预选机动车号牌服务对于申请了6的汽车销售商单位用户可以网上获取机动车临时号牌核发服务对于申请了6的医院单位用户可以网上获取医院体检、提交身体条件证明服务对于申请了6的驾校单位用户可以网上获取本单位学员预约信息查询、学员预录入、学员用户窗口注册等服务。"
}else if(cardName==="驾驶证申请"){
this.cardContent = "1. 申请驾驶证对申请人年龄有什么具体要求?\n" +
"\n" +
" 答: 申请驾驶证最低年龄要求: 小型汽车、小型自动挡汽车、残疾人专用小型自动挡载客汽车、轮式自行机械车、低速载货汽车、三轮汽车、摩托车为18周岁城市公交车、大型货车、电车为20周岁中型客车为21周岁牵引车为24周岁大型客车为26岁。 最高年龄限制要求 小型汽车、小型自动挡汽车、残疾人专用小型自动挡载客汽车、轻便摩托车为70周岁低速载货汽车、普通摩托车、三轮汽车、轮式自行机械车为60周岁城市公交车及其他大中型客货车、电车为50周岁。 \n" +
"\n" +
"2. 申请人有吸食或注射毒品行为的能否申请驾驶证?\n" +
"\n" +
" 答:三年内有吸毒行为记录的,解除强制隔离戒毒措施不满三年的,或者长期服用依赖性精神药品成瘾尚未戒除的,不得申请驾驶证。公安交管部门在受理驾驶证申请时,会核查申请人是否有吸毒行为记录,审查医疗机构出具的身体条件证明。对三年内有吸毒行为记录以及解除强制隔离戒毒措施不满三年等情形的,将不予受理。同时,申请人在申请驾驶证时,应当如实申告是否具有以上不准申请的情形,并对申告内容的真实性负责。 \n" +
"\n" +
"3. 哪种违法犯罪行为将被终身禁驾?\n" +
"\n" +
" 答:一是造成交通事故后逃逸构成犯罪的,二是饮酒后或者醉酒驾驶机动车发生重大交通事故构成犯罪的。上述两种情形都是严重、恶性的违法行为,对公共安全危害大,导致人员伤亡或财产损失后果严重,需要追究刑事责任,因此规定终身不得再申请驾驶证。 \n" +
"\n" +
"4. 因饮酒后或醉酒驾驶被吊销驾驶证能否重新申请?\n" +
"\n" +
" 答因饮酒后驾驶营运机动车或者醉酒驾驶机动车依法被吊销驾驶证的5年内不得重新申领因醉酒驾驶营运机动车依法被吊销驾驶证的10年内不得重新申领。需要提醒的是饮酒后或者醉酒驾驶机动车发生重大交通事故构成犯罪的终身不得申请驾驶证。 \n" +
"\n" +
"5. 申请大中型客货车驾驶证有什么限制条件?\n" +
"\n" +
" 答取得大型客货车、牵引车、中型客车和大型货车驾驶证的驾驶人大部分驾驶营运车辆交通安全责任重大因此规定了更为严格的限制条件。一是对发生死亡交通事故负同等以上责任的或者有醉酒驾驶记录的终身不得申请大中型客货车驾驶证。二是对被处以吊销或者撤销驾驶证记录的10年内不得申请大中型客货车驾驶证。三是对有记满12分记录的5年内不得申请大型客车驾驶证3年内不得申请牵引车、中型客车驾驶证。 被吊销、撤销驾驶证的情形包括醉酒驾车、超速50%以上、驾驶拼装车或者报废车上路行驶、以欺骗、贿赂等不正当手段取得驾驶证的严重违法行为,均属主观故意行为,有必要对当事人再次申请驾驶证特别是大中型客货车驾驶证时采取更加严格的限制措施。 \n"
}else if(cardName==="驾驶人考试"){
this.cardContent = "1. 机动车驾驶人考试有什么主要变化?\n" +
"\n" +
" 答为增强考试的针对性和实用性确保更多小汽车驾驶人考试合格后能够独立驾车上路提高大中型客货车驾驶人应对复杂条件的能力139号令对小型汽车、大中型客货车的考试项目主要做了以下调整 科目一考试, 将原来的考试内容拆分为两部分,第一部分主要考核道路交通安全法律法规、交通信号、通行规则等知识,仍作为科目一;第二部分作为安全文明驾驶考试项目,在实际道路考试后进行,考核安全文明驾驶要求、复杂条件下的安全驾驶知识等。 科目二考试, 大中型客货车增加模拟高速公路、雨雾天、湿滑路、紧急情况处置等考试项目调整后由原来的“训练10项、考试6项”修改为“训练、考试均为16项”小型汽车取消桩考移库要求以及通过连续障碍、单边桥等现实生活中应用性不强的考试项目调整后由原来的“训练10项、考试4项”改为“训练和考试均为5项”即倒车入库、坡道定点停车与起步、侧方停车、曲线行驶、直角转弯。 科目三考试, 增加了加减挡位操作、路口左转弯、路口右转弯3个考试项目和安全文明驾驶常识考试。同时对于小型汽车抽取不少于20%进行夜间考试,不进行夜间考试的进行模拟夜间灯光使用考试。对大中型客货车增加山区、隧道、陡坡等复杂道路考试。另外,还明确了各种车型的考试里程。 \n" +
"\n" +
"2. 科目一考试具体有什么变化?\n" +
"\n" +
" 答考虑到学员考试科目一时基本没有实际驾驶操作经验安全文明驾驶等知识只能靠死记硬背难以深入理解、掌握并应用。139号令实施后科目一考试主要考核道路交通安全法律法规、交通信号、通行规则等最基本的知识将原科目一中有关安全文明驾驶要求、复杂条件下的安全驾驶技能、紧急情况下的临危处置等知识单列出来作为科目三中的安全文明驾驶常识考试项目放在实际道路驾驶考试后进行。科目一考试试卷由100道题目组成题型为判断题和单项选择题满分100分90分合格。公安部已经对现有的考试题库进行了修订并会同交通运输部制定发布了培训教学和考试大纲列出培训和考核目标、要点供培训机构培训教学时使用。 \n" +
"\n"
}else if(cardName==="驾驶证使用"){
this.cardContent = "1. 对大中型客货车驾驶人审验有哪些规定?\n" +
"\n" +
" 答:大型客车、牵引车、城市公交车、中型客车、大型货车驾驶人审验的情形包括两种:\n" +
"一是 每个记分周期结束后三十日内,应当到公安交管部门接受审验。但在一个记分周期内没有记分记录的,免予本记分周期的审验。审验时,驾驶人应当填表如实申报身体条件,不需要提交医疗机构出具的身体条件证明。\n" +
"二是 驾驶证转到异地或者有效期满换证时,应当到公安交管部门接受审验。审验时,驾驶人应当提交医疗机构出具的身体条件证明。\n" +
"需要提醒的是, 驾驶人没有按照规定参加审验仍驾驶机动车的公安交管部门将处200元以上500元以下罚款。部分大型客车、牵引车、城市公交车、中型客车、大型货车驾驶人如果没有驾驶大中型客货车需求的可以主动申请降为小型汽车驾驶证避免因逾期未审验受到相关的处罚。 \n" +
"\n" +
"2. 对小型汽车、摩托车等驾驶人审验有哪些规定?\n" +
"\n" +
" 答:小型汽车、摩托车等车型驾驶人审验的情形有两种:\n" +
"一是 发生交通事故造成人员死亡承担同等以上责任未被吊销驾驶证的,应当在记分周期结束后三十日内到公安交管部门接受审验;\n" +
"二是 驾驶证转到异地或者有效期满换证时,应当到公安交管部门接受审验。 需要提醒的是 驾驶人没有按照规定参加审验仍驾驶机动车的公安交管部门将处200元以上500元以下罚款。 \n" +
"\n" +
"3. 对驾驶人审验有哪些内容?\n" +
"\n" +
" 答公安交管部门将审验驾驶人的交通违法和事故处理、身体条件、违法记分和记满12分后参加学习教育等情况。大型客车、牵引车、城市公交车、中型客车、大型货车驾驶人有违法记分以及小型汽车、摩托车等车型驾驶人发生交通死亡事故承担同等以上责任未被吊销驾驶证的在接受审验时应当参加不少于三小时的道路交通安全法律法规、交通安全文明驾驶、应急处置等知识学习并接受交通事故案例警示教育。 \n" +
"\n" +
"4. 驾驶证转入换证时已审验的,记分周期结束后是否还需要再审验?\n" +
"\n" +
" 答:驾驶人办理转入换证时应当按照规定参加审验。转入后在本记分周期结束前,大中型客货车驾驶人产生新记分的,以及其他车型驾驶人发生死亡事故负同等以上责任的,应当在记分周期结束后三十日内再次参加审验。在办理转入换证审验时已经参加学习教育的,再次审验时不需要参加学习教育。 \n" +
"\n" +
"5. 大中型客货车驾驶人在139号令实施前的记分是否作为参加审验的依据\n" +
"\n" +
" 答按照法律不溯及既往的原则2013年1月1日之前发生违法行为及记分不作为是否参加审验的依据。2013年1月1日之后发生的违法行为及记分作为是否参加审验的依据。 \n"
}else if(cardName==="校车标牌及驾驶人"){
this.cardContent = "1. 申请校车驾驶许可需要满足那些条件?\n" +
"\n" +
" 答校车安全运行关系学生上下学安全社会影响大校车驾驶人需要具备更高的安全驾驶意识、技能。根据《校车安全管理条例》和139号令规定申请校车驾驶资格应具备6项条件\n" +
"一是 取得相应准驾车型驾驶证并具有三年以上驾驶经历年龄在25周岁以上、不超过60周岁\n" +
"二是 最近连续三个记分周期内没有被记满分记录;\n" +
"三是 无致人死亡或者重伤的交通事故责任记录; 四是 无酒后驾驶或者醉酒驾驶机动车记录,最近一年内无驾驶客运车辆超员、超速等严重交通违法行为记录; 五是 无犯罪记录; 六是 身心健康,无传染性疾病,无癫痫病、精神病等可能危及行车安全的疾病病史,无酗酒、吸毒行为记录。\n" +
"需要提醒的是, 凡是年龄条件不符合要求、有记满12分记录以及其他不符合校车驾驶资格申请条件的将取消驾驶人的校车驾驶资格。 \n" +
"\n" +
"2. 如何申请校车驾驶资格?\n" +
"\n" +
" 答符合规定条件的驾驶人可以向所在县级或者设区的市级公安交管部门提出申请填写申请表并提交4项申请材料填写申请表并提交以下证明\n" +
"(一)申请人的身份证明;\n" +
"(二)机动车驾驶证;\n" +
"(三)户籍所在地县级公安机关出具的无犯罪、吸毒行为记录证明;\n" +
"(四)县级或者部队团级以上医疗机构出具的有关身体条件的证明。"
}else if(cardName==="交通违法记分"){
this.cardContent = "1. 在高速公路上驾车哪些违法行为一次记12分\n" +
"\n" +
" 答与在普通公路上驾车相比高速公路车速快、路况更加复杂一旦发生事故导致的后果严重。因此公安部123令针对高速公路特殊性制定更加严格的记分规定记12分的情形有\n" +
"一是 在高速公路上倒车、逆行、穿越中央分隔带掉头的。\n" +
"二是 驾驶营运客车在高速公路车道内停车的。\n" +
"三是 驾驶中型以上载客载货汽车、校车、危险物品运输车辆超过规定时速20%以上的。 \n" +
"\n" +
"2. 驾驶营运车辆有交通违法行为如何记分?\n" +
"\n" +
" 答营运车辆一般是长时间、高频率地在道路上行驶而且载客载货数量多一旦发生事故往往造成重大人员财产损失驾驶人需要承担的社会责任重大。因此公安部139号令针对驾驶营运车辆违法规定了更加严格的记分规定\n" +
"一是 一次记12分的情形有驾驶营运客车不包括公共汽车超过核定人数20以上的驾驶营运客车在高速公路车道内停车的。\n" +
"二是 一次记6分的情形有驾驶营运客车不包括公共汽车超过核定人数未达20驾驶货车载物超过核定载质量30%以上或者违反规定载客的。对营运车辆驾驶人其他交通违法行为的记分,依照《道路交通安全违法行为记分分值》的有关规定执行。 \n" +
"\n" +
"3. 对超速行驶违法行为如何记分?\n" +
"\n" +
" 答超速行驶是严重的交通违法行为之一危险系数高一旦发生事故造成的后果极其严重是近年来全国公安交管部门重点整治的严重交通违法行为。公安部139号令对超速驾驶制定了严格的记分规定。\n" +
"一是 超速驾驶一次记12分的情形有驾驶中型以上载客载货汽车、校车、危险物品运输车辆在高速公路、城市快速路上行驶超过规定时速20以上或者在高速公路、城市快速路以外的道路上行驶超过规定时速50以上驾驶其他机动车行驶超过规定时速50%以上的。\n" +
"二是 一次记6分的情形有驾驶中型以上载客载货汽车、校车、危险物品运输车辆在高速公路、城市快速路上行驶超过规定时速未达20驾驶中型以上载客载货汽车、校车、危险物品运输车辆在高速公路、城市快速路以外的道路上行驶或者驾驶其他机动车行驶超过规定时速20%以上未达到50%的。\n" +
"三是 一次记3分的情形有驾驶中型以上载客载货汽车、危险物品运输车辆在高速公路、城市快速路以外的道路上行驶或者驾驶其他机动车行驶超过规定时速未达20%的。 \n" +
"\n"
}else if(cardName==="服务群众措施"){
this.cardContent = "1. 在异地申请办理驾驶证审验和机动车检验有什么要求?\n" +
"\n" +
" 答目前随着物流业的迅速发展很多营运驾驶人和货运车辆长期不在登记地从事道路运输活动在驾驶证或者车辆临近检验期限时需要从营运地返回登记地办理审验业务。为方便群众就近办理业务139号令规定将在异地从事营运的驾驶人和货运车辆纳入营运地管辖营运驾驶人和货运车辆所有人首先要向营运地公安交管部门申请备案登记并填报包括营运企业、手机号码等基本信息公安交管部门将根据这些基本信息开展提示服务和日常教育。在办理备案登记满一年后可以在营运地直接办理驾驶证审验和机动车检验。\n" +
"需要提醒的是, 备案登记制度只适用于营运驾驶人和货运车辆。对于非营运的小型车辆,机动车所有人可以向登记地车辆管理所申请在异地进行检验。 \n" +
"\n" +
"2. 驾驶证丢失后补领需要多长时间?\n" +
"\n" +
" 答139号令实施后对驾驶证遗失或损坏的驾驶人在申请办理补换证的1日内即可领取到新的驾驶证。此前车辆管理所办理核发和补换领驾驶证业务的时限均为3日。近年来随着车辆管理所内部管理更加规范机动车登记和驾驶证管理系统等网络和技术手段的不断完善以及车辆管理所工作岗位的优化调整在更短时限内办理这些业务的条件已经具备。将核发和补换领驾驶证的时限缩短为1日方便丢失驾驶证的申请人能够及时补领到驾驶证。 \n" +
"\n" +
"3. 在县级车管所能否参加驾驶证考试和审验?\n" +
"\n" +
" 答:县级车管所可以办理低速载货汽车、三轮汽车、摩托车驾驶证考试,以及全部类型驾驶证的补证、换证、审验等业务。对于具备了相应考试场地、设备、路线和考试员等条件的,也可以直接受理小型汽车、小型自动挡汽车、残疾人自动挡载客汽车驾驶证全部科目的考试,以及其他类型驾驶证的道路交通安全法律、法规和相关知识考试。由于受经济发展条件影响,各地县级车管所基础条件、警力配置等差异较大,具体的业务范围和办理条件由省级公安交管部门根据当地实际情况确定。 \n" +
"\n" +
"4. 如何查询办理驾驶证业务需要提交的材料和要求?\n" +
"\n" +
" 答:目前,公安交管部门主要通过三种途径公示业务办理需要提交的材料、表格、条件、依据、程序以及收费标准等事项。\n" +
"一是 在车管所、交通服务站等办公场所公示业务办理事项,设立业务导办台,方便申请人咨询;\n" +
"二是 省级、市级公安交管部门通过互联网主页发布信息,便于申请人在网上查阅有关规定、驾驶证记分等信息,下载有关表格;\n" +
"三是 一些公安交管部门还开通了车管电话服务热线,供群众咨询,并受理部分业务。 "
}else if(cardName==="高速公路驾驶机动车"){
this.cardContent = "1. 驾驶人实习期内驾驶机动车上高速公路有什么规定?\n" +
"\n" +
" 答2004年5月1日《道路交通安全法》实施以前禁止驾驶人实习期内驾驶机动车上高速公路行驶。考虑到进入新世纪我国高速公路路网建设速度加快以及个人拥有的机动车保有量不断增多群众自驾出行越来越多很多驾驶人在实习期内都要出行特别是自驾游等中长途出行需要在高速公路上驾车行驶《道路交通安全法》实施以后不再限制驾驶人实习期上高速公路行驶。但从驾驶人实习期在高速公路驾车发生的事故看很大一部分是由于驾驶技能不高、经验不足引发的139号令借鉴了国外的做法规定驾驶人在实习期内驾驶机动车上高速公路行驶应当由持相应或者更高准驾车型驾驶证三年以上的驾驶人陪同。其中驾驶残疾人专用小型自动挡载客汽车的可以由持有小型自动挡载客汽车以上准驾车型驾驶证的驾驶人陪同。不过在增加准驾车型后的实习期内驾驶原准驾车型的机动车时不受上述限制。 \n" +
"\n" +
"2. 公安交管部门将如何检查驾驶人实习期内驾驶机动车上高速公路是否有陪驾?\n" +
"\n" +
" 答法律的实施需要国家强制力保障但更多需要公民自觉守法。落实驾驶人在实习期内驾驶机动车上高速公路行驶应当由持相应或者更高准驾车型驾驶证三年以上驾驶人陪同的规定同样靠驾驶人的自觉遵守。公安交管部门主要依托高速公路收费站、出入口、服务区等进行抽查发现处于实习期且无相应或者更高准驾车型驾驶证三年以上驾驶人陪同的已经或正在高速公路上行驶的公安交管部门将按照139号令规定对驾驶人处20元以上200元以下罚款并责令就近驶离高速公路正准备进入高速公路的教育后劝返。 \n" +
"\n" +
"3. 实习期驾驶人在高速公路发生事故后,陪同驾驶人员是否需要承担责任?\n" +
"\n" +
" 答实习期驾驶人驾驶机动车在高速公路上发生道路交通事故的公安交管部门将根据调查证实的实习期驾驶人的交通违法及过错认定事故责任。如果有证据证明陪同的驾驶人强迫实习期驾驶人违反道路交通安全法律、法规和机动车安全驾驶要求驾驶机动车造成交通事故陪同驾驶人应承担事故相应责任。对于尚不构成犯罪的按照《道路交通安全法》第九十九条规定对陪同人员处以200元以上2000元以下罚款构成犯罪的依法追究刑事责任。 \n" +
"\n"
}else if(cardName==="法律责任"){
this.cardContent = "1. 申请人在申领驾驶证中有隐瞒、欺骗等行为的,有什么法律后果?\n" +
"\n" +
" 答根据《行政许可法》行政许可申请人有如实申告有关事项的法律义务。驾驶机动车事关广大交通参与者的出行安全驾驶证申请人要如实申告自己的年龄条件、身体条件参加规定的考试通过后方可取得驾驶证。139号令规定申请人申领驾驶证时如果有隐瞒、欺骗、贿赂等行为的公安交管部门要立即终止办理该申请人的业务在计算机系统中记录该申请人在一年内不得再次申领驾驶证。隐瞒、欺骗、贿赂等行为包括提供伪造身份证、体检证明等虚假材料隐瞒自己有器质性心脏病、癫痫病、美尼尔症等妨碍安全驾驶的疾病隐瞒自己有三年内有吸毒行为或者解除强制隔离戒毒措施未满三年等不允许申请驾驶证的情形考试中有贿赂、舞弊等行为。如果申请人已经取得了驾驶证公安交管部门将撤销驾驶许可收缴驾驶证申请人在三年内不得再次申领驾驶证。\n" +
"需要提醒的是, 《机动车驾驶证申请表》和《驾驶人身体条件证明》上均有相关的提示信息,请驾驶证申请人如实填写申请表格,如实提供申请材料,严格参加相关考试。 \n" +
"\n" +
"2. 驾驶人违反实习期管理规定,有哪些处罚?\n" +
"\n" +
" 答:实习期驾驶人违反实习期管理规定的情形主要有三种:\n" +
"一是 在实习期内驾驶公共汽车、营运客车或者执行任务的警车、消防车、救护车、工程救险车以及载有爆炸物品、易燃易爆化学物品、剧毒或者放射性等危险物品的机动车,或者驾驶机动车牵引挂车。这些车辆有的属于公共交通工具,有的属于特种车辆、危险品运输车辆,公共安全责任重大,《道路交通安全法实施条例》规定实习期驾驶人不得驾驶。\n" +
"二是 在实习期内驾驶机动车上高速公路行驶时,没有持相应或更高以上车型驾驶证三年以上的驾驶人陪同指导。\n" +
"三是 未按规定粘贴、悬挂实习标志。如果实习期驾驶人有上述情形之一的公安交管部门将处以20元以上200元以下罚款。 \n" +
"\n" +
"3. 对伪造、变造驾驶证的有哪些处罚?\n" +
"\n" +
" 答伪造、变造驾驶证是一种严重的交通违法行为。2011年4月22日全国人大常委会关于修改《道路交通安全法》的决定对伪造、变造驾驶证的违法行为加重了处罚力度。139号令根据法律规定明确伪造、变造或者使用伪造、变造的驾驶证的由公安交管部门予以收缴处十五日以下拘留并处2000元以上5000元以下罚款构成犯罪的依法追究刑事责任。无论是自己伪造、变造驾驶证还是使用伪造、变造的驾驶证都要按照上述规定予以处罚。其中伪造、变造驾驶证构成犯罪的将按照伪造、变造国家机关公文、证件、印章罪追究刑事责任。 \n" +
"\n"
}else if(cardName==="政策法规"){
this.cardContent = "《中华人民共和国道路交通安全法》"
}
}
}
};
</script>
<style>
.guide{
margin-top: 1.5rem;
}
.el-tree {
width: 18rem;
float:left;
height: 26rem
}
.box-card{
width:71rem;
margin-left:20rem;
height: 26rem
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<div class="gridPanel">
<div class="gridpanel">
<div class="change">
<el-carousel :interval="2000" type="card">
<el-carousel :interval="10000000000000" type="card" width="500px">
<el-carousel-item>
<img src="../assets/img/lunbo0.jpg"/>
</el-carousel-item>
@ -22,138 +22,75 @@
</el-carousel-item>
</el-carousel>
</div>
<div class="tab">
<div class="one">
<div class="title">信息公告</div>
<div class="list">
<div class="list-one pointer special-them-blue over-text" v-for="item in newestNotice" @click="getContent(item)">
{{item.title}}
</div>
</div>
</div>
<div class="one">
<div class="title">交通资讯</div>
<div class="list">
<div class="list-one pointer special-them-blue over-text" v-for="item in goodAdvice" @click="getContent(item)">
{{item.title}}
</div>
</div>
</div>
<div class="one">
<div class="title">警示教育</div>
<div class="list">
<div class="list-one pointer special-them-blue over-text" v-for="item in magicalThinking" @click="getContent(item)">
{{item.title}}
</div>
</div>
</div>
<div class="gridtitle">
<div class="announce">信息公告<br></div>
<div class="information">交通资讯<br></div>
<div class="information">警示教育<br></div>
</div>
<el-row :gutter="120" class="gridcontent">
<el-col :span="8">
<div class="grid-content">
<el-link href="">机动车号牌旧牌未收回作废公告</el-link><br/>
<el-link href="">机动车登记证书旧证书未收回作废公告</el-link><br/>
<el-link href="">机动车号牌未收回作废公告</el-link><br/>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<el-link href="">5月9日至5月15日出行提示</el-link><br/>
<el-link href="">关于对本市部分检测场因降雨暂停验车的通知</el-link><br/>
<el-link href="">疫情期间未按时验车会被处罚吗</el-link><br/>
</div>
</el-col>
<el-col :span="8">
<div class="grid-content">
<el-link href="">我怎么多了几起违法记录不是我开的呀</el-link><br/>
<el-link href="">12万快递小哥同上交通安全课</el-link><br/>
<el-link href="">车辆进入东城区××停车场车主我在家呢啊</el-link><br/>
</div>
</el-col>
</el-row>
</div>
</template>
<script>
export default{
data() {
return{
newestNotice: [],
goodAdvice: [],
magicalThinking: []
}
},
mounted() {
this.getAll();
this.getName();
},
methods:{
getAll() {
this.$ajax.post("/traffic/getAllContent",{},r=>{
this.newestNotice = r.schoolNoticeList.slice(0,6);
this.goodAdvice = r.parentAdvice.slice(0,6);
this.magicalThinking = r.studentThinking.slice(0,6);
getName() {
this.$ajax.post("/traffic/login",{},r=>{
console.log(r)
})
},
getContent(one) {
this.$router.push({
name: 'noticecontent'
});
sessionStorage.setItem("noticeContent",JSON.stringify(one));
}
}
}
</script>
<style>
.one .title{
padding: 1rem;
border-bottom: 1px solid #EEEEEE;
font-size: 1.2rem;
font-weight: bold;
}
.one .list{
padding: 0.5rem 1rem 1rem 1rem;
}
.list .list-one{
width: 20rem;
height: 2rem;
line-height: 2rem;
}
.tab{
display: flex;
width: 80%;
margin: 1rem auto;
}
.tab .one{
border-radius: 5px;
flex: 1;
background: #FFFFFF;
}
.tab .one:nth-child(2){
margin: 0 1rem;
}
.change {
border-radius: 5px;
padding-top: 3rem;
background: #fff;
margin-top: 1.5rem;
}
.el-carousel {
width: 90rem;
margin: 0 auto;
}
.el-carousel__item img{
width: 100% !important;
}
.gridTitle {
width: 90rem;
height: 2.5rem;
margin: 0 auto;
}
.announce {
margin-top: 1rem;
width: 20rem;
float: left;
}
.information {
margin-top: 1rem;
width: 20rem;
float: left;
margin-left: 13.2rem;
}
.gridContent {
width: 90rem;
margin: 0 auto !important;
.gridtitle {
width: 100%;
height:2.5rem;
}
.grid-content {
background: #ffffff;
border-radius: 4px;
height: 20rem;
height: 150px;
}
.grid-first {
padding: 0 5rem 0 0 !important;
.announce {
width: 21.875rem;
float: left;
}
grid-second {
padding: 0 2.5rem !important;
.information {
width: 21.875rem;
float: left;
margin-left: 7.5rem;
}
.grid-other {
padding:0 0 0 5rem !important;
.gridcontent {
margin-top: 0.5rem;
}
</style>

View File

@ -1,237 +1,9 @@
<template>
<div class="illprocess">
<div class="title">机动车违章行为处理</div>
<el-form :model="illegalForm" label-position="left" :rules="illegalRules" ref="illegalForm" label-width="100px">
<el-form-item label="处罚书编号" prop="num">
<el-input type="text" v-model="illegalForm.num" class="inbox" placeholder="请输入处罚书编号"></el-input>
</el-form-item>
<el-form-item label="号牌号码" prop="number">
<el-select v-model="numberValue" placeholder="请输入" class="queryBox">
<el-option
v-for="item in numberOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-input type="text" v-model="illegalForm.number" class="numberBox" placeholder="请输入号牌号码"></el-input>
</el-form-item>
<el-form-item label="发动机号" prop="serial">
<el-input type="text" v-model="illegalForm.serial" class="inbox" placeholder="请输入发动机号"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="phone">
<el-input type="text" v-model="illegalForm.phone" class="inbox" placeholder="请输入手机号"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">处理</el-button>
<el-button @click="resetForm">重置</el-button>
</el-form-item>
</el-form>
<el-dialog
title="提示"
:visible.sync="dialogVisible1"
width="30%">
<div id="qrcode" ></div>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel"> </el-button>
<el-button type="primary" @click="submit"> </el-button>
</span>
</el-dialog>
</div>
<span>这是违章处理页面</span>
</template>
<script>
import QRCode from "qrcodejs2"
export default {
data() {
let numValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入处罚决定书编号'));
}
};
let numberValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入号牌号码'));
}
};
let serialValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入发动机号'));
}
};
let phoneValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入手机号码'));
} else if(!(/^1[34578]\d{9}$/).test(this.registerForm.phone)){
callback(new Error('手机号码格式不正确!'))
}
};
return {
one: '',
link: '',
dialogVisible1: false,
illegalForm: {
num: '',
number: '',
serial: '',
phone: ''
},
numberOptions: [{
value: '京',
label: '京'
}, {
value: '津',
label: '津'
}, {
value: '沪',
label: '沪'
}, {
value: '渝',
label: '渝'
}, {
value: '鲁',
label: '鲁'
}],
numberValue: '',
illegalRules: {
num: [
{ validator: numValidate, trigger: 'blur' }
],
number: [
{ validator: numberValidate, trigger: 'blur' }
],
serial: [
{ validator: serialValidate, trigger: 'blur' }
],
phone: [
{ validator: phoneValidate, trigger: 'blur' }
]
}
}
},
methods: {
resetForm() {
this.illegalForm.num = '';
this.illegalForm.number = '';
this.illegalForm.serial = '';
this.illegalForm.phone = '';
this.numberValue = '';
},
cancel() {
location.reload()
},
submit() {
this.$ajax.post("/traffic/handle",{id: this.one.id},r=>{
if (r === '0') {
this.$message.error("网络异常,请稍后再试")
} else {
this.$message({
type: 'success',
message: '处理成功'
});
setTimeout(()=>{location.reload()},500);
}
})
},
submitForm() {
if (this.illegalForm.num === '') {
this.$message({
type: 'warning',
message: "处罚书编号不能为空"
})
} else if (this.numberValue === '') {
this.$message({
type: 'warning',
message: "号牌号码不能为空"
})
} else if (this.illegalForm.number === '') {
this.$message({
type: 'warning',
message: "号牌号码不能为空"
})
} else if (this.illegalForm.serial === '') {
this.$message({
type: 'warning',
message: "发动机号不能为空"
})
} else if (this.illegalForm.phone === '') {
this.$message({
type: 'warning',
message: "手机号不能为空"
})
} else {
this.$ajax.post("/traffic/illegalTreatment",{number:this.illegalForm.num,
numberPlate:this.numberValue+this.illegalForm.number,engine:this.illegalForm.serial,
mobile:this.illegalForm.phone},r=>{
if (r.length === 0) {
this.$message({
type: 'warning',
message: '没有该违章记录'
})
} else if (r[0].status === '1') {
this.$message({
type: 'warning',
message: '该违章记录已处理'
})
} else {
this.one = r[0];
this.link = r[0].content;
this.dialogVisible1 = true;
this.$nextTick (function () {
this.qrcode();
})
}
});
}
},
//
qrcode () {
let that = this;
let qrcode = new QRCode('qrcode', {
width: 124,
height: 124, //
text: this.link, //
// render: 'table' , // tablecanvascanvas
// background: '#f0f', //
// foreground: '#ff0' //
})
}
},
components: { QRCode }
}
</script>
<style>
#qrcode{
width: 124px;
margin: 0 auto;
}
.illprocess .title{
padding: 0 1rem 1rem 0;
font-weight: bold;
font-size: 1.2rem;
}
.illprocess{
background: #FFFFFF;
padding: 1rem;
margin-top: 1.5rem;
}
.el-form {
width:50rem;
}
.inbox {
width: 30rem;
}
.queryBox {
width: 5rem;
}
.numberBox {
width: 24.7rem;
}
</style>

View File

@ -1,271 +1,9 @@
<template>
<div class="illegal">
<div class="title">机动车违章信息查询</div>
<el-form :model="illegalForm" label-position="left" :rules="illegalRules" ref="illegalForm" label-width="120px">
<el-form-item label="号牌种类" prop="species">
<el-select v-model="speciesValue" placeholder="请选择号牌种类" class="inbox">
<el-option
v-for="item in speciesOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="号牌号码" prop="number">
<el-select v-model="numberValue" placeholder="请输入号牌号码" class="queryBox">
<el-option
v-for="item in numberOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-input type="text" v-model="illegalForm.number" class="numberBox" placeholder="请输入号牌号码"></el-input>
</el-form-item>
<el-form-item label="发动机后六位" prop="lastsix">
<el-input type="text" v-model="illegalForm.lastsix" class="inbox" placeholder="请输入发动机后六位"></el-input>
</el-form-item>
<el-form-item label="请输入登录密码" prop="code">
<el-input type="password" v-model="illegalForm.code" class="inbox" placeholder="请输入登录密码"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">查询</el-button>
<el-button @click="resetForm">重置</el-button>
</el-form-item>
</el-form>
<el-dialog
title="机动车违章信息"
:visible.sync="dialogVisible2"
width="60%">
<div class="content">
<div class="header">
<div class="number-plate">号牌号码</div>
<div class="plate-type">号牌种类</div>
<div class="engine-number">发动机号</div>
<div class="mobile">手机号</div>
<div class="content">处罚信息</div>
<div class="number">处罚书编号</div>
</div>
<div class="list">
<div class="one" v-for="item in list">
<div class="number-plate">{{item.number_plate}}</div>
<div class="plate-type">{{item.plate_type}}</div>
<div class="engine-number">{{item.engine_number}}</div>
<div class="mobile">{{item.mobile}}</div>
<div class="content">{{item.content}}</div>
<div class="number">{{item.number}}</div>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible2 = false"> </el-button>
<el-button type="primary" @click="dialogVisible2 = false"> </el-button>
</span>
</el-dialog>
</div>
<span>这是违章查询页面</span>
</template>
<script>
export default {
data() {
let plateValidate = (rule,value,callback) =>{
if (value === '') {
callback(new Error('请输入号牌号码'));
}
};
let numberValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入发动机号'));
}
};
let checkValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入验证码'));
}
};
return {
list: [
{
number_plate: '',
plate_type: '',
engine_number: '',
mobile: '',
content: '',
number: '',
}
],
dialogVisible2: false,
illegalForm: {
species:'',
number:'',
lastsix:'',
code:''
},
speciesOptions: [{
value: '大型汽车',
label: '大型汽车'
}, {
value: '小型汽车',
label: '小型汽车'
}, {
value: '教练汽车',
label: '教练汽车'
}, {
value: '教练摩托车',
label: '教练摩托车'
}, {
value: '大型新能源汽车',
label: '大型新能源汽车'
},{
value: '小型新能源汽车',
label: '小型新能源汽车'
}],
numberOptions: [{
value: '京',
label: '京'
}, {
value: '津',
label: '津'
}, {
value: '沪',
label: '沪'
}, {
value: '渝',
label: '渝'
}, {
value: '鲁',
label: '鲁'
}],
speciesValue: '',
numberValue: '',
illegalRules: {
number: [
{ validator: plateValidate, trigger: 'blur' }
],
lastsix: [
{ validator: numberValidate, trigger: 'blur' },
{ min: 6, max: 6, message: '请输入正确格式', trigger: 'blur' }
],
code: [
{ validator: checkValidate, trigger: 'blur' }
]
}
}
},
methods: {
submitForm() {
if (this.speciesValue === '') {
this.$message({
type:'warning',
message: '号牌种类不能为空'
})
} else if ( this.numberValue === '') {
this.$message({
type:'warning',
message: '号牌号码不能为空'
})
} else if ( this.illegalForm.number === '') {
this.$message({
type:'warning',
message: '号牌号码不能为空'
})
} else if ( this.illegalForm.lastsix === '') {
this.$message({
type:'warning',
message: '发动机号不能为空'
})
} else if ( this.illegalForm.code === '') {
this.$message({
type:'warning',
message: '登录密码不能为空'
})
} else if (this.illegalForm.code === JSON.parse(sessionStorage.getItem("userInfo")).user_password) {
this.$ajax.post("/traffic/getIllegalInfo",{plateType: this.speciesValue,
numberPlate: this.numberValue+this.illegalForm.number,engineNumber: this.illegalForm.lastsix},
r=>{
this.list = r;
this.dialogVisible2 = true;
})
} else {
this.$message.error("登录密码不正确");
}
},
resetForm() {
this.speciesValue = '';
this.numberValue = '';
this.illegalForm.number = '';
this.illegalForm.lastsix = '';
this.illegalForm.code = '';
this.numberValue = '';
}
}
}
</script>
<style>
.list .one{
display: flex;
padding: 1rem 0;
border-bottom: 1px solid #EEEEEE;
}
.one .content{
text-align: left;
text-indent: 1rem;
}
.content{
text-align: center;
}
.number-plate{
flex: 1;
}
.plate-type{
flex: 1;
}
.engine-number{
flex: 1;
}
.mobile{
flex: 1;
}
.content{
flex: 3;
}
.number{
flex: 1;
}
.el-dialog__body{
padding: 3rem!important;
}
.content .header{
display: flex;
border-bottom: 1px solid #EEEEEE;
}
.illegal .title{
padding: 0 1rem 1rem 0;
font-weight: bold;
font-size: 1.2rem;
}
.illegal{
background: #FFFFFF;
padding: 1rem;
margin-top: 1.5rem;
}
.el-form {
width:50rem;
}
.inbox {
width: 30rem;
}
.queryBox {
width: 5rem;
}
.numberBox {
width: 24.7rem;
}
</style>

View File

@ -1,25 +1,12 @@
<template>
<div class="leaveinfo">
<div class="message-list">
<div class="message-one" v-for="item in messageList">
<div class="message-content">{{item.content}}</div>
<div class="author">
<span class="name">{{item.real_name}}</span>
<span class="time">{{item.create_time}}</span>
</div>
</div>
</div>
<div class="content">
<div class="input">
<el-input
type="textarea"
:rows="6"
placeholder="请输入内容"
v-model="textarea">
</el-input>
</div>
<el-button type="primary" @click="submitMessage">提交</el-button>
<el-input
type="textarea"
:rows="10"
placeholder="请输入内容"
v-model="textarea">
</el-input>
</div>
</div>
</template>
@ -28,72 +15,15 @@
export default {
data() {
return {
textarea: '',
messageList: [],
}
},
mounted() {
this.getLeaveMessage();
},
methods: {
submitMessage() {
this.$ajax.post("/traffic/insertLeaveMessage",{content:this.textarea,
createId: JSON.parse(sessionStorage.getItem("userInfo")).user_id},r=>{
if (r === 1) {
this.$message({
type: 'success',
message: "留言成功"
})
this.getLeaveMessage();
this.textarea = '';
} else {
this.$message.error("网络异常,请稍后再试")
}
})
},
getLeaveMessage() {
this.$ajax.post("/traffic/getLeaveMessage",{},r=>{
this.messageList = r;
})
textarea: ''
}
}
}
</script>
<style>
.author span:nth-child(1){
margin-right: 1rem;
}
.author{
float: right;
font-size: 0.9rem;
color: #999999;
}
.message-one{
padding: 1rem 0 1.5rem 0;
border-bottom: 1px solid #EEEEEE;
}
.message-content{
padding: 0!important;
margin: 0!important;
}
.leaveinfo{
margin-top: 1.5rem;
}
.message-list{
padding: 1rem;
background: #FFFFFF;
}
.content {
margin-top: 2rem;
}
.input{
width: 50%;
margin: 0 auto;
}
.content .el-button{
display: block;
margin: 1rem auto;
width:31.25rem
}
</style>

View File

@ -1,321 +1,9 @@
<template>
<div class="plate">
<div class="left">
<div class="title">新车登记预选号牌</div>
<el-form :model="plateForm" label-position="left" :rules="plateRules" ref="plateForm" label-width="100px">
<el-form-item label="选择城市">
<el-cascader
v-model="value"
:options="citis"
:props="{ expandTrigger: 'hover' }"
@change="handleChange">
</el-cascader>
</el-form-item>
<div class="plate-number">
<el-radio v-model="plateNumber" :label="item" :key="item" border v-for="item in plateNumbers"></el-radio>
</div>
<el-form-item label="车辆品牌" prop="logo">
<el-input type="text" v-model="plateForm.logo" placeholder="请输入车辆品牌"></el-input>
</el-form-item>
<el-form-item label="合格编号" prop="number">
<el-input type="text" v-model="plateForm.number" placeholder="请输入合格编号"></el-input>
</el-form-item>
<el-form-item label="车辆型号" prop="size">
<el-select v-model="plateForm.size" placeholder="请输入车辆型号">
<el-option value="载货汽车">载货汽车</el-option>
<el-option value="越野汽车">越野汽车</el-option>
<el-option value="自卸汽车">自卸汽车</el-option>
<el-option value="牵引汽车">牵引汽车</el-option>
<el-option value="专用汽车">专用汽车</el-option>
<el-option value=" 客 车 "> </el-option>
<el-option value=" 轿 车 "> 轿 </el-option>
<el-option value=" 未 用 "> </el-option>
<el-option value="半挂车及专用半挂车">半挂车及专用半挂车</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">确认</el-button>
<el-button @click="resetForm">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="right">
<div class="title">
近期挂牌信息
</div>
<el-carousel height="200px" direction="vertical" :autoplay="true">
<el-carousel-item v-for="item in plateList" :key="item.id">
<div class="plate">{{item.plate_number}}</div>
<div class="name">{{item.real_name}}</div>
<div class="time">{{item.create_time}}</div>
</el-carousel-item>
</el-carousel>
</div>
</div>
<span>这是新车预选号牌页面</span>
</template>
<script>
export default {
data() {
let logoValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入车辆品牌'));
}
};
let numberValidate = (rule,value,callback) =>{
if (value === '') {
callback(new Error('请输入合格证编号'));
}
};
let sizeValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入车辆型号'));
}
};
return {
plateList: [],
plateNumbers: [],
plateNumber: '',
value: [],
citis: [
{
value: '北京',
label: '北京',
},
{
value: '天津',
label: '天津',
},
{
value: '上海',
label: '上海',
},{
value: '重庆',
label: '重庆',
},{
value: '山东',
label: '山东',
children: [{
value: '济南市',
label: '济南市'
}, {
value: '青岛市',
label: '青岛市'
}, {
value: '日照市',
label: '日照市'
}, {
value: '淄博市',
label: '淄博市'
}, {
value: '枣庄市',
label: '枣庄市'
}, {
value: '东营市',
label: '东营市'
}, {
value: '烟台市',
label: '烟台市'
}, {
value: '潍坊市',
label: '潍坊市'
}, {
value: '济宁市',
label: '济宁市'
}, {
value: '泰安市',
label: '泰安市'
}, {
value: '威海市',
label: '威海市'
}, {
value: '临沂市',
label: '临沂市'
}, {
value: '德州市',
label: '德州市'
}, {
value: '聊城市',
label: '聊城市'
}, {
value: '滨州市',
label: '滨州市'
}, {
value: '菏泽市',
label: '菏泽市'
}, ]
}],
plateForm: {
logo: '',
number: '',
size:''
},
plateRules: {
logo: [
{ validator: logoValidate, trigger: 'blur' }
],
number: [
{ validator: numberValidate, trigger: 'blur' }
],
size: [
{ validator: sizeValidate, trigger: 'blur' }
]
}
};
},
mounted() {
this.getPlateInfo();
},
methods: {
getPlateInfo() {
this.$ajax.post("/traffic/selectPlateInfo",{},r=>{
this.plateList = r;
})
},
getPlateNumber(address) {
let plate = '';
switch (address) {
case "北京" : plate = "京A·";break;
case "天津" : plate = "津A·";break;
case "重庆" : plate = "渝A·";break;
case "上海" : plate = "沪A·";break;
case "济南市" : plate = "鲁A·";break;
case "青岛市" : plate = "鲁B·";break;
case "日照市" : plate = "鲁L·";break;
case "淄博市" : plate = "鲁C·";break;
case "枣庄市" : plate = "鲁D·";break;
case "东营市" : plate = "鲁E·";break;
case "烟台市" : plate = "鲁F·";break;
case "潍坊市" : plate = "鲁G·";break;
case "济宁市" : plate = "鲁H·";break;
case "泰安市" : plate = "鲁J·";break;
case "威海市" : plate = "鲁K·";break;
case "临沂市" : plate = "鲁Q·";break;
case "德州市" : plate = "鲁N·";break;
case "聊城市" : plate = "鲁P·";break;
case "滨州市" : plate = "鲁M·";break;
case "菏泽市" : plate = "鲁R·";break;
default: ;
}
return plate;
},
getRandom() {
let plateNumber = '';
let codeChars = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G',
'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V',
'W', 'X', 'Y', 'Z'];
for (let i = 0; i < 5; i++) {
let index= Math.floor(Math.random()*36);
plateNumber += codeChars[index];
}
return plateNumber;
},
handleChange(value) {
if (value[1] === '' || value[1] === undefined) {
this.$message({
type: 'warning',
message: '暂时只能为山东地区开放,其他地区敬请开放'
})
} else {
let plateList = [];
for (let i = 0; i < 10; i++) {
let one = this.getPlateNumber(value[1])+this.getRandom();
plateList.push(one)
}
this.plateNumbers = plateList;
}
},
submitForm() {
if (this.plateNumber === '') {
this.$message({
type: 'warning',
message: '号牌号码不能为空'
})
} else if (this.plateForm.logo === '') {
this.$message({
type: 'warning',
message: '车辆品牌不能为空'
})
} else if (this.plateForm.number === '') {
this.$message({
type: 'warning',
message: '合格编号不能为空'
})
} else if (this.plateForm.size === '') {
this.$message({
type: 'warning',
message: '车辆型号不能为空'
})
} else {
this.$ajax.post("/traffic/insertPlateInfo",{
createId:JSON.parse(sessionStorage.getItem("userInfo")).user_id,plateNumber:this.plateNumber,
carBrand: this.plateForm.logo,qualifiedNo:this.plateForm.number,carSize:this.plateForm.size,
carType:"新车"},r=>{
if (r === 1) {
this.$message({
type: 'success',
message: "预选成功"
})
location.reload();
} else {
this.$message.error("网络异常,请稍后再试")
}
})
}
},
resetForm() {
this.value = '';
this.plateForm.logo = '';
this.plateForm.number = '';
this.plateForm.size = '';
}
}
}
</script>
<style>
.el-carousel__item div{
padding: 1rem;
}
.left , .right{
width: 50%;
}
.el-radio:nth-child(1){
margin-left: 10px;
}
.el-radio{
margin-right: 0 !important;
width: 47%;
margin-bottom: 0.5rem;
}
.plate-number{
overflow: auto;
height: 10rem;
border: 1px solid #EEEEEE;
margin-bottom: 1rem;
width: 36rem;
padding: 1rem;
box-sizing: border-box;
}
.plate .title{
padding: 0 1rem 1rem 0;
font-weight: bold;
font-size: 1.2rem;
}
.plate{
display: flex;
background: #FFFFFF;
padding: 1rem;
margin-top: 1.5rem;
}
.el-input {
width: 30rem;
}
</style>

View File

@ -1,27 +0,0 @@
<template>
<el-container>
<el-main>
<img src="../assets/img/no-data.png" height="200" width="200"/>
<div class="nodata">
暂无数据
</div>
</el-main>
</el-container>
</template>
<script>
export default {
name: "NoData"
}
</script>
<style scoped>
.el-main img{
display: block;
margin: 2rem auto 0;
}
.nodata{
text-align: center;
color: #999;
}
</style>

View File

@ -1,49 +0,0 @@
<template>
<div id="content">
<div class="title">{{noticeContent.title}}</div>
<div class="author">{{noticeContent.real_name}} {{noticeContent.create_time}} &nbsp &nbsp</div>
<div class="notice-content">{{noticeContent.content}}</div>
</div>
</template>
<script>
export default {
name: "NoticeContent",
data() {
return{
noticeContent: JSON.parse(sessionStorage.getItem("noticeContent")),
}
},
mounted() {
console.log(this.noticeContent)
},
methods: {
}
}
</script>
<style scoped>
.notice-content{
padding: 1rem;
}
.author{
padding-bottom: 0.2rem;
border-bottom: 1px solid #EEEEEE;
width: 100%;
text-align: right;
color: #999999;
}
.title{
padding: 1rem;
font-size: 1.2rem;
font-weight: bold;
}
#content{
margin: 1.5rem 20%;
background: #FFFFFF;
padding-bottom: 1rem;
min-height: 30rem;
}
</style>

View File

@ -1,332 +1,9 @@
<template>
<div class="plate">
<div class="left">
<div class="title">二手车过户预选号牌</div>
<el-form :model="plateForm" label-position="left" :rules="plateRules" ref="plateForm" label-width="100px">
<el-form-item label="选择城市">
<el-cascader
v-model="value"
:options="citis"
:props="{ expandTrigger: 'hover' }"
@change="handleChange">
</el-cascader>
</el-form-item>
<div class="plate-number">
<el-radio v-model="plateNumber" :label="item" :key="item" border v-for="item in plateNumbers"></el-radio>
</div>
<el-form-item label="车辆品牌" prop="logo">
<el-input type="text" v-model="plateForm.logo" placeholder="请输入车辆品牌"></el-input>
</el-form-item>
<el-form-item label="合格编号" prop="number">
<el-input type="text" v-model="plateForm.number" placeholder="请输入合格编号"></el-input>
</el-form-item>
<el-form-item label="车辆型号" prop="size">
<el-select v-model="plateForm.size" placeholder="请输入车辆型号">
<el-option value="载货汽车">载货汽车</el-option>
<el-option value="越野汽车">越野汽车</el-option>
<el-option value="自卸汽车">自卸汽车</el-option>
<el-option value="牵引汽车">牵引汽车</el-option>
<el-option value="专用汽车">专用汽车</el-option>
<el-option value=" 客 车 "> </el-option>
<el-option value=" 轿 车 "> 轿 </el-option>
<el-option value=" 未 用 "> </el-option>
<el-option value="半挂车及专用半挂车">半挂车及专用半挂车</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm">确认</el-button>
<el-button @click="resetForm">重置</el-button>
</el-form-item>
</el-form>
</div>
<div class="right">
<div class="title">
近期挂牌信息
</div>
<el-carousel height="200px" direction="vertical" :autoplay="true">
<el-carousel-item v-for="item in plateList" :key="item.id">
<div class="plate">{{item.plate_number}}</div>
<div class="name">{{item.real_name}}</div>
<div class="time">{{item.create_time}}</div>
</el-carousel-item>
</el-carousel>
</div>
</div>
<span>这是二手车预选号牌页面</span>
</template>
<script>
export default {
data() {
let logoValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入车辆品牌'));
}
};
let numberValidate = (rule,value,callback) =>{
if (value === '') {
callback(new Error('请输入合格证编号'));
}
};
let sizeValidate = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入车辆型号'));
}
};
return {
plateList: [],
plateNumbers: [],
plateNumber: '',
value: [],
citis: [
{
value: '北京',
label: '北京',
},
{
value: '天津',
label: '天津',
},
{
value: '上海',
label: '上海',
},{
value: '重庆',
label: '重庆',
},{
value: '山东',
label: '山东',
children: [{
value: '济南市',
label: '济南市'
}, {
value: '青岛市',
label: '青岛市'
}, {
value: '日照市',
label: '日照市'
}, {
value: '淄博市',
label: '淄博市'
}, {
value: '枣庄市',
label: '枣庄市'
}, {
value: '东营市',
label: '东营市'
}, {
value: '烟台市',
label: '烟台市'
}, {
value: '潍坊市',
label: '潍坊市'
}, {
value: '济宁市',
label: '济宁市'
}, {
value: '泰安市',
label: '泰安市'
}, {
value: '威海市',
label: '威海市'
}, {
value: '临沂市',
label: '临沂市'
}, {
value: '德州市',
label: '德州市'
}, {
value: '聊城市',
label: '聊城市'
}, {
value: '滨州市',
label: '滨州市'
}, {
value: '菏泽市',
label: '菏泽市'
}, ]
}],
plateForm: {
logo: '',
number: '',
size:''
},
plateRules: {
logo: [
{ validator: logoValidate, trigger: 'blur' }
],
number: [
{ validator: numberValidate, trigger: 'blur' }
],
size: [
{ validator: sizeValidate, trigger: 'blur' }
]
}
};
},
mounted() {
this.getPlateInfo();
},
methods: {
getPlateInfo() {
this.$ajax.post("/traffic/selectPlateInfo",{},r=>{
this.plateList = r;
})
},
getPlateNumber(address) {
let plate = '';
switch (address) {
case "北京" : plate = "京A·";break;
case "天津" : plate = "津A·";break;
case "重庆" : plate = "渝A·";break;
case "上海" : plate = "沪A·";break;
case "济南市" : plate = "鲁A·";break;
case "青岛市" : plate = "鲁B·";break;
case "日照市" : plate = "鲁L·";break;
case "淄博市" : plate = "鲁C·";break;
case "枣庄市" : plate = "鲁D·";break;
case "东营市" : plate = "鲁E·";break;
case "烟台市" : plate = "鲁F·";break;
case "潍坊市" : plate = "鲁G·";break;
case "济宁市" : plate = "鲁H·";break;
case "泰安市" : plate = "鲁J·";break;
case "威海市" : plate = "鲁K·";break;
case "临沂市" : plate = "鲁Q·";break;
case "德州市" : plate = "鲁N·";break;
case "聊城市" : plate = "鲁P·";break;
case "滨州市" : plate = "鲁M·";break;
case "菏泽市" : plate = "鲁R·";break;
default: ;
}
return plate;
},
getRandom() {
let plateNumber = '';
let codeChars = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'A', 'B', 'C', 'D', 'E', 'F', 'G',
'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V',
'W', 'X', 'Y', 'Z'];
for (let i = 0; i < 5; i++) {
let index= Math.floor(Math.random()*36);
plateNumber += codeChars[index];
}
return plateNumber;
},
handleChange(value) {
if (value[1] === '' || value[1] === undefined) {
this.$message({
type: 'warning',
message: '暂时只能为山东地区开放,其他地区敬请开放'
})
} else {
let plateList = [];
for (let i = 0; i < 10; i++) {
let one = this.getPlateNumber(value[1])+this.getRandom();
plateList.push(one)
}
this.plateNumbers = plateList;
}
},
submitForm() {
if (this.plateNumber === '') {
this.$message({
type: 'warning',
message: '号牌号码不能为空'
})
} else if (this.plateForm.logo === '') {
this.$message({
type: 'warning',
message: '车辆品牌不能为空'
})
} else if (this.plateForm.number === '') {
this.$message({
type: 'warning',
message: '合格编号不能为空'
})
} else if (this.plateForm.size === '') {
this.$message({
type: 'warning',
message: '车辆型号不能为空'
})
} else {
this.$confirm('确认预约, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$ajax.post("/traffic/insertPlateInfo",{
createId:JSON.parse(sessionStorage.getItem("userInfo")).user_id,plateNumber:this.plateNumber,
carBrand: this.plateForm.logo,qualifiedNo:this.plateForm.number,carSize:this.plateForm.size,
carType:"二手车"},r=>{
if (r === 1) {
this.$message({
type: 'success',
message: "预选成功"
})
location.reload();
} else {
this.$message.error("网络异常,请稍后再试")
}
})
}).catch(() => {
this.$message({
type: 'info',
message: '已取消预约'
});
});
}
},
resetForm() {
this.value = '';
this.plateForm.logo = '';
this.plateForm.number = '';
this.plateForm.size = '';
}
}
}
</script>
<style>
.el-carousel__item div{
padding: 1rem;
}
.left , .right{
width: 50%;
}
.el-radio:nth-child(1){
margin-left: 10px;
}
.el-radio{
margin-right: 0 !important;
width: 47%;
margin-bottom: 0.5rem;
}
.plate-number{
overflow: auto;
height: 10rem;
border: 1px solid #EEEEEE;
margin-bottom: 1rem;
width: 36rem;
padding: 1rem;
box-sizing: border-box;
}
.plate .title{
padding: 0 1rem 1rem 0;
font-weight: bold;
font-size: 1.2rem;
}
.plate{
display: flex;
background: #FFFFFF;
padding: 1rem;
margin-top: 1.5rem;
}
.el-input {
width: 30rem;
}
</style>

View File

@ -2,16 +2,11 @@
<el-container>
<el-header>
<div class = 'header'>
<div class="login" v-if="!isLogin">
<div class="registerButton pointer" @click='userRegister'>用户注册</div>
<div class="pointer" @click='userLogon'>个人登录</div>
</div>
<div class="is-login" v-if="isLogin">
<div class="personal pointer">{{username}}</div>
<div class="pointer" @click="cancellation">注销</div>
</div>
<el-button class="registerButton" type="text" @click='userRegister'>用户注册</el-button>
<el-dialog :visible.sync='dialogRegisterVisible' width="600px" height="400px">
<el-form :model="registerForm" label-position="left" :rules="registerRules" ref="registerForm" label-width="100px">
<el-form :model="registerForm" :rules="registerRules" ref="registerForm" label-width="100px">
<el-form-item label="用户名" prop="name">
<el-input type="text" v-model="registerForm.name"></el-input>
</el-form-item>
@ -25,13 +20,16 @@
<el-input type="text" v-model="registerForm.phone"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitRegister(registerForm)">注册</el-button>
<el-button type="primary" @click="submitForm('registerForm')">注册</el-button>
<el-button @click="resetForm('registerForm')">重置</el-button>
</el-form-item>
</el-form>
</el-dialog>
<el-dialog :visible.sync='dialogLogonVisible' width="600px" height="400px">
<el-form :model="logonForm" label-position="left" :rules="logonRules" ref="logonForm" label-width="100px">
<el-button type="text" @click='userLogon'>个人登录</el-button>
<el-dialog :visible.sync='dialogLogonVisible' width="400px" height="300px">
<el-form :model="logonForm" :rules="logonRules" ref="logonForm" label-width="100px">
<el-form-item label="用户名" prop="name">
<el-input type="text" v-model="logonForm.name"></el-input>
</el-form-item>
@ -39,7 +37,7 @@
<el-input type="password" v-model="logonForm.pass"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitLogon()">登录</el-button>
<el-button type="primary" @click="submitForm('logonForm')">登录</el-button>
</el-form-item>
</el-form>
</el-dialog>
@ -50,8 +48,8 @@
<el-menu-item index="/index/homepage">首页</el-menu-item>
<el-submenu index="2">
<template slot="title">业务中心</template>
<el-menu-item index="/index/illquery">机动车违章信息查询</el-menu-item>
<el-menu-item index="/index/illprocess">机动车违章处理业务</el-menu-item>
<el-menu-item index="/index/illprocess">违章处理业务</el-menu-item>
<el-menu-item index="/index/illquery">违章信息查询</el-menu-item>
<el-menu-item index="/index/disquery">机动车报废查询</el-menu-item>
</el-submenu>
<el-submenu index="3">
@ -61,13 +59,20 @@
</el-submenu>
<el-menu-item index="/index/leave">在线留言</el-menu-item>
<el-menu-item index="/index/guide">办事指南</el-menu-item>
<el-menu-item index="/index/background">后台管理</el-menu-item>
</el-menu>
</div>
</el-header>
<el-main>
<router-view/>
</el-header>
<el-main>
</el-main>
<el-footer></el-footer>
<el-footer>
</el-footer>
</el-container>
</template>
@ -113,11 +118,9 @@ export default {
};
return {
username: '',
isLogin: false,
userInfo: '',
dialogRegisterVisible:false,
dialogLogonVisible:false,
registerForm: {
name:'',
pass: '',
@ -155,39 +158,9 @@ export default {
}
};
},
mounted() {
this.isLogin1();
},
methods: {
cancellation() {
this.$confirm('确认注销?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
sessionStorage.setItem("userInfo",'');
this.$message({
type: 'success',
message: '注销成功'
});
location.reload()
}).catch(() => {
this.$message({
type: 'info',
message: '已取消注销'
});
});
},
isLogin1() {
if (sessionStorage.getItem("userInfo") === '' ||
sessionStorage.getItem("userInfo") === null) {
this.isLogin = false;
} else {
this.isLogin = true;
this.userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
this.username = JSON.parse(sessionStorage.getItem("userInfo")).real_name;
}
},
userRegister(){
this.dialogRegisterVisible = true;
},
@ -196,32 +169,15 @@ export default {
this.dialogLogonVisible = true;
},
//
submitRegister(formName) {
this.$ajax.post("/traffic/register",{formName},r=>{
if(r===1){
this.dialogRegisterVisible = false;
this.$message({
message: '注册成功!',
type: 'success'
});
} else{
this.$message.error('用户名已存在!');
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
alert('submit!');
} else {
console.log('error submit!!');
return false;
}
},r=>{
this.$message.error('注册失败!');
})
},
//
submitLogon(){
this.$ajax.post("/traffic/logon",{name:this.logonForm.name,pass:this.logonForm.pass},r=>{
sessionStorage.setItem("userInfo",JSON.stringify(r[0]));
this.userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
this.dialogLogonVisible = false;
this.isLogin = true;
this.username = JSON.parse(sessionStorage.getItem("userInfo")).real_name;
})
});
},
resetForm(formName) {
@ -233,28 +189,8 @@ export default {
</script>
<style>
.el-input {
width: 100%;
}
.personal{
margin-right: 1rem;
}
.el-form{
width: 100% !important;
}
.el-dialog__body{
padding: 3rem 5rem!important;
}
.login, .is-login{
display: flex;
float: right;
color: #999999;
}
.el-main div{
border-radius: 5px;
}
.el-container{
min-height: 100%;
height:50rem;
background: linear-gradient(#cee6e6, #f4fafa)
}
@ -264,11 +200,11 @@ export default {
}
.registerButton{
margin-right: 1rem;
margin-left:72rem
}
.menu{
height:4rem;
width:100%
}
</style>

View File

@ -5,28 +5,17 @@ Vue.use(Router)
export default new Router({
routes: [
{
name: '/',
path: '/',
redirect: '/index/homepage',
},
{
path: '/index',
name: 'index',
component:() => import('@/components/Index'),
component:() => import('@/components/index'),
children:[
{
path: 'homepage',
name: 'homepage',
component:() => import('@/components/Homepage')
},
{
path: 'noticecontent',
name: 'noticecontent',
component:() => import('@/components/NoticeContent')
},
{
path: 'illprocess',
name: 'illprocess',
@ -61,6 +50,11 @@ export default new Router({
path: 'guide',
name: 'guide',
component:() => import('@/components/Guide')
},
{
path: 'background',
name: 'background',
component:() => import('@/components/Background')
}
]
}